@charset "utf-8";
.ans{ transition: all .3s; }
.icon{ display: block;background: url("../images/icons.png?v.0.2") no-repeat 0 0; }
.ovh{ text-overflow: ellipsis;white-space: nowrap;overflow: hidden; }
.ovhs,
.ovhss{ display: -webkit-box;-webkit-box-orient: vertical;overflow: hidden; }
.ovhs{ -webkit-line-clamp: 2; }
.ovhss{ -webkit-line-clamp: 3; }
body.index .header,
body.index .footer{ display: none; }
/** Index-model **/
.home-app{
    position: relative;
    width: 100%;
    height: 100vh;
    background: #fff;
    overflow: hidden;
}
.home-logo{
    /*display: flex;*/
    /*flex-direction: column;*/
    /*align-items: center;*/
    /*justify-content: center;*/
    margin-bottom: 45px;
    animation:logoimg 4s;
}
.home-logo img{ display: block;margin: 0 auto; }
.home-logo .home-remark{
    text-align: center;
    color: #342c2a;
}
.home-logo .home-remark h2{
    font-size: 24px;
    padding: 15px 0 12px;
    letter-spacing:6px;
}
.home-logo .home-remark p{ font-size: 16px;padding-bottom: 8px; }
.home-logo .home-remark p a{ padding: 0 8px;color: #000; }
.home-logo .home-remark strong a{ padding: 0 8px;font-size: 16px;font-weight: normal;color: #000; }
.home-footer{
    height: calc(100vh - 40px);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    /*width: 100%; */
    /*position: absolute;*/
    /*bottom: 20px;*/
    /*left: 0; */
}
.home-footer .menu{ text-align: center;  }
.home-footer .menu a{ position: relative; margin: 0 45px; color: #000;font-size: 16px;font-weight: bold; }
.home-footer .menu a:first-child{ display: none; }
.home-footer .menu a:last-child:after{ display: none; }
.home-footer .menu a:after{ position: absolute;top: 10px;right: -48px; display: block;width: 7px;height: 7px;background: var(--color);
    content: "";border-radius: 65px;z-index: 68 }
.home-footer .menu a:hover{ color: var(--color); }
.home-footer .case-menu{ width: 535px; text-align: center;margin: 18px auto 0; }
.home-footer .case-menu a{ display: inline-block; position: relative;margin: 0 15px 10px; font-size: 12px; }
.home-footer .case-menu a:after{ position: absolute;top: 4px;right: -16px; display: block;width: 1px;height: 12px;background: #666;content: "";z-index: 65 }
.home-footer .case-menu a:nth-of-type(6):after,
.home-footer .case-menu a:last-child:after{ display: none; }
.home-footer .case-menu a:hover{ color: var(--color); }
.model-qrcode{ position: absolute;bottom: 20px;right: 20px; text-align: center;z-index: 56; }
.model-qrcode ul li{ display: inline-block;padding: 0 3px; }
.model-qrcode ul li img{ padding: 6px;border: 1px solid #e2e2e2; }
.model-qrcode ul li p{ padding: 5px 0 0;font-size: 12px; }
.home-copyright{ position: absolute;bottom: 20px;width: 100%; text-align: center;z-index: 65; }
.home-copyright span{ padding: 0 5px; }
.home-copyright span,
.home-copyright span a{ color: #666;font-size: 12px; }
/*@media screen and (max-width:1366px){*/
/*    .home-logo{ height: calc(100% - 400px); }*/
/*    .home-logo img{ width: 250px; }*/
/*    .home-footer .case-menu{ margin: 20px auto 10px; }*/
/*}*/
/*@media screen and (min-width:1367px){*/
/*    .home-logo{ height: calc(100% - 420px); }*/
/*    .home-logo img{ width: 380px; }*/
/*    .home-footer .case-menu{ margin: 30px auto 20px; }*/
/*}*/
/*@media screen and (min-width:1680px){*/
/*    .home-logo{ height: calc(100% - 324px); }*/
/*    .home-logo img{ width: 572px; }*/
/*    .home-footer .case-menu{ margin: 30px auto 20px; }*/
/*}*/
/* 动画 */
@-webkit-keyframes logoimg{
    from{opacity: 0;}
    to{opacity: 1;}
}
@keyframes logoimg{
    from{opacity: 0;}
    to{opacity: 1;}
}
/*HeaderSTART*/
.header,
.header .logo{ height:80px; }
.header{ line-height:80px;background: #fff;box-shadow: 0 0 10px rgba(0,0,0,.1); }
.header .logo{
    display: flex;
    align-items: center;
    width: 150px;
}
.header .logo img{ max-width: 100%; }
.nav ul li{float: left;padding:0 30px;}
.nav ul li:last-child{ padding-right: 0; }
.nav ul li a{ position: relative; display:block;font-size:16px;color: #000; }
.nav ul li a:after{ position: absolute;bottom: 0;left: 0; display: block;width: 100%;height: 4px;background: transparent;
    content: "";z-index: 66 }
.nav ul li.on a{ color: var(--color); }
.nav ul li.on a:after{ background: var(--color); }
/*** footer ***/
.footer{ padding: 20px 0;background: #fff;text-align: center; }
.footer span{ padding: 0 5px; }
.footer span,.footer span a{ color: #666; }
/** fixkf **/
.fixkf{ position: fixed;bottom: 20px;right: 20px;z-index: 10090; }
.fixkf ul li{ position: relative; margin-bottom: 10px; }
.fixkf ul li .kicon{ display: block; width: 60px;height: 60px;background: url("../images/rcommon.png") no-repeat 0 0; }
.fixkf ul li.li-conta .kicon{ background-position: 0 -70px; }
.fixkf ul li .codes,
.fixkf ul li .contc-tel{width:250px; padding: 30px; position: absolute;right: 80px;background: #fff;border-radius: 10px;box-shadow: 0 0 10px rgba(0,0,0,.2); }
.fixkf ul li .codes{ top: -55px; }
.fixkf ul li .codes .imgs{ float: left; width: 80px;text-align: center; }
.fixkf ul li .codes .imgs:last-child{ margin-left: 30px; }
.fixkf ul li .codes .imgs img{ width: 100%; }
.fixkf ul li .codes .imgs p{ padding-top: 5px; }
.fixkf ul li .contc-tel{ top: 0; font-size: 16px;color: var(--color);padding: 20px 30px;font-weight: bold; }
.fixkf ul li:hover .hide{ display: block; }
/***************
 List
 ****************/
.back-cors{ min-height: calc(100vh - 140px); padding: 25px 0; }
.con-left{ float: left; width: 250px;box-shadow: 0 0 5px rgba(0,0,0,.1);background: #fff; }
/*.con-left.jsbg{ background:#fff url("../images/jsbg.jpg") no-repeat center bottom; }*/
.con-left.jsbg .append-bg{ background:#fff url("../images/leftbg.jpg") no-repeat center top; }
.subcat .sub-tit{ padding: 0 25px; height: 80px;line-height: 80px; background: var(--color); }
.subcat .sub-tit h3{ color: #fff;font-size: 22px; }
.subcat .sub-tit h3 span{ font-size: 14px;color: rgba(255,255,255,.6) }
.subcat ul li{ position: relative; padding: 0 25px; height: 50px;line-height: 50px; border-bottom: 1px solid #e6e6e6;overflow: hidden; }
.subcat ul li a{ display: block; }
.subcat ul li:last-child{ border-bottom: 0; }
.subcat ul li:before{ position: absolute;top: 14px;left: 0;width: 4px;height: 24px;background: transparent;content:"";z-index: 6 }
.subcat ul li i{ position: absolute;top: 20px;right: 25px;width: 14px;height: 12px; background: url("../images/icon-menu.png") no-repeat;z-index: 65; }
.subcat ul li:hover a,
.subcat ul li.on a{ color: var(--color); }
.subcat ul li:hover:before,
.subcat ul li.on:before{ background: var(--color); }
.con-right{ float: right; width: calc(100% - 290px); }
.current{ display: none; height: 79px;line-height: 79px; border-bottom: 1px solid #e6e6e6; }
.current .curr-left h3{ font-size: 22px;font-weight: bold; }
.current .curr-a span,
.current .curr-a a{ font-size: 13px;color: #666; }
.current .curr-a a{ position: relative; padding: 0 10px; }
.current .curr-a a:after{  display: block;position: absolute;top: 5px;right: -5px;width: 5px;height: 9px;content: ""; background: url("../images/gt.png");z-index: 68 }
.current .curr-a a:nth-of-type(1){ padding-left: 0; }
.current .curr-a a:last-child{ padding-right: 0; }
.current .curr-a a:last-child:after{ display: none; }
/** about **/
.page-video{ width: 100%;height: 650px;overflow: hidden; }
.page-video .page-video-js{ object-fit: cover; }
/** detail **/
.detail{ background: #fff;padding: 30px; }
.detail img{ max-width: 100%;height: auto; }
.vcontent{ background: #fff; }
.vcontent .detail{ padding: 0 30px 30px; }
.avideo-js{ margin-bottom: 15px; }
.embed-video-js{ width: 100%;height: 580px;object-fit: cover;background: rgba(0,0,0,.9); }
.vs1, .vs2, .vs3{ position: relative }
.vs1:after,.vs2:after,.vs3:after{ position: absolute;top: 20px;right: 20px;font-size: 20px;color: #fff;z-index: 10020; }
.vs1:after{  content: "和氏宣传片"; }
.vs2:after{  content: "和氏20周年庆典"; }
.vs3:after{  content: "和氏案例央视纪录片"; }
.vs1.cat49:after{  content: "和氏总部基地"; }
/** zongbu **/
.zongbu h1{ font-size: 24px;color: #000;font-weight: bold;text-align: center;padding-bottom: 20px; }
.zongbu .desc{ text-indent: 29px; }
.slide-mpics{ background: #fff; }
.slide-mpics .mnav{ padding: 0 30px; }
.slide-mpics .mnav a{ font-size: 16px;color: #000;margin-right: 15px;padding-bottom: 5px; border-bottom: 3px solid transparent;font-weight: bold;cursor: pointer; }
.slide-mpics .mnav a.on{ border-bottom-color: var(--color); color: var(--color);}
/* swiper-pics */
.swiper-pics{ margin-top: 30px; position: relative; overflow: hidden; }
.swiper-pics .table-slide.vis{ height: auto;visibility: visible; }
.swiper-pics .table-slide{ height: 0;visibility: hidden; }
.swiper-pics .swiper-pagination{ bottom: 30px; }
.swiper-pics .swiper-pagination-bullet{ width: 12px;height: 12px;background: #fff;opacity: 1; }
.swiper-pics .swiper-pagination-bullet.swiper-pagination-bullet-active{ background: var(--color); }
.swiper-pics .remark{ padding: 15px 30px 30px;color: #000; }
/*** case-list ***/
.case-list ul li{ width: calc((100% / 3) - 18px); float: left;margin: 0 27px 27px 0;background: #fff;transition: all .3s; }
.case-list ul li:nth-of-type(3n){ margin-right: 0; }
.case-list ul li .imgs{ width: 100%;  }
.case-list ul li .remark{ height: 80px;padding: 15px 20px 0; }
.case-list ul li .remark h5{ font-size: 16px;color: #000;font-weight: bold; }
.case-list ul li .remark p{ color: #666;font-size: 13px; }
.case-list ul li:hover{ background: var(--color);box-shadow: 0 10px 10px rgba(0,0,0,.3); }
.case-list ul li:hover .remark h5,
.case-list ul li:hover .remark p{ color: #fff; }
/** case-content **/
.pics{ position: relative;overflow: hidden; }
.pics .swiper-slide{ overflow: hidden; }
.pics .swiper-button-prev,
.pics .swiper-button-next{ opacity: 0;visibility: hidden; width: 50px;height: 50px; }
.pics .swiper-button-prev{ background-position: 0 -25px; }
.pics .swiper-button-next{ background-position: -63px -25px; }
.pics .swiper-button-prev:after,
.pics .swiper-button-next:after,
.pics .swiper-button-prev.swiper-button-disabled,
.pics .swiper-button-next.swiper-button-disabled{ opacity: 0 !important;visibility: hidden; }
.pics .swiper-button-prev:hover{ background-position: 0 -82px; }
.pics .swiper-button-next:hover{ background-position: -63px -82px; }
.pics .swiper-pagination{ bottom: 6px; }
.pics .swiper-pagination-bullet{ width: 12px;height: 12px;background: #fff;opacity: 1; }
.pics .swiper-pagination-bullet.swiper-pagination-bullet-active{ background: var(--color); }
.cotent{ display: flex;flex-direction: column;justify-content: center;
    position: absolute;width: 380px;height: 100%; top: 0;right: 0;
    padding: 0 35px; background: rgba(0,0,0,.7);z-index: 6;
    animation: rcontent 1.5s;
    -webkit-animation: rcontent 1.5s; }
.cotent h5{ font-size: 20px;color: #fff;padding-bottom: 10px;font-weight: bold }
.cotent .content-editor p{ color: #fff !important; }
.cotent .lrbth{ position: absolute;left: 30px;bottom: 22px; display: block;width: 29px;height: 29px;background-position: -130px 0;
    border: 0;cursor: pointer; z-index: 98; }
.cotent.ops{ right: -310px;padding-left: 80px; }
.cotent.ops .lrbth{ left: 22px; background-position: -171px 0; }
.cotent .vqrcode{ position: absolute;right: 30px;bottom: 22px; width: 100px;height: 100px;z-index: 68; }
.pics:hover .swiper-button-prev,
.pics:hover .swiper-button-next{ opacity: 1;visibility: visible; }
@keyframes rcontent {
    from { right: -400px; }
    to { right: 0; }
}
@-webkit-keyframes rcontent {
    from { right: -400px; }
    to { right: 0; }
}
/*** metaverse-list ***/
.metaverse-list ul li{ position: relative; float: left; width: calc((100% / 2) - 14px);margin-bottom: 28px; }
.metaverse-list ul li:nth-of-type(even){ float: right; }
.metaverse-list ul li .hvimg{ display: flex;align-items: center;justify-content: center; width: 100%;height: 100%; position: absolute;top: 0;left: 0;
    background: rgba(0,0,0,.5); z-index: 65 }
.metaverse-list ul li .hvimg .hvimg-icon{ width: 280px;height: 80px;overflow: hidden; }
.metaverse-list ul li .hvimg img{ margin-top: -91px; }
.metaverse-list ul li:hover .hvimg{ background: rgba(0,0,0,.8); }
.metaverse-list ul li:hover .hvimg img{ margin-top: 0; }
.metaverse-list ul li:nth-of-type(2):hover .hvimg img{ margin-top: 1px; }
.metaverse-list ul li:nth-of-type(3):hover .hvimg img{ margin-top: 3px; }
.metaverse-list ul li:nth-of-type(4):hover .hvimg img{ margin-top: -2px; }
/*** article-list ***/
.article-list ul li{ background: #fff;padding: 20px;margin-bottom: 20px; }
.article-list ul li a{ display: flex;align-items: center; }
.article-list ul li .imgs{ position: relative; width: 300px; }
.article-list ul li .time{ font-size: 14px; }
.article-list ul li .remark{ width: calc(100% - 350px);margin-left: 25px; }
.article-list ul li .remark h5{ font-size: 20px;color: #000; }
.article-list ul li .remark .time{ padding-top: 5px; }
.article-list ul li .remark .desc{ margin: 10px 0 15px; }
.article-list ul li .remark span{ color: #666; }
.article-list ul li:hover{ box-shadow: 0 0 10px rgba(0,0,0,.1); }
.article-list ul li:hover .remark h5{ color: var(--color); }
/*** article-list-nothumb ***/
.article-list-nothumb ul li{ padding: 35px 20px; float: left; width:calc((100% / 2) - 12px); background: #fff;margin-bottom: 24px;  }
.article-list-nothumb ul li:nth-of-type(even){ float: right; }
.article-list-nothumb ul li .remark h5{ font-size: 18px; }
.article-list-nothumb ul li .remark .desc{ min-height: 66px; margin: 15px 0;color: #666; }
.article-list-nothumb ul li .remark span{ color: #000; }
.article-list-nothumb ul li:hover{ box-shadow: 0 0 10px rgba(0,0,0,.1); }
.article-list-nothumb ul li:hover .remark h5{ color: var(--color); }
/** arvideo **/
.article-list ul li.arvideo .remark .time{ padding-bottom: 15px; }
.article-list ul li.arvideo .play-video{ opacity:1;visibility:visible;display:flex;align-items:center;justify-content:center;position:absolute;top:0;left:0;
    width:100%;height:100%;background:rgba(0,0,0,.6);z-index:68; }
.article-list ul li.arvideo .vopen{ display:block;width:35px;height:35px;background-position:0 -142px;border:0;outline:0;cursor:pointer;z-index:6; }
.article-list ul li.arvideo:hover .play-video{ background:rgba(0,0,0,.8); }
/** Show **/
.stitle{ border-bottom: 1px solid #eee;padding-bottom: 20px;margin-bottom: 20px; }
.stitle h1{ font-size: 20px;color: #000;padding-bottom: 10px;font-weight: bold; }
.stitle span{ padding-right: 10px; }
.stitle span,.stitle span a{ color: #666; }
/*** cert-list ***/
.cert-list{ background: #fff;min-height: calc(100vh - 190px); }
.cert-list ul li{ padding: 0 30px; }
.cert-list ul li p{ position: relative; height: 67px;line-height: 67px;padding-left: 28px; border-top: 1px solid #eee;color: #000; }
.cert-list ul li p:after{ position: absolute;top: 22px;left: 0; width: 25px;height: 25px;content: "";background: url("../images/cert-ico.png") no-repeat;
    background-size: 25px;z-index: 54 }
.cert-list ul li:hover p{ color: var(--color); }
/* open */
.lay-cert-remark{ padding: 80px 50px 40px; }
.lay-cert-remark .imgs{ width: 500px;margin: 0 auto;text-align: center; }
.lay-cert-remark .imgs img{ max-width: 100%; }
.lay-cert-remark h5{ font-size: 18px;font-weight: bold;color: #000;text-align: center;padding: 20px 0 10px; }
.lay-cert-remark p{ color: #000; }
.layui-layer-setwin .layui-layer-close2:hover{background-position: -149px -31px !important;}
/*** award-lists ***/
.award-lists ul li{ position: relative; float: left;width: calc((100% / 2) - 12px); margin-top: 24px;background: #fff;height: 60px;
    line-height: 60px;text-indent: 40px; }
.award-lists ul li:nth-of-type(even){ float: right; }
.award-lists ul li:after{ position: absolute;top: 23px;right:30px; display: block;width: 14px;height: 12px;content: ""; background: url("../images/icon-menu.png");
    z-index: 68; }
.award-lists ul li a{ display: block; color: #000; }
.award-lists ul li:hover{ background: var(--color); }
.award-lists ul li:hover a{ color: #fff; }
/** award-show **/
.award-show h1{ font-size: 28px;color: #000; }
.award-show .desc{ padding: 25px;background: #f3f3f3;margin: 20px 0 25px; }
/*** append-nav ***/
/*.append-nav{ margin: 35px 0 15px; }*/
/*.append-nav a{ display: block;float: left; width: calc((100% / 4) - 17px);height: 45px;line-height: 45px;border: 1px solid var(--color); text-align: center; margin: 0 20px 20px 0; }*/
/*.append-nav a:nth-of-type(4n){ margin-right: 0; }*/
/*.append-nav a:hover{ background: var(--color);color: #fff; }*/
.append-nav-v2{ margin-bottom: 15px;text-align: center; }
.append-nav-v2 a{ position: relative; display: inline-block;padding: 0 15px;color: #000; }
.append-nav-v2 a:after{ position: absolute;top: 6px;right: -1px;width: 1px;height: 10px; content: "";background: #6666;z-index: 8 }
.append-nav-v2 a:last-child:after{ opacity: 0; }
.append-nav-v2 a:hover{ color: var(--color); }
/*** video-list ***/
.video-list ul li{ float: left;width: calc((100% / 3) - 20px);margin-bottom: 30px;background: #fff; }
.video-list ul li:not(:nth-of-type(3n)){ margin-right: 30px; }
.video-list ul li .imgs{ position: relative; display: flex;align-items: center;justify-content: center; width: 100%;height: 158px;overflow: hidden; }
.video-list ul li .imgs img{ max-width: 100%; }
.video-list ul li .qrcode{ opacity: 1;visibility: visible; display: flex;align-items: center;justify-content: center; position: absolute;top: 0;left: 0; width: 100%;height: 100%;background: rgba(0,0,0,.6);z-index: 68 }
.video-list ul li .remark{ position: relative; height: 70px;padding: 0 20px; }
.video-list ul li .remark h5{ font-size: 16px;color: #000;padding: 10px 0 0; }
.video-list ul li .remark p{ color: #666; }
.video-list ul li .vopen{ display: block;width: 35px;height: 35px;background-position: 0 -142px;
    border: 0;outline: none;cursor: pointer; z-index: 6 }
.video-list ul li:hover .qrcode{ background: rgba(0,0,0,.8); }
.video-list ul li:hover .remark{ background: var(--color); }
.video-list ul li:hover .remark h5,
.video-list ul li:hover .remark p{ color: #fff; }
.video-js{ display: block; width: 100%;height: 100%; object-fit: contain;background: #000; }
.video-clas.layui-layer-page .layui-layer-content{ overflow: hidden; }
.video-clas.layui-layer-page .lay-video{ height: 100%; }
.video-clas .layui-layer-setwin .layui-layer-close2{ right: 0; top: -5px; }
.video-clas video::-webkit-media-controls-fullscreen-button{
    background-image: -webkit-image-set(url(../images/full.png) 1x) !important;
}
/*** verpics ***/
.verpics img:not(:last-child){ margin-bottom: 20px; }
/*** wwvid ***/
.wwvid .page-video-js{ height: calc(100vh - 190px); }
/*** deeds-list ***/
.deeds-list .ctime{ float: left; width: 70px; font-size: 16px;color: #000;font-weight: bold; }
.deeds-list .layui-timeline{ float: right; width: calc(100% - 70px); }
.deeds-list .layui-text h3{ margin-bottom: 5px; }
.deeds-list .layui-text h3 a{ font-size: 14px;color: #000; }
.deeds-list .layui-timeline-item:hover .layui-timeline-axis{ background: var(--color);color: var(--color); }
.deeds-list .layui-timeline-item:hover .layui-text h3 a{ color: var(--color); text-decoration:none; }
.deeds-list .layui-text p{ margin: 0;color: #999; }
.deeds-list .layui-timeline-axis{ color: #dcdcdc; }
.deeds-list .pics{ margin:10px 0 30px 25px; height: 0;overflow: hidden; }
.deeds-list .group.active .layui-timeline .pics{ height: auto; }
.deeds-list .group.active .layui-timeline li:first-child i{ background: var(--color);color: var(--color);}
/*+---------------
/*+  Pages
/*+---------------*/
.pages{ text-align:center;padding:20px 0 0; }
.pages a{ display:inline-block;padding:5px 10px;margin-right:5px;border:1px solid #000; }
.pages a:last-child{ margin-right:0; }
.pages a.curr{ color:#fff;background:var(--color);border-color:var(--color); }
/*+------------------
/*+  Prev-Next
/*+------------------*/
.Pre-Next{ position: relative;margin: 35px 0 0;padding-top: 25px; border-top: 1px solid #eee; }
.Pre-Next p{ line-height: 30px; overflow:hidden;}