/* reset */
body { background: #222; line-height: 22px;}
a, a:hover { color: #FFF; }
::selection {background-color: #FFE100;color: #000;}
.clear { clear: both; }
 #video5s::-webkit-media-controls {
 display:none !important;
}
.mask_div { position: fixed; width: 100%; height: 100%; background: #000; opacity: 0.95; filter: alpha(opacity=95); z-index: 9998; left: 0; top: 0; display: none; }
.mask_div1 { position: fixed; width: 100%; height: 100%; background: #000; opacity: 0.85; filter: alpha(opacity=85); z-index: 9998; left: 0; top: 0; display: none; cursor: pointer }
.pop_qr { position: fixed; width: 320px; height: 400px; left: 50%; top: 50%; margin-left: -160px; margin-top: -200px; z-index: 9999; color: #FFF; display: none; }
.pop_qr p { line-height: 80px; text-align: center; font-size: 20px; }
.pop_video { position: fixed; width: 1000px; height: 563px; left: 50%; top: 50%; margin-left: -500px; margin-top: -300px; z-index: 9999; background: #FEE100; display: none; border:1px solid #666; }
.pop_video * { position: absolute; }
.pop_video .pop_close { width: 50px; height: 50px; position: absolute; right: -50px; top: -50px; overflow: hidden; text-indent: -9999px; background: url(../images/pop_close.png) 0 0 no-repeat; cursor: pointer; }
.pop_video .pop_text { width: 1000px; height: 50px; position: absolute; bottom: -50px; left: 0; overflow: hidden; text-align: center; color: #E5E5E5; font-size: 18px; line-height: 50px; }
#flash30 { display: none; }
#flash15 { display: none; }
#flash2018_90s { display: none; }
#flash2018_30s { display: none; }
#flash2018_winter_30s { display: none; }
#main{background: #FEFCE5; overflow: hidden; color: #000}
/*LAYOUT*/
#head { position: fixed; height: 55px; left: 0; top: 0; z-index: 1000; width: 100%; opacity: 0; }
#headbox{background: url(../images/top2bg.png); max-width: 1920px; margin: 0 auto; position: relative; box-shadow: 1px 1px 6px rgba(0,0,0,0.45)}
#head .logo2 { position: absolute; left: 0; top: 0; width: 260px; height: 72px; }
#head .menu { width: 100%; height: 55px; text-align: center; }
#head .menu a { display: inline-block; margin: 10px 0; line-height: 35px; padding: 0 30px; color: #FFF; opacity: 0.75; }
#head .menu a:hover { color: #FEE100; opacity: 1; }
#head .menu a.act { border: 1px solid #FFF; border-radius: 35px; opacity: 1 }
#share2 { height: 32px; position: absolute; top: 12px; right: 60px; color: #FFF; font-size: 12px; z-index: 10; }
#share2 .text { width: 64px; height: 32px; display: inline-block; vertical-align: middle; line-height: 32px; opacity: .75 }
#share2 .weixin { width: 32px; height: 32px; display: inline-block; background: url(../images/shareweixin.png); vertical-align: middle; margin-right: 20px; opacity: .75; overflow: hidden; text-indent: -9999px; }
#share2 .weibo { width: 32px; height: 32px; display: inline-block; background: url(../images/shareweibo.png); vertical-align: middle; opacity: .75; overflow: hidden; text-indent: -9999px; }
#share2 a:hover { opacity: 1; }
#share2 .shareqr { z-index: 11; position: absolute; right: -8px; top: 30px; width: 150px; height: 200px; display: none; }
#page1 { width: 100%; height: 100%; background:#000; position: relative; min-width: 1200px; overflow: hidden }
#p1_mask {width: 100%;}
#p1_mask img{width: 100%;}
#logo { width: 258px; height: 50px; position: absolute; left: 0; top: 50px; background: url(../images/logo.png) no-repeat; display: block; text-indent: -9999px; overflow: hidden; z-index: 10; }
#share { height: 32px; position: absolute; top: 60px; right: 60px; color: #FFF; font-size: 12px; z-index: 10; }
#share .text { width: 64px; height: 32px; display: inline-block; vertical-align: middle; line-height: 32px; opacity: .65 }
#share .weixin { width: 32px; height: 32px; display: inline-block; background: url(../images/shareweixin.png); vertical-align: middle; margin-right: 20px; opacity: .65; overflow: hidden; text-indent: -9999px; }
#share .weibo { width: 32px; height: 32px; display: inline-block; background: url(../images/shareweibo.png); vertical-align: middle; opacity: .65; overflow: hidden; text-indent: -9999px; }
#share a:hover { opacity: 1 }
#share .shareqr { z-index: 11; position: absolute; right: -8px; top: 30px; width: 150px; height: 200px; display: none; }
#v_content { width: 100%; position: absolute; overflow: hidden; z-index: 1; left: 0; top: 0; }

#videoplay{width:230px; height:130px; position:fixed; right:0; z-index:999;}
		
#play { width: 30%; text-align: center; height: 360px; position: absolute; z-index: 11; margin-top: -180px; top: 50%; left: 50%; margin-left: -15%; }
#play .slogan { margin: 0 auto;}
#play .slogan img{max-width: 100%;}
#play .btn { width: 235px; height: 50px; background: url(../images/play.png) 0 0 no-repeat; display: block; margin: 0 auto; display: block; overflow: hidden; text-indent: -9999px; transition:none; }
#play .btn:hover { background: url(../images/play.png) 0 -50px no-repeat;  }
#videomore { text-align: left; margin: 0 auto; }
#videomore .v1 { color: #FFF; text-align: center; margin: 30px 0; }
#videomore .v2 { width: 200px; height: 34px; float: left; background: url(../images/img2.png) 0 0 no-repeat; color: #fff; margin-left: 20px; line-height: 34px; margin-bottom: 5px; cursor: pointer; text-indent: 50px; }
#videomore .v3 { width: 200px; height: 34px; float: left; background: url(../images/img2.png) 0 0 no-repeat; color: #fff; margin-left: 20px; line-height: 34px; cursor: pointer; text-indent: 50px; }
#videomore .v2:hover, #videomore .v3:hover { background: url(../images/img2.png) 0 -34px no-repeat; color: #000 }
#up_con { width: 100%; bottom: 50px; z-index: 10; position: absolute; text-align: center; cursor: pointer; }
#up_con .uptext { height: 40px; margin: 0 auto; text-align: center; font-size: 12px; color: #FFF; opacity: 0.65 }
#up_con .upicon { width: 60px; height: 28px; background: url(../images/up.png) center center no-repeat; margin: 0 auto; }


.roll{overflow:hidden;height:150px;position:relative;letter-spacing:1px;top:-8px;left:0}
.roll ul{position:relative}
.roll li{width:100%;margin:0 auto;position:absolute;left:0;-webkit-transition:all .3s;-moz-transition:all .3s;-ms-transition:all .3s;-o-transition:all .3s;transition:all 2s; padding:12px; font-size:20px;list-style:none; color: #FFF; }
.roll li a{position:relative;color:#fff;padding-right:200px;-webkit-transition:all .3s;-moz-transition:all .3s;-ms-transition:all .3s;-o-transition:all .3s;transition:all .3s;text-decoration:none}
.roll li a .time{position:absolute;right:0}
.roll li.roll_1{opacity:.3; top:0;-webkit-transform:scale(0.4);-moz-transform:scale(0.4);-ms-transform:scale(0.4);-o-transform:scale(0.4);transform:scale(0.4)}
.roll li.roll_2{opacity:.6; top:20px;-webkit-transform:scale(0.8);-moz-transform:scale(0.8);-ms-transform:scale(0.8);-o-transform:scale(0.8);transform:scale(0.8)}
.roll li.roll_3{opacity:1; top:50px;-webkit-transform:scale(1);-moz-transform:scale(1);-ms-transform:scale(1);-o-transform:scale(1);transform:scale(1);height:48px; font-weight: 800;letter-spacing: 2px;}
.roll li.roll_4{opacity:.6; top:80px;-webkit-transform:scale(0.8);-moz-transform:scale(0.8);-ms-transform:scale(0.8);-o-transform:scale(0.8);transform:scale(0.8)}
.roll li.roll_5{opacity:.3; top:100px;-webkit-transform:scale(0.4);-moz-transform:scale(0.4);-ms-transform:scale(0.4);-o-transform:scale(0.4);transform:scale(0.4)}
.roll li.roll_hide{opacity:0; top:150px;-webkit-transform:scale(0.2);-moz-transform:scale(0.2);-ms-transform:scale(0.2);-o-transform:scale(0.2);transform:scale(0.4)}

.rtcslogan{height: 340px; padding-top: 40px; position: relative; background: #FFE100; text-align: center;}
.rtcslogan .slogantext{width: 720px; height: 140px; position: relative; margin: 0 auto; }
.rtcslogan .slogantext h1,.rtcslogan .slogantext h2{width: 720px; height: 140px; display: block; position: absolute; left: 0; top: 0; text-indent: -9999px; overflow: hidden; text-align: left;}
.rtcslogan .slogantext .slogan1{background: url(../images/slogan1.png) center center no-repeat; }
.rtcslogan .slogantext .slogan2{background: url(../images/slogan2.png) center center no-repeat; }
.rtcslogan .slogantext .slogan3{background: url(../images/slogan3.png) center center no-repeat; }
.rtcslogan .intro{width: 1200px; height: 300px; position: absolute; bottom: -150px; left: 50%; margin-left: -600px;background: url(../images/img1.jpg) center center no-repeat; box-shadow: 2px 2px 8px rgba(0,0,0,0.35)}
.rtcslogan .intro .borderbox{border:1px solid #fff; width: 1100px; height: 200px; overflow: hidden; margin: 50px auto;}
.rtcslogan .intro .borderbox p{padding: 60px 40px; color: #FFF; text-align: left; font-size: 20px; line-height: 40px; text-shadow: 0 0 3px rgba(0,0,0,0.75)}
.aboutslogan{height: 800px; width: 1200px; overflow: hidden; margin:250px auto 0px auto; position: relative;}
.aboutslogan .rtcnews{width: 600px; padding:150px 60px 0 170px; height:650px; background: #EAEBD4; position: absolute; right: 0; top: 0; z-index: 0;}
.aboutslogan .about1{position: absolute; left: 0; top: 50%; margin-top: -250px; z-index: 1;}
.aboutslogan .rtcnews h1{font-size: 48px; font-weight: 800; color: #000; line-height: 120%; letter-spacing: 2px;}
.aboutslogan .rtcnews span{font-size: 36px;}
.aboutslogan .rtcnews .text{ margin-top:45px;  }
.aboutslogan .rtcnews .text p{font-size: 16px; line-height: 180%; text-indent: 32px;margin-bottom: 32px; text-align: justify;}

.aboutslogan .rtcnews2{width: 600px; padding:150px 170px 0 60px; height:650px; background: #EAEBD4; position: absolute; left: 0; top: 0; z-index: 0;}
.aboutslogan .about2{position: absolute; right:0; top: 50%; margin-top: -250px; z-index: 1;}

.drivemyway{height: 300px; overflow: hidden; position: relative; background: #141923;}
.drivemyway .movebg{left: 0; top: 0; width: 3841px; height: 300px; animation: drivemywayBGmove 240s infinite linear; animation-delay: 3s; background:url(../images/movebg.jpg) center center no-repeat;}
@keyframes drivemywayBGmove {  
  0% {
  transform: translateX(0px);
  }
  50% {
  transform: translateX(-1920px);
  }
   100% {
  transform: translateX(0px);
  }
}
.drivemyway .textbg{position: absolute; height: 300px; top: 0; left: 50%; margin-left: -600px; width: 1200px; background:url(../images/drivemyway.png) center center no-repeat; opacity: 0.35}

.morevideos{background:url(../images/bigbg.jpg) bottom center no-repeat; height: 3200px;}
.morevideos .bigfont{font-size: 64px; color: #FFE100; line-height: 100px; font-weight: 800; text-align: center; padding: 50px; letter-spacing: 4px;}
.morevideos .line{margin-bottom: 90px;}
.morevideos .container{width: 1200px; margin: 0 auto;}
.morevideos .itemleft,.morevideos .itemright{height: 360px; position: relative; margin-bottom: 200px;}
.morevideos .itemleft .textcontainer{position: absolute; left: 0; top: 0; height: 360px; width: 540px; z-index: 1}
.morevideos .itemleft .videos{position: absolute; right: 0; top: 0; width: 640px; height: 360px; z-index: 0}
.morevideos .itemright *{text-align: right;}
.morevideos .itemright .textcontainer{position: absolute; right: 0; top: 0; height: 360px; width: 600px; z-index: 1}
.morevideos .itemright .videos{position: absolute; left: 0; top: 0; width: 640px; height: 360px; z-index: 0}
.morevideos .number,.morevideos .english{font-size: 84px; font-style: italic; font-weight: 800; font-family:Arial black; }
.morevideos .number{line-height: 90px; font-size:120px;text-shadow: 1px 1px #FFF,-1px -1px #FFF,1px -1px #FFF,-1px 1px #FFF; color: #020815;}
.morevideos .english{line-height: 90px;color: #FFF; letter-spacing: 4px;}
.morevideos .text{font-size: 20px; font-weight: 800; color: #FFF}
.morevideos .slogan{margin-top: 50px;}
.morevideos .slogan div{height: 60px; text-align: left; text-indent: -9999px; overflow: hidden;}
.morevideos .slogan .sl01{background:url(../images/sl01.png) top left no-repeat; }
.morevideos .slogan .sl02{background:url(../images/sl02.png) top left no-repeat; }
.morevideos .slogan .sl03{background:url(../images/sl03.png) top right no-repeat; }
.morevideos .slogan .sl04{background:url(../images/sl04.png) top right no-repeat; }
.morevideos .slogan .sl05{background:url(../images/sl05.png) top left no-repeat; }
.morevideos .slogan .sl06{background:url(../images/sl06.png) top left no-repeat; }
.morevideos .slogan .sl07{background:url(../images/sl07.png) top right no-repeat; }
.morevideos .slogan .sl08{background:url(../images/sl08.png) top right no-repeat; }
.morevideos .slogan .sl09{background:url(../images/sl09.png) top left no-repeat; }
.morevideos .slogan .sl10{background:url(../images/sl10.png) top left no-repeat; }

.tyres{height: 600px; width: 1200px; overflow: hidden; margin:0 auto;}
.tyres .bigfont{font-size: 64px; color: #000; line-height: 80px; font-weight: 800; text-align: center; padding: 50px; letter-spacing: 4px;}
.tyres .tyrecard{position: relative; width: 380px; float: left;}
.tyres .tyrecardmid{margin: 0 30px;}
.tyres .listtitle{background:url(../images/tyrelist.png) left center no-repeat; background-size: 20px;  text-indent: 30px; font-weight: 800; font-size: 20px; line-height: 36px; color: #000; margin-bottom: 15px;}
.tyres .more{ width: 110px; height: 32px; line-height: 32px; border-radius: 32px; background: #FFE100; display: block; color: #000; text-decoration: none; text-align: center; box-shadow: 1px 1px 2px rgba(0,0,0,0.3); letter-spacing: 1px; position: absolute; right: 5px; top: 0;}
.tyres .more:hover{background: #f90; color: #FFF}
.tyres .more span{font-family: '宋体'; padding-left: 12px;}

.techbox{height: 400px; background:url(../images/bg-3.jpg) center center no-repeat;}
.techbox .container{width: 1200px; height: 400px; margin: 0 auto; position: relative;}
.techbox .container .techlogo{position: absolute; right:0; top: 90px;}
.techbox .container .techmore{position: absolute; right:110px; top: 290px; font-size: 20px; letter-spacing: 2px; text-align: center; width: 250px; display: block; text-decoration: underline;}
.techbox .container .techmore:hover{color: #ffe100;}
.techbox .container .yellowlink{width: 580px; height: 100px; border: 4px solid #ffe100; border: 4px solid rgba(255,225,0,1); font-size: 32px; line-height: 100px; position: absolute; left: 0; border-radius: 10px; text-indent: 160px; color: #FFE100}
.techbox .container .yellowlink:hover{text-decoration: none;  border: 4px solid rgba(255,225,0,0.45);}
.techbox .container .link1{top: 65px; background:url(../images/sericon.png) 70px center no-repeat;}
.techbox .container .link1:hover{background:url(../images/sericon.png) 70px center no-repeat rgba(255,225,0,0.1);}
.techbox .container .link2{top: 225px; background:url(../images/shopicon.png) 70px center no-repeat;}
.techbox .container .link2:hover{background:url(../images/shopicon.png) 70px center no-repeat rgba(255,225,0,0.1);}

.aboutbox{height: 300px; padding: 80px 0; background: #EEEEEE;}
.aboutbox .container{width: 1200px;margin: 0 auto; }
.aboutbox .container img{float: left; width: 575px; height: 300px;}
.aboutbox .container .intro{float: right;height: 300px; width: 520px;}
.aboutbox .container .intro h3{font-size: 36px; line-height: 1.5; text-align: center; margin-bottom: 20px;}
.aboutbox .container .intro p{text-indent: 32px; font-size: 16px; color: #000; margin-bottom: 10px;}
.aboutbox .container .intro a{width: 250px; font-size: 16px; height: 36px; line-height: 36px; border-radius: 36px; background: #FFE100; display: block; color: #000; text-decoration: none; text-align: center; box-shadow: 1px 1px 2px rgba(0,0,0,0.3); letter-spacing: 1px; margin:36px auto 0 auto;}
.aboutbox .container .intro a:hover{background: #f90; color: #FFF}