::-webkit-scrollbar-track { background-color: #fff; } ::-webkit-scrollbar { width: 3px; height: 3px; background-color: #fff; } ::-webkit-scrollbar-thumb { background-color: #ccd1d9; border-radius: 3px; } body { width: 100%; overflow-x: hidden; } input, select { -webkit-appearance: none; outline: none } .width-1200 { width: 1200px; margin: 0 auto; } .width-1100 { width: 1100px; margin: 0 auto; } @font-face { font-family: 'Futura'; src: url('http://ogawa.com.cn/static/css/fonts/Futura%20Koyu.otf'); src: local('☺'), url('http://ogawa.com.cn/static/css/fonts/Futura%20Koyu.woff') format('woff'), url('../font/FuturaKoyu.ttf') format('truetype'), url('http://ogawa.com.cn/static/css/fonts/Futura%20Koyu.svg') format('svg'); font-weight: normal; font-style: normal; } @font-face { font-family: 'Conv_MyriadPro-Regular'; src: url('../font/MyriadPro-Regular.eot'); src: local('☺'), url('http://ogawa.com.cn/static/css/fonts/MyriadPro-Regular.woff') format('woff'), url('../font/MyriadPro-Regular.ttf') format('truetype'), url('http://ogawa.com.cn/static/css/fonts/MyriadPro-Regular.svg') format('svg'); font-weight: normal; font-style: normal; } .iconfont { font-family: "iconfont" !important; font-style: normal; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } /* 绿 #20c401 */ /* 字号 */ .ft-30 { font-size: 26px; } /* PC标题 */ .ft-26 { font-size: 26px } .ft-24 { font-size: 24px; } .ft-22 { font-size: 22px; } .ft-20 { font-size: 20px; } .ft-18 { font-size: 18px; } /* PC二级标题 */ .ft-16 { font-size: 16px; } .ft-15 { font-size: 15px; } .ft-14 { font-size: 14px; } .ft-13 { font-size: 13px; } .ft-12 { font-size: 12px; } .scroll-animate { visibility: hidden; } .flexslider { border: 0; margin: 0; background: transparent; } .flexslider .flex-viewport { height: 100%; } #daoahngM { display: none; } #jsc { color: #5e5e5e; font-size: 14px; text-align: right; padding-top: 18px; } .m-show { display: none; } .m-hide { display: block; } /* 返回顶部 */ #goTop { width: 40px; height: 40px; border-radius: 100%; background-color: #262626; position: fixed; right: 20px; bottom: 20px; display: none; z-index: 888; cursor: pointer; } #goTop img { width: 20px; height: 20px; display: block; position: absolute; top: 0; right: 0; bottom: 0; left: 0; margin: auto; } /* 搜索 */ #search .banner { width: 100%; height: 200px; background-color: #f7f7f7; position: relative; } #search .banner p { color: #333; text-align: center; line-height: 200px; } .search .search-box { width: 100%; overflow: hidden; } .search .search-box .search-lei { margin: 60px auto 40px; } .search .search-box .search-lei ul { border-bottom: 1px solid #eee; } .search .search-box .search-lei ul li { display: inline-block; margin: 0 40px 10px 0; cursor: pointer; } .search .search-box .search-lei ul li.cur { font-size: 24px; } .search .search-box .search-lei ul li.cur a { color: #20c401; } .search .search-box .search-list ul li:hover .title { color: #20c401; transition: all .3s; } /* 1.nav */ .nav { width: 100%; height: 62px; background-color: #262626; position: relative; z-index: 10000; } .nav .width-1200 { position: relative; } .nav .width-1200::after { content: ''; width: 0; height: 0; display: block; clear: both; visibility: hidden; } .nav .width-1200 .nav-logo { line-height: 62px; float: left; } .nav .width-1200 .nav-logo a { width: 130px; height: 62px; display: block; position: relative; } .nav .width-1200 .nav-logo a svg { display: block; position: absolute; top: 0; bottom: 0; margin: auto; } .nav .width-1200 .nav-list { min-width: 500px; width: 700px; position: absolute; left: 0; right: 0; margin: auto; } .nav .width-1200 .nav-list ul::after { content: '.'; width: 0; height: 0; display: block; clear: both; visibility: hidden; } .nav .width-1200 .nav-list ul li { width: 140px; line-height: 62px; text-align: center; float: left; position: relative; z-index: 9999999; } .nav .width-1200 .nav-list ul li a { color: #fff; display: block; } .nav .width-1200 .nav-right { float: right; } .nav .width-1200 .nav-right .nav-righgt-a ul li { width: 20px; height: 62px; margin: 0 0 0 20px; float: left; cursor: pointer; } .nav .width-1200 .nav-right .nav-righgt-a ul li i { color: rgba(255, 255, 255, 0.3); font-size: 20px; line-height: 62px; transition: all .3s; } .nav .width-1200 .nav-right .nav-righgt-a ul li.shu { line-height: 62px; color: rgba(255, 255, 255, 0.3); margin: 0 -14px 0 10px; } .nav .width-1200 .nav-right .nav-righgt-a ul li.sou { position: relative; } .nav .width-1200 .nav-right .nav-righgt-a ul li.sou form { width: 270px; height: 0; background-color: #262626; position: absolute; left: -240px; top: 62px; z-index: 100; overflow: hidden; transition: all .3s; } .nav .width-1200 .nav-right .nav-righgt-a ul li.sou form input, .nav .width-1200 .nav-right .nav-righgt-a ul li.sou form button { height: 16px; margin-top: 17px; background-color: transparent; border: none; } .nav .width-1200 .nav-right .nav-righgt-a ul li.sou form input { width: 246px; height: 20px; border-radius: 6px; background-color: #fff; margin: 13px 12px; text-indent: 10px; font-size: 14px; } .nav .width-1200 .nav-right .nav-righgt-a ul li.sou form button { position: absolute; top: -25px; right: 16px; z-index: 200; } .nav .width-1200 .nav-right .nav-righgt-a ul li.sou form button i { color: #000; font-size: 14px; display: block; position: relative; top: -3px; } .nav .width-1200 .nav-right .nav-righgt-a ul li.sou:hover form { height: 46px; } .nav .width-1200 .nav-right .nav-righgt-a ul li.wx { position: relative; } .nav .width-1200 .nav-right .nav-righgt-a ul li.wx i { font-size: 22px; font-weight: bold; } .nav .width-1200 .nav-right .nav-righgt-a ul li.wx .er { width: 100px; height: 0; background-color: #262626; position: absolute; top: 62px; left: -40px; z-index: 200; overflow: hidden; transition: all .3s; } .nav .width-1200 .nav-right .nav-righgt-a ul li.wx .er img { width: 80px; height: 80px; background-color: #20c401; display: block; margin: 10px; } .nav .width-1200 .nav-right .nav-righgt-a ul li.wx:hover .er { height: 100px; } .nav .width-1200 .nav-right .nav-righgt-a ul li.wb i { font-size: 26px; } .nav .width-1200 .nav-right .nav-righgt-a ul li:hover i { color: white; } .nav .child-nav, .nav .child-nav-aaa { position: absolute; top: 100%; width: 100%; background-color: rgba(0, 0, 0, 0.7); z-index: 10000; } .nav .child-nav ul, .nav .child-nav-aaa ul { max-width: 80%; margin: auto; display: none; } .nav .child-nav ul > li, .nav .child-nav-aaa ul > li { height: 54px; line-height: 54px; display: inline-block; margin: 0 32px; } .nav .child-nav ul > li a, .nav .child-nav-aaa ul > li a { color: #fff; } /* 移动端导航 */ #only-click { display: none; } .menu-button { display: block; position: absolute; top: 20px; left: 20px; background: url(../image/menu.gif) no-repeat; overflow: hidden; width: 34px; height: 31px; text-indent: -9999px; } .menu-button.right { right: 20px; left: auto; display: none; } .menu-button.bottom { top: 100px; } .menu-button.fixed { position: fixed; } #overlay { position: absolute; position: fixed; top: 0; left: 0; bottom: 0; right: 0; width: 100%; height: 100%; background: transparent; z-index: 999998; display: none; } .sidr-open #overlay { display: block; } /* Settings for fullwidth */ .sidr.fullwidth { width: 100%; } .sidr.left.fullwidth { left: -100%; } .sidr.right.fullwidth { right: -100%; } /* 1.1footer */ footer { padding: 0; background-color: #f7f7f7; margin-top: 50px; } footer .footer-top { margin: 0 auto 30px; padding-top: 40px; overflow: hidden; } footer .footer-top .top-left { float: left; } footer .footer-top .top-left.footer-pc { width: 100%; display: flex; justify-content: space-between; } footer .footer-top .top-left.footer-m, footer .footer-top .top-right { display: none; } footer .footer-top .top-left dl { float: left; } footer .footer-top .top-left dl:not(:first-child) { margin-bottom: 0; } footer .footer-top dt { color: #595959; margin-bottom: 16px; } footer .footer-top dd { line-height: 24px; color: #a6a6a6; } footer .footer-top dd a { color: #a6a6a6; } footer .footer-top .top-right { width: 270px; float: right; } footer .footer-heng { width: 100%; height: 1px; background-color: #ebebeb; } footer .footer-bottom { height: 40px; overflow: hidden; } footer .footer-bottom .bottom-left { color: #383838; line-height: 40px; float: left; } footer .footer-bottom .bottom-right { line-height: 40px; float: right; display: none; } footer .footer-bottom .bottom-right .right-map { color: rgba(64, 64, 64, 0.8); text-transform: uppercase; float: left; } footer .footer-bottom .bottom-right .right-map img { margin-right: 10px; } footer .footer-bottom .bottom-right .right-up { margin-left: 20px; float: right; } footer .footer-bottom .bottom-right .right-up i { font-size: 10px; color: rgba(64, 64, 64, 0.5); font-weight: bold; } /* 弹窗视频 */ .video-box { display: none; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.8); position: fixed; top: 0; bottom: 0; left: 0; right: 0; z-index: 999999999; } .video-box .video-video { width: 1200px; height: 675px; /*background-color: #20c401;*/ position: absolute; top: 0; right: 0; bottom: 0; left: 0; margin: auto; } .video-box .video-video video { width: 100%; } .video-box .gb, .video-box .gb1, .video-box .gb2 .video-box .gb3 { width: 40px; height: 40px; position: absolute; top: 0; right: 0; border-radius: 0 0 0 60px; background-color: rgba(255, 255, 255, 0.3); cursor: pointer; } .video-box .gb i, .video-box .gb1 i, .video-box .gb2 i, .video-box .gb3 i { width: 20px; height: 20px; font-size: 20px; color: #fff; line-height: 1; text-align: right; display: block; position: absolute; top: 7px; right: 7px; } /* 2.index */ .index { /* 2.1banner */ /* 2.2index-page */ } .index .banner { width: 100%; /*height: calc(100% - 62px - 90px);*/ height: 75vh; overflow: hidden; border-radius: 0; } .index .banner .slides { height: 100%; } .index .banner .slides li { height: 100%; display: block; color: #fff; background-color: #000; position: relative; } .index .banner .slides li.slides-video .video-bj { height: 100%; } .index .banner .slides li.slides-video .video-bj video { display: block; margin: 0 auto; height: 100%; } .index .banner .slides li.slides-video .width-1200 { position: absolute; top: 0; left: 0; right: 0; margin: auto; } .index .banner .slides li.slides-video .video-btn i { font-size: 80px; width: 100px; height: 100px; color: rgba(255, 255, 255, .8); position: absolute; top: 0; right: 0; bottom: 0; left: 0; margin: auto; } .index .banner .slides li.slides-video .video-title { font-size: 30px; color: #fff; text-align: center; position: absolute; top: 40px; left: 0; right: 0; margin: auto; text-shadow: 0 4px 14px #000; display: none; } .index .banner .slides li .slides-box { width: 100%; height: 100%; background-size: cover; background-position: center center; transition: all 1s ease-in-out; transform: scale(1.2); position: absolute; top: 0; left: 0; } .index .banner .slides li .width-1200 { height: 100%; position: relative; } .index .banner .slides li .width-1200 .banner-left { position: absolute; top: 0; bottom: 0; left: 0; height: 70px; margin: auto; } .index .banner .slides li .width-1200 .banner-left h3 { color: #fff; font-size: 36px; margin: -15px 0 0 0; padding: 0; } .index .banner .slides li .width-1200 .banner-left p { font-size: 20px; } .index .banner .slides li .width-1200 .banner-right { position: absolute; top: 0; bottom: 0; right: 0; width: 320px; height: 70px; margin: auto; font-size: 21px; line-height: 24px; } .index .banner .slides li.flex-active-slide .slides-box { background-size: cover; transform: scale(1); } .index .banner .flex-control-nav { bottom: 10px; z-index: 100; } .index .banner .flex-control-nav li a { width: 16px; background: transparent; box-shadow: none; text-indent: 0; text-shadow: 0 2px 1px rgba(0, 0, 0, 0.35); color: rgba(255, 255, 255, 0.5); font-weight: bold; transition: all .3s; } .index .banner .flex-control-nav li a.flex-active { color: white; } .index .index-page { width: 100%; height: 270px; background: linear-gradient(to right, #fcfeff, #f2f4f5) #2f80ed; overflow: hidden; } .index .index-page ul { height: 100%; } .index .index-page ul .page { width: 33.33%; height: 100%; float: left; position: relative; } .index .index-page ul .page .page-left { margin: 40px 0 0 0; text-align: center; } .index .index-page ul .page .page-left div { color: #404040; font-weight: bold; } .index .index-page ul .page .page-left p { color: #a6a6a6; } .index .index-page ul .page .page-right { width: 100%; height: calc(270px - 91px); position: absolute; left: 0; right: 0; bottom: 0; margin: auto; } .index .index-page ul .page .page-right img { position: absolute; left: 0; right: 0; bottom: 0; margin: auto; } .index .index-page ul .page:nth-child(1) { background-color: #fcfeff; } .index .index-page ul .page:nth-child(2) { background-color: #f7f9fa; position: relative; } .index .index-page ul .page:nth-child(2) .flex-direction-nav { visibility: hidden; } .index .index-page ul .page:nth-child(2) .page-2-btn .btn-div { width: 50px; font-size: 20px; line-height: 290px; position: absolute; text-align: center; top: 0; cursor: pointer; transition: all .3s; } .index .index-page ul .page:nth-child(2) .page-2-btn .btn-div:hover { color: #20c401; } .index .index-page ul .page:nth-child(2) .page-2-btn .btn-left { left: 0; } .index .index-page ul .page:nth-child(2) .page-2-btn .btn-right { right: 0; } .index .index-page ul .page:nth-child(2) .page-2-title { width: 100%; font-size: 14px; color: #a6a6a6; position: absolute; top: 66px; text-align: center; } .index .index-page ul .page:nth-child(2) .page-left { margin: 40px 0 0 0; } .index .index-page ul .page:nth-child(2) .flexsliderMXCP { height: 100%; } .index .index-page ul .page:nth-child(2) .flexsliderMXCP .flex-viewport { height: 100%; } .index .index-page ul .page:nth-child(2) .flexsliderMXCP .slides li { height: 100%; position: relative; } .index .index-page ul .page:nth-child(2) .flexsliderMXCP .slides li a { width: 100%; height: 100%; display: block; } .index .index-page ul .page:nth-child(2) .flexsliderMXCP .flex-control-nav { display: none; } .index .index-page ul .page:nth-child(2) .flexsliderMXCP .flex-direction-nav a { height: 60px; opacity: 1; } .index .index-page ul .page:nth-child(2) .flexsliderMXCP .flex-direction-nav a::before { color: #ddd; } .index .index-page ul .page:nth-child(2) .flexsliderMXCP .flex-direction-nav .flex-prev { left: 10px; } .index .index-page ul .page:nth-child(2) .flexsliderMXCP .flex-direction-nav .flex-next { right: 10px; } .index .index-page ul .page:nth-child(2) .flexsliderMXCP ul li .page-left p { font-size: 16px; color: #404040; font-weight: bold; } .index .index-page ul .page:nth-child(2) .flexsliderMXCP ul li .page-right img { height: 200px; } .index .index-page ul .page:nth-child(3) { background-color: #f2f4f5; } .index footer { margin-top: 0; } /* 3.product */ .product.ft-26, .product .ft-14 { font-weight: normal; } /* 明星产品-背景图 */ /* yi */ .product.product-yi .page-1p { background-image: url('../image/banner_201907.png') } .product.product-yi .page-2p { background-image: url('../image/bg.jpg'); background-repeat: no-repeat; background-position: bottom; background-color: #000; background-size: 90%; } .product.product-yi .page-6p .pic img { max-width: 970px; } /* @1450 */ @media screen and (max-width: 1450px) { .product.product-yi .page-2p { background-size: 70%; } } .product footer { margin-top: 0; } .product.product-index { } .product.product-index .product-i-box { height: calc(100% - 62px - 41px); min-height: 650px; padding-top: 50px; position: relative; /* 弹窗 */ } .product.product-index .product-i-box .product-logo { width: 240px; margin: 0 auto; text-align: center; } .product.product-index .product-i-box .product-logo .title { font-size: 14px; color: #262626; margin: -24px 0 5px 0; } .product.product-index .product-i-box .product-logo .text { font-size: 20px; line-height: 28px; color: rgba(64, 64, 64, 0.5); } .product.product-index .product-i-box .chanpin-box { margin-top: 100px; overflow: hidden; } .product.product-index .product-i-box .chanpin-box.on { /*filter: blur(5px);*/ } .product.product-index .product-i-box .chanpin { width: 300px; border-right: 1px solid rgba(0, 0, 0, 0.1); box-sizing: border-box; float: left; padding-bottom: 24px; } .product.product-index .product-i-box .chanpin .chanpin-img { width: 100%; height: 234px; position: relative; } .product.product-index .product-i-box .chanpin .chanpin-img img { position: absolute; top: 0; right: 0; bottom: 0; left: 0; margin: auto; } .product.product-index .product-i-box .chanpin .yema { width: 172px; height: 107px; background-repeat: no-repeat; background-position: center center; margin: 0 auto; } .product.product-index .product-i-box .chanpin .yema p { text-align: center; line-height: 107px; font-size: 15px; color: #000; font-weight: bold; } .product.product-index .product-i-box .chanpin:nth-child(1) { border-left: 1px solid rgba(0, 0, 0, 0.1); } /* .product.product-index .product-i-box .chanpin:nth-child(1) .yema { background-image: url("../image/product-1-num.png"); } .product.product-index .product-i-box .chanpin:nth-child(2) .yema { background-image: url("../image/product-2-num.png"); } .product.product-index .product-i-box .chanpin:nth-child(3) .yema { background-image: url("../image/product-3-num.png"); } .product.product-index .product-i-box .chanpin:nth-child(4) .yema { background-image: url("../image/product-4-num.png"); } */ .product.product-index .product-i-box .chanpin-tan { /*visibility: hidden;*/ width: 100%; background: rgba(255, 255, 255, 0.9); position: absolute; overflow: hidden; } .product.product-index .product-i-box .chanpinM { display: none; } .product.product-index .product-i-box .chanpin-tan.on { visibility: visible; } .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box { height: 100%; position: relative; } .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin { width: 300px; /*visibility: hidden;*/ position: absolute; } .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin .flex-direction-nav a { height: 50px; } .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin .left { width: 300px; position: relative; } .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin .left .chanpin-title { width: 160px; height: 42px; background-image: url("../image/title-bj.png"); border-radius: 21px; display: none; } .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin .left .chanpin-title p { text-align: center; line-height: 42px; font-size: 15px; font-weight: bold; color: #262626; letter-spacing: 5px; } .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin .left .chanpin-img { width: 100%; height: 234px; position: relative; } .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin .left .chanpin-img img { position: absolute; top: 0; right: 0; bottom: 0; left: 0; margin: auto; } .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin .left .yema { width: 172px; height: 107px; background-repeat: no-repeat; background-position: center center; margin: 0 auto; } .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin .left .yema p { text-align: center; line-height: 107px; font-size: 15px; color: #000; font-weight: bold; } .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin .left .jian-ti { width: 130px; height: 53px; display: block; position: absolute; right: -160px; top: 97px; } .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin .left .jian-you, .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin .left .jian-zuo { width: 25px; height: 50px; cursor: pointer; position: absolute; z-index: 0; overflow: hidden; } .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin .left .jian-you div, .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin .left .jian-zuo div { width: 25px; height: 50px; background-color: #000; vertical-align: middle; position: relative; transition: all .3s; } .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin .left .jian-you div i, .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin .left .jian-zuo div i { width: 25px; height: 14px; font-size: 14px; color: #fff; line-height: 10px; display: block; text-align: center; vertical-align: middle; position: absolute; top: 50%; transform: translateY(-50%); } .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin .left .jian-you div:hover, .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin .left .jian-zuo div:hover { background-color: #20c401; } .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin .left .jian-you { top: 27%; right: -25px; } .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin .left .jian-you div { border-radius: 0 25px 25px 0; } .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin .left .jian-zuo { top: 50%; right: 0; } .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin .left .jian-zuo div { border-radius: 25px 0 0 25px; margin-left: 25px; } .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin .right { height: 100%; padding: 100px 150px 100px 100px; position: absolute; top: 0; right: 0; visibility: hidden; overflow-x: hidden; overflow-y: auto; } .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin .right .right-box { height: 0; overflow: hidden; } .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin .right .right-box .flexslider, .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin .right .right-box .swiper-container { height: 342px; border-bottom: 1px dashed #ddd; position: relative; cursor: col-resize; } .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin .right .right-box .flexslider.zhua, .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin .right .right-box .swiper-container.zhua { cursor: -webkit-grabbing; } .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin .right .right-box .flexslider .num, .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin .right .right-box .swiper-container .num { width: 100%; height: 30px; background-repeat: no-repeat; background-position: right bottom; background-size: contain; position: absolute; bottom: -1px; right: 0; z-index: 100; } .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin .right .right-box .flexslider .slides li, .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin .right .right-box .flexslider .slides .swiper-slide, .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin .right .right-box .flexslider .swiper-wrapper li, .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin .right .right-box .flexslider .swiper-wrapper .swiper-slide, .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin .right .right-box .swiper-container .slides li, .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin .right .right-box .swiper-container .slides .swiper-slide, .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin .right .right-box .swiper-container .swiper-wrapper li, .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin .right .right-box .swiper-container .swiper-wrapper .swiper-slide { width: 426px; height: 176px; background-color: #f5f5f5; margin-top: 97px; margin-right: 60px; position: relative; } .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin .right .right-box .flexslider .slides li:hover .li-left .li-top, .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin .right .right-box .flexslider .slides .swiper-slide:hover .li-left .li-top, .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin .right .right-box .flexslider .swiper-wrapper li:hover .li-left .li-top, .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin .right .right-box .flexslider .swiper-wrapper .swiper-slide:hover .li-left .li-top, .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin .right .right-box .swiper-container .slides li:hover .li-left .li-top, .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin .right .right-box .swiper-container .slides .swiper-slide:hover .li-left .li-top, .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin .right .right-box .swiper-container .swiper-wrapper li:hover .li-left .li-top, .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin .right .right-box .swiper-container .swiper-wrapper .swiper-slide:hover .li-left .li-top { color: #20c401; } .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin .right .right-box .flexslider .slides li:hover .li-right img, .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin .right .right-box .flexslider .slides .swiper-slide:hover .li-right img, .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin .right .right-box .flexslider .swiper-wrapper li:hover .li-right img, .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin .right .right-box .flexslider .swiper-wrapper .swiper-slide:hover .li-right img, .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin .right .right-box .swiper-container .slides li:hover .li-right img, .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin .right .right-box .swiper-container .slides .swiper-slide:hover .li-right img, .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin .right .right-box .swiper-container .swiper-wrapper li:hover .li-right img, .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin .right .right-box .swiper-container .swiper-wrapper .swiper-slide:hover .li-right img { top: -20px; } .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin .right .right-box .flexslider .slides li:hover .li-flex, .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin .right .right-box .flexslider .slides .swiper-slide:hover .li-flex, .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin .right .right-box .flexslider .swiper-wrapper li:hover .li-flex, .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin .right .right-box .flexslider .swiper-wrapper .swiper-slide:hover .li-flex, .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin .right .right-box .swiper-container .slides li:hover .li-flex, .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin .right .right-box .swiper-container .slides .swiper-slide:hover .li-flex, .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin .right .right-box .swiper-container .swiper-wrapper li:hover .li-flex, .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin .right .right-box .swiper-container .swiper-wrapper .swiper-slide:hover .li-flex { bottom: -26px; } .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin .right .right-box .flexslider .slides li .li-left .li-top, .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin .right .right-box .flexslider .slides .swiper-slide .li-left .li-top, .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin .right .right-box .flexslider .swiper-wrapper li .li-left .li-top, .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin .right .right-box .flexslider .swiper-wrapper .swiper-slide .li-left .li-top, .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin .right .right-box .swiper-container .slides li .li-left .li-top, .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin .right .right-box .swiper-container .slides .swiper-slide .li-left .li-top, .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin .right .right-box .swiper-container .swiper-wrapper li .li-left .li-top, .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin .right .right-box .swiper-container .swiper-wrapper .swiper-slide .li-left .li-top { font-size: 16px; font-weight: bold; color: #404040; margin: 20px 0 0 20px; transition: all .3s; } .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin .right .right-box .flexslider .slides li .li-left .li-bottom, .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin .right .right-box .flexslider .slides .swiper-slide .li-left .li-bottom, .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin .right .right-box .flexslider .swiper-wrapper li .li-left .li-bottom, .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin .right .right-box .flexslider .swiper-wrapper .swiper-slide .li-left .li-bottom, .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin .right .right-box .swiper-container .slides li .li-left .li-bottom, .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin .right .right-box .swiper-container .slides .swiper-slide .li-left .li-bottom, .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin .right .right-box .swiper-container .swiper-wrapper li .li-left .li-bottom, .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin .right .right-box .swiper-container .swiper-wrapper .swiper-slide .li-left .li-bottom { position: absolute; left: 20px; bottom: 20px; } .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin .right .right-box .flexslider .slides li .li-left .li-bottom p, .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin .right .right-box .flexslider .slides .swiper-slide .li-left .li-bottom p, .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin .right .right-box .flexslider .swiper-wrapper li .li-left .li-bottom p, .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin .right .right-box .flexslider .swiper-wrapper .swiper-slide .li-left .li-bottom p, .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin .right .right-box .swiper-container .slides li .li-left .li-bottom p, .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin .right .right-box .swiper-container .slides .swiper-slide .li-left .li-bottom p, .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin .right .right-box .swiper-container .swiper-wrapper li .li-left .li-bottom p, .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin .right .right-box .swiper-container .swiper-wrapper .swiper-slide .li-left .li-bottom p { font-size: 13px; color: #999999; } .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin .right .right-box .flexslider .slides li .li-right, .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin .right .right-box .flexslider .slides .swiper-slide .li-right, .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin .right .right-box .flexslider .swiper-wrapper li .li-right, .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin .right .right-box .flexslider .swiper-wrapper .swiper-slide .li-right, .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin .right .right-box .swiper-container .slides li .li-right, .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin .right .right-box .swiper-container .slides .swiper-slide .li-right, .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin .right .right-box .swiper-container .swiper-wrapper li .li-right, .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin .right .right-box .swiper-container .swiper-wrapper .swiper-slide .li-right { width: 100px; height: 250px; position: absolute; bottom: 0; right: 0; } .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin .right .right-box .flexslider .slides li .li-right img, .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin .right .right-box .flexslider .slides .swiper-slide .li-right img, .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin .right .right-box .flexslider .swiper-wrapper li .li-right img, .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin .right .right-box .flexslider .swiper-wrapper .swiper-slide .li-right img, .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin .right .right-box .swiper-container .slides li .li-right img, .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin .right .right-box .swiper-container .slides .swiper-slide .li-right img, .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin .right .right-box .swiper-container .swiper-wrapper li .li-right img, .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin .right .right-box .swiper-container .swiper-wrapper .swiper-slide .li-right img { position: absolute; top: 0; bottom: 0; left: 0; right: 0; margin: auto; transition: all .3s; } .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin .right .right-box .flexslider .slides li .li-flex, .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin .right .right-box .flexslider .slides .swiper-slide .li-flex, .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin .right .right-box .flexslider .swiper-wrapper li .li-flex, .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin .right .right-box .flexslider .swiper-wrapper .swiper-slide .li-flex, .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin .right .right-box .swiper-container .slides li .li-flex, .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin .right .right-box .swiper-container .slides .swiper-slide .li-flex, .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin .right .right-box .swiper-container .swiper-wrapper li .li-flex, .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin .right .right-box .swiper-container .swiper-wrapper .swiper-slide .li-flex { width: 100%; height: 26px; position: absolute; bottom: 0; left: 0; z-index: -1; transition: all .3s; display: flex; } .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin .right .right-box .flexslider .slides li .li-flex a, .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin .right .right-box .flexslider .slides .swiper-slide .li-flex a, .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin .right .right-box .flexslider .swiper-wrapper li .li-flex a, .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin .right .right-box .flexslider .swiper-wrapper .swiper-slide .li-flex a, .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin .right .right-box .swiper-container .slides li .li-flex a, .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin .right .right-box .swiper-container .slides .swiper-slide .li-flex a, .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin .right .right-box .swiper-container .swiper-wrapper li .li-flex a, .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin .right .right-box .swiper-container .swiper-wrapper .swiper-slide .li-flex a { width: 33.33%; font-size: 12px; line-height: 26px; color: #fff; text-align: center; flex: 1; cursor: pointer; } .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin .right .right-box .flexslider .slides li .li-flex a:hover, .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin .right .right-box .flexslider .slides .swiper-slide .li-flex a:hover, .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin .right .right-box .flexslider .swiper-wrapper li .li-flex a:hover, .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin .right .right-box .flexslider .swiper-wrapper .swiper-slide .li-flex a:hover, .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin .right .right-box .swiper-container .slides li .li-flex a:hover, .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin .right .right-box .swiper-container .slides .swiper-slide .li-flex a:hover, .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin .right .right-box .swiper-container .swiper-wrapper li .li-flex a:hover, .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin .right .right-box .swiper-container .swiper-wrapper .swiper-slide .li-flex a:hover { background-color: #20c401; } .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin .right .right-box .flexslider .slides li .li-flex .details, .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin .right .right-box .flexslider .slides .swiper-slide .li-flex .details, .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin .right .right-box .flexslider .swiper-wrapper li .li-flex .details, .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin .right .right-box .flexslider .swiper-wrapper .swiper-slide .li-flex .details, .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin .right .right-box .swiper-container .slides li .li-flex .details, .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin .right .right-box .swiper-container .slides .swiper-slide .li-flex .details, .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin .right .right-box .swiper-container .swiper-wrapper li .li-flex .details, .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin .right .right-box .swiper-container .swiper-wrapper .swiper-slide .li-flex .details { background-color: #000000; } .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin .right .right-box .flexslider .slides li .li-flex .buy, .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin .right .right-box .flexslider .slides .swiper-slide .li-flex .buy, .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin .right .right-box .flexslider .swiper-wrapper li .li-flex .buy, .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin .right .right-box .flexslider .swiper-wrapper .swiper-slide .li-flex .buy, .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin .right .right-box .swiper-container .slides li .li-flex .buy, .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin .right .right-box .swiper-container .slides .swiper-slide .li-flex .buy, .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin .right .right-box .swiper-container .swiper-wrapper li .li-flex .buy, .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin .right .right-box .swiper-container .swiper-wrapper .swiper-slide .li-flex .buy { background-color: #333333; } .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin .right .right-box .flexslider .slides li .li-flex .line, .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin .right .right-box .flexslider .slides .swiper-slide .li-flex .line, .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin .right .right-box .flexslider .swiper-wrapper li .li-flex .line, .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin .right .right-box .flexslider .swiper-wrapper .swiper-slide .li-flex .line, .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin .right .right-box .swiper-container .slides li .li-flex .line, .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin .right .right-box .swiper-container .slides .swiper-slide .li-flex .line, .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin .right .right-box .swiper-container .swiper-wrapper li .li-flex .line, .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin .right .right-box .swiper-container .swiper-wrapper .swiper-slide .li-flex .line { background-color: #595959; } .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin .right .right-box .flexslider .flex-control-nav, .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin .right .right-box .swiper-container .flex-control-nav { display: none; } .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin:nth-child(1) { border-left: none; left: calc(50% - 600px); } .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin:nth-child(2) { left: calc(50% - 300px); } .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin:nth-child(3) { left: calc(50%); } .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin:nth-child(4) { left: calc(50% + 300px); } .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin.on { visibility: visible; } .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin.on .left { width: 300px; border-right: 1px solid rgba(0, 0, 0, 0.1); } .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin.on .left .chanpin-img { transform: scale(1.2); transition: all .5s; } .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin.on .left .yema p { font-size: 28px; transition: all .5s; } .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin.on .left .jian-you img { margin-left: 0; transition: all .5s; } .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin.on .right { visibility: hidden; } .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin.on:nth-child(1) { border-left: none; } .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin.cur { width: 100%; height: 100%; padding: 0; left: 0; background-color: rgba(255, 255, 255, 0.5); } .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin.cur .left { width: 500px; height: 100%; border-right: none; box-shadow: 0 0 40px rgba(0, 0, 0, 0.5); padding-top: 190px; background-color: #fff; cursor: auto; } .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin.cur .left .jian-ti { display: none; } .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin.cur .left .chanpin-title { margin: 0 auto 80px; display: block; } .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin.cur .left .jian-you div { margin-left: -25px; } .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin.cur .left .jian-zuo div { margin-left: 0; } .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin.cur .right { visibility: visible; } .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin.cur .right::-webkit-scrollbar-track { border-radius: 0; background-color: #F1F1F1; } .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin.cur .right::-webkit-scrollbar { width: 3px; height: 3px; background-color: #D3D3D3; } .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin.cur .right::-webkit-scrollbar-thumb { border-radius: 0; background-color: #BFBEBE; } .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin.cur .right .right-box { height: auto; } .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin:nth-child(1) { border-left: 1px solid rgba(0, 0, 0, 0.1); } .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin:nth-child(1) .yema { background-image: url("../image/product-1-num.png"); } .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin:nth-child(2) .yema { background-image: url("../image/product-2-num.png"); } .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin:nth-child(3) .yema { background-image: url("../image/product-3-num.png"); } .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin:nth-child(4) .yema { background-image: url("../image/product-4-num.png"); } .product.product-index footer { background-color: #f2f4f5; } .product.product-index footer .footer-top { display: none; } .product .page { width: 100%; height: 100vh; background-size: cover; background-position: center center; position: relative; overflow: hidden; } .product .page .width-1200 { height: 100%; position: relative; } .product .page .page-text { position: absolute; } .product .page .page-text div { font-weight: lighter; line-height: 55px; } .product .page .page-text .page-title { margin-bottom: 14px; } .product .page .page-text .page-p { margin-bottom: 100px; } .product .page .page-text ul { margin-top: 130px; } .product .page .page-text ul li { line-height: 50px; } .product .page .page-text.page-text-bai { color: #fff; } .product .page .page-text.page-text-hei { color: #000; } .product .page .page-text .gobuy { margin-top: 90px; } .product .page .page-text .gobuy a { color: #0070c9; } .product .page table tr td { line-height: 50px; } .product .page table tr td:first-child { width: 168px; font-weight: bold; } .product .page table tr td:last-child { width: 320px; border-bottom: 1px solid #ccd1d9; } .product .page .page-img img { position: absolute; } .product .page .page-img .flex-viewport { height: 100vh; } .product .page .page-img .flex-viewport ul { height: 100vh; } .product .page .page-img .flex-viewport ul li { height: 100vh; background-size: cover; } .product .page .page-img .flex-viewport ul li img { width: 100%; height: 100vh; position: static; } .product .page .page-img .flex-control-nav { width: 12px; height: 76px; top: 0; bottom: 0; right: 40px; margin: auto; } .product .page .page-img .flex-control-nav li { margin: 0; } .product .page .page-img .flex-control-nav li a { background: rgba(255, 255, 255, 0.3); } .product .page .page-img .flex-control-nav li .flex-active { background-color: #fff; } .product .page .video-btn { width: 100%; position: absolute; bottom: 15%; } .product .page .video-btn p { color: #fff; text-align: center; margin-bottom: 20px; } .product .page .video-btn .btn-boo, .product .page .video-btn .btn-boo1, .product .page .video-btn .btn-boo2. .product .page .video-btn .btn-boo3 { width: 110px; height: 110px; border-radius: 100%; /*border: 1px solid rgba(255, 255, 255, 0.1);*/ box-sizing: border-box; cursor: pointer; position: relative; top: 0; bottom: 0; left: 0; right: 0; margin: auto; } .product .page .video-btn .btn-boo i, .product .page .video-btn .btn-boo1 i, .product .page .video-btn .btn-boo2 i, .product .page .video-btn .btn-boo3 i { font-size: 80px; color: #fff; line-height: 1; display: block; text-align: center; } .product .page .video-btn .btn-boo::before { /*content: '';*/ width: 78px; height: 78px; border-radius: 100%; background-color: rgba(255, 255, 255, 0.1); position: absolute; top: 0; right: 0; bottom: 0; left: 0; margin: auto; } .product .page .video-btn .btn-boo::after { /*content: '';*/ width: 62px; height: 62px; border-radius: 100%; background-color: rgba(255, 255, 255, 0.7); position: absolute; top: 0; right: 0; bottom: 0; left: 0; margin: auto; } .product.product-bri .page-text { top: -120px; bottom: 0; left: 0; margin: auto; } .product.product-bri .page-1 { background-image: url("../image/page-1.jpg"); } .product.product-bri .page-1 .page-img img { top: 0; right: 0; bottom: 0; left: 0; margin: auto; } .product.product-bri .page-1 .page-img img:not(:first-child) { display: none; } .product.product-bri .page-1 .page-btn { width: 130px; position: absolute; right: 0; bottom: 45px; overflow: hidden; } .product.product-bri .page-1 .page-btn .btn-left { width: 29px; height: 24px; float: left; position: relative; cursor: pointer; } .product.product-bri .page-1 .page-btn .btn-left div { border-top: 6.5px solid transparent; border-bottom: 6.5px solid transparent; border-right: 10px solid #414141; position: absolute; left: 0; bottom: 0; } .product.product-bri .page-1 .page-btn .btn-text { float: left; } .product.product-bri .page-1 .page-btn .btn-text span { font-size: 20px; color: #424141; line-height: 1em; } .product.product-bri .page-1 .page-btn .btn-text span.cur { font-size: 30px; color: #ff9e00; } .product.product-bri .page-1 .page-btn .btn-right { width: 29px; height: 24px; float: right; position: relative; cursor: pointer; } .product.product-bri .page-1 .page-btn .btn-right div { border-top: 6.5px solid transparent; border-bottom: 6.5px solid transparent; border-left: 10px solid #414141; position: absolute; right: 0; bottom: 0; } .product.product-bri .page-2 { background: radial-gradient(#fff 30%, #cbd4d6 130%); } .product.product-bri .page-2 .page-img img { top: 0; right: 0; bottom: 0; margin: auto; } .product.product-bri .page-3 { background-image: url("../image/page-3.jpg"); } .product.product-bri .page-3 .page-3-yuan { width: 100%; height: 100%; position: relative; } .product.product-bri .page-3 .page-3-yuan svg { width: 657px; height: 657px; position: absolute; top: 0; right: 0; bottom: 0; left: 0; margin: auto; } .product.product-bri .page-3 .page-3-yuan .page-title { font-size: 45px; color: #fff; text-align: center; font-weight: bold; } .product.product-bri .page-3 .page-3-yuan .page-dian { width: 657px; height: 657px; color: #fff; position: absolute; top: 0; right: 0; bottom: 0; left: 0; margin: auto; } .product.product-bri .page-3 .page-3-yuan .page-dian ul { position: relative; } .product.product-bri .page-3 .page-3-yuan .page-dian ul li { width: 16px; height: 16px; border-radius: 100%; background-color: #d2d2d2; position: absolute; margin: -8px 0 0 -8px; } .product.product-bri .page-3 .page-3-yuan .page-dian ul li .dian-img { width: 70px; height: 70px; background-color: #fff; border-radius: 100%; position: absolute; top: -27px; left: -27px; transform: scale(0); transition: all .3s; } .product.product-bri .page-3 .page-3-yuan .page-dian ul li .dian-img img { position: absolute; top: 0; right: 0; bottom: 0; left: 0; margin: auto; } .product.product-bri .page-3 .page-3-yuan .page-dian ul li .dian-p { width: 150px; color: #fff; font-size: 22px; position: absolute; } .product.product-bri .page-3 .page-3-yuan .page-dian ul li:nth-child(1) .dian-p { top: -74px; left: -67px; text-align: center; } .product.product-bri .page-3 .page-3-yuan .page-dian ul li:nth-child(6) .dian-p { top: 52px; left: -67px; text-align: center; } .product.product-bri .page-3 .page-3-yuan .page-dian ul li:nth-child(2) .dian-p { top: -32px; left: 50px; text-align: left; } .product.product-bri .page-3 .page-3-yuan .page-dian ul li:nth-child(10) .dian-p { top: -32px; right: 50px; text-align: right; } .product.product-bri .page-3 .page-3-yuan .page-dian ul li:nth-child(3) .dian-p { top: -10px; left: 50px; text-align: left; } .product.product-bri .page-3 .page-3-yuan .page-dian ul li:nth-child(4) .dian-p { top: -10px; left: 50px; text-align: left; } .product.product-bri .page-3 .page-3-yuan .page-dian ul li:nth-child(8) .dian-p { top: -10px; right: 50px; text-align: right; } .product.product-bri .page-3 .page-3-yuan .page-dian ul li:nth-child(9) .dian-p { top: -10px; right: 50px; text-align: right; } .product.product-bri .page-3 .page-3-yuan .page-dian ul li:nth-child(5) .dian-p { top: 12px; left: 50px; text-align: left; } .product.product-bri .page-3 .page-3-yuan .page-dian ul li:nth-child(7) .dian-p { top: 0; right: 50px; text-align: right; } .product.product-bri .page-3 .page-3-yuan .page-dian ul li.on .dian-img { transform: scale(1); } .product.product-bri .page-4 { background: radial-gradient(#fff 30%, #cbd4d6 130%); } .product.product-bri .page-4 .page-text { z-index: 100; } .product.product-bri .page-4 .page-img img { top: 0; right: 0; bottom: 0; margin: auto; } .product.product-bri .page-5 { background-image: url("../image/page-5.jpg"); } .product.product-bri .page-5 .page-text { z-index: 100; } .product.product-bri .page-6 { background: radial-gradient(#fff 30%, #d9f1f7 130%); } .product.product-bri .page-6 .width-1200 { padding: 100px 0; } .product.product-bri .page-6 .page-text { width: 626px; position: static; margin: 0; z-index: 100; } .product.product-bri .page-6 .page-text .page-title { margin-bottom: 14px; } .product.product-bri .page-6 .page-text .page-p { font-size: 16px; margin-bottom: 100px; } .product.product-bri .page-6 .page-text .page-table { width: 530px; overflow: auto; } .product.product-bri .page-6 .page-img img { top: 0; right: 200px; bottom: 0; margin: auto; } .product.product-bri .page-6 .page-img img:not(:first-child) { display: none; } .product.product-bri .page-6 .page-btn { height: 100px; position: absolute; top: 0; right: 0; bottom: 0; margin: auto; } .product.product-bri .page-6 .page-btn ul li { overflow: hidden; } .product.product-bri .page-6 .page-btn ul li p { font-size: 20px; color: rgba(0, 0, 0, 0.2); line-height: 40px; margin-right: 20px; float: left; transition: al .3s; } .product.product-bri .page-6 .page-btn ul li .btn-boox { width: 40px; height: 40px; float: left; position: relative; } .product.product-bri .page-6 .page-btn ul li .btn-boox .btn-boox-kuang { width: 0; height: 0; border: 1px solid rgba(0, 0, 0, 0); border-radius: 100%; position: absolute; top: 20px; left: 20px; transition: all .3s; } .product.product-bri .page-6 .page-btn ul li .btn-boox .btn-boox-yuan { width: 16px; height: 16px; background-color: rgba(0, 0, 0, 0.2); border-radius: 100%; position: absolute; top: 12px; left: 12px; transition: all .3s; } .product.product-bri .page-6 .page-btn ul li:first-child { margin-bottom: 20px; } .product.product-bri .page-6 .page-btn ul li.on p { color: #000; } .product.product-bri .page-6 .page-btn ul li.on .btn-boox .btn-boox-kuang { width: 40px; height: 40px; top: 0; left: 0; border: 1px solid #6accd4; } .product.product-bri .page-6 .page-btn ul li.on .btn-boox .btn-boox-yuan { background-color: #6accd4; } .product.product-cozzia .page-text { width: 100%; text-align: center; top: 140px; z-index: 555; } .product.product-cozzia .page-text p { margin: 0 auto; } .product.product-cozzia .page-1 { background-image: url("../image/page-13.jpg"); } .product.product-cozzia .page-1 .page-text { width: 40%; left: 50%; top: 40%; } .product.product-cozzia .page-1 .page-text div { margin-bottom: 10px; } .product.product-cozzia .page-1 .page-text p { letter-spacing: 20px; } .product.product-cozzia .page-1 .page-img { width: 50%; } .product.product-cozzia .page-1 .page-img img { width: 50%; position: absolute; bottom: 0; left: 160px; } .product.product-cozzia .page-1 .page-1-logo { width: 100px; height: 30px; position: absolute; right: 30px; bottom: 20px; } .product.product-cozzia .page-2 { background-image: url('../image/cozzia-2-bj.png'); background-size: cover; background-position: center center; } .product.product-cozzia .page-2 .page-img img { position: absolute; bottom: 0; left: 0; right: 0; margin: auto; } .product.product-cozzia .page-3 { background-color: #000; overflow: hidden; } .product.product-cozzia .page-text ul { margin-top: 0; } .product.product-cozzia .page-text ul li { line-height: 2em; } .product.product-cozzia .page-text ul li:not(:first-child) { display: none; } .product.product-cozzia .page-3 .page-text p { width: 666px; } .product.product-cozzia .page-4 { background-image: url("../image/img-4.gif"); } .product.product-cozzia .page-4 .page-text p { width: 666px; } .product.product-cozzia .page-5 { background-color: #fff; overflow: hidden; } .product.product-cozzia .page-6 { background-color: #000; overflow: hidden; } .product.product-cozzia .page-6:before { content: ''; width: 100%; height: 60vh; background: linear-gradient(to bottom, rgba(0, 0, 0, 1) 55%, rgba(0, 0, 0, 0)); position: absolute; top: 0; left: 0; z-index: 1; } .product.product-cozzia .page-7 { background-color: #fff; overflow: hidden; } .product.product-cozzia .page-7 .page-img { width: 900px; height: 725px; margin: auto; position: absolute; left: 0; right: 0; bottom: 0; } .product.product-cozzia .page-7 .page-img img { width: 900px; position: static; } .product.product-cozzia .page-7 .page-img ul { position: absolute; top: 0; left: 0; z-index: 666; } .product.product-cozzia .page-7 .page-img ul li { /*width: 400px;*/ position: absolute; } .product.product-cozzia .page-7 .page-img ul li .tan-left { width: 27px; height: 27px; border-radius: 100%; background-color: #ef484c; position: relative; float: left; } .product.product-cozzia .page-7 .page-img ul li .tan-left::before { content: ''; width: 14px; height: 2px; background-color: #fff; position: absolute; top: 13px; left: 7px; } .product.product-cozzia .page-7 .page-img ul li .tan-left::after { content: ''; width: 2px; height: 14px; background-color: #fff; position: absolute; top: 7px; left: 13px; } .product.product-cozzia .page-7 .page-img ul li .tan-right { width: 220px; padding: 40px 40px; border-radius: 20px; background-color: #fff; float: left; margin-left: 55px; box-shadow: 0 14px 51px rgba(0, 0, 0, 0.35); transform: translateY(-50%); position: relative; z-index: 100; display: none; } .product.product-cozzia .page-7 .page-img ul li .tan-right::before { content: ''; border-top: 15px solid transparent; border-bottom: 15px solid transparent; border-right: 20px solid #fff; position: absolute; top: 50%; left: -20px; } .product.product-cozzia .page-7 .page-img ul li .tan-right div { font-size: 15px; color: #c13130; margin-bottom: 10px; } .product.product-cozzia .page-7 .page-img ul li .tan-right .close { display: none; } .product.product-cozzia .page-7 .page-img ul li .tan-right p { font-size: 12px; color: #808080; } .product.product-cozzia .page-7 .page-img ul li:nth-child(1) { top: 50px; left: 580px; } .product.product-cozzia .page-7 .page-img ul li:nth-child(2) { top: 117px; left: 258px; } .product.product-cozzia .page-7 .page-img ul li:nth-child(3) { top: 164px; left: 430px; } .product.product-cozzia .page-7 .page-img ul li:nth-child(4) { top: 184px; left: 304px; } .product.product-cozzia .page-7 .page-img ul li:nth-child(5) { top: 282px; left: 405px; } .product.product-cozzia .page-7 .page-img ul li:nth-child(6) { top: 611px; left: 555px; } .product.product-cozzia .page-8 { background-color: #000; overflow: hidden; } .product.product-cozzia .page-8 #video { width: 100%; height: 100vh; } .product.product-cozzia .page-8 .video-bg { width: 100%; height: 100vh; background-size: cover; background-position: center center; position: absolute; top: 0; left: 0; perspective: 5000px; transform-origin: 50% 30%; transition: all 1s; } .product.product-cozzia .page-8 .video-bg.on { transform: scale(2); opacity: 0; pointer-events: none; } .product.product-cozzia .page-8 .video-bg .video-btn { top: 0; bottom: 0; height: 175px; margin: auto; z-index: 4; } .product.product-cozzia .page-8 .video-bg .video-btn .btn-boo:before { webkit-animation: Tc 1s ease-in infinite alternate; animation: Tc 1s ease-in infinite alternate; } .product.product-cozzia .page-8 .video-bg .video-img { position: absolute; width: 100%; height: 100vh; top: 0; left: 0; opacity: 0.4; display: none; } .product.product-cozzia .page-8 .video-bg .video-img.on { display: block; } .product.product-cozzia .page-9 { background: radial-gradient(#fff 30%, #f0fbfe 130%); } .product.product-cozzia .page-9 .page-text { width: 40%; text-align: left; position: absolute; right: 0; top: 100px; } .product.product-cozzia .page-9 .page-text .page-title { text-transform: uppercase; } .product.product-cozzia .page-9 .page-text .page-table { overflow: auto; } .product.product-cozzia .page-9 .page-slides { width: 60%; height: 100%; position: absolute; left: 0; } .product.product-cozzia .page-9 .page-slides .page-img ul li:not(:first-child) { display: none; } .product.product-cozzia .page-9 .page-slides .page-img ul li img { top: 0; bottom: 0; margin: auto; } .product.product-cozzia .page-9 .page-slides .page-btn { width: 218px; position: absolute; bottom: 100px; left: 0; right: 0; margin: auto; } .product.product-cozzia .page-9 .page-slides .page-btn ul li { width: 90px; float: left; } .product.product-cozzia .page-9 .page-slides .page-btn ul li p { float: right; font-size: 16px; line-height: 40px; } .product.product-cozzia .page-9 .page-slides .page-btn ul li .btn-boox { float: left; position: relative; } .product.product-cozzia .page-9 .page-slides .page-btn ul li .btn-boox .btn-boox-kuang { width: 0; height: 0; border-radius: 100%; position: absolute; top: 20px; left: 20px; transition: all 0.3s; } .product.product-cozzia .page-9 .page-slides .page-btn ul li .btn-boox .btn-boox-yuan { width: 8px; height: 8px; border-radius: 100%; position: absolute; top: 16px; left: 16px; } .product.product-cozzia .page-9 .page-slides .page-btn ul li .btn-boox.zong .btn-boox-kuang { border: 1px solid #ba7f7a; } .product.product-cozzia .page-9 .page-slides .page-btn ul li .btn-boox.zong .btn-boox-yuan { background-color: #ba7f7a; } .product.product-cozzia .page-9 .page-slides .page-btn ul li .btn-boox.hei .btn-boox-kuang { border: 1px solid #191919; } .product.product-cozzia .page-9 .page-slides .page-btn ul li .btn-boox.hei .btn-boox-yuan { background-color: #191919; } .product.product-cozzia .page-9 .page-slides .page-btn ul li:first-child { margin-right: 38px; } .product.product-cozzia .page-9 .page-slides .page-btn ul li.on .btn-boox .btn-boox-kuang { width: 16px; height: 16px; top: 12px; left: 12px; } .product.product-fuji .page-fuwen { position: absolute; left: 0; right: 0; margin: 0 auto; } .product.product-fuji .page-fuwen div { width: 39px; height: 31px; margin: 0 auto 80px; } .product.product-fuji .page-fuwen p { text-align: center; margin-bottom: 40px; color: #151515; } .product.product-fuji .page-1 { background-image: url("../image/page-11.jpg"); background-size: cover; background-position: center center; } .product.product-fuji .page-1 .page-text { font-size: 60px; font-weight: bold; line-height: 80px; text-align: center; margin: 16% 0 0 59%; } .product.product-fuji .page-1 .page-text span { font-size: 50px; font-weight: lighter; text-transform: uppercase; display: block; float: left; } .product.product-fuji .page-1 .page-text p { font-size: 18px; } .product.product-fuji .page-1 .page-img img { position: absolute; right: 0; bottom: 0; left: 0; margin: auto; } .product.product-fuji .page-2 { overflow: hidden; } .product.product-fuji .page-2 #video { width: 100%; } .product.product-fuji .page-2 .video-bg { width: 100%; height: 100vh; background-size: cover; background-position: center center; position: absolute; top: 0; left: 0; perspective: 5000px; transform-origin: 50% 30%; transition: all 1s; } .product.product-fuji .page-2 .video-bg.on { transform: scale(2); opacity: 0; pointer-events: none; } .product.product-fuji .page-2 .video-bg .video-btn { top: 0; bottom: 0; height: 160px; margin: auto; z-index: 4; } .product.product-fuji .page-2 .video-bg .video-btn .btn-boo:before { webkit-animation: Tc 1s ease-in infinite alternate; animation: Tc 1s ease-in infinite alternate; } .product.product-fuji .page-2 .video-bg .video-img { position: absolute; width: 100%; height: 100vh; top: 0; left: 0; opacity: 0.4; display: none; } .product.product-fuji .page-2 .video-bg .video-img.on { display: block; } .product.product-fuji .page-3 { /*background: linear-gradient(to top, #fff, #f0fbfe);*/ background-image: url("../image/img-3.png"); background-size: cover; background-position: center center; } .product.product-fuji .page-3 .page-text { width: 100%; text-align: center; top: 13%; } .product.product-fuji .page-3 .page-fuwen { width: 916px; top: 30%; } .product.product-fuji .page-3 .page-fuwen p { line-height: 24px; } .product.product-fuji .page-4 { background-image: url("../image/page-4.jpg"); z-index: 9999; } .product.product-fuji .page-4 .page-img { width: 100%; height: 100%; position: relative; background-size: auto; background-position: center center; background-repeat: no-repeat; } .product.product-fuji .page-4 .page-img img { height: 90vh; position: absolute; left: 0; right: 0; bottom: 0; margin: auto; } .product.product-fuji .page-5 { /*background: linear-gradient(top, #f0fbfe, #fff);*/ background-image: url("../image/img-5-bj.png"); background-size: cover; background-position: center center; background-repeat: no-repeat; } .product.product-fuji .page-5 .page-text { width: 100%; text-align: center; top: 13%; } .product.product-fuji .page-5 .page-fuwen { width: 676px; top: 30%; } .product.product-fuji .page-5 .page-fuwen p { line-height: 24px; } .product.product-fuji .page-5 .page-img { width: 100%; height: 400px; position: absolute; bottom: 0; background-size: auto; background-position: center bottom; background-repeat: no-repeat; } .product.product-fuji .page-5 .page-img img { max-height: 230px; position: absolute; left: 0; right: 0; bottom: 110px; margin: auto; } .product.product-fuji .page-6 { background: radial-gradient(#fff 30%, #ced6da 130%); } .product.product-fuji .page-6 .page-text { width: 100%; text-align: center; top: 13%; } .product.product-fuji .page-6 .page-text p { width: 560px; line-height: 24px; margin: 0 auto; } .product.product-fuji .page-6 .page-img img { height: 90%; position: absolute; left: 0; right: 0; bottom: 0; margin: auto; } .product.product-fuji .page-7 { background-image: url("../image/page-7.jpg"); } .product.product-fuji .page-7 .width-1200 .page-text { width: 40%; float: left; position: absolute; top: 0; bottom: 0; margin: auto; } .product.product-fuji .page-7 .width-1200 .page-text .page-title { text-transform: uppercase; } .product.product-fuji .page-7 .width-1200 .page-text .page-table { overflow: auto; } .product.product-fuji .page-7 .width-1200 .page-slides { width: 50%; height: 100vh; float: right; overflow: hidden; } .product.product-fuji .page-7 .width-1200 .page-slides .page-img { width: 100%; height: 100vh; } .product.product-fuji .page-7 .width-1200 .page-slides .page-img img { width: 600px; position: absolute; top: 0; bottom: 0; right: 0; margin: auto; } .product.product-fujimedic .page-text { top: -120px; bottom: 0; left: 0; margin: auto; color: #000 !important; } .product.product-fujimedic .page-text > div { opacity: 0; } .product.product-fujimedic .page-text > p { opacity: 0; } .product.product-fujimedic .page-text img { vertical-align: text-top; margin-right: 20px; } .product.product-fujimedic .page-fuwen { position: absolute; left: 0; right: 0; margin: 0 auto; } .product.product-fujimedic .page-fuwen div { width: 39px; height: 31px; margin: 0 auto 80px; } .product.product-fujimedic .page-fuwen p { text-align: center; margin-bottom: 40px; color: #151515; } .product.product-fujimedic .page-1 { background-image: url("../image/444.jpg"); } .product.product-fujimedic .page-1 .page-img img { top: 150px; right: 0; bottom: 0; left: 0; margin: auto; height: 500px; } .product.product-fujimedic .page-1 .page-img img:not(:first-child) { display: none; } .product.product-fujimedic .page-1 .page-btn { width: 130px; position: absolute; right: 0; bottom: 45px; overflow: hidden; } .product.product-fujimedic .page-1 .page-btn .btn-left { width: 29px; height: 24px; float: left; position: relative; cursor: pointer; } .product.product-fujimedic .page-1 .page-btn .btn-left div { border-top: 6.5px solid transparent; border-bottom: 6.5px solid transparent; border-right: 10px solid #414141; position: absolute; left: 0; bottom: 0; } .product.product-fujimedic .page-1 .page-btn .btn-text { float: left; } .product.product-fujimedic .page-1 .page-btn .btn-text span { font-size: 20px; color: #424141; line-height: 1em; } .product.product-fujimedic .page-1 .page-btn .btn-text span.cur { font-size: 30px; color: #ff9e00; } .product.product-fujimedic .page-1 .page-btn .btn-right { width: 29px; height: 24px; float: right; position: relative; cursor: pointer; } .product.product-fujimedic .page-1 .page-btn .btn-right div { border-top: 6.5px solid transparent; border-bottom: 6.5px solid transparent; border-left: 10px solid #414141; position: absolute; right: 0; bottom: 0; } .product.product-fujimedic .page-2 { background: linear-gradient(to top, #fff, #f0fbfe); } .product.product-fujimedic .page-2 .page-text { width: 100%; text-align: center; top: 13%; } .product.product-fujimedic .page-2 .page-text p { width: 50%; margin: auto; text-align: center; } .product.product-fujimedic .page-2 .page-fuwen { width: 676px; top: 32%; } .product.product-fujimedic .page-2 .page-fuwen p { font-size: 16px; line-height: 30px; } .product.product-fujimedic .page-2 .picMove { position: absolute; bottom: 0; height: 450px; width: 100%; left: 0; z-index: 3; overflow: hidden; } .product.product-fujimedic .page-2.page-shi .dengyutu { width: 60%; height: 450px; background-image: url("../image/dengyu.png"); background-size: 100%; background-repeat: no-repeat; position: absolute; left: 0; right: 0; bottom: 20px; margin: auto; } .product.product-fujimedic .page-2.page-shi .picMove { width: 60%; margin: 0 auto; right: 0; } .product.product-fujimedic .page-2.page-shi .picMove .c1 { right: auto; } .product.product-fujimedic .page-2.page-shi .picMove .denghao { background-image: url("../image/degnhao.png"); background-size: cover; background-position: center center; background-repeat: no-repeat; position: absolute; left: 0; right: 0; margin: auto; } .product.product-fujimedic .page-2.page-shi .picMove .c2 { left: auto; } .product.product-fujimedic .page-2 .picMove .circle { display: inline-block; position: absolute; width: 409px; right: 0; left: 0; margin: auto; padding: 40px; border-radius: 50%; border: 1px solid #e1dfdb; transition: all 1s cubic-bezier(0.78, 0.01, 0.37, 1.01); } .product.product-fujimedic .page-2 .picMove .circle:after { content: ''; position: absolute; width: 165px; height: 40px; z-index: -1; background-color: #e1dfdb; transition: all 1.5s cubic-bezier(0.78, 0.01, 0.37, 1.01); } .product.product-fujimedic .page-2 .picMove .c1:after { top: 150px; left: 50px; } .product.product-fujimedic .page-2 .picMove .c2:after { bottom: 150px; right: 50px; } .product.product-fujimedic .page-2 .picMove .c1.go { left: 700px; } .product.product-fujimedic .page-2 .picMove .c1.go:after { left: -230px; } .product.product-fujimedic .page-2 .picMove .c2.go { right: 700px; } .product.product-fujimedic .page-2 .picMove .c2.go:after { right: -230px; } .product.product-fujimedic .page-2 .picMove .Tpic { position: absolute; height: 400px; bottom: 0; left: 0; right: 0; margin: auto; } .product.product-fujimedic .page-2 .picMove .Tbox { position: absolute; width: 260px; height: 260px; border-radius: 50%; background-color: #fff; border: 16px solid #e1dfda; left: 0; right: 0; margin: auto; } .product.product-fujimedic .page-2 .picMove .p1 { left: -300px; } .product.product-fujimedic .page-2 .picMove .p2 { right: -650px; bottom: -130px; } .product.product-fujimedic .page-2 .picMove .p3 { right: -320px; top: 0; overflow: hidden; } .product.product-fujimedic .page-2 .picMove .p3 > img { width: 100%; } .product.product-fujimedic .page-3 { background: linear-gradient(top, #f0fbfe, #fff); } .product.product-fujimedic .page-3 .page-text { width: 100%; text-align: center; top: 13%; } .product.product-fujimedic .page-3 .page-text p { width: 50%; margin: auto; text-align: center; } .product.product-fujimedic .page-3 .page-fuwen { width: 676px; top: 26%; } .product.product-fujimedic .page-3 .page-fuwen p { font-size: 16px; line-height: 30px; } .product.product-fujimedic .page-3 .picMove { position: absolute; bottom: 0; height: 450px; width: 100%; left: 0; z-index: 3; overflow: hidden; } .product.product-fujimedic .page-3 .picMove .Tline { display: inline-block; height: 36px; line-height: 36px; width: 350px; z-index: 5; text-align: left; position: absolute; left: 0; right: 0; top: 0; bottom: 0; margin: auto; padding-right: 300px; font-size: 22px; } .product.product-fujimedic .page-3 .picMove .Tline > i { position: absolute; top: 0; bottom: 0; right: 5px; margin: auto; background-color: #ff9319; height: 1px; width: 290px; } .product.product-fujimedic .page-3 .picMove .Tline:after { content: ''; position: absolute; box-sizing: content-box; width: 10px; height: 10px; right: 5px; top: 0; bottom: 0; margin: auto; border-radius: 50%; background-color: #ff9319; } .product.product-fujimedic .page-3 .picMove .Tline:before { content: ''; position: absolute; box-sizing: content-box; width: 20px; height: 20px; right: 0; top: 0; bottom: 0; margin: auto; border-radius: 50%; background-color: rgba(255, 147, 22, 0.4); webkit-animation: Tc 0.5s cubic-bezier(0.56, 0.01, 0.46, 1) infinite alternate; animation: Tc 0.5s cubic-bezier(0.56, 0.01, 0.46, 1) infinite alternate; } @-webkit-keyframes Tc { 0% { -webkit-transform: scale(1); -moz-transform: scale(1); -ms-transform: scale(1); -o-transform: scale(1); transform: scale(1); } 100% { -webkit-transform: scale(1.2); -moz-transform: scale(1.2); -ms-transform: scale(1.2); -o-transform: scale(1.2); transform: scale(1.2); } } @keyframes Tc { 0% { -webkit-transform: scale(1); -moz-transform: scale(1); -ms-transform: scale(1); -o-transform: scale(1); transform: scale(1); } 100% { -webkit-transform: scale(1.2); -moz-transform: scale(1.2); -ms-transform: scale(1.2); -o-transform: scale(1.2); transform: scale(1.2); } } .product.product-fujimedic .page-3 .picMove .l1 { left: -440px; top: -120px; } .product.product-fujimedic .page-3 .picMove .l2 { left: -350px; top: 160px; } .product.product-fujimedic .page-3 .picMove .Tbox { position: absolute; width: 260px; height: 260px; border-radius: 50%; background-color: #fff; border: 16px solid #e1dfda; left: 0; right: 0; margin: auto; } .product.product-fujimedic .page-3 .picMove .p3 { top: 0; bottom: 0; overflow: hidden; } .product.product-fujimedic .page-3 .picMove .p3 > img { width: 100%; } .product.product-fujimedic .page-4 { overflow: hidden; } .product.product-fujimedic .page-4 #video { width: 100%; } .product.product-fujimedic .page-4 .video-bg { width: 100%; height: 100vh; background-size: cover; background-position: center center; position: absolute; top: 0; left: 0; perspective: 5000px; transform-origin: 50% 30%; transition: all 1s; } .product.product-fujimedic .page-4 .video-bg.on { transform: scale(2); opacity: 0; pointer-events: none; } .product.product-fujimedic .page-4 .video-bg .video-btn { top: -200px; bottom: 0; height: 200px; margin: auto; z-index: 4; } .product.product-fujimedic .page-4 .video-bg .video-btn .btn-boo:before { webkit-animation: Tc 1s ease-in infinite alternate; animation: Tc 1s ease-in infinite alternate; } .product.product-fujimedic .page-4 .video-bg .video-img { position: absolute; width: 100%; height: 100vh; top: 0; left: 0; opacity: 0.4; display: none; } .product.product-fujimedic .page-4 .video-bg .video-img.on { display: block; } .product.product-fujimedic .page-4 .video-item { position: absolute; height: 120px; width: 100%; bottom: 100px; left: 0; display: flex; justify-content: center; align-items: center; text-align: center; perspective: 5000px; transform-origin: 50% 50%; transition: all 1.2s ease-in-out; } .product.product-fujimedic .page-4 .video-item.on { opacity: 0; pointer-events: none; } .product.product-fujimedic .page-4 .video-item .video-list { display: inline-block; cursor: pointer; height: 85px; width: 140px; overflow: hidden; background-color: #000; border: 1px solid rgba(255, 255, 255, 0.5); box-sizing: border-box; margin: 0 20px; border-radius: 4px; transition: all 0.2s ease-in-out; } .product.product-fujimedic .page-4 .video-item .video-list > img { height: 100%; opacity: 0.4; transition: all 0.2s ease-in; } .product.product-fujimedic .page-4 .video-item .video-list.on { border: 4px solid #fff; transform: scale(1.2); } .product.product-fujimedic .page-4 .video-item .video-list.on > img { opacity: 1; } .product.product-fujimedic .page-5 { background-image: url("../image/page-7.jpg"); } .product.product-fujimedic .page-5 .width-1200 .page-text { width: 40%; float: left; position: absolute; top: 0; bottom: 0; margin: auto; } .product.product-fujimedic .page-5 .width-1200 .page-text .page-p { margin-bottom: 30px; } .product.product-fujimedic .page-5 .width-1200 .page-text .page-table { overflow: auto; } .product.product-fujimedic .page-5 .width-1200 .page-text .gobuy { margin-top: 50px; } .product.product-fujimedic .page-5 .width-1200 .page-slides { width: 50%; height: 100vh; float: right; overflow: hidden; } .product.product-fujimedic .page-5 .width-1200 .page-slides .page-img { width: 100%; height: 100vh; } .product.product-fujimedic .page-5 .width-1200 .page-slides .page-img img { width: 600px; position: absolute; bottom: 0; margin: auto; } .product.product-fujimedic .page-5 .width-1200 .page-btn { height: 100px; position: absolute; top: 18%; right: 0; width: 600px; } .product.product-fujimedic .page-5 .width-1200 .page-btn ul { text-align: center; } .product.product-fujimedic .page-5 .width-1200 .page-btn ul li { overflow: hidden; display: inline-block; vertical-align: top; margin: 0 10px; } .product.product-fujimedic .page-5 .width-1200 .page-btn ul li p { font-size: 20px; color: rgba(0, 0, 0, 0.2); line-height: 40px; margin-right: 20px; transition: al .3s; } .product.product-fujimedic .page-5 .width-1200 .page-btn ul li .btn-boox { width: 40px; height: 40px; float: left; position: relative; } .product.product-fujimedic .page-5 .width-1200 .page-btn ul li .btn-boox .btn-boox-kuang { width: 0; height: 0; border: 1px solid rgba(0, 0, 0, 0); border-radius: 100%; position: absolute; top: 20px; left: 20px; transition: all .3s; } .product.product-fujimedic .page-5 .width-1200 .page-btn ul li .btn-boox .btn-boox-yuan { width: 16px; height: 16px; background-color: rgba(0, 0, 0, 0.2); border-radius: 100%; position: absolute; top: 12px; left: 12px; transition: all .3s; } .product.product-fujimedic .page-5 .width-1200 .page-btn ul li:first-child { margin-bottom: 20px; display: none; } .product.product-fujimedic .page-5 .width-1200 .page-btn ul li.on p { color: #000; } .product.product-fujimedic .page-5 .width-1200 .page-btn ul li.on .btn-boox .btn-boox-kuang { width: 40px; height: 40px; top: 0; left: 0; border: 1px solid #83727f; } .product.product-fujimedic .page-5 .width-1200 .page-btn ul li.on .btn-boox .btn-boox-yuan { background-color: #83727f; } .product.product-yi #page9 .pic img { width: 50%; right: auto; } .product.product-yi .page-text { top: -120px; bottom: 0; left: 0; margin: auto; color: #000 !important; } .product.product-yi .page-text img { vertical-align: text-top; margin-right: 20px; } .product.product-yi .page-fuwen { position: absolute; left: 0; right: 0; margin: 0 auto; } .product.product-yi .page-fuwen div { width: 39px; height: 31px; margin: 0 auto 80px; } .product.product-yi .page-fuwen p { text-align: center; margin-bottom: 40px; color: #151515; } .product.product-yi .page-1 { background-size: cover; background-position: center center; } .product.product-yi .page-1 .page-img img { top: 150px; right: 0; bottom: 0; left: 0; margin: auto; height: 500px; } .product.product-yi .page-1 .page-img img:not(:first-child) { display: none; } .product.product-yi .page-1 .page-btn { width: 136px; position: absolute; right: 0; bottom: 45px; overflow: hidden; display: none; } .product.product-yi .page-1 .page-btn .btn-left { width: 29px; height: 24px; float: left; position: relative; cursor: pointer; } .product.product-yi .page-1 .page-btn .btn-left div { border-top: 6.5px solid transparent; border-bottom: 6.5px solid transparent; border-right: 10px solid #414141; position: absolute; left: 0; bottom: 0; } .product.product-yi .page-1 .page-btn .btn-text { float: left; } .product.product-yi .page-1 .page-btn .btn-text span { font-size: 20px; color: #424141; line-height: 1em; } .product.product-yi .page-1 .page-btn .btn-text span.cur { font-size: 30px; color: #ff9e00; } .product.product-yi .page-1 .page-btn .btn-right { width: 29px; height: 24px; float: right; position: relative; cursor: pointer; } .product.product-yi .page-1 .page-btn .btn-right div { border-top: 6.5px solid transparent; border-bottom: 6.5px solid transparent; border-left: 10px solid #414141; position: absolute; right: 0; bottom: 0; } .product.product-yi .page-2 { position: relative; } .product.product-yi .page-6p { overflow: unset; z-index: 999; } .product.product-yi .page-before::before { content: ''; width: 100%; height: 100%; background-color: rgba(0, 0, 0, .5); position: absolute; display: none; } .product.product-yi .page-7cai { padding-top: 180px; } .product.product-yi .page-22 small { color: #e5e5e5; } .product.product-yi .page-2 .txt { width: 65%; margin: auto; padding-top: 120px; text-align: center; position: relative; z-index: 5; } .product.product-yi .page-2 .txt h5 { color: #fff; margin-bottom: 20px; font-weight: 200; opacity: 0; } .product.product-yi .page-2 .txt h5 > b { font-weight: normal; color: #f39700; } .product.product-yi .page-2 .txt .Tyello { color: #f39700; } .product.product-yi .page-2.page-before .txt small { color: #e5e5e5; display: inline-block; opacity: 0; } .product.product-yi .page-2 .txt.t4 { position: absolute; bottom: 100px; left: 17.5%; z-index: 100; } .product.product-yi .page-2 .txt.t2 { text-align: left; max-width: 1200px; padding-top: 280px; width: 50%; margin: 0; margin-left: 8%; } .product.product-yi .page-2 .txt.t2 small { color: #969696; width: 70%; display: inline-block; } .product.product-yi .page-2 .txt.t3 { text-align: right; max-width: 1200px; padding-top: 430px; float: right; width: 38%; margin: 0; margin-right: 14%; } .product.product-yi .page-2 .txt.t3 small { color: #969696; width: 70%; display: inline-block; } .product.product-yi .page-2 .pic .picqingban, .product.product-yi .page-2 .pic .picqingban img { width: 50%; position: absolute; right: 0; bottom: -205px; } .product.product-yi .page-2 .pic { position: absolute; width: 100%; bottom: 0; left: 0; right: 0; margin: auto; z-index: 20; } .product.product-yi .page-2 .pic .top50 { position: absolute; width: auto; left: 0; right: 0; margin: auto; transform: translateY(-50%); } .product.product-yi .page-2 .pic > img { width: 100%; } .product.product-yi .page-2 .pic .dot { width: 92px; height: 92px; line-height: 92px; border-radius: 50%; border: 1px solid #fff; text-align: center; font-size: 14px; color: #fff; position: absolute; top: 0; right: 0; bottom: 0; left: 0; margin: auto; /*z-index: 100;*/ cursor: pointer; /*webkit-animation: Tf 2s cubic-bezier(0.56, 0.01, 0.46, 1) infinite alternate;*/ /*animation: Tf 2s cubic-bezier(0.56, 0.01, 0.46, 1) infinite alternate;*/ } /*@-webkit-keyframes Tf { 0% { -webkit-transform: scale(1) translateY(0px); -moz-transform: scale(1) translateY(0px); -ms-transform: scale(1) translateY(0px); -o-transform: scale(1) translateY(0px); transform: scale(1) translateY(0px); } 100% { -webkit-transform: scale(1.2) translateY(10px); -moz-transform: scale(1.2) translateY(10px); -ms-transform: scale(1.2) translateY(10px); -o-transform: scale(1.2) translateY(10px); transform: scale(1.2) translateY(10px); } } @keyframes Tf { 0% { -webkit-transform: scale(1) translateY(0px); -moz-transform: scale(1) translateY(0px); -ms-transform: scale(1) translateY(0px); -o-transform: scale(1) translateY(0px); transform: scale(1) translateY(0px); } 100% { -webkit-transform: scale(1.1) translateY(5px); -moz-transform: scale(1.1) translateY(5px); -ms-transform: scale(1.1) translateY(5px); -o-transform: scale(1.1) translateY(5px); transform: scale(1.1) translateY(5px); } }*/ .product.product-yi .page-2 #space { position: absolute; width: 100%; height: 100%; top: 0; left: 0; z-index: 3; } .product.product-yi .page-4 { overflow: hidden; } .product.product-yi .page-4 #video { width: 100%; position: absolute; top: 0; right: 0; bottom: 0; left: 0; margin: auto; } .product.product-yi .page-4 .video-bg { width: 100%; height: 100vh; background-size: cover; background-position: center center; position: absolute; top: 0; left: 0; perspective: 5000px; transform-origin: 50% 30%; transition: all 1s; } .product.product-yi .page-4 .video-bg.on { transform: scale(2); opacity: 0; pointer-events: none; } .product.product-yi .page-4 .video-bg .video-btn { top: 0; bottom: 0; left: 0; right: 0; height: 180px; margin: auto; z-index: 4; } .product.product-yi .page-4 .video-bg .video-btn .btn-boo:before { webkit-animation: Tc 1s ease-in infinite alternate; animation: Tc 1s ease-in infinite alternate; } .product.product-yi .page-4 .video-bg .video-img { position: absolute; width: 100%; height: 100vh; top: 0; left: 0; opacity: 0.4; display: none; } .product.product-yi .page-4 .video-bg .video-img.on { display: block; } .product.product-yi .page-5 { background-image: url("../image/page-7.jpg"); } .product.product-yi .mxcpYiPage8 { background-size: 100%; background-position: center bottom; background-repeat: no-repeat; } .product.product-yi .page-5 .width-1200 .page-text { width: 40%; float: left; position: absolute; top: 0; bottom: 0; margin: auto; } .product.product-yi .page-5 .width-1200 .page-text .page-p { margin-bottom: 30px; } .product.product-yi .page-5 .width-1200 .page-text .page-table { overflow: auto; position: relative; z-index: 300; } .product.product-yi .page-5 .width-1200 .page-text .gobuy { margin-top: 50px; } .product.product-yi .page-5 .width-1200 .page-slides { width: 50%; height: 100vh; float: right; overflow: hidden; } .product.product-yi .page-5 .width-1200 .page-slides .page-img { width: 100%; height: 100vh; } .product.product-yi .page-5 .width-1200 .page-slides .page-img img { width: 400px; position: absolute; bottom: 0; left: 0; right: 0; margin: auto; } .product.product-yi .page-5 .width-1200 .page-btn { height: 100px; position: absolute; top: 18%; right: 0; width: 600px; } .product.product-yi .page-5 .width-1200 .page-btn ul { text-align: center; } .product.product-yi .page-5 .width-1200 .page-btn ul li { overflow: hidden; display: inline-block; vertical-align: top; margin: 0 10px; } .product.product-yi .page-5 .width-1200 .page-btn ul li p { font-size: 20px; color: rgba(0, 0, 0, 0.2); line-height: 40px; margin-right: 20px; transition: al .3s; } .product.product-yi .page-5 .width-1200 .page-btn ul li .btn-boox { width: 40px; height: 40px; float: left; position: relative; } .product.product-yi .page-5 .width-1200 .page-btn ul li .btn-boox .btn-boox-kuang { width: 0; height: 0; border: 1px solid rgba(0, 0, 0, 0); border-radius: 100%; position: absolute; top: 20px; left: 20px; transition: all .3s; } .product.product-yi .page-5 .width-1200 .page-btn ul li .btn-boox .btn-boox-yuan { width: 16px; height: 16px; background-color: rgba(0, 0, 0, 0.2); border-radius: 100%; position: absolute; top: 12px; left: 12px; transition: all .3s; } .product.product-yi .page-5 .width-1200 .page-btn ul li:first-child { margin-bottom: 20px; } .product.product-yi .page-5 .width-1200 .page-btn ul li.on p { color: #000; } .product.product-yi .page-5 .width-1200 .page-btn ul li.on .btn-boox .btn-boox-kuang { width: 40px; height: 40px; top: 0; left: 0; border: 1px solid #83727f; } .product.product-yi .page-5 .width-1200 .page-btn ul li.on .btn-boox .btn-boox-yuan { background-color: #83727f; } .product.product-medisana .page-1 { background-image: url("../image/page-12.jpg"); } .product.product-medisana .page-1 .width-1200 .page-text { width: 486px; height: 246px; position: absolute; top: -30px; right: 0; bottom: 0; left: 0; margin: auto; } .product.product-medisana .page-1 .width-1200 .page-text .page-logo { margin-bottom: 50px; } .product.product-medisana .page-1 .width-1200 .page-text .page-logo img { display: block; margin: 0 auto; } .product.product-medisana .page-1 .width-1200 .page-text .page-title { line-height: 26px; text-align: center; } .product.product-medisana .page-1 .width-1200 .page-text p { color: #000; text-align: center; } .product.product-medisana .page-1 .width-1200 .page-text .page-1-li { width: 374px; height: 20px; margin: 0 auto; } .product.product-medisana .page-1 .width-1200 .page-text .page-1-li ul { margin-top: 40px; } .product.product-medisana .page-1 .width-1200 .page-text .page-1-li ul li { width: 33.33%; float: left; } .product.product-medisana .page-1 .width-1200 .page-text .page-1-li ul li::after { content: ''; width: 0; height: 0; clear: both; display: block; visibility: hidden; } .product.product-medisana .page-1 .width-1200 .page-text .page-1-li ul li div { width: 20px; height: 20px; float: left; } .product.product-medisana .page-1 .width-1200 .page-text .page-1-li ul li div img { display: block; } .product.product-medisana .page-1 .width-1200 .page-text .page-1-li ul li p { line-height: 20px; text-align: left; text-indent: 10px; color: #000000; } .product.product-medisana .page-1 .width-1200 .page-1-left { position: absolute; left: -180px; bottom: 0; } .product.product-medisana .page-1 .width-1200 .page-1-right { position: absolute; right: 0; bottom: 0; } .product.product-medisana .page-2 { background-color: #f3f3f3; /* 轮播 */ } .product.product-medisana .page-2 .page-text { width: 100%; text-align: center; margin-top: 130px; } .product.product-medisana .page-2 .page-text ul { margin-top: 0; color: #666666; position: relative; } .product.product-medisana .page-2 .page-text ul li { width: 100%; position: absolute; top: 0; } .product.product-medisana .page-2 .page-text ul li:not(:first-child) { display: none; } .product.product-medisana .page-2 .slider { height: 100vh; position: relative; /* 轮播图片 */ /* 轮播文字 */ /* 轮播按钮 */ /* 轮播数字 */ } .product.product-medisana .page-2 .slider .slider-img { position: absolute; top: 0; bottom: 0; left: 0; right: 0; margin: auto; } .product.product-medisana .page-2 .slider .slider-img ul li { position: absolute; top: 0; right: 0; bottom: 0; left: 0; margin: auto; } .product.product-medisana .page-2 .slider .slider-img ul li img { display: block; position: absolute; top: 0; right: 0; bottom: 0; left: 0; margin: auto; } .product.product-medisana .page-2 .slider .slider-img ul li:not(:first-child) { display: none; } .product.product-medisana .page-2 .slider .slider-list { height: 165px; text-align: center; position: absolute; left: 0; right: 0; bottom: 0; margin: auto; } .product.product-medisana .page-2 .slider .slider-list ul { position: relative; } .product.product-medisana .page-2 .slider .slider-list ul li { position: absolute; top: 0; left: 0; right: 0; margin: auto; } .product.product-medisana .page-2 .slider .slider-list ul li div { color: #333333; line-height: 1em; margin-bottom: 10px; } .product.product-medisana .page-2 .slider .slider-list ul li div span { color: #fa9932; } .product.product-medisana .page-2 .slider .slider-list ul li p { color: #666666; line-height: 1em; } .product.product-medisana .page-2 .slider .slider-list ul li:not(:first-child) { display: none; } .product.product-medisana .page-2 .slider .slider-btn { width: 100%; height: 100vh; position: absolute; top: 0; } .product.product-medisana .page-2 .slider .slider-btn .slider-btn-left, .product.product-medisana .page-2 .slider .slider-btn .slider-btn-right { width: 40px; height: 72px; position: absolute; top: 0; bottom: 0; margin: auto; z-index: 99999999999; color: #dddddd; cursor: pointer; } .product.product-medisana .page-2 .slider .slider-btn .slider-btn-left i, .product.product-medisana .page-2 .slider .slider-btn .slider-btn-right i { font-size: 42px; } .product.product-medisana .page-2 .slider .slider-btn .slider-btn-left { left: 0; } .product.product-medisana .page-2 .slider .slider-btn .slider-btn-right { right: 0; } .product.product-medisana .page-2 .slider .slider-num { width: 502px; height: 92px; background-image: url("../image/page-2-num-bj.png"); background-repeat: no-repeat; position: absolute; left: 0; right: 0; bottom: 50px; margin: auto; } .product.product-medisana .page-2 .slider .slider-num ul { position: relative; } .product.product-medisana .page-2 .slider .slider-num ul li { width: 30px; height: 30px; border-radius: 100%; background-color: #fff; font-size: 14px; text-align: center; line-height: 30px; color: #dddddd; cursor: pointer; float: left; position: absolute; transition: all .3s; } .product.product-medisana .page-2 .slider .slider-num ul li.cur { color: #fa9932; } .product.product-medisana .page-2 .slider .slider-num ul li:nth-child(1) { top: 38px; left: 123px; } .product.product-medisana .page-2 .slider .slider-num ul li:nth-child(2) { top: 49px; left: 170px; } .product.product-medisana .page-2 .slider .slider-num ul li:nth-child(3) { top: 54px; left: 215px; } .product.product-medisana .page-2 .slider .slider-num ul li:nth-child(4) { top: 54px; left: 260px; } .product.product-medisana .page-2 .slider .slider-num ul li:nth-child(5) { top: 49px; left: 310px; } .product.product-medisana .page-2 .slider .slider-num ul li:nth-child(6) { top: 38px; left: 355px; } .product.product-medisana .page-3 .page-text { width: 100%; text-align: center; margin-top: 130px; } .product.product-medisana .page-3 .page-text p { color: #666666; } .product.product-medisana .page-3 .page-3-box .page-3-left, .product.product-medisana .page-3 .page-3-box .page-3-right { position: absolute; bottom: 90px; } .product.product-medisana .page-3 .page-3-box .page-3-left .list, .product.product-medisana .page-3 .page-3-box .page-3-right .list { margin-bottom: 90px; } .product.product-medisana .page-3 .page-3-box .page-3-left .list div, .product.product-medisana .page-3 .page-3-box .page-3-right .list div { color: #333; } .product.product-medisana .page-3 .page-3-box .page-3-left .list div span, .product.product-medisana .page-3 .page-3-box .page-3-right .list div span { color: #fa9932; } .product.product-medisana .page-3 .page-3-box .page-3-left .list p, .product.product-medisana .page-3 .page-3-box .page-3-left .list ul, .product.product-medisana .page-3 .page-3-box .page-3-right .list p, .product.product-medisana .page-3 .page-3-box .page-3-right .list ul { margin-bottom: 35px; } .product.product-medisana .page-3 .page-3-box .page-3-left { left: 0; } .product.product-medisana .page-3 .page-3-box .page-3-right { width: 450px; right: 0; } .product.product-medisana .page-3 .page-3-box .page-3-cen { width: 178px; position: absolute; left: 0; right: 0; bottom: 0; margin: auto; } .product.product-medisana .page-4 { background-image: url("../image/page-41.jpg"); } .product.product-medisana .page-4 .width-1200 { padding: 100px 0; } .product.product-medisana .page-4 .width-1200 .page-text { width: 50%; } .product.product-medisana .page-4 .width-1200 .page-text .page-table { overflow: auto; } .product.product-medisana .page-4 .width-1200 .page-img { width: 50%; height: 100vh; position: absolute; top: 0; left: 50%; background-size: 90%; background-repeat: no-repeat; background-position: center; } .product.product-medisana .page-4 .width-1200 .page-img img { position: absolute; top: -100px; right: 0; bottom: 0; left: 0; margin: auto; } /* nexus */ .nexus .nav { position: relative; z-index: 100; } .nexus .nav .width-1200 { padding: 0; } .nexus .banner { width: 100%; height: 40vh; margin-top: -62px; overflow: hidden; } .nexus .banner .banner-box { width: 100%; height: 40vh; background-image: url("../image/banner.png"); background-position: center center; background-size: cover; transform: scale(1.2); transition: all .8s ease-in; } .nexus .banner .banner-box .width-1200 { height: 100%; color: #fff; } .nexus .banner .banner-box .width-1200 .left, .nexus .banner .banner-box .width-1200 .right { height: 100%; line-height: 40vh; } .nexus .banner .banner-box .width-1200 .left { float: left; } .nexus .banner .banner-box .width-1200 .right { float: right; text-align: right; } .nexus .banner.on .banner-box { transform: scale(1); } .nexus .subject .tab-nei { margin-bottom: 20px; } .nexus .subject .title { font-weight: bold; color: #000; text-align: center; line-height: 100px; margin-top: 30px; } .nexus .subject .tab-top ul { display: flex; justify-content: space-around; overflow: hidden; } .nexus .subject .tab-top ul li { width: 100px; height: 100px; border-radius: 100%; box-sizing: border-box; border: 1px solid rgba(225, 82, 96, 0.5); line-height: 100px; text-align: center; font-size: 18px; font-weight: bold; color: rgba(0, 0, 0, 0.7); cursor: pointer; float: left; transition: all .3s; } .nexus .subject .tab-top ul li:hover { background-color: #bd0003; background: linear-gradient(-120deg, #bd0003, #e55c6c); } .nexus .subject .tab-top ul li.cur { background-color: #bd0003; border: none; background: linear-gradient(-120deg, #bd0003, #e55c6c); color: #fff; font-size: 18px; } .nexus .subject .tab-top ul li span, .nexus .subject .tab-top ul li a { display: block; } .nexus .subject .tab-qun { width: 100%; height: 40px; box-sizing: border-box; border-bottom: 2px solid #e97f8a; margin-top: 0; position: relative; } .nexus .subject .tab-qun img { width: 74px; height: 40px; display: block; position: absolute; left: 563px; bottom: -3px; display: none; } .nexus .subject .tab-nei ul li:not(:first-child) { display: none; } .nexus .subject .tab-nei ul .jiaoliu .jl-title { font-weight: bold; margin-top: 50px; margin-bottom: 30px; } .nexus .subject .tab-nei ul .jiaoliu .jl-title div { font-size: 30px; color: rgba(0, 0, 0, 0.3); line-height: 1em; text-transform: uppercase; margin-bottom: 15px; display: none; } .nexus .subject .tab-nei ul .jiaoliu .jl-title p { line-height: 1em; font-weight: normal; color: rgba(0, 0, 0, 0.9); font-size: 22px; } .nexus .subject .tab-nei ul .jiaoliu .fangshi .fs-box { width: 50%; margin-bottom: 20px; float: left; } .nexus .subject .tab-nei ul .jiaoliu .fangshi .fs-box .fs-icon { float: left; width: 30px; height: 20px; margin-top: -5px; margin-right: 15px; } .nexus .subject .tab-nei ul .jiaoliu .fangshi .fs-box .fs-icon i { font-size: 20px; line-height: 20px; color: #c6c6c6; font-weight: normal; display: block; text-align: center; } .nexus .subject .tab-nei ul .jiaoliu .fangshi .fs-box .fs-text { float: left; } .nexus .subject .tab-nei ul .jiaoliu .fangshi .fs-box .fs-text .fs-top { color: rgba(0, 0, 0, 0.3); font-size: 18px; text-transform: uppercase; font-weight: bold; line-height: 1em; display: none; } .nexus .subject .tab-nei ul .jiaoliu .fangshi .fs-box .fs-text .fs-bottom div { float: left; width: 50px; color: rgba(0, 0, 0, 0.8); line-height: 1em; /*margin-top: 4px;*/ } .nexus .subject .tab-nei ul .jiaoliu .fangshi .fs-box .fs-text .fs-bottom p { float: left; color: rgba(0, 0, 0, 0.9); line-height: 1em; } .nexus .subject .tab-nei ul .jiaoliu .lianjie div { font-size: 20px; color: rgba(0, 0, 0, 0.8); } .nexus .subject .tab-nei ul .jiaoliu .lianjie a { font-size: 16px; /*color: #ff5260;*/ color: rgba(0, 0, 0, 0.9); text-transform: uppercase; /*text-decoration: underline;*/ } .nexus .subject .tab-nei ul .jiaoliu .lianjie a img { width: 15px; margin-left: 10px; } .nexus .subject .tab-nei ul .list { overflow: hidden; } .nexus .subject .tab-nei ul .list .list-title { width: 100%; height: 45px; line-height: 45px; background-color: #f2f4f5; font-size: 24px; text-indent: 16px; margin-top: 50px; margin-bottom: 10px; } .nexus .subject .tab-nei ul .list .list-box { overflow: hidden; } .nexus .subject .tab-nei ul .list .list-box .list-kuai { width: 100%; margin-top: 20px; float: left; cursor: pointer; } .nexus .subject .tab-nei ul .list .list-box .list-kuai:nth-child(even) { margin-right: 0; } .nexus .subject .tab-nei ul .list .list-box .list-kuai div { height: 28px; font-size: 16px; color: rgba(0, 0, 0, 0.8); line-height: 28px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .nexus .subject .tab-nei ul .list .list-box .list-kuai p { font-size: 14px; color: #747474; margin-top: 5px; } .nexus .subject .tab-nei ul .list .tiao { width: 100%; margin: 50px 0 80px 0; line-height: 30px; position: relative; } .nexus .subject .tab-nei ul .list .tiao .tiao-text { font-size: 16px; color: #373737; cursor: pointer; position: absolute; right: 80px; } .nexus .subject .tab-nei ul .list .tiao .tiao-xuan { position: absolute; right: 0; } .nexus .subject .tab-nei ul .list .tiao .tiao-xuan select { width: 60px; height: 30px; text-indent: 10px; } .nexus .subject .tab-nei ul .list .tiao .tiao-btn { width: 95px; position: absolute; left: 0; right: 0; margin: auto; } .nexus .subject .tab-nei ul .list .tiao .tiao-btn button { border: none; background-color: transparent; line-height: 30px; } .nexus .subject .tab-nei ul .list .tiao .tiao-btn button i { display: block; text-align: center; font-weight: bold; color: rgba(255, 82, 96, 0.3); transition: all .3s; cursor: pointer; } .nexus .subject .tab-nei ul .list .tiao .tiao-btn button:hover i { color: #ff5260; } .nexus .subject .tab-nei ul .list .tiao .tiao-btn button.btn-left { margin-right: 20px; } .nexus .subject .tab-nei ul .list .tiao .tiao-btn button.btn-right { margin-left: 20px; } .nexus .subject .tab-nei ul .list .tiao .tiao-btn span { font-size: 20px; color: #e15260; } /* cooperation-agent */ .cooperation-agent .nav { position: relative; } .cooperation-agent .banner { width: 100%; height: 650px; background-image: url("../image/agent_banner.png"); background-size: cover; background-position: center center; margin-top: -62px; padding-top: 195px; } .cooperation-agent .banner .banner-text { margin: 0 0 0 50%; } .cooperation-agent .banner .banner-text .banner-title { font-size: 30px; line-height: 1em; color: #000; font-weight: bold; margin-bottom: 43px; position: relative; } .cooperation-agent .banner .banner-text .banner-title::before { content: ''; width: 67px; height: 4px; background-color: #20c401; position: absolute; bottom: -27px; left: 0; } .cooperation-agent .banner .banner-text .banner-zhao { font-size: 18px; line-height: 46px; color: #000; font-weight: bold; } .cooperation-agent .banner .banner-text .banner-QP { margin-top: 28px; } .cooperation-agent .cooperation-agent-content { width: 100%; position: relative; /* 申请加盟 */ /* 创富机会 */ /* 品牌势能 */ /* 加盟优势 */ /* 加盟对象 */ /* 加盟流程 */ /* 终端风采 */ /* 网点加盟 */ } .cooperation-agent .cooperation-agent-content .title-fu { text-align: center; line-height: 1em; margin: 62px 0 52px 0; } .cooperation-agent .cooperation-agent-content .title-fu span { color: #20c401; } .cooperation-agent .cooperation-agent-content #SQJM, .cooperation-agent .cooperation-agent-content #CZJH, .cooperation-agent .cooperation-agent-content #PPSN, .cooperation-agent .cooperation-agent-content #JMYS, .cooperation-agent .cooperation-agent-content #JMTJ, .cooperation-agent .cooperation-agent-content #JMDX, .cooperation-agent .cooperation-agent-content #JMLC, .cooperation-agent .cooperation-agent-content #ZDFC, .cooperation-agent .cooperation-agent-content #JMWD { padding-top: 100px; } .cooperation-agent .cooperation-agent-content #SQJM .msgRow .col { width: 32%; } .cooperation-agent .cooperation-agent-content #SQJM .form-box { width: 100%; height: 540px; background-color: #fafafa; position: relative; } .cooperation-agent .cooperation-agent-content #SQJM .form-box::before { content: ''; width: 100%; height: 90px; background-color: #fff; position: absolute; top: 0; left: 0; } .cooperation-agent .cooperation-agent-content #SQJM .form-box .form-div { width: 968px; height: 480px; background-color: #fff; margin: 50px auto 0; box-shadow: 0 10px 40px rgba(0, 0, 0, 0.05); padding: 30px 60px; position: relative; } .cooperation-agent .cooperation-agent-content #SQJM .form-box .form-div .form-top { height: 56px; } .cooperation-agent .cooperation-agent-content #SQJM .form-box .form-div .form-top .top-input { width: 214px; height: 56px; float: left; margin-right: 96px; position: relative; } .cooperation-agent .cooperation-agent-content #SQJM .form-box .form-div .form-top .top-input p { color: #717070; font-size: 16px; position: absolute; top: 30px; z-index: 100; transition: all .3s; } .cooperation-agent .cooperation-agent-content #SQJM .form-box .form-div .form-top .top-input p.on { color: #20c401; font-size: 12px; top: 0; } .cooperation-agent .cooperation-agent-content #SQJM .form-box .form-div .form-top .top-input input { width: 100%; height: 30px; border-top: none; border-left: none; border-right: none; border-bottom: 1px solid #717070; position: absolute; top: 30px; box-sizing: border-box; } .cooperation-agent .cooperation-agent-content #SQJM .form-box .form-div .form-top .top-input input.on { color: #20c401; border-bottom: 2px solid #20c401; } .cooperation-agent .cooperation-agent-content #SQJM .form-box .form-div .form-top .top-input:hover p { color: #20c401; } .cooperation-agent .cooperation-agent-content #SQJM .form-box .form-div .form-top .top-input:hover input { border-bottom: 1px solid #20c401; } .cooperation-agent .cooperation-agent-content #SQJM .form-box .form-div .form-top .shengshi { width: 100px; margin-top: 30px; float: left; } .cooperation-agent .cooperation-agent-content #SQJM .form-box .form-div .form-top .sheng { margin-right: 28px; } .cooperation-agent .cooperation-agent-content #SQJM .form-box .form-div .form-bottom { margin-top: 40px; } .cooperation-agent .cooperation-agent-content #SQJM .form-box .form-div .form-bottom div { color: #717070; font-size: 16px; } .cooperation-agent .cooperation-agent-content #SQJM .form-box .form-div .form-bottom textarea { width: 100%; height: 90px; border-top: none; border-left: none; border-right: none; border-bottom: 1px solid #717070; } .cooperation-agent .cooperation-agent-content #SQJM .form-box .form-div button i { margin-left: 20px; } .cooperation-agent .cooperation-agent-content #CZJH .abc-box { width: 100%; overflow: hidden; } .cooperation-agent .cooperation-agent-content #CZJH .abc-box .list { width: 33.33%; margin-bottom: 30px; float: left; position: relative; } .cooperation-agent .cooperation-agent-content #CZJH .abc-box .list div { float: left; font-family: Futura; font-size: 80px; color: #eeeeee; line-height: 1em; font-weight: bold; transition: all .3s; } .cooperation-agent .cooperation-agent-content #CZJH .abc-box .list p { float: left; color: #3e3a39; line-height: 1em; position: absolute; left: 80px; bottom: 10px; transition: all .3s; } .cooperation-agent .cooperation-agent-content #CZJH .abc-box .list.cur div { color: #20c401; } .cooperation-agent .cooperation-agent-content #CZJH .jianjie { line-height: 24px; color: #585756; } .cooperation-agent .cooperation-agent-content #PPSN .title-fu { margin: 62px 0 0 0; } .cooperation-agent .cooperation-agent-content #PPSN .box-three { width: 790px; margin: 0 auto; padding: 30px 40px 50px 40px; overflow: hidden; } .cooperation-agent .cooperation-agent-content #PPSN .box-three .list { width: 170px; height: 84px; background-color: #fff; margin-right: 100px; padding: 17px 0 0 20px; float: left; transition: all .3s; } .cooperation-agent .cooperation-agent-content #PPSN .box-three .list:last-child { margin-right: 0; } .cooperation-agent .cooperation-agent-content #PPSN .box-three .list .list-left { float: left; } .cooperation-agent .cooperation-agent-content #PPSN .box-three .list .list-left i { display: block; font-size: 50px; line-height: 1em; color: #b2b2b2; transition: all .3s; } .cooperation-agent .cooperation-agent-content #PPSN .box-three .list .list-right { float: left; margin-left: 10px; } .cooperation-agent .cooperation-agent-content #PPSN .box-three .list .list-right div { font-size: 18px; color: #3e3a39; margin-top: 5px; } .cooperation-agent .cooperation-agent-content #PPSN .box-three .list .list-right p { font-size: 12px; color: #888888; font-family: Futura; } .cooperation-agent .cooperation-agent-content #PPSN .box-three .list.cur { box-shadow: 0 10px 45px rgba(0, 0, 0, 0.15); } .cooperation-agent .cooperation-agent-content #PPSN .box-three .list.cur .list-left i { color: #20c401; } .cooperation-agent .cooperation-agent-content #PPSN .sn-ul ul { overflow: hidden; } .cooperation-agent .cooperation-agent-content #PPSN .sn-ul ul li { width: 50%; height: 16px; margin-bottom: 20px; float: left; } .cooperation-agent .cooperation-agent-content #PPSN .sn-ul ul li div { width: 12px; height: 12px; border: 2px solid #20c401; box-sizing: border-box; border-radius: 100%; margin: 2px 10px 0 0; float: left; } .cooperation-agent .cooperation-agent-content #PPSN .sn-ul ul li p { line-height: 1em; color: #3e3a39; float: left; } .cooperation-agent .cooperation-agent-content #PPSN .sjz-title { color: #040000; text-align: center; line-height: 1em; margin: 35px 0 48px 0; } .cooperation-agent .cooperation-agent-content #PPSN .sjz-box { position: relative; } .cooperation-agent .cooperation-agent-content #PPSN .sjz-box .sjz-left { width: 9px; height: 18px; border-top: 9px solid transparent; border-bottom: 9px solid transparent; border-right: 9px solid #8d8d8d; cursor: pointer; position: absolute; top: 105px; left: 0; } .cooperation-agent .cooperation-agent-content #PPSN .sjz-box .sjz-right { width: 9px; height: 18px; border-top: 9px solid transparent; border-bottom: 9px solid transparent; border-left: 9px solid #8d8d8d; cursor: pointer; position: absolute; top: 105px; right: 0; } .cooperation-agent .cooperation-agent-content #PPSN .sjz-box .sjz { width: 1082px; margin-left: 9px; position: relative; overflow: hidden; } .cooperation-agent .cooperation-agent-content #PPSN .sjz-box .sjz::before { content: ''; width: 100%; height: 2px; background-color: #8d8d8d; position: absolute; left: 0; top: 113px; } .cooperation-agent .cooperation-agent-content #PPSN .sjz-box .sjz ul { overflow: hidden; } .cooperation-agent .cooperation-agent-content #PPSN .sjz-box .sjz ul li { width: 158px; height: 255px; margin-left: -38px; float: left; cursor: default; position: relative; } .cooperation-agent .cooperation-agent-content #PPSN .sjz-box .sjz ul li .title { font-size: 14px; line-height: 1.5em; color: #585756; text-align: center; position: absolute; left: 0; right: 0; } .cooperation-agent .cooperation-agent-content #PPSN .sjz-box .sjz ul li .shu { width: 1px; border: 1px dashed rgba(92, 210, 4, 0.5); margin: 0 auto; position: absolute; left: 0; right: 0; bottom: 142px; } .cooperation-agent .cooperation-agent-content #PPSN .sjz-box .sjz ul li .icon { width: 10px; height: 10px; border-radius: 100%; background-color: #7d7d7d; margin: 0 auto; position: absolute; left: 0; right: 0; top: 109px; } .cooperation-agent .cooperation-agent-content #PPSN .sjz-box .sjz ul li .icon i { display: none; background-color: #fff; line-height: 1em; font-size: 28px; color: #20c401; position: absolute; top: -24px; left: -14px; } .cooperation-agent .cooperation-agent-content #PPSN .sjz-box .sjz ul li .year { width: 34px; font-size: 18px; font-weight: bold; font-family: Futura; color: #b5b5b6; margin: 0 auto; writing-mode: tb-rl; writing-mode: vertical-rl; position: absolute; left: 0; right: 0; top: 136px; } .cooperation-agent .cooperation-agent-content #PPSN .sjz-box .sjz ul li:nth-child(odd) .title { bottom: 180px; } .cooperation-agent .cooperation-agent-content #PPSN .sjz-box .sjz ul li:nth-child(odd) .shu { height: 33px; } .cooperation-agent .cooperation-agent-content #PPSN .sjz-box .sjz ul li:nth-child(even) .title { bottom: 236px; } .cooperation-agent .cooperation-agent-content #PPSN .sjz-box .sjz ul li:nth-child(even) .shu { height: 90px; } .cooperation-agent .cooperation-agent-content #PPSN .sjz-box .sjz ul li:first-child { margin-left: 0; } .cooperation-agent .cooperation-agent-content #PPSN .sjz-box .sjz ul li:hover .title { color: #20c401; } .cooperation-agent .cooperation-agent-content #PPSN .sjz-box .sjz ul li:hover .icon { width: 0; height: 0; background-color: transparent; } .cooperation-agent .cooperation-agent-content #PPSN .sjz-box .sjz ul li:hover .icon i { display: block; } .cooperation-agent .cooperation-agent-content #PPSN .sjz-box .sjz ul li:hover .year { color: #20c401; } .cooperation-agent .cooperation-agent-content #JMYS .tab-top ul { height: 87px; margin-top: 40px; display: flex; justify-content: space-between; overflow: hidden; position: relative; } .cooperation-agent .cooperation-agent-content #JMYS .tab-top ul::before { content: ''; width: 100%; height: 1px; background-color: rgba(0, 0, 0, 0.1); position: absolute; bottom: 5px; left: 0; } .cooperation-agent .cooperation-agent-content #JMYS .tab-top ul li { width: 72px; line-height: 82px; color: #3e3a39; position: relative; transition: all .3s; cursor: default; } .cooperation-agent .cooperation-agent-content #JMYS .tab-top ul li.cur { color: #20c401; } .cooperation-agent .cooperation-agent-content #JMYS .tab-top ul li.cur::before { content: ''; width: 10px; height: 10px; border-radius: 100%; background-color: #20c401; position: absolute; bottom: 0; left: 0; right: 0; margin: 0 auto; } .cooperation-agent .cooperation-agent-content #JMYS .tab-bottom ul li { width: 1000px; margin: 45px auto; color: #585756; line-height: 1.5em; text-align: center; } .cooperation-agent .cooperation-agent-content #JMYS .tab-bottom ul li:not(:first-child) { display: none; } .cooperation-agent .cooperation-agent-content #JMTJ a, .cooperation-agent .cooperation-agent-content #JMWD a { cursor: default; } .cooperation-agent .cooperation-agent-content #JMDX .duix-box { margin-top: 83px; overflow: hidden; } .cooperation-agent .cooperation-agent-content #JMDX .duix-box .tuwen { float: left; } .cooperation-agent .cooperation-agent-content #JMDX .duix-box .tuwen .tuwen-img { width: 484px; height: 152px; overflow: hidden; } .cooperation-agent .cooperation-agent-content #JMDX .duix-box .tuwen .tuwen-p { width: 484px; height: 62px; line-height: 62px; text-align: center; font-size: 16px; color: #000; margin-top: 20px; position: relative; } .cooperation-agent .cooperation-agent-content #JMDX .duix-box .tuwen .tuwen-p ul li { position: absolute; } .cooperation-agent .cooperation-agent-content #JMDX .duix-box .tuwen .tuwen-p ul li img { display: block; } .cooperation-agent .cooperation-agent-content #JMDX .duix-box .tuwen .tuwen-p ul li:nth-child(1) { top: 0; left: 0; } .cooperation-agent .cooperation-agent-content #JMDX .duix-box .tuwen .tuwen-p ul li:nth-child(2) { top: 0; right: 0; } .cooperation-agent .cooperation-agent-content #JMDX .duix-box .tuwen .tuwen-p ul li:nth-child(3) { bottom: 0; left: 0; } .cooperation-agent .cooperation-agent-content #JMDX .duix-box .tuwen .tuwen-p ul li:nth-child(4) { bottom: 0; right: 0; } .cooperation-agent .cooperation-agent-content #JMDX .duix-box .tuwen-text { float: left; width: 132px; line-height: 152px; text-align: center; font-family: Futura; font-size: 42px; font-weight: bold; color: #eee; } .cooperation-agent .cooperation-agent-content #JMLC .liucheng { margin-top: 62px; position: relative; } .cooperation-agent .cooperation-agent-content #JMLC .liucheng::after { clear: both; content: '.'; display: block; width: 0; height: 0; visibility: hidden; } .cooperation-agent .cooperation-agent-content #JMLC .liucheng ul::after { clear: both; content: '.'; display: block; width: 0; height: 0; visibility: hidden; } .cooperation-agent .cooperation-agent-content #JMLC .liucheng ul li { float: left; } .cooperation-agent .cooperation-agent-content #JMLC .liucheng ul .one { width: 150px; } .cooperation-agent .cooperation-agent-content #JMLC .liucheng ul .one .lc-i { width: 80px; height: 80px; border-radius: 100%; box-shadow: 0 10px 50px rgba(0, 0, 0, 0.2); margin-left: 10px; transition: all .3s; } .cooperation-agent .cooperation-agent-content #JMLC .liucheng ul .one .lc-i i { font-size: 40px; text-align: center; color: #585756; line-height: 80px; display: block; transition: all .3s; } .cooperation-agent .cooperation-agent-content #JMLC .liucheng ul .one .lc-div { margin: 20px 0 16px 0; font-size: 16px; font-weight: bold; color: #040000; line-height: 1em; } .cooperation-agent .cooperation-agent-content #JMLC .liucheng ul .one .lc-p { font-size: 14px; line-height: 1em; color: #585756; margin-top: 10px; } .cooperation-agent .cooperation-agent-content #JMLC .liucheng ul .one:hover .lc-i { box-shadow: 0 10px 50px rgba(92, 210, 4, 0.3); background-color: #20c401; } .cooperation-agent .cooperation-agent-content #JMLC .liucheng ul .one:hover .lc-i i { color: #fff; } .cooperation-agent .cooperation-agent-content #JMLC .liucheng ul .two { width: 126px; } .cooperation-agent .cooperation-agent-content #JMLC .liucheng ul .two i { display: block; margin: 0 auto; font-size: 36px; color: #20c401; text-indent: 10px; line-height: 80px; } .cooperation-agent .cooperation-agent-content #JMLC .liucheng.liucheng-top .tu { position: absolute; top: 40px; right: 0; } .cooperation-agent .cooperation-agent-content #JMLC .liucheng.liucheng-bottom .tu { position: absolute; left: 0; bottom: 0; } .cooperation-agent .cooperation-agent-content #JMLC .liucheng.liucheng-bottom ul { float: right; } .cooperation-agent .cooperation-agent-content #ZDFC .swiper-box { margin-top: 62px; padding-bottom: 75px; position: relative; } .cooperation-agent .cooperation-agent-content #ZDFC .swiper-box .ditu, .cooperation-agent .cooperation-agent-content #ZDFC .swiper-box .datu { width: 624px; height: 472px; } .cooperation-agent .cooperation-agent-content #ZDFC .swiper-box .ditu { filter: blur(10px); position: absolute; top: 70px; left: 316px; } .cooperation-agent .cooperation-agent-content #ZDFC .swiper-box .datu { position: relative; } .cooperation-agent .cooperation-agent-content #ZDFC .swiper-box .datu img { box-shadow: 30px 30px 100px #fff; position: relative; z-index: 1; } .cooperation-agent .cooperation-agent-content #ZDFC .swiper-box .lunbo { width: 480px; overflow: hidden; position: absolute; top: 152px; right: 0; } .cooperation-agent .cooperation-agent-content #ZDFC .swiper-box .lunbo ul { width: 2000px; margin-left: 130px; } .cooperation-agent .cooperation-agent-content #ZDFC .swiper-box .lunbo ul li { width: 222px; height: 168px; margin: 0 19px; background-size: cover; background-position: center center; float: left; } .cooperation-agent .cooperation-agent-content #ZDFC .swiper-box .lunbo ul li.cur { border: 2px solid #20c401; } .cooperation-agent .cooperation-agent-content #ZDFC .swiper-box .lunbo .lb-btn-boox { position: relative; } .cooperation-agent .cooperation-agent-content #ZDFC .swiper-box .lunbo .lb-btn-boox .lb-btn { padding: 20px; font-size: 20px; color: #20c401; cursor: pointer; position: absolute; top: 50px; z-index: 100; } .cooperation-agent .cooperation-agent-content #ZDFC .swiper-box .lunbo .lb-btn-boox .lb-btn.lb-btn-left { left: 0; } .cooperation-agent .cooperation-agent-content #ZDFC .swiper-box .lunbo .lb-btn-boox .lb-btn.lb-btn-right { right: 0; } .cooperation-agent .cooperation-agent-content #ZDFC .swiper-box .lunbo .lb-btn-boox .btn-yy-left { position: absolute; top: 0; left: 0; } .cooperation-agent .cooperation-agent-content #ZDFC .swiper-box .lunbo .lb-btn-boox .btn-yy-right { position: absolute; top: 0; right: 0; opacity: 0.3; } .cooperation-agent .cooperation-agent-content #ZDFC .swiper-box .photos { font-size: 50px; text-transform: uppercase; font-family: Futura; font-weight: bold; color: #eee; position: absolute; left: 0; bottom: -6px; } .cooperation-agent .cooperation-agent-content #JMWD .jianjie { line-height: 36px; margin: 62px 0 60px 0; } .cooperation-agent .cooperation-agent-content #JMWD .jianjie p { color: #585756; } .cooperation-agent .cooperation-agent-content #JMWD .jianjie span { color: #20c401; font-weight: bold; } .cooperation-agent, .research { overflow-x: hidden; } .cooperation-agent .ca-jion-title, .research .ca-jion-title { color: #000; font-weight: bold; line-height: 1em; text-align: center; margin-bottom: 20px; position: relative; } .cooperation-agent .ca-jion-title::before, .research .ca-jion-title::before { content: ''; width: 50px; height: 3px; background-color: #20c401; position: absolute; bottom: -20px; left: 0; right: 0; margin: auto; } .cooperation-agent .coop-ce, .research .coop-ce { width: 178px; background-color: #fff; position: absolute; top: 0; right: 0; z-index: 100; transition: all .3s; } .cooperation-agent .coop-ce.on, .research .coop-ce.on { position: fixed; } .cooperation-agent .coop-ce.mix-w, .research .coop-ce.mix-w { right: -178px; } .cooperation-agent .coop-ce.mix-w .cur::before, .research .coop-ce.mix-w .cur::before { left: -30px; color: #fff; visibility: visible; } .cooperation-agent .coop-ce ul li, .research .coop-ce ul li { height: 50px; line-height: 50px; transition: all .3s; cursor: pointer; position: relative; } .cooperation-agent .coop-ce ul li:hover, .research .coop-ce ul li:hover { background-color: #20c401; } .cooperation-agent .coop-ce ul li:hover p, .research .coop-ce ul li:hover p { border-bottom: 0; color: #fff; } .cooperation-agent .coop-ce ul li:hover.goTop div, .cooperation-agent .coop-ce ul li:hover.goTop i, .research .coop-ce ul li:hover.goTop div, .research .coop-ce ul li:hover.goTop i { color: #fff; } .cooperation-agent .coop-ce ul li a, .research .coop-ce ul li a { display: block; overflow: hidden; } .cooperation-agent .coop-ce ul li div, .research .coop-ce ul li div { width: 50px; text-indent: 30px; font-size: 20px; color: white; float: left; font-family: Futura; transition: all .3s; } .cooperation-agent .coop-ce ul li p, .research .coop-ce ul li p { width: 128px; height: 50px; font-size: 18px; box-sizing: border-box; text-align: center; border-bottom: 2px solid #e0e0e0; float: left; transition: all .3s; } .cooperation-agent .coop-ce ul li.cur, .research .coop-ce ul li.cur { background-color: #20c401; box-shadow: 0 7px 27px rgba(0, 0, 0, 0.1); } .cooperation-agent .coop-ce ul li.cur div, .cooperation-agent .coop-ce ul li.cur p, .research .coop-ce ul li.cur div, .research .coop-ce ul li.cur p { color: white; font-weight: bold; } .cooperation-agent .coop-ce ul li.cur p, .research .coop-ce ul li.cur p { border-bottom: 0 solid #e0e0e0; font-size: 20px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .cooperation-agent .coop-ce ul li.cur::before, .research .coop-ce ul li.cur::before { content: '<'; width: 30px; height: 50px; background-color: #20c401; text-align: center; color: transparent; font-weight: bold; position: absolute; top: 0; left: 0; transition: all .3s; visibility: hidden; } .cooperation-agent .coop-ce ul li.goTop div, .research .coop-ce ul li.goTop div { width: 130px; text-transform: uppercase; font-family: Futura; font-size: 24px; color: #20c401; text-align: right; } .cooperation-agent .coop-ce ul li.goTop i, .research .coop-ce ul li.goTop i { margin-left: 10px; font-size: 24px; color: #20c401; } /* research */ .research { /* 1研发中心 */ /* 2研发团队 */ /* 3研发投入 */ /* 4研发平台 */ /* 5产学研合作 */ /* 6专利申请与持有 */ /* 7技术认证 */ /* 8标准制修订 */ /* 9获奖情况 */ } .research .banner { width: 100%; height: 60vh; background-image: url("../image/banner5.jpg?v=1"); background-size: cover; background-position: center center; } .research .research-content { position: relative; } .research .research-content .research-jianjie { margin: 100px auto 40px auto; } .research .research-content .research-jianjie p { font-size: 14px; line-height: 24px; color: #595857; margin-bottom: 24px; } .research .research-content .research-lian .title { color: #231916; text-align: center; position: relative; } .research .research-content .research-lian .title::before { content: ''; width: 50px; height: 3px; background-color: #20c401; position: absolute; left: 0; right: 0; margin: auto; bottom: -16px; } .research .research-content .research-lian .lian-ul { width: 100%; margin: 24px auto 0; } .research .research-content .research-lian .lian-ul ul { width: 100%; height: 68px; position: relative; } .research .research-content .research-lian .lian-ul ul::before { content: ''; width: 100%; height: 1px; border-bottom: 2px dashed #949494; position: absolute; top: 0; bottom: 0; left: 0; margin: auto; } .research .research-content .research-lian .lian-ul ul li { width: 254px; line-height: 68px; background-color: #fff; color: #3f3b3a; text-align: center; position: absolute; transition: all .3s; } .research .research-content .research-lian .lian-ul ul li span:nth-child(1) { margin: 0 6px; } .research .research-content .research-lian .lian-ul ul li span:nth-child(2) { font-weight: bold; } .research .research-content .research-lian .lian-ul ul li:hover { color: #20c401; font-size: 20px; } .research .research-content .research-lian .lian-ul ul li:nth-child(1) { top: 0; left: 0; } .research .research-content .research-lian .lian-ul ul li:nth-child(2) { top: 0; left: 0; right: 0; margin: auto; } .research .research-content .research-lian .lian-ul ul li:nth-child(3) { top: 0; right: 0; } .research #YFZX, .research #YFTD, .research #YFTR, .research #YFQT, .research #CXYHZ, .research #ZLSAYCY, .research #JSRZ, .research #BZZXD, .research #HJQK { padding-top: 100px; } .research #YFZX .title-fu, .research #YFTD .title-fu, .research #YFTR .title-fu, .research #YFQT .title-fu, .research #CXYHZ .title-fu, .research #ZLSAYCY .title-fu, .research #JSRZ .title-fu, .research #BZZXD .title-fu, .research #HJQK .title-fu { font-size: 14px; color: #595857; line-height: 1.5em; text-align: left; margin: 62px 0 42px; } .research #YFZX .kuai-box { width: 100%; height: 486px; position: relative; margin-top: 56px; } .research #YFZX .kuai-box .jianjie { width: 556px; line-height: 24px; color: #fff; background-color: #20c401; box-shadow: 20px 20px 0 #fff; padding: 40px 36px; position: absolute; top: 0; left: 0; z-index: 100; text-align: justify; } .research #YFZX .kuai-box .tupian { width: 734px; height: 382px; position: absolute; right: 0; bottom: 0; } .research #YFZX .kuai-box .wen { position: absolute; left: 0; bottom: -12%; z-index: 100; } .research #YFZX .sjz { height: 1351px; margin-top: 120px; position: relative; } .research #YFZX .sjz .sjz-bj, .research #YFZX .sjz .sjz-bjs { width: 364px; position: absolute; top: 0; left: 0; right: 0; z-index: -1; margin: auto; } .research #YFZX .sjz .sjz-bjs { height: 100px; transition: all 1s; overflow: hidden; } .research #YFZX .sjz .sjz-title { width: 100%; color: #231916; text-align: center; position: absolute; top: -80px; left: 0; } .research #YFZX .sjz .sjz-title::before { content: ''; width: 50px; height: 3px; background-color: #20c401; display: block; position: absolute; left: 0; right: 0; bottom: -16px; margin: auto; } .research #YFZX .sjz ul { overflow: hidden; } .research #YFZX .sjz ul li { width: 50%; height: 270px; margin-top: 57px; position: relative; } .research #YFZX .sjz ul li:nth-child(1) { margin-top: 100px; } .research #YFZX .sjz ul li:nth-child(2) { margin-top: 248px; } .research #YFZX .sjz ul li .heng { width: 372px; height: 2px; margin-top: 90px; margin-bottom: 130px; border-bottom: 1px dashed #898989; } .research #YFZX .sjz ul li .heng.hhh { position: absolute; right: -10px; } .research #YFZX .sjz ul li dl { margin-top: 20px; } .research #YFZX .sjz ul li dl dt { font-weight: bold; color: #20c401; margin-bottom: 5px; } .research #YFZX .sjz ul li dl dd { font-size: 14px; color: #595857; line-height: 24px; text-align: justify; } .research #YFZX .sjz ul li dl .title { font-size: 18px; color: #231916; font-weight: bold; } .research #YFZX .sjz ul li dl .sjz-remove { color: #e15260; } .research #YFZX .sjz ul li .yuan { width: 36px; height: 36px; border-radius: 100%; background-color: #fff; box-shadow: 0 5px 15px rgba(0, 0, 0, 0.2); padding: 9px; position: absolute; } .research #YFZX .sjz ul li .yuan::before { content: ''; width: 18px; height: 18px; background-color: #20c401; border-radius: 100%; display: block; } .research #YFZX .sjz ul .sjz-right { float: right; } .research #YFZX .sjz ul .sjz-right .heng { margin-right: 20px; float: left; } .research #YFZX .sjz ul .sjz-right .sjz-img { position: absolute; top: 0; left: 70px; } .research #YFZX .sjz ul .sjz-right .yuan { left: -17px; top: 70px; } .research #YFZX .sjz ul .sjz-left { float: left; } .research #YFZX .sjz ul .sjz-left dl { width: 160px; text-align: right; float: left; } .research #YFZX .sjz ul .sjz-left .heng { position: absolute; right: 0; } .research #YFZX .sjz ul .sjz-left .sjz-img { position: absolute; top: 0; right: 70px; } .research #YFZX .sjz ul .sjz-left .yuan { right: -17px; top: 70px; } .research #YFTD .ab-box { overflow: hidden; display: flex; flex-wrap: wrap; } .research #YFTD .ab-box .a, .research #YFTD .ab-box .b { width: 50%; overflow: hidden; } .research #YFTD .ab-box .img { float: left; } .research #YFTD .ab-box .text { width: 400px; font-size: 14px; line-height: 24px; color: #595857; margin-left: 20px; float: left; } .research #YFTD .ab-box .text .hei { color: #000000; } .research #YFTD .ab-box .text .lv { font-size: 20px; color: #20c401; } .research #YFTR .touru-box::after { clear: both; content: '.'; display: block; width: 0; height: 0; visibility: hidden; } .research #YFTR .touru-box { display: flex; justify-content: center; } .research #YFTR .touru-box .touru { width: 33.33%; height: 272px; /*float: left;*/ text-align: center; position: relative; } .research #YFTR .touru-box .touru:hover { box-shadow: 0 15px 50px rgba(0, 0, 0, 0.1); } .research #YFTR .touru-box .touru .tr-i { margin-top: 30px; } .research #YFTR .touru-box .touru .tr-i i { font-size: 60px; color: #20c401; font-weight: bold; } .research #YFTR .touru-box .touru .tr-y { font-size: 30px; font-weight: bold; color: transparent; text-transform: uppercase; } .research #YFTR .touru-box .touru .tr-z { font-size: 48px; color: #595857; font-weight: bold; margin-top: -68px; } .research #YFTR .touru-box .touru p { font-size: 14px; color: #595857; margin-top: 15px; } .research #YFQT .pt-tab, .research #HJQK .pt-tab { height: 408px; } .research #YFQT .pt-tab::after, .research #HJQK .pt-tab::after { content: ''; width: 0; height: 0; display: block; clear: both; visibility: hidden; } .research #YFQT .pt-tab .pt-left, .research #HJQK .pt-tab .pt-left { width: 472px; height: 296px; position: relative; float: left; margin-top: 70px; overflow: hidden; } .research #YFQT .pt-tab .pt-left .lv, .research #HJQK .pt-tab .pt-left .lv { width: 100%; height: 46px; background-color: #20c401; position: absolute; top: 145px; z-index: -1; } .research #YFQT .pt-tab .pt-left ul, .research #HJQK .pt-tab .pt-left ul { /*margin-top: 144px;*/ overflow: hidden; } .research #YFQT .pt-tab .pt-left ul li, .research #HJQK .pt-tab .pt-left ul li { text-align: center; font-size: 14px; line-height: 48px; color: #3f3b3a; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; transition: all .3s; } .research #YFQT .pt-tab .pt-left ul li.cur, .research #HJQK .pt-tab .pt-left ul li.cur { font-size: 16px; color: #fff; } .research #YFQT .pt-tab .pt-center, .research #HJQK .pt-tab .pt-center { width: 244px; margin-top: 80px; float: left; } .research #YFQT .pt-tab .pt-center .pt-btn, .research #HJQK .pt-tab .pt-center .pt-btn { height: 58px; cursor: pointer; } .research #YFQT .pt-tab .pt-center .pt-btn i, .research #HJQK .pt-tab .pt-center .pt-btn i { font-size: 34px; color: #cdcdcd; display: block; text-align: center; } .research #YFQT .pt-tab .pt-center .pt-btn:hover i, .research #HJQK .pt-tab .pt-center .pt-btn:hover i { color: #20c401; } .research #YFQT .pt-tab .pt-center .pt-heng, .research #HJQK .pt-tab .pt-center .pt-heng { float: left; width: 243px; height: 150px; position: relative; } .research #YFQT .pt-tab .pt-center .pt-heng::before, .research #HJQK .pt-tab .pt-center .pt-heng::before { content: ''; width: 100%; border-bottom: 2px dashed #20c401; position: absolute; left: 0; top: 100px; } .research #YFQT .pt-tab .pt-right, .research #HJQK .pt-tab .pt-right { width: 284px; float: left; } .research #YFQT .pt-tab .pt-right .pt-wen, .research #HJQK .pt-tab .pt-right .pt-wen { font-family: Futura; font-size: 74px; font-weight: bold; text-transform: uppercase; color: transparent; line-height: 1em; } .research #YFQT .pt-tab .pt-right .pt-tu, .research #HJQK .pt-tab .pt-right .pt-tu { width: 394px; height: 274px; box-shadow: 0 10px 40px rgba(0, 0, 0, 0.1); overflow: hidden; } .research #YFQT .pt-tab .pt-right .pt-tu { box-shadow: none; } .research #YFQT .pt-tab .pt-right .pt-tu .pub_img_box, .research #HJQK .pt-tab .pt-right .pt-tu .pub_img_box{ height: 274px; } .pub_img_box { position: relative; overflow: hidden; } .pub_img_box .pub_img { position: absolute; width: 100%; height: 100%; left: 0; top: 0; background-size: contain; background-position: center; background-repeat: no-repeat; } .research #YFQT .pt-tab .pt-right .pt-tu ul, .research #HJQK .pt-tab .pt-right .pt-tu ul { /*margin-top: -822px;*/ } .research #YFQT .pt-tab .pt-right .pt-tu ul li, .research #HJQK .pt-tab .pt-right .pt-tu ul li { overflow: hidden; } .research #CXYHZ .list { margin: 0 -38px; } .research #CXYHZ .list ul { display: flex; flex-wrap: wrap; } .research #CXYHZ .list ul::after { clear: both; content: '.'; display: block; width: 0; height: 0; visibility: hidden; } .research #CXYHZ .list ul li { width: 33.33%; padding: 0 38px; margin-top: 40px; float: left; } .research #CXYHZ .list ul li div i { font-size: 64px; color: #3f3b3a; text-align: center; display: block; } .research #CXYHZ .list ul li p { font-size: 14px; line-height: 24px; color: #010101; text-align: center; } .research #CXYHZ .list ul li:hover div i { color: #20c401; } .research #ZLSAYCY .cy-flexslider { width: 1000px; margin: 0 auto; position: relative; } .research #ZLSAYCY .cy-flexslider::before { content: ''; width: 100%; height: 120px; background-color: #fafafa; position: absolute; left: 0; bottom: 0; } .research #ZLSAYCY .cy-flexslider .slides-btn .btn-left i, .research #ZLSAYCY .cy-flexslider .slides-btn .btn-right i { font-size: 20px; position: absolute; z-index: 100; color: #333; cursor: pointer; } .research #ZLSAYCY .cy-flexslider .slides-btn .btn-left i:hover, .research #ZLSAYCY .cy-flexslider .slides-btn .btn-right i:hover { color: #20c401; } .research #ZLSAYCY .cy-flexslider .slides-btn .btn-left i { top: 85px; left: -30px; } .research #ZLSAYCY .cy-flexslider .slides-btn .btn-right i { top: 85px; right: -30px; } .research #ZLSAYCY .cy-flexslider .flex-control-nav { display: none; } .research #ZLSAYCY .cy-flexslider .flex-direction-nav { visibility: hidden; } .research #ZLSAYCY .cy-flexslider .flex-direction-nav a { height: 50px; opacity: 1; } .research #ZLSAYCY .cy-flexslider .flex-direction-nav a::before { color: #cdcdcd; } .research #ZLSAYCY .cy-flexslider .flex-direction-nav a:hover::before { color: #20c401; } .research #ZLSAYCY .cy-flexslider .flex-direction-nav .flex-disabled { opacity: 1; } .research #ZLSAYCY .cy-flexslider .slides li div { height: 208px; box-sizing: border-box; background-color: #fff; position: relative; } .research #ZLSAYCY .cy-flexslider .slides li div img { max-width: 100%; position: absolute; top: 0; right: 0; bottom: 0; left: 0; margin: auto; } .research #ZLSAYCY .cy-flexslider .slides li div .zz { width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.5); cursor: pointer; opacity: 0; transition: all .3s; } .research #ZLSAYCY .cy-flexslider .slides li div .zz i { font-size: 44px; color: #20c401; display: block; text-align: center; line-height: 208px; } .research #ZLSAYCY .cy-flexslider .slides li p { font-size: 14px; color: #595857; text-align: center; margin-top: 20px; padding-bottom: 30px; } .research #ZLSAYCY .cy-flexslider .slides li:hover div .zz { opacity: 1; } .research #ZLSAYCY .tanc { display: none; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.8); position: fixed; top: 0; left: 0; z-index: 999; } .research #ZLSAYCY .tanc .tancBox { width: 100%; height: 100%; position: relative; } .research #ZLSAYCY .tanc .tancBox .tanImg { } .research #ZLSAYCY .tanc .tancBox .tanImg img { display: block; position: absolute; top: -24px; right: 0; bottom: 0; left: 0; margin: auto; } .research #ZLSAYCY .tanc .tancBox p { width: 100%; font-size: 14px; line-height: 24px; color: #fff; margin: 20px auto; text-align: center; position: absolute; bottom: 20px; } .research #ZLSAYCY .tanc .tancBox .colse { width: 60px; height: 60px; text-align: center; line-height: 60px; position: absolute; top: 0; right: 0; cursor: pointer; } .research #ZLSAYCY .tanc .tancBox .colse i { font-size: 40px; color: #fff; } .research #JSRZ .xx-box { height: 214px; margin-top: 76px; position: relative; display: flex; flex-wrap: wrap; justify-content: space-between; } .research #JSRZ .xx-box .xx { width: calc((100% - 60px) / 4); height: 72px; background-color: #fafafa; position: relative; margin-bottom: 20px; } .research #JSRZ .xx-box .xx div { position: absolute; top: -17px; left: -16px; } .research #JSRZ .xx-box .xx p { color: #231916; font-size: 14px; text-align: center; line-height: 72px; } /*.research #JSRZ .xx-box .xx:nth-child(1) {*/ /* top: 0;*/ /* left: 206px;*/ /*}*/ /*.research #JSRZ .xx-box .xx:nth-child(2) {*/ /* top: 0;*/ /* right: 206px;*/ /*}*/ /*.research #JSRZ .xx-box .xx:nth-child(3) {*/ /* top: 140px;*/ /* left: 0;*/ /*}*/ /*.research #JSRZ .xx-box .xx:nth-child(4) {*/ /* top: 140px;*/ /* left: 0;*/ /* right: 0;*/ /* margin: auto;*/ /*}*/ /*.research #JSRZ .xx-box .xx:nth-child(5) {*/ /* top: 140px;*/ /* right: 0;*/ /*}*/ .research #JSRZ .xx-box .xx:hover { background-color: #fff; box-shadow: 0 10px 40px rgba(0, 0, 0, 0.1); transform: scale(1.1); } .research #JSRZ .xx-box .xx:hover p { color: #20c401; } .research #BZZXD .xd-box::after { content: ''; clear: both; width: 0; height: 0; display: block; visibility: hidden; } .research #BZZXD .xd-box .xd { width: 30%; height: 378px; background-color: #fafafa; padding-top: 24px; float: left; margin-right: 3.33%; transition: all .3s; } .research #BZZXD .xd-box .xd:last-child { margin-right: 0; } .research #BZZXD .xd-box .xd .title { width: 165px; height: 42px; background-color: #c1c1c1; margin-bottom: 24px; transition: all .3s; } .research #BZZXD .xd-box .xd .title .dian { width: 14px; height: 14px; border: 1px solid #fff; border-radius: 100%; margin: 15px 13px 0 19px; float: left; } .research #BZZXD .xd-box .xd .title .dian div { width: 8px; height: 8px; border-radius: 100%; background-color: #fff; margin: 2px; } .research #BZZXD .xd-box .xd .title p { font-size: 24px; line-height: 42px; font-weight: bold; color: #fff; float: left; } .research #BZZXD .xd-box .xd .neir { width: 100%; height: 288px; overflow: auto; } .research #BZZXD .xd-box .xd .neir p { padding: 0 30px 0 40px; font-size: 14px; line-height: 24px; color: #727171; margin-bottom: 30px; } .research #BZZXD .xd-box .xd:hover { background-color: #fff; box-shadow: 0 10px 40px rgba(0, 0, 0, 0.05); } .research #BZZXD .xd-box .xd:hover .title { background-color: #20c401; } /* service */ .service-one .banner { width: 100%; height: 60vh; background-image: url("../image/banner6.jpg"); background-size: cover; background-position: center center; position: relative; } .service-one .banner .banner-box { height: 230px; position: absolute; left: 70px; right: 0; top: 62px; bottom: 0; margin: auto; } .service-one .banner .banner-box .b-title { color: #20c401; font-weight: bold; position: relative; } .service-one .banner .banner-box .b-title::before { content: ''; width: 55px; height: 4px; background-color: #20c401; position: absolute; left: 0; bottom: -10px; } .service-one .banner .banner-box .b-biaoyu { font-size: 20px; color: #fff; font-weight: bold; margin-top: 20px; } .service-one .banner .banner-box .b-tel, .service-one .banner .banner-box .b-tel a { font-size: 20px; color: #fff; font-weight: bold; } .service-one .service-tab { width: 100%; height: 306px; background-color: #f7f8fa; } .service-one .service-tab .service-tab-box { padding: 93px 0 0 0; display: flex; justify-content: space-between; } .service-one .service-tab .service-tab-box::after { content: '.'; width: 0; height: 0; display: block; clear: both; visibility: hidden; } .service-one .service-tab .service-tab-box .service-tab-div { width: 284px; height: 120px; line-height: 120px; margin-left: 0; background-image: url("../image/tba-b.png"); background-size: cover; text-align: center; color: #707070; font-weight: bold; transition: all .3s; } .service-one .service-tab .service-tab-box .service-tab-div a { display: block; } .service-one .service-tab .service-tab-box .service-tab-div.cur { background-color: #20c401; box-shadow: 0 20px 55px rgba(92, 210, 4, 0.5); color: #fff; } .service-one .service-tab .service-tab-box .service-tab-div.cur a, .service-one .service-tab .service-tab-box .service-tab-div.cur:hover a { color: #fff; } .service-one .service-tab .service-tab-box .service-tab-div:hover a { color: #20c401; } .service-one .service-tab-ul .service-ul .service-li-one { display: block; } .service-one .service-tab-ul .service-ul .service-li-one .one-top { margin: 100px auto 200px; } .service-one .service-tab-ul .service-ul .service-li-one .one-top ul { display: flex; justify-content: space-between; } .service-one .service-tab-ul .service-ul .service-li-one .one-top ul li { width: 250px; float: left; margin-left: 0; } .service-one .service-tab-ul .service-ul .service-li-one .one-top ul li .one-top-i { width: 90px; height: 90px; border-radius: 100%; background-color: rgba(0, 0, 0, 0.5); margin: 0 auto; box-shadow: 0 20px 55px rgba(0, 0, 0, 0.15); transition: all .3s; } .service-one .service-tab-ul .service-ul .service-li-one .one-top ul li .one-top-i i { line-height: 90px; text-align: center; display: block; font-size: 60px; color: #fff; } .service-one .service-tab-ul .service-ul .service-li-one .one-top ul li .one-top-div { line-height: 42px; color: #000000; margin-top: 10px; text-align: center; } .service-one .service-tab-ul .service-ul .service-li-one .one-top ul li .one-top-heng { width: 25px; height: 2px; background-color: #626262; margin: 0 auto 10px; } .service-one .service-tab-ul .service-ul .service-li-one .one-top ul li .one-top-p { line-height: 24px; color: #686868; text-align: center; transition: all .3s; } .service-one .service-tab-ul .service-ul .service-li-one .one-top ul li:hover .one-top-i { background-color: #20c401; box-shadow: 0 20px 30px rgba(92, 210, 4, 0.3); } .service-one .service-tab-ul .service-ul .service-li-one .one-top ul li:hover .one-top-p { color: #20c401; } .service-one .service-tab-ul .service-ul .service-li-one .one-from-box { background-color: #f2f4f5; } .service-one .service-tab-ul .service-ul .service-li-one .one-from-box .one-form { width: 738px; background-color: #fff; margin: 0 auto; padding: 76px 106px; box-shadow: 0 20px 55px rgba(0, 0, 0, 0.15); position: relative; top: -115px; } .service-one .service-tab-ul .service-ul .service-li-one .one-from-box .one-form .msgRow .sub { position: relative; top: -20px; } .service-one .service-tab-ul .service-ul .service-li-one .one-from-box .one-form .from-title { line-height: 1em; color: #20c401; text-align: center; font-weight: bold; } .service-one .service-tab-ul .service-ul .service-li-one .one-from-box .one-form .msgRow.from-name .col { width: 48%; margin-right: 0; } .service-one .service-tab-ul .service-ul .service-li-one .one-from-box .one-form .msgRow.from-name .col:first-child { margin-right: 2%; } .service-one .service-tab-ul .service-ul .service-li-one .one-from-box .one-form .msgRow.from-chang .col { width: 100%; } .service-one .service-tab-ul .service-ul .service-li-one .one-from-box .one-form .msgRow.from-radio .col { width: 100%; } .service-one .service-tab-ul .service-ul .service-li-one .one-from-box .one-form .msgRow.from-radio .radio_con { height: auto; } .service-one .service-tab-ul .service-ul .service-li-one .one-from-box .one-form .msgRow .scImg { line-height: 10px; font-size: 14px; } .service-one .service-tab-ul .service-ul .service-li-two .sr-title { color: #000000; text-align: center; font-weight: bold; line-height: 1em; margin-top: 100px; position: relative; } .service-one .service-tab-ul .service-ul .service-li-two .sr-title::before { content: ''; width: 50px; height: 3px; background-color: #20c401; position: absolute; bottom: -25px; left: 0; right: 0; margin: auto; } .service-one .service-tab-ul .service-ul .service-li-two .two-ul { margin: 0 auto 100px; display: flex; justify-content: space-between; flex-wrap: wrap; } .service-one .service-tab-ul .service-ul .service-li-two .two-ul .two-li { width: 246px; height: 342px; margin: 95px 20px 0; position: relative; } .service-one .service-tab-ul .service-ul .service-li-two .two-ul .two-li .two-li-k { width: 246px; height: 260px; border: 1px solid #8c98a8; position: absolute; bottom: 20px; } .service-one .service-tab-ul .service-ul .service-li-two .two-ul .two-li .two-li-num { width: 200px; position: absolute; top: 0; left: 0; right: 0; margin: 0 auto; font-size: 137px; font-family: Futura; font-weight: bold; color: #f5f5f5; text-align: center; line-height: 1em; background-color: #fff; transition: all .3s; } .service-one .service-tab-ul .service-ul .service-li-two .two-ul .two-li .two-li-title { width: 100%; position: absolute; top: 50px; left: 0; right: 0; margin: auto; text-align: center; font-weight: bold; color: #000; line-height: 1em; } .service-one .service-tab-ul .service-ul .service-li-two .two-ul .two-li .two-li-text { width: 165px; position: absolute; top: 140px; left: 0; right: 0; margin: auto; text-align: center; line-height: 30px; } .service-one .service-tab-ul .service-ul .service-li-two .two-ul .two-li .two-li-i { width: 62px; height: 44px; position: absolute; bottom: 0; left: 0; right: 0; margin: auto; background-color: #fff; } .service-one .service-tab-ul .service-ul .service-li-two .two-ul .two-li .two-li-i i { font-size: 44px; line-height: 1em; text-align: center; display: block; color: #d3d3d3; transition: all .3s; } .service-one .service-tab-ul .service-ul .service-li-two .two-ul .two-li:hover .two-li-num, .service-one .service-tab-ul .service-ul .service-li-two .two-ul .two-li:hover .two-li-i i { color: #20c401; } .service-one .service-tab-ul .service-ul .service-li-three { padding-top: 100px; } .service-one .service-tab-ul .service-ul .service-li-three .page { margin-bottom: 60px; } .service-one .service-tab-ul .service-ul .service-li-three .page .title { width: 100%; text-align: center; line-height: 1em; color: #000; margin-bottom: 20px; position: relative; } .service-one .service-tab-ul .service-ul .service-li-three .page .title::before { content: ''; width: 50px; height: 3px; background-color: #20c401; position: absolute; left: 0; right: 0; bottom: -20px; margin: auto; } .service-one .service-tab-ul .service-ul .service-li-three .page .page-2-fu { margin-top: 56px; } .service-one .service-tab-ul .service-ul .service-li-three .page .page-title-fu { color: #3f3f3f; line-height: 30px; } .service-one .service-tab-ul .service-ul .service-li-three .page .page-title-fu.page-title-fu-top { margin-top: 56px; } .service-one .service-tab-ul .service-ul .service-li-three .page.page-1 .page-1-tab { margin-top: 89px; } .service-one .service-tab-ul .service-ul .service-li-three .page.page-1 .page-1-tab ul { display: flex; justify-content: space-between; } .service-one .service-tab-ul .service-ul .service-li-three .page.page-1 .page-1-tab ul li { width: 210px; height: 240px; box-shadow: 0 20px 55px rgba(0, 0, 0, 0.1); float: left; position: relative; } .service-one .service-tab-ul .service-ul .service-li-three .page.page-1 .page-1-tab ul li .tab-i { width: 66px; height: 66px; border-radius: 100%; box-shadow: 0 15px 35px rgba(0, 0, 0, 0.1); background-color: #fff; position: absolute; top: -33px; left: 0; right: 0; margin: auto; } .service-one .service-tab-ul .service-ul .service-li-three .page.page-1 .page-1-tab ul li .tab-i i { font-size: 30px; color: #20c401; line-height: 66px; text-align: center; display: block; } .service-one .service-tab-ul .service-ul .service-li-three .page.page-1 .page-1-tab ul li .tab-nei { line-height: 2em; color: #434242; padding: 20px 28px 0; text-align: center; position: absolute; top: 40px; } .service-one .service-tab-ul .service-ul .service-li-three .page.page-1 .page-1-tab ul li .tab-bottom { width: 100%; height: 50px; background-color: #f7f8fa; text-align: center; line-height: 50px; color: #414141; position: absolute; left: 0; bottom: 0; transition: all .3s; } .service-one .service-tab-ul .service-ul .service-li-three .page.page-1 .page-1-tab ul li:first-child { margin-left: 0; } .service-one .service-tab-ul .service-ul .service-li-three .page.page-1 .page-1-tab ul li:hover .tab-bottom { background-color: #20c401; font-size: 18px; color: #fff; } .service-one .service-tab-ul .service-ul .service-li-three .page.page-2 .page-2-english { display: none; } .service-one .service-tab-ul .service-ul .service-li-three .page.page-2 .page-2-what { color: #000000; /*font-weight: bold;*/ text-align: center; line-height: 1em; margin-top: 40px; } .service-one .service-tab-ul .service-ul .service-li-three .page.page-2 .page-2-i { width: 25px; margin: 0 auto 20px; } .service-one .service-tab-ul .service-ul .service-li-three .page.page-2 .page-2-i i { font-size: 25px; color: #20c401; } .service-one .service-tab-ul .service-ul .service-li-three .page.page-2 .page-2-table { position: relative; } .service-one .service-tab-ul .service-ul .service-li-three .page.page-2 .page-2-table .page-2-si { width: 100%; height: 100%; border: 1px solid #fff; position: absolute; } .service-one .service-tab-ul .service-ul .service-li-three .page.page-2 .page-2-table .page-2-si img { position: absolute; } .service-one .service-tab-ul .service-ul .service-li-three .page.page-2 .page-2-table .page-2-si img:nth-child(1) { top: -1px; left: -1px; } .service-one .service-tab-ul .service-ul .service-li-three .page.page-2 .page-2-table .page-2-si img:nth-child(2) { top: -1px; right: -1px; } .service-one .service-tab-ul .service-ul .service-li-three .page.page-2 .page-2-table .page-2-si img:nth-child(3) { bottom: -1px; left: -1px; } .service-one .service-tab-ul .service-ul .service-li-three .page.page-2 .page-2-table .page-2-si img:nth-child(4) { bottom: -1px; right: -1px; } .service-one .service-tab-ul .service-ul .service-li-three .page.page-2 .page-2-table table { width: 100%; border: 1px solid #000; box-shadow: 0 20px 65px rgba(0, 0, 0, 0.1); } .service-one .service-tab-ul .service-ul .service-li-three .page.page-2 .page-2-table table tr th, .service-one .service-tab-ul .service-ul .service-li-three .page.page-2 .page-2-table table tr td { line-height: 94px; text-align: center; border: 1px solid #20c401; } .service-one .service-tab-ul .service-ul .service-li-three .page.page-2 .page-2-table table tr .table-ul { width: 592px; } .service-one .service-tab-ul .service-ul .service-li-three .page.page-2 .page-2-table table tr .table-ul ul li { width: 50%; text-align: left; float: left; text-indent: 50px; line-height: 24px; } .service-one .service-tab-ul .service-ul .service-li-three .page.page-3 .page3-box { margin-top: 56px; } .service-one .service-tab-ul .service-ul .service-li-three .page.page-3 .page3-box .page-3-left { width: 60%; float: left; } .service-one .service-tab-ul .service-ul .service-li-three .page.page-3 .page3-box .page-3-left p { line-height: 30px; color: #3f3f3f; } .service-one .service-tab-ul .service-ul .service-li-three .page.page-3 .page3-box .page-3-left ul li { line-height: 30px; color: #3f3f3f; } .service-one .service-tab-ul .service-ul .service-li-three .page.page-3 .page3-box .page-3-left ul li::before { content: ''; width: 6px; height: 6px; border-radius: 100%; background-color: #333; display: block; float: left; margin: 12px 10px 0 0; } .service-one .service-tab-ul .service-ul .service-li-three .page.page-3 .page3-box .page-3-right { width: 40%; float: right; } .service-one .service-tab-ul .service-ul .service-li-three .page.page-3 .page3-box:after { content: ''; width: 0; height: 0; clear: both; display: block; visibility: hidden; } .service-one .service-tab-ul .service-ul .service-li-three .page.page-4 ul { } .service-one .service-tab-ul .service-ul .service-li-three .page.page-4 ul li { line-height: 30px; color: #3f3f3f; } .service-one .service-tab-ul .service-ul .service-li-three .page.page-4 ul li::before { content: ''; width: 6px; height: 6px; border-radius: 100%; background-color: #333; display: block; float: left; margin: 12px 10px 0 0; } .service-one .service-tab-ul .service-ul .service-li-three .page.page-4 .pahe-4-p { color: #000; text-align: center; margin-top: 40px; } .service-one .service-tab-ul .service-ul .service-li-three .page.page-4 .page-4-i { width: 25px; margin: 0 auto 20px; } .service-one .service-tab-ul .service-ul .service-li-three .page.page-4 .page-4-i i { font-size: 25px; line-height: 1em; color: #20c401; } .service-one .service-tab-ul .service-ul .service-li-three .page.page-4 table { width: 100%; line-height: 50px; text-indent: 20px; color: #3f3f3f; box-shadow: 0 20px 65px rgba(0, 0, 0, 0.1); } .service-one .service-tab-ul .service-ul .service-li-three .page.page-4 table #page4Top { background-color: #20c401; color: #fff; font-weight: bold; } .service-one .service-tab-ul .service-ul .service-li-three .page.page-4 table tr:nth-child(odd) { background-color: #fff; } .service-one .service-tab-ul .service-ul .service-li-three .page.page-4 table tr:nth-child(even) { background-color: rgba(92, 219, 4, 0.1); } .service-one .service-tab-ul .service-ul .service-li-three .Trow.r1 { overflow: hidden; width: 80%; max-width: 1200px; margin: auto; padding-top: 50px; } .service-one .service-tab-ul .service-ul .service-li-three .Trow.r1 .left { float: left; width: 32%; } .service-one .service-tab-ul .service-ul .service-li-three .Trow.r1 .left > .aBtn { width: 280px; height: 70px; line-height: 70px; font-size: 22px; text-align: center; color: #707070; border: 1px solid #20c401; display: block; margin: 20px 0; } .service-one .service-tab-ul .service-ul .service-li-three .Trow.r1 .left > .aBtn.on, .service-one .service-tab-ul .service-ul .service-li-three .Trow.r1 .left > .aBtn:hover { color: #fff; background-color: #20c401; } .service-one .service-tab-ul .service-ul .service-li-three .Trow.r1 .right { float: right; width: 68%; } .service-one .service-tab-ul .service-ul .service-li-three .Trow.r1 .right .appItem { background: url("../image/download.png") left center no-repeat; background-size: contain; } .service-one .service-tab-ul .service-ul .service-li-three .Trow.r1 .right .appItem > li { font-size: 16px; color: #333; font-weight: bold; text-indent: 20px; height: 40px; line-height: 40px; margin: 50px 0; } .service-one .service-tab-ul .service-ul .service-li-three .Trow.r1 .right .appItem > li > span { float: right; height: 40px; } .service-one .service-tab-ul .service-ul .service-li-three .Trow.r1 .right .appItem > li > span > .aBtn { width: 150px; height: 40px; line-height: 40px; font-size: 13px; text-align: center; color: #707070; border: 1px solid #707070; display: inline-block; margin: 0px 18px; text-indent: 0px; } .service-one .service-tab-ul .service-ul .service-li-three .Trow.r1 .right .appItem > li > span > .aBtn > i { height: 100%; line-height: 100%; text-align: center; font-size: 18px; margin-right: 8px; } .service-one .service-tab-ul .service-ul .service-li-three .Trow.r1 .right .appItem > li > span > .aBtn.on, .service-one .service-tab-ul .service-ul .service-li-three .Trow.r1 .right .appItem > li > span > .aBtn:hover { color: #fff; border: none; background-color: #20c401; } .service-one .service-tab-ul .service-ul .service-li-three .Trow.r2 { overflow: hidden; margin: 32px 0; } .service-one .service-tab-ul .service-ul .service-li-three .Trow.r2 > ul { width: 100%; } .service-one .service-tab-ul .service-ul .service-li-three .Trow.r2 > ul > li { height: 90px; float: left; width: 25%; } .service-one .service-tab-ul .service-ul .service-li-three .Trow.r2 > ul > li > a { display: inline-block; height: 90px; line-height: 90px; color: #5e5e5e; text-align: center; background-color: #f7f7f7; width: 100%; } .service-one .service-tab-ul .service-ul .service-li-three .Trow.r2 > ul > li:nth-child(2n) > a { background-color: #f0f0f0; } .Trow.r2 { overflow: hidden; margin: 32px 0; } .Trow.r2 > ul { width: 100%; } .Trow.r2 > ul > li { height: 90px; float: left; width: 25%; } .Trow.r2 > ul > li > a { display: inline-block; height: 90px; line-height: 90px; color: #5e5e5e; font-size: 14px; text-align: center; background-color: #f7f7f7; width: 100%; } .Trow.r2 > ul > li:nth-child(2n) > a { background-color: #f0f0f0; } /* 表单 */ .msgRow { display: flex; justify-content: flex-start; align-items: flex-end; flex-wrap: wrap; margin: 32px auto; clear: both; overflow: hidden; min-height: 68px; } .msgRow .dot { font-size: 14px; color: #20c401; margin-left: 5px; } .msgRow span.Ttitle { color: #343434; display: block; margin-bottom: 8px; letter-spacing: 1px; clear: both; width: 100%; } .msgRow span.Ttitle > label { font-size: 12px; color: #a6a6a6; } .msgRow .Tinput.erro, .msgRow .inputChoose.erro { border: 1px solid #e60012 !important; } .msgRow .sub { font-size: 17px; font-weight: bold; color: #fff; padding: 6px 64px; border: none; border-radius: 5px; background-color: #8c8c8c; transition: all 0.2s ease-in-out; margin-right: 12px; } .msgRow .sub:hover { background-color: #20c401; } .msgRow .sub.ok { background-color: #20c401; color: #fff; } .msgRow .sub.ok + small { display: none; } .msgRow .sub + small { font-size: 12px; color: #e60012; opacity: 0; pointer-events: none; transform: translateX(30px); transition: all 0.3s ease-in-out; } .msgRow .sub + small.ok { opacity: 1; transform: translateX(0px); pointer-events: auto; } .msgRow .col { float: left; display: inline-block; width: 30%; margin-right: 3%; } .msgRow .col.input_con > small { font-size: 12px; display: block; color: #a6a6a6; margin-bottom: 5px; } .msgRow .col.input_con > input, .msgRow .shengshi > select, .msgRow .shengshi > option { background-color: #f2f3f5; height: 32px; width: 100%; border: none; font-size: 14px; box-sizing: border-box; padding: 0 5px; border-radius: 5px; color: #777777; } .msgRow .col.input_con > textarea { width: 100%; background-color: #f2f3f5; border-radius: 5px; border: none; height: 120px; padding: 10px; font-size: 14px; color: #777; } .msgRow .col.radio_con { margin-right: 0; width: 33%; height: 32px; line-height: 32px; } .msgRow .col.radio_con > span { display: inline-block; color: #000; font-weight: 100; margin-right: 8px; letter-spacing: 1px; } .msgRow .col.select_con > select { background-color: #f2f3f5; height: 32px; color: #777777; line-height: 32px; font-size: 14px; width: 100%; border: none; border-radius: 5px; } .msgRow .col.choose_con { display: none; } /* 上传图片 */ .img-box { margin-top: 40px; } .img-box .up-p { margin-bottom: 20px; font-size: 16px; color: #555; } .z_photo { padding: 18px; border: 2px dashed #E7E6E6; /*padding: 18px;*/ } .z_photo .z_file { position: relative; } .z_file .file { width: 100%; height: 100%; opacity: 0; position: absolute; top: 0px; left: 0px; z-index: 100; } .z_photo .up-section { position: relative; margin-right: 20px; margin-bottom: 20px; } .up-section .close-upimg { position: absolute; top: 6px; right: 8px; display: none; z-index: 10; } .up-section .up-span { display: block; width: 100%; height: 100%; visibility: hidden; position: absolute; top: 0px; left: 0px; z-index: 9; background: rgba(0, 0, 0, 0.5); } .up-section:hover { border: 2px solid #f15134; } .up-section:hover .close-upimg { display: block; } .up-section:hover .up-span { visibility: visible; } .z_photo .up-img { display: block; width: 100%; height: 100%; } .loading { border: 1px solid #D1D1D1; background: url(http://ogawa.com.cn/static/img/loading.gif) no-repeat center; } .up-opcity { opacity: 0; } .img-name-p { display: none; } .upimg-div .up-section { width: 190px; height: 180px; } .img-box .upimg-div .z_file { width: 190px; height: 180px; } .z_file .add-img { display: block; width: 190px; height: 180px; } /*遮罩层样式*/ .mask { z-index: 1000; display: none; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.4); } .mask .mask-content { width: 500px; position: absolute; top: 50%; left: 50%; margin-left: -250px; margin-top: -80px; background: white; height: 160px; text-align: center; } .mask .mask-content .del-p { color: #555; height: 94px; line-height: 94px; font-size: 18px; border-bottom: 1px solid #D1D1D1; } .mask-content .check-p { height: 66px; line-height: 66px; position: absolute; bottom: 0; left: 0; width: 100%; } .mask-content .check-p span { width: 49%; display: inline-block; text-align: center; color: #d4361d; font-size: 18px; } .check-p .del-com { border-right: 1px solid #D1D1D1; } @media screen and (max-width: 1400px) { .service-one .service-tab-ul .service-ul .service-li-two .two-ul .two-li { margin: 20px 0 0 0; } .product .page table tr td:first-child { width: 460px; font-weight: unset; } .product .page table tr td { line-height: 35px; } .product.product-fujimedic .page-2.page-shi .dengyutu { height: 300px; } .product.product-fuji .page-fuwen div { margin: 0 auto 50px; } .product.product-fuji .page-4 .page-img { background-size: 80%; } .product.product-fuji .page-5 .page-img { background-size: 70%; } .product.product-yi .page-2 .txt.t3 { padding-top: 280px; } .product.product-yi .page-7cai { padding-top: 0; } .intro .Tpage .Tmid .goodsCon .Ttxt { padding-top: 360px; } /* 3.product */ .product #CPTS { display: none; position: fixed; z-index: 999; } .product #CPTS i { display: block; line-height: 1em; color: #20c401; } .product.product-index .product-i-box { padding-top: 0; /* 弹窗 */ } .product.product-index .product-i-box .chanpin-box { margin-top: 30px; } .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin.cur .left { padding-top: 60px; } .product.product-index .product-i-box .chanpin-tan .chanpin-tan-box .tan-chanpin.cur .right { padding: 40px; } .product.product-fujimedic .page-2 .picMove .circle { top: 40px; } .product.product-bri .page-3 .page-3-yuan { width: 100%; height: 100%; position: relative; } .product.product-bri .page-3 .page-3-yuan svg { width: 457px; height: 457px; position: absolute; top: 0; right: 0; bottom: 0; left: 0; margin: auto; } .product.product-bri .page-3 .page-3-yuan .page-title { font-size: 32px; } .product.product-bri .page-3 .page-3-yuan .page-dian { width: 457px; height: 457px; } .product.product-bri .page-6 .page-text p { margin-bottom: 50px; } .product.product-bri .page-6 .page-text .gobuy { margin-top: 40px; } .product.product-cozzia .page-text { top: 70px; } .product.product-cozzia .page-1 .page-img { width: 50%; } .product.product-cozzia .page-1 .page-img img { left: 80px; } .product.product-cozzia .page-2 .page-img img { width: 70%; } .product.product-cozzia .page-7 .page-img { width: 520px; height: 475px; } .product.product-cozzia .page-7 .page-img img { width: 520px; } .product.product-cozzia .page-9 .page-slides { width: 50%; } .product.product-cozzia .page-9 .page-text p { margin-bottom: 50px; } .product.product-cozzia .page-9 .page-text .gobuy { margin-top: 40px; display: none; } .product.product-fuji .page-1 .page-text { margin: 10% 0 0 59%; } .product.product-fuji .page-7 .page-text p { margin-bottom: 50px; } .product.product-fuji .page-7 .page-text .gobuy { margin-top: 40px; } .product.product-medisana .page-1 .width-1200 .page-1-left { width: 43%; left: -100px; } .product.product-medisana .page-1 .width-1200 .page-1-right { width: 35%; } .product.product-medisana .page-2 .page-text { margin-top: 60px; } .product.product-medisana .page-2 .slider .slider-img ul li img { height: 80%; } .product.product-medisana .page-3 .page-text { margin-top: 60px; } .product.product-medisana .page-3 .page-3-box .page-3-left, .product.product-medisana .page-3 .page-3-box .page-3-right { bottom: 20px; } .product.product-medisana .page-3 .page-3-box .page-3-left .list, .product.product-medisana .page-3 .page-3-box .page-3-right .list { margin-bottom: 20px; } .product.product-medisana .page-4 .page-text p { margin-bottom: 50px; } .product.product-medisana .page-4 .page-text .gobuy { margin-top: 40px; display: none; } .product.product-cozzia .page-7 .page-img ul li:nth-child(1) { top: 50px; left: 320px; } .product.product-cozzia .page-7 .page-img ul li:nth-child(2) { top: 77px; left: 148px; } .product.product-cozzia .page-7 .page-img ul li:nth-child(3) { top: 94px; left: 240px; } .product.product-cozzia .page-7 .page-img ul li:nth-child(4) { top: 114px; left: 170px; } .product.product-cozzia .page-7 .page-img ul li:nth-child(5) { top: 154px; left: 244px; } .product.product-cozzia .page-7 .page-img ul li:nth-child(6) { top: 342px; left: 325px; } /* cooperation-agent */ .cooperation-agent .banner { height: 500px; padding-top: 130px; } /* research */ .research .banner { height: 60vh; } .video-box .video-video { width: 800px; height: 450px; } } .new { overflow-x: hidden; } .new .banner { height: 37vw; } .new .banner .component .Tmsg { position: absolute; top: 0; bottom: 0; left: 0; right: 0; margin: auto; height: 230px; z-index: 1000; } .new .banner .component .Tmsg > small { width: 130px; display: inline-block; height: 58px; line-height: 1; font-size: unset; margin-bottom: 20px; font-family: Futura; position: relative; } .new .banner .component .Tmsg > small .Tpage { color: #20c401; font-size: 70px; } .new .banner .component .Tmsg > small > span { display: none; color: rgba(255, 255, 255, 0.5); font-size: 16px; vertical-align: super; position: absolute; top: 10px; right: 0; } .new .banner .component .Tmsg > ul > li { color: #fff; font-weight: bold; line-height: 34px; margin-bottom: 10px; max-width: 520px; width: 60%; cursor: pointer; } .new .banner .component .Tmsg nav { position: relative; width: 60px; height: 50px; } .new .banner .component .Tmsg nav > a { width: 18px; cursor: pointer; opacity: 0.5; transition: all 0.2s ease-in-out; } .new .banner .component .Tmsg nav > a:hover { opacity: 1; } .new .banner .component .Tmsg > ol { position: absolute; height: 27px; right: 0; top: 0; bottom: 0; margin: auto; } .new .banner .component .Tmsg > ol > li { float: left; cursor: pointer; display: inline-block; background: transparent; box-shadow: none; text-indent: 0; margin: 0 12px; text-shadow: 0 2px 1px rgba(0, 0, 0, 0.35); color: rgba(255, 255, 255, 0.5); font-weight: bold; transition: all .3s; } .new .banner .component .Tmsg > ol > li.on { color: #fff; } /*.new .Tpage {*/ /*width: 80%;*/ /*max-width: 1200px;*/ /*margin: auto;*/ /*}*/ .new .Tpage .Ttop { margin-top: 60px; } .new .Tpage .Ttop .type { overflow: hidden; } .new .Tpage .Ttop .type > li { display: inline-block; float: left; color: rgba(37, 37, 37, 0.2); font-size: 24px; font-weight: bold; height: 72px; line-height: 88px; margin-right: 30px; position: relative; transform-origin: 50% 50%; transition: all .3s; } .new .Tpage .Ttop .type > li:after { content: ''; position: absolute; bottom: 0; width: 0; height: 2px; background-color: #20c401; left: 0; right: 0; margin: auto; transition: all .3s; } .new .Tpage .Ttop .type > li:hover:after { height: 2px; width: 100%; } .new .Tpage .Ttop .type > li.on { color: #252525; font-size: 30px; line-height: 72px; } .new .Tpage .Ttop .type > li.on:after { height: 2px; width: 100%; } .new .Tpage .Tmid .part { padding: 50px 0; } .new .Tpage .Tmid .part > li { position: relative; padding: 32px 0; transition: all 0.3s ease-in-out; cursor: pointer; } .new .Tpage .Tmid .part > li:hover { transform: translateX(50px); } .new .Tpage .Tmid .part > li:hover:after { height: 100%; } .new .Tpage .Tmid .part > li:hover .Tdate > i { transition-delay: 0.2s; background-color: #20c401; color: #fff; } .new .Tpage .Tmid .part > li:after { content: ''; position: absolute; width: 3000px; height: 0%; bottom: 0; margin: auto; left: -1000px; background-color: #f7f8fa; top: 0; transform-origin: 50% 50%; z-index: -1; transition: all 0.5s ease-in-out; } #search .Tpage .Tmid .part > li > img { width: auto; } #search .Tpage .Tmid .part > li .Tmsg p { height: 20px; } .new .Tpage .Tmid .part > li > img { position: absolute; top: 0; bottom: 0; margin: auto; left: 0; border-radius: 5px; width: 200px; } .new .Tpage .Tmid .part > li .Tmsg { padding: 20px 0; padding-left: 240px; width: 76%; } .new .Tpage .Tmid .part > li .Tmsg h5 { font-size: 16px; color: #404040; font-weight: bold; margin-bottom: 20px; } .new .Tpage .Tmid .part > li .Tmsg p { font-size: 12px; color: #a6a6a6; /*height: 40px;*/ overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; } .new .Tpage .Tmid .part > li .Tdate { position: absolute; right: 0; top: 40px; padding-right: 50px; } .new .Tpage .Tmid .part > li .Tdate > span { display: inline-block; font-size: 14px; color: rgba(38, 38, 38, 0.3); text-align: right; position: relative; padding-right: 24px; } .new .Tpage .Tmid .part > li .Tdate > span:after { content: ''; position: absolute; right: 0; height: 60%; top: 0; bottom: 0; margin: auto; width: 1px; background-color: #eee; } .new .Tpage .Tmid .part > li .Tdate > span > b { font-size: 24px; display: block; color: #262626; height: 30px; } .new .Tpage .Tmid .part > li .Tdate > img { width: 10px; margin: -30px 0 0 10px; } .new .Tpage .Tmid .part > li .Tdate > i { display: inline-block; position: absolute; right: 0; top: 5px; border-radius: 50%; width: 36px; height: 36px; line-height: 36px; text-align: center; color: #262626; background-color: transparent; cursor: pointer; transition: all 0.2s ease-in-out; } .new .Tpage .Tbtm { text-align: center; } .new .Tpage .Tbtm .Tmore { text-align: center; color: #333; border: 1px solid #e1e1e1; border-radius: 50px; padding: 5px 30px; letter-spacing: 2px; font-size: 14px; font-weight: bold; display: inline-block; cursor: pointer; position: relative; overflow: hidden; } .new .Tpage .Tbtm .Tmore:after { content: ''; position: absolute; top: 0; bottom: 0; left: 0; right: 0; margin: auto; width: 1px; height: 1px; border-radius: 50%; background-color: #20c401; z-index: -1; pointer-events: none; opacity: 0; transition: all 0.4s cubic-bezier(0, 0.78, 0.7, 0.67); } .new .Tpage .Tbtm .Tmore:hover { color: #fff; } .new .Tpage .Tbtm .Tmore:hover:after { opacity: 1; width: 200px; height: 200px; } .new_detail .banner { position: relative; } .new_detail .banner .picBox { height: 400px; background-color: #000; background-size: cover; background-position: center center; } .new_detail .banner .picBox > img { opacity: 0.5; } .new_detail .banner .Tmsg { position: absolute; top: 0; bottom: 0; left: 0; right: 0; margin: auto; } .new_detail .banner .Tmsg > span { color: #fff; font-size: 24px; font-weight: bold; /*display: inline-block;*/ width: 540px; position: absolute; height: 96px; top: 0; bottom: 0; margin: auto; line-height: 48px; display: none; } .new_detail .banner .Tmsg .Tdate { position: absolute; right: 0; bottom: 40px; padding-right: 50px; } .new_detail .banner .Tmsg .Tdate > span { display: inline-block; font-size: 24px; color: #fff; text-align: right; position: relative; } .new_detail .banner .Tmsg .Tdate > span > b { font-size: 42px; display: block; color: #fff; font-weight: bold; height: 50px; } .new_detail .Tpage .Tmid { position: relative; margin: 70px auto 0; padding-right: 18%; box-sizing: border-box; } .new_detail .Tpage .Tmid > h4 { font-size: 20px; font-weight: bold; color: #404040; margin-bottom: 30px; text-align: left; } .new_detail .Tpage .Tmid .Tmsg { max-width: 800px; color: #8c8c8c; font-size: 14px; line-height: 180%; } .new_detail .Tpage .Tmid .Tmsg img { /* max-width: 90%; */ margin: 6px auto; margin-top: 26px; display: block; } .new_detail .Tpage .Tmid .return { display: inline-block; position: absolute; top: 0; right: 0; text-align: right; height: 48px; color: #262626; font-size: 13px; font-weight: bold; letter-spacing: 4px; } .new_detail .Tpage .Tmid .return > i { width: 48px; display: inline-block; height: 48px; line-height: 48px; border-radius: 50%; color: #fff; cursor: pointer; background-color: #262626; text-align: center; font-size: 18px; margin-right: 10px; box-shadow: 0 6px 29px -5px rgba(44, 52, 49, 0.69); } .tech_detail .banner { position: relative; } .join-school .banner:before, .join-social .banner:before, .new_detail .banner:before { content: ''; width: 100%; height: 100%; background-color: rgba(0, 0, 0, .3); position: absolute; top: 0; left: 0; } .tech_detail .banner .picBox { height: 60vh; background-color: #000; background-size: cover; background-position: center center; background-repeat: no-repeat; } .tech_detail .banner .picBox > img { opacity: 0.5; } .tech_detail .banner .Tmsg { position: absolute; width: 80%; top: 0; bottom: 0; left: 0; right: 0; max-width: 1200px; margin: auto; text-align: center; height: 72px; } .tech_detail .banner .Tmsg > small { display: block; color: #fff; font-size: 18px; text-shadow: 0 10px 20px rgba(0, 0, 0, .5); } .tech_detail .banner .Tmsg > span { font-size: 30px; font-weight: bold; color: #fff; display: block; letter-spacing: 4px; text-shadow: 0 10px 20px rgba(0, 0, 0, .5); } .tech_detail .Tpage .Tmid { position: relative; margin: 70px auto 0; box-sizing: border-box; } .tech_detail .Tpage .Tmid .title { color: #000; position: relative; text-align: center; padding-bottom: 10px; font-weight: bold; letter-spacing: 2px; margin: auto; } .tech_detail .Tpage .Tmid .title:after { content: ""; position: absolute; bottom: 0; height: 3px; width: 50px; left: 0; right: 0; margin: auto; background-color: #20c401; } .tech_detail .Tpage .Tmid .numChat { display: flex; justify-content: center; align-items: center; margin: auto; margin-bottom: 50px; border-right: 1px solid #eee; } .tech_detail .Tpage .Tmid .numChat > li { display: inline-block; float: left; width: calc(100% / 3); overflow: hidden; position: relative; } .tech_detail .Tpage .Tmid .numChat > li:after { content: ""; position: absolute; height: 100%; width: 1px; left: 0; top: 0; background: #eee; } .tech_detail .Tpage .Tmid .numChat > li .Tnum { float: left; width: 50%; padding-right: 20px; box-sizing: border-box; text-align: right; color: #20c401; font-size: 54px; letter-spacing: 3px; height: 52px; line-height: 52px; } .tech_detail .Tpage .Tmid .numChat > li .Ttxt { font-size: 18px; color: #333333; font-weight: bold; } .tech_detail .Tpage .Tmid .numChat > li .Ttxt > a { display: block; font-size: 13px; color: #333333; font-weight: bold; } .tech_detail .Tpage .Tmid .numChat > li .Ttxt > a > b { color: #8c8c8c; font-size: 13px; font-weight: 500; } .tech_detail .Tpage .Tmid > small { color: #8c8c8c; display: block; text-align: left; margin: 50px auto; } .tech_detail .Tpage .Tmid > p { color: #8c8c8c; line-height: 180%; margin: auto; text-align: left; } .tech_detail .Tpage .Tmid .Tmsg { margin: 50px auto 0; } .tech_detail .Tpage .Tmid .Tmsg h4 { text-align: center; margin-bottom: 30px; } .tech_detail .Tpage .Tmid .Tmsg > p { font-size: 14px; text-align: center; color: #8c8c8c; line-height: 180%; max-width: 1200px; width: 80%; margin: auto; display: none; } .tech_detail .Tpage .Tmid .Tmsg .picItem { display: flex; justify-content: center; align-items: flex-start; margin: 40px auto 0; } .tech_detail .Tpage .Tmid .Tmsg .picItem > li { display: inline-block; float: left; width: 25%; } .tech_detail .Tpage .Tmid .Tmsg .picItem > li .picBox { height: 320px; overflow: hidden; filter: grayscale(100%); transition: all 0.3s ease-in-out; } .tech_detail .Tpage .Tmid .Tmsg .picItem > li .Tcon { padding: 32px 20px 20px 20px; transition: all 0.3s ease-in-out; } .tech_detail .Tpage .Tmid .Tmsg .picItem > li .Tcon > span { position: relative; display: block; font-size: 16px; color: #999999; background: #fff; margin: 32px 20px; margin-top: 0; height: 34px; line-height: 34px; text-align: center; transition-delay: 0.2s; transition: all 0.2s ease-in-out; } .tech_detail .Tpage .Tmid .Tmsg .picItem > li .Tcon > span:after { content: attr(data-num); position: absolute; color: #20c401; font-size: 80px; letter-spacing: 2px; left: -20px; top: 0px; z-index: -1; opacity: 0; pointer-events: none; transform: scale(0.3); transition-delay: 0.1s; transition: all 0.3s ease-in-out; } .tech_detail .Tpage .Tmid .Tmsg .picItem > li .Tcon > span > a { position: absolute; display: inline-block; font-size: 32px; color: #20c401; right: -20px; top: 0; height: 100%; line-height: 100%; opacity: 0; pointer-events: none; transform: translateX(-30px); transition-delay: 0.4s; transition: all 0.3s ease-in-out; cursor: pointer; } .tech_detail .Tpage .Tmid .Tmsg .picItem > li .Tcon > p { font-size: 13px; color: #8c8c8c; line-height: 180%; max-height: 46px; overflow: hidden; word-break: break-all; opacity: 0; pointer-events: none; transition-delay: 0.2s; transition: all 0.2s ease-in-out; } .tech_detail .Tpage .Tmid .Tmsg .picItem > li:hover .picBox { filter: grayscale(0%); } .tech_detail .Tpage .Tmid .Tmsg .picItem > li:hover .Tcon { box-shadow: 0 3px 50px rgba(190, 190, 190, 0.42); } .tech_detail .Tpage .Tmid .Tmsg .picItem > li:hover .Tcon > span { font-size: 20px; color: #333; text-align: left; } .tech_detail .Tpage .Tmid .Tmsg .picItem > li:hover .Tcon > span:after { opacity: 1; transform: scale(1); pointer-events: auto; } .tech_detail .Tpage .Tmid .Tmsg .picItem > li:hover .Tcon > span > a { opacity: 1; transform: translateX(0px); pointer-events: auto; } .tech_detail .Tpage .Tmid .Tmsg .picItem > li:hover .Tcon > p { opacity: 1; pointer-events: auto; } .contact .banner { position: relative; } .contact .banner .picBox { height: 60vh; background-color: #000; background-size: cover; background-position: center center; } .contact .banner .picBox > img { opacity: 1; } .contact .Tpage .Tmid { margin: 70px auto; overflow: visible; clear: both; } .contact .Tpage .Tmid .left { float: left; width: 32%; } .contact .Tpage .Tmid .left .msgList { margin-bottom: 70px; } .contact .Tpage .Tmid .left .msgList h3 { color: #dedfe0; font-weight: bold; text-align: left; margin-bottom: 30px; } .contact .Tpage .Tmid .left .msgList p { line-height: 200%; padding-bottom: 12px; border-bottom: 1px solid #eee; } .contact .Tpage .Tmid .left .msgList p > span { font-weight: bold; color: #404040; } .contact .Tpage .Tmid .left .msgList p > small { display: block; color: #8b8c8c; } .contact .Tpage .Tmid .right { float: right; width: 64%; } .contact .Tpage .Tmid .right .dot { font-size: 14px; color: #20c401; margin-left: 5px; } .contact .Tpage .Tmid .right .title { margin-bottom: 40px; } .contact .Tpage .Tmid .right .title > h5 { color: #979999; margin-bottom: 20px; font-weight: 100; } .contact .Tpage .Tmid .right .title > h5 > b { color: #333; } .contact .Tpage .Tmid .right .title > small { display: inline-block; color: #595959; line-height: 200%; margin-bottom: 32px; } .contact .Tpage .Tmid .right .title > div { font-size: 14px; color: #262626; line-height: 200%; } .contact .Tpage .Tmid .right .title > div > span { font-size: 12px; color: #a6a6a6; display: block; } .contact .Tpage .Tmid .right .Tcon .msgRow { display: flex; justify-content: flex-start; align-items: flex-end; flex-wrap: wrap; margin: 32px auto; clear: both; overflow: hidden; min-height: 28px; } .contact .Tpage .Tmid .right .Tcon .msgRow span.Ttitle { font-size: 16px; color: #343434; display: block; margin-bottom: 8px; letter-spacing: 1px; clear: both; width: 100%; } .contact .Tpage .Tmid .right .Tcon .msgRow span.Ttitle > label { font-size: 12px; color: #a6a6a6; font-weight: 100; } .contact .Tpage .Tmid .right .Tcon .msgRow .Tinput.erro, .contact .Tpage .Tmid .right .Tcon .msgRow .inputChoose.erro { border: 1px solid #e60012 !important; } .contact .Tpage .Tmid .right .Tcon .msgRow .sub { font-size: 17px; font-weight: bold; color: #fff; padding: 6px 64px; border: none; border-radius: 5px; background-color: #8c8c8c; transition: all 0.2s ease-in-out; margin-right: 12px; } .contact .Tpage .Tmid .right .Tcon .msgRow .sub:hover { background-color: #20c401; } .contact .Tpage .Tmid .right .Tcon .msgRow .sub.ok { background-color: #20c401; color: #fff; } .contact .Tpage .Tmid .right .Tcon .msgRow .sub.ok + small { display: none; } .contact .Tpage .Tmid .right .Tcon .msgRow .sub + small { font-size: 12px; color: #e60012; opacity: 0; pointer-events: none; transform: translateX(30px); transition: all 0.3s ease-in-out; } .contact .Tpage .Tmid .right .Tcon .msgRow .sub + small.ok { opacity: 1; transform: translateX(0px); pointer-events: auto; } .contact .Tpage .Tmid .right .Tcon .msgRow .col { float: left; display: inline-block; width: 30%; margin-right: 3%; } .contact .Tpage .Tmid .right .Tcon .msgRow .col.input_con > small { font-size: 12px; display: block; color: #a6a6a6; margin-bottom: 5px; } .contact .Tpage .Tmid .right .Tcon .msgRow .col.input_con > input { background-color: #f2f3f5; height: 32px; width: 100%; border: none; font-size: 14px; box-sizing: border-box; padding: 0 5px; border-radius: 5px; color: #777777; } .contact .Tpage .Tmid .right .Tcon .msgRow .col.input_con > textarea { width: 100%; background-color: #f2f3f5; border-radius: 5px; border: none; height: 120px; padding: 10px; font-size: 14px; color: #777; } .contact .Tpage .Tmid .right .Tcon .msgRow .col.radio_con { margin-right: 0; width: 33%; height: 32px; line-height: 32px; } .contact .Tpage .Tmid .right .Tcon .msgRow .col.radio_con > span { display: inline-block; color: #000; font-weight: 100; margin-right: 8px; letter-spacing: 1px; } .contact .Tpage .Tmid .right .Tcon .msgRow .col.select_con > select { background-color: #f2f3f5; height: 32px; color: #777777; line-height: 32px; font-size: 14px; width: 100%; border: none; border-radius: 5px; } .contact .Tpage .Tmid .right .Tcon .msgRow .col.choose_con { display: none; } .buy .banner { position: relative; } .buy .banner .picBox { background-color: #000; } .buy .banner .picBox > img { opacity: 1; } .buy .Tpage .Tmid { margin: 70px auto; overflow: visible; clear: both; } .buy .Tpage .Tmid .right { float: right; width: 100%; } .buy .Tpage .Tmid .right .dot { font-size: 14px; color: #20c401; margin-left: 5px; } .buy .Tpage .Tmid .right .title { margin-bottom: 40px; } .buy .Tpage .Tmid .right .title > h5 { color: #979999; margin-bottom: 20px; font-weight: 100; } .buy .Tpage .Tmid .right .title > h5 > b { font-size: 24px; color: #333; } .buy .Tpage .Tmid .right .title > small { font-size: 14px; display: inline-block; color: #595959; line-height: 200%; margin-bottom: 32px; } .buy .Tpage .Tmid .right .title > div { font-size: 14px; color: #262626; line-height: 200%; } .buy .Tpage .Tmid .right .title > div > span { font-size: 12px; color: #a6a6a6; display: block; } .buy .Tpage .Tmid .right .Tcon .msgRow { display: flex; justify-content: flex-start; align-items: flex-end; flex-wrap: wrap; margin: 32px auto; clear: both; overflow: hidden; min-height: 68px; } .buy .Tpage .Tmid .right .Tcon .msgRow span.Ttitle { font-size: 16px; color: #343434; display: block; margin-bottom: 8px; letter-spacing: 1px; clear: both; width: 100%; } .buy .Tpage .Tmid .right .Tcon .msgRow span.Ttitle > label { font-size: 12px; color: #a6a6a6; font-weight: 400; } .buy .Tpage .Tmid .right .Tcon .msgRow .Tinput.erro, .buy .Tpage .Tmid .right .Tcon .msgRow .inputChoose.erro { border: 1px solid #e60012 !important; } .buy .Tpage .Tmid .right .Tcon .msgRow .sub { font-size: 17px; font-weight: bold; color: #fff; padding: 6px 64px; border: none; border-radius: 5px; background-color: #8c8c8c; transition: all 0.2s ease-in-out; margin-right: 12px; } .buy .Tpage .Tmid .right .Tcon .msgRow .sub:hover { text-shadow: 0 5px 10px rgba(0, 0, 0, 0.6); } .buy .Tpage .Tmid .right .Tcon .msgRow .sub.ok { background-color: #20c401; color: #fff; } .buy .Tpage .Tmid .right .Tcon .msgRow .sub.ok + small { display: none; } .buy .Tpage .Tmid .right .Tcon .msgRow .sub + small { font-size: 12px; color: #e60012; opacity: 0; pointer-events: none; transform: translateX(30px); transition: all 0.3s ease-in-out; } .buy .Tpage .Tmid .right .Tcon .msgRow .sub + small.ok { opacity: 1; transform: translateX(0px); pointer-events: auto; } .buy .Tpage .Tmid .right .Tcon .msgRow .col { float: left; display: inline-block; width: calc(100% / 6); margin-right: 3%; } .buy .Tpage .Tmid .right .Tcon .msgRow .col.col31 { width: calc(100% / 3); } .buy .Tpage .Tmid .right .Tcon .msgRow .col.input_con > small { font-size: 12px; display: block; color: #a6a6a6; margin-bottom: 5px; } .buy .Tpage .Tmid .right .Tcon .msgRow .col.input_con > input { background-color: #f2f3f5; height: 32px; width: 100%; border: none; font-size: 14px; box-sizing: border-box; padding: 0 5px; border-radius: 5px; color: #777777; } .buy .Tpage .Tmid .right .Tcon .msgRow .col.input_con > textarea { width: 100%; background-color: #f2f3f5; border-radius: 5px; border: none; height: 120px; padding: 10px; font-size: 14px; color: #777; } .buy .Tpage .Tmid .right .Tcon .msgRow .col.radio_con { margin-right: 0; width: 33%; height: 32px; line-height: 32px; } .buy .Tpage .Tmid .right .Tcon .msgRow .col.radio_con > span { display: inline-block; color: #000; font-weight: 100; margin-right: 8px; letter-spacing: 1px; } .buy .Tpage .Tmid .right .Tcon .msgRow .col.select_con > select { background-color: #f2f3f5; height: 32px; color: #777777; line-height: 32px; font-size: 14px; width: 100%; border: none; border-radius: 5px; } .buy .Tpage .Tmid .right .Tcon .msgRow .col.choose_con { display: none; } .intro .banner { position: relative; } .intro .banner .picBox { height: 270px; background-color: #000; background-size: cover; background-position: center center; } .intro .banner .picBox > img { opacity: 0.5; } .intro .banner .Tmsg { position: absolute; top: 0; bottom: 0; left: 0; right: 0; margin: auto; } .intro .banner .Tmsg > span { color: #fff; font-size: 20px; font-weight: 100; display: inline-block; width: 100%; text-align: center; position: absolute; height: 120px; top: -160px; bottom: 0; margin: auto; line-height: 120px; letter-spacing: 3px; text-transform: uppercase; } .intro .banner .Tmsg > span:after { content: ""; position: absolute; height: 3px; width: 100px; bottom: 0; left: 0; right: 0; margin: auto; background-color: #20c401; opacity: 0; } .intro .banner .Tmsg > span > small { font-size: 42px; display: block; text-align: center; letter-spacing: 5px; } .intro .Tpage .Tmid b.gDot { color: #20c401; vertical-align: sub; } .intro .Tpage .Tmid .Trow { margin: auto; padding-top: 120px; } .intro #introPdT { padding-top: 0; } .intro .Tpage .Tmid .Trow.r1 .title { padding-bottom: 32px; border-bottom: 1px solid #eee; } .intro .Tpage .Tmid .Trow.r1 .title h5 { color: #979999; font-size: 24px; font-weight: 100; margin-bottom: 20px; } .intro .Tpage .Tmid .Trow.r1 .title h5 > b { color: #333; font-size: 24px; margin-right: 3px; } .intro .Tpage .Tmid .Trow.r1 .title small { font-size: 18px; color: #404040; } .intro .Tpage .Tmid .Trow.r1 .Tcon { position: relative; padding: 40px 0; } .intro .Tpage .Tmid .Trow.r1 .Tcon .Titem { overflow: hidden; width: 240px; } .intro .Tpage .Tmid .Trow.r1 .Tcon .Titem > li { width: 100%; margin: 30px 0; } .intro .Tpage .Tmid .Trow.r1 .Tcon .Titem > li h5 { font-size: 16px; color: #333; } .intro .Tpage .Tmid .Trow.r1 .Tcon .Titem > li h5 > b { font-size: 32px; margin-right: 4px; margin-left: 6px; } .intro .Tpage .Tmid .Trow.r1 .Tcon .Titem > li small { font-size: 14px; color: #8b8c8c; } .intro .Tpage .Tmid .Trow.r1 .Tcon > img { position: absolute; right: 0; top: 0; bottom: 0; margin: auto; max-width: calc(100% - 240px); } .intro .Tpage .Tmid .Trow.r2 { overflow: hidden; padding-top: 80px; padding-bottom: 80px; margin-bottom: 32px; } .intro .Tpage .Tmid .Trow.r2 .Tcon::after { content: ''; width: 0; height: 0; display: block; clear: both; visibility: hidden; } .intro .Tpage .Tmid .Trow.r2 .left { font-size: 14px; color: #999999; float: left; width: 47%; line-height: 180%; } .intro .Tpage .Tmid .Trow.r2 .left > ul > li { color: #8c8c8c; font-size: 14px; padding-left: 13px; position: relative; margin-bottom: 6px; } .intro .Tpage .Tmid .Trow.r2 .left > ul > li:after { content: ''; position: absolute; width: 4px; height: 4px; border-radius: 50%; background-color: #20c401; left: 0; top: 0; bottom: 0; margin: auto; } .intro .Tpage .Tmid .Trow.r2 .right { float: right; width: 47%; color: #b3b3b3; font-size: 12px; line-height: 180%; } .intro .Tpage .Tmid .Trow.r2 .right > ul > li { color: #8c8c8c; font-size: 14px; padding-left: 13px; position: relative; margin-bottom: 6px; } .intro .Tpage .Tmid .Trow.r2 .right > ul > li:after { content: ''; position: absolute; width: 4px; height: 4px; border-radius: 50%; background-color: #20c401; left: 0; top: 0; bottom: 0; margin: auto; } .intro .Tpage .Tmid .Trow.r2 .more-btn { text-align: right; font-size: 14px; color: #20c401; display: block; } .intro .Tpage .Tmid > .picBox { height: 265px; width: 100%; position: relative; background-attachment: fixed !important; } .intro .Tpage .Tmid > .picBox > span { position: absolute; z-index: 2; display: inline-block; color: #fff; font-size: 17px; font-weight: bold; text-align: right; width: 80%; max-width: 1200px; margin: auto; bottom: -48px; left: 0; right: 0; } .intro .Tpage .Tmid > .picBox > span > b { color: #fff; font-size: 100px; } .intro .Tpage .Tmid > .picBox:after { content: ''; position: absolute; width: 100%; height: 100%; top: 0; left: 0; background-color: rgba(0, 0, 0, 0.5); } .intro .Tpage .Tmid .goodsCon .Ttxt { padding-top: 455px; } .intro .Tpage .Tmid .goodsCon .Ttxt #component { height: 530px; background-color: transparent; } .intro .Tpage .Tmid .goodsCon .Ttxt #component .itemwrap { overflow: visible; } .intro .Tpage .Tmid .goodsCon .Ttxt #component .itemwrap > li { background-color: #fff; } .intro .Tpage .Tmid .goodsCon .Ttxt #component > .Tmsg { position: absolute; opacity: 1; width: 100%; bottom: calc(100% + 80px); z-index: 100; } .intro .Tpage .Tmid .goodsCon .Ttxt #component > .Tmsg > small { opacity: 0; pointer-events: none; } .intro .Tpage .Tmid .goodsCon .Ttxt #component > .Tmsg .pageChange { overflow: hidden; position: relative; } .intro .Tpage .Tmid .goodsCon .Ttxt #component > .Tmsg .pageChange > li { position: relative; width: calc(100% / 9); float: left; cursor: pointer; } .intro .Tpage .Tmid .goodsCon .Ttxt #component > .Tmsg .pageChange > li.on:after { opacity: 0; } .intro .Tpage .Tmid .goodsCon .Ttxt #component > .Tmsg .pageChange > li.on > .back { -webkit-filter: grayscale(0%); -moz-filter: grayscale(0%); -ms-filter: grayscale(0%); -o-filter: grayscale(0%); filter: grayscale(0%) blur(0px); } .intro .Tpage .Tmid .goodsCon .Ttxt #component > .Tmsg .pageChange > li:after { content: ""; position: absolute; width: 100%; height: 100%; top: 0; left: 0; background-color: #000; opacity: 0.5; z-index: 2; transition: all 0.3s ease-in-out; } .intro .Tpage .Tmid .goodsCon .Ttxt #component > .Tmsg .pageChange > li > .back { width: 100%; height: 100%; -webkit-filter: grayscale(100%); -moz-filter: grayscale(100%); -ms-filter: grayscale(100%); -o-filter: grayscale(100%); filter: grayscale(100%) blur(5px); transition: all 0.3s ease-in-out; } .intro .Tpage .Tmid .goodsCon .Ttxt #component > .Tmsg .pageChange > li > img.logo { position: absolute; top: 0; bottom: 0; left: 0; right: 0; margin: auto; z-index: 5; max-height: 40px; } .intro .Tpage .Tmid .goodsCon .Ttxt #component > .Tmsg .pageChange > span { position: absolute; display: inline-block; color: #fff; font-size: 17px; font-weight: bold; text-align: right; width: 80%; max-width: 1200px; margin: auto; bottom: -48px; left: 0; right: 0; z-index: 5; pointer-events: none; } .intro .Tpage .Tmid .goodsCon .Ttxt #component > .Tmsg .pageChange > span > b { color: #fff; font-size: 100px; } .intro .Tpage .Tmid .goodsCon .Ttxt #component .txtList > h5 { padding-bottom: 28px; border-bottom: 1px solid #eee; } .intro .Tpage .Tmid .goodsCon .Ttxt #component .txtList > .right-btn { display: block; width: 100%; text-align: right; position: relative; z-index: 99999; } .intro .Tpage .Tmid .goodsCon .Ttxt #component .txtList > .right-btn a { font-size: 14px; color: #20c401; } .intro .Tpage .Tmid .goodsCon .Ttxt #component .txtList > .Tmsg { padding: 50px 0; overflow: hidden; } .intro .Tpage .Tmid .goodsCon .Ttxt #component .txtList > .Tmsg .left { float: left; width: 46%; position: relative; padding-bottom: 50px; height: 265px; } .intro .Tpage .Tmid .goodsCon .Ttxt #component .txtList > .Tmsg .left p > b { font-size: 24px; color: #333; display: block; margin-bottom: 2px; } .intro .Tpage .Tmid .goodsCon .Ttxt #component .txtList > .Tmsg .left p > span { font-size: 24px; color: #5e5e5e; display: block; } .intro .Tpage .Tmid .goodsCon .Ttxt #component .txtList > .Tmsg .left p > small { font-size: 15px; color: #8c8c8c; display: block; margin: 32px 0; } .intro .Tpage .Tmid .goodsCon .Ttxt #component .txtList > .Tmsg .right { float: right; width: 46%; position: relative; padding-bottom: 50px; height: 265px; } .intro .Tpage .Tmid .goodsCon .Ttxt #component .txtList > .Tmsg .right > ul > li { color: #8c8c8c; font-size: 14px; padding-left: 13px; position: relative; margin-bottom: 6px; } .intro .Tpage .Tmid .goodsCon .Ttxt #component .txtList > .Tmsg .right > ul > li:after { content: ''; position: absolute; width: 4px; height: 4px; border-radius: 50%; background-color: #20c401; left: 0; top: 0; bottom: 0; margin: auto; } .intro .Tpage .Tmid .goodsCon .Ttxt #component .txtList > .Tmsg .Tbtm { font-size: 14px; color: #333; font-weight: bold; text-align: center; background-color: #f2f3f5; position: absolute; bottom: 0; left: 0; width: 100%; height: 32px; line-height: 16px; } .intro .Tpage .Tmid .goodsCon .Ttxt #component .txtList > .Tmsg .Tbtm > b { font-size: 52px; letter-spacing: 4px; } .join-social .banner { position: relative; } .join-social .banner .picBox { background-color: #000; } .join-social .banner .picBox > img { opacity: 0.5; } .join-social .banner .Tmsg { position: absolute; width: 80%; top: 0; bottom: 0; left: 0; right: 0; max-width: 1200px; margin: auto; } .join-social .banner .Tmsg > span { color: #fff; font-size: 32px; font-weight: bold; display: inline-block; width: 100%; text-align: center; position: absolute; height: 120px; top: -120px; bottom: 0; margin: auto; line-height: 90px; letter-spacing: 10px; } .join-social .banner .Tmsg > span:after { content: ""; position: absolute; height: 3px; width: 100px; bottom: 0; top: 60px; left: 0; right: 0; margin: auto; background-color: #20c401; } .join-social .banner .Tmsg > span > small { font-size: 30px; display: block; text-align: center; letter-spacing: 5px; } .join-social .Tpage .Tmid { width: 80%; position: relative; margin: 0 auto; max-width: 1200px; box-sizing: border-box; transform: translateY(-80px); background-color: #fff; padding: 30px 0; box-shadow: 0 20px 55px -18px rgba(0, 0, 0, 0.1); } .join-social .Tpage .Tmid:after { content: ""; position: absolute; width: 0; height: 0; border-style: solid; border-color: transparent transparent #fff transparent; border-width: 20px; top: -40px; left: 0; right: 0; margin: auto; } .join-social .Tpage .Tmid .title { color: #20c401; text-align: center; margin-bottom: 20px; } .join-social .Tpage .Tmid form { border-bottom: 1px solid #b5b5b5; float: right; margin-right: 7%; padding-bottom: 6px; } .join-social .Tpage .Tmid form input, .join-social .Tpage .Tmid form button { height: 16px; margin-top: 17px; background-color: transparent; border: none; } .join-social .Tpage .Tmid form input { width: 200px; font-size: 14px; color: #b5b5b5; text-indent: 10px; } .join-social .Tpage .Tmid form button { color: #b5b5b5; margin-right: 10px; } .join-social .Tpage .Tmid .Tcon { width: 86%; margin: auto; } .join-social .Tpage .Tmid .Tcon .msgBox { overflow: hidden; min-height: 400px; } .join-social .Tpage .Tmid .Tcon .msgBox .firstRow { height: 38px !important; border-bottom: 2px solid #20c401; overflow: visible !important; } .join-social .Tpage .Tmid .Tcon .msgBox .firstRow .col { font-size: 16px !important; box-sizing: border-box; font-weight: 700; line-height: 40px !important; letter-spacing: 1px; color: #333 !important; position: relative; } .join-social .Tpage .Tmid .Tcon .msgBox .firstRow .col > span { font-size: 16px; box-sizing: border-box; font-weight: 700; line-height: 40px; letter-spacing: 1px; color: #333; display: inline-block; height: 36px; cursor: pointer; margin-right: 5px; } .join-social .Tpage .Tmid .Tcon .msgBox .firstRow .col > ul.down { position: absolute; top: 100%; width: 60%; z-index: 100; display: none; left: 20%; } .join-social .Tpage .Tmid .Tcon .msgBox .firstRow .col > ul.down > li { display: inline-block; width: 100%; box-sizing: border-box; padding: 0 0.08rem; background-color: #efefef; float: left; transition: all 0.2s ease-in-out; cursor: pointer; box-shadow: 0 5px 10px rgba(117, 117, 117, 0.56); } .join-social .Tpage .Tmid .Tcon .msgBox .firstRow .col > ul.down > li > span { font-weight: normal; color: #868585; transition: all 0.2s ease-in-out; font-size: 12px; } .join-social .Tpage .Tmid .Tcon .msgBox .firstRow .col > ul.down > li:hover { background-color: #20c401; } .join-social .Tpage .Tmid .Tcon .msgBox .firstRow .col > ul.down > li:hover > span { color: #fff; } .join-social .Tpage .Tmid .Tcon .msgBox .list { overflow: hidden; height: 80px; } .join-social .Tpage .Tmid .Tcon .msgBox .list.myClick { cursor: pointer; } .join-social .Tpage .Tmid .Tcon .msgBox .list .col { float: left; width: calc(100% / 4); display: inline-block; height: 100%; font-size: 13px; border-right: 1px solid #fff; text-align: center; line-height: 80px; transition: all 0.3s ease-in-out; color: #9f9f9f; } .join-social .Tpage .Tmid .Tcon .msgBox .list .col:first-child { text-align: left; } .join-social .Tpage .Tmid .Tcon .msgBox .list .col:last-child { border: none; / / text-align: right; } .join-social .Tpage .Tmid .Tcon .msgBox .list a.col { font-weight: 100; font-size: 14px; transition: all 0.3s ease-in-out; } .join-social .Tpage .Tmid .Tcon .msgBox .list a.col:hover { color: #20c401; text-decoration: underline; } .join-social .Tpage .Tmid .Tcon .msgBox .downList div.col { color: #20c401; } .join-social .Tpage .Tmid .Tcon .msgBox .downBox { background-color: #f5f5f5; padding-bottom: 1.5rem; padding-top: 20px; display: none; position: relative; } .join-social .Tpage .Tmid .Tcon .msgBox .downBox:before { content: ''; position: absolute; border-style: solid; border-width: 20px; border-color: transparent transparent #f5f5f5 transparent; width: 0; height: 0; top: -40px; left: -20px; } .join-social .Tpage .Tmid .Tcon .msgBox .downBox .Tmsg { overflow: auto; padding: 0 3rem; max-height: 280px; display: flex; justify-content: space-between; flex-wrap: wrap; / / align-items: center; } .join-social .Tpage .Tmid .Tcon .msgBox .downBox .Tmsg .msgList { padding-top: 1.5rem; width: 45%; } .join-social .Tpage .Tmid .Tcon .msgBox .downBox .Tmsg .msgList h4 { font-size: 15px; color: #404040; } .join-social .Tpage .Tmid .Tcon .msgBox .downBox .Tmsg .msgList p { font-size: 13px; line-height: 28px; } .join-social .Tpage .Tmid .Tcon .msgBox .downBox .Tmsg .msgList p > span { font-size: 13px; line-height: 28px; display: inline-block; vertical-align: top; margin-right: 2.5rem; max-width: 520px; } .join-social .Tpage .Tmid .Tcon .msgBox .downBox .Tmsg .listBtm { text-align: center; margin-top: 26px; width: 100%; } .join-social .Tpage .Tmid .Tcon .msgBox .downBox .Tmsg .listBtm > a { color: #fff; cursor: pointer; display: inline-block; height: 36px; line-height: 36px; text-align: center; font-size: 12px; background-color: #20c401; width: 108px; } .join-social .Tpage .Tmid .Tcon .msgBox .downBox .Tmsg .listBtm > a > i { display: inline-block; height: 36px; line-height: 36px; color: #fff; font-size: 20px; vertical-align: sub; margin-left: 12px; } .join-social .Tpage .Tmid .Tcon .Tbtm { text-align: center; } .join-social .Tpage .Tmid .Tcon .Tbtm .Tmore { text-align: center; color: #333; border: 1px solid #e1e1e1; border-radius: 50px; padding: 5px 30px; letter-spacing: 2px; font-size: 14px; font-weight: bold; display: inline-block; cursor: pointer; position: relative; overflow: hidden; } .join-social .Tpage .Tmid .Tcon .Tbtm .Tmore:after { content: ''; position: absolute; top: 0; bottom: 0; left: 0; right: 0; margin: auto; width: 1px; height: 1px; border-radius: 50%; background-color: #20c401; z-index: -1; pointer-events: none; opacity: 0; transition: all 0.4s cubic-bezier(0, 0.78, 0.7, 0.67); } .join-social .Tpage .Tmid .Tcon .Tbtm .Tmore:hover { color: #fff; } .join-social .Tpage .Tmid .Tcon .Tbtm .Tmore:hover:after { opacity: 1; width: 200px; height: 200px; } .join-school .banner { position: relative; } .join-school .banner .picBox { background-color: #000; } .join-school .banner .picBox > img { opacity: 0.5; } .join-school .banner .Tmsg { position: absolute; width: 80%; top: 0; bottom: 0; left: 0; right: 0; max-width: 1200px; margin: auto; } .join-school .banner .Tmsg > span { color: #fff; font-size: 32px; font-weight: bold; display: inline-block; width: 100%; text-align: center; position: absolute; height: 120px; top: -120px; bottom: 0; margin: auto; line-height: 90px; letter-spacing: 10px; text-transform: uppercase; } .join-school .banner .Tmsg > span:after { content: ""; position: absolute; height: 3px; width: 100px; bottom: 0; left: 0; top: 60px; right: 0; margin: auto; background-color: #20c401; } .join-school .banner .Tmsg > span > small { font-size: 30px; display: block; text-align: center; letter-spacing: 5px; } .join-school .Tpage .Tmid { position: relative; margin: 0 auto; box-sizing: border-box; transform: translateY(-80px); background-color: #fff; padding: 30px 0; padding-top: 0px; box-shadow: 0 20px 55px -18px rgba(0, 0, 0, 0.1); } .join-school .Tpage .Tmid > ul.top { height: 80px; display: flex; justify-content: center; align-items: center; overflow: hidden; background-color: #8c8c8c; } .join-school .Tpage .Tmid > ul.top > li { display: inline-block; float: left; width: 25%; height: 80px; } .join-school .Tpage .Tmid > ul.top > li > a { display: inline-block; width: 100%; height: 80px; line-height: 80px; color: #fff; font-size: 24px; text-align: center; position: relative; z-index: 5; overflow: hidden; } .join-school .Tpage .Tmid > ul.top > li > a.on { background-color: #20c401; } .join-school .Tpage .Tmid > ul.top > li > a:after { content: ''; position: absolute; top: 0; bottom: 0; left: 0; right: 0; margin: auto; width: 1px; height: 1px; background-color: #20c401; z-index: -1; pointer-events: none; opacity: 0; transition: all 0.5s cubic-bezier(0.26, 0.75, 0.26, 0.74); } .join-school .Tpage .Tmid > ul.top > li > a:hover:after { opacity: 1; width: 100%; height: 100%; } .join-school .Tpage .Tmid .Tcon .list { width: 100%; margin: auto; padding: 60px 0 0 0; } .join-school .Tpage .Tmid .Tcon .list .title { font-weight: bold; line-height: 1em; position: relative; text-align: center; margin-bottom: 20px; } .join-school .Tpage .Tmid .Tcon .list .title:after { content: ''; position: absolute; left: 0; right: 0; margin: auto; bottom: -20px; background-color: #20c401; height: 3px; width: 75px; } .join-school .Tpage .Tmid .Tcon .list .Tmsg { margin-top: 56px; padding: 0 40px 20px; } .join-school .Tpage .Tmid .Tcon .list .Tmsg > img { width: 100%; } .join-school .Tpage .Tmid .Tcon .list .Tmsg .Ttab { width: 100%; } .join-school .Tpage .Tmid .Tcon .list .Tmsg .Ttab tr:first-child { background-color: #ccebba; } .join-school .Tpage .Tmid .Tcon .list .Tmsg .Ttab tr th { text-align: center; color: #1c1310; font-weight: bold; padding: 23px; width: 80px; border: 1px solid rgba(255, 255, 255, .5); } .join-school .Tpage .Tmid .Tcon .list .Tmsg .Ttab tr td { text-align: center; padding: 14px; border: 1px solid rgba(255, 255, 255, .5); } .join-school .Tpage .Tmid .Tcon .list .Tmsg .Ttab tr td.Ttype { background-color: #e3f0dd; font-size: 16px; color: #221815; } .join-school .Tpage .Tmid .Tcon .list .Tmsg .workGo { position: relative; background: url(../image/join2.png) center no-repeat; background-size: contain; } .join-school .Tpage .Tmid .Tcon .list .Tmsg .workGo > .note { position: absolute; right: 4%; bottom: 10%; } .join-school .Tpage .Tmid .Tcon .list .Tmsg .workGo > .note > span { display: block; font-size: 12px; color: #717070; } .join-school .Tpage .Tmid .Tcon .list .Tmsg .workGo > .note > span > b { font-size: 12px; color: #333; } .join-school .Tpage .Tmid .Tcon .list .Tmsg .workGo > .Tdot { position: absolute; width: 50px; height: 50px; line-height: 50px; text-align: center; border-radius: 50%; background-color: #fff; box-shadow: 0 0px 22px -4px rgba(0, 0, 0, 0.2); font-size: 22px; font-weight: 800; color: #8c8c8c; } .join-school .Tpage .Tmid .Tcon .list .Tmsg .workGo > .Tdot:after { content: attr(data-name); position: absolute; font-size: 15px; color: #808080; width: 100px; text-align: center; letter-spacing: 1px; } .join-school .Tpage .Tmid .Tcon .list .Tmsg .workGo > .Tdot.top:after { bottom: 100%; left: -25px; } .join-school .Tpage .Tmid .Tcon .list .Tmsg .workGo > .Tdot.btm:after { top: 100%; left: -25px; } .join-school .Tpage .Tmid .Tcon .list .Tmsg .workGo > .Tdot.right:after { left: 100%; } .join-school .Tpage .Tmid .Tcon .list .Tmsg .matters .Trow { margin-bottom: 38px; } .join-school .Tpage .Tmid .Tcon .list .Tmsg .matters .Trow > h5 { font-size: 18px; color: #221815; font-weight: bold; text-align: left; margin-bottom: 10px; } .join-school .Tpage .Tmid .Tcon .list .Tmsg .matters .Trow > span { font-size: 14px; color: #3e3a39; display: block; } .join-school .Tpage .Tmid .Tcon .list .Tmsg .matters .Trow > span > a { color: #20c401; font-size: 14px; } .service .banner { position: relative; } .service .banner .picBox { background-color: #000; } .service .banner .picBox > img { opacity: 0.5; } .service .banner .Tmsg { position: absolute; width: 80%; top: 0; bottom: 0; left: 0; right: 0; max-width: 1200px; margin: auto; } .service .banner .Tmsg > span { color: #fff; font-size: 30px; font-weight: bold; display: inline-block; width: 100%; text-align: center; position: absolute; height: 120px; top: -160px; bottom: 0; margin: auto; line-height: 120px; letter-spacing: 10px; text-transform: uppercase; } .service .banner .Tmsg > span:after { content: ""; position: absolute; height: 3px; width: 100px; bottom: 0; left: 0; right: 0; margin: auto; background-color: #20c401; } .service .banner .Tmsg > span > small { font-size: 30px; display: block; text-align: center; letter-spacing: 5px; } .service .Tpage .Tmid .Trow.r2 { overflow: hidden; margin: 30px 0; } .service .Tpage .Tmid .Trow.r2 > ul { width: 100%; } .service .Tpage .Tmid .Trow.r2 > ul > li { height: 90px; float: left; width: 25%; } .service .Tpage .Tmid .Trow.r2 > ul > li > a { display: inline-block; height: 90px; line-height: 90px; color: #5e5e5e; font-size: 14px; text-align: center; background-color: #f7f7f7; width: 100%; transition: all 0.3s ease-in-out; } .service .Tpage .Tmid .Trow.r2 > ul > li > a.on, .service .Tpage .Tmid .Trow.r2 > ul > li > a:hover, .Trow.r2 > ul > li > a.on, .Trow.r2 > ul > li > a:hover, .service-one .service-tab-ul .service-ul .service-li-three .Trow.r2 > ul > li > a:hover { background-color: #20c401 !important; color: #fff; } .service .Tpage .Tmid .Trow.r2 > ul > li:nth-child(2n) > a { background-color: #f0f0f0; } .service-use .Tpage .Tmid .title { color: #000; font-weight: bold; position: relative; line-height: 1em; text-align: center; margin-top: 80px; margin-bottom: 80px; } .service-use .Tpage .Tmid .title:after { content: ''; position: absolute; left: 0; right: 0; margin: auto; bottom: -20px; width: 60px; height: 2px; background-color: #20c401; } .service-use .Tpage .Tmid .Trow.r1 { overflow: hidden; background: url(../image/midline.png) center top no-repeat; background-size: auto; } .service-use .Tpage .Tmid .Trow.r1 .left { float: left; width: 45%; } .service-use .Tpage .Tmid .Trow.r1 .right { float: right; width: 45%; } .service-use .Tpage .Tmid .Trow.r1 .txt .msglist { margin-bottom: 45px; } .service-use .Tpage .Tmid .Trow.r1 .txt .msglist h5 { text-align: left; margin-bottom: 20px; color: #333; } .service-use .Tpage .Tmid .Trow.r1 .txt .msglist p { line-height: 200%; color: #727171; } .service-use .Tpage .Tmid .Trow.r1 .Tpic { height: 100%; } .service-use .Tpage .Tmid .Trow.r1 .Tpic > img { height: auto; } .service-location .Tpage .Tmid .Trow.r1 { overflow: visible; width: 80%; max-width: 1200px; margin: auto; padding-top: 50px; } .service-location .Tpage .Tmid .Trow.r1 .Tcon.service-map-sou { width: 55%; margin-bottom: 80px; } .service-location .Tpage .Tmid .Trow.r1 .Tcon .msgRow { display: flex; justify-content: flex-start; align-items: flex-end; flex-wrap: wrap; margin: 32px auto; clear: both; overflow: visible; min-height: 68px; padding-right: 60px; position: relative; } .service-location .Tpage .Tmid .Trow.r1 .Tcon .msgRow span.Ttitle { color: #343434; font-weight: bold; display: block; margin-bottom: 24px; letter-spacing: 1px; clear: both; width: 100%; } .service-location .Tpage .Tmid .Trow.r1 .Tcon .msgRow .col { float: left; display: inline-block; width: 42%; margin-right: 6%; } .service-location .Tpage .Tmid .Trow.r1 .Tcon .msgRow .col.radio_con { margin-right: 0; width: 33%; height: 32px; line-height: 32px; } .service-location .Tpage .Tmid .Trow.r1 .Tcon .msgRow .col.radio_con > span { display: inline-block; color: #000; font-weight: 100; margin-right: 8px; letter-spacing: 1px; } .service-location .Tpage .Tmid .Trow.r1 .Tcon .msgRow .col.select_con > select { background-color: #f2f3f5; height: 32px; color: #777777; line-height: 32px; font-size: 14px; width: 100%; border: none; border-radius: 5px; text-indent: 10px; } .service-location .Tpage .Tmid .Trow.r1 .Tcon .msgRow > a { width: 60px; height: 30px; line-height: 30px; text-align: center; background-color: #8c8c8c; color: #fff; position: absolute; bottom: 0; right: 0; border-radius: 5px; } .service-location .Tpage .Tmid .Trow.r1 .Tcon .left { float: left; width: calc(100% - 580px); height: 600px; overflow: auto; } .service-location .Tpage .Tmid .Trow.r1 .Tcon .left::-webkit-scrollbar { width: 6px; } .service-location .Tpage .Tmid .Trow.r1 .Tcon .left .adrItem .list { padding: 12px 20px; /*background-color: #fff;*/ padding-right: 56px; position: relative; margin-bottom: 20px; } .service-location .Tpage .Tmid .Trow.r1 .Tcon .left .adrItem .list:hover i { color: #20c401; } .service-location .Tpage .Tmid .Trow.r1 .Tcon .left .adrItem .list > h5 { margin-bottom: 10px; color: #333; } .service-location .Tpage .Tmid .Trow.r1 .Tcon .left .adrItem .list > div { font-size: 14px; color: #747474; } .service-location .Tpage .Tmid .Trow.r1 .Tcon .left .adrItem .list > i { position: absolute; display: inline-block; font-size: 20px; color: #bbb; height: 50px; line-height: 50px; right: 40px; top: 0; bottom: 0; margin: auto; cursor: pointer; } .service-location .Tpage .Tmid .Trow.r1 .Tcon .right { float: right; width: 500px; height: 600px; } .service-location .Tpage .Tmid .Trow.r1 .Tcon .right #map { width: 500px; height: 600px; margin: auto; box-shadow: 0 20px 57px -5px rgba(0, 0, 0, 0.15); } .service-location .Tpage .Tmid .Trow.r1 .Tcon .right #map .anchorBL { display: none; } .service-FAQ .Tpage .Tmid .title { color: #000; font-weight: bold; position: relative; line-height: 1em; text-align: center; margin-top: 80px; margin-bottom: 80px; } .service-FAQ .Tpage .Tmid .title:after { content: ''; position: absolute; left: 0; right: 0; margin: auto; bottom: -20px; width: 60px; height: 2px; background-color: #20c401; } .service-FAQ .Tpage .Tmid .Tsearch { height: 60px; width: 50%; margin: 45px auto; position: relative; margin-bottom: 50px; padding: 10px 66px 10px 10px; border-radius: 5px; background-color: #f2f3f5; } .service-FAQ .Tpage .Tmid .Tsearch > input { height: 100%; border: none; width: 100%; padding-left: 12px; border-radius: 5px; } .service-FAQ .Tpage .Tmid .Tsearch > i { display: inline-block; position: absolute; height: 100%; text-align: center; color: #20c401; right: 22px; top: 0; font-size: 22px; cursor: pointer; line-height: 60px; } .service-FAQ .Tpage .Tmid .Trow.r1 { width: 80%; max-width: 1200px; margin: auto; } .service-FAQ .Tpage .Tmid .Trow.r1 .problem > li { position: relative; padding: 0 14px; line-height: 50px; background-color: #f8f8ff; margin-bottom: 20px; cursor: pointer; transition: all 0.6s ease-in-out; border-radius: 5px; overflow: hidden; } .service-FAQ .Tpage .Tmid .Trow.r1 .problem > li > span { color: #333; padding-left: 32px; transition: all 0.6s ease-in-out; } .service-FAQ .Tpage .Tmid .Trow.r1 .problem > li > .Tmsg { height: 0px; overflow: hidden; transition: all 0.6s ease-in-out; } .service-FAQ .Tpage .Tmid .Trow.r1 .problem > li > .Tmsg > ol { padding: 12px 24px; background-color: #fff; margin-bottom: 14px; border-radius: 5px; } .service-FAQ .Tpage .Tmid .Trow.r1 .problem > li > .Tmsg > ol > li > b { color: #20c401; margin-right: 18px; } .service-FAQ .Tpage .Tmid .Trow.r1 .problem > li.on, .service-FAQ .Tpage .Tmid .Trow.r1 .problem > li:active { background-color: #8dc63f; transition: all 0.6s ease-in-out; } .service-FAQ .Tpage .Tmid .Trow.r1 .problem > li.on > span, .service-FAQ .Tpage .Tmid .Trow.r1 .problem > li:active > span { color: #fff; } .service-FAQ .Tpage .Tmid .Trow.r1 .problem > li.on > .Tmsg, .service-FAQ .Tpage .Tmid .Trow.r1 .problem > li:active > .Tmsg { height: auto; } .service-FAQ .Tpage .Tmid .Trow.r1 .problem > li.on .addIcon:after, .service-FAQ .Tpage .Tmid .Trow.r1 .problem > li:active .addIcon:after { transform: rotate(90deg); opacity: 0; background-color: #fff; } .service-FAQ .Tpage .Tmid .Trow.r1 .problem > li.on .addIcon:before, .service-FAQ .Tpage .Tmid .Trow.r1 .problem > li:active .addIcon:before { background-color: #fff; } .service-FAQ .Tpage .Tmid .Trow.r1 .problem > li:after { content: ''; position: absolute; width: 44px; height: 42px; background: url("../image/Q.png") center no-repeat; top: 0; left: 0; z-index: 2; } .service-FAQ .Tpage .Tmid .Trow.r1 .problem > li .addIcon { position: absolute; display: inline-block; height: 50px; width: 50px; right: 20px; top: 0; } .service-FAQ .Tpage .Tmid .Trow.r1 .problem > li .addIcon:before { content: ''; position: absolute; top: 0; left: 0; bottom: 0; right: 0; margin: auto; width: 17px; height: 3px; background-color: #20c401; transition: all 0.6s ease-in-out; } .service-FAQ .Tpage .Tmid .Trow.r1 .problem > li .addIcon:after { content: ''; position: absolute; top: 0; left: 0; bottom: 0; right: 0; margin: auto; height: 17px; width: 3px; background-color: #20c401; transition: all 0.6s ease-in-out; } .banner .picBox { height: 60vh; background-size: cover; background-repeat: no-repeat; background-position: center center; } .service-app .qrcode { width: 150px; height: 150px; background: #0b3a58; border: 1px solid #707070; box-sizing: border-box; position: fixed; z-index: 100; } .service-app .qrcode img { width: 100%; } .service-app .Tpage .Tmid .Trow.r1 { overflow: hidden; width: 80%; max-width: 1200px; margin: auto; padding-top: 50px; } .service-app .Tpage .Tmid .Trow.r1 .left { float: left; width: 32%; } .service-app .Tpage .Tmid .Trow.r1 .left > .aBtn { width: 280px; height: 70px; line-height: 70px; text-align: center; color: #707070; border: 1px solid #20c401; display: block; margin: 20px 0; } .service-app .Tpage .Tmid .Trow.r1 .left > .aBtn.on, .service-app .Tpage .Tmid .Trow.r1 .left > .aBtn:hover { color: #fff; background-color: #20c401; } .service-app .Tpage .Tmid .Trow.r1 .right { float: right; width: 68%; } .service-app .Tpage .Tmid .Trow.r1 .right .appItem { /*background: url("../image/download.png") left center no-repeat;*/ /*background-size: contain;*/ } .service-app .Tpage .Tmid .Trow.r1 .right .appItem > li { color: #333; font-weight: bold; text-indent: 20px; height: 40px; line-height: 40px; margin: 50px 0; } .service-app .Tpage .Tmid .Trow.r1 .right .appItem > li > span { float: right; height: 40px; } .service-app .Tpage .Tmid .Trow.r1 .right .appItem > li > span > .aBtn { width: 150px; height: 40px; line-height: 40px; text-align: center; color: #707070; border: 1px solid #707070; display: inline-block; margin: 0px 18px; text-indent: 0px; } .service-app .Tpage .Tmid .Trow.r1 .right .appItem > li > span > .aBtn > i { height: 100%; line-height: 100%; text-align: center; font-size: 18px; margin-right: 8px; } .service-app .Tpage .Tmid .Trow.r1 .right .appItem > li > span > .aBtn.on, .service-app .Tpage .Tmid .Trow.r1 .right .appItem > li > span > .aBtn:hover { color: #fff; border: none; background-color: #20c401; } .service-pro .dropdown div { max-height: 500px; } .service-pro .dropdown ul { height: 500px; overflow: auto; } .service-pro .Tpage .Tmid .Trow.r1 { overflow: hidden; width: 80%; max-width: 1200px; margin: auto; padding-top: 50px; } .service-pro .Tpage .Tmid .Trow.r1 .left { float: left; width: 32%; margin-top: -20px; } .service-pro .Tpage .Tmid .Trow.r1 .left > .aBtn { width: 280px; height: 70px; line-height: 70px; font-size: 22px; text-align: center; color: #707070; border: 1px solid #20c401; display: block; margin: 20px 0; } .service-pro .Tpage .Tmid .Trow.r1 .left > .aBtn.on, .service-pro .Tpage .Tmid .Trow.r1 .left > .aBtn:hover { color: #fff; background-color: #20c401; } .service-pro .Tpage .Tmid .Trow.r1 .right { float: right; width: 68%; } .service-pro .Tpage .Tmid .Trow.r1 .right .Tcon { width: 86%; margin: auto; } .service-pro .Tpage .Tmid .Trow.r1 .right .Tcon .Tsearch { height: 60px; position: relative; margin-bottom: 50px; padding: 10px 66px 10px 10px; border-radius: 5px; background-color: #f2f3f5; } .service-pro .Tpage .Tmid .Trow.r1 .right .Tcon .Tsearch > input { height: 100%; border: none; width: 100%; padding-left: 12px; border-radius: 5px; } .service-pro .Tpage .Tmid .Trow.r1 .right .Tcon .Tsearch > i { display: inline-block; position: absolute; height: 100%; text-align: center; color: #20c401; right: 22px; top: 0; font-size: 22px; cursor: pointer; line-height: 60px; } .service-pro .Tpage .Tmid .Trow.r1 .right .Tcon .msgRow { display: flex; justify-content: flex-start; align-items: flex-end; flex-wrap: wrap; margin: 32px auto; clear: both; overflow: visible; min-height: 68px; padding-right: 60px; position: relative; } .service-pro .Tpage .Tmid .Trow.r1 .right .Tcon .msgRow span.Ttitle { font-size: 18px; color: #343434; font-weight: bold; display: block; margin-bottom: 24px; letter-spacing: 1px; clear: both; width: 100%; } .service-pro .Tpage .Tmid .Trow.r1 .right .Tcon .msgRow .col { float: left; display: inline-block; width: 30%; margin-right: 3%; } .service-pro .Tpage .Tmid .Trow.r1 .right .Tcon .msgRow .col.radio_con { margin-right: 0; width: 33%; height: 32px; line-height: 32px; } .service-pro .Tpage .Tmid .Trow.r1 .right .Tcon .msgRow .col.radio_con > span { display: inline-block; color: #000; font-weight: 100; margin-right: 8px; letter-spacing: 1px; } .service-pro .Tpage .Tmid .Trow.r1 .right .Tcon .msgRow .col.select_con > select { background-color: #f2f3f5; height: 32px; color: #777777; line-height: 32px; font-size: 14px; width: 100%; border: none; border-radius: 5px; } .service-pro .Tpage .Tmid .Trow.r1 .right .Tcon .msgRow > a { width: 60px; height: 30px; line-height: 30px; text-align: center; background-color: #8c8c8c; color: #fff; position: absolute; bottom: 0; right: 0; border-radius: 5px; } .service-pro .Tpage .Tmid .Trow.r1 .right .Tcon .msgBox { overflow: auto; min-height: 400px; height: 500px; padding-right: 20px; } .service-pro .Tpage .Tmid .Trow.r1 .right .Tcon .msgBox::-webkit-scrollbar { width: 6px; } .service-pro .Tpage .Tmid .Trow.r1 .right .Tcon .msgBox .firstRow { height: 38px !important; border-bottom: 1px solid #20c401; overflow: visible !important; } .service-pro .Tpage .Tmid .Trow.r1 .right .Tcon .msgBox .firstRow .col { font-size: 14px !important; box-sizing: border-box; font-weight: 700; line-height: 40px !important; letter-spacing: 1px; color: #686868 !important; position: relative; } .service-pro .Tpage .Tmid .Trow.r1 .right .Tcon .msgBox .firstRow .col > span { font-size: 14px; box-sizing: border-box; font-weight: 500; line-height: 40px; letter-spacing: 1px; color: #686868; display: inline-block; height: 36px; cursor: pointer; margin-right: 5px; text-align: center; } .service-pro .Tpage .Tmid .Trow.r1 .right .Tcon .msgBox .list { overflow: hidden; height: 50px; } .service-pro .Tpage .Tmid .Trow.r1 .right .Tcon .msgBox .list.myClick { cursor: pointer; } .service-pro .Tpage .Tmid .Trow.r1 .right .Tcon .msgBox .list .col { float: left; width: calc(100% / 4); display: inline-block; height: 100%; font-size: 13px; border-right: 1px solid #fff; text-align: center; font-weight: 500; line-height: 50px; transition: all 0.3s ease-in-out; color: #4f4f4f; } .service-pro .Tpage .Tmid .Trow.r1 .right .Tcon .msgBox .list .col:first-child { text-align: left; } .service-pro .Tpage .Tmid .Trow.r1 .right .Tcon .msgBox .list .col:last-child { border: none; text-align: right; } .service-pro .Tpage .Tmid .Trow.r1 .right .Tcon .msgBox .list .col > i { color: #20c401; } .service-pro .Tpage .Tmid .Trow.r1 .right .Tcon .msgBox .list a.col { font-weight: 100; font-size: 14px; transition: all 0.3s ease-in-out; } .service-pro .Tpage .Tmid .Trow.r1 .right .Tcon .msgBox .list a.col:hover { color: #20c401; text-decoration: underline; } .service-pro .Tpage .Tmid .Trow.r1 .right .Tcon .msgBox .downList div.col { color: #20c401; } .service-pro .Tpage .Tmid .Trow.r1 .right .Tcon .msgBox .downBox { background-color: #f5f5f5; padding-bottom: 1.5rem; padding-top: 20px; display: none; position: relative; } .service-pro .Tpage .Tmid .Trow.r1 .right .Tcon .msgBox .downBox:before { content: ''; position: absolute; border-style: solid; border-width: 20px; border-color: transparent transparent #f5f5f5 transparent; width: 0; height: 0; top: -40px; left: -20px; } .service-pro .Tpage .Tmid .Trow.r1 .right .Tcon .msgBox .downBox .Tmsg { overflow: auto; padding: 0 3rem; max-height: 280px; display: flex; justify-content: space-between; flex-wrap: wrap; align-items: center; } .service-pro .Tpage .Tmid .Trow.r1 .right .Tcon .msgBox .downBox .Tmsg .msgList { padding-top: 1.5rem; width: 45%; } .service-pro .Tpage .Tmid .Trow.r1 .right .Tcon .msgBox .downBox .Tmsg .msgList h4 { font-size: 15px; color: #404040; } .service-pro .Tpage .Tmid .Trow.r1 .right .Tcon .msgBox .downBox .Tmsg .msgList p { font-size: 13px; line-height: 28px; } .service-pro .Tpage .Tmid .Trow.r1 .right .Tcon .msgBox .downBox .Tmsg .msgList p > span { font-size: 13px; line-height: 28px; display: inline-block; vertical-align: top; margin-right: 2.5rem; max-width: 520px; } .service-pro .Tpage .Tmid .Trow.r1 .right .Tcon .msgBox .downBox .Tmsg .listBtm { text-align: center; margin-top: 26px; width: 100%; } .service-pro .Tpage .Tmid .Trow.r1 .right .Tcon .msgBox .downBox .Tmsg .listBtm > a { color: #fff; cursor: pointer; display: inline-block; height: 36px; line-height: 36px; text-align: center; font-size: 12px; background-color: #20c401; width: 108px; } .service-pro .Tpage .Tmid .Trow.r1 .right .Tcon .msgBox .downBox .Tmsg .listBtm > a > i { display: inline-block; height: 36px; line-height: 36px; color: #fff; font-size: 20px; vertical-align: sub; margin-left: 12px; } .jidi .banner { position: relative; height: 60vh; } .jidi .banner .picBox { background-color: #000; } .jidi .banner .picBox > img { opacity: 0.5; } .jidi .banner .Tmsg { position: absolute; width: 80%; top: 0; bottom: 0; left: 0; right: 0; max-width: 1200px; margin: auto; text-align: center; height: 175px; } .jidi .banner .Tmsg > small { display: block; color: #fff; font-size: 18px; } .jidi .banner .Tmsg > span { font-size: 30px; font-weight: bold; color: #fff; display: block; letter-spacing: 4px; } .jidi .Tpage { transform: translateY(-100px); margin-bottom: -100px; } .jidi .Tpage .Tmid { width: 100%; position: relative; margin: 0 auto; box-sizing: border-box; min-height: 800px; background-color: #fff; padding: 0 0 30px 18%; box-shadow: 0 20px 55px -18px rgba(0, 0, 0, 0.1); } .jidi .Tpage .Tmid .left { position: absolute; left: 0; top: 0; width: 20%; border-right: 1px solid #eee; height: 100%; } .jidi .Tpage .Tmid .left .Ttop { height: 100px; line-height: 100px; font-weight: bold; position: relative; text-align: center; letter-spacing: 2px; } .jidi .Tpage .Tmid .left .Ttop:after { content: ""; position: absolute; width: 60px; height: 3px; bottom: 24px; left: 0; right: 0; margin: auto; background-color: #20c401; } .jidi .Tpage .Tmid .left .Tcon { overflow: hidden; } .jidi .Tpage .Tmid .left .Tcon > li { display: block; width: 100%; height: 90px; line-height: 90px; color: #acacac; border-top: 1px solid #eee; transition: all 0.3s ease-in-out; } .jidi .Tpage .Tmid .left .Tcon > li > a { display: inline-block; padding: 0 9%; position: relative; height: 90px; line-height: 90px; color: #acacac; background-position-x: 120% !important; width: 100%; transition: all 0.3s ease-in-out; } .jidi .Tpage .Tmid .left .Tcon > li > a > i { position: absolute; display: inline-block; font-size: 12px; color: #acacac; width: 20px; text-align: center; height: 16px; line-height: 16px; top: 0; bottom: 0; margin: auto; right: 5%; transition: all 0.3s ease-in-out; } .jidi .Tpage .Tmid .left .Tcon > li:hover { background-color: #20c401 !important; } .jidi .Tpage .Tmid .left .Tcon > li:hover > a { color: #fff; background-position-x: 96% !important; } .jidi .Tpage .Tmid .left .Tcon > li:hover > a > i { color: #fff; } .jidi .Tpage .Tmid .left .Tcon > li.on { background-color: #20c401 !important; } .jidi .Tpage .Tmid .left .Tcon > li.on > a { color: #fff; background-position-x: 96% !important; } .jidi .Tpage .Tmid .left .Tcon > li.on > a > i { color: #fff; } .jidi .Tpage .Tmid .right { padding: 40px 4% 40px 7%; } .jidi .Tpage .Tmid .right .gDot { padding-left: 20px; position: relative; line-height: 1.5em; } .jidi .Tpage .Tmid .right .gDot:after { content: ''; position: absolute; height: 6px; width: 6px; border-radius: 50%; background-color: #333; top: 9px; left: 0; margin: auto; } .jidi .Tpage .Tmid .right .title { font-size: 18px; font-weight: bold; letter-spacing: 2px; margin-bottom: 5px; } .jidi .Tpage .Tmid .right .title > img { vertical-align: text-top; margin-right: 20px; } .jidi .Tpage .Tmid .right .title > small { display: block; font-size: 15px; font-weight: normal; line-height: 1.5em; letter-spacing: 0; margin: 20px 0; } .jidi .Tpage .Tmid .right .Tcon .Tdata { display: inline-block; font-size: 14px; margin: 10px 0; } .jidi .Tpage .Tmid .right .Tcon .Tdata > b { font-size: 18px; color: #20c401; } .jidi .Tpage .Tmid .right .Tcon .dataItem { overflow: hidden; display: flex; justify-content: flex-start; align-items: center; flex-wrap: wrap; margin-top: 32px; } .jidi .Tpage .Tmid .right .Tcon .dataItem > .Tdata { float: left; margin-right: 32px; } .jidi .Tpage .Tmid .right .Tcon .dataItem > .Tdata:last-child { margin-right: 0; } .jidi .Tpage .Tmid .right .Tcon p { color: #8c8c8c; font-size: 14px; margin: 32px 0; width: 100%; } .jidi .Tpage .Tmid .right .Tcon .cl { background-color: #eee; width: 100%; height: 1px; clear: both; } .jidi-1 .Tpage .Tmid .right .Tcon .Trow .title { margin: 32px 0; } .jidi-1 .Tpage .Tmid .right .Tcon .Trow.r2 .msgList { overflow: hidden; position: relative; margin: 32px 0; } .jidi-1 .Tpage .Tmid .right .Tcon .Trow.r2 .msgList .Tleft { float: left; width: 47%; } .jidi-1 .Tpage .Tmid .right .Tcon .Trow.r2 .msgList .Tright { float: right; width: 47%; right: 0; } .jidi-1 .Tpage .Tmid .right .Tcon .Trow.r2 .msgList .pa-div { position: absolute; height: 100%; width: 47%; top: 0; bottom: 0; margin: auto; display: block; } .jidi-1 .Tpage .Tmid .right .Tcon .Trow.r2 .msgList h5 { font-size: 15px; color: #333; font-weight: bold; text-align: left; margin-bottom: 20px; overflow: hidden; word-break: normal; text-overflow: ellipsis; } .jidi-1 .Tpage .Tmid .right .Tcon .Trow.r2 .msgList span { display: table-cell; vertical-align: middle; color: #8c8c8c; font-size: 14px; } .jidi-1 .Tpage .Tmid .right .Tcon .Trow.r3 { margin-bottom: 45px; } .jidi-1 .Tpage .Tmid .right .Tcon .Trow.r3 > h4 { font-size: 24px; text-align: center; width: 100px; color: #333; margin: 32px auto; } .jidi-1 .Tpage .Tmid .right .Tcon .Trow.r3 > .Tmsg { min-height: 300px; padding-top: 40px; position: relative; overflow: hidden; /*background: url("../image/mid.png") bottom center no-repeat;*/ } .jidi-1 .Tpage .Tmid .right .Tcon .Trow.r3 > .Tmsg:before { content: ''; position: absolute; width: 1px; height: 100%; background-color: #eee; left: 0; right: 0; margin: auto; z-index: 0; } .jidi-1 .Tpage .Tmid .right .Tcon .Trow.r3 > .Tmsg:after { content: ""; position: absolute; width: 24px; height: 33px; top: 0; left: 0; right: 0; margin: auto; background: url("../image/location.png") center no-repeat #fff; } .jidi-1 .Tpage .Tmid .right .Tcon .Trow.r3 > .Tmsg .leftCol { float: left; width: calc(50% + 10px); padding-right: 5%; position: relative; overflow: hidden; text-align: right; } .jidi-1 .Tpage .Tmid .right .Tcon .Trow.r3 > .Tmsg .leftCol:before { content: ''; position: absolute; width: 16px; height: 16px; border-radius: 50%; background-color: #fff; border: 1px solid #20c401; right: 1px; top: 36px; } .jidi-1 .Tpage .Tmid .right .Tcon .Trow.r3 > .Tmsg .leftCol:after { content: ''; position: absolute; width: 6px; height: 6px; border-radius: 50%; background-color: #20c401; right: 6px; top: 41px; } .jidi-1 .Tpage .Tmid .right .Tcon .Trow.r3 > .Tmsg .leftCol > h5 { font-size: 18px; font-weight: bold; text-align: right; color: #333; position: relative; margin-bottom: 12px; height: 45px; display: inline-block; } .jidi-1 .Tpage .Tmid .right .Tcon .Trow.r3 > .Tmsg .leftCol > h5:after { content: ""; position: absolute; bottom: 0; width: 140%; height: 1px; background-color: #333; right: 0; transition: all 0.5s ease-in-out; } .jidi-1 .Tpage .Tmid .right .Tcon .Trow.r3 > .Tmsg .leftCol:hover > h5:after { right: -30px; width: 1200px; background-color: #20c401; } .jidi-1 .Tpage .Tmid .right .Tcon .Trow.r3 > .Tmsg .leftCol > p { margin: 0; text-align: left; } .jidi-1 .Tpage .Tmid .right .Tcon .Trow.r3 > .Tmsg .rightCol { float: right; width: calc(50% + 10px); padding-left: 5%; position: relative; text-align: left; overflow: hidden; } .jidi-1 .Tpage .Tmid .right .Tcon .Trow.r3 > .Tmsg .rightCol:before { content: ''; position: absolute; width: 16px; height: 16px; border-radius: 50%; background-color: transparent; border: 1px solid #20c401; left: 2px; top: 36px; } .jidi-1 .Tpage .Tmid .right .Tcon .Trow.r3 > .Tmsg .rightCol:after { content: ''; position: absolute; width: 6px; height: 6px; border-radius: 50%; background-color: #20c401; left: 7px; top: 41px; } .jidi-1 .Tpage .Tmid .right .Tcon .Trow.r3 > .Tmsg .rightCol > h5 { font-size: 18px; font-weight: bold; text-align: right; color: #333; position: relative; margin-bottom: 12px; height: 45px; display: inline-block; } .jidi-1 .Tpage .Tmid .right .Tcon .Trow.r3 > .Tmsg .rightCol > h5:after { content: ""; position: absolute; bottom: 0; width: 140%; height: 1px; background-color: #333; left: 0; transition: all 0.5s ease-in-out; } .jidi-1 .Tpage .Tmid .right .Tcon .Trow.r3 > .Tmsg .rightCol:hover > h5:after { left: -30px; width: 1200px; background-color: #20c401; } .jidi-1 .Tpage .Tmid .right .Tcon .Trow.r3 > .Tmsg .rightCol > p { margin: 0; text-align: left; } .jidi-1 .Tpage .Tmid .right .Tcon .Trow.r4 { position: relative; min-height: 520px; } .jidi-1 .Tpage .Tmid .right .Tcon .Trow.r4 .Tmsg { margin-top: 50px; width: 60%; } .jidi-1 .Tpage .Tmid .right .Tcon .Trow.r4 .Tmsg .msgList { margin-bottom: 50px; } .jidi-1 .Tpage .Tmid .right .Tcon .Trow.r4 .Tmsg .msgList > h5 { font-size: 18px; } .jidi-1 .Tpage .Tmid .right .Tcon .Trow.r4 .Tmsg .msgList > h5 > small { color: #20c401; font-size: 16px; display: block; margin: 15px 0; font-weight: bold; } .jidi-1 .Tpage .Tmid .right .Tcon .Trow.r4 .Tmsg .msgList > ul > li { color: #8c8c8c; font-size: 14px; padding-left: 13px; position: relative; margin-bottom: 4px; } .jidi-1 .Tpage .Tmid .right .Tcon .Trow.r4 .Tmsg .msgList > ul > li:after { content: ''; position: absolute; width: 6px; height: 6px; border-radius: 50%; background-color: #333; left: 0; top: 10px; bottom: auto; margin: auto; } .jidi-1 .Tpage .Tmid .right .Tcon .Trow.r4 > .picBox { width: 246px; position: absolute; right: 5%; top: 0; bottom: 0; margin: auto; } .jidi-1 .Tpage .Tmid .right .Tcon .Trow.r5 .Tmsg .Ttop { display: flex; justify-content: flex-start; align-items: center; flex-wrap: wrap; } .jidi-1 .Tpage .Tmid .right .Tcon .Trow.r5 .Tmsg .Ttop > .chang { display: inline-block; float: left; height: 40px; line-height: 40px; min-width: 100px; padding: 0 25px; text-align: center; letter-spacing: 2px; color: #7e7e7e; font-size: 14px; border: 3px solid #eee; position: relative; margin: 0 30px 20px 0; } .jidi-1 .Tpage .Tmid .right .Tcon .Trow.r5 .Tmsg .Ttop > .chang:last-child { margin-right: 0; } .jidi-1 .Tpage .Tmid .right .Tcon .Trow.r5 .Tmsg .Ttop > .chang:after { content: ""; position: absolute; bottom: -3px; width: 25px; height: 3px; left: 0; right: 0; margin: auto; background-color: #20c401; } .jidi-1 .Tpage .Tmid .right .Tcon .Trow.r5 .Tmsg .swiper-container { width: 100%; padding-top: 50px; padding-bottom: 50px; } .jidi-1 .Tpage .Tmid .right .Tcon .Trow.r5 .Tmsg .swiper-slide { background-position: center; background-size: cover; width: 380px; height: 240px; } .jidi-1 .Tpage .Tmid .right .Tcon .Trow.r5 .Tmsg .swiper-slide .txt { position: absolute; width: 100%; color: #20c401; font-size: 18px; font-weight: bold; top: -45px; text-align: center; opacity: 0; pointer-events: none; transition: all 0.2 ease-in-out; } .jidi-1 .Tpage .Tmid .right .Tcon .Trow.r5 .Tmsg .swiper-slide .txt:after { content: ""; position: absolute; width: 1px; height: 32px; background-color: #636363; left: 0; right: 0; margin: auto; top: 100%; } .jidi-1 .Tpage .Tmid .right .Tcon .Trow.r5 .Tmsg .swiper-slide > p { position: absolute; width: 100%; color: #a2a2a2; font-size: 14px; bottom: -55px; text-align: center; margin: 0; opacity: 0; pointer-events: none; transition: all 0.2s ease-in-out; } .jidi-1 .Tpage .Tmid .right .Tcon .Trow.r5 .Tmsg .swiper-slide.swiper-slide-active .txt { opacity: 1; pointer-events: auto; } .jidi-1 .Tpage .Tmid .right .Tcon .Trow.r5 .Tmsg .swiper-slide.swiper-slide-active > p { opacity: 1; pointer-events: auto; } .jidi-2 .Tpage .Tmid .right .Tcon .Trow .title { margin: 32px 0; } .jidi-2 .Tpage .Tmid .right .Tcon .Trow.r1 { position: relative; } .jidi-2 .Tpage .Tmid .right .Tcon .Trow.r1 > img { position: absolute; top: 0; margin: auto; width: 40%; max-height: 200px; } .jidi-2 .Tpage .Tmid .right .Tcon .Trow.r1 > .dataItem { padding-left: 46%; } .jidi-2 .Tpage .Tmid .right .Tcon .Trow.r1 > .dataItem > p { margin: 20px 0; } .jidi-2 .Tpage .Tmid .right .Tcon .Trow.r1 > p { margin: 20px 0; } .jidi-2 .Tpage .Tmid .right .Tcon .Trow.r1 > small { display: inline-block; font-size: 15px; color: #333; margin-bottom: 20px; margin-top: 55px; } .jidi-2 .Tpage .Tmid .right .Tcon .Trow.r2 .Tmsg { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; } .jidi-2 .Tpage .Tmid .right .Tcon .Trow.r2 .Tmsg > li { text-align: center; float: left; width: 20%; margin-bottom: 50px; position: relative; height: 120px; } .jidi-2 .Tpage .Tmid .right .Tcon .Trow.r2 .Tmsg > li > img { display: inline-block; position: absolute; bottom: 0; left: 0; right: 0; top: 0; margin: auto; } .jidi-2 .Tpage .Tmid .right .Tcon .Trow.r2 .Tmsg > li > small { position: absolute; width: 100%; bottom: -30px; left: 0; height: 30px; line-height: 30px; color: #20c401; font-size: 20px; display: block; text-align: center; } .jidi-2 .Tpage .Tmid .right .Tcon .Trow.r3 .Tmsg .Tlist { margin-bottom: 36px; } .jidi-2 .Tpage .Tmid .right .Tcon .Trow.r3 .Tmsg .Tlist > small { color: #333; font-size: 15px; margin-bottom: 32px; display: block; } .jidi-2 .Tpage .Tmid .right .Tcon .Trow.r3 .Tmsg .Tlist b { font-size: 16px; color: #333; } .jidi-2 .Tpage .Tmid .right .Tcon .Trow.r3 .Tmsg .Tlist b.gb { color: #20c401; font-size: 15px; } .jidi-2 .Tpage .Tmid .right .Tcon .Trow.r3 .Tmsg .Tlist.l1 > .people { overflow: hidden; display: flex; justify-content: center; align-items: center; } .jidi-2 .Tpage .Tmid .right .Tcon .Trow.r3 .Tmsg .Tlist.l1 > .people > li { position: relative; padding-left: 56px; width: 20%; float: left; } .jidi-2 .Tpage .Tmid .right .Tcon .Trow.r3 .Tmsg .Tlist.l1 > .people > li > img { position: absolute; left: 0; top: 0; bottom: 0; margin: auto; } .jidi-2 .Tpage .Tmid .right .Tcon .Trow.r3 .Tmsg .Tlist.l1 > .people > li > b { color: #20c401; font-size: 32px; display: block; font-weight: 500; height: 42px; } .jidi-2 .Tpage .Tmid .right .Tcon .Trow.r3 .Tmsg .Tlist.l1 > .people > li > b > small { color: #20c401; font-size: 18px; height: 42px; line-height: 42px; } .jidi-2 .Tpage .Tmid .right .Tcon .Trow.r3 .Tmsg .Tlist.l1 > .people > li > span { font-size: 14px; color: #333; } .jidi-2 .Tpage .Tmid .right .Tcon .Trow.r3 .Tmsg .Tlist.l2 > img { margin: 20px 0; } .jidi-2 .Tpage .Tmid .right .Tcon .Trow.r3 .Tmsg .Tlist.l2 > .child-li { margin-bottom: 24px; } .jidi-2 .Tpage .Tmid .right .Tcon .Trow.r3 .Tmsg .Tlist.l2 > .child-li > p { margin: 20px 0; } .jidi-2 .Tpage .Tmid .right .Tcon .Trow.r3 .Tmsg .Tlist.l2 > .child-li > ul { overflow: hidden; display: flex; justify-content: space-between; align-items: center; } .jidi-2 .Tpage .Tmid .right .Tcon .Trow.r3 .Tmsg .Tlist.l2 > .child-li > ul > li { float: left; margin: 0 20px; font-size: 15px; } .jidi-2 .Tpage .Tmid .right .Tcon .Trow.r3 .Tmsg .Tlist.l2 > .child-li > ul > li > b { display: block; } .jidi-2 .Tpage .Tmid .right .Tcon .Trow.r3 .Tmsg .Tlist.l2 .picItem { display: flex; justify-content: space-between; align-items: flex-start; flex-wrap: wrap; } .jidi-2 .Tpage .Tmid .right .Tcon .Trow.r3 .Tmsg .Tlist.l2 .picItem > li { width: 47%; float: left; margin-right: 6%; margin-bottom: 50px; position: relative; } .jidi-2 .Tpage .Tmid .right .Tcon .Trow.r3 .Tmsg .Tlist.l2 .picItem > li:nth-child(2n) { margin-right: 0; } .jidi-2 .Tpage .Tmid .right .Tcon .Trow.r3 .Tmsg .Tlist.l2 .picItem > li .picBox { width: 100%; height: 220px; } .jidi-2 .Tpage .Tmid .right .Tcon .Trow.r3 .Tmsg .Tlist.l2 .picItem > li > p { display: table; margin: auto; position: absolute; width: 100%; top: 100%; transition: all 0.3s cubic-bezier(0.39, 0.58, 0.57, 1); } .jidi-2 .Tpage .Tmid .right .Tcon .Trow.r3 .Tmsg .Tlist.l2 .picItem > li > p > span { display: table-cell; vertical-align: middle; font-size: 15px; height: 36px; line-height: 36px; color: #333; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; width: 100%; font-weight: bold; text-align: center; transition: all 0.3s ease-in-out; padding: 0 4%; } .jidi-2 .Tpage .Tmid .right .Tcon .Trow.r3 .Tmsg .Tlist.l2 .picItem > li > p > span > small { color: #fff; font-size: 12px; line-height: 20px; display: none; opacity: 0; text-align: center; transition: all 0.3s ease-in-out; white-space: pre-line; } .jidi-2 .Tpage .Tmid .right .Tcon .Trow.r3 .Tmsg .Tlist.l2 .picItem > li:hover > p { top: 0; bottom: 0; left: 0; right: 0; height: 220px; background-color: rgba(92, 210, 4, 0.8); } .jidi-2 .Tpage .Tmid .right .Tcon .Trow.r3 .Tmsg .Tlist.l2 .picItem > li:hover > p > span { color: #fff; } .jidi-2 .Tpage .Tmid .right .Tcon .Trow.r3 .Tmsg .Tlist.l2 .picItem > li:hover > p > span > small { display: block; opacity: 0.8; } .jidi-3 .Tpage .Tmid .right .Tcon .Trow .title { margin: 32px 0; } .jidi-3 .Tpage .Tmid .right .Tcon .Trow.r5 .prHome { display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: space-between; overflow: hidden; padding-bottom: 30px; } .jidi-3 .Tpage .Tmid .right .Tcon .Trow.r5 .prHome > small { font-size: 16px; } .jidi-3 .Tpage .Tmid .right .Tcon .Trow.r5 .prHome .swiper-container { width: 100%; padding-top: 50px; padding-bottom: 50px; } .jidi-3 .Tpage .Tmid .right .Tcon .Trow.r5 .prHome .swiper-slide { background-position: center; background-size: cover; width: 380px; height: 240px; } .jidi-3 .Tpage .Tmid .right .Tcon .Trow.r5 .prHome .swiper-slide .txt { position: absolute; width: 100%; color: #20c401; font-size: 18px; font-weight: bold; top: -45px; text-align: center; opacity: 0; pointer-events: none; transition: all 0.2 ease-in-out; } .jidi-3 .Tpage .Tmid .right .Tcon .Trow.r5 .prHome .swiper-slide .txt:after { content: ""; position: absolute; width: 1px; height: 32px; background-color: #636363; left: 0; right: 0; margin: auto; top: 100%; } .jidi-3 .Tpage .Tmid .right .Tcon .Trow.r5 .prHome .swiper-slide > p { position: absolute; width: 100%; color: #a2a2a2; font-size: 13px; bottom: -55px; text-align: center; margin: 0; opacity: 0; pointer-events: none; transition: all 0.2 ease-in-out; } .jidi-3 .Tpage .Tmid .right .Tcon .Trow.r5 .prHome .swiper-slide.swiper-slide-active .txt { opacity: 1; pointer-events: auto; } .jidi-3 .Tpage .Tmid .right .Tcon .Trow.r5 .prHome .swiper-slide.swiper-slide-active > p { opacity: 1; pointer-events: auto; } .jidi-4 .Tpage .Tmid .right .Tcon .Trow .title { margin: 32px 0; } .jidi-4 .Tpage .Tmid .right .Tcon .Trow.r2 .msgList { overflow: hidden; position: relative; margin: 32px 0; } .jidi-4 .Tpage .Tmid .right .Tcon .Trow.r2 .msgList .Tleft { float: left; width: 47%; } .jidi-4 .Tpage .Tmid .right .Tcon .Trow.r2 .msgList .Tright { float: right; } .jidi-4 .Tpage .Tmid .right .Tcon .Trow.r2 .msgList .pa-div { position: absolute; height: 100%; width: 47%; top: 0; bottom: 0; margin: auto; display: table; } .jidi-4 .Tpage .Tmid .right .Tcon .Trow.r2 .msgList h5 { font-size: 16px; color: #333; font-weight: bold; text-align: left; margin-bottom: 20px; } .jidi-4 .Tpage .Tmid .right .Tcon .Trow.r2 .msgList span { display: table-cell; vertical-align: middle; color: #8c8c8c; font-size: 13px; } .jidi-4 .Tpage .Tmid .right .Tcon .Trow.r3 { margin-bottom: 45px; } .jidi-4 .Tpage .Tmid .right .Tcon .Trow.r3 > h4 { font-size: 18px; text-align: center; width: 100px; color: #333; margin: 32px auto; } .jidi-4 .Tpage .Tmid .right .Tcon .Trow.r3 > .Tmsg { min-height: 300px; padding-top: 40px; position: relative; overflow: hidden; background: url("../image/mid.png") bottom center no-repeat; } .jidi-4 .Tpage .Tmid .right .Tcon .Trow.r3 > .Tmsg:before { content: ''; position: absolute; width: 1px; height: 100%; background-color: #eee; left: 0; right: 0; margin: auto; z-index: -1; } .jidi-4 .Tpage .Tmid .right .Tcon .Trow.r3 > .Tmsg:after { content: ""; position: absolute; width: 24px; height: 33px; top: 0; left: 0; right: 0; margin: auto; background: url("../image/location.png") center no-repeat #fff; } .jidi-4 .Tpage .Tmid .right .Tcon .Trow.r3 > .Tmsg .leftCol { float: left; width: calc(50% + 10px); padding-right: 5%; position: relative; overflow: hidden; text-align: right; } .jidi-4 .Tpage .Tmid .right .Tcon .Trow.r3 > .Tmsg .leftCol:before { content: ''; position: absolute; width: 16px; height: 16px; border-radius: 50%; background-color: #fff; border: 1px solid #20c401; right: 1px; top: 36px; } .jidi-4 .Tpage .Tmid .right .Tcon .Trow.r3 > .Tmsg .leftCol:after { content: ''; position: absolute; width: 6px; height: 6px; border-radius: 50%; background-color: #20c401; right: 6px; top: 41px; } .jidi-4 .Tpage .Tmid .right .Tcon .Trow.r3 > .Tmsg .leftCol > h5 { font-size: 24px; font-weight: bold; text-align: right; color: #333; position: relative; margin-bottom: 12px; height: 45px; display: inline-block; } .jidi-4 .Tpage .Tmid .right .Tcon .Trow.r3 > .Tmsg .leftCol > h5:after { content: ""; position: absolute; bottom: 0; width: 140%; height: 1px; background-color: #333; right: 0; transition: all 0.5s ease-in-out; } .jidi-4 .Tpage .Tmid .right .Tcon .Trow.r3 > .Tmsg .leftCol:hover > h5:after { right: -30px; width: 1200px; background-color: #20c401; } .jidi-4 .Tpage .Tmid .right .Tcon .Trow.r3 > .Tmsg .leftCol > p { margin: 0; text-align: left; } .jidi-4 .Tpage .Tmid .right .Tcon .Trow.r3 > .Tmsg .rightCol { float: right; width: calc(50% + 10px); padding-left: 5%; position: relative; text-align: left; overflow: hidden; } .jidi-4 .Tpage .Tmid .right .Tcon .Trow.r3 > .Tmsg .rightCol:before { content: ''; position: absolute; width: 16px; height: 16px; border-radius: 50%; background-color: transparent; border: 1px solid #20c401; left: 2px; top: 36px; } .jidi-4 .Tpage .Tmid .right .Tcon .Trow.r3 > .Tmsg .rightCol:after { content: ''; position: absolute; width: 6px; height: 6px; border-radius: 50%; background-color: #20c401; left: 7px; top: 41px; } .jidi-4 .Tpage .Tmid .right .Tcon .Trow.r3 > .Tmsg .rightCol > h5 { font-size: 24px; font-weight: bold; text-align: right; color: #333; position: relative; margin-bottom: 12px; height: 45px; display: inline-block; } .jidi-4 .Tpage .Tmid .right .Tcon .Trow.r3 > .Tmsg .rightCol > h5:after { content: ""; position: absolute; bottom: 0; width: 140%; height: 1px; background-color: #333; left: 0; transition: all 0.5s ease-in-out; } .jidi-4 .Tpage .Tmid .right .Tcon .Trow.r3 > .Tmsg .rightCol:hover > h5:after { left: -30px; width: 1200px; background-color: #20c401; } .jidi-4 .Tpage .Tmid .right .Tcon .Trow.r3 > .Tmsg .rightCol > p { margin: 0; text-align: left; } .jidi-4 .Tpage .Tmid .right .Tcon .Trow.r4 { position: relative; padding-bottom: 30px; } .jidi-4 .Tpage .Tmid .right .Tcon .Trow.r4 .Tmsg { margin-top: 50px; width: 60%; } .jidi-4 .Tpage .Tmid .right .Tcon .Trow.r4 .Tmsg .msgList { margin-bottom: 50px; } .jidi-4 .Tpage .Tmid .right .Tcon .Trow.r4 .Tmsg .msgList > h5 { font-size: 24px; } .jidi-4 .Tpage .Tmid .right .Tcon .Trow.r4 .Tmsg .msgList > h5 > small { color: #20c401; font-size: 16px; display: block; margin: 15px 0; font-weight: bold; } .jidi-4 .Tpage .Tmid .right .Tcon .Trow.r4 .Tmsg .msgList > ul > li { color: #8c8c8c; font-size: 12px; padding-left: 13px; position: relative; margin-bottom: 4px; } .jidi-4 .Tpage .Tmid .right .Tcon .Trow.r4 .Tmsg .msgList > ul > li:after { content: ''; position: absolute; width: 4px; height: 4px; border-radius: 50%; background-color: #333; left: 0; top: 0; bottom: 0; margin: auto; } .jidi-4 .Tpage .Tmid .right .Tcon .Trow.r4 > .picBox { position: absolute; right: 5%; top: 0; width: 30%; bottom: 0; margin: auto; -webkit-mask: url(../image/mask.png); -webkit-mask-size: 100% 100%; } .jidi-4 .Tpage .Tmid .right .Tcon .Trow.r5 .hor { display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: unset; overflow: hidden; padding-bottom: 30px; } .jidi-4 .Tpage .Tmid .right .Tcon .Trow.r5 .hor > li { display: inline-block; float: left; position: relative; border: 3px solid #eee; margin: 19px; width: 180px; height: 250px; text-align: center; margin-bottom: 60px; } .jidi-4 .Tpage .Tmid .right .Tcon .Trow.r5 .hor > li > img { display: inline-block; height: 250px; } .jidi-4 .Tpage .Tmid .right .Tcon .Trow.r5 .hor > li > p { position: absolute; bottom: -42px; height: 30px; line-height: 30px; text-align: center; left: 0; font-size: 13px; width: 100%; margin: 0; } input[type=radio] { display: none; } input[type=radio] + label { display: inline-block; margin-bottom: 0; padding-left: 18px; position: relative; cursor: pointer; vertical-align: middle; font-weight: normal; font-size: 14px; color: #343434; } input[type=radio] + label:not(:last-child) { margin-right: 8px; } input[type=radio] + label:after { content: ''; position: absolute; width: 10px; height: 10px; top: 0; bottom: 0; margin: auto; left: 0; border-radius: 50%; background-color: #dfdfdf; transition: all 0.2s ease-in-out; } input[type=radio]:checked + label:after { background-color: #20c401; } .uploader { position: relative; display: inline-block; overflow: hidden; cursor: default; padding: 0; margin: 10px 0px; -moz-box-shadow: 0px 0px 5px #ddd; -webkit-box-shadow: 0px 0px 5px #ddd; box-shadow: 0px 0px 5px #ddd; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; } .filename { float: left; display: inline-block; outline: 0 none; height: 32px; width: 109px; margin: 0; padding: 8px 10px; overflow: hidden; cursor: default; border-right: 0; font: 9pt/100% Arial, Helvetica, sans-serif; color: #777; text-shadow: 1px 1px 0px #fff; text-overflow: ellipsis; white-space: nowrap; -moz-border-radius: 5px 0px 0px 5px; -webkit-border-radius: 5px 0px 0px 5px; border-radius: 5px 0px 0px 5px; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; background-color: transparent; border: none; } .Tbutton { height: 32px; display: inline-block; outline: 0 none; padding: 8px 24px; margin: 0; cursor: pointer; font: bold 9pt/100% Arial, Helvetica, sans-serif; background-color: #20c401; color: #fff; border: none; border-radius: 0px; } .Tbutton.no { background-color: #909090; } .uploader input[type=button] { pointer-events: none; } .uploader input[type=file] { position: absolute; top: 0; right: 0; bottom: 0; border: 0; padding: 0; margin: 0; height: 30px; cursor: pointer; filter: alpha(opacity=0); -moz-opacity: 0; -khtml-opacity: 0; opacity: 0; width: 100%; } /*弹窗样式*/ .dialog { position: fixed; display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; -webkit-justify-content: center; justify-content: center; pointer-events: none; width: 100%; height: 100%; top: 0; left: 0; z-index: 1000; } .dialog .dialog_mask { width: 100%; height: 100%; top: 0; left: 0; position: absolute; z-index: 1001; background: rgba(55, 58, 71, 0.9); opacity: 0; -webkit-transition: opacity 0.3s; transition: opacity 0.3s; -webkit-backface-visibility: hidden; } .dialog .dialog_content { width: 70%; max-width: 650px; min-width: 290px; background: #fff; padding: 3em 2.4em; text-align: center; position: relative; z-index: 1005; opacity: 0; margin: auto; } .dialog .dialog_content > h2 { font-size: 24px; } .dialog .dialog_content [data-dialog-close] { position: absolute; background-color: transparent; border: none; top: 12px; right: 24px; } .dialog .dialog_content [data-dialog-close] > i { font-size: 24px; color: #8c8c8c; } .dialog .dialog_content .Tcon .msgRow { display: flex; justify-content: space-between; align-items: flex-end; flex-wrap: wrap; margin: 32px auto; clear: both; overflow: hidden; min-height: 68px; } .dialog .dialog_content .Tcon .msgRow span.Ttitle { font-size: 13px; color: #343434; display: block; margin-bottom: 8px; letter-spacing: 1px; clear: both; width: 100%; text-align: left; } .dialog .dialog_content .Tcon .msgRow span.Ttitle > label { font-size: 12px; color: #a6a6a6; } .dialog .dialog_content .Tcon .msgRow .Tinput.erro, .dialog .dialog_content .Tcon .msgRow .inputChoose.erro { border: 1px solid #e60012 !important; } .dialog .dialog_content .Tcon .msgRow .sub { font-size: 17px; font-weight: bold; color: #fff; padding: 6px 64px; border: none; border-radius: 5px; background-color: #8c8c8c; transition: all 0.2s ease-in-out; margin-right: 12px; } .dialog .dialog_content .Tcon .msgRow .sub.ok { background-color: #20c401; color: #fff; } .dialog .dialog_content .Tcon .msgRow .sub.ok + small { display: none; } .dialog .dialog_content .Tcon .msgRow .sub + small { font-size: 12px; color: #e60012; opacity: 0; pointer-events: none; transform: translateX(30px); transition: all 0.3s ease-in-out; } .dialog .dialog_content .Tcon .msgRow .sub + small.ok { opacity: 1; transform: translateX(0px); pointer-events: auto; } .dialog .dialog_content .Tcon .msgRow .col { float: left; display: inline-block; width: 30%; margin-right: 3%; } .dialog .dialog_content .Tcon .msgRow .col:last-child { margin-right: 0; } .dialog .dialog_content .Tcon .msgRow .col.input_con > small { font-size: 12px; display: block; color: #a6a6a6; margin-bottom: 5px; } .dialog .dialog_content .Tcon .msgRow .col.input_con > input { background-color: #f2f3f5; height: 32px; width: 100%; border: none; font-size: 14px; box-sizing: border-box; padding: 0 5px; border-radius: 5px; color: #777777; } .dialog .dialog_content .Tcon .msgRow .col.input_con > textarea { width: 100%; background-color: #f2f3f5; border-radius: 5px; border: none; height: 120px; padding: 10px; font-size: 14px; color: #777; } .dialog .dialog_content .Tcon .msgRow .col.radio_con { margin-right: 0; width: 33%; height: 32px; line-height: 32px; } .dialog .dialog_content .Tcon .msgRow .col.radio_con > span { display: inline-block; color: #000; font-weight: 100; margin-right: 8px; letter-spacing: 1px; } .dialog .dialog_content .Tcon .msgRow .col.select_con > select { background-color: #f2f3f5; height: 32px; color: #777777; line-height: 32px; font-size: 14px; width: 100%; border: none; border-radius: 5px; } .dialog .dialog_content .Tcon .msgRow .col.choose_con { display: none; } .dialog.dialog--open .dialog_mask { opacity: 1; pointer-events: auto; } .dialog.dialog--open .dialog_content { opacity: 1; pointer-events: auto; } /***********************/ /*弹性伸缩 Tan-dialogScale*/ /***********************/ .Tan-dialogScale.dialog--open .dialog_content, .Tan-dialogScale.dialog--close .dialog_content { -webkit-animation-duration: 1s; animation-duration: 1s; -webkit-animation-timing-function: linear; animation-timing-function: linear; -webkit-animation-fill-mode: forwards; animation-fill-mode: forwards; } .Tan-dialogScale.dialog--open .dialog_content { -webkit-animation-name: anim-open-2; animation-name: anim-open-2; } .Tan-dialogScale.dialog--close .dialog_content { -webkit-animation-name: anim-close-2; animation-name: anim-close-2; -webkit-animation-duration: 0.3s; animation-duration: 0.3s; -webkit-animation-timing-function: ease-out; animation-timing-function: ease-out; } @-webkit-keyframes anim-open-2 { 0% { opacity: 0; -webkit-transform: matrix3d(0.7, 0, 0, 0, 0, 0.7, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.7, 0, 0, 0, 0, 0.7, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); } 2.083333% { -webkit-transform: matrix3d(0.75266, 0, 0, 0, 0, 0.76342, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.75266, 0, 0, 0, 0, 0.76342, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); } 4.166667% { -webkit-transform: matrix3d(0.81071, 0, 0, 0, 0, 0.84545, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.81071, 0, 0, 0, 0, 0.84545, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); } 6.25% { -webkit-transform: matrix3d(0.86808, 0, 0, 0, 0, 0.9286, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.86808, 0, 0, 0, 0, 0.9286, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); } 8.333333% { -webkit-transform: matrix3d(0.92038, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.92038, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); } 10.416667% { -webkit-transform: matrix3d(0.96482, 0, 0, 0, 0, 1.05202, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.96482, 0, 0, 0, 0, 1.05202, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); } 12.5% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1.08204, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1.08204, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); } 14.583333% { -webkit-transform: matrix3d(1.02563, 0, 0, 0, 0, 1.09149, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.02563, 0, 0, 0, 0, 1.09149, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); } 16.666667% { -webkit-transform: matrix3d(1.04227, 0, 0, 0, 0, 1.08453, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.04227, 0, 0, 0, 0, 1.08453, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); } 18.75% { -webkit-transform: matrix3d(1.05102, 0, 0, 0, 0, 1.06666, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.05102, 0, 0, 0, 0, 1.06666, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); } 20.833333% { -webkit-transform: matrix3d(1.05334, 0, 0, 0, 0, 1.04355, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.05334, 0, 0, 0, 0, 1.04355, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); } 22.916667% { -webkit-transform: matrix3d(1.05078, 0, 0, 0, 0, 1.02012, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.05078, 0, 0, 0, 0, 1.02012, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); } 25% { -webkit-transform: matrix3d(1.04487, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.04487, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); } 27.083333% { -webkit-transform: matrix3d(1.03699, 0, 0, 0, 0, 0.98534, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.03699, 0, 0, 0, 0, 0.98534, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); } 29.166667% { -webkit-transform: matrix3d(1.02831, 0, 0, 0, 0, 0.97688, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.02831, 0, 0, 0, 0, 0.97688, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); } 31.25% { -webkit-transform: matrix3d(1.01973, 0, 0, 0, 0, 0.97422, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.01973, 0, 0, 0, 0, 0.97422, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); } 33.333333% { -webkit-transform: matrix3d(1.01191, 0, 0, 0, 0, 0.97618, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.01191, 0, 0, 0, 0, 0.97618, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); } 35.416667% { -webkit-transform: matrix3d(1.00526, 0, 0, 0, 0, 0.98122, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.00526, 0, 0, 0, 0, 0.98122, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); } 37.5% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 0.98773, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 0.98773, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); } 39.583333% { -webkit-transform: matrix3d(0.99617, 0, 0, 0, 0, 0.99433, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.99617, 0, 0, 0, 0, 0.99433, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); } 41.666667% { -webkit-transform: matrix3d(0.99368, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.99368, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); } 43.75% { -webkit-transform: matrix3d(0.99237, 0, 0, 0, 0, 1.00413, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.99237, 0, 0, 0, 0, 1.00413, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); } 45.833333% { -webkit-transform: matrix3d(0.99202, 0, 0, 0, 0, 1.00651, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.99202, 0, 0, 0, 0, 1.00651, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); } 47.916667% { -webkit-transform: matrix3d(0.99241, 0, 0, 0, 0, 1.00726, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.99241, 0, 0, 0, 0, 1.00726, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); } 50% { opacity: 1; -webkit-transform: matrix3d(0.99329, 0, 0, 0, 0, 1.00671, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.99329, 0, 0, 0, 0, 1.00671, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); } 52.083333% { -webkit-transform: matrix3d(0.99447, 0, 0, 0, 0, 1.00529, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.99447, 0, 0, 0, 0, 1.00529, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); } 54.166667% { -webkit-transform: matrix3d(0.99577, 0, 0, 0, 0, 1.00346, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.99577, 0, 0, 0, 0, 1.00346, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); } 56.25% { -webkit-transform: matrix3d(0.99705, 0, 0, 0, 0, 1.0016, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.99705, 0, 0, 0, 0, 1.0016, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); } 58.333333% { -webkit-transform: matrix3d(0.99822, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.99822, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); } 60.416667% { -webkit-transform: matrix3d(0.99921, 0, 0, 0, 0, 0.99884, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.99921, 0, 0, 0, 0, 0.99884, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); } 62.5% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 0.99816, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 0.99816, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); } 64.583333% { -webkit-transform: matrix3d(1.00057, 0, 0, 0, 0, 0.99795, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.00057, 0, 0, 0, 0, 0.99795, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); } 66.666667% { -webkit-transform: matrix3d(1.00095, 0, 0, 0, 0, 0.99811, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.00095, 0, 0, 0, 0, 0.99811, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); } 68.75% { -webkit-transform: matrix3d(1.00114, 0, 0, 0, 0, 0.99851, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.00114, 0, 0, 0, 0, 0.99851, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); } 70.833333% { -webkit-transform: matrix3d(1.00119, 0, 0, 0, 0, 0.99903, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.00119, 0, 0, 0, 0, 0.99903, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); } 72.916667% { -webkit-transform: matrix3d(1.00114, 0, 0, 0, 0, 0.99955, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.00114, 0, 0, 0, 0, 0.99955, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); } 75% { -webkit-transform: matrix3d(1.001, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.001, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); } 77.083333% { -webkit-transform: matrix3d(1.00083, 0, 0, 0, 0, 1.00033, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.00083, 0, 0, 0, 0, 1.00033, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); } 79.166667% { -webkit-transform: matrix3d(1.00063, 0, 0, 0, 0, 1.00052, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.00063, 0, 0, 0, 0, 1.00052, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); } 81.25% { -webkit-transform: matrix3d(1.00044, 0, 0, 0, 0, 1.00058, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.00044, 0, 0, 0, 0, 1.00058, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); } 83.333333% { -webkit-transform: matrix3d(1.00027, 0, 0, 0, 0, 1.00053, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.00027, 0, 0, 0, 0, 1.00053, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); } 85.416667% { -webkit-transform: matrix3d(1.00012, 0, 0, 0, 0, 1.00042, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.00012, 0, 0, 0, 0, 1.00042, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); } 87.5% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1.00027, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1.00027, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); } 89.583333% { -webkit-transform: matrix3d(0.99991, 0, 0, 0, 0, 1.00013, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.99991, 0, 0, 0, 0, 1.00013, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); } 91.666667% { -webkit-transform: matrix3d(0.99986, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.99986, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); } 93.75% { -webkit-transform: matrix3d(0.99983, 0, 0, 0, 0, 0.99991, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.99983, 0, 0, 0, 0, 0.99991, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); } 95.833333% { -webkit-transform: matrix3d(0.99982, 0, 0, 0, 0, 0.99985, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.99982, 0, 0, 0, 0, 0.99985, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); } 97.916667% { -webkit-transform: matrix3d(0.99983, 0, 0, 0, 0, 0.99984, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.99983, 0, 0, 0, 0, 0.99984, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); } 100% { opacity: 1; -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); } } @keyframes anim-open-2 { 0% { opacity: 0; -webkit-transform: matrix3d(0.7, 0, 0, 0, 0, 0.7, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.7, 0, 0, 0, 0, 0.7, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); } 2.083333% { -webkit-transform: matrix3d(0.75266, 0, 0, 0, 0, 0.76342, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.75266, 0, 0, 0, 0, 0.76342, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); } 4.166667% { -webkit-transform: matrix3d(0.81071, 0, 0, 0, 0, 0.84545, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.81071, 0, 0, 0, 0, 0.84545, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); } 6.25% { -webkit-transform: matrix3d(0.86808, 0, 0, 0, 0, 0.9286, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.86808, 0, 0, 0, 0, 0.9286, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); } 8.333333% { -webkit-transform: matrix3d(0.92038, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.92038, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); } 10.416667% { -webkit-transform: matrix3d(0.96482, 0, 0, 0, 0, 1.05202, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.96482, 0, 0, 0, 0, 1.05202, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); } 12.5% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1.08204, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1.08204, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); } 14.583333% { -webkit-transform: matrix3d(1.02563, 0, 0, 0, 0, 1.09149, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.02563, 0, 0, 0, 0, 1.09149, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); } 16.666667% { -webkit-transform: matrix3d(1.04227, 0, 0, 0, 0, 1.08453, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.04227, 0, 0, 0, 0, 1.08453, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); } 18.75% { -webkit-transform: matrix3d(1.05102, 0, 0, 0, 0, 1.06666, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.05102, 0, 0, 0, 0, 1.06666, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); } 20.833333% { -webkit-transform: matrix3d(1.05334, 0, 0, 0, 0, 1.04355, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.05334, 0, 0, 0, 0, 1.04355, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); } 22.916667% { -webkit-transform: matrix3d(1.05078, 0, 0, 0, 0, 1.02012, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.05078, 0, 0, 0, 0, 1.02012, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); } 25% { -webkit-transform: matrix3d(1.04487, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.04487, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); } 27.083333% { -webkit-transform: matrix3d(1.03699, 0, 0, 0, 0, 0.98534, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.03699, 0, 0, 0, 0, 0.98534, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); } 29.166667% { -webkit-transform: matrix3d(1.02831, 0, 0, 0, 0, 0.97688, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.02831, 0, 0, 0, 0, 0.97688, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); } 31.25% { -webkit-transform: matrix3d(1.01973, 0, 0, 0, 0, 0.97422, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.01973, 0, 0, 0, 0, 0.97422, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); } 33.333333% { -webkit-transform: matrix3d(1.01191, 0, 0, 0, 0, 0.97618, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.01191, 0, 0, 0, 0, 0.97618, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); } 35.416667% { -webkit-transform: matrix3d(1.00526, 0, 0, 0, 0, 0.98122, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.00526, 0, 0, 0, 0, 0.98122, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); } 37.5% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 0.98773, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 0.98773, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); } 39.583333% { -webkit-transform: matrix3d(0.99617, 0, 0, 0, 0, 0.99433, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.99617, 0, 0, 0, 0, 0.99433, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); } 41.666667% { -webkit-transform: matrix3d(0.99368, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.99368, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); } 43.75% { -webkit-transform: matrix3d(0.99237, 0, 0, 0, 0, 1.00413, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.99237, 0, 0, 0, 0, 1.00413, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); } 45.833333% { -webkit-transform: matrix3d(0.99202, 0, 0, 0, 0, 1.00651, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.99202, 0, 0, 0, 0, 1.00651, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); } 47.916667% { -webkit-transform: matrix3d(0.99241, 0, 0, 0, 0, 1.00726, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.99241, 0, 0, 0, 0, 1.00726, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); } 50% { opacity: 1; -webkit-transform: matrix3d(0.99329, 0, 0, 0, 0, 1.00671, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.99329, 0, 0, 0, 0, 1.00671, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); } 52.083333% { -webkit-transform: matrix3d(0.99447, 0, 0, 0, 0, 1.00529, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.99447, 0, 0, 0, 0, 1.00529, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); } 54.166667% { -webkit-transform: matrix3d(0.99577, 0, 0, 0, 0, 1.00346, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.99577, 0, 0, 0, 0, 1.00346, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); } 56.25% { -webkit-transform: matrix3d(0.99705, 0, 0, 0, 0, 1.0016, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.99705, 0, 0, 0, 0, 1.0016, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); } 58.333333% { -webkit-transform: matrix3d(0.99822, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.99822, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); } 60.416667% { -webkit-transform: matrix3d(0.99921, 0, 0, 0, 0, 0.99884, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.99921, 0, 0, 0, 0, 0.99884, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); } 62.5% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 0.99816, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 0.99816, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); } 64.583333% { -webkit-transform: matrix3d(1.00057, 0, 0, 0, 0, 0.99795, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.00057, 0, 0, 0, 0, 0.99795, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); } 66.666667% { -webkit-transform: matrix3d(1.00095, 0, 0, 0, 0, 0.99811, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.00095, 0, 0, 0, 0, 0.99811, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); } 68.75% { -webkit-transform: matrix3d(1.00114, 0, 0, 0, 0, 0.99851, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.00114, 0, 0, 0, 0, 0.99851, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); } 70.833333% { -webkit-transform: matrix3d(1.00119, 0, 0, 0, 0, 0.99903, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.00119, 0, 0, 0, 0, 0.99903, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); } 72.916667% { -webkit-transform: matrix3d(1.00114, 0, 0, 0, 0, 0.99955, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.00114, 0, 0, 0, 0, 0.99955, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); } 75% { -webkit-transform: matrix3d(1.001, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.001, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); } 77.083333% { -webkit-transform: matrix3d(1.00083, 0, 0, 0, 0, 1.00033, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.00083, 0, 0, 0, 0, 1.00033, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); } 79.166667% { -webkit-transform: matrix3d(1.00063, 0, 0, 0, 0, 1.00052, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.00063, 0, 0, 0, 0, 1.00052, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); } 81.25% { -webkit-transform: matrix3d(1.00044, 0, 0, 0, 0, 1.00058, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.00044, 0, 0, 0, 0, 1.00058, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); } 83.333333% { -webkit-transform: matrix3d(1.00027, 0, 0, 0, 0, 1.00053, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.00027, 0, 0, 0, 0, 1.00053, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); } 85.416667% { -webkit-transform: matrix3d(1.00012, 0, 0, 0, 0, 1.00042, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.00012, 0, 0, 0, 0, 1.00042, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); } 87.5% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1.00027, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1.00027, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); } 89.583333% { -webkit-transform: matrix3d(0.99991, 0, 0, 0, 0, 1.00013, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.99991, 0, 0, 0, 0, 1.00013, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); } 91.666667% { -webkit-transform: matrix3d(0.99986, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.99986, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); } 93.75% { -webkit-transform: matrix3d(0.99983, 0, 0, 0, 0, 0.99991, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.99983, 0, 0, 0, 0, 0.99991, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); } 95.833333% { -webkit-transform: matrix3d(0.99982, 0, 0, 0, 0, 0.99985, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.99982, 0, 0, 0, 0, 0.99985, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); } 97.916667% { -webkit-transform: matrix3d(0.99983, 0, 0, 0, 0, 0.99984, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.99983, 0, 0, 0, 0, 0.99984, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); } 100% { opacity: 1; -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); } } @-webkit-keyframes anim-close-2 { 0% { opacity: 1; } 100% { opacity: 0; -webkit-transform: scale3d(0.8, 0.8, 1); } } @keyframes anim-close-2 { 0% { opacity: 1; } 100% { opacity: 0; -webkit-transform: scale3d(0.8, 0.8, 1); transform: scale3d(0.8, 0.8, 1); } } .component { margin: 0 auto; position: relative; margin-bottom: 0.4rem; max-width: 100%; } .component > ul.itemwrap { max-width: 100%; height: 100%; position: relative; list-style: none; padding: 0; margin: 0 auto; } .component > ul.itemwrap > li { width: 100%; height: 100%; background-size: cover; background-position: center; position: absolute; top: 0; left: 0; pointer-events: none; opacity: 0; z-index: 999; } .new .component > ul.itemwrap > li::before { content: ''; width: 100%; height: 100%; display: block; background-color: rgba(0, 0, 0, .4); position: absolute; top: 0; left: 0; } #xzMap { display: none; } .service-location .Tpage .Tmid .Trow.r1 .Tcon .left .adrItem .list .daoh { display: none; } .component > ul.itemwrap > li > img { display: block; max-width: 100%; } .component > ul.itemwrap .current { opacity: 1; pointer-events: auto; z-index: 1000; } .component nav a { position: absolute; width: 50px; height: 50px; line-height: 50px; outline: none; overflow: visible; text-align: center; top: 50%; z-index: 1100; color: #fff; -webkit-transform: translateY(10px); -ms-transform: translateY(10px); transform: translateY(10px); cursor: pointer; } .component nav .moveNext { right: 0; } .component .txtChange { position: relative; height: 68px; width: 100%; } .component .txtChange > [data-txt] { opacity: 0; position: absolute; top: 0; left: 0; width: 50%; pointer-events: none; transition: all 0.4s; -webkit-perspective: 1600px; perspective: 1600px; } .component .txtChange > [data-txt].on { opacity: 1; pointer-events: auto; } .component .txtChange > [data-txt].txtHide { -webkit-animation: scaleUp 1.5s forwards cubic-bezier(0.7, 0, 0.3, 1); animation: scaleUp 1.5s forwards cubic-bezier(0.7, 0, 0.3, 1); } .component .txtChange > [data-txt].txtShow { -webkit-animation: scaleDownUp 1.5s forwards cubic-bezier(0.7, 0, 0.3, 1); animation: scaleDownUp 1.5s forwards cubic-bezier(0.7, 0, 0.3, 1); } .component-small { width: 650px; height: 290px; } .component-small > ul { width: 450px; } .component-fullwidth { width: 100%; height: 100%; margin-bottom: 0; background: #fff; } .component-fullwidth > ul { overflow: hidden; } .component-fullwidth > ul > li { overflow: hidden; background-color: #000; } .component-fullwidth > ul > li > img { height: 100%; opacity: 0.45; min-width: 100%; max-width: none; position: absolute; left: 50%; top: 50%; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); } .component-transparent { width: 900px; height: 500px; } .component-transparent > ul { width: 112px; } /* 法律声明 */ .legal-notices .legal-notices-box { width: 1100px; } .legal-notices .legal-notices-box .title { margin-top: 90px; } .legal-notices .legal-notices-box .daoyu { line-height: 1.5em; margin-top: 20px; margin-bottom: 40px; } .legal-notices .legal-notices-box p { line-height: 24px; } .legal-notices .legal-notices-box p span { display: block; } /* @1450 */ @media screen and (max-width: 1450px) { .width-1200, .width-1100 { width: 980px; } .nav .width-1200 .nav-list { width: 500px; } .nav .width-1200 .nav-list ul li { width: 100px; } .service-location .Tpage .Tmid .Trow.r1 .Tcon .left .adrItem .list > div { max-width: 370px; } .product.product-medisana .page-3 .page-3-box .page-3-right { width: 370px; } .index .index-page ul .page:nth-child(1) a .page-right img, .index .index-page ul .page:nth-child(3) a .page-right img { width: 60%; } .jidi-1 .Tpage .Tmid .right .Tcon .Trow.r4 > .picBox { right: 0; } .jidi-2 .Tpage .Tmid .right .Tcon .Trow.r1 > small { margin-top: 15px; } .jidi-2 .Tpage .Tmid .right .Tcon .Trow.r3 .Tmsg .Tlist.l2 > .child-li > p { margin: 20px 0 0; } .jidi-2 .Tpage .Tmid .right .Tcon .Trow.r3 .Tmsg .Tlist.l2 > .child-li > ul { flex-wrap: wrap; } .jidi-2 .Tpage .Tmid .right .Tcon .Trow.r3 .Tmsg .Tlist.l2 > .child-li > ul > li { width: 50%; margin: 20px 0 0 0; } .jidi-4 .Tpage .Tmid .right .Tcon .Trow.r5 .hor > li { margin: 29px; } .research #YFZX .sjz ul li .heng { width: 300px; } .research #YFZX .sjz ul li:nth-child(2) .heng { margin-left: 50px; } .research #YFTD .ab-box .text { width: 330px; } .research #YFQT .pt-tab .pt-center, .research #HJQK .pt-tab .pt-center { width: 114px; } .research #YFQT .pt-tab .pt-center .pt-heng, .research #HJQK .pt-tab .pt-center .pt-heng { width: 114px; } .research #YFZX .kuai-box .wen img { width: 80%; } .join-school .Tpage, .join-social .Tpage { margin-bottom: -80px; } .join-school .Tpage .Tmid .Tcon .list .Tmsg .workGo > .note { right: 0; bottom: 0; } .nexus .subject .tab-qun img { left: 460px; } .cooperation-agent .cooperation-agent-content #SQJM .form-box .form-div { width: 918px; } .cooperation-agent .cooperation-agent-content #PPSN .sjz-box .sjz { width: 962px; } .cooperation-agent .cooperation-agent-content #JMYS .tab-bottom ul li { width: 100%; } .cooperation-agent .cooperation-agent-content #JMDX .duix-box .tuwen .tuwen-img, .cooperation-agent .cooperation-agent-content #JMDX .duix-box .tuwen .tuwen-p { width: 424px; } .cooperation-agent .cooperation-agent-content #JMLC .liucheng ul .two { width: 90px; } .cooperation-agent .cooperation-agent-content #ZDFC .swiper-box .ditu, .cooperation-agent .cooperation-agent-content #ZDFC .swiper-box .datu { width: 500px; height: 380px; } .cooperation-agent .cooperation-agent-content #ZDFC .swiper-box .datu img { box-shadow: 30px 30px 100px #fff; } .product.product-index .product-i-box .chanpin-box { width: 1200px; } /* 明星产品 */ .product.product-yi .page-3p .pic > img { transform: scale(0.8); transform-origin: bottom; } .product.product-yi .page-6p .pic img { max-width: 550px; } .product.product-cozzia .page-5 .page-img img { transform: scale(0.8); } .product.product-fuji .page-7 .width-1200 .page-slides .page-img img { width: 400px; max-height: 310px; } .product.product-fuji .page-5 .page-img img { bottom: 50px; } } .lg { line-height: 62px; } .lg > a { display: block; margin-top: 5px; font-weight: 700; color: rgba(255, 255, 255, 0.3); } .lg > a:hover { color: #fff; } .store1 .banner .picBox { height: auto; } .ihoco_img { display: flex; justify-content: center; align-items: center; } @media screen and (max-width: 800px) { .ihoco_img { flex-wrap: wrap; } }