@charset "UTF-8";
.box_story .staff h4{font-family:dapifer-stencil, sans-serif}

#story #main{background:url("../img/story/bg_t.png") no-repeat 0 0/100% auto}

.btn_season{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between}
.btn_season a{position:relative;-webkit-box-sizing:border-box;box-sizing:border-box;background:#fff;border:1px solid #5bb653;color:#5bb653;text-align:center;z-index:1;-webkit-transition:background .3s ease-out, color .3s ease-out;-o-transition:background .3s ease-out, color .3s ease-out;transition:background .3s ease-out, color .3s ease-out}
.btn_season a:before, .btn_season a:after{content:'';position:absolute;top:0;left:0;width:100%;height:100%;z-index:-1}
.btn_season a:before{background:url("../img/common/btn_race.png") repeat-y 0 0, url("../img/common/btn_race.png") repeat-y 100% 0}
.btn_season a:after{background:url("../img/common/btn_race_on.png") repeat-y 0 0, url("../img/common/btn_race_on.png") repeat-y 100% 0;opacity:0;-webkit-transition:opacity .3s ease-out;-o-transition:opacity .3s ease-out;transition:opacity .3s ease-out}
.btn_season a:hover, .btn_season a.is-active{background:#5bb653;color:#fff}
.btn_season a:hover:after, .btn_season a.is-active:after{opacity:1}

.list_story{text-align:center}
.list_story .list_tab{margin-bottom:10px}
.list_story li:first-child{width:100%}

.box_story{position:relative;display:none;-webkit-box-sizing:border-box;box-sizing:border-box;z-index:1;-webkit-transform:translate(0, 50px);-ms-transform:translate(0, 50px);transform:translate(0, 50px)}
.box_story:last-child{display:block;-webkit-transform:translate(0, 0);-ms-transform:translate(0, 0);transform:translate(0, 0)}
.box_story i{position:absolute;top:0;left:0;width:100%;height:100%;-webkit-box-sizing:border-box;box-sizing:border-box;z-index:-1}
.box_story i:before{content:'';position:relative;display:block;height:100%;background:url("../img/common/frame05_m.png") repeat-y 50% 0;background-size:100% auto}
.box_story i:after{content:'';position:absolute;top:0;left:0;width:100%;height:100%;background:url("../img/common/frame05_t.png") no-repeat 50% 0, url("../img/common/frame05_b.png") no-repeat 50% 100%;background-size:100% auto;z-index:1}
.box_story h3{color:#5bb653}
.box_story h3.ttl{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center}
.box_story h3.ttl:after,.box_story h3.ttl:before{content:'';height:1px;margin-top:-.2em;background:#5bb653}
.box_story h3.ttl:before{margin-right:5px}
.box_story h3.ttl:after{margin-left:5px}
.box_story .img img{width:100%;vertical-align:top;line-height:1;font-size:0}
.box_story .img .img_main{margin-bottom:.6%}
.box_story .img .img_thum{display:-webkit-box;display:-ms-flexbox;display:flex}
.box_story .img .img_thum li{position:relative;overflow:hidden;cursor:pointer}
.box_story .img .img_thum li:not(:last-child){margin-right:.6%}
.box_story .img .img_thum li:after,.box_story .img .img_thum li:before{content:'';position:absolute;top:0;width:100%;padding-top:56.333%;background:rgba(0, 0, 0, 0.2);-webkit-transition:width .3s ease-out;-o-transition:width .3s ease-out;transition:width .3s ease-out}
.box_story .img .img_thum li:before{left:0}
.box_story .img .img_thum li:after{right:0}
.box_story .img .img_thum li.is-active:after,.box_story .img .img_thum li.is-active:before,.box_story .img .img_thum li:hover:after,.box_story .img .img_thum li:hover:before{width:0}
.box_story .staff{color:#9a1e23}
.box_story .staff h4:after{content:'';display:inline-block;margin-left:8px;background:url("../img/common/ico02.png") no-repeat 0 0/contain}
.box_story .staff ul{display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap}
.box_story .staff li:not(:last-child):after{content:'／'}

.box_season{display:none;-webkit-transform:translate(0, 50px);-ms-transform:translate(0, 50px);transform:translate(0, 50px)}


@media screen and (min-width:769px){
.btn_season{margin-bottom:53px}
.btn_season a{width:32.4%;padding:.2em 30px;font-size:18px;font-size:1.8rem;line-height:2;font-weight:normal}
.btn_season a:before, .btn_season a:after{background-size:25px auto}
.list_story li{margin:0 10px 10px}
.list_story a{font-size:20px;font-size:2rem;line-height:1;font-weight:normal}
.list_story a:before{top:-.58em}
.list_story a:not(#introduction):before{left:-.28em}
.box_story{padding:75px 60px}
.box_story i{padding:75px 0}
.box_story h3{margin-bottom:30px;font-size:30px;font-size:3rem;line-height:1;font-weight:bold}
.box_story h3.ttl{margin-bottom:10px}
.box_story h3.ttl:after,.box_story h3.ttl:before{width:52px}
.box_story .lead{margin-bottom:30px;font-size:20px;font-size:2rem;line-height:2;font-weight:bold}
.box_story p:not(:last-child){margin-bottom:30px}
.box_story .img{margin-bottom:30px}
.box_story .staff{font-size:14px;font-size:1.4rem;line-height:2;font-weight:normal}
.box_story .staff h4{font-size:20px;font-size:2rem;line-height:2;font-weight:normal}
.box_story .staff h4:after{width:26px;height:19px}
}


@media screen and (max-width:768px){
.btn_season{margin-bottom:46px}
.btn_season a{width:32.4%;padding:.2em 27px;font-size:14px;font-size:1.4rem;line-height:2;font-weight:normal}
.btn_season a:before, .btn_season a:after{background-size:22px auto}
.list_story a{font-size:22px;font-size:2.2rem;line-height:1;font-weight:normal}
.list_story a:before{top:-.52em;width:42px;height:42px}
.list_story a:not(#introduction):before{left:-.22em}
.box_story{padding:12.3839% 8% 18.57585%}
.box_story i{padding:9.66667% 0}
.box_story h3{margin-bottom:25px;font-size:20px;font-size:2rem;line-height:1;font-weight:bold}
.box_story h3.ttl{margin-bottom:10px}
.box_story h3.ttl:after,.box_story h3.ttl:before{width:60px}
.box_story .lead{margin-bottom:25px;font-size:16px;font-size:1.6rem;line-height:1.7;font-weight:bold}
.box_story p:not(:last-child){margin-bottom:25px}
.box_story .img{margin-bottom:25px}
.box_story .staff h4{margin-bottom:10px;font-size:18px;font-size:1.8rem;line-height:2;font-weight:normal}
.box_story .staff h4:after{width:23px;height:16.5px}
}

@media screen and (max-width:768px){
.btn_season a{width:32.4%;padding:.2em 27px;font-size:10px;font-size:1.0rem;line-height:2;font-weight:normal}
}