@charset "UTF-8";





#wrap {
	min-width:320px;
}

#header {
	position:fixed;z-index:99999;width:100%;height:55px;
}

#gnb {
	position:fixed;z-index:99998;width:60px;height:100%;height:calc(100% - 55px);margin-top:55px;
}

#menu {
	position:fixed;z-index:99997;width:180px;height:100%;height:calc(100% - 55px);left:60px;margin-top:55px;
}

#container {
	padding-top:55px;margin-left:240px;width:100%;width:calc(100% - 240px);
}

#content {
	min-width:320px;
}

#footer {
	position:fixed;bottom:0;left:240px;width:100%;width:calc(100% - 240px);height:25px;bottom:-25px;
}












.header_guide {
	float:left;width:100%;height:52px;
	border-bottom:3px solid #6699cc;
	background:#333333;background-image:linear-gradient(to bottom,#555555,#333333);
	color:#ffffff;
	font-size:13px;
}

.header_guide >div {float:left;margin:5px 10px 5px 8px;}
.header_guide >div button {display:block;border:0;border-radius:0;cursor:pointer;padding:2px 5px;color:#000000;background:#d5d5d5;background-image:linear-gradient(to bottom,#f5f5f5,#d5d5d5);}
.header_guide >div button:hover,
.header_guide >div button:focus {background-image:linear-gradient(to bottom,#d5d5d5,#f5f5f5);}
.header_guide >div button >span:first-of-type{display:inline;}
.header_guide >div button >span{display:none;margin-left:2px;}

.header_guide >h1 {float:left;font-size:0;line-height:0;width:288px;height:50px;background:url(../../images/ubee/logo.png) center center no-repeat;background-size:contain;}

.header_guide >p {float:right;margin:20px 20px 0 0;}

.header_guide:after {clear:both;}












.footer_guide {
	width:100%;height:25px;line-height:25px;
	background:#ffc1c1;color:#555555;
	font-size:10px;
	transition:.3s;
	text-align:center;
}

.footer_guide p{text-align:center;font-weight:100;margin-right:10px;}
.footer_guide p a{color:inherit;text-decoration:none;}












.menu_button_guide {
	width:60px;height:100%;
	background:#e7e7e7;background-image:linear-gradient(to right,#e7e7e7,#ffffff);
}

.menu_button_guide button{width:60px;height:65px;background-image:linear-gradient(to right,#ffffff,#e7e7e7);color:#666666;display:block;border:0;border-top:1px solid #ffffff;border-bottom:1px solid #dddddd;border-radius:0;font-size:.9em;cursor:pointer;}
.menu_button_guide button:hover,
.menu_button_guide button:focus{background-image:linear-gradient(to right,#e7e7e7,#ffffff);}
.menu_button_guide button.on{background:#336699;background-image:linear-gradient(to right,#6699cc,#336699);color:#ffffff;border-top:1px solid #6699cc;}

.menu_button_guide button:first-child, .menu_button_guide button:first-child.on{border-top:0;}

.menu_button_guide button svg{margin-bottom:2px;}







.menu_guide {
	width:180px;height:100%;
	background:#336699;
	transition:.3s;
	overflow-y:auto;
}

.menu_guide a{color:#e0e0e0;text-decoration:none;cursor:pointer;display:block;padding:0 10px;transition:.2s;}
.menu_guide a:hover,
.menu_guide a:focus{background-color:#1a234e;color:#ffffff;}
.menu_guide a.on{background-color:#6699cc;color:#ffffff;}
.menu_guide a.on:hover,
.menu_guide a.on:focus{color:#ffff77;}

.menu_guide ol{display:none;list-style:none;transition:.3s;}

.menu_guide ol.on{display:block;}

.menu_guide >ol>li >a{font-size:1.1em;line-height:2.2em;border-top:1px solid #4477aa;border-bottom:1px solid #225588;}
.menu_guide >ol>li >ol{background:#225588;border-bottom:1px solid #114477;}

.menu_guide >ol>li >ol>li >a{font-size:1.0em;line-height:2.4em;padding-left:1.8em;background:url(../../images/ubee/next01.gif) 14px 12px no-repeat;}
.menu_guide >ol>li >ol>li >ol{background:#184877;}
.menu_guide >ol>li >ol>li >ol>li{border-bottom:1px solid #114477;}

.menu_guide >ol>li >ol>li >ol>li >a{font-size:.95em;line-height:2.2em;padding-left:2.0em;}
.menu_guide >ol>li >ol>li >ol>li >a:before{content:"ㄴ ";}
.menu_guide >ol>li >ol>li >ol>li >ol{background:#114477;padding-bottom:0.9em;}

.menu_guide >ol>li >ol>li >ol>li >ol>li >a{font-size:.9em;line-height:2.2em;padding-left:3.0em;}
.menu_guide >ol>li >ol>li >ol>li >ol>li >a:before{content:"ㄴ ";}







.title_guide {background:#dddddd;background-image:linear-gradient(to bottom,#f8f8f8,#dddddd);}
.title_guide h3{display:inline-block;font-size:18px;margin:10px 0 10px 20px;color:#000000;}
.title_guide ul{float:right;list-style:none;margin:20px 20px 0 0;}
.title_guide li{float:left;font-size:.9em;margin-left:5px;font-weight:300;}
.title_guide li:before{content:">";margin-right:5px;color:#555555;}
.title_guide li:first-child:before {margin-left:0;}
.title_guide li:first-child:before {content:none;margin-right:0;}
.title_guide li:last-child{color:#ff6600;font-weight:400;}

.title_guide:after{clear:both;}




.content_guide {padding:30px 20px;}





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

	.header_guide h1{display:none;}
	.title_guide ul{margin:0 20px 0;}

}

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

}