@charset "utf-8";

body{background:#f7f7f7}

/* 레이아웃 */
.CALW RAP{position:relative;width:836px;margin:0 10px;}
.CALHEADER{height:63px;margin-left:10px;background:url(https://oimg1.kbstar.com/img/ocalculator/bg_head.gif) no-repeat;position: relative;}
.C ALCONTAINER{position:relative;overflow:hidden;*zoom:1;}
.CALLNB{position:absolute;left:10px;top:63px;width:147px}
.CALCONTENT{width:685px;height:auto;padding:0 10px 0 157px;background:url(https://oimg1.kbstar.com/img/ocalculator/bg_body.gif) repeat-y 10px 0;min-height:494px;}
.CALFOOTER{height:34px;margin-left:10px;background:url(https://oimg1.kbstar.com/img/ocalculator/bg_footer.gif) no-repeat 0 100%}

/* LNB */
.CALLNB{width:139px;margin:-2px 0 0 4px}
.CALLNB h2{width:127px;height:28px;padding:10px 0 0 12px;font:0/0 Arial;background:url(https://oimg1.kbstar.com/img/ocalculator/bg_lnb.gif) no-repeat }
.CALLNB .lnbMenu{width:129px;margin:1px 0 4px 0;padding:5px 5px 15px 5px;background:url(/img/ocalculator/bg_lnb.gif) no-repeat 0 100%}
.CALLNB .lnbMenu li{vertical-align:top;display:block;margin-bottom:3px;*zoom:1}
.CALLNB .lnbMenu li a{vertical-align:top;position:relative;top:3px;display:block;padding:2px 0 1px 19px;*padding:0 0 3px 19px;_padding:1px 0 3px 19px;color:#fff;line-height:1.4;background:url(https://oimg1.kbstar.com/img/ocalculator/bg_lnbbult.gif) no-repeat 11px 5px}
:root .CALLNB .lnbMenu li a{padding:0 0 3px 19px;}
.CALLNB .lnbMenu li.on{background:url(https://oimg1.kbstar.com/img/ocalculator/bg_lnbon.gif) no-repeat 0 0}
.CALLNB .lnbMenu li.on a{color:#463f3a;font-weight:bold;background:url(https://oimg1.kbstar.com/img/ocalculator/bg_lnbon.gif) no-repeat 0 100%}

.CALHEADER .logo{padding:19px 0 0 4px;font:0/0 Arial}
.CALHEADER .act_Btn{position: absolute; right:20px; top:20px;}
.titArea{overflow:hidden;*zoom:1;height:40px;background:#f3f3f3}
.titArea .tit_cal{float:left;padding:12px 0 0 25px;font:0/0 Arial}
.titArea .txt_titInfo{float:left;padding:13px 0 0 10px;color:#928881;letter-spacing:-0.05em;}

.btnArea{margin-top:10px}
.calculatorTab{position:relative;background:url(https://oimg1.kbstar.com/img/ocalculator/bg_calConbg.gif) no-repeat 0 100%}
.calculatorTab .calTab{overflow:hidden;*zoom:1;width:100%;padding-bottom:30px;background:url(https://oimg1.kbstar.com/img/ocalculator/bg_tab2.gif) repeat-x}
.calculatorTab .calTab li{float:left;background:url(https://oimg1.kbstar.com/img/ocalculator/bg_tab.gif) no-repeat}
.calculatorTab .calTab li .link_tab{display:block;width:237px;height:30px;padding:8px 0 0 30px;font-weight:bold}
.calculatorTab .calTab li .link_tab span{padding-right:26px;color:#78716b;font-size:14px;background:url(https://oimg1.kbstar.com/img/ocalculator/bg_tabBult.gif) no-repeat 100% 2px}
.calculatorTab .calTab li.on .link_tab span{color:#463f3a;background-position:100% -39px}
.calculatorTab .calTab li.on .link_tab{height:30px;padding-left:30px}
.calculatorTab .deposit li.on .link_tab{width:236px;}
.calculatorTab .calTab li.on{border:1px solid #c1c1c1;border-bottom:none;background:#fff}
.calculatorTab .calTab li.on.first{border-left:none}
.calculatorTab .calTab li.last{background-position:-268px 0}
.calculatorTab .calTab li .cont{position:absolute;top:54px;left:20px;text-align:left}
.calculatorTab .calTab li.off .cont{display:none}

.calculatorResult{margin:27px 30px 0 30px}
.calculatorResult .txtResult{padding-bottom:3px;font-weight:bold;*letter-spacing:-0.05em}

.CALFOOTER .footNum{padding:10px 0 3px 6px;color:#fff}
.CALFOOTER .footNum .bar{display:inline-block;padding:0 3px 0 5px;color:#928881;font-size:11px;line-height:1.4}

/* 슬라이더 */
.ui-widget-content, .ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default{border:none !important}
.slider{width:230px;text-indent:-9999%;}
.ui-slider{position:relative;text-align:left;}
.ui-slider .ui-slider-handle {position:absolute;z-index:2;width:10px;height:10px;cursor:default;background:url(https://oimg1.kbstar.com/img/ocalculator/btn_slider_ctrl.png) no-repeat center bottom;color:gray}
.ui-slider .ui-slider-range {display: block;position:absolute;z-index:1;font-size:.7em;border:0; background-position: 0 0}
.ui-slider-horizontal { height: 15px;background:url(https://oimg1.kbstar.com/img/ocalculator/bg_slider.gif) repeat-x 0 0;margin-left:5px}
.ui-slider-horizontal .ui-slider-handle { top:0px;margin-left: -.7em; font-family:tahoma;font-size:10px;text-align:center;text-decoration:none;line-height:14px}
.ui-slider-horizontal .ui-slider-range { height:100%; background:url(https://oimg1.kbstar.com/img/ocalculator/bg_slider_on.gif) no-repeat 0 0}

.calculatorTab .deposit01{position:relative;width:645px;height:180px}
.prodcalWrap{*zoom:1;width:480px;border-right:1px solid #e8e8e5;background:none}
.prodcalWrap li{*zoom:1;position:relative;margin-bottom:10px;background:none !important}
.prodcalWrap li label{position:absolute;top:2px;left:0;font-weight:bold;text-align:left}
.prodcalWrap li .slideWrap{width:395px;*width:415px;margin:4px 0 0 75px;text-align:left}
.prodcalWrap li .slideWrap .inputArea{position:absolute;top:5px;_top:0;left:328px;width:160px}
.prodcalWrap li .slideWrap .inputArea input{width:85px;margin-right:3px;vertical-align:middle}
.prodcalWrap li .slideWrap .txtSum{position:absolute;top:35px;left:315px;*width:150px;color:#928881;font-size:11px;letter-spacing:-0.03em}
.prodcalWrap li.prodMoney{height:49px;}
.prodcalWrap li.prodRate{height:35px}
.prodcalWrap li.prodCycle{height:35px;margin:0}
.prodCycle .cal{width:17px !important;height:15px;}
.prodCycle .slideWrap{overflow:hidden;margin-top:-3px !important}
.prodCycle .slideWrap *{vertical-align:middle}
.prodcalWrap li.prodRate label{margin-top:8px;}
.prodcalWrap li.prodRate .slide{margin-top:10px}
.graphWrap{position:absolute;top:0;right:5px}

/* 버튼 */
.btncal, .btncal *{display:inline-block;position:relative;height:20px;font-size:11px;line-height:20px;text-align:center;background:url(https://oimg1.kbstar.com/img/ocalculator/bg_btn.gif) no-repeat}
.btncal{margin-right:4px;}
.btncal *{left:2px;padding:1px 5px 0 2px;*padding:0 3px 1px 1px;border:none;background:none;background:url(https://oimg1.kbstar.com/img/ocalculator/bg_btn.gif) no-repeat 100% 0}

.titLoan{border-bottom:1px solid #d8d8d8}
.calculatorCont .loan01{position:relative;height:250px;padding:20px 20px 0 20px;background:url(https://oimg1.kbstar.com/img/ocalculator/bg_calConbg.gif) no-repeat 0 100%}
.calculatorCont .loan01 .graphWrap{top:25px;right:25px}
.loan01 .prodcalWrap{width:455px;padding-right:0}
.loan01 .prodcalWrap li{height:42px !important;margin-bottom:0 !important}
.loan01 .prodcalWrap li.prodCycle,.loan01 .prodcalWrap li.prodMethod{padding-top:3px;height:25px !important}
.loan01 .prodRate{height:35px !important}
.prodMethod .label{position:absolute;top:2px;left:0}
.prodMethod .slideWrap label{position:static;float:none !important;font-weight:normal !important}
.graphWrap .graphResult{margin:0 0 0 15px}
.graphWrap .graphResult li{padding:4px 0 3px 8px;text-align:right;border-bottom:1px solid #eee;background:url(https://oimg1.kbstar.com/img/ocommon/bullet/bult_dep2.gif) no-repeat 0 12px}
.graphWrap .graphResult li em{float:left}

.calculatorCont .loan02{height:100px;padding:20px 25px 0 25px;background:url(https://oimg1.kbstar.com/img/ocalculator/bg_calConbg.gif) no-repeat 0 100%}
.calculatorCont .loan02 .prodcalWrap {border-right:0}
.rateRight .prodMethod{margin-bottom:3px}
.calculatorCont .loan02 .slideWrap .inputArea{left:345px}
.rateRight .prodMethod strong{width:70px}
.rateRight .prodMethod .standard{margin-bottom:5px;}
.rateRight .prodMethod .standard *{vertical-align:middle}
.rateRight .prodMethod .standard label{padding-right:5px}
.rateRight .prodMethod .standard input{padding:0 5px}
.rateRight .prodMethod .standard .selbox{padding:3px 4px 4px 0}

/* 환율 */

.calculatorTab .foex li{background:url(https://oimg1.kbstar.com/img/ocalculator/bg_tab.gif) no-repeat 0 -60px}
.calculatorTab .foex li.last {background-position:-195px -60px}
.calculatorTab .foex li .link_tab {width:165px}
.calculatorTab .foex li .foex01 .rateLeft{position:absolute;top:0;left:0;width:150px}
.rateLeft .scrollCurrency{overflow:auto;overflow-x:hidden;height:139px;padding:4px 4px 4px 0;border:1px solid #ccc}
.rateLeft .scrollCurrency li{float:none;border:none;background:none}
.rateLeft .scrollCurrency li a{display:block;padding:4px 0 4px 33px;letter-spacing:-0.1em;background:url(https://oimg1.kbstar.com/img/ocalculator/bg_flag02.gif) no-repeat 15px -870px}
.rateLeft .scrollCurrency li.on,.rateLeft .scrollCurrency li a:hover{background-color:#f5f3f2}
.rateLeft .scrollCurrency li.on{border:0}
.calculatorTab .foex li .foex01 .rateRight{margin-left:178px}

.rateLeft .scrollCurrency li.american a{background-position:15px 8px}
.rateLeft .scrollCurrency li.japan a{background-position:15px -14px}
.rateLeft .scrollCurrency li.euro a{background-position:15px -35px}
.rateLeft .scrollCurrency li.found1 a{background-position:15px -57px}
.rateLeft .scrollCurrency li.canada a{background-position:15px -80px}
.rateLeft .scrollCurrency li.swiss a{background-position:15px -102px}
.rateLeft .scrollCurrency li.hk a{background-position:15px -124px}
.rateLeft .scrollCurrency li.sweden a{background-position:15px -146px}
.rateLeft .scrollCurrency li.hoju a{background-position:15px -168px}
.rateLeft .scrollCurrency li.danmark a{background-position:15px -190px}
.rateLeft .scrollCurrency li.norway a{background-position:15px -212px}
.rateLeft .scrollCurrency li.saudi a{background-position:15px -234px}
.rateLeft .scrollCurrency li.kuwait a{background-position:15px -256px}
.rateLeft .scrollCurrency li.barain a{background-position:15px -278px}
.rateLeft .scrollCurrency li.uae a{background-position:15px -300px}
.rateLeft .scrollCurrency li.singapor a{background-position:15px -322px}
.rateLeft .scrollCurrency li.malaysia a{background-position:15px -344px}
.rateLeft .scrollCurrency li.newzealand a{background-position:15px -366px}
.rateLeft .scrollCurrency li.china a{background-position:15px -388px}
.rateLeft .scrollCurrency li.taiwan a{background-position:15px -410px}
.rateLeft .scrollCurrency li.rupiah a{background-position:15px -432px}
.rateLeft .scrollCurrency li.taka a{background-position:15px -476px}
.rateLeft .scrollCurrency li.brunei a{background-position:15px -498px}
.rateLeft .scrollCurrency li.brazilian a{background-position:15px -520px}
.rateLeft .scrollCurrency li.egyptian a{background-position:15px  -542px}
.rateLeft .scrollCurrency li.forint a{background-position:15px -564px}
.rateLeft .scrollCurrency li.israeli a{background-position:15px -586px}
.rateLeft .scrollCurrency li.indian a{background-position:15px -608px}
.rateLeft .scrollCurrency li.jordanian a{background-position:15px -630px}
.rateLeft .scrollCurrency li.kazahstan a{background-position:15px -652px}
.rateLeft .scrollCurrency li.mexican a{background-position:15px -674px}
.rateLeft .scrollCurrency li.philippine a{background-position:15px -696px}
.rateLeft .scrollCurrency li.pakistan a{background-position:15px -718px}
.rateLeft .scrollCurrency li.zloty a{background-position:15px -740px}
.rateLeft .scrollCurrency li.russian a{background-position:15px -762px}
.rateLeft .scrollCurrency li.newtaiwan a{background-position:15px -784px}
.rateLeft .scrollCurrency li.dt a{background-position:15px -806px}
.rateLeft .scrollCurrency li.rand a{background-position:15px -828px}

.foex03{position:relative;margin:30px}
.foex03 .rateLeft{position:absolute;top:0;left:0;width:150px}
.foex03 .rateRight{margin-left:178px}

/* 부동산 면적계산기 */
.tcolor3 {color:#3da207}
.olmb05 {margin-bottom:5px !important}
#divSCal{top:25px !important}


/*날짜계산기*/
.calculatorCont {padding:24px 25px;min-height:405px;_height:405px;}
.calculatorCont .calendarLayer{position:static;height:250px !important;}
.calculatorCont .calendarLayer .calMove{margin:19px 0 0 27px;}
.calculatorCont .layerType{border:1px solid #d8d8d8;}
.calculatorCont .btn_todaygo {margin:10px 0 0 47px;}

.stdd-date{float:right; width:383px;}
.stdd-date dt{font-size:14px;font-weight:bold;margin-bottom:6px;}
.stdd-date dd{position:relative;}
.stdd-date .date-result{background:#f3f1ef;width:363px; height:60px;padding:10px 0 0 20px;font-weight:bold; margin-top:12px;}
.stdd-date .date-result.guide{height:55px;padding:15px 0 0 20px;}
.stdd-date .date-result.date-result02{height:38px;padding:12px 0 0 20px;}
.stdd-date .date-result.date-result02.guide2{height:33px;padding:17px 0 0 20px;}
.stdd-date .date-result strong{font-size:14px;color:#ef0000}
.stdd-date .middle {vertical-align:middle;}
.stdd-date .btn.large.action {position:absolute; top:-3px; right:0px;}


/***** kbstar.com 및 KB스타뱅킹 서비스 개편 2015 *****/
#WPOP .loan01 .prodcalWrap{width: 452px;}
#WPOP .calculatorCont .loan01 .graphWrap{top:25px;right:1px}
#WPOP .deposit .prodcalWrap{width: 452px;}
#WPOP .calculatorCont .deposit .graphWrap{top:0;right:28px}