/**
* A-Marketing Cascading Style Sheets
* File Name : layout.css
* Description : 메인,서브 공통 스타일시트
* Author : Web business Team / White
* Email : yan@amarketing.co.kr
* Date : 2015.02.16
* Update : 2015.02.16
* Copyright(c) 2015 A-Marketing. All Rights Reserved.
*/

/* Layout Selector */
#wrap { position:relative; max-width:640px; margin:0 auto;}
#header { height:100px; background:url("image/bg_header.gif") repeat-x left top; background-size:30px; clear:both; border-bottom:3px solid #286aae;}
#container { z-index:10; width:100%; clear:both;}
#container:after { display:block; clear:both; content:"";}
#footer { position:relative; z-index:20; width:100%; clear:both; border-top:2px solid #cdcdcd;}
.clear_block { display:block; clear:both; padding-bottom:20px;}
.sub #content { position:relative; padding:0 3% 7% 3%;}

/* sitemap */
.sitemap { position:absolute; width:50%; height:100%; top:0; left:100%; background:#303a48; z-index:9999; overflow-y:auto; display:none;}
.sitemap .btn_close { padding:20px;}
.sitemap .btn_close a { display:block; width:100%; padding:20px 0; font-size:20px; color:#fff; font-weight:bold; background:#48515f; text-align:center;}
.sitemap .snb_nav_dep1 a { padding:13px 0 14px 20px; font-size:14px;}
.sitemap .snb_dep2 a { font-size:13px;}
.sitemap .snb_dep3 a { padding:3px 0 4px 25px; font-size:12px;}
.sitemap .snb_nav_dep1 { width:100%; text-align:left; letter-spacing:-0.05em; overflow:hidden;}
.sitemap .snb_nav_dep1 a { display:block; padding:19px 0 20px 20px; font-size:22px; font-weight:bold; color:#fff; background:#52565f url("image/bg_sitemap2.jpg") repeat-y left top;}
.sitemap .snb_dep2 { width:100%; text-align:left; background:#343842 url("image/bg_sitemap3.jpg") repeat-y left top;}
.sitemap .snb_dep2 a { display:block; padding:13px 0 13px 25px; font-size:18px; color:#b9babd; background:none; border-bottom:solid 1px #74777e;}
.sitemap .snb_dep2 a:hover,
.sitemap .snb_dep2 .on { border-bottom:solid 1px #74777e; font-weight:bold; color:#fff;}
.sitemap .snb_dep3 { padding:5px 0; width:100%; text-align:left;}
.sitemap .snb_dep3 a { display:block; padding:3px 0 4px 25px; font-size:16px; font-weight:normal; color:#9a9b9f;}
.sitemap .snb_dep3 a:hover,
.sitemap .snb_dep3 .on { border:0; padding:3px 0 4px 25px; background:none; font-weight:normal; color:#fff; text-decoration:underline;}

/* header */
#header .header_in { width:89.625%; margin:0 auto;}
#header .gnb { float:right;}
#header .gnb li { float:left; margin-left:4px;}

/* container */
#container.main { padding-top:65%; background:#18428f url("image/bg_main.gif") no-repeat center top; background-size:100%;}
#container .main_quick { width:81.625%; padding:4%; margin:0 auto; background:#fff; background:url("image/bg_quick.jpg") no-repeat right top; background-size:100%;}
#container .main_quick h2 { padding-bottom:15px; font-weight:bold; font-size:22px; color:#363636;}
#container .main_quick h2 span { color:#286aae;}
#container .main_quick p { padding-bottom:2px; font-size:18px; color:#5e5e5e;}
#container .main_quick ul { padding-top:19%; width:330px;}
#container .main_quick ul:after { display:block; clear:both; content:"";}
#container .main_quick li { float:left; width:130px; margin-right:5px; margin-bottom:5px;}
#container .main_quick li a { display:block; padding:8px 15px; font-size:16px; font-weight:bold; border:1px solid #bebebe; color:#5d5d5d; background:#fff url("image/ico_plus.jpg") no-repeat 110px 50%;}
#container .main_resualt { width:89.625%; margin:0 auto;}
#container .main_quick2 { width:89.625%; margin:0 auto;}
#container .main_quick2 ul { }
#container .main_quick2 ul:after { display:block; clear:both; content:"";}
#container .main_quick2 li { width:25%; float:left;}

#lnb ul:after { display:block; clear:both; content:"";}
#lnb ul { width:81.25%; margin:0 auto;}
#lnb ul li { width:25%; float:left;}

#snb { background:#f6f6f6 url("image/bg_snb.gif") repeat-x center top;}
#snb ul { width:89.625%; margin:0 auto; padding:20px;}
#snb ul:after { display:block; clear:both; content:"";}
#snb ul li { width:50%; float:left;}
#snb ul li a { display:block; padding:5%; margin-right:2%; margin-bottom:2%; border:2px solid #aaaeb5; font-size:16px; font-weight:bold; color:#818995; background:#fff;}
#snb ul li a:hover,
#snb ul li a.on { border:2px solid #115caa; color:#115caa;}

/* footer */
#footer .totop { position:absolute; width:25%; top:15%; right:5%;}

/* media query */
@media all and (min-width: 320px) and (max-width: 480px) {
#header { height:60px; background-size:18px;}
#header h1 img { height:60px;}
#header .gnb img { height:60px;}
.clear_block { padding-bottom:10px;}

/* sitemap */
.sitemap .btn_close { padding:12px;}
.sitemap .btn_close a { padding:10px 0; font-size:16px;}
.sitemap .snb_nav_dep1 a { padding:6px 0 7px 20px; font-size:14px;}

#container .main_quick { }
#container .main_quick h2 { padding-bottom:15px; font-size:18px;}
#container .main_quick p { padding-bottom:2px; font-size:15px; color:#5e5e5e;}
#container .main_quick ul { width:330px;}
#container .main_quick ul:after { display:block; clear:both; content:"";}
#container .main_quick li { float:left; width:120px; margin-right:5px; margin-bottom:5px;}
#container .main_quick li a { display:block; padding:4px 10px; font-size:11px; font-weight:bold; border:1px solid #bebebe; color:#5d5d5d; background:#fff url("image/ico_plus.jpg") no-repeat 100px 50%; background-size:8px;}

#snb ul li a { padding:5%; font-size:14px; background:#fff;}
}

#stle { position:relative; width:89.625%; padding-top:20px; margin:0 auto 35px;}
#stle h2 { padding-left:17px; font-size:17px; background:url('image/ico_stle.gif') no-repeat left center; font-weight:bold; background-size:12px; color:#000; line-height:20px; letter-spacing:-0.075em;}
#stle ul { position:absolute; top:22px; right:0;}
#stle li { color:#5e5e5e; font-size:12px; float:left; letter-spacing:-0.05em;}