/* BASIC css start */
/* BASIC css start */
.floatwrap { display: none; position: fixed; top: 0; right: 0; width:200px; height: 100%; margin: 0; background:#FAFAFA; border-left:1px solid #dddddd; z-index: 100; }

/*float ¹öÆ° Åä±Û*/
.floatwrap .btn_wrap{ position: absolute; left: -33px; top:200px; }
.floatwrap .btn_toggle { display:table; cursor: pointer; z-index:1; }
.floatwrap #btn_float{ display:table-cell; width:30px; height:30px; margin:1px auto 0; line-height:30px; vertical-align:middle; text-align:center; cursor: pointer; background:#444444; }
.floatwrap .btn_toggle:hover #btn_float{ display:table-cell; background:#000000; }

.floatwrap #btn_float span { display:block; width: 15px; height: 1px; line-height:0; margin:4px auto; background: #FFFFFF; text-align:center;
										-webkit-transition: .3s ease; -moz-transition: .3s ease; -o-transition: .3s ease; transition: .3s ease; }

.floatwrap .btn_toggle.active #btn_float .a { height:1px; -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -o-transform: rotate(45deg); transform: rotate(45deg);
															-webkit-transform-origin: left; -moz-transform-origin: left; -o-transform-origin: left; transform-origin: left; margin:0 0 0 10px; }
.floatwrap  .btn_toggle.active #btn_float .c { height:1px; -webkit-transform: rotate(-45deg); -moz-transform: rotate(-45deg); -o-transform: rotate(-45deg); transform: rotate(-45deg);
															 -webkit-transform-origin: left; -moz-transform-origin: left; -o-transform-origin: left; transform-origin: left; margin:0 0 0 10px; }
.floatwrap  .btn_toggle.active #btn_float .b { -webkit-transform: translate(0); -moz-transform: translate(0); -o-transform: translate(0); transform: translate(0); opacity: 0; }
.floatwrap #btn_float .b { }
/*float ¹öÆ° Åä±Û*/


.floatwrap .btn_etc {display:block; float:left; width:30px; text-align:center;}
.floatwrap .btn_etc li{ display:block; position:relative; width:30px; height:30px;  line-height:30px; margin:0 auto 1px;}
.floatwrap .btn_etc a{ display:inline-block; float:left; width:30px; height:30px; line-height:30px; margin:1px auto 0; text-align:center; color:#FFFFFF; background:#444444; }
.floatwrap .btn_etc a{ position:relative; z-index:1; }
.floatwrap .btn_etc a:hover{ background:#000000; }					
.floatwrap .btn_etc li .tooltip{ position:absolute; top:0; width:60px; padding: 0 5px; color:#000000;  text-align:right; z-index:0; white-space:nowrap; -webkit-transform : translate(60px, 0px);  filter:alpha(opacity=0); opacity:0; -webkit-opacity:0;}
.floatwrap .btn_etc li.on .tooltip{ position:absolute; -webkit-transform: translate(-100px, 0px); filter:alpha(opacity=100); opacity:1; -webkit-opacity:1;}
.floatwrap .btn_etc li #search.tooltip{top:-10px;}
.floatwrap .btn_etc li.on #search.tooltip{ top:-10px; padding:10px; -webkit-transform: translate(-270px, 0px); }



.floatwrap .floatwing { display:block; }
.floatwrap .floatwing.fix { float: none; position: fixed; top:0; padding-top:0; z-index: 6; right: auto; }
/*wrap style*/
.floatwrap .innerbox { display:block; position:relative; float:left; width:200px; background:#FAFAFA; z-index:2; }
.floatwrap .inbox{display:block; padding:0;}
.floatwrap .inbox.fix { float: none; position: fixed; top:0; padding-top:0px; z-index: 1; left: auto; }


.floatwrap h3{ display:block; margin: 0 0 10px; color: #000; font-size:12px; letter-spacing: 1px; font-weight:normal; }
.floatwrap h3 span.bar{display:block; margin-top:5px; width:20px; height:1px; background:#666666; }

.floatwrap ul:after, .floatwrap li:after{content:''; display:block; clear:both;}

/*Äü¸Þ´º*/
.floatwrap .quickmenu{display:block; padding:20px; margin:0 auto;}
.floatwrap .quickservice{ display:block; width:100%; text-align:center; clear:both;  }
.floatwrap .quickservice li{display: inline-block; float:left; width:32%; margin:0.5%; padding:0; text-align:left; }
.floatwrap .quickservice li a{display: block; padding:2px; line-height:20px; font-size:11px; text-align:center; border:1px solid #cccccc; background:#FFFFFF;  }
.floatwrap .quickservice li.info{ display:block; float:left; width:98%; }
.floatwrap .quickservice li.info a{line-height:40px; }
.floatwrap .quickservice li span{display: block; width:20px; height:25px; line-height:30px; margin:5px auto 0; padding:0; font-size:1.5em; font-weight:lighter; text-align:center; }
.floatwrap .quickservice li a:hover span{color:#FFFFFF;}
.floatwrap .quickservice li a:hover{ background:#666666; color:#FFFFFF; }

.floatwrap .link { display:block; margin:30px auto; padding:10px; }

.floatwrap .link .adpic_topsns{display:block; width:100%; float:right; padding:16px 0; }
.floatwrap .link .adpic_topsns img{ display:inline-block; float:left; margin:0 2px;}

.floatwrap .link .toplink {  display: block; width:100%; margin-bottom:40px; padding-bottom:20px; border-bottom:1px solid #dddddd; }
.floatwrap .link .toplink li { display: inline-block; position: relative; float: left; height:20px; line-height:20px; padding:0 6px 0 5px; }
.floatwrap .link .toplink li:before { display: block; content: ""; position: absolute; right: 0; top: 6px; margin: 0; width: 1px; height: 8px; background: #dddddd; }
.floatwrap .link .toplink li:first-child { display: inline-block; position: relative; float: left; padding-left:0; }
.floatwrap .link .toplink li:last-child:before { background:none; }
.floatwrap .link .toplink li a{ display:block; height:20px; line-height:20px; }


.floatwrap .link .nav {  display: block; width:100%; }
.floatwrap .link .nav li { display: inline-block; position: relative; float: left; height:20px; line-height:20px; padding:0 6px 0 5px; }
.floatwrap .link .nav li:first-child { display: inline-block; position: relative; float: left; padding-left:0; }
.floatwrap .link .nav li:before { display: block; content: ""; position: absolute; right: 0; top: 6px; margin: 0; width: 1px; height: 8px; background: #dddddd; }
.floatwrap .link .nav li:last-child:before { background:none; }
.floatwrap .link .nav li a{ display:block; height:20px; line-height:20px; }
.floatwrap .link .nav li span.cnt{display:inline-block; width:18px; height:18px; line-height:18px; color:#ffffff; text-align:center; vertical-align:middle; font-size:11px; background:#4b4b4b; border-radius:100%; letter-spacing:1px; }




/*»çÀÌÁî°¡À̵å*/
.floatwrap .adpic_float{display:block; padding:20px; clear:both; border-top:1px solid #dddddd;}
.floatwrap .adpic_float ul{ display:block; width:100%; text-align:center; clear:both; }
.floatwrap .adpic_float ul li{ display:inline-block; float:left; width:48%; margin:1%; padding:0; }
.floatwrap .adpic_float ul li a{ display: block; padding:2px; line-height:40px; font-size:12px; text-align:center; border:1px solid #dddddd; }
.floatwrap .adpic_float li a:hover span,
.floatwrap .adpic_float li a:hover{ background:#FFFFFF; color:#f495a9; }

/*ÃÖ±Ùº»»óÇ°*/
.floatwrap .recent{ display:block; position:relative; z-index:0; }
.floatwrap .recent .recent-list{ display:block; margin:0 auto 0 3px; text-align:center; font-size:9px; border:none;  }
.floatwrap .recent .recent-list .list { width: 63px; padding: 0 10px 10px; background: none; border: none; }
.floatwrap .recent .recent-list div.list { position: relative; border:none; width:100%; margin: 0 auto; padding: 10px 0; background: none; text-align:center;  }
.floatwrap .recent .recent-list div.list ul li{ display:block; margin:5px; text-align:center;}
.floatwrap .recent .recent-list div.list ul li div { display: none !important; }
.floatwrap .recent .recent-list div.list ul li button {display:none !important;}
.floatwrap .recent .recent-list div.list ul li > a { display: block; width: 61px; height: 61px; margin:0 auto; background-size: 61px 61px; background-repeat: no-repeat; background-position: center; border: 1px solid #eae9e9; }
.floatwrap .recent .recent-list div.list ul li:hover > a { border: 1px solid #a0a0a0; border-left: 1px solid #a0a0a0; }
.floatwrap .recent .recent-list div.list ul li > a img{ display:block; width:100%;}

.floatwrap .recent{display:block; padding:20px; clear:both; background:#FFFFFF; border-bottom:1px solid #dddddd; border-top:1px solid #dddddd;}
.floatwrap .recent .recent-list .paging { display:block; position:relative; width:100%; padding: 0; margin-top:10px; overflow:visible; }
.floatwrap .recent .recent-list .paging button.prev { position:absolute; left:0; top:-50px; background: url('../../img/side/btn-prev.png') no-repeat left top; }
.floatwrap .recent .recent-list .paging button.next { position:absolute; right:0; top:-50px; background: url('../../img/side/btn-next.png') no-repeat left top; }
.floatwrap .recent .recent-list .paging span { float: none; width: 33px; margin:0 auto; color: #939393; text-align: center; }


/*
================
	°Ë»ö
================
*/	
.floatwrap #search { display:block; width:250px; height:30px; margin:0 auto;  background:#FFFFFF; border:1px solid #dddddd; }
.floatwrap #search .search{ display:block; width:100%; height:100%;}
.floatwrap #search .txtinput {display:block; width:100%; height:30px; }
.floatwrap #search .MS_search_word { display:inline-block; float:left; width:220px; height:100%; padding:0; line-height:20px; border:none; font-size:11px;  background-color:transparent;  /*border-bottom:1px solid #cccccc;*/  }

.floatwrap #search:hover .search_input {}
.floatwrap #search a{background-color:transparent; color:#1e1e1e;}
.floatwrap #search .search_btn { display:inline-block; float:right; margin:0; border:none; vertical-align:middle;}

/**SIDE**/
.floatwrap a { -webkit-transition: all 0.20s ease-in-out; -moz-transition: all 0.20s ease-in-out; -o-transition: all 0.20s ease-in-out; -khtml-transition: all 0.20s ease-in-out; -ms-transition: all 0.20s ease-in-out; transition: all 0.20s ease-in-out; }

.floatwrap h2{display:block; position:relative; margin:0 auto 10px;  line-height:40px; color:#222222; font-size:11px; font-weight:700; letter-spacing:1px; text-align:left;}
.floatwrap h2:before { display: block; content: ""; position: absolute; left: 0; bottom: 0; margin: 0; width: 10px; height: 2px; background: #555; }

.floatwrap .cscenter{ display:block; margin:30px auto; padding:0 10px; }
.floatwrap .cscenter:after{content:''; display:block; clear:both;}

.floatwrap .cscenter .tabarea { position: relative; margin: 0 auto; }
.floatwrap .cscenter .tab { display:block; }
.floatwrap .cscenter .tab h2{margin:0 auto;}
.floatwrap .cscenter .tab h2:before { display: block; background:none; }

.floatwrap .cscenter .tabnavi { display:block; }
.floatwrap .cscenter .tabnavi span { display:block; float:right; line-height:40px; 
	-webkit-transition: transform 150ms ease-out;	-moz-transition: transform 150ms ease-out;	-o-transition: transform 150ms ease-out;	transition: transform 150ms ease-out; }
.floatwrap .cscenter .tabnavi.active span{ -webkit-transform-origin: 50% 50%; -moz-transform-origin: 50% 50%; -ms-transform-origin: 50% 50%; -o-transform-origin: 50% 50%;	transform-origin: 50% 50%;
	-webkit-transform: rotate(45deg);	-moz-transform: rotate(45deg);	-ms-transform: rotate(45deg);	-o-transform: rotate(45deg);	transform: rotate(45deg); }
.floatwrap .cscenter .tabnavi.active h2:before { display: block; content: ""; position: absolute; left: 0; bottom: 0; margin: 0; width: 10px; height: 2px; background: #555; }
.floatwrap .cscenter .tabcon { display: none; padding: 10px 0 20px; }


.floatwrap .cscenter strong { }
.floatwrap .cscenter p { display:block; line-height:20px; }
.floatwrap .cscenter .txt1 { display:block; line-height:30px; }
.floatwrap .cscenter .warning{ display:block; text-align:center; color:#FF0000; font-weight:normal; }
.floatwrap .cscenter dl{display:block; line-height:20px; }
.floatwrap .cscenter dt{display:block; line-height:20px; margin:0 auto; }
.floatwrap .cscenter dd{display:block; line-height:20px; margin:0 auto; }

.floatwrap .cscenter span.bankname{ display:inline-block; float:left; width:30px; font-weight:bold;  }
.floatwrap .cscenter span.account{ display:inline-block; float:left;  }
.floatwrap .cscenter span.depositor { display:block; }
.floatwrap .cscenter span.depositor strong {}


.floatwrap .bankinfo .banking { display: block; position: relative; width: 150px; height: 25px; margin:10px 0; padding: 0; border: 1px solid #dddddd; font-size: 11px; z-index:1; }
.floatwrap .bankinfo .banking p.default { display:block; padding:0 5px; line-height: 25px; background: url('/design/d4-0396/_msc/images/common/ico_arrowdown.png') 125px center no-repeat; }
.floatwrap .bankinfo .banking.on p.default { background: url('/design/d4-0396/_msc/images/common/ico_arrowup.png') 125px center no-repeat;
													-webkit-transition: all 0.10s ease-out; -moz-transition: all 0.10s ease-out; -o-transition: all 0.10s ease-out; transition: all 0.10s ease-out; }
.floatwrap .bankinfo .banking ul.list { display: none; position: absolute; left: -1px; top: 100%; width: 100%; padding:5px 0; border: 1px solid #7d7d7d; background: #FFFFFF; }
.floatwrap .bankinfo .banking ul.list li { display: block; padding: 0;}
.floatwrap .bankinfo .banking ul.list li a { display: block; padding: 4px 5px 0; text-indent: 0; text-decoration:none; }
.floatwrap .bankinfo .banking ul.list li a:hover { background: #f9f9f9; text-indent: 5px; }


/** Board List **/
.floatwrap .bnb { display:block; position:relative; float:left; width:100%; margin:0 auto; }
.floatwrap .bnb ul{display:block; margin:0 auto; }
.floatwrap .bnb li{display:inline-block; float:left; width:50%; height:20px; line-height:20px; }
.floatwrap .bnb li a{display:block; height:20px; line-height:20px; }


.floatwrap .bnb,
.floatwrap .csinfo,
.floatwrap .bankinfo{display:block; position:relative; width:100%; /*padding:10px 0; border-top:1px solid #cccccc; border-bottom:1px solid #cccccc;*/ }
.floatwrap .bnb:after,
.floatwrap .csinfo:after,
.floatwrap .bankinfo:after{content:''; display:block; clear:both;}

/*°í°´¼¾ÅÍ*/
/*.floatwrap .cscenter{display:block; margin:30px 20px; }
.floatwrap .csinfo{ display:block; margin:30px auto 0;}
.floatwrap .bankinfo{display:block; margin:30px auto;}
.floatwrap .cscenter:after,
.floatwrap .csinfo:after,
.floatwrap .bankinfo:after{content:''; display:block; clear:both;}

.floatwrap .cscenter .tel{ display:block; margin: 5px 0; color: #000; font-size: 18px; font-weight:bold; line-height: 20px;}
.floatwrap .cscenter .time{ display:block; margin: 10px 0; color: #888888; font-size: 11px; font-weight: 400; line-height: 14px; }
.floatwrap .cscenter .bankname{ display: inline-block;  width:50px; color: #888888; font-size: 11px; font-weight: 400; line-height: 14px; letter-spacing:-1px; }
.floatwrap .cscenter .account{ display: inline-block;  color: #222222; font-size: 11px; font-weight: bold; line-height: 14px; }
.floatwrap .cscenter .depositor { display:block; margin: 5px 0; color: #000000; font-size: 12px; line-height: 14px; }
*/

/* BASIC css end */


/* BASIC css end */