/*
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;*/
}


/* 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: #fff;
    border-bottom:1px solid #ddd
}
header.header .gnb-floor > .inner,
header.header .sub-floor > .inner {
    width: 100%;
/*    max-width: 1700px;*/
    max-width: var(--inner);
    display: grid;
    grid-template-columns: 270px auto;
    align-items: center;
    justify-content: space-between;
/*    justify-content: flex-start;*/
    border-bottom:1px solid rgba(255, 255, 255, 0);
    transition: all ease 0.3s;
    grid-gap: 0 20px;
}
header.header .gnb-floor > .inner a.logo {
    display: block;
    width: 100%;
    aspect-ratio: 3 / 1;
    background-repeat: no-repeat;
    background-size: contain;
    background-position: left center;
    background-image: url('./img/logo-header.svg');
}


header.header .sub-floor ul.menu,
header.header .gnb-floor nav.gnb ul.menu {
    width: 100%;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    gap: 0;
}

header.header .gnb-floor nav.gnb ul.menu > li {
/*    border: 1px dashed lime;*/
    position: relative;
}

header.header .gnb-floor nav.gnb ul.menu > li a {
    display: block;
    width: 100%;
    text-align: center;
    font-weight: 500;
    letter-spacing: 0.2m;
    position: relative;
}
header.header .gnb-floor nav.gnb ul.menu > li > a {
/*    padding: 2em 1.1em;*/
/*    기타검진프로그램 추가시*/
    padding: 2em 0.75em;
}
header.header .gnb-floor nav.gnb ul.menu > li:hover > a,
/*header.header .gnb-floor nav.gnb ul.menu li.menu-item-has-children:nth-child(2) a {*/
header.header .gnb-floor nav.gnb ul.menu li.menu-item-has-children.current-menu-parent > a {
    /* 현재 페이지 부모 or 중점진료센터 */
    color: var(--primary);
    font-weight: 700;
}
header.header .gnb-floor nav.gnb ul.sub-menu {
/*    display: none;*/
    visibility: hidden;
    opacity: 0;
    z-index: 0;
/*    grid-template-columns: 1fr;*/
    background-color: var(--primary);
    position: absolute;
/*    width: 9em;*/
    width: fit-content;
    left: 50%;
    top: 90%;
    transform: translate(-50%, -20px);
    border-radius: 30px;
    border-top-left-radius: 0;
    padding: 0.5em 1em;
    transition: all ease 0.3s;
    border: 1px solid rgba(0, 0, 0, 0.1);
}
header.header .gnb-floor nav.gnb ul.sub-menu.on {
/*    display: block;*/
    visibility: visible;
    opacity: 1;
    z-index: 2;
    transform: translate(-50%, 0);

}
header.header .gnb-floor nav.gnb ul.sub-menu li {
    display: block;
/*    width: inherit;*/
    color: var(--ivory);
    font-size: 15px;
    padding: 0.45em;
/*    cursor: pointer;*/
}
header.header .gnb-floor nav.gnb ul.sub-menu li a {
    width: fit-content;
    position: relative;
    margin: 0 auto;
    padding: 0 0.35em;
    font-weight: 400;
    word-break: keep-all;
    white-space: nowrap;

}
header.header .gnb-floor nav.gnb ul.sub-menu li a::after {
    content: '';
    width: 0;
    height: 1px;
    display: block;
    border-top: 2px solid rgba(255, 255, 255, .4);
    transition: all ease 0.5s;
    position: absolute;
    left: 0;
}
header.header .gnb-floor nav.gnb ul.sub-menu li:hover a::after,
header.header .gnb-floor nav.gnb ul.sub-menu li.current-menu-item a::after {
    width: 100%;
}






/* 서브메뉴 */
header.header .sub-floor {
    display: grid;
    visibility: hidden;
    background-color: rgba(255, 255, 255, .95);
    padding: 20px 0 50px;
    border-bottom:1px solid #ddd;
    transform: translateY(-450px);
    z-index: 1;
    transition: all ease 0.6s;
}
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 ul.menu 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);
}

header.header .sub-floor ul.menu li.menu-item-has-children > a { display:none }




/* footer */
footer.footer {
    max-width: 100vw;
    overflow: hidden;
/*    background-color: #C6BCB2;*/
    background-color: #8A715D;
/*    background-color: #7d6a5b;*/

    font-size: 16px;
}
footer.footer * { color:rgba(255, 255, 255, .9); }
footer.footer > .inner {
    padding: 80px;
    display: grid;
    grid-template-columns: 1fr 2fr;
    align-items: stretch;
    justify-content: center;
    grid-gap: 50px;
}
footer.footer > .inner > div {
    display: grid;
    grid-gap: 2em;
}

/* 푸터 유닛(part) 제목 */
footer.footer address { font-style:inherit; }
footer.footer .part h5 {
    text-transform: uppercase;
    color: var(--secondary);
    color: #D0B59E;

    font-size: 1.5em;
    margin-bottom: 0.3em;
    letter-spacing: 0.01em;
}
/* 푸터 전화번호 */
footer.footer p.number {
    font-size: 2.5em;
    font-weight: 700;
}
/* 푸터로고 */
footer.footer img.logo { width:200px; margin-top:30px }

/* 푸터 진료시간 */
footer.footer table.timetable { margin-bottom:1em }
footer.footer table.timetable tr > * { padding: 0.7em 0; font-size:1.1em }
footer.footer table.timetable th {
    width: 7em;
    padding-right: 2em;
    font-weight: 600;
}
footer.footer table.timetable th[colspan] { text-align:left; }

/* 푸터링크 */
footer.footer div.links {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    grid-gap: 10px;
}
footer.footer div.links {}
/* 푸터링크 지도버튼 */
footer.footer div.links .btn-map {
/*    background-color: rgba(0, 0, 0, .1);*/
    color: #fff;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    border-radius: 3em;
    grid-gap: 5px;
    padding: 0.7em 1.2em 0.7em 0.8em;
    transition: transform ease 0.3s;
}
footer.footer div.links .btn-map img { max-height:1.1em; }

/*footer.footer div.links a.btn-map:hover {
    transform: translateY(-5px);
}*/
footer.footer div.links a.btn-map::before {
    content: '';
    display: block;
    width: 1.8em;
    aspect-ratio: 1 / 1;
    background-repeat: no-repeat;
    background-size: auto 90%;
    background-position: center;
}
a.btn-map.naver { background-color:#3A76CB }
a.btn-map.kakao { background-color:#F2D14E; }
a.btn-map.google { background-color:#fff }


a.btn-map.naver::before { background-image:url(./img/icon/map-symbol-naver.svg) }
a.btn-map.kakao::before { background-image:url(./img/icon/map-symbol-kakao.png) }
a.btn-map.google::before { background-image:url(./img/icon/map-symbol-google.svg) }

/* 푸터 지도 */
footer.footer .map {
    aspect-ratio:3/ 1;
    border: 1px solid rgba(0, 0, 0, .1);
    background-color: var(--ivory);
}

/* 푸터인포 */
footer.footer ul.info {
    width: 80%;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
    grid-gap: 0.4em 1.5em;
    flex-wrap: wrap;
}
footer.footer ul.info li {
    font-weight: 300;
    display: flex;
    flex-direction: row;
    grid-gap: 0.5em;
}

/* 푸터메뉴 */
footer.footer ul.menu {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
    grid-gap: 1em;
}
footer.footer ul.menu * {
    line-height: 1.0;
}

footer.footer ul.menu li.menu-item a { /*  푸터메뉴 단일  */ }
footer.footer ul.menu li.menu-item a:hover { opacity: 0.75; }
footer.footer ul.menu li.menu-item + li { border-left:1px solid rgba(255, 255, 255, .5); padding-left:1em }


/* copyright */
footer.footer .copyright {
    font-size: 0.8em;
    font-weight: 300;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    text-align: center;
    padding: 2em;
/*    background-color: #988E84;*/
/*    background-color: var(--secondary);*/
    background-color: #4a3f36;
    color: #9e938b;


}





/* quickmenu */
#quickmenu {
/*    border: 1px dashed lime;*/
    display: flex;
    flex-direction: column;
    position: fixed;
    left: 30px;
    top: 50%;
    gap: 1em;
    justify-content: center;
    z-index: 99;
/*    opacity: 0;*/
/*    transform: translate(-200px, -50%) scale(0.85);*/
    opacity: 1;
    transform: translate(0, -50%) scale(0.85);
    transition: all ease .6s;
}
#quickmenu.on {
    opacity: 1;
    transform: translate(0, -50%) scale(0.85);
}

#quickmenu .group {
    display: flex;
    flex-direction: column;
    justify-content: center;
    background-color: #f9f9f9;
    border-radius: 5em;
    padding: 2em 0.8em 0.8em;
    font-size: 14px;
    gap: 1em;
    box-shadow: 0 0 15px -2px rgba(0, 0, 0, 0.1);
}
#quickmenu .group a {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    color: #333;
    text-align: center;
    font-weight: 500;
    gap: 5px;
    font-size: 16px;
}
#quickmenu .group a .icon {
    display: inline-block;
    width: 36px;
    height: 36px;
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
    transition: all ease 0.2s;
}

#quickmenu .group a > img.call { width:40px; margin-bottom:10px }
#quickmenu .group a > img.number { width: 50px; }
#quickmenu .group a:first-child {
    border-bottom: 1px solid #ddd;
    padding-bottom: 1.5em;
}
#quickmenu .topbtn { text-align: center; cursor: pointer;}
#quickmenu .group a:hover .icon { opacity:0.5 }



div.gold-marks {
    display: flex;
    flex-direction: column;
    position: fixed;
    right: 30px;
    top: 55%;
    transform: translateY(-50%);
/*    border: 1px dashed magenta;*/
    z-index: 100;
    grid-gap: 10px;
    transition: all ease 0.5s;
}
div.gold-marks a.gold {
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    width: 200px;
    aspect-ratio: 9 / 10;
/*    border: 1px solid red;*/
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    border-radius: 30px;
    overflow: hidden;
    grid-gap: 10px;
    transition: all ease 0.5s;

    box-shadow: -2px 10px 30px -10px rgba(207, 170, 95, .05);
}
div.gold-marks a.gold::before {
    content: '';
    display: block;
    position: absolute;
    width: 600px;
    height: 600px;
    left: -50%;
    background: linear-gradient(0deg,rgba(255, 255, 255, 0) 40%, rgba(255, 255, 255, .35) 50%, rgba(255, 255, 255, 0) 70%);
    animation: highlight 6s ease 2s infinite forwards;
    transform: rotate(135deg) translateY(300px);
    transition: all ease 1s;
    mix-blend-mode: overlay;
}
/*div.gold-marks a.gold:hover::before {
    transform: rotate(135deg) translateY(-100px)
}*/
@keyframes highlight {
    0% { transform: rotate(135deg) translateY(300px); }
    30% { transform: rotate(135deg) translateY(-200px) }
    100% { transform: rotate(135deg) translateY(-200px) }
}

div.gold-marks a.gold:hover {
    transform: translateY(-10px);
}
div.gold-marks a.gold:hover img {
    animation: markdance 0.5s alternate 4;
}
@keyframes markdance {
    from { transform: scale(1.0); }
    to { transform: scale(1.05); }
}

div.gold-marks a.gold img {
    height: 110px;
}
div.gold-marks a.gold * {
    color: var(--fontcolor);
    position: relative;
    z-index: 1;
}
div.gold-marks a.gold span {
    font-size: 15px;
    font-weight: 600;
}
div.gold-marks a.gold strong {
    font-size: 24px;
    font-weight: 800;
    letter-spacing: -0.04em;
}
div.gold-marks a.gold.endoscope {
    --fontcolor : #543605;
    background-image: url('./img/bg-yellowgold.png');
}
div.gold-marks a.gold.institute {
    --fontcolor : #2b3440;
    background-image: url('./img/bg-gold.png');
}

/* 골드마크 minimize */
div.gold-marks.minim {
    transform: translateY(-50%) scale(0.6);
    transform-origin: right;
}

/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
    MAINPAGE : 메인페이지
 - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
/* - - - - - 01. 메인비주얼  */
section.main-visual {
    max-width: 100vw;
    overflow: hidden;
    position: relative;
}
section.main-visual .swiper-slide {
    width: 100vw;
    height: 100vh;
/*    aspect-ratio: 1920 / 1080;*/
    overflow: hidden;
    background-color: var(--primary);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
}
section.main-visual .swiper-slide .inner {
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    padding-top: 10vh;
    padding-left: 3vw;
    position: relative;
}

section.main-visual .swiper-slide * { color:#fff }
section.main-visual .swiper-slide p.eng {
    letter-spacing: 0.3em;
    font-weight: 300;
    font-size: 13px;
    animation-delay: 0.3s;
    filter: opacity(0.6);
}
section.main-visual .swiper-slide h3.mv-title {
    font-family: 'lhlh';
    font-weight: 400;
    font-size: 4em;
    text-shadow: 0.06em 0.1em 0.1em rgba(83, 68, 58, .2);
    margin: 0.2em 0 0.5em;
    animation-delay: 0.5s;
}
section.main-visual .swiper-slide p.mv-desc {
    font-size: 1.2em;
    line-height: 1.6;
    letter-spacing: 0;
    text-shadow: 0.06em 0.1em 0.1em rgba(83, 68, 58, .6);
    animation-delay: 0.8s;
}

/* 카운팅 */
section.main-visual .swiper-slide.mv2 .inner {
    align-items: center;
}
section.main-visual .swiper-slide.mv2 h3.mv-title {
    font-size: 3.5em;
    background: linear-gradient(0deg,#FACB23 0%, rgba(255, 251, 206, 1) 40%, rgba(255, 251, 206, 1) 60%, #FACB23 90%);
    color: transparent;
    background-clip: text;
/*    text-shadow: -1px -1px 0 rgba(0, 0, 0, .9);*/
}
section.main-visual .swiper-slide.mv2 div.trio {
    width: 60%;
    align-items: center;
    justify-content: space-around;
    margin: 1em auto 0;
    animation-delay: 1s;
}
section.main-visual .swiper-slide.mv2 div.trio div {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

/* 애니메이션 */
section.main-visual .swiper-slide .inner > * {
    opacity: 0;
}
section.main-visual .swiper-slide.swiper-slide-active .inner > * {
    opacity: 0;
    transform: translateX(-40px);
    animation-name: on;
    animation-duration: 1s;
    animation-timing-function: ease;
    animation-fill-mode: forwards;
}
@keyframes on {
    from { opacity: 0; transform: translateX(-40px); }
    to { opacity: 1; transform: translateY(0); }
}

section.main-visual .swiper-slide.mv2 .inner { padding-left:0 }
section.main-visual .swiper-slide.mv2 div.trio p {
    font-size: 2em;
}
section.main-visual .swiper-slide.mv2 div.trio p span {
    font-family: 'lhlh';
    font-size: 2em;
}
section.main-visual .swiper-slide.mv2 div.trio h4 {
    font-weight: 500;
    font-size: 1.5em;
    position: relative;
    color: #fff8c8;
    padding: 0.25em 2em;
}
section.main-visual .swiper-slide.mv2 div.trio h4::before,
section.main-visual .swiper-slide.mv2 div.trio h4::after {
    content: '';
    aspect-ratio: 1 / 3;
    height: 2em;
    display: block;
    position: absolute;
    top: 0;
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
}

section.main-visual .swiper-slide.mv2 div.trio h4::before {
    left: 0;
    background-image: url('./img/mv-laurel-left.png');
}
section.main-visual .swiper-slide.mv2 div.trio h4::after {
    background-image: url('./img/mv-laurel-right.png');
    right: 0;
}

/* 메인비주얼 외 공통 */
section > .inner {
    --inner : 1500px;
    max-width: 80vw;
    padding: 200px 0;
}
/* 섹션 제목영역 */
section .title-zone {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}
section .title-zone.center { align-items:center; }
section .title-zone.center * { text-align:center; }
section.dark .title-zone * { color:#fff }
section.dark.checkup.intro p.intro-desc { color:#fff }
section.dark.checkup.intro p.intro-desc span { color:#FFDEC4 }

/* 섹션 부제목  */
section .title-zone p.sub {
    color: var(--secondary);
    margin-bottom: 1em;
    font-weight: 500;
    filter: opacity(0.9);
}
section.dark .title-zone p.sub { color: #FFDEC4; }

/* 섹션 제목  */
section .title-zone .section-title {
    line-height: 1.3;
}
section .title-zone .section-title span {
    color: var(--tertiary);
}
section.dark .title-zone .section-title span {
    color: #FFDEC4;
}

section .title-zone .p-wrap {
    margin-top: 2em;
}
section .title-zone .p-wrap p {
    font-size: 1.1em;
}

/* 유닛 */
section .unit { margin: 80px auto 0; }
section .unit.ml { margin: 40px auto; }
section .unit.nomargin { margin: 0 auto; }
section .unit.img { margin: 60px auto; }
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%; }

/* 유닛 이미지 정렬 */
section .unit.img { text-align: center; }
section .unit.img.duo { display:flex; flex-direction: row; align-items:center; justify-content:center; gap:30px }
section .unit.img img { max-width:100% }

/* 효과 스크롤텍스트(서브페이지) */
@keyframes scrollTextBg {
    from { background-position:right -99vw bottom; }
    to { background-position:left -99vw bottom; }
}
section > div.scrollText {
    width: 100%;
    max-width: 100vw;
    overflow: hidden;
    background-repeat: repeat-x;
    animation: scrollTextBg 60s linear infinite;
    background-size: auto 90%;
    height: 4em;
    opacity: 0.8;
    background-image: url(./img/scrolltext.png);
    position: relative;
    z-index: -1;
}
section > div.scrollText.primary {
    background-image: url(./img/scrolltext-primary.png);
}




/* - - - - - 02. 우수기관  */
section.main-excellent {}
section.main-excellent > div.scrollText {
    margin: -300px 0 100px;
}
section.main-excellent .title-zone {
    width: 80%;
    margin: 0 auto;
    position: relative;
    padding: 0 10%;
}
section.main-excellent .title-zone::before,
section.main-excellent .title-zone::after {
    content: '';
    display: block;
    aspect-ratio: 1 / 2;
    height: 100%;
    position: absolute;
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    top: 0;
}
section.main-excellent .title-zone::before {
    left: 0;
    background-image: url(./img/laurel-big-left.png);
}
section.main-excellent .title-zone::after {
    right: 0;
    background-image: url(./img/laurel-big-right.png);
}
section.main-excellent .title-zone + .p-wrap {
    padding: 2em 3em 0;
}
section.main-excellent .unit.img img {
    height: 300px;
}

section.main-excellent .unit.img {
    position: relative;
}
section.main-excellent .unit.img::after {
    content: '';
    display: block;
    position: absolute;
    aspect-ratio: 12/5;
    height: 100px;
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    top: 50%;
    right: 0;
    transform: translate(60%, -50%);
    background-image: url('./img/logo-nhis.svg');
}


/* - - - - - 03. 신뢰의기술  */
section.main-trust {
    overflow: hidden;
    width: 100%;
    background-color: #fff;
}
section.main-trust .inner {
/*    width: 100%;*/
/*    max-width: none;*/
    padding: 100px 0;
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    justify-content: center;
}
section.main-trust .title-zone {
    margin-bottom: 60px;
/*    padding: 0 10%;*/
}
/* 컨테이너 */
section.main-trust .trust-swiper {
/*    padding-left: 10%;*/
/*    margin-right: 10%;*/
}
section.main-trust .wrapper {
    display: flex;
    flex-wrap: nowrap;
    width: fit-content;
}
section.main-trust .trust-swiper .slide {
    background-color: transparent;
    width: 100%;
    flex-shrink: 0;
    padding-right: 0;
}
section.main-trust .trust-swiper .slide:nth-child(2),
section.main-trust .trust-swiper .slide:nth-child(3) { opacity:0 }

section.main-trust .slide h3 {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
    position: relative;
    font-size: 2.2em;
    font-weight: 400;
    grid-gap: 0.15em;
}
section.main-trust .slide h3 strong { font-weight:700 }
section.main-trust .slide h3::before {
    content: '';
    display: block;
    width: 1.5em;
    aspect-ratio: 1 / 1;
    background-repeat: no-repeat;
    background-position: center;
    background-size: 75%;
}
section.main-trust .slide h3.t1::before { background-image:url(./img/number-pattaya-01.svg); }
section.main-trust .slide h3.t2::before { background-image:url(./img/number-pattaya-02.svg); }
section.main-trust .slide h3.t3::before { background-image:url(./img/number-pattaya-03.svg); }

section.main-trust .slide p {
    font-size: 1.1em;
    margin-top: 0.8em;
}
section.main-trust .slide div.photo {
    margin-top: 40px;
    display: grid;
    grid-template-columns: 1.57fr 1fr 1fr;
    grid-gap: 10px;
    width: 98%;
}



/* - - - - - 04. 해운대내과의 특별함   */
section.main-special {
    background-color: #9A7857;
    background-image: url(./img/main-special-bg.webp);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    border: 2vw solid #9a7857;
    overflow: hidden;
}
section .unit.special-circle {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
}
section .unit.special-circle > div {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    border: 1px solid #fff;
    border-radius: 50%;
    aspect-ratio: 1 / 1;
    width: 350px;
    padding: 30px;
    gap: 1em;
    margin: 0 -15px;
}
section .unit.special-circle > div img {
    width: 90px;
}
section .unit.special-circle > div h3 {
    color: #fff;
    text-align: center;
    line-height: 1.5;
    font-size: 1.1em;
    font-weight: 300;
}

section .unit.special-circle > div:first-child,
section .unit.special-circle > div:last-child {
    position: relative;
}
section .unit.special-circle > div:first-child::before,
section .unit.special-circle > div:last-child::before {
    content: '';
    display: block;
    width: 30vw;
    height: 1px;
    border-bottom: 1px solid #FFDEC4;
    position: absolute;
    top: 50%;
}

section .unit.special-circle > div:first-child::before{
    left: 0;
    transform: translateX(-100%);
}
section .unit.special-circle > div:last-child::before{
    right: 0;
    transform: translateX(100%);
}



section.main-special .unit.special-text {
    background-repeat: no-repeat;
    background-position: right center;
    background-size: auto 70%;
    background-image: url('./img/name-eng-serif.svg');
}
section .unit.special-text * { color: #fff; }
section .unit.special-text .p-wrap { width: 70%; margin-top:1em }
section .unit.special-text .p-wrap p {
    color: rgba(255, 255, 255, .8);
    font-weight: 300;
    line-height: 1.9;
}
section .unit.special-text .p-wrap p b { font-weight: 600; }




/* - - - - - 05. 시그니처 케어   */
section.main-signature {
    background-image: url(./img/main-signature-bg-symbol.png);
    background-position: right -10vw bottom -100px;
    background-attachment: fixed;
    background-repeat: no-repeat;
}
section.main-signature .title-zone {
    position: relative;
}
section.main-signature .title-zone::after {
    content: '';
    display: block;
    position: absolute;
    top: 60%;
    aspect-ratio: 7 / 1;
    width: 25%;
    background-image: url(./img/signature-care.png);
    background-position: top center;
    background-repeat: no-repeat;
    background-size: contain;
    z-index: -1;
}
section.main-signature .unit.signature-grid {}
section.main-signature .unit.signature-grid > div {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    grid-gap: 80px;
}
section.main-signature .unit.signature-grid > div img.radius {
    border-radius: 30px;
    width: 400px;
}

section.main-signature .unit.signature-grid > div .txt {
    width: 500px;
}
section.main-signature .unit.signature-grid > div .txt h4 {
    font-size: 1.5em;
    border-bottom: 1px solid #ccc;
    padding-bottom: 0.8em;
    margin-bottom: 1em;
    font-weight: 600;
}
section.main-signature .unit.signature-grid > div .txt h4::before {
    content: '';
    display: block;
    aspect-ratio: 1 / 1;
    width: 2.8em;
    background-color: var(--tertiary);
    border-radius: 50%;
    overflow: hidden;
    background-repeat: no-repeat;
    background-position: center;
    background-size: 40%;
    background-image: url(./img/symbol-fff.svg);
    margin-bottom: 1em;
}
section.main-signature .unit.signature-grid > div .txt h4 span { color:var(--tertiary) }
section.main-signature .unit.signature-grid > div.reverse img { order:2 }
section.main-signature .unit.signature-grid > div.reverse .txt { order:1 }


/* - - - - - 06. 지금이순간에도   */
section.main-counter {
    background-image: url('./img/main-counter-bg.jpg');
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    background-attachment: fixed;
}
section.main-counter > .inner {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;

}
section.main-counter .counter-zone {
    width: 50%;
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-gap: 100px 80px;
    position: relative;
}
section.main-counter .counter-zone * {
    color: #fff;
}
section.main-counter .counter-zone > article {
    border-top: 1px solid #fff;
    padding: 2em 1em;
    background-position: right top 1.5em;
    background-size: auto 3em;
    background-repeat: no-repeat;
    height: 200px;
}
section.main-counter .counter-zone > article:nth-child(1) { background-image:url('./img/main-counter-icon01.svg') }
section.main-counter .counter-zone > article:nth-child(2) { background-image:url('./img/main-counter-icon02.svg') }
section.main-counter .counter-zone > article:nth-child(3) { background-image:url('./img/main-counter-icon03.svg') }
section.main-counter .counter-zone > article:nth-child(4) { background-image:url('./img/main-counter-icon04.svg') }

section.main-counter .counter-zone > article h4 {
    font-size: 1.1em;
    font-weight: 500;
}
section.main-counter .counter-zone > article .counting {
    display: grid;
    grid-template-columns: 9em auto;
    align-items: center;
}
section.main-counter .counter-zone > article .counting h5 {
    color: #FFDEC4;
    font-size: 2em;
}
section.main-counter .counter-zone > article .counting h5::after { content: ''; }

section.main-counter .counter-zone::after {
    content: '(*2026년 3월 기준)';
    display: block;
    text-align: right;
    color: #fff;
    position: absolute;
    bottom: 0;
    right: 0;
}




/* - - - - - 07. 의료진 소개   */
section.main-doctors {}
section.main-doctors .inner {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-around;
    padding-bottom: 300px;
}
section.main-doctors .inner .img {
    width: 43%;
}
section.main-doctors .inner .title-zone {}
section.main-doctors .inner .title-zone .p-wrap p {
    font-size: 1.3em;
}
section.main-doctors .inner .title-zone .p-wrap p strong {
    font-size: 1.4em;
}
section.main-doctors .inner .title-zone a.main-moreview {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    grid-gap: 1em;
    margin-top: 3em;
}
section.main-doctors .inner .title-zone a.main-moreview img {
    transition: all ease 0.5s;
    max-height: 4em;
}
section.main-doctors .inner .title-zone a.main-moreview img.arrow {
    height: 1.5em;
}
section.main-doctors .inner .title-zone a.main-moreview:hover img.arrow { transform: translateX(10px); }



/* - - - - - 08. 장비   */
section.main-equip {
    margin-top: -150px;
    border-top-right-radius: 150px;
    overflow: hidden;
}
section.main-equip .title-zone p.sub {
    font-weight: 300;
}
section.main-equip .unit.rounded-box {
    position: relative;
    z-index: 1;
    background-color: #fff;
    padding: 60px;
    border-radius: 10em;
}
section.main-equip .unit.rounded-box h6 {
    font-weight: 600;
    margin-bottom: 1em;
    font-size: 1em;
}
/**/
section.main-equip .equip-circle-effect {
    width: 70%;
    margin: 30px auto -13%;
    aspect-ratio: 1 / 1;
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
    background-image: url('./img/equip-circle-bg.png');
    position: relative;
    z-index: 0;
    overflow: hidden;
}
section.main-equip .equip-circle-effect > div {
    width: 100%;
    aspect-ratio: 1 / 1;
    background-repeat: no-repeat;
    background-size: 96%;
    background-position: center;
/*    border: 1px dashed magenta;*/
/*    background-color: rgba(255, 0, 255, .1);*/
    position: absolute;
    top: 0;
    left: 0;
    animation-name: equipCircle;
    animation-duration: 36s;
    animation-timing-function: linear;
    animation-iteration-count: infinite;
    transition: all ease 1s;
}
section.main-equip .equip-circle-effect > div.c1 {
    background-image: url(./img/equip-circle01.png);
}
section.main-equip .equip-circle-effect > div.c2 {
    background-image: url(./img/equip-circle02.png);
/*    animation-direction: reverse;*/
    animation-duration: 48s;
}

@keyframes equipCircle {
    0% { transform: rotate(0) }
    100% { transform: rotate(360deg) }
}

section.main-equip .equip-circle-swiper {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 100%;
    padding: 0 5%;
    transform: translate(-50%, -50%);
    overflow: hidden;
/*    border: 1px solid blue;*/
}
section.main-equip .swiper-slide {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    aspect-ratio: 2 / 3;
    gap: 30px;
    transition: transform 1s ease;
    transform: scale(0.6);
/*    border: 1px dashed cyan;*/
}
section.main-equip .swiper-slide img {
    max-height: 90%;
}

section.main-equip .swiper-slide p.equip-name {
    transform: translateY(-100%);
    opacity: 0;
    transition: all 0.5s ease 0.5s;
    color: #FFEFE3;
    font-weight: 500;
}
section.main-equip .swiper-slide.swiper-slide-active p.equip-name {
    transform: translateY(0);
    opacity: 1;
}
section.main-equip .swiper-slide.swiper-slide-active {
    transform: scale(1);
}
section.main-equip .swiper-button-prev,
section.main-equip .swiper-button-next {
    display: block;
    width: 50px;
    height: 50px;
    font-size: 0;
    background-size: 90%;
    background-position: center;
    background-repeat: no-repeat;
}

section.main-equip .swiper-button-prev svg,
section.main-equip .swiper-button-next svg { visibility: hidden; }

section.main-equip .swiper-button-prev { background-image:url(./img/swiper-prev-fff.svg) }
section.main-equip .swiper-button-next { background-image:url(./img/swiper-next-fff.svg) }




/* - - - - - 09. FAQ   */
section.faq {
    margin: 80px auto;
}
/*section.faq div.unit.faq-list .faq + .faq { margin-top:1em }*/
section.faq > .inner { padding:80px 0 }

section.faq div.unit.faq-list .faq {
    padding: 1em 2em;
    cursor: pointer;
    overflow: hidden;
    max-height: 7em;
    transition: max-height 0.4s ease;
}
section.faq div.unit.faq-list .faq + .faq {
    margin-top: -1.75em;
}

section.faq div.unit.faq-list .faq .answer {
    opacity: 0;
    margin-top: 0;
    transition: opacity 0.3s ease, margin 0.3s linear ;
}
section.faq div.unit.faq-list .faq.active {
    max-height: 1000px;
}
section.faq div.unit.faq-list .faq.active .answer {
    opacity: 1;
    margin: 2em 1em;
}
section.faq div.unit.faq-list .faq .question {
    display: grid;
    grid-template-columns: 2em auto 1em;
    border: 1px solid var(--tertiary);
    align-items: center;
    border-left: 0;
    border-right: 0;
    padding: 0.8em 1em;
    background-color: #fff;
}
section.faq div.unit.faq-list .faq .question::after {
    content: '';
    display: block;
    width: 1em;
    aspect-ratio: 2 / 1;
    background-image: url('./img/faq-chevron.svg');
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
}
section.faq div.unit.faq-list .faq.active .question {
    color: var(--tertiary);
}
section.faq div.unit.faq-list .faq.active .question::after {
    background-image: url('./img/faq-chevron-active.svg');
}
section.faq div.unit.faq-list .faq .question p {
    font-weight: 500;
    text-align: center;
    font-size: 1.1em;
}
section.faq div.unit.faq-list .faq .question::before {
    content: 'Q.';
    color: var(--tertiary);
    font-weight: 800;
    font-size: 2em;
}
section.faq div.unit.faq-list .faq .answer {
/*    margin: 2em 1em 0;*/
}
section.faq div.unit.faq-list .faq .answer p {
    display: grid;
    font-weight: 400;
    grid-template-columns: 1em auto;
    text-align: center;
}
/*section.faq div.unit.faq-list .faq .answer p + p { margin-top:0.35em }*/
section.faq div.unit.faq-list .faq .answer p::before {
/*    content: '\00b7';*/
    content: '';
    font-weight: 800;
}






/* - - - - - 10. 시설안내   */
section.main-interior {
    overflow: hidden;
}
section.main-interior .interior-swiper {
    margin: 50px 0 0;
    transform: translateX(-8vw);
}
section.main-interior .interior-swiper .swiper-wrapper {
}

section.main-interior .swiper-slide {
    /*width: calc(30vw * 0.52);
    height: calc(40vw * 0.52);*/
    width: 300px;
    height: 400px;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    overflow: hidden;
    border-radius: 20px;
    transition: all ease 0.5s;
}
section.main-interior .swiper-slide.swiper-slide-active {
    /*width: calc(60vw * 0.52);
    height: calc(40vw * 0.52);*/
    width: 600px;
}











/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
    SUBPAGE : 레이아웃 / 공통요소
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */


/* 서브 헤더 */
section.sub-header {
    --inner : 1300px;
    border-bottom: 1px solid #ddd;
    position: relative;
}
section.sub-header > .inner {
    padding: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-end;
    grid-gap: 20px;
    height: 60vh;
    padding-bottom: 8%;
}
section.sub-header.full {
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    background-color: #222;
    background-attachment: fixed;
}
section.sub-header.full > .inner {
    justify-content: center;
    padding-bottom: 0;
    height: 100vh;
}
section.sub-header.full * {
    color: #fff;
}

section.sub-header p.eng {
    letter-spacing: 0.5em;
    font-size: 0.85em;
    font-weight: 300;
}
section.sub-header h2 {
    font-size: 3.8em;
}
section.sub-header p.desc {
    font-size: 1.2em;
    font-weight: 500;
}



/* 서브 브레드크럼 */
div.sub-breadcrumb {
/*    width: 1600px;*/
    width: var(--inner);
    margin: 0 auto;
    position: absolute;
    bottom: 30px;
    left: 50%;
    transform: translateX(-50%);
/*    margin-bottom: 70px;*/
/*    border: 1px dashed magenta;*/
}
section.full div.sub-breadcrumb {
    bottom: 50px;
}
div.sub-breadcrumb nav.breadcrumb > ul {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-end;
}
div.sub-breadcrumb nav.breadcrumb > ul > li {
    display: flex;
    flex-direction: row;
    align-items: center;
    line-height: 0;
}
div.sub-breadcrumb nav.breadcrumb > ul > li + li::before {
    content: '';
    display: block;
    height: 1em;
    aspect-ratio: 2 / 1;
    background-repeat: no-repeat;
    background-position: center;
    background-size: auto 80%;
    background-image: url(./img/breadcrumb-chevron.svg);
/*    border-left: 1px solid rgba(150, 150, 150, .3);*/
}
section.full div.sub-breadcrumb nav.breadcrumb > ul > li + li::before {
    background-image: url(./img/breadcrumb-chevron-fff.svg);
}
div.sub-breadcrumb nav.breadcrumb > ul li.home {
    width: 45px;
    aspect-ratio: 1 / 1;
    display: flex;
    background-color: var(--primary);
    border-radius: 50%;
    justify-content: center;
    align-items: center;
    background-image: url('./img/breadcrumb-home-fff.svg');
    background-repeat: no-repeat;
    background-size: 40%;
    background-position: center;
}
section.full div.sub-breadcrumb nav.breadcrumb > ul li.home {
    background-color: #fff;
    background-image: url('./img/breadcrumb-home.svg');
}
div.sub-breadcrumb nav.breadcrumb ul li.has-children {
    position: relative;
    font-size: 16px;
    padding: 0;
}
div.sub-breadcrumb nav.breadcrumb ul li.has-children > a {
    display: flex;
    flex-direction: row;
    align-items: center;
    line-height: 0.8;
}

div.sub-breadcrumb nav.breadcrumb ul li.has-children ul.sub-breadcrumb-menu {
    display: none;
    position: absolute;
    max-width: inherit;

    width: auto;
    top: 30px;
    left: 1.1em;
    z-index: 2;
    background-color: #fff;
    border-radius: 10px;
    overflow: hidden;
    border: 1px solid #ddd;
}
div.sub-breadcrumb nav.breadcrumb ul li.has-children > a.on + ul.sub-breadcrumb-menu {
    display: block;
}

div.sub-breadcrumb nav.breadcrumb ul li.has-children ul.sub-breadcrumb-menu li {
    white-space: nowrap;
    font-size: 0.9em;
    transition: padding ease 0.3s;
}
div.sub-breadcrumb nav.breadcrumb ul li.has-children ul.sub-breadcrumb-menu li a {
    display: block;
    color: #444;
    padding: 0.75em 1.5em;
}

div.sub-breadcrumb nav.breadcrumb ul li.has-children ul.sub-breadcrumb-menu li.current a {
    color: #222;
    font-weight:600;
    background-color:#f9f9f9
}
div.sub-breadcrumb nav.breadcrumb ul li.has-children ul.sub-breadcrumb-menu li.on + ul.sub-breadcrumb-menu { display: block; }



section.sub .p-wrap p + p { margin-top:1em }

/* 효과 - 텍스트 채우기 */
section.sub .text-fill { }
section.sub .text-fill div.fill {
    position:relative;
    height:3.5em;
    max-width: var(--inner);
}
section.sub .text-fill div.fill h4.title {
    position: absolute;
    color: #ccc;
    white-space: nowrap;
}
section.sub .text-fill div.fill h4.title.copy {
    /*복사된 h4*/
    color: #222;
    width: 0;
    overflow: hidden;
}





/* 서브 */
section.sub {
    --inner : 1280px;
}
/* 서브 인트로 */
section.sub.intro {
    position: relative;
}




/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
    SUBPAGE : 00 병원소개
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
/* - - - - - 서브페이지 : 의료진소개 (sub0-1.php) */
section.sub.doctor {
    padding-bottom: 80px;
}
/*section.sub.doctor > .inner[style] { padding-bottom: 80px; }*/
section.sub .title-zone h2 + p { margin-top:2em }
section.sub.doctor .effect.photo-scroll {
    aspect-ratio: 3.5 / 1;
    background-image: url('./img/sub-doctor-scroll-bg.jpg');
    background-repeat: no-repeat;
    background-size: cover;
    background-position: bottom center;
    position: relative;
    will-change: width;
    margin: 0 auto;
    transition: none;
}
section.sub.doctor .effect.photo-scroll .profile {
   aspect-ratio: 5 / 4;
   width: 35vw;
   background-size: contain;
   background-repeat: no-repeat;
   background-position: bottom center;
   background-image: url('./img/sub-doctor-scroll-profile.png');
   position: absolute;
   bottom: 0;
   left: 50%;
   transform: translateX(-50%);
   transition: all ease 1s;
}
/**/
section.sub.doctor .profile-grid {
    display: grid;
    grid-template-columns: 1fr 1px 1fr;
    gap: 80px;
    width: 92%;
    justify-content: center;
    align-items: center;
    margin: 0 auto;
    position: relative;
}
section.sub.doctor .profile-grid + .profile-grid::before,
section.sub.doctor .profile-grid + .profile-grid::after {
    content: '';
    background-color: #ddd;
    display: block;
    width: 100vw;
    height: 1px;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
}
section.sub.doctor .profile-grid + .profile-grid::before { top: 0; }
section.sub.doctor .profile-grid + .profile-grid::after { bottom: 0; }

section.sub.doctor .profile-grid .line { background-color:#ddd; height:100% }
section.sub.doctor .profile-grid .img,
section.sub.doctor .profile-grid .txt {
    border: 60px solid var(--ivory);
    border-left: 0;
    border-right: 0;
}

section.sub.doctor .profile-grid .img {
    aspect-ratio: 3 / 4;
    background-color: rgba(100, 100, 100, .5);
    background-size: cover;
    background-position: top center;
    background-repeat: no-repeat;
}
section.sub.doctor .profile-grid .txt {
    padding: 60px 0;
}
section.sub.doctor .profile-grid .txt > img {
    width: 50px;
    display: block;
    margin-bottom: 60px;
}
section.sub.doctor .profile-grid .txt > h4 {
    font-weight: 400;
    font-size: 1.75em;
    color: var(--primary);
    margin-bottom: 0.5em;
}
section.sub.doctor .profile-grid .txt > h4 + p {
    line-height: 1.8;
    margin-bottom: 70px;
}

section.sub.doctor .profile-grid .txt .career > p { font-weight:500; font-size:1.1em }
section.sub.doctor .profile-grid .txt .career > h5 { font-size: 1.8em }
section.sub.doctor .profile-grid .txt .career > h5 small { font-weight:400 }
section.sub.doctor .profile-grid .txt .ul-wrap {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-gap: 30px;
    margin-top: 30px;
}
section.sub.doctor .profile-grid .txt .ul-wrap ul li {
    display: grid;
    grid-template-columns: 1em auto;
    font-size: 0.9em;
    line-height: 1.5;
    margin-bottom: 0.8em;
}
section.sub.doctor .profile-grid .txt .ul-wrap ul li::before {
    content: '\00b7';
    color: var(--primary);
    font-weight: 900;
}
section.sub.doctor .profile-grid .txt .ul-wrap ul li span {
    background-color: var(--primary);
    color: #fff;
    border-radius: 5px;
    padding: 0 0.5em;
    width: fit-content;
}


section.sub.doctor .scrollText {
    z-index: 1;
    margin-top: 80px;
    height: 4em;
}



/* - - - - - 서브페이지 : 장비소개 (sub0-2.php) */
section.sub.equip .unit.img {}
section.sub .unit.img-desc .p-wrap { margin-top:1em }
section.sub.equip .unit.img-desc { margin-bottom:150px }


/* - - - - - 서브페이지 : 언론보도 (sub0-3.php) */
section.sub.news {}
section.sub.news .unit {
    aspect-ratio: 5/2;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #ddd;
    background-color: #fafafa;
    border-radius: 5px;
}
section.sub.news .unit::before{
    content: '호스팅 구매 및 서버 세팅 후 게시판 스킨 별도 작업 예정';
    opacity: 0.3;
    font-size: 1.2em;
    text-align: center;
    line-height: 1.5;
}
/* - - - - - 서브페이지 : 둘러보기 (sub0-4.php) */
/* - - - - - 서브페이지 : 오시는길 (sub0-5.php) */
section.sub.locate {}
section.sub.locate .unit.locate-info {
    position: relative;
    display: grid;
    grid-template-columns: 1.1fr 1fr;
    grid-gap: 70px;
    align-items: center;
    justify-content: center;
}
section.sub.locate .unit.locate-info .badge {
    position: absolute;
    z-index: 2;
    width: 14%;
    aspect-ratio: 1 / 1;
    display: flex;
    border-radius: 50%;
/*    border: 1px solid magenta;*/
/*    background-color: rgba(255,0,255,.5);*/
    left: -10px;
    top: 0;
    transform: translateY(-50%);

    background-image: url(./img/map-badge.svg);
    background-size: 99%;
    background-color: #3AB449;
    background-repeat: no-repeat;
    background-position: center;
    box-shadow: 10px 20px 30px -10px rgba(0, 0, 0, .1);

}
section.sub.locate .unit.locate-info .map {
    aspect-ratio: 1 / 1.2;
    border-radius: 5px;
    background-color: #fafafa;
    border: 1px solid #ddd;
}
/**/
section.sub.locate .unit.locate-info .info-wrap {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    height: 100%;
    padding: 30px 0 0;
}
section.sub.locate .unit.locate-info .info-wrap > article {
    display: grid;
    grid-template-columns: 3em auto;
    grid-gap: 0 1em;
}
section.sub.locate .unit.locate-info .info-wrap > article img.info-icon {
    grid-row: 1 / span 4;
}
section.sub.locate article h4 { font-size:1.5em; line-height:1.5; margin-bottom:1em }
section.sub.locate article ul {
    margin: 0 0 1em;
    display: grid;
    grid-template-columns: 5em auto;
    align-items: center;
    grid-gap: 0 1em;
}
section.sub.locate article ul li.label {
    background-color: var(--ivory);
    color: var(--primary);
    font-weight: 600;
    text-align: center;
    border-radius: 3em;
    padding: 0.5em;

}

section.sub.locate .unit.locate-info .info-wrap > div.box {
    background-color: var(--ivory);
    padding: 2em 3em;
    border-radius: 1em;
    background-repeat: no-repeat;
    background-position: right 30px bottom 30px;
    background-size: 3em;
    background-image: url('./img/symbol.svg');
}
section.sub.locate .unit.locate-info .info-wrap > div.box p {margin-top: 1em}





/* - - - - - 서브페이지 : 해운대내과의 특별함 (sub0-special.php) */
section.sub-header.full.special {
    background-position: right top 10%;
}
section.sub-header.full.special .inner {
/*    align-items: flex-start;*/
    width: 60vw;
    margin: 0;
}
section.sub-header.full.special .inner p.eng { letter-spacing:0.1em; font-size:1em }
section.sub-header.full.special .inner h2 { font-size:4em }
section.sub-header.full.special .inner p.desc { font-size:1.2em }




/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
    SUBPAGE : 해운대내과의 특별함
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
section.sub.special.gradient {
    margin-top: 150px;
    border-radius: 160px;
    border-bottom-right-radius: 0;
    border-bottom-left-radius: 0;
    background: linear-gradient(180deg,#674123 10%, #625135 100%);
    padding-bottom: 80px;
}
section.sub.special > .inner.wide {
    max-width: 100vw;
    width: 100%;
    background-repeat: no-repeat;
    background-position: top 5% center;
    background-size: 100%;
    padding: 140px 0 80px;
}
section.sub.special .scrollText { height:4em }



section.sub.special .unit.best-endoscope * { color:#fff }
section.sub.special .unit.best-endoscope {
    border: 1px solid rgba(255, 255, 255, .5);
    border-left: 0;
    border-right: 0;
}
section.sub.special .unit.best-endoscope .border-side {
    border: 1px solid rgba(255, 255, 255, .5);
    border-top: 0;
    border-bottom: 0;
    display: grid;
    grid-template-columns: 1fr 1fr;
    max-width: var(--inner);
    width: 80%;
    margin: 0 auto;
}
section.sub.special .unit.best-endoscope .border-side .img {
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}
section.sub.special .unit.best-endoscope .txt {
    padding: 4em 5em;
}
section.sub.special .unit.best-endoscope .txt h3 {
    font-weight: 400;
    font-size: 1.8em;
    line-height: 1.4;
    margin-bottom: 1em;
}
section.sub.special .unit.best-endoscope .txt h3 strong {
    color: #FFDEC4;
    font-weight: 700;
    font-size: 1.1em;
}

section.sub.special .unit.best-endoscope .txt .p-wrap p { font-weight:300; }
section.sub.special .unit.best-endoscope .txt .p-wrap p strong { font-size:1.1em; font-weight:600 }
section.sub.special .unit.best-endoscope .img { display:flex; align-items:flex-end; padding:50px }
section.sub.special .unit.best-endoscope .img img { height:200px }


section.sub.special .title-zone.laurel {
    width: fit-content;
    margin: 0 auto 100px;
    position: relative;
    padding: 0 10%;
}
section.sub.special .title-zone.laurel::before,
section.sub.special .title-zone.laurel::after {
    content: '';
    display: block;
    aspect-ratio: 1 / 2;
    height: 100%;
    position: absolute;
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    top: 0;
}
section.sub.special .title-zone.laurel::before {
    left: 0;
    background-image: url(./img/laurel-big-left.png);
}
section.sub.special .title-zone.laurel::after {
    right: 0;
    background-image: url(./img/laurel-big-right.png);
}

section.sub .special-box {
    background-color: #222;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    border: 2vw solid #9a7857;
    overflow: hidden;
    margin: 150px auto 0;
    padding: 5vw 8vw;
}
section.sub .special-box * { color:#fff }
section.sub .unit.special-text h4 span,
section.sub .special-box .section-title span { color:#FFDEC4; }
section .unit.special-text .p-wrap { width: 100%; }

section.sub.special.bg-ivory { padding-bottom:80px; }
section.sub.special.bg-ivory > .inner { padding-bottom:80px }

section.sub.special-lab .inner {
    padding: 140px 0 80px;
}
section.sub.special-lab .unit.pattaya-trio {
    grid-gap: 1em;
}
section.sub.special-lab .unit.pattaya-trio > div {
    padding: 2em 2em 3em;
}
section.sub.special-lab .unit.pattaya-trio > div p { line-height:1.7 }
/**/
section.sub.special-task { padding-bottom:80px }
section.sub.special-task .inner {
    padding: 100px 0 50px;
}
section.sub.special-task table.task {
    border-collapse: collapse;
    width: 100%;
}
section.sub.special-task table.task tr > * {
    border: 1px solid #E5CEB8;
    text-align: center;
    padding: 0.5em;
    color: var(--secondary);
}
section.sub.special-task table.task tr > th {
    font-weight: 700;
    background-color: var(--ivory);
}


/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
    SUBPAGE : 01 건강검진센터
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
/* - - - - - 서브페이지 : 종합검진 (sub1-1.php) */
section.sub.checkup {}
section.sub.checkup > .inner.wide {
    width: 100vw;
    max-width: 100vw;
    padding: 120px 0;
}
section.sub.checkup .section-title b {
    all: inherit;
    font-weight: 800;
}
section.sub.checkup .section-title span.icon {
    display: inline-block;
    width: 1em;
    height: 1em;
    transform: translateY(0.2em);
    background-repeat: no-repeat;
    background-size: 90%;
    background-position: center left;
    background-image: url(./img/title-icon-search.svg);
}
section.sub.checkup p.intro-desc {
    font-size: 1.35em;
    font-weight: 600;
    color: var(--secondary);
}
section.sub.checkup p.intro-desc span { color: var(--tertiary); }

/* 종합검진 메시지 플루이드 */
section.sub.checkup div.msg-fluid {
    width: 100vw;
/*    border: 1px dashed red;*/
    margin: 100px 0;
}
section.sub.checkup div.msg-fluid .msg {
    display: flex;
    flex-direction: row;
    align-items: center;
    grid-gap: 1.5em;
}
section.sub.checkup div.msg-fluid .msg .img {
    aspect-ratio: 1 / 1;
    width: 4em;
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
    border-radius: 50%;
    overflow: hidden;
/*    border: 1px solid #ddd;*/
    box-shadow: 0 0 1em rgba(0, 0, 0, .1);
}
section.sub.checkup div.msg-fluid .msg .txt {
    background-color: #fff;
    padding: 1em 2em;
    border-radius: 1em;
    position: relative;
    box-shadow: -0.1em 0 1em rgba(0, 0, 0, .1);
}
section.sub.checkup div.msg-fluid .msg .txt::before {
    content: '';
    display: block;
    background-color: #fff;
/*    border: 1px solid red;*/
    width: 1.2em;
    aspect-ratio: 1 / 1;
    position: absolute;
    left: 0;
    top: 50%;
    transform-origin: center;
    border-radius: 5px;
    transform: rotate(150deg) skew(40deg) translate(-52%, 52%);
}
section.sub.checkup div.msg-fluid .msg .txt p {
    font-size: 1.1em;
    color: var(--secondary);
    font-weight: 600;
}
/* 종합검진 리스트 */
section.sub.checkup .unit.checkup-table {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    grid-gap: 20px;
    align-items: flex-start;
}
section.sub.checkup .unit.checkup-table table {
    border-collapse: collapse;
}
section.sub.checkup .unit.checkup-table table tr > * {
    border: 1px solid #ddd;
    padding: 0.5em;
}
section.sub.checkup .unit.checkup-table table tr > th {
    font-weight: 600;
    text-align: center;
}
section.sub.checkup .unit.checkup-table table thead tr > *,
section.sub.checkup .unit.checkup-table table tfoot tr > * {
    text-align: center;
    background-color: var(--tablebg);
    color: var(--tablecolor);
    font-weight: 600;
    font-size: 1.05em;
}
section.sub.checkup .unit.checkup-table table thead tr > td {
    background-color: #fafafa;
    color: var(--secondary);
    font-weight: 600;
}
section.sub.checkup .unit.checkup-table table thead tr > th {
    font-size: 1.1em;
    padding:1em;
    font-weight: 600;
}

section.sub.checkup .unit.checkup-table table tbody td {
    padding: 1em;
    font-size: 0.95em;
}

section.sub.checkup .unit.checkup-table table.basic { --tablebg: var(--ivory); --tablecolor: var(--secondary); }
section.sub.checkup .unit.checkup-table table.vip { --tablebg: var(--tertiary); --tablecolor: #fff; }
section.sub.checkup .unit.checkup-table table.vvip { --tablebg: var(--secondary); --tablecolor: #fff; }
section.sub.checkup .unit.checkup-table table.plus { --tablebg: #8A715D; --tablecolor: #fff; }

section.sub.checkup .unit.checkup-table table.plus thead th { padding:0.5em }
section.sub.checkup .unit.checkup-table table.plus td { text-align:center; line-height:1.5 }
section.sub.checkup .unit.checkup-table table.plus td small { line-height:1.0; font-size:0.8em }


section.sub.checkup .unit.checkup-table table.txt {
    height: 100%;
    background-color: var(--ivory);
}
section.sub.checkup .unit.checkup-table table.txt th {
}
section.sub.checkup .unit.checkup-table table.txt th p {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    grid-gap: 0.5em;
    color: var(--secondary);
    font-size: 1.3em;
    font-weight: 700;
}
section.sub.checkup .unit.checkup-table table.txt th p::before {
    content: '';
    display: block;
    width: 1.5em;
    aspect-ratio: 1 / 1;
    background-color: var(--tertiary);
    border-radius: 50%;
    background-repeat: no-repeat;
    background-size: 60%;
    background-position: center;
    background-image: url('./img/symbol-fff.svg');
}
/* pattaya-trio */
section.sub .unit.pattaya-trio {
    display: flex;
    flex-direction: row;
    align-items: stretch;
    justify-content: center;
    grid-gap: 2em;
}
section.sub .unit.pattaya-trio > div {
    width: 20em;
    background-color: var(--ivory);
    grid-gap: 0.5em;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    padding: 2em 3em 3em;
    border-radius: 1em;
    box-shadow: 0 0 8px rgba(20, 0, 0, .1);
}
section.sub .unit.pattaya-trio > div .before {
    font-family: 'Pattaya';
    font-size: 2.5em;
    color: var(--tertiary);
    text-align: center;
    letter-spacing: 0.05em;
}
section.sub .unit.pattaya-trio > div p {
    font-weight: 600;
    color: var(--secondary);
    text-align: center;
    font-size: 1.1em;
}




/* - - - - - 서브페이지 : 5대암검진 (sub1-2.php) */
section.sub.checkup.cancer.intro { padding-bottom:80px; }
section.sub.checkup.intro h1.label {
    font-size: 2em;
    text-align: center;
    width: 20em;
    margin: 1.5em auto 0;
    color: #fff;
    background-color: var(--secondary);
    background: linear-gradient(90deg,rgba(181, 143, 102, 1) 0%, rgba(104, 77, 46, 1) 100%);
    padding: 0.5em ;
    border-radius: 3em;
    font-weight: 600;
}
section.sub.checkup.intro h1.label + small.label-desc {
    display: block;
    margin: 1em auto 0;
    font-size: 0.9em;
    text-align: center;
}
/* 5대암 roadmap */
section.sub.checkup .unit.cancer-roadmap {
    margin-top: 100px;
    max-width: var(--inner);
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: flex-start;
    grid-gap: 40px;
}
section.sub.checkup .unit.cancer-roadmap > div:nth-child(3) h5::after {
    content: '';
    display: block;
    width: 100vw;
    height: 1px;
    border-top: 1px solid var(--primary);
    position: absolute;
    left: 50%;
    top: 29px;
    transform: translateX(-50%);
    z-index: -1;
}

section.sub.checkup .unit.cancer-roadmap > div {
    width: 16%;
    display: flex;
    flex-direction: column;
    align-items: center;
}
section.sub.checkup .unit.cancer-roadmap > div > img {
    width: 60%;
}

section.sub.checkup .unit.cancer-roadmap > div > h5 {
    position: relative;
    font-size: 1.2em;
    margin-bottom: 0.5em;
}
section.sub.checkup .unit.cancer-roadmap > div > .label span {
    font-size: 0.8em;
    color: var(--secondary);
    background-color: var(--ivory);
    border-radius: 3em;
    padding: 0.5em 1em;
    text-align: center;
}
section.sub.checkup .unit.cancer-roadmap > div > h5:before {
    content: '';
    display: block;
    width: 10px;
    height: 10px;
    background-color: var(--secondary);
    border-radius: 50%;
    margin: 25px auto 15px;
}

section.sub.checkup .unit.cancer-roadmap > div > p {
    text-align: center;
    margin-top: 1em;
    font-size: 0.9em;
    line-height: 1.7;
}
/* 5대암 검진 설명카드 */
section.sub.checkup .unit.cancer-desc {
    max-width: var(--inner);
    width: 70vw;
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-gap: 25px;
}
section.sub.checkup .unit.cancer-desc > div {
    padding: 2em;
    background-color: var(--ivory);
    border-radius: 1em;
}
section.sub.checkup .unit.cancer-desc > div h4 {
    color: var(--primary);
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
    grid-gap: 0.5em;
    font-size: 1.4em;
    margin-bottom: 0.5em;
}
section.sub.checkup .unit.cancer-desc > div h4 span.symbol {
    display: block;
    width: 1.5em;
    aspect-ratio: 1 / 1;
    background-color: var(--tertiary);
    background-repeat: no-repeat;
    background-size: 60%;
    background-position: center;
    background-image: url(./img/symbol-fff.svg);
    border-radius: 50%;
    overflow: hidden;
}

section.sub.checkup .unit.cancer-desc > div h4 + p {
    font-size: 0.9em;
    padding: 0.5em;
}
section.sub.checkup .unit.cancer-desc > div hr { opacity: 0.3; margin: 1em 0}


section.sub.checkup .unit.cancer-desc > div ul {
    padding: 0.5em;
    display: grid;
    grid-template-columns: 4em auto;
    align-items: flex-start;
    grid-gap: 1em;
    font-size: 0.9em;
}
section.sub.checkup .unit.cancer-desc > div ul li.label {
    background-color: var(--primary);
    color: #fff;
    border-radius: 3em;
    text-align: center;
}
/* 검진과정 */
section.sub.checkup .unit.checkup-process {}
section.sub.checkup .unit.checkup-process > div {
    display: grid;
    grid-template-columns: 330px auto;
    align-items: stretch;
    border-radius: 2em;
    overflow: hidden;
}
section.sub.checkup .unit.checkup-process > div .img {
    height: 100%;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}
section.sub.checkup .unit.checkup-process > div .txt {
    padding: 2em;
}
section.sub.checkup .unit.checkup-process > div .txt * { color:#fff }
section.sub.checkup .unit.checkup-process > div .txt > span {
    background-color: #fff;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 2em;
    aspect-ratio: 1 / 1;
    border-radius: 50%;
    text-align: center;
    color: var(--tertiary);
    font-weight: 700;
    margin-bottom: 0.5em;
}
section.sub.checkup .unit.checkup-process > div .txt > h6 {
    margin-bottom: 0.5em;
    font-weight: 600;
}
section.sub.checkup .unit.checkup-process > div .txt p,
section.sub.checkup .unit.checkup-process > div .txt li {
    font-weight: 300;
    font-size: 0.96em;
}
section.sub .txt ul.dot li {
    display: grid;
    grid-template-columns: 1em auto;
}
section.sub .txt ul.dot li::before {
    content: '\00b7';
}
section.sub.checkup .unit.checkup-process > div + div {
    margin-top: 1em;
}





/* - - - - - 서브페이지 : 채용검진 (sub1-3.php) */
section.sub.checkup.job.intro { padding-bottom:90px }
section.sub.checkup.job.intro .inner { padding-bottom: 80px }
section.sub.checkup .unit.checkup-job table {
    margin: 0 auto;
    border-collapse: collapse;
}
section.sub.checkup .unit.checkup-job table tr > * {
    border: 1px solid #ddd;
    padding: 0.8em 2em;
    text-align: center;
}
section.sub.checkup .unit.checkup-job table tr > th {
    font-weight: 600;
}
section.sub.checkup .unit.checkup-job table thead tr > th { color:#fff; padding:1em }
section.sub.checkup .unit.checkup-job table tbody tr > th {
    background-color: #fafafa;
    color: var(--secondary);
    font-weight: 600;
    padding: 0.5em 3em;
}
section.sub.checkup .unit.checkup-table table tbody td {
    padding: 1em;
    font-size: 0.95em;
}
section.sub.checkup .unit.table-desc p {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    gap: 0.5em;
/*    color: var(--primary);*/
    font-weight: 500;
    font-size: 0.95em;
}
section.sub.checkup .unit.table-desc p::before {
    content: '';
    display: block;
    width: 1.75em;
    aspect-ratio: 1 / 1;
    background-color: var(--tertiary);
    border-radius: 50%;
    background-repeat: no-repeat;
    background-size: 60%;
    background-position: center;
    background-image: url('./img/symbol-fff.svg');
}
/**/
section.sub.checkup {}
section.sub.checkup .unit.prepare.numbering {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: stretch;
    gap: 1em;
}
section.sub.checkup .unit.prepare.numbering > div {
    padding: 3em 4em 3em 2em;
    height: 100%;
    border-radius: 1em;
    background-color: var(--ivory);
    display: grid;
    grid-template-columns: 4em auto;
}
section.sub.checkup .unit.prepare.numbering > div .before {
    display: flex;
    width: 3em;
    aspect-ratio: 1 / 1;
    text-align: center;
    justify-content: center;
    align-items: center;
    color: var(--tertiary);
    font-weight: 600;
    background-color: #fff;
    border-radius: 50%;
    margin-bottom: 1em;
}
section.sub.checkup .unit.prepare.numbering > div h5 {
    color: var(--primary);
    margin-bottom: 0.5em;
}

/* - - - - - 서브페이지 : 혈액종합검진 (sub1-4.php) */
section.sub .unit.checkup-target { width: fit-content;}
section.sub .unit.checkup-target div {
    display: grid;
    grid-template-columns: 2.5em auto;
    background-color: var(--ivory);
    padding: 0.7em 4em 0.7em 1em;
    border-radius: 3em;
    align-items: center;
}
section.sub.dark .unit.checkup-target div { background-color: #fff; }

section.sub .unit.checkup-target div + div { margin-top: 0.5em }

section.sub .unit.checkup-target div::before {
    content: '';
    width:1.5em;
    display: block;
    aspect-ratio: 1 / 1;
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    background-image: url('./img/check-target.svg');
}

section.sub .unit.checkup-target div p { color:var(--secondary); font-weight:600; font-size:1.1em }

/**/

section.sub .unit.checkup-caution {}
section.sub .unit.checkup-caution > div {
    background-color: #8A715D;
    padding: 2em 3em;
    border-radius: 1em;
}
section.sub .unit.checkup-caution > div + div { margin-top:1em }
section.sub .unit.checkup-caution > div * { color:#fff }
section.sub .unit.checkup-caution > div h5 {
    font-size: 1.2em;
    margin-bottom: 1em;
}
section.sub .unit.checkup-caution > div p {
    font-weight: 300;
}



/* - - - - - 서브페이지 : 골밀도검사 (sub1-5.php) */
section.sub.checkup.bmd.intro {
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    background-attachment: fixed;
}
section.sub.checkup.bmd.intro h3 { font-weight:600 }

section.sub.intro .unit.doctor-duo {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-gap: 50px;
    justify-content: center;
    width: 80%;
}
section.sub.intro .unit.doctor-duo * { color:#fff; text-align:center; }
section.sub.intro .unit.doctor-duo > div {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}
section.sub.intro .unit.doctor-duo h5.laurel {
    margin-top: 1.5em;
    width: 80%;
    position: relative;
    padding: 0.3em;
    font-weight: 600;
}
section.sub.intro .unit.doctor-duo h5.laurel::before,
section.sub.intro .unit.doctor-duo h5.laurel::after {
    content: '';
    aspect-ratio: 1 / 2;
    height: 100%;
    display: block;
    position: absolute;
    top: 0;
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
}
section.sub.intro .unit.doctor-duo h5.laurel::before {
    left: 0;
    background-image: url(./img/laurel-big-left.png);
}
section.sub.intro .unit.doctor-duo h5.laurel::after {
    background-image: url(./img/laurel-big-right.png);
    right: 0;
}
section.sub.intro .unit.doctor-duo p {
    font-size: 1.1em;
    font-weight: 300;
    line-height: 1.8;
    margin-top: 1em;
}
/**/
section.checkup.bmd .unit.bmd {}
section.checkup.bmd .unit.bmd > div {
    background-color: var(--primary);
    border-radius: 1em;
    overflow: hidden;
}
section.checkup.bmd .unit.bmd > div + div { margin-top:1em }
section.checkup.bmd .unit.bmd > div * { color:#fff }
section.checkup.bmd .unit.bmd > div h5 { margin-bottom:0.5em }

section.checkup.bmd .unit.bmd div.card-img {
    display: grid;
    grid-template-columns: 1fr 2fr;
    align-items: stretch;
}
section.checkup.bmd .unit.bmd div.card-img .img {
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
}

section.checkup.bmd .unit.bmd div.card-img .txt {
    padding: 3em;
}
section.checkup.bmd .unit.bmd div.card-tscore {
    padding: 3em;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    grid-gap: 1em;
}

/* - - - - - 서브페이지 : 보건증검사 (sub1-6.php) */
section.sub.special.gradient.healthcard {
    margin-top: 0;
    border-radius: 0;
    background: linear-gradient(180deg,#674123 10%, #625135 100%);
    padding-bottom: 80px;
}
section.sub.gradient.healthcard {}
section.sub.gradient.healthcard > div.bar h4 {
    color: #fff;
    font-weight: 400;
    padding: 1em;
}
section.sub.gradient.healthcard > div.bar h4 b {
    font-size: inherit;
    font-weight: 700;
}
section.sub.gradient.healthcard .unit.best-endoscope + .p-wrap {
    margin-top: 80px;
}
section.sub.gradient.healthcard .unit.best-endoscope + .p-wrap p {
    color: #fff;
    font-size: 1.1em;
    font-weight: 300;
}
section.sub.gradient.healthcard .unit.best-endoscope + .p-wrap b {
    font-size: 1.3em;
    font-weight: 700;
    color: #FFDEC4;
}




/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
    SUBPAGE : 02 내시경센터
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
/* - - - - - 서브페이지 : 위내시경 (sub2-1.php) */
section.sub.endoscopy.intro {
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    background-attachment: fixed;
}
section.sub.endoscopy.intro .inner { padding:150px 0 }
section.sub.endoscopy.intro h3 { font-weight:600 }
section.sub.intro.endoscopy .unit.doctor-duo {
    grid-template-columns: 1fr 1fr 1fr;
    width: 100%;
    gap: 30px;
    align-items: flex-start;
}
/**/
section.sub.sign {}
section.sub.sign .inner {
    display: grid;
    grid-template-columns: 1fr 1fr;
    justify-content: space-between;
    align-items: center;
}
section.sub.sign .inner .txt h4 { margin-bottom:1em }
section.sub.sign .inner .txt h4 + p {
    font-weight: 500;
    color: var(--secondary);
}
section.sub.sign .inner .txt ul {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1em;

}
section.sub.sign .inner .txt ul li {
    display: grid;
    grid-template-columns: 2em auto;
    font-weight: 500;
    color: var(--secondary);
}
section.sub.sign .inner .txt ul li::before {
    content: '';
    display: block;
    width: 1.5em;
    aspect-ratio: 1 / 1;
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
    background-image: url(./img/icon/section-title-caution.svg);
}
/**/
section.sub.special.gastro .unit.best-endoscope .txt { padding:4em }

/* - - - - - 서브페이지 : 대장내시경 (sub2-2.php) */
section.sub.endoscopy.intro .title-zone span.label {
    background-color: var(--primary);
    color: #fff;
    font-size: 0.5em;
    padding: 0.8em 2em;
    display: inline-block;
    line-height: 1.4;
    margin-top: 1em;
}
section.sub.sign.colon .inner { grid-template-columns: 1fr 1.3fr; }

/* - - - - - 서브페이지 : 수면내시경 (sub2-3.php) */
section.sub.sleep .unit.symbol-card {
    gap: 2em;
}
section.sub .unit.symbol-card > div {
    background-color: var(--primary);
    padding: 2.5em;
    border-radius: 1em;
}
section.sub .unit.symbol-card > div *  { color: #fff; }
section.sub .unit.symbol-card > div h5.symbol {
    display: grid;
    grid-template-columns: 1.8em auto;
    grid-gap: 0.5em;
    color: #fff;
    margin-bottom: 1em;
}
section.sub .unit.symbol-card > div h5.symbol::before {
    content: '';
    display: block;
    width: inherit;
    aspect-ratio: 1 / 1;
    border-radius: 50%;
    background-color: var(--tertiary);
    background-repeat: no-repeat;
    background-size: 60%;
    background-image: url('./img/symbol-fff.svg');
    background-position: center;
}

section.sub .unit.symbol-card > div ul.dot li {
    display: grid;
    grid-template-columns: 1em auto;
}
section.sub .unit.symbol-card > div ul.dot li::before{
    content: '\00b7';
}



/* - - - - - 서브페이지 : 당일용종절제술 (sub2-4.php) */
section.polypectomy.faq .answer ul.dot {
    width: fit-content;
    margin: 1em auto;
}
section.polypectomy.faq .answer ul.dot li {
    display: grid;
    grid-template-columns: 1em auto;
}
section.polypectomy.faq .answer ul.dot li::before {
    content: '\00b7';
}




/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
    SUBPAGE : 03 초음파센터
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
/* - - - - - 서브페이지 : 갑상선초음파 (sub3-1.php) */
section.sub.ultrasound.intro .unit.img.duo {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-gap: 2em;
}
section.sub.digestive .unit-wrap,
section.sub.ultrasound .unit-wrap {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    grid-gap: 50px;
    margin: 80px auto 0;
}
section.sub.digestive .unit-wrap > .unit,
section.sub.ultrasound .unit-wrap > .unit { margin:0 }
section.sub.digestive .unit-wrap .unit.img,
section.sub.ultrasound .unit-wrap .unit.img { width:460px }

section.sub.gradient .inner.wide.ultrasound { background-attachment:fixed; }
section.sub.gradient .inner.wide.ultrasound .title-zone .section-title + p {
    font-weight: 300;
    font-size: 1.3em;
}

section.sub.ultrasound.system {
    padding-bottom: 80px;
}
section.sub.ultrasound.system .inner.wide {
    padding: 100px 0 0;
}
section.sub.ultrasound.system .unit.img.trio {
    grid-gap: 1em;
}
section.sub.ultrasound.system .scrollText { height:3em }



/* - - - - - 서브페이지 : 경동맥초음파 (sub3-2.php) */
/* - - - - - 서브페이지 : 복부초음파 (sub3-3.php) */
section.sub.ultrasound .inner.pad-mod { padding:100px 0 }

/* - - - - - 서브페이지 : 유방·전립선초음파 (sub3-4.php) */
section.sub.ultrasound .unit.img.disease.duo {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 2em;
}
section.sub.sign.ultrasound.bp .inner .txt.grid.duo {
    display: grid;
    grid-template-columns: 1fr 1fr;
}
section.sub.sign.ultrasound.bp .inner .txt.grid.duo ul {
    display: grid;
    grid-template-columns: 1fr;
    gap: 1em;
}
section.sub.sign.ultrasound.bp .inner .txt.grid.duo h5 {
    font-size: 1.2em;
    color: var(--secondary);
    margin-bottom: 1em;
}
section.sub.ultrasound.bp .unit-wrap {
    gap: 100px;
}
section.sub.ultrasound.bp .unit-wrap h5.ul-title {
    display: grid;
    grid-template-columns: 2em auto;
    gap: 0.5em;
    align-items: center;
    font-size: 1.4em;
    color: var(--primary);
    margin-bottom: 1em;
    padding-left: 0.5em;
}
section.sub.ultrasound.bp .unit-wrap h5.ul-title::before {
    content: '';
    display: block;
    width: inherit;
    aspect-ratio: 1 / 1;
    background-color: var(--tertiary);
    background-repeat: no-repeat;
    background-position: center;
    background-size: 50%;
    background-image: url('./img/symbol-fff.svg');
    border-radius: 50%;
}


/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
    SUBPAGE : 04 소화기클리닉
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
/* - - - - - 서브페이지 : 역류성식도염 (sub4-1.php) */
/*section.sub.digestive.intro { border-bottom:1px solid #ddd }*/
section.sub.digestive.intro > .inner {
    padding: 100px 60px;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
}
section.sub.digestive.intro > .inner img { max-width:650px }

section.sub.digestive.intro > .inner .title-zone {
    padding: 50px 0;
}
section.sub.digestive.intro > .inner .title-zone .section-title { font-weight:500 }
section.sub.digestive.intro > .inner .title-zone .section-title span { font-weight:700 }
section.sub.digestive.intro > .inner .title-zone .p-wrap p {
    font-size: 1em;
}
section.sub.sign.gerd .inner { grid-template-columns:1fr 1.4fr }

/* - - - - - 서브페이지 : 위염 (sub4-2.php) */
section.sub.digestive.why {}
section.sub.digestive.why > .inner {
    padding: 120px 0;
}
section.sub ~ div.space { height:200px }

section.sub.digestive.why .title-zone .icon.search {
    display: flex;
    flex-direction: row;
}
section.sub.digestive.why .title-zone .icon.search::before {
    content: '';
    display: inline-block;
    width: 1em;
    height: 1em;
    transform: translateY(0.2em);
    background-repeat: no-repeat;
    background-size: 90%;
    background-position: center left;
    background-image: url(./img/title-icon-search-fff.svg);
}
section.sub.digestive.why .unit-wrap {
    width: 90%;
    display: grid;
    grid-template-columns: 1fr 1fr ;
}
section.sub.digestive.why .unit-wrap .img {
    width: inherit;
}
section.sub.digestive.why .unit-wrap .unit.symbol-card {
    display: grid;
    grid-template-columns: 1fr;
    gap: 1em;
}

section.sub.digestive.why .unit-wrap + .p-wrap {
}
section.sub.digestive.why .unit-wrap + .p-wrap p {
    margin-top: 3em;
    font-size: 1.2em;
    color: #fff;
    text-align: center;
    font-weight: 300;
}
section.sub.digestive.why .unit-wrap + .p-wrap p b {
    font-size: inherit;
    font-weight: 700;
}




/* - - - - - 서브페이지 : 과민성대장질환 (sub4-3.php) */
/* - - - - - 서브페이지 : 간질환 (sub4-4.php) */
/* - - - - - 서브페이지 : 위암 (sub4-5.php) */
/* - - - - - 서브페이지 : 대장암 (sub4-6.php) */


/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
    SUBPAGE : 05 호흡기알레르기클리닉
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
/* - - - - - 서브페이지 : 천식 (sub5-1.php) */
section.sub.why .unit-wrap.asthma {
    display: flex;
    flex-direction: row;
    width: 70%;
    position: relative;
    z-index: 2;
}
section.sub.why .unit-wrap.asthma .unit.img { width:inherit; }



/* - - - - - 서브페이지 : 알레르기비염 (sub5-2.php) */
/* - - - - - 서브페이지 : 만성기침 (sub5-3.php) */


/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
    SUBPAGE : 06 만성질환클리닉
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
/* - - - - - 서브페이지 : 고혈압 (sub6-1.php) */
section.sub table.hypertension {
    border-collapse: collapse;
    width: 100%;
}
section.sub table.hypertension tr > * {
    border: 1px solid #ddd;
    padding: 0.5em 1em;
    text-align: center;
}
section.sub table.hypertension th {
    font-weight: 600;
}
section.sub table.hypertension thead th {
    color: #fff;
    font-size: 1.2em;
    background-color: var(--primary);
}
/* - - - - - 서브페이지 : 당뇨 (sub6-2.php) */
/* - - - - - 서브페이지 : 고지혈증 (sub6-3.php) */
/* - - - - - 서브페이지 : 갑상선질환 (sub6-4.php) */


/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
    SUBPAGE : 07 건강클리닉
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
/* - - - - - 서브페이지 : 비만 (sub7-1.php) */
section.sub .unit.img-desc.wellness {
    background-repeat: no-repeat;
    background-position: right center;
    background-size: 13%;
    padding-right: 13%;
    background-image: url('./img/wellness-badge.png');

}

/* - - - - - 서브페이지 : 금연 (sub7-2.php) */
/* - - - - - 서브페이지 : 영양수액 (sub7-3.php) */
section.sub.iv div.unit.iv-trio {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    gap: 30px;
}
section.sub.iv div.unit.iv-trio > div {
    width: 22em;
    aspect-ratio: 1 / 1;
    border-radius: 30px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    background-color: #ccc;
    grid-gap: 1em;
    box-shadow: 0 10px 30px -8px rgba(0, 0, 0, 0);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    transition: all ease 0.5s;
}
section.sub.iv div.unit.iv-trio > div:hover {
    transform: translateY(-8px);
    box-shadow: 0 10px 30px -5px rgba(255, 213, 135, 1);
}
section.sub.iv div.unit.iv-trio > div * { color:#fff; text-align:center; }
section.sub.iv div.unit.iv-trio > div h5 {
    line-height: 1.3;
    font-size: 1.5em;
}
section.sub.iv div.unit.iv-trio > div p {
    padding: 0 3em;
}



/* - - - - - 서브페이지 : 국가예방접종 (sub7-4.php) */

















/* 260305 기타검진프로그램 추가 */
/* 탭 메뉴 전체 컨테이너 */
section.sub.sub-tab {}
section.sub.sub-tab .inner { padding:80px 0 }
.sibling-tabs {display: flex; flex-wrap: wrap; gap: 15px; justify-content:center; }
/* 기본 탭 스타일 */
.sibling-tabs li a {
    display: flex;
    justify-content: center;
    min-width: 9em;
    border-radius: 3em;
    padding: 0.5em;
    background-color: #F9F6F3;
    color: #674123;
    font-size: 1.2em;
    font-weight: 600;
}

/* 마우스 올렸을 때 */
.sibling-tabs li a:hover {}

/* 현재 활성화된 페이지 탭 */
.sibling-tabs li.active a {
    background-color: var(--primary);
    color: #fff;
    font-weight: 700;
}




/* 기타검진 하단 공통(repeat-chkecupgoto.php) */
section.sub.checkup.goto {}
section.sub.checkup.goto .inner { padding-top:0 }
section.sub.checkup.goto h3.section-title.flex {
    align-items: center;
    font-size: 1.5em;
    margin-bottom: 2em;
}
section.sub.checkup.goto .unit.links {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
}

section.sub.checkup.goto .unit.links > a {
    width: 450px;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    gap: 15px;
    transition: transform ease 0.4s;
}
section.sub.checkup.goto .unit.links > a:hover {
    transform: translateY(-10px);
}

section.sub.checkup.goto .unit.links > a img { width:80px }
section.sub.checkup.goto .unit.links > a + a {
    border-left: 1px solid #ddd;
}
section.sub.checkup.goto .unit.links > a p {
    font-size: 1.2em;
    line-height: 1.5;
    color: #3C1E1E;
}
section.sub.checkup.goto .unit.links > a p strong {
    display: block;
    font-size: 1.2em;
}