@charset "UTF-8";

/***************************************************************************************************
	Font - Pretendard
***************************************************************************************************/
@import url("https://use.typekit.net/rsj1rqi.css");
@import url("https://cdn.jsdelivr.net/gh/orioncactus/pretendard@v1.3.8/dist/web/static/pretendard.css");


:root {
    --font: "Pretendard";   /* font-face 로 지정한 폰트명 */
	--font02: "montserrat";

    --normal: #333;
    --primary: #0B6EC9;
    --sub: #515151;
    --red: #FC523B;

	--blue: #003F98;
    --light: #ACACAC;

	--active: #128DE9;
	--disabled: #8B8B8B;
    --placeholder: rgba(19, 19, 19, 0.5);

    --border: #eee;
}

/***************************************************************************************************
	Reset
***************************************************************************************************/
body {-webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none;}

html, body {width: 100%; height:100%; margin:0; padding:0; -webkit-text-size-adjust:none;}
html {font:normal 16px var(--font), 'arial', 'verdana', sans-serif; background:transparent;}
body {min-height:100%; font-family: var(--font), 'arial', 'verdana', sans-serif!important; color:var(--normal); background:transparent; word-break: break-all; overflow-wrap: break-word;}
img {border:none;}
p, ul, li, ol, h1, h2, h3, h4, h5, h6, dl, dt, dd, em, figure {margin:0; padding:0; box-sizing: border-box;}
li {list-style:none; box-sizing: border-box;}
fieldset {margin:0; padding:0; border:none;}
legend {position:absolute; left:-1000px; top:-1000px; height:0; font-size:0; line-height:0; visibility:hidden;}
a {margin:0; color:var(--normal); text-decoration:none; box-sizing: border-box;}
table {border-collapse:collapse; font-size:1em;}
table caption {display:none;position:absolute; left:-999px; height:0; font-size:0; line-height:0; visibility:hidden; overflow:hidden;}
table td, table th {padding:0;}
button {margin:0; padding:0; font: 500 1em var(--font), 'arial', 'verdana', sans-serif; color:var(--normal); vertical-align:middle; background:0; border:none; overflow:visible; cursor:pointer; -webkit-tap-highlight-color:rgba(0,0,0,0);}
button:focus {outline:none;}
button:disabled {opacity: 0.2;}
input[type=text], input[type=password], input[type=number], input[type=tel], input[type=rang], input[type=email], input[type=url], input[type=date], input[type=datetime], input[type=month], input[type=tel], input[type=search], input[type=color] {
  display:inline-block; max-width: 100%; height: 48px; margin: 0; padding: 3px 10px; font: normal .875rem var(--font), 'arial', 'verdana', sans-serif; color:var(--normal); vertical-align:middle;
  background:#fff; border: 1px solid var(--border); border-radius: 8px; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box; -webkit-appearance:none; -moz-appearance:none; appearance:none;
}
input::-webkit-input-placeholder {color: var(--placeholder);}
input[readonly] {color: var(--light); background-color: #EBEDF4;}

input[type=text]:only-child, input[type=password]:only-child, input[type=search]:only-child, input[type=number]:only-child, input[type=date]:only-child, input[type=email]:only-child, input[type=tel]:only-child {max-width:100%; width:100%;}

input[type=number]::-webkit-input-placeholder {text-align:left;}
input[type=number]::-webkit-inner-spin-button, input[type=number]::-webkit-outer-spin-button {-webkit-appearance:none; appearance:none; margin:0;}
input[type=number] {-moz-appearance:textfield; appearance:textfield;}
input[type="number"]:hover, input[type="number"]:focus {-moz-appearance:number-input; appearance:number-input;}

input[type=checkbox], input[type=radio] {margin:0; vertical-align:middle; font-size:1em; border:none; border-radius:0; -webkit-appearance:none; -moz-appearance:none; appearance:none;}
input[type=checkbox]:only-child, input[type=radio]:only-child {margin:0;}
input[type=checkbox] {min-width: 24px; height: 24px; background:url("../images/checkbox_off.svg") no-repeat center center; border:none;}
input[type=checkbox]:checked {background-image:url("../images/checkbox_on.svg");}
input[type=checkbox]:disabled {background-image: url("../images/checkbox_disabled.svg");}
input[type=checkbox]:checked:disabled {background-image: url("../images/checkbox_on_disabled.svg");}

input[type=radio] {min-width: 25px; height: 25px; background:url("../images/radio_off.svg") no-repeat left center; border:none;}
input[type=radio]:checked {background-image:url("../images/radio_on.svg");}
input[type=radio]:disabled {background-image: url("../images/radio_disabled.svg");}
input[type=radio]:checked:disabled {background-image: url("../images/radio_on_disabled.svg");}


input:focus, textarea:focus, select:focus {outline:none; -webkit-tap-highlight-color:rgba(0,0,0,0.2);}
input:focus:not([type=checkbox]):not([type=radio]), select:focus, textarea:focus {border-color: var(--active);}
input:disabled:not([type=radio]):not([type=checkbox]) {color: var(--disabled); background-color: #eee;}

select {margin:0; max-width:100%; height: 40px; padding: 0 40px 0 10px; font: normal .875rem var(--font), 'arial', 'verdana', sans-serif; color:var(--normal); vertical-align:middle;
  background: url("../images/select_arrow.svg") no-repeat right center; background-color: #fff; border: 1px solid var(--border); border-radius: 0; -webkit-appearance:none; -moz-appearance:none; appearance:none; white-space:nowrap; overflow:hidden; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box;
}
select:disabled {opacity: 0.5;}
select.sm {height: 32px;}

label, label > span {vertical-align:middle;}
label input[type=checkbox] + *, label input[type=radio] + * {margin-left: 7px; vertical-align:middle;}
textarea {width:100%; padding: 10px; font:normal .875rem/1.33 var(--light), 'arial', 'verdana', sans-serif;
  background: #fff; border: 1px solid var(--border); border-radius: 0; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box;
  resize:none;
}
textarea[readonly=readonly] {background: #f6f6f6; box-shadow: none;}
textarea:only-child {vertical-align:top;}
textarea::-webkit-input-placeholder {font-size: .875rem; color: #b5b5b5;}
hr {height:0; margin: 40px 0; border:none; border-top:1px solid #ddd;}
div {box-sizing:border-box; -webkit-box-sizing:border-box;}
article, aside, footer, header, hgroup, nav, section, figure {display:block; padding:0; margin:0; box-sizing:border-box; -webkit-box-sizing:border-box;}
a[href^=tel] {text-decoration:underline;}
em, address {font-style:normal;}
em {color:var(--red);}
sub {font-weight:normal; vertical-align:middle;}
img {max-width:100%; vertical-align:top;}

del {text-decoration-color: var(--primary);}


/******** common class ********/
.vtop {vertical-align:top !important;}
.vmid {vertical-align: middle;}
.c_btn {display:-webkit-box; display:-moz-box; display:-ms-flexbox; display:flex; margin: 24px 0; text-align:center;}
.c_btn:first-child {margin-top: 0;}
.c_btn:last-child {margin-bottom: 0;}
.c_btn > *:not(:first-child) {margin-left: 10px;}
.c_btn button, .c_btn a {-webkit-flex: 1; flex: 1;}
.board_btn {margin-top: 40px; text-align: center;}
.board_btn > * {min-width: 320px;}
.l_btn {margin: 10px 0;}
.l_btn:last-child {margin-bottom: 0;}
.r_btn {display:-webkit-box; display:-moz-box; display:-ms-flexbox; display:flex; margin: 10px 0; text-align: right; justify-content: right;}
.r_btn > *:not(:first-child) {margin-left: 8px;}
.r_btn:last-child {margin-bottom: 0;}
.btn_list {display: flex; flex-direction: column;}
.btn_list button, .btn_list a {margin-top: 16px;}

.font_normal {font-weight: normal !important;}
.text_right {text-align:right !important;}
.text_left {text-align:left !important;}
.cen {text-align:center !important;}
.hide {position:absolute !important; left:-10000px; top:-10000px; visibility:hidden;}
.none {display:none !important;}
.ellipsis {text-overflow:ellipsis; white-space:nowrap; overflow:hidden;}
.ellipsis_line2 {display: -webkit-box; -webkit-box-orient: vertical; text-overflow:ellipsis; -webkit-line-clamp: 2; overflow:hidden;}
.nowrap {white-space: nowrap;}
.noimg img {display:none !important;}
.prewrap {white-space: pre-wrap;}
.word_keep {word-break:keep-all;}
.txt_underline {color:inherit; text-decoration: underline;}
.block {display: block !important;}
.dflex {display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: flex;}
.flex_column {display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: flex; -ms-flex-direction: column; -webkit-flex-direction: column; flex-direction: column;}
.flex_cont {-webkit-flex: 1; flex: 1;}
.dflex .flex_cont:not(:first-child) {padding-left: 10px;}
.dflex button {margin: 0 5px;}
.dflex button:first-child {margin-left: 0;}
.dflex button:last-child {margin-right: 0;}
.space_between {display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-justify-content: space-between; justify-content: space-between;}
.space_between > * + * {margin-left: 20px;}
.flex_none {-webkit-flex: none !important; flex: none !important;}
.align_mid {-webkit-box-align: center; align-items: center; vertical-align: middle;}

.pd0 {padding:0 !important;}
.mg0 {margin: 0 !important;}
.base_margin {margin: 10px 0;}
.base_margin:first-child {margin-top: 0;}
.base_margin:last-child {margin-bottom: 0;}
.nobg {background-color: transparent !important;}
.noborder {border: none !important;}
.bg_w {background-color: #fff !important;}

/******************************/

/***** Layout *****/
.app_wrap {display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: flex; min-width: 1400px; min-height: 100%; flex-direction: column; -moz-box-direction: column; -ms-flex-direction: column; flex-direction: column;}
.web_container {max-width: 1300px; margin: 0 auto; padding: 0 50px;}
.web_container02 {max-width: 600px; margin: 0 auto; padding: 50px;}
.headerWrap {position: -webkit-sticky; position: sticky; top: 0; height: 84px; background-color: #fff; border-bottom: 1px solid #eee; z-index: 100;}
.headerWrap > .web_container {display: flex; -webkit-box-align: center; align-items: center; min-height: 84px;}
.btn_menu {width: 36px; height: 36px; text-indent: -999em; background: #fff url("../images/btn_GNB.svg") no-repeat center center; border-radius: 50px; box-shadow: 0px 0px 10px 0px #00000026;}
.logo {min-width: 112px; margin: 0 24px;}
.headerWrap a {font-weight: 500; color: #131313;}
.GNBWrap {flex: 1; height: 84px; padding: 20px 0 0;}
.GNBWrap > ul {display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: flex; height: 100%;}
.GNBWrap > ul > li {position: relative;}
.GNBWrap > ul > li > a {display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: flex; height: 44px; padding: 5px 14px; font-size: 900; font-size: 1.125rem; color: #131313; -webkit-box-align: center; align-items: center; justify-content: center;}
.sub_menu {position: absolute; left: 0; top: 100%; min-width: 160px; height: 0; margin-top: -20px; background-color: #fff; box-shadow: 0px 8px 20px 0px #00000026; opacity: 0; overflow: hidden; transition: all 0.2s linear; z-index: 10;}
.GNBWrap a:hover, .GNBWrap > ul > li:hover .menu_tit {font-weight: bold; color: #0B6EC9;}
.GNBWrap > ul > li:hover .sub_menu {height: auto; padding: 20px 0; opacity: 1;}
.sub_menu a {display: block; padding: 12px 24px; font-weight: 700; font-size: 1rem; color: #333;}


.GNB_all {position: fixed; left: 0; top: 84px; width: 100%; height: 0; background-color: #fff; border-top: 1px solid #E3E3E3; box-shadow: 0px 8px 20px 0px #00000026; overflow: hidden; opacity: 0; transition: all 0.2s linear;}
.GNB_all > ul {display: flex; max-width: 1300px; margin: 0 auto; padding: 20px 50px; box-sizing: border-box;}
.GNB_all > ul > li {flex: 1;}
.GNB_all .menu_tit {padding: 10px 16px 10px 0; font-weight: bold;}
.GNB_all .sub_menu {position: static; min-width: 100%; height: auto; margin-top: 15px; box-shadow: none; opacity: 1;}
.GNB_all .sub_menu a {padding: 10px 16px 10px 0; font-weight: normal;}
.GNB_all a:hover {color: #0B6EC9;}
.all_menu_open .GNBWrap {pointer-events: none;}
.all_menu_open .GNB_all {height: auto; opacity: 1;}



.util_menu {display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; align-items: center;}
.util_menu a {margin-left: 40px; padding: 10px 0 10px 32px;}
.btn_util_login {background: url("../images/ico_util_login.svg") no-repeat left center;}
.btn_util_cs {background: url("../images/ico_util_cs.svg") no-repeat left center;}
.btn_util_user {background: url("../images/ico_util_user.svg") no-repeat left center;}


.contentsWrap {flex: 1;}
.contentsWrap > .web_container:last-child {padding-bottom: 50px;}

.footerWrap {padding-bottom: 40px;}
.footer_intro {margin-bottom: 7px; border: 1px solid #eee; border-width: 1px 0;}
.footer_intro .web_container {display: flex; min-height: 64px; padding: 15px 50px; font-size: .875rem; color: #515151; -webkit-box-align: center; align-items: center;}
.footer_intro a {padding: 10px 16px 10px 0; color: #515151;}
.footer_intro dl {display: flex;}
.footer_intro dt {margin-right: 16px;}
.footer_menu {display: flex; margin-bottom: 14px;}
.footer_menu a {margin-right: 3px; padding: 10px 5px; font-size: .8125rem; color: #515151;}
.footer_menu a:first-child {padding-left: 0;}
.footer_box {display: flex; font-size: .875em; color: #515151;}
.footer_box .cont {flex: 1;}
.footer_box h2 {margin-bottom: 14px; font-weight: 700;}
.footer_box p {margin-top: 7px; letter-spacing: .1em;}
.footerWrap .copyright {margin-top: 20px;}
.footer_box .call_center {display: flex; margin-bottom: 12px; align-items: center; font-weight: bold; font-size: 1rem; color: #333;}
.footer_box .call_center dt {margin-right: 9px;}
.footer_box .call_center dd {color: #003F98;}
.footer_box .email {margin-top: 12px; color: #333;}

.fabWrap {position: -webkit-sticky; position: sticky; bottom: 150px; margin-bottom: 40px;}
.fab_btn_area {position: absolute; right: 30px; bottom: 0; display: flex; flex-direction: column;}
.fab_btn_area button {width: 56px; height: 56px; margin-top: 16px; text-indent: -999em; animation: fab 5s ease-in-out infinite;}
.btn_fab_kakao {background: url("../images/btn_fab_kakao.png") no-repeat center center;}
.btn_fab_naver {background: url("../images/btn_fab_naver.png") no-repeat center center; animation-delay: .2s !important;}
.btn_fab_telegram {background: url("../images/btn_fab_telegram.png") no-repeat center center; animation-delay: .4s !important;}

@keyframes fab {
	7% {transform: translateY(-3px);}
	20% {transform: translateY(0);}
}

.sub_visual_area {position: relative; display: flex; height: 320px; background-size: cover !important;}
.sub_visual_area::before {content: ""; position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: rgba(19, 19, 19, .7);}
.sub_visual_area .web_container {position: relative; flex: 1; margin: auto; font-size: 1.375rem; color: #fff; text-align: center;}
.tit_sub_visual {margin-bottom: 20px; font-size: 48px;}
.sub_visual_area.terms {background: url("../images/img_subvisual_terms.png") no-repeat center center;}
.sub_visual_area.policy {background: url("../images/img_subvisual_policy.png") no-repeat center center;}
.sub_visual_area.spam {background: url("../images/img_subvisual_spam.png") no-repeat center center;}

.terms_cont {margin-top: 70px; padding: 30px; line-height: 1.5; border: 1px solid #C5C5C5; border-radius: 10px; white-space: pre-line;}

/***** main *****/
.key_visual.main {position: relative; display: flex; height: 620px; overflow: hidden;}
.key_visual.main::before {content: ""; position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: url("../images/img_keyvisual_main.png") no-repeat center top; background-size: cover; animation: visual 2s linear forwards;}
.key_visual.main::after {content: ""; position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: rgba(36, 43, 64, 0.4); z-index: 1;}
.key_visual.main > .web_container {position: relative; flex: 1; margin: auto; font-size: 1.125rem; color: #fff; line-height: 1.56; z-index: 10;}
.tit_visual {margin-bottom: 24px; font-weight: normal; font-size: 48px; line-height: 1.2;}
.key_visual .btn_area {margin-top: 24px;}
.btn_visual_more {display: inline-flex; min-width: 198px; height: 60px; padding: 10px 24px; font-size: 1.125rem; color: #fff; text-align: center; -webkit-box-align: center; align-items: center; justify-content: center; background-color: #333;}

@-webkit-keyframes visual {
	to {scale: 1.2;}
}
@keyframes visual {
	to {scale: 1.2;}
}

.main_service_list {position: relative; margin: -40px 0 120px; z-index: 10;}
.main_service_list ul {position: relative; display: flex; color: #333; line-height: 1.625;}
.main_service_list ul::before {content: ""; position: absolute; right: -28px; bottom: -39px; width: 123px; height: 123px; background-color: var(--blue);}
.main_service_list li {position: relative; flex: 1; min-height: 280px; margin-right: 20px; padding: 24px; background-color: #fff; border: 1px solid #DFDFDF; box-sizing: border-box;}
.main_service_list li:last-child {margin: 0;}
.main_service_list li:first-child {margin-right: 40px; color: #fff; background-color: var(--blue); border-color: var(--blue);}
.main_service_list li:first-child dd {color: #fff;}
.main_service_list dt {padding-top: 45px; font-weight: 700; font-size: 1.25rem;}
.main_service_list dd {margin-top: 13px; color: rgba(19, 19, 19, 0.7);}
.service_sms dt {background: url("../images/ico_main_service_sms.svg") no-repeat left top;}
.service_deny dt {background: url("../images/ico_main_service_deny.svg") no-repeat left top;}
.service_excel dt {background: url("../images/ico_main_service_excel.svg") no-repeat left top;}
.service_price dt {background: url("../images/ico_main_service_price.svg") no-repeat left top;}
.btn_service_more {display: block; margin-top: 10px; height: 34px; text-indent: -999em; background: url("../images/btn_service_more.svg") no-repeat left center;}
.btn_service_more::before {content: ""; position: absolute; left: 0; top: 0; width: 100%; height: 100%;}
.main_service_list li:first-child .btn_service_more {background-image: url("../images/btn_service_more_w.svg");}
.btn_service_more:hover {animation: bg_left 3s ease-in infinite;}
@keyframes bg_left {
	10% {background-position: 5px center;}
	20% {background-position: left center;}
}


.service_amount {margin: 120px 0 102px;}
.service_amount ul {display: flex;}
.service_amount li {position: relative; flex: 1; min-height: 457px; border: 1px solid #F7F7F7; box-sizing: border-box;}
.service_amount .image {margin: -1px -1px 0; overflow: hidden;}
.service_amount .image img {transition: all .3s linear;}
.service_amount .cont {position: relative; padding: 24px; text-align: center;}
.service_amount .cont::before {content: ""; position: absolute; left: 50%; top: -16px; width: 6px; height: 32px; margin-left: -3px; background-color: #004098;}
.service_amount dt {margin-bottom: 15px; font-weight: 700; font-size: 1.5rem; color: #131313;}
.service_amount dd {font-size: 1rem; color: rgba(19, 19, 19, 0.7); line-height: 1.5;}
.service_amount .btn_detail {background: url("../images/btn_amount_more.svg") no-repeat right bottom;}
.service_amount li:hover .image img {scale: 1.2;}

.our_special {height: 500px; margin: 102px 0 87px; color: #fff; background: #202C3E url("../images/bg_special.png") no-repeat center top;}
.our_special > .web_container {height: 100%; padding-top: 72px; font-weight: 500; color: #fff; text-align: center;}
.our_special .tit {margin-bottom: 8px; font-family: var(--font02); font-weight: bold; font-size: 1.5rem;}
.special_list {display: flex; margin-top: 48px; justify-content: space-around;}
.special_list dl {position: relative; min-width: 320px; padding: 96px 0 47px; font-weight: 700; font-size: 40px;}
.special_list dt {position: absolute; left: 0; bottom: 0; width: 100%; font-weight: normal; font-size: 1.25rem;}
.special_list dd {font-family: var(--font02);}
.special_list .total {background: url("../images/ico_special_total.svg") no-repeat center top;}
.special_list .customer {background: url("../images/ico_special_customer.svg") no-repeat center top;}
.special_list .per {background: url("../images/ico_special_per.svg") no-repeat center top;}

.main_board {display: flex; margin: 87px 0 92px;}
.main_board > * {flex: 1;}
.main_board .title {flex: 1; font-family: var(--font02); font-weight: 700; font-size: 40px;}
.new_cont {margin-right: 40px;}
.new_cont .titWrap {position: relative; display: flex; margin-bottom: 24px;}
.new_cont .titWrap::before {content: ""; position: absolute; left: -21px; top: -8px; width: 42px; height: 42px; background-color: #004098;}
.new_cont .titWrap .title {position: relative;}
.new_cont .titWrap .btn_more {display: block; margin: auto 0 auto auto; padding: 10px 0 10px 10px; font-size: 1.125rem; color: var(--sub); line-height: 28px;}
.new_cont .list {display: flex; gap: 20px; flex-wrap: wrap;}
.new_cont .list li {position: relative; width: calc(50% - 10px); padding: 40px 30px; border: 1px solid #ddd; border-radius: 21px; box-sizing: border-box;}
.new_cont .list .title_row {display: flex; margin-bottom: 16px; font-weight: bold; font-size: .9375rem; align-items: center;}
.new_cont .title_row .txtbox {margin: auto 7px auto 0;}
.cont_preview {line-height: 1.725; white-space: pre-line;}
.new_cont .list li:hover {border-color: var(--active);}
.new_cont .list li:hover .title_row {text-decoration: underline;}

.main_faq_list {margin-top: 24px; font-weight: 500; font-size: 1.125rem; line-height: 1.25;}
.main_faq_list li {margin-top: 10px; border: 1px solid #ddd; border-radius: 10px; overflow: hidden;}
.main_faq_list li:hover {border-color: var(--active);}
.faq_head {position: relative; padding: 14px 20px 14px 45px;}
.btn_acc_faq {position: absolute; left: 0; top: 0; width: 100%; height: 100%; text-indent: -999em;}
.btn_acc_faq::before {content: ""; position: absolute; left: 10px; top: 10px; width: 27px; height: 27px; background: url("../images/ico_main_faq_plus.svg") no-repeat left center;}
.answer {display: flex; height: 0; padding: 0 20px; opacity: 0; overflow: hidden; transition: all .3s linear;}
.answer .image {width: 100px; margin-right: 15px;}
.faq_open .faq_head {color: #fff; background-color: #0B6EC9;}
.faq_open .btn_acc_faq::before {background-image: url("../images/ico_main_faq_minus.svg");}
.faq_open .answer {height: auto; padding: 25px 20px; opacity: 1;}


/***** login *****/
.login_box {max-width: 400px; margin: 74px auto;}
.tit_login {height: 44px; margin-bottom: 80px; text-indent: -999em; background: url("../images/logo.png") no-repeat center top;}
.inp {position: relative;}
.inp input {width: 100%;}
.login_box .inp {display: block; margin-top: 16px;}
.login_check {margin: 16px 0 24px; font-size: .8125rem; color: var(--sub);}
.login_box .btn_area {margin: 24px 0;}
.login_box .btn_area button, .login_box .btn_area a {display: inline-block; width: 100%; height: 56px; margin-top: 10px; box-sizing: border-box;}

.btn_find {display: block; height: auto; margin-top: 11px; padding: 5px 0; font-weight: 500; font-size: .875rem; color: var(--active); text-decoration: underline;}
.btn_sns_kakao {width: 100%; height: 56px; padding: 10px; font-weight: bold; font-size: 1.125rem; color: #111; line-height: 36px; text-align: center; background: #FFE500 url("../images/ico_kakao.png") no-repeat 48px center; border-radius: 8px;}
.btn_sns_naver {width: 100%; height: 56px; padding: 10px; font-weight: bold; font-size: 1.125rem; color: #fff; line-height: 36px; text-align: center; background: #03C75A url("../images/ico_naver.svg") no-repeat 48px center; border-radius: 8px;}

/***** button *****/
.btn01 {height: 56px; padding: 10px; font-weight: bold; font-size: 1.125rem; color: #F7F7F7; background-color: var(--sub); border-radius: 8px;}
a.btn01 {display: inline-block; line-height: 36px; text-align: center;}
.btn01:hover {background-color: #131313;}
.btn01:disabled {color: #D1D1D1; background-color: #F7F7F7; opacity: 1;}

.btn02 {height: 56px; padding: 10px; font-weight: bold; font-size: 1.125rem; color: var(--sub); background-color: #fff; border: 1px solid #D1D1D1; border-radius: 8px;}
a.btn02 {display: inline-block; line-height: 34px; text-align: center;}
.btn02:hover {color: var(--active); border-color: var(--active);}
.btn02:disabled {color: #D1D1D1; border-color: #eee; opacity: 1;}


.btn_detail {position: absolute; left:0; top:0; width:100%; height:100%; text-indent: -999em;}


/***** tab AS-IS
.tab01 {margin-bottom: 40px; border-bottom: 1px solid #eee;}
.tab01 ul {display: flex; max-width: 1300px; margin: 0 auto; padding: 0 50px; box-sizing: border-box;}
.tab01 ul li:first-child {margin-left: -24px;}
.tab01 a {display: flex; width: 100%; min-height: 54px; padding: 10px 24px; font-weight: bold; color: var(--sub); align-items: center;}
.tab01 a:hover {color: var(--normal);}
.tab01 .on a {color: var(--blue);}
****/
.tab01 {position: -webkit-sticky; position: sticky; top: 84px; margin-bottom: 40px; background: #f7f7f7; z-index: 10;}
.tab01 ul {display: flex; max-width: 1300px; margin: 0 auto; padding: 0 50px; justify-content: center; box-sizing: border-box;}
.tab01 li {min-width: 240px;}
.tab01 a {position: relative; display: flex; width: 100%; min-height: 72px; padding: 10px 24px; font-weight: bold; font-size: 1.125rem; color: var(--light); align-items: center; justify-content: center;}
.tab01 a:hover {color: var(--normal);}
.tab01 .on a {color: var(--blue);}
.tab01 .on a::after {content: ""; position: absolute; left: 0; top: 100%; right: 0; height: 3px; margin-top: -1px; background-color: var(--blue);}


/***** title *****/
.page_title {display: flex; margin: 16px 0 16px; padding-bottom: 20px; align-items: center; border-bottom: 3px solid var(--sub);}
.tit_page {flex: 1; font-weight: bold; font-size: 1.5rem; line-height: 1.5;}
.breadcrumb {display: flex; align-items: center; font-weight: normal; font-size: .875rem; color: var(--sub); line-height: 24px; background-color: #ffffff!important; margin-bottom: 0!important;}
.breadcrumb > *:not(:first-child) {position: relative; margin-left: 20px; padding: 2px 0 0 5px;}
.breadcrumb > *:not(:first-child)::before {content: ""; position: absolute; left: -20px; top: 50%; width: 20px; height: 20px; margin-top: -9px; background: url("../images/ico_bread_arrow.svg") no-repeat center center;}
.btn_home {width: 32px; height: 24px; text-indent: -999em; background: url("../images/btn_home.svg") no-repeat center center;}

.tit01 {margin: 24px 0; font-weight: bold; font-size: 1.125rem;}
.tit01 + .c_btn {margin: 24px 0;}




/***** text *****/
.txtbox {display: inline-block; height: 24px; margin-right: 10px; padding: 0 7px; font-size: .875rem; color: #fff; line-height: 24px; background-color: #3B9DED; border-radius: 5px;}




/***** form *****/
.form_wrapper {margin-top: 24px; font-weight: 500; font-size: .8125rem;}
.form_wrapper:first-child {margin-top: 0;}
.form_wrapper dl {margin-top: 24px;}
.form_wrapper dt {margin-bottom: 8px;}
.txt_form_guide {margin-top: 8px; font-weight: normal; font-size: .75rem; color: #646464;}
.form_wrapper .c_btn {margin-top: 40px;}

.tab_check {display: flex;}
.tab_check label {flex: 1;}
.tab_check label:not(:first-child) {margin-left: -1px;}
.tab_check label input {position: absolute; width: 0; height: 0; opacity: 0;}
.tab_check .title {display: flex; height: 42px; margin: 0; padding: 5px 5px 5px 21px; align-items: center; justify-content: center; font-weight: 500; font-size: .8125rem; color: var(--sub); border: 1px solid #DBDBDB;}
.tab_check .title::after {content: ""; display: inline-block; width: 16px; height: 16px;}
.tab_check label:first-child .title {border-radius: 8px 0 0 8px;}
.tab_check label:last-child .title {border-radius: 0 8px 8px 0;}
.tab_check label input:checked + .title {position: relative; color: #107FDC; border-color: #107FDC;}
.tab_check label input:checked + .title::after {background: url("../images/ico_check.svg") no-repeat center center;}

.agree_wrap:not(:first-child) {margin-top: 32px;}
.agree_chk {display: flex; -webkit-box-align: center; align-items: center; font-weight: 500; font-size: 1.125rem;}
.agree_chk input {width: 32px; height: 32px; background-size: contain !important;}
.agree_chk input + * {margin-left: 16px !important;}
.txt_agree_chk_info {margin: 3px 0 0 48px; font-weight: normal; font-size: .875rem; color: #646464;}
.agree_terms {height: 120px; margin: 16px 0; padding: 16px 24px; font-size: .8125rem; color: #646464; line-height: 1.5; background-color: #F7F7F7; border: 1px solid #eee; border-radius: 8px; overflow: auto; white-space: pre-line;}



/***** contents *****/
.cont_box01 {margin: 16px 0; padding: 16px; font-size: .8125rem; color: #107FDC; background-color: #E2F1FC; border-radius: 8px;}
.cont_box01:first-child {margin-top: 0;}

.board_list {margin: 16px 0;}
.board_list li {position: relative; display: flex; padding: 24px 0; -webkit-box-align: center; align-items: center; font-size: .9375rem; color: var(--sub); border-bottom: 1px solid #ddd;}
.board_list .reg_info {min-width: 100px; margin-right: 24px; font-weight: bold; color: #ACACAC; text-align: center;}
.board_list .no {display: block; font-size: 40px;}
.board_list .cont {flex: 1; min-width: 0;}
.board_list .tit {margin-bottom: 8px; font-weight: bold; font-size: 1.25rem; color: #333;}
.board_list .text_preview {text-overflow: ellipsis; white-space: nowrap; overflow: hidden;}
.board_list li:hover {border-color: #003F98;}
.board_list li:hover .reg_info {color: #003F98;}

.board_pagination {display: flex; margin: 40px 0; justify-content: center;}
.board_pagination > button {width: 40px; height: 40px; margin: 0 4px; text-indent: -999em; border: 1px solid #D1D1D1;}
.board_pagination ol {display: flex;}
.board_pagination li {margin: 0 4px;}
.board_pagination ol button {min-width: 40px; height: 40px; padding-top: 3px; font-size: 1rem; color: #646464; border-bottom: 3px solid rgba(0,0,0,0);}
.board_pagination .cur button {color: #003F98; border-color: #003F98;}
.board_pagination button:hover {background-color: #F7F7F7;}
.board_pagination button:disabled {pointer-events: none;}
.btn_page_first {background: url("../images/btn_page_first.svg") no-repeat center center;}
.btn_page_prev {background: url("../images/btn_page_prev.svg") no-repeat center center;}
.btn_page_next {background: url("../images/btn_page_next.svg") no-repeat center center;}
.btn_page_end {background: url("../images/btn_page_end.svg") no-repeat center center;}

.board_detail_info {margin-top: 40px; padding-bottom: 24px; border-bottom: 1px solid #ccc;}
.board_detail_info .tit {margin-bottom: 10px; font-size: 1.25rem;}
.board_detail {padding: 30px 0; line-height: 1.5; border-bottom: 1px solid #ccc; white-space: pre-line;}

/***** popup *****/
.modalWrap {position:fixed; left:0; top:0; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: flex; width:100%; height:100%; padding: 50px; -webkit-box-align: center; -moz-box-align: center; -ms-flex-align: center; align-items: center; background:rgba(0,0,0,.7); z-index:1000;}
.dialog_box {position: relative; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-flex-direction: column; flex-direction: column; min-width: 360px; max-width: 650px; max-height: 90%; margin: 0 auto; background:#fff; border-radius: 20px; overflow: hidden; z-index:1000;}
.dialog_box .pop_header {position: relative; padding: 15px 20px; font-weight:900; color: #fff; text-align:center; background-color: #366CE8; z-index: 20;}
.pop_header h1 {line-height: 20px;}
.btn_pop_close {position:absolute; right:0; top:0; width:44px; height:100%; text-indent:-999em; background:url("../images/btn_pop_close.svg") no-repeat center center;}
.dialog_box .pop_cont {-webkit-flex:1; flex:1; width:100%; height:100%; padding: 20px 30px; overflow:auto;}
.pop_cont .c_btn {padding:0 15px;}
.pop_cont:first-child {padding-top:20px;}
.pop_cont:last-child {padding-bottom:20px;}
.pop_cont .c_btn button:only-child {min-width: 160px;}
.pop_btn {display:-webkit-box; display:flex; padding: 0 30px 20px; -webkit-justify-content: center; justify-content: center;}
.pop_btn button {min-width: 120px;}
.pop_btn button + button {margin-left:10px;}

