@media screen and (max-width: 1699px) { /* 1700px */
    #why-boonju .content .phone { position:absolute; z-index:1; right:-100px; bottom:0; }
    #page-top-area #page-top-phones-parallax .page-top-phone-01 { left:55% !important; }
    #page-top-area #page-top-phones-parallax .page-top-phone-02 { left:85% !important; }

}
@media screen and (max-width: 1599px) { /* 1600px */
    #features .content .item-01 { left:-250px !important; }
    #features .content .item-02 { left:-450px !important; }
    #features .content .item-03 { left:-250px !important; }
    #features .content .item-04 { right:-250px !important; }
    #features .content .item-05 { right:-450px !important; }
    #features .content .item-06 { right:-250px !important; }
    #page-top-area #page-top-phones-parallax .page-top-phone-01 { left:50% !important; }
    #page-top-area #page-top-phones-parallax .page-top-phone-02 { left:85% !important; }
}

@media screen and (max-width: 1499px) { /* 1500px */
    #why-boonju .content .phone { position:absolute; z-index:1; right:-200px; bottom:0; }
}

@media screen and (max-width: 1399px) { /* 1400px */
    #features .content .item-02 { left:-350px !important; }
    #features .content .item-05 { right:-350px !important; }
    
    #why-boonju .content .app-links a { display:inline-block; margin-right:25px;}
}

@media screen and (max-width: 1299px) { /* 1300px */
    #features .content .item-02 { left:-300px !important; }
    #features .content .item-05 { right:-300px !important; }

    #why-boonju .content .phone { position:absolute; z-index:1; right:-250px; bottom:0; }
    
    #page-top-area #page-top-content { bottom:150px; }
    #page-top-area .blog-title span { font-size:34px; }
    #blog-details .content { padding:50px 15px; }
    #blog-details .content .blog-text { padding:0 5px; margin-bottom:25px; }
    #blog-details .content .blog-text p { line-height:1.5; font-size:15px; }
    
    #page-top-area #page-top-phones-parallax .page-top-phone-01 { left:45% !important; }
    #page-top-area #page-top-phones-parallax .page-top-phone-02 { left:85% !important; }
}

@media screen and (max-width: 1199px) { /* 1200px */
    #hero { height:625px; }
    #hero #home-hero-slider .owl-slide .item img { height:625px; }
    #hero #hero-content { top:200px; }
    #hero #hero-content #phone-area { top:-50px; right:0; width:329px; height:auto; }
    #hero #hero-content #home-hero-phone-slider { top:12px; right:14px; width:228px; height:493px; border-radius:32px; }
    #hero #hero-content #home-hero-phone-slider .owl-stage-outer { width:228px; height:493px; border-radius:32px; }
    #hero #hero-content #phone-area .phone-bg { width:329px; height:auto; }
    
    #features .content .item-01 { left:-200px !important; }
    #features .content .item-02 { left:-200px !important; }
    #features .content .item-03 { left:-200px !important; }
    #features .content .item-04 { right:-200px !important; }
    #features .content .item-05 { right:-200px !important; }
    #features .content .item-06 { right:-200px !important; }
    
    #page-top-area #page-top-content .app-links .boonju-invite { width:160px; height:51.5px; padding:11px 20px; }
    #page-top-area #page-top-content .app-links a { width:160px; }
    #page-top-area #event-details-page-top-phone { left:52.5% !important; }
    #page-top-area #page-top-content .app-links a { margin-right:5px; }
    
    #page-top-area .event-title span { font-size:34px; }
    
    #page-top-area #page-top-phones-parallax .page-top-phone-01 { left:40% !important; }
    #page-top-area #page-top-phones-parallax .page-top-phone-02 { left:85% !important; }
    #page-top-area #page-top-content form .section-title { font-size:30px; }
    
    #page-details .content { padding:50px 15px; }
    #page-details .content .page-text { padding:0 5px; }
    #page-details .content .page-text p { line-height:1.5; font-size:15px; }

}

@media screen and (max-width: 991px) { /* 992px */
    #hero #hero-content .form-area { margin-bottom:25px; }
    #hero #hero-content .form-area .sup-text { font-size:22px; }
    #hero #hero-content .form-area .text { font-size:40px; }
    
    #about-us { padding:100px 0; }
    #about-us .section-title { font-size:36px; margin-bottom:25px; }
    
    #about-us .item p { font-size:18px; }
    #about-us .item { display:flex; align-items:center; flex-basis:content; }
    
    #about-us .item-01 { margin-bottom:15px; }
    #about-us .item .circle-01 { flex-shrink:0; order:1; margin:15px 0 15px 15px; }
    #about-us .item .circle-01 .number { top:35px; left:-20px; right:initial; }
    #about-us .item-01 p { flex-shrink:1; order:2; padding-left:25px; text-align:left; }
    
    #about-us .item-02 { margin-bottom:15px; }
    #about-us .item .circle-02 { flex-shrink:0; order:1; margin:15px 0 15px 15px; }
    #about-us .item .circle-02 .number { top:35px; left:-20px; right:initial; }
    #about-us .item-02 p { flex-shrink:1; order:2; padding-left:25px; text-align:left; }
    
    #about-us .item .circle-03 { flex-shrink:0; order:1; margin:15px 0 15px 15px; }
    #about-us .item .circle-03 .number { top:35px; left:-20px; right:initial; }
    #about-us .item-03 p { flex-shrink:1; order:2; padding-left:25px; text-align:left; }
    
    #features { padding:25px 0 75px 0; }
    #features-phone { display:none; }
    
    #features .content { width:100%; height:auto; margin-bottom:50px; }
    #features .content .item { display:inline-block !important; position:initial !important; height:50px; width:200px; margin-bottom:35px; text-align:left; }
    #features .section-title { font-size:34px; margin-bottom:50px; }
    #features .content .item .icon { float:left; width:50px; height:50px; line-height:50px; border-radius:25px; }
    #features .content .item .text { width:auto; height:50px; padding-left:10px; }
    #features .content .item .item-title { height:35px; line-height:35px; margin-top:0; font-size:34px; }
    #features .content .item .item-text { height:15px; line-height:20px; margin-top:-5px; font-size:14px; }

    #features .content .item-01 { top:initial !important; left:initial !important; }
    #features .content .item-02 { top:initial !important; left:initial !important; }
    #features .content .item-03 { top:initial !important; left:initial !important; }
    #features .content .item-04 { top:initial !important; right:initial !important; }
    #features .content .item-05 { top:initial !important; right:initial !important; }
    #features .content .item-06 { top:initial !important; right:initial !important; }
    
    #events { padding-top:100px; }
    #events .section-title { margin:0; font-size:30px; text-align:center; }
    #events .select-city { height:auto; text-align:center; }
    #events .select-city select { display:inline-block; position:initial; font-size:40px; margin:0 auto 5px auto; background-position:right 10px bottom 20px; }
    #events #events-slider { width:95%; height:400px; margin:auto; }
    #events #events-slider .slider-item .event-title span { height:auto; font-size:22px; line-height:1.25; }
    #events #events-slider .next-button { z-index:9; top:175px; right:-15px; width:50px; height:50px; box-shadow:0 0 15px rgba(0,0,0,0.1); }
    #events #events-slider .prev-button { z-index:9; top:175px; left:-15px; right:initial; width:50px; height:50px; box-shadow:0 0 15px rgba(0,0,0,0.1); }
    #events #events-slider .slider-item .event-image { height:200px; }
    #events #events-slider .slider-item .event-image img { height:200px; }
    #events .events-bg { height:450px; }
    #events .event-list .list-item { height:250px; }
    #events .event-list .list-item .event-title span { font-size:18px; }
    
    #why-boonju .content .phone { display:none; }
    #why-boonju .section-title { font-size:50px; }
    
    #download-app .download-app-bg .content .app-links a { width:160px; }
    
    footer .content { height:auto; }
    footer .newsletter .newsletter-title { text-align:center; }
    footer .content .newsletter { order:1; margin-top:25px; margin-bottom:25px; }
    footer .content .footer-menu { display:flex; order:2; flex-direction:column; text-align:center; }
    footer .content .footer-links{ order:1; }
    footer .content .logo { order:2; text-align:center; }
    footer .content .copyright { order:3; }
    footer .footer-links ul { margin-bottom:25px; }
    footer .footer-links ul li { display:block; margin:0; padding:7.5px 0; border-bottom:1px solid #eee; font-size:0; }
    footer .footer-links ul li:last-child { border-bottom:0; }
    footer .footer-links ul li a { display:block; }
    
    #page-top-area #event-details-page-top-phone { left:50% !important; }
    
    #page-top-area #page-top-phones-parallax { display:none; }
    #page-top-area #page-top-content { text-align:center; }
    #page-top-area #page-top-content form .select-city { text-align:right; }
    #page-top-area #page-top-content form .select-city select { width:75%; position:initial; }
    #page-top-area #page-top-content form .select-events select { width:75%; position:initial; height:70px; }
    #page-top-area #page-top-content form .select-events { text-align:left; }
}

@media screen and (max-width: 899px) { /* 900px */
    #page-top-area #event-details-page-top-phone { display:none; }
    #page-top-area { height:575px; }
    #page-top-content .event-category { text-align:center; }
    #page-top-content .event-title { text-align:center; }
    #page-top-content .event-details { text-align:center; }
    #page-top-area #page-top-content .app-links { margin:25px 0; text-align:center; }
    #page-top-area #page-top-content .app-text { text-align:center; }
    #event-details .event-content { padding:25px; }
    #event-details .event-content .content-top .event-details .buy-ticket a { width:100%; }
    #event-details .event-content .content-top .event-details .event-title span { margin-top:25px; }
    #event-details .event-content .content-bottom { padding-bottom:25px; }
    #event-list .list-item { height:auto; }
    #event-list .list-item .event-details .event-info { bottom:-5px; }
    #event-list .list-item .event-details .event-title span { font-size:22px; margin:15px 0 5px 0; }
    #event-list .list-item { position:relative; }
    #event-list .list-item .event-details { position:initial; }
    #event-list .list-item .event-details .event-links-area .event-links { height:120px; }
    #event-list .list-item .event-details .event-links-area .event-links a { width:75%; margin:5px 0; }
    #event-list .list-item:hover .event-details .event-links-area { display:none; }
    
    
    #download-modal { width:80%; height:265px; }
    #download-modal .phone-bg { display:none; }

}
@media screen and (max-width: 767px) { /* 768px */
    header { top:20px; }
    header .top-menu { position:relative; -webkit-transition:0.3s; -moz-transition:0.3s; transition:0.3s; }
    header .top-menu nav ul { visibility:hidden; opacity:0; position:absolute; width:100%; left:0; right:0; top:75px; margin:0 auto; -webkit-transition:0.3s; -moz-transition:0.3s; transition:0.3s; }
    header .top-menu.active { border-bottom-left-radius:0; border-bottom-right-radius:0; }
    header .top-menu.active nav ul { visibility:visible; opacity:1; top:60px; height:auto; background:transparent; border-bottom-left-radius:30px; border-bottom-right-radius:30px; box-shadow:0 25px 25px rgba(0,0,0,0.25); }
    header .top-menu nav ul li { display:block; width:100%; height:60px; line-height:60px; border-top:1px solid #eee; }
    header .top-menu nav ul li a { display:block; width:100%; height:60px; line-height:60px; padding:0 32.5px; margin:0; background-color:#fff; text-align:left; }
    header .top-menu nav ul li:last-child a { border-bottom-left-radius:30px; border-bottom-right-radius:30px; }
    
    header .top-menu .hamburger { display:block; float:right; width:25px; height:25px; margin:17.5px; cursor:pointer; }
    .bar1, .bar2, .bar3 { width:25px; height:3px; background-color:#262626; margin:5px 0; transition:0.3s; }
    .bar1 { margin-top:3px; }
    .active .bar1 { transform:translate(0, 8px) rotate(-45deg); }
    .active .bar2 { opacity:0; }
    .active .bar3 { transform:translate(0, -8px) rotate(45deg); }
    
    #hero #hero-content { top:150px; }
    #hero #hero-content .form-area .sup-text { text-align:center; }
    #hero #hero-content .form-area .text { text-align:center; }
    #hero #hero-content .app-links { text-align:center; margin-bottom:25px; }
    #hero #hero-content .app-links a { width:160px; height:auto; margin:0 5px; }
    #hero #hero-content .app-links a img { width:100%; height:auto; }
    #hero #hero-content .app-text { text-align:center; }
    
    #features .app-links { width:100%; margin:0 auto 25px auto; }
    #features .app-links a { display:inline-block; width:160px; }
    
    #why-boonju .section-sup-title { font-size:26px; margin-top:50px; line-height:1.25; }
    #why-boonju .content .app-links { text-align:center; }
    #why-boonju .content .app-links a { width:160px; margin:25px 15px; }
    #why-boonju .content { padding:25px 0 50px 0; }
    
    #features { padding:25px 0 0 0; }
    #events { padding-top:100px; }
    
    #faq { margin:50px 0 0 0; }
    
    #download-app .download-app-bg .content { height:80px; }
    #download-app .download-app-bg .content .phone-area { width:100%; height:auto; order:1; margin-bottom:100px; }
    #download-app .download-app-bg .content .phone-area .phone-image { bottom:150px; }
    #download-app .download-app-bg .content .link-01 { width:50%; order:2; text-align:right !important; padding-right:15px; }
    #download-app .download-app-bg .content .link-02 { width:50%; order:3; text-align:left !important; padding-right:15px; }
    
    #page-top-area #page-top-content { bottom:170px; }
    #page-top-area .blog-title span { font-size:26px; }
    
    #page-top-area .event-category span { font-size:28px; }
    
    #download-modal { display:block; width:85%; height:450px; padding:25px 15px; }
    #download-modal .content .modal-title span { display:block; margin-bottom:15px; font-size:18px; text-align:center; }
    #download-modal .content .app-links { width:100%; margin-bottom:15px; text-align:center; font-size:0; }
    #download-modal .content .app-links a { width:160px; margin:5px; }
    #download-modal .content .app-text span { text-align:center; }
    #download-modal .email-form { max-width:400px; width:100%; height:45px; margin:auto; }
    #download-modal .email-form form input { width:100%; }
    #download-modal .qr-code { position:initial; margin:25px auto 15px auto; text-align:center; }
    #download-modal .qr-code img { display:inline-block; width:150px; height:auto; object-fit:cover; }
    #download-modal .qr-code span { text-align:center; font-size:15px; margin-bottom:15px; }
}

@media screen and (max-width: 575px) { /* 576px */
    #download-modal { height:475px; }
    #about-us .section-title { font-size:34px; line-height:1.25; }
    
    #events .select-city select { font-size:40px; background-position:right 10px bottom 20px; }
    #events #events-slider .slider-item .event-date span { font-size:11px; } 
    #events #events-slider .slider-item .event-location span { font-size:11px; } 
    
    #download-app { padding-top:5px; }
    #page-top-area .event-title span { font-size:28px; }
    #page-top-area #page-top-content .app-links a { width:120px; margin:0; }
    #page-top-area #page-top-content .app-links .boonju-invite { width:120px; height:38.5px; padding:7px 10px; }
    #page-top-area #page-top-content .app-links .boonju-invite span { font-size:14px; }
    #page-top-area #page-top-content .app-links .boonju-invite img { margin-bottom:0; }
    
    #page-top-area #page-top-content form .section-title { font-size:24px; }
    #page-top-area #page-top-content form .select-city select { width:95%; font-size:34px; }
    #page-top-area #page-top-content form .select-events select { width:95%; font-size:22px; }

}

@media screen and (max-width: 419px) { /* 420px */
    #download-modal { height:550px; }
    #hero #hero-content .form-area .sup-text { font-size:20px; }
    #hero #hero-content .form-area .text { font-size:32px; }
    #hero #hero-content .app-links a { width:150px; }
    
    #features .content { width:85%; }
    #features .content .item { width:100%; }
    #features .app-links a { width:150px; }
    
    #events .section-title { font-size:22px; }
    
    #why-boonju .content .app-links a { width:150px; }
    
    #page-top-area #page-top-content form .section-title { font-size:20px; }
    #page-top-area #page-top-content form .select-city select { width:95%; font-size:28px; }
    #page-top-area #page-top-content form .select-events select { width:95%; font-size:18px; }
}