/*
 * 「次世代型データセンター」プロジェクト
 */
/* common */
.gf-root-section{
  background-color: #FFFFFF;
}
.gf-subpage09 h3{
  color: #077B1C;
  font-size: 25px;
  font-weight: bold;
  line-height: 1.5;
}
.gf-subpage09 h4{
  color: #077B1C;
  font-size: 22px;
  font-weight: bold;
  line-height: 1.5;
}
@media screen and (max-width: 767px){
  .gf-subpage09 h3{
    font-size: 18px;
  }
  .gf-subpage09 h4{
    font-size: 18px;
  }
}

@media screen and (max-width: 767px){
  .gf-subpage09 h2{
    font-size: 20px;
    margin-top: 0;
    margin-bottom: 30px;
    text-align: left;
    width: 100%;
  }
}

/* Utility */
.gf-subpage09-mt-1{margin-top: -1px;}
.gf-subpage09-mt-2{margin-top: -2px;}
.gf-subpage09-mt-10{margin-top: -10px;}
.gf-subpage09-mt-20{margin-top: -20px;}
.gf-subpage09-mt-30{margin-top: -30px;}
.gf-subpage09-mt-50{margin-top: -50px;}
.gf-subpage09-mt5{margin-top: 5px;}
.gf-subpage09-mt15{margin-top: 15px;}
.gf-subpage09-mt20{margin-top: 20px;}
.gf-subpage09-mt25{margin-top: 25px;}
.gf-subpage09-mt30{margin-top: 30px;}
.gf-subpage09-mt168{margin-top: 168px;}
.gf-subpage09-ml-20{margin-left: -20px;}
.gf-subpage09-ml-40{margin-left: -40px;}
.gf-subpage09-mr-40{margin-right: -40px;}
.gf-subpage09-ml5{margin-left: 5px;}
.gf-subpage09-ml7{margin-left: 7px;}
.gf-subpage09-ml10{margin-left: 10px;}
.gf-subpage09-ml20{margin-left: 20px;}
.gf-subpage09-ml25{margin-left: 25px;}
.gf-subpage09-ml30{margin-left: 30px;}
.gf-subpage09-ml40{margin-left: 40px;}
.gf-subpage09-ml50{margin-left: 50px;}
.gf-subpage09-ml60{margin-left: 60px;}
.gf-subpage09-ml90{margin-left: 90px;}
.gf-subpage09-ml200{margin-left: 200px;}
.gf-subpage09-ml430{margin-left: 430px;}
.gf-subpage09-ml5per{margin-left: 5%;}
.gf-subpage09-ml8per{margin-left: 8%;}
.gf-subpage09-ml10per{margin-left: 10%;}
.gf-subpage09-ml12per{margin-left: 12%;}
.gf-subpage09-ml15per{margin-left: 15%;}
.gf-subpage09-mr5per{margin-right: 5%;}
.gf-subpage09-mr8per{margin-right: 8%;}
.gf-subpage09-mr10{margin-right: 10px;}
.gf-subpage09-mr20{margin-right: 20px;}
.gf-subpage09-mb-100{margin-bottom: -100px;}
.gf-subpage09-mb5{margin-bottom: 5px;}
.gf-subpage09-mb10{margin-bottom: 10px;}
.gf-subpage09-mb15{margin-bottom: 15px;}
.gf-subpage09-mb20{margin-bottom: 20px;}
.gf-subpage09-mb40{margin-bottom: 40px;}
.gf-subpage09-mb60{margin-bottom: 60px;}
.gf-subpage09-mb80{margin-bottom: 80px;}
.gf-subpage09-img80{width: 80%;}
.gf-subpage09-img85{width: 85%;}
.gf-subpage09-img70{width: 70%;}
.gf-subpage09-img60{width: 60%;}
.gf-subpage09-img50{width: 50%;}
.gf-subpage09-img55{width: 55%;}
.gf-subpage09-img46{width: 46%;}
.gf-subpage09-img45{width: 45%;}
.gf-subpage09-img40{width: 40%;}
.gf-subpage09-img30{width: 30%;}
.gf-subpage09-img25{width: 25%;}
.gf-subpage09-img20{max-width: 20%;}
.gf-subpage09-img15{width: 15%;}
.gf-subpage09-img10{max-width: 10%;}
.gf-subpage09-width-580{max-width: 580px;}
.gf-subpage09-width-530{max-width: 530px;}
.gf-subpage09-width-510{max-width: 510px;}
.gf-subpage09-width-480{max-width: 420px;}
.gf-subpage09-width-420{max-width: 420px;}
.gf-subpage09-width-400{max-width: 400px;}
.gf-subpage09-width-380{max-width: 380px;}
.gf-subpage09-width-330{max-width: 330px;}
.gf-kv-subpage09-clr01{background-color: #f3f4f6;}
.gf-kv-subpage09-clr02{background-color: #ffffff;}

.gf-subpage09-img80{width: 80%;}
.gf-subpage09-img85{width: 85%;}
.gf-subpage09-img70{width: 70%;}
.gf-subpage09-img46{width: 46%;}
.gf-subpage09-img50{width: 50%;}
.gf-subpage09-img55{width: 55%;}
.gf-subpage09-img60{width: 60%;}

@media screen and (max-width: 767px){
  .gf-subpage09-spmr0{margin-right: 0;}
  .gf-subpage09-spml0{margin-left: 0;}
  .gf-subpage09-spml-20{margin-left: -20px;}
  .gf-subpage09-spml5per{margin-left: 5%;}
  .gf-subpage09-spml10per{margin-left: 10%;}
  .gf-subpage09-spml15per{margin-left: 15%;}
  .gf-subpage09-spml60per{margin-left: 60%;}
  .gf-subpage09-spml65per{margin-left: 65%;}
  .gf-subpage09-spmr10per{margin-right: 10%;}
  .gf-subpage09-spmr15per{margin-right: 15%;}
  .gf-subpage09-spmb-50{margin-bottom: -50px;}
  .gf-subpage09-spmb0{margin-bottom: 0;}
  .gf-subpage09-spmb10{margin-bottom: 10px;}
  .gf-subpage09-spmb20{margin-bottom: 20px;}
  .gf-subpage09-spmb40{margin-bottom: 40px;}
}

.gf-subpage09-text-large{
  color: #077B1C;
  font-size: 20px;
}
.gf-subpage09-text-regular{
  color: #077B1C;
  font-size: 16px;
  line-height: 2.1;
}
.gf-subpage09-text-small{
  color: #077B1C;
  font-size: 15px;
  line-height: 1.6;
}
.gf-subpage09-text-question{
  color: #668ebd;
  font-size: 12px;
  line-height: 1.0;
}
.gf-subpage09-text-notes{
   color: #077B1C;
  font-size: 12px;
  line-height: 1.5;
  margin-top: 5px;
}

.gf-subpage09-text-large a,
.gf-subpage09-text-regular a,
.gf-subpage09-text-small a{
  text-decoration: underline;
}

@media screen and (max-width: 767px){
  .gf-subpage09-text-large{
    font-size: 18px;
  }
  .gf-subpage09-text-copyright{
    color: #077B1C;
    font-size: 12px;
    margin-top: 0;
  }
}

/* KV */
.gf-kv-subpage09{
  height: auto;
  margin: 0 0 0px 100px;
   background-color: #ffffff;
}
.gf-subpage09-kv{
  background-image: url(../img/gf_subpage09_img01.webp);
  background-position-y: 30%;
  background-repeat: no-repeat;
  background-size: 100% auto;
  height: 52vw;
  margin: 0 10%;
  margin-bottom: 15px;
}
.gf-subpage09-kv .gf-subpage09-kv-in{
  font-weight: bold;
  margin-left: auto;
  margin-right: 0;
  position: relative;
  text-align: right;
}
.gf-subpage09-kv-text01{
  color: #077B1C;
  font-size: 1.4vw;
  position: relative;
  top: 32vw;
  margin-right: 3.2%;
}
.gf-subpage09-kv-text02{
  position: relative;
  top: 33vw;
  right: 3%;
}
.gf-subpage09-kv-text02 span{
  background-color: #FFFFFF;
  border: 2px solid #077B1C;
  color: #077B1C;
  display: inline-block;
  font-size: 1.6vw;
  padding: 10px;
}
.gf-subpage09-kv-h1{
  color: #FFFFFF;
  display: block;
  font-size: 2.5vw;
  position: relative;
  top: 33vw;
  right: 3%;
}
.gf-subpage09-kv-h1 span{
  background-color: #077B1C;
  display: inline-block;
  padding: 10px;
}
.gf-subpage09-kv-lead{
  color: #077B1C;
  display: inline-block;
  font-size: 1.05vw;
  font-weight: normal;
  line-height: 1.8;
  position: relative;
  text-align: left;
  top: 33.5vw;
  width: 45%;
  right: 3%;
}
.gf-subpage09-kv-note{
  position: relative;
  width: 16%;
  left: 10%;
  top: 12vw;
  visibility: hidden;
}
@media screen and (max-width: 767px){
  .gf-kv-subpage09{
    margin: 0 0 2vw 5.86vw;
  }
  .gf-subpage09-kv{
    background-image: url(../img/gf_subpage09_img01_sp.webp);
    background-size: 95% auto;
    background-position: right 0;
    height: auto;
    margin: 0;
    padding-top: 30%;
    margin-bottom: 20px;
  }
  .gf-subpage09-kv .gf-subpage09-kv-in{
    margin-left: 11%;
    margin-right: auto;
    position: static;
    width: 85%;
  }
  .gf-subpage09-kv-text01{
    color: #077B1C;
    font-size: 18px;
    margin-bottom: 100px;
    position: relative;
    text-align: right;
    margin-right: 0;
    text-shadow:
    1px 1px 0 #FFF, -1px -1px 0 #FFF,
    -1px 1px 0 #FFF, 1px -1px 0 #FFF,
    0px 1px 0 #FFF,  0-1px 0 #FFF,
    -1px 0 0 #FFF, 1px 0 0 #FFF;
    top: 15vw;
  }
  .gf-subpage09-kv-text02{
    position: relative;
    text-align: right;
    top: 3vw;
    right: 0;
  }
  .gf-subpage09-kv-text02 span{
    font-size: 15px;
  }
  .gf-subpage09-kv-h1{
    font-size: 20px;
    margin-left: auto;
    margin-top: 23px;
    position: static;
    text-align: right;
    top: initial;
  }
  .gf-subpage09-kv-h1-01{
    margin-left: 224px;
    margin-bottom: 0px;
  }
  .gf-subpage09-kv-h1-02{
    margin-left: 364px;
    margin-bottom: 0px;
    margin-top: 0px;
  }
  .gf-subpage09-kv-lead{
    display: block;
    font-size: 16px;
    line-height: 2.0;
    margin: 2vh auto;
    position: static;
    top: initial;
    margin-top: 70%;
    width: 100%;
  }
  .gf-subpage09-kv-lead--notes{
    font-size: 13px;
    line-height: 1.5;
  }
  .gf-subpage09-kv-bottom{
    top: 0px;
    margin-left: 5vw;
  }
  .gf-subpage09-kv-bottom img{
    width: 75%;
  }
  .gf-subpage09-kv-bottom--copy{
    top: 10px;
    margin-left: 40vw;
    font-size: 16px;
  }
}

/* プロジェクトメンバー */
.projectMember{
  margin: -5% 20% 0;
  max-width: 820px;
  object-fit: contain;
}
.projectMember picture{
  display: block;
}

@media screen and (max-width: 767px){
  .projectMember{
    margin: 0 auto;
    width: 100%;
    padding-top: 10%;
    padding-bottom: 20%;
    background-color: #f3f4f6;
  }
  .projectMember img{
    width: 100%;
  }
}

@media screen and (max-width: 767px){
  .gf-subpage09-interview{
    margin: 0px auto;
  }
  .gf-subpage09-interview img{
    margin-bottom: 2vw;
    width: 80%;
  }
  .gf-subpage09-stoty-interview-column{
    display:block;
    width: 100%;
    margin: 0 auto;
    padding-top: 10px;
    padding-bottom: 2.5vw;
  }
  .gf-subpage09-stoty-interview-column img{
    width: 100%;
    margin: 0;
    padding: 0;
    overflow: hidden;
    position: relative;
  }
}

/* インタビュー */
.section_01{
  background-image: url("../img/gf_subpage09_img03.webp");
  background-color: #c8e4cd;
  background-repeat: no-repeat;
  background-size: contain;
  padding-bottom: 10%;
}
.section_02{
  background-image: url("../img/gf_subpage09_img14.webp");
  background-color: #f3f4f6;
  background-repeat: no-repeat;
  background-size: contain;
  padding-top: 8%;
  padding-bottom: 20%;
}
.section_03{
  background-image: url("../img/gf_subpage09_img25.webp");
  background-color: #c8e4cd;
  background-repeat: no-repeat;
  background-size: contain;
  padding-top: 8px;
  padding-bottom: 10%;
}
.section_04{
  background-image: url("../img/gf_subpage09_img40.webp");
  background-color: #f3f4f6;
  background-repeat: no-repeat;
  background-size: contain;
  padding-top: 8%;
  padding-bottom: 20%;
}
@media screen and (min-width: 767px) and (max-width: 900px){
  .section_01{
    padding-bottom: 15%;
  }
  .section_02{
    padding-bottom: 20%;
  }
  .section_03{
    padding-bottom: 10%;
  }
  .section_04{
    padding-bottom: 20%;
  }
}

.gf-subpage09-interview{
  top: 33vh;
  margin: 0 auto;
  max-width: 810px;
}
.section_01 .gf-subpage09-interview{
  padding-top: 4%;
}
.section_02 .gf-subpage09-interview,
.section_03 .gf-subpage09-interview,
.section_04 .gf-subpage09-interview{
  padding-top: 3%;
}
@media screen and (min-width: 1360px){
  .section_01 .gf-subpage09-interview{
    top: 38vh;
  }
  .section_02 .gf-subpage09-interview,
  .section_03 .gf-subpage09-interview,
  .section_04 .gf-subpage09-interview{
    top: 35vh;
  }
}
@media screen and (min-width: 1100px) and (max-width: 1170px){
  .section_01 .gf-subpage09-interview{
    padding-top: 2%;
  }
  .section_02 .gf-subpage09-interview,
  .section_03 .gf-subpage09-interview,
  .section_04 .gf-subpage09-interview{
    padding-top: 1%;
  }
}
@media screen and (min-width: 1100px) and (max-width: 1170px){
  .section_01 .gf-subpage09-interview{
    padding-top: 2%;
  }
  .section_02 .gf-subpage09-interview,
  .section_03 .gf-subpage09-interview,
  .section_04 .gf-subpage09-interview{
    padding-top: 1%;
  }
}
@media screen and (max-width: 1099px){
  .section_01 .gf-subpage09-interview{
    top: 22vh;
    padding-top: 2%;
  }
  .section_02 .gf-subpage09-interview,
  .section_03 .gf-subpage09-interview,
  .section_04 .gf-subpage09-interview{
    top: 22vh;
    padding-top: 0;
  }
}
.gf-subpage09-interview img{
  width: 100%;
}
.text-interview--a{
  color: #077B1C;
  font-size: 16px;
  line-height: 1.5;
}
.text-interview--q{
  color: #668ebd;
  font-size: 16px;
  line-height: 1.5;
}
.text-container-e{
  position: relative;
  padding-top: 20px;
  padding-bottom: 20px;
}
.text-container-f{
  position: relative;
  padding-bottom: 20px;
}
.text-container-f-note{
  position: relative;
  padding-bottom: 5px;
}
.text-container{
  position: relative;
  padding-bottom: 20px;
  margin: 0 auto;
}

.top-left{
  position: absolute;
  top: 50%;
  left: 150px;
  transform: translateY(-50%);
}
.top-right{
  position: absolute;
  top: 50%;
  right: 180px;
  width: 530px;
  transform: translateY(-50%);
}
.gf-subpage09-interview--inner_img{
  width: 70%;
  position: relative;
  margin: 0 auto;
  padding-bottom: 10px;
}

@media screen and (max-width: 767px){
  /* インタビュー */
  .section_01{
    padding-top: 580px;
    padding-bottom: 20%;
      margin: 0 auto;
  }
  .section_02{
    background-size: contain;
    padding-top: 8%;
    padding-bottom: 20%;
    width: 480px;
  }
  .section_03{
    background-size: contain;
    padding-top: 8px;
    padding-bottom: 15%;
    width: 480px;
  }
  .section_04{
    background-size: contain;
    padding-top: 8%;
    padding-bottom: 25%;
    width: 480px;
  }

  .gf-subpage09-interview{
    top: 42vh;
    margin: 0 auto;
    max-width: 810px;
  }
  .gf-subpage09-interview img{
    width: 100%;
    padding: 10px 0px;
  }
  .text-interview--a{
    color: #077B1C;
    font-size: 16px;
    line-height: 1.5;
  }
  .text-interview--q{
    color: #668ebd;
    font-size: 14px;
    line-height: 1.5;
  }
  .text-container-e{
    position: relative;
    padding-top: 20px;
    padding-bottom: 20px;
  }
  .text-container-f{
    position: relative;
    padding-bottom: 20px;
  }
  .text-container-f-note{
    position: relative;
    padding-bottom: 5px;
  }
  .text-container{
    position: relative;
    padding-bottom: 20px;
    margin: 0 auto;
  }

  .top-left{
    position: absolute;
    top: 25px;
    left: 150px;
  }
  .top-right{
    position: absolute;
    top: 30px;
    right: 180px;
    width: 530px;
  }
  .gf-subpage09-interview--inner_img{
    width: 70%;
    position: relative;
    margin: 0 auto;
    padding-bottom: 10px;
  }
}

/* 編集後記 */
.gf-subpage09-editors_note{
  position: relative;
  margin: 30px auto;
  padding-bottom: 2%;
  max-width: 780px;
  padding-top: 40px;
}
.gf-subpage09-editors_note_img{
  max-width: 860px;
  margin: 0px auto;
}
.top-right--note{
  position: absolute;
  top: 57%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 90%;
  line-height: 1.5;
}
@media screen and (max-width: 767px){
  .gf-subpage09-editors_note{
    position: relative;
    margin: 30px auto;
    padding-bottom: 2%;
    max-width: 460px;
    padding-top: 40px;
  }
  .gf-subpage09-editors_note_img{
    max-width: 460px;
    margin: 0px auto;
  }
  .top-right--note{
    position: absolute;
    top: 54%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 80%;
    line-height: 2.5;
  }
}

/* top link */
.gf-totop__link{
  color: #077B1C;
}

/* SP */
.pcView{
  display: block;
}
.spView{
  display: none;
}
@media screen and (max-width: 767px) {
  .pcView{
    display: none;
  }
  .spView{
    display: block;
  }
}