@charset "utf-8"; html,body {position: relative;height: 100%; min-width: 320px;} body {font-family: Helvetica Neue, Helvetica, Arial, sans-serif;font-size: 14px;color: #000;margin: 0;padding: 0;} .swiper {width: 100%;height: 100%;} .swiper-slide {text-align: center;font-size: 18px; /* Center slide text vertically */ /* display: -webkit-box; display: -ms-flexbox; display: -webkit-flex; */ display: flex; /* -webkit-box-pack: center; -ms-flex-pack: center; -webkit-justify-content: center; */ justify-content: center; /* -webkit-box-align: center; -ms-flex-align: center; -webkit-align-items: center; align-items: center; */ } /*.swiper-slide img {display: block;width: 100%;height: 100%;object-fit: cover;}*/ .pages1{ background:url(../img/bg01.png) no-repeat center center; background-size: 100% 100%;} .pages2{ background:url(../img/bg02.jpg) no-repeat center center; background-size: 100% 100%;} .pages3{ background:url(../img/bg03.jpg) no-repeat center center; background-size: 100% 100%;} .pages4{ background:url(../img/bg04.jpg) no-repeat center center; background-size: 100% 100%;} .pages5{ background:url(../img/bg05.jpg) no-repeat center center; background-size: 100% 100%;} .pages6{ background:url(../img/bg06.jpg) no-repeat center center; background-size: 100% 100%;} .about02-1 h2{background: url(../img/pages2/img6.png) no-repeat center center ; background-size: 100% 100%;} .about02-1{background: url(../img/pages2/img4.png), no-repeat center center ; background-size: 100% 100%;} .about02-1 h2{background: url(../img/pages2/img6.png) no-repeat center center ; background-size: 100% 100%;} .ititle{margin-bottom: .3rem !important;} .ititle h2{font-size: .48rem !important; color: #ffae00 !important; } .title.green .iline{background: #ffae00 !important; margin-top: .05rem !important; margin-bottom: .05rem !important;} .title p{ font-size: .36rem !important; color: #fff !important; } .swiper-pagination-vertical.swiper-pagination-bullets, .swiper-vertical > .swiper-pagination-bullets{ right: 36px;} .swiper-pagination-vertical.swiper-pagination-bullets .swiper-pagination-bullet, .swiper-vertical > .swiper-pagination-bullets .swiper-pagination-bullet { margin: var(--swiper-pagination-bullet-vertical-gap,23px) 0;} .swiper-pagination-bullet{ width: 12px; height: 12px; background: #97969a;} .swiper-pagination-bullet.swiper-pagination-bullet-active{ background: #fff;} #fp-nav ul li, .fp-slidesNav ul li{ width:12px; height:12px; padding:11px 0;} #fp-nav ul li a span, .fp-slidesNav ul li a span{ width: 12px; height: 12px; background: #6b635f; margin:0; left:0; top:0; } #fp-nav ul li a.active span, #fp-nav ul li:hover a.active span, .fp-slidesNav ul li a.active span, .fp-slidesNav ul li:hover a.active span{ background: #fff; margin:0;} #fp-nav ul li:hover a span, .fp-slidesNav ul li:hover a span{ width:12px; height:12px; margin:0;} #baona .swiper-slide{ overflow:hidden;} /*#box01 .mc{ position: absolute; top: 3.18rem; left: 0; width: 100%; text-align: center;}*/ #box01 .item01 img{ width: 3rem; } /*#box01 .item02{ position: relative;} #box01 .item02 img{ width: 14.36rem; height: 1.18rem; margin-bottom: .65rem;} #box01 .item02 .line{position: absolute; top: 1.46rem; left: 50%; margin-left: -63px; display: block; width: 126px; height: 2px; background: #fff;} #box01 .item03 img{ width: 4.43rem; height: .43rem; margin-bottom: .52rem;} #box01 .item04 img{ width: 7.16rem; height: 1.23rem; margin-bottom: .6rem;} #box01 .item05 img{ width: 4.71rem; height: .66rem; }*/ #box02{ overflow: hidden;} .mc{ position: absolute; top: 2rem; left: 0; width: calc(100% - 20px); text-align: center; height: calc(100% - 2rem); margin: 0 10px;} .item01{height: 100%;} /*#box02 .item01 img{ width: 2.01rem; height: .79rem; margin-bottom: .6rem;} #box02 .item01 .line{position: absolute; top: 1.02rem; left: 50%; margin-left: -43px; display: block; width: 86px; height: 3px; background: #d4b578;} #box02 .item02 img{ width: 11rem; height: 1.3rem; margin-bottom: .42rem;} #box02 .item03 img{ width: 4.82rem; height: 1.05rem; margin-bottom: .41rem; opacity: .39}*/ #prolist{} #prolist .swiper{ width: 14.64rem; margin: 0 auto;} #prolist .mySwiper{ width: 12rem; margin: 0 auto; overflow: hidden;} #prolist .swiper .swiper-wrapper{ } #prolist .swiper-slide {text-align: center;font-size: 18px;background: none;display: block;} #prolist .swiper-slide img {display: block;width: 100%;height: 100%;object-fit: cover;} /*#prolist .swiper-button-next:after, #prolist .swiper-button-prev:after{ display: none;} #prolist .swiper-button-next, #prolist .swiper-button-prev{ width: .66rem; height: .66rem; background: #484441; opacity: .8; border-radius: 100%} #prolist .swiper-button-next{ right:0px;} #prolist .swiper-button-prev{ left:0px;} #prolist .swiper-button-next:before, #prolist .swiper-button-prev:before{ content: ''; width: 100%; height: 100%; } #prolist .swiper-button-next:before{ background:url(../img/pages3/arrr.png) no-repeat center; background-size: .19rem .36rem;} #prolist .swiper-button-prev:before{ background:url(../img/pages3/arrl.png) no-repeat center; background-size: .19rem .36rem;} #prolist .swiper-button-next:hover, #prolist .swiper-button-prev:hover{opacity: 1;}*/ #prolist .swiper-slide{ width: 25%;} #prolist .swiper-slide .pic{width: 100%; position: relative; z-index: 99;} #prolist .swiper-slide .pic:before{ content: ""; width: 100%; height: 100%; z-index: 1; position: absolute; left: 0; top: 0; background: #606060; opacity: .7;} /*#prolist .swiper-slide:nth-child(2n) .pic:before{content: ""; width: 100%; height: 100%; position: absolute; left: 0; top: 0; background: #383635; opacity: .7;}*/ #prolist .swiper-slide .pic img{ width: 100%; position: relative; z-index: 99; } #prolist .swiper-slide .info{ width: 100%; height: 64px; position: absolute; bottom: 0; z-index: 99;} #prolist .swiper-slide .info:before{ content: ""; width: 100%; height: 100%; z-index: 1; position: absolute; left: 0; top: 0; background:rgba(255,255,255,.8); opacity: .7;} /*#prolist .swiper-slide:nth-child(2n) .info:before{content: ""; width: 100%; height: 100%; z-index: 1; position: absolute; left: 0; top: 0; background: #434343; opacity: .7;}*/ #prolist .swiper-slide .info .line{ height: 18px; position: relative; z-index: 99; display: none;} #prolist .swiper-slide .info .line:before{ content: ""; display: block; width: 30px; height: 1px; background: #fff; position: absolute; top: 12px; left: 50%; margin-left: -15px;} #prolist .swiper-slide a .info .name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap; width: 100%; margin: 0 auto; text-align: center; line-height: 64px; color: #fff;} #prolist .swiper-slide a .info .name{ font-size: .24rem; color: #5d5d5d; position: relative; z-index: 99; -webkit-transition:all .5s ease; -o-transition:all .5s ease; transition:all .5s ease} #prolist .swiper-slide a:hover .info .name{ background: #ffae00; color: #fff;} #prolist .swiper-slide .info .num{ font-size: 16px; color: #a37c03; position: relative; z-index: 99} #prolist .swiper-button-next, #prolist .swiper-button-prev{color: var(--swiper-navigation-color,#ffae00) !important;} #box03 .item01 .line{position: absolute; top: 1.04rem; left: 50%; margin-left: -43px; display: block; width: 86px; height: 3px; background: #d4b578;} #box03 .item02{ margin-bottom: .3rem;} #box03 .item02 p{ font-size: .2rem; color: #fff; } #box03 .item03{ width: 5.94rem; background: #fff; margin: 0 auto; display: flex; flex-direction: row; margin-bottom: .3rem; box-shadow: 0 0 6px #333} #box03 .item03 .item{ width: 33.333%; padding: 15px 0;} #box03 .item03 .item h2{ color: #ff6700; font-size: .4rem; font-weight: bold; font-family:Arial,'Microsoft YaHei'} #box03 .item03 .item p{ color: #ff6700; font-size: .16rem;} #box03 .item04 img{ width: 9.42rem; height: 3.16rem; padding: 10px; border: 2px solid #ba8f32} #box04 .active{ background: url(../img/pages4/img8.png); } #box04{ overflow: hidden;} #box04 .item01 .line{position: absolute; top: 1.02rem; left: 50%; margin-left: -43px; display: block; width: 86px; height: 3px; background: #d4b578;} #aboutlist .swiper-slide{ width: 6.02rem !important; height: 5.55rem !important; background: #fff !important; display: block; box-shadow: 0 0 6px #333;} #aboutlist .swiper-slide .pic{ width: 100%; height: 3.2rem;} #aboutlist .swiper-slide .info{ padding:.3rem .3rem 0 .5rem; text-align: left;} #aboutlist .swiper-slide .info .num img{ width: .58rem; height: .24rem;} #aboutlist .swiper-slide .info .name{ font-size: .24rem; color: #ffae00; font-weight: bold; padding-bottom: .15rem; position: relative; margin-bottom: .15rem;} #aboutlist .swiper-slide .info .name:before{ content: ""; width: .3rem; height: .05rem; background: #ffae00; position: absolute; bottom: 0; left: 0;} #aboutlist .swiper-slide .info .brief{ font-size: .2rem; color: #323232;} #aboutlist .swiper-paginations{ bottom: 20px !important;} #aboutlist .swiper-slide-next{opacity: 1 !important;} #aboutlist .swiper-slide-prev{opacity: 1 !important;} #aboutlist .iconfont{ font-size: 50px !important; width: 50px !important; height: 50px !important; color: #ffae00 !important;} #aboutlist .swiper-button-prev{left:-50px !important;} #aboutlist .swiper-button-next{right: -50px !important;} #box05{ overflow: hidden;} /* #box05 .mc{ position: absolute; top: 1.8rem; left: 0; width: 100%; text-align: center;} */ #box05 .item01 .line{position: absolute; top: 1.02rem; left: 50%; margin-left: -43px; display: block; width: 86px; height: 3px; background: #d4b578;} #box05 .item02{ margin-bottom: .3rem;} #box05 .item02 .list{display: flex; flex-direction: row; width:13.72rem; margin: 0 auto;} #box05 .item02 .list .item{ flex: 1; text-align: center;} #box05 .item02 .list .item .con{ display:inline-block; width: 2.4rem; height: 1.05rem; padding:.15rem 0; background: #fff; border-radius: 15px;} #box05 .item02 .list .item .con .iconfont{ font-size: .3rem; color: #ff6700;} #box05 .item02 .list .item .con .infos{ font-size: .16rem; color: #ff6700 !important;} #box05 .item02 .list .item .con .infos a{color: #ff6700 !important;} /* .videoslist{ max-width: 14.24rem; width: 100%; margin: 0 auto;} #box05 .videolist { position:relative; width:7.04rem; height:4.06rem; } #box05 .videolist .vimg{ width:7.04rem; height:4.06rem;} #box05 .videolist:nth-child(1){ float: left;} #box05 .videolist:nth-child(2){ float: right;} #box05 .videolist:hover{ cursor: pointer; } #box05 .videoed { display:none; width:64px; height:64px; position: absolute; left:50%; margin-left: -32px; top:50%; margin-top: -32px; z-index:99; border-radius:100%; } #box05 .videos{ display:none; position: absolute;width: 800px;height: 600px; background: #000;top: 0;left:0;right:0;bottom:0; margin: auto;} #box05 .vclose { position:absolute;right:1%; top:1%; border-radius:100%; cursor: pointer; } #video{ width:800px; height:600px; } */ #box06 .con-one{ background: url(../img/pages6/img12.jpg); background-size: cover; background-repeat: no-repeat; } /*#box06{ overflow: hidden;} #box06 .mc{ position: absolute; top: 22%; left: 0; width: 100%; text-align: center;} #box06 .item01 img{ width: 2rem; height: .78rem; margin-bottom: .94rem;} #box06 .item01 .line{position: absolute; top: 1.02rem; left: 50%; margin-left: -43px; display: block; width: 86px; height: 3px; background: #d4b578;} #box06 .item02{width: 370px; height: 44px; margin: 0 auto; margin-bottom: .4rem;} #box06 .item02 img{ width: 100%;} #box06 .item02 .item:nth-child(1){ float: left;} #box06 .item02 .item:nth-child(2){ float: right;} #box06 .item03{ width: 9.9rem; height: 1.59rem; margin: 0 auto; margin-bottom: .33rem; text-align: center;} #box06 .item03 p{ font-size:.24rem; line-height: .4rem; color: #fff; letter-spacing: 1px;} #box06 .item04{ text-align: center; margin: 0 auto;} #box06 .item04 .item{ width: 1.83rem; height: 1.83rem; display: inline-block;} #box06 .item04 .item:nth-child(2){ margin: 0 1.07rem;} #box06 .item04 .item img{ width: 100%; height: 100%;}*/ /* pc鈫 */ @media screen and (max-width:1440px) { } @media screen and (max-width:1200px) { } @media screen and (max-width:1199px) { #box04 .mc{ padding:0 10px;} #aboutlist{ width:100% !important;} } /* pad鈫 */ @media screen and (max-width:1024px) and (min-width:900px){ } @media screen and (max-width:800px) { #prolist { padding: 0 10px;} #prolist .swiper{ width: 100%;} #prolist .mySwiper { width: 100%;} } @media screen and (max-width:720px) { #box05 .item02 .list{ width:100%;} #box05 .item03 img{ width:100%; height:auto;} } /* phone 640鈫 */ @media screen and (max-width:640px) { #box01 .mc{ padding:0 10px;} #box01 .item01 img{ width:100%; height:auto; margin:0; position:relative; left:0; top:0;} #box05 .item02{ overflow:hidden;} #box05 .item02 .list{ display:block;} #box05 .item02 .list .item{ float:left; width:46%; margin:1% 2%;} #aboutlist .swiper-container{ padding-bottom: .8rem !important;} } @media screen and (max-width:600px) { } @media screen and (max-width:550px) { #box03 .item04 img{ width:100%; height:auto;} } @media screen and (max-width:412px) { } @media screen and (max-width:411px) { } @media screen and (max-width:375px) { } @media screen and (max-width:320px) { }