@charset "utf-8";

.index_header_bg{background:url(../img/index/header_bg.gif); -moz-background-size:100% auto; background-size:100% auto;}
.index_header{width: 100%; max-width: 1200px; margin: 0 auto; background:url(../img/index/header.jpg) 0 center no-repeat; -moz-background-size:100% auto; background-size:100% auto; padding-top: 100px;}

.index_header_in{width: 95%; max-width: 1000px; margin: 0 auto; padding-bottom: 1.8%; margin-top:30px;}

.catch_copy_box{width: 25%; max-width: 148px; margin: 0 auto; padding-bottom: 0; padding-top: 10px;}

.header_left_box{width: 25%; float: left;}
.header_center_box{width: 50%; /* float: left; */ margin: 0 auto; text-align: center; margin-top: 30px;}
.header_right_box{width: 25%; float: left;}

.index_game_point_box{ width: 95%; max-width: 850px; margin: 0 auto; background:#bfa548; margin-top: 14px;}
.index_game_point_left{width: 30%; float: left; padding: 0.5%;}
.index_game_point_right{width: 68%; float: right;}

.header_logo_box{width: 35%; max-width: 450px; margin:0 auto; padding-top: 0px; text-align: center; padding-top: 30px;}


.product_box{width: 95%; max-width: 1000px; margin: 0 auto; padding: 24px 0;}
.product_left{ width: 49%; margin: 0 auto; text-align: left; float: left;}
.product_right{ width: 49%; margin: 0 auto; text-align: left; float: right;}

.product_pk_name{ padding: 0;}
.product_pk_name dt{padding: 18px 0 0 0; color: #c1b77c; font-size: 32px; text-align: center; line-height:1.3;}
.product_pk_name dt span{font-size: 20px;}
.product_pk_name dd{padding: 8px 0 18px 0; text-align: center; line-height:1.61;}

.productinfo_pk_img{width: 100%; max-width: 1000px; margin: 0 auto; text-align: center;}

.product_pk_list{width: 95%; max-width: 800px; margin: 0 auto; line-height:1.61;}
.product_pk_list dt{color: #c1b77c; font-size: 18px; padding: 16px 0 0 0;}
.product_pk_list dd{padding: 24px 0 8px 0;}

.sp_item_img{width: 100%; max-width: 945px; margin: 0 auto; text-align: center;}
.sp_item_left{width: 50%; margin: 0 auto; float: left;}
.sp_item_right{width: 50%; margin: 0 auto; float: right;}

.box_menu_list{width: 90%; max-width: 800px; margin: 0 auto; line-height:1.61;}
.box_menu_list li{width: 100%; padding: 0.5%;}
.box_menu_list li a{width: calc(100% - 10px); display:block; padding: 5px; background: #8115ff; color: #fff; border-radius: 30px; -webkit-border-radius: 30px; -moz-border-radius: 30px; text-align: center;}

.page_icon{width: 50%; max-width: 121px; margin: 12px auto 42px auto;}

.red{color: #de006e;}
.end{color: #535353 !important;}

.bannercm2_box{width: 95%; max-width: 850px; margin: 0 auto; padding: 24px 0;}

.bannercm2_box_left{width: 49%; float: left;}
.bannercm2_box_right{width: 50%; float: right;}
.bannercm2_box_right li{width: 49%; float: left; padding: 0 0.5% 6px 0.5%;}



@media screen and (max-width: 640px) {
.bannercm2_box_left{width: 100%; max-width: 400px; float: none; margin: 0 auto; padding-bottom: 14px;}
.bannercm2_box_right{width: 100%;  max-width: 500px; float: none; margin: 0 auto;}

/*
.sp_item_left{width: 100%; float: none; padding-bottom: 5px;}
.sp_item_right{width: 100%; float: none;}
*/
.brsp br{display:none;}


}



/* cast ----------------------------------------------------------------------------------------------- */
.tabs{}
.tabs a{color: #f00;}

/* ベース背景
---------------------------------------------------------------------------------- */
.bg_3m{background:url(../img/index/cast/cast_3m_bg.gif) top center no-repeat;}
.bg_xp{background:url(../img/index/cast/cast_xp_bg.gif) top center no-repeat;}

@media screen and (max-width: 1500px) {
.index_header{width: 100%; max-width: 1500px; margin: 0 auto; background:url(../img/index/header.jpg) top center no-repeat; -moz-background-size:100% auto; background-size:100% auto; padding-top: 0%; padding-bottom: 2%;}
.index_header_bg{background: transparent;}
.index_header_in{width: 90%; max-width: 1000px; margin: 0 auto; padding-bottom: 0;}
.catch_copy_box{width: 10%; max-width: 148px; margin: 0 auto; padding-bottom: 0;}
.header_center_box{width: 50%; /*float: left; */ margin: 0 auto; text-align: center; margin-top: 30px;}
.header_logo_box{width: 35%; max-width: 450px; margin:0 auto; padding-top: 1.5%; text-align: center;}

}


@media screen and (max-width: 1000px) {
.bg_3m{background:url(../img/index/cast/cast_3m_bg.gif) top center no-repeat;  -moz-background-size:170% auto; background-size:170% auto; }
.bg_xp{background:url(../img/index/cast/cast_xp_bg.gif) top center no-repeat;  -moz-background-size:170% auto; background-size:170% auto; }

.cast_main_tab{width: 95%; max-width: 900px;  margin: 0 auto; padding-top: 9.8%; }
.cast_main_tab img{width: 100%; max-width: 236px;}
.cast_main_tab .tabmenu1{width: 45%;  max-width: 236px; float: left;}
.cast_main_tab .tabmenu2{width: 45%;  max-width: 236px; float: right;}

.header_center_box{margin-top:0; border:}
.index_header{width: 100%; max-width: 1500px; margin: 0 auto; background:url(../img/index/header.jpg) top center no-repeat; -moz-background-size:100% auto; background-size:100% auto; padding-top: 0%; padding-bottom: 0.5%;}


}


/* グループ切り替え
---------------------------------------------------------------------------------- */
.cast_main_tab{width: 95%; max-width: 900px;  margin: 0 auto; padding-top: 100px; }
.cast_main_tab img{width: 100%; max-width: 236px;}
.cast_main_tab .tabmenu1{width: 45%;  max-width: 236px; float: left;}
.cast_main_tab .tabmenu2{width: 45%;  max-width: 236px; float: right;}

.bg_3m .tabmenu1{display: none;}
.bg_xp .tabmenu2{display: none;}


.main_bg_3m{width: 100%; max-width: 1000px;  margin: 0 auto;}
.main_bg_xip{width: 100%; max-width: 1000px;  margin: 0 auto; }


.main_bg_3m1{width: 100%; max-width: 1000px;  margin: 0 auto; background:url(../img/cast/cast_3m_main1_bg.png) 0 80px no-repeat; -moz-background-size:100% auto; background-size:100% auto; }
.main_bg_3m2{width: 100%; max-width: 1000px;  margin: 0 auto; background:url(../img/cast/cast_3m_main2_bg.png) 0 80px no-repeat; -moz-background-size:100% auto; background-size:100% auto; }
.main_bg_3m3{width: 100%; max-width: 1000px;  margin: 0 auto; background:url(../img/cast/cast_3m_main3_bg.png) 0 80px no-repeat; -moz-background-size:100% auto; background-size:100% auto; }

.main_bg_xip1{width: 100%; max-width: 1000px;  margin: 0 auto; background:url(../img/cast/cast_xip_main1_bg.png) 0 80px no-repeat; -moz-background-size:100% auto; background-size:100% auto; }
.main_bg_xip2{width: 100%; max-width: 1000px;  margin: 0 auto; background:url(../img/cast/cast_xip_main2_bg.png) 0 80px no-repeat; -moz-background-size:100% auto; background-size:100% auto; }
.main_bg_xip3{width: 100%; max-width: 1000px;  margin: 0 auto; background:url(../img/cast/cast_xip_main3_bg.png) 0 80px no-repeat; -moz-background-size:100% auto; background-size:100% auto; }


.tujiname{width:100%; max-width:55px; display:inline-block;}



/* キャラ別
---------------------------------------------------------------------------------- */
.cast_3m_otowa{background:url(../img/index/cast/cast_otowa.png) top left no-repeat; height: auto; padding-bottom: 10%;}
.cast_3m_kirishima{background:url(../img/index/cast/cast_kirishima.png) top left no-repeat; height: auto; padding-bottom: 10%;}
.cast_3m_tsuji{background:url(../img/index/cast/cast_tsuji.png) top left no-repeat; height: auto; padding-bottom: 10%;}

.cast_xip_fuwa{background:url(../img/index/cast/cast_fuwa.png) top right no-repeat; height: auto; padding-bottom: 10%;}
.cast_xip_date{background:url(../img/index/cast/cast_date.png) top right no-repeat; height: auto; padding-bottom: 10%;}
.cast_xip_kanzaki{background:url(../img/index/cast/cast_kanzaki.png) top right no-repeat; height: auto; padding-bottom: 10%;}


/* 情報
---------------------------------------------------------------------------------- */
.cast_3m_data{ width: 50%; text-align: left; float: right; color: #121c50; padding-bottom: 150px;}
.cast_xip_data{ width: 50%; text-align: left; float: left; color: #fff; padding-bottom: 150px; margin-left: 18%;}

.castname1{font-size: 60px; padding-top: 40%;}
.castname2{font-size: 18px; padding: 12px 0 32px 0;}
.castcv{width: 100%; max-width: 340px; font-size: 30px; text-align: right; padding-bottom: 100px;}

/* キャラ切り替え
---------------------------------------------------------------------------------- */
.cast_sub_menu{ width: 47%; max-width: 470px; text-align: left; float: right; color: #121c50; margin-top: -22%; margin-right: 3%;}
.cast_sub_menu img{width: auto; max-width: 100%;}
.cast_sub_menu .cast_menu_icon{width: calc(33.3% - 4px); float: left; margin: 2px;}

.cast_sub_menu2{ width: 47%; max-width: 470px; text-align: left; float: left; color: #121c50; margin-top: -22%; margin-left: 3%;}
.cast_sub_menu2 img{width: auto; max-width: 100%;}
.cast_sub_menu2 .cast_menu_icon2{width: calc(33.3% - 4px); float: left; margin: 2px;}


.box_img_brn{width:95%; max-width:400px; margin: 0 auto;}






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

/* ベース背景
---------------------------------------------------------------------------------- */
.cast_main_tab{width: 95%; max-width: 900px;  margin: 0 auto; padding-top: 12%; }

.cast_main_tab .tabmenu1{width: 45%;  max-width: 180px; float: left;}
.cast_main_tab .tabmenu2{width: 45%;  max-width: 180px; float: right;}

.main_bg_3m1{background:url(../img/cast/cast_3m_main1_bg.png) center 40px no-repeat; -moz-background-size:110% auto; background-size:110% auto; }
.main_bg_3m2{background:url(../img/cast/cast_3m_main2_bg.png) center 40px no-repeat; -moz-background-size:110% auto; background-size:110% auto; }
.main_bg_3m3{background:url(../img/cast/cast_3m_main3_bg.png) center 40px no-repeat; -moz-background-size:110% auto; background-size:110% auto; }

.main_bg_xip1{background:url(../img/cast/cast_xip_main1_bg.png) center 40px no-repeat; -moz-background-size:110% auto; background-size:110% auto; }
.main_bg_xip2{background:url(../img/cast/cast_xip_main2_bg.png) center 40px no-repeat; -moz-background-size:110% auto; background-size:110% auto; }
.main_bg_xip3{background:url(../img/cast/cast_xip_main3_bg.png) center 40px no-repeat; -moz-background-size:110% auto; background-size:110% auto; }


.cast_3m_otowa{background:url(../img/index/cast/cast_otowa.png) top left no-repeat; height: auto;  -moz-background-size:55% auto; background-size:55% auto;}
.cast_3m_kirishima{background:url(../img/index/cast/cast_kirishima.png) top left no-repeat; height: auto;  -moz-background-size:55% auto; background-size:55% auto;}
.cast_3m_tsuji{background:url(../img/index/cast/cast_tsuji.png) top left no-repeat; height: auto;  -moz-background-size:55% auto; background-size:55% auto;}

.cast_xip_fuwa{background:url(../img/index/cast/cast_fuwa.png) 0 right- no-repeat; height: auto;  -moz-background-size:63% auto; background-size:63% auto;}
.cast_xip_date{background:url(../img/index/cast/cast_date.png) top right no-repeat; height: auto;  -moz-background-size:63% auto; background-size:63% auto;}
.cast_xip_kanzaki{background:url(../img/index/cast/cast_kanzaki.png) top right no-repeat; height: auto;  -moz-background-size:66% auto; background-size:66% auto;}

.cast_3m_data{width: 48%;}
.castname1{font-size: 6vw; padding-top: 31%;}
.castname2{font-size: 2.5vw; padding: 12px 0 32px 0;}
.castcv{width: 95%; max-width: 240px; font-size: 2.5vw; text-align: right; padding-bottom: 100px;}

.cast_sub_menu{width: 45%; max-width: 400px; margin-right: 5%; margin-top: -26%;}
.cast_sub_menu2{width: 45%; max-width: 400px; margin-left: 5%; margin-top: -26%;}

.tujiname{width:100%; max-width:46px; display:inline-block;}


}


@media screen and (max-width: 750px) {
.tujiname{width:100%; max-width:40px;}
}


@media screen and (max-width: 640px) {
.index_header_in{width: 100%; max-width: 1000px; margin: 0 auto; padding-bottom: 1.8%; margin-top:30px;}
.index_header{width: 100%; max-width: 1200px; margin: 0 auto; background:url(../img/index/header_sp.jpg?20170921) top center no-repeat; -moz-background-size:100% auto; background-size:100% auto; padding-top: 0%;}

.catch_copy_box{width: 20%; max-width: 148px; margin: 0 auto; padding-bottom: 2%; padding-top: 5%;}

.bg_3m{background:url(../img/index/cast/cast_3m_bg_sp.gif) 0 20px no-repeat; -moz-background-size:100% auto; background-size:100% auto; padding-bottom: 20px;}
.bg_xp{background:url(../img/index/cast/cast_xp_bg_sp.gif) 0 20px no-repeat; -moz-background-size:100% auto; background-size:100% auto; padding-bottom: 20px;}


.main_bg_3m1{background:url(../img/cast/cast_3m_main1_bg_sp_index.png) center 92% no-repeat; -moz-background-size:100% auto; background-size:100% auto; }
.main_bg_3m2{background:url(../img/cast/cast_3m_main2_bg_sp_index.png) center 92% no-repeat; -moz-background-size:100% auto; background-size:100% auto; }
.main_bg_3m3{background:url(../img/cast/cast_3m_main3_bg_sp_index.png) center 92% no-repeat; -moz-background-size:100% auto; background-size:100% auto; }

.main_bg_xip1{background:url(../img/cast/cast_xip_main1_bg_sp_index.png) center 92% no-repeat; -moz-background-size:100% auto; background-size:100% auto; }
.main_bg_xip2{background:url(../img/cast/cast_xip_main2_bg_sp_index.png) center 92% no-repeat; -moz-background-size:100% auto; background-size:100% auto; }
.main_bg_xip3{background:url(../img/cast/cast_xip_main3_bg_sp_index.png) center 92% no-repeat; -moz-background-size:100% auto; background-size:100% auto; }



.cast_3m_otowa{background:url(../img/index/cast/cast_otowa_sp.png) top center no-repeat; height: auto;  -moz-background-size:80% auto; background-size:80% auto;}
.cast_3m_kirishima{background:url(../img/index/cast/cast_kirishima_sp.png) top center no-repeat; height: auto;  -moz-background-size:80% auto; background-size:80% auto;}
.cast_3m_tsuji{background:url(../img/index/cast/cast_tsuji_sp.png) top center no-repeat; height: auto;  -moz-background-size:80% auto; background-size:80% auto;}

.cast_xip_fuwa{background:url(../img/index/cast/cast_fuwa_sp.png) top center no-repeat; height: auto;  -moz-background-size:80% auto; background-size:80% auto;}
.cast_xip_date{background:url(../img/index/cast/cast_date_sp.png) top center no-repeat; height: auto;  -moz-background-size:80% auto; background-size:80% auto;}
.cast_xip_kanzaki{background:url(../img/index/cast/cast_kanzaki_sp.png) top center no-repeat; height: auto;  -moz-background-size:80% auto; background-size:80% auto;}


.cast_3m_data{ width: 100%; text-align: center; float: none; padding-bottom: 0; padding-top: 50%;}
.cast_xip_data{ width: 100%; text-align: center; float: none; padding-bottom: 0; padding-top: 50%; margin-left: 0;}


.castname1{font-size: 9vw; padding-top: 19%;}
.castname2{font-size: 4vw; padding: 12px 0 20px 0;}
.castcv{width: 100%; max-width: 640px; font-size: 3.5vw; text-align: center; padding-bottom: 50px;}
.cast_sub_menu,
.cast_sub_menu2{ width: 95%; max-width: 470px; text-align: center; float: none; margin: 0 auto;}

.product_left,.product_right{ width: 100%; float: none; padding-bottom: 32px; }


.cast_sp_margin .cont_title{padding-bottom: 0; margin-bottom: 0;}

.product_pk_name dt{ font-size: 6vw;}
.product_pk_name dd{ font-size: 3vw;}
.product_pk_list dt{ font-size: 3.5vw; padding-top: 5px;}

.page_icon{width: 25%;}

.header_left_box{display: none;}
.header_center_box{width: 100%; float: none; margin: 0 auto; text-align: center; padding-bottom: 10px;}
.header_right_box{display: none;}

.header_center_box_left_box{width: 60%; /* float: left; padding-top: 5%; */ margin: 0 auto;}
.header_center_box_right_box{width: 40%; float: right; margin-top: 20px; background:#bfa548;}




.tujiname{width:50%; max-width:49px; display:inline-block;}
.header_logo_box{width: 50%; max-width: 450px; margin:0 auto; padding-top: 0px; text-align: center; padding-top: 3.1%;}

}

@media screen and (max-width: 500px) {
.tujiname{width:100%; max-width:45px;}
}



@media screen and (max-width: 420px) {
.cast_main_tab{padding-top: 21.5%;}
.bg_3m{background:url(../img/index/cast/cast_3m_bg_sp.gif) 0 40px no-repeat; -moz-background-size:100% auto; background-size:100% auto; padding-bottom: 20px;}
.bg_xp{background:url(../img/index/cast/cast_xp_bg_sp.gif) 0 40px no-repeat; -moz-background-size:100% auto; background-size:100% auto; padding-bottom: 20px;}

.main_bg_3m1{background:url(../img/cast/cast_3m_main1_bg_sp_index.png) center 80% no-repeat; -moz-background-size:100% auto; background-size:100% auto; }
.main_bg_3m2{background:url(../img/cast/cast_3m_main2_bg_sp_index.png) center 80% no-repeat; -moz-background-size:100% auto; background-size:100% auto; }
.main_bg_3m3{background:url(../img/cast/cast_3m_main3_bg_sp_index.png) center 80% no-repeat; -moz-background-size:100% auto; background-size:100% auto; }

.main_bg_xip1{background:url(../img/cast/cast_xip_main1_bg_sp_index.png) center 80% no-repeat; -moz-background-size:100% auto; background-size:100% auto; }
.main_bg_xip2{background:url(../img/cast/cast_xip_main2_bg_sp_index.png) center 80% no-repeat; -moz-background-size:100% auto; background-size:100% auto; }
.main_bg_xip3{background:url(../img/cast/cast_xip_main3_bg_sp_index.png) center 80% no-repeat; -moz-background-size:100% auto; background-size:100% auto; }

.product_pk_list dt{ font-size: 16px; padding-top: 5px; }
.product_pk_list dt .point{font-weight: 500;}

.tujiname{width:25%; max-width:35px; display:inline-block;}


.castname1{font-size: 9vw; padding-top: 15%;}
.castname2{font-size: 4vw; padding: 12px 0 12px 0;}
.castcv{width: 100%; max-width: 640px; font-size: 4.5vw; text-align: center; padding-bottom: 50px;}
.cast_sub_menu,
.cast_sub_menu2{ margin-top: 0;}
}

.onevent{
background: url(../img/index/cast/cast_3m_btn.jpg);
background-blend-mode: multiply;
-moz-background-size:100% 100%; background-size:100% 100%;
}

.onevent img{
filter:alpha(opacity=30);
-moz-opacity:0.30;
-khtml-opacity:0.30;
opacity:0.30;

}


@media screen and (max-width: 360px) {
.tujiname{width:25%; max-width:30px;}
}