@charset "UTF-8";
/* BATHスタイル */
/* ---------------------------------------
   mainArea
   --------------------------------------- */
#contentsMainArea .bgBox {
    background: url(../img/research/img_main.jpg) no-repeat center center/cover;
}

/* ---------------------------------------
   area01
   --------------------------------------- */
#area01 .waveTop {
    height: 82px;
}
#area01 .waveBottom {
    height: 82px;
}
#area01 .wrap {
    background-color: #D9ECFF;
}
#area01 .inner {
    padding: 50px 20px;
    box-sizing: border-box;
}
#area01 h3 {
    margin-bottom: 50px;
    text-align: center;
}
#area01 .lead {
    width: 720px;
    margin: 0 auto 50px;
    font-size: 16px;
    text-align: center;
}
#area01 .imgSetBox {
    height: 460px;
    margin-bottom: 35px;
}
#area01 .imgSetBox .imgSetInner {
    height: 280px;
}
#area01 .imgSetBox.bx1 {
    background: url(../img/research/area01_img01.jpg) no-repeat left top;
}
#area01 .imgSetBox.bx1 .imgSetInner {
    opacity: 0;
    -webkit-transform: translateX(100px);
    -ms-transform: translateX(100px);
    transform: translateX(100px);
    -webkit-transition: all 1s ease;
    transition: all 1s ease;
}
#area01 .imgSetBox.bx1 .imgSetInner.is-inview {
    opacity: 1;
    -webkit-transform: translateX(0px);
    -ms-transform: translateX(0px);
    transform: translateX(0px);
}
#area01 .imgSetBox.bx2 {
    background: url(../img/research/area01_img02.jpg) no-repeat right top;
}
#area01 .imgSetBox.bx2 .imgSetInner {
    opacity: 0;
    -webkit-transform: translateX(-100px);
    -ms-transform: translateX(-100px);
    transform: translateX(-100px);
    -webkit-transition: all 1s ease;
    transition: all 1s ease;
}
#area01 .imgSetBox.bx2 .imgSetInner.is-inview {
    opacity: 1;
    -webkit-transform: translateX(0px);
    -ms-transform: translateX(0px);
    transform: translateX(0px);
}
#area01 .imgSetBox.bx3 {
    background: url(../img/research/area01_img03.jpg) no-repeat left top;
}
#area01 .imgSetBox.bx3 .imgSetInner {
    opacity: 0;
    -webkit-transform: translateX(100px);
    -ms-transform: translateX(100px);
    transform: translateX(100px);
    -webkit-transition: all 1s ease;
    transition: all 1s ease;
}
#area01 .imgSetBox.bx3 .imgSetInner.is-inview {
    opacity: 1;
    -webkit-transform: translateX(0px);
    -ms-transform: translateX(0px);
    transform: translateX(0px);
}
#area01 .imgSetBox.bx4 {
    background: url(../img/research/area01_img04.jpg) no-repeat right top;
}
#area01 .imgSetBox.bx4 .imgSetInner {
    opacity: 0;
    -webkit-transform: translateX(-100px);
    -ms-transform: translateX(-100px);
    transform: translateX(-100px);
    -webkit-transition: all 1s ease;
    transition: all 1s ease;
}
#area01 .imgSetBox.bx4 .imgSetInner.is-inview {
    opacity: 1;
    -webkit-transform: translateX(0px);
    -ms-transform: translateX(0px);
    transform: translateX(0px);
}

@media only screen and (max-width: 768px) {
  .pc {
        display: none !important;
  }

  /* ---------------------------------------
     mainArea
     --------------------------------------- */
  #contentsMainArea .bgBox {
        background: url(../img/research/img_main.jpg) no-repeat center center/100% auto;
  }

  /* ---------------------------------------
     area01
     --------------------------------------- */
  #area01 .inner {
        padding: 20px 10px;
  }
  #area01 h3 {
        margin-bottom: 20px;
  }
  #area01 h3 img {
        width: auto;
        height: 50px;
  }
  #area01 .lead {
        width: auto;
        margin: 0 auto 20px;
        font-size: 14px;
        text-align: left;
  }
  #area01 .imgSetBox {
        height: auto;
        margin-bottom: 35px;
        padding-top: 75%;
  }
  #area01 .imgSetBox .imgSetInner {
        height: auto;
  }
  #area01 .imgSetBox.bx1 {
        background: url(../img/research/area01_img01.jpg) no-repeat center top/100% auto;
  }
  #area01 .imgSetBox.bx2 {
        background: url(../img/research/area01_img02.jpg) no-repeat center top/100% auto;
  }
  #area01 .imgSetBox.bx3 {
        background: url(../img/research/area01_img03.jpg) no-repeat center top/100% auto;
  }
  #area01 .imgSetBox.bx4 {
        background: url(../img/research/area01_img04.jpg) no-repeat center top/100% auto;
  }
}