/*
Theme Name: 두신경과
Author: Jeymedi
Author URI: https://jmedidesign.com
Description: 두신경과 웹사이트 테마
Version: 1.0.0
*/

/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
    LAYOUT
 - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
body { overflow-x:hidden; }

.inner {
    width: var(--inner);
    margin: 0 auto;
    position: relative;
/*    border-left: 1px dashed magenta;*/
/*    border-right: 1px dashed magenta;*/
}
.inner.wide {
    width: 100%;
}

/* header */
header.header {
    position: fixed;
    top: 0;
    width: 100%;
    max-width: 100vw;
    height: 0;
    transition: all ease 0.5s;
    z-index: 99;
}
header.header .gnb-floor {
    position: relative;
    z-index: 3;
    background-color: #F5F1ED;
    border-bottom:1px solid #ededed;
    transition: all ease 0.3s;
}
/* 메뉴 on */
header.header.on .gnb-floor {
    background-color: #fff;
    border-color: #ddd;
}
header.header .gnb-floor > .inner,
header.header .sub-floor > .inner {
    width: 100%;
    max-width: var(--inner);
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    border-bottom:1px solid rgba(255, 255, 255, 0);
    transition: all ease 0.3s;
}
header.header .gnb-floor > .inner a.logo {
    display: block;
    width: 260px;
    aspect-ratio: 3 / 1;
    background-repeat: no-repeat;
    background-size: contain;
    background-position: left center;
/*    background-image: url('./img/logo-header.svg');*/
    background-image: url('./img/logo-euiwon.svg?ver=000');
}
header.header .gnb-floor div.menu-btn { display: none; }

header.header .gnb-floor nav.gnb ul.menu {
    display: flex;
    flex-direction: row;
    gap: 0;
}
header.header .gnb-floor nav.gnb ul.menu > li {
    padding: 2em;
}

header.header .gnb-floor nav.gnb ul.menu li.menu-item a {
    display: block;
    font-weight: 500;
}
header.header .gnb-floor nav.gnb ul.menu li.menu-item.on a,
header.header .gnb-floor nav.gnb ul.menu li.menu-item.current-menu-parent a {
    /* hover 부모 */
    /* 현재 페이지 부모 */
    color: var(--primary);
}
header.header .gnb-floor nav.gnb ul.sub-menu { display:none; }




/* 서브메뉴 */
header.header .sub-floor {
    display: grid;
    visibility: hidden;
    background-color: #fff;
    height: 380px;
    border-bottom:1px solid #ddd;
    transform: translateY(-450px);
    z-index: 1;
    transition: all ease 0.6s;
    background-image: url(./img/subfloor-ivory.png);
    background-repeat: no-repeat;
    background-size: 30%;
    background-position: left bottom;
}
header.header .sub-floor .inner {
    display: flex;
    flex-direction: row;
    align-items: stretch;
    justify-content: flex-start;
}
header.header .sub-floor .inner .symbol-zone {
    width: 500px;
    padding: 60px 0;
    background-color: #FFF9F2;
    background-image: url('./img/symbol-op20.svg');
    background-repeat: no-repeat;
    background-size: auto 46%;
    background-position: left bottom 50px;
}
header.header .sub-floor .inner .symbol-zone strong {
    font-size: 1.5em;
}
/* 포커스 자식메뉴 */
header.header .sub-floor .inner .submenu-zone {
    display: flex;
    flex-direction: row;
    padding: 60px;
    justify-content: flex-start;
    width: 600px;
    border-right: 1px solid #ddd;
}

header.header .sub-floor .inner .submenu-zone ul {
    width: inherit;
}
header.header .sub-floor .inner .submenu-zone ul li a {
    display: block;
    font-weight: 500;
    padding: 0.3em 0;
    width: 100%;
}
header.header .sub-floor .inner .submenu-zone ul li a:hover {
    color: var(--primary);
}
/*  */
header.header .sub-floor .inner .info-zone {
    padding: 40px 0 60px;
    width: 500px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    margin-left: auto;
    grid-gap: 40px;
}
  .info-zone div.call {
    display: grid;
    grid-template-columns: 1fr;
    text-align: center;
}
  .info-zone div.call span,
  .info-zone div.call strong {
    font-size: 1.2em;
    font-weight: 700;
    display: block;
    text-align: center;
    color: #717171;
}
  .info-zone div.call strong {
    line-height: 1.0;
    font-size: 2.35em;
    font-family: var(--p);
    color: var(--primary);
    font-weight: 800;
}

  .info-zone div.link {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    align-items: center;
    justify-content: center;
    grid-gap: 42px;
}
  .info-zone div.link a {
    background-repeat: no-repeat;
    background-size: contain;
    background-position: top center;
    padding: 90px 0 0 0;
    color: #717171;
    text-align: center;
    font-size: 1em;
    font-weight: 500;
}
  .info-zone div.link a:nth-child(1) { background-image:url('./img/icon-header-info-doctor.svg') }
  .info-zone div.link a:nth-child(2) { background-image:url('./img/icon-header-info-hospital.svg') }
  .info-zone div.link a:nth-child(3) { background-image:url('./img/icon-header-info-equip.svg') }
  .info-zone div.link a span {}





header.header .sub-floor ul.menu li a {
    display: block;
    font-size: 17px;
    color: #444;
    text-align: center;
    font-weight: 300;
    padding: 5px 0;
/*    margin: 0 3px;*/
/*    border-radius: 5px;*/
}
header.header .sub-floor ul.menu li a:hover,
header.header .sub-floor li.current-menu-item a {
    font-weight: 500;
    color: var(--primary);
/*    background: #ebf5ff;*/
}
/* 서브메뉴 on */
header.header.on .sub-floor.on {
    visibility: visible;
    transform: translateY(0);
}









/* footer */
footer.footer {
    max-width: 100vw;
    overflow: hidden;
    background-color: #463829;
    font-size: 16px;
}
footer.footer * { color:rgba(255, 255, 255, .9); }
footer.footer > .inner {
    padding: 80px 0;
    display: flex;
    justify-content: space-between;
    align-items: center;
}
/* 푸터메뉴 */
footer.footer ul.menu {
    display: flex;
    flex-direction: row;
    align-items: center;
    grid-gap: 1em;
    font-size: 1.2em;
    margin-bottom: 2em;
}
footer.footer ul.menu li.menu-item a { /*  푸터메뉴 단일  */
    line-height: 1.0;
}
footer.footer ul.menu li.menu-item + li.menu-item {
    padding-left: 1em;
    border-left: 2px solid #fff;
    line-height: 1.0;
}
footer.footer ul.menu li.menu-item a:hover { opacity: 0.75; }

/* 푸터로고 */
footer.footer img.logo { width: 380px; }
/* 푸터인포 */
footer.footer ul.info {
}
footer.footer ul.info li {
    font-weight: 300;
    display: flex;
    flex-direction: row;
    grid-gap: 0.5em;
    align-items: center;
}
footer.footer ul.info li b {
    padding-right: 0.5em;
    border-right: 2px solid #fff;
    line-height: 1.0;
}
footer.footer ul.info li + li {
    margin-top: 0.5em;
}
footer.footer ul.info li i {
    margin: 0 0.35em;
}


/* 푸터링크 */
footer.footer div.links {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    grid-gap: 25px;
}
/* 지도버튼 */
a.btn-square-map {
    --btncolor : #333761;
    color: #fff;
    display: flex;
    border-radius: 8px;
    padding: 16px 25px;

    background-color: var(--btncolor);
    border: 1px solid var(--btncolor);
    grid-gap: 10px;
    place-self: center;
    transition: transform ease 0.3s;
}
a.btn-square-map:hover {
    transform: translateY(-5px);
}

a.btn-square-map::before {
    content: '';
    display: block;
    width: 18px;
    aspect-ratio: 1 / 1;
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
}
a.btn-square-map.naver::before { background-image:url('./img/btn-map-naver.png') }
a.btn-square-map.kakao::before { background-image:url('./img/btn-map-kakao.png') }

/* copyright */
footer.footer .copyright {
    font-size: 0.9em;
    font-weight: 300;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    opacity: 0.6;
    margin-top: 2em;
}


/* quickmenu */
#quickmenu {
    display: flex;
    flex-direction: column;
    position: fixed;
    right: -1px;
    top: 50%;
    transform: translateY(-40%);
    justify-content: center;
    z-index: 99;
}
#quickmenu .group {
    display: flex;
    flex-direction: column;
    justify-content: center;
    background-color: #fff;
    padding: 2em 0.7em;
    font-size: 14px;
    gap: 1em;
    box-shadow: 0 5px 15px -2px rgba(0, 0, 0, 0.1);
}
#quickmenu .group a {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;
    font-weight: 500;
    gap: 5px;
}
#quickmenu .group a .icon {
    display: inline-block;
    width: 60px;
    aspect-ratio: 1 / 1;
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
}
#quickmenu .group a:nth-child(2) .icon { background-size:auto 90% }
#quickmenu .group a:nth-child(3) .icon { background-size:90% }
#quickmenu .group a:nth-child(4) .icon { background-size:80% }

#quickmenu .topbtn {
    padding-top: 10px;
    text-align: center;
    cursor: pointer;
    background-color: var(--primary);
}
#quickmenu .topbtn img {
    width: 30px;
}







/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
    MAINPAGE : 메인페이지
 - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
/* - - - - - 01. 메인비주얼  */
section.main-visual {
    height: 100vh;
    background-color: #555;
    overflow: hidden;
    position: relative;
}
section.main-visual .swiper-slide {
    background-size: cover;
    background-position: right center;
}
section.main-visual .swiper-slide .inner {
    height: 100%;
    justify-content: center;
    align-items: center;
}
section.main-visual .swiper-slide .text-box {
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    grid-gap: 2.25em;
}
section.main-visual .swiper-slide .text-box * {
    color: #fff;
}
section.main-visual .swiper-slide .text-box p.eng {
    text-transform: uppercase;
    letter-spacing: 0.15em;
    font-weight: 700;
    font-size: 1.8em;
}
section.main-visual .swiper-slide .text-box .mv-title h3 {
    font-size: 3em;
    font-weight: 700;
    line-height: 1.3;
    letter-spacing: 0;
    font-family: var(--p);
}
section.main-visual .swiper-slide .text-box p.mv-desc {
    font-weight: 300;
    letter-spacing: 0.01em;
}
section.main-visual .control {
    width: 360px;
    height: 10px;
    z-index: 1;
    position: absolute;
    left: calc(50% - 800px);
/*    left: 0;*/
    top: 50%;
    transform: translateY(25vh);
}
section.main-visual .control .progress-box {
    width: 100%;
    position: relative;
    z-index: 11;
    left: 50%;
    top: 40%;
    transform: translate(-50%, 0);
}
section.main-visual .control .autoplay-progress {
    position: absolute;
    left: 0;
    top: 0;
    z-index: 10;
    width: 100%;
    height: 4px;
    background-color: rgba(255, 255, 255, 1);
}
section.main-visual .control .autoplay-progress svg {
    --progress: 0;
    position: absolute;
    left: 0;
    top: 0;
    z-index: 10;
    width: 100%;
    stroke-width: 2px;
    stroke:#FF8000;
    fill: none;
    stroke-dashoffset: calc(100 * (1 - var(--progress)));
    stroke-dasharray: 100;
}



/* - - - - - - - - - -섹션 공통 - - - - - - - - - - */
section .inner { padding:150px 0 }

section.dark * { color:#fff }
section img.dot { height:10px; display:block; margin:1em 0  }

section .title-zone {
    display: flex;
    flex-direction: column;
    grid-gap: 1em;
}
section .title-zone p.uppercase.eng {
    letter-spacing: 0.1em;
    opacity: 0.5;
}
section .title-zone h4.section-title {
    line-height: 1.3;
    font-family: var(--p);
    font-size: 2.5em;
}
section .title-zone h4.section-title i {
    font-weight: 300;
}

section .p-wrap p { font-family:var(--p); }
section .p-wrap p + p { margin-top:1.5em }


section .unit { margin: 80px auto 0; }
section .unit.mt { margin: 80px auto 0; }
section .unit.mb { margin: 0 auto 80px; }
section .unit.ml { margin: 40px auto; }
section .unit.nomargin { margin : 0 auto; }
section .unit.img { margin: 60px auto; text-align:center; }
section .unit.unit90 { width: 90%; }
section .unit.unit80 { width: 80%; }
section .unit.unit70 { width: 70%; }
section .unit.unit60 { width: 60%; }
section .unit.unit50 { width: 50%; }



/* - - - - - 02. 두신경약속  */
section.main-promise .inner {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    grid-gap: 80px;
}
section.main-promise .title-zone p.uppercase.eng { opacity: 1; }


/* - - - - - 03. 진료센터  */
section.main-clinic {}
section.main-clinic .inner {
    width: 90vw;
    display: grid;
    grid-template-columns: 1fr 4fr;
    grid-gap: 60px;
    align-items: center;
    padding: 100px 0;
    margin: 0 0 0 10vw;
}
section.main-clinic .slide-box {
    margin: 0;
    overflow: hidden;
}
section.main-clinic .slide-box .clinic-slide { padding-right: 10vw; }
section.main-clinic .swiper-slide {
    padding: 50px 20px;
}
section.main-clinic .swiper-slide .card {
    border-radius: 3px;
    display: grid;
    aspect-ratio: 9 / 16;
/*    align-items: flex-end;*/
    background-color: #eee;
    overflow: hidden;
    cursor: pointer;
    background-position: center;
    background-size: 105%;


    box-shadow: 0 10px 15px rgba(198, 182, 161, .2);

    position: relative;
    transition: all ease 0.3s;
}
section.main-clinic .swiper-slide .card:hover {
    border-radius: 50px;
    box-shadow: 0 15px 25px rgba(198, 182, 161, .6);
    background-size: 115%;
}
section.main-clinic .swiper-slide .card .bg-secondary {
    width: 100%;
    height: 5em;
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    justify-content: flex-start;
    position: absolute;
    left: 0; bottom: -1em;

    padding: 1.2em 1em 1em 1.5em;
    grid-gap: 0.5em;
    color: #fff;
    font-weight: 600;
    font-family: var(--p);
    font-size: 1.1em;
    background-color: #6B5E4E;
    transition: all ease 0.3s;
}
section.main-clinic .swiper-slide .card:hover .bg-secondary {
    padding: 1.5em 1em 1em 1.5em;
    left: 0; bottom: 0;
}
section.main-clinic .swiper-slide .card .bg-secondary::before {
    content: '';
    width: 1.8em;
    aspect-ratio: 1 / 1;
    background-image: url('./img/symbol-fff.svg');
    opacity: 0.5;
    background-repeat: no-repeat;
    background-position: left center;
    background-size: contain;
    transition: all ease 0.3s;
}
section.main-clinic .swiper-slide .card:hover .bg-secondary::before { opacity: 1; }

section.main-clinic .control {
    margin: 50px 30px 0 auto;
    display: flex;
    flex-direction: row;
    grid-gap: 10px;
}
section .button-prev,
section .button-next {
    display: block;
    width: 45px;
    aspect-ratio: 1 / 1;
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
    cursor: pointer;
    opacity: 0.9;
    transition: all ease 0.2s;
}
section .control a:hover { opacity:1 }

section .button-prev { background-image:url('./img/clinic-prev.svg') }
section .button-next { background-image:url('./img/clinic-next.svg') }






/* - - - - - 04. 4명의전문의  */
section.main-four {
    background-image: url(./img/main-three-bg.jpg);
    background-size: cover;
    background-position: center;
}
section.main-four .inner {
    display: flex;
    flex-direction: column;
    grid-gap: 50px;
    width: 70%;
}



/* - - - - - 05. 의료진소개  */
section.main-doctor {}
section.main-onestop .control,
section.main-doctor .control {
/*    border: 1px dashed red;*/
    width: 90%;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    position: absolute;
    left: 5%; bottom: 50%;
    z-index: 2;
    transform: translateY(100%);
}

section.main-doctor .swiper { position:relative; }
section.main-doctor img.said { width:40%; display:block; margin:30px auto; }
section.main-doctor .doctor-box {
    width: 70%;
    margin: 0 auto;
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-gap: 80px;
    align-items: center;
}
section.main-doctor .doctor-box .img {
    background-image: url('./img/symbol-op10.svg');
    background-repeat: no-repeat;
    aspect-ratio: 1 / 1.2;
    background-position: top 60px left 50px;
    background-size: 50%;
}
section.main-doctor .doctor-box .img img {
    width: 70%;
    display: block;
    margin-left: auto;
}

section.main-doctor .doctor-box .txt {}
section.main-doctor .doctor-box .txt p { font-weight:600 }
section.main-doctor .doctor-box .txt h5 {
    padding-bottom: 0.5em;
    margin-bottom: 0.5em;
    border-bottom: 1px solid #E2E2E2;
    font-size: 1.8em;
}
section.main-doctor .doctor-box .txt ul.dot {
    margin-top: 1.5em;
}
section ul.dot li {
    display: grid;
    grid-template-columns: 1em auto;
}
section ul.dot li::before {
    content: '\00b7';
}
section ul.dot li + li {
    margin-top: 0.2em;
}

section ul.number li {
    display: grid;
    grid-template-columns: 1em auto;
}
section ul.number li + li {
    margin-top: 0.2em;
}




section.main-doctor .doctor-box .txt a.m { display:none; }

/* - - - - - 의료진소개 (서브)  */
section.main-doctor.sub {}
section.main-doctor.sub .unit .doctor + .doctor {
    margin-top: 100px;
}



/* - - - - - + 추가  */
section.main-onestop {}
section.main-onestop .swiper-slide {
    text-align: center;
}
section.main-onestop .swiper-slide img {
    margin: 0 auto;
    width: 70%;
}
section.main-onestop h5 {
    margin: 0 auto 0.5em;
    text-align: center;
    font-size: 1.75em;
}
section.main-onestop h5 span {
    color: var(--primary);
}
section.main-onestop .control {
    bottom: unset;
    top: 32%;
}






/* - - - - - 06. 장비소개  */
section.main-equip {}
section.main-equip .swiper {
    margin-top: 50px;
    padding: 50px 0;
    position: relative;
}
section.main-equip .swiper-slide {
    opacity: 0.5;
    display: flex;
    align-items: center;
    justify-content: center;
    transform: scale(0.7);
    transition: all ease 0.5s;
}
section.main-equip .swiper-slide.swiper-slide-active {
    opacity: 1;
    transform: scale(1);
}
section.main-equip .swiper::after {
    content: '';
    width: 480px;
    aspect-ratio: 1 / 1;
    border-radius: 50%;
    position: absolute;
    background-image: url(./img/equip-text-rotate.png);
    background-size: contain;
    background-position: center;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    z-index: 0;
    animation: rotate360 30s linear infinite;
}
  @keyframes rotate360 {
    from { transform: translate(-50%, -50%) rotate(0deg); }
    to { transform: translate(-50%, -50%) rotate(360deg); }
  }

section.main-equip .swiper-slide .equip-circle {
    width: 400px;
    aspect-ratio: 1 / 1;
    border-radius: 50%;
    overflow: hidden;
    background-color: #fff;
    position: relative;
    background-size: cover;
    background-position: center;
}
section.main-equip .swiper-slide .equip-circle .overlay {
    position: absolute;
    width: inherit; height: 100%;

    background-color: rgba(0, 0, 0, .0);
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    align-items: center;
    padding-bottom: 20%;
    transition: all 1s ease 0.2s;
    transform: translateY(100%);
}
section.main-equip .swiper-slide.swiper-slide-active .equip-circle .overlay {
    transform: translateY(0);
    background-color: rgba(0, 0, 0, .5);
}
section.main-equip .swiper-slide .equip-text {
    color:#fff;
    text-align:center;
    transition: all 0.8s ease 1.0s;
    transform:translateY(50px);
    opacity:0;
}
section.main-equip .swiper-slide.swiper-slide-active .equip-text {
    transform:translateY(0);
    opacity:1;
}

section.main-equip .swiper-slide h5.equip-text {}
section.main-equip .swiper-slide p.equip-text {}

section.main-equip .control {
/*    border: 1px dashed red;*/
    width: 40%;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    position: absolute;
    left: 30%; bottom: 50%;
    z-index: 2;
    transform: translateY(100%);
}
section.main-equip .control .button-prev { background-image:url('./img/equip-prev.svg'); }
section.main-equip .control .button-next { background-image:url('./img/equip-next.svg'); }



/* - - - - - 07. 시설안내  */
section.main-interior {}
section.main-interior .inner {
    padding: 150px 5vw 60px;
    position: relative;
    margin-bottom: 100px;
}
section.main-interior .swiper {
    margin-top: 50px;
}
section.main-interior .swiper-slide {
    aspect-ratio: 3 / 2;
    background-color: #eee;
    background-size: cover;
    background-position: center;
}
section.main-interior .swiper-slide a {
    display: block;
    width: inherit;
    height: inherit;
    position: absolute;
}

section.main-interior .swiper-pagination-bullet { background-color: #DBD3CB; opacity:0.8 }
section.main-interior .swiper-pagination-bullet-active { background-color: #C7B39B; opacity: 1}


/* - - - - - 08. 진료시간오시는길  */
section.main-info {}
section.main-info .inner {
    padding: 100px 4vw 200px;
}

section.main-info .title-grid {
    display: grid;
    grid-template-columns: auto 60% 80px;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 50px;
}
section.main-info .title-grid h4 {}
section.main-info .title-grid .line {
    height: 2px;
    background-color: var(--tertiary);
}
section.main-info .title-grid .symbol {
    aspect-ratio: 1 / 1;
    width: inherit;
    background-color: var(--secondary);
    background-image: url('./img/symbol-fff.svg');
    background-size: 50%;
    background-repeat: no-repeat;
    background-position: center;
    border-radius: 50%;
}

section.main-info h4.uppercase { font-weight: 300; }
section.main-info h4.uppercase b { font-weight:800; color:var(--primary); }

section.main-info .info-grid {
    display: grid;
    grid-template-columns: 1fr 1.4fr;
    padding: 0 10px;
    align-items: flex-start;
    grid-gap: 0;
}
section.main-info .info-grid div.info-zone {
    display: grid;
    grid-template-columns: 1fr;
    justify-content: flex-start;
    align-items: center;
    grid-gap: 60px;
    padding-top: 15px;
}
section.main-info .info-grid div.info-zone h5 {
    margin-bottom: 0.5em;
}
section.main-info .info-grid div.info-zone p.number {
    font-size: 3em;
    font-weight: 800;
    color: var(--primary);
    line-height: 1.0;
    font-family: var(--p);
}
section.main-info .info-grid div.info-zone p.address {
    font-size: 1.1em;
}
section.main-info .info-grid div.info-zone p.parking {
    margin-top:0.3em; display: flex; align-items: center; gap: 0.5em;
}

section.main-info .info-grid div.info-zone p i.inline-caution {
    display: inline-block;
    background-color: crimson;
    color: #fff;
    font-weight: 800;
    width: 1.5em;
    height: 1.5em;
    text-align: center;
    border-radius: 50%;
    font-size: 0.8em;
}
section.main-info table.timetable {}
section.main-info table.timetable tr * {
    padding: 0.5em;
    font-size: 1.1em;
}
section.main-info table.timetable td {
    font-weight: 600;
    color: #A5763E;
}
section.main-info table.timetable td.holliday {
    font-weight: 500;
    color: crimson;
    text-align: left;
    padding-top: 1.5em;
}



section.main-info .info-grid div.map-zone {}
section.main-info .info-grid div.map-zone #map {
    background-color: #eee;
    aspect-ratio: 8 / 7;
    border-radius: 70px;
    border: 1px solid #ddd;
}
section.main-info .info-grid div.map-zone .grid.trio {
    margin-top: 30px;
    padding: 0 5px;
    grid-gap: 10px;
}
section.main-info a.map {
    border: 3px solid var(--color);
    padding: 0.9em 1.5em;
    border-radius: 4em;
    font-weight: 500;
    text-indent: 2em;
    background-size: 1.8em;
    background-position: left 1em center;
    background-repeat: no-repeat;
    box-shadow: 0 5px 10px rgba(0, 0, 0, .0);
    position: relative;
    transform: translateY(0);
    transition: all ease 0.3s;
}
section.main-info a.map::after {
    content: '';
    display: block;
    width: 3em;
    aspect-ratio: 5 / 1;
    background-repeat: no-repeat;
    background-size: auto 90%;
    background-position: center;
    background-image:url(./img/arrow-map-btn.svg);
    position: absolute;
    top: 50%;
    right: 1em;
    transform: translate(0, -50%);
    transition: all ease 0.5s;
}

section.main-info a.map:hover {
    transform: translateY(-5px);
    box-shadow: 0 8px 10px rgba(0, 0, 0, .1);
}
section.main-info a.map:hover::after {
    transform: translate(-30%, -50%);
}

section.main-info a.map.naver {
    --color: #03CF5D;
    background-image: url('./img/map-naver.svg');
}
section.main-info a.map.kakao {
    --color: #F7DF49;
    background-image: url('./img/map-kakao.svg');
}
section.main-info a.map.blog {
    --color: #2FB14A;
    background-image: url('./img/map-blog.svg');
}


















/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
    SUBPAGE : 서브 공통
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
/* - - - - - 서브헤더 */
section.sub-header > .inner {
    padding: 180px 5vw 50px;
}
section.sub-header p.eng {
    text-transform: uppercase;
    letter-spacing: 0.2em;
    text-align: center;
    margin-bottom: 0.5em;
}
section.sub-header p.eng b {
    color: var(--primary);
    font-weight: 800;
}
section.sub-header h2.page-title {
    text-align: center;
    font-size: 2.3em;
    letter-spacing: 0.1em;
    font-family: var(--p);
}
section.sub-header .sub-header-img {
    height: 300px;
    background-size: 100%;
    background-position: center;
}
/* - - - - - 공통배너   */
section.repeat.banner {
    background-repeat: no-repeat;
    background-size: cover;
    background-position: right center;
}
section.repeat.banner .inner {
    padding: 180px 0;
}
section.repeat.banner.banner1 {
    /* 공통배너1 - 신경과전문 */
    background-color: #f6f6f6;
    background-size: auto 100%;
    background-position: top left 20vw;
}
section.repeat.banner.banner1 .title-zone > * {
    width: 50%;
    text-align: right;
}

/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
    SUBPAGE : 00 DO두신경과
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
/* - - - - - 서브페이지 : 병원소개 (0-1) */
section.sub-doclinic {}
section.sub-doclinic.greeting .inner {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    grid-gap: 50px;
}
section.sub-doclinic.greeting .inner .txt {}
section.sub-doclinic.greeting .inner .txt span.op30 {
    font-size: 2.8em;
    font-weight: 700;
    font-family: var(--p);
}
section.sub-doclinic.greeting .inner .txt h5 {
    font-size: 2.35em;
    line-height: 1.3;
    margin: 1em 0;
}
section.sub-doclinic.greeting .inner .txt .p-wrap {
/*    font-size: 1.1em;*/
    line-height: 1.6;
}
section.sub-doclinic.greeting .inner .txt .p-wrap p + p { margin-top:2em }


section.sub-doclinic.greeting .inner .img {
    width: 40%;
}
section.sub-doclinic.greeting .inner .img h5 {
    text-align: center;
    font-size: 2em;
}
section.sub-doclinic.greeting .inner .img h5 span {
    color: var(--dark);
    font-weight: 500;
    font-size: 1.2rem;
    margin-right: 0.5em;
}
/* vision */
section.sub-doclinic.vision {}
section.sub-doclinic.vision .title {}
section.sub-doclinic.vision .title h4 {
    font-weight: 300;
}
section.sub-doclinic.vision .title h4 b {
    font-weight: 800;
    color: var(--primary);
}
section.sub-doclinic.vision .title h3 {
    font-size: 4em;
}
section.sub-doclinic.vision .title h2.bracket {
    font-size: 2.5em;
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 16em;
    margin: 0 auto;
}
section.sub-doclinic.vision .title h2.bracket::before,
section.sub-doclinic.vision .title h2.bracket::after {
    color: var(--primary);
    font-size: 1.5em;
    font-weight: 900;
}

section.sub-doclinic.vision .title h2.bracket::before {
    content: '[';
}
section.sub-doclinic.vision .title h2.bracket::after {
    content: ']';
}
section.sub-doclinic.vision .title p { font-size:1.1em; line-height:1.8 }

section.sub-doclinic.vision .unit.number-grid {}
section.sub-doclinic.vision .unit.number-grid > div {
    display: grid;
    grid-template-columns: 7em auto;
    justify-content: flex-start;
    align-items: center;
}
section.sub-doclinic.vision .unit.number-grid > div + div {
    border-top: 1px solid #e2e2e2;
}
section.sub-doclinic.vision .unit.number-grid > div p { font-family:var(--p); }
section.sub-doclinic.vision .unit.number-grid .before {
    color: #FFE1C4;
    font-size: 3em;
    font-weight: 700;
    text-align: center;
}
section.sub-doclinic.vision .unit.number-grid .before::before { content: '0';}

/* 뉴스 */
section.sub-doclinic.vision div.unit.news {}
section.sub-doclinic.vision div.unit.news > a {
    display: grid;
    grid-template-columns: 1fr 1.5fr;
    align-items: center;
    grid-gap: 60px;
    padding: 60px 0;
    transition: all ease 0.2s;
}
section.sub-doclinic.vision div.unit.news > a:hover {
    opacity: 0.7;
}

section.sub-doclinic.vision div.unit.news > a + a {
    border-top: 1px solid #ddd;
}

section.sub-doclinic.vision div.unit.news .thm {
    aspect-ratio: 3 / 2;
    border-radius: 50px;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}
section.sub-doclinic.vision div.unit.news h5 {
    font-family: var(--p);
}
section.sub-doclinic.vision div.unit.news p {
    color: #d8d0c6;
    font-weight: 600;
}


/* - - - - - 서브페이지 : 장비소개 (0-4 ~ ) */
section.sub-equip-links {}
section.sub-equip-links .flex {
    width: 50%;
    margin: 0 auto;
    display: flex;
    flex-direction: row;
    justify-content: center;
    flex-wrap: wrap;
    align-items: center;
    grid-gap: 1em;
}
section.sub-equip-links .flex a {
    border-radius: 3em;
    padding: 0.5em;
    width: 10em;
    text-align: center;
    border: 2px solid var(--primary);
}
section.sub-equip-links .flex a.current {
    background-color: #FEFFE6;
    font-weight: 700;
}

section.sub-equip {
    background-size: 100%;
    background-repeat: no-repeat;
    background-position: top center;
    padding: 32% 0 0;
}
section.sub-equip .equip-title-zone p.eng { font-size:1.8em }
section.sub-equip .equip-title-zone h3.txt-primary { font-size:3.8em; margin-bottom:0.4em }
section.sub-equip .equip-title-zone p.desc { font-size:1.1em }

section.sub-equip div.equip-grid {
    width: 90%;
    background-color: #fff;
    justify-content: flex-start;
    margin: 100px 0 0;
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-gap: 100px;
    align-items: center;
}
section.sub-equip div.equip-grid.reverse {
    margin: 100px 0 0 auto;
}
section.sub-equip div.equip-grid.reverse .txt { padding-left:5vw }


section.sub-equip div.equip-grid .img {
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    aspect-ratio: 1 / 1.17;
}
/* mri */
section.sub-equip.tcd div.equip-grid,
section.sub-equip.emg div.equip-grid,
section.sub-equip.aft div.equip-grid,
section.sub-equip.mri div.equip-grid { margin-top:30px }
section.sub-equip div.equip-grid .img.solo {
    background-size: 80%;
    background-position: right center;
}
section.sub-equip.psg div.equip-grid .img.solo {
    background-size: 90%;
    background-position: right -70% center;
}
/* aft */
section.sub-equip div.equip-grid.reverse {
    background-image: url('./img/symbol-op10.svg');
    background-size: 11%;
    background-repeat: no-repeat;
    background-position: left 0 top 60px;
}


section.sub-equip div.equip-grid .txt span.label {
    display: inline-block;
    border-radius: 3em;
    padding: 0.5em 1.5em;
    color: #fff;
    margin-bottom: 1em;
}
section.sub-equip article.vft-grid .txt h5.txt-primary,
section.sub-equip div.equip-grid .txt h5.name {
    line-height: 1.3;
    font-size: 2em;
    margin-bottom: 1em;
}
section.sub-equip div.equip-grid .txt h5.name i {
    font-size: 0.9em;
    font-weight: 400;
}

section.sub-equip div.equip-grid .txt > h6,
section.sub-equip article.vft-grid .txt > h6 {
    margin-top: 2.5em;
    font-weight: 700;
    opacity: 0.5;
    font-family: var(--p);
    margin-bottom: 0.5em;
}
section.sub-equip .txt > .p-wrap p {
    line-height: 1.7;
}
/* 넘버라벨 */
section.sub-equip div.equip-grid div.number-group {
    margin-top: 50px;
}
section.sub-equip div.equip-grid div.number-group p {
    display: grid;
    grid-template-columns: 2em auto;
    gap: 1em;
}
section.sub-equip div.equip-grid div.number-group p + p {
    margin-top: 0.5em;
}
section.sub-equip div.equip-grid div.number-group p .before {
    display: flex;
    justify-content: center;
    align-items: center;
    font-weight: 700;
    font-size: 1.2em;
    width: 1.8em;
    aspect-ratio: 1 / 1;
    border-radius: 50%;
    background-color: #FFFDEB;
    border: 2px solid var(--primary);
    transform: translateY(-0.15em);
}
/* cautionbox */
section.sub-equip div.equip-grid div.caution-box {
    border-radius: 2em;
    background-color: #FFFDEB;
    border: 2px solid var(--primary);
    padding: 1.5em 2em;
    margin-top: 50px;
    width: fit-content;

}




/* 장비 추가 주요사항 섹션 */
section.sub-equip .equip-caution {
    background-color: #FFF6ED;
    position: relative;
}
section.sub-equip .equip-caution .inner {
    padding: 80px 2em;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    grid-gap: 20px;
}
section.sub-equip .equip-caution .inner * {
    text-align: center;
}
section.sub-equip .equip-caution img.caution { width:80px }

/* 장비 추가 주요사항 섹션 - 심볼 튀어나오는 경우*/
section.sub-equip .equip-caution.upto {
    margin-top: 150px;
}
section.sub-equip .equip-caution.upto img.caution {
    position: absolute;
    top: 0;
    transform: translateY(-50%);
}

/* 장비 추가 주요사항 섹션 - 이미지 배너 */
section.sub-equip .equip-caution div.banner {
    aspect-ratio: 3 / 1;
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
}

/* 장비 추가 주요사항 섹션 - 캡슐이미지 */
section.sub-equip .equip-caution img.capsule {
    max-width: 800px;
}
/* Q. */
section.sub-equip .equip-caution h5.q {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    grid-gap: 0.5em;
    font-family: var(--p);
}
section.sub-equip .equip-caution h5.q::before {
    content: 'Q.';
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    width: 1.7em;
    aspect-ratio: 1 / 1;
    font-family: inherit;
    color: inherit;
    font-size: inherit;
    font-weight: inherit;
    background-color: #fff;
    border-radius: 50%;
    padding-left: 0.1em;
    box-shadow: 0 0 0.35em rgba(225, 128, 0, .74);
}

/* 장비 추가 주요사항 섹션 - 라벨그룹 */
section.sub-equip .equip-caution div.label-group {
    width: fit-content;
    margin: 0 auto 0;
}
section.sub-equip .equip-caution div.label-group p {
    padding: 1em 4em;
    background-color: #fff;
    border-radius: 3em;
    text-align: center;
    border: 2px solid #FFE1C4;
}
section.sub-equip .equip-caution div.label-group p + p {
    margin-top: 0.5em;
}

/* 전정기능검사 vft 슬라이드존 */
section.sub-equip.vft div.equip-slide {
    margin-top: 100px;
}
section.sub-equip.vft div.equip-slide .inner {
    padding: 100px 0;
}
section.sub-equip.vft div.equip-slide .swiper-container {
    position: relative;
}
section.sub-equip.vft div.equip-slide .vft-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    align-items: center;
    justify-content: center;
    grid-gap: 50px;
    width: 90%;
    margin: 0 auto ;
    background-color: #fff;
    padding: 100px 50px;
    border-radius: 50px;
    box-shadow: 0 3px 30px -5px rgba(0, 0, 0, .11);
}
section.sub-equip.vft div.equip-slide .vft-grid .img {
    display: flex;
    align-items: center;
    justify-content: center;
}
section.sub-equip.vft div.equip-slide .vft-grid .img img { max-width:100%; }
section.sub-equip.vft div.equip-slide .vft-grid .txt {

}
section.sub-equip.vft div.equip-slide .button-prev,
section.sub-equip.vft div.equip-slide .button-next {
    position: absolute;
    z-index: 9;
    top: 50%;
    transform: translateY(-50%);
    left: unset;
    right: unset;
}
section.sub-equip.vft div.equip-slide .button-prev { left:0 }
section.sub-equip.vft div.equip-slide .button-next { right:0 }





/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
    SUBPAGE 질환형 서브페이지 공통요소
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
section.sub .title-zone { margin-bottom: 30px }
section.sub .title-zone .subpage-title {
    font-size: 2.25em;
    line-height: 1.3;
}
section.sub .title-zone .subpage-title span.sub { font-size:0.8em }

section.sub .title-zone .uppercase {
    letter-spacing: 0.1em;
    color: #FFD1A3;
}
section.sub .title-zone .uppercase.txt-primary { color: var(--primary); }

section.sub .title-zone .p-wrap { margin-top:20px }

/* 질환형 서브페이지 배경색 있는 섹션 */
section.sub-disease.bgcolor {
    background-color: #FFF6ED;
}
/* 서브 인트로 */
section.sub-disease.intro {}
section.sub-disease.intro .inner {
    display: flex;
    flex-direction: row;
    grid-gap: 60px;
    align-items: center;
    justify-content: center;
}
section.sub-disease.intro .inner > img { width: 36%; }
section.sub-disease.intro .inner > .txt { width: 40%; }

/* 라벨그룹 */
section.sub-disease .unit.label-group {
    width: fit-content;
}
section.sub-disease .unit.label-group div {
    background-color: #FF8C19;
    border-radius: 4em;
    padding: 8px;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
    gap: 15px;
}
section.sub-disease .unit.label-group div + div { margin-top: 10px; }
section.sub-disease .unit.label-group div p {
    color: #fff;
    padding-right: 1.5em;
    font-family: var(--p);
    letter-spacing: -0.02em;
}
section.sub-disease .unit.label-group.plus div::before,
section.sub-disease .unit.label-group div span {
    background-color: #fff;
    border-radius: 3em;
    width: 2em;
    aspect-ratio: 1 / 1;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
}
section.sub-disease .unit.label-group.plus div::before {
    content: '';
    display: flex;
    font-size: 2em;
    width: 1em;
    height: 1em;
/*    color: #FF8C19;*/
/*    font-weight: 600;*/
    background-image: url('./img/label-group-plus.svg');
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
    background-color: transparent;
}
section.sub-disease .unit.label-group.text div span {
    width: 6em;
    text-align: center;
    aspect-ratio: unset;
    padding: 0.25em 1em;
    border: 3px solid #FFE1C4;
}

section.sub-disease + div.gap {
    height: 100px;
}
/* 시그니처 써클 섹션(1-1 뇌질환, 1-3 맞춤형전정재활 사용) */
section.sub-disease .signature-circle {
    display: flex;
    flex-direction: row;
    grid-gap: 80px;
    justify-content: center;
    align-items: flex-start;
    margin-bottom: -10%;
}
section.sub-disease .signature-circle .img {
    width: 40%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    transform: translateY(-40%);
}
section.sub-disease .signature-circle .img::after {
    content: 'DO SIGNATURE';
    color: var(--primary);
    opacity: 0.11;
    font-size: 3.5em;
    font-weight: 800;
    letter-spacing: 0.02em;
}


section.sub-disease .signature-circle .txt {}
section.sub-disease .signature-circle .txt p.uppercase {
    letter-spacing: 0.05em;
    color:var(--primary);
    font-family: 'Poppins';
}
section.sub-disease .signature-circle .txt p.uppercase b { font-weight:900 }

section.sub-disease .signature-circle .txt .subpage-title.circle {
    font-size: 1.8em;
    display: flex;
    flex-direction: row;
    align-items: center;
    grid-gap: 0.5em;
}
section.sub-disease .signature-circle .txt .subpage-title.circle::before {
    content: '';
    width: 1em;
    aspect-ratio: 1 / 1;
    display: inline-block;
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    background-image: url('./img/subpage-title-circle.svg');
}
section.sub-disease .signature-circle p {
    font-family: var(--p);
    line-height: 1.6;
}
/* 커서가 있는 버튼 */
section.sub-disease a.btn.white-radius {
    display: block;
    background-color: #fff;
    width: fit-content;
    margin: 0 auto;
    padding: 0.8em 4em 0.8em 2em;
    color: var(--primary);
    font-weight: 800;
    font-family: var(--p);
    text-align: center;
    border-radius: 3em;
    font-size: 1.5em;
    box-shadow: 0 3px 10px rgba(0, 0, 0, .1);
    transition: all ease 0.3s;
}
section.sub-disease a.btn.white-radius:hover {
    transform: translateY(3px);
    box-shadow: 0 0 10px rgba(255, 128, 0, .3);
}

section.sub-disease a.btn.white-radius.cursor {
    position: relative;
}
section.sub-disease a.btn.white-radius.cursor::after {
    content: '';
    position: absolute;
    right: -0.5em;
    top: 30%;
    display: block;
    width: 4em;
    height: 4em;
    background-image: url('./img/btn-cursor.png');
    background-repeat: no-repeat;
    background-position: left top;
    background-size: contain;
    transition: all ease 0.3s;
}
section.sub-disease a.btn.white-radius.cursor:hover::after {
    transform: translateY(-10px);
}



/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
    SUBPAGE : 01 DO시그니처클리닉
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
/* - - - - - 서브페이지 : 1-1 뇌질환 (sub01-.php) */
/* - - - - - 서브페이지 : 1-2 인지중재 (sub01-.php) */
section.sub-disease.metamemory {}
section.sub-disease.metamemory h3.subpage-title {
    font-size: 1.75em;
    font-weight: 500;
    line-height: 1.8;
    font-family: var(--p);
}
section.sub-disease.metamemory h3.subpage-title span {
    font-size: 1.1em;
    line-height: 1.3;
    font-family: inherit;
}
section.sub-disease.metamemory h3.subpage-title span b {
    font-weight: 800;
    font-family: inherit;
    font-size: inherit;
}
section.sub-disease.metamemory .unit.img p.dashed-box {
    background-color: #FFFEE9;
    border: 2px dashed var(--primary);
    padding: 1em 2em;
    font-weight: 700;
    text-align: center;
    font-size: 1.2em;
    border-radius: 5em;
    margin: -1em auto 0;
    position: relative;
    z-index: 1;
    width: 80%;
    font-family: var(--p);
}
section.sub-disease.metamemory .unit.meta-memory {}
section.sub-disease.metamemory .unit.meta-memory > div {
    display: grid;
    grid-template-columns: 280px 550px;
    align-items: center;
    justify-content: center;
    grid-gap: 50px;
}
section.sub-disease.metamemory .unit.meta-memory > div img {
    border-radius:1em; overflow:hidden;
}
section.sub-disease.metamemory .unit.meta-memory > div + div {
    margin-top: 30px;
}
section.sub-disease.metamemory .unit.meta-memory > div h5 {
    font-family: var(--p);
    font-weight: 700;
    margin-bottom: 0.5em;
    font-size: 1.15em;
}
section.sub-disease.metamemory .unit.meta-memory ul.dot li::before {
    font-weight: 800;
}

/* 기존 (인지중재 -> 전정재활) */
section.sub-disease.newtech {}
section.sub-disease.newtech .title-zone {
    grid-gap: 0;
    margin-bottom: 0;
}
section.sub-disease.newtech .title-zone p {
    font-size: 2em;
}
section.sub-disease.newtech .title-zone h3 {
    font-size: 3em;
    line-height: 1.3;
}
section.sub-disease.newtech .dashed-box {
    background-color: #fff;
    padding: 50px;
    border-radius: 50px;
    border: 2px dashed var(--primary);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    grid-gap: 30px;
}
section.sub-disease.newtech .dashed-box p {
    line-height: 1.7;
    font-family: var(--p);
}
/* ONE-STOP 기존 홈페이지 효과 섹션 */
section.sub-disease.onestop {}
section.sub-disease.onestop .grid.half {
    align-items: center;
}
section.sub-disease.onestop .grid.half .img {
    aspect-ratio: 1 / 1;
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    background-image: url('./img/sub-onestop-bg.jpg');
}
section.sub-disease.onestop .grid.half .txt {
    position: relative;
    width: 100%;
    height: 100%;
    overflow: hidden;
}
section.sub-disease.onestop .grid.half .txt > div {
    position: absolute;
    width: inherit;
    height: inherit;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    padding-top: 30%;
    padding-right: 50px;
}
section.sub-disease.onestop .grid.half .txt > div img.icon {
    width: 130px;
    margin-bottom: 50px;
    transform: translateX(-10%);
}
section.sub-disease.onestop .grid.half .txt > div p.uppercase { font-size:1.2em }
section.sub-disease.onestop .grid.half .txt > div h5 { font-size:2em; font-family:var(--p); line-height:1.3; margin-top:10px }
section.sub-disease.onestop .grid.half .txt > div img.dot { margin: 40px auto;}
section.sub-disease.onestop .grid.half .txt > div .p-wrap p {
    font-size: 0.9em;
    text-align: center;
}


section.sub-disease.onestop .grid.half .txt > div.default {}
section.sub-disease.onestop .grid.half .txt > div.cover {
    background-color: var(--secondary);
    z-index: 1;
    left: 0;
    transform: translateX(-100%);
    transition: all ease 0.7s;
}
section.sub-disease.onestop .grid.half .txt:hover > div.cover {
    transform: translateX(0);
}
section.sub-disease.onestop .grid.half .txt > div.cover * {
    color: #fff;
}

section.sub-disease.onestop .grid.half .txt > div.cover > * {
    transform: translateX(-20%);
    opacity: 0;
    transition: all ease 0.6s;
}
section.sub-disease.onestop .grid.half .txt:hover > div.cover > *{
    transform: translateX(0);
    opacity: 1;
}
section.sub-disease.onestop .grid.half .txt > div.cover img.icon { transition-delay:0 }
section.sub-disease.onestop .grid.half .txt > div.cover p.uppercase { transition-delay:0.3s }
section.sub-disease.onestop .grid.half .txt > div.cover h5 { transition-delay:0.3s }
section.sub-disease.onestop .grid.half .txt > div.cover img.dot { transition-delay:0.6s }
section.sub-disease.onestop .grid.half .txt > div.cover .p-wrap { transition-delay:0.6s }



/* - - - - - 서브페이지 : 1-3 맞춤형 전정재활 (sub01-.php) */
section.sub-disease .title-zone .caution-label {
    position: relative;
    width: fit-content;
    margin: 50px auto 0;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    background-color: #FFF6ED;
    border-radius: 5em;
    padding: 2.5em 4em 2em;
}
section.sub-disease .title-zone .caution-label::before {
    content: '';
    display: block;
    width: 3em;
    aspect-ratio: 1 / 1;
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
    background-image: url(./img/caution-circle.svg);
/*    transform: translateY(-50%);*/
    position: absolute;
    left: 50%;
    top: 0;
    transform: translate(-50%, -50%);
}
section.sub-disease .title-zone .caution-label p {
    font-weight: 600;
    font-size: 1.1em;
}
/* 전정재활프로그램 */
section.sub-disease .unit.rehab-step {}
section.sub-disease .unit.rehab-step > div {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-gap: 80px;
    align-items: center;
}
section.sub-disease .unit.rehab-step > div .txt h6 {
    color: #fff;
    font-family: var(--p);
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
    grid-gap: 0.5em;
    padding: 6px;
    border-radius: 3em;
    width: 50%;
    margin-bottom: 1em;
}
section.sub-disease .unit.rehab-step > div .txt h6 span {
    display: flex;
    width: 1.8em;
    align-items: center;
    justify-content: center;
    aspect-ratio: 1 / 1;
    border-radius: 50%;
    background-color: #fff;
    font-weight: 800;
}
section.sub-disease .unit.rehab-step > div .txt h6.bg-primary span { color:var(--primary); }
section.sub-disease .unit.rehab-step > div .txt h6.bg-secondary span { color:var(--secondary); }
section.sub-disease .unit.rehab-step > div + div {
    margin-top: 80px;
}


/* - - - - - 서브페이지 : 1-4 양압기 (sub01-.php) */
section.sub-disease div.unit.wide-photo {
    display: grid;
    grid-template-columns: 44vw auto;
    align-items: center;
}
section.sub-disease div.unit.wide-photo .img {
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    height: 100%;
}

section.sub-disease div.unit.wide-photo .txt {
    padding: 80px 100px;
    display: flex;
    flex-direction: column;
    grid-gap: 30px;
}
section.sub-disease div.unit.wide-photo .txt * { font-family:var(--p); }
section.sub-disease div.unit.wide-photo .txt .label-text {
    margin-bottom: 15px;
}
section.sub-disease div.unit.wide-photo .txt .label-text > div {
    display: grid;
    grid-template-columns: 10em auto;
    grid-gap: 1em;
    align-items: center;
}
section.sub-disease div.unit.wide-photo .txt .label-text > div + div {
    margin-top: 1em;
}
section.sub-disease div.unit.wide-photo .txt .label-text > div h5.label {
    background-color: #FF8C19;
    color: #fff;
    font-size: 1.1em;
    border-radius: 3em;
    padding: 0.5em;
    text-align: center;
    line-height: 1.3;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 600;
}


/* - - - - - 서브페이지 : 1-5 경두개자기자극기 (sub01-.php) */
section.sub-banner {
    /*  꽉차는 이미지 섹션. 비율은 페이지마다 다름.. */
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    aspect-ratio: 4 / 1;
}
section.sub-disease .unit.img-dashbox {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}
section.sub-disease .unit.img-dashbox > img {}
section.sub-disease .unit.img-dashbox > .dashed-box {
    width: 80%;
    background-color: #FFFAF5;
    padding: 50px;
    border-radius: 50px;
    border: 2px dashed var(--primary);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    grid-gap: 30px;
}
section.sub-disease .unit.img-dashbox > .dashed-box p {
    text-align: center;
    line-height: 1.7;
    font-family: var(--p);
}
section.sub-disease.upto .inner {
    /*  섹션 inner 여백조절 */
    padding: 100px 0;
}
section.sub-disease .unit.good-bad {
    display: flex;
    flex-direction: row;
    align-items: stretch;
    justify-content: center;
    grid-gap: 60px;
}
section.sub-disease .unit.good-bad > div {
    position: relative;
    width: 25%;
    padding: 50px;
    display: flex;
    flex-direction: column;
    align-items: center;
    grid-gap: 30px;
    justify-content: center;
    border-radius: 40px;
    border: 3px solid var(--primary);
}
section.sub-disease .unit.good-bad > div h6 {
    background-color: var(--primary);
    color: #fff;
    position: absolute;
    width: 50%;
    text-align: center;
    border-radius: 3em;
    font-size: 1.5em;
    top: 0;
    left: 50%;
    transform: translate(-50%, -50%);
}

section.sub-disease.sub1-5 .unit.good-bad {
    margin-bottom: 80px;
}
section.sub-disease .title-zone img.caution { width:80px }




/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
    SUBPAGE : 02 어지럼클리닉
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
/* - - - - - 서브페이지 : 2-1 말초성 어지럼 (sub01-.php) */
section.sub-disease .unit.brick-group.numbering {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    grid-gap: 20px;
}
section.sub-disease .unit.brick-group.numbering > div {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    width: 230px;
    aspect-ratio: 1 / 1;
    background-color: var(--secondary);
    border-radius: 30px;
    padding: 30px;
}
section.sub-disease .unit.brick-group.numbering .before {
    display: block;
    width: 100%;
    text-align: center;
    font-weight: 500;
    padding: 1em;
    margin-bottom: 1.5em;
    color: rgba(255, 255, 255, .5);
    border-bottom: 1px solid rgba(255, 255, 255, .5);
}
section.sub-disease .unit.brick-group.numbering .before::before { content:'0' }
section.sub-disease .unit.brick-group.numbering > div p {
    color: #fff;
    text-align: center;
    line-height: 1.3;
    font-size: 1.3em;
    padding: 0 1em;
    font-weight: 600;
}
/* 예방법 */
section.sub-disease.prevent div.inner {
    display: flex;
    flex-direction: row;
    align-items: flex-end;
    justify-content: flex-start;
    grid-gap: 80px;
}
section.sub-disease.prevent div.inner > img { width:50% }

section.sub-disease.prevent div.unit.label-text.numbering {
    margin-bottom: 60px;
}
section.sub-disease.prevent div.unit.label-text.numbering > div {
    display: grid;
    grid-template-columns: 3em auto;
    grid-gap: 1em;
    align-items: center;
}
section.sub-disease.prevent div.unit.label-text.numbering > div + div {
    margin-top: 1em;
}
section.sub-disease.prevent div.unit.label-text.numbering > div .before {
    background-color: #FF8C19;
    color: #fff;
    font-size: 1.0em;
    border-radius: 3em;
    padding: 0.25em;
    text-align: center;
    line-height: 1.3;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 600;
}
section.sub-disease.prevent div.unit.label-text.numbering > div .before::before { content:'0' }


/* - - - - - 서브페이지 : 2-2 중추성 어지럼 (sub02-.php) */
section.sub-disease .unit.img-text {}
section.sub-disease .unit.img-text > div {
    display: flex;
    flex-direction: row;
    grid-gap: 80px;
    justify-content: flex-start;
    align-items: center;
}
section.sub-disease .unit.img-text > div + div { margin-top:50px }
section.sub-disease .unit.img-text h6.bg-secondary {
    padding: 0.2em 1em;
    border-radius: 3em;
    width: 6em;
    text-align: center;
    margin-bottom: 1em;
}

section.sub-disease.upto.caution { position:relative; }
section.sub-disease.upto.caution::before {
    content: '';
    display: block;
    width: 80px;
    aspect-ratio: 1 / 1;
    background-image: url('./img/caution-circle.svg');
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    position: absolute;
    top: 0;
    left: 50%;
    transform: translate(-50%, -50%);
}

/* - - - - - 서브페이지 : 2-3 자율신경이상 어지럼 (sub02-.php) */
section.sub-disease.sub2-3 .unit.txt-center { width:40% }
section.sub-disease.sub2-3 .unit.label-group.numbering { width:30% }

/* - - - - - 서브페이지 : 2-4 심인성 어지럼 (sub02-.php) */


/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
    SUBPAGE : 03 두통클리닉
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
/* 두통클리닉 상단 공통 섹션 */
section.repeat-headache {}
section.repeat-headache .inner { padding-bottom:0 }
section.repeat-headache h3.sign {
    aspect-ratio: 1 / 1;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 2.5em;
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
    background-image: url(./img/sub-headache-sign.svg);
    background-color: #FFAB57;
    width: 3.5em;
    color: #222;
    margin: 0 auto;
    border-radius: 50%;
    box-shadow: 0 0 40px rgba(255, 128, 0, .2);
    animation: neonsign 1s linear infinite alternate;
}
@keyframes neonsign {
    from { box-shadow: 0 0 40px rgba(255, 128, 0, .2); }
    to { box-shadow: 0 0 20px rgba(255, 128, 0, 1); }
}
section.repeat-headache h4.txt-primary {
    font-size: 1.5em;
    margin-top: 2em;
    text-decoration: underline;
    text-underline-offset: 0.3em;
}
section.repeat-headache img.dot {
    display: block;
    margin: 2em auto;
}




/* - - - - - 서브페이지 : 3-1 편두통 (sub01-.php) */
section.sub-disease.sub3-1 .unit.label-group.plus { width:30% }
/* 두통 치료방법 - 일반 */
section.sub-disease .unit.headache-care {
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    justify-content: center;
    grid-gap: 50px;
}
section.sub-disease .unit.headache-care > div {
    position:relative;
    text-align: center;
}
section.sub-disease .unit.headache-care img {
    max-width:20em;
    border-radius: 40px;
}
section.sub-disease .unit.headache-care h6 {
    margin: 1em auto 0.6em;
}
section.sub-disease .unit.headache-care h6 + p {
    padding: 0 2em;
}
section.sub-disease .unit.headache-care.numbering .before {
    position: absolute;
    left: 50%;
    top: 0;
    transform: translate(-50%, -50%);
    display: flex;
    width: 2em;
    aspect-ratio: 1 / 1;
    border-radius: 50%;
    background-color: #fff;
    border: 3px solid var(--primary);
    align-items: center;
    justify-content: center;
    font-weight: 700;
    font-size: 1.2em;
    line-height: 0;
    text-align: center;
}


/* 두통 치료방법 - mayo */
section.sub-disease .unit.headache-care.mayo img { border-radius:0 }
section.sub-disease .unit.headache-care.mayo > div::after {
    content: 'Headache Clinic';
    display: block;
    border-radius: 3em;
    padding: 1em;
    text-align: center;
    width: 80%;
    margin: 1.5em auto 0;
    background-color: #C7B39B;
    color: rgba(255, 255, 255, .65);
    font-weight: 600;
}





/* - - - - - 서브페이지 : 3-2 군발성 두통 (sub02-.php) */
/* - - - - - 서브페이지 : 3-3 긴장성 두통 (sub02-.php) */
/* - - - - - 서브페이지 : 3-4 만성 두통 (sub02-.php) */
/* - - - - - 서브페이지 : 3-5 경추성 두통 (sub02-.php) */
section.sub-disease .unit.why {
    display: flex;
    flex-direction: row;
    align-items: flex-end;
    justify-content: center;
    grid-gap: 80px;
}
section.sub-disease .unit.why > img {
    width: 30%;
}

section.sub-disease .unit.why .txt {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    grid-gap: 1.5em;
    padding-bottom: 1em;
}
section.sub-disease .unit.why .txt h5 { line-height:1.0; font-size:1.6em }
section.sub-disease .unit.why .txt > img { width:6em }



/* - - - - - 서브페이지 : 3-6 약물과용 두통 (sub02-.php) */
section.sub-disease .unit.medicine-type {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    grid-gap:35px;
}
section.sub-disease .unit.medicine-type > div {
    width: 15em;
    background-color: #FFF7EF;
    border-radius: 30px;
    padding: 30px;
    display: flex;
    flex-direction: column;
    align-content: center;
    justify-content: center;
    grid-gap: 20px;
    box-shadow: 0 0 15px #FFE1C4;
}
section.sub-disease .unit.medicine-type > div h5 {
    width: 80%;
    margin: 0 auto;
    text-align: center;
    background-color: var(--primary);
    color: #fff;
    font-size: 1.1em;
    border-radius: 3em;
}
section.sub-disease .unit.medicine-type > div p {
    text-align: center;
    font-size: 1.1em;
}



/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
    SUBPAGE : 04 수면클리닉
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
/* 수면클리닉 하단 공통 섹션 */
section.sub.repeat-sleep {}
section.sub.repeat-sleep .unit.sleep-zigzag {
    width: 95%;
    display: grid;
    grid-template-columns: 1fr 1fr;
    align-items: center;
    justify-content: center;
}
section.sub.repeat-sleep .unit.sleep-zigzag .txt {
    padding-left: 80px;

}
section.sub.repeat-sleep .unit.sleep-zigzag ul.dot-neon {
    margin-top: 2em;
}
section.sub.repeat-sleep .unit.sleep-zigzag ul.dot-neon li {
    display: grid;
    grid-template-columns: 2.5em auto;
    align-items: center;
}
section.sub.repeat-sleep .unit.sleep-zigzag ul.dot-neon li + li {
    margin-top: 0.25em;
}
section.sub.repeat-sleep .unit.sleep-zigzag ul.dot-neon li::before {
    content: '';
    display: block;
    width: 2em;
    aspect-ratio: 1 / 1;
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    background-image: url('./img/dot-neon.png');
}
section.sub.repeat-sleep.bg-primary {
    margin-bottom: 150px;
}
section.sub.repeat-sleep.bg-primary .inner {
    align-items: center;
    justify-content: center;
    padding: 0;
    background-image: url(./img/symbol-fff-op25.svg);
    background-repeat: no-repeat;
    background-size: 18%;
    background-position: right 40% bottom 50px;
    grid-gap: 200px;
}
section.sub.repeat-sleep.bg-primary .inner > img { width:30% }
section.sub.repeat-sleep.bg-primary ul.check-white {}
section.sub.repeat-sleep.bg-primary ul.check-white li {
    display: grid;
    grid-template-columns: 2em auto;
    align-items: center;
}
section.sub.repeat-sleep.bg-primary ul.check-white li p {
    font-size: 1.1em;
    font-weight: 500;
    color:#fff
}

section.sub.repeat-sleep.bg-primary ul.check-white li + li {
    margin-top: 0.6em;
}
section.sub.repeat-sleep.bg-primary ul.check-white li::before {
    content: '';
    display: block;
    width: 1.1em;
    aspect-ratio: 1 / 1;
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
    background-image: url('./img/check-white.svg');
}

/* - - - - - 서브페이지 : 4-1 수면무호흡/코골이 (sub04-.php) */
section.sub-disease.sub4-1 {}
section.sub-disease.sub4-1 .unit.normal-abnormal {
    display: flex;
    flex-direction: row;
    justify-content: center;
    grid-gap: 30px;
    align-items: flex-start;
}
section.sub-disease.sub4-1 .unit.normal-abnormal h5.label {
    font-size: 1.2em;
    margin: 0 auto 2em;
    border-radius: 3em;
    padding: 0.5em;
    width: 15em;
    background-color: #EEE9E3;
}
section.sub-disease.sub4-1 .unit.normal-abnormal h5.label.txt-white { background-color:#FF8C19; }
section.sub-disease.sub4-1 .unit.normal-abnormal > div { text-align: center; }
section.sub-disease.sub4-1 .unit.normal-abnormal img { width: 95% }

section.sub-disease.sub4-1 .unit.step-four {
    display: flex;
    flex-direction: row;
    align-items: stretch;
    justify-content: center;
    grid-gap: 50px;
}
section.sub-disease.sub4-1 .unit.step-four > div {
    border-radius: 5em;
    padding: 1em;
    background-color: #F6F6F6;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    width: 12em;
    position: relative;
}
section.sub-disease.sub4-1 .unit.step-four > div::after {
    content: '';
    display: block;
    border-radius: 50%;
    aspect-ratio: 1 / 1;
    background-color: #E5DCD1;
    background-image: url('./img/step-arrow.svg');
    background-repeat: no-repeat;
    background-position: center;
    background-size: 33%;
    width: 2em;
    position: absolute;
    right: 0;
    top: 50%;
    transform: translate(50%, -50%);
 }
section.sub-disease.sub4-1 .unit.step-four > div p {
    font-weight: 600;
    line-height: 1.3;
    font-size: 1.1em;
}
section.sub-disease.sub4-1 .unit.step-four > div:last-child {
    background-color: var(--primary);
}
section.sub-disease.sub4-1 .unit.step-four > div:last-child p {
    color: #fff;
}
section.sub-disease.sub4-1 .unit.step-four > div:last-child::after { display:none; }

section.sub-disease.sub4-1 .p-wrap.op60 { font-size:0.9em }
section.sub-disease.sub4-1 .p-wrap.bigger {
    margin-top:3em;
    font-size: 1.2em;
}
section.sub-disease.sub4-1 .p-wrap.bigger p .highlight {
    font-weight: 700;
    color: var(--primary);
    background-color: #FFFFA8;
    font-family: var(--p);
}


/* - - - - - 서브페이지 : 4-2 불면증 (sub04-.php) */
/* 약물과용두통 override */
section.sub-disease .unit.medicine-type.sub4-2 {
    align-items: stretch;
}
section.sub-disease .unit.medicine-type.sub4-2 > div {
    height: 100%;
    width: 22em;
    background-color: #FFF7EF;
    border-radius: 30px;
    padding: 30px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    grid-gap: 20px;
    box-shadow: 0 0 15px #FFE1C4;
}
section.sub-disease .unit.medicine-type.sub4-2 > div h5 { padding: 0.2em; }
section.sub-disease .unit.medicine-type.sub4-2 > div p { font-size: 1.0em; }
section.sub-disease .unit.brick-group.numbering.sub4-2 > div { padding:15px 30px 30px }

section.sub-disease .unit.result-grid {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    grid-gap: 20px;
}
section.sub-disease .unit.result-grid > div {
    width: 20em;
    padding: 2em;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}
section.sub-disease .unit.result-grid > div h5 { font-family:var(--p); font-size:1.8em }



/* - - - - - 서브페이지 : 4-3 기면증/과다수면 (sub04-.php) */
section.sub-disease.sub4-3 .subpage-title,
section.sub-disease.sub4-3 .subpage-title span.sub { line-height:1.1 }
section.sub-disease .unit.oversleep-grid {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-around;
}
section.sub-disease .unit.oversleep-grid > img { width:45% }
section.sub-disease .unit.oversleep-grid .txt {
    display: grid;
    grid-template-columns: 1fr;
    grid-gap: 2em;
}
section.sub-disease .unit.oversleep-grid .txt h5 { font-size:1.3em; margin-bottom:0.2em }
section.sub-disease .unit.oversleep-grid .txt h5 span { margin-right:0.5em }
section.sub-disease .unit.oversleep-grid .txt p { line-height:1.7 }
/* 검사 방법 */
section.sub-disease .medicine-type.sub4-3 {
    grid-gap: 50px;
}
section.sub-disease .medicine-type.sub4-3 > div {
    position: relative;
    width: 20em;
}
section.sub-disease .medicine-type.sub4-3 > div img {
    height: 6em;
    display: block;
    margin: 0 auto;
}
section.sub-disease .medicine-type.sub4-3 > div img + p { font-weight:600 }


/* 검사스케쥴 */
section.sub-disease .schedule-wrap {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    grid-gap: 90px;
}
section.sub-disease .schedule-wrap .before::before { content:'0'; }
section.sub-disease .schedule-wrap .before {
    position: absolute;
    left: 50%;
    top: 0;
    transform: translate(-50%, -50%);
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    width: 1.8em;
    aspect-ratio: 1 / 1;
    border-radius: 50%;
    background-color: #AEA191;
    font-size: 1.3em;
    font-weight: 700;
    color: #fff;
    font-family: var(--p);
}
section.sub-disease .schedule-wrap > div {
    display: flex;
    position: relative;
    background-color: #fff;
    border: 2px solid var(--primary);
    box-shadow: 0 0 15px #FFE1C4;
    padding: 7em 15px 15px;
    justify-content: center;
    align-content: center;
    border-radius: 40px;
    width: 11em;
    aspect-ratio: 1 / 1.1;
    background-repeat: no-repeat;
    background-position: top 2.5em center;
    background-size: auto 4em;
    background-image: url('./img/sub4-3-schedule-icon.svg');
}
section.sub-disease .medicine-type.sub4-3 > div::after,
section.sub-disease .schedule-wrap > div::after {
    content: '';
    display: block;
    border-radius: 50%;
    aspect-ratio: 1 / 1;
    background-color: #E5DCD1;
    background-image: url('./img/step-arrow.svg');
    background-repeat: no-repeat;
    background-position: center;
    background-size: 33%;
    width: 2.5em;
    position: absolute;
    right: 0;
    top: 50%;
    transform: translate(50%, -50%);
}
section.sub-disease .medicine-type.sub4-3 > div:last-child::after,
section.sub-disease .schedule-wrap > div:last-child::after { display:none; }
section.sub-disease .schedule-wrap > div + div::before {
    content: '2시간 휴식';
    color: var(--primary);
    font-size: 0.9em;
    line-height: 1.0;
    text-align: center;
    font-weight: 600;
    display: flex;
    position: absolute;
    width: 3em;
    left: 0;
    top: 50%;
    transform: translate(-140%,-50%);
}
section.sub-disease .schedule-wrap > div p {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-content: center;
    line-height: 1.0;
    grid-gap: 0.2em;
}
section.sub-disease .schedule-wrap > div p strong {
    font-size: 1.6em;
    font-family: var(--p);
}



/* - - - - - 서브페이지 : 4-4 주간졸림증 (sub04-.php) */
section.sub-disease .unit.box.sub4-4 {
    padding: 2em;
    margin-top: 4em;
}
section.sub-disease .unit.box.sub4-4 .p-wrap {
    width: 60%;
    grid-gap: 0.5em;
    margin: 0 auto 1.5em;
}
section.sub-disease .unit.box.sub4-4 .p-wrap p + p { margin-top:0 }



/* - - - - - 서브페이지 : 4-5 하지불안증후군 (sub04-.php) */
section.sub-disease .unit.circle-vs {
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    justify-content: center;
    grid-gap: 30px;
}
section.sub-disease .unit.circle-vs > div {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}
section.sub-disease .unit.circle-vs > div img {  }
section.sub-disease .unit.circle-vs > div h5 {
    width: 90%;
    text-align: center;
    color: #fff;
    border-radius: 20px;
    padding: 0.5em;
    margin-bottom: 15px;
}
section.sub-disease .unit.circle-vs > div ul {
    width: 90%;
    border: 2px solid;
    border-radius: 20px;
    padding: 40px 20px;
}


/* - - - - - 서브페이지 : 4-6 렘수면행동장애 (sub04-.php) */
section.sub-disease.intro.sub4-6 .inner { grid-gap:100px }
section.sub-disease.intro.sub4-6 .inner > img { width:36% }
section.sub-disease .unit.rbd-test {
    display: flex;
    flex-direction: row;
    align-items: stretch;
    justify-content: center;
    grid-gap: 50px;
}
section.sub-disease .unit.rbd-test > div {
    width: 21em;
    background-color: #fff;
    border-radius: 40px;
    border: 2px solid var(--primary);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    position: relative;
    padding: 40px 0;
    grid-gap: 1.5em;
}
section.sub-disease .unit.rbd-test > div h5 {
    background-color: var(--primary);
    width: 70%;
    margin: 0 auto;
    border-radius: 3em;
    font-weight: 700;
    color: #fff;
    text-align: center;
    position: absolute;
    top: 0;
    left: 50%;
    transform: translate(-50%, -50%);
}
section.sub-disease .unit.rbd-test > div .p-wrap {
    width: inherit;
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}
section.sub-disease .unit.rbd-test > div .p-wrap p {
    padding: 0 1.5em 0;
}




/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
    SUBPAGE : 05 치매클리닉
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
/* 치매클리닉 상단 공통 */
section.repeat-dementia-intro {}
section.repeat-dementia-intro .title-zone h3.subpage-title { font-size: 3em; }
section.repeat-dementia-intro .title-zone p { font-size: 1.2em; }
section.repeat-dementia-intro .dementia-wave {
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    justify-content: center;
    grid-gap: 0;
    margin: 100px auto 100px;
}
section.repeat-dementia-intro .dementia-wave > img:nth-child(1) { transform:translateY(0); }
section.repeat-dementia-intro .dementia-wave > img:nth-child(2) { transform:translateY(20%); }
section.repeat-dementia-intro .dementia-wave > img:nth-child(3) { transform:translateY(-20%); }
section.repeat-dementia-intro .dementia-wave > img:nth-child(4) { transform:translateY(0); }


/* - - - - - 서브페이지 : 5-1 알츠하이머 (sub05-.php) */
section.sub-disease .unit.step-table {
    width: fit-content;
}
section.sub-disease .unit.step-table > div {
    display: grid;
    grid-template-columns: 1fr 2fr;
    align-items: center;
    grid-gap: 0 5px;
}
section.sub-disease .unit.step-table > div * { text-align:center; font-weight:500; font-family:var(--p); }
section.sub-disease .unit.step-table > div > div { border-bottom:1px solid var(--primary); padding:0.5em; font-size: 1.1em }
section.sub-disease .unit.step-table > div:first-child > div { border-top:2px solid var(--primary); }
section.sub-disease .unit.step-table .th { background-color:#FEF8F4; font-weight:700 }
section.sub-disease .unit.step-table .td { padding:0.5em 4em }


/* - - - - - 서브페이지 : 5-2 혈관성 치매 (sub05-.php) */
section.sub-disease .unit.type-vs {
    display: flex;
    flex-direction: row;
    align-content: center;
    justify-content: center;
    grid-gap: 3em;
}
section.sub-disease .unit.type-vs > div {
    width: 350px;
    padding: 0 1em 2em;
    position:relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    border-radius: 2em;
    background-color: #FFFBF6;
    box-shadow: 0 0 15px rgba(255, 128, 0, .2);
}
section.sub-disease .unit.type-vs > div h5 {
    background-color: var(--primary);
    color: #fff;
    text-align: center;
    border-radius: 3em;
    width: 80%;
    transform: translateY(-50%);
    font-size: 1.2em;
    padding: 0.2em;
}
section.sub-disease .unit.type-vs > div p {
    font-weight: 700;
    font-size: 1.1em;
    line-height: 1.3;
    margin-top: 1em;
}
section.sub-disease .unit.type-vs > div img {
    width: 50%;
}
section.sub-disease .unit.type-vs > div p span {
    display: block;
    font-weight: inherit;
}
section.sub-disease .unit.dementia-differ {
    display: flex;
    flex-direction: row;
    align-content: center;
    justify-content: center;
    grid-gap: 50px;
}
section.sub-disease .unit.dementia-differ > div {
    width: 450px;
    display: grid;
    grid-template-columns: 1fr;
}
section.sub-disease .unit.dementia-differ > div .img {
    aspect-ratio: 3 / 2;
    background-repeat: no-repeat;
    background-position: top center;
}
section.sub-disease .unit.dementia-differ > div h5 {
    text-align: center;
    color: #fff;
    background-color: #C7B39B;
    padding: 0.5em;
}
section.sub-disease .unit.dementia-differ > div + div h5 { background-color: var(--primary);}

section.sub-disease .unit.dementia-differ div.note > div {
    border-bottom: 1px solid var(--primary);
    padding: 1em;
    background-color: #FEF8F4;
}




/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
    SUBPAGE : 06 통증클리닉
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
section.sub-header .sub-header-img.pain {
    background-size: cover;
    background-position: top center;
}
/* 통증클리닉 상단 공통 */
section.sub.repeat-pain-intro {}
section.sub.repeat-pain-intro img { width:4.5em; margin-bottom:1em }
section.sub.repeat-pain-intro h4 { line-height:1.3 }
section.sub.repeat-pain-intro h4 span {
    display:block;
    margin:1em auto 0;
    text-align: inherit;
}
/* 통증클리닉 하단 공통 */
section.sub-disease .medicine-type.sub4-3.pain > div::after { display:none; }
section.sub-disease .unit.pain-carm {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    grid-gap: 100px;
}
section.sub-disease .unit.pain-carm .txt {}
section.sub-disease .unit.pain-carm .txt h5 {
    position: relative;
    width: fit-content;
    font-size: 3em;
}
section.sub-disease .unit.pain-carm .txt h5::before {
    content: '';
    position: absolute;
    right: -0.5em;
    top: 0;
    border-radius: 50%;
    display: block;
    aspect-ratio: 1 / 1;
    width: 1em;
    background-color: #FDFFC4;
    z-index: -1;
}
section.sub-disease .unit.pain-carm .txt img.dot {
    display: block;
    margin: 2em 0;
}
section.sub-disease .unit.pain-carm .txt .unit.label-group.sun {
    margin: 0;
}
section.sub-disease .unit.pain-carm .txt .unit.label-group.sun > div::before {
    background-image: url(./img/carm-dot.svg);
}

section.sub-disease .unit.medicine-type.pain > div {
    padding: 2em 2em 1.5em;
}
section.sub-disease .unit.medicine-type.pain > div h5 {
    font-size: 1.2em;
    width: 70%;
    padding: 0.3em;
    position: absolute;
    top: 0;
    left: 50%;
    transform: translate(-50%, -50%);
}
section.sub-disease .unit.medicine-type.pain > div p {
    font-weight: 400;
}


/* - - - - - 서브페이지 : 6-1 목/어깨 (sub06-.php) */
section.sub-disease .unit.type-circle {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    grid-gap: 10px;
}
section.sub-disease .unit.type-circle > div {
    display: flex;
    aspect-ratio: 1 / 1;
    width: 11em;
    border-radius: 50%;
    justify-content: center;
    align-items: center;
    background-size: contain;
    background-position: center;
    background-image: url(./img/type-circle-bg.png);
}
section.sub-disease .unit.type-circle > div p {
    font-weight: 700;
    font-size: 1.1em;
    color: #444;
    text-align: center;
    line-height: 1.4;
}


/* - - - - - 서브페이지 : 6-2 팔꿈치/손목(sub06-.php) */
/* - - - - - 서브페이지 : 6-3 허리 (sub06-.php) */
/* - - - - - 서브페이지 : 6-4 골반 (sub06-.php) */
/* - - - - - 서브페이지 : 6-5 무릎/발 (sub06-.php) */
/* - - - - - 서브페이지 : 6-6 대상포진 (sub06-.php) */
section.sub-disease .unit.table-wrap {}
section.sub-disease .unit.table-wrap table {
    width: fit-contentt;
    margin: 0 auto;
    border-collapse: separate;
    border-spacing: 8px;
}
section.sub-disease .unit.table-wrap table tr > * {
    box-shadow: 2px 2px 6px rgba(0, 0, 0, .08);
}

section.sub-disease .unit.table-wrap table th {
    font-weight: 700;
    text-align: center;
    padding: 0.5em 3em;
    font-size: 1.4em;
}
section.sub-disease .unit.table-wrap table td {
    background-color: #fff;
    padding: 1em 4em 1em 1em;
    font-size: 1.1em;
}






