@charset "utf-8";
@import url("/Library/Css/user_layout.css");


/*메인*/

#mContainer {width: 100%;}
#mContainer #Container {width: 1100px; margin: 0 auto;}

.main{width:100%; height:930px; background:url('/image/main/main_banner.jpg'),repeat;}

.mainBox{width:87%; margin:0 auto; padding-top:125px; overflow:hidden; position:relative;}

/*서비스분야 특송화물 이동영역*/
.left_area{width:350px; height:40px; position:absolute; bottom:25px;}
.left_area p{width:150px; float:left; line-height:40px; margin-right:25px; }
.left_area p a{display:inline-block; width:100%; height:100%; font-size:22px; text-align:center; color:#fff;}
.left_area .active0{background-color:#14C0D8;}
.left_area .active1{background-color:#666666;}


/* 바로견적 조회서비스*/
.main .searchBox{float:right; color:#fff; width:610px; height:540px; background-color:#00000075;}
.main .searchBox h2 , .main .searchBox p , .main .searchBox h2 , .main .searchBox li span{color:#fff;}
.main .searchBox h2{font-size:36px; margin:30px 0 20px 30px;}
.main .searchBox p{font-size:16px; margin-left:30px;}

.main .searchBox ul{width:535px; margin:60px auto 0;}
.main .searchBox ul li{width:100%; height:40px; line-height:40px; margin-bottom:40px;}
.main .searchBox ul li:last-child{margin-bottom:0;}
.main .searchBox ul li .search_Nm{display:inline-block; width:139px; float:left; font-size:24px;}
.main .searchBox ul li input{display:inline-block; float:left; width: 395px; height: 40px; background-color:#3d4a61; color:#fff; text-indent:10px; border: none; border-radius:3px;}

.main .searchBox ul li a{display:block; width:200px; height:45px; float:right; 
line-height:45px; background-color:#0168B7; text-align:center; font-size:24px;}
.main .searchBox ul:after{content:""; display:block; clear:both;}

/*메인 아래 메뉴들*/
.content0{width:100%; height:195px; background-color:#0168b7;}
.content0 ul{width:90%; margin:0 auto; display:flex;}
.content0 ul li{height:25%; margin:15px 0; float:left; line-height:160px; border-right:1px solid #fff;}
.content0 ul li a{display:block; width:100%; height:100%;}
.content0 ul li a img{display:block; width:100%;}
.content0 ul li:last-child{border-right:none;}

/*content1*/
.content1{width:100%; height:880px; background:url('/image/main/content_bg1.png'),repeat;position: relative;}
.content1 > .contentBox{width: 50%;height: 597px;margin-left:43%; position:absolute; top:100px;}
.content1 > .contentBox > .notice{width:47%; height:273px; margin-right:5%; margin-bottom:50px; float:left;}
.content1 > .contentBox > .notice1{width:47%; height:273px; margin-right:0; float:left;}
.content1 > .contentBox > div > .h2Nm{padding-top:50px; padding-left:65px; font-size:24px;}
.content1 > .contentBox > div > ul{height:182px;margin:10px 10px 10px 64px;}
.content1 > .contentBox > div > ul > li{font-size:18px; height:30px; line-height:30px;}
.content1 > .contentBox > div > ul > li >a{display:inline-block; width:75%;}



.content1 ul:after{content:""; display:block; clear:both;}

.content2{width:100%; height:580px; background:url('/image/main/content2.png'),repeat; position:relative;}
.content2 > .contentBox2{top:122px;width:1000px;height: 348px; position: absolute;right:54px;}
.content2 > .contentBox2 > div{width:442px; height:100%; margin-right:46px; float:left; }
.content2 > .contentBox2 > div > .h2Nm{margin-top:95px; padding-left:150px; font-size:24px; color:#fff;}
.content2 > .contentBox2 > div > ul{height:182px;margin:95px 0 10px 153px;}
.content2 > .contentBox2 > div > ul > li{font-size:18px; height:30px; line-height:30px;}
.content2 > .contentBox2 > div > ul > li >a{display:inline-block; width:75%; color:#fff;}
.content2 > .contentBox2 > div > ul > li > .date_area{color:#fff;}
/* Main menu */

#menu {}

#menu li
{
	padding-bottom: 10px;
	position: relative;
}

#menu ul ul a 
{
	float: left;
	height: 25px;
	padding: 0 25px;
	color: #999;
	text-transform: uppercase;
	font: bold 12px/25px Arial, Helvetica;
	text-decoration: none;
	text-shadow: 0 1px 0 #000;
}

#menu li:hover > a
{
	color: #fafafa;
}

*html #menu li a:hover /* IE6 */
{
	color: #fafafa;
}
/*
#menu li:hover > ul
{
	display: block;
}
*/
/* Sub-menu */

#menu ul
{
	display:none;
    list-style: none;
    margin: 0;
    padding: 0;    
    display: none;
    position: absolute;
    top: 50px;
    left: calc(width - 50%);
    z-index: 99999;    
    background: #fbfbfb;
    background: -moz-linear-gradient(#444, #111);
    background: -webkit-gradient(linear,left bottom,left top,color-stop(0, #111),color-stop(1, #444));
    background: -webkit-linear-gradient(#444, #111);    
    background: -o-linear-gradient(#444, #111);	
    background: -ms-linear-gradient(#444, #111);	
    background: linear-gradient(#444, #111);
    -moz-box-shadow: 0 0 2px rgba(255,255,255,.5);
    -webkit-box-shadow: 0 0 2px rgba(255,255,255,.5);
    box-shadow: 0 0 2px rgba(255,255,255,.5);	
    -moz-border-radius: 5px;
    border-radius: 5px;
}

#menu ul ul
{
  top: 0;
  left: 150px;
}

#menu ul li
{
    float: none;
	text-align:left;
    margin: 0;
    padding: 0 3px;
    display: block; 
	border-bottom:1px solid #333;

}

#menu ul li:last-child
{   
    -moz-box-shadow: none;
    -webkit-box-shadow: none;
    	box-shadow: none;    
}

#menu ul a
{    
	font-size:13px;
	font-weight:300;
    padding: 10px;
	height: 10px;
	width: 130px;
	height: auto;
    line-height: 1;
    display: block;
    white-space: nowrap;
    float: none;
	text-transform: none;
}

*html #menu ul a /* IE6 */
{    
	height: 10px;
}

*:first-child+html #menu ul a /* IE7 */
{    
	height: 10px;
}

#menu ul a:hover
{
    background: #0186ba;
	background: -moz-linear-gradient(#04acec,  #0186ba);	
	background: -webkit-gradient(linear, left top, left bottom, from(#04acec), to(#0186ba));
	background: -webkit-linear-gradient(#04acec,  #0186ba);
	background: -o-linear-gradient(#04acec,  #0186ba);
	background: -ms-linear-gradient(#04acec,  #0186ba);
	background: linear-gradient(#04acec,  #0186ba);
}

#menu ul li:first-child > a
{
    -moz-border-radius: 5px 5px 0 0;
    border-radius: 5px 5px 0 0;
}

#menu ul li:first-child > a:after
{
    content: '';
    position: absolute;
    left: 30px;
    top: -8px;
    width: 0;
    height: 0;
    border-left: 5px solid transparent;
    border-right: 5px solid transparent;
    border-bottom: 8px solid #444;
}

#menu ul ul li:first-child a:after
{
    left: -8px;
    top: 12px;
    width: 0;
    height: 0;
    border-left: 0;	
    border-bottom: 5px solid transparent;
    border-top: 5px solid transparent;
    border-right: 8px solid #444;
}

#menu ul li:first-child a:hover:after
{
    border-bottom-color: #04acec; 
}

#menu ul ul li:first-child a:hover:after
{
    border-right-color: #04acec; 
    border-bottom-color: transparent; 	
}


#menu ul li:last-child > a
{
    -moz-border-radius: 0 0 5px 5px;
    border-radius: 0 0 5px 5px;
}

/* Clear floated elements */
#menu:after 
{
	visibility: hidden;
	display: block;
	font-size: 0;
	content: " ";
	clear: both;
	height: 0;
}

* html #menu             { zoom: 1; } /* IE6 */
*:first-child+html #menu { zoom: 1; } /* IE7 */

ul#topnav {
	margin: 0; padding: 0;
	float: left;
	width: 970px;
	list-style: none;
	position: relative;
	font-size: 1.2em;
	background:url(images/topnav_s.gif) repeat-x;
}
ul#topnav li {
	float: left;
	margin: 0; padding: 0;
	border-right: 1px solid #555;
}
ul#topnav li a {
	padding: 10px 15px;
	display: block;
	color: #f0f0f0;
	text-decoration: none;
}
ul#topnav li:hover { background: #1376c9 url (images/topnav_a.gif) repeat-x; }
ul#topnav li span {
	float: left;
	padding: 15px 0;
	position: absolute;
	left: 0; top:35px;
	display: none;
	width: 970px;
	background: #1376c9;
	color: #fff;
	-moz-border-radius-bottomright: 5px;
	-khtml-border-radius-bottomright: 5px;
	-webkit-border-bottom-right-radius: 5px;
	-moz-border-radius-bottomleft: 5px;
	-khtml-border-radius-bottomleft: 5px;
	-webkit-border-bottom-left-radius: 5px;
}
ul#topnav li:hover span { display: block; }
ul#topnav li span a { display: inline; }
ul#topnav li span a:hover {text-decoration: underline;}