@charset "utf-8"; /*==========字体 开始==========*/ /*可替换 开始*/ @font-face{font-family:"ydiconfont";src:url('//at.alicdn.com/t/font_2289826_4vnl1a5ilf9.woff2?t=1627635534963') format('woff2'),url('//at.alicdn.com/t/font_2289826_4vnl1a5ilf9.woff?t=1627635534963') format('woff'),url('//at.alicdn.com/t/font_2289826_4vnl1a5ilf9.ttf?t=1627635534963') 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: url(../images/page-dqrr.png) 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: url(" ") 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:url(" ") 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: url(" ") 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:url(../images/xxx.png) 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:url(../images/xxx.png) 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:url(" ") 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:url(" ") 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: url(" ") 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: url(" ") 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: url(../images/down.png) 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} /*动画 结束*/