浏览代码

fixed:落地页手机号和二维码修改

xiebaomin 1 年之前
父节点
当前提交
d12f930896

+ 1 - 1
src/main/resources/static/css/supplier-login/login.css

@@ -87,7 +87,7 @@ body{
     flex-direction: column;
     position: fixed;
     right: 1vw;
-    bottom: 90px;
+    bottom: 140px;
     background: #FF5B00;
     border-radius: 4px;
     padding: 4px;

+ 1601 - 1601
src/main/resources/static/css/supplier-login/text_info.css

@@ -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;
+}

+ 3 - 3
src/main/resources/templates/supplier_login/index.html

@@ -75,14 +75,14 @@
     <div class="slide_icon" v-if="showContent && isPC">
         <div class="slide_icon_item slide_icon_phone">
             <img src="" /> 电话联系
-            <div class="tooltip tooltip_1" :style="{bottom: activeLinkId!==0 ? '250px':'180px'}">
+            <div class="tooltip tooltip_1" :style="{bottom: activeLinkId!==0 ? '300px':'230px'}">
                 <div class="day">周一至周五 9:00~1800</div>
                 <div class="phone_number">131-6478-0233</div>
             </div>
         </div>
         <div class="slide_icon_item slide_icon_qrcode">
             <img src="" /> 微信客服
-            <div class="tooltip tooltip_2" :style="{bottom: activeLinkId!==0 ? '50px':'0'}">
+            <div class="tooltip tooltip_2" :style="{bottom: activeLinkId!==0 ? '100px':'50px'}">
                 <img src="https://static.caimei365.com/app/img/supplier-login/kefu_qr.jpg" alt="采美客服">
             </div>
         </div>
@@ -555,7 +555,7 @@
             <div class="showIphone_time">周一至周五 9:00~1800</div>
             <div class="showIphone_phone" @click="confirm">131-6478-0233</div>
         </div>
-        <img style="width: 48vw; height: 48vw;" src="https://static.caimei365.com/app/img/supplier-login/kefu_qr.jpg" alt="采美客服" v-else/>
+        <img style="width: 48vw" src="https://static.caimei365.com/app/img/supplier-login/kefu_qr.jpg" alt="采美客服" v-else/>
     </van-popup>
     <van-popup v-model="showPopup" round>
         <div id="H5showPopup">