@charset "utf-8";
/* CSS Document */
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,button,textarea,p,blockquote,th,td { margin:0; padding:0; }
h1,h2,h3,h4,h5,h6{font-weight: normal;}
BODY {FONT:14px/1.75 "Microsoft YaHei", arial,sans-serif; font-family: "Noto Sans SC"; overflow-x: hidden;}
A {COLOR: #666; TEXT-DECORATION: none}
P{COLOR: #333;}
A:hover {TEXT-DECORATION: none}
A IMG {BORDER-BOTTOM-STYLE: none; BORDER-RIGHT-STYLE: none; BORDER-TOP-STYLE: none; BORDER-LEFT-STYLE: none}
DIV {PADDING-BOTTOM: 0px; LIST-STYLE-TYPE: none; MARGIN: 0px; PADDING-LEFT: 0px; PADDING-RIGHT: 0px; PADDING-TOP: 0px}
UL {PADDING-BOTTOM: 0px; LIST-STYLE-TYPE: none; MARGIN: 0px; PADDING-LEFT: 0px; PADDING-RIGHT: 0px; PADDING-TOP: 0px}
LI {PADDING-BOTTOM: 0px; LIST-STYLE-TYPE: none; MARGIN: 0px; PADDING-LEFT: 0px; PADDING-RIGHT: 0px; PADDING-TOP: 0px}
P {PADDING-BOTTOM: 0px; LIST-STYLE-TYPE: none; MARGIN: 0px; PADDING-LEFT: 0px; PADDING-RIGHT: 0px; PADDING-TOP: 0px}
FORM {PADDING-BOTTOM: 0px; LIST-STYLE-TYPE: none; MARGIN: 0px; PADDING-LEFT: 0px; PADDING-RIGHT: 0px; PADDING-TOP: 0px}
EM {FONT-STYLE: normal; FONT-WEIGHT: normal}
TABLE {PADDING-BOTTOM: 0px; LIST-STYLE-TYPE: none; MARGIN: 0px; PADDING-LEFT: 0px; PADDING-RIGHT: 0px; PADDING-TOP: 0px}
DT {PADDING-BOTTOM: 0px; LIST-STYLE-TYPE: none; MARGIN: 0px; PADDING-LEFT: 0px; PADDING-RIGHT: 0px; PADDING-TOP: 0px}
DL {PADDING-BOTTOM: 0px; LIST-STYLE-TYPE: none; MARGIN: 0px; PADDING-LEFT: 0px; PADDING-RIGHT: 0px; PADDING-TOP: 0px}
DD {PADDING-BOTTOM: 0px; LIST-STYLE-TYPE: none; MARGIN: 0px; PADDING-LEFT: 0px; PADDING-RIGHT: 0px; PADDING-TOP: 0px}
FORM {PADDING-BOTTOM: 0px; MARGIN: 0px; PADDING-LEFT: 0px; PADDING-RIGHT: 0px; PADDING-TOP: 0px}
TR {PADDING-BOTTOM: 0px; LIST-STYLE-TYPE: none; MARGIN: 0px; PADDING-LEFT: 0px; PADDING-RIGHT: 0px; PADDING-TOP: 0px}
.cl{HEIGHT: 0px; CLEAR: both;}
.jz{margin:0 auto;}
.fl{FLOAT: left}
.fr{FLOAT: right}
img { image-rendering: -webkit-optimize-contrast;}
.container{width:1300px; margin:0 auto}
.container12{width:1200px; margin:0 auto}
.container15{width:1500px; margin:0 auto}
.containers{width:96%; margin:0 auto}
.c{*zoom:1;}
.c:after{content: ""; display: block; height: 0; clear: both;}
.txt-c{text-align: center;}
.txt-r{text-align: right;}
.col-white{color: #fff;}
.clearfix:after{ content:""; display:block; clear:both; height:0; visibility:hidden;}
.clearfix{ zoom:1;}
/* 下滑头部 */
.navfixed {position: fixed; top: 0; width: 100%; z-index: 99999; transition: .5s; background: #fff;    box-shadow: 1px 1px 10px rgb(0 0 0 / 10%);}
/* 多行省略 */
.omit {display: -webkit-box;overflow: hidden;  	-webkit-line-clamp: 2;-webkit-box-orient: vertical; }

/* 绝对定位居中 */
.jddwjz { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%)}

::-webkit-scrollbar {/*滚动条整体样式*/width: 4px;/*高宽分别对应横竖滚动条的尺寸*/ height: 4px;scrollbar-arrow-color:red;}
::-webkit-scrollbar-thumb {/*滚动条里面小方块*/ border-radius: 5px;-webkit-box-shadow: inset 0 0 5px rgba(0,0,0,0.2);background: rgba(0,0,0,0.2);scrollbar-arrow-color:red;}
::-webkit-scrollbar-track {/*滚动条里面轨道*/ -webkit-box-shadow: inset 0 0 5px rgba(0,0,0,0.2); border-radius: 0; background: rgba(0,0,0,0.1);}

/* 图标变黑色 */
.icon-black {  filter: brightness(0);}
/* 图标变白色 */
.icon-white {filter: brightness(100);}
/* 图标变灰色色 */
.icon-gray {filter: grayscale(100%);}

/*字体引入*/
@font-face {
  font-family: "futura";
  src: url("/html/class/template/font/Futura/ Md/ BT/ Bold.ttf");
}



/* CSS Document */
/*===============公用头部===============*/
.header {position: fixed; width: 100%; z-index: 9999; background-color: none; }
.header .headContainer {width: 1600px; margin: auto;}
.header .box h1 img {display: block;filter: brightness(100);width: 234px;}
.header .box {display: flex;justify-content: space-between; align-items: center; height: 120px;}
.header .headerNav {width: 60%;}
.header .headerNav ul {display: flex; justify-content: space-between; align-items: center;}
.header .headerNav > ul > li {position: relative; line-height: 120px;}
.header .headerNav > ul > li > a {font-size: 1rem;color: #ffffff;letter-spacing: 0.04rem; position: relative;}
.header .headerNav > ul > li > a::after {content: ""; position: absolute; width: 0; height: 0.13rem; bottom: -10px; background: #fff; left: 50%; transition: .5s;}
.header .headerNav > ul > li > a:hover::after {width: 100%; left: 0;}
.header .headerNav > ul > li.on > a::after {width: 100%; left: 0;}
.header .elIcon {display: flex; align-items: center; margin-right: 1rem;}
.header .elIcon img {display: block;}
.header .elIcon span {color: #fff; font-size: 1.2rem; margin-left: 0.5rem; display: block;}
.header .box .reCon {display: flex; align-items: center;}
.header .box .reCon img {display: block;}

.navfixed .box h1 img {filter: none;}
.navfixed .headerNav ul li a {color: #333;}
.navfixed .headerNav ul li a::after {content: ""; position: absolute; width: 0; height: 0.13rem; bottom: -10px; background: #1a23bb; left: 50%; transition: .5s;}
.navfixed .elIcon img {filter: brightness(0);}
.navfixed .elIcon span {color: #333;}
.navfixed .box .reCon img {filter: brightness(0);}

/* 二级导航 */
.header .box ul li dl {position: absolute; width: 150%;  left: -30%;display: none;}
.header .box ul li > dl > dd {color: #333;width: 100%; transition: .5s;  text-align: center; background: rgba(0,0,0,.35); border-bottom: 2px solid rgba(255, 255, 255, 0.09);position: relative; line-height: initial;}
.header .box ul li > dl > dd a {color: #fff; font-size: 0.8rem;padding: 1rem 0; display: block;}
.header .box ul li > dl > dd:hover {background: #0e14b0;}

/* 搜索页面 */
.search-page .box {margin-top: 18vh;}
.search-page form {width: 60%;margin: auto; margin-bottom: 60px; border: 1px solid #333; border-radius: 50px; padding:5px 20px; box-sizing: border-box; display: flex;     align-items: center; justify-content: space-between; }
.search-page form .search-text {padding: 5px 0; width: 95%; line-height: 35px; outline: none; border: none; box-sizing: border-box; font-size: 16px;}
.search-page form .sub {width: 23px;  height: 23px; display: block; cursor: pointer; background: url(/html/class/template/images/search-icon.png) no-repeat center; outline: none; border: none; background-size: 100%; filter: brightness(0);}
/* .search-page form .sub:hover {filter: none;} */
.search-page ul {width: 100%;}
.search-page li {width: 100%; padding: 30px; margin-top: 20px; box-sizing: border-box; background: #f5f5f5;}
.search-page li span {background: #0e14b0; color: #fff; font-size: 12px; padding: 2px 5px; }
.search-page li h3 {font-size: 18px; margin: 10px 0; color: #000000; font-weight: 700;}
.search-page li p {font-size: 16px; color: #666; line-height: 20px;}
.search-page li .le {width: 95%;}
.search-page li a {display: flex; align-items: flex-end; justify-content: space-between;}
.search-page li img {transition: .5s; margin-right: 20px;}
.search-page li:hover img {transform: translateX(20px);}
.fy { padding: 60px 0; display: flex;justify-content: center;align-items: center; flex-wrap: wrap; gap: 1rem;}
.fy a { background: #E6E6E6; display: flex; align-items: center; justify-content: center; color: #707070; font-size: 14px; transition: .4s;  padding: 5px 15px;}
/* .fy a.prev {background: #E6E6E6 url(../images/fy-jt.png) no-repeat center; transform: rotate(90deg)}
.fy a.next {background: #E6E6E6 url(../images/fy-jt.png) no-repeat center; transform: rotate(-90deg)}
.fy a:hover { color: #fff; background: #df1814 url(../images/fy-jt.png) no-repeat center;;}
.fy a.active { color: #fff; background: #df1814;} */
.fy a:hover {color: #fff; background: #0e14b0;}
.fy .layui-laypage-curr {color: #fff; background: #0e14b0; font-size: 14px;  margin: 0 5px; padding: 5px 15px;}
@media screen and (min-width: 200px) and (max-width: 640px){
.search-page form {
    width: 90%;
    margin-bottom: 40px;
}
}


/* 首页banner */
.wapBanner {display: none;}
.wapBanner img {width: 100%; display: block;}
.banner {position: relative;}
.banner .banner-circle {overflow: hidden;height: 953px;  width: 100%; position: relative;}
/* .banner img {display: block; image-rendering: pixelated;} */
.banner .b-left { position: absolute; top: 25%;  left: 3%;width: 15rem; height: 14rem; animation: gogogo 5s infinite linear;z-index: 9;}
.banner .b-right { position: absolute; top: 10%;  right: 1%;width: 18rem; height: 10rem; animation: gogogo 5s infinite linear;z-index: 9;}
.banner .banner-title {position: absolute; left: 50%; top: 50%;transform: translate(-50%, -50%); text-align: center; z-index: 11;}
.banner .banner-title h2 {font-size:4rem;font-weight: 700;color: #ffffff;}
.banner .banner-title h3 {font-size: 1.5rem;color: #ffffff;font-weight: 400;letter-spacing: 0.06rem;}
.banner .banner-title .tleCOn {margin-top: 2rem;}
.banner .banner-title .tleCOn span {font-size: 2rem; color: #fff;}
.banner .banner-title a {width: 13.31rem;height: 3.44rem; font-size: 1.25rem;color: #333333;font-weight: 400; display: block; margin: auto; margin-top: 3rem; background: #ffffff; border-radius: 1.75rem; line-height: 3.44rem;}
.circle { position: absolute; left: 50%; top: 50%;transform: translate(-50%, -50%);border: 1px solid rgba(115,177,228,.3);border-radius: 1000px;}
.circle section { position: absolute; text-align: center; box-sizing: border-box; width: 60px; height: 60px; left: 50%; top: 50%; border: 1px solid #73B1E4; border-radius: 10000px; transform: translate(-50%, -50%); transition: all 0.1s linear;}
.circle section a {display: block;width: 100%; height: 100%;}
.circle section span {font-size: 1rem; display: block; color: #fff; text-align: center; margin-top: 0.5rem; white-space: nowrap;}
.circle img { position: absolute; top: 50%; left: 50%; width: 30px; transform: translate(-50%, -50%); transition: .5s;}
.circle section a:hover img {transform: translate(-50%, -50%) scale(1.1);}
.circle section:after,
.circle section:before {content: ""; position: absolute; z-index: -1; top: -1px; right: -1px; display: block; width: 60px; height: 60px; border: 1px solid #73B1E4; box-sizing: border-box; border-radius: 1000px; transform: scale(1); animation: wave 6s ease-in-out infinite;}
.circle section:after { animation-delay: 2s;}
.circle-1 {width: 760px; height: 760px; z-index: 2;}
.circle-2 { width: 900px; height: 900px; z-index: 1;}
.circle-3 { width: 1100px; height: 1100px;}
.banner .bannerBom {position: absolute; z-index: 2; height: 8.13rem;  left: 50%; transform: translate(-50%, -50%) translatey(30px) !important;  background: #ffffff; border-radius: 0.63rem;box-shadow: 0rem 0rem 2.96rem 0rem rgba(8,8,8,0.05); }
.banner .bannerBom ul {display: flex; justify-content: space-around; align-items: center; height: 100%;}
.banner .bannerBom ul li { display: flex; align-items: center; height: 100%;}
.banner .bannerBom ul li .con {width: 4.06rem; height: 4.06rem; margin-right: 1rem; background: #f6f8f9; border-radius: 50%; display: flex; align-items: center; justify-content: center;}
.banner .bannerBom li h4 {font-size: 1.13rem;color: #333333;font-weight: 700; line-height: 20px;}
.banner .bannerBom li span {font-size: 0.94rem;font-weight: 400;color: #999999;}
.banner .bannerBom li img {display: block; transition: .5s;}
.banner .bannerBom li:hover img {transform: rotateY(180deg);}


/* 公用标题 */
.indexTitle {display: flex; align-items: center; justify-content: space-between;}
.indexTitle h4 {font-size: 1.25rem;font-weight: 400;color: #9d9d9d; text-transform: uppercase;}
.indexTitle h3 {font-size: 2.5rem;color: #07132c;font-weight: 700; line-height: 40px;}
.indexTitle i {display: block;width: 3.31rem;height: 0.19rem; background: #0e14b0; margin-top: 2rem;}
.indexLearn {display: block;width: 9.06rem; height: 2.81rem; font-size: 0.88rem; color: #ffffff; background: linear-gradient(0deg,#1a24c2 0%, #4c60d9 100%); border-radius: 1.44rem; text-align: center; line-height: 2.81rem;}
/* 关于J9国际 */
.indexOne {padding:10rem 0 6.5rem 0;}
.indexOne .box {display: flex; justify-content: space-between;}
.indexOne .le {width: 51%;}
.indexOne .le p {font-size: 1rem;color: #777777; margin: 2rem 0 3.5rem 0; line-height: 30px;}
.indexOne .re {width: 44%;}
.indexOne .re video {width: 100%; display: block;}
.indexOne .re {position: relative;}
.indexOne .re  a {  position: absolute; left: 50%;top: 50%;animation: rota360 2s linear infinite;width: 3rem;height: 3rem;background: url(/html/class/template/images/indexThree-videoBtn.png) no-repeat center;background-size: 100%;}
@keyframes rota360 {to {  transform: translate(-50%, -50%) rotate(0);}from { transform: translate(-50%, -50%) rotate(360deg);}}
.video-hide {background-color: #fff;}
.video-hide {display: none; background-color: #fff; padding: 50px; box-sizing: border-box; width: 150%;}
.video-hide .box-title {display: flex; justify-content: space-between; align-items: center; padding-bottom: 30px; border-bottom: 1px solid #ececec; }
.video-hide .box-title h3 {font-size: 32px; color: #000; font-weight: bold;}
.video-hide .box-title span {font-size: 50px; cursor: pointer;}
.video-hide .video-content {margin-top: 2rem; width: 100%;}
.video-hide .video-content video {width: 100%;}


/* 我们的服务 */
.indexTwo {position: relative; background: url(/html/class/template/images/indexTwo-bj.jpg) no-repeat center; background-size: cover;}
.indexTwo .indexTitle {padding-top: 4.3rem;}
.indexTwoSwiper {overflow: hidden; padding: 5.5rem 0;}
.indexTwoSwiper .swiper-slide {background: #fff; height: auto;}
.indexTwoSwiper .swiper-slide .con {padding: 00 1.38rem; box-sizing: border-box;}
.indexTwoSwiper .swiper-slide h5 {font-size: 1.38rem;font-weight: 700;color: #333333; margin: 2rem 0 1rem 0;}
.indexTwoSwiper .swiper-slide .con span {font-size: 0.88rem;display: block; font-weight: 400;color: #888888; padding-bottom: 1rem; border-bottom: 1px solid #EEEEEE;}
.indexTwoSwiper .swiper-slide ul {padding: 1.5rem 0 4.5rem 0; box-sizing: border-box; display: flex; flex-wrap: wrap; justify-content: space-between; gap: 0.8rem;}
.indexTwoSwiper .swiper-slide ul li:nth-child(odd) {width: 47%;}
.indexTwoSwiper .swiper-slide ul li:nth-child(even) {width: 40%;}
.indexTwoSwiper .swiper-slide ul li a {font-size: 0.94rem;color: #666666;font-weight: 400;}
.indexTwoSwiper .swiper-slide ul li a:hover {color: #1E28C3;}
.indexTwoSwiper .swiper-slide .slideMore {width: 100%; display: block; position: absolute; bottom: 0; height: 2.5rem; line-height: 2.5rem; text-align: center; font-size: 0.88rem;color: #ffffff; background: #0e14b0;}
.indexTwoSwiper .swiper-slide .slideMore span {display: inline-block; transition: .5s; margin-left: 0;}
.indexTwoSwiper .swiper-slide .slideMore:hover span {margin-left: 0.5rem;}
.indexTwoSwiper .swiper-button-prev {width: 1.06rem;  height: 1.88rem;left: 12%; top: 60%; background: #b4bdc6; background: url(/html/class/template/images/indexTwoSwiper-jt.png) no-repeat center;background-size: 100%;}
.indexTwoSwiper .swiper-button-next {width: 1.06rem;  height: 1.88rem;right: 12%; top: 60%; background: #b4bdc6; background: url(/html/class/template/images/indexTwoSwiper-jt.png) no-repeat center;background-size: 100%; transform: rotate(180deg);}



/* 选择J9国际 */
.indexThree {background: url(/html/class/template/images/indexThree-bj.jpg) no-repeat center; background-size: cover; padding: 5.5rem 0;}
.indexThree .threeTle {text-align: center;}
.indexThree .threeTle h3 {font-size: 2.5rem;font-weight: 700;color: #ffffff;}
.indexThree .threeTle p {font-size: 1rem;font-weight: 400;color: #ffffff; line-height: 30px; width: 80%; margin: 2rem auto 2.5rem auto;}
.indexThree .threeTle a {display: inline-block; width: 9.25rem;height: 2.81rem;background: #ffffff; border-radius: 1.44rem; line-height: 2.81rem; font-size: 1rem;color: #333333;}
.indexThree ul {display: flex; flex-wrap: wrap  ;  margin-top: 5rem;   row-gap: 0px;column-gap: 120px; justify-content: center;}
.indexThree ul li {background: #fff; width: 13rem; height: 13rem;background: #ffffff; border-radius: 1.25rem; transform: rotate(45deg);}
.indexThree ul li a {display: flex; width: 100%; height: 100%; justify-content: center; align-items: center;}
.indexThree ul li:nth-child(5),.indexThree ul li:nth-child(6),.indexThree ul li:nth-child(7) {margin-top: -3rem;}
.indexThree ul li img {transform: rotate(-45deg); width: 93%;}


/* 新闻资讯 */
.indexFour {background: url(/html/class/template/images/indexFour-bj.jpg) no-repeat center; background-size: cover; overflow: hidden;}
.indexFour .indexTitle {padding-top: 5rem; }
.indexFour .box {padding: 5rem 0; display: flex; justify-content: space-between;}
.indexFour .box .le {width: 48%; position: relative; overflow: hidden;}
.indexFour .box .le img {display: block; }
.indexFour .box .le .leCon {position: absolute; bottom: 8%; padding: 0 2rem; box-sizing: border-box;}
.indexFour .box .le h6 {font-size: 1.25rem;color: #ffffff;margin-bottom: 0.5rem; display: -webkit-box;overflow: hidden;  	-webkit-line-clamp: 1;-webkit-box-orient: vertical}
.indexFour .box .le p {font-size: 0.94rem;color: #b9b9b9; display: -webkit-box;overflow: hidden;  	-webkit-line-clamp: 2;-webkit-box-orient: vertical}
.indexFour .box ul {width: 48%;}
.indexFour .box li {padding: 1.5rem 0; border-bottom: 1px dashed #DCDCDC; position: relative;}
.indexFour .box li::after {content: ""; width: 0; top: 0; height: 100%; background: #0e14b0; position: absolute; right: -100%; transition: .5s;}
.indexFour .box li:hover::after {width: 215%;}
.indexFour .box li h6 {font-size: 1.25rem;color: #333333; position: relative; z-index: 1; transition: .5s; margin-bottom: 0.5rem; display: -webkit-box;overflow: hidden;  	-webkit-line-clamp: 1;-webkit-box-orient: vertical}
.indexFour .box li p {font-size: 0.88rem;color: #777777;position: relative; z-index: 1;transition: .5s; display: -webkit-box;overflow: hidden;  	-webkit-line-clamp: 2;-webkit-box-orient: vertical}
.indexFour .box li:hover h6 {color: #fff;}
.indexFour .box li:hover p {color: #fff;}


/* 底部 */
.footer .foTop {padding: 1.5rem 0; background: #303030;}
.footer .foTop ul {display: flex; gap: 2rem; row-gap: 0rem; flex-wrap: wrap;}
.footer .foTop ul li a {color: rgba(255,255,255,.47); font-size: 0.88rem;}
.footer .foTop ul li a:hover {color: #fff;}
.footer .foTop strong {font-size: 1rem;color: #ffffff; display: block; font-weight: 400; margin-bottom: 0.4rem;}
.footer .foBom {background: #2d2d2d; padding: 2.5rem 0 1.8rem 0;}
.footer .foBom .bomLe dd {font-size: 0.88rem; color: rgba(255,255,255,.53); margin-top: 0.5rem;}
.footer .foBom .bomLe dd span {color: #ffffff;}
.footer .foBom .bomLe dd a { color: rgba(255,255,255,.53);}
.footer .foBom .bomLe dd a:hover {color: #ffffff;}
.footer .foBom .box {display: flex; justify-content: space-between;}
.footer .foBom .box .bomRe {width: 65%;}
.footer .foBom .box .bomRe ul {display: flex; justify-content: space-between; padding-bottom: 2.4rem; border-bottom: 1px solid rgba(0,0,0,.35);}
.footer .foBom .box .bomRe ul li a {font-size: 1rem;color: rgba(255,255,255,.6);}
.footer .foBom .box .bomRe ul li a:hover {color: #fff;}
.footer .foBom .box .bomRe p {margin-top: 2.5rem; display: flex; justify-content: space-between; flex-wrap: wrap;}
.footer .foBom .box .bomRe p span , .footer .foBom .box .bomRe p span a {font-size: 0.88rem;color: rgba(255,255,255,.58);}
.footer .foBom .box .bomRe p span a:hover {color: #fff;}


/* =====================================================内页=================================================== */
/* 内页banner */
.nyBanner {height: 38rem; position: relative;}
.nyBanner .nyTitle {position: absolute; width: 100%; left: 50%; top: 50%; transform: translate(-50%, -50%);text-align: center;}
.nyBanner .nyTitle h3 {font-size: 3.75rem;font-weight: 700;color: #ffffff;}
.nyBanner .nyTitle h4 {text-transform: uppercase; font-size: 2.13rem;color: rgba(255, 255, 255, 0.16);font-weight: 700;}
.nyBanner ul {display: flex; align-items: center; position: absolute; bottom: 3%;}
.nyBanner ul li a {font-size: 0.94rem;color: #ffffff;}
.nyBanner ul li:nth-child(1) a { background: url(/html/class/template/images/mbx-icon.png) no-repeat left; padding-left: 35px;}
.sever-banner {background: url(/html/class/template/images/sever-banner.jpg) no-repeat center; background-size: cover;}
.about-banner {background: url(/html/class/template/images/about-banner.jpg) no-repeat center; background-size: cover;}
.case-banner {background: url(/html/class/template/images/case-banner.jpg) no-repeat center; background-size: cover;}
.contact-banner {background: url(/html/class/template/images/contact-banner.jpg) no-repeat center; background-size: cover;}
.news-banner {background: url(/html/class/template/images/news-banner.jpg) no-repeat center; background-size: cover;}
.details-banner {background: url(/html/class/template/images/details-banner.jpg) no-repeat center; background-size: cover; height: 18.63rem;}





/* J9国际服务*/
.severOne {padding: 4rem 0 5.5rem 0;}
.severOne .hd ul {display: flex; gap: 5rem; border-bottom: 1px solid #dddd;}
.severOne .hd ul li {font-size: 1.25rem;color: #333333;font-weight: 400;position: relative; padding-bottom: 1.5rem;}
.severOne .hd ul li::after {content: ""; position: absolute; left: 50%; bottom: 0; width: 0; height: 0.19rem; background: #0e14b0; transition: .5s;}
.severOne .hd ul li:hover {color: #0e14b0;}
.severOne .hd ul li:hover::after {width: 100%; left: 0;}
.severOne .hd ul li.on {color: #0e14b0;}
.severOne .hd ul li.on::after {width: 100%; left: 0;}
.severOne .bd {margin: 5rem 0;}
.severOne .bd ul li p {width: 100%; }
.severOne .bd ul li .imgBox {text-align: center;}
.severOne .more {display: flex; justify-content: center;}
.severOne .more a {display: inline-block; width: 13.69rem; text-align: center;line-height: 3.44rem ;font-size: 1.13rem;color: #ffffff;  height: 3.44rem; background: #0e14b0; border: 0.06rem solid #217eca; text-align: center; border-radius: 1.81rem;}

.severTitle {text-align: center; padding: 5rem 0;}
.severTitle h4 {font-size: 2.5rem;color: #333333;font-weight: 700;}
.severTitle span {font-size: 1rem;font-weight: 400;color: #6c6c6c;}
.severTwo {background:url(/html/class/template/images/severTwo-bj.jpg) no-repeat center; background-size: cover;padding-bottom: 10rem;}
.severTwo ul {display: flex; justify-content: space-between;}
.severTwo ul li {text-align: center; width: 25%;}
.severTwo ul li .imgBox {display: flex; align-items: center; margin: auto; justify-content: center; width: 4.75rem; height: 3.69rem; border: 0.13rem solid #3a4bd1; border-radius: 0.94rem 0.94rem 0rem 0.94rem;}
.severTwo ul li .imgBox img {transition: .5s;}
.severTwo ul li h5 {font-size: 1.38rem;color: #333333;font-weight: 400; margin: 2rem 0 1rem 0;}
.severTwo ul li span {font-size: 1rem;display: block; color: #666666;font-weight: 400; width: 60%; margin: auto;}
.severTwo ul li:hover img {transform: rotateY(180deg);}

.severThree {padding-bottom: 6.7rem;}
.severThree ul {display: flex;justify-content: space-between; align-items: center;}
.severThree ul li .imgBox { display: flex; align-items: center;  justify-content: center; border-radius: 50%; width: 9.38rem; height: 9.38rem; background: #ffffff; box-shadow: -0.19rem 0.72rem 1.88rem 0.75rem rgba(10,116,243,0.11); }
.severThree ul li h5 {font-size: 1.25rem;color: #333333;font-weight: 700; text-align: center; margin-top: 2rem;}
.severThree ul li .imgBox img {transition: .5s;}
.severThree ul li:hover .imgBox img {transform: rotateY(180deg);}
.severThree ul li:nth-child(even) {margin-bottom: 3rem;}

.severFour {background:url(/html/class/template/images/severFour-bj.jpg) no-repeat center; background-size: cover;padding-bottom: 8rem;}
.severFour .box {display: flex; justify-content: space-between;}
.severFour dl dd {display: flex; }
.severFour dl dd .iconBox {display: flex; align-items: center;  justify-content: center; margin-right: 1.25rem; border-radius: 50%;width: 5.94rem;height: 5.94rem; background: linear-gradient(0deg,#1a24c2 0%, #4c60d9 100%);}
.severFour dl dd h6 {font-size: 1.25rem;font-weight: 700;color: #333333;}
.severFour dl dd span {display: block;font-size: 1rem;color: #555555;}
.severFour dl dd:nth-child(2) {margin-top: 15rem;}
.severFour dl:nth-child(2) .iconBox {margin-left: 1.25rem; margin-right: 0;}
.severFour dl:nth-child(2) .con {text-align: right;}
.severFour dl dd .iconBox img {transition: .5s;}
.severFour dl dd:hover .iconBox img {transform: rotateY(180deg);}

.severFive {background:url(/html/class/template/images/severFive-bj.jpg) no-repeat center; background-size: cover;padding-bottom: 6.13rem;}
.severFive .severTitle h4 {color: #fff;}
.severFiveSlide .hd {height: 5.38rem;width: 100%; border-top-left-radius: 0.63rem; border-top-right-radius: 0.63rem; padding: 0 1.5rem 0 3rem; box-sizing: border-box; background: #eef4fb; display: flex; align-items: center; justify-content: space-between;}
.severFiveSlide .hd ul li {display: none;}
.severFiveSlide .hd ul li.on {display: block;}

.severFiveSlide .hd .arrow {display: flex; gap: 2rem;}
.severFiveSlide .hd .arrow a {display: block; cursor: pointer; width: 2.75rem; height: 2.75rem; border: 0.06rem solid #cecece; border-radius: 50%; background: url(/html/class/template/images/severFive-jt.png) no-repeat center;}
.severFiveSlide .hd .arrow .prev {transform: rotate(180deg);}
.severFiveSlide .hd h5 {font-size: 1.5rem;color: #333333;font-weight: 400;}
.severFiveSlide .bd {padding: 2.2rem 6.2rem 6.2rem 6.2rem; background-color: #fff; box-sizing: border-box; border-bottom-left-radius: 0.63rem; border-bottom-right-radius: 0.63rem;}
.severFiveSlide .bd ul {position: relative;}
.severFiveSlide .bd ul li {display: flex; margin-top: 2rem;     justify-content: space-between;}
.severFiveSlide .bd ul li strong {width: 15%; font-size: 1.13rem;font-weight: 700;color: #333333;}
.severFiveSlide .bd ul li p  {width: 75%; font-size: 1rem;color: #777777;}
.severFiveSlide .bd ul li .imgBox {width: 20%;}
.severFiveSlide .bd ul li .imgBox img {display: block; width: 100%;}
/* .severFiveSlide .bd ul .severFiveImg {position: absolute; right: 0; top: 0; margin-top: 0;}
.severFiveSlide .bd ul li:nth-child(2),.severFiveSlide .bd ul li:nth-child(3) {width: 80%;}
.severFiveSlide .bd ul li:nth-child(4) strong {width: 12%;}
.severFiveSlide .bd ul li:nth-child(4) p {width: 88%;} */

/* 关于J9国际 */
.aboutOne li .box {display: flex; padding: 6.8rem 0; justify-content: space-between;}
.aboutOne li .imgBox {width: 39%;}
.aboutOne li .imgBox img {display: block; width: 100%;}
.aboutOne li .aboutTle {width: 55%;}
.aboutOne li .aboutTle h3 {font-size: 1.88rem;font-weight: 400;color: #333333; margin-top: 2rem;}
.aboutOne li .aboutTle h5 {font-size: 0.88rem;font-weight: 400;color: #b9b9b9; text-transform: uppercase;}
.aboutOne li .aboutTle p {font-size: 0.94rem;color: #666666;font-weight: 400; margin-top: 2rem; line-height: 30px;}
.aboutOne li:nth-child(even) {background: #f7fafd;}

.aboutTwo {position: relative; padding-bottom: 6rem;}
.aboutTwo .aboutTle {text-align: center; padding: 5rem 0;}
.aboutTwo .aboutTle h3 {font-size: 1.88rem;font-weight: 400;color: #333333; margin-top: 2rem;}
.aboutTwo .aboutTle h5 {font-size: 0.88rem;font-weight: 400;color: #b9b9b9; text-transform: uppercase;}
.aboutTwoSwiper {overflow: hidden;}
.aboutTwoSwiper .swiper-slide {overflow: hidden;}
.aboutTwoSwiper .swiper-slide img {width: 100%; display: block; transition: .5s;}
.aboutTwoSwiper .swiper-slide:hover img {transform: scale(1.05);}
.aboutTwoSwiper .swiper-button-prev {width: 1.31rem; height: 2.56rem; left: 12%; top: 64%; transform: rotate(180deg);  background: #c2c2c2; background: url(/html/class/template/images/aboutTwoSwiper-jt.png) no-repeat center;}
.aboutTwoSwiper .swiper-button-next {width: 1.31rem; height: 2.56rem; right: 12%; top: 64%;   background: #c2c2c2; background: url(/html/class/template/images/aboutTwoSwiper-jt.png) no-repeat center;}

/* 合作案例 */
.caseOne {padding: 4rem 0 7.69rem 0;}
.caseOne ul {display: flex; gap: 1rem; flex-wrap: wrap;}
.caseOne ul li {width: 14.56rem; height: 6.44rem;  background: #ffffff;border: 0.06rem solid #dcdcdc; display: flex; justify-content: center; align-items: center;}
.caseOne ul li a {text-align: center;}
.caseOne ul li img {width: 77%;}

/* 联系我们 */
/* .contactOne {padding: 8.3em 0 6.5rem 0;} */
.contactOne .box {display: flex;justify-content: space-between;padding: 8.3em 0 6.5rem 0;}
.contactOne .box .le {width: 45%;}
.contactOne .box .re {width: 48%;}
.contactOne .box h3 {font-size: 2.13rem;font-weight: 700;color: #333333;}
.contactOne .box h5 {text-transform: uppercase; font-size: 1rem;font-weight: 700;color: #333333; letter-spacing: 0.1rem;}
.contactOne .box dl {margin-top: 4rem;}
.contactOne .box dl dd {display: flex; align-items: center; gap: 0.5rem; margin-top: 2rem;}
.contactOne .box dl dd img {margin-right: 0.3rem;}
.contactOne .box dl dd span {font-size: 1rem;font-weight: 400;color: #333333;}
.contactOne .box dl dd strong {font-size: 1.75rem;color: #333333;font-weight: 700;}
.contactOne .box input {width: 100%; padding-bottom: 1.1rem; font-size: 1rem; color: #333333; border: none; outline: none; border-bottom: 1px solid #ddd; margin-top: 2.5rem;}
.contactOne .box input:first-child {margin-top: 0;}
.contactOne .box input::-webkit-input-placeholder {font-size: 1rem;color: #333333;font-weight: 400;}
.contactOne .box .textCon span {display: block; font-size: 1rem; color: #333333; margin: 2rem 0;}
.contactOne .box .textCon textarea {width: 100%; outline: none; border: none; border-bottom: 1px solid #ddd; }
.contactOne .box .textCon textarea::-webkit-input-placeholder {font-size: 1rem;color: #939393; font-family: "Microsoft YaHei";}
.contactOne .box .subm {background: #2e3bc5; cursor: pointer; height: 3.44rem; line-height: 3.44rem; color: #fff;font-size: 1rem;}
.contactOne .map img {display: block; width: 100%;}
.contactOne .le table p span {display: flex; align-items: center;}

/* 内页资讯中心 */
.information {margin: 20px 0;}
.information ul li {border-bottom: 1px solid #eeeeee;padding: 2.5rem 0;}
.information ul li:last-child {border-bottom: none;}
.information ul li  a{display: flex;justify-content: space-between;}
.information ul li em {font-size: 16px;color: #7a7a7a;float: left;}
.information ul li .info-right {width: 60%; margin-right: 5%; padding: 25px 0; box-sizing: border-box;}
.information ul li h3 {font-size: 1.5rem;color: #333; font-weight: 500; display: -webkit-box;overflow: hidden;  	-webkit-line-clamp: 1;-webkit-box-orient: vertical;}
.information ul li img {transition: 0.5s; display: block; width: 100%;}
.information ul li .info-img {overflow: hidden; width: 30%;}
.information ul li p {font-size: 1.06rem;color: #666;margin: 2rem 0 3rem 0; display: -webkit-box;overflow: hidden;  	-webkit-line-clamp: 2;-webkit-box-orient: vertical;}
.information ul li .info-more {display: flex;align-items: center;}
.information ul li .info-more span:nth-child(1) {display: block;width: 2.31rem;height: 2.31rem; transition: .5s; border-radius: 50%; background: #ddd url(../images/information-jt.png) no-repeat center;}
.information ul li span:nth-child(2) {font-size: 1rem;color: #333;margin-left: 15px;}
.information ul li:hover h3 {color: #1218B4;}
.information ul li:hover img {transform: scale(1.1);}
.information ul li:hover .info-more span:nth-child(1) {background: #1218B4 url(../images/information-jt.png) no-repeat center;}

/* 详情页 */
.ny-news-xq {padding-top:5rem;padding-bottom: 100px; background-color: #fff;}
.ny-news-xq .news-title {border-bottom:1px solid #dcdcdc;position: relative; text-align: left; padding: 0; display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 2rem; padding-bottom:1.5rem;}
.ny-news-xq .news-title h2 {font-size: 2.25rem;line-height: 40px; font-weight: 400; color: #333333;}
.ny-news-xq .news-title .title {width: 100%;}
.ny-news-xq .news-title .backList a {display: block; width: 150px; font-size: 16px; line-height: 45px; background: #1218B4; text-align: center;border-radius: 35px;  color: #fff;  transition: all 0.3s;}
.ny-news-xq .ny-xq-con {margin: 3rem 0;}
.page-fy { border-top:1px solid #ddd;padding-top: 30px; font-size: 1rem;color: #666666; display: flex; flex-wrap: wrap; justify-content: space-between; gap: 1rem;}
.page-fy .prev:hover a {color:#1218B4;}
.page-fy .next:hover a {color:#1218B4;}

/* 分页 */
.pagelist { padding: 10px 0;  margin-top: 15px;  overflow: hidden;  border-top: 0px solid #eee;text-align: center;}
.pagelist a, .pagelist span {   border: 1px solid #ccc;   display: inline-block;   padding: 2px 8px;   margin-right: 5px;}

/*服务流程  */
.processCon p img {image-rendering: inherit !important;}
.processCon .imgBox {display: none;}
.processCon .imgBox img {width: 100%; display: block;}