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

img{
	max-width: 100%;
}

/****************************************************************************************************************************************/
/*********************************************************************************************************************************************/
/*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 !important;
    text-align: center;
    vertical-align: top;
	padding: 0 0 0 1rem;
}

.logotitle{
	display: inline-block;
	position: relative;
	padding: 0 10px;
}
.logotitle:before, .logotitle:after{
	content: '';
	background: #000;
	width: 1px;
	height: 100%;
	position: absolute;
}
.logotitle:before{
	top: 0;
	left: 0;
}
.logotitle:after{
	top: 0;
	right: 0;
}
.logotitle h1{
	font-size: 22px;
	color: #303030;
	letter-spacing: 3px;
    font-weight: 600;
}
.logotitle h2{
	font-size: 13px;
    color: #ffa518;
    position: relative;
    bottom: 0;
    opacity: 1;
    margin-top: 6px;
    margin-bottom: 3px;
}

/*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%);
    }
    
    .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 {
        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 img {
        width: 100%;
    }

    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;
    }
}
@media screen and (max-width:393px){
	.logo {
    vertical-align: sub;
}
}
@media screen and (max-width:px){}


/*---wrapper----------------------------------------------------------------------------------------------------------------------------------*/
#wrapper {
    background: #fff;
    width: 1420px;
    margin: 0 auto;
    text-align: center;
    padding: 4.7% 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*/
.t_left {
    background: rgba(191, 188, 188, 0.6);
    width: 50%;
    float: left;
    text-align: right;
    padding: 0 0 0 5%;
}

.servicead {
    margin-bottom: 2rem;
}
.servicead4 {
    margin-top: 5rem;
}
/*service_ad*/
.service_ad {
    position: relative;
    width: 100%;
    cursor: pointer;
    transition: .3s ease-in;
}

a.ada{
	margin-top: 2rem;
}

/*service_title*/
.service_title {
    
}
.service_title h2{
    position: relative;
    padding: 0;
    margin: 2rem 0 1rem;
    -o-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
    text-align: center;
    font-size: 30px;
    color: #222;
    letter-spacing: 1px;
    text-transform: uppercase;
    display: grid;
    grid-template-columns: 1fr max-content 1fr;
    grid-template-rows: 27px 0;
    grid-gap: 20px;
    align-items: center;
    bottom: 0;
    opacity: 1;
}
.service_title h2:after,.service_title h2:before {
    content: " ";
    display: block;
    border-bottom: 1px solid #81540c;
    border-top: 1px solid #81540c;
    height: 5px;
  background-color:#f8f8f8;
}
.service_title img {
	max-width: 100%;
}

/*vmore*/
.vmore {
    color: #fff;
    background: rgba(0, 0, 0, 1);
    padding: 4% 2%;
    position: relative;
    width: 49%;
    text-align: center;
    box-shadow: 0px 0px 10px rgba(0, 0, 0, .3);
    transition: .2s ease-in;
    margin: 0 0 0 auto;
	font-size: 35px;
}

.vmore img {
    padding-left: 6%;
    animation: vmove alternate infinite;
}

.service_ad .col-md-3 {
    width: 50%;
    padding-right: 5px;
    padding-left: 5px;
	padding-bottom: 2rem;
}

.service_ad img {
    max-width: 100%;
}

@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*/
.ad4,
.ad5,
.ad6 {
    display: inline-block;
    vertical-align: top;
    width: 100%;
    margin: 3% 0 0 0;
    z-index: 8;
}
.ad2 .col-md-3, .ad6 .col-md-3 {
    width: 100%;
}

@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;
    }
}
@media screen and (max-width:450px) {
    a.ada {
    margin-top: 0;
}
	.servicead {
    margin-bottom: 0;
}
	.servicead4 {
    margin-top: 2rem;
}
	.service_title h2 {
    margin: 0;
}
}
/*hover*/
.service_ad a:hover img {
    opacity: .8;
}

a:hover .vmore {
    text-decoration: line-through;
    box-shadow: 0px 0px 20px rgb(255, 255, 255, .7);
    border-radius: 15px;
}

a:hover .vmore img {
    animation: vmove .5s alternate infinite;
}

/*imgflash*/
@keyframes imgflash {
    0% {
        opacity: .4;
    }

    100% {
        opacity: 1;
    }
}

/*title*/
.title {
    padding: 0 0 2% 0;
    text-align: left;
}

.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_inner{
	width: 100%;
    margin: 1rem 0 4rem;
}
.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: 5% 0 0 0;
}

.season3 {
    background: none;
    position: relative;
    text-align: center;
}

.season4 {
    background: url(../../images/season_bg4.jpg) top center no-repeat;
    background-size: cover;
    margin: 5% 0 0 0;
}

/*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: 0 4% 0 2%;
    /*overflow-y: scroll;*/
}

/*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: 7% 0 0 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;
    min-height: 200px;
}

.theme2 {
    background: url(../../images/theme_bg2.jpg) top center no-repeat;
    background-size: cover;
    min-height: 200px;
}

.theme3 {
    background: url(../../images/theme_bg3.jpg) top center no-repeat;
    background-size: cover;
    min-height: 200px;
}

.theme4 {
    background: url(../../images/theme_bg4.jpg) top center no-repeat;
    background-size: cover;
    min-height: 200px;
}

.theme5 {
    background: url(../../images/theme_bg5.jpg) top center no-repeat;
    background-size: cover;
    min-height: 200px;
}

.theme6 {
    background: url(../../images/theme_bg6.jpg) top center no-repeat;
    background-size: cover;
    min-height: 200px;
}

.theme7 {
    background: url(../../images/life_bg1.jpg) top center no-repeat;
    background-size: cover;
    min-height: 200px;
}

.theme8 {
    background: url(../../images/life_bg2.jpg) top center no-repeat;
    background-size: cover;
    min-height: 200px;
}

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

    .service_title img {
        max-width: 100%;
    }

    .service_ad:hover {
        background-size: cover;
    }

    .title img {
        width: 100%;
    }

    .t_right {
        height: auto;
        overflow: visible;
    }

    .t_left {
        padding: 0 0 14px 5%;
    }
}

@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 {
    }

    .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;
    }

    .t_left {
        padding: 0 0 0 3%;
    }

    .t_right {
        padding: 0 3% 0 2%;
    }

    .service_title img {
        /*width: 62%;*/
    }

    .service_title {
    }
}

@media screen and (max-width:900px) {
    #wrapper {
        width: 100%;
        padding: 9% 0 0 0;
        background-size: 100%;
    }

    .t_left {
        float: none;
        width: 100%;
        padding: 0 6% 0 5%;
    }

    .t_right {
        width: 100%;
        padding: 5% 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:768px) {
  
}

@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%;
    }

    .service_ad {
        width: 100%;
    }
}

@media screen and (max-width: 576px) {
    .service_ad .col-md-3 {
		padding-bottom: 1rem;
    }
}

@media screen and (max-width:500px) {
    .t_left {
        padding: 10% 6% 2% 5%;
    }
	    .season_title img, .legal_title img {
        width: 30%;
    }
}

@media screen and (max-width:470px) {
    #wrapper {
        width: 90%;
        padding: 17% 0 0 0;
    }
	.service_title {
        padding: 4% 0 0 0;
    }
}
@media screen and (max-width: 450px) {
    .vmore {
		font-size: 18px;
		 right: 0;
		margin: .5rem 0 0 auto;
		width: 60%;
    }
	    .vmore img {
        width: 12%;
    }
}

@media screen and (max-width:400px) {
    #wrapper {
        padding: 20% 0 0 0;
        width: 93%;
    }    

        .service_title {
        padding: 1% 0 0 0;
    }

    .package_title img {
        width: 50%;
    }

    .theme li {
        width: 49%;
    }

    .theme img {
        width: 60%;
    }

    .service_ad {
        margin-top: 4%;
    }

    .t_left {
        padding: 8% 6% 2% 5%;
    }
}

@media screen and (max-width: 393px) {
    
}
@media screen and (max-width: 360px) {
    .season_inner {
    margin: 1rem 0 3rem;
}
	.service_title {
        padding: 3% 0 0 0;
    }
}
/*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: right;
}

/*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: 45%;
    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% 4% 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;
    min-height: 200px;
}

.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: 5% 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;
    text-decoration: none;
}

.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;
}

.inbanner9 {
    background: url(../../images/inbanner9.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% 0;
}

.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: 8% 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%;
    }
}

/*---itheme-------------------------------------------------------------------------------------------------------------------------------*/
#itheme {
    padding: 2% 5% 0;
}

.itheme_title {
    background: url(../../images/itheme_title.png) top left no-repeat;
    background-size: cover;
    min-height: 40px;
    margin-bottom: 2%;
}

.itheme {
    transition: .2s linear;
    position: relative;
}

.itheme li {
    list-style: none;
}

.itheme a {
    transition: .2s linear;
}

.itheme a img {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;

}

.itheme: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));
}

.itheme b {
    line-height: 20px;
    display: block;
    padding: .5em 0 0 0;
    font-size: 14px;
}

.itheme:hover a {
    color: #333;
}

@media screen and (max-width: 995px) {
    #itheme {
        padding: 5% 3% 0;
    }

    .itheme_title {
        margin-bottom: 3%;
    }
}

@media screen and (max-width: 830px) {
    .slick-prev {
        left: -4%;
    }

    .slick-next {
        right: -4%;
    }
}

@media screen and (max-width: 425px) {
    #itheme {
        padding: 8% 3% 3%;
    }

    .itheme_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%;
    }
}

/*---itownship-------------------------------------------------------------------------------------------------------------------------------*/
#itownship {
    padding: 2% 1% 3rem;
}

.itownship_title {
    background: url(../../images/itownship_title.png) top left no-repeat;
    background-size: cover;
    min-height: 40px;
    margin-bottom: 2%;
}

.itownship {
    transition: .2s linear;
	text-align: center;
}

.itownship a {
    transition: .2s linear;
}

.itownship: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));
}

.itownship b {
    line-height: 20px;
    display: block;
    padding: .5em 0 0 0;
    font-size: 14px;
}

.itownship:hover a {
    color: #333;
}

.itownship li {
    list-style: none;
}

@media screen and (max-width: 995px) {
    #itownship {
        padding: 5% 3% 0;
    }

    .itownship_title {
        margin-bottom: 3%;
    }
}

@media screen and (max-width: 830px) {
    .slick-prev {
        left: -4%;
    }

    .slick-next {
        right: -4%;
    }
}

@media screen and (max-width: 425px) {
    #itownship {
        padding: 0 3% 3%;
    }
.itownship.slick-slide a img {
    width: 90%;
}
    .itownship_title {
        margin-bottom: 5%;
    }

    .slick-prev,
    .slick-next {
        background-size: 45%;
    }
}

@media screen and (max-width: 375px) {
        #itownship {
        padding: 0 3% 7%;
    }
	.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: 4% 0 0;
    z-index: 999;
}

.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;
    z-index: 999;
}

.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(https://www.ilanbnb.tw/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: #fff;
    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;
}

.ad_top ul {}

.ad_top ul li {
    padding: 1rem 0;
}

.ad_top ul li img {
    max-width: 100%;
}

@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) {
   .ad_top .adtop_title {
    margin: 1rem 0;
}
	    .ad_top .adtop_title img {
        width: 35%;
    }
	.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) {}


.carousel 
.starttitle{
	width: 30%;
}
.carousel .fa-chevron-right {
  display: block !important;
}

.jiaosi{}
.luodong{}
.dongshan{}

.jiaosi .havefun{
	padding-top: 80px;
}
.luodong .havefun{
	padding-top: 80px;
}

.dongshan .mesbox{
	margin-top: 42px;
}