@charset "UTF-8";

/****header start****/
.blackbarnew {
  top: 0;
  left: 0;
  width: 100%;
  height: 30px;
  padding: 0 12px;
  /*background-color: #f08200;*/
  background-color: #f08200;
  position: fixed;
  z-index: 999;
  overflow: hidden;
}


.yeslogo {
  font-size: 12px;
  color: #fff;
  line-height: 30px;
  letter-spacing: 2px;
  float: left;
}

.yeslogo i {
  margin-right: 8px;
  float: left;
}

.yeslogo i img {
  width: 10px;
  margin-top: -3px;
}

.yesgogo {
  font-size: 12px;
  color: #fff;
  line-height: 30px;
  letter-spacing: 2px;
  float: right;
  max-width: 116px;
 }


.yesyes {
  font-size: 15px;
  color: #fff;
  font-weight: bold;
  line-height: 30px;
  letter-spacing: 1px;
  margin-right: 4px;
}




body{padding-top: 30px;}

@media screen and (max-width: 980px) {

body{padding-top: 30px;}


}

@media screen and (max-width: 736px) {

body{padding-top: 30px;}

}


.header124{width: 100%; position: fixed; top:30px; left: 0; z-index: 999; background-color: #fff; padding:24px 16px 12px;
 box-shadow: 0 4px 5px rgba(50,50,50,0.1);}

.header124 > ul{max-width: 980px; margin: 0 auto; overflow: hidden;}

.header124 > ul > li{float: left; }

.header124 > ul > li:nth-child(1){position: relative; width: calc(100% - 120px);}

.header124 > ul > li:nth-child(2){position: relative; width: 120px;}


@media screen and (max-width: 980px) {

.header124 > ul{padding: 0 24px;}

.header124{padding:12px 16px 12px;}

}

@media screen and (max-width: 736px) {


    
    .header124{padding:0px 0 0px;}
    .header124 > ul{padding: 0 0px;}
    .header124 > ul > li{width: 100%}
    .header124 > ul > li:nth-child(1){width: 100%}
    .header124 > ul > li:nth-child(2){display: none;}

}



.spname{width: 100%;}

.spname > ul{overflow: hidden;}

.spname > ul > li{text-align: left; float: left; min-height: 56px}


.spname > ul > li h1{font-size: 32px; color: #f08200; font-weight: bold; margin-bottom: 12px;}


.logos{max-width: 200px;}

.spname > ul > li:nth-child(1){width: 220px;}
.spname > ul > li:nth-child(2){width: calc(100% - 220px); overflow: hidden;}


.menum{display: none;}



@media screen and (max-width: 980px) {

.logos{max-width: 120px; padding-top: 10px;}
.spname > ul > li:nth-child(1){width: 140px;}
.spname > ul > li:nth-child(2){width: calc(100% - 140px); overflow: hidden;}

.spname > ul > li{min-height: 48px}


}

@media screen and (max-width: 736px) {

.logos{max-width: 100%; padding: 12px 12px; text-align: left; height: 76px; overflow: hidden;}
.logosm {float: left; width: 164px; padding-top:8px; margin-left:2px;}

.menum{float: right; width: 50px; cursor: pointer; height: 50px; display: block;
       background-image: url(../img/menum.png);
       background-size: cover;
       background-repeat: no-repeat;
       background-position: center;
       transition:all .3s;
     }
.menumx{
  background-image: url(../img/menuclose.png);
}

.spname > ul > li:nth-child(1){width: 100%; text-align: center;}
.spname > ul > li:nth-child(2){width: 100%; display: none; position: revert; z-index: 9998;}


}



.menu{width: 100%; max-width: 580px;}

.menu > ul{overflow: hidden;}

.menu > ul > li{text-align: left; float: left; width:calc(100% / 5);}

.menu > ul > li div{font-size: 16px; color: #444; transition:all .3s; line-height: 56px; text-align: center;}

.menu > ul > li div:hover{color: #f08200; }

.menuok{color: #333!important; background-color:#ddd;}


@media screen and (max-width: 980px) {
    
.menu > ul > li div{line-height: 48px;}

}



@media screen and (max-width: 736px) {

.menu{width: 100%; max-width: 580px; background-color:#efefef;}
    
.menu > ul > li{text-align: center; float: left; width:100%; border-bottom:1px solid #ddd; }

.menu > ul > li div{line-height: 60px; font-size: 18px; text-align: left; padding: 0 20px; letter-spacing: 4px;
       background-image: url(../img/arr.png);
       background-size: 40px;
       background-repeat: no-repeat;
       background-position: center right;
       transition:all .3s;}

}




.goshop{width: 100px; height: 40px; line-height: 40px; text-align: center; font-size: 16px; font-weight: bold;
      color: #fff; background-color: #333; border-radius: 20px; transition:all .3s;
     /* position: absolute; right: 0; top: 16px;*/ margin: 6px 0 0 20px;}


.goshop:hover{ background-color: #666; }

@media screen and (max-width: 980px) {
    
.goshop{margin: 4px 0 0 20px;}

}



.demby01{width: 100%; margin: 0px 0 0px; 
  background-image: url(../img/1920X480.jpg);
         background-repeat: no-repeat;
         background-position: center;
         background-size:cover ;
        /*background-attachment: fixed;*/
        overflow:hidden;
        position:relative;
      }

.demby02{width: 100%; text-align: center; padding: 40px 24px 60px;}

.demby02 > img{max-width: 360px; margin: 0 0 16px;}

.demby02 > h1{font-size: 32px; color: #444; margin: 0 0 20px; line-height: 1.5;}

.demby02 > h2{font-size: 16px; color: #333; margin: 0 auto 8px; line-height: 1.5; padding: 8px 16px; border:1px solid #f08200; max-width: 220px; }

.demby02 > h3{font-size: 12px; color: #666; margin: 0 0 20px; line-height: 1.5;}

.demby02 > p{font-size: 18px; color: #444; margin: 0 0 20px; line-height: 1.8;}

.demby02 > h4{font-size: 32px; color: #444; margin: 0 0 8px; line-height: 1.5;}

.demby02 > h5{font-size: 16px; color: #333; margin: 0 0 16px; line-height: 1.5;}





@media screen and (max-width: 736px) {

.demby02{padding: 20px 24px 40px;}
.demby02 > h1{font-size: 28px;}
.demby02 > p{font-size: 16px; text-align: left;}
.demby02 > h4{font-size: 28px;}


.demby01{ background-image: url(../img/720X920.jpg);}


}











body{width: 100%; 
         /*background-image: url(../img/bg.jpg);*/
         background-repeat: no-repeat;
         background-position: center bottom;
         background-size:cover ;
         background-attachment: fixed;
         background-color:#eee;
     }

.demby04{width: 100%; 
         background-image: url(../img/design01.jpg);
         background-repeat: no-repeat;
         background-position: center;
         background-size:cover ;
         background-attachment: fixed;
         padding: 0 24px;	    

     }

 .demby05{width: 100%; 
         background-image: url(../img/ab02.jpg);
         background-repeat: no-repeat;
         background-position: center;
         background-size:cover ;
         background-attachment: fixed;
         padding: 0 24px;

     }    

@media screen and (max-width: 736px) {

 .demby05{background-image: url(../img/ab02.jpg);}   
  .demby04{background-position-x:55% ;} 

}




.rbox{overflow: hidden; }

.rbox > li{width: 50%; text-align: left; padding: 80px 0; float: left;}

.rbox > li h2{font-size: 32px; color: #444; font-weight: bold; margin: 0 0 12px; line-height: 1.5; }

.rbox > li p{font-size: 20px; color: #444; margin: 0 0 0px; line-height: 1.6; }


@media screen and (max-width: 736px) {

.rbox > li{width: 100%; padding: 80px 0;}
.rbox > li h2{font-size: 24px;}
.rbox > li p{font-size: 18px;}
.rbox > li:nth-child(2){display: none;}
	/*.rbox span{display: block}*/

}






.lbox{overflow: hidden;}

.lbox > li{width:calc(50% - 8px); float: right; margin-right: 16px;}

.lbox > li:nth-child(2n+2){margin-right: 0}


@media screen and (max-width: 736px) {

.lbox > li{width: 100%;  margin-right: 0;}


}


.wbg{width: 100%; background-color: rgba(255,255,255,0.7); padding: 20px 24px 20px;}





.goshop2{width: 120px; height: 40px; line-height: 40px; text-align: center; font-size: 18px; font-weight: bold;
      color: #333; border: 1px solid #fff; border-radius: 20px; transition:all .3s; margin: 16px 0 0;
       box-shadow: 0 0 5px rgba(0,0,0,0.2);  background-color: rgba(255,255,255,0.8);
       text-shadow: 0 0 5px rgba(0,0,0,0.0);}

.goshop2:hover{ background-color: #333; border: 1px solid #333; color: #fff;}





@media screen and (max-width: 736px) {

.goshop2{margin: 6px 0 0;}

}











.photo{max-width: 980px; margin: 0 auto 28px; }


.photo > ul{overflow: hidden;}

.photo > ul > li{float: left; width:calc(25% - 12px); margin:0 16px 16px 0;}

.photo > ul > li:hover h2{color: #333; }

.photo > ul > li img{width: 100%;  transition:all .3s; opacity: 1; border-radius: 8px;}

.photo > ul > li img:hover{opacity: 1; transform: scale(0.95);}

.photo > ul > li:nth-child(4n+4){margin-right: 0;}


@media screen and (max-width: 736px) {


.photo > ul > li{width:calc(50% - 8px); margin:0 16px 16px 0;}
	
.photo > ul > li:nth-child(4n+4){margin-right: 16px;}
	
.photo > ul > li:nth-child(2n+2){margin-right: 0px;}

.photo > ul > li:nth-last-child(-n+2){margin-bottom:0;}


}




.photo1229{max-width: 980px; margin: 0 auto 0px; }


.photo1229 > ul{overflow: hidden;}

.photo1229 > ul > li{float: left; width:calc(100% / 3 - 10px); margin:0 15px 15px 0;}

.photo1229 > ul > li:hover h2{color: #333; }

.photo1229 > ul > li img{width: 100%;  transition:all .3s; opacity: 1; border-radius: 8px;}

.photo1229 > ul > li img:hover{opacity: 1; transform: scale(0.95);}

.photo1229 > ul > li:nth-child(3n+3){margin-right: 0;}

.photo1229 > ul > li:nth-last-child(3){margin-bottom:0}
.photo1229 > ul > li:nth-last-child(2){margin-bottom:0}
.photo1229 > ul > li:nth-last-child(1){margin-bottom:0}

@media screen and (max-width: 736px) {

/*.photo1229 > ul > li:nth-child(1){width:100%; margin-right: 0;}

.photo1229 > ul > li:nth-child(2){width:calc(50% - 8px); margin-right:16px;}
.photo1229 > ul > li:nth-child(3){width:calc(50% - 8px); margin-right:0px;}*/

.photo1229 > ul > li{width:calc(100% / 3 - 8px); margin:0 12px 12px 0;}

}







.goshop3{width: 200px; height: 40px; line-height: 40px; text-align: center; font-size: 18px; font-weight: bold;
      color: #fff; background-color: #333; border-radius: 20px; transition:all .3s; margin: 0 auto;}


.goshop3:hover{ background-color: #666; }




.footer{width: 100%; background-color: #333; padding: 40px 24px 48px;}

.footer > ul{overflow:hidden; max-width:980px; margin:0 auto;}

.footer > ul > li{float:left; width:50%; }


@media screen and (max-width: 980px) {

   .footer{padding-bottom:180px;}

}


@media screen and (max-width: 736px) {

  .footer{padding-bottom:100px;}

.footer > ul > li{width:100%; }

.tablinks3 h1 span{display:block;}

}






.company{width: 100%;}

.company > ul{overflow: hidden; max-width: 980px; margin: 0 auto;}

.company > ul > li{ text-align: left; color: #eee; font-size: 16px; width:100%; margin-bottom:12px; line-height:1.5;}

.company > ul > li:nth-child(4){display:inline-block; width:180px;}
.company > ul > li:nth-child(5){display:inline-block; width:180px;}
.company > ul > li:last-child{color: #888; font-size: 12px; }

@media screen and (max-width: 980px) {


}

@media screen and (max-width: 736px) {


.company > ul > li{ font-size: 14px; width:100%;}

.company > ul > li:nth-child(4){display:inline-block; width:160px;}
.company > ul > li:nth-child(5){display:inline-block; width:160px;}



}

.social{width: 100%; text-align:right; min-height:140px; position:relative; padding-top:4px;}

.social > ul{overflow: hidden; max-width: 980px; margin: 0 auto 16px;}

.social > ul > li{display:inline-block; width:30px; margin-right:8px;  opacity:0.7;  transition:all .3s;}

.social > ul > li:hover{opacity:1;}

.social > ul > li:nth-last-child(1) {margin-right:0;}

/*.social > ul > li:last-child{margin-right:0;  position:absolute; right:0; bottom:0px; width: 320px; height: 70px; opacity:1;}*/



@media screen and (max-width: 736px) {

.social{width: 100%; text-align:left; padding-top:16px; min-height:auto; padding-bottom:40px;}
.social > ul > li{width:32px;}

/*.social > ul > li:last-child{position:relative; text-align:left; width:100%; padding-top:16px; height: 70px;}*/


}

.ptno{padding-top:0!important}

.txtleft{text-align:left!important;}


@media screen and (max-width: 736px) {


.txtleftm{text-align:left!important;}

}








.wimg{display: block;}
.mimg{display: none;}

.swiper-slide{position: relative; text-align: center;}

.swiper-slide h1{
  position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); font-size: 40px; 
  font-weight: bold; color: #fff; line-height: 1.2; display: block;
  text-shadow: 0 0 5px rgba(0,0,0,0.5); 
}


.noswiper-slide{position: relative;  min-height:480px; }

.noswiper-slide{max-width:980px; position:relative; margin:0 auto; }

.noswiper-slide img{border-radius:0px;}

.noswiper-slide h1{
  position: absolute; left: 0px; top: 40%; transform: translate(0, -50%); font-size: 48px; 
  font-weight: bold; color: #fff; line-height: 1.2; display: block;
  text-shadow: 0 0 5px rgba(0,0,0,0.8); letter-spacing:2px;
}

.noswiper-slide p{font-size: 28px; padding-top:8px; letter-spacing:2px;}

/*.noswiper-slide span{display: block;}*/

@media screen and (max-width: 980px) {


.noswiper-slide h1{left: 24px;}

}

@media screen and (max-width: 736px) {

.noswiper-slide980 img{border-radius:0}

.swiper-slide span{display: block;}
.noswiper-slide span{display: block;}

.swiper-slide h1{width: 100%;}


.wimg{display: none!important;}
.mimg{display: block!important;}

.noswiper-slide{ /*background-image: url(../img/720m.jpg);}*/ text-align:left; padding-left:0px;
background-position-x:72%;}

.noswiper-slide h1{  position: absolute; left: 0px; bottom: 0px; top:auto; transform: translate(0, 0); font-size:40px; width:100%;
 text-align:center; padding:16px 0; background-color:rgba(50,50,50,0.4);}
.noswiper-slide p{font-size:20px; }

}



.vdo{max-width: 980px; margin: 0 auto 16px; position:relative;}
.video-container {
position: relative;
padding-bottom: 56.25%;
/*padding-top: 30px;*/
border:0px solid #dfdfdf;
height: 0;
overflow: hidden;
}
.video-container iframe, .video-container object, .video-container embed {
position: absolute;
top: 0;left: 0;
width: 100%;
height: 100%;}



.max980{max-width: 980px; margin: 0 auto; position:relative;}
.max480{max-width: 480px; margin: 0 auto;}

/*20231204*/

.yboxad{width: 100%; padding: 28px 24px 0px;}

.yboxad h1{font-size: 28px; color: #f08200; margin: 8px 0 4px; line-height: 1.5;}

/*.yboxad h1::before{ width:16px; height:2px; background-color:#ffc075; content: '';  display:inline-block; margin:0 4px 0 0px;}
.yboxad h1::after{ width:16px; height:2px; background-color:#ffc075; content: '';  display:inline-block; margin:0 0 0 4px;}*/

.yboxad h2{font-size: 18px; color: #444; padding: 12px 0 0px; line-height: 1.5; transition:all .3s;}

.yboxad p{font-size: 18px; color: #444; margin: 0 0 12px; line-height: 1.5;}

.yboxad img{margin:0 0 -3px; border-radius: 8px}














.textcenter{text-align: center;}
.textleft{text-align: left;}

.padding20{padding: 20px;}

.mb28{margin-bottom: 28px!important;}

.mb44{margin-bottom: 44px!important;}



.know{max-width: 980px; margin: 0 auto; }


.know > ul{overflow: hidden;}

.know > ul > li{float: left; width:calc(100% / 3 - 10px); margin:0 15px 16px 0;}

.know > ul > li img{width: 100%;  transition:all .3s; opacity: 1; border-radius: 8px;}

.know > ul > li img:hover{opacity: 1; transform: scale(0.95);}

.know > ul > li:nth-child(3n+3){margin-right: 0;}


@media screen and (max-width: 736px) {


.know > ul > li{width:100%; margin-right: 0;}

.yboxad span{display:block;}


.yboxad h1{font-size: 26px;}

}






.yboxads{width: 100%; position: relative;}


.yboxads h1{
  position: absolute; left: 4%; top: 12%; /*transform: translate(-50%, -50%);*/ font-size: 32px; 
  font-weight: bold; color: #fff; line-height: 1.2; display: block;
  text-shadow: 0 0 5px rgba(0,0,0,0.5); 
}


@media screen and (max-width: 736px) {


.yboxads span{display: block;}

.yboxads h1{ text-align:left; left: 4%; top: 8%; font-size: 26px;}

.pm16{font-size:16px!important;}

}


.pushgood{max-width: 980px; margin: 0 auto; }


.pushgood > ul{overflow: hidden;}

.pushgood > ul > li{float: left; width:calc(100% / 2 - 8px); margin:0 16px 16px 0;}

.pushgood > ul > li img{width: 100%;  transition:all .3s; opacity: 1; border-radius: 8px;}

.pushgood > ul > li img:hover{opacity: 1; transform: scale(0.95);}

.pushgood > ul > li:nth-child(2n+2){margin-right: 0;}


@media screen and (max-width: 736px) {


.pushgood > ul > li{width:100%; margin-right: 0;}


}




.gooddesign{overflow: hidden; margin-bottom:24px; }

.gooddesign li{float: left; width:calc(100% / 3 - 10px); /*border-left:1px solid #ddd; color:#888;*/ margin-right:15px;}

.gooddesign li div{text-align:center; font-size:22px; font-weight:bold; height:40px; line-height:40px; 
border-radius:8px; border:1px solid #aaa; color:#888; transition: all .3s; }

.gooddesign li:nth-child(3n+3){/*border-right:1px solid #ddd;*/ margin-right:0;}

.gooddesign li div:hover{color:#333; background-color:#ddd;}


@media screen and (max-width: 736px) {


/*.gooddesign li{width:100%; border:0px solid #888;}*/

/*.gooddesign{border:1px solid #ddd; padding:8px 0; background-color:#fff; border-radius:8px; }*/

.gooddesign{padding:0 0px;}

.gooddesign li div{ height:auto; line-height:1.2; font-size:18px; padding:8px 0 6px; border-radius:8px;}

.gooddesign li div span{display:block!important;}


}



.know2{max-width: 980px; margin: 0 auto; }


.know2 > ul{overflow: hidden;}

.know2 > ul > li{width:calc(100%); margin:0 0px 16px 0; border:0px solid #ddd; border-radius:8px; overflow:hidden; 
  background-color:#fff;}



.know2 > ul > li:last-child{margin:0 0px 0px 0;}

.arbox{width:100%;}

.arbox ul{ overflow:hidden;}

.arbox li{float: right; text-align:left; position:relative; min-height:260px;}

.arbox li img{ border-radius:0; }

.arbox li h2{font-size:20px; color:#333; line-height:1.5; margin-bottom:8px; padding:0 0 0 8px;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical; overflow:hidden;
  }


.arbox li h2::before {
  content: "✦";
  display: inline-block;
  margin-right:4px;
}




.arbox li p{font-size:16px; color:#666; line-height:1.8; margin-bottom:8px; overflow:hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 5;
    -webkit-box-orient: vertical;}

.arbox li h6{font-size:16px; color:#999; position:absolute; right:24px; bottom:20px; transition: all .3s;}

.arbox li h6:after{content:""; background-image:url('../img/paw.png'); background-repeat:no-repeat; background-position:center; background-size:18px; 
  width:18px; height:18px; display:inline-block; position:relative; padding:0px 0 0 8px; 
 vertical-align:middle; margin-top:-2px;}


.know2 > ul > li:hover h6{color:#333; }



.arbox li:nth-child(1){width:400px;}
.arbox li:nth-child(2){width:calc(100% - 400px); padding:20px 24px;}

@media screen and (max-width: 736px) {

.arbox li{min-height:auto;}
.arbox li:nth-child(1){width:100%}
.arbox li:nth-child(2){width:calc(100% - 0px); padding:14px 16px; height:auto;}

.arbox li h2{-webkit-line-clamp: 2;}

.arbox li p{margin-bottom:12px; -webkit-line-clamp: 3;}

.arbox li h6{position:relative; width:100%; text-align:right; right:4px; margin-bottom:4px; bottom:0px;}

}





.arbox2{width:100%;}

.arbox2 ul{ overflow:hidden;}

.arbox2 li{float: left; text-align:left; position:relative; min-height:260px;}

.arbox2 li img{ border-radius:0; }

.arbox2 li h2{font-size:20px; color:#333; line-height:1.5; margin-bottom:8px; padding:0 0 0 8px;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical; overflow:hidden;
  }


.arbox2 li h2::before {
  content: "❤";
  display: inline-block;
  margin-right:4px;
}




.arbox2 li p{font-size:16px; color:#666; line-height:1.8; margin-bottom:8px; overflow:hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 5;
    -webkit-box-orient: vertical;}

.arbox2 li h6{font-size:16px; color:#999; position:absolute; right:24px; bottom:20px; transition: all .3s;}

.arbox2 li h6:after{content:""; background-image:url('../img/paw.png'); background-repeat:no-repeat; background-position:center; background-size:16px; 
  width:16px; height:16px; display:inline-block; position:relative; padding:0px 0 0 8px; 
 vertical-align:middle; margin-top:-2px;}



.arbox2 li:nth-child(1){width:400px;}
.arbox2 li:nth-child(2){width:calc(100% - 400px); padding:20px 24px;}

@media screen and (max-width: 736px) {

.arbox2 li{min-height:auto;}
.arbox2 li:nth-child(1){width:100%}
.arbox2 li:nth-child(2){width:calc(100% - 0px); padding:14px 16px; height:auto;}

.arbox2 li h2{-webkit-line-clamp: 2; font-size:18px; margin-bottom:4px;}

.arbox2 li p{margin-bottom:8px; -webkit-line-clamp: 2;}

.arbox2 li h6{position:relative; width:100%; text-align:right; right:4px; margin-bottom:0px; bottom:0px; font-size:12px;}

}







.photo3{width:100%; overflow:hidden;}

.photo3 li:nth-child(1){width:67%; float:left; max-height:431px; overflow:hidden; border-radius:8px;}

.photo3 li:nth-child(2){width:calc(33%); float:left; padding-left:16px; padding-bottom:11px; border-radius:8px;}

.photo3 li:nth-child(3){width:calc(33%); float:left; padding-left:16px; padding-top:11px; border-radius:8px;}

.photo3 li:nth-child(4){width:100%; float:left; overflow:hidden; padding-top:16px; border-radius:8px;}


@media screen and (max-width: 736px) {


.photo3 li:nth-child(1){width:100%; margin-bottom:16px;}

.photo3 li:nth-child(2){width:calc(50%); float:left; padding-left:0px; padding-bottom:0px; padding-right:8px;}

.photo3 li:nth-child(3){width:calc(50%); float:left; padding-left:8px; padding-top:0px; }

}




.gomore{width:100%; font-size:18px; color:#888; height:40px; line-height:40px; 
        text-align:center; border-radius:8px; border:1px solid #ddd;}




.newa{ width:100%; text-align:center; }

.newa img{margin-bottom:-3px;}


@media screen and (max-width: 980px) {

.newa{max-width:100%; width:100%; padding:16px 24px; background-color:rgba(256,256,256,1); position:fixed; right:0; bottom:0; z-index:999;
box-shadow:0 -5px 5px rgba(0,0,0,0.1);}

}





#countdown{  width:100%; /*text-align:left;*/ margin-bottom:20px; }

#countdown ul{ overflow:hidden; }

#countdown ul li{display:inline-block; font-size:16px; color:#888; margin-right:2px; font-weight:bold;}

#countdown ul li span {font-size:36px; color:#f08200!important; margin-right:2px;}


@media screen and (max-width:736px) {

#countdown ul li span {font-size:26px; display:inline-block!important; }

#countdown{text-align:center; margin-bottom:16px;}

}













.splogo{max-width:160px; margin-bottom:12px; border-radius:8px;}


.noswiper-slide980{padding-top:0px; overflow:hidden;}

.noswiper-slide980 > img{border-radius:20px; margin-bottom:-3px;}

@media screen and (max-width: 980px) {


.noswiper-slide980{padding:40px 24px 0;}

}
@media screen and (max-width: 736px) {

.splogo{max-width:120px; }

.noswiper-slide980{padding:0;overflow:hidden;}
.noswiper-slide980 > img{border-radius:0px;}

}











.snowfall-flakes{ animation-iteration-count: infinite; animation-duration: 0.8s;  animation-name: swing2; opacity: 0.5;}


@keyframes swing2 {

from {
  transform: rotate3d(0, 0, 1, 30deg);
} 


  40% {
    transform: rotate3d(0, 0, 1, -10deg);
  }

  60% {
    transform: rotate3d(0, 0, 1, 20deg);
  }

  80% {
    transform: rotate3d(0, 0, 1, -5deg);
  }

  to {
    -webkit-transform: rotate3d(0, 0, 1, 0deg);
    transform: rotate3d(0, 0, 1, 0deg);
  }
}




.icongo{ width:100px; height:100px; font-size:22px; color:#fff; background-color:#f08200; text-align:center; line-height:1.2;
       margin:0 20px 20px 0; padding-top:24px; transition: all .3s; display:none;}

.icongo:hover{ margin:0 20px 32px 0; }

.icongo span{display:block;}


@media screen and (max-width: 980px) {

.icongo{ width:100%; height:auto; border-radius:8px; font-size:24px; text-align:center; line-height:1;
       margin:0 ; padding:10px 0; display:block;}
	
	.icongo:hover{ margin:0 0px 0px 0; }

.icongo span{display:initial;}

}







.demby06{width: 100%; text-align: center; padding: 28px 24px 0px; }

.demby06 img{  max-width: 980px;}

.demby06 h1{font-size: 28px; color: #444; margin: 0 0 12px; line-height: 1.5; }

.ddru{border-radius:8px 8px 0 0; margin: 0 0 -3px;}

.ddrd{border-radius:0 0 8px 8px;}

@media screen and (max-width: 736px) {



}





.albox{overflow: hidden;}

.albox > li{width: 50%; text-align: left; padding: 80px 0; float: right;}

.albox > li h2{font-size: 40px; color: #fff; font-weight: bold; margin: 0 0 12px; line-height: 1.5; text-shadow:0 0 5px rgba(0,0,0,0.5);}

.albox > li p{font-size: 24px; color: #fff; margin: 0 0 32px; line-height: 1.5; text-shadow:0 0 5px rgba(0,0,0,0.5);}

@media screen and (max-width: 736px) {

.albox > li{width: 100%; padding: 60px 0;}
.albox > li h2{font-size: 28px;}
.albox > li p{font-size: 16px;}
.albox > li:nth-child(2){display: none;}

}



.newv{max-width: 980px; margin: 0 auto 28px; border:0px solid #ddd;}
.videonewv {
position: relative;
padding-bottom: 56.25%;
border:0px solid #dfdfdf;
height: 0;
overflow: hidden;
}
.videonewv iframe, .videonewv object, .videonewv embed {
position: absolute;
top: 0;left: 0;
width: 100%;
height: 100%;}




.photo0530{max-width: 980px; margin: 0 auto 13px; }


.photo0530 > ul{overflow: hidden;}

.photo0530 > ul > li{float: left; width:calc(100% / 3 - 10px); margin:0 15px 15px 0;}

.photo0530 > ul > li img{width: 100%;  transition:all .3s; opacity: 1; border-radius: 8px 8px 0 0;}

.photo0530 > ul > li img:hover{opacity: 1; transform: scale(1);}

.photo0530 > ul > li:nth-child(3n+3){margin-right: 0;}

.photo0530 > ul > li h2{padding:4px 0; color:#666; border-radius:0 0 8px 8px; background-color: rgba(255, 250, 220, 1);  font-size:20px;}


@media screen and (max-width: 736px) {


.photo0530 > ul > li{width:100%; margin-right: 0; position:relative; border-radius: 8px; overflow:hidden;}

.photo0530 > ul > li h2{ font-size:20px; position:absolute; bottom:0px; width:152px; padding:4px 0; right:0px; z-index:2;
background-color: rgba(255, 250, 220, 1); color:#666; border-radius:8px 0 0 0;}

.lefth2{right:auto; left:0px; border-radius:0 8px 0 0!important;}

/*.photo0530 > ul > li:nth-child(2){width:calc(50% - 8px); margin-right:16px;}
.photo0530 > ul > li:nth-child(3){width:calc(50% - 8px); margin-right:0px;}*/

 .demby06 h1{font-size:26px;}


.db40{margin-bottom:40px;}

}





.shopbag{overflow:hidden; width:100%; margin-bottom:40px;}

.shopbag li{float:left; width:calc(100% / 3 - 8px); margin-right:12px; background-color:#fff; overflow:hidden; border-radius: 8px;}

.shopbag li:nth-child(3n+3){margin-right:0;}

.shopbag li img{width: 100%;  transition:all .3s; opacity: 1; border-radius: 0;}

.shopbag li:hover img{opacity: 1; transform: scale(0.95); border-radius: 8px;}

.shopbag li h3{font-size:18px; padding-top:16px; color:#000;}

.shopbag li h6{font-size:32px; padding:12px 0 16px; color:#f08200; font-weight:bold;}

.shopbag li span{font-size:24px; display:inline-block;}

.close{display:none;}

@media screen and (max-width: 980px) {


.shopbag{display:none; transition:all .3s;} 

.shopbag{ margin-bottom:12px;}


.shopbag li img{border-radius:8px;}
.shopbag li h3{font-size:16px; padding-top:12px;}
.shopbag li h6{font-size:24px; padding-top:8px; padding-bottom:0;}
.shopbag li span{font-size:16px}

.sh{font-size:20px!important; margin-bottom:8px!important; display:none;}


.close{width:28px; height:28px; text-align:center; line-height:28px; font-size:18px; color:#444; position:absolute; right:-16px; top:-16px; z-index:88;
background-color:#eee;}


}





.shopgo{width:100%; max-width:120px; height:auto; border-radius:8px; font-size:18px; text-align:center; line-height:1; margin:0px auto 16px; padding:10px 0;
color: #fff; background-color: #f08200;  transition:all .3s;}

.shopbag li:hover .shopgo{ background-color: #444; }



@media screen and (max-width: 736px) {

.shopgo{  font-size:16px; margin:8px auto 0px;  max-width:88px;}


}




.bman{width:160px; position:absolute; left:calc(50% + 120px); top:-118px; z-index:0;}

@media screen and (max-width: 736px) {

.bman{width:120px; position:absolute; left:auto; right:4px; top:-92px; z-index:-1;}

.textleftb{text-align:left!important;}


}