@charset "utf-8";
@import url(https://fonts.googleapis.com/earlyaccess/nanumgothic.css); 

body{padding:10px;}
.layout_container{width:712px;margin:20px auto;overflow:hidden;font-family:"Nanum Gothic";font-size:12px;}
.layout_container ul{margin:0;padding:0;}
.layout_container li{list-style:none;}

.layout_container .header{width:192px;margin-right:20px;padding:20px;border:5px solid #eee;float:left;font-family:"맑은 고딕", "Nanum Gothic";letter-spacing:3px;position:fixed;}
	/* .layout_container .header:after{content:"";width:0;height:0;border:17px solid #eee;border-right:0;border-top-color:transparent;border-bottom-color:transparent;position:absolute;top:0;right:-17px;} */
	
.layout_container .header .title{font-weight:bold;}
.layout_container .header .title p{margin:5px 0;}
	.layout_container .header .title p:first-of-type{margin-top:0 !important;}
	.layout_container .header .title p:last-of-type{margin-bottom:0 !important;}
	
.layout_container .header .menu{display:block;margin-top:20px;text-align:right;text-transform:uppercase;}
	.layout_container .header .menu li{margin:7px 0;}
	.layout_container .header .menu button{padding:0;border:0;background:transparent;font-family:"맑은 고딕", "Nanum Gothic";text-transform:uppercase;letter-spacing:3px;outline-style:none;cursor:pointer;}
	.layout_container .header .menu button:hover, .layout_container .menu button:active{letter-spacing:8px;color:#aaa;text-shadow:orange 3px 0px 0;transition: all .3s ease;}
	.layout_container .header .menu ul li a, .layout_container .menu ul li a:link, .layout_container .menu ul li a:visited{text-decoration:none;color:#000;}
	.layout_container .header .menu ul li a:hover, .layout_container .menu ul li a:active{letter-spacing:8px;color:#aaa;text-shadow:orange 3px 0px 0;transition: all .3s ease;}
	.layout_container .header #mobile_menu{display:none;}

.layout_container .header .menu #search_area{padding-top:10px;}
	.layout_container .header .menu #search_area form input{outline-style:none;}
	.layout_container .header .menu #search_area form input[type="text"]{width:88%;padding-bottom:5px;border:0;border-bottom:1px solid #eee;font-family:"맑은 고딕", "Nanum Gothic";letter-spacing:3px;}
	.layout_container .header .menu #search_area form .search_btn{background:transparent;border:0;padding:0;font-family:xeicon;font-size:15px;color:#aaa;}
	.layout_container .header .menu #search_area form .search_btn:hover, .layout_container .header .menu #search_area form .search_btn:active{color:orange;transition: all .3s ease;}
	
.layout_container .header .menu #login_area{padding-top:10px;letter-spacing:0;text-transform:capitalize;}
	.layout_container .header .menu #login_area form input{outline-style:none;}
	.layout_container .header .menu #login_area form input[type="text"], .layout_container .header .menu #login_area form input[type="password"]{width:100%;padding-bottom:5px;border:0;border-bottom:1px solid #eee;font-family:"맑은 고딕", "Nanum Gothic";letter-spacing:3px;}
	.layout_container .header .menu #login_area form input[type="password"]{margin-top:5px;}
	.layout_container .header .menu #login_area fieldset{margin:0;padding:0;border:0;}
	.layout_container .header .menu #login_area a:hover, .layout_container .menu #login_area a:active{letter-spacing:0.5px;text-shadow:orange 1.5px 0px 0;}
	.layout_container .header .menu #login_area button{letter-spacing:0;text-transform:capitalize;}
	.layout_container .header .menu #login_area button:hover, .layout_container .header .menu #login_area button:active{letter-spacing:0.5px;text-shadow:orange 1.5px 0px 0;}
	.layout_container .header .menu #login_area div{margin-bottom:5px;}
	.layout_container .header .menu #login_area .login_menu a{margin-right:3px;}
	.layout_container .header .menu #login_area .login_btn{margin-right:3px;}
	.layout_container .header .menu #login_area input[type=checkbox]{display:none;} 
		.layout_container .header .menu #login_area input[type=checkbox] + label:before{margin-right:3px;font-family:xeicon;content: "\e6e0";font-size:15px;color:#aaa;} 
		.layout_container .header .menu #login_area input[type=checkbox]:checked + label:before{font-family:xeicon;content: "\e6e0";font-size:15px;color:orange;transition: all .3s ease;} 
	
.layout_container .contentWrap{width:450px;float:right;}
.layout_container .contentWrap>.content{padding:20px;border:3px solid orange;line-height:1.5;font-family:'Nanum Gothic';}
.xe_content{font-family:'Nanum Gothic';}

.layout_container .footer{margin-top:10px;text-align:left;color:#777;font-family:"맑은 고딕", "Nanum Gothic";font-size:11px;letter-spacing:3px;line-height:2;}
	.layout_container .footer #top{font-size:12px;margin-top:12px;margin-bottom:20px;cursor:pointer;}
	.layout_container .footer #top:hover{letter-spacing:10px;transition: all .3s ease;}
	
	
@media screen and (max-width:719px){
	body{padding:0;}
	.layout_container{width:100%;margin:5px auto;}
	.layout_container .header{width:auto;margin:0;margin-bottom:10px;float:none;position:relative;}
		.layout_container .header:after{display:none;}
	.layout_container .header .menu{display:none;}
	.layout_container .header #mobile_menu{display:block;position:absolute;top:16px;right:20px;color:orange;font-size:2.5em;}
	.layout_container .contentWrap{width:100%;float:none;}
}
