@charset "utf-8";

@charset "utf-8";
@import url('https://fonts.googleapis.com/css?family=Raleway');
@import url(http://fonts.googleapis.com/earlyaccess/notosanskr.css);
 {font-family: 'Noto Sans KR', sans-serif;}



/* basic css */
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, details, figcaption, figure, dialog,
footer, header, hgroup, menu, nav, section {margin: 0; padding: 0; border: 0;}
article, aside, details, figcaption, figure, dialog,
footer, header, hgroup, menu, nav, section {display: block;}
html, body { height:100%;}
body {font-size: 18px; font-family: NotoSansCJKkr-Light, dotum, sans-serif;  color:#4c4948; line-height:1.6; letter-spacing:-1px; -webkit-text-size-adjust:none; }
h1, h2, h3, h4, h5, h6 {font-size: 100%;font-weight: normal;}
a:link { color: #4c4948; text-decoration: none; }
a:visited { color: #4c4948; text-decoration: none; }
a:hover { color: #4c4948; text-decoration: none; }
a:active { color: #4c4948; text-decoration: none; }
a:focus { color: #4c4948; text-decoration: none; }
select, input, textarea {font-size: 100%;vertical-align: middle ; font-family: NotoSansCJKkr-Light, dotum, sans-serif;}
input {margin: 0;padding: 0;}
ol, ul {list-style: none;}
label {cursor: pointer;}
legend, caption {width: 0;height: 0; visibility: hidden; font-size: 0;line-height: 0;}
button {cursor: pointer;}
button:focus {outline: 1px dotted;}
img {vertical-align: top;}
table {}

.hidden {position: absolute;width: 0;height: 0;visibility: hidden;font-size: 0;line-height: 0; top:-9999px}



input[type="text"] {box-sizing:border-box; -webkit-appearance:none;}
input:-ms-input-placeholder {color:#808080}
input::-webkit-input-placeholder {color:#808080}
input::-moz-placeholder {color:#808080}
input::-moz-placeholder {color:#808080}
textarea {}

.point {color:#916b4a}
html, body {height:100%; min-height:100%; -ms-overflow-style: none;}

::-webkit-scrollbar {

display:none;

}


/* layout*/
header {position:relative; width:100%; min-width:1100px; top:33px;  z-index:999;}

.navi {position: fixed;  width:78%; height:70px; top:33px; left: 0; right: 0; margin: auto;  background-color: #fff; box-shadow:0px 0px 40px -20px rgba(0,0,0,.80); border-bottom:1px solid #ddd; display: none;  }
.navi2 { position: fixed; width:100%; height:70px; top: 0; left: 0; right: 0; margin: auto; background-color: #fff; box-shadow:0px 0px 40px -20px rgba(0,0,0,.80); border-bottom:1px solid #ddd; }


h1 { width:274px; height:70px; position: absolute; top:0px; left: 130px; z-index: 20; }
h1 a {display:inline-block; width:367px; height:70px;  left:0; background:url(../img/sub-logo.png) no-repeat; text-indent:-9999px; }



@media all and (max-width:1380px) { 
		h1 { position:absolute; left: 50%; margin-left: -560px;}

	}



.gnb {  width: 1100px;  position:absolute; left:50%; margin-left:-360px; z-index:2;  height:70px;letter-spacing:0; font-family:'Noto Sans KR', 'Malgun Gothic', dotum, '돋움', '굴림', Gulim, sans-serif; overflow:hidden;}
.gnb>ul>li {position:relative;float:left;width:140px; text-align:center;}

.gnb .depth1 {position:relative; display:block;  font-size:17px; font-weight:600; letter-spacing:-1px; line-height:72px; color: #373636;}
.gnb>ul>li>a:hover { color:#9c760f !important; }
.gnb>ul>li:nth-child(2) { margin-left: 29px; }
.gnb>ul>li:nth-child(3) { margin-left: 44px; }
.gnb>ul>li:nth-child(4) { margin-left: 25px; }
.gnb>ul>li:nth-child(5) { margin-left: -4px; }
.gnb>ul>li:nth-child(6) { margin-left: 10px; }
.gnb>ul>li>ul {display:block; right: 0px; min-height:160px; margin-top:16px; opacity:0;transform:translateY(20px);}
.gnb>ul>li>ul>li {float:none; height:20px; width:auto; z-index:3; line-height: 100%;}
.gnb>ul>li>ul>li>a {font-size:14px; color:#373636; font-weight:600; letter-spacing:-0.7px; }
.gnb>ul>li>ul>li>a:hover {color:#9c760f;}
.gnb>ul>li>ul>li>a:hover .depth1 { color: #9c760f; }
.gnb .line {position:absolute; display:block; bottom:1px; height:3px; width:0%; background:#9c760f; left:55px; z-index:-99;}
.navi-bg {position:absolute; display:block;width:100%; height:0px; left: 0; top:71px; z-index:1; overflow: hidden; }
.navi-bg .white-bg {width:100%;height:260px; background:#fff; border-bottom:1px solid #c6c6c6;}

.menu-icon {display:none;}


.guest {position: absolute; top:0px;  right:0px; letter-spacing:0; width:196px; z-index:90; border-bottom:1px solid #af6e52;}


.language {position: absolute; top: 0;  right:80px; letter-spacing:0; width:189px; z-index:90; }
.language .sel-tit {display:block; color:#fff; font-size:12px; background:url(../img/sub-sitemap-bt.png) no-repeat; height:70px; cursor: pointer; }








.gnb2 {  width: 1300px;  position:absolute; left:50%; margin-left:-550px;z-index:2;  height:70px;letter-spacing:0; font-family:'Noto Sans KR', 'Malgun Gothic', dotum, '돋움', '굴림', Gulim, sans-serif; overflow:hidden;}
.gnb2>ul>li {position:relative;float:left;width:140px; text-align:center;}

.gnb2 .depth1 {position:relative; display:block;  font-size:17px; font-weight:600; letter-spacing:-1.5px; line-height:72px; color: #373636;}
.gnb2>ul>li>a:hover { color:#9c760f !important; }
.gnb2>ul>li:nth-child(2) { margin-left: 0px; }
.gnb2>ul>li:nth-child(3) { margin-left: 15px;width:180px; }
.gnb2>ul>li:nth-child(4) { margin-left: 18px; }
.gnb2>ul>li:nth-child(5) { margin-left: 10px; }
.gnb2>ul>li:nth-child(6) { margin-left: 0px; }
.gnb2>ul>li>ul {display:block; background:url(../../common/gnb_bg.png) no-repeat right 0px; min-height:140px; margin-top:16px; opacity:0;transform:translateY(20px);}
.gnb2>ul>li>ul>li {float:none; height:26px; width:auto; z-index:3; line-height: 110%; text-align: left;}
.gnb2>ul>li>ul>li>a {font-size:13px; color:#373636; font-weight:600; letter-spacing:-0.7px; text-align:left; position: relative; margin-left: 11px;}
.gnb2>ul>li>ul>li>a>div {position: absolute; top: 8px; left: -11px; width: 4px; height: 4px; background-color: #373635; border-radius:2px;  }
.gnb2>ul>li>ul>li>a:hover {color:#9c760f;}
.gnb2>ul>li>ul>li>a:hover .depth1 { color: #9c760f; }
.gnb2 .line {position:absolute; display:block; bottom:1px; height:3px; width:0%; background:#9c760f; left:55px; z-index:-99;}
.navi-bg2 {position:absolute; display:block;width:100%; height:0px; left: 0; top:71px; z-index:1; overflow: hidden; }
.navi-bg2 .white-bg {width:100%;height:240px; background:#fff; border-bottom:1px solid #c6c6c6; }





.bgw {background:#fff;  }
.navi.wh { width:78%; position: fixed; left: 0; right: 0; margin: auto;background-color: #fff; }
.navi.wh h1 a {background:url(../img/sub-logo.png) no-repeat;}
.navi.wh .gnb .depth1 {color:#2a2a2a;}
.navi.wh .gnb .depth1:hover { color:#9c8a79; }
.navi.wh .language .sel-tit  {background:url(../img/sub-sitemap-bt.png) no-repeat; cursor: pointer;}

.navi2.wh { width:100%; position: fixed; left: 0; right: 0; margin: auto;background-color: #fff; }
.navi2.wh h1 a {background:url(../img/sub-logo.png) no-repeat;}
.navi2.wh .gnb2 .depth1 {color:#2a2a2a;}
.navi2.wh .gnb2 .depth1:hover { color:#9c760f; }
.navi2.wh .language .sel-tit  {background:url(../img/sub-sitemap-bt.png) no-repeat; cursor: pointer;}


#language2 { position: fixed; top: 0; right: 280px; }



@media all and (max-width:1700px) { 
		.navi .language { position:absolute; right: 50%; margin-right: -450px;}
		.gnb { margin-left:-420px;}
		.gnb2 { margin-left:-420px;}


		
	}





@media all and (max-width:1500px) { 
		.navi .language { position:absolute; right: 50%; margin-right: -560px;}
		.navi2 .language { position:absolute; right: 50%; margin-right: -870px;}

		#language2 { position:absolute; right: 50%; margin-right: -680px;}
		.gnb { margin-left:-340px;}
		.gnb2 { margin-left:-340px;}
		
		.guest { display:none;}

		
	}




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

		.navi2 .language { position:absolute; right: 50%; margin-right: -650px;}
		.navi2 h1 { position:absolute; left:50%; margin-left:-650px;}

		.navi.wh { width:100%;   }
		.navi { width:100%;   }
		
		.navi .language { position:absolute; right: 50%; margin-right: -560px;}
		
		.gnb { margin-left:-340px;}
		.gnb2 { margin-left:-340px;}

		.guest { display:none;}
	}


@media all and (min-width:1930px) { 
	
.navi {position: fixed;  width:1500px; left:50%; margin-left:-750px; }
.navi2 { position: fixed; width:1920px; left:50%; margin-left:-960px;}
.navi.wh { width:1500px; left:50%; margin-left:-750px;  }
.navi2.wh { width:1920px; left:50%; margin-left:-960px;}

#language2 { position:absolute; right: 50%; margin-right: -680px; z-index:99;}
	
	}



#sitemap_wrap { width:100%; height:100%; background-color:rgba(0,0,0,0.7); position:fixed; top:-5000px; left:0; right:0; margin:auto;  z-index:999999999999999;}
#sitemap { width:1200px; position:absolute; top:-500px; left:50%; margin-left:-600px;  }
#sitemap_close { position:absolute; top:200px; left:50%; margin-left:546px; cursor:pointer; display:none;}


#q-menu { width: 91px; height: 100%; position: fixed; top: 0; left: 0; background-color: #f8f8f8; z-index:999999999; border-right: 1px solid #e0dcde;  box-sizing: border-box; }

#q-logo { position: absolute; top: 0; left: 0; }
#q-bt01 { position: absolute; top: 93px; left: 0; }
#q-bt02 { position: absolute; top: 183px; left: 0; }
#q-bt03 { position: absolute; top: 273px; left: 0; }
#q-bt04 { position: absolute; top: 363px; left: 0; cursor: pointer; }
#q-bt04>img { position: absolute; top: 0; left: 0; }
#q-bt04>img:nth-child(2) { opacity: 0; transition:0.5s; }
#q-bt04>img:nth-child(2):hover { opacity: 1;  }
#q-bt05 { position: absolute; top: 453px; left: 0; cursor: pointer;}
#q-bt05>a>img { position: absolute; top: 0; left: 0; }
#q-bt05>a>img:nth-child(2) { opacity: 0; transition:0.5s; }
#q-bt05>a>img:nth-child(2):hover { opacity: 1;  }
#q-bt06 { position: absolute; top: 543px; left: 0; cursor: pointer;}
#q-bt06>a>img { position: absolute; top: 0; left: 0; }
#q-bt06>a>img:nth-child(2) { opacity: 0; transition:0.5s; }
#q-bt06>a>img:nth-child(2):hover { opacity: 1;  }
#q-bt07 { position: absolute; top: 633px; left: 0; cursor: pointer;}
#q-bt07>a>img { position: absolute; top: 0; left: 0; }
#q-bt07>a>img:nth-child(2) { opacity: 0; transition:0.5s; }
#q-bt07>a>img:nth-child(2):hover { opacity: 1;  }
#q-bt08 { position: absolute; top: 363px; left: 0; cursor: pointer;}
#q-bt08>a>img { position: absolute; top: 0; left: 0; }
#q-bt08>a>img:nth-child(2) { opacity: 0; transition:0.5s; }
#q-bt08>a>img:nth-child(2):hover { opacity: 1;  }
#q-bt09 { position: absolute; top: 723px; left: 0; cursor: pointer;}
#q-bt09>a>img { position: absolute; top: 0; left: 0; }
#q-bt09>a>img:nth-child(2) { opacity: 0; transition:0.5s; }
#q-bt09>a>img:nth-child(2):hover { opacity: 1;  }
#q-bt10 { position: absolute; top: 812px; left: 0; cursor: pointer;}
#q-bt10>a>img { position: absolute; top: 0; left: 0; }
#q-bt10>a>img:nth-child(2) { opacity: 0; transition:0.5s; }
#q-bt10>a>img:nth-child(2):hover { opacity: 1;  }

#q-ov { width: 199px; height: 100%; background-color: #242a46; position: fixed; top: 0; left: -391px; opacity: 0; z-index: 999999; }
#q-ov-top { width: 199px; height: 50%; background-color: #242a46; position: absolute; top: 0; left: 0; }
#q-ov-bottom { width: 199px; height: 50%; background-color: #976f5d; position: absolute; top: 50%; left: 0; }

#q-go01 { width: 199px; height: 331px; position: absolute; bottom: 0; left: 0; }
#q-go02 { width: 199px; height: 331px; position: absolute; top: 0; left: 0; }


#q-menu-bt { width: 91px; height: 73px; position: absolute; top: 615px; bottom: 0; left: 0; margin: auto; cursor: pointer;}
#q-top { position: absolute; bottom: 0; left: 0; cursor: pointer; }

#q-menu02 { width: 165px; height: 257px; position: absolute; top: 575px; left: 50%; margin-left: -715px; z-index: 99;}
#q-menuline { width: 1px; height: 0px; position: absolute; top: 0; left: 23px; background-color: #787878;} 
#q01 { position: absolute; top: 0px; left: 0; cursor: pointer; opacity: 0; }
#q02 { position: absolute; top: 0px; left: 0; cursor: pointer; opacity: 0;}

