#index .logo-welcome { width: 100%; height: 100%; background-color: #3ca4a4; overflow: hidden; position: absolute; z-index: 10001; top: 0; left: 0; } #index .logo-welcome .img { width: 800px; height: 526px; position: absolute; animation: logo 2s; -webkit-animation: logo 2s; animation-fill-mode: forwards; top: 50%; left: 50%; margin-top: -263px; margin-left: -400px; position: relative; } #index .logo-welcome .img > i { position: absolute; display: block; animation-duration: 3s; } #index .logo-welcome .img .img01 { top: 0; left: 0; background-size: 341px 163px; width: 341px; height: 163px; background-image: url("../images/a.png"); } #index .logo-welcome .img .img02 { right: 0; top: 0; background-size: 434px 163px; width: 434px; height: 163px; background-image: url("../images/aa.png"); } #index .logo-welcome .img .img03 { left: 0; bottom: 0; background-size: 580px 338px; width: 580px; height: 338px; background-image: url("../images/aaa.png"); } #index .logo-welcome .img .img04 { right: 0; bottom: 0; background-size: 195px 339px; width: 195px; height: 339px; background-image: url("../images/aaaa.png"); } #index .index-banner { width: 100%; background-repeat: repeat-y; background-size: 100%; background-position: center; background-image: url("../images/144.png"); position: relative; } #index .index-banner .index-inner { height: 91.6666%; width: 100%; display: flex; } #index .index-banner .index-inner .left-banner { width: 91.6667%; height: 100%; } #index .index-banner .index-inner .left-banner .swiper-index { height: 100%; } #index .index-banner .index-inner .left-banner .swiper-index .swiper-slide { width: 100%; height: 100%; background-position: center; background-size: cover; background-repeat: no-repeat; position: relative; } #index .index-banner .index-inner .left-banner .swiper-index .swiper-slide > img { display: none; } #index .index-banner .index-inner .left-banner .swiper-index .swiper-slide .text-box { position: absolute; width: 470px; top: 40%; left: 18.5%; } #index .index-banner .index-inner .left-banner .swiper-index .swiper-slide .text-box img { width: 100%; } #index .index-banner .index-inner .left-banner .swiper-pagination-index { left: 3%; bottom: 90px; display: flex; flex-direction: column; } #index .index-banner .index-inner .left-banner .swiper-pagination-index .swiper-pagination-bullet { width: auto; height: auto; background-color: transparent; font-size: 20px; outline: none; position: relative; margin-bottom: 15px; } #index .index-banner .index-inner .left-banner .swiper-pagination-index .swiper-pagination-bullet:before { content: ""; position: absolute; width: 10px; height: 1px; background-color: #ccc; left: -20px; top: 15px; } #index .index-banner .index-inner .left-banner .swiper-pagination-index .swiper-pagination-bullet-active { font-size: 30px; } #index .index-banner .index-inner .left-banner .swiper-pagination-index .swiper-pagination-bullet-active:before { content: ""; position: absolute; width: 20px; height: 1px; background-color: #999; left: -30px; top: 22px; } #index .index-banner .index-inner .right-menu { width: 8.3333%; flex-shrink: 0; height: 100%; position: relative; z-index: 10000; display: block; } #index .index-banner .index-inner .right-menu .menu { width: 100%; height: 105px; background-image: url("../images/menu.png"); background-size: 32px 105px; background-repeat: no-repeat; background-position: top center; margin-top: 35px; cursor: pointer; } #index .index-banner .index-inner .right-menu .right-nav { position: absolute; bottom: 80px; right: calc(50% - 15px); } #index .index-banner .index-inner .right-menu .right-nav .items { width: 30px; height: 30px; display: block; background-size: 100%; background-repeat: no-repeat; margin-top: 30px; position: relative; } #index .index-banner .index-inner .right-menu .right-nav .items.tel { background-image: url("../images/04.png"); } #index .index-banner .index-inner .right-menu .right-nav .items.tel .phone-hover { position: absolute; left: -150px; top: -12px; color: #666; font-size: 20px; display: none; transition: all 0.6s; text-align: right; font-weight: bold; } #index .index-banner .index-inner .right-menu .right-nav .items.tel:hover .phone-hover { display: block; } #index .index-banner .index-inner .right-menu .right-nav .items.weixin { background-image: url("../images/06.png"); } #index .index-banner .index-inner .right-menu .right-nav .items.weixin .code-hover { width: 122px; position: absolute; left: -150px; display: none; } #index .index-banner .index-inner .right-menu .right-nav .items.weixin .code-hover img { width: 100%; } #index .index-banner .index-inner .right-menu .right-nav .items.weixin:hover .code-hover { display: block; } #index .index-banner .index-inner .right-menu .right-nav .items.weibo { background-image: url("../images/05.png"); } #index .index-banner .index-inner .right-menu.active { position: fixed; right: 0; } #index .index-banner .logo-position { position: absolute; left: 3%; top: 38px; z-index: 100; display: block; } #index .index-banner .logo-position .logo { width: auto; background-size: auto 100%; background-repeat: no-repeat; background-position: center; } #index .index-banner .logo-position .logo img { width: 100%; opacity: 0; } #index .index-banner .scroll-down-icon { width: 128px; height: 67px; background-repeat: no-repeat; background-size: 100%; background-image: url("../images/148.png"); position: absolute; left: calc(50% - 64px); animation: mouse infinite 0.8s; -webkit-animation: mouse infinite 0.8s; animation-direction: alternate; } #index .about-us .tops { position: relative; margin-top: 130px; margin-bottom: 130px; } #index .about-us .tops .tt { font-size: 46px; line-height: 46px; color: #333; } #index .about-us .tops .bg { width: 40%; position: absolute; right: 0; top: -10px; } #index .about-us .tops .bg img { width: 100%; } #index .about-us .about-box { display: flex; position: relative; padding-bottom: 75px; } #index .about-us .about-box .left-items { width: 65.6%; background-size: cover; background-repeat: no-repeat; background-position: center; flex-shrink: 0; position: relative; z-index: 10; } #index .about-us .about-box .left-items img { width: 100%; opacity: 0; } #index .about-us .about-box .right-items { width: 50%; background-color: #f6f6f6; padding: 120px 7% 140px 20%; position: absolute; bottom: 0; right: 0; z-index: 9; } #index .about-us .about-box .right-items .tt { font-size: 24px; color: #666; line-height: 1.8em; } #index .about-us .about-box .right-items .t1 { font-size: 32px; line-height: 32px; margin-top: 10px; } #index .about-us .about-box .right-items .info { font-size: 16px; color: #666; line-height: 2em; margin-top: 75px; } #index .about-us .about-box .right-items .more { width: 180px; height: 60px; line-height: 60px; padding-left: 0px; font-size: 18px; display: block; text-transform: uppercase; background-repeat: no-repeat; background-position: right 18px center; background-size: 23px 6px; background-image: url("../images/13.png"); transition: all 0.6s; margin-top: 80px; } #index .about-us .about-box .right-items .more:hover { background-color: #333; color: #fff; padding-left: 20px; background-image: url("../images/16.png"); } #index .display-box { width: 100%; display: flex; margin-top: 130px; margin-bottom: 140px; background-color: #f6f6f6; position: relative; } #index .display-box .display-left { width: 50%; padding-top: 85px; } #index .display-box .display-left .swiper-display-left { width: 56.25%; } #index .display-box .display-left .swiper-display-left .swiper-slide { width: 100%; } #index .display-box .display-left .swiper-display-left .swiper-slide > a { display: inline-block; width: 100%; } #index .display-box .display-left .swiper-display-left .swiper-slide .pic-box { width: 100%; margin: 0 auto; text-align: center; } #index .display-box .display-left .swiper-display-left .swiper-slide .pic-box .pic { width: 100%; background-position: center; background-size: 100% auto; background-repeat: no-repeat; position: relative; } #index .display-box .display-left .swiper-display-left .swiper-slide .pic-box .pic img { width: 100%; opacity: 0; } #index .display-box .display-left .swiper-display-left .swiper-slide .pic-box > img { margin-top: 50px; width: 244px; } #index .display-box .swiper-display-right { width: 50%; } #index .display-box .swiper-display-right .swiper-slide { width: 100%; background-size: cover; background-repeat: no-repeat; background-position: center; } #index .display-box .swiper-display-right .swiper-slide > a img { width: 100%; opacity: 0; } #index .display-box .swiper-pagination-display { bottom: -35px; text-align: center; width: 100%; } #index .display-box .swiper-pagination-display .swiper-pagination-bullet { width: 10px; height: 10px; border: 1px solid #cbcccc; margin-right: 10px; background-color: rgba(255, 255, 255, 0); opacity: 1; } #index .display-box .swiper-pagination-display .swiper-pagination-bullet-active { background-color: #231815; border: 0; } #index .news-center .tops { display: flex; justify-content: space-between; align-items: center; margin-bottom: 40px; } #index .news-center .tops .com-title-box { text-align: left; margin-top: 0; } #index .news-center .tops .news-nav { font-size: 16px; color: #666; } #index .news-center .tops .news-nav span { display: inline-block; margin-left: 60px; padding: 15px 0; cursor: pointer; position: relative; transition: all 0.6s; } #index .news-center .tops .news-nav span.active, #index .news-center .tops .news-nav span:hover { font-size: 20px; color: #333; } #index .news-center .tops .news-nav span.active:before, #index .news-center .tops .news-nav span:hover:before { content: ""; position: absolute; bottom: 5px; left: 5px; width: 90%; height: 2px; background-color: #44bcbc; } #index .news-center .pre-btn > a { width: 80px; height: 40px; line-height: 40px; text-align: center; border: 1px solid #ccc; display: inline-block; background-size: 23px 6px; background-repeat: no-repeat; background-position: center center; } #index .news-center .pre-btn > a.prev { background-image: url("../images/82.png"); } #index .news-center .pre-btn > a.prev:hover { background-image: url("../images/83.png"); background-color: #333; } #index .news-center .pre-btn > a.next { background-image: url("../images/85.png"); } #index .news-center .pre-btn > a.next:hover { background-image: url("../images/84.png"); background-color: #333; } #index .news-center .news-items { margin-left: 8.333%; margin-top: 50px; margin-bottom: 160px; position: relative; } #index .news-center .news-items .swiper-news .swiper-slide { width: 38.5% !important; } #index .news-center .news-items .swiper-news .swiper-slide .img { width: 100%; overflow: hidden; position: relative; } #index .news-center .news-items .swiper-news .swiper-slide .img img { width: 100%; transition: transform 0.5s ease-out; -webkit-transition: transform 0.5s ease-out; -moz-transition: transform 0.5s ease-out; } #index .news-center .news-items .swiper-news .swiper-slide .img .date { width: 100px; height: 100px; background-color: #f6f6f6; color: #666; font-size: 14px; position: absolute; transition: all 0.6s; z-index: 10; top: 0; left: 0; display: flex; flex-direction: column; align-items: center; padding-top: 5px; } #index .news-center .news-items .swiper-news .swiper-slide .img .date .line { width: 90px; height: 1px; background-color: #e6e6e6; margin-top: 5px; transition: width 0.6s; } #index .news-center .news-items .swiper-news .swiper-slide .img .date .t2 { font-size: 32px; line-height: 32px; margin: 5px 0; } #index .news-center .news-items .swiper-news .swiper-slide .title { font-size: 24px; line-height: 1.8em; color: #333; margin-top: 30px; } #index .news-center .news-items .swiper-news .swiper-slide .desc { font-size: 14px; color: #666; line-height: 2em; margin-top: 30px; } #index .news-center .news-items .swiper-news .swiper-slide .more { width: 180px; height: 60px; line-height: 60px; padding-left: 0px; font-size: 18px; display: block; text-transform: uppercase; background-repeat: no-repeat; background-position: right 18px center; background-size: 23px 6px; background-image: url("../images/13.png"); transition: all 0.6s; margin-top: 40px; } #index .news-center .news-items .swiper-news .swiper-slide:hover .img img { transform: scale(1.1); -webkit-transform: scale(1.1); -moz-transform: scale(1.1); } #index .news-center .news-items .swiper-news .swiper-slide:hover .img .date { background-color: #44bcbc; color: #fff; } #index .news-center .news-items .swiper-news .swiper-slide:hover .img .date .line { background-color: #fff; width: 60px; } #index .news-center .news-items .swiper-news .swiper-slide:hover .title { color: #44bcbc; } #index .news-center .news-items .swiper-news .swiper-slide:hover .more { background-color: #333; color: #fff; background-image: url("../images/16.png"); padding-left: 20px; } #index .video-display { width: 100%; height: 400px; background-image: url("../images/142.png"); background-repeat: no-repeat; background-size: cover; background-position: center; display: flex; align-items: center; justify-content: center; } #index .video-display .play { width: 56px; height: 56px; background-size: 100%; background-repeat: no-repeat; background-image: url("../images/109.png"); cursor: pointer; } #index .responsibility-box .responsibility-items { display: flex; justify-content: space-between; margin-top: 90px; } #index .responsibility-box .responsibility-items .items { width: 27%; padding-right: 3%; position: relative; display: block; } #index .responsibility-box .responsibility-items .items:after { content: ""; position: absolute; width: 1px; height: 50px; background-color: #e6e6e6; top: calc(50% - 25px); right: 0; } #index .responsibility-box .responsibility-items .items .date { font-size: 20px; color: #666; } #index .responsibility-box .responsibility-items .items .tt { font-size: 24px; line-height: 24px; margin-top: 10px; margin-bottom: 20px; transition: all 0.6s; } #index .responsibility-box .responsibility-items .items .desc { font-size: 14px; color: #666; line-height: 2em; } #index .responsibility-box .responsibility-items .items .more { width: 180px; height: 60px; line-height: 60px; padding-left: 0px; font-size: 18px; display: block; text-transform: uppercase; background-repeat: no-repeat; background-position: right 18px center; background-size: 23px 6px; background-image: url("../images/13.png"); transition: all 0.6s; margin-top: 60px; color: #999; } #index .responsibility-box .responsibility-items .items:last-of-type:after { width: 0; } #index .responsibility-box .responsibility-items .items:hover .tt { color: #44bcbc; } #index .responsibility-box .responsibility-items .items:hover .more { background-color: #333; color: #fff; padding-left: 20px; background-image: url("../images/16.png"); } #index .responsibility-box .responsibility-items .more-news { width: 180px; height: 180px; font-size: 18px; color: #fff; background-color: #44bcbc; display: flex; align-items: center; flex-direction: column; justify-content: center; } #index .responsibility-box .responsibility-items .more-news .arr { width: 23px; height: 6px; background-image: url("../images/84.png"); background-size: 100%; display: block; margin-top: 15px; } #index .join-us-box { background-color: #fafafa; margin-top: 160px; padding-right: 5%; } #index .join-us-box .join-inner { margin-left: 8.3333%; display: flex; justify-content: space-between; position: relative; top: -80px; } #index .join-us-box .join-inner .form-box { width: 34%; } #index .join-us-box .join-inner .form-box .title { font-size: 30px; color: #333; } #index .join-us-box .join-inner .form-box .form { display: flex; flex-wrap: wrap; justify-content: space-between; margin-top: 80px; } #index .join-us-box .join-inner .form-box .form .lines { width: 48%; height: 60px; display: flex; justify-content: space-between; } #index .join-us-box .join-inner .form-box .form .lines input { width: 100%; height: 100%; padding-left: 10px; border: 0; background-color: #fff; border: 1px solid rgba(68, 188, 188, 0.6); } #index .join-us-box .join-inner .form-box .form .lines.has-file { width: 100%; background-image: url("../images/14.png"); background-size: 20px 22px; background-repeat: no-repeat; background-position: right 20px center; padding-left: 10px; position: relative; background-color: #fff; border: 1px solid rgba(68, 188, 188, 0.6); } #index .join-us-box .join-inner .form-box .form .lines.has-file span { color: #999; font-size: 14px; height: 60px; line-height: 60px; display: inline-block; } #index .join-us-box .join-inner .form-box .form .lines.has-file input[type=file] { position: absolute; width: 100%; height: 100%; top: 0; left: 0; opacity: 0; } #index .join-us-box .join-inner .form-box .form .lines.has-text { width: 100%; height: 110px; border: 1px solid rgba(68, 188, 188, 0.6); } #index .join-us-box .join-inner .form-box .form .lines.has-text textarea { width: 100%; height: 100%; background-color: #fff; padding: 10px; resize: none; border: 0; } #index .join-us-box .join-inner .form-box .form .lines.has-code { width: 100%; } #index .join-us-box .join-inner .form-box .form .lines.has-code input { width: 69%; } #index .join-us-box .join-inner .form-box .form .lines.has-code .code-img { width: 150px; } #index .join-us-box .join-inner .form-box .form .lines.has-code .code-img img { width: 100%; } #index .join-us-box .join-inner .form-box .form .btn { width: 180px; height: 60px; line-height: 60px; text-align: center; color: #fff; font-size: 16px; background-color: #333; border: 0; } #index .join-us-box .join-inner .index-map { width: 59%; height: 560px; } @keyframes logo { from { opacity: 1; transform: scale(0.1); } to { opacity: 1; transform: scale(0.3); } } @keyframes bg { from { background-color: black; } to { background-color: rgba(0, 0, 0, 0); } } @keyframes mouse { from { bottom: -20px; } to { bottom: 0; } } #contact .contact-box .contact-title { display: flex; align-items: center; justify-content: center; margin-top: 50px; } #contact .contact-box .contact-title > a { display: inline-block; width: 150px; height: 50px; line-height: 50px; text-align: center; border: 1px solid #ccc; font-size: 16px; margin-left: 20px; cursor: pointer; } #contact .contact-box .contact-title > a.active { border: 1px solid #44bcbc; background-color: #44bcbc; color: #fff; } #contact .contact-box .recruit-center { margin-top: 60px; } #contact .contact-box .recruit-center .recruit-box { width: 100%; } #contact .contact-box .recruit-center .recruit-box li { margin-bottom: 20px; } #contact .contact-box .recruit-center .recruit-box li .recruit-top { width: 100%; height: 120px; padding: 0px 60px 0px 30px; background: #f5f5f5; cursor: pointer; font-size: 14px; display: flex; align-items: center; justify-content: space-between; box-sizing: border-box; transition: all 0.5s ease-out; -webkit-transition: all 0.5s ease-out; -moz-transition: all 0.5s ease-out; } #contact .contact-box .recruit-center .recruit-box li .recruit-top .left .top .name { font-size: 20px; color: #333; display: inline-block; margin-right: 40px; } #contact .contact-box .recruit-center .recruit-box li .recruit-top .left .top .time { display: inline-block; } #contact .contact-box .recruit-center .recruit-box li .recruit-top .left .top .time span { font-size: 14px; line-height: 14px; color: #999; display: inline-block; padding: 0 25px; border-left: 1px solid #999; } #contact .contact-box .recruit-center .recruit-box li .recruit-top .left .desc { margin-top: 20px; } #contact .contact-box .recruit-center .recruit-box li .recruit-top .left .desc span { font-size: 14px; color: #666; display: inline-block; margin-right: 50px; } #contact .contact-box .recruit-center .recruit-box li .recruit-top .down-icon { width: 30px; height: 30px; display: block; background-repeat: no-repeat; background-image: url("../images/27.png"); background-size: 30px 30px; } #contact .contact-box .recruit-center .recruit-box li .recruit-top:hover, #contact .contact-box .recruit-center .recruit-box li .recruit-top.active { background: #44bcbc; } #contact .contact-box .recruit-center .recruit-box li .recruit-top:hover .top .name, #contact .contact-box .recruit-center .recruit-box li .recruit-top.active .top .name { color: #fff; } #contact .contact-box .recruit-center .recruit-box li .recruit-top:hover .top .time span, #contact .contact-box .recruit-center .recruit-box li .recruit-top.active .top .time span { color: #fff; border-left: 1px solid #fff; } #contact .contact-box .recruit-center .recruit-box li .recruit-top:hover .desc span, #contact .contact-box .recruit-center .recruit-box li .recruit-top.active .desc span { color: #fff; } #contact .contact-box .recruit-center .recruit-box li .recruit-top:hover .down-icon, #contact .contact-box .recruit-center .recruit-box li .recruit-top.active .down-icon { background-image: url("../images/26.png"); } #contact .contact-box .recruit-center .recruit-box li .recruit-content { width: 100%; padding: 0px 24px 30px 24px; box-sizing: border-box; background: #f5f5f5; display: none; } #contact .contact-box .recruit-center .recruit-box li .recruit-content .t1 { color: #333; font-size: 14px; padding-bottom: 10px; padding-top: 25px; font-weight: bold; } #contact .contact-box .recruit-center .recruit-box li .recruit-content .content p { line-height: 2.5em; color: #333; font-size: 14px; } #contact .contact-box .recruit-center .recruit-box li .recruit-content .join-in { width: 145px; height: 60px; line-height: 60px; color: #fff; display: inline-block; font-size: 16px; text-align: center; background: #333; margin-top: 25px; } #contact .contact-box .contact-form .form-box { width: 53%; max-width: 1020px; margin: 0 auto; } #contact .contact-box .contact-form .form-box form { display: flex; flex-wrap: wrap; justify-content: space-between; } #contact .contact-box .contact-form .form-box form .lines { width: 49%; } #contact .contact-box .contact-form .form-box form .lines .label { font-size: 24px; line-height: 24px; height: 24px; color: #333; margin-bottom: 20px; } #contact .contact-box .contact-form .form-box form .lines .input-box { font-size: 16px; color: #999; height: 60px; background-color: #fafafa; } #contact .contact-box .contact-form .form-box form .lines .input-box .select-box { width: 100%; height: 100%; line-height: 60px; background-image: url("../images/37.png"); background-position: right 25px center; background-size: 14px 10px; background-repeat: no-repeat; } #contact .contact-box .contact-form .form-box form .lines .input-box .select-box select { border: 0; background-color: transparent; width: 100%; height: 100%; padding-left: 20px; } #contact .contact-box .contact-form .form-box form .lines .input-box .load-box { width: 100%; height: 100%; line-height: 60px; background-color: #fafafa; padding-left: 20px; background-repeat: no-repeat; background-position: right 25px center; background-image: url("../images/14.png"); background-size: 20px 22px; position: relative; } #contact .contact-box .contact-form .form-box form .lines .input-box .load-box input[type=file] { position: absolute; top: 0; left: 0; width: 100%; height: 100%; opacity: 0; } #contact .contact-box .contact-form .form-box form .lines .input-box > input { width: 100%; height: 100%; background-color: transparent; padding-left: 20px; border: 0; } #contact .contact-box .contact-form .form-box form .lines.has-text { width: 100%; } #contact .contact-box .contact-form .form-box form .lines.has-text .input-box { height: 200px; } #contact .contact-box .contact-form .form-box form .lines.has-text .input-box textarea { width: 100%; height: 100%; padding: 20px; border: 0; background-color: transparent; resize: none; } #contact .contact-box .contact-form .form-box form .lines.has-code { width: 100%; display: flex; align-items: center; position: relative; } #contact .contact-box .contact-form .form-box form .lines.has-code .left { display: flex; align-items: center; width: 100%; height: 100%; } #contact .contact-box .contact-form .form-box form .lines.has-code .left .input-box { width: 50%; } #contact .contact-box .contact-form .form-box form .lines.has-code .left .code-img { height: 100%; margin-left: 20px; border: 1px solid #e6e6e6; } #contact .contact-box .contact-form .form-box form .lines.has-code .btn { width: 180px; height: 100%; background-color: #333; line-height: 60px; text-align: center; font-size: 16px; color: #fff; position: absolute; top: 0; right: 0; border: 0; } #contact .contact-box .contact-form .form-box form .lines.has-input { width: 100%; } #contact .contact-box .contact-form .form-box form .lines.has-address { width: 33%; } #contact .contact-box .contact-form .map-box { width: 100%; height: 400px; margin: 90px 0; } #responsibility .public-welfare .welfare-box { width: 100%; margin-top: 40px; } #responsibility .public-welfare .welfare-box .welfare-items { display: flex; padding: 40px 0; transition: all 0.6s; position: relative; border-bottom: 1px solid #e6e6e6; } #responsibility .public-welfare .welfare-box .welfare-items:after { content: ""; position: absolute; width: 0; height: 2px; bottom: -1px; left: 0; background-color: #5abca3; transition: all 0.6s; } #responsibility .public-welfare .welfare-box .welfare-items .left-items { width: 50%; display: flex; align-items: center; justify-content: space-between; } #responsibility .public-welfare .welfare-box .welfare-items .left-items .date { text-align: center; width: 25%; } #responsibility .public-welfare .welfare-box .welfare-items .left-items .date .t1 { font-size: 46px; line-height: 46px; color: #34363a; } #responsibility .public-welfare .welfare-box .welfare-items .left-items .date .t2 { color: #333; font-size: 23px; margin-top: 10px; } #responsibility .public-welfare .welfare-box .welfare-items .left-items .pic { width: 75%; flex-shrink: 0; overflow: hidden; } #responsibility .public-welfare .welfare-box .welfare-items .left-items .pic img { width: 100%; transition: transform 0.5s ease-out; -webkit-transition: transform 0.5s ease-out; -moz-transition: transform 0.5s ease-out; } #responsibility .public-welfare .welfare-box .welfare-items .right-items { width: 50%; padding-left: 4%; padding-top: 50px; padding-right: 10px; } #responsibility .public-welfare .welfare-box .welfare-items .right-items .title { font-size: 24px; line-height: 24px; color: #333; } #responsibility .public-welfare .welfare-box .welfare-items .right-items .info { font-size: 16px; color: #666; line-height: 2em; margin-top: 20px; } #responsibility .public-welfare .welfare-box .welfare-items .right-items .more { width: 180px; height: 60px; line-height: 60px; padding-left: 0px; font-size: 18px; display: block; text-transform: uppercase; background-repeat: no-repeat; background-position: right 18px center; background-size: 23px 6px; background-image: url("../images/13.png"); transition: all 0.6s; margin-top: 75px; } #responsibility .public-welfare .welfare-box .welfare-items:hover { background-color: #f6f6f6; } #responsibility .public-welfare .welfare-box .welfare-items:hover:after { width: 100%; } #responsibility .public-welfare .welfare-box .welfare-items:hover .left-items .pic img { transform: scale(1.1); -webkit-transform: scale(1.1); -moz-transform: scale(1.1); } #responsibility .public-welfare .welfare-box .welfare-items:hover .right-items .title { color: #44bcbc; } #responsibility .public-welfare .welfare-box .welfare-items:hover .right-items .more { background-color: #333; color: #fff; padding-left: 20px; background-image: url("../images/16.png"); } #search .search-store { margin-top: 160px; } #search .search-store .title { font-size: 30px; line-height: 30px; text-align: center; } #search .search-store .search-select { display: flex; align-items: center; justify-content: center; margin-top: 48px; } #search .search-store .search-select .select-box { width: 274px; height: 54px; border: 1px solid #ccc; background-image: url("../images/37.png"); background-size: 14px 10px; background-repeat: no-repeat; background-position: right 20px center; } #search .search-store .search-select .select-box select { width: 100%; height: 100%; border: 0; padding-left: 20px; background-color: transparent; } #search .search-store .store-box { margin-top: 75px; margin-bottom: 170px; } #search .search-store .store-box .center { display: flex; } #search .search-store .store-box .center .store-pic { width: 69%; background-size: cover; background-position: center; background-repeat: no-repeat; } #search .search-store .store-box .center .store-pic img { width: 100%; opacity: 0; } #search .search-store .store-box .center .store-items { width: 31%; background-color: #f9f9f9; } #search .search-store .store-box .center .store-items .s-items { height: 130px; padding-left: 35px; display: flex; align-items: center; transition: all 0.6s; border-bottom: 1px solid #e6e6e6; } #search .search-store .store-box .center .store-items .s-items .pic { width: 53px; background-image: url("../images/39.png"); background-repeat: no-repeat; background-position: center; background-size: cover; } #search .search-store .store-box .center .store-items .s-items .pic img { width: 100%; opacity: 0; } #search .search-store .store-box .center .store-items .s-items .info { margin-left: 20px; } #search .search-store .store-box .center .store-items .s-items .info .t1 { font-size: 24px; } #search .search-store .store-box .center .store-items .s-items .info .t2 { font-size: 16px; } #search .search-store .store-box .center .store-items .s-items.active, #search .search-store .store-box .center .store-items .s-items:hover { color: #fff; background-color: #44bcbc; border: 0; } #search .search-store .store-box .center .store-items .s-items.active .pic, #search .search-store .store-box .center .store-items .s-items:hover .pic { background-image: url("../images/40.png"); } #search .search-store .store-box .center .store-items .s-items:last-of-type { border: 0; } #brand .brand-items { display: flex; justify-content: space-between; margin-top: 90px; margin-bottom: 140px; } #brand .brand-items .b-items { width: 31%; border: 1px solid #e6e6e6; display: flex; align-items: center; flex-direction: column; padding-top: 130px; padding-bottom: 50px; transition: all 0.6s; } #brand .brand-items .b-items .img { width: 234px; background-size: cover; background-repeat: no-repeat; } #brand .brand-items .b-items .img img { width: 100%; opacity: 0; } #brand .brand-items .b-items .tt { font-size: 24px; } #brand .brand-items .b-items .link { padding: 0 15px; max-width: 370px; background-color: #333; margin-top: 25px; margin-bottom: 130px; color: #fff; font-size: 24px; } #brand .brand-items .b-items .enter { text-align: center; } #brand .brand-items .b-items .enter .icon { width: 60px; background-repeat: no-repeat; background-size: 100%; background-image: url("../images/49.png"); } #brand .brand-items .b-items .enter .icon img { width: 100%; opacity: 0; } #brand .brand-items .b-items .enter .text { font-size: 18px; color: #999; margin-top: 10px; } #brand .brand-items .b-items:hover, #brand .brand-items .b-items.active { background-color: #333333; box-shadow: 0px 20px 20px 0px rgba(0, 0, 0, 0.1); } #brand .brand-items .b-items:hover .tt, #brand .brand-items .b-items.active .tt { color: #fff; } #brand .brand-items .b-items:hover .link, #brand .brand-items .b-items.active .link { background-color: #fff; color: #333; } #brand .brand-items .b-items:hover .enter .icon, #brand .brand-items .b-items.active .enter .icon { background-image: url("../images/50.png") !important; } #brand .brand-items .b-items:hover .enter .text, #brand .brand-items .b-items.active .enter .text { color: #fff; } #brand .brand-items .b-items:hover.items01 .img, #brand .brand-items .b-items.active.items01 .img { background-image: url("../images/44.png") !important; } #brand .brand-items .b-items:hover.items02 .img, #brand .brand-items .b-items.active.items02 .img { background-image: url("../images/45.png") !important; } #brand .brand-items .b-items:hover.items03 .img, #brand .brand-items .b-items.active.items03 .img { background-image: url("../images/46.png") !important; } #visited .visited-box .visit-access { margin-top: 100px; margin-bottom: 120px; } #visited .visited-box .visit-access .tops { display: flex; align-items: flex-start; margin-bottom: 70px; } #visited .visited-box .visit-access .tops .left { position: relative; width: 27.5%; flex-shrink: 0; } #visited .visited-box .visit-access .tops .left .com-title-box { text-align: left; margin-top: 0; } #visited .visited-box .visit-access .tops .left:after { content: ""; position: absolute; right: 0; top: 20px; width: 1px; height: 40px; background-color: #e6e6e6; } #visited .visited-box .visit-access .tops .right { padding-left: 8%; font-size: 16px; color: #333; line-height: 1.8em; } #visited .visited-box .visit-access .appointment { display: flex; } #visited .visited-box .visit-access .appointment .pic { width: 82%; background-repeat: no-repeat; background-size: cover; background-image: url("../images/52.png"); } #visited .visited-box .visit-access .appointment .pic img { width: 100%; opacity: 0; } #visited .visited-box .visit-access .appointment .info { padding: 50px 0 0 40px; background-color: #44bcbc; width: 18%; color: #fff; position: relative; background-image: url("../images/51.png"); background-repeat: no-repeat; background-position: right -20px bottom; background-size: 158px 158px; display: inline-block; } #visited .visited-box .visit-access .appointment .info .t1 { font-size: 32px; } #visited .visited-box .visit-access .appointment .info .t2 { font-size: 24px; } #visited .visited-box .visit-access .appointment .info .arr { display: inline-block; position: absolute; width: 23px; height: 6px; background-image: url("../images/16.png"); background-size: 100%; background-repeat: no-repeat; bottom: 40px; left: 60px; } #visited .visited-box .history-tour .com-title-box { margin-top: 0; padding-top: 80px; height: 350px; background-color: #efefef; } #visited .visited-box .history-tour .history-items { margin-top: -90px; display: flex; flex-wrap: wrap; } #visited .visited-box .history-tour .history-items .h-items { display: block; width: 31%; margin-bottom: 40px; margin-right: 3.5%; } #visited .visited-box .history-tour .history-items .h-items .img { width: 100%; overflow: hidden; } #visited .visited-box .history-tour .history-items .h-items .img img { width: 100%; transition: transform 0.5s ease-out; -webkit-transition: transform 0.5s ease-out; -moz-transition: transform 0.5s ease-out; } #visited .visited-box .history-tour .history-items .h-items .info-box { margin-top: 20px; } #visited .visited-box .history-tour .history-items .h-items .info-box .date { color: #999; font-size: 20px; } #visited .visited-box .history-tour .history-items .h-items .info-box .title { font-size: 24px; } #visited .visited-box .history-tour .history-items .h-items .info-box .desc { color: #666; font-size: 16px; line-height: 2em; margin-top: 20px; } #visited .visited-box .history-tour .history-items .h-items .info-box .more { width: 180px; height: 60px; line-height: 60px; padding-left: 0px; font-size: 18px; display: block; text-transform: uppercase; background-repeat: no-repeat; background-position: right 18px center; background-size: 23px 6px; background-image: url("../images/13.png"); transition: all 0.6s; margin-top: 20px; } #visited .visited-box .history-tour .history-items .h-items:hover .img img { transform: scale(1.2); -webkit-transform: scale(1.2); -moz-transform: scale(1.2); } #visited .visited-box .history-tour .history-items .h-items:hover .more { background-color: #333; color: #fff; background-image: url("../images/16.png"); padding-left: 20px; } #visited .visited-box .history-tour .history-items .h-items:hover .info-box .title { color: #44bcbc; } #visited .visited-box .history-tour .history-items .h-items:nth-of-type(3n) { margin-right: 0; } #news .news-box .news-content { display: flex; flex-wrap: wrap; justify-content: space-between; margin-top: 60px; } #news .news-box .news-content .top-items { width: 100%; display: flex; flex-wrap: wrap; justify-content: space-between; margin-bottom: 40px; } #news .news-box .news-content .top-items .n-items { width: 65.5%; margin-bottom: 0; } #news .news-box .news-content .top-items .right { width: 31%; } #news .news-box .news-content .top-items .right .half-items { width: 100%; } #news .news-box .news-content .bottom-items { width: 100%; } #news .news-box .news-content .n-items { display: inline-block; width: 100%; padding-bottom: 20px; border-bottom: 1px solid #e6e6e6; position: relative; float: left; } #news .news-box .news-content .n-items:after { content: ""; width: 0; height: 2px; background-color: #44bcbc; position: absolute; bottom: -1px; left: 0; transition: all 0.6s; } #news .news-box .news-content .n-items .img { width: 100%; overflow: hidden; } #news .news-box .news-content .n-items .img img { width: 100%; transition: transform 0.5s ease-out; -webkit-transition: transform 0.5s ease-out; -moz-transition: transform 0.5s ease-out; } #news .news-box .news-content .n-items .info-box { margin-top: 30px; } #news .news-box .news-content .n-items .info-box .date { color: #fff; font-size: 24px; background-color: #333; padding: 0px 10px; display: inline-block; margin-bottom: 10px; } #news .news-box .news-content .n-items .info-box .date .year { font-size: 16px; margin-left: 10px; } #news .news-box .news-content .n-items .info-box .title { font-size: 24px; } #news .news-box .news-content .n-items .info-box .desc { color: #666; font-size: 16px; line-height: 2em; margin-top: 10px; } #news .news-box .news-content .n-items .info-box .more { width: 160px; height: 40px; line-height: 40px; padding-left: 0px; font-size: 16px; display: block; text-transform: uppercase; background-repeat: no-repeat; background-position: right 18px center; background-size: 23px 6px; background-image: url("../images/13.png"); transition: all 0.6s; margin-top: 20px; color: #999; } #news .news-box .news-content .n-items:hover .img img { transform: scale(1.2); -webkit-transform: scale(1.2); -moz-transform: scale(1.2); } #news .news-box .news-content .n-items:hover .more { background-color: #333; color: #fff; padding-left: 15px; background-image: url("../images/16.png"); } #news .news-box .news-content .n-items:hover .info-box .title { color: #44bcbc; } #news .news-box .news-content .n-items:nth-of-type(3n) { margin-right: 0; } #news .news-box .news-content .n-items:hover:after { width: 100%; } #news .news-box .news-detail { margin-top: 120px; margin-bottom: 60px; display: flex; justify-content: space-between; } #news .news-box .news-detail .left-items { width: 65.5%; } #news .news-box .news-detail .left-items .title-box { padding-bottom: 20px; border-bottom: 1px solid #e6e6e6; } #news .news-box .news-detail .left-items .title-box .title { font-size: 30px; font-weight: bold; line-height: 30px; } #news .news-box .news-detail .left-items .title-box .desc { font-size: 16px; color: #999; margin-top: 20px; } #news .news-box .news-detail .left-items .title-box .desc span { margin-right: 20px; } #news .news-box .news-detail .left-items .content { font-size: 14px; margin-top: 40px; } #news .news-box .news-detail .left-items .content p { line-height: 1.8em; } #news .news-box .news-detail .left-items .content img { max-width: 100%; } #news .news-box .news-detail .left-items .content table { border: 1px solid #ccc; } #news .news-box .news-detail .left-items .content table tr, #news .news-box .news-detail .left-items .content table td { border: 1px solid #ccc; } #news .news-box .news-detail .right-items { width: 31%; } #news .news-box .news-detail .right-items .p-items { background-color: #f6f6f6; width: 100%; padding: 30px 50px 10px 30px; display: block; } #news .news-box .news-detail .right-items .p-items .info-box .text { font-size: 18px; } #news .news-box .news-detail .right-items .p-items .info-box .date { color: #fff; font-size: 24px; background-color: #333; padding: 0px 10px; display: inline-block; margin-bottom: 10px; margin-top: 15px; } #news .news-box .news-detail .right-items .p-items .info-box .date .year { font-size: 16px; margin-left: 10px; } #news .news-box .news-detail .right-items .p-items .info-box .title { font-size: 24px; } #news .news-box .news-detail .right-items .p-items .info-box .desc { color: #666; font-size: 16px; line-height: 2em; margin-top: 20px; } #news .news-box .news-detail .right-items .p-items .info-box .more { width: 160px; height: 50px; line-height: 50px; padding-left: 0px; font-size: 18px; display: block; text-transform: uppercase; background-repeat: no-repeat; background-position: right 15px center; background-size: 23px 6px; background-image: url("../images/13.png"); transition: all 0.6s; margin-top: 20px; color: #999; } #news .news-box .news-detail .right-items .p-items:hover .more { background-color: #333; color: #fff; padding-left: 10px; background-image: url("../images/16.png"); } #about .group-founder { margin-top: 300px; margin-bottom: 110px; position: relative; height: 560px; display: flex; } #about .group-founder .left-box { background-color: #f6f6f6; width: 78%; flex-shrink: 0; } #about .group-founder .right-box { width: 22%; } #about .group-founder .group-position { position: absolute; width: 100%; left: 0; top: -160px; } #about .group-founder .group-position .center { display: flex; justify-content: space-between; } #about .group-founder .group-position .left-items { width: 65.5%; } #about .group-founder .group-position .left-items .com-title-box { text-align: left; margin-top: 0; } #about .group-founder .group-position .left-items .desc-box { margin-top: 120px; } #about .group-founder .group-position .left-items .desc-box .name { font-size: 30px; font-weight: bold; } #about .group-founder .group-position .left-items .desc-box .desc { font-size: 16px; color: #666; margin-top: 10px; line-height: 1.8em; } #about .group-founder .group-position .left-items .desc-box .intro-box { display: flex; margin-top: 40px; justify-content: space-between; } #about .group-founder .group-position .left-items .desc-box .intro-box .intro-items { width: 23%; border: 1px solid #e6e6e6; padding: 30px 25px; text-align: center; cursor: pointer; transition: all 0.6s; } #about .group-founder .group-position .left-items .desc-box .intro-box .intro-items .year { font-size: 54px; line-height: 54px; position: relative; } #about .group-founder .group-position .left-items .desc-box .intro-box .intro-items .year:after { content: ""; position: absolute; bottom: 0; left: calc(50% - 65px); width: 130px; height: 9px; border-radius: 2px; background-color: rgba(153, 153, 153, 0.3); } #about .group-founder .group-position .left-items .desc-box .intro-box .intro-items .t1 { font-size: 20px; font-weight: bold; margin-top: 20px; margin-bottom: 15px; } #about .group-founder .group-position .left-items .desc-box .intro-box .intro-items .t2 { font-size: 16px; color: #666; line-height: 1.8em; } #about .group-founder .group-position .left-items .desc-box .intro-box .intro-items:hover { background-color: #44bcbc; color: #fff; } #about .group-founder .group-position .left-items .desc-box .intro-box .intro-items:hover .year:after { background-color: rgba(255, 255, 255, 0.3); } #about .group-founder .group-position .left-items .desc-box .intro-box .intro-items:hover .t2 { color: #fff; } #about .group-founder .group-position .right-items { width: 31%; background-position: center center; background-size: cover; background-repeat: no-repeat; } #about .group-founder .group-position .right-items img { width: 100%; opacity: 0; } #about .business-history { width: 100%; height: 900px; background-image: url("../images/78.png"); background-repeat: no-repeat; background-size: cover; background-position: center; padding-top: 80px; position: relative; } #about .business-history img { width: 100%; opacity: 0; } #about .business-history .history-position { position: absolute; top: 0; left: 0; width: 100%; height: 100%; padding-top: 90px; } #about .business-history .history-position .com-title-box { margin-top: 0; color: #fff; } #about .business-history .history-position .history-box .history-tops { position: relative; } #about .business-history .history-position .history-box .history-tops:after { content: ""; position: absolute; bottom: 30px; left: 0; width: 100%; height: 9px; background-image: url("../images/151.png"); background-repeat: no-repeat; background-position: center; background-size: 100% 9px; } #about .business-history .history-position .history-box .history-tops .swiper-history-date { width: 83.3333%; max-width: 1600px; position: relative; margin: 0 auto; margin-top: 120px; padding-bottom: 30px; } #about .business-history .history-position .history-box .history-tops .swiper-history-date .swiper-slide { width: 19% !important; cursor: pointer; } #about .business-history .history-position .history-box .history-tops .swiper-history-date .swiper-slide .t2:after { content: ""; position: absolute; width: 30px; height: 30px; background-image: url("../images/75.png"); border-radius: 50%; background-repeat: no-repeat; background-position: center; background-size: 100%; bottom: -40px; left: calc(50% - 20px); transition: all 0.6s; opacity: 0; } #about .business-history .history-position .history-box .history-tops .swiper-history-date .swiper-slide .text-box { color: #ccc; display: flex; align-items: flex-start; text-align: center; flex-direction: column; padding-bottom: 30px; position: relative; } #about .business-history .history-position .history-box .history-tops .swiper-history-date .swiper-slide .text-box .t1 { font-size: 36px; line-height: 36px; width: 80px; } #about .business-history .history-position .history-box .history-tops .swiper-history-date .swiper-slide .text-box .t2 { font-size: 20px; line-height: 20px; margin-top: 15px; width: 80px; position: relative; } #about .business-history .history-position .history-box .history-tops .swiper-history-date .swiper-slide.swiper-slide-thumb-active .t1 { color: #44bcbc; } #about .business-history .history-position .history-box .history-tops .swiper-history-date .swiper-slide.swiper-slide-thumb-active .t2 { color: #44bcbc; } #about .business-history .history-position .history-box .history-tops .swiper-history-date .swiper-slide.swiper-slide-thumb-active .t2:after { background-image: url("../images/161.png"); opacity: 1; } #about .business-history .history-position .history-box .swiper-history-text { width: 83.3333%; max-width: 1600px; position: relative; margin: 0 auto; padding-left: 3.8%; } #about .business-history .history-position .history-box .swiper-history-text .swiper-wrapper { margin-left: -18.8%; } #about .business-history .history-position .history-box .swiper-history-text .swiper-slide { width: 62.5%; display: flex; position: relative; } #about .business-history .history-position .history-box .swiper-history-text .swiper-slide .pic { width: 50%; height: 100%; background-image: url("../images/76.png"); background-size: cover; background-position: center; background-repeat: no-repeat; flex-shrink: 0; float: left; } #about .business-history .history-position .history-box .swiper-history-text .swiper-slide .pic img { width: 100%; opacity: 0; } #about .business-history .history-position .history-box .swiper-history-text .swiper-slide .text-box { width: 50%; background-image: url("../images/150.png"); background-size: cover; background-position: center; background-repeat: no-repeat; padding-top: 70px; padding-left: 4%; transition: all 0.6s; float: left; } #about .business-history .history-position .history-box .swiper-history-text .swiper-slide .text-box .title { font-size: 40px; line-height: 40px; position: relative; } #about .business-history .history-position .history-box .swiper-history-text .swiper-slide .text-box .title:before { content: ""; position: absolute; width: 60px; height: 1px; background-color: #999; top: 20px; left: -70px; } #about .business-history .history-position .history-box .swiper-history-text .swiper-slide .text-box .info { font-size: 16px; color: #333; margin-top: 20px; line-height: 1.8em; padding-right: 10px; height: 140px; overflow-y: auto; } #about .business-history .history-position .history-box .swiper-history-text .swiper-slide .mask { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.7); transition: all 0.3s; } #about .business-history .history-position .history-box .swiper-history-text .swiper-slide.ani-slide .mask { background-color: rgba(0, 0, 0, 0); } #about .business-history .history-position .history-box .swiper-history-text .swiper-slide.ani-slide .text-box .title { color: #44bcbc; } #about .business-history .history-position .history-box .swiper-history-text .history-prevNext { width: 100%; left: 0; height: 50px; z-index: 100; position: absolute; top: calc(50% - 30px); } #about .business-history .history-position .history-box .swiper-history-text .history-prevNext .prev { width: 60px; height: 60px; background-image: url("../images/74.png"); background-size: 100%; background-repeat: no-repeat; background-position: center; display: block; left: 0; transform: rotate(180deg); position: absolute; } #about .business-history .history-position .history-box .swiper-history-text .history-prevNext .next { width: 60px; height: 60px; background-image: url("../images/74.png"); background-size: 100%; background-repeat: no-repeat; background-position: center; display: block; left: 65.3%; position: absolute; } #about .group-honor { padding-top: 110px; margin-bottom: 120px; } #about .group-honor .tops { display: flex; justify-content: space-between; } #about .group-honor .tops .com-title-box { text-align: left; margin-top: 0; } #about .group-honor .tops .pre-btn > a { width: 150px; height: 50px; line-height: 50px; text-align: center; border: 1px solid #ccc; display: inline-block; background-size: 23px 6px; background-repeat: no-repeat; background-position: center center; } #about .group-honor .tops .pre-btn > a.prev { background-image: url("../images/82.png"); } #about .group-honor .tops .pre-btn > a.prev:hover { background-image: url("../images/83.png"); background-color: #333; } #about .group-honor .tops .pre-btn > a.next { background-image: url("../images/85.png"); } #about .group-honor .tops .pre-btn > a.next:hover { background-image: url("../images/84.png"); background-color: #333; } #about .group-honor .swiper-box { margin-top: 30px; } #about .group-honor .swiper-box .swiper-honor .swiper-slide { padding: 30px 30px 30px 25px; } #about .group-honor .swiper-box .swiper-honor .swiper-slide .pic { width: 60px; } #about .group-honor .swiper-box .swiper-honor .swiper-slide .pic img { width: 100%; } #about .group-honor .swiper-box .swiper-honor .swiper-slide .date { font-size: 20px; color: #fff; padding: 0 10px; background-color: #333; margin-top: 30px; display: inline-block; } #about .group-honor .swiper-box .swiper-honor .swiper-slide .text { font-size: 28px; line-height: 28px; margin: 20px 0; } #about .group-honor .swiper-box .swiper-honor .swiper-slide .desc { padding-left: 30px; background-position: left center; background-size: 20px 20px; background-repeat: no-repeat; line-height: 2em; font-size: 18px; color: #666; } #about .group-honor .swiper-box .swiper-honor .swiper-slide .desc.desc01 { background-image: url("../images/80.png"); } #about .group-honor .swiper-box .swiper-honor .swiper-slide .desc.desc02 { background-image: url("../images/81.png"); } #about .group-honor .swiper-box .swiper-honor .swiper-slide.swiper-slide-active { background-color: #f6f6f6; border-bottom: 2px solid #44bcbc; } #about .culture-bg { background-color: #f6f6f6; position: relative; height: 610px; } #about .company-culture { width: 100%; margin-top: -600px; } #about .company-culture .tops { display: flex; justify-content: space-between; padding-top: 100px; } #about .company-culture .tops .com-title-box { text-align: left; margin-top: 0; } #about .company-culture .tops .pre-btn > a { width: 150px; height: 50px; line-height: 50px; text-align: center; border: 1px solid #ccc; display: inline-block; background-size: 23px 6px; background-repeat: no-repeat; background-position: center center; } #about .company-culture .tops .pre-btn > a.prev { background-image: url("../images/82.png"); } #about .company-culture .tops .pre-btn > a.prev:hover { background-image: url("../images/83.png"); background-color: #333; } #about .company-culture .tops .pre-btn > a.next { background-image: url("../images/85.png"); } #about .company-culture .tops .pre-btn > a.next:hover { background-image: url("../images/84.png"); background-color: #333; } #about .company-culture .swiper-box { margin-left: 8.3333%; margin-top: 80px; } #about .company-culture .swiper-box .swiper-culture .swiper-slide { width: auto !important; height: 100%; background-size: cover; background-repeat: no-repeat; background-position: center center; position: relative; } #about .company-culture .swiper-box .swiper-culture .swiper-slide img { width: auto; opacity: 0; } #about .company-culture .swiper-box .swiper-culture .swiper-slide .info { color: #fff; position: absolute; left: 40px; bottom: 45px; } #about .company-culture .swiper-box .swiper-culture .swiper-slide .info .t1 { font-size: 28px; line-height: 28px; } #about .company-culture .swiper-box .swiper-culture .swiper-slide .info .t2 { font-size: 20px; margin-top: 20px; margin-bottom: 30px; } #about .company-culture .swiper-box .swiper-culture .swiper-slide .info .line { width: 24px; height: 2px; background-color: #fff; } #about .value-box { margin-bottom: 100px; } #about .value-box .swiper-slide { position: relative; padding: 90px 30px; display: flex; flex-direction: column; align-items: center; justify-content: center; cursor: pointer; } #about .value-box .swiper-slide .img { width: 115px; height: 115px; border-radius: 50%; transition: all 0.6s; background-size: 100%; background-repeat: no-repeat; background-position: center center; } #about .value-box .swiper-slide .img.img01 { background-image: url("../images/v1.png"); } #about .value-box .swiper-slide .img.img02 { background-image: url("../images/v3.png"); } #about .value-box .swiper-slide .img.img03 { background-image: url("../images/v5.png"); } #about .value-box .swiper-slide .img.img04 { background-image: url("../images/v7.png"); } #about .value-box .swiper-slide .img.img05 { background-image: url("../images/v9.png"); } #about .value-box .swiper-slide .img.img06 { background-image: url("../images/v11.png"); } #about .value-box .swiper-slide .img.img07 { background-image: url("../images/v13.png"); } #about .value-box .swiper-slide .img.img08 { background-image: url("../images/v15.png"); } #about .value-box .swiper-slide .img.img09 { background-image: url("../images/v17.png"); } #about .value-box .swiper-slide .img.img10 { background-image: url("../images/v19.png"); } #about .value-box .swiper-slide .t1 { font-size: 14px; color: #999; margin-top: 25px; } #about .value-box .swiper-slide .t2 { font-size: 24px; line-height: 24px; margin-top: 10px; } #about .value-box .swiper-slide .info { font-size: 14px; color: #666; line-height: 1.8em; margin-top: 20px; text-align: center; } #about .value-box .swiper-slide:after { content: ""; position: absolute; width: 1px; height: 70px; background-color: #e6e6e6; top: 175px; left: 0; } #about .value-box .swiper-slide:hover .img01 { background-image: url("../images/v2.png"); } #about .value-box .swiper-slide:hover .img02 { background-image: url("../images/v4.png"); } #about .value-box .swiper-slide:hover .img03 { background-image: url("../images/v6.png"); } #about .value-box .swiper-slide:hover .img04 { background-image: url("../images/v8.png"); } #about .value-box .swiper-slide:hover .img05 { background-image: url("../images/v10.png"); } #about .value-box .swiper-slide:hover .img06 { background-image: url("../images/v12.png"); } #about .value-box .swiper-slide:hover .img07 { background-image: url("../images/v14.png"); } #about .value-box .swiper-slide:hover .img08 { background-image: url("../images/v16.png"); } #about .value-box .swiper-slide:hover .img09 { background-image: url("../images/v18.png"); } #about .value-box .swiper-slide:hover .img10 { background-image: url("../images/v20.png"); } #about .value-box .swiper-pagination { bottom: 0; top: unset; height: 2px; } #about .value-box .swiper-pagination-progressbar { background-color: #e6e6e6; } #about .value-box .swiper-pagination-progressbar .swiper-pagination-progressbar-fill { height: 3px; background-color: #333; } #brand-detail .brand-detail .brand-tops { display: flex; align-items: center; justify-content: space-between; margin-top: 120px; } #brand-detail .brand-detail .brand-tops .com-title-box { text-align: left; margin-top: 0; } #brand-detail .brand-detail .brand-tops .info { font-size: 16px; color: #333; width: 52%; line-height: 1.8em; } #brand-detail .brand-detail .brand-display { display: flex; justify-content: space-between; margin-top: 100px; margin-bottom: 150px; } #brand-detail .brand-detail .brand-display .display-items { width: 31%; position: relative; overflow: hidden; } #brand-detail .brand-detail .brand-display .display-items .bg { width: 100%; height: 100%; top: 0; left: 0; position: absolute; background-repeat: no-repeat; background-position: center center; background-size: cover; transition: transform 0.6s; } #brand-detail .brand-detail .brand-display .display-items .text { color: #fff; font-size: 30px; position: absolute; bottom: 60px; left: 50%; transform: translate(-50%); } #brand-detail .brand-detail .brand-display .display-items img { width: 100%; opacity: 0; } #brand-detail .brand-detail .brand-display .display-items:hover .bg { transform: scale(1.2); } #brand-detail .brand-detail .showMar { margin-top: 0; margin-bottom: 60px; } #brand-detail .brand-detail .display-list { width: 100%; } #brand-detail .brand-detail .display-list .list-items { width: 100%; margin-bottom: 60px; } #brand-detail .brand-detail .display-list .list-items .img { width: 100%; background-size: auto 100%; background-position: center center; background-repeat: no-repeat; position: relative; } #brand-detail .brand-detail .display-list .list-items .img img { width: 100%; opacity: 0; } #brand-detail .brand-detail .display-list .list-items .img .play { display: block; width: 56px; height: 56px; background-size: 100%; background-repeat: no-repeat; background-image: url("../images/109.png"); position: absolute; top: calc(50% - 28px); left: calc(50% - 28px); } #brand-detail .brand-detail .display-list .list-items .t1 { font-size: 18px; margin-top: 20px; margin-bottom: 10px; } #brand-detail .brand-detail .display-list .list-items .t2 { font-size: 28px; line-height: 28px; color: #333; } #brand-detail .brand-detail .display-list .list-items .date { padding-left: 30px; background-size: 20px 20px; background-image: url("../images/81.png"); background-repeat: no-repeat; background-position: left center; margin-top: 20px; color: #999; font-size: 18px; } #brand-detail .brand-detail-two .business-story { display: flex; margin-top: 210px; margin-bottom: 160px; } #brand-detail .brand-detail-two .business-story .left .com-title-box { margin-top: 90px; text-align: left; } #brand-detail .brand-detail-two .business-story .left .info { font-size: 16px; margin-top: 50px; line-height: 1.8em; padding-right: 10%; } #brand-detail .brand-detail-two .business-story .right { width: 69%; flex-shrink: 0; background-repeat: no-repeat; background-position: center; background-size: cover; position: relative; } #brand-detail .brand-detail-two .business-story .right > img { width: 100%; opacity: 0; } #brand-detail .brand-detail-two .business-story .right .box { width: 530px; height: 320px; background-color: #f6f6f6; position: absolute; z-index: -1; bottom: -70px; left: -170px; } #brand-detail .brand-detail-two .business-story .right .tag { width: 529px; position: absolute; z-index: 10; bottom: -30px; left: -255px; } #brand-detail .brand-detail-two .business-story .right .tag img { width: 100%; } #brand-detail .brand-detail-two .product-style .pro-tops { display: flex; align-items: center; justify-content: space-between; } #brand-detail .brand-detail-two .product-style .pro-tops .com-title-box { margin-top: 0; text-align: left; } #brand-detail .brand-detail-two .product-style .pro-tops .style-pagination .swiper-pagination-bullet { margin-left: 80px; font-size: 30px; background-color: transparent; opacity: 1; } #brand-detail .brand-detail-two .product-style .pro-tops .style-pagination .swiper-pagination-bullet-active { font-size: 40px; } #brand-detail .brand-detail-two .product-style .swiper-box { margin-top: 60px; } #brand-detail .brand-detail-two .product-style .swiper-box .swiper-style .swiper-slide { position: relative; width: auto !important; } #brand-detail .brand-detail-two .product-style .swiper-box .swiper-style .swiper-slide > img { width: auto; opacity: 1; } #brand-detail .brand-detail-two .product-style .swiper-box .swiper-style .swiper-slide .text-box { max-width: 1000px; display: flex; align-items: center; padding-left: 40px; margin-top: -85px; } #brand-detail .brand-detail-two .product-style .swiper-box .swiper-style .swiper-slide .text-box .num { font-size: 60px; line-height: 60px; color: #fff; } #brand-detail .brand-detail-two .product-style .swiper-box .swiper-style .swiper-slide .text-box .text { margin-left: 20px; } #brand-detail .brand-detail-two .product-style .swiper-box .swiper-style .swiper-slide .text-box .text .tt { color: #fff; font-size: 30px; line-height: 30px; } #brand-detail .brand-detail-two .product-style .swiper-box .swiper-style .swiper-slide .text-box .text .tt span { font-size: 40px; line-height: 40px; margin-left: 20px; color: rgba(255, 255, 255, 0.08); } #brand-detail .brand-detail-two .product-style .swiper-box .swiper-style .swiper-slide .text-box .text .info { font-size: 16px; color: #333; margin-top: 20px; display: none; } #brand-detail .brand-detail-two .product-style .swiper-box .swiper-style .swiper-slide.swiper-slide-active .text-box { margin-top: -100px; } #brand-detail .brand-detail-two .product-style .swiper-box .swiper-style .swiper-slide.swiper-slide-active .text-box .num { font-size: 160px; line-height: 160px; color: #333; } #brand-detail .brand-detail-two .product-style .swiper-box .swiper-style .swiper-slide.swiper-slide-active .text-box .text { margin-top: 130px; } #brand-detail .brand-detail-two .product-style .swiper-box .swiper-style .swiper-slide.swiper-slide-active .text-box .text .tt { color: #333; } #brand-detail .brand-detail-two .product-style .swiper-box .swiper-style .swiper-slide.swiper-slide-active .text-box .text .tt span { color: rgba(51, 51, 51, 0.08); } #brand-detail .brand-detail-two .product-style .swiper-box .swiper-style .swiper-slide.swiper-slide-active .text-box .text .info { display: block; } #brand-detail .brand-detail-two .news-product { width: 100%; height: 500px; background-image: url("../images/118.jpg"); background-repeat: no-repeat; background-position: center center; background-size: cover; display: flex; align-items: center; justify-content: center; margin-top: 140px; } #brand-detail .brand-detail-two .news-product .play-box { font-size: 24px; display: flex; align-items: center; flex-direction: column; color: #fff; } #brand-detail .brand-detail-two .news-product .play-box .play-icon { width: 56px; height: 56px; background-image: url("../images/109.png"); background-size: 100%; background-repeat: no-repeat; display: block; cursor: pointer; } #brand-detail .brand-detail-two .news-product .play-box .text { margin-top: 30px; } #brand-detail .brand-detail-two .picture-play { display: flex; flex-wrap: wrap; justify-content: space-between; margin-top: 130px; margin-bottom: 70px; position: relative; } #brand-detail .brand-detail-two .picture-play .pic-items { width: 48%; background-size: auto 100%; background-repeat: no-repeat; background-position: center; margin-bottom: 80px; position: relative; } #brand-detail .brand-detail-two .picture-play .pic-items img { width: 100%; opacity: 0; } #brand-detail .brand-detail-two .picture-play .pic-items .mask { position: absolute; top: 0; left: 0; width: 100%; height: 100%; display: none; align-items: center; justify-content: center; flex-direction: column; transition: all 0.6s; } #brand-detail .brand-detail-two .picture-play .pic-items .mask .link { font-size: 30px; color: #fff; text-align: center; } #brand-detail .brand-detail-two .picture-play .pic-items .mask .link > a { font-size: 18px; display: inline-block; width: 180px; height: 60px; line-height: 60px; text-align: center; text-align: center; color: #fff; margin-top: 30px; background-color: rgba(255, 255, 255, 0.4); border: 1px solid #e6e6e6; } #brand-detail .brand-detail-two .picture-play .pic-items .mask > i { display: block; position: absolute; background-color: #fff; } #brand-detail .brand-detail-two .picture-play .pic-items .mask .left-icon { width: 4px; height: 0; bottom: 4%; left: 6%; transition: height 0.6s; } #brand-detail .brand-detail-two .picture-play .pic-items .mask .right-icon { width: 4px; height: 0; top: 4%; right: 6%; transition: height 0.6s; } #brand-detail .brand-detail-two .picture-play .pic-items .mask .top-icon { width: 0; height: 4px; left: 6%; top: 4%; transition: width 0.6s; } #brand-detail .brand-detail-two .picture-play .pic-items .mask .bottom-icon { width: 0; height: 4px; right: 6%; bottom: 4%; transition: width 0.6s; } #brand-detail .brand-detail-two .picture-play .pic-items .mask:hover { background-color: rgba(0, 0, 0, 0.6); transition: all 0.6s; } #brand-detail .brand-detail-two .picture-play .pic-items .mask:hover .left-icon, #brand-detail .brand-detail-two .picture-play .pic-items .mask:hover .right-icon { height: 87%; transition: height 0.6s; } #brand-detail .brand-detail-two .picture-play .pic-items .mask:hover .top-icon, #brand-detail .brand-detail-two .picture-play .pic-items .mask:hover .bottom-icon { width: 82%; transition: width 0.6s; } #brand-detail .brand-detail-two .picture-play .pic-items:hover .mask { display: flex; transition: all 1s; } #brand-detail .brand-detail-three .desc-box { text-align: center; } #brand-detail .brand-detail-three .desc-box .title { font-size: 24px; line-height: 24px; margin: 50px 0; } #brand-detail .brand-detail-three .desc-box .desc { font-size: 16px; line-height: 2em; width: 60%; text-align: center; margin: 0 auto; } #brand-detail .brand-detail-three .brand-story-three { display: flex; align-items: center; justify-content: flex-end; padding-left: 6.6%; margin-top: 110px; } #brand-detail .brand-detail-three .brand-story-three .left-items { display: flex; flex-direction: column; align-items: flex-start; margin-right: -100px; position: relative; z-index: 10; } #brand-detail .brand-detail-three .brand-story-three .left-items .items { position: relative; transition: all 0.6s; cursor: pointer; } #brand-detail .brand-detail-three .brand-story-three .left-items .items > img { width: auto; cursor: pointer; } #brand-detail .brand-detail-three .brand-story-three .left-items .items > img.black { display: none; } #brand-detail .brand-detail-three .brand-story-three .left-items .items .img-box { width: 100%; height: 100%; background-position: center; background-repeat: no-repeat; background-size: 100%; } #brand-detail .brand-detail-three .brand-story-three .left-items .items .img-box img { width: 100%; opacity: 0; } #brand-detail .brand-detail-three .brand-story-three .left-items .items.img01 .img-box { background-image: url("../images/154.png"); } #brand-detail .brand-detail-three .brand-story-three .left-items .items.img01:hover .img-box { background-image: url("../images/155.png"); } #brand-detail .brand-detail-three .brand-story-three .left-items .items.img02 { margin: 130px 0; position: relative; } #brand-detail .brand-detail-three .brand-story-three .left-items .items.img02 .img-box { background-image: url("../images/158.png"); } #brand-detail .brand-detail-three .brand-story-three .left-items .items.img02:hover .img-box { background-image: url("../images/159.png"); } #brand-detail .brand-detail-three .brand-story-three .left-items .items.img03 .img-box { background-image: url("../images/156.png"); } #brand-detail .brand-detail-three .brand-story-three .left-items .items.img03:hover .img-box { background-image: url("../images/157.png"); } #brand-detail .brand-detail-three .brand-story-three .left-items .items .text { position: absolute; font-size: 30px; left: 0; top: 10px; } #brand-detail .brand-detail-three .brand-story-three .left-items .items.active:before { content: ""; position: absolute; width: 270px; height: 220px; background-size: 270px 220px; background-repeat: no-repeat; background-position: center; background-image: url("../images/160.png"); left: -40px; bottom: -90px; } #brand-detail .brand-detail-three .brand-story-three .left-items .items.active .text { top: 75px; } #brand-detail .brand-detail-three .brand-story-three .left-items .items.active.img01 .img-box { background-image: url("../images/155.png"); } #brand-detail .brand-detail-three .brand-story-three .left-items .items.active.img02 .img-box { background-image: url("../images/159.png"); } #brand-detail .brand-detail-three .brand-story-three .left-items .items.active.img03 .img-box { background-image: url("../images/157.png"); } #brand-detail .brand-detail-three .brand-story-three .right-items { width: 65%; background-repeat: no-repeat; background-size: cover; background-position: center; position: relative; } #brand-detail .brand-detail-three .brand-story-three .right-items img { width: 100%; opacity: 0; } #brand-detail .brand-detail-three .brand-story-three .right-items .full-bg { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-size: cover; background-repeat: no-repeat; background-position: center center; opacity: 0; transition: all 0.6s; } #brand-detail .brand-detail-three .brand-story-three .right-items .full-bg.active-bg { display: block !important; opacity: 1; } #brand-detail .brand-detail-three .video-display { margin-top: 160px; margin-bottom: 230px; display: flex; align-items: flex-end; } #brand-detail .brand-detail-three .video-display .swiper-video { width: 75%; flex-shrink: 0; } #brand-detail .brand-detail-three .video-display .swiper-video .swiper-slide { background-size: cover; background-repeat: no-repeat; background-position: center; height: 100%; position: relative; } #brand-detail .brand-detail-three .video-display .swiper-video .swiper-slide img { width: 100%; opacity: 0; } #brand-detail .brand-detail-three .video-display .swiper-video .swiper-slide .play { width: 56px; height: 56px; background-image: url("../images/109.png"); background-size: 100%; background-repeat: no-repeat; position: absolute; top: calc(50% - 29px); left: calc(50% - 29px); } #brand-detail .brand-detail-three .video-display .text-box { width: 32%; display: flex; align-items: center; flex-direction: column; justify-content: center; padding: 100px 0 30px 0; margin-bottom: -60px; margin-left: -100px; position: relative; z-index: 100; color: #333; border: solid 3px #000000; } #brand-detail .brand-detail-three .video-display .text-box .en { font-size: 60px; line-height: 60px; } #brand-detail .brand-detail-three .video-display .text-box .cn { font-size: 24px; line-height: 24px; margin-top: 10px; } #brand-detail .brand-detail-three .video-display .text-box .btn-box { display: flex; align-items: center; margin-top: 20px; } #brand-detail .brand-detail-three .video-display .text-box .btn-box .video-prev { width: 60px; height: 70px; background-repeat: no-repeat; background-size: 11px 20px; background-position: center; background-image: url("../images/126.png"); position: relative; cursor: pointer; } #brand-detail .brand-detail-three .video-display .text-box .btn-box .video-prev:after { content: ""; position: absolute; width: 1px; height: 14px; top: calc(50% - 7px); right: 0; background-color: #ccc; } #brand-detail .brand-detail-three .video-display .text-box .btn-box .video-next { width: 60px; height: 70px; background-repeat: no-repeat; background-size: 11px 20px; background-position: center; background-image: url("../images/127.png"); cursor: pointer; } #brand-detail .brand-detail-three .big-pic { background-repeat: no-repeat; background-size: cover; background-position: center; position: relative; cursor: pointer; } #brand-detail .brand-detail-three .big-pic img { width: 100%; opacity: 0; } #brand-detail .brand-detail-three .big-pic .text-box { color: #fff; position: absolute; bottom: 70px; width: 100%; text-align: center; } #brand-detail .brand-detail-three .big-pic .text-box .en { font-size: 60px; line-height: 60px; } #brand-detail .brand-detail-three .big-pic .text-box .cn { font-size: 30px; line-height: 30px; margin-top: 20px; } #brand-detail .brand-detail-three .small-pic { display: flex; justify-content: space-between; flex-wrap: wrap; margin: 160px 0; } #brand-detail .brand-detail-three .small-pic .img { width: 47.5%; background-size: cover; background-repeat: no-repeat; background-position: center; position: relative; cursor: pointer; margin-bottom: 5%; } #brand-detail .brand-detail-three .small-pic .img img { width: 100%; opacity: 0; } #brand-detail .brand-detail-three .small-pic .text { font-size: 30px; position: absolute; width: 100%; bottom: 50px; text-align: center; color: #fff; } @media screen and (max-width: 1900px) { #index .index-banner .index-inner .left-banner .swiper-index .swiper-slide .text-box { left: 3.5%; } .footer .footer-top .footer-left .footer-list > li { margin-right: 13%; } #search .search-store .store-box .center .store-items .s-items { padding-left: 20px; padding-right: 10px; } #brand-detail .brand-detail-two .picture-play .pic-items img { width: 100%; } .pro-cover .display-pic { height: 500px; } #about .business-history .history-position .history-box .history-tops .swiper-history-date .swiper-slide { width: 18% !important; } #about .business-history .history-position .history-box .swiper-history-text { padding-left: 4%; } #about .business-history .history-position .history-box .swiper-history-text .history-prevNext .next { left: 65%; } } @media screen and (max-width: 1600px) { #index .index-banner .index-inner .left-banner .swiper-index .swiper-slide .text-box { width: 30%; } #index .about-us .tops .tt { font-size: 36px; line-height: 36px; } #index .about-us .about-box .right-items { padding: 100px 7% 150px 18%; } #index .about-us .about-box .right-items .t1 { font-size: 24px; line-height: 24px; } #index .about-us .about-box .right-items .tt { font-size: 20px; } .com-title-box .en { font-size: 36px; line-height: 36px; } #index .join-us-box .join-inner .form-box { width: 37%; } #about .group-founder .group-position { top: -130px; } #about .group-founder .group-position .left-items { width: 60.5%; } #about .group-founder .group-position .right-items { width: 37%; } #about .group-founder .group-position .left-items .desc-box .intro-box .intro-items { padding: 20px 15px; } #about .group-founder .group-position .left-items .desc-box .intro-box .intro-items .t1 { font-size: 16px; } #about .group-founder .group-position .left-items .desc-box .intro-box .intro-items .year { font-size: 48px; line-height: 48px; } #about .group-founder .group-position .left-items .desc-box .intro-box .intro-items .year:after { bottom: 2px; } #about .group-founder .group-position .left-items .desc-box .intro-box .intro-items .t2 { font-size: 14px; } #about .business-history { height: 720px; } #about .business-history .history-position .history-box .history-tops .swiper-history-date { margin-top: 60px; } #about .group-honor .swiper-box .swiper-honor .swiper-slide { padding: 15px; } #about .group-honor .swiper-box .swiper-honor .swiper-slide .text { font-size: 22px; line-height: 22px; } #about .group-honor .swiper-box .swiper-honor .swiper-slide .desc { font-size: 14px; } #about .group-honor .swiper-box .swiper-honor .swiper-slide .date { margin-top: 20px; } #brand .brand-items .b-items { padding-top: 60px; padding-bottom: 50px; } #brand .brand-items .b-items .link { font-size: 20px; margin-bottom: 80px; } #brand .brand-items .b-items .img { width: 210px; } #responsibility .public-welfare .welfare-box .welfare-items .left-items .date .t1 { font-size: 36px; line-height: 36px; } #responsibility .public-welfare .welfare-box .welfare-items .right-items { padding-left: 2%; padding-top: 20px; } .footer .footer-top .footer-left .footer-list > li { margin-right: 12%; } #search .search-store .store-box .center .store-items .s-items .info .t1 { font-size: 20px; } #search .search-store .store-box .center .store-items .s-items .info .t2 { font-size: 14px; } #contact .contact-box .contact-form .form-box { width: 65%; } #contact .contact-box .contact-form .form-box form .lines .label { font-size: 20px; line-height: 20px; } #brand-detail .brand-detail .brand-display .display-items .text { font-size: 26px; } #brand-detail .brand-detail-two .picture-play .pic-items img { width: 100%; } #brand-detail .brand-detail-three .brand-story-three .left-items .items.img02 { margin: 90px 0; } #brand-detail .brand-detail-three .brand-story-three .left-items .items.active:before { width: 220px; height: 190px; background-size: 220px 190px; left: -30px; bottom: -70px; } #brand-detail .brand-detail-three .brand-story-three .left-items .items .text { font-size: 24px; } #about .business-history .history-position .history-box .swiper-history-text { padding-left: 4.5%; } } @media screen and (max-width: 1460px) { .footer .footer-top .footer-left .footer-list > li { margin-right: 10%; } .brand-bottom-box .store-address .store-items.ml300 { margin-left: 150px; } #news .news-box .news-content .n-items .info-box .title { font-size: 20px; } #news .news-box .news-content .n-items .info-box .desc { font-size: 14px; } .pro-cover .display-pic { height: 450px; } #brand-detail .brand-detail-three .brand-story-three .right-items { width: 90%; } #brand-detail .brand-detail-three .video-display .text-box { padding: 60px 0 30px 0; } #brand-detail .brand-detail-three .video-display .text-box .en { font-size: 45px; line-height: 45px; } #index .join-us-box .join-inner .index-map { overflow: auto; } #index .join-us-box .join-inner .index-map::-webkit-scrollbar { width: 6px; height: 6px; } #index .join-us-box .join-inner .index-map::-webkit-scrollbar-thumb { background-color: #00aeb9; } #index .join-us-box .join-inner .index-map img { max-width: -moz-max-content; max-width: max-content; } #contact .contact-box .contact-form .map-box { overflow: auto; } #contact .contact-box .contact-form .map-box::-webkit-scrollbar { width: 6px; height: 6px; } #contact .contact-box .contact-form .map-box::-webkit-scrollbar-thumb { background-color: #00aeb9; } #contact .contact-box .contact-form .map-box img { max-width: -moz-max-content; max-width: max-content; } } @media screen and (max-width: 1386px) { #index .index-banner .index-inner .left-banner .swiper-index .swiper-slide { background-position: center; } #index .about-us .about-box .right-items { padding: 55px 3% 150px 18%; } #index .about-us .tops .bg { top: -3px; } #about .business-history .history-position .history-box .history-tops .swiper-history-date .swiper-slide .text-box .t1 { font-size: 28px; line-height: 28px; } #about .business-history .history-position .history-box .swiper-history-text .swiper-slide .text-box { padding-top: 30px; } #about .business-history .history-position .history-box .swiper-history-text .swiper-slide .text-box .title { font-size: 28px; line-height: 28px; } #about .business-history .history-position .history-box .swiper-history-text .swiper-slide .text-box .info { padding-right: 10px; font-size: 14px; } .com-title-box .en { font-size: 30px; line-height: 30px; } .com-title-box .cn { font-size: 26px; line-height: 26px; } #responsibility .public-welfare .welfare-box .welfare-items .right-items { padding-right: 15px; } #responsibility .public-welfare .welfare-box .welfare-items .right-items .title { font-size: 20px; line-height: 20px; } #responsibility .public-welfare .welfare-box .welfare-items .right-items .info { font-size: 14px; } #contact .contact-box .contact-form .form-box { width: 75%; } #brand-detail .brand-detail .brand-display { margin-top: 60px; margin-bottom: 100px; } #brand-detail .brand-detail .display-list .list-items .t1 { font-size: 14px; } #brand-detail .brand-detail .display-list .list-items .t2 { font-size: 20px; line-height: 20px; } #brand-detail .brand-detail-three .big-pic .text-box .en { font-size: 45px; line-height: 45px; } #brand-detail .brand-detail-three .big-pic .text-box .cn { font-size: 26px; line-height: 26px; } #brand-detail .brand-detail-three .small-pic { margin: 60px 0; } .com-title-box { margin-top: 60px; } #brand-detail .brand-detail-three .desc-box .title { font-size: 20px; line-height: 20px; margin: 25px 0; } #brand-detail .brand-detail-three .desc-box .desc { width: 80%; } #brand-detail .brand-detail-three .brand-story-three { margin-top: 60px; } #brand-detail .brand-detail-three .video-display .text-box { padding: 45px 0 30px 0; margin-bottom: -45px; } #brand-detail .brand-detail-three .video-display .text-box .en { font-size: 40px; line-height: 40px; } #brand-detail .brand-detail-three .video-display .text-box .cn { font-size: 20px; line-height: 20px; } .center { width: 91.3333%; } #brand-detail .brand-detail-three .video-display { margin-top: 120px; margin-bottom: 170px; } #brand-detail .brand-detail-three .video-display .text-box .cn { margin-top: 20px; } #brand-detail .brand-detail-three .brand-story-three .left-items > img { width: 40%; } #brand-detail .brand-detail-three .brand-story-three .left-items > img.img02 { width: 95%; } #brand-detail .brand-detail-two .business-story .right .box { width: 380px; height: 230px; } #brand-detail .brand-detail-two .business-story .right .tag { width: 36%; bottom: -20px; left: -17%; } .brand-bottom-box { padding-top: 60px; padding-bottom: 60px; height: auto; } .brand-bottom-box .store-address { margin-top: 80px; } .brand-bottom-box .store-address .store-items .t1 { font-size: 22px; line-height: 22px; } .brand-bottom-box .store-address .store-items .t2 { font-size: 16px; line-height: 16px; } #news .news-box .news-detail .right-items .p-items { padding: 30px 25px 10px 25px; } #news .news-box .news-detail .right-items .p-items .info-box .title { font-size: 20px; } #news .news-box .news-detail .right-items .p-items .info-box .desc { font-size: 14px; margin-top: 10px; } #visited .visited-box .visit-access .tops .right { padding-left: 5%; } #visited .visited-box .visit-access .appointment .info { padding: 40px 0 0 20px; } #visited .visited-box .visit-access .appointment .info .t1 { font-size: 24px; } #visited .visited-box .visit-access .appointment .info .t2 { font-size: 20px; } #visited .visited-box .history-tour .history-items .h-items .info-box .title { font-size: 20px; } #visited .visited-box .history-tour .history-items .h-items .info-box .desc { font-size: 14px; margin-top: 10px; } #visited .visited-box .history-tour .history-items .h-items .info-box .more { margin-top: 10px; font-size: 16px; width: 160px; height: 45px; line-height: 45px; } .pro-cover .display-pic { height: 410px; } #brand-detail .brand-detail-three .brand-story-three .left-items .items.active:before { width: 160px; height: 140px; background-size: 160px 140px; bottom: -60px; } #about .business-history .history-position .history-box .swiper-history-text { padding-right: 5%; } #about .business-history .history-position .history-box .swiper-history-text .history-prevNext .next { left: 60.7%; } } @media screen and (max-width: 1300px) { .footer .footer-top .footer-left .footer-list > li { margin-right: 9%; } #index .join-us-box .join-inner { flex-wrap: wrap; margin-left: 0; } #index .join-us-box .join-inner .index-map { width: 100%; } #index .join-us-box .join-inner .form-box { width: 50%; margin: 0 auto; } #index .join-us-box .join-inner .index-map { width: 91.3333%; margin: 0 auto; height: 420px; margin-top: 80px; } #index .news-center .news-items { margin-left: 5.333%; } #index .join-us-box .join-inner .form-box .title { text-align: center; } #index .responsibility-box .responsibility-items .more-news { width: 120px; height: 150px; font-size: 14px; } #index .responsibility-box .responsibility-items .items .tt { font-size: 18px; line-height: 18px; margin-bottom: 10px; } #index .responsibility-box .responsibility-items .items .more { width: 160px; height: 45px; line-height: 45px; font-size: 14px; margin-top: 20px; } #index .join-us-box .join-inner .form-box .form { margin-top: 60px; } #index .join-us-box .join-inner .form-box .form .btn { margin: 0 auto; } #index .responsibility-box .responsibility-items { margin-top: 60px; } #index .news-center .news-items { margin-top: 60px; margin-bottom: 100px; } #index .news-center .news-items .swiper-news .swiper-slide .title { font-size: 18px; line-height: 18px; } #index .news-center .news-items .swiper-news .swiper-slide .more { width: 160px; height: 45px; line-height: 45px; font-size: 14px; } #index .display-box { margin-top: 60px; margin-bottom: 60px; } #index .display-box .swiper-display-left { padding-top: 50px; } #index .display-box .swiper-display-left .swiper-slide .pic-box > img { width: 40%; margin-top: 20px; } #index .about-us .about-box .left-items { width: 55.6%; } #index .about-us .about-box .right-items { padding: 50px 3% 30px 8%; bottom: 45px; } #index .about-us .about-box .right-items .info { margin-top: 30px; font-size: 14px; } #index .about-us .about-box .right-items .t1 { font-size: 20px; line-height: 20px; } #index .about-us .tops { margin-top: 60px; margin-bottom: 100px; } #index .about-us .about-box .right-items .more { width: 160px; height: 45px; line-height: 45px; font-size: 14px; margin-top: 30px; } #index .index-banner .scroll-down-icon { width: 88px; height: 45px; left: calc(50% - 44px); } #index .index-banner .index-inner .left-banner .swiper-pagination-index .swiper-pagination-bullet-active { font-size: 24px; } #index .index-banner .logo-position .logo img { width: 70%; } #index .join-us-box { margin-top: 120px; } .menu-down-box .menu-box { padding-left: 3%; } .menu-down-box .menu-box .items-box .items-top { font-size: 16px; } .menu-down-box .menu-box .right-nav, .menu-down-box .menu-box .close { right: 25px; } .header .header-nav .items { padding: 0 20px; } #about .group-founder { height: 445px; } #about .group-founder .group-position .left-items .desc-box { margin-top: 40px; } #about .group-founder .group-position .left-items .desc-box .intro-box .intro-items .year { font-size: 36px; line-height: 36px; } #about .group-founder .group-position .left-items .desc-box .intro-box .intro-items .t1, #about .group-founder .group-position .left-items .desc-box .intro-box .intro-items .t2 { font-size: 14px; } #about .business-history { height: 600px; } #about .business-history .history-position .history-box .swiper-history-text .swiper-slide .text-box { padding-top: 15px; } #about .business-history .history-position .history-box .swiper-history-text .swiper-slide .text-box .info { height: 95px; } #about .group-honor .swiper-box .swiper-honor .swiper-slide .text { font-size: 18px; line-height: 18px; } #about .group-honor .swiper-box .swiper-honor .swiper-slide .desc { font-size: 12px; } #brand .brand-items { margin-top: 60px; margin-bottom: 100px; } #brand .brand-items .b-items .img { width: 160px; } #brand .brand-items .b-items .tt { font-size: 18px; } #brand .brand-items .b-items .link { margin-bottom: 45px; font-size: 16px; } #contact .contact-box .contact-form .form-box { width: 85%; } .footer .footer-bottom { height: auto; line-height: 2em; padding: 10px 0; } .footer .footer-bottom .center { flex-wrap: wrap; } .footer .footer-bottom .center .left, .footer .footer-bottom .center .right { width: 100%; text-align: center; } #responsibility .public-welfare .welfare-box .welfare-items .right-items .more { margin-top: 30px; } #responsibility .public-welfare .welfare-box .welfare-items .left-items .date .t1 { font-size: 30px; line-height: 30px; } #visited .visited-box .visit-access .tops .right { font-size: 14px; } #visited .visited-box .visit-access .appointment .info { background-size: 60%; } #visited .visited-box .visit-access .appointment .info .t1 { font-size: 16px; } #visited .visited-box .visit-access .appointment .info .t2 { font-size: 14px; } .inner-banner .text-box .text { font-size: 24px; } .inner-banner .text-box .text-img img { width: 30%; } #brand-detail .brand-detail .brand-display .display-items .text { font-size: 20px; } #brand-detail .brand-detail-three .small-pic .text { font-size: 26px; } #brand-detail .brand-detail-two .product-style .swiper-box .swiper-style .swiper-slide { width: 100% !important; } #brand-detail .brand-detail-two .product-style .swiper-box .swiper-style .swiper-slide > img { width: 100%; } #brand-detail .brand-detail-two .product-style .swiper-box .swiper-style .swiper-slide .text-box .num { font-size: 80px; } #brand-detail .brand-detail-two .product-style .swiper-box .swiper-style .swiper-slide .text-box .text .tt { font-size: 24px; line-height: 24px; } #brand-detail .brand-detail-two .product-style .swiper-box .swiper-style .swiper-slide .text-box .text .tt span { font-size: 30px; line-height: 30px; } #brand-detail .brand-detail-two .product-style .swiper-box .swiper-style .swiper-slide .text-box .text .info { margin-top: 10px; } #brand-detail .brand-detail-two .business-story { margin-top: 100px; } #brand-detail .brand-detail-two .news-product { margin-top: 100px; height: 420px; } .brand-bottom-box { margin-top: 50px; } .brand-bottom-box .store-address .store-items .t1 { font-size: 20px; line-height: 20px; } .brand-bottom-box .store-address .store-items .t2 { font-size: 14px; } .com-title-box .en { font-size: 24px; line-height: 24px; } .com-title-box .cn { font-size: 20px; line-height: 20px; } .brand-bottom-box .store-address { margin-top: 60px; } .brand-bottom-box .lines { margin-top: 50px; } .pro-cover .display-pic { height: 345px; } #brand-detail .brand-detail-three .brand-story-three .left-items .items.active .text { top: 60px; } } @media screen and (max-width: 1044px) { .footer .footer-top .footer-left .footer-list > li { margin-right: 3%; } .footer .footer-top .footer-left .footer-list > li .tt { font-size: 16px; } .footer .footer-top .footer-left .footer-link .right-items { width: 130px; } .footer .footer-top .footer-left .footer-link .left-items { font-size: 14px; } #brand-detail .brand-detail-three .video-display { margin-top: 80px; margin-bottom: 120px; } .header .header-nav { display: none; } .pro-cover .display-pic { height: 250px; } #index .display-box .display-left { padding-top: 40px; padding-bottom: 30px; } #index .display-box .display-left .swiper-display-left .swiper-slide .pic-box > img { width: 160px; } } @media screen and (max-width: 750px) { #index .index-banner .header { display: flex; } #index .index-banner .index-inner .left-banner { width: 100%; } #index .index-banner .index-inner .left-banner .swiper-index .swiper-slide > img { opacity: 0; width: 100%; display: block; } #index .index-banner .index-inner .right-menu { width: 1rem; display: none; } #index .about-us .about-box { flex-wrap: wrap; } #index .about-us .about-box .left-items { width: 100%; } #index .about-us .about-box .right-items { position: relative; right: unset; bottom: unset; width: 100%; padding: 0.2rem; } #index .about-us .tops { margin-top: 0.5rem; margin-bottom: 1rem; } #index .about-us .tops .tt { font-size: 18px; } #index .about-us .tops .bg { position: relative; top: 10px; width: 100%; } #index .display-box { margin-top: 0.3rem; margin-bottom: 1.5rem; } #index .about-us .about-box { padding-bottom: 0.4rem; } #index .news-center .tops { flex-wrap: wrap; } #index .display-box .swiper-display-left { padding-top: 0.2rem; } #index .display-box .swiper-display-left .swiper-slide .pic-box { width: 75%; } #index .display-box .swiper-display-left .swiper-slide .pic-box > img { margin-top: 0.1rem; } .com-title-box .en { font-size: 20px; line-height: 20px; } .com-title-box .cn { font-size: 16px; line-height: 16px; margin-top: 0.2rem; } #index .news-center .tops .com-title-box { text-align: center; width: 100%; } #index .news-center .tops .news-nav { display: flex; justify-content: space-between; width: 100%; margin-top: 0.4rem; } #index .news-center .tops .news-nav span { margin-left: 0; } #index .news-center .news-items { margin-top: 0.4rem; margin-bottom: 0.5rem; } #index .news-center .news-items .swiper-news .swiper-slide { width: 90% !important; } #index .news-center .news-items .swiper-news .swiper-slide .img .date { width: 1.5rem; height: 1.5rem; font-size: 12px; margin: 0; } #index .news-center .news-items .swiper-news .swiper-slide .img .date .t2 { font-size: 0.3rem; line-height: 0.3rem; } #index .news-center .news-items .swiper-news .swiper-slide .img .date .line { display: none; } .com-title-box { margin-top: 1.5rem; } #index .video-display { height: 4rem; } .video-layer .layui-layer-content { width: 400px !important; height: 225px !important; overflow: hidden !important; } #index .responsibility-box .responsibility-items { margin-top: 0.4rem; flex-wrap: wrap; } #index .responsibility-box .responsibility-items .items { width: 48%; margin-bottom: 0.4rem; } #index .responsibility-box .responsibility-items .items .date { font-size: 16px; } #index .responsibility-box .responsibility-items .items .tt { font-size: 14px; line-height: 14px; } #index .responsibility-box .responsibility-items .items .desc { font-size: 12px; } #index .join-us-box { margin-top: 70px; } #index .join-us-box .join-inner .form-box { width: 91.3333%; } #index .join-us-box .join-inner .form-box .form .lines { height: 1rem; } #index .join-us-box .join-inner .form-box .form .btn { width: 3rem; height: 1rem; line-height: 1rem; } #index .join-us-box .join-inner .form-box .title { font-size: 24px; } #index .join-us-box .join-inner .form-box .form { margin-top: 1.2rem; } #index .join-us-box .join-inner .index-map { margin-top: 0.8rem; } .footer .footer-top .footer-left .footer-list { display: none; } .footer .footer-bottom { font-size: 12px; } .footer .footer-top { padding: 0.6rem 0; } .footer .footer-top .center { flex-wrap: wrap; flex-direction: column-reverse; } .footer .footer-top .footer-left { width: 100%; text-align: center; } .footer .footer-top .footer-right { width: 100%; text-align: center; } .footer .footer-top .footer-right .address { margin-top: 0.2rem; margin-bottom: 0.4rem; font-size: 14px; } .footer .footer-top .footer-right .tel-box { margin-top: 0.2rem; margin-bottom: 0.4rem; font-size: 18px; } .footer .footer-top .footer-left .footer-link { flex-wrap: wrap; margin-top: 0.5rem; padding-right: 0; } .footer .footer-top .footer-left .footer-link .left-items { width: 100%; } .footer .footer-top .footer-left .footer-link .right-items { width: 2rem; margin: 0 auto; margin-top: 0.4rem; } .footer .footer-top .footer-right .third-link { display: flex; justify-content: center; } .footer .footer-top .footer-right .third-link > a { margin-left: 10px; } .footer .footer-top .footer-right .title { font-size: 16px; } .footer .footer-top .footer-right .tel-box { font-size: 14px; } #index .index-banner .logo-position { left: -0.3rem; top: 0.3rem; display: none; } .menu-down-box .menu-box { width: 100%; padding-top: 1rem; } .menu-down-box .menu-box .close { width: 20px; height: 60px; background-size: 13px 60px; top: 15px; right: 15px; } #index .index-banner .index-inner .right-menu .menu { background-size: 16px 56px; margin-top: 15px; } .menu-down-box .menu-box .items-box { width: 65%; } .menu-down-box .menu-box .items-box .items-top { font-size: 14px; height: 1rem; line-height: 1.2rem; } .menu-down-box .menu-box .items-box .items-top.active:before { top: calc(50% + 3px); } .menu-down-box .menu-box .items-box .down-box .items { font-size: 14px; } .header { height: 0.88rem; } .header .menu { width: 1.5rem; height: 0.88rem; } .header .logo { width: 2rem; } .inner-banner .second-nav-box { height: 1rem; } .inner-banner .second-nav-box .nav-box .left { flex-shrink: 0; font-size: 12px; } .inner-banner .second-nav-box .nav-box .right .items { margin-left: 0.2rem; font-size: 12px; } .inner-banner .second-nav-box .nav-box .right .items.active { font-size: 14px; } .inner-banner .second-nav-box .nav-box .right .items.active:after { width: 100%; height: 4px; left: 0; top: calc(50% + 4px); } .inner-banner .second-nav-box .nav-box .left, .inner-banner .second-nav-box .nav-box .right .items { line-height: 1rem; } #about .group-founder { height: auto; margin-top: 1rem; margin-bottom: 0.6rem; } #about .group-founder .group-position .center { flex-wrap: wrap; flex-direction: column-reverse; } #about .group-founder .group-position .left-items { width: 100%; } #about .group-founder .group-position .right-items { height: 100%; } #about .group-founder .group-position .left-items .desc-box .name { font-size: 24px; } #about .group-founder .group-position .left-items .desc-box .desc { font-size: 14px; } #about .group-founder .left-box, #about .group-founder .right-box { display: none; } #about .group-founder .group-position { position: static; } #about .group-founder .group-position .right-items { width: 100%; margin-top: 0.6rem; } #about .group-founder .group-position .left-items .com-title-box { width: 100%; margin-top: 0.6rem; text-align: center; } #about .group-founder .group-position .left-items .desc-box { margin-top: 0.4rem; } #about .group-founder .group-position .left-items .desc-box .intro-box { flex-wrap: wrap; margin-top: 0.4rem; } #about .group-founder .group-position .left-items .desc-box .intro-box .intro-items { width: 48%; margin-bottom: 0.4rem; } #about .business-history { height: auto; padding-top: 0.4rem; padding-bottom: 1rem; } #about .business-history .history-position { padding-top: 0.5rem; position: static; } #about .business-history .history-position .history-box .history-tops .swiper-history-date .swiper-slide { width: 35% !important; } #about .business-history .history-position .history-box .history-tops .swiper-history-date .swiper-slide .text-box .t1 { font-size: 18px; line-height: 18px; } #about .business-history .history-position .history-box .history-tops .swiper-history-date .swiper-slide .text-box .t2 { font-size: 14px; line-height: 14px; margin-top: 0.1rem; } #about .business-history .history-position .history-box .swiper-history-text .swiper-slide { width: 100%; flex-direction: column; } #about .business-history .history-position .history-box .swiper-history-text .swiper-slide .pic, #about .business-history .history-position .history-box .swiper-history-text .swiper-slide .text-box { width: 100%; } #about .business-history .history-position .history-box .swiper-history-text .history-prevNext .next { left: unset; right: 0; } #about .business-history .history-position .history-box .swiper-history-text .swiper-slide .text-box .info { height: auto; } #about .business-history > img { display: none; } #about .group-honor { margin-top: 0.8rem; margin-bottom: 0.8rem; } #about .group-honor .tops { flex-wrap: wrap; } #about .group-honor .tops .com-title-box { width: 100%; text-align: center; } #about .group-honor .tops .pre-btn { margin-top: 0.4rem; width: 100%; display: flex; justify-content: space-between; } #about .group-honor .tops .pre-btn > a.next { margin-left: 20px; } #about .company-culture .tops { flex-wrap: wrap; padding-top: 1rem; } #about .company-culture .tops .com-title-box { width: 100%; text-align: center; } #about .company-culture .tops .pre-btn { display: flex; justify-content: space-between; width: 100%; margin-top: 0.4rem; } #about .company-culture .tops .pre-btn > a.next { margin-left: 20px; } #about .company-culture .swiper-box { margin-top: 0.6rem; } #about .company-culture .swiper-box .swiper-culture .swiper-slide { width: 100% !important; } #about .company-culture .swiper-box .swiper-culture .swiper-slide img { width: 100%; } #about .company-culture .swiper-box .swiper-culture .swiper-slide .info .t1 { font-size: 20px; line-height: 20px; } #about .company-culture .swiper-box .swiper-culture .swiper-slide .info .t2 { font-size: 16px; line-height: 16px; margin-top: 0.2rem; margin-bottom: 0.3rem; } #about .value-box { margin-bottom: 1rem; } #about .value-box .swiper-slide { padding: 0.4rem 0.3rem; } #about .value-box .swiper-slide .img { width: 1.5rem; height: 1.5rem; } #about .value-box .swiper-slide .t2 { font-size: 18px; line-height: 18px; } #about .value-box .swiper-slide .info { margin-top: 0.2rem; } #about .culture-bg { height: auto; } #about .company-culture { margin-top: 0; } #about .value-box .swiper-slide:after { width: 0; } #brand .brand-items { flex-wrap: wrap; margin-top: 0.6rem; margin-bottom: 0.6rem; } #brand .brand-items .b-items { width: 100%; margin-bottom: 0.4rem; padding: 0.5rem 0; } .inner-banner .brand-bg { flex-wrap: wrap; } .inner-banner .brand-bg .items { width: 100%; height: 33.3333%; border-bottom: 1px solid rgba(255, 255, 255, 0.28); } .inner-banner .brand-bg .items .img { width: 3rem; left: calc(50% - 1.5rem); bottom: 2rem; } .inner-banner .brand-bg .items .enter { width: 2rem; height: 0.8rem; line-height: 0.8rem; left: calc(50% - 1rem); bottom: 1.2rem; font-size: 14px; } .inner-banner .brand-bg .items:hover .img { bottom: 2rem; } .inner-banner .brand-bg .items:hover .enter { bottom: 1.2rem; } .mt70 { margin-top: 0.7rem !important; } #contact .contact-box .contact-form .form-box form .lines { width: 100%; } #contact .contact-box .contact-form .form-box form .lines .label { font-size: 14px; line-height: 14px; margin-bottom: 0.2rem; } #contact .contact-box .contact-form .form-box form .lines .input-box { height: 1rem; } #contact .contact-box .contact-form .form-box form .lines .input-box .select-box { line-height: 1rem; } .mt30 { margin-top: 0.3rem !important; } #contact .contact-box .contact-form .form-box { width: 91.33333%; } #contact .contact-box .contact-form .form-box form .lines .input-box .load-box { line-height: 1rem; } #contact .contact-box .contact-form .form-box form .lines.has-code .btn { width: 3rem; top: 1.5rem; right: calc(50% - 1.5rem); height: 1rem; line-height: 1rem; } #contact .contact-box .contact-form .form-box form .lines.has-code .left .code-img { height: 1rem; } #contact .contact-box .contact-form .map-box { height: 4rem; margin: 2rem 0 0.6rem; } #contact .contact-box .recruit-center .recruit-box li .recruit-top { height: auto; padding: 0.2rem; } #contact .contact-box .recruit-center .recruit-box li .recruit-top .left .top .name { font-size: 16px; } #contact .contact-box .recruit-center .recruit-box li .recruit-content { padding: 0.2rem; } #contact .contact-box .recruit-center .recruit-box li .recruit-top .left .top .name { margin-right: 0; } #contact .contact-box .recruit-center .recruit-box li .recruit-top .left .top .time span { padding: 0; border: 0; } #contact .contact-box .recruit-center .recruit-box li .recruit-top .down-icon { display: none; } #contact .contact-box .recruit-center .recruit-box li .recruit-top .left .desc { margin-top: 0.1rem; } #contact .contact-box .recruit-center .recruit-box li .recruit-top .left .desc span { margin-right: 0; font-size: 12px; } #contact .contact-box .recruit-center .recruit-box li .recruit-content .t1 { padding-top: 0.2rem; padding-bottom: 0.1rem; } .mb60 { margin-bottom: 0.6rem !important; } .mt60 { margin-top: 0.6rem !important; } #contact .contact-box .recruit-center .recruit-box li .recruit-content .join-in { width: 2rem; height: 0.8rem; line-height: 0.8rem; font-size: 14px; margin-top: 0.2rem; } #news .news-box .news-content { flex-wrap: wrap; } #news .news-box .news-content .left-items { width: 100%; } #news .news-box .news-content .n-items { padding-bottom: 0.2rem; margin-bottom: 0.4rem; } #news .news-box .news-content .n-items .info-box .more { width: 2rem; height: 0.8rem; line-height: 0.8rem; font-size: 14px; background-size: 0; margin-top: 0.2rem; } #news .news-box .news-content .n-items .info-box .more:hover { padding-left: 0; } #news .news-box .news-content .n-items .info-box .date { font-size: 18px; padding: 0 0.1rem; } #news .news-box .news-content .n-items .info-box .title { font-size: 16px; } #news .news-box .news-content .n-items .info-box .desc { margin-top: 0.2rem; font-size: 12px; } #news .news-box .news-content .right-items { width: 100%; } .mb90 { margin-bottom: 0.9rem !important; } .mt90 { margin-top: 0.9rem !important; } #news .news-box .news-detail { margin-top: 1.2rem; margin-bottom: 0.6rem; flex-wrap: wrap; } #news .news-box .news-detail .left-items { width: 100%; } #news .news-box .news-detail .left-items .title-box .title { font-size: 20px; line-height: 1.8em; } #news .news-box .news-detail .left-items .title-box .desc { font-size: 14px; margin-top: 0.2rem; } #news .news-box .news-detail .left-items .content { margin-top: 0.4rem; } .article-back { width: 2rem; height: 0.8rem; line-height: 0.8rem; margin-top: 0.7rem; } #news .news-box .news-detail .right-items { width: 100%; margin-top: 0.4rem; } #news .news-box .news-detail .right-items .p-items { padding: 0.2rem; } #news .news-box .news-detail .right-items .p-items .info-box .date { font-size: 16px; } #news .news-box .news-detail .right-items .p-items .info-box .title { font-size: 14px; } #news .news-box .news-detail .right-items .p-items .info-box .desc { font-size: 12px; margin-top: 0.1rem; } #news .news-box .news-detail .right-items .p-items .info-box .more { width: 2rem; height: 0.8rem; line-height: 0.8rem; font-size: 14px; background-size: 0; margin-top: 0.2rem; } #search .search-store { margin-top: 1.5rem; } #search .search-store .title { font-size: 22px; line-height: 22px; } #search .search-store .search-select { margin-top: 0.4rem; } #search .search-store .search-select .select-box { width: 45%; height: 0.8rem; } .ml20 { margin-left: 0.2rem !important; } #search .search-store .store-box { margin-top: 0.6rem; margin-bottom: 1rem; } #search .search-store .store-box .center { flex-wrap: wrap; } #search .search-store .store-box .center .store-pic { width: 100%; } #search .search-store .store-box .center .store-items { width: 100%; } #search .search-store .store-box .center .store-items .s-items { height: 1.5rem; } #search .search-store .store-box .center .store-items .s-items .info .t1 { font-size: 16px; } #search .search-store .store-box .center .store-items .s-items .info .t2 { font-size: 12px; } #search .search-store .store-box .center .store-items .s-items .pic { width: 0.8rem; } #responsibility .public-welfare .welfare-box { margin-top: 0.4rem; } #responsibility .public-welfare .welfare-box .welfare-items { flex-wrap: wrap; padding: 0.4rem 0; } #responsibility .public-welfare .welfare-box .welfare-items .left-items { width: 100%; flex-wrap: wrap; } #responsibility .public-welfare .welfare-box .welfare-items .left-items .date { width: 100%; margin-bottom: 0.4rem; } #responsibility .public-welfare .welfare-box .welfare-items .left-items .date .t1 { font-size: 24px; line-height: 24px; } #responsibility .public-welfare .welfare-box .welfare-items .left-items .date .t2 { font-size: 16px; line-height: 16px; } #responsibility .public-welfare .welfare-box .welfare-items .left-items .pic { width: 100%; } #responsibility .public-welfare .welfare-box .welfare-items .right-items { width: 100%; } #responsibility .public-welfare .welfare-box .welfare-items .right-items .more { width: 2rem; height: 0.8rem; line-height: 0.8rem; font-size: 14px; background-size: 0; margin-top: 0.2rem; } #responsibility .public-welfare .welfare-box .welfare-items .right-items .info { margin-top: 0.2rem; } #responsibility .public-welfare .welfare-box .welfare-items .right-items .title { font-size: 16px; line-height: 16px; } .mb150 { margin-bottom: 1.2rem !important; } #visited .visited-box .visit-access { margin-top: 1.5rem; margin-bottom: 0.5rem; } #visited .visited-box .visit-access .tops { flex-wrap: wrap; margin-bottom: 0.6rem; } #visited .visited-box .visit-access .tops .left { width: 100%; } #visited .visited-box .visit-access .tops .left .com-title-box { text-align: center; margin-bottom: 0.4rem; } #visited .visited-box .visit-access .tops .right { padding-left: 0; } #visited .visited-box .visit-access .tops .left:after { width: 0; } #visited .visited-box .visit-access .appointment .pic { width: 55%; } #visited .visited-box .visit-access .appointment .info { width: 45%; padding: 0.2rem; background-size: 30%; } #visited .visited-box .visit-access .appointment .info .arr { display: none; } #visited .visited-box .history-tour .com-title-box { background-color: #fff; padding-top: 0; height: auto; } #visited .visited-box .history-tour .history-items { margin-top: 0.6rem; justify-content: space-between; } #visited .visited-box .history-tour .history-items .h-items { width: 48%; margin-right: 0; margin-bottom: 0.2rem; } #visited .visited-box .history-tour .history-items .h-items .info-box .date, #visited .visited-box .history-tour .history-items .h-items .info-box .title { font-size: 16px; } #visited .visited-box .history-tour .history-items .h-items .info-box .more { width: 2rem; height: 0.8rem; line-height: 0.8rem; font-size: 14px; background-size: 0; margin-top: 0.2rem; } #visited .visited-box .history-tour .history-items .h-items .info-box .more:hover { padding-left: 0.2rem !important; } .mb120 { margin-bottom: 1.2rem !important; } #brand-detail .brand-detail .brand-tops { margin-top: 1rem; flex-wrap: wrap; } #brand-detail .brand-detail .brand-tops .com-title-box { width: 100%; text-align: center; } #brand-detail .brand-detail .brand-tops .info { width: 100%; text-align: center; font-size: 14px; margin-top: 0.4rem; } #brand-detail .brand-detail .brand-display { margin-top: 0.5rem; margin-bottom: 0.6rem; } #brand-detail .brand-detail .brand-display .display-items .text { font-size: 12px; text-align: center; bottom: 1rem; } .brand-bottom-box { margin-top: 0.5rem; padding: 0.5rem 0; } .brand-bottom-box .store-address { flex-direction: column; } .brand-bottom-box .store-address .store-items { margin-right: 0; } .brand-bottom-box .lines .select { width: 45%; height: 0.8rem; } .brand-bottom-box .store-address { margin-top: 0.6rem; } .brand-bottom-box .store-address .store-items { margin-top: 0.4rem; } .brand-bottom-box .store-address .store-items .t1 { font-size: 16px; line-height: 16px; margin-top: 0.3rem; } #brand-detail .brand-detail-three .desc-box .title { margin: 0.2rem 0; } #brand-detail .brand-detail-three .desc-box .desc { font-size: 14px; width: 100%; } #brand-detail .brand-detail-three .brand-story-three { flex-wrap: wrap; padding-left: 0; width: 91.3333%; margin: 0 auto; margin-top: 0.4rem; } #brand-detail .brand-detail-three .brand-story-three .left-items > img { width: 30%; } #brand-detail .brand-detail-three .brand-story-three .left-items > img.img02 { width: 35%; margin: 0.4rem 0; width: 65%; } #brand-detail .brand-detail-three .brand-story-three .right-items { width: 100%; margin-top: 0.4rem; } #brand-detail .brand-detail-three .video-display { margin-top: 0.8rem; margin-bottom: 1.7rem; } #brand-detail .brand-detail-three .brand-story-three .left-items { margin-right: 0; } #brand-detail .brand-detail-three .big-pic .text-box .en { font-size: 16px; line-height: 16px; } #brand-detail .brand-detail-three .big-pic .text-box .cn { font-size: 14px; line-height: 14px; } #brand-detail .brand-detail-three .small-pic { margin: 0.6rem 0; } #brand-detail .brand-detail-three .small-pic .text { font-size: 20px; } #brand-detail .brand-detail-three .video-display { flex-wrap: wrap; } #brand-detail .brand-detail-three .video-display .text-box { width: 100%; margin-left: 0; padding: 0.3rem 0 0.3rem 0; margin-top: 0.3rem; } #brand-detail .brand-detail-three .video-display .swiper-video { width: 100%; } #brand-detail .brand-detail-three .video-display .text-box .en { font-size: 20px; line-height: 20px; } #brand-detail .brand-detail-three .video-display .text-box .cn { font-size: 16px; line-height: 16px; margin-top: 0.2rem; } #brand-detail .brand-detail-three .video-display .text-box .btn-box .video-prev, #brand-detail .brand-detail-three .video-display .text-box .btn-box .video-next { width: 1rem; height: 1rem; } #brand-detail .brand-detail-three .small-pic { flex-wrap: wrap; } #brand-detail .brand-detail-three .small-pic .text { font-size: 16px; bottom: 0.6rem; } #brand-detail .brand-detail-three .small-pic .img { width: 100%; margin-bottom: 0.4rem; } #brand-detail .brand-detail-two .business-story { margin-top: 1rem; flex-wrap: wrap; margin-bottom: 1.2rem; } #brand-detail .brand-detail-two .business-story .left .com-title-box { width: 100%; text-align: center; margin-top: 0; } #brand-detail .brand-detail-two .business-story .left .info { margin-top: 0.5rem; padding-right: 0; font-size: 14px; } #brand-detail .brand-detail-two .business-story .right { width: 100%; margin-top: 0.6rem; } #brand-detail .brand-detail-two .business-story .right .box { width: 4rem; height: 3rem; bottom: -1.5rem; right: 0; left: unset; } #brand-detail .brand-detail-two .business-story .right .tag { width: 45%; bottom: -20px; left: 20%; } #brand-detail .brand-detail-two .product-style .pro-tops { flex-wrap: wrap; } #brand-detail .brand-detail-two .product-style .pro-tops .com-title-box { width: 100%; text-align: center; } #brand-detail .brand-detail-two .product-style .pro-tops .style-pagination { margin-top: 0.4rem; width: 100%; text-align: center; } #brand-detail .brand-detail-two .product-style .swiper-box { margin-top: 0.6rem; } #brand-detail .brand-detail-two .product-style .swiper-box .swiper-style .swiper-slide .text-box .num { font-size: 40px; } #brand-detail .brand-detail-two .news-product { height: 4rem; margin-top: 0.6rem; } #brand-detail .brand-detail-two .news-product .play-box { font-size: 18px; } #brand-detail .brand-detail-two .news-product .play-box .play-icon { width: 0.8rem; height: 0.8rem; } #brand-detail .brand-detail-two .news-product .play-box .text { margin-top: 0.4rem; } #brand-detail .brand-detail-two .product-style .swiper-box .swiper-style .swiper-slide .text-box { padding-left: 0.4rem; margin-top: -1rem; } #brand-detail .brand-detail-two .product-style .swiper-box .swiper-style .swiper-slide .text-box .text { margin-top: 1.5rem; margin-left: 0.2rem; } #brand-detail .brand-detail-two .product-style .swiper-box .swiper-style .swiper-slide .text-box .text .tt { font-size: 16px; } #brand-detail .brand-detail-two .product-style .swiper-box .swiper-style .swiper-slide .text-box .text .tt span { font-size: 20px; } #brand-detail .brand-detail-two .product-style .swiper-box .swiper-style .swiper-slide .text-box .text .info { font-size: 14px; } #brand-detail .brand-detail-two .picture-play { margin-top: 1rem; margin-bottom: 0.6rem; } #brand-detail .brand-detail-two .picture-play .pic-items { margin-bottom: 0.6rem; } .brand-bottom-box .store-address .store-items .t2 { margin-top: 0.2rem; } .join-form { width: 320px; padding: 20px; height: auto; } .join-form .line input { width: 200px; height: 25px; } .join-form .line button { width: 100%; float: initial; margin-top: 30px; } .join-form .line .label { font-size: 14px; } .join-form .line img { height: auto; } #brand-detail .brand-detail-two .picture-play .pic-items .mask .link { font-size: 14px; } #brand-detail .brand-detail-two .picture-play .pic-items .mask .left-icon, #brand-detail .brand-detail-two .picture-play .pic-items .mask .right-icon { width: 2px; } #brand-detail .brand-detail-two .picture-play .pic-items .mask .top-icon, #brand-detail .brand-detail-two .picture-play .pic-items .mask .bottom-icon { height: 2px; } #brand-detail .brand-detail-two .picture-play .pic-items .mask .link > a { width: 1.8rem; height: 0.7rem; line-height: 0.7rem; margin-top: 0.3rem; font-size: 14px; } .pro-cover .display-pic { width: 86.333333%; height: 4rem; } #contact .contact-box .contact-title > a { width: 1.5rem; height: 0.8rem; line-height: 0.8rem; font-size: 14px; margin-left: 0.2rem; } #brand-detail .brand-detail-two .product-style .pro-tops .style-pagination .swiper-pagination-bullet { font-size: 20px; margin-left: 0.8rem; } #brand-detail .brand-detail-two .product-style .pro-tops .style-pagination .swiper-pagination-bullet-active { font-size: 24px; } .menu-down-box .big-box { display: none; } #index .join-us-box .join-inner .index-map { height: 4rem; } #index .join-us-box .join-inner .form-box .form .lines.has-code input { width: 50%; } .menu-down-box .menu-box .items-box .items-top:hover { line-height: 1rem; } #index .logo-welcome { position: fixed; } #index .logo-welcome .img { width: 8rem; height: 5.26rem; position: absolute; animation: logo 2s; -webkit-animation: logo 2s; animation-fill-mode: forwards; top: 50%; left: 50%; margin-top: -2.63rem; margin-left: -4rem; position: relative; } #index .logo-welcome .img > i { position: absolute; display: block; animation-duration: 3s; } #index .logo-welcome .img .img01 { top: 0; left: 0; background-size: 3.41rem 1.63rem; width: 3.41rem; height: 1.63rem; background-image: url("../images/a.png"); } #index .logo-welcome .img .img02 { right: 0; top: 0; background-size: 4.34rem 1.63rem; width: 4.34rem; height: 1.63rem; background-image: url("../images/aa.png"); } #index .logo-welcome .img .img03 { left: 0; bottom: 0; background-size: 5.8rem 3.38rem; width: 5.8rem; height: 3.38rem; background-image: url("../images/aaa.png"); } #index .logo-welcome .img .img04 { right: 0; bottom: 0; background-size: 1.95rem 3.39rem; width: 1.95rem; height: 3.39rem; background-image: url("../images/aaaa.png"); } #brand-detail .brand-detail-three .brand-story-three .left-items .items.active:before { left: 0; } #brand-detail .brand-detail-three .brand-story-three .left-items .items .img-box { margin-left: 0.2rem; } #brand-detail .brand-detail-three .brand-story-three .left-items .items .text { left: 0.2rem; } #brand-detail .brand-detail-three .brand-story-three .left-items .items.img02 { margin: 1.5rem 0; } #brand-detail .brand-detail-three .brand-story-three .right-items { margin-top: 1rem; } #index .display-box .display-left { padding-top: 0.3rem; padding-bottom: 0.3rem; } #index .display-box .display-left .swiper-display-left .swiper-slide .pic-box > img { width: 2rem; margin-top: 0.4rem; } #news .news-box .news-content .top-items .n-items, #news .news-box .news-content .top-items .right { width: 100%; } #about .business-history .history-position .history-box .swiper-history-text { padding: 0 !important; } #brand-detail .brand-detail-two .product-style .swiper-box .swiper-style .swiper-slide.swiper-slide-active .text-box .num { font-size: 60px; line-height: 60px; } #about .business-history .history-position .history-box .swiper-history-text .swiper-wrapper { margin-left: 0; } #index .index-banner .index-inner .left-banner .swiper-pagination-index .swiper-pagination-bullet { font-size: 14px; margin-bottom: 8px; } #index .index-banner .index-inner .left-banner .swiper-pagination-index .swiper-pagination-bullet-active { font-size: 20px; } #index .index-banner .index-inner .left-banner .swiper-pagination-index { bottom: 10px; } .inner-banner > img { display: block; width: 100%; opacity: 0; } .inner-banner .text-box { margin-top: 1.4rem; } .inner-banner .text-box .text-img img { width: 15%; } .inner-banner .text-box .text { margin-top: 0.2rem; font-size: 16px; } .inner-banner .play-box img { width: 80%; } .inner-banner .play-box .play-icon { width: 30px; height: 30px; margin-top: 20px; } } @media screen and (max-width: 480px) { .video-layer .layui-layer-content { width: 300px !important; height: 169px !important; overflow: hidden !important; } } /*# sourceMappingURL=style.css.map */