@charset "utf-8";

/* ::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::

	file name : group.css

 : :::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::: */
div.box_osakakokusai {
  border: solid 1px #d0d0d0;
  background: url(../img/group/bg_osakakokusai.jpg) no-repeat 20px 80px;
  background-size: calc(100% - 40px);
  width: 100%;
  aspect-ratio: 35/33;
  padding: 20px;
}

div.box_osakakokusaitanki {
  border: solid 1px #d0d0d0;
  background: url(../img/group/bg_osakakokusaitanki.jpg) no-repeat 20px 80px;
  background-size: calc(100% - 40px);
  width: 100%;
  aspect-ratio: 35/33;
  padding: 20px 20px 80px;
  position: relative;
}

div.box_takii {
  border: solid 1px #d0d0d0;
  background: url(../img/group/bg_takii.jpg) no-repeat 20px 80px;
  background-size: calc(100% - 40px);
  width: 100%;
  aspect-ratio: 35/33;
  padding: 20px 20px 80px;
  position: relative;
}

div.box_owada {
  border: solid 1px #d0d0d0;
  background: url(../img/group/bg_owada.jpg) no-repeat 20px 80px;
  background-size: calc(100% - 40px);
  width: 100%;
  aspect-ratio: 35/38;
  padding: 20px 20px 80px;
  position: relative;
}

div.box_owadatyu {
  border: solid 1px #d0d0d0;
  background: url(../img/group/bg_owadatyu.jpg) no-repeat 20px 80px;
  background-size: calc(100% - 40px);
  width: 100%;
  aspect-ratio: 35/38;
  padding: 20px 20px 80px;
  position: relative;
}

div.box_owadayouchi {
  border: solid 1px #d0d0d0;
  background: url(../img/group/bg_owadayouchi.jpg) no-repeat 20px 80px;
  background-size: calc(100% - 40px);
  width: 100%;
  aspect-ratio: 35/38;
  padding: 20px 20px 110px;
  position: relative;
}

p.txt {
  margin: 100px 0 0 0;
  font-size: 90%;
}

p.txt2 {
  margin: 100px 0 0 0;
  font-size: 90%;
}

p.link {
  background: url(../../common/img/arrow_blue.gif) no-repeat 0 50%;
  padding: 0 0 0 10px;
  position: absolute;
  bottom: 20px;
  left: 20px;
}

.groupBox {
  display: flex;
  align-items: flex-start;
  flex-wrap: wrap;
  column-gap: 2%;
  row-gap: 15px;
}
.groupBox li {
  width: 32%;
}

.stxt {
  font-size: 90%;
}

@media (max-width: 768px) {
  .groupBox li {
    width: 100%;

    div {
      aspect-ratio: auto;
      padding-bottom: 5em;
    }
  }
}