@charset "utf-8";
@import url("/Library/Css/user_layout.css");
@import url('https://fonts.googleapis.com/css2?family=Oswald:wght@200;300;400;469;500;600;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@100;300;400;500;700;900&display=swap');

/* #wrap {width:100%; _width:expression!(parslent(document.body.offsetWidth) > 1280 ? "100%" : document.body.offsetWidth );  } */
body{overflow-x:hidden; min-width:1024px; margin:0 auto; font-family: 'Noto Sans KR', sans-serif;}

/* 공통 스타일 */
h3 {font-size:22px; font-weight:bold; margin-bottom:10px; font-family: 'Oswald', sans-serif;} 
#mContainer {width: 100%; margin-top: 0px;}
#mContainer #Container {width: 1280px; margin: 0 auto; min-width:1024px; }


/*메인*/

.mConBox1 {width: 1280px; margin: 0 auto; overflow:hidden; height: 554px; position:relative; }
.mConBox1:after {content: ""; display: block; clear: both; z-index: 1;}
.mConBox1 .m_slider {float: left; width:100%;   position: relative;border: none; box-sizing: border-box;}
.mConBox1 .Rbox {position: relative; float: right; width: 100%; height: 554px; border: 1px solid #b5b5b5; padding: 20px 24px 47px 24px; box-sizing: border-box;}

/*메인 롤링 배너*/
.m_slider{position:relative; width:1280px; height:302px; }
.m_slider .frame {overflow: hidden; position: relative;}
.m_slider .frame ul {list-style: none; margin: 0; padding: 0; position: absolute;}
.m_slider ul li{float: left; !important;}
.m_slider .frame ul li { float: left; margin: 0 1px 0 0; padding: 0; cursor: pointer; }
.m_slider .frame ul li img {width:1882px;}
.m_slider .frame ul li.active { color: #fff; background: #a03232; }
.m_slider .bx-viewport {position:relative;}
.m_slider .bx-controls {position:absolute; width:10%; height:16px; bottom:30px; left: 50%;  transform: translatex(-50%);z-index:100; }
.m_slider .bx-pager {display:table; margin:0 auto; position:absolute; width:100%; height:16px; bottom:0; left: 0; z-index:100; }
.m_slider .bx-pager .bx-pager-item {float:left;}
.m_slider .bx-pager .bx-pager-item .active {}
.m_slider .bx-controls-direction {display:none;}
.m_slider .Rbtn1{position:absolute; left:-17px; top:248px; z-index:100;}
.m_slider .Rbtn2{position:absolute; right:-17px; top:248px; z-index:100;}
.m_slider .over_bg{background:url(/image/main/banner_over.png) bottom center no-repeat;width:100%; height:570px;}
.m_slider .bx-pager a { background: #0E50B2;  display: block;  width: 14px; height: 14px; text-indent: -9999px; margin: 0 5px; outline: 0;  -moz-border-radius: 7px; -webkit-border-radius: 7px;border-radius: 7px;}
.m_slider .bx-pager a.active {background: #fff;}


/*mConBox2 */
/*.mConBox2 {width:100%; background: url(/image/common/bg2.png)no-repeat center center; height:820px; } */
.mConBox2 {width: 1280px; margin: 0 auto; overflow:hidden;  box-sizing: border-box; padding:25px 0; box-sizing:border-box;  }
.mConBox2 .service1 {width:75%; float:left;}
.mConBox2 .service2 {width:24%; float:left;}
.mConBox2 h3 {position:relative; padding-bottom:25px ;  box-sizing:border-box; }
.mConBox2 h3:after {content:'';   width:958px; height:3px; background:#0E50B2;  box-sizing: border-box; margin : 20px 0; position:absolute; bottom:-20px; left:-15px; }  
.mConBox2 .service1 .photo {position:relative; margin-top:10px;}
.mConBox2 .service1 .photo   span {position:absolute; bottom:15px; right:20px; }
.mConBox2 .service1 ul {overflow:hidden; padding: 10px 0; }
.mConBox2 .service1 ul:after {content:''; display:block; clear:both;}
.mConBox2 .service1 ul li {float:left; width:32%; margin-right:10px;   box-sizing :border-box; box-shadow: 2px 2px 5px #cbced1, -2px -2px 5px #ffffff; padding:5px 0;box-sizing: border-box;  border: 1px solid #dbdbdb; border-right: none; box-sizing:border-box;  }
.mConBox2 .service1 ul li:nth-child(3), .mConBox2 .service1 ul li:nth-child(6)  {margin-right:0px;}
.mConBox2 .service1 h3 {font-size:22px; font-weight:bold;  margin-bottom:10px;} 

.mConBox2 .service2 h3 {position:relative;  padding-bottom:25px ;  box-sizing: border-box;margin-bottom:10px; }
.mConBox2 .service2 h3:after {content:'';   width:300px; height:3px; background:#0E50B2;  box-sizing: border-box; position:absolute; bottom:-20px; left:3px;   margin : 20px 0;}  
.mConBox2 .service2 ul {overflow:hidden; }
.mConBox2 .service2 ul li{margin-top:35px; }
.mConBox2 .service2 ul li img{box-sizing :border-box; box-shadow: 2px 2px 5px #cbced1, -2px -2px 5px #ffffff;  }
.mConBox2 .service2 ul li:first-child{margin-top:13px;}
.mConBox2 .service2 ul li:last-child{padding-bottom:3px;}



/* 대행절차 */

.mConBox7 {width: 1280px; margin: 0 auto;  overflow:hidden; padding:50px 0 20px 0;  box-sizing: border-box; }
.mConBox7 h3 {position:relative;  margin-bottom:10px; padding-bottom:25px ;  box-sizing:border-box;}
.mConBox7 h3:after {content:'';   width:105px; height:3px; background:#0E50B2;  box-sizing: border-box; position:absolute; top:-30px; left:-15px; } 
.tab {position: relative; width: 100%; padding:10px 0; box-sizing:border-box; }
.tab .stepTab .menu_tab ul {}
.tab .stepTab .menu_tab ul:after {content:""; display: block; clear: both; z-index: 1;}
.tab .stepTab .menu_tab ul li {border: 1px solid #dbdbdb; border-right: none; box-sizing:border-box;float: left; width: 125px; height:50px; line-height: 50px;   box-sizing:border-box; background: #f7f7f7; text-align: center; vertical-align: middle; font-size: 14px;}
.tab .stepTab .menu_tab ul li:nth-child(1), .tab .stepTab .menu_tab ul li:nth-child(2) {width: 200px; }
.tab .stepTab .menu_tab ul li:last-child {border-right: 1px solid #dbdbdb; }
.tab .stepTab .menu_tab ul li.active {background: #0072bc; font-weight: bold; color: #fbfbfb;}
.tab .stepTab .menu_tab ul li.active a {color: #fbfbfb;}
.stepTab div[class^="menu_tab0"] {border: 1px solid #dbdbdb; text-align: center; box-sizing:border-box;}

/* link  */
.link { width: 1280px; margin: 0 auto;  overflow:hidden; padding:40px 0 40px;  box-sizing: border-box; position:relative;}
.link  h3 {position:relative;  margin-bottom:10px;}
.link  h3:after {content:'';   width:105px; height:3px; background:#0E50B2;  box-sizing: border-box; position:absolute; top:-30px; left:-15px; } 
.link p {text-align:center; font-size:16px; margin-top:20px;}
.link li a { width:210px; height:90px; overflow:hidden;}
.link li a img {width:100%; height:auto;}
#slider3-B {position:absolute; left:0%;  top: 60%; z-index:100; font-weight:bold; font-size:30px; color:#d4d4d4; }
#slider3-N {position:absolute; right:0%; top:60%; z-index:100; font-weight:bold; font-size:30px; backgroud:#d4d4d4;}
 .link .link-box { padding:0 20px;  box-sizing: border-box;}

/* 하단정보배너 */

.mConBox8 {width: 1280px; margin: 0 auto; padding:50px 0 20px 0; box-sizing:border-box; overflow:hidden;  margin-top:20px;}
.mConBox8  div {float: left; width:31.5%;margin-right:35px;  border: 1px solid #dbdbdb !important; box-sizing:border-box;}
.mConBox8 .cs-info {box-sizing :border-box; box-shadow: 2px 2px 5px #cbced1, -2px -2px 5px #ffffff; border: 1px solid #dbdbdb !important; }
.mConBox8 .bank-info {box-sizing :border-box; box-shadow: 2px 2px 5px #cbced1, -2px -2px 5px #ffffff;  border: 1px solid #dbdbdb !important; }
.mConBox8 .exchange {box-sizing :border-box; box-shadow: 2px 2px 5px #cbced1, -2px -2px 5px #ffffff; border: 1px solid #dbdbdb !important; }
.mConBox8 >div  img {border: 1px solid #dbdbdb !important;  box-shadow: 2px 2px 5px #cbced1, -2px -2px 5px #ffffff;  }
.mConBox8 .blog-bn {margin-left: 7px;}
.mConBox8 .cafe-bn {margin-left: 7px;}
.mConBox8 .instar-bn {margin-left: 7px;}
.mConBox8 .exchange {position:relative;  margin-right:0px;}
.mConBox8 .exchange p {position:absolute; top:54%; left:4%; font-weight:600; color:#838383;}
.mConBox8 .exchange .txt1 { font-size:17px; margin-left:10px;  color:#ababab; }
.mConBox8 .exchange .txt2 { font-size:19px; top:30%;margin-left:10px; }


/* Main menu */

#menu {z-index:10000; position: relative; }
#menu li {padding-bottom: 10px;position: relative;}
#menu ul ul a {float: left;height: 25px;padding: 0 25px;color: #fff;text-transform: uppercase;font: bold 12px/25px Arial, Helvetica;text-decoration: none;text-shadow: 0 1px 0 #000;z-index:10000;}
#menu li-nth-child(2):hover > a{color: #fafafa;z-index:10000;}
*html #menu li a:hover /* IE6 */{color: #fafafa;}
#menu li:hover > ul{display: block;}


/* Sub-menu */

#menu ul{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;color:#fff;}
#menu ul ul{ top: 0;left: 150px;}
#menu ul li{ float: none;text-align:left; margin: 0;padding: 0 5px;display: block; border-bottom:1px solid #333;color:#fff;}
#menu ul li a {color:#fff;}
#menu ul li:last-child{   -moz-box-shadow: none;-webkit-box-shadow: none;box-shadow: none;    }
#menu ul li ul li a {color:#fff;}
#menu ul li li a:link, #menu ul li li a :hover {color:#fff;}
#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: #0E50B2;
background: -moz-linear-gradient(#04acec, #0E50B2);	
background: -webkit-gradient(linear, left top, left bottom, from(#04acec), to(#0E50B2));
background: -webkit-linear-gradient(#04acec,  #0E50B2);
background: -o-linear-gradient(#04acec,#0E50B2);
background: -ms-linear-gradient(#04acec, #0E50B2);
background: linear-gradient(#0E50B2, #0E50B2);
color:#fff;}


#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;}