@charset "Shift-JIS";

/*e-amusementサイトテンプレート*/
header,footer,header#id_nav_menu_1{position:relative !important;}
header#id_nav_menu_1{background-color:#fff;}
#wrapper{position:relative !important;}
#container{background:#fff;}

/*z-index*/
#bg                              {z-index:1;}
#main,#main::before,#main::after {z-index:1;}
#main > #main-inner              {z-index:2;}

header#id_nav_menu_1              {z-index:9999 !important;}
footer                            {z-index:2 !important;}
#page-top,#page-top a             {z-index:10 !important;}

/*
================================================================================================================
COMMON
================================================================================================================
*/
*{padding:0; margin:0; border:0;}
*, *:before, *:after{
-webkit-box-sizing:border-box;
-moz-box-sizing:border-box;
-o-box-sizing:border-box;
-ms-box-sizing:border-box;
box-sizing:border-box;}

html{width:100%; height:100%; overflow-wrap:break-word}
body{
min-width:320px !important;
background:#000 !important;
margin:0 auto;
font-family:"メイリオ", "Meiryo", "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
overflow-x:hidden;}
a{outline:none;}
a:link,a:visited,a:hover,a:active{text-decoration:none;}
a img{transition:opacity .3s ease;}
img{padding:0; margin:0; border:0; vertical-align:bottom;}
ul{margin:0; padding:0; border:0;}
li{list-style:none;}
strong,em,b{font-weight:700; font-style:normal;}
table{width:100%; color:#000; border-collapse:collapse; border-spacing:0; margin:0 auto;}

/*
================================================================================================================
MAIN
================================================================================================================
*/
#header{width:100%; background-color:#1bb367; padding:5px 10px;}
#header img{height:30px;}

#main{
display:block;
width:100%;
font-size:15px;
background-color:#E8F2ED;
background-blend-mode:lighten;
background-position:top center;
background-repeat:no-repeat;
background-attachment:fixed;
padding:20px 0 50px;
margin:0 auto;}
@media screen and (max-width:800px){#main{font-size:14px;}}
@media screen and (max-width:480px){#main{font-size:13px;}}

#main-inner{
width:100%;
max-width:1200px;
padding:0 20px;
margin:0 auto;}

#main-inner > #top-img img{width:100%;}

#main-inner > h2{
display:block;
width:100%;
color:#fff;
background-color:#1bb367;
font-size:18px;
font-family:'Kosugi Maru', sans-serif;
text-align:center;
padding:10px;
margin:20px auto;}
@media screen and (max-width:800px){#main-inner > h2{font-size:16px;}}
@media screen and (max-width:480px){#main-inner > h2{font-size:15px;}}

/*
=========================
リスト
========================
*/
#main .small{font-size:12px;}
@media screen and (max-width:400px){#main .small{font-size:11px;}}

ul.dot li,ul.ast li,ul.num li,span.ast{position:relative; padding-left:18px;}
ul.dot li::before,
ul.ast li::before,
ul.num li::before,
span.ast::before{display:block; position:absolute; top:0; left:0;}

ul.dot li::before{content:"・";}
ul.ast li::before,span.ast::before{content:"※";}

ul.dot li a,ul.ast li a{color:#1bb367; font-weight:bold; transition:all .2s ease;}
ul.dot li a:hover,ul.ast li a:hover{color:#ff008d;}

/*
========================
TOP
========================
*/
.inner.top{display:flex; width:100%; justify-content:center; margin:0 auto;}
.inner.top p{width:50%;}
.inner.top p img{width:100%; max-width:640px;}
.link-btn + .inner.top{margin-top:50px;}
@media screen and (max-width:640px){
.inner.top{/*width:80%;*/ flex-wrap:wrap;}
.inner.top p{width:100%;}}
@media screen and (max-width:480px){
.link-btn + .inner.top{margin-top:30px;}}

/*
================================================================================================================
ステップ
================================================================================================================
*/
#step,
#twitter{font-family:'Noto Sans JP', sans-serif; font-size:22px; line-height:150%; font-weight:900;}
/*10~12限定*/
#campaign-area{font-family:'Noto Sans JP', sans-serif; font-size:30px; line-height:150%; font-weight:900;}

#step h3{
display:block;
width:100%;
color:#1bb367;
font-size:22px;
line-height:28px;
text-align:center;
margin:20px auto 10px;}
#step h3 > span{
display:inline-block;
width:30px;
height:30px;
color:#fff;
background-color:#1bb367;
border-radius:50%;
margin-left:5px;}

@media screen and (max-width:640px){
#step h3{font-size:18px; line-height:22px;}
#step h3 > span{width:24px; height:24px;}
}

#step .text{
position:relative;
background:#fff;
text-align:center;
border-radius:20px;
border:5px solid #1bb367;
padding:20px;
margin:0 auto;}

@media screen and (max-width:640px){
#step .text{border-radius:10px; border:3px solid #1bb367; padding:10px;}
}


/*pointup04からの引継ぎ追加部分*/
#step .in-img > p{font-size:30px; text-align:left;}
#step .text.in-img{}
#step .text.in-img > p{color:#ff008f}
#step .text.in-img > p >span{color:#1bb367;}
#step .text.in-img > ul{display:flex; width:100%; max-width:800px; margin:40px auto 40px; justify-content:center; align-items:center;}
#step .text.in-img > ul li:nth-of-type(1){width:30%;}
#step .text.in-img > ul li:nth-of-type(2){width:30%;}
#step .text.in-img > ul li{display:flex; flex-wrap:wrap; justify-content:center;}
#step .text.in-img > ul li > img{padding:10px;}
#step .text.in-img > ul li:nth-of-type(1) > img{width:100%;}
#step .text.in-img > ul li:nth-of-type(2) > img{width:100%;}
#step .text.in-img > ul li > p{height:50px; font-size:14px; font-weight:normal; line-height:1.5; padding:10px 0;}

#step.main .inner .cat .text .sp-br{display:none;}
#step.main .inner .cat .text .pc-br{display:block;}

#paseli-point .text.in-img{font-size:18px;}

@media screen and (max-width:700px){
#paseli-point .text.in-img{font-size:16px;}
}

@media screen and (max-width:640px){
#step.main .inner .cat .text .sp-br{display:block;}
#step.main .inner .cat .text .pc-br{display:none;}
#step .text.in-img > ul{display:block; text-align:center;}
#step .text.in-img > ul li:nth-of-type(1){display:block; width:100%;}
#step .text.in-img > ul li:nth-of-type(2){display:block; width:100%;}
#step .text.in-img > ul li:nth-of-type(1) > img{width:50%;}
#step .text.in-img > ul li:nth-of-type(2) > img{width:50%;}
#step .text.in-img > ul li > p{padding:0;}

#paseli-point .text.in-img{font-size:15px; text-align:left;}
}
@media screen and (max-width:480px){
#step .in-img > p{font-size:20px;}
}

@media screen and (max-width:365px){
/*
#step .text.in-img > ul li:nth-of-type(1){width:100%;}
#step .text.in-img > ul li:nth-of-type(2){width:100%;}
*/
}

/*ここまで*/


#step .text.entry{display:flex !important; font-size:30px; justify-content:center; align-items:center; margin:0 auto 60px;}
#step .text.entry p:first-child{}
#step .text.entry p:first-child span{display:inline-block; color:#b60014; margin-right:10px;}
#step .text.entry p:last-child{
position:relative;
color:#fff;
font-size:24px;
background-color:#1bb367;
border-radius:10px;
padding:5px 20px;
margin-left:10px;}
#step .text.entry p:last-child::before,#step .text.entry p:last-child::after{display:block; content:""; position:absolute;}
#step .text.entry p:last-child::before{top:-10px; right:-23px; width:23px; height:24px; background-image:url(../img/main/effect.png);}
#step .text.entry p:last-child::after{bottom:-60px; left:calc(50% - 35px); width:70px; height:75px; background-image:url(../img/main/hand.png);}
@media screen and (max-width:480px){
#step .text.entry,#step .text.entry p:last-child{font-size:20px;}
#step .text.entry p:first-child span{margin-right:5px;}
#step .text.entry p:last-child{padding:5px 10px; margin-left:5px;}}
@media screen and (max-width:370px){#step .text.entry p:last-child::before{display:none;}}
@media screen and (max-width:340px){
#step .text.entry{flex-wrap:wrap;}
#step .text.entry p{width:100%;}}

#step .text:not(.entry) > span{color:#1bb367;}
@media screen and (max-width:980px){#step .text:not(.entry){font-size:16px;}}
@media screen and (max-width:420px){#step .text:not(.entry){text-align:left;}}

#step p.notice{font-size:22px; width:100%; max-width:615px; color:#f00; line-height:160%; font-weight:normal; margin:-20px auto 0;}
@media screen and (max-width:680px){#step p.notice{font-size:16px;}}
@media screen and (max-width:440px){#step p.notice{font-size:14px; max-width:390px; margin:-10px auto 0;}}

#step .inner .cat{width:100%;}
#step .inner .cat .text > img{display:inline-block; width:60px; margin:0 5px 5px 10px;}
#step .inner .cat .text > strong{color:#1bb367; font-size:24px;}

@media screen and (max-width:980px){#step .inner .cat .text > strong{font-size:20px;}}

#step .inner .cat .text::after{
display:block;
content:"";
position:absolute;
width:0;
height:0;
border-style:solid;}

#step .inner .cat .prize{
display:block;
line-height:1.2;
font-size:18px;
text-align:center; 
margin:60px auto 0; 
filter:drop-shadow(-2px -2px 2px #fff) 
drop-shadow(2px 2px 1px #fff)  
drop-shadow(-2px 2px 1px #fff)  
drop-shadow(2px -2px 1px #fff)
}
#step .inner .cat .prize > span{font-size:30px;}
#step .inner .cat .prize > img{display:inline-block; width:20px; margin:0 10px 5px 0;}
#step .inner .cat .prize > strong{color:#1bb367; font-size:34px;}
#step .inner .cat .prize > strong span{font-size:40px;}
#step .inner .cat .prize p{width:100%; max-width:369px; margin:20px auto 0;}
#step .inner .cat .prize p > img{width:100%;}

@media screen and (min-width:921px){
/*#step.main .inner .cat .text::after{bottom:-50px; left:calc(50% - 70px); border-width:50px 70px 0 70px; border-color:#1bb367 transparent transparent transparent;}*/
#step .inner .cat .text::after{bottom:-30px !important; left:calc(50% - 50px) !important; border-width:30px 50px 0 50px !important; border-color:#1bb367 transparent transparent transparent;}
#step.main .prize .sp-br{display:none;}
}

@media screen and (max-width:920px){
#step.main .inner{flex-wrap:wrap;}
#step.main .inner .cat{/*display:flex;*/display:block; width:100%; align-items:center;}
#step.main .inner .cat + .cat{margin-top:40px;}
#step.main .inner .cat .text{/*width:calc(100% - 330px);*/width:100%; text-align:center; font-size:17px;}
/*#step.main .inner .cat .text::after{bottom:-50px; left:calc(50% - 70px); border-width:50px 70px 0 70px; border-color:#1bb367 transparent transparent transparent;}*/
#step .inner .cat .text::after{bottom:-30px !important; left:calc(50% - 50px) !important; border-width:30px 50px 0 50px !important; border-color:#1bb367 transparent transparent transparent;}
#step.main .inner .cat .prize{/*width:270px; margin:0 auto;*/}
#step.main .inner .cat .prize{font-size:20px; margin: 60px auto 0;}
#step.main .inner .cat .prize > span{font-size:24px;}
#step.main .inner .cat .prize > strong{font-size:22px;}
#step.main .inner .cat .prize > strong span{font-size:28px;}
#step .inner .cat .prize p{width:60%; max-width:270px; margin:10px auto 0;}
}
@media screen and (min-width:641px) and (max-width:920px){
/*#step.main .inner .cat .text::after{top:calc(50% - 35px); right:-30px; border-width:35px 0 35px 30px; border-color:transparent transparent transparent #1bb367;}*/
#step.main .prize .sp-br{display:none;}
}
@media screen and (max-width:640px){
#step.main .inner .cat{flex-wrap:wrap;}
#step.main .inner .cat > *{width:100% !important;}
#step.main .inner .cat + .cat{margin-top:20px;}
#step.main .inner .cat .text{text-align:center; margin:0 auto 30px;}
#step .inner .cat .text::after{bottom:-30px !important; left:calc(50% - 50px) !important; border-width:30px 50px 0 50px !important; border-color:#1bb367 transparent transparent transparent;}
#step.main .inner .cat .text br{display:block;}
#step.main .prize .sp-br{display:block;}
}
@media screen and (max-width:375px){
#step.main .inner .cat .prize{font-size:18px;}}
@media screen and (max-width:370px){
#step.main .inner .cat .text{text-align:center;}
#step.main .inner .cat .text br{display:none;}}

/*
========================
PASELIアプリダウンロード
========================
*/
#app-area{ width:100%;max-width: 480px;margin:0 auto;}
#app-area img{ width:100%;}
#app-area > .inner{text-align: center;}
#app-area > .inner + .inner{padding-top:0;}
#app-area > .inner .box {
position: relative;
    background: #fff;
    font-size: 20px;
    line-height: 150%;
    border-radius: 20px;
    margin: 20px auto; 
 }
#app-area > .inner #app-dl {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
}
#app-area > .inner #app-dl > * {width:100%;}

#app-area > .inner #app-dl > .dl{margin-bottom:20px;} 
#app-area > .inner #app-dl > .dl ul {
    display: flex;
    justify-content: center;
    margin: 20px auto 0;
}
#app-area > .inner #app-dl > .dl ul li + li {
    margin-left: 10px;
}
#app-area > .inner #app-dl > .dl ul li:first-child {
    width: 190px;
}
#app-area > .inner #app-dl > .dl ul li:last-child {
    width: 236px;
}

#app-area > .inner #app-dl .paseli_text{
    display: inline-block;
    position: relative;
    color: #1BB367;
    font-size: 30px;
    font-weight: 700;
    line-height: 150%;
    text-align: center;
    margin: 0 auto;
    }
#app-area > .inner #app-dl .paseli_text::before,
#app-area > .inner #app-dl .paseli_text::after{
display: block;
position: absolute;
bottom: 0px;
}    
#app-area > .inner #app-dl .paseli_text::before {content: "＼";left: -30px;}
#app-area > .inner #app-dl .paseli_text::after {content: "／";right: -30px;}    

#app-area > .inner #app-dl > p_images{
    padding: 0 20px;
}


@media screen and (max-width:480px){
#app-area > .inner #app-dl .paseli_text{
font-size: 20px;
}
}




/*
========================
公式サイト 設置店検索へのリンク
========================
*/
#link .inner{display:flex; justify-content:space-between;}
#link .inner .cat{width:49%;}
@media screen and (max-width:639px){
#link .inner{flex-wrap:wrap;}
#link .inner .cat {
    display: flex;
    width: 100%;
    align-items: center;}
}
/*
========================
PASELIポイント
========================
*/
.point{width:100%; max-width:700px; font-size:20px; margin:0 auto;}
.point > table{background-color:#ebf6ed; font-weight:bold; color:#000; margin:20px 0; padding:20px;}
.point > table th{text-align:center; background-color:#1bb367; color:#fff; font-size:28px; font-weight:bold; padding:10px;}
.point > table th:first-child{border-right: solid 4px #fff;}
.point > table td{text-align:center; font-size:28px; padding:10px;}
.point > table td:first-child{border-right: solid 4px #fff;}

.check{width:fit-content;margin:0 auto 20px;text-align:left;font-size:18px;}

@media screen and (max-width:640px){
.point{width:100%; max-width:600px; font-size:15px;}
.point > table{margin:20px 0; padding:10px;}
.point > table th{text-align:center; font-size:20px;}
.point > table th:first-child{text-align:center; border-right: solid 2px #fff;}
.point > table td{text-align:center; font-size:20px; padding:10px;}
.point > table td:first-child{text-align:center; border-right: solid 2px #fff;}
}
/*
========================
例
========================
*/
#step-sample{
  width:100%;
  max-width:800px; 
  font-weight:400; 
  font-size:16px; 
  text-align:left;
  padding:10px 0; 
  margin:50px auto;
}
#step-sample > .ast{margin:20px;}
#step-sample > p{width:100%; background:#fff; border:1px solid; padding:20px; margin:20px auto;}

ul.paseli-point{display:flex; color:#08351e; background:#fff; flex-wrap:wrap; border:1px solid; border-top:none;}
ul.paseli-point li{background-color:rgba(27,179,103,.2);}
ul.paseli-point li:nth-child(odd){width:140px; font-weight:bold;}
ul.paseli-point li:nth-child(even){width:calc(100% - 140px);}
ul.paseli-point li:nth-child(4n+1),
ul.paseli-point li:nth-child(4n-2){background-color:rgba(27,179,103,.4);}
ul.paseli-point li:nth-child(1),
ul.paseli-point li:nth-child(2){font-weight:bold; background-color:rgba(27,179,103,.6);}

@media screen and (min-width:641px){
ul.paseli-point li{border-top:1px solid;}
ul.paseli-point li:nth-child(odd){border-right:1px solid;}
ul.paseli-point li p{padding:10px;}}

@media screen and (max-width:640px){
#step-sample{font-size:14px;}
ul.paseli-point li{width:100% !important;}
ul.paseli-point li:nth-child(odd){border-top:1px solid;}
ul.paseli-point li:nth-child(even){border-top:1px dotted;}
ul.paseli-point li:nth-child(1),
ul.paseli-point li:nth-child(2){display:none;}
ul.paseli-point li p{position:relative; padding:5px 5px 5px 115px;}

ul.paseli-point li p::before{position:absolute; top:5px; left:5px; display:inline-block; width:100px; color:#fff; font-size:12px; font-weight:bold; text-align:center; background:#1bb367; border-radius:4px;}
ul.paseli-point li:nth-child(odd) p::before{content:"平日の来店日数";}
ul.paseli-point li:nth-child(even) p::before{content:"PASELIポイント";}}

/*
========================
ステータス
========================
*/
.main-info #entry-status{
width:100%;
max-width:700px;
font-weight:700;
text-align:center;
border:3px solid #1bb367;
margin:0 auto;}
.main-info #entry-status p{padding:20px;}
.main-info #entry-status p strong{display:block; color:#1bb367; font-size:22px; font-weight:700; margin-top:10px;}
.main-info #entry-status ul{
color:#fff;
background:#1bb367;
font-size:22px;
font-weight:700;
padding:20px 0;}
.main-info #entry-status ul li + li{margin-top:10px;}
.main-info #entry-status ul li > span:last-child{display:inline-block; margin-left:10px;}
@media screen and (max-width:640px){.main-info #entry-status ul{font-size:18px;}}
@media screen and (max-width:600px){
.main-info #entry-status p{text-align:left; padding:10px;}
.main-info #entry-status p br{display:none;}
.main-info #entry-status p strong{text-align:center;}
.main-info #entry-status ul{padding:10px 0;}
.main-info #entry-status ul li > span:last-child{display:block; margin:5px auto 0;}}
@media screen and (max-width:430px){.main-info #entry-status ul li > span:first-child{font-size:13px;}}

/*
========================
Twitter導線
========================
*/
#twitter{text-align:center; margin:50px auto;}
#twitter strong{display:block; color:#1bb367;}
#twitter a{display:block; width:100%; max-width:700px; background:#fff; margin:20px auto 0;}
#twitter a img{width:100%; transition:opacity .2s ease;}
#twitter a:hover img{opacity:.6;}
@media screen and (max-width:800px){#twitter{font-size:18px;}}
@media screen and (max-width:480px){#twitter{font-size:16px; text-align:left; margin:30px auto 20px;}}

#x-share{font-size:18px; width:100%; max-width:615px; color:#000; line-height:100%; font-weight:normal; margin:20px auto 0; text-align: center;}
@media screen and (max-width:680px){#x-share{font-size:14px;}}
@media screen and (max-width:440px){#x-share{font-size:12px; max-width:390px;}}

/*
========================
キャンペーンバナー
========================
*/
#campaign-area{font-size:24px; text-align:center; margin:50px auto;}
#campaign-area strong{display:block; color:#1bb367;}
#campaign-area strong span{color:#ff008f; font-weight:600;}
#campaign-area a{display:block; width:100%; max-width:700px; background:#fff; margin:20px auto 0;}
#campaign-area a img{width:100%; transition:opacity .2s ease;}
#campaign-area a:hover img{opacity:.6;}
@media screen and (max-width:800px){#campaign-area{font-size:24px;}}
@media screen and (max-width:640px){#campaign-area{font-size:20px;}}
@media screen and (max-width:480px){#campaign-area{font-size:16px; text-align:left; margin:30px auto 20px;}}
@media screen and (max-width:420px){.sp-br420{display:none;}}
/*
========================
キャンペーン詳細
========================
*/
#about-cell{display:flex; flex-wrap:wrap; font-size:13px; line-height:180%; border:1px solid; border-top:none;}
#about-cell > *{padding:10px; border-top:1px solid;}
#about-cell dt{width:180px; background:#90ffc7; font-weight:bold; border-right:1px solid;}
#about-cell dd{width:calc(100% - 180px); background:#fff;}
#about-cell dd b{display:block; margin:10px auto 0;}
#about-cell dd b:first-child{margin:0 auto;}
#about-cell dd ul.inner{display:flex; flex-wrap:wrap; /*border:1px solid #888; border-top:none;*/ border-bottom:1px dotted #888;}
#about-cell dd ul.inner li:nth-child(odd){font-weight:bold; /*background:#ccc;*/ border-right:1px dotted #888;}
#about-cell dd ul.inner li{padding:5px; border-top:1px dotted #888;}
#about-cell dd ul.inner.step{margin:10px auto 0;}
#about-cell dd ul.inner.step li:nth-child(odd){width:60px;}
#about-cell dd ul.inner.step li:nth-child(even){width:calc(100% - 60px);}
#about-cell dd ul.inner.benefit li:nth-child(odd){width:200px;}
#about-cell dd ul.inner.benefit li:nth-child(even){width:calc(100% - 200px);}
@media screen and (max-width:800px){
#about-cell > *{width:100% !important;}
#about-cell dt{text-align:center; border-right:none; padding:5px;}
#about-cell dt br{display:none;}}
@media screen and (max-width:480px){
#about-cell dd ul.inner li{width:100% !important;}
#about-cell dd ul.inner li:nth-child(odd){border-right:none; padding:5px 5px 0 5px;}
#about-cell dd ul.inner li:nth-child(even){border-top:none; padding:0 5px 5px;}}

/*
========================
終了時
========================
*/
#end-date{
max-width:400px;
background:#fff;
font-family:'Noto Sans JP', sans-serif;
text-align:center;
border:2px solid;
border-radius:20px;
padding:20px 0;
margin:30px auto 10px;}
#end-date strong{display:block; font-size:22px; font-weight:900; margin-bottom:10px;}
@media screen and (max-width:480px){
#end-date{border-radius:10px;}
#end-date strong{font-size:15px;}}

/*
================================================================================================================
情報エリア
================================================================================================================
*/
.main-info{
display:block;
position:relative;
width:100%;
background-color:#fff;
font-family:'Noto Sans JP', sans-serif;
line-height:180%;
border:1px solid;
padding:20px;
margin:20px auto;
overflow:hidden;}
.main-info > p{text-align:center;}
.main-info > .link-btn{max-width:300px; padding:10px; margin:30px auto;}
.main-info > ul.dot{max-width:520px; margin:0 auto;}
@media screen and (max-width:480px){
.main-info{padding:10px;}
.main-info > p{text-align:left;}}

/*非表示*/
.main-info.error,
.main-info.entry,
.main-info.entry-info,
.main-info.none-entry,
.main-info.checking,
.main-info.win,
.main-info.lose{display:none;}

/*
========================
エラー
========================
*/
.main-info.error{color:#f00; font-weight:bold; text-align:center; padding:60px 10px;}
@media screen and (max-width:530px){.main-info.error{text-align:left; padding:30px 20px;}}

/*応募締切後*/
.main-info.lottery,
.main-info.none-entry{text-align:center; font-size:20px; font-weight:bold; padding:60px 10px;}
.main-info.lottery span{font-weight:normal; font-size:15px;}
@media screen and (max-width:540px){
.main-info.lottery,.main-info.none-entry{font-size:15px;}
.main-info.lottery span{font-size:13px;}}
@media screen and (max-width:430px){.main-info.lottery,.main-info.none-entry{text-align:left;  padding:30px 20px;}}

/*
================================================================================================================
ボタン
================================================================================================================
*/
.link-btn{
display:block;
width:100%;
max-width:480px;
color:#fff;
background-color:#1bb367;
font-size:18px;
font-family:'Kosugi Maru', sans-serif;
text-align:center;
line-height:130%;
border-radius:10px;
border:2px solid #1bb367;
padding:15px 10px;
margin:20px auto;
transition:all .2s ease;}
.link-btn:hover{color:#1bb367; background-color:#fff;}
.link-btn.tw{background-color:#00acee; border:2px solid #00acee;}
.link-btn.tw:hover{color:#00acee; background-color:#fff;}
.link-btn span{display:block; font-size:13px;}
@media screen and (max-width:800px){.link-btn{font-size:15px; padding:10px;}}
@media screen and (max-width:480px){.link-btn{font-size:14px; padding:5px 10px !important;}}

.link-btn.top{font-size:30px;}
@media screen and (max-width:480px){.link-btn.top{font-size:24px;}}

.link-btn.none,
.link-btn.gray{filter:grayscale(100%);}
.link-btn.none{opacity:.8; pointer-events:none;}

/*エントリーボタンと併用してしまうと暴発してしまうのでX用店舗検索用に別定義*/
.link-btn-x{
display:block;
width:100%;
max-width:360px;
color:#fff;
background-color:#00acee;
font-size:18px;
font-family:'Kosugi Maru', sans-serif;
text-align:center;
line-height:130%;
border-radius:10px;
border:2px solid #00acee;
padding:15px 10px;
margin:5px auto;
transition:all .2s ease;}
.link-btn-x:hover{color:#00acee; background-color:#fff;}
.link-btn-x span{display:block; font-size:13px;}
@media screen and (max-width:800px){.link-btn-x{font-size:15px; padding:10px;}}
@media screen and (max-width:480px){.link-btn-x{font-size:14px; padding:5px 10px !important;}}

.link-btn-x.top{font-size:30px;}
@media screen and (max-width:480px){.link-btn-x.top{font-size:24px;}}

.link-btn-x.none,
.link-btn-x.gray{filter:grayscale(100%);}
.link-btn-x.none{opacity:.8; pointer-events:none;}

.link-btn-shop{
display:block;
width:100%;
max-width:480px;
color:#fff;
background-color:#1bb367;
font-size:18px;
font-family:'Kosugi Maru', sans-serif;
text-align:center;
line-height:130%;
border-radius:10px;
border:2px solid #1bb367;
padding:15px 10px;
margin:20px auto;
transition:all .2s ease;}
.link-btn-shop:hover{color:#1bb367; background-color:#fff;}
.link-btn-shop span{display:block; font-size:13px;}
@media screen and (max-width:800px){.link-btn{font-size:15px; padding:10px;}}
@media screen and (max-width:480px){.link-btn{font-size:14px; padding:5px 10px !important;}}

.link-btn-shop.top{font-size:30px;}
@media screen and (max-width:480px){.link-btn.top{font-size:24px;}}

.link-btn-shop.none,
.link-btn-shop.gray{filter:grayscale(100%);}
.link-btn-shop.none{opacity:.8; pointer-events:none;}

/*色違い*/
.link-btn-charge{
  display:block;
  width:100%;
  max-width:480px;
  color:#fff;
  background-color:#ffae4c;
  font-size:18px;
  font-family:'Kosugi Maru', sans-serif;
  text-align:center;
  line-height:130%;
  border-radius:10px;
  border:2px solid #ffae4c;
  padding:15px 10px;
  margin:20px auto;
  transition:all .2s ease;
}
.link-btn-charge:hover{color:#ffae4c; background-color:#fff;}
.link-btn-charge.tw{background-color:#00acee; border:2px solid #00acee;}
.link-btn-charge.tw:hover{color:#00acee; background-color:#fff;}
.link-btn-charge span{display:block; font-size:13px;}

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

.input-checkbox{
position:relative;
width:100%;
max-width:530px;
line-height:20px !important;
padding:0 0 0 25px;
margin:10px 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:20px;
height:20px;
background-color:#fff;
border:2px solid #333;
opacity:.5;}
.input-checkbox label:after{
top:-5px;
left:10px;
width:10px;
height:20px;
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:#ed1e79;}

.input-checkbox label a{color:#1bb367; font-weight:bold; transition:all .2s ease;}
.input-checkbox label a:hover{color:#ff008d;}

/*
================================================================================================================
TOPに戻るボタン
================================================================================================================
*/
#page-top{
position:fixed;
bottom:20px;
right:20px;
width:50px;
height:50px;
z-index:10;}
#page-top a{
display:block;
width:50px;
height:50px;
color:#fff;
background-color:#1bb367;
font-size:9px;
font-weight:bold;
text-align:center;
border-radius:50%;
padding:5px 0 0 0;
transition:.2s ease-in-out;}
#page-top a span{
display:block;
width:20px;
height:20px;
border-right:10px solid transparent;
border-bottom:15px solid #fff;
border-left:10px solid transparent;
transition:.2s ease-in-out;
margin:0 auto;}
#page-top a:hover{color:#1bb367; background-color:#f0ff00;}
#page-top a:hover span{border-bottom:15px solid #1bb367;}