.e_ContentMajorStyleBox-001{ height:auto; height-and-height-uint:auto; width:100%; width-and-width-uint:100%; width-uint:%; } .e_ContentMajorStyleBox-001 .stylebox_top{ height:40px; width:auto; background-color:rgba(101, 190, 186, 1); } .e_ContentMajorStyleBox-001 .title_icon{ vertical-align:middle; margin-right:10px; line-height:40px; color:rgba(255,255,255,1); font-size:medium; display:inline-block; } .e_ContentMajorStyleBox-001 .title_icon::before{ content:""; } .e_ContentMajorStyleBox-001 .title_main{ vertical-align:middle; line-height:40px; max-width:600px; color:rgba(255,255,255,1); text-overflow:ellipsis; overflow:hidden; font-size:16px; white-space:nowrap; display:inline-block; font-weight:normal; } .e_ContentMajorStyleBox-001 .title_sub{ vertical-align:middle; line-height:40px; color:rgba(255,255,255,1); font-size:14px; margin-left:10px; display:inline-block; font-weight:normal; } .e_ContentMajorStyleBox-001 .stylebox_title{ vertical-align:bottom; padding-right:15px; padding-left:15px; height:inherit; font-size:0px; width:auto; white-space:nowrap; background-color:rgba(101, 190, 186, 1); display:inline-block; } .e_ContentMajorStyleBox-001 .stylebox_link{ vertical-align:middle; margin-right:15px; height:inherit; color:#666666; font-size:14px; display:table; border-width:0px; padding:0 15px; float:right; } .e_ContentMajorStyleBox-001 .stylebox_link a{ vertical-align:middle; color:inherit; display:table-cell; } .e_ContentMajorStyleBox-001 .link_icon{ margin-left:5px; display:inline-block; } .e_ContentMajorStyleBox-001 .link_icon::before{ content:'\e6af'; } .e_ContentMajorStyleBox-001 .stylebox_top_line{ height:1px; height-and-height-uint:1px; background-color:rgba(240, 240, 240, 0); } .e_ContentMajorStyleBox-001 .stylebox_content{ height:calc(100% - 48px); height-and-height-uint:calc(100% - 48px); width:100%; width-and-width-uint:100px; border-style:solid; border-color:#f0f0f0; border-width:0px; width-uint:%; } .e_ContentMajorStyleBox-001 .stylebox_bottom_line{ height:1px; background-color:rgba(240, 240, 240, 0); height-and-height-uint:1px; }.c_product_list-00349003 { overflow: hidden; width: 925px; height: 1111px; position: absolute; } .clearfix:before, .clearfix:after { display: table; content: ""; line-height: 0px; } .clearfix:after { clear: both; } .clearfix { *zoom: 1; } .common-padd { margin: 0 auto; } .product-list li { width: calc((100% - 60px)/3); float: left; margin:0 10px 30px; } .product-list li figure { background-color: #eee; height: 200px; display: block; line-height: normal; overflow: hidden; position: relative; } .product-list li figure img { display: block; width: 100%; height: auto; transition: 424ms linear; } .product-list li figcaption { display: block; color: #5d5d5d; font-size: 14px; line-height: normal; margin-top: 10px; transition: 350ms; position: relative; padding-bottom:10px; background:url(/img/linebg.jpg?tenantId=59688&viewType=1) no-repeat left bottom; } .product-list li figcaption span{ float:right; } .product-list li figcaption:before { content: ""; width: 100%; height: 1px; background: #007bc1; position: absolute; left: 0; bottom: 0; transform-origin: 100%; -webkit-transform-origin: 100%; -webkit-transition: -webkit-transform .4s cubic-bezier(.4, 0, .2, 1); transition: -webkit-transform .4s cubic-bezier(.4, 0, .2, 1); transition: transform .4s cubic-bezier(.4, 0, .2, 1); transition: transform .4s cubic-bezier(.4, 0, .2, 1), -webkit- transform .4s cubic-bezier(.4, 0, .2, 1); transform: scaleX(0); -webkit-transform: scaleX(0); visibility: hidden\9; } .product-list li:hover figcaption:before{ transform: scaleX(1); -webkit-transform: scaleX(1); -moz-transform: scaleX(1); transform-origin: 0; -webkit-transform-origin: 0; visibility: visible\9; } .product-list li:hover figcaption:before{ opacity: 1; transform: scaleY(1); -webkit-transform: scaleY(1); -moz-transform: scaleY(1); visibility: visible; } .product-box .product-down { float: left; } .product-list li figure mark { position: absolute; left: 0; top: 0; box-sizing: border-box; width: 100%; height: 100%; background: rgba(0,0,0,.6); background: #017bc2\9; filter: alpha(opacity=60); z-index: 20; opacity: 0; transform: skewX(45deg); visibility: hidden; transition: 360ms; } .product-list li figure mark b { display: block; width:60px; height: 46px; position: absolute; left: 50%; top: 50%; margin-left: -30px; margin-top: -15px; z-index: 30; } .product-list li figure mark b:before { content: ""; width: 100%; height: 1px; background: #fff; position: absolute; left: 0; top: 23px; transform: translateX(-200px); -webkit-transform: translateX(-200px); -moz-transform: translateX(-200px); } .product-list li figure mark b:after { content: "了解更多"; width:100%; text-align:center; position: absolute; left:0; top: 0; color:#fff; transform: translateY(-200px); -webkit-transform: translateY(-200px); -moz-transform: translateY(-200px); } .product-list li figure mark:before { content: ""; width: 100%; height: 0%; border-left: 3px solid #017bc2; border-right: 3px solid #017bc2; box-sizing: border-box; position: absolute; left: 0; top: 0; transition: 320ms; } .product-list li figure mark:after { content: ""; width: 0%; height: 100%; border-top: 3px solid #017bc2; border-bottom: 3px solid #017bc2; box-sizing: border-box; position: absolute; left: 0; top: 0; transition: 320ms; } .product-list li:hover figure mark { opacity: 1; transform: skewX(0); visibility: visible; } .product-list li:hover figure mark:before { height: 100%; transition: 330ms 200ms; } .product-list li:hover figure mark:after { width: 100%; transition: 330ms 200ms; } .product-list li:hover figure img { transform: scale(1.05); -webkit-transform: scale(1.05); -moz-transform: scale(1.05); } .product-list li:hover figure mark b:before { transition: 355ms 180ms; transform: translateX(0); -webkit-transform: translateX(0); -moz-transform: translateX(0); } .product-list li:hover figure mark b:after { transition: 355ms 240ms; transform: translateY(0); -webkit-transform: translateY(0); -moz-transform: translateY(0); } .product-list li:hover figcaption { color: #017bc2; } .p_page div { float: left; line-height: 30px; margin-left: 2px; } .e_pagebox { width: auto; height: auto; clear: both; float: right; margin-right: 30px; margin-top: 30px; margin-bottom: 30px; position: relative; } .p_page .pre { display: inline-table; float: left; margin-left: 18px; margin-right: 5px; } .p_page .pageNum { display: inline-block; position: static; float: left; margin-right: 5px; line-height: 30px; } .p_page .next { display: inline-table; float: left; } .p_page .PageInterval { display: inline-block; position: static; float: left; margin-right: 5px; line-height: 38px; font-size: 12px; } .p_page .p_PageInterval { display: inline-block; position: static; float: left; margin-right: 5px; line-height: 38px; font-size: 12px; } .p_page .pre:after { content: ""; display: none; position: absolute; top: 5px; left: -14px; width: 27px; height: 27px; background-color: rgba(242, 242, 242, 1); font-size: 0; line-height: 0; -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -o-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg); z-index: -1; } .p_page .pre:hover:after { top: 4px; left: -12px; background-color: rgba(0,124,194, 1); border-radius: 4px 0 0 0; -webkit-box-shadow: 0 3px 0px rgba(90, 90, 90, 0.8); -moz-box-shadow: 0 3px 0px rgba(90, 90, 90, 0.8); box-shadow: 0 3px 0px rgba(90, 90, 90, 0.8); -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -o-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg); z-index: -1; } .p_page .pre:active:after { top: 8px; left: -12px; width: 28px; height: 25px; background-color: rgba(0,124,194, 1); border-radius: 0 3px 0 0; -webkit-box-shadow: 0 3px 0px rgba(90, 90, 90, 0.8); -moz-box-shadow: 0 3px 0px rgba(90, 90, 90, 0.8); box-shadow: 0 3px 0px rgba(90, 90, 90, 0.8); -webkit-transform: rotate(-226deg); -moz-transform: rotate(-226deg); -o-transform: rotate(-226deg); -ms-transform: rotate(-226deg); transform: rotate(-226deg); z-index: -1; } .p_page .pre { height: 30px; color: rgba(102, 102, 102, 1); border-width: 0; border-style: solid; border-color: rgba(255,255,255,0); background-color: rgba(242, 242, 242, 1); text-align: center; padding-top: 0; padding-right: 20px; padding-left: 20px; position: relative; left: 0; top: 0; } .p_page .pre:hover { color: rgba(255,255,255,1); border-width: 0; border-style: solid; border-color: rgba(255,255,255,0); background-color: rgba(0,124,194,1); cursor: pointer; } .p_page .pre:active { background-color: rgba(0,124,194, 1); } .p_page .pre .font { display: table-cell; vertical-align: middle; bottom: 0; font-size: 12px; } .p_page .pre:hover .iconfont { color: rgba(255,255,255,1); } .p_page .pre:active .iconfont { color: rgba(255,255,255,1); } .p_page .pre .iconfont:before { content: ""; margin-right: 5px; } .p_page .next:after { content: ""; display: none; position: absolute; top: 5px; right: -14px; width: 27px; height: 27px; background-color: rgba(0,124,194, 1); font-size: 0; line-height: 0; -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -o-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg); z-index: -1; } .p_page .next:hover:after { top: 5px; right: -12px; background-color: rgba(0,124,194, 1); border-radius: 4px 0 0 0; -webkit-box-shadow: 0 3px 0px #777; -moz-box-shadow: 0 3px 0px #777; box-shadow: 0 3px 0px #777; -webkit-transform: rotate(-45deg); -moz-transform: rotate(-45deg); -o-transform: rotate(-45deg); -ms-transform: rotate(-45deg); transform: rotate(-45deg); z-index: -1; width: 26px; height: 26px; } .p_page .next:active:after { top: 8px; right: -12px; width: 27px; height: 24px; background-color: rgba(0,124,194, 1); border-radius: 0 3px 0 0; -webkit-box-shadow: 0 3px 0px #777; -moz-box-shadow: 0 3px 0px #777; box-shadow: 0 3px 0px #777; -webkit-transform: rotate(226deg); -moz-transform: rotate(226deg); -o-transform: rotate(226deg); -ms-transform: rotate(226deg); transform: rotate(226deg); z-index: -1; } .p_page .next { height: 30px; color: rgba(255, 255, 255, 1); border-width: 0; border-style: solid; border-color: rgba(255,255,255,0); background-color: rgba(0,124,194, 1); text-align: center; padding-top: 0; padding-right: 20px; padding-left: 20px; position: relative; left: 0; top: 0; } .p_page .next:hover { color: rgba(255,255,255,1); border-width: 0; border-style: solid; border-color: rgba(255,255,255,0); background-color: rgba(0,124,194,1); cursor: pointer; } .p_page .next:active { background-color: rgba(0,124,194, 1); } .p_page .next .font { display: table-cell; vertical-align: middle; bottom: 0; font-size: 12px; } .p_page .next:hover .iconfont { color: rgba(255,255,255,1); } .p_page .next:active .iconfont { color: rgba(255,255,255,1); } .p_page .next .iconfont:before { content: ""; margin-top: 3px; float: right; margin-left: 5px; } .p_page .pageNum { position: absolute; background-size: 100% 100%; color: inherit; cursor: pointer; display: table; font-family: inherit; font-size: 14px; font-weight: inherit; height: inherit; text-decoration: none; width: inherit; } .p_page .pageNum { height: 30px; width: 30px; color: rgba(102, 102, 102, 1); border-width: 0; border-style: solid; border-color: rgba(255,255,255,0); background-color: rgba(242, 242, 242, 1); text-align: center; position: relative; } .p_page .pageNum:hover { color: rgba(255,255,255,1); border-width: 0; border-style: solid; border-color: rgba(255,255,255,0); cursor: pointer; text-decoration: none; background-color: rgba(0,124,194,1); } .p_page .pageNum:active { text-decoration: none; background-color: rgba(0,124,194, 1); } .p_page .pageNum.active { text-decoration: none; background-color: rgba(0,124,194, 1); color: rgba(255,255,255,1); } .p_page .pageNum .font { display: table-cell; vertical-align: middle; bottom: 0; } .p_page .pageNum .iconfont { display: inline; color: rgba(255,255,255,1); vertical-align: middle; } .p_page .pageNum:hover .iconfont { color: rgba(255,255,255,1); } .p_page .pageNum:active .iconfont { color: rgba(255,255,255,1); } .p_page .pageNum .iconfont:before { content: ""; } .p_page .PageInterval { line-height: 30px; cursor: text; color: rgba(102,102,102,1); } .p_page .p_PageInterval { line-height: 30px; cursor: text; color: rgba(102,102,102,1); } .p_OccupyBox { margin: 0; width: auto; height: auto; padding: 0; border: none; overflow: hidden; } .clear { clear: both; } .c_product_list-00349003 .p_Product {width:calc((100% - 0px)/3); margin:0px; margin-top:0px; margin-right:0px; margin-bottom:0px; margin-left:0px; } .c_product_list-00349003 .p_CommonSummaryBoxA {text-align:center; } .c_product_list-00349003 .p_MatteIcon .iconfont:before {content:'\e602'; } .c_product_list-00349003 .p_page .pre .iconfont:before {shadow-angle:0px; shadow-distance:0px; shadow-angle-ofInset:0px; shadow-distance-ofInset:0px; } .c_product_list-00349003 .p_page .next .iconfont:before {shadow-angle:0px; shadow-distance:0px; shadow-angle-ofInset:0px; shadow-distance-ofInset:0px; } .c_product_list-00349003 >div {animation-fill-mode:both; } .p_PromptNoneData { width: auto; background-color: inherit; text-align: center; } .p_PromptNoneData .prompt_title .iconfont:before { content: ""; } .p_PromptNoneData .prompt_title .first { height: auto; display: table-cell; font-size: 32px; position: relative; color: #28166f; vertical-align: middle; padding: 0 10px 5px 0; } .p_PromptNoneData .prompt_title { display: inline-table; padding: 0 30px; min-height: 200px; height: 100%; } .p_PromptNoneData .prompt_title .first:before { content: "\e6b4"; } .p_PromptNoneData .prompt_title .font { font-size: 18px; display: table-cell; line-height: normal; vertical-align: middle; color: rgba(51,51,51,1); font-weight: bold; text-align: left; } .p_PromptNoneData .promptbox { width: auto; height: 100%; padding:10% 0; } .p_PromptNoneData .prompt_content { font-size: 14px; color: rgba(105, 105, 105,1); padding-left: 65px; }@CHARSET "UTF-8"; *{ padding: 0; margin: 0; }.pagebox,#-remove--flag{}body,#-remove--flag{}#c_product_list-15263534431642746 .p_Product{width:calc((100% - 0px)/3); margin:0px; margin-top:0px; margin-right:0px; margin-bottom:0px; margin-left:0px; }#c_product_list-15263534431642746 .p_CommonSummaryBoxA {text-align:center; }#c_product_list-15263534431642746 .p_MatteIcon .iconfont:before{content:'\e602'; }#c_product_list-15263534431642746 >div{animation-fill-mode:both; }#c_product_list-15263534431642746 .p_page .pre .iconfont:before{shadow-angle:0px; shadow-distance:0px; shadow-angle-ofInset:0px; shadow-distance-ofInset:0px; }#c_product_list-15263534431642746 .p_page .next .iconfont:before{shadow-angle:0px; shadow-distance:0px; shadow-angle-ofInset:0px; shadow-distance-ofInset:0px; }#c_product_list-15263534431642746{ position:absolute; top:538px; left:0px; z-index:111; width:1200px; height:614px; }