@charset "utf-8";
@import url("font.css");

html{height: 100%}
body{width:100%; font-size:14px; background:url('bg.jpg')0 0 no-repeat; background-size:100% 100%}
body, input, select, textarea, button{font:14px/1.5 'NanumGothic',dotum,"돋움","굴림", Gulim,sans-serif; color:#333;}

#wrap{}
#wrap h1{text-align:center; margin:5% auto 4%}
#wrap .contents{width:990px; height:510px; background:rgba(255,255,255,0.9); margin:0 auto; padding:30px 40px; border-radius:20px; box-shadow:20px; box-shadow:0px 0px 30px 0px rgba(0,0,0,0.1); box-sizing:border-box}
#wrap .contents .left{width:620px; float:left}
#wrap .contents .right{width:260px; float:right}

#wrap .contents h2{font-weight:bold; font-size:20px; color:#063879;}

#wrap .contents .wrap_table{height:400px; margin:10px auto; text-align:center;}
#wrap .contents .wrap_table_l{overflow-y:scroll;}
#wrap .contents .wrap_table_l table{width:49%; margin-left:2%;}
#wrap .contents .wrap_table_l table:first-child{margin-left:0}
#wrap .contents .wrap_table_l table{max-height:inherit; float:left}
#wrap .contents .wrap_table table{text-align:center; border-bottom:1px solid #ccc;}
#wrap .contents .wrap_table table.table02 tbody td{text-align:left; padding:12px 10px}
#wrap .contents .wrap_table table thead{border-top:2px solid #063879; border-bottom:2px solid #063879}
#wrap .contents .wrap_table table thead th{color:#063879; padding:5px 0; border-top:1px solid #063879;}
#wrap .contents .wrap_table table tbody tr{border-top:1px solid #a0bce0}
#wrap .contents .wrap_table table tbody tr:first-child{border-top:0}
#wrap .contents .wrap_table table tbody th{padding:5px;}
#wrap .contents .wrap_table table tbody td{padding:5px 2px;}
#wrap .contents .wrap_table table tbody td a{width:100%; height:100%; vertical-align:middle; font-size:13px; color:#063879; padding:4px 14px; border:1px solid #a8b9ce;}
#wrap .contents .wrap_table table tbody td a:hover{font-weight:bold; border:1px solid #063879}

#wrap .contents .wrap_table button{font-weight:bold; font-size:0.9rem; color:#fff; background:#749cf1; margin-top:30px; padding:12px 30px; border-radius:5px}


@media screen and (max-width:768px){

	#wrap h1{text-align:center; margin:20px auto}
	#wrap h1 img{width:32%;}

	#wrap .contents{width:100%; height:100%; background:#fff;padding:0 0 30px; border:0 none; border-radius:0;overflow:hidden}
	#wrap .contents .left,
	#wrap .contents .right{width:100%; clear:both}

	#wrap .contents h2{font-size:1.1rem; margin:20px 10px 0; border-radius:0;}
	#wrap .contents .right h2{margin-top:20px}

	#wrap .contents .wrap_table{height:100%; margin:10px; overflow:visible;}
	#wrap .contents .wrap_table_l table{width:100%; margin-left:0; margin-bottom:10px}
}