@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: top 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: 10px;
	}
	.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/HT00422/img/arrow-right-w.svg);
	}
	.carousel10-button-prev, .swiper-container-rtl .carousel10-button-next{
		background-image: url(/webeip/HT00422/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;
	}
}
/* 跑馬燈 */
	.adlinkBtn{
		width: 100%;
		z-index: 99;
		padding: 0 20px;
		box-sizing: border-box;
		background-color: rgb(243 216 33 / 80%);
	}
	.adlinkBtn_swiper{
		display: flex;
		justify-content: center;
		align-items: center;
		height: 40px;
	}
	.adlinkBtn_box{
		display: flex;
		justify-content: center;
		align-items: center;
		color: #000;
		letter-spacing: 5px;
		padding-left: 5px;
		box-sizing: border-box;
	}
	.adlinkBtn_boxTXT{
		overflow: hidden;
		text-overflow: ellipsis;
		display: -webkit-box;
		-webkit-line-clamp: 1;
		-webkit-box-orient: vertical;
		white-space: normal;
	}
	.adlinkBtn_boxMORE{
		margin: 0 10px;
	}
.search_box{
		width: 95%;
		max-width: 1000px;
		margin: 0 auto;
		padding: 100px 0 60px;
		box-sizing: border-box;
		position: relative;
		display: flex;
		flex-wrap: wrap;
		justify-content: center;
		align-items: flex-start;
	}
	/*.search_box h2{
		width: 100%;
		text-align: center;
		margin-bottom: 20px;
		font-size: 2rem;
		letter-spacing: 10px;
		padding-left: 10px;
		box-sizing: border-box;
		display: none;
	}
	.search_box_form{
		width: 100%;
		display: flex;
		justify-content: flex-start;
		align-items: stretch;
		margin-bottom: 10px;
	}
	.search_box_input{
		width: 90%;
		padding: 15px;
		box-sizing: border-box;
		font-size: 1.3rem;
		border: none;
		border-radius: 10px 0 0 10px;
	}
	.search_box_button{
		width: 10%;
		display: flex;
		justify-content: center;
		align-items: center;
		font-size: 1.3rem;
		background-color: #ff756b;
		color: #ffffff;
		letter-spacing: 10px;
		padding-left: 10px;
		font-weight: bold;
		transition: all .3s;
		border-radius: 0 10px 10px 0;
		box-sizing: border-box;
	}
	.search_box_button:hover{
		background-color: #2196f3;
		color: #fff;
	}*/
	.search_cala{
		width: 48%;
	    margin: 0 1%;
	    max-width: 480px;
	}
	.search_cala > iframe{
		width: 100%;
		height: 135px;
		padding-top: 20px;
		border: 1px solid #c8c8c8;
		box-shadow: 0 0 5px rgb(0 0 0 / 30%);
		border-radius: 0 0 5px 5px;
		background-color: #fff;
	}
	/* 廣告連結 */
		.adlink_trip{
			width: 100%;
			display: flex;
			flex-wrap: wrap;
			justify-content: flex-start;
			align-items: center;
		}
		.adlink_trip > h3{
    		border-bottom: 1px solid #e6e6e6;
    		margin-right: 10px;
    		margin-bottom: 5px;
    		padding: 5px 5px 5px 10px;
    		box-sizing: border-box;
			font-weight: normal;
			letter-spacing: 2px;
			box-sizing: border-box;
		}
		.adlinkbox_box > a{
			display: inline-block;
			padding: 5px;
			background-color: #f2b55b;
			color: #fff;
			border-radius: 5px;
			margin-right: 10px;
			margin-bottom: 5px;
			font-size: 1.15rem;
			transition: all .3s;
			box-sizing: border-box;
		}
		.adlinkbox_box > a:hover{
			background-color: #ff9800;
		}
	/* 廣告連結 */
		.link_box{
			width: 48%;
			margin: 0 1%;
		}
		.adlink{
			display: flex;
			flex-wrap: wrap;
			justify-content: center;
			align-items: center;
		}
		.adlink > a{
			width: 48%;
			margin: 0 1% 10px;
			padding: 5px 5px 5px 10px;
			box-sizing: border-box;
			text-align: center;
			color: #000;
			background-color: #f6f6f6;
			letter-spacing: 5px;
			font-size: 1.15rem;
			-webkit-transform: perspective(1px) translateZ(0);
			transform: perspective(1px) translateZ(0);
			-webkit-transition-duration: 0.3s;
			transition-duration: 0.3s;
			-webkit-transition-property: transform;
			transition-property: transform;
			border-bottom: 1px solid #9f9f9f;
			transition: all .3s;
		}
		/*.adlink > a:before{
			pointer-events: none;
			position: absolute;
			z-index: -1;
			content: '';
			top: 100%;
			left: 5%;
			height: 10px;
			width: 90%;
			opacity: 0;
			background: -webkit-radial-gradient(center, ellipse, rgba(0, 0, 0, 0.35) 0%, rgba(0, 0, 0, 0) 80%);
			background: radial-gradient(ellipse at center, rgba(0, 0, 0, 0.35) 0%, rgba(0, 0, 0, 0) 80%);
			-webkit-transition-duration: 0.3s;
			transition-duration: 0.3s;
			-webkit-transition-property: transform, opacity;
			transition-property: transform, opacity;
		}*/
		.adlink > a:nth-child(7), .adlink > a:nth-child(8){ margin: 0 1% 0; }
		.adlink > a:hover, .adlink > a:focus, .adlink > a:active{
			-webkit-transform: translateY(-5px);
    		transform: translateY(-5px);
    		border-radius: 10px;
		}
		/*.adlink > a:hover:before, .adlink > a:focus:before, .adlink > a:active:before{
			opacity: 1;
		    -webkit-transform: translateY(5px);
		    transform: translateY(5px);
		}*/
.body_title{
	width: 95%;
	max-width: 1000px;
	margin: 40px auto 0;
	display: flex;
	justify-content: space-between;
	align-items: flex-end;
	padding-bottom: 5px;
    border-bottom: 1px solid #e6e6e6;
    box-sizing: border-box;
}
.body_title > h2{
	font-size: 1.75rem;
    font-weight: normal;
    letter-spacing: 2px;
    padding-left: 2px;
    box-sizing: border-box;
}
.body_title > span{
	display: inline-block;
	font-size: 0.95rem;
}
.body_title > span i{
	display: inline-block;
	margin-left: 5px;
}
/* 圖像廣告連結 */
	.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: 1000px;
		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% / 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%);
		}
		.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: 1000px;
		margin: 0 auto;
		padding: 30px 0 50px;
	}
	/* 圖示站內 */
		.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%;
		}
.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;
}
/* 圖像廣告連結2 */
	.imgadlink_main2{
		width: 100%;
		margin: 0 auto;
		display: flex;
		flex-wrap: wrap;
		justify-content: flex-start;
		align-items: flex-start;
	}
	.imgadlink_group2{
		display: block;
		width: calc(100% / 4);
		position: relative;
		transition: all .3s;
	}
	.adimg2{
		display: block;
		position: relative;
		transition: all .5s;
		overflow: hidden;
	}

	.adimg2 a{
		display: flex;
		align-items: center;
		justify-content: center;
		width: 100%;
		position: relative;
	}
	.adimg2 a img{
		vertical-align: top;
		width: 100%;
	}
	.adiframe2{
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
	}
	.adtxt2{
		width: 100%;
	}	
	.adtxt2 > a{
		display: block;
		width: 100%;
		
	}
	.adtxt2 > a span{
		width: 100%;
		padding: 5px;
		box-sizing: border-box;
		font-size: 1.15rem;
		color: #fff;
		position: absolute;
		bottom: 0;
		left: 0;
		background-color: rgba(0,0,0,.5);
		transition: all .3s;
	}
	.imgadlink_group2:hover .adtxt2 > a span{ opacity: 0; }

	.adexplain2{
		display: flex;
		justify-content: center;
		align-items: center;
		width: 100%;
		height: 100%;
		padding: 0 10px 5px;
		box-sizing: border-box;
		color: #fff;
		background-color: rgb(0 0 0 / 50%);
		font-size: 1.75rem;
	}
@media screen and (max-width: 1031px){
	.search_cala{
		width: 98%;
    	margin: 0 auto 30px;
	}
	.news_box, .link_box{
		width: 98%;
	}
}
@media screen and (max-width: 768px){

	.search_box{
		padding: 50px 0 0;
	}

	.ShowImgUrlLink_box2, .travelteam{
		width: calc(90% / 2);
		margin: 10px calc(10% / 4);
	}
	.alltours_boxL, .alltours_boxR{
		width: 95%;
		margin: 10px auto;
		text-align: center;
	}
	.alltours_boxL h1{ text-align: center; }
	.imgadlink_group2{
		width: 50%;
	}

}