@charset "UTF-8";
/* 以上是 聲明 css編碼 */

/* 以下是 圖示文字 的 CSS */
@import url('/webeip/HT00100/peggy/fonticons/css/style.css');
@import url('https://fonts.googleapis.com/css2?family=Allura&display=swap');

/* 以下是 slick-1.8.1 的相關 CSS */
@import url('/webeip/HT00100/becky/slick-1.8.1/slick/slick.css');
/* Add the new slick-theme.css if you want the default styling */
@import url('/webeip/HT00100/becky/slick-1.8.1/slick/slick-theme.css');

/* 以下是swiper-4.5.0 css */
@import url(/webeip/HT00100/Peggy/swiper-4.5.0/css/swiper.min.css);

/* 以下是 animate 的 CSS */
@import url('/webeip/HT00100/becky/css/animate.css');
/* 以下是 reset 的 CSS */
@import url('/webeip/HT00100/becky/css/reset.css');


/* 大圖輪播器 carousel10 */

	.carousel_main{
		width: 100%;
		display: flex;
		justify-content: flex-start;
		align-items: flex-start;
	}

	.carousel10_main{
		position: relative;
		width: 100%;
	}

	.carousel10_a{
		display: block;
	    width: 100%;
	    position: relative;
	}
	.carousel10_img{
		display: block;
		vertical-align: top;
	    width: 100%;
	    padding-bottom: 50vw;
	    background-size: cover;
	    background-position: center center;
	    background-repeat: no-repeat;
	    filter: brightness(70%);
	}
	.carousel10_txt{
		position: absolute;
		z-index: 99;
		top: 50%;
		left: 50%;
		transform: translate(-50%, -50%);
		-webkit-writing-mode: vertical-rl;
		height: 350px;
	}
	.carousel10_txt > p{
		color: #fff;
		letter-spacing: 5px;
		line-height: 50px;
		padding-left: 5px;
		box-sizing: border-box;
		font-size: 1.15rem;
	}
	.carousel10_logo{
		position: absolute;
		z-index: 99;
		top: 20%;
		left: 20%;
		transform: translate(-50%, -50%);
		display: flex;
		flex-wrap: wrap;
		justify-content: flex-start;
		align-items: flex-start;
	}
	.carousel10_logocn{
		-webkit-writing-mode: vertical-rl;
		color: #fff;
		margin-right: 10px;
		display: flex;
		justify-content: center;
		align-items: center;
	}
	.carousel10_logocn > span{
		display: inline-block;
		letter-spacing: 5px;
		font-size: 1.5rem;
	}
	.carousel10_logocn > img{
		width: 35px;
		vertical-align: top;
		margin-top: 5px;
		background-color: rgb(255 255 255 / 80%);
		padding: 1px;
		box-sizing: border-box;
		border-radius: 50%;
	}
	.carousel10_logoen{
		display: flex;
		flex-wrap: wrap;
		justify-content: flex-start;
		align-items: flex-start;
		flex-direction: column-reverse;
		-webkit-writing-mode: vertical-rl;
		color: #fff;
	}
	.carousel10_logoen span{
		display: inline-block;
		font-family: "Allura", cursive;
		font-weight: 400;
		font-style: normal;
		font-size: 0.95rem;
		margin-right: 10px;
		letter-spacing: 2px;
	}
	/* 箭頭 */
	.carousel10-button-next, .carousel10-button-prev{
		position: absolute;
		top: 50%;
		width: 40px;
		height: 50px;
		margin-top: -30px;
		z-index: 10;
		cursor: pointer;
		background-size: 40px 50px;
		background-position: center;
		background-repeat: no-repeat;
	}
	.carousel10-button-next, .swiper-container-rtl .carousel10-button-prev{
		right: 10px;
		left: auto;
		background-image: url(/webeip/HT00048/img/arrow-right-w.svg);
	}
	.carousel10-button-prev, .swiper-container-rtl .carousel10-button-next{
		background-image: url(/webeip/HT00048/img/arrow-left-w.svg);
		left: 10px;
		right: auto;
	}
	/* 下滑  */
	.sliderdownbtn{
		width: 35px;
		bottom: 10px;
		left: 10px;
		cursor: pointer;
		text-align: center;
		position: absolute;
		left: 50%;
		transform: translate(-50%, 0);
		z-index: 99;
	}
	.sliderdownbtn img{
		width: 100%;
		vertical-align: top;
	}
@media all and (max-width: 1040px){
	.carousel10_txt > p{
		line-height: 30px;
		font-size: 1rem;
	}
	.carousel10_txt{ height: 300px; }
	
}
@media all and (max-width: 765px){
	.carousel10-button-next, .carousel10-button-prev{ display: none; }
	.carousel10_logo{ display: none; }

}
@media all and (max-width: 450px){
	.carousel_title{
		font-size: 1rem;
	}
}
.body_title{
	width: 95%;
	max-width: 1200px;
	margin: 0 auto;
	display: flex;
	justify-content: flex-start;
	align-items: center;
    box-sizing: border-box;
    border-bottom: 1px solid #dcdcdc;
    padding-bottom: 5px;
    margin-top: 40px;
}
.body_title > h2{
	font-size: 1.75rem;
    font-weight: normal;
    letter-spacing: 2px;
    padding-left: 2px;
    box-sizing: border-box;

}
.body_title a{ color: #d31d80; }
.body_title a span{
	display: inline-block;
	font-size: 0.95rem;
}
.body_title a span i{
	display: inline-block;
	margin-left: 5px;
}
.body_title_btn{
	display: flex;
	justify-content: center;
	align-items: center;
	width: 100%;
	max-width: 120px;
	margin: 10px auto 0;
	font-size: 1.25rem;
	letter-spacing: 5px;
	padding: 5px 0 5px 5px;
	box-sizing: border-box;
	transition: all .5s;
	background-color: #000;
	color: #fff;
	border-radius: 20px;
}
.body_title_btn:hover{
	letter-spacing: 10px;
	padding: 5px 0 5px 10px;
	max-width: 250px;
}
/* 圖像廣告連結 */
	.imgadlink_main{
		width: 100%;
		display: flex;
		flex-wrap: wrap;
		justify-content: flex-start;
		align-items: flex-start;
	}
	.imgadlink_group{
		width: 100%;
	}
	.adimg{
		width: 100%;
		overflow: hidden;
	}
	.adimg a{
		display: block;
	}
	.adimg img{
		vertical-align: top;
		width: 100%;
	}
	.adtxt a{ display: block; }

	.adtxttitle{
		width: 100%;
		margin: 15px 0;
		display: block;
		text-align: center;
		color: #000;
		font-size: 23px;
		font-family: 'Noto Sans TC', sans-serif;
		font-weight: 700;
		letter-spacing: 5px;
    	padding-left: 5px;
    	box-sizing: border-box;
    	font-weight: normal;
	}
	.adexplain{
		width: 100%;
		color: #444;
		text-align: justify;
		margin-top: 10px;
		font-size: 16px;
		font-weight: 300;
		letter-spacing: 5px;
    	padding: 0 10px 0 15px;
    	box-sizing: border-box;
		font-family: 'Noto Sans TC', sans-serif;
		line-height: 25px;
	}


/* 最新行程 */
	.tours_main{
		width: 95%;
		max-width: 1200px;
		margin: 0 auto;
		padding: 30px 0 50px;
	}
	/* 圖示團體行程 */
		.travelteam_main{
			min-height: 200px;
			width: 100%;
			display: flex;
			flex-wrap: wrap;
			justify-content: flex-start;
			align-items: flex-start;
		}
		.travelteam{
			width: calc(90% / 4);
			margin: 10px calc(10% / 8);
			box-sizing: border-box;
			transition: all .5s;
			position: relative;
			box-shadow: 0 0 5px rgb(0 0 0 / 50%);
		}
		.travelteam_img{
			width: 100%;
		}
		.travelteam_img_img{
			display: flex;
			align-items: center;
			justify-content: center;
			width: 100%;
			height: auto;
	    	overflow: hidden;
		}
		.travelteam_img_img img{
			width: 100%;
			vertical-align: top;
			-webkit-transition: all 0.4s ease;
	    	-text-decoration-linemoz-transition: all 0.4s ease;
	    	-o-transition: all 0.4s ease;
	    	transition: all 0.4s ease;
		}
		.travelteam_img_noimg{
			display: flex;
			align-items: center;
			justify-content: center;
			width: 100%;
			height: 220px;
			background-color: #DDD;
			-webkit-transition: all 0.4s ease;
	    	-text-decoration-linemoz-transition: all 0.4s ease;
	    	-o-transition: all 0.4s ease;
	    	transition: all 0.4s ease;
		}
		.travelteam_img:hover .travelteam_img_img img{
			-moz-transform: scale(1.1);
		    -webkit-transform: scale(1.1);
		    -o-transform: scale(1.1);
		    -ms-transform: scale(1.1);
		    transform: scale(1.1);
		}
		.travelteam_img_noimg > span{
			font-size: 3rem;
			color: #FFF;
		}
		.travelteam_text{
			width: 100%;
			padding: 5px;
			box-sizing: border-box;
		}
		.travelteam_title{
			display: block;
		    width: 100%;
		    text-align: center;
		    box-sizing: border-box;
		    color: #000;
		    font-size: 1.25rem;
		    transition: all .3s;
		    margin-bottom: 20px;
		    letter-spacing: 2px;
		    padding-left: 2px;
		}
		.travelteam_desc{
			height: 42px;
			overflow: hidden;
			padding: 0;
			margin-bottom: 5px;
			color: #c38764;
			text-align: left;
		}
		.travelteam_price{
			font-size: 1rem;
		    color: #F44336;
		    text-align: right;
		}
		.travelteam_price i{
			font-style: normal;
		}

		.travelteam_price span{
			display: inline-block;
			font-size: 1.25rem;
			margin: 0 5px;
		}

/* 最新消息 */
	.news_main{
		width: 95%;
		max-width: 1200px;
		margin: 30px auto;
	}
	/* 圖示站內 */
		.ShowImgUrlLink_main2{
			min-height: 200px;
			width: 100%;
			display: flex;
			flex-wrap: wrap;
			justify-content: flex-start;
			align-items: flex-start;
		}
		.ShowImgUrlLink_box2{
			width: calc(90% / 3);
			margin: 10px calc(10% / 6);
			box-sizing: border-box;
			transition: all .5s;
			position: relative;
			box-shadow: 0 0 5px rgb(0 0 0 / 50%);
		}

		.ShowImgUrlLink_img2{
			width: 100%;
			display: block;
			position: relative;
			overflow: hidden;
		}
		.ShowImgUrlLink_img_img2{
			display: block;
			position: relative;
			box-sizing: border-box;
			background-color: #fff;
		}
		.ShowImgUrlLink_img_img2 img{
			width: 100%;
			vertical-align: top;
		}
		.ShowImgUrlLink_img_noimg2{
			display: flex;
			align-items: center;
			justify-content: center;
			width: 100%;
			height: 12vw;
			background-color: #DDD;
		}
		.ShowImgUrlLink_img_noimg2 > span{
			font-size: 3rem;
			color: #FFF;
		}
		.ShowImgUrlLink_title2{
			width: 100%;
		    height: 100%;
		    display: block;
		    text-align: center;
		    color: #ffffff;
		    font-size: 1.5rem;
		    letter-spacing: 5px;
		    padding-left: 5px;
		    box-sizing: border-box;
		    position: absolute;
		    top: 0;
		    left: 0;
		    display: flex;
		    flex-wrap: wrap;
		    justify-content: center;
		    align-items: center;
		    background-color: rgb(0 0 0 / 20%);
		    opacity: 0;
		    transition: all .5s;
		}
		.ShowImgUrlLink_title2 span{ position: relative; }
		.ShowImgUrlLink_title2 span:before{
			content: '';
			position: absolute;
			width: 0;
			height: 1px;
			background-color: #fff;
			left: 50%;
			bottom: -10px;
			transform: translate(-50%, 0);
			 transition: all 1s;
		}
		.ShowImgUrlLink_box2:hover .ShowImgUrlLink_img_img2 img{
			filter: blur(1px);
		}
		.ShowImgUrlLink_box2:hover .ShowImgUrlLink_title2{
			opacity: 1;
		}
		.ShowImgUrlLink_box2:hover .ShowImgUrlLink_title2 span:before{
			width: 100%;
		}
/* 4個圈圈 */
	.round_main{
		width: 95%;
		max-width: 1200px;
		margin: 20px auto;
		display: flex;
		flex-wrap: wrap;
		justify-content: flex-start;
		align-items: flex-start;
	}
	.round_box{
		display: block;
		width: calc(80% / 4);
		margin: 20px calc(20% / 8);
		position: relative;
		transition: all .3s;
		border-radius: 50%;
	}
	.round_img{
		display: block;
		position: relative;
		transition: all .5s;
		overflow: hidden;
		border-radius: 50%;
		box-shadow: 8px 5px 10px rgb(0 0 0 / 30%);
		border: 3px solid #fff;
	}
	.round_img > img{
		transform: scaleX(1);
		vertical-align: top;
		width: 100%;
		border-radius: 50%;
		transition: all .5s;
		padding: 5px;
		box-sizing: border-box;
	}
	.round_box:hover .round_img > img{
		transform: scaleX(-1);
	}
	.round_box > span{
		display: block;
    	margin-top: 10px;
		font-size: 1.25rem;
	    font-weight: normal;
	    letter-spacing: 2px;
	    padding-left: 2px;
	    box-sizing: border-box;
	    text-align: center;
	    color: #000;
	}
/* 快速前往 圖像廣告連結 */
	.tour_cola_main{
		width: 100%;
		margin: 30px auto 50px;
	}
	.imgadlink_main2{
		width: 100%;
		max-width: 1200px;
		margin: 0 auto;
		display: flex;
		flex-wrap: wrap;
		align-items: center;
		justify-content: center;
	}
	.imgadlink_group2{
		width: calc( 95% / 4);
		margin: 10px calc( 5% / 8);
		transition: all .2s;
		position: relative;
		overflow: hidden;
		border-radius: 5px;
	}
	.imgadlink_group2:hover{
		bottom: 5px;
	}
	.adimg2{ width: 100%; }

	.adimg2 a{
		display: flex;
		align-items: center;
		justify-content: center;
		width: 100%;
	}
	.adimg2 a div{
		width: 100%;
		height: 200px;
		background-repeat: no-repeat;
		background-position: center center;
		background-size: cover;
	}
	.adimg2 a img{
		position: relative;
		width: 100%;
		vertical-align: top;
	}
	.adiframe2{ display: none; }

	/*.adtxt a{
		display: block;
		width: 100%;
		height: 100%;
		}
		.adtxt a::before{
		content: '';
		position: absolute;
		right: 0;
		bottom: 0;
		left: 0;
		z-index: 1;
		height: 50%;
		background-image: linear-gradient(to bottom,rgba(0,0,0,.02) 0,rgba(0,0,0,.8) 100%);
		}
		.adtxt a > span{
		position: absolute;
		z-index: 1;
		left: 0;
		bottom: 0;
		font-size: 1.5rem;
		font-weight: bold;
		color: #FFF;
		white-space: nowrap;
		letter-spacing: 10px;
		padding: 0 0 10px 30px;
	}
	.adexplain{ display: none; }*/
	.adtxt2{
		width: 100%;
		height: 100%;
		position: absolute;
		left: 0;
		bottom: 0;
		background-image: linear-gradient(to bottom,rgba(0,0,0,.03) 0,rgba(0,0,0,.5) 100%);
		transition: all .5s;
	}
	.imgadlink_group2:hover .adtxt2{
		height: 30%;
	}
	.adtxt2 a{
		display: block;
		width: 100%;
		height: 100%;
	}
	.adtxt2 a > span{
		position: absolute;
		z-index: 1;
		top: 50%;
		left: 50%;
		transform: translate(-50%,-50%);
		font-size: 1.5rem;
		color: #FFF;
		white-space: nowrap;
		letter-spacing: 5px;
		padding-left: 5px;
		box-sizing: border-box;

	}
	.adexplain2{ display: none; }
.alltours_main{
	width: 100%;
	background-color: #f8f8f8;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: center;
	padding: 40px 0;
	box-sizing: border-box;
}
.alltours_boxL{
	width: 48%;
    margin: 0 1%;
    max-width: 600px;
}
.alltours_boxL h1{
	display: block;
    text-align: justify;
    font-size: 1.75rem;
    letter-spacing: 5px;
    padding-left: 5px;
    box-sizing: border-box;
    font-weight: normal;
    line-height: 40px;
    margin-bottom: 20px;
}
.alltours_boxR{
	width: 48%;
    margin: 0 1%;
    max-width: 300px;
}

.alltours_boxL a{
	display: inline-block;
    padding: 6px 40px;
    border: 1px solid #000;
    color: #000;
    box-sizing: border-box;
    transition: all .5s;
}
.alltours_boxL a:hover{
	background-color: #000;
	color: #fff;
}

@media screen and (max-width: 1200px){
	.adimg2 a div{ height: 16vw; }

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

	.ShowImgUrlLink_box2, .travelteam{
		width: calc(90% / 2);
		margin: 10px calc(10% / 4);
	}

	.tours_main{ padding: 30px 0; }

	
	.imgadlink_group2{
		width: calc( 95% / 2);
		margin: 10px calc( 5% / 4);
	}
	.adimg2 a div{ height: 32vw; }
	.adtxt a > span{
		font-size: 1.25rem;
	}

	.round_box{
		display: block;
		width: calc(90% / 2);
		margin: 20px calc(10% / 4);
		position: relative;
		transition: all .3s;
		border-radius: 50%;
	}



	.alltours_boxL, .alltours_boxR{
		width: 95%;
		margin: 10px auto;
		text-align: center;
	}
	.alltours_boxL h1{ text-align: center; }

}