/*!
Theme Name: panasia
Theme URI: http://underscores.me/
Author: Underscores.me
Author URI: http://underscores.me/
Description: Description
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: panasia
Tags: custom-background, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned with others.

panasia is based on Underscores https://underscores.me/, (C) 2012-2017 Automattic, Inc.
Underscores is distributed under the terms of the GNU GPL v2 or later.

Normalizing styles have been helped along thanks to the fine work of
Nicolas Gallagher and Jonathan Neal https://necolas.github.io/normalize.css/
*/
/*--------------------------------------------------------------
>>> TABLE OF CONTENTS:
----------------------------------------------------------------
# Global Variable
# Normalize
# Typography
# Elements
# Forms
# Navigation
	## Links
	## Menus
# Accessibility
# Alignments
# Clearings
# Widgets
# Content
	## Posts and pages
	## Comments
# Infinite scroll
# Media
	## Captions
	## Galleries
	--------------------------------------------------------------*/
/*--------------------------------------------------------------
# Global Variable
--------------------------------------------------------------*/
:root {
	--primary-color: #1A8611;
	--secondary-color: #1B558D;
	--grey-color: #5D6062;
	--black-color: #0A0B09;

}
*{
	appearance: none;
	-moz-appearance: none;
	-webkit-appearance: none;
}
/*--------------------------------------------------------------
# Normalize
--------------------------------------------------------------*/
/* normalize.css v8.0.0 | MIT License | github.com/necolas/normalize.css */
html {line-height: 1.15; /* 1 */ -webkit-text-size-adjust: 100%; /* 2 */ }
body {margin: 0; }
h1 {font-size: 2em; margin: 0.67em 0; }
hr {box-sizing: content-box; /* 1 */ height: 0; /* 1 */ overflow: visible; /* 2 */ }
pre {font-family: monospace, monospace; /* 1 */ font-size: 1em; /* 2 */ }
a {background-color: transparent; }
abbr[title] {border-bottom: none; /* 1 */ text-decoration: underline; /* 2 */ text-decoration: underline dotted; /* 2 */ }
b, strong {font-weight: bolder; }
code, kbd, samp {font-family: monospace, monospace; /* 1 */ font-size: 1em; /* 2 */ }
small {font-size: 80%; }
sub, sup {font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; }
sub {bottom: -0.25em; }
sup {top: -0.5em; }
img {border-style: none; }
button, input, optgroup, select, textarea {font-family: inherit; /* 1 */ font-size: 100%; /* 1 */ line-height: 1.15; /* 1 */ margin: 0; /* 2 */ }
button, input { /* 1 */ overflow: visible; }
button, select { /* 1 */ text-transform: none; }
button, [type="button"], [type="reset"], [type="submit"] {-webkit-appearance: button; }
button::-moz-focus-inner, [type="button"]::-moz-focus-inner, [type="reset"]::-moz-focus-inner, [type="submit"]::-moz-focus-inner {border-style: none; padding: 0; }
button:-moz-focusring, [type="button"]:-moz-focusring, [type="reset"]:-moz-focusring, [type="submit"]:-moz-focusring {outline: 1px dotted ButtonText; }
fieldset {padding: 0.35em 0.75em 0.625em; }
legend {box-sizing: border-box; /* 1 */ color: inherit; /* 2 */ display: table; /* 1 */ max-width: 100%; /* 1 */ padding: 0; /* 3 */ white-space: normal; /* 1 */ }
progress {vertical-align: baseline; }
textarea {overflow: auto; }
[type="checkbox"], [type="radio"] {box-sizing: border-box; /* 1 */ padding: 0; /* 2 */ }
[type="number"]::-webkit-inner-spin-button, [type="number"]::-webkit-outer-spin-button {height: auto; }
[type="search"] {-webkit-appearance: textfield; /* 1 */ outline-offset: -2px; /* 2 */ }
[type="search"]::-webkit-search-decoration {-webkit-appearance: none; }
::-webkit-file-upload-button {-webkit-appearance: button; /* 1 */ font: inherit; /* 2 */ }
details {display: block; }
summary {display: list-item; }
template {display: none; }
[hidden] {display: none; }

/*--------------------------------------------------------------
# Typography
--------------------------------------------------------------*/
body, button, input, select, optgroup, textarea {color: #404040; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale;font-family: 'Roboto', sans-serif; font-weight: 400; font-size: 16px; font-size: 1rem; line-height: 1.5; }
h1, h2, h3, h4, h5, h6 {clear: both; }
p {margin-bottom: 1.5em; }
dfn, cite, em, i {font-style: italic; }
blockquote {margin: 0 1.5em; }
address {margin: 0 0 1.5em; }
pre {background: #eee; font-family: "Courier 10 Pitch", Courier, monospace; font-size: 15px; font-size: 0.9375rem; line-height: 1.6; margin-bottom: 1.6em; max-width: 100%; overflow: auto; padding: 1.6em; }
code, kbd, tt, var {font-family: Monaco, Consolas, "Andale Mono", "DejaVu Sans Mono", monospace; font-size: 15px; font-size: 0.9375rem; }
abbr, acronym {border-bottom: 1px dotted #666; cursor: help; }
mark, ins {background: #fff9c0; text-decoration: none; }
big {font-size: 125%; }

/*--------------------------------------------------------------
# Elements
--------------------------------------------------------------*/
html {box-sizing: border-box; }
*, *:before, *:after {box-sizing: inherit; }
body {background: #fff; }
hr {background-color: #ccc; border: 0; height: 1px; margin-bottom: 1.5em; }
ul, ol {margin: 0 0 1.5em 3em; } ul {list-style: disc; }
ol {list-style: decimal; }
li > ul, li > ol {margin-bottom: 0; margin-left: 1.5em; }
dt {font-weight: bold; }
dd {margin: 0 1.5em 1.5em; }
img {height: auto; /* Make sure images are scaled correctly. */ max-width: 100%; /* Adhere to container width. */ }
figure {margin: 1em 0; /* Extra wide images within figure tags don't overflow the content area. */ }
table {margin: 0 0 1.5em; width: 100%; }

/*--------------------------------------------------------------
# Forms
--------------------------------------------------------------*/
button, input[type="button"], input[type="reset"], input[type="submit"] {border: 1px solid; border-color: #ccc #ccc #bbb; border-radius: 3px; background: #e6e6e6; color: rgba(0, 0, 0, 0.8); font-size: 12px; font-size: 0.75rem; line-height: 1; padding: .6em 1em .4em; }
button:hover, input[type="button"]:hover, input[type="reset"]:hover, input[type="submit"]:hover {  }
button:active, button:focus, input[type="button"]:active, input[type="button"]:focus, input[type="reset"]:active, input[type="reset"]:focus, input[type="submit"]:active, input[type="submit"]:focus {border-color: #aaa #bbb #bbb; }
input[type="text"], input[type="email"], input[type="url"], input[type="password"], input[type="search"], input[type="number"], input[type="tel"], input[type="range"], input[type="date"], input[type="month"], input[type="week"], input[type="time"], input[type="datetime"], input[type="datetime-local"], input[type="color"], textarea {color: #666; border: 1px solid #ccc; border-radius: 3px; padding: 3px; }
input[type="text"]:focus, input[type="email"]:focus, input[type="url"]:focus, input[type="password"]:focus, input[type="search"]:focus, input[type="number"]:focus, input[type="tel"]:focus, input[type="range"]:focus, input[type="date"]:focus, input[type="month"]:focus, input[type="week"]:focus, input[type="time"]:focus, input[type="datetime"]:focus, input[type="datetime-local"]:focus, input[type="color"]:focus, textarea:focus {color: #111; }
select {border: 1px solid #ccc; }
textarea {width: 100%; }

.form-control:focus,
.btn.focus, .btn:focus { outline: 0; box-shadow: none; }
/*--------------------------------------------------------------
# Navigation
--------------------------------------------------------------*/
/*--------------------------------------------------------------
## Links
--------------------------------------------------------------*/
a {color: var(--primary-color); }
a:visited {color: var(--primary-color); }
a:hover, a:focus, a:active {color: var(--primary-color); }
a:focus {outline: thin dotted; }
a:hover, a:active {outline: 0; text-decoration: none; }
a.read-more{ background: var(--primary-color); display: inline-block; min-width: 162px; border-radius: 6px; color: #fff; text-decoration: none; text-transform: uppercase; font-size: 16px; font-weight: 700; padding: 13px 20px; margin: 0; }
a.read-more span{ padding-right: 26px; position: relative; }
a.read-more span:after{ background: url(assets/images/arrow.svg) no-repeat center right; position: absolute; content: ''; width: 26px; height: 19px; right: 0; top: 0; }
a.read-more-link{ color: var(--primary-color); font-size: 16px; text-transform: uppercase; font-weight: bold; display: inline-block; width: auto; }
a.read-more-link span{ position:relative; padding-right: 26px; }
a.read-more-link span:after{ background: url(assets/images/red-arrow.svg) no-repeat center right; position: absolute; content: ''; width: 26px; height: 19px; right: 0; top: 0; }

a.read-more-link:hover span:after,
a.read-more:hover span:after {-webkit-animation-duration: .5s; animation-duration: .5s; -webkit-animation-fill-mode: both; animation-fill-mode: both; -webkit-animation-timing-function: linear; animation-timing-function: linear; animation-iteration-count: infinite; -webkit-animation-iteration-count: infinite; -webkit-animation-name: bounce; animation-name: bounce; }
@-webkit-keyframes bounce {
	0%, 100% {-webkit-transform: translateX(0); }
	50% {-webkit-transform: translateX(5px); }
}
@keyframes bounce {
	0%, 100% {transform: translateX(0); }
	50% {transform: translateX(5px); }
}

@media (max-width:767px){
	a.read-more{ font-size: 12px; min-width: 185px; padding: 12px 15px; }
	a.read-more span:after{ height: 14px; }

	a.read-more-link{ font-size: 14px; }
	a.read-more-link span:after{ height: 14px; }
}
/*--------------------------------------------------------------
## Menus
--------------------------------------------------------------*/
.main-navigation {display: inline-block; width: 100%; }
.main-navigation ul {display: none; list-style: none; margin: 0; padding-left: 0; }
.main-navigation ul ul {box-shadow: 0 3px 3px rgba(0, 0, 0, 0.2); float: left; position: absolute; top: 100%; left: -999em; z-index: 99999; }
.main-navigation ul ul ul {left: -999em; top: 0; }
.main-navigation ul ul li:hover > ul, .main-navigation ul ul li.focus > ul {left: 100%; }
.main-navigation ul ul a {width: 200px; }
.main-navigation ul li:hover > ul, .main-navigation ul li.focus > ul {left: auto; }
.main-navigation li {float: left; position: relative; }
.main-navigation a {display: block; text-decoration: none; }
/* Small menu. */
.menu-toggle, .main-navigation.toggled ul {display: block; }

@media screen and (min-width: 37.5em) {
	.menu-toggle {display: none; }
	.main-navigation ul {display: block; }
}

.site-main .comment-navigation, .site-main .posts-navigation, .site-main .post-navigation {margin: 0 0 1.5em; overflow: hidden; }
.comment-navigation .nav-previous, .posts-navigation .nav-previous, .post-navigation .nav-previous {float: left; width: 50%; }
.comment-navigation .nav-next, .posts-navigation .nav-next, .post-navigation .nav-next {float: right; text-align: right; width: 50%; }

/*--------------------------------------------------------------
# Accessibility
--------------------------------------------------------------*/
/* Text meant only for screen readers. */
.screen-reader-text {border: 0; clip: rect(1px, 1px, 1px, 1px); clip-path: inset(50%); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute !important; width: 1px; word-wrap: normal !important; /* Many screen reader and browser combinations announce broken words as they would appear visually. */ }
.screen-reader-text:focus {background-color: #f1f1f1; border-radius: 3px; box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6); clip: auto !important; clip-path: none; color: #21759b; display: block; font-size: 14px; font-size: 0.875rem; font-weight: bold; height: auto; left: 5px; line-height: normal; padding: 15px 23px 14px; text-decoration: none; top: 5px; width: auto; z-index: 100000; /* Above WP toolbar. */ }
/* Do not show the outline on the skip link target. */
#content[tabindex="-1"]:focus {outline: 0; }

/*--------------------------------------------------------------
# Alignments
--------------------------------------------------------------*/
.alignleft {display: inline; float: left; margin-right: 1.5em; }
.alignright {display: inline; float: right; margin-left: 1.5em; }
.aligncenter {clear: both; display: block; margin-left: auto; margin-right: auto; }

/*--------------------------------------------------------------
# Clearings
--------------------------------------------------------------*/
.clear:before, .clear:after, .entry-content:before, .entry-content:after, .comment-content:before, .comment-content:after, .site-header:before, .site-header:after, .site-content:before, .site-content:after, .site-footer:before, .site-footer:after {content: ""; display: table; table-layout: fixed; }
.clear:after, .entry-content:after, .comment-content:after, .site-header:after, .site-content:after, .site-footer:after {clear: both; }

/*--------------------------------------------------------------
# Widgets
--------------------------------------------------------------*/
.widget {margin: 0 0 1.5em; /* Make sure select elements fit in widgets. */ }
.widget select {max-width: 100%; }

/*--------------------------------------------------------------
# Content
--------------------------------------------------------------*/
/*--------------------------------------------------------------
## Posts and pages
--------------------------------------------------------------*/
.sticky {display: block; }
.post, .page {margin: 0; }
.updated:not(.published) {display: none; }
.page-content, .entry-content, .entry-summary {margin: 0; }
.page-links {clear: both; margin: 0; }

/*--------------------------------------------------------------
## Comments
--------------------------------------------------------------*/
.comment-content a {word-wrap: break-word; }
.bypostauthor {display: block; }

/*--------------------------------------------------------------
# Infinite scroll
--------------------------------------------------------------*/
/* Globally hidden elements when Infinite Scroll is supported and in use. */
.infinite-scroll .posts-navigation, .infinite-scroll.neverending .site-footer {/* Theme Footer (when set to scrolling) */ display: none; }

/* When Infinite Scroll has reached its end we need to re-display elements that were hidden (via .neverending) before. */
.infinity-end.neverending .site-footer {display: block; }

/*--------------------------------------------------------------
# Media
--------------------------------------------------------------*/
.page-content .wp-smiley, .entry-content .wp-smiley, .comment-content .wp-smiley {border: none; margin-bottom: 0; margin-top: 0; padding: 0; }

/* Make sure embeds and iframes fit their containers. */
embed, iframe, object {max-width: 100%; }

/*--------------------------------------------------------------
## Captions
--------------------------------------------------------------*/
.wp-caption {margin-bottom: 1.5em; max-width: 100%; }
.wp-caption img[class*="wp-image-"] {display: block; margin-left: auto; margin-right: auto; }
.wp-caption .wp-caption-text {margin: 0.8075em 0; }
.wp-caption-text {text-align: center; }

/*--------------------------------------------------------------
## Galleries
--------------------------------------------------------------*/
.gallery {margin-bottom: 1.5em; }
.gallery-item {display: inline-block; text-align: center; vertical-align: top; width: 100%; }
.gallery-columns-2 .gallery-item {max-width: 50%; }
.gallery-columns-3 .gallery-item {max-width: 33.33%; }
.gallery-columns-4 .gallery-item {max-width: 25%; }
.gallery-columns-5 .gallery-item {max-width: 20%; }
.gallery-columns-6 .gallery-item {max-width: 16.66%; }
.gallery-columns-7 .gallery-item {max-width: 14.28%; }
.gallery-columns-8 .gallery-item {max-width: 12.5%; }
.gallery-columns-9 .gallery-item {max-width: 11.11%; }
.gallery-caption {display: block; }

/*--------------------------------------------------------------
## Content Page
--------------------------------------------------------------*/
.full-content-style{ padding: 33px 0 30px; }
.full-content-style p{ color: var(--grey-color); font-size: 18px; line-height: 26px; }
.full-content-style h1,
.full-content-style h2,
.full-content-style h3{ color: var(--secondary-color); font-size: 30px; font-family: 'Noto Serif TC', serif; line-height: 42px; padding: 33px 0; }

.full-content-style h4
.full-content-style h5,
.full-content-style h6{ color: var(--secondary-color); font-size: 22px; line-height: 28px; }

.full-content-style p,
.full-content-style h1, 
.full-content-style h2, 
.full-content-style h3, 
.full-content-style h4, 
.full-content-style h5,
.full-content-style h6{ max-width: 66.666667%; text-align: center; margin: 0 auto; width: 100%;}

.full-content-style h1, 
.full-content-style h2, 
.full-content-style h3, 
.full-content-style h4, 
.full-content-style h5,
.full-content-style h6{ color: var(--black-color); }

.full-content-style h2{ padding: 26px 0 19px; }
.full-content-style .wp-block-image{ margin-top: 33px; margin-bottom: 40px; }

@media (max-width:991px){
	.full-content-style p, .full-content-style h1, .full-content-style h2, .full-content-style h3, .full-content-style h4, .full-content-style h5, .full-content-style h6{ max-width: 100%; }
	.full-content-style h1, .full-content-style h2, .full-content-style h3{ padding: 30px 0px; }
}

@media (max-width:767px){
	.full-content-style{ padding: 40px 0px; }
	.full-content-style p, .full-content-style h1, .full-content-style h2, .full-content-style h3, .full-content-style h4, .full-content-style h5, .full-content-style h6{ max-width: 100%; }
	.full-content-style h1, .full-content-style h2, .full-content-style h3 { padding: 0px 0px 15px 0px; font-size: 20px; line-height: 28px; }
	.full-content-style p{ font-size: 16px; line-height: 24px; }
	.full-content-style .wp-block-image { margin-bottom: 30px; margin-top: 30px; }
}
@keyframes fadeInDown{
	0%{
		opacity:0;transform:translate3d(0px,-100%,0px)
	}
	100%{
		opacity:1;transform:none
	}
}
/*--------------------------------------------------------------
## Page Container
--------------------------------------------------------------*/
@media (min-width:576px){
	.container{max-width:570px}
}
@media (min-width:768px){
	.container{max-width:750px}
}
@media (min-width:992px){
	.container{max-width:990px}
}
@media (min-width:1200px){
	.container{max-width:1170px}
}

/*--------------------------------------------------------------
## Slick Slider
--------------------------------------------------------------*/
.slick-slider {position: relative; display: block; box-sizing: border-box; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; -webkit-touch-callout: none; -khtml-user-select: none; -ms-touch-action: pan-y; touch-action: pan-y; -webkit-tap-highlight-color: transparent; }
.slick-list {position: relative; display: block; overflow: hidden; margin: 0; padding: 0; }
.slick-list:focus {outline: none; }
.slick-list.dragging {cursor: pointer; cursor: hand; }
.slick-slider .slick-track, .slick-slider .slick-list {-webkit-transform: translate3d(0, 0, 0); -moz-transform: translate3d(0, 0, 0); -ms-transform: translate3d(0, 0, 0); -o-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); }
.slick-track {position: relative; top: 0; left: 0; display: block; margin-left: auto; margin-right: auto; }
.slick-track:before, .slick-track:after {display: table; content: ''; }
.slick-track:after {clear: both; }
.slick-loading .slick-track {visibility: hidden; }
.slick-slide {display: none; float: left; height: 100%; min-height: 1px; }
[dir='rtl'] .slick-slide {float: right; }
.slick-slide img {display: block; }
.slick-slide.slick-loading img {display: none; }
.slick-slide.dragging img {pointer-events: none; }
.slick-initialized .slick-slide {display: block; }
.slick-loading .slick-slide {visibility: hidden; }
.slick-vertical .slick-slide {display: block; height: auto; border: 1px solid transparent; }
.slick-arrow.slick-hidden {display: none; }

.slick-loading .slick-list { background: #fff url('assets/images/ajax-loader.gif') center center no-repeat; }
/* Arrows */
.slick-prev, .slick-next { font-size: 0; line-height: 0; position: absolute; top: 50%; display: block; width: 40px; height: 70px; padding: 0; 
	-webkit-transform: translate(0, -50%); -ms-transform: translate(0, -50%); transform: translate(0, -50%); cursor: pointer; color: transparent; border: none; outline: none; 
	background-color: rgba(0,0,0,0.9); z-index: 100; background-repeat: no-repeat;}
	.slick-prev:hover, .slick-prev:focus, .slick-next:hover, .slick-next:focus {color: transparent; outline: none; background-color: rgba(0,0,0,0.9); }
	.slick-prev:hover:before, .slick-prev:focus:before, .slick-next:hover:before, .slick-next:focus:before {opacity: 1; }
	.slick-prev.slick-disabled:before, .slick-next.slick-disabled:before {opacity: .25; }
	.slick-prev:before, .slick-next:before {}
	.slick-prev {left: 0; border-radius: 0 12px 12px 0; background-image: url(assets/images/control-prev-arrow.svg); background-position: 11px 26px; }
	[dir='rtl'] .slick-prev {right: 0; left: auto; }
	.slick-prev:before {content: '←'; }
	[dir='rtl'] .slick-prev:before {content: '→'; }
	.slick-next {right: 0; border-radius: 0 12px 12px 0; background-image: url(assets/images/control-prev-arrow.svg); background-position: 11px 28px; transform: rotate(-180deg); top: 43%; }
	[dir='rtl'] .slick-next {right: auto; left: 0; }
	.slick-next:before {content: '→'; }
	[dir='rtl'] .slick-next:before {content: '←'; }

	/* Dots */
	.slick-dotted.slick-slider {margin-bottom: 0px; }
	.slick-dots { position: absolute; bottom: 30px; display: inline-block; width: auto; padding: 2px 0 4px; margin: 0 auto; list-style: none; text-align: center; left: 0; right: 0; background: rgba(0,0,0,0.4); max-width: 80px; border-radius: 15px; }
	.slick-dots li {position: relative; display: inline-block; width: 10px; height: 10px; margin: 0 5px; padding: 0; cursor: pointer; vertical-align: middle; }
	.slick-dots li button {font-size: 0; line-height: 0; display: block; width: 10px; height: 10px; padding: 5px; cursor: pointer; color: transparent; border: 0; outline: none; background: #fff; border-radius:50%; }
	.slick-dots li button:hover, .slick-dots li button:focus {outline: none; }
	.slick-dots li button:hover:before, .slick-dots li button:focus:before {opacity: 1; }
	.slick-dots li button:before {}
	.slick-dots li.slick-active button:before {opacity: .75; color: black; }
	.slick-dots li.slick-active button{ background: #e3af31;}

	@media (max-width:767px){
		.slick-prev, .slick-next{ width: 30px; height: 50px; background-position: 8px 18px; }
		.slick-dots{ bottom: 15px; }
	}

/*--------------------------------------------------------------
## Page Banner
--------------------------------------------------------------*/
.page-banner{ width: 100%; margin:0; padding: 0; background: #000000; }
.page-banner .items{ position: relative; }
.page-banner .items .item-caption{ position: absolute; left: 0;	right: 0; top: 0px;	z-index: 10; padding: 16px 0 0; width: 750px; margin: 0 auto; display: flex; text-align: center; height: calc(100% - 60px); flex-direction: column; justify-content: center; align-items: center; }
.page-banner .items img{ max-width: 100%; height: auto; width: 100%;}
.page-banner .items .item-caption h3{font-family: 'Noto Serif TC', serif; font-size: 50px; color: #fff; text-align: center; letter-spacing: -1px; padding: 41px 0 60px; margin: 0;}

@media (min-width: 981px){
	.page-banner .items{ min-height: 500px; }
	.page-banner .items img{ object-fit:  cover; height:500px; }
}
@media (max-width: 980px){
	.page-banner .items{ min-height: 350px; }
	.page-banner .items img{ object-fit:  cover; height:350px; }
	.page-banner .items .item-caption h3{ padding: 30px 60px; font-size: 36px; line-height: 46px; }

}
@media (max-width: 767px){
	.page-banner .items{ min-height: 250px; }
	.page-banner .items img{ object-fit:  cover; height:250px; }
	.page-banner .items .item-caption{ width: 80%; padding: 0px; height: 100%; }
	.home .page-banner .items .item-caption{ height: calc(100% - 60px); }
	.page-banner .items .item-caption h3{ font-size: 22px; line-height: 30px; padding: 15px 0px; }
}

/*--------------------------------------------------------------
## Site Header
--------------------------------------------------------------*/
.site-branding{ text-align: center; padding: 20px 0;}
.custom-logo {display: inline-block;     width: 14%;}
.navbar{ border-top:1px solid #eeeeee; padding: .6rem 1rem; }
.navbar-light .navbar-nav li{ padding-left: 1px; position: relative;}
.navbar-light .navbar-nav li::before{ content: ''; height: 20px; left: 0; top: 10px; width: 1px; background: #CCCCCC; position: absolute; display: inline-block; }
.navbar-light .navbar-nav li:first-child{ padding-left: 0;}
.navbar-light .navbar-nav li:first-child::before{ width: 0px; }
.navbar-light .navbar-nav .nav-link{ color: var(--black-color); font-weight: 700; text-transform: uppercase; padding-right: 1.9rem; padding-left: 1.9rem;}
.navbar-light .navbar-nav li:first-child .nav-link{ padding-left: 0;}
.navbar-light .navbar-nav li:last-child .nav-link{ padding-right: 0;}
.navbar-light .navbar-nav li.home a.nav-link{background: url(assets/images/black-home-icon.svg) no-repeat 0 0; font-size: 0; width: 20px; height: 17px; padding: 0; margin: 10px 30px 10px 0; }
.navbar-light .navbar-nav li.home.active a.nav-link, .navbar-light .navbar-nav li.home:hover a.nav-link{ background: url(assets/images/green-home-icon.svg) no-repeat 0 0;}
.navbar-light .navbar-nav li.active a.nav-link{ color: var(--primary-color);}
.navbar-light .navbar-nav .nav-link:focus, .navbar-light .navbar-nav .nav-link:hover{ color: var(--primary-color); }
.navbar-light .mob-home-nav{ display: none; }
@media (min-width: 768px){
	.nav-wrapper.fixed nav.navbar{ position: fixed; top: 0; left: 0; right: 0; background: #fff; z-index: 999; box-shadow: 0px 0px 10px rgba(0,0,0,0.2);}
}
@media (max-width:991px){
	.navbar>.container{ max-width: 100%; padding-left: 0; padding-right: 0;  }
	.navbar-light .navbar-nav li.home a.nav-link{ margin: 10px 8px 10px 0;  }
	.navbar-light .navbar-nav .nav-link{ padding-left: 14px; padding-right: 14px; font-size: 14px; }
}
@media (max-width:767px){
	.navbar-light .mob-home-nav{background: url(assets/images/green-home-icon.svg) no-repeat 0 0; font-size: 0; width: 26px; height: 22px; padding: 0; margin: 0; display: inline-block;     background-size: cover;}
	.navbar-light .navbar-nav li.home{ display: none; }
	.navbar-light .navbar-nav li{ border-top: 1px solid #CCCCCC; }
	.navbar-light .navbar-nav li::before{ width: 0; }
	.navbar-light .navbar-nav .nav-link{ padding-left: 0; padding-right: 0; }
	.navbar-light .navbar-nav{ margin-top: 15px; }
	.navbar-light .navbar-toggler:focus{ outline: none; }
	.site-branding{ padding: 15px 0px; }
	.site-branding .custom-logo-link img { width: 130px; }
	.site-branding{max-width: 130px;position: absolute;left: 0;right: 0;margin: 0 auto;padding: 10px 0;}
	.navbar{padding-top: 21px;padding-bottom: 21px;}	
	.site-header{padding-top: 73px;}
	.nav-wrapper{ position: fixed; background: #fff; z-index: 999; width: 100%; top: 0; left: 0; }
	.nav-wrapper.fixed{box-shadow: 0px 0px 10px rgba(0,0,0,0.2);}
	.navbar-toggler{padding: 0;border: none; position: relative;top: 2px;}
	.navbar-light .navbar-toggler-icon{
		background-image:url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(10, 11, 9, 1)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E")
	}
}

/*--------------------------------------------------------------
## Home Page Grid View
--------------------------------------------------------------*/
.grid_view{ padding: 83px 0 82px; background-repeat: no-repeat; background: center center; background-size: cover; }
.grid_view h3{ font-family: 'Noto Serif TC', serif; font-size: 30px; color: #fff; text-align: center; margin: 0; padding: 0 0 63px; }
.grid_view h3 span{ display: inline-block; width: 100%; margin: 0; padding: 0; font-size: 18px; font-family: 'Roboto', sans-serif; font-weight: 400; }
.grid_view .column a{ width: 100%; background: #fff; display: flex; margin: 0 auto; padding: 0 15px; height: 100%; border-radius: 12px; text-align: center; min-height: 300px; flex-wrap: wrap; justify-content: flex-start; align-items: center; flex-direction: column; overflow: hidden; }
.grid_view .column a:hover, .grid_view .column a:focus{ text-decoration: none; }
.grid_view .column a span.icon-wrap{ display: flex; margin-top: 40px; width: 140px; height: 140px; border: 1px solid #E9DCDD; border-radius: 100%; box-shadow: none; justify-content: center; align-items: center; position: relative; }
.grid_view .column a span.icon-wrap::before, .grid_view .column a span.icon-wrap::after {border-radius: 100%; box-sizing: inherit; content: ''; position: absolute; width: 140px; height: 140px; }

@media (max-width:991px){
	.grid_view.product_services .column{ margin-bottom: 30px; }
}

@media (max-width:767px){
	.grid_view h3{ font-size: 20px; padding: 0 0 30px; }
	.grid_view .column a{ min-height: auto; padding: 30px 15px; }
	.grid_view .column a span.icon-wrap{ margin-top: 0px; width: 90px; height: 90px; }
	.grid_view .column a span.icon-wrap img{ width: 36px; }
	.grid_view .column a span.icon-wrap::before, .grid_view .column a span.icon-wrap::after { width: 90px; height: 90px; }
	.grid_view.product_services .column a, .grid_view.services .column a{ width: 80%; }
}
/* Spinner Animation start 
----------------------------------*/
.grid_view .column a:hover span.icon-wrap {color: #1A8611; }
.grid_view .column a span.icon-wrap::before, .grid_view .column a span.icon-wrap::after {top: 0; left: 0; }
.grid_view .column a span.icon-wrap::before {border: 2px solid transparent; }
.grid_view .column a:hover span.icon-wrap::before {border-top-color: #1A8611; border-right-color: #1A8611; border-bottom-color: #1A8611; 
	transition: border-top-color 0.15s linear, border-right-color 0.15s linear 0.10s, border-bottom-color 0.15s linear 0.20s; }
	.grid_view .column a span.icon-wrap::after {border: 0 solid transparent; }
	.grid_view .column a:hover span.icon-wrap::after {border-top: 2px solid #1A8611; border-left-width: 2px; border-right-width: 2px; transform: rotate(270deg); 
		transition: transform 0.4s linear 0s, border-left-width 0s linear 0.35s; }
/* Spinner Animation End 
----------------------------------*/
.grid_view .column a span.title-wrap{ display: inline-block; width: 100%; color: var(--black-color); font-size: 22px; line-height: 28px; font-weight: 700; min-height: 76px; margin-top: 25px; }
.grid_view a.view-all{ background: var(--primary-color); width: 222px; }
.grid_view.products .column{ position: relative; }
.grid_view.products .column::before{content: ''; background: rgba(0,0,0,0.1); width: 76.5%; height: 12px; bottom: -12px; position: absolute; border-radius: 0 0 10px 10px; left: 0; right: 0; margin: 0 auto; display: inline-block; }
.grid_view.products .column::after{content: ''; background: rgba(0,0,0,0.05); width: 62.5%; height: 12px; bottom: -24px; position: absolute; border-radius: 0 0 10px 10px; z-index: -1; display: inline-block; left: 0; right: 0; margin: 0 auto; }
.grid_view.products .column a{ min-height: 440px; justify-content: flex-end; position: relative; }

@media (max-width:767px){
	.grid_view .column a span.title-wrap{ font-size: 18px; min-height: auto; margin-top: 15px; }

}
/* Zoom Animation Start
----------------------------------*/
.grid_view.products .column a span.bg-image-wrap {-webkit-transition: all .5s; -moz-transition: all .5s; -o-transition: all .5s; transition: all .5s; position: absolute; left: 0; top: 0; width: 100%; height: 100%; display: block; background-repeat: no-repeat; background-size: cover;}
.grid_view.products .column a:hover span.bg-image-wrap {-ms-transform: scale(1.2); -moz-transform: scale(1.2); -webkit-transform: scale(1.2); -o-transform: scale(1.2); transform: scale(1.2); }
/* Zoom Animation End
----------------------------------*/

.grid_view.products .column a span.product-title-wrap{

	background: -moz-linear-gradient(top, rgba(0,0,0,0) 0%, rgba(0,0,0,0.8) 100%); 
	background: -webkit-linear-gradient(top, rgba(0,0,0,0) 0%,rgba(0,0,0,0.8) 100%); 
	background: linear-gradient(to bottom, rgba(0,0,0,0) 0%,rgba(0,0,0,0.8) 100%); 
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#cc000000',GradientType=0 );
	width: calc(100% + 30px); margin: 0 -15px; position: relative; min-height: 150px; display: flex; color: #fff; padding: 0 65px 30px; font-size: 20px; font-weight: 700; justify-content: flex-end; flex-direction: column;
}
.grid_view.products h3{ color: var(--black-color); }
.grid_view.products h3 span{ color: var(--grey-color); } 
.grid_view.products a.read-more{ margin-top: 84px; }

@media (max-width:1199px){
	.grid_view.products .column a span{ padding: 0 46px 30px; }
}
@media (max-width:1024px){
	.grid_view.products .column a span.product-title-wrap{ padding: 0px 30px 30px; }
}
@media (max-width:991px){
	.grid_view{ padding: 40px 0; }
	.grid_view .column{ margin-bottom: 50px; }
	.grid_view.products .column a{ background-size: cover; }
	.grid_view.products a.read-more{ margin-top: 30px; }
}
@media (max-width:767px){
	.grid_view .column{ margin-bottom: 15px; }
	.grid_view.products .column a span.product-title-wrap{ font-size: 18px; }
	.grid_view.products .column a{ padding-bottom: 0px; }
	.grid_view.products .column{ margin-bottom: 50px; }
	.grid_view.products a.read-more {margin-top: 15px; }
}
/*--------------------------------------------------------------
## Home Page Two Column Layout
--------------------------------------------------------------*/
.two-column-layout{ padding: 81px 0 80px; }
.two-column-layout .column-first p{ color: var(--black-color); font-size: 30px; line-height: 42px; font-family: 'Noto Serif TC', serif; margin: 0; padding: 0; }
.two-column-layout .column-second p{ color: var(--grey-color); font-size: 18px; line-height: 26px;  margin: 0; padding: 0 0 24px;}
.two-column-layout .column-second a.read-more-link{ margin-top: 41px; }

@media (max-width:991px){
	.two-column-layout{ padding: 40px 0; }
	.two-column-layout .column-first{ margin-bottom: 24px; }
	.two-column-layout .column-second a.read-more-link{ margin-top: 0px; }
	.two-column-layout .column-first p{ font-size: 24px; line-height: 34px; }
}
@media (max-width:767px){
	.two-column-layout .column-first p {font-size: 18px; line-height: 28px; }
	.two-column-layout .column-first {margin-bottom: 15px; }
	.two-column-layout .column-second p{ font-size: 16px; line-height: 24px; padding: 0 0 15px; }
}
/*--------------------------------------------------------------
## Produce Page
--------------------------------------------------------------*/
.full-content-style.produce-tab h3{color: var(--secondary-color); font-size: 30px; font-family: 'Noto Serif TC', serif; line-height: 42px; padding: 41px 0;}

.produce-tab .nav-tabs{ border-bottom: 1px solid #EEEEEE; margin: 0; padding: 0; list-style-type: none; text-align: center; justify-content: center; }
.produce-tab .nav-tabs .nav-item{ display: inline-block; }
.produce-tab .nav-tabs .nav-item .nav-link{ border: 0; position: relative; color: var(--secondary-color); font-size: 16px; font-weight: bold; text-transform: uppercase; min-width: 165px; padding: 17px 16px; }
.produce-tab .nav-tabs .nav-link:focus, 
.produce-tab .nav-tabs .nav-link:hover{  border: 0; background: transparent; outline: none; }
.produce-tab .nav-tabs .nav-item.show .nav-link, 
.produce-tab .nav-tabs .nav-link.active{ border: 0; background: transparent; color: var(--primary-color); }
.produce-tab .nav-tabs .nav-item.show .nav-link::after, 
.produce-tab .nav-tabs .nav-link.active::after{ content: ''; position: absolute; left: 0; bottom: -1px; width: 100%; height: 2px; background: var(--primary-color); }

.produce-item-info{ background-color: #F8F8F8; width: 610px; margin: 31px auto 11px; padding: 0; list-style-type: none; font-size: 0; text-align: center; height: 60px; line-height: 60px; border-radius: 31px; }
.produce-item-info li{ margin: 0 23px; padding: 0; list-style-type: none; display: inline-block; }
.produce-item-info li span{ color: var(--grey-color); font-size: 18px; font-weight: normal; padding-left: 27px; position: relative;}
.produce-item-info li span:before{ position: absolute; width: 14px; height: 14px; display: inline-block; border-radius: 50%; content: ''; left: 0; top: 5px; }
.produce-item-info li.unavailable span:before{ background-color: #CECECE; }
.produce-item-info li.partical span:before{ background-color: #FFD650; }
.produce-item-info li.active span:before{ background-color: #3BD823; }

.product-table-list{ width: 100%; border: 0; padding: 0; margin: 0; font-size: 16px; }
.product-table-list thead tr th{ padding: 17px 0px; text-align: center; border-bottom: 1px solid #0A0B09; font-weight: 700; }
.product-table-list thead tr th:first-child{ text-align: left; padding: 9px 20px; }
.product-table-list tbody tr:hover{}
.product-table-list tbody tr th{ text-align: left; min-width: 290px; border-bottom: 1px solid #EEEEEE; padding: 9px 20px; color: var(--grey-color); font-weight: normal; }
.product-table-list tbody > tr:first-child > td{ padding-top: 21px; }
.product-table-list tbody tr td{ border-bottom: 1px solid #EEEEEE; padding: 9px 0px; text-align: center; min-width: 70px; color: var(--grey-color); font-weight: normal; }
.product-table-list tbody tr td span{ display: inline-block; margin: 0 auto; width: 14px; height: 14px; border-radius: 50%; }
.product-table-list tbody tr td span.unavailable{ background-color: #CECECE;  }
.product-table-list tbody tr td span.partical{ background-color: #FFD650; }
.product-table-list tbody tr td span.active{ background-color: #3BD823; }

.full-content-style.produce-slides-wrap{ padding: 0 0 40px; margin: 0; }
.produce-slides{ margin: 0; padding: 0; }
.produce-slides .slide img{ margin: 0 15px; }
.produce-slides .slick-dots{ bottom: -50px; background: transparent; }
.produce-slides .slick-dots li button{ background: #CCCCCC; }
.produce-slides .slick-dots li.slick-active button{ background: var(--primary-color); }

.table-wrap { position: relative; background: #fff; }
.table-wrap .mob-heading{ position: absolute; left: 20px; top: 0; }
.table-wrap .mob-heading ul{ margin: 0; padding: 0; width: 100%; list-style-type: none; min-width: 200px; }
.table-wrap .mob-heading ul li{ font-size: 16px; border-bottom: 1px solid #EEEEEE; padding: 9px 0px; text-align: left; min-width: 70px; color: var(--grey-color); font-weight: normal; }
.table-wrap .mob-heading ul li.head-title{padding: 17px 0px; font-weight: 700; border-bottom: 1px solid #0A0B09;}
.table-wrap .mob-heading ul li:nth-child(2){ padding-top: 21px; display: inline-block; width: 100%; vertical-align: middle; line-height: 13px; padding-bottom: 20px;}

@media (max-width:1024px){
	.produce-tab .tab-pane { width: 100%; overflow-x: scroll; }
	.produce-slides .slide img{ width: 100%; max-width: 600px; }
}

@media (max-width:767px){
	.produce-slides .slide img{ margin: 0 5px; width: 100%; max-width: 300px; }
	.full-content-style.produce-tab h3{ font-size: 20px; line-height: 28px; padding: 0px 0px 15px 0px; }
	.produce-tab .nav-tabs .nav-item .nav-link{ padding: 15px; min-width: 140px; font-size: 14px; }
	.produce-item-info{ width: 100%; padding: 15px; text-align: left; height: auto; line-height: 40px; }
	.produce-item-info li{ display: block; margin: 0px; }
	.produce-item-info li span{ font-size: 16px; }
	.produce-item-info li span:before{ top: 3px; }
	.produce-tab .tab-pane { width: 100%; overflow-x: scroll; }
}
/*--------------------------------------------------------------
## Contact Us Page
--------------------------------------------------------------*/
.full-content-style.contact-page h3{ text-align: left; max-width: 100%; }
/* .full-content-style.product-mrg { padding: 0; } */
.full-content-style.product-mrg{ padding: 33px 0 0; }
.full-content-style.product-mrg:first-child figure.wp-block-image { margin-bottom: 0; }
.full-content-style.product-mrg:nth-child(3) { padding: 0px 0 66px; }
.full-content-style h2 { padding: 33px 0 33px; }
.contact-page .social-link{ margin: 0; padding: 0; list-style-type: none; }
.contact-page .social-link li{ margin: 0 12px 0 0; padding: 0; list-style-type: none; display: inline-block; }
.contact-page .social-link li a{ display: flex; width: 48px; text-align: center; color: #fff; justify-content: center; align-items: center; height: 48px; font-size: 0; border-radius: 50%;}
.contact-page .social-link li a.facebook{ margin-left: 0; background-color: #4867AA; }
.contact-page .social-link li a.twitter{ margin-left: 7px; background-color: #1CA1F2; }
.contact-page .social-link li a.instagram{ margin-left: 10px; background-color: #C503AB; }
.contact-page .social-link li a.youtube{ margin-left: 14px; background-color: #FE0000; }
.contact-page .social-link li a i.fab{ font-size: 22px; }
.contact-page .social-link li a i.fa-instagram{ font-size: 24px; }
.contact-page .social-link li a i.fa-youtube{ font-size: 26px; }

.contact-page .wpcf7-form input.form-control{ border: 1px solid #CCCCCC; height: 60px; line-height: normal; border-radius: 6px; padding: 0 19px; font-size: 18px; font-weight: normal; }
.contact-page .wpcf7-form select.form-control{ height: 60px; padding: 0 19px;  }
.contact-page .wpcf7-form textarea.form-control{ height: 140px; }
.contact-page .wpcf7-form input.wpcf7-submit{background: var(--primary-color); display: inline-block; min-width: 203px; border-radius: 6px; color: #fff; text-decoration: none; text-transform: uppercase; font-size: 16px; font-weight: 700; padding: 22px 20px; margin: 0; border: 0;}
.contact-page .wpcf7-form input.wpcf7-submit:focus{ outline: none; }

.contact-page span.wpcf7-not-valid-tip{ margin-top: 6px; }
.contact-page div.wpcf7-response-output{ margin: 10px 0px; }

.contact-page .panasia_widget_contacts { display: flex; flex-wrap: wrap; margin: 0; }
.contact-page .panasia_widget_contacts .email-wrap, .contact-page .panasia_widget_contacts .phone-wrap, .contact-page .panasia_widget_contacts .address-wrap{ position: relative; width: 100%; padding-bottom: 30px; }
.contact-page .panasia_widget_contacts .email-wrap { order: 2; }
.contact-page .panasia_widget_contacts .phone-wrap { order: 1; }
.contact-page .panasia_widget_contacts .address-wrap { order: 3; }
.contact-page .panasia_widget_contacts .email-wrap a.email, .contact-page .panasia_widget_contacts .phone-wrap a.phone, .contact-page .panasia_widget_contacts .address-wrap address{ padding-left: 64px; color: var(--grey-color); font-size: 18px; line-height: 26px; margin: 0; position: relative; min-height: 48px; display: flex; align-items: center;}
.contact-page .panasia_widget_contacts .email-wrap a.email::before, .contact-page .panasia_widget_contacts .phone-wrap a.phone::before, .contact-page .panasia_widget_contacts .address-wrap address::before{ width: 48px; height: 48px; background-color: #EEEEEE; content: ''; display: inline-block; left: 0; top: 0; background-repeat: no-repeat; background-position: center center; border-radius: 50%; }
.contact-page .panasia_widget_contacts .email-wrap a.email::before{ background-image: url(assets/images/mail.svg); position: absolute;  }
.contact-page .panasia_widget_contacts .phone-wrap a.phone::before{ background-image: url(assets/images/phone.svg); position: absolute; }
.contact-page .panasia_widget_contacts .address-wrap address::before{ background-image: url(assets/images/map.svg) ; position: absolute; } 
.contact-page .panasia_widget_contacts .address-wrap address{ width: 300px; }
.contact-page .panasia_widget_contacts .email-wrap a.email{  word-break: break-word; }
.full-content-style.contact-page-map{ margin: 0; padding: 10px 0 0; width: 100%; height: 600px; }

@media (max-width:991px){
	.contact-page .media-order-1{ order: 1; }
	.contact-page .media-order-2{ order: 2; }
}

@media (max-width:767px){
	.contact-page .media-order-2 { margin-top: 30px; }
	.contact-page .panasia_widget_contacts .email-wrap a.email, .contact-page .panasia_widget_contacts .phone-wrap a.phone, .contact-page .panasia_widget_contacts .address-wrap address{ font-size: 16px; }
	.contact-page .panasia_widget_contacts .email-wrap, .contact-page .panasia_widget_contacts .phone-wrap, .contact-page .panasia_widget_contacts .address-wrap{ padding-bottom: 15px; }
	.contact-page .wpcf7-form input.form-control, .contact-page .wpcf7-form select.form-control { height: 46px; font-size: 16px; padding: 0px 15px; }
	.contact-page .wpcf7-form input.wpcf7-submit {  padding: 15px 15px; }
	.full-content-style.contact-page-map, .full-content-style.contact-page-map iframe{ height: 400px; }
}
/*--------------------------------------------------------------
## Subscribe Section
--------------------------------------------------------------*/
.subscribe-wrap{ background: #00578d; padding: 80px 0; }
.subscribe-wrap .mc4wp-form-fields{ text-align: center; color: #fff; }
.subscribe-wrap .mc4wp-form-fields h3{font-family: 'Noto Serif TC', serif; font-size: 30px; color: #fff; line-height: 42px; margin: 0; padding: 0 0 14px;}
.subscribe-wrap .mc4wp-form-fields p{ font-size: 18px; font-weight: normal; }
.subscribe-wrap .mc4wp-form-fields .form-inline{ padding-top: 14px; }
.subscribe-wrap .mc4wp-form-fields .form-inline .form-group{width: calc(100% - 170px);}
.subscribe-wrap .mc4wp-form-fields .form-inline .form-group .form-control{ border: 0; height: 60px; width: 100%; border-radius: 6px 0 0 6px; padding-left: 30px; text-transform: capitalize;}

.btn-subscribe{background: var(--primary-color); display: inline-block; min-width: 170px; border-radius: 0px 6px 6px 0; color: #fff; text-decoration: none; text-transform: uppercase; font-size: 16px; font-weight: 700; padding: 17px 20px; margin: 0; }
.btn-subscribe span{ position:relative; padding-right: 26px; }
.btn-subscribe span:after{ background: url(assets/images/arrow.svg) no-repeat center right; position: absolute; content: ''; width: 26px; height: 19px; right: 0; top: 0; }
.btn-subscribe:hover span:after {-webkit-animation-duration: .5s; animation-duration: .5s; -webkit-animation-fill-mode: both; animation-fill-mode: both; -webkit-animation-timing-function: linear; animation-timing-function: linear; animation-iteration-count: infinite; -webkit-animation-iteration-count: infinite; -webkit-animation-name: bounce; animation-name: bounce; }


@media (max-width:991px){
	.subscribe-wrap{ padding: 40px 0; }
}
@media (max-width:767px){
	.subscribe-wrap .mc4wp-form-fields .form-inline .form-group{ width: 100%; margin: 0; }
	.subscribe-wrap .mc4wp-form-fields .form-inline .form-group .form-control{ border-radius: 6px 6px 0px 0px; padding: 0 15px; text-align: center; }
	.btn-subscribe{ width: 100%; min-width: 100%; border-radius: 0px 0px 6px 6px; padding: 10px 20px; margin-top: 0;}
	.subscribe-wrap .mc4wp-form-fields h3 { font-size: 20px; line-height: 28px; padding-bottom: 15px; }
	.subscribe-wrap .mc4wp-form-fields p{ font-size: 16px; margin-bottom: 15px; }
	.subscribe-wrap .mc4wp-form-fields .form-inline .form-group .form-control{ height: 46px; }
}

/*--------------------------------------------------------------
## All Page Bottom Contact us Section
--------------------------------------------------------------*/
.contactus{ background-size: cover; background-position: 51%;}
.contactus .contact-content-wrap{min-height: 397px;}
.contactus h3{ color: #fff; font-size: 30px; font-family: 'Noto Serif TC', serif; text-align: center; line-height: 42px; margin-top: 12px;}
.contactus a.read-more{ display: inline-block; min-width: 164px; margin-top: 53px; }

@media (max-width:991px){
	.contactus a.read-more { margin-top: 20px; }
}
@media (max-width:767px){
	.contactus h3 { font-size: 20px; line-height: 28px; }
	.contactus a.read-more { margin-top: 15px; }
}
/*--------------------------------------------------------------
## Search Page
--------------------------------------------------------------*/
.search-page-sec{ padding: 60px 0px; }
.search-page-sec .page-header h1.page-title { color: var(--secondary-color); font-size: 30px; font-family: 'Noto Serif TC', serif; line-height: 42px; }
.search-page-sec h2.entry-title{ font-family: 'Noto Serif TC', serif; font-size: 30px; }
@media (max-width:767px){
	.search-page-sec{ padding: 40px 0px; }
	.search-page-sec .page-header h1.page-title{  font-size: 20px;line-height: 28px; }
	.search-page-sec h2.entry-title { font-size: 18px; line-height: 26px; margin-bottom: 15px; }
	.search-page-sec .entry-summary p{ font-size: 16px; line-height: 24px;  margin-bottom: 15px;}
}
/*--------------------------------------------------------------
## Page Not found Page
--------------------------------------------------------------*/
.page-not-found{ text-align: center; padding: 150px 0px; background: #EEEEEE; }
.page-not-found .not-found-box h1{ color: var(--secondary-color); font-size: 150px; font-family: 'Noto Serif TC', serif; margin: 0px;  }
.page-not-found .not-found-box h2{ color: var(--secondary-color); font-size: 30px; font-family: 'Noto Serif TC', serif; margin: 0px; }
.page-not-found .not-found-box p{ color: var(--secondary-color); font-size: 18px; line-height: 26px; margin: 30px 0px; }

@media (max-width:767px){
	.page-not-found{ padding: 60px 0px; }
	.page-not-found .not-found-box h1{ font-size: 50px; }
	.page-not-found .not-found-box h2{ font-size: 20px; }
	.page-not-found .not-found-box p{ font-size: 16px; line-height: 24px; margin: 15px 0px; }
}
/*--------------------------------------------------------------
## Footer
--------------------------------------------------------------*/
.site-info{ padding: 38px 0 30px; }
.site-info-top{ padding-bottom: 32px; }
.site-info-bottom{ border-top: 1px solid #EEEEEE; padding-top: 30px; }

.site-info .panasia_widget_contacts { display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; margin-right: -15px; margin-left: -15px; margin-bottom: 0; }
.site-info .panasia_widget_contacts .email-wrap, .site-info .panasia_widget_contacts .phone-wrap,
.site-info .panasia_widget_contacts .address-wrap{ -ms-flex: 0 0 33.333333%; flex: 0 0 33.333333%; max-width: 33.333333%; position: relative; width: 100%; min-height: 1px; padding-right: 15px; padding-left: 15px;}

.site-info .panasia_widget_contacts .email-wrap a.email, .site-info .panasia_widget_contacts .phone-wrap a.phone,
.site-info .panasia_widget_contacts .address-wrap address{ padding-left: 40px; color: var(--grey-color); font-size: 18px; line-height: 26px; margin: 0;}

.site-info .panasia_widget_contacts .email-wrap a.email{ background: url(assets/images/mail.svg) no-repeat left center; }
.site-info .panasia_widget_contacts .phone-wrap a.phone{ background: url(assets/images/phone.svg) no-repeat left center; }
.site-info .panasia_widget_contacts .address-wrap address{ background: url(assets/images/map.svg) no-repeat left 5px; padding-left: 35px; width: 250px; } 

.site-info .copyright{ color: var(--grey-color); font-size: 14px; margin: 0; padding-top: 8px;  }
.site-info .copyright a{ color: var(--grey-color); margin: 0 0 0 17px; position: relative; }
.site-info .copyright a:before{ content: ''; width: 1px; height: 12px; background: #CCCCCC; display: inline-block; position: absolute; left: -9px; top: 3px;}
.site-info .footer-logo{ width: 35px; }
.site-info .panasia_widget_socials{ margin: 0; padding: 0; }

.site-info .social-link{ margin: 0; padding: 0; list-style-type: none; }
.site-info .social-link li{ margin: 0; padding: 0; list-style-type: none; display: inline-block; }
.site-info .social-link li a{ display: flex; width: 30px; text-align: center; color: var(--grey-color); justify-content: center; align-items: center; height: 26px;}
.site-info .social-link li a.facebook{ margin-left: 0; }
.site-info .social-link li a.twitter{ margin-left: 7px; }
.site-info .social-link li a.instagram{ margin-left: 10px; }
.site-info .social-link li a.youtube{ margin-left: 14px; }
.site-info .social-link li a i.fab{ font-size: 22px; }
.site-info .social-link li a i.fa-instagram{ font-size: 24px; }
.site-info .social-link li a i.fa-youtube{ font-size: 26px; }

@media (max-width:991px){
	.site-info-top{ padding-bottom: 17px; }
	.site-info-bottom{ padding-top: 15px; }
	.site-info address, .site-info a.email, .site-info a.phone{ font-size: 15px; padding-left: 30px; }
	.site-info address{ padding-left: 30px; }
	.site-info .copyright a{ clear: both; display: inline-block; margin: 0; }
	.site-info .copyright a:before{ width: 0; height: 0; left: 0; top: 0; }
	.site-info .panasia_widget_contacts .email-wrap, .site-info .panasia_widget_contacts .phone-wrap, .site-info .panasia_widget_contacts .address-wrap{ -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; }
	.site-info .panasia_widget_contacts .phone-wrap{ margin-top: 30px; }
	.site-info .copyright{ padding-top: 0px; }
	
}
@media (max-width:767px){
	.site-info address, .site-info a.email, .site-info a.phone{ margin-bottom: 15px; display: inline-block; width: auto; }
	.site-info-bottom{ text-align: center; }
	.site-info-bottom .text-right{ text-align: center !important; }
	.site-info-bottom img.footer-logo{ margin: 15px 0; display: inline-block; }
	.site-info .panasia_widget_contacts{ display: block; }
	.site-info .panasia_widget_contacts .phone-wrap, .site-info .panasia_widget_contacts .email-wrap{ margin-top: 15px; }
	.site-info .panasia_widget_contacts .email-wrap, .site-info .panasia_widget_contacts .phone-wrap, .site-info .panasia_widget_contacts .address-wrap{ -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; }
	.site-info .panasia_widget_contacts .email-wrap a.email, .site-info .panasia_widget_contacts .phone-wrap a.phone, .site-info .panasia_widget_contacts .address-wrap address{ font-size: 16px; line-height: 24px; }
}
/*--------------------------------------------------------------
## All Product Page Section
--------------------------------------------------------------*/
.product-item-cat-title{ text-align: left !important; margin: 0 !important; font-size: 23px !important; font-weight: 700; color: var(--black-color) !important; }
ul.product-item-cat-wrap{ display: inline-block; margin: 0; width: 100%; padding: 0 36px;}
ul.product-item-cat-wrap li { float: left; width: 32%; padding: 6px 0; list-style: none; position: relative; }
ul.product-item-cat-wrap li a:hover { color: var(--primary-color); }
ul.product-item-cat-wrap li a { font-size: 18px; color: var(--grey-color); }
ul.product-item-cat-wrap li a:before { content: ""; width: 3px; height: 3px; display: block; background:  var(--grey-color); border-radius: 50%; position: absolute; left: -23px; top: 17px; margin: auto; }
ul.product-item-cat-wrap li a:hover:before { background: var(--primary-color); }
.popover{ box-shadow: 0px 0px 15px 0px #e4e1e1; border-radius: 8px; z-index: 1;}
.popover img { width: 185px; }
.trusted-by-bg{ background: #f9f9f9; }
ul.trusted_by_img { display: block; margin: auto; padding: 0; text-align: center;}
ul.trusted_by_img li:first-child { margin-right: 34px; }
ul.trusted_by_img li { display: inline-block; /* margin-right: 17px; */ }
span.s1 { margin-bottom: 25px; display: block; }
h3.product-item-cat-title { padding: 33px 0 14px; font-family: 'Roboto', sans-serif;}
.product-page .full-content-style:nth-child(2n) {
    padding: 33px 0 66px;
}
.product-page  .full-content-style:nth-child(2n) .container:after{ 
	padding-bottom: 59px;
    border-bottom: 1px solid #e8e9ea;
    content: "";
    position: absolute;
    width: 68%;
    left: 0;
    right: 0;
    margin: auto;
}
.product-page  .full-content-style.product-mrg:nth-child(3) {
    padding: 33px 0 66px;
}
@media (max-width:767px){
	.full-content-style h2 { padding: 0px 0px 15px 0px; }
	.product-item-cat-title{ font-size: 18px !important; }
	ul.trusted_by_img{ width: 90%;}
	ul.trusted_by_img li:first-child { margin-right: 8px; }
	ul.product-item-cat-wrap li{ width: 100%; }
	ul.product-item-cat-wrap li a{ font-size: 16px; }
	ul.trusted_by_img li { display: inline; margin-right: 0; width: 50%; text-align: center; }
	ul.trusted_by_img li img { width: 47%; }

}