/*
// header
// kv
// message
// movie
// syoken-content
// links
// footer
// sp style
*/

@import url('yakuhanjp.min.css');
@import url('css2-NotoSansJPwght100..900_ZenKakuGothicNewwght500700900_swap.css');
body{
  width: 100%;
}


.lp-contents{
  color: #000;
  font-family: YakuHanJP,'Zen Kaku Gothic New', sans-serif;
  font-feature-settings: 'palt';
  font-size:10px;
  font-weight: 400;
  line-height: 1.65;
  min-width: 32em;
  -webkit-font-smoothing  : antialiased;
	-moz-osx-font-smoothing : grayscale;
  -webkit-text-size-adjust: 100%;
}

.lp-contents *{
  letter-spacing: 0.08em;
}

.lp-contents a{
  color:#000;
  display: block;
  text-decoration:none;
}

.lp-contents a:hover{

}

.lp-contents img{
  display: block;
}


.lp-contents .contents{
  margin: auto;
  width: 120em;
}

.onsp{
  display: none;
}

@media screen and (max-width:767px){
  .lp-contents{
    font-size:1.333vw;
  }

  .lp-contents .contents{
    width: 100%;
  }
  
  .onpc{
    display: none;
  }
  
  .onsp{
    display: block;
  }
}

@media screen and (min-width:767px) and (max-width:1120px){
  .lp-contents{
    font-size : 0.78125vw;
  }
}
@media screen and (min-width:1920px){
  .lp-contents{
    font-size : 0.52083vw;
  }
}

/*
// header
*/

.header{
  position: relative;
  width: 100%;
  z-index: 4;
}

.header--inner{
  align-items: center;
  background: #fff;
  box-sizing: content-box;
  display: flex;
  height: 10em;
  justify-content: space-between;
  margin: auto;
  padding: 0 6em 0 2em;
  width: 120em;
}

.header__logo{
  height: 4.69199em;
  width: 22.05001em;
}

.header__nav{
  
}

.header__nav__list{
  display: flex;
  justify-content: space-between;
  width:62em;
}

.header__nav__list li{
  text-align: center;
  width: 14em;
}

.header__nav__list li a{
  font-size:1.8em;
  font-weight: 700;
  height: 100%;
  line-height: 1.5;
  margin-bottom: 1em;
  position: relative;
  width: 100%;
}

.header__nav__list li a:hover{
  color:#006FBC;
}

.header__nav__list li a::after{
  background: #E6E6E6;
  border-radius: 0.5em;
  bottom:0;
  content:'';
  height: calc(1/1.8 * 1em);
  left:50%;
  position: absolute;
  transform: translateX(-50%);
  width: 100%;
}

.header__nav__list li a.active::after,
.header__nav__list li a:hover::after{
  background: #006FBC;
}

.header__nav__list li:first-child a{
  padding-top: 0.8em;
}

.header__nav__btn{
  display: none;
}

.main{}



/*
// kv
*/

.kv{
  background: url("../image/kv__image--pc.webp") no-repeat top center/192em auto;
  height: 73em;
  width: 100%;
}

.kv h1{
  overflow: hidden;
  text-indent: 100%;
  white-space: nowrap;   
}



/*
// message
*/

.message{
  background: url("../image/message--bg--pc.webp") no-repeat top center/cover;
  padding: 11em 0 16em;
}
.message__description{
  font-size:2.4em;
  line-height: 2;
  margin: 0 0 calc(9/2.4 * 1em);
  text-align: center;
}
.message__description p,
.message__description span{
  font-weight: 700;
}
.message__description__text01{
  margin: 0 0 2em;
}
.message__description__text02{
  margin: 0 0 0;
}
.message__description__text02 span{
  position: relative;
}
.message__description__text02 span:before{
  background: url("../image/message__description__text02--text-bg.svg") repeat-x bottom left/calc(4.28883/2.4 * 1em) auto;
  bottom:-0.2em;
  content:'';
  height: 0.39763em;
  left:0;
  position: absolute;
  width: 100%;
}
.message__description__text03 {
  margin: 0 0 calc(6.5/2.4 * 1em);
}
.message__description__text03 span{
  position: relative;
}
.message__description__text03 > span > span{
  z-index: 2;
}
.message__description__text03 > span:before{
  background: #fff;
  content:'';
  height: calc(100% + 0.1em);
  position: absolute;
  left:-0.2em;
  top:0;
  width: calc(100% + 0.4em);
  z-index: 1;
}
.message__description__text04{}
.message__news{
  background: #fff;
  border-radius: 6.5em;
  display: flex;
  font-family: "Noto Sans JP", sans-serif;
  padding: 5em 10em;
  width: 120em;
}
.message__news *{
  letter-spacing: 0;
}
.message__news__title{
  width: 25em;
}
.message__news__title h2{
  display: block;
  color:#006fbc;
  font-size:6em;
  font-weight: 700;
  letter-spacing: 0.1em;
  line-height: 1;
  margin: 0.4em 0 0;
}
.message__news__title h3{
  font-size:2em;
  letter-spacing: 0.2em;
  line-height: 1;
  margin: 1em 0 0;
}
.message__news__list{
  width: 75em;
}
.message__news__list li{
  align-items: center;
  border-bottom: 1px solid #ccc;
  display: flex;
  gap:1em;
  line-height: 1.5;
  min-height: 8.4em;
  padding: 2.4em 0;
}
.message__news__list li:first-child{
  border-top: 1px solid #ccc;
}
.message__news__list__date-wrap{
  align-items: center;
  display: flex;
  gap:1em;
  min-width: 18.5em;
}
.message__news__list__date{
  font-size:2em;
}
.message__news__list__new-icon{
  align-items: center;
  background: #f00000;
  color:#fff;
  display: flex;
  font-size:2.2em;
  font-weight: 700;
  height: calc(2.7/2.2 * 1em);
  justify-content: center;
  letter-spacing: 0.15em;
  padding: 0 0 0.15em;
  width: calc(7.5/2.2 * 1em);
}
.message__news__list__text{
  font-size:2em;
}
.message__news__list__text a{
  text-decoration: underline;
}
.message__news__list__text a:hover{
  color:#006fbc;
}



/*
// movie
*/

.movie{
  background: url("../image/movie--bg--pc.webp") no-repeat top center/cover;
  padding: 0 0 13em;
}
.movie__header{
  align-items: center;
  background: #60b9d9;
  color:#fff;
  display: flex;
  font-size:5em;
  font-weight: 700;
  height:calc(12/5 * 1em); 
  justify-content: center;
  letter-spacing: 0.2em;
  margin: 0 0 calc(9.5/5 * 1em); 
  width: 100%;
}

.movie__title{
  margin: 0 auto 4em;
  width: 80.6em;
}
.movie__title img{
  width: 100%;
}        
.movie__list-wrap{
  display: flex;
  flex-wrap: wrap;
  gap:5.8em;
  justify-content: center;
}
.movie__list{
  background: #fff;
  border-radius: 2em;
  box-shadow: 0.6em 0.6em 0 rgba(0,117,186,0.2);
  overflow: hidden;
  height: 40em;
  width: 54em;
}
.movie__list:hover{
  cursor:pointer;
}
.movie__list__title{
  align-items: center;
  display: flex;
  font-size:2.2em;
  height:  calc(7/2.2 * 1em);
  justify-content: center;
  width: 100%;
}
.movie__list--01 .movie__list__title{
  background: #ffadc1;
}
.movie__list--02 .movie__list__title{
  background: #00c4bf;
}
.movie__list--03 .movie__list__title{
  background: #f5861e;
}
.movie__list--04 .movie__list__title{
  background: #f8d300;
}
.movie__list__thumb{
  align-items: center;
  background: #fff;
  display: flex;
  height: 33em;
  justify-content: center;
  position: relative;
}
.movie__list__thumb:after{
  background: url("../image/movie__list__thumb__play-icon.webp") no-repeat center/ 100% auto;
  content:'';
  height: 7em;
  left:50%;
  opacity: 0.85;
  position: absolute;
  top:50%;
  transform: translate(-50%,-50%);
  transition: .2s;
  width: 7em;
  z-index: 2;
}
.movie__list:hover .movie__list__thumb:after{
  opacity: 0.5;
}
.movie__list__thumb img{
  width: 40em;
}

.movie__list:hover .movie__list__thumb img{
  filter: brightness(1.03);
}

                
/* modal */

.modal-wrap{
  align-items: center;
  background: rgba(0,0,0,0.4);
  display: flex;
  left:0;
  height: 100vh;
  justify-content: center;
  opacity: 0;
  position:fixed;
  top:0;
  transition: .5s;
  visibility: hidden;
  width: 100vw;
  z-index: -1;
}

.modal-wrap.active{
  opacity: 1;
  visibility: visible;
  z-index: 11;
}

/* movie-modal */

.movie-modal__movie{
  background: #ccc;
  display: none;
  height: calc(85.6 * 0.5625 * 1em);
  position:relative;
  width: 85.6em;
}
.movie-modal__movie.active{
  display: block;
}
    
.movie-modal__movie iframe{
  left:0;
  height: 100%;
  position: relative;
  top:0;
  width: 100%;
}



/*
// syoken-content
*/


.syoken-content{
  padding: 6.5em 0 0;
}
.syoken-content__title{
  margin: 0 auto 2em;
  width: 84.1em;
}
.syoken-content__title img{
  width: 100%;
}  
.syoken-content__description{
  font-size:2em;
  font-weight: 700;
  line-height: 2.5em;
  text-align: center;
}

.syoken-content__description span{
  position: relative;
}
.syoken-content__description > span > span{
  z-index: 2;
}
.syoken-content__description > span:before{
  background: #ffffb1;
  content:'';
  height: calc(100% + 0.1em);
  position: absolute;
  left:-0.2em;
  top:0;
  width: calc(100% + 0.4em);
  z-index: 1;
}

           
.syoken-content__figure{
  background: url("../image/syoken-content__figure--bg--header--pc.svg") no-repeat top center/192em auto,
    linear-gradient(transparent 10.4em,#fef8d9 10.4em);
  margin: -2em 0 0;
  padding: 14.3em 0 4em;
}
          
.syoken-content__figure__item-wrap{
  height: auto;
  margin: 0 auto 2em;
  width: auto;
}
.syoken-content__figure__item{
  margin: auto;
  height: 92vh;
  width: calc(1997/1895 * 92vh); /* 画像 縦横比率 1997/1895*/
  position: relative;
} /* sp時固定幅　*/
.syoken-content__figure__item__image{
  height: 100%;
  width: auto;
}   
.syoken-content__figure__item__btn{
  position:absolute;
  width: calc(230/1492 * 1997/1895 * 92vh); /* btn230px/1492px幅に対して */
}
.syoken-content__figure__item__btn img{
  width: 100%;
}
.syoken-content__figure__item__btn--01{
  left: 26%;
  top: 44.2%;
}
.syoken-content__figure__item__btn--02{
  right:24.7%;
  top: 44.2%;
}
.syoken-content__figure__footnote{
  font-family: "Noto Sans JP", sans-serif;
  font-size:1.4em;
  letter-spacing: 0;
  margin: auto;
  width: calc(120/1.4 * 1em);
}
.syoken-content__figure__footnote a{
  color:#0000ff;
  display: inline;
  text-decoration: underline;
}


/* gap-modal */

.gap-modal{
  background-color:#f8d300;
  background-image:repeating-linear-gradient(-45deg,rgba(255,255,255,0.3), rgba(255,255,255,0.3) 0.4em,transparent 0, transparent 0.8em); 
  border-radius: 3em;
  display: none;
  padding: 4em 2em 2em;
}
.gap-modal.active{
  display: block;
}
.gap-modal__inner{
  background: #fff;
  border-radius: 2em;
  position: relative;
}
.gap-modal__close-btn{
  height: 3em;
  position: absolute;
  right:0;
  top:-2em;
  width: 3em;
}
.gap-modal__item{
  display: none;
}
.gap-modal__item.active{
  display: block;
}
.gap-modal__item--01{
  padding: 8em 6em 2em;
}
.gap-modal__item--02{
  padding: 8em 3.8em 2em;
}
.gap-modal__item__icon{
  left:50%;
  position: absolute;
  top:-2.5em;
  transform: translateX(-50%);
  width: 29em;
}
.gap-modal__item__title{
  font-size:3.5em;
  font-weight: 900;
  letter-spacing: 0.1em;
  line-height: 1.35;
  margin: 0 0 0.5em;
  text-align: center;
}
.gap-modal__item__description{
  letter-spacing: 0.08em;
  margin: auto;
  text-align: center;
}
.gap-modal__item--01 .gap-modal__item__description{
  width: 58em;
}
.gap-modal__item--02 .gap-modal__item__description{
  width: 70em;
}
.gap-modal__item__description span{
  border-bottom:1px solid #ccc;
  display: block;
  font-size:1.8em;
  letter-spacing: -0.03em;
  line-height: 1;
  padding: 0.85em 0;
  width: 100%;
}
.gap-modal__item__description span:last-child{
  border:none;
}




/*
// links
*/

.links{
  padding: 6em 0 6.5em;
}
.links__heading{
  align-items: center;
  background: #fff;
  border:calc(0.2/2.4 * 1em) solid #000;
  border-radius: calc(2.25/2.4 * 1em);
  display: flex;
  font-size:2.4em;
  height: calc(6/2.4 * 1em);
  justify-content: center;
  letter-spacing: 0.1em;
  margin: 0 auto calc(6.5/2.4 * 1em);
  position: relative;
  width: calc(61.2/2.4 * 1em);
}
.links__heading:after{
  background: #000;
  bottom:calc(-2/2.4 * 1em);
  content:'';
  height: calc(2/2.4 * 1em);
  left:50%;
  position: absolute;
  transform: translateX(-50%);
  width: calc(0.2/2.4 * 1em);
}
.links__list{
  display: flex;
  gap:3em;
  justify-content: center;
}
.links__list__banner{
  box-shadow: 0 0 0.5em rgba(0,0,0,0.3);
  width: 30em;
}

.links__list__banner img{
  width: 100%;
}



/* 
// footer
*/

.footer{
  background:#fff;
  border-top:1px solid #ccc;
}
.footer *{
  letter-spacing: 0;
}

.footer__inner{
  align-items: center;
  display: flex;
  height: 7em;
  justify-content: center;
  margin: auto;
  padding: 0 0 0 10em;
  width: 120em;
}

.footer__logo{
  width: 11.44183em;
}

.footer__logo img{
  width: 100%;
}

.footer__link{
  align-items: center;
  display: flex;
  margin: 0 2em;
}

.footer__link li{
  align-items: center;
  display: flex;
  font-size: 1.5em;
}

.footer__link li:before{
  content:'|';
  font-size:1.2em;
}

.footer__link li:last-child:after{
  content:'|';
  font-size:1.2em;
}

.footer__link li a{
  align-items: center;
  display: flex;
  font-weight: 500;
  justify-content: center;
  text-align: center;
  width: calc(10 / 1.5 * 1em);
}

.footer__link li a:hover{
  text-decoration: underline;
}

.footer__copyright{
  font-size: 1.5em;
  line-height: 1;
}





/*******************************

// sp style

*******************************/

@media screen and (max-width:767px){

  .lp-contents{
    font-size:1.333vw;
  }

  .lp-contents .contents{
    width: 100%;
  }

  .onpc{
    display: none;
  }

  .onsp{
    display: block;
  }


  /*
  // header
  */

  .header{
  }

  .header--inner{
    padding: 0 0 0 3.5em;
    position: relative;
    width: auto;
  }

  .header__logo{
    height: 5.31972em;
    width: 25em;
  }

  .header__nav{
    background: #fff;
    left:0;
    position: absolute;
    top:-20em;
    transition: .2s;
    width: 100%;
    visibility: hidden;
    z-index: 1;
  }

  .header__nav.active{
    top:10em;
    visibility:visible;
  }

  .header__nav__list{
    border-top:0.2em solid #E6E6E6;
    flex-direction: column;
    width: 100%;
  }

  .header__nav__list li{
    border-bottom:0.2em solid #E6E6E6;
    height: 10em;
    width: 100%;
  }

  .header__nav__list li a{
    align-items: center;
    display: flex;
    justify-content: center;
    font-size:3.2em;
  }

  .header__nav__list li a::after{
    content:none;
  }

  .header__nav__list li:first-child a{
    padding-top: 0;
  }

  .header__nav__btn{
    display: block;
    height: 10em;
    padding: 3em 4em;
    position: absolute;
    right:0;
    top:0;
    transition: .2s;
    width: 14em;
    z-index: 3;
  }

  .header__nav__btn span{
    background: #000;
    content:'';
    height: 0.2em;
    left:4em;
    position: absolute;
    width: 6em;
  }

  .header__nav__btn span:nth-child(1){
    top:3em;
  }

  .header__nav__btn span:nth-child(2){
    top:5em;
  }

  .header__nav__btn span:nth-child(3){
    top:7em;
  }

  .header__nav__btn.active span:nth-child(1){
    top:5em;
    transform: rotate(-35deg);
  }

  .header__nav__btn.active span:nth-child(2){
    visibility: hidden;
  }

  .header__nav__btn.active span:nth-child(3){
    top:5em;
    transform: rotate(35deg);
  }

  

  /*
  // kv
  */

  .kv{
    background: url("../image/kv__image--sp.webp") no-repeat center center/cover;
    height: 90em;
    width: 100%;
  }

  
  .main{
    overflow: hidden;
  }



  /*
  // message
  */

  .message{
    background: url("../image/message--bg--sp.webp") no-repeat top center/cover;
    padding: 8.5em 0 10em;
  }
  .message__description{
    font-size:3.2em;
    margin: 0 0 calc(7/3.2 * 1em);
  }
  .message__description__text01{
    margin: 0 0 2em;
  }
  .message__description__text02{
    margin: 0 0 1em;
  }
  .message__description__text02 span:before{
    background: url("../image/message__description__text02--text-bg.svg") repeat-x bottom left/calc(3.67418 /3.2 * 1em) auto;
    bottom:-0.25em;
    height: 0.398em;
  }
  .message__description__text03 {
    line-height: 2.2;
    margin: 0 0 calc(6.5/3.2 * 1em);
  }
  .message__news{
    display: block;
    margin: auto;
    padding: 5em 2.5em 7.5em;
    width: 65em;
  }
  .message__news *{
    letter-spacing: 0;
  }
  .message__news__title{
    text-align: center;
    width: auto;
  }
  .message__news__title h2{
    font-size:7em;
    margin: 0;
  }
  .message__news__title h3{
    font-size:2.8em;
    margin: 0.4em 0 1em;
  }
  .message__news__list{
    width: 60em;
  }
  .message__news__list li{
    align-items: flex-start;
    border-bottom: 1px solid #ccc;
    flex-direction: column;
    gap:0.2em;
    min-height: 10.5em;
    padding: 2em;
  }
  .message__news__list li:first-child{
    border-top: 1px solid #ccc;
  }
  .message__news__list__date{
    font-size:2.5em;
  }
  .message__news__list__text{
    display: block;
    font-size:2.5em;
  }



  /*
  // movie
  */

  .movie{
    background: url("../image/movie--bg--sp.webp") no-repeat top center/cover;
    padding: 0 0 9.5em;
  }
  .movie__title{
    margin: 0 auto 5.5em;
    width: 64em;
  }

  .movie__list-wrap{
    flex-direction: column;
    gap:4em;
    margin: auto;
    width: 69em;
  }
  .movie__list{
    border-radius: 2.6em;
    box-shadow: none;
    height: 51em;
    width: 100%;
  }
  .movie__list__title{
    font-size:3em;
    height: calc(9/3 * 1em);
  }
  .movie__list__thumb{
    height: 42em;
  }
  .movie__list__thumb:after{
    height: 9em;
    width: 9em;
  }
  .movie__list__thumb img{
    width: 54em;
  }

  /* movie-modal */

  .movie-modal__movie{
    height: calc(70 * 0.5625 * 1em);
    width: 70em;
  }



  /*
  // syoken-content
  */


  .syoken-content{
    padding: 6.5em 0 0;
  }
  .syoken-content__title{
    margin: 0 auto 2em;
    width: 71em;
  }
  .syoken-content__description{
    font-size:2.8em;
    line-height: 2.5em;
  }
  .syoken-content__figure{
    background: url("../image/syoken-content__figure--bg--header--sp.svg") no-repeat top center/100% auto,
      linear-gradient(transparent 12.4em,#fef8d9 12.4em);
    margin: 0;
    padding: 14.3em 0 5.5em;
  }

  .syoken-content__figure__item-wrap{
    margin: 0 0 2.5em;
    overflow-x: scroll;
    width: 100vw;
  }
  .syoken-content__figure__item{
    margin: 0 0 8.5em;
    padding: 0 0 0 2.5em;
  } /* sp時固定幅　*/
  .syoken-content__figure__item__image{
    box-sizing: content-box;
    height: auto;
    padding-right: 2.5em;
    width: 100%;
  }           
  .syoken-content__figure__item__btn img{
    width: 100%;
  }
  .syoken-content__figure__item__btn--01{
    left: 27%;
    top: 43.2%;
  }
  .syoken-content__figure__item__btn--02{
    right:24.2%;
    top: 43.2%;
  }
  .syoken-content__figure__footnote{
    font-size:2em;
    letter-spacing: 0.15em;
    width: calc(70/2 * 1em);
  }
  
  /* scroll bar */
  
  /* 全体のスクロールバー */
  .syoken-content__figure__item-wrap::-webkit-scrollbar {
    height: 1.6em;
  }

  /* スクロールバーのトラック（背景部分） */
  .syoken-content__figure__item-wrap::-webkit-scrollbar-track {
    background: #fff; /* スクロールバーの背景色 */
    border-radius: 0.8em; /* 角を丸くする */
  }

  /* スクロールバーのつまみ */
  .syoken-content__figure__item-wrap::-webkit-scrollbar-thumb {
    background: #006fbc; /* スクロールバーのつまみ部分の色 */
    border-radius: 0.8em; /* 角を丸くする */
  }

  /* スクロールバーのつまみにホバーした時 */
  .syoken-content__figure__item-wrap::-webkit-scrollbar-thumb:hover {
    background: #006fbc; /* ホバー時の色 */
  }

  /* gap-modal */
  
  .gap-modal{
    border-radius: 2.5em;
    padding: 3.5em 2em 2em;
  }
  .gap-modal__inner{
    border-radius: 1.7em;
  }
  .gap-modal__close-btn{
    height: 5.02em;
    top: -1.5em;
    width: 5.02em;
  }
  .gap-modal__item--01{
    padding: 10.5em 3.5em 4em;
  }
  .gap-modal__item--02{
    padding: 10.5em 3.5em 4em;
  }
  .gap-modal__item__icon{
    top:-1.8em;
    width: 34.5em;
  }
  .gap-modal__item__title{
    font-size:4.18em;
    font-weight: 900;
    letter-spacing: 0.1em;
    line-height: 1.35;
    margin: 0 0 0.5em;
    text-align: center;
  }
  .gap-modal__item__description{
    letter-spacing: 0.08em;
    margin: auto;
    text-align: center;
  }
  .gap-modal__item--01 .gap-modal__item__description{
    width: 100%;
  }
  .gap-modal__item--02 .gap-modal__item__description{
    width: 100%;
  }
  .gap-modal__item__description span{
    border-bottom:1px solid #ccc;
    display: block;
    font-size:2.8em;
    line-height: 1;
    padding: 0.85em 0 0.4em;
    width: 100%;
  }
  .gap-modal__item__description span:last-child{
    border-bottom:1px solid #ccc;
  }




  /*
  // links
  */

  .links{
    padding: 7em 0 5.5em;
  }
  .links__heading{
    border:calc(0.2/2.8 * 1em) solid #000;
    border-radius: calc(3/2.8 * 1em);
    font-size:2.8em;
    height: calc(6/2.8 * 1em);
    letter-spacing: 0.04em;
    margin: 0 auto calc(6/2.8 * 1em);
    width: calc(68.3/2.8 * 1em);
  }
  .links__heading:after{
    bottom:calc(-2/2.8 * 1em);
    height: calc(2/2.8 * 1em);
    width: calc(0.2/2.8 * 1em);
  }
  .links__list{
    align-items: center;
    flex-direction: column;
    gap:3em;
  }
  .links__list__banner{
    width: 50em;
  }

  
  
  
  /* 
  // footer
  */

  .footer{
    padding: 3.5em 0 2em;
  }
  
  .footer__inner{
    display: block;
    height: auto;
    padding: 0;
    width: 100%;
  }
  
  .footer__logo{
    margin: 0 auto 3em;
    width: 25.83958em;
  }
  
  .footer__link{
    justify-content: center;
    margin: 0 0 3em;
  }
  
  .footer__link li{
    font-size: 2em;
  }

  .footer__link li a{
    align-items: center;
    display: flex;
    font-weight: 500;
    justify-content: center;
    text-align: center;
    width: calc(15 / 2 * 1em);
  }

  .footer__copyright{
    font-size: 2em;
    text-align: center;
  }
}



/*******************************

// tablet style

*******************************/
@media screen and (min-width:768px) and (max-width:1024px){
  .syoken-content__figure__item-wrap{
    margin: 0 0 2.5em;
    overflow-x: scroll;
    width: 100vw;
  }
  .syoken-content__figure__item{
    margin: 0 0 8.5em;
    padding: 0 0 0 2.5em;
  }
  .syoken-content__figure__item__image{
    box-sizing: content-box;
    height: auto;
    padding-right: 2.5em;
    width: 100%;
  }           
  .syoken-content__figure__item__btn img{
    width: 100%;
  }
  .syoken-content__figure__item__btn--01{
    left: 27%;
    top: 43.2%;
  }
  .syoken-content__figure__item__btn--02{
    right:24.2%;
    top: 43.2%;
  }
}