@charset "utf-8"; a:link, a:visited { color: #333; } a:hover, a:active { color: #ff0000; text-decoration: none; } a { color: #fff; } .phone { display: none; } .pc { display: block; } p { color: #666666; font-size: 14px; line-height: 26px; } p a:link, p a:visited { color: #333; } .banner img { width: 100%; margin: 0 auto; } .w1200{ width: 1200px; margin: 0 auto; overflow: hidden; } .col{ overflow: hidden; } .col.col a:hover{ color: #ff0000; } .col1{ width: 100%; height: auto; background: url(/uploads/image/mt2155images/col1-bg.jpg) no-repeat center top; padding-bottom: 34px; } .col1 .bd{ margin-top: 39px; background: url(/uploads/image/mt2155images/col1-content-bg.jpg) no-repeat center; display: block; overflow: hidden; height: 476px; box-sizing: border-box; padding: 16px 39px 16px 60px; } .col1-slider{ float: left; width: 538px; height: 403px; } .col1-slider .img-area,.col1-slider .img-area img{ width: 538px; height: 403px; } .col1-slider .slick-arrow { position: absolute; top: 50%; width: 35px; height: 60px; font-size: 0; margin-top: -22px; background: 0; border: 0; outline: 0; z-index: 99; -webkit-transition: all .3s ease-in; -o-transition: all .3s ease-in; transition: all .3s ease-in; } .col1-slider .slick-arrow.slick-next { right: 0; background: url(/uploads/image/mt2155images/a2.png) no-repeat top center; } .col1-slider .slick-arrow.slick-prev { left: 0; background: url(/uploads/image/mt2155images/a1.png) no-repeat top center; } .col1-slider .slick-dots { width: 100%; text-align: center; margin-top: 18px; } .col1-slider .slick-dots *{ display: inline-block; } .col1-slider .slick-dots li{ margin-left: 8px; } .col1-slider .slick-dots button{ width: 18px; height: 18px; font-size: 0; background: url(/uploads/image/mt2155images/i9.png) no-repeat center top; } .col1-slider .slick-dots .slick-active button{ background: url(/uploads/image/mt2155images/i8.png) no-repeat center top; } .col1-slider .img-area{ position: relative; } .col1-slider .img-area p{ position: absolute; bottom: 0; left: 0; font-size: 18px; line-height: 50px; background: url(/uploads/image/mt2155images/back.png) repeat 0 0; text-align: center; color: #fff; width: 100%; } .col1-slider.col1-slider a{ color: #fff; } /* new */ .col1 .right-side .item:first-child{ margin-top: 0; } .col1 .right-side .item{ width: 532px; height: 70px; background: url(/uploads/image/mt2155images/col1-right-item.png) no-repeat; background-size: 100% 100%; box-sizing: border-box; padding: 0 40px; margin-top: 14px; } .col1 .right-side .item h2{ line-height: 70px; font-size: 18px; font-weight: bold; text-align: left; text-overflow: ellipsis; white-space: nowrap; overflow: hidden; } .col1 .top-block{ margin: 23px auto 0; } .col1 .top-block ul{ width: 386px; margin-top: 22px; } .col1 .top-block li{ padding: 13px 0; /* border-top: 1px dashed #c2c1c1; */ /* overflow: hidden; */ } .col1 .top-block li{ display: flex; } .col1 .top-block li:first-child{ border:none } .col1 .top-block li .time{ width: 82px; height: 58px; background-color: #1c499e; box-shadow: 3px 3px 2px #9ab5e8; } .col1 .top-block .time p{ text-align: center; color: #fff; } .col1 .top-block .time p:first-child{ font-size: 24px; font-weight: bold; margin-top: 5px; } .col1 .top-block .time p:first-child p{ font-size: 14px; margin-top: 0px; } .col1 .top-block h2{ width: 310px; margin-left: 12px; font-size: 18px; line-height: 30px; font-weight: normal; } .col1 .top-block a{ color: #282828; } .col1 .col1-logo{ float: left; margin-left: 65px; margin-top: 135px; } .col1 .img-block{ margin-top: 15px; padding-bottom: 40px; } .col1 .img-block .img-area{ float: left; margin: 24px 0 0 14px; width: 379px; box-shadow: 3px 3px 3px #b0c1b5; } .col1 .img-block .img-area img{ width: 100%; border: 4px solid #d3911a; box-sizing: border-box; width: 379px; height: 212px; } .col1 .img-block .img-area p{ width: 379px; height: 79px; background-color: #9a6813; padding:8px 13px; box-sizing: border-box; font-size: 20px; line-height: 30px; color: #fff; overflow: hidden; text-align: left; } .col1 .img-block .img-area:first-child,.col1 .img-block .img-area:first-child .img-area .img-area .img-area{ margin-left: 0; } /* end */ .col1 .right-side{ float: right; width: 532px; height: auto; /* border: 1px solid #6a88bf; box-sizing: border-box; padding: 12px; */ } .col1 .right-side .news-block{ overflow: hidden; } .col1 .news-block h2{ font-size: 23px; font-weight: bold; text-align: center; } .col1 a{ color: #1c499e; } .col1 .news-block ul{ width: 280px; float: left; margin-top: 10px; } .col1 .news-block li{ font-size: 17px; line-height: 32px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; background: url(/uploads/image/mt2155images/li.png) no-repeat left 12px; text-indent: 15px; } .col1 .right-side .line{ border: 1px dashed #1c499e; margin: 22px auto; } .col2{ background: url(/uploads/image/mt2155images/col2-bg.jpg) no-repeat center top; height: 802px; } .col2 .hd{ margin-top: 50px; width: 100%; text-align: center; } .col2 .hd *{ display: inline-block; } .col2 .hd span{ width: 57px; height: 20px; background-color: #5a7aaa; border-radius: 35px; line-height: 20px; text-align: center; color: #fff; font-size: 14px; } .col2-slider{ margin-top: 42px; } .col2 .w1200{ width: 1230px; } .col2-slider .img-area{ float: left; width: 385px; margin: 30px 0 0 24px; } .col2-slider .img-area img{ width: 385px; height: 217px; } .col2-slider .img-block{ width: 1200px; } .col2-slider .img-area{ position: relative; } .col2-slider .img-area p{ width: 100%; background-color: #1f2e45; font-size: 18px; line-height: 35px; text-align: center; color: #fff; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; } .col2-slider .slick-dots { width: 100%; text-align: center; margin-top: 28px; } .col2-slider .slick-dots *{ display: inline-block; margin:0 2px; } .col2-slider .slick-dots button { font-size: 0; border: 0; outline: 0; background: #3171b2; display: inline-block; width: 12px; height: 12px; border-radius: 50%; } .col2-slider .slick-dots .slick-active button{ background-color: #fff; } .col3{ height: 808px; background: url(/uploads/image/mt2155images/col3-bg.jpg) no-repeat center top; background-size: 100% 100%; } .col3 .hd{ margin-top: 30px; width: 100%; text-align: center; } .col3 .hd *{ display: inline-block; } .col3 .hd span{ width: 57px; height: 20px; background-color: #5a7aaa; border-radius: 35px; line-height: 20px; text-align: center; color: #fff; font-size: 14px; } .col3 .bd{ margin-top: 62px; background-color: #6c819c; box-sizing: border-box; padding: 0 28px; overflow: hidden; } .col3 .block{ margin-top: 44px; overflow: hidden; width: 555px; } .col3 .block .img-area{ position: relative; width: 555px; height: 314px; } .col3 .block .img-area img{ width: 100%; height: 314px; } .col3 .block .img-area i{ position: absolute; top: 0; left: 22px; width: 52px; height: 56px; background: url(/uploads/image/mt2155images/col3-1.png) no-repeat center top; text-align: center; color: #1c499e; font-weight: bold; line-height: 50px; font-size: 27px; font-style: normal; } .col3 .block .img-area p{ position: absolute; bottom: 0; left: 0; font-size: 24px; line-height: 50px; background: url(/uploads/image/mt2155images/back.png) repeat 0 0 ; text-align: center; color: #fff; width: 100%; } .col3 .block:first-child{ float: left; } .col3 .block:first-child .block{ float: right; } .col3 .block ul{ margin: 12px 0 13px 0; } .col3 .block li{ font-size: 22px; line-height: 48px; background: url(/uploads/image/mt2155images/i1.png) no-repeat left 16px; text-indent: 25px; } .col3 .block li a{ color: #fff; } .col3 .block li:hover{ background: url(/uploads/image/mt2155images/i3.png) no-repeat left 16px; } .col3 .block li:hover a{ color: #ff0000; } .col4{ height: 696px; background: url(/uploads/image/mt2155images/col4-bg.jpg) no-repeat center top; } .col4 .hd{ margin-top: 57px; position: relative; padding-bottom: 20px; border-bottom: 1px solid #1c499e; } .col4 .hd a *{ display: inline-block; } .col4 .hd p{ font-size: 24px; margin-left: -29px; color: #1c499e; } .col .hd span.more{ width: 57px; height: 20px; background-color: #5a7aaa; border-radius: 35px; line-height: 20px; text-align: center; color: #fff; font-size: 14px; } .col4 .hd span{ position: absolute; bottom: 10px; right: 0; } .col .hd span.more:hover{ background-color: #1c499e; } .col4 .bd{ margin-top: 33px; overflow: hidden; } .col4 .left-side{ float: left; } .col4 .left-side .img-area{ position: relative; width: 385px; height: 215px; border: 3px solid #1c499e; box-sizing: border-box; } .col4 .left-side .img-area img{ width: 100%; height: 209px; } .col4 .left-side .img-area p{ position: absolute; bottom: 3px; left: 0; width: 100%; font-size: 16px; line-height: 35px; text-align: center; color: #fff; } .col4 .left-side ul{ width: 385px; margin-top: 15px; } .col4 .left-side li{ font-size: 16px; line-height: 36px; background: url(/uploads/image/mt2155images/i4.png) no-repeat left 12px; text-indent: 25px; } .col4 .left-side li:hover{ background: url(/uploads/image/mt2155images/i5.png) no-repeat left 12px; } .col4 .left-side a{ color: #1c499e; } .col4 .right-side{ float: left; width: 815px; position: relative; margin-top: -16px; } .col4 .right-side .img-area{ width: 248px; float: left; margin: 16px 0 0 23px; padding-bottom: 10px; border-bottom: 1px solid #5d7fb9; } .col4 .right-side .img-area img{ width: 248px; height: 139px; border: 3px solid #1c499e; box-sizing: border-box; } .col4 .right-side .img-area p{ min-height: 56px; font-size: 18px; line-height: 28px; margin-top: 10px; color: #1c499e; } .col5col6{ height: 892px; background: url(/uploads/image/mt2155images/col56-bg.jpg) no-repeat center top; } .col5col6 .w1200{ margin-top: 70px; } .col5col6 .left-side{ float: left; margin-left: 28px; width: 742px; overflow: hidden; } .col5col6 .hd{ position: relative; overflow: hidden; padding-bottom: 10px; border-bottom: 1px solid #8392a4; margin-top: 20px; } .col5col6 .hd span.more{ position: absolute; right: 0; bottom: 6px; background-color: #1f2e45; } .col5col6 .bd{ margin-top: 10px; } .col5col6 .img-block{ padding: 22px 0; display: flex; border-top: 2px solid #fff; } .col5col6 .img-block:first-child{ border-top: none; } .col5col6 .img-block .img-area,.col5col6 .img-block .img-area img{ width: 293px; height: 166px; } .col5col6 .img-block .text-area{ width: 426px; margin-left: 20px; } .col5col6 .img-block .text-area h2{ font-size: 20px; font-weight: bold; margin-top: 12px; } .col5col6 .img-block .text-area p{ margin-top: 15px; font-size: 16px; line-height: 26px; } .col5col6 .img-block .text-area span{ margin-top: 15px; font-size: 16px; display: inline-block; float: right; } .col5col6 .img-block .text-area span i{ display: inline-block; margin-left: 5px; margin-top: 5px; width: 15px; height: 15px; background: url(/uploads/image/mt2155images/i2.png) no-repeat center top; } .col5col6 a,.col5col6 p,.col5col6 h2,.col5col6 span{ color: #fff; } .col5col6 p a{ color: #ff0000; } .col5col6 .right-side{ float: right; width: 360px; margin-right: 27px; } .col5col6 .right-side ul{ margin-top: 28px; } .col5col6 .right-side li{ font-size: 16px; line-height: 40px; background: url(/uploads/image/mt2155images/i6.png) no-repeat left 12px; text-indent: 15px; border-bottom: 1px solid #929aa5; color: #fff; } .col5col6 .right-side li:hover{ background: url(/uploads/image/mt2155images/i7.png) no-repeat left 12px; } .col5col6 .right-side li:last-child{ border-bottom: none; } .footer-area{ height: 100px; background-color: #c1d6e7; overflow: hidden; width: 100%; text-align: center; } .footer-area span{ display: inline-block; line-height: 100px; font-size: 14px; color: #1c499e; margin-left: 60px; } .footer-area i{ position: relative; top: 12px; display: inline-block; width: 40px; height: 38px; margin-right: 10px; } .footer-area span:first-child i{ background: url(/uploads/image/mt2155images/f-1.png) no-repeat center top; } .footer-area span:first-child span i{ background: url(/uploads/image/mt2155images/f-2.png) no-repeat center top; } .footer-area span:first-child span span i{ background: url(/uploads/image/mt2155images/f-3.png) no-repeat center top; } @media screen and (max-width:768px) { .pc{ display: none; } .phone{ display: block; } .banner,.banner img{ width: 100%; } .col{ height: auto; overflow: hidden; background: none; background-color: #c1d6e7; } .col .bd,.col .hd{ margin-top: 10px; } .col .left-side,.col .right-side{ width: 100%; height: auto; padding: 0; margin: 10px 0; } .col .hd img{ width: 60%; } .col .hd span.more{ margin-top: 10px; } .w1200,.col .w1200{ width: auto; margin: 10px; } .col1-slider,.col1-slider .img-area,.col1-slider .img-area img,.img-area,.img-area img,.col.col .img-area,.col.col .img-area img{ width: 100%; height: auto; margin: 0; } .col.col .img-area p{ font-size: 16px; line-height: 40px; } .img-area p{ text-align: center; font-size: 16px; line-height: 36px; } .col1 .right-side{ width: auto; padding:10px 5px; } .col2-slider{ margin-top: 10px; } .col3 .bd{ width: auto; padding: 5px; } .col3 .block{ width: 100%; margin-top: 10px; } .col4 .hd p{ margin-left: 0; } .col5col6{ background-color: #4e637d; } .footer-area{ height: auto; } .footer-area span{ line-height: 30px; margin: 5px 0; } /* new */ .col1{ padding-bottom: 0 } .col1 .bd{ width: 100%; padding: 0.5rem; height: auto; } .col1 .right-side .item,.col1 .right-side{ width: 100%; } .col1 .right-side{ padding: 0; margin-top:1rem; } .col1 .right-side .item{ height: auto; padding: 0 1.5rem; } .col1 .right-side .item h2{ font-size: 16px; line-height: 40px; } .col1 .top-block{ width: 100%; height: auto; margin: 0; padding: 5px; box-sizing: border-box; } .col1 .top-block ul{ width: 100%; margin: 0; } .col1 .col1-logo { width: 100%; margin: 15px 0; } .col1 .col1-logo img { margin: 0 auto; display: block; } .col1-slider .img-area, .col1-slider .img-area img{ height: 16rem!important; } .col1-slider .slick-arrow{ margin-top: 0; transform: translatey(-50%); } }