html,body,h1,h2,h3,h4,h5,h6,p,ul,li,img,dl,dt,dd,table,th,td,div,label,button,input,textarea,select,footer,header,section,a,span{ margin:0; padding:0; -moz-box-sizing: border-box; box-sizing:border-box; overflow-scrolling: touch; -webkit-overflow-scrolling: touch; -webkit-tap-highlight-color: rgba(255,255,255,0); tap-highlight-color: rgba(255,255,255,0); } a{ text-decoration:none; color: #333; font-size: 14px; } img{ border:0; display: block; } input,select,textarea,button{ outline:none; resize: none; } *:focus{ outline:none; } input, select{ -webkit-appearance: none; } html,body{ -webkit-overflow-scrolling: touch; color: #333; font-size: 14px; } html{ /* scroll-padding-top: 60px; */ } body{ overflow-x: hidden; } @font-face { font-family: "osBold"; font-weight: normal; font-style: normal; src: url('../font/Oswald-Bold.ttf') format('truetype'); } @font-face { font-family: "osExtraLight"; font-weight: normal; font-style: normal; src: url('../font/Oswald-ExtraLight.ttf') format('truetype'); } @font-face { font-family: "osLight"; font-weight: normal; font-style: normal; src: url('../font/Oswald-Light.ttf') format('truetype'); } @font-face { font-family: "osMedium"; font-weight: normal; font-style: normal; src: url('../font/Oswald-Medium.ttf') format('truetype'); } @font-face { font-family: "osRegular"; font-weight: normal; font-style: normal; src: url('../font/Oswald-Regular.ttf') format('truetype'); } @font-face { font-family: "osSemiBold"; font-weight: normal; font-style: normal; src: url('../font/Oswald-SemiBold.ttf') format('truetype'); } .w12{ width: 1200px; margin: auto; } .overflow{ height: 100%; overflow: hidden; } .page{ overflow: hidden; } [v-cloak]{ display: none; } .section-footer{ margin-top: 120px; color: #666; font-size: 14px; } .section-footer a{ color: #666; } .section-footer .item1{ display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-align: start; -webkit-align-items: flex-start; -moz-box-align: start; -ms-flex-align: start; align-items: flex-start; -webkit-box-pack: justify; -webkit-justify-content: space-between; -moz-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; } .section-footer .item1 .col-1 .logo{ width: 150px; margin: 10px 0 42px 0; } .section-footer .item1 .col-1 p{ white-space: nowrap; margin-top: 10px; } .section-footer .item1 .col-2{ display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; white-space: nowrap; } .section-footer .item1 .col-2 dl{ margin-right: 40px; } .section-footer .item1 .col-2 dl:nth-child(5){ margin-right: 0; } .section-footer .item1 .col-2 dl dt{ margin-bottom: 20px; } .section-footer .item1 .col-2 dl dd{ margin-bottom: 16px; } .section-footer .item1 .col-2 dl dd a{ display: block; color: #999; font-size: 13px; margin-top: 16px; } .section-footer .item1 .col-3{ text-align: right; white-space: nowrap; display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-align: end; -webkit-align-items: flex-end; -moz-box-align: end; -ms-flex-align: end; align-items: flex-end; margin: 10px -12px 0 0; } .section-footer .item1 .col-3 .row1{ padding: 0 10px 11px 0; } .section-footer .item1 .col-3 b{ font-size: 13px; font-weight: bold; } .section-footer .item1 .col-3 dl{ margin-top: 20px; } .section-footer .item1 .col-3 dl dt{ margin-bottom: 5px; } .section-footer .item1 .col-3 .ewm{ width: 180px; } .section-footer .item2{ display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -webkit-justify-content: space-between; -moz-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-align: center; -webkit-align-items: center; -moz-box-align: center; -ms-flex-align: center; align-items: center; padding: 10px 0 50px; border-top: solid 1px #dbdbdb; } /*鍏叡澶撮儴*/ .section-header{ position: fixed; position: absolute; top: 0; left: 0; width: 100%; z-index: 99; color: #fff; background-position: center 0; background-repeat: no-repeat; -o-background-size: 100% auto; background-size: 100% auto; -o-background-size: cover; background-size: cover; } .section-header.fixed{ background-color: rgba(0,0,220,0.8); position: fixed; opacity: 0; -webkit-animation: fixed 0.3s ease-in-out 0s forwards; -moz-animation: fixed 0.3s ease-in-out 0s forwards; -o-animation: fixed 0.3s ease-in-out 0s forwards; animation: fixed 0.3s ease-in-out 0s forwards; } @-webkit-keyframes fixed{ from{ opacity: 1; -webkit-transform :translateY(-100px); transform :translateY(-100px); }to{ opacity: 1; -webkit-transform :translateY(0px); transform :translateY(0px); } } @-moz-keyframes fixed{ from{ opacity: 1; -moz-transform :translateY(-100px); transform :translateY(-100px); }to{ opacity: 1; -moz-transform :translateY(0px); transform :translateY(0px); } } @-o-keyframes fixed{ from{ opacity: 1; -o-transform :translateY(-100px); transform :translateY(-100px); }to{ opacity: 1; -o-transform :translateY(0px); transform :translateY(0px); } } @keyframes fixed{ from{ opacity: 1; -webkit-transform :translateY(-100px); -moz-transform :translateY(-100px); -o-transform :translateY(-100px); transform :translateY(-100px); }to{ opacity: 1; -webkit-transform :translateY(0px); -moz-transform :translateY(0px); -o-transform :translateY(0px); transform :translateY(0px); } } .section-header a{ color: #fff; } .section-header .top{ display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -moz-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: justify; -webkit-justify-content: space-between; -moz-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; height: 70px; position: relative; } .section-header .top-left .logo{ width: 105px; } .section-header .top-right{ display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -moz-box-align: center; -ms-flex-align: center; align-items: center; } .section-header .top-right .item1{ display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -moz-box-align: center; -ms-flex-align: center; align-items: center; } .section-header .top-right .item1 a{ font-size: 13px; opacity: 0.5; } .section-header .top-right .item1 .active{ opacity: 1; } .section-header .top-right .item1 .line{ width: 1px; height: 13px; background-color: #fff; margin: 0 9px; } .section-header .top-right .item2{ margin-left: 20px; } .section-header .top-right .item2 a{ display: block; width: 100px; height: 30px; line-height: 28px; border: solid 1px #fff; border-radius: 30px; text-align: center; font-size: 13px; } .section-header .navbar{ -webkit-box-flex: 1; -webkit-flex: 1; -moz-box-flex: 1; -ms-flex: 1; flex: 1; padding: 24px 9% 0; display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -webkit-justify-content: space-between; -moz-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; } .section-header .navbar .menu{ list-style: none; border-top: solid 1px rgba(255,255,255,0.5); width: 15%; position: relative; } .section-header .navbar .menu::before{ content: ""; display: block; position: absolute; left: 0; top: -1px; width: 0; height: 1px; background-color: #fff; -webkit-transition: width 0.6s ease-out; -o-transition: width 0.6s ease-out; -moz-transition: width 0.6s ease-out; transition: width 0.6s ease-out; } .section-header .navbar .menu .menu-handle{ display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -moz-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: justify; -webkit-justify-content: space-between; -moz-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; padding: 10px 0 15px; } .section-header .navbar .menu .text{ -webkit-box-flex: 1; -webkit-flex: 1; -moz-box-flex: 1; -ms-flex: 1; flex: 1; } .section-header .navbar .menu .arrow{ width: 9px; -webkit-transition: 0.5s; -o-transition: 0.5s; -moz-transition: 0.5s; transition: 0.5s; } .section-header .navbar .menu-drop{ list-style: none; position: absolute; left: 0; top: 52px; background-color: #fff; width: 100%; opacity: 0; visibility: hidden; -webkit-transition: 0.5s ease-out; -o-transition: 0.5s ease-out; -moz-transition: 0.5s ease-out; transition: 0.5s ease-out; -webkit-transform: translate(0, 40px); -moz-transform: translate(0, 40px); -ms-transform: translate(0, 40px); -o-transform: translate(0, 40px); transform: translate(0, 40px); border-top: 0; box-shadow: 0 0 5px #aaa; } .section-header .navbar .menu-drop li:nth-child(1) .sub-menu:before{ content: ""; display: block; position: absolute; top: -17px; left: 50%; -webkit-transform: translate(-50%, 0); -moz-transform: translate(-50%, 0); -ms-transform: translate(-50%, 0); -o-transform: translate(-50%, 0); transform: translate(-50%, 0); width: 0; height: 0; border: solid 8px transparent; border-bottom: solid 10px #fff; -webkit-transition: 0.3s; -o-transition: 0.3s; -moz-transition: 0.3s; transition: 0.3s; } .section-header .navbar .menu-drop li{ margin-bottom: -1px; } .section-header .navbar .menu-drop .sub-menu{ display: block; color: #000; text-align: center; padding: 20px 0; position: relative; } .section-header .navbar .menu-drop li:hover .sub-menu{ -webkit-transition: background-color 0.3s; -o-transition: background-color 0.3s; -moz-transition: background-color 0.3s; transition: background-color 0.3s; background-color: #0000dc; color: #fff; margin: 0 -1px; } .section-header .navbar .menu-drop li:hover .sub-menu::before{ border-bottom-color: #0000dc; } .section-header .navbar .menu:hover::before{ width: 100%; } .section-header .navbar .menu:hover .menu-drop{ opacity: 1; visibility: visible; -webkit-transform: translate(0, 0); -moz-transform: translate(0, 0); -ms-transform: translate(0, 0); -o-transform: translate(0, 0); transform: translate(0, 0); } .section-header .navbar .menu-handle:hover .arrow{ -webkit-transform: rotate(180deg); -moz-transform: rotate(180deg); -ms-transform: rotate(180deg); -o-transform: rotate(180deg); transform: rotate(180deg); } /* 棣栭〉 */ .page-index{ position: relative; } .page-index .section-banner{ position: relative; overflow: hidden; height: 870px; background-position: center 0; background-repeat: no-repeat; -o-background-size: cover; background-size: cover; } .page-index .section-banner .banner{ width: 100%; height: 100%; display: none; } .page-index .section-banner .img-mobile{ width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; display: none; } .page-index .section-banner .content{ position: absolute; top: 170px; left: 50%; -webkit-transform: translate(-50%, 0); -moz-transform: translate(-50%, 0); -ms-transform: translate(-50%, 0); -o-transform: translate(-50%, 0); transform: translate(-50%, 0); color: #fff; } .page-index .section-banner .content h1{ line-height: 60px; font-size: 50px; font-weight: 600; } .page-index .section-banner .content h6{ font-size: 20px; font-weight: normal; margin-top: 15px; } .page-index .section-banner .content-detail{ position: relative; } .page-index .section-banner .detail{ white-space: nowrap; margin-top: 100px; overflow: hidden; } .page-index .section-banner .detail .list{ width: 248px; height: 140px; list-style: none; margin-right: 20px; overflow: hidden; position: relative; display: inline-block; background-color: #fff; } .page-index .section-banner .detail .list .blank{ width: 100%; height: 100%; position: absolute; left: 0; bottom: 35%; background-color: #fff; z-index: 2; -webkit-transition: ease-out 0.3s 0.05s; -o-transition: ease-out 0.3s 0.05s; -moz-transition: ease-out 0.3s 0.05s; transition: ease-out 0.3s 0.05s; } .page-index .section-banner .detail .list .img{ width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; position: absolute; left: 0; top: 65%; -webkit-transition: ease-out 0.3s; -o-transition: ease-out 0.3s; -moz-transition: ease-out 0.3s; transition: ease-out 0.3s; z-index: 1; } .page-index .section-banner .detail .list .text{ color: #333; padding: 15px; position: relative; z-index: 3; -webkit-transition: 0.1s 0.3s; -o-transition: 0.1s 0.3s; -moz-transition: 0.1s 0.3s; transition: 0.1s 0.3s; } .page-index .section-banner .detail .list .text .no{ display: block; color: #999; font-weight: bold; margin-top: 8px; font-family: osMedium; -webkit-transition: 0.1s 0.3s; -o-transition: 0.1s 0.3s; -moz-transition: 0.1s 0.3s; transition: 0.1s 0.3s; } .page-index .section-banner .detail .list .more{ width: 40px; height: 40px; border-radius: 50%; background-color: #0000dc; position: absolute; right: 30px; top: 56%; z-index: 3; background-image: url(../images/arrow2.png); background-repeat: no-repeat; background-position: center center; -o-background-size: 7px auto; background-size: 7px auto; -webkit-transition: 0.3s; -o-transition: 0.3s; -moz-transition: 0.3s; transition: 0.3s; } .page-index .section-banner .list-more{ display: block; width: 40px; height: 40px; border-radius: 50%; background-color: #fff; position: absolute; right: 0; bottom: 0; z-index: 3; background-image: url(../images/arrow3.png); background-repeat: no-repeat; background-position: center center; -o-background-size: 8px auto; background-size: 8px auto; -webkit-transition: 0.3s; -o-transition: 0.3s; -moz-transition: 0.3s; transition: 0.3s; } .page-index .section-banner .detail .list:hover .blank{ bottom: 100%; } .page-index .section-banner .detail .list:hover .text{ color: #fff; } .page-index .section-banner .detail .list:hover .text .no{ color: #fff; } .page-index .section-banner .detail .list:hover .img{ top: 0; } .page-index .section-banner .detail .list:hover .more{ background-color: #fff; background-image: url(../images/arrow4.png); } .page-index .section-banner .list-more:hover{ background-color: #0000dc; background-image: url(../images/arrow.png); } /*-------- 闆嗗洟姒傚喌 ----------*/ .page-index .section-about-us{ margin-top: 110px; } .page-index .section-about-us .item1{ display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; } .page-index .section-about-us .item1 p{ line-height: 24px; } .page-index .section-about-us .item1 .left{ display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -webkit-justify-content: space-between; -moz-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; margin-top: 15px; } .page-index .section-about-us .item1 .left dl{ margin-right: 60px; color: #666; white-space: nowrap; } .page-index .section-about-us .item1 .left dt{ font-size: 24px; height: 50px; overflow: hidden; } .page-index .section-about-us .item1 .left .num{ display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-align: start; -webkit-align-items: flex-start; -moz-box-align: start; -ms-flex-align: start; align-items: flex-start; } .page-index .section-about-us .item1 .left b{ font-size: 54px; color: #0000dc; font-family: osMedium; font-weight: normal; height: 50px; line-height: 50px; width: 28px; text-align: center; } .page-index .section-about-us .item1 .left i{ font-style: normal; margin-top: 7px; margin-left: 4px; } .page-index .section-about-us .item1 .left dd{ text-align: center; font-size: 20px; margin-top: 15px; } .page-index .section-about-us .item1 .left dl:nth-child(1) dt{ font-size: 16px; } .page-index .section-about-us .item1 .jump .num:nth-child(1){ margin-top: 55px; } .page-index .section-about-us .item1 .jump:nth-child(1) i{ margin-top: 12px; } .page-index .section-about-us .item1 .jump.active i{ -webkit-transform: translate(0, -42px); -moz-transform: translate(0, -42px); -ms-transform: translate(0, -42px); -o-transform: translate(0, -42px); transform: translate(0, -42px); -webkit-transition: 0.9s ease-out 1.2s; -o-transition: 0.9s ease-out 1.2s; -moz-transition: 0.9s ease-out 1.2s; transition: 0.9s ease-out 1.2s; } .page-index .section-about-us .item1 .jump.active .num:nth-child(1) b:nth-child(1){ -webkit-transform: translate(0, -158px); -moz-transform: translate(0, -158px); -ms-transform: translate(0, -158px); -o-transform: translate(0, -158px); transform: translate(0, -158px); -webkit-transition: 0.9s ease-out; -o-transition: 0.9s ease-out; -moz-transition: 0.9s ease-out; transition: 0.9s ease-out; } .page-index .section-about-us .item1 .jump.active .num:nth-child(1) b:nth-child(2){ -webkit-transform: translate(0, -158px); -moz-transform: translate(0, -158px); -ms-transform: translate(0, -158px); -o-transform: translate(0, -158px); transform: translate(0, -158px); -webkit-transition: 0.9s ease-out 0.2s; -o-transition: 0.9s ease-out 0.2s; -moz-transition: 0.9s ease-out 0.2s; transition: 0.9s ease-out 0.2s; } .page-index .section-about-us .item1 .jump.active .num:nth-child(1) b:nth-child(3){ -webkit-transform: translate(0, -158px); -moz-transform: translate(0, -158px); -ms-transform: translate(0, -158px); -o-transform: translate(0, -158px); transform: translate(0, -158px); -webkit-transition: 0.9s ease-out 0.3s; -o-transition: 0.9s ease-out 0.3s; -moz-transition: 0.9s ease-out 0.3s; transition: 0.9s ease-out 0.3s; } .page-index .section-about-us .item1 .jump.active .num:nth-child(1) b:nth-child(4){ -webkit-transform: translate(0, -158px); -moz-transform: translate(0, -158px); -ms-transform: translate(0, -158px); -o-transform: translate(0, -158px); transform: translate(0, -158px); -webkit-transition: 0.9s ease-out 0.4s; -o-transition: 0.9s ease-out 0.4s; -moz-transition: 0.9s ease-out 0.4s; transition: 0.9s ease-out 0.4s; } .page-index .section-about-us .item1 .jump.active .num:nth-child(1) b:nth-child(5){ -webkit-transform: translate(0, -158px); -moz-transform: translate(0, -158px); -ms-transform: translate(0, -158px); -o-transform: translate(0, -158px); transform: translate(0, -158px); -webkit-transition: 0.9s ease-out 0.5s; -o-transition: 0.9s ease-out 0.5s; -moz-transition: 0.9s ease-out 0.5s; transition: 0.9s ease-out 0.5s; } .page-index .section-about-us .item1 .jump.active .num:nth-child(2) b:nth-child(1){ -webkit-transform: translate(0, -158px); -moz-transform: translate(0, -158px); -ms-transform: translate(0, -158px); -o-transform: translate(0, -158px); transform: translate(0, -158px); -webkit-transition: 1.1s ease-out; -o-transition: 1.1s ease-out; -moz-transition: 1.1s ease-out; transition: 1.1s ease-out; } .page-index .section-about-us .item1 .jump.active .num:nth-child(2) b:nth-child(2){ -webkit-transform: translate(0, -158px); -moz-transform: translate(0, -158px); -ms-transform: translate(0, -158px); -o-transform: translate(0, -158px); transform: translate(0, -158px); -webkit-transition: 1.1s ease-out 0.2s; -o-transition: 1.1s ease-out 0.2s; -moz-transition: 1.1s ease-out 0.2s; transition: 1.1s ease-out 0.2s; } .page-index .section-about-us .item1 .jump.active .num:nth-child(2) b:nth-child(3){ -webkit-transform: translate(0, -158px); -moz-transform: translate(0, -158px); -ms-transform: translate(0, -158px); -o-transform: translate(0, -158px); transform: translate(0, -158px); -webkit-transition: 1.1s ease-out 0.3s; -o-transition: 1.1s ease-out 0.3s; -moz-transition: 1.1s ease-out 0.3s; transition: 1.1s ease-out 0.3s; } .page-index .section-about-us .item1 .jump.active .num:nth-child(2) b:nth-child(4){ -webkit-transform: translate(0, -158px); -moz-transform: translate(0, -158px); -ms-transform: translate(0, -158px); -o-transform: translate(0, -158px); transform: translate(0, -158px); -webkit-transition: 1.1s ease-out 0.4s; -o-transition: 1.1s ease-out 0.4s; -moz-transition: 1.1s ease-out 0.4s; transition: 1.1s ease-out 0.4s; } .page-index .section-about-us .item1 .jump.active .num:nth-child(2) b:nth-child(5){ -webkit-transform: translate(0, -158px); -moz-transform: translate(0, -158px); -ms-transform: translate(0, -158px); -o-transform: translate(0, -158px); transform: translate(0, -158px); -webkit-transition: 1.1s ease-out 0.5s; -o-transition: 1.1s ease-out 0.5s; -moz-transition: 1.1s ease-out 0.5s; transition: 1.1s ease-out 0.5s; } .page-index .section-about-us .item1 .jump.active .num:nth-child(3) b:nth-child(1){ -webkit-transform: translate(0, -158px); -moz-transform: translate(0, -158px); -ms-transform: translate(0, -158px); -o-transform: translate(0, -158px); transform: translate(0, -158px); -webkit-transition: 1.3s ease-out; -o-transition: 1.3s ease-out; -moz-transition: 1.3s ease-out; transition: 1.3s ease-out; } .page-index .section-about-us .item1 .jump.active .num:nth-child(3) b:nth-child(2){ -webkit-transform: translate(0, -158px); -moz-transform: translate(0, -158px); -ms-transform: translate(0, -158px); -o-transform: translate(0, -158px); transform: translate(0, -158px); -webkit-transition: 1.3s ease-out 0.2s; -o-transition: 1.3s ease-out 0.2s; -moz-transition: 1.3s ease-out 0.2s; transition: 1.3s ease-out 0.2s; } .page-index .section-about-us .item1 .jump.active .num:nth-child(3) b:nth-child(3){ -webkit-transform: translate(0, -158px); -moz-transform: translate(0, -158px); -ms-transform: translate(0, -158px); -o-transform: translate(0, -158px); transform: translate(0, -158px); -webkit-transition: 1.3s ease-out 0.3s; -o-transition: 1.3s ease-out 0.3s; -moz-transition: 1.3s ease-out 0.3s; transition: 1.3s ease-out 0.3s; } .page-index .section-about-us .item1 .jump.active .num:nth-child(3) b:nth-child(4){ -webkit-transform: translate(0, -158px); -moz-transform: translate(0, -158px); -ms-transform: translate(0, -158px); -o-transform: translate(0, -158px); transform: translate(0, -158px); -webkit-transition: 1.3s ease-out 0.4s; -o-transition: 1.3s ease-out 0.4s; -moz-transition: 1.3s ease-out 0.4s; transition: 1.3s ease-out 0.4s; } .page-index .section-about-us .item1 .jump.active .num:nth-child(3) b:nth-child(5){ -webkit-transform: translate(0, -158px); -moz-transform: translate(0, -158px); -ms-transform: translate(0, -158px); -o-transform: translate(0, -158px); transform: translate(0, -158px); -webkit-transition: 1.3s ease-out 0.5s; -o-transition: 1.3s ease-out 0.5s; -moz-transition: 1.3s ease-out 0.5s; transition: 1.3s ease-out 0.5s; } .page-index .section-about-us .item1 .right{ margin-top: 20px; } .page-index .section-about-us .item1 .right p{ font-size: 15px; line-height: 32px; text-align: justify; } .page-index .section-about-us .item1 .right .more{ font-size: 16px; font-family: osMedium; color: #0000dc; display: inline-block; padding-right: 15px; background-image: url(../images/arrow4.png); background-repeat: no-repeat; background-position: right 9px; -o-background-size: 6px auto; background-size: 6px auto; margin-top: 10px; position: relative; } .page-index .section-about-us .item1 .right .more .line{ display: block; position: absolute; left: 0; top: 30px; width: 0; height: 1px; background-color: #0000dc; opacity: 0; -webkit-transition: 0.5s ease-out; -o-transition: 0.5s ease-out; -moz-transition: 0.5s ease-out; transition: 0.5s ease-out; } .page-index .section-about-us .item1 .right .more:hover .line{ opacity: 1; width: 100%; } .page-index .section-about-us .item2{ position: relative; } .page-index .section-about-us .item2 .map{ width: 72%; margin-top: 50px; } .page-index .section-about-us .item2 .imgbox{ position: absolute; right: 0; bottom: 30px; width: 36%; } .page-index .section-about-us .item2 .imgbox .img{ width: 100%; } .page-index .section-about-us .item2 .imgbox::after{ content: ''; display: block; position: absolute; left: -30px; top: 0; width: 106.8%; height: 1px; background-color: rgba(0,0,0,0.5); } .page-index .section-about-us .item2 .imgbox .circle{ position: absolute; left: -130px; top: -49px; width: 100px; height: 100px; background-color: rgba(0,0,220,0.8); border-radius: 50%; -webkit-transition: 1.2s 0.6s; -o-transition: 1.2s 0.6s; -moz-transition: 1.2s 0.6s; transition: 1.2s 0.6s; -webkit-transform: scale(0); -moz-transform: scale(0); -ms-transform: scale(0); -o-transform: scale(0); transform: scale(0); opacity: 0; } .page-index .section-about-us .item2 .imgbox .circle .dian{ position: absolute; left: 50%; top: 50%; margin: -7px 0 0 -7px; width: 13px; height: 13px; background-color: #fff; border-radius: 50%; } .page-index .section-about-us .item2 .imgbox .circle .line{ position: absolute; left: 50%; top: 50%; margin: -1px 0 0 0; width: 61px; height: 1px; background-color: #fff; } .page-index .section-about-us .item2 .imgbox dl{ position: absolute; bottom: 25px; right: 30px; color: #fff; text-align: right; } .page-index .section-about-us .item2 .imgbox dd{ margin-top: 10px; } .page-index .section-about-us .item2 .imgbox dl a{ color: #fff; opacity: 0.8; } .page-index .section-about-us .item2 .imgbox dl a:hover{ opacity: 1; text-decoration: underline; } .page-index .section-about-us .item2 .imgbox2{ position: absolute; left: -108px; top: 182px; white-space: nowrap; } .page-index .section-about-us .item2 .imgbox2::after{ content: ''; display: block; position: absolute; left: 140px; top: -19px; width: 371px; height: 1px; background-color: rgba(0,0,0,0.5); } .page-index .section-about-us .item2 .imgbox2 .circle{ position: absolute; left: 510px; top: -30px; width: 22px; height: 22px; background-color: rgba(0,0,220,0.8); border-radius: 50%; -webkit-transition: 1.2s; -o-transition: 1.2s; -moz-transition: 1.2s; transition: 1.2s; -webkit-transform: scale(0); -moz-transform: scale(0); -ms-transform: scale(0); -o-transform: scale(0); transform: scale(0); opacity: 0; } .page-index .section-about-us .item2 .imgbox2 .circle .dian{ position: absolute; left: 50%; top: 50%; margin: -3px 0 0 -3px; width: 6px; height: 6px; background-color: #fff; border-radius: 50%; } .page-index .section-about-us .item2 .imgbox2 .circle .line{ position: absolute; left: 0; top: 50%; margin: -1px 0 0 0; width: 12px; height: 1px; background-color: #fff; z-index: 2; } .page-index .section-about-us .item2 .imgbox2 dl{ position: absolute; top: -10px; left: 140px; } .page-index .section-about-us .item2 .imgbox2 dd{ margin-top: 5px; } .page-index .section-about-us .item2 .imgbox2 dl a{ color: #999; font-size: 22px; } .page-index .section-about-us .item2.active .circle{ -webkit-transform: scale(1); -moz-transform: scale(1); -ms-transform: scale(1); -o-transform: scale(1); transform: scale(1); opacity: 1; } /*鐏*/ .page-index .section-product{ margin-top: 110px; background-color: #0000dc; color: #fff; padding: 60px 0 0; position: relative; } .page-index .section-product .bg-left{ position: absolute; left: 0; top: 0; width: 40%; } .page-index .section-product .bg-right{ position: absolute; right: 0; bottom: 0; width: 22%; } .page-index .section-product li{ list-style: none; } .page-index .section-product .content{ position: relative; } .page-index .section-product .title{ font-size: 24px; font-weight: normal; border-bottom: solid 1px #fff; padding: 18px 0; } .page-index .section-product .tabs{ display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; padding: 18px 0; } .page-index .section-product .tabs a{ display: block; border: solid 1px #fff; border-radius: 40px; width: 100px; height: 35px; line-height: 33px; text-align: center; color: #fff; font-size: 16px; margin-right: 30px; -webkit-transition: 0.3s; -o-transition: 0.3s; -moz-transition: 0.3s; transition: 0.3s; } .page-index .section-product .tabs .active a{ background-color: #fff; color: #0000dc; } .page-index .section-product .content-huojian{ display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; height: 850px; overflow: hidden; } .page-index .section-product .item-left{ width: 50%; padding: 80px 0 0; } .page-index .section-product .item-left h1{ font-size: 70px; font-weight: normal; } .page-index .section-product .item-left h1 b{ font-family: osMedium; font-weight: normal; } .page-index .section-product .item-left p{ font-size: 16px; line-height: 30px; padding: 18px 0; width: 445px; } .page-index .section-product .item-left .more{ font-size: 16px; color: rgba(255,255,255,0.9); display: inline-block; padding-right: 15px; background-image: url(../images/arrow2.png); background-repeat: no-repeat; background-position: right 10px; -o-background-size: 6px auto; background-size: 6px auto; margin-top: 8px; font-family: osMedium; position: relative; } .page-index .section-product .item-left .more .line{ display: block; position: absolute; left: 0; top: 30px; width: 0; height: 1px; background-color: #fff; opacity: 0; -webkit-transition: 0.5s ease-out; -o-transition: 0.5s ease-out; -moz-transition: 0.5s ease-out; transition: 0.5s ease-out; } .page-index .section-product .item-left .more:hover .line{ opacity: 1; width: 100%; } .page-index .section-product .item-huojian{ -webkit-box-flex: 1; -webkit-flex: 1; -moz-box-flex: 1; -ms-flex: 1; flex: 1; } .page-index .section-product .item-huojian .huojianBox{ position: relative; } .page-index .section-product .item-huojian .huojian{ position: relative; width: 200px; } .page-index .section-product .item-huojian .huojian0{ width: 100%; margin-left: -16px; } .page-index .section-product .item-huojian .node{ width: 100%; position: absolute; left: 0; } .page-index .section-product .item-huojian .node .hj{ width: 100%; } .page-index .section-product .item-huojian .node .circle{ position: absolute; width: 42px; height: 42px; background-color: rgba(255,255,255,1); border-radius: 50%; } .page-index .section-product .item-huojian .node .circle::after{ content: ""; display: block; position: absolute; left: 50%; top: 50%; margin: -1px 0 0 0; width: 470px; height: 1px; background-color: #fff; } .page-index .section-product .item-huojian .node .circle .dian{ position: absolute; left: 50%; top: 50%; margin: -4px 0 0 -4px; width: 8px; height: 8px; background-color: #0000dc; border-radius: 50%; } .page-index .section-product .item-huojian .node .circle .line{ position: absolute; left: 50%; top: 50%; margin: -1px 0 0 0; width: 21px; height: 1px; background-color: #0000dc; z-index: 2; } .page-index .section-product .item-huojian .node .text{ position: absolute; white-space: nowrap; text-align: right; } .page-index .section-product .item-huojian .node .text span{ display: block; } .page-index .section-product .item-huojian .node .text .r1{ margin: -6px 0 15px 0; } .page-index .section-product .item-huojian .node .text .r2{ font-size: 68px; font-family: osMedium; } .page-index .section-product .item-huojian .node .text sup{ font-size: 40px; vertical-align: 30px; } .page-index .section-product .item-huojian .node1{ top: 0; } .page-index .section-product .item-huojian .node1 .circle{ left: 110px; top: 110px; } .page-index .section-product .item-huojian .node1 .text{ left: 433px; top: 109px; } .page-index .section-product .item-huojian .node2{ top: 291px; } .page-index .section-product .item-huojian .node2 .circle::after{ width: 340px; } .page-index .section-product .item-huojian .node2 .circle{ left: 110px; top: 100px; } .page-index .section-product .item-huojian .node2 .text{ left: 305px; top: 100px; } .page-index .section-product .item-huojian .node3{ top: 620px; } .page-index .section-product .item-huojian .node3 .circle::after{ left: -300px; width: 300px; } .page-index .section-product .item-huojian .node3 .circle{ left: 30px; top: -30px; } .page-index .section-product .item-huojian .node3 .circle .line{ left: 0; } .page-index .section-product .item-huojian .node3 .text{ left: -270px; top: -30px; text-align: left; } .page-index .section-product .content-fadongji{ display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; height: 850px; } .page-index .section-product .content-fadongji .item-left h1{ margin-bottom: 50px; font-size: 58px; } .page-index .section-product .content-fadongji .item-left p{ line-height: 30px; padding: 0; } .page-index .section-product .content-fadongji .item-left .more{ margin-top: 100px; } .page-index .section-product .content-fadongji .huojian{ width: 400px; margin-top: 90px; } .page-index .section-product .content-fadongji .item-huojian .node1{ top: -60px; left: 32px; } .page-index .section-product .content-fadongji .item-huojian .node1 .circle::after{ width: 402px; } .page-index .section-product .content-fadongji .item-huojian .node1 .circle{ left: 145px; } .page-index .section-product .content-fadongji .item-huojian .node1 .text{ left: 474px; } .page-index .section-product .content-fadongji .item-huojian .node2{ top: 225px; left: 32px; } .page-index .section-product .content-fadongji .item-huojian .node2 .circle::after{ width: 340px; } .page-index .section-product .content-fadongji .item-huojian .node2 .circle{ left: 145px; } .page-index .section-product .content-fadongji .item-huojian .node2 .text{ left: 375px; } .page-index .section-product .content-fadongji .item-huojian .node3{ top: 540px; left: 90px; } .page-index .section-product .content-item{ display: none; } .page-index .section-product .content-item.active{ display: block; } .page-index .section-product .list-more{ position: absolute; left: 0; bottom: 90px; display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; } .page-index .section-product .list-more a{ width: 60px; height: 60px; border-radius: 50%; border: solid 2px #fff; background-repeat: no-repeat; background-position: center center; -o-background-size: 10px auto; background-size: 10px auto; background-image: url(../images/arrow7.png); margin-right: 18px; -webkit-transition: 0.3s; -o-transition: 0.3s; -moz-transition: 0.3s; transition: 0.3s; } .page-index .section-product .list-more a:nth-child(2){ background-image: url(../images/arrow2.png); } .page-index .section-product .list-more a:nth-child(1):hover{ background-color: #fff; background-image: url(../images/arrow5.png); } .page-index .section-product .list-more a:nth-child(2):hover{ background-color: #fff; background-image: url(../images/arrow4.png); } .page-index .section-product .list-more a:nth-child(1).active{ background-color: #fff; background-image: url(../images/arrow5.png); } .page-index .section-product .list-more a:nth-child(2).active{ background-color: #fff; background-image: url(../images/arrow4.png); } /*鏂伴椈涓績*/ .page-index .section-news{ margin-top: 130px; overflow: hidden; padding-bottom: 30px; } .page-index .section-news .header{ display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -webkit-justify-content: space-between; -moz-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-align: center; -webkit-align-items: center; -moz-box-align: center; -ms-flex-align: center; align-items: center; border-bottom: solid 1px #dbdbdb; padding: 20px 0; } .page-index .section-news .header .title{ font-size: 24px; font-weight: normal; -webkit-box-flex: 1; -webkit-flex: 1; -moz-box-flex: 1; -ms-flex: 1; flex: 1; } .page-index .section-news .header .more{ font-size: 16px; font-family: osMedium; color: #0000dc; display: inline-block; padding-right: 15px; background-image: url(../images/arrow4.png); background-repeat: no-repeat; background-position: right 10px; -o-background-size: 6px auto; background-size: 6px auto; margin: 1px 40px 0 0; position: relative; } .page-index .section-news .header .more .line{ display: block; position: absolute; left: 0; top: 30px; width: 0; height: 1px; background-color: #0000dc; opacity: 0; -webkit-transition: 0.5s ease-out; -o-transition: 0.5s ease-out; -moz-transition: 0.5s ease-out; transition: 0.5s ease-out; } .page-index .section-news .header .more:hover .line{ opacity: 1; width: 100%; } .page-index .section-news .list-more{ display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; } .page-index .section-news .list-more a{ width: 60px; height: 60px; border-radius: 50%; border: solid 2px #333; background-repeat: no-repeat; background-position: center center; -o-background-size: 10px auto; background-size: 10px auto; background-image: url(../images/arrow8.png); margin-right: 18px; opacity: 1; position: static; margin-top: 0; pointer-events: auto; -webkit-transition: 0.3s; -o-transition: 0.3s; -moz-transition: 0.3s; transition: 0.3s; } .page-index .section-news .list-more .swiper-button-next{ border: solid 2px #333; background-image: url(../images/arrow6.png); } .page-index .section-news .list-more .swiper-button-prev:hover{ background-color: #0000dc; border: solid 2px #0000dc; background-image: url(../images/arrow7.png); } .page-index .section-news .list-more .swiper-button-next:hover{ background-color: #0000dc; border: solid 2px #0000dc; background-image: url(../images/arrow2.png); } .page-index .section-news .content{ position: relative; margin-top: 60px; height: 410px; padding-left: -webkit-calc( (100% - 1200px)/2 ); padding-left: -moz-calc( (100% - 1200px)/2 ); padding-left: calc( (100% - 1200px)/2 ); overflow: hidden; } .page-index .section-news .swiper-container{ overflow: visible; } .page-index .section-news .list{ list-style: none; width: 360px; height: 410px; display: inline-block; vertical-align: top; overflow: hidden; margin-right: 30px; } .page-index .section-news .list .inner{ display: block; height: 100%; background-color: #f8f8f9; padding: 30px 30px 10px; cursor: pointer; overflow: hidden; position: relative; } .page-index .section-news .list .blank{ width: 100%; height: 100%; position: absolute; left: 0; top: 100%; background-color: #0000dc; -webkit-transition: ease-out 0.3s; -o-transition: ease-out 0.3s; -moz-transition: ease-out 0.3s; transition: ease-out 0.3s; } .page-index .section-news .list .img{ width: 100%; height: 50%; -o-object-fit: cover; object-fit: cover; position: absolute; left: 0; top: 0; opacity: 0; } .page-index .section-news .list .top{ height: 68%; position: relative; font-size: 18px; } .page-index .section-news .list .top h3{ font-weight: normal; white-space: pre-wrap; position: relative; } .page-index .section-news .list .bottom{ font-family: osMedium; height: 32%; position: relative; border-top: solid 1px #dbdbdb; display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -webkit-justify-content: space-between; -moz-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-align: center; -webkit-align-items: center; -moz-box-align: center; -ms-flex-align: center; align-items: center; } .page-index .section-news .list .bottom .t1{ font-size: 80px; color: #0000dc; } .page-index .section-news .list .bottom .t2{ text-align: center; margin-top: -15px; } .page-index .section-news .list .bottom .t2 span{ font-size: 18px; display: block; } .page-index .section-news .list .bottom .t2 .s2{ color: #999; margin-top: -5px; } .page-index .section-news .list:hover .img{ -webkit-transform: scale(1.1); -moz-transform: scale(1.1); -ms-transform: scale(1.1); -o-transform: scale(1.1); transform: scale(1.1); opacity: 1; -webkit-transition: 0.5s ease-out 0.3s; -o-transition: 0.5s ease-out 0.3s; -moz-transition: 0.5s ease-out 0.3s; transition: 0.5s ease-out 0.3s; } .page-index .section-news .list:hover .blank{ /* bottom: 100%; */ top: 50%; } .page-index .section-news .list:hover .top{ color: #fff; /* top: 55%; white-space: nowrap; overflow : hidden; width: 100%; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 1; -o-text-overflow: ellipsis; text-overflow: ellipsis; */ } .page-index .section-news .list:hover .top h3{ font-weight: normal; white-space: nowrap; overflow: hidden; -o-text-overflow: ellipsis; text-overflow: ellipsis; color: #fff; top: 81%; } .page-index .section-news .list:hover .bottom .t1{ color: #fff; } .page-index .section-news .list:hover .bottom .t2 span{ color: #fff; } .page-index .swiper-container .list-arrow{ width: 80px; position: relative; } .page-index .section-news .list-arrow .inner{ display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -moz-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -webkit-justify-content: center; -moz-box-pack: center; -ms-flex-pack: center; justify-content: center; height: 100%; background-color: #f8f8f9; cursor: pointer; } .page-index .section-news .list-arrow .inner .arrow{ width: 22px; } .page-index .section-news .list-arrow .inner:hover{ background-color: #eee; } .page-index .section-news .swiper-pagination{ height: 2px; top: 20px; position: relative; margin: auto; } .page-index .section-news .swiper-pagination-progressbar .swiper-pagination-progressbar-fill{ background: #0000dc; } /*鍔犲叆鎴戜滑*/ .page-index .section-join-us{ margin-top: 120px; position: relative; } .page-index .section-join-us .inner{ position: absolute; left: 50%; -webkit-transform: translate(-50%, 0); -moz-transform: translate(-50%, 0); -ms-transform: translate(-50%, 0); -o-transform: translate(-50%, 0); transform: translate(-50%, 0); z-index: 2; } .page-index .section-join-us .header{ position: absolute; top: 80px; left: 0; width: 47%; } .page-index .section-join-us .header .title{ font-size: 24px; font-weight: normal; color: #fff; border-bottom: solid 1px #dbdbdb; padding: 18px 0; } .page-index .section-join-us .list-more{ display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; padding: 45px 0 65px; } .page-index .section-join-us .list-more a{ width: 60px; height: 60px; border-radius: 50%; border: solid 2px #fff; background-repeat: no-repeat; background-position: center center; -o-background-size: 10px auto; background-size: 10px auto; background-image: url(../images/arrow7.png); margin-right: 18px; opacity: 1; position: static; margin-top: 0; pointer-events: all; } .page-index .section-join-us .list-more .swiper-button-prev:hover{ background-color: #fff; background-image: url(../images/arrow5.png); } .page-index .section-join-us .list-more .swiper-button-next{ background-image: url(../images/arrow2.png); } .page-index .section-join-us .list-more .swiper-button-next:hover{ background-color: #fff; background-image: url(../images/arrow4.png); } .page-index .section-join-us .swiper-container{ position: absolute; top: 250px; left: 0; width: 47%; } .page-index .section-join-us .swiper-slide{ padding-right: 48%; } .page-index .section-join-us .swiper-slide p{ font-size: 16px; line-height: 30px; color: #fff; text-align: justify; } .page-index .section-join-us .swiper-slide .more{ font-family: osMedium; font-size: 16px; color: rgba(255,255,255,0.9); display: inline-block; padding-right: 20px; background-image: url(../images/arrow2.png); background-repeat: no-repeat; background-position: right 10px; -o-background-size: 6px auto; background-size: 6px auto; margin-top: 120px; margin-bottom: 20px; position: relative; } .page-index .section-join-us .swiper-slide .more .line{ display: block; position: absolute; left: 0; top: 30px; width: 0; height: 1px; background-color: #fff; opacity: 0; -webkit-transition: 0.5s ease-out; -o-transition: 0.5s ease-out; -moz-transition: 0.5s ease-out; transition: 0.5s ease-out; } .page-index .section-join-us .swiper-slide .more:hover .line{ opacity: 1; width: 100%; } .page-index .section-join-us .item0{ height: 650px; display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; background-color: #0000db; } .page-index .section-join-us .item0 .left{ width: 48%; background-color: #0000db; background-repeat: no-repeat; background-position: 0 bottom; -o-background-size: 100% auto; background-size: 100% auto; background-image: url(../images/bg3.png); } .page-index .section-join-us .item0 .right{ -webkit-box-flex: 1; -webkit-flex: 1; -moz-box-flex: 1; -ms-flex: 1; flex: 1; overflow: hidden; position: relative; } .page-index .section-join-us .item0 .right img{ position: absolute; left: 0; top: 0; width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; } .page-index .section-join-us .item0 .right .active{ z-index: 2; -webkit-animation: tmove 0.4s ease-out forwards; -moz-animation: tmove 0.4s ease-out forwards; -o-animation: tmove 0.4s ease-out forwards; animation: tmove 0.4s ease-out forwards; } @-webkit-keyframes tmove{ from{ -webkit-transform: translate(100%, 0); transform: translate(100%, 0); }to{ -webkit-transform: translate(0, 0); transform: translate(0, 0); } } @-moz-keyframes tmove{ from{ -moz-transform: translate(100%, 0); transform: translate(100%, 0); }to{ -moz-transform: translate(0, 0); transform: translate(0, 0); } } @-o-keyframes tmove{ from{ -o-transform: translate(100%, 0); transform: translate(100%, 0); }to{ -o-transform: translate(0, 0); transform: translate(0, 0); } } @keyframes tmove{ from{ -webkit-transform: translate(100%, 0); -moz-transform: translate(100%, 0); -o-transform: translate(100%, 0); transform: translate(100%, 0); }to{ -webkit-transform: translate(0, 0); -moz-transform: translate(0, 0); -o-transform: translate(0, 0); transform: translate(0, 0); } } /*----------------------------------浜у搧涓庢湇鍔¢〉闈?---------------------------------*/ .page-product{ position: relative; } .page-product .section-banner{ position: relative; overflow: hidden; height: 700px; background-color: #000; background-position: center 100px; background-repeat: no-repeat; -o-background-size: cover; background-size: cover; -o-background-size: auto 100%; background-size: auto 100%; } .page-product .section-banner::before{ content: ""; display: block; position: absolute; left: 0; width: -webkit-calc( (100% - 1200px)/2 + 160px ); width: -moz-calc( (100% - 1200px)/2 + 160px ); width: calc( (100% - 1200px)/2 + 160px ); height: 100%; background-color: #333; z-index: 1; display: none; } .page-product .section-banner::after{ content: ""; display: block; position: absolute; left: 0; top: 0; width: 100%; height: 155px; background-color: #0000dc; z-index: 1; display: none; } .page-product .section-banner .banner{ position: absolute; left: 0; right: 0; top: 70px; bottom: 0; overflow: hidden; } .page-product .section-banner .banner .img{ width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; display: none; } .page-product .section-banner .banner .img-mobile{ width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; display: none; } .page-product .section-banner .content{ position: absolute; top: 110px; left: 50%; bottom: 0; -webkit-transform: translate(-50%, 0); -moz-transform: translate(-50%, 0); -ms-transform: translate(-50%, 0); -o-transform: translate(-50%, 0); transform: translate(-50%, 0); color: #fff; z-index: 2; } .page-product .section-banner .content h1{ font-size: 50px; font-weight: normal; line-height: 80px; } .page-product .section-banner .list-more{ display: block; width: 40px; height: 40px; border-radius: 50%; background-color: #fff; position: absolute; left: 0; bottom: 50px; z-index: 3; background-image: url(../images/arrow3.png); background-repeat: no-repeat; background-position: center center; -o-background-size: 8px auto; background-size: 8px auto; -webkit-transition: 0.3s; -o-transition: 0.3s; -moz-transition: 0.3s; transition: 0.3s; } .page-product .section-banner .list-more:hover{ background-color: #0000dc; background-image: url(../images/arrow.png); } /*鐏*/ .page-product .section-product{ margin-top: 90px; position: relative; } .page-product .section-product li{ list-style: none; } .page-product .section-product .content{ position: relative; } .page-product .section-product .tabs{ display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; overflow: hidden; border: solid 1px #dbdbdb; border-radius: 60px; height: 72px; line-height: 70px; position: relative; } .page-product .section-product .tabs .line{ display: block; position: absolute; left: 0; top: 0; width: 50%; height: 100%; background-color: #0000dc; color: #fff; border-radius: 60px; -webkit-transition: 0.3s; -o-transition: 0.3s; -moz-transition: 0.3s; transition: 0.3s; } .page-product .section-product .tabs .line.move{ -webkit-transform: translate(100%, 0); -moz-transform: translate(100%, 0); -ms-transform: translate(100%, 0); -o-transform: translate(100%, 0); transform: translate(100%, 0); } .page-product .section-product .tabs li{ -webkit-box-flex: 1; -webkit-flex: 1; -moz-box-flex: 1; -ms-flex: 1; flex: 1; height: 100%; position: relative; z-index: 2; } .page-product .section-product .tabs a{ height: 100%; display: block; text-align: center; font-size: 20px; -webkit-transition: 0.3s; -o-transition: 0.3s; -moz-transition: 0.3s; transition: 0.3s; border-radius: 60px; font-family: osMedium; } .page-product .section-product .tabs .active a{ color: #fff; } .page-product .section-product .tabs li:hover a{ border-radius: 60px; } .page-product .section-product .content-huojian{ display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; height: 1700px; overflow: hidden; margin-top: 90px; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } .page-product .section-product .item-left{ width: 50%; padding: 80px 0 0; } .page-product .section-product .item-left .item1{ margin-top: 20px; } .page-product .section-product .item-left .item1 dt{ font-size: 28px; font-weight: normal; margin-bottom: 20px; color: #0000dc; } .page-product .section-product .item-left .item1 dt b{ font-family: osMedium; font-weight: normal; } .page-product .section-product .item-left .item1 p{ font-size: 16px; margin: 10px 0; color: #666; position: relative; padding-left: 30px; } .page-product .section-product .item-left .item1 p::before{ content: ""; display: block; position: absolute; left: 0; top: 50%; -webkit-transform: translate(0, -50%); -moz-transform: translate(0, -50%); -ms-transform: translate(0, -50%); -o-transform: translate(0, -50%); transform: translate(0, -50%); font-size: 16px; width: 8px; height: 8px; background-color: #0000dc; border-radius: 50%; } .page-product .section-product .threesixty{ left: -750px; } .page-product .section-product .item-huojian{ -webkit-box-flex: 1; -webkit-flex: 1; -moz-box-flex: 1; -ms-flex: 1; flex: 1; } .page-product .section-product .item-huojian .huojianBox{ position: relative; } .page-product .section-product .item-huojian .huojian{ position: relative; width: 200px; } .page-product .section-product .item-huojian .huojian0{ height: 1745px; position: absolute; top: -5px; left: 50%; -webkit-transform: translate(-50%, 0); -moz-transform: translate(-50%, 0); -ms-transform: translate(-50%, 0); -o-transform: translate(-50%, 0); transform: translate(-50%, 0); margin-left: -24px; } .page-product .section-product .item-huojian .node{ width: 100%; position: absolute; left: 112px; width: 485px; } .page-product .section-product .item-huojian .node .hj{ width: 100%; } .page-product .section-product .item-huojian .node .circle{ position: absolute; left: 0; top: 0; width: 42px; height: 42px; background-color: #0000dc; border-radius: 50%; pointer-events: none; } .page-product .section-product .item-huojian .node .circle .dian{ position: absolute; left: 50%; top: 50%; margin: -4px 0 0 -4px; width: 8px; height: 8px; background-color: #fff; border-radius: 50%; } .page-product .section-product .item-huojian .node .circle .line{ position: absolute; left: 50%; top: 50%; margin: -1px 0 0 4px; width: 462px; height: 1px; background-color: #dbdbdb; z-index: 2; } .page-product .section-product .item-huojian .node .text{ position: absolute; right: 0; top: 0; white-space: nowrap; text-align: right; } .page-product .section-product .item-huojian .node .text span{ display: block; } .page-product .section-product .item-huojian .node .text .r1{ margin: -6px 0 15px 0; color: #666; } .page-product .section-product .item-huojian .node .text .r2{ font-size: 52px; font-family: osMedium; } .page-product .section-product .item-huojian .node-left{ left: -598px; width: 638px; } .page-product .section-product .item-huojian .node-left .circle{ left: auto; right: 0; } .page-product .section-product .item-huojian .node-left .circle .line{ left: -598px; width: 612px; } .page-product .section-product .item-huojian .node-left .text{ text-align: left; left: 0; right: auto; } .page-product .section-product .content-huojian .item-huojian .node1{ top: 188px; } .page-product .section-product .content-huojian .item-huojian .node2{ top: 408px; } .page-product .section-product .content-huojian .item-huojian .node3{ top: 694px; } .page-product .section-product .content-huojian .item-huojian .node4{ top: 920px; } .page-product .section-product .content-huojian .item-huojian .node5{ top: 1200px; } .page-product .section-product .content-huojian .item-huojian .node6{ top: 540px; } .page-product .section-product .content-huojian .item-huojian .text .r2{ line-height: 66px; font-size: 48px; } .page-product .section-product .content-huojian .item-huojian .text sup{ font-size: 30px; font-weight: bold; vertical-align: 22px; } .page-product .section-product .content-huojian .item-huojian .node7{ top: 1050px; } .page-product .section-product .content-huojian .item-huojian .node8{ top: 1340px; } .page-product .section-product .content-fadongji{ display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; height: 850px; margin-top: 90px; } .page-product .section-product .content-fadongji .huojian{ width: 400px; margin-top: 40px; margin-left: -20px; } .page-product .section-product .content-fadongji .huojian0{ width: auto; height: 800px; top: -50px; } .page-product .section-product .content-fadongji .item-huojian .node{ left: 130px; } .page-product .section-product .content-fadongji .item-huojian .node-left{ left: -575px; width: 638px; } .page-product .section-product .content-fadongji .item-huojian .node1{ top: 60px; } .page-product .section-product .content-fadongji .item-huojian .node2{ top: 350px; } .page-product .section-product .content-fadongji .item-huojian .node3{ top: 530px; } .page-product .section-product .content-fadongji .item-huojian .node4{ top: 300px; } .page-product .section-product .content-fadongji .item-huojian .node5{ top: 450px; } .page-product .section-product .content-fadongji .item-huojian .node6{ top: 600px; } .page-product .section-product .content-item{ display: none; } .page-product .section-product .content-item.active{ display: block; } /*娴佺▼*/ .page-product .section-flow{ margin-top: 60px; background-color: #0000dc; color: #fff; padding: 90px 0 90px; } .page-product .section-flow li{ list-style: none; } .page-product .section-flow .title{ border-bottom: solid 1px #aaa; font-size: 24px; font-weight: normal; padding-bottom: 15px; } .page-product .section-flow .content{ position: relative; } .page-product .section-flow .module{ display: none; height: 834px; } .page-product .section-flow .module.active{ display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; } .page-product .section-flow .module-left{ width: 60%; background-image: url(../images/huojian3.png); background-position: 0 50px; background-repeat: no-repeat; -o-background-size: auto 82%; background-size: auto 82%; position: relative; } .page-product .section-flow .module-left .item1{ margin: 255px 0 0 25px; } .page-product .section-flow .module-left .item1 p{ font-size: 52px; line-height: 88px; } .page-product .section-flow .module-right{ -webkit-box-flex: 1; -webkit-flex: 1; -moz-box-flex: 1; -ms-flex: 1; flex: 1; } .page-product .section-flow .flow .list{ border-bottom: solid 1px #aaa; margin-top: -1px; font-size: 24px; font-family: osMedium; cursor: pointer; } .page-product .section-flow .flow .list dl{ height: 140px; } .page-product .section-flow .flow .list dl dt{ height: 100%; display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -moz-box-align: center; -ms-flex-align: center; align-items: center; } .page-product .section-flow .flow .list dl dd{ font-size: 17px; opacity: 0.8; overflow : hidden; width: 100%; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 4; -o-text-overflow: ellipsis; text-overflow: ellipsis; display: none; } .page-product .section-flow .flow .list .r1{ width: 50px; } .page-product .section-flow .flow .list .r2{ -webkit-box-flex: 1; -webkit-flex: 1; -moz-box-flex: 1; -ms-flex: 1; flex: 1; font-size: 22px; line-height: 38px; text-align: right; } .page-product .section-flow .flow .list:hover dl{ height: 160px; } .page-product .section-flow .flow .list:hover dt{ height: 30%; } .page-product .section-flow .flow .list:hover dd{ display: -webkit-box; } .page-product .section-flow .module-no .flow .list .r1{ display: none; } .page-product .section-flow .module-no .flow .list .r2{ text-align: left; } .page-product .section-flow .module-no .module-right{ display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -moz-box-align: center; -ms-flex-align: center; align-items: center; } .page-product .section-flow .module-no .flow .list dl dd{ -webkit-line-clamp: 3; margin-top: 20px; } .page-product .section-flow .list-more{ position: absolute; z-index: 3; left: 0; bottom: 0; display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; } .page-product .section-flow .list-more a{ width: 60px; height: 60px; border-radius: 50%; border: solid 2px #fff; background-repeat: no-repeat; background-position: center center; -o-background-size: 10px auto; background-size: 10px auto; background-image: url(../images/arrow7.png); margin-right: 18px; -webkit-transition: 0.3s; -o-transition: 0.3s; -moz-transition: 0.3s; transition: 0.3s; } .page-product .section-flow .list-more a:nth-child(2){ background-image: url(../images/arrow2.png); } .page-product .section-flow .list-more a:nth-child(1):hover{ background-color: #fff; background-image: url(../images/arrow5.png); } .page-product .section-flow .list-more a:nth-child(2):hover{ background-color: #fff; background-image: url(../images/arrow4.png); } .page-product .section-flow .list-more a:nth-child(1).active{ background-color: #fff; background-image: url(../images/arrow5.png); } .page-product .section-flow .list-more a:nth-child(2).active{ background-color: #fff; background-image: url(../images/arrow4.png); } /*----------------------------------钃濈鏅烘収椤甸潰----------------------------------*/ .page-wisdom{ position: relative; } .page-wisdom .section-banner{ position: relative; overflow: hidden; height: 700px; background-color: #000; background-position: center 100px; background-repeat: no-repeat; -o-background-size: cover; background-size: cover; -o-background-size: auto 100%; background-size: auto 100%; } .page-wisdom .section-banner::before{ content: ""; display: block; position: absolute; left: 0; width: -webkit-calc( (100% - 1200px)/2 + 160px ); width: -moz-calc( (100% - 1200px)/2 + 160px ); width: calc( (100% - 1200px)/2 + 160px ); height: 100%; background-color: #333; z-index: 1; display: none; } .page-wisdom .section-banner::after{ content: ""; display: block; position: absolute; left: 0; top: 0; width: 100%; height: 155px; background-color: #0000dc; z-index: 1; display: none; } .page-wisdom .section-banner .banner{ position: absolute; left: 0; right: 0; top: 70px; bottom: 0; overflow: hidden; } .page-wisdom .section-banner .banner .img{ width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; display: none; } .page-wisdom .section-banner .banner .img-mobile{ width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; display: none; } .page-wisdom .section-banner .content{ position: absolute; top: 110px; left: 50%; bottom: 0; -webkit-transform: translate(-50%, 0); -moz-transform: translate(-50%, 0); -ms-transform: translate(-50%, 0); -o-transform: translate(-50%, 0); transform: translate(-50%, 0); color: #fff; z-index: 2; } .page-wisdom .section-banner .content h1{ font-size: 50px; font-weight: normal; line-height: 80px; } .page-wisdom .section-banner .list-more{ display: block; width: 40px; height: 40px; border-radius: 50%; background-color: #fff; position: absolute; left: 0; bottom: 50px; z-index: 3; background-image: url(../images/arrow3.png); background-repeat: no-repeat; background-position: center center; -o-background-size: 8px auto; background-size: 8px auto; -webkit-transition: 0.3s; -o-transition: 0.3s; -moz-transition: 0.3s; transition: 0.3s; } .page-wisdom .section-banner .list-more:hover{ background-color: #0000dc; background-image: url(../images/arrow.png); } /*娴佺▼*/ .page-wisdom .section-flow{ padding: 100px 0 0px; } .page-wisdom .section-flow li{ list-style: none; } .page-wisdom .section-flow .tabs{ display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; overflow: hidden; border: solid 1px #dbdbdb; border-radius: 60px; height: 72px; line-height: 70px; position: relative; } .page-wisdom .section-flow .tabs .line{ width: 50%; height: 100%; position: absolute; left: 0; top: 0; background-color: #0000dc; border-radius: 60px; -webkit-transition: 0.3s; -o-transition: 0.3s; -moz-transition: 0.3s; transition: 0.3s; } .page-wisdom .section-flow .tabs .line.move{ -webkit-transform: translate(100%, 0); -moz-transform: translate(100%, 0); -ms-transform: translate(100%, 0); -o-transform: translate(100%, 0); transform: translate(100%, 0); } .page-wisdom .section-flow .tabs li{ width: 50%; height: 100%; position: relative; z-index: 2; } .page-wisdom .section-flow .tabs a{ height: 100%; display: block; text-align: center; font-size: 20px; -webkit-transition: 0.3s; -o-transition: 0.3s; -moz-transition: 0.3s; transition: 0.3s; border-radius: 60px; font-family: osMedium; } .page-wisdom .section-flow .tabs .active a{ color: #fff; } .page-wisdom .section-flow .tabs li:hover a{ border-radius: 60px; } .page-wisdom .section-flow .content{ position: relative; padding-bottom: 100px; min-height: 540px; } .page-wisdom .section-flow .module{ display: none; } .page-wisdom .section-flow .module.active{ display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -webkit-justify-content: space-between; -moz-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; } .page-wisdom .section-flow .module-left{ width: 44%; /* padding: 100px 0 0 0; */ padding: 0; position: relative; } .page-wisdom .section-flow .module-left .item1 h3{ font-size: 36px; line-height: 60px; font-weight: normal; margin-bottom: 65px; } .page-wisdom .section-flow .module-left .item1 p{ font-size: 22px; color: #666; } .page-wisdom .section-flow .module-right{ width: 43%; /* padding: 40px 0 0 0; */ } .page-wisdom .section-flow .flow .list{ padding: 18px 0; border-bottom: solid 1px #dbdbdb; margin-top: -1px; display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -webkit-justify-content: space-between; -moz-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; font-size: 18px; font-family: osMedium; white-space: nowrap; } .page-wisdom .section-flow .flow .list .r1{ color: #0000dc; } .page-wisdom .section-flow .list-more{ position: absolute; left: 0; bottom: 100px; display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; } .page-wisdom .section-flow .list-more a{ width: 60px; height: 60px; border-radius: 50%; border: solid 2px #333; background-repeat: no-repeat; background-position: center center; -o-background-size: 10px auto; background-size: 10px auto; background-image: url(../images/arrow8.png); margin-right: 18px; -webkit-transition: 0.3s; -o-transition: 0.3s; -moz-transition: 0.3s; transition: 0.3s; } .page-wisdom .section-flow .list-more a:nth-child(2){ background-image: url(../images/arrow6.png); } .page-wisdom .section-flow .list-more a:nth-child(1):hover{ background-color: #0000dc; border-color: #0000dc; background-image: url(../images/arrow7.png); } .page-wisdom .section-flow .list-more a:nth-child(2):hover{ background-color: #0000dc; border-color: #0000dc; background-image: url(../images/arrow2.png); } .page-wisdom .section-flow .list-more a:nth-child(1).active{ background-color: #0000dc; border-color: #0000dc; background-image: url(../images/arrow7.png); } .page-wisdom .section-flow .list-more a:nth-child(2).active{ background-color: #0000dc; border-color: #0000dc; background-image: url(../images/arrow2.png); } .page-wisdom .section-2{ position: relative; height: 700px; } .page-wisdom .section-2 .content{ background-color: #0000dc; background-repeat: no-repeat; background-position: right 0; background-image: url(../images/bg4.png); -o-background-size: auto 97%; background-size: auto 97%; padding: 0 0 0 70px; position: absolute; left: -webkit-calc( (100% - 1200px)/2); left: -moz-calc( (100% - 1200px)/2); left: calc( (100% - 1200px)/2); right: 0; top: 0; height: 700px; } .page-wisdom .section-2 .swiper-slide .title{ color: #fff; font-size: 24px; position: relative; z-index: 2; padding: 50px 0 18px 0; font-weight: normal; border-bottom: solid 1px #dbdbdb; margin-bottom: 50px; } .page-wisdom .section-2 .swiper-slide .inner{ display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; } .page-wisdom .section-2 .slide-left{ width: 600px; } .page-wisdom .section-2 .slide-left h1{ color: #fff; font-size: 52px; font-weight: normal; } .page-wisdom .section-2 .slide-left .img{ width: 100%; height: 350px; -o-object-fit: cover; object-fit: cover; margin-top: 50px; } .page-wisdom .section-2 .slide-right{ -webkit-box-flex: 1; -webkit-flex: 1; -moz-box-flex: 1; -ms-flex: 1; flex: 1; padding: 160px 9% 0 45px; position: relative; } .page-wisdom .section-2 .slide-right h2{ color: #fff; font-size: 20px; font-weight: normal; line-height: 34px; text-align: justify; } .page-wisdom .section-2 .list-more{ position: absolute; left: 645px; bottom: 40px; display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; z-index: 3; } .page-wisdom .section-2 .list-more a{ width: 60px; height: 60px; border-radius: 50%; border: solid 2px #fff; background-repeat: no-repeat; background-position: center center; -o-background-size: 10px auto; background-size: 10px auto; background-image: url(../images/arrow7.png); margin-right: 18px; -webkit-transition: 0.3s; -o-transition: 0.3s; -moz-transition: 0.3s; transition: 0.3s; } .page-wisdom .section-2 .list-more a:nth-child(2){ background-image: url(../images/arrow2.png); } .page-wisdom .section-2 .list-more a:nth-child(1):hover{ background-color: #fff; background-image: url(../images/arrow5.png); } .page-wisdom .section-2 .list-more a:nth-child(2):hover{ background-color: #fff; background-image: url(../images/arrow4.png); } .page-wisdom .section-2 .list-more a:nth-child(1).active{ background-color: #fff; background-image: url(../images/arrow5.png); } .page-wisdom .section-2 .list-more a:nth-child(2).active{ background-color: #fff; background-image: url(../images/arrow4.png); } /*----------------------------------鍏充簬鎴戜滑椤甸潰----------------------------------*/ .page-about{ position: relative; } .page-about .section-tabs-content{ display: none; } .page-about .section-tabs-content.active{ display: block; } .page-about .section-banner{ position: relative; overflow: hidden; height: 700px; background-color: #000; background-position: center 100px; background-repeat: no-repeat; -o-background-size: cover; background-size: cover; -o-background-size: auto 100%; background-size: auto 100%; } .page-about .section-banner::before{ content: ""; display: none; position: absolute; left: 0; width: -webkit-calc( (100% - 1200px)/2 + 160px ); width: -moz-calc( (100% - 1200px)/2 + 160px ); width: calc( (100% - 1200px)/2 + 160px ); height: 100%; z-index: 1; } .page-about .section-banner::after{ content: ""; display: none; position: absolute; left: 0; top: 0; width: 100%; height: 155px; z-index: 1; } .page-about .section-banner .banner{ position: absolute; left: 0; right: 0; top: 70px; bottom: 0; overflow: hidden; } .page-about .section-banner .banner .img{ width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; display: none; } .page-about .section-banner .banner .img-mobile{ display: none; width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; } .section-banner .banner video{ width: 100%; height: 100%; display: block; margin: auto; background-color: #000; position: relative; -o-object-fit: cover; object-fit: cover; } .section-banner .icon-play{ position: absolute; left: 50%; top: 50%; -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); transform: translate(-50%, -50%); width: 80px; opacity: 1; pointer-events: none; -webkit-transition: 0.6s; -o-transition: 0.6s; -moz-transition: 0.6s; transition: 0.6s; cursor: pointer; display: none; } .section-banner.playing .icon-play{ opacity: 0; } .page-about .section-banner .content{ position: absolute; top: 110px; left: 50%; bottom: 0; -webkit-transform: translate(-50%, 0); -moz-transform: translate(-50%, 0); -ms-transform: translate(-50%, 0); -o-transform: translate(-50%, 0); transform: translate(-50%, 0); color: #fff; z-index: 2; } .page-about .section-banner .content h1{ font-size: 50px; font-weight: normal; line-height: 80px; } .page-about .section-banner .content h6{ font-size: 21px; font-weight: normal; margin-top: 15px; } .page-about .section-banner .list-more{ display: block; width: 40px; height: 40px; border-radius: 50%; background-color: #fff; position: absolute; left: 0; bottom: 50px; z-index: 3; background-image: url(../images/arrow3.png); background-repeat: no-repeat; background-position: center center; -o-background-size: 8px auto; background-size: 8px auto; -webkit-transition: 0.3s; -o-transition: 0.3s; -moz-transition: 0.3s; transition: 0.3s; } .page-about .section-banner .list-more:hover{ background-color: #0000dc; background-image: url(../images/arrow.png); } .page-about .section-tabs{ padding: 100px 0 90px; } .page-about .section-tabs li{ list-style: none; position: relative; z-index: 2; } .page-about .section-tabs .line{ position: absolute; left: 0; width: 25%; height: 100%; background-color: #0000dc; border-radius: 60px; -webkit-transition: 0.3s; -o-transition: 0.3s; -moz-transition: 0.3s; transition: 0.3s; } .page-about .section-tabs .tabs{ display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; overflow: hidden; border: solid 1px #dbdbdb; border-radius: 60px; height: 72px; line-height: 70px; position: relative; } .page-about .section-tabs .tabs li{ -webkit-box-flex: 1; -webkit-flex: 1; -moz-box-flex: 1; -ms-flex: 1; flex: 1; height: 100%; } .page-about .section-tabs .tabs a{ height: 100%; display: block; text-align: center; font-size: 20px; font-family: osMedium; } .page-about .section-tabs .tabs.move0 .line{ -webkit-transform: translate(0, 0); -moz-transform: translate(0, 0); -ms-transform: translate(0, 0); -o-transform: translate(0, 0); transform: translate(0, 0); } .page-about .section-tabs .tabs.move1 .line{ -webkit-transform: translate(100%, 0); -moz-transform: translate(100%, 0); -ms-transform: translate(100%, 0); -o-transform: translate(100%, 0); transform: translate(100%, 0); } .page-about .section-tabs .tabs.move2 .line{ -webkit-transform: translate(200%, 0); -moz-transform: translate(200%, 0); -ms-transform: translate(200%, 0); -o-transform: translate(200%, 0); transform: translate(200%, 0); } .page-about .section-tabs .tabs.move3 .line{ -webkit-transform: translate(300%, 0); -moz-transform: translate(300%, 0); -ms-transform: translate(300%, 0); -o-transform: translate(300%, 0); transform: translate(300%, 0); } .page-about .section-tabs .tabs .active a{ color: #fff; } .page-about .section-1 .content{ position: relative; } .page-about .section-1 .title{ font-size: 24px; padding-bottom: 18px; font-weight: normal; border-bottom: solid 1px #dbdbdb; margin-bottom: 150px; } .page-about .section-1 .img{ width: 62%; height: 420px; -o-object-fit: cover; object-fit: cover; margin: auto; } .page-about .section-1 .no{ position: absolute; right: 128px; top: 40px; color: #0000dc; font-size: 190px; font-family: osMedium; } .page-about .section-1 .item{ position: absolute; left: 0; top: 210px; } .page-about .section-1 .item .row1{ color: #0000dc; font-size: 50px; } .page-about .section-1 .item .row2{ color: #0000dc; font-size: 50px; font-family: osMedium; } .page-about .section-2{ position: relative; height: 580px; margin-top: 100px; } .page-about .section-2 .content{ background-color: #0000dc; background-repeat: no-repeat; background-position: 0 0; -o-background-size: 52.5% 100%; background-size: 52.5% 100%; position: absolute; left: 0; right: -webkit-calc( (100% - 1200px)/2); right: -moz-calc( (100% - 1200px)/2); right: calc( (100% - 1200px)/2); top: 0; height: 100%; } .page-about .section-2 .content::before{ content: "02"; display: block; color: rgba(255,255,255,0.2); font-size: 190px; font-family: osMedium; position: absolute; top: 0; left: 0; } .page-about .section-2 .item{ margin: 0; float: right; display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; height: 100%; position: relative; } .page-about .section-2 .item-left{ width: 45%; } .page-about .section-2 .item-left .title{ color: #fff; font-size: 24px; padding: 50px 0 18px 0; font-weight: normal; border-bottom: solid 1px #dbdbdb; margin-bottom: 100px; } .page-about .section-2 .item-left .row1{ color: #fff; font-size: 52px; padding-right: 50px; } .page-about .section-2 .item-left .row2{ color: rgba(255,255,255,0.4); font-size: 26px; font-family: osMedium; margin-top: 30px; } .page-about .section-2 .item-right{ -webkit-box-flex: 1; -webkit-flex: 1; -moz-box-flex: 1; -ms-flex: 1; flex: 1; position: relative; } .page-about .section-2 .item-right .img{ width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; } .page-about .section-3{ margin-top: 100px; } .page-about .section-3 .content{ position: relative; } .page-about .section-3 .title{ font-size: 24px; padding-bottom: 18px; font-weight: normal; border-bottom: solid 1px #dbdbdb; margin-bottom: 150px; } .page-about .section-3 .img{ width: 92%; -o-object-fit: cover; object-fit: cover; margin: auto; } .page-about .section-3 .no{ position: absolute; right: 0; top: 40px; color: #0000dc; font-size: 190px; font-family: osMedium; } .page-about .section-3 .item{ position: absolute; left: 0; right: 0; top: 440px; text-align: center; } .page-about .section-3 .item .row1{ font-size: 66px; text-indent: -4.1em; } .page-about .section-3 .item .row2{ color: #999; font-size: 72px; font-family: osMedium; text-indent: 4.9em; } .page-about .section-4{ position: relative; height: 580px; } .page-about .section-4 .content{ background-color: #0000dc; height: 100%; position: relative; } .page-about .section-4 .content::before{ content: "04"; display: block; color: rgba(255,255,255,0.2); font-size: 190px; font-family: osMedium; position: absolute; bottom: 0; right: 0; } .page-about .section-4 .item{ display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; height: 100%; position: relative; } .page-about .section-4 .item-left{ -webkit-box-flex: 1; -webkit-flex: 1; -moz-box-flex: 1; -ms-flex: 1; flex: 1; position: relative; } .page-about .section-4 .item-left .img{ width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; } .page-about .section-4 .item-right{ width: 45%; display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -moz-box-align: center; -ms-flex-align: center; align-items: center; padding-left: 40px; padding-right: -webkit-calc( (100% - 1200px)/2 ); padding-right: -moz-calc( (100% - 1200px)/2 ); padding-right: calc( (100% - 1200px)/2 ); background-repeat: no-repeat; background-position: right 0; -o-background-size: 100% 100%; background-size: 100% 100%; } .page-about .section-4 .item-right .row1{ color: #fff; font-size: 28px; line-height: 52px; width: 16em; } .page-about .section-4 .item-right .row2{ display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-pack: end; -webkit-justify-content: flex-end; -moz-box-pack: end; -ms-flex-pack: end; justify-content: flex-end; color: #fff; font-size: 24px; margin-top: 150px; } .page-about .section-4 .item-right .row2 .line{ display: block; width: 60px; height: 1px; background-color: #fff; margin: 16px 20px 0 0; } .page-about .section-5{ margin-top: 100px; } .page-about .section-5 .content{ position: relative; } .page-about .section-5 .item1{ display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -moz-box-align: center; -ms-flex-align: center; align-items: center; } .page-about .section-5 .item1 .no{ color: #0000dc; font-size: 190px; font-family: osMedium; } .page-about .section-5 .item1 .line{ width: 230px; height: 1px; background-color: #0000dc; margin: 0 40px 0 30px; } .page-about .section-5 .item1 .text{ color: #999; font-size: 20px; line-height: 32px; -webkit-box-flex: 1; -webkit-flex: 1; -moz-box-flex: 1; -ms-flex: 1; flex: 1; } .page-about .section-5 .item2{ display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -moz-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -webkit-justify-content: center; -moz-box-pack: center; -ms-flex-pack: center; justify-content: center; color: #0000dc; margin: 100px 0 160px; } .page-about .section-5 .item2 .dou{ font-size: 170px; font-family: osMedium; font-style: normal; position: relative; height: 70px; line-height: 70px; } .page-about .section-5 .item2 .dou:nth-child(1){ top: 10px; } .page-about .section-5 .item2 .dou:nth-child(3){ top: 76px; } .page-about .section-5 .item2 .text{ font-size: 50px; font-weight: normal; margin: 0 30px; text-align: center; } .page-about .section-5 .item2 .text .t2{ font-size: 26px; font-family: osMedium; } .page-about .section-5 .swiper-slide .img{ width: 65%; height: 440px; -o-object-fit: cover; object-fit: cover; } .page-about .section-5 .swiper-slide .slide-right{ position: absolute; bottom: 45px; right: 20px; width: 40%; height: 285px; background: #fff; box-shadow: 0px 8px 16px rgba(0,0,0,0.05); padding: 35px 40px; } .page-about .section-5 .swiper-slide h6{ font-size: 26px; font-weight: normal; color: #0000dc; margin-bottom: 15px; overflow : hidden; width: 100%; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 1; -o-text-overflow: ellipsis; text-overflow: ellipsis; } .page-about .section-5 .swiper-slide p{ text-align: justify; font-size: 16px; color: #666; line-height: 26px; overflow : hidden; width: 100%; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 5; -o-text-overflow: ellipsis; text-overflow: ellipsis; } .page-about .section-5 .ye{ font-size: 15px; color: #999; line-height: 26px; position: absolute; bottom: 65px; right: 40px; z-index: 3; display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; } .page-about .section-5 .ye .t1{ height: 30px; overflow: hidden; } .page-about .section-5 .ye .t1 dt{ position: relative; -webkit-transition: 0.5s ease-out; -o-transition: 0.5s ease-out; -moz-transition: 0.5s ease-out; transition: 0.5s ease-out; } .page-about .section-5 .ye .t1 .move0{ -webkit-transform: translate(0, 0); -moz-transform: translate(0, 0); -ms-transform: translate(0, 0); -o-transform: translate(0, 0); transform: translate(0, 0); } .page-about .section-5 .ye .t1 .move1{ -webkit-transform: translate(0, -30px); -moz-transform: translate(0, -30px); -ms-transform: translate(0, -30px); -o-transform: translate(0, -30px); transform: translate(0, -30px); } .page-about .section-5 .ye .t1 .move2{ -webkit-transform: translate(0, -60px); -moz-transform: translate(0, -60px); -ms-transform: translate(0, -60px); -o-transform: translate(0, -60px); transform: translate(0, -60px); } .page-about .section-5 .ye .t1 span{ display: block; font-size: 22px; font-family: osMedium; font-weight: normal; font-style: normal; color: #999; height: 30px; -webkit-transition: 0.5s ease-out; -o-transition: 0.5s ease-out; -moz-transition: 0.5s ease-out; transition: 0.5s ease-out; } .page-about .section-5 .ye .t1 span.active{ color: #0000dc; font-size: 24px; } .page-about .section-5 .ye .t2{ height: 30px; padding-top: 4px; } .page-about .section-5 .list-more{ position: absolute; right: 0; bottom: 370px; display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; z-index: 3; } .page-about .section-5 .list-more a{ width: 60px; height: 60px; border-radius: 50%; border: solid 2px #333; background-repeat: no-repeat; background-position: center center; -o-background-size: 10px auto; background-size: 10px auto; background-image: url(../images/arrow8.png); margin-right: 18px; -webkit-transition: 0.3s; -o-transition: 0.3s; -moz-transition: 0.3s; transition: 0.3s; } .page-about .section-5 .list-more a:nth-child(2){ background-image: url(../images/arrow6.png); } .page-about .section-5 .list-more a:nth-child(1):hover{ background-color: #0000dc; border-color: #0000dc; background-image: url(../images/arrow7.png); } .page-about .section-5 .list-more a:nth-child(2):hover{ background-color: #0000dc; border-color: #0000dc; background-image: url(../images/arrow2.png); } .page-about .section-6{ position: relative; height: 580px; margin-top: 100px; } .page-about .section-6 .content{ background-color: #0000dc; height: 100%; position: relative; } .page-about .section-6 .content::before{ content: "06"; display: block; color: rgba(255,255,255,0.2); font-size: 190px; font-family: osMedium; position: absolute; top: 0; left: 0; } .page-about .section-6 .item-left .title{ color: #fff; font-size: 24px; padding: 50px 0 18px 0; font-weight: normal; border-bottom: solid 1px #dbdbdb; margin-bottom: 130px; } .page-about .section-6 .item{ display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; height: 100%; } .page-about .section-6 .item-right{ -webkit-box-flex: 1; -webkit-flex: 1; -moz-box-flex: 1; -ms-flex: 1; flex: 1; position: relative; } .page-about .section-6 .item-right .img{ width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; } .page-about .section-6 .item-left{ width: 47%; padding-left: -webkit-calc( (100% - 1200px)/2 ); padding-left: -moz-calc( (100% - 1200px)/2 ); padding-left: calc( (100% - 1200px)/2 ); } .page-about .section-6 .item-left .row1{ color: #fff; font-size: 34px; margin-bottom: 28px; } .page-about .section-6 .item-left .row2{ color: #fff; font-size: 16px; padding: 4px 0; } .page-about .section-8{ padding-bottom: 70px; } .page-about .section-8 li{ list-style: none; } .page-about .section-8 .title{ font-size: 24px; padding-bottom: 18px; font-weight: normal; border-bottom: solid 1px #dbdbdb; margin-bottom: 60px; } .page-about .section-8 .item{ display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; } .page-about .section-8 .item-left{ width: 60%; padding-top: 80px; } .page-about .section-8 .item-left .circle{ position: relative; width: 400px; margin: auto; } .page-about .section-8 .item-left .img{ width: 100%; position: relative; z-index: 2; pointer-events: none; display: none; } .page-about .section-8 #circle{ position: absolute; top: 0; left: 0; width: 400px; height: 400px; z-index: 3; pointer-events: none; } .swiperContainer{ position: absolute; top: 0; left: 0; width: 100%; height: 630px; margin-top: -125px; overflow: hidden; } .page-about .section-8 .item-left .swiperWrap{ position: relative; width: 100%; margin-top: 230px; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } .page-about .section-8 .item-left .swiper{ color: #eee; font-size: 140px; font-family: osMedium; height: 200px; line-height: 200px; text-align: center; cursor: pointer; -webkit-transition: 0.3s ease-out; -o-transition: 0.3s ease-out; -moz-transition: 0.3s ease-out; transition: 0.3s ease-out; } .page-about .section-8 .item-left .swiper:hover{ color: #333; -webkit-transition: 0.3s; -o-transition: 0.3s; -moz-transition: 0.3s; transition: 0.3s; } .page-about .section-8 .item-left .swiper.active{ color: #0000dc; font-size: 160px; } .page-about .section-8 .item-right{ -webkit-box-flex: 1; -webkit-flex: 1; -moz-box-flex: 1; -ms-flex: 1; flex: 1; height: 1037px; overflow: hidden; } .page-about .section-8 .item-right .list-wrap{ position: relative; } .page-about .section-8 .item-right .list{ border-bottom: solid 1px #dbdbdb; height: 115px; display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; -moz-box-orient: vertical; -moz-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-pack: center; -webkit-justify-content: center; -moz-box-pack: center; -ms-flex-pack: center; justify-content: center; } .page-about .section-8 .item-right .row1{ color: #999; font-size: 17px; font-family: osMedium; } .page-about .section-8 .item-right .row2{ font-size: 20px; margin-top: 10px; overflow: hidden; -o-text-overflow: ellipsis; text-overflow: ellipsis; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; } .page-about .section-10 .content{ padding-bottom: 130px; } .page-about .section-10 li{ list-style: none; } .page-about .section-10 .title{ font-size: 24px; padding-bottom: 18px; font-weight: normal; border-bottom: solid 1px #dbdbdb; } .page-about .section-10 .content{ position: relative; } .page-about .section-10 .module{ display: none; } .page-about .section-10 .module.active{ display: block; } .page-about .section-10 .item{ display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -webkit-justify-content: space-between; -moz-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; } .page-about .section-10 .item-left{ width: 48%; } .page-about .section-10 .item-left .img{ width: 100%; } .page-about .section-10 .item-right{ width: 48%; position: relative; } .page-about .section-10 .item-right .list{ border-bottom: solid 1px #dbdbdb; padding: 20px 0; cursor: pointer; } .page-about .section-10 .item-right .list dt{ display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -moz-box-align: center; -ms-flex-align: center; align-items: center; } .page-about .section-10 .item-right .list dd{ display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-pack: end; -webkit-justify-content: flex-end; -moz-box-pack: end; -ms-flex-pack: end; justify-content: flex-end; display: none; } .page-about .section-10 .item-right .list .img{ width: 230px; height: 175px; -o-object-fit: cover; object-fit: cover; margin-top: 20px; } .page-about .section-10 .item-right .row1{ color: #666; font-size: 26px; font-family: osMedium; } .page-about .section-10 .item-right .row2{ font-size: 22px; color: #666; padding-left: 20px; } .page-about .section-10 .item-right .list.active dd{ display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; } .page-about .section-10 .item-right .list:hover dd{ display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; display: none; } .page-about .section-10 .item-right .list:hover .row1{ color: #0000dc; } .page-about .section-10 .item-right .list:hover .row2{ color: #0000dc; } .page-about .section-10 .list-more{ display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; position: absolute; bottom: 20px; right: 0; } .page-about .section-10 .list-more a{ width: 60px; height: 60px; border-radius: 50%; border: solid 2px #333; background-repeat: no-repeat; background-position: center center; -o-background-size: 10px auto; background-size: 10px auto; background-image: url(../images/arrow8.png); margin-right: 18px; -webkit-transition: 0.3s; -o-transition: 0.3s; -moz-transition: 0.3s; transition: 0.3s; } .page-about .section-10 .list-more a:nth-child(2){ margin-right: 0; background-image: url(../images/arrow6.png); } .page-about .section-10 .list-more a:nth-child(1):hover{ background-color: #0000dc; border-color: #0000dc; background-image: url(../images/arrow7.png); } .page-about .section-10 .list-more a:nth-child(2):hover{ background-color: #0000dc; border-color: #0000dc; background-image: url(../images/arrow2.png); } .page-about .section-10 .list-more a.active{ background-color: #0000dc; border-color: #0000dc; } .page-about .section-10 .list-more a.active:nth-child(1){ background-image: url(../images/arrow7.png); } .page-about .section-10 .list-more a.active:nth-child(2){ background-image: url(../images/arrow2.png); } .page-about .section-10 .tabs{ display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; margin: 25px 0 60px; } .page-about .section-10 li{ list-style: none; } .page-about .section-10 .tabs li{ margin-right: 20px; } .page-about .section-10 .tabs a{ display: block; border: solid 1px #0000dc; color: #0000dc; border-radius: 20px; width: 100px; height: 34px; line-height: 30px; text-align: center; font-size: 15px; font-family: osMedium; -webkit-transition: 0.3s; -o-transition: 0.3s; -moz-transition: 0.3s; transition: 0.3s; } .page-about .section-10 .tabs .active a{ background-color: #0000dc; color: #fff; } .page-about .section-12 .content{ background-image: url(../images/bg11.jpg); background-repeat: no-repeat; background-position: center center; -o-background-size: 100% 100%; background-size: 100% 100%; padding: 0 0 100px; } .page-about .section-12 li{ list-style: none; } .page-about .section-12 .title{ font-size: 24px; padding-bottom: 18px; font-weight: normal; border-bottom: solid 1px #dbdbdb; } .page-about .section-12 .inner{ box-shadow: 0px 8px 14px rgba(0,0,0,0.1); } .page-about .section-12 .item{ display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -webkit-justify-content: space-between; -moz-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; margin-top: 80px; } .page-about .section-12 .item-left{ width: 38%; } .page-about .section-12 .item-left .img{ width: 100%; } .page-about .section-12 .item-right{ background-color: #fff; -webkit-box-flex: 1; -webkit-flex: 1; -moz-box-flex: 1; -ms-flex: 1; flex: 1; padding: 0 60px; color: #666; font-size: 16px; box-shadow: 0px 0px 14px rgba(0,0,0,0.02); } .page-about .section-12 .item-right .row1{ padding: 0 0 15px; border-bottom: solid 1px #dbdbdb; margin-top: 50px; margin-bottom: 15px; } .page-about .section-12 .item-right .row1 .logo{ width: 150px; } .page-about .section-12 .item-right .row3{ display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -webkit-justify-content: space-between; -moz-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-align: center; -webkit-align-items: center; -moz-box-align: center; -ms-flex-align: center; align-items: center; margin-top: 100px; } .page-about .section-12 .item-right .row3 .col-1 p{ margin: 8px 0; } .page-about .section-12 .item-right .row3 .col-3{ text-align: right; white-space: nowrap; display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -moz-box-align: center; -ms-flex-align: center; align-items: center; } .page-about .section-12 .item-right .row3 .col-3 .text{ padding: 0 10px 0px 0; } .page-about .section-12 .item-right .row3 .col-3 b{ font-size: 15px; font-weight: bold; } .page-about .section-12 .item-right .row3 .col-3 dl{ margin: 20px 0; } .page-about .section-12 .item-right .row3 .col-3 dl dt{ margin-bottom: 5px; } .page-about .section-12 .item-right .row3 .col-3 .ewm{ text-align: center; margin-right: -10px; } .page-about .section-12 .item-right .row3 .col-3 .ewm .img{ width: 180px; } /*----------------------------------鏂伴椈椤甸潰----------------------------------*/ .page-news{ position: relative; } .page-news .section-banner{ position: relative; overflow: hidden; height: 700px; background-color: #000; background-position: center 100px; background-repeat: no-repeat; -o-background-size: cover; background-size: cover; -o-background-size: auto 100%; background-size: auto 100%; } .page-news .section-banner::before{ content: ""; display: block; position: absolute; left: 0; width: -webkit-calc( (100% - 1200px)/2 + 160px ); width: -moz-calc( (100% - 1200px)/2 + 160px ); width: calc( (100% - 1200px)/2 + 160px ); height: 100%; background-color: #333; z-index: 1; display: none; } .page-news .section-banner::after{ content: ""; display: block; position: absolute; left: 0; top: 0; width: 100%; height: 155px; background-color: #0000dc; z-index: 1; display: none; } .page-news .section-banner .banner{ position: absolute; left: 0; right: 0; top: 70px; bottom: 0; overflow: hidden; } .page-news .section-banner .banner .img{ width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; display: none; } .page-news .section-banner .banner .img-mobile{ width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; display: none; } .page-news .section-banner .content{ position: absolute; top: 110px; left: 50%; bottom: 0; -webkit-transform: translate(-50%, 0); -moz-transform: translate(-50%, 0); -ms-transform: translate(-50%, 0); -o-transform: translate(-50%, 0); transform: translate(-50%, 0); color: #fff; z-index: 2; } .page-news .section-banner .content h1{ font-size: 50px; font-weight: normal; line-height: 80px; } .page-news .section-banner .list-more{ display: block; width: 40px; height: 40px; border-radius: 50%; background-color: #fff; position: absolute; left: 0; bottom: 50px; z-index: 3; background-image: url(../images/arrow3.png); background-repeat: no-repeat; background-position: center center; -o-background-size: 8px auto; background-size: 8px auto; -webkit-transition: 0.3s; -o-transition: 0.3s; -moz-transition: 0.3s; transition: 0.3s; } .page-news .section-banner .list-more:hover{ background-color: #0000dc; background-image: url(../images/arrow.png); } .page-news .section-tabs{ padding: 80px 0 80px; background-color: #f8f8f9; } .page-news .section-tabs li{ list-style: none; } .page-news .section-tabs .tabs{ display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; overflow: hidden; border: solid 1px #dbdbdb; border-radius: 60px; height: 72px; line-height: 70px; } .page-news .section-tabs .tabs li{ -webkit-box-flex: 1; -webkit-flex: 1; -moz-box-flex: 1; -ms-flex: 1; flex: 1; height: 100%; } .page-news .section-tabs .tabs a{ height: 100%; display: block; text-align: center; font-size: 20px; -webkit-transition: 0.3s; -o-transition: 0.3s; -moz-transition: 0.3s; transition: 0.3s; border-radius: 60px; font-family: osMedium; } .page-news .section-tabs .tabs .active a{ background-color: #0000dc; color: #fff; } .page-news .section-tabs .tabs li:hover a{ border-radius: 60px; } .page-news .module{ display: none; } .page-news .module.active{ display: block; } .page-news .section-1 .content{ position: relative; } .page-news .section-1 .swiper-slide{ display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; height: 370px; padding: 18px 18px 18px 0; } .page-news .section-1 .slide-left{ width: 52%; overflow: hidden; } .page-news .section-1 .slide-left .img{ width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; -webkit-transition: 0.3s; -o-transition: 0.3s; -moz-transition: 0.3s; transition: 0.3s; } .page-news .section-1 .swiper-slide:hover .img{ -webkit-transform: scale(1.1); -moz-transform: scale(1.1); -ms-transform: scale(1.1); -o-transform: scale(1.1); transform: scale(1.1); } .page-news .section-1 .slide-right{ width: 48%; background: #fff; box-shadow: 0px 8px 16px rgba(0,0,0,0.05); padding: 35px 30px 0 35px; position: relative; } .page-news .section-1 .slide-right h6{ font-size: 16px; font-weight: normal; color: #0000dc; font-family: osLight; } .page-news .section-1 .slide-right h4{ font-size: 26px; font-weight: normal; margin: 25px 0 12px; font-family: "PingFangSC-Medium"; overflow : hidden; width: 100%; display: -webkit-box; /*寮规€т几缂╃洅瀛?/ -webkit-box-orient: vertical; /*瀛愬厓绱犲瀭鐩存帓鍒?/ -webkit-line-clamp: 1; /*鍙互鏄剧ず鐨勮鏁帮紝瓒呭嚭閮ㄥ垎鐢?..琛ㄧず*/ -o-text-overflow: ellipsis; text-overflow: ellipsis; } .page-news .section-1 .slide-right p{ font-size: 16px; color: #999; line-height: 28px; overflow : hidden; width: 100%; display: -webkit-box; /*寮规€т几缂╃洅瀛?/ -webkit-box-orient: vertical; /*瀛愬厓绱犲瀭鐩存帓鍒?/ -webkit-line-clamp: 4; /*鍙互鏄剧ず鐨勮鏁帮紝瓒呭嚭閮ㄥ垎鐢?..琛ㄧず*/ -o-text-overflow: ellipsis; text-overflow: ellipsis; } .page-news .section-1 .slide-right .more{ font-size: 16px; font-family: osMedium; color: #0000dc; display: inline-block; padding-right: 15px; background-image: url(../images/arrow4.png); background-repeat: no-repeat; background-position: right 9px; -o-background-size: 6px auto; background-size: 6px auto; position: absolute; left: 35px; bottom: 40px; } .page-news .section-1 .slide-right .more .line{ display: block; position: absolute; left: 0; top: 30px; width: 0; height: 1px; background-color: #0000dc; opacity: 0; -webkit-transition: 0.5s ease-out; -o-transition: 0.5s ease-out; -moz-transition: 0.5s ease-out; transition: 0.5s ease-out; } .page-news .section-1 .slide-right .more:hover .line{ opacity: 1; width: 100%; } .page-news .section-1 .item1{ display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -moz-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: justify; -webkit-justify-content: space-between; -moz-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; padding: 25px 0; } .page-news .section-1 .item1 .ye{ font-size: 15px; color: #999; line-height: 26px; } .page-news .section-1 .item1 .ye i{ font-size: 24px; font-family: osMedium; font-weight: normal; font-style: normal; color: #0000dc; } .page-news .section-1 .list-more{ display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; z-index: 3; } .page-news .section-1 .list-more a{ width: 60px; height: 60px; border-radius: 50%; border: solid 2px #333; background-repeat: no-repeat; background-position: center center; -o-background-size: 10px auto; background-size: 10px auto; background-image: url(../images/arrow8.png); margin-right: 18px; -webkit-transition: 0.3s; -o-transition: 0.3s; -moz-transition: 0.3s; transition: 0.3s; } .page-news .section-1 .list-more a:nth-child(2){ background-image: url(../images/arrow6.png); } .page-news .section-1 .list-more a:nth-child(1):hover{ background-color: #0000dc; border-color: #0000dc; background-image: url(../images/arrow7.png); } .page-news .section-1 .list-more a:nth-child(2):hover{ background-color: #0000dc; border-color: #0000dc; background-image: url(../images/arrow2.png); } .page-news .section-2{ margin-top: 50px; background-color: #f8f8f9; } .page-news .section-2 .list{ -webkit-transition: 0.3s; -o-transition: 0.3s; -moz-transition: 0.3s; transition: 0.3s; } .page-news .section-2 .list .link{ display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; height: 250px; padding: 50px 0; border-bottom: solid 1px #ebebec; } .page-news .section-2 .slide-left{ position: relative; width: 250px; height: 100%; } .page-news .section-2 .slide-left .img{ position: relative; width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; } .page-news .section-2 .slide-left .arrow{ display: none; width: 40px; height: 40px; border-radius: 50%; background-color: #fff; position: absolute; right: -20px; top: 50%; -webkit-transform: translate(0, -50%); -moz-transform: translate(0, -50%); -ms-transform: translate(0, -50%); -o-transform: translate(0, -50%); transform: translate(0, -50%); background-image: url(../images/arrow4.png); background-repeat: no-repeat; background-position: center center; -o-background-size: 6px auto; background-size: 6px auto; } .page-news .section-2 .slide-center{ width: 250px; position: relative; text-align: center; } .page-news .section-2 .slide-center span{ display: block; -webkit-transition: 0.3s; -o-transition: 0.3s; -moz-transition: 0.3s; transition: 0.3s; } .page-news .section-2 .slide-center .date{ position: absolute; top: -10px; left: 100px; font-size: 70px; font-family: osMedium; color: #0000dc; height: 80px; line-height: 80px; } .page-news .section-2 .slide-center .month{ font-size: 18px; font-family: osMedium; height: 24px; line-height: 24px; margin-top: 100px; } .page-news .section-2 .slide-center .year{ font-size: 18px; font-family: osMedium; color: #999; } .page-news .section-2 .slide-right{ -webkit-box-flex: 1; -webkit-flex: 1; -moz-box-flex: 1; -ms-flex: 1; flex: 1; max-width: 685px; } .page-news .section-2 .slide-right h4{ font-size: 24px; font-weight: normal; margin: -3px 0 60px; -webkit-transition: 0.3s; -o-transition: 0.3s; -moz-transition: 0.3s; transition: 0.3s; overflow : hidden; width: 100%; display: -webkit-box; /*寮规€т几缂╃洅瀛?/ -webkit-box-orient: vertical; /*瀛愬厓绱犲瀭鐩存帓鍒?/ -webkit-line-clamp: 1; /*鍙互鏄剧ず鐨勮鏁帮紝瓒呭嚭閮ㄥ垎鐢?..琛ㄧず*/ -o-text-overflow: ellipsis; text-overflow: ellipsis; } .page-news .section-2 .slide-right p{ width: 100%; font-size: 16px; color: #666; overflow : hidden; display: -webkit-box; /*寮规€т几缂╃洅瀛?/ -webkit-box-orient: vertical; /*瀛愬厓绱犲瀭鐩存帓鍒?/ -webkit-line-clamp: 3; /*鍙互鏄剧ず鐨勮鏁帮紝瓒呭嚭閮ㄥ垎鐢?..琛ㄧず*/ -o-text-overflow: ellipsis; text-overflow: ellipsis; -webkit-transition: 0.3s; -o-transition: 0.3s; -moz-transition: 0.3s; transition: 0.3s; } .page-news .section-2 .list:hover{ background-color: #0000dc; box-shadow: 0px 8px 15px rgba(0,0,0,0.2); } .page-news .section-2 .list:hover .link{ border-bottom-color: transparent; } .page-news .section-2 .list:hover .slide-center .date{ color: #fff; } .page-news .section-2 .list:hover .slide-center .month{ color: #fff; } .page-news .section-2 .list:hover .slide-center .year{ color: #fff; } .page-news .section-2 .list:hover .slide-right h4{ color: #fff; } .page-news .section-2 .list:hover .slide-right p{ color: #fff; } .page-news .section-2 .list:hover .slide-left .arrow{ display: block; } .section-download{ background-color: #f8f8f9; padding: 0 0 30px; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } .section-download .item-tabs .title{ border-bottom: solid 1px #dbdbdb; padding-bottom: 16px; font-size: 22px; font-weight: normal; } .section-download .item-tabs .tabs{ display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; margin: 25px 0 40px; } .section-download .item-tabs .tab{ margin-right: 20px; list-style: none; } .section-download .item-tabs .tab a{ display: block; border: solid 1px #0000dc; color: #0000dc; border-radius: 20px; width: 120px; height: 34px; line-height: 30px; text-align: center; font-size: 15px; font-family: osMedium; -webkit-transition: 0.3s; -o-transition: 0.3s; -moz-transition: 0.3s; transition: 0.3s; } .section-download .item-tabs .tabs .active a{ background-color: #0000dc; color: #fff; } .section-download .content .item1{ display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; margin: 0 -0.8%; } .section-download .content .list{ width: 31.73%; margin: 10px 0.8%; background-color: #fff; box-shadow: 0 4px 6px rgba(0,0,0,0.03); } .section-download .content .slide-top{ height: 240px; position: relative; } .section-download .content .slide-top::before{ content: ""; display: block; position: absolute; z-index: 1; left: 0; bottom: 0; width: 100%; height: 30%; background-color: rgba(0,0,0,0.3); background: -webkit-gradient(linear, left top, left bottom, from(#00000000), to(#000000)); background: -webkit-linear-gradient(top, #00000000, #000000); background: -moz-linear-gradient(top, #00000000, #000000); background: -o-linear-gradient(top, #00000000, #000000); background: linear-gradient(180deg, #00000000, #000000); } .section-download .content .slide-top img{ width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; } .section-download .content .slide-top .title{ width: 100%; text-align: center; color: #fff; position: absolute; z-index: 2; left: 0; bottom: 0; font-size: 22px; padding: 15px 10px; white-space: nowrap; overflow: hidden; -o-text-overflow: ellipsis; text-overflow: ellipsis; } .section-download .content .slide-top .icon-play{ position: absolute; left: 50%; top: 40%; -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); transform: translate(-50%, -50%); width: 50px; height: 50px; display: block; background-image: url(../images/play.png); background-position: center center; background-repeat: no-repeat; -o-background-size: 100% 100%; background-size: 100% 100%; } .section-download .content .slide-bottom{ height: 60px; display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -moz-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -webkit-justify-content: center; -moz-box-pack: center; -ms-flex-pack: center; justify-content: center; color: #888; font-size: 17px; } .section-download .content .slide-bottom .icon{ width: 25px; margin-right: 5px; } .section-download .content .slide-bottom:hover{ color: #0000dc; } .section-download .content .list:hover{ box-shadow: 0 4px 6px rgba(0,0,0,0.08); } .page-news .paging{ display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -webkit-justify-content: center; -moz-box-pack: center; -ms-flex-pack: center; justify-content: center; line-height: 48px; font-size: 18px; font-family: osMedium; color: #999; text-align: center; padding: 70px 0; } .page-news .paging a{ border: solid 1px #999; border-radius: 50%; width: 50px; height: 50px; margin: 0 10px; background-position: center center; background-repeat: no-repeat; -o-background-size: 8px auto; background-size: 8px auto; color: #999; } .page-news .paging .active{ border-color: #0000dc; background-color: #0000dc; color: #fff; } .page-news .paging .disabled{ border-color: #ddd; background-color: #ddd; color: #999; cursor: not-allowed; opacity: 0.6; } .page-news .paging .prev{ background-image: url(../images/arrow11.png); } .page-news .paging .next{ background-image: url(../images/arrow10.png); } .my-pagination{ display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -webkit-justify-content: center; -moz-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -webkit-align-items: center; -moz-box-align: center; -ms-flex-align: center; align-items: center; font-size: 18px; font-family: osMedium; color: #999; text-align: center; padding: 60px 0; } .my-pagination .van-pagination{ -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; } .my-pagination .van-pagination .van-pagination__item{ -webkit-box-flex: 0; -webkit-flex: none; -moz-box-flex: 0; -ms-flex: none; flex: none; border: solid 1px #999; border-radius: 50%; width: 50px; height: 50px; margin: 0 9px; background-color: transparent; background-position: center center; background-repeat: no-repeat; -o-background-size: 8px auto; background-size: 8px auto; color: #999; font-size: 16px; -moz-box-sizing: border-box; box-sizing: border-box; min-width: 30px; } .my-pagination .van-pagination .van-pagination__item::after{ display: none; } .my-pagination .van-pagination .van-pagination__item--active{ border-color: #0000dc; background-color: #0000dc; color: #fff; } /*----------------------------------鏂伴椈璇︽儏椤甸潰----------------------------------*/ .page-news-detail{ padding-top: 70px; } .page-news-detail .section-1{ background-color: #f8f8f8; height: 50px; line-height: 50px; } .page-news-detail .section-1 .item{ display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -moz-box-align: center; -ms-flex-align: center; align-items: center; } .page-news-detail .section-1 a{ font-size: 14px; color: #999; } .page-news-detail .section-1 a:hover{ text-decoration: underline; } .page-news-detail .section-1 .arrow{ width: 20px; height: 18px; background-position: center center; background-repeat: no-repeat; -o-background-size: 6px auto; background-size: 6px auto; background-image: url(../images/arrow10.png); } .page-news-detail .section-2{ padding: 70px 0; } .page-news-detail .section-2 .content{ padding: 0 8%; } .page-news-detail .section-2 .header .title{ font-size: 36px; font-weight: normal; text-align: center; } .page-news-detail .section-2 .header .times{ display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -webkit-justify-content: space-between; -moz-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; padding: 35px 10% 35px; } .page-news-detail .section-2 .header .times{ font-size: 16px; color: #666; } .page-news-detail .section-2 .article{ font-size: 16px; color: #666; line-height: 28px; } .page-news-detail .section-2 .article img{ width: 100%; } .page-news-detail .section-2 .article video{ display: block; width: 100%; } .page-news-detail .section-2 .article p{ margin: 25px 0; } .page-news-detail .section-2 .article h1, .page-news-detail .section-2 .article h2, .page-news-detail .section-2 .article h3, .page-news-detail .section-2 .article h4, .page-news-detail .section-2 .article h5, .page-news-detail .section-2 .article h6{ margin: 25px 0; } .page-news-detail .section-2 .item-paging{ margin-top: 40px; padding: 35px 0; border-top: solid 1px #dbdbdb; } .page-news-detail .section-2 .item-paging a{ display: block; font-size: 16px; color: #666; line-height: 28px; } .page-news-detail .section-2 .item-paging a:hover{ color: #0000dc; } /*----------------------------------鍙戝皠浠诲姟鎺掓湡椤甸潰----------------------------------*/ .page-plan{ position: relative; } .page-plan .section-banner{ position: relative; overflow: hidden; height: 700px; background-color: #333; background-position: center 100px; background-repeat: no-repeat; -o-background-size: cover; background-size: cover; -o-background-size: auto 100%; background-size: auto 100%; } .page-plan .section-banner::before{ content: ""; display: block; position: absolute; left: 0; width: -webkit-calc( (100% - 1200px)/2 + 160px ); width: -moz-calc( (100% - 1200px)/2 + 160px ); width: calc( (100% - 1200px)/2 + 160px ); height: 100%; background-color: #333; z-index: 1; display: none; } .page-plan .section-banner::after{ content: ""; display: block; position: absolute; left: 0; top: 0; width: 100%; height: 155px; background-color: #0000dc; z-index: 1; display: none; } .page-plan .section-banner .banner{ position: absolute; left: 0; right: 0; top: 70px; bottom: 0; overflow: hidden; } .page-plan .section-banner .banner .img{ width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; display: none; } .page-plan .section-banner .banner .img-mobile{ width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; display: none; } .page-plan .section-banner .content{ position: absolute; top: 110px; left: 50%; bottom: 0; -webkit-transform: translate(-50%, 0); -moz-transform: translate(-50%, 0); -ms-transform: translate(-50%, 0); -o-transform: translate(-50%, 0); transform: translate(-50%, 0); color: #fff; z-index: 2; } .page-plan .section-banner .content h1{ font-size: 50px; font-weight: normal; line-height: 80px; } .page-plan .section-banner .list-more{ display: block; width: 40px; height: 40px; border-radius: 50%; background-color: #fff; position: absolute; left: 0; bottom: 50px; z-index: 3; background-image: url(../images/arrow3.png); background-repeat: no-repeat; background-position: center center; -o-background-size: 8px auto; background-size: 8px auto; -webkit-transition: 0.3s; -o-transition: 0.3s; -moz-transition: 0.3s; transition: 0.3s; } .page-plan .section-banner .list-more:hover{ background-color: #0000dc; background-image: url(../images/arrow.png); } .page-plan .section-1 .title{ font-size: 24px; padding-bottom: 18px; font-weight: normal; border-bottom: solid 1px #dbdbdb; margin: 80px 0 40px; } .page-plan .section-1 table{ border-collapse: collapse; border-spacing: 0; border: solid 1px #eee; } .page-plan .section-1 .caption{ width: 100%; display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -webkit-justify-content: space-between; -moz-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; font-size: 18px; background-color: #0000dc; color: #fff; padding: 25px 6.8%; } .page-plan .section-1 tbody tr:nth-child(even){ background-color: #f3f3f8; } .page-plan .section-1 tbody tr:nth-child(odd){ background-color: #f8f8f9; } .page-plan .section-1 td{ padding: 25px 0; text-align: center; font-size: 16px; } .page-plan .section-1 .dian{ display: inline-block; width: 11px; height: 11px; border-radius: 50%; background-color: #0000dc; } .page-plan .section-1 .btn{ display: inline-block; width: 90px; height: 30px; line-height: 28px; border-radius: 20px; border: solid 1px #0000dc; color: #0000dc; font-size: 14px; } .page-plan .section-1 .btn:hover{ background-color: #0000dc; color: #fff; } .modal-submit-plan{ position: fixed; left: 0; top: 0; z-index: 999; opacity: 0; visibility: hidden; width: 0; height: 0; } .modal-submit-plan .mask{ position: fixed; left: 0; top: 0; width: 100%; height: 100%; background-color: rgba(0,0,0,0.5); } .modal-submit-plan .content{ position: fixed; left: 50%; top: 50%; -webkit-transform: translate(-50%, -50%) scale(0); -moz-transform: translate(-50%, -50%) scale(0); -ms-transform: translate(-50%, -50%) scale(0); -o-transform: translate(-50%, -50%) scale(0); transform: translate(-50%, -50%) scale(0); height: 670px; background-color: #fff; padding: 20px 50px 20px; visibility: hidden; opacity: 0; -webkit-transition: 0.3s; -o-transition: 0.3s; -moz-transition: 0.3s; transition: 0.3s; } .modal-submit-plan .content .title{ font-size: 20px; } .modal-submit-plan .content .plan{ margin-top: 20px; } .modal-submit-plan .content .row{ display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -moz-box-align: center; -ms-flex-align: center; align-items: center; padding: 8px 0; } .modal-submit-plan .content .row .col:nth-child(1){ width: 8em; } .modal-submit-plan .content .row .col:nth-child(2){ -webkit-box-flex: 1; -webkit-flex: 1; -moz-box-flex: 1; -ms-flex: 1; flex: 1; } .modal-submit-plan .content .row .col:nth-child(3){ margin-left: 40px; width: 6em; } .modal-submit-plan .content .row .col:nth-child(4){ -webkit-box-flex: 1; -webkit-flex: 1; -moz-box-flex: 1; -ms-flex: 1; flex: 1; } .modal-submit-plan .content .t-title{ height: 36px; display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -moz-box-align: center; -ms-flex-align: center; align-items: center; position: relative; } .modal-submit-plan .content .t-title .text{ color: #666; font-size: 15px; } .modal-submit-plan .content .t-title .star{ color: #f00; font-size: 14px; display: block; position: absolute; left: -10px; top: 10px; } .modal-submit-plan .content input{ width: 100%; min-width: 250px; height: 40px; background-color: #f8f8f8; border: 0; padding: 0 10px; font-size: 15px; font-family: Microsoft YaHei; } .modal-submit-plan .content .row input.title{ font-size: 15px; font-weight: normal; } .modal-submit-plan .content select{ width: 100%; height: 40px; background: #f8f8f8; border: 0; padding: 0 10px; font-size: 16px; font-family: Microsoft YaHei; } .mySelect{ position: relative; z-index: 99; } .mySelect .select{ width: 100%; position: absolute; left: 0; top: 51px; background: #fff; box-shadow: 0px 0px 22px rgba(0,0,220,0.15); display: none; } .mySelect input{ cursor: pointer; background-image: url(../images/arrow18.png); background-position: 97% center; background-repeat: no-repeat; -o-background-size: 11px auto; background-size: 11px auto; } .mySelect .select .option{ list-style: none; height: 50px; line-height: 50px; text-align: center; position: relative; color: #666; font-size: 15px; cursor: pointer; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } .mySelect .select .option::before{ content: ""; position: absolute; left: 50%; -webkit-transform: translate(-50%, 0); -moz-transform: translate(-50%, 0); -ms-transform: translate(-50%, 0); -o-transform: translate(-50%, 0); transform: translate(-50%, 0); top: -19px; border: solid 10px transparent; border-bottom: solid 10px #0000dc; border-bottom-color: #fff; display: none; } .mySelect .select .option::after{ content: ""; display: block; position: absolute; left: 20px; right: 20px; top: 0; border-top: solid 1px #e9e9e9; } .mySelect .select .option:nth-child(1)::before{ display: block; } .mySelect .select .option:nth-child(1)::after{ border: 0; } .mySelect .select .option:hover::before{ border-bottom-color: #0000dc; } .mySelect .select .option:hover::after{ display: none; } .mySelect .select .option:hover{ background-color: #0000dc; color: #fff; } .mySelect .select .option:hover{ background-color: #0000dc; color: #fff; } .mySelect.show .select{ display: block; } .modal-submit-plan .content textarea{ width: 100%; height: 160px; background: #f8f8f8; border: 0; padding: 8px 10px; font-size: 16px; font-family: Microsoft YaHei; } .modal-submit-plan .content .msg{ font-size: 13px; } .modal-submit-plan .content .msg a{ color: #0000dc; font-family: osMedium; } .modal-submit-plan .content .btns{ width: 100%; display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -webkit-justify-content: center; -moz-box-pack: center; -ms-flex-pack: center; justify-content: center; } .modal-submit-plan .content .btns a{ width: 120px; height: 45px; line-height: 43px; border-radius: 40px; border: solid 1px #4141da; color: #4141da; font-size: 18px; text-align: center; margin: 20px 20px 0; } .modal-submit-plan .content .btns a:nth-child(1){ background-color: #0000dc; background: -webkit-linear-gradient(135deg, #5E5EFB, #4141DA); background: -moz-linear-gradient(135deg, #5E5EFB, #4141DA); background: -o-linear-gradient(135deg, #5E5EFB, #4141DA); background: linear-gradient(-45deg, #5E5EFB, #4141DA); color: #fff; } .modal-submit-plan.show{ width: 100%; height: 100%; opacity: 1; visibility: visible; } .modal-submit-plan.show .content{ visibility: visible; opacity: 1; -webkit-transform: translate(-50%, -50%) scale(1); -moz-transform: translate(-50%, -50%) scale(1); -ms-transform: translate(-50%, -50%) scale(1); -o-transform: translate(-50%, -50%) scale(1); transform: translate(-50%, -50%) scale(1); } .modal-submit-plan .content .row-yzm .col:nth-child(3){ width: auto; margin-left: 10px; } .modal-submit-plan .content .row-yzm .yzm{ width: 80px; height: 40px; } .page-news-detail .section-2 .article li{ margin-left: 1em; } .layerVideo{ width: 100%; } .layerVideo video{ display: block; width: 100%; }