#mainVisual { position: relative; width: 100%; aspect-ratio: 9/4; overflow: hidden; transition: transform .6s cubic-bezier(.32,.94,.6,1); }
#mainVisual .mainSwiper { position: relative; height: 100%; border-radius: 0 0 2rem 2rem; overflow: hidden; }
#mainVisual .mainSwiper .swiper-slide { height: 100%; overflow: hidden; backface-visibility: hidden; opacity: .5; transition: opacity 1s; }
#mainVisual .mainSwiper .swiper-slide-active { opacity: 1; }
#mainVisual .mainSwiper .swiper-slide .bg { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: center no-repeat; background-size: cover; }
#mainVisual .mainSwiper .swiper-slide .bg1 { background-image: url(/img/main/mainslide_01_bg.jpg); }
#mainVisual .mainSwiper .swiper-slide .bg2 { background-image: url(/img/main/mainslide_02_bg.jpg); }
#mainVisual .mainSwiper .swiper-slide .bg3 { background-image: url(/img/main/mainslide_03_bg.jpg); }
#mainVisual .mainSwiper .swiper-slide .swiper-txt { position: relative; height: 100%; }
#mainVisual .mainSwiper .swiper-slide .swiper-txt p { position: absolute; top: 50%; left: 0; transform: translateY(-50%); }
#mainVisual .mainSwiper .swiper-button { color: #fff; }
#mainVisual .mainSwiper .swiper-button-prev { left: 2%; }
#mainVisual .mainSwiper .swiper-button-next { right: 2%; }
@media (max-width:990px){
    #mainVisual { aspect-ratio: 5/9; }
    #mainVisual .mainSwiper { border-radius: 0 0 5rem 5rem; }
    #mainVisual .mainSwiper .swiper-slide .bg { background-size: auto 100%; }
    #mainVisual .mainSwiper .swiper-slide .bg1 { background-image: url(/img/main/mainslide_01_bg_m.jpg); }
    #mainVisual .mainSwiper .swiper-slide .bg2 { background-image: url(/img/main/mainslide_02_bg_m.jpg); }
    #mainVisual .mainSwiper .swiper-slide .bg3 { background-image: url(/img/main/mainslide_03_bg_m.jpg); }
    #mainVisual .mainSwiper .swiper-slide .swiper-txt p { width: 100%; left: 50%; top: 50%; text-align: left; transform: translate(-50%,-50%); }
}

#mainVisual .mainSwiper .pagination-box { position: absolute; z-index: 99; bottom: 5rem; left: calc( (100% - 1440px) / 2 ); display: flex; align-items: center; justify-content: space-between; }
#mainVisual .mainSwiper .pagination-box .swiper-progress { position: relative; width: calc(1440px/4); margin-right: 5rem; }
#mainVisual .mainSwiper .pagination-box .swiper-fraction { position: absolute; color: #fff; bottom: auto; top: 50%; transform: translateY(-50%); display: flex; align-items: center; }
#mainVisual .mainSwiper .pagination-box .swiper-fraction .swiper-progress-bar { margin-left: 0; margin-right: 2rem; background: 0 0; display: flex; align-items: center; opacity: 1; }
#mainVisual .mainSwiper .pagination-box .swiper-fraction .swiper-progress-bar > span { font-size: 1rem; }
#mainVisual .mainSwiper .pagination-box .swiper-fraction .swiper-progress-bar.swiper-pagination-bullet-active { position: relative; width: 25rem; height: 3px; border-radius: 0; background-color: rgba(255,255,255,.3); }
#mainVisual .mainSwiper .pagination-box .swiper-fraction .swiper-progress-bar.swiper-pagination-bullet-active > span { font-size: 0; width: 100%; height: 100%; background-color: #fff; animation: progress 4s; }
@keyframes progress {
    0% { width: 0; }
    90% { width: 100%; }
    100% { width: 0; }
}
#mainVisual .mainSwiper .pagination-box .swiper-buttons { position: absolute; right: 0; display: flex; align-items: center; justify-content: space-between; }
#mainVisual .mainSwiper .pagination-box .swiper-arrow { cursor: pointer; }
#mainVisual .mainSwiper .pagination-box .swiper-arrow:last-child { margin-left: 1rem; }
@media (max-width:990px){
    #mainVisual .mainSwiper .pagination-box { width: 90%; left: 50%; transform: translateX(-50%); text-shadow: 1px 1px 2px rgba(0,0,0,.5); }
    #mainVisual .mainSwiper .pagination-box .swiper-progress { width: 100%; }
    #mainVisual .mainSwiper .pagination-box .swiper-fraction .swiper-progress-bar > span { font-size: 1.25rem; }
    #mainVisual .mainSwiper .pagination-box .swiper-fraction .swiper-progress-bar.swiper-pagination-bullet-active { width: 100%; }
}

#clinics .flexList .box { position: relative; cursor: pointer; }
#clinics .flexList .box .img { position: relative; }
#clinics .flexList .box .img::after { position: absolute; content: ''; top: 0; left: 0; width: 100%; height: 50%; background-image: linear-gradient(to Bottom, rgba(1, 61, 139, 1), transparent); opacity: 1; transition: height .25s, opacity .25s; }
#clinics .flexList .box:hover .img::after { height: 60%; opacity: .75; }
#clinics .flexList .box .inner { position: absolute; top: 0; left: 0; right: 0; bottom: 0; height: 100%; padding: 4rem 0;  }
#clinics .flexList .box .inner h6 { text-shadow: 0 0 2px rgba(0,0,0,.25); }
#clinics .flexList .box .inner .cont { text-shadow: 0 0 5px rgba(0,0,0,.35); }
#clinics .flexList .box:first-child { border-radius: 2rem 0 0 2rem; overflow: hidden; }
#clinics .flexList .box:last-child { border-radius: 0 2rem 2rem 0; overflow: hidden; }
@media (max-width:990px){
    #clinics .flexList .box .img::after { opacity: 1; }
    #clinics .flexList .box:first-child,
    #clinics .flexList .box:last-child { border-radius: 0; }
}

#doctor .container { background-image: url("../img/main/img_doctor_bg.png"); background-size: 100% auto; background-position: center; background-repeat: no-repeat; border-radius: 0 0 2rem 2rem; }
#doctor .rolling-wrap { position: absolute; display: flex; align-items: center; bottom: -1.5rem; left: 0; right: 0; }
#doctor .rolling-txt { position: relative; white-space: nowrap; margin: 0 2rem; line-height: 1; animation: slide-left 30s linear infinite; }

@media (max-width:1400px){
    #doctor .container { background-size: cover; }
}
@media (max-width:990px){
    #doctor .container { background-image: url("../img/main/img_doctor_bg_m.png"); }
}
@media (max-width:768px){
    #doctor .box.order2 { text-align: center; padding-left: 0; padding-bottom: 0; }
    #doctor .rolling-wrap { bottom: 0; }
}

@keyframes slide-left {
    from {
        -webkit-transform: translateX(0);
                transform: translateX(0); 
    }
    to {
        -webkit-transform: translateX(-100%);
                transform: translateX(-100%);
    }
}

#cheokTv .youtubeBox { display: flex; justify-content: space-between; align-items: center; margin-top: 5rem; }
#cheokTv .youtubeBox .viewer { width: 50%; }
#cheokTv .youtubeBox .viewer > iframe { width: 100%; aspect-ratio: 16/9; border-radius: 1rem; overflow: hidden; }
#cheokTv .youtubeBox .listBox { width: 45%; aspect-ratio: 16/9; overflow-y: auto; }
#cheokTv .youtubeBox .listBox .list::-webkit-scrollbar { width: 5px; border-radius: 0; }
#cheokTv .youtubeBox .listBox .list { width: 100%; height: 100%; }
#cheokTv .youtubeBox .listBox .list li { width: 85%; margin-bottom: .5rem; cursor: pointer; }
#cheokTv .youtubeBox .listBox .list li:hover { background-color: #222; }
#cheokTv .youtubeBox .listBox .thumb { width: 35%; aspect-ratio: 16/9; overflow: hidden; }
#cheokTv .youtubeBox .listBox .thumb > img { width: 100%; height: 100%; object-fit: cover; border-radius: .75rem; overflow: hidden; }
#cheokTv .youtubeBox .listBox .txt { width: 65%; padding: 0 1rem; text-overflow: ellipsis; overflow: hidden; word-break: break-word; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
@media (max-width:768px){
    #cheokTv .Tit img { width: 15%; }
    #cheokTv .youtubeBox { flex-wrap: wrap; margin-top: 2.5rem; }
    #cheokTv .youtubeBox .viewer { width: 100%; }
    #cheokTv .youtubeBox .listBox { width: 100%; margin-top: 3rem; }
    #cheokTv .youtubeBox .listBox .list li { width: 100%; }
    #cheokTv .youtubeBox .listBox .thumb { width: 30%; }
    #cheokTv .youtubeBox .listBox .thumb > img { width: 100%; height: 100%; object-fit: cover; border-radius: .5rem; }
    #cheokTv .youtubeBox .listBox .txt { width: 70%; }
    #cheokTv .youtubeBox .listSwiper { position: relative; margin-top: 4rem; }
    #cheokTv .youtubeBox .listSwiper .thumb { aspect-ratio: 16/9; overflow: hidden; }
    #cheokTv .youtubeBox .listSwiper .thumb { border-radius: 1rem; overflow: hidden; }
    #cheokTv .youtubeBox .listSwiper .txt { margin-top: 1.5rem; padding: 0; text-overflow: ellipsis; overflow: hidden; word-break: break-word; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
    #cheokTv .youtubeBox .listSwiper .swiper-pagination { position: absolute; bottom: -3rem; top: auto; background-color: #e3e3e3; }
    #cheokTv .youtubeBox .listSwiper .swiper-pagination .swiper-pagination-progressbar-fill { background-color: var(--pointcolor); }
}

#interior .swiper-slide { opacity: .5; transition: opacity 1s; }
#interior .swiper-slide-active { opacity: 1; }
/* #interior .interiorSwiper .swiper-wrapper { transition-timing-function: linear; } */
#interior .swiper-prg { position: relative; width: 60%; margin: 4rem auto 0; background: var(--light-gray); }
#interior .swiper-prg .swiper-pagination-progressbar-fill { background: var(--pointcolor); }
@media (max-width:1024px){
    #interior .swiper-prg { width: 75%; }
}
@media (max-width:768px){
    #interior .swiper-prg { width: 90%; }
}

#location hr { display: block; border-color: transparent; background-color: var(--light-gray); }
#location .mapTit { width: 15%; }
@media (max-width:990px){
    #location .container_mini { width: 100%; }
    #location .container_mini > .width40 { padding: 0 5%; }
    #location hr { opacity: .5; }
    #location .box { width: 100%; }
    #location .box:not(:first-child) { margin-top: 5rem; }
}

#main { scroll-behavior: smooth; }
#main .moreview { position: relative; display: inline-block; color: var(--pointcolor); background: #fff; font-weight: 700; padding: .75rem 1.25rem .75rem 1.5rem; border-radius: 2rem .2rem 2rem 2rem; overflow: hidden; }
#main .moreview::before { position: absolute; content: ''; top: 0; left: 0; background: var(--pointcolor); width: 0; height: 100%; opacity: 0; transition: width .3s, opacity .2s; border-radius: 2rem .2rem 2rem 2rem; }
#main .moreview::after { position: absolute; content: 'MORE VIEW'; color: #fff; top: 50%; left: 50%; transform: translate(-50%,-50%); display: flex; align-items: center; justify-content: center; width: 100%; height: 100%; opacity: 0; transition-delay: .3s; transition: opacity .3s; }
#main .moreview:hover::before { width: 100%; opacity: 1; }
#main .moreview:hover::after { opacity: 1; }
@media (max-width:768px){
    #main .moreview { padding: .75rem 1.5rem .75rem 1.75rem; }
}