@charset "utf-8"; /*全局样式*/ body{padding: 0;margin: 0;font-family: 'Microsoft YaHei';font-size: 14px;color: #333;} div,img,ul,li,dl,dt,dd,h1,h2,h3,h4,h5,h6,form,p{padding: 0;margin: 0;border: 0;} ul{list-style: none;} a{text-decoration: none;color: #333;} i,em{font-style: normal;} img{display: inline-block;max-width: 100%;height: auto;} /*去掉 input 默认边框*/ input{padding: 0;border: 0;font-family: 'Microsoft YaHei';font-size: 14px;color: #333;} input[type="submit"]{background-color: transparent;cursor: pointer;} /*去掉 textarea 默认边框*/ textarea{padding: 0;border: 0;font-family: 'Microsoft YaHei';font-size: 14px;color: #333;} /*去掉 button 默认边框*/ button{border: 0;padding: 0;background-color: transparent;font-family: 'Microsoft YaHei';font-size: 14px;color: #333;cursor: pointer;} /*清除浮动*/ .clearfix:after{content: '';display: table;clear: both;} .clearfix{*zoom: 1;/*IE6识别*/} /*解决chrome浏览器 input,textarea 获得焦点时会有一个边框的问题*/ input,textarea{outline: none;} /*清除ios端 input,textarea 默认内阴影 默认圆角,radio和checkbox需要还原值为normal*/ input,textarea{appearance: none;-webkit-appearance: none;border-radius: 0;} /*自定义 input,textarea 的placeholder文字样式*/ input::-webkit-input-placeholder,textarea::-webkit-input-placeholder{color: #999;} /*常用盒模型*/ *{box-sizing: border-box;-webkit-box-sizing: border-box;} /*滚动条*/ body *::-webkit-scrollbar{width: 2px;height: 2px;background: #eee;border-radius: 2px;} body *::-webkit-scrollbar-thumb{background: #009adc;border-radius: 2px;} /*常用宽度*/ .w1500{position: relative;width: 94%;margin: 0 auto;height: 100%;max-width: 1500px;} .w1400{position: relative;width: 94%;margin: 0 auto;height: 100%;max-width: 1400px;} .w1300{position: relative;width: 94%;margin: 0 auto;height: 100%;max-width: 1300px;} .w1280{position: relative;width: 94%;margin: 0 auto;height: 100%;max-width: 1280px;} .w1200{position: relative;width: 94%;margin: 0 auto;height: 100%;max-width: 1200px;} .w1140{position: relative;width: 94%;margin: 0 auto;height: 100%;max-width: 1140px;} .w1100{position: relative;width: 94%;margin: 0 auto;height: 100%;max-width: 1100px;} .w1000{position: relative;width: 94%;margin: 0 auto;height: 100%;max-width: 1000px;} /*常用过渡*/ .tran300{-webkit-transition: 0.3s;-moz-transition: 0.3s;-ms-transition: 0.3s;transition: 0.3s;} .tran400{-webkit-transition: 0.4s;-moz-transition: 0.4s;-ms-transition: 0.4s;transition: 0.4s;} .tran500{-webkit-transition: 0.5s;-moz-transition: 0.5s;-ms-transition: 0.5s;transition: 0.5s;} /*常用浮动*/ .fl{float: left;} .fr{float: right;} /*按钮区通用样式*/ .btns-area{font-size: 0;text-align: center;} .btns-area .btn{display: inline-block;padding: 0 2em;margin: 0 10px;background-color: #fff;border: 1px solid #ddd;border-radius: 4px;font-size: 16px;line-height: 34px;color: #000;cursor: pointer;} .btns-area .btn img{display: inline-block;vertical-align: middle;margin: -3px 6px 0 0;} .btns-area .btn:hover{opacity: .9;} /*自定义单选框input[type="radio"]样式*/ .custom-input label{display: inline-block;cursor: pointer;} .custom-input input[type="radio"]{width: 1px;height: 1px;margin: 0;opacity: 0;} .custom-input input[type="radio"] + em{position: relative;display: inline-block;width: 16px;height: 16px;margin: -2px 4px 0 0;background-color: #fff;border: 1px solid #999;border-radius: 50%;vertical-align: middle;cursor: pointer;} .custom-input input[type="radio"] + em:before{content: '';position: absolute;left: 50%;top: 50%;width: 6px;height: 6px;border-radius: 50%;transform: translate(-50%,-50%);} .custom-input input[type="radio"]:checked + em{background-color: #009adc;border-color: #009adc;} .custom-input input[type="radio"]:checked + em:before{background-color: #fff;} .custom-input input[type="radio"] + em:hover{border-color: #009adc;} /*自定义多选框input[type="checkbox"]样式*/ .custom-input input[type="checkbox"]{width: 1px;height: 1px;margin: 0;opacity: 0;} .custom-input input[type="checkbox"] + em{position: relative;display: inline-block;width: 16px;height: 16px;margin: -2px 4px 0 0;background-color: #fff;border: 1px solid #999;vertical-align: middle;cursor: pointer;} .custom-input input[type="checkbox"] + em:before{content: '';position: absolute;left: 50%;top: 50%;width: 10px;height: 10px;background-image: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTBwdCIgaGVpZ2h0PSIxMHB0IiB2aWV3Qm94PSIwIDAgMTAgMTAiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZmlsbD0iI2ZmZiIgb3BhY2l0eT0iLjg1IiBkPSJNNC4zMSA2Ljc2QzUuNjEgNC4xNCA3LjE3IDEuNTkgOS43Mi4wMUwxMCAzLjN2LjMxQzcuNzcgNS40NSA1Ljk4IDcuNzIgNC4yMyAxMGgtLjE2QzIuODkgOC44MiAxLjg1IDYuOTMgMCA2Ljgydi0uNTNjLjU5LS40MSAxLjc4LTEuMjMgMi4zNy0xLjY0LjY1LjcgMS4yOSAxLjQxIDEuOTQgMi4xMXoiLz48L3N2Zz4=");background-size: 100% 100%;transform: translate(-50%,-50%);} .custom-input input[type="checkbox"]:checked + em{background-color: #009adc;border-color: #009adc;} .custom-input input[type="checkbox"]:checked + em:before{background-color: #009adc;} .custom-input input[type="checkbox"] + em:hover{border-color: #009adc;} /*自定义表单通用样式*/ .custom-form{font-size: 0;} .custom-form .title{margin-bottom: 30px;font-size: 18px;line-height: 20px;} .custom-form .title span{display: inline-block;padding-left: 10px;border-left: 3px solid #ca0000;color: #ca0000;} .custom-form .row{display: inline-block;width: 100%;margin-bottom: 20px;font-size: 14px;} .custom-form .row.w50{width: 50%;} .custom-form .row.w33{width: 33%;} .custom-form .row .name{float: left;width: 5em;padding: 10px 1em 10px 0;line-height: 16px;text-align: right;} .custom-form .row .info-content{margin-left: 5em;} .custom-form input{width: 100%;height: 36px;padding-left: 10px;border: 1px solid #ddd;border-radius: 4px;} .custom-form input:focus{border-color: #0b736d;} .custom-form textarea{width: 100%;height: 200px;border: 1px solid #ddd;padding: 10px;border-radius: 4px;resize: none;} .custom-form textarea:focus{border-color: #0b736d;} .custom-form select{width: 100%;height: 36px;padding-left: 5px;border: 1px solid #ddd;outline: none;} .custom-form select:focus{border-color: #0b736d;} .custom-form .upload-avatar{position: relative;display: block;width: 80px;height: 80px;border-radius: 50%;cursor: pointer;overflow: hidden;} .custom-form .upload-avatar input[type="file"]{display: none;} .custom-form .upload-avatar .avatar{height: 100%;} .custom-form .upload-avatar .avatar img{width: 100%;height: 100%;} .custom-form .upload-avatar .tips{position: absolute;left: 50%;top: 50%;width: 4em;height: 20px;background-color: rgba(0,0,0,.3);text-align: center;line-height: 20px;color: #fff;transform: translate(-50%,-50%);} .custom-form .choice-area{padding: 10px 0;line-height: 16px;} .custom-form .choice-area label{display: inline-block;margin: 0 10px 5px 0;cursor: pointer;} .custom-form .choice-area label span{margin-left: 3px;} .custom-form .yzm-area{position: relative;width: 300px;} .custom-form .yzm-area input[type="text"]{width: 200px;} .custom-form .yzm-area .btn{position: absolute;right: 0;top: 0;width: 100px;height: 100%;} .custom-form .yzm-area .btn img{width: 100%;height: 100%;} .custom-form *::-webkit-input-placeholder{color: #ccc;} /*自定义select*/ .custom-select{position: relative;width: 200px;} .custom-select .name{position: relative;height: 36px;padding-left: 1.5em;background-color: #fff;border: 1px solid #999;color: #333;line-height: 34px;cursor: pointer;} .custom-select .name:after{content: "";position: absolute;right: 10px;top: 50%;width: 8px;height: 8px;border-right: 1px solid #999;border-bottom: 1px solid #999;transform: rotate(45deg) translate(-100%,-10%);} .custom-select .list{display: none;position: absolute;left: 0;width: 100%;background-color: #fff;box-shadow: 0 5px 10px rgba(0,0,0,.2);} .custom-select .list li a{display: block;padding: 10px 0 10px 10px;border: 1px solid #eee;border-bottom: 0;font-size: 12px;line-height: 16px;} .custom-select .list li a:hover{background-color: #009adc;color: #fff;} /*layer弹窗自定义皮肤*/ body .custom-skin .layui-layer-title{background: #009adc;color: #fff;} body .custom-skin .layui-layer-setwin .layui-layer-close1{filter: brightness(100);} body .custom-skin .layui-layer-setwin .layui-layer-close1:hover{opacity: 1;} body .custom-skin .layui-layer-setwin .layui-layer-close2{right: -10px;top: -10px;background-image: none;} body .custom-skin .layui-layer-setwin .layui-layer-close2:after{content: "×";position: absolute;width: 30px;height: 30px;font-size: 24px;text-align: center;line-height: 26px;font-weight: bold;} body .custom-skin .layui-layer-btn .layui-layer-btn0{background-color: #009adc;border-color: #009adc;color: #fff;} body .custom-skin .layui-layer-resize{display: none;} /*百度分享*/ .share-wrap .bdsharebuttonbox{} .share-wrap .bdsharebuttonbox a{width: 50px;height: 50px;margin: 0;border-radius: 4px;overflow: hidden;opacity: 1;background-position: center;background-repeat: no-repeat;background-size: 30px 30px;} .share-wrap .bdsharebuttonbox .bds_weixin{background-image: url();} .share-wrap .bdsharebuttonbox .bds_tsina{background-image: url();} .share-wrap .bdsharebuttonbox .bds_sqq{background-image: url();} .share-wrap .bdsharebuttonbox .bds_more{background-image: url();} .fixed-wrap .bdsharebuttonbox a:hover{filter: brightness(100);opacity: 1;} .bdshare_popup_box{display: none!important;} /*header*/ header{z-index: 3;position: sticky;left: 0;top: 0;width: 100%;height: 80px;background-color: #fff;box-shadow: 0 4px 10px rgba(0,0,0,.1);} /*logo*/ header .logo{position: absolute;left: 0;top: 50%;transform: translateY(-50%);} header .logo img{display: block;max-height: 52px;} /*导航-水平方向*/ header .nav-box-horizontal{position: absolute;right: 0;top: 50%;transform: translateY(-50%);font-size: 0;white-space: nowrap;} header .nav-box-horizontal li{position: relative;display: inline-block;margin: 0 23px;font-size: 16px;line-height: 80px;transition: 0.3s;} header .nav-box-horizontal li:after{content: "";position: absolute;left: 0;bottom: 20px;width: 100%;height: 2px;background-color: #009adc;transform: scaleX(0);transition: 0.3s;} header .nav-box-horizontal li:first-child{margin-left: 0;} header .nav-box-horizontal li:last-child{margin-right: 0;} header .nav-box-horizontal li a{display: block;} header .nav-box-horizontal li.on:after{transform: scaleX(1);} header .nav-box-horizontal li.on a{color: #009adc;} /*banner*/ .banner{position: relative;overflow: hidden;} .banner .swiper-slide{display: block;padding-top: 36.46%;background-position: center;background-size: cover;background-repeat: no-repeat;} .banner .swiper-pagination{z-index: 1;bottom: 7%;font-size: 0;} .banner .swiper-pagination-bullet{width: 8px;height: 8px;background-color: transparent;border: 1px solid #fff;border-radius: 50%;opacity: 1;} .banner .swiper-pagination-bullet-active{position: relative;background-color: #fff;} .banner .swiper-pagination-bullet-active:after{content: "";position: absolute;left: 50%;top: 50%;width: 12px;height: 12px;margin: -7px 0 0 -7px;border: 1px solid #fff;border-radius: 50%;} .banner .btn{z-index: 1;position: absolute;top: 50%;width: 60px;height: 60px;margin-top: -30px;border: 2px solid #fff;border-radius: 50%;cursor: pointer;transition: 0.3s;filter: drop-shadow(2px 2px 4px rgba(0,0,0,.7));} .banner .prev-btn{left: 0;transform: translateX(-100%);} .banner .prev-btn:after{content: "";position: absolute;left: 50%;top: 50%;width: 12px;height: 12px;border-top: 2px solid #fff;border-left: 2px solid #fff;transform: translate(-30%,-50%) rotate(-45deg);} .banner .next-btn{right: 0;transform: translateX(100%);} .banner .next-btn:after{content: "";position: absolute;left: 50%;top: 50%;width: 12px;height: 12px;border-top: 2px solid #fff;border-right: 2px solid #fff;transform: translate(-70%,-50%) rotate(45deg);} .banner .btn:hover{background-color: #009adc;border-color: #009adc;} .banner:hover .prev-btn{transform: translateX(50%);} .banner:hover .next-btn{transform: translateX(-50%);} /*专题页banner*/ .topic-banner{position: relative;padding-top: 35%;} .topic-banner .bg{position: absolute;left: 0;right: 0;top: 0;bottom: 0;background-position: center;background-size: cover;background-repeat: no-repeat;} /*主要内容*/ .better-life-content{overflow-x: hidden;} /*标题*/ .better-life-content .common-title{margin-bottom: 36px;text-align: center;} .better-life-content .common-title .name{position: relative;display: inline-block;padding-left: 28px;font-size: 32px;line-height: 40px;} .better-life-content .common-title .name .icon{position: absolute;left: 0;top: 50%;width: 16px;height: 16px;margin-top: -6px;} /*布局*/ .better-life-content .part{padding: 55px 0 60px;background-position: center;background-size: cover;background-repeat: no-repeat;} .better-life-content .part1{padding: 55px 0 95px;background-image: url(../images/betterlife/better_life_part1_bg.jpg);} .better-life-content .part1 .common-title{position: relative;padding-bottom: 48px;} .better-life-content .part1 .common-title .ani-line{position: absolute;left: 50%;bottom: 0;width: 80px;height: 2px;margin-left: -40px;background-color: #ccebf8;} .better-life-content .part1 .common-title .ani-line:after{content: "";position: absolute;left: 0;bottom: 0;width: 24px;height: 2px;background-color: #009adc;animation: lineMoveLoop 3s ease-in-out infinite;} @keyframes lineMoveLoop{ 50%{left: 100%;transform: translateX(-100%);} 100%{left: 0;transform: translateX(0);} } .better-life-content .part2{background-image: url(../images/betterlife/better_life_part2_bg.jpg);} .better-life-content .part2 .common-title .name{color: #fff;} .better-life-content .part2 .common-title .name .icon{filter: brightness(0) invert(1);} .better-life-content .part3{background-color: #fff;} .better-life-content .part4{background-image: url(../images/betterlife/better_life_part4_bg.jpg);} .better-life-content .part5{background-color: #fff;} /*大会简介*/ .brief-wrap{font-size: 16px;line-height: 32px;color: #666;} .brief-wrap .font-blue{font-size: 24px;color: #009adc;} /*精彩活动*/ .activity-box{position: relative;} .activity-box > .btn{display: none;position: absolute;top: 50%;width: 40px;height: 40px;background-image: url(../images/betterlife/icons_arrowLR_40_blue.png);background-size: auto 40px;background-repeat: no-repeat;cursor: pointer;filter: brightness(0) invert(1);opacity: 1;transform: translateY(-50%);transition: 0.3s;} .activity-box > .prev-btn{left: -70px;background-position: 0 0;} .activity-box > .next-btn{right: -70px;background-position: -40px 0;} .activity-box > .swiper-button-disabled{opacity: .3;} .activity-swiper{position: relative;padding: 0 5px;overflow: hidden;} .activity-swiper .swiper-pagination{display: none;z-index: 1;bottom: 5px;font-size: 0;} .activity-swiper .swiper-pagination-bullet{width: 8px;height: 8px;background-color: transparent;border: 1px solid #fff;border-radius: 50%;opacity: 1;} .activity-swiper .swiper-pagination-bullet-active{position: relative;background-color: #fff;} .activity-swiper .swiper-pagination-bullet-active:after{content: "";position: absolute;left: 50%;top: 50%;width: 12px;height: 12px;margin: -7px 0 0 -7px;border: 1px solid #fff;border-radius: 50%;} .activity-swiper .swiper-slide{position: relative;border: 1px solid #e5e5e5;overflow: hidden;} .activity-swiper .swiper-slide .pic{padding-top: 65%;background-position: center;background-size: cover;background-repeat: no-repeat;} .activity-swiper .swiper-slide .info{padding: 20px;font-size: 15px;color: #fff;} .activity-swiper .swiper-slide .info .tit{position: relative;padding-left: 30px;font-size: 20px;line-height: 24px;} .activity-swiper .swiper-slide .info .tit .icon{position: absolute;left: 0;top: 50%;width: 20px;height: 20px;transform: translateY(-50%);} .activity-swiper .swiper-slide .info .txt{height: 160px;padding: 10px 0;margin: 5px 0 10px 30px;border-bottom: 1px solid rgba(255,255,255,.2);line-height: 28px;} .activity-swiper .swiper-slide .info .txt em{} .activity-swiper .swiper-slide .info .txt span{display: block;margin: -28px 0 0 60px;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;} .activity-swiper .swiper-slide .info .date{position: relative;padding-left: 30px;line-height: 24px;} .activity-swiper .swiper-slide .info .date .icon{position: absolute;left: 0;top: 50%;width: 20px;height: 20px;transform: translateY(-50%);} .activity-swiper .swiper-slide .info .date span{margin-left: 16px;} .activity-swiper .swiper-slide .hidden-wrap{position: absolute;left: 0;top: 100%;width: 100%;height: 100%;padding: 30px;background-color: rgba(0,0,0,.8);color: #fff;transition: 0.5s cubic-bezier(0.090, 0.795, 0.435, 1.160);} .activity-swiper .swiper-slide .hidden-wrap .tit{height: 80px;font-size: 22px;line-height: 40px;display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 2;overflow: hidden;} .activity-swiper .swiper-slide .hidden-wrap .line{width: 90px;height: 1px;margin: 20px 0 30px;background-color: rgba(255,255,255,.5);} .activity-swiper .swiper-slide .hidden-wrap .txt{height: 216px;line-height: 24px;opacity: .8;display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 9;overflow: hidden;} .activity-swiper .swiper-slide .hidden-wrap .btns-area{display: flex;justify-content: space-between;margin-top: 30px;} .activity-swiper .swiper-slide .hidden-wrap .btns-area .btn{width: 47%;padding: 0;margin: 0;background-color: transparent;font-size: 18px;line-height: 48px;border: 1px solid #fff;border-radius: 0;color: #fff;transition: 0.3s;} .activity-swiper .swiper-slide .hidden-wrap .btns-area .btn:hover{background-color: #009adc;border-color: #009adc;opacity: 1;} .activity-swiper .swiper-slide:hover .hidden-wrap{top: 0;} .activity-swiper .swiper-slide:nth-child(2) .hidden-wrap .btns-area{} /*相关资讯*/ .information-swiper{padding: 0 10px 40px;overflow: hidden;} .information-swiper .swiper-slide a{position: relative;display: block;background: url(../images/betterlife/info_default_img.jpg) center no-repeat;background-size: cover;transition: 0.3s;} .information-swiper .swiper-slide .hover-bg{padding-top: 66%;background-position: center;background-size: cover;background-repeat: no-repeat;opacity: 0;transition: 0.5s;} .information-swiper .swiper-slide .info{position: absolute;left: 0;right: 0;top: 0;bottom: 0;padding: 30px;} .information-swiper .swiper-slide .info:after{content: "";position: absolute;left: 0;bottom: 0;width: 100%;height: 2px;background-color: #009adc;} .information-swiper .swiper-slide .info .tit{height: 64px;font-size: 20px;line-height: 32px;color: #333;display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 2;overflow: hidden;transition: 0.3s;} .information-swiper .swiper-slide .info .tit:before{content: "-";margin-right: 8px;} .information-swiper .swiper-slide .info .date{margin-top: 10px;line-height: 20px;color: #666;transition: 0.3s;} .information-swiper .swiper-slide .info .more{position: absolute;left: 30px;bottom: 40px;padding-right: 30px;font-size: 18px;line-height: 20px;color: #666;transition: 0.8s;} .information-swiper .swiper-slide .info .more:after{content: "";position: absolute;right: 0;top: 50%;width: 12px;height: 12px;border-top: 1px solid #666;border-right: 1px solid #666;transform: rotate(45deg) translate(-10%,-50%);transition: 0.3s;} .information-swiper .swiper-pagination{z-index: 1;bottom: 5px;font-size: 0;} .information-swiper .swiper-pagination-bullet{width: 8px;height: 8px;background-color: transparent;border: 1px solid #009adc;border-radius: 50%;opacity: 1;} .information-swiper .swiper-pagination-bullet-active{position: relative;background-color: #009adc;} .information-swiper .swiper-pagination-bullet-active:after{content: "";position: absolute;left: 50%;top: 50%;width: 12px;height: 12px;margin: -7px 0 0 -7px;border: 1px solid #009adc;border-radius: 50%;} .information-swiper .swiper-slide:hover a{box-shadow: 0 4px 10px rgba(0,154,220,.3);} .information-swiper .swiper-slide:hover .hover-bg{opacity: 1;} .information-swiper .swiper-slide:hover .info .tit{color: #fff;} .information-swiper .swiper-slide:hover .info .date{color: #fff;} .information-swiper .swiper-slide:hover .info .more{color: #fff;transform: translateX(10px);} .information-swiper .swiper-slide:hover .info .more:after{border-color: #fff;} /*直播回看*/ .live-replay-box{position: relative;} .live-replay-box > .btn{display: none;position: absolute;top: 50%;width: 40px;height: 40px;background-image: url(../images/betterlife/icons_arrowLR_40_blue.png);background-size: auto 40px;background-repeat: no-repeat;cursor: pointer;filter: grayscale(1);opacity: 1;transform: translateY(-50%);transition: 0.3s;} .live-replay-box > .prev-btn{left: -70px;background-position: 0 0;} .live-replay-box > .next-btn{right: -70px;background-position: -40px 0;} .live-replay-box > .swiper-button-disabled{filter: grayscale(1)!important;opacity: .3;} .live-replay-box > .btn:hover{filter: grayscale(0);} .replay-swiper{padding: 0 5px;overflow: hidden;} .replay-swiper .swiper-slide{position: relative;padding: 10px;background-color: #fff;border: 1px solid #e5e5e5;overflow: hidden;} .replay-swiper .swiper-slide .pic{position: relative;padding-top: 65%;background-position: center;background-size: cover;background-repeat: no-repeat;overflow: hidden;} .replay-swiper .swiper-slide .pic:after{content: "";position: absolute;left: 50%;top: 50%;width: 150%;padding-top: 150%;background-color: rgba(0,0,0,.7);border-radius: 50%;transform: translate(-50%,-50%) scale(0);transition: 0.5s ease-in;} .replay-swiper .swiper-slide .pic .btn{z-index: 1;position: absolute;left: 50%;top: 150%;padding: 0 1.5em;border: 1px solid #fff;font-size: 18px;line-height: 48px;color: #fff;transform: translate(-50%,-50%);transition: 0.3s;} .replay-swiper .swiper-slide .pic .btn:hover{background-color: #009adc;border-color: #009adc;} .replay-swiper .swiper-slide .info{padding: 15px 10px 5px;line-height: 28px;} .replay-swiper .swiper-slide .info .tit{font-size: 16px;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;transition: 0.3s;} .replay-swiper .swiper-slide .info .date{color: #999;} .replay-swiper .swiper-slide .info .date span{margin-left: 10px;} .replay-swiper .swiper-slide:hover .pic:after{transform: translate(-50%,-50%) scale(1);} .replay-swiper .swiper-slide:hover .pic .btn{top: 50%;transition-delay: 0.2s;} .replay-swiper .swiper-slide:hover .info .tit{color: #009adc;} /*解决方案*/ .solution-box{font-size: 0;} .solution-box .item{position: relative;display: inline-block;vertical-align: top;width: 23.4%;margin: 0 .8% 20px;} .solution-box .item .pic{overflow: hidden;} .solution-box .item .pic em{display: block;width: 105%;padding-top: 54%;background-position: center;background-size: cover;background-repeat: no-repeat;transition: 1s;} .solution-box .item .tit{position: absolute;left: 0;bottom: 0;width: 100%;padding: 30px .5em 10px;background-image: linear-gradient(180deg,transparent,rgba(0,0,0,.8) 80%);font-size: 14px;line-height: 24px;color: #fff;transition: 0.3s;} .solution-box .item .tit:after{content: "";position: absolute;left: .5em;bottom: 32px;width: 20px;height: 20px;background: url(../images/icon_more_arrow_50_white.png) center no-repeat;background-size: 100% 100%;transition: 0.5s;} .solution-box .item:hover .pic em{transform: translateX(-4.5%);} .solution-box .item:hover .tit{text-indent: .3em;} .solution-box .item:hover .tit:after{transform: translateX(.3em);} /*footer*/ .footer{} .footer .top{padding: 60px 0;background-color: #f5f5f5;} .footer .bot{padding: 30px 0;background-color: #222;} .footer .row{position: relative;padding: 20px 0;background-color: #57a3d9;} .footer .row:after{content: "";position: absolute;left: 25%;top: 0;width: 550px;height: 94px;background: url(../images/betterlife/footer_line_element.png) center no-repeat;background-size: 100% 100%;} /*底部导航*/ .bottom-nav-wrap{} .bottom-nav-wrap .nav-1st{overflow: hidden;} .bottom-nav-wrap .nav-1st > li{position: relative;float: left;min-height: 310px;padding: 0 38px;border-left: 1px solid #ddd;} .bottom-nav-wrap .nav-1st > li:first-child{padding-left: 0;border-left: 0;} .bottom-nav-wrap .nav-1st > li:last-child{padding-right: 0;} .bottom-nav-wrap .nav-1st > li > a{display: block;margin-bottom: 10px;font-size: 20px;line-height: 30px;font-weight: bold;} .bottom-nav-wrap .nav-1st > li > a:hover{color: #009adc;} .bottom-nav-wrap .nav-2nd{} .bottom-nav-wrap .nav-2nd > li{} .bottom-nav-wrap .nav-2nd > li > a{display: block;font-size: 15px;line-height: 30px;color: #555;} .bottom-nav-wrap .nav-2nd > li > a:hover{color: #009adc;} /*版权*/ .footer .cr{float: left;max-width: 50%;line-height: 20px;color: #ccc;} .footer .cr p{margin-bottom: 20px;} .footer .cr a{color: #ccc;} .footer .cr .icon{vertical-align: middle;margin: -4px 4px 0 0;} .footer .cr a:hover{color: #009adc;} /*其他链接*/ .footer .other-links{float: left;margin: 5px 0 0 40px;font-size: 0;} .footer .other-links a{display: inline-block;padding: 0 10px;border-left: 1px solid #ccc;font-size: 14px;line-height: 10px;color: #ccc;} .footer .other-links a:first-child{padding-left: 0;border-left: 0;} .footer .other-links a:hover{color: #009adc;} .footer .row .other-links{position: absolute;right: 120px;top: 50%;height: 20px;margin: 0;transform: translateY(-50%);} .footer .row .other-links a{position: relative;padding: 0;line-height: 20px;color: #fff;} .footer .row .other-links a:after{content: "";position: absolute;left: 0;bottom: -2px;width: 100%;height: 1px;background-color: #fff;transform: scaleX(0);transition: 0.3s;} .footer .row .other-links a:hover:after{transform: scaleX(1);} /*友情链接*/ .footer .friend-links{position: absolute;right: 0;top: 0;width: 250px;} .footer .friend-links .name{height: 40px;border: 0;border-radius: 20px;line-height: 40px;color: #666;} .footer .friend-links .list{bottom: 40px;border-bottom: 1px solid #eee;} .footer .friend-links .list li a{border-top: 0;border-color: #eee;color: #666;} .footer .friend-links .list li a:hover{background-color: #eee;color: #009adc;} /*底部logo*/ .footer .bottom-logo{float: left;} .footer .bottom-logo img{display: block;width: 140px;} /*分享区*/ .footer .share-wrap{position: absolute;right: 0;top: 50%;font-size: 0;transform: translateY(-50%);} .footer .share-wrap:before{content: "关注我们";position: absolute;left: -3.5em;top: 50%;transform: translateY(-50%);font-size: 14px;line-height: 20px;color: #fff;} .footer .share-wrap > .item{display: inline-block;margin-left: 20px;cursor: pointer;} .footer .share-wrap > .item .icon{width: 24px;height: 24px;} /*微信二维码*/ .footer .weixin-btn{position: relative;} .footer .weixin-btn .hidden-wrap{position: absolute;left: 50%;bottom: 40px;transform: translateX(-50%) scale(0);transform-origin: bottom;transition: 0.3s;} .footer .weixin-btn .hidden-wrap img{max-width: none;width: 100px;height: 100px;} .footer .share-wrap:hover .weixin-btn .hidden-wrap{transform: translateX(-50%) scale(1);} /*返回顶部*/ .back-top{display: none;z-index: 1;position: fixed;right: 0;bottom: 0;width: 50px;height: 50px;background-color: #ddd;border-radius: 4px;cursor: pointer;transition: 0.3s;} .back-top .icon{position: absolute;left: 0;right: 0;top: 0;bottom: 0;width: 40px;height: 40px;margin: auto;} .back-top:hover{background-color: #009adc;} /*会议议程*/ .meeting-tab-box{background-color: #fff;} .meeting-tab-box .tabs{background-image: linear-gradient(90deg,#4f00e0,#07bae1);padding-top: 25px;font-size: 0;text-align: center;overflow: hidden;} .meeting-tab-box .tabs .item{display: inline-block;vertical-align: top;width: 29.33%;padding: 25px 20px;margin: 0 2%;border: 4px solid rgba(255,255,255,0);border-bottom: 0;border-radius: 10px 10px 0 0;font-size: 20px;line-height: 24px;font-weight: bold;color: #fff;cursor: pointer;} .meeting-tab-box .tabs .item img{display: inline-block;vertical-align: top;width: 4em;margin: -0.6em 0 0 0.2em;} .meeting-tab-box .tabs .item.on{border-color: #fff;} .meeting-tab-box .tab-content{margin: 0 30px;overflow: hidden;} .meeting-tab-box .tab-content .swiper-slide{padding: 40px 0;} .meeting-tab-box .tab-content .swiper-slide .record{position: relative;padding-left: 40px;margin-bottom: 20px;font-size: 20px;line-height: 24px;} .meeting-tab-box .tab-content .swiper-slide .record .icon{position: absolute;left: 0;top: 50%;width: 20px;height: 20px;margin-top: -10px;} .meeting-tab-box .tab-content .swiper-slide .record a{text-decoration: underline;color: #0f4996;} /*会议表格*/ .meeting-table{width: 100%;border-collapse: collapse;margin-top: 40px;color: #0f4996;} .meeting-table .title{background-color: #e5f7fd;} .meeting-table th{font-size: 20px;padding: 20px;line-height: 20px;} .meeting-table th:nth-child(2){text-align: left;} .meeting-table td{font-size: 16px;padding: 15px 20px;border-bottom: 1px dashed #0f4996;line-height: 20px;text-align: center;} .meeting-table td:nth-child(2){text-align: left;} .meeting-table .line{height: 3px;background-image: linear-gradient(90deg,#4f00e0,#00ffff 50%);} .meeting-table .line td{padding: 0;border: 0;} /*中屏PC:<=1400px(针对1366*650)*/ @media screen and (max-width: 1400px){ /*常用宽度*/ .w1280{max-width: 1140px;} /*footer*/ .footer .top{padding: 40px 0;} /*底部导航*/ .bottom-nav-wrap .nav-1st > li{padding: 0 25px;} } /*小屏PC:>=1025px && <=1200px*/ @media screen and (max-width: 1200px){ /*常用宽度*/ .w1140{width: 90%;} /*主要内容*/ /*标题*/ .better-life-content .common-title{margin-bottom: 20px;} .better-life-content .common-title .name{padding-left: 20px;font-size: 24px;line-height: 30px;} .better-life-content .common-title .name .icon{width: 12px;height: 12px;margin-top: -5px;} /*布局*/ .better-life-content .part{padding: 40px 0;} .better-life-content .part1{padding: 40px 0 60px;} .better-life-content .part1 .common-title{padding-bottom: 20px;} /*大会简介*/ .brief-wrap .font-blue{font-size: 20px;} /*精彩活动*/ .activity-box > .btn{width: 30px;height: 30px;background-size: auto 30px;} .activity-box > .prev-btn{left: -35px;background-position: 0 0;} .activity-box > .next-btn{right: -35px;background-position: -30px 0;} .activity-swiper .swiper-slide .info{padding: 15px;font-size: 14px;} .activity-swiper .swiper-slide .info .tit{padding-left: 35px;font-size: 16px;} .activity-swiper .swiper-slide .info .tit .icon{width: 20px;height: 20px;} .activity-swiper .swiper-slide .info .txt{margin-left: 35px;} .activity-swiper .swiper-slide .info .txt span{margin: -28px 0 0 80px;} .activity-swiper .swiper-slide .info .date{padding-left: 35px;} .activity-swiper .swiper-slide .info .date .icon{width: 20px;height: 20px;} .activity-swiper .swiper-slide .hidden-wrap{padding: 20px;} .activity-swiper .swiper-slide .hidden-wrap .tit{height: 60px;font-size: 16px;line-height: 30px;} .activity-swiper .swiper-slide .hidden-wrap .line{margin: 10px 0;} .activity-swiper .swiper-slide .hidden-wrap .txt{height: 240px;font-size: 12px;-webkit-line-clamp: 10;} .activity-swiper .swiper-slide .hidden-wrap .btns-area{margin-top: 20px;} .activity-swiper .swiper-slide .hidden-wrap .btns-area .btn{font-size: 14px;line-height: 38px;} /*相关资讯*/ .information-swiper .swiper-slide .info{padding: 15px 20px;} .information-swiper .swiper-slide .info .tit{font-size: 16px;} .information-swiper .swiper-slide .info .more{left: 15px;bottom: 20px;font-size: 14px;} /*直播回看*/ .live-replay-box > .btn{width: 30px;height: 30px;background-size: auto 30px;} .live-replay-box > .prev-btn{left: -35px;background-position: 0 0;} .live-replay-box > .next-btn{right: -35px;background-position: -30px 0;} .replay-swiper .swiper-slide .pic .btn{font-size: 14px;line-height: 38px;} /*解决方案*/ .solution-box .item .tit{font-size: 16px;} /*footer*/ /*底部导航*/ .bottom-nav-wrap .nav-1st > li{padding: 0 22px;} /*版权*/ .footer .cr{max-width: none;} /*其他链接*/ .footer .other-links{float: none;margin: 0;position: absolute;right: 0;top: 70px;} } /*pad横屏:>=769px && <=1024px*/ @media screen and (max-width: 1024px){ /*底部导航*/ .bottom-nav-wrap .nav-1st > li{padding: 0 15px;} } /*phone:<=768px*/ @media screen and (max-width: 768px){ /*常用宽度*/ .w1140{width: 94%;} /*header*/ header{height: 50px;} header .w1140{width: 96%;} /*logo*/ header .logo img{max-height: 24px;} /*导航-水平方向*/ header .nav-box-horizontal li{margin: 0 5px;font-size: 12px;line-height: 50px;} header .nav-box-horizontal li:after{bottom: 10px;} /*header .nav-box-horizontal li:nth-child(n+5){display: none;}*/ header .nav-box-horizontal li:last-child{display: inline-block;} /*banner*/ .banner .swiper-slide{padding-top: 50%;} .banner .swiper-pagination{bottom: 10px;} .banner .btn{display: none;} /*专题页banner*/ .topic-banner{padding-top: 45%;} /*主要内容*/ /*标题*/ .better-life-content .common-title{margin-bottom: 10px;} .better-life-content .common-title .name{font-size: 18px;} /*布局*/ .better-life-content .part{padding: 20px 0;} .better-life-content .part1{padding: 20px 0 30px;} .better-life-content .part1 .common-title{padding-bottom: 10px;} /*大会简介*/ .brief-wrap{font-size: 14px;line-height: 28px;} .brief-wrap .font-blue{font-size: 16px;} /*精彩活动*/ .activity-box > .btn{display: none;} .activity-swiper{padding: 0 5px 30px;} .activity-swiper .swiper-pagination{display: block;} /*相关资讯*/ .information-swiper .swiper-pagination{display: block;} /*直播回看*/ .live-replay-box > .btn{display: none;} /*解决方案*/ .solution-box .item{width: 96%;margin: 0 2% 10px;} .solution-box .item .tit{font-size: 14px;} /*footer*/ .footer .top{display: none;} .footer .bot{padding: 20px 0 30px;text-align: center;} .footer .row{padding: 10px 0;overflow: hidden;} .footer .row:after{left: 16%;transform: scale(.5);transform-origin: left top;} /*版权*/ .footer .cr{float: none;max-width: none;} .footer .cr p{margin-bottom: 5px;} .footer .cr .icon{width: 16px;height: 16px;} /*其他链接*/ .footer .other-links{float: none;margin: 0;position: static;} .footer .row .other-links{right: 0;} /*底部logo*/ .footer .bottom-logo img{width: 60px;} /*分享区*/ .footer .share-wrap{display: none;} /*微信二维码*/ .weixin-btn{display: none;} /*友情链接*/ .footer .friend-links{position: relative;margin: 20px auto 0;} .footer .friend-links .name{text-align: left;} /*返回顶部*/ .back-top{display: none!important;} }