@media (min-width:1536px){
    .main_side {
        display: flex;
    }
    .\32xl\:flex{
        display:flex
    }
    .\32xl\:flex-col{
        flex-direction:column
    }
    .\32xl\:justify-center{
        justify-content:center
    }
    .\32xl\:gap_y-16{
        row-gap:4rem
    }
}
/*min 1536*/

@media (max-width:1535px){
    header .header_r_menu button.menu_search {
        display: block;
    }
    .headmenu.on + .container header .header_r_menu button.menu_search {
        display: none;
    }
}
/*max 1535*/

@media (max-width:1024px){
    .pc_only_1024 {
        display: none;
    }
    .mo_only_1024 {
        display: block;
    }
}
/*max 1024*/


@media all and (max-width:1000px) {
    #main_pop {
        max-width: 95%;
        width: 95%;
    }    
}
/*max 1000*/

@media (min-width:769px){
    header .header_wrap {
        padding-left: 2rem;
        padding-right: 2rem;
    }    
    .md\:absolute{
        position:absolute
    }
    .md\:bottom-32{
        bottom:8rem
    }
    .md\:left-0{
        left:0
    }
    .md\:left-12{
        left:3rem
    }
    .md\:left-8{
        left:2rem
    }
    .md\:right-2{
        right:.5rem
    }
    .md\:right-8{
        right:2rem
    }
    .md\:top-0{
        top:0
    }
    .md\:top-2{
        top:.5rem
    }
    .md\:z-\[800\]{
        z-index:800
    }
    .md\:ms-6{
        margin-inline-start:1.5rem
    }
    .md\:mt_24{
        margin-top:6rem
    }
    .md\:h-10{
        height:2.5rem
    }
    .md\:h-12{
        height:3rem
    }
    .md\:h-14{
        height:3.5rem
    }
    .md\:h-16{
        height:4rem
    }
    .md\:h-20{
        height:5rem
    }
    .md\:h-5{
        height:1.25rem
    }
    .md\:h-6{
        height:1.5rem
    }
    .md\:h-8{
        height:2rem
    }
    .md\:h-9{
        height:2.25rem
    }
    .md\:h-\[300px\]{
        height:300px
    }
    .md\:h-\[400px\]{
        height:400px
    }
    .md\:h-\[500px\]{
        height:500px
    }
    .md\:h-\[52px\]{
        height:52px
    }
    .h_auto{
        height:auto
    }
    .md\:w-12{
        width:3rem
    }
    .md\:w-14{
        width:3.5rem
    }
    .md\:w-20{
        width:5rem
    }
    .md\:w-24{
        width:6rem
    }
    .md\:w-5{
        width:1.25rem
    }
    .md\:w-6{
        width:1.5rem
    }
    .md\:w-72{
        width:18rem
    }
    .md\:w-8{
        width:2rem
    }
    .md\:w-9{
        width:2.25rem
    }
    .md\:min-w-full{
        min-width:100%
    }
    .md\:max-w-screen-md{
        max-width:768px
    }
    .md\:grid-cols-3{
        grid-template-columns:repeat(3,minmax(0,1fr))
    }
    .md\:grid-cols-6{
        grid-template-columns:repeat(6,minmax(0,1fr))
    }
    .md\:grid-cols-\[10rem_1fr\]{
        grid-template-columns:10rem 1fr
    }
    .md\:grid-rows-2{
        grid-template-rows:repeat(2,minmax(0,1fr))
    }
    .md\:flex-row{
        flex-direction:row
    }
    .md\:flex-wrap{
        flex-wrap:wrap
    }
    .md\:gap_4{
        gap:1rem
    }
    .md\:gap_8{
        gap:2rem
    }
    .md\:gap_x-4{
        -moz-column-gap:1rem;
        column-gap:1rem
    }
    .md\:gap_x-8{
        -moz-column-gap:2rem;
        column-gap:2rem
    }
    .md\:space-y-4>:not([hidden])~:not([hidden]){
        --tw-space-y-reverse:0;
        margin-bottom:calc(1rem*var(--tw-space-y-reverse));
        margin-top:calc(1rem*(1 - var(--tw-space-y-reverse)))
    }
    .md\:space-y-6>:not([hidden])~:not([hidden]){
        --tw-space-y-reverse:0;
        margin-bottom:calc(1.5rem*var(--tw-space-y-reverse));
        margin-top:calc(1.5rem*(1 - var(--tw-space-y-reverse)))
    }
    .md\:overflow-x-visible{
        overflow-x:visible
    }
    .md\:bg-\[url\(\'\/images\/main\.jpg\'\)\]{
        background-image:url(../images/main.jpg)
    }
    .md\:p-4{
        padding:1rem
    }
    .md\:p-6{
        padding:1.5rem
    }
    .md\:p-8{
        padding:2rem
    }
    .md\:px_4{
        padding-left:1rem;
        padding-right:1rem
    }
    .md\:px_6{
        padding-left:1.5rem;
        padding-right:1.5rem
    }
    .md\:px_8{
        padding-left:2rem;
        padding-right:2rem
    }
    .md\:py-12{
        padding-bottom:3rem;
        padding-top:3rem
    }
    .md\:py-4{
        padding-bottom:1rem;
        padding-top:1rem
    }
    .md\:py-6{
        padding-bottom:1.5rem;
        padding-top:1.5rem
    }
    .md\:py-8{
        padding-bottom:2rem;
        padding-top:2rem
    }
    .md\:pb-6{
        padding-bottom:1.5rem
    }
    .md\:pb-8{
        padding-bottom:2rem
    }
    .md\:ps-8{
        padding-inline-start:2rem
    }
    .md\:pt_12{
        padding-top:3rem
    }
    .md\:text-2xl{
        font-size:1.5rem;
        line-height:2rem
    }
    .md\:text-3xl{
        font-size:1.875rem;
        line-height:2.25rem
    }
    .md\:text-base{
        font-size:1rem;
        line-height:1.5rem
    }
    .md\:text-lg{
        font-size:1.125rem;
        line-height:1.733rem
    }
    .md\:text-sm{
        font-size:.875rem;
        line-height:1.25rem
    }
    .md\:text-xl{
        font-size:1.25rem;
        line-height:1.733rem
    }
    .md\:text-xs{
        font-size: 0.8rem;
        line-height:1rem
    }
    .hover\:md\:text-2xl:hover{
        font-size:1.5rem;
        line-height:2rem
    }
}
/*min 769*/

@media all and (max-width:768px) {
    #menu_modal {
        padding-left: 1.5rem;
        padding-right: 1.5rem;
    }
    .menu_title h2 {
        font-size: 1.25rem;
    }
    .menu_title {
        padding: 2rem 0 2rem;
    }
    html:has(.modal.on) {
        padding-right: 0 !important;
    }
    #menu_modal {
        left: 50%;
    }
    header .header_wrap {
        padding-left: 1.5rem;
        padding-right: 1.5rem;
    }
    .main_section {
        padding-top: 2.5rem;
        padding-left: 1.5rem;
        padding-right: 1.5rem;
    }
    .event_wrap {
        gap: 0.6rem;
        padding-bottom: 0.3rem;
    }
    .event_wrap .event_box {
        width: 11rem;
        height: 11rem;
    }
    .pc_only_768 {
        display: none;
    }
    .mo_only_768 {
        display: block;
    }
    .main_address.foot_info {
        grid-template-columns: auto 1fr;
    }
    .category_wrap {
        gap: .6rem;
    }
    .layer_cart.on {
        margin-left: 0;
        padding-left: 1.5rem;
        padding-right: 1.5rem;
        width: 100%;
        transform: translateX(-50%);
    }
    body.cart .layer_cart.on {
        margin-left: 0;
    }
    .layer_cart.on.up {
        bottom: 90px;
    }
    .layer_cart > div {
        padding: 0.9rem;
    }
    .r_banner {
        object-fit: cover;
        height: 160px;
    }
    .depth_cate_wrap {
        bottom: 8%;
        padding: 0 1.5rem;
    }
    .depth_cate_wrap > li {
        padding: 0.4rem 0.7rem;
    }
    .section_normal {
        margin-top: 2.5rem;
        padding: 3rem 1.5rem;
    }
    section.back_img {
        padding-left: 1.5rem;
        padding-right: 1.5rem;
    }
    footer {
        padding: 2rem 1.5rem 6rem;
    }
    .main_pop_wrap .thumbs {
        display: none;
    }
    #main_pop .close_wrap {
        margin-top: 0;
        border-top: 0;
    }
    .inner .btn {
        height: 1.6rem;
        width: 1.6rem;
        margin-top: -0.8rem;
        box-shadow: none;
        /* border: 1px solid #f5f5f5; */
    }
    .inner .btn.btn_next {
        right: 10px;
    }
    .inner .btn.btn_prev {
        left: 10px;
    }
    .inner .btn:before {
        width: 5px;
    }
    #main_pop .close_pop, 
    .close_modal {
        width: 0.66rem;
        height: 0.66rem;
    }
    #main_pop .main_pop_wrap {
        border-radius: 6px;
    }
    #menu_headmenu, .search_area {
        padding-left: 1.5rem;
        padding-right: 1.5rem;
    }
    .cart_count_wrap {
        padding-left: 1.5rem;
        padding-right: 1.5rem;
    }
    .main_section h1.subti {
        font-size: 1.5rem;
        line-height: 1.8rem;
    }
    #login_pop.modal .modal_container .modal_wrap,
    .modal .modal_container .modal_wrap {
        padding: 2.25rem 1.625rem 1.625rem;
        width: 92%;
    }
    .modal .modal_container .modal_wrap:has(#member_rules) {
        padding-right: 0.8rem;
    }
    body#intro .logo {
        margin-top: -42px;
        margin-left: -100px;
        width: 200px;
        height: 14px;
    }
    .main_about {
        padding-top: 4rem;
        padding-bottom: 4rem;
        margin-top: 4rem;
    }
    section.fir {
        padding-top: 4rem;
    }
    .r_banner {
        object-fit: cover;
        height: 180px;
        object-position: left 50%;
    }
    .main_address {
        grid-template-columns: 20vw 1fr;
    }    
}
/*max 768*/

@media all and (max-width:600px) {
    section.back_img.vip .vip_slogan {
        padding-left: 1.5rem;
        padding-right: 1.5rem;
    }
    .vip_slogan .main_side_ti {
        font-size: 1.875rem;
        font-weight: 800;
        line-height: 1;
    }
    .w_box .question .img_card img {
        height: 0.9375rem;
    }
    .w_box .question .img_card {
        min-width: 105px;
    }
    .que .question {
        font-size: 1.0rem;
    }
    section.back_img .vip_slogan.about {
        right: 4rem;
    }
    section.director .about_info,
    section.director .director_ti_wrap {
        left: 4rem;
    }
    .main_about_word {
        padding-left: 2rem;
        padding-right: 2rem;
    }
    section.back_img.captain {
        height: 100vh;
        background-position: 30% bottom;
        background-size: cover;
    }    
}
/*max 600*/

@media all and (max-width:480px) {
    html, body {
        font-size: 15px;
    }
    nav.foot_menu .menu_icon {
        width: 22px;
        height: 22px;
    }
    body.cart .layer_cart.on {        
        width: 100%;
    }
    .depth_cate_wrap.depth_menu > li {
        border: 1px solid #dfdfdf;
        padding: 0 0.8rem;
        height: auto;
        padding: 0.4rem 0.8rem;
        font-size: 0.85rem;
    }
    header .header_logo {
        height: 1.75rem;
        margin-top: 3px;
    }
    .category_wrap {
        column-gap: 0.3rem;
        row-gap: 0.4rem;
    }
    .category_wrap > a  {
        padding: 0.4rem 0.8rem;
        font-size: 0.85rem;
    }
    .cate_box .cate_price > div span.discount, 
    .cate_box .cate_price > div span.price, 
    .cate_box .cate_price > div span.cost {
        font-size: 1.125rem;
    }
    .cate_box .cate_price > div span.sum {
        font-size: 0.9375rem;
    }
    .cate_box .cate_price {
        gap: 0.6rem;
    }
    .cate_box .event_alarm {
        font-size: 0.8125rem;
        padding: 1px 10px;
        margin-right: 3px;
        margin-top: -3px;
    }
    body#intro .logo {
        margin-top: -34px;
        margin-left: -80px;
        width: 160px;
        height: 11px;
    }
    .intro_copy {
        top: 61%;
    }
    .main_side_ti {
        font-weight: 600;
        font-size: 1.25rem;
        line-height: 1.55rem;
    }
    .main_side_copy {
        font-size: 0.8125rem;
        line-height: 1.25rem;
        margin-top: .5rem;
    }
    header .header_r_menu button {
        width: 18px;
        height: 18px;
    }
    header .header_r_menu {
        gap: .65rem;
    }
    .main_interior_photo {
        grid-template-columns: 1fr 20% 30%;
        gap: 0.5333rem;
        height:120px;
        margin-bottom: 0.5333rem;
    }  
    .main_interior_photo.last {
        grid-template-columns: 30% 1fr;
    }
    .main_interior_photo > div {
        border-radius: 3px;
    }
    .main_about_word {
        padding: 0 1.2rem 3rem;
    }
    .main_about_slogan {
        margin: 3rem 0 3rem;
        font-size: 1.25rem;
    }
    .w_box {
        margin-bottom: 0.875rem;
        padding: 1.65rem 1.2rem;
    }
    .w_box .question .badges {
        width: 2.2rem;
        height: 2.2rem;
        font-size: 1.1rem;
    }
    .w_box .question > div:nth-child(1) {
        margin-right: 0.7rem;
    }
    .anw {
        padding: 1.2rem 1.5rem;
    }
    .arrow-wrap {
        right: 0.2rem;
    }
    .up14, .down14 {
        width: 5px;
        height: 10px;
    }
    ul.menu_offcanvas li {
        margin-bottom: 1.2rem;
        font-size: 1.1rem;
        line-height: 1.5rem;
    }
    .close_btn_menu, .search_close {
        width: 20px;
        height: 20px;
    }
    .cate_box {
        padding: 1.2rem;
    }
    .w_box .anw {
        padding: 1.2rem 1.2rem 0;
    }
    .r_banner {
        height: 180px;
    }
    body#main .r_banner {
        object-position: 50% 50%;
    }
    .main_address {    
        grid-template-columns: 18vw 1fr;
        gap: 0.4rem;
    }
    section.director .about_info, section.director .director_ti_wrap {
        left: 2.7rem;
    }
    section.back_img .vip_slogan.about {
        right: 2.7rem;
        top: 32%;
    }
    section.back_img {
        height: calc(100vh - 107px);
    }
    section#about01 {
        height: calc(100vh - 71px);
    }
    .director_ti_wrap .director_ti {
        font-size: 1.5rem;
    }
    .director_ti_wrap .director_ti_en {
        font-size: 0.8rem;
    }
    section.director .director_ti_wrap {
        top: 33%;
    }
    .map_icon > a {
        width: 22px;
        height: 22px;
        margin-left: 7px;
    }

    /*위아래 5.75*/
    section.back_img div.con {
        padding-top: 4.5rem;
        padding-bottom: 4.5rem;
    }
    .main_about {
        padding-top: 4.5rem;
        padding-bottom: 4.5rem;
        margin-top: 4.5rem;
    }
    section.fir {
        padding-top: 4.5rem;
    }
    .main_about_word,
    .main_section.cate_con,
    main section:last-child,
    .dept_menu_con {
        padding-bottom: 4.5rem;
    }  
    .about_info,
    section.director .about_info {
        bottom: 4.5rem;
        line-height: 1.56;
    }
    section.event_best .event_box {
        padding: 1.0rem 1.0rem 0.8rem;
    }
    .event_wrap .event_box {
        width: 14rem;
    }
    section#member {
        height: calc(100vh - 71px);
    }
    section#member .vip_slogan {
        top: 35%;
        padding-left: 2rem;
    }
    .main_side .main_side_ti, .main_side_ti {
        font-weight: 600;
        font-size: 1.35rem;
        line-height: 1.733rem;
    }
    section#about01 .about_info {
        bottom: 10rem;
    }
    section#about01.back_img {
        height: 100vh;
        background-size: 130%;
    }
    .re_info_wrap .re_info_bas:nth-of-type(1) > div:nth-of-type(3) {
        display: block;
    }
    .re_info_wrap .re_info_bas:nth-of-type(1) > div:nth-of-type(3) select {
        margin-bottom: 0.8rem;
    }
    div span.c_pointer u {
        font-size: 13px;
    }
    .modal_head h1 {
        font-size: 1.4rem;
    }
    #member_rules {
        line-height: 1.68;
    }
    .modal_head {
        margin-bottom: 1.8rem;
    }
}
/*max 480*/