@charset "utf-8"; /*==========字体 开始==========*/ /*可替换 开始*/ @font-face{font-family:"ydiconfont";src: format('woff2'), format('woff'), format('truetype')}.ydiconfont{font-family:"ydiconfont"!important;font-size:16px;font-style:normal;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.ydicon-shape4:before{content:"\e630"}.ydicon-shape5:before{content:"\e63c"}.ydicon-shape2:before{content:"\e652"}.ydicon-shape3:before{content:"\e631"}.ydicon-shape6:before{content:"\e649"}.ydicon-shape1:before{content:"\ea6a"}.ydicon-xsj1:before{content:"\e810"}.ydicon-xsj2:before{content:"\e62d"}.ydicon-xsj3:before{content:"\e644"}.ydicon-mulu:before{content:"\e62a"}.ydicon-show1:before{content:"\e629"}.ydicon-dot5:before{content:"\e619"}.ydicon-dot6:before{content:"\e623"}.ydicon-dot1:before{content:"\e618"}.ydicon-dot2:before{content:"\e628"}.ydicon-dot3:before{content:"\e615"}.ydicon-dot4:before{content:"\e616"}.ydicon-wangzhi:before{content:"\e622"}.ydicon-hh3:before{content:"\e69f"}.ydicon-hh:before{content:"\e6e0"}.ydicon-wangwang:before{content:"\e6c4"}.ydicon-wangwang1:before{content:"\e6ad"}.ydicon-hh1:before{content:"\e625"}.ydicon-qr1:before{content:"\e611"}.ydicon-msn:before{content:"\e626"}.ydicon-qr2:before{content:"\e646"}.ydicon-hh2:before{content:"\e663"}.ydicon-qq2:before{content:"\e665"}.ydicon-msn1:before{content:"\e997"}.ydicon-skype:before{content:"\e915"}.ydicon-wx1:before{content:"\e640"}.ydicon-fb1:before{content:"\e613"}.ydicon-qq1:before{content:"\e79d"}.ydicon-phone2:before{content:"\e614"}.ydicon-msn2:before{content:"\e6ba"}.ydicon-gotop1:before{content:"\e67a"}.ydicon-gotop2:before{content:"\e67b"}.ydicon-gotop3:before{content:"\e624"}.ydicon-gotop4:before{content:"\e605"}.ydicon-gotop5:before{content:"\e65a"}.ydicon-gotop6:before{content:"\e67f"}.ydicon-gotop7:before{content:"\e660"}.ydicon-gotop8:before{content:"\e673"}.ydicon-gotop9:before{content:"\e612"}.ydicon-gotop10:before{content:"\e653"}.ydicon-gotop11:before{content:"\e802"}.ydicon-gotop12:before{content:"\e603"}.ydicon-gotop13:before{content:"\e6b4"}.ydicon-gotop14:before{content:"\e63f"}.ydicon-gotop15:before{content:"\e729"}.ydicon-gotop16:before{content:"\e60f"}.ydicon-gotop17:before{content:"\e66f"}.ydicon-gotop18:before{content:"\e604"}.ydicon-gotop19:before{content:"\e627"}.ydicon-gotop20:before{content:"\e703"}.ydicon-gotop21:before{content:"\e62f"}.ydicon-gotop22:before{content:"\e670"}.ydicon-gotop23:before{content:"\e610"}.ydicon-nothing:before{content:"\e64c"}.ydicon-badge-right:before{content:"\e60e"}.ydicon-add1:before{content:"\e620"}.ydicon-add:before{content:"\e728"}.ydicon-yes1:before{content:"\e6a6"}.ydicon-no1:before{content:"\e6a8"}.ydicon-no:before{content:"\e61e"}.ydicon-yes:before{content:"\e60c"}.ydicon-hit1:before{content:"\e62c"}.ydicon-hit:before{content:"\e61a"}.ydicon-address:before{content:"\e609"} .ydicon-search:before{content:"\e60b"}.ydicon-prev:before{content:"\e60a"}.ydicon-next:before{content:"\e602"}.ydicon-youjian:before{content:"\e61b"}.ydicon-lianxiren:before{content:"\e60d"}.ydicon-dianhua:before{content:"\e606"}.ydicon-wb:before{content:"\e651"}.ydicon-wx:before{content:"\e691"}.ydicon-shouji:before{content:"\e63b"}.ydicon-wangzhan:before{content:"\e601"}.ydicon-weixin:before{content:"\e62e"}.ydicon-qq:before{content:"\e683"}.ydicon-youbian:before{content:"\e693"}.ydicon-dianhua1:before{content:"\e607"}.ydicon-fb:before{content:"\e608"}.ydicon-fax-full:before{content:"\e932"}.ydicon-facebook:before{content:"\e711"}.ydicon-right4:before{content:"\e67d"}.ydicon-left4:before{content:"\e67e"}.ydicon-phone:before{content:"\e6c2"}.ydicon-left3:before{content:"\e726"}.ydicon-left1:before{content:"\e621"}.ydicon-right3:before{content:"\e727"}.ydicon-more1:before{content:"\e742"}.ydicon-more:before{content:"\e633"}.ydicon-right1:before{content:"\e62b"}.ydicon-play:before{content:"\e63a"}.ydicon-left:before{content:"\e61c"}.ydicon-right:before{content:"\e61d"}.ydicon-call:before{content:"\e7c0"}.ydicon-home:before{content:"\e617"}.ydicon-contact:before{content:"\e600"}.ydicon-product:before{content:"\e61f"} /*可替换 结束*/ [class*='ydicon-']{ font-family: "ydiconfont" !important; font-style: normal; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .ydicon-play:before { display: inline-block; border-radius: 50%; background: rgba(0,0,0,.5); height: 46px; width: 46px; line-height: 46px; font-size: 22px; color: #fff; text-align: center; } /*==========字体 结束==========*/ /*==========组件公共 开始==========*/ [yd-animation]{ opacity: 0; } .component .yd-table{ margin: 0 auto; } /*隐藏显示 2仅电脑端显示 3仅移动端显示*/ .display3{ display: none; } @media screen and (max-width: 1199px) { .display2{ display: none; } .display3{ display: block; } } /*列表列数（每行个数%）*/ .column1{ width: 100% !important; float: left; } .column2{ width: 50% !important; float: left; } .column3{ width: 33.33333% !important; float: left; } .column4{ width: 25% !important; float: left; } .column5{ width: 20% !important; float: left; } .column6{ width: 16.66666% !important; float: left; } .column7{ width: 14.285% !important; float: left; } .column8{ width: 12.5% !important; float: left; } .column9{ width: 11.11111% !important; float: left; } .column10{ width: 10% !important; float: left; } .component{ width: 100%; position: relative; overflow: hidden; } .component:after{ content: ''; display: block; clear: both; } .component i{ font-style: normal; } .component .tpagepicture img{ display: block; width: 100%; } /*列表每行个数（px）*/ .component .col2{ width: 720px; } .component .col3{ width: 480px; } .component .col4{ width: 360px; } .component .col5{ width: 288px; } .component .col6{ width: 240px; } .component .has-infoscontent0 .infoscontent{ display: none; } .component .show-infotitle0 .infotitle{ display: none; } .component .show-infoscontent0 .infoscontent{ display: none; } .component .show-infotime0 .infotime{ display: none; } .component_title>h2{ font-size: 32px; text-align: center; font-weight: normal; } .component_title>h2.h2_2 { position:relative; padding-bottom:10px; margin-bottom:0px; } .component_title>h2.h2_2:before { content:""; position:absolute; left:50%; bottom:0; width:100px; height:2px; margin-left:-50px; background:#ccc; } .component_title>img { display:block; margin:0 auto; max-width:100%; } .component_title>p{ text-align: center; font-size: 18px; color: #888; padding: 10px 0 20px; } /*公共列表样式（无边白底等）*/ .component .list-style1 a{ background-color: #fff; } .component .list-style1 .infowrap{ padding-left: 10px; padding-right: 10px; } .component .list-style2 a{ background-color: #fff; box-shadow: 0 10px 20px rgba(0,0,0,.15); } .component .list-style2 .infowrap{ padding-left: 10px; padding-right: 10px; } .component .list-style3 a{ background-color: #fff; border: 1px solid #ddd; } .component .list-style3 .infowrap{ padding-left: 10px; padding-right: 10px; } /*是否全屏*/ .full-width0{ max-width: 1440px; margin: 0 auto; } html .component .full-width1{ max-width: 100%; } /*particles-js-canvas-el 背景*/ .particles-js-canvas-el{ position: absolute; top: 0; left: 0; right: 0; bottom: 0; } [yd-particle-in="1"] .particles-js-canvas-el{ z-index: -1; } /*文本排布方式*/ .component .tb_rl{ writing-mode: tb-rl; }/*垂直*/ /*按钮（更多按钮）*/ .component .more_btn span{ display: inline-block; text-align: center; } /*提交按钮*/ .component .submit_button{ cursor: pointer; border: 0; margin: 0; padding: 0; } /*内页侧边栏*/ .sidebar{ overflow: hidden; } .sidebar_title h2 { margin: 12px 0; text-align: left; padding-left: 8px; margin-left: 10px; line-height: 1; border-left: 2px solid #000; font-size:16px; } .sidebar_body { zoom:1; border-top:0; border-bottom: 0px} /*公共*/ .sidelist a{ display: block; } .sidelist li:last-child a{ border-bottom: 0; } /*纯文字列表*/ .text-sidelist{ margin: 0 10px 10px; } .text-sidelist a{ border-bottom: 1px solid #ddd; overflow: hidden; } .text-sidelist a .infotitle{ padding: 10px 0; text-align: left; text-overflow: ellipsis; white-space: nowrap; overflow: hidden; } .text-sidelist a .infopicture{ display: none; } .text-sidelist a .infoprice{ color: red; padding-bottom: 10px; } /*左图右文*/ .thumb-sidelist{ } .thumb-sidelist li{ overflow: hidden; } .thumb-sidelist a{ margin: 0 10px; padding: 10px 0; border-bottom: 1px solid #ddd; overflow: hidden; } .thumb-sidelist a .infopicture{ float: left; width: 90px; margin-right: 8px; } .thumb-sidelist a .infopicture img{ border-radius: 4px; } .thumb-sidelist a .infotitle{ line-height: 1.4em; overflow: hidden; text-align: left; } .thumb-sidelist a .infotime{ font-size: 13px; } .thumb-sidelist a .infoprice{ color: red; } /*上图下文*/ .grid-sidelist{ padding: 0 10px; } .grid-sidelist a{ margin-bottom: 10px; padding-bottom: 10px; border-bottom: 1px solid #ddd; } .grid-sidelist a .infopicture{ width: 100%; margin-right: 10px; } .grid-sidelist a .infotitle{ line-height: 1.5em; padding-top: 5px; } .grid-sidelist a .infoprice{ color: red; } /*内页侧边栏*/ /*按钮*/ input[type="radio"],input[type="checkbox"],select{ -webkit-appearance:auto !important; } /*==========组件公共 结束==========*/ /*==========在线客服 开始==========*/ /*默认蓝色*/ /*.sonlinebox{ overflow: hidden; }*/ .sonlinebox{ z-index: 999999990; } .sonlinebox .contentbox{ border-radius:6px;} .sonlinebox .opentrigger{ width: 50px; height: 50px; line-height: 50px; text-align: center; position:absolute; top:0px; border-radius: 6px; z-index:1; cursor:pointer; background:#2589ff; box-shadow: 0 0 9px 0 rgba(0,0,0,0.1); } .sonlinebox .opentrigger:before{ content: '\e6e0'; font-family: 'ydiconfont'; font-size: 30px; color: #fff; } .sonlinebox1{ width:162px; font-size:12px; top:-600px; z-index:9999;} .sonlinebox1 .titlebox{ width:100%; height:35px; line-height:35px; background:#2589ff; position:relative; z-index:1;} .sonlinebox1 .titlebox span{ margin-left:10px; color:#fff; font-size:14px; font-family:'微软雅黑','黑体';} .sonlinebox1 .contentbox{ display:block; min-width: 160px; width:100%; height:auto; border:2px solid #2589ff; overflow:hidden; background:#fff; position:absolute; z-index:2; } .sonlinebox1 .contentbox .closetrigger{ width:25px; height:25px; text-align: center; line-height: 25px; display:block; cursor:pointer; position:absolute; top:5px;right:5px; z-index:2; } .sonlinebox1 .contentbox .closetrigger:before{ content: '\e61e'; font-family: 'ydiconfont'; font-weight: bold; color: #fff; } .sonlinebox1 .contentbox .closetrigger:hover{-webkit-transform:scale(1) rotate(360deg);} .sonlinebox1 .contentbox .listbox{overflow:hidden; margin:6px 0; position:relative;} .sonlinebox1 .contentbox .listbox .qqlist{ display:block; width:100%; margin:5px auto 5px auto; padding:0px 0;} .sonlinebox1 .contentbox .listbox .qqlist span{ display:block; width:47%; height:25px; overflow:hidden; text-align:right;float:left; line-height:26px; color:#444;} .sonlinebox1 .contentbox .listbox .qqlist div.ico{ width:52%; height:25px; overflow:hidden; float:left;} .sonlinebox1 .contentbox .listbox .qqlist div.ico a{} .sonlinebox1 .contentbox .listbox .qrlist{ margin: 10px 20px; text-align: center; } .sonlinebox1 .contentbox .listbox .qrlist img{ width: 100%; max-width: 130px; margin-bottom: 5px; } .sonlinebox1 .contentbox .listbox .qrlist span{ display: block; color: #515259; } .sonlinebox1 .contentbox .listbox .tellist a{ line-height: 26px; color: #0d84ff; } .sonlinebox1 .contentbox .listbox .linklist{ margin: 5px 10px; color: #0d84ff; } .sonlinebox1 .contentbox .tels{ width:90%; margin:0 auto; border-top:1px dotted #ccc; height:auto; padding-bottom:10px; line-height:200%; text-align:center;} .sonlinebox1 .contentbox .tels font{ display:block; line-height:35px; font-family:'微软雅黑','黑体'; font-size:16px; color:#555;} .sonlinebox1 .contentbox .tels span{ display:block; line-height:25px; font-family:"palatino linotype", "book antiqua"; font-size:20px; color:#555; font-weight:bold;} /*样式2 3*/ .sonlinebox2{ margin-left: 5px; } .sonlinebox2 .titlebox{ display: none; } .sonlinebox2 .contentbox{ position: relative; border: 0 !important; } .sonlinebox2 .contentbox .listbox .item{ position: relative; width: 50px; margin: 10px 0; text-align: center; background:#fff; color: #2589ff; font-size: 25px; border-radius:6px; transition-duration: .2s; box-shadow: 0 0 9px rgba(0,0,0,.1); display: flex; flex-direction: column; align-items: center; justify-content: center; } .sonlinebox2 .contentbox .listbox .item a{ display: block; } .sonlinebox2 .contentbox .listbox .item span.title{ display: none; font-size: 12px; text-align: center; white-space: nowrap; line-height: 1.2em; } .sonlinebox2 .contentbox .listbox .item .float_box{ position: absolute; left: 125%; transform: translatex(30px); top: 0; bottom: 0; margin: auto; font-size: 14px; color: #313233; visibility: hidden; opacity: 0; transition: .5s .1s; } .sonlinebox2 .contentbox .listbox .item .float_box span.triangle{ top: 12px; left: -11px; position: absolute; border-top: 7px solid transparent; border-bottom: 7px solid transparent; border-right: 11px solid #fff; z-index: 1; } .sonlinebox2 .contentbox .listbox .item .float_box.tel{ width: 145px; background-color: #fff; box-shadow: 0 0 9px rgba(0,0,0,.1); border: 1px solid #e4e5e9; height: 36px; line-height: 36px; text-indent: 10px; text-align: left; border-radius: 6px; } .sonlinebox2 .contentbox .listbox .item .float_box.tel span.triangle{ top: 12px !important; } .sonlinebox2 .contentbox .listbox .item .float_box.qr{ bottom: auto; border-radius: 6px; background-color: #fff; padding: 4px; line-height: 1.5em; box-shadow: 0 0 9px rgba(0,0,0,.1); } .sonlinebox2 .contentbox .listbox .item .float_box.qr img{ width: 140px; } .sonlinebox2 .contentbox .listbox .item.footer:before{ content: "···"; } .sonlinebox2 .contentbox .listbox .item:hover{ opacity: .9; } .sonlinebox2 .contentbox .listbox .item:hover .float_box{ transform: translatex(0px); visibility: visible; opacity: 1; } .sonlinebox2 .contentbox .tels{ position: absolute; left: 125%; bottom: 0; transform: translate(30px); background-color: #fff; box-shadow: 0 0 9px rgba(0,0,0,.1); border-radius: 6px; visibility: hidden; opacity: 0; padding: 10px; transition: .5s .1s; } .sonlinebox2 .contentbox .tels.show{ transform: translate(0px); visibility: visible; opacity: 1; } .sonlinebox2 .contentbox .tels:after{ content: ""; bottom: 20px; margin-top: -32px; left: -11px; position: absolute; border-top: 7px solid transparent; border-bottom: 7px solid transparent; border-right: 11px solid #fff; z-index: 1; } .sonlinebox2.positionright{ margin-right: 5px; } .sonlinebox2.positionright .contentbox .listbox .item .float_box{ left: auto; right: 125%; transform: translatex(-30px); } .sonlinebox2.positionright .contentbox .listbox .item .float_box span.triangle{ left: auto; right: -11px; border-left: 11px solid #fff; border-right: 0; } .sonlinebox2.positionright .contentbox .listbox .item:hover .float_box{ transform: translatex(0px); visibility: visible; opacity: 1; } .sonlinebox2.positionright .contentbox .tels{left: auto; right: 125%; transform: translate(-30px); } .sonlinebox2.positionright .contentbox .tels.show{ transform: translate(0px); visibility: visible; opacity: 1; } .sonlinebox2.positionright .contentbox .tels:after{ left: auto; right: -11px; border-left: 11px solid #fff; border-right: 0; } #topcontrol{ z-index: 9999; } @media screen and (max-width: 768px) { /*gotop*/ #topcontrol{ z-index: 9999; } #topcontrol .yd-gotop{ width: 45px !important; height: 45px !important; line-height: 45px !important; } #topcontrol .yd-gotop i{ font-size: 25px !important; } .sonlinebox1 .contentbox{ max-width: 200px; } .sonlinebox2{ width: auto !important; font-size: 12px; } .sonlinebox2 .opentrigger{ width: 45px; height: 45px; line-height: 45px; } .sonlinebox2 .contentbox { width: auto !important; } .sonlinebox2 .contentbox .listbox .item{ width: 45px !important; font-size: 10px; height: 45px !important; } .sonlinebox2 .contentbox .listbox .item span.title{ font-size: 10px; } .sonlinebox2 .contentbox .listbox .item i{ font-size: 22px !important; } .sonlinebox2 .contentbox .listbox .item.footer:before{ font-size: 28px; } } /*==========在线客服 结束==========*/ /*----------下载模型列表组件 开始----------*/ /*公共*/ .downloadlist{ padding: 0 10px; } .downloadlist.has-infoscontent0 .infoscontent{ display: none; } .downloadlist:after{ content: ''; display: block; clear: both; } .downloadlist .infowrap span{ font-size: 13px; color: #888; padding-right: 8px; } .downloadlist .infowrap{ transition-duration: .5s; } .downloadlist .infotitle{ font-size: 16px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; transition-duration: .5s; } .downloadlist .infoscontent{ overflow: hidden; color: #666; margin: 5px 10px; font-size: 13px; line-height: 1.5em; height: 3em; } /*文字列表*/ .text-downloadlist{} .text-downloadlist li{ width: 100% !important; } .text-downloadlist{ padding: 0 10px; } .text-downloadlist li{ overflow: hidden; padding: 15px 0; border-bottom: 1px solid #ddd; transition-duration: .5s; } .text-downloadlist .infowrap{ overflow: hidden; width: 76%; float: left; transition-duration: .5s; } .text-downloadlist .infowrap img{ float: left; width: 32px; margin-right: 10px; } .text-downloadlist .infoscontent{ display: none; } .text-downloadlist .btn{ float: right; transition-duration: .5s; } .text-downloadlist li:hover{ box-shadow: 0 0 30px rgba(0,0,0,.1); } .text-downloadlist li:hover .infowrap{ transform: translatex(10px); } .text-downloadlist li:hover .btn{ transform: translatex(-10px); } /*左图右文*/ .thumb-downloadlist{} .thumb-downloadlist li:after{ content: ''; display: block; clear: both; } .thumb-downloadlist li{ padding: 20px 10px; border-bottom: 1px solid #ddd; transition-duration: .5s; box-sizing: border-box; } .thumb-downloadlist .infowrap{ display: block; overflow: hidden; float: left; width: 80%; transition-duration: .5s; background: #fff; } .thumb-downloadlist .infopicture{ float: left; width: 110px; margin-right: 10px; } .thumb-downloadlist .infoscontent{ height: 1.5em; } .thumb-downloadlist .btn{ margin-top: 20px; float: right; transition-duration: .5s; } .thumb-downloadlist li:hover{ box-shadow: 0 0 30px rgba(0,0,0,.1); } .thumb-downloadlist li:hover .infowrap{ transform: translatex(10px); } .thumb-downloadlist li:hover .btn{ transform: translatex(-10px); } /*上图下文*/ .grid-downloadlist{ } .grid-downloadlist li{ position: relative; float: left; width: 33.3333%; } .grid-downloadlist .infowrap{ display: block; margin: 0 10px 20px; border: 1px solid #ddd; background: #fff; } .grid-downloadlist .infotitle{ padding: 5px 10px 0; font-size: 18px; } .grid-downloadlist .infowrap p{ margin-bottom: 50px; } .grid-downloadlist .infowrap p span{ display: inline-block; } .grid-downloadlist .btn{ position: absolute; bottom: 30px; right: 20px; } .grid-downloadlist li:hover .infowrap{ box-shadow: 0 8px 38px rgba(0,0,0,.1); } /*----------下载模型列表组件 结束----------*/ /*===招聘频道 开始===*/ /* 表单风格 */ .job{ } .joblist { } .joblist li {overflow: hidden; background: #fff; margin-bottom: 20px; } table.job_table { margin:8px 0px; padding:0px; text-align:center; width:100%; border-collapse:collapse;} table.job_table td{ padding:8px 5px; border:1px solid #dadbd6;} table.job_table .requirement{ text-align:left; padding:8px 5px; line-height:1.5em;} table.job_table th{color:#333; font-weight:bold; text-align:center; border:1px solid #dadbd6;} table.job_table .t1 { font-weight:bold;padding:5px 0;width:20%;} table.job_table .t2 { text-align:left;width:25%;} table.job_table .t3 {font-weight:bold;width:25%;} table.job_table .t4 {text-align:left;width:25%;} table.job_table .operation{text-align:center; margin:0 auto;} /* 简约风格 */ .text-joblist li{ padding: 20px 0; border-bottom: 1px solid #eee; background: #fff; margin-bottom: 20px; transition-duration: .5s; } .text-joblist li:last-child{ border-bottom: 0; } .text-joblist .jobname{ overflow: hidden; } .text-joblist .jobname h2{ float: left; font-size: 24px; } .text-joblist .jobname .salary{ float: right; font-weight: bold; font-size: 20px; color: #ff6000; } .text-joblist .requirementdetail{ padding: 15px 0; } .text-joblist .requirementdetail span{ padding-left: 8px; margin-left: 8px; border-left: 1px solid #ddd; display: inline-block; margin: 5px 0; } .text-joblist .requirementdetail span:first-child{ padding-left: 0; margin-left: 0; border: 0; } .text-joblist .requirement{ line-height: 1.8em; color: #555; } .text-joblist .operation{ margin-top: 15px; } .text-joblist li:hover{ box-shadow: 0 10px 35px rgba(0,0,0,.1); padding: 20px; } /*应聘*/ table.resume_table { text-align:center; width:100%; max-width: 900px; margin: 0 auto; border-collapse:collapse; } table.resume_table th{ font-weight:bold; text-align:left; width:100px;} table.resume_table td{text-align:left; } table.resume_table .operation{text-align:center; } table.resume_table #detail{ height:200px;} /*===招聘频道 结束===*/ /*==========头部组件 开始==========*/ /*头部组件0*/ .floor_head0_main{ overflow: visible; position: relative; z-index: 1; } .floor_head0_main.nottop{ z-index: 2003; } .floor_head0_shade2,.floor_head0.navigation-style2{ position: absolute; top: 0; left: 0; right: 0; z-index: 98; } .floor_head0_main.nottop .floor_head0{ position: fixed; top: 0; left: 0; right: 0; z-index: 99; box-shadow: 0 5px 10px rgba(0,0,0,.1); transition-duration: .8s; } .floor_head0 .member .membergroupname,.head0 .member .membername{color:#f30} .head0{ max-width: 1440px; margin: 0 auto; } .head0:after{ content: ''; display: block; clear: both; } .head0 .logo{ float:left;} .head0 .logo img{ height:55px; display:block;} .head0 .description{ float: left; position: relative; } .head0 .description .description_text{ display: inline-block; position: relative; top: 0; left: 0; z-index: 1; } .head0 .description .description_picture{ position: absolute; top: 0; left: 0; } .head0 .description .description_picture img{ display: block; } .head0 .navigation { text-align: right; line-height: .85em; } .head0 .navigation i{ position: absolute; left: 0; bottom: 0; height: 3px; transition-duration: .5s; z-index: 1; } .head0 .navigation ul.navigationlist{ display: inline-block; position: relative; } .head0 .navigation ul.navigationlist li { float:left; text-align:center; line-height: 55px; position: relative; z-index: 2; cursor: pointer; } .head0 .navigation ul.navigationlist li a { display:block; padding:0 16px; font-weight:normal; color:#616266; border:0px dashed red;} .head0 .navigation ul.subnavigationlist{ display:none; position:absolute; background:#fff; box-shadow: 0 0 10px 0 rgba(0,0,0,.1); z-index:100} .head0 .navigation ul.subnavigationlist li { float:none; padding:0px; display:inline; } .head0 .navigation ul.subnavigationlist li a { display:block; white-space:nowrap; font-weight:normal; color:#444; line-height:45px; min-width: 140px; text-align:left} .head0 .navigation ul.subnavigationlist li a:hover { box-shadow: 0 0 10px 0 rgba(0,0,0,.1); } .head0 .navigation .separator img{ vertical-align: middle; } .head0 .navigation ul.subnavigationlist.style2{ white-space: nowrap; line-height: 1; } .head0 .navigation ul.subnavigationlist.style2 li{ display: inline-block; } .head0 .navigation ul.subnavigationlist.style2 li a{ width: auto; padding: 0 15px; } .head0 .user { float: right; line-height:55px; } .head0 .user .mobileedition{ font-weight: bold; color:red; } .head0 .user a { color:#666; } .head0 .member { float: right; } .head0 .member a{ display: inline-block; } .head0 .language { float: left; padding: 0 15px; } .head0 .language a{ display: inline-block; width: 35px; height: 35px; line-height: 35px; text-align: center; color: #fff; } /*头部组件1*/ .head1{ max-width: 1440px; position: relative; margin: 0 auto; overflow: hidden; } .head1 .logo{ float:left;} .head1 .logo img{ height:55px; display:block;} .head1 .slot{ overflow: hidden; } .head1 .slot1{ float:right; overflow:hidden; } .head1 .slot2{ float:left; overflow:hidden; } .head1 .user { float: right; line-height:55px; } .head1 .user .mobileedition{ font-weight: bold; color:red; } .head1 .user a { color:#666; } .head1 .member { float: right; } .head1 .member a{ display: inline-block; } .head1 .language { float: left; padding: 0 15px; } .head1 .language a{ display: inline-block; width: 35px; height: 35px; line-height: 35px; text-align: center; color: #fff; } /*头部组件1的兼容样式*/ .head1 .extra{ position: absolute; left: 0; top: 0; } .head1 .extra .extra_text{ position: relative; top: 0; left: 0; z-index: 2; } .head1 .extra .extra_picture{ position: absolute; top: 0; left: 0; z-index: 1; } .head1 .extra .extra_picture img{ display: block; } /*头部组件2*/ .floor_head2_main{ overflow: visible; position: relative; z-index: 1; } .floor_head2_main.istop{ z-index: 2003; } .floor_head2_main.istop .floor_head2{ position: fixed; left: 0; top: 0; right: 0; z-index: 99; box-shadow: 0 10px 15px rgba(0,0,0,.1); transition-duration: .5s; } .head2{ max-width: 1440px; position: relative; margin: 0 auto; } .head2:after{ content: ''; display: block; clear: both; } .head2 .navigation { line-height: .85em; } .head2 .navigation i{ position: absolute; left: 0; bottom: 0; height: 3px; transition-duration: .5s; } .head2 .navigation ul.navigationlist{ display: inline-block; position: relative; } .head2 .navigation ul.navigationlist li { float:left; text-align:center; line-height: 65px; position: relative; z-index: 1; cursor: pointer; } .head2 .navigation ul.navigationlist li a { display:block; padding:0 16px; font-weight:normal; color:#616266; border:0px dashed red;} .head2 .navigation ul.subnavigationlist{ display:none; position:absolute; background:#fff; box-shadow: 0 0 10px 0 rgba(0,0,0,.1); z-index:100} .head2 .navigation ul.subnavigationlist li { float:none; padding:0px; display:inline; } .head2 .navigation ul.subnavigationlist li a { display:block; white-space:nowrap; font-weight:normal; color:#444; line-height:45px; width: 140px; text-align:left} .head2 .navigation ul.subnavigationlist li a:hover { box-shadow: 0 0 10px 0 rgba(0,0,0,.1); } .head2 .navigation ul.subnavigationlist.style2{ white-space: nowrap; line-height: 1; } .head2 .navigation ul.subnavigationlist.style2 li{ display: inline-block; } .head2 .navigation ul.subnavigationlist.style2 li a{ width: auto; padding: 0 15px; } .head2 .slot1{ float: left; } .head2 .slot2{ float: right; } /*头部组件2的兼容样式*/ .head2 .extra{ position: absolute; left: 0; top: 0; } .head2 .extra .extra_text{ position: relative; top: 0; left: 0; z-index: 2; } .head2 .extra .extra_picture{ position: absolute; top: 0; left: 0; z-index: 1; } .head2 .extra .extra_picture img{ display: block; height: 100%; } /*头部组件3*/ .floor_head3_main{ overflow: visible; position: relative; z-index: 93 } .floor_head3{ max-width: 1440px; margin: 0 auto; } .floor_head3:after{ content: ""; display: block; clear: both; } .floor_head3 .left_wrap{ float: left; } .floor_head3 .right_wrap{ float: right; } .floor_head3 .right_wrap li{ float: left; position: relative; cursor: pointer; padding-left: 5px; font-size: 0; } .floor_head3 .right_wrap li.n1{ padding-left: 0!important; } .floor_head3 .right_wrap li .picture{ display: inline-block; vertical-align: middle; margin-right: 5px; } .floor_head3 .right_wrap li .title{ display: inline-block; vertical-align: middle; } .floor_head3 .right_wrap li .subpicture{ display: none; position: absolute; left: 50%; top: 105%; box-shadow: 0 0 10px rgba(0,0,0,.1); padding: 5px; border-radius: 3px; background: #fff; } .floor_head3 .right_wrap li .subpicture:after{ content: ""; position: absolute; top: -10px; left: 50%; margin-left: -5px; border-left: 10px solid transparent; border-right: 10px solid transparent; border-bottom: 10px solid #fff; } .floor_head3 .right_wrap li .subpicture img{ display: block; } .floor_head3 .right_wrap li:hover .subpicture{ display: block; } /*==========头部组件 结束==========*/ /*==========幻灯片组件 开始==========*/ /* 幻灯片组件0 */ .floor_banner0 { position:relative; z-index: 0; } .banner0 li{ position: relative; display: flex; height: 100%; align-items: center; justify-content: center; overflow: hidden; } .banner0 li img{ display:block; width: 100%; } .banner0 li .bannertext{ position: absolute; height: 80px; line-height: 40px; max-width: 1440px; left: 0; right: 0; top: 50%; margin: -40px auto 0; text-align: center; color: #444; cursor: pointer; z-index: 99; } .banner0 li .bannertext .bannername{ font-size: 36px; opacity: 0; transform: translatey(50px); transition-duration: 1s; transition-delay: 1s; } .banner0 li .bannertext .bannerdescription{ font-size: 20px; opacity: 0; transform: translatey(80px); transition-duration: 1.5s; transition-delay: 1.2s; } /*内页频道代表图*/ .banner_img img{ width: 100%; display: block; } .floor_channel15 .thechannel { position:relative; } .floor_channel15 .thechannel .thechannelcontent { position:absolute; top:0; bottom:0; left:0; right:0; margin:auto; width:1440px; max-width:100%; padding:0 10px; box-sizing:border-box; overflow:hidden; } /*圆形焦点*/ .floor_banner0 .banner_dotcircle .swiper-pagination-switch{ border-radius: 6px; width: 6px; height: 6px; background: #fff; } .floor_banner0 .banner_dotcircle .swiper-active-switch{ width: 16px; } /*长方形焦点*/ .floor_banner0 .banner_dotsquare .swiper-pagination-switch{ border-radius: 0; height: 2px; background: #fff; } .floor_banner0 .banner_dotsquare .swiper-active-switch{ transform: scale(1,2); } /*文本动画*/ .banner0 li.swiper-slide-active .bannertext .bannername{ opacity: 1; transform: translatey(0); } .banner0 li.swiper-slide-active .bannertext .bannerdescription{ opacity: 1; transform: translatey(0); } /* 带有视频的幻灯片组件1 */ /*幻灯片*/ .floor_banner1{position: relative; overflow: hidden;} .bannerbox{overflow: hidden; width: 100%; height: 100vh; z-index: 9;} .bannerbox img{ display:block; width: 100%; } .bannerbox .bannermask{position: absolute; left: 0; top: 0; right: 0; bottom: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.4);} .bannerbox .swiper-wrapper{height: 100%;} .bannerbox .swiper-slide {background-position: center; background-size: cover; position: relative;} .bannerbox .swiper-slide .lbt-bg { display: block; width: 100%; height: 100%; background-size: cover!important; } .bannerbox .bannertext{text-align: center; max-width: 1440px; color: #ffffff; position: absolute; z-index: 5; left: 0; right: 0; top: 50%; margin: 0 auto;} .bannerbox .bannertext .detail{max-width: 40%; display: flex; justify-content: space-around; margin: 0 auto; margin-top: 60px;} .bannerbox .bannertext .detail li{letter-spacing: 2px; transition: all 0.5s;} .bannerbox .bannertext .bannername{ font-size: 48px; opacity: 0; transform: translatey(50px); transition-duration: 1s; transition-delay: 1s; } .bannerbox .bannertext .bannerdescription{ font-size: 28px; opacity: 0; transform: translatey(80px); transition-duration: 1.5s; transition-delay: 1.2s; } /*圆形焦点*/ .floor_banner1 .banner_dotcircle .swiper-pagination-switch{ border-radius: 6px; width: 6px; height: 6px; background: #fff; } .floor_banner1 .banner_dotcircle .swiper-active-switch{ width: 16px; } /*长方形焦点*/ .floor_banner1 .banner_dotsquare .swiper-pagination-switch{ border-radius: 0; height: 2px; background: #fff; } .floor_banner1 .banner_dotsquare .swiper-active-switch{ transform: scale(1,2); } /* 幻灯片视频 */ .bannerbox .videobox{width: 100%; object-fit: fill;-webkit-object-fit: fill;} .bannerbox .videobox {position: absolute; left: 0; top: 0; margin: auto;} .bannerbox .video-mask {position: absolute; left: 0; top: 0; right: 0; bottom: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.4);} /*向上滑动查看更多*/ .fixed-down {position: fixed; z-index: 99; width: 200px; height: 112px; margin: 0 auto; left: 0; right: 0; bottom: 50px; animation: tiaodong 3s linear 0s infinite;} .fixed-down .tit {text-align: center; font-size: 20px; line-height: 1; color: #ffffff;} .fixed-down .d-arr {display: block; width: 25px; height: 69px; margin: 20px auto 0; background: no-repeat center center; background-size: cover;} /* 向下滑动跳动 */ @-webkit-keyframes tiaodong{ 0%{transform: translatey(-10px);} 25%{transform: translatey(0);} 66%{transform: translatey(10px);} 100%{transform: translatey(0);} } @keyframes tiaodong { 0%{transform: translatey(0);} 25%{transform: translatey(-10px);} 50%{transform: translatey(0);} 75%{transform: translatey(10px);} 100%{transform: translatey(0);} } /*==========幻灯片组件 结束==========*/ /*==========单页扩展模型 开始==========*/ /*单页扩展组件0*/ .floor_page0{ position: relative; } .floor_page0 .bgpicture{ width: 100%; display: block; } .floor_page0 .channelwrap{ max-width: 1440px; box-sizing: border-box; padding: 0 10px; position: absolute; left: 0; right: 0; top: 50%; transform: translatey(-50%); margin: -25px auto 0; } .floor_page0 .channelwrap .channelscontent{ max-width: 450px; font-size: 32px; color: #333; text-shadow: 0 2px 5px rgba(0,0,0,.3); } .floor_page0 .channelwrap .channelcontent{ position:relative; z-index:2; max-width: 450px; padding: 15px; box-shadow: 0 0 10px 0 rgba(0,0,0,.1); } .floor_page0 .channelwrap .channelcontent p{ line-height: 2.5em; color: #666; text-align: justify; overflow: hidden; text-indent:2em; } .floor_page0 .channelwrap .channelcontent i{ position:absolute; left:0; top:0; width:100%; height:100%; z-index:-1; } /*单页扩展组件1*/ .page1{ overflow: hidden; } .page1 .bgpicture{ width: 50%; height: 600px; float: left; background-size: cover; background-position: center; } .page1 .channelwrap{ position: relative; width: 50%; height: 600px; float: left; } .page1 .channelname{ position: relative; padding: 155px 50px 20px 50px; margin-bottom: 20px; color: #ff6600; font-size: 26px; } .page1 .channelname:after{ content: ''; position: absolute; left: 50px; bottom: 0; width: 80px; height: 1px; background: #ff6600; } .page1 .channelscontent{ color: #fff; max-width: 600px; padding: 0 50px; line-height: 2.0em; } .page1 a{ display: inline-block; margin: 0 50px; margin-top: 20px; } .thumbright-page1 .bgpicture{ float: right; } .thumbright-page1{ text-align: right; } .thumbright-page1 .channelname:after{ left: auto; right: 50px; } .thumbright-page1 .channelscontent{ margin-left: auto; } /*单页扩展组件2*/ .floor_page2{ max-width: 1100px; margin:0 auto; padding: 100px 170px; } .page2 .tpagepicture{ position: relative; width:450px; float:right; margin-left: 50px; } .page2 .tpagepicture i{ position: absolute; left: 0; right: 0; top: 0; bottom: 0; width: 46px; height: 46px; cursor: pointer; margin: auto; transition-duration: .5s; } .page2 .tpagepicture i:hover{ transform: scale(1.05); } .page2 .channelname{ font-size: 30px; margin-bottom: 50px; overflow: hidden; } .page2 .channelscontent{ color: #999; line-height: 2.0em; overflow: hidden; } /*.floor_page2{ max-width: 1360px; margin:0 auto; box-sizing:content-box; } .floor_page2 .component_body { padding:5% 10%; } .page2 .channelname{ font-size: 30px; margin-bottom: 50px; } .page2 .channelscontent{ color: #999; line-height: 2.0em; }*/ .page2 a{ display: inline-block; margin-top: 50px; transition-duration: .5s; } .page2 .albumlist{ overflow: hidden; margin-top: 50px; } .page2 .albumlist li{ width: 25%; float: left; } .page2 .albumlist li .albumtitle{ font-size: 40px; } .page2 .albumlist li .albumtitle span{ font-size: 14px; color: #999; } .page2 .albumlist li .albumdescription{ font-weight: bold; } .page2 a:hover{ color: #fff; border-color: transparent; } /*单页扩展组件3*/ .floor_page3{ max-width: 1440px; margin:0 auto; padding:50px; box-sizing:border-box; } .page3{ overflow:hidden; } .page3 .tpagepicture{ position: relative; width:500px; float: left; margin-right: 50px; } .page3 .tpagepicture i{ position: absolute; left: 0; right: 0; top: 0; bottom: 0; width: 46px; height: 46px; cursor: pointer; margin: auto; transition-duration: .5s; } .page3 .tpagepicture i:hover{ transform: scale(1.05); } .page3 .channelwrap{ overflow: hidden; } .page3 .channelname{ font-size: 32px; } .page3 .channelcontent{ margin-top: 40px; line-height: 1.8em; } .page3 a{ display: inline-block; margin-top: 40px; padding:0; } .thumbright-page3 .tpagepicture{ float: right; margin-left: 50px; margin-right: 0; } .page3 a:hover{ color: #fff; border-color: transparent; } /*单页扩展组件4*/ .floor_page4{ max-width: 1440px; margin:0 auto; padding:50px; box-sizing:border-box; } .page4{ padding:0px; overflow: hidden; } .page4 .channelname{ text-align: center; font-size: 30px; } .page4 .channelscontent{ text-align: center; color: #888; font-size: 18px; padding: 15px 0; } .page4 .albumlist{ float: left; overflow: hidden; } .page4 .albumlist li{ overflow: hidden; padding:40px 0 0; } .page4 .albumlist li .albumtitle{ font-size: 20px; margin-bottom: 8px; } .page4 .albumlist li .albumdescription{ color: #999; line-height: 1.5em; } .page4 .albumlist li .albumpicture{ float: left; width: 75px; height: 75px; border-radius: 50%; color: #fff; text-align: center; line-height: 75px; font-size: 30px; margin-right: 15px; background: red; } .page4 .albumlist li.n1 .albumpicture{ background: #008287; } .page4 .albumlist li.n2 .albumpicture{ background: #6ce26c; } .page4 .albumlist li.n3 .albumpicture{ background: #bd362f; } .page4 .tpagepicture{ position: relative; width: 40%; float: right; margin-left:50px; margin-top:40px; } .page4 .tpagepicture i{ position: absolute; left: 0; right: 0; top: 0; bottom: 0; width: 46px; height: 46px; cursor: pointer; margin: auto; transition-duration: .5s; } .page4 .tpagepicture i:hover{ transform: scale(1.05); } .thumbleft-page4 .albumlist{ float: right; width:calc(55% - 50px); } .thumbleft-page4 .tpagepicture{ float: left; margin-left: 0; margin-right: 50px; } /*单页扩展组件5*/ .floor_page5{ max-width: 1440px; margin:0 auto; padding:50px; box-sizing:border-box; } .page5{ position: relative; padding:20px 0 0; overflow: hidden; } .page5 .channelname{ text-align: center; font-size: 30px; } .page5 .channelscontent{ text-align: center; color: #888; font-size: 18px; padding: 15px 0; } .page5 .albumlist{ float: right; width: 55%; margin: 160px 0 150px; background: #fff; position: relative; z-index: 2; } .page5 .albumlist li{ padding: 20px 80px; overflow: hidden; } .page5 .albumlist li.themecolorbg{ color: #fff; } .page5 .albumlist li .albumpicture{ float: left; margin-right: 20px; } .page5 .albumlist li .albumtitle{ font-size: 20px; } .page5 .albumlist li .albumdescription{ color: #999; line-height: 1.5em; } .page5 .albumlist li.themecolorbg .albumdescription{ color: #fff; line-height: 1.5em; } .page5 .tpagepicture{ width: 53%; position: absolute; bottom:50px; left:0; height: 550px; overflow: hidden; z-index: 1; } .page5 .tpagepicture img{ height: 100%; width: auto; } .page5:after{ content: ''; position: absolute; bottom:10px; left: 0; right: 0; margin: auto; width: 250px; height: 630px; border: 2px solid red; } /*单页扩展组件6*/ .floor_page6{ max-width: 1440px; margin:0 auto; padding:50px; box-sizing:border-box; } .page6{ padding:0; overflow: hidden; } .page6 .channelname{ text-align: center; font-size: 30px; } .page6 .channelscontent{ text-align: center; color: #888; font-size: 18px; padding: 15px 0; } .page6 .albumlist{ position: relative; overflow: hidden; } .page6 .albumlist li{ position: relative; width: 34%; padding: 20px; margin: 50px 0; } .page6 .albumlist li .albumtitle{ font-size: 20px; margin-bottom: 5px; } .page6 .albumlist li .albumpicture{ font-size: 70px; line-height: 1; } .page6 .albumlist li .albumdescription{ color: #999; } .page6 .albumlist li i{ position: absolute; height: 1px; width: 100px; top: 50%; } .page6 .albumlist li.m0{ float: left; text-align: right; } .page6 .albumlist li.m0 .albumpicture{ float: right; margin-left: 15px; } .page6 .albumlist li.m0 i{ right: -100px; } .page6 .albumlist li.m1{ float: right; } .page6 .albumlist li.m1 .albumpicture{ float: left; margin-right: 15px; } .page6 .albumlist li.m1 i{ left: -100px; } .page6 .tcentertext{ color: #fff; position: absolute; top: 0; right: 0; bottom: 0; left: 0; margin: auto; width: 200px; height: 200px; text-align: center; line-height: 200px; transform: rotate(45deg); } .page6 .tcentertext span{ position: absolute; top: 0; right: 0; bottom: 0; left: 0; margin: auto; width: 5em; text-align: center; height: 2em; line-height: 2em; font-size: 24px; transform: rotate(-45deg); } /*单页扩展组件7*/ .floor_page7{ max-width: 1440px; margin:0 auto; box-sizing:border-box; } .page7{ overflow: hidden; } .page7 .channelname{ text-align: center; font-size: 30px; color: #fff; } .page7 .channelscontent{ text-align: center; color: #888; font-size: 18px; padding: 15px 0; } .page7 .albumlist{ overflow: hidden; color: #fff; padding:0px 0; } .page7 .albumlist li{ width: 33.3333%; float: left; text-align: center; } .page7 .albumlist li .albumtitle{ font-size: 18px; } .page7 .albumlist li i{ display: block; width: 40px; height: 2px; background: #fff; margin: 20px auto; } .page7 .albumlist li .albumdescription{ width:80%; margin: 0 auto; } /*单页组件8*/ .floor_page8 { max-width:1440px; text-align:center; margin:0 auto; padding:0; box-sizing:border-box; overflow:hidden; } .page8 { position:relative; color:#fff; } .page8_albumlist { } .page8_albumlist li img { display:block; margin:0 auto; max-width:100%; } .page8 .prevnext { position:absolute; top:50%; width:40px; height:40px; line-height:40px; border-radius:3px; margin-top:-20px; cursor:pointer; } .page8 .prevnext:hover{ opacity: .85 } .page8 .prevnext.prev { right:50%; margin-right:540px; } .page8 .prevnext.next { left:50%; margin-left:540px; } .page8 .channelwrap { position:absolute; width:500px; height:376px; top:50%; margin-top:-188px; overflow:hidden; } .page8 .channelwrap_right { left:50%; text-align:left; } .page8 .channelwrap_left { right:50%; text-align:right; } .page8 .channelwrap h2 { font-size:36px; line-height:1.5em; text-transform:uppercase; } .page8 .channelwrap .channelname { font-size:22px; line-height:1.5em; font-weight:bold; } .page8 .channelwrap .channelcontent { font-size:14px; line-height:2.5em; word-wrap:break-word; } .page8 .channelwrap .channelcontent img { display:none; } /*单页组件9*/ .floor_page9 { max-width:1440px; margin:0 auto; padding:0 50px; box-sizing:border-box;} .page9 { float:right; width:500px; height:420px; background:#fff; opacity:0.8; margin:0; padding:60px 60px 0px; box-sizing:border-box; } .left-page9 { float:left; } .page9 .channelname a { font-size:30px; color:#464545; font-weight:bold; } .page9 .channelscontent { display:block; line-height:60px; font-weight:bold; color:#c9151e; font-size:22px;} .page9 span { display:block; background-color:#d7d7d7; width:80px; height:2px; margin:10px 0;} .page9 .page9_more { display:block; margin-top: 15px; } /*单页扩展组件10*/ .floor_page10{ max-width: 1440px; margin: 0 auto; padding:0; box-sizing:border-box; } .page10 .tpagepicture{ width: 200px; float: left; } .page10 .albumlist{ padding: 108px 50px; overflow: hidden; } .page10 .albumlist li{ width: 25%; float: left; text-align: center; color: #fff; } .page10 .albumlist li span{ display: inline-block; vertical-align: top; } .page10 .albumlist li span.albumtitle{ font-size: 48px; } .thumbright-page10 .tpagepicture{ float: right; } /*单页组件11*/ .floor_page11 { max-width:1440px; margin:0 auto; padding:50px; box-sizing:border-box; } .page11 { } .page11_albumlist { } .page11_albumlist li { } .page11_albumlist li:first-child { margin-top:0px !important; } .page11_albumlist li .albumpicture { float:left; width:50%; margin-right:5%; margin-left:0; position:relative; } .page11_albumlist li .albumpicture img { width:100%; display:block; } .page11_albumlist li .albumpicture .num { position:absolute; top:-30px; right:50px; background:#fa0000; font-size:48px; padding:10px 0; width:80px; text-align:center; text-indent:0; color:#ffffff; } .page11_albumlist li.m0 .albumpicture { float:right; margin-left:5%; margin-right:0; } .page11_albumlist li .albumtitle { padding:2% 0; font-size:30px; } .page11_albumlist li.m0 { text-indent:10px; } .page11_albumlist li .albumdescription { font-size:16px; color:#666; line-height:1.8em; } /*单页组件12*/ .floor_page12 { max-width:1440px; margin:0 auto; padding:0 50px; box-sizing:border-box; overflow:hidden; } .page12 { } .page12_left { float:left; width:48%; } .page12_left h4 { font-size:36px; line-height:64px; font-weight:normal; position:relative; } .page12_left h4:before { content:""; position:absolute; left:0; bottom:0; width:10%; height:1px; background:#fff; } .page12_left p { font-size:16px; line-height:1.8; margin-top:20px; } .page12_right { float:right; width:42%; text-align:center; } .page12_right img { float:right; width:120px; display:block; margin-left:20px; } .page12_right h4 { font-size:30px; line-height:50px; } .page12_right h4 span { font-size:40px; margin-right:10px; line-height:50px; vertical-align:bottom; font-weight:normal; } .page12_more { display:inline-block; margin-top:20px; } /*单页组件13*/ .floor_page13 { max-width:1440px; margin:0 auto; padding:50px; box-sizing:border-box; overflow:hidden; } .page13_albumlist:after{ content:''; display: block; clear: both; } .page13_albumlist li { float:left; width:33.33%; margin-top:20px; text-align:center; } .page13_albumlist li .albumwrap { width:92%; margin:0 8% 0 0; padding:30px 0 40px; position:relative; z-index:5; } .page13_albumlist li .albumwrap .albumback { position:absolute; left:0; top:0; width:100%; height:100%; opacity:0.8; z-index:-1; } .page13_albumlist li.m1 .albumwrap { margin:0 4% 0 4%; } .page13_albumlist li.m2 .albumwrap { margin:0 0 0 8%; } .page13_albumlist li .albumwrap div { opacity:1; } .page13_albumlist li .albumpicture { border-radius:50%; overflow:hidden; width:120px; height:120px; margin:0 auto; } .page13_albumlist li .albumpicture img { width:80px; padding:20px 0 0; } .page13_albumlist li .albumtitle { font-size:20px; margin:20px; } .page13_albumlist li .albumdescription { font-size:14px; line-height:1.8; margin:0 10%; } .inoutside-page13 .page13_albumlist li { margin-top:60px; } .inoutside-page13 .page13_albumlist li .albumpicture { margin-top:-90px; border:5px solid #fff; } .inoutside-page13 .page13_albumlist li .albumtitle { margin-top:30px; } /*单页组件14*/ .floor_page14 { max-width:1440px; margin:0 auto; padding:50px; box-sizing:border-box; overflow: hidden; } .floor_page14 .component_body{ overflow: hidden; } .floor_page14 .tpagepicture{ position: relative; } .floor_page14 .tpagepicture.float_left{ margin-right: 20px; } .floor_page14 .tpagepicture.float_right{ margin-left: 20px; } .floor_page14 .tpagepicture img{ display: block; width: 100%; } .floor_page14 .tpagepicture i{ position: absolute; top: 0; bottom: 0; left: 0; right: 0; margin: auto; width: 46px; height: 46px; cursor: pointer; transition-duration: .2s; } .floor_page14 .tpagepicture i:hover{ transform: scale(1.1); } .floor_page14 .channelname, .floor_page14 .channelscontent, .floor_page14 .countlist, .floor_page14 .swiperlist li, .floor_page14 .swiperlist{ overflow: hidden; } .floor_page14 .channelscontent{ padding-top: 10px; } .floor_page14 .countlist{ display: flex; justify-content: space-around; } .floor_page14 .swiperlist{ padding: 15px 0; } .floor_page14 .swiperlist .picture{ float: left; margin: 0 15px; } .floor_page14 .swiperlist .title{ padding-bottom: 10px; } .floor_page14 .pagination{ position: absolute; right: 10px; top: 10px; } .floor_page14 .swiper-pagination-switch{ width: 8px; } /*单页组件15*/ .floor_page15{ max-width: 1440px; margin: 0 auto; } .page15{ overflow: hidden; } .page15_tabbar{ overflow: hidden; padding: 0 60px; } .page15_tabbar li{ position: relative; float: left; padding: 30px 0; width: 25%; text-align: center; } .page15_tabbar li.on:after{ content: ''; width: 20px; height: 20px; transform: rotate(45deg); position: absolute; bottom: -10px; left: 0; right: 0; margin: auto; } .page15_tabbar li img{ display: block; margin: 0 auto; width: 50px; height: 50px; margin-bottom: 15px; cursor: pointer; filter: grayscale(100%); } .page15_tabbar li.on img{ filter: grayscale(0); } .page15_tabbar li .channelname{ cursor: pointer; } .page15_channellist .float_left{ width: 60%; box-sizing: border-box; padding-right: 100px; padding-left: 30px; } .page15_channellist .float_right{ width: 40%; } .page15_channellist .channelname{ font-size: 22px; margin-top: 50px; } .page15_channellist .channelscontent{ margin: 15px 0; font-size: 16px; line-height: 1.8em; color: #999; } .page15_channellist a{ display: inline-block; margin-bottom: 15px; } .page15_channellist .channelpicture img{ display: block; width: 100%; } /*单页扩展组件3*/ .floor_page17{ max-width:1440px; margin:0 auto; box-sizing:border-box; overflow:hidden; } .floor_page17.yes-page17 { box-shadow:0 0 20px #ccc; padding:50px; } .floor_page17 .component_body { } .page17 { text-align:left; margin:0 auto; } .page17 .page17_floor { writing-mode:vertical-lr; margin:0 auto; float:left; } .page17 .tpagebtnhref{ display:block; writing-mode:vertical-lr; text-align:right; } .page17 .tpagebtn { border:2px solid #bbb; padding:5px; margin:0 0 0 20%; display:inline-block; } .page17 .tpagebtn .btn { background:#aaa; color:#fff; font-size:20px; padding:10px 6px 5px; letter-spacing:5px; border-radius:0; } .page17 .small_img { display:none; } .page17 img { max-width:100%; } .page17 .channelwrap { writing-mode:vertical-lr; } .page17 .channelwrap .title { writing-mode:vertical-lr; } .page17 .channelwrap .subtitle { writing-mode:vertical-lr; } .page17 .channelwrap img { margin:0 10%; } .page17 .channelwrap .thecontent { writing-mode:vertical-lr; } .page17.rl-page17 .page17_floor { writing-mode:tb-rl; float:right; } .page17.rl-page17 .tpagebtnhref { writing-mode:tb-rl; } .page17.rl-page17 .tpagebtn { margin:0 20% 0 0; } .page17.rl-page17 .channelwrap { writing-mode:tb-rl; } .page17.rl-page17 .channelwrap .title { writing-mode:tb-rl; } .page17.rl-page17 .channelwrap .subtitle { writing-mode:tb-rl; } .page17.rl-page17 .channelwrap .thecontent { writing-mode:tb-rl; } /*单页扩展组件18*/ .floor_page18 { position: relative; } .floor_page18 .bgpicture { width: 100%; display: block; } .floor_page18 .channelwrap { max-width: 1440px; box-sizing: border-box; padding: 0 10px; position: absolute; left: 0; right: 0; top: 50%; transform: translatey(-50%); margin: -25px auto 0; } .floor_page18 .channelwrap .title { } .floor_page18 .channelwrap .subtitle{ } .floor_page18 .channelwrap .thecontent { } .floor_page18 .channelwrap .inline_block { display:inline-block; } /*单页组件20*/ .floor_page20 { max-width:1440px; margin:0 auto; box-sizing:border-box; overflow: hidden; } .floor_page20 .component_title{ float:left; position: relative; } .floor_page20 .component_title p{ padding: 10px 10px 20px 15px; max-height:4em; overflow: hidden; } .floor_page20 .component_title h2{ position: relative; padding-bottom:14px; text-align: left; padding-left: 15px; } .floor_page20 .component_title h2.h2_2:before{ content: ""; position: absolute; left:0; bottom:-2px; width: 100px; height: 2px; margin-left:0; background: #ccc; } .floor_page20 .component_title .content{ display: none; max-height:3.2em; overflow: hidden; } .floor_page20 .component_body{ overflow: hidden; float: right; } .floor_page20 .tpagepicture{ position: relative; } .floor_page20 .tpagepicture.float_left{ margin-right: 20px; } .floor_page20 .tpagepicture.float_right{ margin-left: 20px; } .floor_page20 .tpagepicture img{ display: block; width: 100%; height: 100%; object-fit: cover; } .floor_page20 .tpagepicture i{ position: absolute; top: 0; bottom: 0; left: 0; right: 0; margin: auto; width: 46px; height: 46px; cursor: pointer; transition-duration: .2s; } .floor_page20 .tpagepicture i:hover{ transform: scale(1.1); } .floor_page20 .channelscontent{ padding-top: 10px; } .floor_page20 .content_top{ padding-bottom: 20px; box-sizing:border-box; } .floor_page20 .countlist{ display: flex; justify-content: space-around; } .floor_page20 .countlist li{ border-left:1px solid #f5e8e9; padding-left: 15px; } .floor_page20 .countlist li:first-child{ border: none; } .floor_page20 .countlist li img{ width:90px; } .floor_page20 .countlist li .title{ display: flex; align-items: center; padding-top:18px; padding-bottom: 10px; } .floor_page20 .countlist li i{ font-size: 20px; } .floor_page20 .countlist li span{ display: block; width: 26px; height: 26px; margin-left:5px; background: #9a1e23; border-radius: 50%; font-weight: normal; line-height: 26px; font-size: 14px; color: #fff; text-align: center; } .floor_page20 .datalist{ width: 100%; display: flex; } .floor_page20 .datalist li{ width: 50%; display: flex; align-items: center; justify-content: center; } .floor_page20 .datalist li a{ text-align: left; padding:30px; flex: 1; } .floor_page20 .datalist li img{ margin-bottom:15px; } .floor_page20 .datalist li .title{ margin-bottom:8px; } .floor_page20 .datalist li .description{ margin-bottom:18px; } .floor_page20 .datalist li .ydfont{ color:#fff; } .floor_page20 .detail{ padding:30px 15px 20px 30px; box-sizing: border-box; } .floor_page20 .detail .title{ margin-bottom: 18px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; } .floor_page20 .detail .content{ overflow: hidden; max-height: 5em; } .floor_page20 .detail .more{ display: block; margin-top:35px; height: 48px; overflow: hidden; padding-bottom: 5px;} .floor_page20 .detail .more a{ display: block; width: 176px; height: 48px; text-align: center; position: relative; overflow: hidden; border: 2px solid rgba(255, 255, 255, 0.5); line-height:46px; font-size: 16px; padding-left:30px; border-radius:48px; box-sizing: border-box; background: calc(50% - 34px) center no-repeat; background-size: 20px; color: #fff;} .floor_page20 .detail .more span{ display:block; height: 100%; line-height:1em; display:flex; align-items:center; left:38px; position:relative; top:0; transition: all 0.3s linear;} .floor_page20 .detail .more:hover span { top: -100%; } /*==========单页扩展模型 结束==========*/ /*==========文章扩展模型 开始==========*/ /*文章扩展组件0*/ .floor_article0{ max-width: 1440px; margin: 0 auto; } .article0{ } .article0:after{ content: ''; display: block; clear: both; } .article0 a{ display: block; overflow: hidden; } .text-article0{} .text-article0 li{ width: 100% !important; } .text-article0 a{ overflow: hidden; padding: 0; } .text-article0 a .infotitle{ float: left; font-size: 16px; } .text-article0 a .titleicon{ vertical-align: middle; } .text-article0 a .infotime{ float: right; } .text-article0 .infopicture,.text-article0 .infoscontent{ display: none; } .thumb-article0{} .thumb-article0 a{ position: relative; padding: 15px; margin: 8px; transition-duration: .5s; } .thumb-article0 .infopicture{ float: left; width: 35%; } .thumb-article0 .infowrap{ overflow: hidden; } .thumb-article0 .infotitle{ font-size: 18px; font-weight: bold; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .thumb-article0.has-infoscontent0 .infotitle{ white-space: normal; } .thumb-article0 .infoscontent{ overflow: hidden; color: #666; max-height: 3.2em; line-height: 1.6em; } .thumb-article0 .infotime{ font-size: 24px; overflow: hidden; } .thumb-article0 li a:hover{ transform: translatey(-5px); box-shadow: 0 8px 35px rgba(0, 0, 0, .08); } .thumbright-article0{} .thumbright-article0 a{ position: relative; padding: 15px; margin: 8px; transition-duration: .5s; } .thumbright-article0 .infopicture{ float: right; width: 35%; } .thumbright-article0 .infowrap{ overflow: hidden; } .thumbright-article0 .infotitle{ font-size: 18px; font-weight: bold; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .thumbright-article0 .infoscontent{ overflow: hidden; color: #666; max-height: 3.2em; line-height: 1.6em; } .thumbright-article0 .infotime{ font-size: 24px; overflow: hidden; } .thumbright-article0 li:hover{ box-shadow: 0 8px 35px rgba(0, 0, 0, .08); } .thumbright-article0 li a:hover{ transform: translatex(15px); } .grid-article0 li{ width: 25%; float: left; } .grid-article0 li a{ margin: 0 10px 20px; } .grid-article0 li .infopicture{ overflow: hidden; } .grid-article0 li img{ transition-duration: .5s; } .grid-article0 li .infotitle{ font-size: 16px; text-align: left; color: #333; margin: 10px 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; transition-duration: .5s; } .grid-article0 li .infoscontent{ font-size: 13px; margin: 10px 0 0; color: #999; height: 3.6em; line-height: 1.8em; overflow: hidden; } .grid-article0 li .infotime{ position: relative; font-size: 18px; color: #888; font-weight: bold; margin: 10px 0; padding-top: 10px; border-top: 1px solid #ddd; transition-duration: .5s; } .grid-article0 li .infotime:after{ content: ""; position: absolute; left: 0; width: 0px; top: -1px; height: 1px; transition-duration: .5s; transform-origin: 0 0; } .grid-article0 li:hover .infotime:after{ width: 100%; } .grid-article0 li:hover img{ transform: scale(1.1); } .article0 li.listyle2 a { background:#fff; } .article0 li.listyle2 a .infowrap { padding:0 10px; } /* 内页组件2318 */ .text-article18 li:hover img,.thumb-article18 li:hover img,.thumbright-article18 li:hover img{ transform: scale(1.1); } .text-article18 li.third .infopicture{display: none;} .thumb-article18 li.third .infopicture{float: left;} .thumbright-article18 li.third .infopicture{float: right;} .article18 li .infotitle,.article18 li .infotime{transition:all 0.6s;} .article18 li .infopicture{overflow: hidden; position: relative;} .article18 li i{position: absolute; width: 50px; height: 50px; top: 0; left: 0; bottom: 0; right: 0; margin: auto; cursor: pointer; transition-duration: .5s;} .article18 li img{transition: all 0.6s; vertical-align: middle;} /* first */ .article18 li.first{overflow: hidden; float: left; width: 44%; height: 468px;} .article18 li.first .infopicture{overflow: hidden; width: 100%; height: 340px;} .article18 li.first .infopicture img, .article18 li.second .infopicture img{width: 100%; height: 100%; object-fit: cover;} /* second */ .article18 li.second{overflow: hidden; float: right; width: 54%; height: 223px;} .article18 li.second .infopicture{float: left; overflow: hidden; width: 45%; height: 223px;} .article18 li.second .infowrap{overflow: hidden; width: 54%; float: right; box-sizing: border-box; -webkit-box-sizing: border-box;} /* third */ .article18 li.third{overflow: hidden; float: left; width: 100%;} .article18 li.third a{display: block; position: relative;} .article18 li.third .infopicture{overflow: hidden;} .article18 li.third .infowrap{overflow: hidden; box-sizing: border-box; -webkit-box-sizing: border-box;} .lm{overflow: hidden; display: -webkit-box; text-overflow: ellipsis; -webkit-box-orient: vertical;} .lm1{ -webkit-line-clamp: 1;}.lm2{ -webkit-line-clamp: 2;}.lm3{ -webkit-line-clamp: 3;}.lm4{ -webkit-line-clamp: 4;}.lm5{ -webkit-line-clamp: 5;} /* 内页组件2319 */ .channellist19 li{width: 100%; box-sizing: border-box; overflow: hidden;} .channellist19 li a{display: flex;} .channellist19 li:nth-child(even) a{flex-direction: row-reverse;} .channellist19 li .content_box{ overflow: hidden; float: left; margin-right: 6%;} .channellist19 li .image_box{ overflow: hidden; float: left; position: relative;} .channellist19 li:nth-child(even) .content_box{margin-left: 6%; margin-right: 0%;} .channellist19 li .image_box img{width: 100%; transition: all 0.6s; vertical-align: middle;} .channellist19 li .content_box .content{margin-top: 50px; margin-bottom: 15px; /*overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical;*/} .content_box .title{margin: 0px; margin-top: 20px; transition: all 0.6s;} .content_box .title::before,.content_box .title::after{content: ""; width: 52px; height: 1px; background-color: #4a4a4a; display: block; margin-left: 58%; transform: rotate(135deg); margin-bottom: 20px;} .content_box .title::before{margin-left: 55%; margin-bottom: 30px;} .content_box .title::after{margin-left: 40%; margin-top: 35px;} .channellist19 li:hover .image_box img{transform: scale(1.1); filter:opacity(0.6);} /* 内页组件2320 */ .list20{overflow: hidden;} .list20 li{display: flex; justify-content: space-between;} .thumbright-list20 li{flex-direction: row-reverse;} .thumbright-list20 li .infowrap{left: 0;} .thumb-list20 li{flex-direction: unset;} .list20 li a{display: block; position: relative;} .list20 li i{position: absolute; width: 50px; height: 50px; top: 0; left: 0; bottom: 0; right: 0; margin: auto; cursor: pointer; transition-duration: .5s;} .list20 li .infowrap{box-sizing: border-box; position: absolute; right: 0; top: 50%; transform: translatey(-50%);} .list20 li .infowrap .infotitle{transition: all 0.6s;} .list20 li .infopicture{overflow: hidden;} .list20 li .infopicture img{width: 100%; height: 100%; object-fit: cover; vertical-align: middle; transition: all 0.6s;} .list20 li:hover .infopicture img{transform: scale(1.1);} .list20 li .infowrap .infomore{margin-top: 20px; display: block; height: 40px; line-height: 40px; overflow: hidden;} .list20 li .infowrap .infomore{display: block; transition: all 0.6s linear; overflow: hidden; -webkit-transition: all 0.3s linear; -moz-transition: all 0.3s linear; -ms-transition: all 0.3s linear; transition: all 0.3s linear;} .list20 li .infowrap .infomore span {display: block; position: relative; top: 0; -webkit-transition: all 0.3s linear; -moz-transition: all 0.3s linear; -ms-transition: all 0.3s linear; transition: all 0.3s linear;} .list20 li .infomore:hover span{top: -100%;} /* 内页组件2321 */ .list21 li{width: 100%; display: flex; justify-content: space-between; box-sizing: border-box;} .list21 li .infopicture{position: relative;} .list21 li i{position: absolute; width: 50px; height: 50px; top: 0; left: 0; bottom: 0; right: 0; margin: auto; cursor: pointer; transition-duration: .5s;} .list21 li .infopicture img{width: 100%; height: 100%; object-fit: cover; vertical-align: middle;} .list21 li .infowrap{flex: 1; box-sizing:border-box;} .list21 li .infowrap.is-not-padding{padding-right: 0 !important;} .list21 li .infoscontent{display: flex; align-items: center;} .list21 li .ydinfotime{display: none; padding: 5px 0;} .list21 li .infotime{ transition: all 0.6s linear; overflow: hidden; display: flex; justify-content: center; align-items: center; flex-direction: column; width: 109px; height: 109px; text-align: center;} .list21 li .infotime span.y-m{font-size: .5em;} .list21 li .infopicture img,.list21 li .infotitle,.list21 li .infomore{transition: all 0.5s} .list21 li:hover .infotitle {text-indent: 6px;} .list21 li:hover .infopicture img{transform: scale(1.1);} .list21 li .infowrap .infomore{display: block; height: 40px; line-height: 40px;} .list21 li .infowrap .infomore{display: block; transition: all 0.6s linear; overflow: hidden; -webkit-transition: all 0.3s linear; -moz-transition: all 0.3s linear; -ms-transition: all 0.3s linear; transition: all 0.3s linear;} .list21 li .infowrap .infomore span {display: block; position: relative; top: 0; -webkit-transition: all 0.3s linear; -moz-transition: all 0.3s linear; -ms-transition: all 0.3s linear; transition: all 0.3s linear;} .list21 li .infomore:hover span{top: -100%;} /*文章扩展组件1*/ .floor_article1{ max-width: 1440px; margin: 0 auto; } .article1 li{ overflow: hidden; } .article1 li img{ transition-duration: .5s; } .article1 .infopicture{ overflow: hidden; height: 228px; position:relative; } .article1 .infopicture .x_line { position:absolute; top:auto; bottom:auto; left:50%; margin-left:-15px; width:30px; height:30px; font-size:30px; z-index:3; color:#fff; } .article1 .infopicture .x_line1 { display:none; bottom:-9px; transform:rotate(-90deg); } .article1 .infopicture .x_line2 { display:block; top:-9px; transform:rotate(90deg); } .article1 li.m1 .infopicture .x_line1 { display:block; } .article1 li.m1 .infopicture .x_line2 { display:none; } .article1 .infowrap{ padding: 20px; } .article1 .infotime{ position: relative; font-size: 18px; color: #666; font-weight: 100; transition-duration: .2s; } .article1 .infotime span{ position: absolute; right: -60px; width: 30px; height: 30px; border: 1px solid #aaa; color: #666; line-height: 30px; text-align: center; transition-duration: .5s; } .article1 .infotitle{ margin-top: 21px; font-size: 16px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; transition-duration: .3s; } .article1 .infoscontent{ line-height: 1.8em; margin-top: 21px; height: 7.2em; overflow: hidden; color: #666; transition-duration: .5s; } .floor_article1 .pagination{ padding: 20px 0 0; text-align: center; display:none; } .floor_article1.floor_article1_swiper .pagination { display:block; } .floor_article1 .pagination span{ display: inline-block; width: 40px; height: 40px; margin: 0 20px; border: 1px solid #aaa; cursor: pointer; font-size: 20px; color: #aaa; line-height: 40px; text-align: center; } .floor_article1 .pagination span:hover{ box-shadow: 0 0 10px rgba(0,0,0,.2) inset; } .floor_article1 .pagination span:active{ box-shadow: 0 0 20px rgba(0,0,0,.3) inset; } .article1 li:hover img{ transform: scale(1.1); } .article1 li:hover .infotime{ transform: translatex(10px); } .article1 li:hover .infotime span{ right: 10px; } .article1 li:hover .infotitle{ transform: translatex(10px); } .article1 li:hover .infoscontent{ transform: translatex(10px); } /*文章扩展组件2*/ .floor_article2{ max-width: 1440px; margin: 0 auto; } .article2:after{ content: ''; display: block; clear: both; } .article2 a{ position: relative; display: block; padding: 15px; } .article2 .infotime{ position: absolute; left: 15px; top: 15px; bottom: 15px; margin: auto; width: 70px; height: 70px; z-index: 1; } .article2 .infotime span{ display: block; text-align: center; } .article2 .infotime span.d{ font-size: 1em; padding-top: 5px; } .article2 .infotime span.y-m{ font-size: .5em; } .article2 .infowrap{ padding: 20px 20px 20px 55px; margin-left: 35px; background: #fff; transition-duration: .5s; } .article2 .infowrap .infotitle{ font-size: 18px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; transition-duration: .5s; } .article2 .infowrap .infoscontent{ line-height: 1.6em; margin-top: 5px; height: 4.8em; overflow: hidden; color: #888; } .article2 a:hover .infowrap{ box-shadow: 0 5px 20px rgba(0,0,0,.2); } /*文章扩展组件3*/ .floor_article3{ max-width: 1440px; margin: 0 auto; } .article3{ overflow: hidden; padding: 5px 0; } .article3 li a{ position: relative; display: block; margin: 5px; } .article3 li img{ transition-duration: .5s; } .article3 .infopicture{ overflow: hidden; background: #000; } .article3 .infowrap{ position: absolute; top: 10px; left: 10px; right: 10px; } .article3 .infotime{ position: relative; font-size: 18px; color: #666; font-weight: 100; transition-duration: .2s; } .article3 .infotime span{ position: absolute; right: -60px; width: 30px; height: 30px; border: 1px solid #aaa; color: #666; line-height: 30px; text-align: center; transition-duration: .5s; } .article3 .infotitle{ font-size: 18px; font-weight: bold; color: #fff; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; transition-duration: .3s; } .article3 i{ display: block; width: 50px; margin: 10px 0; height: 2px; background: #fff; transition-duration: .3s; } .article3 .infoscontent{ line-height: 1.8em; padding-right: 10px; height: 3.6em; overflow: hidden; color: #fff; opacity: 0; transform: translatex(100px); transition-duration: .5s; } .floor_article3 .pagination{ padding-top: 20px; text-align: center; } .floor_article3 .pagination span{ display: inline-block; width: 40px; height: 40px; margin: 0 20px; border: 1px solid #fff; cursor: pointer; font-size: 20px; color: #fff; line-height: 40px; text-align: center; } .floor_article3 .pagination span:hover{ box-shadow: 0 0 10px rgba(0,0,0,.2) inset; } .floor_article3 .pagination span:active{ box-shadow: 0 0 20px rgba(0,0,0,.3) inset; } .article3 li:hover img{ transform: scale(1.1); opacity: .5; } .article3 li:hover .infotime{ transform: translatex(10px); } .article3 li:hover .infotime span{ right: 10px; } .article3 li:hover .infotitle{ transform: translatex(10px); } .article3 li:hover i{ width: 90%; transform: translatex(10px); } .article3 li:hover .infoscontent{ transform: translatex(10px); opacity: 1; } /*文章扩展组件4*/ .floor_article4{ max-width: 1440px; margin: 0 auto; padding: 0 10px; } .article4{ overflow: hidden; position: relative; } .article4_1.float_left{ margin-right: 15px; } .article4_1.float_right{ margin-left: 15px; } .article4_1 .infopicture{ position: relative; overflow: hidden; height: 416px; } .article4_1 .infopicture img{ transition-duration: .5s; height:100%; } .article4_1 .infotitle{ position: absolute; color: #fff; width: 75%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; background-color: rgba(0,0,0,.5); left: 0; bottom: 0; padding: 0 15px; padding-right: 300px; text-align: left; line-height: 45px; transition-duration: .5s; } .article4_1 .pagination{ position: absolute; right: 10px; bottom: 15px; z-index: 1; transition-duration: .5s; } .article4_1 .pagination .swiper-pagination-switch{ width: 8px; } .article4_2{ overflow: hidden; } .article4_2 li{ transition-duration: .5s; margin-top: 10px; background: #fff; padding: 8px 10px; overflow: hidden; } .article4_2 .infopicture{ height: 100%; display: block; float: left; margin-right: 10px; } .article4_2 a{ display: block; overflow: hidden; } .article4_2 li.n1{ margin-top: 0; } .article4_2 .infotitle{ font-size: 18px; padding: 2px 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; transition-duration: .5s; } .article4_2 .infotime{ padding: 2px 0; } .article4_2 .infoscontent{ color: #999; margin: 2px 0; line-height: 1.6em; height: 3.2em; overflow: hidden; } .article4_1:hover img{ transform: scale(1.1); } .article4_1:hover .infotitle{ background: rgba(0,0,0,.5); line-height: 70px !important; } .article4_1:hover .pagination{ bottom: 27px !important; } .article4_2 li:hover{ box-shadow: 0 10px 25px rgba(0,0,0,.15); } /*文章扩展组件5*/ .floor_article5{ max-width: 1440px; margin: 0 auto; } .article5{ padding-top: 10px; } .article5:after{ content: ""; display: block; clear: both; } .article5 a{ display: block; margin: 10px; padding: 15px; background: #fff; transition-duration: .5s; } .article5 .infotitle{ font-size: 18px; transition-duration: 0.5s; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .article5 .infoscontent{ color: #666; margin: 5px 0; line-height: 1.8em; height: 3.6em; overflow: hidden; } .article5 .infotime{ font-size: 12px; color: #999; } .article5 a:hover{ box-shadow: 0 10px 25px rgba(0,0,0,.15); } /*文章扩展组件6*/ .floor_article6{ max-width: 1440px; margin: 0 auto; padding: 0 60px; } .floor_article6 .component_body{ position: relative; } .article6{ overflow: hidden; padding: 5px 0; } .article6 li a{ position: relative; display: block; margin: 5px; overflow: hidden; } .article6 li img{ transition-duration: .5s; } .article6 .infopicture{ overflow: hidden; background: #000; } .article6 .infowrap{ position: absolute; display: flex; flex-direction: column; top: 0; left: 0; right: 0; bottom: 0; box-sizing: border-box; padding: 10px; visibility: hidden; opacity: 0; transform: scale(0); transition-duration: .5s; } .article6 .infowrap.vertical0{ justify-content: center; } .article6 .infotime{ position: relative; font-size: 18px; color: #666; font-weight: 100; transition-duration: .2s; } .article6 .infotime span{ position: absolute; right: -60px; width: 30px; height: 30px; border: 1px solid #aaa; color: #666; line-height: 30px; text-align: center; } .article6 .infotitle{ font-size: 18px; font-weight: bold; color: #fff;} .article6 i{ display: block; width: 20px; margin: 10px auto; height: 2px; background: #fff; transition-duration: .3s; } .article6 .infoscontent{ line-height: 1.8em; padding-right: 10px; height: 3.6em; overflow: hidden; color: #fff; } .floor_article6 .pagination span{ position: absolute; top: 50%; margin-top: -20px; width: 40px; height: 40px; line-height: 40px !important; border-radius: 50%; border: 1px solid #fff; cursor: pointer; font-size: 20px; color: #fff; line-height: 40px; text-align: center; } .floor_article6 .pagination .prev{ left: -60px; } .floor_article6 .pagination .next{ right: -60px; } .floor_article6 .pagination span:hover{ box-shadow: 0 0 10px rgba(0,0,0,.2) inset; } .floor_article6 .pagination span:active{ box-shadow: 0 0 20px rgba(0,0,0,.3) inset; } .article6 li:hover .infowrap{ visibility: visible; opacity: 1; transform: scale(1); } /*文章扩展组件7*/ .floor_article7{ max-width: 1440px; margin: 0 auto; } .article7{ overflow: hidden; } .article7 li.n1,.article7 li.n2{ float: left; width: 25%; } .article7 li.n1 .infopicture,.article7 li.n2 .infopicture{ float: none; width: 100%; } .thumbright-article7 li.n1,.thumbright-article7 li.n2{ float: right; } .article7.big_type1 li.n1{ display: none; } .article7 li a{ display: block; margin: 10px; border: 1px solid #ddd; background: #fff; transition-duration: .5s; } .article7 li .infowrap{ padding: 8px; overflow: hidden; } .article7 li .infopicture{ float: left; width: 140px; overflow: hidden; } .article7 li .superinfotime{ float: left; width: 120px; overflow: hidden; display: flex; flex-direction: column; justify-content: center; align-items: center; } .article7 li .infopicture img{ transition-duration: .5s; } .article7 li .infotitle{ font-size: 18px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; transition-duration: .5s; } .article7 li .infotime{ margin: 5px 0; font-size: 13px; } .article7 li .infoscontent{ overflow: hidden; line-height: 1.6em; height: 3.2em; color: #666; } .article7 li:hover a{ box-shadow: 0 0 18px rgba(0,0,0,.1); } .article7 li:hover img{ transform: scale(1.1); } /*文章扩展组件8*/ .floor_article8{ max-width: 1440px; margin: 0 auto; } .article8{ overflow: hidden; padding: 20px 0 10px; } .article8 a{ display: block; margin: 10px; transition-duration: .5s; } .article8 .infowrap{ overflow: hidden; padding: 6px 15px; } .article8 .infopicture{ float: left; width: 140px; } .article8 .infotitle{ font-size: 18px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; transition-duration: .5s; } .article8 .infotime{ font-size: 12px; margin: 5px 0; } .article8 .infoscontent{ color: #666; line-height: 1.8em; height: 3.6em; overflow: hidden; } .article8 a:hover{ background: #fff; box-shadow: 0 10px 20px rgba(0,0,0,.15); transform: scale(1.01); } /*文章扩展组件9*/ .floor_article9{ position: relative; max-width: 1200px; margin: 0 auto; padding: 0 130px; } .article9 .infopicture{ float: left; width: 50%; max-height: 400px; } .thumbright-article9 .infopicture{ float: right; } .article9 .infowrap{ overflow: hidden; padding: 0 30px; display: flex; flex-direction: column; justify-content: center; height: 100%; } .article9 .infotime{ color: inherit; opacity: .5; } .article9 .infotitle{ font-size: 19px; font-weight: bold; margin: 10px 0; color: inherit; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .article9 .infoscontent{ line-height: 1.8em; opacity: .7; } .floor_article9 .pagination span{ position: absolute; top: 0; bottom: 0; margin: auto; width: 100px; height: 45px; line-height: 45px; text-align: center; font-size: 30px; font-weight: 100; background-color: #333; cursor: pointer; color: #fff; } .floor_article9 .pagination span.prev{ left: 10px; } .floor_article9 .pagination span.next{ right: 10px; } .floor_article9 .pagination span:hover{ box-shadow: 0 0 5px rgba(0,0,0,.1) inset; } .floor_article9 .pagination span:active{ box-shadow: 0 0 10px rgba(0,0,0,.2) inset; } .floor_article9 .pagination span:before{ transform: scale(4,1); } /*文章扩展组件10*/ .floor_article10{ max-width: 1440px; margin: 0 auto; overflow: hidden; } .floor_article10 .component_title{ overflow: hidden; padding-bottom: 10px; } .floor_article10 .component_title .channelicon{ float: left; margin-right: 15px; } .floor_article10 .component_title h2{ overflow: hidden; } .floor_article10 .component_title h2.h2_2:before{ left: 0; margin-left: 0; } .floor_article10 .component_title h2 span.more{ float: right; } .floor_article10 .component_title p{ color: #666; font-size: 12px; text-align: left; overflow: hidden; padding: 0; border-top: 0.5px solid #e0e0e0; } .article10{ float: left; box-sizing: border-box; padding: 0 10px; } .article10 a{ display: block; padding: 10px 0; overflow: hidden; } .article10 .infotitle{ overflow: hidden; text-overflow: ellipsis; white-space: nowrap; transition-duration: .5s; } .article10 .infoscontent{ display: none; } .article10 .infotime{ float: right; font-size: 12px; font-weight: 100; color: #666; } .article10 ul.first-detail1 li.n1 .infoscontent{ display: block; color: #888; line-height: 1.4em; height: 2.8em; overflow: hidden; } .article10 ul.first-detail1 li.n1 .infotitle{ float: none; font-size: 16px; padding: 7px 0; } .article10 ul.first-detail1 li.n1 .infotime{ position: relative; float: left; width: 80px; height: 80px; margin-right: 15px; background: #f5f5f5; } .article10 ul.first-detail1 li.n1 .infotime i{ display: none; } .article10 ul.first-detail1 li.n1 .infotime span{ position: absolute; left: 0; width: 100%; text-align: center; } .article10 ul.first-detail1 li.n1 .infotime span.d{ font-size: 30px; font-weight: bold; top: 10px; } .article10 ul.first-detail1 li.n1 .infotime span.ym{ top: 50px; } /*文章扩展组件11*/ .floor_article11{ max-width: 1440px; margin: 0 auto; } .article11 a{ display: block; padding: 15px; transition-duration: .5s; } .article11 .infotime{ position: relative; float: left; width: 100px; } .article11 .infotime:after{ content: ""; position: absolute; width: 50px; height: 1px; top: 32px; left: 12px; transform: rotate(-45deg); background: #999; } .article11 .infotime span{ display: block; } .article11 .infotime span.d{ font-size: 26px; } .article11 .infotime span.ym{ text-align: right; } .article11 .infopicture{ width: 350px; height: 220px; overflow: hidden; float: left; margin: 0 20px; transition-duration: .5s; } .article11 .infotitle{ font-size: 18px; transition-duration: .5s; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .article11 .infoscontent{ color: #666; overflow: hidden; border-top: 1px solid transparent; margin-top: 15px; padding-top: 15px; line-height: 1.8em; max-height: 9.0em; text-align: justify; transition-duration: .5s; } .article11 .viewmore{ font-size: 20px; margin-top: 15px; color: #999; font-weight: 100; transition-duration: .5s; overflow: hidden; } .article11 .viewmore span{ display: inline-block; text-align: center; font-weight: 500; } .article11 a:hover{ box-shadow: 0 0 25px rgba(0,0,0,.15); } .article11 a:hover .infopicture{ transform: scale(1.05); } .article11 a:hover .viewmore{ transform: translatex(10px); } /*文章扩展组件12*/ .floor_article12{ max-width: 1440px; margin: 0 auto; } .article12{ overflow: hidden; } .article12 a{ transition-duration: .5s; } .article12 li.n1{ width: 100%; } .article12 li.n1 .infopicture{ float: left; width: 45%; margin-right: 30px; max-height: 400px; overflow: hidden; } .article12 li.n1 a{ box-shadow: none; padding: 0; } .article12 li.n1 .infotime{ overflow: hidden; margin-top: 50px; transition-duration: .5s; } .article12 li.n1 .infoscontent{ padding-right: 20px; } .article12 li{ width: 33.3333%; float: left; } .article12 a{ display: block; margin: 15px; padding: 30px; box-shadow: 0 0 10px rgba(0,0,0,.1); } .article12 .infotime:after{ content: ""; display: block; width: 20px; height: 1px; margin: 5px 0 20px; background: #999; } .article12 .infotitle{ font-size: 16px; font-weight: bold; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; transition-duration: .5s; } .article12 .infoscontent{ color: #999; margin-top: 15px; line-height: 1.8em; height: 5.4em; overflow: hidden; text-align: justify; } .article12 .viewmore{ margin-top: 15px; transition-duration: .5s; } .article12 li a:hover{ background: #fff; box-shadow: 0 0 15px rgba(0,0,0,.15); } /*文章扩展组件13*/ .floor_article13{ max-width: 1440px; margin: 0 auto; overflow: hidden; display: flex; align-items: center; } .floor_article13 .component_title{ display: flex; align-items: center; font-size: 14px; color: #545556; padding: 12px 0 12px 10px; font-weight:bold; } .floor_article13 .component_title img{ margin-right: 5px; } .floor_article13 .component_body{ flex: 1; overflow: hidden; } .floor_article13 .component_bottom{ font-size: 14px; color: #545556; padding: 12px 10px 12px 0; } .article13{ overflow-x: auto; white-space: nowrap; position: relative; margin: 0 12px; padding: 12px 0; } .article13 li{ position: relative; display: inline-block; margin-right: 50px; } .article13 li a{ font-size: 14px; margin-right: 8px; padding-left: 15px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .article13 li span{font-size: 12px; color: #888; } /*文章扩展组件14*/ .floor_article14{ max-width: 1440px; margin: 0 auto; overflow: hidden; } .article14 .component_title{ overflow: hidden; padding-bottom: 10px; } .article14 .component_title .channelicon{ float: left; margin-right: 15px; } .article14 .component_title h2{ overflow: hidden; } .article14 .component_title h2 a{ padding: 0; } .article14 .component_title h2.h2_2:before{ left: 0; margin-left: 0; } .article14 .component_title h2 span{ float: right; } .article14 .component_title p{ color: #666; font-size: 12px; text-align: left; overflow: hidden; padding: 0; border-top: 0.5px solid #e0e0e0; } .article14{ float: left; box-sizing: border-box; padding: 0 10px; } .article14 .wrap{ padding: 10px; background-color: #fff; } .article14 a{ position: relative; display: block; padding: 10px 0; overflow: hidden; } .article14 .infotitle{ float: left; max-width: 80%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; transition-duration: .5s; } .article14 .infotime{ position: absolute; right: 0; top: 0; bottom: 0; height: 1em; line-height: 1em; margin: auto; font-size: 12px; font-weight: 100; color: #666; } .article14 .infoscontent{ display: none; } .article14 li .infopicture{ display: flex; justify-content: center; align-items: center; overflow: hidden; } .article14 li img{ display: block; width: 100%; } .article14 li.first-detail1 .infoscontent{ display: block; color: #888; line-height: 1.4em; height: 2.8em; overflow: hidden; } .article14 li.first-detail1 .infotitle{ float: none; font-size: 16px; padding: 7px 0; } .article14 li.first-detail1 .infotime{ position: relative; float: left; width: 80px; height: 80px; margin-right: 15px; background: #f5f5f5; } .article14 li.first-detail1 .infotime i{ display: none; } .article14 li.first-detail1 .infotime span{ position: absolute; left: 0; width: 100%; text-align: center; } .article14 li.first-detail1 .infotime span.d{ font-size: 30px; font-weight: bold; top: 10px; line-height: normal; } .article14 li.first-detail1 .infotime span.ym{ top: 50px; } .article14 li.first-detail2 .infotitle, .article14 li.first-detail2 .infotime{ display: none; } .article14 li.first-detail2 a, .article14 li.first-detail3 a{ padding: 0; margin-bottom: 10px; } .article14 li.first-detail3 .infotitle{ position: absolute; bottom: 0; height: 45px; width: 75%; line-height: 45px !important; left: 0; color: #fff; background-color: rgba(0,0,0,.5); } .article14 li.first-detail3 .infotime{ position: absolute; bottom: 0; top: auto; height: 45px; line-height: 45px !important; width: 25%; right: 0; color: #fff; background-color: rgba(0,0,0,.5); } /*文章组件15*/ .floor_article15{ max-width: 1440px; margin: 0 auto; } .floor_article15 .component_body { } .article15:after{ content:''; display: block; clear: both; } .article15 a{ display: block; overflow: hidden; } .article15 li{ } .article15 li a{ margin:0; overflow: hidden; padding:0; display:flex; } .article15 li .leftwrrap { float:left; padding:15px 60px 15px 10px; position:relative; box-sizing:border-box; max-width:50%; } .article15 li .infotime{ margin-bottom: 10px; min-width:130px; } .article15 li .centerline { position:absolute; top:0; right:29px; width:2px; height:100%; } .article15 li .centerpoint { position:absolute; top:15px; right:-6px; width:14px; height:14px; border-radius:50%; } .article15 li .infopicture{ max-width:100%; overflow:hidden; } .article15 li img{ width:100%; transition-duration: .5s; } .article15 li .infowrap { padding:15px 10px 15px 0; overflow:hidden; } .article15 li .infotitle{ font-weight:normal; margin:0 0 10px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; transition-duration: .5s; } .article15 li .infoscontent{ margin-bottom:10px; max-height:5.4em; line-height: 1.8em;overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp:3; -webkit-box-orient: vertical; } .article15 li .infohit{ margin-bottom: 10px; } .article15 li .more{ margin-bottom:10px; } .article15 li .more span{ max-width:100%; display:inline-block; text-align:center; } .article15 li:hover img{ transform: scale(1.1); } /*文章组件16*/ .floor_article16{ max-width: 1440px; margin: 0 auto; } .floor_article16 ul{ overflow: hidden; } .floor_article16 li{ overflow: hidden; } .floor_article16 .float_left{ margin-right: 20px; } .floor_article16 .float_right{ margin-left: 20px; } .floor_article16 .channelicon{ float: left; margin-right: 10px; } .floor_article16 .infopicture{ float: left; margin-right: 15px; } .floor_article16 a{ display: block; font-size: 0; } /*文章组件17*/ .floor_article17{ max-width: 1440px; margin: 0 auto; } .article17:after{ content: ''; display: block; clear: both; } .article17 a{ display: block; overflow: hidden; } .article17 li{ width: 25%; float: left; } .article17 li a{ margin: 0 10px 20px; overflow: hidden; } .article17 li .infopicture{ overflow: hidden; position: relative; } .article17 li img{ transition-duration: .5s; } .article17 li .infotitle{ font-size: 16px; text-align: left; color: #333; margin: 10px 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; transition-duration: .5s; } .article17 li .infoscontent{ font-size: 13px; margin-bottom: 10px; color: #999; height: 3.6em; line-height: 1.8em; overflow: hidden; } .article17 li .infotime{ font-size: 18px; color: #888; font-weight: bold; margin-bottom: 10px; } .article17 li .infohit{ margin-bottom: 10px; } .article17 li .viewmore{ margin-bottom: 10px; clear: both; } .article17 li .viewmore span{ display: inline-block; text-align:center; } .article17 li:hover img{ transform: scale(1.1); } .article17 li .timestyle2 .infotime{ float: left; } .article17 li .timestyle2 .infohit{ float: right; } .article17 li .timestyle3 .infotime{ float: right; } .article17 li .timestyle3 .infohit{ float: left; } .article17 li .timestyle4 .superinfotime{ position: absolute; top: 0; left: 0; } .article17 li .timestyle5 .superinfotime{ position: absolute; top: 0; right: 0; } /*文章组件18*/ .floor_article18{ max-width: 1440px; margin: 0 auto; } .floor_article18 .float_left{ margin-right: 20px; } .floor_article18 .float_right{ margin-left: 20px; } .floor_article18 .channel1,.floor_article18 .channel2{ overflow: hidden; max-width: 100%; } .floor_article18 .channel1 ul{ overflow: hidden; display: none; } .floor_article18 .channel1 ul.on{ overflow: hidden; display: block; } .floor_article18 .channel1 li{ overflow: hidden; } .floor_article18 .channel1 .infopicture{ float: left; margin-right: 15px; max-width: 50%; } .floor_article18 .channel1 a{ display: block; overflow: hidden; } .floor_article18 .channel1 li.first .infoscontent{ display: block !important; } .floor_article18 .channel1 li.first .infotime{ float: none; } .floor_article18 .channel1 .infotime{ float: right; } .floor_article18 .channel2 li{ overflow: hidden; } .floor_article18 .channel2 li img{ float: left; margin-right: 10px; } .floor_article18 .channel2 li span{ display: block; overflow: hidden; } .floor_article18 .channel2 .q, .floor_article18 .channel2 .a{ overflow: hidden; } .floor_article18 .tabbar{ overflow: hidden; padding: 5px 10px; } .floor_article18 .tabbar .tabbartitlewrap{ overflow-x: auto; overflow-y: hidden; white-space: nowrap; font-size: 0; } .floor_article18 .tabbar .tabbartitlewrap .title{ float: none; display: inline-block; } .floor_article18 .tabbar .title{ font-size: 0; float: left; margin-right: 10px; cursor: pointer; } .floor_article18 .tabbar img{ display: inline-block; vertical-align: middle; margin-right: 5px; } .floor_article18 .tabbar span{ display: inline-block; vertical-align: middle; } .floor_article18 .tabbar a{ float: right; margin-left: 10px; } /*文章组件19*/ .floor_article19{ max-width: 1440px; margin: 0 auto; } .floor_article19 .component_title div { overflow-x:auto; } .floor_article19 .tabbar{ text-align: center; margin:0; white-space:nowrap; } .floor_article19 .tabbar li{ display: inline-block; margin: 0; white-space:normal; } .floor_article19 .tabbar li a{ display: block; padding:25px 50px; transition-duration: .3s; box-sizing:border-box; } .floor_article19 .tabbar li img { max-width:100px; margin-bottom: 2px; } .floor_article19 .tabbar li a:hover{ opacity: .7; } .floor_article19 .component_body { } .article19 .infoprice{ position: relative; } .article19 .infoprice i{ position: absolute; right: -50px; top: 0; bottom: 0; margin: auto; height: 1.5em; line-height: 1.5em; transition-duration: .5s; font-size: 20px; } .article19 li{ transition-duration: .5s; } .article19 a{ display: block; padding:0; margin: 8px; overflow: hidden; transition-duration: .5s; } .article19 .infopicture{ } .article19 .infowrap { overflow:hidden; } .article19 .infotitle{ font-size:18px; font-weight:bold; } .article19 .infoscontent{ margin:15px 0; color: #666; overflow: hidden; } /*文章组件20*/ .floor_article20{ max-width: 1440px; margin: 0 auto; } .floor_article20 .component_title div { overflow-x:auto; } .floor_article20 .tabbar{ text-align: center; margin:0; white-space:nowrap; display:flex; margin:0 9px; } .floor_article20 .tabbar li{ flex:1; margin: 0; white-space:normal; margin:0 1px; } .floor_article20 .tabbar li a{ display: block; transition-duration: .3s; box-sizing:border-box; } .article20 .infoprice{ position: relative; } .article20 .infoprice i{ position: absolute; right: -50px; top: 0; bottom: 0; margin: auto; height: 1.5em; line-height: 1.5em; transition-duration: .5s; font-size: 20px; } .article20 li{ transition-duration: .5s; } .article20 a{ display: block; padding:0; margin: 8px; overflow: hidden; transition-duration: .5s; } .article20 .infopicture{ float:left; margin-right:15px; } .article20 .infowrap { overflow:hidden; } .article20 .infotitle{ font-size:18px; font-weight:bold; } .article20 .infoscontent{ margin: 0; color: #666; overflow: hidden; } .article20 li.type1 { float:none; width:100% !important; } .article20 li.type1 .infoscontent { margin-top:15px; } .article20 li.type1 .infotime { margin-top:15px; } .article20 li.type2 .infotime{ position: relative; float: left; width: 80px; height: 80px; margin-right: 15px; background: #f5f5f5; } .article20 li.type2 .infotime i{ display: none; } .article20 li.type2 .infotime span{ position: absolute; left: 0; width: 100%; text-align: center; } .article20 li.type2 .infotime span.d{ font-size: 30px; font-weight: bold; top: 15px; } .article20 li.type2 .infotime span.ym{ top:45px; } /*文章扩展组件21*/ .floor_article21{ max-width: 1440px; margin: 0 auto; } .article21{ overflow: hidden; } .article21 a{ transition-duration: .5s; overflow: hidden; } .articlea21 { float: left; width: 60%; } .articlea21 li.n1{ width: 100% !important; } .articlea21 li.n1 .infopicture{ float: left; width: 45%; margin-right: 30px; max-height: 400px; overflow: hidden; } .articlea21 li.n1 a{ box-shadow: none; padding: 0; } .articlea21 li.n1 .info_wrap { position: relative; padding-right: 30px; } .articlea21 li.n1 .infotitle { margin-top: 50px; } .articlea21 li.n1 .infotime{ overflow: hidden; transition-duration: .5s; margin-top: 16px; } .articlea21 li.n1 .infotime:before { display: none; } .articlea21 li.n1 .infoscontent{ display: block; margin-top: 16px; } .articlea21 li{ width: 33.3333%; float: left; } .articlea21 a{ display: block; margin: 15px; padding: 0; box-shadow: 0 0 10px rgba(0,0,0,.1); position: relative; } .articlea21 li .info_wrap1 { overflow: hidden; position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 9; display: flex; align-items: center; justify-content: center; } .articlea21 li .info_wrap1:before { content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: -1; } .articlea21 li .info_wrap1 .info_item { width: 80%; } .articlea21 li .infotime:before{ content: ""; display: block; width: 20px; height: 1px; margin: 16px 0 16px; background: #999; } .articlea21 li .infotitle{ font-size: 16px; transition-duration: .5s; } .articlea21 li .infoscontent{ display: none; color: #999; overflow: hidden; text-align: justify; } .articlea21 li a:hover .info_wrap1:before { opacity: 0.5; } .articleb21 { float: right; width: 35%; padding: 10px; } .articleb21 li { margin-top: 30px; } .articleb21 li.n1 { margin-top: 0; } .articleb21 .infotitle{ font-size: 16px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; transition-duration: .5s; } .articleb21 .infoscontent{ margin-top: 8px; overflow: hidden; } .articleb21 .infotime { margin-top: 8px; } /*文章扩展组件22*/ .floor_article22{ max-width: 1440px; margin: 0 auto; } .article22{ overflow: hidden; } .article22 li a{ display: block; padding: 30px 20px 20px 20px; transition-duration: .5s; position: relative; border-top-left-radius:0; background:#f7f7f7; } .article22 li img{ display: block; } .article22 .channel{ display: flex; position: absolute;left:0; top:0; z-index: 0; } .article22 .channel span{ color: #fff; padding: 5px 10px; font-size: 14px; } .article22 li{ width: 33.3333%; float: left; box-sizing: border-box; padding: 10px; } .article22 li.big{ width:50%; } .article22 li.big a{ padding: 0; } .article22 li.big .channel span{ padding: 10px 40px; font-size: 24px; color: #fff; font-weight: 500; } .article22 li .wrap{ position: absolute; width: 100%; left: 0; bottom: 0; z-index: 1; padding:18px; box-sizing: border-box; } .article22 li.big a::before{ content:""; width:100%; height:100%; position: absolute; left: 0; top: 0; z-index:0; background: rgba(0,0,0,.5); opacity: 0; transition-duration:.3s; } .article22 li.big:hover a::before{ opacity: 1; } .article22 .infotime{ font-size:14px; color: #999; transition: all ease .3s; margin-top: 7px; } .article22 .infotitle{ font-size: 16px; font-weight: bold; margin-top:5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .article22 .infoscontent{ color: #999; margin-top:5px; line-height: 1.8em; height: 5.4em; overflow: hidden; text-align: justify; } .article22 li a:hover .infotitle,.article22 li a:hover .infotime,.article22 li a:hover .infoscontent{ color:#fff !important; } /*文章扩展组件23*/ .floor_article23{ max-width: 1440px; margin: 0 auto; } .article23{ overflow: hidden; } .article23 a{ transition-duration: .5s; } .article23 li{ width: 33.3333%; float: left; } .article23 a{ display: block; margin: 10px; padding:22px 30px; box-shadow: 0 0 10px rgba(0,0,0,.1); } .article23 .infotime{ font-size: 48px; font-weight: bold; line-height: 50px; font-family: 'sheepsansbold'; color: #999; padding:0 0 15px; border-bottom: 1px solid #dbdbdb; transition: all ease .3s; } .article23 .infotime span{ font-size: 16px; line-height: 20px; display: block; } .article23 .infotitle{ font-size: 16px; font-weight: bold; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; transition-duration: .5s; margin-top: 25px; } .article23 .infoscontent{ color: #999; margin-top: 15px; line-height: 1.8em; height: 5.4em; overflow: hidden; text-align: justify; } .article23 .viewmore{ margin-top: 15px; transition-duration: .5s; } .article23 li a:hover{ background: #fff; box-shadow: 0 0 15px rgba(0,0,0,.15); } /*文章扩展组件24*/ .floor_article24{ max-width: 1440px; margin: 0 auto; padding: 0 10px; overflow: hidden; } .article24{ overflow: hidden; position: relative; } .article24_1.float_left{ margin-right: 15px; } .article24_1.float_right{ margin-left: 15px; } .article24_1 li,.article24_1 .swiper-wrapper{ height: 100%; position: relative; } .article24_1 .infopicture{ overflow: hidden; } .article24_1 .infopicture img{ width:100%;height:100%; object-fit:cover; transition-duration: .5s; } .article24_1 .infotitle{ position:absolute; left:0; bottom:0; color:#fff; width:100%; height:100px; padding: 0 100px 0 15px; display: flex; align-items: flex-end; background: linear-gradient(to top,#000 10%, rgba(0, 0, 0, 0) 90%) !important; text-align: left; box-sizing: border-box; transition-duration: .5s; } .article24_1 .infotitle span{ overflow:hidden; text-overflow: ellipsis; white-space: nowrap; } .article24_1 .pagination{ position: absolute; right:5px; bottom: 15px; z-index: 1; transition-duration: .5s; } .article24_1 .pagination span{ color: #fff; font-size:24px; padding: 5px 7px; cursor: pointer; } .article24_1 .pagination .swiper-pagination-switch{ width: 8px; } .article24_2{ overflow: hidden; } .article24_2 li{ transition-duration: .5s; margin-top: 10px; padding:10px 10px 15px; overflow: hidden; display: flex; border-bottom: 1px solid #ddd; } .article24_2 .infopicture{ height: 100%; display: block; float: left; margin-right: 10px; } .article24_2 a{ display: block; overflow: hidden; } .article24_2 li.n1{ margin-top: 0; padding-top: 5px; } .article24_2 .infotitle{ font-size: 18px; padding: 2px 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; transition-duration: .5s; } .article24_2 .time{ background: #fff; padding: 15px; text-align: center; box-shadow: 0 0 12px rgba(101, 69, 135, 0.26); border-radius:5px; margin-right: 22px; } .article24_2 .time .ym{ white-space: nowrap; padding-top:5px; } .article24_2 .infoscontent{ color: #999; margin: 2px 0; line-height: 1.6em; height: 3.2em; overflow: hidden; } .article24_1:hover img{ transform: scale(1.1); } .article24_1:hover .infotitle{ background: rgba(0,0,0,.5); line-height: 70px !important; } .article24_1:hover .pagination{ bottom: 27px !important; } .article24_2 li:hover{ box-shadow: 0 10px 25px rgba(0,0,0,.15); } /*文章扩展组件25*/ .floor_article25{ max-width: 1440px; margin: 0 auto; box-sizing:border-box; position: relative; overflow: hidden; } .floor_article25 .component_body { padding:5px 15px; overflow: hidden; } .floor_article25 .col_left { float:left; width:280px; padding:0 10px 5px; box-sizing:border-box; } .floor_article25 .col_left .top{ position: relative; padding-bottom: 10px;} .floor_article25 .col_left h2{ text-align: left; padding-bottom:5px; } .floor_article25 .col_left h2.h2_2 { position:relative; padding-bottom:12px; margin-bottom:0px; } .floor_article25 .col_left h2.h2_2:before { content:""; position:absolute; left:0; margin-left:0; bottom:8px; width:100px; height:2px; background:#ccc; } .floor_article25 .col_left .tabbar{ margin-top: 10px; } .floor_article25 .col_left .tabbar li { margin-bottom:5px; } .floor_article25 .col_left .tabbar li a { display:flex; align-items: center; height:55px; color:#fff; text-align:center; } .floor_article25 .col_left .tabbar li span{ width:20px; height:3px; background:#9da2a8; margin-right: 10px; } .floor_article25 .pagination{ display: flex; margin-top:25px; transition-duration: .5s; } .floor_article25 .pagination .btn1{ width:50px; height: 50px; border: 1px solid #c8c9c8; border-radius: 50%; overflow: hidden; margin-right:12px; display: flex; align-items: center; justify-content: center; box-shadow: 0 0 14px rgba(0, 0, 0, 0.09); } .floor_article25 .pagination .prev span{ border-top:6px solid transparent !important; border-bottom: 6px solid transparent !important; border-right: 10px solid #4c4c4c; } .floor_article25 .pagination .next span{ border-top:6px solid transparent !important; border-bottom: 6px solid transparent !important; border-left: 10px solid #4c4c4c; } .floor_article25 .col_right { float:right; width:calc(100% - 280px); padding-top:30px; } .article25 .wrap{ display: block; width:93%; padding:20px 20px; margin:0 auto 5px; position: relative; overflow: hidden; box-sizing:border-box; box-shadow: 0 0 14px rgba(0, 0, 0, 0.09); } .article25 li a{ display: block; } .article25 li .infotitle{ font-size:16px; color:#fff; padding:10px 0 0; box-sizing:border-box; overflow:hidden; height:3.2em; max-height:3.2em; } .article25 li .infotime{ padding:10px 0 15px; } .article25 li .infopicture{ display: block; width: 100%; overflow: hidden; transition-duration: .5s; } .article25 li .infopicture img{ transition: all 0.5s linear; } .article25 li:hover .infopicture img{ transform: scale(1.1,1.1); } .article25 li .more{ display: block; margin-top:35px; height: 48px; overflow: hidden; padding-bottom: 5px;} .article25 li .more a{ display: flex; flex-wrap: nowrap; width: 176px; height: 48px; text-align: center; border-radius:48px; position: relative; overflow: hidden; border:1px solid rgba(255, 255, 255, 0.5); box-sizing: border-box; } .article25 li .more .more_btn{ display:block; width: 100%; min-width: 100%; height: 100%; display:flex; align-items:center; justify-content: center; position:relative; left:-100%; top:0; transition: all 0.3s linear; } .article25 li .more .more_btn span{ font-size: 16px; padding-right: 34px; background: right center no-repeat; background-size:auto 18px; } .article25 li .more:hover .more_btn{ left:0; } /*==========文章扩展模型 结束==========*/ /*==========产品扩展模型 开始==========*/ /*产品扩展组件0*/ .product0{} .floor_product0{ max-width: 1440px; margin: 0 auto; } .floor_product0 .tabbar{ overflow: hidden; text-align: center; margin:0 0 15px; } .floor_product0 .tabbar li{ display: inline-block; margin: 0 5px; } .floor_product0 .tabbar li a{ display: block; line-height: 32px; padding: 0 23px; border: 1px solid #eee; border-radius: 32px; transition-duration: .3s; } .floor_product0 .tabbar li a:hover{ opacity: .7; } .product0 .infoprice{ position: relative; } .product0 .infoprice i{ position: absolute; right: -50px; top: 0; bottom: 0; margin: auto; height: 1.5em; line-height: 1.5em; transition-duration: .5s; font-size: 20px; } .thumb-product0 li{ transition-duration: .5s; } .thumb-product0 a{ display: block; padding: 15px; margin: 0 10px 20px; overflow: hidden; transition-duration: .5s; } .thumb-product0.list-style4 a{ padding: 0; } .thumb-product0 .infopicture{ float: left; width: 40%; } .thumb-product0 .infotitle{ font-size: 18px; font-weight: bold; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .thumb-product0 .infoscontent{ color: #666; line-height: 1.8em; max-height: 3.6em; overflow: hidden; } .thumb-product0 .infoprice{ font-size: 20px; font-weight: bold; color: #f44336; overflow: hidden; } .thumb-product0 li a:hover{ box-shadow: 0 8px 35px rgba(0, 0, 0, .08); } .grid-product0{ position: relative; } .grid-product0:after{ content: ''; display: block; clear: both; } .grid-product0 li { width: 25%; float: left; } .grid-product0 li a{ display: block; margin: 0 10px 20px; transition-duration: .5s; } .grid-product0 li .infopicture{ overflow: hidden; border-bottom-left-radius: 0; border-bottom-right-radius: 0; } .grid-product0 li img{ transition-duration: .5s; } .grid-product0 li .infowrap{ transition-duration: .5s; } .grid-product0 li .infotitle{ font-size: 17px; text-align: left; margin: 10px 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; line-height: 1.2em; /*这里的line-height是为了兼容ie8 hover时加粗后高度不一的问题*/ } .grid-product0 li .infoscontent{ margin: 10px 0; line-height: 1.8em; overflow: hidden; color: #999; } .grid-product0 li .infoprice{ margin: 10px 0; font-size: 16px; font-weight: bold; color: #f44336; } .grid-product0 li .infoprice span{ font-size: .7em; font-weight: normal; } .grid-product0 li:hover a{ box-shadow: 0 5px 15px 0 rgba(0,0,0,.2); } .grid-product0 li:hover img{ transform: scale(1.1); } .grid-product0 li a:hover .infoprice i{ right: 15px; } /*产品扩展组件1*/ .floor_product1{ max-width: 1440px; margin: 0 auto; } .product1{ overflow: hidden; } .product1 li.n1{ float: right; width: 30%; height: 620px; } .product1 li.n2{ float: left; width: 70%; height: 310px; } .product1 li.n3{ float: left; width: 35%; height: 310px; } .product1 li.n4{ float: left; width: 35%; height: 310px; } .product1 li{ position: relative; } .product1 li a{ display: block; position: absolute; left: 5px; top: 5px; bottom: 5px; right: 5px; background: #000; overflow: hidden; } .product1 li a i{ position: absolute; right: 50px; bottom: 0; font-size: 60px; color: #fff; opacity: 0; transition-duration: .5s; } .product1 li a .channelpicture{ width: 100%; transition-duration: .5s; } .product1 li.n2 .channelname{ position: absolute; left: 50px; top: 0; bottom: 0; margin: auto; height: 50px; line-height: 50px; font-size: 36px; font-weight: bold; color: #fff; background: transparent !important; } .product1 li.n1 .channelname,.product1 li.n3 .channelname,.product1 li.n4 .channelname{ position: absolute; bottom: 0; left: 0; right: 0; padding: 0 20px; line-height: 64px; font-size: 20px; font-weight: bold; color: #fff; } .product1 li:hover .channelpicture{ transform: scale(1.1); opacity: .7; } .product1 li:hover a i{ opacity: 1; transform: translatex(25px); } /*产品扩展组件2*/ .floor_product2{ max-width: 1440px; margin: 0 auto; } .product2{ overflow: hidden; } .product2 a{ display: block; position: relative; overflow: hidden; } .product2 .channelpicture{ display: block; width: 100%; transition-duration: .5s; } .product2 .channelwrap{ position: absolute; left: 0; top: 0; bottom: 0; right: 0; background: rgba(0,0,0,.7); text-align: center; color: #fff; transition-duration: .5s; opacity: .8; } .product2 .channelwrap img{ margin-top: 45%; transition-duration: .8s; } .product2 .channelwrap .channelname{ position: relative; font-size: 24px; margin: 20px 0; padding-top: 20px; font-weight: bold; transition-duration: .5s; } .product2 .channelwrap .channelname:after{ content: ""; position: absolute; top: 0; left: 0; right: 0; margin: auto; width: 20px; height: 2px; background: #fff; } .product2 .channelwrap .channelscontent{ max-width: 80%; margin: 0 auto; opacity: 0; transition-duration: .5s; transform: translatey(50px); } .product2 .more_btn{ margin: 30px auto 0; opacity: 0; transition-duration: .5s; transform: translatey(50px); } .product2 .more_btn span{ display: inline-block; text-align: center; } .product2 li:hover .channelscontent,.product2 li:hover .channelwrap .more_btn{ opacity: 1; transform: translatey(-20px); } .product2 li:hover .channelpicture{ transform: scale(1.1); } .product2 li:hover .channelname{ transform: translatey(-30px); } .product2 li:hover .channelwrap img{ transform: translatey(-30px); } /*产品扩展组件3*/ .floor_product3{ max-width: 1440px; margin: 0 auto; } .product3{ overflow: hidden; } .product3 a{ display: block; position: relative; overflow: hidden; box-sizing:border-box; } .product3 .infopicture{ display: block; width: 100%; transition-duration: .5s; } .product3 .infowrap{ position: absolute; left: 0; top: 0; bottom: 0; right: 0; background: rgba(0,0,0,.3); text-align: center; color: #fff; transition-duration: .5s; opacity:0; } .product3 .infowrap:before{ content: ""; position: absolute; top:10%; left:15%; width:1px; height:80%; background: #fff; } .product3 .infowrap:after{ content: ""; position: absolute; top:10%; right:15%; width:1px; height:80%; background: #fff; } .product3 .infowrap .infotitle{ position:absolute; left:10%; top:20%; width:80%; height:60%; font-size:16px; color:#fff; display:flex; align-items:center; justify-content:center; padding:10% 10%; box-sizing:border-box; border-top:1px solid #fff; border-bottom:1px solid #fff; line-height:2em; } .product3 li:hover .infowrap{ opacity:1; } /*产品扩展组件4*/ .floor_product4{ max-width: 1440px; margin: 0 auto; box-sizing:border-box; } .floor_product4 .component_body { padding:2%; } .floor_product4 .col_left { float:left; background:#fff; width:20%; padding:10px 10px 5px; box-sizing:border-box; } .floor_product4 .col_left .tabbar { } .floor_product4 .col_left .tabbar li { margin-bottom:5px; } .floor_product4 .col_left .tabbar li a { display:block; line-height:60px; color:#fff; text-align:center; } .floor_product4 .col_right { float:right; width:78%; } .product4 a{ display: block; width:95%; margin:0 auto 5px; position: relative; overflow: hidden; box-sizing:border-box; } .product4 .infopicture{ display: block; width: 100%; transition-duration: .5s; } .product4 .infotitle{ font-size:16px; color:#fff; padding:8px 5px; box-sizing:border-box; text-align:center; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; } /*产品扩展组件6*/ .floor_product6{ max-width: 1440px; margin: 0 auto; padding:0 10px; } .product6 { overflow: hidden; } .product6 a{ display: block; position: relative; overflow: hidden; box-sizing:border-box; } .product6 .infopicture{ float:left; display: block; width: 50%; transition-duration: .5s; position:relative; } .product6 .infopicture img { width:100%; } .product6 li.m1 .infopicture { float:right; } .product6 .infowrap{ float:left; width:50%; padding:2% 4% 0; box-sizing:border-box; text-align:left; color: #444; transition-duration: .5s; } .product6 .infowrap .infotitle{ font-size:20px; color:#fff; line-height:2em; padding-bottom:8px; position:relative; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; } .product6 .infowrap .infotitle:before { content:""; position:absolute; left:0; bottom:0; width:120px; height:2px; background:#aaa; } .product6 li .infoscontent{ font-size:14px; margin-top: 15px; line-height: 1.8em; height:5.4em; overflow: hidden; color: #666; } .product6 li .infoprice { margin-top:10px; color:#f00; font-size:16px; } .product6 li .x_line { position:absolute; top:50%; left:auto; right:-11px; width:30px; height:30px; margin-top:-15px; font-size:30px; z-index:3; } .product6 li .x_line1 { display:none; } .product6 li.m1 .x_line1 { display:block; right:auto; left:-11px; } .product6 li.m1 .x_line2 { display:none; } .product6 li .more { float:none; display:block; margin-top:10px; border:1px solid #aaa; color:#666; width:128px; line-height:38px; text-align:center; transition-duration: .5s; } .product6.tomod4 li.m1 .infopicture { float:left; } .product6.tomod4 li.m2 .infopicture, .product6.tomod4 li.m3 .infopicture { float:right; } .product6.tomod4 li.m1 .x_line1 { display:none; right:-11px; left:auto; } .product6.tomod4 li.m1 .x_line2 { display:block; } .product6.tomod4 li.m2 .x_line1, .product6.tomod4 li.m3 .x_line1 { display:block; right:auto; left:-11px; } .product6.tomod4 li.m2 .x_line2, .product6.tomod4 li.m3 .x_line2 { display:none; } .product6.tomod4 li .more { width:110px; line-height:32px; } /*产品扩展组件7*/ .floor_product7{ max-width: 1440px; margin: 0 auto; padding:0 0; } .product7 { padding:0 0 0; overflow: hidden; } .product7 li { padding:2% 1% 1%; box-sizing:border-box; } .product7 a{ display: block; position: relative; overflow: hidden; box-sizing:border-box; padding:4%; background:#fff; box-shadow:0 0 10px 0 rgba(0,0,0,.1); } .product7 .infopicture{ display: block; transition-duration: .5s; position:relative; } .product7 .infopicture img { width:100%; } .product7 .infowrap{ box-sizing:border-box; text-align:left; color: #444; transition-duration: .5s; } .product7 .infowrap .infotitle{ text-align:left; font-size:20px; color:#fff; padding-top:10px; position:relative; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; } .product7 li .infoscontent{ text-align:left; font-size:14px; margin-top: 10px; line-height: 1.8em; height:5.4em; color: #666; overflow:hidden; text-overflow:-o-ellipsis-lastline; text-overflow:ellipsis; display:-webkit-box; -webkit-line-clamp:3; line-clamp:3; -webkit-box-orient:vertical; } .product7 li .infoprice { text-align:left; margin-top:10px; color:#f00; font-size:16px; } .product7 li .more {} .product7 li .more span{ display: inline-block; text-align: center; margin-top:10px; } .product7 li .more img { vertical-align:sub; max-height:20px; line-height:0; } /*产品扩展组件8*/ .floor_product8{ max-width: 1440px; margin: 0 auto; padding:0 0; } .floor_product8 .tabbar{ overflow: hidden; text-align: center; margin:5px 0 25px; } .floor_product8 .tabbar li{ display: inline-block; margin: 0 5px; } .floor_product8 .tabbar li a{ display: block; line-height: 36px; padding: 0 30px; border-radius:40px; transition-duration: .3s; } .floor_product8 .tabbar li a:hover{ } .product8 { padding:0 0 0; } .picture-product8 { } .product8 li { padding:0; box-sizing:border-box; } .product8 a{ display: block; margin:3%; position: relative; overflow: hidden; box-sizing:border-box; background:#fff; } .product8 .infopicture{ display: block; position:relative; } .product8 .infopicture img { width:100%; } .product8 .infotitle{ font-size:20px; padding:0 5px; color:#fff; position:relative; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; line-height:42px; text-align:center; transition-duration: .5s; } /*产品扩展组件9*/ .floor_product9{ max-width: 1440px; margin: 0 auto; position:relative; } .product9 li { float:left; width:33.33%; transition-duration: .5s; overflow:hidden; } .product9:hover li { width:30%; } .product9 li:hover { width:40%; } .product9 a{ display: block; position: relative; overflow: hidden; transition-duration: .5s; } .product9 .channelpicture{ display: block; width: 100%; transition-duration: .5s; } .product9 .channelpicture img { display:block; min-width:100%; height:100%; transition-duration: .5s; } .product9 .channelwrapmain{ position: absolute; left: 0; top: 0; width:100%; height:100%; text-align: center; color: #fff; transition-duration: .5s; } .product9 .channelwrapmain .channelwrapmainback { position:absolute; left: 0; top: 0; width:100%; height:100%; background:#000; opacity:0; transition-duration: .5s; } .product9 .channelwrapmain .channelwrap { position:absolute; left: 0; top:45%; width:100%; height:100%; transition-duration: .5s; } .product9 .channelwrapmain .channelname{ width:100%; font-size:24px; color:#444; margin:0; font-weight: bold; transition-duration: .5s; position:relative; } .product9 .channelwrapmain .y_line { width:1px; height:0; margin:0 auto; background:#fff; transition-duration: .5s; } .product9 .channelwrapmain span{ display:none; width: 140px; margin:10% auto 0; line-height: 38px; border: 1px solid #fff; text-align: center; position:relative;transition-duration: .5s; z-index:20; font-size:16px !important; } .product9 .channelwrapmain span i { margin-left:15px; } .product9 .channelwrapmain span:after{ content: ""; position: absolute; top: 0; left: 0; width:0; height:100%; background: #fff; transition-duration: .5s; z-index:-1; } .product9 li:hover .channelpicture{ } .product9 li:hover .channelwrapmain .channelwrap{ top:30%; } .product9 li:hover .channelwrapmain .channelname{ margin-bottom:20%; } .product9 li:hover .channelwrapmain .y_line { height:10%; } .product9 li:hover .channelwrapmain .channelwrapmainback { opacity:0.5; } .product9 li:hover .channelwrapmain span { display:block; } .product9 li .channelwrapmain span:hover:after { width:100%; } .product9.change4 { } .product9.change4 li { width:25%; } .product9.change4:hover li { width:23%; } .product9.change4 li:hover { width:31%; } .product9.change5 { } .product9.change5 li { width:20%; } .product9.change5:hover li { width:18.5%; } .product9.change5 li:hover { width:26%; } /*产品扩展组件10*/ .floor_product10{ max-width: 1440px; margin: 0 auto; padding:0 0; position:relative; overflow:hidden; } .floor_product10 .component_title { position:absolute; left:0; top:0; width:37%; height:100%; padding:0 5%; box-sizing:border-box; text-align:left; display:flex; align-items:center; justify-content:center; } .floor_product10 .component_title .toflex { } .floor_product10 .component_title h2 { text-align:left; } .floor_product10 .component_title .channelscontent { text-align:left; margin:4% 0; max-height:10em; line-height:2em; font-size:14px; box-sizing:content-box; overflow:hidden; } .floor_product10 .component_title .more { display:block; } .floor_product10 .component_title .more span{ display: inline-block; text-align: center; } .floor_product10 .component_body { float:right; width:63%; } .product10 { padding:0; overflow: hidden; } .product10 li { padding:0; box-sizing:border-box; overflow:hidden; } .product10 a{ display: block; position: relative; overflow: hidden; box-sizing:border-box; padding:0; background:#fff; box-shadow:0 0 10px 0 rgba(0,0,0,.1); position:relative; } .product10 .infopicture{ display: block; transition-duration: .5s; position:relative; } .product10 .infopicture img { width:100%; } .product10 .infowrapmain{ position:absolute; width:100%; height:100%; box-sizing:border-box; text-align:left; color: #444; z-index:3; } .product10 .infowrapmain .infowrapback { position:absolute; top:0; left:0; width:100%; height:100%; background:#000; opacity:0.5; } .product10 .infowrapmain .infowrap { position:absolute; top:9%; left:6%; width:88%; height:82%; padding:5%; box-sizing:border-box; border:1px solid #fff; } .product10 .infowrapmain .infotitle{ font-size:20px; color:#fff; position:relative; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; } .product10 li .infoscontent{ font-size:14px; margin-top: 10px; line-height: 1.8em; height:3.6em; color: #666; overflow:hidden; text-overflow:-o-ellipsis-lastline; text-overflow:ellipsis; display:-webkit-box; -webkit-line-clamp:3; line-clamp:3; -webkit-box-orient:vertical; } .right_floor_product10 { } .right_floor_product10 .component_title { left:auto; right:0; } .right_floor_product10 .component_body { float:left; } .floor_product10.full-width1 .component_title { padding:0 4% 0; } /*产品扩展组件11*/ .floor_product11{ position: relative; max-width: 1440px; padding:0; margin: 0 auto; } .floor_product11.full-width1 { padding:0 10px; } .product11 { margin:0; text-align:center; } .product11 li { position:relative; z-index:1; transition-duration:500ms; } .product11 li a { display:block; padding:0; transform:scale(1); margin:22% 40px 40px; box-shadow:0px 2px 20px rgba(0,0,0,0.15); box-sizing:border-box; text-align:center; transition-duration:500ms; opacity:0.7; } .product11 li .infopicture{ overflow: hidden; } .product11 li .infopicture img{ transition-duration: .5s; display:block; } .product11 li .infotitle{ padding:8px 0 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; transition-duration: .5s; } .product11 li .more{ float:none; display:inline-block; padding:0 0 8px; transition-duration:500ms; } .product11 li .more span { margin-left:10px; } .product11 li.swiper-slide-active { z-index:5; height:120%; line-height:100%; box-sizing:border-box; } .product11 li.swiper-slide-active a { transform:scale(1.4); opacity:1; } .product11 li.swiper-slide-active .infotitle { transform:scale(0.8); } .product11 li.swiper-slide-active .more { transform:scale(0.8); } /*产品扩展组件12*/ .floor_product12{ max-width: 1440px; margin: 0 auto; } .floor_product12 .component_title div { overflow-x:auto; } .floor_product12 .tabbar{ text-align: center; margin:5px 0 25px; white-space:nowrap; } .floor_product12 .tabbar li{ display: inline-block; margin: 0; white-space:normal; } .floor_product12 .tabbar li a{ display: block; padding:25px 50px; transition-duration: .3s; box-sizing:border-box; } .floor_product12 .tabbar li img { max-width:100px; margin-bottom: 2px; } .floor_product12 .tabbar li a:hover{ opacity: .7; } .floor_product12 .component_body { } .product12 .infoprice{ position: relative; } .product12 .infoprice i{ position: absolute; right: -50px; top: 0; bottom: 0; margin: auto; height: 1.5em; line-height: 1.5em; transition-duration: .5s; font-size: 20px; } .thumb-product12 li{ transition-duration: .5s; } .thumb-product12 a{ display: block; padding: 15px; margin: 8px; overflow: hidden; transition-duration: .5s; } .thumb-product12 .infopicture{ float: left; max-width: 210px; width: 40%; margin-right: 5%; } .thumb-product12 .infotitle{ font-size: 18px; font-weight: bold; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .thumb-product12 .infoscontent{ margin: 15px 0; color: #666; line-height: 1.8em; max-height: 3.6em; overflow: hidden; } .thumb-product12 .infoprice{ font-size: 20px; font-weight: bold; color: #f44336; } .thumb-product12 li a:hover{ box-shadow: 0 8px 35px rgba(0, 0, 0, .08); } .grid-product12{} .grid-product12{ position: relative; } .grid-product12:after{ content: ''; display: block; clear: both; } .grid-product12 li { width: 25%; float: left; } .grid-product12 li a{ display: block; margin: 10px; transition-duration: .5s; } .grid-product12 li .infopicture{ overflow: hidden; border-bottom-left-radius: 0; border-bottom-right-radius: 0; } .grid-product12 li img{ transition-duration: .5s; } .grid-product12 li .infowrap{ margin: 0 10px; transition-duration: .5s; } .grid-product12 li .infotitle{ font-size: 17px; text-align:center; margin: 10px 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; line-height: 1.2em; /*这里的line-height是为了兼容ie8 hover时加粗后高度不一的问题*/ } .grid-product12 li:hover a{ box-shadow: 0 5px 15px 0 rgba(0,0,0,.2); } .grid-product12 li:hover img{ transform: scale(1.1); } .grid-product12 li a:hover .infoprice i{ right: 15px; } /*产品组件13*/ .floor_product13{ max-width: 1440px; margin: 0 auto; } .floor_product13 .tabbarlist:after{ content: ""; display: block; clear: both; } .floor_product13 .tabbarlist li{ float: left; } .floor_product13 .tabbarlist li .wrap{ position: relative; padding: 15px; cursor: pointer; transition-duration: .2s; } .floor_product13 .tabbarlist li.on .wrap:after{ content: ""; position: absolute; left: 50%; margin-left: -5px; bottom: -10px; border-left: 10px solid transparent; border-right: 10px solid transparent; border-top: 10px solid; } .floor_product13 .tabbarlist .channelicon.position1{ float: left; margin-right: 10px; } .floor_product13 .tabbarlist .channelicon img { max-width: 100%; } .floor_product13 .tabbarlist .channelicon.position2{ float: right; margin-left: 10px; } .floor_product13 .tabbarlist .channelicon.position3{ text-align: center; } .floor_product13 .tabbarlist .channelicon.position4{ text-align: left; } .floor_product13 .tabbarlist .channelicon.position5{ text-align: right; } .floor_product13 .tabbarlist .channelcontent{ margin-top: 10px; padding-top: 10px; border-top: 1px solid #aaa; } .floor_product13 .swiperitem{ position: relative; } .floor_product13 .swiperitem .wrap{ display: block; overflow: hidden; } .floor_product13 .swiperitem .infowrap{ padding: 10px; } .floor_product13 .swiperitem img{ display: block; width: 100%; } .floor_product13 .prev_btn,.floor_product13 .next_btn{ position: absolute; width: 45px; height: 80px; line-height: 80px; border-radius: 4px; font-weight: bold; background: rgba(0,0,0,.3); opacity: .5; cursor: pointer; top: 0; bottom: 0; margin: auto; z-index: 9; font-size: 45px; color: #fff; transition-duration: .5s; } .floor_product13 .prev_btn:hover,.floor_product13 .next_btn:hover{ opacity: 1; } .floor_product13 .prev_btn{ left: 0; } .floor_product13 .next_btn{ right: 0; } /*产品扩展组件15*/ .floor_product15{ max-width: 1440px; margin: 0 auto; } .floor_product15 .component_body { } .product15 .infoprice{ position: relative; } .product15 .infoprice i{ position: absolute; right: -50px; top: 0; bottom: 0; margin: auto; height: 1.5em; line-height: 1.5em; transition-duration: .5s; font-size: 20px; } .product15{} .product15{ position: relative; } .product15:after{ content: ''; display: block; clear: both; } .product15 li { width: 25%; float: left; } .product15 li a{ display: block; margin: 10px; transition-duration: .5s; } .product15 li .infopicture{ overflow: hidden; border-bottom-left-radius: 0; border-bottom-right-radius: 0; } .product15 li img{ transition-duration: .5s; } .product15 li .infowrap{ margin: 0 10px; transition-duration: .5s; } .product15 li .infotitle{ font-size: 17px; text-align: left; margin:15px 0 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; line-height: 1.2em; /*这里的line-height是为了兼容ie8 hover时加粗后高度不一的问题*/ } .product15 li .infoscontent{ margin:10px 0 0; line-height: 1.8em; height: 3.6em; overflow: hidden; color: #999; text-overflow:ellipsis; display:-webkit-box; -webkit-line-clamp:2; line-clamp:2; -webkit-box-orient:vertical; } .product15 li .infoprice{ margin:0 15px 0; font-size: 16px; font-weight: bold; color: #f44336; } .product15 li .infoprice span{ font-size: .7em; font-weight: normal; } .product15 li:hover a{ box-shadow: 0 5px 15px 0 rgba(0,0,0,.2); } .product15 li:hover img{ transform: scale(1.1); } .product15 li a:hover .infoprice i{ right: 15px; } .product15 li .more { margin:10px 10px; display:block; text-align:center; padding:0; } .product15 li .more span { display:inline-block; text-align:center !important; } .product15 li.leftdiv { } .product15 li.leftdiv a { padding:8% 10%; box-sizing:border-box; } .product15 li.leftdiv .title { padding:0 0 0 4%; margin-bottom:10%; } .product15 li.leftdiv .content { padding:0 0 0 4%; margin-bottom:10%; } .product15 li.leftdiv .more { margin:0 0 0 4%; } .product15 li.leftdiv .more span { display:inline-block; text-align:center; } /*产品扩展组件16*/ .floor_product16{ margin:0 auto; } .product16{ overflow:hidden; } .product16 a{ display:block; position:relative; overflow:hidden; box-sizing:border-box; } .product16 a:hover { opacity:0.9; } .product16 .infopicture{ display:block; width:100%; transition-duration:.5s; } .product16 .infowrap{ position:absolute; left:0; bottom:0; width:100%; background:rgba(0,0,0,.3); text-align:center; color:#fff; transition-duration:.5s; padding:10px 0; } .product16 .infowrap .infotitle{ font-size:16px; color:#fff; box-sizing:border-box; } .floor_product16 .pagination{ margin:30px 0 0; text-align: center; display:none; } .floor_product16 .component_body.swiper-container .pagination { display:block; } .floor_product16 .pagination span{ display: inline-block; width:100px; line-height:1.25em; margin:0 20px; cursor: pointer; font-size:30px; color:#fff; vertical-align:middle; cursor:pointer; text-align: center; } .floor_product16 .pagination span:hover{ box-shadow: 0 0 10px rgba(0,0,0,.2) inset; } .floor_product16 .pagination span:active{ box-shadow: 0 0 20px rgba(0,0,0,.3) inset; } /*产品扩展组件17*/ .floor_product17{ margin:0 auto; } .floor_product17 .tapwrap{ overflow:hidden; float:left; margin:0 5% 0 0; } .floor_product17 ul{ display:inline-block; width:100%; text-align:center; overflow: hidden; } .floor_product17 ul li{ cursor:pointer; } .floor_product17 ul li.on{ } .floor_product17 .swiperwrap { overflow:hidden; } .floor_product17 .picture { float:left; margin:0 5% 0 0; } .floor_product17 .picture img { max-width:100%; } .floor_product17 .info_wrap { overflow:hidden; } .floor_product17 .subtitle { margin-bottom:2em; } .floor_product17 a.button { display:block; margin-top:20px; text-align:center; } .floor_product17 a.button span { display:inline-block; text-align:center; } .floor_product17 .swiper-slide{ position:relative; } .floor_product17 .style_right .tapwrap { float:right; margin:0 0 0 5%; } .floor_product17 .swiper_right .picture { float:right; margin:0 0 0 5%; } /*产品扩展组件18*/ .floor_product18{ margin:0 auto; overflow: hidden; } .floor_product18 .component_title{ float: left; position: relative; } .floor_product18 .component_title p{ padding: 10px 0 20px; max-height:4em; overflow: hidden; } .floor_product18 .component_title h2{ position: relative; padding-bottom:14px; } .floor_product18 .component_title h2.h2_2:before{ content: ""; position: absolute; left:0; bottom:-2px; width: 100px; height: 2px; margin-left:0; background: #ccc; } .floor_product18 .content{ width: 100%; } .floor_product18 .top{ position: absolute; left: 0; top: 0; z-index: 10; width:100%; padding:50px 10px 15px 40px; box-sizing: border-box; } .floor_product18 .pictures{ width: 100%; height: 100%; display: none; overflow: hidden; position: relative; } .floor_product18 .pictures::before{ content:""; width:100%; height: 100%; position: absolute; left:0; top: 0; z-index: 1; background: rgba(0, 0, 0, 0.4); } .floor_product18 .pictures:first-child{ display: block; } .floor_product18 .pictures img{ background-size: cover !important; width:100%; height: 100%; object-fit: cover; } .floor_product18 .pictures .wrap{ position: absolute; left: 0; top:150px; z-index: 10; width:100%; padding:10px 10px 15px 40px; box-sizing: border-box; } .floor_product18 .wrap img{ width: 56px; filter: grayscale(100%) brightness(900%); margin-bottom: 20px; } .floor_product18 .wrap .title{ margin-bottom:20px; } .floor_product18 .wrap .subtitle{ margin-bottom: 30px; max-height: 40vh; overflow: hidden; } .floor_product18 .component_body{ float: right; } .floor_product18 ul{ overflow:hidden; } .floor_product18 li{ display:flex; align-items:center; justify-content:center; position:relative; overflow:hidden; float:left; z-index:3; width: 20%; box-sizing:border-box; margin: 0; padding: 0; } .floor_product18 li.m0.line0:nth-child(odd),.floor_product18 li.m0.line2:nth-child(odd){ background:rgba(255, 255, 255, 0.9); } .floor_product18 li.m0.line0:nth-child(even),.floor_product18 li.m0.line2:nth-child(even){ background:rgba(255, 255, 255, 0.7); } .floor_product18 li.m0.line1:nth-child(odd){ background:rgba(255, 255, 255, 0.7); } .floor_product18 li.m0.line1:nth-child(even){ background:rgba(255, 255, 255, 0.9); } .floor_product18 li.m1:nth-child(2n){ background:rgba(255, 255, 255, 0.9); } .floor_product18 li.m1:nth-child(2n 1){ background:rgba(255, 255, 255, 0.7); } .floor_product18 li .img_wrap{ width:60px; height:60px; margin: 0px auto 10px; position: relative; overflow: hidden; } .floor_product18 li img{ display: block; width: 100%; height: 100%; z-index: 2; position: absolute; left: 0; top: 0; background-size: cover; object-fit: cover; transition: all 0.3s linear; -webkit-transition: all 0.3s linear; } .floor_product18 li .title{ padding:5px; overflow: hidden; } .floor_product18 li .img1{ transform: rotate(0); transform-origin: right bottom; } .floor_product18 li .img2{ transform: rotate(-90deg); transform-origin: left bottom; filter: grayscale(100%) brightness(900%); } .floor_product18 li:hover .img1{ transform: rotate(90deg); } .floor_product18 li:hover .img2{ transform: rotate(0); } .floor_product18 .more{ display:flex; align-items: center; margin-top:35px; height: 48px; overflow: hidden; padding-bottom: 5px;} .floor_product18 .more a{ display: block; height: 48px; text-align: center; position: relative; overflow: hidden; border: 2px solid rgba(255, 255, 255, 0.5); line-height:46px; font-size: 16px; padding:5px 25px 5px 60px; border-radius:48px; box-sizing: border-box; background: 25px center no-repeat; background-size:20px; color: #fff;} .floor_product18 .more span{ display:block; height: 100%; line-height:1em; display:flex; align-items:center; left:0; position:relative; top:0; transition: all 0.3s linear;} .floor_product18 .more:hover span { top: -100%; } .floor_product18 .pagination .prev,.floor_product18 .pagination .next{ position: absolute; left: 10px; z-index: 100; width:40px; height: 40px; line-height: 40px; text-align: center; font-size:30px; bottom:45px; cursor: pointer; border: 1px solid #999; color: #999; border-radius: 50%; display: none; } .floor_product18 .pagination .next{ left:70px; } .floor_product18 .pagination .prev:hover,.floor_product18 .pagination .next:hover{ background: rgba(100,100,100,.05); } /*==========产品扩展模型 结束==========*/ /*==========图片扩展模型 开始==========*/ /*图片扩展组件0*/ .picture0{} .picture0 .infoscontent { text-overflow: -o-ellipsis-lastline; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; line-clamp: 2; -webkit-box-orient: vertical; } .picture0 li.column2 .infoscontent { -webkit-line-clamp:4; line-clamp: 4; } .picture0 li.column3 .infoscontent { -webkit-line-clamp: 3; line-clamp: 3; } .floor_picture0{ max-width: 1440px; margin: 0 auto; } .thumb-picture0:after{ content: ""; display: block; clear: both; } .thumb-picture0 li{ transition-duration: .5s; } .thumb-picture0 a{ display: block; padding: 15px; margin: 8px; border-bottom: 1px solid #ddd; overflow: hidden; transition-duration: .5s; } .thumb-picture0.list-style4 a{ padding: 0; } .thumb-picture0 .infopicture{ float: left; width: 35%; transition-duration: .5s; } .thumb-picture0 .infotitle{ font-size: 18px; font-weight: bold; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .thumb-picture0 .infoscontent{ color: #666; overflow: hidden; } .thumb-picture0 li a:hover{ transform: translatey(-5px); box-shadow: 0 8px 35px rgba(0, 0, 0, .08); } .thumb-picture0 li a:hover .infopicture{ transform: scale(1.05); } .grid-picture0{} .grid-picture0:after{ content: ''; display: block; clear: both; } .grid-picture0 li{ width: 33.33333%; float: left; } .grid-picture0 li a{ display: block; margin: 0 10px; transition-duration: .5s; } .grid-picture0 li .infotitle{ font-size: 17px; margin: 10px 0; text-align: left; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; transition-duration: .3s; } .grid-picture0 li .infoscontent{ padding-right: 20px; margin: 10px 0; overflow: hidden; color: #999; box-sizing: border-box; transition-duration: .3s; } .grid-picture0 li .infowrap{ position: relative; transition-duration: .2s; } .grid-picture0 li .infowrap:after{ content: ''; position: absolute; left: 10px; right: 10px; box-sizing: border-box; height: 1px; background: #ddd; bottom: 55px; transition-duration: .5s; transform-origin: 0 0; transform: scalex(0); } .grid-picture0 .infopicture{ overflow: hidden; } .grid-picture0 img{ width: 100%; transition-duration: .5s; } .grid-picture0 li:hover a{ background: #fff; box-shadow: 0 18px 25px rgba(0,0,0,.1); } .grid-picture0.list-style4 li:hover .infowrap{ transform: scale(.95); } .grid-picture0 li:hover img{ transform: scale(1.1); } .grid-picture0 li:hover .infotitle{ transform: translatey(-5px); } .grid-picture0 li:hover .infoscontent{ transform: translatey(5px); } .grid-picture0 li:hover .infowrap:after{ transform: scalex(1); } /*图片扩展组件1*/ .floor_picture1 { max-width: 1440px; padding: 0 10px; margin: 0 auto; } .picture1{ overflow: hidden; } .picture1 a{ display: block; position: relative; margin:0; } .picture1 a.themargin2 { margin:2px; } .picture1 a.themargin5 { margin:5px; } .picture1 a.themargin10 { margin:10px; } .picture1 a.themargin20 { margin:20px; } .picture1 .infopicture{ background: #000; overflow: hidden; } .picture1 .infopicture img{ transition-duration: .5s; } .picture1 .infowrap{ position: absolute; position: absolute; top: 30%; left: 10%; right: 10%; text-align: center; color: #fff; } .picture1 .infowrap .infotitle{ font-size: 18px; font-weight: bold; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; opacity: 0; transform: translatey(10px); transition-duration: .5s; } .picture1 .infowrap .infoscontent{ line-height: 1.8em; height: 3.6em; overflow: hidden; margin-top: 10px; opacity: 0; transform: translatey(20px); transition-duration: .5s; } .picture1 a:hover img{ opacity: .7; transform: scale(1.1); } .picture1 a:hover .infotitle{ transform: translatey(0); opacity: 1; } .picture1 a:hover .infoscontent{ transform: translatey(0); opacity: 1; } /*图片扩展组件2*/ .floor_picture2{ position: relative; max-width: 1440px; padding: 0 60px; margin: 0 auto; } .floor_picture2 .pagination .prev,.floor_picture2 .pagination .next{ position: absolute; left: 10px; width: 40px; height: 100px; line-height: 100px; text-align: center; font-size: 40px; top: 0; bottom: 0; margin: auto; cursor: pointer; border: 1px solid #999; border-radius: 3px; color: #999; } .floor_picture2 .pagination .next{ left: auto; right: 10px; } .floor_picture2 .pagination .prev:hover,.floor_picture2 .pagination .next:hover{ background: rgba(0,0,0,.1); } .floor_picture2 .pagination .prev:active,.floor_picture2 .pagination .next:active{ box-shadow: 0 0 10px rgba(0,0,0,.1) inset; } .picture2{ overflow: hidden; } .picture2 a{ display: block; padding: 4px; background: #fff; margin: 10px 5px; box-shadow: 0 0 10px 0 rgba(0,0,0,.1) } .picture2 .infotitle{ padding: 8px 10px 6px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; transition-duration: .5s; } .picture2 li .infopicture{ overflow: hidden; } .picture2 li .infopicture img{ transition-duration: .5s; } .picture2 li:hover img{ transform: scale(1.1); } /*图片扩展组件3*/ .floor_picture3 { max-width:1440px; margin: 0 auto; } .picture3 { overflow: hidden; } .picture3 li{ width: 50%;overflow: hidden; float: left; height:240px; } .picture3 li .infopicture{ float:right; width:50%; height:100%; background: no-repeat center; background-size:cover; } .picture3 li .infowrap{ float:left; width:50%; height:100%; text-align:center; position:relative; padding:20px 20px 0; box-sizing:border-box; } .picture3 li .infowrap .x_line { position:absolute; top:50%; left:auto; right:-21px; width:30px; height:30px; margin-top:-15px; font-size:30px; } .picture3 li .infowrap .x_line2 { display:none; } .picture3 li .infowrap .infotitle{ font-size:18px; margin:30px 0 20px; } .picture3 li .infowrap .infoscontent{ font-size:14px; line-height:1.8em; } .picture3 li.m2 .infopicture, .picture3 li.m3 .infopicture { float:left; } .picture3 li.m2 .infowrap .x_line, .picture3 li.m3 .infowrap .x_line { left:-21px; right:auto; } .picture3 li.m2 .infowrap .x_line1, .picture3 li.m3 .infowrap .x_line1 { display:none; } .picture3 li.m2 .infowrap .x_line2, .picture3 li.m3 .infowrap .x_line2 { display:block; } /*图片扩展组件4*/ .floor_picture4 { max-width:1440px; margin: 0 auto; padding: 0 10px; position:relative; } .floor_picture4 .pagination .prev,.floor_picture4 .pagination .next{ position: absolute; left:50px; right:auto; width:70px; height:70px; line-height:70px; text-align:center; font-size:36px; top: 0; bottom: 0; margin: auto; cursor: pointer; border: 1px solid #999; border-radius:100%; color:#999; } .floor_picture4 .pagination .next{ left: auto; right:50px; } .floor_picture4 .pagination .prev:active,.floor_picture4 .pagination .next:active{ box-shadow: 0 0 10px rgba(0,0,0,.1) inset; } .picture4 { position:relative; padding:0 0 50px; overflow:hidden; } .picture4 { } .picture4 li { } .picture4 li .infopicture { float:left; margin-right:20px; max-width:50%; } .picture4 li .infopicture img { max-width:100%; width:auto; } .picture4 li .infowrap { overflow:hidden; } .picture4 li .infotitle { padding:10px 0; font-size:24px; line-height:50px; margin-bottom:20px; position:relative; } .picture4 li .infotitle:before { content:""; position:absolute; bottom:0; left:0; width:30%; height:1px; background:#ddd; } .picture4 li .infoscontent { font-size:16px; color:#888; line-height:2em; } .picture4 li .more_btn { margin-top:20px; } .picture4 .swiper-pagination { bottom:0; } .picture4 .swiper-pagination-switch { border-color:#ccc; background:#ccc; width:12px; height:12px; margin:0 10px; } .picture4 .swiper-active-switch { border-color:#888; background:#888; } .right-picture4 li .infopicture{ float: right; margin-left: 15px; margin-right: 0; } /*图片扩展组件5*/ .floor_picture5 { max-width:1440px; margin:0 auto; } .picture5 { } .picture5 { } .picture5 li { } .picture5 li .infopicture{ background: no-repeat center; background-size:cover; } .picture5 li .infowrap { padding:8% 5% 0; box-sizing:border-box; overflow:hidden; } .picture5 li .num { font-size:40px; text-align:center; margin-bottom:10px; } .picture5 li .infotitle { font-size:20px; margin:0 0 10px; text-align:center; } .picture5 li .infoscontent { font-size:14px; line-height:1.8em; max-height:5.4em; overflow:hidden; } /*图片扩展组件6*/ .floor_picture6 { max-width: 1440px; margin:0 auto; } .picture6 { } .floor_picture6 .component_title { float:left; width:33.33%; padding:50px 25px 0; text-align:right; box-sizing:border-box; } .floor_picture6 .component_title h2 { font-size:24px; text-align:right; color:inherit; } .floor_picture6 .component_title h2.h2_2:before{ right: 0; margin: 0; left: auto; } .floor_picture6 .component_title p { font-size:18px; margin:20px 0; text-align:right; color:inherit; } .floor_picture6 .pagination .prev, .floor_picture6 .pagination .next{ display:inline-block; *zoom:1; *display:inline; width:40px; height:40px; line-height:40px; text-align:center; font-size:20px; margin:0 0 0 20px; cursor: pointer; border:1.5px solid #fff; color:#fff; font-weight:bold; } .floor_picture6 .component_body { float:left; width:66.66%; } .picture6 li { width:430px; } .picture6 li a { width:400px; display:block; height:100%; position:relative; margin-left:30px; overflow:hidden; } .picture6 li .infopicture { height:100%; } .picture6 li .infowrap { position:absolute; left:0; bottom:100%; width:100%; height:100%; padding:50px 30px 30px; box-sizing:border-box; background:#000; background:rgba(0,0,0,.8); color:#fff; transition-duration:.5s; z-index:10; } .picture6 li .infowrap .view { text-align:center; margin-top:15px; } .picture6 li h4 { position:absolute; bottom:0; left:0; width:320px; margin:0 40px; line-height:44px; text-align:center; font-size:16px; padding:0 0px; box-sizing:border-box; transition-duration: .5s; } .picture6 li h4 div { overflow:hidden; white-space:nowrap; text-overflow:ellipsis; position:relative; z-index:4; } .picture6 li h4:before { background-color:rgb(17, 107, 196); bottom:0px; content:""; height:100%; left:-25px; position:absolute; transform:skewx(-40deg); width:50px; z-index:2; transition-duration:.5s; } .picture6 li h4:after { background-color:rgb(17, 107, 196); bottom:0px; content:""; height:100%; position:absolute; right:-25px; transform:skewx(40deg); width:50px; transition-duration:.5s; } .picture6 li .infowrap:before { background-color:rgba(0,0,0,.8); bottom:-50px; content:""; height:50px; left:-25px; position:absolute; transform:skewx(-40deg); -webkit-transform:skewx(-40deg); width:40px; } .picture6 li .infowrap:after { background-color:rgba(0,0,0,.8); bottom:-50px; content:""; height:50px; right:-25px; position:absolute; transform:skewx(40deg); -webkit-transform:skewx(40deg); width:40px; } .picture6 li:hover .infowrap { bottom:0; } .picture6 li:hover h4 { background-color:#000 !important; color: #fff !important; } .picture6 li:hover h4:before,.picture6 li:hover h4:after { background-color:#000 !important; } /*图片扩展组件8*/ .floor_picture8 { max-width: 1440px; margin:0 auto; } .picture8 { overflow:hidden; } .component .picture8 .col2{ width:540px; } .component .picture8 .col3{ width:360px; } .component .picture8 .col4{ width:270px; } .component .picture8 .col5{ width:216px; } .floor_picture8 .component_title { float:left; width:25%; padding:20px; box-sizing:border-box; } .floor_picture8 .component_title h2 { width:100%; } .floor_picture8 .component_title h2.h2_2:before{ right: 0; margin: 0; left: auto; } .floor_picture8 .component_title p { width:100%; margin:0px 0 20px; padding:0; } .floor_picture8 .pagination { width:100%; } .floor_picture8 .pagination .prev, .floor_picture8 .pagination .next{ display:inline-block; text-align:center !important; font-size:20px !important; font-weight:normal !important; font-style:normal !important; border:1px solid #ccc; border-radius:50%; width:40px; height:40px; line-height:40px; margin:0 10px; cursor: pointer; } .floor_picture8 .component_body { float:left; width:75%; } .picture8 li { } .picture8 li a { display:block; position:relative; margin:4%; overflow:hidden; box-shadow:rgba(0,0,0,.2); position:relative; } .picture8 li a:before { position:absolute; content:""; bottom:0; left:0; width:100%; height:3px; } .picture8 li:hover a:before { height:0; } .picture8 li .infopicture { } .picture8 li .infowrap { padding:5%; box-sizing:border-box; transition-duration:.5s; z-index:10; } .picture8 li .infowrap .infoscontent { margin-top:10px; } .picture8 li .infowrap .more { margin-top:10px; } .picture8 li .infowrap .more span { display:inline-block; text-align:center; } .picture8 li h4 { margin:0 40px; text-align:center;padding:0 0px; box-sizing:border-box; transition-duration: .5s; } .picture8 li h4 div { overflow:hidden; white-space:nowrap; text-overflow:ellipsis; position:relative; z-index:4; } /*图片扩展组件9*/ .floor_picture9{ max-width: 1440px; margin: 0 auto; } .floor_picture9 .component_title div { overflow-x:auto; } .floor_picture9 .tabbar{ text-align: center; margin:5px 0 25px; white-space:nowrap; } .floor_picture9 .tabbar li{ display: inline-block; margin: 0; white-space:normal; } .floor_picture9 .tabbar li a{ display: block; padding:25px 50px; transition-duration: .3s; box-sizing:border-box; } .floor_picture9 .tabbar li img { max-width:100px; margin-bottom: 2px; } .floor_picture9 .tabbar li a:hover{ opacity: .7; } .floor_picture9 .component_body { box-sizing:border-box; } .picture9 li { transition-duration: .5s; float:left; width:25%; box-sizing:border-box; } .picture9 li.n1 { width:50%; } .picture9 li a{ display:block; overflow:hidden; transition-duration:.5s; position:relative; } .picture9 li .infopicture{ width:100%; background:none; } .picture9 li .infopicture img { background:none; } .picture9 li.n1 { } .picture9 li .infowrap { position:absolute; left:5%; width:90%; height:90%; top:40%; opacity:0; transition-duration:.5s; display:flex; align-items:center; justify-content:center; } .picture9 li.n1 .infowrap { left:auto; right:-100%; margin-right:85px; top:auto; bottom:0; width:100%; height:60px; opacity:1; background:#f00; color:#fff; text-align:left; display:block; } .picture9 li.n1 .infowrap .theicon { display:inline-block; width:85px; height:60px; line-height:60px; font-size:40px; position:relative; vertical-align:middle; text-align:center; } .picture9 li.n1 .infowrap .infotitle { display:inline-block; width:calc(100% - 170px); vertical-align:middle; line-height:60px; } .picture9 li.n1:hover .infowrap .infotitle { border:0; } .picture9 li.n1:hover .infowrap { right:-85px; top:auto; } .picture9 li.n1 .infowrap .ydicon-left3 { display:none; } .picture9 li.n1:hover .infowrap .ydicon-right3 { display:none; } .picture9 li.n1:hover .infowrap .ydicon-left3 { display:inline-block; } .picture9 li a:hover .infowrap { top:5%; opacity:1; } .picture9 li .infowrap>div { } .picture9 li .infochannel{ } .picture9 li .infotitle{ border:1px solid #fff; border-left:0; border-right:0; text-overflow:ellipsis; white-space:nowrap; overflow:hidden; } .picture9 li.n1 .infotitle { border:0; } .picture9 .contact { float:left; display:block; width:50%; position:relative; box-sizing:border-box; } .picture9 .contact img.picture { display:block; width:100%; } .picture9 .contact .contact_content { position:absolute; top:20%; left:10%; width:80%; height:80%; overflow:hidden; } /*图片扩展组件10*/ .floor_picture10{ position: relative; max-width: 1440px; margin: 0 auto; } .picture10{ overflow: hidden; } .picture10 li { float: left; transition: all ease-in .3s; } .picture10.show_num3 li { width:25%; } .picture10.show_num3 li.n2 { width: 50%; } .picture10.show_num3 li.on { width:50%; } .picture10.show_num5 li { width:16.6%; } .picture10.show_num5 li.n3 { width: 33.6%; } .picture10.show_num5 li.on { width:33.6%; } .picture10.show_num7 li { width:12.5%; } .picture10.show_num7 li.n4 { width: 25%; } .picture10.show_num7 li.on { width:25%; } .picture10 li a{ display: block; } .picture10 li .infotitle{ padding: 8px 10px 6px; white-space: nowrap; overflow: hidden; text-align: left; text-overflow: ellipsis; transition-duration: .5s; } .picture10 li .infopicture { overflow: hidden; } .picture10 li .infopicture img{ width: auto; transition-duration: .5s; } .picture10.show_shadow1 li .infopicture{ position: relative; } .picture10.show_shadow1 li .infopicture:before { content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,.7); transition: all ease-in .3s; } .picture10.show_shadow1 li.on .infopicture:before { opacity: 0; } .picture10 li.on .infotitle { text-align: center; } /*图片扩展组件11*/ .floor_picture11{ position: relative; max-width: 1440px; margin: 0 auto; } .picture11{ overflow: hidden; } .picture11 li { float: left; height:650px; transition: all ease-in .3s; } .picture11.show_num3 li { width:25%; } .picture11.show_num3 li.on { width:50%; } .picture11.show_num4 li { width:20%; } .picture11.show_num4 li.on { width:40%; } .picture11.show_num5 li { width:16.6667%; } .picture11.show_num5 li.on { width:33.3334%; } .picture11.show_num6 li { width:14.2857%; } .picture11.show_num6 li.on { width:28.5714%; } .picture11.show_num7 li { width:12.5%; } .picture11.show_num7 li.on { width:25%; } .picture11 li .wrap{ display: block; height: 100%; position: relative; } .picture11 li .infotitle{ white-space: nowrap; overflow: hidden; text-align: left !important; padding-bottom: 15px; text-overflow: ellipsis; transition-duration: .5s; } .picture11 li .infoscontent{ max-height:7.2em; overflow: hidden; } .picture11 li .channelicon{ position: absolute; bottom:60%; left:20px; z-index: 1; } .picture11 li .infopicture { height: 100%; overflow: hidden; position: relative; } .picture11 li .infopicture img{ position: absolute; width: auto; min-width: 100%; min-height: 100%; transition-duration: .5s /*object-fit: cover; height:700px; min-width:100%; transition-duration: .5s; */} .picture11.show_shadow1 li .infopicture{ position: relative; } .picture11.show_shadow1 li .infopicture:before { content:""; position: absolute; top: 0; left: 0; z-index: 1; width: 100%; height: 100%; background: rgba(42,51,66,.7); transition: all ease-in .3s; } .picture11.show_shadow1 li.on .infopicture:before { opacity: 0; } .picture11 li .num{ display: none; } .picture11 li .infowrap{ width: 100%; height:50%; position: absolute; bottom:20px; left: 0; z-index: 5; box-sizing: border-box; padding:20px; } .picture11 li .add{ font-size:34px; color:#fff; padding-top: 20px; } .picture11 li.on .infowrap{ width:calc(100% - 40px); margin-left:20px; background:#fff; padding:60px 25px 25px; border-radius: 7px; } .picture11 li.on .num{ display: block; position: absolute; left:25px; top: -1em; z-index: 5; } .picture11 li.on img{ transform:scale(1.2,1.2); -webkit-transform:scale(1.2,1.2); } .picture11 li.on .add,.picture11 li.on .channelicon{ display: none; } .picture11 .infoalbumlist{ overflow: hidden; padding-top:20px; opacity: 0;} .picture11 li.on .infoalbumlist{ opacity: 1;} .picture11 .infoalbumlist img{ vertical-align: middle; width:18px; margin-right:0; } .picture11 .infoalbumlist .albumtitle{ float: left; font-size: 15px; padding-right:20px; } /*图片扩展组件12*/ .floor_picture12.full-width1{ padding-right:25px; } .floor_picture12 { max-width: 1440px; margin:0 auto; overflow: hidden; } .floor_picture12 .picture12 { width: 100%; overflow:hidden; } .floor_picture12 .component_title { float:left; width:25%; padding:10px 20px 20px 40px; box-sizing:border-box; } .floor_picture12 .component_title h2 { width:100%; position: relative; } .floor_picture12 .component_title h2.h2_2:before{ content: ""; position: absolute; left:0; bottom:-2px; width: 100px; height: 2px; margin-left:0; background: #ccc; } .floor_picture12 .component_title p { width:100%; margin:15px 0 35px; padding:0; } .floor_picture12 .pagination { width:100%; padding-top: 25px; } .floor_picture12 .pagination .prev, .floor_picture12 .pagination .next{ display:inline-block; text-align:center !important; font-size:20px !important; font-weight:normal !important; font-style:normal !important; width:40px; height:40px; line-height:40px; cursor: pointer; } .floor_picture12 .pagination .prev{ background: #fff !important; } .floor_picture12 .pagination .next{ color:#fff !important; } .floor_picture12 span.prev:hover{ color:#fff !important; } .floor_picture12 .component_body { float:left; width:75%; } .picture12 .picturelist { width: 100%; overflow:hidden; } .picture12 li{ float: left; box-sizing:border-box; } .picture12 li a { margin:0 10px; display:block; overflow:hidden; position:relative; } .picture12 li a::before{ content:""; width:120%; background: rgba(38,38,38,0.3); height:100%; position: absolute; top:0; left:-12%; z-index: 1; transform: translatex(0); opacity: 0;} .picture12 li img{ height: 100%; width: 100%;object-fit: cover; vertical-align: middle; transition: all 0.6s ease-out 0s } .picture12 li .infowrap{ overflow: hidden; box-sizing: border-box; width:100%; height:100%; position: absolute; top:0; left: 0; z-index:2; opacity:0; padding:15px 30px; transition: all 0.6s ease-out 0s; transform: translatex(20px); } .picture12 li .infowrap .infotitle { margin-top:10px; text-align: left; } .picture12 li .infowrap .infoscontent { padding-top: 20px; text-align: left; } .picture12 li:hover a::before{ opacity: 1; } .picture12 li:hover .infowrap{ opacity: 1; transform: translatez(0); } .picture12 li:hover img{ transform: scale(1.1,1.1); } /*==========图片扩展模型 结束==========*/ /*==========视频扩展模型 开始==========*/ /*视频扩展组件0*/ .floor_video0{ max-width: 1440px; margin: 0 auto; } .video0 li .infopicture{ position: relative; overflow: hidden; } .video0 li i{ position:absolute; width: 50px; height: 50px; top: 0; left: 0; bottom: 0; right: 0; margin: auto; cursor:pointer; transition-duration: .5s; } .video0 .infotitle{ transition-duration: .5s; } .video0 li img{ transition-duration: .5s; } .thumb-video0 li{ overflow: hidden; float: none; width: 100% !important; } .thumb-video0 a{ overflow: hidden; margin:10px 5px 0 !important; display: flex; align-items: center; } .thumb-video0 .infopicture{ background: #000; float: left; margin-right: 50px; width: 35%; } .thumb-video0 .infowrap{ overflow: hidden; flex: 1; } .thumb-video0 .infotitle{ font-size: 20px; font-weight: bold; color: #333; } .thumb-video0 .infoscontent{ color: #999; padding-top: 20px; margin-top: 20px; border-top: 1px solid #ddd; } .thumb-video0 li:hover img{ transform: scale(1.15); opacity: .6; } .grid-video0:after{ content: ''; display: block; clear: both; } .grid-video0{ margin-top:5px; } .grid-video0 li { width: 25%; float:left; } .grid-video0 li a{ display:block; margin: 5px; transition-duration: .3s; } .grid-video0 li img { display: block; width: 100%; transition-duration: .5s; } .grid-video0 li .infotitle{ position: relative; padding: 10px 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .grid-video0 li .infotitle:after{ content: ''; position: absolute; left: 0; top: 50%; margin-top: -2px; height: 4px; width: 0; transition-duration: .5s; } .grid-video0 li .infoscontent{ margin-bottom: 10px; line-height: 1.5em; height: 3em; overflow: hidden; font-size: 13px; color: #999; text-align: justify; } .grid-video0 li:hover img{ transform: scale(1.1); } .grid-video0 li:hover a{ box-shadow: 0 10px 20px rgba(0,0,0,.1); } .grid-video0.list-style4 li:hover a{ box-shadow: none; } .grid-video0 li:hover .infotitle{ text-indent: 15px; } .grid-video0 li:hover .infotitle:after{ width: 15px; } .grid-video0 li i:hover{ transform: scale(1.1); } /*视频扩展组件1*/ .video1{ text-align: center; } .video1 .video_wrap { display:inline-block; position:relative; } .video1 video{ width: 100%; } .video1 .video_poster { position:absolute; top:0; left:0; width:100%; height:100%; } .video1 .video_poster img { display:block; width:100%; height:100%; } .video1 .video_poster i { position:absolute; width:70px; height:70px; color:#fff; top:50%; left:50%; transform:translate(-50%,-50%); z-index:10; cursor:pointer; border-radius:50%; border:5px solid #fff; } .video1 .video_poster i:before { width:70px; height:70px; line-height:70px; font-size:44px; background:none; } /*视频扩展组件2*/ .video2{ overflow: hidden; } .video2 .infopicture{ position: relative; max-height: 600px; overflow: hidden; background: #000; display: flex; align-items: center; justify-content: center; } .video2 img{ width: 100%; transition-duration: .5s; } .video2 i{ position: absolute; left: 0; right: 0; top: 0; bottom: 0; width: 46px; height: 46px; margin: auto; cursor: pointer; transition-duration: .5s; } .video2 .infotitle{ font-size: 20px; margin: 10px 0; font-weight: bold; color: #666; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; transition-duration: .5s; } .video2 a{ display: block; width: 100%; text-align: center; box-sizing: border-box; max-width: 800px; margin: 0 auto; transition-duration: .5s; } .video2 a .infoscontent{ margin: 10px 0; color: #888; } .floor_video2 .swiper-pagination .swiper-pagination-switch{ background-color: #fff; width: 8px; border: 0; } .floor_video2 .swiper-pagination .swiper-active-switch{ width: 16px; } .video2 .infopicture:hover img{ transform: scale(1.1); opacity: .8; } .video2 i:hover{ transform: scale(1.1); } .video2 a:hover{ transform: translatex(5px); } /*视频扩展组件3*/ .floor_video3{ } .floor_video3 .component_body { overflow: hidden; } .floor_video3 .thevideo{ position:relative; overflow: hidden; background: #000; display: flex; align-items: center; justify-content: center; max-width:60%; } .floor_video3 .video_left .thevideo{ float:left; } .floor_video3 .video_right .thevideo{ float:right; } .floor_video3 .thevideo img { width:100%; } .floor_video3 i{ position: absolute; left: 0; right: 0; top: 0; bottom: 0; width:52px; height:52px; margin: auto; cursor: pointer; transition-duration: .5s; } .floor_video3 i.ydicon-play:before { width:52px; height:52px; line-height:52px; } .floor_video3 .thecontent { overflow:hidden; } /*视频扩展组件4*/ .floor_video4{ position: relative; max-width: 1440px; padding: 0; margin: 0 auto; position: relative; } .floor_video4 .pagination .prev,.floor_video4 .pagination .next{ position: absolute; left:10%; z-index:100; width:50px; height: 50px; line-height: 50px; text-align: center; font-size:30px; top: 0; bottom: 0; margin: auto; cursor: pointer;; border-radius: 50%; color: #999; } .floor_video4 .pagination .next{ left: auto; right:10%; } .floor_video4 .pagination .prev:hover,.floor_video4 .pagination .next:hover{ background: rgba(0, 0, 0, 0.1); } .floor_video4 .pagination .prev:active,.floor_video4 .pagination .next:active{ box-shadow: 0 0 10px rgba(0,0,0,.1) inset; } .floor_video4 .swiper-prev-area,.floor_video4 .swiper-next-area{ position: absolute; top: 0; z-index: 99; height: 100%; z-index:101; } .floor_video4 .swiper-prev-area{ left: 0; overflow: hidden; display: flex; justify-content: flex-end; box-sizing: border-box; } .floor_video4 .swiper-next-area{ right: 0; } .floor_video4 .swiper-prev-area .videobox{ display: none; } .floor_video4 .swiper-prev-area .bg_img{ object-fit: cover; height: 100%; -webkit-animation-name: slideinleft; animation-name: slideinleft; animation-duration: 1.00s; animation-fill-mode: both; } .floor_video4 .component_body{ margin-top: 15px; overflow: hidden; } .floor_video4 .video4{ width: 100%; overflow: hidden; } .floor_video4 .video4 li{ float: left; width:33.33%; overflow: hidden; } .floor_video4 .video4 li .box{ width: 100%; height: 100%; box-sizing: border-box; overflow: hidden; position: relative; } .floor_video4 .video4 li .video_wrap{ display: flex; justify-content: center; } .floor_video4 .video4 li.pause .videobox{ display: none; } .floor_video4 .video4 li .pause_img{ display: none; } .floor_video4 .video4 li .bg_img{ object-fit: cover; width: 100%; height: 100%; } .floor_video4 .video4 li.pause .pause_img{ display: block; } .floor_video4 li .video_wrap{ width:100%; height: 100%; } .floor_video4 li .wrap{ width:100%; height: 100%; position:absolute; left: 0; top: 0; z-index: 1; } .floor_video4 li .info_wrap{ display: block; text-align: center; padding-top: 20px; opacity: 0; transform: all ease 0.4s; } .floor_video4 li.swiper-slide-active .info_wrap{ opacity: 1; } .floor_video4 li .title{ padding-bottom: 10px; } .floor_video4 li p{ padding-bottom: 10px; } .floor_video4 .more_btn{ margin:15px auto 0; display: block;} .floor_video4 .swiper-pagination-switch{ height:2px; width: 16px; background-color: rgba(0, 0, 0, 0.3); border-radius:60px; opacity: 1; border: none; } /*==========视频扩展模型 结束==========*/ /*==========我们的团队列表组件 开始==========*/ /*团队扩展组件1*/ .floor_team1{ max-width:1440px; margin:0 auto; padding:0 10px; box-sizing:border-box; } .team1 { overflow:hidden; } .team1 li { } .team1 li a { display:block; padding:15px; } .team1 li .infopicture { } .team1 li .infowrap { padding:30px 25px 36px; background:#ffffff; transition:all 0.4s ease 0s; top:0px; position:relative; box-shadow:0 0 20px 0 rgba(0,0,0,.15); } .team1 li .infowrap .infotitle { text-align:left; color:#3c3c3c; font-size:18px; line-height:40px; } .team1 li .infowrap .infotitle span { padding-left:10px; display:inline-block; color:#999; font-size:12px; } .team1 li .infowrap .infocontent { margin-top:10px; color:#666; line-height:1.8em; height:5.4em; overflow:hidden; } .team1 li:hover .infowrap { position:relative; padding-top:40px; padding-bottom:46px; margin-top:-20px; } .team1 li:hover .infowrap .infotitle { color:#ffffff; } .team1 li:hover .infowrap .infotitle span { color:#ddd; } .team1 li:hover .infowrap .infocontent { color:#fff; } /*团队扩展组件2*/ .floor_team2 { max-width:1440px; margin:0 auto; padding:0 10px; box-sizing:border-box; } .team2 { overflow:hidden; } .team2 li { margin:15px 0; } .team2 li a { display:block; } .team2 li .infopicture { float:left; max-width:50%; margin-right:25px; } .team2 li .infowrap { padding:20px 25px; } .team2 li .infowrap .infotitle { display:block; width:100%; text-align:left; font-size:18px; line-height:2em; color:#fff; font-weight:bold; } .team2 li .infowrap .infoscontent { display:block; width:100%; text-align:left; font-size:14px; line-height:2em; color:#fd3c3c; font-weight:bold; } .team2 li .infowrap .infocontent { width:100%; margin:10px 0; } .team2 li .infowrap .infocontent p { font-size:14px; line-height:2em; color:#b8b8b8; height:6em; text-overflow:-o-ellipsis-lastline; overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-line-clamp:3; line-clamp:3; -webkit-box-orient:vertical; } .team2 li .infowrap .view1 { display:inline-block; width:32px; height:32px; font-size:32px !important; font-weight:normal !important; font-style:inherit !important; color:#b8b8b8; text-decoration:none !important; line-height:32px !important; } /*团队扩展组件3*/ .floor_team3 { max-width:1440px; margin:0 auto; padding:0 10px; box-sizing:border-box; } .floor_team3 .component_body { position:relative; padding-bottom:40px; } .floor_team3 .swiper-pagination { bottom:0; } .floor_team3 .swiper-pagination-switch { border-color:#999; width:10px; height:10px; } .floor_team3 .swiper-active-switch { background:#999; } .team3 { overflow:hidden; } .team3 li { margin:0; width:480px; } .team3 li a { display:block; margin:0 6%; padding:0; background:#fff; } .team3 li .infopicture { } .team3 li .infowrap { padding:30px 30px 15px; box-sizing:border-box; } .team3 li .infowrap .infotitle { text-align:left; color:#000; font-size:18px; } .team3 li .infowrap .infoscontent { color:#777; } .team3 li .infowrap .infocontent { color:#777; overflow:hidden; } .team3 li .infowrap .more { float:none; display:block; height:34px; line-height:32px; text-align:center; font-size:12px; color:#999; border:1px solid #999; margin-top:20px; box-sizing:border-box; } .team3 li .infowrap .more:hover { background:#000; color:#fff; border:0; line-height:34px; } /*团队扩展组件4*/ .floor_team4 { max-width:1440px; margin:0 auto; padding:0 10px; box-sizing:border-box; } .floor_team4 .swiper-pagination { text-align:right; bottom:20%; padding-right:10%; box-sizing:border-box; } .floor_team4 .swiper-pagination-switch { border:0; width:4px; height:4px; margin:8px 16px; background:#333; position:relative; } .floor_team4 .swiper-pagination-switch:before { content:""; position:absolute; left:-8px; top:-8px; width:4px; height:4px; padding:2px; margin:4px; border:2px solid #333; opacity:0; transition:all 0.5s ease 0s; border-radius:50%; } .floor_team4 .swiper-pagination-switch:hover:before { padding:5px; margin:1px; opacity:1; } .floor_team4 .swiper-active-switch:before { padding:5px; margin:1px; opacity:1; } .team4 { overflow:hidden; } .team4 li { margin:0; } .team4 li a { display:block; margin:0; padding:3%; box-sizing:border-box; } .team4 li .infopicture { float:left; width:45%; padding:3%; box-sizing:border-box; } .team4 li .infopicture img { max-width:100%; } .team4 li .infowrap { float:left; width:50%; margin:10% 0 0 5%; padding:5% 0; box-sizing:border-box; } .team4 li .infowrap .infotitle { text-align:left; color:#000; font-size:18px; line-height:40px; } .team4 li .infowrap .infoscontent { color:#777; line-height:1.4em; padding:2% 0; } .team4 li .infowrap .infocontent { color:#777; line-height:2.2em; height:11em; overflow:hidden; } .team4 li .infowrap .view1 { width:16px; padding:20px 40px 20px 25px; transition:all 0.4s ease 0s; color:#333; font-size:14px; } .team4 li .infowrap .view1:hover { padding:20px 40px 20px 0; } /*团队扩展组件5*/ .floor_team5{ max-width:1440px; margin:0 auto; padding:0 10px; box-sizing:border-box; } .team5 { overflow:hidden; } .team5 li { float:left; width:25%; transition:all 0.5s ease 0s; } .team5 li a { display:block; padding:0; position:relative; overflow:hidden; } .team5 li .infopicture { display:flex; align-items:center; justify-content:center; width:100%; overflow:hidden; } .team5 li .infopicture img { display:block; width:auto; max-width:none; } .team5 li .infotitle1 { height:30px; width:80px; line-height:30px; position:absolute; left:0; bottom:20px; text-align:center; color:#fff; z-index:2; } .team5 li .infotitle1 div { position:absolute; top:0; left:0; width:100%; height:100%; opacity:0.8; z-index:-1; } .team5 li .infowrap { opacity:0; position:absolute; left:87px; top:7px; right:7px; height:calc(100% - 30px); margin:8px; padding:30px 25px 36px; background:#ffffff; transition:all 0.4s ease 0s; box-sizing:border-box; transition:all 0.5s ease 0s; box-shadow:0 0 20px 0 rgba(0,0,0,.2); } .team5 li .infowrap .infotitle { text-align:left; color:#3c3c3c; font-size:18px; line-height:40px; } .team5 li .infowrap .infotitle span { padding-left:10px; display:inline-block; color:#999; font-size:12px; } .team5 li .infowrap .infocontent { margin-top:10px; color:#666; line-height:1.8em; height:5.4em; overflow:hidden; } .team5 li { width:22%; } .team5 li.hover { width:34%; } .team5 li.hover .infowrap { opacity:1; } /*团队扩展组件6*/ .floor_team6 { max-width:1440px; margin:0 auto; padding:0 10px; box-sizing:border-box; } .floor_team6 .component_body { position:relative; }s .floor_team6 .swiper-pagination { bottom:0; } .floor_team6 .swiper-pagination-switch { border-color:#999; width:10px; height:10px; } .floor_team6 .swiper-active-switch { background:#999; } .team6 { overflow:hidden; } .team6 li { margin:0; } .team6 li a { display:block; margin:10px; padding:10px; background:#fff; box-sizing:border-box; } .team6 li .infowrap { overflow:hidden; } .team6 li .infopicture { float:left; margin-right:5%; } .team6 li .infopicture img { width:50px; height:50px; border-radius:50%; display:block; } .team6 li .infowrap .infotitle { } .team6 li .infowrap .infoscontent { } .team6 li .infocontent { margin-top:10px; } .team6 li .button span { display:inline-block; text-align:center !important; margin-top:10px; max-width:100%; padding:0 !important; } .floor_team6 .pagination{ margin:30px 0 0; text-align: center; display:none; } .floor_team6 .component_body.swiper-container .pagination { display:block; } .floor_team6 .pagination span{ display: inline-block; width: 40px; height: 40px; margin: 0 20px; border: 1px solid #aaa; cursor: pointer; font-size: 20px; color: #aaa; cursor:pointer; line-height: 40px; text-align: center; } .floor_team6 .pagination span:hover{ box-shadow: 0 0 10px rgba(0,0,0,.2) inset; } .floor_team6 .pagination span:active{ box-shadow: 0 0 20px rgba(0,0,0,.3) inset; } /*基础组件7*/ .floor_team7{ max-width: 1440px; margin: 0 auto; padding:0; } .floor_team7 .content_main { overflow:hidden; position:relative; } .floor_team7 .toggle_main { float:left; max-width:25%; } .floor_team7 .float_right .toggle_main { float:right; } .floor_team7 .tabbar li { padding:5%; border-bottom:2px solid #fff; box-sizing:border-box; transition: all 0.4s linear; } .floor_team7 .tabbar .picture { float:left; border-radius:50%; overflow:hidden; display:flex; justify-content:center; text-align:center; margin-right:10%; } .floor_team7 .tabbar .picture img { width:120%; height:120%; } .floor_team7 .tabbar .title { } .floor_team7 .tabbar .subtitle { } .floor_team7 .tabbar .subpicture { } .floor_team7 .datalist { position:absolute; top:0; right:0; width:75%; height:100%; } .floor_team7 .datalist li { display:none; } .floor_team7 .datalist li.on { display:block; } .floor_team7 .datalist .picture { position:absolute; right:0; top:0; width:50%; height:100%; overflow:hidden; display:flex; align-items:center; justify-content:center; text-align:center; } .floor_team7 .datalist img { display:block; min-width:100%; height:100%; } .floor_team7 .datalist .content_wrap { position:absolute; top:20%; right:50%; width:50%; height:60%; box-sizing:border-box; padding:3% 5% 0; text-align:left; } .floor_team7 .float_right .content_wrap { right:auto; left:0; text-align:right; } .floor_team7 .datalist .subtitle { display:inline-block; margin:0; } /*团队扩展组件8*/ .floor_team8{ max-width:1440px; margin:0 auto; padding:0 10px; box-sizing:border-box; } .team8 { overflow:hidden; } .team8 li a { display:block; padding:0; box-shadow: 0 4px 29px rgba(0,0,0,.1); overflow: hidden; } .team8 li .infopicture { position: relative; overflow: hidden; transition:all 0.4s ease 0s; z-index: 4; } .team8 li .infopicture .picture { width: 100%; transition:all 0.4s ease 0s; } .team8 li .infopicture .infocontent { position: absolute; bottom: 120%; left: 0; width: 100%; height: 100%; transition:all 0.4s ease 0s; display: flex; align-items: center; justify-content: center; background: #fff; padding: 0 10%; box-sizing: border-box; } .team8 li .infowrap { padding:20px; background:#ffffff; border: 1px solid #dedede; position: relative; transition:all 0.4s ease 0s; z-index: 8; } .team8 li .infowrap .subpicture { position: absolute; width: 90px; height: 90px; border-radius: 50%; overflow: hidden; top: 0; left: 50%; opacity: 0; background: no-repeat left top; background-size: cover; transition:all 0.4s ease 0s; z-index: 10; } .team8 li .infowrap .infotitle { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; transition:all 0.4s ease 0s; } .team8 li .infowrap .infocontent { margin-top: 10px; } .team8 li a:hover .infopicture .picture { transform: scale(0.3); } .team8 li a:hover .infopicture .infocontent { bottom: 0; } .team8 li a:hover .infowrap { position:relative; border: 0 solid #dedede; } .team8 li a:hover .infowrap .subpicture { transform: translate(-50%,-50%); opacity: 1; } /*团队扩展组件9*/ .floor_team9{ max-width:1440px; margin:0 auto; padding:0; box-sizing:border-box; } .floor_team9 .pagination .prev,.floor_team9 .pagination .next{ position: absolute; left: 10px; z-index: 100; width:60px; height: 60px; line-height: 60px; text-align: center; font-size:36px; top: 0; bottom: 0; margin: auto; cursor: pointer; color: #999; border-radius: 50%; } .floor_team9 .pagination .next{ left: auto; right: 10px; } .floor_team9 .pagination .prev:hover,.floor_team9 .pagination .next:hover{ background: rgba(100,100,100,.05); } .team9 { overflow:hidden; } .team9 li { float: left; } .team9 li .wrap{ display:block; padding:15px 0; overflow: hidden; position: relative; border-left: 1px solid transparent; box-sizing: border-box; } .team9 li:first-child .wrap{ border-left:none; } .team9 li .infopicture { width:184px; max-height:280px; margin:0 auto 20px; position: relative; opacity: 1; transition:all 0.4s ease 0s; z-index: 4; border-radius: 0 0 184px 184px; overflow: hidden; display: flex; align-items: flex-start; justify-content: center; } .team9 li img{ width: 100%; } .team9 li .infopicture .bg{ position: absolute; width: 100%; height: 100%; z-index: 1; background: center bottom no-repeat; border-radius: 0 0 184px 184px; overflow: hidden; } .team9 li .maxpicture { position: absolute; left: 0; top:70%; z-index:6; width: 100%; height: 100%; display: block; transition:all 0.5s linear; opacity: 0;} .team9 li .maxpicture .bg{ position: absolute; left: 0; top:70%; z-index:8; width: 100%; height: 100%; background: center bottom repeat-x; transition:all 0.5s linear; opacity: 0; } .team9 li .infowrap { padding:20px; position: relative; z-index:10; } .team9 li .infowrap .infotitle { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; } .team9 li .infoscontent{ text-align: center; padding-top: 5px; } .team9 li .infowrap .infocontent { margin-top: 10px; overflow: hidden; white-space: normal; } .team9 li .wrap:hover .infopicture{ opacity: 0; } .team9 li .wrap:hover .maxpicture { top: 0; opacity: 1; } .team9 li .wrap:hover .maxpicture .bg { top:0; opacity: 1; } .team9 li .more{ display: block; margin-top:35px; height: 48px; overflow: hidden; padding-bottom: 5px;} .team9 li .more a{ display: block; width: 176px; height: 48px; text-align: center; position: relative; overflow: hidden; margin: 0 auto; border: 2px solid rgba(255, 255, 255, 0.5); line-height:46px; font-size: 16px; padding-left:30px; border-radius:48px; box-sizing: border-box; background: calc(50% - 34px) center no-repeat; background-size: 20px; color: #fff;} .team9 li .more span{ display:block; height: 100%; line-height:1em; display:flex; align-items:center; left:38px; position:relative; top:0; transition: all 0.3s linear;} .team9 li .more:hover span { top: -100%; } /*==========我们的团队列表组件 结束==========*/ /*==========基础列表组件 开始==========*/ /*基础列表组件1*/ .floor_basic1 { margin:0 auto; text-align:center; } .floor_basic1 img { max-width:100%; display:block; margin:0 auto; } /*基础列表组件2*/ .floor_basic2_main { overflow:hidden; } /*基础列表组件3*/ .floor_basic3 { text-align:center; } .floor_basic3 .component_body { max-width: 1440px; margin: 0 auto; } .floor_basic3 a { position: relative; display:block; overflow: hidden; } .floor_basic3 img { width:100%; display:block; } .floor_basic3 a .text{ text-align: left; position: absolute; top: 0; bottom: 0; right: 0; padding: 15px; box-sizing: border-box; max-width: 80%; min-width: 50%; max-height:100%; overflow:hidden; } .floor_basic3 a .text h2{ padding-bottom: 8px; font-size: 18px; } .floor_basic3 a .text p{ font-size:14px; opacity: .8; } .floor_basic3 a.big{ width: 50%; } .floor_basic3 a.big .text{ left: 0; top: auto; max-width: 100%; } /*基础列表组件4*/ .floor_basic4_main { background-size:auto; background-repeat:no-repeat; position: relative; z-index: 2001; overflow: visible; } .floor_basic4{ max-width: 1440px; margin: 0 auto; position: absolute; left: 0; right: 0; z-index: 9; } .floor_basic4 .component_title{ display: inline-block; min-width: 100px; max-width: 1440px; margin: 0 auto; } .floor_basic4 .component_title.style_2 h2{ position:relative; padding-bottom:10px; margin-bottom:0px; } .floor_basic4 .component_title.style_2 h2:before { content:""; position:absolute; left:50%; bottom:0; width:100px; height:2px; margin-left:-50px; background:#ccc; } .floor_basic4 .component_title.style_3{ width: 100%; display: flex; justify-content: space-between; align-items: center; } /*基础列表组件5*/ .floor_basic5 { margin:0 auto; max-width: 1440px; } .floor_basic5 .component_body { max-width:100%; display:block; margin:0 auto; overflow:hidden; } .floor_basic5 .component_body h2 { } .floor_basic5 .component_body p { margin:20px 0 0; text-align:left; } .floor_basic5 .component_body .slot>div { margin-top:20px; } .floor_basic5 .component_body .more { float:none; display:inline-block; padding:0 25px; border-radius:100px; } .floor_basic5 .component_body .more:hover { opacity:0.8; } /*基础组件6*/ .floor_basic6_main{ position: relative; z-index: 1; overflow: visible; z-index: 2001; } .floor_basic6{ position: absolute; left: 0; right: 0; } .floor_basic6 .button{ max-width: 1440px; margin: 0 auto; padding: 0 10px; font-size: 0; } [yd-slot] .floor_basic6 .button{ padding: 0; } .floor_basic6 .button a{ display: inline-flex; align-items: center; justify-content: center; } .floor_basic6 .button a.icon-align3 img,.floor_basic6 .button a.icon-align4 img{ order: 1; } .floor_basic6 .button a.icon-align2,.floor_basic6 .button a.icon-align4{ flex-direction: column; } /*基础组件7*/ .floor_basic7{ max-width: 1440px; margin: 0 auto; padding: 0 50px; } .floor_basic7 video{ background: #000; } .floor_basic7 .component_body{ overflow: hidden; } .floor_basic7 .contentwrap{ overflow: hidden; } .floor_basic7 .contentwrap .wrap{ display: inline-block; text-align: left; } .floor_basic7 .subcontent{ display: inline-block; margin: 10px 0; } .floor_basic7 .button{ overflow: hidden; } .floor_basic7 .button a{ display: inline-block; text-align: center; } .floor_basic7 a.button { display:block; } .floor_basic7 .button span{ display: inline-block; text-align: center; } .floor_basic7 .swiper-container{ padding:30px 0; } .floor_basic7 .swiper-container .swiper-slide{ position: relative; } .floor_basic7 .swiper-container .swiper-slide h2{ text-align: center; margin-top: 5px; } .floor_basic7 .swiper-container .swiper-slide .subpicture{ position: absolute; left: 0; right: 0; top: 260%; max-width: 100%; box-sizing: border-box; margin: auto; transform: translatey(-50%); transition-duration: .5s; } .floor_basic7 .swiper-container .swiper-slide .subpicture h2{ color: #fff; font-weight: normal; } .floor_basic7 .swiper-container .swiper-slide .subpicture img{ width: 100%; padding: 5px; background: #fff; border-radius: 4px; box-shadow: 0 0 10px rgba(0,0,0,.15); } .floor_basic7 .swiper-container .swiper-slide-active{ z-index: 5; position: relative; } .floor_basic7 .swiper-container .swiper-slide.prev1,.floor_basic7 .swiper-container .swiper-slide.next1{ position: relative; z-index: 2; } .floor_basic7 .swiper-container .swiper-slide.prev2,.floor_basic7 .swiper-container .swiper-slide.next2{ position: relative; z-index: 1; } .floor_basic7 .swiper-container .prev_btn,.floor_basic7 .swiper-container .next_btn{ position: absolute; width: 50px; height: 80px; line-height: 80px; border-radius: 4px; cursor: pointer; top: 0; bottom: 0; margin: auto; z-index: 9; font-size: 50px; color: #fff; transition-duration: .5s; } .floor_basic7 .swiper-container .prev_btn{ left: 5px; } .floor_basic7 .swiper-container .next_btn{ right: 5px; } .floor_basic7 .swiper-container.style3 .swiper-slide a{ display: block; box-sizing: border-box; padding: 0 10px; } .floor_basic7 .swiper-container.style3 .swiper-slide .subpicture{ max-width: 60%; } .floor_basic7 .swiper-container.style3 .swiper-slide:hover .subpicture{ top: 45%; } .floor_basic7 .swiper-container.style4 .swiper-slide{ width: 150px; transition-duration: .5s; display: flex; justify-content: center; align-items: center; transition-duration: .5s; opacity: .5; transform: scale(.6); } .floor_basic7 .swiper-container.style4 .swiper-slide-active{ transform: scale(1.1); opacity: 1; } .floor_basic7 .swiper-container.style4 .swiper-slide.prev1,.floor_basic7 .swiper-container.style4 .swiper-slide.next1{transform: scale(.95); opacity: .8; } .floor_basic7 .swiper-container.style4 .swiper-slide.prev2,.floor_basic7 .swiper-container.style4 .swiper-slide.next2{ transform: scale(.8); opacity: .5; } .floor_basic7 .swiper-container.style4 .swiper-slide-active:hover .subpicture{ top: 45%; } .floor_basic7 .swiper-container:hover .prev_btn,.floor_basic7 .swiper-container:hover .next_btn{ background: rgba(0,0,0,.3) } .floor_basic7 .swiper-container .prev_btn:hover,.floor_basic7 .swiper-container .next_btn:hover{ background: rgba(0,0,0,.5) } /*基础组件8*/ .floor_basic8{ max-width: 1440px; margin: 0 auto; } .floor_basic8 ul{ overflow: hidden; } .floor_basic8 li{ float:none; display:inline-block; overflow: hidden; text-align: center; padding: 15px 0; } .floor_basic8 li .wrap{ position: relative; max-width: 95%; display: inline-block; border-radius: 16px; overflow: hidden; transition-duration: .5s; } .floor_basic8 li .wrap:after{ content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; transition-duration: .5s; opacity: 0; z-index: -1; } .floor_basic8 li .picture{ display: block; max-width: 100%; } .floor_basic8 li .subpicture{ position: absolute; top: 0; left: 0; width: 100%; height: 100%; transition-duration: .5s; opacity: 0; z-index: -1; } .floor_basic8 li .subpicture img{ width: 60%; margin: 40% auto 15px; } .floor_basic8 li h2{ text-align: center; height: 1em; } .floor_basic8 li p{ text-align: center; } .floor_basic8 li:hover .subpicture{ opacity: 1; z-index: 10; } .floor_basic8 li:hover .wrap{ box-shadow: 0 5px 15px -2px rgba(0,0,0,.15); transform: translatey(-10px); } .floor_basic8 li:hover .wrap:after{ z-index: 1; } /*基础组件9*/ .floor_basic9_main{ position: relative; overflow: hidden; } .floor_basic9{ max-width: 1440px; margin: 0 auto; } .floor_basic9 .tabbarlist{ overflow: hidden; border-bottom: 1px solid; } .floor_basic9 .tabbarlist li{ position: relative; float: left; width: 25%; text-align: center; font-size: 18px; cursor: pointer; padding-bottom: 20px; } .floor_basic9 .tabbarlist li.on:after{ content: ''; position: absolute; bottom: 0; left: 0; right: 0; margin: auto; border-bottom: 4px solid; width: 50%; } .floor_basic9 .swiperitem{ position: absolute; margin-top: 50px; visibility: hidden; opacity: 0; } .floor_basic9 .swiperitem.on{ position: relative; z-index: 1; visibility: visible; opacity: 1; } .floor_basic9 .swiperitem li{ position: relative; } .floor_basic9 .swiperitem .swiper-container{ max-width: 1060px; margin: 0 auto; } .floor_basic9 .prev_btn,.floor_basic9 .next_btn{ position: absolute; width: 45px; height: 80px; line-height: 80px; border-radius: 4px; font-weight: bold; background: rgba(0,0,0,.3); opacity: .5; cursor: pointer; top: 0; bottom: 0; margin: auto; z-index: 9; font-size: 45px; color: #fff; transition-duration: .5s; } .floor_basic9 .prev_btn:hover,.floor_basic9 .next_btn:hover{ opacity: 1; } .floor_basic9 .prev_btn{ left: 0; } .floor_basic9 .next_btn{ right: 0; } .floor_basic9 .subpicture{ position: absolute; left: 0; top: 16px; } .floor_basic9 .picture{ max-width: 100%; margin-top: 30px; } .floor_basic9 i{ position: absolute; right: 0; top: 0; line-height: 40px; } /*基础组件10*/ .floor_basic10{ max-width: 1440px; margin: 0 auto; padding: 0 30px; } .floor_basic10 .content_wrap{ float: left; width: 48%; color: #fff; } .floor_basic10 .content_wrap .subtitle{ width: 540px; font-size: 60px; line-height: 2.0em; } .floor_basic10 .content_wrap .description{ width: 420px; text-align: justify; font-size: 20px; line-height: 36px; } .floor_basic10 .datalist{ position: relative; float: right; width: 48%; color: #fff; } .floor_basic10 .datalist li{ width: 50%; float: left; text-align: center; padding: 20px 15px; box-sizing: border-box; transition-duration: .5s; cursor: pointer; } .floor_basic10 .datalist li .title{ font-size: 20px; color: #fff; height: 3em; line-height: 1.5em; } .floor_basic10 .datalist li i{ display: block; margin: 25px auto; width: 25px; height: 1px; background: #fff; } /*基础组件11*/ .floor_basic11{ max-width: 1440px; margin: 0 auto; padding: 0 30px; } .floor_basic11 .component_body{ position: relative; } .floor_basic11 .btn_wrap{ position: absolute; right: 0; top: 0; bottom: 0; display: flex; align-items: center; font-size: 0; } .floor_basic11 .btn_wrap a{ display: inline-block; vertical-align: middle; text-align: center; transition-duration: .2s; font-size: 14px; } .floor_basic11 .btn_wrap a span { display:inline-block; text-align:center; } .floor_basic11 .btn_wrap i{ display: inline-block; } .floor_basic11.style2 .btn_wrap{ left: 0; right: auto; } .floor_basic11.style2 .text_wrap{ text-align: right; } .floor_basic11.style3 .btn_wrap{ position: relative; text-align: center; display: block; margin-top: 15px; } .floor_basic11.style3 .text_wrap{ text-align: center; } /*基础组件12*/ .floor_basic12{ max-width: 1440px; margin: 0 auto; position:relative; z-index:2; } .floor_basic12 .datalist{ padding: 10px 0; overflow: hidden; } .floor_basic12 .datalist li{ width: 25%; float: left; text-align: center; color: #fff; } .floor_basic12 .datalist li span{ display: inline-block; vertical-align: top; } .floor_basic12 .datalist li span.title{ font-size: 48px; } /*基础组件13*/ .floor_basic13{ max-width: 1440px; margin: 0 auto; } .floor_basic13 .datalist{ overflow: hidden; text-align: center; font-size: 0; } .floor_basic13 .datalist li{ display: inline-block; text-align: center; vertical-align: middle; box-sizing: border-box; } .floor_basic13 .datalist img{ max-width: 100%; } /*基础组件14*/ .floor_basic14{ max-width:1440px; margin:0 auto; padding: 0 10px; } .floor_basic14 .search_wrap{ overflow: hidden; } .floor_basic14 .submit_btn{ position: relative; float: right; font-size: 0; cursor: pointer; text-align: center; display: flex; align-items: center; justify-content: center; } .floor_basic14 .submit_btn img{ vertical-align: middle; margin: 0 2px; } .floor_basic14 .submit_btn span{ display: inline-block; vertical-align: middle; margin: 0 2px; } .floor_basic14 .submit_btn input{ position: absolute; left: 0; top: 0; height: 100%; width: 100%; background: transparent; padding: 0; margin: 0; border: 0; border-radius: 0; cursor: pointer; } .floor_basic14 .input{ overflow: hidden; } .floor_basic14 .input input{ width: 100%; border: 0; border-radius: 0; background: transparent; } .floor_basic14 .hot_keywords a{ padding-right: 10px; color: #616269; } .floor_basic14 .hot_keywords a:hover{ opacity: .8; } /*基础组件15*/ .floor_basic15{ max-width: 1200px; margin: 0 auto; } .floor_basic15 .datalist1{ overflow: hidden; margin-bottom:4%; } .floor_basic15 .datalist1 li{ float: left; width: 33.3333%; text-align: center; } .floor_basic15 .datalist1 .wrap{ display: inline-block; } .floor_basic15 .datalist2 li{ overflow: hidden; margin: 20px 0; } .floor_basic15 .datalist2 .wrap{ overflow: hidden; padding: 20px; float: left; max-width: 80%; } .floor_basic15 .datalist2 img{ float: right; margin: 20px; width: 100px; } /*基础组件16*/ .floor_basic16{ max-width: 1440px; margin: 0 auto; } .floor_basic16 .component_body{ overflow: hidden; position: relative; margin-top: 20px; } .floor_basic16 li{ overflow: hidden; box-sizing: border-box; padding: 30px; } .floor_basic16 .picture{ display: inline-block; vertical-align: top; margin-right: 150px; } .floor_basic16 .wrap{ display: inline-block; vertical-align: top; max-width: 55%; } .floor_basic16 .description{ position: relative; text-indent: 100px; text-align: justify; transition-duration: .5s; } .floor_basic16 .description:before{ content: '”'; font-size: 105px; position: absolute; left: 0; top: 22px; text-indent: 50px; } .floor_basic16 .description:hover{ transform: translatex(15px); } .floor_basic16 .title{ text-align: right; margin-top: 20px; } .floor_basic16 .prevnext{ position: absolute; top: 0; right: 60px; width: 25px; height: 25px; font-weight: bold; line-height: 25px; text-align: center; background: red; color: #fff; border-radius: 50%; cursor: pointer; } .floor_basic16 .prevnext.next{ right: 30px; } /*基础组件18*/ .floor_basic18{ max-width: 1440px; margin: 0 auto; } .floor_basic18 .contentwrap{ overflow: hidden; } .floor_basic18 ul{ display: inline-block; width:100%; text-align: center; margin: 20px 0; border: 1px solid #e4e5e9; border-radius: 6px; overflow: hidden; } .floor_basic18 ul li{ padding: 15px 0; cursor: pointer; } .floor_basic18 ul li.on{ background: #e4e5e9; } .floor_basic18 .description{ text-align: center; } .floor_basic18 .button { display: block; } .floor_basic18 .button a{ display: block; text-align: center; } .floor_basic18 .button span{ display:inline-block; text-align: center; } .floor_basic18 .swiper-slide{ position: relative; } .floor_basic18 .subpicture{ position: absolute; top: 0; bottom: 0; display: none; right: 0; left: 0; max-width: 70%; margin: auto; box-shadow: 0 0 10px rgba(0,0,0,.15); background: #fff; border-radius: 6px; padding: 6px; } .floor_basic18 .swiper-slide:hover .subpicture{ display: block; } /*基础组件19*/ .floor_basic19{ max-width: 1440px; margin: 0 auto; } .floor_basic19 .datalist:after{ content: ""; display: block; clear: both; } .floor_basic19 .datalist{ font-size: 0; overflow-x: auto; overflow-y: hidden; white-space: nowrap; padding: 20px 0; } .floor_basic19 .listitem{ display: inline-block; vertical-align: top; min-width: 300px; width: 25%; } .floor_basic19 .listitem .listtitle{ text-align: center; padding: 30px 0; } .floor_basic19 .listitem ul{ background: #fff; margin: 0 10px; overflow: hidden; border-radius: 6px; } .floor_basic19 .listitem ul:hover{ box-shadow: 0 5px 20px -5px rgba(0,0,0,.3) !important; } .floor_basic19 .listitem li{ overflow: hidden; margin: 30px 20px; } .floor_basic19 .listitem .picture{ float: left; margin-right: 10px; } .floor_basic19 .listitem .wrap{ overflow: hidden; } /*基础组件20*/ .floor_basic20{ } .floor_basic20 ul{ max-width: 1440px; margin: 0 auto; overflow: hidden; } .floor_basic20 li{ float: left; text-align: center; border-bottom: 2px solid transparent; cursor: pointer; } .floor_basic20 li img{ display: block; margin: 0 auto 10px; filter: grayscale(100%); } .floor_basic20 li.on img{ filter: grayscale(0%); } .floor_basic20 .swiper-container{ max-width: 1440px; margin: 0 auto; } .floor_basic20 .swiper-container.showshadow1{ box-shadow: 0 0 15px rgba(0,0,0,.1); border-radius: 6px; margin-top: 30px; } .floor_basic20 .title{ margin-bottom: 20px; } .floor_basic20 .subtitle{ margin: 40px 0 10px; } .floor_basic20 .description{ margin: 10px 0 50px; } .floor_basic20 ul.style2{ text-align: center; } .floor_basic20 ul.style2 li{ width: auto !important; box-sizing: border-box; padding: 8px 30px; float: none; display: inline-block; border: 1px solid #e4e5e9; border-left: 0 !important; border-right: 0 !important; } .floor_basic20 ul.style2 li.n1{ border-radius: 50px 0 0 50px; border-left: 1px solid #e4e5e9; } .floor_basic20 ul.style2 li:last-child{ border-radius: 0 50px 50px 0; border-right: 1px solid #e4e5e9; } .floor_basic20 ul.style2 li .title{ margin-bottom: 0; } .floor_basic20 ul.style2 li.on{ background: #e4e5e9; border-bottom: 1px solid #e4e5e9; } /*基础组件21*/ .floor_basic21{ max-width: 1440px; margin: 0 auto; } .floor_basic21 li{ text-align: center; position: relative; box-sizing: border-box; } .floor_basic21 li .picture{ display: block; width: 100%; transition-duration: .5s; } .floor_basic21 li a { display:block; } .floor_basic21 .wrap{ position: absolute; left: 0; top: 0; bottom: 0; right: 0; display: flex; flex-direction: column; justify-content: center; align-items: center; overflow: hidden; } .floor_basic21 .description{ margin: 0 15px; } .floor_basic21 .wrap.style2{ opacity: 0; transition-duration: .5s; background: rgba(0,0,0,.3); } .floor_basic21 .wrap.style2:hover{ opacity: 1; } .floor_basic21 li:hover .picture{ transform: scale(1.05); } /*基础组件22*/ .floor_basic22{ max-width: 1440px; margin: 0 auto; } .floor_basic22 ul:after{ content: ''; display: block; clear: both; } .floor_basic22 .wrap{ display: block; text-align: center; box-sizing: border-box; overflow: hidden; transition-duration: .2s; } .floor_basic22 .wrap .picture{ max-width: 100%; } .floor_basic22 .wrap .title{ white-space: nowrap; } /*基础组件23*/ .floor_basic23{ position: relative; max-width: 1200px; margin: 0 auto; padding: 0 130px; } .floor_basic23 .wrap{ float: left; } .floor_basic23 .picture{ float: right; } .floor_basic23 li{ box-sizing: border-box; padding: 50px 80px; } .floor_basic23 .subtitle{ margin-top: 30px; } .floor_basic23 .component_bottom .pagination{ text-align: center; margin-top: 20px; } .floor_basic23 .component_bottom .swiper-pagination-switch{ width: 8px; height: 8px; opacity: .5; } .floor_basic23 .component_bottom .swiper-active-switch{ opacity: 1; } .floor_basic23 .component_bottom span.pagination_btn{ position: absolute; top: 0; bottom: 0; margin: auto; width: 40px; height: 40px; line-height: 40px; border-radius: 50%; text-align: center; font-size: 20px; font-weight: 100; background: rgba(0,0,0,.3); cursor: pointer; color: #fff; } .floor_basic23 .component_bottom span.prev{ left: 10px; } .floor_basic23 .component_bottom span.next{ right: 10px; } .floor_basic23 .component_bottom span.pagination_btn:hover{ box-shadow: 0 0 5px rgba(0,0,0,.1) inset; } .floor_basic23 .component_bottom span.pagination_btn:active{ box-shadow: 0 0 10px rgba(0,0,0,.2) inset; } .floor_basic23 .component_bottom span.pagination_btn:before{ transform: scale(4,1); } /*基础组件24*/ .floor_basic24{ max-width: 1440px; margin: 0 auto; } .floor_basic24 .component_body{ overflow: hidden; position: relative; } .floor_basic24 .contentwrap{ position: absolute; left: 0; right: 0; border-radius: 1000px; } .floor_basic24 .wrap{ width: 420px; border-radius: 16px; overflow: hidden; box-shadow: 0 5px 20px -1px rgba(0,0,0,.1); } .floor_basic24 .contentwrap.styleleft .wrap{ float: right; } .floor_basic24 .titlewrap{ padding: 30px; border-radius: 16px 16px 0 0; } .floor_basic24 .titlewrap:after{ content: ''; } .floor_basic24 ul{ margin: 10px 0; } .floor_basic24 li{ padding: 20px 30px; position: relative; } .floor_basic24 .subpicture{ width: 25px; filter: grayscale(1); opacity: .7; vertical-align: middle; } .floor_basic24 li.on .subpicture{ filter: grayscale(0); opacity: 1; } .floor_basic24 .title{ display:inline-block; vertical-align: middle; } .floor_basic24 .subtitle{ padding-top: 15px; } .floor_basic24 .description{ display: none; position: absolute; right: 30px; top: 20px; line-height: 30px; border-radius: 50px; border: 1px solid #eee; text-align: center; } .floor_basic24 .description a{ display: block; } .floor_basic24 .description span { display:inline-block; text-align:center; } .floor_basic24 li.on .description{ display: block; } /*基础组件25*/ .floor_basic25_main{ position: relative; overflow: hidden; } .floor_basic25{ max-width: 1440px; margin: 0 auto; text-align: center; } .floor_basic25 .tabbarlist{ display: inline-block; position: relative; text-align: center; font-size: 0; border-radius: 50px; z-index: 1; overflow-x: auto; overflow-y: hidden; white-space: nowrap; max-width: 100%; } .floor_basic25 .tabbarlist i{ position: absolute; left: 0; top: 0; width: 160px; height: 40px; z-index: -1; border-radius: 50px; box-shadow: 0 0 5px rgba(0,0,0,.1); transition-duration: .5s; } .floor_basic25 .tabbarlist li{ display: inline-block; width: 160px; cursor: pointer; } .floor_basic25 .swiperitem{ position: relative; text-align:center; } .floor_basic25 .swiperitem ul{ overflow: hidden; } .floor_basic25 .swiperitem li{ float:left; text-align: center; transition-duration: .5s; margin-top: 45px; vertical-align: top; } .floor_basic25 .swiperitem li .wrap{ position: relative; } .floor_basic25 .swiperitem li .picturewrap{ position: relative; } .floor_basic25 .swiperitem li *{ overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .floor_basic25 .swiperitem .swiper-container{ max-width: 1300px; margin: 0 auto; } .floor_basic25 .prev_btn,.floor_basic25 .next_btn{ position: absolute; width: 45px; height: 80px; line-height: 80px; border-radius: 4px; font-weight: bold; background: rgba(0,0,0,.3); opacity: .5; cursor: pointer; top: 0; bottom: 0; margin: auto; z-index: 9; font-size: 45px; color: #fff; transition-duration: .5s; } .floor_basic25 .prev_btn:hover,.floor_basic25 .next_btn:hover{ opacity: 1; } .floor_basic25 .prev_btn{ left: 0; } .floor_basic25 .next_btn{ right: 0; } .floor_basic25 .subpicture{ position: absolute; left: 0; top: 45%; right: 0; margin: auto; transform: translatey(-50%); width: 140px; opacity: 0; transition-duration: .2s; z-index: 2; border-radius: 6px; padding: 5px; background: #fff; box-shadow: 0 0 8px rgba(0,0,0,.1); } .floor_basic25 .description{ position: absolute; text-align: center; top: 45%; left: 0; right: 0; width: 140px; margin: 90px auto 0; border-radius: 50px; height: 35px; line-height: 35px; background: #2878fb; color: #fff; opacity: 0; z-index: 2; box-shadow: 0 0 8px rgba(0,0,0,.1); } .floor_basic25 .description a{ display: block; } .floor_basic25 .picture{ width: 100%; display: block; } .floor_basic25 .swiperitem li:hover{ transform: translatey(-10px); } .floor_basic25 .swiperitem li:hover .picturewrap:after{ content: ''; position: absolute; left: 0; top: 0; bottom: 0; right: 0; background: #000; opacity: .3; z-index: 1; } .floor_basic25 .swiperitem li:hover .subpicture,.floor_basic25 .swiperitem li:hover .description{ opacity: 1; } /*基础组件26*/ .floor_basic26{ max-width: 1440px; margin: 0 auto; } .floor_basic26 .datalist:after{ content: ""; display: block; clear: both; } .floor_basic26 .datalist{ font-size: 0; overflow-x: auto; overflow-y: hidden; white-space: nowrap; padding: 20px 0; } .floor_basic26 .listitem{ display: inline-block; min-width: 300px; width: 25%; } .floor_basic26 .listitemwrap{ overflow: hidden; } .floor_basic26 .listitem .listtitle{ padding: 30px; } .floor_basic26 .listitem ul{ background: #fff; margin: 0 10px 10px; padding: 15px 0; overflow: hidden; border-radius: 6px; } .floor_basic26 .listitem li{ overflow: hidden; padding: 15px 20px; } .floor_basic26 .listitem li:hover{ background: #fcf2f2; } .floor_basic26 .listitem .picture{ display: inline-block; vertical-align: middle; width: 1.2em; height: 1.2em; margin-right: 5px; } .floor_basic26 .listitem .wrap{ overflow: hidden; } .floor_basic26 .more_btn{display: block; font-size: 15px; text-align: center; background: #fff; padding: 10px 0; cursor: pointer; } .floor_basic26 .more_btn i{ font-size: 12px; } .floor_basic26 .more_btn span { display:inline-block; text-align:center; } /*基础组件27*/ .floor_basic27_main{ position: relative; overflow: hidden; } .floor_basic27{ max-width: 1440px; margin: 0 auto; } .floor_basic27 .tabbarlist{ overflow: hidden; border-bottom: 1px solid #e4e5e9; } .floor_basic27 .tabbarlist li{ position: relative; float: left; width: 25%; text-align: center; font-size: 18px; cursor: pointer; padding-bottom: 20px; } .floor_basic27 .tabbarlist li img{ display: block; width: 35px; margin: 0 auto 10px; } .floor_basic27 .tabbarlist li.on:after{ content: ''; position: absolute; bottom: 0; left: 0; right: 0; margin: auto; border-bottom: 4px solid; width: 50%; } .floor_basic27 .swiperitem{ margin-top: 30px; } .floor_basic27 .swiperitem li{ position: relative; } .floor_basic27 .swiperitem .swiper-container{ margin: 0 20px; } .floor_basic27 .slide_wrap{ position: relative; margin: 20px 10px; border-radius: 6px; overflow: hidden; } .floor_basic27 .picture{ width: 100%; padding-bottom: 30%; } .floor_basic27 .wrap{ position: absolute; top: 60%; left: 0; right: 0; background: #fff; text-align: center; transition-duration: .5s; } .floor_basic27 .subpicture{ position: absolute; top: -20px; left: 0; right: 0; width: 70px; margin: auto; padding: 4px; background: #fff; border-radius: 50%; overflow: hidden; transition-duration: .5s; } .floor_basic27 h2{ margin-top: 50px; padding: 10px 0; } .floor_basic27 p{ padding: 0 30px 100px; margin-top: 8%; } .floor_basic27 .swiperitem li:hover .wrap{ top: 0; padding-top: 50px; } .floor_basic27 .swiperitem li:hover .subpicture{top: 20px; } /*基础组件28*/ .floor_basic28{ position: relative; max-width: 1200px; margin: 0 auto; padding: 0 130px; } .floor_basic28 .component_body{ overflow: hidden; } .floor_basic28 ul{ position: relative; width: 100%; height: 320px; } .floor_basic28 li{ box-sizing: border-box; transition-duration: 3s; position: absolute; top: 0; left: 0; right: 0; bottom: 0; opacity: 0; visibility: hidden; } .floor_basic28 li.on{ opacity: 1; visibility: visible; } .floor_basic28 li a{ display: flex; align-items: center; justify-content: space-between; } .floor_basic28 .wrap{ float: right; padding: 30px 30px 30px 0; display: flex; align-items: center; } .floor_basic28 .float_left{ text-align: center; margin: 0 30px; } .floor_basic28 .float_right{ flex: 1; } .floor_basic28 .picture{ float: left; width: 320px; overflow: hidden; } .floor_basic28 .picture img{ animation: boomboombasic 10s infinite; display: block; } .floor_basic28 .subpicture{ width: 100px; height: 100px; border-radius: 50%; } .floor_basic28 .description{ margin-bottom: 15px; } .floor_basic28 .component_bottom .pagination{ text-align: center; margin-top: 20px; } .floor_basic28 .component_bottom .swiper-pagination-switch{ width: 8px; height: 8px; opacity: .5; } .floor_basic28 .component_bottom .swiper-active-switch{ opacity: 1; } .floor_basic28 .component_bottom span.pagination_btn{ position: absolute; top: 0; bottom: 0; margin: auto; width: 40px; height: 40px; line-height: 40px; border-radius: 50%; text-align: center; font-size: 20px; font-weight: 100; background: rgba(0,0,0,.3); cursor: pointer; color: #fff; } .floor_basic28 .component_bottom span.prev{ left: 10px; } .floor_basic28 .component_bottom span.next{ right: 10px; } .floor_basic28 .component_bottom span.pagination_btn:hover{ box-shadow: 0 0 5px rgba(0,0,0,.1) inset; } .floor_basic28 .component_bottom span.pagination_btn:active{ box-shadow: 0 0 10px rgba(0,0,0,.2) inset; } .floor_basic28 .component_bottom span.pagination_btn:before{ transform: scale(4,1); } @keyframes boomboombasic{ 0%{ transform: scale(1); } 50%{ transform: scale(1.2); } 100%{ transform: scale(1); } } /*基础组件29*/ .floor_basic29{ max-width: 1200px; margin: 0 auto; position: relative; padding: 0 60px; } .floor_basic29 .component_body{ overflow: hidden; padding: 20px 0; } .floor_basic29 li{ float: left; width: 320px; } .floor_basic29 .wrap{ display: block; overflow: hidden; margin: 0 10px; display: flex; align-items: center; background: #fff; } .floor_basic29 .picture{ float: left; width: 45%; overflow: hidden; } .floor_basic29 .picture img{ display: block; transition-duration: 1s; } .floor_basic29 .infowrap{ flex: 1; padding: 10px; } .floor_basic29 .description{ margin-top: 15px; text-align: justify; } .floor_basic29 .wrap:hover .picture img{ transform: scale(1.1); } .floor_basic29 .component_bottom span.pagination_btn{ position: absolute; top: 0; bottom: 0; margin: auto; width: 40px; height: 40px; line-height: 40px; border-radius: 50%; text-align: center; font-size: 20px; font-weight: 100; background: rgba(0,0,0,.3); cursor: pointer; color: #fff; } .floor_basic29 .component_bottom span.prev{ left: 10px; } .floor_basic29 .component_bottom span.next{ right: 10px; } .floor_basic29 .component_bottom span.pagination_btn:hover{ box-shadow: 0 0 5px rgba(0,0,0,.1) inset; } .floor_basic29 .component_bottom span.pagination_btn:active{ box-shadow: 0 0 10px rgba(0,0,0,.2) inset; } .floor_basic29 .component_bottom span.pagination_btn:before{ transform: scale(4,1); } /*基础组件30*/ .floor_basic30{ max-width: 1440px; margin: 0 auto; } .floor_basic30 .component_body{ text-align: center; } .floor_basic30 ul{ overflow: hidden; display: inline-block; } .floor_basic30 li{ float: left; overflow: hidden; } .floor_basic30 li a{ position: relative; display: block; width: 0; overflow: hidden; transition-duration: 1s; } .floor_basic30 li.on a{ display: block; } .floor_basic30 li .wrap{ position: absolute; left: 0; top: 0; bottom: 0; right: 0; } .floor_basic30 li .subtitle{ width: 1em; float: left; cursor: pointer; text-align: center; word-break: break-all; writing-mode:vertical-lr; -ms-writing-mode: tb-rl; } .floor_basic30 li .subtitle:hover{ opacity: .8; } .floor_basic30 li .infowrap{ position: absolute; top: 10px; left: 10px; bottom: 10px; right: 10px; display: flex; justify-content: center; align-items: center; } .floor_basic30 li .description{ margin: 0 auto; transform: scale(0); transition-duration: 1.5s; } .floor_basic30 li.on .description{ transform: scale(1); } /*基础组件31*/ .floor_basic31{ max-width: 1440px; margin: 0 auto; } .floor_basic31 .wrap{ text-align: center; margin: 0 auto; background-position: center; background-size: auto 100%; background-repeat: no-repeat; transition-duration: .5s; overflow: hidden; } .floor_basic31 .wrap:hover{ transform: translatey(-10px); box-shadow: 0 10px 15px -10px rgba(0,0,0,0.3); } /*基础组件32*/ .floor_basic32 .wrap{ max-width: 1440px; padding: 0 10px; margin: 50px auto; color: #fff; position: relative; } .floor_basic32 .wrap:after, .floor_basic32 .wrap:before{ content: ''; position: absolute; bottom: 0; } .floor_basic32 .link{ display: block; } .floor_basic32 .link span{ display:inline-block; text-align:center; } .floor_basic32 .swiper-slide{ background-size: cover; } .floor_basic32 .tabbar{ position: relative; } .floor_basic32 .tabbarlist{ max-width: 1440px; margin: 0 auto; position: relative; display: flex; justify-content: space-around; font-size: 0; } .floor_basic32 .tabbarlist li{ text-align: center; cursor: pointer; padding: 0 10px; } .floor_basic32 .tabbarlist li img{ display: block; margin: 30px auto 0; } .floor_basic32 .active i{ position: absolute; top: -18px; height: 18px; background: #fff; z-index: 1; } .floor_basic32 .active .i1{ left: 0; width: 20%; } .floor_basic32 .active .i1:after, .floor_basic32 .active .i2:after{ content: ''; position: absolute; right: -18px; bottom: 0; width: 18px; height: 18px; border-left: 18px solid transparent; border-right: 18px solid transparent; border-bottom: 18px solid #fff; } .floor_basic32 .active .i2{ right: 0; width: 78%; } .floor_basic32 .active .i2:after{ right: auto; left: -18px; } /*基础组件33*/ .floor_basic33{ max-width: 1440px; margin: 0 auto; } .floor_basic33 .component_body { overflow:hidden; } .floor_basic33 .description{ margin-bottom: 10px; } .floor_basic33 ul{ overflow: hidden; } .floor_basic33 li a{ display: block; overflow: hidden; } .floor_basic33 .float_left{ margin-right: 20px; } .floor_basic33 .float_right{ margin-left: 20px; } .floor_basic33 .infopicture{ float: left; margin-right: 15px; overflow: hidden; } .floor_basic33 .infopicture img{ transition-duration: .5s; } .floor_basic33 li:hover .infopicture img{ transform:scale(1.1); } .floor_basic33 .infodescription{ overflow: hidden; } /*基础组件34*/ .floor_basic34{ max-width: 1200px; margin: 0 auto; position: relative; padding: 0 60px; } .floor_basic34 .component_body{ overflow: hidden; } .floor_basic34 a{ display: block; position: relative; } .floor_basic34 a .title{ position: absolute; right: 0; width: 1em; padding: 15px; background-color: #fff; } .floor_basic34 li.m1 a .title{ top: -30px; } .floor_basic34 li.m0 a .title{ bottom: -30px; } .floor_basic34 li:first-child a .title{ left: 0; right: auto; } .floor_basic34 a i:before{ position: absolute; top: 0; bottom: 0; left: 0; right: 0; margin: auto; transition-duration: .2s; z-index: 12; } .floor_basic34 a i:hover:before{ transform: scale(1.1); } .floor_basic34 .component_bottom span.pagination_btn{ position: absolute; top: 0; bottom: 0; margin: auto; width: 40px; height: 40px; line-height: 40px; border-radius: 50%; text-align: center; font-size: 20px; font-weight: 100; background: rgba(0,0,0,.3); cursor: pointer; color: #fff; } .floor_basic34 .component_bottom span.prev{ left: 10px; } .floor_basic34 .component_bottom span.next{ right: 10px; } .floor_basic34 .component_bottom span.pagination_btn:hover{ box-shadow: 0 0 5px rgba(0,0,0,.1) inset; } .floor_basic34 .component_bottom span.pagination_btn:active{ box-shadow: 0 0 10px rgba(0,0,0,.2) inset; } .floor_basic34 .component_bottom span.pagination_btn:before{ transform: scale(4,1); } /*基础组件35*/ .floor_basic35{ max-width: 1440px; margin: 0 auto; } .floor_basic35 ul{ position: relative; } .floor_basic35 li{ float: left; overflow: hidden; } .floor_basic35 .wrap{ position: relative; display: flex; height: 100%; align-items: center; } .floor_basic35 .titlewrap{ display: flex; align-items: center; justify-content: center; } .floor_basic35 .title{ } .floor_basic35 .description{ display: none; padding-right: 60px; } .floor_basic35 li.on .description{ display: block; } .floor_basic35 a{ position: absolute; right: 0; display: flex; align-items: center; justify-content: center; } .floor_basic35 .more { display:block; display: flex; align-items: center; justify-content: center; } .floor_basic35 .more span { display:inline-block; text-align:center; width:auto !important; } /*基础组件36*/ .floor_basic36{ max-width: 1440px; margin: 0 auto; } .floor_basic36 ul{ position: relative; text-align:center; } .floor_basic36 li{ display:inline-block; overflow: hidden; box-sizing:border-box; margin-top:20px; } .floor_basic36 li:last-child { border-right:0 !important; } .floor_basic36 a{ display:block; } .floor_basic36 .title { display:flex; align-items:center; justify-content:center; } .floor_basic36 .list_left .title { float:left; margin-left:0 !important; } .floor_basic36 .list_right .title { float:right; margin-right:0 !important; } .floor_basic36 .description { overflow:hidden; box-sizing:border-box; display:inline-block; } /*基础组件37*/ .floor_basic37{ max-width: 1440px; margin: 0 auto; } .floor_basic37 ul{ text-align:center; } .floor_basic37 li{ display:inline-block; float:none; overflow:hidden; box-sizing:border-box; white-space:normal; } .floor_basic37 a{ display:block; max-width:100% !important; margin:0 auto; overflow:hidden; } .floor_basic37 .li_wrap { position:relative; } .floor_basic37 .li_wrap img { display:block; } .floor_basic37 .info_wrap { position:absolute; bottom:0; left:6.5%; width:87%; padding:0 6%; box-sizing:border-box; border-radius:10px 10px 0 0; } .floor_basic37 .div { border-radius:20px; position:absolute; left:0; width:99.6%; top:-18px; transform:rotate(-5deg); } .floor_basic37 .title { } .floor_basic37 .subtitle { } .floor_basic37 .description { } /*基础组件39*/ .floor_basic39 { max-width: 1440px; margin: 0 auto; } .floor_basic39 .component_body{ overflow: hidden; position: relative; } .floor_basic39 .basicpicture { display:block; } .floor_basic39 .basicpicture.styleleft { float:left; margin-right:40px; } .floor_basic39 .basicpicture.styleright { float:right; margin-left:40px; } .floor_basic39 .contentwrap{ overflow:hidden; } .floor_basic39 .wrap{ overflow: hidden; } .floor_basic39 .contentwrap.styleleft .wrap{ float: right; } .floor_basic39 .titlewrap{ padding: 30px; border-radius: 16px 16px 0 0; } .floor_basic39 .titlewrap:after{ content: ''; } .floor_basic39 ul{ margin: 10px 0; } .floor_basic39 li{ padding:20px 20px; position: relative; } .floor_basic39 .picture{ float:left; width: 25px; position:relative; margin-right:10px; } .floor_basic39 .subtitle{ position:absolute; top:0; left:0; width:100%; height:100%; } .floor_basic39 .subtitle2 { float: left; margin-right: 10px; } .floor_basic39 .data_wrap { overflow:hidden; } .floor_basic39 .title{ font-size:20px; padding-bottom:10px; margin-bottom:10px; } .floor_basic39 .description{ line-height:20px; font-size:14px; } .floor_basic39 .description a{ display: block; } .floor_basic39 li.on .description{ display: block; } /*基础组件40*/ .floor_basic40{ max-width: 1440px; margin: 0 auto; } .floor_basic40 ul{ text-align: center; font-size: 0; } .floor_basic40 li{ display: inline-block; vertical-align: middle; } .floor_basic40 a{ display: flex; flex-direction: column; align-items: center; justify-content: center; font-size: 14px; } .floor_basic40 a .wrap{ padding: 5px; } .floor_basic40 a.img-position-top{ display: block; } .floor_basic40 a.img-position-bottom .picture,.floor_basic40 a.img-position-right .picture{ order: 5; } .floor_basic40 a.img-position-left,.floor_basic40 a.img-position-right{ flex-direction: row; } /*基础组件41*/ .floor_basic41{ max-width: 1440px; margin:0 auto; } .floor_basic41 .datalist{ font-size:0; overflow-x: auto; overflow-y: hidden; white-space:nowrap; padding:10px 0; box-sizing:border-box; } .floor_basic41 img { vertical-align:middle; max-width:100%; margin-right:5px; } .floor_basic41 .listitem{ display: inline-block; vertical-align: top; min-width:300px; width:25%; white-space:normal; } .floor_basic41 .listitem .listlow_main { position:relative; } .floor_basic41 .listitem .listlow_main:before { content:''; position:absolute; top:0; left:0; width:0; height:5px; transition-duration:.5s; } .floor_basic41 .listitem .listlow_main:hover:before { width:100%; } .floor_basic41 .listitem .listlow { display:inline-block; vertical-align:middle; margin:0 10px; } .floor_basic41 .listitem .listlow.low1 { display:block; margin:0; } .floor_basic41 .listitem a { display:block; } .floor_basic41 .listitem .listpicture { overflow:hidden; } .floor_basic41 .listitem .listpicture img { max-width:100%; } .floor_basic41 .listitem .listtitle{ padding:15px 0; } .floor_basic41 .listitem .listlow_main{ display:block; background: #fff; overflow: hidden; border-radius: 6px; box-sizing:border-box; padding:8% 4%; } .floor_basic41 .listitem .listlow_main:hover{ box-shadow: 0 5px 20px -5px rgba(0,0,0,.3) !important; } /*基础组件42*/ .floor_basic42{ max-width: 1440px; margin:0 auto; } .floor_basic42 .component_body { position:relative; } .floor_basic42 .picture { text-align:right; } .floor_basic42 .picture img { width:80%; } .floor_basic42 .img_left .picture { text-align:left; } .floor_basic42 .content { position:absolute; left:0; top:50%; width:400px; height:400px; max-height:90%; box-sizing:border-box; overflow:hidden; background:#fff; transform:translatey(-50%); } .floor_basic42 .content .wrap { padding:1% 5% 5%; } .floor_basic42 .img_left .content { left:auto; right:0; } /*基础组件43*/ .floor_basic43{ max-width: 1440px; margin: 0 auto; padding:0 50px; box-sizing:border-box; font-size:0; } .floor_basic43 ul { text-align:center; white-space:nowrap; overflow-x:auto; } .floor_basic43 li{ display:inline-block; white-space:normal; font-size:auto; } .floor_basic43 li .subpicture img{ height: 100%; transition-duration: .5s; } .floor_basic43 li .title{ margin: 0; } .floor_basic43 li .picture img{ height: 100%; transition-duration: .5s; } .floor_basic43 li .subtitle{ margin: 0; width:30px; height:30px; line-height:30px; color:#fff; font-size:12px; margin:-15px auto 0; border-radius:50%; position:relative; z-index:2; } .floor_basic43 li:hover .picture img{ transform: scale(1.05); } /*基础组件44*/ .floor_basic44{ max-width: 1440px; margin:0 auto; padding:0 10px; } .floor_basic44 li{ text-align: center; position: relative; box-sizing: border-box; } .floor_basic44 li a { display:flex; align-items:center; justify-content:center; flex-wrap:wrap; overflow:hidden; transition-duration: .5s; } .floor_basic44 li .picture{ display: block; width: 100%; overflow:hidden; } .floor_basic44 li .subpicture { float:left; margin-right:10px; max-width:100%; } .floor_basic44 li .subpicture img { width:100%; } .floor_basic44 .wrap{ width:100%; overflow: hidden; box-sizing:border-box; } .floor_basic44 .description{ margin:0; } .floor_basic44 ul.style2 li a{ flex-direction:column-reverse; } /*基础组件45*/ .floor_basic45{ max-width: 1440px; margin: 0 auto; } .floor_basic45 .component_body{ overflow: hidden; position: relative; } .floor_basic45 .contentwrap{ overflow:hidden; } .floor_basic45 .wrap{ border-radius: 16px; overflow: hidden; box-shadow: 0 5px 20px -1px rgba(0,0,0,.1); } .floor_basic45 .contentwrap.styleleft .wrap{ float: right; } .floor_basic45 .titlewrap{ padding: 30px; border-radius: 16px 16px 0 0; } .floor_basic45 .titlewrap:after{ content: ''; } .floor_basic45 ul{ margin:0; } .floor_basic45 .subpicture{ width: 25px; filter: grayscale(1); opacity: .7; vertical-align: middle; } .floor_basic45 li.on .subpicture{ filter: grayscale(0); opacity: 1; } .floor_basic45 .title{ display:inline-block; vertical-align: middle; } .floor_basic45 .subtitle{ padding-top: 15px; } .floor_basic45 .description{ display: none; position: absolute; right: 30px; top: 20px; line-height: 30px; border-radius: 50px; border: 1px solid #eee; text-align: center; } .floor_basic45 .description a{ display: block; } .floor_basic45 .description span { display:inline-block; text-align:center; } .floor_basic45 li.on .description{ display: block; } .floor_basic45 .titlewrap { display:none; border-radius:0; } .floor_basic45 .wrap { box-shadow:0; box-sizing:border-box; } .floor_basic45 .wrap li { float:none !important; display:inline-block; box-sizing:border-box; padding:10px 0 10px 30px; vertical-align:top; } .floor_basic45 .wrap li .title { display:inline-block; position:relative; text-align:center; max-width:100%; } .floor_basic45 .wrap li .title .number { position:absolute; top:-14px; left:-14px; width:24px; height:24px; text-align:center; line-height:24px; color:#fff; font-size:12px; border-radius:50%; border:2px solid #fff; } .floor_basic45 .wrap li .subtitle { padding:0 0 12px;; margin:12px 0; position:relative; } .floor_basic45 .wrap li .subtitle:before { content:" "; position:absolute; left:0; bottom:0; width:60px; height:0; } .floor_basic45 .wrap li.on .subtitle:before { height:2px; } .floor_basic45 .styleleft .picturewrap { float:left; margin-right:5%; } .floor_basic45 .styleright .picturewrap { float:right; margin-left:5%; } /*基础组件46*/ .floor_basic46{ max-width: 1440px; margin: 0 auto; padding:0; } .floor_basic46 .toggle_main { float:left; margin-right:1%; max-width:25%; } .floor_basic46 .float_right .toggle_main { float:right; margin-left:1%; } .floor_basic46 .toggle_main .title { border-radius:100px 0 0 100px; text-align:center; margin-bottom:3%; position:relative; white-space:nowrap; } .floor_basic46 .toggle_main .title i { display:inline-block; font-style:normal; border-radius:50%; margin-right:3%; transform:scale(0.9, 0.9); text-align:center !important; } .floor_basic46 .float_right .toggle_main .title { border-radius:0 100px 100px 0; } .floor_basic46 .content_main { overflow:hidden; } .floor_basic46 .content_main li { position:relative; display:none; } .floor_basic46 .content_main li.on { display:block; } .floor_basic46 .content_main img { display:block; width:100%; } .floor_basic46 .content_main .content_wrap { position:absolute; top:0; right:0; width:35%; height:100%;box-sizing:border-box; padding-top:5%; text-align:left; } .floor_basic46 .float_right .content_wrap { right:auto; left:0; text-align:right; } .floor_basic46 .content_main .subtitle { display:inline-block; margin:0; } .floor_basic46 .content_main .description { margin:10% 10px 5%; } .floor_basic46 .content_main .button { margin:5% 10% 0; padding:0 !important; } .floor_basic46 .content_main .button a { display:inline-block; border:1px solid #fff; border-radius:100px; text-align:center !important; white-space:nowrap; } /*基础组件47*/ .floor_basic47{ max-width: 1440px; margin: 0 auto; } .floor_basic47 .component_title { float:left; padding:0 3%; box-sizing:border-box; } .floor_basic47 .component_body { overflow:hidden; box-sizing:border-box; } .floor_basic47 .contentwrap{ float:left; overflow: hidden; margin:0 5%; } .floor_basic47 ul li{ display:block; cursor: pointer; margin-bottom:5px; } .floor_basic47 ul li.on{ } .floor_basic47 .togglewrap{ overflow: hidden; } .floor_basic47 .swiper-slide{ position: relative; } .floor_basic47 .picture{ } .floor_basic47 .picture img { display:block; max-width:100%; } .floor_basic47 .swiper-slide:hover .subpicture{ display: block; } /*基础组件48*/ .floor_basic48{ max-width: 1440px; margin: 0 auto; } .floor_basic48 li{ text-align: center; box-sizing: border-box; } .floor_basic48 li .picture{ display: block; width: 100%; } .floor_basic48 li a { display:block; transition: all 0.4s cubic-bezier(0.4,0,0.2,1); overflow: hidden; position: relative; } .floor_basic48 .wrap{ position: absolute; left: 0; top: 0; bottom: 0; right: 0; padding-top: 30%; display: flex; flex-direction: column; justify-content: center; align-items: center; overflow: hidden; transition: all 0.4s cubic-bezier(0.4,0,0.2,1); } .floor_basic48 li a:hover .wrap { padding: 0; } .floor_basic48 .title { margin: 12px 0; transition: all 0.4s cubic-bezier(0.4,0,0.2,1); } .floor_basic48 .description{ margin: 0 15%; opacity: 0; transition: all 0.4s cubic-bezier(0.4,0,0.2,1); overflow: hidden; } .floor_basic48 li a:hover .description { opacity: 1; } .floor_basic48 .button { opacity: 0; } .floor_basic48 .button span { display: inline-block; text-align: center; margin-top: 20px; } .floor_basic48 li a:hover .button { opacity: 1; } /*基础组件49*/ .floor_basic49{ max-width: 1440px; margin: 0 auto; } .basic49 { overflow: hidden; } .basic49 li{ transition-duration: .5s; } .basic49 a{ display: block; padding:0; overflow: hidden; transition-duration: .5s; } .basic49 .picture { } .basic49 .picture img { display: block; width: 100%; } .basic49 .wrap { overflow:hidden; } .basic49 .title{ } .basic49 .description{ margin: 0; color: #666; overflow: hidden; } /*基础组件50*/ .floor_basic50{ max-width: 1440px; margin: 0 auto; } .floor_basic50 .component_body { overflow:hidden; box-sizing:border-box; position: relative; } .floor_basic50 .contentwrap{ overflow: hidden; } .floor_basic50 .swiper-slide{ position: relative; } .floor_basic50 .picture{ float: right; width: 70%; } .floor_basic50 .picture img { display:block; width:100%; } .floor_basic50 .wrap { position: absolute; width: 30%; top: 0; left: 0; height: 100%; } .floor_basic50 .wrap .wrap2 { padding: 10% 8%; box-sizing: border-box; } .floor_basic50 .togglewrap{ position: absolute; bottom: 0; right: 0; width: 70%; overflow: hidden; margin:0; z-index: 10; } .floor_basic50 .togglewrap li{ float: left; width: 25%; display:block; cursor: pointer; padding: 20px; box-sizing: border-box; } .floor_basic50 .togglewrap li .subpicture img { display: block; margin: 0 auto; max-width: 100%; } .floor_basic50 .togglewrap li.on { } .floor_basic50 .swiper-slide:hover .subpicture{ display: block; } /*基础组件51*/ .floor_basic51{ max-width: 1440px; margin: 0 auto; } .floor_basic51 ul:after{ content: ''; display: block; clear: both; } .floor_basic51 .wrap{ display: block; text-align: center; box-sizing: border-box; transition-duration: .2s; position: relative; } .floor_basic51 .wrap .picture{ max-width: 100%; } .floor_basic51 .wrap .title{ white-space: nowrap; } .floor_basic51 .wrap .more_btn { position: absolute; top: 100%; left: 50%; transform: translate(-50%,-50%); } .floor_basic51 .pagination { text-align: center; margin-top: 15px; } .floor_basic51 .pagination span { font-size: 50px; margin: 0 15px; opacity: 0.6; cursor: pointer; } .floor_basic51 .pagination span:hover { opacity: 1; } /*基础组件52*/ .floor_basic52{ max-width: 1440px; margin: 0 auto; overflow: hidden; } .floor_basic52 .component_body{ position: relative; } .floor_basic52 ul{ overflow: hidden; } .floor_basic52 li{ height:calc(100vh - 85px); text-align: center; box-sizing: border-box; position: relative; } .floor_basic52 .bg{ position: absolute; width: 100%; height: 100%; top: 0; left: 0; z-index: 1; } .floor_basic52 .tab_box{ position: relative; z-index:3; } .floor_basic52 .tab_box li{ display: flex; align-items: center; justify-content: center; } .floor_basic52 .title{ margin: 12px 0; transition: all 0.4s cubic-bezier(0.4,0,0.2,1); } .floor_basic52 .description{ margin: 0 15%; opacity:1; transition: all 0.4s cubic-bezier(0.4,0,0.2,1); overflow: hidden; } .floor_basic52 .tab_box1{ width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index:2; } .floor_basic52 .tab_box1 li{ width: 100%; position: relative; overflow: hidden;} .floor_basic52 .tab_box1 li::before{ content:""; position: absolute; top: 0; right: 0; z-index: 5; width: 1px; height:100%; background:rgba(255,255,255.8); transform: scalex(.5); -webkit-transform:scalex(.5); opacity: 0; } .floor_basic52 .tab_box1 .wrap{ height: 100%; width:100%; position: relative; transition: all 0.3s linear; background-size: 100% 100%; } .floor_basic52 .tab_box1 li.on .wrap{ width:0; } .floor_basic52 .tab_box1 li.on::before{ opacity:1; } .floor_basic52 .tab_box2{ width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index:1; } .floor_basic52 .tab_box2 .col{ width: 100%; height:calc(100vh - 85px); display: none; background-size: 100% 100%; position: relative; } .floor_basic52 .tab_box2 .col:first-child{ display: block; } .floor_basic52 .tab_box2 .col .bg{ background: rgba(0, 0, 0, .15); } .floor_basic52 li .more{ display: block; margin:30px auto 0; height: 48px; overflow: hidden; padding-bottom: 5px;} .floor_basic52 li .more a{ display: block; width: 176px; height: 48px; text-align: center; position: relative; overflow: hidden; margin: 0 auto; border: 2px solid rgba(255, 255, 255, 0.5); line-height:46px; font-size: 16px; padding-left:30px; border-radius:48px; box-sizing: border-box; background: calc(50% - 34px) center no-repeat; background-size: 20px; color: #fff; transition: all 0.3s linear; } .floor_basic52 li .more .icon{ width:19px; max-width:19px; max-height: 19px; vertical-align: middle; } .floor_basic52 li .more span{ display:block; height: 100%; line-height:1em; display:flex; align-items:center; left:38px; position:relative; top:0; transition: all 0.3s linear;} .floor_basic52 li .more:hover span { top: -100%; } .floor_basic52 li:hover .more a{ background: none !important; padding-left:18px; } .floor_basic52 .tab_box2 .col{ animation: picture_scale 8s linear infinite alternate both; -webkit-animation: picture_scale 8s linear infinite alternate both; } @keyframes picture_scale{ 0% { transform: scale(1); -webkit-transform: scale(1); } 100% { transform: scale(1.15); -webkit-transform: scale(1.15); } } @-webkit-keyframes picture_scale { 0% { transform: scale(1); -webkit-transform: scale(1); } 100% { transform: scale(1.15); -webkit-transform: scale(1.15); } } /*==========基础列表组件 结束==========*/ /*==========常见问题组件 开始==========*/ .floor_faq1{ max-width: 1200px; margin: 0 auto; text-align: center; } .floor_faq1 .a{ margin-top: 15px; } .floor_faq1 .q .picture,.floor_faq1 .a .subpicture{ float: left; width: 25px; margin-right:10px; } .floor_faq1 .wrap{ padding: 15px; } .floor_faq1 .title{ padding-right: 1.5em; } .floor_faq1 .swiperlist.style1 .title{ padding-right: 0; } .floor_faq1 .title,.floor_faq1 .description{ position: relative; overflow: hidden; } .floor_faq1 .tabbarlist{ overflow: hidden; margin: 15px; display: inline-block; } .floor_faq1 .tabbarlist li{ cursor: pointer; text-align: center; } .floor_faq1 .tabbarlist.style1{ float: left; } .floor_faq1 .tabbarlist.style2{ float: right; } .floor_faq1 .tabbarlist.style3 li{ float: left; } .floor_faq1 .swiperlist ul{ text-align: left; } .floor_faq1 .swiperlist li{ display: inline-block; vertical-align: top; margin-top: 10px; } .floor_faq1 .swiperlist .q{ cursor: pointer; } .floor_faq1 .swiperlist .q .title:after{ content: "\e629"; font-family: "ydiconfont" !important; position: absolute; top: 0; right: 0; bottom: 0; margin: auto; height: 1.5em; line-height: 1.5em; font-size: 1.5em; } .floor_faq1 .swiperlist .q.isshow .title:after{ transform: rotate(180deg); } .floor_faq1 .swiperlist.style4 .a,.floor_faq1 .swiperlist.style3 .a{ display: none; } .floor_faq1 .swiperlist.style1 .q{ cursor: auto; } .floor_faq1 .swiperlist.style1 .q .title:after{ content: ""; display: none; } .floor_faq1 .swiperlist.style1 .a{ display: block; } /*常见问题2*/ .floor_faq2{ max-width: 1200px; margin: 0 auto; text-align: center; } .floor_faq2 .a{ margin-top: 15px; } .floor_faq2 .q .picture,.floor_faq2 .a .subpicture{ float: left; width: 25px; margin-right: 10px; } .floor_faq2 .wrap{ padding: 15px; } .floor_faq2 .title{ padding-right: 1.5em; } .floor_faq2 .swiperlist.style1 .title{ padding-right: 0; } .floor_faq2 .title,.floor_faq2 .description{ position: relative; overflow: hidden; } .floor_faq2 .tabbarlist{ overflow: hidden; margin: 15px; display: inline-block; } .floor_faq2 .tabbarlist li{ cursor: pointer; text-align: center; } .floor_faq2 .tabbarlist.style1{ float: left; } .floor_faq2 .tabbarlist.style2{ float: right; } .floor_faq2 .tabbarlist.style3 li{ float: left; } .floor_faq2 .swiperlist ul{ text-align: left; } .floor_faq2 .swiperlist li{ display: inline-block; vertical-align: top; margin-top: 10px; } .floor_faq2 .swiperlist .q{ cursor: pointer; } .floor_faq2 .swiperlist .q .title:after{ content: "\e629"; font-family: "ydiconfont" !important; position: absolute; top: 0; right: 0; bottom: 0; margin: auto; height: 1.5em; line-height: 1.5em; font-size: 1.5em; } .floor_faq2 .swiperlist .q.isshow .title:after{ transform: rotate(180deg); } .floor_faq2 .swiperlist.style4 .a,.floor_faq2 .swiperlist.style3 .a{ display: none; } .floor_faq2 .swiperlist.style1 .q{ cursor: auto; } .floor_faq2 .swiperlist.style1 .q .title:after{ content: ""; display: none; } .floor_faq2 .swiperlist.style1 .a{ display: block; } /*==========常见问题组件 结束==========*/ /*==========表格组件 开始==========*/ /*表格组件1*/ .floor_table1{ max-width: 1440px; margin: 0 auto; } .floor_table1 .component_body{ overflow-x: auto; } .floor_table1 .table_wrap{ overflow: hidden; min-width: 1000px; } .floor_table1 tr{ transition-duration: .3s; } .floor_table1 td{ position: relative; transition-duration: .3s; } .floor_table1 td .yd-table-btn{ display: inline-block; margin: 5px; } .floor_table1 .td-item .yd-badge-right{ position: absolute; top: 0; right: 0; line-height: 25px; padding-right: 4px; z-index: 1; } .floor_table1 .td-item .yd-badge-right:before { content: "\e60e"; font-family: "ydiconfont" !important; position: absolute; right: 0; top: 0; line-height: 1em !important; z-index: -1; font-weight: normal !important; font-style: normal !important; font-size: 4em; } .floor_table1 .td-item .yd-badge-right b{ font-weight: normal; color: #fff; } /*表格组件2*/ .floor_table2{ max-width: 1440px; margin: 0 auto; } .floor_table2 .component_body{ overflow-x: auto; } .floor_table2 .table_wrap{ overflow: hidden; min-width: 1000px; } .floor_table2 td{ position: relative; transition-duration: .3s; z-index: 1; } .floor_table2 td .yd-table-btn{ display: inline-block; margin: 5px; } .floor_table2 .td-item:after{content: ''; position: absolute; top: 0; bottom: 0; right: 0; left: 0; z-index: -1; transition-duration: .3s; } .floor_table2 .td-item .yd-badge-right{ position: absolute; top: 0; right: 0; line-height: 25px; padding-right: 4px; z-index: 1; } .floor_table2 .td-item .yd-badge-right:before { content: "\e60e"; font-family: "ydiconfont" !important; position: absolute; right: 0; top: 0; overflow: hidden; line-height: 1em !important; z-index: -1; font-weight: normal !important; font-style: normal !important; font-size: 4em; } .floor_table2 .td-item .yd-badge-right b{ font-weight: normal; color: #fff; } /*==========表格组件 结束==========*/ /*==========友情链接组件 开始==========*/ /*友情链接组件1*/ .floor_link1{ max-width:1440px; margin:0 auto; padding:0 10px; } .floor_link1 .component_title { text-align:left; } .floor_link1 .component_title h2 { text-align:left; font-size:24px; font-weight:normal; } .floor_link1 .linklist { overflow:hidden; zoom:1; margin:15px 0 0; } .floor_link1 .linklist li { float:left; text-align:center; } .floor_link1 .linklist li a { line-height:30px; color:#666; display:block; } .floor_link1 .linklist li img { display:block; max-width:100%; padding:5px 0; transition-duration:.2s; } .floor_link1 .linklist li img:hover { opacity:0.8 } /*友情链接组件2*/ .floor_link2{ max-width:1440px; margin:0 auto; padding:0 10px; } .floor_link2 .component_title { text-align:left; } .floor_link2 .component_title h2 { text-align:left; font-size:24px; font-weight:normal; } .floor_link2 .linklist { overflow:hidden; zoom:1; margin:20px 0 0; display:none; } .floor_link2 .linklist.n1 { display:block; } .floor_link2 .linklist li { float:left; text-align:center; } .floor_link2 .linklist li a { line-height:30px; color:#666; display:block; } .floor_link2 .linklist li img { display:block; max-width:100%; padding:5px 0; transition-duration: .2s; } .floor_link2 .linklist li img:hover { opacity:0.8 } .floor_link2 .linkclasslist { overflow: hidden; zoom:1; position:relative; } .floor_link2 .linkclasslist:before { position:absolute; content:""; width:100%; height:2px; left:0; bottom:0; background:#d2d2d2; } .floor_link2 .linkclasslist li { float:left; cursor:pointer; font-size:18px; color:#333; line-height:2em; padding:0px 15px; overflow:hidden; white-space:nowrap; position:relative; z-index:2; } .floor_link2 .linkclasslist li.on{ color:#c3140f; border-bottom:2px solid #c00000;} /*友情链接组件4*/ .floor_link4{ max-width:1440px; margin:0 auto; padding:0 10px; } .floor_link4 .linklist { overflow:hidden; zoom:1; margin:0; text-align:center; } .floor_link4 .linklist li { display:inline-block; text-align:center; padding:0; vertical-align:middle; } .floor_link4 .linklist li a { color:#666; display:block; } .floor_link4 .linklist li img { display:block; max-width:100%; padding:5px 0; transition-duration: .2s; } .floor_link4 .linklist li img:hover { opacity:0.8; } /*==========友情链接组件 开始==========*/ /*==========其他组件 开始==========*/ /*其他组件1*/ .floor_other1{ max-width:1440px; margin:0 auto; } .other1{ position: relative; } .other1:after{ content: ''; display: block; clear: both; } .other1 li{ float: left; width: 50%; margin-bottom: 10px; } .other1 li a{ display: block; margin: 0 10px; } .other1 li .albumwrap{ padding: 30px 45px; text-align: left; background: #fff; } .other1 li .albumpicture{ overflow: hidden; } .other1 li img{ transition-duration: .5s; width: 100%; display: block; } .other1 li .albumtitle{ font-size: 19px; padding: 0; line-height: 36px; transition-duration: .5s; } .other1 li .albumdescription{ color: #999; line-height: 1.5em; height: 3em; overflow: hidden; } .other1 li:hover img{ transform: scale(1.1); } /*其他组件2*/ .floor_other2{ max-width: 1440px; margin:0 auto; text-align:center; } .other2:after{ content: ""; display: block; clear: both; } .other2 img{ display: block; max-width: 100%; } .other2 li { float:none; display:inline-block; vertical-align:top; } .other2 li .albumwrap { background:#fff; } .picture-other2 .albumtitle, .picture-other2 .albumdescription{ display: none; } .picture-other2 .albumwrap{ margin:0 5px; } .picture-other2 li { } .picture-other2 li img{ width: 100%; filter: grayscale(1); opacity: .7; } .picture-other2 li img:hover { filter: grayscale(0); opacity: 1; } .grid-other2 .albumwrap{ background:#fff; margin:15px 15px 0; padding:15px 10px; box-shadow: 0 20px 20px -15px rgba(0,0,0,.1); } .grid-other2 .albumtitle{ color: #666; font-size: 15px; padding-top:10px; } .grid-other2 .albumdescription{ color: #999; padding-top: 15px; line-height: 1.6em; text-align: justify; } .swiper-other2 li { float:left; display:block; } .swiper-other2 .albumdescription, .swiper-other2 .albumtitle{ display: none; } .swiper-other2 .albumwrap{ margin: 0 10px; } /*其他组件3*/ .floor_other3{ max-width:1440px; margin:0 auto; text-align:left; } .floor_other3 input[type="radio"]{ -webkit-appearance: auto; } .other3_navigation>li { display:inline-block; vertical-align:top; } .other3_navigation>li li { display:block; } .other3_navigation li a { display:block; } .other3_navigation li a span { display:inline-block; } /*其他组件5*/ .floor_other5{ max-width:1440px; margin:0 auto; padding:0 10px; } .floor_other5 .site_name { display:inline-block; vertical-align:middle; } .floor_other5 .sitelist { overflow:hidden; zoom:1; margin:0; text-align:center; display:inline-block; vertical-align:middle; } .floor_other5 .sitelist li { display:inline-block; text-align:center; padding:0; vertical-align:middle; } .floor_other5 .sitelist li a { display:block; } /*==========其他组件 结束==========*/ /*==========页脚组件 开始==========*/ /*页脚组件1*/ .floor_foot1_main{ background-color: #353535; padding:0; color:#ccc; overflow: visible; } .floor_foot1 { max-width:1440px; margin:0 auto; padding:0 10px; } .floor_foot1:after{ content: ''; display: block; clear: both; } .floor_foot1 .component_title{float: left;width:45%;} .floor_foot1 .foot1_navigation { overflow:hidden; } .floor_foot1 .foot1_navigation li { float: left; margin-right: 40px; overflow: hidden; } .floor_foot1 .foot1_navigation li a { display: block; text-align: left; font-size: 18px; margin-bottom: 10px; color: #ccc; font-weight: bold; } .floor_foot1 .foot1_navigation li a:hover { color: #04a07b;} .floor_foot1 .foot1_navigation li:last-child { margin-right:0; } .floor_foot1 .foot1_navigation .foot1_subnavigationlist li { float: none; padding: 0; line-height: 28px; display: block; } .floor_foot1 .foot1_navigation .foot1_subnavigationlist li a { color: #999; display: block; line-height: 30px; font-weight: normal; padding: 0; margin: 0; font-size: 13px; text-align: left; } .floor_foot1 .foot1_navigation .foot1_subnavigationlist li a:hover { color:#04a07b; } .floor_foot1 .component_body{float: left;width:25%;} .floor_foot1 .foot1_wechat { overflow:hidden; text-align:center; margin:0 15%; } .floor_foot1 .foot1_wechat img { width:102px; padding:0 0 10px 0; } .floor_foot1 .foot1_wechat div { display:block; line-height:24px; cursor:pointer; margin:0; font-size:14px; color:#ccc; } .floor_foot1 .component_bottom { float:right; width:30%; box-sizing:border-box; } .floor_foot1 .foot1_contact2_wrap { text-align:right; padding-bottom:10px; } .floor_foot1 .foot1_contact2_wrap .telephone { font-size:30px; padding-bottom:10px; } .floor_foot1 .foot1_contact2_wrap .foot1_extratext { font-size:14px; color:#bbb; } /*页脚组件2*/ .floor_foot2_main { background-color: #353535; padding:0; color:#ccc; overflow: visible; } .floor_foot2 { max-width:1440px; margin:0 auto; padding:0 10px; } .floor_foot2:after{ content: ''; display: block; clear: both; } .floor_foot2 .foot2_title { font-size:22px; color:#fff; padding-bottom:15px; margin-bottom:15px; } .floor_foot2 .component_title{float: left;width:20%; text-align:left; } .floor_foot2 .foot2_wechat { overflow:hidden; text-align:center; margin:0 15%; } .floor_foot2 .foot2_wechat img { display:inline-block; width:102px; padding:0 0 10px 0; vertical-align:middle; } .floor_foot2 .foot2_wechat .lshare { display: block; line-height: 24px; margin:0; font-size: 14px; color: #ccc; } .floor_foot2 .foot2_wechat .logotext { display: block; line-height: 24px; margin:0; font-size: 14px; color: #ccc; } .floor_foot2 .component_body{float: left;width: 32%; padding:0 3%; box-sizing:border-box; position:relative;} .floor_foot2 .component_body:before { content:""; position:absolute; left:0; top:0; width:1px; height:100%; background:#888; } .floor_foot2 .foot2_contact_wrap { padding-bottom:20px; } .floor_foot2 .component_body:after { content:""; position:absolute; right:0; top:0; width:1px; height:100%; background:#888; } .floor_foot2 .foot2_contact_wrap .telephone { font-size:24px; color:#fff; } .floor_foot2 .component_bottom{ float: left; width:48%; padding-left:3%; box-sizing:border-box; } .floor_foot2 .foot2_navigation { overflow: hidden; } .floor_foot2 .foot2_navigation li { float: left; margin-right:20px; overflow: hidden; } .floor_foot2 .foot2_navigation li a { display: block; text-align:left; font-size: 14px; color: #ccc; } .floor_foot2 .foot2_navigation li a:hover { color:#04a07b; } .floor_foot2 .foot2_content { margin-top:20px; font-size:14px; color:#ccc; } .floor_foot2 .foot2_content img { float:left; margin-right:20px; max-width:100%; } /*页脚组件3*/ .floor_foot3_main{ background-color: #353535; padding:0; color:#ccc; overflow: visible; } .floor_foot3 { max-width:1440px; margin:0 auto; padding:0 10px; } .floor_foot3:after{ content: ''; display: block; clear: both; } .floor_foot3 .component_title{float: left;width:20%; text-align:left; box-sizing:border-box; overflow:hidden; } .floor_foot3 .component_title img { margin:0; padding:0 0 20px 0; max-width:100%; } .floor_foot3 .component_title .lshare { display: block; line-height: 24px; margin:0; font-size: 14px; color: #ccc; } .floor_foot3 .component_title .logotext { display: block; line-height: 24px; margin:0; font-size: 14px; color: #ccc; } .floor_foot3 .component_body{float: left;width:45%; padding:0 0 0; box-sizing:border-box; position:relative; } .floor_foot3 .foot3_navigation { overflow: hidden; text-align:center; } .floor_foot3 .foot3_navigation li { display:inline-block; margin:0 4%; overflow: hidden; vertical-align:top; } .floor_foot3 .foot3_navigation li a { display: block; text-align:center; font-size: 14px; color: #ccc; padding-bottom:15px; margin-bottom:15px; } .floor_foot3 .foot3_navigation li a:hover { color:#04a07b; } .floor_foot3 .foot3_navigation .foot3_subnavigationlist li { float: none; margin:0; padding: 0; line-height: 28px; display: block; } .floor_foot3 .foot3_navigation .foot3_subnavigationlist li a { color: #999; display: block; line-height: 30px; font-weight: normal; padding: 0; margin: 0; font-size: 13px; text-align:center; } .floor_foot3 .foot3_navigation .foot3_subnavigationlist li a:hover{color:#04a07b;} .floor_foot3 .component_bottom{ float: right; width:35%; box-sizing:border-box; } .floor_foot3 .foot3_wechat { float:left; width:120px; margin-right:30px; overflow:hidden; text-align:center; } .floor_foot3 .foot3_wechat img { display:block; width:100px; padding:0; margin:0 auto 5px; vertical-align:middle; } .floor_foot3 .foot3_wechat span { display: block; line-height: 24px; cursor: pointer; margin:0; font-size: 14px; color: #ccc; } .floor_foot3 .foot3_contact_wrap { overflow:hidden; } .floor_foot3 .foot3_title { font-size:22px; color:#fff; padding-bottom:15px; margin-bottom:15px; } /*页脚组件4*/ .floor_foot4_main{ background-color: #353535; padding:0; color:#ccc; overflow: visible; } .floor_foot4 { max-width:1440px; margin:0 auto; padding:0 10px; position:relative; } .floor_foot4:after{ content: ''; display: block; clear: both; } .floor_foot4 .component_body{ } .floor_foot4 .foot4_navigation { text-align:center; overflow: hidden; } .floor_foot4 .foot4_navigation li { display:inline-block; padding:0 10px 0 0; line-height:30px; overflow: hidden; vertical-align:middle; } .floor_foot4 .foot4_navigation li a { display: block; font-size: 14px; color: #ccc; } .floor_foot4 .foot4_navigation li a:hover { color:#04a07b; } .floor_foot4 .extratext { position:absolute; line-height:30px; color:#fff; font-size:14px; text-align:center; } .floor_foot4 .extrapicture { position:absolute; text-align:center; } .floor_foot4 .extrapicture img { height:100%; } /*页脚组件5*/ .floor_foot5_main{ padding:0; overflow: visible; } .floor_foot5 { max-width:1440px; margin:0 auto; padding:0 10px; text-align:center; } .floor_foot5:after{ content: ''; display: block; clear: both; } .floor_foot5 .component_title{ box-sizing:border-box; } .floor_foot5 .component_body{ padding:0 0 0; box-sizing:border-box; position:relative;} .floor_foot5 .component_bottom{ box-sizing:border-box; } .floor_foot5 .component_title img { display:block; margin:0 auto; max-width:100%; } .floor_foot5 .component_title .logotext { display: block; cursor: pointer; margin:8px 0; } .floor_foot5 .foot5_contact_wrap { overflow:hidden; text-align:center; line-height:40px; } .floor_foot5 .foot5_contact_wrap p { display:inline; margin-left:50px; padding:0; vertical-align:middle; } .floor_foot5 .foot5_contact_wrap p:first-child { margin-right:0; } .floor_foot5 .foot5_contact_wrap p span { display: inline-block; margin:0 10px 0 0; vertical-align:middle; font-weight:normal !important; font-style:inherit !important; text-decoration:none !important; } .floor_foot5 .foot5_navigation { margin:10px 0 0; overflow: hidden; text-align:center; } .floor_foot5 .foot5_navigation li { display:inline-block; margin:0 10px; overflow: hidden; vertical-align:top; } .floor_foot5 .foot5_navigation li a { display: block; text-align:center; } /*页脚组件6*/ .floor_foot6_main{ padding:0; overflow: visible; } .floor_foot6 { max-width:1440px; margin:0 auto; padding:0 10px; } .floor_foot6:after{ content: ''; display: block; clear: both; } .floor_foot6 .foot6_title { padding-bottom:8px; margin-bottom:8px; } .floor_foot6 .component_title{float: left; width:48%; text-align:left; box-sizing:border-box; overflow:hidden; } .floor_foot6 .component_title img { float:left; margin:0; padding:0 6% 0 0; max-width:40%; } .floor_foot6 .component_title .logotext { display: block; margin:0; } .floor_foot6 .foot6_contact_wrap { overflow:hidden; text-align:left; margin-top:10px; } .floor_foot6 .foot6_contact_wrap p { padding:0; vertical-align:middle; text-align:left; } .floor_foot6 .foot6_contact_wrap p span { display:inline-block; margin:0 5px 0 0; vertical-align:middle; font-weight:normal !important; font-style:inherit !important; text-decoration:none !important; } .floor_foot6 .component_body{float: left;width:27%; padding:0 1% 0 10%; box-sizing:border-box; position:relative; } .floor_foot6 .foot6_navigation { overflow: hidden; text-align:left; } .floor_foot6 .foot6_navigation li { overflow: hidden; } .floor_foot6 .foot6_navigation li a { display: block; text-align:left; margin-bottom:8px; } .floor_foot6 .component_bottom{ float: right; width:25%; box-sizing:border-box; } .floor_foot6 .foot6_wechat { display:inline-block; vertical-align:top; width:120px; margin-right:30px; overflow:hidden; text-align:center; } .floor_foot6 .foot6_wechat:last-child { margin-right:0; } .floor_foot6 .foot6_wechat img { display:block; width:120px; padding:0; margin:0 auto 5px; vertical-align:middle; } .floor_foot6 .foot6_contact_wrap { overflow:hidden; } /*页脚组件7*/ .floor_foot7_main{ padding:0; overflow: visible; } .floor_foot7 { max-width:1440px; margin:0 auto; padding:0 10px; } .floor_foot7:after{ content: ''; display: block; clear: both; } .floor_foot7 .component_title{ float: left; text-align:left; box-sizing:border-box; overflow:hidden; margin-right:6%; position:relative; z-index:2; } .floor_foot7 .component_title img { width:100%; margin:0; } .floor_foot7 .component_body{ float:left; padding:0; box-sizing:border-box; position:relative; } .floor_foot7 .foot7_navigation { overflow: hidden; display:flex; } .floor_foot7 .foot7_navigation>li { overflow: hidden; flex:1; } .floor_foot7 .foot7_navigation li a { display: block; } .floor_foot7 .component_bottom{ float: right; width:220px; position:relative; z-index:2; } .floor_foot7 .foot7_wechat_main { text-align:center; } .floor_foot7 .telephone { margin-bottom:15px; } .floor_foot7 .foot7_link { padding-bottom:5px; } .floor_foot7 .foot7_link select { width:100%; display:block; margin:0 0 10px; height: 40px; } .floor_foot7 .foot7_wechat { display:inline-block; vertical-align:top; width:100px; margin-left:15px; overflow:hidden; text-align:center; } .floor_foot7 .foot7_wechat:first-child { margin-left:0; } .floor_foot7 .foot7_wechat img { display:block; width:100%; } .floor_foot7 .foot7_wechat div { margin-top:5px; } /*页脚组件8*/ .floor_foot8_main{ background-color: #353535; padding:0; color:#ccc; overflow: visible; } .floor_foot8 { max-width:1440px; margin:0 auto; padding:0 10px; } .floor_foot8:after{ content: ''; display: block; clear: both; } .floor_foot8 .logo_wrap{ width: 100%; padding:15px 0 20px; overflow: hidden; border-bottom:1px solid #f0f0f0; margin-bottom: 20px; } .floor_foot8 .logo_wrap.hideboder{ margin-bottom:5px; } .floor_foot8 .logo_wrap .logo{ float: left;} .floor_foot8 .logo_wrap .logotext{ float:right; } .floor_foot8 .component_title{float: left;width:45%;} .floor_foot8 .foot8_navigation { overflow:hidden; } .floor_foot8 .foot8_navigation li { float: left; margin-right: 40px; overflow: hidden; } .floor_foot8 .foot8_navigation li a { display: block; text-align: left; font-size: 18px; margin-bottom: 10px; color: #ccc; font-weight: bold; } .floor_foot8 .foot8_navigation li a:hover { color: #04a07b;} .floor_foot8 .foot8_navigation li:last-child { margin-right:0; } .floor_foot8 .foot8_navigation .foot8_subnavigationlist li { float: none; padding: 0; line-height: 28px; display: block; } .floor_foot8 .foot8_navigation .foot8_subnavigationlist li a { color: #999; display: block; line-height: 30px; font-weight: normal; padding: 0; margin: 0; font-size: 13px; text-align: left; } .floor_foot8 .foot8_navigation .foot8_subnavigationlist li a:hover { color:#04a07b; } .floor_foot8 .component_body{float: left;width:25%;} .floor_foot8 .foot8_wechat { overflow:hidden; text-align:center; margin:0 15%; } .floor_foot8 .foot8_wechat img { width:102px; padding:0 0 10px 0; } .floor_foot8 .foot8_wechat div { display:block; line-height:24px; cursor:pointer; margin:0; font-size:14px; color:#ccc; } .floor_foot8 .component_bottom { float:right; width:30%; box-sizing:border-box; } .floor_foot8 .foot8_contact2_wrap { text-align:right; padding-bottom:10px; } .floor_foot8 .foot8_contact2_wrap .telephone { font-size:30px; padding-bottom:10px; } .floor_foot8 .foot8_contact2_wrap .foot8_extratext { font-size:14px; color:#bbb; } /*==========页脚组件 结束==========*/ /*==========技术支持组件 开始==========*/ /*技术支持组件1*/ .floor_support1_main { color:#999; background-color: #292929;} .floor_support1{ max-width:1440px; margin:0 auto; padding:0; overflow: hidden; } .floor_support1 .component_body { padding:0 10px; } .floor_support1 .footer_text{ text-align: center; padding-bottom:10px; line-height:30px; } .floor_support1 a {color: #888; text-decoration: none;} .floor_support1 a:hover {color:#fff; text-decoration: none;} .floor_support1 .webinfo{ line-height:30px; position:relative; overflow:hidden; } .floor_support1 .support1_text{ position:absolute; right:0; top:0; line-height:30px; color:#fff; font-size:14px; } /*==========技术支持组件 结束==========*/ /*==========发展历程组件 开始==========*/ /*发展历程组件1*/ .floor_flow1{ max-width:1440px; margin:0 auto; padding:0 10px; box-sizing:border-box; } .floor_flow1 .component_body{ border-top:1px solid #fff; position:relative; padding:0; } .floor_flow1 .center_line{ position:absolute; top:0; left:50%; width:1px; height:100%; background:#fff; margin-left:-0.5px; } .floor_flow1 ul{ overflow: hidden; } .floor_flow1 li{ position:relative; width:50%; float:left; margin:25px 50px 25px 0; text-align:right; } .floor_flow1 li.m1{ float:right; margin:25px 0 25px 50px; text-align:left; } .floor_flow1 li .point_back{ position:absolute; top:5px; left:auto; right:-12px; width:24px; height:24px; } .floor_flow1 li .point_big{ width:100%; height:100%; border-radius:50%; background:#fff; opacity:0.3; } .floor_flow1 li .point_small{ position:absolute; top:5px; left:5px; width:14px; height:14px; border-radius:50%; background:#fff; } .floor_flow1 li.m1 .point_back{ right:auto; left:-12px; } .floor_flow1 li .subtitle{ float:right; font-size:22px; line-height:1.6em; margin:0 25px 0 50px; text-align:center; } .floor_flow1 li.m1 .subtitle{ float:left; margin:0 50px 0 25px; } .floor_flow1 li .title{ font-size:24px; margin-bottom:0.5em; } .floor_flow1 li .description{ font-size:14px; line-height:1.5; } /*发展历程组件2*/ .floor_flow2{ max-width:1440px; margin:0 auto; padding:0 10px; box-sizing:border-box; } .floor_flow2 .component_body{ position:relative; padding:0; } .floor_flow2 .flow2 { padding:20px 0; } .floor_flow2 .center_line{ position:absolute; top:0; left:50%; width:1px; height:100%; border-left:1px dashed #aaa; } .floor_flow2 ul{ overflow: hidden; } .floor_flow2 li{ position:relative; width:50%; float:left; margin:0 50px 0 0; text-align:left; } .floor_flow2 li.m1{ float:right; margin:0 0 0 50px; text-align:left; } .floor_flow2 li .point_back{ position:absolute; top:55px; left:auto; right:-10px; width:20px; height:20px; border-radius:50%; background:#fff; } .floor_flow2 li.m1 .point_back{ right:auto; left:-10px; } .floor_flow2 li .subtitle{ float:right; font-size:26px; font-weight:bold; line-height:30px; margin:50px -125px 0 100px; text-align:center; } .floor_flow2 li.m1 .subtitle{ float:left; margin:50px 100px 0 -125px; } .floor_flow2 li .subtitle{ font-size:24px; margin-bottom:0.5em; } .floor_flow2 li .albumwrap_wrap { float:right; padding:20px; margin-top:-30px; max-width:100%; background:#f4f4f4; box-sizing:border-box; } .floor_flow2 li img { max-width:100%; display:block; } .floor_flow2 li .title { padding:0.5em 0 0; font-size:18px; } .floor_flow2 li .description{ max-width: 100%; margin-top:0.5em; font-size:14px; line-height:1.5; text-align:left; } .floor_flow2 li.m1 .albumwrap_wrap { float:left; } .floor_flow2 li.n1 .albumwrap_wrap { margin-top:0; } /*发展历程组件3*/ .floor_flow3{ max-width:1000px; margin:0 auto; padding:0 10px; box-sizing:border-box; } .floor_flow3 .component_body{ position:relative; padding:0; } .floor_flow3 .center_line{ position:absolute; top:0; left:50%; width:1px; height:100%; border-left:1px solid #aaa; } .floor_flow3 ul{ overflow: hidden; } .floor_flow3 li{ position:relative; width:100%; margin:20px 50px 0 0; text-align:left; overflow:hidden; } .floor_flow3 li.n1 { margin-top:0; } .floor_flow3 li .point_back{ position:absolute; top:50%; left:50%; margin-left:-6px; margin-top:-6px; width:12px; height:12px; border-radius:50%; background:#fff; } .floor_flow3 li .picture { width:30%; display:inline-block; vertical-align:middle; } .floor_flow3 li img { width:100%; display:block; } .floor_flow3 li .subtitle{ display:inline-block; width:20%; font-size:16px; line-height:30px; margin:0; text-align:center; vertical-align:middle; } .floor_flow3 li .albumwrap_wrap { width:49%; padding:10px 0 10px 5%; display:inline-block; vertical-align:middle; box-sizing:border-box; } .floor_flow3 li .title { padding:0 0 0.5em; font-size:18px; } .floor_flow3 li .description{ font-size:14px; line-height:1.5; text-align:left; } /*发展历程组件4*/ .floor_flow4{ max-width:1440px; margin:0 auto; padding:0 10px; box-sizing:border-box; } .floor_flow4 .component_body{ position:relative; padding:0; width:100%; } .floor_flow4 ul{ overflow: hidden; text-align:center; min-width:100%; } .floor_flow4 li{ display:inline-block; float:none; width:160px; margin:0; vertical-align:bottom; } .floor_flow4 li .description{ width:80%; margin:0 auto; padding:15px 0; font-size:14px; text-align:left; } .floor_flow4 li .center_line{ position:relative; width:102%; height:1px; background:#aaa; transform: rotate(-7.1deg); } .floor_flow4 li .point_back{ position:absolute; bottom:-6px; left:50%; margin-left:-6px; width:10px; height:10px; border:1px solid #aaa; border-radius:50%; background:#fff; } .floor_flow4 li .subtitle{ font-size:16px; margin:30px 0 10px; text-align:center; } .floor_flow4 li .column_div { display:inline-block; width:25px; background:#aaa; } /*发展历程组件5*/ .floor_flow5{ max-width:1440px; margin:0 auto; padding:0 10px; box-sizing:border-box; } .floor_flow5 .component_body{ position:relative; padding:0; width:100%; } .floor_flow5 ul{ overflow: hidden; text-align:center; min-width:100%; } .floor_flow5 li{ display:inline-block; float:none; width:200px; margin:0; vertical-align:top; } .floor_flow5 li .subtitle{ font-size:16px; padding:15px 0 50px; text-align:center; } .floor_flow5 li.m1 .subtitle { padding:5px 0 50px; } .floor_flow5 li .center_line{ position:relative; width:100%; height:0; border-bottom:1px dashed #aaa; transform: rotate(17.3deg); } .floor_flow5 li.m1 .center_line { transform: rotate(-17.3deg); } .floor_flow5 li .title { float:right; width:60px; height:60px; line-height:60px !important; background:#888; font-size:16px; color:#fff; border-radius:50%; margin-top:-10px; } .floor_flow5 li.m1 .title { margin-top:-48px; } .floor_flow5 li .description{ width:65%; margin:0 auto; padding:20px 0 0; font-size:14px; text-align:left; } .floor_flow5 li.m1 .description { padding:30px 0 0; } /*发展历程组件6*/ .floor_flow6{ max-width:1440px; margin:0 auto; padding:0 10px; box-sizing:border-box; } .floor_flow6 .component_body{ position:relative; padding:0; } .floor_flow6 .center_line{ position:absolute; top:50%; left:0; width:100%; height:1px; background:#aaa; } .floor_flow6 ul{ overflow: hidden; text-align:center; min-width:100%; } .floor_flow6 li{ position:relative; float:none; display:inline-block; width:200px; margin:0; vertical-align:middle; } .floor_flow6 li .point_back{ position:absolute; top:50%; left:50%; width:50px; height:50px; border-radius:50%; margin-left:-25px; margin-top:-25px; background:#fff; } .floor_flow6 li .point_big{ position:absolute; top:15px; left:15px; width:20px; height:20px; border-radius:50%; background:#fff; opacity:0.3; } .floor_flow6 li .point_small{ position:absolute; top:18px; left:18px; width:14px; height:14px; border-radius:50%; background:#fff; } .floor_flow6 li .subtitle{ font-size:26px; font-weight:bold; height:100px; line-height:100px; margin:0; text-align:center; } .floor_flow6 li .description{ position:relative; width:90%; height:60px; font-size:14px; line-height:1.5; text-align:left; margin:0 auto; overflow:hidden; } .floor_flow6 li.m0 .description { padding-top:90px; } .floor_flow6 li.m1 .description { padding-bottom:90px; } .floor_flow6 li .description:before { content:""; position:absolute; width:1px; height:80px; left:50%; top:0; background:#aaa; z-index:-1; opacity:0.6; } .floor_flow6 li.m1 .description:before { top:auto; bottom:0; } /*发展历程组件7*/ .floor_flow7{ max-width:1440px; margin:0 auto; padding:0 10px; box-sizing:border-box; } .floor_flow7 .component_body{ position:relative; padding:0; width:100%; } .floor_flow7 .center_line{ position:absolute; top:20px; left:0; width:100%; height:1px; background:#aaa; } .floor_flow7 ul{ overflow:inherit; text-align:center; min-width:100%; } .floor_flow7 li{ display:inline-block; float:none; width:228px; margin:0; vertical-align:top; position:relative; } .floor_flow7 li a { display:block; width:80%; margin:0 auto; padding:20px 0; } .floor_flow7 li .point_back{ position:absolute; top:10px; left:50%; margin-left:-9px; width:18px; height:18px; border:1px solid #aaa; border-radius:50%; } .floor_flow7 li .point_back .point { position:absolute; bottom:4px; left:50%; margin-left:-5px; width:10px; height:10px; background:#aaa; border-radius:50%; } .floor_flow7 li .subtitle{ margin:30px 0 10px; font-size:16px; text-align:center; } .floor_flow7 li .title{ margin:0 0 10px; font-size:18px; text-align:center; } .floor_flow7 li .description{ margin:0; padding:15px; min-height:150px; font-size:14px; line-height:2em; text-align:left; box-sizing:border-box; border:1px solid #ddd; } /*发展历程组件8*/ .floor_flow8{ max-width:1440px; margin:0 auto; padding:0 10px; box-sizing:border-box; } .floor_flow8 .component_body{ position:relative; padding:0; } .floor_flow8 .center_line{ position:absolute; top:0; left:50%; width:1px; height:100%; border-left:1px dashed #aaa; } .floor_flow8 ul{ overflow:hidden; } .floor_flow8 li{ position:relative; width:50%; float:left; margin:-40px 50px 0 0; text-align:right; } .floor_flow8 li.n1 { margin-top:0; } .floor_flow8 li.m1{ float:right; margin:-40px 0 0 50px; text-align:left; } .floor_flow8 li .point_back{ position:absolute; top:50%; left:auto; right:-11px; margin-top:-11px; width:20px; height:20px; border:1px solid #aaa; border-radius:50%; background:#fff; } .floor_flow8 li.m1 .point_back{ right:auto; left:-11px; } .floor_flow8 li .point_back .point { position:absolute; width:10px; height:10px; border:1px solid #aaa; left:4px; top:4px; border-radius:50%; } .floor_flow8 li .picture{ float:right; font-weight:bold; line-height:30px; margin:0 30px; text-align:center; } .floor_flow8 li.m1 .picture { float:left; } .floor_flow8 li img { max-width:100%; } .floor_flow8 li .albumwrap_wrap { text-align:right; } .floor_flow8 li.m1 .albumwrap_wrap { text-align:left; } .floor_flow8 li .subtitle{ font-size:18px; margin-top:0.5em; } .floor_flow8 li .title{ font-size:21px; padding-top:0.5em; margin-bottom:0.5em; } .floor_flow8 li .description{ font-size:14px; line-height:1.5; } /*发展历程组件9*/ .floor_flow9{ max-width:1440px; margin:0 auto; padding:0 10px; box-sizing:border-box; } .floor_flow9 .component_body{ position:relative; padding:0; width:100%; } .floor_flow9 ul{ overflow: hidden; text-align:center; min-width:100%; } .floor_flow9 li{ display:inline-block; float:none; width:220px; margin:0; vertical-align:top; } .floor_flow9 li .subtitle{ font-size:16px; width:90%; line-height:30px; margin:0 auto; padding:10px 0; border-radius:5px; text-align:center; background:#3a58f4; color:#fff; } .floor_flow9 li .picture { width:90%; margin:0 auto; } .floor_flow9 li .picture img { max-width:40%; display:block; border-radius:5px; margin:10px auto 0; } .floor_flow9 li .picture img:hover { opacity:0.8; } .floor_flow9 li .title { width:90%; margin:1em auto 0.5em; font-size:18px; font-weight:bold; } .floor_flow9 li .description{ width:90%; margin:0 auto; font-size:14px; line-height:1.8em; text-align:center; box-sizing:border-box; overflow:hidden; } /*发展历程组件10*/ .floor_flow10{ max-width:1440px; margin:0 auto; padding:0 10px; box-sizing:border-box; } .floor_flow10 .component_body{ position:relative; padding:0; width:100%; } .floor_flow10 ul{ overflow: hidden; text-align:center; min-width:100%; } .floor_flow10 li{ display:inline-block; float:none; width:250px; margin:0; vertical-align:top; } .floor_flow10 li .subtitle{ font-size:18px; height:40px; margin:0 0 0 20%; padding-left:15px; border-left:1px solid #ccc; color:#3a58f4; text-align:left; } .floor_flow10 li .albumwrap { width:80%; margin:0 auto; border:1px solid #ccc; padding:6px; box-sizing:border-box; position:relative; } .floor_flow10 li .picture { } .floor_flow10 li .picture img { width:100%; display:block; } .floor_flow10 li .picture img:hover { opacity:0.8; } .floor_flow10 li .title { position:absolute; width:50px; height:50px; line-height:50px; right:-15px; bottom:-25px; border:1px solid #ccc; color:#3a58f4; font-size:16px; font-weight:bold; border-radius:50%; background:#fff; box-shadow:0 0 5px 0 rgba(0,0,0,.15); } .floor_flow10 li .description{ margin:0 30% 0 12%; font-size:14px; padding:10px 20px 20px 0; line-height:1.8em; text-align:left; border-right:1px solid #ccc; box-sizing:border-box; overflow:hidden; } /*发展历程组件11*/ .floor_flow11{ max-width:1440px; margin:0 auto; padding:0 10px; box-sizing:border-box; } .floor_flow11 .component_body{ position:relative; padding:0; width:100%; } .floor_flow11 ul{ overflow: hidden; text-align:center; min-width:100%; } .floor_flow11 li{ display:inline-block; float:none; width:250px; margin:0; vertical-align:top; } .floor_flow11 li .albumwrap { box-sizing:border-box; position:relative; } .floor_flow11 li .subtitle{ font-size:24px; height:30px; line-height:30px; padding:8% 0 5%; font-weight:bold; color:#fff; } .floor_flow11 li .description{ font-size:14px; padding:0 10%; line-height:1.8em; text-align:left; box-sizing:border-box; overflow:hidden; } .floor_flow11 li .picture { overflow:hidden; } .floor_flow11 li .picture img { min-width:100%; min-height:100%; display:block; transition-duration: .5s; } .floor_flow11 li .picture img:hover { transform:scale(1.1); } /*发展历程组件12*/ .floor_flow12{ max-width:1440px; margin:0 auto; padding:0 10px; box-sizing:border-box; } .floor_flow12 .component_body{ position:relative; padding:0; } .floor_flow12 .center_line{ position:absolute; top:50%; left:0; width:100%; height:1px; background:#aaa; } .floor_flow12 ul{ overflow: hidden; text-align:center; min-width:100%; } .floor_flow12 li{ position:relative; float:none; display:inline-block; width:200px; margin:0; vertical-align:middle; } .floor_flow12 li .point_back{ position:absolute; top:50%; left:50%; width:10px; height:10px; border-radius:50%; margin-left:-5px; margin-top:-5px; background:#aaa; } .floor_flow12 li .subtitle{ width:80%; font-size:14px; line-height:40px; margin:30px auto 20px; text-align:center; box-shadow:0 0 10px 0 #aaa; border-radius:3px; position:relative; } .floor_flow12 li.m1 .subtitle { margin:20px auto 30px; } .floor_flow12 li .subtitle .ydicon-right4 { position:absolute; color:#fff; top:100%; left:50%; font-size:24px; margin-top:-20px; margin-left:-11px; transform:rotate(-21deg); } .floor_flow12 li.m1 .subtitle .ydicon-right4 { position:absolute; color:#fff; top:0; left:50%; font-size:24px; margin-bottom:-20px; margin-left:-13px; transform:rotate(159deg); } .floor_flow12 li .title { margin-left:10px; } .floor_flow12 li .description{ position:relative; width:80%; height:80px; font-size:14px; line-height:1.5; text-align:center; margin:0 auto; overflow:hidden; } .floor_flow12 li.m0 .description { padding-top:20px; } .floor_flow12 li.m1 .description { padding-bottom:20px; } .floor_flow12 li .description .view { text-align:center; color:#f80; margin-top:5px; } .floor_flow12 li .description .view:hover { text-decoration:underline; } /*==========发展历程组件 结束==========*/ /*==========联系我们组件 开始==========*/ /*联系组件1701*/ .floor_contact1{ max-width: 1440px; margin: 0 auto; } .contact1{ overflow: hidden; position: relative; } .contact1 ul{ position: absolute; left: 0; top: 0; width: 40%; height: 100%; box-sizing: border-box; padding: 35px 50px; display: flex; flex-direction: column; justify-content: center; } .contact1 i{ font-weight: normal !important; padding-right: 5px; } .contact1 .map_container{ float: right; height: 300px; width: 60%; } .contact1.style1 ul{ left: auto; right: 0; } .contact1.style1 .map_container{ float: left; } /*联系组件1702*/ .floor_contact2{ max-width: 1440px; margin: 0 auto; } .contact2 ul{ overflow: hidden; } .contact2 li{ position: relative; float: left; text-align: center; width: 12.5%; height: 140px; box-sizing: border-box; padding: 20px; z-index: 1; } .contact2 li:after{ content: ''; position: absolute; left: 10px; top: 10px; bottom: 10px; right: 10px; background: #fff; z-index: -1; border-radius: 16px; } .contact2 li span{ display: block; } .contact2 i{ font-weight: normal !important; padding-right: 5px; } .contact2 .map_container{ width: 100%; height: 300px; } /*联系组件1703*/ .floor_contact3{ max-width: 1440px; margin: 0 auto; } .contact3 ul{ overflow: hidden; } .contact3 p{ text-align: center; padding: 10px; margin-bottom: 10px; } .contact3 li{ position: relative; float: left; text-align: center; width: 12.5%; box-sizing: border-box; padding: 20px 10px; z-index: 1; } .contact3 li span{ display: block; } .contact3 li i{ display: block; font-weight: normal !important; margin: 0 auto 10px; } .contact3 .map_container{ width: 100%; height: 300px; } /*联系组件1704*/ .floor_contact4{ max-width: 1440px; margin: 0 auto; } .contact4{ overflow-x: auto; white-space: nowrap; font-size: 0; overflow-y: hidden; } .contact4 p{ text-align: center; } .contact4 li{ position: relative; display: inline-block; min-width: 205px; text-align: center; width: 12.5%; box-sizing: border-box; padding: 20px; z-index: 1; } .contact4 li .wrap{ background: #fff; padding: 15px; position: relative; z-index: 1; transition-duration: .5s; border-radius: 3px; } .contact4 li:after,.contact4 li:before{ content: ''; position: absolute; width: 100px; height: 10px; bottom: 35px; z-index: -1; box-shadow: 0 5px 25px -2px #000; transition-duration: .5s; } .contact4 li:after{ left: 20px; transform: rotate(-15deg); } .contact4 li:before{ right: 20px; transform: rotate(15deg); } .contact4 li span{ display: block; } .contact4 li i{ position: absolute; left: 0; right: 0; display: block; font-weight: normal !important; margin: 10px auto; color: #fff; z-index: 1; border-radius: 50%; } .contact4 li i:after,.contact4 li i:before{ position: absolute; margin: auto; border-radius: 50%; z-index: -1; } .contact4 li i:after{ content: ''; top: 5px; left: 5px; bottom: 5px; right: 5px; z-index: -2; opacity: .7; } .contact4 li i:before{ top: 12px; left: 12px; bottom: 12px; right: 12px; } .contact4 li a.view{ display: block; width: 100px; height: 35px; line-height: 35px; margin: 10px auto 0; text-align: center; color: #fff; font-size: 14px; cursor: initial; border-radius: 3px; } .contact4 .map_container{ width: 100%; height: 300px; } .contact4 li:hover .wrap{ transform: translatey(-10px); } .contact4 li:hover:after,.contact4 li:hover:before{ transform: translatey(-8px); } /*联系组件1705*/ .floor_contact5{ max-width: 1440px; margin: 0 auto; } .contact5{ overflow: hidden; position: relative; } .contact5 .company{ border-bottom: 1px solid #ddd; } .contact5 .contact5list{ position: absolute; left: 0; top: 0; width: 40%; height: 100%; box-sizing: border-box; padding:25px 50px; display: flex; flex-direction: column; justify-content: center; } .contact5 .contact5list li{ border-bottom: 1px solid #ddd; padding:7px 0 5px; } .contact5 ul.contact5list li:last-child{ border: none !important; } .contact5 i{ font-weight: normal !important; padding-right: 5px; } .contact5 .map_container{ float: right; height: 300px; width: 60%; } .contact5.style1 .contact5list{ left: auto; right: 0; } .contact5.style1 .map_container{ float: left; } .floor_contact5 .datalist{ overflow: hidden; margin-top:5px; } .floor_contact5 .datalist li{ float:left; width: 25%; } .floor_contact5 .datalist li:first-child .wrap{ margin-left:0; } .floor_contact5 .datalist .wrap{ margin-left: 15px; margin-top:15px; background:#fff; padding:15px 15px 20px; border-radius:6px; overflow: hidden; box-sizing: border-box;} .floor_contact5 .datalist .column2:nth-child(2n 1) .wrap{ margin-left:0; } .floor_contact5 .datalist .column3:nth-child(3n 1) .wrap{ margin-left:0; } .floor_contact5 .datalist .column4:nth-child(4n 1) .wrap{ margin-left:0; } .floor_contact5 .datalist .column5:nth-child(5n 1) .wrap{ margin-left:0; } .floor_contact5 .datalist .column6:nth-child(6n 1) .wrap{ margin-left:0; } /*联系组件1706*/ .floor_contact6{ max-width: 1440px; margin: 0 auto; padding:15px 0; } .floor_contact6.full-width1{ padding:15px 30px; } .contact6{ overflow: hidden; position: relative; } .contact6 .contact6list{ width: 100%; padding:0 0; overflow: hidden; box-sizing: border-box; } .contact6 .contact6list li{ float: left; border-left:1px solid #929292; box-sizing: border-box; padding:0 20px; } .contact6 .contact6list li:nth-child(even){ width:48%; } .contact6 .contact6list li:nth-child(odd){ width:26%; } .contact6 .contact6list li.first{ width:26% !important; height: 10em; border-left: none; display: flex; align-items: center; flex-grow: 1; } .contact6 .contact6list li.first img{ display:inline-block; width:45px; vertical-align: middle; animation:c-tel 0.6s linear infinite alternate both; -webkit-animation:c-tel 0.6s linear infinite alternate both; line-height: 1.2em !important; } .contact6 .contact6list li img{ margin-right: 5px; vertical-align: middle; } .contact6 .contact6list li b{ white-space: nowrap; } .contact6 .contact6list li .nowrap{ white-space: nowrap; } @keyframes c-tel{ 0%{transform: rotate(-15deg); -webkit-transform: rotate(-15deg); } 100%{transform: rotate(15deg); -webkit-transform: rotate(15deg);} } @-webkit-keyframes c-tel{ 0%{transform: rotate(-15deg); -webkit-transform: rotate(-15deg); } 100%{transform: rotate(15deg); -webkit-transform: rotate(15deg);} } /*==========联系我们组件 结束==========*/ /*==========优势特点组件 开始==========*/ /*优势特点组件1*/ .floor_good1{ max-width: 1440px; margin: 0 auto; padding:0; box-sizing:border-box; } .floor_good1 ul{ padding: 0 50px; overflow: hidden; } .floor_good1 li{ width: 25%; float: left; text-align: center; color: #fff; text-align: center; } .floor_good1 .wrap{ display: inline-block; text-align: left; } .floor_good1 .picture{ margin-bottom: 5px; } .floor_good1 span{ display: inline-block; vertical-align: top; } .floor_good1 span.title{ font-size: 48px; } /*优势特点组件2*/ .floor_good2{ max-width: 1440px; margin: 0 auto; padding:50px; box-sizing:border-box; overflow: hidden; display: flex; } .floor_good2 .component_title{ float: left; width: 450px; margin-right: 60px; overflow: hidden; } .floor_good2 .component_body{ overflow: hidden; display: flex; flex: 1; flex-direction: column; justify-content: space-around; } .floor_good2 i{ display: block; margin: 10px 0; width: 1em; height: 2px; } .floor_good2 ul{ overflow: hidden; margin-top: 50px; } .floor_good2 li{ width: 25%; float: left; color: #fff; } .floor_good2 .picture{ margin-bottom: 10px; min-height: 50px; } .floor_good2 span{ display: inline-block; vertical-align: top; } .floor_good2 span.title{ font-size: 48px; } .floor_good2.style2 .component_title{ float: right; } /*优势特点组件3*/ .floor_good3{ max-width: 1440px; margin: 0 auto; box-sizing:border-box; } .floor_good3 ul{ overflow: hidden; } .floor_good3 li{ width: 25%; float: left; overflow: hidden; } .floor_good3 .wrap{ text-align: center; padding: 20px 10px; } .floor_good3 .picture{ position: relative; width: 100%; } .floor_good3 .picture img{ display: block; } .floor_good3 .description{ margin: 10px auto 0; } .floor_good3 .picture:after,.floor_good3 .picture:before{ content: ""; position: absolute; left: 0; top: 0; bottom: 0; right: 0; opacity: 0; visibility: hidden; transition-duration: .5s; z-index: 1; } .floor_good3 .picture:before{ content: "more "; width: 80px; height: 80px; line-height: 80px !important; text-align: center; margin: auto; z-index: 2; } .floor_good3 li:hover .picture:after,.floor_good3 li:hover .picture:before{ visibility: visible; opacity: 1; } /*优势特点组件4*/ .floor_good4{ max-width: 1200px; margin: 0 auto; } .floor_good4 .component_body{ overflow: hidden; display: flex; justify-content: center; } .floor_good4 .tpicture{ float: left; margin-right: 50px; } .floor_good4 ul{ overflow: hidden; display: flex; flex-direction: column; justify-content: space-around; } .floor_good4 li{ overflow: hidden; } .floor_good4 .wrap{ display: flex; align-items: center; } .floor_good4 li.n2,.floor_good4 li.n3{ padding-left: 60px; } .floor_good4 li i,.floor_good4 li .picture{ float: left; margin-right: 10px; } /*优势特点组件5*/ .floor_good5{ max-width: 1200px; margin: 0 auto; } .floor_good5 .component_body{ position: relative; } .floor_good5 .tpicture{ position: absolute; left: 0; top: 0; right: 0; bottom: 0; margin: auto; z-index: 1; } .floor_good5 ul{ overflow: hidden; position: relative; } .floor_good5 li{ float: left; min-width: 34%; padding: 15px 0; border-top: 1px solid #e1e2e9; } .floor_good5 li.m1{ float: right; display: flex; justify-content: flex-end; } .floor_good5 li.n1,.floor_good5 li.n2{ border-top: 0; } .floor_good5 .wrap{ display: flex; align-items: center; } .floor_good5 li i,.floor_good5 li .picture{ float: left; margin-right: 10px; } /*优势特点组件6*/ .floor_good6{ max-width: 1200px; margin: 0 auto; } .floor_good6 .component_body{ position: relative; } .floor_good6 .tpicture{ position: absolute; width: 340px; height: 340px; left: 0; top: 0; right: 0; bottom: 0; margin: auto; z-index: 1; padding: 40px; border: 1px dashed #d1d2d9; border-radius: 50%; } .floor_good6 ul{ height: 400px; } .floor_good6 .wrap{ position: relative; } .floor_good6 li{ position: absolute; text-align: right; width: 380px; } .floor_good6 li.m1{ text-align: left; } .floor_good6 li.n1{ top: -20px; left: 10px; } .floor_good6 li.n2{ right: 0; top: 20px; } .floor_good6 li.n3{ left: -55px; top: 168px; } .floor_good6 li.n4{ bottom: 80px; right: -30px; } .floor_good6 li.n5{ left: 45px; bottom: -25px; } .floor_good6 .picture{ position: absolute; z-index: 1; width: 40px; height: 40px; } .floor_good6 .picture.n1{ top: 46px; left: 36px; } .floor_good6 .picture.n2{ right: 25px; top: 60px; } .floor_good6 .picture.n3{ left: -20px; top: 195px; } .floor_good6 .picture.n4{ right: 0; bottom: 105px; } .floor_good6 .picture.n5{ left: 96px; bottom: 5px; } .floor_good6 i{ position: absolute; width: 20px; height: 20px; background: #000; border-radius: 50%; z-index: 1; } .floor_good6 i.n1{ top: 52px; left: 50px; } .floor_good6 i.n2{ right: 45px; top: 58px; } .floor_good6 i.n3{ left: -10px; top: 205px; } .floor_good6 i.n4{ right: 8px; bottom: 115px; } .floor_good6 i.n5{ left: 90px; bottom: 20px; } /*优势特点组件7*/ .floor_good7{ max-width: 1440px; margin: 0 auto; box-sizing: border-box; overflow: hidden; } .floor_good7 .datalist li{ overflow: hidden; } .floor_good7 .datalist .img{ width: 34%; float: left; border-radius:8px; overflow: hidden; } .floor_good7 .datalist .img img{ width: 100%; vertical-align: middle; } .floor_good7 .wrap{ float: left; width: 66%; padding:15px 50px; box-sizing: border-box; } .floor_good7 .wrap .link{ display: block; ; margin-top:20px; } .floor_good7 .wrap .link span{ font-size: 40px } .floor_good7 .swiper-slide{ background-size: cover; } .floor_good7 .component_bottom{ position: relative; margin-top:20px; overflow: hidden; } .floor_good7 .tabbarlist{ position: relative; z-index: 0; display: flex; align-items: center; justify-content: space-around; flex-wrap:nowrap; } .floor_good7 .tabbarlist li{ min-width:220px; cursor: pointer; padding: 0 10px; box-sizing: border-box; display: flex; align-items: center; } .floor_good7 .tabbarlist li i{ font-size: 38px; color: #e9eef3; line-height: 40px; float: left; font-family:'bebas'; position: relative; } .floor_good7 .tabbarlist li i::after{content:""; width:12px; height:12px; display:block; border-radius:50%; background:#abbbc8; position:absolute; left:20px; top:50%; transform: translatey(-50%); } .floor_good7 .tabbarlist li span{ padding-left:5px; font-size: 16px; color: #333; line-height:1.6em; } .floor_good7 .pagination{ display: none; } .floor_good7 .pagination .prev,.floor_good7 .pagination .next{ position: absolute; left:0; width: 40px; height: 50px; line-height:50px; text-align: center; font-size: 30px; top: 0; bottom: 0; z-index: 10; margin: auto; cursor: pointer; border: 1px solid #999; border-radius: 3px; color: #999; } .floor_good7 .pagination .next{ left: auto; right:0; } .floor_good7 .pagination .prev:hover,.floor_good7 .pagination .next:hover{ background: rgba(0,0,0,.1); } .floor_good7 .pagination .prev:active,.floor_good7 .pagination .next:active{ box-shadow: 0 0 10px rgba(0,0,0,.1) inset; } .floor_good7 .component_bottom .active{ display: block; opacity:0; transition: all ease .3s; } .floor_good7 .component_bottom:hover .active{ opacity: 1; } /*优势特点组件8*/ .floor_good8_main{ position: relative; } .floor_good8{ max-width: 1440px; margin: 0 auto; padding:0; box-sizing:border-box; } .floor_good8 .video_wrap{ display: flex; justify-content: center; } .floor_good8 .video_wrap,.floor_good8 .video_wrap::before{ width: 100%; height: 100%; position: absolute; left: 0; top: 0; z-index: 0; } .floor_good8 .video_wrap::before{ content:""; z-index: 1; background:linear-gradient(to right, rgba(23,9,49,.55) 0%,rgba(30,95,116,.55) 100%); } .floor_good8 .videobox{ width:100%; height:100%; object-fit:fill; } .floor_good8 .bg_img{ object-fit:fill; height:100%; min-width:100%; display: block; } .floor_good8 ul{ padding: 0 50px; overflow: hidden; position: relative; z-index: 10; } .floor_good8 li{ width: 25%; float: left; text-align: center; color: #fff; text-align: center; box-sizing: border-box; border-right:1px solid rgba(255,255,255,.2); border-bottom:1px solid rgba(255,255,255,.2); padding:50px 10px 80px; margin-bottom: -1px;} .floor_good8 .row2 li:nth-child(2n 2){ border-right:none; } .floor_good8 .row3 li:nth-child(3n 3){ border-right:none; } .floor_good8 .row4 li:nth-child(4n 4){ border-right:none; } .floor_good8 .row5 li:nth-child(5n 5){ border-right:none; } .floor_good8 .row6 li:nth-child(6n 6){ border-right:none; } .floor_good8 .wrap{ display: inline-block; text-align: left; } .floor_good8 .picture{ margin-bottom: 5px; } .floor_good8 span{ display: inline-block; vertical-align: top; } .floor_good8 span.title{ font-size: 48px; } /*==========优势特点组件 结束==========*/ /*==========服务流程组件 结束==========*/ /*服务流程组件1*/ .floor_step1{ max-width: 1440px; margin: 0 auto; } .floor_step1{ position: relative; overflow-x: auto; white-space: nowrap; z-index: 1; } .floor_step1 li{ display: inline-block; vertical-align: top; text-align: center; box-sizing: border-box; padding: 10px 0; } .floor_step1 .picture{ position: relative; } .floor_step1 .picture i{ position: absolute; left: 0; top: 0; bottom: 0; right: 5px; width: 35px; height: 35px; margin: auto; line-height: 35px; text-align: center; color: #fff; } .floor_step1 .picture img{ display: block; margin: 0 auto; } .floor_step1 .title{ margin-top: 15px; padding: 0 10px; transition-duration: .5s; } .floor_step1 .subtitle{ max-width: 260px; margin: 0 auto; padding: 0 10px; white-space: normal; line-height: 1.6em; min-height: 3.2em; overflow: hidden; transition-duration: .5s; } .floor_step1 .picture:after{ content: ''; position: absolute; height: 2px; width: 100%; top: 0; bottom: 0; left: 0; margin: auto; z-index: -1; background: transparent; } .floor_step1 li:first-child .picture:after{ border-radius: 50% 0 0 50%; } .floor_step1 li:last-child .picture:after{ border-radius: 0 50% 50% 0; } .floor_step1 li:hover .title,.floor_step1 li:hover .subtitle{ transform: translatey(-5px); } /*服务流程组件2*/ .floor_step2{ max-width: 1440px; margin: 0 auto; } .floor_step2 ul{ overflow-x: auto; white-space: nowrap; } .floor_step2 li{ position: relative; min-width: 220px; display: inline-block; float: none !important; vertical-align: top; text-align: center; box-sizing: border-box; padding: 30px 0; } .floor_step2 .picture{ position: absolute; top: 0; bottom: 0; left: 0; right: 0; height: 100%; margin: auto; z-index: -1; transition-duration: .5s; } .floor_step2 .subpicture{ position: absolute; top: 0; bottom: 0; right: 0; margin: auto; transition-duration: .5s; } .floor_step2 .title{ padding: 0 10px; } .floor_step2 .subtitle{ max-width: 260px; margin: 0 auto; padding: 0 10px; white-space: normal; line-height: 1.6em; min-height: 3.2em; overflow: hidden; } .floor_step2 li:last-child .subpicture{ display: none; } .floor_step2 li:hover .subpicture,.floor_step2 li:hover .picture{ transform: translatex(5px); } /*服务流程组件3*/ .floor_step3{ max-width: 1440px; margin: 0 auto; } .floor_step3 ul{ overflow-x: auto; white-space: nowrap; } .floor_step3 li{ min-width: 220px; display: inline-block; float: none !important; vertical-align: top; text-align: center; box-sizing: border-box; padding: 30px 10px; } .floor_step3 a{ display: inline-block; padding: 15px 30px; background: #fff; } .floor_step3 .picture,.floor_step3 i{ position: relative; display: inline-block; padding: 0 10px; font-size: 50px; vertical-align: middle; margin-right: 5px; overflow: hidden; transition-duration: .5s; } .floor_step3 i:after{ content: ""; position: absolute; right: -30px; top: 0; width: 50px; height: 150%; transform: rotate(15deg); border-left: 1px solid #ddd; background: #fff; z-index: 1; transition-duration: .5s; } .floor_step3 .wrap{ display: inline-block; vertical-align: middle; } .floor_step3 .title{ padding: 0 10px; } .floor_step3 .subtitle{ max-width: 260px; margin: 0 auto; padding: 0 10px; white-space: normal; line-height: 1.6em; min-height: 3.2em; overflow: hidden; } .floor_step3 a:hover i{ transform: scale(1.1); } .floor_step3 a:hover .picture{ transform: scale(1.1); } .floor_step3 a:hover i:after{ right: -50px; opacity: 0; } /*服务流程组件4*/ .floor_step4{ max-width: 1440px; margin: 0 auto; } .floor_step4 li{ float: none; display: inline-block; width: 25%; text-align: center; box-sizing: border-box; padding: 10px 50px; vertical-align: top; } .floor_step4 .picture{ display: inline-block; position: relative; margin-bottom: 5px; border: 1px solid red; border-radius: 50%; transition-duration: .5s; } .floor_step4 .picture i{ position: absolute; left: -2px; top: 5px; width: 35px; height: 35px; line-height: 35px; text-align: center; color: #fff; background: red; border-radius: 50%; transition-duration: .5s; } .floor_step4 .picture img{ padding: 35px; display: block; } .floor_step4 .subtitle{ max-width: 260px; margin: 0 auto; white-space: normal; line-height: 1.6em; min-height: 3.2em; overflow: hidden; } /*服务流程组件5*/ .floor_step5{ max-width: 1440px; margin: 0 auto; } .floor_step5 ul{ overflow-x: auto; white-space: nowrap; } .floor_step5 li{ position: relative; min-width: 220px; display: inline-block; float: none !important; vertical-align: top; text-align: center; box-sizing: border-box; padding: 30px 0; } .floor_step5 li a{ display: block; margin: 0 auto; display: flex; justify-content: center; align-items: center; flex-direction: column; } .floor_step5 .title{ padding: 0 10px; margin-top: 5px; } .floor_step5 .subtitle{ padding: 0 10px; } .floor_step5 .subpicture{ position: absolute; top: 0; bottom: 0; left: 0; margin: auto; transform: translatex(-50%); } /*服务流程组件6*/ .floor_step6{ max-width: 1440px; margin: 0 auto; text-align:center; } .floor_step6 .step6_main { display:inline-block; } .floor_step6 .step6 { overflow-x:auto; white-space:nowrap; } .floor_step6 .contentwrap { white-space:normal; display:inline-block; width:200px; background:#3c3e46; color:#fff; text-align:center; vertical-align:middle; } .floor_step6 .contentwrap .title { margin-bottom:10%; } .floor_step6 .contentwrap .picture { } .floor_step6 .contentwrap .subtitle { } .floor_step6 .contentwrap .telnumber { } .floor_step6 ul { display:inline-block; text-align:center; padding:0; vertical-align:middle; } .floor_step6 ul .icon { display:inline-block; vertical-align:middle; width:50px; min-height:2px; box-sizing:border-box; } .floor_step6 ul .icon img { display:block; margin:0 auto; max-width:100%; transform: translatey(-50%); } .floor_step6 ul li{ white-space:normal; display: inline-block; text-align: center; vertical-align:middle; position: relative; overflow:hidden; } .floor_step6 ul li a { display:block; } .floor_step6 ul .picture{ width:100%; border: 1px solid #fff; box-sizing:border-box;display:flex; align-items:center; justify-content:center; } .floor_step6 ul .picture i{ position:absolute; top:0; left:0; color:#0f0; width:30px; height:30px; line-height:20px !important; text-align:left !important; font-style:italic; text-align:left; padding-left:4px; } .floor_step6 ul .picture i:before { position:absolute; top:0; left:0; width:100%; height:100%; line-height:26px; color:#fff; z-index:-1; font-size:30px; transform: rotate(-90deg); font-style:normal; text-indent:0px; } .floor_step6 ul .picture img{ display:block; max-width:100%; width:50px; margin:0 auto; } .floor_step6 ul .title { width:100%; margin-top:5px; } /*服务流程组件7*/ .floor_step7{ max-width: 1440px; margin: 0 auto; text-align:center; } .floor_step7 ul { height:320px; line-height:320px; overflow:hidden; white-space:nowrap; } .floor_step7 li{ float: none; display: inline-block; text-align: center; box-sizing: border-box; vertical-align:top; line-height:normal; margin-left:-72px; position:relative; white-space:normal; } .floor_step7 li.n1 { margin-left:0 !important; } .floor_step7 li.m1 { vertical-align:bottom; } .floor_step7 li a { width:100%; height:100%; display:block; position:relative; display:flex; align-items:center; justify-content:center; } .floor_step7 li a:before { content:""; position:absolute; top:15%; left:15%; width:70%; height:70%; background:#444; z-index:-1; transform:rotate(45deg); } .floor_step7 .picture{ display: inline-block; position: relative; margin-bottom: 5px; transition-duration: .5s; } .floor_step7 .picture img{ padding:0; display: block; } .floor_step7 .subtitle{ max-width: 260px; margin: 0 auto; white-space: normal; line-height: 1.6em; min-height: 3.2em; overflow: hidden; } .floor_step7 li .wangge { position:absolute; left:50%; bottom:112%; transform:translatex(-50%); } .floor_step7 li.m0 .wangge { bottom:auto; top:112%; } .floor_step7 li .wangge img { max-width:100%; } .floor_step7 li:first-child .wangge, .floor_step7 li:last-child .wangge { display:none; } /*服务流程组件8*/ .floor_step8{ max-width: 1440px; margin: 0 auto; } .floor_step8{ position: relative; overflow-x: auto; white-space: nowrap; z-index: 1; text-align:center; } .floor_step8 li{ display: inline-block; vertical-align: top; box-sizing: border-box; margin-bottom:50px; position:relative; transition-duration: .5s; max-width:100%; white-space:normal; } .floor_step8 li:after { content:""; position:absolute; top:100%; left:50%; width:1px; height:50px; transform:translatex(-50%); transition-duration: .5s; } .floor_step8 li a { width:100%; height:100%; display:flex; align-items:center; justify-content:center; } .floor_step8 .picture{ } .floor_step8 .picture img{ display: block; margin: 0 auto 15px; } .floor_step8 .title{ padding:0; transition-duration:.5s; } .floor_step8 .subtitle{ white-space:nowrap; overflow: hidden; transition-duration: .5s; } .floor_step8 .description { border-top:1px solid #888; padding:20px 0 0; display:none; transition-duration: .5s; } .floor_step8 .description.on { display:block; } /*服务流程组件9*/ .floor_step9{ max-width: 1440px; margin: 0 auto; } .floor_step9{ position: relative; overflow-x: auto; white-space: nowrap; z-index: 1; text-align:center; } .floor_step9 li{ display: inline-block; vertical-align: top; box-sizing: border-box; position:relative; transition-duration: .5s; max-width:100%; white-space:normal; } .floor_step9 li.m0 { } .floor_step9 li a { width:100%; height:100%; display:flex; align-items:center; justify-content:center; } .floor_step9 li .yd_icon { position:relative; } .floor_step9 li.m0 .yd_icon:after { content:""; position:absolute; left:50%; top:10%; width:100%; height:1px; transform:rotate(-15deg); } .floor_step9 li.m1 .yd_icon:after { content:""; position:absolute; left:50%; top:98%; width:100%; height:1px; transform:rotate(15deg); } .floor_step9 li:last-child .yd_icon:after { display:none; } .floor_step9 .picture{ position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); } .floor_step9 .picture img{ display: block; width:100%; height:100%; } .floor_step9 li .yd_icon.ydicon-shape2 .picture { transform:translate(-50%,-10%); } .floor_step9 .title{ padding:0; transition-duration:.5s; margin-top:10px; } .floor_step9 .subtitle{ white-space:nowrap; overflow: hidden; transition-duration: .5s; } .floor_step9 .description { border-top:1px solid #888; padding:20px 0 0; display:none; transition-duration: .5s; } .floor_step9 .description.on { display:block; } /*服务流程组件10*/ .floor_step10{ max-width: 1440px; margin: 0 auto;} .floor_step10 ul{ padding: 0; margin-top: 20px; display:flex; } .floor_step10 li{ float: none; display: inline-block; width: 25%; text-align: center; box-sizing: border-box; padding:10px 0 25px; vertical-align: top; border: 1px solid #ddd; border-right: none; margin: 0; transition:all ease .5s; } .floor_step10 li:last-child{ border-right: 1px solid #ddd; } .floor_step10 li .num{ width: 52px; height: 52px; display:flex;align-items: center;justify-content: center; background: #21abd7; position: absolute; top: -23px; left: 50%; transform: translatex(-50%); border-radius: 50%; font-size: 24px; color: #fff; font-style: oblique; text-align: center; z-index:5; transition: all ease .5s; } .floor_step10 li .num::before{ content:""; opacity:0.2; position:absolute; z-index:-1; border-radius:50%; transform-origin:center center; -webkit-transform-origin:center center; transform: scale(1.25,1.25); -webkit-transform: scale(1.25,1.25); transition: all ease .5s;} .floor_step10 li .num::after{ content:""; opacity:0.1; position:absolute;z-index:-1; border-radius:50%; transform-origin:center center; -webkit-transform-origin:center center; transform: scale(1.5,1.5); -webkit-transform: scale(1.5,1.5); transition: all ease .5s; } .floor_step10 .picture{ display: inline-block; position: relative; z-index: -1; margin-bottom: 5px; transition-duration: .5s; } .floor_step10 .picture img{ padding:20px; display: block; } .floor_step10 .subtitle{ padding:10px 15px; margin: 0 auto; white-space: normal; line-height: 1.6em; height: 3.3em; overflow: hidden; display: none; } .floor_step10 li.on{ flex: 1; } .floor_step10 li.on .title{ transition:all ease .5s; } .floor_step10 li.on .subtitle{ display: block; animation: fadeinup .5s ease-out; } /*服务流程组件11*/ .floor_step11{ max-width: 1440px; padding:0 40px; margin: 0 auto; box-sizing: border-box; } .floor_step11{ position: relative; overflow-x: auto; white-space: nowrap; z-index: 1; } .floor_step11 li{ display: inline-block; vertical-align: top; box-sizing: border-box; padding: 10px 0; overflow: hidden; } .floor_step11 .circle{ display: inline-block; border: 2px solid transparent; width: 4em; height: 4em; box-sizing: content-box; position: relative; border-radius: 50%; } .floor_step11 .circle:after{ content: ''; position: absolute; height: 2px; width:100000%; top: 0; bottom: 0; left: 0; margin: auto; z-index: -1; background: transparent; } .floor_step11 li .num{ padding-bottom:12px; font-family: georgia; letter-spacing:2px;} .floor_step11 li .num span{ font-size: 0.5em; font-weight: normal; font-family:"microsoft yahei"; } .floor_step11 .title{ margin-top: 15px; padding-right: 12px; transition-duration: .5s; } .floor_step11 .subtitle{ padding-right: 12px; white-space: normal; line-height: 1.6em; min-height: 3.2em; overflow: hidden; transition-duration: .5s; } .floor_step11 li:hover .title,.floor_step11 li:hover .subtitle{ transform: translatey(-5px); } /*==========服务流程组件 结束==========*/ /*==========功能对比组件 开始==========*/ .floor_vs1{ max-width: 1200px; margin: 0 auto; } .floor_vs1 .component_title{ text-align: center; font-size: 0; margin-bottom: 15px; } .floor_vs1 .component_title div{ display: inline-block; box-sizing: border-box; width: 50%; padding: 0 50px; } .floor_vs1 .component_title .qthemetitle{ text-align: right; } .floor_vs1 .component_title .ythemetitle{ text-align: left; } .floor_vs1 li{ position: relative; overflow: hidden; padding: 15px 0; } .floor_vs1 .vstitle{ position: absolute; width: 54px; height: 54px; line-height: 54px; text-align: center; color: #fff; background-color: #000; left: 0; right: 0; top: 0; bottom: 0; margin: auto; border-radius: 50%; } .floor_vs1 .float_left,.floor_vs1 .float_right{ width: 50%; box-sizing: border-box; padding: 10px; } .floor_vs1 .float_left{ text-align: right; padding-right: 50px; border-radius: 50px 0 0 50px; } .floor_vs1 .float_right{ text-align: left; padding-left: 50px; border-radius: 0 50px 50px 0; } /*==========功能对比组件 结束==========*/ /*==========布局组件 开始==========*/ .component .layout{ position: relative; } /*布局组件 layout1 多列*/ .floor_layout1{ max-width: 1440px; margin: 0 auto; } .floor_layout1:after{ content: ''; display: block; clear: both; } .floor_layout1>.layout{ display: none; box-sizing: border-box; overflow: hidden; min-height: 70px; } .floor_layout1.mode2>.layout1{ float: left; display: block; } .floor_layout1.mode2>.layout2{ display: block; width: auto !important; } .floor_layout1.mode2>.layout3, .floor_layout1.mode2>.layout4{ display: none; } .floor_layout1.mode3>.layout{ float: left; display: block; } .floor_layout1.mode3>.layout3 { float:none; width: auto !important; } .floor_layout1.mode3>.layout4{ display: none; } .floor_layout1.mode4>.layout{ float: left; display: block; } .floor_layout1.mode4>.layout4 { float:none; width: auto !important; } /*布局组件 layout2 多行*/ .floor_layout2{ max-width: 1440px; margin: 0 auto; } .floor_layout2:after{ content: ''; display: block; clear: both; } .floor_layout2>.layout{ display: none; box-sizing: border-box; } .floor_layout2.mode2>.layout{ display: block; } .floor_layout2.mode2>.layout3, .floor_layout2.mode2>.layout4, .floor_layout2.mode2>.layout5{ display: none; } .floor_layout2.mode3>.layout{ display: block; } .floor_layout2.mode3>.layout4, .floor_layout2.mode3>.layout5{ display: none; } .floor_layout2.mode4>.layout{ display: block; } .floor_layout2.mode4>.layout5{ display: none; } .floor_layout2.mode5>.layout{ display: block; } /*布局组件 layout3 一大两小*/ .floor_layout3{ max-width: 1440px; margin: 0 auto; } .floor_layout3:after{ content: ''; display: block; clear: both; } .floor_layout3>.layout{ overflow: hidden; } .floor_layout3>.layout1{ min-height: 100px; } .floor_layout3>.layout2, .floor_layout3>.layout3{ min-height: 50px; } /*布局组件 自定义*/ .floor_layout4{ max-width: 1440px; margin: 0 auto; } /*==========布局组件 结束==========*/ /*==========子组件 开始==========*/ /*子组件1*/ .floor_child1_main{ text-align: center; } .floor_child1{ display: inline-block; } /*子组件2*/ .floor_child2_main{ overflow: visible; } .floor_child2{ text-align: center; font-size: 0; } .floor_child2 img{ max-width: 100%; } /*子组件3*/ .floor_child3_main .infowrap{ overflow: hidden; padding: 0 10px; } .floor_child3{ display: inline-block; } /*子组件5*/ .floor_child5_main{ overflow: visible; z-index: 1; } .floor_child5_main ul{ font-size: 0; text-align: center; } .floor_child5_main li{ position: relative; display: inline-block; vertical-align: middle; } .floor_child5_main li:first-child{ margin-left: 0 !important; } .floor_child5_main li:last-child{ margin-right: 0 !important; } .floor_child5_main li .subpicture{ display: none; position: absolute; top: 130%; left: 50%; transform: translatex(-50%); box-shadow: 0 0 10px rgba(0,0,0,.1); padding: 5px; background-color: #fff; border-radius: 3px; } .floor_child5_main li .subpicture:after{ content: ''; position: absolute; top: -9px; left: 0; right: 0; width: 0; margin: auto; border-bottom: 9px solid #f8fafe; border-left: 9px solid transparent; border-right: 9px solid transparent; } .floor_child5_main li:hover .subpicture{ display: block; } .floor_child5_main li .picture{ vertical-align: middle; transition-duration: .2s; } .floor_child5_main li .title{ font-size: 14px; } .floor_child5_main li .title.align0{ display: none; } .floor_child5_main li .title.align2{ display: inline-block; vertical-align: middle; margin-left: 5px; } /*子组件6*/ .floor_child6_main ul{ font-size: 0; text-align: center; } .floor_child6_main li{ display: inline-block; overflow: hidden; padding: 5px 10px; box-sizing: border-box; max-width:100%; } .floor_child6_main li a{ display: inline-block; } .floor_child6_main .infowrap{ overflow: hidden; padding: 0 10px; } /*==========子组件 结束==========*/ /*==========频道内页 开始==========*/ .content_title h2 { font-size:32px; } /*频道内页公共*/ .floor_channel{ padding: 0 10px; } .floor_channel>.component_title{ overflow: hidden; width: 260px; min-height: 100px; } .floor_channel>.component_title.float_left{ margin-right: 20px; } .floor_channel>.component_title.float_right{ margin-left: 20px; } .floor_channel>.component_title.float_0{ display: none; } .floor_channel>.component_body{ overflow: hidden; padding: 20px; border-radius: 4px; } .floor_channel>.component_body>.content_title h2{ margin-bottom: 20px; } /*子导航栏 频道内页组件1*/ .floor_channel1_main{ border-bottom: 1px solid #ddd; overflow: visible; } .floor_channel1{ margin:0 auto; } .floor_channel1 ul { text-align:center; font-size: 0; } .floor_channel1 ul li { display:inline-block; position: relative; } .floor_channel1 ul li a i { display:inline-block; font-size:12px; } .floor_channel1 ul li.n1{ border:0;} .floor_channel1 ul li a.depth2 { display: block; color:#333; font-size:16px; } .floor_channel1 ul li a.depth2:hover { color:#04a07b;text-decoration:none; } .floor_channel1 ul li .icon-more{ background: no-repeat center; padding: 4px 8px; } .floor_channel1 ul #current a.depth2 { color:#04a07b; } .floor_channel1 ul .depth3list{ display: none; position: absolute; left: 0; background: #fff; z-index: 99; box-shadow: 0 0 10px 0 rgba(0,0,0,.1); } .floor_channel1 ul .depth3list a.depth3{ display: block; width: 120px; text-align: left; font-size: 14px; } .floor_channel1 ul .depth3list a.depth3:hover{ color: #fff; } .floor_channel1 ul li:hover .depth3list{ display: block; } /*子导航栏 2*/ .floor_channel2_main{ text-align: center; } .floor_channel2 ul{ display: inline-block; text-align: left; } .floor_channel2.full-width1 ul{ display: block; } .floor_channel2 ul li{ position: relative; } .floor_channel2 i.show_child_btn{ position: absolute; width: 26px; text-align: center !important; font-weight: bold !important; font-size: 14px; top: 0; padding-left: 0 !important; padding-right: 0 !important; right: 2%; z-index: 1; cursor: pointer; } .floor_channel2 i.show_child_btn.on{ transform: rotate(180deg); } .floor_channel2 i.show_child_btn:hover{ opacity: .75; } .floor_channel2 a.depth2{ display: block; } .floor_channel2 .depth3list{ display: none; } .floor_channel2 a.depth3{ display: block; } /*内页组件12*/ .floor_channel16{ padding: 0 10px; } .floor_channel16 .guestbooklist li{ padding: 10px; } .floor_channel16 .guestbooklist .answer_wrap{ position: relative; } .floor_channel16 .guestbooklist .icon{ position: absolute; top: 0; margin-top: -16px; font-size: 22px; z-index: -1; left: 30px; } .floor_channel16 .answer_wrap{ margin: 10px; padding: 10px; display: inline-block; } /*内页组件17*/ .floor_channel17{ padding:0; } /* 内页组件18 */ .floor_channel18{} /*==========频道内页 结束==========*/ /*==========详情页组件 开始==========*/ /*详情页组件公共*/ .floor_detail{ padding: 0 10px; } .floor_detail>.component_title{ overflow: hidden; width: 260px; min-height: 100px; } .floor_detail>.component_title.float_left{ margin-right: 20px; } .floor_detail>.component_title.float_right{ margin-left: 20px; } .floor_detail>.component_title.float_0{ display: none; } .floor_detail>.component_body{ overflow: hidden; padding: 20px; border-radius: 4px; } /*详情页组件2*/ .floor_detail2 .info_product_detail_wrap{ max-width:1440px; margin:0 auto; padding: 0 15px; line-height: 2.2em; overflow: hidden; } .floor_detail2 .info_product_detail_wrap b{ font-weight:bold;} .floor_detail2 .product_swiper{ position: relative; float: left; max-width: 700px; box-sizing: border-box; padding: 50px 100px; } .floor_detail2 .product_swiper .infoswiper{ height: 330px; } .floor_detail2 .product_swiper .infoswiper img{ display: block; width: 100%; } .floor_detail2 .product_swiper .swiper-prev{ position: absolute; width: 50px; height: 50px; line-height: 50px; text-align: center; font-size: 40px; color: #999; border-radius: 3px; left: 0; top: 0; bottom: 0; margin: auto; cursor: pointer; background: #f4f5f9; padding: 15px 0; } .floor_detail2 .product_swiper .swiper-prev:hover{ opacity: .8; } .floor_detail2 .product_swiper .swiper-prev img{ width: 100%; display: block; } .floor_detail2 .product_swiper .swiper-next{ position: absolute; width: 50px; height: 50px; line-height: 50px; text-align: center; font-size: 40px; color: #999; border-radius: 3px; right: 0; top: 0; bottom: 0; margin: auto; cursor: pointer; background: #f4f5f9; padding: 15px 0; } .floor_detail2 .product_swiper .swiper-next:hover{ opacity: .8; } .floor_detail2 .product_swiper .product_thumbnail{ text-align: center; } .floor_detail2 .product_swiper .product_thumbnail img{ width: 100px; margin: 20px 5px 0; padding: 2px; cursor: pointer; } .floor_detail2 .product_swiper .product_thumbnail img.on{ background: #04a07b; } .floor_detail2 .detail_table{ overflow: hidden; padding: 50px 0; min-width: 300px; } .floor_detail2 .detail_table .infotitle{ font-size:16px; font-weight:bold; text-align:left; padding-bottom: 10px; } .floor_detail2 .detail_table .infoscontent{ margin-bottom: 8px; } .floor_detail2 .detail_table .marketprice{ font-size: .8em; text-decoration: line-through; color: #888; } .floor_detail2 .detail_table .discountprice{ font-size: 16px; color: #f44336; font-weight: bold; } .floor_detail2 .infocontent_main{ padding-top: 40px; } .floor_detail2 .infocontent_main:before{ content: ""; display: block; width: 140%; margin-left: -20%; height: 20px; background: #ddd; opacity: .5; } .floor_detail2 .productdescription{ position: relative; max-width:1440px; margin: 15px auto; overflow: hidden; padding: 0 15px; color: #04a07b; } .floor_detail2 .productdescription:after{ content: ''; position: absolute; bottom: 0; left: 15px; right: 15px; height: 1px; background: #eee; } .floor_detail2 .productdescription span{ float: left; border-bottom: 3px solid #04a07b; padding: 0 10px 10px; cursor: pointer; font-weight:bold; } .floor_detail2 .productdescription span:active{ opacity: .8; } .floor_detail2 .infocontent{ max-width:1440px; margin:0 auto; padding: 0 15px; line-height: 1.8em; text-align: justify; } /*详情页组件6 相关信息*/ /*文章扩展组件0*/ .floor_detail6{ max-width: 1440px; margin: 0 auto; } .detail6{ } .detail6:after{ content: ''; display: block; clear: both; } .detail6 a{ display: block; overflow: hidden; } .text-detail6{} .text-detail6 li{ width: 100% !important; } .text-detail6 a{ overflow: hidden; padding: 0; } .text-detail6 a .infotitle{ float: left; font-size: 16px; } .text-detail6 a .titleicon{ vertical-align: middle; } .text-detail6 a .infotime{ float: right; } .text-detail6 .infopicture,.text-detail6 .infoscontent{ display: none; } .thumb-detail6{} .thumb-detail6 a{ position: relative; padding: 15px; margin: 8px; transition-duration: .5s; } .thumb-detail6 .infopicture{ float: left; width: 35%; max-width: 170px; margin-right: 5%; } .thumb-detail6 .infowrap{ overflow: hidden; } .thumb-detail6 .infotitle{ font-size: 18px; font-weight: bold; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .thumb-detail6.has-infoscontent0 .infotitle{ white-space: normal; } .thumb-detail6 .infoscontent{ margin: 10px 0; overflow: hidden; color: #666; max-height: 3.2em; line-height: 1.6em; } .thumb-detail6 .infotime{ font-size: 24px; overflow: hidden; } .thumb-detail6 li a:hover{ transform: translatey(-5px); box-shadow: 0 8px 35px rgba(0, 0, 0, .08); } .thumbright-detail6{} .thumbright-detail6 a{ position: relative; padding: 15px; margin: 8px; transition-duration: .5s; } .thumbright-detail6 .infopicture{ float: right; width: 35%; max-width: 170px; margin-right: 5%; } .thumbright-detail6 .infowrap{ overflow: hidden; } .thumbright-detail6 .infotitle{ font-size: 18px; font-weight: bold; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .thumbright-detail6 .infoscontent{ margin: 10px 0; overflow: hidden; color: #666; max-height: 3.2em; line-height: 1.6em; } .thumbright-detail6 .infotime{ font-size: 24px; overflow: hidden; } .thumbright-detail6 li:hover{ box-shadow: 0 8px 35px rgba(0, 0, 0, .08); } .thumbright-detail6 li a:hover{ transform: translatex(15px); } .grid-detail6 li{ width: 25%; float: left; } .grid-detail6 li a{ margin: 0 10px 20px; } .grid-detail6 li .infopicture{ overflow: hidden; } .grid-detail6 li img{ transition-duration: .5s; } .grid-detail6 li .infotitle{ font-size: 16px; text-align: left; color: #333; margin: 15px 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; transition-duration: .5s; } .grid-detail6 li .infoscontent{ font-size: 13px; margin: 15px 0; color: #999; height: 3.6em; line-height: 1.8em; overflow: hidden; } .grid-detail6 li .infoprice{ margin: 15px 0; } .grid-detail6 li .infotime{ position: relative; font-size: 18px; color: #888; font-weight: bold; margin: 15px 0; padding-top: 15px; border-top: 1px solid #ddd; transition-duration: .5s; } .grid-detail6 li .infotime:after{ content: ""; position: absolute; left: 0; width: 0px; top: -1px; height: 1px; transition-duration: .5s; transform-origin: 0 0; } .grid-detail6 li:hover .infotime:after{ width: 100%; } .grid-detail6 li:hover img{ transform: scale(1.1); } .detail6 li.listyle2 a { background:#fff; } .detail6 li.listyle2 a .infowrap { padding:0 10px; } /*==========详情页组件 结束==========*/ /*==========表单组件 开始==========*/ .floor_form{ overflow: hidden; padding: 20px; box-sizing: border-box; } .floor_form input, .floor_form textarea{ background: transparent; border: 0; padding: 10px; } .floor_form input[type="radio"], .floor_form input[type="checkbox"] { margin:15px 4px !important; } .floor_form .submit_button { max-width:100%; } /*==========表单组件 结束==========*/ /*==========@@媒体查询 开始@@==========*/ @media screen and (max-width: 1600px) { } @media screen and (max-width: 1450px) { } /*笔记本电脑*/ @media screen and (max-width: 1366px) { } @media screen and (max-width: 990px) { } /*平板及手机*/ @media screen and (max-width: 1199px) { /*列表列数（每行个数）*/ .column1{ width: 100% !important; float: left; } .column2{ width: 50% !important; float: left; } .column3{ width: 50% !important; float: left; } .column4{ width: 50% !important; float: left; } .column5{ width: 50% !important; float: left; } .column6{ width: 50% !important; float: left; } .column7{ width: 50% !important; float: left; } .column8{ width: 50% !important; float: left; } .column9{ width: 50% !important; float: left; } .column10{ width: 50% !important; float: left; } /*左右滑动列宽*/ .component .col2{ width: 500px; } .component .col3{ width: 320px; } .component .col4{ width: 280px; } .component .col5{ width: 240px; } .component .col6{ width: 200px; } .floor_layout1>.layout, .floor_layout3>.layout{ float: none !important; width: auto !important; } .component_title>h2{ font-size:28px; } .component_title>p{ font-size:16px; margin:10px 0; padding:0; } /*==========头部组件 开始==========*/ body .floor_head0_main,body .floor_head1_main,body .floor_head2_main,body .floor_head3_main{ display: none !important; } .banner0 li a{ width: 100%; } .banner0 li .bannertext{ transform: scale(.6); width: 150%; margin-left: -25%; } /*==========头部组件 结束==========*/ /*==========幻灯片组件 开始==========*/ .bannerbox{height: auto;} .bannerbox .videobox{width: 100%; height: auto;} .bannerbox .bannertext{top: 30%;} .bannerbox .bannertext .detail{max-width: 100%;} .bannerbox .swiper-slide .lbt-bg{background-size: auto;} .detail li{width: 140px;} .detail .bannerbtn{font-size: 14px;} .videobannertext{display: none;} .bannerbox .bannertext .bannername{font-size: 28px; font-weight: normal;} .bannerbox .bannertext .bannerdescription{font-size: 18px;} /*==========幻灯片组件 结束==========*/ /*==========单页组件 开始==========*/ .floor_page0 .channelwrap { margin: 0; } .floor_page0 .channelwrap .channelscontent { padding:0 !important; font-size:24px; } .floor_page0 .channelwrap .channelcontent { padding:10px 15px; } .floor_page0 .channelwrap .channelcontent p { height:12em; line-height:2.4em; } .page1 .channelname{ padding-top: 70px; } .page1 .channelwrap{ height: 500px; } .page1 .channelscontent{ padding: 10px !important; } .page1 .bgpicture{ height: 500px; } .floor_page2 { margin:0 10px; padding:20px 15px; } .page2{ display: flex; flex-direction: column; } .page2 a { margin:30px auto 0; display:block; width:120px; text-align:center !important; padding:0; line-height:36px; order: 4; } .page2 .channelname { margin-bottom:0px; } .page2 .channelscontent { padding: 10px 0; } .page2 .tpagepicture { float:none; width:100%; margin:0 auto 10px; order: 1; } .page2 .albumlist { margin-top:0px; order: 3; } .page2 .albumlist li { text-align:center; margin-top:12px; } .page2 .albumlist li .albumtitle { font-size:32px; } .floor_page3 { margin:0 10px; padding:10px; } .page3 { position: relative; display: flex; flex-direction: column; padding-bottom:56px; } .page3.thumbleft-page3 { flex-direction:column-reverse; } .page3 a { padding:0; position:absolute; left:0; right: 0; bottom:10px; margin:auto; width: 120px; font-size:14px !important; height:36px !important; line-height:36px !important; text-align: center; display:inline-block; } .page3 .tpagepicture{ width: 100%; margin:0 auto; } .page3 .channelwrap { padding-top:0; } .page3 .channelname { font-size:24px; } .page3 .channelscontent { padding:0 !important; } .page3 .channelcontent { margin:10px 0; line-height:1.6em !important; } .thumbright-page3 .tpagepicture { float:none !important; margin:0 !important; max-width:100%; order: 1; } .floor_page4 { margin:0 10px; padding:0; } .page4 { padding:0; } .page4 .tpagepicture { float:none !important; width:100%; margin:10px 0; } .page4 .albumlist { margin-top:5px; } .page4 .albumlist li { padding:10px 0; display:flex; align-items:center; } .page4 .albumlist li .albumtitle { font-size:18px; } .page4 .albumlist li .albumpicture { width:64px; height:64px; line-height:64px; min-width:64px; min-height:64px; margin-right:10px; } .thumbleft-page4 .albumlist { width:100%; } .page5{ padding-top: 25px; } .floor_page5{ padding: 10px; } .page5 .albumlist li{ padding: 15px; } .floor_page6 { margin:0 10px; padding:0; } .page6 { padding:0; } .page6 .tcentertext { display:none; } .page6 .albumlist li { display:inline-block; float:none; width:49% !important; text-align:left !important; vertical-align:top; } .page6 .albumlist li.m0 { float:none; } .page6 .albumlist li { margin:10px 0; padding:0; } .page6 .albumlist li .albumpicture { font-size:36px; width:100%; margin:0 0 8px !important; } .page6 .albumlist li .albumtitle { font-size:16px; margin-bottom:8px; } .page6 .albumlist li i { display:none; } .floor_page7 { margin:0 0; padding:0 5px; } .page7 { padding:0; } .page7 .albumlist { padding:60px 0 10px; overflow-x:auto; white-space:nowrap; } .page7 .albumlist li { float:none; display:inline-block; width:200px; margin:0 10px; white-space:normal; vertical-align:top; } .page7 .albumlist li i { margin:10px auto; } .page7 .albumlist li .albumpicture img { max-width:50%; } .floor_page8 { margin:0 10px; } .page8 .prevnext { top: 30px; width:28px; height:28px; line-height:28px; } .page8 .prevnext.prev { right:auto; right:50px; margin-right:0; } .page8 .prevnext.next { left:auto; right:10px; margin-left:0; } .page8 .channelwrap { position:inherit; width:100%; height:auto; left:auto; right:auto; margin-top:1em; overflow:hidden; text-align:left; } .page8 .channelwrap h2 { font-size:24px; line-height:1.5em; } .page8 .channelwrap .channelname { font-size:20px; line-height:1.5em; } .page8 .channelwrap .channelcontent { font-size:14px; line-height:2em; height:12em; text-overflow:-o-ellipsis-lastline; overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-line-clamp:6; line-clamp:6; -webkit-box-orient:vertical; } .floor_page9 { margin:0 10px; padding:0; } .page9 { float:none; width:100%; height:auto; margin:0; padding: 10px; } .page9 span { width:80px; height:2px; margin:10px 0; } .page9 .channelname a { font-size:24px; } .page9 .channelscontent { line-height:40px; font-size:18px; padding:0 !important; } .floor_page10 { margin:0 10px; } .page10 { padding:0; } .page10 .tpagepicture { display:none; } .page10 .albumlist { padding:0; } .page10 .albumlist li { margin: 20px 0; } .page10 .albumlist li span.albumtitle { font-size:36px; } .floor_page11{ padding: 10px; } .page11_albumlist li .albumtitle{ padding: 10px 0; } .floor_page12 { margin:0 10px; padding:0; } .page12_left { float:none; width:100%; } .page12_left h4 { font-size:24px; line-height:50px; } .page12_left p { margin:0; font-size:14px; padding:10px 0; } .page12_right { float:none; width:100%; text-align:left; } .page12_right img { width:110px; margin-left:10px; } .page12_right h4 { font-size:20px; line-height:40px; margin-top:15px; } .page12_right h4 span { font-size:28px; } .page12_more { margin-top:10px; height:32px; line-height:32px; width:100px; font-size:14px; } .floor_page13 { margin:0 0px; padding:0 5px; } .page13_albumlist { padding:0; overflow-x:auto; white-space:nowrap; } .page13_albumlist li { float:none; display:inline-block; width:240px; margin:0 5px; white-space:normal; vertical-align:top; } .page13_albumlist li .albumwrap { margin:0 !important; width:100% !important; padding:30px 0 20px; } .page13_albumlist li .albumpicture { width:100px; height:100px; } .page13_albumlist li .albumpicture img { max-width:90%; padding:10px 0 0; } .page13_albumlist li .albumdescription { margin:0 5%; } .inoutside-page13 .page13_albumlist li { margin-top:60px; } .inoutside-page13 .page13_albumlist li .albumtitle { font-size:18px; margin:20px 15px 12px; } .floor_page14 { margin:0; padding:0; } .page14 { padding:15px 0; } .page14_albumlist li { margin:0px 50px 0px 0; } .page14_albumlist li.m1 { margin:0px 0 0px 50px; } .page14_albumlist li .albumwrap { padding:0 10px 0 0; } .page14_albumlist li.m1 .albumwrap { padding:0 0 0 10px; } .page14_albumlist li .albumtitle { float:none; margin:0; font-size:14px; width:auto; text-align:right; padding:0; } .page14_albumlist li.m1 .albumtitle { float:none; width:auto; margin:0; text-align:left; padding:0; } .page14_albumlist li .albumpicture { font-size:16px; } .page14_albumlist li .point_back { width:20px; height:20px; right:-10px; top:2px; } .page14_albumlist li .point_small { width:12px; height:12px; top:4px; left:4px; } .page14_albumlist li.m1 .point_back { left:-10px; } .page14_albumlist li .albumdescription { font-size:13px; } .page15_tabbar{ padding: 0; } .page15_tabbar li .channelname{ font-size: 16px; } .page15_channellist .channelname{ margin-top: 15px; } .page15_channellist .float_left{ padding: 0 10px; width: auto; } .page15_channellist .float_right{ display: none; } .floor_page16_main .component_title{ padding: 0 10px; } .page16_albumlist li{ padding: 0 15px; } .page16_albumlist .albumtitle{ margin-top: 10px; } .page16_albumlist .albumpicture{ display: block; margin-bottom: 10px; text-align: center; margin-right: 0; } .page16_albumlist .albumwrap{ max-width: 100%; } .page17 { margin:0 5%; overflow-x:auto; } .floor_page17.yes-page17 { padding: 30px 0; } .page17, .page17.rl-page17 { writing-mode:horizontal-tb; } .page17.yes-page17 { box-shadow: 0 0 20px #ccc; } .page17.yes-page17 .page17_floor { box-shadow:none; } .page17 .small_img { display:block; } .page17 .channelwrap .big_img { display:none; } .page17 .tpagebtn .btn { font-size:18px; } .floor_page20 .component_title{ width:60% !important; min-width:60%; } .floor_page20 .component_body{ max-width:40%; } .floor_page20 .tpagepicture{ overflow: hidden; } .floor_page20 .tpagepicture img{ height: 100%; object-fit: cover; width:auto; } .floor_page20 .content_top{ padding-bottom: 20px; padding-right: 10px; } .floor_page20 .countlist li{ min-width: 33.333%; box-sizing: border-box;} .floor_page20 .countlist li i{ font-size:26px !important; } .floor_page20 li .description{ font-size: 16px !important; } /*==========单页组件 结束==========*/ /*==========文章组件 开始==========*/ .grid-article0 li a { margin:10px 5px 0 !important; } .thumb-article0 .infowrap{ padding:0; } .thumb-article0 li{ width: 100% !important; } .thumb-article0 a{ padding: 0; margin:5px 10px !important; } .thumb-article0 .infotitle{ white-space: normal; font-size:14px; line-height:1.6em !important; font-weight: normal; } .thumb-article0 .infoscontent { display:none; } .thumb-article0 .infotime { line-height:2em !important; } .thumbright-article0 .infowrap{ padding: 10px; } .thumbright-article0 li{ width: 100% !important; } .thumbright-article0 a{ padding: 0; } .thumbright-article0 .infotitle{ white-space: normal; font-size: 16px; font-weight: normal; } .thumbright-article0 .infoscontent { display:none; } .grid-article0 li .infoscontent { display:none; } .floor_article1{ padding: 0; } .article1 .infowrap{ padding: 15px; height: 130px; } .article1 .infotime span{ display: none; } .article1 .infotitle{ margin-top: 5px; white-space: normal; } .article1 .infoscontent{ display: none; } .article1 .infopicture{ height: auto; } .article2 li{ width: 100% !important; } .article2 a{ padding: 5px 10px; } .article2 .infowrap .infoscontent{ height: 3.1em; } .article2 .infowrap .infotitle{ font-size: 16px; } .floor_article3{ margin: 0; } .floor_article3 .pagination{ display: none; } .article3 li{ max-width: 300px; } .floor_article4{ padding: 0; } .article4{ margin: 0 10px; } .article4_1{ width: 100% !important; float: none !important; } .article4_1.float_right{ margin: 0; } .article4_1 .infopicture{ height: auto; } .article4_2{ padding-top: 10px; } .article4_2 .infotitle{ white-space: pre-wrap; line-height: } .article5 li{ width: 100% !important; } .article5 .infotitle{ font-size: 15px; font-weight: bold; } .floor_article6{ padding: 0; } .article6 .pagination{display: none;} .floor_article6 .swiper-slide-active .infowrap{ visibility: visible; opacity: 1; transform: scale(1); } .article7{ padding: 5px; } .article7 li{ float:left; width: 100% !important; } .article7 li a{ margin: 5px; } .article7 li.n1, .article7 li.n2{ width: 50% !important; } .article7.big_type1 li.n2{ width: 100% !important; } .article7 li .infotitle{ font-size: 16px; } .article7 li .infopicture img, .article7 li .superinfotime{ height: auto !important; } .floor_article8{ margin:0; padding:0; } .article8{ padding: 0; } .article8 li{ width: 100% !important; } .article8 a{ margin: 5px 0; } .article8 .infotitle{ font-size: 16px; white-space: normal; } .article8 .infoscontent{ text-align: justify; } .floor_article9{ margin:0; padding: 0 10px; } .floor_article9 .pagination span{ display: none; } .article9 .infoscontent{ height: 5.4em; overflow: hidden; } .article9 .infowrap{ padding: 5px 10px; } .article9 .infotime{ margin: 0; font-size: 12px; } .article9 .infotitle{ font-size: 15px; margin: 5px 0; white-space: normal; } .floor_article10{ overflow-x: auto; white-space: nowrap; } .floor_article10 .component_title{ margin-bottom: 0; } .floor_article10 .component_title .channelicon{ max-width: 80px; } .floor_article10 .component_title h2 span{ line-height: 1em !important; } .article10{ min-width: 500px; display: inline-block; float: none !important; } .article10 ul{ padding: 0; } .article10 a{ display: flex; align-items: center; justify-content: space-between; } .article10 ul.first-detail1 li.n1 a{ display: block; } .article10 .infotitle{ text-indent: 0 !important; max-width: 100%; font-size: 14px; } .article10 .infotime{ display: none; } .article10 ul.first-detail1 li.n1 .infotime{ display: block; } .article10 .infoscontent{ white-space: pre-wrap; } .article10 ul.first-detail1 li.n1 .infotitle{ padding: 5px 0; overflow: initial; text-overflow: initial; white-space: normal; font-size: 16px; } .article10 ul.first-detail1 li.n1 .infoscontent{ line-height: 1.6em; height: 3.2em; overflow: hidden; display: none; } .article11 a{ padding: 10px; } .article11 .infopicture{ width: 260px; height: 180px; } .article11 .infoscontent{ height: 3.6em; padding-top: 8px; margin-top: 8px; } .article11 .viewmore{ display: none; } .article11 .infotitle{ font-size: 15px; white-space: normal; } .article11 .infotime{ width: 70px; } .article11 .infotime:after{ width: 36px; left: 0; top: 26px; } .article11 .infotime span.d{ font-size: 18px; } .article11 .infotime span.ym{ font-size: 12px; } .article12{ padding: 5px; } .article12 li{ width: 50%; } .article12 a{ margin: 5px; padding: 10px; } .article12 li .infotitle{ font-size: 15px; white-space: normal; line-height: 1.35555em; height: 1.355555em; overflow: hidden; } .article12 li .infotime{ font-size: 12px; } .article12 li .infotime:after{ margin: 5px 0 10px; } .article12 li.n1 .infopicture{ width: 40%; margin-right: 10px; } .article12 li.n1 .infotime{ margin-top: 3px; } .article12 li.n1 .viewmore{ display: none; } .article12 .viewmore{ color: #999; margin-top: 10px; } .floor_article14{ white-space: nowrap; overflow-x: auto; } .article14{ display: inline-block; padding: 0px !important; margin:0 5px; min-width: 340px; float: none !important; } .article14 .wrap{ padding:10px !important; } .article14 li.first-detail3 .infotime{ width: 30%; padding-right: 5px; text-align: right; box-sizing: border-box; } .article14 a { padding: 8px 0; } .floor_article16 .float_left{ float: none; margin: 0 10px 15px; } .floor_article16 .component_body{ padding: 0 10px; } .floor_article16 .infopicture{ margin-right: 10px; width: 120px !important; } .floor_article16 .infotitle{ white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .floor_article16 .infoscontent{ overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; } .article17 li a { margin:10px 5px 5px; } .article17 li .infotitle{ margin: 10px 0; } .article17 li .infoscontent{ margin: 10px 0; } .article17 li .infotime{ margin: 10px 0; padding-top: 10px; } .article17 li .superinfotime { height:auto !important; padding:10px 0; } .floor_article18 .channel1, .floor_article18 .channel2{ float: none; width: auto !important; margin: 0 10px; } .floor_article18 .channel1{ margin-bottom: 15px; } .floor_article18 .channel1 .infotime{ display: none; } .floor_article18 .channel1 .infotitle{ line-height: 1.4em !important; } .floor_article18 .channel2 .q span{ line-height: 1.4em !important; margin-bottom: 8px; } .article20 .infopicture{ min-width:100px; } .article20 .infotitle { line-height:1.6em !important; } .article20 li.type1 .infotime { line-height:1.6em !important; margin-top:8px; } .article22 li{ width:100%; } .article22 li.big .channel span{ padding:8px 20px 9px !important; font-size:20px; } .article22 li .wrap{ padding:12px; } .article22 .big .infotitle{ font-size:20px !important; line-height:1.5em; } .article22 .big .infotime{ font-size:16px !important; margin-top:1px; } .article23 li{ width: 50%; } .article24{ height: auto !important; } .article24 .article24_1,.article24 .article24_2{ width: 100% !important; height: auto !important; padding-top:10px; } .article24_2 li{ padding-left: 0 !important; margin-top:0 !important; } .floor_article25 .col_left{ width: 100%; } .floor_article25 .col_left .top{ text-align: center; } .floor_article25 .col_left .top h2{ text-align: center; } .floor_article25 .col_left h2.h2_2:before { left:50%; margin-left:-40px; width: 80px; } .floor_article25 .tabbar{ overflow: hidden; display: flex; align-items: center; justify-content: center; margin-top:2px !important; } .floor_article25 .tabbar li{ float: left; position: relative; margin:0 9px; } .floor_article25 .tabbar li span{ width:90% !important; height:2px !important; position: absolute; bottom:2px; left:50%; margin-left:-45%; opacity: 0; } .floor_article25 .tabbar .on span{ opacity: 1; } .floor_article25 .pagination{ display: none; } .floor_article25 .component_body{ padding: 5px 0 !important; } .floor_article25 .col_right{ width: 100% !important; padding-top: 20px; } .floor_article25 .col_right li{ width:100% !important; } .floor_article25 .col_right .wrap{ width:100% !important; margin: 0; padding:10px 10px 0; box-shadow:initial; overflow: hidden; border-bottom:1px solid #eee; } .floor_article25 .col_right .infopicture{ width:100px;float: left;} .floor_article25 .col_right .info_wrap{ float: right; width:calc(100% - 100px); padding-left:16px; box-sizing: border-box; } .floor_article25 .col_right .more{ display: none;} /*==========文章组件 结束==========*/ /*==========产品组件 开始==========*/ .floor_product0 { margin: 0 5px; } .floor_product0 .tabbar { margin:0 0 10px; } .floor_product0 .tabbar li a { padding:0 16px !important; margin:5px 0; line-height:30px; } .grid-product0 li a { margin:10px 5px 0 !important; border: 1px solid #eee; } .grid-product0 li .infotitle { font-size:16px; margin:5px 0; } .grid-product0 li .infoscontent { margin-top:8px; padding:0; font-size:12px; text-overflow:-o-ellipsis-lastline; overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-line-clamp:2; line-clamp:2; -webkit-box-orient:vertical; } .thumb-product0 li{ width: 100% !important; } .thumb-product0 a{ padding: 10px; } .thumb-product0 .infotitle{ font-size: 16px; white-space: normal; font-weight: normal; } .thumb-product0 .infoscontent{ line-height: 1em; height: 1em; margin: 5px 0; color: #999; } .thumb-product0 .infopicture{ margin-right: 10px; } .product1 li.n1{ height: 405px !important; } .product1 li.n2{ height: 185px !important; } .product1 li.n3{ height: 220px !important; } .product1 li.n4{ height: 220px !important; } .floor_product2 { margin: 0; overflow:hidden; } .product2{ overflow-x:auto; white-space: nowrap; margin:0 10px; } .product2 li { width:280px !important; display: inline-block !important; float: none; } .product2 .channelwrap .channelscontent{ white-space: normal; } .product2 .channelwrap img { margin-top:40%; max-height:360px; } .product2 .channelwrap .channelname { font-size:18px; margin:10px 0; padding-top:10px; } /*产品扩展组件3*/ .floor_product3{ margin:0; padding:0; } .product3 .infowrap{ opacity:1; } .product3 .infowrap .infotitle { font-size:14px; line-height:1.5em !important; } /*产品扩展组件4*/ .floor_product4{ margin: 0 5px; padding:0; box-sizing:border-box; } .floor_product4 .component_body { background:none !important; padding:0; } .floor_product4 .col_left { float:none; background:none !important; width:100%; box-sizing:border-box; } .floor_product4 .col_left .tabbar { text-align:center; overflow-x:auto; white-space:nowrap; } .floor_product4 .col_left .tabbar li { display:inline-block; margin-bottom:5px; } .floor_product4 .col_left .tabbar li a { line-height:30px; padding:0 20px; border-radius:50px; margin:0 10px; font-size:14px; } .floor_product4 .col_right { float:none; width:100%; } .product4 a{ width:auto; margin:0 5px 5px; } .product4 .infotitle{ font-size:14px; } /*产品扩展组件6*/ .floor_product6{ margin: 0; padding:0 10px; } .product6 li { width:100% !important; } .product6 a{ } .product6 .infopicture{ } .product6 .infowrap{ } .product6 li .x_line { font-size:20px; margin-top:-10px; } .product6.tomod4 li.m2 .x_line1 { display:none; right:-11px; left:auto; } .product6.tomod4 li.m2 .x_line2 { display:block; } .product6.tomod4 li.m1 .x_line1, .product6.tomod4 li.m3 .x_line1 { display:block; right:auto; left:-11px; } .product6.tomod4 li.m1 .x_line2, .product6.tomod4 li.m3 .x_line2 { display:none; } .product6.tomod4 li.m1 .infopicture { float:right; } .product6.tomod4 li.m2 .infopicture { float:left; } .product6 .infowrap .infotitle{ font-size:16px; color:#fff; line-height:1.8em; padding-bottom:5px; position:relative; } .product6 .infowrap .infotitle:before { height:1px; width:40%; max-width:120px; } .product6 li .infoscontent { margin-top:5px; height:3.2em; line-height:1.6em; text-overflow:-o-ellipsis-lastline; overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-line-clamp:2; line-clamp:2; -webkit-box-orient:vertical; } .product6 li .infoprice{ margin:5px 0; } .product6 li .more { float:none; display:none; } /*产品扩展组件7*/ .floor_product7_main{ background-size:auto !important; } /*产品扩展组件8*/ .floor_product8 .tabbar { overflow-x:auto; white-space:nowrap; margin:10px 0; } .floor_product8 .tabbar li { display:inline-block; } .floor_product8 .tabbar li a{ padding:0 20px; } .product8 a { margin:0 5px; } /*产品扩展组件9*/ .floor_product9 { } .floor_product9 .component_body { overflow-x:auto; } .product9 { width:768px; white-space:nowrap; } .product9 li { display:inline-block; } .product9 .channelpicture img { max-height:400px; } /*产品扩展组件10*/ .floor_product10 .component_title { float:none; width:100%; position:inherit; } .floor_product10 .component_title div { margin:25px 0; padding:0 !important; text-overflow:ellipsis; display:-webkit-box; -webkit-line-clamp:3; line-clamp:3; -webkit-box-orient:vertical; } .floor_product10 .component_title .more { line-height:36px; width:110px; } .floor_product10 .component_body { float:none; width:100%; } /*产品扩展组件11*/ .floor_product11{ margin:0; } .floor_product11.full-width1 { padding:0; } .product11 li { position:relative; z-index:1; } .product11 a { } .floor_product13 .tabbarlist .channelicon.position1{ float: none; margin: 0; text-align: center; } .floor_product13 .tabbarlist .channelicon.position1 img{ width: 40px; } .floor_product13 .tabbarlist .channelname{ text-align: center; } .floor_product13 .tabbarlist .channelname p{ display: none; } .floor_product13 .tabbarlist .channelcontent{ display: none; } .product15 { white-space:nowrap; overflow-x:auto; padding:0 10px; } .product15 li { white-space:normal; float:none; width:330px !important; display:inline-block; } .product15 li a { margin:10px 10px; } .product15 li a .more { } .floor_product17{ padding:0 10px; } .floor_product18 .component_title{ width:35% !important; } .floor_product18 .component_body{ width:65% !important; } /*==========产品组件 结束==========*/ .floor_team7 .datalist .picture img { width:100%; height:auto; } /*==========图片组件 开始==========*/ .floor_picture0{ margin:0 5px; } .grid-picture0 li { width:50% !important; margin:0; } .grid-picture0 li a { margin:6px 5px !important; } .grid-picture0 li .infowrap:after{ bottom: 45px; } .grid-picture0 li .infotitle { font-size:16px; margin:5px 0; } .grid-picture0 li .infoscontent { font-size:12px; text-overflow:-o-ellipsis-lastline; overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-line-clamp:2; line-clamp:2; -webkit-box-orient:vertical; } .thumb-picture0 li{ width: 100% !important; } .thumb-picture0 a{ padding: 0; margin: 5px 8px; } .thumb-picture0 .infotitle{ font-size: 16px; padding-top: 0; font-weight: normal; white-space: normal; } .thumb-picture0 .infoscontent{ margin: 0; margin-top: 8px; line-height: 1.5em; height: auto; max-height: 4.5em !important; } .thumb-picture0 .infopicture{ margin-right: 10px; } .picture1 li{ width:50% !important; } .picture1 .infowrap{ top:15px; } .picture2 li{ width:280px; } .floor_picture2{ margin: 0 0; padding: 0 5px; } .floor_picture2 .pagination{ display: none; } .picture2 .infotitle { padding:8px 5px 6px; } .floor_picture3 { margin:0 0; padding:0; } .floor_picture3 .picture3 { margin:0 10px; } .picture3 li { width:100%; } .picture3 li.m0 .infopicture, .picture3 li.m2 .infopicture { float:right; } .picture3 li.m1 .infopicture, .picture3 li.m3 .infopicture { float:left; } .picture3 li .infowrap { padding:10px 10px 0; } .picture3 li .infowrap .infotitle { font-size:16px; margin:15px 0 10px; } .picture3 li .infowrap .infoscontent { font-size:12px; } .picture3 li.m0 .infowrap .x_line, .picture3 li.m2 .infowrap .x_line { right:-21px; left:auto; } .picture3 li.m0 .infowrap .x_line1, .picture3 li.m2 .infowrap .x_line1 { display:block; } .picture3 li.m0 .infowrap .x_line2, .picture3 li.m2 .infowrap .x_line2 { display:none; } .picture3 li.m1 .infowrap .x_line, .picture3 li.m3 .infowrap .x_line { left:-21px; right:auto; } .picture3 li.m1 .infowrap .x_line1, .picture3 li.m3 .infowrap .x_line1 { display:none; } .picture3 li.m1 .infowrap .x_line2, .picture3 li.m3 .infowrap .x_line2 { display:block; } .picture4 li .infotitle{ padding-bottom: 0; margin-bottom: 10px; } .picture5 { white-space:nowrap; overflow-x:auto; box-sizing:border-box; } .picture5 li { float:none; display:inline-block; vertical-align:top; white-space:normal; } .floor_picture6 .component_title { width:30%; padding:20px 5px 0; text-align:left; } .floor_picture6 .component_title h2 { font-size:16px; text-align:left; } .floor_picture6 .component_title p { font-size:14px; text-align:center; margin:20px 0; padding:0; } .floor_picture6 .component_body { width:70%; } .floor_picture6 .pagination { text-align:center; } .floor_picture6 .pagination .prev, .floor_picture6 .pagination .next { margin:0 2px; width:30px; height:30px; line-height:30px; font-size:14px; border-width:1px; } .picture6 li { width:300px; } .picture6 li a { width:290px; margin-left:10px; } .picture6 li h4 { width:230px; line-height:36px; font-weight:normal; font-size:14px; margin:0 30px; } .picture6 li .infowrap:before { height:36px; bottom:-36px; width:30px; } .picture6 li h4:before { width:30px; left:-15px; } .picture6 li h4:after { width:30px; right:-15px; } .floor_picture8 .component_title { width:30%; } .floor_picture8 .component_body { width:70%; } .component .picture8 .col2{ width:480px; } .component .picture8 .col3{ width:320px; } .component .picture8 .col4{ width:240px; } .component .picture8 .col5{ width:240px; } .floor_picture9 .tabbar { margin:5px 0 15px; } .floor_picture9 .component_body { padding:0; } .picture9 li, .picture9 .contact { padding:5px !important; } .picture9 li.n1 .infowrap { height:50px; line-height:50px; left:0; right:0; margin:0; } .picture9 li.n1 .infowrap .theicon { height:50px; line-height:50px; } .picture9 li.n1 .infowrap .infotitle { line-height:50px; } .picture9 .contact .contact_content { top:10%; } /*==========图片组件 结束==========*/ /*==========视频组件 开始==========*/ .grid-video0 li{ width: 50% !important; } .grid-video0 li a { margin:10px 5px 0 !important; } .grid-video0 li .infotitle{ padding: 5px 0; font-size: 15px; } .thumb-video0 li .infopicture{ margin-right: 10px; } .thumb-video0 .infotitle{ overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 16px; } .thumb-video0 .infoscontent{ padding-top: 5px; margin-top: 5px; line-height: 1.5em; height: 3em; overflow: hidden; } .video2 a .infoscontent{ overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; } .floor_video3 { padding:0 10px; } .floor_video3 .thevideo { max-width:45%; } .floor_video3 .thecontent { overflow:inherit; padding: 25px !important; } .floor_video4 .video4 li{ width:100%; } .floor_video4{ padding:0 !important; } .floor_video4 ul li .box{ width:100% !important; margin: 0 !important;} .floor_video4 li .video_wrap{ text-align: center; } .floor_video4 li .videobox{ width: auto !important; } .floor_video4 .pagination .prev{ left:0 !important; } .floor_video4 .pagination .next{ right:0 !important; } .floor_video4 .swiper-prev-area,.floor_video4 .swiper-next-area{ z-index: -1; } /*==========视频结束 开始==========*/ .floor_channel>.component_body { padding:15px 10px; } /*==========团队组件 开始==========*/ /*团队列表组件1*/ .floor_team1 { margin:0; padding:0 } .team1 { margin:0 5px; } .team1 li { width:50% !important; margin:10px 0 0; } .team1 li a { padding:5px; } .team1 li .infowrap { padding:10px; } .team1 li .infowrap .infotitle { font-size:16px; line-height:inherit; } .team1 li .infowrap .infotitle span { display:block; line-height:inherit; padding:5px 0 0; } .team1 li .infowrap .infocontent { text-overflow:-o-ellipsis-lastline; overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-line-clamp:3; line-clamp:3; -webkit-box-orient:vertical; } .team1 li:hover .infowrap { padding-top:20px; padding-bottom:20px; margin-top:-20px; } /*团队列表组件2*/ .floor_team2 { margin:0 0 0; padding:0; } .team2 { margin:0 5px; } .team2 li { margin:5px 0; width:100% !important; } .team2 li .infopicture { margin-right:10px; } .team2 li.m1 .infopicture { float:right; margin:0 0 0 10px; } .team2 li .infowrap { padding:5px 10px; overflow:hidden; } .team2 li .infowrap .infotitle { font-size:16px; line-height:1.7em; } .team2 li .infowrap .infoscontent { font-size:12px; line-height:1.7em; } .team2 li .infowrap p { line-height:1.7em; height:5em; margin:10px 0; text-overflow:-o-ellipsis-lastline; overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-line-clamp:3; line-clamp:3; -webkit-box-orient:vertical; } .team2 li .infowrap .view1 { font-size:28px; } /*团队列表组件3*/ .floor_team3 { margin:0 5px; padding:0; } .floor_team3 .component_body { padding-bottom:38px; } .team3 { margin:0; } .team3 li { width:280px; } .team3 li a { padding:0; margin:0 5px; } .team3 li .infowrap { padding:10px; } .team3 li .infowrap .infotitle { font-size:16px; line-height:1.7em; } .team3 li .infowrap .infotitle span { display:block; line-height:inherit; padding:5px 0 0; } .team3 li .infowrap .infoscontent { font-size:12px; line-height:1.7em; } .team3 li .infowrap .infocontent { text-overflow:-o-ellipsis-lastline; overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-line-clamp:3; line-clamp:3; -webkit-box-orient:vertical; line-height:1.7em; height:5em; } .team3 li:hover .infowrap { padding-top:20px; padding-bottom:20px; margin-top:-20px; } .team3 li .infowrap .more { margin-top:15px; } /*团队列表组件4*/ .floor_team4 { width:auto; margin:0 5px; padding:0; } .floor_team4 .component_body { padding-bottom:35px; } .floor_team4 .swiper-pagination { text-align:center; bottom:0; padding:0; } .team4 { padding:0; } .team4 li a { padding:10px 5px; } .team4 li .infopicture { padding:0; width:40%; } .team4 li .infowrap .infotitle { font-size:18px; line-height:1.7em; } .team4 li .infowrap { width:55%; margin-top:5px; padding:0; } .team4 li .infowrap .infoscontent { font-size:12px; line-height:1.6em; } .team4 li .infowrap .infocontent { height:3.4em; text-overflow:-o-ellipsis-lastline; overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-line-clamp:2; line-clamp:2; -webkit-box-orient:vertical; line-height:1.7em; } .team4 li .infowrap .view1 { font-size:12px; padding:6px 10px 0px 5px; display:none; } .team4 li .infowrap .view1:hover { padding:6px 10px 0px 0; } /*团队列表组件5*/ .floor_team5 { margin:0; padding:0; } .floor_team5 .component_body { overflow-x:scroll; } .floor_team5 .component_body .more { padding:0 20px; } .floor_team5 .team5 { white-space:nowrap; overflow:inherit; } .floor_team5 .team5 li { float:none; display:inline-block; width:300px; white-space:normal; } .floor_team5 .team5 li.hover .infowrap{ opacity: .8; } .floor_team5 .team5 li:hover { width:300px; } .floor_team5 .team5 li:hover .infowrap { opacity:.8; padding:15px 15px; } /*==========团队组件 结束==========*/ /*==========基础组件 开始==========*/ .floor_basic1 { } .floor_basic3 a .text { padding:5px; } .floor_basic3 a .text h2{ font-size: 14px; padding-bottom: 5px; } .floor_basic3 a .text p{ font-size:12px; } .floor_basic4{ padding: 0 10px; } .floor_basic5 { margin:0 10px; } .floor_basic5 .component_body p { margin:10px 0 0; } .floor_basic5 .component_body .slot>div { margin-top:10px; } .floor_basic7{ padding: 0; } .floor_basic7 .swiper-slide a{ display: block; width: 100%; } .floor_basic7 .component_body{ display: flex; flex-direction: column; } .floor_basic7 .swiper-container{ order: 1; } .floor_basic7 .contentwrap{ text-align: center; float: none !important; margin-top: 0 !important; } .floor_basic7 .contentwrap .button{ display: none; } .floor_basic7 .contentwrap .wrap{ text-align: center; display: block; } .floor_basic7 .button.wap{ display: block; text-align: center; order: 5; margin-top:0; } .floor_basic7 .swiper-container{ float: none !important; width: 100% !important; margin: 0; } .floor_basic7 .swiper-container .swiper-slide .subpicture{ max-width: 70%; } .floor_basic7.type2 video,.floor_basic7.type1 .picture{ float: none; width: 95% !important; margin: 0 auto; order: 1; } .floor_basic7.type4 .picture{ display: block; margin: 0 0 0 -25px !important; float: none; width: 200px; } .floor_basic8 li{ width: 33.3333% !important; } .floor_basic8 li h2{ font-size: 16px; } .floor_basic9 .swiperitem{ margin-top: 15px } .floor_basic9 .subpicture{ display: none; } .floor_basic9 h2:not(:empty){ padding: 10px !important; line-height: 1.2em !important; } .floor_basic9 p{ padding: 0 10px !important; } .floor_basic9 i{ display: none; } .floor_basic10{ padding: 0; } .floor_basic10 .datalist{ white-space: nowrap; float: none; width: 100%; overflow-x: auto; overflow-y: hidden; } .floor_basic10 .datalist li{ padding: 10px; float: none; display: inline-block; width: 100px; vertical-align: top; } .floor_basic10 .datalist .picture img{ width: 40px; height: 40px; } .floor_basic10 .datalist li .title{ font-size: 13px; white-space: pre-wrap; } .floor_basic10 .datalist li i{ margin: 8px auto; } .floor_basic10 .content_wrap{ float: none; width:calc(100% - 10px); margin: 0 auto; } .floor_basic10 .content_wrap .picture img { max-width:100%; margin:5px 0; } .floor_basic10 .content_wrap .subtitle{ line-height: 1.2em !important; width: auto; padding: 10px 0; } .floor_basic10 .content_wrap .description{ width: auto; } .floor_basic11_main{ padding-left: 0 !important; padding-right: 0 !important; } .floor_basic11{ padding: 0 10px; } .floor_basic11 .btn_wrap{ position: static !important; text-align: center; } .floor_basic11 .text_wrap{ text-align: center !important; } .floor_basic11 .btn_wrap a{ transform: scale(.8); } .floor_basic11 .btn_wrap i{ display: none !important; } .floor_basic13 .datalist { padding: 10px; } .floor_basic13 .datalist li { width: 33.3333% !important; margin:0; } .floor_basic14 { margin:0 5px; padding:0; } .floor_basic15 .datalist2 li{ display: flex; align-items: center; } .floor_basic16_main .component_title{ padding: 0 10px; } .floor_basic16 li{ padding: 0 15px; } .floor_basic16 .title{ margin-top: 10px; } .floor_basic16 .subtitle{ display: block; margin-bottom: 10px; text-align: center; margin-right: 0; } .floor_basic16 .wrap{ max-width: 100%; } .floor_basic18 .contentwrap{ text-align: center; float: none !important; } .floor_basic18 .button{ display: none; } .floor_basic18 ul{ overflow-x: auto; width: auto; display: block; border: 0; margin: 15px !important; white-space: nowrap; font-size: 0; } .floor_basic18 ul li{ display: inline-block; padding: 5px 0; vertical-align: middle; border: 1px solid #e4e5e9; border-left: 0; border-right: 0; width: 120px; } .floor_basic18 ul li:first-child{ border-left: 1px solid #e4e5e9; border-radius: 6px 0 0 6px; } .floor_basic18 ul li:last-child{ border-right: 1px solid #e4e5e9; border-radius: 0 6px 6px 0; } .floor_basic18 .title{ margin-top: 0 !important; } .floor_basic18 .swiper-container{ float: none; width: 100% !important; } .floor_basic19 .listitem{ min-width: 350px; } .floor_basic20 .subtitle,.floor_basic20 .description{ margin: 10px 0 !important; padding: 0 15px !important; } .floor_basic21 li { padding:5px !important; } .floor_basic21 .wrap{ margin: 5px !important; padding:5px !important; background: transparent !important; } .floor_basic22 { margin:0 5px; } .floor_basic22 ul{ padding:0; display: flex; flex-wrap: wrap; } .floor_basic22 .wrap{ margin: 5px !important; padding:5px !important; } .floor_basic23{ padding: 0 10px; } .floor_basic23 .wrap{ transform: scale(.8); } .floor_basic23 li{ padding: 10px; } .floor_basic23 .title{ line-height: 2.0em !important } .floor_basic23 .subtitle{ margin-top: 0; } .floor_basic23 .picture{ float: none; text-align: center; } .floor_basic23 img{ max-width: 100%; } .floor_basic23 .pagination_btn{ display: none; } .floor_basic24 .component_body{ overflow: visible; } .floor_basic24 .contentwrap{ position: static; } .floor_basic24 .wrap{ width: 330px; margin-right: 5px; overflow: visible; } .floor_basic24 .swiper-container{ width: 56% !important; } .floor_basic25 .subpicture{ width: 70%; } .floor_basic25 .description{ display: none !important; } .floor_basic25 .tabbarlist li{ max-width: 120px; } .floor_basic25 .tabbarlist i{ max-width: 120px; } .floor_basic27 .tabbarlist{ white-space: nowrap; overflow-x: auto; } .floor_basic27 .tabbarlist li{ display: inline-block; width: 120px !important; float: none; } .floor_basic27 .swiperitem ul{ white-space: nowrap; overflow-x: auto; } .floor_basic27 .swiperitem li{ width: 300px !important; display: inline-block; float: none; } .floor_basic27 .swiperitem li p{ white-space: pre-wrap; margin-top: 0 } .floor_basic28{ padding: 0 15px; } .floor_basic28 .picture{ margin-left: 10px; } .floor_basic29{ padding: 0; } .floor_basic29 .component_bottom{ display: none; } .floor_basic30 .component_body{ overflow-x: auto; } .floor_basic30 ul{ white-space: nowrap; overflow: visible; } .floor_basic30 li{ float: none; display: inline-block; } .floor_basic30 li .subtitle{ white-space: pre-wrap; padding: 0 10px !important; } .floor_basic30 li .description{ white-space: pre-wrap; } .floor_basic30 li a, .floor_basic30 li .wrap{ max-width: 550px; } .floor_basic31 ul{ white-space: nowrap; overflow-x: auto; overflow-y: hidden; } .floor_basic31 li{ width: auto !important; float: none !important; display: inline-block; } .floor_basic31 .wrap{ margin: 5px !important; } .floor_basic31 .wrap:hover{ transform: translatey(0); box-shadow: none; } .floor_basic32 .tabbarlist{ overflow-x: auto; display: block; white-space: nowrap; } .floor_basic32 .tabbarlist li{ display: inline-block; } .floor_basic33 .float_left{ width: 420px !important; } .floor_basic33 .column2,.floor_basic33 .column3{ width: 100% !important; } .floor_basic33 .infopicture img{ width: 40px; } .floor_basic33 li a{ padding: 5px 0 !important; } .floor_basic34{ padding: 0; } .floor_basic34 a{ margin: 0 5px !important; max-width:280px; } .floor_basic34 .component_bottom span.pagination_btn{ display: none; } .floor_basic35 .component_body{ overflow-x: auto; overflow-y: hidden; } .floor_basic35 ul{ width: 800px; } .floor_basic35 a{ top: 0; } .floor_basic35 .titlewrap{ max-width: 50px; margin: 0 10px !important; } .floor_basic35 li.on .description{ padding-right: 0; } .floor_basic36 { } .floor_basic36 li { width:50% !important; border:0 !important; padding:0 10px !important; } .floor_basic36 .title { max-width:60%; } .floor_basic36 .list_left .title { margin:0 10px 0 0 !important; } .floor_basic36 .list_right .title { margin:0 0 0 10px !important; } .floor_basic36 .description { font-size:14px; } .floor_basic37 { } .floor_basic37 ul { overflow-x:auto; white-space:nowrap; margin:0 5px 0; } .floor_basic37 li { width:290px !important; margin:0 5px; padding:0; } .floor_basic37 .description { } .floor_basic39 .title { margin:0; padding:0; } .floor_basic39 .basicpicture { max-width:45%; } .floor_basic39 .picture { max-width:60px; } .floor_basic39 .subtitle { } .floor_basic40 ul{ white-space: nowrap; overflow-x: auto; overflow-y: hidden; } .floor_basic42 { margin:0 10px; } .floor_basic42 .picture img { width:50%; min-width:50%; max-width:50%; display:block; } .floor_basic42 .content { width:50%; min-width:50%; max-width:50%; height:auto !important; position:initial; transform: translatey(0); } .floor_basic42 .content .wrap { padding:30px !important; } .floor_basic43 { padding:0 10px; } .floor_basic45 { padding:0 10px; } .floor_basic45 .contentwrap { margin-top:0 !important; } .floor_basic46 .content_main { margin:0 10px; } .floor_basic46 .content_main .content_wrap { width:40%; } .floor_basic52 .tab_box1 .wrap{ width: 100%; } .floor_basic52 li .more a{ width:165px; height:40px; line-height:38px;} .floor_basic52 .more span{ font-size:15px !important; } /*==========基础组件 结束==========*/ /*==========友情链接组件 开始==========*/ /*友情链接组件1*/ .floor_link1{ margin:0; } /*友情链接组件2*/ .floor_link2{ margin:0; } /*友情链接组件4*/ .floor_link4{ margin:0; } /*==========友情链接组件 开始==========*/ /*==========其他组件 开始==========*/ .floor_other1{ margin: 0 5px; } .other1 li{ width:100%; margin-bottom:10px; } .other1 li a{ margin:0 5px; } .other1 li .albumwrap{ padding:10px 10px; } .other1 li .albumtitle{ font-size:18px; padding:0; line-height:inherit; margin-bottom:8px; transition-duration:.5s; } .other1 li .albumdescription{ color:#999; line-height:1.5em; height:3em; overflow:hidden; } .other1 li:hover img{ transform:scale(1.1); } .other3_navigation>li { margin:0 0 0 20px !important; } .floor_other2{ margin: 0 5px; } .picture-other2 .albumwrap{ margin:5px; } .picture-other2 li { float:left; width:50% !important; } .picture-other2 li img{ width:100%; filter:grayscale(0); opacity:1; } /*==========其他组件 结束==========*/ /*==========页脚组件 开始==========*/ .floor_foot1 .component_title{ width: 50%; } .floor_foot1 .foot1_navigation li{ margin-right: 20px; } .floor_foot1 .component_body{ width: 22%; } .floor_foot1 .component_bottom{ width: 28%; } .floor_foot2 .component_body{padding: 0 2%; width: 34%; } .floor_foot2 .component_bottom{ width: 46%; } .floor_foot3 .component_title{ width: 27%; } .floor_foot3 .foot3_title{ padding-bottom: 0 !important; } .floor_foot3 .foot3_wechat{ float: none; width: auto; } .floor_foot3 .component_bottom{ width: 27%; } .floor_foot6 .component_title{ width: 64%; margin-right: 4%; } .floor_foot6 .component_body{ width: 15%; padding: 0; } .floor_foot6 .component_bottom{ width: 17%; } /*==========页脚组件 结束==========*/ /*==========技术支持组件 开始==========*/ /*技术支持组件1*/ .floor_support1{ margin:0 10px; } .floor_support1 .support1_text { display:none; } /*==========技术支持组件 结束==========*/ /*==========发展历程组件 开始==========*/ /*发展历程组件1*/ .floor_flow1 { margin:0 5px; padding:0; } .flow1 { padding:15px 0; } .floor_flow1 li { margin:0px 50px 0px 0; } .floor_flow1 li.m1 { margin:0px 0 0px 50px; } .floor_flow1 li .albumwrap { padding:0 10px 0 0; } .floor_flow1 li.m1 .albumwrap { padding:0 0 0 10px; } .floor_flow1 li .subtitle { float:none; margin:0; font-size:14px; width:auto; text-align:right; padding:0; } .floor_flow1 li.m1 .subtitle { float:none; width:auto; margin:0; text-align:left; padding:0; } .floor_flow1 li .title { font-size:16px; } .floor_flow1 li .point_back { width:16px; height:16px; right:-8px; top:2px; } .floor_flow1 li.m1 .point_back { left:-8px; } .floor_flow1 li .point_small { width:10px; height:10px; top:3px; left:3px; } .floor_flow1 li .description { font-size:13px; } /*发展历程组件2*/ .floor_flow2 { padding:0; } .floor_flow2 li { width:calc(50% - 20px); margin:0 30px 0 10px; } .floor_flow2 li.m1 { margin:0 10px 0 30px; } .floor_flow2 li .albumwrap_wrap { padding:10px; margin:-80px 0 0; } .floor_flow2 li.n1 .albumwrap_wrap { margin-top:-100px; } .floor_flow2 li .subtitle { } .floor_flow2 li .point_back { width:14px; height:14px; right:-18px; } .floor_flow2 li.m1 .point_back { right:auto; left:-18px; } /*发展历程组件3*/ .floor_flow3 li { margin:15px 0 0; } .floor_flow3 li .picture { float:left; width:40%; } .floor_flow3 .center_line, .floor_flow3 li .point_back { left:44%; } .floor_flow3 li .title { padding:5px 0; } .floor_flow3 li .subtitle { float:left; width:60%; padding:0 0 0 8%; font-size:14px; line-height:14px; text-align:left; box-sizing:border-box; } .floor_flow3 li .albumwrap_wrap { float:left; width:60%; padding:0 0 0 8%; } .floor_flow3 li .description { float:none; width:100%; } /*发展历程组件4*/ .floor_flow4 ul { overflow:inherit; white-space:nowrap; } .floor_flow4 ul li { white-space:normal; } /*发展历程组件5*/ .floor_flow5 ul { overflow:inherit; white-space:nowrap; } .floor_flow5 ul li { white-space:normal; } /*发展历程组件6*/ .floor_flow6 ul { overflow:inherit; white-space:nowrap; } .floor_flow6 ul li { white-space:normal; } /*发展历程组件7*/ .floor_flow7 ul { overflow:inherit; white-space:nowrap; } .floor_flow7 ul li { white-space:normal; } /*发展历程组件9*/ .floor_flow9 ul { overflow:inherit; white-space:nowrap; } .floor_flow9 ul li { white-space:normal; max-width:300px; } /*发展历程组件10*/ .floor_flow10 ul { overflow:inherit; white-space:nowrap; } .floor_flow10 ul li { white-space:normal; max-width:300px; } .floor_flow10 li .albumwrap { width:90%; } .floor_flow10 li .subtitle { margin:0 0 0 15%; } /*发展历程组件11*/ .floor_flow11 ul { overflow:inherit; white-space:nowrap; } .floor_flow11 ul li { float:none; white-space:normal; width:200px !important; } /*==========发展历程组件 结束==========*/ /*==========常见问题 开始==========*/ .floor_faq1 .swiperlist li{ min-width: 50%; } .floor_faq2 .swiperlist li{ min-width: 50%; } /*==========常见问题 结束==========*/ /*==========表单组件 开始==========*/ .floor_table2 td{ border-width: 15px !important; } /*==========表单组件 结束==========*/ /*==========联系组件 开始==========*/ .contact1 ul{ padding: 15px; width: 35%; } .contact1 .map_container{ width: 65% !important; } .contact2 li{ width: 25% !important; padding: 5px 10px; height: 110px; } .contact2 li:after{ top: 5px; bottom: 5px; } .contact2 .map_container { margin:0 10px; width:calc(100% - 20px); } .contact3 li{ width: 25% !important; padding: 10px; } .contact5 .contact5list{ padding:25px 20px; } /*==========联系组件 结束==========*/ /*==========优势特点 开始==========*/ .floor_good1 ul{ padding: 0 10px; } .floor_good1 li{ min-width: 25%; margin: 0; } .floor_good2{ padding: 10px; margin: 10px; display: block; } .floor_good2 .component_title{ max-width: 60%; margin: 0; } .floor_good2 .component_body{ margin-top: 10px; } .floor_good2 ul{ margin: 0; } .floor_good2 li{ width: 50% !important; margin-top: 15px; } .floor_good2 .picture[src=""]{ display: none; } .floor_good3 ul{ overflow-x: auto; white-space: nowrap; } .floor_good3 li{ display: inline-block; float: none; min-width: 288px; } .floor_good4 .tpicture{ max-height: 300px; } .floor_good5_main { padding:0 !important; } .floor_good5{ padding: 0 10px; box-sizing: border-box; } .floor_good5 .tpicture{ position: relative; display: block; width: auto !important; max-width: 100%; margin: 0 auto; } .floor_good5 li{ border: 0; padding: 0; margin-top: 15px; width: 49%; } .floor_good5 .description{ line-height: 1.5em !important; } .floor_good6{ box-sizing: border-box; padding: 0 10px; } .floor_good6 .tpicture{ position: static; width: 100%; height: auto; padding: 0; border: 0; } .floor_good6 .tpicture i{ display: none; } .floor_good6 li{ position: static; text-align: left; margin-top: 15px; } .floor_good7 .component_body{ padding:0 5px; } .floor_good7 li .wrap .link{ margin-top:5px; } .floor_good7 li .wrap{ padding:5px 10px } .floor_good7 li .wrap .title{ line-height: 1.5em !important; } .floor_good7 li .wrap .description{ line-height: 1.6em !important; } .floor_good7 li .img img{ object-fit: cover; height: 100%; } .floor_good7 .component_bottom{ margin-top:5px; } .floor_good7 .component_bottom .active{ opacity: 0; } .floor_good8 li{ width: 33.333% !important; border-right:1px solid rgba(255,255,255,.2) !important; border-bottom:1px solid rgba(255,255,255,.2);} .floor_good8 li:nth-child(3n 3){ /*border-right:none !important;*/ } .floor_good8 li .title{ font-size:36px !important; } .floor_good8 li .subtitle{ font-size:16px; line-height:1.6em !important; } /*==========优势特点 结束==========*/ /*==========服务流程 开始==========*/ .floor_step3 li{ width: auto !important; } .floor_step4{ overflow-x: auto; white-space: nowrap; } .floor_step4 li{ width: 170px !important; box-sizing: content-box; padding: 10px; } .floor_step6 { overflow-x:auto; } .floor_step7 ul { overflow-x:auto; } .floor_step8 { padding:0 10px; } .floor_step8 li { margin-bottom:40px; } .floor_step8 li.space { max-width:30px; } .floor_step8 li:after { height:40px; } .floor_step8 .description { padding:15px 0 0; } .floor_step9 { padding:0 10px; } .floor_step9 li.space { max-width:30px; } .floor_step10_main{ overflow-x: auto; white-space: nowrap; padding-bottom: 10px !important; } .floor_step10 li{ min-width:195px !important; } .floor_step10 li .num{ width: 50px !important; height: 50px !important; font-size: 24px;} .floor_step11{ padding:0 12px; } .floor_step11 li{ min-width:185px; } /*==========服务流程 结束==========*/ /*==========功能对比组件 开始==========*/ .floor_vs1 .component_title .qthemetitle{ padding: 0 35px 0 10px; } .floor_vs1 .component_title .ythemetitle{ padding: 0 10px 0 35px; } .floor_vs1 .float_right{ padding-left: 35px; } .floor_vs1 .float_left{ padding-right: 35px; } /*==========功能对比组件 结束==========*/ /*==========内页组件 开始==========*/ .floor_channel17{ padding:0 10px; } /* 内页组件2318 */ .article18 li{width: 100% !important; height: auto !important; margin-left: 0 !important; margin-right: 0 !important;} .article18 li .infopicture{height: auto !important; margin-left: 0 !important; margin-right: 0 !important;} .article18 li.second .infopicture,.article18 li.third .infopicture{min-width: 35%;} .article18 li.second .infowrap{width: auto; float: none;} .article18 .infowrap{padding: 10px !important;} .article18 .infotitle, .article18 .infotime, .article18 .infoscontent{padding-left: 0; padding-right: 0;} .article18 .infoscontent{overflow: hidden; display: -webkit-box; text-overflow: ellipsis; -webkit-box-orient: vertical; -webkit-line-clamp: 2;} /* 内页组件2320 */ .list20 li .infowrap .infoscontent{display: none;} .list20 li .infowrap .infomore{margin-top: 20px;} .list20 li .infowrap{padding: 15px 30px !important;} /* 内页组件2321 */ .list21 li .infowrap{padding: 0 30px !important;} /*==========内页组件 结束==========*/ /*==========详情页组件 开始==========*/ .grid-detail6 li a { margin:10px 5px 5px; } .grid-detail6 li .infotitle{ margin: 10px 0; } .grid-detail6 li .infoscontent{ margin: 10px 0; } .grid-detail6 li .infotime{ margin: 10px 0; padding-top: 10px; } .grid-detail6 li .infoprice{ margin: 10px 0; } .thumb-detail6 .infowrap{ padding: 10px; } .thumb-detail6 li{ width: 100% !important; } .thumb-detail6 a{ padding: 0; } .thumb-detail6 .infotitle{ white-space: normal; font-size: 16px; font-weight: normal; } .thumb-detail6 .infopicture{ margin-right: 0; } .thumbright-detail6 .infowrap{ padding: 10px; } .thumbright-detail6 li{ width: 100% !important; } .thumbright-detail6 a{ padding: 0; } .thumbright-detail6 .infotitle{ white-space: normal; font-size: 16px; font-weight: normal; } .thumbright-detail6 .infopicture{ margin-left: 10px; margin-right: 0; } /*==========详情页组件 结束==========*/ .component .layout>div { padding:10px !important; margin:0 !important; box-sizing:border-box; } } @media screen and (max-width:990px) { .contact6 .contact6list li:nth-child(odd){ width:45% !important; } .contact6 .contact6list li:first-child{ height:3.6em !important; } .contact6 .contact6list li:nth-child(2){ height:3.6em; } .contact6 .contact6list li:nth-child(even){ width:55%; } } @media screen and (max-width: 699px) { .yd-hidden{display: none;} .ydicon-play:before { width:40px; height:40px; line-height:40px; font-size:18px; } .component_title>h2{ font-size:24px; } .component_title>p{ font-size:14px; margin:5px 0; padding:0; } .floor_form input, .floor_form textarea { max-height:100px; } /*==========单页组件 开始==========*/ .page17 { margin:0 10px; overflow-x:auto; } .page17, .page17.rl-page17 { writing-mode:horizontal-tb; } .page17.yes-page17 { box-shadow: 0 0 20px #ccc; } .page17.yes-page17 .page17_floor { box-shadow:none; } .page17 .small_img { display:block; margin-bottom:15px; } .page17 .channelwrap .big_img { display:none; } .page17.rl-page17 .tpagebtn { margin:0 15px 0 0; } .page17 .tpagebtn .btn { font-size:14px; } .floor_page18 .channelwrap { position: relative; height:auto; top:auto; transform: translatey(0); margin-top:0; padding: 40px 10px; overflow:hidden; } .floor_page18 .bgpicture { position: absolute; top: 0; left: 0; height: 100%; min-width: 100%; } .floor_page18 .channelwrap .inline_block { } /*==========单页组件 结束==========*/ /*==========联系组件 开始==========*/ /*联系*/ .contact1 ul{ position: static; width: auto; height: auto; } .contact1 .map_container{ width: 100% !important; } .contact2 li{ width: 50% !important; } .contact3 li{ width: 50% !important; } .contact5 .contact5list,.map_container{ width: 100% !important; } .contact5 .contact5list{ position: static; padding:25px 20px; } .floor_contact6 .contact6 ul.contact6list li{ width:100% !important; height: auto !important; } .contact6 ul.contact6list li:first-child{ width:100% !important; height:auto; } /*==========联系组件 结束==========*/ /*1.单页*/ .floor_page0>.component_body{ min-height: 300px; } .page1 a { margin:20px auto; display:block; width:120px; text-align:center; padding:0; line-height:36px; } .page1 .bgpicture { width:100%; height:12em; float: none; } .page1 .channelwrap { float:none !important; width:100%; height:auto; } .page1 .channelname { padding:20px 10px 10px; font-size:24px; margin-bottom:15px; } .page1 .channelname:after{ left: 10px; } .page1 .channelscontent { padding:0 10px !important; max-width: 100%; } .thumbright-page1 { text-align:left !important; } .thumbright-page1 .bgpicture { float:none !important; } .thumbright-page1 .channelname:after { right:auto; left:10px; } .page2 .albumlist li { width: 50%; } .floor_page5 { margin:0 10px; padding:0; } .page5 { padding:0; } .page5:after { display:none; } .page5 .tpagepicture { position:initial; width:100%; margin-top:10px; height:auto; } .page5 .tpagepicture img { width:100%; height:auto; } .page5 .albumlist { float:none; width:100%; margin:10px 0 0; } .page5 .albumlist li { padding:15px 15px; } .page5 .albumlist li .albumtitle { font-size:18px; } .page10 .albumlist li{ width: 50%; margin: 10px 0; } .floor_page11 { margin:0 10px; padding:0; } .page11_albumlist li { margin-top: 15px !important; } .page11_albumlist li:first-child { margin-top: 0 !important; } .page11_albumlist li .albumpicture { float:none; width:100%; margin:0; } .page11_albumlist li .albumpicture img { width:100%; display:block; } .page11_albumlist li.m0 .albumpicture { float:none; margin:0; } .page11_albumlist li .albumtitle { font-size:18px; } .page11_albumlist li.m0 { text-indent:0px; } .page11_albumlist li .albumdescription { font-size:14px; color:#666; line-height:1.8em; } .page11_albumlist li .albumpicture .num { width:56px; font-size:30px; right:30px; padding:5px 0; top:-20px; } .floor_page14 .tpagepicture{ width: 100% !important; } .floor_page14 .channelname, .floor_page14 .channelscontent{ padding-top: 10px; padding-left: 10px; padding-right: 10px; } .page15 { margin:0 10px; } .page15_tabbar li { padding:16px 0; } .page15_channellist a { margin:0; } .floor_page20 .component_title{ min-width:100%; max-width:100%; } .floor_page20 .component_title h2 a{ padding-left:0 !important;} .floor_page20 .component_body{ min-width:100%; max-width:100%; display: none; } .floor_page20 .content_top{ padding:0 10px 20px; } .floor_page20 .detail{ box-sizing: border-box; padding:30px 15px 30px; } .floor_page20 .datalist a{ padding:12px !important; } .floor_page20 .component_title .content{ display: block; line-height: 1.6em; margin-bottom: 12px; } /*2.文章*/ .text-article0 a{ padding: 10px 0; } .text-article0 a .infowrap{ display: flex; } .text-article0 a .infotitle{ flex: 1; margin-right: 10px; } .grid-article0 li .infotitle{ line-height: 1.6em !important; height:3.2em; white-space: normal; display:-webkit-box;overflow:hidden;text-overflow:ellipsis;-webkit-line-clamp:2;-webkit-box-orient:vertical; } .floor_article1 .pagination { padding:10px 0 0; } .article4_2 li { margin:0; padding:5px 10px; } .article4_2 .infopicture { max-width:110px; } .article7 li .infotitle{ white-space: pre-wrap; line-height: 1.6em !important; } .article7 li .superinfotime{ width: 80px; padding:0; } .article9 .infoscontent{ display:-webkit-box;overflow:hidden;text-overflow:ellipsis;-webkit-line-clamp:2;-webkit-box-orient:vertical; height: auto; } .article10 { padding:0 10px !important; } .article10{ min-width: 350px; } .article11 .infopicture{ width: 100px; height: auto; margin: 0 10px; } .article12 li .infotitle{ height: 4.1em; } .article15 li .leftwrrap { padding:15px 40px 15px 10px; max-width:42%; } .article15 li .infotime{ min-width:100px; } .article15 li .centerline { right:19px; } .article15 li .infoscontent { -webkit-line-clamp:2; } .floor_article16 li:first-child .infotitle{ white-space: pre-wrap; line-height: 1.4em !important; } .floor_article16 li:first-child .infoscontent{ display: none; } .article17 li .infotitle{ line-height: 1.6em; height: 3.2em; white-space: pre-wrap; display:-webkit-box;overflow:hidden;text-overflow:ellipsis;-webkit-line-clamp:2;-webkit-box-orient:vertical; } .article17 li .superinfotime { height:auto !important; padding:5px 0; } .article19 li { float:none; width:100% !important; } .article20 li { width:100% !important; } .article20 li.type2 .infotime { width:60px; height:60px; } .article20 li.type2 .infotime span.d { font-size:24px; top:10px; } .article20 li.type2 .infotime span.ym { font-size:12px; top:35px; } .articlea21 { float: none; width: auto; padding: 0 5px; } .articlea21 a { margin: 5px !important; } .articlea21 li { width: 100% !important; } .articlea21 li.n1 .infopicture { float: none; width: 100%; margin-right: 0; } .articlea21 li.n1 .infotitle { margin-top: 0; } .articlea21 li.n1 .info_wrap { padding: 20px; } .articlea21 li .infopicture { max-height: 200px; } .articlea21 li .infotime:before { margin: 10px 0; } .articlea21 li .infoscontent { display: block; line-height: 1.6em !important; height: 3.2em; white-space: pre-wrap; display:-webkit-box;overflow:hidden;text-overflow:ellipsis;-webkit-line-clamp:2;-webkit-box-orient:vertical; } .articleb21 { float: none; width: auto; } .articleb21 li { margin-top: 20px; } .articleb21 .infotime { } .articleb21 li .infoscontent { display: block; margin-top: 5px; line-height: 1.6em !important; height: 3.2em; white-space: pre-wrap; display:-webkit-box;overflow:hidden;text-overflow:ellipsis;-webkit-line-clamp:2;-webkit-box-orient:vertical; } .article22 li{ width:100%; } .article22 li.n1{ padding-right:5px; } .article22 li.n2{ padding-left:5px; } .article22 li.big .channel span{ padding: 5px 10px !important; font-size:14px !important; line-height: 1.2em; } .article22 li .wrap{ padding:8px; } .article22 li .channel span{ padding:4px 9px !important; font-size:13px !important; } .article22 .big .infotitle{ font-size:14px !important; line-height:1.5em; } .article22 .big .infotime{ font-size:13px !important; margin-top:1px; } .article23 li{ width:100% !important; } /*3.产品*/ .floor_product0 .tabbar { margin:0 0 5px; } .floor_product0 .tabbar li a { padding:0 16px !important; } .floor_product1 .component_body{ overflow-x:auto; } .product1{ width: 560px; margin: 0 auto; } .product1 li a i{ font-size: 32px; right: 30px; } .product1 li a { overflow:hidden; } .product1 li a .channelpicture { width:auto; height:100%; } .product1 li.n2 { height:160px !important; } .product1 li.n2 .channelname { font-size:24px; height:40px; line-height:40px; font-size:22px; left:20px; } .product1 li.n1 { height:320px !important; } .product1 li.n3 { height:160px !important; } .product1 li.n4 { height:160px !important; } .product1 li.n1 .channelname, .product1 li.n3 .channelname, .product1 li.n4 .channelname { line-height:36px; font-size:16px; padding:0 5px; text-align:center; } .floor_product12 .tabbar { margin:5px 0; } .floor_product12 .tabbar li a { padding:10px 20px !important; } .floor_product12 .tabbar li img { max-height:32px; } .product15 { padding:0 5px; } .product15 li { float:left; display:block; width:50% !important; max-width:100%; margin:0 auto; } .product15 li a { margin:10px 5px 0 !important; padding:0px; height:auto !important; } .product15 li.leftdiv a { padding:10px; } .product15 li a .more { text-align:center !important; } .product15 li.leftdiv .content { overflow:hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp:5; line-clamp:5; -webkit-box-orient: vertical; } .floor_product16 { margin:0 5px; } .product16 a { margin:0 5px !important; } .floor_product16 .pagination { margin-top:20px; } .floor_product17 .tapwrap { float:none !important; width:auto !important; margin:0 !important; } .floor_product17 ul li { display:inline-block; vertical-align:top; padding:0 15px; } .floor_product17 .info_wrap { overflow:inherit; } .floor_product17 .picture { margin-bottom:10px; } .floor_product17 a.button { text-align:center !important; } .floor_product18 .component_title{ width: 100% !important; } .floor_product18 .component_body{ display: none; } .floor_product18 .pictures{ display: block !important; } .floor_product18 .pagination .prev,.floor_product18 .pagination .next{ display: block; } /*4.团队*/ .floor_team6 { padding:0 5px; } .team6 li a { margin-left:5px !important; margin-right:5px !important; padding-left:10px !important; padding-right:10px !important; } .team6 li a .infoscontent { white-space:nowrap; } .team6 li a .infocontent { padding:0 !important; } .team6.picture-wrapper li a { margin:5px !important; padding:10px !important; } .team6.picture-wrapper li .infopicture img { max-width:60px; max-height:60px; } .team6.picture-wrapper li .infocontent { white-space: pre-wrap; display:-webkit-box;overflow:hidden;text-overflow:ellipsis;-webkit-line-clamp:2;-webkit-box-orient:vertical; } .floor_team6 .pagination { margin:20px 0 0; } .floor_team7 .content_main { margin:0 10px; } .floor_team7 .toggle_main { float:none; width:100% !important; max-width:none; overflow:hidden; } .floor_team7 .tabbar li { float:left; width:50%; padding:2% 3%; } .floor_team7 .tabbar .picture { max-width:60px; max-height:60px; } .floor_team7 .datalist { position:inherit; width:auto; margin:10px; } .floor_team7 .datalist li { } .floor_team7 .datalist .content_wrap { position:inherit; width:auto; height:auto; padding:5%; } .floor_team7 .datalist .picture { position:inherit; width:auto; height:auto; } .floor_team8 li { width: 100% !important; } .floor_team8 li a { margin: 5px !important; padding: 10px; box-sizing: border-box; } .floor_team8 li .infopicture { float: left; width: 30%; margin-right: 10px; } .floor_team8 li .infopicture .infocontent { display: none; } .team8 li .infowrap { overflow: hidden; } .team8 li .infowrap .subpicture { display: none; } .team8 li .infowrap .infotitle { padding: 0 !important; text-align: left !important; } .team8 li .infowrap { border: 0; padding:10px 0 0; } .team9 li .wrap{ border: none; } .floor_team9 .pagination span{ font-size:20px !important; width:50px !important; } /*5.图片*/ .thumb-picture0 .infoscontent{display: none;} .grid-picture0 li a { margin:5px !important; } .picture1 a.themargin2 { margin:1px; } .picture1 a.themargin5 { margin:2px; } .picture1 a.themargin10 { margin:5px; } .picture1 a.themargin20 { margin:8px; } .picture3 li { max-height:200px; } .floor_picture4 { padding:0; margin:0 10px; } .picture4 { padding-bottom:35px; } .picture4 li .infopicture img{ width: 100%; } .picture4 li .infopicture { float:none; width:100%; max-width:100%; margin:0; } .picture4 li .infotitle { line-height:26px; font-size:18px; margin-bottom:10px; padding-bottom: 10px; } .picture4 li .infoscontent { font-size:14px; line-height:1.8em; } .picture4 li .more { font-size:14px; line-height:36px; padding:0 30px; margin-top:10px; } .floor_picture5 { margin: 0; padding:0; box-sizing:border-box; } .picture5 li { width:300px !important; } .picture5 li .num { font-size:34px; } .picture5 li .infotitle { font-size:16px; } .picture5 li .infoscontent { font-size:13px; } .floor_picture8 .component_title { float:none !important; width:100%; height:auto !important; padding:0 15px; } .floor_picture8 .component_title p { margin-bottom:10px; } .floor_picture8 .component_body { float:none; width:100% !important; } .component .picture8 .col2{ width:320px; } .component .picture8 .col3{ width:300px; } .component .picture8 .col4{ width:260px; } .component .picture8 .col5{ width:220px; } .floor_picture9 .picture9 { padding:5px 5px 0; box-sizing:border-box; } .picture9 li { width:50%; padding:5px; } .picture9 li.n1 { float:none; width:100%; } .picture9 li.n1 .infowrap { height:40px; line-height:40px; } .picture9 li.n1 .infowrap .theicon { height:40px; line-height:40px; } .picture9 li.n1 .infowrap .infotitle { line-height:40px; } .picture9 .contact { float:none; width:100%; clear:both; } .picture10 { white-space: nowrap; overflow-x: auto; } .picture10 li { float: none; display: inline-block; width: 48% !important; vertical-align: top; } .picture10 li .infopicture:before { display: none !important; } .picture10 li .infopicture img { width: 100%; } .picture10 li .infotitle { text-align: center; } .picture11 { white-space: nowrap; overflow-x: auto; } .picture11 li { float: none; display: inline-block; width:65% !important; height:500px; vertical-align: top; } .picture11 li .infowrap{ padding:40px 15px 20px !important; bottom: 25px; } .picture11 li .infotitle { text-align: center; } .picture11 li .infoalbumlist{ display: none !important; } .picture11 li .infoscontent{ white-space: normal;} .floor_picture12 .component_title{ width: 100% !important; height: auto !important; padding:10px 18px 30px !important; } .floor_picture12 .component_body{ width:100% !important; } .floor_picture12 .pagination{ display: none; } .floor_picture12_main{ padding:20px 0 !important; } /*6.视频*/ .floor_video3 .thevideo { float:none !important; max-width:100%; width:100%; } .floor_video3 .thecontent { padding: 15px !important; } .floor_video4 .video4 li{ width:100%; } .floor_video4{ padding:0 !important; } .floor_video4 ul li .box{ margin: 0 !important;} /*7.基础*/ .floor_basic7 .swiper-container { padding:10px 0; } .floor_basic8 li{ width: 50% !important; } .floor_basic12 { margin:0 10px; padding:0; } .floor_basic12 .datalist { padding:0; } .floor_basic12 .datalist li { width:50% !important; margin:10px 0; } .floor_basic12 .datalist li span.title { font-size:36px; } .floor_basic13 .datalist { padding:5px; } .floor_basic13 .datalist li{ width:50% !important; margin:0; padding:5px !important; } .floor_basic22 .wrap .picture { max-width:60%; } .floor_basic24 .contentwrap{ position: static; background-color: transparent !important; } .floor_basic24 .wrap{ margin: 0 10px; width: auto; float: none !important; } .floor_basic24 .swiper-container{ display: none; } .floor_basic24 .description{ display: block; } .floor_basic27 .swiperitem { margin-top:15px; } .floor_basic27 .slide_wrap { margin:0 10px; } .floor_basic28 ul{ height: 720px; } .floor_basic28 li a{ display: block; } .floor_basic28 .picture{ float: none; margin: 15px auto 0; padding-left: 0; } .floor_basic28 .wrap{ display: block; float: none; padding: 15px; overflow: hidden; } .floor_basic28 .float_left,.floor_basic28 .float_right{ float: none; } .floor_basic30 li a, .floor_basic30 li .wrap{ max-width: 320px; } .floor_basic33 .float_left{ float: none; margin: 0 auto 10px; width: auto !important; } .floor_basic33 .title, .floor_basic33 .subtitle, .floor_basic33 .description{ padding: 0 10px; } .floor_basic33 li a{ padding: 10px !important; } .floor_basic33 .infopicture{ margin-right: 10px; } .floor_basic35 ul{ width: 500px; } .floor_basic39 .component_body { padding:10px; } .floor_basic39 .basicpicture { float:none !important; width:100% !important; margin:0 !important; max-width:100%; } .floor_basic39 ul { margin:0; } .floor_basic39 li { padding:0; } .floor_basic39 .picture { max-width:50px; } .floor_basic42 { margin:0 10px; } .floor_basic39 .basicpicture { max-width:none; width:100%; } .floor_basic42 .picture img { width:100%; min-width:100%; max-width:100%; display:block; } .floor_basic42 .content { width:100%; min-width:100%; max-width:100%; height:auto !important; position:initial; transform: translatey(0); } .floor_basic42 .content .wrap { padding:10px !important; } .floor_basic43 li { padding:10px !important; } .floor_basic44 { padding:5px; } .floor_basic44 li a { margin:5px !important; } .floor_basic44 li .wrap { padding:10px !important; } .floor_basic45 .picturewrap { float:none !important; width:100% !important; margin:0 !important; } .floor_basic45 .contentwrap { } .floor_basic45 .wrap li { padding:15px 0 5px 20px; } .floor_basic46 .toggle_main { float:none; width:100% !important; max-width:none; padding:0 10px; box-sizing:border-box; overflow:hidden; } .floor_basic46 .toggle_main li { float:left; width:49%; } .floor_basic46 .toggle_main li.m1 { float:right; } .floor_basic46 .toggle_main li.m1 .title { } .floor_basic46 .content_main .content_wrap { width:60%; padding-top:10px; } .floor_basic46 .content_main .description { margin:10px; } .floor_basic47 .component_title { float:none; margin:0 0 20px; width:100% !important; } .floor_basic47 .component_title p { margin:0; } .floor_basic47 .component_body { float:none; margin:0; padding:0 10px; width:100% !important; } .floor_basic47 .contentwrap { margin:0 10px 0 0; max-width:120px; } .floor_basic48 ul { margin:0 5px; } .floor_basic48 .wrap { padding: 0; } .floor_basic48 .wrap img { max-width: 50px; } .floor_basic48 .description { height: 0; } .floor_basic48 .button { height: 0; } .floor_basic48 li a:hover .button { height: auto; } .floor_basic48 .title { margin: 8px 0; } .floor_basic48 .button span { margin-top: 4px; } .basic49 li { width: 100% !important; } .basic49 .picture { margin-right: 10px; } .basic49 .wrap { padding: 0 !important; } .floor_basic50 { margin: 0; } .floor_basic50 .picture { position: inherit; width: auto; float: none; } .floor_basic50 .wrap { position: inherit; width: auto; align-items: none; } .floor_basic50 .wrap .wrap2 { padding: 5%; } .floor_basic50 .togglewrap { position: relative; width: 100%; } .floor_basic50 .togglewrap li { padding: 10px; } .floor_basic50 .togglewrap li .subpicture img { max-width: 50px; } .floor_basic51 { margin: 0 5px; } .floor_basic51 .swiper-container{ overflow: visible; padding-bottom: 10px; } .floor_basic51 .wrap { padding-left: 10px !important; padding-right: 10px !important; padding-top: 10px !important; margin: 5px !important; } .floor_basic51 .pagination { margin: 10px 0 0; } .floor_basic51 .pagination span { margin: 0 10px; font-size: 44px; } .floor_link2 .linklist li { max-width:50%; margin:0 !important; padding:5px !important; box-sizing:border-box; } /*8.发展历程组件*/ .floor_flow8 li { width:calc(50% - 10px); margin-top:-30%; } .floor_flow8 li.m1 { margin-top:-30%; } .floor_flow8 li .picture { float:none; } .floor_flow8 li .point_back { right:-21px; } .floor_flow8 li.m1 .point_back { left:-21px; } .floor_flow8 li .albumwrap_wrap { text-align:center; } .floor_flow8 li.m1 .albumwrap_wrap { text-align:center; } .other3_navigation>li { margin:0 0 0 15px !important; width:auto !important; } /*==========常见问题组件 开始==========*/ .floor_faq1 .swiperlist li{ width: 100% !important; } .floor_faq1 .tabbarlist{ display: flex; height: auto !important; float: none !important; justify-content: space-around; } .floor_faq1 .tabbarlist.style3 li{ flex: 1; } .floor_faq2 .swiperlist li{ width: 100% !important; } .floor_faq2 .tabbarlist{ display: flex; height: auto !important; float: none !important; justify-content: space-around; } .floor_faq2 .tabbarlist.style3 li{ flex: 1; } /*==========常见问题组件 结束==========*/ /*16.表格组件*/ .floor_table1 .table_wrap { min-width:699px; } /*服务流程19*/ .floor_step8 li { margin-bottom:30px; } .floor_step8 li.space { max-width:10px; } .floor_step8 li:after { height:30px; } .floor_step8 .description { padding:10px 0 0; } .floor_step9 li.space { max-width:10px; } /*优势*/ .floor_good1 li{ min-width: 50%; } .floor_good2 .component_title{ max-width: 100%; width: 100% !important; float: none !important; } .floor_good4 .component_body{ display: block; padding: 10px; } .floor_good4 .tpicture{ float: none; width: 100%; height: auto !important; max-height: 100%; margin: 0 0 15px; } .floor_good4 li.n2, .floor_good4 li.n3{ padding-left: 0; } .floor_good4 .description{ line-height: 1.5em !important; } .floor_good4 li{ margin-top: 15px; } .floor_good5 li{ width: auto; float: left !important; } .floor_good8_main{padding-top: 50px !important; padding-bottom: 50px !important;} .floor_good8 .bg_img{ object-fit:fill; height:100%; min-width:initial; display: block; } .floor_good8 li{ width:50% !important; border-right:1px solid rgba(255,255,255,.2) !important; border-bottom:1px solid rgba(255,255,255,.2);} .floor_good8 li:nth-child(2n 2){ border-right:none !important; } .floor_good8 li .title{ font-size: 30px !important; } .floor_good8 li .subtitle{ font-size:15px; line-height:1.2em !important; } /*页脚*/ .floor_foot1{ margin:0 10px; } .floor_foot1 .component_title{ float: none; width:100%; } .floor_foot1 .component_body{ float: none; width:100%; margin:15px 0; } .floor_foot1 .component_bottom{ float: none; width:100%; } .floor_foot1 .foot1_contact2_wrap { text-align:center; padding-bottom:0; } .floor_foot1 .foot1_contact2_wrap .telephone { padding-bottom:0; } .floor_foot1 .foot1_wechat { margin:0; } .floor_foot1 .foot1_navigation li{ margin-right:15px; width:auto; } .floor_foot1 .foot1_navigation li:last-child { margin-right:0; } .floor_foot1 .foot1_navigation li a{ font-size: 14px; } .floor_foot1 .foot1_navigation li .foot1_subnavigationlist{ display: none; } .floor_foot1 .ydsharebuttonbox { padding:0; } /*页脚组件2*/ .floor_foot2{ margin:0 10px; } .floor_foot2 .component_title{ float: none; width:100%; } .floor_foot2 .component_body{ float: none; width:100%; padding:10px 0 !important; margin:15px 0 !important; } .floor_foot2 .component_bottom{ float: none; width:100%; padding-top:0 !important; padding-left:0 !important; } .floor_foot2 .foot2_title { padding-bottom:5px; margin-bottom:5px; } .floor_foot2 .foot2_wechat { margin:0; } .floor_foot2 .component_body:before { width:100%; height:1px; } .floor_foot2 .component_body:after { width:100%; height:1px; bottom:0; left:0; top:auto; right:auto; } .floor_foot2 .foot2_contact_wrap { padding-bottom:0; } .floor_foot2 .foot2_navigation li { margin-right:15px; } .floor_foot2 .foot2_navigation li:last-child { margin-right:0; } .floor_foot2 .foot2_content { margin-top:10px; } /*页脚组件3*/ .floor_foot3{ padding:0 5px; } .floor_foot3 .component_title{ float: none; width:100%; padding:0; } .floor_foot3 .component_title img { float:left; padding:0 10px 0 0; } .floor_foot3 .component_body{ float: none; width:100%; padding:15px 0 !important; } .floor_foot3 .component_bottom{ float: none; width:100%; padding:0 !important; } .floor_foot3 .foot3_title { padding-bottom:5px; margin-bottom:5px; } .floor_foot3 .foot3_navigation li { margin:0 5px; } .floor_foot3 .foot3_navigation li a { padding-bottom:5px; margin-bottom:5px; } .floor_foot3 .foot3_wechat { float:left; width:100px; margin-right:20px; } /*页脚组件4*/ .floor_foot4{ margin:0 10px; } .floor_foot4 .component_title{ float: none; width:100%; } .floor_foot4 .component_body{ float: none; width:100%; } .floor_foot4 .component_bottom{ float: none; width:100%; } .floor_foot4 .foot4_navigation { padding:0; } .floor_foot4 .foot4_navigation li { line-height:20px; } .floor_foot4 .foot4_navigation li a { line-height:2em !important; } .floor_foot4 .extratext { position:static; } .floor_foot4 .extrapicture { position:static; } /*页脚组件5*/ .floor_foot5 { padding:0; } .floor_foot5 .component_title { padding:0 10px; } .floor_foot5 .component_body { padding:0 10px; } .floor_foot5 .component_bottom { padding:0 5px; } .floor_foot5 .foot5_contact_wrap { line-height:30px; } .floor_foot5 .foot5_contact_wrap p { display:block; margin:0; width:100%; text-align:left; } .floor_foot5 .foot5_contact_wrap p:first-child { width:100%; } .floor_foot5 .foot5_contact_wrap p span { margin:0 10px 0 0; } .floor_foot5 .foot5_navigation li { margin:0 5px; } /*页脚组件6*/ .floor_foot6 { padding:0; } .floor_foot6 .foot6_title { padding-bottom:4px; margin-bottom:4px; } .floor_foot6 .component_title{ float:none; width:100%; padding:0 10px 15px; } .floor_foot6 .component_title img { float:none; margin:0 auto !important; padding:0 0 10px 0; max-width:100%; } .floor_foot6 .foot6_contact_wrap { overflow:hidden; text-align:left; margin-top:10px; } .floor_foot6 .component_body{ float:none; width:100%; padding:0 5px 15px; } .floor_foot6 .component_body .foot6_title { padding:0 5px; } .floor_foot6 .foot6_navigation { overflow: hidden; text-align:left; } .floor_foot6 .foot6_navigation li { float:left; padding:0 5px; } .floor_foot6 .foot6_navigation li a { display: block; text-align:left; margin-bottom:5px; } .floor_foot6 .component_bottom{ float:none; width:100%; box-sizing:border-box; padding:0 10px; text-align:center; } .floor_foot6 .foot6_title { text-align:left; } .floor_foot6 .foot6_wechat { width:49%; margin:0; overflow:hidden; text-align:center; } .floor_foot6 .foot6_wechat img { display:block; max-width:120px; padding:0; margin:0 auto 5px; } /*页脚组件7*/ .floor_foot7 { padding:0; } .floor_foot7 .component_title { float:none; width:100% !important; margin:0; padding:0 10px; box-sizing:border-box; } .floor_foot7 .component_title img { width:auto; margin:0 auto; } .floor_foot7 .component_body { float:none; width:100% !important; margin:0; padding:20px 10px 20px 0; box-sizing:border-box; } .floor_foot7 .foot7_navigation { display:block; } .floor_foot7 .foot7_navigation>li { float:left; margin-left:10px; } .floor_foot7 .foot7_navigation>li>a { line-height:2em !important; } .floor_foot7 .foot3_subnavigationlist { display:none; } .floor_foot7 .component_bottom { float:none; width:100% !important; margin:0; padding:0 10px; box-sizing:border-box; text-align: center; } .floor_foot7 .foot7_link select { width: auto; min-width: 200px; margin: 0 auto 10px; } .floor_foot7 .foot7_wechat { width:120px; } .floor_child6_main li { text-align:left; } .floor_foot8 .logo_wrap .logo{ width:100%; float:none; text-align: center; } .floor_foot8 .logo_wrap .logo img{ height:50px !important; } .floor_foot8 .logo_wrap .logotext{ width:100%; float:none; text-align: center; padding:0 10px; line-height: 1.3em !important; box-sizing: border-box; overflow: hidden; padding-top: 10px; font-size: 18px !important; } /*内页组件*/ .content_title h2,.infotitle h1 { font-size:24px; } .floor_channel>.component_title{ display: none; } .floor_channel>.component_body>.content_title h2{ margin-bottom: 10px; } .floor_channel>.component_body{ padding: 10px 5px; } .floor_channel3>.component_body, .floor_channel9>.component_body, .floor_channel10>.component_body, .floor_channel11>.component_body, .floor_channel12>.component_body{ padding:5px; } /*内页组件1*/ .floor_channel1{ padding: 0 10px; } .floor_channel1>ul{ white-space: nowrap; overflow-x:auto; overflow-y: hidden; } .floor_channel1 ul li a.depth2 { font-size:14px; } .thumb-downloadlist li { width:100% !important; } .grid-downloadlist .infowrap p { margin-bottom:30px; } .grid-downloadlist .btn { right:16px; bottom:16px; } /* 内页组件2319 */ .channellist19 li a{display: block;} .channellist19 li .content_box{width: 100% !important;} .channellist19 li .content_box{margin-right: 0;} .channellist19 li:nth-child(even) .content_box{margin-left: 0;} .channellist19 li .image_box{width: 100% !important;} .content_box .title{line-height: unset !important;} .content_box .title::after{margin-left: 30%;} /* 内页组件2318 */ .article18 li{width: 100% !important; height: auto !important; margin-left: 0 !important; margin-right: 0 !important;} .article18 li .infopicture{height: auto !important; margin-left: 0 !important; margin-right: 0 !important;} .article18 li.second .infopicture, .article18 li.third .infopicture{min-width: 35%;} .article18 li.second .infowrap{width: auto; float: none;} .article18 .infowrap{padding: 10px !important;} .article18 .infotitle, .article18 .infotime, .article18 .infoscontent{padding-left: 0; padding-right: 0;} .article18 .infoscontent{overflow: hidden; display: -webkit-box; text-overflow: ellipsis; -webkit-box-orient: vertical; -webkit-line-clamp: 2;} .article18 li.second .infoscontent, .article18 li.third .infoscontent{display: none !important; } /* 内页组件2320 */ .list20{display: block;} .list20 li{flex-direction: column; width: 100%; margin: 15px 0 !important;} .list20 li .infowrap{width: 100% !important;} .list20 li .infopicture{width: 100% !important; border-bottom-left-radius: 0 !important; border-bottom-right-radius: 0 !important;} .list20 li .infowrap{border-top-left-radius: 0 !important; border-top-right-radius: 0 !important; position: relative; right: 0; top: 0; transform: translatey(0); padding: 15px 15px 30px 15px !important; height: auto !important;} .list20 li .infowrap .infoscontent{display: block;} .list20 li .infowrap .infomore{height: 36px; line-height: 36px; width: 124px !important;} /* 内页组件2321 */ .list21 li{flex-direction: column;} .list21 li .infopicture{width: 100% !important;} .list21 li .infowrap{width: 100%; padding: 20px 0 0 0 !important;} .list21 li .infoscontent{ height:auto !important;} .list21 li .ydinfotime{display: block;color: #888; margin-top: 5px;} .list21 li .infotime{display: none;} .list21 li .infowrap .infomore{margin-top: 10px; height: 36px; line-height: 36px; width: 124px !important;} /*详情页组件1*/ .floor_detail>.component_title{ display: none; } .floor_detail>.component_body>.content_title h2{ margin-bottom: 10px; } .floor_detail>.component_body{ padding: 10px; } /*详情页组件2*/ .floor_detail2 .info_product_detail_wrap{ padding: 0 10px; } .floor_detail2 .product_swiper{ max-width: 100%; float: none; padding: 0; } .floor_detail2 .product_swiper .swiper-next, .floor_detail2 .product_swiper .swiper-prev{ display: none; } .floor_detail2 .detail_table{ padding: 15px 0; } .floor_detail2 .infocontent_main{ padding: 0; } .floor_detail2 .infocontent{ padding: 0 10px; } /*详情页组件6*/ .text-detail6 a{ padding: 10px 0; } .text-detail6 a .infowrap{ display: flex; } .text-detail6 a .infotitle{ flex: 1; margin-right: 10px; } .grid-detail6 li .infotitle{ line-height: 1.6em; height: 3.2em; white-space: normal; display:-webkit-box;overflow:hidden;text-overflow:ellipsis;-webkit-line-clamp:2;-webkit-box-orient:vertical; } .grid-detail6 li .infoscontent{ display: none; } .thumb-detail6 .infoscontent{ display: none; } .thumbright-detail6 .infoscontent{ display: none; } } /*==========@@媒体查询 结束@@==========*/ /*animate.css 压缩动画 开始*/ @charset "utf-8";/*! * animate.css - https://animate.style/ * version - 4.1.1 * licensed under the mit license - http://opensource.org/licenses/mit * * copyright (c) 2020 animate.css */:root{--animate-duration:1s;--animate-delay:1s;--animate-repeat:1}.animate__animated{-webkit-animation-duration:1s;animation-duration:1s;-webkit-animation-duration:var(--animate-duration);animation-duration:var(--animate-duration);-webkit-animation-fill-mode:both;animation-fill-mode:both}.animate__animated.animate__infinite{-webkit-animation-iteration-count:infinite;animation-iteration-count:infinite}.animate__animated.animate__repeat-1{-webkit-animation-iteration-count:1;animation-iteration-count:1;-webkit-animation-iteration-count:var(--animate-repeat);animation-iteration-count:var(--animate-repeat)}.animate__animated.animate__repeat-2{-webkit-animation-iteration-count:2;animation-iteration-count:2;-webkit-animation-iteration-count:calc(var(--animate-repeat)*2);animation-iteration-count:calc(var(--animate-repeat)*2)}.animate__animated.animate__repeat-3{-webkit-animation-iteration-count:3;animation-iteration-count:3;-webkit-animation-iteration-count:calc(var(--animate-repeat)*3);animation-iteration-count:calc(var(--animate-repeat)*3)}.animate__animated.animate__delay-1s{-webkit-animation-delay:1s;animation-delay:1s;-webkit-animation-delay:var(--animate-delay);animation-delay:var(--animate-delay)}.animate__animated.animate__delay-2s{-webkit-animation-delay:2s;animation-delay:2s;-webkit-animation-delay:calc(var(--animate-delay)*2);animation-delay:calc(var(--animate-delay)*2)}.animate__animated.animate__delay-3s{-webkit-animation-delay:3s;animation-delay:3s;-webkit-animation-delay:calc(var(--animate-delay)*3);animation-delay:calc(var(--animate-delay)*3)}.animate__animated.animate__delay-4s{-webkit-animation-delay:4s;animation-delay:4s;-webkit-animation-delay:calc(var(--animate-delay)*4);animation-delay:calc(var(--animate-delay)*4)}.animate__animated.animate__delay-5s{-webkit-animation-delay:5s;animation-delay:5s;-webkit-animation-delay:calc(var(--animate-delay)*5);animation-delay:calc(var(--animate-delay)*5)}.animate__animated.animate__faster{-webkit-animation-duration:.5s;animation-duration:.5s;-webkit-animation-duration:calc(var(--animate-duration)/2);animation-duration:calc(var(--animate-duration)/2)}.animate__animated.animate__fast{-webkit-animation-duration:.8s;animation-duration:.8s;-webkit-animation-duration:calc(var(--animate-duration)*0.8);animation-duration:calc(var(--animate-duration)*0.8)}.animate__animated.animate__slow{-webkit-animation-duration:2s;animation-duration:2s;-webkit-animation-duration:calc(var(--animate-duration)*2);animation-duration:calc(var(--animate-duration)*2)}.animate__animated.animate__slower{-webkit-animation-duration:3s;animation-duration:3s;-webkit-animation-duration:calc(var(--animate-duration)*3);animation-duration:calc(var(--animate-duration)*3)}@media (prefers-reduced-motion:reduce),print{.animate__animated{-webkit-animation-duration:1ms!important;animation-duration:1ms!important;-webkit-transition-duration:1ms!important;transition-duration:1ms!important;-webkit-animation-iteration-count:1!important;animation-iteration-count:1!important}.animate__animated[class*=out]{opacity:0}}@-webkit-keyframes bounce{0%,20%,53%,to{-webkit-animation-timing-function:cubic-bezier(.215,.61,.355,1);animation-timing-function:cubic-bezier(.215,.61,.355,1);-webkit-transform:translatez(0);transform:translatez(0)}40%,43%{-webkit-animation-timing-function:cubic-bezier(.755,.05,.855,.06);animation-timing-function:cubic-bezier(.755,.05,.855,.06);-webkit-transform:translate3d(0,-30px,0) scaley(1.1);transform:translate3d(0,-30px,0) scaley(1.1)}70%{-webkit-animation-timing-function:cubic-bezier(.755,.05,.855,.06);animation-timing-function:cubic-bezier(.755,.05,.855,.06);-webkit-transform:translate3d(0,-15px,0) scaley(1.05);transform:translate3d(0,-15px,0) scaley(1.05)}80%{-webkit-transition-timing-function:cubic-bezier(.215,.61,.355,1);transition-timing-function:cubic-bezier(.215,.61,.355,1);-webkit-transform:translatez(0) scaley(.95);transform:translatez(0) scaley(.95)}90%{-webkit-transform:translate3d(0,-4px,0) scaley(1.02);transform:translate3d(0,-4px,0) scaley(1.02)}}@keyframes bounce{0%,20%,53%,to{-webkit-animation-timing-function:cubic-bezier(.215,.61,.355,1);animation-timing-function:cubic-bezier(.215,.61,.355,1);-webkit-transform:translatez(0);transform:translatez(0)}40%,43%{-webkit-animation-timing-function:cubic-bezier(.755,.05,.855,.06);animation-timing-function:cubic-bezier(.755,.05,.855,.06);-webkit-transform:translate3d(0,-30px,0) scaley(1.1);transform:translate3d(0,-30px,0) scaley(1.1)}70%{-webkit-animation-timing-function:cubic-bezier(.755,.05,.855,.06);animation-timing-function:cubic-bezier(.755,.05,.855,.06);-webkit-transform:translate3d(0,-15px,0) scaley(1.05);transform:translate3d(0,-15px,0) scaley(1.05)}80%{-webkit-transition-timing-function:cubic-bezier(.215,.61,.355,1);transition-timing-function:cubic-bezier(.215,.61,.355,1);-webkit-transform:translatez(0) scaley(.95);transform:translatez(0) scaley(.95)}90%{-webkit-transform:translate3d(0,-4px,0) scaley(1.02);transform:translate3d(0,-4px,0) scaley(1.02)}}.animate__bounce{-webkit-animation-name:bounce;animation-name:bounce;-webkit-transform-origin:center bottom;transform-origin:center bottom}@-webkit-keyframes flash{0%,50%,to{opacity:1}25%,75%{opacity:0}}@keyframes flash{0%,50%,to{opacity:1}25%,75%{opacity:0}}.animate__flash{-webkit-animation-name:flash;animation-name:flash}@-webkit-keyframes pulse{0%{-webkit-transform:scalex(1);transform:scalex(1)}50%{-webkit-transform:scale3d(1.05,1.05,1.05);transform:scale3d(1.05,1.05,1.05)}to{-webkit-transform:scalex(1);transform:scalex(1)}}@keyframes pulse{0%{-webkit-transform:scalex(1);transform:scalex(1)}50%{-webkit-transform:scale3d(1.05,1.05,1.05);transform:scale3d(1.05,1.05,1.05)}to{-webkit-transform:scalex(1);transform:scalex(1)}}.animate__pulse{-webkit-animation-name:pulse;animation-name:pulse;-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out}@-webkit-keyframes rubberband{0%{-webkit-transform:scalex(1);transform:scalex(1)}30%{-webkit-transform:scale3d(1.25,.75,1);transform:scale3d(1.25,.75,1)}40%{-webkit-transform:scale3d(.75,1.25,1);transform:scale3d(.75,1.25,1)}50%{-webkit-transform:scale3d(1.15,.85,1);transform:scale3d(1.15,.85,1)}65%{-webkit-transform:scale3d(.95,1.05,1);transform:scale3d(.95,1.05,1)}75%{-webkit-transform:scale3d(1.05,.95,1);transform:scale3d(1.05,.95,1)}to{-webkit-transform:scalex(1);transform:scalex(1)}}@keyframes rubberband{0%{-webkit-transform:scalex(1);transform:scalex(1)}30%{-webkit-transform:scale3d(1.25,.75,1);transform:scale3d(1.25,.75,1)}40%{-webkit-transform:scale3d(.75,1.25,1);transform:scale3d(.75,1.25,1)}50%{-webkit-transform:scale3d(1.15,.85,1);transform:scale3d(1.15,.85,1)}65%{-webkit-transform:scale3d(.95,1.05,1);transform:scale3d(.95,1.05,1)}75%{-webkit-transform:scale3d(1.05,.95,1);transform:scale3d(1.05,.95,1)}to{-webkit-transform:scalex(1);transform:scalex(1)}}.animate__rubberband{-webkit-animation-name:rubberband;animation-name:rubberband}@-webkit-keyframes shakex{0%,to{-webkit-transform:translatez(0);transform:translatez(0)}10%,30%,50%,70%,90%{-webkit-transform:translate3d(-10px,0,0);transform:translate3d(-10px,0,0)}20%,40%,60%,80%{-webkit-transform:translate3d(10px,0,0);transform:translate3d(10px,0,0)}}@keyframes shakex{0%,to{-webkit-transform:translatez(0);transform:translatez(0)}10%,30%,50%,70%,90%{-webkit-transform:translate3d(-10px,0,0);transform:translate3d(-10px,0,0)}20%,40%,60%,80%{-webkit-transform:translate3d(10px,0,0);transform:translate3d(10px,0,0)}}.animate__shakex{-webkit-animation-name:shakex;animation-name:shakex}@-webkit-keyframes shakey{0%,to{-webkit-transform:translatez(0);transform:translatez(0)}10%,30%,50%,70%,90%{-webkit-transform:translate3d(0,-10px,0);transform:translate3d(0,-10px,0)}20%,40%,60%,80%{-webkit-transform:translate3d(0,10px,0);transform:translate3d(0,10px,0)}}@keyframes shakey{0%,to{-webkit-transform:translatez(0);transform:translatez(0)}10%,30%,50%,70%,90%{-webkit-transform:translate3d(0,-10px,0);transform:translate3d(0,-10px,0)}20%,40%,60%,80%{-webkit-transform:translate3d(0,10px,0);transform:translate3d(0,10px,0)}}.animate__shakey{-webkit-animation-name:shakey;animation-name:shakey}@-webkit-keyframes headshake{0%{-webkit-transform:translatex(0);transform:translatex(0)}6.5%{-webkit-transform:translatex(-6px) rotatey(-9deg);transform:translatex(-6px) rotatey(-9deg)}18.5%{-webkit-transform:translatex(5px) rotatey(7deg);transform:translatex(5px) rotatey(7deg)}31.5%{-webkit-transform:translatex(-3px) rotatey(-5deg);transform:translatex(-3px) rotatey(-5deg)}43.5%{-webkit-transform:translatex(2px) rotatey(3deg);transform:translatex(2px) rotatey(3deg)}50%{-webkit-transform:translatex(0);transform:translatex(0)}}@keyframes headshake{0%{-webkit-transform:translatex(0);transform:translatex(0)}6.5%{-webkit-transform:translatex(-6px) rotatey(-9deg);transform:translatex(-6px) rotatey(-9deg)}18.5%{-webkit-transform:translatex(5px) rotatey(7deg);transform:translatex(5px) rotatey(7deg)}31.5%{-webkit-transform:translatex(-3px) rotatey(-5deg);transform:translatex(-3px) rotatey(-5deg)}43.5%{-webkit-transform:translatex(2px) rotatey(3deg);transform:translatex(2px) rotatey(3deg)}50%{-webkit-transform:translatex(0);transform:translatex(0)}}.animate__headshake{-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out;-webkit-animation-name:headshake;animation-name:headshake}@-webkit-keyframes swing{20%{-webkit-transform:rotate(15deg);transform:rotate(15deg)}40%{-webkit-transform:rotate(-10deg);transform:rotate(-10deg)}60%{-webkit-transform:rotate(5deg);transform:rotate(5deg)}80%{-webkit-transform:rotate(-5deg);transform:rotate(-5deg)}to{-webkit-transform:rotate(0deg);transform:rotate(0deg)}}@keyframes swing{20%{-webkit-transform:rotate(15deg);transform:rotate(15deg)}40%{-webkit-transform:rotate(-10deg);transform:rotate(-10deg)}60%{-webkit-transform:rotate(5deg);transform:rotate(5deg)}80%{-webkit-transform:rotate(-5deg);transform:rotate(-5deg)}to{-webkit-transform:rotate(0deg);transform:rotate(0deg)}}.animate__swing{-webkit-transform-origin:top center;transform-origin:top center;-webkit-animation-name:swing;animation-name:swing}@-webkit-keyframes tada{0%{-webkit-transform:scalex(1);transform:scalex(1)}10%,20%{-webkit-transform:scale3d(.9,.9,.9) rotate(-3deg);transform:scale3d(.9,.9,.9) rotate(-3deg)}30%,50%,70%,90%{-webkit-transform:scale3d(1.1,1.1,1.1) rotate(3deg);transform:scale3d(1.1,1.1,1.1) rotate(3deg)}40%,60%,80%{-webkit-transform:scale3d(1.1,1.1,1.1) rotate(-3deg);transform:scale3d(1.1,1.1,1.1) rotate(-3deg)}to{-webkit-transform:scalex(1);transform:scalex(1)}}@keyframes tada{0%{-webkit-transform:scalex(1);transform:scalex(1)}10%,20%{-webkit-transform:scale3d(.9,.9,.9) rotate(-3deg);transform:scale3d(.9,.9,.9) rotate(-3deg)}30%,50%,70%,90%{-webkit-transform:scale3d(1.1,1.1,1.1) rotate(3deg);transform:scale3d(1.1,1.1,1.1) rotate(3deg)}40%,60%,80%{-webkit-transform:scale3d(1.1,1.1,1.1) rotate(-3deg);transform:scale3d(1.1,1.1,1.1) rotate(-3deg)}to{-webkit-transform:scalex(1);transform:scalex(1)}}.animate__tada{-webkit-animation-name:tada;animation-name:tada}@-webkit-keyframes wobble{0%{-webkit-transform:translatez(0);transform:translatez(0)}15%{-webkit-transform:translate3d(-25%,0,0) rotate(-5deg);transform:translate3d(-25%,0,0) rotate(-5deg)}30%{-webkit-transform:translate3d(20%,0,0) rotate(3deg);transform:translate3d(20%,0,0) rotate(3deg)}45%{-webkit-transform:translate3d(-15%,0,0) rotate(-3deg);transform:translate3d(-15%,0,0) rotate(-3deg)}60%{-webkit-transform:translate3d(10%,0,0) rotate(2deg);transform:translate3d(10%,0,0) rotate(2deg)}75%{-webkit-transform:translate3d(-5%,0,0) rotate(-1deg);transform:translate3d(-5%,0,0) rotate(-1deg)}to{-webkit-transform:translatez(0);transform:translatez(0)}}@keyframes wobble{0%{-webkit-transform:translatez(0);transform:translatez(0)}15%{-webkit-transform:translate3d(-25%,0,0) rotate(-5deg);transform:translate3d(-25%,0,0) rotate(-5deg)}30%{-webkit-transform:translate3d(20%,0,0) rotate(3deg);transform:translate3d(20%,0,0) rotate(3deg)}45%{-webkit-transform:translate3d(-15%,0,0) rotate(-3deg);transform:translate3d(-15%,0,0) rotate(-3deg)}60%{-webkit-transform:translate3d(10%,0,0) rotate(2deg);transform:translate3d(10%,0,0) rotate(2deg)}75%{-webkit-transform:translate3d(-5%,0,0) rotate(-1deg);transform:translate3d(-5%,0,0) rotate(-1deg)}to{-webkit-transform:translatez(0);transform:translatez(0)}}.animate__wobble{-webkit-animation-name:wobble;animation-name:wobble}@-webkit-keyframes jello{0%,11.1%,to{-webkit-transform:translatez(0);transform:translatez(0)}22.2%{-webkit-transform:skewx(-12.5deg) skewy(-12.5deg);transform:skewx(-12.5deg) skewy(-12.5deg)}33.3%{-webkit-transform:skewx(6.25deg) skewy(6.25deg);transform:skewx(6.25deg) skewy(6.25deg)}44.4%{-webkit-transform:skewx(-3.125deg) skewy(-3.125deg);transform:skewx(-3.125deg) skewy(-3.125deg)}55.5%{-webkit-transform:skewx(1.5625deg) skewy(1.5625deg);transform:skewx(1.5625deg) skewy(1.5625deg)}66.6%{-webkit-transform:skewx(-.78125deg) skewy(-.78125deg);transform:skewx(-.78125deg) skewy(-.78125deg)}77.7%{-webkit-transform:skewx(.390625deg) skewy(.390625deg);transform:skewx(.390625deg) skewy(.390625deg)}88.8%{-webkit-transform:skewx(-.1953125deg) skewy(-.1953125deg);transform:skewx(-.1953125deg) skewy(-.1953125deg)}}@keyframes jello{0%,11.1%,to{-webkit-transform:translatez(0);transform:translatez(0)}22.2%{-webkit-transform:skewx(-12.5deg) skewy(-12.5deg);transform:skewx(-12.5deg) skewy(-12.5deg)}33.3%{-webkit-transform:skewx(6.25deg) skewy(6.25deg);transform:skewx(6.25deg) skewy(6.25deg)}44.4%{-webkit-transform:skewx(-3.125deg) skewy(-3.125deg);transform:skewx(-3.125deg) skewy(-3.125deg)}55.5%{-webkit-transform:skewx(1.5625deg) skewy(1.5625deg);transform:skewx(1.5625deg) skewy(1.5625deg)}66.6%{-webkit-transform:skewx(-.78125deg) skewy(-.78125deg);transform:skewx(-.78125deg) skewy(-.78125deg)}77.7%{-webkit-transform:skewx(.390625deg) skewy(.390625deg);transform:skewx(.390625deg) skewy(.390625deg)}88.8%{-webkit-transform:skewx(-.1953125deg) skewy(-.1953125deg);transform:skewx(-.1953125deg) skewy(-.1953125deg)}}.animate__jello{-webkit-animation-name:jello;animation-name:jello;-webkit-transform-origin:center;transform-origin:center}@-webkit-keyframes heartbeat{0%{-webkit-transform:scale(1);transform:scale(1)}14%{-webkit-transform:scale(1.3);transform:scale(1.3)}28%{-webkit-transform:scale(1);transform:scale(1)}42%{-webkit-transform:scale(1.3);transform:scale(1.3)}70%{-webkit-transform:scale(1);transform:scale(1)}}@keyframes heartbeat{0%{-webkit-transform:scale(1);transform:scale(1)}14%{-webkit-transform:scale(1.3);transform:scale(1.3)}28%{-webkit-transform:scale(1);transform:scale(1)}42%{-webkit-transform:scale(1.3);transform:scale(1.3)}70%{-webkit-transform:scale(1);transform:scale(1)}}.animate__heartbeat{-webkit-animation-name:heartbeat;animation-name:heartbeat;-webkit-animation-duration:1.3s;animation-duration:1.3s;-webkit-animation-duration:calc(var(--animate-duration)*1.3);animation-duration:calc(var(--animate-duration)*1.3);-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out}@-webkit-keyframes backindown{0%{-webkit-transform:translatey(-1200px) scale(.7);transform:translatey(-1200px) scale(.7);opacity:.7}80%{-webkit-transform:translatey(0) scale(.7);transform:translatey(0) scale(.7);opacity:.7}to{-webkit-transform:scale(1);transform:scale(1);opacity:1}}@keyframes backindown{0%{-webkit-transform:translatey(-1200px) scale(.7);transform:translatey(-1200px) scale(.7);opacity:.7}80%{-webkit-transform:translatey(0) scale(.7);transform:translatey(0) scale(.7);opacity:.7}to{-webkit-transform:scale(1);transform:scale(1);opacity:1}}.animate__backindown{-webkit-animation-name:backindown;animation-name:backindown}@-webkit-keyframes backinleft{0%{-webkit-transform:translatex(-2000px) scale(.7);transform:translatex(-2000px) scale(.7);opacity:.7}80%{-webkit-transform:translatex(0) scale(.7);transform:translatex(0) scale(.7);opacity:.7}to{-webkit-transform:scale(1);transform:scale(1);opacity:1}}@keyframes backinleft{0%{-webkit-transform:translatex(-2000px) scale(.7);transform:translatex(-2000px) scale(.7);opacity:.7}80%{-webkit-transform:translatex(0) scale(.7);transform:translatex(0) scale(.7);opacity:.7}to{-webkit-transform:scale(1);transform:scale(1);opacity:1}}.animate__backinleft{-webkit-animation-name:backinleft;animation-name:backinleft}@-webkit-keyframes backinright{0%{-webkit-transform:translatex(2000px) scale(.7);transform:translatex(2000px) scale(.7);opacity:.7}80%{-webkit-transform:translatex(0) scale(.7);transform:translatex(0) scale(.7);opacity:.7}to{-webkit-transform:scale(1);transform:scale(1);opacity:1}}@keyframes backinright{0%{-webkit-transform:translatex(2000px) scale(.7);transform:translatex(2000px) scale(.7);opacity:.7}80%{-webkit-transform:translatex(0) scale(.7);transform:translatex(0) scale(.7);opacity:.7}to{-webkit-transform:scale(1);transform:scale(1);opacity:1}}.animate__backinright{-webkit-animation-name:backinright;animation-name:backinright}@-webkit-keyframes backinup{0%{-webkit-transform:translatey(1200px) scale(.7);transform:translatey(1200px) scale(.7);opacity:.7}80%{-webkit-transform:translatey(0) scale(.7);transform:translatey(0) scale(.7);opacity:.7}to{-webkit-transform:scale(1);transform:scale(1);opacity:1}}@keyframes backinup{0%{-webkit-transform:translatey(1200px) scale(.7);transform:translatey(1200px) scale(.7);opacity:.7}80%{-webkit-transform:translatey(0) scale(.7);transform:translatey(0) scale(.7);opacity:.7}to{-webkit-transform:scale(1);transform:scale(1);opacity:1}}.animate__backinup{-webkit-animation-name:backinup;animation-name:backinup}@-webkit-keyframes backoutdown{0%{-webkit-transform:scale(1);transform:scale(1);opacity:1}20%{-webkit-transform:translatey(0) scale(.7);transform:translatey(0) scale(.7);opacity:.7}to{-webkit-transform:translatey(700px) scale(.7);transform:translatey(700px) scale(.7);opacity:.7}}@keyframes backoutdown{0%{-webkit-transform:scale(1);transform:scale(1);opacity:1}20%{-webkit-transform:translatey(0) scale(.7);transform:translatey(0) scale(.7);opacity:.7}to{-webkit-transform:translatey(700px) scale(.7);transform:translatey(700px) scale(.7);opacity:.7}}.animate__backoutdown{-webkit-animation-name:backoutdown;animation-name:backoutdown}@-webkit-keyframes backoutleft{0%{-webkit-transform:scale(1);transform:scale(1);opacity:1}20%{-webkit-transform:translatex(0) scale(.7);transform:translatex(0) scale(.7);opacity:.7}to{-webkit-transform:translatex(-2000px) scale(.7);transform:translatex(-2000px) scale(.7);opacity:.7}}@keyframes backoutleft{0%{-webkit-transform:scale(1);transform:scale(1);opacity:1}20%{-webkit-transform:translatex(0) scale(.7);transform:translatex(0) scale(.7);opacity:.7}to{-webkit-transform:translatex(-2000px) scale(.7);transform:translatex(-2000px) scale(.7);opacity:.7}}.animate__backoutleft{-webkit-animation-name:backoutleft;animation-name:backoutleft}@-webkit-keyframes backoutright{0%{-webkit-transform:scale(1);transform:scale(1);opacity:1}20%{-webkit-transform:translatex(0) scale(.7);transform:translatex(0) scale(.7);opacity:.7}to{-webkit-transform:translatex(2000px) scale(.7);transform:translatex(2000px) scale(.7);opacity:.7}}@keyframes backoutright{0%{-webkit-transform:scale(1);transform:scale(1);opacity:1}20%{-webkit-transform:translatex(0) scale(.7);transform:translatex(0) scale(.7);opacity:.7}to{-webkit-transform:translatex(2000px) scale(.7);transform:translatex(2000px) scale(.7);opacity:.7}}.animate__backoutright{-webkit-animation-name:backoutright;animation-name:backoutright}@-webkit-keyframes backoutup{0%{-webkit-transform:scale(1);transform:scale(1);opacity:1}20%{-webkit-transform:translatey(0) scale(.7);transform:translatey(0) scale(.7);opacity:.7}to{-webkit-transform:translatey(-700px) scale(.7);transform:translatey(-700px) scale(.7);opacity:.7}}@keyframes backoutup{0%{-webkit-transform:scale(1);transform:scale(1);opacity:1}20%{-webkit-transform:translatey(0) scale(.7);transform:translatey(0) scale(.7);opacity:.7}to{-webkit-transform:translatey(-700px) scale(.7);transform:translatey(-700px) scale(.7);opacity:.7}}.animate__backoutup{-webkit-animation-name:backoutup;animation-name:backoutup}@-webkit-keyframes bouncein{0%,20%,40%,60%,80%,to{-webkit-animation-timing-function:cubic-bezier(.215,.61,.355,1);animation-timing-function:cubic-bezier(.215,.61,.355,1)}0%{opacity:0;-webkit-transform:scale3d(.3,.3,.3);transform:scale3d(.3,.3,.3)}20%{-webkit-transform:scale3d(1.1,1.1,1.1);transform:scale3d(1.1,1.1,1.1)}40%{-webkit-transform:scale3d(.9,.9,.9);transform:scale3d(.9,.9,.9)}60%{opacity:1;-webkit-transform:scale3d(1.03,1.03,1.03);transform:scale3d(1.03,1.03,1.03)}80%{-webkit-transform:scale3d(.97,.97,.97);transform:scale3d(.97,.97,.97)}to{opacity:1;-webkit-transform:scalex(1);transform:scalex(1)}}@keyframes bouncein{0%,20%,40%,60%,80%,to{-webkit-animation-timing-function:cubic-bezier(.215,.61,.355,1);animation-timing-function:cubic-bezier(.215,.61,.355,1)}0%{opacity:0;-webkit-transform:scale3d(.3,.3,.3);transform:scale3d(.3,.3,.3)}20%{-webkit-transform:scale3d(1.1,1.1,1.1);transform:scale3d(1.1,1.1,1.1)}40%{-webkit-transform:scale3d(.9,.9,.9);transform:scale3d(.9,.9,.9)}60%{opacity:1;-webkit-transform:scale3d(1.03,1.03,1.03);transform:scale3d(1.03,1.03,1.03)}80%{-webkit-transform:scale3d(.97,.97,.97);transform:scale3d(.97,.97,.97)}to{opacity:1;-webkit-transform:scalex(1);transform:scalex(1)}}.animate__bouncein{-webkit-animation-duration:.75s;animation-duration:.75s;-webkit-animation-duration:calc(var(--animate-duration)*0.75);animation-duration:calc(var(--animate-duration)*0.75);-webkit-animation-name:bouncein;animation-name:bouncein}@-webkit-keyframes bounceindown{0%,60%,75%,90%,to{-webkit-animation-timing-function:cubic-bezier(.215,.61,.355,1);animation-timing-function:cubic-bezier(.215,.61,.355,1)}0%{opacity:0;-webkit-transform:translate3d(0,-3000px,0) scaley(3);transform:translate3d(0,-3000px,0) scaley(3)}60%{opacity:1;-webkit-transform:translate3d(0,25px,0) scaley(.9);transform:translate3d(0,25px,0) scaley(.9)}75%{-webkit-transform:translate3d(0,-10px,0) scaley(.95);transform:translate3d(0,-10px,0) scaley(.95)}90%{-webkit-transform:translate3d(0,5px,0) scaley(.985);transform:translate3d(0,5px,0) scaley(.985)}to{-webkit-transform:translatez(0);transform:translatez(0)}}@keyframes bounceindown{0%,60%,75%,90%,to{-webkit-animation-timing-function:cubic-bezier(.215,.61,.355,1);animation-timing-function:cubic-bezier(.215,.61,.355,1)}0%{opacity:0;-webkit-transform:translate3d(0,-3000px,0) scaley(3);transform:translate3d(0,-3000px,0) scaley(3)}60%{opacity:1;-webkit-transform:translate3d(0,25px,0) scaley(.9);transform:translate3d(0,25px,0) scaley(.9)}75%{-webkit-transform:translate3d(0,-10px,0) scaley(.95);transform:translate3d(0,-10px,0) scaley(.95)}90%{-webkit-transform:translate3d(0,5px,0) scaley(.985);transform:translate3d(0,5px,0) scaley(.985)}to{-webkit-transform:translatez(0);transform:translatez(0)}}.animate__bounceindown{-webkit-animation-name:bounceindown;animation-name:bounceindown}@-webkit-keyframes bounceinleft{0%,60%,75%,90%,to{-webkit-animation-timing-function:cubic-bezier(.215,.61,.355,1);animation-timing-function:cubic-bezier(.215,.61,.355,1)}0%{opacity:0;-webkit-transform:translate3d(-3000px,0,0) scalex(3);transform:translate3d(-3000px,0,0) scalex(3)}60%{opacity:1;-webkit-transform:translate3d(25px,0,0) scalex(1);transform:translate3d(25px,0,0) scalex(1)}75%{-webkit-transform:translate3d(-10px,0,0) scalex(.98);transform:translate3d(-10px,0,0) scalex(.98)}90%{-webkit-transform:translate3d(5px,0,0) scalex(.995);transform:translate3d(5px,0,0) scalex(.995)}to{-webkit-transform:translatez(0);transform:translatez(0)}}@keyframes bounceinleft{0%,60%,75%,90%,to{-webkit-animation-timing-function:cubic-bezier(.215,.61,.355,1);animation-timing-function:cubic-bezier(.215,.61,.355,1)}0%{opacity:0;-webkit-transform:translate3d(-3000px,0,0) scalex(3);transform:translate3d(-3000px,0,0) scalex(3)}60%{opacity:1;-webkit-transform:translate3d(25px,0,0) scalex(1);transform:translate3d(25px,0,0) scalex(1)}75%{-webkit-transform:translate3d(-10px,0,0) scalex(.98);transform:translate3d(-10px,0,0) scalex(.98)}90%{-webkit-transform:translate3d(5px,0,0) scalex(.995);transform:translate3d(5px,0,0) scalex(.995)}to{-webkit-transform:translatez(0);transform:translatez(0)}}.animate__bounceinleft{-webkit-animation-name:bounceinleft;animation-name:bounceinleft}@-webkit-keyframes bounceinright{0%,60%,75%,90%,to{-webkit-animation-timing-function:cubic-bezier(.215,.61,.355,1);animation-timing-function:cubic-bezier(.215,.61,.355,1)}0%{opacity:0;-webkit-transform:translate3d(3000px,0,0) scalex(3);transform:translate3d(3000px,0,0) scalex(3)}60%{opacity:1;-webkit-transform:translate3d(-25px,0,0) scalex(1);transform:translate3d(-25px,0,0) scalex(1)}75%{-webkit-transform:translate3d(10px,0,0) scalex(.98);transform:translate3d(10px,0,0) scalex(.98)}90%{-webkit-transform:translate3d(-5px,0,0) scalex(.995);transform:translate3d(-5px,0,0) scalex(.995)}to{-webkit-transform:translatez(0);transform:translatez(0)}}@keyframes bounceinright{0%,60%,75%,90%,to{-webkit-animation-timing-function:cubic-bezier(.215,.61,.355,1);animation-timing-function:cubic-bezier(.215,.61,.355,1)}0%{opacity:0;-webkit-transform:translate3d(3000px,0,0) scalex(3);transform:translate3d(3000px,0,0) scalex(3)}60%{opacity:1;-webkit-transform:translate3d(-25px,0,0) scalex(1);transform:translate3d(-25px,0,0) scalex(1)}75%{-webkit-transform:translate3d(10px,0,0) scalex(.98);transform:translate3d(10px,0,0) scalex(.98)}90%{-webkit-transform:translate3d(-5px,0,0) scalex(.995);transform:translate3d(-5px,0,0) scalex(.995)}to{-webkit-transform:translatez(0);transform:translatez(0)}}.animate__bounceinright{-webkit-animation-name:bounceinright;animation-name:bounceinright}@-webkit-keyframes bounceinup{0%,60%,75%,90%,to{-webkit-animation-timing-function:cubic-bezier(.215,.61,.355,1);animation-timing-function:cubic-bezier(.215,.61,.355,1)}0%{opacity:0;-webkit-transform:translate3d(0,3000px,0) scaley(5);transform:translate3d(0,3000px,0) scaley(5)}60%{opacity:1;-webkit-transform:translate3d(0,-20px,0) scaley(.9);transform:translate3d(0,-20px,0) scaley(.9)}75%{-webkit-transform:translate3d(0,10px,0) scaley(.95);transform:translate3d(0,10px,0) scaley(.95)}90%{-webkit-transform:translate3d(0,-5px,0) scaley(.985);transform:translate3d(0,-5px,0) scaley(.985)}to{-webkit-transform:translatez(0);transform:translatez(0)}}@keyframes bounceinup{0%,60%,75%,90%,to{-webkit-animation-timing-function:cubic-bezier(.215,.61,.355,1);animation-timing-function:cubic-bezier(.215,.61,.355,1)}0%{opacity:0;-webkit-transform:translate3d(0,3000px,0) scaley(5);transform:translate3d(0,3000px,0) scaley(5)}60%{opacity:1;-webkit-transform:translate3d(0,-20px,0) scaley(.9);transform:translate3d(0,-20px,0) scaley(.9)}75%{-webkit-transform:translate3d(0,10px,0) scaley(.95);transform:translate3d(0,10px,0) scaley(.95)}90%{-webkit-transform:translate3d(0,-5px,0) scaley(.985);transform:translate3d(0,-5px,0) scaley(.985)}to{-webkit-transform:translatez(0);transform:translatez(0)}}.animate__bounceinup{-webkit-animation-name:bounceinup;animation-name:bounceinup}@-webkit-keyframes bounceout{20%{-webkit-transform:scale3d(.9,.9,.9);transform:scale3d(.9,.9,.9)}50%,55%{opacity:1;-webkit-transform:scale3d(1.1,1.1,1.1);transform:scale3d(1.1,1.1,1.1)}to{opacity:0;-webkit-transform:scale3d(.3,.3,.3);transform:scale3d(.3,.3,.3)}}@keyframes bounceout{20%{-webkit-transform:scale3d(.9,.9,.9);transform:scale3d(.9,.9,.9)}50%,55%{opacity:1;-webkit-transform:scale3d(1.1,1.1,1.1);transform:scale3d(1.1,1.1,1.1)}to{opacity:0;-webkit-transform:scale3d(.3,.3,.3);transform:scale3d(.3,.3,.3)}}.animate__bounceout{-webkit-animation-duration:.75s;animation-duration:.75s;-webkit-animation-duration:calc(var(--animate-duration)*0.75);animation-duration:calc(var(--animate-duration)*0.75);-webkit-animation-name:bounceout;animation-name:bounceout}@-webkit-keyframes bounceoutdown{20%{-webkit-transform:translate3d(0,10px,0) scaley(.985);transform:translate3d(0,10px,0) scaley(.985)}40%,45%{opacity:1;-webkit-transform:translate3d(0,-20px,0) scaley(.9);transform:translate3d(0,-20px,0) scaley(.9)}to{opacity:0;-webkit-transform:translate3d(0,2000px,0) scaley(3);transform:translate3d(0,2000px,0) scaley(3)}}@keyframes bounceoutdown{20%{-webkit-transform:translate3d(0,10px,0) scaley(.985);transform:translate3d(0,10px,0) scaley(.985)}40%,45%{opacity:1;-webkit-transform:translate3d(0,-20px,0) scaley(.9);transform:translate3d(0,-20px,0) scaley(.9)}to{opacity:0;-webkit-transform:translate3d(0,2000px,0) scaley(3);transform:translate3d(0,2000px,0) scaley(3)}}.animate__bounceoutdown{-webkit-animation-name:bounceoutdown;animation-name:bounceoutdown}@-webkit-keyframes bounceoutleft{20%{opacity:1;-webkit-transform:translate3d(20px,0,0) scalex(.9);transform:translate3d(20px,0,0) scalex(.9)}to{opacity:0;-webkit-transform:translate3d(-2000px,0,0) scalex(2);transform:translate3d(-2000px,0,0) scalex(2)}}@keyframes bounceoutleft{20%{opacity:1;-webkit-transform:translate3d(20px,0,0) scalex(.9);transform:translate3d(20px,0,0) scalex(.9)}to{opacity:0;-webkit-transform:translate3d(-2000px,0,0) scalex(2);transform:translate3d(-2000px,0,0) scalex(2)}}.animate__bounceoutleft{-webkit-animation-name:bounceoutleft;animation-name:bounceoutleft}@-webkit-keyframes bounceoutright{20%{opacity:1;-webkit-transform:translate3d(-20px,0,0) scalex(.9);transform:translate3d(-20px,0,0) scalex(.9)}to{opacity:0;-webkit-transform:translate3d(2000px,0,0) scalex(2);transform:translate3d(2000px,0,0) scalex(2)}}@keyframes bounceoutright{20%{opacity:1;-webkit-transform:translate3d(-20px,0,0) scalex(.9);transform:translate3d(-20px,0,0) scalex(.9)}to{opacity:0;-webkit-transform:translate3d(2000px,0,0) scalex(2);transform:translate3d(2000px,0,0) scalex(2)}}.animate__bounceoutright{-webkit-animation-name:bounceoutright;animation-name:bounceoutright}@-webkit-keyframes bounceoutup{20%{-webkit-transform:translate3d(0,-10px,0) scaley(.985);transform:translate3d(0,-10px,0) scaley(.985)}40%,45%{opacity:1;-webkit-transform:translate3d(0,20px,0) scaley(.9);transform:translate3d(0,20px,0) scaley(.9)}to{opacity:0;-webkit-transform:translate3d(0,-2000px,0) scaley(3);transform:translate3d(0,-2000px,0) scaley(3)}}@keyframes bounceoutup{20%{-webkit-transform:translate3d(0,-10px,0) scaley(.985);transform:translate3d(0,-10px,0) scaley(.985)}40%,45%{opacity:1;-webkit-transform:translate3d(0,20px,0) scaley(.9);transform:translate3d(0,20px,0) scaley(.9)}to{opacity:0;-webkit-transform:translate3d(0,-2000px,0) scaley(3);transform:translate3d(0,-2000px,0) scaley(3)}}.animate__bounceoutup{-webkit-animation-name:bounceoutup;animation-name:bounceoutup}@-webkit-keyframes fadein{0%{opacity:0}to{opacity:1}}@keyframes fadein{0%{opacity:0}to{opacity:1}}.animate__fadein{-webkit-animation-name:fadein;animation-name:fadein}@-webkit-keyframes fadeindown{0%{opacity:0;-webkit-transform:translate3d(0,-100%,0);transform:translate3d(0,-100%,0)}to{opacity:1;-webkit-transform:translatez(0);transform:translatez(0)}}@keyframes fadeindown{0%{opacity:0;-webkit-transform:translate3d(0,-100%,0);transform:translate3d(0,-100%,0)}to{opacity:1;-webkit-transform:translatez(0);transform:translatez(0)}}.animate__fadeindown{-webkit-animation-name:fadeindown;animation-name:fadeindown}@-webkit-keyframes fadeindownbig{0%{opacity:0;-webkit-transform:translate3d(0,-2000px,0);transform:translate3d(0,-2000px,0)}to{opacity:1;-webkit-transform:translatez(0);transform:translatez(0)}}@keyframes fadeindownbig{0%{opacity:0;-webkit-transform:translate3d(0,-2000px,0);transform:translate3d(0,-2000px,0)}to{opacity:1;-webkit-transform:translatez(0);transform:translatez(0)}}.animate__fadeindownbig{-webkit-animation-name:fadeindownbig;animation-name:fadeindownbig}@-webkit-keyframes fadeinleft{0%{opacity:0;-webkit-transform:translate3d(-100%,0,0);transform:translate3d(-100%,0,0)}to{opacity:1;-webkit-transform:translatez(0);transform:translatez(0)}}@keyframes fadeinleft{0%{opacity:0;-webkit-transform:translate3d(-100%,0,0);transform:translate3d(-100%,0,0)}to{opacity:1;-webkit-transform:translatez(0);transform:translatez(0)}}.animate__fadeinleft{-webkit-animation-name:fadeinleft;animation-name:fadeinleft}@-webkit-keyframes fadeinleftbig{0%{opacity:0;-webkit-transform:translate3d(-2000px,0,0);transform:translate3d(-2000px,0,0)}to{opacity:1;-webkit-transform:translatez(0);transform:translatez(0)}}@keyframes fadeinleftbig{0%{opacity:0;-webkit-transform:translate3d(-2000px,0,0);transform:translate3d(-2000px,0,0)}to{opacity:1;-webkit-transform:translatez(0);transform:translatez(0)}}.animate__fadeinleftbig{-webkit-animation-name:fadeinleftbig;animation-name:fadeinleftbig}@-webkit-keyframes fadeinright{0%{opacity:0;-webkit-transform:translate3d(100%,0,0);transform:translate3d(100%,0,0)}to{opacity:1;-webkit-transform:translatez(0);transform:translatez(0)}}@keyframes fadeinright{0%{opacity:0;-webkit-transform:translate3d(100%,0,0);transform:translate3d(100%,0,0)}to{opacity:1;-webkit-transform:translatez(0);transform:translatez(0)}}.animate__fadeinright{-webkit-animation-name:fadeinright;animation-name:fadeinright}@-webkit-keyframes fadeinrightbig{0%{opacity:0;-webkit-transform:translate3d(2000px,0,0);transform:translate3d(2000px,0,0)}to{opacity:1;-webkit-transform:translatez(0);transform:translatez(0)}}@keyframes fadeinrightbig{0%{opacity:0;-webkit-transform:translate3d(2000px,0,0);transform:translate3d(2000px,0,0)}to{opacity:1;-webkit-transform:translatez(0);transform:translatez(0)}}.animate__fadeinrightbig{-webkit-animation-name:fadeinrightbig;animation-name:fadeinrightbig}@-webkit-keyframes fadeinup{0%{opacity:0;-webkit-transform:translate3d(0,100%,0);transform:translate3d(0,100%,0)}to{opacity:1;-webkit-transform:translatez(0);transform:translatez(0)}}@keyframes fadeinup{0%{opacity:0;-webkit-transform:translate3d(0,100%,0);transform:translate3d(0,100%,0)}to{opacity:1;-webkit-transform:translatez(0);transform:translatez(0)}}.animate__fadeinup{-webkit-animation-name:fadeinup;animation-name:fadeinup}@-webkit-keyframes fadeinupbig{0%{opacity:0;-webkit-transform:translate3d(0,2000px,0);transform:translate3d(0,2000px,0)}to{opacity:1;-webkit-transform:translatez(0);transform:translatez(0)}}@keyframes fadeinupbig{0%{opacity:0;-webkit-transform:translate3d(0,2000px,0);transform:translate3d(0,2000px,0)}to{opacity:1;-webkit-transform:translatez(0);transform:translatez(0)}}.animate__fadeinupbig{-webkit-animation-name:fadeinupbig;animation-name:fadeinupbig}@-webkit-keyframes fadeintopleft{0%{opacity:0;-webkit-transform:translate3d(-100%,-100%,0);transform:translate3d(-100%,-100%,0)}to{opacity:1;-webkit-transform:translatez(0);transform:translatez(0)}}@keyframes fadeintopleft{0%{opacity:0;-webkit-transform:translate3d(-100%,-100%,0);transform:translate3d(-100%,-100%,0)}to{opacity:1;-webkit-transform:translatez(0);transform:translatez(0)}}.animate__fadeintopleft{-webkit-animation-name:fadeintopleft;animation-name:fadeintopleft}@-webkit-keyframes fadeintopright{0%{opacity:0;-webkit-transform:translate3d(100%,-100%,0);transform:translate3d(100%,-100%,0)}to{opacity:1;-webkit-transform:translatez(0);transform:translatez(0)}}@keyframes fadeintopright{0%{opacity:0;-webkit-transform:translate3d(100%,-100%,0);transform:translate3d(100%,-100%,0)}to{opacity:1;-webkit-transform:translatez(0);transform:translatez(0)}}.animate__fadeintopright{-webkit-animation-name:fadeintopright;animation-name:fadeintopright}@-webkit-keyframes fadeinbottomleft{0%{opacity:0;-webkit-transform:translate3d(-100%,100%,0);transform:translate3d(-100%,100%,0)}to{opacity:1;-webkit-transform:translatez(0);transform:translatez(0)}}@keyframes fadeinbottomleft{0%{opacity:0;-webkit-transform:translate3d(-100%,100%,0);transform:translate3d(-100%,100%,0)}to{opacity:1;-webkit-transform:translatez(0);transform:translatez(0)}}.animate__fadeinbottomleft{-webkit-animation-name:fadeinbottomleft;animation-name:fadeinbottomleft}@-webkit-keyframes fadeinbottomright{0%{opacity:0;-webkit-transform:translate3d(100%,100%,0);transform:translate3d(100%,100%,0)}to{opacity:1;-webkit-transform:translatez(0);transform:translatez(0)}}@keyframes fadeinbottomright{0%{opacity:0;-webkit-transform:translate3d(100%,100%,0);transform:translate3d(100%,100%,0)}to{opacity:1;-webkit-transform:translatez(0);transform:translatez(0)}}.animate__fadeinbottomright{-webkit-animation-name:fadeinbottomright;animation-name:fadeinbottomright}@-webkit-keyframes fadeout{0%{opacity:1}to{opacity:0}}@keyframes fadeout{0%{opacity:1}to{opacity:0}}.animate__fadeout{-webkit-animation-name:fadeout;animation-name:fadeout}@-webkit-keyframes fadeoutdown{0%{opacity:1}to{opacity:0;-webkit-transform:translate3d(0,100%,0);transform:translate3d(0,100%,0)}}@keyframes fadeoutdown{0%{opacity:1}to{opacity:0;-webkit-transform:translate3d(0,100%,0);transform:translate3d(0,100%,0)}}.animate__fadeoutdown{-webkit-animation-name:fadeoutdown;animation-name:fadeoutdown}@-webkit-keyframes fadeoutdownbig{0%{opacity:1}to{opacity:0;-webkit-transform:translate3d(0,2000px,0);transform:translate3d(0,2000px,0)}}@keyframes fadeoutdownbig{0%{opacity:1}to{opacity:0;-webkit-transform:translate3d(0,2000px,0);transform:translate3d(0,2000px,0)}}.animate__fadeoutdownbig{-webkit-animation-name:fadeoutdownbig;animation-name:fadeoutdownbig}@-webkit-keyframes fadeoutleft{0%{opacity:1}to{opacity:0;-webkit-transform:translate3d(-100%,0,0);transform:translate3d(-100%,0,0)}}@keyframes fadeoutleft{0%{opacity:1}to{opacity:0;-webkit-transform:translate3d(-100%,0,0);transform:translate3d(-100%,0,0)}}.animate__fadeoutleft{-webkit-animation-name:fadeoutleft;animation-name:fadeoutleft}@-webkit-keyframes fadeoutleftbig{0%{opacity:1}to{opacity:0;-webkit-transform:translate3d(-2000px,0,0);transform:translate3d(-2000px,0,0)}}@keyframes fadeoutleftbig{0%{opacity:1}to{opacity:0;-webkit-transform:translate3d(-2000px,0,0);transform:translate3d(-2000px,0,0)}}.animate__fadeoutleftbig{-webkit-animation-name:fadeoutleftbig;animation-name:fadeoutleftbig}@-webkit-keyframes fadeoutright{0%{opacity:1}to{opacity:0;-webkit-transform:translate3d(100%,0,0);transform:translate3d(100%,0,0)}}@keyframes fadeoutright{0%{opacity:1}to{opacity:0;-webkit-transform:translate3d(100%,0,0);transform:translate3d(100%,0,0)}}.animate__fadeoutright{-webkit-animation-name:fadeoutright;animation-name:fadeoutright}@-webkit-keyframes fadeoutrightbig{0%{opacity:1}to{opacity:0;-webkit-transform:translate3d(2000px,0,0);transform:translate3d(2000px,0,0)}}@keyframes fadeoutrightbig{0%{opacity:1}to{opacity:0;-webkit-transform:translate3d(2000px,0,0);transform:translate3d(2000px,0,0)}}.animate__fadeoutrightbig{-webkit-animation-name:fadeoutrightbig;animation-name:fadeoutrightbig}@-webkit-keyframes fadeoutup{0%{opacity:1}to{opacity:0;-webkit-transform:translate3d(0,-100%,0);transform:translate3d(0,-100%,0)}}@keyframes fadeoutup{0%{opacity:1}to{opacity:0;-webkit-transform:translate3d(0,-100%,0);transform:translate3d(0,-100%,0)}}.animate__fadeoutup{-webkit-animation-name:fadeoutup;animation-name:fadeoutup}@-webkit-keyframes fadeoutupbig{0%{opacity:1}to{opacity:0;-webkit-transform:translate3d(0,-2000px,0);transform:translate3d(0,-2000px,0)}}@keyframes fadeoutupbig{0%{opacity:1}to{opacity:0;-webkit-transform:translate3d(0,-2000px,0);transform:translate3d(0,-2000px,0)}}.animate__fadeoutupbig{-webkit-animation-name:fadeoutupbig;animation-name:fadeoutupbig}@-webkit-keyframes fadeouttopleft{0%{opacity:1;-webkit-transform:translatez(0);transform:translatez(0)}to{opacity:0;-webkit-transform:translate3d(-100%,-100%,0);transform:translate3d(-100%,-100%,0)}}@keyframes fadeouttopleft{0%{opacity:1;-webkit-transform:translatez(0);transform:translatez(0)}to{opacity:0;-webkit-transform:translate3d(-100%,-100%,0);transform:translate3d(-100%,-100%,0)}}.animate__fadeouttopleft{-webkit-animation-name:fadeouttopleft;animation-name:fadeouttopleft}@-webkit-keyframes fadeouttopright{0%{opacity:1;-webkit-transform:translatez(0);transform:translatez(0)}to{opacity:0;-webkit-transform:translate3d(100%,-100%,0);transform:translate3d(100%,-100%,0)}}@keyframes fadeouttopright{0%{opacity:1;-webkit-transform:translatez(0);transform:translatez(0)}to{opacity:0;-webkit-transform:translate3d(100%,-100%,0);transform:translate3d(100%,-100%,0)}}.animate__fadeouttopright{-webkit-animation-name:fadeouttopright;animation-name:fadeouttopright}@-webkit-keyframes fadeoutbottomright{0%{opacity:1;-webkit-transform:translatez(0);transform:translatez(0)}to{opacity:0;-webkit-transform:translate3d(100%,100%,0);transform:translate3d(100%,100%,0)}}@keyframes fadeoutbottomright{0%{opacity:1;-webkit-transform:translatez(0);transform:translatez(0)}to{opacity:0;-webkit-transform:translate3d(100%,100%,0);transform:translate3d(100%,100%,0)}}.animate__fadeoutbottomright{-webkit-animation-name:fadeoutbottomright;animation-name:fadeoutbottomright}@-webkit-keyframes fadeoutbottomleft{0%{opacity:1;-webkit-transform:translatez(0);transform:translatez(0)}to{opacity:0;-webkit-transform:translate3d(-100%,100%,0);transform:translate3d(-100%,100%,0)}}@keyframes fadeoutbottomleft{0%{opacity:1;-webkit-transform:translatez(0);transform:translatez(0)}to{opacity:0;-webkit-transform:translate3d(-100%,100%,0);transform:translate3d(-100%,100%,0)}}.animate__fadeoutbottomleft{-webkit-animation-name:fadeoutbottomleft;animation-name:fadeoutbottomleft}@-webkit-keyframes flip{0%{-webkit-transform:perspective(400px) scalex(1) translatez(0) rotatey(-1turn);transform:perspective(400px) scalex(1) translatez(0) rotatey(-1turn);-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}40%{-webkit-transform:perspective(400px) scalex(1) translatez(150px) rotatey(-190deg);transform:perspective(400px) scalex(1) translatez(150px) rotatey(-190deg);-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}50%{-webkit-transform:perspective(400px) scalex(1) translatez(150px) rotatey(-170deg);transform:perspective(400px) scalex(1) translatez(150px) rotatey(-170deg);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}80%{-webkit-transform:perspective(400px) scale3d(.95,.95,.95) translatez(0) rotatey(0deg);transform:perspective(400px) scale3d(.95,.95,.95) translatez(0) rotatey(0deg);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}to{-webkit-transform:perspective(400px) scalex(1) translatez(0) rotatey(0deg);transform:perspective(400px) scalex(1) translatez(0) rotatey(0deg);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}}@keyframes flip{0%{-webkit-transform:perspective(400px) scalex(1) translatez(0) rotatey(-1turn);transform:perspective(400px) scalex(1) translatez(0) rotatey(-1turn);-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}40%{-webkit-transform:perspective(400px) scalex(1) translatez(150px) rotatey(-190deg);transform:perspective(400px) scalex(1) translatez(150px) rotatey(-190deg);-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}50%{-webkit-transform:perspective(400px) scalex(1) translatez(150px) rotatey(-170deg);transform:perspective(400px) scalex(1) translatez(150px) rotatey(-170deg);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}80%{-webkit-transform:perspective(400px) scale3d(.95,.95,.95) translatez(0) rotatey(0deg);transform:perspective(400px) scale3d(.95,.95,.95) translatez(0) rotatey(0deg);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}to{-webkit-transform:perspective(400px) scalex(1) translatez(0) rotatey(0deg);transform:perspective(400px) scalex(1) translatez(0) rotatey(0deg);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}}.animate__animated.animate__flip{-webkit-backface-visibility:visible;backface-visibility:visible;-webkit-animation-name:flip;animation-name:flip}@-webkit-keyframes flipinx{0%{-webkit-transform:perspective(400px) rotatex(90deg);transform:perspective(400px) rotatex(90deg);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in;opacity:0}40%{-webkit-transform:perspective(400px) rotatex(-20deg);transform:perspective(400px) rotatex(-20deg);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}60%{-webkit-transform:perspective(400px) rotatex(10deg);transform:perspective(400px) rotatex(10deg);opacity:1}80%{-webkit-transform:perspective(400px) rotatex(-5deg);transform:perspective(400px) rotatex(-5deg)}to{-webkit-transform:perspective(400px);transform:perspective(400px)}}@keyframes flipinx{0%{-webkit-transform:perspective(400px) rotatex(90deg);transform:perspective(400px) rotatex(90deg);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in;opacity:0}40%{-webkit-transform:perspective(400px) rotatex(-20deg);transform:perspective(400px) rotatex(-20deg);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}60%{-webkit-transform:perspective(400px) rotatex(10deg);transform:perspective(400px) rotatex(10deg);opacity:1}80%{-webkit-transform:perspective(400px) rotatex(-5deg);transform:perspective(400px) rotatex(-5deg)}to{-webkit-transform:perspective(400px);transform:perspective(400px)}}.animate__flipinx{-webkit-backface-visibility:visible!important;backface-visibility:visible!important;-webkit-animation-name:flipinx;animation-name:flipinx}@-webkit-keyframes flipiny{0%{-webkit-transform:perspective(400px) rotatey(90deg);transform:perspective(400px) rotatey(90deg);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in;opacity:0}40%{-webkit-transform:perspective(400px) rotatey(-20deg);transform:perspective(400px) rotatey(-20deg);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}60%{-webkit-transform:perspective(400px) rotatey(10deg);transform:perspective(400px) rotatey(10deg);opacity:1}80%{-webkit-transform:perspective(400px) rotatey(-5deg);transform:perspective(400px) rotatey(-5deg)}to{-webkit-transform:perspective(400px);transform:perspective(400px)}}@keyframes flipiny{0%{-webkit-transform:perspective(400px) rotatey(90deg);transform:perspective(400px) rotatey(90deg);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in;opacity:0}40%{-webkit-transform:perspective(400px) rotatey(-20deg);transform:perspective(400px) rotatey(-20deg);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}60%{-webkit-transform:perspective(400px) rotatey(10deg);transform:perspective(400px) rotatey(10deg);opacity:1}80%{-webkit-transform:perspective(400px) rotatey(-5deg);transform:perspective(400px) rotatey(-5deg)}to{-webkit-transform:perspective(400px);transform:perspective(400px)}}.animate__flipiny{-webkit-backface-visibility:visible!important;backface-visibility:visible!important;-webkit-animation-name:flipiny;animation-name:flipiny}@-webkit-keyframes flipoutx{0%{-webkit-transform:perspective(400px);transform:perspective(400px)}30%{-webkit-transform:perspective(400px) rotatex(-20deg);transform:perspective(400px) rotatex(-20deg);opacity:1}to{-webkit-transform:perspective(400px) rotatex(90deg);transform:perspective(400px) rotatex(90deg);opacity:0}}@keyframes flipoutx{0%{-webkit-transform:perspective(400px);transform:perspective(400px)}30%{-webkit-transform:perspective(400px) rotatex(-20deg);transform:perspective(400px) rotatex(-20deg);opacity:1}to{-webkit-transform:perspective(400px) rotatex(90deg);transform:perspective(400px) rotatex(90deg);opacity:0}}.animate__flipoutx{-webkit-animation-duration:.75s;animation-duration:.75s;-webkit-animation-duration:calc(var(--animate-duration)*0.75);animation-duration:calc(var(--animate-duration)*0.75);-webkit-animation-name:flipoutx;animation-name:flipoutx;-webkit-backface-visibility:visible!important;backface-visibility:visible!important}@-webkit-keyframes flipouty{0%{-webkit-transform:perspective(400px);transform:perspective(400px)}30%{-webkit-transform:perspective(400px) rotatey(-15deg);transform:perspective(400px) rotatey(-15deg);opacity:1}to{-webkit-transform:perspective(400px) rotatey(90deg);transform:perspective(400px) rotatey(90deg);opacity:0}}@keyframes flipouty{0%{-webkit-transform:perspective(400px);transform:perspective(400px)}30%{-webkit-transform:perspective(400px) rotatey(-15deg);transform:perspective(400px) rotatey(-15deg);opacity:1}to{-webkit-transform:perspective(400px) rotatey(90deg);transform:perspective(400px) rotatey(90deg);opacity:0}}.animate__flipouty{-webkit-animation-duration:.75s;animation-duration:.75s;-webkit-animation-duration:calc(var(--animate-duration)*0.75);animation-duration:calc(var(--animate-duration)*0.75);-webkit-backface-visibility:visible!important;backface-visibility:visible!important;-webkit-animation-name:flipouty;animation-name:flipouty}@-webkit-keyframes lightspeedinright{0%{-webkit-transform:translate3d(100%,0,0) skewx(-30deg);transform:translate3d(100%,0,0) skewx(-30deg);opacity:0}60%{-webkit-transform:skewx(20deg);transform:skewx(20deg);opacity:1}80%{-webkit-transform:skewx(-5deg);transform:skewx(-5deg)}to{-webkit-transform:translatez(0);transform:translatez(0)}}@keyframes lightspeedinright{0%{-webkit-transform:translate3d(100%,0,0) skewx(-30deg);transform:translate3d(100%,0,0) skewx(-30deg);opacity:0}60%{-webkit-transform:skewx(20deg);transform:skewx(20deg);opacity:1}80%{-webkit-transform:skewx(-5deg);transform:skewx(-5deg)}to{-webkit-transform:translatez(0);transform:translatez(0)}}.animate__lightspeedinright{-webkit-animation-name:lightspeedinright;animation-name:lightspeedinright;-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}@-webkit-keyframes lightspeedinleft{0%{-webkit-transform:translate3d(-100%,0,0) skewx(30deg);transform:translate3d(-100%,0,0) skewx(30deg);opacity:0}60%{-webkit-transform:skewx(-20deg);transform:skewx(-20deg);opacity:1}80%{-webkit-transform:skewx(5deg);transform:skewx(5deg)}to{-webkit-transform:translatez(0);transform:translatez(0)}}@keyframes lightspeedinleft{0%{-webkit-transform:translate3d(-100%,0,0) skewx(30deg);transform:translate3d(-100%,0,0) skewx(30deg);opacity:0}60%{-webkit-transform:skewx(-20deg);transform:skewx(-20deg);opacity:1}80%{-webkit-transform:skewx(5deg);transform:skewx(5deg)}to{-webkit-transform:translatez(0);transform:translatez(0)}}.animate__lightspeedinleft{-webkit-animation-name:lightspeedinleft;animation-name:lightspeedinleft;-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}@-webkit-keyframes lightspeedoutright{0%{opacity:1}to{-webkit-transform:translate3d(100%,0,0) skewx(30deg);transform:translate3d(100%,0,0) skewx(30deg);opacity:0}}@keyframes lightspeedoutright{0%{opacity:1}to{-webkit-transform:translate3d(100%,0,0) skewx(30deg);transform:translate3d(100%,0,0) skewx(30deg);opacity:0}}.animate__lightspeedoutright{-webkit-animation-name:lightspeedoutright;animation-name:lightspeedoutright;-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}@-webkit-keyframes lightspeedoutleft{0%{opacity:1}to{-webkit-transform:translate3d(-100%,0,0) skewx(-30deg);transform:translate3d(-100%,0,0) skewx(-30deg);opacity:0}}@keyframes lightspeedoutleft{0%{opacity:1}to{-webkit-transform:translate3d(-100%,0,0) skewx(-30deg);transform:translate3d(-100%,0,0) skewx(-30deg);opacity:0}}.animate__lightspeedoutleft{-webkit-animation-name:lightspeedoutleft;animation-name:lightspeedoutleft;-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}@-webkit-keyframes rotatein{0%{-webkit-transform:rotate(-200deg);transform:rotate(-200deg);opacity:0}to{-webkit-transform:translatez(0);transform:translatez(0);opacity:1}}@keyframes rotatein{0%{-webkit-transform:rotate(-200deg);transform:rotate(-200deg);opacity:0}to{-webkit-transform:translatez(0);transform:translatez(0);opacity:1}}.animate__rotatein{-webkit-animation-name:rotatein;animation-name:rotatein;-webkit-transform-origin:center;transform-origin:center}@-webkit-keyframes rotateindownleft{0%{-webkit-transform:rotate(-45deg);transform:rotate(-45deg);opacity:0}to{-webkit-transform:translatez(0);transform:translatez(0);opacity:1}}@keyframes rotateindownleft{0%{-webkit-transform:rotate(-45deg);transform:rotate(-45deg);opacity:0}to{-webkit-transform:translatez(0);transform:translatez(0);opacity:1}}.animate__rotateindownleft{-webkit-animation-name:rotateindownleft;animation-name:rotateindownleft;-webkit-transform-origin:left bottom;transform-origin:left bottom}@-webkit-keyframes rotateindownright{0%{-webkit-transform:rotate(45deg);transform:rotate(45deg);opacity:0}to{-webkit-transform:translatez(0);transform:translatez(0);opacity:1}}@keyframes rotateindownright{0%{-webkit-transform:rotate(45deg);transform:rotate(45deg);opacity:0}to{-webkit-transform:translatez(0);transform:translatez(0);opacity:1}}.animate__rotateindownright{-webkit-animation-name:rotateindownright;animation-name:rotateindownright;-webkit-transform-origin:right bottom;transform-origin:right bottom}@-webkit-keyframes rotateinupleft{0%{-webkit-transform:rotate(45deg);transform:rotate(45deg);opacity:0}to{-webkit-transform:translatez(0);transform:translatez(0);opacity:1}}@keyframes rotateinupleft{0%{-webkit-transform:rotate(45deg);transform:rotate(45deg);opacity:0}to{-webkit-transform:translatez(0);transform:translatez(0);opacity:1}}.animate__rotateinupleft{-webkit-animation-name:rotateinupleft;animation-name:rotateinupleft;-webkit-transform-origin:left bottom;transform-origin:left bottom}@-webkit-keyframes rotateinupright{0%{-webkit-transform:rotate(-90deg);transform:rotate(-90deg);opacity:0}to{-webkit-transform:translatez(0);transform:translatez(0);opacity:1}}@keyframes rotateinupright{0%{-webkit-transform:rotate(-90deg);transform:rotate(-90deg);opacity:0}to{-webkit-transform:translatez(0);transform:translatez(0);opacity:1}}.animate__rotateinupright{-webkit-animation-name:rotateinupright;animation-name:rotateinupright;-webkit-transform-origin:right bottom;transform-origin:right bottom}@-webkit-keyframes rotateout{0%{opacity:1}to{-webkit-transform:rotate(200deg);transform:rotate(200deg);opacity:0}}@keyframes rotateout{0%{opacity:1}to{-webkit-transform:rotate(200deg);transform:rotate(200deg);opacity:0}}.animate__rotateout{-webkit-animation-name:rotateout;animation-name:rotateout;-webkit-transform-origin:center;transform-origin:center}@-webkit-keyframes rotateoutdownleft{0%{opacity:1}to{-webkit-transform:rotate(45deg);transform:rotate(45deg);opacity:0}}@keyframes rotateoutdownleft{0%{opacity:1}to{-webkit-transform:rotate(45deg);transform:rotate(45deg);opacity:0}}.animate__rotateoutdownleft{-webkit-animation-name:rotateoutdownleft;animation-name:rotateoutdownleft;-webkit-transform-origin:left bottom;transform-origin:left bottom}@-webkit-keyframes rotateoutdownright{0%{opacity:1}to{-webkit-transform:rotate(-45deg);transform:rotate(-45deg);opacity:0}}@keyframes rotateoutdownright{0%{opacity:1}to{-webkit-transform:rotate(-45deg);transform:rotate(-45deg);opacity:0}}.animate__rotateoutdownright{-webkit-animation-name:rotateoutdownright;animation-name:rotateoutdownright;-webkit-transform-origin:right bottom;transform-origin:right bottom}@-webkit-keyframes rotateoutupleft{0%{opacity:1}to{-webkit-transform:rotate(-45deg);transform:rotate(-45deg);opacity:0}}@keyframes rotateoutupleft{0%{opacity:1}to{-webkit-transform:rotate(-45deg);transform:rotate(-45deg);opacity:0}}.animate__rotateoutupleft{-webkit-animation-name:rotateoutupleft;animation-name:rotateoutupleft;-webkit-transform-origin:left bottom;transform-origin:left bottom}@-webkit-keyframes rotateoutupright{0%{opacity:1}to{-webkit-transform:rotate(90deg);transform:rotate(90deg);opacity:0}}@keyframes rotateoutupright{0%{opacity:1}to{-webkit-transform:rotate(90deg);transform:rotate(90deg);opacity:0}}.animate__rotateoutupright{-webkit-animation-name:rotateoutupright;animation-name:rotateoutupright;-webkit-transform-origin:right bottom;transform-origin:right bottom}@-webkit-keyframes hinge{0%{-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out}20%,60%{-webkit-transform:rotate(80deg);transform:rotate(80deg);-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out}40%,80%{-webkit-transform:rotate(60deg);transform:rotate(60deg);-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out;opacity:1}to{-webkit-transform:translate3d(0,700px,0);transform:translate3d(0,700px,0);opacity:0}}@keyframes hinge{0%{-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out}20%,60%{-webkit-transform:rotate(80deg);transform:rotate(80deg);-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out}40%,80%{-webkit-transform:rotate(60deg);transform:rotate(60deg);-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out;opacity:1}to{-webkit-transform:translate3d(0,700px,0);transform:translate3d(0,700px,0);opacity:0}}.animate__hinge{-webkit-animation-duration:2s;animation-duration:2s;-webkit-animation-duration:calc(var(--animate-duration)*2);animation-duration:calc(var(--animate-duration)*2);-webkit-animation-name:hinge;animation-name:hinge;-webkit-transform-origin:top left;transform-origin:top left}@-webkit-keyframes jackinthebox{0%{opacity:0;-webkit-transform:scale(.1) rotate(30deg);transform:scale(.1) rotate(30deg);-webkit-transform-origin:center bottom;transform-origin:center bottom}50%{-webkit-transform:rotate(-10deg);transform:rotate(-10deg)}70%{-webkit-transform:rotate(3deg);transform:rotate(3deg)}to{opacity:1;-webkit-transform:scale(1);transform:scale(1)}}@keyframes jackinthebox{0%{opacity:0;-webkit-transform:scale(.1) rotate(30deg);transform:scale(.1) rotate(30deg);-webkit-transform-origin:center bottom;transform-origin:center bottom}50%{-webkit-transform:rotate(-10deg);transform:rotate(-10deg)}70%{-webkit-transform:rotate(3deg);transform:rotate(3deg)}to{opacity:1;-webkit-transform:scale(1);transform:scale(1)}}.animate__jackinthebox{-webkit-animation-name:jackinthebox;animation-name:jackinthebox}@-webkit-keyframes rollin{0%{opacity:0;-webkit-transform:translate3d(-100%,0,0) rotate(-120deg);transform:translate3d(-100%,0,0) rotate(-120deg)}to{opacity:1;-webkit-transform:translatez(0);transform:translatez(0)}}@keyframes rollin{0%{opacity:0;-webkit-transform:translate3d(-100%,0,0) rotate(-120deg);transform:translate3d(-100%,0,0) rotate(-120deg)}to{opacity:1;-webkit-transform:translatez(0);transform:translatez(0)}}.animate__rollin{-webkit-animation-name:rollin;animation-name:rollin}@-webkit-keyframes rollout{0%{opacity:1}to{opacity:0;-webkit-transform:translate3d(100%,0,0) rotate(120deg);transform:translate3d(100%,0,0) rotate(120deg)}}@keyframes rollout{0%{opacity:1}to{opacity:0;-webkit-transform:translate3d(100%,0,0) rotate(120deg);transform:translate3d(100%,0,0) rotate(120deg)}}.animate__rollout{-webkit-animation-name:rollout;animation-name:rollout}@-webkit-keyframes zoomin{0%{opacity:0;-webkit-transform:scale3d(.3,.3,.3);transform:scale3d(.3,.3,.3)}50%{opacity:1}}@keyframes zoomin{0%{opacity:0;-webkit-transform:scale3d(.3,.3,.3);transform:scale3d(.3,.3,.3)}50%{opacity:1}}.animate__zoomin{-webkit-animation-name:zoomin;animation-name:zoomin}@-webkit-keyframes zoomindown{0%{opacity:0;-webkit-transform:scale3d(.1,.1,.1) translate3d(0,-1000px,0);transform:scale3d(.1,.1,.1) translate3d(0,-1000px,0);-webkit-animation-timing-function:cubic-bezier(.55,.055,.675,.19);animation-timing-function:cubic-bezier(.55,.055,.675,.19)}60%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(0,60px,0);transform:scale3d(.475,.475,.475) translate3d(0,60px,0);-webkit-animation-timing-function:cubic-bezier(.175,.885,.32,1);animation-timing-function:cubic-bezier(.175,.885,.32,1)}}@keyframes zoomindown{0%{opacity:0;-webkit-transform:scale3d(.1,.1,.1) translate3d(0,-1000px,0);transform:scale3d(.1,.1,.1) translate3d(0,-1000px,0);-webkit-animation-timing-function:cubic-bezier(.55,.055,.675,.19);animation-timing-function:cubic-bezier(.55,.055,.675,.19)}60%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(0,60px,0);transform:scale3d(.475,.475,.475) translate3d(0,60px,0);-webkit-animation-timing-function:cubic-bezier(.175,.885,.32,1);animation-timing-function:cubic-bezier(.175,.885,.32,1)}}.animate__zoomindown{-webkit-animation-name:zoomindown;animation-name:zoomindown}@-webkit-keyframes zoominleft{0%{opacity:0;-webkit-transform:scale3d(.1,.1,.1) translate3d(-1000px,0,0);transform:scale3d(.1,.1,.1) translate3d(-1000px,0,0);-webkit-animation-timing-function:cubic-bezier(.55,.055,.675,.19);animation-timing-function:cubic-bezier(.55,.055,.675,.19)}60%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(10px,0,0);transform:scale3d(.475,.475,.475) translate3d(10px,0,0);-webkit-animation-timing-function:cubic-bezier(.175,.885,.32,1);animation-timing-function:cubic-bezier(.175,.885,.32,1)}}@keyframes zoominleft{0%{opacity:0;-webkit-transform:scale3d(.1,.1,.1) translate3d(-1000px,0,0);transform:scale3d(.1,.1,.1) translate3d(-1000px,0,0);-webkit-animation-timing-function:cubic-bezier(.55,.055,.675,.19);animation-timing-function:cubic-bezier(.55,.055,.675,.19)}60%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(10px,0,0);transform:scale3d(.475,.475,.475) translate3d(10px,0,0);-webkit-animation-timing-function:cubic-bezier(.175,.885,.32,1);animation-timing-function:cubic-bezier(.175,.885,.32,1)}}.animate__zoominleft{-webkit-animation-name:zoominleft;animation-name:zoominleft}@-webkit-keyframes zoominright{0%{opacity:0;-webkit-transform:scale3d(.1,.1,.1) translate3d(1000px,0,0);transform:scale3d(.1,.1,.1) translate3d(1000px,0,0);-webkit-animation-timing-function:cubic-bezier(.55,.055,.675,.19);animation-timing-function:cubic-bezier(.55,.055,.675,.19)}60%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(-10px,0,0);transform:scale3d(.475,.475,.475) translate3d(-10px,0,0);-webkit-animation-timing-function:cubic-bezier(.175,.885,.32,1);animation-timing-function:cubic-bezier(.175,.885,.32,1)}}@keyframes zoominright{0%{opacity:0;-webkit-transform:scale3d(.1,.1,.1) translate3d(1000px,0,0);transform:scale3d(.1,.1,.1) translate3d(1000px,0,0);-webkit-animation-timing-function:cubic-bezier(.55,.055,.675,.19);animation-timing-function:cubic-bezier(.55,.055,.675,.19)}60%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(-10px,0,0);transform:scale3d(.475,.475,.475) translate3d(-10px,0,0);-webkit-animation-timing-function:cubic-bezier(.175,.885,.32,1);animation-timing-function:cubic-bezier(.175,.885,.32,1)}}.animate__zoominright{-webkit-animation-name:zoominright;animation-name:zoominright}@-webkit-keyframes zoominup{0%{opacity:0;-webkit-transform:scale3d(.1,.1,.1) translate3d(0,1000px,0);transform:scale3d(.1,.1,.1) translate3d(0,1000px,0);-webkit-animation-timing-function:cubic-bezier(.55,.055,.675,.19);animation-timing-function:cubic-bezier(.55,.055,.675,.19)}60%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(0,-60px,0);transform:scale3d(.475,.475,.475) translate3d(0,-60px,0);-webkit-animation-timing-function:cubic-bezier(.175,.885,.32,1);animation-timing-function:cubic-bezier(.175,.885,.32,1)}}@keyframes zoominup{0%{opacity:0;-webkit-transform:scale3d(.1,.1,.1) translate3d(0,1000px,0);transform:scale3d(.1,.1,.1) translate3d(0,1000px,0);-webkit-animation-timing-function:cubic-bezier(.55,.055,.675,.19);animation-timing-function:cubic-bezier(.55,.055,.675,.19)}60%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(0,-60px,0);transform:scale3d(.475,.475,.475) translate3d(0,-60px,0);-webkit-animation-timing-function:cubic-bezier(.175,.885,.32,1);animation-timing-function:cubic-bezier(.175,.885,.32,1)}}.animate__zoominup{-webkit-animation-name:zoominup;animation-name:zoominup}@-webkit-keyframes zoomout{0%{opacity:1}50%{opacity:0;-webkit-transform:scale3d(.3,.3,.3);transform:scale3d(.3,.3,.3)}to{opacity:0}}@keyframes zoomout{0%{opacity:1}50%{opacity:0;-webkit-transform:scale3d(.3,.3,.3);transform:scale3d(.3,.3,.3)}to{opacity:0}}.animate__zoomout{-webkit-animation-name:zoomout;animation-name:zoomout}@-webkit-keyframes zoomoutdown{40%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(0,-60px,0);transform:scale3d(.475,.475,.475) translate3d(0,-60px,0);-webkit-animation-timing-function:cubic-bezier(.55,.055,.675,.19);animation-timing-function:cubic-bezier(.55,.055,.675,.19)}to{opacity:0;-webkit-transform:scale3d(.1,.1,.1) translate3d(0,2000px,0);transform:scale3d(.1,.1,.1) translate3d(0,2000px,0);-webkit-animation-timing-function:cubic-bezier(.175,.885,.32,1);animation-timing-function:cubic-bezier(.175,.885,.32,1)}}@keyframes zoomoutdown{40%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(0,-60px,0);transform:scale3d(.475,.475,.475) translate3d(0,-60px,0);-webkit-animation-timing-function:cubic-bezier(.55,.055,.675,.19);animation-timing-function:cubic-bezier(.55,.055,.675,.19)}to{opacity:0;-webkit-transform:scale3d(.1,.1,.1) translate3d(0,2000px,0);transform:scale3d(.1,.1,.1) translate3d(0,2000px,0);-webkit-animation-timing-function:cubic-bezier(.175,.885,.32,1);animation-timing-function:cubic-bezier(.175,.885,.32,1)}}.animate__zoomoutdown{-webkit-animation-name:zoomoutdown;animation-name:zoomoutdown;-webkit-transform-origin:center bottom;transform-origin:center bottom}@-webkit-keyframes zoomoutleft{40%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(42px,0,0);transform:scale3d(.475,.475,.475) translate3d(42px,0,0)}to{opacity:0;-webkit-transform:scale(.1) translate3d(-2000px,0,0);transform:scale(.1) translate3d(-2000px,0,0)}}@keyframes zoomoutleft{40%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(42px,0,0);transform:scale3d(.475,.475,.475) translate3d(42px,0,0)}to{opacity:0;-webkit-transform:scale(.1) translate3d(-2000px,0,0);transform:scale(.1) translate3d(-2000px,0,0)}}.animate__zoomoutleft{-webkit-animation-name:zoomoutleft;animation-name:zoomoutleft;-webkit-transform-origin:left center;transform-origin:left center}@-webkit-keyframes zoomoutright{40%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(-42px,0,0);transform:scale3d(.475,.475,.475) translate3d(-42px,0,0)}to{opacity:0;-webkit-transform:scale(.1) translate3d(2000px,0,0);transform:scale(.1) translate3d(2000px,0,0)}}@keyframes zoomoutright{40%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(-42px,0,0);transform:scale3d(.475,.475,.475) translate3d(-42px,0,0)}to{opacity:0;-webkit-transform:scale(.1) translate3d(2000px,0,0);transform:scale(.1) translate3d(2000px,0,0)}}.animate__zoomoutright{-webkit-animation-name:zoomoutright;animation-name:zoomoutright;-webkit-transform-origin:right center;transform-origin:right center}@-webkit-keyframes zoomoutup{40%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(0,60px,0);transform:scale3d(.475,.475,.475) translate3d(0,60px,0);-webkit-animation-timing-function:cubic-bezier(.55,.055,.675,.19);animation-timing-function:cubic-bezier(.55,.055,.675,.19)}to{opacity:0;-webkit-transform:scale3d(.1,.1,.1) translate3d(0,-2000px,0);transform:scale3d(.1,.1,.1) translate3d(0,-2000px,0);-webkit-animation-timing-function:cubic-bezier(.175,.885,.32,1);animation-timing-function:cubic-bezier(.175,.885,.32,1)}}@keyframes zoomoutup{40%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(0,60px,0);transform:scale3d(.475,.475,.475) translate3d(0,60px,0);-webkit-animation-timing-function:cubic-bezier(.55,.055,.675,.19);animation-timing-function:cubic-bezier(.55,.055,.675,.19)}to{opacity:0;-webkit-transform:scale3d(.1,.1,.1) translate3d(0,-2000px,0);transform:scale3d(.1,.1,.1) translate3d(0,-2000px,0);-webkit-animation-timing-function:cubic-bezier(.175,.885,.32,1);animation-timing-function:cubic-bezier(.175,.885,.32,1)}}.animate__zoomoutup{-webkit-animation-name:zoomoutup;animation-name:zoomoutup;-webkit-transform-origin:center bottom;transform-origin:center bottom}@-webkit-keyframes slideindown{0%{-webkit-transform:translate3d(0,-100%,0);transform:translate3d(0,-100%,0);visibility:visible}to{-webkit-transform:translatez(0);transform:translatez(0)}}@keyframes slideindown{0%{-webkit-transform:translate3d(0,-100%,0);transform:translate3d(0,-100%,0);visibility:visible}to{-webkit-transform:translatez(0);transform:translatez(0)}}.animate__slideindown{-webkit-animation-name:slideindown;animation-name:slideindown}@-webkit-keyframes slideinleft{0%{-webkit-transform:translate3d(-100%,0,0);transform:translate3d(-100%,0,0);visibility:visible}to{-webkit-transform:translatez(0);transform:translatez(0)}}@keyframes slideinleft{0%{-webkit-transform:translate3d(-100%,0,0);transform:translate3d(-100%,0,0);visibility:visible}to{-webkit-transform:translatez(0);transform:translatez(0)}}.animate__slideinleft{-webkit-animation-name:slideinleft;animation-name:slideinleft}@-webkit-keyframes slideinright{0%{-webkit-transform:translate3d(100%,0,0);transform:translate3d(100%,0,0);visibility:visible}to{-webkit-transform:translatez(0);transform:translatez(0)}}@keyframes slideinright{0%{-webkit-transform:translate3d(100%,0,0);transform:translate3d(100%,0,0);visibility:visible}to{-webkit-transform:translatez(0);transform:translatez(0)}}.animate__slideinright{-webkit-animation-name:slideinright;animation-name:slideinright}@-webkit-keyframes slideinup{0%{-webkit-transform:translate3d(0,100%,0);transform:translate3d(0,100%,0);visibility:visible}to{-webkit-transform:translatez(0);transform:translatez(0)}}@keyframes slideinup{0%{-webkit-transform:translate3d(0,100%,0);transform:translate3d(0,100%,0);visibility:visible}to{-webkit-transform:translatez(0);transform:translatez(0)}}.animate__slideinup{-webkit-animation-name:slideinup;animation-name:slideinup}@-webkit-keyframes slideoutdown{0%{-webkit-transform:translatez(0);transform:translatez(0)}to{visibility:hidden;-webkit-transform:translate3d(0,100%,0);transform:translate3d(0,100%,0)}}@keyframes slideoutdown{0%{-webkit-transform:translatez(0);transform:translatez(0)}to{visibility:hidden;-webkit-transform:translate3d(0,100%,0);transform:translate3d(0,100%,0)}}.animate__slideoutdown{-webkit-animation-name:slideoutdown;animation-name:slideoutdown}@-webkit-keyframes slideoutleft{0%{-webkit-transform:translatez(0);transform:translatez(0)}to{visibility:hidden;-webkit-transform:translate3d(-100%,0,0);transform:translate3d(-100%,0,0)}}@keyframes slideoutleft{0%{-webkit-transform:translatez(0);transform:translatez(0)}to{visibility:hidden;-webkit-transform:translate3d(-100%,0,0);transform:translate3d(-100%,0,0)}}.animate__slideoutleft{-webkit-animation-name:slideoutleft;animation-name:slideoutleft}@-webkit-keyframes slideoutright{0%{-webkit-transform:translatez(0);transform:translatez(0)}to{visibility:hidden;-webkit-transform:translate3d(100%,0,0);transform:translate3d(100%,0,0)}}@keyframes slideoutright{0%{-webkit-transform:translatez(0);transform:translatez(0)}to{visibility:hidden;-webkit-transform:translate3d(100%,0,0);transform:translate3d(100%,0,0)}}.animate__slideoutright{-webkit-animation-name:slideoutright;animation-name:slideoutright}@-webkit-keyframes slideoutup{0%{-webkit-transform:translatez(0);transform:translatez(0)}to{visibility:hidden;-webkit-transform:translate3d(0,-100%,0);transform:translate3d(0,-100%,0)}}@keyframes slideoutup{0%{-webkit-transform:translatez(0);transform:translatez(0)}to{visibility:hidden;-webkit-transform:translate3d(0,-100%,0);transform:translate3d(0,-100%,0)}}.animate__slideoutup{-webkit-animation-name:slideoutup;animation-name:slideoutup} /*动画 结束*/