#main.wide > #main-inner{padding-bottom:0;}
#main > #main-inner > #inner{font-family:'Noto Sans JP', sans-serif;}
#main > #main-inner > #inner > #title{padding:0 !important;}
#main > #main-inner > #inner > #title img{width:100% !important; max-width:100% !important;}
@media screen and (max-width:1100px){#main > #main-inner{padding-top:0 !important;}}

.red{color:#c03b5c;}

/*フォント*/
h4,
#catch p,
#catch ul li,
.item-list .inner .item ul li:nth-child(1),
#confirm p,
#link p{font-family:"M PLUS Rounded 1c", sans-serif; font-weight:700; transform:rotate(0.03deg);}

/*中-見出し*/
h4{color:#fff; background:#009b65; border-radius:10px; padding:10px; margin:20px auto 10px;}
h4.pink{background:#ed6e47;}

.box > ul.dot{margin:10px auto 20px;}
.box ul.dot{line-height:150%;}
.box ul.dot li + li{margin-top:5px;}
.box ul.dot li a,
.box ul.ast li a{color:#fb56a8; text-decoration:underline;}
.box ul.dot li a:hover,
.box ul.ast li a:hover{text-decoration:none;}

/*
================================================================================================================
公式サイト-リンク
================================================================================================================
*/
#link{background:#009b65; margin:40px auto 0;}
#link p{color:#fff; font-size:22px; padding:15px 10px; text-align:center;}
#link a{display:block; background:#fff;}
#link a img{transition:opacity .2s ease;}
#link a:hover img{opacity:.7;}
@media screen and (max-width:440px){#link p{font-size:15px; padding:10px;}}

/*
================================================================================================================
キャンペーン概要
================================================================================================================
*/
#catch{font-weight:700;}
#catch p,
#catch ul li{color:#fc8d1a; font-weight:800; font-size:24px; line-height:120%; text-align:center; margin:0 auto 10px;}
@media screen and (max-width:480px){#catch p{font-size:18px;}}

#catch.follow ul li{font-size:18px; text-align:left; padding-left:20px;}
#catch.follow ul li a{color:#fb56a8; text-decoration:underline;}
#catch.follow ul li a:hover{text-decoration:none;}
@media screen and (max-width:480px){#catch.follow ul li{font-size:16px;}}
@media screen and (max-width:370px){#catch.follow ul li{font-size:14px;}}

/*
================================================================================================================
開催期間
================================================================================================================
*/
#date{background:#01de91; border:2px solid #2eaff0; border-radius:20px; padding:5px; margin:20px auto;}
#date ul{background:#fff; border:2px solid #2eaff0; border-radius:14px; padding:0 10px;}
#date ul li{display:flex; font-size:22px; font-weight:700; padding:10px 0; flex-wrap:wrap; align-items:center; justify-content:center;}
#date ul li + li{border-top:1px dashed #66baff;}
#date ul li p:nth-child(1){width:130px; color:#fff; background:#3d61ad; font-size:15px; text-align:center; padding:5px; border-radius:5px;}
#date ul li p:nth-child(2){/*width:calc(100% - 200px);*/margin-left:10px;}
#date ul li p span{font-size:15px;}
@media screen and (max-width:480px){
#date ul li{font-size:18px;}
#date ul li p:nth-child(1){font-size:12px;}
#date ul li p span{font-size:14px;}
#date ul li p:nth-child(1){padding:0 5px; margin-bottom:5px;}
#date ul li p:nth-child(2){margin-left:0;}}

/*
================================================================================================================
ボタン
================================================================================================================
*/
.apply-btn{
display:block;
position:relative;
width:90%;
max-width:400px;
color:#fff;
background-color:#2eaff0;
text-align:center;
font-weight:700;
letter-spacing:1px;
margin:20px auto;
transition:all .2s ease;}
.apply-btn:not(.back){font-size:20px; border:2px solid #4de7b2; border-radius:30px; padding:15px 0; filter:drop-shadow(0 5px 2px rgba(45,35,96,.2)); cursor:pointer;}
.apply-btn:not(.back) p{filter:drop-shadow(1px 1px 0 #000) drop-shadow(1px -1px 0 #000) drop-shadow(-1px 1px 0 #000) drop-shadow(-1px -1px 0 #000) drop-shadow(2px 2px 1px #000);}
.apply-btn:not(.back):hover{filter:drop-shadow(0 5px 2px rgba(45,35,96,.2)) drop-shadow(5px 8px 1px rgba(45,35,96,.2)) saturate(150%);}

.apply-btn.back{max-width:200px; background:#004484; border-radius:10px; padding:10px 0;}
.apply-btn.back:hover{background:#009b65;}
.apply-btn.none{filter:grayscale(1); pointer-events:none;}

.apply-btn.done{pointer-events:none; background-image:url(/game/polarischord/pc/img/common/bg/dot_pink.png); border:2px solid #fb56a8;}
.apply-btn.done p{filter:drop-shadow(1px 1px 0 #fb56a8) drop-shadow(1px -1px 0 #fb56a8) drop-shadow(-1px 1px 0 #fb56a8) drop-shadow(-1px -1px 0 #fb56a8) drop-shadow(2px 2px 1px #8b5589);}

.apply-btn:not(.back)::before,
.apply-btn:not(.back)::after{
display:block;
content:"";
position:absolute;
width:40px;
height:40px;
background-size:100% auto;
background-position:center;
background-repeat:no-repeat;}

@media screen and (max-width:480px){
.apply-btn:not(.back){font-size:16px;}
.apply-btn:not(.back)::before,.apply-btn:not(.back)::after{width:30px; height:30px;}
.apply-btn:not(.back)::before{top:-10px;}
.apply-btn:not(.back)::after{bottom:-10px;}}

#apply-area .comp{color:#f00; text-align:center; font-weight:700; padding:0 20px;}
#apply-area .comp br{display:none;}
@media screen and (max-width:700px){#apply-area .comp br{display:block;}}


/*
================================================================================================================
応募方法ステップ
================================================================================================================
*/
div.num{position:relative; background:rgba(224,255,242,.2); font-weight:700; font-size:18px; border:3px solid; border-radius:10px; padding:15px 10px 15px 40px; margin:30px auto 0;}
div.num:nth-child(2){margin-top:0;}
div.num::before{position:absolute; left:10px; top:calc(50% - 10px); font-weight:900; font-size:26px;}
div.num.one::before{content:"①";}
div.num.two::before{content:"②";}
div.num.three::before{content:"③";}
@media screen and (max-width:480px){div.num{font-size:15px;}}
@media screen and (max-width:390px){
div.num{font-size:14px; padding:10px 10px 10px 30px;}
div.num::before{left:5px; font-size:20px;}}

/*
================================================================================================================
景品一覧
================================================================================================================
*/
.item-list{}
.item-list .inner{display:flex; justify-content:center; text-align:center;}
.item-list .inner:nth-child(2){/*justify-content:space-between;*/}
.item-list .inner + .inner{margin-top:20px;}
.item-list .inner .item{display:block; font-weight:700; border-radius:10px; padding:10px; transition:all .2s ease;}
.item-list .inner:nth-child(2) .item{width:calc((100% / 3) - 5px);}
@media screen and (max-width:740px){
.item-list .inner{flex-wrap:wrap;}
.item-list .inner .item{width:100% !important;}
.item-list .inner:nth-child(2) .item + .item{margin-top:20px;}}

/*景品画像*/
.item-list .inner .item *{position:relative;}
.item-list .inner .item img{filter:drop-shadow(0 5px 2px rgba(45,35,96,.2)); transition:all .2s ease; z-index:3;}
.item-list .inner:nth-child(2) .item img{max-width:244px;}
.item-list .inner:not(:nth-child(2)) .item img{max-width:212px;}

/*ステータス別*/
.item-list .inner div.item,
.item-list .inner .item.none,
.item-list .inner .item.done,
.item-list .inner .item.end{pointer-events:none;}
.item-list .inner .item:hover{background:#d6f3f9;}
.item-list .inner .item:hover img{transform:scale(1.03);}

/*景品一覧 情報*/
.item-list .inner .item ul{margin:10px auto 0;}
.item-list .inner .item ul li{padding:2px 0;}
.item-list .inner .item ul li:nth-child(1),.item-list .inner .item ul li:nth-child(2){font-size:16px; font-weight:800;}
.item-list .inner .item ul li:nth-child(2){color:#c03b5c;}
.item-list .inner .item ul li:nth-child(3){font-size:13px; color:#f00;}



.item-list .inner .item p.log{color:#fb56a8; font-size:18px;}
@media screen and (max-width:480px){
.item-list .inner .item ul li:nth-child(1),.item-list .inner .item ul li:nth-child(2){font-size:14px;}}

.item-list .inner .item ul li:nth-child(1) span{display:block; font-size:12px;}
.item-list .inner .item ul li:nth-child(1) span::before{content:"大きさ:"}
@media screen and (max-width:480px){.item-list .inner .item ul li:nth-child(1) span{font-size:11px;}}

/*景品一覧 ボタン 応募用*/
.item-list .inner:nth-child(3) .item p.btn::before{content:"応募する";}

/*景品一覧 ボタン*/
.item-list .inner .item p.btn,.item-list .inner .item p.end{max-width:300px; background:#fff; font-size:16px; border:2px solid; border-radius:10px; padding:10px 0; margin:10px auto 0; transition:all .2s ease;}
.item-list .inner .item p.end{color:red;};

.item-list .inner .item:hover p.btn{color:#ed6e47;}
.item-list .inner .item p.btn::before{content:"応募する";}
.item-list .inner .item.none p.btn{color:#555; background:#ccc; opacity:.7;}
.item-list .inner .item.none p.btn::before{content:"DPが不足しています";}
.item-list .inner .item.done p.btn{color:#fff; background:#ed6e47; border-color:#ed6e47;}
.item-list .inner .item.done p.btn::before{content:"応募済";}
.item-list .inner .item.end p.btn{color:#fff; background:#555; border-color:#555;}
.item-list .inner .item.end p.btn::before{content:"応募数が上限に達しました";}

.item-list .inner .item#entry p.btn::before{content:"エントリーはこちら";}
.item-list .inner .item#entry.none p.btn{color:#555; background:#ccc; opacity:.7;}
.item-list .inner .item#entry.none p.btn::before{content:"エントリー不可";}
.item-list .inner .item#entry.done p.btn{color:#fff; background:#fb56a8; border-color:#fb56a8;}
.item-list .inner .item#entry.done p.btn::before{content:"エントリー済";}

.item-list .inner .item.outofterm p.btn{display:none;}
.item-list .inner .item.done p.btn{display:block !important;}


/*応募済ステータス*/
.item-list .inner .item p.log::before{content:"残数"; font-size:13px;}
.item-list .inner .item p.log::after{content:"個"; font-size:13px;}
.item-list .inner:nth-child(3) .item p.log::after{content:"口 応募済";}

/*
================================================================================================================
ボカコンCDキャンペーン 曲リスト
================================================================================================================
*/
.music-list{
width:100%;
height:230px;
font-size:13px;
padding:10px;
border:2px solid #4de7b2;
border-radius:10px;
text-align:left;
}
.music-list > li{margin-bottom:10px;}
.music-list > li:first-child{background:#009b65; border-radius:4px; color:#fff; text-align:center;}
.music-list > li:last-child{margin-bottom:0;}
.music-list > li > p{font-weight:normal; color:#009b65;}
.music-list > li > p:first-child{font-size:16px; font-weight:bold;}
.music-list > li > p:nth-of-type(2){font-size:14px;}

@media screen and (max-width:740px){
.music-list{width:100%; height:auto;}
.music-list > li > p:first-child{font-size:16px;}
.music-list > li > p:nth-of-type(2){font-size:12px;}
}
@media screen and (max-width:480px){
.music-list > li > p:first-child{font-size:14px;}
.music-list > li > p:nth-of-type(2){font-size:10px;}
}
/*
================================================================================================================
ポイント獲得リスト
================================================================================================================
*/
.point{margin:10px auto 0;}
.point + .point{margin-top:20px;}
.point ul{font-size:13px; padding:10px 20px; border:2px solid #4de7b2; border-radius:10px;}
.point ul li{display:flex; padding:7px 5px; align-items:center;}
.point ul li + li{border-top:1px solid #4de7b2;}
.point ul li p:first-child{width:calc(100% - 70px); padding-right:10px;}
.point ul li p:last-child{width:70px; font-weight:700;}
@media screen and (max-width:480px){
.point ul{padding:10px;}
.point ul li p:first-child{font-size:12px;}}

/*
================================================================================================================
注意事項
================================================================================================================
*/
.notice{line-height:170%; color:#ed6e47; border:2px solid; border-radius:10px; padding:10px; margin:10px auto 0;}
.notice .dot{font-weight:700;}
.notice .dot + .ast{margin:10px auto 0;}
.notice li a{color:#695ca7 !important;}

/*
================================================================================================================
現在の獲得ミラポ
================================================================================================================
*/
#point{background:#01de91; border:2px solid #2eaff0; border-radius:20px; padding:5px; margin:0 auto 20px;}
#point p{
display:flex;
color:#000;
background:#fff;
font-size:16px;
font-weight:700;
text-align:center;
border:2px solid #2eaff0;
border-radius:14px;
padding:10px;
justify-content:center;
align-items:center;}
#point p::before{content:"現在のDP";}
#point p span{display:inline-block; margin-left:10px; color:#fb56a8; font-size:22px;}
#point p span::after{content:"DP"; font-size:11px;}
@media screen and (max-width:480px){
#point p{font-size:13px; padding:10px 0;}
#point p span{font-size:16px;}
#point p span::after{font-size:9px;}}

#epass{
color:#038afd;
text-align:center;
font-size:12px;
font-weight:700;
margin:20px auto 10px;}
#epass p{display:inline-block;}
#epass::before{display:inline-block; content:"e-amusement passカードナンバー"; font-size:12px; font-weight:400; margin-right:10px;}
@media screen and (max-width:520px){#epass::before{display:block; font-size:10px; margin-right:0;}}

/*
================================================================================================================
交換確認ページ
================================================================================================================
*/
#confirm{text-align:center;}
#confirm img{width:60%; max-width:max-content; filter:drop-shadow(0 5px 2px rgba(45,35,96,.2));}
#confirm p{color:#004484; font-size:16px; font-weight:800; margin:10px auto;}
#confirm div{font-weight:700; line-height:150%;}
@media screen and (max-width:480px){#confirm p{font-size:14px;}}

#confirm select{width:100%; max-width:300px; border:1px solid; border-radius:5px; padding:10px; margin:0 auto 10px;}

/*
================================================================================================================
エラー
================================================================================================================
*/
#main > #main-inner > #inner.error{display:flex; align-items:center;}
#main > #main-inner > #inner.error .box{max-width:480px;}
#main > #main-inner > #inner.error .box h3{margin:0 auto 20px;}
#main > #main-inner > #inner.error .box p{line-height:150%;}
#main > #main-inner > #inner.error .box .apply-btn.back{margin:20px auto 0;}
@media screen and (min-width:981px){#main > #main-inner > #inner.error{min-height:calc(100vh - 100px);}}
@media screen and (max-width:980px){#main > #main-inner > #inner.error{min-height:calc(100vh - 100px);}}
@media screen and (max-width:640px){#main > #main-inner > #inner.error{min-height:calc(100vh - 90px);}}

/*
================================================================================================================
同意確認チェックボックス
================================================================================================================
*/
input[type="checkbox"]{display:none !important; border:0 !important; margin:0 !important;}

.input-checkbox{
position:relative;
width:260px;
color:#000;
font-size:18px;
font-weight:700;
font-family:'Noto Sans JP', sans-serif;
line-height:30px;
letter-spacing:2px;
padding:0 0 0 40px;
margin:20px auto;
z-index:5;}

.input-checkbox label{display:inline-block; cursor:pointer;}

.input-checkbox label:before,
.input-checkbox label:after{content:""; position:absolute; display:inline-block; transition:transform .2s ease;}

.input-checkbox label:before{
top:0;
left:0;
width:30px;
height:30px;
background:#fff;
border:2px solid #55678d;
border-radius:5px;
opacity:.5;}

.input-checkbox label:after{
top:-4px;
left:10px;
width:10px;
height:30px;
border-right:4px solid transparent;
border-bottom:4px solid transparent;
transform:rotate(45deg);
transition:border-bottom-color,border-right-color .2s ease;}

.input-checkbox input[type="checkbox"]:checked + label:before{opacity:1;}
.input-checkbox input[type="checkbox"]:checked + label:after{border-color:#ff568e;}

@media screen and (max-width:480px){
.input-checkbox{width:210px; font-size:14px; line-height:24px; padding:0 0 0 30px;}
.input-checkbox label:before{width:24px; height:24px;}
.input-checkbox label:after{top:-8px;}}

/*警告文*/
.info_box {
width:100%;
color:#fff;
background-color:#ff0000;
font-size:18px;
font-weight:bold;
text-align:center;
border-radius:10px;
padding:20px;
margin:20px auto;}

/*
================================================================================================================
アイテムコンプリート
================================================================================================================
*/
.box#howto .cat{line-height:170%; font-weight:700; margin:10px auto 0;}
.box#howto .cat a{color:#ff5722; text-decoration:underline;}
.box#howto .cat a:hover{text-decoration:none;}

.box a.btn{
display:block;
width:100%;
max-width:400px;
color:#fff !important;
background:#3e62ae;
text-align:center;
text-decoration:none !important;
border-radius:5px;
padding:5px;
margin:20px auto 0;
font-size: 92%;
transition:background .3s ease;}
.box a.btn:hover{background:#ff5722;}
@media screen and (max-width:480px){.box a.btn{margin:10px auto 0;}}


/*
===============================================
プレミアムカスタマイザーコンプリートキャンペーン
===============================================
*/
/*ボタン*/
.box a.btn.grd{
background-image:linear-gradient(180deg, #72db7a, #72db7a 50%, #02a96f 50%, #72db7a);
font-size:18px;
text-shadow:0 0 3px black;
margin-bottom:20px;
padding:10px 0;
transition:background .3s ease;
}
.box a.btn.grd.none{filter:grayscale(1); pointer-events:none;}

.box a.btn.grd:hover{background-image:linear-gradient(180deg, #c4ffc8, #a6f3ac 50%, #00de91 50%, #a6f3ac);}
@media screen and (max-width:480px){
.box a.btn.grd{font-size:14px;}
}
/*numリスト追加*/
ul.num.bold > li{display:block; position:relative; font-weight:bold; padding-left:16px;}
ul.num.bold > p{margin-top:10px;}