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

/* 以下是 圖示文字 的 CSS */
@import url('/webeip/HT00100/peggy/fonticons/css/style.css');

/* 以下是 bodywrap1、bs_depPost1、bodywrap3 的 en style */
@import url('https://fonts.googleapis.com/css?family=Quicksand&display=swap');

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

.bodywrap_main{
	width: 95%;
    max-width: 1200px;
    margin: 0 auto 80px;
}
.bodywrap_title{
	width: 100%;
    text-align: right;
    margin: 30px auto 20px;
}
.bodywrap_title > h2{
	width: 100%;
	display: flex;
	justify-content: center;
	align-items: center;
	border-bottom: 2px solid #e42e8e;
	padding: 0 20px;
	box-sizing: border-box;
}
.bodywrap_title_en{
	display: inline-block;
	text-align: center;
	letter-spacing: 0.05rem;
	padding: 0.5rem 0.1rem 0.5rem 0.35rem;
	box-sizing: border-box;
	font-weight: normal;
	font-family: 'Quicksand', sans-serif;
}
.bodywrap_title_btn{
	display: inline-block;
	text-align: right;
	width: 10%;
	border-top: 5px solid #b5b5b5;
	box-sizing: border-box;
	font-family: 'Quicksand', sans-serif;
	font-size: 1.25rem;
	letter-spacing: 5px;
	color: #e42e8e;
	font-weight: bold;
	transition: all .5s;
}
.bodywrap_title_btn:hover{
	width: 100%;
	letter-spacing: 10px;
}

.bodywrap_subtitle{
	text-align: center;
    letter-spacing: 5px;
    padding-left: 5px;
    box-sizing: border-box;
    font-size: 1.5rem;
    margin: 10px 0;
}
.bodywrap_subtitle > span{
	display: inline-flex;
    justify-content: center;
    align-items: center;
    color: #fff;
    width: 45px;
    height: 45px;
    box-sizing: border-box;
    border-radius: 50%;
    margin-right: 10px;
    padding-left: 5px;
}
.bodywrap_subtitle.one > span{
	background-color: #2380b8;
	border: 5px solid #195f89;
}
.bodywrap_subtitle.two > span{
	background-color: #aacd06;
    border: 5px solid #24953b;
}
.bodywrap_subtitle.three > span{
	background-color: #f18608;
    border: 5px solid #9f5d0f;
}

/* 站內活動快報(圖文日期)--最新促銷 */
	.ShowImgUrlLink_main{
		width: 100%;
		max-width: 1200px;
		margin: 0 auto;
		display: flex;
		flex-wrap: wrap;
		align-items: stretch;
		justify-content: flex-start;
		min-height: 200px;
	}
	.ShowImgUrlLink_box{
		width: calc(98%/4);
		margin: 10px calc(2%/8);
		padding: 5px;
		box-sizing: border-box;
		transition: all .2s;
		position: relative;	
	}
	.ShowImgUrlLink_img{
		display: flex;
		align-items: center;
		justify-content: center;
	}
	.ShowImgUrlLink_img > img{
		vertical-align: top;
		width: 100%;
	}

	.ShowImgUrlLink_content{
		width: 100%;
		background-color: #fff;
		padding: 5px;
		box-sizing: border-box;
		box-shadow: 0 0 5px rgba(0,0,0,10%);
	}
	.ShowImgUrlLink_title{
		width: 100%;
		text-align: center;
		padding: 0.25rem 0;
		box-sizing: border-box;
		font-size: 1.2rem;
		overflow: hidden;
		white-space: nowrap;
		text-overflow: ellipsis;
		display: -webkit-box;
		-webkit-line-clamp: 2;
		-webkit-box-orient: vertical;
		white-space: normal;
	}
	.ShowImgUrlLink_startdate{
		display: inline-block;
		padding: 0.25px 0.25px 2.25px 1.75px;
		color: #777;
		font-family: 'Quicksand', sans-serif;
		letter-spacing: 1.5px;
		border-bottom: 2px solid #ddd;
		box-sizing: border-box;
	}
/* 圖示團體旅遊 */
	.travelteam_main{
		width: 100%;
		max-width: 1200px;
		min-height: 200px;
		margin: 0 auto;
		display: flex;
		flex-wrap: wrap;
		align-items: stretch;
		justify-content: flex-start;
	}
	.travelteam{
		width: calc(98%/4);
		margin: 10px calc(2%/8);
		padding: 5px;
		box-sizing: border-box;
		transition: all .2s;
		position: relative;
	}
	.travelteam_img{
		width: 100%;
		display: block;
	}
	.travelteam_img_img{
		display: flex;
		align-items: center;
		justify-content: center;
		
	}
	.travelteam_img_img img{
		width: 100%;
		vertical-align: top;
	}
	.travelteam_img_noimg{
		display: flex;
		align-items: center;
		justify-content: center;
		width: 100%;
		height: 180px;
		background-color: #DDD;
	}
	.travelteam_img_noimg > span{
		font-size: 3rem;
		color: #FFF;
	}
	.travelteam_content{
		width: 100%;
		box-shadow: 0 0 5px rgb(0 0 0 / 10%);
		box-sizing: border-box;
	}
	.travelteam_title{
		display: block;
		width: 100%;
		text-align: center;
		padding: 0.5rem;
		box-sizing: border-box;
		font-size: 1.2rem;
		line-height: 2rem;
		min-height: 5rem;
		color: #111;

		overflow: hidden;
		white-space: nowrap;
		text-overflow: ellipsis;
		display: -webkit-box;
		-webkit-line-clamp: 2;
		-webkit-box-orient: vertical;
		white-space: normal;
		background-color: #fff;
	}
	.travelteam_price{
		font-size: 1.1rem;
		color: #f44336;
		text-align: right;
		background-color: #fff;
		padding-right: 5px;
		box-sizing: border-box;
	}
	.travelteam_desc{
		width: 100%;
		min-height: 100px;
		font-size: 1rem;
		line-height: 1.5rem;
		padding: 0 0.5rem;
		box-sizing: border-box;
		color: #888;
		text-align: justify;

		overflow: hidden;
		white-space: nowrap;
		text-overflow: ellipsis;
		display: -webkit-box;
		-webkit-line-clamp: 7;
		-webkit-box-orient: vertical;
		white-space: normal;
	}

/* 聯絡我們 */
	.contact_main{
		width: 100%;
		max-width: 1500px;
		min-width: 1200px;
		margin: 100px auto 200px;
		display: flex;
		flex-wrap: wrap;
		justify-content: center;
		align-items: center;
	}
	.contact_box{
		width: 35%;
		margin: 0 2.5%;
		text-align: center;
	}

	.contact_logo{
		display: block;
		font-size: 1.75rem;
		width: 100%;
		color: #227fb8;
		font-weight: bold;
		margin-bottom: 50px;
		transition: all .5s;
	}
	.contact_logo > img{
		vertical-align: top;
		width: 100%;
		transition: all .5s;
	}

	.contact_link{
		width: 100%;
		margin: 10px 0;
	}
	.contact_link > ul{
		display: flex;
		justify-content: center;
		align-items: center;
	}
	.contact_link > ul li a{
		display: inline-block;
		color: #13a6ae;
		font-size: 2.5rem;
		padding: 5px;
		box-sizing: border-box;
		margin: 5px;
		transition: all .3s;
	}
	.contact_link ul li .contact_link_fb:hover{ color: #3B559F; }
	.contact_link ul li .contact_link_line:hover{ color: #4ECD00; }
	.contact_link ul li .contact_link_ig:hover{
		background: #E3297D;
	    background: -webkit-linear-gradient( -120deg, #7D36AE 0%, #D82F81 30%, #F80A00 70%, #F7D903 100% );
	    background: -o-linear-gradient( -120deg, #7D36AE 0%, #D82F81 30%, #F80A00 70%, #F7D903 100% );
	    background: linear-gradient( -120deg, #7D36AE 0%, #D82F81 30%, #F80A00 70%, #F7D903 100% );
	    -webkit-background-clip: text;
	    -webkit-text-fill-color: transparent;
	}

	.contact_content{
		width: 100%;
		padding: 20px;
		box-sizing: border-box;
		border-bottom: 1px solid #13a6ae;
		font-size: 1.25rem;
		text-align: left;
	}

	.contact_googlemap{
		position: relative;
		width: 55%;
		margin: 1rem 2.5%;
		padding-bottom: 30%;
	}
	.contact_googlemap iframe{
		position: absolute;
		top: 0;
		left: 0;
		right: 0;
		bottom: 0;
		width: 100%;
		height: 100%;
	}
@media (max-width: 768px)
{
	.travelteam, .ShowImgUrlLink_box{
		width: calc(98% / 3);
    	margin: 10px calc(2% / 6);
	}

}

@media (max-width: 480px)
{
	.travelteam, .ShowImgUrlLink_box{
		width: calc(98% / 2);
    	margin: 10px calc(2% / 4);
	}
}