/* CSS for PC @date     2018 @author   sarahchan */
/* ------------------------------------------

------------------------------------------ */
.pc { display: none !important; }

img { max-width: 100%; }

#keyVisual { width: 100%; margin-bottom: 0;}

#keyVisual h1 { text-indent: 0px; text-align: center; }

#keyVisual h1 img{ max-width: 280px;}
#keyVisual h1 .qr img{ max-width: 306px;}
#keyVisual h1 .qr img.mobile{ max-width:250px;}

#keyVisual h1 .qr img.title{ max-width: 276px; }
#keyVisual h1 img.title{ width: 80%;}
@media screen and (min-width:0px) and (max-width:400px) { 
 
}
#keyVisual h1 .main { background: #00B900; padding:12px 5%; font-size: 0; text-align: center; display: block; }

#keyVisual h1 .qr { background: #FFF5D4; font-size: 0; padding: 5% 5% 0 5%; text-align: center; display: block; }

#keyVisual .mobile img { display: block; }

a.addbtn { display: block; margin: 10px auto; width:100%; text-align: center; }

.greybg { background: #F3F3F3; }

h2.w1240 { padding:12px 5%; font-size: 16px; }

.tokuten { padding: 2%; }

.tokuten li { border-bottom: 1px solid #767676; padding: 10px 0 20px; position: relative; }

.tokuten li:last-child { border-bottom: none; }

.tokuten li p.icon { position: absolute; top: 10px; left: 0px; background: #FF8D44; border-radius: 40px; text-align: center; font-size: 14px; padding: 8px 8px 6px; width: 50px; color: #fff; font-weight: bold; }

.tokuten li p.icon span { font-size: 24px; display: block; }

.tokuten li p.dtl { padding-top: 30px; text-align: center; width: 60%; margin: 20px auto; }

.tokuten li p.dtl span { font-weight: bold; font-size: 16px; }

p.friends { text-align: center; padding-top: 40px; font-weight: bold; font-size: 16px; }

p.friends img { display: block; margin: 10px auto 0; }

p.msg { font-size: 13px; padding: 20px 2%; line-height: 150%; }

span.qr em.sp{ display: block; text-align: center; color: #444444; font-size: 20px;}


.greenbg{ background: #c9f0c9; overflow: hidden;}

.entrybox{ padding-bottom: 48px; }
.entrybox h2{ text-align: center; margin: 24px 16px 0;}
.entrybox .txt1{ margin: 16px 8px 0;}
.entrybox .txt1 dd{ font-size: 14px; line-height: 1.6; margin-top: 8px;}
.entrybox .txt1 dd small{ font-size: 12px;}
.entrybox .txt1 dt{ display: flex; justify-content: flex-start; gap: 4px;}
.entrybox .txt1 dt span{ display: inline-table; padding: 2px 6px; border: 1px solid #333; border-radius: 3px; font-size: 12px;}

/*popup-container*/
.kk_popup_trigger{display: table; font-size: 14px; padding: 6px 16px; background: #fff; border: 1px solid #333; border-radius: 4px; margin: 16px auto 0;}
.kk_popup_trigger:hover{ opacity: .7; text-decoration: none !important;}
.kk_popup_container { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.5); display: flex; justify-content: center; align-items: center; z-index: 1000;font-family: 'Lucida Grande', 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', Meiryo, メイリオ, "ＭＳ Ｐゴシック", "MS P Gothic", sans-serif;}
.kk_popup_close_btn { z-index: 10000; position: absolute; cursor: pointer; border-radius: 50px; font-size: 0; height: 34px; width: 34px; top: 2px; right: 2px; background: #333 url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADAAAAAwCAMAAABg3Am1AAAAFVBMVEUAAAD///////////////////////9Iz20EAAAABnRSTlMAQF+foGCwwWJQAAAAg0lEQVR42u3VBQ6EQBTA0PH7H3njCzSkuP84vOISvtl34syVqeVxn1vCJlr7F/StYR+lW9AXLGVB7wU9C/Ms1LOglwJeC3gt4LWA1wJeC3gr4KVQz/vb8iyPwnwpUvD5QSEehXgU4lGoZ+GehXsW9Df+XkX5XvFjXLueRZ39Q/lm1/kBvUEF19SMEPsAAAAASUVORK5CYII=) center center no-repeat; background-size: 25px;scrollbar-color: rgba(0, 0, 0, 0.3) transparent;}
.kk_popup_body { height: 65vh; width: calc(95% - 20px); background: #fff; border-radius: 15px; padding: 10px; color: #000; font-size: 15px; line-height: 35px; overflow: scroll; position: relative;}
.kk_popup_body dl{ overflow: hidden; line-height: 1.6;}
.kk_popup_body dl dt { color: rgb(255, 255, 255); font-weight: bold; text-align: center; font-size: 16px; margin-bottom: 10px; background: rgb(0, 185, 0); padding: 5px 0px 3px; }
.kk_popup_body dl dd{ margin: 14px; font-size: 14px;}
.kk_popup_body dl dd b{ display: block; font-size: 14px; color: #00b900;}
.kk_popup_body dl.mob{ margin-top: 24px;}
.kk_popup_body dl.mob dt{ background: #ff008c;}
.kk_popup_body dl.mob dd b{ color: #ff008c;}

.stepbox{ margin-top: 24px;}
.stepbox li{margin: 24px 16px 0; background: #fff url(../images/step1_v2.png) 20px 15px no-repeat; background-size: 80px; border-radius: 20px; display: flex; flex-direction: column; align-items: center; gap: 16px;}
.stepbox li:nth-of-type(2){ background: #fff url(../images/step2_v2.png) 20px 15px no-repeat; background-size: 80px; }
.stepbox li p.txt{ font-size: 14px; margin-top: 24px; text-align: center; line-height: 1.3; }
.stepbox li p.txt b{ display: block; margin-bottom: 8px; font-size: 24px;}
.stepbox li p.photo{ line-height: 0;}
.stepbox li p.link{ padding-bottom: 16px;}
.stepbox li p.link a{ color: #0769B0 !important; }

