@charset "utf-8";
@import url('//fonts.googleapis.com/earlyaccess/nanumbrushscript.css');

html,body{margin:0;padding:0;word-break:keep-all;}
html,body,table,input,textarea,select,button{font-size:14px;color:#222;font-family:'KoddiUDOnGothic';font-family: 'Pretendard', sans-serif; }

img{margin:0;padding:0;border:none;vertical-align:top; max-width:100%;}

a{color: #565656;text-decoration: none;}
a:hover{text-decoration:none;}

ul{list-style:none;margin:0;padding:0;}
ol{margin:0;padding:0 0 0 20px;}
dl,dt,dd{margin:0;padding:0;}

table{border-spacing:0;border-collapse:collapse;table-layout:fixed;}
table caption{width:0;height:0;overflow:hidden;}
table,th,td{font-size:15px;color:#454545;margin:0;padding:0;line-height:1.5em;border:none;box-sizing:border-box;}

form, fieldset, legend{margin:0;padding:0;border:0;}
fieldset legend{width:0;height:0;overflow:hidden;}

input{vertical-align:middle; box-sizing:border-box;}
input[type="radio"], input[type="checkbox"]{width:14px;height:14px;border:none;padding:0;margin:0;background:none; }
select{vertical-align:middle;box-sizing:border-box;border:none;}
textarea{border:none;padding:10px;box-sizing:border-box;}
button{cursor:pointer;margin:0;padding:0;border:none;background:none;box-sizing:border-box; appearance: none; -webkit-appearance:none;}

/* input set */
input[type="text"],
input[type="password"]{height:35px;line-height:33px;text-indent:10px;}
input[type="file"]{height:35px;line-height:35px;}
input[type="submit"],
input[type="button"]{cursor:pointer;border:none; appearance: none; -webkit-appearance:none;}

input[type="text"],
input[type="password"],
select,
textarea{border:1px solid #d9d9d9;}

select{height:35px; appearance: none; -webkit-appearance:none; background:#fff url(../img/content/select_arr.png) right center / 20px auto no-repeat;padding:0 20px 0 10px;cursor:pointer;}
select::-ms-expand {display: none;}

input[type="text"]:focus,
input[type="password"]:focus,
textarea:focus,
select:focus{border-color:#0092bb;}

input[type="text"]::placeholder,
input[type="password"]::placeholder {color:#656565 !important; font-weight:300;}
input[type="text"]:-ms-input-placeholder,
input[type="password"]:-ms-input-placeholder {color:#656565 !important; font-weight:300;}

input[type="text"].place-w::placeholder,
input[type="password"].place-w::placeholder {color:#fff !important; font-weight:300;}
input[type="text"].place-w:-ms-input-placeholder,
input[type="password"].place-w:-ms-input-placeholder {color:#fff !important; font-weight:300;}

input[type="text"][readonly],
textarea[readonly]{background:#e9ecf1;}

.radio-group label{cursor:pointer; line-height:35px;}
.radio-group label + label{margin-left:20px;}
.checkbox-group label{cursor:pointer; line-height:35px;}
.checkbox-group label + label{margin-left:20px;}

@media all and (max-width:800px){

	table,th,td{font-size:14px;}

}

@media all and (max-width:600px){
	input{font-size:13px;}
	input[type="text"]{height:30px;line-height:28px;text-indent:5px;}
	input[type="password"]{height:30px;line-height:28px;text-indent:5px;}
	input[type="file"]{height:30px;}
	select{font-size:13px;height:30px;padding:0 25px 0 5px;}
	textarea{font-size:13px; padding:10px;}

	.radio-group label + label{margin-left:10px;}
	.radio-group.m-listType label{display:block;}
	.radio-group.m-listType label + label{margin:0;}
	.radio-group.m-cols2 label{display:inline-block; width:48%;}
	.radio-group.m-cols2 label + label{margin:0;}

	.checkbox-group label + label{margin-left:10px;}
	.checkbox-group.m-listType label{display:block;}
	.checkbox-group.m-listType label + label{margin:0;}
	.checkbox-group.m-cols2 label{display:inline-block; width:48%;}
	.checkbox-group.m-cols2 label + label{margin:0;}

}

h1,h2,h3,h4,h5,h6{clear:both;margin:0;padding:0;font-weight:normal;font-size:1em;}

em,small{font-style:normal;}
p{margin:0px;padding:0px;}
strong{font-weight:600;}
b{font-weight:600;}

iframe{margin:0;padding:0;border:none;}
hr{display:none;}

/* id6~ ie8 */
article, aside, details, figcaption, figure, footer, header, hgroup, main, nav, section, summary {display: block;}

/* hidden */
.hide{position:absolute;left:-9999em;top:0;}

/* float */
.fl{float:left;}
.fr{float:right;}
.clear{clear:both;}
.over_hidden{overflow:hidden;}

.inline{display:inline;}
.block{display:block;}

/* text-style */
.aleft{text-align:left !important}
.acenter{text-align:center !important}
.aright{text-align:right !important}
.vtop{vertical-align:top !important}
.vmiddle{vertical-align:middle !important}
.justify{text-align:justify}
.break{word-break:break-all;}

.underline{text-decoration:underline}
.bold{font-weight:600;}
.normal{font-weight:normal;}

.txt-orange{color:#f1543a;}
.txt-blue{color:#2e67cf;}
.txt-red{color:#bb1203;}
.txt-gold{color:#8e5b00;}
.txt-brown{color:#a02d00;}
.txt-green{color:#0092bb;}

.fsize12 {font-size:12px !important}
.fsize13 {font-size:13px !important}
.fsize14 {font-size:14px !important}
.fsize15 {font-size:15px !important}
.fsize16 {font-size:16px !important}
.fsize17 {font-size:17px !important}
.fsize18 {font-size:18px !important}
.fsize20 {font-size:20px !important}
.fsize22 {font-size:22px !important}
.fsize24 {font-size:24px !important}

/* abbr{font-family:dotum;} */

/* width */
.w10px{width:10px;} .w20px{width:20px;} .w30px{width:30px;} .w40px{width:40px;} .w50px{width:50px;} .w60px{width:60px;} .w70px{width:70px;} .w80px{width:80px;} .w90px{width:90px;} .w100px{width:100px;}
.w110px{width:110px;} .w120px{width:120px;} .w130px{width:130px;} .w140px{width:140px;} .w150px{width:150px;} .w160px{width:160px;} .w170px{width:170px;} .w180px{width:180px;} .w190px{width:190px;} .w200px{width:200px;}
.w210px{width:210px;} .w220px{width:220px;} .w230px{width:230px;} .w240px{width:240px;} .w250px{width:250px;} .w260px{width:260px;} .w270px{width:270px;} .w280px{width:280px;} .w290px{width:290px;} .w300px{width:300px;}
.w310px{width:310px;} .w320px{width:320px;} .w330px{width:330px;} .w340px{width:340px;} .w350px{width:350px;} .w360px{width:360px;} .w370px{width:370px;} .w380px{width:380px;} .w390px{width:390px;} .w400px{width:400px;}
.w410px{width:410px;} .w420px{width:420px;} .w430px{width:430px;} .w440px{width:440px;} .w450px{width:450px;} .w460px{width:460px;} .w470px{width:470px;} .w480px{width:480px;} .w490px{width:490px;} .w500px{width:500px;}

.w1{width:1%} .w2{width:2%} .w3{width:3%} .w4{width:4%} .w5{width:5%} .w6{width:6%} .w7{width:7%} .w8{width:8%} .w9{width:9%} .w10{width:10%}
.w11{width:11%} .w12{width:12%} .w13{width:13%} .w14{width:14%} .w15{width:15%} .w16{width:16%} .w17{width:17%} .w18{width:18%} .w19{width:19%} .w20{width:20%}
.w21{width:21%} .w22{width:22%} .w23{width:23%} .w24{width:24%} .w25{width:25%} .w26{width:26%} .w27{width:27%} .w28{width:28%} .w29{width:29%} .w30{width:30%}
.w31{width:31%} .w32{width:32%} .w33{width:33%} .w34{width:34%} .w35{width:35%} .w36{width:36%} .w37{width:37%} .w38{width:38%} .w39{width:39%} .w40{width:40%}
.w41{width:41%} .w42{width:42%} .w43{width:43%} .w44{width:44%} .w45{width:45%} .w46{width:46%} .w47{width:47%} .w48{width:48%} .w49{width:49%} .w50{width:50%}
.w51{width:51%} .w52{width:52%} .w53{width:53%} .w54{width:54%} .w55{width:55%} .w56{width:56%} .w57{width:57%} .w58{width:58%} .w59{width:59%} .w60{width:60%}
.w61{width:61%} .w62{width:62%} .w63{width:63%} .w64{width:64%} .w65{width:65%} .w66{width:66%} .w67{width:67%} .w68{width:68%} .w69{width:69%} .w70{width:70%}
.w71{width:71%} .w72{width:72%} .w73{width:73%} .w74{width:74%} .w75{width:75%} .w76{width:76%} .w77{width:77%} .w78{width:78%} .w79{width:79%} .w80{width:80%}
.w81{width:81%} .w82{width:82%} .w83{width:83%} .w84{width:84%} .w85{width:85%} .w86{width:86%} .w87{width:87%} .w88{width:88%}
.w89{width:89%} .w90{width:90%}
.w91{width:91%} .w92{width:92%} .w93{width:93%} .w94{width:94%} .w95{width:95%} .w96{width:96%} .w97{width:97%} .w98{width:98%} .w99{width:99%} .w100{width:100%}

/* height */
.h10px{height:10px;} .h20px{height:20px;} .h30px{height:30px;} .h40px{height:40px;} .h50px{height:50px;} .h60px{height:60px;} .h70px{height:70px;} .h80px{height:80px;} .h90px{height:90px;} .h100px{height:100px;}
.h110px{height:110px;} .h120px{height:120px;} .h130px{height:130px;} .h140px{height:140px;} .h150px{height:150px;} .h160px{height:160px;} .h170px{height:170px;} .h180px{height:180px;} .h190px{height:190px;} .h200px{height:200px;}
.h210px{height:210px;} .h220px{height:220px;} .h230px{height:230px;} .h240px{height:240px;} .h250px{height:250px;} .h260px{height:260px;} .h270px{height:270px;} .h280px{height:280px;} .h290px{height:290px;} .h300px{height:300px;}
.h310px{height:310px;} .h320px{height:320px;} .h330px{height:330px;} .h340px{height:340px;} .h350px{height:350px;} .h360px{height:360px;} .h370px{height:370px;} .h380px{height:380px;} .h390px{height:390px;} .h400px{height:400px;}
.h410px{height:410px;} .h420px{height:420px;} .h430px{height:430px;} .h440px{height:440px;} .h450px{height:450px;} .h460px{height:460px;} .h470px{height:470px;} .h480px{height:480px;} .h490px{height:490px;} .h500px{height:500px;}

@media all and (max-width:600px){

	html,body,table,input,textarea,select,button{font-size:15px;}

	.m-w1{width:1%} .m-w2{width:2%} .m-w3{width:3%} .m-w4{width:4%} .m-w5{width:5%} .m-w6{width:6%} .m-w7{width:7%} .m-w8{width:8%} .m-w9{width:9%} .m-w10{width:10%}
	.m-w11{width:11%} .m-w12{width:12%} .m-w13{width:13%} .m-w14{width:14%} .m-w15{width:15%} .m-w16{width:16%} .m-w17{width:17%} .m-w18{width:18%} .m-w19{width:19%} .m-w20{width:20%}
	.m-w21{width:21%} .m-w22{width:22%} .m-w23{width:23%} .m-w24{width:24%} .m-w25{width:25%} .m-w26{width:26%} .m-w27{width:27%} .m-w28{width:28%} .m-w29{width:29%} .m-w30{width:30%}
	.m-w31{width:31%} .m-w32{width:32%} .m-w33{width:33%} .m-w34{width:34%} .m-w35{width:35%} .m-w36{width:36%} .m-w37{width:37%} .m-w38{width:38%} .m-w39{width:39%} .m-w40{width:40%}
	.m-w41{width:41%} .m-w42{width:42%} .m-w43{width:43%} .m-w44{width:44%} .m-w45{width:45%} .m-w46{width:46%} .m-w47{width:47%} .m-w48{width:48%} .m-w49{width:49%} .m-w50{width:50%}
	.m-w51{width:51%} .m-w52{width:52%} .m-w53{width:53%} .m-w54{width:54%} .m-w55{width:55%} .m-w56{width:56%} .m-w57{width:57%} .m-w58{width:58%} .m-w59{width:59%} .m-w60{width:60%}
	.m-w61{width:61%} .m-w62{width:62%} .m-w63{width:63%} .m-w64{width:64%} .m-w65{width:65%} .m-w66{width:66%} .m-w67{width:67%} .m-w68{width:68%} .m-w69{width:69%} .m-w70{width:70%}
	.m-w71{width:71%} .m-w72{width:72%} .m-w73{width:73%} .m-w74{width:74%} .m-w75{width:75%} .m-w76{width:76%} .m-w77{width:77%} .m-w78{width:78%} .m-w79{width:79%} .m-w80{width:80%}
	.m-w81{width:81%} .m-w82{width:82%} .m-w83{width:83%} .m-w84{width:84%} .m-w85{width:85%} .m-w86{width:86%} .m-w87{width:87%} .m-w88{width:88%} .m-w89{width:89%} .m-w90{width:90%}
	.m-w91{width:91%} .m-w92{width:92%} .m-w93{width:93%} .m-w94{width:94%} .m-w95{width:95%} .m-w96{width:96%} .m-w97{width:97%} .m-w98{width:98%} .m-w99{width:99%} .m-w100{width:100%}

	.m-h100px{height:100px;} .m-h120px{height:120px;} .m-h150px{height:150px;} .m-h170px{height:170px;} .m-h200px{height:200px;}

	.m-w600px{width:600px  !important;}
}

@media all and (max-width:800px){
	.m-w800px{width:800px !important;}
}

/* margin, padding */
.pdt5{padding-top:5px !important}
.pdt10{padding-top:10px !important}
.pdt15{padding-top:15px !important}
.pdt20{padding-top:20px !important}
.pdt25{padding-top:25px !important}
.pdt30{padding-top:30px !important}

.pdb5{padding-bottom:5px !important}
.pdb10{padding-bottom:10px !important}
.pdb15{padding-bottom:15px !important}
.pdb20{padding-bottom:15px !important}
.pdb25{padding-bottom:25px !important}
.pdb30{padding-bottom:30px !important}

.pdl5{padding-left:5px !important}
.pdl10{padding-left:10px !important}
.pdl15{padding-left:15px !important}
.pdl20{padding-left:20px !important}
.pdl25{padding-left:25px !important}
.pdl30{padding-left:30px !important}

.pdr10{padding-right:10px !important}
.pdr15{padding-right:15px !important}
.pdr20{padding-right:20px !important}
.pdr25{padding-right:25px !important}
.pdr30{padding-right:30px !important}

.mgl5{margin-left:5px !important}
.mgl10{margin-left:10px !important}
.mgl13{margin-left:13px !important}
.mgl15{margin-left:15px !important}
.mgl20{margin-left:20px !important}
.mgl25{margin-left:25px !important}
.mgl30{margin-left:30px !important}
.mgl47{margin-left:47px !important}

.mgr5{margin-right:5px !important}
.mgr10{margin-right:10px !important}
.mgr15{margin-right:15px !important}
.mgr20{margin-right:20px !important}
.mgr25{margin-right:25px !important}
.mgr30{margin-right:30px !important}

.mgb5{margin-bottom:5px !important}
.mgb10{margin-bottom:10px !important}
.mgb15{margin-bottom:15px !important}
.mgb20{margin-bottom:20px !important}
.mgb25{margin-bottom:25px !important}
.mgb30{margin-bottom:30px !important}

.mgt5{margin-top:5px !important}
.mgt7{margin-top:7px !important}
.mgt9{margin-top:9px !important}
.mgt10{margin-top:10px !important}
.mgt15{margin-top:15px !important}
.mgt20{margin-top:20px !important}
.mgt25{margin-top:25px !important}
.mgt30{margin-top:30px !important}

.mt1rem {margin-top:1rem !important;}
.mt2rem {margin-top:2rem !important;}
.mt3rem {margin-top:3rem !important;}
.mt4rem {margin-top:4rem !important;}
.mt5rem {margin-top:5rem !important;}
.mt6rem {margin-top:6rem !important;}
.mt7rem {margin-top:7rem !important;}
.mt8rem {margin-top:8rem !important;}
.mt9rem {margin-top:9rem !important;}
.mt10rem {margin-top:10rem !important;}

.mb2rem {margin-bottom:2rem !important;}
.mb3rem {margin-bottom:3rem !important;}

.ml3rem { margin-left: 3rem; }

 /* nanumgothic ********************************************************** */
@font-face {
  font-family: 'NanumGothic';
  font-style: normal;
  font-weight: 400;
  src: url(./font/NanumGothic-Regular.eot);
  src: url(./font/NanumGothic-Regular.eot?#iefix) format('embedded-opentype'),
       url(./font/NanumGothic-Regular.woff) format('woff'),
       url(./font/NanumGothic-Regular.ttf) format('truetype');
}
@font-face {
  font-family: 'NanumGothic-L';
  font-style: normal;
  font-weight: 100;
  src: url(./font/NanumGothic-Light.eot);
  src: url(./font/NanumGothic-Light.eot?#iefix) format('embedded-opentype'),
       url(./font/NanumGothic-Light.woff) format('woff');
}
@font-face {
  font-family: 'NanumGothic';
  font-style: normal;
  font-weight: 600;
  src: url(./font/NanumGothic-Bold.eot);
  src: url(./font/NanumGothic-Bold.eot?#iefix) format('embedded-opentype'),
       url(./font/NanumGothic-Bold.woff) format('woff'),
       url(./font/NanumGothic-Bold.ttf) format('truetype');
}

@font-face {
    font-family: 'nanumsquare';
    src: url('font/nanumsquareb-webfont.woff2') format('woff2'),
         url('font/nanumsquareb-webfont.woff') format('woff');
    font-style: normal;
	font-weight:600;
}
@font-face {
    font-family: 'nanumsquare';
    src: url('font/nanumsquareeb-webfont.woff2') format('woff2'),
         url('font/nanumsquareeb-webfont.woff') format('woff');
    font-style: normal;
	font-weight:900;
}
@font-face {
    font-family: 'nanumsquare';
    src: url('font/nanumsquarel-webfont.woff2') format('woff2'),
         url('font/nanumsquarel-webfont.woff') format('woff');
    font-style: normal;
	font-weight:100;
}
@font-face {
    font-family: 'nanumsquare';
    src: url('font/nanumsquarer-webfont.woff2') format('woff2'),
         url('font/nanumsquarer-webfont.woff') format('woff');
    font-style: normal;
	font-weight:400;
}

@font-face {
    font-family: 'Paperlogy-8ExtraBold';
    src: url('https://fastly.jsdelivr.net/gh/projectnoonnu/2408-3@1.0/Paperlogy-8ExtraBold.woff2') format('woff2');
    font-weight: 700;
    font-style: normal;
}

 /* NotoSans ********************************************************** */
@font-face{
font-family:'NotoSans-L';
src: url(./font/NotoSans-Light.eot);
src: url(./font/NotoSans-Light.eot?#iefix) format('embedded-opentype'),
     url(./font/NotoSans-Light.woff) format('woff');
}
@font-face{
font-family:'NotoSans-R';
src: url(./font/NotoSans-Regular.eot);
src: url(./font/NotoSans-Regular.eot?#iefix) format('embedded-opentype'),
     url(./font/NotoSans-Regular.woff) format('woff');
}
@font-face{
font-family:'NotoSans-M';
src: url(./font/NotoSans-Medium.eot);
src: url(./font/NotoSans-Medium.eot?#iefix) format('embedded-opentype'),
     url(./font/NotoSans-Medium.woff) format('woff');
}
@font-face{
font-family:'NotoSans-B';
src: url(./font/NotoSans-Bold.eot);
src: url(./font/NotoSans-Bold.eot?#iefix) format('embedded-opentype'),
     url(./font/NotoSans-Bold.woff) format('woff');
}
@font-face {
	font-family: 'Pretendard';
	font-weight: 900;
	font-display: swap;
	src: local('Pretendard Black'), url('./fonts/pretendard/Pretendard-Black.woff2') format('woff2'), url('../fonts/pretendard/Pretendard-Black.woff') format('woff');
}
@font-face {
	font-family: 'Pretendard';
	font-weight: 800;
	font-display: swap;
	src: local('Pretendard ExtraBold'), url('./fonts/pretendard/Pretendard-ExtraBold.woff2') format('woff2'), url('../fonts/pretendard/Pretendard-ExtraBold.woff') format('woff');
}
@font-face {
	font-family: 'Pretendard';
	font-weight: 700;
	font-display: swap;
	src: local('Pretendard Bold'), url('./fonts/pretendard/Pretendard-Bold.woff2') format('woff2'), url('../fonts/pretendard/Pretendard-Bold.woff') format('woff');
}
@font-face {
	font-family: 'Pretendard';
	font-weight: 600;
	font-display: swap;
	src: local('Pretendard SemiBold'), url('./fonts/pretendard/Pretendard-SemiBold.woff2') format('woff2'), url('../fonts/pretendard/Pretendard-SemiBold.woff') format('woff');
}
@font-face {
	font-family: 'Pretendard';
	font-weight: 500;
	font-display: swap;
	src: local('Pretendard Medium'), url('./fonts/pretendard/Pretendard-Medium.woff2') format('woff2'), url('../fonts/pretendard/Pretendard-Medium.woff') format('woff');
}
@font-face {
	font-family: 'Pretendard';
	font-weight: 400;
	font-display: swap;
	src: local('Pretendard Regular'), url('./fonts/pretendard/Pretendard-Regular.woff2') format('woff2'), url('../fonts/pretendard/Pretendard-Regular.woff') format('woff');
}
@font-face {
	font-family: 'Pretendard';
	font-weight: 300;
	font-display: swap;
	src: local('Pretendard Light'), url('./fonts/pretendard/Pretendard-Light.woff2') format('woff2'), url('../fonts/pretendard/Pretendard-Light.woff') format('woff');
}
@font-face {
	font-family: 'Pretendard';
	font-weight: 200;
	font-display: swap;
	src: local('Pretendard ExtraLight'), url('./fonts/pretendard/Pretendard-ExtraLight.woff2') format('woff2'), url('../fonts/pretendard/Pretendard-ExtraLight.woff') format('woff');
}

@font-face {
	font-family: 'Pretendard';
	font-weight: 100;
	font-display: swap;
	src: local('Pretendard Thin'), url('./fonts/pretendard/Pretendard-Thin.woff2') format('woff2'), url('../fonts/pretendard/Pretendard-Thin.woff') format('woff');
}

.playfair-display {
	font-family: "Playfair Display", serif;
	font-optical-sizing: auto;	
	font-style: normal;
  }
  .montserrat-f {
	font-family: "Montserrat", sans-serif;
	font-optical-sizing: auto;
	font-style: normal;
  }
  
:root{
    --main-color:#0166b3;
    --sub-color:#f10075;    
    --contents-max-width:1400px;
    --header-height:7rem;
    --footer-height:10rem;
}
.flex{display:flex;justify-content:space-between;align-items: center;}
.flex_top{display:flex;justify-content:space-between;align-items: flex-start;}
.flex_column{display:flex;flex-flow:column; justify-content: center;}
.one-ellipsis{white-space: nowrap;
     overflow: hidden;
     text-overflow: ellipsis;
     width: 100%;
}
.common-wap{width:100%; max-width:var(--contents-max-width);margin: 0 auto;}
.displaynone{display:none;}
.empt{display:inline-block; margin-right:15px;}
.block{display:block;}
.bold800{font-weight:800;}
.bold600{font-weight:600;}
/* 상단 부분 s*/ 
header {
     position: fixed;
     top: 0;
     z-index: 9999;
     width: 100%;
     height:var(--header-height);
     transition: transform 0.5s ease-in-out; 	 
}
.up_hidden {
     transform: translateY(-100%); /* 헤더를 위로 이동 */
 }
 header .common-wap{height:calc(100% - 2rem); margin:0 auto;padding:1rem 0;}
header .common-wap img.homelogo{height:100%;}
header .common-wap img.emlogo{height:100%;}
header .common-wap i{color:#fff;}

header .common-wap nav{display:none;}
/* 상단 부분 e*/ 


.right-navi{
    display: block;
    right: 10px;
    top: 40%;
    position: fixed;
}
.right-navi ul{display:flex; flex-flow: column; gap:10px;}
.right-navi ul a{display:flex;justify-content: flex-end;gap: 10px;
    align-items: center;padding:5px 10px;
	transition: All 0.5s ease;
	width: 110px;
}

.right-navi .short-icon{
	display: inline-block;
    width: 19px;
	height: 19px;
	background: url(/assets/images/right_dot_gray.png) no-repeat 50% 50%;
	background-size: cover;
}
.right-navi .short-txt{
	display:none;
	color:#999;
}

.right-navi ul a.on{
	box-shadow: 3px 3px 6px rgba(0, 0, 0, 0.14);
	background-color: #fff;    
	justify-content: space-between;
}
.right-navi ul a:hover{
	box-shadow: 3px 3px 6px rgba(0, 0, 0, 0.14);
	background-color: rgba(255,255,255, 0.8);
	justify-content: space-between;
}
.right-navi ul a:hover .short-txt{ 
	display:inline-block;
}
.right-navi ul a.on .short-txt{ 
	display:inline-block;
	color:var(--main-color);
}
.right-navi ul a.on .short-icon{ 
	width: 20px;
	height: 20px;
	background: url(/assets/images/right_dot_blue.png) no-repeat 50% 50%;
	background-size: cover;
}	


/* 하단 부분 s*/ 
footer{ height:10rem; background-color: #1c1e26; color: #bbbec4; justify-content: center;}

/* 하단 부분 e*/ 

/* v2 version */ 


body.v2 .fixed-header {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 12rem;
	text-align: center;
	z-index: 1000;
	box-shadow: none;
}

body.v2 header .common-wap {
	height: calc(100% - 3rem);
	padding: 1.5rem 0;
}

body.v2 .fixed-header .flex {
	align-items: flex-start;
}

body.v2 header .common-wap img.homelogo {
	width: 210px;
}

body.v2 header .common-wap img.emlogo {
	max-height: 8rem;
}

body header .common-wap div.left {
    gap: 1rem;
}
body header .common-wap div.right-menu {
	text-align: right;
}
body header .common-wap div.right-menu a {
    display: inline-block;
}
body.v2 .container {
	background-image: url('/assets/images/main/main_bg_v1.png');
	background-position: center 10rem;
	background-size: cover;
	background-repeat: no-repeat;
}
body.v2 .section {
	width: 100%;
	max-width: 100%;
	text-align: left;
	margin: 0 auto;
	height: 100vh;
}
body.v2 .visiual-box {
	background: url('/assets/images/main/main-video.png');
	background-position: center bottom;
	background-size: cover;
	width: 100%;
	max-width: 100%;
	text-align: center;
	margin: 0;
	position: relative;
}
.visiual-box .visiual-txt {
	position: absolute;
	top: calc(50% - 280px);
	left: calc(50% - 600px);
	width: 1200px;
	height: 250px;
	z-index: 9;
}
.visiual-box .visiual-txt p {
	color: #fff;
	font-size: 6.0rem;
	font-family: 'Paperlogy-8ExtraBold';
	text-shadow: 2.5px 2.5px 1px rgb(131 145 155);
}
body.v2 .visiual-box img {
	padding-top: 15rem;
	max-width: 1200px;
	width: 70%;
	display: none;
}
body.v2 .section-title{display:flex; gap: 0.5rem; align-items: baseline; width: 100%;}
body.v2 .section-title h2{    
	font-size: 3.5rem;
    color: #000;
    font-weight: 600;
	padding-bottom:3rem;
}
body.v2 .section-title h2::before{
	content: "";
	background: url('/assets/images/main/title_plus.png');
	background-size: 24px;
    background-repeat: no-repeat;
	width:25px;
	height:25px;
	display: inline-block;
    margin-right: 10px;
    margin-bottom: 5px;
}
body.v2 .section-title .guide{    
	font-size: 1.7rem;
    color: #333;
	font-weight: 500;
	line-height: 1.4;
}
body.v2 .emblem-box .section-wrap {
	justify-content: center;
	align-items: flex-start;
	gap: 5rem;	
}	
body.v2 .emblem-box .flex-left, 
body.v2 .emblem-box .flex-right {width:calc(50% - 2.5rem);}
body.v2 .emblem-box .flex-left{text-align:right;}
body.v2 .emblem-box .flex-right { justify-content: space-between;}
body.v2 .emblem-box .flex-right p{font-size: 2.5rem; color:#000;line-height: 4rem;}
body.v2 .emblem-box .flex-right div.letter_desc {font-size: 1.5rem;line-height: 1.4;color: #333; font-weight:500;}
body.v2 .emblem-box .flex-right a{display: block;margin-top: 1.5rem;padding-bottom:0.5rem;}
body.v2 .emblem-box .flex-right a button {color:#999;font-size: 1.2rem;position:relative;} 
body.v2 .emblem-box .flex-right button::after{
	content: "";
	width: 100%;
	border-bottom: 2px solid #cacaca;
    position: absolute;
    bottom: -5px;
}
body.v2 .section-title h2{letter-spacing:-2px; padding-bottom: 2rem;}

body.v2 .section-title h3{ 
	font-size: 3.0rem;
    font-weight: 600;
    padding-bottom: 2rem;
	padding-left: 2.3rem;	
}	
body.v2 .advancement-box .flex-left {width:calc(55% - 2.5rem);}
body.v2 .advancement-box .flex-right {width:calc(45% - 2.5rem);}
body.v2 .advancement-box .flex-right img{width:100%;}
body.v2 .advancement-box p{ padding-left: 2.3rem;padding-bottom: 2rem;}
body.v2 .advancement-box a{ padding-left: 2.3rem;}
body.v2 .advancement-box a button{ font-size: 2.0rem; font-weight: 600; color: #0076c0; position:relative;}
body.v2 .advancement-box a button::after{
	content: "";
	width: 100%;
	border-bottom: 2px solid #0076c0;
    position: absolute;
    bottom: -5px;
}
body.v2 .advancement-box a button img{width:25px;margin-left:5px;}
body.v2 .history-box .section-title.flex_column{
	align-items: center;
}
body.v2 .history-box {width:100%; max-width: 100%;}
body.v2 .history-box h3{padding:0;font-size:4.5rem;}
body.v2 .history-box .tab-title{
	color:#0076c0;
	font-weight: 200;
}

body.v2 .history-box .section-wrap .guide { margin-top: 1rem; text-align: center; font-size:1.5rem;}
body.v2 .time-wrap{position: relative;width: 100%;margin: 3rem 0;}
body.v2 .time-wrap::before{
	content: ""; 
	width:100%;
	border-bottom: 2px solid #808185;
    position: absolute;
	top:17px;
	left:0;	
}
body.v2 .time-tab{
	width: 90%;
	max-width: 1400px;
	margin: 0 auto;	
}
body.v2 .time-tab li{width:25%;}	
body.v2 .time-tab li a{width:100%;height: 100%;display: flex;
		flex-flow: column;
		justify-content: center;
		align-items: center;
		font-size: 1.8rem;
		gap: 1rem;
		font-weight: 500;
		color: #999;
}
body.v2 .time-tab li a::before{
	content:"";
	width: 35px;
	height: 35px;
	background: url(/assets/images/main/won_gray.png);
	background-repeat: no-repeat;
	background-size: cover;
	background-color: #f6fbfd;
	display: block;	
    z-index: 1;
    border-radius: 50%;
}
body.v2 .time-tab li a.on{color:#000;}
body.v2 .time-tab li a.on::before{
	background: url(/assets/images/main/won_blue.png);
	background-repeat: no-repeat;
	background-size: cover;
	background-color: #f6fbfd;
}

body.v2 .item-photo { transition: transform 0.3s ease; }
body.v2 .item-photo:hover {transform: scale(1.1);}

body.v2 .message-box { background: #0076c0; width:100%; max-width: 100%;}
body.v2 .w1400 {width:90%; max-width: 1400px; }
body.v2 .message-box{margin: 0; padding: 6rem 0;}
body.v2 .message-box .w1400.flex{align-items: flex-start; gap : 5rem;}
body.v2 .message-box .item-left{ gap : 1rem; width: calc(60% - 2.5rem);}
body.v2 .message-box .item-left-thumb {width:50%;}
body.v2 .message-box .item-left-thumb img {width:100%;}
body.v2 .message-box .item-right{ width: calc(40% - 2.5rem);}
body.v2 .message-box .item-right h2{color: #fff;letter-spacing: 0;padding-bottom: 0.5rem;}
body.v2 .message-box .section-title { flex-flow: column; }
body.v2 .message-box .section-title h2::before{ content:unset; width:0; height: 0; margin-right: 0; }
body.v2 .message-box .section-title .guide{ color:#fff; font-weight: 200;}
body.v2 .message_btnpart {text-align: left;margin-top: 2rem;}
body.v2 .message_btnpart button {font-size: 2.0rem;
    font-weight: 600;
    color: #fff;
    position: relative;
	gap:5px;
}
body.v2 .message_btnpart button::after {
    content: "";
    width: 100%;
    border-bottom: 2px solid #fff;
    position: absolute;
    bottom: -5px;
}

body.v2 .section.emblem-box, 
body.v2 .section.advancement-box, 
body.v2 .section.history-box,
body.v2 .section.message-box {
    height: auto;
    display: flex;
    align-items: center;
    flex-flow: column;
    justify-content: center;

}
body.v2 div.section.emblem-box  {height:60vh;}
body.v2 div.section.advancement-box  {height:80vh;}
body.v2 div.section.message-box  {height:40vh;}

body.v2 div.section.emblem-box.hfix  {height:551px;}
body.v2 div.section.advancement-box.hfix  {height:735px;}
body.v2 div.section.message-box.hfix  {height:350px;}

body.v2 div.section.emblem-box .letter-title p span{font-size:4.0rem;font-weight:500;}
body.v2 .section.advancement-box .section-wrap {width:100%;}
body.v2 div.section.history-box{ margin-bottom: 5rem;}
body.v2 .section.history-box .w1400 {margin : 0 auto;}

body.v2 header.inbody{height: 5rem;background-color: rgba(0, 0, 0, 0.9); align-items: center;}
body.v2 header.inbody .common-wap {padding:1rem;height:calc(100% - 2rem); align-items: center;width: calc(100% - 2rem);}
body.v2 header.inbody img.homelogo{ width: 160px;}
body.v2 header.inbody img.emlogo {max-height: 100%;}
body.v2 header.inbody div.right-menu {width: 160px;}
body.v2 header.inbody div.right-menu a i{font-size: 2em;}
body.v2 footer.flex{justify-content: center; height: 60px;}

/* mapview start */
body.sub.v2 header .common-wap img.emlogo {max-height:5rem;}
body header .common-wap i {color:#0076c0;font-size: 2.5rem;}



/* history part renew */ 
body.v2 .history-box .common-wap { align-items: flex-start; }
body.v2 .history-box .section-title {width:250px;}
body.v2 .hb2 .history_nav{width:100%;}
body.v2 .hb2 .history_nav_h {margin-top:5rem;
    padding: 0;
    width: 100%;
}
body.v2 .hb2 .history_nav_h::before {
    content: '';
    position: absolute;
    left: 145px;
    top: -5px;
    width: 0px;
    height: 0px;
    background-color: var(--main-color);
}
body.v2 .hb2 .history_nav li a.on {
    background: #0077c0;
    position: relative;
}
body.v2 .hb2 .history_nav li a.on::after {
    content: "";
    position: absolute;
    top: 0;
    right: -22px;
    width: 32px;
    height: 100%;
    background: url(/assets/images/main/time_bg_on.png) no-repeat;
    background-size: contain;
}
body.v2 .hb2 .history_cont_header {align-items: center;height:unset;}
body.v2 .hb2 .history_year { font-size: 3.5rem;  
    font-weight: 200;
}
body.v2 .hb2 .history_year_h {
    font-size: 4.0rem;
    font-weight: 500;
}
body.v2 .hb2 .history_year_desc p{text-align:center;color:#999; font-size:1.2rem;line-height: 1.7rem;}
body.v2 .hb2 .history_thumb_list{width:100%;margin-top:3rem;}

body.v2 div.section.message-box.mb2{background: unset;
    position: relative;}
body.v2 div.section.message-box.mb2::before {
    content: "";
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background-color: #0166b3;
    opacity: 0.7;
    z-index: 0;
}
body.v2 div.section.message-box.mb2 .w1400{z-index: 1; }


/* popup start */ 
.modalbg{
    display: block;
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    visibility: hidden;
    opacity: 0;
    background-color: rgba(0, 0, 0, 0.6);
    transition: visibility .2s, opacity .2s;
    z-index: 10000;
}
.modalbg.show {
    visibility: visible;
    opacity: 1;
}

/* popup end */ 
/* right menu part start */
.gnb-menupart {
    position: fixed;
    top: 0;
    right: 0;
    width: 100%;
    max-width: 640px;
    height: 100%;
    visibility: hidden;
    opacity: 0;
    background-color: #fff;
    transform: translateX(100%);
    transition: top 0.4s, visibility 0.3s, opacity 0.3s, transform 0.3s;
    z-index: 10001;
}

.gnb-menupart.show {
    visibility: visible;
    opacity: 1;
    transform: translateX(0);
}
.gnb-menupart .gnb-top { display: flex;justify-content: center; position: relative;  border-bottom: 1px solid #e5e5e5; padding: 20px 0;}
.gnb-menupart .gnb-top a{display: flex; gap: 5px; height: 45px; align-items: center;}
.gnb-menupart .gnb-top img { }
.gnb-menupart .gnb-top img.emlogo{height:40px;}
.gnb-menupart .gnb-top img.homelogo{height:44px;}
.gnb-menupart .gnb-top button.closebtn {position: absolute; top:1.2rem; right:10px; }
.gnb-menupart .gnb-list ul{
	display: block;	
}
.gnb-menupart .gnb-list ul.depth1 { }
.gnb-menupart .gnb-list ul.depth1 li{position: relative;}
.gnb-menupart .gnb-list ul.depth1 li a{
	display: inline-block;
	color: #222;
	font-weight: 600;
	text-transform: uppercase;
	border-bottom: 1px solid #f5f5f5;
	width:100%;
	height:5rem;
	line-height:5rem;
	font-size: 2rem;
    text-align: left;
    padding-left: 3rem;
}

.gnb-menupart .gnb-list ul.depth2 { display: none;
    position: relative;   
    margin-top: -1px;
    background-color: #f5f5f5;
    z-index: 50;
	transition: height 0.5s ease;
}	
/*.gnb-menupart .gnb-list li.open ul.depth2{ display: block; }	*/

.gnb-menupart .gnb-list ul.depth2 li:first-child {padding-top:20px;}
.gnb-menupart .gnb-list ul.depth2 li:last-child {padding-bottom:20px;}
.gnb-menupart .gnb-list ul.depth2 li{padding-left:30px;}

.gnb-menupart .gnb-list ul.depth2 li a{    font-size: 1.7rem;
    color: #666;
    height: 4rem;
    line-height: 4rem;
}
.gnb-menupart .gnb-list ul.depth2 li a.on{color: #1a85c7;}
.gnb_child_btn {
    position: absolute;
    top: 0;
    right: 20px;
    width: 50px;
    height: 67px;
    overflow: hidden;
    color: transparent;
    text-indent: -99px;
    border: 0;
    background-color: transparent;
    z-index: 50;
}
.gnb_child_btn::before {
    content: "\e942";
    position: absolute;
    top: 50%;
    left: 50%;
    font-family: xeicon !important;
    font-style: normal;
    font-size: 30px;
    color: #222;
    line-height: 1;
    text-indent: 0;
    font-variant: normal;
    text-transform: none;
    speek: none;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    transform: translate(-50%, -50%);
    transition: transform 0.3s;
}

.depth1 > li.open .gnb_child_btn { transform: rotate(180deg); }

/* right menu part end */

/* v3 sub page start */ 

.com-white .sub_common_wap h2{color:#fefefe;}
body.com-white header .common-wap i {color:#fefefe;}
body.com-white .sub_common_loc i {color:#fefefe;}
body.com-white .sub_common_loc li{color:#eee;}
body.com-white .sub_common_loc li.on{color:#fefefe;}
body.com-white .sub_common_loc ul li:nth-child(1):after, 
body.com-white .sub_common_loc ul li:nth-child(2):after {
    border-top:  1px solid #eee;    
    border-right: 1px solid #eee;}

.container{
    gap: 0;
    width: 100%;
    height: 100%;
}
.sub_common_wap{
	height: 300px;
    display: flex;
    align-items: center;
	gap: 0.5rem;
	flex-flow: column;
    justify-content: center;
}

.sub_common_wap h2{
	line-height: 1;
    color: #333;
    text-align: center;
    letter-spacing: -3px;
    /*
	font-weight: 500;
    margin-top:2rem;
    font-size: 4rem;
    */
    font-size: 5rem;
    font-weight: 700;
    width: 100%;
    max-width: var(--contents-max-width);
    margin: 5rem auto 0;
    
}
.sub_common_wap h4, 
.sub_common_wap .main-txt {
    color: #1a85c7;
    text-align: center;    
    font-size: 2.5rem;
    margin-top: 1rem;
	line-height: 1;
	font-weight: 300;
}
.wall-page .sub_contents_wap h4.sub_tit, 
.greeting .sub_contents_wap h4.sub_tit{
color: #1a85c7;
text-align: center;    
font-size: 3.5rem;
margin: 2rem 0 3rem;
line-height: 1;
font-weight: 300;
}
.wall-page .sub_contents_wap h4.sub_tit.white {color:#fefefe;display:none;}

.sub_common_wap .sub-txt {
   color:#333;
   font-size: 1.5rem;
}
.sub_common_loc {
    width: 100%;
    max-width: var(--contents-max-width);
    margin: 0 auto;
}
.sub_common_loc ul{display: flex;
    justify-content: end;
    width:100%;
	gap:20px;
}
.sub_common_loc ul li{color: #aaa;
    font-size: 1.2rem;
    font-weight: 200;
    position: relative;}
.sub_common_loc ul li.on{ color: #0b0b0b;}	
.sub_common_loc ul li:nth-child(1):after ,
.sub_common_loc ul li:nth-child(2):after {
    content: "";
    position: absolute;
    bottom:7px;
    right: -10px;
    transform: translateY(-50%);
    width: 6px;
    height: 6px;
    border-top:  1px solid #999;    
    border-right: 1px solid #999;
    transform:rotate(45deg);   
	}
.progressLayer{
    position: absolute;
    top: 0;
    left: 0;
    background-color: rgba(150, 150, 150, 0.1);
    width: 100%;
    height: 100%;
    z-index: 1;
    display: flex;
    justify-content: center;
    align-items: center;
    display:none; 

}    
.progressLayer i{ font-size:3rem; animation: spin 1s linear infinite;}
@keyframes spin {
    from { transform: rotate(0deg); }
    to   { transform: rotate(360deg); }
}


@media screen and (max-width: 1450px) {
    :root{ 
        --contents-max-width:95%;
    }
}            
@media screen and (max-width: 1024px) {
    header{ background-color: rgba(255, 255, 255, 0.6); height: 80px;}
    .com-white header{ background-color: rgba(50, 50, 50, 0.6); height: 80px; }
    .sub_common_wap h2 {font-size:4rem;}
}    
@media screen and (max-width: 768px) {
    .sub_common_wap {height:250px;}
    .sub_common_wap h2 {font-size:3.3rem;}
}    
@media screen and (max-width: 570px) {
    .sub_common_wap {height:200px;}
    .sub_common_wap h2 {font-size:2.8rem;}
}

@media screen and (max-width: 450px) {
    .sub_common_wap h2 {font-size:2.5rem;}
}