@charset "UTF-8";
/* ==============================
  mixin
============================== */
/* ==============================
block　共通パーツ
============================== */
.top .hero {
  position: relative;
  max-width: 100%;
  overflow: hidden;
}
.top .hero .block__inner{
  position: relative;
  min-height: 820px;
}
.top .hero .block__inner .bxslidere{
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  margin: auto;
}
@media (max-width: 767px) {
  .top .hero {
    max-height: 1140px;
  }
  .top .hero .block__inner{
    padding-top: 170%;
    min-height: 620px;
    padding-bottom: 16vw;
  }
}

.top .bx-wrapper {
  background: none;
  border: 0;
  margin-bottom: 0;
  box-shadow: none;
}
.top .bx-wrapper .bx-prev,
.top .bx-wrapper .bx-next {
  background: none;
  border-top: 3px solid #fff;
  border-right: 3px solid #fff;
}
@media (max-width: 767px) {
  .top .bx-wrapper .bx-prev,
  .top .bx-wrapper .bx-next {
    display: none;
  }
}
.top .bx-wrapper .bx-prev {
  left: 10px;
  transform: rotate(-135deg);
}
.top .bx-wrapper .bx-next {
  right: 10px;
  transform: rotate(45deg);
}
.top .bx-wrapper .bx-controls-direction a {
  width: 32px;
  height: 32px;
}

.top .bx-controls.bx-has-pager.bx-has-controls-direction{
  height: 0;
}

.top .bx-wrapper .bx-pager{
  position: relative;
  left: 193px;
  bottom: 50px;
  text-align: left;
  padding: 0;
  max-width: 1280px;
  margin: auto;
}

.top .bx-wrapper .bx-pager.bx-default-pager a{
  width: 12px;
  height: 12px;
  background: transparent;
  border: 2px solid #3B9CE0;
  margin: 0 16px 0 0;
}

.top .bx-wrapper .bx-pager.bx-default-pager a:hover,
.top .bx-wrapper .bx-pager.bx-default-pager a.active,
.top .bx-wrapper .bx-pager.bx-default-pager a:focus{
  background: #3B9CE0;
}

@media (max-width: 767px) {
  .top .bx-wrapper .bx-pager{
    left: 32px;
    bottom: 24px;
  }
}

.anime-scroll{
  position: absolute;
  left: -10px;
  bottom: -52px;
  width: 23px;
  height: 204px;
  text-align: center;
}

.anime-scroll span{
  position: absolute;
  left:2px;
  top: -64px;
  writing-mode:vertical-rl;
    -webkit-writing-mode: vertical-rl;
  -ms-writing-mode: tb-rl;
  color: #001C71;
  font-size: 1.6rem;
  font-weight: bold;
  font-family: 'Poppins', sans-serif;
}

.anime-scroll:after{
  content: "";
  position: absolute;
  top: 0;
  left: 15px;
  width: 3px;
  height: 120px;
  background: #001C71;
  animation: pathmove 3s ease-in-out infinite;
  opacity:0;
}

@keyframes pathmove{
  0%{
    height:0;
    top:0;
    opacity: 0;
  }
  30%{
    height:80px;
    opacity: 1;
  }
  100%{
    height:0;
    top:120px;
    opacity: 0;
  }
}

@media (max-width: 767px) {
  .anime-scroll{
    display: none;
  }
}

/*# sourceMappingURL=top.css.map */

.top .wrap-btn{
  margin-top: 120px;
}

/* main */
.mv-area{
  background-color: #EFF4FD;
}

.content-sec{
  margin: 0 -100%;
  padding: 100px 100%;
  z-index: -1;
}

@media (max-width: 767px) {
  .content-sec{
    padding: 0;
    margin: 0;
  }
}

.content-inner{
  position: relative;
  max-width: 890px;
  margin: auto;
}
@media (max-width: 767px) {
  .content-inner{
    max-width: none;
    padding: 0 33px;
  }
}

.hdg-wrap{
  position: relative;
  margin-bottom: -90px;
  padding-top: 60px;
  z-index: 2;
}

.hdg-lv2{
  color: #00B3A1;
  font-size: 1.2rem;
  font-weight: 600;
  letter-spacing: 1px;
}
@media (max-width: 767px) {
  .hdg-lv2{
    font-size: 1.2rem;
    text-align: left;
  }
  .hdg-lv2 span{
    font-size: 3rem;
  }

}

.hdg-lv2 span{
  color: #001C71;
  font-size: 3rem;
  font-family: 'Poppins', sans-serif;
  letter-spacing: 2px;
  line-height: 1.4;
  display: block;
}

.hdg-lv3{
  color: #F47488;
  font-size: 4.8rem;
  font-family: 'Poppins', sans-serif;
  font-weight: 600;
  text-align: left;
  transform: translateY(-42px);
  margin-bottom: -12px;
  letter-spacing: 2px;
}


.hdg-lv3 span{
  color: #050026;
  font-size: 1.4rem;
  line-height: 1.5;
  display: block;
  letter-spacing: 0;
}

.hdg-lv3.col-1{
  color: #00B3A1;
}

@media (max-width: 767px) {
  .hdg-lv3{
    font-size: 4rem;
    text-align: left;
    transform: translateY(-32px);
    margin-bottom: -12px;
  }
  
  
  .hdg-lv3 span{
    color: #050026;
    font-size: 1.4rem;
    line-height: 1.5;
    display: block;
  }

}


.txt-st{
  font-size: 1.4rem;
  line-height: 2;
}

.txt-lead{
  font-size: 1.6rem;
  line-height: 3;
  margin-top: 30px;
}

.wrap-img{

}

.btn-st,
.btn-pt{
  display: inline-block;
}

.btn-st a{
  font-size: 1.2rem;
  color: #FFFFFF;
  font-weight: bold;
  text-align: center;
  display: block;
  min-width: 166px;
  background: #001C71;
  padding: 14px 16px;
  border: 1px solid #FFFFFF;
  text-decoration: none;
  border-radius: 2px;
  font-family: 'Poppins', sans-serif;
}

.btn-st a:hover{
  color: #001C71;
  background: #FFFFFF;
  border: 1px solid #001C71;
  transition: all 0.3s;
  opacity: 1;
}

.btn-pt a{
  font-size: 1.2rem;
  color: #001C71;
  font-weight: bold;
  text-align: center;
  display: block;
  min-width: 348px;
  background: #EFF4FD;
  padding: 14px 16px;
  border: 1px solid #EFF4FD;
  text-decoration: none;
  border-radius: 2px;
}

.btn-pt a:hover{
  color: #EFF4FD;
  background: #001C71;
  border: 1px solid #EFF4FD;
  transition: all 0.3s;
  opacity: 1;
}

.link-pdf{
  position: relative;
  padding-right: 40px !important;
}

.link-pdf:after{
  position: absolute;
  top: 50%;
  right: 16px;
  content: url(../images/icon_pdf.svg);
  width: 18px;
  height: 18px;
  transform: translateY(-50%);
}


@media (max-width: 767px) {

  .btn-pt{
    display: block;
    max-width: 375px;
    margin: auto;
  }

  .btn-st a,
  .btn-pt a{
    min-width: 147px;
    width: 100%;
  }


}


.anime-round{
  -webkit-animation: anime-round 10s linear infinite;
          animation: anime-round 10s linear infinite;
}

.anime-round.pt1{
  -webkit-animation: anime-round 15s linear infinite;
  -ms-animation: anime-round 15s linear infinite;
  -moz-animation: anime-round 15s linear infinite;
  animation: anime-round 15s linear infinite;
}

@-webkit-keyframes anime-round {
  0% {
    transform: rotate(0);
  }
  100% {
    transform: rotate(360deg);
  }
}

@-ms-keyframes anime-round {
  0% {
    transform: rotate(0);
  }
  100% {
    transform: rotate(360deg);
  }
}


.deco-item1{
  position: absolute;
  top: -110px;
  right: 216px;
  display: block;
  width: 64px;
  height: 70px;
  background: url(../images/deco_item01.png) no-repeat;
  background-size: contain;
}

.deco-item2{
  position: absolute;
  left: -120px;
  bottom: 30px;
  display: block;
  width: 56px;
  height: 61px;
  background: url(../images/deco_item01.png) no-repeat;
  background-size: contain;
  z-index: 1;
}

.deco-item3{
  position: absolute;
  right: -70px;
  bottom: -20px;
  display: block;
  width: 48px;
  height: 52px;
  background: url(../images/deco_item02.png) no-repeat;
  background-size: contain;
}

_:-ms-lang(x)::-ms-backdrop, .deco-item2 {
  bottom: -50%;
}

@media (max-width: 767px) {
  .deco-item1{
    top: -10px;
    right: 10vw;
    width: 44px;
    height: 48px;
  }
  
  .deco-item2{
    left: 40px;
    bottom: -15%;
    width: 44px;
    height: 48px;
  }
  
  .deco-item3{
    top: 50%;
    right: 16px;
    bottom: auto;
    width: 32px;
    height: 34px;
  }
}

.text-line{
  position: relative;
}

.text-line-bg{
  width: 100%;
  border-top: 150px solid #EFF4FD;
  border-bottom: 150px solid #FFE1E5;
}


.text-line img{
  position: absolute;
  top: 50%;
  left: 0;
  right: 0;
  margin: auto;
  transform: translateY(-50%);
  width: 100%;
}

@media (max-width: 767px) {
  .text-line-bg{
    border-top: 50px solid #EFF4FD;
    border-bottom: 50px solid #FFE1E5;
    overflow: hidden;
  }

  .text-line img{
    min-width: 678px;
    left: 50%;
    transform: translate(-50% , -50%);
  }
}


.content-box{
  display: flex;
  flex-wrap: wrap;
}

.box-item{
  position: relative;
}

.box-item.wrap-img{
  z-index: 1;
}

#consept .hdg-lv2{
  font-family: 'Poppins', sans-serif;
  font-weight: 800;
}

.content-box.type-consept{
  width: 891px;
  margin: 28px auto 0;
  justify-content: space-between;
  align-items: center;
}
@media (max-width: 767px) {
  .content-box.type-consept{
    width: auto;
  }


  .content-box.type-consept .hdg-lv2{
    order: 1;
  }

  .content-box.type-consept .txt-lead{
    order: 3;
    width: 100%;
    margin-top: 26px;
  }

  .content-box.type-consept .wrap-img{
    order: 2;
    display: block;
    margin: 40px auto 0;
    width: 200px;
  }

}


.content-box.type-consept .hdg-lv2{
  width: 100%;
}

.content-box.type-consept .img-logo img{
  width: 248px;
  height: auto;
}

#consept{
  padding: 150px 0 100px;
}
@media (max-width: 767px) {
  #consept{
    padding: 1px 0 64px;
    margin: 0;
  }
  
  .content-box.type-consept .hdg-lv2{
    text-align: left;
  }
}

.lineup-inner{
  position: relative;
  width: 100vw;
  max-width: 1280px;
  margin: auto;
}

#bodysheet,#facesheet{
  position: relative;
  z-index: 1;
}

#bodysheet{
  padding: 300px 0 280px;
  display: block;
}

#facesheet{
  padding: 74px 0 150px;
}

.box-item-txt{
  position: absolute;
  top: -100px;
  font-size: 18.4rem;
  font-weight: 600;
  font-family: 'Poppins', sans-serif;
  writing-mode:vertical-rl;
    -webkit-writing-mode: vertical-rl;
  -ms-writing-mode: tb-rl;
  opacity: 0.3;
}

#bodysheet .box-item-txt{
  color: #F47488;
  top: -350px;
  right: -310px;
}

#facesheet .box-item-txt{
  color: #00B3A1;
  top: -100px;
  left: -300px;
}


.block-box{
  display: flex;
  position: relative;
  padding-top: 125px;
  border-radius: 4px;
}


.block-box > .box-item .box-inner * + *{
  margin-top: 32px;
}

.box-item-img{
  position: absolute;
  bottom: 27px;
  z-index: 1;
}

.box-wrap{
  background: #FFFFFF;
  width: 864px;
  border-radius: 4px;
}

.box-inner{
  width: 637px;
  padding: 0 93px 64px;
}

.box-inner > .btn-st{
  margin-top: 44px;
}

.block-box.typeA .box-item-img{
  right: -225px;
  bottom: -230px;
}

.block-box.typeA .box-item-img img{
  width: 500px;
}

.block-box.typeA .box-wrap{
  margin-top: -170px;
  margin-left: -206px;
}

.block-box.typeB{
  padding: 100px 0 140px;
}

.block-box.typeB .box-wrap{
  margin-right: -206px;
  margin-top: 34px;
}

.block-box.typeB .box-item-img{
  left: -120px;
  bottom: -290px;
}

.block-box.typeB .box-item-img img{
  width: 394px;
}

.block-box.typeB .box-inner{
  width: 623px;
  margin-left: auto;
}


@media (max-width: 767px) {
  .lineup-inner{
    max-width: none;
  }

  .box-item-txt{
    font-size: 10.4rem;
    top: 0;
  }

  #bodysheet{
    padding: 124px 0 100px;
    margin-top: 32px;
    height: auto;
  }
  
  #facesheet{
    padding: 0;
  }
  
  #bodysheet .box-item-txt{
    top: -60px;
    right: -50px;
  }

  #facesheet .box-item-txt{
    top: -60px;
    left: -50px;
  }
  
  .block-box{
    display: flex;
    position: relative;
    padding-top: 160px;
  }
  
  
  .block-box > .box-item .box-inner * + *{
    margin-top: 32px;
  }
  
  .box-item-img{
    position: relative;
    bottom: auto;
  }
  
  .box-wrap{
    background: #FFFFFF;
    width: calc(100% + 33px);
  }
  
  .box-inner{
    width: 100%;
    padding: 0 33px 48px;
  }
  
  .box-inner > .btn-st{
    margin-top: 32px;
  }

  .block-box.typeA {
    padding-top: 0;
  }
  
  .block-box.typeA .box-item-img{
    right: -16px;
    bottom: 0;
    margin: 0 -16px;
  }
  
  .block-box.typeA .box-item-img img{
    width: 100%;
  }
  
  .block-box.typeA .box-wrap{
    margin: 10px 0 0 -33px;
  }
  
  .block-box.typeB{
    padding: 124px 0 140px;
    margin-top: -40px;
  }
  
  .block-box.typeB .box-wrap{
    margin: 30px -33px 0 0px;
  }
  
  .block-box.typeB .box-item-img{
    left: auto;
    bottom: -12px;
    right: -66px;
    margin: 0 8px;
  }
  
  .block-box.typeB .box-item-img img{
    width: 100%;

  }
  
  .block-box.typeB .box-inner{
    width: 100%;
    margin-left: auto;
  }
  
  
}

.news-content{
  margin-top: 62px;
}

.dl-st > div{
  display: flex;
}

.dl-st > div + div{
  margin-top: 32px;
}

.dl-st > div dt{
  color: #F47488;
  font-size: 1.2rem;
  font-weight: bold;
}

.dl-st > div dd{
  font-size: 1.4rem;
  margin-left: 16px;
  font-weight: normal;
}

/* ----------------------------------------- */
.hero {
  position: relative;
  max-width: 100%;
  overflow: hidden;
}

.gradbg .gradbg__box{
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: -1;
  background: url(../images/mv_bg.png) repeat-x;
  background-size: cover;
  transition: all .3s;
}

.bxslidere_bg{
  position: absolute;
  top: 0;
  left: 0;
  z-index: -1;
}

.bxslidere_bg .hero__img__bg li > div img{
  height: 800px;
}

@media (max-width: 767px) {
  .bxslidere_bg .hero__img__bg li > div img{
    height: 667px;
  }
 
  .hero__img > li:nth-child(even) >* .mv-item{
    margin-top: -64px;
  }

}

.hero__img > li > .wrap-content{
  display: flex;
  align-items: center;
  height: 800px;
  max-width: 1280px;
  width: 100vw;
  margin: auto;
  overflow: hidden;

}

.hero__img > li.reverse > .wrap-content{
  flex-direction: row-reverse;
}

.hero__img > li >* .mv-txt{max-width: 500px; z-index: 2;}
.hero__img > li >* .mv-item{max-width: 780px; z-index: 2;}
.hero__img > li.hero-body >* .mv-item img{max-width: 1000px; margin-top: -30px; margin-left: -160px;}
.hero__img > li >* .mv-bg{
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  margin: auto;
  height: 800px;
  z-index: 1;
}

_:-ms-lang(x)::-ms-backdrop, .mv-txt{width: 500px;}
_:-ms-lang(x)::-ms-backdrop, .mv-img{width: 780px;}

@media (max-width: 767px) {
  .hero__img{
    height: 667px;
  }
  
  .hero__img > li > .wrap-content{
    flex-wrap: wrap;
    height: auto;
    width: 100%;
    padding: 80px 0 0;
  }

  .hero__img > li >* .mv-txt{
    padding: 0 50px 0 16px;
    margin: 40px auto 0;
  }

  .hero__img > li >* .mv-item{
    margin: 0 -16px;
  }

.hero__img > li.hero-body >* .mv-item img{width: 100%; margin: 16px -16px 0 -8px}


  .hero__img > li >* .mv-bg{
    top: 64px;
    height: 100%;
  }

  .hero_inner{
    display: none;
  }
}

.hero > .block__inner {
  display: block;
  position: relative;
  width: 100%;
  margin: 0 auto;
  z-index: 3;
}

.hero_inner{
  position: relative;
  max-width: 1080px;
  min-height: 820px;
  margin: auto;
}

@media (max-width: 767px) {
  .hero .block__inner {
    width: 100%;
  }

  .hero__img > li >*{
    display: block;
    max-width: none;
    padding: 80px 20px;
  }

  .hero__img > li >*{
    padding: 144px 33px 0 ;
    max-width: 1200px;
    height: auto;
    margin: auto;
  }
}

.block__wave__wrap{
  margin-top: -80px;
  height: 80px;
}


#js--col01,
#js--col02{
  position: relative;
  z-index: 1;
  min-width: 100vw;
  width: 100%;
}

#news{
  padding: 88px 0 44px;
}

@media (max-width: 767px) {
  #news{
    padding: 64px 0 32px;
    margin-top: -64px;
  }
}

/* mv-anime */
.fadetxt{
  opacity: 0;
  transform: translateY(100px);
  transition: opacity 1s, transform 1s;
}
.fadeitem{
  opacity: 0;
  transform: translateY(100px);
  transition: opacity 1s 0.5s, transform 1s 0.5s;
}
.sliderLoaded .fadetxt{
  opacity: 1;
  transform: none;
}
.sliderLoaded .fadeitem{
  opacity: 1;
  transform: none;
}

.wrap-bnr{
  text-align: center;
  padding: 55px 0 15px;
}
.wrap-bnr img{
  width: 712px;
}
.wrap-bnr a:hover{opacity: 0.75;}
@media (max-width: 767px) {
  .wrap-bnr img{
    width: 100%;
  }
  .wrap-bnr a:hover{opacity: 1;}
}