/*
================================================================================================================
景品一覧
================================================================================================================
*/
.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:170px;}
.item-list .inner:not(:nth-child(2)) .item img{max-width:300px;}

/*ステータス別*/
.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:#8b5589;}
.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:#fb56a8;}
.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:"ミラポが不足しています";}
.item-list .inner .item.done p.btn{color:#fff; background:#fb56a8; border-color:#fb56a8;}
.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 p.log::after{content:"個 交換済"; font-size:13px;}
.item-list .inner:nth-child(3) .item p.log::after{content:"口 応募済";}

/*エントリー済ステータス*/
.item-list .inner .item#entry p.log::after{content:"エントリー済"; font-size:13px;}



/*
=========================
プレー状況
=========================
*/
.status.inner{flex-wrap:wrap;}
.status.inner > .box{width:100% !important; /*max-width:800px !important;*/ margin:0 auto;}
.status.inner > .box + .box{margin:20px auto 0;}

/*スタンプ表*/

#stp_name{
    border: solid 3px #c07dde;
    border-bottom: none;
    text-align: center;
    max-width: 300px;
    border-radius: 20px 20px 0 0;
    padding: 2px;
    color: #c07dde;
    background-color: #edc7ff;
    margin-top: 1em;
}

@media screen and (max-width:480px){
#stp_name{max-width: 220px;}
}
    
.box#stp_sheet:before,.box#stp_sheet:after{
  background:none;
}
.box#stp_sheet{
    border-radius: 0 50px;
    padding-top: 5%;
    padding-bottom: 5%;
    border: 3px solid #c07dde;
}

.box > .inner ul.stamp{display:flex; position:relative; width:100%; max-width:480px; flex-wrap:wrap; justify-content:space-between; margin:0 auto;}
.box > .inner ul.stamp li{position:relative; width:calc((100% / 3) - 10px); background-color:#dfacf7; margin:10px 0; border-radius:15px; padding-top: 20px;
/*box-shadow:2px 2px 0 #000 , -2px -2px 0 #000 , 2px -2px 0 #000 , -2px 2px 0 #000;*/
}
@media screen and (max-width:480px){
.box > .inner ul.stamp{max-width:300px;}
.box > .inner ul.stamp li{width:calc((100% / 2) - 5px);}}

@media screen and (min-width:901px){
.box.ichika > .inner ul.stamp{max-width:100%;}
.box.ichika > .inner ul.stamp li{width:calc((100% / 5) - 10px);}}
@media screen and (max-width:900px){.box.ichika > .inner ul.stamp li{width:calc((100% / 3) - 10px);}}
@media screen and (max-width:480px){.box.ichika > .inner ul.stamp li{width:calc((100% / 2) - 10px);}}


/*スタンプ表-装飾*/
.box > .inner ul.stamp li > p{
position:absolute;
top:0;
left:0;
width:100%;
height:20px;
text-shadow:none;
font-family:'Mochiy Pop P One', sans-serif;
font-size:12px;
text-align:center;
line-height:20px;
padding-right:4px;
border-radius:15px 15px 0 0;
color: white;
font-weight: bold;
}
/*
.box.ichika > .inner ul.stamp li:last-child > p{width:30px;}
*/

.box > .inner ul.stamp li::before{display:block; content:""; padding-top:100%;
border: solid 5px #fbffe8;
border-radius: 12px;
background-color: #e8dbed;
}
.box > .inner ul.stamp li::after{
display:block;
content:"";
position:absolute;
top:10px;
left:0;
width:100%;
height:100%;
background-size:100% auto;
background-repeat:no-repeat;
background-position:center;
}
.box > .inner ul.stamp li.get::after{opacity:1;}

/*スタンプ表-獲得時
.box > .inner ul.stamp li.get:last-child::after{opacity:.3;}
*/
/*アンロック*/
.box > .inner ul.stamp li > *{position:absolute; z-index:4;}


/*
================================================================================================================
色-メイン
================================================================================================================
*/
.box.main{color:#000; /*background:#ffffd6;*/ background:#fff285; line-height:180%;}
.box.main span.ichika{color:#0db29d;}
.box.main span.stamp{display:inline-block; position:relative; padding-left:30px;}
.box.main span.stamp::before{
display:block;
content:"";
position:absolute;
left:5px;
width:30px;
height:30px;
background-color:#fff;
background-size:90% auto;
background-repeat:no-repeat;
background-position:center;
border-radius:50%;}
.box.main span.ichika.stamp::before{background-color:#000; background-image:url(../img/stamp_2dx.png);}
@media screen and (max-width:640px){.box.main{font-size:14px; line-height:200%;}}

/*
================================================================================================================
色-機種別
================================================================================================================
*/
.box.ichika{background: linear-gradient(to bottom right, #eff3dc, #f9d9fc);}
.box.ichika .inner dl > *{border-bottom:1px solid #00746a;}

.box.ichika .inner ul li{border:3px solid #a566be;}
.box.ichika > .inner > .unlock ul li > p{background:#ff0022;}
.box.ichika .inner ul li::after{background-image:url(../daily_stamp/img/stamp/stamp_white.png);}
.box.ichika .inner ul li.get::after{background-image:url(../daily_stamp/img/stamp/stamp_on.png),url(../daily_stamp/img/stamp/stamp_white.png);}
.box.ichika > .inner ul li > p{background:#dfacf7; color:#592163;}
.box.ichika ul li > b{background:#ff0022;}

/*complete*/
.box.ichika > .inner ul.stamp li:last-child::after{background-image:url(../daily_stamp/img/stamp/stamp_comp.png);}
.box.ichika > .inner ul.stamp li:last-child.get::after{
background-image:url(../daily_stamp/img/stamp/stamp_on.png),url(../daily_stamp/img/stamp/stamp_comp.png);











