/*
================================================================================================================
jbox
================================================================================================================
*/
.toggle-inner b{color:#666;}
.toggle-inner b.rare{color:#ff3a7d !important;}
.toggle-inner ul{display:flex; flex-wrap:wrap;}
.toggle-inner ul + ul{margin-top:20px;}
.toggle-inner ul li{width:50%; color:#000; background:#fff; padding:5px 10px; border-top:1px solid;}
@media screen and (min-width:581px){.toggle-inner ul li:nth-child(even){border-left:1px solid;}}
@media screen and (max-width:580px){.toggle-inner ul li{width:100%; text-align:center;}}

/*
=========================
期間限定画像表示
=========================
*/
.limit_box.frame{margin:0 auto 20px !important;}
.limit_box{display:flex; align-items:center; margin:0 auto;}
.limit_box > div{width:50%; text-align:center;}

.limit_box .img_box img{width:100%; max-width:513px;}
.limit_box .text_box{line-height:180%; padding-left:30px;}
.limit_box .big_text{color:#cdff7e; font-size:24px; font-weight:bold; margin-bottom:10px;} 
.limit_box .popup-btn{max-width:300px; margin:20px auto 0 !important;}

@media screen and (max-width:800px){
.limit_box{max-width:640px; flex-wrap:wrap;}
.limit_box > div{width:100%;}
.limit_box .text_box{margin-top:20px; padding-left:0;}
.limit_box .big_text{font-size:18px;}}

/*
=========================
jbox一覧
=========================
*/
ul.jbox_set{display:flex; width:100%; flex-wrap:wrap; justify-content:space-between; margin:0 auto;}
ul.jbox_set li.frame{display:flex!important; width:calc(50% - 10px) !important; align-items:center; margin:0 0 20px !important;}

ul.jbox_set li .jbox_icon{width:135px; text-align:center;}
ul.jbox_set li .jbox_icon img{width:100%; max-width:135px;}
ul.jbox_set li .jbox_spec{width:calc(100% - 135px); padding-left:30px;}
ul.jbox_set li .jbox_spec > div{width:100%;}

ul.jbox_set li .jbox_spec .set_limited{font-weight:bold; color:#fff; font-size:17px;}
ul.jbox_set li .jbox_spec .set_name{color:#cdff7e; font-size:20px; font-weight:bold;}
ul.jbox_set li .jbox_spec .set_name br{display:none;}

ul.jbox_set li .jbox_spec .set_rank{
display:flex;
color:#000;
background:#fff;
border-radius:20px;
font-size:18px;
font-weight:bold;
line-height:110%;
flex-wrap:wrap;
align-items:center;
justify-content:space-between;
padding:5px 10px 5px 20px;
margin-top:10px;}
ul.jbox_set li .jbox_spec .set_rank p:first-child span{color:#ff3a7d;}
ul.jbox_set li .jbox_spec .set_rank p:nth-child(2){
font-size:13px;
font-weight:normal;
color:#fff;
background:#f00!important;
border-radius:20px;
padding:0 10px;}

ul.jbox_set li .jbox_spec .set_price,
ul.jbox_set li .jbox_spec .set_ticket > div:first-child{font-size:13px; margin-top:5px;}
ul.jbox_set li .jbox_spec .link-btn{max-width:200px; margin:20px auto 0 0 !important;}
ul.jbox_set li .jbox_spec .all_get{font-size:12px; margin:20px auto 0;}

@media screen and (max-width:1100px){
ul.jbox_set li .jbox_icon{width:120px;}
ul.jbox_set li .jbox_spec{width:calc(100% - 120px); padding-left:20px;}}

@media screen and (max-width:980px){
ul.jbox_set{max-width:640px;}
ul.jbox_set li.frame{width:100% !important;}
ul.jbox_set li .jbox_spec .set_name{font-size:18px;}
ul.jbox_set li .jbox_spec .set_rank{font-size:16px;}}

@media screen and (max-width:640px){
ul.jbox_set li.frame{flex-wrap:wrap; padding:20px 0 !important;}
ul.jbox_set li .jbox_icon{width:100%; margin-bottom:20px;}
ul.jbox_set li .jbox_spec{width:100%; padding-left:0; text-align:center;}

ul.jbox_set li .jbox_spec .set_rank{width:calc(100% - 40px); justify-content:center; margin:10px auto 0;}
ul.jbox_set li .jbox_spec .set_rank p:first-child{width:100%;}
ul.jbox_set li .jbox_spec .set_rank p:nth-child(2){margin-top:5px;}

ul.jbox_set li .jbox_spec .link-btn{margin:20px auto 0 !important;}}

@media screen and (max-width:370px){
ul.jbox_set li .jbox_spec .set_price,
ul.jbox_set li .jbox_spec .set_ticket > div:first-child{font-size:12px;}}

/*
=========================
LINKボタン
=========================
*/
.popup-btn{
display:block;
position:relative;
width:100%;
max-width:300px;
color:#fff !important;
background-color:#001e26;
font-size:16px;
text-align:center;
font-weight:bold;
border:1px solid #93a3a3;
padding:10px 0;
margin:10px 0 20px auto;
transition:all .3s ease;}
.popup-btn:hover{
text-decoration:none !important;
text-shadow:0 0 2px #00bcd4 , 0 0 2px #00bcd4 , 0 0 4px #00bcd4;
box-shadow:0 0 2px #00bcd4 , 0 0 2px #00bcd4 , 0 0 2px #00bcd4 , 0 0 4px #00bcd4 , 
           0 0 4px #00bcd4 inset , 0 0 2px #00bcd4 inset , 0 0 4px #00bcd4 inset , 0 0 4px #00bcd4 inset;}
.popup-btn::after{
display:block;
content:"";
position:absolute;
right:30px;
top:calc(50% - 8px);
width:16px;
height:16px;
border-right:2px solid;
border-bottom:2px solid;
transform:rotate(-45deg);
opacity:0;
transition:all .3s ease;}
.popup-btn:hover::after{right:20px; opacity:1; filter:drop-shadow(0 0 2px #00bcd4) drop-shadow(0 0 2px #00bcd4) drop-shadow(0 0 4px #00bcd4);}

@media screen and (max-width:480px){.popup-btn{max-width:100%; font-size:14px; padding:7px 0; margin:20px auto 0;}}

/*
================================================================================================================
PASELI・チケット残高表示
================================================================================================================
*/
#jbox_paseli_ticket_area{
display:flex; 
width:900px;
position:absolute;
top:92px;
left:calc(50% - 450px);
justify-content:space-between;
z-index:4 !important;}

#jbox_paseli_ticket_area > div{
display:flex;
width:calc(100% / 3 - 10px);
color:#fff;
border-radius:0 0 6px 6px;
font-size:14px;
letter-spacing:1px;
line-height:120%;
border:1px solid #fff;
align-items:center;
justify-content:center;
font-weight:bold;
padding:10px 0;}
#jbox_paseli_ticket_area > div > span{font-size:12px; font-weight:normal;}

#jbox_paseli_ticket_area > div:not(:first-child){
background-image:url(../../images/jbox/jbox_balance_bg.png);
background-position:left 10px center;
background-repeat:no-repeat;
background-size:26px auto;}
#jbox_paseli{background-color:#1bb367; background-image:none;}
#jbox_nomal_balance{background-color:#999;}
#jbox_premium_balance{background-color:#f88621;}

@media screen and (max-width:980px){#jbox_paseli_ticket_area{top:77px;}}
@media screen and (max-width:900px){
#jbox_paseli_ticket_area{width:calc(100% - 20px); left:10px;}
#jbox_paseli_ticket_area > div{width:calc(100% / 3 - 5px);}}

@media screen and (min-width:371px) and (max-width:850px){
#jbox_paseli_ticket_area > div{flex-wrap:wrap; text-align:center; padding:4px 0;}
#jbox_paseli_ticket_area > div > span{display:block; width:100%;}}
@media screen and (min-width:371px) and (max-width:730px){#jbox_paseli_ticket_area > div:not(:first-child){background-image:none;}}

@media screen and (max-width:500px){
#jbox_paseli_ticket_area{width:calc(100% - 4px); left:2px;}
#jbox_paseli_ticket_area > div{width:calc(100% / 3 - 2px);}
#jbox_paseli_ticket_area > div > span{font-size:10px;}}
@media screen and (max-width:400px){#jbox_paseli_ticket_area > div{letter-spacing:0;}}
@media screen and (max-width:370px){
#contents_bg{margin-top:220px;}
#jbox_paseli_ticket_area{flex-wrap:wrap; width:calc(100% - 20px); left:10px;}
#jbox_paseli_ticket_area > div{width:100%;}
#jbox_paseli_ticket_area > div:not(:first-child){border-top:none;}
#jbox_paseli_ticket_area > div:not(:last-child){border-radius:0;}}

#jbox_paseli_ticket_area.fixed{position:fixed; top:92px; left:calc(50% - 450px); z-index:4 !important;}
@media screen and (max-width:980px){#jbox_paseli_ticket_area.fixed{position:fixed; top:77px;}}
@media screen and (max-width:500px){#jbox_paseli_ticket_area.fixed{left:2px;}}
@media screen and (max-width:370px){#jbox_paseli_ticket_area.fixed{left:10px;}}

/*
================================================================================================================
モーダルウィンドウ
================================================================================================================
*/
#jbox_detail{
width:640px;
padding:20px 10px !important;
margin:0 auto !important;}

#jbox_detail .link-btn{
max-width:300px;
font-size:13px;
padding:5px 0;
margin:0 auto;}
    
#jbox_detail .list{
width:100%;
height:300px;
background-color:#001e26;
font-size:13px;
line-height:140%;
letter-spacing:1px;
margin:20px auto;
padding:10px;}
#jbox_detail .list ul{width:100%; height:100%; overflow-y:scroll; padding-right:10px;}

@media screen and (max-width:640px){
.mfp-iframe-scaler{height:100%;}
#jbox_detail{width:90% !important;}
#jbox_detail .list{height:200px; font-size:12px;}}