@charset "utf-8";

html, body, div, object, iframe, h1, h2, h3, h4, h5, h6, p, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, canvas, details, figcaption, summary, time, mark, audio, video{font-family:'Malgun Gothic'; color:#333; font-size:16px; letter-spacing:-.5px}
img{max-width:100%}

#wrap{padding-left:446px; max-width:1800px; position:relative;}
.wrapper{margin:auto; width:84.5%}

aside{position:fixed; text-align:center; width:446px; height:100vh; min-height:650px; z-index:900; 
background:url(../img/inc/bg_aside.jpg) repeat left top/auto 100%;  animation:moveBg  100s infinite linear; -webkit-animation:moveBg  100s infinite linear}
@keyframes moveBg{
 0%{background-position:left top}
 100%{background-position:-20000px top}
}
@-webkit-keyframes moveBg{
 0%{background-position:left top}
 100%{background-position:-20000px top}
}
aside>a{display:inline-block}
aside>a:hover{text-decoration:none}
aside h1{text-align:center; padding-top:14vh}
aside .siteName{margin-top:5vh; text-align:center; color:#fff}
aside .siteName span{display:block; font:400 4.125em 'Gmarket'; text-shadow:0px 0px 3px rgba(255,100,0,.5); letter-spacing:-.03em; line-height:1.5em}
aside .siteName span:first-child{display:block; font-weight:400; font-size:1.875em}
aside .siteName span:last-child{font-weight:600; line-height:.9em}
aside .siteName span:last-child:first-letter{letter-spacing:1.85em}
aside .btn_participate{margin:5vh auto 0px; padding-top:5vh; text-align:center; width:55%; border-top:1px solid rgba(255,255,255,.5)}
aside .btn_participate a{display:inline-block; padding:14px 65px 12px 22px;  font:500 1.06em 'Gmarket'; background:#fff url(../img/inc/ic_click.png) no-repeat right 15px center; border-radius:3px}
aside .copy{position:Absolute; bottom:5vh; text-align:center; width:100%; font-size:0.94em; color:#fff; text-shadow:0px 0px 3px rgba(255,100,0,.5)}
footer{padding:30px 10px; text-align:center; background:#f0f0f0}
.btn_goTop{text-align:Center}
.btn_goTop a{display:inline-block; position:relative; top:-60px; width:67px; height:67px; background:#f0f0f0; border-radius:200px; text-indent:-50000px; overflow:hidden}
.btn_goTop a:after,
.btn_goTop a:before{display:block; content:''; position:absolute; bottom:30px; left:15px; width:25px; height:5px; background:#333; border-radius:1px; transition:all ease .2s; -webkit-transition:all ease .2s}
.btn_goTop a:after{margin-left:14px; transform:rotate(45deg); -webkit-transform:rotate(45deg)}
.btn_goTop a:before{transform:rotate(-45deg); -webkit-transform:rotate(-45deg)}
.btn_goTop a:hover:after,
.btn_goTop a:hover:before{bottom:35px}

/*******************************************************************************************************************/


@media screen and (min-width:801px){	
	.dp_mb{display:none}
	.pc_block{display:block}
	header{border-bottom:1px solid #e5e5e5}
	header nav{padding-right:130px}
	header nav>ul>li{display:inline-block; position:relative; vertical-align:top; padding-right:5%; letter-spacing:0px}
	header nav>ul>li:last-child{padding-right:0px}
	header nav>ul>li>a{display:inline-block; position:relative; padding:39px 0px; font:500 1.47em 'Gmarket'; color:#252525; word-break:keep-all}
	header nav>ul>li.select>a,
	header nav>ul>li:hover>a{color:#ff5400; text-decoration:none}
	header nav>ul>li.select>a:after{display:block; content:''; position:absolute; bottom:-2px; width:100%; height:4px; border-radius:10px; background:#ff5400; z-index:900}
	header nav>ul ul{display:none; position:absolute; padding:15px 0px; width:90%; z-index:900}
	header nav>ul>li:hover ul{font-weight:bold}
	header nav>ul ul>li{padding:7px 0px 7px 3px; border-top:1px dotted #888; white-space:normal; word-break:keep-all; word-wrap:break-word}
	header nav>ul ul>li:first-child{border-top:0px}
	header .submenuBg{display:none; position:absolute; left:0px; width:100%; margin-top:1px; height:160px; background:#f0f0f0; z-index:899; box-shadow:0px 3px 3px rgba(0,0,0,.2)}
	header .gnb{position:absolute; right:6.3%; top:40px}
	header .gnb li{display:inline; margin-left:20px}
	header .gnb li a{padding-left:23px; padding-bottom:1px;}
	header .gnb li .seo{background:url('/open_content/support/img/gnb_seo.gif') left center no-repeat}
	header .gnb li .login{padding-left:18px; background:url('/open_content/support/img/gnb_login.gif') left 2px no-repeat}
}
@media screen and (max-width:1800px){
	header nav{padding-right:0px; white-space:nowrap}
	header .gnb{position:static; text-align:right}
	header nav>ul>li{padding-right:3.5vw}
	header nav>ul>li>a{font-size:1.4vw}

}
@media screen and (max-width:1400px){
	html, body, div, object, iframe, h1, h2, h3, h4, h5, h6, p, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, canvas, details, figcaption, summary, time, mark, audio, video{font-size:15.5px}
	#wrap{padding-left:27%}
	.wrapper{margin:auto; width:92%}
	aside{width:27%}
	aside .siteName span{font-size:3.4vw}
	aside .siteName span:first-child{font-size:1.57vw}
	header nav>ul>li{padding-right:2.7vw}
	header nav>ul>li>a{font-size:1.7vw}
	header .gnb{position:relative; text-align:right; top:10px; right:5px }
}

@media screen and (max-width:800px){	
	.dp_pc{display:none}
	.mb_block{display:block}
	#wrap{padding-left:0px}

	aside{position:absolute; width:100%; height:100vh; min-height:550px; background-size:200%}
	aside h1{text-align:center; padding-top:17vh}	
	aside .siteName span{font-size:13vw}
	aside .siteName span:first-child{font-size:6vw}
	aside.fixedT{position:fixed; text-align:left; overflow:hidden; height:80px; min-height:80px; background-size:500%; box-shadow:0px 1px 5px rgba(0,0,0,.1)}
	aside.fixedT>a{margin:20px 0px 0px 20px}
	aside.fixedT h1{float:left; margin-right:20px; padding-top:0px; width:40px}
	aside.fixedT h1 img{width:100%}
	aside.fixedT .siteName{float:left; margin-top:3px; text-align:left}
	aside.fixedT .siteName span{display:inline; font-size:25px}
	aside.fixedT .siteName span:first-child{display:none}
	aside.fixedT .btn_participate{display:none}
	aside.fixedT .copy{display:none; !important}

	header h2{position:fixed; right:15px; top:15px; z-index:900}
	header h2 a{display:block; width:50px; height:50px; text-indent:-5000px/* ; border:1px solid #ddd; */}
	header h2 a:After{display:block; content:''; position:absolute; top:15px; left:7px; width:36px; height:4px; border-radius:2px; background:#fff; box-shadow:0px 10px #fff, 0px 20px #fff}
	header .nav_top{display:none; position:fixed; top:0px; left:0px; text-align:center; padding:30px; width:100%; height:190px; background:url(../img/inc/bg_aside.jpg) no-repeat left top/cover; box-sizing:border-box; z-index:901}	
	header .nav_top span{display:block; color:#fff}
	header .nav_top img{width:60px; }
	header nav{position:fixed; left:0px; top:0px; width:100%; height:100%; background:#fff; z-index:900}
	header nav>ul{padding:190px 20px 0px; overflow:hidden}
	header nav>ul>li{float:left; margin:30px 3% 0px; padding:0%; width:44%}
	header nav>ul>li>a{display:block; text-align:center; padding:10px 7px; border-radius:5px; border:2px solid #333; background:#f5f5f5; font-weight:bold; font-size:17px}
	header nav>ul>li.select>a{background:#ff8000; color:#fff}
	header nav>ul>li ul>li{border-top:1px dashed #ccc}
	header nav>ul>li ul>li:first-child{margin-top:7px; border-top:0px}
	header nav>ul>li ul>li.select{font-weight:bold}
	header nav>ul>li ul>li>a{display:block; padding:5px}
	header nav>ul>li ul>li>a:before{display:inline; content:'- '}
	header .gnb{position:fixed; margin:auto; left:0px; right:0px; top:140px; width:100%; text-align:center; z-index:903}
	header .gnb li{display:inline-block}
	header .gnb li a{display:block; padding:0px 20px; border-radius:50px; border:2px solid #fff; color:#fff; font-weight:bold}
	header .gnb li:last-child a{background:#fff; color:#222}
	header .btn_close{position:fixed; right:15px; top:15px; z-index:902}
	header .btn_close a{display:block; width:50px; height:50px; text-indent:-5000px}
	header .btn_close a:before,
	header .btn_close a:after{display:block; content:''; position:absolute; top:50%; left:25%; width:30px; height:4px; border-radius:10px; background:#fff; transform:rotate(45deg); -webkit-transform:rotate(45deg)}
	header .btn_close a:after{transform:rotate(-45deg); -webkit-transform:rotate(-45deg)}

	.btn_goTop{margin-top:-30px; background:#f0f0f0; }
	.btn_goTop a{top:0px}


	/* 	
	header nav:After{display:block; content:''; position:absolute; left:0px; top:0px; width:35%; height:100%; background:#f9f9f9; z-index:899}
	header nav>ul{position:relative; right:0px; padding:160px 0px 0px; z-index:900}
	header nav>ul>li{clear:both; border-bottom:1px solid #e5e5e5; overflow:hidden}
	header nav>ul>li>a{float:left; padding:15px 20px; width:35%; font-weight:bold; box-sizing:border-box}
	header nav>ul>li>ul{float:right; padding:10px 0px; width:65%}
	header nav>ul>li>ul>li a{display:block; padding:3px 20px} */
}