/* =========================================================
   台南高價收購二手機 頁面專用樣式（shou.css）
   需搭配全站 /themes/zy001/css/css.css 與 Bootstrap 3 使用
   主色沿用整站：#f47721 / #ea6413 / #cc520a / #fcddc7 / #f4ebe2
   ========================================================= */

/* ---------- 區塊大標 ---------- */
.shk-title{
	font-family: 'Noto Serif TC', serif;
	font-size: 26px;
	font-weight: bold;
	color: #000;
	text-align: center;
	letter-spacing: 2px;
	line-height: 36px;
	margin: 45px 0 25px 0;
	padding: 0 10px;
	position: relative;
}
.shk-title:before,
.shk-title:after{
	content: "";
	display: inline-block;
	width: 46px;
	height: 4px;
	background: #f47721;
	border-radius: 4px;
	vertical-align: middle;
	margin: 0 14px;
}
@media (max-width: 767px){
	.shk-title{ font-size: 21px; line-height: 32px; margin: 30px 0 18px 0; }
	.shk-title:before,
	.shk-title:after{ width: 24px; margin: 0 8px; }
}

/* ---------- 三個原因卡片 ---------- */
.shk-why{ padding: 0 1%; }
.shk-card{
	background: #fff;
	border-top: 5px solid #f47721;
	box-shadow: 0px 3px 8px #ccc;
	-webkit-box-shadow: 0px 3px 8px #ccc;
	-moz-box-shadow: 0px 3px 8px #ccc;
	padding: 30px 24px;
	margin-bottom: 25px;
	min-height: 220px;
	text-align: center;
	transition: transform 300ms, box-shadow 300ms;
	-webkit-transition: transform 300ms, box-shadow 300ms;
	-moz-transition: transform 300ms, box-shadow 300ms;
}
.shk-card:hover{
	transform: translateY(-6px);
	-webkit-transform: translateY(-6px);
	box-shadow: 0px 14px 20px rgba(0,0,0,0.18);
	-webkit-box-shadow: 0px 14px 20px rgba(0,0,0,0.18);
}
.shk-num{
	display: inline-block;
	font-family: serif;
	font-style: italic;
	font-weight: bold;
	font-size: 34px;
	color: #f47721;
	line-height: 1;
}
.shk-card h3{
	font-family: 'Noto Serif TC', serif;
	font-size: 20px;
	font-weight: bold;
	color: #000;
	margin: 14px 0 12px 0;
	letter-spacing: 1px;
}
.shk-card p{
	font-size: 16px;
	color: #4a4a4a;
	line-height: 28px;
	letter-spacing: 1px;
	margin: 0;
}

/* ---------- 收購價格因素表 ---------- */
.shk-ttwrap{
	width: 100%;
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
	padding: 10px 0 5px 0;
}
.shk-table{
	width: 100%;
	min-width: 640px;
	border-collapse: collapse;
	background: #fff;
	box-shadow: 6px 6px 0px #f4ebe2;
	-webkit-box-shadow: 6px 6px 0px #f4ebe2;
	-moz-box-shadow: 6px 6px 0px #f4ebe2;
}
.shk-table th{
	background: linear-gradient(to left, #ef8f4e, #e9792c);
	color: #fff;
	font-size: 17px;
	font-weight: bold;
	letter-spacing: 2px;
	padding: 14px 12px;
	text-align: center;
	border: 1px solid #e9792c;
}
.shk-table td{
	border: 1px solid #eee;
	padding: 13px 14px;
	font-size: 16px;
	color: #4a4a4a;
	line-height: 26px;
	letter-spacing: 1px;
	vertical-align: middle;
}
.shk-table td:first-child{
	width: 22%;
	color: #000;
	text-align: center;
}
.shk-table td:nth-child(2){
	width: 16%;
	text-align: center;
}
.shk-table tbody tr:nth-child(even){ background: #faf7f4; }
.shk-table tbody tr:hover{ background: #fcddc7; }
.shk-lev{
	display: inline-block;
	background: #f4ebe2;
	color: #c55500;
	font-size: 14px;
	font-weight: bold;
	line-height: 22px;
	padding: 2px 14px;
	border-radius: 20px;
	-webkit-border-radius: 20px;
	-moz-border-radius: 20px;
	white-space: nowrap;
}
.shk-levh{
	background: #f47721;
	color: #fff;
}

/* ---------- 說明／聲明條 ---------- */
.shk-note{
	clear: both;
	width: 100%;
	font-size: 14px;
	color: #999;
	letter-spacing: 1px;
	line-height: 24px;
	margin: 8px 0 20px 0;
	padding: 0 5px;
}

/* ---------- 收購品類卡片 ---------- */
.shk-cate{ padding: 0 1%; }
.shk-catecard{
	background: #fff;
	border: 1px solid #f0f0f0;
	box-shadow: 0px 56px 36px -60px #3e3e3e;
	-webkit-box-shadow: 0px 56px 36px -60px #3e3e3e;
	-moz-box-shadow: 0px 56px 36px -60px #3e3e3e;
	padding: 0 0 18px 0;
	margin-bottom: 25px;
	text-align: center;
	transition: transform 300ms;
	-webkit-transition: transform 300ms;
	-moz-transition: transform 300ms;
}
.shk-catecard:hover{
	transform: translateY(-6px);
	-webkit-transform: translateY(-6px);
}
.shk-catecard img{
	width: 100%;
	padding: 8px;
	background: #fff;
}
.shk-catecard h3{
	font-family: 'Noto Serif TC', serif;
	font-size: 19px;
	font-weight: bold;
	color: #000;
	letter-spacing: 1px;
	margin: 10px 0 8px 0;
}
.shk-catecard p{
	font-size: 15px;
	color: #666;
	line-height: 26px;
	letter-spacing: 1px;
	padding: 0 16px;
	margin: 0;
}

/* ---------- 賣前 3 步驟 ---------- */
.shk-steps{ padding: 0 1%; }
.shk-stepcard{
	position: relative;
	background: #fff;
	border: 1px solid #eee;
	box-shadow: 6px 6px 0px rgba(0,0,0,0.1);
	-webkit-box-shadow: 6px 6px 0px rgba(0,0,0,0.1);
	-moz-box-shadow: 6px 6px 0px rgba(0,0,0,0.1);
	padding: 34px 24px 24px 24px;
	margin-bottom: 25px;
	min-height: 250px;
}
.shk-stepnum{
	position: absolute;
	top: -16px;
	left: 24px;
	background: linear-gradient(to left, #ef8f4e, #e9792c);
	color: #fff;
	font-weight: bold;
	font-size: 15px;
	letter-spacing: 2px;
	line-height: 1;
	padding: 9px 18px;
	border-radius: 25px;
	-webkit-border-radius: 25px;
	-moz-border-radius: 25px;
	box-shadow: 0px 3px 8px rgba(0,0,0,0.2);
	-webkit-box-shadow: 0px 3px 8px rgba(0,0,0,0.2);
}
.shk-stepcard h3{
	font-family: 'Noto Serif TC', serif;
	font-size: 20px;
	font-weight: bold;
	color: #000;
	margin: 8px 0 12px 0;
	padding-bottom: 10px;
	border-bottom: 3px solid #fbd0b3;
	letter-spacing: 1px;
}
.shk-stepcard p{
	font-size: 16px;
	color: #4a4a4a;
	line-height: 28px;
	letter-spacing: 1px;
	margin: 0;
}

/* ---------- FAQ 手風琴 ---------- */
.shk-faq{ width: 100%; }
.shk-faq details{
	background: #fff;
	border: 1px solid #eee;
	border-left: 5px solid #f47721;
	box-shadow: 0px 3px 8px #ccc;
	-webkit-box-shadow: 0px 3px 8px #ccc;
	margin-bottom: 14px;
}
.shk-faq summary{
	list-style: none;
	cursor: pointer;
	padding: 16px 52px 16px 18px;
	font-size: 17px;
	font-weight: bold;
	color: #000;
	line-height: 26px;
	letter-spacing: 1px;
	position: relative;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}
.shk-faq summary::-webkit-details-marker{ display: none; }
.shk-faq summary:after{
	content: "+";
	font-family: serif;
	font-size: 24px;
	font-weight: bold;
	color: #f47721;
	position: absolute;
	right: 18px;
	top: 50%;
	transform: translateY(-50%);
	-webkit-transform: translateY(-50%);
	transition: transform 200ms;
	-webkit-transition: transform 200ms;
}
.shk-faq details[open] summary:after{ content: "−"; }
.shk-faq summary:hover{ color: #c55500; }
.shk-faq details[open] summary{ color: #c55500; }
.shk-faqbody{
	padding: 4px 18px 18px 18px;
	font-size: 16px;
	color: #4a4a4a;
	line-height: 28px;
	letter-spacing: 1px;
	border-top: 1px dashed #fbd0b3;
	padding-top: 14px;
	margin: 0 18px 0 0;
	margin-left: 0;
}
.shk-faq details[open] .shk-faqbody{
	margin-right: 0;
	padding-right: 18px;
}

/* ---------- CTA 區塊 ---------- */
.shk-cta{
	clear: both;
	background: linear-gradient(to left, #ef8f4e, #e9792c);
	box-shadow: 6px 6px 0px #f4ebe2;
	-webkit-box-shadow: 6px 6px 0px #f4ebe2;
	-moz-box-shadow: 6px 6px 0px #f4ebe2;
	text-align: center;
	color: #fff;
	padding: 40px 24px;
	margin: 40px 0 30px 0;
}
.shk-cta h2{
	font-family: 'Noto Serif TC', serif;
	font-size: 26px;
	font-weight: bold;
	color: #fff;
	letter-spacing: 2px;
	margin: 0 0 14px 0;
}
.shk-cta p{
	font-size: 16px;
	line-height: 28px;
	letter-spacing: 1px;
	max-width: 720px;
	margin: 0 auto 22px auto;
	color: #fff;
}
.shk-cta .hripjs{
	background: #fff;
	border-color: #fff;
	color: #e9792c;
	font-size: 20px;
	font-weight: bold;
	padding: 10px 26px;
}
.shk-cta .hripjs:hover{
	background: #cc520a;
	border-color: #cc520a;
	color: #fff;
}
.shk-links{ margin-top: 24px; }
.shk-links a{
	display: inline-block;
	background: rgba(255,255,255,0.16);
	border: 1px solid rgba(255,255,255,0.6);
	color: #fff;
	font-size: 15px;
	letter-spacing: 1px;
	line-height: 20px;
	padding: 7px 18px;
	margin: 5px 6px;
	border-radius: 25px;
	-webkit-border-radius: 25px;
	-moz-border-radius: 25px;
	transition: all 300ms;
	-webkit-transition: all 300ms;
}
.shk-links a:hover{
	background: #fff;
	color: #e9792c;
	text-decoration: none;
}

/* ---------- 收購實例圖塊微調（沿用全站 proh/proimg/prot）---------- */
.indexpropage .proh{ margin-bottom: 25px; }
.indexpropage .prot{
	font-size: 15px;
	color: #4a4a4a;
	line-height: 24px;
	letter-spacing: 1px;
}

/* ---------- 響應式 ---------- */
@media (max-width: 1023px){
	.shk-card{ min-height: 190px; }
	.shk-stepcard{ min-height: 230px; }
}
@media (max-width: 900px){
	.shk-card{ min-height: 0; }
	.shk-stepcard{ min-height: 0; }
	.shk-cta h2{ font-size: 22px; }
}
@media (max-width: 767px){
	.shk-card{ padding: 24px 18px; }
	.shk-card h3{ font-size: 18px; }
	.shk-card p{ font-size: 15px; line-height: 26px; }
	.shk-table td{ font-size: 15px; padding: 11px 10px; }
	.shk-table th{ font-size: 15px; padding: 11px 8px; }
	.shk-catecard p{ font-size: 14px; line-height: 24px; padding: 0 12px; }
	.shk-stepcard{ padding: 30px 18px 20px 18px; }
	.shk-stepcard h3{ font-size: 18px; }
	.shk-stepcard p{ font-size: 15px; line-height: 26px; }
	.shk-faq summary{ font-size: 16px; padding: 14px 44px 14px 14px; }
	.shk-faqbody{ font-size: 15px; line-height: 26px; padding-right: 14px; }
	.shk-cta{ padding: 30px 16px; }
	.shk-cta h2{ font-size: 20px; }
	.shk-cta p{ font-size: 15px; line-height: 26px; }
	.shk-cta .hripjs{ font-size: 18px; letter-spacing: 0px; }
}