html, body { max-width: 100vw; overflow-x: hidden; scroll-behavior: smooth; }
a { cursor: pointer; }

header nav { position: fixed; z-index: 100; right: 5%; }
header nav#multilingual { top: 5%; }
header nav#quick { top: 25%; }
header nav#quick > ul > li { position: relative; }
header nav#quick > ul > li::after
{ position: absolute; content: attr(data-label); color: var(--BodyColor); background: rgba(var(--pointcolor-rgb), .8); padding: .25rem 1rem; font-size: 1rem; font-weight: 500; top: 50%; right: 120%; transform: translateY(-50%); border-radius: .25rem; opacity: 0; transition: opacity .2s ease; pointer-events: none;}
header nav#quick > ul > li.on::after { opacity: 1; pointer-events: auto; }
#wrap { width:100%; min-height: 100vh; height: 100%; background: url("/img/main/bg_parking.jpg"); background-size: cover; background-repeat: no-repeat; }
#wrap .topvisual { display: flex; justify-content: center; position: relative; left: -3.5%; }
#wrap .topvisual > img { mix-blend-mode: lighten; }
#wrap .topvisualtxt::before, #wrap .topvisualtxt::after
{ position: absolute; content: ''; background: var(--BodyColor); left: 50%; transform: translate(-50%, -25%); }
#wrap .topvisualtxt::before { width: 80px; height: 1px; }
#wrap .topvisualtxt::after { width: 1px; height: 80px; top: -10%; }

#wrap .sidetxt { color: rgba(255, 255, 255, .1); }
#wrap .sidetxt.st-lf { text-align: left; }
#wrap .sidetxt.st-rt { text-align: right; }

#staff .contbox { width: 100%; background-image: url("/img/main/bg_doctor.jpg"); background-size: cover; background-repeat: no-repeat; background-position: center;  }
#staff .flexList .box:first-child { width: 35%; }
#staff .flexList .box:last-child { width: 60%; }
#staff .careerlist > li { position: relative; padding-left: 1rem; margin-bottom: 1rem; }
#staff .careerlist > li::before { position: absolute; content: '·'; left: 0; }

#speciality .positiontit { position: relative; z-index: 5; }
#speciality .positionbox { transform: translateY(-6%); }
#speciality .positionbox .imgBox { position: relative; }
#speciality .positionbox .imgBox p { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); }

#map { position: relative; margin: 3rem 0; }
#map .root_daum_roughmap_landing { width: 100%; height: 400px !important; }
#map .root_daum_roughmap .wrap_map { z-index: 49; }
#map .root_daum_roughmap .wrap_controllers, #map .root_daum_roughmap .wrap_btn_zoom { display: none; }
#map .buttonbox { left: 0; bottom: 0; z-index: 50; }

.divline { width: 100%; height: 1px; margin: 1rem 0; background: rgba(255, 255, 255, .3); }

.flexList .box .imgBox, .flexList .box .txtBox { overflow: hidden; }
.flexList .box .imgBox > img { width: inherit; height: inherit; object-fit: cover; }
.flexList .box .txtBox { width: 100%; height: 100%; top: 0; left: 0; background: rgba(0, 0, 0, 0); border-radius: 50%; opacity: 0; transition: background .15s ease-in-out, border-radius .2s ease-in-out, opacity .25s ease-in-out; cursor: zoom-in; }
.flexList .box:hover .txtBox { border-radius: 0; background: rgba(0, 0, 0, .3); opacity: 1; }

footer { border-top: 1px solid rgba(255, 255, 255, .3); }

.mList, .mBlock { display: none; }

@media (max-width: 768px){

    body {
        -ms-overflow-style: none;
    }
    
    ::-webkit-scrollbar {
        display: none;
    }

    header nav { right: 2%; }
    header nav#multilingual { top: 3%; }
    header nav#multilingual li.ml-15 { margin-left: .5rem; }
    header nav#quick { top: auto; bottom: 3%; }
    header nav#quick > ul > li:hover::after { opacity: 0; }
    header nav li img { width: 90%; }
    .container { width: 90%; }
    .sec_tit .font-80 { font-size: 3.5rem; }

    #wrap { background: url("/img/main/bg_parking_m.jpg"); background-size: cover; background-repeat: no-repeat; }

    #wrap .topvisual { left: -6%; padding-top: 20%; }
    #wrap .topvisual > img { transform: scale(1.4); }
    #wrap .topvisualtxt::before { width: 40px; }
    #wrap .topvisualtxt::after { height: 40px; top: -5%; }
    #wrap .topvisualtxt .font-24 { font-size: 1.8rem; }
    #wrap .topvisualtxt { margin-top: 4rem; }

    #wrap .sidetxt { white-space: nowrap; line-height: 1.1; }

    #staff .contbox { background-image: url("/img/main/bg_doctor_m.jpg"); background-size: cover; background-repeat: no-repeat; background-position: center;  }
    #staff .flexList .box:first-child, #staff .flexList .box:last-child { width: 100%; }
    #staff .careerlist > li { font-size: 1.7rem; }

    #speciality .positiontit { line-height: 1; }
    #speciality .positiontit.font-80 { font-size: 3.5rem; }
    #speciality .positiontit .font-100 { font-size: 4.8rem; }

    #map .root_daum_roughmap_landing { height: 200px !important; }
    #map .buttonbox { width: 70%; }

    .locinfo .box:first-child { padding-right: 0; }
    .locinfo .box:last-child { padding-left: 0; }
    
    .flexList .box .txtBox { border-radius: 0; background: rgba(0, 0, 0, .3); opacity: 1; }

    .pList { display: none; }
    .mList { display: flex; }
    .mBlock { display: block; }

}

