/*
* @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∨网站