@charset "UTF-8";
.demo {
	width: calc(((100% - 120px) / 4 * 1));
	margin-left: 15px;
	margin-right: 15px;
	margin-bottom: 30px;
	height: 150px;
	background: #000;
	-webkit-transition: all 0.5s cubic-bezier(0.26, 0.64, 0.64, 1.18);
	transition: all 0.5s cubic-bezier(0.26, 0.64, 0.64, 1.18);
}

.demo:hover {
	-webkit-transform: scale(1.05);
	    -ms-transform: scale(1.05);
	        transform: scale(1.05);
}

.demo img {
	width: 100%;
	aspect-ratio: 4/3;
	-o-object-fit: contain;
	   object-fit: contain;
}

.demo2 {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	background: #de2d75;
}

.demo2 img {
	width: 100%;
	aspect-ratio: 4/3;
	-o-object-fit: contain;
	   object-fit: contain;
}

.demo-h {
	display: block;
}

.demo-h img {
	display: block;
	width: 100%;
	height: auto;
	-webkit-box-pack: end;
	    -ms-flex-pack: end;
	        justify-content: flex-end;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
}

/*測試*/
.car-main {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-wrap: wrap;
	    flex-wrap: wrap;
	-ms-flex-line-pack: start;
	    align-content: flex-start;
	overflow: hidden;
	width: 100%;
}

.car-columns {
	width: 100%;
	-webkit-column-count: 4;
	   -moz-column-count: 4;
	        column-count: 4;
}

.car-columns .car {
	text-align: left;
	border: none;
	background: none;
	-webkit-column-break-inside: avoid;
	   -moz-column-break-inside: avoid;
	        break-inside: avoid;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-wrap: wrap;
	    flex-wrap: wrap;
}

/*首頁*/
.tag {
	width: 100%;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-wrap: wrap;
	    flex-wrap: wrap;
	-webkit-box-sizing: border-box;
	        box-sizing: border-box;
}

.tag__item {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	    -ms-flex-align: center;
	        align-items: center;
	-webkit-box-pack: center;
	    -ms-flex-pack: center;
	        justify-content: center;
	color: #fff;
	font-size: 17px;
	font-size: 1.063rem;
	line-height: 1.875rem;
	border-radius: 3px;
	padding: 0 8px;
}

.tag--position {
	position: absolute;
	left: -2px;
	top: 10px;
	z-index: 3;
}

.tag--newposition {
	position: absolute;
	top: 10px;
	right: calc(50% - 60px);
	z-index: 3;
	display: none;
}

.tag--grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 15px 15px;
	margin: 20px auto;
}

.tag--grid .tag__item {
	line-height: 40px;
}

.tag--gridmenu {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 15px 15px;
	margin: 20px auto;
}

.tag--gridmenu .tag__item {
	line-height: 40px;
}

.tag a:hover {
	background: #523817;
	color: #fff;
}

.tg01 {
	background: #A74522;
	color: #fff;
}

.tg02 {
	background: #CBB15D;
}

.tg03 {
	background: #5AA7B4;
}

.tg04 {
	background: #E97C70;
}

.tg05 {
	background: #67461D;
	color: #fff;
}

@media only screen and (max-width: 1024px) {
	.tag--grid {
		grid-template-columns: 1fr 1fr 1fr 1fr;
	}
}

@media only screen and (max-width: 640px) {
	.tag--grid {
		grid-template-columns: 1fr 1fr;
	}
}

.case__main {
	background: #DFCFB8;
	padding: 40px;
	border-radius: 15px;
	margin-bottom: 80px;
}

.case__area {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-wrap: wrap;
	    flex-wrap: wrap;
	-webkit-box-pack: justify;
	    -ms-flex-pack: justify;
	        justify-content: space-between;
	-ms-flex-line-pack: center;
	    align-content: center;
	margin-bottom: 40px;
}

.case__adpic {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	width: 268px;
	-webkit-box-align: start;
	    -ms-flex-align: start;
	        align-items: flex-start;
	background-image: url("../../images/ad-pic.svg");
	background-position: 50% top;
	background-repeat: no-repeat;
	-webkit-transition: 0.3s ease;
	transition: 0.3s ease;
}

.case__adpic:hover {
	background-image: url("../../images/ad-picf2.svg");
	background-position: 50% top;
	background-repeat: no-repeat;
}

.case__adpic img {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	width: 268px;
	height: auto;
}

.case__content {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-wrap: wrap;
	    flex-wrap: wrap;
	padding: 25px;
	width: calc(100% - 268px - 25px);
	border-radius: 15px;
	background: #fff;
	-webkit-box-sizing: border-box;
	        box-sizing: border-box;
}

.case__box {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-wrap: wrap;
	    flex-wrap: wrap;
	-ms-flex-line-pack: start;
	    align-content: flex-start;
	padding-right: 25px;
	width: 300px;
	-webkit-box-sizing: border-box;
	        box-sizing: border-box;
}

.case__box form {
	width: 100%;
}

.case__group {
	width: calc(100% - 300px);
	padding: 15px;
	overflow-y: auto;
	height: 480px;
	background: #F8F8F8;
}

.case__group::-webkit-scrollbar-track {
	background: #ACA7A2;
}

.case__group::-webkit-scrollbar-thumb {
	background: #ACA7A2;
	border-radius: 8px;
}

.case__group::-webkit-scrollbar-track-piece {
	background: #fff;
}

.case__group::-webkit-scrollbar {
	background: #ACA7A2;
	width: 8px;
}

.case__price {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-wrap: wrap;
	    flex-wrap: wrap;
	-webkit-box-align: start;
	    -ms-flex-align: start;
	        align-items: flex-start;
	margin-bottom: 20px;
}

.case__price::before {
	content: '價格區間';
	width: 100%;
	font-size: 20px;
	font-weight: 700;
	margin-bottom: 10px;
}

.case__pitem {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	width: 50%;
	font-size: 18px;
	font-size: 1.125rem;
	line-height: 2.125rem;
	color: #333;
}

.case__pitem:hover {
	background: #ECECEC;
	border-radius: 3px;
}

.case__info .slick-slide {
	margin: 0 15px;
}

.case__bit {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	position: relative;
	padding-bottom: 8px;
	-webkit-transition: .3s;
	transition: .3s;
}

.case__bit img {
	border-radius: 6px;
}

.case__bit::after {
	content: "";
	border-radius: 6px;
	position: absolute;
	width: 100%;
	height: 100%;
	right: -13px;
	bottom: -20px;
	z-index: -1;
	background-image: url("../../images/bg-shadow.svg");
	background-position: right bottom;
	background-repeat: no-repeat;
}

.case__bit:hover {
	-webkit-transform: translate(0.5rem, 0.5rem);
	    -ms-transform: translate(0.5rem, 0.5rem);
	        transform: translate(0.5rem, 0.5rem);
}

@media only screen and (max-width: 1024px) {
	.case__main {
		padding: 20px;
		border-radius: 0;
	}
	.case__pitem {
		width: 33.333%;
	}
	.case__group {
		height: 250px;
	}
}

@media only screen and (max-width: 640px) {
	.case__pitem {
		width: 50%;
	}
}

/*搜尋產品分類*/
.case {
	width: 100%;
}

.case__column {
	-webkit-column-count: 4;
	   -moz-column-count: 4;
	        column-count: 4;
	-webkit-column-gap: 1.25rem;
	   -moz-column-gap: 1.25rem;
	        column-gap: 1.25rem;
}

.case .sort {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-wrap: wrap;
	    flex-wrap: wrap;
	text-align: left;
	border: none;
	background: none;
	-webkit-column-break-inside: avoid !important;
	   -moz-column-break-inside: avoid !important;
	        break-inside: avoid !important;
	white-space: nowrap;
}

.case .item-title {
	font-size: 18px;
	font-weight: 700;
	color: #A07744;
	width: 100%;
}

.case .item-body {
	margin-bottom: 20px;
}

.case .item {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	font-size: 16px;
	color: #333;
	width: 100%;
	margin: 6px 0;
}

.case .item:hover {
	background: #ECECEC;
	border-radius: 3px;
}

@media only screen and (max-width: 1366px) {
	.case__column {
		-webkit-column-count: 3;
		   -moz-column-count: 3;
		        column-count: 3;
	}
}

@media only screen and (max-width: 1024px) {
	.case__adpic {
		display: none;
	}
	.case__content {
		width: 100%;
	}
	.case__box {
		width: 100%;
		padding-right: 0;
	}
	.case__group {
		width: 100%;
	}
	.case .item-title {
		margin-bottom: 0.6rem;
	}
	.case .item-body {
		display: none;
	}
}

@media only screen and (max-width: 640px) {
	.case__column {
		-webkit-column-count: 2;
		   -moz-column-count: 2;
		        column-count: 2;
	}
}

@media only screen and (max-width: 480px) {
	.case__column {
		-webkit-column-count: 1;
		   -moz-column-count: 1;
		        column-count: 1;
	}
}

/*產品搜尋*/
.slogan {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	width: 100%;
	margin: 20px auto;
	border: 1px solid #DCDCDC;
	border-width: 1px 0 1px 0;
	padding: 10px;
	color: #888888;
	font-size: 18px;
}

.search {
	position: relative;
}

.search form {
	width: 100%;
	background: #523817;
}

.search__nav {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-wrap: wrap;
	    flex-wrap: wrap;
}

.search__nav > select, .search__nav .assort-icon {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	    -ms-flex-align: center;
	        align-items: center;
	width: 150px;
	height: 50px;
	padding: 0 10px;
	border: none;
	color: #fff;
	background: #523817 url(../../images/cheveron-down.svg) right 10px center no-repeat;
	background-size: 5%;
	position: relative;
	cursor: pointer;
	position: relative;
}

.search__content {
	position: absolute;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-wrap: wrap;
	    flex-wrap: wrap;
	padding: 20px;
	width: 850px;
	right: 0;
	top: 50px;
	border-radius: 6px;
	background: #fff;
	z-index: 5;
	-webkit-box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
	        box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
	opacity: 0;
	-webkit-transform: scale(0.97);
	    -ms-transform: scale(0.97);
	        transform: scale(0.97);
	pointer-events: none;
	-webkit-transition: opacity 0.25s ease, -webkit-transform 0.25s ease;
	transition: opacity 0.25s ease, -webkit-transform 0.25s ease;
	transition: opacity 0.25s ease, transform 0.25s ease;
	transition: opacity 0.25s ease, transform 0.25s ease, -webkit-transform 0.25s ease;
	overflow: hidden;
	z-index: 6;
}

.search__content.open {
	opacity: 1;
	-webkit-transform: scale(1);
	    -ms-transform: scale(1);
	        transform: scale(1);
	pointer-events: auto;
	overflow: auto;
	/* 超出高度可滾動 */
}

.search__content > .case__box {
	padding-right: 0;
	padding-left: 20px;
}

.search__content > .case__group {
	padding: 15px;
	background: #f1f1f1;
}

.search__content > .case__group .case__column {
	-webkit-column-count: 3;
	   -moz-column-count: 3;
	        column-count: 3;
}

.search__bar {
	position: relative;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-wrap: wrap;
	    flex-wrap: wrap;
	margin-right: 1px;
}

.search--bar01 {
	width: 100%;
	height: 60px;
	padding: 10px;
	-webkit-box-sizing: border-box;
	        box-sizing: border-box;
	background: #E3E7E9;
	border-radius: 5px;
	position: relative;
	border: none;
}

.search--bar02 {
	width: 100%;
	padding: 10px;
	color: #fff;
	height: 50px;
	background: #523817;
	border: none;
}

.search--bar02::-webkit-input-placeholder {
	color: #fff;
}

.search--bar02::-moz-placeholder {
	color: #fff;
}

.search--bar02:-ms-input-placeholder {
	color: #fff;
}

.search--bar02::-ms-input-placeholder {
	color: #fff;
}

.search--bar02::placeholder {
	color: #fff;
}

.search--btn01 {
	width: 60px;
	height: 60px;
	background-color: #E3E7E9;
	color: #333;
	outline: none;
	border: 1px solid #E3E7E9;
	cursor: pointer;
	position: absolute;
	top: 0;
	right: 0;
}

.search--btn01 i {
	font-size: 26px;
}

.search--btn02 {
	width: 50px;
	height: 50px;
	background-color: #523817;
	color: #fff;
	outline: none;
	border: 1px solid #523817;
	cursor: pointer;
	position: absolute;
	top: 0;
	right: 0;
}

@media only screen and (max-width: 768px) {
	.search {
		width: 100%;
		margin-top: 10px;
	}
	.search__content {
		padding: 20px;
		width: 100%;
		top: 100px;
	}
	.search__content .case__box {
		margin-top: 40px;
		padding-left: 0;
	}
	.search__bar {
		width: 100%;
		margin-right: 0;
		border-bottom: 1px solid #fff;
	}
	.search__nav > select, .search__nav .assort-icon {
		width: 100%;
		border-bottom: 1px solid #fff;
		background-size: 22px;
	}
	.search--btn02 i {
		font-size: 20px;
	}
}

/*2025.10.22 AI產品搜尋外跳*/
/* backdrop 用於偵測空白處點擊 */
.backdrop {
	position: fixed;
	inset: 0;
	background: rgba(0, 0, 0, 0.1);
	display: none;
	z-index: 5;
}

.backdrop.visible {
	display: block;
}

/*新品*/
.newpro {
	position: relative;
	z-index: 2;
}

.newpro .slick-slide {
	margin: 0 10px;
}

.newpro__nav {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-pack: justify;
	    -ms-flex-pack: justify;
	        justify-content: space-between;
	-ms-flex-line-pack: center;
	    align-content: center;
	width: 100%;
}

.newpro__icon {
	border-top: 1px solid #B89A6F;
	border-bottom: 1px solid #B89A6F;
	font-size: 20px;
	height: 50px;
	padding: 10px;
}

.newpro__item {
	display: -webkit-inline-box !important;
	display: -ms-inline-flexbox !important;
	display: inline-flex !important;
	-ms-flex-wrap: wrap;
	    flex-wrap: wrap;
	-webkit-box-pack: justify;
	    -ms-flex-pack: justify;
	        justify-content: space-between;
	border-radius: 6px;
	position: relative;
	overflow: hidden;
	margin-bottom: 20px;
	background: #fff;
}

.newpro__item:hover .newpro__mask {
	background: #a07744;
	opacity: 0;
}

.newpro__item:hover .newpro__mask p::after {
	content: '\e92d';
	position: absolute;
	font-family: 'icomoon';
	font-size: 30px;
	color: #fff;
	left: 0;
	right: 0;
	bottom: -40px;
	margin: auto;
}

.newpro__item:hover .newpro__view {
	background: #523817;
	-webkit-transition: 0.4s ease-in-out;
	transition: 0.4s ease-in-out;
}

.newpro__item:hover .newpro__img img {
	-webkit-transform: scale(1.1);
	    -ms-transform: scale(1.1);
	        transform: scale(1.1);
}

.newpro__mask {
	padding: 0 20px;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-pack: center;
	    -ms-flex-pack: center;
	        justify-content: center;
	-webkit-box-align: center;
	    -ms-flex-align: center;
	        align-items: center;
	position: absolute;
	width: 100%;
	height: 100%;
	background: rgba(160, 119, 68, 0);
	-webkit-transition: 0.2s ease-in-out;
	transition: 0.2s ease-in-out;
	opacity: 0;
	top: 0;
	left: 0;
	z-index: 10;
}

.newpro__mask p {
	font-size: 18px;
	font-size: 1.125rem;
	line-height: 1.625rem;
	color: #fff;
	text-align: center;
	position: relative;
}

.newpro__info {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-wrap: wrap;
	    flex-wrap: wrap;
	-ms-flex-line-pack: center;
	    align-content: center;
	-webkit-box-pack: center;
	    -ms-flex-pack: center;
	        justify-content: center;
	width: 50%;
	padding: 10px;
	-webkit-box-sizing: border-box;
	        box-sizing: border-box;
}

.newpro__img {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	position: relative;
	overflow: hidden;
	padding-bottom: 50%;
	width: 50%;
	height: 100%;
}

.newpro__img img {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	position: absolute;
	-o-object-fit: cover;
	   object-fit: cover;
	top: 0;
	left: 0;
	-webkit-transition: 0.3s ease-in-out;
	transition: 0.3s ease-in-out;
}

.newpro__title {
	width: 100%;
	font-size: 18px;
	font-size: 1.125rem;
	line-height: 1.5rem;
	text-align: center;
}

.newpro__sum {
	width: 100%;
	font-size: 16px;
	text-align: center;
	color: #4C8DA5;
	margin-bottom: 20px;
}

.newpro__view {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	    -ms-flex-align: center;
	        align-items: center;
	-webkit-box-pack: center;
	    -ms-flex-pack: center;
	        justify-content: center;
	width: 80px;
	color: #fff;
	font-size: 16px;
	font-size: 1rem;
	line-height: 2.5rem;
	background: #B89A6F;
	border-radius: 4px;
}

/*熱門產品*/
.popular {
	padding: 130px 15% 0;
	background-image: url("../../images/bg-blue.jpg");
	background-position: 50% top;
	background-repeat: no-repeat;
}

.popular__info {
	width: 500px;
	padding-right: 30px;
	color: #fff;
}

.popular__main {
	width: calc(100% - 500px);
	margin-bottom: 80px;
	display: grid;
	grid-template-columns: 1fr 1fr 1fr;
}

.popular__main li {
	display: block;
	position: relative;
}

.popular__main li::before {
	content: attr(title);
	padding: 5px 15px;
	background: #5C5858;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	    -ms-flex-align: center;
	        align-items: center;
	-webkit-box-pack: center;
	    -ms-flex-pack: center;
	        justify-content: center;
	color: #fff;
	font-size: 17px;
	position: absolute;
	left: 15px;
	bottom: 20px;
	z-index: 3;
}

.popular__main img {
	width: 100%;
	height: auto;
}

.popular .hot {
	margin-bottom: -100px;
}

.popular .hot .slick-slide {
	margin: 0px 10px;
}

@media only screen and (max-width: 1600px) {
	.popular {
		padding: 60px 8%;
	}
}

@media only screen and (max-width: 1366px) {
	.popular {
		background-size: cover;
	}
	.popular__info, .popular__main {
		width: 100%;
	}
	.popular__info {
		padding-right: 0;
		margin-bottom: 40px;
	}
	.popular__main {
		margin-bottom: 0;
	}
}

@media only screen and (max-width: 1024px) {
	.popular {
		padding: 60px 4%;
	}
	.popular .hot {
		margin-bottom: 0;
	}
}

@media only screen and (max-width: 480px) {
	.popular__main li::before {
		display: none;
	}
}

/*about*/
.about__main {
	width: 100%;
	padding-left: 45%;
	background-image: url("../../images/bg-about.jpg");
	background-position: left top;
	background-repeat: no-repeat;
	margin-top: 40px;
}

.about__title {
	font-size: 24px;
	font-weight: 700;
	color: #644844;
	margin-bottom: 15px;
}

.about__tip {
	font-size: 20px;
	color: #CAA067;
	font-weight: 700;
}

@media only screen and (max-width: 1024px) {
	.about__main {
		padding-left: 0;
		padding-top: 300px;
		background-image: url("../../images/bg-about2.jpg");
		background-position: left top;
		background-repeat: no-repeat;
		background-size: contain;
	}
}

@media only screen and (max-width: 840px) {
	.about__main {
		padding-top: 200px;
	}
}

@media only screen and (max-width: 540px) {
	.about__main {
		padding-top: 100px;
	}
}

/*首頁FAQ*/
.qa {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-wrap: wrap;
	    flex-wrap: wrap;
}

.qa__content {
	width: 85%;
	margin-left: 40px;
}

.qa__main {
	background-image: url("../../images/bg-faq.jpg");
	background-position: left top;
	background-repeat: no-repeat;
	padding-left: 40%;
	width: 100%;
	min-height: 500px;
	margin-top: 25px;
}

.qa__date {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-pack: start;
	    -ms-flex-pack: start;
	        justify-content: flex-start;
	margin-bottom: 10px;
}

.qa__date::before {
	content: 'FAQ';
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-pack: center;
	    -ms-flex-pack: center;
	        justify-content: center;
	margin-right: 10px;
	width: 100px;
	border-radius: 99rem;
	background: #3B97E6;
	color: #fff;
	font-size: 15px;
}

.qa__title {
	display: block;
	font-size: 22px;
	font-weight: 600;
	padding: 20px 0;
}

.qa__txt {
	display: block;
	width: 100%;
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
}

.qa__item {
	border-bottom: 1px solid #B5C5C5;
	background-color: #e9ecef;
}

.qa__item:hover .qa__item-box {
	background: #FCF9F5;
	-webkit-transform: translate(-0.5rem, -0.5rem);
	    -ms-transform: translate(-0.5rem, -0.5rem);
	        transform: translate(-0.5rem, -0.5rem);
}

.qa__item-box {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-wrap: wrap;
	    flex-wrap: wrap;
	-webkit-box-align: center;
	    -ms-flex-align: center;
	        align-items: center;
	width: 100%;
	color: #A77654;
	background: #fff;
	-webkit-transition: .3s;
	transition: .3s;
}

.qa__item-box::before {
	content: attr(title);
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	    -ms-flex-align: center;
	        align-items: center;
	-webkit-box-pack: center;
	    -ms-flex-pack: center;
	        justify-content: center;
	color: #000;
	width: 120px;
	margin-right: 10px;
	font-family: "Roboto";
	font-size: 36px;
	font-weight: 700;
	background-image: url("../../images/qa-ap.svg");
	background-position: right 50%;
	background-repeat: no-repeat;
}

.qa__item-box a {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	    -ms-flex-align: center;
	        align-items: center;
	-webkit-box-pack: justify;
	    -ms-flex-pack: justify;
	        justify-content: space-between;
	-ms-flex-wrap: wrap;
	    flex-wrap: wrap;
	color: #A77654;
	padding: 15px 0;
	width: calc(100% - 130px);
}

.qa__item-box a.a-icon {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
}

.qa__item-box a.a-icon::after {
	content: '\e91d';
	font-family: "icomoon";
	font-size: 20px;
}

.qa__item-box i {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	    -ms-flex-align: center;
	        align-items: center;
	-webkit-box-pack: center;
	    -ms-flex-pack: center;
	        justify-content: center;
	width: 40px;
	height: 40px;
	border-radius: 99rem;
	background: #3B97E6;
	color: #fff;
	font-size: 20px;
	font-weight: 700;
	margin-right: 10px;
}

.qa--bg {
	background-image: url("../../images/bg-faq.jpg");
	background-position: left 150px;
	background-repeat: no-repeat;
}

.qa--mb30 {
	margin-bottom: 30px;
}

.qa--mb30 a {
	padding-bottom: 20px;
}

.qa--mb30 a > .qa__title {
	padding: 0;
}

.qa--w15 {
	width: 15%;
}

.qa--w85 {
	width: 85%;
}

.qa--w35 {
	width: calc(35% - 25px);
	margin-right: 25px;
}

.qa--w65 {
	width: 65%;
}

@media only screen and (max-width: 1024px) {
	.qa__info, .qa__main {
		width: 100%;
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-pack: start;
		    -ms-flex-pack: start;
		        justify-content: flex-start;
		-ms-flex-wrap: wrap;
		    flex-wrap: wrap;
	}
	.qa__main {
		padding-top: 200px;
		padding-left: 0;
		background-image: url("../../images/bg-faqs.jpg");
		background-position: left top;
		background-repeat: no-repeat;
	}
	.qa__item {
		width: 100%;
	}
	.qa__content {
		margin-left: 0;
		width: 100%;
	}
}

/*===客服資訊===*/
.service {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-wrap: wrap;
	    flex-wrap: wrap;
	margin: 100px auto 200px;
}

.service__img {
	margin-right: 20px;
}

.service__img img {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	max-width: 100%;
}

.service table {
	width: auto;
}

.service table th {
	width: 330px;
	text-align: right;
}

.service table p {
	font-size: 28px;
	color: #523817;
	padding-bottom: 20px;
	min-width: 100px;
}

.service table i {
	color: #B89A6F;
	margin-right: 10px;
}

@media only screen and (max-width: 1024px) {
	.service {
		margin: 60px auto;
	}
	.service__img {
		display: block;
		margin: 0 auto 30px auto;
	}
	.service > table {
		display: block;
	}
}

@media only screen and (max-width: 640px) {
	.service table th {
		width: auto;
	}
	.service table p {
		font-size: 20px;
	}
}

/*===首頁表尾區塊==*/
.gift {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	background-image: url("../../images/gift-bg.jpg");
	background-position: left top;
	background-repeat: no-repeat;
}

.gift ul {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-wrap: wrap;
	    flex-wrap: wrap;
	-webkit-box-align: start;
	    -ms-flex-align: start;
	        align-items: flex-start;
}

.gift__img {
	width: 50%;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	    -ms-flex-align: center;
	        align-items: center;
	-webkit-box-pack: center;
	    -ms-flex-pack: center;
	        justify-content: center;
	margin-top: 40px;
}

.gift__img img {
	display: block;
	margin: auto;
	max-width: 80%;
}

.gift__info {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-wrap: wrap;
	    flex-wrap: wrap;
	width: 50%;
	margin-top: 100px;
	padding: 50px 35px;
	color: #fff;
	background: #B79578;
}

.gift__title {
	display: block;
	width: 100%;
	font-size: clamp(30px, 3.5vw, 36px);
	font-weight: 700;
	margin-bottom: 20px;
}

.gift__tip {
	display: block;
	font-size: 20px;
	font-weight: 700;
	margin-bottom: 20px;
}

.gift__txt {
	line-height: 32px;
	margin-bottom: 20px;
}

.gift__icon {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	    -ms-flex-align: center;
	        align-items: center;
	-webkit-box-pack: center;
	    -ms-flex-pack: center;
	        justify-content: center;
	padding: 10px 15px;
	border-radius: 6px;
	color: #9E827C;
	font-size: 18px;
	background: #fff;
}

.gift__icon:hover {
	background: #49403B;
	color: #fff;
}

@media only screen and (max-width: 1024px) {
	.gift {
		padding: 30px 20px;
	}
	.gift ul li {
		width: 100%;
	}
	.gift ul li:nth-of-type(2) {
		display: none;
	}
	.gift__info {
		margin: auto;
	}
}

.sidenav {
	position: fixed;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	right: 50px;
	top: 50vh;
	z-index: 99;
	width: 124px;
	background-image: url("../../images/line-bg.svg");
	background-position: 50% bottom;
	background-repeat: no-repeat;
	-webkit-transition: .3s;
	transition: .3s;
}

.sidenav:hover {
	background-image: url("../../images/line-bgf2.svg");
	background-position: 50% bottom;
	background-repeat: no-repeat;
}

.sidenav a {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-pack: center;
	    -ms-flex-pack: center;
	        justify-content: center;
	width: 100%;
	height: 100%;
	padding-bottom: 205px;
}

.sidenav .line {
	margin: auto;
	will-change: transform;
	-webkit-animation: float 2s cubic-bezier(0.32, 0.34, 0, 3) infinite;
	        animation: float 2s cubic-bezier(0.32, 0.34, 0, 3) infinite;
}

/* 上下浮動，中途停 8 秒 */
@-webkit-keyframes float {
	0% {
		-webkit-transform: translateY(0);
		        transform: translateY(0);
	}
	10% {
		-webkit-transform: translateY(-8px);
		        transform: translateY(-8px);
	}
	20% {
		-webkit-transform: translateY(0);
		        transform: translateY(0);
	}
	100% {
		-webkit-transform: translateY(0);
		        transform: translateY(0);
	}
	/* 停 8 秒（80% 時間） */
}
@keyframes float {
	0% {
		-webkit-transform: translateY(0);
		        transform: translateY(0);
	}
	10% {
		-webkit-transform: translateY(-8px);
		        transform: translateY(-8px);
	}
	20% {
		-webkit-transform: translateY(0);
		        transform: translateY(0);
	}
	100% {
		-webkit-transform: translateY(0);
		        transform: translateY(0);
	}
	/* 停 8 秒（80% 時間） */
}

@media (prefers-reduced-motion: reduce) {
	.float-icon {
		-webkit-animation: none;
		        animation: none;
	}
	.float-icon:hover {
		-webkit-animation-play-state: paused;
		        animation-play-state: paused;
	}
}

@media only screen and (max-width: 1650px) {
	.sidenav {
		position: fixed;
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		width: 350px;
		left: 30px;
		right: inherit;
		top: inherit;
		bottom: 20px;
		background-image: url("../../images/line-bg02.svg");
		background-position: right 50%;
		background-repeat: no-repeat;
	}
	.sidenav:hover {
		background-image: url("../../images/line-bg02f2.svg");
		background-position: right bottom;
		background-repeat: no-repeat;
	}
	.sidenav a {
		-webkit-box-pack: start;
		    -ms-flex-pack: start;
		        justify-content: flex-start;
		padding-bottom: 0;
	}
	.sidenav .line {
		margin: inherit;
	}
	.sidenav .line img {
		width: 75px;
		height: 75px;
	}
}

@media only screen and (max-width: 1024px) {
	.sidenav {
		width: 320px;
	}
	.sidenav .line img {
		width: 50px;
		height: 50px;
	}
}
