@charset "UTF-8";



input[type='text'],
input[type='password'] {
	width: 180px;
	height: 35px;
	border: 0;
	font-size: 0.9rem;
	padding: 5px;
	background-color: #e5e5e5;
}

@media screen and (min-width: 1025px) {
	input[type='text']:focus,
	input[type='password']:focus {
		outline: none;
		-webkit-box-shadow: 0 0 0 0.2rem rgba(219, 59, 0, 1);
				box-shadow: 0 0 0 0.2rem rgba(219, 59, 0, 1);
	}
}

input.search-btn {
	width: 35px;
	height: 35px;
	display: inline-block;
	vertical-align: top;
	border: none;
	background-image: url('../../images/icon/search_w.svg');
	background-repeat: no-repeat;
	background-color: #db3b00;
	background-position: center;
	background-size: 60%;
	cursor: pointer;
}

@media screen and (min-width: 1025px) {
    input.search-btn:focus {
        outline: none;
        -webkit-box-shadow: 0 0 0 0.2rem rgba(255, 114, 71, 0.5);
        box-shadow: 0 0 0 0.2rem rgba(255, 114, 71, 0.5);
    }
}

/* 跳過工具欄選單 */
.skiptoolbarMenu {
	font-size: 0rem;
    display: block;
    background-color: #db3b00;
    color: #fff;
    border-radius: 0px;
    padding: 0px;
    margin: 0px;
    opacity: 0;
    width: 0px;
    height: 0px;
}

@media screen and (min-width: 1025px) {
	.skiptoolbarMenu:focus {
		width: auto;
		height: 45px;
		line-height: 45px;
		color: #fff;
		font-size: 1rem;
		padding: 0px 5px;
		opacity: 1;
		position: absolute;
		right: 0px;
		white-space: nowrap;
		z-index: 1000;
	}
}


/* 日曆 */
.datepicker {
	display: inline-block;
	margin-right: 10px;
}

.datepicker>input[type='text'] {
	cursor: pointer;
}

.datepicker::after {
	content: '';
	width: 35px;
	height: 35px;
	display: inline-block;
	vertical-align: top;
	background-image: url('../../images/icon/calendar.svg');
	background-repeat: no-repeat;
	background-position: center;
	background-size: contain;
}

/* 更多 */
.more-zoom {
	display: none;
}

/* Hashtag */
.hashtag {
	margin-bottom: 20px;
	font-size: 0rem;
}

.hashtag a,
.hashtag span {
	display: inline-block;
	vertical-align: top;
	margin-right: 5px;
	margin-bottom: 5px;
	border-width: 1px;
	border-style: solid;
	border-color: #c9c9c9;
	color: #000;
	padding: 3px 20px;
	font-size: 1.06rem;
}

.content > .wrap .hashtag a {
	border-bottom-color: #c9c9c9;
}

.sort-hashtag a,
.sort-hashtag span {
	border: none;
	background-color: #e6e6e6;
	line-height: 30px;
}

.sort-hashtag .color-red {
	color: #fff;
	background-color: #fe6036;
	background-color: #db3b00;
}

.sort-hashtag .color-orange {
	color: #fff;
	background-color: #db3b00;
}

.sort-hashtag .color-fullred {
	color: #fff;
	background-color: #d43d3d;
}

.sort-hashtag .color-skyblue {
	color: #fff;
	background-color: #2c7da7;
}

.sort-hashtag .color-pinkred {
	color: #fff;
	background-color: #d4385d;
}

.sort-hashtag .color-lightgreen {
	color: #fff;
	background-color: #6b7c06;
}

.sort-hashtag .color-purple {
	color: #fff;
	background-color: #a851c1;
}

.sort-hashtag .color-mint {
	color: #fff;
	background-color: #118570;
}

.sort-hashtag .color-green {
	color: #fff;
	background-color: #32833e;
}

.sort-hashtag .color-meatred {
	color: #fff;
	background-color: #d57878;
}

.sort-hashtag .color-matchabrown {
	color: #fff;
	background-color: #7d7a0b;
}

@media screen and (min-width: 1025px) {

	.hashtag a:hover,
	.hashtag a:focus {
		background-color: #db3b00;
		border-color: #db3b00;
		color: #fff;
	}

	.content > .wrap .hashtag a:hover,
	.content > .wrap .hashtag a:focus {
		border-bottom-color: #db3b00;
	}
}

@media screen and (max-width: 480px) {

	.hashtag a,
	.hashtag span {
		font-size: 1rem;
		padding: 0px 10px;
	}
}

/* Light Gallery */
body .lg-outer,
body .lg-backdrop {
	z-index: 5000;
}

/* 一般內容樣式設定 */
.content {
	line-height: 1.8em;
	font-size: 1.125rem;
	position: relative;
	padding: 1px;
}

.content ul {
	list-style: disc;
	padding-left: 25px;
	margin-bottom: 30px
}

.content ol {
	list-style: decimal;
	padding-left: 35px;
	margin-bottom: 30px;
	line-height: 1.8em;
}

.content img.inner-icon {
	width: 35px;
	height: 35px;
	display: inline-block;
	vertical-align: top;
	margin-right: 10px;
}

.content article img.inner-icon {
	vertical-align: middle;
}

.content>.wrap {
	padding: 30px 0px;
	position: relative;
}

@media screen and (max-width: 480px) {
	.content {
		font-size: 1rem;
	}

	.content>.wrap {
		padding: 20px 0px;
	}
}

@media screen and (max-width: 400px) {
	.content {
		font-size: 0.95rem;
	}
}

/* Grid 格狀欄位 */
ul.grid {
	list-style: none;
	padding-left: 0px;
	margin-bottom: 0px;
	margin: 0px 0px 20px;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: horizontal;
	-webkit-box-direction: normal;
	-ms-flex-flow: row wrap;
	flex-flow: row wrap;
}

ul.grid>li {
	-webkit-transition: all 0.3s ease;
	-o-transition: all 0.3s ease;
	transition: all 0.3s ease;
}

/* 功能欄位 */
.navbar {
	padding: 12px 0px;
}

.navbar>.wrap {
	position: relative;
}

/* 麵包屑 */
.breadcrumb {
	float: left;
	width: 100%;
	height: 45px;
	overflow-y: hidden;
	overflow-x: auto;
	word-break: break-all;
	white-space: nowrap;
	font-size: 0rem;
}

.breadcrumb.is-limitsize {
	width: calc(100% - 150px);
}

.breadcrumb>li {
	display: inline-block;
	vertical-align: middle;
	font-size: 1rem;
	line-height: 45px;
}

.breadcrumb>li::after {
	content: '';
	width: 30px;
	height: 45px;
	line-height: 45px;
	display: inline-block;
	vertical-align: middle;
	background: url('../../images/icon/arrow-right.svg') no-repeat center/50%;
}

.breadcrumb>li:first-child::after,
.breadcrumb>li:last-child::after {
	display: none;
}

.breadcrumb a {
	display: inline-block;
	vertical-align: top;
	color: #020202;
	overflow: hidden;
	white-space: nowrap;
}

@media screen and (min-width: 1025px) {
	.breadcrumb a:focus {
		-webkit-box-shadow: inset 0 0 0 0.2rem rgba(255, 114, 71, 0.5);
		        box-shadow: inset 0 0 0 0.2rem rgba(255, 114, 71, 0.5);
	}
}

.breadcrumb>li:nth-child(2) a {
	width: 30px;
	height: 45px;
	background-image: url('../../images/icon/home.svg');
	background-repeat: no-repeat;
	background-position: center;
	background-size: contain;
	text-indent: -9999px;
}

@media screen and (min-width: 1024px) {

	.breadcrumb a:hover,
	.breadcrumb a:focus {
		color: #db3b00;
	}
}

@media screen and (max-width: 1024px) {
	.breadcrumb>li:first-child a {
		display: none;
	}
}

@media screen and (max-width: 767px) {
	.breadcrumb {
		height: 40px;
	}

	.breadcrumb.is-limitsize {
		width: calc(100% - 130px);
	}

	.breadcrumb>li {
		line-height: 40px;
	}

	.breadcrumb>li:nth-child(2) a {
		height: 40px;
	}

	.breadcrumb>li::after {
		height: 40px;
		line-height: 40px;
		vertical-align: top;
	}
}

@media screen and (max-width: 480px) {
	.breadcrumb>li {
		font-size: 0.8rem;
	}

	.breadcrumb>li::after {
		width: 20px;
	}
}

/* 標題 */
.title {
	overflow: hidden;
}

.title h2,
.title .h2 {
	margin-top: 0px;
}

.title h3,
.title .h3 {
	display: inline-block;
}

.title .title-icon {
	width: 75px;
	display: block;
	margin: 0px auto 10px;
	overflow: hidden;
}

.title .title-icon>img {
	display: block;
	width: 100%;
}

.title .sort-item {
	display: inline-block;
	padding-left: 20px;
}

@media screen and (max-width: 767px) {
	.title h3,
	.title .h3 {
		display: block;
	}

	.title .sort-item {
		display: block;
		padding-left: 0px;
	}
}

/* 副標區塊 */
.subtitle {
	margin-bottom: 20px;
}

.subtitle .star-blk {
	display: inline-block;
	vertical-align: top;
}

.subtitle h2,
.subtitle .h2 {
	display: inline-block;
	margin-bottom: 0px;
}

.subtitle h3,
.subtitle .h3 {
	display: inline-block;
	margin-bottom: 0px;
}

.subtitle .sort-personal {
	margin-bottom: 0px;
}

.content .star-blk {
	font-size: 0rem;
	margin-bottom: 0px;
}

.content .star-blk>img {
	display: inline-block;
	vertical-align: top;
	height: 30px;
}

@media screen and (max-width: 480px) {
	.content .star-blk>img {
		height: 25px;
	}
}

/* 內頁版型的樣式設定 */
.main.page-inner .content {
	background-color: transparent;
	padding: 0px;
}

.main.page-inner .content>.wrap {
	background-color: #fff;
	padding: 30px;
}

.main.page-inner .title h2,
.main.page-inner .title .h2 {
	float: left;
	margin-bottom: 20px;
	text-align: left;
}

html[lang="zh-Hant-TW"] .main.page-inner .title h2,
html[lang="zh-Hant-TW"] .main.page-inner .title .h2,
html[lang="zh-Hant"] .main.page-inner .title h2,
html[lang="zh-Hant"] .main.page-inner .title .h2,
html[lang="zh-TW"] .main.page-inner .title h2,
html[lang="zh-TW"] .main.page-inner .title .h2 {
	font-family: 'Noto Sans TC', sans-serif;
	letter-spacing: 2px;
}

.main.page-inner .title .linkbtn {
	float: right;
}

.main.page-inner .share-zone {
	background-color: transparent;
}

.main.page-inner.condition-open .navbar {
	background-color: transparent;
}

@media screen and (max-width: 1000px) {
	.main.page-inner .content>.wrap {
		padding: 20px;
	}
}

@media screen and (max-width: 767px) {
	.main.page-inner .title h2,
	.main.page-inner .title .h2 {
		display: block;
	}
}

@media screen and (max-width: 480px) {
	.main.page-inner .title .linkbtn {
		float: none;
		clear: both;
	}

	.main.page-inner .content>.wrap {
		padding: 15px 10px;
	}
}

/* 功能欄位 */
.feature {
	position: absolute;
	right: 30px;
	top: 30px;
	z-index: 100;
}

.content .feature {
	padding-left: 0px;
	margin-bottom: 0px;
	list-style: none;
}

.no-js .feature {
	display: none;
	padding: 10px 20px;
	position: static;
	background-color: #f1f1f1;
}

.no-js .feature a {
	display: inline-block;
}

.no-js .feature .feature-item{
	display: inline-block;
	vertical-align: top;
	margin-right: 10px;
	margin-bottom: 0px;
}

.no-js .feature .feature-share-list{
	display: inline-block;
	vertical-align: top;
	position: static;
	padding-top: 0px;
}

.no-js .feature-share-list > li{
	display: inline-block;
	vertical-align: top;
}

@media screen and (min-width: 1025px) {
	.feature.is-basic {
		width: 100%;
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-pack: end;
		    -ms-flex-pack: end;
		        justify-content: flex-end;
		padding: 10px 20px;
		position: static;
		background-color: #f1f1f1;
	}

	.feature.is-basic .feature-item{
		margin-right: 10px;
		margin-bottom: 0px;
	}

	.feature.is-basic .feature-share-list{
		position: absolute;
		z-index: 1;
	}
}

.feature .feature-item {
	display: block;
	margin-bottom: 15px;
}

.feature .feature-item:last-child {
	margin-bottom: 0px;
}

.feature a {
	width: 45px;
	height: 45px;
	display: block;
	border-width: 1px;
	border-color: #3a3a3a;
	border-style: solid;
	border-radius: 100%;
	text-indent: -9999px;
	background-color: #fff;
	background-position: center;
	background-repeat: no-repeat;
	background-size: 80%;
}

.feature a.fontSize.fontSize-reduce {
	background-image: url('../../images/icon/fontsize_reduce.svg');
}

.feature a.fontSize.fontSize-addition {
	background-image: url('../../images/icon/fontsize_addition.svg');
}

.feature a.print {
	background-image: url('../../images/icon/print.svg');
}

.feature a.share {
	background-image: url('../../images/icon/share_black.svg');
	background-size: 60%;
}

@media screen and (min-width: 1025px) {

	.feature a:hover,
	.feature a:focus {
		background-color: #db3b00;
		border-color: #db3b00;
	}

	.feature a.fontSize.fontSize-reduce:hover,
	.feature a.fontSize.fontSize-reduce:focus {
		background-image: url('../../images/icon/fontsize_reduce_w.svg');
	}

	.feature a.fontSize.fontSize-addition:hover,
	.feature a.fontSize.fontSize-addition:focus {
		background-image: url('../../images/icon/fontsize_addition_w.svg');
	}

	.feature a.print:hover,
	.feature a.print:focus {
		background-image: url('../../images/icon/print_w.svg');
	}

	.feature a.share:hover,
	.feature a.share:focus {
		background-image: url('../../images/icon/share_w.svg');
	}
}

ul.feature-share-list {
	display: none;
	padding-top: 5px;
	padding-left: 0px;
	margin: 0px;
	list-style: none;
}

.feature-share-list>li {
	margin-bottom: 5px;
}

.feature-share-list a {
	background-color: #bdbdbd;
	border-color: #bdbdbd;
}

.feature-share-list a.icon-facebook {
	background-image: url('../../images/icon/shareicon_facebook.svg');
}

.feature-share-list a.icon-twitter {
	background-image: url('../../images/icon/shareicon_twitter.svg');
}

.feature-share-list a.icon-google {
	background-image: url('../../images/icon/shareicon_google.svg');
}

.feature-share-list a.icon-plurk {
	background-image: url('../../images/icon/shareicon_plurk.svg');
}

.feature-share-list a.icon-line {
	background-image: url('../../images/icon/shareicon_line.svg');
}

@media screen and (min-width: 1025px) {

	.feature-share-list a:hover,
	.feature-share-list a:focus {
		border-color: #bdbdbd;
	}

	.feature-share-list a.icon-facebook:hover,
	.feature-share-list a.icon-facebook:focus {
		background-color: #3b5998;
	}

	.feature-share-list a.icon-twitter:hover,
	.feature-share-list a.icon-twitter:focus {
		background-color: #00aced;
	}

	.feature-share-list a.icon-google:hover,
	.feature-share-list a.icon-google:focus {
		background-color: #d64136;
	}

	.feature-share-list a.icon-plurk:hover,
	.feature-share-list a.icon-plurk:focus {
		background-color: #c6602b;
	}

	.feature-share-list a.icon-line:hover,
	.feature-share-list a.icon-line:focus {
		background-color: #2cbf13;
	}
}

@media screen and (max-width: 1024px) {
	.feature {
		display: none;
	}
}

/* 進階搜尋 */
.main.condition-open .condition-search {
	height: auto;
	padding: 0px 0px 15px;
	visibility: visible;
}

.condition-search {
	background-color: #f2f2f2;
	height: 0px;
	padding: 0px;
	visibility: hidden;
	-webkit-transition: all 0.3s ease;
	-o-transition: all 0.3s ease;
	transition: all 0.3s ease;
}

.no-js .condition-search {
	height: auto;
	padding: 20px 0px;
	visibility: visible;
}

.condition-search > .wrap {
	position: relative;
}

.condition-search h3,
.condition-search .h3 {
	color: #db3b00;
}

.condition-search h3::before,
.condition-search .h3::before {
	content: '';
	width: 0px;
	height: 0px;
	margin-right: 10px;
	display: inline-block;
	vertical-align: bottom;
	background-position: center;
	background-repeat: no-repeat;
	background-size: contain;
}

.condition-search .icon-condition-stroke::before {
	background-image: url('../../images/icon/condition-stoke.svg');
}

.condition-search .icon-condition-viewpoint::before {
	background-image: url('../../images/icon/condition-viewpoint.svg');
}

.condition-search .icon-condition-railway::before {
	background-image: url('../../images/icon/condition-railway.svg');
}

.condition-search .icon-condition-calendar::before {
	background-image: url('../../images/icon/condition-calendar.svg');
}

.condition-search .row {
	padding: 15px 0px 10px;
	border-bottom: 1px #c8c8c8 solid;
	font-size: 0rem;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
}

.condition-search .row:first-child {
	padding-top: 0px;
}

.condition-search .row:last-child {
	border-bottom: none;
	padding-bottom: 0px;
}

.condition-search .caption,
.conditionList {
	display: inline-block;
	vertical-align: top;
}

.condition-search .caption {
	min-width: 110px;
	min-height: 35px;
	padding: 3px 13px;
	margin-right: 10px;
	margin-bottom: 10px;
	text-align: right;
	font-size: 1.2rem;
	font-weight: bold;
	line-height: 1.4em;
	color: #242424;
}

.conditionList {
	max-width: calc(100% - 120px);
	display: -webkit-inline-box;
	display: -ms-inline-flexbox;
	display: inline-flex;
	-webkit-box-orient: horizontal;
	-webkit-box-direction: normal;
	-ms-flex-flow: row wrap;
	flex-flow: row wrap;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	font-size: 0rem;
}

.conditionList>.item {
	font-size: 0rem;
}

.conditionList>.item>a {
	line-height: 35px;
	margin: 0px 10px;
}

.conditionList>.item>label {
	display: inline-block;
	min-width: 110px;
	min-height: 35px;
	padding: 3px 13px;
	margin-right: 10px;
	margin-bottom: 10px;
	text-align: right;
	font-size: 1.2rem;
	font-weight: bold;
	line-height: 1.4em;
	color: #242424;
}

.conditionList input[type='radio']+label,
.conditionList input[type='checkbox']+label {
	display: block;
	cursor: pointer;
	color: #242424;
	padding: 3px 13px;
	border-style: solid;
	border-width: 1px;
	border-color: transparent;
	margin-right: 5px;
	margin-bottom: 5px;
	font-size: 1rem;
	min-width: auto;
	min-height: auto;
	text-align: center;
	font-weight: unset;
}

.conditionList input[type='radio']:checked+label,
.conditionList input[type='checkbox']:checked+label{
	color: #db3b00;
	border-color: #db3b00;
}

@media screen and (min-width: 1025px) {
	.conditionList input[type='radio']:focus + label,
	.conditionList input[type='checkbox']:focus + label{
		-webkit-box-shadow: inset 0 0 0 0.2rem rgba(255, 114, 71, 0.5);
				box-shadow: inset 0 0 0 0.2rem rgba(255, 114, 71, 0.5);
	}
}

.conditionList label {
	padding: 3px 25px;
}

.conditionList label.round:not(.disabled-round) {
	width: 45px;
	height: 45px;
	line-height: 45px;
	padding: 0px;
	margin-left: 14px;
	margin-right: 14px;
	background-color: #fff;
	border-radius: 100%;
	position: relative;
	text-align: center;
	border: none;
	font-size: 0.9rem;
	border: 1px #dcdcdc solid;
}

.conditionList label.round:not(.disabled-round)::before {
	content: '';
	background-color: #dcdcdc;
	width: 30px;
	height: 10px;
	display: block;
	position: absolute;
	top: calc((100% - 10px)/2);
	right: -30px;
}

.conditionList>li:last-child label.round:not(.disabled-round)::before {
	display: none;
}

.conditionList>.item:last-child label.round:not(.disabled-round)::before {
	display: none;
}

.conditionList input.search-btn {
	width: 50px;
	height: 35px;
	background-size: 40%;
	margin-bottom: 5px;
}

@media screen and (min-width: 1025px) {
	.conditionList input.search-btn:focus {
		outline: none;
		-webkit-box-shadow: 0 0 0 0.2rem rgba(255, 114, 71, 0.5);
				box-shadow: 0 0 0 0.2rem rgba(255, 114, 71, 0.5);
	}
}

.conditionList input[type='radio']:checked+label.round:not(.disabled-round),
.conditionList input[type='checkbox']:checked+label.round:not(.disabled-round) {
	background-color: #db3b00;
	color: #fff;
	border: none;
}

.conditionList input[type='radio'],
.conditionList input[type='checkbox'] {
	border: none;
	width: 0;
	height: 0;
	opacity: 0;
	position: absolute;
}

.condition-btn {
	height: 45px;
	line-height: 45px;
	float: right;
	visibility: visible;
}

.condition-btn>span {
	font-size: 1.1rem;
	font-weight: bold;
	color: #000;
}

.condition-btn>span.open {
	display: inline-block;
}

.condition-btn>span.close {
	display: none;
}

.condition-btn:hover,
.condition-btn:focus {
	color: #000;
}

.condition-btn.is-active>span.open {
	display: none;
}

.condition-btn.is-active>span.close {
	display: inline-block;
}

.condition-btn::after {
	content: '';
	width: 45px;
	height: 45px;
	margin-left: 10px;
	display: inline-block;
	vertical-align: top;
	border-radius: 100%;
	background-color: #db3b00;
	background-repeat: no-repeat;
	background-position: center;
	background-size: 70%;
	background-image: url('../../images/icon/conditionbtn_open.svg');
}

.condition-btn.is-active::after {
	background-image: url('../../images/icon/conditionbtn_close.svg');
}

.no-js .condition-btn {
	display: none;
}

@media screen and (max-width: 767px) {
	.main.condition-open .condition-search {
		padding: 10px 0px;
	}

	.condition-btn {
		height: 40px;
		line-height: 40px;
	}

	.condition-btn::after {
		width: 40px;
		height: 40px;
		margin-left: 3px;
	}

	/* .condition-btn > span.open,
    .condition-btn > span.close,
    .condition-btn.is-active > span.open,
    .condition-btn.is-active > span.close{
        display: none;
	} */
	.condition-search h3::before,
	.condition-search .h3::before {
		width: 0px;
		height: 0px;
	}
}

@media screen and (max-width: 480px) {
	.condition-search .row {
		display: block;
		padding: 10px 0px;
	}

	.condition-search .caption {
		width: 100%;
		min-height: auto;
		min-width: auto;
		display: block;
		padding: 0px;
		text-align: left;
		font-size: 1rem;
	}

	.conditionList {
		max-width: 100%;
		width: 100%;
		display: block;
		position: relative;
		overflow: hidden;
	}

	.conditionList>li {
		float: left;
	}

	.conditionList .item {
		display: inline-block;
	}

	.conditionList>.item>label {
		width: 100%;
		min-height: auto;
		min-width: auto;
		display: block;
		padding: 0px;
		text-align: left;
		font-size: 1rem;
	}

	.condition-btn>span {
		font-size: 0.96rem;
		letter-spacing: 0px;
	}
}

/* Grid（內文三格） */
.inner-list>li {
	width: 33.33%;
	padding: 0px 10px;
}

.inner-list p {
	text-align: center;
}

.inner-list figure {
	position: relative;
	width: 100%;
	height: 0px;
	padding-bottom: 67%;
	overflow: hidden;
	margin-bottom: 10px;
}

.inner-list figure>img {
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0px;
	left: 0px;
	-o-object-fit: cover;
	object-fit: cover;
}

@media screen and (max-width: 767px) {
	.inner-list>li {
		width: 50%;
	}
}

@media screen and (max-width: 480px) {
	.inner-list>li {
		width: 100%;
		padding: 0px;
	}
}

/* Grid（窗格） */
.lattice-list>li {
	width: 25%;
	padding: 10px;
}

.lattice {
	display: block;
	position: relative;
	background-color: #000;
}

.lattice::after {
	content: '';
	width: 20%;
	height: 0px;
	padding-bottom: 20%;
	display: block;
	position: absolute;
	left: 0;
	top: 0;
	background-size: 80%;
	background-position: center;
	background-repeat: no-repeat;
}

.lattice figcaption {
	position: absolute;
	width: calc(100% - 10px);
	bottom: 20px;
	left: 20px;
}

.lattice figcaption span {
	display: block;
	color: #fff;
	font-size: 1.2rem;
	font-weight: bold;
}

.lattice .lattice-title {
	font-size: 1.5rem;
}

.lattice .graphic {
	width: 100%;
	height: 0px;
	padding-bottom: 100%;
	position: relative;
	overflow: hidden;
}

.lattice .graphic>img {
	position: absolute;
	width: 100%;
	height: 100%;
	left: 0;
	top: 0;
	-o-object-fit: cover;
	object-fit: cover;
	-webkit-filter: brightness(.6);
	filter: brightness(.6);
}

.no-js .lattice .graphic noscript img {
	position: absolute;
	width: 100%;
	height: 100%;
	left: 0;
	top: 0;
	-o-object-fit: cover;
	object-fit: cover;
	-webkit-filter: brightness(.6);
	filter: brightness(.6);
}

/*.lattice.icon-trip-hotspring::after {
    background-image: url('../../images/icon/tripicon_hotspring.svg');
    background-color: #70bfe8;
}
.lattice.icon-trip-ecologic::after {
    background-image: url('../../images/icon/tripicon_ecologic.svg');
    background-color: #ba6fd0;
}
.lattice.icon-trip-culture::after {
    background-image: url('../../images/icon/tripicon_culture.svg');
    background-color: #f22d2d;
}
.lattice.icon-trip-railway::after {
    background-image: url('../../images/icon/tripicon_railway.svg');
    background-color: #43c4ad;
}
.lattice.icon-trip-food::after {
    background-image: url('../../images/icon/tripicon_food.svg');
    background-color: #db3b00;
}
.lattice.icon-trip-island::after {
    background-image: url('../../images/icon/tripicon_island.svg');
    background-color: #92c62e;
}
.lattice.icon-trip-lohas::after {
    background-image: url('../../images/icon/tripicon_lohas.svg');
    background-color: #f35d81;
}
.lattice.icon-trip-nmarket::after {
    background-image: url('../../images/icon/tripicon_nmarket.svg');
    background-color: #54c063;
}
.lattice.icon-trip-tribe::after {
    background-image: url('../../images/icon/tripicon_tribe.svg');
    background-color: #b7b21c;
}
.lattice.icon-trip-bike::after {
    background-image: url('../../images/icon/tripicon_bike.svg');
    background-color: #2ec6b2;
}
.lattice.icon-trip-oldman::after {
    background-image: url('../../images/icon/tripicon_oldman.svg');
    background-color: #d57878;
}
.lattice.icon-trip-accessibility::after {
    background-image: url('../../images/icon/tripicon_accessibility.svg');
    background-color: #c37ed4;
}*/
@media screen and (max-width: 1000px) {
	.lattice-list>li {
		width: 50%;
	}
}

@media screen and (max-width: 480px) {
	.lattice-list>li {
		padding: 2.5px;
	}

	.lattice figcaption span,
	.lattice .lattice-title {
		font-size: 1rem;
		font-weight: unset;
	}
}

/* 區塊清單 */
ul.columnBlock-list {
	padding-left: 0px;
	list-style: none;
}

.columnBlock-list {
	margin-bottom: 20px;
}

.columnBlock-list>li {
	width: 100%;
	display: block;
}

.columnBlock {
	overflow: hidden;
	padding: 30px 20px;
	border-bottom: 1px #c8c8c8 solid;
	-webkit-transition: all 0.3s;
	-o-transition: all 0.3s;
	transition: all 0.3s;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
}

.columnBlock-list>li:last-child .columnBlock {
	border-bottom: none;
}

.columnBlock .columnBlock-link,
.columnBlock .columnBlock-photo {
	width: 33.33%;
	position: relative;
	float: left;
	display: block;
}

.columnBlock figure {
	width: 100%;
	height: 0px;
	padding-bottom: 66.6%;
	position: relative;
	overflow: hidden;
}

.columnBlock figure>img {
	width: 100%;
	height: 100%;
	position: absolute;
	left: 0;
	top: 0;
	display: block;
	-o-object-fit: cover;
	object-fit: cover;
}

.no-js .columnBlock figure noscript img {
	width: 100%;
	height: 100%;
	position: absolute;
	left: 0;
	top: 0;
	display: block;
	-o-object-fit: cover;
	object-fit: cover;
}

.columnBlock .columnBlock-info {
	width: 66.66%;
	float: left;
	padding-left: 30px;
}

.columnBlock .columnBlock-title {
	font-size: 1.5rem;
	font-weight: bold;
	line-height: 30px;
	max-height: 60px;
	margin-bottom: 10px;
	overflow: hidden;
	-o-text-overflow: ellipsis;
	text-overflow: ellipsis;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	color: #020202;
}

.columnBlock .columnBlock-title:active {
	color: #db3b00;
}

@media screen and (min-width: 1025px) {

	.columnBlock .columnBlock-title:hover,
	.columnBlock .columnBlock-title:focus {
		color: #db3b00;
	}
}

.columnBlock .columnBlock-info p {
	margin-bottom: 0px;
	max-height: 90px;
	line-height: 30px;
	overflow: hidden;
	-o-text-overflow: ellipsis;
	text-overflow: ellipsis;
	display: -webkit-box;
	-webkit-line-clamp: 3;
	-webkit-box-orient: vertical;
}

.columnBlock .columnBlock-info span {
	color: #db3b00;
	display: block;
	line-height: 30px;
}

.columnBlock .columnBlock-info .date {
	font-size: 1.25rem;
	font-weight: bold;
	margin-bottom: 10px;
}

.columnBlock .columnBlock-insidebox {
	display: none;
	clear: both;
	width: 100%;
	padding: 20px;
	margin-top: 20px;
	background-color: #f2f2f2;
}

.columnBlock .columnBlock-insidebox dl {
	overflow: hidden;
	padding: 5px 0px;
}

.columnBlock .columnBlock-insidebox dt {
	width: 180px;
	float: left;
}

.columnBlock .columnBlock-insidebox dd {
	width: calc(100% - 180px);
	float: left;
}

.columnBlock .morebtn {
	display: inline-block;
	margin-bottom: 0px;
	margin-top: 10px;
	font-size: 1rem;
}

.columnBlock .hashtag {
	margin-bottom: 10px;
}

.columnBlock .hashtag a {
	border-color: transparent;
}

.columnBlock .target-hashtag a {
	background-color: #e6e6e6;
	color: #000;
}

.content > .wrap .columnBlock .target-hashtag a {
	border-bottom-color: #e6e6e6;
}

@media screen and (min-width: 1025px) {
	.content > .wrap .columnBlock .target-hashtag a:hover,
	.content > .wrap .columnBlock .target-hashtag a:focus {
		background-color: #db3b00;
		border-bottom-color: #db3b00;
		color: #fff;
	}
}

.columnBlock .upper-hashtag>span {
	display: inline-block;
}

.columnBlock .upper-hashtag .color-mint {
	background-color: #3fc6b8;
	color: #fff;
	border-color: #3fc6b8;
}

.columnBlock .upper-hashtag .color-orange {
	background-color: #db3b00;
	color: #fff;
	border-color: #db3b00;
}

.columnBlock .upper-hashtag .color-pinkred {
	background-color: #ca4464;
	color: #fff;
	border-color: #ca4464;
}

.columnBlock .upper-hashtag .color-red {
	background-color: #db3b00;
	color: #fff;
	border-color: #db3b00;
}

.columnBlock .upper-hashtag .color-purple {
	background-color: #a44cc4;
	color: #fff;
	border-color: #a44cc4;
}

/* @media screen and (min-width: 1025px) {
    .news-list .columnBlock:hover{
        background-color: #db3b00;
    }
    .news-list .columnBlock:hover .columnBlock-title,
    .news-list .columnBlock:hover .columnBlock-info span,
    .news-list .columnBlock:hover .columnBlock-info p{
        color: #fff;
    }
    .news-list .columnBlock:hover .upper-hashtag a,
    .news-list .columnBlock:hover .upper-hashtag span,
    .news-list .columnBlock:hover .target-hashtag a,
    .news-list .columnBlock:hover .target-hashtag span{
        background-color: #db3b00;
        border-color: #fff;
        color: #fff;
    }
    .news-list .columnBlock:hover .upper-hashtag a:hover,
    .news-list .columnBlock:hover .target-hashtag a:hover{
        background-color: #fff;
        color: #db3b00;
    }
} */
@media screen and (max-width: 1000px) {
	.columnBlock {
		padding: 30px 0px;
	}

	.columnBlock .columnBlock-link,
	.columnBlock .columnBlock-photo {
		width: 100%;
		float: none;
	}

	.columnBlock .columnBlock-info {
		width: 100%;
		float: none;
		padding-left: 0px;
		padding-top: 20px;
	}

	.columnBlock .morebtn {
		display: block;
	}
}

@media screen and (max-width: 767px) {
	.columnBlock-list>li:first-child .columnBlock {
		padding-top: 0px;
	}

	.columnBlock .columnBlock-insidebox dt {
		width: 100%;
		float: none;
	}

	.columnBlock .columnBlock-insidebox dd {
		width: 100%;
		float: none;
	}
}

@media screen and (max-width: 480px) {
	.columnBlock .columnBlock-title {
		font-size: 1.3rem;
	}

	.columnBlock .columnBlock-info .date {
		font-size: 1rem;
	}

	.columnBlock .columnBlock-insidebox {
		padding: 15px;
	}

	.columnBlock .morebtn {
		margin-top: 20px;
	}
}

.eventmember {
	text-align: right;
	clear: both;
	padding: 10px 0px;
}

.eventmember>a {
	display: inline-block;
	background-color: #db3b00;
	color: #fff;
	padding: 10px 15px;
	font-size: 1rem;
	line-height: 1em;
	border-radius: 5px;
}

@media screen and (min-width: 1025px) {

	.eventmember>a:hover,
	.eventmember>a:focus {
		background-color: #e06827;
		color: #fff;
	}
}

.calendar {
	display: inline-block;
	background-color: #db3b00;
	color: #fff;
	padding: 10px 15px;
	margin-bottom: 15px;
	font-size: 1rem;
	line-height: 1em;
	border-radius: 5px;
}

@media screen and (min-width: 1025px) {

	.calendar:hover,
	.calendar:focus {
		background-color: #e06827;
		color: #fff;
	}
}

/* 排序bar */
.sort-item {
	font-size: 1.125rem;
}

.sort-item a {
	padding: 0px 20px;
	margin-right: 5px;
	margin-bottom: 5px;
	border-width: 1px;
	border-style: solid;
	border-color: #c9c9c9;
	color: #000;
	display: inline-block;
}

.content .sort-item a {
	border-bottom-color: #c9c9c9;
}

.sort-item a.current {
	background-color: #db3b00;
	border-color: #db3b00;
	color: #fff;
}

.sort-item b {
	color: #db3b00;
}

@media screen and (min-width: 1025px) {

	.sort-item a:hover,
	.sort-item a:focus {
		background-color: #db3b00;
		border-color: #db3b00;
		color: #fff;
	}
}

@media screen and (max-width: 767px) {
	.sort-item {
		padding-left: 0px;
		margin-bottom: 20px;
	}
}

@media screen and (max-width: 480px) {
	.sort-item {
		line-height: 25px;
	}

	.sort-item>span {
		display: block;
		margin-bottom: 5px;
	}

	.sort-item a {
		padding: 0px 5px;
	}
}

/* 評價 */
.sort-personal {
	float: right;
	margin-bottom: 20px;
	font-size: 0rem;
	line-height: 1em;
}

.sort-personal a {
	display: inline-block;
	vertical-align: top;
	margin-left: 50px;
	margin-right: 0px;
}

.sort-personal a:first-child {
	margin-left: 0px;
}

.sort-personal a>span {
	line-height: 45px;
	font-size: 1.125rem;
}

.sort-personal a>span::after {
	content: '';
	width: 45px;
	height: 45px;
	margin-left: 10px;
	display: inline-block;
	vertical-align: bottom;
	border-radius: 100%;
	border-width: 1px;
	border-style: solid;
	border-color: #c8c8c8;
	background-repeat: no-repeat;
	background-size: 55%;
	background-position: center;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
}

.sort-personal a.icon-recommend>span::after {
	background-image: url('../../images/icon/recommend.svg');
}

.sort-personal a.icon-favorite>span::after {
	background-image: url('../../images/icon/favorite.svg');
}

.sort-personal a.icon-share>span::after {
	background-image: url('../../images/icon/share.svg');
}

.sort-personal a.icon-hash>span::after {
	background-color: #db3b00;
	background-image: url('../../images/icon/hash.svg');
	border-color: #db3b00;
}

.sort-personal a.icon-hash>span {
	font-weight: bold;
}

.sort-personal b {
	color: #db3b00;
}

.sort-personal a.icon-recommend.current>span::after {
	background-image: url('../../images/icon/recommend_w.svg');
	background-color: #f44d4e;
}

.sort-personal a.icon-favorite.current>span::after {
	background-image: url('../../images/icon/favorite_w.svg');
	background-color: #f44d4e;
	border-color: #f44d4e;
}

@media screen and (min-width: 1025px) {

	.sort-personal a:focus{
		-webkit-box-shadow: inset 0 0 0 0.2rem rgba(255, 114, 71, 0.5);
		        box-shadow: inset 0 0 0 0.2rem rgba(255, 114, 71, 0.5);
	}

	.sort-personal a:hover>span,
	.sort-personal a:focus>span {
		color: #db3b00;
	}

	.sort-personal a:hover>span::after,
	.sort-personal a:focus>span::after {
		background-color: #db3b00;
		border-color: #db3b00;
	}

	.sort-personal a.icon-recommend:hover>span::after,
	.sort-personal a.icon-recommend:focus>span::after {
		background-image: url('../../images/icon/recommend_w.svg');
	}

	.sort-personal a.icon-favorite:hover>span::after,
	.sort-personal a.icon-favorite:focus>span::after {
		background-image: url('../../images/icon/favorite_w.svg');
	}

	.sort-personal a.icon-favorite.current:hover>span::after,
	.sort-personal a.icon-favorite.current:focus>span::after {
		border-color: #f44d4e;
	}

	.sort-personal a.icon-share:hover>span::after,
	.sort-personal a.icon-share:focus>span::after {
		background-image: url('../../images/icon/share_w.svg');
	}

	.sort-personal a.icon-hash:hover>span::after,
	.sort-personal a.icon-hash:focus>span::after {
		background-color: #e06827;
		border-color: #e06827;
	}
}

@media screen and (max-width: 1560px) {
	.sort-personal {
		padding-right: 70px;
	}
}

@media screen and (max-width: 1024px) {
	.sort-personal {
		padding-right: 0px;
	}
}

@media screen and (max-width: 1000px) {
	.sort-personal a {
		margin-left: 0px;
		margin: 0px 5px;
		text-align: center;
	}

	.sort-personal a>span {
		line-height: 20px;
		display: block;
	}

	.sort-personal a>span::after {
		display: none;
	}

	.sort-personal a>span::before {
		content: '';
		width: 45px;
		height: 45px;
		margin: 0px auto 5px;
		display: block;
		border-radius: 100%;
		border-width: 1px;
		border-style: solid;
		border-color: #c8c8c8;
		background-repeat: no-repeat;
		background-size: 55%;
		background-position: center;
	}

	.sort-personal a.icon-recommend>span::before {
		background-image: url('../../images/icon/recommend.svg');
	}

	.sort-personal a.icon-favorite>span::before {
		background-image: url('../../images/icon/favorite.svg');
	}

	.sort-personal a.icon-share>span::before {
		background-image: url('../../images/icon/share.svg');
	}

	.sort-personal a.icon-hash>span::before {
		background-color: #db3b00;
		background-image: url('../../images/icon/hash.svg');
		border-color: #db3b00;
	}

	.sort-personal b {
		color: #db3b00;
	}

	.sort-personal a.icon-favorite.current>span::before {
		background-image: url('../../images/icon/favorite_w.svg');
		background-color: #f44d4e;
		border-color: #f44d4e;
	}
}

@media screen and (max-width: 767px) {
	.sort-personal {
		display: block;
		overflow: hidden;
	}

	.sort-personal a>span {
		font-size: 0rem;
		line-height: 0px;
	}

	.sort-personal a>span::before {
		width: 40px;
		height: 40px;
		margin-bottom: 0px;
	}

	.sort-personal a.icon-recommend {
		position: relative;
	}

	.sort-personal a.icon-recommend>span::before {
		display: none;
	}

	.sort-personal a.icon-recommend>span::after {
		content: '';
		width: 40px;
		height: 40px;
		display: inline-block;
		vertical-align: middle;
		border-radius: 100%;
		border-width: 1px;
		border-style: solid;
		border-color: #c8c8c8;
		background-repeat: no-repeat;
		background-size: 55%;
		background-position: center;
		background-image: url('../../images/icon/recommend.svg');
	}

	.sort-personal a.icon-recommend>span>b {
		font-size: 1rem;
		display: inline-block;
		vertical-align: middle;
	}
}

/* 檢視結果 */
.sort-filter {
	color: #242424;
	font-size: 1.3rem;
	font-weight: bold;
	line-height: 1.3em;
	margin: 20px 0px;
}

.sort-filter span {
	margin-right: 10px;
	font-weight: bold;
}

.sort-filter b {
	color: #db3b00;
	font-weight: bold;
	margin: 0px 5px;
}

/* 分頁 */
.pagination {
	margin-bottom: 20px;
	padding-top: 20px;
	border-top: 1px #c8c8c8 solid;
}

.pagination,
.pagination .prev-blk,
.pagination .page-blk,
.pagination .next-blk {
	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;
}

.pagination .page-blk {
	padding: 0px 15px;
}

.pagination a {
	width: 45px;
	height: 45px;
	display: block;
	border: 1px #c8c8c8 solid;
	margin: 0px 3px;
	text-align: center;
	line-height: 45px;
	font-size: 0.95rem;
	background-color: #fff;
	color: #757575;
}

.pagination a.current {
	border: 1px #db3b00 solid;
	background-color: #db3b00;
	color: #fff;
}

@media screen and (min-width: 1025px) {

	.pagination a:hover,
	.pagination a:focus {
		border: 1px #db3b00 solid;
		background-color: #db3b00;
		color: #fff;
	}
}

.pagination .prev-blk a,
.pagination .next-blk a {
	position: relative;
	text-indent: -9999px;
	color: #757575;
}

.pagination a.prev-page::before,
.pagination a.next-page::before {
	content: '';
	display: block;
	width: 0;
	height: 0;
	border-style: solid;
	position: absolute;
	left: calc((100% - 7px)/2);
	top: calc((100% - 12px)/2);
}

.pagination a.prev-page::before {
	border-width: 6px 7px 6px 0px;
	border-color: transparent #8f8f8f transparent transparent;
}

.pagination a.next-page::before {
	border-width: 6px 0px 6px 7px;
	border-color: transparent transparent transparent #8f8f8f;
}

.pagination a.first-page::before,
.pagination a.first-page::after,
.pagination a.last-page::before,
.pagination a.last-page::after {
	content: '';
	display: block;
	width: 0;
	height: 0;
	border-style: solid;
	position: absolute;
	top: calc((100% - 12px)/2);
}

.pagination a.first-page::before,
.pagination a.last-page::before {
	left: calc((100% - 14px)/2);
}

.pagination a.first-page::after,
.pagination a.last-page::after {
	right: calc((100% - 14px)/2);
}

.pagination a.first-page::before,
.pagination a.first-page::after {
	border-width: 6px 7px 6px 0px;
	border-color: transparent #8f8f8f transparent transparent;
}

.pagination a.last-page::before,
.pagination a.last-page::after {
	border-width: 6px 0px 6px 7px;
	border-color: transparent transparent transparent #8f8f8f;
}

@media screen and (min-width: 1025px) {

	.pagination a.prev-page:hover::before,
	.pagination a.first-page:hover::before,
	.pagination a.first-page:hover::after,
	.pagination a.prev-page:focus::before,
	.pagination a.first-page:focus::before,
	.pagination a.first-page:focus::after {
		border-color: transparent #fff transparent transparent;
	}

	.pagination a.next-page:hover::before,
	.pagination a.last-page:hover::before,
	.pagination a.last-page:hover::after,
	.pagination a.next-page:focus::before,
	.pagination a.last-page:focus::before,
	.pagination a.last-page:focus::after {
		border-color: transparent transparent transparent #fff;
	}
}

@media screen and (max-width: 767px) {
	.pagination a {
		width: 40px;
		height: 40px;
		line-height: 40px;
	}
}

@media screen and (max-width: 480px) {
	.pagination .page-blk a:not(.current) {
		visibility: hidden;
		width: 0;
		margin: 0;
		border: none;
	}
}

/* 頁面指標連結 */
.page-direction {
	text-align: center;
	margin: 20px 0px;
}

.page-direction>.wrap {
	position: relative;
}

.page-direction a {
	min-width: 130px;
	background-color: #fff;
	border-width: 1px;
	border-color: rgba(200, 200, 200, 0.5);
	border-style: solid;
	padding: 5px;
	display: inline-block;
}

.page-direction a>span {
	line-height: 30px;
}

.page-direction a>span::before {
	content: '';
	width: 30px;
	height: 30px;
	display: inline-block;
	vertical-align: bottom;
	background-position: center;
	background-size: 50%;
	background-repeat: no-repeat;
}

.page-direction a.prev-page {
	float: left;
}

.page-direction a.next-page {
	float: right;
}

.page-direction a.top-page {
	position: absolute;
	left: calc((100% - 130px)/2);
}

.page-direction a.prev-page>span::before {
	background-image: url('../../images/icon/arrow-left.svg');
}

.page-direction a.top-page>span::before {
	background-image: url('../../images/icon/arrow-up.svg');
}

.page-direction a.next-page>span::before {
	background-image: url('../../images/icon/arrow-right.svg');
}

@media screen and (min-width: 1025px) {

	.page-direction a:hover,
	.page-direction a:focus {
		background-color: #db3b00;
		border-color: #db3b00;
	}

	.page-direction a:hover>span,
	.page-direction a:focus>span {
		color: #fff;
	}

	.page-direction a.prev-page:hover>span::before,
	.page-direction a.prev-page:focus>span::before {
		background-image: url('../../images/icon/arrow-left_w.svg');
	}

	.page-direction a.top-page:hover>span::before,
	.page-direction a.top-page:focus>span::before {
		background-image: url('../../images/icon/arrow-up_w.svg');
	}

	.page-direction a.next-page:hover>span::before,
	.page-direction a.next-page:focus>span::before {
		background-image: url('../../images/icon/arrow-right_w.svg');
	}
}

@media screen and (max-width: 480px) {
	.page-direction a {
		min-width: auto;
		width: 33.33%;
		font-size: 0.9rem;
	}

	.page-direction a.top-page,
	.page-direction a.next-page,
	.page-direction a.prev-page {
		float: left;
		position: static;
	}
}

/* 上下頁指標連結 */
.article-direction {
	margin: 20px 0px;
}

.article-direction a {
	display: block;
	width: 100%;
	height: 40px;
	line-height: 30px;
	font-size: 1.125rem;
	overflow: hidden;
	margin: 10px 0px;
	-o-text-overflow: ellipsis;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.article-direction a>span {
	display: inline-block;
	padding: 10px 25px;
	height: 40px;
	border-width: 1px;
	border-color: #000;
	border-style: solid;
	line-height: 1em;
	margin-right: 20px;
	font-size: 1.125rem;
}

@media screen and (min-width: 1025px) {

	.article-direction a:hover,
	.article-direction a:focus {
		text-decoration: underline;
	}

	.article-direction a:hover>span,
	.article-direction a:focus>span {
		border-color: #db3b00;
		background-color: #db3b00;
		color: #fff;
	}
}

@media screen and (max-width: 480px) {
	.article-direction a>span {
		padding: 7px 20px;
		height: auto;
		margin-right: 10px;
		font-size: 1rem;
	}
}

/* 分享 */
.share-zone {
	background-color: #fff;
	padding: 30px 0px 100px;
}

.no-js .share-zone {
	display: none;
}

/* 相簿 */
ul.album {
	list-style: none;
	padding-left: 0px;
	margin-bottom: 0px;
}

/* 相簿無障礙說明 */
.keypress-instructions {
	font-size: 0rem;
	line-height: 1em;
}

.keypress-instructions .instructionsmenu {
	background-color: #f1f1f1;
	color: #020202;
	padding: 3px 15px;
	margin-bottom: 10px;
	display: inline-block;
	font-size: 1.125rem;
	line-height: 30px;
}

.keypress-instructions #ulAlbum {
	background-color: rgb(241, 241, 241);
	border-radius: 10px;
	display: block;
	width: 100%;
	max-width: 400px;
	padding: 5px 20px 5px 40px;
	margin-bottom: 10px;
	font-size: 1.125rem;
	line-height: 30px;
}

.no-js .keypress-instructions #ulAlbum {
	display: block !important;
}

@media screen and (min-width: 1025px) {
	.keypress-instructions .instructionsmenu:hover,
	.keypress-instructions .instructionsmenu:focus {
		background-color: #db3b00;
		color: #fff;
	}
}

@media screen and (max-width: 1000px) {
	.keypress-instructions {
		display: none;
	}
}

/* 相簿window */
.album_window {
	margin-bottom: 20px;
}

.album_window .album {
	overflow: hidden;
}

.album_window .album>li {
	width: 25%;
	float: left;
	height: 0;
}

.album_window .album>li:first-child {
	width: 100%;
}

.album_window .album>li:nth-child(-n + 5) {
	visibility: visible;
	height: auto;
}

.no-js .album_window .album>li {
	height: auto;
}

.album_window .album-link {
	display: block;
	width: 100%;
	height: 0px;
	padding-bottom: 66%;
	position: relative;
	border-width: 3px;
	border-color: #fff;
	border-style: solid;
}

.album_window .album-link>img {
	display: block;
	width: 100%;
	height: 100%;
	position: absolute;
	left: 0;
	top: 0;
	-o-object-fit: cover;
	object-fit: cover;
}

.no-js .content > .wrap .album_window a.album-link {
	border-bottom-width: 3px;
	border-bottom-color: #FFF;
}

.no-js .album_window .album-link noscript img {
	display: block;
	width: 100%;
	height: 100%;
	position: absolute;
	left: 0;
	top: 0;
	-o-object-fit: cover;
	object-fit: cover;
}

@media screen and (min-width: 1025px) {
	.content > .wrap .album_window a.album-link:focus{
		border-color: #db3b00;
		border-bottom-color: #db3b00;
		-webkit-box-shadow: none;
		        box-shadow: none;
	}
}

@media screen and (max-width: 480px) {
	.album_window .album-link {
		border-width: 1px;
	}
}

/* 一般Banner */
.banner {
	position: relative;
	width: 100%;
}

.banner .carousel {
	list-style: none;
	padding-left: 0px;
	margin-bottom: 0px;
}

.banner figure {
	width: 100%;
	height: 450px;
	position: relative;
}

.banner figure>img {
	width: 100%;
	height: 100%;
	display: block;
	position: absolute;
	left: 0px;
	top: 0px;
	-o-object-fit: cover;
	object-fit: cover;
}

.no-js .banner figure noscript img {
	width: 100%;
	height: 100%;
	display: block;
	position: absolute;
	left: 0px;
	top: 0px;
	-o-object-fit: cover;
	object-fit: cover;
}

.banner .carousel .slick-dots {
	position: absolute;
	bottom: 0;
	left: 0;
}

.banner .carousel .slick-dots button {
	width: 15px;
	height: 15px;
	border-radius: 100%;
	border-width: 2px;
	border-color: #fff;
	border-style: solid;
	background-color: transparent;
}

.banner .carousel .slick-dots>li.slick-active button {
	border-color: #db3b00;
}

@media screen and (max-width: 1024px) {
	.banner figure {
		height: 300px;
	}
}

@media screen and (max-width: 480px) {
	.banner figure {
		height: 200px;
	}
}

/* 相簿Banner */
.album_banner {
	position: relative;
	width: 100%;
}

.album_banner .album {
	position: relative;
}

.album_banner .album-link {
	width: 100%;
	height: 0px;
	padding-bottom: 30%;
	overflow: hidden;
	position: relative;
	display: block;
}

.album_banner .album-link>img {
	display: block;
	width: 100%;
	height: 100%;
	position: absolute;
	left: 0;
	top: 0;
}

.no-js .album_banner .album-link noscript img {
	display: block;
	width: 100%;
	height: 100%;
	position: absolute;
	left: 0;
	top: 0;
}

@media screen and (min-width: 1025px) {
	.album_banner .album-link:focus {
		-webkit-box-shadow: none;
		box-shadow: none;
		border: 0.2rem #e06827 solid;
	}
}

.album_banner .carousel .slick-dots {
	position: absolute;
	bottom: 0;
	left: 0;
}

.album_banner .carousel .slick-dots button {
	width: 15px;
	height: 15px;
	border-radius: 100%;
	border-width: 2px;
	border-color: #fff;
	border-style: solid;
	background-color: transparent;
}

.album_banner .carousel .slick-dots>li.slick-active button {
	border-color: #db3b00;
}

@media screen and (max-width: 1024px) {
	.album_banner .album {
		display: none;
	}
}

/* 相簿元件 */
.album-model {
	margin: 20px 0px;
}

.album-model .icon-album {
	height: 45px;
	line-height: 45px;
}

.album-model .icon-album::before {
	content: '';
	width: 45px;
	height: 45px;
	display: inline-block;
	vertical-align: top;
	background-image: url('../../images/icon/album.svg');
	background-repeat: no-repeat;
	background-size: contain;
	background-position: center;
}

.album-model .album {
	font-size: 0rem;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: horizontal;
	-webkit-box-direction: normal;
	-ms-flex-flow: row wrap;
	flex-flow: row wrap;
}

.album-model .album>li {
	width: 33.33%;
	padding: 10px;
}

.album-model .album-link {
	display: block;
	border-width: 1px;
	border-color: rgba(200, 200, 200, 0.5);
	border-style: solid;
}

.album-model .album-link figure {
	width: 100%;
}

.album-model .album-link figure .graphic {
	width: 100%;
	height: 0px;
	padding-bottom: 67%;
	position: relative;
}

.album-model .album-link figure .graphic > img,
.no-js .album-model .album-link figure .graphic noscript img {
	width: 100%;
	height: 100%;
	position: absolute;
	left: 0px;
	top: 0px;
	-o-object-fit: cover;
	object-fit: cover;
}

.album-model .album-link figure figcaption {
	font-size: 1.125rem;
	padding: 10px;
}

@media screen and (max-width: 1024px) {
	.album-model .album-link figure figcaption {
		font-size: 1rem;
	}
}

@media screen and (max-width: 767px) {
	.album-model .album>li {
		width: 50%;
		padding: 5px;
	}
}

@media screen and (max-width: 480px) {
	.album-model .album-link figure figcaption {
		font-size: 0.9rem;
		line-height: 25px;
	}
}

@media screen and (max-width: 400px) {
	.album-model .album>li {
		width: 100%;
		padding: 0px;
		margin-bottom: 20px;
	}
}

/* 天氣 */
.weather {
	width: 250px;
	position: absolute;
	right: 10%;
	background-color: rgba(0, 0, 0, 0.7);
	text-align: center;
	padding: 20px;
	top: 50%;
	-webkit-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	transform: translateY(-50%);
}

.no-js .weather {
	position: static;
	-webkit-transform: translateY(0%);
	-ms-transform: translateY(0%);
	transform: translateY(0%);
}

.weather h4,
.weather .h4 {
	color: #fff;
	font-weight: bold;
}

.weather .weather-title {
	display: none;
}

.weather .weather-img>img {
	display: block;
	margin: auto;
}

.weather .weather-temp {
	display: inline-block;
	vertical-align: middle;
	font-size: 1.3rem;
	line-height: 1.3em;
	margin: 10px 0px;
	color: #fff;
}

.weather .link-arrow-btn {
	display: inline-block;
	vertical-align: middle;
	text-indent: -9999px;
	color: #fff;
}

.weather .weather-rainfall {
	padding: 15px 0px;
	border-top: 1px #fff solid;
}

.weather .rainfall>span {
	width: 50px;
	height: 50px;
	display: inline-block;
	vertical-align: middle;
	background-color: #0f76bf;
	border-radius: 100%;
	line-height: 50px;
	color: #fff;
	text-align: center;
}

.weather .rainfall::before {
	content: '';
	display: inline-block;
	vertical-align: middle;
	width: 50px;
	height: 50px;
	background-image: url('../../images/icon/umbrella_w.svg');
	background-repeat: no-repeat;
	background-position: center;
	background-size: contain;
}

@media screen and (max-width: 1024px) {
	.weather {
		position: static;
		-webkit-transform: translateY(0%);
		-ms-transform: translateY(0%);
		transform: translateY(0%);
		width: 100%;
		background-color: #242424;
		border-radius: 0px;
		padding: 10px 0px;
		text-align: right;
	}

	.weather .weather__blk {
		display: inline-block;
		vertical-align: middle;
		border-top: none;
		padding: 0px;
		margin: 0px;
		height: 45px;
		line-height: 45px;
	}

	.weather h4,
	.weather .h4 {
		display: none;
	}

	.weather .weather-rainfall h4,
	.weather .weather-rainfall .h4 {
		display: inline-block;
		margin-bottom: 0px;
		line-height: 45px;
	}

	.weather .weather-title {
		display: inline-block;
		color: #fff;
		margin-bottom: 0px;
		line-height: 45px;
	}

	.weather .weather-img>img {
		height: 100%;
	}

	.weather .rainfall {
		display: inline-block;
		vertical-align: top;
	}

	.weather .rainfall::before {
		width: 45px;
		height: 45px;
		vertical-align: top;
	}

	.weather .rainfall>span {
		width: 45px;
		height: 45px;
		line-height: 45px;
		vertical-align: top;
	}

	.weather .link-arrow-btn {
		display: none;
	}
}

@media screen and (max-width: 767px) {
	.weather .weather__blk {
		height: 40px;
		line-height: 40px;
	}

	.weather .weather-rainfall h4,
	.weather .weather-rainfall .h4 {
		display: none;
	}

	.weather .weather-title {
		line-height: 40px;
	}

	.weather .rainfall::before {
		width: 40px;
		height: 40px;
	}

	.weather .rainfall>span {
		width: 40px;
		height: 40px;
		line-height: 40px;
		font-size: 0.8rem;
	}
}

@media screen and (max-width: 480px) {
	.weather .weather__blk {
		font-size: 1rem;
	}
}

/* 地圖 */
.mapside {
	overflow: hidden;
	margin-bottom: 20px;
}

.mapside .left-side {
	width: calc(100% - 650px);
}

.mapside .right-side {
	width: 650px;
}

.mapside h2,
.mapside .h2 {
	text-align: left;
}

.mapside .twmap {
	width: 100%;
	height: 0;
	padding-bottom: 115%;
	background: url('../../images/twmap.png') no-repeat center/contain;
	position: relative;
	padding-left: 0px;
	margin-top: 82px;
	margin-bottom: 0px;
	list-style: none;
}

.mapside .twmap>li {
	position: absolute;
}

.mapside .twmap>li.area-north {
	left: 45%;
	top: 0%;
}

.mapside .twmap>li.area-central {
	left: 27%;
	top: 20%;
}

.mapside .twmap>li.area-south {
	left: 10%;
	top: 60%;
}

.mapside .twmap>li.area-easten {
	left: 67%;
	top: 65%;
}

.mapside .twmap>li.area-island {
	left: 10%;
	top: 0%;
}

.mapside .twmap a {
	display: block;
	position: relative;
	padding: 0px 10px;
	border-style: solid;
	border-width: 1px;
	border-color: #000;
	background-color: #fff;
	line-height: 1.8em;
	font-size: 1rem;
	color: #020202;
}

.mapside .twmap a::before {
	content: '';
	width: 1px;
	height: 50px;
	display: block;
	position: absolute;
	background-color: #242424;
	left: calc((100% - 1px)/2);
	top: 100%;
}

.mapside .twmap>li.Current a {
	border-color: #db3b00;
	background-color: #db3b00;
	color: #fff;
}

@media screen and (min-width: 1025px) {

	.mapside .twmap a:hover,
	.mapside .twmap a:focus {
		border-color: #db3b00;
		background-color: #db3b00;
		color: #fff;
	}
}

@media screen and (max-width: 1200px) {

	.mapside .left-side,
	.mapside .right-side {
		width: 50%;
	}
}

@media screen and (max-width: 1000px) {

	.mapside .left-side,
	.mapside .right-side {
		width: 100%;
		float: none;
	}

	.mapside .twmap {
		margin-top: 50px;
	}
}

.cntList.list0001016 {
	display: none;
}

/* 資訊檢視 */
.infoside {
	overflow: hidden;
	margin-bottom: 15px;
}

.infoside .left-side {
	width: calc(100% - 630px);
}

.infoside .right-side {
	width: 600px;
	margin-top: 44px;
}

@media screen and (max-width: 1000px) {
	.infoside .right-side {
		margin-top: 0px;
	}
}

.infoside .info-table,
.tourlineSpotsRight .info-table {
	padding-bottom: 20px;
	margin-bottom: 20px;
	border-bottom: 1px #c8c8c8 solid;
}

.infoside .info-table:last-child,
.tourlineSpotsRight .info-table:last-child {
	padding-bottom: 0px;
	border-bottom: none;
}

.infoside .info-table dt,
.infoside .info-table dd,
.tourlineSpotsRight .info-table dt,
.tourlineSpotsRight .info-table dd {
	display: inline-block;
	vertical-align: top;
	padding: 5px 0px;
}

.infoside .info-table dt,
.tourlineSpotsRight .info-table dt {
	width: 120px;
}

.infoside .info-table dd,
.tourlineSpotsRight .info-table dd {
	width: calc(100% - 130px);
}

.infoside .hashtag a {
	padding: 0px 20px;
}

@media screen and (max-width: 1200px) {
	.infoside .left-side {
		width: 50%;
	}

	.infoside .right-side {
		width: calc(50% - 20px);
	}
}

@media screen and (max-width: 1000px) {

	.infoside .left-side,
	.infoside .right-side {
		width: 100%;
		float: none;
	}

	.infoside .left-side {
		margin-bottom: 30px;
	}
}

@media screen and (max-width: 767px) {

	.infoside .info-table dt,
	.infoside .info-table dd,
	.tourlineSpotsRight .info-table dt,
	.tourlineSpotsRight .info-table dd {
		width: 100%;
		display: block;
	}

	.infoside .info-table dt,
	.tourlineSpotsRight .info-table dt {
		font-weight: bold;
	}
}

@media screen and (max-width: 480px) {
	.infoside .left-side {
		margin-bottom: 20px;
	}
}

/* 圓形按鈕 */
.circularbtn-list>li {
	width: 33.33%;
}

.circularbtn {
	display: block;
	margin: 20px 0px;
}

.circularbtn .circularbtn-img {
	width: 80%;
	height: 0px;
	padding-bottom: 80%;
	display: block;
	margin: 0px auto 15px;
	border-radius: 100%;
	position: relative;
}

.circularbtn .circularbtn-img.imgLiquid_ready {
	overflow: unset;
}

.circularbtn .circularbtn-img>img {
	width: 100%;
	height: 100%;
	position: absolute;
	left: 0;
	top: 0;
	display: block;
	-o-object-fit: cover;
	object-fit: cover;
	border-radius: 100%;
	border: 3px #d8d8d8 solid;
}

.no-js .circularbtn .circularbtn-img noscript img {
	width: 100%;
	height: 100%;
	position: absolute;
	left: 0;
	top: 0;
	display: block;
	-o-object-fit: cover;
	object-fit: cover;
	border-radius: 100%;
	border: 3px #d8d8d8 solid;
}

.circularbtn .circularbtn-img::before {
	content: '';
	width: 100%;
	height: 100%;
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	border-width: 5px;
	border-style: solid;
	border-color: transparent;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	border-radius: 100%;
	-webkit-transition: all 0.3s;
	-o-transition: all 0.3s;
	transition: all 0.3s;
	-webkit-transform: scale(1);
	-ms-transform: scale(1);
	transform: scale(1);
}

.circularbtn .circularbtn-title {
	display: block;
	text-align: center;
	font-weight: bold;
	font-size: 1.15rem;
	color: #000;
}

@media screen and (min-width: 1025px) {

	.circularbtn:hover .circularbtn-img::before,
	.circularbtn:focus .circularbtn-img::before {
		border-color: #db3b00;
		-webkit-transform: scale(1.1);
		-ms-transform: scale(1.1);
		transform: scale(1.1);
	}

	.circularbtn:hover .circularbtn-title,
	.circularbtn:focus .circularbtn-title {
		color: #db3b00;
	}

	.circularbtn:focus{
		-webkit-box-shadow: inset 0 0 0 0.2rem rgba(255, 114, 71, 0.5);
		        box-shadow: inset 0 0 0 0.2rem rgba(255, 114, 71, 0.5);
	}
}

@media screen and (max-width: 1024px) {
	.circularbtn .circularbtn-img {
		width: 90%;
		height: 0px;
		padding-bottom: 90%;
	}
}

@media screen and (max-width: 480px) {
	.circularbtn-list>li {
		width: 50%;
	}

	.circularbtn {
		margin: 10px 0px;
	}

	.circularbtn .circularbtn-title {
		font-size: 1rem;
	}
}

/* 周邊服務 */
ul.attractions {
	padding-left: 0px;
	margin-bottom: 20px;
	list-style: none;
}

.attractions {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-pack: justify;
	-ms-flex-pack: justify;
	justify-content: space-between;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
}

.attractions>li {
	width: calc((100% - 30px)/4);
}

.attractions .attractions-btn {
	display: block;
	border-width: 1px;
	border-color: rgba(200, 200, 200, 0.5);
	border-style: solid;
	text-align: center;
	padding: 10px;
}

.attractions .attractions-btn>span {
	font-size: 1.05rem;
	line-height: 40px;
	display: block;
}

.attractions .attractions-btn>span::before {
	content: '';
	display: inline-block;
	vertical-align: bottom;
	width: 40px;
	height: 40px;
	margin-right: 10px;
	background-position: center;
	background-size: contain;
	background-repeat: no-repeat;
}

.attractions .attractions-btn.icon-viewpoint>span::before {
	background-image: url('../../images/icon/serviceicon_viewpoint.svg');
}

.attractions .attractions-btn.icon-stay>span::before {
	background-image: url('../../images/icon/serviceicon_stay.svg');
}

.attractions .attractions-btn.icon-food>span::before {
	background-image: url('../../images/icon/serviceicon_food.svg');
}

.attractions .attractions-btn.icon-activity>span::before {
	background-image: url('../../images/icon/serviceicon_activity.svg');
}

.attractions .attractions-continue-btn {
	display: block;
	float: right;
	font-size: 1.2rem;
	font-weight: bold;
	line-height: 30px;
	margin: 15px 0px 0px;
}

/* .attractions .attractions-continue-btn::before{
    content: '';
    width: 30px;
    height: 30px;
    display: inline-block;
    vertical-align: bottom;
    margin-right: 0px;
    background: url('../../images/icon/arrow-right.svg') no-repeat center/50%;
} */
@media screen and (min-width: 1025px) {

	.attractions .attractions-btn:hover>span,
	.attractions .attractions-btn:focus>span {
		color: #db3b00;
	}

	.attractions .attractions-btn.icon-viewpoint:hover>span::before,
	.attractions .attractions-btn.icon-viewpoint:focus>span::before {
		background-image: url('../../images/icon/serviceicon_viewpoint_active.svg');
	}

	.attractions .attractions-btn.icon-stay:hover>span::before,
	.attractions .attractions-btn.icon-stay:focus>span::before {
		background-image: url('../../images/icon/serviceicon_stay_active.svg');
	}

	.attractions .attractions-btn.icon-food:hover>span::before,
	.attractions .attractions-btn.icon-food:focus>span::before {
		background-image: url('../../images/icon/serviceicon_food_active.svg');
	}

	.attractions .attractions-btn.icon-activity:hover>span::before,
	.attractions .attractions-btn.icon-activity:focus>span::before {
		background-image: url('../../images/icon/serviceicon_activity_active.svg');
	}
}

@media screen and (max-width: 767px) {
	.attractions>li {
		width: 25%;
	}

	.attractions .attractions-btn {
		padding: 10px 5px;
	}

	.attractions .attractions-btn>span {
		font-size: 1rem;
		line-height: 30px;
	}

	.attractions .attractions-btn>span::before {
		width: 30px;
		height: 30px;
	}
}

@media screen and (max-width: 480px) {
	.attractions {
		-webkit-box-orient: horizontal;
		-webkit-box-direction: normal;
		-ms-flex-flow: row wrap;
		flex-flow: row wrap;
		border-width: 1px;
		border-color: rgba(200, 200, 200, 0.5);
		border-style: solid;
	}

	.attractions>li {
		width: 50%;
	}

	/* .attractions .attractions-continue-btn{
        font-size: 1rem;
        margin: 10px 0px 0px;
    } */
}

/* 行程 */
/* 這是新版本的，但沒有要用 */
.strokelist {
	position: relative;
	padding-left: 60px;
}

.strokelist::before {
	content: '';
	display: block;
	width: 2px;
	height: 100%;
	background-color: #c8c8c8;
	position: absolute;
	left: calc((50px - 2px)/2);
	top: 0px;
}

.stroke .stroke__title {
	line-height: 45px;
}

.stroke .stroke__title>span {
	display: block;
	width: 45px;
	height: 45px;
	border-radius: 100%;
	background-color: #db3b00;
	position: absolute;
	left: calc((50px - 45px)/2);
	text-align: center;
	color: #fff;
}

.stroke .stroke__item {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	overflow: hidden;
	margin-bottom: 20px;
	border: 1px #c8c8c8 solid;
}

.stroke .stroke__item::before {
	content: '';
	display: block;
	width: 50px;
	height: 2px;
	background-color: #c8c8c8;
	margin-top: 30px;
	position: absolute;
	left: calc((50px - 2px)/2);
}

.stroke .stroke__item>a {
	width: 50%;
	display: block;
}

.stroke figure {
	width: 100%;
	height: 0px;
	padding-bottom: 66.6%;
	position: relative;
	overflow: hidden;
}

.stroke figure>img {
	width: 100%;
	display: block;
	position: absolute;
	left: 0;
	top: 0;
}

.stroke .stroke__blk {
	width: 50%;
	padding: 20px;
	-webkit-transition: all 0.3s ease;
	-o-transition: all 0.3s ease;
	transition: all 0.3s ease;
}

@media screen and (min-width: 1025px) {
	/* .stroke .stroke__item:hover .stroke__blk,
    .stroke .stroke__item:focus .stroke__blk{
        background-color: #db3b00;
    }
    .stroke .stroke__item:hover .stroke__blk h5,
    .stroke .stroke__item:focus .stroke__blk h5,
    .stroke .stroke__item:hover .stroke__blk p,
    .stroke .stroke__item:focus .stroke__blk p{
        color: #fff;
    } */
}

@media screen and (max-width: 1024px) {
	.stroke .stroke__item {
		-webkit-box-orient: horizontal;
		-webkit-box-direction: normal;
		-ms-flex-flow: row wrap;
		flex-flow: row wrap;
	}

	.stroke .stroke__item>a {
		width: 100%;
	}

	.stroke .stroke__blk {
		width: 100%;
	}
}

@media screen and (max-width: 767px) {
	.strokelist {
		padding-left: 50px;
	}

	.stroke .stroke__title {
		line-height: 40px;
	}

	.stroke .stroke__title>span {
		width: 40px;
		height: 40px;
		left: calc((50px - 40px)/2);
	}
}

@media screen and (max-width: 480px) {
	.strokelist {
		padding-left: 40px;
	}

	.strokelist::before {
		width: 1px;
		left: calc((40px - 1px)/2);
	}

	.stroke .stroke__title {
		padding-left: 10px;
	}

	.stroke .stroke__title>span {
		left: 0;
	}

	.stroke .stroke__item::before {
		width: 20px;
		height: 1px;
		left: calc((40px - 1px)/2);
	}

	.stroke .stroke__blk {
		padding: 10px;
	}
}

/* 這是新版本的，但沒有要用 結束*/
/* 這是沿用舊網站架構的 */
.tourArticle {
	padding-left: 60px;
	margin-bottom: 50px;
	position: relative;
}

.tourArticle::before {
	content: '';
	display: block;
	width: 1px;
	height: calc(100% + 30px);
	background-color: #b9b9b9;
	position: absolute;
	left: calc((50px - 2px)/2);
	top: 0px;
}

.tourArticle::after {
	content: '';
	display: block;
	width: 20px;
	height: 20px;
	border-radius: 100%;
	background-color: #db3b00;
	position: absolute;
	left: 14.5px;
	bottom: -30px;
}

.tourArticle h5,
.tourArticle .h5 {
	margin-bottom: 0px;
}

.tourline1,
.tourline2,
.tourline3,
.tourline4,
.tourline5,
.tourline6,
.tourline7 {
	color: #242424;
	font-size: 1.5rem;
	font-weight: bold;
	height: 40px;
	line-height: 40px;
	margin-bottom: 20px;
}

.tourline1::before,
.tourline2::before,
.tourline3::before,
.tourline4::before,
.tourline5::before,
.tourline6::before,
.tourline7::before {
	width: 40px;
	height: 40px;
	line-height: 40px;
	display: inline-block;
	border-radius: 100%;
	background-color: #db3b00;
	color: #fff;
	position: absolute;
	text-align: center;
	left: 5px;
}

.tourline1::before {
	content: '1';
}

.tourline2::before {
	content: '2';
}

.tourline3::before {
	content: '3';
}

.tourline4::before {
	content: '4';
}

.tourline5::before {
	content: '5';
}

.tourline6::before {
	content: '6';
}

.tourline7::before {
	content: '7';
}

.accessTourArticle .tourline {
	counter-reset: listStyle;
}

.tourlineBox,
.tourlineBox2017 {
	margin-bottom: 20px;
	position: relative;
}

.accessTourArticle .tourlineBox,
.accessTourArticle .tourlineBox2017 {
	counter-increment: listStyle;
}

.tourlineBox::before,
.tourlineBox2017::before {
	content: '';
	display: block;
	width: 35px;
	height: 1px;
	background-color: #b9b9b9;
	position: absolute;
	left: -35px;
	top: calc((100% - 2px)/2);
}

.accessTourArticle .tourlineBox::after,
.accessTourArticle .tourlineBox2017::after {
	content: counter(listStyle, upper-latin);
	width: 40px;
	height: 40px;
	line-height: 40px;
	display: block;
	border-radius: 100%;
	position: absolute;
	top: calc((100% - 40px)/2);
	left: -55px;
	background-color: #5cc6b1;
	text-align: center;
	color: #fff;
}

.tourlineSpots {
	overflow: hidden;
	border: 1px #c8c8c8 solid;
	padding: 20px;
}

.tourlineSpots img {
	width: 100%;
	height: 100%;
	position: absolute;
	display: block;
	left: 0;
	top: 0;
	-o-object-fit: cover;
	object-fit: cover;
}

.tourlineSpotsLeft {
	width: 40%;
	height: 0px;
	padding-bottom: 27%;
	overflow: hidden;
	position: relative;
	float: left;
}

.tourlineSpotsRight {
	width: 60%;
	float: left;
	padding-left: 20px;
}

.tourlineSpotsRight h5,
.tourlineSpotsRight .h5 {
	margin-bottom: 20px;
}

html[lang="zh-Hant-TW"] .tourlineSpotsRight h5,
html[lang="zh-Hant-TW"] .tourlineSpotsRight .h5,
html[lang="zh-Hant"] .tourlineSpotsRight h5,
html[lang="zh-Hant"] .tourlineSpotsRight .h5,
html[lang="zh-TW"] .tourlineSpotsRight h5,
html[lang="zh-TW"] .tourlineSpotsRight .h5 {
	font-family: 'Noto Sans TC', sans-serif;
}

.tourlineSpotsRight > a {
	display: block;
	border-bottom: none !important;
}

@media screen and (min-width: 1025px) {
	.tourlineSpotsRight > a:hover > h5,
	.tourlineSpotsRight > a:focus > h5,
	.tourlineSpotsRight > a:hover > .h5,
	.tourlineSpotsRight > a:focus > .h5 {
		color: #db3b00;
	}
}

.tourlineSpotsRight p {
	margin-bottom: 20px;
}

.tourlineSpotsContent {
	clear: both;
	width: 100%;
	padding-top: 20px;
}

.tourlineSpotsContent h5,
.tourlineSpotsContent .h5 {
	margin-bottom: 20px;
}

.tourlineSpots img.inner-icon {
	position: static;
}

.tourlineTime {
	display: block;
	color: #5cc6b1;
	color: #118570;
	font-weight: bold;
}

@media screen and (min-width: 1025px) {

	.tourlineBox>a:hover>.tourlineSpots,
	.tourlineBox>a:focus>.tourlineSpots,
	.tourlineBox2017>a:hover>.tourlineSpots,
	.tourlineBox2017>a:focus>.tourlineSpots {
		background-color: #db3b00;
	}

	.tourlineBox>a:hover .tourlineSpotsRight,
	.tourlineBox>a:focus .tourlineSpotsRight,
	.tourlineBox>a:hover h5,
	.tourlineBox>a:hover .h5,
	.tourlineBox>a:focus h5,
	.tourlineBox>a:focus .h5,
	.tourlineBox>a:hover p,
	.tourlineBox>a:focus p,
	.tourlineBox2017>a:hover .tourlineSpotsRight,
	.tourlineBox2017>a:focus .tourlineSpotsRight,
	.tourlineBox2017>a:hover h5,
	.tourlineBox2017>a:hover .h5,
	.tourlineBox2017>a:focus h5,
	.tourlineBox2017>a:focus .h5,
	.tourlineBox2017>a:hover p,
	.tourlineBox2017>a:focus p {
		color: #fff;
	}
}

@media screen and (max-width: 1024px) {
	.tourlineSpotsLeft {
		width: 100%;
		height: 0px;
		padding-bottom: 67%;
		float: none;
		margin-bottom: 20px;
	}

	.tourlineSpotsRight {
		width: 100%;
		float: none;
		padding-left: 0px;
	}
}

@media screen and (max-width: 767px) {
	.tourArticle {
		padding-left: 0px;
	}

	.tourArticle::before,
	.tourArticle::after {
		display: none;
	}

	.tourline1::before,
	.tourline2::before,
	.tourline3::before,
	.tourline4::before,
	.tourline5::before,
	.tourline6::before,
	.tourline7::before {
		position: static;
		margin-right: 10px;
	}

	.tourlineBox::before,
	.tourlineBox2017::before,
	.accessTourArticle .tourlineBox::after,
	.accessTourArticle .tourlineBox2017::after {
		display: none;
	}

	.tourlineSpots {
		padding: 15px;
	}
}

@media screen and (max-width: 480px) {
	.tourlineSpots {
		padding: 10px;
	}

	.tourlineSpotsRight h5,
	.tourlineSpotsRight .h5 {
		margin-bottom: 10px;
	}

	.tourlineSpotsLeft {
		margin-bottom: 10px;
	}
}

/* 這是沿用舊網站架構的 結束*/
/* 無障礙行程的GoodleMap區塊 */
.googleMapBox {
	margin: 50px 0px;
}

.googleMapBox ul.googleMapBox-list {
	list-style: none;
	padding-left: 0px;
	margin-bottom: 0px;
	overflow: hidden;
}

.googleMapBox .googleMapBox-list>li {
	width: 50%;
	float: left;
}

.googleMapBox .googleMapBox-list label {
	display: block;
	border: 0.5px #c8c8c8 solid;
}

.googleMapBox .googleMapBox-list label input[type='checkbox'] {
	border: none;
	width: 0;
	height: 0;
	opacity: 0;
	position: absolute;
}

.googleMapBox .googleMapBox-list label .indicator {
	position: relative;
	text-align: center;
	padding: 15px;
	cursor: pointer;
}

.googleMapBox .googleMapBox-list label .indicator>span {
	display: block;
	height: 40px;
	line-height: 40px;
	color: inherit;
}

.googleMapBox .googleMapBox-list label .indicator>span::before {
	content: '';
	display: inline-block;
	vertical-align: top;
	width: 40px;
	height: 40px;
	margin-right: 10px;
	background-repeat: no-repeat;
	background-size: contain;
	background-position: center;
}

.googleMapBox .googleMapBox-list label input[type='checkbox']:checked+.indicator {
	background-color: #db3b00;
	color: #fff;
}

.googleMapBox .googleMapBox-list label.icon-toilet .indicator>span::before {
	background-image: url('../../images/icon/icon_accessibility_wc.svg');
}

.googleMapBox .googleMapBox-list label.icon-parking .indicator>span::before {
	background-image: url('../../images/icon/icon_accessibility_park.svg');
}

.googleMapBox .googleMapBox-list label.icon-toilet input[type='checkbox']:checked+.indicator>span::before {
	background-image: url('../../images/icon/icon_accessibility_wc_w.svg')
}

.googleMapBox .googleMapBox-list label.icon-parking input[type='checkbox']:checked+.indicator>span::before {
	background-image: url('../../images/icon/icon_accessibility_park_w.svg');
}

.googleMapBox #mapCanvas {
	width: 100%;
	height: 500px;
	position: relative;
}

.googleMapBox #mapCanvas>iframe {
	width: 100%;
	height: 100%;
	position: absolute;
	left: 0px;
	top: 0px;
}

@media screen and (max-width: 480px) {
	.googleMapBox .googleMapBox-list label .indicator {
		padding: 15px 5px;
	}

	.googleMapBox .googleMapBox-list label .indicator>span {
		height: 30px;
		line-height: 30px;
	}

	.googleMapBox .googleMapBox-list label .indicator>span::before {
		width: 30px;
		height: 30px;
	}
}

@media screen and (max-width: 420px) {
	.googleMapBox .googleMapBox-list>li {
		width: 100%;
		float: none;
	}

	.googleMapBox .googleMapBox-list label .indicator {
		padding: 10px 5px;
	}
}

/* 頁籤 */
ul.navtabs {
	padding-left: 0px;
	margin-bottom: 0px;
	list-style: none;
}

.navtabs {
	width: 100%;
	position: relative;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: start;
	-ms-flex-align: start;
	align-items: flex-start;
}

.navtabs .navtabs-item {
	display: inline-block;
	vertical-align: top;
	-webkit-box-flex: 1;
	-ms-flex: auto;
	flex: auto;
}

.navtabs .navtabs-link {
	display: block;
}

.navtabs .navtabs-content {
	position: absolute;
	width: 100%;
	left: 0;
	display: none;
}

.navtabs.navtabs-style-folder {
	margin: 20px 0px;
}

.navtabs-style-folder .navtabs-link {
	padding: 10px;
	text-align: center;
	border-width: 1px;
	border-style: solid;
	border-top-color: transparent;
	border-right-color: transparent;
	border-bottom-color: rgba(200, 200, 200, 0.5);
	border-left-color: transparent;
}

.navtabs-style-folder .navtabs-item.current .navtabs-link {
	border-top-color: rgba(200, 200, 200, 0.5);
	border-right-color: rgba(200, 200, 200, 0.5);
	border-bottom-color: transparent;
	border-left-color: rgba(200, 200, 200, 0.5);
}

.navtabs-style-folder .navtabs-item:first-child .navtabs-link {
	border-left-color: transparent;
}

.navtabs-style-folder .navtabs-item:last-child .navtabs-link {
	border-right-color: transparent;
}

.navtabs-style-folder .navtabs-link>span {
	font-size: 1.3rem;
	line-height: 40px;
	display: block;
	font-weight: bolder;
}

.navtabs-style-folder .navtabs-item.current .navtabs-link>span {
	color: #db3b00;
}

.navtabs-style-folder .navtabs-link>span::before {
	content: '';
	display: inline-block;
	vertical-align: bottom;
	width: 40px;
	height: 40px;
	margin-right: 10px;
	background-position: center;
	background-size: contain;
	background-repeat: no-repeat;
}

.navtabs-style-folder .icon-viewpoint>span::before {
	background-image: url('../../images/icon/serviceicon_viewpoint.svg');
}

.navtabs-style-folder .icon-stay>span::before {
	background-image: url('../../images/icon/serviceicon_stay.svg');
}

.navtabs-style-folder .icon-food>span::before {
	background-image: url('../../images/icon/serviceicon_food.svg');
}

.navtabs-style-folder .icon-activity>span::before {
	background-image: url('../../images/icon/serviceicon_activity.svg');
}

.navtabs-style-folder .navtabs-item.current .icon-viewpoint>span::before {
	background-image: url('../../images/icon/serviceicon_viewpoint_active.svg');
}

.navtabs-style-folder .navtabs-item.current .icon-stay>span::before {
	background-image: url('../../images/icon/serviceicon_stay_active.svg');
}

.navtabs-style-folder .navtabs-item.current .icon-food>span::before {
	background-image: url('../../images/icon/serviceicon_food_active.svg');
}

.navtabs-style-folder .navtabs-item.current .icon-activity>span::before {
	background-image: url('../../images/icon/serviceicon_activity_active.svg');
}

.navtabs-style-folder .navtabs-content {
	padding: 30px 0px;
}

.no-js .navtabs {
	display: block;
}

.no-js .navtabs .navtabs-item {
	display: block;
}

.no-js .navtabs .navtabs-content {
	display: block;
	position: static;
}

@media screen and (max-width: 1024px) {
	.navtabs-style-folder .navtabs-link>span {
		line-height: 35px;
	}

	.navtabs-style-folder .navtabs-link>span::before {
		display: block;
		margin-right: 0px;
		margin: auto;
	}
}

@media screen and (max-width: 480px) {
	.navtabs-style-folder .navtabs-link {
		padding: 10px 5px 5px;
	}

	.navtabs-style-folder .navtabs-link>span {
		font-size: 1rem;
		line-height: 30px;
	}

	.navtabs-style-folder .navtabs-link>span::before {
		width: 30px;
		height: 30px;
	}
}

/* 最新消息 */
.news-title {
	border-bottom: 1px #c8c8c8 solid;
	margin-bottom: 20px;
	line-height: 1em;
}

.news-title h2,
.news-title .h2 {
	display: block;
	margin: 20px 0px;
	text-align: center;
}

.news-page-title h2,
.news-page-title .h2 {
	text-align: left;
}

.news-title .sort-item {
	float: right;
	height: 45px;
	line-height: 45px;
}

.news-title .sort-item span {
	padding: 0px 15px;
}

.news-title .news-row {
	font-size: 0rem;
	margin-bottom: 20px;
}

.news-title .news-row span {
	margin-right: 10px;
	font-size: 1.125rem;
	line-height: 1.8em;
	display: inline-block;
	vertical-align: top;
}

.news-title .news-row span>b {
	color: #db3b00;
}

@media screen and (max-width: 1560px) {
	.news-title .sort-item {
		padding-right: 50px;
	}
}

@media screen and (max-width: 1024px) {
	.news-title h2,
	.news-title .h2 {
		display: block;
	}

	.news-title .sort-item {
		height: auto;
		line-height: inherit;
		float: none;
		padding-left: 0px;
		padding-right: 0px;
		margin-bottom: 10px;
	}

	.news-title .sort-personal {
		float: none;
	}
}

.news-writer {
	overflow: hidden;
	padding-bottom: 20px;
	border-bottom: 1px #c8c8c8 solid;
	margin-bottom: 20px;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: horizontal;
	-webkit-box-direction: normal;
	-ms-flex-flow: row wrap;
	flex-flow: row wrap;
}

.news-writer .news-writer-img {
	width: 140px;
	text-align: center;
}

.news-writer .news-writer-img>img {
	width: 90px;
	height: 90px;
	display: inline-block;
	vertical-align: top;
	border-radius: 100%;
	-o-object-fit: cover;
	object-fit: cover;
}

.news-writer .news-writer-info {
	width: calc(100% - 140px);
}

.news-writer .news-writer-info .row {
	display: block;
	line-height: 45px
}

.news-writer .news-writer-info span {
	display: inline-block;
	margin-right: 10px;
}

.news-writer .news-writer-info span>b {
	color: #db3b00;
}

@media screen and (max-width: 767px) {
	.news-writer {
		font-size: 1rem;
	}

	.news-writer .news-writer-img>img {
		width: 100px;
		height: 100px;
	}

	.news-writer .news-writer-info .row {
		line-height: 30px;
	}
}

@media screen and (max-width: 480px) {
	.news-writer {
		font-size: 0.9rem;
	}

	.news-writer .news-writer-img>img {
		width: 110px;
		height: 110px;
	}
}

@media screen and (max-width: 320px) {
	.news-writer .news-writer-img {
		width: 130px;
	}

	.news-writer .news-writer-info {
		width: calc(100% - 130px);
	}
}

.news-block-list.carousel {
	list-style: none;
	padding-left: 0px;
	margin-bottom: 20px;
}

.news-block-list .slick-slide {
	outline: none;
}

.news-block {
	padding: 0px 5px;
}

.news-block-wrap {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: horizontal;
	-webkit-box-direction: normal;
	-ms-flex-flow: row wrap;
	flex-flow: row wrap;
	overflow: hidden;
	width: 100%;
	height: 430px;
	border-width: 1px;
	border-color: rgba(200, 200, 200, 0.5);
	border-style: solid;
}

.news-block figure {
	width: 45%;
	height: 100%;
	position: relative;
}

.news-block figure>img {
	width: 100%;
	height: 100%;
	position: absolute;
	left: 0px;
	top: 0px;
	-o-object-fit: cover;
	object-fit: cover;
}

.news-block figure noscript img {
	width: 100%;
	height: 100%;
	position: absolute;
	left: 0px;
	top: 0px;
	-o-object-fit: cover;
	object-fit: cover;
}

.news-block .news-block-content {
	width: 55%;
	height: 100%;
	position: relative;
	padding: 20px;
	font-size: 0rem;
}

.news-block .news-block-title {
	font-size: 1.5rem;
	font-weight: bold;
	line-height: 30px;
	max-height: 60px;
	margin-bottom: 15px;
	overflow: hidden;
	-o-text-overflow: ellipsis;
	text-overflow: ellipsis;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
}

.news-block .hashtag {
	margin-bottom: 15px;
	/* height: 30px; */
	overflow: hidden;
}

.news-block .news-block-writer {
	font-size: 0rem;
	margin-bottom: 15px;
	height: 50px;
	overflow: hidden;
}

.news-block .news-block-writer .writer-name {
	display: inline-block;
	vertical-align: top;
	font-size: 1.125rem;
	line-height: 50px;
	padding-left: 10px;
	overflow: hidden;
	-o-text-overflow: ellipsis;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.news-block .news-block-writer .writer-img {
	width: 50px;
	height: 50px;
	position: relative;
	display: inline-block;
	vertical-align: top;
}

.news-block .news-block-writer .writer-img>img {
	width: 100%;
	height: 100%;
	position: absolute;
	left: 0px;
	top: 0px;
	-o-object-fit: cover;
	object-fit: cover;
	border-radius: 50%;
}

.news-block .news-block-info {
	font-size: 1.125rem;
	line-height: 30px;
	max-height: 90px;
	margin-bottom: 15px;
	overflow: hidden;
	-o-text-overflow: ellipsis;
	text-overflow: ellipsis;
	display: -webkit-box;
	-webkit-line-clamp: 3;
	-webkit-box-orient: vertical;
}

.news-block .morebtn {
	display: inline-block;
	margin-bottom: 0px;
}

@media screen and (max-width: 1024px) {
	.news-block-wrap {
		display: block;
		height: auto;
	}

	.news-block figure {
		width: 100%;
		height: 0;
		padding-bottom: 67%;
	}

	.news-block .news-block-content {
		width: 100%;
		height: auto;
	}
}

@media screen and (max-width: 480px) {
	.news-block .news-block-content {
		padding: 15px;
	}

	.news-block .news-block-title {
		font-size: 1.3rem;
		margin-bottom: 10px;
	}

	.news-block .hashtag {
		margin-bottom: 10px;
	}

	.news-block .morebtn {
		display: block;
		padding: 10px 20px;
		border-radius: 0px;
	}
}

@media screen and (max-width: 400px) {
	.news-block .news-block-content {
		padding: 10px;
	}
}

/* 附件下載 */
.download {
	margin: 20px 0px;
}

.download .icon-download {
	height: 45px;
	line-height: 45px;
}

.download .icon-download::before {
	content: '';
	width: 45px;
	height: 45px;
	display: inline-block;
	vertical-align: top;
	background-image: url('../../images/icon/download.svg');
	background-repeat: no-repeat;
	background-size: contain;
	background-position: center;
}

.download .download-table {
	font-size: 1.15rem;
}

.download .download-table a {
	display: inline-block;
	border-bottom: none;
}

.download .download-table a>img {
	width: 40px;
	height: 40px;
	display: inline-block;
	vertical-align: top;
}

.download .download-table thead>tr>th:first-child {
	width: 65%;
}

.download .download-table tbody>tr:nth-child(odd) {
	background-color: #f1f1f1;
}

.download .download-table tbody>tr:nth-child(even) {
	background-color: #e1e1e1;
}

.download .download-table tr>th:first-child,
.download .download-table tr>td:first-child,
.download .download-table tr>td:last-child {
	text-align: left;
}

.download .download-table th,
.download .download-table td {
	padding: 10px;
	vertical-align: middle;
	border: 1px #fff solid;
	text-align: center;
}

.download .download-table th {
	background-color: #db3b00;
	color: #fff;
}

@media screen and (max-width: 1024px) {
	.download .download-table {
		font-size: 1rem;
	}
}

/* 最後更新時間 */
.lastupdated {
	margin-bottom: 20px;
	padding-top: 5px;
	border-top: 1px #c8c8c8 solid;
	overflow: hidden;
	text-align: right;
	font-size: 1.125rem;
}

/* TAG */
.tagcollection {
	margin-bottom: 20px;
	width: 100%;
	text-align: center;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: start;
	-ms-flex-align: start;
	align-items: flex-start;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;
}

.tagcollection .tag-item {
	display: block;
	padding: 10px;
	margin: 0px 10px 20px;
	font-size: 1.2rem;
	font-weight: bold;
	min-width: 200px;
	background-color: #fff;
	border-width: 1px;
	border-style: solid;
	border-color: rgba(200, 200, 200, 1);
	color: #000;
	overflow: hidden;
	text-align: center;
}

.tagcollection .tag-item>span {
	font-weight: bold;
	color: #db3b00;
	float: right;
	margin-left: 10px;
}

.tagcollection .tag-item.current {
	border-color: #db3b00;
	background-color: #db3b00;
	color: #fff;
}

.tagcollection .tag-item.current>span {
	color: #fff;
}

@media screen and (min-width: 1025px) {

	.tagcollection .tag-item:hover,
	.tagcollection .tag-item:focus {
		border-color: #db3b00;
		background-color: #db3b00;
		color: #fff;
	}

	.tagcollection .tag-item:hover>span,
	.tagcollection .tag-item:focus>span {
		color: #fff;
	}
}

@media screen and (max-width: 767px) {
	.tagcollection .tag-item {
		width: 100%;
		margin: 0px 0px 10px;
		font-size: 1rem;
	}
}

/* 多媒體 */
.media-list>li {
	width: 33.33%;
	padding: 20px;
}

.media-item {
	border-width: 1px;
	border-color: rgba(200, 200, 200, 0.5);
	border-style: solid;
	position: relative;
}

.media-item figure,
.media-item .media-link {
	display: block;
	width: 100%;
	height: 0px;
	padding-bottom: 55%;
	position: relative;
	overflow: hidden;
}

.media-item figure>img,
.media-item .media-link>img {
	width: 100%;
	height: 100%;
	position: absolute;
	left: 0px;
	top: 0px;
	-o-object-fit: cover;
	object-fit: cover;
}

.no-js .media-item figure noscript img,
.no-js .media-item .media-link noscript img {
	width: 100%;
	height: 100%;
	position: absolute;
	left: 0px;
	top: 0px;
	-o-object-fit: cover;
	object-fit: cover;
}

.media-item figure>img {
	-o-object-position: top;
	object-position: top;
}

.media-item .media-link::after {
	content: '';
	width: 15%;
	height: 0px;
	padding-bottom: 15%;
	display: block;
	background-image: url('../../images/icon/media_player.svg');
	background-repeat: no-repeat;
	background-position: center;
	background-size: contain;
	position: absolute;
	left: calc((100% - 15%)/2);
	top: 50%;
	-webkit-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	transform: translateY(-50%);
}

.media-item .media-title {
	font-size: 1.25rem;
	font-weight: bold;
	padding: 20px 20px 20px 20px;
	margin: 0px;
	line-height: 30px;
}

.media-item .media-title>span {
	display: block;
	font-size: 1rem;
	/* color: #8f8f8f; */
	color: #757575;
}

.media-item .explanation .open-btn {
	display: block;
	text-align: center;
	padding: 10px;
	background-color: #e6e6e6;
	color: #000;
	font-size: 1.1rem;
	line-height: 30px;
}

.media-item .explanation .open-btn::before {
	content: '';
	width: 30px;
	height: 30px;
	display: inline-block;
	vertical-align: top;
	background-image: url('../../images/icon/media_video.svg');
	background-repeat: no-repeat;
	background-position: center;
	background-size: contain;
}

.media-item .explanation .explanation-content {
	display: none;
	padding: 10px 15px;
	background-color: #e6e6e6;
	font-size: 1.125rem;
	line-height: 30px;
}

.media-item .explanation .close-btn {
	display: block;
	background-color: #e6e6e6;
	text-indent: -9999px;
	font-size: 0rem;
	background-image: url('../../images/icon/close.svg');
	background-repeat: no-repeat;
	background-position: center;
	background-size: 6%;
	margin-top: 15px;
	border-bottom: none;
}

.media-item .download-btn {
	display: block;
	text-align: center;
	padding: 10px;
	background-color: #e6e6e6;
	color: #000;
	font-size: 1.1rem;
	border-top: 1px rgba(200, 200, 200, 0.5) solid;
	border-bottom: none;
}

.content .media-item .download-btn {
	border-bottom: none;
}

.media-item .download-btn::before {
	content: '';
	width: 30px;
	height: 30px;
	display: inline-block;
	vertical-align: top;
	background-image: url('../../images/icon/media_download.svg');
	background-repeat: no-repeat;
	background-position: center;
	background-size: 70%;
}

.media-item .media-download {
	text-align: center;
	padding: 10px;
	font-size: 0rem;
}

.media-item .media-download a {
	display: inline-block;
	width: 32%;
	vertical-align: top;
	background-color: #e6e6e6;
	color: #000;
	padding: 3px 10px;
	font-size: 0.9rem;
	margin-right: 5px;
	margin-bottom: 5px;
	line-height: 30px;
	letter-spacing: 0px;
}

.no-js .media-item .explanation .explanation-content {
	display: block;
}

@media screen and (max-width: 1440px) {
	.media-item .media-download a {
		width: 31%;
	}
}

@media screen and (max-width: 1280px) {
	.media-item .media-download a {
		width: 47%;
	}
}

@media screen and (min-width: 1025px) {

	.media-item .explanation .open-btn:focus{
		position: relative;
	}

	.media-item .media-download a:hover,
	.media-item .media-download a:focus {
		background-color: #db3b00;
		color: #fff;
	}
}

.media-item .target-mark {
	position: absolute;
	top: 20px;
	left: -10px;
	color: #fff;
	font-size: 0.85rem;
	font-family: 'Verdana', 'Geneva', sans-serif, '微軟正黑體', 'Microsoft JhengHei', Arial, Helvetica, Sans-Serif;
	line-height: 28px;
	background-color: #db3b00;
	padding: 0px 12px;
}

.media-item .target-mark.color-mint {
	background-color: #3fc6b8;
}

.media-item .target-mark.color-orange {
	background-color: #db3b00;
}

.media-item .target-mark.color-red {
	background-color: #fe6036;
}

.media-item .target-mark.color-purple {
	background-color: #b158d2;
}

.media-list.ebook-list .media-item {
	border: none;
	max-width: 350px;
	margin-bottom: 50px;
}

.media-list.ebook-list .media-item figure {
	width: 100%;
	height: 0px;
	padding-bottom: 203%;
}

.media-list.ebook-list .media-item .ebook-btn {
	display: block;
	text-align: center;
	padding: 10px;
	border-width: 1px;
	border-color: #c8c8c8;
	border-style: solid;
	color: #000;
	font-size: 1.1rem;
}

@media screen and (min-width: 1025px) {

	.media-list.ebook-list .media-item .ebook-btn:hover,
	.media-list.ebook-list .media-item .ebook-btn:focus {
		background-color: #db3b00;
		border-color: #db3b00;
		color: #fff;
	}
}

@media screen and (max-width: 800px) {
	.media-list>li {
		width: 50%;
		padding: 5px;
	}

	.media-item .media-title {
		font-size: 1rem;
	}

	.media-item .explanation .open-btn {
		font-size: 1rem;
	}

	.media-item .explanation .explanation-content {
		font-size: 1rem;
	}

	.media-item .download-btn {
		font-size: 1rem;
	}

	.media-item .media-download a {
		width: 100%;
		display: block;
		margin-right: 0px;
		margin-bottom: 10px;
	}

	.media-list.ebook-list .media-item .ebook-btn {
		font-size: 1rem;
	}

	.media-item .target-mark {
		left: 0px;
	}
}

@media screen and (max-width: 480px) {
	.media-list.ebook-list .media-item {
		margin-bottom: 0px;
		max-width: 100%;
	}

	.media-list.ebook-list .media-item .media-title {
		padding: 10px 0px;
		font-size: 0.9rem;
		line-height: 1.4em;
	}

	.media-list.ebook-list .media-item .media-title>span {
		font-size: 0.9rem;
		margin: 5px 0px;
	}

	.media-list.ebook-list .media-item .ebook-btn {
		padding: 5px 10px;
	}
}

@media screen and (max-width: 480px) {
	.media-list>li {
		width: 100%;
		padding: 0px;
		margin-bottom: 20px;
	}

	.media-list.ebook-list>li {
		width: 50%;
		padding: 5px;
	}
}

/* 會員 */
.member-model {
	overflow: hidden;
	margin: 0px auto 20px;
	width: 100%;
}

.member-blk-form {
	width: 100%;
	max-width: 720px;
	margin: auto;
}

.member-model .blk {
	border-bottom: 1px #c8c8c8 solid;
	margin-bottom: 20px;
	padding-bottom: 20px;
	text-align: center;
}

.member-model .blk:last-child {
	border-bottom: none;
	margin-bottom: 0px;
	padding-bottom: 0px;
}

.member-model .member-input {
	display: inline-block;
	vertical-align: top;
}

.member-model .mbRegister {
	padding-left: 0px;
	list-style: none;
	font-size: 0rem;
	line-height: 1em;
	text-align: center;
}

.member-model .mbRegister>li {
	width: 100%;
	max-width: 125px;
	display: inline-block;
	vertical-align: top;
	position: relative;
	margin: 20px;
	padding: 10px;
}

.member-model .mbRegister .radio-item>label {
	display: block;
	position: relative;
	text-align: center;
	cursor: pointer;
}

.member-model .mbRegister .radio-item>label figure {
	width: 100%;
	height: 0px;
	padding-bottom: 100%;
	position: relative;
	margin-bottom: 10px;
}

.member-model .mbRegister .radio-item>label figure>img {
	width: 100%;
	height: 100%;
	display: block;
	position: absolute;
	left: 0px;
	top: 0px;
	-o-object-fit: cover;
	object-fit: cover;
}

.member-model .mbRegister .radio-item>label::after {
	content: '';
	display: inline-block;
	vertical-align: sub;
	width: 20px;
	height: 20px;
	background-color: #e5e5e5;
	background-repeat: no-repeat;
	background-position: center;
	background-size: 40%;
	border-radius: 100%;
}

.member-model .mbRegister .radio-item>input {
	visibility: hidden;
	width: 0px;
	height: 0px;
	opacity: 0;
}

.member-model .mbRegister .radio-item>input:checked+label::after {
	background-color: #db3b00;
}

.member-model input[type="text"],
.member-model input[type="password"] {
	width: 300px;
	height: 40px;
	font-size: 1rem;
	display: inline-block;
	vertical-align: top;
	margin-right: 10px;
}

@media screen and (min-width: 1025px) {
	.member-model input[type="text"]:focus,
	.member-model input[type="password"]:focus {
		outline: none;
		-webkit-box-shadow: 0 0 0 0.2rem rgba(219, 59, 0, 1);
                box-shadow: 0 0 0 0.2rem rgba(219, 59, 0, 1);
	}
}

.member-model select {
	height: 40px;
	font-size: 1rem;
	display: inline-block;
	vertical-align: top;
	margin-right: 10px;
}

@media screen and (min-width: 1025px) {
	.member-model select:focus {
		outline: none;
		-webkit-box-shadow: 0 0 0 0.2rem rgba(255, 114, 71, 0.5);
		box-shadow: 0 0 0 0.2rem rgba(255, 114, 71, 0.5);
	}
}

.member-model input[type="text"].is-correct+.check-sensor,
.member-model input[type="password"].is-correct+.check-sensor {
	display: inline-block;
	background-color: #2ac3a4;
	background-image: url('../../images/icon/checked_w.svg');
}

.member-model input[type="text"].is-error+.check-sensor,
.member-model input[type="password"].is-error+.check-sensor {
	display: inline-block;
	background-color: #f22d2d;
	background-image: url('../../images/icon/close_w.svg');
}

.member-model .member-input .check-sensor {
	width: 40px;
	height: 40px;
	display: none;
	vertical-align: top;
	border-radius: 100%;
	background-repeat: no-repeat;
	background-position: center;
	background-size: 40%;
}

/* =============== 會員 更新驗證碼按鈕 =============== */
.member-model .reload-btn {
	display: inline-block;
	vertical-align: top;
	height: 40px;
	padding: 0px;
	cursor: pointer;
	font-size: 0rem;
	overflow: hidden;
	/* width: 40px;*/
	/* background-image: url('../../images/icon/reload.svg');
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    background-color: transparent;*/
	/* border: none;*/
	/* text-indent: -9999px;*/
}

@media screen and (min-width: 1025px) {
	.member-model .reload-btn:focus {
		outline: none;
		-webkit-box-shadow: 0 0 0 0.2rem rgba(255, 114, 71, 0.5);
		box-shadow: 0 0 0 0.2rem rgba(255, 114, 71, 0.5);
	}
}

/* =============== 會員 功能按鈕 =============== */
.member-model .apply-btn {
	width: 200px;
	display: inline-block;
	font-size: 1.1rem;
	line-height: 1.3em;
	padding: 10px;
	margin: 0px 10px;
	border: none;
	text-align: center;
	background-color: #db3b00;
	color: #fff;
	cursor: pointer;
}

@media screen and (min-width: 1025px) {
	.member-model .apply-btn:hover,
	.member-model .apply-btn:focus {
		background-color: #e06827;
	}

	.member-model .apply-btn:focus {
		outline: none;
		-webkit-box-shadow: 0 0 0 0.2rem rgba(255, 114, 71, 0.5);
				box-shadow: 0 0 0 0.2rem rgba(255, 114, 71, 0.5);
	}
}

@media screen and (max-width: 767px) {
	.member-model .apply-btn {
		display: block;
		width: 100%;
		margin: 0px 0px 10px;
		font-size: 1rem;
	}
}

/* =============== 會員 一般按鈕 =============== */
.member-model .normal-btn {
	font-size: 1rem;
	display: inline-block;
	vertical-align: top;
	padding: 7px 15px;
	line-height: 1em;
	border-width: 1px;
	border-color: #020202;
	border-style: solid;
	color: #020202;
}

.content .member-model .normal-btn {
	border-color: #020202;
}

@media screen and (min-width: 1025px) {

	.member-model .normal-btn:hover,
	.member-model .normal-btn:focus {
		background-color: #db3b00;
		border-color: #db3b00;
		color: #fff;
	}
}

.member-info .normal-btn {
	margin-left: 10px;
}

.member-blk-form .normal-btn {
	margin-bottom: 20px;
}

/* =============== 會員 登入按鈕（Google/Facebook） =============== */
.member-model .signin-btn {
	width: calc(50% - 20px);
	display: block;
	float: left;
	padding: 10px;
	margin: 10px;
	text-align: center;
	color: #fff;
}

.member-model .signin-btn::before {
	content: '';
	width: 30px;
	height: 30px;
	display: block;
	background-repeat: no-repeat;
	background-position: center;
	background-size: contain;
	margin-right: 10px;
	float: left;
}

.member-model .signin-btn.icon-google {
	background-color: #d34133;
}

.member-model .signin-btn.icon-google::before {
	background-image: url('../../images/icon/member_google.svg');
}

.member-model .signin-btn.icon-facebook {
	background-color: #314a7e;
}

.member-model .signin-btn.icon-facebook::before {
	background-image: url('../../images/icon/member_facebook.svg');
}

@media screen and (min-width: 1025px) {

	.member-model .signin-btn.icon-google:hover,
	.member-model .signin-btn.icon-google:focus {
		background-color: #af3d35
	}

	.member-model .signin-btn.icon-facebook:hover,
	.member-model .signin-btn.icon-facebook:focus {
		background-color: #2a4173;
	}
}

@media screen and (max-width: 480px) {
	.member-model .signin-btn {
		width: 100%;
		display: block;
		float: none;
		margin: 0px 0px 20px;
		line-height: 30px;
	}

	.member-model .signin-btn::before {
		display: inline-block;
		vertical-align: top;
		float: none;
	}
}

/* =============== 會員 灰底的區塊 =============== */
.member-model article {
	padding: 20px;
	overflow: hidden;
	text-align: center;
}

.member-model article > h6,
.member-model article > .h6 {
	font-size: 1.2rem;
	font-weight: bold;
	margin-bottom: 15px;
}

@media screen and (max-width: 480px) {
	.member-model article {
		padding: 10px;
	}

	.member-model article > h6,
	.member-model article > .h6 {
		font-size: 1rem;
	}
}

/* =============== 會員 單選/複選按鈕（這是新的） =============== */
.member-model ul.radio-btn,
.member-model ul.checkbox-btn {
	list-style: none;
	padding-left: 0px;
	margin-bottom: 0px;
	overflow: hidden;
}

.member-model ul.radio-btn>li,
.member-model ul.checkbox-btn>li {
	width: auto;
	padding-right: 10px;
	float: left;
}

.member-model ul.radio-btn>li>span,
.member-model ul.checkbox-btn>li>span {
	color: red;
	font-size: 1rem;
}

.member-model ul.radio-btn label,
.member-model ul.checkbox-btn label {
	font-size: 1rem;
	line-height: 40px;
	display: inline-block;
	vertical-align: top;
	cursor: pointer;
}

.member-model ul.radio-btn label::before,
.member-model ul.checkbox-btn label::before {
	content: '';
	display: inline-block;
	vertical-align: sub;
	width: 20px;
	height: 20px;
	margin-right: 10px;
	background-color: #e5e5e5;
	background-repeat: no-repeat;
	background-position: center;
	background-size: 40%;
}

.member-model ul.radio-btn label::before {
	border-radius: 100%;
}

.member-model ul.radio-btn input[type="radio"],
.member-model ul.checkbox-btn input[type="checkbox"] {
	position: absolute;
	z-index: -1;
	opacity: 0;
}

.member-model ul.radio-btn input:checked+label::before,
.member-model ul.checkbox-btn input:checked+label::before {
	background-color: #db3b00;
}

@media screen and (min-width: 1025px) {
	.member-model ul.radio-btn input:focus + label,
	.member-model ul.checkbox-btn input:focus + label {
		-webkit-box-shadow: inset 0 0 0 0.2rem rgba(255, 114, 71, 0.5);
		box-shadow: inset 0 0 0 0.2rem rgba(255, 114, 71, 0.5);
	}
}

/* =============== 會員 驗證碼 =============== */
.member-model .verification input[type="text"] {
	width: 150px;
	margin-right: 0px;
	margin-bottom: 5px;
}

.member-model .verification img {
	height: 40px !important;
	display: inline-block;
	vertical-align: top;
	margin-right: 10px;
	margin-bottom: 5px;
}

.member-model .voice-services-btn {
	font-size: 1rem;
	display: inline-block;
	vertical-align: top;
	padding: 0px 15px;
	border-width: 1px;
	border-color: #020202;
	border-style: solid;
	color: #020202;
	height: 40px;
	line-height: 40px;
	margin-bottom: 5px;
	margin-right: 10px;
	margin-left: 2px;
	margin-top: 5px;
	background-color: transparent;
	cursor: pointer;
}

@media screen and (min-width: 1025px) {
	.member-model .voice-services-btn:hover,
	.member-model .fieldset .voice-services-btn:focus {
		border-color: #db3b00;
		background-color: #db3b00;
		color: #fff;
	}
}

/* =============== 會員 單選/複選按鈕（舊的） =============== */
.member-model label.radio-btn,
.member-model label.check-btn {
	width: auto;
	padding-right: 10px;
	font-size: 0rem;
	cursor: pointer;
	float: left;
}

.member-model label.radio-btn::before,
.member-model label.check-btn::before {
	display: none;
}

.member-model label.radio-btn input[type="radio"],
.member-model label.check-btn input[type="checkbox"] {
	position: absolute;
	z-index: -1;
	opacity: 0;
}

.member-model label.radio-btn .indicator,
.member-model label.check-btn .indicator {
	font-size: 1rem;
	line-height: 40px;
	display: inline-block;
	vertical-align: top;
}

.member-model label.radio-btn input[type="text"],
.member-model label.check-btn input[type="text"] {
	width: 180px;
	background-color: transparent;
	border-bottom: 1px #c8c8c8 solid;
	margin-left: 5px;
	margin-right: 0px;
}

.member-model label.radio-btn .indicator::before,
.member-model label.check-btn .indicator::before {
	content: '';
	display: inline-block;
	vertical-align: sub;
	width: 20px;
	height: 20px;
	margin-right: 10px;
	background-color: #e5e5e5;
	background-repeat: no-repeat;
	background-position: center;
	background-size: 40%;
}

.member-model label.radio-btn .indicator::before {
	border-radius: 100%;
}

.member-model label.radio-btn input:checked+label+.indicator::before,
.member-model label.check-btn input:checked+label+.indicator::before {
	background-color: #db3b00;
}

.member-model label.radio-btn.radio-btn-true .indicator::before,
.member-model label.radio-btn.radio-btn-false .indicator::before {
	vertical-align: top;
	width: 40px;
	height: 40px;
}

.member-model label.radio-btn.radio-btn-true .indicator::before {
	background-image: url('../../images/icon/checked.svg');
}

.member-model label.radio-btn.radio-btn-false .indicator::before {
	background-image: url('../../images/icon/close.svg');
}

.member-model label.radio-btn.radio-btn-true input:checked+label+.indicator::before {
	background-image: url('../../images/icon/checked_w.svg');
}

.member-model label.radio-btn.radio-btn-false input:checked+label+.indicator::before {
	background-image: url('../../images/icon/close_w.svg');
}

@media screen and (min-width: 1025px) {
	.member-model label.radio-btn input:focus + .indicator,
	.member-model label.check-btn input:focus + .indicator {
		-webkit-box-shadow: inset 0 0 0 0.2rem rgba(255, 114, 71, 0.5);
		box-shadow: inset 0 0 0 0.2rem rgba(255, 114, 71, 0.5);
	}
}

/* =============== 會員 圖示LOGO =============== */
.member-logo {
	display: block;
	margin: auto;
	width: 130px;
	height: 130px;
	position: relative;
	margin-bottom: 30px;
}

.member-logo>img {
	width: 100%;
	height: 100%;
	display: block;
	position: absolute;
	left: 0px;
	top: 0px;
	-o-object-fit: contain;
	object-fit: contain;
}

/* =============== 會員 欄位與底下標籤 =============== */
.member-model .row {
	padding: 10px 0px;
	font-size: 0rem;
	margin: auto;
	overflow: hidden;
}

.member-model .row a {
	font-size: 1rem;
	line-height: 40px;
}

.member-model .row i {
	font-style: normal;
	font-size: 1rem;
	line-height: 40px;
	color: #db3b00;
}

.member-model .row .prompt {
	font-size: 0.95rem;
	display: block;
	width: 100%;
	text-align: left;
}

.member-model dl.row>dt,
.member-model dl.row>dd {
	float: left;
	text-align: left;
}

.member-model dl.row>dt {
	width: 200px;
}

.member-model dl.row>dd {
	width: calc(100% - 200px);
}

/* =============== 會員 標題 =============== */
.member-model dt label {
	width: 100%;
	height: 40px;
	display: block;
	font-size: 1rem;
	font-weight: bold;
	line-height: 40px;
	padding-right: 10px;
	text-align: left;
}

.member-model .member-blk-form dt label.has-icon::before {
	content: '';
	width: 40px;
	height: 40px;
	background-repeat: no-repeat;
	background-position: center;
	background-size: 70%;
	display: inline-block;
	vertical-align: top;
}

.member-model .member-blk-form dt label.icon-account::before {
	background-image: url('../../images/icon/member_account.svg');
}

.member-model .member-blk-form dt label.icon-password::before {
	background-image: url('../../images/icon/member_password.svg');
}

.member-model .member-blk-form dt label.icon-mail::before {
	background-image: url('../../images/icon/member_mail.svg');
}

/* =============== 會員 使用者照片 =============== */
.member-model .member-photo-sm {
	width: 100px;
	height: 100px;
	border-radius: 100%;
	overflow: hidden;
	position: relative;
	margin-right: 20px;
}

.member-model .member-photo-sm>img {
	width: 100%;
	height: 100%;
	position: absolute;
	display: block;
	left: 0px;
	top: 0px;
	-o-object-fit: cover;
	object-fit: cover;
}

@media screen and (max-width: 767px) {
	.member-model .row i {
		width: 100%;
		display: block;
		text-align: right;
	}

	.member-model dl.row>dt,
	.member-model dl.row>dd {
		width: 100%;
		display: block;
		overflow: hidden;
	}

	.member-model .member-input {
		display: block;
	}

	.member-model label {
		text-align: left;
		padding-right: 0px;
	}

	.member-model .member-blk-form dt label.has-icon::before {
		display: none;
	}

	.member-model input[type="text"],
	.member-model input[type="password"] {
		width: 100%;
		margin-right: 0px;
	}

	.member-model input[type="text"].is-correct,
	.member-model input[type="text"].is-error,
	.member-model input[type="password"].is-correct,
	.member-model input[type="password"].is-error {
		width: calc(100% - 55px);
		margin-right: 10px;
	}

	.member-model .member-photo-sm {
		margin-right: 0px;
	}
}

/* 會員專區 */
.member-title {
	font-size: 1.3rem;
	font-weight: bold;
	margin-bottom: 20px;
	text-align: left;
}

.member-subtitle {
	color: #757575;
	font-size: 1.2rem;
	margin-bottom: 20px;
	text-align: left;
}

@media screen and (max-width: 767px) {
	.member-subtitle {
		margin-bottom: 0px;
	}
}

.member-info {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: horizontal;
	-webkit-box-direction: normal;
	-ms-flex-flow: row wrap;
	flex-flow: row wrap;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	margin-bottom: 40px;
}

.member-info figure {
	width: 130px;
	height: 130px;
	border-radius: 100%;
	position: relative;
	overflow: hidden;
}

.member-info figure>img {
	position: absolute;
	display: block;
	width: 100%;
	height: 100%;
	left: 0px;
	top: 0px;
	-o-object-fit: cover;
	object-fit: cover;
}

.member-info .member-personal-info {
	width: calc(100% - 150px);
	padding-left: 40px;
}

.member-info .member-personal-info .name {
	font-size: 1.5rem;
	font-weight: bold;
	margin-bottom: 10px;
}

.member-info .member-personal-info .status {
	line-height: 40px;
	margin-bottom: 10px;
}

.member-info .member-personal-info .status::before {
	content: '';
	width: 40px;
	height: 40px;
	background-image: url('../../images/icon/member_bag.svg');
	background-repeat: no-repeat;
	background-position: center;
	background-size: 70%;
	display: inline-block;
	vertical-align: top;
}

.member-info .member-personal-info .status>span {
	color: #db3b00;
}

@media screen and (max-width: 1000px) {
	.member-info {
		display: block;
		margin-bottom: 20px;
	}

	.member-info figure {
		width: 100px;
		height: 100px;
		display: inline-block;
		vertical-align: top;
	}

	.member-info .member-personal-info {
		width: calc(100% - 110px);
		display: inline-block;
		vertical-align: top;
		padding-left: 10px;
	}

	.member-info .member-personal-info .name {
		margin-bottom: 0px;
	}

	.member-info .normal-btn {
		width: 150px;
		display: block;
		margin: 10px 0px 5px;
		text-align: center;
	}
}

.member-aside {
	width: 300px;
	float: left;
	padding-right: 30px;
}

.member-aside ul {
	display: block;
	list-style: none;
	padding-left: 0px;
	margin-bottom: 30px;
}

@media screen and (min-width: 1001px) {
	.member-aside ul {
		display: block !important;
	}
}

.member-aside .member-title {
	color: #000;
	display: block;
}

.content .member-aside a{
	border-bottom: none;
}

.member-aside a:not(.member-title) {
	font-size: 1rem;
	color: #000;
	display: block;
	text-align: left;
}

.member-aside a:not(.member-title)>span {
	color: #db3b00;
	float: right;
}

.member-aside a:not(.member-title).current {
	color: #db3b00;
}

@media screen and (min-width: 1025px) {

	.member-aside a:not(.member-title):hover,
	.member-aside a:not(.member-title):focus {
		color: #db3b00;
	}
}

@media screen and (max-width: 1000px) {
	.member-aside {
		width: 100%;
		float: none;
		padding-right: 0px;
		margin-bottom: 50px;
	}

	.member-aside .blk {
		padding-bottom: 0px;
		border-bottom: none;
	}

	.member-aside ul {
		display: none;
		margin-bottom: 0px;
		padding: 10px 0px;
		border-bottom: 1px #c8c8c8 solid;
	}

	.member-aside .member-aside-btn {
		margin-bottom: 0px;
		padding: 10px;
		border: 1px #e8e8e8 solid;
		text-align: center;
	}
}

.member-article {
	width: calc(100% - 300px);
	float: left;
	padding-left: 30px;
	border-left: 1px #c8c8c8 solid;
}

.member-article label::before {
	display: none;
}

.member-article .card-list>li {
	width: 33.33%;
}

@media screen and (max-width: 1000px) {
	.member-article {
		width: 100%;
		float: none;
		padding-left: 0px;
		border-left: none;
	}
}

@media screen and (max-width: 767px) {
	.member-article .card-list>li {
		width: 100%;
	}
}

.member-article .card .card-info .delete-btn{
	border-bottom: none;
}

/* 單元頁面 */
article.fullbackground {
	position: relative;
	margin: 0px;
	padding: 50px 0px;
	background-color: #000;
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
}

article.fullbackground>.wrap {
	position: relative;
}

article.fullbackground.bg-food {
	background-image: url('../../images/bg_food.jpg');
}

article.fullbackground.bg-shop {
	background-image: url('../../images/bg_shop.jpg');
}

article.fullbackground::before {
	content: '';
	width: 100%;
	height: 100%;
	display: block;
	position: absolute;
	top: 0px;
	left: 0px;
	background-color: rgba(0, 0, 0, 0.5);
}

article.fullbackground h2,
article.fullbackground .h2,
article.fullbackground h3,
article.fullbackground .h3,
article.fullbackground p {
	color: #fff;
}

/* 單元列表頁的選單按鈕 */
ul.guidelink-list {
	list-style: none;
	padding: 0px;
	margin: 90px 0px;
	text-align: center;
	font-size: 0rem;
}

.guidelink-list>li {
	display: inline-block;
	vertical-align: top;
	width: 250px;
	margin: 10px;
}

.guidelink-list>li>h3{
	margin: 0px;
}

.guidelink-list .guidelink-link {
	display: block;
	padding: 10px 10px 30px;
	background-color: #fff;
	font-size: 1.1rem;
}

@media screen and (min-width: 1025px) {

	.guidelink-list .guidelink-link:hover,
	.guidelink-list .guidelink-link:focus {
		background-color: #db3b00;
	}

	.guidelink-list .guidelink-link:hover .guidelink-title,
	.guidelink-list .guidelink-link:focus .guidelink-title {
		color: #fff;
	}
}

.guidelink-list .guidelink-link figure {
	position: relative;
	overflow: hidden;
	width: 100%;
	height: 0px;
	padding-bottom: 67%;
	margin-bottom: 10px;
}

.guidelink-list .guidelink-link figure>img {
	display: block;
	width: 100%;
	height: 100%;
	position: absolute;
	left: 0px;
	top: 0px;
	-o-object-fit: cover;
	object-fit: cover;
}

/* 單元列表頁的選單按鈕（圓形） */
ul.guidelink-circular-list {
	list-style: none;
	padding: 0px;
	margin: 40px 0px;
	text-align: center;
	font-size: 0rem;
}

.guidelink-circular-list>li {
	display: inline-block;
	vertical-align: top;
	margin: 10px 30px;
}

.guidelink-circular-list .guidelink-circular-btn {
	display: block;
}

.guidelink-circular-list .guidelink-circular-btn>span {
	display: block;
	font-size: 1.2rem;
	font-weight: bold;
	line-height: 1.1em;
}

.guidelink-circular-list .guidelink-circular-btn>span::before {
	content: '';
	width: 130px;
	height: 130px;
	display: block;
	margin: 10px auto;
	border-radius: 100%;
	background-color: #eeeeee;
	background-repeat: no-repeat;
	background-position: center;
	background-size: 50%;
	-webkit-transition: all 0.3s;
	-o-transition: all 0.3s;
	transition: all 0.3s;
}

.guidelink-circular-list .guidelink-circular-btn.icon-muslim-guide-1>span::before {
	background-image: url('../../images/muslim_guide-1.svg');
}

.guidelink-circular-list .guidelink-circular-btn.icon-muslim-guide-2>span::before {
	background-image: url('../../images/muslim_guide-2.svg');
}

.guidelink-circular-list .guidelink-circular-btn.icon-muslim-guide-3>span::before {
	background-image: url('../../images/muslim_guide-3.svg');
}

.guidelink-circular-list .guidelink-circular-btn.icon-muslim-guide-4>span::before {
	background-image: url('../../images/muslim_guide-4.svg');
}

.guidelink-circular-list .guidelink-circular-btn.icon-muslim-guide-5>span::before {
	background-image: url('../../images/muslim_guide-5.svg');
}

.guidelink-circular-list .guidelink-circular-btn.icon-accessibility-guide-1>span::before {
	background-image: url('../../images/accessibility_guide-1.svg');
}

.guidelink-circular-list .guidelink-circular-btn.icon-accessibility-guide-2>span::before {
	background-image: url('../../images/accessibility_guide-2.svg');
}

.guidelink-circular-list .guidelink-circular-btn.icon-accessibility-guide-3>span::before {
	background-image: url('../../images/accessibility_guide-3.svg');
}

.guidelink-circular-list .guidelink-circular-btn.icon-accessibility-guide-4>span::before {
	background-image: url('../../images/accessibility_guide-4.svg');
}

.guidelink-circular-list .guidelink-circular-btn.icon-accessibility-guide-5>span::before {
	background-image: url('../../images/accessibility_guide-5.svg');
}

@media screen and (min-width: 1025px) {

	.guidelink-circular-list .guidelink-circular-btn:hover>span::before,
	.guidelink-circular-list .guidelink-circular-btn:focus>span::before {
		-webkit-transform: translateY(-10px);
		-ms-transform: translateY(-10px);
		transform: translateY(-10px);
	}

	.guidelink-circular-list .guidelink-circular-btn:hover>span,
	.guidelink-circular-list .guidelink-circular-btn:focus>span {
		color: #db3b00;
	}
}

/* 格子列表頁 */
ul.gridDrawer {
	list-style: none;
	padding: 0px;
	margin-bottom: 0px;
	border: 4px #fff solid;
}

.gridDrawer .gd__group {
	width: 100%;
	height: 0;
	padding-bottom: 50%;
	overflow: hidden;
	position: relative;
	font-size: 0rem;
}

.gridDrawer .gd__group .gd__side {
	height: 0;
	padding-bottom: 50%;
	display: inline-block;
	vertical-align: top;
	position: relative;
	/* -webkit-transition: all 0.6s cubic-bezier(0.86, 0, 0.07, 1);
    -o-transition: all 0.6s cubic-bezier(0.86, 0, 0.07, 1);
    transition: all 0.6s cubic-bezier(0.86, 0, 0.07, 1); */
}

.gridDrawer .gd__group .gd__side.gd__size-l {
	width: 50%;
}

.gridDrawer .gd__group .gd__side.gd__size-s {
	width: 25%;
}

.gridDrawer .gd__group .gd__side.gd__size-s .gd__item .gd__inside {
	height: 200%;
	top: -100%;
}

.gridDrawer .gd__group .gd__side.gd__size-s .gd__item:first-child .gd__inside {
	top: 0%;
}

@media screen and (max-width: 1024px) {
	.gridDrawer .gd__group {
		height: auto;
		padding-bottom: 0px;
	}

	.gridDrawer .gd__group .gd__side {
		height: auto;
		padding-bottom: 0px;
		display: block;
	}

	.gridDrawer .gd__group .gd__side.gd__size-l {
		width: 100%;
	}

	.gridDrawer .gd__group .gd__side.gd__size-s {
		width: 100%;
	}

	.gridDrawer .gd__group .gd__side.gd__size-s .gd__item {
		width: 50%;
		height: auto;
		padding-bottom: 0px;
		display: inline-block;
		vertical-align: top;
		position: static;
	}

	.gridDrawer .gd__group .gd__side.gd__size-s .gd__item .gd__inside {
		width: 200%;
		height: auto;
		padding-bottom: 0px;
		margin-left: -100%;
	}

	.gridDrawer .gd__group .gd__side.gd__size-s .gd__item:first-child .gd__inside {
		top: 0%;
		margin-left: 0%;
	}
}

@media screen and (max-width: 480px) {
	.gridDrawer .gd__group .gd__side.gd__size-s {
		width: 100%;
	}

	.gridDrawer .gd__group .gd__side.gd__size-s .gd__item {
		width: 100%;
	}

	.gridDrawer .gd__group .gd__side.gd__size-s .gd__item .gd__inside {
		width: 100%;
		margin-left: 0%;
	}
}

.gridDrawer .gd__item {
	width: 100%;
	height: 0px;
	padding-bottom: 100%;
	position: relative;
}

.gridDrawer .gd__item .gd__outside {
	width: 100%;
	height: 100%;
	position: absolute;
	border: 4px #fff solid;
	background-color: #fe6036;
}

.gridDrawer .gd__item .gd__outside .open-btn {
	position: absolute;
	display: block;
	width: 100%;
	height: 100%;
	left: 0%;
	top: 0%;
	text-indent: -9999px;
	text-decoration: none;
}

.gridDrawer .gd__item .gd__outside .open-btn::after {
	content: '';
	display: block;
	width: 100%;
	height: 100%;
	position: absolute;
	left: 0px;
	top: 0px;
	opacity: 0;
	background-color: #000;
	-webkit-transition: opacity 0.6s;
	-o-transition: opacity 0.6s;
	transition: opacity 0.6s;
}

.gridDrawer .gd__item .gd__outside .open-btn::before {
	content: '';
	display: block;
	width: 100%;
	height: 100%;
	position: absolute;
	left: 0px;
	top: 0px;
	opacity: 0;
	-webkit-box-shadow: inset 0 0 0 0.2rem rgba(219, 59, 0, 1);
			box-shadow: inset 0 0 0 0.2rem rgba(219, 59, 0, 1);
	z-index: 500;
}

.gridDrawer .gd__item.is-open .gd__outside .open-btn::after {
	opacity: 0.5;
}

@media screen and (min-width: 1025px) {
	.gridDrawer .gd__item .gd__outside .open-btn:hover::after,
	.gridDrawer .gd__item .gd__outside .open-btn:focus::after {
		opacity: 0.5;
	}
	.gridDrawer .gd__item .gd__outside .open-btn:focus {
		box-shadow: none;
	}
	.gridDrawer .gd__item .gd__outside .open-btn:focus::before {
		opacity: 1;
	}
}

.gridDrawer .gd__item .gd__outside figure {
	width: 100%;
	height: 100%;
	position: absolute;
	left: 0px;
	top: 0px;
	overflow: hidden;
	background-color: #000;
}

.gridDrawer .gd__item .gd__outside figure>img {
	width: 100%;
	height: 100%;
	display: block;
	position: absolute;
	left: 0px;
	top: 0px;
	-o-object-fit: cover;
	object-fit: cover;
}

.gridDrawer .gd__item .gd__outside .gd__title {
	width: calc(100% - 40px);
	position: absolute;
	left: 20px;
	bottom: 20px;
	font-size: 1.7rem;
	font-weight: bold;
	color: #fff;
	z-index: 100;
}

@media screen and (max-width: 1024px) {
	.gridDrawer .gd__item .gd__outside .gd__title {
		font-size: 1.5rem;
	}
}

@media screen and (max-width: 480px) {
	.gridDrawer .gd__item .gd__outside .gd__title {
		font-size: 1.5rem;
	}
}

.gridDrawer .gd__item .gd__inside {
	width: 0%;
	height: 100%;
	position: absolute;
	border: 4px #fff solid;
	background-color: #db3b00;
	top: 0%;
	left: 100%;
	display: none;
	opacity: 0;
	z-index: 100;
}

.gridDrawer .gd__item .gd__inside .gd__title {
	font-size: 2rem;
	font-weight: bold;
	color: #fff;
}

.gridDrawer .gd__item .gd__inside .close-btn {
	width: 20px;
	height: 20px;
	display: block;
	background: url('../../images/icon/close_w.svg') no-repeat center/contain;
	position: absolute;
	right: 30px;
	top: 30px;
	font-size: 0rem;
	border-bottom: none;
	color: #FFF;
}

@media screen and (min-width: 1025px) {
	.gridDrawer .gd__item .gd__inside .close-btn:focus {
		box-shadow: 0 0 0 0.2rem #ffcc81;
	}
}

.gridDrawer .gd__item .gd__inside .gd__textcontent {
	width: 100%;
	/* height: 350px; */
	color: #fff;
	padding: 30px 0px;
	font-size: 1.15rem;
	overflow-x: hidden;
	overflow-y: auto;
}

@media screen and (max-width: 1024px) {
	.gridDrawer .gd__item .gd__inside .gd__title {
		font-size: 1.5rem;
	}

	.gridDrawer .gd__item .gd__inside .gd__textcontent {
		height: auto;
		padding: 20px 0px;
	}
}

@media screen and (max-width: 480px) {
	.gridDrawer .gd__item .gd__inside .gd__title {
		font-size: 1.4rem;
	}

	.gridDrawer .gd__item .gd__inside .gd__textcontent {
		font-size: 1rem;
	}

	.gridDrawer .gd__item .gd__inside .close-btn {
		width: 15px;
		height: 15px;
		right: 20px;
		top: 20px;
	}
}

.gridDrawer .gd__item .gd__wrap {
	width: 100%;
	height: 100%;
	padding: 30px;
	font-size: 1rem;
	position: absolute;
	left: 0px;
	top: 0px;
	display: flex;
	flex-direction: column;
}

.gridDrawer .gd__item .gd__wrap p {
	color: #fff;
	margin-bottom: 0px;
}

@media screen and (max-width: 1024px) {
	.gridDrawer .gd__item {
		width: 100%;
		height: auto;
		padding-bottom: 0px;
	}

	.gridDrawer .gd__item .gd__outside {
		width: 100%;
		height: 0px;
		padding-bottom: 100%;
		position: relative;
	}

	.gridDrawer .gd__item .gd__inside {
		width: 100%;
		height: auto;
		padding-bottom: 0px;
		position: relative;
		display: none;
		opacity: 1;
		left: 0%;
	}

	.gridDrawer .gd__item .gd__wrap {
		width: 100%;
		height: auto;
		position: static;
		padding: 20px;
		display: block;
	}
}

@media screen and (max-width: 480px) {
	.gridDrawer .gd__item .gd__wrap {
		padding: 15px;
	}
}

.no-js .gridDrawer {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-wrap: wrap;
	    flex-wrap: wrap;
	overflow: hidden;
}

.no-js .gridDrawer .gd__item {
	width: 33.33%;
	height: auto;
	padding-bottom: 0;
}

.no-js .gridDrawer .gd__item .gd__outside {
	width: 100%;
	height: 0px;
	padding-bottom: 100%;
	position: relative;
}

.no-js .gridDrawer .gd__item .gd__inside {
	width: auto;
	height: auto;
	position: static;
	display: block;
	opacity: 1;
}

.no-js .gridDrawer .gd__item .gd__wrap {
	width: 100%;
	height: auto;
	position: static;
}

.no-js .gridDrawer .gd__item .gd__outside figure noscript img {
	width: 100%;
    height: 100%;
    display: block;
    position: absolute;
    left: 0px;
    top: 0px;
    -o-object-fit: cover;
    object-fit: cover;
}

.no-js .gridDrawer .gd__item .gd__inside .gd__textcontent {
	height: auto;
}

.no-js .gridDrawer .gd__item .gd__inside .close-btn {
	display: none;
}

/* 穆斯林內頁清單頁 */
.muslimData {
	margin-bottom: 20px;
}

.muslimDataTable,
.cropDataTable {
	width: 100%;
	text-align: left;
	font-size: 1.15rem;
}

.muslimDataTable th,
.cropDataTable th {
	padding: 10px 0px;
	vertical-align: middle;
	font-weight: bold;
}

.muslimDataTable td,
.cropDataTable td {
	padding: 15px 5px;
}

.muslimDataTable thead,
.cropDataTable thead {
	border-bottom: 1px #c8c8c8 solid;
}

.muslimDataTable tbody,
.cropDataTable tbody {
	border-bottom: 1px #DDD solid;
}

.muslimDataTable tbody:last-child,
.cropDataTable tbody:last-child {
	border-bottom: none;
}

.no-js .muslimDataTable tbody tr:last-child,
.no-js .cropDataTable tbody tr:last-child {
	display: table-row !important;
}

.muslimDataTable .moreInfo_toggle,
.cropDataTable .moreInfo_toggle {
	display: block;
	width: 36px;
	height: 36px;
	line-height: 30px;
	text-align: center;
	font-size: 1.5rem;
	font-weight: bold;
	cursor: pointer;
	color: #db3b00;
	border: 1px solid #db3b00;
}

.muslimDataTable .moreInfo,
.cropDataTable .moreInfo {
	margin: -15px 0 0 0;
	padding: 15px;
	background-color: #f4f4f4;
	font-size: 1.1rem;
}

.cropDataTable .addr {
	padding: 0px 5px;
	border: 1px #db3b00 solid;
	display: inline-block;
	color: #020202;
	line-height: 30px;
}

@media screen and (min-width: 1025px) {

	.cropDataTable .addr:hover,
	.cropDataTable .addr:focus {
		color: #db3b00;
	}
}

.cropDataTable .addr::after {
	content: '';
	width: 30px;
	height: 30px;
	display: inline-block;
	vertical-align: top;
	background-image: url('../../images/icon/placeholder.svg');
	background-position: center;
	background-size: 80%;
	background-repeat: no-repeat;
	margin-left: 5px;
}

.cropDataTable .text-title {
	font-weight: bold;
	padding: 10px 0px;
}

.muslimDataTable .myes,
.muslimDataTable .mno,
.muslimDataTable .mr,
.muslimDataTable .mss,
.muslimDataTable .mfr,
.muslimDataTable .mft,
.muslimDataTable .mfh,
.muslimDataTable .kmr,
.muslimDataTable .hk,
.muslimDataTable .ah,
.muslimDataTable .hmi,
.muslimDataTable .mch,
.muslimDataTable .mfhrs,
.muslimDataTable .kh,
.cropDataTable .myes,
.cropDataTable .mno,
.cropDataTable .mr,
.cropDataTable .mss,
.cropDataTable .mfr,
.cropDataTable .mft,
.cropDataTable .mfh,
.cropDataTable .kmr,
.cropDataTable .hk,
.cropDataTable .ah,
.cropDataTable .hmi,
.cropDataTable .mch,
.cropDataTable .mfhrs,
.cropDataTable .kh {
	padding: 2px 10px;
	margin: 2px 5px 2px 0px;
	color: #fff;
	border-radius: 4px;
	font-size: 0.9rem;
}

.muslimDataTable .myes {
	background-color: #1a7d83;
}

.muslimDataTable .mno {
	background-color: #757575;
}

.muslimDataTable .mr {
	background-color: #217f79;
}

.muslimDataTable .mss {
	background-color: #00a3d4;
}

.muslimDataTable .mfr {
	background-color: #5a7f0d;
}

.muslimDataTable .mft {
	background-color: #9169e4;
}

.muslimDataTable .mfh {
	background-color: #d04f98;
}

.muslimDataTable .kmr {
	background-color: #ef5d95;
}

.muslimDataTable .hk {
	background-color: #db3b00;
}

.muslimDataTable .ah {
	background-color: #00BCD4;
}

.muslimDataTable .hmi {
	background-color: #F44336;
}

.muslimDataTable .mch {
	background-color: #60c5a9;
}

.muslimDataTable .kh {
	background-color: #109e95;
}
.muslimDataTable .mfhrs {
	background-color:#990;
}
@media screen and (max-width: 1000px) {

	.muslimDataTable thead,
	.muslimDataTable .moreInfo .m-hide,
	.muslimDataTable .moreInfo_toggle,
	.cropDataTable thead,
	.cropDataTable .moreInfo .m-hide,
	.cropDataTable .moreInfo_toggle {
		display: none;
	}

	.muslimDataTable .moreInfo,
	.cropDataTable .moreInfo {
		margin: 0 0 15px 0;
	}

	.muslimDataTable td,
	.cropDataTable td {
		display: block;
		padding: 0;
		line-height: 2em;
	}

	.muslimDataTable td::before,
	.cropDataTable td::before {
		content: attr(data-th);
	}

	.muslimDataTable .name,
	.cropDataTable .name {
		color: #146192;
		font-size: 1.2rem;
	}

	.cropDataTable tbody tr>td:first-child {
		padding-top: 10px;
	}
}

@media screen and (max-width: 768px) {
	.rwd-table th {
		display: none;
	}

	.rwd-table td {
		display: block;
		text-align: left;
	}

	.rwd-table td::before {
		content: attr(data-th);
		margin-right: 1em;
	}

	.rwd-table td:first-child {
		background-color: #263883;
		color: #fff;
	}

	.rwd-table td:first-child::before {
		margin-right: 0;
	}

	.rwd-table td:nth-child(2)::before {
		margin-right: 0;
	}
}

@media screen and (max-width: 480px) {

	.muslimDataTable,
	.cropDataTable {
		font-size: 1rem;
	}

	.muslimDataTable .moreInfo,
	.cropDataTable .moreInfo {
		font-size: 1rem;
	}

	.cropDataTable .addr::after {
		display: none;
	}
}

/* 一行式的搜尋Bar */
.rank-search-bar {
	font-size: 0rem;
	text-align: center;
	margin-bottom: 30px;
}

.rank-search-bar .fieldset {
	display: inline-block;
	vertical-align: top;
	margin: 10px;
}

.rank-search-bar label {
	font-size: 1.125rem;
	margin: 0px 10px;
}

.rank-search-bar input.search-btn {
	text-indent: -9999px;
	font-size: 0rem;
	border-radius: 100%;
	margin: 0px 5px;
	padding: 0px;
}

@media screen and (max-width: 767px) {
	.rank-search-bar {
		text-align: left;
	}

	.rank-search-bar label {
		display: block;
		margin: 0px;
	}

	.rank-search-bar .fieldset {
		display: block;
		margin: 10px 0px;
	}

	.rank-search-bar .fieldset select {
		width: 100%;
	}

	.rank-search-bar .fieldset input[type='text'],
	.rank-search-bar .fieldset input[type='password'] {
		width: calc(100% - 45px);
	}

	.rank-search-bar input.search-btn {
		margin: 0px;
		margin-left: 5px;
	}
}

/* 電子賀卡 */
.videoCopyright {
	width: 92%;
	margin: 20px auto;
	padding: 20px;
	border: 1px #c8c8c8 solid;
}

@media screen and (max-width: 480px) {
	.videoCopyright {
		padding: 15px;
	}
}

ul.videoMovieList {
	display: block;
	overflow: hidden;
	width: 100%;
	padding-left: 0px;
	margin: 20px auto;
	text-align: center;
	list-style: none;
	font-size: 0rem;
	line-height: 1em;
}

.videoMovieList li {
	width: 100%;
	max-width: 350px;
	height: auto;
	display: inline-block;
	vertical-align: top;
	position: relative;
	margin: 20px;
	padding: 0px;
	color: #FFF;
	text-align: center;
	font-size: 1.1rem;
}

@media screen and (max-width: 480px) {
	.videoMovieList li {
		margin: 20px 0px;
	}
}

.videoMovieList li .radio-item figure {
	width: 100%;
	height: 0px;
	padding-bottom: 67%;
	position: relative;
	overflow: hidden;
	border-width: 3px;
	border-style: solid;
	border-color: transparent;
}

.videoMovieList li .radio-item figure>img {
	width: 100%;
	height: 100%;
	position: absolute;
	left: 0px;
	top: 0px;
	-o-object-fit: contain;
	object-fit: contain;
}

.videoMovieList li .radio-item label {
	width: auto;
	font-size: 0rem;
	cursor: pointer;
}

.videoMovieList li .radio-item input[type='radio'] {
	position: absolute;
	z-index: -1;
	opacity: 0;
}

.videoMovieList li .radio-item .indicator {
	font-size: 1rem;
	line-height: 40px;
	display: inline-block;
	vertical-align: top;
}

.videoMovieList li .radio-item .indicator::before {
	content: '';
	display: inline-block;
	vertical-align: sub;
	width: 20px;
	height: 20px;
	margin-right: 10px;
	background-color: #e5e5e5;
	background-repeat: no-repeat;
	background-position: center;
	background-size: 40%;
	border-radius: 100%;
}

.videoMovieList li .radio-item input:checked+figure+.indicator::before {
	background-color: #db3b00;
}

.videoMovieList li .radio-item input:checked+figure {
	border-color: #db3b00;
	background-color: #db3b00;
}

@media screen and (min-width: 1025px) {
	.videoMovieList li .radio-item input:focus+figure+.indicator::before {
		background-color: #db3b00;
	}
	
	.videoMovieList li .radio-item input:focus+figure {
		border-color: #db3b00;
		background-color: #db3b00;
	}
}

ul.cardList {
	display: block;
	overflow: hidden;
	width: 100%;
	padding-left: 0px;
	margin: 20px auto;
	text-align: center;
	list-style: none;
}

.cardList li {
	width: 100%;
	max-width: 125px;
	height: auto;
	display: inline-block;
	vertical-align: top;
	position: relative;
	margin: 20px;
	padding: 10px;
	color: #FFF;
	text-align: center;
	font-size: 1.1rem;
	background-image: url('../../images/stamp.png');
	background-repeat: no-repeat;
	background-position: top center;
	background-size: contain;
}

@media screen and (max-width: 480px) {
	.cardList li {
		margin: 20px 0px;
	}
}

.cardList .radio-item figure {
	width: 100%;
	height: 0px;
	padding-bottom: 123%;
	position: relative;
}

.cardList .radio-item figure>img {
	width: 100%;
	height: 100%;
	display: block;
	position: absolute;
	left: 0px;
	top: 0px;
	-o-object-fit: contain;
	object-fit: contain;
	-o-object-position: top center;
	object-position: top center;
}

.cardList li .radio-item label {
	width: auto;
	font-size: 0rem;
	cursor: pointer;
}

.cardList li .radio-item input[type='radio'] {
	position: absolute;
	z-index: -1;
	opacity: 0;
}

@media screen and (min-width: 1025px) {
	.cardList li .radio-item input[type='radio']:focus + figure + .indicator{
		-webkit-box-shadow: inset 0 0 0 0.2rem rgba(255, 114, 71, 0.5);
		        box-shadow: inset 0 0 0 0.2rem rgba(255, 114, 71, 0.5);
	}
}

.cardList li .radio-item .indicator {
	font-size: 1rem;
	line-height: 40px;
	display: inline-block;
	vertical-align: top;
	margin-top: 10px;
}

.cardList li .radio-item .indicator::before {
	content: '';
	display: inline-block;
	vertical-align: sub;
	width: 20px;
	height: 20px;
	margin-right: 10px;
	background-color: #e5e5e5;
	background-repeat: no-repeat;
	background-position: center;
	background-size: 40%;
	border-radius: 100%;
}

.cardList li .radio-item input:checked+figure+.indicator::before {
	background-color: #db3b00;
}

.cardList li .radio-item input:checked+figure {
	border-color: #db3b00;
}

.cardList.obear-list li {
	background-image: none;
}

.cardList.obear-list .radio-item figure {
	padding-bottom: 100%;
}

.cardList.obear-list .radio-item .indicator::before {
	margin-right: 0px;
}

.cardbox {
	display: block;
	overflow: hidden;
	width: 100%;
	position: relative;
	background-color: #db3b00;
	margin-bottom: 30px;
}

.Stamp {
	position: absolute;
	top: 20px;
	right: 30px;
	width: 125px;
	height: 156px;
	padding: 12px;
	background-image: url('../../images/stamp.png');
	background-repeat: no-repeat;
	background-position: top center;
	background-size: contain;
}

.Stamp img {
	width: 100%;
	height: auto;
}

.Stamp2 {
	position: absolute;
	top: 20px;
	right: 100px;
	width: 280px;
	height: 142px;
	padding: 74px 12px 0px 201px;
	background-image: url('../../images/stamp2.png');
	background-repeat: no-repeat;
	background-position: center;
	background-size: contain;
	font-size: 0.8rem;
	color: #fff;
	line-height: 1em;
	letter-spacing: 0px;
	text-align: center;
}

@media screen and (max-width: 1000px) {
	.Stamp {
		top: 30px;
	}

	.Stamp2 {
		top: 30px;
	}
}

.cardboxleft {
	display: block;
	float: left;
	width: 50%;
	background-color: #db3b00;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	padding: 30px;
}

.cardboxleft img {
	display: block;
	float: left;
	width: 100%;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
}

@media screen and (max-width: 1000px) {
	.cardboxleft {
		display: block;
		float: none;
		width: 100%;
		overflow: hidden;
		padding-bottom: 0px;
	}
}

@media screen and (max-width: 480px) {
	.cardboxleft {
		padding: 15px;
	}
}

.cardboxright {
	display: block;
	float: right;
	width: 50%;
	background-color: #db3b00;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	padding: 30px;
}

@media screen and (max-width: 1000px) {
	.cardboxright {
		display: block;
		float: none;
		width: 100%;
		overflow: hidden;
		padding-top: 0px;
	}
}

@media screen and (max-width: 480px) {
	.cardboxright {
		padding: 15px;
	}
}

.cardtomane {
	padding: 30px 0px 70px 0px;
	color: #fff;
	font-size: 1.1rem;
}

@media screen and (max-width: 1000px) {
	.cardtomane {
		padding: 20px 0px;
	}
}

.cardtomane a {
	padding: 0px 10px 4px 10px;
	color: #fff;
	text-decoration: none;
}

.cardtomane input {
	border-bottom: 1px #fff solid;
	padding: 5px;
	font-size: 1rem;
	width: 150px;
	background-color: transparent;
	color: #fff;
}

.cardtomane input::-webkit-input-placeholder {
	color: #fff;
}

.cardtomane input:-ms-input-placeholder {
	color: #fff;
}

.cardtomane input::-ms-input-placeholder {
	color: #fff;
}

.cardtomane input::placeholder {
	color: #fff;
}

.cardcontent {
	margin: 30px 10px 30px 0px;
	color: #fff;
}

@media screen and (min-width: 1025px) {
	.cardtomane input:focus{
		-webkit-box-shadow: 0 0 0 0.2rem #FFEB3B;
				box-shadow: 0 0 0 0.2rem #FFEB3B;
	}
}

@media screen and (max-width: 1000px) {
	.cardcontent {
		padding: 20px 0px;
		margin: 0px;
	}
}

.cardcontent textarea {
	border: 0px;
	padding: 10px;
	font-size: 1rem;
	background-color: #fff;
	width: 100%;
}

@media screen and (min-width: 1025px) {
	.cardcontent textarea:focus{
		-webkit-box-shadow: 0 0 0 0.2rem #000;
				box-shadow: 0 0 0 0.2rem #000;
	}

	.cardtomane textarea:focus::-webkit-input-placeholder,
	.cardtomane textarea:focus:-moz-placeholder,
	.cardtomane textarea:focus::-ms-input-placeholder,
	.cardtomane textarea::placeholder{
		color: #db3b00;
	}
}

.cardfrommane {
	padding: 0px 10px 0px 0px;
	text-align: right;
	color: #fff;
}

.cardfrommane a {
	padding: 0px 10px 4px 10px;
	color: #fff;
	text-decoration: none;
	border-bottom: 1px #ed7811 solid;
}

.cardfrommane input {
	border-bottom: 1px #fff solid;
	padding: 5px;
	font-size: 1rem;
	width: 150px;
	background-color: transparent;
	color: #fff;
}

.cardfrommane input::-webkit-input-placeholder {
	color: #fff;
}

.cardfrommane input:-ms-input-placeholder {
	color: #fff;
}

.cardfrommane input::-ms-input-placeholder {
	color: #fff;
}

.cardfrommane input::placeholder {
	color: #fff;
}

@media screen and (min-width: 1025px) {
	.cardfrommane input:focus{
		-webkit-box-shadow: 0 0 0 0.2rem #FFEB3B;
				box-shadow: 0 0 0 0.2rem #FFEB3B;
	}
}

.cardfrommane .Stamp {
	position: relative;
	display: inline-block;
	vertical-align: bottom;
	background-image: none;
	width: 100px;
	height: 100px;
	padding: 0px;
	top: 0px;
	right: 0px;
}

.cardfrommane .Stamp>img {
	position: absolute;
	width: 100%;
	height: 100%;
	display: block;
	left: 0px;
	top: 0px;
	-o-object-fit: cover;
	object-fit: cover;
}

.cardphotoinfo {
	float: left;
	display: block;
	color: #fff;
	font-size: 1rem;
	padding-top: 10px;
}

.cardphotoinfo h3,
.cardphotoinfo .h3 {
	color: #fff;
}

@media screen and (max-width: 1000px) {
	.cardphotoinfo {
		padding-top: 20px;
	}
}

.mailaddress {
	padding: 20px;
	margin: 20px 0px;
}

.mailaddress label {
	font-size: 1rem;
	line-height: 40px;
}

.mailaddress input[type='text'] {
	width: 300px;
	height: 40px;
	font-size: 1rem;
	display: inline-block;
	vertical-align: top;
	margin-right: 10px;
}

.mailaddress dl {
	padding: 10px 0px;
	font-size: 0rem;
	line-height: 1em;
	margin: auto;
	overflow: hidden;
}

.mailaddress dl dt {
	width: 200px;
	display: inline-block;
	vertical-align: top;
}

.mailaddress dl dd {
	width: calc(100% - 205px);
	display: inline-block;
	vertical-align: top;
}

.mailaddress dl span {
	color: #db3b00;
	font-size: 1rem;
	line-height: 40px;
}

.mailaddress dl.verification img {
	height: 40px !important;
	display: inline-block;
	vertical-align: top;
	margin-right: 10px;
}

.mailaddress dl.verification input[type='text'] {
	width: 200px;
}

.mailaddress dl.verification a {
	font-size: 1rem;
	display: inline-block;
	vertical-align: top;
	padding: 0px 15px;
	border-width: 1px;
	border-color: #020202;
	border-style: solid;
	color: #020202;
	height: 40px;
	line-height: 40px;
	margin: 0px 5px;
}

@media screen and (min-width: 1025px) {

	.mailaddress dl.verification a:hover,
	.mailaddress dl.verification a:focus {
		background-color: #db3b00;
		border-color: #db3b00;
		color: #fff;
	}
}

@media screen and (max-width: 1000px) {
	.mailaddress {
		padding: 0px;
	}

	.mailaddress dl dt {
		display: block;
		float: none;
		width: 100%;
	}

	.mailaddress dl dd {
		display: block;
		float: none;
		width: 100%;
	}

	.mailaddress input[type='text'] {
		width: 100%;
		display: block;
	}

	.mailaddress dl.verification input[type='text'] {
		width: 100%;
		display: block;
		margin-bottom: 10px;
	}
}

@media screen and (max-width: 480px) {
	.mailaddress dl.verification a {
		margin: 5px;
	}

	.mailaddress dl.verification img {
		margin: 5px;
	}
}

.viewcardTitle {
	text-align: center;
	margin-bottom: 50px;
}

.viewcardTitle span {
	font-weight: bold;
	margin: 0px 5px;
}

@media screen and (max-width: 480px) {
	.viewcardTitle {
		margin-bottom: 20px;
	}
}

.step {
	clear: both;
	text-align: center;
	margin: 30px 5px;
}

.step input {
	width: 200px;
	display: inline-block;
	font-size: 1.1rem;
	padding: 10px;
	margin: 0px 10px;
	border: none;
	text-align: center;
	border-width: 1px;
	border-color: #020202;
	border-style: solid;
	color: #020202;
	cursor: pointer;
	line-height: 1em;
	background-color: transparent;
}

@media screen and (min-width: 1025px) {
	.step input:focus{
		outline: none;
		-webkit-box-shadow: 0 0 0 0.2rem rgba(255, 114, 71, 0.5);
				box-shadow: 0 0 0 0.2rem rgba(255, 114, 71, 0.5);
	}

	.step input:hover,
	.step input:focus {
		background-color: #db3b00;
		border-color: #db3b00;
		color: #fff;
	}
}

.step a {
	width: 200px;
	display: inline-block;
	font-size: 1.1rem;
	padding: 10px;
	margin: 0px 10px;
	border: none;
	text-align: center;
	border-width: 1px;
	border-color: #020202;
	border-style: solid;
	color: #020202;
	cursor: pointer;
	line-height: 1em;
}

.content .step a {
	border-bottom-color: #020202;
}

@media screen and (min-width: 1025px) {

	.step a:hover,
	.step a:focus {
		background-color: #db3b00;
		border-color: #db3b00;
		color: #fff;
	}
}

@media screen and (max-width: 480px) {

	.step a,
	.step input {
		width: 100%;
		display: block;
		font-size: 1rem;
		margin: 15px 0px;
	}
}

.status-text {
	text-align: center;
}

.status-text>img {
	display: inline-block;
	max-width: 150px;
}

/* 訂閱電子報 */
.epaper-content {
	overflow: hidden;
	padding-left: 500px;
	margin-bottom: 50px;
	background: url('../../images/ohbear.svg') no-repeat left bottom/contain;
}

@media screen and (max-width: 1200px) {
	.epaper-content {
		padding-left: 0px;
		padding: 0px 20%;
		background: none;
	}
}

@media screen and (max-width: 1024px) {
	.epaper-content {
		padding: 0px 10%;
	}
}

@media screen and (max-width: 767px) {
	.epaper-content {
		padding: 0px;
	}
}

.epaper-title {
	color: #242424;
	font-size: 2.15rem;
	font-weight: bold;
	text-align: center;
	line-height: 1.3em;
	margin: 30px 0px;
}

@media screen and (max-width: 1024px) {
	.epaper-title {
		font-size: 2rem;
	}
}

@media screen and (max-width: 480px) {
	.epaper-title {
		font-size: 1.6rem;
		margin-bottom: 30px;
	}
}

.epaper-content .fieldset {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
	margin: 10px 0px;
}

.epaper-content .fieldset label {
	width: 100%;
	line-height: 35px;
}

.epaper-content .fieldset input[type="text"] {
	width: 300px;
	height: 40px;
	margin-top: 5px;
	margin-bottom: 5px;
	margin-right: 10px;
}

.epaper-content .fieldset .reload-btn,
.epaper-content .fieldset .voice-services-btn {
	font-size: 1rem;
	display: inline-block;
	vertical-align: top;
	padding: 0px 15px;
	border-width: 1px;
	border-color: #020202;
	border-style: solid;
	color: #020202;
	height: 40px;
	line-height: 40px;
	margin-top: 5px;
	margin-bottom: 5px;
	margin-right: 10px;
	background-color: transparent;
	cursor: pointer;
}

@media screen and (min-width: 1025px) {

	.epaper-content .fieldset .reload-btn:hover,
	.epaper-content .fieldset .reload-btn:focus,
	.epaper-content .fieldset .voice-services-btn:hover,
	.epaper-content .fieldset .voice-services-btn:focus {
		border-color: #db3b00;
		background-color: #db3b00;
		color: #fff;
		outline: none;
	}

	.epaper-content .fieldset .reload-btn:focus,
	.epaper-content .fieldset .voice-services-btn:focus {
		-webkit-box-shadow: 0 0 0 0.2rem rgba(255, 114, 71, 0.5);
		box-shadow: 0 0 0 0.2rem rgba(255, 114, 71, 0.5);
	}
}

@media screen and (max-width: 767px) {
	.epaper-content .fieldset input[type="text"] {
		width: 100%;
		margin-right: 0px;
	}
}

.epaper-content .fieldset.verification input[type="text"] {
	width: 180px;
}

.epaper-content .fieldset.verification img {
	height: 40px !important;
	margin-right: 10px;
	margin-top: 5px;
	margin-bottom: 5px;
}

.epaper-content .step {
	text-align: left;
}

@media screen and (max-width: 1024px) {
	.epaper-content .step {
		text-align: center;
	}
}

@media screen and (max-width: 767px) {
	.epaper-content .fieldset.verification input[type="text"] {
		width: 100%;
	}
}

.epaper-table {
	width: 100%;
	margin: 20px 0px 50px;
}

.epaper-table th {
	font-weight: bold;
	padding: 15px 10px;
}

.epaper-table thead {
	border-bottom: 1px #c8c8c8 solid;
}

.epaper-table tbody>tr {
	border-bottom: 1px #DDD solid;
}

.epaper-table tbody>tr:last-child {
	border-bottom: none;
}

.epaper-table td {
	padding: 15px 10px;
}

.epaper-table a {
	display: inline-block;
	width: 36px;
	height: 36px;
	line-height: 30px;
	text-align: center;
	font-size: 1.5rem;
	font-weight: bold;
	cursor: pointer;
	color: #db3b00;
	border-width: 1px;
	border-style: solid;
	border-color: #db3b00;
}

@media screen and (min-width: 1025px) {

	.epaper-table a:hover,
	.epaper-table a:focus {
		background-color: #db3b00;
		color: #fff;
		border-color: #fff;
	}
}

@media screen and (max-width: 1024px) {
	.epaper-table th {
		padding: 10px 5px;
	}

	.epaper-table td {
		padding: 10px 5px;
	}
}

.epaper-table thead>tr th:nth-child(1) {
	width: 60%;
}

.epaper-table thead>tr th:nth-child(2) {
	width: 20%;
}

.epaper-table thead>tr th:nth-child(3) {
	width: 20%;
}

@media screen and (max-width: 1024px) {
	.epaper-table thead>tr th:nth-child(1) {
		width: calc(100% - 250px);
	}

	.epaper-table thead>tr th:nth-child(2) {
		width: 150px;
	}

	.epaper-table thead>tr th:nth-child(3) {
		width: 100px;
	}
}

.epaper-table tbody>tr td:nth-child(2),
.epaper-table tbody>tr td:nth-child(3) {
	text-align: center;
}

@media screen and (max-width: 767px) {

	.epaper-table thead>tr th:nth-child(2),
	.epaper-table tbody>tr td:nth-child(2) {
		display: none;
	}

	.epaper-table thead>tr th:nth-child(3) {
		width: 80px;
	}
}

/* 錯誤頁 */
.error-content {
	max-width: 960px;
	min-height: 272px;
	overflow: hidden;
	padding-left: 250px;
	margin: 30px auto;
	position: relative;
	background: url('../../images/ohbear_2.svg') no-repeat left top/contain;
}

@media screen and (max-width: 1024px) {
	.error-content {
		max-width: 100%;
		padding-left: 0px;
		background: none;
		text-align: center;
		margin: auto;
	}

	.error-content::before {
		content: '';
		display: block;
		width: 200px;
		height: 272px;
		margin: 0px auto 30px;
		background: url('../../images/ohbear_2.svg') no-repeat center/contain;
	}
}

.error-content .error-title {
	font-size: 2rem;
    font-weight: bold;
    text-align: center;
	line-height: 1.3em;
	text-align: left;
	color: #db3b00;
	margin: 30px 0px;
	margin-bottom: 0px;
}

@media screen and (max-width: 1024px) {
	.error-content .error-title {
		text-align: center;
		font-size: 2rem;
	}
}

@media screen and (max-width: 480px) {
	.error-content .error-title {
		font-size: 1.6rem;
	}
}

.error-content .error-subtitle {
	margin-bottom: 30px;
}

.error-content p {
	font-weight: bold;
	font-size: 1.3rem;
	letter-spacing: 0.5px;
	margin-bottom: 10px;
}

.error-content a {
	width: 200px;
	display: inline-block;
	font-size: 1.1rem;
	padding: 10px;
	margin: 30px 10px;
	border: none;
	text-align: center;
	border-width: 1px;
	border-color: #020202;
	border-style: solid;
	background-color: #fff;
	color: #020202;
	cursor: pointer;
	line-height: 1em;
}

.content>.wrap .error-content a {
	border-bottom-color: #020202;
}

@media screen and (min-width: 1025px) {

	.error-content a:hover,
	.error-content a:focus {
		background-color: #db3b00;
		border-color: #db3b00;
		color: #fff;
	}

	.content>.wrap .error-content a:hover,
	.content>.wrap .error-content a:focus {
		border-bottom-color: #db3b00;
	}
}

@media screen and (max-width: 480px) {
	.error-content .error-subtitle {
		margin-bottom: 20px;
	}

	.error-content p {
		font-size: 1rem;
	}

	.error-content a {
		width: 100%;
		display: block;
		margin: 20px 0px;
		padding: 15px 10px;
		font-size: 1rem;
	}
}

.error-content .color-orange {
	color: #bd3f11;
}

.error-model {
	padding: 0px 15px;
	position: relative;
	background-color: #f0ede5;
}

.error-model form {
	padding: 0px;
}

.error-model .error-content {
	margin: 200px auto;
}

@media screen and (max-width: 480px) {
	.error-model .error-content {
		margin: 30px auto;
	}
}

/* 網站導覽 */
/* 這是沿用舊網站架構的 */
ul.site {
	overflow: hidden;
	list-style: none;
	padding-left: 0px;
	margin: 30px 0px;
}

.site a {
	position: relative;
	color: #303030;
	text-decoration: none;
	-o-transition: all .20s linear;
	-webkit-transition: all .20s linear;
	transition: all .20s linear;
	display: inline-block;
}

.site ul {
	list-style: none;
	padding-left: 0px;
	margin-bottom: 0px;
}

@media screen and (min-width: 1025px) {

	.site ul li a:hover,
	.site ul li a:focus {
		color: #db3b00;
	}
}

.site .box {
	display: inline-block;
	vertical-align: top;
	width: 250px;
	margin: 0px 10px 30px;
	-webkit-box-shadow: 1px 1px 3px rgba(0%, 0%, 0%, 0.2);
	box-shadow: 1px 1px 3px rgba(0%, 0%, 0%, 0.2);
}

@media screen and (max-width: 1024px) {
	.site .box {
		width: 100%;
		margin: 0px 0px 20px;
	}
}

.site .box>a,
.site .box h3>a {
	display: block;
	background-color: #db3b00;
	color: #FFF;
	padding: 10px 20px;
	font-size: 1.125rem;
}

@media screen and (min-width: 1025px) {
	.site .box>a:hover,
	.site .box h3>a:hover,
	.site .box>a:focus,
	.site .box h3>a:focus {
		background-color: #e06827;
	}
}

.site .box>a span,
.site .box h3>a span {
	color: #fff;
}

.site .box>ul {
	background-color: #fff;
}

.site .box>ul>li {
	padding: 5px 20px;
}

.site .box>ul>li:first-child {
	padding-top: 10px;
}

.site .box>ul>li:last-child {
	padding-bottom: 10px;
}

/* 區塊 */
.blk-zone {
	border-top: 1px #c8c8c8 solid;
	padding-top: 15px;
}

/* RSS專區 */
.rssList {
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	display: block;
	width: 100%;
	margin: 30px auto 60px auto;
	text-align: center;
}

.rssList li {
	display: inline-block;
	vertical-align: top;
}

.rssList li a {
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	display: inline-block;
	overflow: hidden;
	width: 160px;
	margin: 0px 20px 0px 50px;
	padding: 160px 0px 0px 0px;
	color: #e87536;
	font-weight: bolder;
	text-decoration: none;
	font-size: 1.3rem;
	text-align: center;
	border: 0px #FF6600 solid;
	background-image: url('../../images/rssBtn1.svg');
	background-position: left top;
	background-repeat: no-repeat;
	background-size: contain;
}

@media screen and (min-width: 1025px) {
	.rssList li a:hover,
	.rssList li a:focus {
		background-image: url('../../images/rssBtn1Click.svg');
	}
}

@media screen and (max-width: 1000px) {
	.rssList li a {
		width: 150px;
		margin: 0px 30px 0px 30px;
		padding: 150px 0px 0px 0px;
		color: #e87536;
		text-decoration: none;
		font-size: 1.2rem;
	}
}

@media screen and (max-width: 480px) {
	.rssList li a {
		width: 130px;
		margin: 0px 10px 0px 10px;
		padding: 150px 0px 0px 0px;
		color: #e87536;
		text-decoration: none;
		font-size: 1.2rem;
	}
}

/*內頁插圖設定(交通資訊)(有邊框) */
.trafficPhoto {
	display: block;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	width: 100%;
	text-align: center;
}

ul.trafficPhoto {
	padding-left: 0px;
}

.trafficPhoto a {
	border-bottom: 0px #FF6600 solid !important;
	display: block;
}

.trafficPhoto li {
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	display: inline-block;
	margin: 15px 30px 15px 30px;
	text-align: center;
	width: 42%;
	vertical-align: top;
	text-align: center;
}

.trafficPhoto .trafficPhotoTexeLeft {
	text-align: left;
}

.trafficPhoto li img {
	border: 2px #ffffff solid;
	width: 97%;
	height: auto;
}

.trafficPhoto li p {
	margin: 0px 0px 0px 0px;
	padding: 6px 0px 8px 0px;
}

@media screen and (max-width: 1000px) {
	.trafficPhoto li {
		display: inline-block;
		margin: 0px 0px 0px 0px;
		padding: 20px;
		text-align: center;
		width: 100%;
	}
}

/*內頁插圖設定(交通資訊)(無邊框) */
.trafficPhotoNo {
	display: block;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	width: 100%;
	text-align: center;
}

.trafficPhotoNo li {
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	display: inline-block;
	margin: 15px 30px 15px 30px;
	text-align: center;
	width: 43%;
	vertical-align: top;
	text-align: center;
}

.trafficPhotoNo .trafficPhotoTexeLeft {
	text-align: left;
}

.trafficPhotoNo li img {
	border: 0px #ffffff solid;
	width: 95%;
	height: auto;
}

.trafficPhotoNo li p {
	margin: 0px 0px 0px 0px;
	padding: 6px 0px 8px 0px;
}

@media screen and (max-width: 1000px) {
	.trafficPhotoNo li {
		display: inline-block;
		margin: 0px 0px 0px 0px;
		padding: 20px;
		text-align: center;
		width: 100%;
	}
}

.trafficPhoto2 {
	display: block;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	width: 100%;
	text-align: center;
}

.trafficPhoto2 li {
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	display: inline-block;
	margin: 15px 10px 15px 10px;
	text-align: center;
	width: 21%;
	vertical-align: top;
	text-align: center;
}

.trafficPhoto2 .trafficPhotoTexeLeft {
	text-align: left;
}

.trafficPhoto2 li img {
	border: 4px #ffffff solid;
	width: 95%;
	height: auto;
}

.trafficPhoto2 li p {
	margin: 0px 0px 0px 0px;
	padding: 6px 0px 8px 0px;
}

@media screen and (max-width: 1000px) {
	.trafficPhoto2 li {
		display: inline-block;
		margin: 0px 0px 0px 0px;
		padding: 20px;
		text-align: center;
		width: 100%;
	}
}

/*內頁插圖*/
img.photo_sm_right {
	float: right;
	width: 40%;
	padding-left: 30px;
	padding-bottom: 30px;
}

img.photo_sm_left {
	float: left;
	padding-right: 30px;
	padding-bottom: 30px;
}

@media screen and (max-width: 1000px) {
	img.photo_sm_right {
		width: 100%;
		height: auto;
		padding-left: 0px;
		padding-bottom: 15px;
	}

	img.photo_sm_left {
		width: 100%;
		height: auto;
		padding-right: 0px;
		padding-bottom: 15px;
	}
}

/*美食天堂插圖-*/
.foodphotoListNolink {
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	display: block;
	overflow: hidden;
	width: 100%;
	margin: 0px 0px 0px 0px;
	text-align: center;
}

.foodphotoListNolink li {
	display: inline-block;
	vertical-align: top;
	width: 190px;
	margin: 20px 40px 20px 40px;
	line-height: 1.3em;
	font-size: 1.2rem;
	text-align: center;
}

.foodphotoListNolink li a {
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	display: block;
	overflow: hidden;
	width: 200px;
	height: 200px;
	padding: 0px 0px 0px 0px;
	margin: 0px 0px 15px 0px;
	color: #3d3d3d;
	text-decoration: none;
	font-size: 100%;
	text-align: center;
	border-radius: 50%;
	border: 4px solid rgba(206, 206, 206, 0.5);
}

.foodphotoListNolink li a:hover {
	border: 4px solid rgba(255, 255, 255, 0.5);
}

.foodphotoListNolink li img {
	width: 100%;
	height: 100%;
	vertical-align: middle;
}

.foodphotoListNolink li span {
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	display: block;
	overflow: hidden;
	width: 200px;
	height: 200px;
	padding: 0px 0px 0px 0px;
	margin: 0px 0px 15px 0px;
	color: #3d3d3d;
	text-decoration: none;
	font-size: 100%;
	text-align: center;
	border-radius: 50%;
	border: 4px solid rgba(206, 206, 206, 0.5);
}

@media screen and (max-width: 1000px) {
	.foodphotoListNolink li {
		margin: 20px 15px 20px 15px;
	}
}

@media screen and (max-width: 500px) {
	.foodphotoListNolink {
		-webkit-box-sizing: border-box;
		box-sizing: border-box;
		display: block;
		overflow: hidden;
		width: 100%;
		margin: 0px 0px 0px 0px;
		text-align: center;
	}

	.foodphotoListNolink li {
		display: inline-block;
		-webkit-box-sizing: border-box;
		box-sizing: border-box;
		vertical-align: top;
		width: 49%;
		margin: 20px 0px 16px 0px;
		padding: 0px 10px 0px 10px;
		line-height: 1.3em;
	}

	.foodphotoListNolink li a {
		-webkit-box-sizing: border-box;
		box-sizing: border-box;
		display: block;
		overflow: hidden;
		height: auto;
		width: 100%;
		padding: 0px 0px 0px 0px;
		margin: 0px 0px 15px 0px;
		color: #3d3d3d;
		text-decoration: none;
		text-align: center;
	}

	.foodphotoListNolink li span {
		-webkit-box-sizing: border-box;
		box-sizing: border-box;
		display: block;
		overflow: hidden;
		height: auto;
		width: 100%;
		padding: 0px 0px 0px 0px;
		margin: 0px 0px 15px 0px;
		color: #3d3d3d;
		text-decoration: none;
		text-align: center;
	}
}

.note {
	font-size: 1rem;
	padding: 0px 0px 10px 0px;
/*	color: #F60;*/
	color: #c53e00;
}

/* 旅客服務中心的地圖 */
.mapview {
	position: relative;
	overflow: hidden;
}

.mapview .mapview-box {
	width: 560px;
	height: calc(100vh - 100px);
	background-color: #000;
	position: absolute;
	opacity: 0;
	-webkit-transition: opacity 0.3s;
	-o-transition: opacity 0.3s;
	transition: opacity 0.3s;
}

.mapview .mapview-box>div {
	width: 100%;
	height: 100%;
}

.mapview .mapview-box.is-fixed {
	position: fixed;
	top: 80px;
}

.mapview .mapview-box.set-bottom {
	bottom: 0px;
}

.no-js .mapview .mapview-box {
	display: none;
}

.no-js .mapview .mapview-list {
	width: 100%;
	float: none;
}

.mapview .mapview-bottom {
	clear: both;
}

.mapview .mapview-list {
	width: calc(100% - 560px);
	min-height: 100vh;
	float: right;
	padding-left: 30px;
}

.mapview .mapview-item {
	border-bottom: 1px #c8c8c8 solid;
}

.mapview .mapview-item-content {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	padding: 15px 10px;
}

.mapview figure {
	width: 40%;
	height: 0px;
	padding-bottom: 27%;
	position: relative;
	overflow: hidden;
}

.mapview figure>img {
	width: 100%;
	height: 100%;
	display: block;
	position: absolute;
	left: 0px;
	top: 0px;
	-o-object-fit: cover;
	object-fit: cover;
}

.mapview .mapview-title {
	display: block;
	color: #000;
	font-size: 1.3rem;
	font-weight: bold;
	line-height: 30px;
	margin-top: 10px;
	margin-bottom: 5px;
}

.mapview .mapview-item-info {
	width: 60%;
	padding-left: 20px;
}

.mapview .mapview-item-info p {
	margin-bottom: 5px;
}

.mapview .mapview-item-map {
	display: none;
	padding: 15px 10px;
}

.mapview .mapview-item-map .iframebox {
	width: 100%;
	height: 0px;
	padding-bottom: 67%;
	position: relative;
	overflow: hidden;
}

.mapview .mapview-item-map .iframebox>iframe {
	width: 100%;
	height: 100%;
	position: absolute;
	left: 0px;
	top: 0px;
	display: block;
}

.mapview .mapview-map-btn {
	display: inline-block;
	color: #fff;
	background-color: #db3b00;
	padding: 5px 20px;
	line-height: 1em;
}

.mapview .mapview-item.current {
	background-color: #db3b00;
}

.mapview .mapview-item.current .mapview-title>a {
	color: #fff;
}

.mapview .mapview-item.current .mapview-item-info p {
	color: #fff;
}

.mapview .mapview-item.current .mapview-map-btn {
	background-color: #e06827;
}

@media screen and (max-width: 1024px) {
	.mapview .mapview-box {
		display: none;
	}

	.mapview .mapview-list {
		width: 100%;
		min-height: auto;
		padding-left: 0px;
		float: none;
	}

	.mapview figure {
		width: 100%;
		height: 0px;
		padding-bottom: 67%;
	}
}

@media screen and (max-width: 480px) {
	.mapview .mapview-item-content {
		display: block;
		padding: 15px 0px;
	}

	.mapview .mapview-item-info {
		width: 100%;
		padding-left: 0px;
	}

	.mapview .mapview-title {
		margin-top: 10px;
		margin-bottom: 10px;
	}

	.mapview .mapview-map-btn {
		display: block;
		padding: 15px 20px;
		text-align: center;
	}

	.mapview .mapview-item-map {
		padding: 15px 0px;
	}
}

/* 相關連結 */
ul.otherLinkBannerList2a {
	overflow: hidden;
	list-style: none;
	font-size: 0rem;
}

.otherLinkBannerList2a>li {
	display: inline-block;
	margin: 5px;
}

.otherLinkBannerList2a>li>a {
	display: block;
}

.otherLinkBannerList2a>li>a>img {
	display: block;
}

/* 旅行社 */
/* 這是沿用舊網站架構的 */
ul.hotelList {
	list-style: none;
	padding-left: 0px;
	margin-bottom: 0px;
}

.hotelList .subhotelList {
	list-style: none;
	padding-left: 0px;
	margin-bottom: 0px;
	overflow: hidden;
}

.hotelList .subhotelList>li {
	float: left;
	padding: 15px 5px;
}

.hotelList .subhotelList>li:nth-child(1) {
	width: 25%;
}

.hotelList .subhotelList>li:nth-child(2) {
	width: 15%;
}

.hotelList .subhotelList>li:nth-child(3) {
	width: 15%;
}

.hotelList .subhotelList>li:nth-child(4) {
	width: 30%;
}

.hotelList .subhotelList>li:nth-child(5) {
	width: 15%;
}

.hotelList>li {
	border-bottom: 1px #e0e0e0 solid;
}

.hotelList>li:last-child {
	border-bottom: none;
}

.hotelList>li:first-child .subhotelList>li {
	font-weight: bold;
}

.hotelList>li a {
	display: block;
}

.hotelList>li a .subhotelList {
	font-size: 1.15rem;
}

.hotelList>li .tourDl {
	color: #2098c0;
	background: #e6f9ff;
	border: 1px #b3e4f5 solid;
	padding: 15px;
}

.hotelList>li .tourDl dl a {
	font-size: 100%;
}

.hotelList>li .tourDl dt {
	font-weight: bold;
}

.hotelSearch {
	width: 100%;
	/* max-width: 1200px; */
	/* height: 145px; */
	overflow: hidden;
	margin: 15px auto;
	border: 1px #c8c8c8 solid;
	border-radius: 0px;
}

.hotelSearch .tourSearchLeft {
	width: 200px;
	height: 100%;
	display: none;
	overflow: hidden;
	float: left;
	padding-top: 90px;
	background-image: url('../../images/icon/tourBg.svg');
	background-repeat: no-repeat;
	background-position: top center;
	background-size: 80%;
	background-color: #e87536;
	color: #FFF;
	text-align: center;
	font-size: 1.8rem;
}

.hotelSearch .hotelSearchRight {
	width: calc(100% - 0px);
	position: relative;
	display: block;
	overflow: hidden;
	float: left;
	padding: 15px;
	text-align: center;
}

.hotelSearch .hotelSearchRight .searchList {
	width: auto;
	list-style: none;
	padding-left: 0px;
	margin-bottom: 0px;
	display: inline-block;
	vertical-align: middle;
}

.hotelSearch .hotelSearchRight .searchList>li {
	display: inline-block;
	margin: 10px;
}

.hotelSearch .hotelSearchRight .searchList>li input[type='text'] {
	display: inline-block;
	vertical-align: top;
	border-width: 1px;
	border-color: rgba(200, 200, 200, 0.5);
	border-style: solid;
	color: #000;
	padding: 5px 10px;
}

.hotelSearch .hotelSearchRight .hotelsearchGo {
	display: inline-block;
	vertical-align: middle;
}

.hotelSearch .hotelSearchRight .hotelsearchGo input {
	display: block;
	width: 50px;
	height: 36px;
	background-image: url('../../images/icon/search_w.svg');
	background-position: center;
	background-repeat: no-repeat;
	background-size: 45%;
	background-color: #e87536;
	text-indent: -9999px;
	border-radius: 0px;
	border: none;
	padding: 0px;
	margin: 0px;
}

@media screen and (min-width: 1025px) {
	.hotelList>li a:hover,
	.hotelList>li a:focus {
		background-color: #4ab6da;
	}

	.hotelList>li a:hover .subhotelList>li,
	.hotelList>li a:focus .subhotelList>li {
		color: #FFF;
	}
}

@media screen and (max-width: 1024px) {
	.hotelSearch {
		height: auto;
		border-radius: 10px;
	}

	.hotelSearch .hotelSearchRight {
		width: 100%;
		height: auto;
		display: block;
		float: none;
		text-align: left;
	}

	.hotelSearch .hotelSearchRight .searchList {
		width: 100%;
		display: block;
	}

	.hotelSearch .hotelSearchRight .searchList>li {
		width: 100%;
		display: block;
		margin: 0px;
	}

	.hotelSearch .hotelSearchRight .searchList>li label,
	.hotelSearch .hotelSearchRight .searchList>li select,
	.hotelSearch .hotelSearchRight .searchList>li input {
		width: 100%;
		height: 40px;
		display: block;
		color: #000;
		font-size: 1rem;
	}

	.hotelSearch .hotelSearchRight .searchList>li label {
		line-height: 40px;
	}

	.hotelSearch .hotelSearchRight .searchList>li select+input {
		margin: 10px 0px;
	}

	.hotelSearch .hotelSearchRight .hotelsearchGo {
		width: 100%;
		display: block;
	}

	.hotelSearch .hotelSearchRight .hotelsearchGo input {
		width: 100%;
		height: 40px;
		text-indent: 0px;
		text-align: center;
		background-image: none;
		font-size: 1.15rem;
		line-height: 40px;
		color: #ffffff;
	}

	.hotelList>li:first-child {
		display: none;
	}

	.hotelList .subhotelList>li {
		padding: 5px 10px;
	}

	.hotelList .subhotelList>li:nth-child(1),
	.hotelList .subhotelList>li:nth-child(2),
	.hotelList .subhotelList>li:nth-child(3),
	.hotelList .subhotelList>li:nth-child(4),
	.hotelList .subhotelList>li:nth-child(5) {
		width: 100%;
		float: none;
	}

	.hotelList .subhotelList>li:nth-child(1) {
		color: #F60;
		font-size: 1.2rem;
	}

	.hotelList .subhotelList>li:nth-child(2) {
		display: none;
	}

	.hotelList>li .tourDl {
		display: block;
	}
}

@media screen and (max-width: 767px) {

	.hotelList .subhotelList>li {
		padding: 5px 0px;
	}
}

@media screen and (max-width: 480px) {
	.hotelSearch .hotelSearchRight .searchList {
		font-size: 1rem;
	}

	.hotelList>li a .subhotelList {
		font-size: 1rem;
	}

	.hotelList .subhotelList>li:nth-child(1) {
		font-size: 1rem;
	}

	.hotelList>li .tourDl {
		padding: 10px;
	}
}

/* 2017 清明疏運*/
ol.road2017_list {
	padding: 0px;
}

.road2017_list li {
	list-style-type: none;
	display: inline-block;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	width: 32%;
	padding: 0px 10px 8px 30px;
	background: url(../../../resources/images/arrow2.svg) top left no-repeat;
	background-size: 7%;
	margin: 6px 0px 6px 0px;
	vertical-align: top;
}

.road2017_list>li {
	color: #688020;
}

.road2017_list li a {
	color: #e87536;
	text-decoration: none;
	border-bottom: 1px #e87536 solid;
	font-size: 110%;
	padding: 0px;
}

@media screen and (max-width: 1000px) {
	.road2017_list li {
		display: inline-block;
		padding: 0px 0px 10px 25px;
		width: 100%;
	}
}

/* 2017 清明疏運 end*/
/*------春節疏運------*/
.holidayList>ul {
	padding-left: 0px;
}

.holidayList>li {
	padding: 15px 0px 20px 0px;
	font-size: 110%;
	color: #020202;
}

.holidayList>li a {
	border-bottom: 1px #e87536 solid;
}

.holidayList>li>ul>li {
	display: inline-block;
	font-size: 100%;
	padding: 10px 0px 10px 0px;
	width: 37%;
	vertical-align: top;
	list-style-position: outside;
}

.holidayTitle {
	font-size: 100%;
	padding: 8px 0px 8px 0px;
	color: #000;
	font-weight: bolder;
}

@media screen and (max-width: 1000px) {
	.holidayList>li>ul>li {
		display: block;
		width: 95%;
	}
}

.winClose1 {
	text-align: right;
	padding: 0px 0px 10px 0px;
}

.winClose1 a {
	color: #e87536;
	border-bottom: 1px #e87536 solid;
}

.winClose1 a:hover {
	color: #F90;
	border-bottom: 1px #F90 solid;
}

.NumberofVisitors {
	text-align: right;
	color: #C60;
}

/*------春節疏運 end------*/
.survey_content {
	margin-bottom: 10px;
}

/* 首長信箱 */
.contactBox {
	width: 100%;
	max-width: 1024px;
	margin: auto;
	padding: 30px;
	border: 1px #e5e5e5 solid;
}

.contactBox dl {
	width: 100%;
}

.contactBox dl dt {
	width: 270px;
	display: inline-block;
	vertical-align: top;
	padding: 5px 10px;
	text-align: right;
}

.contactBox dl dd {
	width: calc(100% - 280px);
	display: inline-block;
	vertical-align: top;
	padding: 5px 10px;
}

.contactBox dl dd #imgRnd,
.contactBox dl dd input[type='text'] {
	display: inline-block;
	vertical-align: top;
}

.contactBox dl dd .btnist {
	padding: 10px 0px;
}

.contactBox dl dd .reload-btn,
.contactBox dl dd .voice-services-btn,
.contactBox .marker .marker2>a {
	display: inline-block;
	vertical-align: top;
	background-color: #db3b00;
	color: #fff;
	padding: 3px 15px;
}

@media screen and (min-width: 1025px) {

	.contactBox dl dd .reload-btn:hover,
	.contactBox dl dd .voice-services-btn:hover,
	.contactBox .marker .marker2>a:hover,
	.contactBox dl dd .reload-btn:focus,
	.contactBox dl dd .voice-services-btn:focus,
	.contactBox .marker .marker2>a:focus {
		background-color: #e06827;
	}
}

@media screen and (max-width: 767px) {
	.contactBox {
		border: none;
		padding: 0px;
	}

	.contactBox dl dt,
	.contactBox dl dd {
		width: 100%;
		display: block;
		text-align: left;
		padding: 5px 0px;
	}

	.contactBox textarea,
	.contactBox input[type='text'] {
		width: 100%;
		display: block;
	}
}

@media screen and (max-width: 480px) {

	.contactBox dl dd .reload-btn,
	.contactBox dl dd .voice-services-btn,
	.contactBox .marker .marker2>a {
		display: block;
		margin: 15px 0px;
		padding: 10px;
		line-height: 1em;
		text-align: center;
	}
}

.contactBox .marker ul {
	padding-left: 25px;
}

.contactBox .marker span.marker2 {
	display: block;
	text-align: center;
}

.contactBox .color1 {
	color: #f00;
}

.contactBox textarea {
	border: none;
	padding: 5px;
	background-color: #e5e5e5;
	font-size: 0.9rem;
}