@charset "UTF-8";
@import "base.css";

#wrap{position:relative;height:100%;}
/** Layout **/
#header{position:sticky;left:0;top:0;width:100%;z-index:100;background:#01a1a1;}
#header h1{padding:10px 0;color:#fff;font-size:21px;font-weight:500;line-height:34px;text-align:center;}
/* container */
#container{z-index:1;}
#contents{position:relative;width:100%;margin:0 auto;padding:30px 20px 80px;z-index:10;}
#contents h2{margin-bottom:8px;font-weight:500;}
#contents h3{margin-bottom:8px;font-weight:500;}


/** common **/
.hidden{display:none;}
.hidden_mo{display:none;}

/* text */
.f_blue{color:#007ce9;}
.f_skyblue{color:#25c0d2;}
.f_red{color:#eb2424 !important;}
.f_green{color:#08a600;}
.strong{font-weight:700;}
.center{text-align:center;}
.ell{text-overflow:ellipsis;overflow:hidden;white-space:nowrap;}
.comment{color:#666;font-size:13px;line-height:19px;}
.addition{position:relative;padding-left:8px;color:#666;font-size:13px;text-align:left;line-height:19px;}
.addition::before{position:absolute;left:0;top:3px;content:'*';}
.heading{position:relative;padding-left:6px;}
.heading::before{position:absolute;left:0;top:2px;width:2px;height:13px;content:'';background:#01a1a1;}

/* btn | default : xm, #212121, font 15px, border #212121 */
.btn{display:block;width:100%;padding:10px 0;color:#212121;font-size:15px;text-align:center;line-height:24px;border:1px solid #000;background:#fff;}
/*- btn background none hover -*/
.btn.orange{color:#fff;border-color:#dc7a3a;background:#dc7a3a;}
.btn.blue{color:#fff;border-color:#007ce9;background:#007ce9;}
.btn.green{color:#fff;border-color:#01a1a1;background:#01a1a1;}
.btn.black{color:#fff;border-color:#212121;background:#212121;}
.btn.gray{border-color:#c1c1c1;}
/*- btn disabled -*/
.btn.disabled{color:#bebebe;border-color:#e9e9e9 !important;background:#e9e9e9 !important;pointer-events:none;}

.btn.arrow{position:relative;padding-left:18px;padding-right:68px;text-align:left;line-height:18px;border-width:2px;}
.btn.arrow::before,.btn.arrow::after{position:absolute;top:50%;right:19px;width:11px;height:2px;content:'';}
.btn.arrow::before{transform:translateY(-50%) rotate(45deg);margin-top:-3px;}
.btn.arrow::after{transform:translateY(-50%) rotate(135deg);margin-top:4px;}
.btn.br_blue.arrow::before,.btn.br_blue.arrow::after{background:#1568dd;}
.btn.br_blue.arrow:hover::before,.btn.br_blue.arrow:hover::after{background:#fff;}

.btn.check{position:relative;padding-left:18px;color:#000;border:none;background:transparent;}
.btn.check::before{position:absolute;left:0;top:50%;width:10px;height:6px;margin:-6px 0 0 2px;border-bottom:1px solid #000;border-left:1px solid #000;-webkit-transform: rotate(-45deg);transform: rotate(-45deg);content:'';}

.btn_box{display:flex;justify-content:center;margin-top:35px;}
.btn_box .btn + .btn{margin-left:10px;}

/* table */
.t_data{width:100%;table-layout:fixed;border-top:1px solid #dbdbdb;}
.t_data th,.t_data td{height:52px;padding:8px 10px;text-align:left;border-bottom:1px solid #dbdbdb;}
.t_data th{color:#333;font-size:13px;font-weight:500;text-align:center;}
.t_data td{color:#333;font-size:13px;border-left:1px solid #dbdbdb;}

/* contents */
.h_cont{margin-bottom:35px;text-align:center;}
.h_cont h2{font-size:18px;}
.h_cont p{display:inline-block;font-size:12px;}
.h_cont p.title{font-size:15px;font-weight:500;}

.coupon_info{margin-bottom:25px;}
.coupon_info div{width:220px;margin:0 auto;text-align:left;border:1px solid #dbdbdb;border-radius:12px;box-shadow:0 3px 6px 0 rgba(0,0,0,.16);}
.coupon_info span{display:block;}
.coupon_info img{width:140px;}
.coupon_info .coupon_title{padding:18px 0;text-align:center;}
.coupon_info .coupon_title span{margin-top:2px;font-size:15px;}
.coupon_info .coupon_value{overflow:hidden;padding:6px 8px;color:#fff;font-size:15px;font-weight:500;text-align:right;border-radius:0 0 12px 12px;background:#01a1a1;}

.coupon_li{margin-top:15px;padding:10px;background:#fbf3e6;}
.coupon_li li{position:relative;padding-left:8px;font-size:13px;}
.coupon_li li::before{position:absolute;left:0;top:0;content:'-';}
.coupon_li li + li{margin-top:8px;}

.info_box{margin-top:25px;}
.info_box p{margin-bottom:8px;font-size:13px;}
.info_li{padding:10px 15px;background:#f5f5f5;}
.info_li li{position:relative;padding-left:8px;font-size:11px;}
.info_li li::before{position:absolute;left:0;top:0;content:'-';}
.info_li li + li{margin-top:4px;}

/* modal layer */
.dimmed{display:none;position:fixed;top:0;right:0;bottom:0;left:0;background:#000;opacity: 0.5;z-index:9997;}
.layer{display:none;position:fixed;left:50%;top:50%;width:80%;transform:translate(-50%, -50%);box-sizing:border-box;background:#fff;z-index:9998;}
.layer .layer_cont{padding:5px 20px;}
.layer h1{color:#05141f;font-size:18px;font-weight:500;text-align:center;line-height:65px;}

.layer_btn{margin-top:20px;font-size:0;text-align:center;border-top:1px solid #dbdbdb;}
.layer_btn button{display:block;width:100%;color:#fff;font-weight:500;text-align:center;line-height:44px;background:#01a1a1;}

@media screen and (min-width:481px){
}
@media screen and (min-width:1024px){
    #contents{width:1024px;}
    .btn_box .btn{width:480px;}
    .layer{width:640px;}
}