.num{
display:flex;
color:#000;
font-family:Noto Sans JP !important;
font-size:16px;
letter-spacing:1px;
justify-content:center;
margin:0 auto 10px;}
.num li + li{margin-left:10px;}
.num li span{font-size:24px;}
@media screen and (max-width:390px){
.num{font-size:14px;}
.num li span{font-size:22px;}}
@media screen and (max-width:360px){
.num{font-size:13px;}
.num li span{font-size:18px;}}

.item{display:flex; flex-wrap:wrap; font-family:Noto Sans JP !important;}
.item li{width:33.333%; text-align:center; padding:5px;}
.item li img{border:1px solid #888; border-radius:8px; filter:drop-shadow(0 5px 2px rgba(0,0,0,.1));}
.item.pass li img{border-radius:10px;}

/*横幅調整*/
.item.pass li.size{width:50%;}
.item.pass li.size img{aspect-ratio: 476 / 300;}
.item.mat li{width:50%;}

.item li > * > span{display:block; color:#000; font-size:14px; margin:5px auto;}
.item li > * > span::before,
.item li > * > span::after{display:inline-block; font-size:10px;}
.item li > * > span::before{content:"残り"; margin-right:2px;}
.item li > * > span::after{content:"個"; margin-left:2px;}
.item.pass li > * > span::after{content:"枚";}
@media screen and (max-width:450px){.box.yellow .item li > * > span::before{display:block; margin-right:0; line-height:10px;}}

/*応募申し込みページ*/
/*マーク*/
.mark-present{width:100%; max-width:200px; background-color:#fff; border-radius:10px; color:#000; text-align:center; margin:20px auto; padding:5px 0;}

#item-select .item li{width:50%; text-align:center; padding:10px;}
#item-select .item li > a{display:block; transition:all .2s ease;}
#item-select .item li > a img{transition:all .2s ease !important; filter:saturate(100%) brightness(100%) drop-shadow(0 5px 2px rgba(0,0,0,0));}
#item-select .item li > a > span{font-size:20px;}
#item-select .item li > a > span::before,
#item-select .item li > a > span::after{font-size:14px;}
#item-select .item li > a > p{color:#fff; background:#fe2e63; font-size:18px; line-height:100%; letter-spacing:1px; border:2px solid #000; border-radius:10px; padding:5px 0 8px; transition:all .2s ease;}
#item-select .item li > a > p span{display:inline-block; filter:drop-shadow(0 0 1px #000) drop-shadow(1px 1px 0 #000) drop-shadow(-1px -1px 0 #000) drop-shadow(-1px 1px 0 #000) drop-shadow(1px -1px 0 #000); transition:all .2s ease;}
#item-select .item li > a:hover{transform:translateY(-5px);}
#item-select .item li > a:hover img{filter:saturate(120%) brightness(110%) drop-shadow(0 5px 2px rgba(0,0,0,.1));}
#item-select .item li > a:hover > p{background:#ff5078; border:2px solid #c7264b;}
#item-select .item li > a:hover > p span{filter:drop-shadow(0 0 1px #c7264b) drop-shadow(1px 1px 0 #c7264b) drop-shadow(-1px -1px 0 #c7264b) drop-shadow(-1px 1px 0 #c7264b) drop-shadow(1px -1px 0 #c7264b);}
/*サイズ違い対応追加*/
#item-select .item li.size{width:80%; margin:0 auto;}
#item-select .item li.size p{width:100%; max-width:180px; margin:0 auto;}

/*青*/
#item-select .item li > a > p.ver03{color:#fff; background:#01a1ff; font-size:18px; line-height:100%; letter-spacing:1px; border:2px solid #000; border-radius:10px; padding:5px 0 8px; transition:all .2s ease;}
#item-select .item li > a > p.ver03 span{display:inline-block; filter:drop-shadow(0 0 1px #000) drop-shadow(1px 1px 0 #000) drop-shadow(-1px -1px 0 #000) drop-shadow(-1px 1px 0 #000) drop-shadow(1px -1px 0 #000); transition:all .2s ease;}
#item-select .item li > a:hover{transform:translateY(-5px);}
#item-select .item li > a:hover img{filter:saturate(120%) brightness(110%) drop-shadow(0 5px 2px rgba(0,0,0,.1));}
#item-select .item li > a:hover > p.ver03{background:#2db1fe; border:2px solid #01a1ff;}
#item-select .item li > a:hover > p.ver03 span{filter:drop-shadow(0 0 1px #2db1fe) drop-shadow(1px 1px 0 #2db1fe) drop-shadow(-1px -1px 0 #2db1fe) drop-shadow(-1px 1px 0 #2db1fe) drop-shadow(1px -1px 0 #2db1fe);}

#item-select .item.pass li > a img{width:80% !important;}

#item-select .item li > a.select > p span::before{content:"応募する";}
#item-select .item li > a.done > p span::before{content:"応募済です";}
#item-select .item li > a.none > p span::before{content:"ダコールが不足しています"; font-size:13px;}
#item-select .item li > a.end > p span::before{content:"終了しました";}

#item-select .item li > a.done{pointer-events:none !important;}
#item-select .item li > a.none,
#item-select .item li > a.end{pointer-events:none !important; filter:grayscale(90%);}

#item-select .item li > a.done > p{background:#a266ff; border:2px solid #571bc8;}
#item-select .item li > a.done > p span{filter:drop-shadow(0 0 1px #571bc8) drop-shadow(1px 1px 0 #571bc8) drop-shadow(-1px -1px 0 #571bc8) drop-shadow(-1px 1px 0 #571bc8) drop-shadow(1px -1px 0 #571bc8);}

@media screen and (max-width:450px){
#item-select .item li{width:calc(50% - 5px); padding:0; margin-bottom:20px;}
#item-select .item li:nth-child(even){margin-left:10px;}
#item-select .item li > a img{width:80% !important;}
#item-select .item li > a > p{font-size:15px;}
#item-select .item.pass li > a img{width:70% !important;}
#item-select .item li > a.none > p span::before{font-size:12px;}}
@media screen and (max-width:370px){
#item-select .item li > * > span{font-size:18px; margin:3px auto;}
#item-select .item li > * > span::before,
#item-select .item li > * > span::after{font-size:12px;}
#item-select .item li > a.none > p span::before{font-size:11px;}}

/*応募確認ページ*/
#item-confirm .item{justify-content:center;}
#item-confirm .item li{width:50%;}
#item-confirm .item li#yoko{width:79%;}
#item-confirm .item li#deskmat{width:79%;}
#item-confirm .item li > p{filter:drop-shadow(3px -3px 0 #fe2e63) drop-shadow(-3px 3px 0 #01a1ff);}

/*
================================================================================================================
注意事項
================================================================================================================
*/
#notice-top .ast li span{display:none;}
#notice-apply .dot{font-weight:700;}

#present #notice-apply{
color:#fff; 
filter: drop-shadow(0 0 1px #000) drop-shadow(1px 1px 0 #000) drop-shadow(-1px -1px 0 #000) drop-shadow(-1px 1px 0 #000) drop-shadow(1px -1px 0 #000);
}

/*応募確認ページ*/
#notice-confirm #notice-apply .ast{display:none;}
#notice-confirm #notice-top > h4:nth-child(1),
#notice-confirm #notice-top > ul:nth-child(2),
#notice-confirm #notice-top > ul:nth-child(4) > li:nth-child(1),
#notice-confirm #notice-top > ul:nth-child(4) > li:nth-child(2),
#notice-confirm #notice-top > ul:nth-child(4) > li:nth-child(3),
#notice-confirm #notice-top > ul:nth-child(4) > li:nth-child(6),
#notice-confirm #notice-top > ul:nth-child(4) > li:nth-child(7),
#notice-confirm #notice-top > ul:nth-child(4) > li:nth-child(10),
#notice-confirm #notice-top > ul:nth-child(4) > li:nth-child(12),
#notice-confirm #notice-top > ul:nth-child(4) > li:nth-child(15){display:none;}

/*応募完了ページ*/
#notice-done #notice-top > *,
#notice-done #notice-top > ul > li{display:none !important;}
#notice-done #notice-top > ul:nth-child(4),
#notice-done #notice-top > ul:nth-child(4) > li:nth-child(4),
#notice-done #notice-top > ul:nth-child(4) > li:nth-child(5),
#notice-done #notice-top .ast li span{display:block !important;}

/*
================================================================================================================
ゲージ獲得ポイント
================================================================================================================
*/

/*
=============================
見出し-トグルボタン
=============================
*/
.btn-toggle{
position:relative;
background:#90acb0;
font-family:Noto Sans JP !important;
font-size:20px;
line-height:140%;
text-align:center;
border:2px solid #fff;
border-radius:10px;
padding:3px 5px;
margin:20px auto 10px;
cursor:pointer;
transition:opacity .2s ease;}

.btn-toggle:hover{opacity:.7;}
.btn-toggle::before,
.btn-toggle::after{display:block; content:""; position:absolute; background:#434343; transition:all .2s ease;}
.btn-toggle::before{width:20px; height:2px; top:calc(50% - 1px); right:20px;}
.btn-toggle::after{width:2px; height:20px; top:calc(50% - 10px); right:29px;}
.btn-toggle.open::before,
.btn-toggle.open::after{transform:rotate(225deg);}
@media screen and (max-width:640px){
.btn-toggle{font-size:16px;}
.btn-toggle::before{width:14px; top:calc(50% - 1px); right:15px;}
.btn-toggle::after{height:14px; top:calc(50% - 7px); right:21px;}}

/*
=============================
獲得量リスト
=============================
*/
#gage-point{display:none; background:#90acb0; border:2px solid #fff; border-radius:10px; padding:0 10px; margin:0 auto 10px;}
#gage-point .cat{width:100%; color:#333; font-size:12px; padding:0 0 20px;}
/*#gage-point .cat + .cat{border-top:2px solid #666;}*/

#gage-point .cat > p{width:100%; text-align:center; padding:10px 20px 30px;}
#gage-point .cat > p img{width:60% !important;}
#gage-point .cat > ul{position:relative; width:100%;}
#gage-point .cat > ul li{display:flex; flex-wrap:wrap; align-items:center; font-weight:700;}
#gage-point .cat > ul li + li{border-top:1px dotted #bccdd0;}
#gage-point .cat > ul li p{padding:5px 2.5px;}
#gage-point .cat > ul li p:first-child{width:calc(100% - 50px);}
#gage-point .cat > ul li p:last-child{width:50px; text-align:center;}

#gage-point .cat > ul li span{display:block; color:#f4f7f7; font-size:11px; font-weight:400 !important;}

#gage-point .cat > ul::before,
#gage-point .cat > ul::after{
display:block;
color:#fff;
height:24px;
position:absolute;
top:-24px;
background:#666;
font-size:11px;
text-align:center;
border-radius:5px;
padding:2px 0;}
#gage-point .cat > ul::before{width:calc((100% - 50px) -  2.5px); content:"詳細"; left:0;}
#gage-point .cat > ul::after{width:calc(50px - 2.5px); content:"獲得量"; right:0;}

#gage-point .cat > ul li.pfree{position:relative; border-bottom:none;}
#gage-point .cat > ul li.pfree .btn{
position:relative;
width:100%;
background:#e1feff;
border-radius:20px;
text-align:center;
padding:5px;
margin:20px auto 0;
cursor:pointer;
transition:opacity .2s ease;}
#gage-point .cat > ul li.pfree .btn:hover{opacity:.7;}
#gage-point .cat > ul li.pfree .btn::after{display:block; content:"＋"; position:absolute; top:5px; right:20px;}
#gage-point .cat > ul li.pfree .btn.open::after{content:"×";}
#gage-point .cat > ul li.pfree .inner{display:none; width:100%;}

/*コナクレ*/
#gage-point .cat > ul#kc li{padding:5px;}
#gage-point .cat > ul#kc::after{display:none !important;}
#gage-point .cat > ul#kc::before{width:100% !important;}

@media screen and (max-width:420px){
#gage-point .cat > p img{width:70% !important;}
#gage-point .cat{font-size:11px;}
#gage-point .cat > ul li span{font-size:10px;}}

/*
================================================================================================================
獲得履歴関連
================================================================================================================
*/
#log{margin:0 auto 20px;}
#log > p{font-family:Noto Sans JP !important; color:#fff; text-align:center; font-size:18px; font-weight:700; border-bottom:1px solid; padding-bottom:5px; margin:0 auto 20px;}
#log > p span{
display:inline-block;
color:#eaff44;
font-size:36px;
margin-left:10px;}
@media screen and (max-width:640px){#log > p{font-size:18px;}}
@media screen and (max-width:480px){
#log > p{font-size:16px; margin:0 auto 10px;}
#log > p span{font-size:26px;}}

/*ボタン*/
#log .toggle > .btn-toggle{background:#fff; border:1px solid #8c8c8c; margin:0 auto 10px !important;}
#log .toggle > .inner{display:none; background:#fff; border:1px solid #8c8c8c; border-radius:10px; padding:10px; box-shadow:0 5px 2px rgba(0,0,0,.1);}
#log .toggle > .inner > ul{font-size:14px; padding:10px; border-bottom:1px solid #849198;}
#log .toggle > .inner > p{text-align:right; font-size:11px; padding:0 10px; margin:5px auto 0;}
@media screen and (max-width:480px){
#log .toggle > .inner > ul{font-size:12px;}
#log .toggle > .inner > p{font-size:10px;}}

#log .toggle > .inner > ul li:first-child{position:relative; font-weight:bold; border-left:5px solid #849198; padding:0 60px 0 10px; margin:0 0 5px;}
#log .toggle > .inner > ul li:first-child::after{
display:block;
content:"";
width:60px;
height:32px;
position:absolute;
top:-5px;
right:-5px;
background-position:center;
background-size:100% auto;
background-repeat:no-repeat;}
#log .toggle > .inner > ul li.LDJ:first-child::after{background-image:url(../img/common/title/2dx.png);}
#log .toggle > .inner > ul li.P2D:first-child::after{background-image:url(/game/bemani/gmz2022/img/common/title/boost/iidx.png);}
#log .toggle > .inner > ul li.MDX:first-child::after{background-image:url(../img/common/title/ddr.png);}
#log .toggle > .inner > ul li.VGP:first-child::after{background-image:url(/game/bemani/gmz2022/img/common/title/boost/ddr.png);}
#log .toggle > .inner > ul li.M32:first-child::after{background-image:url(../img/common/title/gd.png);}
#log .toggle > .inner > ul li.U32:first-child::after{background-image:url(/game/bemani/gmz2022/img/common/title/boost/gd.png);}
#log .toggle > .inner > ul li.L44:first-child::after{background-image:url(../img/common/title/jb.png);}
#log .toggle > .inner > ul li.M39:first-child::after{background-image:url(../img/common/title/popn.png);}
#log .toggle > .inner > ul li.U39:first-child::after{background-image:url(/game/bemani/gmz2022/img/common/title/boost/popn.png);}
#log .toggle > .inner > ul li.KFC:first-child::after{background-image:url(../img/common/title/sdvx.png);}
#log .toggle > .inner > ul li.PAN:first-child::after{background-image:url(../img/common/title/nos.png);}
#log .toggle > .inner > ul li.XIF:first-child::after{background-image:url(../img/common/title/pc.png);}

#log .toggle > .inner > ul li.UDN:first-child::after{background-image:url(../img/common/title/dar.png);}
#log .toggle > .inner > ul li.TCS:first-child::after{background-image:url(../img/common/title/cc.png);}
#log .toggle > .inner > ul li.KNP:first-child::after{background-image:url(../img/common/title/kc.png);}




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

.input-checkbox{
position:relative;
width:260px;
font-family:Noto Sans JP !important;
font-size:18px;
font-weight:700;
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;
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:#ff5078;}

@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;}}



/*お知らせ*/
ul.news {
    background: #fff;
    padding: 20px;
    font-family: 'Noto Sans JP', sans-serif;
    font-size: 14px;
    border: 4px solid #8c8c8c;
    border-radius: 30px;

    margin: 20px auto;
    width: calc(100% - 40px);
}

