/* * @Autor: chenqinglong * @Date: 2021-10-25 10:55:11 * @LastEditors: 蜻蜓队长 1770815539@163.com * @LastEditTime: 2022-11-03 11:03:12 * @Introduce: * @FilePath: \135editor\webroot\css\categories\index-style.css */ /* 隐藏q回剙 */ #toTop {display: none !important;} /* D */ #top{position: fixed;left: 0;right: 0;z-index: 10;} /* W一?*/ .One_screen {position: relative;} .One_screen .One_content{text-align: center;position: absolute;bottom: calc(50vh - 270px);left: 0;right: 0;} .One_content img{width: 96px;} .One_content h4{margin: 67px 0 37px;font-size: 30px;font-weight: bold;color: #FFFFFF;line-height: 36px;} .One_content p{font-size: 16px;font-weight: 400;color: #FFFFFF;line-height: 36px;margin: 0;} .One_btn{margin: 67px 0 0;display: flex;justify-content: center;} .One_btn a{font-size: 16px;font-weight: 400;color: #FFFFFF;line-height: 48px;max-width: 150px;width: 100%;height: 48px;background: rgba(98,102,119,0.7);border-radius: 24px;margin: 0 30px;padding: 0;} .One_btn .guide{background-image: linear-gradient(90deg, #fc9632 0%, #fd6842 53%, #fd3a51 100%), linear-gradient( #fcf6e6, #fcf6e6);} /* .One_btn .guide:hover{background: linear-gradient(90deg, #ffa54b, #ff586c);} */ .One_btn .button:hover{background: rgba(98,102,119,1);} /* 无缝隙滚?*/ .One_mask{background: #000; opacity: 0.75;position: absolute;top: 0;} #seamless_slide,.One_mask{display: flex; justify-content: space-between;overflow: hidden;height: 120vh;width: 100%;background: #000;} #seamless_slide .slide_main{flex: 1;height: 100%;position: relative;} #seamless_slide .slide_main+.slide_main{margin: 0 0 0 10px;} #seamless_slide .slide_list{width: 100%;height: 100%;position: absolute;} /* -webkit-transition: 0.1s;transition: 0.1s; */ #seamless_slide .slide_list>div{height: auto;max-height: 350px;overflow: hidden;background: #333;width: 100%;} #seamless_slide .slide_list>div+div{margin: 10px 0 0;} #seamless_slide .slide_list>div img{height: auto;display: block;width: 100%;} /* W二?教程 */ .Two_screen{padding: 60px 0 54px;background: #f6f6f6;} /* .Two_screen .section-title h3{color: #000;} .Two_screen .section-title h4{color: #333;} */ .Two_screen .tour-video{border-radius: 0;} .Two_screen .tab-content{border: 21px solid #fff;border-radius: 10px 10px 0 0;padding: 20px 20px 0 20px;background: #F6F6F6;max-width: 1000px;margin: 20px auto 0;} .Two_screen .desk{max-width: 1200px;margin: -20px auto;height: 50px;background: #fff;width: 100%;border-radius: 0 0 50px 50px;} .Two_screen .tab-content-button{margin: 60px auto 0;} .Two_screen .page-back-btn{padding: 9px 58px;} /* W三?模板ƣ赏 */ .Three_screen{padding: 66px 0 14px;} .Three_screen .section-button{margin: 50px auto;text-align: center;} .Three_screen .page-back-btn{padding: 9px 58px;} .Three_screen .single-model .model-image a{display: block;} /* 轮播左右头 */ .Three_screen .owl-theme .owl-controls .owl-nav div{position:absolute;top:50%;width:50px;height:50px;margin:0;padding:0;border-radius:50%;background: #fff;border: 1px solid #ddd;color: #ddd;font:35px/50px "宋体";} .Three_screen .owl-theme .owl-controls .owl-nav .owl-prev{left:-70px;} .Three_screen .owl-theme .owl-controls .owl-nav .owl-next{right:-70px;} .Three_screen .owl-theme .owl-controls .owl-nav .owl-prev:before{content:"<";margin: 0 5px 0 0;} .Three_screen .owl-theme .owl-controls .owl-nav .owl-next:before{content:">";margin: 0 0 0 5px;} /* W四?产品 */ .Four_screen{padding: 66px 0 58px; background: url('https://bdn.135editor.com/files/202110/images/product_bj.png'); background-repeat: no-repeat; background-size: cover; } .Four_screen .section-title h3{color: #fff;} .Four_screen .section-title h4{color: #ddd;} .Four_screen .section-title{margin-bottom: 80px;} .Four_screen .single-case-item{background: #fff;} .Four_screen .single-case-image{padding: 20px 10px 0;} .Four_screen .case-content h3{font-size: 24px;} .Four_screen .case-content p{font-size: 16px;} .Four_screen .unique{display: flex;align-items: center;font-size: 16px;font-weight: bold;} .Four_screen .unique a{background: linear-gradient(to right, #fe5365 0%,#fc682f 100%);padding: 2px 20px;border-radius: 50px;font-size: 14px;color: #fff;font-weight: 400;} .Four_screen .unique a+a{margin: 0 0 0 15px;} /* W五?业务 */ .Five_screen{background: #F3F3F3;padding: 76px 0 94px;} .Five_screen .Five_content{justify-content: space-between;margin-top: 85px;} .Five_screen .Five_content>div{background: #fff;border-radius: 10px;width: 32%;position: relative;} .Five_screen .service-icon{position: absolute;top: -40px;box-shadow: 0px 2px 35px 0px rgba(202, 202, 202, 0.24);border-radius: 50%;background: #fff;width: 112px;height: 112px;left: calc(50% - 56px);display: flex;align-items: center;justify-content: center;} .Five_screen .serviace-info{padding: 80px 25px 67px;} .Five_screen .serviace-info h3{margin: 0 0 20px;font-size: 22px;} .Five_screen .serviace-info p{padding: 0;margin: 5px 0 0;font-size: 16px;} /* W六?合作?*/ .Six_screen{padding: 87px 0 50px;} /* W七?邀请好?*/ .seven_screen{height: 400px;display: flex;align-items: center;justify-content:center; background: url('https://bdn.135editor.com/files/202110/images/friend_bj.png'); background-repeat: no-repeat; background-size: cover; background-position: 100% 100%; letter-spacing: 0.1em; } .seven_content{text-align: center;} .seven_screen h4{font-size: 26px;font-weight: 400;color: #FFFFFF;line-height: 36px;} .seven_screen a{ width: 255px; height: 60px; background: linear-gradient(90deg, #FC9632, #FD3B51); box-shadow: 0px 4px 6px 0px rgb(253 59 81 / 40%); border-radius: 33px; font-size: 22px; font-weight: 400; color: #FFFFFF; line-height: 60px; text-shadow: 0px 3px 0px rgb(253 59 81 / 40%); margin: 40px 0 0; } /* 合作伙伴 */ .eight_screen{min-height: 250px;padding: 50px 0;} .eight_screen .bottomBar_title{display: flex;border-bottom: 1px solid #CCCCCC;} .eight_screen .bottomBar_name{font-weight: bold;font-size: 18px;cursor: pointer;line-height: 30px;padding: 0 2px 10px;} .eight_screen .bottomBar_name+.bottomBar_name{margin: 0 0 0 20px;} .eight_screen .bottomBar_sign{border-bottom: 2px solid #FD3B51;} .eight_screen .SmallTitle{display: flex;flex-wrap: wrap;margin: 15px 0 0;} .eight_screen .SmallTitle div{font-size: 16px;line-height: 30px; margin: 0 20px 0 0;} /* Ud端开始?*/ .fix-btn {position: fixed;left: 0;bottom: 0;z-index: 9;width: 100%;display: none;padding: 8px 16px;text-align: center;background-color: #fff;box-shadow: 0px -5px 12px #ddd;} .fix-btn>a {display: block;width: 100%;text-decoration: none;border-radius: 10px;padding: 5px;color: #fff;font-size: 18px;letter-spacing: 4px; background: -moz-linear-gradient(left, #fe5365 0%, #fc682f 100%); background: -webkit-gradient(linear, top left, top right, color-stop(0%, #fe5365), color-stop(100%, #fc682f)); background: -webkit-linear-gradient(left, #fe5365 0%, #fc682f 100%); background: -o-linear-gradient(left, #fe5365 0%, #fc682f 100%); background: -ms-linear-gradient(left, #fe5365 0%, #fc682f 100%); background: linear-gradient(to right, #fe5365 0%, #fc682f 100%); } /* 于1200 */ @media only screen and (max-width: 1200px) { /* W二?*/ .Two_screen .desk{display: none;} .Two_screen .tab-content{border-radius: 10px;padding: 10px;border: 10px solid #fff;margin: 10px;} .Two_screen .tab-content-button{margin: 30px auto 0;} /* W四?*/ .Four_screen .unique{font-size: 14px;} .Four_screen .unique a{padding: 2px 15px;border-radius: 50px;font-size: 14px;} } /* 于975 */ @media only screen and (max-width: 975px) { /* W四?*/ .Four_screen .unique{justify-content: space-between;} .Four_screen .unique span{display: none;} .Four_screen .unique a{padding: 2px 10px;border-radius: 50px;font-size: 12px;} } /* 于750 */ @media only screen and (max-width: 750px) { /* 标题 */ body .mubanRukou .title_box h3, body .hot_calendar .text_box h3, body .operation_tool_box .content_box .title_box h3, body .livable_products .content_box .title_box h3, body .famous_organization .content_box .title_box h3{ font-size: 20px; } /* 描述 */ body .mubanRukou .title_box h4, body .hot_calendar .text_box div, body .livable_products .content_box .title_box h4, body .famous_organization .content_box .title_box h4, body .operation_tool_box .content_box .title_box h4{ font-size: 17px; padding-top: 0; } /* 标题盒子 */ body .hot_calendar .text_box, body .operation_tool_box .content_box .title_box, body .livable_products .content_box .title_box, body .famous_organization .content_box .title_box{ padding-bottom: 0; margin-bottom: 10px; } body .livable_products .content_box{ transform: scale(1); } body .operation_tool_box .content_box > div{ transform: scale(1); } body .one_banner .content_box ul, body .one_banner .content_box .button_box{ transform: scale(1); } body .famous_organization .swiper_box{ transform: scale(0.9); } body .content_box{ width: 90%; } body .main-wrapper .hero-slider-1{ padding-top: 0 !important; } /* W一?*/ body .one_banner .swiper{ overflow-x: hidden ; } body .one_banner .content_box .button_box h1{ font-size: 1.2em ; margin-bottom: 22px; } body .one_banner .content_box .button_box .spread{ width: 120px; height: 34px; line-height: 34px; margin-top: 12px; font-size: 16px; } body .one_banner .content_box ul li .right .bottom{ padding: 0 16px; line-height: inherit; width: inherit; height: inherit; } body .one_banner .content_box ul{ display: flex; flex-direction: column; position: initial; } body .one_banner .content_box ul li{ width: 100%; height: auto; padding: 16px 10px; margin-top: 20px; margin-right: 0; } body .one_banner .content_box ul li:hover{ margin-top: 20px; } body .one_banner .content_box ul li .right .txt{ font-size: 1.2em; } body .one_banner .swiper-button-left, body .one_banner .swiper-button-right{ display: none ; } body .one_banner .content_box .button_box{ position: initial ; } body .one_banner .mySwiper img{ height: 180px; } /* 热点日历 */ .hot_calendar{ /* display: none; */ } body .hot_calendar, body .mubanRukou{ padding-top: 30px !important; } /* q营工具 */ .operation_tool_box > img{ display: none; } body .operation_tool_box .content_box{ top: 0 !important; } body .operation_tool_box .content_box, body .operation_tool_box .content_box > div{ position: inherit; top: 0; } body .operation_tool_box .list > div{ flex-wrap: wrap; align-content: center; flex-direction: row; justify-content: center; } body .operation_tool_box .list > div > div{ padding: 2px 16px; background-color: #eef4ff; margin-right: 10px; margin-bottom: 10px; font-size: 12px; } body .operation_tool_box .content_box .list_box > div{ margin-bottom: 20px; } body .operation_tool_box .title{ margin-bottom: 20px; } body .operation_tool_box .title span{ margin-left: 6px; font-size: 14px; } body .operation_tool_box .title img{ transform: scale(0.8); } /* 更多好用产品 */ .livable_products > img{ display: none; } body .livable_products .function_box{ padding: 0; /* border-right: 1px solid #f00; */ border-radius: 0; margin-right: 0; } body .livable_products .content_box, body .livable_products .content_box > div{ position: inherit; } body .livable_products .content_box > div{ top: 0 !important; } body .livable_products .function_box .list .logo{ height: 30px; margin-bottom: 20px; padding-bottom: 0; } body .livable_products .function_box .list .logo img{ transform: scale(0.8); } body .livable_products .function_box .list .logo span{ font-size: 14px; } body .livable_products .function_box .list .skip{ width: 120px; height: inherit; line-height: inherit; font-size: 12px; } body .livable_products .content_box .function_max_box{ justify-content: space-evenly; margin-top: 0 !important; transform: scale(1) !important; } body .livable_products .function_box:hover{ box-shadow: inherit; } /* 他们都在?*/ .famous_organization{ /* display: none; */ padding-bottom: 0 !important; margin-top: 0 !important; } .famous_organization .swiper_box{ overflow: hidden; } body #seamless_swiper1, body #seamless_swiper2, body #seamless_swiper3{ margin-bottom: 0 !important; } .famous_organization .content_box > div{ position: inherit !important; top: 0 !important; } /* W六?*/ .Six_screen{padding: 50px 0 35px;} .Six_screen .container{padding: 0;} /* W七?*/ .seven_screen{height: 200px;background-position: unset;display: none;} .seven_screen h4{font-size: 20px;margin: 0;} .seven_screen a{width: 100%;font-size: 18px;height: 45px;line-height: 45px;padding: 0 15px;margin: 15px 0 0;} /* 开始?*/ .fix-btn { display: block; } /* 合作伙伴 */ .eight_screen{min-height: auto;padding: 30px 0;} .eight_screen .bottomBar_name{font-size: 12px;} .eight_screen .SmallTitle{ margin: 15px 0 0; } .eight_screen .SmallTitle div{margin: 0 15px 0 0;font-size: 12px;line-height: 25px;} .eight_screen .bottomBar_name+.bottomBar_name{margin: 0 0 0 10px;} .FirstDisplay {padding-bottom: 50px;} } /* Ҏ围绕效果 */ .surround:before,.surround:after{content:"";display:block;width: 0;height:0;border:1px solid transparent;box-sizing: border-box;position: absolute;border-radius: 2px;} .surround:before{top:0;left:0;transition: border-color 0s ease-in 0.8s,width 0.2s ease-in 0.6s,height 0.2s ease-in 0.4s;} .surround:after{right:0;bottom:0;transition: border-color 0s ease-in 0.4s,width 0.2s ease-in 0.2s,height 0.2s ease-in ;} .surround:hover{color: #FF6644;} .surround:hover:before{width:100%;height:100%;transition:width 0.2s ease-in ,height 0.2s ease-in 0.2s;border-top-color:#FF6644;border-right-color:#FF6644;} .surround:hover:after{width:100%;height:100%;transition: border-color 0s ease-in 0.4s,width 0.2s ease-in 0.4s,height 0.3s ease-in 0.6s;border-bottom-color:#FF6644;border-left-color:#FF6644;} /* 四周扩散效果 */ .spread{position:relative;-webkit-transition: background-color .3s, color .3s;transition: background-color .3s, color .3s;} .spread:before {content: '';position: absolute;top: -15px;left: -15px;bottom: -15px;right: -15px;background: inherit;z-index: -1;opacity: 0.5;-webkit-transform: scale3d(.6, .4, 1);transform: scale3d(.6, .4, 1); display:none\9;} .spread:hover {background:#fa4d26; border-color:#fa4d26;-webkit-transition: background-color .1s .3s, color .1s .3s;transition: background-color .1s .3s, color .1s .3s;-webkit-animation: anim-moema-1 .3s forwards;animation: anim-moema-1 .3s forwards} .spread:hover:before {-webkit-animation: anim-moema-2 .3s .3s forwards;animation: anim-moema-2 .3s .3s forwards;} @-webkit-keyframes anim-moema-1 { 60% {-webkit-transform:scale3d(.8, .8, 1);transform:scale3d(.8, .8, 1)} 85% {-webkit-transform:scale3d(1.1, 1.1, 1);transform:scale3d(1.1, 1.1, 1)} 100% {-webkit-transform:scale3d(1, 1, 1);transform:scale3d(1, 1, 1)} } @keyframes anim-moema-1 { 60% {-webkit-transform:scale3d(.8, .8, 1);transform:scale3d(.8, .8, 1)} 85% {-webkit-transform:scale3d(1.1, 1.1, 1);transform:scale3d(1.1, 1.1, 1)} 100% {-webkit-transform:scale3d(1, 1, 1);transform:scale3d(1, 1, 1)} } @-webkit-keyframes anim-moema-2 { to {opacity:0;-webkit-transform:scale3d(1, 1, 1);transform:scale3d(1, 1, 1)} } @keyframes anim-moema-2 { to {opacity:0;-webkit-transform:scale3d(1, 1, 1);transform:scale3d(1, 1, 1)} } 在线观看免费A∨网站