﻿@charset "utf-8";

/*////////////////////////////////////////////////////////

/css/top_sp.css

/////////////////////////////////////////////////////////*/

@media screen and (-webkit-min-device-pixel-ratio:2),
                  (min-resolution: 2dppx){

}

@media only screen and (max-device-width: 0), screen and (max-width: 768px) {
body{-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;}

/*slider*/
.bx-wrapper .bx-pager.bx-default-pager a{width: 3.5vw;height: 3.5vw;}

.slick-prev:before{width: 100%;height: 30px;background-size: contain;max-width: 30px;}
.slick-next:before{width: 100%;height: 30px;background-size: contain;max-width: 30px;}

.slick-prev:before{width: 40px;height: 40px;background-size: contain;}
.slick-next:before{width: 40px;height: 40px;background-size: contain;}
.slick-prev, .slick-next{width: 31px !important;height: 31px !important;}
ul.bxslider ,
ul.bxslider li {margin:0;padding:0;}
.bx-wrapper .bx-pager.bx-default-pager a.active{background: #6fcbeb !important;}
#box_img a{font-size: 1rem !important;}

@media only screen and (max-device-width: 0), screen and (max-width: 500px) {
.android .bx-wrapper{width: 90%;margin: 0 auto;}
.bx-wrapper .bx-controls-direction a{content:"";width: 100%;display: block;width: 2em !important;
height: 2em !important;background-size: 100% auto;visibility: inherit;cursor: pointer;transition: 1.0s ;
margin-left: .5em;display: inline-block;vertical-align: middle;margin-bottom: .2em;}

.slick-prev:before{height: 25px;max-width: 25px;}
.slick-next:before{height: 25px;max-width: 25px;}

#wrapper_navi{margin-top: -3rem;}
}

/* navi */

#navi{margin: 0 auto 2em auto;}


/* ============= 最新情報 ============= */
.top_informationin h2{width:100%;}
.niji2{}
.niji2 img{}
.news_top img{width: 40px;}
.news_top:after{height: 7px;}
.newsin:after{height: 7px;}

.top_informationin{width:80%;}
.top_informationin h2{width: 100%;}
.slick-list{width: 80%;}
.niji2{margin-top: 3em;}
.h2_information_ttl_bg{width: 80%;}

#news{margin-top: 5em;}
#entry_list_more li{width: calc((100% - 3em) / 2 );}
#more_btn img{width: 30%;}
#close_btn img{width: 30%;}

.sns{display: none;}
.modalWrapper{width:90%;padding: 5em 0;}

@media only screen and (max-device-width: 0), screen and (max-width: 500px) {

#sns{display: none;}
}

@media only screen and (max-device-width: 0), screen and (max-width: 400px) {
#news{margin-top: 4em;}
.news_wrapper{margin-top: 0;}
}

/* ============= サンエックスキャラクターズ ============= */

.niji3{}
.top_charactersin h2{width:80%;left: 2%;right: inherit;}
.yousei2{right:.5em;width:12.41%;top:-5rem;}
.yousei2 img{right:.2rem;}
@media only screen and (max-device-width: 0px), screen and (max-width: 500px) {.yousei2{top:-3rem;}}

.top_character_gallery{}
.character_galleryin{width: 100%;padding: 1.25%;box-sizing: border-box;display: inherit;}
.character_galleryin li:nth-child(1),.character_galleryin li:nth-child(2){width: 48%;display: inline-block;border-radius: 10px;}
.character_galleryin li:nth-child(2){margin-right: 0;}
.character_galleryin li:nth-child(3){width: 100%;text-align: center;margin: 2.25% auto 0 auto;position: inherit;justify-content: space-between;align-items: center;}
.character_galleryin li:nth-child(3) img{position: inherit;}
.character_galleryin li:nth-child(3) p{width: calc((100% - 10%) / 3);border-radius: 10px;margin:0 1%;}

/*.character_galleryin li:nth-child(3) p:nth-child(1), .character_galleryin li:nth-child(3) p:nth-child(2), .character_galleryin li:nth-child(3) p:nth-child(3){margin-bottom: inherit;}*/
.character_galleryin li:nth-child(3) p:nth-child(2), .character_galleryin li:nth-child(3) p:nth-child(3), .character_galleryin li:nth-child(3) p:nth-child(4), .character_galleryin li:nth-child(3) p:nth-child(5){margin-right:1% !important;}
.top_character_gallery_image_pc{display: none;}
.top_character_gallery_image_sp{display: block;}
/*.character_galleryin li:nth-child(3) p:nth-child(6){display:none;}*/

@media only screen and (max-device-width: 0px), screen and (max-width: 400px) {.character_galleryin li:nth-child(3) p{width: calc((100% - 12%) / 3);}}
.character_galleryin li:nth-child(3) p:nth-child(5){position: inherit;}
.character_galleryin li:nth-child(3) p:nth-child(1),.character_galleryin li:nth-child(3) p:nth-child(5){margin-left: 1%;margin-right: 1%;}
.character_galleryin li:nth-child(3) p:nth-child(4){margin-right: 0;}

.top_contents_box1 li{width:calc((100% - 5em) /4 );}
.top_banner_etc ul li{width:calc((100% - 2em) / 3);margin: .2em;}


/* ============= サンエックスチャンネル ============= */
.top_sanxchannel{margin-top: 0;top: 0;margin: 0 auto 0 auto;}
.top_sanxchannelin h2{width: 80%;}
.top_sanxchannelin h2 img{}
.moviein li{display: block;width: 95%;margin: 1em auto;}
.moviein{padding-top: 1em;}

@media only screen and (max-device-width: 0), screen and (max-width: 640px) {
#top_sanxchannel{margin: 2em auto 0 auto;}
.moviein li{position: relative;width: 90%;padding-top: 56.25%;}
.moviein li iframe {position: absolute;top: 0;right: 0;width: 100% !important;height: 100% !important;}
.moviein li:nth-child(2) {margin-left: inherit;}
}
.yousei5{width:13%;right:0;}
.yousei5 img{right:.2rem;}




/* ============= CONTENTS ============= */
.top_contentsin_ttl h2{left: 2em;}
.top_contents_coming_soon3,.top_contents_coming_soon4{display:none !important;}
@media only screen and (max-device-width: 0), screen and (max-width: 500px) {
.top_contentsin_ttl h2{width:80%;}
.top_contents_coming_soon2{display:none !important;}

.top_contents_box1 li{width:calc((100% - 1.8em) / 3 );margin: .2em;}

.yousei3{z-index: 20;}
.yousei3 img{left:0;}
.yousei3{top:-1rem;}
}

}