/* 引入字体 */ @font-face { font-family:"SourceHanSansSC-Regular"; src: url(../fonts/SourceHanSansSC-Regular.otf); } @font-face { font-family:"HelveticaExt-Normal"; src: url(../fonts/HelveticaExt-Normal.ttf); } @font-face { font-family:"SourceHanSansSC-Heavy"; src: url(../fonts/SourceHanSansSC-Heavy.otf); } @font-face { font-family:"SourceHanSerifSC-Bold"; src: url(../fonts/SourceHanSerifSC-Bold.otf); } @font-face { font-family:"HelveticaNeueLT-BoldOutline"; src: url(../fonts/HelveticaNeueLT-BoldOutline.otf); } @font-face { font-family:"Helvetica"; src: url(../fonts/Helvetica.ttf); } @font-face { font-family:"HYa3gj"; src: url(../fonts/HYa3gj.ttf); } @font-face { font-family:"AlibabaSans-Light"; src: url(../fonts/AlibabaSans-Light.otf); } /* 头部 */ .header{ height: 80px; background-color: #FFFFFF; position: fixed; left: 0; top: 0; z-index: 999; } .header .head{ display: flex; justify-content: flex-start; align-items: center; } /* logo */ .logo{ width: 198px; height: 78px; margin: 0 6px 0 60px; } .logo img{ width: 100%; } .logo span{ display: block; font-size: 18px; line-height: 1.5; opacity: .7; } /* 股票代码 */ .stock{ width: 120px; font-size: 14px; line-height: 1.5; color: #e65802; margin-right: 60px; } /* 语言 */ .language{ display: flex; justify-content: space-between; align-items: center; width: 90px; height: 80px; padding: 0 5px; margin-right: 20px; } .language img:first-child{ width: 25px; height: 25px; } .language img:last-child{ width: 11px; height: 7px; } /* 搜索 */ .search{ display: flex; justify-content: center; align-items: center; width: 88px; height: 80px; background-color: #0094da; } /* 导航 */ .nav{ width: calc(100% - 642px); height: 80px; display: flex; justify-content: flex-start; } .nav>li{ height: 80px; margin-right: 40px; transition: all .8s; } .nav>li>a{ display: block; padding: 0 2px; line-height: 60px; margin-top: 10px; border-bottom: 2px solid #FFFFFF; transition: all .8s; } .nav>li.active>a{ border-bottom: 2px solid #0094da; transition: all .8s; } .nav>li:hover>a{ color: #0094da; transition: all .8s; } .nav>li.active:hover>a{ color: #262626; } /* 二级导航 */ .nav-sub{ display: none; } .nav>li:hover .nav-sub{ display: flex; justify-content: space-between; width: 100%; background-color: rgba(255,255,255,.9); position: fixed; top: 80px; left: 0; z-index: 999; } .nav-sub .sub-left{ width: 27%; padding: 20px 0 20px calc( 27% - 200px); background-color: rgba(219,222,226,.7); } .nav-sub .sub-left span{ display: block; width: 100%; line-height: 58px; padding: 0 12px; border-bottom: 1px solid #e9ecef; font-size: 20px; cursor: pointer; transition: all .8s; } .nav-sub .sub-left span.cur{ background-color: #2d5899; color: #FFFFFF; transition: all .8s; } .nav-sub .sub-right{ width: 73%; padding: 20px calc(73% - 1160px) 20px 80px; overflow: hidden; } .nav-sub .sub-right>span{ display: none; overflow: hidden; } .nav-sub .sub-right span>a{ width: 20%; font-size: 16px; line-height: 2.5; float: left; transition: all .8s; } .nav-sub .sub-right span>a:hover{ color: #2d5899; transition: all .8s; } /* 二级导航 */ .nav-son{ display: none; } .nav>li:hover .nav-son{ display: block; width: 100%; padding: 20px calc(50% - 640px); background-color: rgba(255,255,255,.9); position: fixed; left: 0; top: 80px; z-index: 999; } .son-top{ font-family: 'SourceHanSansSC-Regular'; padding-top: 39px; background-image: url(../images/text.png); background-size: 385px 75px; background-repeat: no-repeat; background-position: left center; font-size: 36px; line-height: 1.5; margin-top: 20px; } .son-bottom{ display: flex; justify-content: flex-start; flex-wrap: wrap; margin: 28px 0 46px; } .son-bottom a{ width: 14.28%; font-size: 20px; line-height: 1.4; border-left: 3px solid #92a4bc; padding-left: 10px; margin-top: 20px; } .nav-bg{ display: none; } .head .head-btn{ display: none; width: 20px; float: right; position: relative; cursor: pointer; margin-top: 5px; z-index: 999;} .head .head-btn i{ display: block; width: 100%; height: 2px; float: left; background-color: #262626; border-radius: 50px; transition: all .5s ease 0s; -webkit-transition: all .5s ease 0s; -moz-transition: all .5s ease 0s; } .head .head-btn i.bar-top{ margin-top: 0;} .head .head-btn i.bar-cen{ margin-top: 5px;} .head .head-btn i.bar-bom{ margin-top: 5px;} .head .head-btn.cur i{background-color: #262626;} .head .head-btn.cur i.bar-cen{ opacity: 0;} .head .head-btn.cur i.bar-top{ -webkit-transform:rotate(45deg) translate(5px, 5px);transform:rotate(45deg) translate(5px, 5px);} .head .head-btn.cur i.bar-bom{ -webkit-transform: rotate(-45deg) translate(5px, -5px);transform: rotate(-45deg) translate(5px, -5px);} /* 轮播样式 */ .banner-swiper { overflow-x: hidden; height: 819px; position: relative; background-color: #FFFFFF; margin-top: 80px; } .banner-swiper .swiper-slide { position: relative; display: flex; justify-content: center; align-items: center; flex-direction: column; } .banner-title{ width: 100%; color: #FFFFFF; position: absolute; left: 0; top: 36%; text-align: center; z-index: 1; } .banner-title h2{ width: 100%; font-family: "SourceHanSansSC-Heavy"; font-size: 56px; line-height: 1.2; font-weight: normal; text-transform: uppercase; } .banner-title p{ font-family: 'HelveticaExt-Normal'; font-size: 48px; } .banner-title span{ display: block; width: 40%; margin: 20px auto 0; font-size: 18px; line-height: 1.5; letter-spacing: 2px; text-transform: uppercase; } /* 分页器 */ .banner-swiper .swiper-container-horizontal>.swiper-pagination-bullets, .banner-swiper .swiper-pagination-custom, .banner-swiper .swiper-pagination-fraction{ font-size: 16px; font-weight: bold; color: #fff !important; bottom: 27px; } /* 指示点默认样式 */ .banner-swiper .swiper-pagination-bullet { width: 20px; height: 20px; line-height: 20px; font-size: 16px; color: rgba(255,255,255,.6); background-color: rgba(0,0,0,0); border-radius: 0; margin: 0 12px; font-weight: bold; overflow: hidden; opacity: 1; } .swiper-container-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet-active{ width: 105px; background-color: rgba(0,0,0,0); color: rgba(255,255,255,1); } .swiper-container-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet-active>em{ display: block; float: left; } .banner-swiper .swiper-pagination-bullet>ins{ display: block; width: 0; height: 1px; margin-top: 9px; background-color: #FFFFFF; float: right; } .swiper-container-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet-active>ins{ width: 80px; transition: all .8s; } .banner-swiper .swiper-pagination-bullet:last-child ins{ float: left; } .banner-swiper .swiper-pagination-bullet:last-child em{ float: right; } /* 首页 */ @media screen and (max-width:1690px){ .w1690{ width: 94%; } } @media screen and (max-width:1580px){ } @media screen and (max-width:1440px){ } @media screen and (max-width:1340px){ } @media screen and (max-width:1280px){ } @media screen and (max-width:1180px){ } @media screen and (max-width:1080px){ } @media screen and (max-width:980px){ /* 头部 */ .header{ height: 70px; background-color: rgba(255,255,255,1); } .head{ width: 92%; height: 70px; } .logo h1{ font-size: 20px; } .logo span{ font-size: 13px; } .head .head-btn{ display: block; margin: 0; } .head .nav{ display: block; width: 38vw; height: 100vh; background-color: #FFFFFF; position: fixed; padding-top: 70px; top: 0px; right: -38vw; z-index: 999; transition: all .6s; } .head .nav.active{ right: 0; transition: all .6s; } .head .nav-bg{ width: 100vw; height: 100vh; background-color: rgba(0,0,0,0.5); position: fixed; top: 0; left: 0; z-index: 200; transition: all .6s; } .head .nav-bg.active{ display: block; opacity: 1; transition: all .6s; } .head .nav li{ margin: 0; padding: 0; height: auto; } .head .nav li>a{ width: 100%; font-size: 15px; margin: 0; padding: 0; line-height: 60px; text-align: center; } .head .nav li.active>a{ font-weight: normal; border: 0; color: #FFFFFF; } .pull-item li>a{ padding: 0 20px; font-size: 15px; } .pull-item-02 li>a{ padding: 0 15px; font-size: 14px; } .pull-item-03 li>a{ padding: 0 12px; font-size: 14px; text-align: center; } .banner-swiper{ width: 100%; height: 400px; margin-top: 70px; } .pull-item.pull-item-fixed{ top: 70px; } .memorabili{ padding: 30px 0 40px; } .memorabili-txt .swiper-slide{ width: 100% !important; margin: 0; padding: 0; } .memorabili-txt{ padding: 0; } .memorabili-txt .swiper-slide:nth-of-type(2n){ margin-top: 0; padding: 0; } .memorabili-txt .swiper-slide strong{ margin: 10px 0 0 0; } .memorabili-txt .swiper-slide p{ font-size: 14px; line-height: 2; } .memorabili-swiper .swiper-button-prev, .memorabili-swiper .swiper-button-next, .memorabili-txt .line, .memorabili-txt .swiper-slide em{ display: none; } .banner-title p{ font-size: 27px; } .pull-swiper{ height: 360px; } .index-news-information{ flex-wrap: wrap; } .index-news, .index-information{ width: 100%; } .index-information{ margin-top: 20px; } .index-about-bottom li p{ padding: 0 10%; } .news-list li, .news-list li:nth-of-type(3n){ width: 49%; margin-right: 2%; } .news-list li:nth-of-type(2n){ margin-right: 0; } .news>h1{ font-size: 22px; } .preview .swiper-slide{ height: 115px; overflow: hidden; } .preview .swiper-slide img{ min-height: 115px; } .preview .swiper-slide-thumb-active img{ min-height: 101px; } .enterprise-txt p{ padding: 0 15%; } .join-list li>div:nth-of-type(1){ padding: 10px 0 10px 20px; align-items: center; } .join-list li.active>div:nth-of-type(2){ padding: 0 10px 20px; } .join-list li>div:nth-of-type(1)>span{ display: -webkit-box; -webkit-line-clamp: 2; word-break: break-all; overflow: hidden; text-overflow: ellipsis; -webkit-box-orient: vertical; } .join-list li>div>span, .join-item-first>strong{ line-height: 1.8 !important; } } @media screen and (max-width:780px){ /* banner */ .banner-swiper{ width: 100%; height: 280px; margin-top: 70px; } .banner-title{ width: 80%; left: 10%; top: 28%; } .pull-banner-title{ top: 40%; } @keyframes pullBanner { from {top: 80%;} to {top: 40%;} } .banner-title h2{ font-size: 30px; } .banner-title p{ font-size: 16px; } .banner-title span{ font-size: 12px; } .index-news-information{ flex-wrap: wrap; margin-top: 25px; } .index-news-first{ padding: 10px; } .index-news{ width: 100%; flex-wrap: wrap; } .index-news-all{ margin-top: 12px; } .index-news>div{ width: 100%; } .left-img{ height: 254px; overflow: hidden; } .left-img img{ min-height: 254px; } .index-news-right{ margin-top: 20px; } .index-title ins{ font-size: 50px; } .index-title-item{ margin-bottom: 8px; } .index-title-item li{ font-size: 16px; } .index-news-first>a{ flex-wrap: wrap; } .index-news-first>a>div{ width: 100%; } .index-news-first{ height: auto; } .first-img{ width: 100%; height: 235px; margin-bottom: 15px; overflow: hidden; } .first-img img{ width: 100%; min-height: 235px; } .index-news-list li>a{ width: 83%; } .index-news-list li>a::before{ width: 4px; height: 4px; margin: 13px 6px 0 0 ; } .index-information{ width: 100%; margin-top: 15px; } .index-information-title, .index-information-list{ padding: 0 15px; } .index-business{ margin-top: 25px; height: 500px; } .index-business-list li{ height: 500px; } .index-business-list li img{ min-height: 500px; } .index-business-txt{ width: 86%; top: 13%; transform: translate(-50%,-10%); } .ndex-business-title h3{ font-size: 30px; } .ndex-business-title span{ font-size: 16px; } .index-business-item{ height: 70px; } .index-business-item li>img{ width: 30px; height: 30px; margin-top: 10px; } .index-business-item li>p{ font-size: 12px; display: block; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; } .index-about{ margin-top: 25px; padding: 10px; position: relative; margin-bottom: 25px; } .index-about-top{ flex-wrap: wrap; } .index-about-top>div{ width: 100%; } .index-about-right{ position: absolute; right: 10px; top: 20px; } .index-about-right img{ width: auto; height: 45px; } .form-top>span{ width: 100%; } .form-top>span input{ width: calc(100% - 115px); } .form-top>span em{ width: 110px; margin-top: 10px; } .corporate-name{ margin-top: 10px; } .index-about-left .more{ margin: 20px auto 0; } .index-about-bottom{ flex-wrap: wrap; margin-top: 10px; } .index-about-bottom>li{ width: 100%; margin: 10px 0; padding: 25px 0; } .index-about-bottom li p{ padding: 0 10%; } .foot{ flex-wrap: wrap; padding: 20px 10px; } .foot>div{ width: 100%; } .foot-left>p{ font-size: 13px; } .foot-left>p>span{ display: block; } .foot-left>span{ font-size: 13px; margin: 20px 0; } .links{ width: 100%; height: 36px; } .links .links-item{ top: 0; transform: translateY(-100%); } .links:hover .links-item{ height: auto; padding: 10px 15px; border-top: none; border-bottom: 1px solid rgba(255,255,255,.8); } .links p{ line-height: 36px; } .links p>img{ transform:rotate(180deg); -ms-transform:rotate(180deg); /* IE 9 */ -moz-transform:rotate(180deg); /* Firefox */ -webkit-transform:rotate(180deg); /* Safari 和 Chrome */ -o-transform:rotate(180deg); /* Opera */ } .links:hover p>img{ transform:rotate(0); -ms-transform:rotate(0); /* IE 9 */ -moz-transform:rotate(0); /* Firefox */ -webkit-transform:rotate(0); /* Safari 和 Chrome */ -o-transform:rotate(0); /* Opera */ } .foot-right{ max-width: 100%; } .follow{ margin-top: 20px; } .section{ padding: 25px 0; } .abstract-txt p, .speech-txt p{ margin-top: 15px; } .abstract-txt img{ max-width: 90%; margin: 30px auto; } .team-list .team-item{ width: 100%; margin: 0 0 20px 0; } .team-swiper{ padding-bottom: 30px; } .organization-img{ margin-top: 20px; } .organization-img img{ width: 98%; } .index-business-txt p{ font-size: 15px; line-height: 2; text-align: justify; } .pull-title h3{ font-size: 26px; } .pull-title span{ font-size: 14px; } .pull-item.pull-item-fixed{ top: 70px; } .news-list li, .news-list li:nth-of-type(3n){ width: 100%; margin-right: 0; } .news-img{ height: 238px; overflow: hidden; } .news-img img{ min-height: 238px; } .pase-size{ flex-wrap: wrap; justify-content: center; } .pase-size a{ width: 25px; line-height: 25px; font-size: 13px; margin: 0 3px; } .pase-size a:first-child, .pase-size a:last-child{ padding: 0 5px; } /* .pase-size a:nth-of-type(n+7){ display: none; } .pase-size a:last-child{ display: block; } */ .pull-swiper{ height: 240px; } .news>h1{ font-size: 18px; } .news-page{ flex-wrap: wrap; } .news-page>a{ width: 100%; margin: 5px 0; } .news-page>a ins, .news-page>a span{ display: none; } .page-title{ width: 100%; } .news-page>a:nth-of-type(1) p::before{ content: "上一篇:"; width: 80px; } .news-page>a:nth-of-type(2) p::before{ content: "下一篇:"; width: 80px; } .news-page .next{ justify-content: flex-start; } .news-page .next .page-title{ text-align: left; } .business-img{ flex-wrap: wrap; margin-bottom: 0; } .area-list li p{ margin-top: 12px; } .view{ width: 100%; } .preview{ width: 100%; margin: 10px 0 0 0; } .preview .swiper-wrapper{ flex-wrap: nowrap; } .preview .swiper-slide{ height: 84px; overflow: hidden; } .preview .swiper-slide img{ min-height: 84px; } .preview .swiper-slide-thumb-active img{ min-height: 74px; } .preview-arrow{ display: none; } .area-list li{ width: 100%; } .area-list li .more{ margin-top: 60px; } .area-list li{ padding: 30px 18px; } .area-list li:nth-of-type(odd){ background-color: #FFFFFF; } .area-list li:nth-of-type(even){ background-color: rgba(255,255,255,0); } .inspect-list li{ padding: 20px 10px; } .inspect-time{ width: 72px; padding-right: 10px; } .inspect-txt{ width: calc(100% - 90px); } .enterprise-list li{ flex-wrap: wrap; } .enterprise-list li>div{ width: 100%; } .inspect-list li:hover .inspect-img .inspect-list li:hover .inspect-txt{ display: none; } .enterprise-list{ margin-bottom: 0; } .news-bg{ padding-bottom: 30px; } .news-detail-bg{ padding-bottom: 0; } .news-page{ padding: 20px 0; margin-top: 25px; } .pase-size{ margin-top: 30px; } .enterprise-img{ height: 205px; } .enterprise-img img{ min-height: 205px; } .enterprise-txt{ height: auto; padding: 20px 0 5px; } .enterprise-txt p{ padding: 0 10%; } .team-list-other{ padding: 5px 10px 15px; } .team-style-swiper .swiper-slide p{ padding: 5px 10px; font-size: 14px; } .social-list-dxtc li{ margin-top: 30px; } .social-list-dxtc li>a{ flex-wrap: wrap; } .social-list-dxtc li>a>div{ width: 100%; } .social-img{ height: 238px; } .social-img img{ min-height: 238px; } .social-txt{ padding: 10px; } .social-txt h4{ font-size: 18px; } .social-txt p{ -webkit-line-clamp:3 } .guide-list li{ padding: 20px 10px; } .information-content{ flex-wrap: wrap; margin-bottom: 0; } .information-content>div{ width: 100%; } .information-img img{ width: 100%; margin-top: 30px; } .contact-content{ padding: 15px 10px; } .contact-top li{ display: flex; justify-content: space-between; align-items: center; width: 100%; padding: 15px 10px; margin: 0; border: 0; } .contact-top li>span{ width: 50px; height: 50px; margin: 0; } .contact-top li>img{ margin-bottom: 8px; } .contact-top li>p{ width: calc(100% - 60px); font-size: 14px; text-align: justify; word-break: break-all; } .contact-top li:last-child{ margin-bottom: 12px; } .contact-top li:last-child>img{ margin: 0; } .contact-top li:last-child>p{ width: calc(100% - 115px); } .contact-map{ height: 200px; margin-top: 5px; } .form-top{ flex-wrap: wrap; } .form-top input{ width: 100%; margin-top: 10px; padding: 0 17px; } .form-top>input:nth-of-type(1), .form-top>input:nth-of-type(2), .form-top>input:nth-of-type(3){ width: 100%; } .contact-btn, .index-about-left .more{ background-color: #de0011; } .contact-btn{ width: 150px; height: 50px; } .join-list li>div:nth-of-type(1)>strong, .join-list li>div:nth-of-type(1)>span{ font-size: 13px; } .join-list li>div:nth-of-type(1)>strong:last-child, .join-list li>div:nth-of-type(1)>span:last-child{ width: 10%; } .join-list li>div:nth-of-type(1)>strong, .join-list li>div:nth-of-type(1)>span{ width: 22%; } .join-list li>div:nth-of-type(1){ padding: 10px 10px; align-items: center; } .join-list li>div>span, .join-item-first>strong{ line-height: 1.6 !important; } .news-page-other>a{ width: 100%; margin: 5px 0; } } @media screen and (max-width:414px){ .pull-item.pull-item-fixed{ width: 100%; } .pull-item-02 li>a{ padding: 0 8px; font-size: 14px; } .pull-item-03 li>a{ padding: 7px 12px; line-height: 22px; font-size: 15px; text-align: center; } } @media screen and (max-width:350px){ .pull-item-02 li>a{ padding: 0 6px; font-size: 13px; } .pull-item-03 li>a{ padding: 9px 8px; line-height: 20px; font-size: 14px; text-align: center; } .pase-size a{ width: 22px; line-height: 22px; } .social-img{ height: 230px; } .social-img img{ min-height: 230px; } .join-list li>div:nth-of-type(1)>strong:last-child, .join-list li>div:nth-of-type(1)>span:last-child{ width: 18%; } .join-list li>div:nth-of-type(1)>strong:first-child, .join-list li>div:nth-of-type(1)>span:first-child{ width: 38%; } .join-list li>div:nth-of-type(1)>strong, .join-list li>div:nth-of-type(1)>span{ font-size: 12px; } .index-title ins{ font-size: 42px; } .index-title p{ font-size: 16px; } .index-title-item li{ font-size: 13px; } .index-title-item li:last-child{ margin-left: 15px; } .corporate-name{ font-size: 22px; margin: 20px 0 10px; } }