@charset "utf-8";
@import url("default.css?v=1.0.1");
@import url("common.css?v=1.0.1");
@import url("popup.css?v=1.0.1");

/* 메인 공통 */
html, body {background:url(../images/main/bg_main.png) no-repeat center 0; background-size:cover;}
#header {background:none;}
#header h1 span {color:#fff;}
#header .util p {color:#fff;}
#footer {background:none; border-top:none;}
#footer p {color:#aaa;}

/**/
#container .outer {padding-bottom:0;}
#container .inner {vertical-align:bottom;}
#container p {position:absolute; top:50%; left:54px; margin-top:-100px; font-size:40px; font-weight:700; color:#fff;}
#container p span {font-size:18px; font-weight:300; display:block; padding-top:25px;}
#container ul:after {content:""; display:block; height:0; visibility:hidden; clear:both;}
#container ul li {float:left; width:33.33%; position:relative;}
#container ul li.two {width:33.34%;}
#container ul.sizeOne li {width:100%;}
#container ul.sizeTwo li {width:50%;}
#container ul li a {display:block; height:122px; background:#292928; background:rgba(33,33,33,0.9); color:#fff; position:relative; transition:all 0.2s;}
#container ul li a:hover {background:rgba(33,33,33,0.8); box-shadow:0px 0px 7px rgba(0,0,0,0.5); z-index:2;}
#container ul li a .tit {display:block; padding-left:30px; font-size:18px; font-weight:500; padding-top:50px;}
#container ul li a .txt {position:absolute; top:53px; right:30px; color:#7c7c7c; font-size:15px; font-weight:300;}
#container ul li.two a {background:#a42b2a; background:rgba(169,37,39,0.9);}
#container ul li.two a .txt {color:#e39c9e;}
#container ul li.two a:hover {background:rgba(169,37,39,0.8);}

#container ul li.one a {background:#292928; background:rgba(33,33,33,0.9);}
#container ul li.one a .txt {color:#7c7c7c;}
#container ul li.one a:hover {background:rgba(33,33,33,0.8);}

#container ul li.three a {background:#3a4656; background:rgba(51,65,84,0.9);}
#container ul li.three .txt {color:#798fab;}
#container ul li.three a:hover {background:rgba(51,65,84,0.8);}
#container ul li.three a {background:#3a4656; background:rgba(51,65,84,0.9);}
#container ul li.three .txt {color:#798fab;}
#container ul li.three a:hover {background:rgba(51,65,84,0.8);}
#container ul li a.inActive {cursor:default;}
#container ul li a.inActive .tit {color:rgba(255,255,255,0.25);}
#container ul li a.btn {position:absolute; top:80px; right:22px; width:74px; height:27px; line-height:26px; z-index:3; background:#333; background:rgba(0,0,0,0.6); color:#fff; color:rgba(255,255,255,0.8); text-align:center; border-radius:3px; font-size:13px; transition:all 0.2s;}
#container ul li a.btn:hover {color:#fff; background:rgba(0,0,0,0.7); box-shadow:0px 0px 3px rgba(0,0,0,0.5);}

@media only all and (max-height:430px) {
	#header {background:rgba(0,0,0,0.3);}
	#footer {background:rgba(0,0,0,0.3);}
	#container p {position:static; margin-top:0; padding:54px 54px 54px 54px;}
	#container .outer {height:100%; display:table; /* background:red; */ width:100%; box-sizing:border-box; /* padding-top:50px; */ padding-bottom:48px;}
}