@charset "utf-8";

#contents::after{content:''; width:100vw; height:100%; background:url(/img/story/sp/bg.jpg) center top no-repeat; background-size:100% auto; position:fixed; left:0; top:0; z-index:-1;}

.pagetitle {position: relative; z-index: 10; background: url(/img/story/title.png) center no-repeat; background-size: auto 100%; height: calc(77/640*100vw); text-indent: 200%; margin: calc(57/640*100vw) 0 calc(44/640*100vw);}

/*main section {background: url(/img/story/sp/bg_section.png) center top no-repeat; background-size: 100% auto; min-height: calc(1210/640*100vw); text-align: left; border-top:1px solid #5a6471; border-bottom: 1px solid #5a6471; margin-bottom: calc(32/640*100vw);}*/
main section{text-align:left;}

main .slide-wrap{position:relative; margin-bottom:9.219vw; padding-bottom:16.406vw;}
main .swiper-slide{padding-bottom:5.781vw; background:url(/img/story/sp/bg_section.png) center top no-repeat; background-size:cover; border-top:1px solid #5a6471; border-bottom:1px solid #5a6471;}

main section h2{height:calc(70/640*100vw); margin:calc(28/640*100vw) 0 calc(30/640*100vw); background:url(/img/story/sp/h2.png) center top no-repeat; background-size:cover;}
main section .slide01 img{width:calc(580/640*100vw); height:auto; margin:0 auto calc(36/640*100vw); display:block;}
main section p{padding:0 calc(30/640*100vw); font-size:calc(20/640*100vw); line-height:2; letter-spacing:0.05em;
-moz-font-feature-settings:"palt"; -webkit-font-feature-settings:"palt"; font-feature-settings:"palt";}
main section p + p{margin-top:2em;}



main section .slide02{padding-bottom:11.875vw;}
main section .slide02 h2{height:calc(70/640*100vw); margin:calc(28/640*100vw) 0 calc(30/640*100vw); background:url(/img/story/sp/h202.png) center top no-repeat; background-size:cover;}
main section .slide02 ul{width:calc(580/640*100vw); margin:0 auto;}
main section .slide02 ul li + li{margin-top:3.125vw;}

main .swiper-pagination{position:absolute; left:0; bottom:0.781vw; width:100vw; font-size:3.125vw; color:#96d2f0; padding:0; line-height:7.031vw;}
main .swiper-button-prev{position:absolute; top:inherit; left:calc(30/640*100vw); bottom:0; width:calc(71/640*100vw); height:calc(67/640*100vw); background:url(/img/cmn/btn_prev.png) left top no-repeat; background-size:calc(71/640*100vw) calc(67/640*100vw); transition:0.5s;}
main .swiper-button-next{position:absolute; top:inherit; right:calc(30/640*100vw); bottom:0; width:calc(71/640*100vw); height:calc(67/640*100vw); background:url(/img/cmn/btn_next.png) left top no-repeat; background-size:calc(71/640*100vw) calc(67/640*100vw); transition:0.5s;}
main .swiper-button-disabled{opacity:0!important;}


@media screen and (min-width:641px){
/* 

    PC
    
***********************************************************************************/

#contents,
#wrapper{min-height: 100vh;}


#contents::after {background: url(/img/story/bg.png) center top no-repeat; background-size: cover; position: fixed; left: 0; top: 0; z-index: -1;}

.pagetitle{height:77px; margin:127px 0 58px;}

main{padding-bottom:108px;}

/*main section {background: url(/img/story/bg_section.png) center top no-repeat; min-height: 559px; border-top:none; border-bottom: none; width: 1240px; padding: 17px 0 0; margin: 0 auto;}*/
main section{width:1240px; margin:0 auto;}

main .slide-wrap{padding-bottom:0;}
main .swiper-slide{background:url(/img/story/bg_section.png) center top no-repeat; border-top:none; border-bottom:none;}
main section h2{margin:0 0 36px; background:url(/img/story/h2.png) center top no-repeat; background-size:100% auto; height:72px;}

main section .slide01{min-height:559px; padding:17px 0 0;}
main section .slide01 img{width:698px!important; float:right; margin:0 60px 0 0;}
main section .scroll{float:left; width:460px; height:395px; overflow: hidden; overflow-y:auto;}
main section .scroll::-webkit-scrollbar {width:9px;}
main section .scroll::-webkit-scrollbar-track {border-radius:0; background:#3e5064;}
main section .scroll::-webkit-scrollbar-thumb {border-radius:0; background:#758391;}

main section p {font-size:16px; line-height:36px; padding:0 30px 0 60px;}

main section .slide02{min-height:559px; padding:39px 0 0;}
main section .slide02 h2{margin:0 0 55px; background:url(/img/story/h202.png) center top no-repeat; background-size:100% auto; height:72px;}
main section .slide02 ul{display:flex; flex-wrap:wrap; justify-content:center; width:auto;}
main section .slide02 ul li{width:553px; margin:0 10px!important;}
main section .slide02 ul li img{width:100%!important; height:auto!important;}

main .swiper-pagination{bottom:-65px; width:100%; font-size:17px; line-height:67px;}
main .swiper-button-prev{top:268px; left:-79px; bottom:inherit; width:71px; height:67px; background-size:auto; backface-visibility:hidden;}
main .swiper-button-next{top:268px; right:-79px; bottom:inherit; width:71px; height:67px; background-size:auto; backface-visibility:hidden;}
main .swiper-button-prev:hover,
main .swiper-button-next:hover{filter:brightness(1.2);}

}

@media screen and (max-width:1600px) and (min-width:641px){
main .swiper-button-prev{left:-60px;}
main .swiper-button-next{right:-60px;}
}
@media screen and (max-width:1920px) and (min-width:1401px){
}
@media screen and (min-width:1921px){
}