/* ================================================== 
THEME RESPONSIVE
================================================== */
@media screen and (max-width: 1400px) {

}

@media screen and (max-width: 1300px) {

}

@media screen and (max-width: 1250px) {


}

@media screen and (max-width: 1200px) {

}

@media screen and (max-width: 1150px) { 

}

@media screen and (max-width: 1100px) {
.event a .no {width: 120px; font-size: 3.4rem; padding: 30px 12px 30px 0;}
.event a .info {padding: 40px 40px 40px 50px;}
.event a .event-date {font-size: .95rem;}
.event a .info h3 {font-size: 2.4rem; margin: 5px 0 8px;}
.event a .event-intro {font-size: .9rem;}
.event a .icon {width: 44px; height: 44px;}
}

@media screen and (max-width: 1024px) { 
#cssmenu > ul {gap: 30px;}
#cssmenu > ul > li > a {font-size: .92rem;}
.eitem.event-item2 .swiper-button-prev, .eitem.event-item2 .swiper-button-next {top: 300px;}
.price-sep {width: 160px;}
}

@media screen and (max-width: 980px) {
.nav, .sidebar, .swiper-button-next, .swiper-button-prev {display: none!important;}
.b-menu {display: block;}
}

@media screen and (max-width: 853px) { 

}

@media screen and (max-width: 760px) {

}

@media screen and (max-width: 600px) {
.f-nav, .hero-card::after, .event a .btn {display: none;}
.m-title h2 {gap: 8px;}
.m-title h2::before, .m-title h2::after {width: 20px; height: 3px;}
.eitem h4 {font-size: .9rem;}
.gallerys .box {grid-template-columns: repeat(2, 1fr); gap: 6px;}
.gallerys .row img {border-radius: 6px;}
.btn-more button {font-size: .88rem; padding: 10px 0; width: 200px;}
.gallery-end {clip-path: inherit;}
.ctc-socmed ul {justify-content: center; gap: 5px;}
.ctc-hashtag ul {justify-content: center;}
.swiper.route {overflow: visible;}
.f-top {padding-top: 30px;}
.f-box {flex-direction: column;}
.l-foot, .r-foot {width: 100%;}
.r-foot {margin-top: 30px;}
.r-foot .col {width: 100%; padding: 0; border: none;}
.f-top h3 {font-size: .85rem;}
.foot-text, .copy p {font-size: .9rem;}
.event a {height: auto; flex-wrap: wrap;}
.event a .no {width: 20%;}
.event a .info {width: 80%; padding: 20px 15px 20px 20px; margin-left: 0; clip-path: polygon(4.8% 0, 100% 0, 100% 100%, 0 100%);}
.event a .info h3 {font-size: 1.8rem;}
.event a .event-intro {font-size: .845rem;}
.event a .icon {top: 10px; right: 10px; width: 38px; height: 38px;}
.event a .icon img {width: 28px;}
.event a .thumb {height: 150px; margin: -1px 0 0; width: 100%; clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);}
}

@media screen and (max-width: 583px) {

}

@media screen and (max-width: 480px) {
.logo-head {max-width: 180px;}
.hero .elementor-background-overlay {content: ''; background: #ffffff; background: linear-gradient(90deg, rgba(255, 255, 255, .95) 15%, rgba(255, 255, 255, 0) 100%) !important;}
.faq-q {padding: 6px 20px 6px 8px;}
.faq-q h4 {padding-left: 27px;}
.faq-q h4 i {width: 20px; height: 20px; font-size: .7rem;}
.faq-q i.fa-chevron-down {font-size: .8rem;}
.faq-q h4, .faq-a p, .faq-q li {font-size: .89rem;}
.faq-a {padding-left: 34px;}
.event-faq .faq-q h4, .event-faq p, .event-faq li {font-size: .85rem;}
.route h4 {font-size: .85rem;}
.swiper.eitem.event-item {overflow: visible;}
.eitem.event-item2 h4 {font-size: .8rem;}
.eitem.event-item2 .swiper-button-prev, .eitem.event-item2 .swiper-button-next {top: 240px; display: block!important;}
.eitem.event-item2 .swiper-button-prev {left: 115px;}
.eitem.event-item2 .swiper-button-next {right: 100px;}
.event a .no {font-size: 2.4rem; padding: 16px 5px 20px 0;}
.event a .info {padding: 20px 10px 20px 12px;}
.event a .event-date {font-size: .82rem;}
.event a .info h3 {font-size: 1.6rem;}
.event a .event-intro {font-size: .8rem;}
.event a .r-info i {font-size: 1.2rem;}
.event a .thumb {height: 110px;}
.end-box-two, .gallery-end {height: 160px!important;}
.price-sep {width: 130px;}
.race-title h3::after {width: 20px; height: 3px;}
}

@media screen and (max-width: 400px) {

}

@media screen and (max-width: 390px) { 

}

@media screen and (max-width: 375px) { 

}

@media screen and (max-width: 320px) { 

}