
.calculator-wrap {
	margin:40px auto 0;
}


.crumb {border-bottom: 1px solid #eee; margin-bottom: 10px;}


.calculator-wrap h2.title {font-size: 30px; color: rgba(0,0,0,0.80); letter-spacing: 0; line-height: 38px;}

/* 导航 */
.sub-nav {height: 38px; line-height: 38px; border-bottom: 2px solid #04A4AA; margin-top: 40px;}
.sub-nav li {float: left;padding:0;}
.sub-nav li a {display: block; padding: 0 16px; font-size: 20px; cursor: pointer;}
.sub-nav li.layui-this a {background-color: #04A4AA; color: #fff;}


/* 内容 */
.calculator {position: relative; padding: 0 10px; margin: 64px 0 80px; font-size: 14px;}
.calculator .split {position: absolute; display: none; top: 0; bottom: 0; left: 522px; width: 1px; background: #dedede;}
.calculator .split s, .calculator .split i {position: absolute; width: 0; height: 0; border: 14px solid transparent;}
.calculator .split s {border-left-color: #ccc; top: 50%; left: 0; margin-top: -7px;}
.calculator .split i {left: -15px; top: -14px; border-left-color: #fff;}
.calculator .ct span {font-size: 20px; color: rgba(0,0,0,.6); text-align: right; line-height: 28px; }

/* 填写信息 */
.calculator .write {float: left; width: 502px; margin: 0 90px 0 300px;}
.w1200 .calculator .write { margin: 0 150px 0 330px;}
.calculator .write dl {margin-top: 34px; line-height: 32px;}
.calculator .write .mode-item {display: none;}
.calculator .write dl.nm {margin-top: 0;}
.calculator .write dt {float: left; width: 70px; text-align: right; margin-right: 5px;font-size: 14px; color: rgba(0,0,0,0.60); line-height: 32px;}
.calculator .write dt.btn-dt {
	width: 70px;
}
.calculator .write dd {float: left; position: relative; display: inline; }
.calculator .write dd label {margin-right: 15px; cursor: pointer;font-size: 14px; color: rgba(0,0,0,.6); line-height: 22px;}
.calculator .write dd input {vertical-align: middle;}
.calculator .write dd label input {margin-top: -2px;opacity:0;cursor: pointer;}
.calculator .write dd label .i-btn { display:inline-block; vertical-align: middle; width:16px; height:16px; border-radius:50%; background:url(../img/choice_no.png);}
.calculator .write dd .ibtn-wrap.active .i-btn { background:url(../img/choice_active.png); cursor: pointer;}
.calculator .write dd input[type=text] {width: 250px; height: 32px; padding: 0 10px; border: 1px solid rgba(0,0,0,0.15);border-radius:2px; line-height: 32px; font-size: 14px;box-sizing: border-box;}
.calculator .write dd input[type=text]:focus {border: 1px solid #04A4AA;}
.calculator .write dd input.error_txt {border-color: #fd5945;}
.calculator .write dd em {position: absolute; right: 16px; top: 0; color: #999; line-height: 35px;}
.calculator .write dd .ll {position: relative;}
.calculator .write dd .sel {display: block; position: relative; width: 250px; height: 32px; padding: 0 10px; border: 1px solid #dfdfdf; line-height: 32px;box-sizing: border-box;}
.calculator .write dd .sel s, .calculator .write dd .sel i {position: absolute; width: 0; height: 0; border: 6px solid transparent;}
.calculator .write dd .sel s {border-top-color: #999; top: 13px; right: 10px;}
.calculator .write dd .sel i {left: -6px; top: -7px; border-top-color: #fff;}
.calculator .write dd .sel-con {position: absolute; display: none; left: 0; top: 33px; width: 220px; max-height: 300px; overflow-y: auto; background: #fff; z-index: 100; border: 1px solid #dfdfdf; box-shadow: 0 10px 20px rgba(0,0,0,.2);}
.calculator .write dd .sel-con a {display: block; padding: 0 10px;}
.calculator .write dd .sel-con a:hover, .calculator .write dd .sel-con .curr a {background: #efefef; color: #666;} 
.calculator .write .error_msg {color: #fd5945; line-height: 30px; visibility: hidden;font-size:12px;}
.calculator .write .subtn {width: 250px; height: 32px; margin-right: 16px; background: #04A4AA; border: none; font-size: 14px; color: #fff; cursor: pointer;float:left;line-height:32px;}
.reset {
	border: 1px solid #04A4AA;
	border-radius: 3px;
	width: 88px;
	height: 30px;
	line-height: 30px;
	font-size: 14px;
	color: #04A4AA;
	text-align: center;
	letter-spacing: 0;
	cursor: pointer;
	display:inline-block;
}
.reset:hover {
	color:#04A4AA;
}

/* 计算结果 */
.calculator .result {float: left; display: none;}
.calculator .result .item {float: left; margin-top: 25px;}
.calculator .result .item.l {margin-right: 40px;}
.w1200 .calculator .result .item.l {margin-right: 50px;}
.calculator .result h3 {padding-bottom: 20px; font-size: 14px;}
.calculator .result h3 .tips {position: relative; margin-left: 10px;}
.calculator .result h3 .tips i {display: inline-block; width: 22px; height: 22px; vertical-align: middle; cursor: pointer; margin-top: -2px;}
.calculator .result h3 .tips_div {position: absolute; display: none; left: 0px; top: 8px; margin: 0 0px 0px -98px; padding: 20px 0 10px; -webkit-animation: topFadeIn .2s ease-out; -moz-animation: topFadeIn .2s ease-out; animation: topFadeIn .2s ease-out;}
.calculator .result h3 .tips_con {position: relative; width: 208px; padding: 8px 15px; background: #fff; border: 1px solid #dfdfdf; box-shadow: 0 0 20px rgba(0,0,0,.2);}
.calculator .result h3 .tips_con em, .calculator .result h3 .tips_con s {position: absolute; width: 0; height: 0; border: 8px solid transparent;}
.calculator .result h3 .tips_con em {border-bottom-color: #ccc; top: -16px; left: 97px;}
.calculator .result h3 .tips_con s {left: -8px; top: -7px; border-bottom-color: #fff;}
.calculator .result h3 .tips_con p {font-size: 12px; line-height: 20px; color: #666;}
.calculator .result .r-con {border: 1px solid #efefef; border-bottom: 0;box-sizing: border-box;}
.calculator .result .r-con dl {border-bottom: 1px solid #efefef; height: 39px; line-height: 39px;}
.calculator .result .r-con dt {float: left; width: 90px; text-align: center;}
.calculator .result .r-con dd {float: left; width: 171px; padding-right: 10px; text-align: right; border-left: 1px solid #efefef;box-sizing: border-box;}
.calculator .result .r-con dd a {color: #04A4AA; margin-left: 10px;}
.calculator .result .bz {margin-top: 20px;}
.calculator .result .bz h4 {padding-bottom: 10px;}
.calculator .result .bz p {color: #999;}


.calculator-wrap-zh .calculator .write dt{width:120px;}


/* 等额本金还款明细 */
.ui_content {margin: 0 0 10px;}
.mxtit {height: 50px; font-size: 16px; background-color: #fff; line-height: 50px; text-align: center;}
.mxtit strong {font-size: 20px; color: #FD5945;}
.bj_popup {padding: 10px 10px 0 0; width:680px; height: 592px; background-color: #F9FBFB; overflow-y: auto;margin:0 0 0 8px;}
.bj_popup li {position: relative; height: 40px; line-height: 40px; margin-bottom: 8px;}
.bj_popup li span {position: absolute; left: 0; top: 0; height: 40px; background-image: linear-gradient(233deg, #04A4AA 0%, #057D82 95%);  color: #fff; text-indent: 16px;}
.bj_popup li span em {position: absolute; right: 16px; top: 0;}
.bj_popup::-webkit-scrollbar {
	width: 16px;
	height:40px;
	background:#fff;
	padding:0 16px;
}
.bj_popup::-webkit-scrollbar-thumb {
	margin: auto;
	background:#ccc;
	border-radius:8px;
	height: 40px;
}

/* 热门 */
.gzlist .lpTop{margin:60px 0 35px;font-size: 22px;font-weight: bold;color:#1a1c21;}
.gzlist  ul li{width: 285px;height: 370px;float:left;margin-right:20px;-webkit-transition: all .3s ease-in-out; -moz-transition: all .3s ease-in-out; transition: all .3s ease-in-out;}
.gzlist  ul li:nth-child(4n){margin-right: 0;}
.gzlist  ul li:hover{box-shadow: 0px 3px 13px 0px rgba(0, 0, 0, 0.07);}
.gzlist  ul li a{display: block;}
.gzlist  ul li .imgbox{width: 285px;height: 230px;overflow: hidden;position: relative;}
.gzlist  ul li .imgbox img{position:absolute;top:0;left:0;right:0;bottom:0;max-width:100%;max-height:100%;margin:auto;-webkit-transition: all .5s ease-in-out; -moz-transition: all .5s ease-in-out; transition: all .5s ease-in-out; -webkit-transform: scale(1); -moz-transform: scale(1); -ms-transform: scale(1);}
.gzlist  ul li .imgbox img:hover{-webkit-transform: scale(1.1); -moz-transform: scale(1.1); transform: scale(1.1);-moz-opacity: 0.8; -khtml-opacity: 0.8; opacity: 0.8;}
.gzlist .vrIcon{width:60px;height:60px;position: absolute;left:0;bottom:0;}
.gzlist .vrIcon img{width:60px!important;height:60px!important;}
.gzlist .viIcon{width:50px;height:50px;position: absolute;left:50%;top:50%;margin-top: -25px;margin-left:-25px;}
.gzlist .viIcon img{width:50px!important;height:50px!important;}
.gzlist  ul li .txtbox{padding:20px 0;}
.gzlist  ul li .txtbox h4{font-size: 18px;color:#212121;overflow:hidden;text-overflow: ellipsis;white-space: nowrap;-webkit-transition: all .5s ease-in-out; -moz-transition: all .5s ease-in-out; transition: all .5s ease-in-out;line-height: 32px;}
.gzlist  ul li:hover h4{color:#2974ff;}
.gzlist  ul li .txtbox p{padding:0;line-height: 32px;}
.gzlist  ul li .txtbox .pprice{font-size: 12px;color:#f1370b;font-weight: bold;}
.gzlist  ul li .txtbox .pprice span{float: left;margin-right: 10px;}
.gzlist  ul li .txtbox .pprice b{font-size: 20px;}
.gzlist  ul li .txtbox .parea{font-size: 14px;color:#797a82;}
.gzlist  ul li .txtbox .parea em{font-size: 12px;color:#d3d4de;margin:0 10px;}



.ui_lock_scroll{ *overflow:hidden; }
.ui_lock_scroll body{ overflow:hidden; }

/*结构层*/
.ui_content,.ui_title,.ui_buttons input{ font:14px/1.333 microsoft yahei, tahoma,arial,\5b8b\4f53,sans-serif; }
table.ui_border,table.ui_dialog{ width:auto;border-spacing:0;*border-collapse:collapse; }
.ui_dialog{ background:#FFF; }

/*标题部分开始*/
.ui_title{ overflow:hidden;text-overflow:ellipsis;white-space:nowrap;display:block;cursor:move;background: rgba(53,217,227,0.10);-moz-user-select:none;-webkit-user-select:none;padding:0 100px 0 0; }
.ui_title_buttons{ position:absolute;cursor:pointer;font-size:0;letter-spacing:-.5em;}

/*对齐自适应*/
.ui_main{ min-width:20em;min-width:0\9;text-align:left; overflow: hidden; border-right: 1px solid #ccc\9; *border-right: 1px solid #ccc; _border-right: 1px solid #ccc;}
.ui_content{text-align:left; overflow: hidden; margin: 10px 8px 0;}
.ui_content.ui_state_full{ display:block;width:100%;height:100%;margin:0;padding:0!important; }
.ui_content.ui_state_full iframe{ border-radius:0 0 5px 5px; }
.ui_loading{ width:96px;height:32px;text-align:left;text-indent:-9999em;overflow:hidden;background:url(../img/loading.gif) no-repeat center center; margin:0 auto}
.ui_icon_bg{ margin:20px 0 20px 25px; }

/*标题纯CSS按钮开始 min 最小化，max最大化，res还原，rese恢复，close关闭*/
.ui_min,.ui_max,.ui_close,.ui_res{ position:relative;text-decoration:none;letter-spacing:normal;text-align:center;display:inline-block;*display:inline;zoom:1;vertical-align:top;font-family:tahoma,arial,\5b8b\4f53,sans-serif; }
.ui_min b,.ui_max b,.ui_res_t,.ui_res_b{ display:block;position:absolute;overflow:hidden;cursor:pointer; }
.ui_close{ font-weight:500;text-decoration:none;outline:0 none; }
.ui_close:hover{ text-decoration:none; }

/*Tips部分*/
.ui_state_tips .ui_main{ min-width:3em; }
.ui_state_tips .ui_content{ margin-top:-2px;}
.ui_state_tips .ui_icon_bg{ margin:5px 0 6px 9px; }
.ui_state_tips .ui_title,.ui_state_tips .ui_title_buttons,.ui_res{ display:none; } /* 还原按钮也在这里隐藏，这样可节省代码，注间这段一定要写在上面那段代码的下面*/

table.ui_state_tips {border:1px solid #ccc; -moz-box-shadow:0px 5px 10px rgba(0,0,0,0.2); -webkit-box-shadow:0px 5px 10px rgba(0,0,0,0.2); box-shadow:0px 5px 10px rgba(0,0,0,0.2);}
table.ui-state_tips .ui_content {text-align:left;}

#ldg_lockmask{ background:#000;filter:alpha(opacity=40);opacity:.4;}

/*样式层开始*/
.ui_inner{border:1px solid #999; }
.ui_border{border: 1px solid #ccc\9; *border: 1px solid #ccc; _border: 1px solid #ccc; background:#fff; border-radius:4px; -webkit-box-shadow:0 5px 60px rgba(0, 0, 0, 0.3); -ms-box-shadow:0 5px 60px rgba(0, 0, 0, 0.3); -o-box-shadow:0 5px 60px rgba(0, 0, 0, 0.3); -moz-box-shadow:0 5px 60px rgba(0, 0, 0, 0.3); box-shadow:0 5px 60px rgba(0, 0, 0, 0.3);}

/*标题栏样式*/
.ui_title_bar{position:relative;height:100%;border-radius:5px 5px 0 0;}
.ui_title{height:47px;line-height:47px;font-size:16px;color: rgba(0,0,0,0.80);padding-left:24px;}

/*标题纯CSS按钮定位部分*/
.ui_title_buttons{ top:7px;right:8px; }
.ui_min,.ui_max,.ui_close,.ui_res{ color:#c1c1c1;font-size:22px;width:22px;height:22px;line-height:18px; margin-top:6px;}
.ui_min_b{ top:10px;left:5px;width:12px;height:2px;border-bottom:2px solid #FFF; }
.ui_max_b{ top:5px;left:5px;width:10px;height:7px; }
.ui_res_t,.ui_res_b{ top:8px;left:3px;width:10px;height:5px; }
.ui_res_b{ top:4px;left:6px; }
.ui_res_t,.ui_res_b,.ui_max_b{border:1px solid #c1c1c1;border-top-width:3px; }
.ui_res_t{ background:#fff; }
.ui_min:hover b,.ui_max:hover b,.ui_res:hover b{ border-color:#c93333; }
.ui_close{vertical-align:baseline; line-height:22px; margin-top:5px; -moz-transition:-moz-transform .2s ease-in; -webkit-transition:-webkit-transform .2s ease-in; -o-transition:-o-transform .2s ease-in; transition:transform .2s ease-in;}
.ui_close:hover{color:#c93333; text-decoration:none; outline:none; -moz-transform:rotate(90deg); -moz-transform-origin:50% 50%; -webkit-transform:rotate(90deg); -webkit-transform-origin:50% 50%; -o-transform:rotate(90deg); -o-transform-origin:50% 50%; transform:rotate(90deg); transform-origin:50% 50%;}
