.m { display:none; }


/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
    MEDIA QUERY
 - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
/* mobile */
@media screen and (max-width: 1100px) {

    #wrap {
        min-width: unset;
        width: 100vw;
        height: 100%;
    }
    .pc { display:none !important; }
    .m { display:block; }
    .inner { width: 100%; }

    #quickmenu { display: none;}


    header.header > .inner div.nav,
    header.header > .inner button,
    header.header > .inner div.title a::after,
    header.header > .inner div.control a + a,
    header.header > .inner div.control a b { display:none; }


    header.header { background-color:var(--primary); border-bottom:0 }
    header.header > .inner { padding: 15px; }
    header.header > .inner div.title a { font-size:1.1em; color:#fff }

    /* 메뉴 버튼  */
    #menu-btn { display: flex; height: 30px; width:30px; transform: none; }
    #menu-btn > div { width: inherit; height:17px }
    #menu-btn span { width: 100%; height: 2px; border-radius: 0; background-color:rgba(255, 255, 255, 0.8); }






    #mobile-menu {
        top: 0; left: 0;
        width: 100vw; height: 100vh;
        opacity: 0;
    }
    #mobile-menu.on { opacity: 1; z-index: 99999; }
    #mobile-menu > .menu-area { width: 80vw; }
    #mobile-menu > .menu-area div.title { padding: 5vw; }


    #mobile-menu > .menu-area {
        background-color: #fff;
        box-shadow: 0 0 30px rgba(0, 0, 0, .1);
    }


    #mobile-menu > .menu-area div.title.m {
        background-color: var(--primary);
        display: flex;
        flex-direction: column;
        justify-content: flex-end;
        height: 250px;
        padding: 0;
    }
    #mobile-menu > .menu-area div.title.m div.img {
        width: 80px;
        aspect-ratio: 1 / 1;
        background-color: #fff;
        border-radius: 50%;
        background-repeat: no-repeat;
        background-position: center;
        background-size: 80%;
        background-image: url('/symbol.png');
    }
    #mobile-menu > .menu-area div.title.m a.home {
        display: block;
        padding: 0.5em 0 0; font-size: 1.1rem; font-weight: 500;
    }
    #mobile-menu > .menu-area div.title.m .grid.trio {
        width: inherit;
        --line : rgba(0,0,0,0.1);
        background-color: var(--line);
        border-top: 1px solid var(--line);
        grid-gap: 1px;
        margin-top: 1rem;
    }
    #mobile-menu > .menu-area div.title.m .grid.trio > a {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        padding: 1em;
        font-size: 0.8rem;
        grid-gap: 5px;
        background-color: var(--primary);
    }
    #mobile-menu > .menu-area div.title.m .grid.trio > a img {
        height: 30px;
    }





    #mobile-menu > .menu-area div.title.m a.close-btn {
        position: absolute;
        width: 3rem;
        height: 3rem;
        background-size: 1rem;
        right: 2vw; top: 2vw;
    }

    #mobile-menu div.menu-main-menu-container {
        height: calc( 90vh - 250px );
    }
    #mobile-menu div.menu-main-menu-container::-webkit-scrollbar-thumb { background-color: rgba(0,0,0,.2); }

    #mobile-menu ul.menu > li.menu-item { display:block; }
    #mobile-menu ul.menu li.menu-item:hover {
        background-color: unset;
    }
    #mobile-menu ul.menu > li.menu-item > a {
        color: #555;
        font-size: 1rem;
        opacity: 1.0;
        padding: 1rem 1.5rem;
        border-bottom: 1px solid rgba(200,200,200,.1);
    }
    #mobile-menu ul.menu li.menu-item-has-children > a::after {
        background-image: url('./img/arrow-menutoggle-dark.svg');
    }
    #mobile-menu ul.menu > li.menu-item-has-children > a span {
        background-color: rgba(200, 200, 200, 0.1);
        border: 1px solid rgba(200,200,200,.5);
        color: var(--primary);
        padding: 1px 6px;
        font-weight: 700;
    }
    #mobile-menu ul.menu li.menu-item-has-children.on ul.sub-menu {
        background-color: #f6f6f6;
        padding: 0.5em 0;

        border: 1px solid rgba(200,200,200,.1);
    }
    #mobile-menu ul.menu li.menu-item-has-children ul.sub-menu li a {
        color: #555;
        font-size: 0.9rem;
        padding: 0.35em 3em;
        background-color: inherit;
    }

    #mobile-menu ul.menu li.current-menu-item > a,
    #mobile-menu ul.menu li.menu-item-has-children.on > a,
    #mobile-menu ul.menu li.menu-item.current-menu-item a { color:var(--primary); background-color:inherit; }






















    footer .inner { padding:50px 30px }
    footer p { text-align:center; }
    footer p span.op60 { display: block; font-size: 0; }
    footer p.copyright { font-size:0.8rem; text-align-last:center; line-height:1.4; letter-spacing:0.05em }






    /* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
        common elements
     - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
    section .inner {
        padding: 20px;
    }

    section.main-visual .swiper-slide {
        background-size: 100%;
        aspect-ratio: 100 / 56.75;
    }
    section .section-title span { font-size: 1rem; margin-bottom:0 }
    section a.btn { font-size: 1rem; grid-gap: 0.6em; padding: 0.8em; }
    section.main-preivew div.grid.trio { grid-gap: 5px; }


    /* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
        SUB PAGE
    - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
    div.submenu-tab {
        width: 100vw;
        overflow-x: auto;
        justify-content: flex-start;
        padding: 1rem 2rem;
    }
    section a.youtube img.play { width:50px }
    section .swiper-zone .mainzone .swiper-slide { height: 45px; }

    /* - - - - - - -  - - - - - - - - - -
        비급여 페이지
     - - - - - - - - - - - - - - - - - */
    section.nonpay .table-wrapper { width: 90vw; margin: 0.5em auto 1em; overflow-x: auto;}
    section.nonpay h5.caption { font-size: 1em; margin-top:0 }
    section.nonpay table.npay tr * { min-width: 6em; padding: 8px 12px; font-size: 0.9rem}

    section.nonpay table.npay tr td:nth-child(2),
    section.nonpay table.npay tr td:nth-child(4) { min-width: 10em; }

    section.nonpay p.txt-right { font-size: 0.9rem; }


    /* - - - - - - -  - - - - - - - - - -
        오시는길
     - - - - - - - - - - - - - - - - - */
     section.locate div.map { aspect-ratio: 3 / 2; }
     section.locate div.locate-title {
        padding: 20px 10px;
        flex-direction: column;
        align-items: flex-start;
     }
     section.locate div.locate-title .btn-zone {
        display: grid; grid-template-columns: 1fr 1fr;
        grid-gap: 5px;
        width: 100%;
        margin-top: 20px;
    }
     section.locate div.locate-title span.title {
        color: var(--dark);
        font-size: 1rem;
        font-weight: 800;
     }
     section.locate div.locate-title p.address {
        font-size: 1rem;
        color: #666;
     }

    section.locate div.locate-grid-wrap {}
    section.locate div.locate-grid {
        padding: 20px 20px;
        display: grid;
        grid-template-columns: 1fr;
    }
    section.locate div.locate-grid b { font-size:1.1rem }
/*    section.locate div.locate-grid b img { display:none; }*/
    section.locate div.locate-grid p.p-grid {
        display: grid;
        grid-template-columns: 60px auto;
        font-size: 1rem;
        margin: 10px 5px;
    }
    section.locate div.locate-grid p.p-grid span + span::before {
        margin-right: 0;
        border-left: 0;
    }


    #wpadminbar { display:none !important; }
    section img.morespace {
        margin: 10px auto 30px;
    }


}