/*--------------copyright by alva start-------------------------------*/
* {
    padding: 0px;
    margin: 0px;
}

ul {
    margin-bottom: 0px;
	list-style:none;
}

body {
    font-family:Arial, sans-serif, "微軟正黑體", "Microsoft JhengHei";
    position: relative;
    font-size: 15px;
	line-height:30px;
	letter-spacing:1px;
	color: rgba(51,51,51,1);
	background: rgb(241, 241, 241) !important;
}

a {
    display: block;
	color:#333;
}
a:hover {
	text-decoration:none;
}
.clear {
	clear:both;
}
td {
	vertical-align:top;
}


/****************************************************************************************************************************************/
/*********************************************************************************************************************************************/
/*gotop*/
#gotop {
	position: relative;
	text-align:center;
	cursor:pointer;
	z-index:3;
	margin:0 auto;
	position: absolute;
    bottom: 0;
    left: calc(50% - 94.5px);
}
	@media screen and (max-width:500px) {
		#gotop {
			width:35%;
			left:33%;
		}
		#gotop img {
			width:100%;
			vertical-align:bottom
		}
	}
/*********************************************************************************************************************************************/
/*********************************************************************************************************************************************/
/*----navbar area-------------------------------------------------------------------------------------------------------------------*/
.navbar {
	background:#fff;
	margin:0;
	padding:0% 0%;
	box-shadow:0px 0px 10px rgba(0,0,0,.3);
	position:fixed;
	top:0;
	left:0;
	width:100vw;
	min-height:inherit;
	z-index:9;
	border-radius:0px;
}
	/*logo*/
	.logo {
		display:inline-block;
		text-align:center;
		width:100%;
		vertical-align:middle;
	}
	/*ibuttons*/
	.ibuttons {
		display:inline-block;
		text-align:right;
		width:70%;
		vertical-align:middle;
	}
		/*mibutton*/
		.mibutton {
			position: fixed;
			top: 6px;
			right:10px;
			width: 50px;
			height: 40px;
			padding: 0 10px;
			border-radius: 7px;
			font-size: 12px;
			z-index: 10;
			cursor: pointer;
			display: none;
			border-radius: 2px 0px 2px 2px;
		}
			.mibutton span {
				display: inline-block;
				width: 30px;
				height: 2px;
				background: #000;
				transition: .3s ease all;
				position: absolute;
				left: 11px;
				-webkit-filter:drop-shadow(2px 2px 1px rgb(243, 177, 0,.5));
				filter: drop-shadow(2px 2px 1px rgb(243, 177, 0,.5));
			}
			.mibutton span:nth-child(1) {
				top: 10px;
			}
			.mibutton span:nth-child(2) {
				top: 19px;
			}
			.mibutton span:nth-child(3) {
				top: 28px;
			}
		/*close*/
		.close {
			display:none;
		}
		.ibuttons ul {
		}
			.ibuttons li {
				display:inline-block;
				text-align:center;
				vertical-align:top;
				position: relative;
				width: 11%;
				border-left: solid 1px #a2a2a2;
				padding: 0% 1% 2% 1%;
				overflow:hidden;
				overflow:hidden;
			}
			.ibuttons li img {
				padding: 20% 0 22% 0;
				transition:.3s ease all;
			}
			h1 {
				color:#777777;
				font-size:15px;
				margin:0;
				transition:.3s ease all;
			}
			h2 {
				color:#777777;
				font-size:14px;
				margin:0;
				position:absolute;
				bottom:-35px;
				left:0%;
				width:100%;
				opacity:0;
				transition:.3s ease all;
			}
				.ibuttons li:hover h1 {
					transform: translateY(-10px);
					opacity:0;
				}
				.ibuttons li:hover h2 {
					bottom:20%;
					opacity:1;
				}
				.ibuttons li:hover img {
					transform:scale(1.1);
					-webkit-filter: drop-shadow(8px 8px 7px rgba(0, 0, 0, 0.5));
					filter: drop-shadow(8px 8px 7px rgba(0, 0, 0, 0.5));
				}
				@media screen and (max-width:1700px) {
					.ibuttons li {
						width:12%;
					}
				}
				@media screen and (max-width:1525px) {
					.navbar {
						padding:0 0;
					}
				}
				@media screen and (max-width:1400px) {
					.ibuttons {
						width:74%;
					}
				}
				@media screen and (max-width:1310px) {
					.mibutton {
						display:block;
					}
					.ibuttons {
						position:fixed;
						height:100vh;
						width:100%;
						top:0;
						right:0;
						background:rgba(255,255,255,.9);
						text-align:left;
						visibility: hidden;
						opacity: 0;
						-webkit-transform: scale(0.9);
						transform: scale(0.9);
						-webkit-transition: -webkit-transform 0.2s, opacity 0.2s, visibility 0s 0.2s;
						transition: transform 0.2s, opacity 0.2s, visibility 0s 0.2s;
					}
						.ibuttons ul {
							width: 75%;
							margin: 0 auto;
							padding:20vh 0;
							opacity:0;
							-webkit-transition: opacity 0.3s 0.5s;
							transition: opacity 0.3s 0.5s;
						}
							.ibuttonshow ul {
								opacity: 1;
								-webkit-transition-delay: 0.5s;
								transition-delay: 0.5s;
							}
						.close {
							opacity:0;
							-webkit-transition: opacity 0.3s 0.5s;
							transition: opacity 0.3s 0.5s;
						}
							.ibuttonshow .close {
								opacity: 1;
								-webkit-transition-delay: 0.5s;
								transition-delay: 0.5s;
							}
						.ibuttons li {
							width:32%;
							border:none;							
						}
						.close {
							display:block;
							display: block;
							opacity: 1;
							padding: 1% 2%;
							font-size: 30px;
							color: #919191;
							font-weight: normal;
						}
						h2 {
							position: relative;
							opacity:1;
							bottom:0;
							padding:2% 0;
						}
							.ibuttons li:hover h1 {
								transform: translateY(0px);
								opacity:1;
							}
							.ibuttons li:hover h2 {
								position: relative;
								opacity:1;
							}
					.ibuttonshow {
						visibility: visible;
						opacity: 1;
						-webkit-transform: scale(1);
						transform: scale(1);
						-webkit-transition: -webkit-transform 0.4s, opacity 0.4s;
						transition: transform 0.4s, opacity 0.4s;
						z-index:99;
						background-image: linear-gradient(to top, hsla(39, 45%, 91%, 0.5) 0%, white 100%);
					}
					.logo {
						padding:0 0;
					}
					.ibuttons li img {
						padding: 16% 0 10% 0;
						-webkit-filter: drop-shadow(8px 8px 7px rgba(0, 0, 0, 0.7));
						filter: drop-shadow(8px 8px 7px rgba(0, 0, 0, 0.7));
					}
				}
				@media screen and (max-width:700px) {
					.logo {
						width: 100%;
						text-align: left;
					}
						.logo img {
							width:50%;
						}
				}
				@media screen and (max-width:550px) {
					.logo img {
						width:55%;
					}
					.mibutton {
						top:3px;
						right:4px;
					}
				}
				@media screen and (max-width:450px) {
					.logo img {
						width:62%;
					}
					.mibutton {
						top:3px;
						right:4px;
					}
					.ibuttons ul {
						width:90%;
					}
					.close {
						padding:1% 3%;
					}
				}
				@media screen and (max-width:400px) {
					.logo {
						padding:3% 0;
					}
					.logo img {
						width:70%;
					}
					h1 {
						font-size:14px;
					}
					h2 {
						font-size:12px;
					}
					.ibuttons li {
						padding:2%;
					}
					.ibuttons li img {
						padding: 16% 0 20% 0;
					}
					.mibutton {
						top: 1px;
						right: 4px;
					}
				}
/*---wrapper----------------------------------------------------------------------------------------------------------------------------------*/
#wrapper {
	background:#fff;
	width:1420px;
	margin:0 auto;
	text-align:center;
	padding:4% 0 0 0;
	background:url(../../images/line_bg.png) top center no-repeat,#fff;
	background-size:auto;
}
	#wrapper.inner {
		background:#fff;
		position:relative;
	}
	/*top*/
	#top {
	}
		/*t_left*/
		.left {			
			width:50%;
			float:left;
			text-align:right;
			padding:0 0 0 3%;
		}

		.t_left {
			background:rgba(191, 188, 188, 0.6);
			overflow-y: scroll;
			height: 2094px;	
		}
					/*service_ad*/
			.service_ad {
				position:relative;
				width:95%;
				cursor:pointer;
				box-shadow:0px 0px 10px rgba(0,0,0,.3);
				transition:.3s ease-in;
				margin-top: -9%;
			}
				/*service_title*/
				.service_title {
					position: relative;
					padding:22% 0 0 0;
					text-align:left;
				}
					.service_title img {
					}
				/*vmore*/
				.vmore {
					color: #fff;
					background: rgba(0,0,0,.6);
					padding: 4% 2%;
					position: absolute;
					bottom: 15%;
					right: -32px;
					width: 30%;
					text-align: center;
					box-shadow:0px 0px 10px rgba(0,0,0,.3);
					transition:.2s ease-in;
				}
					.vmore img {
						padding-left:6%;
						animation:vmove alternate infinite;
					}
					@keyframes vmove {
						0% {
							transform:translateX(10px);
						}
						100% {
							transform:translateX(0px);
						}
					}
			.ad1 {
				background:url(../../images/ad_bg1.jpg) top center no-repeat;
				background-size:107%;
			}
			.ad2 {
				background:url(../../images/ad_bg2.jpg) top center no-repeat;
				background-size:107%;
				margin:5% 0 0 0;
			}
			.ad3 {
				background:url(../../images/ad_bg3.jpg) top center no-repeat;
				background-size:107%;
			}
			.ad4 {
				background:url(../../images/ad_bg4.jpg) top center no-repeat;
				background-size:107%;
			}
			.ad5 {
				background:url(../../images/ad_bg5.jpg) top center no-repeat;
				background-size:107%;
			}
			.ad6 {
				background:url(../../images/ad_bg6.jpg) top center no-repeat;
				background-size:107%;
			}
			/*ad5 ad6*/
			.ad5,.ad6 {
				display: inline-block;
				vertical-align: top;
				width: 45%;
				margin: 3% 4% 0 0;
				z-index: 8;
			}
			@media screen and (max-width:910px) {
				.ad5, .ad6 {
					width:41%;
				}
			}
			@media screen and (max-width:900px) {
				.bottom_ad {
					padding:0 11% 0 0;
				}
				.ad5, .ad6 {
					width:100%;
					margin:5% 0 0 0;
				}
			}
				/*hover*/
				.service_ad:hover {
					background-size:115%;
					box-shadow: 0px 5px 20px rgba(0,0,0,.8);
				}
				.service_ad:hover .vmore {
					text-decoration: line-through;
					box-shadow: 0px 0px 20px rgb(255, 255, 255,.7);
					border-radius:15px;
				}
				.service_ad:hover .vmore img {
					animation:vmove .5s alternate infinite;
				}
				/*imgflash*/
				@keyframes imgflash {
					0% {
						opacity:.4;
					}
					100% {
						opacity:1;
					}
				}
			/*title*/
			.title {
				padding:6% 0 5% 0;
			}
				.title img {
				}
			.title1 {
			}
			/*season***legal*/
			.season,.legal {
				text-align:center;
				width:100%;
				box-shadow:0px 0px 10px rgba(0,0,0,.3);
				position:relative;
				overflow:hidden;
			}
				.season a:after,.legal a:after {
					content:'';
					position: absolute;
					top:0;
					left:0;
					width:100%;
					height:100%;
					background-image: linear-gradient(to right, #eea2a2 0%, #bbc1bf 19%, #57c6e1 42%, #b49fda 79%, #7ac5d8 100%);
					transition:.3s ease-in-out;
					opacity:0;
					z-index:3;
				}
				.legal a:after {
					background-image: linear-gradient(to right, #fa709a 0%, #fee140 100%);
				}
				.season_title,.legal_title {
					padding:30% 0 0 0;
					z-index:3;
					position:relative;
				}
				.season_title {
					padding:7% 0 0 0;
				}
					.season_title img,.legal_title img {
						transition:.2s ease-in-out;
					}
			.season1 {
				background:url(https://house.ilantravel.com.tw/mobile/images/season_bg1.jpg) top center no-repeat;
				background-size:cover;
			}
			.season2 {
				background:url(https://house.ilantravel.com.tw/mobile/images/season_bg2.jpg) top center no-repeat;
				background-size:cover;
			    margin-top: 5%;
			}
			.season3 {				
				background: none;
				position: relative;
				text-align: center;
			}
			.season4 {
				background:url(https://house.ilantravel.com.tw/mobile/images/season_bg4.jpg) top center no-repeat;
				background-size:cover;
				margin-top: 5%;
			}
				/*hover*/
				.season:hover .season_title img,.legal:hover .legal_title img {
					webkit-filter: drop-shadow(0px 0px 3px rgba(255, 255,255, 1));
					filter: drop-shadow(0px 0px 3px rgba(255, 255,255, 1));
				}
				.season a:hover:after,.legal a:hover:after {
					opacity:.2;
				}
			/*legal*/
			.legal {
				background:url(../../images/legal_bg.jpg) top center no-repeat;
				background-size:cover;
			}
				.legal_title {
				}
		/*t_right*/
		.t_right {
			width:50%;
			text-align:left;
			display:inline-block;
			padding:4% 4% 0 2%;					
		}
			/*package*/
			.package {
				background:url(../../images/package_bg.jpg) top center no-repeat;
				background-size:cover;
				position:relative;
				text-align:center;
			}
				.package a:after {
					content:'';
					position: absolute;
					top:0;
					left:0;
					width:100%;
					height:100%;
					background-image: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
					transition:.3s ease-in-out;
					opacity:0;
				}
				.package_title {
					padding:30% 0;
				}
					.package_title img {
						transition:.2s ease-in-out;
					}
					/*hover*/
					.package:hover .package_title img {
						webkit-filter: drop-shadow(0px 0px 3px rgba(255, 255,255, 1));
						filter: drop-shadow(0px 0px 3px rgba(255, 255,255, 1));
					}
					.package a:hover:after {
						opacity:.2;
					}
			/*theme*/
			.theme {
			}
				.theme ul {
					text-align:right;
				}
					.theme li {
						display:inline-block;
						width:48%;
						padding:2%;
						vertical-align:top;
						text-align:center;
					}
						.theme a {
							position:relative;
							box-shadow:0px 0px 5px rgba(0,0,0,.5);
						}
							.theme a:after {
								content: '';
								position: absolute;
								top: 4%;
								left: 4%;
								width: 92%;
								height: 92%;
								border: solid 1px #fff;
								margin: 0;
								transition:.3s ease-in-out;
							}
							.theme img {
								padding:34% 0;
								position:relative;
								z-index:2;
							}
							.theme1 {
								background:url(../../images/theme_bg1.jpg) top center no-repeat;
								background-size:cover;
							}
							.theme2 {
								background:url(../../images/theme_bg2.jpg) top center no-repeat;
								background-size:cover;
							}
							.theme3 {
								background:url(../../images/theme_bg3.jpg) top center no-repeat;
								background-size:cover;
							}
							.theme4 {
								background:url(../../images/theme_bg4.jpg) top center no-repeat;
								background-size:cover;
							}
							.theme5 {
								background:url(../../images/theme_bg5.jpg) top center no-repeat;
								background-size:cover;
							}
							.theme6 {
								background:url(../../images/theme_bg6.jpg) top center no-repeat;
								background-size:cover;
							}
							/*hover*/
							.theme a:hover:after {
								border: none;
								background:rgba(0,0,0,.5);
								box-shadow:0px 0px 10px rgba(255,255,255,.3);
							}
							.theme a:hover img {
								animation:imgflash 1s;
							}
							@media screen and (max-width:1530px) {
								#wrapper {
									width:90%;
									padding: 6% 0 0 0;
									background-size:contain;
								}
								.service_ad {
									text-align:left;
								}
								.service_title {
									position: relative;
									bottom: 0;
									left: 0;
									padding: 26% 0 0 0;
								}
								.ad1,.ad2,.ad3,.ad4,.ad5,.ad6 {
									background-size:cover;
								}
								.service_ad:hover {
									background-size:cover;
								}
								.title img {
									width: 100%;
								}
								.t_right {
									height:auto;
									overflow: visible;
								}
								.left {
									padding: 0 0 14px 5%;									
								}
								.t_left {
									height:auto;								
								}
							}
							@media screen and (max-width:1400px) {
								.service_title img {
									width: 72%;
								}
							}
							@media screen and (max-width:1200px) {
								#wrapper {
									padding: 7% 0 0 0;
								}
								.service_title {
									padding:27% 0 0 0;
								}
								.vmore {
									right:-24px;
								}
								.vmore img {
									width:15%;
								}
								.service_title img {
									width: 68%;
								}
								.legal_title {
									padding: 35% 0 0 0;
								}
								.season_title {
									padding:10% 0 0 0;
								}
								.season_title img, .legal_title img {
									width:45%;
								}
								.theme li {
									width:49%;
								}
								.theme img {
									width:55%;
									padding:35% 0;
								}
								.package_title img {
									width:50%;
								}
							}
							@media screen and (max-width:1050px) {
								#wrapper {
									padding: 8% 0 0 0;
								}
								.left {
									padding:0 0 0 3%;
								}
								.t_right {
									padding:0 3% 0 2%;
								}
								.service_title img {
									width: 62%;
								}
								.vmore {
									width:35%;
								}
								.service_title {
									padding: 30% 0 0 0;
								}
							}
							@media screen and (max-width:900px) {
								#wrapper {
									width:75%;
									padding: 9% 0 0 0;
									background-size:100%;
								}
								.left {
									float:none;
									width:100%;
									padding: 0% 2% 0px 3%;
								}
								.t_left {
									padding: 0 6% 0 5%;
								}
								.t_right {
									width:100%;
									padding: 14% 3% 0px 3%;
								}
								.service_title img {
									width: 50%;
								}
								.season_title img, .legal_title img {
									width: 40%;
								}
								.package_title {
									padding: 27% 0;
								}
								.package_title img {
									width: 40%;
								}
								.theme ul {
									text-align: center;
								}
								.theme li {
									width:42%;
								}
							}
							@media screen and (max-width:600px) {
								#wrapper {
									width: 85%;
									padding: 10% 0 0 0;
								}
								.legal_title {
									padding: 30% 0 0 0;
								}
								.theme li {
									width: 47%;
								}
							}
							@media screen and (max-width:500px) {
								.t_left {
									padding: 0 6% 0 5%;
								}
							}
							@media screen and (max-width:470px) {
								#wrapper {
									width:90%;
									padding: 17% 0 0 0;
								}
								.vmore {
									font-size:12px;
								}
								/*.service_ad {
								margin-top: -16%;
								}*/
								
							}
							@media screen and (max-width:400px) {
								#wrapper {
									padding:18% 0 0 0;
									width:93%;
								}
								.vmore {
									width: 40%;
									right:-10px;
								}
								.season_title img, .legal_title img {
									width: 55%;
								}
								.package_title img {
									width: 50%;
								}
								.theme li {
									width: 49%;
								}
								.theme img {
									width:60%;
								}
								.service_ad {
								margin-top: 4%;
								}
								.left {
									padding: 2% 6% 0 5%;
								}
							}
	/*bottom*/
	#bottom {
	}
		/*middle*/
		#middle {
			padding:5% 0 0 0;
			position:relative;
			text-align:left;
		}
			#middle:after {
				position:absolute;
				content:'';
				top:34%;
				left:0;
				width:100%;
				background: rgba(191, 188, 188, 0.6);
				height:45%;
			}
			/*ad3*/
			.ad3 {
				display:inline-block;
				vertical-align:top;
				width:41%;
				z-index:5;
				margin:0 0 0 5%;
			}
			/*text1*/
			.text1 {
				display:inline-block;
				vertical-align:top;
				text-align:left;
				width:45%;
				padding: 4% 0 0 4%;
				font-size:16px;
				position:relative;
				z-index:5;
			}
				.text1 span {
					display:block;
					font-size:22px;
					font-style:italic;
					letter-spacing:3px;
				}
			/*sce*/
			.sce {
				text-align:left;
			}
				/*scetitle*/
				.scetitle {
					background:url(../../images/sce_bg.jpg) top center no-repeat;
					background-size:cover;
					text-align:center;
					width:45%;
					display:inline-block;
					vertical-align:bottom;
					margin: -3% 5% 0 0;
					z-index:5;
					position:relative;
				}
				.scetitle1 {
					background:url(../../images/sce_bg.jpg) top center no-repeat;
					background-size:cover;
					text-align:center;
					width:100%;
					display:inline-block;
					vertical-align:bottom;
					margin: 2% 2% 0 0;
					z-index:5;
					position:relative;
				}
					.scetitle a:after {
						content:'';
						position:absolute;
						top:0;
						left:0;
						width:100%;
						height:100%;
						background-image: linear-gradient(-225deg, #231557 0%, #44107A 29%, #FF1361 67%, #FFF800 100%);
						opacity:0;
						transition:.2s ease all;
					}
					.scetitle1 a:after {
						content:'';
						position:absolute;
						top:0;
						left:0;
						width:100%;
						height:100%;
						background-image: linear-gradient(-225deg, #231557 0%, #44107A 29%, #FF1361 67%, #FFF800 100%);
						opacity:0;
						transition:.2s ease all;
					}
					.scetitle img {
						padding:7% 0;
						-webkit-transform: perspective(1px) translateZ(0);
						transform: perspective(1px) translateZ(0);
						box-shadow: 0 0 1px transparent;
						-webkit-transition-duration: 0.5s;
						transition-duration: 0.5s;
					}
					.scetitle1 img {
						padding:7% 0;
						-webkit-transform: perspective(1px) translateZ(0);
						transform: perspective(1px) translateZ(0);
						box-shadow: 0 0 1px transparent;
						-webkit-transition-duration: 0.5s;
						transition-duration: 0.5s;
					}
					/*hover*/
					.scetitle a:hover img {
						webkit-filter: drop-shadow(0px 0px 3px rgba(255, 255,255,.5));
						filter: drop-shadow(0px 0px 3px rgba(255, 255,255,.5));
						transform:scale(1.08);
					}
					.scetitle1 a:hover img {
						webkit-filter: drop-shadow(0px 0px 3px rgba(255, 255,255,.5));
						filter: drop-shadow(0px 0px 3px rgba(255, 255,255,.5));
						transform:scale(1.08);
					}
					.scetitle a:hover:after {
						opacity:.1;
					}
					.scetitle1 a:hover:after {
						opacity:.1;
					}
				/*text2*/
				.text2 {
					display:inline-block;
					width:50%;
					vertical-align:bottom;
					text-align:right;
					font-style:oblique;
					font-size:16px;
					float:left;
					padding:14% 5% 0 0;
					position:relative;
					z-index:5;
				}
					.text2 span {
						display:block;
						font-size:24px;
					}
					@media screen and (max-width:1300px) {
						.scetitle img {
							width:40%;
						}
						.scetitle1 img {
							width:40%;
						}
					}
					@media screen and (max-width:900px) {
						#middle {
							text-align:center;
						}
						.ad3 {
							width:93%;
							margin:0;
						}
						.text1 {
							width:100%;
							padding:4%;
						}
						.sce {
							padding: 2% 0;
						}
						.scetitle {
							margin:0;
							width:100%;
						}
						.scetitle1 {
							margin:0;
							width:100%;
						}
						.scetitle img {
							width: 30%;
							padding:8% 0;
						}
						.scetitle1 img {
							width: 30%;
							padding:8% 0;
						}
						.text2 {
							width: 100%;
							float: none;
							padding: 4%;
						}
						#middle:after {
							top:21%;
						}
					}
					@media screen and (max-width:600px) {
						.scetitle img {
							width:35%;
						}
						.scetitle1 img {
							width:35%;
						}
					}
					@media screen and (max-width:400px) {
						.text1,.text2 {
							font-style:15px;
							line-height:25px;
						}
						.text1 span,.text2 span {
							font-size:20px;
							padding:2% 0;
						}
					}
		/*b_left*/
		.b_left {
			width: 50%;
			float: left;
			text-align: left;
			padding: 0 0 0 5%;
		}
			/*township*/
			.township {
			}
				.township ul {
				}
					.township li {
						display:inline-block;
						vertical-align:top;
						width:32%;
						padding:10px;
					}
						.township a {
							position:relative;
							webkit-filter: drop-shadow(0px 2px 3px rgba(0,0,0,.5));
							filter: drop-shadow(0px 2px 3px rgba(0,0,0,.5));
							transition:.2s ease-in-out;
						}
							.township a:before {
							}
							.township img {
								width:100%;
								transition:.2s ease-in-out;
							}
							/*hover*/
							.township a:hover img {
								-webkit-filter: contrast(2);
								filter: contrast(2);
							}
							.township a:hover {
								webkit-filter: drop-shadow(4px 4px 2px rgba(0,0,0,.5));
								filter: drop-shadow(4px 4px 2px rgba(0,0,0,.5));
							}
		/*b_right*/
		.b_right {
			width: 50%;
			text-align: left;
			display: inline-block;
			padding: 0 4% 0 10px;
			background: rgba(191, 188, 188, 0.6);
		}
			/*life*/
			.life {
			}
				.life ul {
				}
				.life1 {
					background:url(../../images/life_bg1.jpg) top center no-repeat;
					background-size:cover;
				}
				.life2 {
					background:url(../../images/life_bg2.jpg) top center no-repeat;
					background-size:cover;
				}
			/*text3*/
			.text3 {
				font-size:16px;
				padding: 14% 0 11% 20%;
			}
				.text3 span {
					display:block;
					font-style:italic;
					font-size:22px;
					letter-spacing:3px;
				}
				@media screen and (max-width:1200px) {
					.life img {
						width:25%;
					}
				}
				@media screen and (max-width:900px) {
					.b_left {
						float:none;
						width:100%;
						padding:0 5%;
					}
					.title {
						padding: 15% 0 5% 0;
					}
					.b_right {
						float:none;
						width:100%;
						padding: 0 7% 0 0px;
					}
					.township {
						padding-bottom: 5%;
					}
				}
				@media screen and (max-width:500px) {
					.b_left {
						padding:0 4%;
					}
					.township li {
						padding:5px;
					}
					.text3 {
						padding: 14% 0 11% 15%;
					}
				}
				@media screen and (max-width:425px) {
					.text3 {
						padding: 14% 5% 11%;
					}
					.township li {
						padding:3px;
					}

				}
/*wrap_link*/
#wrap_link {
	width: 1420px;
    margin: 0 auto;
	background:#fff;
	position:relative;
}
	@media screen and (max-width: 1530px) {
		#wrap_link {
			width: 90%;
		}
	}
	@media screen and (max-width: 900px) {
		#wrap_link {
			width: 75%;
		}
	}
	@media screen and (max-width: 600px) {
		#wrap_link {
			width: 85%;
		}
	}
	@media screen and (max-width: 470px) {
		#wrap_link {
			width: 90%;
		}
	}
	@media screen and (max-width: 400px) {
		#wrap_link {
			width: 93%;
		}
	}
/*---link-----------------------------------------------------------------------------------------------------------------------------------*/
.link {
	text-align:left;
	padding:0 5% 5%;
}
	/*links_area*/
	.links_area {
		text-align:center;
	}
		/*links*/
		.links {
			width:19.3333%;
			padding:0 5px 3%;
			display:inline-block;
			vertical-align:top;
		}
			/*links_title*/
			.links_title {
			}
				.links_title span {
					color:#fff;
					display:block;
					width:100%;
					font-size:18px;
					padding:4vh 0;
				}
			.links_title1 {
				background:url(../../images/links1.jpg) top center no-repeat;
				background-size:cover;
			}
			.links_title2 {
				background:url(../../images/links2.jpg) top center no-repeat;
				background-size:cover;
			}
			.links_title3 {
				background:url(../../images/links3.jpg) top center no-repeat;
				background-size:cover;
			}
			.links_title4 {
				background:url(../../images/links4.jpg) top center no-repeat;
				background-size:cover;
			}
			.links_title5 {
				background:url(../../images/links5.jpg) top center no-repeat;
				background-size:cover;
			}
			/*links_list*/
			.links_list {
				border:solid 1px #9fc5bd;
				text-align:left;
				padding:9% 8%;
				height:565px;
				overflow-y:scroll;
			}
				ul.s {
					list-style-type: circle;
					margin-left: 5px;
				}
					.links_list li {
						list-style-position:outside;
						font-size:12.5px;
					}
						.links_list li a {
							display:inline-block;
							transition:.2s ease-in;
							position:relative;
							background:#fff;
							vertical-align:top;
							line-height: 20px;
							padding: 5px 0;
						}
							.hvr-underline-from-center:before {
								background:#4ca28e;
								height:3px;
							}
							.hvr-underline-from-center:hover {
								color:#4ca28e;
							}
.link .title {
}
	.link .title img {
		width:auto;
	}
		@media screen and (max-width: 1200px) {
			.links {
				width:31%;
			}
			.links_list {
				height:400px;
			}
		}
		@media screen and (max-width: 900px) {
			.link .title img {
				width:100%;
			}
			.links {
				width: 32%;
			}
			.links_list {
				height:300px;
			}
		}
		@media screen and (max-width: 725px) {
			.links {
				width:48%;
				text-align:center;
			}
			.links_list {
				height:300px;
			}
			.links_area {
				text-align: left;
			}
		}
		@media screen and (max-width: 600px) {
			.link {
				padding: 0 3%;
			}
		}
		@media screen and (max-width: 425px) {
			.links {
				width:49%;
			}
			.links_list {
				height:180px;
			}
			.links_area {
				text-align: left;
			}
			.links_title span {
				font-size:15px;
			}
			ul.s {
				margin-left: 10px;
			}
		}
/*linkb_area*/
.linkb_area {
	text-align:center;
	padding:2% 0 5%;
}
	/*linkb*/
	.linkb {
		display:inline-block;
		vertical-align:top;
		width:49%;
		padding:0 10px;
	}
		/*linkb_title*/
		.linkb_title {
			text-align:center;
		}
		.linkb_title1 {
			background:url(../../images/linkb1.jpg) top center no-repeat;
			background-size:cover;
		}
		.linkb_title2 {
			background:url(../../images/linkb2.jpg) top center no-repeat;
			background-size:cover;
		}
			.linkb_title span {
				color:#fff;
				display:block;
				width:100%;
				font-size:18px;
				padding:4vh 0;
			}
		/*linkb_list*/
		.linkb_list {
			border:solid 1px #9fc5bd;
			text-align:left;
			padding:4% 5%;
			height:190px;
			overflow-y:scroll;			
		}
		.linkb_list2 {
			/*border:solid 1px #9fc5bd;*/
			text-align:left;
			padding: 4% 3%;
			height:147px;					
			font-size: 12.5px;	
			width: 95%;		
			line-height: 21px;
			background: rgb(243, 238, 191, 0.5);
			overflow: auto;
			-webkit-overflow-scrolling: touch;
			position: static;
			
		}

		.linkb_list2 img {
			display:none;
		}
		.linkb_list2 .col-md-3, .linkb_list2 .col-sm-4 , .linkb_list2 .col-xs-6 {
			/*width: 100%;*/
			padding-right: 0px;
            padding-left: 0px;
		}
			ul.b {
				list-style-type: disc;
				margin-left: 5px;
			}
				.linkb_list li {
					list-style-position:outside;
					font-size:12.5px;
					float:left;
					vertical-align:top;
					width:33%;
				}
				.linkb_list2 li {
					list-style-position:outside;
					font-size:12.5px;
					float:left;
					vertical-align:top;
					width:33%;
				}
					.linkb_list a {
						vertical-align:top;
						margin-right:20px;
						line-height:20px;
						display:inline-block;
						position:relative;
						background:#fff;
						padding: 5px 0;
					}
					.linkb_list2 a {
						vertical-align:top;
						line-height:20px;
						display:inline-block;
						position:relative;
						width:100%;
					}
					.linkb_list2 p {
						margin:0px;
						letter-spacing: 0px;
					}
					@media screen and (max-width: 1130px) {
						.linkb_list2 a {
						/*width:32%;*/
					}
					}
					@media screen and (max-width: 500px) {
						.linkb_list2 a {
						/*width:48%;*/					
                        padding-left: 5%;
					}					    
					}
					@media screen and (max-width: 980px) {
						.linkb {
							padding:0 4px;
						}
						.linkb_list li {
							width:50%;
						}
						.linkb_list2 li {
							width:50%;
						}
					}
					@media screen and (max-width: 700px) {
						.linkb {
							padding: 0 4px 6%;
							width:100%;
						}
					}
/****************************************************************************************************************************************/
/****************************************************************************************************************************************/
/****************************************************************************************************************************************/
/*---inbanner-----------------------------------------------------------------------------------------------------------------------------*/
.inbanner {
	min-height:571px;
	width:100%;
}
.inbanner1 {
	background:url(../../images/inbanner1.png) top center no-repeat;
	background-size:cover;
}
.inbanner2 {
	background:url(../../images/inbanner2.png) top center no-repeat;
	background-size:cover;
}
.inbanner3 {
	background:url(../../images/inbanner3.png) top center no-repeat;
	background-size:cover;
}
.inbanner4 {
	background:url(../../images/inbanner4.png) top center no-repeat;
	background-size:cover;
}
.inbanner5 {
	background:url(../../images/inbanner5.png) top center no-repeat;
	background-size:cover;
}
.inbanner6 {
	background:url(../../images/inbanner6.png) top center no-repeat;
	background-size:cover;
}
.inbanner7 {
	background:url(../../images/inbanner7.png) top center no-repeat;
	background-size:cover;
}
.inbanner8 {
	background:url(https://house.ilantravel.com.tw/mobile/images/inbanner8.png) top center no-repeat;
	background-size:cover;
}
	/*adblock*/
	.adblock {
		width:1280px;
		margin:0 auto;
		max-width:90%;
		text-align:left;
	}
		/*city*/
		.city {
			color:#303030;
			text-align:left;
			padding:3% 0 2%;
			display:inline-block;
			vertical-align:top;
			width:31%;
		}
			.city span {
				font-weight:bold;
				font-size:14px;
				display:block;
			}
				.fa-filter,.fa-images,.fa-th {
					color:#303030;
					width:auto;
					vertical-align: middle;
					padding: 0 1% 0 0;
				}
			/*option*/
			.option,.option2,.option3 {
				display:inline-block;
				vertical-align:top;
				border: solid 1px #CCC;
				border-radius:2px;
				width:85%;
				padding:0px 10px;
				position:relative;
				background:#fff;
				cursor:pointer;
			}
				.fa-caret-down {
					text-align:right;
					position:absolute;
					top:5px;
					right:5px;
					color: #666;
					z-index:8;
					font-size:16px;
				}
				.option ul,.option2 ul,.option3 ul {
					position: absolute;
					top: 30px;
					left: 0;
					width: 100%;
					z-index: 5;
					background: #fff;
					display:none;
					border: solid 1px #CCC;
					z-index:9;
				}
				ul.open,ul.open2,ul.open3 {
					height:100%;
					display:block;
					transition:.3s ease-out;
				}
					.option li,.option2 li,.option3 li {
						background: #fff;
						width: 100%;
						padding: 0px 10px;
						cursor:pointer;
					}
						.option li:hover,.option2 li:hover,.option3 li:hover {
							background:#f2f2f2;
						}
						.option li a:hover,.option2 li a:hover,.option3 li a:hover {
							color:#000;
						}
					.active {
						background:#f2f2f2 !important;
					}
		hr {
			border-top: 1px solid #303030;
			width:100%;
			margin-bottom:3%;
		}
.filtr-container div {
	padding:2% 10px;
}
	.filtr-container div:hover {
		animation:imgflash 1s;
	}
	.filtr-container img {
		max-width:100%;
	}
	
/*space*/
.space {
	height:10vh;
}
/*d_item*/
.d_item {
}
	@media screen and (max-width: 1440px) {
		.inbanner {
			min-height:520px;
		}
	}
	@media screen and (max-width: 1200px) {
		.inbanner {
			min-height:450px;
		}
	}
	@media screen and (max-width: 970px) {
		.inbanner {
			min-height:355px;
		}
	}
	@media screen and (max-width: 768px) {
		.inbanner {
			min-height:250px;
		}
		.city {
			padding: 3% 2% 2%;
			display:block;
			width:100%;
		}
		.option, .option2, .option3 {
			width:100%;
		}
		hr {
			width:100%;
		}
	}
	@media screen and (max-width: 580px) {
		.inbanner {
			min-height:220px;
		}
	}
	@media screen and (max-width: 500px) {
		hr {
			margin-top:15px;
		}
	}
	@media screen and (max-width: 425px) {
		.inbanner {
			min-height:185px;
		}
		.filtr-container div {
			padding:2% 2%;
		}
	}
	@media screen and (max-width: 375px) {
		.inbanner {
			min-height:155px;
		}
		hr {
			width:100%;
			margin-top:15px;
			margin-bottom:4%;
		}
	}
/*---idslider---*/
#season,#legal,#theme,#township,#ilanlife,#link {
}	
	@media screen and (max-width: 768px) {
		#season,#legal,#theme,#township,#ilanlife,#link {
			transform:translateY(-30px);
		}
	}
/*---ihot-------------------------------------------------------------------------------------------------------------------------------*/
#ihot {
	padding: 2% 5% 2%;
}
	.ihot_title {
		background:url(../../images/ihot_title.png) top left no-repeat;
		background-size:cover;
		min-height:40px;
		margin-bottom:2%;
	}
	.ihot {
		transition:.2s linear;
	}
		.ihot a {
			transition:.2s linear;
		}
		.ihot:hover {
			-webkit-filter: drop-shadow(0px 2px 3px rgba(51, 51, 51, 0.6));
			filter: drop-shadow(0px 2px 3px rgba(51, 51, 51, 0.6));
		}
	.ihot b {
		line-height: 20px;
		display: block;
		padding: .5em 0 0 0;
		font-size: 14px;
	}
		.ihot:hover a {
			color: #333;
		}
	@media screen and (max-width: 995px) {
		#ihot {
			padding: 5% 3% 0;
		}
		.ihot_title {
			margin-bottom:3%;
		}
	}
	@media screen and (max-width: 830px) {
		.slick-prev {
			left: -4%;
		}
		.slick-next {
			right: -4%;
		}
	}
	@media screen and (max-width: 425px) {
		#ihot {
			padding: 13% 3% 3%;
		}
		.ihot_title {
			margin-bottom: 5%;
		}
		.slick-prev, .slick-next {
			background-size:45%;
		}
	}
	@media screen and (max-width: 375px) {
		.slick-prev {
			left: -5%;
		}
		.slick-next {
			right: -5%;
		}
		.slick-initialized .slick-slide {
			padding:0;
		}
		.slick-prev, .slick-next {
			background-size:33%;
		}
	}
/*---grid-----------------------------------------------------------------------------------------------------------------------------*/
.grid {
	text-align:left;
	padding-top:0%;
}
	.grid div:hover {
		animation:imgflash 1.2s linear;
	}
.box div {
	margin-bottom:1%;
}
	.d_item {
		width: 16.666666%;
		float: left;
		vertical-align: top;
		text-align: center;
		margin:0 0 1% 0;
		padding:10px;
	}
		.d_item:hover {
			animation:imgflash 1.2s linear;
		}
		@media screen and (max-width: 1400px) {
			.d_item {
				width:20%;
			}
		}
		@media screen and (max-width: 1200px) {
			.d_item {
				padding:0 6px;
			}
		}
		@media screen and (max-width: 900px) {
			.d_item {
				width:25%;
			}
			.box div {
				margin-bottom:3%;
			}
		}
		@media screen and (max-width: 500px) {
			.grid {
				padding-top:10%;
			}
			.d_item {
				width:33.333333%;
				margin-bottom:3%;
			}
			.box div {
				margin-bottom:4%;
			}
		}
		@media screen and (max-width: 450px) {
			.d_item {
				width:50%;
				margin-bottom:3%;
			}
			.img-responsive {
				margin:0 auto;
			}
		}
/*---inews-------------------------------------------------------------------------------------------------------------------------------*/
.inews {
	text-align:left;
	padding:14% 0 0;
}
	.inews img {
		filter: drop-shadow(2px 3px 5px rgba(0,0,0,.3));
		transition:.2s linear;
	}
	.inews span {
		vertical-align:bottom;
		font-size:14px;
		transition:.2s linear;
	}
		.inews:hover span {
			color:#dc1f0b;
			text-shadow:0px 0px 3px rgba(255,255,255,.5);
			filter: drop-shadow(2px 3px 5px rgba(255,255,255,1));
		}
		.inews:hover img {
			filter: drop-shadow(0px 0px 2px rgba(0,0,0,.3));
			/*transform: translateY(-10px);*/
		}
		.inewbg {
			width: 94%;
			padding-top: 16px;
            padding-bottom: 16px;
		}
		.inewbg a {
		   width: 450px;
		   overflow: hidden;
		   white-space: nowrap;
		   text-overflow: ellipsis;
		}
		@media screen and (max-width: 1200px) {
		.inewbg a {
		   width: 340px;
		}}
		@media screen and (max-width: 900px) {
		.inewbg a {
		   width: 430px;
		}}
		@media screen and (max-width: 690px) {
			.inews img {
				width:50%;
			}
			.inewbg img {
				display:none;
			}
			.inewbg a {
		       width: 360px;
		}
		}
		@media screen and (max-width: 490px) {
		.inewbg a {
		   width: 320px;
		}
		.inewbg tr td:first-child{
			display:none;
		}}		
		@media screen and (max-width: 425px) {
			.inews img {
				width:55%;
			}
		}
 .newsp {
	width:100%;
 }
 .newsl {
	width: 40%;
    display: inline-block;
 }
 .newsr {
	width: 40%;
    display: inline-block;
    padding-bottom: 13px;
    vertical-align: bottom;
 }
 @media screen and (max-width: 1300px) {
.newsl {
	width: 100%;
}
 .newsr {
	width: 100%;
	padding-bottom: 0px;
 }
}

/*---news-------------------------------------------------------------------------------------------------------------------------------------*/
.news {
	width:1065px;
	margin:0 auto;
	max-width:95%;
}
	/*marquee*/
	.marquee {
		position:relative;
		text-align: left;
		margin: 3em 0 4em 0;
	}
		.marquee a {
			color:#00ced0;
		}
			.marquee img {
				position:relative;
				z-index:3;
			}
			.m_text {
				font-size:15px;
				position:absolute;
				left:0;
				bottom:9%;
				width:100%;
				line-height:0;
			}
			marquee {
				background:#f3f3f3;
				line-height:38px;
				letter-spacing:2px;
				box-shadow: inset 0px 2px 5px rgba(0,0,0,.1);
			}
	/*news_title*/
	.news_title {
		background:url(../../images/news_title.png) bottom center no-repeat;
		background-size:cover;
		min-height:74px;
		width:100%;
	}
	/*news_list*/
	.news_list {
		background:#f6f6f6;
		border-bottom:solid 6px #c3c3c3;
		box-shadow: 0px 5px 5px rgba(0,0,0,.1);
		padding:2em;
		text-align:center;
	}
		.news_list img {
			display:block;
			max-width:100%;
		}
		.news_list a {
			transition:.2s ease-in-out;
			display:inline-block;
		}
			.news_list a:hover {
				color:#fdbb06;
			}
		.news_list p {
			text-align:left;
		}
	@media screen and (max-width: 900px) {
		.marquee img {
			max-width:60%;
		}
		marquee {
			line-height:30px;
			font-size:14px;
		}
		.news_title {
			min-height:60px;
		}
	}
	@media screen and (max-width: 600px) {
		.marquee {
			margin: 3em 0 3em 0;
		}
		.marquee img {
			max-width: 348px;
		}
		.news_title {
			min-height: 50px;
		}
	}
	@media screen and (max-width: 490px) {
		.newsboxline tr td:first-child{
			display:none;
		}}
	@media screen and (max-width: 425px) {
		.marquee {
			margin: 2em 0 3em 0;
		}
		marquee {
			line-height: 26px;
			font-size: 12px;
		}
		.marquee img {
			max-width: 310px;
		}
		.news_title {
			min-height: 43px;
		}
	}
	@media screen and (max-width: 375px) {
		.marquee img {
			max-width: 92%;
		}
	}
/*---filter_block--------------------------------------------------------------------------------------------------------------------------*/
.filter_block {
	position:relative;
	text-align:center;
}
	.fliter_inner {
	}
	.filter_block .active {
		background:#fff !important;
	}
	.filter_block img {
		max-width:100%;
		box-shadow: 0px 0px 3px rgba(0,0,0,.3);
	}
	.filter_block .col-md-3,.filter_block .col-sm-4,.filter_block .col-xs-6 {
		padding:0 10px 20px 10px;
	}
	.filter_block a {
	}
		.filter_block a:hover {
			animation:imgflash 1.5s ease-in-out;
			color:#000;
		}
.a_area img,.f_area img {
	-webkit-filter: drop-shadow(-2px 2px 1px rgba(51, 51, 51, .2));
	filter: drop-shadow(-2px 2px 1px rgba(51, 51, 51, .2));
	box-shadow: 0px 0px 3px rgba(0,0,0,.0);
}
.a_area .col-md-3 {
	width: 16.6%;
}
.d_area {
	column-width:240px;
	-webkit-column-width:240px;
	-moz-column-width:240px;
	vertical-align:top;
}
.d_area .col-md-3,.d_area .col-md-4,.d_area .col-md-6 {
	width:100%;
}
	.d_area a {
		transition:.3s ease-in-out;
	}
		.d_area a:hover {
			animation:none;
		}
		@media screen and (max-width: 1200px) {
			.a_area .col-md-3 {
				width: 25%;
			}
		}
		@media screen and (max-width: 768px) {
			.a_area .col-md-3 {
				width: 33%;
			}
		}
		@media screen and (max-width: 500px) {
			.filter_block .col-xs-6 {
				width:100% !important;
			}
			.d_area .col-xs-6 {
				width:50% !important;
			}
			.filter_block .col-md-3, .filter_block .col-sm-4, .filter_block .col-xs-6 {
				padding: 5px;
			}
			.a_area .col-md-3 {
				width: 50% !important;
			}
		}

/*---ilife-------------------------------------------------------------------------------------------------------------------------------*/
#ilife {
	padding: 2% 5% 2%;
}
	.ilife_title {
		background:url(../../images/ilife_title.png) top left no-repeat;
		background-size:cover;
		min-height:40px;
		margin-bottom:2%;
	}
	.ilife {
		transition:.2s linear;
	}
		.ilife a {
			transition:.2s linear;
		}
		.ilife:hover {
			-webkit-filter: drop-shadow(0px 2px 3px rgba(51, 51, 51, 0.6));
			filter: drop-shadow(0px 2px 3px rgba(51, 51, 51, 0.6));
		}
		.ilife .ilife_img {
		width:140px;
		height:90px;
		overflow:hidden;
	}
		.ilife_img img{
			width:100%;
			}
	.ilife p {
		line-height: 20px;
		display: block;
		padding: .5em 0 0 0;
		font-size: 13px;
		text-align:center;
	}
		.ilife:hover a {
			color: #333;
		}
	@media screen and (max-width: 995px) {
		#ilife {
			padding: 5% 3% 0;
		}
		.ilife_title {
			margin-bottom:3%;
		}
	}
	@media screen and (max-width: 830px) {
		.slick-prev {
			left: -4%;
		}
		.slick-next {
			right: -4%;
		}
	}
	@media screen and (max-width: 425px) {
		#ilife {
			padding: 13% 3% 3%;
		}
		.ilife_title {
			margin-bottom: 5%;
		}
		.slick-prev, .slick-next {
			background-size:45%;
		}
		.ilife .ilife_img {
			width: 160px;
		}
	}
	@media screen and (max-width: 375px) {
		.ilife .ilife_img {
			width: 145px;
		}
		.slick-prev {
			left: -5%;
		}
		.slick-next {
			right: -5%;
		}
		.slick-initialized .slick-slide {
			padding:0;
		}
		.slick-prev, .slick-next {
			background-size:33%;
		}
	}
.ad_top{}
.ad_top .adtop_title{
	display: flex;
	justify-content: space-between;
    align-items: center;
    vertical-align: bottom;
    margin: 3rem 0;
}
.ad_top .adtop_txt{}
.ad_top .adtop_txt ul{
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-start;
}
.ad_top .adtop_txt ul li{
	width: 23%;
	padding: .0 .5rem;
	background:#dedcdc;
	border-radius: 50px;
	margin: 0 1rem 1rem 0;
	text-align: center;
	font-size: 18px;
}
.ad_top .adtop_txt ul li a{
	text-decoration: none;
	transition: .5s all;
}
.ad_top .adtop_txt ul li a:hover{
	color: #ff7420;
}



@media screen and (max-width: 1050px){
	.ad_top .adtop_title img{
		width: 50%;
	}
}
@media screen and (max-width: 991px){
	.ad_top .adtop_txt ul li {
    font-size: 16px;
}
}
@media screen and (max-width: 834px){}
@media screen and (max-width: 768px){}
@media screen and (max-width: 576px){
	.ad_top .adtop_txt ul li {
    width: 45%;
}
}
@media screen and (max-width: 450px){	
.intxt{
	width: 90%;
}
}

@media screen and (max-width: 414px){
	
}
@media screen and (max-width: 390px){}
@media screen and (max-width: 360px){
	
}
@media screen and (max-width:320px){
	
}