@charset "utf-8";

#banner{width:100%; height:100%; position:relative; z-index:1; left:0; top:0; background: #000;}
#banner .swiper-container{height:100%; position: relative; z-index: 1;}
#banner .swiper-wrapper{height:100%;}
#banner .swiper-slide{width:100%; height:100%;}
#banner .swiper-slide>div.img{width:100%; height:100%; position:absolute; z-index:1; left:0; top:0; background-size:cover; background-position:center top; background-repeat:no-repeat; transition:transform 15s;}
#banner .swiper-slide>div.con{position:absolute; z-index:3; left:0; right: 0; top:39%; text-align: center;}
#banner .swiper-slide h1{color:#fff; font-size:6.7rem; display:block; margin:0; transform:translateY(100px); opacity:0;transition:all .5s ease;}
#banner .swiper-slide h1>span{color: #ec0000;}
#banner .swiper-slide p{color:#fff; font-size:2.8rem; font-weight:300; margin-top:4rem; transform:translateY(100px); opacity:0;transition:all .5s ease; font-family: 'Microsoft Jhenghei', 'Microsoft YaHei'; padding-left: 15px; padding-right: 15px;}
#banner .swiper-slide.normal>div.con h1{transform:translateY(0px); opacity:1; transition:all .8s;}
#banner .swiper-slide.normal>div.con p{transform:translateY(0px); opacity:1; transition:all .8s .2s;}

#banner .swiper-pagination{bottom: 80px;}
#banner .swiper-pagination-bullet{width: 10px; height: 10px; margin:0 6px; opacity:1; background:#fff; transition:all .25s;}
#banner .swiper-pagination-bullet-active{opacity:1; background:#ec0000;}

#banner .ani-container{position: relative; z-index: 2; top: 35.566%;}
#banner .ani-container>p.up-near{margin-top: 12px !important;}
#banner .ani-container.center{text-align: center;}
#banner .ani-container>p.up-far{margin-top: 25px !important;}

#banner .scroll-tip-container{width: 100px; position: absolute; z-index: 2; left: 50%; bottom: 110px; margin-left: -50px;}
#banner .scroll-tip{width: 18px; height: 29px; border: 2px solid rgba(255,255,255, .5); position: relative; border-radius: 12px; margin: auto;}
#banner .scroll-tip:after{content:''; display:block; width:2px; height:4px; background:rgba(255,255,255,.5); position:absolute; left:50%; top:5px; margin-left:-1px; animation:mouse-middle .86s ease infinite;}
@keyframes mouse-middle{
  0% {opacity:.8;}
  50% {opacity:1; top:15px; height:7px;}
  100% {opacity:0; top:28px; height:4px;}
}
#banner .arrow{text-align: center; margin-top: 6px;}
#banner i{color: #fff; font-size: 1.5rem; opacity: .6;}
#banner .tip{color: #fff; opacity: .6; font-family: 'Microsoft Jhenghei', 'Microsoft YaHei'; text-align: center; transform: scale(.78); margin-top: 5px;}

@media (max-width:1366px){
  #banner .swiper-slide h1{font-size:6rem;}
  #banner .swiper-slide p{font-size:2.6rem;}
}
@media (max-width:1279px){
  #banner .swiper-slide>div.con{top: 43%;}
  #banner .swiper-slide h1{font-size:2.6rem;}
  #banner .swiper-slide p{font-size:1.6rem; line-height: 1.5; margin-top:1.8rem;}

  #banner .swiper-pagination{bottom: 20px;}
  #banner .swiper-pagination-bullet{width: 8px; height: 8px; margin:0 5px;}

  #banner .scroll-tip-container{bottom: 45px;}
}


#m1{width: 100%; height: 0; padding-bottom: 25%; background: #f1f0f0; margin-top: 60px;}
#m1 .left{width: 50%; height: 0; padding-bottom: 25%; background: #d90000; float: left; position: relative;}
#m1 .left .tit{color: #fff; font-size: 5.6rem; margin: 60px 0 0 50px; font-weight: bold;}
#m1 .left .desc{color: #fff; font-weight: 300; margin: 40px 0 0 50px; width: 65%;}
#m1 .left .desc p{line-height: 2; margin-bottom: 16px; font-size: 1.6rem;}
#m1 .left .go{margin: 30px 0 0 50px;}
#m1 .left .go>a{color: #fff;}
#m1 .left .go>a>i{font-size: 4rem; transition: all .25s;}
#m1 .left .go>a:hover>i{opacity: .8; margin-left: 10px;}
#m1 .left .ico{position: absolute; right: 10px; bottom: 10px;}
#m1 .left .ico>i{font-size: 32rem; color: #fff; opacity: .4;}

#m1 .right{width: 50%; height: 0; padding-bottom: 20%; float: right;}
#m1 .right .l{width: 50%; height: 0; padding-bottom: 50%; float: left; position: relative; overflow: hidden;}
#m1 .right .l>a{display: block; width: 100%; height: 100%; background: #222 url('../img/factory01.jpg') no-repeat center/cover; position: absolute; top: 0; transition: all .45s;}
#m1 .right .l>a::before{position: absolute; content: ''; display: block; width: 100%; height: 100%; background: rgba(0,0,0,.3); left: 0; top: 0; transition: all .35s;}
#m1 .right .l>a:hover{transform: scale(1.08);}
#m1 .right .l>a:hover::before{background: rgba(0,0,0,.0);}
#m1 .right .r{width: 50%; height: 0; padding-bottom: 50%; float: right; position: relative;}
#m1 .right .r .tit{font-size: 4.8rem; margin: 60px 0 0 50px; color: #2b2b2b;}
#m1 .right .r .desc{font-weight: 300; margin: 40px 50px 0 50px;}
#m1 .right .r .desc p{line-height: 2; margin-bottom: 16px; font-size: 1.6rem;}
#m1 .right .go{margin: 30px 0 0 50px;}
#m1 .right .go>a{color: #2b2b2b;}
#m1 .right .go>a>i{font-size: 4rem; transition: all .25s;}
#m1 .right .go>a:hover>i{color: #ec0000; margin-left: 10px;}
#m1 .right .r .ico{position: absolute; right: 10px; bottom: 20px;}
#m1 .right .r .ico>i{font-size: 18rem; color: #ddd;}

@media (max-width:1440px){
  #m1 .left .tit{font-size: 5.2rem;}
  #m1 .left .desc{margin: 35px 0 0 50px;}
  #m1 .left .desc p{font-size: 1.5rem;}
  #m1 .left .ico>i{font-size: 24rem;}
  #m1 .right .r .tit{font-size: 4.2rem;}
  #m1 .right .r .desc{margin: 35px 50px 0 50px;}
  #m1 .right .r .desc p{font-size: 1.5rem;}
  #m1 .right .r .ico>i{font-size: 13rem;}
}
@media (max-width:1366px){
  #m1 .left .tit{font-size: 4.6rem; margin: 50px 0 0 30px;}
  #m1 .left .desc{margin: 30px 0 0 30px;}
  #m1 .left .go{margin: 25px 0 0 30px;}
  #m1 .left .ico>i{font-size: 20rem;}
  #m1 .right .r .tit{font-size: 3.6rem; margin: 50px 0 0 30px;}
  #m1 .right .r .desc{margin: 30px 30px 0 30px;}
  #m1 .right .r .desc p{font-size: 1.5rem;}
  #m1 .right .r .ico>i{font-size: 13rem;}
  #m1 .right .go{margin: 25px 0 0 30px;}
}
@media (max-width:1279px){
  #m1{margin-top: 0; height: auto; padding-bottom: 0;}
  #m1 .left{width: 100%; height: auto; padding: 45px 20px; float: none; box-sizing: border-box;}
  #m1 .left .tit{font-size: 4rem; margin: 0;}
  #m1 .left .desc{color: #fff; font-weight: 300; width: 100%; margin: 0; padding: 30px 0 0 0; box-sizing: border-box;}
  #m1 .left .go{margin: 25px 0 0 0;}
  #m1 .left .ico>i{font-size: 13rem;}

  #m1 .right{width: 100%; height: auto; padding-bottom: 0; float: none;}
  #m1 .right .l{width: 100%; padding-bottom: 50%; float: none;}
  #m1 .right .r{width: 100%; height: auto; padding-bottom: 40px; float: none;}
  #m1 .right .r .tit{font-size: 3.2rem; margin: 45px 0 0 20px;}
  #m1 .right .r .desc{margin: 30px 20px 0 20px;}
  #m1 .right .r .ico>i{font-size: 10rem;}
  #m1 .right .go{margin: 25px 0 0 20px;}
}


#m2{width: 100%; height: 0; padding-bottom: 25%; background: #262626;}
#m2 .left{width: 50%; height: 0; padding-bottom: 25%; float: left; position: relative;}
#m2 .left .l{width: 50%; height: 0; padding-bottom: 50%; float: left; background: #ddd; position: relative;}
#m2 .left .l .tit{font-size: 4.8rem; margin: 60px 0 0 50px; color: #2b2b2b;}
#m2 .left .l .desc{font-weight: 300; margin: 40px 50px 0 50px;}
#m2 .left .l .desc p{line-height: 2; margin-bottom: 16px; font-size: 1.6rem;}
#m2 .left .go{margin: 30px 0 0 50px;}
#m2 .left .go>a{color: #2b2b2b;}
#m2 .left .go>a>i{font-size: 4rem; transition: all .25s;}
#m2 .left .go>a:hover>i{color: #ec0000; margin-left: 10px;}
#m2 .left .l .ico{position: absolute; right: 15px; bottom: 10px;}
#m2 .left .l .ico>i{font-size: 13rem; color: #fff; opacity: .6;}

#m2 .left .r{width: 50%; height: 0; padding-bottom: 50%; float: right; position: relative; overflow: hidden;}
#m2 .left .r>a{display: block; width: 100%; height: 100%; background: #222 url('../img/factory02.jpg') no-repeat center/cover; position: absolute; top: 0; transition: all .45s;}
#m2 .left .r>a::before{position: absolute; content: ''; display: block; width: 100%; height: 100%; background: rgba(0,0,0,.3); left: 0; top: 0; transition: all .35s;}
#m2 .left .r>a:hover{transform: scale(1.08);}
#m2 .left .r>a:hover::before{background: rgba(0,0,0,.0);}

#m2 .right{width: 50%; height: 0; padding-bottom: 25%; float: right; position: relative;}
#m2 .right .tit{color: #fff; font-size: 5.6rem; margin: 60px 0 0 50px; font-weight: bold;}
#m2 .right .desc{color: #fff; font-weight: 300; margin: 40px 0 0 50px; width: 65%;}
#m2 .right .desc p{line-height: 2; margin-bottom: 16px; font-size: 1.6rem;}
#m2 .right .go{margin: 30px 0 0 50px;}
#m2 .right .go>a{color: #fff;}
#m2 .right .go>a>i{font-size: 4rem; transition: all .25s;}
#m2 .right .go>a:hover>i{opacity: .8; margin-left: 10px;}
#m2 .right .ico{position: absolute; right: 10px; bottom: 10px;}
#m2 .right .ico>i{font-size: 24rem; color: #fff; opacity: .3;}

@media (max-width:1440px){
  #m2 .left .l .tit{font-size: 4.2rem;}
  #m2 .left .l .desc{margin: 35px 50px 0 50px;}
  #m2 .left .l .desc p{font-size: 1.5rem;}
  #m2 .left .l .ico>i{font-size: 11rem;}
  #m2 .right .tit{font-size: 5.2rem;}
  #m2 .right .desc{margin: 35px 0 0 50px;}
  #m2 .right .desc p{font-size: 1.5rem;}
  #m2 .right .ico>i{font-size: 20rem;}
}
@media (max-width:1366px){
  #m2 .left .l .tit{font-size: 3.6rem; margin: 50px 0 0 30px;}
  #m2 .left .l .desc{margin: 25px 30px 0 30px;}
  #m2 .left .go{margin: 20px 0 0 30px;}
  #m2 .left .l .ico>i{font-size: 10rem;}
  #m2 .right .tit{font-size: 4.6rem; margin: 50px 0 0 35px;}
  #m2 .right .desc{margin: 30px 0 0 35px;}
  #m2 .right .go{margin: 30px 0 0 35px;}
  #m2 .right .ico>i{font-size: 16rem;}
}
@media (max-width:1279px){
  #m2{width: 100%; height: auto; padding-bottom: 0;}
  #m2 .left{width: 100%; height: auto; padding-bottom: 0; float: none;}
  #m2 .left .l{width: 100%; height: auto; padding-bottom: 40px; float: none; overflow: hidden;}
  #m2 .left .l .tit{font-size: 3.2rem; margin: 50px 0 0 20px;}
  #m2 .left .l .desc{margin: 30px 20px 0 20px;}
  #m2 .left .go{margin: 30px 0 0 20px;}
  #m2 .left .l .ico>i{font-size: 10rem;}

  #m2 .left .r{width: 100%; padding-bottom: 50%; float: none;}

  #m2 .right{width: 100%; height: auto; padding-bottom: 40px; float: none;}
  #m2 .right .tit{font-size: 4rem; margin: 50px 0 0 20px;}
  #m2 .right .desc{margin:0; padding: 30px 20px; width: 100%; box-sizing: border-box;}
  #m2 .right .go{margin: 0 0 0 20px;}
  #m2 .right .ico>i{font-size: 11rem;}
}


#m3{margin: 60px; padding: 80px 50px 20px 50px; overflow-x: hidden;}
#m3 .left{width: 45%; float: left;}
#m3 .tit{font-size: 6.8rem; color: #2b2b2b;}
#m3 .desc{font-size: 1.7rem; font-weight: 300; margin-top: 40px;}
#m3 .desc p{line-height: 2; margin-bottom: 20px;}
#m3 .more{margin-top: 40px;}
#m3 .more a{color: #ec0000; font-size: 1.9rem; display: inline-block;}
#m3 .more a>i{font-size: 4.2rem; vertical-align: middle; margin-left: 13px; position: relative; bottom: 3px;}
#m3 .more a:hover{color: #333;}
#m3 .right{width: 55%; float: right; text-align: right; position: relative; top: -50px;}
#m3 .right img{width: 80%;}

@media (max-width:1440px){
  #m3{margin: 60px auto; padding: 60px 50px 60px 50px;}
  #m3 .right{top: 0px;}
}
@media (max-width:1366px){
  #m3{margin: 30px auto;}
}
@media (max-width:1279px){
  #m3{margin: 55px 20px 0 20px; padding: 0;}
  #m3 .left{width: 100%; float: none;}
  #m3 .tit{font-size: 4rem;}
  #m3 .desc{font-size: 1.5rem; margin-top: 30px;}
  #m3 .more{margin-top: 30px;}
  #m3 .more a{font-size: 1.6rem;}
  #m3 .more a>i{font-size: 3.2rem; margin-left: 10px;}
  #m3 .right{width: 100%; float: none; top: -70px;}
  #m3 .right img{width: 60%;}
}


#m4{width: 100%; height: 100%; background: #2f2f2f; overflow-x:hidden;}
#m4 .left{width: 50%; height: 100%; float: left; background: url('../img/m4_left.jpg') no-repeat center/cover;}
#m4 .left .tit{color: #fff; font-size: 6.8rem; margin: 120px 0 0 100px; color: #fff;}
#m4 .left .desc{color: #fff; font-weight: 300; font-size: 1.7rem; margin: 50px 0 0 100px; width: 70%; box-sizing: border-box;}
#m4 .left .desc>p{line-height: 2; margin-bottom: 20px;}
#m4 .more{margin: 60px 0 0 100px;}
#m4 .more a{color: #ec0000; font-size: 1.9rem; display: inline-block;}
#m4 .more a>i{font-size: 4.2rem; vertical-align: middle; margin-left: 13px; position: relative; bottom: 3px;}
#m4 .more a:hover{color: #fff;}

#m4 .right{width: 50%; height: 100%; float: right; background: #ccc;}
#m4 .right .top{height: 50%; background: #d90000;}
#m4 .right .top .desc{padding: 120px 0 0 100px; color: #fff; font-size: 3rem; font-weight: 300; width: 90%; box-sizing: border-box;}
#m4 .right .top .desc a{color: #fff; display: inline-block; margin-right: 10px; margin-bottom: 2rem; padding-bottom: 4px; transition: all .2s; border-bottom: 1px solid rgba(255,255,255,0);}
#m4 .right .top .desc a:hover{opacity: .8; border-bottom: 1px solid rgba(255,255,255,1);}
#m4 .right .top .desc2{padding: 20px 0 0 100px; color: #fff; font-size: 1.7rem; font-weight: 300; width: 90%; box-sizing: border-box; line-height: 2; opacity: .8;}

#m4 .right .btm{height: 50%;}
#m4 .right .btm .l{width: 50%; height: 100%; float: left; position: relative; overflow: hidden;}
#m4 .right .btm .l>a{display: block; width: 100%; height: 100%; background: #222 url('../img/m4_r_1.jpg') no-repeat center/cover; position: absolute; top: 0; transition: all .45s;}
#m4 .right .btm .l>a::before{position: absolute; content: ''; display: block; width: 100%; height: 100%; background: rgba(0,0,0,.3); left: 0; top: 0; transition: all .35s;}
#m4 .right .btm .l>a:hover{transform: scale(1.08);}
#m4 .right .btm .l>a:hover::before{background: rgba(0,0,0,.0);}

#m4 .right .btm .r{width: 50%; height: 100%; float: left; position: relative; overflow: hidden;}
#m4 .right .btm .r>a{display: block; width: 100%; height: 100%; background: #222 url('../img/m4_r_2.jpg') no-repeat center/cover; position: absolute; top: 0; transition: all .45s;}
#m4 .right .btm .r>a::before{position: absolute; content: ''; display: block; width: 100%; height: 100%; background: rgba(0,0,0,.3); left: 0; top: 0; transition: all .35s;}
#m4 .right .btm .r>a:hover{transform: scale(1.08);}
#m4 .right .btm .r>a:hover::before{background: rgba(0,0,0,.0);}

@media (max-width:1440px){
  #m4 .left .tit{font-size: 6.6rem; margin: 120px 0 0 80px;}
  #m4 .left .desc{font-size: 1.6rem; margin: 50px 0 0 80px;}
  #m4 .more{margin: 60px 0 0 80px;}

  #m4 .right .top .desc{padding: 120px 0 0 70px;}
  #m4 .right .top .desc2{padding: 20px 0 0 70px; font-size: 1.6rem;}
}
@media (max-width:1366px){
  #m4 .left .tit{font-size: 5.6rem; margin: 100px 0 0 50px;}
  #m4 .left .desc{font-size: 1.5rem; margin: 50px 0 0 50px;}
  #m4 .more{margin: 50px 0 0 50px;}
  #m4 .more a{font-size: 1.7rem;}
  #m4 .more a>i{font-size: 3.4rem; margin-left: 10px;}

  #m4 .right .top .desc{padding: 100px 0 0 50px; font-size: 2.4rem;}
  #m4 .right .top .desc2{padding: 20px 0 0 50px; font-size: 1.5rem;}
}
@media (max-width:1279px){
  #m4{height: auto;}
  #m4 .left{width: 100%; height: auto; float: none; overflow: hidden; padding-bottom: 50px;}
  #m4 .left .tit{font-size: 4rem; margin: 60px 0 0 20px;}
  #m4 .left .desc{margin: 0; padding: 30px 20px 0 20px; width: 100%; box-sizing: border-box;}
  #m4 .more{margin: 30px 0 0 20px;}
  #m4 .more a{font-size: 1.6rem;}
  #m4 .more a>i{font-size: 3.2rem; margin-left: 10px;}

  #m4 .right{width: 100%; height: auto; float: none;}
  #m4 .right .top{height: auto; padding-bottom: 50px;}
  #m4 .right .top .desc{padding: 50px 20px 0 20px; font-size: 2rem; width: 100%;}
  #m4 .right .top .desc2{padding: 10px 0 0 20px;}

  #m4 .right .btm{height: 50%;}
  #m4 .right .btm .l{width: 50%; height: 0; padding-bottom: 50%;}
  #m4 .right .btm .r{width: 50%; height: 0; padding-bottom: 50%;}
}


#m5{margin-top: 60px;}
#m5 a{display: block; width: 20%; height: 0; padding-bottom: 16%; float: left; overflow: hidden; position: relative; z-index: 1;}
#m5 a::before{content:''; display: block; width: 100%; height: 100%; position: absolute; left: 0; top: 0; background: rgba(0,0,0,.4); z-index: 2; opacity: 0; transition: all .6s;}
#m5:hover a::before{opacity: 1;}
#m5 a::after{content: ''; display: block; width: 100%; height: 100%; position: absolute; left: 0; top: 0; background: rgba(200,0,0,.85); z-index: 3; opacity: 0; transition: all .6s;}
#m5 a>p{width: 100%; height: 100%; position: absolute; z-index: 1; background-size: cover; background-position: center;}
#m5 a>span{display: flex; flex-direction: column; justify-content: center; align-items: center; position: absolute; left: 0; top: 30px; width: 100%; height: 100%; z-index: 4; color: #fff; font-size: 2.4rem; font-family: 'Microsoft Jhenghei', 'Microsoft YaHei'; opacity: 0; transition: all .45s;}
#m5 a:hover::before{opacity: 0;}
#m5 a:hover::after{opacity: 1;}
#m5 a:hover>span{opacity: 1; top: 0;}
#m5 a>div{width: 100%; height: 100%; background: #d90000; position: absolute; z-index: 4; display: flex; flex-direction: column; justify-content: center;}
#m5 a>div .cn{font-size: 6.6rem; color: #fff; font-family: 'Microsoft Jhenghei', 'Microsoft YaHei'; text-align: center;}
#m5 a>div .en{font-size: 4rem; color: #fff; font-family: 'Microsoft Jhenghei', 'Microsoft YaHei'; text-align: center; margin-top: 12px; opacity: .3;}

@media (max-width:1440px){
  #m5 a>span{font-size: 2.2rem;}
  #m5 a>div .cn{font-size: 5rem;}
  #m5 a>div .en{font-size: 3rem;}
}
@media (max-width:1366px){
  #m5 a>span{font-size: 2.1rem;}
  #m5 a>div .cn{font-size: 4.8rem;}
  #m5 a>div .en{font-size: 2.9rem;}
}
@media (max-width:1279px){
  #m5{margin-top: 60px;}
  #m5 a{width: 33.33333%; height: 0; padding-bottom: 24%;}
  #m5 a>div .cn{font-size: 2.6rem;}
  #m5 a>div .en{font-size: 1.6rem;}
}


#m6{margin-top: 60px; height: 610px;}
#m6 .left{width: 50%; height: 100%; float: left; background: #1c1c1c; overflow: hidden;}
#m6 .left>a{display: block; width: 100%; height: 100%; position: relative;}
#m6 .left>a .bg{width: 100%; height: 100%; position: absolute; left: 0; top: 0; background: url('../img/m6_left.jpg') no-repeat center/cover; z-index: 1; transition: all .3s;}
#m6 .left>a::after{content: ''; display: block; width: 100%; height: 100%; position: absolute; left: 0; top: 0; z-index: 2; background: rgba(0,0,0,.4); transition: all .3s;}
#m6 .left>a .tit{color: #fff; font-size: 6rem; position: absolute; left: 100px; top: 80px; z-index: 3;}
#m6 .left>a .desc{color: #fff; font-size: 1.7rem; position: absolute; left: 100px; top: 180px; z-index: 3; line-height: 2;}
#m6 .left>a:hover .bg{transform: scale(1.07);}
#m6 .left>a:hover::after{background: rgba(0,0,0,.3);}

#m6 .right{width: 50%; height: 100%; float: right; background: #d90000; padding: 80px 100px; box-sizing: border-box;}
#m6 .right>.tit{font-size: 2.8rem; color: #fff;}

#m6 .right .list{margin-top: 50px; border-top: 1px solid rgba(255,255,255,.3); padding-top: 40px;}
#m6 .right .list>a{display: block; color: #fff; font-family: 'Microsoft Jhenghei', 'Microsoft YaHei'; overflow: hidden; transition: all .35s; margin-bottom: 40px;}
#m6 .right .list>a:hover{opacity: .9;}
#m6 .right .list>a .tit{font-size: 2rem; position: relative; padding-left: 15px; transform: translateX(-15px); transition: all .36s;}
#m6 .right .list>a .tit::before{content: ''; display: block; width: 5px; height: 5px; position: absolute; left: 0; top: 8px; background: #fff;}
#m6 .right .list>a:hover .tit{transform: translateX(0);}
#m6 .right .list>a .desc{font-size: 1.5rem; margin-top: 20px; line-height: 1.7;}
#m6 .right .more{margin-top: 40px; border-top: 1px solid rgba(255,255,255,.3); padding-top: 25px;}
#m6 .right .more>a{color: #fff; font-size: 1.6rem; font-weight: 300; transition: all .2s;}
#m6 .right .more>a>i{font-size: 2.6rem; vertical-align: middle; margin-left: 1rem; position: relative; top: -2px;}
#m6 .right .more>a:hover{opacity: .8;}

@media (max-width:1440px){
  #m6 .left>a .tit{left: 80px;}
  #m6 .left>a .desc{font-size: 1.6rem; left: 80px; padding-right: 80px;}

  #m6 .right{padding: 80px;}
}
@media (max-width:1366px){
  #m6 .left>a .tit{font-size: 5.6rem; left: 50px; top: 80px;}
  #m6 .left>a .desc{font-size: 1.6rem; left: 50px; top: 170px;}
}
@media (max-width:1279px){
  #m6{height: auto;}
  #m6 .left{width: 100%; height: auto; float: none;}
  #m6 .left>a{width: 100%; height: auto; position: relative;}
  #m6 .left>a .bg{width: 100%; height: 100%; position: absolute; left: 0; top: 0; background: url('../img/m6_left.jpg') no-repeat center/cover; z-index: 1; transition: all .3s;}
  #m6 .left>a::after{content: ''; display: block; width: 100%; height: 100%; position: absolute; left: 0; top: 0; z-index: 2; background: rgba(0,0,0,.4); transition: all .3s;}
  #m6 .left>a .tit{font-size: 4rem; position: relative; left: 0; top: 0; padding: 50px 20px 0 20px;}
  #m6 .left>a .desc{font-size: 1.5rem; position: relative; left: 0; top: 0; padding: 30px 20px 50px 20px;}

  #m6 .right{width: 100%; height: auto; float: none; padding: 50px 20px;}
  #m6 .right>.tit{font-size: 2.6rem;}

  #m6 .right .list{margin-top: 30px; padding-top: 30px;}
  #m6 .right .list>a{margin-bottom: 30px;}
  #m6 .right .list>a .tit{font-size: 1.8rem;}
  #m6 .right .list>a .desc{font-size: 1.4rem;}
  #m6 .right .more{margin-top: 40px; padding-top: 25px;}
}




