@charset "utf-8";

/* css reset */
html{font-size:15px}
html, body{-webkit-text-size-adjust:none;height:100%;}
html, body, div, form, input, select, button, textarea, legend, fieldset, h1, h2, h3, h4, h5, h6, ul, ol, dl, li, dt, dd, blockquote, address, p, th, td, caption{margin:0; padding:0;-webkit-box-sizing:border-box;-o-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}
ol, ul, li{list-style:none} img, fieldset{border:0 none}
input[type=text], input[type=password], input[type=submit], input[type=search], textarea{-webkit-appearance:none}
input:focus::-webkit-input-placeholder,textarea:focus::-webkit-input-placeholder{/* WebKit browsers */color:transparent}
input:focus:-moz-placeholder,textarea:focus:-moz-placeholder{/* Mozilla Firefox 4 to 18 */color:transparent}
input:focus::-moz-placeholder,textarea:focus::-moz-placeholder{/* Mozilla Firefox 19+ */color:transparent}
input:focus:-ms-input-placeholder,textarea:focus:-ms-input-placeholder{/* Internet Explorer 10+ */color:transparent}
button{border:0 none; background:transparent; cursor:pointer}
table caption{width:0; height:0; visibility:hidden; font-size:0; line-height:0}
table{border-collapse:collapse; border-spacing:0}
header, footer, section, article, aside, nav, hgroup, details, menu, figure, figcaption{display:block}
a{text-decoration:none}
body{
    background:transparent;line-height:1.15;letter-spacing:-0.3px;
    font-family:Helvetica,AppleSDGothicNeo,Arial,sans-serif;
    -webkit-tap-highlight-color: transparent;-webkit-user-select:none;-webkit-touch-callout:none;word-break:break-all;
}

/* common */
.box_sh{-webkit-box-shadow:1.25px 1.25px 3px rgba(0,0,0,0.3);-mox-box-shadow:1.25px 1.25px 3px rgba(0,0,0,0.3);box-shadow:1.25px 1.25px 3px rgba(0,0,0,0.3)}
.txt_sh{text-shadow:0.8px 0.8px 1px rgba(0,0,0,0.15)}
.radius_full{border-bottom-right-radius:100%;border-bottom-left-radius:100%;border-top-right-radius:100%;border-top-left-radius:100%}

.div_header{position:fixed;width:100%;z-index:5}
.div_header_inner{height:52px;max-width:480px;margin:0 auto;position:relative;background-color:#0e4733;}
.div_content{width:100%;max-width:480px;margin:0 auto;position:relative}
.div_header .img_full {margin-top:-1px;}


.btn_back{position:absolute;top:17px;left:12px;height:18px}
.btn_left{position:absolute;top:11px;left:12px;height:16px;padding:6px}
.btn_right{position:absolute;top:17px;right:9px;height:22px}

.title_header{height:52px;line-height:52px;text-align:left;font-size:20px;font-size:1.25rem;letter-spacing:-0.1px;width:90%;margin:0 auto;color:#fff;}

.padding_top_header{padding-top:60px}
.padding_bottom_header {padding-bottom:20px;}

.back_f9f4e1 {background-color:#f9f4e1;}
.div_90 {width:90%;margin:0 auto;}

.div_80 {width:80%;margin:0 auto;}


.img_full{width:100%;display:block}
.overflow_hidden {overflow:hidden!important;}
.hidden{display:none!important}


/* popup_type_new */
div.popup_wrap{position:fixed;width:100%;height:100%;top:0;left:0;font-size:0;text-align:center;background-color: rgba(0,0,0,0.6);z-index: 10;word-break:break-all;overflow:auto}
div.popup_wrap:before{width:0;height:100%;position:relative;vertical-align:middle;display:inline-block;overflow:hidden;content:"";font-size:0}
div.popup_content{display:inline-block;vertical-align:middle;width:100%;padding:20px 0;font-size:1rem;opacity:1;
    -webkit-transform:translate3d(0,0,0);
    -moz-transform:translate3d(0,0,0);
    -o-transform:translate3d(0,0,0);
    transform:translate3d(0,0,0);
    -webkit-animation:popup_show 0.28s linear 0s 1;
    -moz-animation:popup_show 0.28s linear 0s 1;
    -o-animation:popup_show 0.28s linear 0s 1;
    animation:popup_show 0.28s linear 0s 1;
}
@-webkit-keyframes popup_show {
    0%{-webkit-transform:translate3d(0,-30px,0);opacity:0.3;}
    100%{-webkit-transform:translate3d(0,0,0);opacity:1;}
}
@-moz-keyframes popup_show {
    0%{-moz-transform:translate3d(0,-30px,0);opacity:0.3;}
    100%{-moz-transform:translate3d(0,0,0);opacity:1;}
}
@-o-keyframes popup_show {
    0%{-o-transform:translate3d(0,-30px,0);opacity:0.3;}
    100%{-o-transform:translate3d(0,0,0);opacity:1;}
}
@keyframes popup_show {
    0%{transform:translate3d(0,-30px,0);opacity:0.3;}
    100%{transform:translate3d(0,0,0);opacity:1;}
}

.box_vertical{position:fixed;width:100%;height:100%;top:0;left:0;font-size:0;text-align:center;overflow:auto}
.box_vertical:before{width:0;height:100%;position:relative;vertical-align:middle;display:inline-block;overflow:hidden;content:"";font-size:0}
.box_vertical_inner{display:inline-block;vertical-align:middle;width:100%;font-size:1rem}

.box_vertical.user_voucher {z-index:0;}
/* custom */

/* index.html */
.back_1b1209 {background-color:#1b1209;}
#imgVideoWrap {position:fixed;width:100%;height:100%;top:0;left:0;z-index:0;overflow:hidden;}
#imgVideoDiv {position:relative;width:100%;height:100%;background-color:#1b1209;max-width:480px;overflow:hidden;margin:0 auto;}
#imgVideoWrap_inner  {position:absolute;width:100%;top:0;left:0;height:100%;}
#imgVideoWrap_inner img {position:absolute;width:100%;top:0;left:0;opacity:0;}
#imgVideoWrap_inner:before{position:absolute;top:0;left:0;width:100%;height:100%;background-color:rgba(0,0,0,0.6);content:"";}
#imgVideoWrap_inner.load_on:before {content:none;width:0;height:0;}
#imgVideoFrame {opacity:0;}

.height_full {height:100%;overflow:auto;}

.h1_main_logo {margin-top:10%;width:44%;padding-top:20px;margin-left:8%;position:relative;}
.h1_main_logo:before {position:absolute;top:0;left:0;width:26px;height:4px;background-color:#fff;content:"";}

#divBottomCard {position:fixed;width:100%;bottom:0;left:0;}
.ul_bottom_card {width:100%;background-color:#fff;margin-top:-1px;}
.ul_bottom_card li {width:100%;overflow:hidden;padding-top:8px;position:relative;padding-bottom:1px;}
.ul_bottom_card li:before{position:absolute;width:100%;height:100%;bottom:0;left:0;content:"";opacity:0.8;z-index:3;
    -webkit-box-shadow: inset 0px -10px 10px -10px rgba(0,0,0,0.15);
    -moz-box-shadow: inset 0px -10px 10px -10px rgba(0,0,0,0.15);
    box-shadow: inset 0px -10px 10px -10px rgba(0,0,0,0.51);
}
.div_card_inner {width:90%;margin:0 auto;padding:17px 0;border-top-left-radius:10px;border-top-right-radius:10px;
    -webkit-box-shadow: 1px 0px 1px 1px rgba(0,0,0,0.25);
    -moz-box-shadow: 1px 0px 1px 1px rgba(0,0,0,0.25);
    box-shadow: 1px 0px 1px 1px rgba(0,0,0,0.25);}

.div_card_inner p {width:90%;margin:0 auto;}
.div_card_inner p img {display:inline-block;vertical-align:middle;width:15px;}
.div_card_inner p span {display:inline-block;vertical-align:middle;padding-left:5px;font-size:15px;font-size:0.938rem;}

.div_card_inner.type01 {background-image:url(../images/bg_type01.png);background-repeat:repeat;background-size:100% auto;background-color:#f26b24;color:#f7f0da;}
.div_card_inner.type02 {background-image:url(../images/bg_type02.png);background-repeat:repeat;background-size:100% auto;background-color:#f7f0da;color:#f26b24;}
.div_card_inner.type03 {background-image:url(../images/bg_type03.png);background-repeat:repeat;background-size:100% auto;background-color:#b5c9b9;color:#0e4733;}
.div_card_inner.type04 {background-image:url(../images/bg_type02.png);background-repeat:repeat;background-size:100% auto;background-color:#0e4733;color:#b5c9b9;}


.effect_target {opacity:0.7;
    -webkit-transform:translate3d(0,50px,0);
    -moz-transform:translate3d(0,50px,0);
    -o-transform:translate3d(0,50px,0);
    -ms-transform:translate3d(0,50px,0);
    transform:translate3d(0,50px,0);
    -webkit-transition:transform 0.4s ease-out,opacity 0.4s linear;
    -o-transition:transform 0.4s ease-out,opacity 0.4s linear;
    -moz-transition:transform 0.4s ease-out,opacity 0.4s linear;
    transition:transform 0.4s ease-out,opacity 0.4s linear;
}
.effect_target.effect02 {
    -webkit-transform:translate3d(0,100%,0);
    -moz-transform:translate3d(0,100%,0);
    -o-transform:translate3d(0,100%,0);
    -ms-transform:translate3d(0,100%,0);
    transform:translate3d(0,100%,0);
}
.effect_target.effect_on {opacity:1;
    -webkit-transform:translate3d(0,0px,0);
    -moz-transform:translate3d(0,0px,0);
    -o-transform:translate3d(0,0px,0);
    -ms-transform:translate3d(0,0px,0);
    transform:translate3d(0,0px,0);
}


.ul_bottom_card li .div_card_inner {
}
.ul_bottom_card li:nth-child(1) .div_card_inner {
    -webkit-transition-delay:0s;
    -moz-transition-delay:0s;
    -o-transition-delay:0s;
    transition-delay:0s;
}
.ul_bottom_card li:nth-child(2) .div_card_inner {
    -webkit-transition-delay:0.1s;
    -moz-transition-delay:0.1s;
    -o-transition-delay:0.1s;
    transition-delay:0.1s;
}
.ul_bottom_card li:nth-child(3) .div_card_inner {
    -webkit-transition-delay:0.2s;
    -moz-transition-delay:0.2s;
    -o-transition-delay:0.2s;
    transition-delay:0.2s;
}
.ul_bottom_card li:nth-child(4) .div_card_inner {
    -webkit-transition-delay:0.3s;
    -moz-transition-delay:0.3s;
    -o-transition-delay:0.3s;
    transition-delay:0.3s;
}
.ul_bottom_card li:nth-child(5) .div_card_inner {
    -webkit-transition-delay:0.4s;
    -moz-transition-delay:0.4s;
    -o-transition-delay:0.4s;
    transition-delay:0.4s;
}
.ul_bottom_card li:nth-child(6) .div_card_inner {
    -webkit-transition-delay:0.5s;
    -moz-transition-delay:0.5s;
    -o-transition-delay:0.5s;
    transition-delay:0.5s;
}
.ul_bottom_card li:nth-child(7) .div_card_inner {
    -webkit-transition-delay:0.6s;
    -moz-transition-delay:0.6s;
    -o-transition-delay:0.6s;
    transition-delay:0.6s;
}





.ul_bottom_card li.move_on .div_card_inner p img , .ul_bottom_card li.move_on .div_card_inner p span {
    -webkit-transform:translate3d(0,0px,0);
    -moz-transform:translate3d(0,0px,0);
    -o-transform:translate3d(0,0px,0);
    -ms-transform:translate3d(0,0px,0);
    transform:translate3d(0,0px,0);
}
.ul_bottom_card li.move_on .div_card_inner p img {
    -webkit-animation:animation_bottom 0.5s 1;
    -moz-animation:animation_bottom 0.5s 1;
    -o-animation:animation_bottom 0.5s 1;
    animation:animation_bottom 0.5s 1;
}
.ul_bottom_card li.move_on .div_card_inner p span {
    -webkit-animation:animation_bottom 0.5s 1 0.1s;
    -moz-animation:animation_bottom 0.5s 1 0.1s;
    -o-animation:animation_bottom 0.5s 1 0.1s;
    animation:animation_bottom 0.5s 1 0.1s;
}
@-webkit-keyframes animation_bottom {
    0%{-webkit-transform:translate3d(0,0px,0);}
    30%{-webkit-transform:translate3d(0,-5px,0);}
    60%{-webkit-transform:translate3d(0,0px,0);}
    70%{-webkit-transform:translate3d(0,-1px,0);}
    100%{-webkit-transform:translate3d(0,0px,0);}
}
@-moz-keyframes animation_bottom {
    0%{-moz-transform:translate3d(0,0px,0);}
    30%{-moz-transform:translate3d(0,-5px,0);}
    60%{-moz-transform:translate3d(0,0px,0);}
    70%{-moz-transform:translate3d(0,-1px,0);}
    100%{-moz-transform:translate3d(0,0px,0);}
}
@-o-keyframes animation_bottom {
    0%{-o-transform:translate3d(0,0px,0);}
    30%{-o-transform:translate3d(0,-5px,0);}
    60%{-o-transform:translate3d(0,0px,0);}
    70%{-o-transform:translate3d(0,-1px,0);}
    100%{-o-transform:translate3d(0,0px,0);}
}
@keyframes animation_bottom {
    0%{transform:translate3d(0,0px,0);}
    30%{transform:translate3d(0,-5px,0);}
    60%{transform:translate3d(0,0px,0);}
    70%{transform:translate3d(0,-1px,0);}
    100%{transform:translate3d(0,0px,0);}
}


/* user_stamp.html */
/* .div_userPage_banner {position:relative;width:100%; min-height:200px; max-height: 234px; overflow: hidden;} */
.div_userPage_banner {position:relative;width:100%; overflow: hidden;}
.div_title_userPage_wrap {position:absolute;top:15%;left:0;}
.div_title_userPage {width:auto;display:inline-block;position:relative;padding-right:4px;}

.div_title_userPage h1 {background-color:rgba(14,71,51,0.8);color:#fff;font-size:20px;font-size:1.25rem;font-weight:normal;padding:10px 15px;}
.div_title_userPage img {display:inline-block;position:absolute;top:0;right:0;height:100%;width:4px;opacity:0.8;}

.div_benefit_wrap {width:90%;margin:0 auto;padding:20px 0 10px;}
.div_benefit_wrap table {width:100%;margin:0 auto;}
.div_benefit_wrap table td {color:#000;font-size:14px;font-size:0.938rem;}
.div_benefit_wrap table td:nth-child(1) {width:20%;}
.div_benefit_wrap table td:nth-child(2) {width:75%;padding-left:5%;}
.div_benefit_wrap table td:nth-child(1) p {border-right:1px solid #000;padding:4px 0;}


/* .ul_userPage_stamp {width:100%;overflow:auto;padding:25px 0;} */
.ul_userPage_stamp {width:100%;overflow:auto;padding:5px 0;}
.ul_userPage_stamp li {width:16%;float:left;margin:0 2%;position:relative; float:none; display: inline-block;}
.img_coupon_mark {position:absolute;bottom:2%;width:80%;left:20%;}


.div_userPage_coupon_wrap {width:90%;margin:0 auto;margin-top:10px;}
.div_userPage_coupon_top {width:100%;overflow:auto;padding:5px 0;}
/* .div_userPage_coupon_top span {font-size:13px;font-size:0.85rem;color:#0e4733;padding-bottom:2px;border-bottom:1px solid #000;} */
.div_userPage_coupon_top span {font-size:13px;font-size:0.85rem;color:#000;padding-bottom:2px;border-bottom:1px solid #000;}
.div_userPage_coupon_top span:nth-child(1) {float:left;}
.div_userPage_coupon_top span:nth-child(2) {float:right;}

.ul_coupon_list {width:100%;padding:10px 0; margin-bottom:20px;}
.ul_coupon_list li {width:100%;margin-bottom:7px;background-image:url(../images/img_silhouette.png);background-size:30% auto;background-position:98% 70%;background-repeat:no-repeat;background-color:#fff;}

.table_coupon_inner {color:#000;width:100%}
.table_coupon_inner tr {border:1px solid #333;}
.table_coupon_inner td {margin-bottom:10px;font-size:13px;font-size:0.85rem;color:#000;}
.table_coupon_inner td:nth-child(1){width:32%;}
.table_coupon_inner td:nth-child(1) .img_full {width:80%;margin:10%;border:1px solid #efefef;}
.table_coupon_inner td:nth-child(2){width:68%}
.table_coupon_inner td:nth-child(2) p {width:90%;margin:0 auto;padding:1px 0;}
.table_coupon_inner td:nth-child(2) p:first-child{font-size:14px;font-size:0.938rem;font-weight:bold;word-break: break-word;}


.img_pop_close {display:block;width:7%;margin:0 auto;padding-bottom:10px;}
.div_popup_coupon {width:80%;margin:0 auto;}
.div_popup_coupon >.img_full:last-child {margin-top:-1px;}
/* .div_coupon_inner {background-color:#0e4733;padding:30px 0;text-align:left;background-image:url(../images/img_pop_silhouette.png);background-size:50% auto;background-position:110% 15%;background-repeat:no-repeat;margin-top:-1px;} */
.div_coupon_inner {background-color:#fff;padding:30px 0;text-align:left;background-size:50% auto;background-position:110% 15%;background-repeat:no-repeat;margin-top:-1px;}

/* .div_coupon_title {color:#fff;font-weight:normal;position:relative;padding:10px 0 15px;} */
.div_coupon_title {color:#000;font-weight:normal;position:relative;padding:10px 0 15px;}
.div_coupon_title:before {position:absolute;top:0;left:0;width:30px;height:3px;background-color:#fff;content:"";}
.div_coupon_title span{font-size:16px;font-size:1rem;padding:10px 0;}
.div_coupon_title p{font-size:22px;font-size:1.34rem;padding-top:10px;word-break: break-word;}


.div_coupon_item {padding:10px 0 20px;width:100%;}
/* .table_coupon_info {width:100%;color:#fff;font-size:15px;font-size:0.9rem;} */
.table_coupon_info {width:100%;color:#000;font-size:15px;font-size:0.9rem;word-break: break-word;}
.table_coupon_info td{padding:2px 0;}
.table_coupon_info td:nth-child(1){white-space:nowrap;width:30%;padding-right:20px;}

.p_coupon_bottom {font-size:20px;font-size:1.125rem;font-style:italic;color:#f26b24;text-align:center;padding-top:20px;}

.img_coupon_used {position:absolute;top:50%;right:14%;width:43%;}

.ul_coupon_list.user_voucher li {background-size:27% auto;background-position:97% 70%;}
.ul_coupon_list.user_voucher .table_coupon_inner tr {border:2px solid #ffecaf;}
.ul_coupon_list.user_voucher .table_coupon_inner td {font-size:14px;font-size:0.9rem;color:#0e4733;}
.span_count_voucher {display:inline-block;width:24px;height:24px;border-radius:100%;background-color:#f26b24;color:#fff;
    text-align:center;line-height:24px;margin-right:12px;-webkit-box-shadow:1px 1px 1px rgba(0,0,0,0.3);-mox-box-shadow:1px 1px 1px rgba(0,0,0,0.3);box-shadow:1px 1px 1px rgba(0,0,0,0.3)}

.p_notice_vcenter {color:#0e4733;text-align:center;width:90%;margin:0 auto;}


/* user_voucher_detail.html */
.div_userPage_banner_wrap {width:100%;position:relative;}
.div_voucherDetail_titleWrap {position:absolute;bottom:0;left:0;width:100%;}
.div_voucherDetail_titleWrap .img_full {opacity:0.8;}
.div_voucherDetail_title {padding:10px 0 15px;background-color:rgba(14,71,51,0.8);}
.div_voucherDetail_title h3 {width:90%;margin:0 auto;color:#fff;font-weight:normal;}
.div_voucherDetail_title p {width:90%;margin:0 auto;color:#fff;font-size:14px;font-size:0.875rem;padding-top:2px;}
.div_voucherDetail_title p:last-child {color:#f26b24;}

.img_couponUsed_voucher {position:absolute;top:46%;right:10%;width:42%;}

.div_voucherDetail_section {padding:30px 0;border-top:1px solid #0e4733;border-bottom:1px solid #0e4733;background-color:#fff;color:#0e4733;}
.div_voucherDetail_section.top {padding-bottom:0;background-color:transparent;}

.p_voucher_serial {background-color:#0e4733;color:#fff;text-align:center;width:100%;padding:12px 0;margin-bottom:5px;-webkit-box-shadow:1.25px 1.25px 3px rgba(0,0,0,0.3);-mox-box-shadow:1.25px 1.25px 3px rgba(0,0,0,0.3);box-shadow:1.25px 1.25px 3px rgba(0,0,0,0.3)}
.p_voucher_serial.used {opacity:0.5;}
.div_notice_stamp {width:100%;text-align:center;}
.div_notice_stamp img {width:24%;display:inline-block;vertical-align:middle;}
.div_notice_stamp span {display:inline-block;vertical-align:middle;font-size:12px;font-size:0.78rem;letter-spacing:-1px;text-align:left;padding-right:5px;line-height:1.3;}

.div_voucherDetail_section.text_content h3 {font-size:16px;font-size:1rem;padding-bottom:4px;}
.div_voucherDetail_section.text_content h4{font-weight:normal;font-size:14px;font-size:0.85rem;padding-bottom:4px;padding-top:12px;}
.div_voucherDetail_section.text_content p{font-size:13px;font-size:0.813rem;padding-bottom:4px;}


.popup_content_select {width:60%;margin:0 auto;background-color:#f7f1da;text-align:left;}

.p_content_selectTitle {text-align:center;font-weight:bold;font-size:16px;font-size:1rem;padding:20px 0;border-bottom:1px solid #0e4733;}

.div_check_boxWrap {width:70%;margin:0 auto;padding:20px 0;}
.div_check_box {width:100%;}
.input_radio {position:absolute;width:0;height:0;opacity:0;overflow:hidden;display:inline-block;}
.label_radio {display:inline-block;background-image:url(../images/img_check_off.png);background-size:24px 24px;background-position:left top;background-repeat:no-repeat;position:relative;line-height:1.2;margin-bottom:8px;}
.label_radio img {display:inline-block;vertical-align:middle;width:24px;height:24px;opacity:0;visibility:hidden;}
.label_radio span {display:inline-block;vertical-align:middle;line-height:1.2;font-size:14px;font-size:0.875rem;padding-left:10px;padding-top:1px;}
.input_radio:checked + .label_radio img {opacity:1;visibility:visible;}

/* .div_btn_onsize {width:100%;padding:17px 0;text-align:center;color:#fff;font-size:13px;font-size:0.85rem;background-color:#0e4733;} */
.div_btn_onsize {width:100%;padding:17px 0;text-align:center;color:#000;font-size:13px;font-size:0.85rem;background-color:#fbb901;}

/* .popup_content_default {width:70%;margin:0 auto;background-color:#f7f1da;} */
.popup_content_default {width:70%;margin:0 auto;background-color:#fff;}
.div_content_default {padding:50px 0;font-size:13px;font-size:0.85rem;}
.div_content_default p {width:90%;margin:0 auto;}


/*161207 추가*/
.popup_content_default.type2 {width:80%;}
.div_wrap_type2 {text-align:left;padding:20px 0;width:82%;margin:0 auto;}
/* .h3_popup_tit {color:#0e4733;font-size:0.938rem;padding:15px 0;} */
.h3_popup_tit {color:#000;font-size:0.938rem;padding:15px 0;}
/* .p_popup_txt {font-size:0.85rem;color:#0e4733;padding-bottom:15px;} */
.p_popup_txt {font-size:0.85rem;color:#000;padding-bottom:15px;}
.input_div {width:100%;padding:10px 0;background-color:#fff;border:1px solid #e1e1e1;margin-bottom:10px;}
.input_div input {font-size:0.85rem;outline:0;border:0;display:block;width:96%;margin:0 auto;}

/* media query */
@media only screen and (max-width: 359px){
    html{font-size:15px}
}
@media only screen and (min-width: 360px) and (max-width: 374px){
    html{font-size:16px}
}
@media only screen and (min-width: 375px) and (max-width: 413px){
    html{font-size:17px}
}
@media only screen and (min-width: 414px) and (max-width: 767px){
    html{font-size:18px}
}
@media only screen and (min-width: 768px){
    html{font-size:19px}
}

/* opview3 */
@media only screen and (min-width: 480px) and (max-width: 480px) and (min-height: 615px) and (max-height: 615px){
    
}



/* add css */
/* Layer Popup */
.popupArea {z-index:200;position:absolute;left:0;top:0;width:100%;height:100%;}
.popup {z-index:210;position:absolute;left:50%;top:50%;width:86%;margin-left:-43%;background-color:#eaeaea;}
.popupCon {padding:30px 20px 70px 20px;font-size:18px;color:#556078;text-align:center;line-height:1.4em;}
.popupCon p {margin:10px 0;color:#6e6d73;}
.popupCon .popSubCont {font-size:15px;color:#6e6d73;line-height:18px;}
.popupBtn {position:absolute;left:0;bottom:0;width:100%;text-align:center;font-size:0;border-top:solid 1px #dbdbdb;}
.popupBtn a {padding:15px 0;font-size:16px;color:#6e6d73;display:block;}
.popupBtn .full {width:100%;}
.popupBtn .half {width:49%;display:inline-block;}
.popupBtn .half a {padding:15px 0;font-size:16px;display:block;}
.popupBtn .half:last-child a {border-left:solid 1px #dbdbdb;}

/* Layer Coupon Detail Pop */
.coupon_detail_area {z-index:200;position:absolute;left:0;top:0;width:100%;height:100%;}
.coupon_detail_pop {z-index:210;position:absolute;left:50%;top:50px;width:87%;margin-left:-44%;background-color:#ffffff;}
/*연석*/
table.coupon_detail_cont {width:225px;}
table.coupon_detail_cont tr td {line-height:20px;}
table.coupon_detail_cont tr td.item_title {width:100px; vertical-align: top;}

.font12 {font-size:12px;}
.font15 {font-size:15px;}
.font17 {font-size:17px;}
.font20 {font-size:20px;}
.font23 {font-size:23px;}
.font25 {font-size:25px;}
.font27 {font-size:27px;}
.fontStyle1 {color:rgba(14,71,51,0.8);}
.fontStyle2 {color:#6e6d73;}
.fontStyle3 {color:#bbbcbe;}
.fontStyle4 {color:#6d6c71;}
.fontStyle5 {color:#00c4ae;}
.fontStyle6 {color:#6b4e3e;}
.fontStyle7 {color:#d33454;}
.fontStyle8 {color:#8e8f93;}
.font_style_black {color:#000000;}
.font_bold {font-weight:bold;}
.style_backcolor {background-color:#87624f;} /* BrandMain-bottom, Login */
.style_backcolor {background-color:#417792;} /* for japan */
.style2_backcolor {background-color:#eaeaea;} /* MemberJoin-body, EmailLogin-body, BrandDetail-body */
.white_backcolor {background-color:#ffffff;}
.item_style_backcolor {background-color:#6b4e3e;} /* BrandMain-countArea, */
.item_style_backcolor {background-color:#345f75;} /* BrandMain-countArea, For japan */

.style3_backcolor {background-color:#00c4ae;} /* Present Coupon */
.style4_backcolor {background-color:#dd5653;} /* Other Coupon */
.style5_backcolor {background-color:#9a8377;}

.dimmed {z-index:25;position:fixed;left:0;top:0;width:100%;height:100%;background-color:rgba(0,0,0,0.5);overflow:hidden;}

div.branch_group_area {
    width: 330px;
    margin-bottom: 5px;
}

table.coupon_guide_table {
    width: 330px;
    margin-top: 30px;
    margin-bottom: 15px;
}
.coupon_guide_table td:first-child {
    min-width: 80px;
}

.popupCon2 {
    padding: 20px 0px 40px 0px;
    font-size: 18px;
    color: #556078;
    text-align: center;
    line-height: 1.4em;
}

.popupCon2 p {
    margin: 5px 0;
    color: #6e6d73;
}

.popupCon2 .popSubCont {
    font-size: 15px;
    color: #6e6d73;
    line-height: 18px;
}

td.pop_list_title {
    min-width:100px;
    text-align: left;
    width: 50%;
    color: #262626;
    font-size: 15px;
}

td.pop_list_cont {
    text-align: left;
    color: #6e6d72;
    font-size: 15px;
}

#stampListTable tr:first-child {
    border-bottom: 1px solid #c9c9c9;
}

#stampListTable tr td {
    padding: 7px 0;
    color: #6e6d72;
    word-break: break-word;
}

#popup_common {
    z-index:9999999;
}
/***************************************************/
/* 171030 추가 css */
/***************************************************/

.gi_container { width: 100%; height: 100%; background-color: #000; position:fixed; top:0; left:0; overflow-y:auto;}
body { font-family: 'Oswald-Regular', sans-serif; }
@font-face {
  font-family: 'Oswald-Regular';
  src: url('../fonts/oswald/Oswald-Regular.eot');
  src: url('../fonts/oswald/Oswald-Regular.woff2') format('woff2'),
       url('../fonts/oswald/Oswald-Regular.woff') format('woff'),
       url('../fonts/oswald/Oswald-Regular.eot?#iefix') format('embedded-opentype');
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: 'NotoSerif-Regular';
  src: url('../fonts/noto-serif/NotoSerif-Regular.eot');
  src: url('../fonts/noto-serif/NotoSerif-Regular.woff2') format('woff2'),
       url('../fonts/noto-serif/NotoSerif-Regular.eot?#iefix') format('embedded-opentype');
  font-weight: normal;
  font-style: normal;
}

.container_wrap { width: 100%; padding-bottom: 5%; background-color: #000; }
.header_logo { width: 90%; margin: 0 auto; padding: 10px 0; }
.title_logo { width: 100%; }
.content_wrap { width: 90%; margin: 0 auto; padding: 15px 0; background-color: #FFF; }
.button { width: 90%; margin:0% auto; margin-top: 5%; padding: 10px 0; border-radius: 20px;
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffee00', endColorstr='#f9b033', GradientType=1 ); }
.button_text { display: inline-block; width: 100%; line-height: 1; text-align: center; font-size: 1.5rem; font-weight: bold; }

.benefit { position: static; }
.benefit .character_img { display: block; width: 30%; margin: 0 auto; }
.benefit .title { display: block; width: 80%; margin: 0 auto; margin-top: -50px; }
.benefit .circle_bg { width: 100%; height: 250px; margin-top: -5%; position: relative; display: table;
                background-image: url(../images/background_circle.png);
                background-repeat: no-repeat; background-size: contain; background-position: center center; }
.benefit .circle_inner_text { width: 100%; display: table-cell; vertical-align: middle;
                        text-align: center; font-size: 1.15rem; color: #FFDE00; font-weight: bold;
                        text-shadow: 1px 1px 3px rgba(0,0,0,0.5); }
.benefit .list_wrap { width: 95%; margin: 0 auto; }
.benefit .list { width: 100%; }
.benefit .number { display: inline-block; width: 5%; vertical-align: top; }
.benefit .list_content { display: inline-block; width: 95%; vertical-align: top; }
.benefit .number, .benefit .list_content { font-size: 0.95rem; font-weight: bold; }

.coupon_inner { padding-bottom: 20px; }
.coupon .sub_text { width: 100%; text-align: center; font-weight: bold; font-size: 1rem; }
.coupon .main_text { display: block; width: 100%; margin: 3% 0; text-align: center; color: #FFDE00;
                font-size: 1.5rem; font-weight: bold; line-height: 1.7rem; text-shadow: 1px 1px 3px rgba(0,0,0,0.5); }
.coupon .coupon_area { width: 100%; height: 100%; margin-top: 10%; }
.coupon .coupon_img { display: block; width: 85%; margin:0 auto; }
.coupon .shadow_img { width: 100%; }
.coupon .coupon_explanation { width: 90%; margin: 0 auto; margin-top: 10%; border-radius: 30px; padding: 10px 20px; }
.coupon .coupon_inner_text { width: 100%; text-align: center; font-size: 1rem; font-weight: bold; }
.button, .coupon .coupon_explanation {
            background: -moz-linear-gradient(left, rgba(255,238,0,1) 0%, rgba(249,176,51,1) 100%);
            background: -webkit-gradient(left top, right top, color-stop(0%, rgba(255,238,0,1)), color-stop(100%, rgba(249,176,51,1)));
            background: -webkit-linear-gradient(left, rgba(255,238,0,1) 0%, rgba(249,176,51,1) 100%);
            background: -o-linear-gradient(left, rgba(255,238,0,1) 0%, rgba(249,176,51,1) 100%);
            background: -ms-linear-gradient(left, rgba(255,238,0,1) 0%, rgba(249,176,51,1) 100%);
            background: linear-gradient(to right, rgba(255,238,0,1) 0%, rgba(249,176,51,1) 100%);
}
.eventpage_btn { width: 90%; margin: 0 auto; margin-top: 5%; }
.eventpage_btn_inner { height: 40px; line-height: 40px; text-align: center; border: 1px solid #ffde00; border-radius: 20px; }
.eventpage_btn_inner > p { display: inline-block; line-height: 1; font-family: sans-serif; font-size: 1.5rem; text-align: center; color: #ffde00; }
.stamping_img { position: absolute; top: 45%; right: 10%; }

.roulette .container_upper { width: 100%; }
.roulette .roulette_wrap { position: relative; }
.roulette .r_text { width: 100%; margin-bottom: 2%; text-align: center; line-height: 1.5rem;
            font-family: NotoSerif-Regular; font-size: 1.3rem; color: #FFF; }
.roulette .r_text_box { width: 20%; position: absolute; top: 2%; right: 15%; }
.roulette .roulette_area { position: relative; top: -10px; }
.roulette .r_button { width: 120px; height: 120px; margin-top: -60px; margin-left: -60px;
                position: absolute; top: 50%; left: 50%; }
.roulette .r_row_text { width: 100%; text-align: center; color: #FFF; font-size: 1.3rem; line-height: 1.5rem; font-weight: bold; }
.roulette strong { color: #FFDE00; }
.roulette .r_character { display: block; width: 30%; margin: 0 auto; }
.roulette .roulette_img { display: block; width: 85%; margin: 0 auto;}
.roulette .roulette_img.start { -webkit-animation:rotate 1.5s linear infinite;
                            -moz-animation:rotate 1.5s linear infinite;
                            -ms-animation:rotate 1.5s linear infinite;
                            -o-animation:rotate 1.5s linear infinite;
                            animation:rotate 1.5s linear infinite; }
.roulette .roulette_img.stop {
                -webkit-animation:stopRotate 2s ease-out;
                -moz-animation:stopRotate 2s ease-out;
                -ms-animation:stopRotate 2s ease-out;
                -o-animation:stopRotate 2s ease-out;
                animation:stopRotate 2s ease-out;
                -webkit-animation-fill-mode: forwards;
                -moz-animation-fill-mode: forwards;
                -ms-animation-fill-mode: forwards;
                -o-animation-fill-mode: forwards;
                animation-fill-mode: forwards; }

/* roulette animation */
@-webkit-keyframes rotate {
    from{-webkit-transform:rotate(0deg)}
    to{-webkit-transform:rotate(-720deg)}
}
@-moz-keyframes rotate {
    from{-moz-transform:rotate(0deg)}
    to{-moz-transform:rotate(-720deg)}
}
@-ms-keyframes rotate {
    from{-ms-transform:rotate(0deg)}
    to{-ms-transform:rotate(-720deg)}
}
@-o-keyframes rotate {
    from{-o-transform:rotate(0deg)}
    to{-o-transform:rotate(-720deg)}
}
@keyframes rotate {
    from{transform:rotate(0deg)}
    to{transform:rotate(-720deg)}
}
/* 룰렛이 서서히 멈출때 */
@-webkit-keyframes stopRotate {
  from {-webkit-transform:rotate(-180deg)}
  to   {-webkit-transform:rotate(-720deg)}
}
@-moz-keyframes stopRotate {
  from {-moz-transform:rotate(-180deg)}
  to   {-moz-transform:rotate(-720deg)}
}
@-ms-keyframes stopRotate {
  from {-ms-transform:rotate(-180deg)}
  to   {-ms-transform:rotate(-720deg)}
}
@-o-keyframes stopRotate {
  from {-o-transform:rotate(-180deg)}
  to   {-o-transform:rotate(-720deg)}
}
@keyframes stopRotate {
  from {transform:rotate(-180deg)}
  to   {transform:rotate(-720deg)}
}