@import './din-font.css';
/* loading 动画 start */
.aufine-loading{
    position: fixed;
    top:0em;
    left:0em;
    width:100%;
    height:100vh;
    background: #fafafa;
    z-index:10000;
}
.aufine-loading>img{
    width:1.875em;
    height:1.875em;
    position: absolute;
    top:50%;
    margin-top:-1em;
    left:50%;
    margin-left:-1em;
    opacity: 0.7;
    animation: loading 2s infinite;
}
.aufine-loading.black>.load-tiny{
    background: #0B4891;
}
.aufine-loading>.load-tiny{
    position: absolute;
    top:50%;
    left:50%;
    width:0.5em;
    height:0.5em;
    margin-top:0.32em;
    background: #fafafa;
    border-radius: 50%;
    opacity: 0;
    transition: all .3s;
}
.aufine-loading>.load-tiny:first-child{
    margin-left:-1.875em;
    animation: loading-tiny 2s infinite;
    animation-delay: 0.2s;
}
.aufine-loading>.load-tiny:nth-child(2){
    margin-left:-0.625em;
    animation: loading-tiny 2s infinite;
    animation-delay: 0.5s;
}
.aufine-loading>.load-tiny:nth-child(3){
    margin-left:0.625em;
    animation: loading-tiny 2s infinite;
    animation-delay: 0.8s;
}
.aufine-table-box{
    width:100%;
    overflow-x:auto;
}
 .aufine-table{
    margin:0px;
}
.aufine-table thead th{
    vertical-align: middle;
    font-size: 0.875em;
    padding:5px;
    text-align: center;
}
.aufine-table td{
    padding:0.35em;
    text-align: center;
}
.btn:focus{
    box-shadow: none;
}
.form-control:focus{
    box-shadow: none !important;
    border:1px solid #0B4891 !important;
}
/* .aufine-table td,.aufine-table th{
    border-bottom:1px solid #eee;
    padding:0.3em 0.8em;
}
.aufine-table td{
    color:#666;
    font-size: 0.75em;
    line-height: 2.4em;
}
.aufine-table>tbody>tr:nth-child(even){
    background: #eee;
}
.aufine-table th{
    color:#0B4891;
    font-weight: bold;
    font-size: 0.875em;
} */
@keyframes loading{
    0%{
        opacity: 0;
        transform: rotate(0deg);
        margin-left:-3.75em;
    }
    40%{
        opacity: 0.7;
    }
    80%{
        opacity: 0.7;
    }
    100%{
        opacity: 0;
        transform: rotate(360deg);
        margin-left:1.56em;
    }
}
@keyframes loading-tiny{
    0%{
        opacity: 0;
        transform: scale(0);
        margin-top:0.32em;
    }
    50%{
        opacity: 0.6;
        transform: scale(1);
    }
    100%{
        opacity: 0;
        transform: scale(0.2);
        margin-top:-0.5em;
    }
}
/* loading 动画 end */
body{
    background: #fff;
    font-family: 'Din';
    font-size: 18px;
}
.row{
    margin:0px;
}
.form-group{
    margin-bottom:1rem;
}
.btn-primary{
    background: #0B4891;
    border:none;
}
#main-container{
    display: none;
}
/* header style */
.aufine-header{
    width:100%;
    height:5em;
    background: transparent;
    position: fixed;
    top:0em;
    left:0em;
    display: flex;
    justify-content: flex-start;
    flex-wrap: wrap;
    transition: all .3s;
    z-index:1000;
    margin:0em;
}
.aufine-header.noBanner{
    background: #fff;
}
.aufine-header.noBanner .aufine-nav-link{
    color:#0B4891;
}
.aufine-header.noBanner .login-bar-item{
    color:#666;
}
.header-slide-box{
    position: absolute;
    top:0em;
    left:0em;
    height:22em;
    width:100%;
    background: #fff;
    transition: all 0.3s;
    overflow: hidden;
    transform: translateY(-22em);
}
.header-slide-box.active{
    transform: translateY(-17em);
}
.header-slide-box.nav-active{
    transform: translateY(0em);
    /* box-shadow: 0px 2px 3px 1px rgba(0,0,0,.1); */
}
.aufine-header:hover .aufine-nav-acbar{
    opacity: 1;
}
.aufine-header:hover .aufine-nav-link{
    color:#0B4891;
}
.aufine-header.light{
    background: #fff;
    box-shadow: 0px 20px 50px 0px rgba(0,0,0,.1);
}
.aufine-header.light .aufine-nav-link{
    color:#0B4891;
}
.aufine-header.light .login-bar-item{
    color:#666;
}
.logo-box{
    width:18.25em;
    height:100%;
    padding:0em 1.5em;
    padding-right:5em;
    position: relative;
    text-align: center;
    line-height: 4.7em;
    min-width: 9.375em;
    position: relative;
    z-index:1000;
}
.logo-box>a>img{
    width:100%;
}
.nav-tools{
    position: absolute;
    top:0px;
    right:0px;
    /* position: relative; */
    width:21.25em;
    height:100%;
    box-sizing: border-box;
    padding:0.625em;
    z-index: 2000;
}
.search-bar{
    width:100%;
    line-height: 1.5625em;
    height:1.9375em;
    padding:0.2em;
    background: #0B4891;
    display: flex;
    justify-content: space-between;
    border-radius: 0.1875em;
}
.login-bar{
    width:100%;
    line-height: 1.875em;
    height:1.9375em;
    display: flex;
    justify-content: flex-end;
    margin-top:0.1875em;
}
.login-bar-item{
    font-size: 0.75em;
    line-height: 2em;
    color:#fff;
    cursor: pointer;
    padding:0.1875em 0em;
}
.login-bar-item:hover{
    opacity: 0.6;
}
.aufine-header:hover .login-bar-item{
    color:#666;
}
.login-bar-item>i{
    padding:0px 0.3125em;
}
.select-lang-box{
    margin-left:1.25em;
    height:1.875em;
    position: relative;
}
.select-lang{
    background: #fff;
    border:1px solid #eee;
    line-height: 2em;
    width:100%;
    display: block;
    padding:0px 0.6em;
    padding-right:0px;
    margin:0.1875em 0em;
    text-align: center;
    cursor: pointer;
    font-size:0.75em;
    color:#0B4891;
    text-align: left;
    border-radius: 0.1875em;
    font-weight: bold;
}
.select-lang>i{
    float: right;
    line-height: 2em;
    color:#0B4891;
    padding:0em 0.6em;
}
.select-lang:hover{
    opacity: 0.6;
}
.select-lang-list{
    position: absolute;
    left:0em;
    top:2em;
    width:100%;
    padding:0.3125em 0em;
    background: #fff;
    border:1px solid #eee;
    border-radius: 0.1875em;
    margin:0em;
    z-index:3000;
}
.select-lang-list.hide{
    display: none;
}
.select-lang-list>li{
    padding:0.125em 0.3125em;
    font-size: 0.75em;
    line-height: 1.6em;
    cursor: pointer;
}
.select-lang-list>li:hover{
    opacity: 0.6;
}
.search-bar-media{
    padding:0px 0.1875em;
    padding-right:0.3125em;
    height:1.5625em;
    vertical-align: middle;
    display: flex;
    justify-content: flex-start;
}
.search-bar-media i{
    line-height: 1.5625em;
    width:1.75em;
    vertical-align: middle;
    font-size: 1em;
    text-align: center;
    color:#fff;
    cursor: pointer;
    margin-top:-0.25em;
}
.search-bar-media i:hover{
    opacity: 0.6;
}
.search-bar>.input-group{
    width:9.875em;
    display: flex;
    justify-content: flex-end;
    position: relative;
}
.search-res{
    position: absolute;
    width:10rem;
    top:2rem;
    right:0rem;
    background: #fff;
    border:1px solid #fafafa;
    overflow: hidden;
    max-height: 10em;
    z-index:1000;
    border-radius: 4px;
    box-shadow: 0px 3px 5px 0px rgba(0,0,0,.2);
    overflow-y:auto;
}
.search-res>li{
    color:#666;
    line-height: 1.75rem;
    font-size: 0.75rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    padding:0em 0.5em;
    cursor: pointer;
}
.search-res>.search-term{
    text-align: center;
    color:#aaa;
}
.search-res>li>a{
    color:#666;
    display: block;
    width:100%;
}
.search-res>li:not(.search-term):hover{
    background: #eee;
    color:#0B4891;
}
.search-bar>.input-group>input{
    width:8.25em;;
    height:100%;
    line-height: 2em;
    border:none;
    font-size: 0.75em;
    padding:0em 0.625em;
    box-sizing: border-box;
    color:#666;
    border-top-left-radius: 0.1875em;
    border-bottom-left-radius: 0.1875em;
}
.search-bar .input-group-append>button{
    padding:0em 0.625em;
    line-height: 2em;
    height:100%;
    border-radius: 0px;
    border-top-right-radius: 0.1875em;
    border-bottom-right-radius: 0.1875em;
    background: #fff;
}
.search-bar>.input-group>input:focus{
    outline: none;
}
.aufine-nav{
    width:calc(100% - 43em);
    margin:0px;
    height:100%;
    line-height: 100%;
    padding:0px 0.625em;
    display: flex;
    justify-content: flex-start;
    position: relative;
    z-index:1000;
}
.aufine-nav-item{
    height:100%;
    padding:0px 20px;
    vertical-align: middle;
    display: flex;
    align-items: flex-end;
    position: relative;
    font-size: 1em;
    margin:0px 0.8em;
}
.aufine-nav-link{
    line-height:4.4em;
    text-decoration: none !important;
    color:#fff;
    transition: all .3s;
    font-weight: bolder;
    white-space: nowrap;
}
.aufine-nav-acbar{
    opacity: 0;
    position: absolute;
    z-index: 2000;
    bottom:0em;
    left:0em;
    width:0em;
    height:0.12em;
    background: #0B4891;
    transition: all .3s;
}
.aufine-nav-detail{
    width:100%;
    height:100%;
    padding-top:5em;
    position: relative;
    margin:0em;
    display:none;
}
.header-slide-box.nav-active>.aufine-nav-detail{
    display: block;
}
.aufine-nav-detail>li{
    position: absolute;
    top:5em;
    width:100%;
    height:calc(100% - 5em);
    box-sizing: border-box;
    padding:0em;
    display: flex;
    justify-content: flex-start;
    border-top:1px solid #eee;
}
.nav-detail-describe{
    height:100%;
    font-size: 0.875em;
    color:#999;
    padding:3em;
    border-right:1px solid #eee;
    overflow-y:auto;
}
.nav-detail-links{
    height:100%;
    padding:2em 3em;
    overflow-y:auto;
}
.nav-detail-link>a{
    line-height: 2em;
    font-size: 1em;
    color:#0B4891;
}
.aufine-nav-button{
    display: none;
    font-size: 1.5em;
    position: absolute;
    top:0.9em;
    right:1.2em;
    z-index:3000;
    color:#666;
    cursor: pointer;
}
.page-banners{
    width:100%;
    height:100vh;
    padding-top:5em;
    overflow: hidden;
    position: relative;
}
.page-banners>.back-box{
    position: absolute;
    top:0px;
    left:0px;
    width:100%;
    height:100%;
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index:-1;
}
.page-banners>.back-box>img{
    height:100%;
}
/* footer style */
.aufine-footer{
    width:100%;
    min-height: 6.25em;
    background: #fff;
    padding-top:2em;
}
.aufine-subcribe{
    width:calc(100% - 10em);
    background:#eee;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding:2.56em;
    line-height: 9.375em;
    margin:auto;
    max-width: 100em;
}
.subcribe-us{
    line-height: 2em;
    vertical-align: middle;
    color:#0B4891;
}
.subcribe-us>input{
    width:15em;
    height:2.5em;
    margin:3.44em 0em;
    /* float: right; */
}
.subcribe-us .input-group-append button{
    height:2.5em;
    margin:3.44em 0em;
    background: #0B4891;
    border:1px solid #0B4891;
}
.aufine-footer-info{
    padding:1.875em 4em;
    width:100%;
    display: flex;
    justify-content: space-between;
    line-height: 3.75em;
    /* max-width: 108em; */
    margin:auto;
    padding-bottom:6em;
    background: #fafafa;
    margin-top:2.5rem;
}
.aufine-footer-left p{
    -webkit-user-select: text;
    -ms-user-select: text;
    user-select: text;
}
.aufine-footer-left>img{
    width:100%;
    max-width: 18.75em;
    display: block;
    padding:1.875em 0px;
}
.aufine-footer-right{
    position: relative;
    min-height: 9.375em;
}
.aufine-footer-right-item{
    position: absolute;
    right:0.9375em;
    line-height: 2em;
}
.aufine-footer-right-item:last-child i{
    margin-right:0.3125em;
}
.aufine-footer-right-item:first-child>a{
    font-size: 1.5em;
    color:#666;
    text-decoration: none;
    display: inline-block;
    margin-left:1.25em;
    text-align: center;
}
.aufine-footer-right-item:last-child>a{
    font-size: 0.75em;
    color:#0B4891;
    text-decoration: none;
    display: inline-block;
    margin-left:1.25em;
    font-weight: bold;
}
.footer-info-row{
    font-size: 0.875em;
    line-height: 2em;
    margin: 0px;
    padding:0px;
    color:#0B4891;
}
.footer-info-row>span{
    font-weight: bold;
}
.footer-info-copyright{
    font-size: 0.875em;
    line-height: 2em;
    margin: 0px;
    padding:0px;
    color:#999;
}
.footer-info-copyright a{
    color:#999;
}
/* search bar style */
.aufine-search-bar{
    position: fixed;
    top:9.375em;
    right:0px;
    z-index: 500;
}
.search-hover-field{
    position: absolute;
    top:-1em;
    right:0em;
    width:3em;
    height:10em;
}
.search-bar-btn{
    display: block;
    width: 9rem;
    height:2rem;
    line-height: 2rem;
    font-weight: bold;
    color:#fff;
    text-align: center;
    border-bottom-right-radius: 0.3125em;
    border-bottom-left-radius: 0.3125em;
    background: #0B4891;
    /* border:1px solid #eee; */
    border-right:none;
    transition: all .3s;
    cursor: pointer;
    position: relative;
    top:3.6rem;
    right:-3.6rem;
    z-index: 10;
    transform: rotate(90deg);
    box-shadow: 0px 0px 2px 1px rgba(0,0,0,.15);
}
.search-bar-btn>i.tire-selector{
    /* display: block;
    position: absolute;
    
    width:10em;
    height:2em;
    top:3.5em;
    left:-4em;
    font-size: 0.75rem;
    color:#fff;
    text-align: center;
    font-style:normal;
    font-weight: bold; */
}
.search-bar-btn:hover{
    background: #0B4891;
}
.search-bar-list{
    position: absolute;
    top:-0.3125em;
    right:0px;
    width:13.5em;
    background: #fff;
    margin:0px;
    z-index: 5;
    border-top-left-radius: 0.3125em;
    border-bottom-left-radius: 0.3125em;
    border:1px solid #eee;
    border-right:none;
    padding:0.3125em;
    padding-right:1.8em;
}
.search-bar-item{
    position: relative;
}
.search-bar-item>p{
    width:100%;
    font-size: 0.875em;
    margin:0px;
    padding:0px;
    line-height: 2.4em;
    padding:0px 0.1875em;
    color:#666;
}
.search-bar-item>.search-bat-select{
    display: block;
    width:calc(100% - 0.625em);
    line-height: 2em;
    font-size: 0.875em;
    padding:0px 0.1875em;
    border:1px solid #eee;
    background: #eee;
    border-radius: 0.3125em;
    color:#666;
    cursor: pointer;
}
.search-bar-item>.search-bat-select>i{
    float: right;
    margin-top:0.5em;
    margin-right:0.2em;
}
.search-bar-item-btn{
    display: block;
    width: 2em;
    height:2em;
    border-top-left-radius: 0.3125em;
    border-bottom-left-radius: 0.3125em;
    background: #0B4891;
    border:1px solid #eee;
    border-right:none;
    transition: all .3s;
    cursor: pointer;
    position: absolute;
    bottom: 0.25em;
    right:0px;
    z-index: 10;
    text-align: center;
    color:#fff;
}
.select-search-list{
    position: absolute;
    left:0px;
    top:4.1em;
    width:calc(100% - 0.5em);
    padding:0.3125em 0px;
    background: #fff;
    border:1px solid #eee;
    border-radius: 0.1875em;
    margin:0px;
    z-index:3000;
}
.select-search-list>ul{
    width:100%;
    max-height:168px;
    overflow-y: auto;
    padding-bottom:8px;
}
.confirm-box{
    width:100%;
    line-height: 28px;
    cursor: pointer;
    font-size: 14px;
    padding:0px 10px; 
    text-align: center;
    color:#0B4891;
    box-shadow: 0px -3px 5px 0px rgba(0,0,0,.1);
}
.select-search-list.hide{
    display: none;
}
.select-search-item{
    padding:0.125em 0.3125em;
    font-size: 0.75em;
    position: relative;
    cursor: pointer;
}
.select-search-item:hover{
    opacity: 0.6;
}
.select-search-item>i{
    float: right;
    line-height: 1.15rem;
}
/* back-top */
.back-top{
    position: fixed;
    bottom:0em;
    left:50%;
    margin-left:-1.5em;
    width:3em;
    height:3em;
    background: #fff;
    color:#666;
    box-shadow: 0px -3px 10px 0px rgba(0,0,0,.2);
    border-top-left-radius: 50%;
    border-top-right-radius: 50%;
    line-height: 2.8em;
    text-align: center;
    font-size:0.75em;
    z-index:4000;
    cursor: pointer;
    transition: all .5s;
}
.slide-in{
    opacity:0;
    transition: all 1s;
    transform:translateY(5em);
    position: relative;
}
.slide-left{
    opacity:0;
    transition: all 0.5s;
}
.slide-right{
    opacity:1;
    transition: all 0.5s;
}
.slide-out{
    opacity:1;
    transform:translateY(0em);
}
.bread-box{
    width:100%;
    padding:0.8em;
    border-bottom:1px solid #f8f8f8;
    padding-top:5.8em;
    display: flex;
    justify-content: flex-start;
}
.bread-box.fixed-bread{
    position: absolute;
    top:0px;
    left:0px;
    border:none;
    z-index:100;
}
.bread-box>a{
    font-size: 0.75em;
    color:#fff;
    line-height: 2em;
    display: inline-block;
    padding:0em 1em;
    padding-left:1.5em;
    position: relative;
    transition: all .3s;
}
.bread-box>a:hover{
    color:#eee;
}
.bread-box>a::after{
    content:'';
    display:block;
    width:0;
    height:0;
    border-width:1em 0 1em 1em;
    border-style:solid;
    position:absolute;
    top:0px;
    right:-1em;
}
.bread-box>a.home-bread::after{
    border-color:transparent transparent transparent #aaa;
}
.bread-box>a.parent-bread::after{
    border-color:transparent transparent transparent #666;
}
.bread-box>a.page-bread::after{
    border-color:transparent transparent transparent #0B4891;
}
a.home-bread{
    background: #aaa;
    z-index:3;
}
a.parent-bread{
    background: #666;
    z-index:2;
}
a.page-bread{
    background: #0B4891;
    z-index:1;
}
/* pages */
.aufine-page-box{
    width:100%;
    line-height: 2em;
    padding:0.8em;
    text-align: center;
    display: flex;
    justify-content: center;
}
.aufine-page-box>a{
    user-select: none;
}
.aufine-page-box>a.page-btn{
    font-size: 0.875em;
    display: inline-block;
    color:#939495;
    cursor: pointer;
    padding:0em 0.6em;
}
.aufine-page-box>a.show-page{
    font-size: 0.875em;
    color:#939495;
    cursor: pointer;
    display: inline-block;
    border:1px solid #d5d5d5;
    width:1.8em;
    height:1.8em;
    line-height: 1.6em;
    border-radius: 3px;
    margin:0.2em;
}
.aufine-page-box>a.show-page.active{
    border:1px solid #0B4891;
    color:#fff;
    background: #0B4891;
}
.aufine-alert-box{
    position: fixed;
    top:1.2em;
    left:0;
    right:0;
    margin:0 auto;
    padding:1em 0.8em;
    color:#fff;
    background: #0B4891;
    z-index:20000;
    border-radius: 4px;
    box-shadow: 0px 0px 4px 2px rgba(0,0,0,.15);
    transition: all .3s;
    width:350px;
    transform: translateY(0em);
    text-align: center;
}
.aufine-alert-box.hide{
    transform: translateY(-5em);
}
.aufine-alert-box>i{
    display: inline-block;
    width:16px;
    height:16px;
    background: #fff;
    color: #0B4891;
    line-height: 16px;
    text-align: center;
    border-radius: 50%;
    margin-right:8px;
    font-size: 12px;
}
.media-wrap.embed-wrap{
    width:100%;
}
.media-wrap.embed-wrap>div{
    width:100%;
    display: flex;
    justify-content: center;
}
.media-wrap.embed-wrap iframe{
    width:600px;
    margin:auto;
}
/* .kf_qycn_com_cckf_icon{
    position: fixed;
}
.kf_qycn_com_cckf_direct_talking_dialog{
    position: fixed;
} */
/* 响应式 */
@media screen and (min-width:576px) and (max-width:1128px){
    .aufine-nav-item{
        height:100%;
        font-size: 0.875rem;
    }
    .logo-box{
        width:13rem;
        padding-right:0rem;
    }
}
@media screen and (max-width:576px){
    .search-res{
        top:inherit;
        bottom:-1rem;
        right:10rem;
        max-height: 9rem;
    }
    .nav-detail-describe{
        border:none;
        border-bottom:1px solid #eee;
        font-size: 1em;
        height:auto;
    }
    .nav-detail-links{
        height:auto;
    }
    .nav-detail-link>a{
        font-size: 1em;
    }
    .aufine-search-bar{
        top:5.5em;
    }
    .bread-box.fixed-bread{
        background:#fff;
    }
    .aufine-nav-item{
        margin:0px;
        height:100%;
        padding:0px 20px;
    }
    .aufine-nav-link{
        line-height:3em;
    }
}
@media screen and (max-width:960px){
    .aufine-nav-button{
        display: block;
    }
   .aufine-subcribe{
        width: 100%;
        background:#eee;
        display: flex;
        justify-content: space-between;
        padding:1.25em;
        line-height: 3.75em;
        margin:auto;
    }
    .subcribe-us>input{
        width:15em;
        height:2.5em;
        margin:0.625em 0px;
        /* float: right; */
    }
    .aufine-header{
        overflow: hidden;
        /* height:auto; */
    }
    .aufine-header.add-menu{
        height:auto;
        background: #fff;
    }
    .subcribe-us .input-group-append button{
        height:2.5em;
        margin:10px 0px;
    } 
    .nav-tools{
        width:100%;
        height:5em;
        background: #fff;
        position: relative;
    }
    .aufine-nav{
        width:100%;
        height:3em;
        background: #fff;
        justify-content: center;
    }
    .aufine-nav-acbar{
        top:7.6em;
    }
    .header-slide-box{
        position: relative;
        height:0px;
    }
    .header-slide-box.nav-active{
        height:calc(100vh - 30em);
        overflow-y:auto;
    }
    .aufine-header .aufine-nav-link{
        color:#0B4891;
    }
    .aufine-header .login-bar-item{
        color:#666;
    }
    .select-lang-list{
        top:inherit;
        bottom:1.875em;
    }
    .aufine-nav-detail{
        padding-top:0px;
    }
    .aufine-nav-detail>li{
        top:0px;
        border-top:none;
        height:auto;
    }
    .aufine-footer-info{
        padding:1em;
    }
}