﻿* {
    margin: 0;
    padding: 0;
    border: none;
    font-family: "Microsoft Yahei";
}

ul,ol,dl{
    list-style:none;
}

html,body {
    height: 100%;
    font-size:14px;
    overflow: hidden;
}

.top_M31{margin-top:31px;}
.top_M18{margin-top:18px;}
.bottom_M15{margin-bottom:15px;}
.bottom_M31{margin-bottom:31px;}
.bottom_M50{margin-bottom:50px;}

.h1{
    color:#f85151;
}
.h2{
    color:#437fd6;
}

.claculator_main{
    width:500px;
    margin:0 auto;
}

.claculator_main_out{
    padding-top:16px;
    padding-left:9px;
    padding-right:9px;
}
.claculator_main_head{
    border:1px solid #5a9bde;
    border-radius:2px;
}

.claculator_main_head>li{
    display:inline-block;
    width:120px;
    height:40px; line-height:40px;
    text-align:center;
    font-size:14px; color:#437fd6;
    cursor:pointer;
}

.claculator_main_head>li.on{
    background:#437fd6;
    color:#fff;
}

.claculator_main_body{
    margin-top:8px;
    border:1px solid #ccc;
    border-radius:2px;
}

.claculator_main_body>li{
    display:none;
}

.claculator_main_body_top{
    margin-left:9px; margin-right:9px;
    border-bottom:dashed #ddd 1px;
}

.claculator_dl>dt{
    display:inline-block;
    width:135px;
    margin-right:15px;
    text-align:right;
    font-size:14px; color:#666;
}
.claculator_dl>dd{
    display:inline-block;
}
input.claculator_input{
    width:178px; height:28px;
    line-height:28px;
    border:1px solid #ddd;
    border-radius:2px;
    text-align:center;
    font-size:14px;
}



.claculator_title{
    line-height:55px;
    text-align:center;
    font-size:18px; color:#437fd6;
}

.claculator_ul{
    background:#eeeeee;
    font-size:14px; color:#666;
    text-align:center;
}

.claculator_ul>li{
    display:inline-block;
    width:159px;
    height:42px; line-height:42px;
    text-align:center;
}

.claculator_content{
    margin-left:50px;
    margin-right:50px;
    margin-top:25px;
    margin-bottom:10px;
    line-height:25px;
    text-align:center;
    font-size:14px; color:#666;
}

.claculator_table{
    border-spacing:0;
    border-top:1px solid #ddd;
}
.claculator_table tr{
    display:block;
}
.claculator_table td{
    width:195px;
    height:42px;
    line-height:42px;
    text-align:center;
    border-right:1px solid #ddd;
    border-bottom:1px solid #ddd;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
}

.claculator_select{
    color:#666; font-size:14px;
}
.claculator_select>li{
    display:inline-block;
    width:240px;
    height:32px;
    line-height:32px;
    border-bottom:1px solid #ddd; 
    text-align:center;
    cursor:pointer;
}
.claculator_select>li.on{
    background:#437fd6;
    border-color:#437fd6;
    color:#fff;
}
.claculator_select2>input[type="button"]{
    width:58px;
    height:28px;
    line-height:28px;
    text-align:center;
    border:1px solid #ddd;
    border-radius:2px;
    margin-right:8px;
    margin-bottom:10px;
    background:#fff;
}
.claculator_select2>input[type="button"].on{
    color:#fff;
    background:#437fd6;
}

.claculator_select_body>li{
    display:none;
}
.claculator_select2{
    width:264px;
    vertical-align:text-top;
}

@media(max-width:499px){
    .claculator_main{
        width:100%;
    }

    .claculator_main_head>li{
        width:25%;
        height:8vw;
        line-height:8vw;
        font-size:2.8vw;
    }
    .claculator_dl>dt{
        width:27vw;
        margin-right:3vw;
        font-size:2.8vw;
    }
    .top_M31{
        margin-top:6.2vw;
    }
    .top_M18{
        margin-top:3.6vw;
    }
    .bottom_M31{
        margin-bottom:6.2vw;
    }
    input.claculator_input{
        width:50vw !important;
        height:8vw;
        line-height:8vw;
        font-size:2.8vw;
    }

    .claculator_title{
        height:11vw;
        line-height:11vw;
        font-size:3.6vw;
    }
    .claculator_ul>li{
        width:31vw;
        height:8.4vw;
        line-height:8.4vw;
    }
    .claculator_ul{
        font-size:2.8vw;
    }
    .claculator_content{
        margin-left:10vw;
        margin-right:10vw;
        font-size:3.8vw;
    }
    .claculator_table td{
        width:38vw;
        height:8.4vw;
        line-height:8.4vw;
        font-size:2.8vw;
    }
    .claculator_select>li{
        width:50%;
        height:6.4vw;
        line-height:6.4vw;
        font-size:2.8vw;
    }
    .claculator_select2{
        width:55vw;
    }
    .claculator_select2>input[type="button"]{
        width:11.6vw;
        height:5.6vw;
        line-height:5.6vw;
        font-size:2.8vw;
        margin-right:1.6vw;
        margin-bottom:2vw;
    }
}