@charset "utf-8";

@font-face {
  font-family:'NotoSansKR';
  font-style:normal;
  font-weight:100;
  src:url('./fonts/NotoSans-Thin.woff2') format('woff2');
}
@font-face {
  font-family:'NotoSansKR';
  font-style:normal;
  font-weight:200;
  src:url('./fonts/NotoSans-Thin.woff2') format('woff2');
}
@font-face {
  font-family:'NotoSansKR';
  font-style:normal;
  font-weight:300;
  src:url('./fonts/NotoSans-Light.woff2') format('woff2');
}
@font-face {
  font-family:'NotoSansKR';
  font-style:normal;
  font-weight:400;
  src:url('./fonts/NotoSans-Regular.woff2') format('woff2');
}
@font-face {
  font-family:'NotoSansKR';
  font-style:normal;
  font-weight:500;
  src:url('./fonts/NotoSans-Medium.woff2') format('woff2');
}
@font-face {
  font-family:'NotoSansKR';
  font-style:normal;
  font-weight:600;
  src:url('./fonts/NotoSans-Bold.woff2') format('woff2');
}

@font-face {
  font-family:'Roboto';
  font-style:normal;
  font-weight:100;
  src:url('./fonts/Roboto-100.woff2') format('woff2');
}
@font-face {
  font-family:'Roboto';
  font-style:normal;
  font-weight:200;
  src:url('./fonts/Roboto-200.woff2') format('woff2');
}
@font-face {
  font-family:'Roboto';
  font-style:normal;
  font-weight:300;
  src:url('./fonts/Roboto-300.woff2') format('woff2');
}
@font-face {
  font-family:'Roboto';
  font-style:normal;
  font-weight:400;
  src:url('./fonts/Roboto-400.woff2') format('woff2');
}
@font-face {
  font-family:'Roboto';
  font-style:normal;
  font-weight:500;
  src:url('./fonts/Roboto-400.woff2') format('woff2');
}
@font-face {
  font-family:'Roboto';
  font-style:normal;
  font-weight:600;
  src:url('./fonts/Roboto-500.woff2') format('woff2');
}

* {box-sizing:border-box;}

body,p,h1,h2,h3,h4,h5,h6,ul,ol,li,dl,dt,dd,table,th,td,form,fieldset,legend,input,textarea,button,select{margin:0;padding:0}
body {font-family:'NotoSansKR', 'Roboto', sans-serif; font-size:12px; color:#313131;margin:0;padding:0;overflow-x:hidden;}
input,textarea,select,button,table{font-size:12px;font-weight:300;}
dt,dd {line-height:160%;font-weight:normal;text-align:left}
th,td {font-weight:normal;text-align:left}
td div{line-height:normal; border:0}
td input, td img{vertical-align:middle}
img,fieldset{border:none}
img{vertical-align:top}
ul,ol{list-style:none}
em,address{font-style:normal}
a {color:#3c3c3c;text-decoration:none}
a:hover,a:active,a:focus{color:#3c3c3c}
label input{margin-right:3px;margin-top:-3px;vertical-align:middle}
button {border:0px; cursor:pointer}

.wrap {margin:0;min-width:1380px;}

/* header */
.header {width:100%;position:relative;z-index:888;}
.header .logo {position:absolute;top:0;left:80px;width:180px;height:120px;background:url(../images/common/logo.svg) no-repeat left center;background-size:150px auto;cursor:pointer;z-index:9;transition:all .2s;}
.header .nav {transition:all 0.3s ease;position:relative;margin:0 auto;display:flex;align-items:center;background:#ffffff;height:120px;padding-left:70px;}
.header .nav .nav_list {display:inline-block;margin:0 auto;}
.header .nav .nav_list > .nav_item {display:inline-block;height:120px;line-height:120px;padding-right:100px;position:relative;}
.header .nav .nav_list .nav_item .nav_item_link {position:relative;font-size:18px;font-weight:500;color:#222;transition:all .2s ease-in-out;}
.header .nav .nav_list .nav_item .nav_item_link::after {content:'';width:0;height:2px;position:absolute;left:50%;bottom:-48px;background:#4C5AD8;transition:all .2s ease-in-out;}
.header .nav .nav_list .nav_item:hover .nav_item_link {color:#4C5AD8;}
.header .nav .nav_list .nav_item:hover .nav_item_link::after{width:100%;left:0;}
/*.header .nav .nav_list .nav_item.active .nav_item_link::after{width:100%;left:0;}*/
.header .nav .nav_list .nav_item.active .nav_item_link {color:#4C5AD8;}

.header .navsub_bg {width:100%;height:0;position:absolute;top:120px;left:0;z-index:300;background-color:#ffffff;border-top:1px solid rgba(0,0,0,0.1);transition:all .1s ease-in-out;opacity:0;}
.header .navsub_bg:before {position:absolute;content:'';bottom:-1px;left:0;right:0;width:100%;height:1px;background-color:rgba(0,0,0,0.1);}
.header .navsub_bg.on {opacity:1;height:280px;}
.header .nav .navsub {display:none;position:absolute;top:160px;left:0;z-index:400;transition:.3;}
.header .nav .navsub.on {display:block;}
.header .nav .navsub .navsub_item {margin-bottom:22px;line-height:1;text-align:left;}
.header .nav .navsub .navsub_item_link {font-size:14px;color:#313131;transition:all .3s ease-in-out;padding:4px 4px 4px 0;}
.header .nav .navsub .navsub_item_link:hover {color:#4C5AD8;}

.header .fnc_menu {position:absolute;top:0;right:60px;display:flex;flex:1none;justify-content:flex-end;align-items:center;height:100%;}
.header .fnc_menu ul {display:flex;flex:none;height:100%;}
.header .fnc_menu ul li {position:relative;display:flex;flex:none;width:40px;height:100%;cursor:pointer;opacity:.8;}
.header .fnc_menu ul li:hover {opacity:1;}
.header .fnc_menu ul li.fnc_user {background:url(../images/common/ico_user.svg) no-repeat center center;}
.header .fnc_menu ul li.fnc_user:hover > .fnc_user_detail {visibility:visible;z-index:99;}
.header .fnc_menu ul li.fnc_user .fnc_user_detail {position:relative;visibility:hidden;display:flex;justify-content:center;align-items:center;flex-direction:column;position:absolute;top:100%;right:0;width:150px;margin-top:-1px;padding:20px;border:1px solid #bdbdbd;background:#ffffff;cursor:default}
.header .fnc_menu ul li.fnc_user .fnc_user_detail:after{content:'';position:absolute;bottom:100%;right:14px;width:0;height:0;border-bottom:5px solid #ffffff;border-right:5px solid transparent;border-left:5px solid transparent}
.header .fnc_menu ul li.fnc_user .fnc_user_detail:before{content:'';position:absolute;bottom:100%;right:13px;width:0;height:0;border-bottom:6px solid rgba(0,0,0,0.6);border-right:6px solid transparent;border-left:6px solid transparent}
.header .fnc_menu ul li.fnc_user .fnc_user_detail span {display:flex;font-size:14px;font-weight:400;}
.header .fnc_menu ul li.fnc_user .fnc_user_detail span + a {margin-top:20px;}
.header .fnc_menu ul li.fnc_user .fnc_user_detail a {flex:1;width:100%;text-align:center;}
.header .fnc_menu ul li.fnc_user .fnc_user_detail a + a {margin-top:6px;}

.header.nav_sticky {position:fixed;left:0;top:0;right:0;}
.header.nav_sticky:before {position:absolute;content:'';width:100%;height:1px;left:0;bottom:-1px;right:0;background:rgba(0,0,0,0.1);}
.header.nav_sticky .nav .nav_list .nav_item .nav_item_link::after {bottom:-18px;}
.header.nav_sticky .nav {height:60px;}
.header.nav_sticky .logo {height:60px;background-size:100px auto;}
.header.nav_sticky .navsub_bg {top:60px;}
.header.nav_sticky .nav .navsub {top:130px;}

.title_wrap {margin:0;justify-content:center;align-items:center;flex-direction:column;}
.title_wrap h3 {display:flex;flex:1;width:100%;align-items:center;justify-content:center;font-size:54px;font-weight:400;color:#fff;}
.sub_bg01 {display:flex;flex:1;height:300px;background:#0b1229 url(../images/common/sub_bg01.png) no-repeat center top;}
.sub_bg02 {display:flex;flex:1;height:300px;background:#0b1229 url(../images/common/sub_bg02.png) no-repeat center top;}
.sub_bg03 {display:flex;flex:1;height:300px;background:#0b1229 url(../images/common/sub_bg03.png) no-repeat center top;}
.sub_bg04 {display:flex;flex:1;height:300px;background:#0b1229 url(../images/common/sub_bg04.png) no-repeat center top;}
.sub_bg05 {display:flex;flex:1;height:300px;background:#0b1229 url(../images/common/sub_bg05.png) no-repeat center top;}

.contents_wrap {margin:0 auto;width:1360px;padding:60px 0;}
.contents_wrap h4 {display:flex;flex:none;width:100%;font-size:34px;font-weight:400;}
.contents_wrap h5 {display:flex;flex:none;width:100%;font-size:24px;font-weight:400;}
.contents_wrap h4 + .com_text {margin-top:30px;}
.contents_wrap .com_text + h5 {margin-top:30px;}
.contents_wrap h4 + h5 {margin-top:30px;}
.contents_wrap h5 + .com_text {margin-top:20px;}
.contents_wrap .com_text {display:flex;flex:none;width:100%;flex-direction:column;}
.contents_wrap .com_text p {font-size:14px;font-weight:400;}
.contents_wrap .com_text p + p {margin-top:10px;}
.contents_wrap .com_text + .img_wrap {margin-top:40px;}
.contents_wrap .img_wrap {margin:0;text-align:center;}
.contents_wrap .img_wrap img {width:100%;}
.contents_wrap .img_wrap.w_auto img {width:auto;}
.contents_wrap .button_wrap {margin-top:40px;display:flex;width:100%;justify-content:center;}
.contents_wrap .button_wrap_b {margin:120px 0 90px 0;display:flex;width:100%;justify-content:center;}

.btn {display:inline-flex;flex:none;padding:0 60px;height:60px;border-radius:10px;font-size:18px;font-weight:400;align-items:center;transition:all .2s;}
.secondary {border:1px solid #4C5AD8;color:#4C5AD8;background-color:#F9F9FF;}
.secondary:hover {border:1px solid #3b47bb;color:#3b47bb;background-color:#fff;}
.ico_tap {background:#F9F9FF url(../images/common/ico_tap.png) center top 30px no-repeat;padding:120px 120px 40px 120px;}
.primary {background-color:#4C5AD8;color:#fff}
.primary {background-color:#404ec5;}

.ui_tabs {display:flex;width:100%;height:60px;justify-content:center;align-items:center;flex-direction:column;background:rgba(0,0,0,0.4)}
.ui_tabs ul {position:relative;display:inline-flex;height:100%;margin:0 auto;justify-content:center;align-items:center;}
.ui_tabs ul li {position:relative;display:flex;flex:none;height:100%;justify-content:center;align-items:center;font-size:16px;font-weight:400;color:#ffffff;cursor:pointer;padding:0 40px;}
.ui_tabs ul li:before {position:absolute;left:0;content:'';width:1px;height:100%;background:rgba(255,255,255,0.2)}
.ui_tabs ul li:last-child:after {position:absolute;right:0;content:'';width:1px;height:100%;background:rgba(255,255,255,0.2)}
.ui_tabs ul li:hover {background:rgba(255,255,255,0.9);color:#313131}
.ui_tabs ul li.active {background:#ffffff;color:#313131}

/* login_wrap */
.login_wrap {display:flex;justify-content:center;align-items:center;margin-top:60px;}
.login_container {display:flex;justify-content:flex-start;align-items:center;flex-direction:column;width:400px;}
.login_container .login_form {display:flex;flex:none;justify-content:flex-start;align-items:center;flex-direction:column;width:100%;margin-top:20px;}
.login_container .login_form input {width:100%;height:56px;border:none;border-radius:4px;font-size:16px;font-weight:400;padding-left:60px;transition-duration:.4s;border:1px solid rgba(0,0,0,0.1)}
.login_container .login_form input[type="text"] {background:#fff url(../images/common/ico_id.svg) no-repeat left 10px center}
.login_container .login_form input[type="password"] {background:#fff url(../images/common/ico_pass.svg) no-repeat left 10px center}
.login_container .login_form input + input {margin-top:10px;}
.login_container .login_form input[type="text"]:active, .login_container .login_form input[type="text"]:focus, .login_container .login_form input[type="password"]:active, .login_container .login_form input[type="password"]:focus {border-color:#4C5AD8}
.login_container .btn_login {display:flex;flex:none;justify-content:center;align-items:center;flex-direction:column;width:100%;margin-top:20px;height:56px;background:#4C5AD8;border-radius:4px;font-size:20px;font-weight:400;color:#fff;transition-duration:.2s;}
.login_container .btn_login:hover {background:#404cb9;box-shadow:0 0 16px #4C5AD8}
.login_container .btn_member {display:flex;flex:none;justify-content:center;align-items:center;flex-direction:column;width:100%;margin-top:10px;height:56px;background:#00BCC1;border-radius:4px;font-size:20px;font-weight:400;color:#fff;transition-duration:.2s;}
.login_container .btn_member:hover {background:#009ea3;box-shadow:0 0 16px #00BCC1}
.login_container .login_keep_wrap {display:flex;flex:none;justify-content:flex-start;align-items:flex-start;width:100%;margin-top:20px;}
.login_container .login_keep_wrap .find_wrap {display:flex;flex:1;justify-content:flex-end;align-items:flex-start;}
.login_container .login_keep_wrap .find_wrap a {position:relative;font-size:13px;font-weight:300;color:#000;transition-duration:.3s;}
.login_container .login_keep_wrap .find_wrap a:hover {color:#4C5AD8;}
.login_container .login_keep_wrap .find_wrap a + a {margin-left:20px;}
.login_container .login_keep_wrap .find_wrap a + a:before {position:absolute;content:'';top:3px;left:-10px;width:1px;height:14px;background:rgba(0,0,0,0.2);}

/*  swich */
.switch_input {display:flex;justify-content:flex-start;align-items:center;height:20px;}
.switch_input input {display:none;}
.switch_input label {position:relative;display:flex;justify-content:flex-start;align-items:flex-start;cursor:pointer;white-space:nowrap;transition-duration:.3s;}
.switch_input label:before, .switch_input label:after {content:"";position:absolute;margin:0;outline:0;top:50%;-ms-transform:translate(0, -50%);-webkit-transform:translate(0, -50%);transform:translate(0, -50%);-webkit-transition:all 0.3s ease;transition:all 0.3s ease;}
.switch_input label:before {left:0px;width:40px;height:20px;background-color:rgba(0,0,0,0.6);border-radius:20px;}
.switch_input label:after {left:2px;width:16px;height:16px;background-color:#fff;border-radius:50%;}
.switch_input label span {display:flex;justify-content:flex-start;align-items:flex-start;margin-left:50px;color:#000000;font-size:13px;font-weight:300;line-height:0;transition-duration:.2s;}
.switch_input label:hover span {color:#00BCC1!important;}
.switch_input input:checked + label:before {background-color:#00BCC1;}
.switch_input input:checked + label:after {background-color:#fff;-ms-transform:translate(126%, -50%);-webkit-transform:translate(126%, -50%);transform:translate(126%, -50%);}
.switch_input input:checked + label span {color:#00BCC1!important;}

/* footer */
footer {margin-top:80px;background:#FAFAFA;border-top:1px solid rgba(0,0,0,0.1);padding:40px 80px;display:flex;justify-content:flex-start;align-items:flex-start;}
footer p {display:flex;flex:none;justify-content:flex-start;align-items:flex-start;flex-direction:column;padding-left:140px;background:url(../images/common/logo.svg) no-repeat left center;background-size:100px auto;}
footer p + p {display:flex;flex:1;justify-content:flex-end;align-items:flex-start;flex-direction:row;padding-left:0;background:none;}
footer p span {position:relative;display:flex;flex:none;justify-content:flex-start;align-items:flex-start;font:300 13px 'Roboto'}
footer p + p span:hover {cursor:pointer;color:#4C5AD8}
footer p:nth-child(1) span {font:400 12px 'Roboto'}
footer p:nth-child(1) span + span {margin-top:6px;font:400 12px 'Roboto'}
footer p:nth-child(2) span {font:400 12px 'Roboto'}
footer p:nth-child(2) span + span {font:400 12px 'Roboto';padding-left:20px;}
footer p:nth-child(2) span + span:before {position:absolute;content:'';top:2px;left:10px;width:1px;height:12px;background-color:rgba(0,0,0,0.2);}


.go_top {position:fixed;background:url(../images/common/ico_top.svg) no-repeat center center;bottom:0;right:0;width:60px;height:60px;text-decoration:none;color:rgba(0,0,0,0);background-color:rgba(0, 0, 0, 0.5);font:400 14px 'Roboto';padding:1em;display:none;z-index:999999;}
.go_top:hover {background-color:rgba(0, 0, 0, 0.8);color:rgba(0,0,0,0);}





/* layer_box */
.layer_box{display:none;position:fixed;top:0;left:0;bottom:0;right:0;background:rgba(0,0,0,0.8);z-index:70}
.layer_box .layer_outer{display:table;width:600px;height:100%;box-sizing:border-box;margin: 0 auto}
.layer_box .layer_outer .layer_inner{display:table-cell;vertical-align:middle}
.layer_box .layer_outer .layer_inner .layer_con{height:auto;background:#fff;position: relative;}  /* padding:90px 20px 0; */
.layer_box .layer_con .layer_top{top:0;left:0;right:0;border-bottom:1px solid #ddd;z-index:100;position:absolute;} /* position:fixed; */
.layer_box .layer_con .layer_top h3{height:100px;line-height:100px;font-size:25px;color:#111;text-align:center} /* font-weight:500; */
.layer_box .layer_con .layer_top .layer_close{position:absolute;top:0;left:0;width:100px;height:100px;background:url(/front/images/default/mb_ico_back.png) center center no-repeat;background-size:36px;text-indent:-9999px;overflow:hidden}
.layer_box .layer_con p.check_img{padding-top:80px;background:url(/front/images/default/ico_check.png) center top no-repeat;background-size:50px;text-align:center}
.layer_box .layer_con p.check_img .big{display:block;margin-bottom:20px;font-size:25px;color:#111}
/* layer_box - login_layer */
.login_layer .layer_outer .layer_con{overflow:hidden;box-sizing:border-box}
.login_layer .layer_outer .layer_con .form_box{border-top:0;padding:0}
.login_layer .layer_outer .layer_con .form_box dt{display:none}
.login_layer .layer_outer .layer_con .form_box dd{width:100%;margin-top:10px}
.login_layer .layer_outer .layer_con .form_box dd:nth-of-type(1){margin-top:0}
.login_layer .layer_outer .layer_con .design_input{display:block;margin-top:20px}
.login_layer .layer_outer .layer_con .btn_area{margin-top:0}
.login_layer .layer_outer .layer_con .btn_area .btn_txt{margin-top:20px}
.login_layer .layer_outer .layer_con .find_link{margin-top:30px;text-align:center}
.login_layer .layer_outer .layer_con .find_link li{position:relative;display:inline-block;margin-right:16px;padding-right:20px;font-size:14px}
.login_layer .layer_outer .layer_con .find_link li:first-child:after{content:"";position:absolute;top:0;right:0;width:1px;height:20px;background:#ddd}
.login_layer .layer_outer .layer_con .find_link li:last-child{margin:0;padding:0}
/* layer_box - call_layer_template */
.call_layer_template .layer_outer .layer_con .scroll_y{margin:0 15px;max-height:40vh;overflow-y:auto}