/* add_lh */
.lh-info{list-style: none;}
.lh-info li{display: flex;}
.lh-info li+li{margin-top: 0.5rem;}
.lh-info li b{min-width: 125px;}
.lh-map p, .lh-map iframe{display: block; width: 100%; height: 450px;}
/* gallery */
.gallery-img a > span{color: var(--wite); opacity: 0; transition: all 0.5s ease 0.25s; z-index: 1;}
.gallery-img a > span span:hover{background-color: var(--hover);}
.gallery-img:before, .gallery-img:after{content: ''; position: absolute; left: 0; width: 100%; height: 0; background-color: rgb(0 0 0 / 25%); opacity: 0; transition: all 0.5s ease 0s;}
.gallery-img:before{top: 0;}
.gallery-img:after{bottom: 0;}
.gallery-item:hover .gallery-img a > span{opacity: 1;}
.gallery-item:hover .gallery-img:before, .gallery-item:hover .gallery-img:after{height: 50%; opacity: 1;}
/* header_banner */
.bn{height: 360px;}
.bn:before{content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: rgb(0 0 0 / 25%);}
.breadcrumb ul{list-style: none;}
.breadcrumb ul li+li:before{content: '/'; padding: 0 0.25rem;}
@media all and (max-width: 575px){
	.bn{height: 270px;}
}
/* header_menu */
header #menu{display: none;}
.menu{position: relative; z-index: 11;}
.menu ul{list-style: none;}
.menu ul li{position: relative;}
.menu ul li.display{display: none;}
.menu ul li a{display: block; font-size: 14px; font-weight: 700; line-height: 50px; letter-spacing: 0.5px; color: var(--prev);}
.menu ul li a i{margin-left: 0.25rem; font-size: 12px; color: var(--prev); }
.menu ul li ul{position: absolute; top: 100%; min-width: 150px; opacity: 0; pointer-events: none; transition: all 0.5s ease 0s;}
.menu ul li ul li a{padding: 0 1rem; background-color: var(--wite); text-wrap: nowrap; line-height: 36px;}
.menu ul li ul li a:hover{background-color: var(--main); color: var(--wite);}
.menu > ul{display: flex; justify-content: center;}
.menu > ul > li{flex: 0 0 auto;}
.menu > ul > li+li{margin-left: 3rem;}
.menu > ul > li > a{text-transform: uppercase;}
.menu > ul > li:hover > a{color: var(--main);}
.menu > ul > li.active > a{color: var(--main);}
.menu > ul > li > ul:before{content: ''; position: absolute; bottom: 0; left: 0; width: 100%; height: 100%; box-shadow: 0 0 15px rgb(0 0 0 / 15%);}
.menu > ul > li:hover > ul{top: 100%; opacity: 1; pointer-events: auto;}
.mm-listitem__text i{display: none;}
/*menu c?p 2 bên ph?i*/
.menu ul li ul li ul{top: 0; left: calc(100% + 1rem);}
.menu ul li ul li:hover ul{left: 100%; opacity: 1; pointer-events: auto;}
/* home_about */
.ck{border-bottom: 1px solid var(--bord); z-index: 10;}
.ck:before{position: absolute; top: -75px; left: 0; width: 100%; height: 75px; background: linear-gradient(180deg, rgb(0 0 0 / 0) 0%, rgb(255 255 255 / 100%) 100%);}
.ck-img > div{padding: 7px;}
@media all and (min-width: 992px){
    .ck:before{content: '';}
	.ck .col-12+.col-12{border-left: 1px solid var(--bord);}
}
/* home_danhmuc */
.dm h3{background: linear-gradient(180deg, rgb(0 0 0 / 0) 0%, rgb(0 0 0 / 75%) 100%);}
.dm h3:hover{color: var(--hover);}
/* home_noibat */
.nb-carousel .slick-slide > div{padding: 0.75rem;}
/* home_slide */
.sl-slick .slick-arrow{position: absolute; top: 0; bottom: 0; width: 40px; height: 40px; border-radius: 50%; opacity: 0;}
.sl-slick .slick-arrow i{display: block; font-size: 36px; color: var(--wite); opacity: 0.75;}
.sl-slick .slick-arrow:hover i{opacity: 1;}
.sl-slick .slick-prev{left: 0;}
.sl-slick .slick-next{right: 0;}
.sl-slick:hover .slick-arrow{opacity: 1;}
.sl-slick:hover .slick-prev{left: 1.5rem;}
.sl-slick:hover .slick-next{right: 1.5rem;}
.sch-form{z-index: 10;}
.sch-form form{background-color: rgb(0 0 0 / 25%);}
.sch-form form input, .sch-form form select{font-size: 14px;}
@media all and (min-width: 992px){
    .sch-form{position: absolute;}
    .sch-form .main-title,
    .sch-form .main-sub{text-align: start; color: var(--wite);}
    .sch-form form{max-width: 648px;}
}
@media all and (max-width: 575px){
    .sch-form form{background-color: rgb(221 214 192 / 50%);}
}

/* home_tintuc */
.tt-carousel .slick-slide > div{padding: 0.75rem;}
/* home_tour */
.t-carousel .slick-slide > div{padding: 0.75rem;}
/* hotel */
.hotel-img img{border-radius: 5px 0 0 5px;}
.hotel-wrap{border: 1px solid var(--bord); border-left: none; border-radius: 0 5px 5px 0;}
.hotel-button{font-size: 14px; font-weight: 500; text-transform: uppercase; line-height: 35px;}
.hotel-button a{display: inline-block; padding: 0 1rem; background-color: var(--main); border-radius: 5px; color: var(--wite); transition: all 0.5s ease 0s;}
.hotel-button a:hover{background-color: var(--hover);}
@media all and (max-width: 767px){
	.hotel-img img{border-radius: 5px;}
    .hotel-wrap{border: none; border-radius: 0;}
}
/* intro */
.intro1 .p-4{box-shadow: 0 0 30px rgb(0 0 0 / 15%);}
.intro5 img{width: 250px; margin: 0 auto 1.5rem;}
.intro5-wrap{border: 1px dashed var(--main);}
.intro-dm h3{background: linear-gradient(180deg, rgb(0 0 0 / 0) 0%, rgb(0 0 0 / 75%) 100%);}
.intro-dm h3:hover{color: var(--hover);}
/* side */
aside{margin-bottom: 1.5rem; box-shadow: 0 0 5px rgb(0 0 0 / 25%); border-radius: 5px; overflow: hidden;}
.side-title{padding: 0 1rem; border-bottom: 1px solid var(--main); font-weight: 700; line-height: 43px; color: var(--main);}
.side-dm ul{list-style: none; }
.side-dm ul li+li{border-top: 1px dashed var(--bord);}
.side-dm ul li.active a, .side-dm ul li a:hover{color: var(--main);}
.side-dm ul li a:hover i{margin-left: 0.5rem;}
.side-ht img{width: 30px;}
.side-ht a:last-child{border-top: 1px solid var(--bord);}
.side-bv h3{display: -webkit-box; width: calc(100% - 120px - 1rem); -webkit-line-clamp: 3; -webkit-box-orient: vertical; text-overflow: ellipsis; overflow: hidden;}
.side-ha span{right: 0; bottom: 0; background-color: rgb(0 0 0 / 75%); transition: all 0.5s ease 0s;}
.side-ha span i{display: block; padding: 0.25rem 0.5rem; color: var(--wite);}
.side-ha a{position: absolute; top: 0; left: 0; width: 100%; height: 100%;}
/* tour */
.tour-item{box-shadow: 0 0 3px rgb(0 0 0 / 15%);}
.tour-item:hover{transform: translatey(-5px);}
.tour-name{display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; text-overflow: ellipsis; overflow: hidden;}
.tour-string{list-style: none;}
.tour-string li+li{margin-top: 0.25rem;}
.tour-string li i{width: 24px; text-align: center; color: var(--main);}
.tour-button{font-size: 14px; font-weight: 500; text-transform: uppercase; line-height: 35px;}
.tour-button a{display: inline-block; padding: 0 1rem; background-color: var(--main); border-radius: 5px; color: var(--wite); transition: all 0.5s ease 0s;}
.tour-button a:hover{background-color: var(--hover);}
/* tour_booking */
.bk-payment {margin-bottom: 30px;}
.bk-payment > ul{list-style: none;}
.bk-payment > ul > li+li{margin-top: 15px;}
.bk-payment > ul > li label{display: block; padding: 1rem; border: 1px solid var(--bord); border-radius: 5px; color: var(--prev); cursor: pointer; transition: all 0.5s ease 0s;}
.bk-payment > ul > li label input{display: none;}
.bk-payment > ul > li .main-detail{display: none; padding: 1.5rem;}
.bk-payment > ul > li.active label{border-color: var(--main); border-radius: 5px 5px 0 0; color: var(--main);}
.bk-payment > ul > li.active .main-detail{display: block;}
@media all and (min-width: 992px){
	.bk-form{border-left: 1px solid var(--bord);}
}
/* tour_detail */
.td-bc ul{list-style: none; border-bottom: 1px solid var(--bord);}
.td-bc ul li+li:before{content: '\f054'; padding: 0 0.5rem; font-family: "Font Awesome 6 Pro"; font-size: 10px; font-weight: 700;}
.td-bc-2{border: none;}
.td-big .slick-slide > div, .td-nav .slick-slide > div{position: relative; height: 0; padding-top: calc(100%/3*1.5); cursor: pointer;}
.td-big .slick-slide > div img{cursor: zoom-in;}
.td-nav .slick-slide{margin: 0 0.25rem;}
.td-nav .slick-slide > div{padding-top: calc(100%/3*1.5);}
.td-nav .slick-arrow{position: absolute; bottom: 0; width: 40px; height: calc(100% - 0.5rem); margin: auto; opacity: 75%;}
.td-nav .slick-arrow:hover{opacity: 1;}
.td-nav .slick-arrow i{display: flex; justify-content: center; align-items: center; height: 100%; font-size: 20px; color: var(--wite);}
.td-nav .slick-prev{left: 0; background: linear-gradient(90deg, #000 25%, transparent 100%);}
.td-nav .slick-next{right: 0; background: linear-gradient(270deg, #000 25%, transparent 100%)}
.td-wrap{margin-bottom: 1.5rem; box-shadow: 0 0 15px rgb(0 0 0 / 5%);}
.td-wrap-title{padding: 1rem 1.5rem; background-color: rgb(112 82 180 / 10%); border-left: 5px solid var(--main); font-weight: bold; color: var(--main);}
.td-wrap-content{padding: 1.5rem; background-color: var(--wite);}
.td-string{list-style: none;}
.td-string li i{width: 30px;}
.td-check ul, .td-close ul, .td-noted ul{list-style: none; padding-left: 0;}
.td-check ul li, .td-close ul li, .td-noted ul li{position: relative; padding-left: 30px;}
.td-check ul li:before, .td-close ul li:before, .td-noted ul li:before{position: absolute; top: 0; left: 0; display: block; width: 30px; font-family: "Font Awesome 6 Pro"; font-size: 12px; font-weight: 700; text-align: center; line-height: 24px;}
.td-check ul li:before{content: '\f00c'; color: var(--hover);}
.td-close ul li:before{content: '\f00d'; color: var(--red);}
.td-noted ul li:before{content: '\f0da'; color: var(--main);}
.td-form{position: sticky; top: 1.5rem; padding: 1.5rem 1rem; background-color: rgb(112 82 180 / 10%);}
.td-form .f-item{display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; padding: 1rem; background-color: var(--wite); border: 1px solid var(--bord);}
.td-form .f-item span{margin-bottom: 0;}
.td-form button{width: 30px; height: 30px; background-color: rgb(112 82 180 / 21%); border: none; border-radius: 50%; font-size: 20px; line-height: 30px; transition: all 0.5s ease 0s;}
.td-form button:hover{background-color: var(--main); color: var(--wite);}
.td-form button#sub{border-right: none;}
.td-form button#add{border-left: none;}
.td-form input[type=number]{width: calc(100% - 70px); height: 30px; margin: 0 5px; padding: 0; border: none; box-shadow: none; text-align: center;}
.td-form input[type=number]::-webkit-outer-spin-button,
.td-form input[type=number]::-webkit-inner-spin-button{-webkit-appearance: none;}
.td-form input[type=number].error{border: 1px solid var(--red);}
.td-form-2{position: relative; top: 0; padding: 0; background-color: transparent;}
.td-form-2 .f-item{border-radius: 5px;}
/* z_email */
.email{border-bottom: 1px dashed var(--prev);}
.email input[type=text]{border-right: none; border-color: transparent; border-radius: 5px 0 0 5px; box-shadow: none;}
.email input[type=text]:focus{border-color: var(--main);}
.email input[type=submit]{border-radius: 0 5px 5px 0; box-shadow: none;}
