/*------------------------------------------ 
字型基礎設定
--------------------------------------------*/ :root {
		--font-family-base: 'Public Sans', 'Noto Sans TC', '微軟正黑體', 'Microsoft JhengHei', Verdana, Helvetica, Arial, 'HeitiTC', 'Microsoft YaHei', sans-serif;
		--font-family-noto: 'Public Sans', 'Noto Sans TC', '微軟正黑體', 'Microsoft JhengHei', Verdana, Helvetica, Arial, 'HeitiTC', 'Microsoft YaHei', sans-serif;
		--font-32: 2rem;
		--font-28: 1.75rem;
		--font-24: 1.5rem;
		--font-20: 1.25rem;
		--font-18: 1.125rem;
		--font-16: 1rem;
		--font-14: .875rem;
		--font-12: .75rem;
}
body, h1, h2, h3, h4, h5, h6 {
		font-family: var(--font-family-base);
}
body {
		line-height: 1.75;
		font-size: var(--font-16);
		font-optical-sizing: auto;
		font-style: normal;
}
h1 {
		font-size: 4.125vw;
}
h2, h1.h2 {
		font-size: 2.85vw;
}
h3, h2.h3 {
		font-size: 2.35vw;
}
h3 small, h2.h3 small {
		font-size: 65%;
}
.kv-subtitle {
		font-size: 2.25vw;
}
.section .card-item .info h4 {
		font-size: 1.25vw;
		line-height: 1.5;
		text-wrap: nowrap;
}
.text-large {
		font-size: 150%;
		line-height: 0;
}
h4 {
		font-size: 1.35vw;
}
.font-18-rwd {
		font-size: 1.125vw;
}
.btn-more {
		font-size: 1.35vw;
}
.btn-enter.sp i {
		font-size: 140%;
		line-height: 1;
}
.btn-enter.sp {
		font-size: 1.25rem;
}
.ls-5 {
		letter-spacing: 1rem;
}
.ls-4 {
		letter-spacing: .75rem;
}
.ls-3 {
		letter-spacing: .5rem;
}
.ls-2 {
		letter-spacing: .25rem;
}
.ls-1 {
		letter-spacing: .125rem;
}
.lh-15 {
		line-height: 1.5;
}
/*------------------------------------------ 
Section 
--------------------------------------------*/
.section.kv .post, .section.kv .point-list {
		font-size: 1.325vw;
		line-height: 1.5;
}
@media (min-width: 1600px) {
		/* Basic*/
		h1 {
				font-size: 4.25rem;
		}
		h2, h1.h2 {
				font-size: 3rem;
		}
		h3, h2.h3 {
				font-size: 2.5rem;
		}
		h3 small {
				font-size: 1.75rem;
		}
		.kv-subtitle {
				font-size: 2.125rem;
		}
		h4 {
				font-size: 1.5rem;
		}
		.ls-5 {
				letter-spacing: 1rem;
		}
		.ls-4 {
				letter-spacing: .75rem;
		}
		.ls-3 {
				letter-spacing: .5rem;
		}
		.ls-2 {
				letter-spacing: .25rem;
		}
		.ls-1 {
				letter-spacing: .125rem;
		}
		.font-18-rwd {
				font-size: var(--font-18);
		}
		/* Btn More */
		.btn-more {
				font-size: var(--font-18);
				letter-spacing: .125rem;
		}
		.section .card-item .info h4 {
				font-size: 1.125rem;
		}
		.section.kv .post, .section.kv .point-list {
				font-size: var(--font-16);
				line-height: 1.5;
		}
		.mtr-card .info {
				font-size: 1rem;
		}
		.section.mtr h4 {
				font-size: var(--font-22);
				line-height: 1.5;
		}
}
h1.h2.ls-3, h2.ls-3 {
		padding-left: .5rem;
}
h3.ls-4, h2.ls-4, h2.ls-4, h1.h2.ls-4 {
		padding-left: .75rem;
}
h1.h2.ls-4 {
		padding-left: 1rem;
}
@media (min-width: 1600px) {
		h3 small, h2.h3 small {
				font-size: 70%;
		}
}
/*------------------------------------------ 
Main NAV
--------------------------------------------*/
.mainnav .navbar-nav .nav-link {
		font-size: 1rem;
		font-weight: 500;
}
@media (min-width: 1200px) {
		.mainnav .navbar-nav .nav-link {
				font-size: 1.125rem;
		}
}
/*------------------------------------------ 
Font Size
--------------------------------------------*/
.font-32 {
		font-size: var(--font-32);
}
.font-28 {
		font-size: var(--font-28);
}
.font-24 {
		font-size: var(--font-24);
}
.font-20 {
		font-size: var(--font-20);
}
.font-18 {
		font-size: var(--font-18);
}
.font-16 {
		font-size: var(--font-16);
}
.font-15 {
		font-size: var(--font-15);
}
.font-14 {
		font-size: var(--font-14);
}
.font-12 {
		font-size: var(--font-12);
}
/*------------------------------------------ 
Text Align
--------------------------------------------*/
.text-justify {
		text-align: justify;
		word-break: break-all;
}
/*------------------------------------------ 
Val Block
--------------------------------------------*/
.val-block {
		font-size: var(--font-14);
		font-family: var(--font-family-noto);
}
/*------------------------------------------ 
Gift
--------------------------------------------*/
.section.gift .info p {
		text-align: start;
		line-height: 2;
}
/*------------------------------------------ 
MTR
--------------------------------------------*/
.mtr-block.has-slider .slick-next::before, .mtr-block.has-slider .slick-prev::before {
		font-family: bootstrap-icons !important;
		font-size: 2rem;
		font-weight: bold;
}
.mtr-block.has-slider .slick-prev::before {
		content: '\F12C';
}
.mtr-block.has-slider .slick-next::before {
		content: '\F135';
}
.mtr-block.has-slider .slick-dots li button:before {
		font-family: bootstrap-icons !important;
		font-size: 1.25rem;
		content: '\F519';
}
.mtr-note .card-body a {
		text-decoration: underline
}
.mtr-note .card-body ol {
		font-size: 1.125rem;
}
.section.mileage .card-right > div p, .section.mileage .card-left > div p {
		font-size: var(--font-12);
}
/*------------------------------------------ 
Footer
--------------------------------------------*/
.alart-slogan {
		font-size: var(--font-16);
}
footer {
		font-size: var(--font-12);
}
/* X-Large devices (large desktops, 1200px and up) */
@media (min-width: 1600px) {
		.section.mileage .card-right > div p, .section.mileage .card-left > div p {
				font-size: .875rem;
		}
}
@media (min-width: 1366px) {}
@media (min-width: 1440px) {
		.mainnav .navbar-nav .nav-link {
				font-size: 1.125rem;
		}
		.section.mileage .card-right > div p, .section.mileage .card-left > div p {
				font-size: 1rem;
		}
}
@media (min-width: 1200px) {
		.mainnav .navbar-nav .nav-link {
				font-family: 'Public Sans', 'Noto Sans TC';
				font-size: 1rem;
		}
}
@media (max-width: 1199px) {
	.section.offer {
		font-size: var(--font-12);
}
		.mainnav .navbar-nav .nav-link {
				font-size: .9rem;
		}
		.modal-mtr .modal-body .font-28 {
				font-size: var(--font-24);
		}
		.mtr-card .card-body {
				font-size: var(--font-14);
		}
		.mtr-card .card-body h3 small {
				font-size: 65%;
		}
		.kv-subtitle {
				font-size: 1.75rem;
		}
		.font-24 {
				font-size: var(--font-20);
		}
		h1 {
				font-size: 5vw;
		}
		h2, h1.h2 {
				font-size: 4.125vw;
		}
		h3, h2.h3 {
				font-size: 3.125vw;
		}
		h4 {
				font-size: 2vw;
		}
		.font-18-rwd {
				font-size: var(--font-16);
		}
		.btn-more {
				font-size: var(--font-16);
				line-height: 2;
		}
		.btn-enter {
				font-size: var(--font-14);
		}
		.ls-5 {
				letter-spacing: .25rem;
		}
		.ls-1, .ls-2, .ls-3, .ls-4 {
				letter-spacing: normal;
		}
		.mainnav .navbar-nav .nav-link {
				font-size: .8125rem;
		}
		.section .card-item .info h4 {
				font-size: .95rem;
				line-height: 1.5;
		}
		table th {
				white-space: nowrap;
		}
}
@media (max-width: 991px) {
	.section.offer .info,
	.section.mileage .card-right > div p, .section.mileage .card-left > div p {
		font-size: var(--font-12);
}
		.section.kv .post, .section.kv .point-list {
				font-size: 1rem;
		}
		.mtr-note .card-body ol {
				font-size: 1rem;
		}
		.modal-detail.modal-mtr .modal-header .modal-title.font-28 {
				font-size: var(--font-20);
		}
		.modal-mtr .modal-body .font-28 {
				font-size: var(--font-20);
		}
		.modal-mtr .modal-body .font-24 {
				font-size: var(--font-18);
		}
		.section.mtr .container.has-top p.font-16 {
				font-size: var(--font-14);
		}
		h2, h1.h2 {
				font-size: 2.125rem;
		}
		h3, h2.h3 {
				font-size: 2rem;
		}
		.kv-subtitle {
				font-size: 1.75rem;
		}
		h4 {
				font-size: 2.5vw;
		}
		.mainnav .navbar-nav .nav-link {
				font-size: 1.125rem;
		}
		.font-18-rwd {
				font-size: var(--font-14);
		}
		.font-18-rwd.ch2 {
				font-size: var(--font-12);
		}
		.alart-slogan {
				font-size: var(--font-14);
		}
		.section.kv .post, .section.kv .point-list {
				font-size: .8125rem;
		}
		.section.mileage .card-right > div h3, .section.mileage .card-left > div h3 {
				font-size: 1.75rem;
		}
		.section .card-item .info h4 {
				font-size: 1rem;
				line-height: 1.5;
		}

}
@media (max-width: 991.98px) and (orientation:landscape) {
		.section.kv .post, .section.kv .point-list {
				font-size: .95rem;
		}
		h2, h1.h2 {
				font-size: 2.125rem;
		}
		h3, h2.h3 {
				font-size: 2rem;
		}
		.kv-subtitle {
				font-size: 1.75rem;
		}
	.section.offer .info, 
		.section.mileage .card-right > div p, .section.mileage .card-left > div p {
				font-size: .75rem;
		}
}
@media (max-width: 767.98px) and (orientation:landscape) {
		.mtr-card .card-body {
				font-size: var(--font-12);
		}
		.mtr-block.has-slider .slick-next::before, .mtr-block.has-slider .slick-prev::before {
				font-size: 1.75rem;
		}
		.mtr-block.has-slider .slick-dots li button:before {
				font-size: 1.125rem;
		}
		.mtr-note .card-body ol {
				font-size: 1rem;
		}
		.mtr-card .card-body h3 {
				font-size: 1.75rem;
		}
		.btn-enter {
				font-size: var(--font-14);
		}
		h2, h1.h2 {
				font-size: 2rem;
		}
		h3, h2.h3 {
				font-size: 1.5rem;
		}
		.kv-subtitle {
				font-size: 1.5rem;
		}
		.btn-more {
				font-size: var(--font-14);
				line-height: 1.75;
		}
		.section .card-item .info h4 {
				font-size: .8125rem;
		}
		.section.kv .post{
		font-size: .8125rem;
	}
}
@media (max-width: 575.98px) {
		h2, h1.h2 {
				font-size: 1.75rem;
		}
		h3, h2.h3 {
				font-size: 1.5rem;
		}
		h4 {
				font-size: 1rem;
				line-height: 1.5
		}
		h4.ch {
				font-size: 4vw;
				line-height: 1.5
		}
	 h4.font-28 {
    font-size: 1.25rem;
}
		.kv-subtitle {
				font-size: 1.25rem;
		}
		.section .card-item .info h4 {
				text-wrap: wrap;
		}
	.section.offer .info, 
		.section.mileage .card-right > div p, .section.mileage .card-left > div p {
				font-size: var(--font-12);
				line-height: 1.5
		}
		.mainnav .navbar-nav .nav-link {
				font-size: 1rem;
		}
		.btn-more {
				font-size: 13px;
		}
		.section.kv .post, .section.kv .point-list {
				font-size: var(--font-14);
				font-weight: bold;
		}
		.section .card-item .info h4 {
				font-size: var(--font-14);
		}
		.font-18-rwd.ch {
				font-size: var(--font-18);
		}
		.font-18-rwd.ch2 {
				font-size: var(--font-14);
		}
		.mtr-block.has-slider .slick-next::before, .mtr-block.has-slider .slick-prev::before {
				font-size: 1.75rem;
		}
		.mtr-block.has-slider .slick-dots li button:before {
				font-size: 1.125rem;
		}
		.mtr-card .card-body h3 small {
				font-size: 90%;
		}
		.section.mtr .container.has-top h4 {
				font-size: var(--font-16);
				text-align: center;
				line-height: 2;
		}
		.section.mtr .container.has-top p.font-16 {
				font-size: var(--font-12);
		}
		.modal-mtr .modal-body .font-28 {
				font-size: var(--font-18);
		}
		.modal-mtr .modal-body .font-24 {
				font-size: var(--font-16);
		}
		.mtr-note .card-body ol {
				font-size: var(--font-14);
		}
		.modal-mtr .modal-body p {
				font-size: var(--font-14);
		}
		.btn-enter.sp {
				font-size: var(--font-16);
		}
		.text-large {
				font-size: 120%;
				line-height: 0;
		}
}
@media (max-width: 599.98px) and (orientation:landscape) {
		h2, h1.h2 {
				font-size: 5vw;
		}
		h3, h2.h3 {
				font-size: 4vw;
		}
		h4 {
				font-size: 2vw;
		}
		.font-18-rwd {
				font-size: var(--font-12);
		}
		.alart-slogan {
				font-size: var(--font-14);
		}
		.section.kv .post, .section.kv .point-list {
				font-size: .95rem;
		}
		h4.ch {
				font-size: var(--font-14);
				line-height: 1.5;
		}
		.font-18-rwd.ch {
				font-size: var(--font-14);
		}
		.mainnav .navbar-nav .nav-link {
				font-size: 1rem;
		}
		.section.kv .point-list > ul > li {
				font-size: var(--font-12);
		}
		.section .card-item .info h4 {
				font-size: 12px;
		}
		.modal-detail.modal-mtr .modal-header .modal-title.font-28 {
				font-size: var(--font-18);
		}
		.modal-mtr .modal-body .font-28 {
				font-size: var(--font-18);
		}
		.modal-mtr .modal-body .font-24 {
				font-size: var(--font-16);
		}
		.mtr-note .card-body ol {
				font-size: var(--font-14);
		}
}
@media (max-width: 414px) {
		.section.kv .point-list {
				font-size: .8125rem;
		}
	 		.section.kv .post {
				font-size: .75rem;
		}
		.section.detail .info .sub-title {
				font-size: 1rem;
		}
}
@media (max-width: 320px) and (orientation:portrait) {
		h2, h1.h2 {
				font-size: 1.5rem;
		}
		.kv-subtitle {
				font-size: 1.125rem;
		}
		h3, h2.h3 {
				font-size: 1.125rem;
		}
		.section h3 small {
				font-size: 1.125rem;
		}
		.section.kv .post, .section.kv .point-list {
				font-size: var(--font-12);
		}
		.font-18-rwd {
				font-size: var(--font-12);
		}
		.font-18-rwd.ch {
				font-size: var(--font-14);
		}
		.font-18-rwd.ch2 {
				font-size: var(--font-12);
		}
		.section .card-item .info h4 {
				font-size: var(--font-12);
		}
		body {
				line-height: 1.75;
				font-size: var(--font-14);
				font-weight: normal;
		}
		.mtr-card .card-body .info {
				font-size: var(--font-12);
		}
		.mtr-card .card-body h3 small {
				font-size: 1.125rem;
		}
		.section.mtr .container.has-top h4 {
				font-size: var(--font-14);
				line-height: 1.75;
		}
		.modal-detail.modal-mtr .modal-header .modal-title.font-28 {
				font-size: var(--font-16);
		}
		.modal-mtr .modal-body .font-28 {
				font-size: var(--font-14);
		}
		.modal-mtr .modal-body .font-24 {
				font-size: var(--font-14);
		}
}