/*
    尽量按原子性->模块化->页面的方式组合搭配
*/


:root {
    --main-color: coral; /* 定义变量 */
}
.dx_captcha {z-index: 999999999999;}
.login-after, .after-login {display: none;}
body.hidden {overflow: hidden;}
* {margin: 0;padding: 0;-moz-box-sizing: border-box;-webkit-box-sizing: border-box;	box-sizing: border-box;}
img { border:none;}
li { list-style:none;}
a {text-decoration:none;transition: all 0.3s;color:--main-color;}
a:hover {opacity: 0.7;}
/* a:hover {opacity:0.7;filter:alpha(opacity=70);} */

/* 表格样式统一 */
table, td, th {border-collapse: collapse;}

div::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}

div::-webkit-scrollbar-track {
    background: rgba(0, 0, 0, 0.1);
    border-radius: 4px;
}

div::-webkit-scrollbar-thumb {
    background: rgba(0, 0, 0, 0.2);
    border-radius: 4px;
}

div::-webkit-scrollbar-thumb:hover {
    background: rgba(0, 0, 0, 0.3);
}

div::-webkit-scrollbar-corner {
    background: transparent;
}

.mod-dialog-close1 {transition: all 1s;}
.mod-dialog-close1:hover {transform: rotate(360deg);}
.mod-dialog-main1 {overflow: hidden;}

#video-dialog .mod-dialog-main, #image-dialog .mod-dialog-main,#image-dialog .mod-dialog-main  {width: auto;height: auto;background: none;}
#image-dialog .mod-dialog-main {width:80%;}
#image-dialog .mod-dialog-main img {width: 100%;}

.text-danger {color:#fe6816!important}
.app-loading-items{justify-content: center;align-items: center;display:flex;}.app-loading{overflow:hidden;position:fixed;top:0;left:0;width:100%;background-color:rgba(0,0,0,0.6);height:0;transition: all 0.3s;}.app-loading-items span{display: inline-block;width: 15px; height: 15px;margin-right: 5px;border-radius: 50%;background: #fff;-webkit-animation: load 1.04s ease infinite;}.app-loading-items span:last-child{margin-right: 0px; } @-webkit-keyframes load{0%{opacity: 1;}100%{opacity: 0;}}.app-loading-items span:nth-child(1){-webkit-animation-delay:0.13s;}.app-loading-items span:nth-child(2){-webkit-animation-delay:0.26s;}.app-loading-items span:nth-child(3){ -webkit-animation-delay:0.39s;}.app-loading-items span:nth-child(4){-webkit-animation-delay:0.52s;}.app-loading-items span:nth-child(5){-webkit-animation-delay:0.65s;}
.app-loading {
    position: fixed;right:0;top:0;left:0;bottom:0;z-index: 9;background-color: rgba(0,0,0,0.5);
    justify-content: center;
    overflow: hidden;
    align-items: center;
    
    
}
.app-loading-items {margin:16px 0;}
.app-loading-msg {text-align: center;}

.app {
    min-height: 100vh;
}
.home {
    position: relative;
    height:100%;
}
.home-pc-bg, .home-mobile-bg {position: absolute;width:100%;top:0;bottom:0;}
.home-main {position:relative;z-index:1}


/* swiper 样式重置 */
.swiper-container {height:100%;}
/* swiper 样式重置 */


/* mod-anchor */
.mod-anchor {
    position: fixed;
    right:8px;
    top:50vh;
    transform: translateY(-50%);
    z-index:1
}
.mod-anchor .mod-anchor-btn {
    cursor: pointer;
}

.mod-anchor .mod-anchor-btn a {
    color: #333;
    text-decoration: none;
}
.mod-anchor-btn.active a {color:blue}

/* 按钮模块 */
.mod-menu-btn {display: inline-block;cursor: pointer;}
.mod-menu-btn>img:nth-child(2){display: none;}
.mod-menu-btn:hover img:nth-child(1), .mod-menu-btn.active>img:nth-child(1){
    display: none;
}
.mod-menu-btn:hover>img:nth-child(2), .mod-menu-btn.active>img:nth-child(2){
    display: block;
}
/* 按钮模块 */


/*满屏一屏显示*/
.full-section {
    position: relative;
    height: 100vh;
}

/*在屏幕中居中显示*/
.pos-center-middle {
    position: absolute;
    left:50%;top:50vh;
    transform: translate(-50%, -50%);
    
}
.fixed-center-middle {
    position: fixed;
    left:50%;top:50vh;
    transform: translate(-50%, -50%);
}


/*类似于背景层的效果，不影响上层内容的布局，虽然是绝对定位，也不会遮挡正常文档流的内容*/
.mod-background {position: absolute;z-index:-1;left:0;right:0;bottom:0;top:0;}


/* 引导页样式 */
.home {position: relative;}
.home.active {display: none;}
.home-bg {position: absolute;left:0;top:0;right:0;bottom:0;}
.home-header {display: flex;gap: 16px}
.home-header .left{flex:0 0 auto;}
.home-header .center{flex:1 0 auto}
.home-header .right{flex:0 0 auto}

.page {}
.page.active {display: block;}
.page-header {display: flex;gap: 16px;}
.page-header .left {flex: 0 0 auto;}
.page-header .center{flex:1 0 auto}
.page-header .right{flex:0 0 auto}
.page-main{

}



button, input, optgroup, select, textarea {
    color: inherit;
    font: inherit;
    margin: 0;
}
button, input, select, textarea {
    font-family: inherit;
    font-size: inherit;
    line-height: inherit;
}

.input-group .form-control {
    position: relative;
    z-index: 2;
    float: left;
    width: 100%;
    margin-bottom: 0;
}

.input-group-sm>.form-control, .input-group-sm>.input-group-addon, .input-group-sm>.input-group-btn>.btn {
    height: 30px;
    padding: 5px 10px;
    font-size: 12px;
    line-height: 1.5;
    border-radius: 3px;
}

.input-group .form-control, .input-group-addon, .input-group-btn {
    display: table-cell;
}

.input-group .form-control:last-child, .input-group-addon:last-child, .input-group-btn:first-child>.btn-group:not(:first-child)>.btn, .input-group-btn:first-child>.btn:not(:first-child), .input-group-btn:last-child>.btn, .input-group-btn:last-child>.btn-group>.btn, .input-group-btn:last-child>.dropdown-toggle {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
}
.form-group {
    margin-bottom: 15px;
}
.form-group::after{content:' ';display: block;clear: both;}
.form-inline-control {display: inline-block!important;width:auto}
.form-control {
    display: block;
    width: 100%;
    height: 34px;
    padding: 6px 12px;
    font-size: 14px;
    line-height: 1.42857143;
    color: #555;
    background-color: #fff;
    background-image: none;
    border: 1px solid #ccc;
    border-radius: 4px;
    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
    -webkit-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
    -o-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
    -webkit-transition: border-color ease-in-out .15s, -webkit-box-shadow ease-in-out .15s;
    transition: border-color ease-in-out .15s, -webkit-box-shadow ease-in-out .15s;
    transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
    transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s, -webkit-box-shadow ease-in-out .15s;
    outline: none;
}
.form_message.error {color:red;}
.form_message {z-index:10;}


/*  弹框 start 

<div class="mod-dialog">
    <div class="mod-dialog-mask"></div>
    <div class="mod-dialog-main artical"></div>
</div>

*/
.h24 {height:24px;}
.mod-dialog {
    visibility:hidden;
    position: fixed;
    z-index:9;
    opacity: 0;
    left:0;top:0;right:0;bottom:0;
    transition: all 0.3s;
}

.mod-dialog .mod-dialog-main{
    margin-top: 60px;
    transition: all 0.2s;
}


.mod-dialog.active {visibility:visible;opacity: 1;margin-top:0px;}
.mod-dialog.active .mod-dialog-main{margin-top:0}
.mod-dialog-mask {
    position: absolute;
    left:0;right:0;top:0;bottom:0;
    background-color: rgba(0,0,0,0.85);
    z-index:0;
}

.mod-dialog-main {
    position: absolute;
    left:50%;top:50vh;
    transform: translate(-50%, -50%);
    width:500px;
    background-color: #fff;
    height: 200px;
    border-radius: 5px;
}

.mod-dialog-main:before{
    position: absolute;z-index:-1;
    height:50px;
    min-width:20px;
    content: ' ';
    display: block;
    top:-25px;
}
.mod-dialog-main:after{
    position: absolute;z-index:-1;
    content: ' ';
    display: block;
    height:50px;
    min-width:20px;
    bottom:-25px;
}
.mod-dialog-close {
    position: absolute;
    cursor: pointer;
    top:0;right:0;min-width:10px;min-height:10px;
}
/*  弹框 end */


/* tabs */
.mod-tabs{}
.mod-tabs-btn {display: inline-block;cursor: pointer;}
.mod-tabs-btn>img:nth-child(2){display: none;}
/* .mod-tabs-btn:hover img:nth-child(1), .mod-tabs-btn.active>img:nth-child(1){
    display: none;
}
.mod-tabs-btn:hover img:nth-child(2), .mod-tabs-btn.active>img:nth-child(2){
    display: none;
} */
.mod-tabs-item{display: none;}
.mod-tabs-item.active {display: block;}
/* tabs */


/* mod-menu */
.mod-menu
.mod-menu .mod-menu-item {}
.mod-menu .mod-menu-item > span {display: block;cursor: pointer;}
.mod-menu-sub {}
.mod-menu .mod-menu-item > .mod-menu-sub {height:0;overflow: hidden;}
.mod-menu .mod-menu-item.active {background-color: rgba(0,0,0,0.3);}
.mod-menu .mod-menu-item.open .mod-menu-sub {height:auto;}
.mod-menu-sub {margin-left:16px;transition: all 2s;}

/* 返回顶部按钮 */
.mod-toTop {
    position: fixed;
    width:80px;
    height:80px;
    cursor: pointer;
    right:50px;bottom:50px;
    overflow: hidden;
}
.mod-toTop>img:nth-child(2){display: none;}
.mod-toTop:hover>img:nth-child(1){display: none;}
.mod-toTop:hover>img:nth-child(2){display: block;}

/* 大段文字或者图文的段落样式 */
.artical {
    max-width: 100%;
    font-size: 18px;
    line-height: 1.5;
}

.artical .artical-tit {text-align: center;}
.artical .artical-tit img {width:auto;display: block;}
.artical img{max-width: 100%;margin:0 auto;}
.artical .artical-main p {margin-bottom: 16px;}


.app-loading {
    position: fixed;width:100%;height:100%!important;
    pointer-events: none;
    background: none;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    display: none;

}
.app-loading.active {display: flex;}
.app-loading-items span {background-color: rgba(0,0,0,0.4);}


.confirm-dialog .mod-dialog-main {
    width: 300px;
    height: auto;
}
.confirm-dialog-title {
    font-size: 20px;
    padding: 8px 16px;
    color:#999;
}
.confirm-dialog-btn {
    text-align: right;
    padding:8px 16px;
}

.confirm-dialog-btn .btn {
    margin-left: 8px;
}
.confirm-dialog-desc {
    text-align: center;
    padding: 8px;
}



/*大屏样式*/
@media screen and (min-width: 768px) {

    .pc {display: block!important;}
    .mobile {display: none!important;}
    img {width: auto;display: block;}

    .home {}
    .page{}
}

/*小屏样式*/
@media screen and (max-width: 768px) {
    .pc {display: none!important;}
    .mobile {display: block!important;}
    .mod-dialog table {width: 100% !important;}
 

    .mod-dialog-main {
        max-width: 98%;
    }

    .home{}
    .page {}
    
}