body {background:#fff} .banner { height: 100vh; background: url('../../Images/activity/tongmu/banner.jpg')no-repeat center; background-size:cover; } .section{position:relative;background:#fff} .section .section-title { font-size: 3rem; color: #ff7316; } .part1{padding: 10vw;} .tm-show{position:relative} .tm-show>img{width:100%} .tm-show .tm-text{ position: absolute; top: 9%; width: 14%; left: 7%; } .tm-show .desc{ position: absolute; bottom: 15%; color: #fff; left: 52%; } .desc>p{ margin-bottom:2rem; line-height:2; } .part2{padding-bottom: 7rem;} .part2 .section-title{position: absolute;left: 25%;} .part2 .desc{margin-left:50%;margin-bottom:10rem} .part2 .mapb{position:absolute;left:11%;top:-20%;} .part2 .scene-show{position:relative} .scene-show img{width:100%;} .scene-show .competition { position: absolute; width: 35%; top: 50%; left: 50%; transform: translate(-50%,-50%); } .part3 .eng{margin:5rem 0 0 10%} .competition-content { display: inline-block; vertical-align: top; margin: 5rem 10% 10rem; } .part3 .desc h3 { font-family: PingFang Heavy; margin-bottom: 3rem; } .examine .item { background: #f6f6f6; display: flex; align-items: center; margin-bottom:3rem; } .item img{width:55%} .examine .examine-content { padding-left: 10rem; } .examine-content h2{font-size:3.5rem;font-weight:900} .examine-content p{width:75%;margin:2rem 0 8rem} .examine .num{color:#ccc} .examine .num>span:nth-child(2){ display: inline-block; width: 6rem; height: 1px; background: #ccc; vertical-align: middle; } .scene{padding:8rem 0;line-height:0;font-size:0;text-align:center} .scene img{width:25rem} .scene>div:nth-child(2n+2){margin:0 1rem 1rem} .scene>div{display:inline-block;position:relative;cursor:pointer} .scene .process { position: absolute; height: 100%; width: 100%; background: rgba(0, 0, 0,.5); text-align: center; opacity: 0; top:0; font-size: 1.25rem; color: #fff; display: flex; justify-content: center; align-items: center; line-height: 1.5; } .scene>div:hover .process{opacity:1;} .product{position:relative;color:#fff} .product img{width:100%} .knowMore{color:#fff;position:absolute;bottom: 10%;left: 62%;width:max-content;min-width:5rem} .knowMore>span,.news-More>span{display:inline-block;vertical-align:middle} .knowMore:hover .arrow-line { width: 20px } .arrow-line { height: 2px; width: 0; background: #fff; transition: width 0.3s ease-in-out; -webkit-transition: width 0.3s ease-in-out; } .arrow-right { color: #fff; width: 10px; height: 10px; border-bottom: 2px solid; border-right: 2px solid; transform: rotate(-45deg); -webkit-transform: rotate(-45deg); margin-left:-13px; } .nav-wrap{display:flex;justify-content:space-around;padding:0 10% 10rem;align-items:center} .nav-item{position:relative} .nav-hover{position:absolute;top:0;left:0;opacity:0} .nav-item:hover .nav-hover{opacity:1} .part4 .section-title, .nav .section-title { padding: 10rem 25% 5rem; } .news-list{width:75%;display:flex;justify-content:space-between;margin:auto} .news-list .picture{background-size:cover;background-repeat:no-repeat;background-position:center;height:13vw} .news-list .news{width:32%} .news-content{background:#f6f6f6;padding:2rem;} .news-content h2{ font-size:1.25rem; font-weight:bold; text-overflow: ellipsis; overflow: hidden; white-space: nowrap; margin-bottom:2rem; color:#000; } .news>a{position:relative;display:block;} .cover { opacity: 0; position: absolute; width: 100%; height: 100%; background: #000; top: 0; left: 0; } .news:hover h2{text-decoration:underline} .news:hover .cover{opacity:.5} .news .news-More>span{color:#ff7316;font-weight:bold;vertical-align:middle} .news .arrow-line{background: #ff7316;} .news-More:hover .arrow-line{width:20px} .fade{opacity:0} .part5 .section-title,.part6 .section-title,.nav .section-title { padding: 10rem 25% 5rem; } .AntiFake{width:50%;margin:auto} .AntiFake h3{ font-size: 2rem; color: #e70310; margin:2rem 0 } .AntiFake>div:nth-child(2n){background:#f6f6f6} .AntiFake>div:nth-child(2n+1){background:#eee} .AntiFake img{width:40%;} .AntiFake>div{display:flex;align-items:center} .AntiFake .desc{width:60%;padding-left:10%;}