@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:#4c4c4c; 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: #4c4c4c; text-decoration: none; }
a:visited { color: #4c4c4c; text-decoration: none; }
a:hover { color: #4c4c4c; text-decoration: none; }
a:active { color: #4c4c4c; text-decoration: none; }
a:focus { color: #4c4c4c; 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:9999;}

.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; z-index: 99999999999999; }


h1 { width:230px; height:70px; position: absolute; top:0px; left: 88px; z-index: 20; }
h1 a {display:inline-block; width:230px; 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:110px; text-align:center;}

.gnb .depth1 {position:relative; display:block;  font-size:16px; font-weight:600; letter-spacing:-1px; line-height:72px; color: #373635;}
.gnb>ul>li>a:hover { color:#9c8a79; }
.gnb>ul>li:nth-child(2) { margin-left: 19px; }
.gnb>ul>li:nth-child(3) { margin-left: 34px;width: 180px; }
.gnb>ul>li:nth-child(4) { margin-left: 34px; }
.gnb>ul>li:nth-child(5) { margin-left: 15px; }
.gnb>ul>li:nth-child(6) { margin-left: -14px; }
.gnb>ul>li:nth-child(7) { margin-left: 0px; }
.gnb>ul>li>ul {display:block; right: 0px; min-height:140px; margin-top:16px; opacity:0;transform:translateY(20px);}
.gnb>ul>li>ul>li {float:none; height:30px; width:auto; text-align:left;}
.gnb>ul>li>ul>li>a {font-size:15px; color:#373635; font-weight:600; letter-spacing:-0.7px; text-align:left; position: relative; margin-left: 11px; }
.gnb>ul>li>ul>li>a>div {position: absolute; top: 8px; left: -11px; width: 8px; height: 8px; background-color: #373635; border-radius:4px;  }
.gnb>ul>li>ul>li>a:hover {color:#9c8a79;}
.gnb>ul>li>ul>li>a:hover .depth1 { color: #a88221; }
.gnb .line {position:absolute; display:block; bottom:1px; height:3px; width:0%; background:#9c8a79; 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:200px; background:#fff; border-bottom:1px solid #c6c6c6;}

.menu-icon {display:none;}


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


.language {position: absolute; top: 0;  right:127px; 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; }

#language2 { position: fixed; top: 0; right: 326px; z-index: 111; }






.gnb2 {  width: 1300px;  position:absolute; left:50%; margin-left:-630px; 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:146px; text-align:center;}

.gnb2 .depth1 {position:relative; display:block;  font-size:17px; font-weight:600; letter-spacing:-1.5px; line-height:72px; color: #373635;}
.gnb2>ul>li>a:hover { color:#9c760f !important; }
.gnb2>ul>li:nth-child(2) { margin-left: 19px; }
.gnb2>ul>li:nth-child(3) { margin-left: 34px;width: 170px; }
.gnb2>ul>li:nth-child(4) { margin-left: 34px; }
.gnb2>ul>li:nth-child(5) { margin-left: 15px; }
.gnb2>ul>li:nth-child(6) { width: 100px; margin-left: 40px; }
.gnb2>ul>li:nth-child(7) { margin-left: 30px; }
.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:30px; width:auto; text-align:left; z-index: 3;}
.gnb2>ul>li>ul>li>a {font-size:15px; color:#373635; 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:300px; background:#fff; border-bottom:1px solid #c6c6c6; }




.depth2 {}







.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:#9c8a79; }
.navi2.wh .language .sel-tit  {background:url(../img/sub-sitemap-bt.png) no-repeat; cursor: pointer;}





@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: -680px;}
		.gnb { margin-left:-340px;}
		.gnb2 { margin-left:-340px;}
		#language2 { position:absolute; right: 50%; margin-right: -680px;}
		.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;  }
	}



#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:-637px;  }
#sitemap_close { position:absolute; top:200px; left:50%; margin-left:606px; 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: 453px; 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-bt09 { position: absolute;  top: 363px; 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-bt07 { position: absolute;  top: 543px; 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: 632px; 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-bt05 { position: absolute; top: 722px; 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: 363px; left: 0; cursor: pointer; display: none;}
#q-bt06>img { position: absolute; top: 0; left: 0; }
#q-bt06>img:nth-child(2) { opacity: 0; transition:0.5s; }
#q-bt06>img:nth-child(2):hover { opacity: 1;  }

#q-bt10 { position: absolute; top: 453px;  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-bt11 { position: absolute; top: 812px; left: 0; cursor: pointer;}
#q-bt11>a>img { position: absolute; top: 0; left: 0; }
#q-bt11>a>img:nth-child(2) { opacity: 0; transition:0.5s; }
#q-bt11>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: 99999999; }
#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: 611px; 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;}

#win{position: fixed; width:100%; height: 1000px;top: -1000px;left: 0;right: 0;margin: auto; z-index: 999999999; background: rgba(0, 0, 0, 0.6); opacity: 0;}	
.win-wrap{width: 1100px; height: 600px; position: absolute; top: 0;left: 0;right: 0;bottom: 0;margin: auto; ;;	}
#win-close{ position: absolute; top: 0;right: 0; cursor: pointer;}
	.win-wrap-menu { width: 600px; height: 55px; position: absolute; top: 0px; left: 50%; margin-left: -550px; z-index: 99; }
	.win-wrap-menu>li { width: 49.9%; height: 55px; line-height: 55px; float: left; text-align: center; font-family: 'Noto Sans KR', sans-serif; font-size:18px; font-weight: 600; background-color: #f1f1f1; border-left: 1px solid #fff; transition:0.5s;}
	.win-wrap-menu>li:nth-child(1) { border-left: none; }
	.win-wrap-menu>li>a { color: #4c4c4c; }
	.win-wrap-menu>li>a>div { width: 100%; height: 100%; }


	.win-wrap-menu .active { background-color: #8b6c56;color: #fff; }
	.win-wrap-menu .active>a { color: #fff; }