@charset "utf-8";
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@400;500;700&display=swap');

* {margin: 0; padding: 0; letter-spacing: 0;font-family: 'Pretendard','Inter', sans-serif; -webkit-box-sizing: border-box; box-sizing: border-box; -webkit-print-color-adjust: exact !important; print-color-adjust: exact; word-break: keep-all; word-wrap: break-word; overflow-wrap:break-word;/* page-break-after: avoid; page-break-before: avoid; page-break-inside: avoid; break-inside: avoid-page; break-before: avoid-page; break-after: avoid-page; */}
html {width: 100%; height: 100%;}
body {position: relative; font-family: 'Pretendard','Inter', sans-serif; font-weight: 300; font-size: 18px; color: #222; line-height: 1.5; height: 100%; -webkit-text-size-adjust: 100%; -moz-text-size-adjust: 100%; -ms-text-size-adjust: 100%; -webkit-overflow-scrolling: touch; -webkit-print-color-adjust: exact !important;}
body, div, h1, h2, h3, h4, h5, h6, ul, ol, li, dl, dt, dd, p, form, fieldset, table, tr, th, td {margin: 0; padding: 0; font-weight: 300;}
ul, ol, li {list-style: none;}
img, fieldset {border: none; vertical-align: top;}
legend, caption {visibility: hidden; overflow: hidden; width: 0; height: 0; font-size: 0; line-height: 0;}
textarea, button {vertical-align: middle;}
input, select {font-family: 'Pretendard','Inter', sans-serif; vertical-align: top;}
input {padding: 3px 20px; height: 50px;}
input[type="text"]::-ms-clear {display:none;}
input:focus, input:active {outline: none;}
.attach_area .file_div input[readonly] {pointer-events: none;}
option {padding: 3px 10px;}
option:focus, option:active {outline: none;}
input[type="radio"], input[type="checkbox"] {border: 0; padding: 0; height: auto; -webkit-box-shadow: none; box-shadow: none;}
input[type="password"] {height: 40px; border: 1px solid #e5e5e5; color: #888; background: #fff; -webkit-appearance: none; -webkit-box-shadow: none; box-shadow: none;}
input[type="password"]::-webkit-input-placeholder {color: #8a8a8a;}
input[type="password"]:-ms-input-placeholder {color: #8a8a8a;}
input[type="password"]::-ms-input-placeholder {color: #8a8a8a;}
input[type="password"]::placeholder {color: #8a8a8a;}
input[type="password"]:disabled {color: #999; background-color: #f3f3f3;}
input[type="password"].readonly {color: #999; background-color: #f3f3f3;}
input[type="password"][readonly=readonly] {color: #999; background-color: #f3f3f3;}
input[type="text"] {background: #fff; -webkit-appearance: none; -webkit-box-shadow: none; box-shadow: none;}
input[type="text"]::-webkit-input-placeholder {color: #8a8a8a;}
input[type="text"]:-ms-input-placeholder {color: #8a8a8a;}
input[type="text"]::-ms-input-placeholder {color: #8a8a8a;}
input[type="text"]::placeholder {color: #8a8a8a;}
input[type="text"]:disabled {color: #999; background-color: #e9e9e9;}
input[type="text"]:-moz-read-only {color: #999; background-color: #e9e9e9;}
input[type="text"]:read-only {color: #999; background-color: #e9e9e9; border:1px solid #e9e9e9;}
input[type="text"].readonly {color: #999; background-color: #e9e9e9;}
input[type="text"]:disabled + .cal_btn {opacity: .5;}
input[type="tel"] {background: #fff; -webkit-appearance: none; -webkit-box-shadow: none; box-shadow: none;}
input[type="tel"]::-webkit-input-placeholder {color: #8a8a8a;}
input[type="tel"]:-ms-input-placeholder {color: #8a8a8a;}
input[type="tel"]::-ms-input-placeholder {color: #8a8a8a;}
input[type="tel"]::placeholder {color: #8a8a8a;}
input[type="tel"]:disabled {color: #999; background-color: #f3f3f3;}
input[type="tel"]:-moz-read-only {color: #999; background-color: #f3f3f3;}
input[type="tel"]:read-only {color: #999; background-color: #f3f3f3;}
input[type="tel"].readonly {color: #999; background-color: #f3f3f3;}
input[type="tel"]:disabled + .cal_btn {opacity: .5;}
input[type="number"]::-webkit-input-placeholder {color: #8a8a8a;}
input[type="number"]:-ms-input-placeholder {color: #8a8a8a;}
input[type="number"]::-ms-input-placeholder {color: #8a8a8a;}
input[type="number"]::placeholder {color: #8a8a8a;}
input[type="number"]:disabled {color: #999; background-color: #f3f3f3;}
input[type="number"]:-moz-read-only {color: #999; background-color: #f3f3f3;}
input[type="number"]:read-only {color: #999; background-color: #f3f3f3;}
input[type="number"].readonly {color: #999; background-color: #f3f3f3;}
select {font-size: 18px; color: #888; appearance: none; -webkit-appearance: none; -moz-appearance: none; -o-appearance: none; vertical-align: top;}
select::-ms-expand {display: none;}
select:focus, select:active {outline: none;}
select:disabled {color: #999; background-color: #e9e9e9; opacity: 1;}
textarea {padding: 10px 20px;  font-size: 18px; color: #222; -webkit-appearance: none; -webkit-box-shadow: none; box-shadow: none; border-radius: 0; vertical-align: top; background: #fff; border: 1px solid #e5e5e5; resize: none;}
textarea:focus, textarea:active {outline: none;}
textarea::-webkit-input-placeholder {color: #8a8a8a;}
textarea:-ms-input-placeholder {color: #8a8a8a;}
textarea::-ms-input-placeholder {color: #8a8a8a;}
textarea::placeholder {color: #8a8a8a;}
textarea:disabled {color: #999; background-color: #f3f3f3;}
textarea:-moz-read-only {color: #999; background-color: #f3f3f3;}
textarea:read-only {color: #999; background-color: #f3f3f3;}
a {text-decoration: none; color: #222;}
a:hover, a:focus, a:active {text-decoration: none;}
table {width: 100%; border-collapse: collapse;}
button {background: none; border: none; padding: 0; margin: 0;   font-size: 18px; cursor: pointer; overflow: visible; white-space: nowrap;}
/* button:focus, button:active { outline: none; } */
button::-moz-focus-inner {padding: 0; border: 0;}
article, aside, details, figcaption, figure, footer, header, hgroup, main, nav, section, summary {display: block;}
::selection {color: #fff; background-color: #0078C3 ;}

body.stop_scroll {overflow: hidden; height:100%; min-height:100%; touch-action: none;}
#main {overflow: hidden; position: relative; z-index:2; background:#fff; width: 100%;} 
.inner{position: relative; margin:0 auto; width:calc(100% - 100px); max-width:1800px;}
b{font-weight:800}
 


/* ------------------------------------------------------------------- 기타 공통 - Start ------------------------------------------------------------------- */ 
 






/* ------------------------------------------------------------------- 레이어팝업 - Start ------------------------------------------------------------------- */ 
.layer_popup input,
.layer_popup textarea{ font-size:15px;} 
.layer_popup{display:none; position:fixed; left:0; top:0; width:100%; height:100%; background:rgba(0,0,0,0.7); z-index:200;}
.layer_popup .pop_wrap{position:absolute; top:50%; left:50%; width:90%; max-width:1500px; height:100%; max-height:680px; background:#fff;   transform:translate(-50%,-50%); padding:60px 80px;} 
.layer_popup .pop_wrap .pop_head{border-bottom:1px solid #eee; padding-bottom:20px; margin-bottom:30px; }
.layer_popup .pop_wrap .pop_head h3{font-size:40px; font-weight:800; margin-bottom:10px;}
.layer_popup .pop_wrap .pop_head p{font-size:16px; color:#666;} 
.layer_popup .pop_wrap .pop_cont { overflow-y:auto;  height: calc(100% - 140px);font-size:15px;} 
.layer_popup .pop_wrap .pop_cont .pop_flex{display:flex; justify-content:space-between; }
.layer_popup .pop_wrap .pop_cont .pop_flex > div{width:49%;}
.layer_popup .pop_wrap .pop_cont .pop_flex .left{display:flex; flex-wrap:wrap; justify-content:space-between;}
.layer_popup .pop_wrap .pop_cont .pop_flex .left input{width:100%; background:#f4f4f4; border:0; padding:15px 20px; margin-bottom:10px; }
.layer_popup .pop_wrap .pop_cont .pop_flex .left input:nth-child(2),
.layer_popup .pop_wrap .pop_cont .pop_flex .left input:nth-child(3){width:49%;}
.layer_popup .pop_wrap .pop_cont .pop_flex .left textarea{width:100%; background:#f4f4f4; border:0; padding:15px 20px; border-radius:0; height:200px;}
.layer_popup .pop_wrap .pop_cont .textarea h3{font-size:16px; margin:20px 0 10px; font-weight:600;}
.layer_popup .pop_wrap .pop_cont .textarea h3:first-child{margin-top:0;}
.layer_popup .pop_wrap .pop_cont .textarea p{margin:5px 0;}
.layer_popup .pop_wrap .pop_cont .textarea ul li{text-indent:-10px; padding-left:10px; margin:5px 0;}
.layer_popup .pop_wrap .pop_cont .textarea table {margin:10px 0;}
.layer_popup .pop_wrap .pop_cont .textarea table th{border:1px solid #ddd; padding:20px; width:30%;}
.layer_popup .pop_wrap .pop_cont .textarea table td{border:1px solid #ddd; padding:20px;}
.layer_popup .pop_wrap .pop_cont .textarea a{text-decoration:underline;}
.layer_popup .pop_wrap .pop_cont .pop_flex .right .textarea{width:100%; background:#f4f4f4; border:0; padding: 30px  ; color:#111; border-radius:0; height:280px; overflow-y:auto;} 
.layer_popup .pop_wrap .pop_cont .full_textarea{height:100%; }
.layer_popup .pop_wrap .pop_cont .full_textarea .textarea{width:100%; background:#fff;  border:0; border-bottom:1px solid #ddd; padding: 0  ; color:#111; border-radius:0; height:100%; overflow-y:auto;} 
.layer_popup .checkbox{position:relative; margin-top:20px;}
.layer_popup .checkbox input[type=checkbox]{ width: 21px; cursor: pointer; height: 21px; display: block; position: absolute; top: 0; left: 0; margin: 0;z-index: 1;opacity: 0;}
.layer_popup .checkbox input[type=checkbox]+ label{position:relative; font-weight: normal;  padding:0 0 0 35px; display:block; height:21px;}
.layer_popup .checkbox input[type=checkbox]+ label:before {content: ""; display: inline-block; width:21px; height:21px; background:url('/images/main/check-off.jpg')no-repeat 50% 50%; position:absolute; top:0; left:0;}
.layer_popup .checkbox input[type=checkbox]:checked + label:before {content: ""; background:url('/images/main/check-on.jpg')no-repeat 50% 50%; width:21px; height:21px;} 
.layer_popup .pop_wrap .pop_btn{text-align:center; margin:30px 0 0;}
.layer_popup .pop_wrap .pop_btn button{font-size:16px; color:#111; border:2px solid #ddd; padding:15px 80px; border-radius:60px; display:inline-block; transition:all ease .3s;}
.layer_popup .pop_wrap .pop_btn button:hover{background:#001eff; color:#fff; border-color:#001eff;}
.layer_popup .pop_wrap .pop_close{position:absolute; top:-50px; right:0; font-size:40px;  color:#fff; cursor:pointer;} 




/* ------------------------------------------------------------------- header - Start ------------------------------------------------------------------- */
header {position: fixed; left: 0; top: 0; width: 100%; height: 80px; transition: height .2s ease, background-color .3s ease, top .3s ease; z-index: 100; background-color:#fff;}
header.trans{background:transparent;  }
header.trans nav a{color:#fff;}
header.trans .logo{filter:grayscale(1) invert(1) brightness(2);}
header .logo {position: absolute; left: 50px; top: 25px; width: 120px; height: 26px; z-index: 1;}
header .logo a {display: block; height: 100%; background: url(/images/main/logo.png) no-repeat top left / cover;}
header nav {position: relative; width: 100%; height: 100%; text-align: center; transition: left .5s ease;}
header nav.show {left: 0;}
header nav.show a{color:#111;}
header nav:before {content: ''; display: block; position: absolute; left: 0; top: 80px; width: 100%; height: 1px; background-color: #ededed; opacity: 0; /* transition: opacity .4s ease; */}
header .gnb_w {display: inline-block; height: 100%; text-align: center; float: right;     margin-right: 50px;}
header .gnb {display: flex; height: 80px; overflow: hidden; transition: height .2 ease;}
header .gnb a {display: block; font-size:16px; font-weight:600}
header .gnb > li {display: inline-block; height: 80px; position: relative; display: -webkit-box; display: -ms-flexbox; display: flex; justify-content: center; padding: 0 40px;   height: 80px; align-items: center;  color: #000; font-size: 16px; white-space: nowrap;} 
header .gnb > li:last-child{padding-right:0;}
header.hide {top: -100px;} /* hide */ 
header.drop_down {background-color: rgba(255,255,255,1);}/* drop down */
header.drop_down nav:before {opacity: 1;}
    

 



/* 반응형 */
@media screen and (max-width:1280px) { 
	.inner {width: -webkit-calc(100% - 48px); width: calc(100% - 48px);}
	header{height:62px;} 
	header .logo {left: 24px; width: 102px;height: 22px;top: 20px;}
	header nav {position: fixed; left: 100%; top: 0; width: 100%; height: 100%; background-color: #fff; z-index: 10;} 
	header nav .for_bg {position: relative; padding-top: 60px; width: 100%; height: 100%; background-color: #fff;}
	header nav .for_bg:before {content: ''; display: block; position: absolute; left: 24px;    width: 102px;height: 22px;top: 20px;background: url(/images/main/logo.png) no-repeat top left / cover;}
	header nav .inner_dimd {display: none; position: fixed; left: 0; top: 0; width: 100%; height: 100%; background-color: rgba(0,0,0,.5); z-index: -1;}
	header nav .btn_close_mo_menu {position: absolute; right: 24px; top: 20px; display: block; width: 20px; height: 20px; background: url(/images/main/btn-close-gnb-mo.svg)}
	header .gnb_w {display: block; height: calc(100vh - 120px); overflow-y: auto; float:none; margin-right:0; margin-top:100px;}
	header .gnb {display: block; height: auto;}
	header .gnb > li {min-width: unset; width: 100%; height: auto;}   
	header .gnb > li:last-child{padding-right:40px;}
	header .gnb a{font-size:24px;     padding: 15px 0;} 
	header .btn_open_mo_menu { position: absolute; right: 24px; top: 20px; width: 20px; height: 20px; background: url(/images/main/btn-open-gnb.svg) center center no-repeat}  
	header.trans .btn_open_mo_menu {filter:grayscale(1) invert(1) brightness(2);} 
	header .header_contact_area {position: relative; margin-left: 16px;}
	header .header_contact_area .btn_open_contact {position: static; display: block;} 
	.layer_popup .pop_wrap .pop_cont .textarea {font-size:13px;}
	.layer_popup .pop_wrap .pop_cont .textarea table th{padding:10px;}
	.layer_popup .pop_wrap .pop_cont .textarea table td{padding:10px;}
	.layer_popup .pop_wrap .pop_cont .textarea table{font-size:13px;}
	.layer_popup .pop_wrap .pop_cont .pop_flex .right .textarea{padding:20px;}
}