.thepage .p-head {
  background-image: url(../img/culture/hero@2x.jpg);
}

main .sec-top {
  padding-bottom: 100px;
}
.wt-env {
  margin-top: 100px;
}
.env-desc {
  height: 100%;
  display: flex;
  align-items: center;
}
.env-desc .inn {
  font-size: 18px;
  line-height: 40px;
}
.env-desc .hl {
  color:#F6AA00;
}
.env-desc .un {
  display: inline-block;
  position: relative;
}
.env-desc .un:after {
  content:"";
  position: absolute;
  left: 0;
  bottom: 2px;
  height: 3px;
  width: 100%;
  background: #F6AA00;
}
.et {
  text-align: center;
  margin-bottom: 100px;
}
.et h2 {
  font-size: 36px;
  line-height: 50px;
}
.et h2 .hl {
  color:#fff;
  background: #F6AA00;
}
#m1, #m2 {
  padding:100px 0;
}
.row-gi {
  margin-bottom: 50px;
}
.row-gi>div {
  margin-bottom: 30px;
}
.gi-box {
  padding:25px 37px 38px;
  background: #fff;
  box-shadow: 3px 3px 0 #F6AA00;
  height: 100%;
}
.gi-box .t {
  margin-bottom: 30px;
}
.gi-box .t>div {
  display: inline-block;
  vertical-align: middle;
}
.gi-box .t .n {
  margin-left: 18px;
  font-size: 20px;
  line-height: 30px;
  font-weight: 600;
}
.gi-box .txt {
  font-size: 15px;
}

.row-gi2 {
  text-align: center;
}
.row-gi2 figcaption {
  margin-top: 15px;
  line-height: 25px;
}

.row-bene {
  margin-bottom: -24px;
}
.row-bene>div {
  margin-bottom: 24px;
}
.row-bene .bene {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 436px;
  width: 436px;
  margin:auto;
  border-radius: 50%;
  padding:10px;
}
.bene .t {
  text-align: center;
  font-weight: 600;
  font-size: 22px;
  line-height: 30px;
  margin-bottom: 20px;
}
.bene .ic {
  margin-bottom: 15px;
  text-align: center;
}
.bene .txt {
  font-size: 14px;
  line-height: 28px;
  max-width: 280px;
  margin:auto;
}

.work-env {
  position: relative;
}
.work-env .we-rel {
  background: #484545;
  height: 100%;
}
.work-env .w1 {
  width: 66.66666%;
}
.we-rel .inn {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100%;
}
.work-env .wl2>.we-l {
  width: 25%;
}
.work-env .wl2 .wc {
  width: 50%;
  position: relative;
}
.wc-cont {
  position: absolute;
  bottom: 0;
  left:0;
  background: #F6AA00;
  padding:20px;
  width: 100%;
  height: 43.5vw;

  display: flex;
  justify-content: center;
  align-items: center;
}
.wc-cont .c-inn {
  max-width: 450px;
}
.wc-cont .t {
  margin-bottom: 60px;
  text-align: center;
  font-size: 36px;
  line-height: 52px;
  font-weight: 600;
}
.wc-cont .t .hl {
  color:#fff;
  background: #484545;
}
.wc-cont .txt {
  color:#fff;
  font-size: 18px;
  line-height: 36px;
}

@media (max-width: 1199px) {
  .cate-row>.col {
    width: 33.33333%;
  }
  .gi-box {
    padding:22px 28px;
  }
  .gi-box .t {
    margin-bottom: 20px;
  }
  .gi-box .t .ic img {
    width: 70px;
  }
  .gi-box .t .n {
    margin-left: 10px;
  }
}
@media (max-width: 992px) {
  main .sec-top {
    padding-bottom: 80px;
  }
  #m1, #m2 {
    padding:80px 0;
  }
  .et {
    margin-bottom: 60px;
  }
  .row-gi2>div {
    margin-bottom: 30px;
  }
  .wc-cont .txt {
    font-size: 14px;
    line-height: 28px;
  }
  .wc-cont .t {
    margin-bottom: 18px;
    font-size: 24px;
    line-height: 38px;
  }
}
@media (max-width: 767px) {
  .thepage .p-head {
    background-image: url(../img/culture/SP/hero@2x.jpg);
  }
  .btn.pt-cate {
    font-size: 12px;
    padding-left: 50px;
  }
  .wt-env {
    margin-top: 40px;
  }
  #m1, #m2 {
    padding:40px 0;
  }
  .et {
    margin-bottom: 30px;
  }
  .et h2 {
    font-size: 26px;
    line-height: 40px;
  }
  .gi-box .t {
    margin-bottom: 15px;
  }

  .env-desc .inn {
    font-size: 16px;
    line-height: 38px;
    margin-bottom: 20px;
  }

  .row-bene .bene {
    width: 90vw;
    height: 90vw;
    max-width: 450px;
    max-height: 450px;
  }
  .bene .inn {
    margin-top: -25px;
  }
  .bene .t {
    font-size: 16px;
    line-height: 24px;
    margin-bottom: 10px;
  }
  .bene .ic {
    margin-bottom: 8px;
  }
  .bene .ic img {
    max-width: 100px;
  }
  .bene .txt {
    font-size: 13px;
    line-height: 25px;
    max-width: 240px;
  }

  .wc-cont.sp {
    position: relative;
    height: auto;
    padding:60px 40px;
  }
  .wc-cont .t {
    margin-bottom: 30px;
  }
  .wc-cont .txt {
    font-size: 16px;
    line-height: 32px;
  }
  .work-env .wl1 {
    flex-wrap: wrap;
  }
  .work-env .w1 {
    width: 100%;
  }
  .work-env .w2 {
    width: 100%;
  }
  .work-env .we-rel {
    height: 220px;
  }
  .work-env .wl2>.we-l {
    width: 50%;
  }


}