﻿.product-info { width: 1220px; margin: auto; }

.topic { }
.topic > div { width: 1220px; margin: auto; }
.topic .num { padding-bottom: 24px; }
.topic .num span { font-size: 20px; font-weight: bold; margin-right: 4px; }


.cover { width: 260px; margin-right: 24px; }
.cover > div { }
.cover img { max-width: 100%; max-height: 100%; position: relative; top: 50%; left: 50%; transform: translate(-50%,-50%); }
.cover .pic { height: 240px; position: relative; border: 1px solid #eee; }
.cover .pic .ico24 { position: absolute; top: 10px; right: 10px; display: none; cursor: pointer; }
.cover .pic .ico24:hover { opacity: 0.8; }
.cover .pic:hover .ico24 { display: block; }
.cover .picmore { overflow: hidden; height: 60px; padding: 8px 24px; position: relative; }
.cover .picmore .items { margin: auto; position: relative; height: 100%; overflow: hidden; }
.cover .picmore .wrap { position: absolute; left: 0px; top: 0px; height: 100%; }
.cover .picmore .item { float: left; width: 56px; height: 56px; margin: 0px 8px; border: 2px solid #fff; }
.cover .picmore .active { border: 2px solid #e53e41; }
.cover .buttons { position: absolute; top: 8px; line-height: 60px; background: #f5f5f5; cursor: pointer; }
.cover .buttons:hover { opacity: 0.8; }
.cover .buttons-left { left: 0px; }
.cover .buttons-right { right: 0px; }
.cover .btn-deep { width: 100%; height: 36px; line-height: 36px; border-radius: 4px; margin-top: 16px; }

.prices { width: 640px; }
.prices table { width: 100%; }
.prices th { background: #F8F7F7; height: 40px; text-align: center !important; }
.prices td { height: 43px; border-bottom: 1px solid #eee; text-align: center }
.prices .cel1 { width: 25%; }
.prices .cel2 { width: 25%; }
.prices .cel3 { width: 25%; }
.prices .cel4 { width: 25%; }
.prices .btn-deep { display: inline-block; width: 64px; height: 24px; line-height: 24px; background: #E95314; text-align: center; border-radius: 2px; margin: 0px 4px; }
.prices .btn-deep .ico { filter: brightness(100); }

.note { background: #e7f0f7; padding:16px;  }
.note .title { color: #E95314; font-size: 16px; }
.note .items .fll { line-height: 24px; padding-top:8px;}

.note .flr .btn-deep { background: #E95314; width: 128px; height: 36px; line-height: 36px; border-radius: 4px; margin-top: 14px;text-align:center; }
.note .flr .btn-deep a { text-decoration:none;}

.download { width: 274px; }
.download .items { }
.download .item { margin-bottom: 32px; }

.download .item .name { padding-left: 24px; line-height: 40px; background: #F8F7F7; font-weight: bold; }
.download .item .desc { padding-top: 12px; }
.download .item a { float: left; display: block; width: 25%; text-align: center; padding-top: 8px; }
.download .item a:last-child { margin-right: 0px; }
.download .item a p { padding-top: 8px; }
.download .item .desc > div { display: inline-block; width: 60px; text-align: center; padding-top: 8px; margin-right: 6px; }
.download .item .desc > div:last-child { margin-right: 0px; }
.download .item .desc > div p { padding-top: 8px; }

.product-fields { width: 1220px; margin: auto; padding-top: 50px; }
.product-fields > .fll { width: 924px; }
.product-fields > .flr { width: 274px; }

.product-price { width: 640px; }
.fields-top { margin-top: 12px;  word-spacing: -10px; border-bottom: 1px solid #E9E9E9;margin-bottom:24px; }
.fields-top:after { display: none; }
.fields-top .item { min-width: 50%; min-height: 19px; display: inline-block; margin-bottom: 24px; word-break: break-all; }
.fields-top .item span { display: inline-block; min-width: 144px; word-spacing: 0px; vertical-align: top; }
.fields-top .item label { display: inline-block; word-spacing: 0px; }
.fields-top .item-long { width: 100%; }

.fieldsgroup { }
.fieldsgroup > div { }
.fieldsgroup .title { font-size: 18px; font-weight: bold; color: #07619D; padding-bottom: 16px; border-bottom: 3px solid #F3F6FB; }
.fieldsgroup .item { margin-top: 50px; }
.fieldsgroup .item:first-child { margin-top: 0px; }
.fieldsgroup .item:first-child .info { display:block;}
.fieldsgroup .info { display: flex; flex-wrap: wrap; align-items: flex-start; }
.fieldsgroup .wrap { flex-basis: 50%; padding: 10px; }
.fieldsgroup .info div { break-inside: avoid; line-height: 23px; font-size: 0px; padding-top: 18px; padding-right: 12px; }
.fieldsgroup .info div img { max-height: 40px; }

.fieldsgroup .info .name { display: inline-block; vertical-align: top; width: 178px; font-size: 14px; font-weight: bold; }
.fieldsgroup .info .desc { display: inline-block; vertical-align: top; width: 272px; font-size: 14px; color: #666; word-wrap: break-word; }
.fieldsgroup .info .desc a { word-wrap: break-word; }
.fieldsgroup .info .item-line { break-inside: auto; }
.fieldsgroup .info .item-line .desc { width: 660px; }
.fieldsgroup .info .item-line2 { break-inside: auto; }
.fieldsgroup .info .item-line2 .name { width: 300px; }
.fieldsgroup .info .item-line2 .desc { width: 400px; }

.document { }
.document > div { }
.document .title { font-size: 20px; font-weight: bold; color: #07619D; padding-bottom: 16px; border-bottom: 3px solid #F3F6FB; margin-bottom: 24px; }

.document .items { }
.document .item { background: #F8F7F7; padding: 18px; border-bottom: 1px solid #eee; }
.document .item:last-child { border-bottom: none; }
.document .item .name a { vertical-align: middle; margin: 2px 0px 0px 8px; }
.document .item .desc { padding: 10px 0px 0px 30px; color: #666; line-height: 28px; }

.similar { }
.similar .title { font-size: 20px; font-weight: bold; color: #07619D; padding-bottom: 16px; border-bottom: 3px solid #F3F6FB; margin-bottom: 24px; }
.similar .item { margin-bottom: 12px; position: relative; }
.similar .item .pic { float: left; width: 94px; height: 94px; border: 1px solid #eee; }
.similar .item .pic img { max-width: 100%; max-height: 100%; position: relative; top: 50%; left: 50%; transform: translate(-50%,-50%); }
.similar .item .info { float: right; width: 165px; padding: 14px 0px; border-bottom: 1px solid #eee; }
.similar .item div { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.similar .item .num { font-weight: bold; }
.similar .item .name { color: #666; margin: 10px 0px 4px 0px; }
.similar .item .desc { color: #666; }
.similar .item .buttons { position: absolute; left: 4px; top: 4px; display: none; }
.similar .item .pic:hover .buttons { display: block; }

.detail { }
.detail > div { width: 1220px; margin: auto; margin-bottom: 16px; }
.detail .title { font-size: 20px; font-weight: bold; color: #07619D; padding-bottom: 16px; border-bottom: 3px solid #F3F6FB; margin-bottom: 24px; }
.detail .info { }
.detail .active:before { content: ""; position: absolute; top: 0px; left: 0px; width: 4px; height: 100%; }

.section .nodata { background: none; text-align: left; }
.section { padding-top: 50px; }
.section:first-child { padding-top: 0px; }


.products { }
.products > div { width: 1220px; margin: auto; }
.products .title { font-size: 20px; font-weight: bold; color: #07619D; line-height: 24px; padding-bottom: 16px; border-bottom: 3px solid #F3F6FB; margin-bottom: 24px; }
.products .title .flr { font-size: 14px; font-weight: bold; color: #333; }

.products .items { height: 332px; position: relative; overflow: hidden; border-left: 1px solid #eee; margin-bottom: 24px; }
.products .wrap { height: 332px; position: absolute; left: 0px; top: 0px; white-space: nowrap; font-size: 0px; }
.products .item { display: inline-block; width: 243px; height: 332px; margin: 0 0 -1px -1px; position: relative; line-height: 20px; border: 1px solid #EFF2F6; box-sizing: border-box; transition: all 0.5s; position: relative; background: #fff; font-size: 14px; vertical-align: top; }
.products .item a { height: 100%; padding: 16px 14px; box-sizing: border-box; text-decoration: none; }
.products .item .pic { width: 96%; height: 170px; margin: 0px auto 42px; }
.products .item .pic img { max-width: 100%; max-height: 100%; position: relative; top: 50%; left: 50%; transform: translate(-50%,-50%); }
.products .item .info { font-weight: bold; }
.products .item .num { float: left; margin-right: 16px; }
.products .item .term { float: left; }
.products .item .purity { float: right; }
.products .item .name { font-size: 12px; margin: 8px 0px 14px 0px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.products .item .btn-deep { width: 70px; height: 30px; line-height: 30px; position: absolute; left: 16px; bottom: 16px; border-radius: 2px; }

.products .item .term span:after { content: ""; display: inline-block; vertical-align: middle; width: 1px; height: 14px; background: #ddd; margin: -2px 4px 0px 6px; }
.products .item .term span:last-child:after { display: none; }
.products .item .price { font-weight: bold;display:none; }
.products .item .buttons { position: absolute; top: 4px; right: 4px; cursor: pointer; display: none; }
.products .item:hover .buttons { display: block; }
.products .item .tags { position: absolute; top: 12px; left: 12px; line-height: 20px; color: #fff; font-size: 12px; }
.products .item .tags span { display: inline-block; height: 20px; padding: 0px 4px; border-radius: 3px; }
.products .item:hover { box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.05), 0px 10px 15px rgba(0, 0, 0, 0.1); }

.products .indexs { }
.products .indexs .ico { width: 10px; height: 10px; transform: rotate(45deg); margin-right: 8px; }
.products .indexs .ico:last-child { margin-right: 0px; }

.products:last-child { margin-bottom: 96px; }


.cartflyer { width: 30px; height: 30px; border-radius: 50%; }
#Product .info { display: block !important; }
