@charset 'utf-8';
.container{padding:16px; overflow-x: hidden;}
.main_title{font-size:24px; margin-bottom:16px; font-weight:bold}
.main_title.txt-18{font-size:18px; }
.p0 .main_title{padding:16px 16px 0}
h2.main_title{padding:30px 16px 40px 16px !important}
.title{font-size:18px; margin-bottom:10px; font-weight:bold}
.sub_txt{font-size:16px; line-height:150%;  }
.btn_area{text-align:center; width:100%; position: fixed; bottom: 40px; left: 0; padding: 0 16px;}
.btn_area.no-fix{position: relative; bottom: auto; margin-top: 30px;}
.btn_area .btn{background:#000; color:#fff; border-radius:25px; font-size:16px; display:inline-block;}
.btn_w100{width:100%; padding:12px 0;}
.txt_area .sub_txt p span:not(.num){width: calc(100% - 25px);}
.notice_tbl th{background: #FCF5B8}
.notice_tbl th, .notice_tbl tbody td{vertical-align: middle; padding: 8px; text-align:center; }
.txt_list li+li{margin-top:32px}
.txt_list li+li+li:last-child{border-top:1px solid #eee; padding-top:16px}
.tab_title{display:flex; text-align:center; border-bottom:1px solid #eee}
.tab_title li{width:100%; font-size:15px; cursor:pointer}
.faq .tab_title li{padding:15px 0; }
.tab_title li.active{border-bottom:2px solid #000}
.tab_title li > a{display:block; padding:15px 0; }
.drop_list > li {border-bottom: 1px solid #eee;}
.drop_list > li .drop_cont > dt {position: relative; padding: 24px 13px; cursor: pointer; padding-right: 40px;}
.drop_list > li .drop_cont > dt:after{content: ''; width: 20px; height:20px; position: absolute; right:15px; background: url(../img/ic_arw_btm.svg) no-repeat;  top: 50%; transform: translateY(-50%);}
.drop_list > li .drop_cont > dt .date{display:block; font-size:14px; color:#757575; padding-top:5px;}
.drop_list > li .drop_cont > dd{display: none; padding: 20px 16px; line-height: 130%; background: #f7f7f7; word-break: keep-all;}
.drop_list > li .drop_cont > dt .tit.new:before{content:''; background:url(../img/ic_new.svg) no-repeat; background-size:100% 100%; width:47px; height:25px; margin:2px 8px -2px 0; vertical-align:sub; display:inline-block;}
.drop_list .cs_center{padding:24px 16px;border-bottom: 1px solid #eee;}
.drop_list .cs_center a{display:block; position: relative}
.drop_list .cs_center a:after{content: ''; width: 15px; height:25px; position: absolute; right:0; background: url(../img/ic_arw_right.svg) no-repeat;  top: 50%; transform: translateY(-50%);}
.drop_list .cs_center p{font-size:14px; color:#616161; padding-bottom:3px;}
.drop_list > li .drop_cont > dd > p > img {height: auto !important;}
table{table-layout: auto;}
.membership_list li{border-top:1px solid #eee}
.membership_list li > a{position: relative; padding: 24px 13px; cursor: pointer; display:block;}
.membership_list li > a span{display:block;}
.membership_list li > a .tit{font-size:18px}
.membership_list li > a .sub_txt01{color:#757575; padding:5px 0 24px 0;}
.membership_list li > a .sub_txt02{color:#000}
.coupon_box{padding:0 16px 16px;}
.coupon_box p{color:#757575; padding-bottom:7px}
.coupon_box input{padding:12px 0 12px 16px; width:100%; border-radius:5px; font-size:16px }
.title_area{background:#faf194; padding:65px 16px 35px 16px;}
.title_area p{font-size:15px;}
.title_area h2{font-size:20px; padding-top:5px; font-weight:bold;}
.txt_area{padding:40px 16px; background:#fff}
.txt_area .tit, .caution .tit{font-size:18px; font-weight:bold; margin-bottom:16px;}
.member_detail{background:#fafafa; height:100vh}
.txt_area .sub_txt p{vertical-align:middle; padding:7px 0}
.txt_area .sub_txt p span.num{background:#000; border-radius:50%; width: 18px; height: 18px; display: inline-block; text-align: center;
    font-size: 12px; line-height: 18px; color:#fff; margin-right:5px;}
.txt_area .sub_txt p span:not(.num){display: inline-block; vertical-align: text-top; }
.copy_box{background:#fff; width:100%; padding:16px 16px 40px 16px }
.copy_box .copy_txt{background:#f0f0f0; border-radius:5px; width:100%; border:none; font-size:16px; font-weight:bold; text-align:center; padding:8px 0 9px 0}
.caution {background:#fafafa; padding:24px 16px }
.caution .sub_txt span{display:block; color:#757575; padding-bottom: 3px}
.ico_sprites {position: relative;}
.ico_sprites:after { content: ''; position: absolute; top: 50%; left: 50%; background: url(../img/ico_sprites.png) no-repeat;
    background-size: 360px;}
/*filter*/
.filter_area {padding: 10px; text-align: center; border-bottom: 1px solid #ebebeb; background: #f7f7f7;}
.filter_area .filter {position: relative; float: right;}
.filter_area .filter .filter_list > li{padding:5px 0;text-align:left}
.filter_area .filter .filter_list > li + li{border-top:1px solid #ebebeb}
.filter_area .filter .filter_list > li a{display:block;font-size:12px;line-height:30px}
.play_guide_area .view_type .ico_sprites {display: inline-block; padding-left: 20px; color: #2cb0c9; font-size: 12px; line-height: 16px; vertical-align: top;}
.play_guide_area .filter_area .filter .btn_filter {display: block; width: auto; height: auto; padding-right: 20px; color: #2cb0c9; font-size: 12px; line-height: 16px;}
.play_guide_area .filter_area .filter .btn_filter:after {top: 5px; left: auto; right: 0; width: 14px; height: 8px; background-position: -160px -80px;}
.play_guide_area .view_type .ico_sprites:after {left: 0; width: 16px; height: 16px; margin-top: -8px;}
.play_guide_area .view_type .btn_view_list:after {background-position: -40px -200px;}
.layer_popup{position:absolute;top:-100%;right:30px;width:calc(100vw - 60px);padding:25px;border-radius:10px;background:#fff;filter:drop-shadow(0 0 10px rgba(0,0,0,0.25));opacity:0;z-index:-10;transition:all ease-in-out .4s}
.layer_popup.on{top:30px;opacity:1;z-index:90}
.layer_popup.on:after{content:'';position:absolute;top:-8px;right:28px;width:31px;height:9px;background:url(../img/common/bg_layer_popup.png) no-repeat 0 0;background-size:100%}
.layer_popup.layer_filter.on:after{right:3px}
.layer_popup .btn_close{position:absolute;top:0;right:0;width:30px;height:30px}
.layer_popup .btn_close:after{width:10px;height:10px;margin:-5px 0 0 -5px;background-position:-80px -120px}
/* pagination */
.pagination_area{padding:25px 0 40px;text-align:center}
.pagination{display:inline-block;vertical-align:top}
.pagination a{display:block;width:26px;height:26px;margin:0 4px;color:#999;line-height:24px;text-align:center;border:1px solid #bbb;border-radius:5px}
.pagination a.on{color:#fff;border-color:#2cb0c9;background:#2cb0c9}
.pagination .page:after{width:8px;height:14px;margin:-7px 0 0 -5px}
.pagination .page_prev:after{background-position:-320px -120px}
.pagination .page_next:after{margin-left:-3px;background-position:-320px -40px}

/* 이번주 놀이 가이드 */
/* 목록 */
.play_guide_area{padding:0 15px}
.play_guide_area .filter_area{margin:0 -30px;padding-right:30px;padding-left:30px}
.play_guide_area .filter_area .filter .btn_filter{display:block;width:auto;height:auto;padding-right:20px;color:#2cb0c9;font-size:12px;line-height:16px}
.play_guide_area .filter_area .filter .btn_filter:after{top:5px;left:auto;right:0;width:14px;height:8px;background-position:-160px -80px}
.play_guide_area .filter_area .filter .btn_filter.on:after{background-position:-200px -80px}
.play_guide_area .filter_area .filter .filter_list > li.on a{color:#2cb0c9}
.play_guide_area #layerFilter{right:0}
.play_guide_area .view_type .ico_sprites{display:inline-block;padding-left:20px;color:#2cb0c9;font-size:12px;line-height:16px;vertical-align:top}
.play_guide_area .view_type .ico_sprites:after{left:0;width:16px;height:16px;margin-top:-8px}
.play_guide_area .view_type .btn_view_thumb:after{background-position:0 -200px}
.play_guide_area .view_type .btn_view_list:after{background-position:-40px -200px}
.play_guide li .cont dt .weekly{color:#25435a;line-height:1}
.play_guide li .cont dt .tit{display:block;overflow:hidden; padding:1px;color:#222;font-weight:normal;text-overflow:ellipsis;white-space:nowrap;font-size: 12px; height: 16px;vertical-align: middle;}
/*.play_guide li .cont dt .video_ico{width:15px;height: 15px ; position: fixed; z-index: 1; }*/
.play_guide li .cont dd{margin-top:5px;font-size:12px}
.play_guide li.bg_new dt .weekly{display:inline;position:relative;padding-left:20px}
.play_guide li.bg_new dt .weekly:after{content:'';position:absolute;top:4px;left:0;width:16px;height:16px;background:url(../img/ico_sprites.png) no-repeat 0 -120px;background-size:360px}
.play_guide.thumb{margin-top:10px; font-size:0;}
.play_guide.thumb li{width:calc(50% - 5px); display:inline-block; margin-top:10px; border:1px solid #bbb;border-radius:5px}
.play_guide.thumb li>a{display: block}
.play_guide.thumb li:nth-child(2n){margin-left:10px}
.play_guide.thumb li .cont{padding:10px 5px 10px 5px;}
.play_guide.list{margin:0px -30px 0;padding: 0 15px;}
.play_guide.list li{width:100%;padding:0 30px}
.play_guide.list li + li{border-top:1px solid #ebebeb}
.play_guide.list li .cont{padding:13px 0}
.play_guide.list li img{display:none}
/* 상세 */
.guide_detail{margin:0 -30px;padding:0 30px;border-top:6px solid #f7f7f7}
.guide_detail > dt{padding:14px 0;color:#222;font-size:16px;line-height:125%;text-align:center;border-bottom:1px solid #222}
.guide_detail > dt .weekly{color:#25435a}
.guide_detail > dt .tit{font-weight:normal}
.guide_detail > dd .date{padding:10px 0;font-size:12px;border-bottom:1px solid #bbb}
.guide_detail .guide_cont{padding:10px 0}
.guide_detail .guide_cont .playcard_list{overflow:hidden;position:relative}
.guide_detail .guide_cont .playcard_list .swiper-btn{position:absolute;top:50%;width:22px;height:31px;margin-top:-15px;z-index:50}
.guide_detail .guide_cont .playcard_list .swiper-btn:after{width:12px;height:21px;margin:-10px 0 0 -6px; background: url(../img/ico_sprites.png) no-repeat;
    background-size: 360px;}
.guide_detail .guide_cont .playcard_list .swiper-prev{left:0}
.guide_detail .guide_cont .playcard_list .swiper-prev:after{background-position:-280px -280px}
.guide_detail .guide_cont .playcard_list .swiper-next{right:0}
.guide_detail .guide_cont .playcard_list .swiper-next:after{background-position:-320px -280px}
.guide_detail .guide_cont .playcard_detail{line-height:150%}
.guide_detail .guide_cont .playcard_detail img{width:100% !important;height:auto !important}


/* 약관 */
.terms h4{font-size: 20px; margin-bottom: 20px}
.policy_area{padding:10px 5px;line-height:150%}
.policy_area p + .policy_list,
.policy_area .policy_list > li + li{margin-top:30px}
.policy_area .policy_list > li .section > dt{font-size:16px;line-height:130%}
.policy_area .policy_list > li .section > dd{margin-top:10px}
.policy_area .policy_list > li .sec + .sec{margin-top:10px}
.policy_area .policy_list > li .sec dt{line-height:130%}
.policy_area .policy_list > li .sec dd{margin-top:10px; line-height: 150%}
.policy_area .policy_list > li .list li{padding-left:14px;text-indent:-14px}
.policy_area .policy_list > li .list > li + li{margin-top:6px}
.policy_area .policy_list > li .num_list{margin-top:5px}
.policy_area .policy_list > li p + .list,
.policy_area .policy_list > li .list + p{margin-top:10px}
.policy_area .policy_list > li .tbl{margin-top:10px;text-indent:0}

/* 개인정보 이용동의 */
.policy_agree_top{margin-top:-20px;padding:0 30px 50px;text-align:center}
.policy_agree_top dt{color:#222}
.policy_agree_top dt .logo{display:block;width:78px;margin:0 auto 10px}
.policy_agree_top dt strong{font-weight:500}
.policy_agree_top dd{margin-top:20px;font-size:12px;line-height:140%}
.policy_form_area .policy_box{padding:0 30px;line-height:130%}
.policy_form_area .policy_box + .policy_box{margin-top:30px;padding-top:30px;border-top:6px solid #f7f7f7}
.policy_form_area .policy_box > dt{color:#222;font-size:16px}
.policy_form_area .policy_box > dd{margin-top:15px;border:1px solid #ebebeb}
.policy_form_area .agree{position:relative}
.policy_form_area .agree input{position:absolute;opacity:0}
.policy_form_area .agree label{position:relative;padding-left:20px;vertical-align:top}
.policy_form_area .agree label:after{content:'';position:absolute;top:4px;left:0;width:14px;height:11px;background:url(../img/common/chk.png) no-repeat 0 0;background-size:100%}
.policy_form_area .agree :checked + label:after{background-position:0 100%}
.policy_form_area .agree_all{padding:10px 15px;background:#f7f7f7}
.policy_form_area .agree_all label{color:#222}
.policy_form_area .agree_all label:after{top:2px;width:16px;height:16px;background:url(../img/common/checkbox.png) no-repeat 0 0;background-size:100%}
.policy_form_area .agree_all :checked + label:after{background-position:0 100%}
.policy_form_area .agree_txt{padding:15px 15px 0;font-size:13px}
.policy_form_area .tip{margin:15px 30px 0;padding-left:14px;font-size:12px;line-height:130%;text-indent:-14px}
.policy_form_area .policy_list{padding:10px 15px}
.policy_form_area .policy_list > li{position:relative;padding:5px 0;font-size:13px}
.policy_form_area .policy_list > li .btn_policy{position:absolute;top:5px;right:0;width:55px;height:16px;padding:0 10px;color:#bbb;font-size:0;line-height:14px;border:1px solid #bbb;border-radius:8px;background:url(../img/btn/txt_terms_view2.png) no-repeat 50% 50%;background-size:35px}
.policy_form_area .policy_list.service > li + li{margin-top:5px}
.policy_form_area .policy_list li .service_list li{display:table;width:50%;min-height:50px;margin-top:10px}
.policy_form_area .policy_list li .service_list li dl{display:table-cell;position:relative;padding-left:50px;vertical-align:middle}
.policy_form_area .policy_list li .service_list li dl:after{content:'';position:absolute;top:50%;left:0;width:40px;height:40px;margin-top:-20px;border-radius:50%;background:#f7f7f7}
.policy_form_area .policy_list li .service_list li dl dd{margin-top:5px;font-size:12px;line-height:130%}
.policy_form_area .policy_list li .service_list li.ico01 dl:after{background:#f7f7f7 url(../img/policy/ico_tel.png) no-repeat 50% 50%;background-size:30px}
.policy_form_area .policy_list li .service_list li.ico02 dl:after{background:#f7f7f7 url(../img/policy/ico_message.png) no-repeat 50% 50%;background-size:30px}
.policy_form_area .policy_list li .service_list li.ico03 dl:after{background:#f7f7f7 url(../img/policy/ico_camera.png) no-repeat 50% 50%;background-size:30px}
.policy_form_area .policy_list li .service_list li.ico04 dl:after{background:#f7f7f7 url(../img/policy/ico_download.png) no-repeat 50% 50%;background-size:30px}
.policy_form_area .policy_list li .service_list li.ico05 dl:after{background:#f7f7f7 url(../img/policy/ico_location.png) no-repeat 50% 50%;background-size:30px}
.notice_tbl{border-collapse: separate; border-spacing: 1px; background: #000; margin: 16px 0; text-align: center}
.notice_tbl tbody{background: #fff}
.notice_tbl tbody td{vertical-align: middle;}
.notice_tbl th{background: rgba(189 231 239)}
.notice_tbl th, .notice_tbl tbody td{padding: 8px}
.notice_tbl th, .notice_tbl tbody td{vertical-align: middle; padding: 8px; text-align:center; }
.notice_tbl{width: 100%;}
.pay_table .sel_tab{display: flex; margin: 16px 0; text-align: center}
.pay_table .sel_tab p{width: calc(100% / 3 - -.6px); padding: 8px; border: 1px solid #000; margin-right: -1px;  }
.pay_table .sel_tab p.on{background: #000; color: #fff}
.tbl_view{text-align: center; margin: 16px 0;}
.tbl_view th, .tbl_view td{padding: 4px; vertical-align: middle;}
.drop_list > li .drop_cont > dt:after{content: ''; width: 20px; height:20px; position: absolute; right:15px; background: url(../img/ic_arw_btm.svg) 50% no-repeat;  top: 50%; transition:.2s;  transform: translateY(-50%);}
.drop_list > li.on .drop_cont > dt:after{transform:translateY(-50%) rotate(180deg)}
.service_tbl{width: 100%; text-align: center; border-top: 2px solid #000; border-bottom: 2px solid;}
.service_tbl tr th{border-bottom: 1px solid #000;}
.service_tbl tr th, .service_tbl tr td{padding: 9px 2px; text-align: center;}
.notice_tbl th{background: #FCF5B8}
@media only screen and (max-height:568px){
    #layerFilter .cont_filter{overflow-y:auto;max-height:330px}

    @media only screen and (orientation:landscape){
        #layerFilter .cont_filter{max-height:130px}
    }
}