@charset "utf-8";

:root {
    --bg-color: #f8f8f8;
    --bg-input: #e6e6e6;
    --color-black: #000000;
    --color-gray: #333333;
    --color-light: #888888;
    --color-white: #ffffff;
    --color-red: #ff0000;
    --main-color: #00ab91;
}

/* ! ==================== Default ==================== ! */
body, html { width: 100%; height: 100%; position: relative; } 
body { -ms-overflow-style: none; scrollbar-width: none; }
body::-webkit-scrollbar { display: none; }

.m_only { display: inline-block; } 
.pc_only { display: none !important; } 
.hide { display: none !important; } 
.kakao_consult { display: none; }
header .kakao_link { display: inline-block; width: 30px; height: 30px; position: absolute; left: 64px; top: 50%; transform: translateY(-50%); background-color: #fee500; border-radius: 50%; border: 0; background-image: url(../image/kakao_icon.svg); background-repeat: no-repeat; background-size: 16px; background-position: center; text-indent: -99999px; } 

/** ---------- Margin - Top ---------- **/
.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; }

/** ---------- Datepicker ---------- **/
.date_select_box.type_box { width: 100%; height: 64px; position: relative; }
.date_select_box.type_line { width: 100%; height: 32px; position: relative; }
.date_select_box.type_day input.date_input { width: 100%; }
.date_select_box.type_day .date_view_area span { width: 100%; margin: 0; }
.date_select_box input.date_input { width: calc(50% - 12px); height: 100%; opacity: 0; cursor: pointer; z-index: 1; }
.date_select_box.type_box .date_view_area { position: absolute; width: 100%; height: 100%; opacity: 1; left: 0; top: 0; z-index: 0; background-color: #e6e6e6; border-radius: 12px; padding: 20px 16px; display: flex; justify-content: space-between; }
.date_select_box.type_line .date_view_area { position: absolute; width: 100%; height: 100%; opacity: 1; left: 0; top: 0; z-index: 0; padding: 0px 16px; display: flex; justify-content: space-between; border-bottom: 1px solid #c4c4c4; }
.date_select_box .date_view_area em { display: inline-block; width: 8px; height: 20px; font-weight: normal; font-size: 15px; line-height: 20px; }
.date_select_box .date_view_area span { display: inline-block; width: calc(50% - 4px); font-weight: normal; font-size: 15px; line-height: 24px; height: 24px; color: #888888; background-image: url(../image/icon_calandar.svg); background-repeat: no-repeat; background-position: center right; background-size: 20px; }
.date_select_box .date_view_area .start { margin-right: 12px; }
.date_select_box .date_view_area .end { margin-left: 12px; }
.date_select_box.type_readonly input.date_input { z-index: 0; }
.date_select_box.type_readonly .date_view_area span { background-image: none; }
.date_select_box .datepicker_area { display: flex; justify-content: space-between; height: 100%; }
.date_select_box.type_line.small_img_type input.date_input { width: calc(50% - 8px); }
.date_select_box.type_line.small_img_type.type_readonly .date_view_area span { background-image: none; }
.date_select_box.type_line.small_img_type { display: flex; align-items: center; justify-content: space-between; }
.date_select_box.type_line.small_img_type .datepicker_area { width: calc(100% - 68px); }
.date_select_box.type_line.small_img_type .date_view_area { width: calc(100% - 68px); }
.date_select_box.type_line.small_img_type .btn { width: 52px; height: 32px; line-height: 32px; border-radius: 8px; color: #fafafa; font-weight: bold; font-size: 13px; letter-spacing: 0.25px; }
.date_select_box.type_line.small_img_type .date_view_area { padding: 0; }
.date_select_box.type_line.small_img_type .date_view_area span { background-image: url(../image/icon_calandar_gray.svg); }
.date_select_box.type_line.small_img_type .date_view_area .start { margin-right: 8px; }
.date_select_box.type_line.small_img_type .date_view_area .end { margin-left: 8px; }
.date_select_box.type_line.small_img_type.type_day .datepicker_area { width: 100%; max-width: 244px; }
.date_select_box.type_line.small_img_type.type_day .datepicker_area input.date_input { width: 100%; }

/** ---------- form Style ---------- **/
input[type="radio"],
input[type="checkbox"] { display: inline-block; width: 0; height: 0; opacity: 0; overflow: hidden; position: absolute; } 

.input_box { position: relative; width: 100%; height: 64px; } 

.input_box.type01.error input,
.input_box.type01.error input.focus,
.input_box.type01.error input:focus,
.input_box.type01.error input.valid,
.input_box.type01.error input:valid { border: 1px solid #f90818; } 

.input_box.type02.error label,
.input_box.type02.error label.focus,
.input_box.type02.error label.valid,
.input_box.type02.error input:nth-of-type(1):valid + label,
.input_box.type02.error input:nth-of-type(1):focus + label { border: 1px solid #f90818; } 

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

.input_box + .error_msg,
.select_box + .error_msg { font-weight: 300; font-size: 14px; line-height: 18px; display: block; height: 0; overflow: hidden; color: #f90818; margin-top: 0px; transition: height 0.5s, margin-top 0.5s; } 
.input_box.error + .error_msg,
.select_box.error + .error_msg { height: 18px; margin-top: 4px; } 

.select_box.type01 select { width: 100%; height: 64px; background-color: #e6e6e6; border-radius: 12px; border: 1px solid #e6e6e6; box-sizing: border-box; padding: 22px 40px 22px 24px; background-image: url(../image/icon_input_select.svg); background-repeat: no-repeat; background-position: calc(100% - 16px) center; color: #888888; font-weight: normal; font-size: 15px; } 
.select_box.type01 select:focus,
.select_box.type01 select.valid { background-color: #ffffff; color: #333333; border-color: #ffffff; } 

.textarea_wrap { border-radius: 12px; overflow: hidden; position: relative; width: 100%; height: 204px; } 

.input_box input,
.input_box select { position: absolute; left: 0; top: 0; } 
.input_box label { position: absolute; left: 24px; top: 50%; transform: translateY(-50%); font-weight: normal; font-size: 15px; line-height: 20px; display: inline-block; color: #888888; z-index: 5; transition: all 0.3s; } 
.input_box input,
.input_box select { display: inline-block; width: 100%; height: 64px; line-height: 64px; padding: 0 24px; background-color: #e6e6e6; border-radius: 12px; border: 1px solid #e6e6e6; box-sizing: border-box; font-weight: normal; font-size: 15px; } 
.input_box select { font-weight: normal; font-size: 15px; line-height: 20px; display: inline-block; color: #888888; } 

.input_box.type01 input:valid { background-color: #ffffff; border: 1px solid #ffffff; } 
.input_box.type01 input:focus { background-color: #ffffff; border-width: 1px; border-style: solid; } 
.input_box.type01 input:focus,
.input_box.type01 input:valid { padding-top: 32px; padding-bottom: 12px; } 
.input_box.type01 input:focus + label,
.input_box.type01 input:valid + label { top: 12px; transform: none; font-size: 13px; } 
.input_box.type01 input.valid:read-only { background-color: #f5f5f5; border: 1px solid #ebebeb; padding-top: 32px; padding-bottom: 12px; } 
.input_box.type01 input.valid:read-only + label { top: 12px; transform: none; font-size: 13px; } 
.input_box.type01 input.input_card_type.valid { background-color: #ffffff; border: 1px solid #ffffff; padding-top: 32px; padding-bottom: 12px; } 
.input_box.type01 input.input_card_type.valid + label { top: 12px; transform: none; font-size: 13px; } 

.input_box.type02 label { display: inline-block; width: 100%; height: 64px; background-color: #e6e6e6; border-radius: 12px; border: 1px solid #e6e6e6; box-sizing: border-box; left: 0; top: 0; transform: none; padding: 22px 24px; z-index: 20; position: relative; } 
.input_box.type02 input { width: 126px; height: 20px; line-height: 20px; border-radius: 0; top: 32px; z-index: 10; background-color: transparent; border: none; } 
.input_box.type02 input:nth-of-type(1) { left: 0; padding: 0; padding-left: 24px; } 
.input_box.type02 input:nth-of-type(2) { left: 154px; padding: 0; width: 18px; } 
.input_box.type02 .hyphen { position: absolute; left: 126px; display: inline-block; font-weight: normal; font-size: 15px; line-height: 20px; } 
.input_box.type02.full_type input:nth-of-type(2) { font-size: 18px; width: 126px; } 
.input_box.type02 input:nth-of-type(2) + label { display: none; border: 0 transparent; } 
.input_box.type02 input:nth-of-type(1):focus + label,
.input_box.type02 input:nth-of-type(1):valid + label { padding-top: 12px; z-index: 5; font-size: 13px; } 
.input_box.type02 input:nth-of-type(1):valid + label { background-color: #ffffff; border: 1px solid #ffffff; } 
.input_box.type02 input:nth-of-type(1):focus + label,
.input_box.type02 label.focus { background-color: #ffffff; } 
.input_box.type02 .hyphen { display: none; } 
.input_box.type02 input:nth-of-type(1):focus + label + .hyphen,
.input_box.type02 input:nth-of-type(1):valid + label + .hyphen { z-index: 5; display: inline-block; width: 28px; height: 20px; line-height: 20px; position: absolute; left: 126px; top: 32px; } 
.input_box.type02 .hide_text { position: absolute; display: inline-block; top: 32px; left: 170px; z-index: 10; line-height: 20px; } 
.input_box.type02 input:nth-of-type(1):valid + label + span + input:nth-of-type(2) + label,
.input_box.type02 input:nth-of-type(1):focus + label + span + input:nth-of-type(2) + label { display: inline-block; position: absolute; right: 0; top: 0; left: inherit; height: 100%; width: calc(100% - 140px); background-color: transparent; border: 0; padding: 0; } 
.input_box.type02 input:nth-of-type(1):read-only + label { background-color: #ffffff; border: 1px solid #ffffff; padding-top: 12px; z-index: 5; font-size: 13px; } 
.input_box.type02 input:nth-of-type(1):read-only + label + .hyphen { z-index: 5; display: inline-block; width: 28px; height: 20px; line-height: 20px; position: absolute; left: 126px; top: 32px; } 
.input_box.type02 input:nth-of-type(1):read-only { z-index: 10; } 
.input_box.type02 input:nth-of-type(1):read-only + label { z-index: 0; background-color: #ffffff; } 
.input_box.type02 input:nth-of-type(1):read-only + label + span + input:nth-of-type(2) + label { display: inline-block; position: absolute; right: 0; top: 0; left: inherit; height: 100%; width: 100%; background-color: transparent; border: 0; padding: 0; z-index: 2; } 

.input_box.type03 select,
.input_box.type03 input { background-color: #ffffff; } 
.input_box.type03 label { display: inline-block; width: 100%; height: 64px; background-color: #e6e6e6; border-radius: 12px; border: 1px solid #e6e6e6; box-sizing: border-box; left: 0; top: 0; transform: none; padding: 22px 24px; z-index: 20; } 
.input_box.type03 select { width: 112px; height: 20px; border-radius: 0; top: 32px; z-index: 10; padding: 0; padding-right: 24px; left: 24px; font-weight: normal; font-size: 15px; line-height: 20px; color: #333333; border: 0; background-image: url(../image/icon_input_select.svg); background-repeat: no-repeat; background-position: right center; } 
.input_box.type03 select:focus + label,
.input_box.type03 select + label.focus,
.input_box.type03 select + label.focus.valid { padding-top: 12px; z-index: 5; font-size: 13px; background-color: #ffffff; border-width: 1px; border-style: solid; } 
.input_box.type03 select + label.valid { padding-top: 12px; z-index: 5; font-size: 13px; background-color: #ffffff; border: 1px solid #ffffff; } 
.input_box.type03 input { width: calc(100% - 124px); left: 124px; z-index: 10; border: none; height: 20px; line-height: 20px; border-radius: 0; top: 32px; background-color: transparent; } 

.input_box.type04 input:focus { background-color: #ffffff; border-width: 1px; border-style: solid; } 
.input_box.type04 input:valid { background-color: #ffffff; border-width: 1px; border-style: solid; } 
.input_box.type04 .timer { position: absolute; right: 16px; top: 50%; transform: translateY(-50%); font-weight: normal; font-size: 15px; } 
.input_box.type04.type_btn input[type="text"] { padding-right: 108px; } 
.input_box.type04.type_btn .btn { display: inline-block; width: 76px; text-align: center; height: 40px; line-height: 40px; border-radius: 7px; color: #ffffff; position: absolute; right: 16px; top: 50%; transform: translateY(-50%); font-weight: normal; font-size: 15px; } 
.input_box.type04 input:read-only:focus { background-color: #e6e6e6; border: 1px solid #e6e6e6; } 
.input_box.type04 input:read-only::placeholder { color: #b3b3b3; } 
.input_box.type04 input.valid:read-only,
.input_box.type04 input:read-only:valid { background-color: #ffffff; } 

.input_box.type05 input { padding-right: 48px; } 
.input_box.type05 input:focus { background-color: #ffffff; border-width: 1px; border-style: solid; } 
.input_box.type05 input:valid { background-color: #ffffff; border-width: 1px; border-style: solid; } 
.input_box.type05 .clear { position: absolute; right: 16px; top: 50%; transform: translateY(-50%); width: 16px; height: 16px; border-radius: 50%; background-color: #999999; display: inline-block; background-image: url(../image/icon_input_clear.svg); background-repeat: no-repeat; background-position: center center; display: none; z-index: 5; } 
.input_box.type05 input:focus + .clear { display: inline-block; } 

.input_box.type_search input { padding-right: 48px; padding-left: 52px; background-image: url(../image/icon_search.png); background-repeat: no-repeat; background-position: 16px center; z-index: 4; } 
.input_box.type_search input:focus { background-color: #ffffff; border-width: 1px; border-style: solid; } 
.input_box.type_search input:valid { background-color: #ffffff; border-width: 1px; border-style: solid; } 
.input_box.type_search .clear { position: absolute; right: 16px; top: 50%; transform: translateY(-50%); width: 16px; height: 16px; border-radius: 50%; background-color: #999999; display: inline-block; background-image: url(../image/icon_input_clear.svg); background-repeat: no-repeat; background-position: center center; display: none; z-index: 5; } 
.input_box.type_search input:focus + .clear { display: inline-block; } 
.input_box.type_search .search_keyword_area { position: absolute; z-index: 2; left: 0; top: 32px; width: 100%; background-color: #ffffff; border-radius: 0 0 12px 12px; display: none; overflow: hidden; } 
.input_box.type_search .search_keyword_area li { line-height: 44px; font-weight: normal; font-size: 14px; padding-left: 12px; } 
.input_box.type_search .search_keyword_area li:first-of-type { margin-top: 32px; } 
.input_box.type_search input:focus + .clear + .search_keyword_area { display: block; } 
/** ---------- Input Style ---------- **/


/** ---------- button ---------- **/
.btn { display: block; width: 100%; height: 56px; line-height: 56px; font-size: 15px; font-weight: bold; }
.btn.colorA:disabled
.btn.colorB:disabled { background-color: #E6E6E6 !important; color: #b3b3b3 !important; }
.btn.typeA { border-radius: 8px; }
.btn.typeB { border-radius: 28px; }
.btn.colorA { color: #ffffff; }
.btn.colorB { background-color: #e6e6e6; }
.btn.colorB:active { background-color: #cfcfcf; }
.btn.colorC { background-color: #cfcfcf; color: #333333; }
.bot_btn_area.posA { position: absolute; width: 100%; padding: 0 24px 24px; bottom: 0px; left: 0; }
.bot_btn_area.posA.typeB { padding-top: 16px; }
.bot_btn_area.posA.typeC { padding-top: 34px; }
.bot_btn_area.posF { position: fixed; width: 100%; padding: 16px 24px 24px; bottom: 0px; left: 0; background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, #FFFFFF 45.83%, #FFFFFF 110%); z-index: 1; }
.full_type .bot_btn_area.posF { padding: 16px 24px 24px; }
.full_type .bot_btn_area.scroll_text_type { padding-top: 16px; }
.bot_btn_area.flex_type { display: flex; justify-content: space-between; }
.bot_btn_area.flex_type .btn { width: calc(50% - 4px); margin: 0; }
.popup.typeA .bot_btn_area.flex_type .btn { width: calc(50% - 8px); }
.bot_btn_area .btn_sub_text { margin-bottom: 16px; font-weight: bold; font-size: 14px; line-height: 20px; }
.bot_btn_area .btn_sub_text svg { display: inline-block; width: 18px; height: 18px; vertical-align: middle; margin-right: 6px; }
.bot_btn_area .btn_sub_text svg .st0 { fill: none; stroke-width: 2; }
.bot_btn_area .btn_sub_text svg .st1 { fill: none; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.bot_btn_area .btn_sub_list { margin-bottom: 16px; }
.bot_btn_area .btn_sub_list strong { display: inline-block; font-weight: normal; font-size: 14px; line-height: 100%; }
.bot_btn_area .btn_sub_list strong svg { width: 18px; height: 18px; vertical-align: middle; margin-right: 10px; }
.bot_btn_area .btn_sub_list strong svg .st0 { fill: none; stroke-width: 2; }
.bot_btn_area .btn_sub_list strong svg .st1 { fill: none; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.bot_btn_area .btn_sub_list ul { margin-top: 8px; }
.bot_btn_area .btn_sub_list ul li { font-weight: normal; font-size: 14px; line-height: 21px; color: #888888; list-style: inside; padding-left: 28px; text-indent: -20px; }
.bot_btn_area .btn_info_text { padding-left: 22px; margin-bottom: 16px; font-weight: bold; font-size: 14px; line-height: 20px; background-image: url(../image/icon_info_g.svg); background-repeat: no-repeat; background-position: left 2px; }
.bot_btn_area .btn_sub_text.flex_icon { display: flex; justify-content: flex-start; }
.bot_btn_area .btn_sub_text.flex_icon svg { min-width: 18px; margin-top: 2px; }
.full_type .bot_btn_area { padding: 0 24px 24px; }
.full_type .tab_contents_area .bot_btn_area { padding: 0; }
.main_btn_area.type_floating,
.bot_btn_area.type_floating { height: 96px; position: relative; width: calc(100% + 48px); left: -24px; } 
.main_btn_area.type_floating .bg_area,
.bot_btn_area.type_floating .bg_area { width: 100%; height: 96px; background: linear-gradient(180deg, rgba(248, 248, 248, 0) 0%, #f8f8f8 45.83%, #f8f8f8 110%); position: fixed; bottom: 0px; left: 0; } 
.main_btn_area.type_floating .bg_area .btn,
.bot_btn_area.type_floating .bg_area .btn { position: absolute; width: calc(100% - 48px); left: 24px; bottom: 24px; } 
.main_btn_area.type_floating.fix .bg_area,
.bot_btn_area.type_floating.fix .bg_area { position: static; } 
.btn.colorA.disabled, .btn.colorB.disabled,
.btn.colorA:disabled, .btn.colorB:disabled { background-color: #E6E6E6 !important; color: #b3b3b3 !important; pointer-events: none; }
/** ---------- button ---------- **/


/** ---------- contents area ---------- **/
.contents_area .textarea_wrap label,
.contents_area .inner_scroll_contents .textarea_wrap label { width: 100%; height: 100%; resize: none; position: absolute; left: 0; top: 0; padding: 22px 16px 22px 24px; background-color: #e6e6e6; border-radius: 12px; font-weight: normal; font-size: 15px; line-height: 20px; box-sizing: border-box; border: 1px solid #e6e6e6; } 
.contents_area .textarea_wrap label::after,
.contents_area .inner_scroll_contents .textarea_wrap label::after { display: none; } 
.contents_area .textarea_wrap .textarea_box,
.contents_area .inner_scroll_contents .textarea_wrap .textarea_box { position: absolute; left: 24px; top: 16px; width: calc(100% - 30px); height: calc(100% - 44px); z-index: 1; background-color: #e6e6e6; font-weight: normal; font-size: 15px; line-height: 20px; border: 0; } 
.contents_area .textarea_wrap .textarea_box:focus { background-color: #ffffff; } 
.contents_area .textarea_wrap .textarea_box:focus + label { background-color: #ffffff; } 
.contents_area .textarea_wrap .textarea_box:valid { background-color: #ffffff; } 
.contents_area .textarea_wrap .textarea_box:valid + label { background-color: #ffffff; border: 1px solid #ffffff; } 

.contents_area .textarea_wrap .textarea_box::-webkit-scrollbar { width: 4px; } 
.contents_area .textarea_wrap .textarea_box::-webkit-scrollbar-thumb { background-color: #e6e6e6; border-radius: 16px; } 
.contents_area .textarea_wrap .textarea_box::-webkit-scrollbar-track { background-color: transparent; overflow: hidden; border-radius: 100%; } 
.contents_area .textarea_wrap .textarea_box::placeholder { color: #888888}
/** ---------- contents area ---------- **/





/*? ---------- IE 호환성 ---------- */
.input_box.type01 input.valid { background-color: #ffffff; border: 1px solid #ffffff; }
.input_box.type01 input.focus { background-color: #ffffff; border-width: 1px; border-style: solid; }
.input_box.type01 input.focus
.input_box.type01 input.valid { padding-top: 32px; padding-bottom: 12px; height: 64px; }
.input_box.type01 input.focus + label
.input_box.type01 input.valid + label { top: 12px; transform: none; font-size: 13px; }

.input_box.type02 input:nth-of-type(1).focus + label
.input_box.type02 input:nth-of-type(1).valid + label { padding-top: 12px; z-index: 5; font-size: 13px; }
.input_box.type02 input:nth-of-type(1).valid + label { background-color: #ffffff; border: 1px solid #ffffff; }
.input_box.type02 input:nth-of-type(1).focus + label
.input_box.type02 label.focus { background-color: #ffffff; }
.input_box.type02 .hyphen { display: none; } 
.input_box.type02 input:nth-of-type(1).focus + label + .hyphen,
.input_box.type02 input:nth-of-type(1).valid + label + .hyphen { z-index: 5; display: inline-block; width: 28px; height: 20px; line-height: 20px; position: absolute; left: 126px; top: 32px; } 
.input_box.type02 .hide_text { position: absolute; display: inline-block; top: 32px; left: 170px; z-index: 10; line-height: 20px; } 
.input_box.type02 input:nth-of-type(1).valid + label + span + input:nth-of-type(2) + label,
.input_box.type02 input:nth-of-type(1).focus + label + span + input:nth-of-type(2) + label { display: inline-block; position: absolute; right: 0; top: 0; left: inherit; height: 100%; width: calc(100% - 140px); background-color: transparent; border: 0; padding: 0; z-index: 6; } 

.input_box.type04 input.focus { background-color: #ffffff; border-width: 1px; border-style: solid; } 
.input_box.type04 input.valid { background-color: #ffffff; border-width: 1px; border-style: solid; } 

.input_box.type05 input.focus + .clear { display: inline-block; } 

.input_box.type_search input.focus + .clear { display: inline-block; } 
.input_box.type_search input.focus + .clear + .search_keyword_area { display: block; } 
/*? ---------- IE 호환성 ---------- */


/* Select */
.contents_area .list_select_area { width: 100%; text-align: right; } 

.contents_area .list_select_area select { font-weight: 500; font-size: 14px; line-height: 22px; color: #888888; padding-right: 16px; border: 0; background-color: #f8f8f8; background-image: url(../image/icon_select.svg); background-repeat: no-repeat; background-position: right center; } 

/* z-index */
header { z-index: 0; } 

.dim { z-index: 100; } 

.popup_wrap,
.toast_popup_wrap { z-index: 200; } 

/* Background */
.bg_wrap { width: 100%; height: auto; } 

.bg_area { max-width: 1024px; margin: 0 auto; } 

.bg_contents_area { display: none; } 






/* ! ==================== LAYOUT - container ==================== ! */
#wrap { position: relative; width: 100%; height: auto; margin: 0 auto; background: var(--bg-color); }
#container { width: 100%; max-width: 1024px; height: 100%; display: flex; justify-content: center; margin: 0 auto; }
#container .title_area { width: 512px; height: 100%; display: flex; flex-direction: column; justify-content: center; }
#container .title_area #logo img { width: 172px; }
#container .title_area .txt_box { margin-top: 16px; }
#container .title_area .txt_box p { font-size: 24px; font-weight: 400; color: var(--font-color); line-height: 34px; word-break: keep-all; }
#container .title_area .txt_box p b { display: block; }
#container .title_area .txt_box p strong { display: block; font-size: 32px; font-weight: 700; line-height: 40px; margin-top: 12px; }
#container .content_area { position: relative; width: 100%; max-width: 512px; min-width: 360px; height: 100%; }

@media (max-width:1024px){
    #container .title_area { display: none; }
    .link_area .txt_box{ display: block; }

}


/*! ==================== MAIN ==================== */
body { background-color: #f8f8f8; position: relative; } 

main { min-height: 100%; min-width: 360px; max-width: 512px; margin: 0 auto; position: relative; box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.25); overflow: auto; overflow-x: hidden; } 

main.original_wrap { max-width: 806px; box-shadow: none; width: 806px; } 

main.original_wrap header { max-width: 806px; width: 806px; } 




/* 로티 */
#lottie_complete { width: 48px; height: 48px; margin: 0 auto; } 

/* 브라우저 체크 */
.browser_chk_area { width: 100%; position: fixed; height: 0; line-height: 0px; overflow: hidden; color: #ffffff; transition: all 0.5s; left: 0; top: 0; z-index: 1000; } 

.browser_chk_area.on { height: 40px; line-height: 40px; } 

.browser_chk_area.on + .bg_wrap main header { top: 40px; } 

.browser_chk_area.on + .bg_wrap .contents_area.main_contents { margin-top: 40px; } 

.browser_chk_area p { font-weight: bold; font-size: 12px; text-align: center; } 

.browser_chk_area .exit_btn { font-weight: bold; font-size: 12px; line-height: 14px; padding-right: 20px; background-image: url(../image/icon_exit_circle.svg); background-repeat: no-repeat; background-position: right center; position: absolute; right: 56px; top: 50%; transform: translateY(-50%); color: #ffffff; height: 16px; } 

.browser_chk_area .exit_btn,
.browser_chk_area .exit_btn:focus,
.browser_chk_area .exit_btn:active { padding: 0 20px 0 0; } 

.browser_chk_area .exit_btn span { position: relative; } 


/* Header */
header { width: 100%; display: block; height: 60px; background-color: #f8f8f8; position: fixed; max-width: 512px; top: 0; z-index: 30; transition: top 0.5s; } 

header.type_w { background-color: #ffffff; } 

header .go_back { margin-left: 12px; display: inline-block; width: 32px; height: 32px; text-indent: -999999px; background-image: url(../image/icon_arrow.svg); background-repeat: no-repeat; background-position: center center; background-size: 24px; position: absolute; left: 12px; top: 50%; transform: translateY(-50%); } 

header img { position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%); } 
header .logout_btn { font-weight: 700; font-size: 13px; line-height: 16px; color: #888888; position: absolute; right: 20px; padding: 8px; display: inline-block; top: 50%; transform: translateY(-50%); } 

header .basket { display: inline-block; width: 32px; height: 32px; text-indent: -999999px; background-image: url(../image/icon_basket.svg); background-repeat: no-repeat; background-position: center center; background-size: 24px; position: absolute; right: 52px; top: 50%; transform: translateY(-50%); } 

header .basket.active::after { content: ""; width: 4px; height: 4px; display: inline-block; position: absolute; top: 4px; right: 2px; border-radius: 50%; animation: blink-effect 1.5s step-end infinite; } 

@keyframes blink-effect { 50% { opacity: 0%; } 
}

header .open_gnb { display: inline-block; width: 32px; height: 32px; text-indent: -999999px; background-image: url(../image/icon_gnb.svg); background-repeat: no-repeat; background-position: center center; background-size: 24px; position: absolute; right: 12px; top: 50%; transform: translateY(-50%); } 

header .title { display: inline-block; font-weight: 500; font-size: 16px; line-height: 20px; position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%); white-space: nowrap; } 

header .exit { display: inline-block; width: 32px; height: 32px; text-indent: -999999px; background-image: url(../image/icon_exit.svg); background-repeat: no-repeat; background-position: center center; background-size: 24px; position: absolute; right: 12px; top: 50%; transform: translateY(-50%); } 


/* Header Pillgram AD */
header .pillgram_ad_btn { display: inline-block; width: 34px; height: 34px; box-sizing: border-box; position: absolute; left: 64px; border: 1px solid #00c3ab; background-color: #ffffff; box-shadow: 1px 1px 4px rgba(124, 124, 124, 0.25); border-radius: 12px; top: 50%; transform: translateY(-50%); background-image: url(../image/icon_pillgram_nut.svg); background-repeat: no-repeat; background-position: center center; background-size: 28px; overflow: hidden; -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; } 

header .pillgram_ad_btn.type_eye { background-image: url(../image/icon_pillgram_eye.svg); } 
header .pillgram_ad_btn.type_fish { background-image: url(../image/icon_pillgram_fish.svg); } 
header .pillgram_ad_btn.type_egg { background-image: url(../image/icon_pillgram_egg.svg); } 

header .pillgram_ad_btn.type_lottie { display: inline-block; width: 48px; height: 48px; position: absolute; left: 64px; top: 50%; transform: translateY(-50%); background-color: transparent; border: 0; background-image: none; box-shadow: none; cursor: pointer; animation: none; } 

@-webkit-keyframes tooltipWave { 
from { transform: translateY(-50%) scale(90%); } 

to { transform: translateY(-50%) scale(110%); } 
}

.pillgram_ad_area { position: fixed; top: 60px; transform: none; width: 100%; max-width: 512px; height: 0; overflow: hidden; transition: height 0.5s; z-index: 30; } 

.pillgram_ad_area .exit_pillgram_ad { position: absolute; right: 16px; top: 16px; width: 16px; height: 16px; background-image: url(../image/icon_exit02.svg); background-repeat: no-repeat; background-position: center center; background-size: 16px; text-indent: -99999px; overflow: hidden; } 

.pillgram_ad_area .link { width: 100%; display: inline-block; height: auto; } 

.pillgram_ad_area img { transform: none; width: 100%; height: auto; max-height: inherit; max-width: inherit; position: static; } 

.contents_area { transition: padding 0.5s; } 

/* GNB */
.gnb_area { position: fixed; width: 0px; height: 100%; max-width: 512px; top: 0; right: 0; transition: width 0.5s; background-color: #ffffff; z-index: 100; overflow: hidden; } 
.gnb_area.on { width: 100%; } 

.gnb_area .logo { position: absolute; top: 20px; left: 32px; } 

.gnb_area .gnb_exit { display: inline-block; width: 32px; height: 32px; text-indent: -999999px; background-image: url(../image/icon_exit.svg); background-repeat: no-repeat; background-position: center center; background-size: 24px; position: absolute; right: 12px; top: 20px; } 

.gnb_area .gnb_list { position: absolute; top: 150px; left: 32px; } 

.gnb_area .gnb_list li { margin-bottom: 24px; } 

.gnb_area .gnb_list li:last-of-type { margin-bottom: 0px; } 

.gnb_area .gnb_list li a { font-weight: bold; font-size: 24px; line-height: 20px; white-space: nowrap; } 

.gnb_area .copyright { position: absolute; left: 32px; bottom: 24px; font-weight: normal; font-size: 11px; line-height: 16px; color: #888888; } 


/* -- Layer Popup -- */
.fake_dim { z-index: 500; position: fixed; width: 100%; height: 100%; left: 0; top: 0; background-color: rgba(255,255,255,0); display: none; } 

.fake_dim.on { display: block; } 

.pc_pop_wrap { display: none; } 

.pc_pop_wrap.on { display: block; } 

.dim { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0,0,0,0.6); display: none; } 

.pc_pop_wrap.only_pc_type { width: 100%; } 

.pc_pop_wrap.only_pc_type .dim { width: 100%; left: 0; right: inherit; } 

.pc_pop_wrap.only_pc_type .popup_wrap { left: 50%; transform: translateX(-50%); } 

.dim.on { display: block; } 

.popup_wrap { position: fixed; left: 0; bottom: 0; width: 100%; height: 100%; display: none; } 

.popup_wrap.on { display: block; } 

.popup { display: none; background-color: #ffffff; } 

.popup.on { display: block; } 


.popup .popup_text_area > h3,
.popup .popup_text_area > strong { font-size: 18px; font-weight: 700; line-height: 25px; }
.popup .popup_text_area .popup_desc { font-size: 12px; font-weight: 400; color: #888888; line-height: 22px; text-align: center; width: 100%; margin-top: 10px; }
.popup .popup_text_area .guide_text { width: 100%; font-size: 13px; font-weight: 700; color: #00ab91; line-height: 20px; margin-top: 20px; display: flex; align-items: flex-start; justify-content: center; }
.popup .popup_text_area .guide_text::before { content: ""; display: inline-block; width: 16px; height: 16px; background: url(../image/icon_info_g.svg) no-repeat center center; background-size: 16px; margin-right: 4px; margin-top: 2px; }

/* Type A */
.popup.typeA { position: fixed; bottom: 0; width: 100%; height: 0; padding: 0 24px 0; text-align: center; border-radius: 24px 24px 0 0; overflow: hidden; display: block; transition: all 0.5s; } 
.popup.typeA .popup_text_area { text-align: center; margin-bottom: 20px; padding: 16px 0; min-height: 120px; display: flex; justify-content: center; align-items: center; } 
.popup.typeA.on { padding: 24px 24px 24px; height: 244px; } 
.popup.typeA .popup_text_area.sub_text_type { padding-top: 20px; align-items: unset; flex-wrap: wrap; } 
.popup.typeA .popup_text_area.sub_text_type span { display: block; font-weight: normal; font-size: 14px; line-height: 20px; color: #888888; width: 100%; margin-top: 8px; } 

/* Type B */
.popup.typeB { position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%); padding: 24px; width: 312px; padding: 24px; border-radius: 24px; } 
.popup.typeB .popup_text_area { text-align: center; padding: 16px 0; min-height: 120px; display: flex; justify-content: center; align-items: center; flex-direction: column; } 
.popup.typeB.type_radio .popup_text_area { margin-bottom: 8px; } 
.popup.typeB.type_radio .chk_list_area { margin-bottom: 32px; } 
.popup.typeB.type_radio .chk_list_area ul { display: flex; justify-content: center; } 
.popup.typeB.type_radio .chk_list_area input[type="radio"] + label { padding-left: 24px; margin-right: 8px; position: relative; font-weight: normal; font-size: 14px; line-height: 20px; } 
.popup.typeB.type_radio .chk_list_area input[type="radio"] + label::before { position: absolute; left: 0; top: 50%; transform: translateY(-50%); width: 16px; height: 16px; box-sizing: border-box; content: ""; background-color: #f0f0f0; border-radius: 50%; } 
.popup.typeB.type_radio .chk_list_area input[type="radio"]:checked + label::before { border-width: 4px; border-style: solid; background-color: #ffffff; } 

.popup_input_title { text-align: left; font-weight: bold; font-size: 18px; line-height: 25px; } 
.popup_input_title + .input_box { margin-top: 25px; } 
.popup_input_title + .input_box + .bot_btn_area { margin-top: 25px; } 

/* Toast Popup */
.toast_popup_wrap { position: fixed; top: 100%; left: 0; overflow: hidden; transition: all 0.5s; width: 100%; height: 100%; }

.toast_popup_wrap.active { top: 0; } 

.toast_popup { width: 100%; height: 100%; background-color: #f8f8f8; position: relative; display: none; border-radius: 24px 24px 0 0; } 
.toast_popup.bot_type01 { width: 100%; position: absolute; bottom: 0; padding: 20px 24px 24px; height: auto; } 
.toast_popup.bot_type01 .header { height: 24px; } 
.toast_popup.bot_type01 .header .exit { right: 0; margin-top: 8px; } 
.toast_popup.bot_type01 .title_area { padding: 0}
.toast_popup.bot_type01 .title_area .title { font-weight: 700; font-size: 18px; line-height: 25px; } 
.toast_popup.bot_type01 .popup_btn_area { position: relative; padding: 0; margin-top: 24px; } 

.toast_popup.on { bottom: 0; display: block; } 

.toast_popup .header { position: relative; top: 0; left: 0; width: 100%; height: 60px; z-index: 300; background-color: #f8f8f8; } 

.toast_popup .header .edit_btn { position: absolute; left: 24px; top: 50%; transform: translateY(-50%); font-weight: 400; font-size: 14px; line-height: 20px; } 

.toast_popup .header .title { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); font-weight: 500; font-size: 16px; line-height: 20px; } 

.toast_popup .header .exit { position: absolute; right: 12px; top: 50%; transform: translateY(-50%); text-indent: -99999px; width: 32px; height: 32px; background-image: url(../image/icon_exit.svg); background-repeat: no-repeat; background-position: center center; background-color: #f8f8f8; } 

.toast_popup .title_area { padding: 16px 24px 24px; background-color: #f8f8f8; z-index: 300; position: sticky; } 

.toast_popup .title_area .top_text { display: block; font-weight: 500; font-size: 14px; line-height: 18px; color: #888888; } 

.toast_popup .title_area .title { display: block; margin-top: 8px; font-weight: bold; font-size: 24px; line-height: 30px; } 

.toast_popup .title_area .bot_text { display: block; margin-top: 4px; font-weight: normal; font-size: 14px; line-height: 18px; color: #888888; } 

.toast_popup .contents_area { position: absolute; left: 0; top: 0; width: 100%; height: 100%; padding: 178px 24px 104px; overflow: auto; z-index: 250; } 

.toast_popup .contents_area.only_list { padding: 92px 24px 120px; } 

.toast_popup .contents_area.full_contents { padding: 60px 24px 24px; } 

.toast_popup .contents_area .inner_list li { margin-bottom: 8px; } 

.toast_popup .contents_area .inner_list li:last-of-type { margin-bottom: 0; } 

.toast_popup .contents_area .inner_list label { background-color: #ffffff; border: 1px solid #e6e6e6; box-sizing: border-box; border-radius: 12px; width: 100%; height: 52px; line-height: 52px; display: block; padding: 0 16px 0 48px; font-weight: 500; font-size: 16px; color: #888888; position: relative; } 

.toast_popup .contents_area .inner_list label::after { content: ""; width: 20px; height: 20px; display: inline-block; background-color: #e6e6e6; border-radius: 50%; position: absolute; left: 16px; top: 50%; transform: translateY(-50%); border: 5px solid #e6e6e6; box-sizing: border-box; } 

.toast_popup .contents_area .inner_list.type_chk label::after { border: 0; background-image: url(../image/icon_chk03_g.svg); background-color: transparent; } 

.toast_popup .contents_area .inner_list input:checked + label { color: #ffffff; } 

.toast_popup .contents_area .inner_list input:checked + label::after { border-color: #ffffff; background-color: transparent; } 

.toast_popup .contents_area .inner_list.type_chk input:checked + label::after { background-image: url(../image/icon_chk02_w.svg); } 

.toast_popup .contents_area .inner_list.type_left_three_line label { padding: 16px 16px 16px 48px; min-height: 52px; height: auto; } 

.toast_popup .contents_area .inner_list.type_left_three_line label span { width: 100%; display: block; } 

.toast_popup .contents_area .inner_list.type_left_three_line label span.title { font-weight: 500; font-size: 16px; line-height: 20px; height: 20px; color: #333333; margin-bottom: 4px; } 

.toast_popup .contents_area .inner_list.type_left_three_line label span.sub_text { font-weight: 500; font-size: 13px; line-height: 18px; height: 18px; color: #888888; } 

.toast_popup .contents_area .inner_list.type_left_three_line label span.date_text { font-weight: 500; font-size: 13px; line-height: 18px; height: 18px; color: #888888; } 

.toast_popup .contents_area .inner_list.type_left_three_line input:checked + label span { color: #ffffff; } 

.toast_popup .contents_area .inner_list { height: 100%; padding: 0; overflow: auto; } 

.toast_popup .contents_area.btn_text_hi_set .inner_list { height: calc(100% - 48px); } 

.toast_popup .contents_area.btn_text_hi_set + .popup_btn_area { padding-top: 16px; } 

.toast_popup .contents_area .select_date_area { padding: 0; width: 312px; } 

.toast_popup .contents_area .date_select_box { width: 312px; } 

.toast_popup .popup_btn_area { position: absolute; bottom: 0; left: 0; width: 100%; padding: 24px; z-index: 300; background-color: #f8f8f8; } 
.toast_popup .popup_btn_area.typeB { display: flex; flex-direction: column; } 
.toast_popup .popup_btn_area.typeB .btn + .btn { margin-top: 16px; } 

.toast_popup .popup_btn_area .btn_sub_text { margin-bottom: 16px; font-weight: bold; font-size: 14px; line-height: 20px; display: flex; justify-content: flex-start; align-items: flex-start; } 

.toast_popup .popup_btn_area .btn_sub_text svg { display: inline-block; width: 18px; height: 18px; margin-right: 6px; } 

.toast_popup .popup_btn_area .btn_sub_text svg .st0 { fill: none; stroke-width: 2; } 

.toast_popup .popup_btn_area .btn_sub_text svg .st1 { fill: none; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; } 

.popup.typeC { position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%); width: calc(100% - 48px); height: calc(100% - 96px); max-height: 800px; border-radius: 16px; padding: 32px 24px 24px; display: none; flex-direction: column; } 

.popup.typeC.on { display: flex; } 

.popup.typeC .faq_view_area { display: flex; flex-direction: column; height: calc(100% - 110px)}

.popup.typeC .faq_view_area .title { font-weight: 700; font-size: 18px; line-height: 24px; text-align: center; display: block; } 

.popup.typeC .faq_view_area .inner_scroll_area { margin-top: 32px; height: calc(100% - 56px); overflow: auto; padding-right: 16px; } 

.popup.typeC .bot_contents_area { display: flex; flex-direction: column; justify-content: flex-end; padding-top: 8px; } 

.popup.typeC .chk_agree_area input[type="checkbox"] + label { display: inline-block; padding-left: 32px; font-weight: 500; font-size: 14px; line-height: 20px; position: relative; } 

.popup.typeC .chk_agree_area input[type="checkbox"] + label::after { content: ""; display: inline-block; position: absolute; width: 20px; height: 20px; left: 0; top: 0; background-color: #e6e6e6; border-radius: 50%; background-image: url(../image/icon_chk01_w.svg); background-repeat: no-repeat; background-position: 4px center; } 

.popup.typeC .faq_view_area .faq_list dt { font-weight: 700; font-size: 15px; line-height: 20px; word-break: keep-all; } 

.popup.typeC .faq_view_area .faq_list dt::before { content: "Q"; display: inline-block; font-weight: 700; font-size: 15px; line-height: 20px; margin-right: 6px; } 

.popup.typeC .faq_view_area .faq_list dt + dd { margin-top: 8px; } 

.popup.typeC .faq_view_area .faq_list dd + dt { margin-top: 16px; } 

.popup.typeC .faq_view_area .faq_list dd { font-weight: 400; font-size: 14px; line-height: 22px; color: #888888; word-break: keep-all; }

.popup.typeC .bot_btn_area { margin-top: 16px; } 

.toast_popup .contents_area.full_contents .inner_scroll_contents { margin-top: 24px; height: calc(100% - 206px); padding: 0}

.toast_popup .contents_area.full_contents .inner_list { height: auto; } 

.toast_popup .contents_area.full_contents + .popup_btn_area { padding-top: 14px; } 

/* Main */
.contents_section .section_title { font-weight: bold; font-size: 20px; line-height: 26px; } 

.contents_area.main_contents { padding: 60px 0 0; transition: margin-top 0.5s padding-top 0.5s; } 

.contents_area.main_contents02 { padding: 0px 0 0; } 

.contents_area.main_contents .main_title { text-align: center; font-weight: bold; font-size: 24px; line-height: 30px; margin-bottom: 20px; } 

.contents_area.type_w { background-color: #ffffff; } 

.contents_area.main_contents .box { width: 100%; padding: 28px; box-sizing: border-box; background-color: #ffffff; box-shadow: 4px 8px 12px rgba(227, 224, 224, 0.25); border-radius: 16px; overflow: hidden; } 

.contents_area.main_contents .top_contents_box { margin-bottom: 24px; padding: 32px; text-align: center; font-weight: bold; font-size: 20px; } 

.contents_area.main_contents .swiper { margin-top: 32px; width: 100%; height: 340px; } 

.contents_area.main_contents .swiper-pagination { margin-top: 24px; position: relative; } 

.contents_area.main_contents .swiper-pagination-bullet { background-color: #c4c4c4; width: 10px; height: 10px; margin-right: 8px; transition: all 0.3s; } 

.contents_area.main_contents .swiper-pagination-bullet-active { border-radius: 33px; width: 28px; } 

.contents_area.main_contents .swiper .num { display: block; font-weight: bold; font-size: 18px; line-height: 25px; } 

.contents_area.main_contents .swiper .title { display: block; font-weight: bold; font-size: 18px; line-height: 23px; } 

.contents_area.main_contents .swiper.ex_type .title { line-height: 26px; } 

.contents_area.main_contents .swiper.ex_type p { margin-top: 8px; } 

.contents_area.main_contents .swiper p { margin-top: 16px; font-weight: normal; font-size: 14px; line-height: 18px; } 

.contents_area.main_contents .swiper p strong { font-weight: bold; } 

.contents_area.main_contents .swiper em { display: block; margin-top: 10px; font-weight: bold; font-size: 14px; line-height: 18px; } 

.contents_area.main_contents .swiper .img_area { position: absolute; left: 0; bottom: 0; height: 176px; width: 100%; background-repeat: no-repeat; background-position: center; } 

.contents_area.main_contents .swiper .img_area.guide01 { background-image: url(../image/img_main_guide1-1.jpg); } 

.contents_area.main_contents .swiper .img_area.guide02 { background-image: url(../image/img_main_guide1-2.png); } 

.contents_area.main_contents .swiper .img_area.guide03 { background-image: url(../image/img_main_guide1-3.jpg); } 

.contents_area.main_contents .swiper.ex_type .img_area { background-size: contain; } 

.contents_area.main_contents .swiper.ex_type .img_area.guide01 { background-image: url(../image/img_main_ex_guide01.svg); } 

.contents_area.main_contents .swiper.ex_type .img_area.guide02 { background-image: url(../image/img_main_ex_guide02.svg); } 

.contents_area.main_contents .swiper.ex_type .img_area.guide03 { background-image: url(../image/img_main_ex_guide03.svg); } 

.contents_area.main_contents .swiper.ex_type .box { padding: 0; height: 228px; } 

.contents_area.main_contents .ex_swiper_area { background: #FFFFFF; box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.04); border-radius: 16px; padding: 32px 28px 20px; height: 357px; overflow: hidden; margin-top: 16px; } 

.contents_area.main_contents .ex_swiper_area .swiper.ex_type { overflow: hidden; width: 100%; box-shadow: none; border-radius: 0; } 

.contents_area.main_contents .ex_swiper_area .swiper.ex_type .box { border-radius: 0; box-shadow: none; } 

.contents_area.main_contents .ex_swiper_area .swiper.ex_type { margin-top: 16px; } 

.contents_area.main_contents .ex_swiper_area .swiper.ex_type .img_area { height: 107px; bottom: 0px; } 

.contents_area.main_contents .ex_guide_area { margin-top: 24px; } 

.contents_area.main_contents .ex_guide_area .box + .box { margin-top: 16px; } 

.contents_area.main_contents .ex_guide_area .box { box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.04); border-radius: 16px; } 

.contents_area.main_contents .ex_guide_area .box .num { display: block; font-weight: 700; font-size: 18px; line-height: 25px; } 

.contents_area.main_contents .ex_guide_area .box .title { font-weight: 700; font-size: 18px; line-height: 26px; } 

.contents_area.main_contents .ex_guide_area .box p { margin-top: 8px; font-weight: 400; font-size: 14px; line-height: 19px; } 

.contents_area.main_contents .ex_guide_area .box .img_area { margin-top: 24px; } 

.slide_area { position: relative; } 

.slide_area .box { position: relative; transition: all 1.3s; } 

.slide_area .box.on { top: 0; opacity: 1; } 

.slide_area .box { top: 0; opacity: 0; } 

.slide_area.type02 .box { position: relative; opacity: 1; margin-bottom: 24px; } 

.slide_area.type02 .box.on { opacity: 1; transform: translateY(0px); } 

.slide_area.type02 .box:last-of-type { margin-bottom: 0px; } 

.contents_section.main_section02 .slide_area .box .text_area { transform: translateY(100%); opacity: 0; transition: all 1.3s; } 

.contents_section.main_section02 .slide_area .box .text_area.on { transform: translateY(0); opacity: 1; } 


.main_section01 .slide_area .box { display: flex; justify-content: space-between; margin-bottom: 12px; height: 100px; } 

.main_section01 .slide_area .box p { font-weight: bold; font-size: 20px; line-height: 26px; } 

.contents_section { padding: 40px 24px; overflow: hidden; } 

.contents_section.main_section02 { text-align: center; } 

.contents_section.main_section02 .slide_area { margin-top: 32px; } 

.contents_section.main_section02 .slide_area .box { padding: 24px 24px 0; text-align: left; min-height: 340px; } 

.contents_section.main_section02 .slide_area .box .img_area { width: 100%; height: 192px; position: absolute; left: 50%; transform: translateX(-50%); bottom: 0; } 

.contents_section.main_section02 .slide_area .box .img_area img { display: block; margin: 0 auto; width: auto; height: 100%; } 

.contents_section.main_section02 .text_area .num { display: block; font-weight: bold; font-size: 18px; line-height: 25px; color: #000000; } 

.contents_section.main_section02 .text_area .title { display: block; font-weight: bold; font-size: 18px; line-height: 26px; } 

.contents_section.main_section02 .text_area .state { font-weight: bold; font-size: 16px; line-height: 25px; color: #888888; } 

.contents_section.main_section02 .text_area p { margin-top: 4px; font-weight: normal; font-size: 14px; line-height: 20px; } 

.contents_section.main_section02 .text_area p strong { font-weight: bold; } 

.contents_section .section_title.notice_type { display: flex; justify-content: center; align-items: center; } 

.contents_section .section_title.notice_type svg { margin-right: 12px; display: inline-block; } 

.contents_section .section_title.center_type { text-align: center; } 

.contents_section .ex_img_guide_text { margin-top: 0px; text-align: center; font-weight: 400; font-size: 14px; line-height: 20px; color: #888888; } 

.contents_section .section_title + .ex_img_guide_text { margin-top: 16px; } 

.contents_section.main_section03 .notice_box_area { margin-top: 26px; } 

.contents_section.main_section03 .notice_box_area .box { text-align: center; margin-bottom: 24px; } 

.contents_section.main_section03 .notice_box_area .title { font-weight: bold; font-size: 18px; line-height: 26px; display: flex; align-items: center; justify-content: center; } 

.contents_section.main_section03 .notice_box_area .service_title { margin-bottom: 20px; } 

.contents_section.main_section03 .notice_box_area .title i { display: inline-block; width: 24px; height: 24px; background-repeat: no-repeat; background-position: center; margin-right: 10px; } 

.contents_section.main_section03 .notice_box_area .title i.call { background-image: url(../image/icon_call.svg); } 

.contents_section.main_section03 .notice_box_area .title i.clock { background-image: url(../image/icon_clock.svg); } 

.contents_section.main_section03 .notice_box_area dl.contents_text01 { margin-top: 24px; } 

.contents_section.main_section03 .notice_box_area dl.contents_text01 dt { font-weight: 700; font-size: 14px; line-height: 20px; text-align: center; } 

.contents_section.main_section03 .notice_box_area dl.contents_text01 dd { font-weight: 400; font-size: 14px; line-height: 20px; text-align: center; } 

.contents_section.main_section03 .notice_box_area dl.contents_text01 dt + dd { margin-top: 8px; } 

.contents_section.main_section03 .notice_box_area dl.contents_text01 dd + dt { margin-top: 24px; } 

.contents_section.main_section03 .notice_box_area .phone_title { display: block; margin-top: 20px; font-weight: normal; font-size: 14px; line-height: 20px; } 

.contents_section.main_section03 .notice_box_area .phone_num { display: block; font-weight: bold; font-size: 18px; line-height: 25px; } 

.contents_section.main_section03 .notice_box_area .phone_num + .phone_title { margin-top: 16px; } 

.contents_section.main_section03 .notice_box_area .info_text { margin-top: 8px; font-weight: normal; font-size: 14px; line-height: 20px; } 

.contents_section.main_section03 .notice_box_area .info_text.type_gray { color: #888888; font-weight: 500; } 

.contents_section.main_section03 .notice_box_area .sub_text { margin-top: 16px; font-weight: bold; font-size: 14px; line-height: 20px; } 

.contents_section.main_section03 .notice_box_area .info_text_list { margin-top: 20px; font-weight: normal; font-size: 14px; line-height: 20px; } 

.contents_section.main_section03 .notice_box_area .download_area { margin-top: 48px; } 

.contents_section.main_section03 .notice_box_area .download_icon { display: flex; width: 100%; justify-content: center; align-items: center; font-weight: bold; font-size: 18px; line-height: 26px; } 

.contents_section.main_section03 .notice_box_area .download_icon i { display: inline-block; width: 24px; height: 24px; margin-right: 10px; background-image: url(../image/icon_download.svg); background-repeat: no-repeat; background-position: center; } 

.contents_section.main_section03 .notice_box_area .btn_sub_text { font-weight: normal; font-size: 14px; line-height: 20px; } 

.contents_section.main_section03 .notice_box_area .btn_sub_text em { font-weight: bold; } 

.contents_section.main_section03 .notice_box_area .main_text { font-weight: bold; font-size: 20px; line-height: 28px; } 


.contents_section.main_section03 .notice_box_area .box.drop_type { transition: height 0.5s; overflow: hidden; height: 66px; padding: 0; } 

.contents_section.main_section03 .notice_box_area .box.drop_type .title_area { position: relative; height: 66px; line-height: 66px; cursor: pointer; } 

.contents_section.main_section03 .notice_box_area .box.drop_type .title_area strong { height: 66px; line-height: 66px; position: relative; } 

.contents_section.main_section03 .notice_box_area .box.drop_type .title_area strong + i { content: ""; display: inline-block; position: absolute; width: 16px; height: 16px; background-image: url(../image/icon_drop_arrow02.svg); background-repeat: no-repeat; background-position: center center; right: 24px; margin-right: 0; top: 50%; transform: translateY(-50%); transition: all 0.5s; } 

.contents_section.main_section03 .notice_box_area .box.drop_type.active .title_area strong + i { transform: translateY(-50%) rotate(180deg); } 

.contents_section.main_section03 .notice_box_area .box.drop_type .drop_area { padding: 16px 0 20px; } 

.contents_section.main_section03 .notice_box_area .box.drop_type .drop_area .sub_text { margin-top: 0; } 

.contents_section.main_section03 .notice_box_area .box.drop_type .drop_area .info_text_list { margin-top: 0; } 

.contents_section.main_section03 .notice_box_area .box.drop_type .drop_area .info_text_list + .phone_num { margin-top: 8px; } 

.contents_section.main_section04 { border-bottom: 0px; text-align: center; padding-bottom: 88px; padding-top: 0; } 

.contents_section.main_section04 .download_list { margin: 20px auto 0; display: flex; justify-content: space-between; max-width: 312px; } 

.contents_section.main_section04 .download_list li { width: 64px; height: 64px; text-align: center; } 

.contents_section.main_section04 .download_list li a { display: inline-block; width: 100%; height: 100%; background-color: #ffffff; border-radius: 10px; padding: 12px 8px; } 

.contents_section.main_section04 .download_list li a i { display: inline-block; width: 100%; height: 26px; background-repeat: no-repeat; background-position: center center; } 

.contents_section.main_section04 .download_list li a.icon_pdf i { background-image: url(../image/icon_pdf.svg); } 

.contents_section.main_section04 .download_list li a.icon_word i { background-image: url(../image/icon_word.svg); } 

.contents_section.main_section04 .download_list li a.icon_hwp i { background-image: url(../image/icon_hwp.svg); } 

.contents_section.main_section04 .download_list li a span { font-weight: bold; font-size: 10px; line-height: 14px; display: block; margin-top: 6px; } 

footer,
.contents_area.main_contents footer,
.contents_area.main_contents02 footer { padding: 20px 0; text-align: center; background-color: #888888; color: #f0f0f0; } 

footer .footer_info_text,
.contents_area.main_contents footer .footer_info_text { font-weight: 500; font-size: 10px; line-height: 14px; } 

footer .footer_copyright,
.contents_area.main_contents footer .footer_copyright { font-weight: normal; font-size: 10px; line-height: 14px; margin-top: 14px; } 

.contents_area.main_contents02 footer .footer_info_text { font-weight: 500; font-size: 10px; line-height: 14px; } 

.contents_area.main_contents02 footer .footer_copyright { font-weight: normal; font-size: 10px; line-height: 14px; margin-top: 14px; } 

.high { display: inline-block; position: relative; z-index: 10; } 

.high::before { content: ""; position: absolute; display: inline-block; width: 100%; height: 50%; z-index: -1; left: 0; bottom: 0; } 

/* SVG */
.svg_main01 .st0 { fill-rule: evenodd; clip-rule: evenodd; fill: #3E3A39; } 

.svg_main01 .st1 { fill-rule: evenodd; clip-rule: evenodd; } 

.svg_main02 .st1 { fill-rule: evenodd; clip-rule: evenodd; fill: #3E3A39; } 

.svg_main03 .st0 { fill-rule: evenodd; clip-rule: evenodd; fill: #3E3A39; } 

.svg_main03 .st1 { fill-rule: evenodd; clip-rule: evenodd; } 

.svg_main01,
.svg_main02,
.svg_main03 { width: 44PX; } 

.svg_main04 { display: inline-block; width: 24px; } 

/* Slide Effect */

/* Contents */
.contents_area { padding: 60px 24px 24px; min-height: 100%; position: relative; } 

.contents_area.fix_btn_type { padding-bottom: 120px; } 

.contents_area.full_type { padding: 0; padding-top: 60px; } 

.contents_area.full_type.tab_type { padding-top: 60px; } 

.contents_area .hospital_change_link { display: inline-block; margin-top: 10px; font-weight: 500; font-size: 16px; line-height: 20px; } 
.contents_area .hospital_change_link + .contents_title { padding-top: 20px; } 
.contents_area .contents_title { padding-top: 42px; font-weight: bold; font-size: 24px; line-height: 30px; } 

.contents_area .contents_title + .contents_sub_text { margin-top: 8px; font-weight: normal; font-size: 14px; line-height: 20px; color: #888888; } 

.contents_area .link_list.type_wide { margin-top: 32px; } 

.contents_area .link_list.type_wide .link_box { margin-top: 16px; text-align: center; } 
.contents_area .link_list.type_wide .faq_link { font-weight: 500; font-size: 16px; line-height: 20px; display: flex; justify-content: center; align-items: center; } 
.contents_area .link_list.type_wide .faq_link span { display: inline-block; border-bottom: 1px solid; } 
.contents_area .link_list.type_wide .contect_num_area { margin-top: 88px; text-align: center; } 
.contents_area .link_list.type_wide .contect_num_area .guide_text { font-weight: 700; font-size: 15px; line-height: 20px; color: #888888; } 
.contents_area .link_list.type_wide .faq_link svg { width: 12px; height: 12px; margin-left: 4px; } 

.contents_area .link_list.type_wide .contect_num_text { margin-top: 8px; text-align: center; font-weight: 400; font-size: 14px; line-height: 20px; color: #888888; } 

.contents_area .link_list.type_wide li { position: relative; width: 100%; height: 138px; margin-bottom: 16px; } 

.contents_area .link_list.type_wide li:last-of-type { margin-bottom: 0; } 

.contents_area .link_list.type_wide li label { position: absolute; left: 0; top: 0; width: 100%; height: 100%; border-radius: 32px; z-index: 5; } 

.contents_area .link_list.type_wide li .link_btn { width: 100%; height: 100%; background-color: #ffffff; display: inline-block; border-radius: 32px; line-height: 138px; font-weight: bold; font-size: 20px; top: 0; left: 0; position: absolute; background-repeat: no-repeat; background-position: center calc(40px); text-align: center; border-width: 1px; border-style: solid; border-color: #e6e6e6; box-sizing: border-box; padding-top: 12px; } 

.contents_area .link_list.type_wide li:nth-of-type(1) .link_btn { background-image: url(../image/icon_chk_bg01_b.svg); } 

.contents_area .link_list.type_wide li:nth-of-type(2) .link_btn { background-image: url(../image/icon_chk_bg02_b.svg); } 

.contents_area .link_list.type_wide li:nth-of-type(1) .link_btn:active { background-image: url(../image/icon_chk_bg01_w.svg); } 

.contents_area .link_list.type_wide li:nth-of-type(2) .link_btn:active { background-image: url(../image/icon_chk_bg02_w.svg); } 

.contents_area .link_list.type_wide li .link_btn:active { color: #ffffff; } 

.contents_area .link_list.type_wide li .link_btn:active::after { background-image: url(../image/icon_arrow_link_on.svg); } 

.contents_area .link_list.type_wide + .bot_btn_area { margin-top: 74px; } 

.contents_area .time_chk_area { margin-top: 32px; } 

.contents_area .brith_chk_area { margin-top: 24px; } 

.contents_area .time_chk_area .sub_title { font-weight: bold; font-size: 16px; line-height: 20px; } 

.contents_area .time_chk_area ul { margin-top: 24px; } 

.contents_area .time_chk_area li,
.contents_area .brith_chk_area li { position: relative; width: 100%; height: 52px; margin-bottom: 8px; } 

.contents_area .time_chk_area li:last-of-type,
.contents_area .brith_chk_area li:last-of-type { margin-bottom: 0; } 

.contents_area .time_chk_area li label,
.contents_area .brith_chk_area li label { position: absolute; left: 0; top: 0; width: 100%; height: 100%; border-radius: 12px; z-index: 5; } 

.contents_area .time_chk_area li .label_text,
.contents_area .brith_chk_area li .label_text { width: 100%; height: 100%; background-color: #ffffff; border-width: 1px; border-style: solid; border-color: #e6e6e6; display: inline-block; border-radius: 12px; line-height: 52px; padding-left: 48px; font-weight: 500; font-size: 16px; color: #888888; top: 0; left: 0; position: absolute; box-sizing: border-box; } 

.contents_area .time_chk_area li .label_text::after,
.contents_area .brith_chk_area li .label_text::after { content: ""; width: 20px; height: 20px; display: inline-block; background-color: #e6e6e6; border-radius: 50%; position: absolute; left: 16px; top: 50%; transform: translateY(-50%); border: 5px solid #e6e6e6; box-sizing: border-box; } 

.contents_area .time_chk_area li input[type="radio"]:checked + .label_text,
.contents_area .brith_chk_area li input[type="radio"]:checked + .label_text { color: #ffffff; } 

.contents_area .time_chk_area li input[type="radio"]:checked + .label_text::after,
.contents_area .brith_chk_area li input[type="radio"]:checked + .label_text::after { background-color: transparent; border-color: #ffffff; } 


.search_input_area.list_top_search_area { margin-top: 24px; } 

.contents_area .certi_list_area { margin-top: 16px; } 

.contents_area .certi_list_area.start_type { margin-top: 48px; } 

.contents_area .certi_list_area .certi_list { margin-top: 12px; min-height: 160px; } 

.contents_area .child_list_area { padding: 0 24px 0; } 

.contents_area .certi_list_area .certi_list li,
.contents_area .child_list_area .child_list li { position: relative; width: 100%; height: 76px; margin-bottom: 8px; } 

.contents_area .certi_list_area .certi_list.slim_type li,
.contents_area .child_list_area .child_list.slim_type li { height: 52px; } 

.contents_area .certi_list_area .certi_list li:last-of-type,
.contents_area .child_list_area .child_list li:last-of-type { margin-bottom: 0; } 

.contents_area .certi_list_area .certi_list li label,
.contents_area .child_list_area .child_list li label { position: absolute; left: 0; top: 0; width: 100%; height: 100%; display: inline-block; border-radius: 12px; z-index: 5; } 

.contents_area .certi_list_area .certi_list li.disabled label,
.contents_area .child_list_area .child_list li.disabled label { cursor: not-allowed; } 

.contents_area .certi_list_area .certi_list li .label_area,
.contents_area .child_list_area .child_list li .label_area { width: 100%; height: 100%; background-color: #ffffff; display: inline-block; border-radius: 12px; line-height: 76px; padding-left: 52px; padding-right: 16px; top: 0; left: 0; position: absolute; display: flex; justify-content: space-between; border-width: 1px; border-style: solid; border-color: #e6e6e6; } 

.contents_area .certi_list_area .certi_list.slim_type li .label_area,
.contents_area .child_list_area .child_list.slim_type li .label_area,
.contents_area .certi_list_area .certi_list.slim_type li .label_area strong,
.contents_area .child_list_area .child_list.slim_type li .label_area strong,
.contents_area .certi_list_area .certi_list.slim_type li .label_area span,
.contents_area .child_list_area .child_list.slim_type li .label_area span { line-height: 50px; } 

.contents_area .certi_list_area .certi_list li .label_area.birth_type strong { display: flex; align-items: center; justify-content: flex-start; } 

.contents_area .certi_list_area .certi_list li .label_area.birth_type strong i { display: inline-block; width: 24px; height: 24px; background-image: url(../image/icon_birth.svg); background-repeat: no-repeat; background-position: center; } 

.contents_area .certi_list_area .certi_list li input:checked + .label_area.birth_type strong i { background-image: url(../image/icon_birth_w.svg); } 

.contents_area .certi_list_area .certi_list li .label_area strong,
.contents_area .child_list_area .child_list li .label_area strong,
.contents_area .certi_list_area .certi_list li .label_area span,
.contents_area .child_list_area .child_list li .label_area span { font-weight: 500; font-size: 16px; line-height: 72px; white-space: nowrap; text-align: right; } 

.contents_area .certi_list_area .certi_list li .label_area span,
.contents_area .child_list_area .child_list li .label_area span { width: 100%; } 

.contents_area .certi_list_area .certi_list li .label_area .gray_type,
.contents_area .child_list_area .child_list li .label_area .gray_type { color: #888888; text-align: right; } 

.contents_area .certi_list_area .certi_list li input[type="radio"]:checked + .label_area .gray_type { color: #ffffff; } 

.contents_area .certi_list_area.start_type .certi_list li .label_area span,
.contents_area .child_list_area.start_type .child_list li .label_area span { font-weight: normal; } 


.contents_area .certi_list_area .child_list li .label_area .text_area,
.contents_area .certi_list_area .certi_list li .label_area .text_area { height: 72px; width: calc(100% - 100px); max-width: calc(100% - 100px); display: flex; flex-wrap: wrap; align-items: center; flex-direction: column; justify-content: center; height: 100%; } 

.contents_area .certi_list_area .child_list li .label_area .text_area strong,
.contents_area .certi_list_area .certi_list li .label_area .text_area strong { width: auto; line-height: 20px; height: 20px; text-align: left; width: 100%; } 

.contents_area .certi_list_area .child_list li .label_area .text_area p,
.contents_area .certi_list_area .certi_list li .label_area .text_area p { width: 100%; display: block; line-height: 18px; font-size: 12px; font-weight: normal; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; margin-top: 2px; color: #888888; } 

.contents_area .certi_list_area .child_list li input:checked + .label_area .text_area p,
.contents_area .certi_list_area .certi_list li input:checked + .label_area .text_area p { color: #ffffff; } 

.contents_area .certi_list_area .certi_list li input[type="radio"]:disabled + .label_area { cursor: none; background-color: #f0f0f0; border-color: #f0f0f0; } 

.contents_area .certi_list_area .certi_list li .label_area::after,
.contents_area .child_list_area .child_list li .label_area::after { content: ""; width: 20px; height: 20px; display: inline-block; background-color: #e6e6e6; border-radius: 50%; position: absolute; left: 16px; top: 50%; transform: translateY(-50%); border: 5px solid #e6e6e6; box-sizing: border-box; } 

/* 체크박스 이미지 없는 경우 */
.contents_area .certi_list_area .certi_list.type_none_chk li .label_area,
.contents_area .child_list_area .child_list.type_none_chk li .label_area { padding-left: 16px; } 

.contents_area .certi_list_area .certi_list.type_none_chk li .label_area::after,
.contents_area .child_list_area .child_list.type_none_chk li .label_area::after { display: none; } 

.contents_area .certi_list_area .certi_list.type_none_chk li .label_area .text_area { width: calc(100% - 80px); max-width: calc(100% - 80px); } 

.contents_area .certi_list_area .certi_list li .label_area::after,
.contents_area .child_list_area .child_list li .label_area::after { content: ""; width: 20px; height: 20px; display: inline-block; background-color: #e6e6e6; border-radius: 50%; position: absolute; left: 16px; top: 50%; transform: translateY(-50%); } 

.contents_area .certi_list_area .certi_list li input[type="checkbox"] + .label_area::after,
.contents_area .child_list_area .child_list li input[type="checkbox"] + .label_area::after { border: 0; background-image: url(../image/icon_chk03_g.svg); background-color: transparent; } 

.contents_area .certi_list_area .certi_list li input[type="checkbox"]:checked + .label_area::after,
.contents_area .child_list_area .child_list li input[type="checkbox"]:checked + .label_area::after { background-image: url(../image/icon_chk02_w.svg); } 

.contents_area .certi_list_area .certi_list li input[type="radio"]:checked + .label_area,
.contents_area .child_list_area .child_list li input[type="radio"]:checked + .label_area,
.contents_area .certi_list_area .certi_list li input[type="checkbox"]:checked + .label_area,
.contents_area .child_list_area .child_list li input[type="checkbox"]:checked + .label_area,
.contents_area .child_list_area .certi_list li input[type="checkbox"]:checked + .label_area .text_area p,
.contents_area .child_list_area .child_list li input[type="checkbox"]:checked + .label_area .text_area p { color: #ffffff; } 

.contents_area .certi_list_area .certi_list li input[type="radio"]:checked + .label_area::after,
.contents_area .child_list_area .child_list li input[type="radio"]:checked + .label_area::after { border-color: #ffffff; /*background-image: url(../image/icon_chk02_w.svg); */}

.contents_area .child_list_area .certi_list li input[type="radio"]:checked + .label_area .text_area p,
.contents_area .child_list_area .child_list li input[type="radio"]:checked + .label_area .text_area p { color: #ffffff; } 

.contents_area .certi_list_area + .bot_btn_area { margin-top: 34px; z-index: 5; } 

.contents_area .file_download_area { margin-top: 40px; } 

.contents_area .file_download_area .title { text-align: center; display: block; font-weight: bold; font-size: 20px; line-height: 29px; } 

.contents_area .file_download_area .download_list { margin: 20px auto 0; display: flex; justify-content: space-between; max-width: 312px; background-color: #ffffff; border-radius: 10px; } 

.contents_area .file_download_area .download_list li { width: 64px; height: 64px; text-align: center; } 

.contents_area .file_download_area .download_list li a { display: inline-block; width: 100%; height: 100%; border-radius: 10px; padding: 12px 8px; } 

.contents_area .file_download_area .download_list li a i { display: inline-block; width: 100%; height: 26px; background-repeat: no-repeat; background-position: center center; } 

.contents_area .file_download_area .download_list li a.icon_pdf i { background-image: url(../image/icon_pdf.svg); } 

.contents_area .file_download_area .download_list li a.icon_word i { background-image: url(../image/icon_word.svg); } 

.contents_area .file_download_area .download_list li a.icon_hwp i { background-image: url(../image/icon_hwp.svg); } 

.contents_area .file_download_area .download_list li a span { font-weight: bold; font-size: 10px; line-height: 14px; display: block; margin-top: 6px; } 

.contents_area .bot_text_area { margin-top: 40px; } 

.contents_area .bot_text_area dt { font-weight: bold; font-size: 14px; line-height: 20px; display: flex; align-items: center; } 

.contents_area .bot_text_area dt svg { width: 18px; height: 18px; vertical-align: middle; margin-right: 6px; } 

.contents_area .bot_text_area dt svg .st0 { fill: none; stroke-width: 2; } 

.contents_area .bot_text_area dt svg .st1 { fill: none; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; } 

.contents_area .bot_text_area dd { margin-top: 4px; font-weight: normal; font-size: 14px; line-height: 20px; color: #888888; margin-bottom: 32px; } 

.contents_area .bot_text_area dd:last-of-type { margin-bottom: 0; } 

.contents_area .none_result_area

.contents_area .issued_guide_text { margin: 24px 0; } 

.contents_area .issued_guide_text dt { font-weight: bold; font-size: 14px; line-height: 20px; display: flex; align-items: center; } 

.contents_area .issued_guide_text dt svg { width: 18px; height: 18px; vertical-align: middle; margin-right: 6px; } 

.contents_area .issued_guide_text dt svg .st0 { fill: none; stroke-width: 2; } 

.contents_area .issued_guide_text dt svg .st1 { fill: none; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; } 

.contents_area .issued_guide_text dd { margin-top: 4px; font-weight: normal; font-size: 14px; line-height: 20px; color: #888888; margin-bottom: 32px; } 

.contents_area .issued_guide_text dd:last-of-type { margin-bottom: 0; } 

.contents_area .none_result_area { text-align: center; padding: 40px 0 80px; font-weight: normal; font-size: 16px; line-height: 20px; color: #888888; } 

.contents_area .complete_list_area { margin-top: 32px; } 

.contents_area .complete_list_area strong { font-weight: normal; font-size: 14px; line-height: 20px; color: #888888; } 

.contents_area .complete_list_area ul { display: flex; flex-wrap: wrap; margin-top: 8px; } 

.contents_area .complete_list_area li { margin-right: 6px; display: inline-block; padding: 6px 8px; background-color: #e6e6e6; border-radius: 8px; font-weight: 500; font-size: 14px; color: #b3b3b3; } 

.contents_area .complete_list_area li:last-of-type { margin-right: 0px; } 

.contents_area .guide_main_box { padding-top: 104px; text-align: center; } 

.contents_area .guide_main_box svg { display: block; width: 48px; height: 48px; background-image: url(../image/icon_security.svg); background-repeat: no-repeat; background-position: center; margin: 0 auto; } 

.contents_area .guide_main_box .main_text { margin-top: 16px; font-weight: bold; font-size: 28px; line-height: 34px; } 

.contents_area .input_list_area { margin-top: 24px; } 

.contents_area .input_list_area li { margin-bottom: 16px; } 

.contents_area .input_list_area li:last-of-type { margin-bottom: 0px; } 

.contents_area .input_list_area .top_chk_area { display: flex; justify-content: space-between; } 

.contents_area .terms_list_area { margin-top: 40px; } 

.contents_area .terms_list_area .top_chk_area label { font-weight: 500; font-size: 16px; line-height: 150%; padding-left: 28px; position: relative; display: inline-block; } 

.contents_area .terms_list_area .top_chk_area label i { display: inline-block; width: 20px; height: 20px; position: absolute; left: 0; top: 50%; transform: translateY(-50%); background-color: #e6e6e6; border-radius: 50%; background-image: url(../image/icon_chkbox_w.svg); background-repeat: no-repeat; background-position: center center; } 

.contents_area .terms_list_area ul { margin-top: 24px; } 

.contents_area .terms_list_area ul li { display: flex; justify-content: space-between; align-items: center; margin-bottom: 16px; } 

.contents_area .terms_list_area ul label { position: relative; display: inline-block; padding-left: 28px; font-weight: normal; font-size: 14px; line-height: 150%; color: #888888; } 

.contents_area .terms_list_area ul label i { display: inline-block; width: 12px; height: 9px; position: absolute; left: 0; top: 50%; transform: translateY(-50%); } 

.contents_area .terms_list_area ul label i svg .cls-1 { fill: none; stroke: #c5c5c5; stroke-linecap: round; stroke-linejoin: round; stroke-width: 2px; } 

.contents_area .terms_list_area ul .btn { display: inline-block; width: auto; height: 20px; font-weight: normal; font-size: 13px; line-height: 150%; text-decoration: underline; color: #b3b3b3; } 

.ident_chk_area { margin-top: 72px; } 

.ident_chk_area ul { display: flex; justify-content: space-between; } 

.ident_chk_area ul li { width: calc(50% - 8px); } 

.ident_chk_area ul li label { width: 100%; height: 156px; text-align: center; display: inline-block; background-color: #ffffff; border-radius: 32px; font-weight: 500; font-size: 16px; color: #888888; padding-top: 92px; position: relative; } 

.ident_chk_area ul li label::after { content: ""; width: 32px; height: 32px; display: inline-block; top: 42px; position: absolute; left: 50%; transform: translateX(-50%); background-color: #ffffff; border-radius: 50%; background-image: url(../image/icon_chk03_g.svg); background-repeat: no-repeat; background-position: center center; background-size: 32px; } 

.ident_chk_area ul li input[type="radio"]:checked + label { color: #ffffff; } 

.ident_chk_area ul li input[type="radio"]:checked + label::after { background-image: url(../image/icon_chk02_w.svg); } 

.contents_area .fix_type_title { padding: 16px 0 0; } 

.contents_area.full_type .fix_type_title { padding: 16px 24px 24px; } 

.contents_area.full_type .fix_type_title.w_type { background-color: #ffffff; } 

.contents_area.full_type .fix_type_title.pb_set { padding: 16px 24px 16px; } 

.contents_area .fix_type_title .top_text { display: block; font-weight: 500; font-size: 14px; line-height: 18px; color: #888888; } 

.contents_area .fix_type_title .title { display: block; margin-top: 8px; font-weight: bold; font-size: 24px; line-height: 30px; } 

.contents_area .fix_type_title .bot_text { display: block; margin-top: 4px; font-weight: normal; font-size: 14px; line-height: 18px; color: #888888; } 

.contents_area .fix_type_title .bot_text em { display: block; } 

.contents_area .inner_scroll_contents { height: calc(100% - 270px); overflow: auto; padding: 0 24px; } 

.contents_area .inner_scroll_contents.pd_set { padding: 0; } 

.contents_area .inner_scroll_contents li { margin-bottom: 8px; min-height: 52px; } 

.contents_area .inner_scroll_contents li:last-of-type { margin-bottom: 0; } 

/* 차병원 증명서 조회 - 20220228 */
.contents_area .inner_scroll_contents .inner_list.type_del_btn li .box { background-color: #ffffff; border: 1px solid #e6e6e6; box-sizing: border-box; border-radius: 12px; padding: 16px; display: flex; justify-content: space-between; } 

.contents_area .inner_scroll_contents .inner_list.type_del_btn li .box .text_area { width: calc(100% - 65px); } 

.contents_area .inner_scroll_contents .inner_list.type_del_btn li .box .text_area strong { display: block; font-weight: 500; font-size: 16px; line-height: 20px; } 

.contents_area .inner_scroll_contents .inner_list.type_del_btn li .box .text_area span { display: block; margin-top: 4px; font-weight: 500; font-size: 13px; line-height: 18px; color: #888888; } 

.contents_area .inner_scroll_contents .inner_list.type_del_btn li .box .btn_area { display: flex; align-items: center; } 

.contents_area .inner_scroll_contents .inner_list.type_del_btn li .box .btn_area .del_doc_type { width: 65px; height: 32px; line-height: 32px; background-color: #f0f0f0; border-radius: 8px; font-weight: bold; font-size: 13px; line-height: 22px; letter-spacing: 0.25px; color: #888888; } 

.contents_area .inner_scroll_contents .inner_list.type_del_btn li .add_doc_btn { border: 2px dashed #e6e6e6; box-sizing: border-box; border-radius: 12px; width: 100%; height: 92px; line-height: 88px; padding-left: 28px; background-image: url(../image/icon_plus01.svg); background-repeat: no-repeat; background-position: calc(50% - 40px) center; font-weight: normal; font-size: 16px; color: #888888; background-size: 24px; } 


.contents_area .inner_scroll_contents label { width: 100%; min-height: 52px; line-height: 52px; background-color: #ffffff; display: inline-block; padding-left: 48px; border-radius: 12px; font-weight: 500; font-size: 16px; color: #888888; position: relative; border-width: 1px; border-style: solid; border-color: #e6e6e6; box-sizing: border-box; } 

.contents_area .inner_scroll_contents .etc_chk_area.type_dis input[type="radio"] + label span,
.contents_area .inner_scroll_contents .etc_chk_area.type_dis input[type="checkbox"] + label span { font-weight: normal; font-size: 16px; line-height: 20px; color: #888888; margin-top: 14px; display: block; width: calc(100% - 50px); } 

.contents_area .inner_scroll_contents .etc_chk_area.type_dis input[type="radio"] + label span em,
.contents_area .inner_scroll_contents .etc_chk_area.type_dis input[type="checkbox"] + label span em { font-weight: normal; font-size: 13px; line-height: 20px; color: #b3b3b3; margin-bottom: 14px; display: block; } 

.contents_area .inner_scroll_contents input:checked + label { color: #ffffff; } 

.contents_area .inner_scroll_contents label strong { font-weight: normal; font-size: 16px; line-height: 20px; color: #888888; margin-top: 14px; display: block; width: calc(100% - 50px); } 

.contents_area .inner_scroll_contents label p { font-weight: normal; font-size: 13px; line-height: 20px; color: #b3b3b3; margin-bottom: 14px; width: calc(100% - 50px); } 

.contents_area .inner_scroll_contents .inner_list.type_sub_text label { padding: 16px 16px 16px 48px; } 

.contents_area .inner_scroll_contents .inner_list.type_sub_text label .title { margin-top: 0px; } 

.contents_area .inner_scroll_contents .inner_list.type_sub_text label .sub_text { display: block; margin-top: 0; font-weight: normal; font-size: 13px; line-height: 20px; color: #b3b3b3; } 

.contents_area .inner_scroll_contents .inner_list.type_three_line_text label { padding: 16px 16px 16px 48px; display: flex; flex-wrap: wrap; } 

.contents_area .inner_scroll_contents .inner_list.type_three_line_text label .top_sub_text { display: block; width: 100%; font-weight: bold; font-size: 10px; line-height: 20px; height: 20px; } 

.contents_area .inner_scroll_contents .inner_list.type_three_line_text label .title { margin: 0; display: block; width: 100%; font-weight: 500; font-size: 16px; line-height: 20px; height: 20px; color: #888888; } 

.contents_area .inner_scroll_contents .inner_list.type_three_line_text .etc_chk_area label { padding: 0 16px 0 48px; } 

.contents_area .inner_scroll_contents .inner_list.type_three_line_text label .sub_text { display: block; width: 100%; font-weight: normal; font-size: 13px; line-height: 20px; height: 20px; color: #b3b3b3; } 

.contents_area .inner_scroll_contents .inner_list.type_three_line_text input:checked + label .top_sub_text,
.contents_area .inner_scroll_contents .inner_list.type_three_line_text input:checked + label .title,
.contents_area .inner_scroll_contents .inner_list.type_three_line_text input:checked + label .sub_text { color: #ffffff; } 


.contents_area .inner_scroll_contents input[type="radio"]:checked + label strong,
.contents_area .inner_scroll_contents input[type="checkbox"]:checked + label strong,
.contents_area .inner_scroll_contents .inner_list.type_sub_text input:checked + label .title { color: #ffffff; } 

.contents_area .inner_scroll_contents input[type="radio"]:checked + label p,
.contents_area .inner_scroll_contents input[type="checkbox"]:checked + label p,
.contents_area .inner_scroll_contents .inner_list.type_sub_text input:checked + label .sub_text { color: #ffffff; } 

.contents_area .inner_scroll_contents input[type="radio"]:checked + label,
.contents_area .inner_scroll_contents input[type="checkbox"]:checked + label,
.contents_area .inner_scroll_contents .inner_list.type_sub_text input:checked + label .title,
.contents_area .inner_scroll_contents .inner_list.type_sub_text input:checked + label .sub_text { color: #ffffff; } 

.contents_area .inner_scroll_contents label::after { position: absolute; content: ""; width: 20px; height: 20px; border-radius: 50%; display: inline-block; background-color: #e6e6e6; left: 16px; top: 50%; transform: translateY(-50%); border: 5px solid #e6e6e6; box-sizing: border-box; } 

.contents_area .inner_scroll_contents .etc_chk_area input[type="radio"] + label,
.contents_area .inner_scroll_contents .etc_chk_area input[type="checkbox"] + label { height: auto; min-height: 52px; position: relative; } 

.contents_area .inner_scroll_contents .etc_chk_area.type_dis input[type="radio"] + label::after,
.contents_area .inner_scroll_contents .etc_chk_area.type_dis input[type="checkbox"] + label::after { top: 34px; transform: translateY(-50%); } 

.contents_area .inner_scroll_contents input[type="checkbox"] + label::after { border: 0; background-image: url(../image/icon_chk03_g.svg); background-color: transparent; } 

.contents_area .inner_scroll_contents input[type="checkbox"]:checked + label::after { background-image: url(../image/icon_chk02_w.svg); background-repeat: no-repeat; background-position: center; } 

.contents_area .inner_scroll_contents .etc_chk_area input[type="radio"] + label::after,
.contents_area .inner_scroll_contents .etc_chk_area input[type="checkbox"] + label::after { top: 16px; transform: none; } 

.contents_area .inner_scroll_contents input[type="radio"]:checked + label::after,
.contents_area .inner_scroll_contents input[type="checkbox"]:checked + label::after { background-color: transparent; border-color: #ffffff; } 

.contents_area .inner_scroll_contents.type_chk label::after { border: 0; background-image: url(../image/icon_chk03_g.svg); background-color: transparent; } 

.contents_area .inner_scroll_contents.type_chk input:checked + label::after { background-image: url(../image/icon_chk02_w.svg); } 

.contents_area .inner_scroll_contents .etc_chk_area input[type="radio"] + label textarea,
.contents_area .inner_scroll_contents .etc_chk_area input[type="checkbox"] + label textarea { width: calc(100% - 56px); margin-top: 16px; margin-bottom: 16px; height: 0px; transition: height 0.5s; opacity: 0; border: 0; font-weight: normal; font-size: 16px; line-height: 20px; } 


.contents_area .inner_scroll_contents .etc_chk_area input[type="radio"] + label textarea::placeholder,
.contents_area .inner_scroll_contents .etc_chk_area input[type="checkbox"] + label textarea::placeholder { color: #b3b3b3; } 

.contents_area .inner_scroll_contents .etc_chk_area input[type="radio"]:checked + label span,
.contents_area .inner_scroll_contents .etc_chk_area input[type="checkbox"]:checked + label span { display: none; } 

.contents_area .inner_scroll_contents .etc_chk_area input[type="radio"]:checked + label textarea,
.contents_area .inner_scroll_contents .etc_chk_area input[type="checkbox"]:checked + label
textarea { display: inline-block; height: 88px; opacity: 1; } 

.contents_area .inner_scroll_contents .etc_chk_area.type_dis input[type="radio"] + label textarea,
.contents_area .inner_scroll_contents .etc_chk_area.type_dis input[type="checkbox"] + label textarea { margin-bottom: 0; margin-top: 0; } 

.contents_area .inner_scroll_contents .etc_chk_area.type_dis input[type="radio"]:checked + label textarea,
.contents_area .inner_scroll_contents .etc_chk_area.type_dis input[type="checkbox"]:checked + label textarea { margin-bottom: 16px; margin-top: 16px; } 


.contents_area .inner_scroll_contents .etc_chk_area input[type="radio"] + label input[type="text"],
.contents_area .inner_scroll_contents .etc_chk_area input[type="checkbox"] + label input[type="text"] { width: calc(100% - 56px); margin-top: 16px; margin-bottom: 16px; height: 20px; transition: height 0.5s; border: 0; font-weight: normal; font-size: 16px; line-height: 20px; display: none; } 

.contents_area .inner_scroll_contents .etc_chk_area input[type="radio"]:checked + label input[type="text"],
.contents_area .inner_scroll_contents .etc_chk_area input[type="checkbox"]:checked + label input[type="text"] { display: inline-block; display: block; } 

.contents_area .inner_scroll_contents .etc_chk_area input[type="radio"] + label input[type="text"]::placeholder,
.contents_area .inner_scroll_contents .etc_chk_area input[type="checkbox"] + label input[type="text"]::placeholder { color: #b3b3b3; } 

.contents_area .inner_scroll_contents .etc_chk_area input[type="radio"]:checked + label,
.contents_area .inner_scroll_contents .etc_chk_area input[type="checkbox"]:checked + label { background-color: #ffffff; } 

.contents_area .inner_scroll_contents .etc_chk_area input[type="radio"]:checked + label::after { border: 5px solid; background-color: #ffffff; } 

.contents_area .inner_scroll_contents .etc_chk_area input[type="checkbox"]:checked + label::after { background-image: url(../image/icon_chk01_w.svg); } 

.contents_area .inner_scroll_contents.type_chk .etc_chk_area input[type="radio"]:checked + label::after { border: 0; background-image: url(../image/icon_chk01_w.svg); background-repeat: no-repeat; background-position: center; } 

.contents_area .inner_scroll_contents.hi_typeS { height: calc(100% - 374px); padding-bottom: 24px; } 

.contents_area .inner_scroll_contents.hi_typeS.type_filter { height: calc(100% - 410px); } 

.contents_area .inner_scroll_contents .inner_list.type_left_three_line label { padding: 16px 16px 16px 48px; display: flex; flex-wrap: wrap; } 

.contents_area .inner_scroll_contents .inner_list.type_left_three_line label span { width: 100%; display: block; } 

.contents_area .inner_scroll_contents .inner_list.type_left_three_line label span.title { font-weight: 500; font-size: 16px; line-height: 20px; height: 20px; color: #333333; margin-bottom: 2px; display: flex; justify-content: flex-start; align-items: center; white-space: nowrap; } 

.contents_area .inner_scroll_contents .inner_list.type_left_three_line label span.title .label { margin-left: 4px; display: inline-block; padding: 0px 6px; background-color: #ffffff; border: 1px solid; border-radius: 67px; font-weight: 700; font-size: 12px; text-align: center; height: 20px; box-sizing: border-box; margin-top: 0; } 

.contents_area .inner_scroll_contents .inner_list.type_left_three_line label span.title .label span { height: 100%; display: inline-block; line-height: 18px; } 

.contents_area .inner_scroll_contents .inner_list.type_left_three_line label span.sub_text { font-weight: 500; font-size: 13px; line-height: 18px; height: 18px; color: #888888; } 

.contents_area .inner_scroll_contents .inner_list.type_left_three_line label span.date_text { font-weight: 400; font-size: 13px; line-height: 18px; height: 18px; color: #888888; } 

.contents_area .inner_scroll_contents .inner_list.type_left_three_line label::after { left: 16px}

.contents_area .inner_scroll_contents .inner_list.type_left_three_line input:checked + label span { color: #ffffff; } 

.contents_area .inner_scroll_contents .inner_list.type_sub_chk_area .box { border: 1px solid #e6e6e6; background-color: #ffffff; border-radius: 12px; } 

.contents_area .inner_scroll_contents .inner_list.type_sub_chk_area .box.disabled { background-color: #e6e6e6; border: 1px solid #e6e6e6; } 

.contents_area .inner_scroll_contents .inner_list.type_sub_chk_area .box > input[type="checkbox"] + label { border: 0; background-color: transparent; min-height: inherit; height: inherit; line-height: inherit; display: flex; flex-direction: column; justify-content: center; padding: 16px 16px 16px 48px; } 

.contents_area .inner_scroll_contents .inner_list.type_sub_chk_area .box > input[type="checkbox"]:checked + label::after { background-image: url(../image/icon_chk01_w.svg); } 

.contents_area .inner_scroll_contents .inner_list.type_sub_chk_area .box > input[type="checkbox"]:disabled + label span,
.contents_area .inner_scroll_contents .inner_list.type_sub_chk_area .box > input[type="checkbox"]:disabled + label .guide_text { color: #b3b3b3; } 

.contents_area .inner_scroll_contents .inner_list.type_sub_chk_area .box > input[type="checkbox"]:disabled + label::after { background-image: url(../image/icon_chk03_disabled.svg); } 


.contents_area .inner_scroll_contents .inner_list.type_sub_chk_area .sub_chk_area .sub_wrap { display: flex; justify-content: flex-start; flex-wrap: wrap; } 

.contents_area .inner_scroll_contents .inner_list.type_sub_chk_area .box label .sub_text { font-weight: 400; font-size: 13px; line-height: 20px; display: block; margin-top: 2px; } 

.contents_area .inner_scroll_contents .inner_list.type_sub_chk_area .box label .guide_text { display: block; margin-top: 2px; font-weight: 400; font-size: 13px; line-height: 20px; display: none; } 

.contents_area .inner_scroll_contents .inner_list.type_sub_chk_area .sub_chk_area .inner_box { display: inline-block; } 

.contents_area .inner_scroll_contents .inner_list.type_sub_chk_area .box > input[type="checkbox"]:checked + label,
.contents_area .inner_scroll_contents .inner_list.type_sub_chk_area .box > input[type="checkbox"]:checked + label span { color: #888888; } 

.contents_area .inner_scroll_contents .inner_list.type_sub_chk_area .box > input[type="checkbox"]:checked + label .sub_text { display: none; } 

.contents_area .inner_scroll_contents .inner_list.type_sub_chk_area .box > input[type="checkbox"]:checked + label .guide_text { display: block; } 

.contents_area .inner_scroll_contents .inner_list.type_sub_chk_area .box .sub_outer_wrap { height: 0; overflow: hidden; transition: height 0.5s; } 

.contents_area .inner_scroll_contents .inner_list.type_sub_chk_area .box .sub_chk_area .sub_wrap { display: flex; justify-content: flex-start; padding-left: 48px; } 

.contents_area .inner_scroll_contents .inner_list.type_sub_chk_area .box .sub_chk_area .sub_wrap li { margin-right: 8px; height: 32px; min-height: 32px; margin-bottom: 8px; } 

.contents_area .inner_scroll_contents .inner_list.type_sub_chk_area .box .sub_chk_area .sub_wrap li:last-of-type { margin-right: 0; } 

.contents_area .inner_scroll_contents .inner_list.type_sub_chk_area .box .sub_chk_area .sub_wrap input[type="checkbox"] + label { border: 0; height: 32px; line-height: 32px; padding: 0 8px 0 28px; background-color: #f0f0f0; border-radius: 8px; min-height: 32px; } 

.contents_area .inner_scroll_contents .inner_list.type_sub_chk_area .box .sub_chk_area .sub_wrap input[type="checkbox"] + label::after { left: 8px; top: 8px; width: 16px; height: 16px; background-image: url(../image/icon_chk01_w.svg); transform: none; background-repeat: no-repeat; background-position: center; background-size: 16px; } 

.contents_area .inner_scroll_contents .inner_list.type_sub_chk_area .box.on .sub_chk_area { height: auto}


.contents_area .inner_scroll_contents .inner_list.type_sub_chk_area .box .sub_text_area { padding: 0 16px 0 48px; } 

.contents_area .inner_scroll_contents .inner_list.type_sub_chk_area .box.on .sub_text_area { padding: 0 16px 16px 48px; } 

.contents_area .inner_scroll_contents .list_guide_text svg { width: 18px; height: 18px; margin-right: 6px; min-width: 18px; margin-top: 2px; } 

.contents_area .inner_scroll_contents .list_guide_text svg .st0 { fill: none; stroke-width: 2; } 

.contents_area .inner_scroll_contents .list_guide_text svg .st1 { fill: none; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; } 

.contents_area .inner_scroll_contents .list_guide_text { display: flex; margin-top: 40px; justify-content: flex-start; } 

.contents_area .inner_scroll_contents .list_guide_text { font-weight: 700; font-size: 14px; line-height: 20px; } 
.contents_area .inner_scroll_contents .inner_list.type_sub_chk_area .box .sub_text_area .textarea_wrap { height: 80PX; } 
.contents_area .inner_scroll_contents .inner_list.type_sub_chk_area .box .sub_text_area .textarea_wrap label { padding: 8px 20px 8px 16px; height: 100%; background-color: #e6e6e6; } 
.contents_area .inner_scroll_contents .inner_list.type_sub_chk_area .box .sub_text_area .textarea_wrap label::after { display: none; } 
.contents_area .inner_scroll_contents .inner_list.type_sub_chk_area .box .sub_text_area .textarea_wrap .textarea_box { left: 20px; top: 8px; width: calc(100% - 36px); height: calc(100% - 16px); } 
.contents_area .inner_scroll_contents .inner_list.type_sub_chk_area .box .sub_text_area .textarea_wrap .textarea_box:valid { background-color: #e6e6e6; } 
.contents_area .inner_scroll_contents .inner_list.type_sub_chk_area .box .sub_text_area .textarea_wrap .textarea_box:valid + label { background-color: #e6e6e6; } 
.contents_area .inner_scroll_contents .inner_list.type_sub_chk_area .box .sub_text_area .textarea_wrap .textarea_box:focus { background-color: #ffffff; } 
.contents_area .inner_scroll_contents .inner_list.type_sub_chk_area .box .sub_text_area .textarea_wrap .textarea_box:focus + label { background-color: #ffffff; } 

.contents_area .filter_area { display: flex; justify-content: space-between; align-items: center; padding: 0 24px; margin-bottom: 16px; } 

.contents_area .filter_area .all_chk_area label { display: inline-block; padding-left: 28px; font-weight: 400; font-size: 15px; line-height: 20px; position: relative; } 

.contents_area .filter_area .all_chk_area label::after { content: ""; display: inline-block; position: absolute; width: 20px; height: 20px; left: 0; top: 0; background-color: #e6e6e6; border-radius: 50%; background-image: url(../image/icon_chk01_w.svg); background-repeat: no-repeat; background-position: 4px center; } 

.contents_area .filter_area .select_area select { background-color: #f8f8f8; border: 0; padding-right: 20px; font-weight: 400; font-size: 15px; line-height: 20px; background-image: url(../image/icon_select02.svg); background-repeat: no-repeat; background-position: right center; } 

.contents_area .select_date_area { padding: 4px 24px 0; width: 360px; } 

.contents_area .select_date_area ul { display: flex; justify-content: space-between; } 

.contents_area .select_date_area ul li { margin-right: 8px; } 

.contents_area .select_date_area ul li:last-of-type { margin-right: 0; } 

.contents_area .select_date_area label { text-align: center; background-color: #e6e6e6; padding: 5px 8px; border-radius: 8px; display: inline-block; font-weight: bold; font-size: 13px; line-height: 22px; letter-spacing: 0.25px; color: #888888; } 

.contents_area .select_date_area input[type="radio"]:checked + label { color: #ffffff; } 

.contents_area .select_date_area + .date_select_box { margin-top: 24px; } 

.contents_area.full_type .date_select_box { width: 312px; margin-bottom: 24px; margin-left: 24px; } 

.contents_area.full_type .select_date_area + .date_select_box { width: 312px; margin-top: 24px; margin-left: 24px; } 

.contents_area.full_type .select_date_area + .date_select_box.type_line { margin: 24px; width: 312px; } 

.contents_area.full_type .document_area .select_date_area + .date_select_box { width: 100%; } 

.contents_area .info_box_list { margin-top: 24px; } 

.contents_area .info_box_list > ul > li { width: 100%; padding: 16px 24px 32px; background-color: #ffffff; border-radius: 24px; position: relative; margin-bottom: 16px; border: 1px solid #f0f0f0; } 

.contents_area .info_box_list > ul > li:last-of-type { margin-bottom: 0; } 

.contents_area .info_box_list li .delete { position: absolute; top: 16px; right: 16px; text-indent: -999999px; width: 16px; height: 16px; display: inline-block; background-image: url(../image/icon_delete.svg); background-repeat: no-repeat; background-position: center center; background-color: #ffffff; } 

.contents_area .info_box_list li .date { display: block; font-weight: normal; font-size: 14px; line-height: 18px; } 

.contents_area .info_box_list li .title { display: flex; align-items: center; margin-top: 12px; font-weight: bold; font-size: 18px; line-height: 23px; } 

.contents_area .info_box_list li .title em { display: inline-block; height: 20px; line-height: 20px; font-weight: bold; font-size: 12px; color: #ffffff; padding: 0 6px; border-radius: 67px; margin-left: 4px; } 

.contents_area .info_box_list li .name { display: block; margin-top: 4px; font-weight: normal; font-size: 14px; line-height: 18px; } 

.contents_area .info_box_list li .price_area { margin-top: 16px; display: flex; justify-content: flex-end; padding-bottom: 12px; border-bottom: 1px solid #e6e6e6; } 

.contents_area .info_box_list li .price_area span { font-weight: bold; font-size: 16px; line-height: 20px; } 

.contents_area .info_box_list li .price_area .btn { width: auto; height: 18px; font-size: 14px; font-weight: normal; line-height: 18px; text-decoration: underline; } 

.contents_area .info_box_list .inner_list { margin-top: 16px; } 

.contents_area .info_box_list .inner_list li { display: flex; margin-bottom: 12px; justify-content: space-between; } 

.contents_area .info_box_list .inner_list li:last-of-type { margin-bottom: 0; } 

.contents_area .info_box_list .inner_list li span { font-weight: normal; font-size: 14px; line-height: 18px; } 

.contents_area .info_box_list .inner_list li strong { font-weight: bold; font-size: 14px; line-height: 18px; } 

.contents_area .info_box_list .inner_list li .view_area { cursor: pointer; } 

.contents_area .info_box_list .inner_list li .view_area em { color: #b3b3b3; } 

.contents_area .info_box_list .inner_list li .view_area.on em { display: none; } 

.contents_area .info_box_list .inner_list li .view_area i { display: inline-block; width: 12px; height: 12px; background-image: url(../image/icon_arrow_black01.svg); background-repeat: no-repeat; background-position: center center; transition: transform 0.5s; } 

.contents_area .info_box_list .inner_list li .view_area.on i { transform: rotate(180deg); } 

.contents_area .info_box_list .inner_list li .hidden_area { overflow: hidden; height: 0; cursor: pointer; transition: height 0.5s; } 

.contents_area .info_box_list .inner_list li .hidden_area .hidden_wrap strong { display: block; text-align: right; padding-right: 20px; padding-top: 4px; } 

.contents_area .calc_price_area { margin-top: 40px; } 

.contents_area .calc_price_area .top_area li { margin-bottom: 16px; display: flex; justify-content: space-between; } 

.contents_area .calc_price_area .top_area li span { font-weight: normal; font-size: 14px; line-height: 18px; } 

.contents_area .calc_price_area .top_area li strong { font-weight: bold; font-size: 14px; line-height: 18px; } 

.contents_area .calc_price_area .top_area li:last-of-type { margin-bottom: 0; } 

.contents_area .calc_price_area .top_area { padding-bottom: 24px; border-bottom: 1px solid #e6e6e6; } 

.contents_area .contents_box.calc_price_area { margin-top: 0; } 

.contents_area.full_type .contents_title { padding: 42px 24px 0; } 

.contents_area.full_type .info_box_list { padding: 0 24px; } 

.contents_area .phone_input_area { border-top: 8px solid #e6e6e6; padding: 40px 24px; } 

.contents_area .phone_input_area .title { font-weight: bold; font-size: 18px; line-height: 22px; } 

.contents_area .phone_input_area .input_box { margin-top: 24px; } 


.tooltip i { display: inline-block; width: 16px; height: 16px; background-image: url(../image/icon_tooltip.svg); background-repeat: no-repeat; background-position: center center; margin-left: 4px; cursor: pointer; } 

.tooltip span { position: absolute; width: 288px; background-color: #ffffff; padding: 12px 48px 12px 16px; border-radius: 8px; filter: drop-shadow(0px 0px 2px rgba(0, 0, 0, 0.2)); left: 24px; top: 20px; z-index: 50; font-weight: normal; font-size: 13px; line-height: 150%; color: #888888; display: none; } 

.tooltip.on span { display: inline-block; } 

.tooltip .exit { display: inline-block; width: 16px; height: 16px; text-indent: -99999px; position: absolute; top: 12px; right: 12px; background-image: url(../image/icon_delete.svg); background-repeat: no-repeat; background-position: center center; } 

.contents_area .calc_price_area .top_area li > span,
.contents_area .calc_price_area .bot_area li > span { display: flex; align-items: center; } 

.contents_area .calc_price_area .bot_area { margin-top: 32px; } 

.contents_area .calc_price_area .bot_area li { display: flex; justify-content: space-between; margin-bottom: 16px; } 

.contents_area .calc_price_area .bot_area li:last-of-type { margin-bottom: 0; } 

.contents_area .calc_price_area .bot_area li span,
.contents_area .calc_price_area .bot_area li strong { font-weight: normal; font-size: 16px; line-height: 20px; } 

.contents_area .calc_price_area .total_price_area { margin-top: 40px; display: flex; justify-content: space-between; } 

.contents_area .calc_price_area .total_price_area strong { font-weight: bold; font-size: 20px; line-height: 25px; } 

.contents_area .calc_price_area + .bot_btn_area { margin-top: 40px; } 

.contents_area.full_type .contents_box { padding: 40px 24px 40px; border-bottom: 8px solid #e6e6e6; } 

.contents_area.full_type .contents_box:first-of-type { padding-top: 24px; } 

.contents_area.full_type .contents_box:last-of-type { border-bottom: 0; padding-bottom: 24px; } 

.contents_area.full_type .contents_box.bd_top{ border-bottom: 0; border-top: 8px solid #e6e6e6; }

.contents_area.full_type .contents_box .insert_phone_area + .bot_btn_area { margin-top: 40px; } 

.contents_area .contents_box .pay_list > li { background-color: #ffffff; margin-bottom: 16px; border-radius: 24px; padding: 16px 24px; border: 1px solid #f0f0f0; position: relative; } 

.contents_area .contents_box .pay_list li .date { font-weight: normal; font-size: 14px; line-height: 18px; display: block; } 

.contents_area .contents_box .pay_list li .title { display: flex; align-items: center; margin-top: 12px; font-weight: bold; font-size: 18px; line-height: 23px; } 

.contents_area .contents_box .pay_list li .title em { display: inline-block; height: 20px; line-height: 20px; font-weight: bold; font-size: 12px; color: #ffffff; padding: 0 6px; border-radius: 67px; margin-left: 4px; } 

.contents_area .contents_box .pay_list li .name { display: block; margin-top: 4px; font-weight: normal; font-size: 14px; line-height: 18px; } 

.contents_area .contents_box .pay_list li .price { display: block; margin-top: 16px; font-weight: bold; font-size: 16px; line-height: 20px; text-align: right; } 

.contents_area .contents_box .pay_list li:last-of-type { margin-bottom: 0; } 

.contents_area .contents_box .pay_list .detail_btn { width: 76px; height: 28px; line-height: 28px; font-weight: 400; font-size: 12px; color: #888888; position: absolute; top: 12px; right: 16px; } 

.contents_area .contents_box .pay_list .detail_btn i { display: inline-block; width: 10px; height: 10px; background-image: url(../image/icon_arrow_gray01.svg); background-repeat: no-repeat; background-size: 10px; background-position: center center; margin-left: 2px; transition: transform 0.3s; } 

.contents_area .contents_box .pay_list .detail_btn.active i { transform: rotate(180deg); } 

.contents_area .contents_box .pay_list .detail_area { height: 0; overflow: hidden; transition: height 0.5s; } 

.contents_area .contents_box .pay_list .detail_area ul { margin-top: 12px; border-top: 1px solid #e6e6e6; padding-top: 16px; } 

.contents_area .contents_box .pay_list .detail_area ul li + li { margin-top: 12px; } 

.contents_area .contents_box .pay_list .detail_area ul li { display: flex; justify-content: space-between; align-items: center; } 

.contents_area .contents_box .pay_list .detail_area ul li span { font-weight: 400; font-size: 14px; line-height: 20px; } 

.contents_area .contents_box .pay_list .detail_area ul li strong { font-weight: 700; font-size: 14px; line-height: 20px; } 

.contents_area .contents_box .pay_list .detail_area ul li:last-of-type { margin-top: 20px; border-top: 1px dashed #e6e6e6; padding-top: 16px; flex-wrap: wrap; } 

.contents_area .contents_box .pay_list .detail_area ul li:last-of-type span,
.contents_area .contents_box .pay_list .detail_area ul li:last-of-type strong { width: 100%; } 

.contents_area .contents_box .pay_list .detail_area ul li:last-of-type strong { margin-top: 6px; } 

.contents_area .contents_box .contents_box_title { display: block; font-weight: bold; font-size: 18px; line-height: 23px; } 

.contents_area .contents_box .pay_method_list { margin-top: 16px; } 

.contents_area .contents_box .pay_method_list li { margin-bottom: 8px; } 

.contents_area .contents_box .pay_method_list li:last-of-type { margin-bottom: 0px; } 

.contents_area .contents_box .pay_method_list li label { display: inline-block; width: 100%; padding: 19px 24px; font-weight: bold; font-size: 14px; line-height: 18px; border-radius: 6px; background-image: url(../image/icon_chk02_g.svg); background-repeat: no-repeat; background-position: calc(100% - 24px) 18px; transition: all 0.5s; } 

.contents_area .contents_box .pay_method_list li input[type="radio"]:checked + label { background-image: url(../image/icon_chk02_w.svg); padding-bottom: 42px; } 

.contents_area .contents_box .pay_method_list li.kakao label { background-color: #f7e900; color: #333333; } 

.contents_area .contents_box .pay_method_list li.naver label { background-color: #1ec800; color: #ffffff; } 

.contents_area .contents_box .pay_method_list li.phone label { background-color: #b3b3b3; color: #ffffff; } 

.contents_area .contents_box .pay_method_list li.transfer label { background-color: #888888; color: #ffffff; } 

/* 결제수단 선택 변경 - 20220308 */
.contents_area .contents_box .pay_method_list.swiper-wrapper { height: 168px; } 

.contents_area .contents_box .pay_method_list.swiper-wrapper li.swiper-slide { height: 100%; opacity: 0.3; transition: all 0.5s; } 

.contents_area .contents_box .pay_method_list.swiper-wrapper li.swiper-slide-active { opacity: 1; max-width: 312px; } 

.contents_area .contents_box .pay_method_list.swiper-wrapper li.swiper-slide label { height: 100%; } 

.contents_area .contents_box .card-swiper + .swiper-pagination { width: 100%; margin-top: 24px; position: relative; } 

.contents_area .contents_box .card-swiper + .swiper-pagination .swiper-pagination-bullet { background-color: #b3b3b3; margin-right: 8px; opacity: 1; } 

.contents_area .contents_box .card-swiper + .swiper-pagination .swiper-pagination-bullet:last-of-type { margin-right: 0; } 

.contents_area .contents_box .card-swiper + .swiper-pagination .swiper-pagination-bullet-active { background-color: #333333; } 


.contents_area .contents_box .insert_phone_area .input_box { margin-top: 24px; } 

.contents_area .contents_box .btn { display: flex; align-items: center; justify-content: center; } 

.contents_area .contents_box .btn span { margin-left: 8px; display: inline-block; background-color: #ffffff; width: 20px; height: 20px; line-height: 20px; border-radius: 50%; font-size: 15; font-weight: bold; } 

.contents_area .contents_box .pay_chk_text { text-align: center; font-weight: bold; font-size: 14px; line-height: 22px; margin-bottom: 12px; } 

.contents_area .complete_area { padding-top: 104px; text-align: center; } 

.contents_area .complete_area.img_type { padding-top: 68px; } 

.contents_area .complete_area i { display: block; width: 48px; height: 48px; margin: 0 auto; border-radius: 50%; background-image: url(../image/icon_chk01_w.svg); background-repeat: no-repeat; background-position: center calc(50% + 2px); background-size: 21px; } 

.contents_area .complete_area strong { display: block; margin-top: 16px; font-weight: bold; font-size: 28px; line-height: 35px; } 

.contents_area .complete_area p { margin-top: 0px; font-weight: normal; font-size: 16px; line-height: 22px; color: #888888; } 

.contents_area .complete_area p strong { font-weight: 700; font-size: 16px; line-height: 22px; display: inline-block; margin-top: 0; } 

.contents_area .complete_area p em.type_bold { font-weight: bold; } 

.contents_area .pay_complete_img { margin-top: 28px; } 

.contents_area .pay_complete_img img { height: 216px; display: block; margin: 0 auto; } 


/* 세션만료 - 20221118 */
.contents_area.session_expiration_view { padding-top: 92px; } 
.contents_area.session_expiration_view .contents_title_area .top_text { font-weight: 400; font-size: 14px; line-height: 19px; color: #888888; } 
.contents_area.session_expiration_view .contents_title_area .main_title { margin-top: 8px; font-weight: 700; font-size: 20px; line-height: 26px; } 
.contents_area.session_expiration_view .search_contents_area { padding-top: 24px; } 
.contents_area.session_expiration_view .search_none_data_area { margin-top: 40px; display: flex; flex-direction: column; align-items: center; } 
.contents_area.session_expiration_view .search_none_data_area i { display: inline-block; width: 20px; height: 20px; background-image: url(../image/icon_info_n.svg); background-repeat: no-repeat; background-position: center; background-size: contain; } 
.contents_area.session_expiration_view .search_none_data_area .main_title { margin-top: 8px; font-weight: 700; font-size: 16px; line-height: 20px; color: #333333; text-align: center; } 
.contents_area.session_expiration_view .search_none_data_area .sub_title { margin-top: 8px; font-weight: 500; font-size: 12px; line-height: 20px; color: #888888; } 
.contents_area.session_expiration_view .search_result_view_area { margin-top: 16px; } 
.contents_area.session_expiration_view .search_result_view_area li + li { margin-top: 8px; } 
.contents_area.session_expiration_view .search_result_view_area .link { text-align: left; background-color: #ffffff; border: 1px solid #e6e6e6; border-radius: 12px; width: 100%; padding: 20px; display: flex; flex-direction: column; } 
.contents_area.session_expiration_view .search_result_view_area .link .title_area { display: flex; justify-content: flex-start; align-items: center; } 
.contents_area.session_expiration_view .search_result_view_area .link .title_area .title { font-weight: 500; font-size: 16px; line-height: 20px; } 
.contents_area.session_expiration_view .search_result_view_area .link .title_area .label { margin-left: 4px; display: inline-block; background-color: #ffffff; border: 1px solid; border-radius: 32px; padding: 0 6px; height: 20px; line-height: 18px; font-weight: 700; font-size: 12px; } 
.contents_area.session_expiration_view .search_result_view_area .link .address { margin-top: 2px; font-weight: 400; font-synthesis: 12px; line-height: 18px; color: #888888; } 

/* 보험사 선택 */
.contents_area .insurance_list { margin-top: 42px; } 
.contents_area .insurance_list .list_title { font-weight: 500; font-size: 14px; line-height: 18px; color: #888888; } 
.contents_area .insurance_list + .insurance_list { margin-top: 64px; } 
.contents_area .insurance_list .list_title + ul { margin-top: 16px; } 
.contents_area .insurance_list > ul { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 12px; } 
.contents_area .insurance_list > ul > li { height: 96px; position: relative; } 
.contents_area .insurance_list > ul > li .contents_box { width: 100%; height: 100%; background-color: #ffffff; border-radius: 8px; text-align: center; position: absolute; left: 0; right: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; border: 1px solid #e6e6e6; } 
.contents_area .insurance_list > ul > li input[type="radio"] { display: none; } 
.contents_area .insurance_list > ul > li input[type="radio"] + label { display: inline-block; position: absolute; width: 100%; height: 100%; z-index: 1; } 
.contents_area .insurance_list > ul > li .img_box { width: 32px; } 
.contents_area .insurance_list > ul > li .box_text { margin-top: 11px; font-weight: 500; font-size: 13px; line-height: 20px; color: #1c1d1f; } 

@media (max-height: 600px){
.contents_area .pay_complete_img { display: none; } 
}

/* 카드결제 추가 - 20220203 */
.contents_box .card_type_area { margin-top: 24px; } 

.contents_box .card_type_area ul { display: flex; justify-content: flex-start; } 

.contents_box .card_type_area ul li { margin-right: 24px; } 

.contents_box .card_type_area ul li:last-of-type { margin-right: 0px; } 

.contents_box .card_type_area label { font-weight: normal; font-size: 16px; line-height: 20px; padding-left: 28px; position: relative; display: inline-block; } 

.contents_box .card_type_area label i { display: inline-block; width: 20px; height: 20px; position: absolute; left: 0; top: 50%; transform: translateY(-50%); background-color: #e6e6e6; border-radius: 50%; background-image: url(../image/icon_chkbox_w.svg); background-repeat: no-repeat; background-position: center center; } 

.contents_box .card_info_list { margin-top: 16px; } 

.contents_box .card_info_list li { margin-bottom: 12px; } 

.contents_box .card_info_list li:last-of-type { margin-bottom: 0px; } 

/* 카드결제 추가 - 20220207 */
.contents_box .contents_box_title.swap_btn_type { display: flex; justify-content: space-between; align-items: center; margin-bottom: 24px; } 

.contents_box .contents_box_title.swap_btn_type .swap_btn_area .btn { font-weight: bold; font-size: 16px; line-height: 20px; text-decoration: underline; color: #888888; height: auto; } 

.contents_box .contents_box_title.swap_btn_type .swap_btn_area.swap .btn { display: none; } 

.contents_box .card_info_area .input_list_area { height: 0; } 

.contents_box .card_info_area .select_area { height: 56px; margin-top: 24px; } 

.contents_box .card_info_area.swap .select_area { margin-top: 0px; margin-bottom: 24px; } 

.contents_box .card_info_area.swap .input_list_area { height: 420px}

.contents_box .card_info_area > li { overflow: hidden; transition: all 0.5s; } 

.contents_box .card_info_area > li.input_list_area { margin-top: 0px; } 

.contents_box .card_info_area > li.input_list_area .card_type_area { margin-top: 0; } 

.contents_box .card_info_area .select_area select { width: 100%; height: 56px; padding: 16px 44px 16px 24px; background-color: #ffffff; border: 1px solid #888888; box-sizing: border-box; border-radius: 12px; background-image: url(../image/icon_input_select.svg); background-repeat: no-repeat; background-position: calc(100% - 16px) center; font-weight: normal; font-size: 15px; letter-spacing: 0.75px; } 




.contents_area .tab_fixed_area { position: fixed; top: 60px; width: 100%; background-color: #ffffff; height: 60px; z-index: 10; transition: top 0.5s; } 

.contents_area .tab_fixed_area ul { display: flex; justify-content: space-between; } 

.contents_area .tab_fixed_area ul li { flex-basis: 100%; text-align: center; } 

.contents_area .tab_fixed_area ul li .tab { width: 100%; height: 60px; line-height: 60px; font-weight: 500; font-size: 16px; color: #888888; box-sizing: border-box; border-bottom: 2px solid #e6e6e6; } 

.contents_area .tab_fixed_area ul li .tab.active { border-bottom: 2px solid #333333; color: #333333; } 

.contents_area .top_info_list { padding: 20px 24px; background-color: #ffffff; margin-top: 60px; } 

.contents_area .top_info_list strong { display: inline-block; font-weight: bold; font-size: 14px; line-height: 18px; } 

.contents_area .top_info_list strong svg { width: 18px; height: 18px; vertical-align: middle; margin-right: 6px; } 

.contents_area .top_info_list strong svg .st0 { fill: none; stroke-width: 2; } 

.contents_area .top_info_list strong svg .st1 { fill: none; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; } 

.contents_area .top_info_list ul { margin-top: 8px; } 

.contents_area .top_info_list ul li { font-weight: 500; font-size: 14px; line-height: 18px; color: #888888; margin-bottom: 4px; list-style: inside; padding-left: 6px; } 

.contents_area .top_info_list ul li:last-of-type { margin-bottom: 0; } 

.contents_area .top_info_list + .ad_area { width: 100%; } 

.contents_area .top_info_list + .ad_area img { width: 100%; image-rendering: -webkit-optimize-contrast; transform: translateZ(0); backface-visibility: hidden; } 

.contents_area .document_area { padding: 28px 24px 40px; } 

.contents_area .document_area.float_btn_type { padding-bottom: 112px; } 

.contents_area .document_area .select_date_area { padding: 0; width: 312px; } 

.contents_area.full_type .document_area .date_select_box.type_line { padding: 0; left: 0; margin-left: 0; } 

.contents_area .document_area .date_select_box.type_line.small_img_type .date_view_area { width: calc(100% - 68px); left: 0; } 

.contents_area .document_list { margin-top: 24px; } 

.contents_area .mypage_list_ad_area { margin: 32px auto; text-align: center; max-width: 360px; height: auto; overflow: hidden; } 
.contents_area .mypage_list_ad_area .swiper-wrapper { height: auto; } 
.contents_area .mypage_list_ad_area a { display: inline-block; } 

.contents_area .document_list li { width: 100%; padding: 16px 24px; background-color: #ffffff; border-radius: 24px; margin-bottom: 16px; border: 1px solid #f0f0f0; position: relative; } 

.contents_area .document_list li:last-of-type { margin-bottom: 0; } 

.contents_area .document_list li .top_data_area { display: flex; justify-content: space-between; } 

.contents_area .document_list li .top_data_area .date { font-weight: normal; font-size: 14px; line-height: 20px; } 

.contents_area .document_list li .top_data_area .state { font-weight: normal; font-size: 14px; line-height: 18px; color: #888888; } 

.contents_area .document_list li .title { display: block; margin-top: 12px; font-weight: bold; font-size: 18px; line-height: 23px; } 

.contents_area .document_list li .name { margin-top: 4px; font-weight: bold; font-size: 18px; line-height: 25px; display: flex; justify-content: flex-start; align-items: center; } 

.contents_area .document_list li .name .label { border-radius: 67px; padding: 0 6px; height: 20px; line-height: 20px; font-weight: bold; font-size: 12px; color: #ffffff; display: inline-block; margin-left: 4px; } 

.contents_area .document_list li .doc_type { width: 100%; display: inline-block; font-weight: normal; font-size: 14px; line-height: 20px; } 

.contents_area .document_list li .bot_area { margin-top: 8px; display: flex; justify-content: space-between; } 

.contents_area .document_list li .bot_area .text_area span { display: block; font-weight: 500; font-size: 12px; line-height: 18px; color: #888888; } 

.contents_area .document_list li .bot_area .btn_gray { display: inline-block; height: 32px; padding: 5px 8px; background-color: #f0f0f0; border-radius: 8px; font-weight: bold; font-size: 13px; color: #888888; letter-spacing: 0.25; box-sizing: border-box; } 

.contents_area .document_list li .bot_area .validity { font-weight: bold; font-size: 14px; line-height: 18px; } 

.contents_area .document_list li .bot_area .text_area .guide_text { font-weight: bold; font-size: 12px; line-height: 15px; display: block; margin-top: 8px; } 

.contents_area .document_list li .bot_area .text_area .end_date_view { font-weight: bold; font-size: 12px; line-height: 15px; display: block; margin-top: 8px; } 


.contents_area .document_list .state_cancel { background-color: #f0f0f0; } 

.contents_area .document_list .state_cancel .top_data_area .date,
.contents_area .document_list .state_cancel .name,
.contents_area .document_list .state_cancel .doc_type { color: #888888; } 

.contents_area .document_list .state_cancel .bot_area .text_area span { color: #b3b3b3; } 

.contents_area .document_list .state_cancel .top_data_area .state { text-decoration: line-through; } 

.contents_area .document_list .state_cancel .name .label { background-color: #888888; } 

.contents_area .document_list .state_reject .top_data_area .state { color: #fd2c2c; } 

.contents_area .document_list li .bot_area .two_way_btn_area { position: absolute; right: 20px; bottom: 40px; } 

.contents_area .document_list li .bot_area .btn_down,
.contents_area .document_list li .bot_area .btn_mail { border-radius: 8px; height: 32px; line-height: 32px; padding: 0 12px; text-align: center; font-weight: bold; font-size: 13px; letter-spacing: 0.25px; display: block; } 

.contents_area .document_list li .bot_area .btn_down { color: #ffffff; margin-bottom: 8px; } 

.contents_area .document_list li .bot_area .btn_mail { background-color: #e6e6e6; color: #333333; } 

.contents_area .none_doc_view { padding-top: 24px; text-align: center; } 

.contents_area .none_doc_view i { display: inline-block; width: 32px; height: 32px; background-image: url(../image/icon_doc01.svg); background-repeat: no-repeat; } 

.contents_area .none_doc_view .guide_text { margin-top: 12px; font-weight: 500; font-size: 16px; color: #888888; } 


.contents_area .guide_title { margin-top: 30px; text-align: center; font-weight: bold; font-size: 20px; line-height: 26px; } 

.contents_area .guid_list_area { margin-top: 32px; } 

.contents_area .guid_list_area .box { background-color: #ffffff; box-shadow: 0px 0px 8px rgba(0,0,0,0.04); border-radius: 16px; padding: 24px 16px 0px 16px; } 

.contents_area .guid_list_area .box { padding: 24px 24px 0; text-align: left; min-height: 340px; position: relative; margin-bottom: 24px; } 

.contents_area .guid_list_area .box:last-child { margin-bottom: 0; } 

.contents_area .guid_list_area .box .img_area { width: 100%; height: 192px; position: absolute; left: 50%; transform: translateX(-50%); bottom: 0; } 

.contents_area .guid_list_area .box .img_area img { display: block; margin: 0 auto; width: auto; height: 100%; } 

.contents_area .guid_list_area .box .text_area .num { display: block; font-weight: bold; font-size: 18px; line-height: 25px; color: #000000; } 

.contents_area .guid_list_area .box .text_area .title { display: block; font-weight: bold; font-size: 18px; line-height: 26px; } 

.contents_area .guid_list_area .box .text_area .state { font-weight: bold; font-size: 16px; line-height: 25px; color: #888888; } 

.contents_area .guid_list_area .box .text_area p { margin-top: 4px; font-weight: normal; font-size: 14px; line-height: 20px; } 

.contents_area .guid_list_area .box .text_area p strong { font-weight: bold; } 

.contents_area .drop_down_list { margin-top: 28px; } 

.contents_area .drop_down_list .tab_click_area { cursor: pointer; padding: 20px; } 

.contents_area .drop_down_list .box { background-color: #ffffff; border-radius: 16px; margin-bottom: 16px; border: 1px solid #f0f0f0; box-sizing: border-box; } 

.contents_area .drop_down_list .date { display: block; font-weight: normal; font-size: 14px; line-height: 18px; margin-bottom: 12px; } 

.contents_area .drop_down_list .top_area { display: flex; justify-content: space-between; } 

.contents_area .drop_down_list .top_area .title_area { font-weight: bold; font-size: 15px; line-height: 20px; width: calc(100% - 32px); } 

.contents_area .drop_down_list .top_area.hidden_type .title_area { white-space: nowrap; text-overflow: ellipsis; overflow: hidden; } 

.contents_area .drop_down_list .top_area .title_area .title_point { display: inline-block; margin-right: 4px; } 

.contents_area .drop_down_list .top_area .title_area .title_point.wait { color: #b2b2b2; } 

.contents_area .drop_down_list .top_area .drop_arrow { display: inline-block; width: 16px; height: 16px; background-image: url(../image/icon_drop_arrow.svg); background-repeat: no-repeat; background-position: center center; flex-basis: 16px; min-height: 16px; transform: rotate(180deg); transition: all 0.5s; } 

.contents_area .drop_down_list .top_area.on .drop_arrow { transform: rotate(0deg); } 

.contents_area .drop_down_list .top_area .drop_arrow .st0 { fill: none; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; } 

.contents_area .drop_down_list .bot_area { height: 0; overflow: hidden; transition: all 0.5s; } 

.contents_area .drop_down_list .bot_area .bot_text_wrap { padding: 0 20px 20px; } 

.contents_area .drop_down_list .bot_area .inner_top_text { font-weight: normal; font-size: 14px; line-height: 20px; color: #888888; } 

.contents_area .drop_down_list .bot_area .inner_bot_text { margin-top: 16px; padding-top: 16px; border-top: 1px solid #e6e6e6; font-weight: normal; font-size: 14px; line-height: 20px; } 

.contents_area .drop_down_list .bot_area .inner_bot_text .date { font-weight: normal; font-size: 14px; line-height: 18px; display: block; margin-bottom: 12px; } 

.contents_area .tab_title_area { height: 64px; display: flex; justify-content: space-between; } 

.contents_area .tab_title_area li { width: 50%; text-align: center; height: 100%; line-height: 64px; background-color: #ffffff; font-weight: bold; font-size: 16px; border-bottom: 2px solid #e6e6e6; cursor: pointer; } 

.contents_area .tab_title_area li.on { border-bottom: 2px solid #333333; } 

.contents_area .tab_contents_area { position: relative; } 

.contents_area .tab_contents_area .contents { position: relative; padding: 32px 24px 24px; left: 0; top: 0; width: 100%; height: auto; display: none; } 

.contents_area .tab_contents_area .contents.on { display: block; } 

.contents_area .tab_contents_area .contents .none_data_text_area { padding-top: 100px; } 

.contents_area .tab_contents_area .contents .none_data_text_area i { display: block; width: 24px; height: 24px; background-image: url(../image/icon_none_data.svg); background-repeat: no-repeat; background-position: center center; margin: 0 auto; } 

.contents_area .tab_contents_area .contents .none_data_text_area p { margin-top: 12px; font-weight: bold; font-size: 18px; line-height: 25px; color: #b3b3b3; text-align: center; } 

.contents_area .tab_contents_area .input_contents_list li { margin-bottom: 16px; } 

.contents_area .tab_contents_area .input_contents_list li:last-of-type { margin-bottom: 40px; } 

.contents_area .child_add_contents { padding: 0 24px 46px; } 

.contents_area .child_add_contents .title { font-weight: bold; font-size: 18px; line-height: 25px; } 

.contents_area .child_add_contents .sub_text { font-weight: normal; font-size: 13px; line-height: 20px; color: #888888; } 

.contents_area .child_add_contents .input_file_area { margin-top: 4px; width: 100%; height: 56px; position: relative; border-radius: 12px; overflow: hidden; } 

.contents_area .child_add_contents .input_file_area input[type="file"] { position: absolute; width: 100%; height: 100%; display: block; z-index: 1; opacity: 0; left: 0; top: 0; } 

.contents_area .child_add_contents .input_file_area .file_name { display: block; position: absolute; left: 0; top: 0; width: 100%; height: 100%; background-color: #e6e6e6; border-radius: 12px; line-height: 56px; padding-left: 16px; font-weight: normal; font-size: 15px; color: #888888; } 

.contents_area .child_add_contents .input_file_area .fake_btn { display: inline-block; width: 76px; line-height: 40px; height: 40px; position: absolute; right: 8px; text-align: center; top: 50%; transform: translateY(-50%); border-radius: 7px; color: #ffffff; font-weight: normal; font-size: 15px; } 

.contents_area .child_add_contents .guide_text { font-weight: bold; font-size: 13px; line-height: 20px; } 

.contents_area .child_add_contents .input_chk_area { margin-top: 12px; } 

.contents_area .child_add_contents .input_chk_area li { display: inline-block; margin-right: 40px; } 

.contents_area .child_add_contents .input_chk_area li:last-of-type { margin-right: 0; } 

.contents_area .child_add_contents .input_chk_area label { display: inline-block; padding-left: 28px; position: relative; font-weight: normal; font-size: 14px; line-height: 20px; color: #000000; } 

.contents_area .child_add_contents .input_chk_area label::before { content: ""; display: inline-block; width: 20px; height: 20px; border-radius: 50%; background-color: #e6e6e6; position: absolute; left: 0; top: 50%; transform: translateY(-50%); border: 5px solid #e6e6e6; box-sizing: border-box; } 

.contents_area .child_add_contents .input_chk_area input:checked + label::before { background-color: #ffffff; } 

.child_input_list > li { margin-bottom: 24px; } 

.child_input_list.text_type > li { margin-bottom: 16px; } 

.child_input_list > li:last-of-type { margin-bottom: 0; } 

.contents_area .tab_contents_area .contents .drop_down_list { margin-top: 0; } 

/* 이용약관 */
.contents_area .terms_contents_box { padding-bottom: 104px; } 

.contents_area .terms_area { padding-top: 36px; } 

.contents_area .terms_area + .terms_area { padding-top: 40px; } 

.contents_area .terms_area .terms_title { font-weight: bold; font-size: 18px; line-height: 23px; } 

.contents_area .terms_area .terms_text_box { margin-top: 8px; background-color: #ffffff; box-sizing: border-box; border: 1px solid #f0f0f0; box-sizing: border-box; border-radius: 16px; padding: 10px 8px 10px 24px; max-height: 196px; } 

.contents_area .terms_area .terms_text_box pre { max-height: 160px; overflow: auto; padding-right: 12px; white-space: pre-line; } 
.contents_area .terms_area .terms_text_box table { font-weight: 300; font-size: 12px; } 

.contents_area .terms_area .terms_text_box table td { border: 1px solid #cccccc; text-align: center; } 

.contents_area .terms_area .terms_chk_area { margin-top: 8px; padding: 0 8px; display: flex; justify-content: space-between; align-items: center; } 

.contents_area .terms_area .terms_chk_area .terms_guide_text { width: calc(100% - 65px); font-weight: normal; font-size: 13px; line-height: 21px; word-break: keep-all; } 

.contents_area .terms_area .terms_chk_area label { display: inline-block; padding-left: 28px; position: relative; font-weight: normal; font-size: 14px; line-height: 20px; color: #000000; white-space: nowrap; } 

.contents_area .terms_area .terms_chk_area label::before { content: ""; display: inline-block; width: 20px; height: 20px; border-radius: 50%; background-color: #e6e6e6; position: absolute; left: 0; top: 50%; transform: translateY(-50%); background-image: url(../image/icon_chk01_w.svg); background-repeat: no-repeat; background-position: 5px 6px; background-size: 10px; } 

.terms_wrap { position: fixed; bottom: -100%; left: 0; z-index: 50; width: 100%; height: 100%; transition: all 0.5s; z-index: 50; } 

.terms_wrap.on { bottom: 0; } 

.terms_wrap .terms_popup { background-color: #f8f8f8; width: 100%; height: 100%; display: none; } 

.terms_wrap .terms_popup.on { display: block; } 

.terms_wrap .terms_popup .terms_popup_header { position: absolute; top: 0; left: 0; width: 100%; height: 60px; z-index: 60; background-color: #F8F8F8; } 

.terms_wrap .terms_popup .terms_popup_header .title { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); font-weight: normal; font-size: 16px; line-height: 20px; } 

.terms_wrap .terms_popup .terms_popup_header .terms_exit { display: inline-block; width: 32px; height: 32px; right: 24px; top: 50%; transform: translateY(-50%); position: absolute; text-indent: -99999px; background-image: url(../image/icon_exit.svg); background-repeat: no-repeat; background-position: center center; background-size: 24px; } 

.terms_wrap .terms_popup .terms_popup_text { height: calc(100% - 60px); font-size: 14px; font-weight: 300; line-height: 22px; margin-top: 60px; padding: 40px 24px 16px; overflow: auto; } 
.terms_wrap .terms_popup .terms_popup_text .title { font-weight: bold; font-size: 20px; line-height: 26px; } 
.terms_wrap .terms_popup .terms_popup_text .pop_detail{ margin-top: 32px; }
.terms_wrap .terms_popup .terms_popup_text .pop_detail .term_tith3 { margin-bottom: 10px; font-weight: 700; font-size: 16px; line-height: 22px; color: #333; }
.terms_wrap .terms_popup .terms_popup_text .pop_detail strong { display: block; margin-top: 20px; margin-bottom: 12px; font-weight: 500; font-size: 16px; line-height: 22px; }

/* 알뜰폰 */
.contents_area .phone_guide_text { margin-top: 40px; } 

.contents_area .phone_guide_text strong { font-weight: bold; font-size: 16px; line-height: 150%; display: flex; align-items: center; } 

.contents_area .phone_guide_text strong svg { display: inline-block; width: 18px; height: 18px; vertical-align: middle; margin-right: 6px; } 

.contents_area .phone_guide_text strong svg .st0 { fill: none; stroke-width: 2; } 

.contents_area .phone_guide_text strong svg .st1 { fill: none; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; } 

.contents_area .phone_guide_text dl { margin-top: 10px; font-weight: normal; font-size: 12px; line-height: 21px; color: #888888; } 

.contents_area .phone_guide_text dt { display: list-item; list-style: disc; list-style-position: inside; text-indent: 4px; } 

.contents_area .phone_guide_text dd + dt { margin-top: 20px; } 

/* 에러페이지 */
.contents_area .error_area { padding-top: 104px; text-align: center; } 

.contents_area .error_area svg { width: 48px; height: 48px; } 

.contents_area .error_area strong { display: block; margin-top: 16px; font-weight: bold; font-size: 24px; line-height: 30px; } 

.contents_area .error_area p { margin-top: 24px; font-weight: normal; font-size: 14px; line-height: 20px; color: #888888; } 

/* 원본대조 검색 */
.contents_area .original_chk_area { margin-top: 32px; } 

.contents_area .pdf_view_area { margin-top: 64px; } 


/* 키움제휴 */
.contents_area.main_contents.search_type .contents_title { padding: 42px 24px 0; } 

.contents_area.main_contents.search_type .search_input_area { padding: 32px 24px 0; } 

.contents_area.main_contents.search_type .search_list_area { padding: 16px 24px 56px; min-height: calc(100% - 352px); } 

.contents_area.main_contents.search_type .search_list_area.none_input_type { padding-top: 24px; min-height: auto; } 

.contents_area.main_contents.search_type .search_list_area .box { padding: 16px 24px; border: 1px solid #e6e6e6; box-sizing: border-box; border-radius: 12px; margin-bottom: 8px; box-shadow: none; } 

.contents_area.main_contents.search_type .search_list_area.none_input_type .box { padding: 16px; } 

.contents_area.main_contents.search_type .search_list_area .box:last-of-type { margin-bottom: 0; } 

.contents_area.main_contents.search_type .search_list_area .box .title { font-weight: normal; font-size: 16px; line-height: 20px; } 

.contents_area.main_contents.search_type .search_list_area .box p { font-weight: normal; font-size: 13px; line-height: 20px; color: #888888; } 

.contents_area.main_contents.search_type .search_list_area.none_input_type .box p { color: #b3b3b3; } 


/* 영상자료 발송 */
.contents_area .address_input_area { margin-top: 24px; } 

.contents_area .address_input_area li { margin-bottom: 8px; } 

.contents_area .address_input_area li:last-of-type { margin-bottom: 0; } 

.contents_area .document_area + .bot_btn_area { padding: 0 24px 24px; } 

.contents_area .document_area + .bot_btn_area.posF { padding: 24px; } 

.pc_pop_wrap { display: none; z-index: 200; } 

/* 서류 없을 경우 */
.contents_area .none_doc_area { position: absolute; top: calc(50% - 56px); left: 50%; text-align: center; transform: translate(-50%, -50%); width: calc(100% - 48px); } 

.contents_area .none_doc_area i { display: inline-block; width: 24px; height: 24px; background-image: url(../image/icon_doc02.svg); background-repeat: no-repeat; background-position: center center; } 

.contents_area .none_doc_area strong { display: block; margin-top: 12px; font-weight: bold; font-size: 18px; line-height: 25px; width: 100%; } 

.contents_area .none_doc_area p { margin-top: 8px; font-weight: normal; font-size: 14px; line-height: 20px; color: #888888; } 


/* IE Error */
.ie_error_wrap { width: 100%; height: 100%; position: relative; } 

.ie_error_wrap .msg_contents_area { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); text-align: center; padding: 40px 0; } 

.ie_error_wrap .msg_contents_area i { display: inline-block; width: 85px; height: 84px; background-image: url(../image/icon_ie_error.svg); background-repeat: no-repeat; background-position: center center; } 

.ie_error_wrap .msg_contents_area p.msg_area { margin-top: 24px; font-weight: bold; font-size: 18px; line-height: 28px; } 

.ie_error_wrap .msg_contents_area .qr_msg_area { margin-top: 56px; text-align: center; } 

.ie_error_wrap .msg_contents_area .qr_msg_area img { display: block; width: 180px; height: 180px; margin: 0 auto; } 

.ie_error_wrap .msg_contents_area .qr_msg_area strong { display: block; font-weight: bold; font-size: 18px; line-height: 24px; margin-top: 16px; } 

.ie_error_wrap .msg_contents_area .qr_msg_area p { margin-top: 6px; font-weight: 500; font-size: 16px; line-height: 24px; } 

.ie_error_wrap .msg_contents_area .btn_list_area { margin-top: 24px; display: flex; justify-content: center; } 

.ie_error_wrap .msg_contents_area .btn_list_area li { margin-right: 16px; } 

.ie_error_wrap .msg_contents_area .btn_list_area li:last-of-type { margin-right: 0; } 

.ie_error_wrap .msg_contents_area .btn_list_area li .btn { width: 192px; height: 52px; line-height: 52px; background-color: #ffffff; border: 1px solid #f0f0f0; box-sizing: border-box; border-radius: 100px; display: inline-block; padding-left: 8px; font-weight: normal; font-size: 14px; background-image: url(../image/icon_download02.svg); background-repeat: no-repeat; background-position: calc(100% - 20px) center; position: relative; } 

.ie_error_wrap .msg_contents_area .btn_list_area li .btn::before { content: ""; width: 40px; height: 40px; background-repeat: no-repeat; background-position: center center; display: inline-block; position: absolute; left: 8px; top: 50%; transform: translateY(-50%); } 

.ie_error_wrap .msg_contents_area .btn_list_area li .btn.chrome::before { background-image: url(../image/icon_chrome.svg); } 

.ie_error_wrap .msg_contents_area .btn_list_area li .btn.edge::before { background-image: url(../image/icon_edge.svg); } 

.ie_error_wrap .msg_contents_area .sub_text_box { margin-top: 28px; width: 448px; text-align: center; height: 80px; background-color: #f0f0f0; border-radius: 16px; display: flex; flex-wrap: wrap; justify-content: center; align-items: center; flex-direction: column; } 

.ie_error_wrap .msg_contents_area .sub_text_box strong { display: block; font-weight: bold; font-size: 16px; line-height: 24px; } 

.ie_error_wrap .msg_contents_area .sub_text_box p { font-weight: 500; font-size: 14px; line-height: 24px; color: #333333; } 

/* 광고 영역 */
.complete_area + .ad_area { margin-top: 78px; } 

.ad_area { width: 100%; } 

.ad_area .main_ad_swiper { overflow: hidden; } 

.ad_area .main_ad_swiper .swiper-wrapper { width: 100%; height: auto; } 

.ad_area .swiper-slide { height: auto; overflow: hidden; } 

.ad_area .main_ad_swiper .swiper-slide a { display: inline-block; width: 100%; overflow: hidden; } 

.ad_area .swiper-slide img { display: inline-block; width: 100%; image-rendering: -webkit-optimize-contrast; transform: translateZ(0); backface-visibility: hidden; } 

/* 자녀 UI 추가 */
.child_add_list_area { background-color: #ffffff; padding: 0px 24px 40px; } 

.child_add_list_area .none_data_area { padding-top: 48px; text-align: center; } 

.child_add_list_area .none_data_area i { display: inline-block; width: 36px; height: 36px; background-image: url(../image/icon_mark_ex01.svg); background-repeat: no-repeat; background-position: center center; } 

.child_add_list_area .none_data_area strong { display: block; margin-top: 16px; font-weight: 700; font-size: 18px; line-height: 25px; } 

.child_add_list_area .none_data_area p { margin-top: 10px; font-weight: 500; font-size: 12px; line-height: 22px; color: #888888; } 

.child_add_list_area .data_list_area { padding-top: 24px; } 

.child_add_list_area .data_list_area .top_area { display: flex; justify-content: space-between; align-items: center; } 

.child_add_list_area .data_list_area .top_area .title { font-weight: 700; font-size: 18px; line-height: 25px; } 

.child_add_list_area .data_list_area .top_area .btn { font-weight: 400; font-size: 13px; line-height: 150%; text-decoration: underline; color: #b3b3b3; width: auto; height: auto; } 

.child_add_list_area .data_list_area .list.type_date { margin-top: 16px; } 

.child_add_list_area .button_area { margin-top: 44px; text-align: center; } 

.child_add_list_area .button_area .btn { display: inline-block; width: auto; height: auto; font-weight: 400; font-size: 14px; line-height: 20px; text-decoration: underline; } 

.child_add_list_area + .attech_area { padding: 40px 24px 136px; } 

.child_add_list_area + .attech_area .attach_list_area .box { display: flex; justify-content: flex-start; align-items: center; background-color: #ffffff; padding: 20px 16px; border-radius: 12px; } 

.child_add_list_area + .attech_area .attach_list_area .box + .box { margin-top: 8px; } 

.child_add_list_area + .attech_area .attach_list_area .num { display: inline-block; min-width: 24px; height: 24px; line-height: 24px; text-align: center; border-radius: 50%; color: #ffffff; font-weight: 400; font-size: 14px; } 

.child_add_list_area + .attech_area .attach_list_area .title { flex-grow: 1; padding-left: 8px; font-weight: 400; font-size: 13px; line-height: 20px; } 

.child_add_list_area + .attech_area .attach_list_area .btn { width: auto; height: 40px; line-height: 40px; padding: 0 12px; background-color: #888888; border-radius: 6px; font-weight: 400; font-size: 14px; color: #ffffff; } 

.child_add_list_area + .attech_area .attach_list_area .btn.complete { background-color: #eff2f4; color: rgba(6,11,17,0.48); } 

.child_add_list_area + .attech_area .sub_text { display: inline-block; font-weight: 700; font-size: 14px; line-height: 20px; margin-top: 12px; display: flex; align-items: flex-start; justify-content: flex-start; } 

.child_add_list_area + .attech_area .sub_text svg { width: 18px; height: 18px; margin-right: 6px; margin-top: 1px; min-width: 18px; } 

.child_add_list_area + .attech_area .sub_text svg .st0 { fill: none; stroke-width: 2; } 

.child_add_list_area + .attech_area .sub_text svg .st1 { fill: none; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; } 

.child_add_contents .child_input_list + .sub_text { display: inline-block; font-weight: 700; font-size: 14px; line-height: 20px; margin-top: 12px; display: flex; align-items: flex-start; justify-content: flex-start; word-break: keep-all; } 

.child_add_contents .child_input_list + .sub_text svg { width: 18px; height: 18px; margin-right: 6px; margin-top: 1px; min-width: 18px; } 

.child_add_contents .child_input_list + .sub_text svg .st0 { fill: none; stroke-width: 2; } 

.child_add_contents .child_input_list + .sub_text svg .st1 { fill: none; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; } 

.child_add_list_area + .attech_area .save_chk_area { margin-top: 24px; } 

.child_add_list_area + .attech_area .save_chk_area .title { font-weight: 700; font-size: 18px; line-height: 25px; display: block; } 

.child_add_list_area + .attech_area .save_chk_area .chk_area { margin-top: 6px; background-color: #ffffff; border-radius: 12px; padding: 30px 0 30px 20px; display: flex; flex-wrap: wrap; justify-content: flex-start; align-items: center; } 

.child_add_list_area + .attech_area .save_chk_area .chk_area li + li { margin-left: 24px; } 

.child_add_list_area + .attech_area .save_chk_area .chk_area input[type="radio"] + label { display: inline-block; padding-left: 28px; position: relative; font-weight: 400; font-size: 14px; line-height: 20px; } 

.child_add_list_area + .attech_area .save_chk_area .chk_area input[type="radio"] + label::before { content: ""; width: 20px; height: 20px; position: absolute; left: 0; top: 0; background-color: #e6e6e6; border-radius: 50%; display: inline-block; box-sizing: border-box; } 

.child_add_list_area + .attech_area .save_chk_area .chk_area input[type="radio"]:checked + label::before { border: 5px solid; background-color: #ffffff; } 

.doc_regist_area { padding-bottom: 120px; } 

.doc_regist_area .none_data_area { padding-top: 48px; text-align: center; } 

.doc_regist_area .none_data_area svg { width: 48px; height: 48px; } 

.doc_regist_area .none_data_area svg .st0 { fill-rule: evenodd; clip-rule: evenodd; fill: #888888; } 

.doc_regist_area .none_data_area .guide_text { margin-top: 24px; font-weight: 400; font-size: 14px; line-height: 20px; color: #888888; } 


.doc_regist_area .none_data_area .file_btn_area { margin-top: 28px; position: relative; width: 100%; height: 104px; } 

.doc_regist_area .none_data_area .file_btn_area input[type="file"] { opacity: 0; width: 100%; height: 100%; position: absolute; display: inline-block; left: 0; top: 0; cursor: pointer; } 

.doc_regist_area .none_data_area .file_btn_area .fake_btn { width: 100%; height: 100%; background-color: #ffffff; border: 1px dashed #e6e6e6; border-radius: 12px; display: flex; justify-content: center; align-items: center; flex-direction: column; } 

.doc_regist_area .none_data_area .file_btn_area .fake_btn i { display: inline-block; width: 32px; height: 32px; background-image: url(../image/icon_plus02.svg); background-repeat: no-repeat; background-position: center center; border-radius: 50%; } 

.doc_regist_area .none_data_area .file_btn_area .fake_btn span { display: block; margin-top: 8px; font-weight: 500; font-size: 14px; line-height: 20px; color: #888888; } 

.doc_regist_area .data_view_area { padding-top: 32px; display: flex; justify-content: flex-start; align-items: flex-start; } 

.doc_regist_area .data_view_area .preview_area { display: inline-block; width: 104px; height: 104px; position: relative; background-color: #d4d4d4; border-radius: 16px; overflow: hidden; } 

.doc_regist_area .data_view_area .preview_area .del_btn { position: absolute; z-index: 2; text-indent: -99999px; overflow: hidden; top: 8px; right: 8px; width: 24px; height: 24px; background: rgba(6, 11, 17, 0.1); border-radius: 50%; background-image: url(../image/icon_exit01.svg); background-repeat: no-repeat; background-position: center center; } 

.doc_regist_area .data_view_area .preview_area img { position: absolute; z-index: 1; left: 50%; top: 50%; transform: translate(-50%,-50%); min-width: 100%; min-height: 100%; } 

/* list type 추가 */
.list.type_date { } 

.list.type_date li { position: relative; width: 100%; height: 52px; } 

.list.type_date li label { position: absolute; left: 0; top: 0; width: 100%; height: 100%; border-radius: 12px; z-index: 1; } 

.list.type_date li .text_area { position: absolute; left: 0; top: 0; width: 100%; height: 100%; border-radius: 12px; padding: 0 24px 0 48px; background-color: #ffffff; border: 1px solid #e6e6e6; z-index: 0; display: flex; justify-content: space-between; align-items: center; } 

.list.type_date li input[type="radio"] + .text_area::before { position: absolute; left: 16px; top: 50%; transform: translateY(-50%); content: ""; display: inline-block; width: 20px; height: 20px; background-color: #e6e6e6; border-radius: 50%; } 

.list.type_date li input[type="checkbox"] + .text_area::before { position: absolute; left: 16px; top: 50%; transform: translateY(-50%); content: ""; display: inline-block; width: 20px; height: 20px; border-radius: 50%; background-image: url(../image/icon_chk03_g.svg); background-repeat: no-repeat; background-position: center center; } 

.list.type_date li + li { margin-top: 8px; } 

.list.type_date li input[type="radio"]:checked + .text_area::before { border: 5px solid #ffffff; box-sizing: border-box; } 

.list.type_date li input[type="checkbox"]:checked + .text_area::before { background-image: url(../image/icon_chk02_w.svg); } 

.list.type_date li .text_area .list_title { font-weight: 500; font-size: 16px; color: #888888; } 

.list.type_date li .text_area .sub_text { font-weight: 400; font-size: 14px; color: #888888; } 

.list.type_date li input[type="radio"]:checked + .text_area .list_title,
.list.type_date li input[type="checkbox"]:checked + .text_area .list_title { color: #ffffff; } 

.list.type_date li input[type="radio"]:checked + .text_area .sub_text,
.list.type_date li input[type="checkbox"]:checked + .text_area .sub_text { color: #ffffff; } 

.child_edit_list_area .list.type_date li input[type="checkbox"]:disabled + .text_area::before { background-image: url(../image/icon_child01.svg); } 

/* 증명서 발급 안내 페이지 */
.guide_view_area { padding-bottom: 48px; border-bottom: 12px solid #f0f0f0; } 

.guide_view_area .title_area { margin-top: 28px; text-align: center; } 

.guide_view_area .title_area .title { font-weight: 700; font-size: 20px; line-height: 29px; } 

.guide_view_area .title_area .skip_btn { position: fixed; right: 24px; top: 88px; display: inline-block; height: 32px; line-height: 32px; padding: 0 8px; box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.16); border-radius: 8px; font-weight: 700; font-size: 13px; color: #fefefe; width: 58px; white-space: nowrap; display: flex; justify-content: center; align-items: center; } 

.guide_view_area .title_area .skip_btn i { display: inline-block; margin-left: 4px; width: 8px; height: 14px; background-image: url(../image/icon_arrow_skip01.svg); background-repeat: no-repeat; background-position: center; } 

.guide_view_area .guide_box_list_area { margin-top: 28px; padding: 0 24px; } 

.guide_view_area .guide_box_list_area .box { background-color: #ffffff; border: 1px solid #f0f0f0; border-radius: 16px; padding: 24px 25px; } 

.guide_view_area .guide_box_list_area .box + .box { margin-top: 16px; } 

.guide_view_area .guide_box_list_area .label { display: inline-block; padding: 0 8px; height: 26px; line-height: 26px; background-color: #222222; border-radius: 67px; font-weight: 700; font-size: 16px; color: #ffffff; } 

.guide_view_area .guide_box_list_area .title { display: block; margin-top: 6px; font-weight: 700; font-size: 18px; line-height: 25px; color: #333333; } 

.guide_view_area .guide_box_list_area .guide_text { margin-top: 8px; font-weight: 400; font-size: 14px; line-height: 19px; color: #333333; } 

.guide_view_area .guide_box_list_area .img_area { margin: 28px auto 0; width: 100%; max-width: 272px; } 

.guide_main_btn_area { padding: 48px 24px 24px; text-align: center; } 

.guide_main_btn_area .guide_text { font-weight: 700; font-size: 20px; line-height: 29px; color: #333333; } 

.guide_main_btn_area .main_btn { display: inline-block; width: 100%; height: 56px; line-height: 56px; border-radius: 8px; font-weight: 700; font-size: 15px; color: #ffffff; margin-top: 40px; } 

.bot_btn_area.posF.footerSet { position: absolute; bottom: 0px; } 
@media (max-width:512px){
.modal_background { background-color: rgba(0,0,0,0.6); z-index: 1000; position: fixed; top: 0; width: 100%; height: 100vh; min-width: 360px; visibility: hidden; } 

.nurse_tab { background-color: white; width: 100%; min-width: 360px; height: 284px; position: fixed; bottom: -100%; border-radius: 24px 24px 0 0; padding: 40px 24px 24px 24px; transition: bottom 0.5s ease 0s; } 

.modal_background .sub_text { font-weight: 700; font-size: 18px; line-height: 25.2px; } 

.modal_background .guide_text { font-weight: 400; font-size: 13px; line-height: 16.28px; } 

.contents_area .modal_background .nurse_tab .sub_chk_area .sub_wrap { display: flex; justify-content: flex-start; flex-wrap: wrap; width: 300px; } 

.contents_area .modal_background .nurse_tab .sub_chk_area .inner_box { display: inline-block; } 

.contents_area .modal_background .nurse_tab .sub_chk_area .sub_wrap { display: flex; justify-content: flex-start; margin-top: 24px; padding-top: 7.4px; } 
.contents_area .modal_background .nurse_tab .sub_chk_area .sub_wrap li { margin-right: 8px; height: 32px; min-height: 32px; margin-bottom: 8px; } 

.contents_area .modal_background .nurse_tab .sub_chk_area .sub_wrap .inner_box input[type="checkbox"] + label { border: 0; padding: 6.5px 8.7px 6.5px 8.7px; background-color: #f0f0f0; border-radius: 8px; min-height: 32px; font-weight: 700; font-size: 13px; color: #888888; } 

.contents_area .modal_background .nurse_tab .sub_chk_area .sub_wrap .inner_box input[type="checkbox"] + label::before { content: ""; display: inline-block; width: 11px; height: 11px; background-image: url(../image/icon_chk01_w.svg); transform: none; background-repeat: no-repeat; background-position: center; background-size: 11px; margin-right: 5px; margin-bottom: -1px; } 

.detail_tab { background-color: white; width: 100%; min-width: 360px; height: 423px; position: fixed; bottom: -100%; border-radius: 24px 24px 0 0; padding: 40px 24px 24px 24px; transition: bottom 0.5s ease 0s; } 

.contents_area .modal_background .nurse_tab .nurse_tab_btns,
.contents_area .modal_background .detail_tab .nurse_tab_btns { margin-top: 9px; display: flex; } 
.contents_area .modal_background .nurse_tab .nurse_tab_btns .cancel_btn1,
.contents_area .modal_background .detail_tab .nurse_tab_btns .cancel_btn2 { width: 47.46%; height: 56px; background: #E6E6E6; border-radius: 28px; margin-right: 16px; font-weight: 700; font-size: 15px; line-height: 24px; } 
.contents_area .modal_background .nurse_tab .nurse_tab_btns .confirm_btn,
.contents_area .modal_background .detail_tab .nurse_tab_btns .confirm_btn2 { width: 47.46%; height: 56px; border-radius: 28px; font-weight: 700; font-size: 15px; line-height: 24px; } 
.contents_area .modal_background .nurse_tab .nurse_tab_btns .confirm_btn:disabled,
.contents_area .modal_background .detail_tab .nurse_tab_btns .confirm_btn2:disabled { width: 47.46%; height: 56px; background: #E6E6E6; color: #B3B3B3; border-radius: 28px; } 

.contents_area .modal_background .detail_tab .textarea_container { width: 100%; height: 204px; border-radius: 12px; padding: 22px 8px 22px 24px; background: #E6E6E6; margin: 24px 0 14px 0; font-weight: 400; font-size: 15px; line-height: 20px; border: 1px solid #e6e6e6; } 

.contents_area .modal_background .detail_tab .detail_input { width: 100%; height: 100%; background-color: transparent; border: none; border: 1px solid transparent; font-weight: 400; font-size: 15px; line-height: 20px; padding-right: 8px; } 

.contents_area .modal_background .detail_tab .detail_input::-webkit-scrollbar { width: 4px; background-color: transparent; } 
.contents_area .modal_background .detail_tab .detail_input::-webkit-scrollbar-thumb { background-color: #E6E6E6; border-radius: 4px; } 
.contents_area .modal_background .detail_tab .detail_input::-webkit-scrollbar-track { background-color: transparent; } 


.text_filled { background-color: #ffffff !important; border: 1px solid #e6e6e6; } 

.modal_background.active { visibility: visible; } 
.nurse_tab.active { bottom: 0; top: unset; } 
.detail_tab.active { bottom: 0; top: unset; } 
}

@media (min-width:512px){
.m_only { display: none !important; } 
.gnb_area { right: calc(50% - 256px); } 
.contents_area.main_contents .swiper.ex_type .img_area { background-size: 380px; background-position: center top; } 

.contents_area.main_contents .ex_swiper_area { height: 412px; } 

.contents_area.main_contents .swiper.ex_type .box { height: 292px; } 

.contents_area.main_contents .ex_swiper_area .swiper.ex_type .img_area { height: 171px; } 

.bot_btn_area.posF { width: 512px; left: 50%; transform: translateX(-50%); } 

.toast_popup_wrap { width: 512px; left: 50%; transform: translateX(-50%); } 

.bot_btn_area.type_floating .bg_area { display: inline-block; width: 512px; left: 50%; transform: translateX(-50%); max-width: inherit; margin: inherit; } 

.bot_btn_area.type_floating.fix .bg_area { width: 512px; transform: none; } 

.main_btn_area.type_floating .bg_area { width: 512px; left: 50%; transform: translateX(-50%); } 

.main_btn_area.type_floating.fix .bg_area { width: 512px; transform: none; } 


.dim { width: 512px; left: 50%; transform: translateX(-50%); } 

.pc_pop_wrap.only_pc_type .dim { transform: none; } 

.popup_wrap { width: 512px; left: 50%; transform: translateX(-50%); } 

.terms_wrap { width: 512px; left: 50%; transform: translateX(-50%); } 

.popup.typeA { width: 512px; left: 50%; transform: translateX(-50%); } 

.contents_area .tab_fixed_area { width: 512px; left: 50%; transform: translateX(-50%); } 
/* Type B */
.popup.typeB { width: calc(100% - 48px); } 

.popup .btn { width: 264px; margin: 0 auto; display: block; } 

.bot_btn_area.pc_posS { position: static; padding: 0; } 

.pc_mt01 { margin-top: 158px; } 

.pc_mt02 { margin-top: 168px; } 

.pc_mt03 { margin-top: 264px; } 

.pc_mt04 { margin-top: 148px; } 

.pc_mt05 { margin-top: 234px; } 

.bot_btn_area .btn_sub_list.pc_box { margin-top: 24px; padding: 20px 28px 22px; background-color: #ffffff; border-radius: 16px; } 

main { box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.25); } 


/* 스크롤 */
body::-webkit-scrollbar { width: 4px; } 

body::-webkit-scrollbar-thumb { background-color: #888888; border-radius: 16px; } 

body::-webkit-scrollbar-track { background-color: transparent; } 

.contents_area .inner_scroll_contents .etc_chk_area label textarea::-webkit-scrollbar { width: 4px; } 

.contents_area .inner_scroll_contents .etc_chk_area label textarea::-webkit-scrollbar-thumb { background-color: #888888; border-radius: 16px; } 

.contents_area .inner_scroll_contents .etc_chk_area label textarea::-webkit-scrollbar-track { background-color: transparent; } 

.contents_area .terms_area .terms_text_box pre::-webkit-scrollbar { width: 4px; } 

.contents_area .terms_area .terms_text_box pre::-webkit-scrollbar-thumb { background-color: #888888; border-radius: 16px; } 

.contents_area .terms_area .terms_text_box pre::-webkit-scrollbar-track { background-color: transparent; } 

/* 자녀 UI 추가 */
.child_add_list_area .none_data_area { padding-top: 80px; } 

.guide_view_area .title_area .skip_btn { left: calc(50% + 204px); transform: translateX(-50%); } 

.modal_background { background-color: rgba(0,0,0,0.6); z-index: 1000; position: fixed; top: 0; width: 512px; height: 100vh; visibility: hidden; } 

.nurse_tab { background-color: white; width: 512px; height: 244px; position: fixed; bottom: -100%; border-radius: 24px 24px 0 0; padding: 40px 0 0 24px; transition: bottom 0.5s ease 0s; } 

.modal_background .sub_text { font-weight: 700; font-size: 18px; line-height: 25.2px; } 

.modal_background .guide_text { font-weight: 400; font-size: 13px; line-height: 16.28px; } 

.contents_area .modal_background .nurse_tab .sub_chk_area .sub_wrap { display: flex; justify-content: flex-start; flex-wrap: wrap; } 

.contents_area .modal_background .nurse_tab .sub_chk_area .inner_box { display: inline-block; } 

.contents_area .modal_background .nurse_tab .sub_chk_area .sub_wrap { display: flex; justify-content: flex-start; margin-top: 25px; padding-top: 7.4px; } 
.contents_area .modal_background .nurse_tab .sub_chk_area .sub_wrap li { margin-right: 8px; height: 32px; min-height: 32px; margin-bottom: 8px; } 

.contents_area .modal_background .nurse_tab .sub_chk_area .sub_wrap .inner_box input[type="checkbox"] + label { border: 0; padding: 7.4px 8px 7.4px 11px; background-color: #f0f0f0; border-radius: 8px; min-height: 32px; font-weight: 700; font-size: 13px; color: #888888; } 

.contents_area .modal_background .nurse_tab .sub_chk_area .sub_wrap .inner_box input[type="checkbox"] + label::before { content: ""; display: inline-block; width: 11px; height: 11px; background-image: url(../image/icon_chk01_w.svg); transform: none; background-repeat: no-repeat; background-position: center; background-size: 11px; margin-right: 5px; margin-bottom: -1px; } 

.detail_tab { background-color: white; width: 512px; height: 423px; position: fixed; bottom: -100%; border-radius: 24px 24px 0 0; padding: 40px 24px 24px 24px; transition: bottom 0.5s ease 0s; } 

.contents_area .modal_background .nurse_tab .nurse_tab_btns,
.contents_area .modal_background .detail_tab .nurse_tab_btns { margin-top: 10px; display: flex; } 
.contents_area .modal_background .nurse_tab .nurse_tab_btns .cancel_btn1,
.contents_area .modal_background .detail_tab .nurse_tab_btns .cancel_btn2 { width: 224px; height: 56px; background: #E6E6E6; border-radius: 28px; margin-right: 16px; font-weight: 700; font-size: 15px; line-height: 24px; } 
.contents_area .modal_background .nurse_tab .nurse_tab_btns .confirm_btn,
.contents_area .modal_background .detail_tab .nurse_tab_btns .confirm_btn2 { width: 224px; height: 56px; border-radius: 28px; font-weight: 700; font-size: 15px; line-height: 24px; } 
.contents_area .modal_background .nurse_tab .nurse_tab_btns .confirm_btn:disabled,
.contents_area .modal_background .detail_tab .nurse_tab_btns .confirm_btn2:disabled { width: 224px; height: 56px; background: #E6E6E6; color: #B3B3B3; border-radius: 28px; } 

.contents_area .modal_background .detail_tab .textarea_container { width: 464px; height: 204px; border-radius: 12px; padding: 22px 8px 22px 24px; background: #E6E6E6; margin: 24px 0 14px 0; font-weight: 400; font-size: 15px; line-height: 20px; border: 1px solid #e6e6e6; } 

.contents_area .modal_background .detail_tab .detail_input { width: 100%; height: 100%; background-color: transparent; border: 1px solid transparent; font-weight: 400; font-size: 15px; line-height: 20px; padding-right: 8px; } 

.contents_area .modal_background .detail_tab .detail_input::-webkit-scrollbar { width: 4px; background-color: transparent; } 
.contents_area .modal_background .detail_tab .detail_input::-webkit-scrollbar-thumb { background-color: #E6E6E6; border-radius: 4px; } 
.contents_area .modal_background .detail_tab .detail_input::-webkit-scrollbar-track { background-color: transparent; } 


.text_filled { background-color: #ffffff !important; border: 1px solid #e6e6e6; } 
.modal_background.active { visibility: visible; } 
.nurse_tab.active { bottom: 0; top: unset; } 
.detail_tab.active { bottom: 0; top: unset; } 
}
@media (min-width:1024px){
    
.pc_only { display: block !important; } 
.gnb_area { right: calc(50% - 512px); } 

main.original_wrap { position: relative; } 

.main_btn_area.type_floating .bg_area,
.bot_btn_area.type_floating .bg_area
.main_btn_area.type_floating .bg_area,
.bot_btn_area.type_floating .bg_area { display: inline-block; width: 512px; left: 50%; transform: none; max-width: inherit; margin: inherit; } 


.bg_area { display: flex; justify-content: space-between; position: relative; } 

.bg_contents_area { display: block; width: 512px; flex-grow: 1; flex-basis: 512px; position: fixed; top: 50%; transform: translateY(-50%); } 

.bg_contents_area h1 img { width: 172px; } 

.bg_contents_area .bg_text_area { margin-top: 16px; font-size: 24px; line-height: 34px; color: #333333; } 

.bg_contents_area .bg_text_area span { font-weight: 400; display: block; } 

.bg_contents_area .bg_text_area strong { font-weight: 700; display: block; } 

.bg_contents_area .bg_text_area h2 { font-weight: bold; font-size: 32px; line-height: 40px; margin-top: 12px; } 

main { flex-grow: 1; flex-basis: 512px; width: 512px; position: absolute; right: 0; } 

.bot_btn_area.type_floating .bg_area { left: unset; transform: none; right: calc(50% - 512px); } 

.bg_contents_area .ad_area { margin-top: 72px; width: 360px; } 

.bg_contents_area .ad_area a { display: inline-block; width: auto; height: auto; } 

.bg_contents_area .ad_area img { max-width: 360px; } 

/* Main */
.contents_section { border-bottom: 0; padding: 40px 24px 40px; } 

/* Popup */
.dim { width: 512px; left: inherit; transform: none; } 

.popup_wrap { width: 512px; left: inherit; transform: none; } 

.pc_pop_wrap { width: 1024px; height: 100%; position: fixed; left: 50%; transform: translateX(-50%); top: 0; } 

.dim { width: 512px; left: calc(50% + 256px); transform: translateX(-50%); } 

.popup_wrap { width: 512px; right: 0; left: inherit; } 

.terms_wrap { width: 512px; right: calc(50% - 512px); left: inherit; transform: none; } 

.toast_popup_wrap { width: 512px; right: calc(50% - 512px); left: inherit; transform: none; } 

.contents_area .inner_scroll_contents.hi_typeS { padding-bottom: 112px; } 


/* Button */
/* Button */
.bot_btn_area.posF { left: inherit; transform: none; right: calc(50% - 512px); } 

.bot_btn_area.posF.footerSet { position: absolute; bottom: 0px; left: 0; } 

.popup.typeA { left: inherit; transform: none; right: calc(50% - 512px); } 

.contents_area .tab_fixed_area { left: inherit; transform: none; right: calc(50% - 512px); } 

.popup.typeB { top: 200px; transform: translate(-50%,0); } 

.guide_view_area .title_area .skip_btn { right: calc(50% - 488px); transform: none; left: inherit; } 
}
@media (min-width: 1380px) { 
.kakao_consult { display: flex; justify-content: flex-start; align-items: center; position: fixed; bottom: 25px; left: calc(50% + 540px); width: 166px; height: 56px; background-color: #fee500; border-radius: 28px; z-index: 520; text-align: left; background-image: url(../image/kakao_icon.svg); background-repeat: no-repeat; background-size: 24px; background-position: 16px center; padding-left: 52px; } 
.kakao_consult span { font-weight: 500; line-height: 18px; font-size: 15px; color: #391b1b; } 
}
@media not all and (min-resolution:.001dpcm) { @supports (-webkit-appearance:none){
.contents_area .inner_scroll_contents .inner_list.type_left_three_line label span.title .label span { line-height: inherit; vertical-align: middle; -webkit-vertical-align: -0.25em; } 
} 
}


#loading { position: fixed; left: 0; top: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.45); z-index: 9999; }
#loading.off { animation: fadeOut 0.4s linear 1 forwards; } 
#loading .ring { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%) rotate(0deg); width: 60px; height: 60px; border: 6px solid rgba(255, 255, 255, 0.3); border-top: 6px solid #ffffff; border-radius: 50%; animation: spin 1.2s linear infinite; }
@keyframes spin {
    0% { transform: translate(-50%, -50%) rotate(0deg); }
    100% { transform: translate(-50%, -50%) rotate(360deg); }
}
@keyframes fadeOut {
    0% { opacity: 1; }
    50% { opacity: 0; }
    100% { opacity: 0; display: none; visibility: hidden; }
}