﻿body {
    background: url(../images/bg_inner.png) repeat-y;
    background-size:100%;
    font-size:14px;
}

.header {
    background: url(../images/header_inner.png) no-repeat;
    height: 120px;
    background-size: 100% 100% ;
    position:relative;
}

.header-mdl-title {
    height: 40px;
    line-height: 40px;
    padding-left: 10px;
    color: #434242;
    background-color: #ffffff;
    position:absolute;
    bottom:0px;
    left:0px;
    width:100%;
    font-size:18px; 
}


.header-title {
    height: 48px;
    line-height: 48px;
    padding-left: 10px;
    color: #434242;
    background-color: #ffffff;
    position: fixed;
    top:0px;
    left:0px;
    width:100%;
    z-index:2000;
    box-shadow:2px 0px 10px rgba(0,0,0,0.3);
}

.header-logo {
    padding:2px 30px;
    background-image: url(../images/logo.png);
    background-repeat: no-repeat;
    background-position: left center;
    background-size: 25px 25px;
    color: #434242;
    font-size: 1.2rem;
    width: 90%;
    height:25px;
    line-height:25px;
}

.header-home {
    position: absolute;
    top: 10px;
    right: 10px;
    width: 30px;
    height: 30px;
}

.text-lg{
    font-size:1.8rem;
}

.el-head {
    /*background-color: rgba(0,0,0,0.5);   
    background-color: rgba(22,143,209,0.3);
    padding: 30px 20px;*/
    color: #ffffff;
    padding: 0px 20px;
    height: 60px;
    margin: 0px;
    height:150px;
}

    .el-head h3 {
        /*letter-spacing: 0.2em;*/
        margin-left: -0.2em;
        padding-top: 20px;
        font-size:6vw;
        
    }

.card-info {
    margin-top: 10px;
    margin-left: 20px;
}
.el-head-nobg {
    background-color: #ffffff;
    color:#434242;
}

    .card-title {
        padding-left: 2px;
        color: #434242;
        font-size: 18px;
        font-weight: 800;
    }
.text-linear {
    color: transparent;
    background-image: linear-gradient(45deg, #61fbff 0%, #ff82e6 51%, #d800ff 100%);
    -webkit-background-clip: text;
    letter-spacing: 0.1em;
}

    .text-linear::before {
        content: attr(text);
        position: absolute;
        z-index: -1;
        text-shadow: 1px 0px 0px rgba(255,255,255,1);
    }

.text-linear-sub {
    font-size: 1rem;
    color: transparent;
    background-image: linear-gradient(-90deg, #ffffff, #c9a4e5);
    -webkit-background-clip: text;
}
/**文字显示块*/
.text-primary {
    color: #178fd1;
} 
.text-mid{
    font-size:1.4rem !important;
    font-weight:600; 
}
.area {
    background : rgba(255,255,255,0.3);
    font-size: 14px;
    line-height: 22.4px; 
    border-radius: 4px;
    box-shadow: 1px 0px 10px rgba(20,140,200,0.3);
    color:#fff;
}

.area-title {  
    text-align:left;
    font-size:24px;
    color:#fff;
    font-weight:500;
    margin:20px auto 15px;
    letter-spacing:0.1em; 
}

.options-list li {
    line-height: 1.45em;
    padding: 5px 0px;
}

.area-img {
    width: 100%;
    border: none;
    margin-top:10px;
}

.card-img {
    position: absolute;
    top: 15px;
    right: 15px;
    max-width: 29%;
    z-index: 2;
    height: 100px;
    animation: bubble-astronaut 2s 0.2s alternate infinite linear;
}

.area > p {
    text-indent: 1.8em;
    text-align: justify;
}

.img-filter {
    filter: drop-shadow(0px 2px 20px rgba(0,0,0,0.3));
}

.img-filter-b {
    filter: drop-shadow(0px 2px 20px rgba(255,255,255,0.3));
}

@-webkit-keyframes bubble-astronaut {
    0% {
        -webkit-transform: translateY(0px);
        transform: translateY(0px)
    }

    50% {
        -webkit-transform: translateY(-5px);
        transform: translateY(-5px)
    }

    100% {
        -webkit-transform: translateY(0px);
        transform: translateY(0px)
    }
}

@keyframes bubble-astronaut {
    0% {
        -webkit-transform: translateY(0px);
        transform: translateY(0px)
    }

    50% {
        -webkit-transform: translateY(-5px);
        transform: translateY(-5px)
    }

    100% {
        -webkit-transform: translateY(0px);
        transform: translateY(0px)
    }
}


.foot {
    /*background-color: #012c5f;*/
    background-color: #061a5b;
    padding: 0px;
    line-height: 1.4em;
}

.foot_company {
    color: #dee4ea;
    font-family: SimHei;
    padding: 10px 20px;
    border-bottom: 1px solid #66809e;
    font-size:16px;
}

.foot_title {
    color: #66809e;
    margin-bottom: 10px;
    font-size: 14px;
    font-weight: 500;
}

.foot_info {
    color: #66809e;
    text-align: left;
    font-size: 12px;
}