@charset "utf-8";

/* Selection */
::-moz-selection { /* Code for Firefox */
    color: #fff;
    background: #228A4A;
}

::selection {
    color: #fff;
    background: #228A4A;
}

/* Default */
html { background-color: #f1f2f6; }
body, html {width:100%;height:100%;max-width: 480px;margin:0 auto;}
#wrap {position:relative;min-width:340px;height:auto; min-height: 100%; margin:0 auto;  background-color: #ffffff; box-shadow: 0px 4px 12px rgba(200, 203, 222, 0.89); }
.m_only, m-only { display: none !important; }
.pc_only { display: inline-block; }
.t_only { display: none !important; }
.hide { display: none !important; }
.mt0 { margin-top: 0px !important; }
.mt10 { margin-top: 10px !important; }
.mt17 { margin-top: 17px !important; }
.mt20 { margin-top: 20px !important; }
.mt30 { margin-top: 30px !important; }
.mt40 { margin-top: 40px !important; }
.mt50 { margin-top: 50px !important; }
.mt60 { margin-top: 60px !important; }
.mt70 { margin-top: 70px !important; }
.mt80 { margin-top: 80px !important; }
.mt90 { margin-top: 90px !important; }

.mb0 { margin-bottom: 0px !important; }
.mb10 { margin-bottom: 10px !important; }
.mb20 { margin-bottom: 20px !important; }
.mb30 { margin-bottom: 30px !important; }
.mb40 { margin-bottom: 40px !important; }
.mb50 { margin-bottom: 50px !important; }
.mb60 { margin-bottom: 60px !important; }
.mb70 { margin-bottom: 70px !important; }
.mb80 { margin-bottom: 80px !important; }
.mb90 { margin-bottom: 90px !important; }

.pt12 { padding-top: 12px !important; }
.pt16 { padding-top: 16px !important; }
.pt24 { padding-top: 24px !important; }
.pb0 { padding-bottom: 0 !important; }
.pb60 { padding-bottom: 60px !important; }

.scrollOff{position:fixed;overflow:hidden;height:100%;}

.ex_pop_open{ width: 100%; font-size: 12px; font-weight: 400; color: #bbb; line-height: 30px; background: #f1f1f1; border-radius: 10px; margin: 10px 0; }

.dim { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0,0,0,0.8); z-index: 400; transition: all 0.5s; opacity: 0; display: none; }
.dim.on { opacity: 1; display: inline-block; }

.inner_basic{ padding: 92px 24px 24px; }
.flex{ display: flex; align-items: center; }
.flex.flex_between{ justify-content: space-between; }
.flex.flex_center{ justify-content: center; }

/* input */
.input_box { position: relative; width: 100%; height: 56px; z-index: 0; }
.input_box.type_text input + label { position: absolute; left: 0; top: 0; width: 100%; height: 100%; background-color: #ffffff; border: 1px solid #D0D0D0; border-radius: 12px; letter-spacing: 0.75px; box-sizing: border-box; font-size: 15px; padding: 18px 24px; color: #6e7191; font-weight: normal; transition: padding-top linear 0.2s, font-size linear 0.2s, background-color linear 0.2s; }
.input_box.type_text input { position: absolute; z-index: 1; background-color: #ffffff; left: 24px; font-size: 15px; color: #222222; height: 20px; width: calc(100% - 48px); transition: background-color linear 0.2s, top linear 0.2s, opacity linear 0.2s; bottom: 2px; opacity: 0; font-weight: normal; }

.input_box.type_text.type_btn input { width: calc(100% - 124px); }
.input_box.type_text.type_btn .btn { opacity:1; position: absolute; display: inline-block; width: 92px; height: 40px; line-height: 40px; background-color: #2aad5c; border-radius: 8px; font-weight: normal; font-size: 12px; color: #ffffff; right: 8px; top: 50%; transform: translateY(-50%); z-index: 2; left: inherit; }
.input_box.type_text.type_btn .btn.disabled,
.input_box.type_text.type_btn .btn:disabled { background-color: #d0d0d0; opacity: 1; bottom: inherit; }
.input_box.type_text.type_btn.type_btn_hide .btn { display: none; }

.input_box.label_hide { height: 64px; }
.input_box.label_hide input[type="text"] { border: 1px solid #d0d0d0; border-radius: 12px; width: 100%; height: 64px; line-height: 64px; padding: 0 24px; font-weight: 400; font-size: 15px; }
.input_box.label_hide input[type="text"]:focus { border: 1px solid #2aad5c; }
.input_box.label_hide input[type="text"]::placeholder { color: rgba(110, 113, 145, 0.47); }

.input_list .out_btn_area { display: flex;  justify-content: space-between; flex-wrap: wrap; position: relative; }
.input_list .out_btn_area .input_box { width: calc(100% - 148px); display: inline-block; }
.input_list .out_btn_area .input_box + .btn { width: 140px; height: 56px; background-color: #2aad5c; border-radius: 12px; font-weight: 700; font-size: 15px; line-height: 56px; letter-spacing: 0.75px; color: #ffffff; }
.input_list textarea { width: 100%; min-height: 120px; background-color: #ffffff; border-radius: 12px; border: 0; padding: 16px 24px; font-weight: 400; font-size: 15px; line-height: 24px; letter-spacing: 0.75px; box-sizing: border-box; border: 1px solid #d0d0d0; }
.input_list textarea::placeholder { color: #6e7191; }
.input_list textarea:focus { background-color: #ffffff; border: 1px solid #2aad5c;  }

.input_box.type_text.type_bg label { background: #EFF0F6; border: 1px solid #EFF0F6; }

.input_box.type_text.type_btn.type_btn_hide input.focus + label + .btn,
.input_box.type_text.type_btn.type_btn_hide input:focus + label + .btn,
.input_box.type_text.type_btn.type_btn_hide input.valid + label + .btn,
.input_box.type_text.type_btn.type_btn_hide input:valid + label + .btn { display: inline-block;}

.input_box.type_text.type_btn.type_timer input[type=text], .input_box.type_text.type_btn.type_timer input[type=password] { width: calc(100% - 174px); }

.input_box.type_text.type_btn.type_timer .input_time { display: inline-block; position: absolute; font-size: 14px; right: 108px; top: 50%; transform: translateY(-50%); font-weight: 400; color: #2aad5c; font-size: 15px; line-height: 24px; z-index: 2; }

.input_box.type_text input.valid { background-color: #ffffff; top: 25px; opacity: 1; }
.input_box.type_text input.valid + label { padding-top: 8px; font-size: 12px; background-color: #ffffff;  }

.input_box.type_text input.focus,
.input_box.type_text input:focus { background-color: #ffffff; top: 25px; opacity: 1; }
.input_box.type_text input.focus + label,
.input_box.type_text input:focus + label { padding-top: 8px; background-color: #ffffff; border: 1px solid #2aad5c; font-size: 12px; }

.input_box.type_text.error input { background-color: #ffffff; top: 25px; opacity: 1; }
.input_box.type_text.error input + label { background-color: #ffffff; border: 1px solid #FB5058; color: #fb5058; padding-top: 8px; font-size: 12px; }

.input_box.type_text input:read-only { background-color: #ffffff; }
.input_box.type_text input:read-only + label { background-color: #ffffff; border: 1px solid #eff0f6; cursor: auto; }
.input_box.type_text.error input:read-only + label { border: 1px solid #fb5058; }

.input_box.type_text input:read-only {  top: 25px; opacity: 0.8; background-color: #f3f3f3;}
.input_box.type_text input:read-only + label { padding-top: 8px; font-size: 12px; background-color: #f3f3f3; }

.input_box + .inputbox_error_msg { margin-top: 0px; overflow: hidden; height: 0px; font-weight: 400; font-size: 13px; line-height: 20px; color: #fb5058; transition: all 0.5s; padding-left: 8px; }
.input_box.error + .inputbox_error_msg { margin-top: 4px; height: 20px; }

.input_box.type_num01 { position: relative; }
.input_box.type_num01 label { display: inline-block; position: absolute; }
.input_box.type_num01 .label01 { width: 100%; height: 56px; background-color: #ffffff; border-radius: 12px;  left: 0; top: 0; line-height: 56px; padding-left: 24px; color: #6e7191; font-weight: normal; font-size: 15px; transition: all 0.2s; border: 1px solid #eff0f6; }
.input_box.type_num01 .label02 { width: 50%; height: 56px; right: 0; top: 0;  }
.input_box.type_num01.type_only02 .label02 { width: 100%; z-index: 1; }
.input_box.type_num01 .input01 { position: absolute; z-index: 1; background-color: #ffffff; left: 24px; font-size: 15px; color: #222222; height: 20px; width: calc(50% - 24px); transition: background-color linear 0.2s, top linear 0.2s, opacity linear 0.2s, background-color 0.2s; bottom: 2px; opacity: 0; font-weight: normal; }
.input_box.type_num01 .input02 { position: absolute; z-index: 1; background-color: #ffffff; left: 184px; font-size: 15px; color: #222222; height: 20px; width: calc(50% - 36px); transition: background-color linear 0.2s, top linear 0.2s, opacity linear 0.2s, background-color 0.2s; top: 25px; opacity: 1; font-weight: normal; }

.input_box.type_num01.valid .input01, 
.input_box.type_num01 .input01:valid { background-color: #ffffff; top: 25px; opacity: 1; }
.input_box.type_num01.focus .input01, 
.input_box.type_num01 .input01:focus { background-color: #ffffff; top: 25px; opacity: 1; width: 50%; }
.input_box.type_num01.focus .input02, 
.input_box.type_num01 .input02:focus { background-color: #ffffff; }
.input_box.type_num01.focus .input01 + label, 
.input_box.type_num01 .input01:focus + label { border: 1px solid #2aad5c; background-color: #ffffff; }

.input_box.type_num01.valid .input01 + label, 
.input_box.type_num01 .input01:valid + label,
.input_box.type_num01.focus .input01 + label, 
.input_box.type_num01 .input01:focus + label { line-height: 27px;font-size: 13px; color: #6e7191; }
.input_box.type_num01 .division { position: absolute; left: 153px; top: 27px; font-weight: 400; font-synthesis: 15px; line-height: 24px; color: #14142b; z-index: 2; }

.input_box.type_num01.error .input01 + label { line-height: 27px;font-size: 13px; color: #6e7191; background-color: #ffffff; border: 1px solid #FB5058; }
.input_box.type_num01.error .input01,
.input_box.type_num01.error .input02 { background-color: #ffffff; }

.input_box.type_text.type_search { height: 52px; }
.input_box.type_text.type_search input[type="text"] { background-color: #ffffff; width: 100%; background-color: #ffffff; border: 1px solid #d0d0d0; border-radius: 46px; opacity: 1; position: static; height: 100%; padding: 0 48px 0 24px; line-height: 50px; }
.input_box.type_text.type_search input[type="text"]:focus { border: 1px solid #2aad5c; }

.input_box.type_text.type_search input[type="text"]:focus,
.input_box.type_text.type_search input[type="text"]:valid { top: 32px; }
.input_box.type_text.type_search input[type="text"]::placeholder { color: #6e7191; }

.input_box.type_text.type_search .search_btn { position: absolute; z-index: 2; right: 0px; top: 50%; transform: translateY(-50%); display: inline-block; width: 48px; height: 24px; background-image: url(../image/common/icon_search01.svg); background-repeat: no-repeat; background-position: center left; text-indent: -99999px; overflow: hidden; height: 100%; border-radius: 0 46px 46px 0; }

.input_box.type_text.type_unit input { width: calc(100% - 112px); }
.input_box.type_text.type_unit .unit { position: absolute; right: 24px; top: 50%; transform: translateY(-50%); font-weight: 700; font-size: 15px; line-height: 24px; color: #6e7191; }

/* Input List */
.input_list li { margin-top: 12px; }
.input_list li:first-of-type { margin-top: 0; }
.input_list .hide_area { height: 0; overflow: hidden; margin-top: 0; transition: all 0.5s; }
.input_list_title { display: block; font-weight: 400; font-size: 14px; line-height: 24px; color: #888888;}
.input_list_title + .input_list { margin-top: 8px; }
.input_list + .input_list_title { margin-top: 32px; } 
.input_list .hide_area.show { height: 56px; margin-top: 12px; }

.input_list .input_chk_area input { display: none; }
.input_list .input_chk_area input[type="radio"] + label { display: inline-block; padding-left: 26px; font-weight: 700; font-size: 15px; line-height: 24px; color: #d0d0d0; position: relative; margin-right: 32px; }


.input_list .error_msg_area { height: 0; overflow: hidden; transition: height 0.5s, margin-top 0.5s; margin-top: 0; padding-left: 8px; }
.input_list .error_msg_area.active { height: 20px; margin-top: 4px; }
.input_list .error_msg_area .msg_text { display: inline-block; font-weight: 400; font-size: 13px; line-height: 20px; color: #FB5058; }
.input_list .error_msg_area .msg_text { padding: 0; margin: 0; }

.input_list .input_chk_area.type_vertical input[type="radio"] + label { display: block; margin-bottom: 12px; margin-right: 0; }
.input_list .input_chk_area.type_vertical input[type="radio"] + label:last-of-type { margin-bottom: 0; }
.input_list .input_chk_area input[type="radio"] + label::before { content: ""; display: inline-block; width: 16px; height: 16px; position: absolute; left: 0; top: 50%; transform: translateY(-50%); background-color: #d0d0d0; border-radius: 50%; border: 4px solid #d0d0d0; box-sizing: border-box; }
.input_list .input_chk_area input[type="radio"]:checked + label { color: #2aad5c; }
.input_list .input_chk_area input[type="radio"]:checked + label::before { background-color: #ffffff; border: 4px solid #2aad5c; }

.input_list li.list_btn_area { flex-wrap: wrap;  }
.input_list li.list_btn_area .inputbox_error_msg { width: 100%; }

.input_list li.list_btn_area .input_box + .btn + .inputbox_error_msg { margin-top: 0px; overflow: hidden; height: 0px; font-weight: 400; font-size: 13px; line-height: 20px; color: #fb5058; transition: all 0.5s; padding-left: 8px; }
.input_list li.list_btn_area .input_box.error + .btn + .inputbox_error_msg { margin-top: 4px; height: 20px; }

.chk_area + .chk_view_text + .chkbox_error_msg { margin-top: 0px; overflow: hidden; height: 0px; font-weight: 400; font-size: 13px; line-height: 20px; color: #fb5058; transition: all 0.5s; padding-left: 8px; }
.chk_area.error + .chk_view_text + .chkbox_error_msg { margin-top: 4px; height: 20px; }

.all_chk_area .chkbox_error_msg { margin-top: 0px; overflow: hidden; height: 0px; font-weight: 400; font-size: 13px; line-height: 20px; color: #fb5058; transition: all 0.5s; padding-left: 0; }
.all_chk_area.error .chkbox_error_msg { margin-top: 4px; height: 20px; }

/* Select_box */
.select_box { width: 100%; }
.select_box select { width: 100%; height: 56px; line-height: 56px; background-color: #ffffff; border: 1px solid #d0d0d0; border-radius: 12px; padding: 0 36px 0 24px; font-weight: 400; font-size: 15px; color: #222222; background-image: url(../image/icon_arrow_select_black.svg); background-repeat: no-repeat; background-position: calc(100% - 12px) center;  }

.select_box .error_msg_area { height: 0; overflow: hidden; transition: height 0.5s, margin-top 0.5s; margin-top: 0; padding-left: 8px; }
.select_box.error .error_msg_area { height: 20px; margin-top: 4px; }
.select_box .error_msg_area .msg_text { display: inline-block; font-weight: 400; font-size: 13px; line-height: 20px; color: #FB5058; }


.select_box.error select { border: 1px solid #fb5058; }
.select_box.error select { border: 1px solid #fb5058; }

/* Textarea */
.textarea_wrap { background-color: #ffffff; border-radius: 12px; display: inline-block; height: 160px; padding: 14px 8px 36px 24px; width: 100%; border: 1px solid #d0d0d0; position: relative; }
.textarea_wrap.focus { background-color: #ffffff; border: 1px solid #2aad5c; }
.textarea_wrap.focus textarea { background-color: #ffffff; }

.textarea_wrap.readonly { background-color: #EFF0F6; border: 1px solid #EFF0F6; }
.textarea_wrap.readonly textarea { background-color: #EFF0F6; }

.textarea_wrap .text_count { position: absolute; right: 25px; bottom: 14px; font-weight: 400; font-size: 15px; line-height: 22px; color: #6e7191; }
.textarea_wrap .text_count .limit { color: #FB5058; }
.textarea_wrap .text_count .limit.off { color: #6e7191; }
.textarea_wrap.error { border: 1px solid #fb5058; background-color: #ffffff; }

.textarea_wrap + .textarea_error_msg { margin-top: 0px; overflow: hidden; height: 0px; font-weight: 400; font-size: 13px; line-height: 20px; color: #fb5058; transition: all 0.5s; padding-left: 8px; }
.textarea_wrap.error + .textarea_error_msg { margin-top: 4px; height: 20px; }

.textarea_wrap.error textarea { background-color: #ffffff; }
.textarea_wrap textarea::placeholder { color: rgba(110, 113, 145, 0.47); }


.textarea_wrap textarea { background-color: #ffffff; width: 100%; height: 110px; margin: 0; padding: 0 14px 0 0; border-radius: 0; border: 0; font-weight: 400; font-size: 15px; line-height: 22px; overflow-y: auto; overflow-x: hidden; }

.textarea_wrap textarea::-webkit-scrollbar { -webkit-appearance:none; }
.textarea_wrap textarea::-webkit-scrollbar:vertical { width: 2px; }
.textarea_wrap textarea::-webkit-scrollbar-thumb { background: rgba(34, 34, 34, 0.4); border-radius: 14px; }



/* jl */
.section01.jl h1 { margin-top: 175px;  } 
.section01.jl.none_logo h1 { margin-top: 183px; }
.section01.jl h1 p { font-weight: bold; font-size: 48px; line-height: 80px; }
.section01.jl h1 p img { height: 80px; margin-top: -5px; }
.section01.jl h1 strong { font-weight: bold; font-size: 48px; line-height: 72px; color: #2aad5c; }
.section01.jl h1 span { font-weight: 300; font-size: 32px; line-height: 32px; color: #888888; display: block; margin-top: 16px; }
header.coupon_header { height: 68px; }
header.coupon_header .header_wrap { width: 100%; display: flex; justify-content: flex-start; align-items: center; }
.coupon_section .section_wrap { width: 100%; padding: 128px 24px; text-align: left; }
.coupon_section .section_wrap img { margin-bottom: 4px; height: 40px; }
.coupon_section .section_wrap .input_area { margin-top: 56px; }
.coupon_section .section_wrap .sub_text span { font-weight: normal; font-size: 20px; line-height: 28px; display: block; }
.coupon_section .section_wrap .sub_text strong { font-weight: bold; font-size: 20px; line-height: 28px; display: block; }
.coupon_section .section_wrap .sub_text { margin-bottom: 16px; }
.coupon_section .section_wrap .bot_btn_area .kakao { background-color: #fee500; color: #222222; margin-bottom: 16px; }
.coupon_section .section_wrap .bot_btn_area .kakao i { display: inline-block; width: 24px; height: 24px; margin-right: 8px; background-image: url(../image/icon_kakao01.svg); background-repeat: no-repeat;  background-position: center center; vertical-align: middle; }
.coupon_section .section_wrap .bot_btn_area .sub_btn { font-weight: 700; font-size: 13px; line-height: 16px; text-decoration: underline; width: auto; height: auto; display: block; margin: 0 auto; background-color: transparent; color: #363636; letter-spacing: -0.02em; }
.coupon_section .title_area .title { font-weight: normal; font-size: 40px; line-height: 50px; color: #2e2e2e; display: block; }
.coupon_section .input_area input[type="text"]{ width: 100%; height: 56px; line-height: 56px; background-color: #eff0f6; border: 2px solid #eff0f6; padding: 0px 24px; border-radius: 12px; font-weight: normal; letter-spacing: 0.75px; font-size: 15px; color: #222222; box-sizing: border-box; }
.coupon_section .input_area input[type="text"]:focus { background-color: #ffffff; border: 2px solid #2aad5c;  }
.coupon_section .input_area input[type="text"]::placeholder { color: #6e7191; }
.coupon_section .input_area input[type="text"]:focus { background-color: #ffffff; border: 2px solid #2aad5c;  }
.coupon_section .bot_btn_area { margin-top: 72px; width: 100%; }
.coupon_section .bot_btn_area button[type="button"],
.coupon_section .bot_btn_area input[type="button"],
.coupon_section .bot_btn_area a,
.coupon_section .bot_btn_area input[type="submit"] { width: 100%; background-color: #2aad5c; color: #fcfcfc; height: 64px; line-height: 64px; border-radius: 12px; font-weight: bold; font-size: 15px; box-sizing: border-box; display: inline-block;  }
.coupon_section .bot_btn_area button[type="button"]:disabled,
.coupon_section .bot_btn_area a:disabled,
.coupon_section .bot_btn_area input[type="button"]:disabled,
.coupon_section .bot_btn_area input[type="submit"]:disabled { background-color: #d0d0d0 !important; border-color: #d0d0d0 !important; }

.coupon_section .section_wrap.banner_type { padding: 68px 0 0; }
.coupon_section .banner_area img { width: 100%; height: auto; margin-bottom: 0; image-rendering: -webkit-optimize-contrast; transform: translateZ(0); backface-visibility: hidden; }

.coupon_section .coupon_contents_area.type01 { padding: 40px 24px 120px; }
.coupon_section .coupon_contents_area.type01 .title { font-weight: 700; font-size: 24px; line-height: 29px; margin-bottom: 16px; display: block; }
.coupon_section .coupon_contents_area.type01 .bot_btn_area { margin-top: 24px; }
.coupon_section .coupon_contents_area.type01 + .footer { background-color: #f3f3f3; padding: 28px 24px 52px; }
.coupon_section .coupon_contents_area.type01 + .footer .title { font-weight: 500; font-size: 13px; line-height: 16px; color: #888888; }
.coupon_section .coupon_contents_area.type01 + .footer ul { margin-top: 8px; list-style: disc; color: #888888; padding-left: 20px; font-weight: 400; font-size: 11px; line-height: 17px; }

@media (max-width: 480px) {
    /* jl */
    .section01.jl h1 { margin-top: 138px; } 
    .section01.jl.none_logo h1 { margin-top: 186px; }
    .section01.jl h1 p { font-weight: 500; font-size: 26px; line-height: 40px; }
    .section01.jl h1 p img { height: 40px; display: table; margin: 0 auto 8px; }
    .section01.jl h1 strong { font-weight: bold; font-size: 26px; line-height: 40px; color: #2aad5c; }
    .section01.jl h1 span { font-weight: 300; font-size: 18px; line-height: 32px; color: #888888; margin-top: 0; }
    .coupon_section .section_wrap { width: 100%; padding: 144px 24px 0; }
    .coupon_section .section_wrap .bot_btn_area { width: 100%; }
    .coupon_section .section_wrap .bot_btn_area button[type="button"],
    .coupon_section .section_wrap .bot_btn_area input[type="button"],
    .coupon_section .section_wrap .bot_btn_area a,
    .coupon_section .section_wrap .bot_btn_area input[type="submit"] { height: 64px; line-height: 64px; font-size: 16px; margin-right: 0; }
    .coupon_section .section_wrap .bot_btn_area button[type="button"].sub_btn,
    .coupon_section .section_wrap .bot_btn_area input[type="button"].sub_btn,
    .coupon_section .section_wrap .bot_btn_area a.sub_btn,
    .coupon_section .section_wrap .bot_btn_area input[type="submit"].sub_btn { height: auto; font-weight: 500; font-size: 12px; line-height: 22px; margin-right: auto; }
    header.coupon_header .header_wrap { width: 100%; }
    
    .coupon_section .coupon_contents_area.type01 { padding: 40px 24px 96px; }
}

/* banner */
.browser_banner { width: 100%; position: relative; height: 0px; line-height: 0px; overflow: hidden; background-color: #6e7191; color: #ffffff; text-align: center; transition: all 0.5s; }
.browser_banner p { font-weight: normal; font-size: 14px; line-height: 40px; display: inline-block;  width: auto; margin-right: 48px; }
.browser_banner p span { font-weight: bold; }
.browser_banner .hide_btn { font-weight: normal; font-size: 12px; line-height: 40px; display: inline-block; padding-right: 24px; background-image: url(../image/icon_banner_close.svg); background-repeat: no-repeat; background-position: center right; background-color: #6e7191; color: #ffffff; }
.browser_banner.on { width: 100%; position: relative; top: 0; left: 0; height: 40px; line-height: 40px; }
.browser_banner.on + header { top: 0px; }
.browser_banner.on.hide + header { top: 0px; }

/* header */
header { width: 100%; height: auto; padding: 16px 24px; box-sizing: border-box; z-index: 2000;  top: 0; position: fixed; max-width: 480px; left: 50%; transform: translateX(-50%); transition: all 0.5s; background-color: #ffffff; z-index: 1000; border-bottom: 1px solid rgba(208,208,208,0.0); }
header.on,
header:hover { background-color: rgba(255,255,255,1); z-index: 2100; border-bottom: 1px solid rgba(208,208,208,0.8); }
header.login_header .header_wrap { width: 100%; }

header,
header:hover { background-color: rgba(255,255,255,1); border: 0; }
header.on,
header.on:hover { background-color: rgba(255,255,255,1); border-bottom: 0; }

header.login_header .header_wrap .exit_btn { display: inline-block; width: 24px; height: 24px; overflow: hidden; text-indent: -99999px; background-image: url(../image/icon_del01.svg); background-repeat: no-repeat; background-position: center center; background-size: 100%; position: absolute; right: 0; top: 50%; transform: translateY(-50%); }

header.bg_type_w { background-color: rgba(255,255,255,1); z-index: 1000; border-bottom: 1px solid rgba(208,208,208,0.8); }
header.sub_header { position: fixed; }
header.type_border { border-bottom: 1px solid #D9DBE9; }
header .header_wrap { width: 100%; margin: 0 auto; position: relative; height: 36px; }


header .logo { width: 112px; height: 100%; line-height: 1; display: inline-block; position: relative; }
header .logo a {display: inline-block; width: 100%; height: auto; position: absolute; top: 50%; transform: translateY(-50%); }
header .logo img { width: 100%; }

header .logo_ch{ display: flex; align-items: center; }
header .logo_ch a { display: inline-block; }
header .logo_ch .logo_care_health { width: 107px; }
header .logo_ch span { width: 16px; height: 16px; background: url(../image/logo_between.svg) no-repeat center center; background-size: 16px; display: inline-block; text-indent: -9999px; margin: 0 16px; }
header .logo_ch .logo_pilgram{ width: 97px; }

header nav { width: auto; height: auto; position: absolute; top: 0; left: 196px; }
header nav .depth_01 { height: 100%; width: auto; display: flex; flex-direction: column; justify-content: flex-start; align-items: flex-start; }
header nav .depth_01 > li { display: inline-block; position: relative; padding: 0px; height: auto; line-height: inherit; font-size: 16px; color: #888888; width: auto; margin: 0; }
header nav .depth_01 > li:first-child { padding-left: 0; }
header nav .depth_01 > li > a { display: block; font-size: 16px; font-weight: 500; color: #363636; width: 100%; height: 56px; line-height: 56px; position: relative; top: 0; transform: none; text-align: left; padding: 0 16px; }
header nav .depth_01 li a.on,
header nav .depth_01 li a:hover,
header nav .depth_01 .dep02_title:hover { color: #2aad5c; border-bottom: 2px solid #2aad5c; }

header nav .depth_01 .go_service_btn.active { color: #2aad5c; }
header nav .depth_01 .go_service_btn:hover { border-bottom:0; } 

header nav .depth_01 li a.on, 
header nav .depth_01 li a:hover, 
header nav .depth_01 .dep02_title:hover,
header nav .depth_01 li a:active,
header .header_link_area .user_area .login_btn:active { color: #2aad5c; border: 0; position: relative; }

header nav .depth_01 li a.on::after, 
header nav .depth_01 li a:hover::after, 
header nav .depth_01 .dep02_title:hover::after,
header nav .depth_01 li a:active::after,
header .header_link_area .user_area .login_btn:active::after { position: absolute; content: ""; width: calc(100% - 32px); height: 0; border-top: 2px solid #2aad5c; left: 0; bottom: 12px; left: 16px; }

header nav .depth_01 li a.on span, 
header nav .depth_01 li a:hover span, 
header nav .depth_01 .dep02_title:hover span,
header nav .depth_01 li a:active span { border-bottom: 2px solid #2aad5c; padding-bottom: 4px; }

header nav .depth_01 > li > a.point { color: #2aad5c; font-weight: bold; } 
header nav .depth_01 > li + li { margin-top: 0px; }

header nav .depth_01 li a.basket { width: 110px; height: 38px; line-height: 36px; border: 2px solid #222222; border-radius: 30px; text-align: center; color: #222222; box-sizing: border-box; }


header .depth02_bg { position: absolute; width: 100%; background-color: rgba(255,255,255,0.8); bottom: 0px; height: 0; overflow: hidden; transition: all 0.3s; opacity: 0; }
header .depth02_bg.on { height: 56px; bottom: -56px; opacity: 1; }

header .depth_02 { position: absolute; top: 50%; transform: translateY(-50%); }
header .depth_02 li { display: inline-block; margin-right: 40px; }
header .depth_02 li:last-of-type { margin-right: 0px; }
header .depth_02 li a { font-weight: normal; font-size: 15px; height: 24px; line-height: 24px; color: #222222; }
header .depth_02 li a:hover { color: #2aad5c; }

header .header_link_area { height: 0; overflow: hidden; background-color: #ffffff; width: 100%; position: fixed; top: 68px; left: 0; transition: height 0.5s, padding 0.5s; padding: 0px 24px 0px; z-index: 2000; display: flex; flex-direction: column; justify-content: flex-start; }
header .header_link_area.on { height: 524px; padding: 8px 24px 24px; }
header .header_link_area nav { position: static; display: flex; justify-content: flex-start; align-items: flex-start; flex-direction: column; }
header .header_link_area .user_area { height: auto; transform: none; width: 100%; padding: 0 0px; display: flex; align-items: center;  justify-content: space-between; height: auto ; line-height: unset; position: static; }
header .header_link_area .user_area .login_btn { padding: 0 16px; position: relative; }

header .user_area { position: absolute; right: 0; top: unset; transform: translateY(-50%); height: 100%; line-height: 80px; }
header .user_area .login_btn { display: inline-block; font-weight: 500; font-size: 16px;  line-height: 46px; height: 46px;; color: #363636; }
header .user_area .login_btn + .go_service_btn { margin-left: 0px; font-weight: 500; font-size: 16px; }
header .user_area .go_service_btn { width: calc(100% - 48px); display: inline-block; height: 56px; line-height: 56px; padding: 0 16px; text-align: left; font-weight: 500; font-size: 15px; letter-spacing: -0.02em; color: #2aad5c; background-color: #ffffff; border-radius: 6px; position: absolute; top: 336px; left: 24px; }
header .user_area .go_service_btn:active { color: #2aad5c; }

header.type_landing { max-width: 768px; left: 50%; transform: translateX(-50%); transition: none; }
header.type_landing .notice.t_only { display: inline-block !important; }
header.type_landing .ham.t_only { display: inline-block !important; }

header.type_landing { height: auto; padding: 16px 24px; box-sizing: border-box; z-index: 2000; position: fixed; }
header.type_landing .header_wrap { width: 100%; position: relative; height: 36px; }
header.type_landing .logo { width: 112px; }
header.type_landing .ham { position: absolute; right: 0; top: 50%; transform: translateY(-50%); }

header .ham { position: absolute; right: 0; top: 50%; transform: translateY(-50%); }
header .notice { position: absolute; right: 35px; top: 50%; transform: translateY(-50%); }
header .alarm_guide_text { position: absolute; right: 16px; bottom: -50px;; z-index: 60; background-color: #222222; padding: 10px 20px; border-radius: 12px; font-weight: 700; font-size: 14px; line-height: 20px; color: #ffffff; } 
header .alarm_guide_text::after { content: ""; display: inline-block; width: 16px; height: 16px; background-color: #222222; position: absolute; right: 24px; top: -6px; transform: rotate(45deg); z-index: 9; }

header.type_landing .notice { position: absolute; right: 35px; top: 50%; transform: translateY(-50%); }
header.type_landing .alarm_guide_text { position: absolute; right: 16px; bottom: -50px;; z-index: 60; background-color: #222222; padding: 10px 20px; border-radius: 12px; font-weight: 700; font-size: 14px; line-height: 20px; color: #ffffff; } 
header.type_landing .alarm_guide_text::after { content: ""; display: inline-block; width: 16px; height: 16px; background-color: #222222; position: absolute; right: 24px; top: -6px; transform: rotate(45deg); z-index: 9; }


header.type_landing { top: 0px; background-color: #ffffff; }
header.type_landing .header_link_area { height: 0; overflow: hidden; background-color: #ffffff; width: 100%; position: fixed; top: 68px; left: 0; transition: height 0.5s, padding 0.5s; padding: 0px 24px 0px; z-index: 2000; display: flex; flex-direction: column; justify-content: space-between; }
header.type_landing .header_link_area.on { height: 418px; padding: 56px 24px 36px; }
header.type_landing .header_link_area nav { position: static; }
header.type_landing .header_link_area .user_area { height: auto; transform: none; width: 100%; padding: 0 0px; display: flex; align-items: center;  justify-content: space-between; height: auto ; line-height: unset; position: static; }
header.type_landing .header_link_area .user_area .login_btn { position: absolute; right: 28px; top: 8px; font-weight: 700; font-size: 14px; line-height: 45px; color: #888888; margin: 0;  text-align: right; }
header.type_landing nav .depth_01 > li { display: block; font-weight: 500; font-size: 16px; line-height: 45px; height: 45px; color: #888888; padding: 0; }
header.type_landing nav .depth_01 > li + li { margin-top: 0px; }
header.type_landing .user_area { top: unset; }
header.type_landing .user_area .login_btn { height: 46px; line-height: 46px; }
header.type_landing nav .depth_01 { display: flex; flex-direction: column; justify-content: flex-start; align-items: flex-start; }
header.type_landing nav .depth_01 > li { height: auto; line-height: inherit; display: inline-block; width: 100%; margin: 0; }
header.type_landing nav .depth_01 > li > a { width: 100%; height: 56px; line-height: 56px; text-align: left; padding: 0 16px; transform: none; top: 0; }
header.type_landing .user_area .go_service_btn { width: 100%; height: 56px; line-height: 56px; text-align: left; padding: 0 16px; background-color: #ffffff; color: #2aad5c; }

header.type_landing nav .depth_01 li a.on, 
header.type_landing nav .depth_01 li a:hover, 
header.type_landing nav .depth_01 .dep02_title:hover,
header.type_landing nav .depth_01 li a:active { color: #222222; border: 0; }
header.type_landing .user_area .go_service_btn:active { color: #2aad5c; }
header.type_landing nav .depth_01 li a.on span, 
header.type_landing nav .depth_01 li a:hover span, 
header.type_landing nav .depth_01 .dep02_title:hover span,
header.type_landing nav .depth_01 li a:active span { border-bottom: 2px solid #2aad5c; padding-bottom: 4px; }


header.type_landing .m_nav { width: 0; height: 100%; overflow: hidden; background-color: #ffffff; padding: 22px 0 0 0; box-sizing: border-box; position: fixed; right: 0; top: 0; transition: all 0.3s; z-index: 11; }
header.type_landing .m_nav.on { width: 100%; padding: 22px 24px 0 68px; }
header.type_landing .m_nav .close { text-indent: -99999px; width: 24px; height: 24px; float: right; background-image: url(../image/intro_exit.svg); background-repeat: no-repeat; background-position: center center; }
header.type_landing .m_nav .depth_01 { margin-top: 155px; }
header.type_landing .m_nav .depth_01 > li { margin-bottom: 24px; }
header.type_landing .m_nav .depth_01 > li > a { font-weight: bold; font-size: 22px; line-height: 32px; }

header.type_landing .m_nav .depth_02 { position: static; margin-top: 2px; transform: none; }
header.type_landing .m_nav .depth_02 li { display: block; }
header.type_landing .m_nav .depth_02 a { display: inline-block; font-weight: normal; font-size: 15px; line-height: 24px; text-align: left; margin-top: 8px; }

header.type_landing .m_nav .depth_01 .depth02_title { display: inline-block; margin-right: 36px; position: relative; white-space: nowrap; }
header.type_landing .m_nav .depth_01 .depth02_title::after { content: ""; width: 24px; height: 24px; position: absolute; right: -36px; top: 50%; transform: translateY(-50%) rotate(90deg);  display: inline-block; background-image: url(../image/go_arrow.svg); background-repeat: no-repeat; background-position: right center; }
header.type_landing .m_nav .depth_01 > li > .depth02_title.on { border-bottom: 2px solid #2aad5c; }
header.type_landing .m_nav .depth_01 > li > .depth02_title.on::after { transform: translateY(-50%) rotate(-90deg); }
header.type_landing .m_nav .depth_01 .depth02_title + .depth_02 { height: 0; overflow: hidden; transition: all 0.5s; }
header.type_landing .m_nav .depth_01 .depth02_title.on + .depth_02 { height: 64px; }

header.type_landing,
header.type_landing:hover { background-color: rgba(255,255,255,1); border: 0; }
header.type_landing.on,
header.type_landing.on:hover { background-color: rgba(255,255,255,1); border-bottom: 0; }

header .banner_area { width: calc(100% - 48px); height: 96px; position: absolute; left: 24px; background-color: #dfdfdf; bottom: 24px;border-radius: 8px; overflow: hidden; }
header .banner_area a { width: 100%; height: 100%; display: inline-block; position: relative; }
header .banner_area a img {  position: absolute; min-width: 100%; min-height: 100%; height: 100%; max-width: none; left: 50%; top: 50%; transform: translate(-50%,-50%); image-rendering: -moz-crisp-edges; /* firefox */ image-rendering: -o-crisp-edges; /* opera */ image-rendering: -webkit-optimize-contrast; /* chrome(비표준) */ image-rendering: crisp-edges; }

header.detail + main .reservation_section .section_wrap { padding: 68px 24px 24px; }
header.detail + main section.payment_section .section_wrap { padding-top: 68px; }

header.detail { height: 68px; }
header.detail .back_btn { position: absolute; left: 24px; top: 50%; transform: translateY(-50%); display: inline-block; width: 28px; height: 28px; text-indent: -999999px; background-image: url(../image/header/icon_detail_back01.svg); background-repeat: no-repeat; background-position: center center; }
header.detail .page_title { display: inline-block; position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%); font-weight: 700; font-size: 16px; line-height: 22px; }
header.detail .exit_btn { position: absolute; right: 24px; top: 50%; transform: translateY(-50%); display: inline-block; width: 28px; height: 28px; text-indent: -999999px; background-image: url(../image/header/icon_detail_exit01.svg); background-repeat: no-repeat; background-position: center center; }
header.detail .cart_btn { position: absolute; right: 24px; top: 50%; transform: translateY(-50%); display: inline-block; width: 28px; height: 28px; text-indent: -999999px; background-image: url(../image/header/icon_detail_cart01.svg); background-repeat: no-repeat; background-position: center center; }
header.detail .cart_btn .count { position: absolute; right: -4px; top: -4px; width: 16px; height: 16px; line-height: 16px; background-color: #ff0000; border-radius: 50%; text-align: center; font-weight: 700; font-size: 10px; letter-spacing: -0.05em; color: #ffffff; white-space: nowrap; text-indent: 0; }
header.detail .skip_btn { position: absolute; right: 24px; top: 50%; transform: translateY(-50%); display: inline-block; font-weight: 500; font-size: 14px; line-height: 20px; color: rgba(34, 34, 34, 0.48); }
header.detail .certi_btn { z-index: 2200; position: absolute; right: 24px; top: 50%; transform: translateY(-50%); display: inline-block; padding: 0 10px; height: 28px; line-height: 28px; background-color: #384a86; border-radius: 8px; box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.1); font-weight: 700; font-size: 14px; color: #ffffff; display: flex; align-items: center; justify-content: center; }
header.detail .certi_btn img { width: 6px; margin-left: 4px; }
header.detail .cart_tooltip_box { position: absolute; right: 8px; bottom: -32px; width: 238px; height: 40px; line-height: 40px; background: rgba(34, 34, 34, 0.7); border-radius: 12px; text-align: center; font-weight: 700; font-size: 14px; color: #ffffff; }
header.detail .cart_tooltip_box::after { content: ""; width: 0; height: 0; border-right: 10px solid transparent; border-top: 10px solid transparent; border-left: 10px solid transparent; border-bottom: 10px solid rgba(34, 34, 34, 0.7); position: absolute; right: 16px; top: -20px; }



/* Main */
main { height: auto; min-height: 100%; }
.sub_main_area { width: 100%; margin: 0 auto; }
main.sub_main_area .side_nav { float: left; min-height: none; min-width: 310px; }
main.sub_main_area section { min-height: none; height: auto; position: relative; }

main.sub_main_area .side_nav .nav_info { margin-top: 0px; }
main.sub_main_area .side_nav .nav_info .login_info_area { display: flex; justify-content: space-between; margin-top: 4px; align-items: center; }
main.sub_main_area .side_nav .nav_info .name_text { font-weight: normal; font-size: 32px; display: block; }
main.sub_main_area .side_nav .nav_info .name_text span { font-weight: bold; display: inline-block; margin-right: 10px; }
main.sub_main_area .side_nav .nav_info .email_text { font-weight: normal; font-size: 14px; line-height: 21px; color: #888888; display: block; }
main.sub_main_area .side_nav .nav_info .logout { display: inline-block; font-weight: normal; font-size: 14px; line-height: 21px; color: #888888; }
main.sub_main_area .side_nav .nav_info + nav { margin-top: 42px; }


main.sub_main_area .side_nav .nav_info .flex_area { display: flex; justify-content: space-between; margin-top: 4px; }


main.sub_main_area .side_nav .point_coupon_view_area { width: 100%; background-color: #ffffff; border-radius: 8px; border: 1px solid #d9dbe9; padding: 15px 0 14px; margin-top: 18px; }
main.sub_main_area .side_nav .point_coupon_view_area ul { display: flex; justify-content: space-between; }
main.sub_main_area .side_nav .point_coupon_view_area li { width: 50%; }
main.sub_main_area .side_nav .point_coupon_view_area li + li { border-left: 1px solid #d9dbe9; }
main.sub_main_area .side_nav .point_coupon_view_area .link { display: flex; flex-direction: column; }
main.sub_main_area .side_nav .point_coupon_view_area .link .title { font-weight: 700; font-size: 15px; line-height: 22px; padding-left: 24px; display: flex; justify-content: center; align-items: center; }
main.sub_main_area .side_nav .point_coupon_view_area .link .title i { width: 24px; height: 24px; background-image: url(../image/icon_arrow_black.svg); background-repeat: no-repeat; display: inline-block; }
main.sub_main_area .side_nav .point_coupon_view_area .link .data_view { font-weight: 700; font-size: 22px; line-height: 30px; text-align: center; display: block; color: #2aad5c; }


/* Sub - Side nav */
.side_nav strong { font-weight: normal; font-size: 40px; color: #222222; }

main.sub_main_area .side_nav { position: relative; }
.side_nav .float_area { width: 264px; position: sticky; top: 168px; margin-bottom: 120px; margin-top: 88px; }

main.sub_main_area .side_nav nav { display: none; }
main.sub_main_area .side_nav { float: inherit; width: 100%; height: auto; padding: 144px 24px 0; min-height: auto; box-sizing: border-box; }
main.sub_main_area section { min-height: 100vh; position: relative; }
.nav_info { display: none; }
main.sub_main_area .sub_type01 .side_nav { position: absolute; text-align: right;}
main.sub_main_area .sub_type01 .side_nav > strong { font-weight: normal; font-size: 11px; text-decoration: underline; line-height: 32px; }
main.sub_main_area .sub_type02 .side_nav { display: none; }
.side_nav .float_area { margin: 0; width: 100%; }


/* footer */
footer { width: 100%; height: auto; background-color: #363636; position: relative; color: #ffffff; }
footer.on { height: auto; }
footer .footer_wrap { display: inline-block; width: 100%; padding: 0px 24px 40px; box-sizing: border-box; position: relative; left: 50%; transform: translateX(-50%); overflow: hidden; }
footer .footer_division { width: 100%; display: inline-block; width: 100%; }
footer .footer_division > li { width: 100%; }
footer .footer_division > li:last-of-type { margin-top: 40px; }
footer .terms_list { width: 100%; display: inline-block; margin-top: 30px; }
footer .terms_list li { display: inline-block; margin-right: 30px; margin-bottom: 8px; }
footer .terms_list li:last-of-type { margin-right: 0; }
footer .terms_list li a { font-weight: bold; font-size: 14px; }
footer .contact_list { font-weight: normal; font-size: 14px; margin-top: 16px; line-height: 22px; }
footer .sns_list { width: 100%; margin-top: 24px; } 
footer .sns_list li { margin-right: 20px; display: inline-block; }
footer .sns_list li:last-child { margin-right: 0; }
footer .sns_list li a { display: inline-block; width: 23px; height: 23px; background-repeat: no-repeat; background-position: center center; text-indent: -9999px; }
footer .sns_list li a.naver { background-image: url(../image/footer/sns_blog.svg); }
footer .sns_list li a.kakao { background-image: url(../image/footer/sns_kakao.svg); }
footer .sns_list li a.instar { background-image: url(../image/footer/sns_instar.svg); }
footer .sns_list li a.youtube { background-image:  url(../image/footer/sns_youtube.svg); }
footer .sns_list li a.google { background-image: url(../image/footer/sns_google.svg); }
footer .info_title { font-weight: bold; font-size: 14px; display: block; width: 100%; }
footer .info_list { margin-top: 16px; display: inline-block; height: 0; overflow: hidden; }
footer .info_list.on { height: 265px; transition: all 0.3s; }
footer .info_list li { font-weight: normal; font-size: 14px; line-height: 22px; margin-top: 16px; }
footer .info_title .more { display: inline-block; width: 17px; height: 17px; margin: 0 5px; background-image: url(../image/footer_more.svg); background-repeat: no-repeat; background-position: center center; text-indent: -999999px; transition: all 0.3s; }
footer .info_title .more.on { transform: rotate(180deg); }
/* 섭취알람 */
header .notcie_area {  position: absolute; bottom: -73px; right: 24px; background-color: rgba(255,255,255,0.7); border-radius: 12px; padding: 8px 16px; opacity: 0;  transition: all 0.3s; display: none; }
header .notcie_area p { font-weight: bold; font-size: 14px; line-height: 20px; color: #2aad5c; }
header .notcie_area.on { opacity: 1; display: inline-block; }
header .notcie_area::after { content: ""; width: 21px; height: 12px; display: inline-block; position: absolute; top: -12px; right: 40px; background-image: url(../image/alarm_tail.svg); background-repeat: no-repeat; background-position: center center; }

.dimm { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0,0,0,0.8); z-index: 1500; transition: all 0.5s; opacity: 0; display: none; }
.dimm.on { opacity: 1; display: inline-block; }
/* popup */
#popup_wrap { width: 100%; height: 100%; position: fixed; left: 0; top:0; -webkit-top: constant(safe-area-inset-top); -webkit-top: env(safe-area-inset-top); display: none; background-color: rgba(0,0,0,0.7); z-index: 10000; }
#popup_wrap.active{ display: block; }
/* iOS only */ 
@supports (-webkit-touch-callout: none) { 
    body, html { height: 100%; }
    #popup_wrap { height: -webkit-fill-available; }
}

.popup { display: none; }
.popup.active { display: inline-block; }

@media (max-width:480px){
    .m_only { display: inline-block !important; }
    .pc_only { display: none !important; }
    .popup { display: none; }
    .popup.active { display: inline-block; }
}

section.intro_section.type_btn_show_hide .section_wrap { padding-bottom: 100px; }
section.intro_section.type_btn_show_hide .bot_btn_area.type_hide_show { max-width: 480px; width: 100%; background-color: #ffffff; padding: 12px 24px 24px; bottom: -100px; position: fixed; transition: bottom 0.5s; }
section.intro_section.type_btn_show_hide .bot_btn_area.type_hide_show.on { bottom: 0px; }

/* 팝업 버튼 */
.popup .popup_btn_area.type_pop_2way01 { display: flex; flex-direction: column; }
.popup .popup_btn_area.type_pop_2way01 .btn { width: 100%; height: 48px; line-height: 48px; font-weight: 700; font-size: 15px; }
.popup .popup_btn_area.type_pop_2way01 .btn:nth-child(2) { border: 1px solid #d0d0d0; background-color: #ffffff; color: #888888; }
.popup .popup_btn_area.type_pop_2way01 .btn + .btn { margin-top: 8px; }

.popup .popup_btn_area.type_pop_2way02 { display: flex; justify-content: space-between; align-items: center; }
.popup .popup_btn_area.type_pop_2way02 .btn { width: calc(50% - 4px) }
.popup .popup_btn_area.type_pop_2way02 .btn:nth-child(1) { border: 1px solid #2aad5c; background-color: #ffffff; color: #2aad5c; }

/* Popup */
.popup_01 { position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%); width: 312px; height: 308px; background-color: #ffffff; padding: 92px 24px 24px; border-radius: 24px; text-align: center; }
.popup_01 img { position: absolute; left: 50%; transform: translateX(-50%); top: -67px; }
.popup_01 strong { display: inline-block; font-weight: bold; font-size: 24px; letter-spacing: -0.02em; color: #2aad5c; margin-bottom: 16px; line-height: 32px; }
.popup_01 p { font-weight: normal; font-size: 15px; line-height: 22px; color: #222222; }
.popup_01 .install_app { display: inline-block; width: 100%; height: 64px; line-height: 64px; font-weight: bold; font-size: 18px; color: #ffffff; background-color: #2aad5c; border-radius: 12px; margin-top: 32px; }
.popup_01 .exit_popup { display: inline-block; width: 100%; font-weight: normal; font-size: 14px; line-height: 20px; text-decoration: underline; color: #ffffff; position: absolute; bottom: -32px; left: 50%; transform: translateX(-50%); }


.popup { background-color: #ffffff; position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%); }
.popup_type01 { width: 312px; border-radius: 24px; text-align: center; padding: 22px 24px; }
.popup_type01 .pop_btn_area,
.popup_type02 .pop_btn_area,
.popup_type03 .pop_btn_area,
.popup_type04 .pop_btn_area,
.popup_type05 .pop_btn_area,
.popup_type09 .pop_btn_area,
.popup_type11 .pop_btn_area { width: 100%; text-align: right; }
.popup_type01 .pop_btn_area button,
.popup_type01 .pop_btn_area a,
.popup_type01 .pop_btn_area input[type="button"],
.popup_type01 .pop_btn_area input[type="submit"],
.popup_type02 .pop_btn_area button,
.popup_type02 .pop_btn_area a,
.popup_type02 .pop_btn_area input[type="button"],
.popup_type02 .pop_btn_area input[type="submit"],
.popup_type03 .pop_btn_area button,
.popup_type03 .pop_btn_area a,
.popup_type03 .pop_btn_area input[type="button"],
.popup_type03 .pop_btn_area input[type="submit"],
.popup_type04 .pop_btn_area button,
.popup_type04 .pop_btn_area a,
.popup_type04 .pop_btn_area input[type="button"],
.popup_type04 .pop_btn_area input[type="submit"],
.popup_type05 .pop_btn_area button,
.popup_type05 .pop_btn_area a,
.popup_type05 .pop_btn_area input[type="button"],
.popup_type05 .pop_btn_area input[type="submit"],
.popup_type09 .pop_btn_area button,
.popup_type09 .pop_btn_area a,
.popup_type09 .pop_btn_area input[type="button"],
.popup_type09 .pop_btn_area input[type="submit"],
.popup_type11 .pop_btn_area button,
.popup_type11 .pop_btn_area a,
.popup_type11 .pop_btn_area input[type="button"],
.popup_type11 .pop_btn_area input[type="submit"]{ display: inline-block; text-indent: -99999px; width: 24px; height: 24px; line-height: 24px; background-image: url(../image/intro_exit.svg); background-repeat: no-repeat; background-position: center center; background-size: contain; }
.popup_type01 .popup_title { display: inline-block; font-weight: bold; font-size: 24px; line-height: 32px; margin-top: 10px; }
.popup_type01 .popup_text { margin-top: 12px; font-weight: normal; font-size: 13px; line-height: 20px; }
.popup_type01 .popup_text strong { font-weight: 500; }
.popup_type01 .popup_btn { display: inline-block; margin-top: 24px; width: 100%; height: 64px; line-height: 64px; background-color: #2aad5c; border-radius: 12px; color: #fcfcfc; font-weight: bold; font-size: 15px; }
.popup_type01.url_type  { padding: 24px 16px; }
.popup_type01.url_type .popup_title { margin-top: 0px; font-size: 20px; line-height: 32px; }
.popup_type01.url_type .popup_text { margin-top: 16px; font-weight: bold; font-size: 15px; line-height: 24px; color: #2aad5c; }
.popup_type01.url_type .url_text_area { margin-top: 32px; width: 100%; height: 56px; line-height: 56px; padding: 8px 12px 8px 24px; background-color: #eff0f7; border-radius: 12px; display: flex; justify-content: space-between; }
.popup_type01.url_type .url_text_area input[type="text"] { background-color: #eff0f7; font-weight: normal; font-size: 15px; line-height: 40px; color: #6e7191; width: 147px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.popup_type01.url_type .url_text_area .btn { width: 87px; height: 40px; line-height: 40px; background-color: #2aad5c; border-radius: 8px; color: #f3f3f3; font-weight: bold; font-size: 12px; }
.popup_type01 .popup_text.none_title_type { margin-top: 16px; font-weight: 500; font-size: 18px; line-height: 24px; }

.browser_popup { width: 312px; }
.browser_popup .icon_area { margin-top: 8px; text-align: center; }
.browser_popup .icon_area i { display: inline-block; width: 62px; height: 64px; background-image: url(../image/icon_ieChk.svg); background-repeat: no-repeat; background-position: center center; }
.browser_popup .popup_text { margin-top: 32px; font-weight: normal; font-size: 15px; line-height: 24px; text-align: center; }
.browser_popup .download_link_list { margin-top: 24px; }
.browser_popup .download_link_list a { width: 100px; height: 24px; display: inline-block; padding-left: 32px; background-repeat: no-repeat; background-position: left center; position: relative; line-height: 24px; font-weight: normal; font-size: 14px; color: #888888; padding-right: 16px; }
.browser_popup .download_link_list a.down_chrome { background-image: url(../image/icon_chrome.svg); margin-right: 40px; }
.browser_popup .download_link_list a.down_edge { background-image: url(../image/icon_edge.svg); }
.browser_popup .download_link_list a::after { content: ""; width: 16px; height: 16px; position: absolute; top: 50%; transform: translateY(-50%); right: 0; background-image: url(../image/icon_download.svg); background-repeat: no-repeat; background-position: center center; background-size: 16px; }

.popup_type02 { width: 312px; min-height: auto; background-color: #ffffff; border-radius: 24px; padding: 24px 24px 0px 24px; }
.popup_type02 .popup_text_area { max-height: 395px; overflow: auto; scrollbar-width: thin; scrollbar-color: #2aad5c #dfdfdf; padding-right: 8px; padding-bottom: 48px; }
.popup_type02 .popup_text_area::-webkit-scrollbar { width: 4px; }
.popup_type02 .popup_text_area .nut_name { font-weight: normal; font-size: 18px; line-height: 24px; }
.popup_type02 .popup_text_area .nut_name span { display: table; }
.popup_type02 .info_list:nth-of-type(1) { margin-top: 17px; margin-bottom: 30px; position: relative; }
.popup_type02 .info_list:nth-of-type(1)::after { content: ""; display: inline-block; position: absolute; width: 95%; height: 2px; background-color: #d9dbe9; bottom: -30px; left: 0; transform: none; }
.popup_type02 .nut_info_title { display: inline-block; padding-top: 30px; font-weight: bold; font-size: 16px; line-height: 20px; }
.popup_type02 .info_list:nth-of-type(1) li { margin-top: 18px; }
.popup_type02 .info_list:nth-of-type(1) li:first-of-type { margin-top: 0; }
.popup_type02 .info_list:nth-of-type(2) { margin-top: 12px; }
.popup_type02 .info_list:nth-of-type(2) li { margin-top: 16px; }
.popup_type02 .info_list:nth-of-type(2) li:first-of-type { margin-top: 0; }
.popup_type02 .info_list:nth-of-type(2) span { text-indent: 10px; position: relative; }
.popup_type02 .info_list:nth-of-type(2) span::before { content: "-"; display: inline-block; width: 10px; font-size: 15px; font-weight: normal; line-height: 20px; position: absolute; top: 0; left: 0; text-indent: 2px; }

.popup_type02 .info_list strong { display: block; font-weight: bold; font-size: 16px; line-height: 20px;  } 
.popup_type02 .info_list span { display: inline-block; font-size: 15px; font-weight: normal; line-height: 20px; width: 240px; }


.popup_type02 .popup_text_area .division { font-weight: normal; font-size: 16px; line-height: 24px; color: #888888; }
.popup_type02 .popup_text_area .name { font-weight: bold; font-size: 18px; line-height: 24px; display: block; letter-spacing: -0.015em; width: 248px; word-break: break-all; }
.popup_type02 .popup_text_area .drug_info_area { margin-top: 16px; margin-bottom: 24px; }
.popup_type02 .popup_text_area .drug_info_area dt { font-weight: bold; font-size: 14px; line-height: 20px; }
.popup_type02 .popup_text_area .drug_info_area dd { font-weight: normal; font-size: 15px; line-height: 20px; margin-top: 2px; }
.popup_type02 .popup_text_area .drug_info_area dd .tag { margin-top: 4px; }
.popup_type02 .popup_text_area .drug_info_area dd + dt { margin-top: 16px;  }
.popup_type02 .popup_text_area .tag { display: inline-block; padding: 0 6px; background-color: rgba(42,173,92,0.1); border-radius: 32px; height: 23px; line-height: 23px; font-weight: bold; font-size: 13px; color: #2aad5c; }
.popup_type02 .popup_text_area .sug_area { width: 100%; border-top: 1px solid #d0d0d0; padding-top: 24px; }
.popup_type02 .popup_text_area .sug_area .title { font-weight: bold; font-size: 18px; line-height: 20px; }
.popup_type02 .popup_text_area .sug_area .sug_drug_area { margin-top: 14px; }
.popup_type02 .popup_text_area .sug_area .sug_drug_area dd { margin-top: 8px; font-weight: normal; font-size: 14px; line-height: 20px; }
.popup_type02 .popup_text_area .sug_area .sug_drug_area dd::before { content: "-"; display: inline-block; width: auto; height: 20px; line-height: 20px; }
.popup_type02 .popup_text_area .sug_area .sug_drug_area dd + dt { margin-top: 16px; }

.popup_type02::after { position: absolute; content: ""; display: inline-block; width: calc(100% - 32px); height: 48px; bottom: 0; left: 0; background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, #FFFFFF 68.02%); border-radius: 24px; }

.popup_type02 .scroll_area,
.popup_type03 .scroll_area { overflow-y: scroll; padding-right: 8px; position: relative; -ms-overflow-style: none; scrollbar-width: none; width: 100%; }
.popup_type03 .scroll_area { height: 278px; }
.popup_type02 .scroll_area .bar_wrap,
.popup_type03 .scroll_area .bar_wrap { display: inline-block; position: absolute; width: 4px; height: 100%; right: 0; top: 0; background-color: transparent; overflow: hidden; }
.popup_type02 .scroll_area .bar,
.popup_type03 .scroll_area .bar { content:""; display: inline-block; position: absolute; width: 4px; right: 0; top: 0; border-radius: 2px; }

.popup_type03 { width: 312px; height: auto; border-radius: 24px; padding: 26px 24px; min-height: auto; }
.popup_type03 .agree_text { width: 100%; padding-right: 12px; }
.popup_type03 .scroll_area::-webkit-scrollbar { display: none; }
.popup_type03 .popup_title { display: inline-block; width: 100%; font-weight: 700; font-size: 20px; line-height: 48px; letter-spacing: 1px; text-align: center; margin-bottom: 30px; }
.popup_type03 .agree_btn { display: inline-block; width: 100%; margin-top: 30px; height: 64px; line-height: 64px; background-color: #2aad5c; border-radius: 12px; font-weight: bold; font-size: 15px; color: #fcfcfc; }
.popup_type03 .agree_text dt { margin: 30px 0; font-weight: bold; font-size: 18px; }
.popup_type03 .agree_text dt:first-of-type { margin-top: 0; }
.popup_type03 .agree_text dd { font-weight: normal; font-size: 13px; line-height: 22px; border-bottom: 2px solid #d9dbe9; padding-bottom: 30px; }
.popup_type03 .agree_text dd:last-of-type { border-bottom: 0; }
.popup_type03 .agree_text dd li { margin-bottom: 22px; }
.popup_type03 .agree_text dd li:last-of-type { margin-bottom: 0; }

.popup_type03 .agree_text { font-weight: normal; font-size: 13px; line-height: 22px; }
.popup_type03 .agree_text li { margin-bottom: 22px; }
.popup_type03 .agree_text li:last-of-type { margin-bottom: 0; }

.popup_type04 { width: 312px; min-height: 584px; border-radius: 24px; padding: 26px 21px; }
.popup_type04 .popup_title { display: inline-block; margin-top: 25px; font-weight: bold; font-size: 24px; line-height: 32px; }
.popup_type04 .popup_text { margin-top: 2px; font-weight: normal; font-size: 16px; line-height: 22px; color: #888888; }

.popup_type04 .popup_contents_area { margin-top: 23px; }
.popup_type04 .popup_contents_area .error_msg { display: block; font-weight: normal; font-size: 14px; line-height: 20px; height: 20px; width: auto; min-width: 5px; color: #2aad5c; }
.popup_type04 .popup_contents_area .login_list .password_area { height: 0; overflow: hidden; transition: all 0.4s; margin: 0; }
.popup_type04 .popup_contents_area.on .login_list .password_area { height: 56px; }


.popup_type04 .popup_contents_area .login_btn_area .next { display: inline-block; }
.popup_type04 .popup_contents_area .login_btn_area .login { display: none; }
.popup_type04 .popup_contents_area.on .login_btn_area .next { display: none; }
.popup_type04 .popup_contents_area.on .login_btn_area .login { display: inline-block; }

.popup_type04 .popup_contents_area .login_list { margin-top: 24px; }
.popup_type04 .popup_contents_area .login_list li { margin-bottom: 12px; }
.popup_type04 .popup_contents_area .login_list li:last-of-type { margin-bottom: 0; }

.popup_type04 .popup_contents_area .btn_list { margin-top: 24px; }

.popup_type04 .popup_contents_area input[type="text"],
.popup_type04 .popup_contents_area input[type="password"] { width: 100%; height: 56px; line-height: 56px; background-color: #eff0f6; border: 2px solid #eff0f6; padding: 0px 24px; border-radius: 12px; font-weight: normal; letter-spacing: 0.75px; font-size: 15px; color: #222222; box-sizing: border-box; }
.popup_type04 .popup_contents_area input[type="text"]:focus,
.popup_type04 .popup_contents_area input[type="password"]:focus { background-color: #ffffff; border: 2px solid #2aad5c;  }
.popup_type04 .popup_contents_area input[type="text"]::placeholder,
.popup_type04 .popup_contents_area input[type="password"]::placeholder { color: #6e7191; font-weight: normal; }

.popup_type04 .popup_contents_area button,
.popup_type04 .popup_contents_area a,
.popup_type04 .popup_contents_area input[type="button"],
.popup_type04 .popup_contents_area input[type="submit"] { width: 100%; height: 64px; line-height: 64px; background-color: #2aad5c; border-radius: 12px; font-weight: bold; font-size: 18px; color: #fcfcfc; margin-top: 12px; }

.popup_type04 .popup_contents_area button.kakao,
.popup_type04 .popup_contents_area a.kakao,
.popup_type04 .popup_contents_area input[type="button"].kakao,
.popup_type04 .popup_contents_area input[type="submit"].kakao { background-color: #fee500; color: #222222; }

.popup_type04 .popup_contents_area button.naver,
.popup_type04 .popup_contents_area a.naver,
.popup_type04 .popup_contents_area input[type="button"].naver,
.popup_type04 .popup_contents_area input[type="submit"].naver { background-color: #42bc00; color: #fcfcff; }

.popup_type04 .popup_contents_area .login_list button:disabled,
.popup_type04 .popup_contents_area .login_list a:disabled,
.popup_type04 .popup_contents_area .login_list input[type="button"]:disabled,
.popup_type04 .popup_contents_area .login_list input[type="submit"]:disabled { background-color: #d0d0d0; }

.popup_type04 .popup_contents_area > button, 
.popup_type04 .popup_contents_area > a, 
.popup_type04 .popup_contents_area > input[type="button"],
.popup_type04 .popup_contents_area > input[type="submit"] { margin-top: 12px; font-size: 15px; }

.popup_type04 .login_button_list { margin-top: 36px; }

.popup_type04 .login_button_list li { margin-bottom: 12px; }
.popup_type04 .login_button_list button,
.popup_type04 .login_button_list a,
.popup_type04 .login_button_list input[type="button"],
.popup_type04 .login_button_list input[type="submit"] { width: 100%; height: 64px; line-height: 64px; border-radius: 12px; font-weight: bold; font-size: 15px; color: #fcfcfc; }
.popup_type04 .login_button_list .kakao,
.popup_type04 .login_button_list input[type="submit"].kakao { background-color: #fee500; color: #222222; }
.popup_type04 .login_button_list .naver { background-color: #42BC00; }

.popup_type04 .code_input_area { position: relative; }
.popup_type04 .coupon_list { margin-top: 16px; border-top: 1px solid #f3f3f3; padding-top: 16px; }
.popup_type04 .coupon_list .list_title { font-weight: normal; font-size: 16px; line-height: 32px; }
.popup_type04 .coupon_list ul { margin-top: 12px; height: 224px; overflow: auto; padding-right: 14px; scrollbar-width: thin; scrollbar-color: #2aad5c #dfdfdf; }
.popup_type04 .coupon_list ul li { position: relative; margin-bottom: 12px; }
.popup_type04 .coupon_list ul li label { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: transparent; }
.popup_type04 .coupon_list ul li:last-of-type { margin-bottom: 0; }
.popup_type04 .coupon_list ul li input[type="checkbox"],
.popup_type04 .coupon_list ul li input[type="radio"] { display: none; }
.popup_type04 .coupon_list ul li .coupon_info_area {  width: 100%; background-color: #ffffff; border: 1px solid #d0d0d0; box-sizing: border-box; border-radius: 12px; padding: 16px 18px; background-image: url(../image/icon/agree_chk.svg); background-repeat: no-repeat; background-position: calc(100% - 16px) 16px; }
.popup_type04 .coupon_list ul li input[type="checkbox"]:checked + .coupon_info_area { background-color: #2aad5c; border: 1px solid #2aad5c; background-image: url(../image/agree_chk_re.svg); color: #ffffff; }
.popup_type04 .coupon_list ul li .coupon_info_area .title { font-weight: bold; font-size: 14px; line-height: 20px; display: block; }
.popup_type04 .coupon_list ul li .coupon_info_area .date { font-weight: normal; font-size: 14px; line-height: 20px; color: #888888; }
.popup_type04 .coupon_list ul li .coupon_info_area .info { display: block; margin-top:  24px; font-weight: bold; font-size: 16px; line-height: 22px; }
.popup_type04 .coupon_list ul li input[type="checkbox"]:checked + .coupon_info_area .title,
.popup_type04 .coupon_list ul li input[type="checkbox"]:checked + .coupon_info_area .date,
.popup_type04 .coupon_list ul li input[type="checkbox"]:checked + .coupon_info_area .info { color: #ffffff; }
.popup_type04 .coupon_list ul::-webkit-scrollbar { width: 4px; }
.popup_type04 .coupon_list ul::-webkit-scrollbar-thumb { background-color: #2aad5c; border-radius: 2px; }
.popup_type04 .coupon_list ul::-webkit-scrollbar-track { background-color: #ffffff; border-radius: 5px; }

.popup_type04 .code_input_area input[type="text"] { padding-right: 108px; }
.popup_type04 .code_input_area button[type="button"],
.popup_type04 .code_input_area a,
.popup_type04 .code_input_area input[type="button"],
.popup_type04 .code_input_area input[type="submit"] { position: absolute; right: 8px; top: 50%; transform: translateY(-50%); width: 92px; height: 40px; line-height: 40px; margin-top: 0; border-radius: 8px; font-weight: normal; font-size: 13px; }

.popup_type04 .code_input_area button[type="button"]:disabled,
.popup_type04 .code_input_area a:disabled,
.popup_type04 .code_input_area input[type="button"]:disabled,
.popup_type04 .code_input_area input[type="submit"]:disabled { background-color: #d0d0d0; }

.popup_type04 .etc_btn_list { width: 100%; text-align: center; margin-top: 24px; }
.popup_type04 .etc_btn_list li { display: unset; border-right: 1px solid #d0d0d0; padding-right: 12px; }
.popup_type04 .etc_btn_list li:last-of-type { border-right: 0; padding-right: 0; padding-left: 12px; }
.popup_type04 .etc_btn_list button[type="button"],
.popup_type04 .etc_btn_list a,
.popup_type04 .etc_btn_list input[type="button"],
.popup_type04 .etc_btn_list input[type="submit"] { background-color: transparent; font-weight: normal; font-size: 15px; line-height: 24px; color: #222222; padding: 0; margin: 0; display: inline-block; width: auto; height: auto; }

.popup_type05 { width: 312px; padding: 16px 26px 24px; border-radius: 24px; text-align: center; }
.popup_type05 .popup_title { font-weight: bold; font-size: 24px; padding-left: 34px; background-image: url(../image/pop_title_icon.svg); background-repeat: no-repeat; background-position: left calc(50% + 2px); }
.popup_type05 .popup_text { margin-top: 19px; font-weight: normal; font-size: 18px; line-height: 34px; }
.popup_type05 .popup_text br { display: none; }
.popup_type05 .popup_btn { margin-top: 23px; display: block; width: 100%; height: 64px; line-height: 64px; background-color: #2aad5c; border-radius: 12px; font-weight: bold; font-size: 15px; color: #fcfcfc; }
.popup_type05 .skip_btn { display: inline-block; width: 100%; font-weight: normal; font-size: 14px; line-height: 20px; text-decoration: underline; color: #ffffff; position: absolute; bottom: -32px; left: 50%; transform: translateX(-50%); }
.popup_type05 .popup_text br:nth-child(2) { display: inherit; }

.popup_type06 { width: 312px; min-height: 144px; border-radius: 24px; text-align: center; padding: 73px 24px 32px; background-image: url(../image/popupA_icon.svg); background-repeat: no-repeat; background-position: center 32px; }
.popup_type06.complete_type { background-image: url(../image/popupA_icon_complete.svg); }
.popup_type06.type_cart { background-image: url(../image/shopping/icon_cart_b_01.svg); background-size: 40px; }
.popup_type06 .popup_contents_area p { font-weight: 400; font-size: 14px; line-height: 24px; }
.popup_type06 .popup_contents_area p em { color: #2aad5c; }

.popup_type06 .popup_contents_area .title { font-weight: 700; font-size: 18px; line-height: 30px; }
.popup_type06 .popup_contents_area .sub_copy { font-weight: 400; font-size: 16px; line-height: 30px; }

.popup_type06 .popup_btn_area { margin-top: 24px; }
.popup_type06 .popup_btn_area .btn { width: 100%; height: 56px; line-height: 56px; background-color: #2aad5c; border-radius: 12px; color: #fcfcfc; font-weight: 700; font-size: 16px; }

.popup_type06.point_view_type { padding: 48px 24px 24px; background-image: none; }
.popup_type06.point_view_type .main_title { font-weight: 700; font-size: 15px; line-height: 22px; }
.popup_type06.point_view_type .point_view { display: flex; margin-top: 4px; justify-content: center; align-items: center; }
.popup_type06.point_view_type .point_view i { display: inline-block; width: 40px; height: 40px; background-image: url(../image/icon_point01.svg); background-repeat: no-repeat; background-position: center; }
.popup_type06.point_view_type .point_view strong { font-weight: 700; font-size: 36px; line-height: 46px; margin-left: 8px; display: inline-block; }
.popup_type06.point_view_type .main_text { margin-top: 8px; font-weight: 400; font-size: 15px; line-height: 24px; text-align: center; }
.popup_type06.point_view_type .main_text em { font-weight: 500; color: #2aad5c; }

.popup_type07 { width: 312px; padding: 56px 24px 24px; text-align: center; border-radius: 24px; }
.popup_type07 .popup_title { font-weight: 700; font-size: 24px; line-height: 34px; }
.popup_type07 .popup_title em { color: #2aad5c; }
.popup_type07 .popup_title + .popup_text { margin-top: 12px; }
.popup_type07 .popup_text { font-weight: normal; font-size: 13px; line-height: 20px; margin-bottom: 32px; }
.popup_type07 .popup_btn { display: block; width: 100%; height: 64px; line-height: 64px; background-color: #2aad5c; border-radius: 12px; font-weight: bold; font-size: 15px; color: #fcfcfc; }
.popup_type07 .exit_popup { display: inline-block; width: 100%; font-weight: normal; font-size: 14px; line-height: 20px; text-decoration: underline; color: #ffffff; position: absolute; bottom: -32px; left: 50%; transform: translateX(-50%); }

.popup_type07.kakao_type { padding: 56px 24px 24px; }
.popup_type07.kakao_type .popup_text { font-weight: bold; font-size: 24px; line-height: 32px; margin-bottom: 26px; }
.popup_type07.kakao_type .popup_btn { background-color: #fae300; color: #222222; }
.popup_type07.kakao_type .exit_popup { position: static; color: #888888; text-align: center; display: block; transform: none; margin-top: 8px; line-height: 32px; }

.popup_type08 { width: 312px; padding: 48px 24px 24px; border-radius: 16px; text-align: center; position: relative; }
.popup_type08 .top_btn_area { position: absolute; top: 16px; left: 50%; width: calc(100% - 48px); transform: translateX(-50%); }
.popup_type08 .popup_title { display: inline-block; font-weight: bold; font-size: 24px; line-height: 32px; margin-bottom: 8px; }
.popup_type08 .popup_text { margin-bottom: 24px; font-weight: 400; font-size: 15px; line-height: 24px;  }
.popup_type08 .popup_text b { font-weight: 700; }
.popup_type08 .popup_text em { font-weight: 700; color: #2aad5c; }
.popup_type08 .popup_title + .popup_text { margin-bottom: 24px; }

.popup_type08 .popup_title + .popup_btn_area { margin-top: 24px; }
.popup_type08 .popup_text + .popup_btn_area { margin-top: 12px; }

.popup_type08 .popup_title { display: flex; justify-content: center; flex-direction: column; align-items: center; }
.popup_type08 .popup_title .label { background: rgba(42,173,92,0.1); border-radius: 30px; padding: 0 8px; height: 20px; line-height: 20px; font-weight: 700; font-size: 13px; color: #2aad5c; width: auto; display: inline-block; margin-bottom: 12px; }

.popup_type08 .popup_btn_area { display: flex; justify-content: space-between; max-width: 312px; margin: 12px auto 0; }
.popup_type08 .popup_btn_area button,
.popup_type08 .popup_btn_area a,
.popup_type08 .popup_btn_area input[type="button"],
.popup_type08 .popup_btn_area input[type="submit"] { display: inline-block; height: 56px; line-height: 56px; color: #ffffff; border-radius: 12px; font-weight: bold; font-size: 15px; }
.popup_type08 .popup_btn_area button:first-of-type,
.popup_type08 .popup_btn_area a:first-of-type,
.popup_type08 .popup_btn_area input[type="button"]:first-of-type,
.popup_type08 .popup_btn_area input[type="submit"]:first-of-type { width: 38%; background-color: #ffffff; border: 1px solid #2aad5c; color: #2aad5c; box-sizing: border-box; }
.popup_type08 .popup_btn_area button:last-of-type,
.popup_type08 .popup_btn_area a:last-of-type,
.popup_type08 .popup_btn_area input[type="button"]:last-of-type,
.popup_type08 .popup_btn_area input[type="submit"]:last-of-type { width: calc(62% - 8px); background-color: #2aad5c; }

.popup_type08 .popup_btn_area.style02 .btn { width: calc(50% - 4px); }
.popup_type08 .popup_btn_area.style02 .btn:first-child { background-color: #ffffff; border: 1px solid #2aad5c; color: #2aad5c; }

.popup_type08 .popup_btn_area.style03 .btn { width: calc(50% - 4px); }
.popup_type08 .popup_btn_area.style03 .btn:first-child { background-color: #2aad5c; color: #ffffff; }
.popup_type08 .popup_btn_area.style03 .btn:last-child { background-color: #ffffff; border: 1px solid #2aad5c; color: #2aad5c; }

.popup_type08 .popup_btn_area.type_one button,
.popup_type08 .popup_btn_area.type_one a,
.popup_type08 .popup_btn_area.type_one input[type="button"],
.popup_type08 .popup_btn_area.type_one input[type="submit"] { color: #ffffff; width:100%; }

.popup_type08 .popup_btn { width: 100%; height: 64px; line-height: 64px; background-color: #2aad5c; border-radius: 12px; font-weight: bold; font-size: 15px; line-height: 24px; color: #fcfcfc; }

.popup_type08-1 { width: 312px; padding: 56px 24px 24px; border-radius: 24px; text-align: center; }
.popup_type08-1 .popup_btn_area { display: flex; justify-content: space-between; }
.popup_type08-1 .popup_btn_area button,
.popup_type08-1 .popup_btn_area a,
.popup_type08-1 .popup_btn_area input[type="button"],
.popup_type08-1 .popup_btn_area input[type="submit"] { display: inline-block; height: 56px; line-height: 56px; color: #ffffff; border-radius: 12px; font-weight: bold; font-size: 16px; }
.popup_type08-1 .popup_btn_area button:first-of-type,
.popup_type08-1 .popup_btn_area a:first-of-type,
.popup_type08-1 .popup_btn_area input[type="button"]:first-of-type,
.popup_type08-1 .popup_btn_area input[type="submit"]:first-of-type { width: calc(50% - 4px); background-color: #d0d0d0; }
.popup_type08-1 .popup_btn_area button:last-of-type,
.popup_type08-1 .popup_btn_area a:last-of-type,
.popup_type08-1 .popup_btn_area input[type="button"]:last-of-type,
.popup_type08-1 .popup_btn_area input[type="submit"]:last-of-type { width: calc(50% - 4px); background-color: #2aad5c; }

.popup_type08-1 .scroll_area .title { font-weight: 700; font-size: 24px; line-height: 32px; }
.popup_type08-1 .scroll_area .title + .sub_text { margin-top: 16px; font-weight: 400; font-size: 14px; line-height: 20px; }
.popup_type08-1 .scroll_area .change_info_area { margin-top: 24px; display: flex; justify-content: space-between; align-items: flex-start; }
.popup_type08-1 .scroll_area .change_info_area .box + .box::before { content: ""; display: inline-block; width: 30px; height: 30px; position: absolute;  left: -20px; top: 75px; background-image: url(../image/icon_arrow_yellow.svg); background-repeat: no-repeat; background-position: center center; }

.popup_type08-1 .scroll_area .change_info_area .box { width: calc(50% - 4px); padding: 16px 4px; border-radius: 8px; position: relative; }
.popup_type08-1 .scroll_area .change_info_area .box:nth-child(1) { background-color: #eff0f6; }  
.popup_type08-1 .scroll_area .change_info_area .box:nth-child(2) { background-color: #2aad5c; }  
.popup_type08-1 .scroll_area .change_info_area .box .info_title { font-weight: 700; font-size: 16px; line-height: 19px; padding-bottom: 8px; display: inline-block; width: 96px; }
.popup_type08-1 .scroll_area .change_info_area .box:nth-child(1) .info_title { border-bottom: 1px dashed #888888; }
.popup_type08-1 .scroll_area .change_info_area .box:nth-child(2) .info_title { border-bottom: 1px dashed rgba(255,255,255,0.8); color: #ffffff; }
.popup_type08-1 .scroll_area .change_info_area .box .info_text { margin-top: 12px; font-weight: 700; font-size: 13px; line-height: 20px; }
.popup_type08-1 .scroll_area .change_info_area .box:nth-child(2) .info_text { color: #ffffff; }
.popup_type08-1 .scroll_area .change_info_area .box .info_text em { display: block; }
.popup_type08-1 .scroll_area .change_info_area .box .info_text em { font-weight: 400; font-size: 13px; line-height: 20px; }
.popup_type08-1 .scroll_area .change_info_area .box:nth-child(1) .info_text em { color: #888888; }
.popup_type08-1 .scroll_area .change_info_area .box:nth-child(2) .info_text em { color: rgba(255, 255, 255, 0.8); }
.popup_type08-1 .scroll_area .date_text { margin-top: 16px; font-weight: 700; font-size: 14px; line-height: 20px; letter-spacing: -0.1px; }
.popup_type08-1 .scroll_area .date_text em { color: #2aad5c; }
.popup_type08-1 .scroll_area .sub_guide_text { margin-top: 16px; text-align: left; font-weight: 400; font-size: 13px; line-height: 20px; color: #888888; }
.popup_type08-1 .scroll_area { margin-bottom: 24px; }

.popup_type08 .popup_title.type_pp { color: #2aad5c; }
.popup_type08 .popup_text.type_pp strong { color: #2aad5c; }
.popup_type08 .popup_text.type_pp { margin-bottom: 32px; }

.popup_type08-2 { width: 312px; padding: 32px 24px 24px; border-radius: 16px; text-align: center; }
.popup_type08-2 .popup_title { font-weight: 700; font-size: 20px; line-height: 28px; }
.popup_type08-2 .popup_text { margin-top: 4px; font-weight: 400; font-size: 15px; line-height: 22px; word-break: keep-all;; }
.popup_type08-2 .popup_text02 { margin-top: 4px; font-weight: 400; font-size: 16px; line-height: 24px; color: #363636; word-break: keep-all;; }
.popup_type08-2 .popup_btn_area { margin-top: 16px; }
.popup_type08-2 .popup_btn_area .btn { width: 100%; height: 54px; line-height: 54px; background-color: #2aad5c; border-radius: 12px; text-align: center; font-weight: 700; font-size: 15px; color: #ffffff; }
.popup_type08-2 .popup_sub_btn_area { position: absolute; bottom: -33px; left: 50%; transform: translateX(-50%); display: flex; justify-content: center; align-items: center; width: 100%; }
.popup_type08-2 .popup_sub_btn_area .btn_text { font-weight: 500; font-size: 14px; line-height: 17px; color: #ffffff; }
.popup_type08-2 .popup_sub_btn_area.type_block { display: block; text-align: center; bottom: -50px; }
.popup_type08-2 .popup_sub_btn_area .btn { font-weight: 500; font-size: 14px; line-height: 17px; color: #ffffff; border-bottom: 1px solid #ffffff; margin-left: 4px; }
.popup_type08-2 .popup_sub_btn_area.type_block .btn { margin-left: 0; }

.popup_type08-2 .popup_text_box { background-color: #f7f7f7; border-radius: 8px; padding: 8px; margin-top: 4px; }
.popup_type08-2 .popup_text_box .chk_list li { padding-left: 24px; background-image: url(../image/common/icon_chk01.svg); background-repeat: no-repeat; background-position: 3px 3px; font-weight: 400; font-size: 13px; line-height: 20px; }
.popup_type08-2 .popup_text_box .chk_list li + li { margin-top: 8px; }

.popup_type08-2 .popup_btn_area.type02 { display: flex; justify-content: space-between; }
.popup_type08-2 .popup_btn_area.type02 .btn:first-child { width: 54%; }
.popup_type08-2 .popup_btn_area.type02 .btn:last-child { width: calc(46% - 8px); background-color: #ffffff; border: 1px solid #2aad5c; color: #2aad5c; }

.popup_type08-2 .popup_btn_area.type03 { display: flex; justify-content: space-between; }
.popup_type08-2 .popup_btn_area.type03 .btn:first-child { width: calc(50% - 4px); background-color: #ffffff; border: 1px solid #2aad5c; color: #2aad5c; }
.popup_type08-2 .popup_btn_area.type03 .btn:last-child { width: calc(50% - 4px);  }

.popup_type08-2 .point_view { display: flex; align-items: center; }
.popup_type08-2 .point_view img { width: 40px; }
.popup_type08-2 .point_view p { font-weight: 700; font-size: 36px; line-height: 46px; color: #2aad5c; margin-left: 5px; }
.popup_type08-2 .point_view + .popup_title { margin-top: 16px; display: block; }

.popup_type09 { width: 312px; padding: 26px 24px 24px; border-radius: 24px; }
.popup_type09 .popup_title { display: inline-block; margin-top: 23px; font-weight: bold; font-size: 24px; line-height: 32px; }
.popup_type09 .popup_text { margin-top: 8px; font-weight: normal; font-size: 14px; line-height: 20px; color: #888888; margin-bottom: 24px; word-break: keep-all; }

.popup_type09 .popup_btn { width: 100%; border-radius: 12px; height: 64px; line-height: 64px; text-align: center; font-weight: bold; font-size: 15px; }
.popup_type09 .popup_btn:first-of-type { background-color: #2aad5c; color: #fcfcfc; }
.popup_type09 .popup_btn:last-of-type { border: 2px solid #2aad5c; margin-top: 12px; background-color: #ffffff; color: #2aad5c; box-sizing: border-box; }

.popup_type10 { width: 300px; text-align: center; padding: 24px 16px ; border-radius: 16px; }
.popup_type10.type_image { width: 312px; padding: 24px 24px; text-align: left; }
.popup_type10.type_exit_btn,
.popup_type10.type_image.type_exit_btn { padding-top: 16px; }
.popup_type10.type_exit_btn .popup_top_btn_area { display: flex; justify-content: flex-end; margin-bottom: 8px; }
.popup_type10.type_exit_btn .popup_top_btn_area .exit_btn { display: inline-block; width: 24px; height: 24px; background-image: url(../image/header/icon_detail_exit01.svg); background-repeat: no-repeat; background-position: center; background-size: 100%; text-indent: -99999px; overflow: hidden; }
.popup_type10 .popup_title { font-weight: 700; font-size: 20px; line-height: 28px; }
.popup_type10.type_image .popup_sub_copy { margin-top: 4px; font-weight: 400; font-size: 15px; line-height: 22px; color: rgba(34,34,34,0.72); }
.popup_type10.type_image .popup_sub_copy em { color: #2aad5c; }
.popup_type10.type_image .img_box_area { margin-top: 18px; display: flex; justify-content: space-between; }
.popup_type10.type_image .img_box_area .img_box { width:128px; height: 128px; position: relative; }
.popup_type10.type_image .img_box_area .img_box .img_inner_box { overflow: hidden; border-radius: 8px; }
.popup_type10.type_image .img_box_area .img_box .label { position: absolute; left: 8px; top: -11px; display: inline-block; font-weight: 700; font-size: 13px; color: #ffffff; width: 62px; text-align: center; height: 22px; line-height: 22px; border-radius: 30px; }
.popup_type10.type_image .img_box_area .img_box:first-child .label { background-color: #888888; }
.popup_type10.type_image .img_box_area .img_box:last-child .label { background-color: #BB95FF; }

.popup_type10 .contents_text_list { margin-top: 8px; padding: 8px; background-color: #f7f7f7; border-radius: 8px; text-align: left; }
.popup_type10 .contents_text_list p { display: flex; justify-content: flex-start; align-items: flex-start; font-weight: 400; font-size: 13px; line-height: 20px; }
.popup_type10 .contents_text_list p + p { margin-top: 4px; }
.popup_type10 .contents_text_list p i { display: inline-block; width:12px; height: 12px; min-width: 12px; background-image: url(../image/common/icon_chk01.svg); background-repeat: no-repeat; background-position: center; margin-right: 4px; margin-top: 4px; }

.popup_type10 .popup_btn_area { margin-top: 16px; display: flex; justify-content: space-between; }
.popup_type10 .popup_btn_area.type_one_way .btn { width: 100%; height: 56px; line-height: 56px; text-align: center; }
.popup_type10 .popup_btn_area .btn { height: 52px; line-height: 52px; font-size: 15px; }
.popup_type10 .popup_btn_area button,
.popup_type10 .popup_btn_area a,
.popup_type10 .popup_btn_area input[type="button"],
.popup_type10 .popup_btn_area input[type="submit"] { font-weight: bold; font-size: 15px; width: calc(50% - 4px); height: 64px; line-height: 64px; border-radius: 12px; }

.popup_type10 .popup_btn_area button:first-child,
.popup_type10 .popup_btn_area a:first-child,
.popup_type10 .popup_btn_area input[type="button"]:first-child,
.popup_type10 .popup_btn_area input[type="submit"]:first-child { background-color: #ffffff; border: 1px solid #2aad5c; box-sizing: border-box; color: #2aad5c; }

.popup_type10 .popup_btn_area button:last-child,
.popup_type10 .popup_btn_area a:last-child,
.popup_type10 .popup_btn_area input[type="button"]:last-child,
.popup_type10 .popup_btn_area input[type="submit"]:last-child { background-color: #2aad5c; color: #ffffff; }

.popup_type10 .sub_btn { position: absolute; bottom: -27px; left: 50%; transform: translateX(-50%); font-weight: 400; font-size: 13px; line-height: 19px; color: #ffffff; border-bottom: 1px solid #ffffff; }

.popup_type11 { width: 312px; border-radius: 16px; padding: 26px 24px 24px; }
.popup_type11 .popup_title { margin-top: 18px; display: block; font-weight: bold; font-size: 24px; line-height: 120%; color: #2e2e2e; }
.popup_type11 .popup_text { margin-top: 8px; font-weight: normal; font-size: 14px; line-height: 140%; }
.popup_type11 .popup_text .high { background-color: rgba(42,173,92,0.2); font-weight: bold; }
.popup_type11 .popup_sub_text { margin-top: 16px; padding-left: 28px; background-image: url(../image/icon_warning.svg); background-repeat: no-repeat; background-position: left top; }
.popup_type11 .popup_sub_text strong { display: block; font-weight: bold; font-size: 14px; line-height: 22px; text-decoration: underline; color: #888888; }
.popup_type11 .popup_sub_text strong + span { margin-top: 4px; display: block; display: flex; align-items: center; }
.popup_type11 .popup_sub_text span { font-weight: normal; font-size: 13px; line-height: 20px; color: #888888 }
.popup_type11 .popup_sub_text span em { color: #2aad5c; }
.popup_type11 img { display: block; margin: 30px auto 0; }
.popup_type11 .popup_btn { width: 100%; height: 64px; line-height: 64px; text-align: center; background-color: #2aad5c; border-radius: 12px; font-weight: bold; font-size: 15px; color: #fcfcfc; }
.popup_type11 .popup_sub_text i { display: inline-block; width: 14px; height: 14px; background-image: url(../image/icon_smile_grey.svg); background-repeat: no-repeat; background-position: center center; }

.popup_type13 { border-radius: 16px; padding: 16px 24px 24px; max-width: 408px; width: calc(100% - 48px); min-width: calc(360px - 24px); }

.popup_type13 .pop_btn_area { text-align: right; }
.popup_type13 .pop_exit{ display: inline-block; text-indent: -99999px; width: 24px; height: 24px; line-height: 24px; background-image: url(../image/intro_exit.svg); background-repeat: no-repeat; background-position: center center; background-size: contain; }

.popup_type13 .title_area { text-align: center; }
.popup_type13 .title_area .sub_title { font-weight: 400; font-size: 14px; line-height: 18px; color: #888888; margin-top: 8px; }

.popup_type13 .title_area .title_sub_text { margin-top: 12px; font-weight: 400; font-size: 14px; line-height: 20px; }
.popup_type13 .title_area .title_sub_text b { font-weight: 700; }
.popup_type13 .title_area .title { margin-top: 8px; font-weight: 700; font-size: 24px; line-height: 32px; }
.popup_type13 .chk_area { margin-top: 24px; }
.popup_type13 .chk_area .radio_area { position: relative; width: 100%; height: 70px; }
.popup_type13 .chk_area .radio_area + .radio_area { margin-top: 8px; }
.popup_type13 .chk_area .radio_area input[type="radio"] { display: none; }
.popup_type13 .chk_area .radio_area label { position: absolute; width: 100%; height: 100%; left: 0; top: 0; z-index: 1; }
.popup_type13 .chk_area.error .radio_area input[type="radio"] + .text_area { border: 1px solid #Fb5058; }

.popup_type13 .chk_area + .error_msg_area { height: 0; overflow: hidden; transition: height 0.5s, margin-top 0.5s; margin-top: 0; padding-left: 8px; }
.popup_type13 .chk_area.error + .error_msg_area { height: 20px; margin-top: 4px; }
.popup_type13 .chk_area + .error_msg_area .msg_text { display: inline-block; font-weight: 400; font-size: 13px; line-height: 20px; color: #FB5058; }
.popup_type13 .chk_area + .error_msg_area .msg_text { padding: 0; margin: 0; }

.popup_type13 .chk_area .radio_area input[type="radio"] + .text_area { background-color: #ffffff; border: 1px solid #eff0f6; border-radius: 12px; position: absolute; left: 0; top: 0; width: 100%; height: 100%; padding: 12px 0 12px 48px; background-image: url(../image/icon_radio01.svg); background-repeat: no-repeat; background-position: 16px 12px; background-size: 24px; }
.popup_type13 .chk_area .radio_area input[type="radio"] + .text_area .title { font-weight: 400; font-size: 16px; line-height: 24px; }
.popup_type13 .chk_area .radio_area input[type="radio"] + .text_area .text { margin-top: 4px; font-weight: 400; font-size: 14px; line-height: 18px; color: #888888; }

.popup_type13 .chk_area .radio_area input[type="radio"]:checked + .text_area { border: 1px solid #2aad5c; background-image: url(../image/icon_radio01_off.svg); }
.popup_type13 .chk_area .radio_area input[type="radio"]:checked + .text_area .title { font-weight: 700; font-size: 16px; line-height: 24px; }
.popup_type13 .chk_area .radio_area input[type="radio"]:checked + .text_area .text { color: #2aad5c; }
.popup_type13 .popup_btn_area { margin-top: 24px;  }
.popup_type13 .popup_btn_area .btn { width: 100%; display: inline-block; height: 56px; line-height: 56px; background-color: #2aad5c; border-radius: 12px; font-weight: 700; font-size: 16px; color: #fcfcfc; }
.popup_type13 .popup_btn_area .btn:disabled { background-color: #d0d0d0; }

.popup_type13 .popup_img_area { text-align: center; margin-top: 12px; }
/* 깜짝혜택 */
.popup_type13 .txt_box{ margin: 8px 0 30px; }
.popup_type13 .txt_box h3{ font-size: 20px; font-weight: 700; color: #222; margin-bottom: 4px; }
.popup_type13 .txt_box p{ font-size: 15px; font-weight: 400; color: #222; line-height: 22px; word-break: keep-all; }
.popup_type13 .point_box{ position: relative; padding: 12px 0 12px 45%; border-radius: 8px; background: #EFF0F6; }
.popup_type13 .point_box::after{ position: absolute; left: 5%; top: -15px; width: 86px; height: 80px; background: url(../image/icon_coin.svg) no-repeat center center; background-size: contain; content: ''; display: block; z-index: 1; }
.popup_type13 .point_box p{ font-size: 14px; font-weight: 500; color: #222; line-height: 22px; }
.popup_type13 .point_box strong{ font-size: 26px; font-weight: 700; color: #2aad5c; line-height: 34px; }
.popup_type13 .out_link{ position: absolute; left: 50%; bottom: -33px; transform: translateX(-50%); font-size: 14px; font-weight: 500; color: #fff; line-height: 17px; border-bottom: 1px solid #fff; display: inline-block; }



.popup.popup_type01.star_point_type .popup_btn { margin-top: 16px; }
.popup.popup_type01.star_point_type .popup_btn:disabled { background-color: #d0d0d0; }

.popup.popup_type12 { padding: 40px 24px 28px; border-radius: 16px; width: 312px; text-align: center; } 
.popup.popup_type12 .reservation_timer_type .timer { font-weight: 400; font-size: 15px; line-height: 20px; color: #2aad5c; }
.popup.popup_type12 .reservation_timer_type .popup_main_text { margin-top: 6px; font-weight: 700; font-size: 24px; line-height: 32px; }
.popup.popup_type12 .reservation_timer_type .popup_main_text em { color: #2aad5c; }
.popup.popup_type12 .reservation_timer_type .sub_text { margin-top: 12px; font-weight: 400; font-size: 14px; line-height: 24px; }
.popup.popup_type12 .reservation_timer_type .btn { display: inline-block; width: 100%; height: 56px; line-height: 56px; background-color: #2aad5c; border-radius: 12px; font-weight: 700; font-size: 16px; color: #fcfcfc; margin-top: 24px; }

.popup.nut_detail_type { background-color: transparent; width: calc(100% - 48px); max-height: 494px; max-width: 432px; }
.popup.nut_detail_type .top_btn_area .pop_exit { position: absolute; background-image: url(../image/icon_exit_w.svg); background-size: 14px; top: 16px; right: 16px; width: 24px; height: 24px; background-color: rgba(0,0,0,0.6); border-radius: 50%; background-repeat: no-repeat; z-index: 1; text-indent: -99999px; overflow: hidden; background-position: center;  }
.popup.nut_detail_type .popup_contents_area { overflow: hidden; background-color: #ffffff; border-radius: 24px; }
.popup.nut_detail_type .popup_contents_area::after { position: absolute; content: ""; display: inline-block; width: calc(100% - 34px); height: 48px; bottom: 0; left: 0; background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, #FFFFFF 68.02%); border-radius: 24px; }
.popup.nut_detail_type .popup_contents_area .img_area { width: 100%; height: 152px; overflow: hidden; position: relative; display: flex; align-items: center; justify-content: center; }
.popup.nut_detail_type .popup_contents_area .img_area img { display: inline-block; width: 100%; position: absolute; top: 50%; transform: translateY(-50%); max-width: none; }
.popup.nut_detail_type .popup_contents_area .text_area { padding: 24px 30px 0px; }
.popup.nut_detail_type .popup_contents_area .scroll_area { width: 100%; max-height: 318px; padding-bottom: 48px; overflow-y: scroll; padding-right: 8px; position: relative; }
.popup.nut_detail_type .popup_contents_area .scroll_area .bar_wrap { display: inline-block; position: absolute; width: 4px; height: 100%; right: 0; top: 0; background-color: transparent; overflow: hidden; }
.popup.nut_detail_type .popup_contents_area .scroll_area .bar { content:""; display: inline-block; position: absolute; width: 4px; right: 0; top: 0; border-radius: 2px; }
.popup.nut_detail_type .popup_contents_area .scroll_area::-webkit-scrollbar { display: none; }
.popup.nut_detail_type .popup_contents_area .tag_list { display: flex; justify-content: flex-start; flex-wrap: wrap; }
.popup.nut_detail_type .popup_contents_area .tag_list li  { display: inline-block; padding: 4px 8px; background-color: #f3f3f3; border-radius: 28px; font-weight: normal; font-size: 13px; margin-right: 8px; white-space: nowrap; margin-bottom: 4px; }
.popup.nut_detail_type .popup_contents_area .inner_text_area { margin-bottom: 32px; }
.popup.nut_detail_type .popup_contents_area .inner_text_area.top { margin-bottom: 40px; margin-top: 4px; }
.popup.nut_detail_type .popup_contents_area .inner_text_area.top .title { font-weight: bold; font-size: 24px; line-height: 24px; display: block; }
.popup.nut_detail_type .popup_contents_area .inner_text_area.top .sub_text { margin-top: 6px; font-weight: normal; font-size: 14px; line-height: 20px; display: block; }
.popup.nut_detail_type .popup_contents_area .inner_text_area.top .vol_text_area { display: block; margin-top: 2px; }
.popup.nut_detail_type .popup_contents_area .inner_text_area.top .vol_text { font-weight: normal; font-size: 13px; line-height: 22px; color: #888888; display: block; width: 100%; }
.popup.nut_detail_type .popup_contents_area .inner_text_area.top .price_area { display: block; display: block; text-align: right; width: 100%; margin-top: 12px; }
.popup.nut_detail_type .popup_contents_area .inner_text_area.top .price_area .date { font-weight: normal; font-size: 14px; line-height: 24px; color: #888888; display: inline-block; margin-right: 16px; }
.popup.nut_detail_type .popup_contents_area .inner_text_area.top .price_area .price { font-weight: bold; font-size: 20px; line-height: 24px; color: #222222; }

.popup.nut_detail_type .popup_contents_area .inner_text_area.top .price_area .price .cost { font-weight: 700; font-size: 14px; line-height: 24px; color: #888888; display: inline-block; margin-right: 8px; text-decoration: line-through; }

.popup.nut_detail_type .popup_contents_area .pick_text_area .top_tag { padding: 0 8px; background-color: #f3f3f3; border-radius: 28px; height: 24px; line-height: 24px; font-weight: normal; font-size: 13px; display: inline-block; }
.popup.nut_detail_type .popup_contents_area .pick_text_area .title { font-weight: bold; font-size: 18px; line-height: 26px; margin-top: 8px; display: block; }
.popup.nut_detail_type .popup_contents_area .pick_text_area .main_text { margin-top: 16px; font-weight: normal; font-size: 14px; line-height: 20px; }


.popup.nut_detail_type .popup_contents_area .nutrient_info_area { margin-top: 56px; }
.popup.nut_detail_type .popup_contents_area .nutrient_info_area .title { display: block; font-weight: bold; font-size: 18px; line-height: 22px; color: #363636; }
.popup.nut_detail_type .popup_contents_area .nutrient_info_area .intake { display: block; margin-top: 4px; font-weight: normal; font-size: 12px; line-height: 22px; }
.popup.nut_detail_type .popup_contents_area .nutrient_info_area ul { margin-top: 8px; }
.popup.nut_detail_type .popup_contents_area .nutrient_info_area .table_title { border-top: 1px solid #f3f3f3; border-bottom: 2px solid #f3f3f3; }
.popup.nut_detail_type .popup_contents_area .nutrient_info_area li { display: flex; justify-content: space-between; border-bottom: 1px solid #f3f3f3; }
.popup.nut_detail_type .popup_contents_area .nutrient_info_area li strong,
.popup.nut_detail_type .popup_contents_area .nutrient_info_area li span { font-weight: normal; font-size: 13px; line-height: 22px; color: #363636; }
.popup.nut_detail_type .popup_contents_area .nutrient_info_area .table_sub_text { margin-top: 8px; font-weight: normal; font-size: 12px; line-height: 22px; }

.popup.nut_detail_type .popup_contents_area .inner_text_area.footer { margin-bottom: 0; }
.popup.nut_detail_type .popup_contents_area .inner_text_area.footer .logo_list { display: flex; justify-content: flex-start; margin-top: 8px; }
.popup.nut_detail_type .popup_contents_area .inner_text_area.footer .logo_list li { margin-right: 4px; }
.popup.nut_detail_type .popup_contents_area .inner_text_area.footer .logo_list li img { width: 32px; }
.popup.nut_detail_type .popup_contents_area .inner_text_area.footer p { margin-top: 32px; font-weight: normal; font-size: 12px; line-height: 18px; color: #888888; }

.popup.popup_type01.share_type { padding: 24px 44px;  border-radius: 24px; background-color: #fcfcfc; width: 312px; height: 226px; }
.popup.popup_type01.share_type .title { margin: 0px; display: block; font-weight: bold; font-size: 20px; line-height: 32px; letter-spacing: 1px; position: absolute; top: 32px; left: 50%; transform: translateX(-50%); width: auto; white-space: nowrap; }
.popup.popup_type01.share_type .btn_list { margin-top: 40px; display: flex; justify-content: center; }
.popup.popup_type01.share_type .btn_list li { display: inline-block; }
.popup.popup_type01.share_type .btn_list li:first-of-type { margin-right: 52px; }
.popup.popup_type01.share_type .btn_list li .kakao,
.popup.popup_type01.share_type .btn_list li .url { width: 63px; text-align: center; }
.popup.popup_type01.share_type .btn_list li .kakao i,
.popup.popup_type01.share_type .btn_list li .url i { display: inline-block; width: 60px; height: 60px; border-radius: 50%; background-repeat: no-repeat; background-position: center; }
.popup.popup_type01.share_type .btn_list li .kakao i { background-color: #fae300; background-image: url(../image/icon_kakao.svg); }
.popup.popup_type01.share_type .btn_list li .url i { background-color: #f3f3f3; background-image: url(../image/icon_url.svg); }
.popup.popup_type01.share_type .btn_list li .kakao span,
.popup.popup_type01.share_type .btn_list li .url span { display: block; margin-top: 8px; font-weight: 500; font-size: 16px; line-height: 30px; }


.popup.popup_type01.star_point_type { padding: 22px 24px 24px;  border-radius: 24px; background-color: #fcfcfc; width: 312px; height: auto; }
.popup.popup_type01.star_point_type .title { margin-top: 8px; display: block; font-weight: bold; font-size: 24px; line-height: 32px; letter-spacing: 1px; }
.popup.popup_type01.star_point_type .btn_list { margin-top: 36px; display: flex; justify-content: center; }
.popup.popup_type01.star_point_type .sub_text { margin-top: 8px; display: block; font-weight: normal; font-size: 15px; line-height: 24px;  }
.popup.popup_type01.star_point_type .star_point_area { margin: 20px auto 0; display: flex; width: 255px; height: 32px; justify-content: space-between; align-items: center; }
.popup.star_point_type .star_point_area .click_area { position: relative; }
.popup.star_point_type .star_point_area .chkbox_area { display: flex; justify-content: space-between; width: 208px; }
.popup.star_point_type .star_point_area .chkbox_area .star_box { width: 32px; height: 32px; display: flex;justify-content: space-between; }
.popup.star_point_type .star_point_area .chkbox_area .star_chk { width: 16px; height: 100%; opacity: 0; margin: 0; padding: 0; cursor: pointer; }
.popup.star_point_type .star_point_area .point_text_area { font-weight: 500; font-size: 20px; line-height: 24px; color: #888888; }

.popup.star_point_type .star_img_area { width: 100%; display: flex; justify-content: space-between; position: absolute; left: 0; top: 0; }
.popup.star_point_type .star_img_area i { display: inline-block; width: 32px; height: 32px; background-image: url(../image/icon_star_gray.svg); background-repeat: no-repeat; background-position: center center; }
.popup.star_point_type .star_img_area i.half { background-image: url(../image/icon_star_half.svg); }
.popup.star_point_type .star_img_area i.full { background-image: url(../image/icon_star_full.svg); }

.popup.popup_event01 { width: 312px; border-radius: 8px; overflow: hidden; background-color: #ffffff; }
.popup.popup_event01 .bot_btn_area { width: 100%; display: flex; justify-content: space-between; align-items: center; padding: 0 24px; height: 44px; }
.popup.popup_event01 .bot_btn_area .input_area { width: auto; }
.popup.popup_event01 .bot_btn_area .input_area input[type="checkbox"] { display: none; }

.popup.popup_event01 .bot_btn_area .input_area input[type="checkbox"] + label::after { content: ""; display: inline-block; width: 24px; height: 24px; position: absolute; background-image: url(../image/icon/agree_chk.svg); background-repeat: no-repeat; background-position: center; box-sizing: 24px; left: 0; top: 50%; transform: translateY(-50%); }
.popup.popup_event01 .bot_btn_area .input_area input[type="checkbox"]:checked + label::after { background-image: url(../image/icon/agree_chk_on.svg); }
.popup.popup_event01 .bot_btn_area .input_area input[type="checkbox"] + label { margin: 0; padding-left: 28px; font-weight: 400; font-size: 14px; line-height: 24px; color: #222222; height: 24px; display: inline-block; margin-bottom: 0; position: relative; }
.popup.popup_event01 .bot_btn_area .pop_exit { width:auto; font-weight: 400; font-size: 14px; line-height: 20px; color: #222222; height: 20px; }

.popup.type_solution01 { width: calc(100% - 48px); padding: 16px 24px 24px; border-radius: 16px; max-width: 432px; }
.popup.type_solution01 .popup_header { width: 100%; display: flex; justify-content: space-between; align-items: center; }
.popup.type_solution01 .label { display: inline-block; padding: 0 8px; height: 19px; line-height: 19px; background-color: rgba(42,173,92,0.1); border-radius: 30px; font-weight: 700; font-size: 13px; color: #2aad5c; }
.popup.type_solution01 .exit_btn { display: inline-block; width: 24px; height: 24px; background-image: url(../image/icon_del01.svg); background-repeat: no-repeat; background-position: center; background-size: contain;  }
.popup.type_solution01 .graph { width: 214px; height: 107px; margin: 0 auto; }
.popup.type_solution01 .contents_text { text-align: center; margin-top: 24px; }
.popup.type_solution01 .contents_text .title { font-weight: 700; font-size: 18px; line-height: 24px; }
.popup.type_solution01 .contents_text .text { margin-top: 4px; font-weight: 400; font-size: 14px; line-height: 20px; }
.popup.type_solution01 .main_btn { margin-top: 12px; display: inline-block; width: 100%; background-color: #2aad5c; border-radius: 12px; background-color: #2aad5c; height: 56px; line-height: 56px; font-weight: 700; font-size: 14px; color: #ffffff; }

.blur_wrap { display: none; width: calc(100% - 48px); height: auto; position: absolute; top:152px; left: 0; background-color: rgba(0,0,0,0.4); z-index: 10000; }
.blur_wrap.on { display: inline-block; }
.blur_wrap .blur_popup { display: inline-block; width: 408px; height: auto; background-color: #ffffff; border-radius: 24px; position: absolute; left: 50%; transform: translateX(-50%); top: 147px; text-align: center; padding: 49px 24px 49px; }
.blur_wrap .blur_popup p { font-weight: bold; font-size: 20px; line-height: 24px; }
.blur_wrap .blur_popup .popup_btn { margin-top: 40px; width: 100%; height: 64px; line-height: 64px; background-color: #2aad5c; border-radius: 12px; font-weight: bold; font-size: 18px; color: #fcfcfc;  }

/* Graph */
.graph.type01 { position: relative; }
.graph.type01 .graph_wrap { overflow: hidden; position: relative; width: 100%; height: 100%; }

.graph.type01 .graph_wrap *,
.graph.type01 .graph_wrap::before { box-sizing: border-box; }
.chart-skills::before { position: absolute; content: ''; width: inherit; height: inherit; border: 45px solid rgba(211, 211, 211, .3); border-bottom: none; border-top-left-radius: 175px; border-top-right-radius: 175px; }
.graph.type01 .graph_wrap .graph_bg { position: absolute; top: 100%; left: 0;  width: inherit; height: inherit; border: 8px solid; border-top: none; border-bottom-left-radius: 175px; border-bottom-right-radius: 175px; transform-origin: 50% 0; z-index: 1; border-color: #2aad5c; transform: rotateZ(180deg); border-color: rgba(42,173,92,0.1); z-index: 1; }
.graph.type01 .graph_wrap .graph_bar { position: absolute; top: 100%; left: 0;  width: inherit; height: inherit; border: 8px solid; border-top: none; border-bottom-left-radius: 175px; border-bottom-right-radius: 175px; transform-origin: 50% 0; z-index: 2; border-color: #2aad5c; }
.graph.type01 .graph_wrap .graph_bar.type80 { -webkit-animation: chartAni80 2s linear 1 forwards; animation: chartAni80 2s linear 1 forwards; }
.graph.type01 .graph_wrap .graph_bar.type100 { -webkit-animation: chartAni100 2s linear 1 forwards; animation: chartAni100 2s linear 1 forwards; }
.graph.type01 .graph_text_area { position: absolute; left: 0; top: 0; width: 100%; height: 100%; display: flex; flex-direction: column; align-items: center; justify-content: flex-end; margin-bottom: 4px; }
.graph.type01 .graph_text_area .percent_text { font-weight: 700; font-size: 32px; line-height: 38px; }
.graph.type01 .graph_text_area .percent_text::after { content: "%"; }
.graph.type01 .graph_text_area span { font-weight: 400; font-size: 13px; line-height: 20px; }

@-webkit-keyframes chartAni80 {
    0%{-webkit-transform: rotateZ(0); transform: rotateZ(0);}
    26%{-webkit-transform: rotateZ(140deg); transform: rotateZ(140deg)}
    100%{-webkit-transform: rotateZ(140deg); transform: rotateZ(140deg)}
}

@-webkit-keyframes chartAni100 {
    0%{-webkit-transform: rotateZ(0); transform: rotateZ(0);}
    26%{-webkit-transform: rotateZ(180deg); transform: rotateZ(180deg)}
    100%{-webkit-transform: rotateZ(180deg); ransform: rotateZ(180deg)}
}

@keyframes chartAni80 {
    0%{-webkit-transform: rotateZ(0); transform: rotateZ(0);}
    26%{-webkit-transform: rotateZ(140deg); transform: rotateZ(140deg)}
    100%{-webkit-transform: rotateZ(140deg); transform: rotateZ(140deg)}
}

@keyframes chartAni100 {
    0%{-webkit-transform: rotateZ(0); transform: rotateZ(0);}
    26%{-webkit-transform: rotateZ(180deg); transform: rotateZ(180deg)}
    100%{-webkit-transform: rotateZ(180deg); transform: rotateZ(180deg)}
}


/* Viewer Custom */
html .viewer-toolbar .viewer-one-to-one,
html .viewer-toolbar .viewer-prev,
html .viewer-toolbar .viewer-play,
html .viewer-toolbar .viewer-next,
html .viewer-toolbar .viewer-rotate-left,
html .viewer-toolbar .viewer-rotate-right,
html .viewer-toolbar .viewer-flip-horizontal,
html .viewer-toolbar .viewer-flip-vertical,
html .viewer-title { display: none; }
html .viewer-backdrop { background-color: rgba(0,0,0,0.7); }
html .viewer-toolbar > ul { display: flex; justify-content: center; margin-bottom: 48px; }
html .viewer-toolbar > ul > li { width: 48px; height: 48px; background-color: transparent; background-repeat: no-repeat; background-position: center; background-size: 48px; margin-right: 12px; }
html .viewer-toolbar > ul > li.viewer-zoom-in { background-image: url(../image/icon_viewer_zoomin.svg); order: 1; margin: 0; }
html .viewer-toolbar > ul > li.viewer-zoom-out { background-image: url(../image/icon_viewer_zoomout.svg); }
html .viewer-toolbar > ul > li.viewer-reset { background-image: url(../image/icon_viewer_reset.svg); }

html .viewer-toolbar > ul > li::before { display: none; }
html .viewer-button { top: 16px; right: 16px; width: 32px; height: 32px; background-color: #4d4d4d; border-radius: 50%; background-image: url(../image/icon_viewer_exit.svg); background-repeat: no-repeat; background-position: center center; }
html .viewer-button::before { display: none; }


/* 포인트 */
main.sub_main_area .side_nav .point_view_area { margin-top: 16px; width: 100%; padding: 16px 24px; box-sizing: border-box; border-radius: 8px; background-color: #ffffff; border: 1px solid #d9dbe9; box-sizing: border-box; display: flex; flex-direction: column; justify-content: flex-start; align-items: flex-start; background-image: url(../image/icon_arrow_black.svg); background-repeat: no-repeat; background-position: calc(100% - 16px) 16px; background-size: 24px; }
main.sub_main_area .side_nav .point_view_area .title { font-weight: 700; font-size: 15px; line-height: 22px; }
main.sub_main_area .side_nav .point_view_area .point { font-weight: 700; font-size: 22px; line-height: 30px; color: #2aad5c; }

main.sub_main_area .side_nav .point_coupon_view_area { margin-top: 12px; }

/* 로딩창 */
.loading_dim { display: none; position: fixed; width: 100%; height: 100%; left: 0; top: 0; z-index: 9999; }
.loading_dim.on { display: block; }
.loading_dim::after { position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.6); content: ''; display: block; }
.loading_dim::before { position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: #ffffff; content: ''; display: block; }
.loading_dim .gif_loading { display: inline-block; width: 250px; height: 250px; display: block; position: absolute; left: 50%;  top: 50%; transform: translate(-50%, -50%); }
.loading_dim #lottie_loading { width: 150px; height: 150px; display: block; position: absolute; left: 50%;  top: 50%; transform: translate(-50%, -50%); }
.loading_dim #lottie_loading canvas { display: inline-block; }

.loading_popup { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); width: calc(100% - 48px); min-width: 312px; max-width: 432px; padding: 24px; text-align: center; background: #ffffff; border-radius: 16px; z-index: 9999; }
.loading_popup p { font-size: 18px; font-weight: 400; color: #222222; line-height: 24px; word-break: keep-all; }
.loading_popup .icon_box { width: 100%; margin-bottom: 12px; }
.loading_popup .icon_box .icon_survey { display: inline-block; width: 42px; height: 57px; background: url(../image/icon_loading_survey.svg) no-repeat center center; background-size: 42px; animation: down 1.5s infinite; -webkit-animation: down 1.5s infinite; }
.loading_popup .icon_box .icon_loading { position: relative; display: inline-block; width: 50px; height: 50px; border-radius: 50%; overflow: hidden; }
.loading_popup .icon_box .icon_loading::before { position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: #ffffff; border-right: 3px solid #222222; border-left: 3px solid #222222; border-top: 3px solid #ffffff; border-bottom: 3px solid #ffffff; border-radius: 25px; box-sizing: border-box; animation: rotation 1s ease-in-out infinite; -webkit-animation: rotation 1s ease-in-out infinite; transition: all 0.5s ease-in-out; content: ''; display: block; }
.loading_popup .icon_box .icon_loading::after { position: absolute; left: 50%; top: 45%; width: 0; height: 0; transform: translate(-50%, -50%) rotate(45deg); transition: all 0.35s ease-in-out 0.2s; content: ''; display: block; }
.loading_popup .icon_box.finished .icon_loading::before { border: 3px solid #222222; background: #222222; }
.loading_popup .icon_box.finished .icon_loading::after { opacity: 1; width: calc(50px / 6); height: calc(50px / 2.5); border-color: #ffffff; border-width: 0 3px 3px 0; border-style: solid; }

/* icon_survey 애니메이션 */
@keyframes down {
	0% { transform: translate(0); }
	20% { transform: translateY(5px); }
	40% { transform: translate(0); }
}
@-webkit-keyframes down {
	0% { transform: translate(0); }
	20% { transform: translateY(5px); }
	40% { transform: translate(0); }
}
/* icon_loading 애니메이션 */
@keyframes rotation {
    0% { transform: rotate(0deg) }
    100% { transform: rotate(360deg) }
}
@-webkit-keyframes rotation {
    0% { transform: rotate(0deg) }
    100% { transform: rotate(360deg) }
}

/* 토스트 팝업 */
.toast_dim { display: none; position: fixed; left: 0; top: 0; width: 100%; height: 100%; background: linear-gradient(0deg, rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.7)), #FFFFFF; opacity: 0.7; z-index: 2100; }
.toast_dim.active { display: block; }
.toast_wrap { display: none; position: fixed; left: 0; top: 0; width: 100%; height: 100%; z-index: 2102; }
.toast_wrap.active { display: block; }
.toast_wrap .toast_popup { position: fixed; bottom: -238px; width: 100%; max-width: 480px; left: 50%; transform: translateX(-50%); background-color: #ffffff; border-radius: 16px 16px 0 0; padding: 47px 24px 28px; z-index: 2105; transition: bottom 0.5s; padding-bottom: 28px; padding-bottom: calc(constant(safe-area-inset-bottom) + 28px); padding-bottom:  calc(env(safe-area-inset-bottom) + 28px); }
.toast_wrap .toast_popup.active { display: block; bottom: 0; }
.toast_wrap .bg_exit { width: 100%; position: absolute; left: 0; top: 0; height: 100%; }
.toast_wrap .toast_popup .exit_btn { width: 24px; height: 24px; display: inline-block; background-image: url(../image/icon_del01.svg); background-repeat: no-repeat; background-position: center; background-size: 24px; position: absolute; top: 24px; right: 24px; }
.toast_wrap .toast_popup .contents_area .title { text-align: center; font-weight: 700; font-size: 20px; line-height: 32px; }
.toast_wrap .toast_popup .contents_area .text_box { margin-top: 16px; padding: 14px; background-color: #eff0f6; border-radius: 12px; }
.toast_wrap .toast_popup .contents_area .text_box p { font-weight: 500; font-size: 14px; line-height: 22px; color: #2aad5c; }

.toast_wrap .toast_popup.typeA { position: fixed; bottom: -100%; width: 100%; height: auto; max-height: calc(100% - 44px); padding: 48px 24px 24px; border-radius: 20px 20px 0 0; transition: bottom 0.5s; padding-bottom: calc(constant(safe-area-inset-bottom) + 24px); padding-bottom: calc(env(safe-area-inset-bottom) + 24px); }
.toast_wrap .toast_popup.typeA.type_scroll { padding: 0px 24px 0px; max-height: calc(100% - 44px); overflow-y: scroll; }
.toast_wrap .toast_popup.typeA.type_scroll::-webkit-scrollbar { display: none; }
.toast_wrap .toast_popup.typeA.active { bottom: 0; top: unset; }
.toast_wrap .toast_popup.typeA .exit_btn { top: 16px; }

.toast_wrap .toast_popup.typeA.type_scroll .top_area { position: sticky; top: 0; height: 46px; width: 100%; background-color: #ffffff; }
.toast_wrap .toast_popup.typeA.type_scroll .popup_title { display: inline-block;  left: 50%; top: 12px; font-weight: 700; font-size: 16px; line-height: 22px; transform: translateX(-50%); position: absolute; }
.toast_wrap .toast_popup.typeA.type_scroll .exit_btn { top: 12px; right: 0; }

.toast_wrap .toast_popup.typeA .contents_area .text_box { width: 100%; }
.toast_wrap .toast_popup.typeA .contents_area .title { font-size: 24px; line-height: 34px; }
.toast_wrap .toast_popup.typeA .contents_area .title em { color: #2aad5c; }

.toast_wrap .toast_popup.typeA .contents_area .sub_text_list { margin-top: 8px; font-weight: 400; font-size: 15px; line-height: 22px; color: #888888; }
.toast_wrap .toast_popup.typeA .contents_area .sub_text_list li { position: relative; padding-left: 24px; position: relative; word-break: keep-all; }
.toast_wrap .toast_popup.typeA .contents_area .sub_text_list li::after { content: ""; width: 3px; height: 3px; display: inline-block; position: absolute; left: 10px; top: 8px; background-color: #888888; border-radius: 50%; }

.toast_wrap .toast_popup.typeA .contents_area .text_box p { font-weight: 500; font-size: 15px; line-height: 22px; color: #222222; text-align: center; }
.toast_wrap .toast_popup.typeA .contents_area .text_box p em { font-weight: 700; color: #2aad5c; }
.toast_wrap .toast_popup.typeA .contents_area .text_box ul { font-weight: 500; font-size: 15px; line-height: 22px; }
.toast_wrap .toast_popup.typeA .contents_area .text_box ul li { padding-left: 24px; position: relative; word-break: keep-all; }
.toast_wrap .toast_popup.typeA .contents_area .text_box ul li::after { content: ""; width: 3px; height: 3px; display: inline-block; position: absolute; left: 10px; top: 8px; background-color: #222222; border-radius: 50%; }
.toast_wrap .toast_popup.typeA .bot_btn_area { margin-top: 24px; }

.toast_wrap .toast_popup.typeA.type_scroll .contents_area.type_product_detail { max-height: 100%; padding-bottom: 12px; }


.toast_wrap .toast_popup.typeA.type_scroll .contents_area.type_product_detail .contents_title { font-weight: 700; font-size: 14px; line-height: 20px; }
.toast_wrap .toast_popup.typeA.type_scroll .contents_area.type_product_detail table { margin-top: 4px; } 
.toast_wrap .toast_popup.typeA.type_scroll .contents_area.type_product_detail table + table { margin-top: 30px; }
.toast_wrap .toast_popup.typeA.type_scroll .contents_area.type_product_detail table th,
.toast_wrap .toast_popup.typeA.type_scroll .contents_area.type_product_detail table td { border-top: 1px solid rgba(34,34,34,0.1); padding: 8px; text-align: left; }
.toast_wrap .toast_popup.typeA.type_scroll .contents_area.type_product_detail table th { background-color: rgba(34,34,34,0.06); font-weight: 400; font-size: 13px; vertical-align: top; }
.toast_wrap .toast_popup.typeA.type_scroll .contents_area.type_product_detail table td { font-weight: 400; font-size: 13px; line-height: 20px; color: rgba(34,34,34,0.7); }
.toast_wrap .toast_popup.typeA.type_scroll .contents_area.type_product_detail table.type_unit td .unit_box { display: flex; justify-content: space-between; width: 100%; }
.toast_wrap .toast_popup.typeA.type_scroll .contents_area.type_product_detail .table_sub_text { font-weight: 400; font-size: 12px; line-height: 20px; }
.toast_wrap .toast_popup.typeA.type_scroll .contents_area.type_product_detail .table_sub_text + table { margin-top: 30px; }

.toast_wrap .toast_popup.typeA.type_normal { padding-top: 32px; }
.toast_wrap .toast_popup.typeA.type_normal .contents_title { font-weight: 700; font-size: 18px; line-height: 24px; }
.toast_wrap .toast_popup.typeA.type_normal .contents_title .title_sub_text { font-weight: 400; font-size: 13px; line-height: 20px; color: rgba(34,34,34,0.7); display: block; }
.toast_wrap .toast_popup.typeA.type_normal .contents_text { margin-top: 16; font-weight: 400; font-size: 14px; line-height: 20px; }
.toast_wrap .toast_popup.typeA.type_normal .main_btn { margin-top: 24px; width: 100%; display: inline-block; height: 56px; line-height: 56px; background-color: #2aad5c; border-radius: 12px; font-weight: 700; font-size: 15px; color: #ffffff; }

.toast_wrap .toast_popup.typeA.type_category_select { padding: 24px; }
.toast_wrap .toast_popup.typeA.type_category_select .none_category_select .title { text-align: left; }
.toast_wrap .toast_popup.typeA.type_category_select .none_category_select .sub_text { margin-top: 12px; font-weight: 400; font-size: 16px; line-height: 20px; color: rgba(34,34,34,0.7); }

.toast_wrap .toast_popup.typeA.type_category_select .none_category_select .img_title_wrap { display: flex; justify-content: space-between; align-items: flex-start; }
.toast_wrap .toast_popup.typeA.type_category_select .none_category_select .title_area .sub_text { margin-top: 2px; font-weight: 400; font-size: 14px; line-height: 20px; color: rgba(34,34,34,0.7); }
.toast_wrap .toast_popup.typeA.type_category_select .none_category_select .img_title_wrap > img { width: 62px; }
.toast_wrap .toast_popup.typeA.type_category_select .none_category_select .contents_box { margin-top: 16px; background-color: #f3f3f3; border-radius: 0px 8px 8px 8px; padding: 10px 8px; display: flex; flex-direction: column; justify-content: center; align-items: center; }
.toast_wrap .toast_popup.typeA.type_category_select .none_category_select .contents_box img { width: 26px; }
.toast_wrap .toast_popup.typeA.type_category_select .none_category_select .contents_box .box_text { margin-top: 4px; font-weight: 400; font-size: 13px; line-height: 20px; text-align: center; }
.toast_wrap .toast_popup.typeA.type_category_select.guide_point::after { position: absolute; content: ""; display: inline-block; width: 5px; height: 5px; background-color: #ffffff; border-radius: 50%; top: -2px; right: 155px; }

.toast_wrap .toast_popup.typeA.type_category_select .bot_btn_area { margin-top: 14px; }
.toast_wrap .toast_popup.typeA.type_category_select .bot_btn_area.type_2btnB { display: flex; flex-direction: column; }
.toast_wrap .toast_popup.typeA.type_category_select .bot_btn_area.type_2btnB .btn:first-child { width: 100%; background-color: #2aad5c; color: #ffffff; }
.toast_wrap .toast_popup.typeA.type_category_select .bot_btn_area.type_2btnB .btn:last-child { margin-top: 12px; background-color: #ffffff; height: 16px; font-weight: 400; font-size: 13px; line-height: 16px; color: rgba(34,34,34,0.48); border: 0; border-bottom: 1px solid rgba(34,34,34,0.48); width: auto; border-radius: 0; }

.toast_wrap .toast_popup.typeA.type_category_select .main_exit_btn { position: absolute; right: 24px; top: 24px; display: inline-block; width: 24px; height: 24px; background-image: url(../image/header/icon_detail_exit01.svg); background-repeat: no-repeat; background-position: center; text-indent: -99999px; overflow: hidden; }
.toast_wrap .toast_popup.typeA.type_category_select .title .top_text { font-weight: 700; font-size: 16px; line-height: 34px; }

.toast_wrap .toast_popup.typeA.type_category_select .certi_select_area { margin-top: 12px; }
.toast_wrap .toast_popup.typeA.type_category_select .certi_select_area input[type="radio"] { display: none; }
.toast_wrap .toast_popup.typeA.type_category_select .certi_select_area li + li { margin-top: 4px; }
.toast_wrap .toast_popup.typeA.type_category_select .certi_select_area .text_wrap { display: inline-block; width: 100%; height: 74px; background-color: #ffffff; border: 1px solid #d0d0d0; border-radius: 12px; padding: 16px 40px; text-align: left; }
.toast_wrap .toast_popup.typeA.type_category_select .certi_select_area .text_wrap .title_wrap { display: flex; justify-content: flex-start; align-items: center; }
.toast_wrap .toast_popup.typeA.type_category_select .certi_select_area .text_wrap .title_wrap .title { font-weight: 700; font-size: 14px; line-height: 22px; }
.toast_wrap .toast_popup.typeA.type_category_select .certi_select_area .text_wrap .title_wrap .img_wrap { display: flex; align-items: center; margin-left: 12px; }
.toast_wrap .toast_popup.typeA.type_category_select .certi_select_area .text_wrap .title_wrap .img_wrap img { width: 21px; height: 21px; }
.toast_wrap .toast_popup.typeA.type_category_select .certi_select_area .text_wrap .title_wrap .img_wrap img + img { margin-left: 4px; }
.toast_wrap .toast_popup.typeA.type_category_select .certi_select_area .text_wrap .sub_text { font-weight: 400; font-size: 13px; line-height: 20px; margin-top: 0; }

.toast_wrap .toast_popup.typeA.type_category_select .certi_select_area .text_wrap.point { border-color: #2aad5c; background-color: #2aad5c; color: #ffffff; }
.toast_wrap .toast_popup.typeA.type_category_select .certi_select_area .text_wrap.point .sub_text { color: #ffffff; }

.toast_wrap .toast_popup.typeB.type_check .exit_btn { top: 12px;  }

.toast_wrap .toast_popup.typeB.type_check .title { font-style: normal; font-weight: 700; font-size: 18px; line-height: 24px; text-align: left; color: #000000; }
.toast_wrap .toast_popup.typeB.type_check .title em { color: #FF8D8D;  }

.toast_wrap .toast_popup.typeB.type_check .guide_area { margin:18px 0px 8px; display: flex; flex-direction: column; align-items: center; padding: 12px; gap: 8px; background: #F2F4F6; border-radius: 8px; font-style: normal; font-weight: 700; font-size: 16px; line-height: 24px; text-align: center; color: #222222; }
.toast_wrap .toast_popup.typeB.type_check .guide_area p.sub { font-style: normal; font-weight: 400; font-size: 14px; line-height: 26px; color: #222222; }

.toast_wrap .toast_popup.typeB.type_check .guide_area p.sub span { display:inline-block; padding: 0px 6px; height: 20px;  border-radius: 50px; font-style: normal; font-weight: 600; font-size: 14px; line-height: 20px; text-align: center; }
.toast_wrap .toast_popup.typeB.type_check .guide_area p.sub span.red { background: #FFE4E5;  color: #E04F4F; }
.toast_wrap .toast_popup.typeB.type_check .guide_area p.sub span.blue { background: #D0F7FF;  color: #1077AB; }

.toast_wrap .toast_popup.typeB.type_check ul { font-style: normal; font-weight: 400; font-size: 14px; line-height: 22px; }
.toast_wrap .toast_popup.typeB.type_check ul li { margin-bottom:8px; padding:0 0 0 34px; background-image: url(../image/common/icon_pop_check_purple.svg); background-repeat: no-repeat; background-position: center left; }
.toast_wrap .toast_popup.typeB.type_check ul li:last-of-type { margin-bottom: 0; }

.toast_wrap .toast_popup.typeB .top_area .title { top: 24px; position: absolute; font-weight: 700; font-size: 20px; line-height: 25px; color: #222222; }
.toast_wrap .toast_popup.typeB .top_area .sub_text { font-style: normal; font-weight: 400; font-size: 16px;line-height: 25px; color: rgba(34, 34, 34, 0.72);  }

.toast_wrap .toast_popup.typeB.type_guide { }
.toast_wrap .toast_popup.typeB.type_guide .title { margin-top: 8px; margin-bottom:16px; font-style: normal; font-weight: 700; font-size: 26px; line-height: 34px; text-align: left; color: #000000; }
.toast_wrap .toast_popup.typeB.type_guide .title em { color: #128DFF; }

.toast_wrap .toast_popup.typeB.type_guide.active { bottom: 0; top: unset; }
.toast_wrap .toast_popup.typeB.type_guide > div { text-align:center; }
.toast_wrap .toast_popup.typeB.type_guide > div > img { max-width: 352px; width:calc(100% - 136px); margin: 0 auto; }
.toast_wrap .toast_popup.typeB.type_guide ul.info_box_list { display: grid; margin-top: 16px; gap: 8px; grid-template-columns: repeat(2, 1fr);}
.toast_wrap .toast_popup.typeB.type_guide ul.info_box_list li {	padding: 10px 8px; background: #F7F8FB; border-radius: 8px; height: 65px; display: flex; flex-direction: row; }
.toast_wrap .toast_popup.typeB.type_guide ul.info_box_list li i { margin-top: 3px; margin-right:5px; display:inline-block; width: 18px; height:18px; background-repeat: no-repeat; background-position: center;  }
.toast_wrap .toast_popup.typeB.type_guide ul.info_box_list li i.good { background-image: url(../image/result/icon_question_good_01.svg); }
.toast_wrap .toast_popup.typeB.type_guide ul.info_box_list li i.check { background-image: url(../image/result/icon_question_check_01.svg);}
.toast_wrap .toast_popup.typeB.type_guide ul.info_box_list li i.pill { background-image: url(../image/result/icon_question_pill_01.svg);}
.toast_wrap .toast_popup.typeB.type_guide ul.info_box_list li i.result { background-image: url(../image/result/icon_question_result_01.svg);}
.toast_wrap .toast_popup.typeB.type_guide ul.info_box_list li span { color: rgba(34, 34, 34, 0.72); font-size: 14px; font-weight: 400; text-align: left;  line-height: 22px; }
.toast_wrap .toast_popup.typeB.type_guide ul.info_box_list li span em { color: #222222; font-weight:500; font-size: 16px; }

.toast_wrap .toast_popup.typeB.type_guide .btn_area { margin:24px 0 0 0; }



.toast_popup .bot_btn_area { width: 100%; }
.toast_popup .bot_btn_area { display: flex; justify-content: space-between; align-items: center; }
.toast_popup .bot_btn_area .btn { height: 64px; line-height: 64px; font-weight: 700; font-size: 15px; border-radius: 12px; }
.toast_popup .bot_btn_area .btn:first-child { width: 38%; background-color: #ffffff; border: 1px solid #2aad5c; color: #2aad5c; }
.toast_popup .bot_btn_area .btn:last-child { width: calc(62% - 8px); background-color: #2aad5c; color: #ffffff; }

/* 480 -> */
.intake-alarm-area {position: absolute;right: 21.6000vw;top: 50%;transform: translateY(-50%);}
.intake-alarm-area img {width: 100%;}
.intake-alarm-area .btn-intake-alarm {display: inline-block;width: 6.6667vw;}
.intake-alarm-area .btn-intake-alarm img {width: 100%;}
.intake-alarm-area .noti-intake {position: absolute;width: 77.7778vw;height: 14.4444vw;left: -52.7778vw;top: 9.7222vw;padding: 0 0 0 9.4444vw;background: #F3F3F3 url('../img/icon_noti_intake.svg') no-repeat 3.3333vw 2.5000vw;background-size: 4.4444vw auto;border-radius: 1.3889vw;font-size: 3.8889vw;display: flex;align-items: center;}
.intake-alarm-area .noti-intake::after {content: '';position: absolute;top: -4.7222vw;right: 18.8889vw;border-top:2.7778vw solid transparent;border-bottom:2.7778vw solid #F3F3F3;border-right: 2.7778vw solid transparent;border-left: 2.7778vw solid transparent;}
.intake-alarm-area .btn-close {position: absolute;top: 3.0556vw;right: 3.8889vw;width: 2.7778vw;}

.intake-alarm-bt {position: fixed;bottom: 0;left: 0;z-index: 10;width: 100%;height: 127.2222vw;transform: translateY(127.2222vw);transition: .5s; z-index: 2000; }
.intake-alarm-bt.active {transform:translateY(0);}
.intake-alarm-bt .inner {padding: 5.5556vw 5.5556vw 0;background: #F3F3F3;}
.intake-alarm-bt .box {margin: 0 0 2.7778vw;padding: 5.5556vw;border-radius: 2.7778vw;background: #fff;}
.intake-alarm-bt .box:last-child {margin-bottom: 0;}
.intake-alarm-bt .title {padding: 0 0 4.1667vw;font-weight: 500;font-size: 6.6667vw;line-height: 8.3333vw;}

.intake-alarm-bt .receive_set_area .chk_area { width: 70px; height: 30px; overflow: hidden; }
.intake-alarm-bt .receive_set_area .chk_area input[type="checkbox"] { display: none; }
.intake-alarm-bt .receive_set_area .chk_area input[type="checkbox"] + label { width: 100%; height: 100%; display: inline-block; position: relative; background: #c6c6c6; box-shadow: inset 2px 2px 4px rgba(0, 0, 0, 0.2); border-radius: 15px; }
.intake-alarm-bt .receive_set_area .chk_area input[type="checkbox"] + label i { position: absolute; display: inline-block; width: 24px; height: 24px; left: 3px; background-color: #ffffff; top: 3px; border-radius: 50%; transition: left 0.5s, background-color 0.5s; }
.intake-alarm-bt .receive_set_area .chk_area input[type="checkbox"] + label i::after { content: "OFF"; position: absolute; left: 32px; font-weight: 500; font-size: 14px; line-height: 21px; color: #ffffff; top: 50%; transform: translateY(-50%); }
.intake-alarm-bt .receive_set_area .chk_area input[type="checkbox"] + label i::before { content: "ON"; position: absolute; right: 32px; font-weight: 500; font-size: 14px; line-height: 21px; color: #ffffff; top: 50%; transform: translateY(-50%); }
.intake-alarm-bt .receive_set_area .chk_area input[type="checkbox"]:checked + label { background-color: #2aad5c; }
.intake-alarm-bt .receive_set_area .chk_area input[type="checkbox"]:checked + label i { left: calc(100% - 28px); }

.intake-alarm-bt .chk_input {display:none;}

.intake-alarm-bt .switch-box .switch { display: inline-block; position: relative; width: 70px; height: 30px; vertical-align: middle; box-shadow: inset 0.5556vw 0.5556vw 1.1111vw rgba(0, 0, 0, 0.2); cursor: pointer; background: #c6c6c6;border-radius: 4.1667vw;-webkit-transition: 0.4s;transition: .4s; overflow: hidden; }

.intake-alarm-bt .switch-box .chk_input:checked + .switch { background-color: #2aad5c; }

.intake-alarm-bt .btn-switch {position: absolute;height: 24px;width: 24px;left: calc(100% - 28px); top:50%; transform: translateY(-50%); background-color: #fff;-webkit-transition: all .4s;transition: all .4s;border-radius: 50%;}
.intake-alarm-bt .btn-switch::before { content: "OFF"; position: absolute; left: -35px; font-weight: 500; font-size: 16px; line-height: 24px; color: #ffffff; }
.intake-alarm-bt .btn-switch::after { content: "ON"; position: absolute; right: -30px; font-weight: 500; font-size: 16px; line-height: 24px; color: #ffffff;  }

.intake-alarm-bt .switch-box .chk_input:checked + .switch .btn-switch { left: 5px; }


.intake-alarm-bt .txt-switch {position: absolute;font-weight: 500;font-size: 3.8889vw;line-height: 5.8333vw;color: #fff;}
.intake-alarm-bt .txt-switch.txt-on {right: 3.6111vw;top: 1.6667vw;}
.intake-alarm-bt .txt-switch.txt-off {left: 2.5000vw;top: 1.6667vw;}

.intake-alarm-bt .box .sub-title {font-weight: 500;font-size: 5.5556vw;line-height: 8.3333vw;}
.intake-alarm-bt .box .sub-txt {font-size: 4.4444vw;line-height: 6.6667vw;}

.intake-alarm-bt .set01 {display: flex;justify-content: space-between; align-items: center; }
.intake-alarm-bt .set-step-content {border-radius: 2.7778vw 2.7778vw 0 0;padding-bottom: 0;}
.intake-alarm-bt .set-step-content .txt-box {position: relative;margin: 0 0 5.5556vw;}
.intake-alarm-bt .set-step-content .txt-box .btn-intake-alarm {position: absolute;right: 0;top: 2.7778vw;}

.intake-alarm-bt .btn-intake-alarm span {display: inline-block;padding: 0 0 0 1.3889vw;font-size: 4.4444vw;line-height: 6.6667vw;vertical-align: middle;}
.intake-alarm-bt .btn-intake-alarm i {display: inline-block;width: 8.3333vw;height: 8.3333vw; background-color: #8452dc; border-radius: 50%; background-image: url(../image/icon_plus.svg); background-repeat: no-repeat; background-position: center center; vertical-align: middle; }
.intake-alarm-bt .btn-intake-alarm.off i { background-color: #e5e5e5; }

.intake-alarm-bt .btn-box {display: flex;background: #fff;}
.intake-alarm-bt .btn-box .btn-set {display: inline-block;width: 50%;padding: 4.1667vw 0;font-weight: 500;font-size: 5.5556vw;line-height: 7.5000vw;text-align: center;color: #222222;}

.intake-alarm-bt.set-step01 .content {padding: 3.8889vw 0 49.4444vw;text-align: center;}

.intake-alarm-bt.set-step02 .content {overflow-y: auto;height: 61.6667vw;padding-bottom: 2.7778vw;padding-right: 1.1111vw;}
.intake-alarm-bt.set-step02 .content .time-box {height: 20.5556vw;padding: 4.1667vw 6.9444vw;background: #FFFFFF;border: 0.2778vw solid rgba(0, 0, 0, 0.04);box-sizing: border-box;box-shadow: 0.5556vw 0.5556vw 1.1111vw rgba(0, 0, 0, 0.08);border-radius: 2.7778vw;}
.intake-alarm-bt.set-step02 .content .time-box + .time-box {margin: 2.7778vw 0 0;}
.intake-alarm-bt.set-step02 .content .time-box .day {display: inline-block;padding: 0 6.6667vw 0 0;vertical-align: middle;font-weight: 500;font-size: 5.0000vw;color: #5F566C;}
.intake-alarm-bt.set-step02 .content .time-box .time {display: inline-block;vertical-align: middle;font-weight: 500;font-size: 7.2222vw;}
.intake-alarm-bt.set-step02 .content .time-box .delete-time {float: right;vertical-align: middle;width: 3.8889vw;margin: 3.3333vw 0 0;}
.intake-alarm-bt.set-step02 .content .time-box .delete-time img {width: 100%;}

.intake-alarm-bt.set-step03 .inner {padding-bottom: 2.7778vw;}
.intake-alarm-bt.set-step03 .set-step-content {padding-bottom: 9.7778vw;border-radius: 2.7778vw;}
.intake-alarm-bt.set-step03 .content::after {display: block;content: '';clear: both;}
.intake-alarm-bt.set-step03 .day-box-set {overflow: visible;float: left;width: 17.7778vw;height: 12.7778vw;text-align: center;margin: 6.3333vw 0 0;}
.intake-alarm-bt.set-step03 .day-box-set .day {display: block;font-weight: 500;font-size: 5.0000vw;line-height: 11vw;text-align: center;height: 11vw; border: 1px solid #d0d0d0;margin-bottom: 1.8vw; border-radius: 8px; color: #d0d0d0; }
.intake-alarm-bt.set-step03 .day-box-set .day.on { color: #2aad5c; border: 1px solid #2aad5c; }
.intake-alarm-bt.set-step03 .day-box-set .day + .day { margin-bottom: 0; }
.intake-alarm-bt.set-step03 .time-box-set {float: left;width: 57.7778vw;}
.intake-alarm-bt.set-step03 .time-box-set .add {height: 5.5556vw;line-height: 5.5556vw;}
.intake-alarm-bt.set-step03 .time-box-set .add > a {display: inline-block;width: 49%;text-align: center;}
.intake-alarm-bt.set-step03 .time-box-set .add img {width: 5.0000vw;}
.intake-alarm-bt.set-step03 .time-box-set .time {overflow: hidden;font-weight: 500;font-size: 11.1111vw;line-height: 16.3889vw;margin: 2.7778vw 0;}
.intake-alarm-bt.set-step03 .time-box-set .time input {float: left;font-weight: 500;font-size: 11.1111vw;line-height: 16.3889vw;width: 47.5%;text-align: center;}
.intake-alarm-bt.set-step03 .time-box-set .time span {float: left;width: 5%;}
.intake-alarm-bt.set-step03 .time-box-set .minus {height: 5.5556vw;line-height: 5.5556vw;}
.intake-alarm-bt.set-step03 .time-box-set .minus > a {display: inline-block;width: 49%;text-align: center;height: 100%;}
.intake-alarm-bt.set-step03 .time-box-set .minus img {width: 5.0000vw;vertical-align: middle;}

.intake-alarm-bt.set-step04 .content {padding: 3.8889vw 0 49.4444vw;text-align: center;}

.intake-alarm-bt.set-step05 .content {overflow-y: auto;height: 61.6667vw;padding-bottom: 2.7778vw;padding-right: 1.1111vw;}
.intake-alarm-bt.set-step05 .content .time-box {height: 20.5556vw;padding: 4.1667vw 6.9444vw;background: #FFFFFF;border: 0.2778vw solid rgba(0, 0, 0, 0.04);box-sizing: border-box;box-shadow: 0.5556vw 0.5556vw 1.1111vw rgba(0, 0, 0, 0.08);border-radius: 2.7778vw; display: flex; justify-content: space-between; align-items: center; }
.intake-alarm-bt.set-step05 .content .time-box + .time-box {margin: 2.7778vw 0 0;}
.intake-alarm-bt.set-step05 .content .time-box .day {display: inline-block;padding: 0 6.6667vw 0 0;vertical-align: middle;font-weight: 500;font-size: 5.0000vw;color: #e5e5e5;}
.intake-alarm-bt.set-step05 .content .time-box .time {display: inline-block;vertical-align: middle;font-weight: 500;font-size: 7.2222vw;color: #e5e5e5; flex-grow: 0.5; }
.intake-alarm-bt.set-step05 .content .time-box .delete-time {float: right;vertical-align: middle;width: 3.8889vw; }
.intake-alarm-bt.set-step05 .content .time-box .delete-time img {width: 100%;}


/* Error */
.error_section { width: 100%; margin: 0 auto; text-align: center; padding: 88px 24px 32px; }
.error_section > * { display: block; text-align: center; }
.error_section .img_area { padding-top: 0px; }
.error_section strong { margin-top: 16px; font-weight: bold; font-size: 20px; line-height: 32px; }
.error_section p { font-weight: normal; font-size: 14px; line-height: 22px; width: 100%; margin: 16px auto 0; text-align: left; }
.error_section .bot_btn_area { margin-top: 48px; }

/* <- 480 */

@media (max-height:640px) {
    .popup_type08-1 { height: calc(100% - 64px);  }
    .popup_type08-1 .scroll_area { height: calc(100% - 80px); overflow-y: scroll; width: calc(100% + 16px); padding-right: 12px; }
    .popup_type08-1 .scroll_area::-webkit-scrollbar { width: 4px; }
    .popup_type08-1 .scroll_area::-webkit-scrollbar-thumb { width: 4px; background-color: #ebebeb; border-radius: 14px; }
}

/* common */
.contents_wrap { margin: 0 auto; text-align: left; position: relative; }
.certi_wrap { margin: 0 auto; text-align: left; position: relative; }

.contents_wrap,
.certi_wrap { width: 100%; min-height: calc(100vh - 166px); padding-top: 30px; }

section.intro_section .section_wrap, 
section.survey_section .section_wrap,
section.result_section .section_wrap { padding: 24px 24px 32px; }

section.intro_section .section_wrap { position: relative; }


/* Intro/Survey Bottom button */
.btn_area { width: 100%; margin: 24px auto; text-align: center; box-sizing: border-box; }
.bot_btn_area { width: 100%; margin: 0 auto; text-align: left; box-sizing: border-box; bottom: 24px; }
.btn_text { width: 100%; font-size: 14px; font-weight: 500; color: #222222; line-height: 18px; text-align: center; margin-bottom: 8px; }
.btn_text .fc_blue { font-weight: 500; color: #297DFB; }
.btn_area button,
.btn_area a,
.btn_area input[type="button"],
.btn_area input[type="submit"],
.bot_btn_area button,
.bot_btn_area a,
.bot_btn_area input[type="button"],
.bot_btn_area input[type="submit"] { height: 56px; line-height: 56px; border-radius: 12px; font-weight: 700; font-size: 18px; box-sizing: border-box; display: inline-block; width: 100%; }

.btn_area button:disabled,
.btn_area a:disabled,
.btn_area input[type="button"]:disabled,
.btn_area input[type="submit"]:disabled,
.bot_btn_area button:disabled,
.bot_btn_area a:disabled,
.pop_btn_box .btn_pop_submit:disabled,
.bot_btn_area input[type="button"]:disabled,
.bot_btn_area input[type="submit"]:disabled { background-color: #d0d0d0 !important; }

.btn_area button.btn_black,
.btn_area a.btn_black,
.btn_area input[type="button"].btn_black,
.btn_area input[type="submit"].btn_black,
.bot_btn_area button.btn_black,
.bot_btn_area a.btn_black,
.bot_btn_area input[type="button"].btn_black,
.bot_btn_area input[type="submit"].btn_black { background: #222222; color:#fff; border-radius:0; font-weight: 700; font-size: 22px; box-sizing: border-box; display: inline-block; width: 100%; }

.btn_area.type_border button,
.btn_area.type_border a,
.btn_area.type_border input[type="button"],
.btn_area.type_border input[type="submit"],
.bot_btn_area.type_border button,
.bot_btn_area.type_border a,
.bot_btn_area.type_border input[type="button"],
.bot_btn_area.type_border input[type="submit"] { width: 100%; color: #2aad5c; line-height: 62px; background-color: #ffffff; border: 2px solid #2aad5c; }

.btn_area.type01 button,
.btn_area.type01 a,
.btn_area.type01 input[type="button"],
.btn_area.type01 input[type="submit"],
.bot_btn_area.type01 button,
.bot_btn_area.type01 a,
.bot_btn_area.type01 input[type="button"],
.bot_btn_area.type01 input[type="submit"] { width: 100%; background-color: #2aad5c; color: #fcfcfc; }

.btn_area.type01 button:disabled,
.btn_area.type01 a:disabled,
.btn_area.type01 input[type="button"]:disabled,
.btn_area.type01 input[type="submit"]:disabled,
.bot_btn_area.type01 button:disabled,
.bot_btn_area.type01 a:disabled,
.bot_btn_area.type01 input[type="button"]:disabled,
.bot_btn_area.type01 input[type="submit"]:disabled { background-color: #f3f3f3; color: rgba(34,34,34,0.24); }

.bot_btn_area.type01 .btn_naver { background-color: #01c73c; }


.bot_btn_area.type02 { display: flex; justify-content: space-between; }
.bot_btn_area.type02 button:first-child,
.bot_btn_area.type02 a:first-child,
.bot_btn_area.type02 input[type="button"]:first-child,
.bot_btn_area.type02 input[type="submit"]:first-child { width: 232px; background-color: #ffffff; color: #2aad5c; border: 1px solid #2aad5c; min-width: 120px; margin-right: 8px; }
.bot_btn_area.type02 button:last-child,
.bot_btn_area.type02 a:last-child,
.bot_btn_area.type02 input[type="button"]:last-child,
.bot_btn_area.type02 input[type="submit"]:last-child { width: 100%; background-color: #2aad5c; color: #fcfcfc; float: right; }
.bot_btn_area.type02 button:disabled:last-child,
.bot_btn_area.type02 a:disabled:last-child,
.bot_btn_area.type02 input[type="button"]:disabled:last-child,
.bot_btn_area.type02 input[type="submit"]:disabled:last-child { background-color: #d0d0d0; }
.bot_btn_area.type02 button:enabled:last-child,
.bot_btn_area.type02 a:enabled:last-child,
.bot_btn_area.type02 input[type="button"]:enabled:last-child,
.bot_btn_area.type02 input[type="submit"]:enabled:last-child { background-color: #2aad5c; }

.bot_btn_area.type02.fixed_btn_area {width: calc(100% - 48px); position: static; margin: 0 auto; transform: none; }

.fixed_btn_area.outer_btn_area { width: calc(100% - 48px); }

.bot_btn_area.type03 { width: 100%; text-align: center; }
.bot_btn_area.type03 button,
.bot_btn_area.type03 a,
.bot_btn_area.type03 input[type="button"],
.bot_btn_area.type03 input[type="submit"] { width: 100%; background-color: #2aad5c; color: #ffffff; }
.bot_btn_area.type03 span { display: block; margin-bottom: 12px; font-weight: bold; font-size: 15px; line-height: 24px; color: #2aad5c; }
.bot_btn_area.type03 span em { display: block; }

.bot_btn_area .input_area { text-align: center; width: 100%; }
.bot_btn_area .input_area input[type="checkbox"] { display: none; }
.bot_btn_area .input_area input[type="checkbox"] + label { font-weight: bold; font-size: 15px; line-height: 24px; color: #888888; padding-left: 32px; position: relative; margin-bottom: 16px; display: inline-block; }
.bot_btn_area .input_area input[type="checkbox"] + label::after { content: ""; display: inline-block; width: 24px; height: 24px; position: absolute; left: 0; top: 50%; transform: translateY(-50%); background-image: url(../image/icon/agree_chk.svg); background-repeat: no-repeat; background-position: center; box-sizing: 24px; }
.bot_btn_area .input_area input[type="checkbox"]:checked + label::after { background-image: url(../image/icon/agree_chk_on.svg); }

.fixed_btn_area { position: fixed; width: auto; bottom: 100px; left: 50%; transform: translateX(-50%); z-index: 50; }
.fixed_btn_area button.on,
.fixed_btn_area a.on,
.fixed_btn_area input[type="button"].on,
.fixed_btn_area input[type="submit"].on { box-shadow: 0px 4px 10px rgba(42,173,92,0.5); }

.fixed_btn_area button:disabled.on,
.fixed_btn_area a:disabled.on,
.fixed_btn_area input[type="button"]:disabled.on,
.fixed_btn_area input[type="submit"]:disabled.on { box-shadow: 0px 4px 10px rgba(186, 185, 189, 0.5); }

.btn_shadow { max-width: 480px; padding: 40px 20px 24px; background: rgb(255,255,255); background: linear-gradient(180deg, rgba(255,255,255,0) 0%, rgba(255,255,255,1) 20%, rgba(255,255,255,1) 100%); }
.btn_slide_area { position: fixed; width: 100%; max-width: 480px; bottom: -200px; left: 50%; transform: translateX(-50%); z-index: 9999; transition: all 0.3s ease-out; } 
.btn_slide_area.on,
.btn_slide_area .fixed_btn_area { bottom: 0; }


.benefits_section .fixed_btn_area { bottom: -150px; }
.benefits_section .bot_btn_area { position: absolute; left: 50%; transform: translateX(-50%); width: calc(100% - 48px); bottom: 32px; }

.bot_btn_area .result_guide_text { font-weight: bold; font-size: 14px; line-height: 20px; color: #2aad5c; margin-bottom: 8px; text-align: center; border-radius: 4px; background-image: url(../image/btn_guide_bg.png); display: inline-block; width: 270px; height: 60px; background-repeat: no-repeat; background-position: center; padding-top: 12px; float: right; }

.type_tooltip { position: relative; }
.type_tooltip .tool_tip_box { position: absolute; left: 0; top: -48px; font-weight: bold; font-size: 12px; line-height: 32px; color: #ffffff; background-color: #2aad5c; border-radius: 14px; box-shadow: 2px 2px 8px rgba(0, 0, 0, 0.25); padding: 0 14px; -webkit-animation-name: tooltipWave; -webkit-animation-duration: 0.5s; -webkit-animation-iteration-count: infinite; -webkit-animation-direction:alternate; -webkit-animation-timing-function: linear; -webkit-animation-fill-mode: none; animation-name: tooltipWave; animation-duration: 0.5s; animation-iteration-count: infinite; animation-direction:alternate; animation-timing-function: linear; animation-fill-mode: none;  }
.type_tooltip .tool_tip_box::after { content: ""; display: inline-block; width: 10px; height: 10px; left: 40px; bottom: -2px; background-color: #2aad5c; position: absolute; transform: rotate(45deg); }

.bot_btn_area.pc_fix_area { position: fixed; width: 100%; max-width: 552px; left: 50%; transform: translateX(-50%); bottom: 0; padding: 44px 0px 24px; background: linear-gradient(0deg, rgba(255,255,255,1) 0%, rgba(255,255,255,1) 80%, rgba(255,255,255,0) 100%); z-index: 5; }
.bot_btn_area.floating { position: fixed; bottom: 0; left: 50%; transform: translateX(-50%); bottom: 0; padding: 44px 24px 24px; background: linear-gradient(0deg, rgba(255,255,255,1) 0%, rgba(255,255,255,1) 80%, rgba(255,255,255,0) 100%); z-index: 5; max-width: 480px; }
.bot_btn_area.sticky { position: sticky; bottom: 0; padding: 44px 0px 24px; background: linear-gradient(0deg, rgba(255,255,255,1) 0%, rgba(255,255,255,1) 80%, rgba(255,255,255,0) 100%); z-index: 5; max-width: 480px; }
.bot_btn_area.type_subcopy { padding: 13px 24px 24px; }
.bot_btn_area.type_subcopy .btn_sub_copy { font-weight: 700; font-size: 15px; line-height: 22px; color: #2aad5c; text-align: center; margin-bottom: 9px; }

.bot_btn_area.floating span { text-align:center; display: block; margin-bottom: 12px; font-weight: bold; font-size: 15px; line-height: 24px; color: #2aad5c; }



/* 중간 컨텐츠 박스 */
.mid_contents_wrap{ width: calc(100% + 48px); margin: 24px 0 0 -24px; padding: 24px 24px; border-top: 8px solid #fafafa; }