@charset "UTF-8";
@keyframes fadeIn {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
/* コピペ用
@include media(375px, min) {
数値での指定可能
}
@include media(spM) {
minかmaxを略した場合はmin-widthで展開
}
@include media(spM,max) {
}
*/
/*----------------------------------------------------
数字で見るリアルエステート
-----------------------------------------------------*/
/*--- ヘッダ -------------------*/
.subpageVisual {
  background: url(/common/img/company/data-sv-sp.jpg) no-repeat top right/auto 220px;
  height: 220px;
  margin-bottom: 40px;
}
.subpageVisual .visualH1 span:last-child {
  font-size: 6.5vw;
  text-shadow: 0 1px 1px #fff, 0 0 1px #fff, 1px 0 1px #fff, 0 -1px 1px #fff, -1px -1px 1px #fff, -1px 0 1px #fff;
}
@media screen and (min-width: 768px) {
  .subpageVisual {
    background: url(/common/img/company/data-sv-tab.jpg) no-repeat top right/auto 300px;
    height: 300px;
    margin-bottom: 60px;
  }
}
@media screen and (min-width: 1025px) {
  .subpageVisual {
    background: url(/common/img/company/data-sv-pc.jpg) no-repeat top right/auto 300px;
    height: 300px;
    margin-bottom: 60px;
  }
}

/*--- コンテンツ枠 -------------------*/
@media screen and (min-width: 1025px) {
  .main {
    width: 1100px;
    margin: auto;
    position: relative;
  }
}

/*--- リード文 -------------------*/
.lead-text {
  font-size: 4.2666666667vw;
  font-weight: bold;
  line-height: 2;
  text-align: center;
  margin: 4em auto 5em;
}
@media screen and (min-width: 768px) {
  .lead-text {
    font-size: 24px;
  }
}

/*--- データ枠 -------------------*/
.data-lists {
  margin: auto;
  width: 90%;
}
@media screen and (min-width: 1200px) {
  .data-lists {
    width: 100%;
  }
}
.data-lists ul {
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-template-areas: "area1 area2" "area3 area3" "area4 area5" "area6 area7";
  gap: 15px;
}
@media screen and (min-width: 768px) {
  .data-lists ul {
    gap: 30px;
  }
}
@media screen and (min-width: 1025px) {
  .data-lists ul {
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr;
    grid-template-areas: "area1 area1 area3 area3 area3 area3" "area4 area4 area5 area5 area2 area2" "area6 area6 area6 area7 area7 area7";
  }
}
.data-lists .data-lists-item {
  border: 3px solid #000;
  border-radius: 15px;
  position: relative;
  padding: 12% 6%;
  text-align: center;
  line-height: 1;
  font-family: "Noto Sans JP", sans-serif;
}
@media screen and (min-width: 768px) {
  .data-lists .data-lists-item {
    border-radius: 25px;
  }
}
.data-lists .data-lists-item .data-lists-title {
  font-size: 4.2666666667vw;
  margin: 0 0 0.3em;
}
@media screen and (min-width: 768px) {
  .data-lists .data-lists-item .data-lists-title {
    font-size: 24px;
  }
}
.data-lists .data-lists-num .data-lists-num-title {
  font-size: 2.9333333333vw;
}
@media screen and (min-width: 768px) {
  .data-lists .data-lists-num .data-lists-num-title {
    font-size: 24px;
  }
}
.data-lists .data-lists-num .data-lists-num-value {
  color: #EF8F00;
  font-size: 11.4666666667vw;
  font-weight: 700;
}
@media screen and (min-width: 768px) {
  .data-lists .data-lists-num .data-lists-num-value {
    font-size: 100px;
  }
}
.data-lists .data-lists-num .data-lists-num-unit {
  color: #EF8F00;
  font-size: 3.7333333333vw;
  font-weight: 400;
}
@media screen and (min-width: 768px) {
  .data-lists .data-lists-num .data-lists-num-unit {
    font-size: 32px;
  }
}
.data-lists .data-lists-kome {
  position: absolute;
  bottom: 6%;
  right: 6%;
  font-size: 2.6666666667vw;
  font-weight: 400;
}
@media screen and (min-width: 768px) {
  .data-lists .data-lists-kome {
    font-size: 16px;
  }
}

/*--- データ枠：個別 -------------------*/
.data-lists ul .data-lists-item__employees {
  grid-area: area1;
}
.data-lists ul .data-lists-item__employees .data-lists-img {
  width: 95%;
  margin: 6% auto 12%;
}
.data-lists ul .data-lists-item__age {
  grid-area: area2;
}
.data-lists ul .data-lists-item__age .data-lists-img {
  width: 75%;
  margin: 10% auto auto;
}
.data-lists ul .data-lists-item__gender {
  grid-area: area3;
  padding: 6% 3% 3%;
}
.data-lists ul .data-lists-item__gender .data-lists-layout {
  display: grid;
  place-content: center;
  place-items: center;
  grid-template-columns: auto auto auto;
  gap: 10px;
}
.data-lists ul .data-lists-item__gender .data-lists-layout .data-lists-num-title {
  text-indent: -1em;
}
.data-lists ul .data-lists-item__gender .data-lists-layout .data-lists-num:first-of-type .data-lists-num-value,
.data-lists ul .data-lists-item__gender .data-lists-layout .data-lists-num:first-of-type .data-lists-num-unit {
  color: #F8B62D;
}
.data-lists ul .data-lists-item__gender .data-lists-layout .data-lists-img {
  width: 35vw;
  max-width: 360px;
}
@media screen and (min-width: 768px) {
  .data-lists ul .data-lists-item__gender .data-lists-layout .data-lists-img {
    max-width: 290px;
  }
}
.data-lists ul .data-lists-item__gender .data-lists-kome {
  bottom: 6%;
  right: 3%;
}
.data-lists ul .data-lists-item__joining {
  grid-area: area4;
}
.data-lists ul .data-lists-item__joining .data-lists-img {
  margin: -32px auto 10%;
}
.data-lists ul .data-lists-item__sales {
  grid-area: area5;
}
.data-lists ul .data-lists-item__sales .data-lists-img {
  width: 55%;
  margin: 10% auto 8%;
}
.data-lists ul .data-lists-item__group {
  grid-area: area6;
}
.data-lists ul .data-lists-item__group .data-lists-img {
  margin: 10% auto auto;
}
.data-lists ul .data-lists-item__holiday {
  grid-area: area7;
}
.data-lists ul .data-lists-item__holiday .data-lists-img {
  margin: 20% auto auto;
}/*# sourceMappingURL=company_data.css.map */