@charset "utf-8"; /* ===================首页样式========================== */ .Container-wrapper{margin-top: 75px; background:#fff;} /* banner */ .banner-container{width: 100%;position: relative;} .banner{width: 100%;} .banner-picwords{width: 100%;} .banner-pic{width: 100%;overflow: hidden;} .banner-pic img{width: 100%;object-fit: cover;} .banner-pic .banner-pc{display: block;min-height: 520px;} .banner-pic .banner-mb{display: none;min-height: 320px;} .banner-text{position: absolute;left: 16.666%;top: 30%;} .banner-text h5{font-size: 52px;color: #fff;font-weight: bold;position: relative;padding-bottom: 18px;} .banner-text h5::after{width: 40px;height: 3px;/*background-color: #fff;*/position: absolute;left: 5px;bottom: 0px;content: '';} .banner-text h6{font-size: 28px;color: #fff;line-height: 42px;max-width: 570px;margin-top: 20px;} .banner .swiper-slide-active .banner-text h5{animation: bannertextright 1s ease both 400ms;} .banner .swiper-slide-active .banner-text h6{animation: bannertextdow 1s ease both 1000ms;} @keyframes bannertextright {0% {transform: translateX(-80px);opacity: 0;}100% {transform: translateX(0);opacity: 1;}} @keyframes bannertextdow {0% {transform: translateY(-30px);opacity: 0;}100% {transform: translateY(0);opacity: 1;}} .banner .swiper-container-horizontal>.swiper-pagination-bullets{bottom: 20px;} .banner .swiper-pagination-bullet{width: 30px;height: 3px;background-color: #fff;opacity: 1;border-radius: 0;} .banner .swiper-pagination-bullet-active{width: 50px;background-color: #00a9f0;} /* Design draft version - DK .banner .swiper-container-horizontal>.swiper-pagination-bullets{bottom: 70px;} .banner .swiper-pagination-bullet{width: 170px;height: 70px; line-height:70px; background-color:rgba(255,255,255,0.7);opacity: 1;border-radius: 0; font-size:20px; color:#333;} .banner .swiper-pagination-bullet-active{background-color: #00a9f0; color:#fff;} */ /* 新闻 */ .ind-news{width: 100%;padding: 20px 0;overflow: hidden;} .ind-tit{width: 100%;border-bottom: 1px solid #e5e5e5;line-height: 40px;overflow: hidden;} .ind-tit h6{float: left;font-size: 24px;color: #000;line-height: 30px;position: relative;padding-bottom: 10px;} .ind-tit h6::after{width: 100%;height: 2px;background-color: #00a9f0;content: '';left: 0;bottom: 0px;position: absolute;} .ind-tit .more{float: right;font-size: 14px;color: #888;line-height: 30px;padding-right: 16px;background: url('../images/index/z-01.png') no-repeat right center;transition: all .4s;} .ind-tit .more:hover{color: #00a9f0;} .ind-newsmain{width: 100%;margin-top: 30px;overflow: hidden;} .newimg{width: 50%;float: left;padding-right: 30px;} .newimg .swiper-button-next, .newimg .swiper-button-prev{background-size: 22px 32px;} .newimg1{width: 100%;height: 358px;overflow: hidden;position: relative;} .newimg1 img{width: 100%;height: 100%;object-fit: cover;transition: all .4s;} .newimg1 p{position: absolute;width: 100%;padding: 0 10px;line-height: 50px;background: rgba(0, 0, 0, .6);font-size: 16px;color: #fff;white-space:nowrap;text-overflow:ellipsis;overflow:hidden;left: 0;bottom: 0;} .newimg1:hover img{transform: scale(1.06);} .newhot{width: 50%;float: left;} .newhot ul li{position: relative;padding: 0 70px 0 90px;padding-bottom: 20px;border-bottom: 1px solid #eaeaea;margin-top: 14px;} .newhot .newtime{position: absolute;width: 80px;height: 58px;border-right: 1px solid #eaeaea;left: 0;top: 0;text-align: center;font-size: 30px;color: #b0b0b0;line-height: 30px;font-weight: bold;transition: all .4s;} .newhot .newtime span{display: block;font-size: 14px;font-weight: normal;} .newhot ul li h6{font-size: 16px;color: #333;line-height: 30px;height: 30px;white-space:nowrap;text-overflow:ellipsis;overflow:hidden;transition: all .4s;} .newhot ul li p{font-size: 14px;color: #666;line-height: 24px;height: 24px;white-space:nowrap;text-overflow:ellipsis;overflow:hidden;} .newhot ul li::after{content: '';width: 33px;height: 33px;position: absolute;right: 0;top: 10px;background: url('../images/index/z-02.png') no-repeat center center;} .newhot ul li:hover h6{color: #00a9f0;} .newhot ul li:hover .newtime{color: #00a9f0;} .itemimg .swiper-container{ padding-bottom:50px;} .itemimg .swiper-container .swiper-button-prev{ top:auto; bottom:10px; width:20px; height:20px; left:36%; background: url('../dimg/left.png') no-repeat center center; } .itemimg .swiper-container .swiper-button-next{ top:auto; bottom:10px; width:20px; height:20px; right:36%; background: url('../dimg/right.png') no-repeat center center;} .itemimg .swiper-container .swiper-button-prev.swiper-button-disabled{background: url('../dimg/dleft.png') no-repeat center center;} .itemimg .swiper-container .swiper-button-next.swiper-button-disabled{background: url('../dimg/dright.png') no-repeat center center;} /* 杂志 */ .ind-zazhi{width: 100%;padding: 60px 0;overflow: hidden;background-color: #f6f6f6;} .ind-zheren{width: 42%;float: left;overflow: hidden;} .zheren{width: 100%;margin-top: 22px;overflow: hidden;} .zheren ul li{position: relative;padding: 0 0 0 15px;border-bottom: 1px solid #d9d9d9;line-height: 45px;height: 45px;font-size: 14px;color: #666;background: url('../images/index/z-03.png') no-repeat left center;margin-top: 11px;} .zheren ul li a{display: block;width: 100%;white-space:nowrap;text-overflow:ellipsis;overflow:hidden;} .zheren ul li span{position: absolute;right: 0;line-height: 45px;top: 0;} .zheren ul li a:hover{color: #00a9f0;} /* item */ .ind-item{width: 100%;padding: 60px 0;overflow: hidden; background:#fff;} .ind-item .swiper-slide { border:1px solid #d9d9d9;} .ind-item .pic img{ width:100%;} .ind-item .title{ font-size:16px; color:#666; text-align:center; line-height:60px; height:60px; overflow:hidden;} .ind-ship{width: 52%;float: left;margin: 0 3%;overflow: hidden;} .ship{width: 100%;overflow: hidden;margin-top: 38px;} .ship .shipimg{width: 100%;height:374px;overflow: hidden;position: relative;cursor: pointer;} .ship .shipimg::after{content: '';width: 54px;height: 54px;position: absolute;left: 50%;top: 50%;margin-left: -27px;margin-top: -27px; /* background: url('../images/index/z-04.png') no-repeat center center; */} .ship .shipimg img{width: 100%;height: 100%;object-fit: cover;transition: all .4s;} .ship .shipimg:hover img{transform: scale(1.06);} .ship p{height: 70px;background-color: #00a9f0;line-height: 70px;text-align: center;font-size: 14px;color: #fff;white-space:nowrap;text-overflow:ellipsis;overflow:hidden;} .ind-qikan{width: 23%;float: left;} .qikan{width: 100%;overflow: hidden;margin-top: 38px;} .qikan .swiper-container{padding: 0 30px;} .qikan .swiper-button-prev{width: 15px;height: 30px;background: url('../images/index/z-05.png') no-repeat center center;left: 0;} .qikan .swiper-button-next{width: 15px;height: 30px;background: url('../images/index/z-05.png') no-repeat center center; right: 0;transform: rotate(180deg);} .qikan .swiper-button-prev:hover{background: url('../images/index/z-06.png') no-repeat center center;} .qikan .swiper-button-next:hover{background: url('../images/index/z-06.png') no-repeat center center;transform: rotate(180deg);} .qikanimg{background-color: #fff;max-width: 230px;max-height: 310px;overflow: hidden;border: 1px solid #e5e5e5;margin: 0 auto;} .qikanimg img{max-width: 100%;max-height: 100%;object-fit: cover;} /* 公告 */ .dayhint {height: 45px;position: relative;overflow: hidden;line-height: 45px;width: 100%;margin-top: 12px;} .dayhint .contain{background: #f2f2f2;padding: 0 12px;} .dayhint ul {list-style: none;margin: 0;width: 88% !important;padding: 0 !important;display: inline-block;vertical-align: middle;} .dayhint-hint{color: #00a9f0;font-size: 16px;height: 45px;line-height: 45px;background: url('../images/ind_newicon.png') no-repeat left;padding-left: 30px;margin-right: 6px;display: inline-block;vertical-align: top;width: 112px;} .dayhint ul a {width: 100%;padding: 0;display: block;margin: 0;color: #484848;font-size: 16px;overflow: hidden;} .dayhint ul a p{float: left;transition: all .4s ease;} .dayhint ul a span{float: right;display: block;font-size: 14px;color: #666;} .dayhint ul a:hover p{color: #00a9f0;} /* -------------------------PC端--------------------------- */ @media all and (max-width:1700px) { /* 1600 × (900/1024/1200) */ .banner-text{left: 10%;} } @media all and (max-width:1599px) { /* 1440 × (900/1050) */ .banner-text h5{font-size: 44px;} .banner-text h6{margin-top: 16px;font-size: 26px;} .banner-text{left: 6%;} .itemimg .swiper-container .swiper-button-prev{left: 36%;} .itemimg .swiper-container .swiper-button-next{right: 36%;} } @media all and (max-width:1439px) { /* 1360 × (768) */ } @media all and (max-width:1359px) { /* 1280 × (800/854/1024) */ .banner-text{left: 4%;} .banner-text h5{font-size: 44px;} .banner-text h6{font-size: 22px;line-height: 34px;} .ind-news,.ind-zazhi{padding: 50px 0;} .ship .shipimg{height: auto;} .ship p{height: 62px;line-height: 62px;} .zheren ul li{margin-top: 6px;} } @media all and (max-width:1279px) { /* 1152 × (864) */ .dayhint ul{width: 87% !important;} } @media all and (max-width:1179px) { .banner .swiper-container-horizontal .swiper-pagination-bullets{bottom: 20px;} .banner .swiper-pagination-bullet{width: 30px;height: 3px; line-height:3px; background-color: #fff;opacity: 1;border-radius: 0; text-indent:-999em;} .banner .swiper-pagination-bullet-active{width: 50px;background-color: #00a9f0;} } @media all and (max-width:1151px) { /* 1024 × (600/768) */ .qikan .swiper-container{padding: 0 16px;} .dayhint ul{width: 85% !important;} } /* ------------------------手机端-------------------------- */ @media all and (max-width:1000px) { /* 平板设备 720 适配 */ .dayhint{display: none;} .Container-wrapper{margin-top: 60px;} .banner-pic .banner-pc{display: none;} .banner-pic .banner-mb{display: block;} .banner-text{top: 30%;} .banner-text h5{font-size: 35px;} .banner-text h6{font-size: 22px;line-height: 30px;} .ind-news, .ind-zazhi{padding: 30px 0;} .newimg{width: 100%;padding-right: 0;} .newimg1{height: auto;} .newimg1 img{ max-height:400px;} .newhot{width: 100%;padding-top: 10px;} .ind-zheren{width: 100%;margin-bottom: 20px;} .ind-ship{width: 100%; float: none; margin: 0;} .ind-qikan{width: 46%;} .ship .shipimg{height: auto;} .ship p{line-height: 66px;height: 66px;} .itemimg .swiper-container .swiper-button-prev{left: 30%;} .itemimg .swiper-container .swiper-button-next{right: 30%;} } @media all and (max-width:900px) { .itemimg .swiper-container .swiper-button-prev{left: 20%;} .itemimg .swiper-container .swiper-button-next{right: 20%;} } @media all and (max-width:640px) { /* 移动终端以上 360 适配 */ .banner-text h5{font-size: 30px;line-height: 34px;padding-bottom: 10px;} .banner-text h6{font-size: 15px;line-height: 20px;margin-top: 10px;} .about-text h5{font-size: 20px;padding: 5px 0;line-height: 20px;} .banner .swiper-container-horizontal>.swiper-pagination-bullets{bottom: 10px;} .banner .swiper-pagination-bullet{width: 20px;} .banner .swiper-pagination-bullet-active{width: 30px;} .newhot ul li{padding: 0 40px 4px 73px;} .newhot .newtime{width: 65px;height: 50px;font-size: 22px;line-height: 24px;} .newhot ul li h6{font-size: 14px;line-height: 26px;height: 26px;} .newhot ul li::after{width: 24px;height: 24px;background-size: 100%;} .newimg1 img{ max-height:300px;} .ind-tit h6{font-size: 22px;} .zheren{margin-top: 10px;} .ind-ship{width: 100%;margin: 0;} .ship{margin-top: 20px;} .ship .shipimg{height: auto;} .ship p{height: 50px;line-height: 50px;} .ind-qikan{width: 100%;margin-top: 20px;} .qikan{margin-top: 30px;} }