﻿@charset "utf-8";
@import url("/Library/Css/user_layout.css?v=3");



/*메인*/
#mContainer {width: 100%; min-width:1196px;}
#mContainer #Container {width: 1196px; margin: 0 auto; }

.mConBox1 {width: 1200px; margin: 0 auto; display:flex; justify-content:space-between; flex-wrap:nowrap; height:550px; overflow:hidden;}

.mConBox1 .m_slider {float: left;}
.mConBox1 .right-A{height:100%; display:flex; flex-direction:column; }

.mConBox1 .Rbox {position: relative;float: right;width: 340px;height: /*283px*/ 320px;border: 1px solid #b5b5b5;padding:18px 24px 10px;
box-shadow: 1px 1px 5px #35242047; box-sizing: border-box;}
.mConBox1 .Rbox .login-box {position: relative;width: 290px;/*height: 159px;*/ height:auto;}
.mConBox1 .Rbox .login-box input[type="text"], .mConBox1 .Rbox .login-box input[type="password"] {padding: 10px; box-sizing: border-box; background: #f9fafc;}
.mConBox1 .Rbox .login-box input[type="image"] {position: absolute; top: 0; right: 0;}

.mConBox1 .Rbox .login-box h2 {position: relative; width: 100%; height: 34px; line-height: 30px; font-size: 13px; font-weight: bold; background: #89cff0; color: #fbfbfb; padding: 0 15px; box-sizing: border-box;}
.mConBox1 .Rbox .login-box h2 span.out {position: absolute; top: 3px; right: 10px;}
.mConBox1 .Rbox .login-box h2 span.out a {font-size: 11px; font-weight: 300; color: #FF0;}
.mConBox1 .Rbox .login-box .logout {border: 1px solid #dbdbdb; height:200px; margin-bottom:65px;}
.mConBox1 .Rbox .login-box .logout ul li {width: 100%; box-sizing: border-box; line-height:50px; font-size: 13px; padding: 5px 15px;}

.mConBox1 .Rbox .login-naver {width: 290px; margin-top: 14px; margin-bottom: 12px;}
.mConBox1 .Rbox .login-naver a{display:block; width:290px;}
.mConBox1 .Rbox .login-naver .kko{display:block;padding: 5px 0 0px;margin: 10px 0;background-color: #ffe800;border-radius: 5px;}
.mConBox1 .Rbox .login-naver .kko a{cursor:pointer; display:inline-block; height:40px; line-height:40px; font-size:16px; width:100%;  background:url(/Image/Common/bg_kakaologin.jpg)no-repeat left center #ffe800; 
background-size:contain; color:#4e3f40; text-align:center;margin-bottom:5px; border-radius:5px;}
.mConBox1 .Rbox .login-naver .kko:hover{box-shadow: 1px 2px 5px #3524204f;}

.mConBox1 .Rbox .login-naver .naverL{display:block;;margin: 10px 0;background-color: #00c63b;border-radius: 5px;}
.mConBox1 .Rbox .login-naver .naverL a{cursor:pointer; display:inline-block; height:50px; line-height:50px; font-size:16px; width:100%;   background:url(/Image/Common/bg_naverlogin.jpg)no-repeat left center #00c63b; color:#fbfbfb; text-align:center;
margin-right:5px; border-radius:5px;}
.mConBox1 .Rbox .login-naver .naverL:hover{box-shadow: 1px 2px 5px #3524204f;}

.mConBox1 .Rbox .login-util {width: 100%;line-height:30px;}
.mConBox1 .Rbox .login-util:after {content: ""; display: block; clear: both; z-index: 1;}
.mConBox1 .Rbox .login-util ul li {float: left;margin-right: 10px;padding-right: 12px;background: url(/image/main/Login_UtilLine.gif) no-repeat right 50%;font-size: 16px;}
.mConBox1 .Rbox .login-util ul li:last-child {margin-right: 0; padding-right: 0; background: none;}
.mConBox1 .btn-box2 ul li:hover{box-shadow:2px 2px 5px #33333387;}

.mConBox1 .btn-box2{width:340px;/* height: 60px; */}
.mConBox1 .btn-box2 ul li {float: left;margin-left:1%; outline: 1px solid #ccc;width: 49%; padding:8px 0; box-shadow: 1px 2px 5px #3524204f;}

.mConBox1 .btn-box2 ul li:first-child{margin-right:1%; margin-left:0;}
.mConBox1 .btn-box2 ul li a img{display:block; margin:2px auto;}
.mConBox1 .btn-box2:after {content: ""; display: block; clear: both; z-index: 1;}
.mConBox1 .btn-box2 ,.mConBox1 .btn-box {position: relative;float: right;width: 340px;/* height: 80px; */box-sizing: border-box;margin-top: 5px;}
/*.mConBox1 .btn-box ul li:first-child{margin-top:17px;}*/

.mConBox1 .btn-box li{border-radius:5px;}
.mConBox1 .btn-box li:first-child{margin:5px 0;}

/*order*/
.nConBox3 { padding:70px 0;box-sizing: border-box;height:494px; background:url(/image/main/bg1.png) no-repeat center top; opacity:0.95;}
.nConBox3 .fix ul {display:flex;justify-content:space-between;}
.nConBox3 .fix ul li {width:310px;}

/*공지사항*/
.mContaner2{width:1200px; margin:50px auto 0; overflow:hidden;}
/* 공지사항 위치 변경 2021.08.31 */
.mContaner2 .notice {width:48%; margin-right:2%; float:left;}
.mContaner2 .notice h2 {width:100%; border-bottom:1px solid #ccc;color:#014899; font-size:20px; font-weight:900; padding:20px 0;}
.mContaner2 .notice h2 > span{float:right;}
.mContaner2 .notice ul {margin-top:30px;}
.mContaner2 .notice ul li {margin-bottom:11px;width: 100%; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.mContaner2 .notice ul li a {font-size:16px; letter-spacing:-0.6px;}
.mContaner2 .notice ul li a:hover {transition-duration: 0.3s; color: #adadad;}
.mContaner2 .notice span.date1 {color:#595658;}
.mContaner2 .notice span.ntxt {width: 85%;display: inline-block;overflow: hidden;white-space: nowrap;text-overflow: ellipsis;}
.mContaner2 .notice span.ntxt:hover { /* text-decoration: underline; text-underline-position: under;  */transition:all 0.3s; color: #595658;}


/*리뷰*/
.mContaner2 .review{width:45%; margin-left:5%; float:left;}
.mContaner2 .review h2 {width:100%; border-bottom:1px solid #ccc;color:#014899; font-size:20px;
font-weight:900; padding:20px 0;}
.mContaner2 .review h2 span{float:right;}

.mContaner2 .review ul {margin-top:30px;}
.mContaner2 .review li{width:100%;}
.mContaner2 .review li a{display:block;}
.mContaner2 .review li a p{width:50%; float:left;}
.mContaner2 .review li a .textBox{width:48%; margin:0 1%;float:left;}
.mContaner2 .review li a p strong{display:block;font-size:16px; padding-bottom:20px;}
.mContaner2 .review li a span{line-height:24px;}
/*hot deal*/

.mContaner3{display:block; width:1200px; margin:20px auto;}
.mContaner3 h2{width:100%; border-bottom:1px solid #ccc;color:#014899; font-size:20px; font-weight:900; padding:20px 0;}
.hot-deal ul {display:flex; margin-top:20px;}
.hot-deal ul li {margin-right:46px; }
.hot-deal ul li:last-child{margin-right:0;}
.hot-deal ul:after {content: ""; display: block; clear: both; z-index: 1; }
.hot-deal ul li a{display:block; width:100%; height:246px;box-shadow: 5px 5px 10px rgb(0 0 0 / 20%);}
.hot-deal ul li a img{width:100%;}
.hot-deal ul li a:hover {}


.hot-deal ul li span {display: block; width: 190px;}
.hot-deal ul li span.Hname {font-size: 13px; color: #616161; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; margin-top: 15px;}
.hot-deal ul li span.Hprice {font-size: 16px; font-weight: bold; color: #010101; margin-top: 7px;}

.mContaner3 .infoBox{display:flex;}

.mContaner3 .infoBox li{width:340px; margin-left:7%; margin-top:20px;}
.mContaner3 .infoBox .rateArea{width:30%; margin-left:0; margin-top:0; position:relative;}


/*고시환율*/
.mContaner3 .infoBox .rateArea div {padding-top:7px; overflow:hidden; line-height:47px;}
.mContaner3 .infoBox .rateArea div p {font-size:15px; }
.mContaner3 .infoBox .rateArea div p:last-child{font-size:18px; color:red; font-weight:bold;} 
.mContaner3 .infoBox .rateArea div p span {float:right;}
.mContaner3 .infoBox .rateArea div p span i{position:absolute; top:21px; }
.mContaner3 .infoBox .rateArea div p span i img{border:1px solid #ccc;}

/* mConBox4 노데이타  */
.mConBox4 {width:1200px; margin:0 auto; position:relative; overflow:hidden;}
.mConBox4 .service h2 , .mConBox4 .nodataArea h2{width:100%; border-bottom:1px solid #ccc;color:#014899; font-size:20px; 
font-weight:900; padding:20px 0;}

.mConBox4 .service{margin-right:51px; float:left;}
.mConBox4 .service ul{width:274px; margin-top:20px;}
.service li{width:100%; height:85px;}.
.service li a{display:block;}
.service li a img{width:100%; height:100%;}
.mConBox4 .nodataArea{float:left;}
.mConBox4 ul {width: 100%; overflow:hidden; margin-top:20px;}
.nodataArea li {width:275px; margin-right: 25px; background:#fff;box-sizing:border-box;  float:left;}
.nodataArea li:nth-child(3) { margin-right: 0px;}

.nodataArea .txt{padding-top: 20px;  text-align:left; box-sizing:border-box; border-top:none;}
.nodataArea .Hname {font-weight:400;border-bottom: 1px solid #E9E9E9; padding-bottom:8px; box-sizing:border-box; font-size:16px;  color:#8B8B8B;line-height: 30px;}
.nodataArea .Hprice { font-size:16px; font-weight:550; color:#000000; margin-top:8px;line-height: 30px;}
.nodataArea .lost{width: 50%;}
.nodataArea li a{display:block; }
.nodataArea li a img{width:100%;box-shadow: 5px 5px 10px rgb(0 0 0 / 20%); }




/* mConBox6 추천  */
.mConBox6 {width:1200PX; margin:40px auto; }

.mConBox6 h2 {width:100%; border-bottom:1px solid #ccc;color:#014899; font-size:20px; 
font-weight:900; padding:20px 0;}
.Bshop {position: relative; width: 100%; height: 115px; padding-top: 40px; box-sizing: border-box; background: #fff;}
.Bshop ul li img {width:100%;}
.Bshop .m_slider2 #slider2-B {position:absolute; left: 0; top: 88px; z-index:100;}
.Bshop .m_slider2 #slider2-N {position:absolute; right: 0px; top: 88px; z-index:100;}
.Bshop .m_slider2 .bxslider2 li{width:285px; 85px;}


/*대행절차 */
.mContaner6 { width:1200px; margin:80px auto;}
.mContaner6 .steptab {margin-bottom: 50px;position: relative; width: 100%; overflow:hidden; }
.mContaner6 .tab li { float: left; margin-right: 10px; }
.mContaner6 .tab1 { width: 100%; }
.mContaner6 .tab1 li { float: left; width: 140px; height: 140px; }
.mContaner6 .menu_tab00 mTs { display: block; }
.mContaner6 .menu_tab01 mTs { display: none; margin-top:32px;}
.mContaner6 [class^='menu_tab0'] img{max-width:100%;}
.mContaner6 .menu_tab {margin-bottom:25px;}
.mContaner6 .menu_tab li { float: left; }
.mContaner6 .menu_tab ul {overflow:hidden;}
.mContaner6 .menu_tab li a {color:#014899;; padding:10px 30px;box-sizing:border-box;font-size:18px; display:block; width:100%; height:100%; }
.mContaner6 .menu_tab li  {color:#014899; box-sizing:border-box;font-size:18px; font-weight:bold; display:block; margin-bottom:20px;}
.mContaner6 .menu_tab ul li.active {background-color:#ccc; font-weight: bold; color: #fbfbfb;}
.mContaner6 .menu_tab ul li.active a {color: #fff;}
.mContaner6 .menu_tab ul li {}

/*배송조회, 고객센터 입금계좌*/
.mCont{width:100%; height:360px; overflow:hidden; background-color:#0f1b39; color:#fff;}
.mContaner7{width:1200px; margin:80px auto; overflow:hidden; }
.mContaner7 h2{width:100%; border-bottom:1px solid #ccc;color:#014899; font-size:20px; 
font-weight:900; padding:20px 0;}
.mContaner7 div{width:33%; float:left;}

.mContaner7 .searchBox > .search-de{width:100%;}
.mContaner7 .searchBox > .search-de > h4{margin:20px 0;}


/* Main menu */

#menu {display:flex; JUSTIFY-CONTENT: space-between;}

#menu li
{
	line-height:80px;
	position: relative;
}

#menu li a{color:#000; font-size:18px;}
#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 > ul li a
{
	color: #fff;
}


#menu li:hover > ul
{
	display: block;
}

/* Sub-menu */

#menu ul
{
    list-style: none;
    margin: 0;
    padding: 0;    
    display: none;
    position: absolute;
    top:60px;
    left:-30px;
    z-index: 99999;    
    background: #222;

}

#menu ul ul
{
  top: 0px;
  left: 150px;

}

#menu ul li
{
    float: none;
	text-align:left;
    margin: 0;
    padding: 3px;
    display: block; 
  
}

#menu ul li:last-child
{   
    -moz-box-shadow: none;
    -webkit-box-shadow: none;
    	box-shadow: none;    
}

#menu ul a
{    
	font-size:14px;
	font-weight:300;
    padding: 10px;
	height: 13px;
	width: 140px;
	height: auto;
    line-height: 1;
    display: block;
    white-space: nowrap;
    float: none;
	text-transform: none;
	color:#fff;
}

*html #menu ul a /* IE6 */
{    
	height: 10px;
}

*:first-child+html #menu ul a /* IE7 */
{    
	height: 10px;
}

#menu ul a:hover
{	background:#333;
	width:140px !important;
	
/* 	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;

}

#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;
}


* 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;
	
}
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 {  }
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;}
#floating{display:none;}