html{height: 100%;}
body {
	padding: 0;
	margin: 0;
	background: #fff;	
	color: #212529;
	line-height: 28px;
	font-size: 15px;
	font-family: "Microsoft JhengHei","微軟正黑體","Arial", sans-serif!important;
  height: 100%;

}
body a {
	transition: 0.5s all;
	-webkit-transition: 0.5s all;
	-moz-transition: 0.5s all;
	-o-transition: 0.5s all;
	-ms-transition: 0.5s all;
	text-decoration: none;
}
body a:hover {
	text-decoration: none;
}
body a:focus, a:hover {
	text-decoration: none;
}
input[type="button"], input[type="submit"] {
	transition: 0.5s all;
	-webkit-transition: 0.5s all;
	-moz-transition: 0.5s all;
	-o-transition: 0.5s all;
	-ms-transition: 0.5s all;
}
h1, h2, h3, h4, h5, h6 {
	margin: 0;
	padding: 0;
	font-weight:normal;
}
p {
	margin: 0;
	color:#777;
	letter-spacing:1px;
	line-height:1.5em;
	font-size:15px;}
.row{
	margin:0px;
	padding:0px;
}
ul {
	margin: 0;
	padding: 0;
	list-style: none;
}
label {
	margin: 0;
}
a{
	color:#000;
}
a:focus, a:hover {
	text-decoration: none;
	outline: none;
}
a:focus, a:hover {    
    text-decoration:none;
}
.hide{display: none;}
img{width: 100%;}
section{padding-bottom: 4rem;padding-top: 4rem;}

.scroll-to-top {
	z-index: 1029;
	right: 1rem;
	bottom: 3.3rem;
	display: none;
}

.scroll-to-top a {
	width: 3.1rem;
	height: 3.1rem;
	background-color: rgba(44, 46, 48, 0.8);
	line-height: 3.1rem;
}

.scroll-to-top a::after {
	content: url(../images/fa-angle.png);
	position: absolute;
	top: 15%;
	right: 15%;
	width: 70%;
	opacity: 0.7;
}

.scroll-to-top a:hover::after {
	opacity: 1;
}

@media (max-width: 575px) {
	.scroll-to-top {
		right: 1.5em;
		bottom: 1.5em;
	}

	.scroll-to-top a {
		width: 3.2em;
		height: 3.2em;
		line-height: 1;
		font-size: 1em;
		padding-top: 0.4em;
	}
	.scroll-to-top a::after {
		top: 31%;
	}
}


@media (max-width: 575px) {
	.container {
		padding-left: 1.5em !important;
		padding-right: 1.5em !important;
	}
}
@media (min-width: 992px) {
	.container.sm {
		max-width: 768px;
	}
}

@media (min-width: 1200px) {

	.container.sm {
		max-width: 912px;
	}
}

/*END_container*/

/*-- //Reset-Code --*/

.bg-g{background-color: #ededf0 !important;}
.bg-lightblue{background-color: #f7faff !important;}
.bg-lightgray{background-color: #f7f7f7 !important;}
.bg-yellow{background-color: #ffedc7 !important;}
.bg-green{background-color: #008582!important;}

.bg-o{background-color: #f9c270 ;}
.bg-bk{background-color: #000 ;}
.bg-pink{background-color: #ba4c63;}

.bg-gray{background-color: #dcdcdc;}
.bg-blue{background-color: #344989;}
.bg-blue2{background-color: #5DA4D8;}

.bg-purple{background-color: #c6d6ee;}


.f-blue{color: #617D91;}
.f-pink{color: #e05c6f;}
.f-white{color: #FFFFFF;}
.f-green{color: #6E7455;}
.f-yellow{color: #F2D061!important;}

.bg_banner{
	background-image: url("../images/bn_bg.png");
	background-position:center bottom!important;
	background-size: cover!important;
	-ms-background-size: cover;
	-moz-background-size: cover;
	-webkit-background-size: cover;
}

.bg_th1{
	z-index: -1;
	width: 100%;
	background-image: url("../images/pt1_bg.png");
	background-position:center top;	
	background-repeat: no-repeat;
	background-attachment: scroll;
	background-size: cover;
	-ms-background-size: cover;
	-moz-background-size: cover;
	-webkit-background-size: cover;
}
.bg_th2{
	background-color: #F5DF4D;
}

.bg_th3{
	background-color:#BFE8DD;
}


.bg_footer{
	z-index: -1;
	width: 100%;
	background-image: url("../images/footer_bg.png");
	background-position:center top;	
	background-repeat: no-repeat;
	background-attachment: scroll;
	background-size: cover;
	-ms-background-size: cover;
	-moz-background-size: cover;
	-webkit-background-size: cover;
}

@media screen and (max-width: 575px) {
	
}


/*BTN AREA*/
.topline{width:70px;}

/*BTNN*/
/* .hoverbig img{
	filter:drop-shadow(2px 2px 2px #303030);
} */
.hoverbig:hover img{
	transform: scale(1.1, 1.1);
	transition: 0.3s all;
	-webkit-transition: 0.3s all;
	-moz-transition: 0.3s all;
	-o-transition: 0.3s all;
	-ms-transition: 0.3s all;
filter:drop-shadow(0px 0px 0px #303030);
}

a.btngo{
	font-size: 2.5vmin;
	line-height: 1.7;
	font-weight: bolder;
	color: #fff;
	background-color: #254570;
	padding: 0.25em 3.5em 0.25em 3em;
  border-radius: 5em;
	border: 3px solid #fff;
	box-shadow: -8px 8px 0 rgba(18,69,112,.8);
}
a.btngo:hover{
	color: #ffe05f;
	box-shadow: -2px 2px 0 rgba(100,100,100,.8);
    transform: scale(1.1, 1.1);
	transition: 0.3s all;
	-webkit-transition: 0.3s all;
	-moz-transition: 0.3s all;
	-o-transition: 0.3s all;
	-ms-transition: 0.3s all;
}
/*BTNN*/
.hoverbig img {
	filter: drop-shadow(2px 2px 2px #303030);
}

.hoverbig:hover img {
	transform: scale(1.1, 1.1);
	transition: 0.5s all;
	-webkit-transition: 0.5s all;
	-moz-transition: 0.5s all;
	-o-transition: 0.5s all;
	-ms-transition: 0.5s all;
	filter: drop-shadow(0px 0px 0px #303030);
}


.btngo .point {
	position: absolute;
  top: 5%;
  right: 10%;
    /* filter: drop-shadow(2px 2px 2px #303030); */
  width: 1.4em;
}

.btngo:hover .point {
	display: none;
}

.btngo:hover .linee {
	color: #83ff3b;
	border: 1px solid #83ff3b;
}

@media screen and (max-width: 575px) {
	a.btngo {
		font-size: 3vmin;
		border: 2px solid #fff;
		box-shadow: rgba(18, 69, 112, 0.8) -4px 5px 0px;
	}
	
}
/*#BTNN*/
/*click*/
.click_box{
    position: relative;
}
.click_box:hover img{
   display: none;
}
.click_hand{
    position: absolute;
    filter:drop-shadow(2px 2px 2px #303030);
    width: 60px;
    z-index: 2;
}
/*##click*/

/*------------------------top_brand-------------------------*/
#top_brand {
	padding: 1em 0;
	background-color: #01565B;
	text-align: center;
}
#top_brand img{
	width: 40%;
}

@media screen and (max-width:767px) {
	#top_brand img{
		width: 60%;
	}
	#top_brand {
		padding:0.5em 0;
	}
}

@media screen and (max-width:575px) {
	#top_brand img{
		width: 80%;
	}
}
/*------------------------#top_brand-------------------------*/

/*---------------------------Menu----------------------------*/

#mainNav li {
	text-align: center !important;
	vertical-align: middle;
}

#mainNav li{
	width: 25%;
}

#mainNav li a.nav-link{
	padding: 1em 0.5em !important; 
}

#mainNav {
	position: absolute;
	bottom: 10%;
	left: 7%;
}

#mainNav.ontop {
	position: fixed;
	bottom: unset;
	top: 0;
	left: 0;
	width: 100%;
	background-color: #01565B;
	z-index: 1049;
}

#mainNav.ontop .navbar-collapse{
 padding-left: 11%;
}

#mainNav.ontop li{
	width: 20%;
}

@media screen and (max-width: 991px) {
	#mainNav {
    left: 0%;
}
#mainNav.ontop li{
	width: 22%;
}
}
@media screen and (max-width: 767px) {

}
@media screen and (max-width:575px) {
	#mainNav {
		bottom: 5%;
}
#mainNav.ontop li{
	width: 25%;
}
}

/**/
/*---------------------------#END_mainNav----------------------------*/




/*#BTNN*/
.shadow-f {
	filter: drop-shadow(3px 3px 5px #303030);
}

.shadow-f:hover {
	filter: drop-shadow(8px 8px 8px #303030);
}

/*click*/
.click_box {
	position: relative;
	display: inline-block;
}

.click_box:hover img.click_hand,
.click_box.active img.click_hand {
	display: none;
}

.click_hand {
	position: absolute;
	filter: drop-shadow(2px 2px 2px #303030);
	width: 3em;
	z-index: 2;
}

/*##click*/


/*----------------page-top --------------------*/


#page-top .bn{
	width: 70%;
  padding: 6em 0;
}


@media screen and (max-width: 1300px) {
}
/*992~1200*/
@media screen and (max-width: 1000px) {
}
@media screen and (max-width: 767px) {
	#page-top .bn{
		width: 90%;
		padding: 4em 0;
	}
}
@media screen and (max-width:575px) {

	#page-top .bn {
    width: 100%;
    padding: 2em 0em;
}
}

/*----------------#page-top --------------------*/
/*----------------------------------------- 區塊 a03 -----------------------------------------*/
#a03_1 i.fa-solid{margin-top: -1em;font-size: 3em;    filter: drop-shadow(0.25rem 0.25rem white);}
#a03_1 h4{font-size: 1.75em;}
#a03_1 h5{min-height: 4em;font-size: 1.5em;}
#a03_2>div{
    padding: 1em;
    background: url(../images/index-a03_2-BG.png)center bottom/95% no-repeat;
}
#a03_2 .border{border-color: #000!important; padding: 0}
#a03_2 .border-bottom{
    border-color: #000!important;
    padding-bottom: 0.25em;
}
#a03_2 .border.white{max-height: 9em;}
@media screen and (min-width:768px){
    #a03_2>div>*{font-size: 3em;}
    #a03_2 h4{max-height: 2em}
}
/*-------------------------------------END- 區塊 a03 -----------------------------------------*/
/*----------------part1 --------------------*/
#part1 .btngo{
	background-color: #D90012;
	border: .1em solid #fff;
}

#part1 a.btngo .point {
	position: absolute;
    top: 5%;
    right: 12%;
    /* filter: drop-shadow(2px 2px 2px #303030); */
    width: 0.6em!important;
}

/*----------------#part1 --------------------*/
/*----------------#part2 --------------------*/
.carousel-indicators li{
	background-color: #888888;
	border-bottom: 3px solid transparent;
}
#part2-2 li{
width:38%;
margin: 1em ;
filter: drop-shadow(5px 5px 1px #5F5C50);
}

#part2-2 li:hover{
	filter: drop-shadow(rgb(95, 92, 80) 1px 1px 3px);
}

#part2-3,#part2-2{
	background-color: #fff;
	padding: 2em 0;
	border-radius: 1.8em;
}
.mm{
	animation-delay:.2s;
}

@media screen and (max-width: 575px) {
.carouse .container  {
	padding-left: 0em !important;
	padding-right: 0em !important;
}
#part2-2 li {
	width: 40%;
	margin: 0.5em;
	filter: drop-shadow(3px 3px 1px #5F5C50);
}
}

/*----------------#part2 --------------------*/
/*----------------part3 --------------------*/
.carouse .carousel-indicators{
	margin-bottom: -1em;
}
.carousel-control-prev {
	left: -5em;
}
.carousel-control-next {
	right: -5em;
}
#part3 a{
	filter: drop-shadow(8px 8px 0px #2b2b2b);
}
#part3 a:hover{
	filter: drop-shadow(3px 3px 1px #5F5C50);
}
@media screen and (max-width: 575px) {
	.carousel-control-prev {
		left: -3em;
	}
	.carousel-control-next {
		right: -3em;
	}
}

/*----------------#part3--------------------*/
/*----------------part5--------------------*/
.line_btn {
	position: absolute;
	width: 12%;
	bottom: 1.6em;
	left: 7.5em;
}

.balloon_btn {
	position: absolute;
	width: 11%;
	top: 7.6em;
	right: 4em;
}
@media screen and (max-width:1199px) {
	.line_btn {
		position: absolute;
		width: 12%;
    bottom: 1.4em;
    left: 6em;
	}
	
	.balloon_btn {
		position: absolute;
		width: 11%;
		top: 6em;
    right: 3em;
	}
}
@media screen and (max-width: 767px) {
	.line_btn {
		position: absolute;
		width: 12%;
    bottom: 1em;
    left: 4em;
	}

	.balloon_btn {
		position: absolute;
		width: 11%;
		top: 4.2em;
    right: 2em;
	}
}
@media screen and (max-width: 470px) {
	.line_btn {
		position: absolute;
		width: 12%;
    bottom: 1em;
    left: 3em;
	}
	
	.balloon_btn {
		position: absolute;
		width: 11%;
		top: 3em;
    right: 2em;
	}
}
/*----------------#part5--------------------*/
/*---------------------------footerstyle------------------------------*/
#footer_02 {
	padding-top: 4em;
	padding-bottom: 5em;
}
#footer_02 h4{
	font-weight: 900;
	color: #fff;
}

#footer_02 .f_title {
	color: #fff;
	margin-bottom: .2em;
}

#footer_02 .f_sec {
	color: #fff;
	margin-bottom: .6em;
}

#footer_02 .f-color {
	color: #FBCA0E;
	border: 1px solid #FBCA0E;
	display: inline-block;
	padding: .2em .5em;
}


#footer_02 li {
	width: calc(100% / 5);
}

#footer_02 a.btngo {
	width: 90%;
	font-size: 1.6em;
	margin: 5px;
	line-height: 1.2;
	padding: .5em 0;
	background-color: #1D1819;
	color: #fff;
	border-radius: 0;
	box-shadow: unset;
	border:0px;
}

#footer_02 a.btngo:hover {
	box-shadow: 2px 2px 2px rgba(80, 20, 25, 0.8);
	background-color: #535252;
}

#footer_02 a.btngo small {
	font-size: 80%;
	font-weight: bolder;
}

@media screen and (max-width: 991px) {
	#footer_02 li {
		width: calc(100% / 3);
	}
}

@media screen and (max-width: 575px) {

	#footer_02 {
		padding: 3em 0;
	}

	#footer_02 .f_sec {
		margin-bottom: 1.5em;
	}

	#footer_02 li {
		margin-bottom: .6em;
	}

	#footer_02 a.btngo {
		margin: 1.6%;
		box-shadow: 4px 4px 0 rgba(80, 20, 25, 0.8);
	}
}

@media screen and (max-width:450px) {
	#footer_02 {
		font-size: 2.8vw !important;
	}
}

/*----------#end_footer----------*/
/*-------------------------------footer_copyright------------------------------*/

#footer_copyright {
	padding: 2em 0;
	background-color: #000000;
	color: rgba(255, 255, 255, 0.9);
	text-align: center;
}

#footer_copyright p {
	color: rgba(255, 255, 255, 0.6);
	line-height: 1.4;
}
@media screen and (max-width:450px) {
	#footer_copyright {
		padding: 2em 0;
	}
}

/*----------#end_footer----------*/

/*---------------------------media------------------------------*/
@media screen and (max-width: 1400px) {
}
/*992~1200*/
@media screen and (max-width: 1199px) {
	
}/*576以上*/
@media screen and (min-width: 576px) {
.type_ph{display: none!important;}
	
}/*手機板575*/
@media screen and (max-width: 575px) {
section{padding-bottom: 1.2rem;padding-top: 1.2rem;}	
.type_pc{display: none!important;}
/* .container:not(.nolr){
    padding-left: 0!important;
    padding-right: 0!important;}	 */

}/*END(max-width: 575px)*/
@media screen and (max-width: 472px) {	


}/*END(max-width: 472px)*/
@media screen and (max-width: 420px) {


}
