@charset "utf-8";
/* CSS Document */

.gl_haibao_box {
    position: fixed;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    z-index: 99999;
    background: rgba(0,0,0,.85);
    color: #fff;
    transition: all .4s ease;
    -webkit-transition: all .4s ease;
    opacity: 0;
}
.gl_haibao_box_show {
    opacity: 1;
}
.gl_haibao_okimg {
    height: calc(100% - 60px);
    text-align: center;
}
.gl_haibao_okclose {
    position: absolute;
    width: 100%;
    left: 0;
    bottom: 0;
    height: 60px;
    text-align: center;
    overflow: hidden;
}
.gl_haibao_okclose a {
    position: absolute;
    left: 50%;
    margin-left: -20px;
    display: block;
    height: 60px;
    line-height: 40px;
    overflow: hidden;
}
.gl_haibao_okclose a img {
    width: 40px;
    height: 40px;
}
.loading_color {
    width: 200px;
    height: 80px;
    margin: 0 auto;
}
.loading_color1 {
    animation-delay: -1s;
    -webkit-animation-delay: -1s;
    -moz-animation-delay: -1s;
    -ms-animation-delay: -1s;
    -o-animation-delay: -1s;
}
.loading_color span {
    display: inline-block;
    width: 3px;
    height: 30px;
    animation-name: scale;
    -webkit-animation-name: scale;
    -moz-animation-name: scale;
    -ms-animation-name: scale;
    -o-animation-name: scale;
    animation-duration: 1.2s;
    -webkit-animation-duration: 1.2s;
    -moz-animation-duration: 1.2s;
    -ms-animation-duration: 1.2s;
    -o-animation-duration: 1.2s;
    animation-iteration-count: infinite;
    -webkit-animation-iteration-count: infinite;
    -moz-animation-iteration-count: infinite;
    -ms-animation-iteration-count: infinite;
    -o-animation-iteration-count: infinite;
}

.gl-gohaibao-show{
        background:#03a9f4;
        color:#fff;
        opacity:0.8;
        font-size: 0.32rem;
        width: 1.5rem;
        height: 1.5rem;
        border-radius: 1.5rem;
        text-align: center;
        line-height: 1.5rem;
        margin-bottom: 0.3rem;
    }
    .gl_haibao_okimg img {
        width: calc(100% - 50px);
        max-height: (100% - 50px);
        margin: 30px 25px 20px;
        border-radius: 6px;
    }
    @-webkit-keyframes scale{
        0%,40%,100%{-moz-transform:scaleY(.2);-ms-transform:scaleY(.2);-o-transform:scaleY(.2);-webkit-transform:scaleY(.2);transform:scaleY(.2)}
        20%,60%{-moz-transform:scaleY(1);-ms-transform:scaleY(1);-o-transform:scaleY(1);-webkit-transform:scaleY(1);transform:scaleY(1)}
    }
    @-moz-keyframes scale{
        0%,40%,100%{-moz-transform:scaleY(.2);-ms-transform:scaleY(.2);-o-transform:scaleY(.2);-webkit-transform:scaleY(.2);transform:scaleY(.2)}
        20%,60%{-moz-transform:scaleY(1);-ms-transform:scaleY(1);-o-transform:scaleY(1);-webkit-transform:scaleY(1);transform:scaleY(1)}
    }

    @-ms-keyframes scale{
        0%,40%,100%{-moz-transform:scaleY(.2);-ms-transform:scaleY(.2);-o-transform:scaleY(.2);-webkit-transform:scaleY(.2);transform:scaleY(.2)}
        20%,60%{-moz-transform:scaleY(1);-ms-transform:scaleY(1);-o-transform:scaleY(1);-webkit-transform:scaleY(1);transform:scaleY(1)}
    }
    @keyframes scale{
        0%,40%,100%{-moz-transform:scaleY(.2);-ms-transform:scaleY(.2);-o-transform:scaleY(.2);-webkit-transform:scaleY(.2);transform:scaleY(.2)}
        20%,60%{-moz-transform:scaleY(1);-ms-transform:scaleY(1);-o-transform:scaleY(1);-webkit-transform:scaleY(1);transform:scaleY(1)}
    }

.loading_color span.loading_color1{background:#2ecc71}
.loading_color span.loading_color2{background:#3498db}
.loading_color span.loading_color3{background:#9b59b6}
.loading_color span.loading_color4{background:#e67e22}
.loading_color span.loading_color5{background:#c0392b}
.loading_color span.loading_color6{background:#e74c3c}
.loading_color span.loading_color7{background:#e74c8c}
.loading_color1{animation-delay:-1s;-webkit-animation-delay:-1s;-moz-animation-delay:-1s;-ms-animation-delay:-1s;-o-animation-delay:-1s}
.loading_color2{animation-delay:-.9s;-webkit-animation-delay:-.9s;-moz-animation-delay:-.9s;-ms-animation-delay:-.9s;-o-animation-delay:-.9s}
.loading_color3{animation-delay:-.8s;-webkit-animation-delay:-.8s;-moz-animation-delay:-.8s;-ms-animation-delay:-.8s;-o-animation-delay:-.8s}
.loading_color4{animation-delay:-.7s;-webkit-animation-delay:-.7s;-moz-animation-delay:-.7s;-ms-animation-delay:-.7s;-o-animation-delay:-.7s}
.loading_color5{animation-delay:-.6s;-webkit-animation-delay:-.6s;-moz-animation-delay:-.6s;-ms-animation-delay:-.6s;-o-animation-delay:-.6s}
.loading_color6{animation-delay:-.5s;-webkit-animation-delay:-.5s;-moz-animation-delay:-.5s;-ms-animation-delay:-.5s;-o-animation-delay:-.5s}
.loading_color7{animation-delay:-.4s;-webkit-animation-delay:-.4s;-moz-animation-delay:-.4s;-ms-animation-delay:-.4s;-o-animation-delay:-.4s}

.gl_haibao_box_img {
        width: 100%;
        top: 0;
        overflow: hidden;
        background: #fff;
        position: fixed;
    }

    .gl_haibao_oktit {
        padding: 0.75rem 0.48rem 0;
        box-sizing: content-box;
        height: 60px;
        line-height: 30px;
        font-size: 15px;
        text-align: center;
        overflow: hidden;
    }

    .gl_haibao_foot_title {
        position: relative;
        display: block;
        width: 65%;
        padding-right: 0.25rem;
    }

    .gl_haibao_foot_titleh1 {
        color: #000;
        font-size: 0.8rem;
        line-height: 1.25rem;
    }

    .gl_haibao_foot_titlejg {
        color: #ff0000;
        font-size: 1.25rem;
        margin-top: 0.5rem;
    }

    /*.gl_haibao_foot_qrcode {
        float: right;
        padding: 0.25rem;
        background: url('https://m.ceramicschina.com/image/gl_haibao_qrbox.png');
        background-repeat: no-repeat;
        background-size: 6rem 6rem;
    }*/
    /*新的样式开始*/
    .gl_haibao_img img {
        width: 100%;
        height: auto;
        object-fit: contain;
    }

    .gl_haibao_header_title {
        position: relative;
        text-align: center;
        margin: 0 0.68rem;
    }

    .haibao_logo{
        position:relative;
    }
    .haibao_logo:before,.haibao_logo:after{
        content:"";
        background:#333;
        width:12px;
        height:12px;
        display:block;
        position:absolute;
        top:50%;
        bottom:50%;
        margin:auto;
        z-index:99;
    }
    .haibao_logo:before{
        border-radius:0 12px 12px 0;
        left:-6px;
    }
    .haibao_logo:after{
        right:-6px;
        border-radius:12px 0 0 12px;
    }
    .gl_haibao_header_logo {
        text-align: center;
        margin-top: 0.65rem;
        position: relative;
    }
    .gl_haibao_header_logo:before,.gl_haibao_header_logo:after{
        border-bottom:1px #ddd dashed;
        content:"";
        width: 3.2rem;
        position: absolute;
        bottom: 50%;
        margin: auto;
    }
    .gl_haibao_header_logo:before{
        left: 0;
    }
    .gl_haibao_header_logo:after{
        right: 0;
    }
    .gl_haibao_header_logo img {
        width: 125px;
        /* height: 50px; */
    }

    .gl_haibao_header_titleh1 {
        color: #000;
        font-size: 0.5333rem;
        margin: 0.68rem 0 0.5333rem;
        line-height: 1.3;
        font-weight: 500;
        height: 1.32rem;
        overflow: hidden;
        text-align: justify;
    }

    .gl_haibao_header_intro {
        margin: 15px 0;
        font-size: 0.3733rem;
        max-height: 2.9rem;
        overflow: hidden;
        min-height: 2rem;
        text-align: justify;
    }

    .gl_haibao-date{
        position: relative;
        color:#fff;
        max-height: 41vh;
        background: #333;
        overflow: hidden;
        text-align: center;
    }
    .gl_haibao-date img{
        max-height: none;
        width: 100%;
    }
    .gl_haibao-date .day,.gl_haibao-date .years{
        position:absolute;
        right:0.68rem;
        font-family: Arial;
    }
    .gl_haibao-date .day{
        bottom:1rem;
        font-size: 1.1rem;
        line-height: 1.48rem;
    }
    .gl_haibao-date .years{
        bottom:0.32rem;
        font-size:0.68rem;
    }

    .gl_haibao_foot {
        text-align: center;
        margin: 0.32rem 0 0.48rem 0.68rem;
        padding: 0;
        float: left;
        overflow: hidden;
    }

    .gl_haibao_foot_qrcode {
        float: none;
        width: 1.9rem;
        height: 1.9rem;
        padding: 0;
        background: none;
        margin: 0 auto;
        position: relative;
        border: 1px #ddd solid;
        overflow: hidden;
    }

        .gl_haibao_foot_qrcode img {
            width: 2.2rem;
            height: 2.2rem;
            max-width: none;
            max-height: none;
            position: absolute;
            left: -50%;
            right: -50%;
            top: 0;
            bottom: 0;
            margin: auto;
        }

    .gl_haibao_foot_changan {
        margin: 3px 0 5px;
        color: #999;
        transform:scale(0.9);
        -webkit-transform:scale(0.9);  /*兼容-webkit-引擎浏览器*/
        -moz-transform:scale(0.9);     /*兼容-moz-引擎浏览器*/
        font-size: 0.32rem;
    }

    .gl_haibao_slogan{
        float:right;
        margin-right: 0.68rem;
        margin-top: 1.48rem;
        transform:scale(0.9);
        -webkit-transform:scale(0.9);  /*兼容-webkit-引擎浏览器*/
        -moz-transform:scale(0.9);     /*兼容-moz-引擎浏览器*/
    }
    .gl_haibao_slogan p{
        font-size: 0.32rem;
        text-align: right;
    }

    @media screen and (min-device-width:960px){
	  .gl_haibao_header_logo{
	    margin:25px auto 15px;
	  }
	  .gl_haibao_header_titleh1{
	    font-size:18px;
	    font-weight:bold;
	  }
	  .gl_haibao_box_img{
	    width: 365px;
	  }
	  .gl_haibao_img{
	    height:220px;
	    position:relative;
	  }
	  .gl_haibao_img img{
	    position:absolute;
	    margin:auto;
	    left: 0;
	    right: 0;
	    top:0;
	    bottom:0;
	  }
	  .gl_haibao_foot_qrcode{
	    width:100px;
	    height: 100px;
	    box-sizing: border-box;
	  }
	  .gl_haibao_foot_qrcode img{
	    width:100%;
	    height:100%;
	  }
	
	  #gl_haibao_images{
	    width: 365px;
	    max-width: 85%;
	  }
	}