﻿html {}
input,button,label,textarea,select,option {font-size:1.4rem; line-height:2.1rem;}
ul,ol,dl,p,h1,h2,h3,h4,h5,h6 {margin:0; padding:0;}
ul {list-style:none;}
ol li {margin-left:2rem; padding-left:0.5rem;}
dt {font-weight:normal;}
dd {margin:0; padding:0;}
*,*:before,*:after {box-sizing:border-box; -moz-box-sizing:border-box; -webkit-box-sizing:border-box;}
details summary {list-style:none;}
details summary:focus {outline:none;}
details summary::marker {content:"";}
details summary::-webkit-details-marker {display:none;}
h2 {width:100%; font-size:1.8rem; font-weight:normal; margin:10px auto 0; padding:5px 0; text-align:left; line-height:2.7rem; }
h3 {width:100%; font-size:.9rem; font-weight:normal; text-align:left;}
h4 {width:100%; font-size:.9rem; font-weight:normal; text-align:left;}
button:hover,details summary:hover {cursor:pointer;}
button {outline:none;}

.clear{clear: both;}
.advimg {border-radius:5px;}
.mt_05 {margin-top:5px;}
.mt_1 {margin-top:10px;}
.mt_2 {margin-top:20px;}
.mt_3 {margin-top:30px;}
.mb_05 {margin-bottom:5px;}
.mb_1 {margin-bottom:10px;}
.mb_2 {margin-bottom:20px;}
.ml_05 {margin-left:5px;}
.ml_1 {margin-left:10px;}
.ml_2 {margin-left:20px;}
.mr_05 {margin-right:5px;}
.mr_1 {margin-right:10px;}
.mr_2 {margin-right:20px;}
.align_l {text-align:left;}
.align_r {text-align:right;}
.align_c {text-align:center;}
.vertical_m {display:flex; align-items:center;}
.float_l {float:left;}
.float_r {float:right;}
/*font style*/
a:link,a:visited {text-decoration:none; color:#333;}
a:hover,a:active {text-decoration:none; color:#236ec2; cursor:pointer;}
strong,.fb {font-weight:normal;}
.fn {font-weight:normal;}
.f24 {font-size:2.4rem;}
.f20 {font-size:2rem;}
.f18 {font-size:1.8rem;}
.f16 {font-size:1.6rem;}
.f14 {font-size:1.4rem;}
.f12 {font-size:1.2rem;}
.font_white,.font_white a:link,.font_white a:visited {color:#fff;}
.font_white a:hover,.font_white a:active {color:#ff0000;}
.font_blue,.font_blue a,.font_blue a:link,.font_blue a:visited {color:#275090;}
.font_blue a:hover,.font_blue a:active {text-decoration:underline; color:#236ec2;}
.font_black {color:#333;}
.font_gray {color:#666;}
.font_red,.red {color:#bc0000;}
.font_gold,#allnum {color:#f39800;}
.font_green {color:#39823b;}
.original {font-size:1.4rem; color:#666; text-decoration:line-through;}
/* 容器 */
.wrap {width:100%; min-width:980px; padding:0.5rem 0 1rem; background:#fff;}

.alert_warning {background:#fbf9e4; border:1px solid #ffc56f; color:#a94d2c; padding:1rem 1.6rem; border-radius:0.5rem;}

.alert_warning a:link,.alert_warning a:visited {color:#f36f20; text-decoration:underline;}

.alert_warning_reg {background:#fbf9e4; border:1px solid #ffc56f; color:#a94d2c; padding:1rem 1.6rem; border-radius:0.5rem;}
.alert_warning_reg li{list-style: none;}
.alert_warning_reg a:link,.alert_warning a:visited {color:#f36f20; text-decoration:underline;}
.alert_danger {background:#fef0f0; border:1px solid #f3b7b7; color:#900; padding:1rem 1.6rem; border-radius:0.5rem;}
.alert_danger p {margin:0 0 0.5rem;}
/* 下拉小菜单 */
.dropdown {position:relative; display:inline-block;}
.dropdown-content {display:none; position:absolute; top:calc(100% + 5px); right:50%; width:auto; min-width:160px; box-shadow:0 0 5px 5px rgba(0,0,0,0.1); z-index:10002;}
.dropdown:hover .dropdown-content {display:block;}
.dropdown-content section {width:100%; padding:2rem; background:#fff; color:#333; border-radius:5px;}
.dropdown-content::before {content:""; position:absolute; top:-8px; left:calc(50% - 8px); border-top:none; border-right:8px solid transparent; border-bottom:8px solid #fff; border-left:8px solid transparent;}
.dropdown-content h3 {font-size:1.6rem; font-weight:700; text-transform:inherit;}
/* 通用表单元素 */
.form-label {display:block; text-align:left; margin:1.6rem 0 0.5rem; line-height:2.4rem;}
.must::before {content:"*"; color:#bc0000; margin-right:0.5rem;}
.form-text,.form-select,.form-textarea {padding:0 3px; display:block; width:100%; border-radius:5px; border:1px solid #ccc;}
.form-inline {display:inline; width:auto;}
.form-text:focus,.form-select:focus,.form-textarea:focus {outline:1px solid #479bf8; box-shadow:0 0 3px 3px rgba(35,110,194,0.2);}
/* 评论传图片 */
button.layui-btn {background:#ffb400; line-height:32px; height:32px; padding:0 15px; border-radius:16px;}
button.layui-btn:hover {background-color:#ffa200;}
button.layui-btn-normal {background:#ffb400 url(../images/icon_addphotos.svg) no-repeat 12px center; background-size:17px;  padding:0 15px 0 36px;}
button.inquiry-delete {background:#fff; color:#333; border:1px solid #666;}
button.inquiry-delete:hover {background:#fff; color:#bc0000; border:1px solid #bc0000;}
button.inquiry-delete::before {content:"X"; margin:0 0.5rem 0 0;}
/* 浮动表单 */
.form-floating {position:relative; margin:0 0 1.6rem;}
.form-floating > label {position:absolute; top:0; left:0; height:100%; padding:1.5rem 0.75rem; pointer-events:none; border:1px solid transparent; transform-origin:0 0; transition:opacity 0.1s ease-in-out, transform 0.1s ease-in-out; color:#666;}
@media (prefers-reduced-motion:reduce) {.form-floating > label {transition:none;}}
.form-floating > .form-text {padding:0.75rem; height:5.2rem; line-height:2.4rem;}
.form-floating > .form-text::-moz-placeholder {color:transparent;}
.form-floating > .form-text::placeholder {color:transparent;}
.form-floating > .form-text:not(:-moz-placeholder-shown) {padding-top:2.25rem; padding-bottom:0.5rem;}
.form-floating > .form-text:focus, .form-floating > .form-text:not(:placeholder-shown) {padding-top:2.25rem; padding-bottom:0.5rem;}
.form-floating > .form-text:-webkit-autofill {padding-top:2.25rem; padding-bottom:0.5rem;}
.form-floating > .form-select {padding-top:2.25rem; padding-bottom:0.5rem; color:#666;}
.form-floating > .form-text:not(:-moz-placeholder-shown) ~ label {opacity:0.65; transform:scale(0.85) translateY(-1rem) translateX(0.15rem);}
.form-floating > .form-text:focus ~ label,.form-floating > .form-text:not(:placeholder-shown) ~ label,.form-floating > .form-select ~ label {opacity:0.65; transform:scale(0.85) translateY(-1rem) translateX(0.15rem);}
.form-floating > .form-text:-webkit-autofill ~ label {opacity:0.65; transform:scale(0.85) translateY(-1rem) translateX(0.15rem);}
.form-floating > label.error {position:inherit; padding:0;}
/* 通用按钮 */
.btn-block {align-self:center; width:100%;}

.btn-primary,a.btn-primary,.btn-calculate {display:inline-block; margin-top:1.6rem; text-align:center; font-size:1.6rem; line-height:2.4rem; font-weight:normal; padding:5px 16px; border-radius:18px; background:#236ec2; border:1px solid #236ec2; color:#fff;}
.btn-primary:hover {background:#104990; border:1px solid #104990; cursor:pointer;}

.btn-dark,a.btn-dark {display:inline-block; margin-top:1.6rem; text-align:center; font-size:1.6rem; line-height:2.4rem; font-weight:normal; padding:5px 16px; border-radius:18px; background:#112d4d; border:1px solid #112d4d; color:#fff;}
.btn-dark:hover {background:#0b213a; border:1px solid #0b213a; cursor:pointer;}

.btn-highlight,a.btn-highlight {display:inline-block; margin-top:1.6rem; text-align:center; font-size:1.6rem; line-height:2.4rem; font-weight:normal; padding:5px 16px; border-radius:18px; background:#ffb400; border:1px solid #ffb400; color:#fff;}
.btn-highlight:hover {background:#ffa200; border:1px solid #ffa200; cursor:pointer;}

.btn-outline,a.btn-outline {display:inline-block; margin-top:1.6rem; text-align:center; font-size:1.6rem; line-height:2.4rem; font-weight:normal; padding:5px 16px; border-radius:18px; background:#fff; border:1px solid #104990; color:#104990;}
.btn-outline:hover {background:#ebf2fa; cursor:pointer;}

.btn-outline-black,a.btn-outline-black {display:inline-block; margin-top:1.6rem; text-align:center; font-size:1.6rem; line-height:2.4rem; font-weight:normal; padding:5px 16px; border-radius:18px; background:#fff; border:1px solid #666; color:#333;}
.btn-outline-black:hover {background:#efefef; cursor:pointer;}

.btn-outline-white,a.btn-outline-white {display:inline-block; margin-top:1.6rem; text-align:center; font-size:1.6rem; line-height:2.4rem; font-weight:normal; padding:5px 16px; border-radius:18px; background:rgba(0,0,0,0); border:1px solid #fff; color:#fff;}
.btn-outline-white:hover {background:rgba(0,0,0,0.25); cursor:pointer;}

.btn-l,a.btn-l {font-size:1.8rem;}
.btn-s,a.btn-s {font-size:1.4rem; line-height:1.8rem; margin-top:1rem; padding:2px 15px;}

/* 特殊按钮 */
.btn-downpdf,a.btn-downpdf,.btn-print,a.btn-print {display:inline-block; margin-top:1.6rem; text-align:center; font-size:1.6rem; line-height:2.4rem; font-weight:normal; padding:5px 20px 5px 50px; border-radius:22px; background:#fff url(../images/icon_downpdf.svg) no-repeat 15px center; background-size:2.6rem; border:1px solid #104990; color:#104990;}
.btn-downpdf:hover,.btn-print:hover {background-color:#ebf2fa;}
.btn-print,a.btn-print {background-image:url(../images/icon_print.svg);}
.btn-img {display:inline-block; margin-top:1.6rem; text-align:center; height:4.2rem; line-height:4.2rem;}
a.btn-checkout {display:flex; align-items:center; margin-top:1.6rem; text-align:center; font-size:1.6rem; line-height:2.4rem; font-weight:normal; padding:5px 22px; border-radius:18px; background-image:linear-gradient(to bottom, #ff9300, #ff6b00); color:#fff;}
a.btn-checkout:hover {background:#ff9300;}
a.btn-checkout::before {content:""; display:inline-block; width:24px; height:23px; margin:0 5px 0 0; background:url(../images/icon_safety.png);}
.btn-calculate {background:#236ec2 url(../images/btn_calculate.png) no-repeat right center; margin-top:0; padding:5px 40px 5px 16px;}
.btn-calculate:hover {background-color:#104990; border:1px solid #104990;}
/* 框架 */
#top_bar,#header_main,header nav,.follow,footer,.footer_copyright {width:100%; min-width:980px; margin:0 auto; padding:0 4%;}
/* 头部 */
header {width:100%;}
#top_banner {background:#fff; text-align:center; position:relative;}
#top_banner p {padding:5px 4%; color:#900;}
#top_banner p a:link,#top_banner p a:visited {color:#900; text-decoration:underline;}
#top_bar {line-height:27px; padding:2px 4%; display:flex; justify-content:space-between; align-items:center;}
#top_bar ul {display:flex;}
#top_bar ul li {margin:0 0 0 24px;}
#top_bar ul li.live_chat {width:110px; padding:0 0 0 40px; background:url(../images/btn_livechat.png) no-repeat 0 0;}
#top_bar ul li.live_chat a:link {color:#28437a;}
#header_main {padding:9px 4%; display:flex; justify-content:space-between; align-items:center; background:#232f48; color:#fff;}
.logo {flex:0 0 221px; width:221px;}
.search {flex:1 1 auto; margin:0 64px;}
.search form {width:100%; height:36px; padding:0 0 0 8px; background:#fff; border-radius:5px; display:flex; align-items:center;}
.search_btn {background:#f39800; padding:6px; border-radius:0 5px 5px 0; outline:none;}
.search #keywords_id {flex:1 1 200px; border:none; outline:none; font-size:1.4rem; color:#666;}
#auto_search {position:absolute; width:100%; top:38px; left:0; padding:5px; background:#fff; border:1px solid #ddd; border-radius:5px; z-index:10001;}
#auto_search li {padding:5px;}
#auto_search li:hover {background:#eef1f7;}
#auto_search li:hover a {color:#236ec2;}
.ordertools {flex:0 0 320px; width:320px; display:flex; justify-content:space-between; align-items:center; z-index:10001;}
#user .dropdown-content {width:160px; left:calc(50% - 80px);}
#cart .dropdown-content {width:360px; left:calc(100% - 260px);}
#cart .dropdown-content::before {left:195px;}
#cart .dropdown-content ul {max-height:26.4rem; overflow-y:auto;}
#cart .dropdown-content li {display:flex; border-bottom:1px solid #ddd; margin-bottom:1rem; padding:0 1rem 0.7rem 0;}
#cart .dropdown-content li .img {flex:0 0 6rem; margin:0.3rem 1rem 0 0;}
#cart .dropdown-content li article {flex:1 1 auto; font-size:1.4rem; line-height:2.1rem; text-align:left;}
#cart .dropdown-content li article h4 {width:100%; margin-bottom:0.4rem; display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2; text-overflow:clip; overflow:hidden;}
#cart .dropdown-content li article p {width:100%; display:flex; justify-content:space-between;}
/* 导航 */
header nav {display:flex; justify-content:left; align-items:center; width:100%; height:60px; padding:0 4%; background:#275090; color:#fff;}
#menu {display:inline-block; position:relative; margin:0 75px 0 0;}
#menu .btn {cursor:pointer; display:flex; align-items:center;}
#menu-content {display:none; width:1320px; position:absolute; top:100%; left:0; z-index:10001;}
#menu:hover #menu-content {display:block;}
.menu_wrap {position:relative; width:20%;}
#menu_first {width:100%; height:100%; padding:5px; display:flex; flex-direction:column; justify-content:space-between; background:#fff; border-radius:5px; box-shadow:0 0 5px 5px rgba(0,0,0,0.08);}
#menu_first li {padding:5px; background:url(../images/arrow_right_gray.png) no-repeat calc(100% - 5px) center; border-radius:3px;}
#menu_first li a {display:block;}
#menu_first li.on {background-color:#eef1f7; background-image:url(../images/arrow_right_blue.png);}
#menu_first li.on a {color:#104990;}
.menu_second {display:flex; justify-content:space-between; width:1050px; min-height:100%; padding:5px 15px 15px; position:absolute; top:0; left:100%; z-index:10002; background:#fff; border-radius:5px; box-shadow:0 0 5px 5px rgba(0,0,0,0.08);}
.menu_second dl {width:100%;}
.printer_parts dl {width:calc(25% - 10px);}
.photo_studio dl {width:calc(50% - 10px);}
.menu_second dl dt {margin:10px 0; padding:5px; border-top:1px solid #ddd; font-weight:bold;}
.menu_second dl dt:nth-child(1) {border:none;}
.menu_second dl dd {width:24.5%;line-height:30px;display:inline-block;}
.menu_second dl dd:hover {background-color:#eef1f7;}
.menu_second dl span {font-size:1.2rem; margin-left:5px;}
.menu_second dl span a:link,.menu_second dl span a:visited {color:#bc0000;}
a.hot::after {content:"HOT"; display:inline-block; background:#bc0000; color:#fff; margin:0 0 0 5px; padding:3px; font-size:0.8rem; line-height:0.8rem; border-radius:0.25rem;}
a.new::after {content:""; display:inline-block; width:36px; height:12px; background:url(../images/icon_new.png) no-repeat 0 0; margin:2px 0 -2px 5px;}
ul.quicknav {display:flex; flex-wrap:wrap; justify-content:left;}
ul.quicknav li {margin:0 35px 0 0;}
/* 面包屑 & banner */
.breadcrumbs {width:100%; min-width:980px; font-size:1.2rem; line-height:2.1rem; padding:1rem 0; color:#666;}
.breadcrumbs ul {width:92%; margin:0 auto;}
.breadcrumbs li {display:inline;}
.breadcrumbs li::after {content:">"; margin:0 0.6rem 0 0.8rem;}
.breadcrumbs li:nth-last-child(1)::after {content:"";}

/* 底部 */
.follow {display:flex; justify-content:space-between; align-items:center; background:#232f48; color:#fff; padding:20px 4%;}
.newsletter input {border:1px solid #ccc; border-right:none; outline:none; border-radius:5px 0 0 5px; color:#666; width:auto; min-width:280px; margin:0 0 0 6px; padding:6px 8px;}
.newsletter button {background:#f39800; color:#fff; border:none; border-radius:0 5px 5px 0; padding:7px;}
.footer_container {display:flex; justify-content:space-between;}
.footer_container dl {flex:1 1 25%; margin:20px 0 0; padding:0 15px 0 0;}
.footer_container dl dt {font-size:1.6rem; line-height:2.4rem; margin-bottom:3px;}
.footer_container img {border-radius:5px;}
.friend_link {display:flex; flex-wrap:wrap; justify-content:center; align-items:center; margin:20px 0 0; padding:10px 0; background:#fff; border-radius:5px;}
.friend_link a,.friend_link span {margin:0 10px;}
.footer_info p {margin:0 0 5px;}
.footer_service,.footer_localsites {display:flex; align-items:center; margin:20px 0 0;}
.footer_service a {margin:0 0 0 8px; padding:2px 7px; background:#275090; color:#fff; border-radius:5px;}
.footer_service a:hover,.footer_service a:active {background:#236ec2;}
.footer_localsites a {margin:0 16px 0 8px;}
.footer_copyright {margin:20px auto 0; padding:10px 4%; text-align:center; background:#232f48; color:#fff;}
.bottom_adv {display:flex; justify-content:space-between; margin:20px 0;}
.bottom_adv a {width:calc(33.3% - 10px);}
.bottom_adv a img {border-radius:5px;}
/* cookies */
.cookies {position:fixed; left:0; bottom:0; z-index:10001; width:100%; padding:20px 4%; background:rgba(0,0,0,0.65);}
/* 分页 */
.pagination {display:flex; flex-wrap:wrap; margin:3rem auto; justify-content:center; align-items:center; width:100%;}
.pagination a {line-height:22px; margin:0 5px; padding:3px 10px;border-radius:16px; transition:all 0.3s;}
.pagination a.active {background:#236ec2;color:#fff;}
.pagination a:hover:not(.active) {background:#fbc11c; color:#333;}

@media (max-width:1024px) {
    body {font-size:1.2rem; line-height:1.8rem;}
	.search {margin:0 50px;}
	ul.quicknav li {margin:0 22px 0 0;font-size:.8rem;}
    #menu {margin:0 32px 0 0;}
    #menu-content {width:942px;}
    .menu_second {width:760px;}
}
@media (min-width:1025px) and (max-width:1280px) {
	ul.quicknav li {margin:0 25px 0 0; font-size:.8rem;}
    #menu {margin:0 35px 0 0;}
    #menu-content {width:1060px;}
    .menu_second {width:940px;}
}
@media (min-width:1281px) and (max-width:1366px) {
	ul.quicknav li {margin:0 25px 0 0;}
    #menu {margin:0 35px 0 0;}
    #menu-content {width:1256px;}
    .menu_second {width:1000px;}
}
@media (min-width:1920px) {
	ul.quicknav li {margin:0 25px 0 0; font-size:1rem;}
    #menu-content {width:1766px;}
    .menu_second {width:1420px;}

}


@media (max-width:768px) {
	header nav{display: none;}
#sidebar .menu_wrap{display: none;}
	
	
}