body{background:#00a0e9}
.in,.out{-webkit-animation-duration: 500ms !important}


#header{position:fixed;top:0;left:0;border-top:5px solid #00a0e9;z-index:5;width:100%;background:url('/images/background.jpg') top center;background-size:cover;z-index:100}

#header .logo{height:50px}
#header .logo a.left{float:left;color:#fff;background:url('/images/arrow_left.png') no-repeat left center;background-size:22px 22px;text-decoration:none;line-height:28px;margin:11px 0 0 5px;padding-left:28px;font-size:16px;color:#999}
#header .logo a.right{float:right;color:#00a0e9;text-decoration:none;line-height:28px;margin:11px 5px 0 0;font-size:16px;padding-right:3px}
#header .logo a.right:hover,#header .logo a.right:focus{color:#00a0e9;transition:all 0.2s ease-out}
#header .logo .title{padding:9px 10px 5px 10px;height:30px;font-size:18px;color:#fff;font-weight:bold;text-align:center;margin-bottom:-44px;line-height:31px}
#header .logo .title a.emblem{display:block;margin:0 auto;width:40px;height:24px;margin:0 auto;background:url('/images/emblem.png') transparent no-repeat;background-size:100% 100%}

#header .login_window{position:absolute;top:15px;right:10px;background:#00a0e9;padding:13px;width:170px;display:none}
#header .login_window form{position:relative}
#header .login_window .error{padding:10px 0 5px 0;line-height:1.5;color:yellow;border-top:1px solid #ccc;margin-top:10px}
#header .login_window .input_wrap{padding:10px;margin-bottom:10px}
#header .login_window .input_wrap input{border-radius:0;padding:10px;margin:-10px;border:none;background:#fff;width:100%;font-size:14px}
#header .login_window .remember{text-align:right;color:#ccc;display:block;text-decoration:none}
#header .login_window label{cursor:pointer;display:block}
#header .login_window .remember i{display:none;margin-right:3px}
#header .login_window .remember.active{color:#fff}
#header .login_window .remember.active i{display:inline}
#header .login_window .submit button{-webkit-appearance:none;background:#222;padding:10px 0;color:#fff;font-size:14px;width:100%;border:none;cursor:pointer}
#header .login_window .menus{border-top:1px solid #ccc;padding-top:8px;margin-top:10px}
#header .login_window .menus a{color:#fff;display:block;padding:2px 0;text-decoration:none}
#header .login_window .whycant{font-size:12px;color:#fff;line-height:1.5}
#header .login_window .whycant ul{list-style:disc;margin:5px 0 5px 17px}

#background{width:100%;height:100%;z-index:-1;position:fixed;top:0;left:0;background:url('/images/background.jpg') center center;background-size:cover}

#body{margin-top:55px}
#body .content:not(.index){min-height:1000px}

#body .input_wrap{padding:10px 10px 10px 100px;background:#fff;border-bottom:1px solid #ddd;position:relative}
#body .input_wrap label{position:absolute;top:12px;left:0;border-right:1px;width:65px;border-right:1px solid #ccc;color:#555;font-size:16px;padding:0 10px;line-height:20px}
#body .input_wrap input{padding:10px 10px 10px 100px;margin:-10px -10px -10px -100px;background:transparent;border:none;width:100%;font:inherit;font-size:16px;line-height:24px}
#body .input_wrap.won:before{position:absolute;top:12px;left:95px;content:"₩";font-size:16px;color:#999}
#body .input_wrap.won input{text-align:right}
#body .input_wrap textarea{padding:10px;margin:-10px;background:transparent;border:none;width:100%;font:inherit;font-size:16px;line-height:1.5;height:59px;transition:all 0.2s ease-out}
#body .input_wrap .color{position:absolute;top:0;right:0;width:100px;height:100%;transition:all 0.2s ease-out}

#body .line_wrap{padding:10px;background:#fff;border-bottom:1px solid #ddd;position:relative}
#body .line_wrap label{border-bottom:2px solid #00a0e9;color:#555;font-size:13px;line-height:20px;display:inline-block}
#body .line_wrap .line{background:transparent;border:none;font:inherit;font-size:16px;line-height:24px}
#body .line_wrap .line.won{padding-left:20px}
#body .line_wrap .line.won:before{position:absolute;top:36px;left:10px;content:"₩";font-size:16px;color:#999}
#body .line_wrap .line .tag{background:#999;color:#fff;padding:2px 5px;font-size:12px;position:relative;top:-2px}
#body .line_wrap .line .na{color:#ddd}

#body .select_wrap{padding:9px 10px 0 100px;position:relative;border-bottom:1px solid #ddd}
#body .select_wrap label{position:absolute;top:12px;left:0;border-right:1px;width:65px;border-right:1px solid #ccc;color:#555;font-size:16px;padding:0 10px;line-height:20px}
#body .select_wrap a{text-decoration:none;color:inherit;line-height:22px;margin-right:15px;font-size:16px;white-space:nowrap;position:relative;top:-10px}
#body .select_wrap a span{border-radius:100px;border:2px solid #00a0e9;display:inline-block;width:22px;height:22px;text-align:center;color:#fff;margin:10px 2px 0 0;background:#00a0e9;position:relative;top:2px}
#body .select_wrap#grade a span{border:none;width:26px;height:26px;background-size:100% 100%;background-color:#fff;margin-top:11px}
#body .select_wrap a:not(.active) span{background-color:#fff !important;border-color:#ddd !important}
#body .select_wrap#grade a:not(.active) span{opacity:0.3}
#body .select_wrap#grade a span i{visibility:hidden}
#body .select_wrap a:not(.active) span i{visibility:hidden}

#body .category_wrap{padding:0 0 0 87px;background:#fff;border-bottom:1px solid #ddd;position:relative}
#body .category_wrap label{position:absolute;top:12px;left:0;border-right:1px;width:65px;color:#555;font-size:16px;padding:0 10px;line-height:20px}
#body .category_wrap .wrap{position:relative}
#body .category_wrap .sup{float:left;width:50%;border-left:1px solid #ddd;margin:12px 0 12px -2px}
#body .category_wrap .sub{float:left;width:50%;border-left:1px solid #ddd;margin:12px 0 12px 0}
#body .category_wrap .sub div{display:none}
#body .category_wrap a{display:block;text-decoration:none;padding:10px 13px;color:#555;font-size:16px;white-space:nowrap;overflow:hidden}
#body .category_wrap a.active{background:#00a0e9;color:#fff}
#body .category_wrap a:first-child{margin-top:-8px}
#body .category_wrap a:last-child{margin-bottom:-8px}

#body .location_wrap{padding:0 0 0 87px;background:#fff;border-bottom:1px solid #ddd;position:relative}
#body .location_wrap .wrap{position:relative;max-width:400px}
#body .location_wrap label{position:absolute;top:12px;left:0;width:65px;color:#555;font-size:16px;padding:0 10px;line-height:20px}
#body .location_wrap .image img{width:100%}
#body .location_wrap .cells{position:absolute;width:100%;height:100%;top:0;left:-2px;border-left:1px solid #ddd}
#body .location_wrap .cells a{width:10%;height:10%;float:left;display:block;margin:-1px;border:1px dashed #eee;position:relative}
#body .location_wrap .cells a.active{border:2px solid #333;z-index:10;margin:-2px}

#body .description{padding:13px;background:#eee;border-bottom:1px solid #ddd;line-height:1.6;font-size:12px;color:#999}

#section_index{margin-top:-49px}
#section_index .search{padding:10px 15px;background:#555;position:relative}
#section_index .search input[type=text]{width:100%;margin:-10px -15px;padding:10px 15px;background:transparent;border:none;font-size:15px;color:#fff;border-radius:0;line-height:20px}
#section_index .search input[type=image]{position:absolute;top:0;right:0;padding:10px;width:20px;height:20px}
#section_index .hello{font-size:17px;color:#fff;background:#333;padding:40px 0 35px 0;line-height:1.7;text-align:center}
#section_index .hello a{color:#fff;text-decoration:none}
#section_index .hi{font-size:13px;color:#ddd;background:#333;padding:30px 0 0 0;margin:30px 20px 0 20px;line-height:1.7;text-align:center;border-top:1px solid #555}
#section_index .hi img{height:15px;vertical-align:baseline;margin:0 0 -1px 3px}
#section_index .content{background:#fff;position:relative;z-index:10}

#section_index .stats{padding:0 10px}
#section_index .stats .count{border-bottom:1px solid #ddd;margin-left:0;padding:15px 0 15px 0;width:33.3%;float:left;text-align:center}
#section_index .stats .count h5{font-weight:normal;color:#999;font-size:14px;padding:5px 0}
#section_index .stats .count .number{font-size:40px;margin:5px auto;padding-bottom:5px;letter-spacing:-1px;font-family:"Raleway" !important;width:100px;line-height:95px;height:95px;border-radius:200px;border:2px solid #00a0e9;text-align:center}
#section_index{}
#section_index .banner{}
#section_index .banner .logo{float:right;padding:28px 17px 20px 20px}
#section_index .banner .logo a{display:block;width:221px;height:50px;background:url('/images/logo.png') transparent no-repeat;background-size:100% 100%}
#section_index .banner .labels{padding:180px 0 20px 0;min-height:240px}
#section_index .banner .labels div{padding:15px 15px}
#section_index .banner .labels a{padding:5px 7px;background:rgba(0,0,0,0.6);color:#fff;font-size:18px;text-decoration:none}
#section_index .banner .labels a.menu{color:#dbb471}

#section_category .content{background:#fff}
#section_category .cell.big .input_wrap{background:#eee;border-left:3px solid #00a0e9;border-top:none}
#section_category .cell.big .input_wrap label{color:#00a0e9;font-weight:bold}
#section_category .cell.big .input_wrap label a{text-decoration:none;color:#00a0e9;display:block}
#section_category .cell.small{float:left;width:50%}
#section_category .cell.small .input_wrap{border-top:none}
#section_category .cell.small .input_wrap:nth-child(odd){border-left:1px solid #ddd}
#section_category .cell.small .input_wrap label a{color:#555;text-decoration:none;font-size:16px;display:block}

#section_list .content{background:#fff}
#section_list .cell{border-bottom:1px solid #ddd}
#section_list .cell a{display:block;padding:10px 7px 12px 10px;text-decoration:none;color:#000}
#section_list .cell a .name{display:block;font-size:16px;margin-bottom:5px;line-height:1.5}
#section_list .cell a .option{display:block}
#section_list .cell a .option span{color:#999}
#section_list .cell a .option .code{padding:2px 4px;color:#fff;background:#00a0e9;font-weight:bold;font-family:monospace;margin:0 4px 0 -2px}
#section_list .cell a .option .date{color:#bbb}
#section_list .cell a .option .tag{float:right}
#section_list .cell a .option .allow{color:#00a0e9}
#section_list .cell a .option .deny{color:#ddd}
#section_list .nextpage{text-align:center;padding:15px 0 30px 0;color:#bbb;display:block;text-decoration:none;background:url('/images/arrow_down.png') no-repeat center 30px;background-size:12px 12px;}

#section_insert .content{background:#fff}

#section_detail .content{background:#fff}
#section_detail .background{width:100%;height:255px;z-index:1;position:fixed;top:0;left:0;background:url('/images/background.jpg') center 5px;background-size:100% auto}
#section_detail .meta{height:200px;position:relative;z-index:2}
#section_detail .meta .name{font-weight:normal;color:#fff;font-size:25px;padding:30px 10px 10px 10px}
#section_detail .meta .detail{padding:0 10px;color:#999}
#section_detail .meta .detail .code{padding:2px 4px;color:#fff;background:#00a0e9;font-weight:bold;font-family:monospace;margin-right:5px}
#section_detail .meta .location{position:absolute;bottom:10px;right:10px;border:1px solid #ddd;width:100px;height:100px}
#section_detail .meta .location img{width:100px;height:100px;background:#fff}
#section_detail .meta .location .cell{position:absolute;background:red;width:10%;height:10%;border-radius:50px;opacity:.5}
#section_detail .meta .location .room{position:absolute;top:-20px;right:0;color:#ddd}
#section_detail .meta .grade{position:absolute;bottom:12px;left:12px;width:26px;height:26px;background-size:100% 100%}
#section_detail .meta .grade.grade3{background-image:url('/images/grade3.png')}
#section_detail .meta .grade.grade4{background-image:url('/images/grade4.png')}

#section_detail .detail_wrap{position:relative;z-index:2}
#section_detail .add_btn{position:absolute;top:10px;right:10px;color:#00a0e9;font-size:13px;line-height:20px;text-decoration:none}
#section_detail .lent{display:block;background:#00a0e9;color:#fff;padding:15px 0 15px 2px;font-size:16px;text-align:center;text-decoration:none;letter-spacing:2px;font-weight:bold}
#section_detail .lent.deny{background:#999}
#section_detail .lent.return{background:#e80000}

#section_detail .logs{background:#eee;border-bottom:1px solid #ddd;padding:0;position:relative}
#section_detail .logs label{border-bottom:2px solid #00a0e9;color:#555;font-size:13px;line-height:20px;display:inline-block;margin:10px 10px 0 10px}
#section_detail .logs ul{padding:8px 0 10px 0;font-size:13px}
#section_detail .logs li{line-height:1.5;padding:5px 10px}
#section_detail .logs li p{background:#ddd;padding:5px;margin:3px -5px}
#section_detail .logs li p.image{padding:0;background:transparent;margin:3px -5px 0 -5px}
#section_detail .logs li p.image img{width:100%;height:auto}
#section_detail .logs .option{display:block;font-size:12px}
#section_detail .logs .option span{color:#999}
#section_detail .logs .option .date{color:#bbb}
#section_detail .logs .option .tag{float:right}
#section_detail .logs .option .allow{color:#00a0e9}
#section_detail .logs .option .deny{color:#ccc}
#section_detail .logs .na{color:#ddd;padding:10px 10px 15px 10px;font-size:16px}

#section_detail .comment_wrap{margin-top:10px;display:none}
#section_detail .comment_wrap .input{padding:10px 100px 10px 10px;background:#fff;border-bottom:1px solid #ddd;border-top:1px solid #ddd;position:relative}
#section_detail .comment_wrap .input textarea{padding:10px 100px 10px 10px;margin:-10px -100px -10px -10px;background:transparent;border:none;width:100%;font:inherit;font-size:16px;line-height:24px;line-height:1.3;resize:vertical}
#section_detail .comment_wrap .input button{border:none;width:90px;position:absolute;top:0;right:0;cursor:pointer;margin:0;padding:0;height:100%;display:table;background:#999}
#section_detail .comment_wrap .input button span{width:90px;height:100%;font-size:16px;line-height:24px;display:table-cell;color:#fff;vertical-align:middle;text-align:center}
#section_detail .comment_wrap .description{padding:10px}
#section_detail .comment_wrap .add_btn{position:static;top:auto;left:auto;float:right}
#section_detail .image_wrap{display:none}

#footer{position:relative;padding:10px 15px;line-height:1.7;z-index:4;background:#fff}
#footer address{font-style:normal;color:#999}
#footer a{color:inherit;text-decoration:none}
#footer .sponsor{text-align:center}
#footer .sponsor img{vertical-align:top;height:14px;margin-top:5px}
#footer .sponsor a{margin-left:15px}

#relogin{position:fixed;bottom:10px;right:10px;width:196px;z-index:10000;display:none}
#relogin iframe{width:196px;height:320px}

@media only screen and (min-width:801px){
	#section_index .banner .logo{float:left}	
	#section_index .search{position:absolute;width:370px;top:-488px;right:0;z-index:11}
	#section_index .hello{position:absolute;width:400px;top:-488px;right:0;z-index:10}
	#section_index .hello a{display:block;height:53px;padding:158px 0 118px 0}

	#section_detail .detail_wrap{background:#fff}
	#section_detail .metas{width:50%;float:left}
	#section_detail .metas .line_wrap:last-child{border-bottom:0}
	#section_detail .logs{width:50%;min-height:360px;float:right;border-left:1px solid #ddd;margin-left:-1px;border-bottom:none}
	#section_detail .lent{width:300px;position:absolute;top:-57px;left:10px}
	
	#section_detail{border-bottom:1px solid #ddd}
}

@media only screen and (max-width:800px){
}