@charset "UTF-8";
body,
html,
* {
	margin: 0;
	padding: 0;
	font-family: arial, "Microsoft JhengHei", "微軟正黑體", sans-serif;
}

section {
	position: relative;
}

section .s-block {
	position: absolute;
	width: 100%;
	word-wrap: break-word;
	padding: 0;
}

.text-justify {
	text-justify: distribute;
	text-align: justify;
	-ms-text-justify: inter-ideograph;
	-moz-text-justify: inter-ideograph;
}

a {
	text-decoration: none;
	cursor: pointer;
}

img {
	max-width: 100%;
	display: block;
	width: 100%;
}

header {
	position: absolute;
	top: 0;
	left: 0;
	z-index: 1;
	width: 100%;
}

.headerBox {
	display: flex;
	justify-content: space-between;
	align-items: center;
	max-width: 1500px;
	width: 100%;
	margin: 0 auto;
}

.logolink {
	position: absolute;
	max-width: 115px;
	width: 100%;
	height: auto;
	top: 0;
	left: 2.5vw;
	z-index: 100;
}

@media only screen and (max-width: 768px) {
	.logolink {
		left: 2vw;
		width: 17vw;
		height: 14vw;
	}
}

.logolink a {
	width: 100%;
	height: 100%;
	display: inline-block;
}

.swiper {
	--swiper-theme-color: #fff;
	--swiper-pagination-bullet-inactive-color: #fff;
}

.wrap {
	position: relative;
	max-width: 2000px;
	width: 100%;
	line-height: 2;
	font-size: 16px;
	margin: 0 auto;
	overflow: hidden;
	padding-bottom: 0%;
	background-color: #009fdf;
}

.wrap .info {
	width: 85%;
	max-width: 1000px;
	margin: 0 auto;
	position: relative;
	color: #ffffff;
	padding: 0% 0% 1%;
	;
	font-size: 20px;
	font-weight: 500;
}

@media only screen and (max-width: 1050px) {
	.wrap .info {
		font-size: 1.7vw;
	}
}

@media only screen and (max-width: 768px) {
	.wrap .info {
		font-size: 3.2vw;
		width: 100%;
		padding-left: 0%;
	}
}

.wrap .info .mainItem {
	max-width: 180px;
	width: 16%;
	margin: 1rem 0;
}

@media only screen and (max-width: 768px) {
	.wrap .info .mainItem {
		max-width: unset;
		width: 35%;
	}
}

.wrap .info .subTiem {
	font-size: 1.5vw;
	text-indent: -1.5vw;
	color: #4d879b;
	display: flex;
	width: 100%;
	align-items: center;
	padding-left: 3.1rem;
	margin: 0.5rem 0;
}

@media only screen and (max-width: 768px) {
	.wrap .info .subTiem {
		padding-left: 2%;
		font-size: 4.3vw;
	}
}

.wrap .info .subTiem .subTiem_img {
	max-width: 100%;
	width: 27%;
}

@media only screen and (max-width: 768px) {
	.wrap .info .subTiem .subTiem_img {
		max-width: unset;
		width: 60%;
	}
}

.wrap .info .subTiem .subTiem_img2 {
	width: 37%;
}

@media only screen and (max-width: 768px) {
	.wrap .info .subTiem .subTiem_img2 {
		max-width: unset;
		width: 90%;
	}
}

.wrap .info .subTiem .line {
	flex: 1 0 auto;
	position: relative;
	height: 1px;
}

.wrap .info .subTiem .line::after {
	content: "";
	transform: translateY(50%);
	position: absolute;
	top: 0.3rem;
	left: 10px;
	width: 100%;
	height: 100%;
	background-color: #fff;
}

@media only screen and (max-width: 768px) {
	.wrap .info .subTiem .line::after {
		width: 90%;
	}
}

.wrap .txt {
	padding-left: 0.7rem;
}

@media only screen and (max-width: 768px) {
	.wrap .txt {
		padding-left: 5%;
	}
}

.wrap ol {
	padding: 0% 0% 0 1rem;
	text-align: justify;
	text-justify: distribute;
}

@media only screen and (max-width: 768px) {
	.wrap ol {
		padding-left: 11%;
		padding: 0% 0% 0 1rem;
	}
}

.wrap li {
	margin: 0% 0;
	list-style: decimal;
}

.wrap ol ol li {
	list-style-type: lower-alpha;
}


/* .wrap li::marker {
  content: counter(list-item) "、";
} */


/*.wrap .item2Img {
  transform: translateY(-13%);
}*/

@media only screen and (max-width: 768px) {
	.wrap .item2Img {
		transform: translateY(0%);
	}
}

.wrap .kv .txt01 {
	margin: 0 auto;
	position: relative;
	color: #ffffff;
	padding: 0% 0% 1%;
	;
	font-size: 20px;
	font-weight: 500;
	position: absolute;
	top: 53.5%;
	left: 19.5%;
	width: 16.5%;
	line-height: 1.7;
	z-index: 1;
}

@media only screen and (max-width: 1680px) {
	.wrap .kv .txt01 {
		font-size: 1.1vw;
	}
}

@media only screen and (max-width: 768px) {
	.wrap .kv .txt01 {
		font-size: 4.2vw;
		width: 82%;
		padding-left: 0%;
		left: 51.5%;
		transform: translateX(-50%);
		top: 37%;
	}
}

.wrap .kv .txt02 {
	margin: 0 auto;
	position: relative;
	color: #ffffff;
	padding: 0% 0% 1%;
	;
	font-size: 20px;
	font-weight: 500;
	position: absolute;
	top: 53.5%;
	left: 40.5%;
	width: 17.5%;
	line-height: 1.7;
	z-index: 1;
}

@media only screen and (max-width: 1680px) {
	.wrap .kv .txt02 {
		font-size: 1.1vw;
	}
}

@media only screen and (max-width: 768px) {
	.wrap .kv .txt02 {
		font-size: 4.2vw;
		width: 82%;
		padding-left: 0%;
		left: 51.5%;
		transform: translateX(-50%);
		top: 47.3%;
	}
}

.wrap .kv .txt03 {
	margin: 0 auto;
	position: relative;
	color: #ffffff;
	padding: 0% 0% 1%;
	;
	font-size: 20px;
	font-weight: 500;
	position: absolute;
	top: 53.5%;
	left: 63.7%;
	width: 16.5%;
	line-height: 1.7;
	z-index: 1;
}

@media only screen and (max-width: 1680px) {
	.wrap .kv .txt03 {
		font-size: 1.1vw;
	}
}

@media only screen and (max-width: 768px) {
	.wrap .kv .txt03 {
		font-size: 4.2vw;
		width: 82%;
		padding-left: 0%;
		left: 51.5%;
		transform: translateX(-50%);
		top: 58.1%;
	}
}

.wrap .kv a {
	display: block;
	width: 100%;
	height: 100%;
}

.wrap .kv .txt02 a {
	display: inline;
}

.wrap .kv .linkBox01 {
	position: absolute;
	width: 22%;
	height: 17.5%;
	top: 18.5%;
	left: 29%;
	transform: translateX(-50%);
	z-index: 1;
}

.wrap .kv .linkBox02 {
	position: absolute;
	width: 21%;
	height: 17.5%;
	top: 18.5%;
	left: 50.8%;
	transform: translateX(-50%);
	z-index: 1;
}

.wrap .kv .linkBox03 {
	position: absolute;
	width: 20%;
	height: 17%;
	top: 19%;
	left: 71.5%;
	transform: translateX(-50%);
	z-index: 1;
}

.wrap .kv .linkBox04 {
	position: absolute;
	width: 20%;
	height: 29%;
	top: 14%;
	left: 73%;
	transform: translateX(-50%);
	z-index: 1;
}

.wrap .kv .linkBox_btn {
	position: absolute;
	width: 15%;
	height: 2.7%;
	top: 16.2%;
	left: 71.5%;
	transform: translateX(-50%);
	z-index: 1;
}

@media only screen and (max-width: 768px) {
	.wrap .kv .linkBox01 {
		width: 83%;
		height: 6.6%;
		top: 21.8%;
		left: 50%;
	}
	.wrap .kv .linkBox02 {
		width: 48%;
		height: 8%;
		top: 13.7%;
		left: 74%;
	}
	.wrap .kv .linkBox03 {
		width: 45%;
		height: 8%;
		top: 13.7%;
		left: 26%;
	}
	.wrap .kv .linkBox_btn {
		width: 43%;
		height: 1.5%;
		top: 12.2%;
		left: 72%;
	}
}

.wrap .kv .linkBox a {
	display: inline-block;
	width: 100%;
	height: 100%;
}

@media only screen and (max-width: 768px) {
	.wrap .kv .linkBox a {
		width: 100%;
	}
	.wrap .kv {
		margin: -5% auto 0;
	}
}

.wrap .info2 {
	position: relative;
	text-align: center;
}

.wrap .info2 .form_title {
	position: relative;
	text-align: center;
	margin: 4% 0 5% 11%;
	width: 80%;
}

.wrap .info2 .linkBox {
	position: absolute;
	width: 100%;
	height: 49%;
	top: 0%;
	left: 50%;
	transform: translateX(-50%);
}

@media only screen and (max-width: 768px) {
	.wrap .info2 .linkBox {
		height: 100%;
		top: -2%;
	}
}

.wrap .info2 .linkBox a {
	display: inline-block;
	width: 100%;
	height: 100%;
}

@media only screen and (max-width: 768px) {
	.wrap .info2 .linkBox a {
		width: 100%;
	}
	.wrap .info2 .form_title {
		margin: 0 0 8% 1%;
		width: 100%;
	}
}

table {
	padding: 0;
	width: 100%;
	font-size: 20px;
}


/* @media only screen and (max-width: 1680px) {
  table {
    font-size: 1.1vw;
  }
} */

@media only screen and (max-width: 768px) {
	table {
		font-size: 4.2vw;
	}
}

tr {
	display: flex;
}

table td {
	padding: 0.8rem 0;
}

tr td:first-of-type {
	flex: 0 0 30%;
	min-width: 5rem;
	text-align: left;
	padding: 0.8rem;
}

@media only screen and (max-width: 768px) {
	tr td:first-of-type {
		/* width: 5rem;;
    min-width: 5rem; */
	}
}

tr td:last-of-type {
	flex-grow: 1;
	text-align: left;
	padding: 0.8rem;
}

.wrap .table {
	padding: 0;
	width: 100%;
}

.wrap .table .tableImg {
	transform: translateY(-5%);
}

.table img {
	width: 60%;
	margin: 0 auto;
}

@media only screen and (max-width: 768px) {
	.wrap .table .tableImg {
		transform: translateY(0%);
	}
	.wrap .table img {
		width: 90%;
	}
}

.wrap .table .btn {
	padding-bottom: 10%;
}

@media only screen and (max-width: 768px) {
	.wrap .table .btn {
		padding-bottom: 0%;
		padding-top: 5%;
	}
}

.wrap .info3 {
	/* transform: translateY(-10%); */
	padding-bottom: 2%;
	padding-top: 5%;
}

.wrap .info3 .rule_title {
	margin: 0 0 5% 9%;
	width: 80%;
}

@media only screen and (max-width: 768px) {
	.wrap .info3 {
		transform: translateY(0%);
		padding-bottom: 5%;
	}
	.wrap .info3 .rule_title {
		margin: 10% 0 9% 8%;
		width: 87%;
	}
}

.wrap .info3 .title {
	font-size: 30px;
	font-weight: 600;
	padding-bottom: 1%;
}

@media only screen and (max-width: 1050px) {
	.wrap .info3 .title {
		font-size: 3vw;
	}
}

@media only screen and (max-width: 768px) {
	.wrap .info3 .title {
		text-indent: -2rem;
		font-size: 4.5vw;
	}
}



.wrap .info3 .note01,
.wrap .info3 .note02,
.wrap .info3 .note03 {
	padding-left: 1.5vw;
}

@media only screen and (max-width: 768px) {
	.wrap .info3 .note01,
	.wrap .info3 .note02,
	.wrap .info3 .note03 {
		padding-left: 2.5vw;
	}
}

@media only screen and (max-width: 430px) {
	.wrap .info3 .note01,
	.wrap .info3 .note02,
	.wrap .info3 .note03 {
		padding-left: 6.5vw;
	}
}

.wrap .footer {
	font-size: 14px;
	text-align: center;
	padding: 1rem;
	font-size: 0.8vw;
	color: #567cdf;
	background-color: #223362;
}

@media only screen and (max-width: 1050px) {
	.wrap .footer {
		font-size: 1.275vw;
	}
}

@media only screen and (max-width: 768px) {
	.wrap .footer {
		font-size: 2.56vw;
		padding-bottom: 3%;
	}
}

@media only screen and (max-width: 768px) {
	.wrap .pc {
		display: none;
	}
}

.wrap .md {
	display: none;
}

.item a {
	display: block;
	position: absolute;
	width: 100%;
	z-index: 5;
	height: 32vw;
}

@media only screen and (max-width: 768px) {
	.wrap .md {
		display: block;
	}
	.item a {
		height: 171vw;
	}
}


/*# sourceMappingURL=main.css.map */