|
|
@@ -1,1601 +1,1601 @@
|
|
|
-html {
|
|
|
- scroll-behavior: smooth;
|
|
|
- scroll-padding-top: 7vh;
|
|
|
-}
|
|
|
-body{
|
|
|
- width: 100vw;
|
|
|
- height: 100vh;
|
|
|
-}
|
|
|
-#scrollTop {
|
|
|
- display: none !important;
|
|
|
-}
|
|
|
-[v-cloak] {
|
|
|
- opacity: 0;
|
|
|
-}
|
|
|
-.text_info {
|
|
|
- width: 100vw;
|
|
|
- height: 100%;
|
|
|
- box-sizing: border-box;
|
|
|
- overflow-y: scroll;
|
|
|
-}
|
|
|
-.text_info .text_info_contain {
|
|
|
- height: auto;
|
|
|
- padding: 10vh 24vw;
|
|
|
- box-sizing: border-box;
|
|
|
- width: 100%;
|
|
|
- background: #fff;
|
|
|
-}
|
|
|
-.text_info .text_info_contain p {
|
|
|
- font-size: 16px;
|
|
|
- line-height: 30px;
|
|
|
- color: #777;
|
|
|
-}
|
|
|
-.username {
|
|
|
- color: #FF5B00;
|
|
|
- position: relative;
|
|
|
- cursor: pointer;
|
|
|
- box-sizing: border-box;
|
|
|
- height: 20px;
|
|
|
- display: flex;
|
|
|
- justify-content: center;
|
|
|
- align-items: center;
|
|
|
-}
|
|
|
-.username::after {
|
|
|
- content: '\276F';
|
|
|
- font-weight: normal;
|
|
|
- position: absolute;
|
|
|
- right: -14px;
|
|
|
- top: 0;
|
|
|
- transform: rotate(90deg);
|
|
|
- transition: .3s;
|
|
|
-}
|
|
|
-.username:hover {
|
|
|
- border-bottom: 1px solid;
|
|
|
-}
|
|
|
-.username:hover::after{
|
|
|
- transform: rotate(270deg);
|
|
|
-}
|
|
|
-.username .el-popover__reference-wrapper .el-button--text {
|
|
|
- color: #FF5B00;
|
|
|
-}
|
|
|
-.el-popover {
|
|
|
- padding: 5px !important;
|
|
|
- min-width: 90px !important;
|
|
|
-}
|
|
|
-.el-popover .cShow {
|
|
|
- display: flex;
|
|
|
- flex-direction: column;
|
|
|
- justify-content: space-around;
|
|
|
- align-items: center;
|
|
|
-}
|
|
|
-.el-popover__reference{
|
|
|
- font-size: 0.8vw;
|
|
|
-}
|
|
|
-.a_cm {
|
|
|
- padding: 10px;
|
|
|
-}
|
|
|
-.login_a:hover {
|
|
|
- color: white;
|
|
|
-}
|
|
|
-.slide_icon {
|
|
|
- display: flex;
|
|
|
- justify-content: center;
|
|
|
- align-items: center;
|
|
|
- flex-direction: column;
|
|
|
- position: fixed;
|
|
|
- right: 1vw;
|
|
|
- bottom: 90px;
|
|
|
- background: #FF5B00;
|
|
|
- border-radius: 4px;
|
|
|
- padding: 4px;
|
|
|
- height: auto;
|
|
|
- z-index: 999;
|
|
|
-}
|
|
|
-.slide_icon .slide_icon_item {
|
|
|
- width: 100%;
|
|
|
- height: 65px;
|
|
|
- display: flex;
|
|
|
- justify-content: center;
|
|
|
- align-items: end;
|
|
|
- color: #FFFFFF;
|
|
|
- font-size: 14px;
|
|
|
- cursor: pointer;
|
|
|
- padding: 0.4vw 0;
|
|
|
- box-sizing: border-box;
|
|
|
-}
|
|
|
-.slide_icon_item:nth-child(1){
|
|
|
- background: url(/img/supplier-login/float/d.png) center no-repeat;
|
|
|
- background-position: top;
|
|
|
-}
|
|
|
-.slide_icon_item:nth-child(3){
|
|
|
- background: url(/img/supplier-login/float/z.png) center no-repeat;
|
|
|
-}
|
|
|
-.slide_icon_item:nth-child(2){
|
|
|
- border-top: 1px solid rgb(255,255,255, 0.3);
|
|
|
- border-bottom: 1px solid rgb(255,255,255, 0.3);
|
|
|
- background: url(/img/supplier-login/float/w.png) center no-repeat;
|
|
|
- background-position: top;
|
|
|
-}
|
|
|
-.tooltip {
|
|
|
- background: #FFFFFF;
|
|
|
- box-shadow: 0px 4px 16px 0px rgba(51,51,51,0.12);
|
|
|
- border-radius: 4px;
|
|
|
- z-index: 999;
|
|
|
- position: fixed;
|
|
|
- transition: .3s;
|
|
|
- display: flex;
|
|
|
- justify-content: space-around;
|
|
|
- flex-direction: column;
|
|
|
- right: 90px;
|
|
|
-}
|
|
|
-
|
|
|
-.slide_icon .slide_icon_item .tooltip_1{
|
|
|
- width: 170px;
|
|
|
- height: 64px;
|
|
|
- padding: 10px;
|
|
|
- text-align: center;
|
|
|
- display: none;
|
|
|
- opacity: 0;
|
|
|
-}
|
|
|
-.slide_icon .slide_icon_item .tooltip_1 .day {
|
|
|
- color: #666666;
|
|
|
- font-size: 16px;
|
|
|
-}
|
|
|
-.slide_icon .slide_icon_item .tooltip_1 .phone_number {
|
|
|
- color: #FF5B00;
|
|
|
- font-size: 20px;
|
|
|
-}
|
|
|
-.slide_icon .slide_icon_item .tooltip_1::after {
|
|
|
- content: '';
|
|
|
- height: 0;
|
|
|
- width: 0;
|
|
|
- border: 10px solid transparent;
|
|
|
- border-left: 15px solid white;
|
|
|
- display: block;
|
|
|
- position: absolute;
|
|
|
- right: -20px;
|
|
|
- bottom: 0;
|
|
|
-}
|
|
|
-.slide_icon .slide_icon_item .tooltip_2::after {
|
|
|
- content: '';
|
|
|
- height: 0;
|
|
|
- width: 0;
|
|
|
- border: 10px solid transparent;
|
|
|
- border-left: 15px solid white;
|
|
|
- display: block;
|
|
|
- position: absolute;
|
|
|
- right: -20px;
|
|
|
- top: 0;
|
|
|
-}
|
|
|
-.slide_icon .slide_icon_item .tooltip_2{
|
|
|
- width: 150px;
|
|
|
- height: 150px;
|
|
|
- display: none;
|
|
|
- opacity: 0;
|
|
|
-}
|
|
|
-.slide_icon .slide_icon_phone:hover .tooltip_1 {
|
|
|
- opacity: 1;
|
|
|
- display: flex;
|
|
|
-}
|
|
|
-.slide_icon .slide_icon_qrcode:hover .tooltip_2 {
|
|
|
- opacity: 1;
|
|
|
- display: flex;
|
|
|
-}
|
|
|
-.slide_icon_item .slide_icon_phone .slide_icon_text {
|
|
|
- color:#666666;
|
|
|
-}
|
|
|
-.slide_icon .slide_icon_item .slide_icon_phone .slid_phonenumber {
|
|
|
- font-size: 1vw;
|
|
|
- color: #FF5B00;
|
|
|
-}
|
|
|
-.login_header{
|
|
|
- width: 100vw;
|
|
|
- display: flex;
|
|
|
- justify-content: center;
|
|
|
- height: 7vh;
|
|
|
- position: fixed;
|
|
|
- top: 0;
|
|
|
- left: 0;
|
|
|
- background: #fff;
|
|
|
- z-index: 999;
|
|
|
-}
|
|
|
-.login_header_container{
|
|
|
- width: 95vw;
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
- justify-content: space-between;
|
|
|
-}
|
|
|
-.img_logo {
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
- cursor: pointer;
|
|
|
-}
|
|
|
-.img_logo .logo {
|
|
|
- width: 5.5vw;
|
|
|
- height: 4vh;
|
|
|
- background: url("/img/supplier-login/logo.png") no-repeat;
|
|
|
- background-size: 100% 100%;
|
|
|
-}
|
|
|
-.text {
|
|
|
- font-size: 1.2vw;
|
|
|
- font-weight: 400;
|
|
|
- color: #272727;
|
|
|
-}
|
|
|
-.header_link{
|
|
|
- align-items: center;
|
|
|
- position: relative;
|
|
|
- height: 100%;
|
|
|
- display: flex;
|
|
|
- overflow: hidden;
|
|
|
-}
|
|
|
-.header_link .nav_link {
|
|
|
- position: absolute;
|
|
|
- left: 36vw;
|
|
|
- top: 0;
|
|
|
- display: flex;
|
|
|
- justify-content: center;
|
|
|
- align-items: end;
|
|
|
- width: 6vw;
|
|
|
- height: 100%;
|
|
|
- transition: .3s;
|
|
|
-}
|
|
|
-.header_link .nav_link .nav_link_item{
|
|
|
- width: 1.2vw;
|
|
|
- height: 0.2vh;
|
|
|
- background: #FF5B00;
|
|
|
- border-radius: 8px;
|
|
|
- margin-bottom: 1vh;
|
|
|
-}
|
|
|
-.header_link .header_link_itme {
|
|
|
- cursor: pointer;
|
|
|
- font-size: 0.84vw;
|
|
|
- width: 6vw;
|
|
|
- height: 100%;
|
|
|
- display: flex;
|
|
|
- justify-content: center;
|
|
|
- align-items: center;
|
|
|
- z-index: 1;
|
|
|
-}
|
|
|
-.header_link .header_link_itme:hover{
|
|
|
- color: #FF5B00;
|
|
|
- transform: scale(1.1);
|
|
|
-}
|
|
|
-.header_link_itme:nth-child(1):hover ~ .nav_link {
|
|
|
- left: 0vw !important;
|
|
|
-}
|
|
|
-.header_link_itme:nth-child(2):hover ~ .nav_link {
|
|
|
- left: 6vw !important;
|
|
|
-}
|
|
|
-.header_link_itme:nth-child(3):hover ~ .nav_link {
|
|
|
- left: 12vw !important;
|
|
|
-}
|
|
|
-.header_link_itme:nth-child(4):hover ~ .nav_link {
|
|
|
- left: 18vw !important;
|
|
|
-}
|
|
|
-.header_link_itme:nth-child(5):hover ~ .nav_link {
|
|
|
- left: 24vw !important;
|
|
|
-}
|
|
|
-.header_link_itme:nth-child(6):hover ~ .nav_link {
|
|
|
- left: 30vw !important;
|
|
|
-}
|
|
|
-.header_link_itme:nth-child(7):hover ~ .nav_link {
|
|
|
- left: 36vw !important;
|
|
|
-}
|
|
|
-.header_link_itme:nth-child(8):hover ~ .nav_link {
|
|
|
- left: 49vw !important;
|
|
|
-}
|
|
|
-.isActiveLink {
|
|
|
- color: #FF5B00;
|
|
|
- transform: scale(1.1);
|
|
|
-}
|
|
|
-.login_header_container .iphone {
|
|
|
- width: 12vw;
|
|
|
- height: 100%;
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
- justify-content: center;
|
|
|
- margin-right: 5%;
|
|
|
-}
|
|
|
-.login_header_container .iphone div:nth-child(1){
|
|
|
- width: 36px;
|
|
|
- height: 36px;
|
|
|
- background: url("/img/supplier-login/iPhone.png") no-repeat;
|
|
|
- background-size: contain;
|
|
|
- background-position: center;
|
|
|
-}
|
|
|
-.login_header_container .iphone div:nth-child(2) {
|
|
|
- color: #FF5B00;
|
|
|
- font-size: 1vw;
|
|
|
- margin-left: 5px;
|
|
|
- font-weight: bold;
|
|
|
- white-space: nowrap;
|
|
|
-}
|
|
|
-.login_header_container .login_regist {
|
|
|
- display: flex;
|
|
|
- justify-content: space-between;
|
|
|
- align-items: center;
|
|
|
- width: 8vw;
|
|
|
- height: 100%;
|
|
|
-}
|
|
|
-.login_header_container .login_regist .login_btn{
|
|
|
- width: 40%;
|
|
|
- font-size: 0.7vw;
|
|
|
- border: 1px solid #ccc;
|
|
|
- text-align: center;
|
|
|
- padding: 0.2vw;
|
|
|
-}
|
|
|
-#login_content {
|
|
|
- position: relative;
|
|
|
- width: 100vw;
|
|
|
-}
|
|
|
-#fullpage {
|
|
|
- width: 100vw;
|
|
|
- position: absolute;
|
|
|
- left: 0;
|
|
|
- top: 0;
|
|
|
- height: 800vh;
|
|
|
- scroll-behavior: smooth;
|
|
|
- transition: all 0.8s ease;
|
|
|
-}
|
|
|
-#fullpage .page {
|
|
|
- width: 100vw;
|
|
|
- height: 100vh;
|
|
|
- scroll-snap-align: start;
|
|
|
- box-sizing: border-box;
|
|
|
- overflow: hidden;
|
|
|
-}
|
|
|
-#fullpage #zeroPage {
|
|
|
- height: auto;
|
|
|
- padding-top: 7vh;
|
|
|
-}
|
|
|
-#zeroPage .el-carousel__container {
|
|
|
- height: 510px;
|
|
|
-}
|
|
|
-.el-carousel__item:nth-child(1) {
|
|
|
- display: flex;
|
|
|
- justify-content: center;
|
|
|
- align-items: center;
|
|
|
-}
|
|
|
-#zeroPage .banner01 {
|
|
|
- background: url("/img/supplier-login/01-banner/banner-01.png") no-repeat;
|
|
|
- background-size: 100% 100%;
|
|
|
- width: 100%;
|
|
|
- height: 100%;
|
|
|
- display: flex;
|
|
|
- justify-content: center;
|
|
|
- align-items: center;
|
|
|
-}
|
|
|
-#zeroPage .banner01 .left {
|
|
|
- height: 155px;
|
|
|
- width: 640px;
|
|
|
- background: url(/img/supplier-login/01-banner/banner-02-left.png) no-repeat;
|
|
|
- background-size: contain;
|
|
|
- background-position: right;
|
|
|
-}
|
|
|
-#zeroPage .banner01 .right {
|
|
|
- height: 377px;
|
|
|
- width: 459px;
|
|
|
- background: url(/img/supplier-login/01-banner/banner-01-right.png) no-repeat;
|
|
|
- background-size: contain;
|
|
|
-}
|
|
|
-#zeroPage .banner02 {
|
|
|
- background: url("/img/supplier-login/banner-2/banner-02.png") no-repeat;
|
|
|
- background-size: cover;
|
|
|
- width: 100%;
|
|
|
- height: 100%;
|
|
|
- display: flex;
|
|
|
- justify-content: center;
|
|
|
- align-items: center;
|
|
|
- background-position: center;
|
|
|
-}
|
|
|
-#zeroPage .banner02 .left {
|
|
|
- height: 45%;
|
|
|
- width: 50%;
|
|
|
- background: url(/img/supplier-login/banner-2/banner-02-left.png) no-repeat;
|
|
|
- background-size: contain;
|
|
|
- background-position: right;
|
|
|
-}
|
|
|
-#zeroPage .banner02 .right {
|
|
|
- height: 70%;
|
|
|
- width: 40%;
|
|
|
- background: url(/img/supplier-login/banner-2/banner-02-right.png) no-repeat;
|
|
|
- background-size: contain;
|
|
|
-}
|
|
|
-.el-carousel__item:nth-child(2) {
|
|
|
- display: flex;
|
|
|
- justify-content: center;
|
|
|
- align-items: center;
|
|
|
- background: url("/img/supplier-login/01-banner/banner-01.png");
|
|
|
-}
|
|
|
-.el-carousel__indicator--horizontal .el-carousel__button {
|
|
|
- width: 6px;
|
|
|
- height: 6px;
|
|
|
- border-radius: 50%;
|
|
|
- background-color: #ccc;
|
|
|
- opacity: 1;
|
|
|
-}
|
|
|
-.el-carousel__indicator--horizontal.is-active .el-carousel__button{
|
|
|
- width: 6px;
|
|
|
- height: 6px;
|
|
|
- background: #FF5B00;
|
|
|
- border-radius: 50%;
|
|
|
- opacity: 1;
|
|
|
-}
|
|
|
-#zeroPage {
|
|
|
- background-color: #fff;
|
|
|
-}
|
|
|
-#zeroPage .server {
|
|
|
- display: flex;
|
|
|
- justify-content: center;
|
|
|
- align-items: center;
|
|
|
- width: 100vw;
|
|
|
- height: 600px;
|
|
|
- box-sizing: border-box;
|
|
|
-}
|
|
|
-.server .server_1,
|
|
|
-.server .server_2,
|
|
|
-.server .server_3 {
|
|
|
- height: 460px;
|
|
|
- width: 390px;
|
|
|
- position: relative;
|
|
|
-}
|
|
|
-#zeroPage .server .box {
|
|
|
- position: absolute;
|
|
|
- height: 100%;
|
|
|
- width: 100%;
|
|
|
- -webkit-backface-visibility: hidden;
|
|
|
- backface-visibility: hidden;
|
|
|
- -webkit-transform-style: preserve-3d;
|
|
|
- transform-style: preserve-3d;
|
|
|
- -webkit-transition: ease-in-out 600ms;
|
|
|
- -o-transition: ease-in-out 600ms;
|
|
|
- transition: .5s;
|
|
|
-}
|
|
|
-#zeroPage .server .tourist_bg,
|
|
|
-#zeroPage .server .sale_bg,
|
|
|
-#zeroPage .server .operate_bg {
|
|
|
- display: flex;
|
|
|
- flex-direction: column;
|
|
|
- justify-content: space-around;
|
|
|
- align-items: center;
|
|
|
- font-size: 18px;
|
|
|
- padding: 60px;
|
|
|
- box-sizing: border-box;
|
|
|
-}
|
|
|
-#zeroPage .server .operate,
|
|
|
-#zeroPage .server .tourist,
|
|
|
-#zeroPage .server .sale {
|
|
|
- width: 400px;
|
|
|
- height: 100%;
|
|
|
- transition: .5s;
|
|
|
- display: flex;
|
|
|
- flex-direction: column;
|
|
|
- justify-content: space-around;
|
|
|
- align-items: center;
|
|
|
- font-size: 18px;
|
|
|
- padding: 30px;
|
|
|
- box-sizing: border-box;
|
|
|
- background: linear-gradient(0deg, #FF5B00, #FF9300);
|
|
|
- -webkit-transform: rotateY(-180deg);
|
|
|
- transform: rotateY(-180deg);
|
|
|
- color: #fff;
|
|
|
- white-space: nowrap;
|
|
|
-}
|
|
|
-#zeroPage .server .tourist_logo {
|
|
|
- width: 100px;
|
|
|
- height: 100px;
|
|
|
- background: url("/img/supplier-login/cycle/-11.png") no-repeat;
|
|
|
- background-size: cover;
|
|
|
-}
|
|
|
-#zeroPage .server .tourist_bg_logo {
|
|
|
- background: url("/img/supplier-login/cycle/1.png") no-repeat;
|
|
|
- width: 160px;
|
|
|
- height: 160px;
|
|
|
- background-size: cover;
|
|
|
-}
|
|
|
-#zeroPage .server .tourist_bg_title {
|
|
|
- color: black;
|
|
|
-}
|
|
|
-#zeroPage .server .tourist_title {
|
|
|
- color: #fff;
|
|
|
-}
|
|
|
-#zeroPage .server .server_1:hover .tourist_bg{
|
|
|
- -webkit-transform: rotateY(180deg) !important;
|
|
|
- transform: rotateY(180deg) !important;
|
|
|
-}
|
|
|
-#zeroPage .server .server_1:hover .tourist {
|
|
|
- -webkit-transform: rotateY(0deg) !important;
|
|
|
- transform: rotateY(0deg) !important;
|
|
|
-}
|
|
|
-#zeroPage .server .server_2:hover .operate_bg{
|
|
|
- -webkit-transform: rotateY(180deg) !important;
|
|
|
- transform: rotateY(180deg) !important;
|
|
|
-}
|
|
|
-#zeroPage .server .server_2:hover .operate {
|
|
|
- -webkit-transform: rotateY(0deg) !important;
|
|
|
- transform: rotateY(0deg) !important;
|
|
|
-}
|
|
|
-#zeroPage .server .server_3:hover .sale_bg{
|
|
|
- -webkit-transform: rotateY(180deg) !important;
|
|
|
- transform: rotateY(180deg) !important;
|
|
|
-}
|
|
|
-#zeroPage .server .server_3:hover .sale {
|
|
|
- -webkit-transform: rotateY(0deg) !important;
|
|
|
- transform: rotateY(0deg) !important;
|
|
|
-}
|
|
|
-#zeroPage .server .operate_logo {
|
|
|
- background: url("/img/supplier-login/cycle/-22.png") no-repeat;
|
|
|
- width: 100px;
|
|
|
- height: 100px;
|
|
|
- background-size: cover;
|
|
|
-}
|
|
|
-#zeroPage .server .operate_bg_logo {
|
|
|
- background: url("/img/supplier-login/cycle/2.png") no-repeat;
|
|
|
- width: 160px;
|
|
|
- height: 160px;
|
|
|
- background-size: cover;
|
|
|
-}
|
|
|
-#zeroPage .server .operate_bg_title {
|
|
|
- color: black;
|
|
|
-}
|
|
|
-#zeroPage .server .all_cont {
|
|
|
- font-size: 16px;
|
|
|
- box-sizing: border-box;
|
|
|
- text-align: center;
|
|
|
-}
|
|
|
-#zeroPage .server .sale_logo {
|
|
|
- background: url("/img/supplier-login/cycle/-33.png") no-repeat;
|
|
|
- width: 100px;
|
|
|
- height: 100px;
|
|
|
- background-size: cover;
|
|
|
-}
|
|
|
-#zeroPage .server .sale_bg_logo {
|
|
|
- background: url("/img/supplier-login/cycle/3.png") no-repeat;
|
|
|
- width: 160px;
|
|
|
- height: 160px;
|
|
|
- background-size: cover;
|
|
|
-}
|
|
|
-#zeroPage .server .sale_bg_title {
|
|
|
- color: black;
|
|
|
-}
|
|
|
-#firstPage {
|
|
|
- background: url("/img/supplier-login/selection/select_bg.png") no-repeat;
|
|
|
- background-size: cover;
|
|
|
- height: 1014px !important;
|
|
|
-}
|
|
|
-#firstPage .selection {
|
|
|
- display: flex;
|
|
|
- justify-content: center;
|
|
|
- align-items: center;
|
|
|
- margin-top: 78px;
|
|
|
-}
|
|
|
-#firstPage .selection .selection_item{
|
|
|
- padding-top: 20px;
|
|
|
- box-sizing: border-box;
|
|
|
- transition: .3s;
|
|
|
- height: 666px;
|
|
|
-}
|
|
|
-#firstPage .selection .selection_item:hover {
|
|
|
- padding-top: 0;
|
|
|
-}
|
|
|
-#firstPage .selection .selection_item:hover .select_btn {
|
|
|
- background-color: #FF5B00;
|
|
|
- color: white;
|
|
|
-}
|
|
|
-#firstPage .selection .selection_item:nth-child(2){
|
|
|
- margin: 2vh;
|
|
|
-}
|
|
|
-#firstPage .selection_item .selection_item_contain {
|
|
|
- width: 392px;
|
|
|
- height: 646px;
|
|
|
- background-color: #fff;
|
|
|
-}
|
|
|
-#firstPage .selection_item .selection_item_contain .contain_bg_01 {
|
|
|
- width: 392px;
|
|
|
- height: 120px;
|
|
|
- background: url("/img/supplier-login/selection/select_01.png") no-repeat;
|
|
|
- background-size: 100%;
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
- justify-content: center;
|
|
|
- color: #FFFFFF;
|
|
|
- font-weight: bold;
|
|
|
- font-size: 40px;
|
|
|
-}
|
|
|
-#firstPage .selection_item .selection_item_contain .contain_bg_02 {
|
|
|
- width: 392px;
|
|
|
- height: 120px;
|
|
|
- background: url("/img/supplier-login/selection/select_02.png") no-repeat;
|
|
|
- background-size: 100%;
|
|
|
- display: flex;
|
|
|
- justify-content: center;
|
|
|
- align-items: center;
|
|
|
- color: #FFFFFF;
|
|
|
- font-weight: bold;
|
|
|
- font-size: 2vw;
|
|
|
-}
|
|
|
-#firstPage .selection_item .selection_item_contain .contain_bg_03 {
|
|
|
- width: 392px;
|
|
|
- height: 120px;
|
|
|
- background: url("/img/supplier-login/selection/select_03.png") no-repeat;
|
|
|
- background-size: 100%;
|
|
|
- display: flex;
|
|
|
- justify-content: center;
|
|
|
- align-items: center;
|
|
|
- color: #FFFFFF;
|
|
|
- font-weight: bold;
|
|
|
- font-size: 2vw;
|
|
|
-}
|
|
|
-#firstPage .selection_item_contain .bg1_text {
|
|
|
- width: 100%;
|
|
|
- display: flex;
|
|
|
- flex-direction: column;
|
|
|
- align-items: center;
|
|
|
- justify-content: space-between;
|
|
|
- font-size: 18px;
|
|
|
- padding: 48px;
|
|
|
- box-sizing: border-box;
|
|
|
- height: 526px;
|
|
|
-}
|
|
|
-.bg1_contain {
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
- width: 100%;
|
|
|
- font-size: 0.8vw;
|
|
|
- height: 3.5vh;
|
|
|
- white-space: nowrap;
|
|
|
-}
|
|
|
-.square_icon {
|
|
|
- width: 0.2vw;
|
|
|
- height: 0.2vw;
|
|
|
- border: 1px solid #B2B2B2;
|
|
|
- margin: 0 0.5vw;
|
|
|
- transform: rotate(45deg);
|
|
|
-}
|
|
|
-.text_contain {
|
|
|
- display: flex;
|
|
|
- flex-direction: column;
|
|
|
- align-items: center;
|
|
|
- justify-content: space-between;
|
|
|
- width: 100%;
|
|
|
- height: 257px;
|
|
|
-}
|
|
|
-.select_btn {
|
|
|
- width: 100%;
|
|
|
- height: 5vh;
|
|
|
- border: 1px solid #E2E2E2;
|
|
|
- display: flex;
|
|
|
- justify-content: center;
|
|
|
- align-items: center;
|
|
|
- border-radius: 4px;
|
|
|
- cursor: pointer;
|
|
|
-}
|
|
|
-.select_btn_login {
|
|
|
- width: 100%;
|
|
|
- height: 5vh;
|
|
|
- border: 1px solid #E2E2E2;
|
|
|
- display: flex;
|
|
|
- justify-content: center;
|
|
|
- align-items: center;
|
|
|
- border-radius: 4px;
|
|
|
- background: #cccccc;
|
|
|
-}
|
|
|
-.Title {
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
- justify-content: space-around;
|
|
|
- flex-direction: column;
|
|
|
- width: 100%;
|
|
|
- height: 11vh;
|
|
|
- margin-top: 5vh;
|
|
|
-}
|
|
|
-.Title .text {
|
|
|
- font-size: 1.8vw;
|
|
|
-}
|
|
|
-.Title .title {
|
|
|
- font-size: 0.9vw;
|
|
|
-}
|
|
|
-#secondPage .operationa{
|
|
|
- display: flex;
|
|
|
- justify-content: center;
|
|
|
- align-items: center;
|
|
|
- margin-top: 4vh;
|
|
|
-}
|
|
|
-#secondPage .operationa_contain {
|
|
|
- width: 940px;
|
|
|
- height: 570px;
|
|
|
- position: relative;
|
|
|
-}
|
|
|
-#secondPage .operationa_contain .bg2{
|
|
|
- position: absolute;
|
|
|
- left: 0;
|
|
|
- top: 0;
|
|
|
- width: 100%;
|
|
|
- height: 100%;
|
|
|
- background: url("/img/supplier-login/oprate/bg_1.png") no-repeat;
|
|
|
- background-size: cover;
|
|
|
-}
|
|
|
-#secondPage .operationa_contain .bg3{
|
|
|
- position: absolute;
|
|
|
- left: 0;
|
|
|
- top: 0;
|
|
|
- width: 100%;
|
|
|
- height: 100%;
|
|
|
- background: url("/img/supplier-login/oprate/author/bg_2.png") no-repeat;
|
|
|
- background-size: cover;
|
|
|
-}
|
|
|
-#secondPage .operationa_contain .bg1 {
|
|
|
- position: absolute;
|
|
|
- left: 0;
|
|
|
- top: 10px;
|
|
|
- width: 97.8%;
|
|
|
- height: 90%;
|
|
|
- background: url(/img/supplier-login/oprate/bg_2.png) no-repeat;
|
|
|
- background-size: contain;
|
|
|
- background-position: right;
|
|
|
-}
|
|
|
-#secondPage .operationa_contain .bg4 {
|
|
|
- left: 6px;
|
|
|
- top: 14px;
|
|
|
- width: 70%;
|
|
|
- height: 100%;
|
|
|
- background: url(/img/supplier-login/oprate/bg_1.png) no-repeat;
|
|
|
- background-size: contain;
|
|
|
- position: absolute;
|
|
|
- z-index: -1;
|
|
|
-}
|
|
|
-.operationa_contain .online_store {
|
|
|
- width: 400px;
|
|
|
- height: 70px;
|
|
|
- position: absolute;
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
- left: 75px;
|
|
|
- top: 45px;
|
|
|
- border-bottom: 2px solid #FFCEAF;
|
|
|
-}
|
|
|
-.operationa_contain .online_store .online_logo {
|
|
|
- width: 62px;
|
|
|
- height: 100%;
|
|
|
- border-bottom: 6px solid #FFC39A;
|
|
|
- border-radius: 4px;
|
|
|
- background: url(/img/supplier-login/oprate/house.png) no-repeat;
|
|
|
- background-size: contain;
|
|
|
- background-position: top;
|
|
|
-}
|
|
|
-.online_title {
|
|
|
- font-size: 1.8vw;
|
|
|
- font-weight: bold;
|
|
|
- margin-left: 20px;
|
|
|
-}
|
|
|
-.operationa_contain .author_active {
|
|
|
- width: 400px;
|
|
|
- height: 70px;
|
|
|
- position: absolute;
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
- right: 75px;
|
|
|
- top: 45px;
|
|
|
- border-bottom: 2px solid #FFCEAF;
|
|
|
- flex-direction: row-reverse;
|
|
|
-}
|
|
|
-.operationa_contain .author_active .online_logo {
|
|
|
- width: 62px;
|
|
|
- height: 100%;
|
|
|
- border-bottom: 6px solid #FFC39A;
|
|
|
- border-radius: 4px;
|
|
|
- background: url(/img/supplier-login/oprate/z.png) no-repeat;
|
|
|
- background-size: contain;
|
|
|
- background-position: top;
|
|
|
-}
|
|
|
-.online_title {
|
|
|
- font-size: 1.8vw;
|
|
|
- font-weight: bold;
|
|
|
- margin-right: 20px;
|
|
|
-}
|
|
|
-.operationa_contain .online {
|
|
|
- width: 383px;
|
|
|
- height: 53px;
|
|
|
- position: absolute;
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
- left: 56px;
|
|
|
- top: 37px;
|
|
|
-}
|
|
|
-.online_title {
|
|
|
- font-size: 28px;
|
|
|
- font-weight: bold;
|
|
|
- margin-right: 20px;
|
|
|
-}
|
|
|
-.operationa_contain .online .online_logo{
|
|
|
- width: 62px;
|
|
|
- height: 100%;
|
|
|
- border-radius: 4px;
|
|
|
- background: url(/img/supplier-login/oprate/house.png) no-repeat;
|
|
|
- background-size: contain;
|
|
|
- background-position: top;
|
|
|
-}
|
|
|
-.operationa_contain .author {
|
|
|
- width: 222px;
|
|
|
- height: 65px;
|
|
|
- position: absolute;
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
- right: 40px;
|
|
|
- top: 20px;
|
|
|
-}
|
|
|
-.operationa_contain .author .author_logo {
|
|
|
- height: 65px;
|
|
|
- width: 65px;
|
|
|
- background: url(/img/supplier-login/oprate/z.png) no-repeat;
|
|
|
- background-size: contain;
|
|
|
-}
|
|
|
-.operationa_contain .author .author_title {
|
|
|
- font-size: 28px;
|
|
|
- color: #FFFFFF;
|
|
|
-}
|
|
|
-.operationa_contain .contain {
|
|
|
- width: 690px;
|
|
|
- height: 400px;
|
|
|
- position: absolute;
|
|
|
- left: 120px;
|
|
|
- top: 133px;
|
|
|
- display: flex;
|
|
|
- justify-content: space-around;
|
|
|
- align-items: center;
|
|
|
- flex-direction: column;
|
|
|
-}
|
|
|
-.operationa_contain .contain .contain_logo {
|
|
|
- width: 100%;
|
|
|
- height: 150px;
|
|
|
- background: url(/img/supplier-login/oprate/title.png) no-repeat;
|
|
|
- background-size: contain;
|
|
|
- background-position: center;
|
|
|
-}
|
|
|
-.operationa_contain .contain .contain_list {
|
|
|
- width: 100%;
|
|
|
- height: 200px;
|
|
|
- display: flex;
|
|
|
- justify-content: center;
|
|
|
- align-items: center;
|
|
|
-}
|
|
|
-.operationa_contain .contain .contain_list .list_item {
|
|
|
- width: 200px;
|
|
|
- height: 100%;
|
|
|
- display: flex;
|
|
|
- flex-direction: column;
|
|
|
- border: 2px solid white;
|
|
|
- justify-content: space-around;
|
|
|
- align-items: center;
|
|
|
- background: #FDF0E9;
|
|
|
- box-shadow: 0px 6px 50px 0px rgba(255,91,0,0.24);
|
|
|
- border-radius: 16px;
|
|
|
- padding: 20px;
|
|
|
- box-sizing: border-box;
|
|
|
-}
|
|
|
-.operationa_contain .contain .contain_list .list_item:nth-child(2){
|
|
|
- margin: 0 1%;
|
|
|
-}
|
|
|
-.operationa_contain .contain .contain_list .list_item:nth-child(1) div:nth-child(1) {
|
|
|
- width: 80px;
|
|
|
- height: 50px;
|
|
|
- background: url(/img/supplier-login/oprate/p.png) no-repeat;
|
|
|
- background-size: contain;
|
|
|
- background-position: center;
|
|
|
-}
|
|
|
-.operationa_contain .contain .contain_list .list_item:nth-child(2) div:nth-child(1) {
|
|
|
- width: 80px;
|
|
|
- height: 50px;
|
|
|
- background: url(/img/supplier-login/oprate/l.png) no-repeat;
|
|
|
- background-size: contain;
|
|
|
- background-position: center;
|
|
|
-}
|
|
|
-.operationa_contain .contain .contain_list .list_item:nth-child(3) div:nth-child(1) {
|
|
|
- width: 80px;
|
|
|
- height: 50px;
|
|
|
- background: url(/img/supplier-login/oprate/s.png) no-repeat;
|
|
|
- background-size: contain;
|
|
|
- background-position: center;
|
|
|
-}
|
|
|
-.operationa_contain .athor_contain {
|
|
|
- width: 690px;
|
|
|
- height: 400px;
|
|
|
- position: absolute;
|
|
|
- left: 120px;
|
|
|
- top: 133px;
|
|
|
- display: flex;
|
|
|
- justify-content: space-around;
|
|
|
- align-items: center;
|
|
|
- flex-direction: column;
|
|
|
-}
|
|
|
-.operationa_contain .athor_contain .athor_contain_logo {
|
|
|
- width: 100%;
|
|
|
- height: 150px;
|
|
|
- background: url(/img/supplier-login/oprate/author/logo.png) no-repeat;
|
|
|
- background-size: contain;
|
|
|
- background-position: center;
|
|
|
-}
|
|
|
-.operationa_contain .athor_contain .athor_contain_list {
|
|
|
- width: 100%;
|
|
|
- height: 200px;
|
|
|
- display: flex;
|
|
|
- justify-content: space-between;
|
|
|
- align-items: center;
|
|
|
- flex-direction: column;
|
|
|
-}
|
|
|
-.athor_contain_list .list_item {
|
|
|
- width: 97%;
|
|
|
- height: 25%;
|
|
|
- border: 1px solid #FFC9A9;
|
|
|
- border-radius: 50px;
|
|
|
- position: relative;
|
|
|
- display: flex;
|
|
|
- justify-content: center;
|
|
|
- align-items: center;
|
|
|
-}
|
|
|
-.athor_contain_list .list_item:nth-child(1) .list_item_logo {
|
|
|
- background: url(/img/supplier-login/oprate/author/02.png) no-repeat;
|
|
|
- background-size: contain;
|
|
|
- background-position: center;
|
|
|
- width: 42px;
|
|
|
- height: 50px;
|
|
|
- position: absolute;
|
|
|
- left: 10px;
|
|
|
- top: 0;
|
|
|
-}
|
|
|
-.athor_contain_list .list_item:nth-child(2) .list_item_logo {
|
|
|
- background: url(/img/supplier-login/oprate/author/03.png) no-repeat;
|
|
|
- background-size: contain;
|
|
|
- background-position: center;
|
|
|
- width: 42px;
|
|
|
- height: 50px;
|
|
|
- position: absolute;
|
|
|
- left: 10px;
|
|
|
- top: 0;
|
|
|
-}
|
|
|
-.athor_contain_list .list_item:nth-child(3) .list_item_logo {
|
|
|
- background: url(/img/supplier-login/oprate/author/04.png) no-repeat;
|
|
|
- background-size: contain;
|
|
|
- background-position: center;
|
|
|
- width: 42px;
|
|
|
- height: 50px;
|
|
|
- position: absolute;
|
|
|
- left: 10px;
|
|
|
- top: 0;
|
|
|
-}
|
|
|
-
|
|
|
-.athor_contain_list .list_item .text_contain{
|
|
|
- width: 80%;
|
|
|
- height: 100%;
|
|
|
- display: flex;
|
|
|
- justify-content: start;
|
|
|
- align-items: center;
|
|
|
- flex-direction: row;
|
|
|
- color: #FFC9A9;
|
|
|
-}
|
|
|
-.athor_contain_list .list_item .text_contain .text_contain_item {
|
|
|
- font-size: 16px;
|
|
|
- font-weight: bold;
|
|
|
-}
|
|
|
-.athor_contain_list .list_item .text_contain .text_contain_item2 {
|
|
|
- width: 1px;
|
|
|
- height: 20px;
|
|
|
- background: #ffe2d3;
|
|
|
- margin: 0 10px;
|
|
|
-}
|
|
|
-.athor_contain_list .list_item .text_contain .text_contain_item3 {
|
|
|
- font-size: 16px;
|
|
|
-}
|
|
|
-#thirdPage {
|
|
|
- background: #fff;
|
|
|
-}
|
|
|
-.pageInner {
|
|
|
- height: 80vh;
|
|
|
- display: flex;
|
|
|
- justify-content: center;
|
|
|
- align-items: center;
|
|
|
- width: 100%;
|
|
|
-}
|
|
|
-.pageInner .container {
|
|
|
- width: 1200px;
|
|
|
- height: 20vw;
|
|
|
- display: flex;
|
|
|
- justify-content: space-between;
|
|
|
- position: relative;
|
|
|
-}
|
|
|
-.pageInner .thirdPage_container_contant {
|
|
|
- position: absolute;
|
|
|
- width: 100%;
|
|
|
- height: 5vw;
|
|
|
- left: 0;
|
|
|
- top: -6vw;
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
- justify-content: space-between;
|
|
|
-}
|
|
|
-.pageInner .thirdPage_container_contant .container_title {
|
|
|
- width: 33%;
|
|
|
- height: 100%;
|
|
|
- border-bottom: 1px solid #FF5B00;
|
|
|
- display: flex;
|
|
|
- justify-content: center;
|
|
|
- align-items: center;
|
|
|
- position: relative;
|
|
|
- font-weight: bold;
|
|
|
- font-size: 1.5vw;
|
|
|
- color: #FF5B00;
|
|
|
- opacity: 0;
|
|
|
-}
|
|
|
-.pageInner .container .container_item {
|
|
|
- height: 100%;
|
|
|
- width: 18%;
|
|
|
- display: flex;
|
|
|
- flex-direction: column;
|
|
|
- justify-content: center;
|
|
|
- align-items: center;
|
|
|
- position: relative;
|
|
|
-}
|
|
|
-.container_item .container_item_active .container_item_hover {
|
|
|
- width: 100%;
|
|
|
- height: 50%;
|
|
|
- display: flex;
|
|
|
- position: absolute;
|
|
|
- flex-direction: column;
|
|
|
- font-size: 0.8vw;
|
|
|
- color: #202020;
|
|
|
- transition: .3s;
|
|
|
- justify-content: space-around;
|
|
|
- align-items: center;
|
|
|
- padding: 1vw 0;
|
|
|
- box-sizing: border-box;
|
|
|
-}
|
|
|
-.container_item .container_item_active .container_item_hover2 {
|
|
|
- width: 100%;
|
|
|
- height: 50%;
|
|
|
- display: flex;
|
|
|
- position: absolute;
|
|
|
- flex-direction: column;
|
|
|
- font-size: 0.8vw;
|
|
|
- color: #202020;
|
|
|
- transition: .3s;
|
|
|
- justify-content: space-around;
|
|
|
- align-items: center;
|
|
|
- padding: 1vw 0;
|
|
|
- box-sizing: border-box;
|
|
|
- bottom: 0;
|
|
|
-}
|
|
|
-.container_item .container_item_active .item_title {
|
|
|
- display: none;
|
|
|
- font-size: 1.5vw;
|
|
|
- color: #FF5B00;
|
|
|
- font-weight: bold;
|
|
|
- width: 80%;
|
|
|
-}
|
|
|
-.container_item .container_item_active .item_contant {
|
|
|
- display: none;
|
|
|
- color: #666666;
|
|
|
- font-size: 18px;
|
|
|
- width: 80%;
|
|
|
-}
|
|
|
-.container_item .container_item_active .item_logo {
|
|
|
- width: 4vw;
|
|
|
- height: 4vw;
|
|
|
-}
|
|
|
-.container_item .container_item_active .item_logo_box {
|
|
|
- width: 80%;
|
|
|
- display: flex;
|
|
|
- justify-content: center;
|
|
|
- align-items: center;
|
|
|
-}
|
|
|
-#item_logo_1 {
|
|
|
- background: url(/img/supplier-login/05-page/信.png) center no-repeat;
|
|
|
- background-size: contain;
|
|
|
-}
|
|
|
-#item_logo_2 {
|
|
|
- background: url(/img/supplier-login/05-page/矩.png) center no-repeat;
|
|
|
- background-size: contain;
|
|
|
-}
|
|
|
-#item_logo_3 {
|
|
|
- background: url(/img/supplier-login/05-page/正.png) center no-repeat;
|
|
|
- background-size: contain;
|
|
|
-}
|
|
|
-#item_logo_4 {
|
|
|
- background: url(/img/supplier-login/05-page/SEO.png) center no-repeat;
|
|
|
- background-size: contain;
|
|
|
-}
|
|
|
-#item_logo_5 {
|
|
|
- background: url(/img/supplier-login/05-page/CRM.png) center no-repeat;
|
|
|
- background-size: contain;
|
|
|
-}
|
|
|
-#item_logo_6 {
|
|
|
- background: url(/img/supplier-login/05-page/认.png) center no-repeat;
|
|
|
- background-size: contain;
|
|
|
-}
|
|
|
-#item_logo_7 {
|
|
|
- background: url(/img/supplier-login/05-page/美.png) center no-repeat;
|
|
|
- background-size: contain;
|
|
|
-}
|
|
|
-#item_logo_8 {
|
|
|
- background: url(/img/supplier-login/05-page/私.png) center no-repeat;
|
|
|
- background-size: contain;
|
|
|
-}
|
|
|
-#item_logo_9 {
|
|
|
- background: url(/img/supplier-login/05-page/分.png) center no-repeat;
|
|
|
- background-size: contain;
|
|
|
-}
|
|
|
-#item_logo_10 {
|
|
|
- background: url(/img/supplier-login/05-page/会.png) center no-repeat;
|
|
|
- background-size: contain;
|
|
|
-}
|
|
|
-#item_logo_11 {
|
|
|
- background: url(/img/supplier-login/05-page/金.png) center no-repeat;
|
|
|
- background-size: contain;
|
|
|
-}
|
|
|
-#item_logo_12 {
|
|
|
- background: url(/img/supplier-login/05-page/交.png) center no-repeat;
|
|
|
- background-size: contain;
|
|
|
-}
|
|
|
-#thirdPage .container_item .container_item_active {
|
|
|
- height: 50%;
|
|
|
- width: 100%;
|
|
|
-}
|
|
|
-#thirdPage .container_item .container_item_active:hover #item_logo_1 {
|
|
|
- background: url(/img/supplier-login/05-page/slide/01.png) center no-repeat;
|
|
|
-}
|
|
|
-#thirdPage .container_item .container_item_active:hover #item_logo_2 {
|
|
|
- background: url(/img/supplier-login/05-page/slide/02.png) center no-repeat;
|
|
|
-}
|
|
|
-#thirdPage .container_item .container_item_active:hover #item_logo_3 {
|
|
|
- background: url(/img/supplier-login/05-page/slide/03.png) center no-repeat;
|
|
|
-}
|
|
|
-#thirdPage .container_item .container_item_active:hover #item_logo_4 {
|
|
|
- background: url(/img/supplier-login/05-page/slide/04.png) center no-repeat;
|
|
|
-}
|
|
|
-#thirdPage .container_item .container_item_active:hover #item_logo_5 {
|
|
|
- background: url(/img/supplier-login/05-page/slide/05.png) center no-repeat;
|
|
|
-}
|
|
|
-#thirdPage .container_item .container_item_active:hover #item_logo_6 {
|
|
|
- background: url(/img/supplier-login/05-page/slide/06.png) center no-repeat;
|
|
|
-}
|
|
|
-#thirdPage .container_item .container_item_active:hover #item_logo_7 {
|
|
|
- background: url(/img/supplier-login/05-page/slide/07.png) center no-repeat;
|
|
|
-}
|
|
|
-#thirdPage .container_item .container_item_active:hover #item_logo_8 {
|
|
|
- background: url(/img/supplier-login/05-page/slide/08.png) center no-repeat;
|
|
|
-}
|
|
|
-#thirdPage .container_item .container_item_active:hover #item_logo_9 {
|
|
|
- background: url(/img/supplier-login/05-page/slide/09.png) center no-repeat;
|
|
|
-}
|
|
|
-#thirdPage .container_item .container_item_active:hover #item_logo_10 {
|
|
|
- background: url(/img/supplier-login/05-page/slide/10.png) center no-repeat;
|
|
|
-}
|
|
|
-#thirdPage .container_item .container_item_active:hover #item_logo_11 {
|
|
|
- background: url(/img/supplier-login/05-page/slide/11.png) center no-repeat;
|
|
|
-}
|
|
|
-#thirdPage .container_item .container_item_active:hover #item_logo_12 {
|
|
|
- background: url(/img/supplier-login/05-page/slide/12.png) center no-repeat;
|
|
|
-}
|
|
|
-#thirdPage .container_item .container_item_active:hover .container_item_hover {
|
|
|
- background: #F7F7F7 !important;
|
|
|
- height: 100%;
|
|
|
- top: 0;
|
|
|
- left: 0;
|
|
|
- z-index: 111;
|
|
|
-}
|
|
|
-#thirdPage .container_item .container_item_active:hover .container_item_hover2 {
|
|
|
- background: #F7F7F7 !important;
|
|
|
- height: 100%;
|
|
|
- left: 0;
|
|
|
- z-index: 111;
|
|
|
-}
|
|
|
-#thirdPage .container_item .container_item_active:hover .item_logo_box {
|
|
|
- justify-content: end;
|
|
|
-}
|
|
|
-#thirdPage .container_item .container_item_active:hover .item_logo {
|
|
|
- width: 5.2vw;
|
|
|
- height: 5.2vw;
|
|
|
-}
|
|
|
-#thirdPage .container_item .container_item_active:hover .item_title {
|
|
|
- display: block !important;
|
|
|
-}
|
|
|
-#thirdPage .container_item .container_item_active:hover .item_title_p {
|
|
|
- display: none !important;
|
|
|
-}
|
|
|
-#thirdPage .container_item .container_item_active:hover .item_contant {
|
|
|
- display: block !important;
|
|
|
-}
|
|
|
-#thirdPage .container_item .container_item_active:hover .container_title:nth-child(1){
|
|
|
- display: flex !important;
|
|
|
-}
|
|
|
-#fourPage .pageInner_contain {
|
|
|
- width: 80%;
|
|
|
- height: 30vw;
|
|
|
- display: flex;
|
|
|
- justify-content: space-between;
|
|
|
- align-items: center;
|
|
|
-}
|
|
|
-#fourPage .pageInner_contain .nextChange {
|
|
|
- width: 40px;
|
|
|
- height: 48px;
|
|
|
- border: 1px solid #E2E2E2;
|
|
|
- border-radius: 2px;
|
|
|
- display: flex;
|
|
|
- justify-content: center;
|
|
|
- align-items: center;
|
|
|
- color: #E2E2E2;
|
|
|
- cursor: pointer;
|
|
|
-}
|
|
|
-#fourPage .pageInner_contain .isActiveNext{
|
|
|
- border: 1px solid #FF5B00;
|
|
|
- color: #FF5B00;
|
|
|
-}
|
|
|
-#fourPage .el-carousel--horizontal {
|
|
|
- width: 90%;
|
|
|
-}
|
|
|
-#fourPage .el-carousel__arrow{
|
|
|
- display: none;
|
|
|
-}
|
|
|
-#fourPage .el-carousel__item {
|
|
|
- display: flex;
|
|
|
- justify-content: space-around;
|
|
|
- align-items: center;
|
|
|
- box-sizing: border-box;
|
|
|
-}
|
|
|
-#fourPage .el-carousel__item .four_logo_1 {
|
|
|
- width: 50%;
|
|
|
- height: 80%;
|
|
|
-}
|
|
|
-#fourPage .el-carousel__item .logo_text {
|
|
|
- width: 45%;
|
|
|
- height: 80%;
|
|
|
- display: flex;
|
|
|
- flex-direction: column;
|
|
|
- justify-content: start;
|
|
|
- overflow: hidden;
|
|
|
-}
|
|
|
-#fourPage .el-carousel__item .logo_text .logo_title {
|
|
|
- font-size: 1.25vw;
|
|
|
- color: black;
|
|
|
- font-weight: bold;
|
|
|
- margin-bottom: 2vw;
|
|
|
-}
|
|
|
-#fourPage .el-carousel__item .logo_text .analysis {
|
|
|
- font-size: 0.8vw;
|
|
|
- line-height: 2vw;
|
|
|
-}
|
|
|
-#fivePage {
|
|
|
- background: url(/img/supplier-login/07-caimei/bg.png) no-repeat;
|
|
|
- background-size: 100% 100%;
|
|
|
-}
|
|
|
-#fivePage .inner_contain {
|
|
|
- width: 100%;
|
|
|
- height: 67vh;
|
|
|
- margin-top: 7vh;
|
|
|
- display: flex;
|
|
|
- justify-content: center;
|
|
|
- align-items: center;
|
|
|
-}
|
|
|
-#fivePage .inner_contain .inner {
|
|
|
- width: 64%;
|
|
|
- height: 100%;
|
|
|
- display: flex;
|
|
|
- justify-content: space-between;
|
|
|
- align-items: center;
|
|
|
- flex-direction: column;
|
|
|
-}
|
|
|
-#fivePage .inner_contain .inner .caimei_introduction {
|
|
|
- color: white;
|
|
|
- font-size: 18px;
|
|
|
- width: 1200px;
|
|
|
- height: auto;
|
|
|
- padding: 3vh;
|
|
|
- background-color: rgba(255,255,255, 0.2);
|
|
|
- box-sizing: border-box;
|
|
|
- line-height: 40px;
|
|
|
-}
|
|
|
-#fivePage .inner_contain .inner .caimei_report {
|
|
|
- width: 90%;
|
|
|
- height: 55%;
|
|
|
- display: flex;
|
|
|
- justify-content: space-around;
|
|
|
- align-items: center;
|
|
|
-}
|
|
|
-.caimei_report .report_item {
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
- justify-content: space-between;
|
|
|
- flex-direction: column;
|
|
|
- height: 100%;
|
|
|
- width: 20%;
|
|
|
-}
|
|
|
-.caimei_report .report_item .report_logo {
|
|
|
- display: flex;
|
|
|
- justify-content: center;
|
|
|
- align-items: center;
|
|
|
- font-size: 1.6vw;
|
|
|
- width: 12vw;
|
|
|
- height: 9vw;
|
|
|
- background: url(/img/supplier-login/07-caimei/cirle.png) no-repeat center;
|
|
|
- background-size: contain;
|
|
|
- font-weight: bold;
|
|
|
- color: white;
|
|
|
-}
|
|
|
-.caimei_report .report_item .report_title {
|
|
|
- font-size: 0.8vw;
|
|
|
- color: #fff;
|
|
|
-}
|
|
|
-.caimei_report .report_item .report_line{
|
|
|
- display: flex;
|
|
|
- flex-direction: column;
|
|
|
- justify-content: end;
|
|
|
- align-items: center;
|
|
|
-}
|
|
|
-.caimei_report .report_item .report_line .box1 {
|
|
|
- padding: 0.52vw 1px;
|
|
|
- height: 5.2vw;
|
|
|
-}
|
|
|
-.caimei_report .report_item .report_line .card4 {
|
|
|
- background-image: linear-gradient(#fff 35%, rgba(255,255,255,0) 0%);
|
|
|
- background-position: left;
|
|
|
- background-size: 1px 10px;
|
|
|
- background-repeat: repeat-y;
|
|
|
-}
|
|
|
-.caimei_report .report_item .report_line .container {
|
|
|
- position: relative;
|
|
|
- display: flex;
|
|
|
- justify-content: center;
|
|
|
- align-items: center;
|
|
|
- flex-direction: row;
|
|
|
-}
|
|
|
-.caimei_report .report_item .report_line .container .box {
|
|
|
- width: 20px;
|
|
|
- height: 20px;
|
|
|
- display: flex;
|
|
|
- justify-content: center;
|
|
|
- align-items: center;
|
|
|
-}
|
|
|
-.caimei_report .report_item .report_line .container .box span {
|
|
|
- position: absolute;
|
|
|
- box-sizing: border-box;
|
|
|
- border: none;
|
|
|
- background: #FFFFFF;
|
|
|
- border-radius: 50%;
|
|
|
- animation: animate 1s linear infinite;
|
|
|
- animation-delay: calc(0.5s * var(--i))
|
|
|
-}
|
|
|
-
|
|
|
-#sixPage .community {
|
|
|
- width: 1200px;
|
|
|
- height: 70vh;
|
|
|
- display: flex;
|
|
|
- justify-content: space-between;
|
|
|
- align-items: center;
|
|
|
- margin-top: 2vw;
|
|
|
- flex-direction: column;
|
|
|
-}
|
|
|
-.community .community_video{
|
|
|
- width: 100%;
|
|
|
- height: 45%;
|
|
|
- font-size: 1vw;
|
|
|
- display: flex;
|
|
|
- justify-content: space-between;
|
|
|
- flex-direction: column;
|
|
|
-}
|
|
|
-.community .community_article {
|
|
|
- width: 100%;
|
|
|
- height: 45%;
|
|
|
- font-size: 1vw;
|
|
|
- display: flex;
|
|
|
- justify-content: space-between;
|
|
|
- flex-direction: column;
|
|
|
-}
|
|
|
-.community_title {
|
|
|
- padding: 1% 0;
|
|
|
- font-size: 1vw;
|
|
|
-}
|
|
|
-.community .community_list {
|
|
|
- width: 100%;
|
|
|
- display: flex;
|
|
|
- /*justify-content: space-between;*/
|
|
|
- align-items: center;
|
|
|
- height: 90%;
|
|
|
-}
|
|
|
-.community_list .video_list_item {
|
|
|
- width: 24%;
|
|
|
- height: 100%;
|
|
|
- box-sizing: border-box;
|
|
|
- padding-top: 5px;
|
|
|
- display: flex;
|
|
|
- flex-direction: column;
|
|
|
- justify-content: space-between;
|
|
|
- align-items: center;
|
|
|
- transition: .2s;
|
|
|
- cursor: pointer;
|
|
|
-}
|
|
|
-.community_list .article_list_item {
|
|
|
- width: 24%;
|
|
|
- height: 100%;
|
|
|
- box-sizing: border-box;
|
|
|
- padding-top: 5px;
|
|
|
- display: flex;
|
|
|
- flex-direction: column;
|
|
|
- justify-content: space-between;
|
|
|
- align-items: center;
|
|
|
- transition: .2s;
|
|
|
- cursor: pointer;
|
|
|
-}
|
|
|
-.article_list_item .article_list_item_content {
|
|
|
- height: 100%;
|
|
|
- width: 100%;
|
|
|
- border: 1px solid #EAEAEA;
|
|
|
- box-sizing: border-box;
|
|
|
- color: #202020;
|
|
|
-}
|
|
|
-.video_list_item .video_list_item_content {
|
|
|
- height: 100%;
|
|
|
- width: 100%;
|
|
|
- border: 1px solid #EAEAEA;
|
|
|
- box-sizing: border-box;
|
|
|
- color: #202020;
|
|
|
- position: relative;
|
|
|
-}
|
|
|
-.video_list_item .video_list_item_content .player_bg {
|
|
|
- position: absolute;
|
|
|
- width: 100%;
|
|
|
- height: 60%;
|
|
|
- box-sizing: border-box;
|
|
|
- left: 0;
|
|
|
- top: 0;
|
|
|
- background: rgba(24, 23, 23, 0.4);
|
|
|
- display: none;
|
|
|
- justify-content: center;
|
|
|
- align-items: center;
|
|
|
- transition: .2s;
|
|
|
- z-index: 11;
|
|
|
-}
|
|
|
-.video_list_item_content .video_player {
|
|
|
- width: 100%;
|
|
|
- height: 60%;
|
|
|
- box-sizing: border-box;
|
|
|
- overflow: hidden;
|
|
|
-}
|
|
|
-.article_list_item_content .article_bg {
|
|
|
- width: 100%;
|
|
|
- height: 60%;
|
|
|
- box-sizing: border-box;
|
|
|
- overflow: hidden;
|
|
|
-}
|
|
|
-.video_list_item_content .video_title {
|
|
|
- width: 100%;
|
|
|
- height: 40%;
|
|
|
- box-sizing: border-box;
|
|
|
- font-size: 14px;
|
|
|
- display: flex;
|
|
|
- justify-content: center;
|
|
|
- align-items: center;
|
|
|
- line-height: 22px;
|
|
|
- padding: 20px
|
|
|
-}
|
|
|
-.article_list_item_content .article_text {
|
|
|
- width: 100%;
|
|
|
- height: 40%;
|
|
|
- box-sizing: border-box;
|
|
|
- display: flex;
|
|
|
- justify-content: space-around;
|
|
|
- align-items: center;
|
|
|
- flex-direction: column;
|
|
|
- font-size: 0.7vw;
|
|
|
- color: #808080;
|
|
|
-}
|
|
|
-.article_list_item_content .text_title {
|
|
|
- color: #202020;
|
|
|
- font-size: 1vw;
|
|
|
- width: 100%;
|
|
|
- box-sizing: border-box;
|
|
|
- border-left: 3px solid #FF5B00;
|
|
|
- padding: 0 4%;
|
|
|
-}
|
|
|
-.video_list_item:nth-child(1):hover {
|
|
|
- padding: 0 0 5px 0;
|
|
|
-}
|
|
|
-.video_list_item:nth-child(1):hover .video_list_item_content {
|
|
|
- box-shadow: 0px 6px 35px 0px rgba(255,157,102,0.12);
|
|
|
- color: #FF5B00;
|
|
|
-}
|
|
|
-.video_list_item:nth-child(1):hover .player_bg {
|
|
|
- display: flex;
|
|
|
-}
|
|
|
-.video_list_item:nth-child(2):hover .player_bg {
|
|
|
- display: flex;
|
|
|
-}
|
|
|
-.video_list_item:nth-child(3):hover .player_bg {
|
|
|
- top: 0;
|
|
|
- display: flex;
|
|
|
-}
|
|
|
-.video_list_item:nth-child(4):hover .player_bg {
|
|
|
- top: 0;
|
|
|
- display: flex;
|
|
|
-}
|
|
|
-.video_list_item:nth-child(2):hover {
|
|
|
- padding: 0 0 5px 0;
|
|
|
-}
|
|
|
-.video_list_item:nth-child(2):hover .video_list_item_content {
|
|
|
- box-shadow: 0px 6px 35px 0px rgba(255,157,102,0.12);
|
|
|
- color: #FF5B00 !important;
|
|
|
-}
|
|
|
-.video_list_item:nth-child(3):hover {
|
|
|
- padding: 0 0 5px 0;
|
|
|
-}
|
|
|
-.video_list_item:nth-child(3):hover .video_list_item_content {
|
|
|
- box-shadow: 0px 6px 20px 0px rgba(255,157,102,0.12);
|
|
|
- color: #FF5B00 !important;
|
|
|
-}
|
|
|
-.video_list_item:nth-child(4):hover {
|
|
|
- padding: 0 0 5px 0;
|
|
|
-}
|
|
|
-.video_list_item:nth-child(4):hover .video_list_item_content{
|
|
|
- box-shadow: 0px 6px 20px 0px rgba(255,157,102,0.12);
|
|
|
- color: #FF5B00;
|
|
|
-}
|
|
|
-.article_list_item:nth-child(1):hover {
|
|
|
- padding: 0 0 5px 0;
|
|
|
-}
|
|
|
-.article_list_item:nth-child(1):hover .article_list_item_content {
|
|
|
- box-shadow: 0px 6px 20px 0px rgba(255,157,102,0.12);
|
|
|
- color: #FF5B00 !important;
|
|
|
-}
|
|
|
-.article_list_item:nth-child(2):hover .article_list_item_content {
|
|
|
- box-shadow: 0px 6px 20px 0px rgba(255,157,102,0.12);
|
|
|
- color: #FF5B00 !important;
|
|
|
-}
|
|
|
-.article_list_item:nth-child(3):hover .article_list_item_content {
|
|
|
- box-shadow: 0px 6px 20px 0px rgba(255,157,102,0.12);
|
|
|
- color: #FF5B00 !important;
|
|
|
-}
|
|
|
-.article_list_item:nth-child(4):hover .article_list_item_content {
|
|
|
- box-shadow: 0px 6px 20px 0px rgba(255,157,102,0.12);
|
|
|
- color: #FF5B00 !important;
|
|
|
-}
|
|
|
-.article_list_item:nth-child(2):hover {
|
|
|
- padding: 0 0 5px 0;
|
|
|
-}
|
|
|
-.article_list_item:nth-child(3):hover {
|
|
|
- padding: 0 0 5px 0;
|
|
|
-}
|
|
|
-.article_list_item:nth-child(4):hover {
|
|
|
- padding: 0 0 5px 0;
|
|
|
-}
|
|
|
-.article_list_item:nth-child(1):hover .text_title,
|
|
|
-.article_list_item:nth-child(2):hover .text_title,
|
|
|
-.article_list_item:nth-child(3):hover .text_title,
|
|
|
-.article_list_item:nth-child(4):hover .text_title {
|
|
|
- color: #FF5B00 !important;
|
|
|
-}
|
|
|
-@keyframes animate {
|
|
|
- 0% {
|
|
|
- width: 0;
|
|
|
- height: 0;
|
|
|
- }
|
|
|
-
|
|
|
- 50% {
|
|
|
- opacity: 1;
|
|
|
- }
|
|
|
-
|
|
|
- 100% {
|
|
|
- width: 50px;
|
|
|
- height: 50px;
|
|
|
- opacity: 0;
|
|
|
- }
|
|
|
-}
|
|
|
-.cm_video_player {
|
|
|
- position: fixed;
|
|
|
- left: 0;
|
|
|
- top: 0;
|
|
|
- width: 100vw;
|
|
|
- height: 100vh;
|
|
|
- background: rgba(24, 23, 23, 0.5);
|
|
|
- display: none;
|
|
|
- z-index: 999;
|
|
|
- justify-content: center;
|
|
|
- align-items: center;
|
|
|
-}
|
|
|
+html {
|
|
|
+ scroll-behavior: smooth;
|
|
|
+ scroll-padding-top: 7vh;
|
|
|
+}
|
|
|
+body{
|
|
|
+ width: 100vw;
|
|
|
+ height: 100vh;
|
|
|
+}
|
|
|
+#scrollTop {
|
|
|
+ display: none !important;
|
|
|
+}
|
|
|
+[v-cloak] {
|
|
|
+ opacity: 0;
|
|
|
+}
|
|
|
+.text_info {
|
|
|
+ width: 100vw;
|
|
|
+ height: 100%;
|
|
|
+ box-sizing: border-box;
|
|
|
+ overflow-y: scroll;
|
|
|
+}
|
|
|
+.text_info .text_info_contain {
|
|
|
+ height: auto;
|
|
|
+ padding: 10vh 24vw;
|
|
|
+ box-sizing: border-box;
|
|
|
+ width: 100%;
|
|
|
+ background: #fff;
|
|
|
+}
|
|
|
+.text_info .text_info_contain p {
|
|
|
+ font-size: 16px;
|
|
|
+ line-height: 30px;
|
|
|
+ color: #777;
|
|
|
+}
|
|
|
+.username {
|
|
|
+ color: #FF5B00;
|
|
|
+ position: relative;
|
|
|
+ cursor: pointer;
|
|
|
+ box-sizing: border-box;
|
|
|
+ height: 20px;
|
|
|
+ display: flex;
|
|
|
+ justify-content: center;
|
|
|
+ align-items: center;
|
|
|
+}
|
|
|
+.username::after {
|
|
|
+ content: '\276F';
|
|
|
+ font-weight: normal;
|
|
|
+ position: absolute;
|
|
|
+ right: -14px;
|
|
|
+ top: 0;
|
|
|
+ transform: rotate(90deg);
|
|
|
+ transition: .3s;
|
|
|
+}
|
|
|
+.username:hover {
|
|
|
+ border-bottom: 1px solid;
|
|
|
+}
|
|
|
+.username:hover::after{
|
|
|
+ transform: rotate(270deg);
|
|
|
+}
|
|
|
+.username .el-popover__reference-wrapper .el-button--text {
|
|
|
+ color: #FF5B00;
|
|
|
+}
|
|
|
+.el-popover {
|
|
|
+ padding: 5px !important;
|
|
|
+ min-width: 90px !important;
|
|
|
+}
|
|
|
+.el-popover .cShow {
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+ justify-content: space-around;
|
|
|
+ align-items: center;
|
|
|
+}
|
|
|
+.el-popover__reference{
|
|
|
+ font-size: 0.8vw;
|
|
|
+}
|
|
|
+.a_cm {
|
|
|
+ padding: 10px;
|
|
|
+}
|
|
|
+.login_a:hover {
|
|
|
+ color: white;
|
|
|
+}
|
|
|
+.slide_icon {
|
|
|
+ display: flex;
|
|
|
+ justify-content: center;
|
|
|
+ align-items: center;
|
|
|
+ flex-direction: column;
|
|
|
+ position: fixed;
|
|
|
+ right: 1vw;
|
|
|
+ bottom: 140px;
|
|
|
+ background: #FF5B00;
|
|
|
+ border-radius: 4px;
|
|
|
+ padding: 4px;
|
|
|
+ height: auto;
|
|
|
+ z-index: 999;
|
|
|
+}
|
|
|
+.slide_icon .slide_icon_item {
|
|
|
+ width: 100%;
|
|
|
+ height: 65px;
|
|
|
+ display: flex;
|
|
|
+ justify-content: center;
|
|
|
+ align-items: end;
|
|
|
+ color: #FFFFFF;
|
|
|
+ font-size: 14px;
|
|
|
+ cursor: pointer;
|
|
|
+ padding: 0.4vw 0;
|
|
|
+ box-sizing: border-box;
|
|
|
+}
|
|
|
+.slide_icon_item:nth-child(1){
|
|
|
+ background: url(/img/supplier-login/float/d.png) center no-repeat;
|
|
|
+ background-position: top;
|
|
|
+}
|
|
|
+.slide_icon_item:nth-child(3){
|
|
|
+ background: url(/img/supplier-login/float/z.png) center no-repeat;
|
|
|
+}
|
|
|
+.slide_icon_item:nth-child(2){
|
|
|
+ border-top: 1px solid rgb(255,255,255, 0.3);
|
|
|
+ border-bottom: 1px solid rgb(255,255,255, 0.3);
|
|
|
+ background: url(/img/supplier-login/float/w.png) center no-repeat;
|
|
|
+ background-position: top;
|
|
|
+}
|
|
|
+.tooltip {
|
|
|
+ background: #FFFFFF;
|
|
|
+ box-shadow: 0px 4px 16px 0px rgba(51,51,51,0.12);
|
|
|
+ border-radius: 4px;
|
|
|
+ z-index: 999;
|
|
|
+ position: fixed;
|
|
|
+ transition: .3s;
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-around;
|
|
|
+ flex-direction: column;
|
|
|
+ right: 90px;
|
|
|
+}
|
|
|
+
|
|
|
+.slide_icon .slide_icon_item .tooltip_1{
|
|
|
+ width: 170px;
|
|
|
+ height: 64px;
|
|
|
+ padding: 10px;
|
|
|
+ text-align: center;
|
|
|
+ display: none;
|
|
|
+ opacity: 0;
|
|
|
+}
|
|
|
+.slide_icon .slide_icon_item .tooltip_1 .day {
|
|
|
+ color: #666666;
|
|
|
+ font-size: 16px;
|
|
|
+}
|
|
|
+.slide_icon .slide_icon_item .tooltip_1 .phone_number {
|
|
|
+ color: #FF5B00;
|
|
|
+ font-size: 20px;
|
|
|
+}
|
|
|
+.slide_icon .slide_icon_item .tooltip_1::after {
|
|
|
+ content: '';
|
|
|
+ height: 0;
|
|
|
+ width: 0;
|
|
|
+ border: 10px solid transparent;
|
|
|
+ border-left: 15px solid white;
|
|
|
+ display: block;
|
|
|
+ position: absolute;
|
|
|
+ right: -20px;
|
|
|
+ bottom: 0;
|
|
|
+}
|
|
|
+.slide_icon .slide_icon_item .tooltip_2::after {
|
|
|
+ content: '';
|
|
|
+ height: 0;
|
|
|
+ width: 0;
|
|
|
+ border: 10px solid transparent;
|
|
|
+ border-left: 15px solid white;
|
|
|
+ display: block;
|
|
|
+ position: absolute;
|
|
|
+ right: -20px;
|
|
|
+ top: 0;
|
|
|
+}
|
|
|
+.slide_icon .slide_icon_item .tooltip_2{
|
|
|
+ width: 150px;
|
|
|
+ height: 150px;
|
|
|
+ display: none;
|
|
|
+ opacity: 0;
|
|
|
+}
|
|
|
+.slide_icon .slide_icon_phone:hover .tooltip_1 {
|
|
|
+ opacity: 1;
|
|
|
+ display: flex;
|
|
|
+}
|
|
|
+.slide_icon .slide_icon_qrcode:hover .tooltip_2 {
|
|
|
+ opacity: 1;
|
|
|
+ display: flex;
|
|
|
+}
|
|
|
+.slide_icon_item .slide_icon_phone .slide_icon_text {
|
|
|
+ color:#666666;
|
|
|
+}
|
|
|
+.slide_icon .slide_icon_item .slide_icon_phone .slid_phonenumber {
|
|
|
+ font-size: 1vw;
|
|
|
+ color: #FF5B00;
|
|
|
+}
|
|
|
+.login_header{
|
|
|
+ width: 100vw;
|
|
|
+ display: flex;
|
|
|
+ justify-content: center;
|
|
|
+ height: 7vh;
|
|
|
+ position: fixed;
|
|
|
+ top: 0;
|
|
|
+ left: 0;
|
|
|
+ background: #fff;
|
|
|
+ z-index: 999;
|
|
|
+}
|
|
|
+.login_header_container{
|
|
|
+ width: 95vw;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: space-between;
|
|
|
+}
|
|
|
+.img_logo {
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ cursor: pointer;
|
|
|
+}
|
|
|
+.img_logo .logo {
|
|
|
+ width: 5.5vw;
|
|
|
+ height: 4vh;
|
|
|
+ background: url("/img/supplier-login/logo.png") no-repeat;
|
|
|
+ background-size: 100% 100%;
|
|
|
+}
|
|
|
+.text {
|
|
|
+ font-size: 1.2vw;
|
|
|
+ font-weight: 400;
|
|
|
+ color: #272727;
|
|
|
+}
|
|
|
+.header_link{
|
|
|
+ align-items: center;
|
|
|
+ position: relative;
|
|
|
+ height: 100%;
|
|
|
+ display: flex;
|
|
|
+ overflow: hidden;
|
|
|
+}
|
|
|
+.header_link .nav_link {
|
|
|
+ position: absolute;
|
|
|
+ left: 36vw;
|
|
|
+ top: 0;
|
|
|
+ display: flex;
|
|
|
+ justify-content: center;
|
|
|
+ align-items: end;
|
|
|
+ width: 6vw;
|
|
|
+ height: 100%;
|
|
|
+ transition: .3s;
|
|
|
+}
|
|
|
+.header_link .nav_link .nav_link_item{
|
|
|
+ width: 1.2vw;
|
|
|
+ height: 0.2vh;
|
|
|
+ background: #FF5B00;
|
|
|
+ border-radius: 8px;
|
|
|
+ margin-bottom: 1vh;
|
|
|
+}
|
|
|
+.header_link .header_link_itme {
|
|
|
+ cursor: pointer;
|
|
|
+ font-size: 0.84vw;
|
|
|
+ width: 6vw;
|
|
|
+ height: 100%;
|
|
|
+ display: flex;
|
|
|
+ justify-content: center;
|
|
|
+ align-items: center;
|
|
|
+ z-index: 1;
|
|
|
+}
|
|
|
+.header_link .header_link_itme:hover{
|
|
|
+ color: #FF5B00;
|
|
|
+ transform: scale(1.1);
|
|
|
+}
|
|
|
+.header_link_itme:nth-child(1):hover ~ .nav_link {
|
|
|
+ left: 0vw !important;
|
|
|
+}
|
|
|
+.header_link_itme:nth-child(2):hover ~ .nav_link {
|
|
|
+ left: 6vw !important;
|
|
|
+}
|
|
|
+.header_link_itme:nth-child(3):hover ~ .nav_link {
|
|
|
+ left: 12vw !important;
|
|
|
+}
|
|
|
+.header_link_itme:nth-child(4):hover ~ .nav_link {
|
|
|
+ left: 18vw !important;
|
|
|
+}
|
|
|
+.header_link_itme:nth-child(5):hover ~ .nav_link {
|
|
|
+ left: 24vw !important;
|
|
|
+}
|
|
|
+.header_link_itme:nth-child(6):hover ~ .nav_link {
|
|
|
+ left: 30vw !important;
|
|
|
+}
|
|
|
+.header_link_itme:nth-child(7):hover ~ .nav_link {
|
|
|
+ left: 36vw !important;
|
|
|
+}
|
|
|
+.header_link_itme:nth-child(8):hover ~ .nav_link {
|
|
|
+ left: 49vw !important;
|
|
|
+}
|
|
|
+.isActiveLink {
|
|
|
+ color: #FF5B00;
|
|
|
+ transform: scale(1.1);
|
|
|
+}
|
|
|
+.login_header_container .iphone {
|
|
|
+ width: 12vw;
|
|
|
+ height: 100%;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: center;
|
|
|
+ margin-right: 5%;
|
|
|
+}
|
|
|
+.login_header_container .iphone div:nth-child(1){
|
|
|
+ width: 36px;
|
|
|
+ height: 36px;
|
|
|
+ background: url("/img/supplier-login/iPhone.png") no-repeat;
|
|
|
+ background-size: contain;
|
|
|
+ background-position: center;
|
|
|
+}
|
|
|
+.login_header_container .iphone div:nth-child(2) {
|
|
|
+ color: #FF5B00;
|
|
|
+ font-size: 1vw;
|
|
|
+ margin-left: 5px;
|
|
|
+ font-weight: bold;
|
|
|
+ white-space: nowrap;
|
|
|
+}
|
|
|
+.login_header_container .login_regist {
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-between;
|
|
|
+ align-items: center;
|
|
|
+ width: 8vw;
|
|
|
+ height: 100%;
|
|
|
+}
|
|
|
+.login_header_container .login_regist .login_btn{
|
|
|
+ width: 40%;
|
|
|
+ font-size: 0.7vw;
|
|
|
+ border: 1px solid #ccc;
|
|
|
+ text-align: center;
|
|
|
+ padding: 0.2vw;
|
|
|
+}
|
|
|
+#login_content {
|
|
|
+ position: relative;
|
|
|
+ width: 100vw;
|
|
|
+}
|
|
|
+#fullpage {
|
|
|
+ width: 100vw;
|
|
|
+ position: absolute;
|
|
|
+ left: 0;
|
|
|
+ top: 0;
|
|
|
+ height: 800vh;
|
|
|
+ scroll-behavior: smooth;
|
|
|
+ transition: all 0.8s ease;
|
|
|
+}
|
|
|
+#fullpage .page {
|
|
|
+ width: 100vw;
|
|
|
+ height: 100vh;
|
|
|
+ scroll-snap-align: start;
|
|
|
+ box-sizing: border-box;
|
|
|
+ overflow: hidden;
|
|
|
+}
|
|
|
+#fullpage #zeroPage {
|
|
|
+ height: auto;
|
|
|
+ padding-top: 7vh;
|
|
|
+}
|
|
|
+#zeroPage .el-carousel__container {
|
|
|
+ height: 510px;
|
|
|
+}
|
|
|
+.el-carousel__item:nth-child(1) {
|
|
|
+ display: flex;
|
|
|
+ justify-content: center;
|
|
|
+ align-items: center;
|
|
|
+}
|
|
|
+#zeroPage .banner01 {
|
|
|
+ background: url("/img/supplier-login/01-banner/banner-01.png") no-repeat;
|
|
|
+ background-size: 100% 100%;
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+ display: flex;
|
|
|
+ justify-content: center;
|
|
|
+ align-items: center;
|
|
|
+}
|
|
|
+#zeroPage .banner01 .left {
|
|
|
+ height: 155px;
|
|
|
+ width: 640px;
|
|
|
+ background: url(/img/supplier-login/01-banner/banner-02-left.png) no-repeat;
|
|
|
+ background-size: contain;
|
|
|
+ background-position: right;
|
|
|
+}
|
|
|
+#zeroPage .banner01 .right {
|
|
|
+ height: 377px;
|
|
|
+ width: 459px;
|
|
|
+ background: url(/img/supplier-login/01-banner/banner-01-right.png) no-repeat;
|
|
|
+ background-size: contain;
|
|
|
+}
|
|
|
+#zeroPage .banner02 {
|
|
|
+ background: url("/img/supplier-login/banner-2/banner-02.png") no-repeat;
|
|
|
+ background-size: cover;
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+ display: flex;
|
|
|
+ justify-content: center;
|
|
|
+ align-items: center;
|
|
|
+ background-position: center;
|
|
|
+}
|
|
|
+#zeroPage .banner02 .left {
|
|
|
+ height: 45%;
|
|
|
+ width: 50%;
|
|
|
+ background: url(/img/supplier-login/banner-2/banner-02-left.png) no-repeat;
|
|
|
+ background-size: contain;
|
|
|
+ background-position: right;
|
|
|
+}
|
|
|
+#zeroPage .banner02 .right {
|
|
|
+ height: 70%;
|
|
|
+ width: 40%;
|
|
|
+ background: url(/img/supplier-login/banner-2/banner-02-right.png) no-repeat;
|
|
|
+ background-size: contain;
|
|
|
+}
|
|
|
+.el-carousel__item:nth-child(2) {
|
|
|
+ display: flex;
|
|
|
+ justify-content: center;
|
|
|
+ align-items: center;
|
|
|
+ background: url("/img/supplier-login/01-banner/banner-01.png");
|
|
|
+}
|
|
|
+.el-carousel__indicator--horizontal .el-carousel__button {
|
|
|
+ width: 6px;
|
|
|
+ height: 6px;
|
|
|
+ border-radius: 50%;
|
|
|
+ background-color: #ccc;
|
|
|
+ opacity: 1;
|
|
|
+}
|
|
|
+.el-carousel__indicator--horizontal.is-active .el-carousel__button{
|
|
|
+ width: 6px;
|
|
|
+ height: 6px;
|
|
|
+ background: #FF5B00;
|
|
|
+ border-radius: 50%;
|
|
|
+ opacity: 1;
|
|
|
+}
|
|
|
+#zeroPage {
|
|
|
+ background-color: #fff;
|
|
|
+}
|
|
|
+#zeroPage .server {
|
|
|
+ display: flex;
|
|
|
+ justify-content: center;
|
|
|
+ align-items: center;
|
|
|
+ width: 100vw;
|
|
|
+ height: 600px;
|
|
|
+ box-sizing: border-box;
|
|
|
+}
|
|
|
+.server .server_1,
|
|
|
+.server .server_2,
|
|
|
+.server .server_3 {
|
|
|
+ height: 460px;
|
|
|
+ width: 390px;
|
|
|
+ position: relative;
|
|
|
+}
|
|
|
+#zeroPage .server .box {
|
|
|
+ position: absolute;
|
|
|
+ height: 100%;
|
|
|
+ width: 100%;
|
|
|
+ -webkit-backface-visibility: hidden;
|
|
|
+ backface-visibility: hidden;
|
|
|
+ -webkit-transform-style: preserve-3d;
|
|
|
+ transform-style: preserve-3d;
|
|
|
+ -webkit-transition: ease-in-out 600ms;
|
|
|
+ -o-transition: ease-in-out 600ms;
|
|
|
+ transition: .5s;
|
|
|
+}
|
|
|
+#zeroPage .server .tourist_bg,
|
|
|
+#zeroPage .server .sale_bg,
|
|
|
+#zeroPage .server .operate_bg {
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+ justify-content: space-around;
|
|
|
+ align-items: center;
|
|
|
+ font-size: 18px;
|
|
|
+ padding: 60px;
|
|
|
+ box-sizing: border-box;
|
|
|
+}
|
|
|
+#zeroPage .server .operate,
|
|
|
+#zeroPage .server .tourist,
|
|
|
+#zeroPage .server .sale {
|
|
|
+ width: 400px;
|
|
|
+ height: 100%;
|
|
|
+ transition: .5s;
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+ justify-content: space-around;
|
|
|
+ align-items: center;
|
|
|
+ font-size: 18px;
|
|
|
+ padding: 30px;
|
|
|
+ box-sizing: border-box;
|
|
|
+ background: linear-gradient(0deg, #FF5B00, #FF9300);
|
|
|
+ -webkit-transform: rotateY(-180deg);
|
|
|
+ transform: rotateY(-180deg);
|
|
|
+ color: #fff;
|
|
|
+ white-space: nowrap;
|
|
|
+}
|
|
|
+#zeroPage .server .tourist_logo {
|
|
|
+ width: 100px;
|
|
|
+ height: 100px;
|
|
|
+ background: url("/img/supplier-login/cycle/-11.png") no-repeat;
|
|
|
+ background-size: cover;
|
|
|
+}
|
|
|
+#zeroPage .server .tourist_bg_logo {
|
|
|
+ background: url("/img/supplier-login/cycle/1.png") no-repeat;
|
|
|
+ width: 160px;
|
|
|
+ height: 160px;
|
|
|
+ background-size: cover;
|
|
|
+}
|
|
|
+#zeroPage .server .tourist_bg_title {
|
|
|
+ color: black;
|
|
|
+}
|
|
|
+#zeroPage .server .tourist_title {
|
|
|
+ color: #fff;
|
|
|
+}
|
|
|
+#zeroPage .server .server_1:hover .tourist_bg{
|
|
|
+ -webkit-transform: rotateY(180deg) !important;
|
|
|
+ transform: rotateY(180deg) !important;
|
|
|
+}
|
|
|
+#zeroPage .server .server_1:hover .tourist {
|
|
|
+ -webkit-transform: rotateY(0deg) !important;
|
|
|
+ transform: rotateY(0deg) !important;
|
|
|
+}
|
|
|
+#zeroPage .server .server_2:hover .operate_bg{
|
|
|
+ -webkit-transform: rotateY(180deg) !important;
|
|
|
+ transform: rotateY(180deg) !important;
|
|
|
+}
|
|
|
+#zeroPage .server .server_2:hover .operate {
|
|
|
+ -webkit-transform: rotateY(0deg) !important;
|
|
|
+ transform: rotateY(0deg) !important;
|
|
|
+}
|
|
|
+#zeroPage .server .server_3:hover .sale_bg{
|
|
|
+ -webkit-transform: rotateY(180deg) !important;
|
|
|
+ transform: rotateY(180deg) !important;
|
|
|
+}
|
|
|
+#zeroPage .server .server_3:hover .sale {
|
|
|
+ -webkit-transform: rotateY(0deg) !important;
|
|
|
+ transform: rotateY(0deg) !important;
|
|
|
+}
|
|
|
+#zeroPage .server .operate_logo {
|
|
|
+ background: url("/img/supplier-login/cycle/-22.png") no-repeat;
|
|
|
+ width: 100px;
|
|
|
+ height: 100px;
|
|
|
+ background-size: cover;
|
|
|
+}
|
|
|
+#zeroPage .server .operate_bg_logo {
|
|
|
+ background: url("/img/supplier-login/cycle/2.png") no-repeat;
|
|
|
+ width: 160px;
|
|
|
+ height: 160px;
|
|
|
+ background-size: cover;
|
|
|
+}
|
|
|
+#zeroPage .server .operate_bg_title {
|
|
|
+ color: black;
|
|
|
+}
|
|
|
+#zeroPage .server .all_cont {
|
|
|
+ font-size: 16px;
|
|
|
+ box-sizing: border-box;
|
|
|
+ text-align: center;
|
|
|
+}
|
|
|
+#zeroPage .server .sale_logo {
|
|
|
+ background: url("/img/supplier-login/cycle/-33.png") no-repeat;
|
|
|
+ width: 100px;
|
|
|
+ height: 100px;
|
|
|
+ background-size: cover;
|
|
|
+}
|
|
|
+#zeroPage .server .sale_bg_logo {
|
|
|
+ background: url("/img/supplier-login/cycle/3.png") no-repeat;
|
|
|
+ width: 160px;
|
|
|
+ height: 160px;
|
|
|
+ background-size: cover;
|
|
|
+}
|
|
|
+#zeroPage .server .sale_bg_title {
|
|
|
+ color: black;
|
|
|
+}
|
|
|
+#firstPage {
|
|
|
+ background: url("/img/supplier-login/selection/select_bg.png") no-repeat;
|
|
|
+ background-size: cover;
|
|
|
+ height: 1014px !important;
|
|
|
+}
|
|
|
+#firstPage .selection {
|
|
|
+ display: flex;
|
|
|
+ justify-content: center;
|
|
|
+ align-items: center;
|
|
|
+ margin-top: 78px;
|
|
|
+}
|
|
|
+#firstPage .selection .selection_item{
|
|
|
+ padding-top: 20px;
|
|
|
+ box-sizing: border-box;
|
|
|
+ transition: .3s;
|
|
|
+ height: 666px;
|
|
|
+}
|
|
|
+#firstPage .selection .selection_item:hover {
|
|
|
+ padding-top: 0;
|
|
|
+}
|
|
|
+#firstPage .selection .selection_item:hover .select_btn {
|
|
|
+ background-color: #FF5B00;
|
|
|
+ color: white;
|
|
|
+}
|
|
|
+#firstPage .selection .selection_item:nth-child(2){
|
|
|
+ margin: 2vh;
|
|
|
+}
|
|
|
+#firstPage .selection_item .selection_item_contain {
|
|
|
+ width: 392px;
|
|
|
+ height: 646px;
|
|
|
+ background-color: #fff;
|
|
|
+}
|
|
|
+#firstPage .selection_item .selection_item_contain .contain_bg_01 {
|
|
|
+ width: 392px;
|
|
|
+ height: 120px;
|
|
|
+ background: url("/img/supplier-login/selection/select_01.png") no-repeat;
|
|
|
+ background-size: 100%;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: center;
|
|
|
+ color: #FFFFFF;
|
|
|
+ font-weight: bold;
|
|
|
+ font-size: 40px;
|
|
|
+}
|
|
|
+#firstPage .selection_item .selection_item_contain .contain_bg_02 {
|
|
|
+ width: 392px;
|
|
|
+ height: 120px;
|
|
|
+ background: url("/img/supplier-login/selection/select_02.png") no-repeat;
|
|
|
+ background-size: 100%;
|
|
|
+ display: flex;
|
|
|
+ justify-content: center;
|
|
|
+ align-items: center;
|
|
|
+ color: #FFFFFF;
|
|
|
+ font-weight: bold;
|
|
|
+ font-size: 2vw;
|
|
|
+}
|
|
|
+#firstPage .selection_item .selection_item_contain .contain_bg_03 {
|
|
|
+ width: 392px;
|
|
|
+ height: 120px;
|
|
|
+ background: url("/img/supplier-login/selection/select_03.png") no-repeat;
|
|
|
+ background-size: 100%;
|
|
|
+ display: flex;
|
|
|
+ justify-content: center;
|
|
|
+ align-items: center;
|
|
|
+ color: #FFFFFF;
|
|
|
+ font-weight: bold;
|
|
|
+ font-size: 2vw;
|
|
|
+}
|
|
|
+#firstPage .selection_item_contain .bg1_text {
|
|
|
+ width: 100%;
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: space-between;
|
|
|
+ font-size: 18px;
|
|
|
+ padding: 48px;
|
|
|
+ box-sizing: border-box;
|
|
|
+ height: 526px;
|
|
|
+}
|
|
|
+.bg1_contain {
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ width: 100%;
|
|
|
+ font-size: 0.8vw;
|
|
|
+ height: 3.5vh;
|
|
|
+ white-space: nowrap;
|
|
|
+}
|
|
|
+.square_icon {
|
|
|
+ width: 0.2vw;
|
|
|
+ height: 0.2vw;
|
|
|
+ border: 1px solid #B2B2B2;
|
|
|
+ margin: 0 0.5vw;
|
|
|
+ transform: rotate(45deg);
|
|
|
+}
|
|
|
+.text_contain {
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: space-between;
|
|
|
+ width: 100%;
|
|
|
+ height: 257px;
|
|
|
+}
|
|
|
+.select_btn {
|
|
|
+ width: 100%;
|
|
|
+ height: 5vh;
|
|
|
+ border: 1px solid #E2E2E2;
|
|
|
+ display: flex;
|
|
|
+ justify-content: center;
|
|
|
+ align-items: center;
|
|
|
+ border-radius: 4px;
|
|
|
+ cursor: pointer;
|
|
|
+}
|
|
|
+.select_btn_login {
|
|
|
+ width: 100%;
|
|
|
+ height: 5vh;
|
|
|
+ border: 1px solid #E2E2E2;
|
|
|
+ display: flex;
|
|
|
+ justify-content: center;
|
|
|
+ align-items: center;
|
|
|
+ border-radius: 4px;
|
|
|
+ background: #cccccc;
|
|
|
+}
|
|
|
+.Title {
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: space-around;
|
|
|
+ flex-direction: column;
|
|
|
+ width: 100%;
|
|
|
+ height: 11vh;
|
|
|
+ margin-top: 5vh;
|
|
|
+}
|
|
|
+.Title .text {
|
|
|
+ font-size: 1.8vw;
|
|
|
+}
|
|
|
+.Title .title {
|
|
|
+ font-size: 0.9vw;
|
|
|
+}
|
|
|
+#secondPage .operationa{
|
|
|
+ display: flex;
|
|
|
+ justify-content: center;
|
|
|
+ align-items: center;
|
|
|
+ margin-top: 4vh;
|
|
|
+}
|
|
|
+#secondPage .operationa_contain {
|
|
|
+ width: 940px;
|
|
|
+ height: 570px;
|
|
|
+ position: relative;
|
|
|
+}
|
|
|
+#secondPage .operationa_contain .bg2{
|
|
|
+ position: absolute;
|
|
|
+ left: 0;
|
|
|
+ top: 0;
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+ background: url("/img/supplier-login/oprate/bg_1.png") no-repeat;
|
|
|
+ background-size: cover;
|
|
|
+}
|
|
|
+#secondPage .operationa_contain .bg3{
|
|
|
+ position: absolute;
|
|
|
+ left: 0;
|
|
|
+ top: 0;
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+ background: url("/img/supplier-login/oprate/author/bg_2.png") no-repeat;
|
|
|
+ background-size: cover;
|
|
|
+}
|
|
|
+#secondPage .operationa_contain .bg1 {
|
|
|
+ position: absolute;
|
|
|
+ left: 0;
|
|
|
+ top: 10px;
|
|
|
+ width: 97.8%;
|
|
|
+ height: 90%;
|
|
|
+ background: url(/img/supplier-login/oprate/bg_2.png) no-repeat;
|
|
|
+ background-size: contain;
|
|
|
+ background-position: right;
|
|
|
+}
|
|
|
+#secondPage .operationa_contain .bg4 {
|
|
|
+ left: 6px;
|
|
|
+ top: 14px;
|
|
|
+ width: 70%;
|
|
|
+ height: 100%;
|
|
|
+ background: url(/img/supplier-login/oprate/bg_1.png) no-repeat;
|
|
|
+ background-size: contain;
|
|
|
+ position: absolute;
|
|
|
+ z-index: -1;
|
|
|
+}
|
|
|
+.operationa_contain .online_store {
|
|
|
+ width: 400px;
|
|
|
+ height: 70px;
|
|
|
+ position: absolute;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ left: 75px;
|
|
|
+ top: 45px;
|
|
|
+ border-bottom: 2px solid #FFCEAF;
|
|
|
+}
|
|
|
+.operationa_contain .online_store .online_logo {
|
|
|
+ width: 62px;
|
|
|
+ height: 100%;
|
|
|
+ border-bottom: 6px solid #FFC39A;
|
|
|
+ border-radius: 4px;
|
|
|
+ background: url(/img/supplier-login/oprate/house.png) no-repeat;
|
|
|
+ background-size: contain;
|
|
|
+ background-position: top;
|
|
|
+}
|
|
|
+.online_title {
|
|
|
+ font-size: 1.8vw;
|
|
|
+ font-weight: bold;
|
|
|
+ margin-left: 20px;
|
|
|
+}
|
|
|
+.operationa_contain .author_active {
|
|
|
+ width: 400px;
|
|
|
+ height: 70px;
|
|
|
+ position: absolute;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ right: 75px;
|
|
|
+ top: 45px;
|
|
|
+ border-bottom: 2px solid #FFCEAF;
|
|
|
+ flex-direction: row-reverse;
|
|
|
+}
|
|
|
+.operationa_contain .author_active .online_logo {
|
|
|
+ width: 62px;
|
|
|
+ height: 100%;
|
|
|
+ border-bottom: 6px solid #FFC39A;
|
|
|
+ border-radius: 4px;
|
|
|
+ background: url(/img/supplier-login/oprate/z.png) no-repeat;
|
|
|
+ background-size: contain;
|
|
|
+ background-position: top;
|
|
|
+}
|
|
|
+.online_title {
|
|
|
+ font-size: 1.8vw;
|
|
|
+ font-weight: bold;
|
|
|
+ margin-right: 20px;
|
|
|
+}
|
|
|
+.operationa_contain .online {
|
|
|
+ width: 383px;
|
|
|
+ height: 53px;
|
|
|
+ position: absolute;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ left: 56px;
|
|
|
+ top: 37px;
|
|
|
+}
|
|
|
+.online_title {
|
|
|
+ font-size: 28px;
|
|
|
+ font-weight: bold;
|
|
|
+ margin-right: 20px;
|
|
|
+}
|
|
|
+.operationa_contain .online .online_logo{
|
|
|
+ width: 62px;
|
|
|
+ height: 100%;
|
|
|
+ border-radius: 4px;
|
|
|
+ background: url(/img/supplier-login/oprate/house.png) no-repeat;
|
|
|
+ background-size: contain;
|
|
|
+ background-position: top;
|
|
|
+}
|
|
|
+.operationa_contain .author {
|
|
|
+ width: 222px;
|
|
|
+ height: 65px;
|
|
|
+ position: absolute;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ right: 40px;
|
|
|
+ top: 20px;
|
|
|
+}
|
|
|
+.operationa_contain .author .author_logo {
|
|
|
+ height: 65px;
|
|
|
+ width: 65px;
|
|
|
+ background: url(/img/supplier-login/oprate/z.png) no-repeat;
|
|
|
+ background-size: contain;
|
|
|
+}
|
|
|
+.operationa_contain .author .author_title {
|
|
|
+ font-size: 28px;
|
|
|
+ color: #FFFFFF;
|
|
|
+}
|
|
|
+.operationa_contain .contain {
|
|
|
+ width: 690px;
|
|
|
+ height: 400px;
|
|
|
+ position: absolute;
|
|
|
+ left: 120px;
|
|
|
+ top: 133px;
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-around;
|
|
|
+ align-items: center;
|
|
|
+ flex-direction: column;
|
|
|
+}
|
|
|
+.operationa_contain .contain .contain_logo {
|
|
|
+ width: 100%;
|
|
|
+ height: 150px;
|
|
|
+ background: url(/img/supplier-login/oprate/title.png) no-repeat;
|
|
|
+ background-size: contain;
|
|
|
+ background-position: center;
|
|
|
+}
|
|
|
+.operationa_contain .contain .contain_list {
|
|
|
+ width: 100%;
|
|
|
+ height: 200px;
|
|
|
+ display: flex;
|
|
|
+ justify-content: center;
|
|
|
+ align-items: center;
|
|
|
+}
|
|
|
+.operationa_contain .contain .contain_list .list_item {
|
|
|
+ width: 200px;
|
|
|
+ height: 100%;
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+ border: 2px solid white;
|
|
|
+ justify-content: space-around;
|
|
|
+ align-items: center;
|
|
|
+ background: #FDF0E9;
|
|
|
+ box-shadow: 0px 6px 50px 0px rgba(255,91,0,0.24);
|
|
|
+ border-radius: 16px;
|
|
|
+ padding: 20px;
|
|
|
+ box-sizing: border-box;
|
|
|
+}
|
|
|
+.operationa_contain .contain .contain_list .list_item:nth-child(2){
|
|
|
+ margin: 0 1%;
|
|
|
+}
|
|
|
+.operationa_contain .contain .contain_list .list_item:nth-child(1) div:nth-child(1) {
|
|
|
+ width: 80px;
|
|
|
+ height: 50px;
|
|
|
+ background: url(/img/supplier-login/oprate/p.png) no-repeat;
|
|
|
+ background-size: contain;
|
|
|
+ background-position: center;
|
|
|
+}
|
|
|
+.operationa_contain .contain .contain_list .list_item:nth-child(2) div:nth-child(1) {
|
|
|
+ width: 80px;
|
|
|
+ height: 50px;
|
|
|
+ background: url(/img/supplier-login/oprate/l.png) no-repeat;
|
|
|
+ background-size: contain;
|
|
|
+ background-position: center;
|
|
|
+}
|
|
|
+.operationa_contain .contain .contain_list .list_item:nth-child(3) div:nth-child(1) {
|
|
|
+ width: 80px;
|
|
|
+ height: 50px;
|
|
|
+ background: url(/img/supplier-login/oprate/s.png) no-repeat;
|
|
|
+ background-size: contain;
|
|
|
+ background-position: center;
|
|
|
+}
|
|
|
+.operationa_contain .athor_contain {
|
|
|
+ width: 690px;
|
|
|
+ height: 400px;
|
|
|
+ position: absolute;
|
|
|
+ left: 120px;
|
|
|
+ top: 133px;
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-around;
|
|
|
+ align-items: center;
|
|
|
+ flex-direction: column;
|
|
|
+}
|
|
|
+.operationa_contain .athor_contain .athor_contain_logo {
|
|
|
+ width: 100%;
|
|
|
+ height: 150px;
|
|
|
+ background: url(/img/supplier-login/oprate/author/logo.png) no-repeat;
|
|
|
+ background-size: contain;
|
|
|
+ background-position: center;
|
|
|
+}
|
|
|
+.operationa_contain .athor_contain .athor_contain_list {
|
|
|
+ width: 100%;
|
|
|
+ height: 200px;
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-between;
|
|
|
+ align-items: center;
|
|
|
+ flex-direction: column;
|
|
|
+}
|
|
|
+.athor_contain_list .list_item {
|
|
|
+ width: 97%;
|
|
|
+ height: 25%;
|
|
|
+ border: 1px solid #FFC9A9;
|
|
|
+ border-radius: 50px;
|
|
|
+ position: relative;
|
|
|
+ display: flex;
|
|
|
+ justify-content: center;
|
|
|
+ align-items: center;
|
|
|
+}
|
|
|
+.athor_contain_list .list_item:nth-child(1) .list_item_logo {
|
|
|
+ background: url(/img/supplier-login/oprate/author/02.png) no-repeat;
|
|
|
+ background-size: contain;
|
|
|
+ background-position: center;
|
|
|
+ width: 42px;
|
|
|
+ height: 50px;
|
|
|
+ position: absolute;
|
|
|
+ left: 10px;
|
|
|
+ top: 0;
|
|
|
+}
|
|
|
+.athor_contain_list .list_item:nth-child(2) .list_item_logo {
|
|
|
+ background: url(/img/supplier-login/oprate/author/03.png) no-repeat;
|
|
|
+ background-size: contain;
|
|
|
+ background-position: center;
|
|
|
+ width: 42px;
|
|
|
+ height: 50px;
|
|
|
+ position: absolute;
|
|
|
+ left: 10px;
|
|
|
+ top: 0;
|
|
|
+}
|
|
|
+.athor_contain_list .list_item:nth-child(3) .list_item_logo {
|
|
|
+ background: url(/img/supplier-login/oprate/author/04.png) no-repeat;
|
|
|
+ background-size: contain;
|
|
|
+ background-position: center;
|
|
|
+ width: 42px;
|
|
|
+ height: 50px;
|
|
|
+ position: absolute;
|
|
|
+ left: 10px;
|
|
|
+ top: 0;
|
|
|
+}
|
|
|
+
|
|
|
+.athor_contain_list .list_item .text_contain{
|
|
|
+ width: 80%;
|
|
|
+ height: 100%;
|
|
|
+ display: flex;
|
|
|
+ justify-content: start;
|
|
|
+ align-items: center;
|
|
|
+ flex-direction: row;
|
|
|
+ color: #FFC9A9;
|
|
|
+}
|
|
|
+.athor_contain_list .list_item .text_contain .text_contain_item {
|
|
|
+ font-size: 16px;
|
|
|
+ font-weight: bold;
|
|
|
+}
|
|
|
+.athor_contain_list .list_item .text_contain .text_contain_item2 {
|
|
|
+ width: 1px;
|
|
|
+ height: 20px;
|
|
|
+ background: #ffe2d3;
|
|
|
+ margin: 0 10px;
|
|
|
+}
|
|
|
+.athor_contain_list .list_item .text_contain .text_contain_item3 {
|
|
|
+ font-size: 16px;
|
|
|
+}
|
|
|
+#thirdPage {
|
|
|
+ background: #fff;
|
|
|
+}
|
|
|
+.pageInner {
|
|
|
+ height: 80vh;
|
|
|
+ display: flex;
|
|
|
+ justify-content: center;
|
|
|
+ align-items: center;
|
|
|
+ width: 100%;
|
|
|
+}
|
|
|
+.pageInner .container {
|
|
|
+ width: 1200px;
|
|
|
+ height: 20vw;
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-between;
|
|
|
+ position: relative;
|
|
|
+}
|
|
|
+.pageInner .thirdPage_container_contant {
|
|
|
+ position: absolute;
|
|
|
+ width: 100%;
|
|
|
+ height: 5vw;
|
|
|
+ left: 0;
|
|
|
+ top: -6vw;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: space-between;
|
|
|
+}
|
|
|
+.pageInner .thirdPage_container_contant .container_title {
|
|
|
+ width: 33%;
|
|
|
+ height: 100%;
|
|
|
+ border-bottom: 1px solid #FF5B00;
|
|
|
+ display: flex;
|
|
|
+ justify-content: center;
|
|
|
+ align-items: center;
|
|
|
+ position: relative;
|
|
|
+ font-weight: bold;
|
|
|
+ font-size: 1.5vw;
|
|
|
+ color: #FF5B00;
|
|
|
+ opacity: 0;
|
|
|
+}
|
|
|
+.pageInner .container .container_item {
|
|
|
+ height: 100%;
|
|
|
+ width: 18%;
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+ justify-content: center;
|
|
|
+ align-items: center;
|
|
|
+ position: relative;
|
|
|
+}
|
|
|
+.container_item .container_item_active .container_item_hover {
|
|
|
+ width: 100%;
|
|
|
+ height: 50%;
|
|
|
+ display: flex;
|
|
|
+ position: absolute;
|
|
|
+ flex-direction: column;
|
|
|
+ font-size: 0.8vw;
|
|
|
+ color: #202020;
|
|
|
+ transition: .3s;
|
|
|
+ justify-content: space-around;
|
|
|
+ align-items: center;
|
|
|
+ padding: 1vw 0;
|
|
|
+ box-sizing: border-box;
|
|
|
+}
|
|
|
+.container_item .container_item_active .container_item_hover2 {
|
|
|
+ width: 100%;
|
|
|
+ height: 50%;
|
|
|
+ display: flex;
|
|
|
+ position: absolute;
|
|
|
+ flex-direction: column;
|
|
|
+ font-size: 0.8vw;
|
|
|
+ color: #202020;
|
|
|
+ transition: .3s;
|
|
|
+ justify-content: space-around;
|
|
|
+ align-items: center;
|
|
|
+ padding: 1vw 0;
|
|
|
+ box-sizing: border-box;
|
|
|
+ bottom: 0;
|
|
|
+}
|
|
|
+.container_item .container_item_active .item_title {
|
|
|
+ display: none;
|
|
|
+ font-size: 1.5vw;
|
|
|
+ color: #FF5B00;
|
|
|
+ font-weight: bold;
|
|
|
+ width: 80%;
|
|
|
+}
|
|
|
+.container_item .container_item_active .item_contant {
|
|
|
+ display: none;
|
|
|
+ color: #666666;
|
|
|
+ font-size: 18px;
|
|
|
+ width: 80%;
|
|
|
+}
|
|
|
+.container_item .container_item_active .item_logo {
|
|
|
+ width: 4vw;
|
|
|
+ height: 4vw;
|
|
|
+}
|
|
|
+.container_item .container_item_active .item_logo_box {
|
|
|
+ width: 80%;
|
|
|
+ display: flex;
|
|
|
+ justify-content: center;
|
|
|
+ align-items: center;
|
|
|
+}
|
|
|
+#item_logo_1 {
|
|
|
+ background: url(/img/supplier-login/05-page/信.png) center no-repeat;
|
|
|
+ background-size: contain;
|
|
|
+}
|
|
|
+#item_logo_2 {
|
|
|
+ background: url(/img/supplier-login/05-page/矩.png) center no-repeat;
|
|
|
+ background-size: contain;
|
|
|
+}
|
|
|
+#item_logo_3 {
|
|
|
+ background: url(/img/supplier-login/05-page/正.png) center no-repeat;
|
|
|
+ background-size: contain;
|
|
|
+}
|
|
|
+#item_logo_4 {
|
|
|
+ background: url(/img/supplier-login/05-page/SEO.png) center no-repeat;
|
|
|
+ background-size: contain;
|
|
|
+}
|
|
|
+#item_logo_5 {
|
|
|
+ background: url(/img/supplier-login/05-page/CRM.png) center no-repeat;
|
|
|
+ background-size: contain;
|
|
|
+}
|
|
|
+#item_logo_6 {
|
|
|
+ background: url(/img/supplier-login/05-page/认.png) center no-repeat;
|
|
|
+ background-size: contain;
|
|
|
+}
|
|
|
+#item_logo_7 {
|
|
|
+ background: url(/img/supplier-login/05-page/美.png) center no-repeat;
|
|
|
+ background-size: contain;
|
|
|
+}
|
|
|
+#item_logo_8 {
|
|
|
+ background: url(/img/supplier-login/05-page/私.png) center no-repeat;
|
|
|
+ background-size: contain;
|
|
|
+}
|
|
|
+#item_logo_9 {
|
|
|
+ background: url(/img/supplier-login/05-page/分.png) center no-repeat;
|
|
|
+ background-size: contain;
|
|
|
+}
|
|
|
+#item_logo_10 {
|
|
|
+ background: url(/img/supplier-login/05-page/会.png) center no-repeat;
|
|
|
+ background-size: contain;
|
|
|
+}
|
|
|
+#item_logo_11 {
|
|
|
+ background: url(/img/supplier-login/05-page/金.png) center no-repeat;
|
|
|
+ background-size: contain;
|
|
|
+}
|
|
|
+#item_logo_12 {
|
|
|
+ background: url(/img/supplier-login/05-page/交.png) center no-repeat;
|
|
|
+ background-size: contain;
|
|
|
+}
|
|
|
+#thirdPage .container_item .container_item_active {
|
|
|
+ height: 50%;
|
|
|
+ width: 100%;
|
|
|
+}
|
|
|
+#thirdPage .container_item .container_item_active:hover #item_logo_1 {
|
|
|
+ background: url(/img/supplier-login/05-page/slide/01.png) center no-repeat;
|
|
|
+}
|
|
|
+#thirdPage .container_item .container_item_active:hover #item_logo_2 {
|
|
|
+ background: url(/img/supplier-login/05-page/slide/02.png) center no-repeat;
|
|
|
+}
|
|
|
+#thirdPage .container_item .container_item_active:hover #item_logo_3 {
|
|
|
+ background: url(/img/supplier-login/05-page/slide/03.png) center no-repeat;
|
|
|
+}
|
|
|
+#thirdPage .container_item .container_item_active:hover #item_logo_4 {
|
|
|
+ background: url(/img/supplier-login/05-page/slide/04.png) center no-repeat;
|
|
|
+}
|
|
|
+#thirdPage .container_item .container_item_active:hover #item_logo_5 {
|
|
|
+ background: url(/img/supplier-login/05-page/slide/05.png) center no-repeat;
|
|
|
+}
|
|
|
+#thirdPage .container_item .container_item_active:hover #item_logo_6 {
|
|
|
+ background: url(/img/supplier-login/05-page/slide/06.png) center no-repeat;
|
|
|
+}
|
|
|
+#thirdPage .container_item .container_item_active:hover #item_logo_7 {
|
|
|
+ background: url(/img/supplier-login/05-page/slide/07.png) center no-repeat;
|
|
|
+}
|
|
|
+#thirdPage .container_item .container_item_active:hover #item_logo_8 {
|
|
|
+ background: url(/img/supplier-login/05-page/slide/08.png) center no-repeat;
|
|
|
+}
|
|
|
+#thirdPage .container_item .container_item_active:hover #item_logo_9 {
|
|
|
+ background: url(/img/supplier-login/05-page/slide/09.png) center no-repeat;
|
|
|
+}
|
|
|
+#thirdPage .container_item .container_item_active:hover #item_logo_10 {
|
|
|
+ background: url(/img/supplier-login/05-page/slide/10.png) center no-repeat;
|
|
|
+}
|
|
|
+#thirdPage .container_item .container_item_active:hover #item_logo_11 {
|
|
|
+ background: url(/img/supplier-login/05-page/slide/11.png) center no-repeat;
|
|
|
+}
|
|
|
+#thirdPage .container_item .container_item_active:hover #item_logo_12 {
|
|
|
+ background: url(/img/supplier-login/05-page/slide/12.png) center no-repeat;
|
|
|
+}
|
|
|
+#thirdPage .container_item .container_item_active:hover .container_item_hover {
|
|
|
+ background: #F7F7F7 !important;
|
|
|
+ height: 100%;
|
|
|
+ top: 0;
|
|
|
+ left: 0;
|
|
|
+ z-index: 111;
|
|
|
+}
|
|
|
+#thirdPage .container_item .container_item_active:hover .container_item_hover2 {
|
|
|
+ background: #F7F7F7 !important;
|
|
|
+ height: 100%;
|
|
|
+ left: 0;
|
|
|
+ z-index: 111;
|
|
|
+}
|
|
|
+#thirdPage .container_item .container_item_active:hover .item_logo_box {
|
|
|
+ justify-content: end;
|
|
|
+}
|
|
|
+#thirdPage .container_item .container_item_active:hover .item_logo {
|
|
|
+ width: 5.2vw;
|
|
|
+ height: 5.2vw;
|
|
|
+}
|
|
|
+#thirdPage .container_item .container_item_active:hover .item_title {
|
|
|
+ display: block !important;
|
|
|
+}
|
|
|
+#thirdPage .container_item .container_item_active:hover .item_title_p {
|
|
|
+ display: none !important;
|
|
|
+}
|
|
|
+#thirdPage .container_item .container_item_active:hover .item_contant {
|
|
|
+ display: block !important;
|
|
|
+}
|
|
|
+#thirdPage .container_item .container_item_active:hover .container_title:nth-child(1){
|
|
|
+ display: flex !important;
|
|
|
+}
|
|
|
+#fourPage .pageInner_contain {
|
|
|
+ width: 80%;
|
|
|
+ height: 30vw;
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-between;
|
|
|
+ align-items: center;
|
|
|
+}
|
|
|
+#fourPage .pageInner_contain .nextChange {
|
|
|
+ width: 40px;
|
|
|
+ height: 48px;
|
|
|
+ border: 1px solid #E2E2E2;
|
|
|
+ border-radius: 2px;
|
|
|
+ display: flex;
|
|
|
+ justify-content: center;
|
|
|
+ align-items: center;
|
|
|
+ color: #E2E2E2;
|
|
|
+ cursor: pointer;
|
|
|
+}
|
|
|
+#fourPage .pageInner_contain .isActiveNext{
|
|
|
+ border: 1px solid #FF5B00;
|
|
|
+ color: #FF5B00;
|
|
|
+}
|
|
|
+#fourPage .el-carousel--horizontal {
|
|
|
+ width: 90%;
|
|
|
+}
|
|
|
+#fourPage .el-carousel__arrow{
|
|
|
+ display: none;
|
|
|
+}
|
|
|
+#fourPage .el-carousel__item {
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-around;
|
|
|
+ align-items: center;
|
|
|
+ box-sizing: border-box;
|
|
|
+}
|
|
|
+#fourPage .el-carousel__item .four_logo_1 {
|
|
|
+ width: 50%;
|
|
|
+ height: 80%;
|
|
|
+}
|
|
|
+#fourPage .el-carousel__item .logo_text {
|
|
|
+ width: 45%;
|
|
|
+ height: 80%;
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+ justify-content: start;
|
|
|
+ overflow: hidden;
|
|
|
+}
|
|
|
+#fourPage .el-carousel__item .logo_text .logo_title {
|
|
|
+ font-size: 1.25vw;
|
|
|
+ color: black;
|
|
|
+ font-weight: bold;
|
|
|
+ margin-bottom: 2vw;
|
|
|
+}
|
|
|
+#fourPage .el-carousel__item .logo_text .analysis {
|
|
|
+ font-size: 0.8vw;
|
|
|
+ line-height: 2vw;
|
|
|
+}
|
|
|
+#fivePage {
|
|
|
+ background: url(/img/supplier-login/07-caimei/bg.png) no-repeat;
|
|
|
+ background-size: 100% 100%;
|
|
|
+}
|
|
|
+#fivePage .inner_contain {
|
|
|
+ width: 100%;
|
|
|
+ height: 67vh;
|
|
|
+ margin-top: 7vh;
|
|
|
+ display: flex;
|
|
|
+ justify-content: center;
|
|
|
+ align-items: center;
|
|
|
+}
|
|
|
+#fivePage .inner_contain .inner {
|
|
|
+ width: 64%;
|
|
|
+ height: 100%;
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-between;
|
|
|
+ align-items: center;
|
|
|
+ flex-direction: column;
|
|
|
+}
|
|
|
+#fivePage .inner_contain .inner .caimei_introduction {
|
|
|
+ color: white;
|
|
|
+ font-size: 18px;
|
|
|
+ width: 1200px;
|
|
|
+ height: auto;
|
|
|
+ padding: 3vh;
|
|
|
+ background-color: rgba(255,255,255, 0.2);
|
|
|
+ box-sizing: border-box;
|
|
|
+ line-height: 40px;
|
|
|
+}
|
|
|
+#fivePage .inner_contain .inner .caimei_report {
|
|
|
+ width: 90%;
|
|
|
+ height: 55%;
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-around;
|
|
|
+ align-items: center;
|
|
|
+}
|
|
|
+.caimei_report .report_item {
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: space-between;
|
|
|
+ flex-direction: column;
|
|
|
+ height: 100%;
|
|
|
+ width: 20%;
|
|
|
+}
|
|
|
+.caimei_report .report_item .report_logo {
|
|
|
+ display: flex;
|
|
|
+ justify-content: center;
|
|
|
+ align-items: center;
|
|
|
+ font-size: 1.6vw;
|
|
|
+ width: 12vw;
|
|
|
+ height: 9vw;
|
|
|
+ background: url(/img/supplier-login/07-caimei/cirle.png) no-repeat center;
|
|
|
+ background-size: contain;
|
|
|
+ font-weight: bold;
|
|
|
+ color: white;
|
|
|
+}
|
|
|
+.caimei_report .report_item .report_title {
|
|
|
+ font-size: 0.8vw;
|
|
|
+ color: #fff;
|
|
|
+}
|
|
|
+.caimei_report .report_item .report_line{
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+ justify-content: end;
|
|
|
+ align-items: center;
|
|
|
+}
|
|
|
+.caimei_report .report_item .report_line .box1 {
|
|
|
+ padding: 0.52vw 1px;
|
|
|
+ height: 5.2vw;
|
|
|
+}
|
|
|
+.caimei_report .report_item .report_line .card4 {
|
|
|
+ background-image: linear-gradient(#fff 35%, rgba(255,255,255,0) 0%);
|
|
|
+ background-position: left;
|
|
|
+ background-size: 1px 10px;
|
|
|
+ background-repeat: repeat-y;
|
|
|
+}
|
|
|
+.caimei_report .report_item .report_line .container {
|
|
|
+ position: relative;
|
|
|
+ display: flex;
|
|
|
+ justify-content: center;
|
|
|
+ align-items: center;
|
|
|
+ flex-direction: row;
|
|
|
+}
|
|
|
+.caimei_report .report_item .report_line .container .box {
|
|
|
+ width: 20px;
|
|
|
+ height: 20px;
|
|
|
+ display: flex;
|
|
|
+ justify-content: center;
|
|
|
+ align-items: center;
|
|
|
+}
|
|
|
+.caimei_report .report_item .report_line .container .box span {
|
|
|
+ position: absolute;
|
|
|
+ box-sizing: border-box;
|
|
|
+ border: none;
|
|
|
+ background: #FFFFFF;
|
|
|
+ border-radius: 50%;
|
|
|
+ animation: animate 1s linear infinite;
|
|
|
+ animation-delay: calc(0.5s * var(--i))
|
|
|
+}
|
|
|
+
|
|
|
+#sixPage .community {
|
|
|
+ width: 1200px;
|
|
|
+ height: 70vh;
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-between;
|
|
|
+ align-items: center;
|
|
|
+ margin-top: 2vw;
|
|
|
+ flex-direction: column;
|
|
|
+}
|
|
|
+.community .community_video{
|
|
|
+ width: 100%;
|
|
|
+ height: 45%;
|
|
|
+ font-size: 1vw;
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-between;
|
|
|
+ flex-direction: column;
|
|
|
+}
|
|
|
+.community .community_article {
|
|
|
+ width: 100%;
|
|
|
+ height: 45%;
|
|
|
+ font-size: 1vw;
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-between;
|
|
|
+ flex-direction: column;
|
|
|
+}
|
|
|
+.community_title {
|
|
|
+ padding: 1% 0;
|
|
|
+ font-size: 1vw;
|
|
|
+}
|
|
|
+.community .community_list {
|
|
|
+ width: 100%;
|
|
|
+ display: flex;
|
|
|
+ /*justify-content: space-between;*/
|
|
|
+ align-items: center;
|
|
|
+ height: 90%;
|
|
|
+}
|
|
|
+.community_list .video_list_item {
|
|
|
+ width: 24%;
|
|
|
+ height: 100%;
|
|
|
+ box-sizing: border-box;
|
|
|
+ padding-top: 5px;
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+ justify-content: space-between;
|
|
|
+ align-items: center;
|
|
|
+ transition: .2s;
|
|
|
+ cursor: pointer;
|
|
|
+}
|
|
|
+.community_list .article_list_item {
|
|
|
+ width: 24%;
|
|
|
+ height: 100%;
|
|
|
+ box-sizing: border-box;
|
|
|
+ padding-top: 5px;
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+ justify-content: space-between;
|
|
|
+ align-items: center;
|
|
|
+ transition: .2s;
|
|
|
+ cursor: pointer;
|
|
|
+}
|
|
|
+.article_list_item .article_list_item_content {
|
|
|
+ height: 100%;
|
|
|
+ width: 100%;
|
|
|
+ border: 1px solid #EAEAEA;
|
|
|
+ box-sizing: border-box;
|
|
|
+ color: #202020;
|
|
|
+}
|
|
|
+.video_list_item .video_list_item_content {
|
|
|
+ height: 100%;
|
|
|
+ width: 100%;
|
|
|
+ border: 1px solid #EAEAEA;
|
|
|
+ box-sizing: border-box;
|
|
|
+ color: #202020;
|
|
|
+ position: relative;
|
|
|
+}
|
|
|
+.video_list_item .video_list_item_content .player_bg {
|
|
|
+ position: absolute;
|
|
|
+ width: 100%;
|
|
|
+ height: 60%;
|
|
|
+ box-sizing: border-box;
|
|
|
+ left: 0;
|
|
|
+ top: 0;
|
|
|
+ background: rgba(24, 23, 23, 0.4);
|
|
|
+ display: none;
|
|
|
+ justify-content: center;
|
|
|
+ align-items: center;
|
|
|
+ transition: .2s;
|
|
|
+ z-index: 11;
|
|
|
+}
|
|
|
+.video_list_item_content .video_player {
|
|
|
+ width: 100%;
|
|
|
+ height: 60%;
|
|
|
+ box-sizing: border-box;
|
|
|
+ overflow: hidden;
|
|
|
+}
|
|
|
+.article_list_item_content .article_bg {
|
|
|
+ width: 100%;
|
|
|
+ height: 60%;
|
|
|
+ box-sizing: border-box;
|
|
|
+ overflow: hidden;
|
|
|
+}
|
|
|
+.video_list_item_content .video_title {
|
|
|
+ width: 100%;
|
|
|
+ height: 40%;
|
|
|
+ box-sizing: border-box;
|
|
|
+ font-size: 14px;
|
|
|
+ display: flex;
|
|
|
+ justify-content: center;
|
|
|
+ align-items: center;
|
|
|
+ line-height: 22px;
|
|
|
+ padding: 20px
|
|
|
+}
|
|
|
+.article_list_item_content .article_text {
|
|
|
+ width: 100%;
|
|
|
+ height: 40%;
|
|
|
+ box-sizing: border-box;
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-around;
|
|
|
+ align-items: center;
|
|
|
+ flex-direction: column;
|
|
|
+ font-size: 0.7vw;
|
|
|
+ color: #808080;
|
|
|
+}
|
|
|
+.article_list_item_content .text_title {
|
|
|
+ color: #202020;
|
|
|
+ font-size: 1vw;
|
|
|
+ width: 100%;
|
|
|
+ box-sizing: border-box;
|
|
|
+ border-left: 3px solid #FF5B00;
|
|
|
+ padding: 0 4%;
|
|
|
+}
|
|
|
+.video_list_item:nth-child(1):hover {
|
|
|
+ padding: 0 0 5px 0;
|
|
|
+}
|
|
|
+.video_list_item:nth-child(1):hover .video_list_item_content {
|
|
|
+ box-shadow: 0px 6px 35px 0px rgba(255,157,102,0.12);
|
|
|
+ color: #FF5B00;
|
|
|
+}
|
|
|
+.video_list_item:nth-child(1):hover .player_bg {
|
|
|
+ display: flex;
|
|
|
+}
|
|
|
+.video_list_item:nth-child(2):hover .player_bg {
|
|
|
+ display: flex;
|
|
|
+}
|
|
|
+.video_list_item:nth-child(3):hover .player_bg {
|
|
|
+ top: 0;
|
|
|
+ display: flex;
|
|
|
+}
|
|
|
+.video_list_item:nth-child(4):hover .player_bg {
|
|
|
+ top: 0;
|
|
|
+ display: flex;
|
|
|
+}
|
|
|
+.video_list_item:nth-child(2):hover {
|
|
|
+ padding: 0 0 5px 0;
|
|
|
+}
|
|
|
+.video_list_item:nth-child(2):hover .video_list_item_content {
|
|
|
+ box-shadow: 0px 6px 35px 0px rgba(255,157,102,0.12);
|
|
|
+ color: #FF5B00 !important;
|
|
|
+}
|
|
|
+.video_list_item:nth-child(3):hover {
|
|
|
+ padding: 0 0 5px 0;
|
|
|
+}
|
|
|
+.video_list_item:nth-child(3):hover .video_list_item_content {
|
|
|
+ box-shadow: 0px 6px 20px 0px rgba(255,157,102,0.12);
|
|
|
+ color: #FF5B00 !important;
|
|
|
+}
|
|
|
+.video_list_item:nth-child(4):hover {
|
|
|
+ padding: 0 0 5px 0;
|
|
|
+}
|
|
|
+.video_list_item:nth-child(4):hover .video_list_item_content{
|
|
|
+ box-shadow: 0px 6px 20px 0px rgba(255,157,102,0.12);
|
|
|
+ color: #FF5B00;
|
|
|
+}
|
|
|
+.article_list_item:nth-child(1):hover {
|
|
|
+ padding: 0 0 5px 0;
|
|
|
+}
|
|
|
+.article_list_item:nth-child(1):hover .article_list_item_content {
|
|
|
+ box-shadow: 0px 6px 20px 0px rgba(255,157,102,0.12);
|
|
|
+ color: #FF5B00 !important;
|
|
|
+}
|
|
|
+.article_list_item:nth-child(2):hover .article_list_item_content {
|
|
|
+ box-shadow: 0px 6px 20px 0px rgba(255,157,102,0.12);
|
|
|
+ color: #FF5B00 !important;
|
|
|
+}
|
|
|
+.article_list_item:nth-child(3):hover .article_list_item_content {
|
|
|
+ box-shadow: 0px 6px 20px 0px rgba(255,157,102,0.12);
|
|
|
+ color: #FF5B00 !important;
|
|
|
+}
|
|
|
+.article_list_item:nth-child(4):hover .article_list_item_content {
|
|
|
+ box-shadow: 0px 6px 20px 0px rgba(255,157,102,0.12);
|
|
|
+ color: #FF5B00 !important;
|
|
|
+}
|
|
|
+.article_list_item:nth-child(2):hover {
|
|
|
+ padding: 0 0 5px 0;
|
|
|
+}
|
|
|
+.article_list_item:nth-child(3):hover {
|
|
|
+ padding: 0 0 5px 0;
|
|
|
+}
|
|
|
+.article_list_item:nth-child(4):hover {
|
|
|
+ padding: 0 0 5px 0;
|
|
|
+}
|
|
|
+.article_list_item:nth-child(1):hover .text_title,
|
|
|
+.article_list_item:nth-child(2):hover .text_title,
|
|
|
+.article_list_item:nth-child(3):hover .text_title,
|
|
|
+.article_list_item:nth-child(4):hover .text_title {
|
|
|
+ color: #FF5B00 !important;
|
|
|
+}
|
|
|
+@keyframes animate {
|
|
|
+ 0% {
|
|
|
+ width: 0;
|
|
|
+ height: 0;
|
|
|
+ }
|
|
|
+
|
|
|
+ 50% {
|
|
|
+ opacity: 1;
|
|
|
+ }
|
|
|
+
|
|
|
+ 100% {
|
|
|
+ width: 50px;
|
|
|
+ height: 50px;
|
|
|
+ opacity: 0;
|
|
|
+ }
|
|
|
+}
|
|
|
+.cm_video_player {
|
|
|
+ position: fixed;
|
|
|
+ left: 0;
|
|
|
+ top: 0;
|
|
|
+ width: 100vw;
|
|
|
+ height: 100vh;
|
|
|
+ background: rgba(24, 23, 23, 0.5);
|
|
|
+ display: none;
|
|
|
+ z-index: 999;
|
|
|
+ justify-content: center;
|
|
|
+ align-items: center;
|
|
|
+}
|
