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.8em;
		height: 3.8em;
		line-height: 1;
		font-size: 1em;
		padding-top: 0.4em;
	}
}


@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{
	z-index: -1;
	width: 100%;
	background-image: url("../images/pt3_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_th4{
	z-index: -1;
	width: 100%;
	background-image: url("../images/pt4_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_th4-2{
	z-index: -1;
	width: 100%;
	background-image: url("../images/pt4-2_bg.png");
	background-position:center bottom;	
	background-repeat: no-repeat;
	background-attachment: scroll;
	background-size: cover;
	-ms-background-size: cover;
	-moz-background-size: cover;
	-webkit-background-size: cover;
}

.bg_th5{
	z-index: -1;
	width: 100%;
	background: url("../images/pt5_bg.png")no-repeat center top;
	background-size: cover;
	-ms-background-size:cover;
	-moz-background-size: cover;
	-webkit-background-size:cover;
}

.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) {
	.bg_th1{
		z-index: -1;
		width: 100%;
		background-image: url("../images/pt1_bg_ph.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_th4{
		z-index: -1;
		width: 100%;
		background-image: url("../images/pt4_bg_ph.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_th4-2{
		z-index: -1;
		width: 100%;
		background-image: url("../images/pt4-2_bg_ph.png");
		background-position:right bottom;	
		background-repeat: no-repeat;
		background-attachment: scroll;
		background-size: cover;
		-ms-background-size: cover;
		-moz-background-size: cover;
		-webkit-background-size: cover;
	}
	.bg_th5{
		z-index: -1;
		width: 100%;
		background: url("../images/pt5_bg_ph.png")no-repeat center top;
		background-size: cover;
		-ms-background-size:cover;
		-moz-background-size: cover;
		-webkit-background-size:cover;
	}
	.bg_footer{
		z-index: -1;
		width: 100%;
		background-image: url("../images/footer_bg_ph.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;
	}
}


/*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*/

/*---------------------------Menu----------------------------*/

#mainNav li {
	text-align: center !important;
	line-height: 1.2;
	vertical-align: middle;
	margin: 0.4em .5em;
}

#mainNav li a {
	font-size: 2em;
	color:#002348;
	display: inline-block;
	padding: 0.2em 1em;
	letter-spacing: 2px;
	background-color: #8BC7E1;
	border: 1px solid #fff;
	box-shadow: 4px 4px 0.5px rgba(18,69,112,.8);
	width: 100%;
	font-weight: 700;
}



#mainNav {
	position: fixed;
	bottom: unset;
	top: 0;
	left: 0;
	width: 100%;
	background-color: #0F5085;
	z-index: 1049;
}

@media screen and (max-width: 991px) {
	#mainNav li a {
		font-size: 1.2em;
		padding: 0.4em 1em;
	}
}
@media screen and (max-width: 767px) {
	#mainNav li a {
		padding: .4em 1.5em;
	}
}

@media screen and (max-width: 575px) {

	#mainNav li a {
		font-size: 1em;
	}
}

@media screen and (max-width: 470px) {

	#mainNav li {
    margin: 0.4em 0.3em;
}
#mainNav li a {
	padding: 0.4em 1em;
}

}



/**/
/*---------------------------#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_tu{
	position: absolute;
	width: 62%;
	left: 82%;
	top: 7%;
}

#page-top .bn{
	position: relative;
	width: 42%;
	/* /* left: -8%; */
	padding: 9.5em 0 9.5em 0; 
}
/*MENU_BOX*/
#menu_box li.nav-item{width: 20%;}
#menu_box li a.nav-link{
	padding: 2.5em 0.5em !important; 
}

/*#MENU_BOX*/

@media screen and (max-width: 1300px) {
	#page-top .bn_tu{
		width: 69%;
    /* top: 10%; */
	}
	
	#page-top .bn{
		width: 45%;
		/* /* left: -11%; */
    padding: 10.5em 0 2.5em 0; 
	}

	#menu_box li.nav-item {width: 20%;}
}
/*992~1200*/
@media screen and (max-width: 1000px) {

	#page-top .bn{
		width: 56%;
    /* padding: 5.5em 5.5em 0.5em 0.5em; */
	}
	#page-top .bn_tu{
		right: 11%;
    top: 2%;
		width: 56%;
	}
	#menu_box li.nav-item {width: 20%;}
	#menu_box li a.nav-link {
    padding: 1.5em 0.3em !important;
}

}
@media screen and (max-width: 725px) {

	#page-top .bn{
		width: 62%;
    /* padding: 4.5em 5.5em 2.5em 0.5em; */
	}
 
	#page-top .bn_tu{
		right: 8%;
    top: 3%;
    width: 56%;
	}



}

/*----------------#page-top --------------------*/

/*----------------#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) {
.carouse4-4 .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 --------------------*/
/*----------------part4 --------------------*/
.carouse4-4 .carousel-indicators{
	margin-bottom: -1em;
}
.carousel-control-prev {
	left: -5em;
}
.carousel-control-next {
	right: -5em;
}

#part4 a.btngo,#part4-2 a.btngo{
	background-color: #A02088;
}
@media screen and (max-width: 575px) {
	.carousel-control-prev {
		left: -3em;
	}
	.carousel-control-next {
		right: -3em;
	}
}

/*----------------#part4--------------------*/
/*----------------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: 42em;
	padding-bottom: 10em;
}
#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: 22em 0 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 8em 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) {


}