/* =========================================================
   GWANGJU HOSPITAL
   GUIDE DETAIL PREMIUM V3
========================================================= */

* {
    box-sizing:border-box;
}

.guide-premium {
    margin:0;
    background:#fff;
    color:#102e4f;
}

.gd-container {
    width:min(1180px,calc(100% - 48px));
    margin:0 auto;
}


/* =========================================================
   HERO
========================================================= */

.gd-hero {
    position:relative;

    min-height:345px;

    overflow:hidden;

    color:#fff;

    background:
        linear-gradient(
            110deg,
            #06264b 0%,
            #075da8 55%,
            #139ce8 100%
        );
}

.gd-hero::after {

    content:"";

    position:absolute;

    right:-100px;
    top:-180px;

    width:520px;
    height:520px;

    border-radius:50%;

    border:
        1px solid
        rgba(255,255,255,.12);
}

.gd-hero::before {

    content:"";

    position:absolute;

    right:100px;
    bottom:-320px;

    width:600px;
    height:600px;

    border-radius:50%;

    border:
        1px solid
        rgba(255,255,255,.08);
}

.gd-hero-inner {

    position:relative;
    z-index:2;

    min-height:345px;

    display:flex;

    align-items:center;
    justify-content:space-between;
}

.gd-breadcrumb {

    display:flex;

    align-items:center;

    gap:10px;

    margin-bottom:25px;

    color:
        rgba(255,255,255,.72);

    font-size:12px;
}

.gd-breadcrumb a {

    color:
        rgba(255,255,255,.72);

    text-decoration:none;
}

.gd-breadcrumb b {
    color:#fff;
}

.gd-hero-copy > small {

    display:block;

    color:#86d0ff;

    font-size:11px;

    font-weight:900;

    letter-spacing:.18em;
}

.gd-hero-copy h1 {

    margin:
        8px
        0
        17px;

    font-size:58px;

    line-height:1;

    letter-spacing:-.06em;
}

.gd-hero-copy p {

    margin:0;

    color:#d8edff;

    font-size:16px;

    line-height:1.8;
}


/* HERO MARK */

.gd-hero-symbol {

    position:relative;

    width:260px;
    height:160px;

    padding:32px;

    border:
        1px solid
        rgba(255,255,255,.13);

    border-radius:25px;

    background:
        rgba(255,255,255,.055);

    backdrop-filter:blur(12px);
}

.gd-hero-symbol span {

    display:block;

    color:#84ceff;

    font-size:11px;

    letter-spacing:.17em;
}

.gd-hero-symbol strong {

    display:block;

    margin-top:5px;

    font-size:25px;
}

.gd-hero-symbol i {

    position:absolute;

    right:25px;
    bottom:24px;

    width:56px;
    height:56px;

    border:
        10px solid
        rgba(255,255,255,.13);

    border-radius:50%;
}


/* =========================================================
   BODY
========================================================= */

.gd-body {

    padding:
        72px
        0
        110px;

    background:
        linear-gradient(
            180deg,
            #fff,
            #fbfdff
        );
}

.gd-layout {

    display:grid;

    grid-template-columns:
        230px
        minmax(0,1fr);

    gap:48px;

    align-items:start;
}


/* =========================================================
   SIDEBAR
========================================================= */

.gd-sidebar {

    position:sticky;

    top:95px;
}

.gd-side-menu {

    overflow:hidden;

    border:
        1px solid
        #dce7f0;

    border-radius:20px;

    background:#fff;

    box-shadow:
        0 15px 40px
        rgba(26,73,113,.05);
}

.gd-side-title {

    padding:
        27px
        25px;

    color:#fff;

    background:
        linear-gradient(
            135deg,
            #073967,
            #0a91e4
        );
}

.gd-side-title small {

    display:block;

    margin-bottom:5px;

    color:#8fd4ff;

    font-size:9px;

    font-weight:900;

    letter-spacing:.13em;
}

.gd-side-title strong {

    font-size:22px;
}

.gd-side-menu nav a {

    display:flex;

    align-items:center;
    justify-content:space-between;

    min-height:54px;

    padding:
        0
        20px;

    border-bottom:
        1px solid
        #e8eef3;

    color:#40566c;

    text-decoration:none;

    font-size:13px;

    font-weight:700;

    transition:.18s;
}

.gd-side-menu nav a:last-child {
    border-bottom:0;
}

.gd-side-menu nav a b {

    color:#9aabbb;

    font-size:21px;

    font-weight:400;
}

.gd-side-menu nav a:hover {

    padding-left:24px;

    color:#087bd5;

    background:#f5faff;
}

.gd-side-menu nav a.active {

    color:#087bd5;

    background:
        linear-gradient(
            90deg,
            #e9f6ff,
            #f7fcff
        );
}

.gd-side-menu nav a.active b {
    color:#087bd5;
}


/* PHONE */

.gd-phone-card {

    display:flex;

    align-items:center;

    gap:14px;

    margin-top:18px;

    padding:21px;

    border-radius:18px;

    background:
        #f3f8fc;

    color:inherit;

    text-decoration:none;
}

.gd-phone-icon {

    width:48px;
    height:48px;

    display:grid;

    place-items:center;

    flex:none;

    border-radius:50%;

    background:#087bd5;

    color:#fff;

    font-size:18px;
}

.gd-phone-card small {

    display:block;

    color:#71869a;

    font-size:10px;
}

.gd-phone-card strong {

    display:block;

    margin:
        2px
        0;

    color:#075fa9;

    font-size:18px;
}

.gd-phone-card p {

    margin:0;

    color:#8a9bad;

    font-size:9px;
}


/* =========================================================
   CONTENT HEAD
========================================================= */

.gd-content-head {

    margin-bottom:35px;
}

.gd-content-head > span {

    color:#1684e8;

    font-size:10px;

    font-weight:900;

    letter-spacing:.15em;
}

.gd-content-head h2 {

    margin:
        7px
        0
        10px;

    color:#102f50;

    font-size:38px;

    letter-spacing:-.055em;
}

.gd-content-head p {

    margin:0;

    color:#7a8da0;

    font-size:14px;
}


/* =========================================================
   FLOW
========================================================= */

.gd-flow {

    display:grid;

    grid-template-columns:
        repeat(5,1fr);

    margin-bottom:20px;

    padding:
        28px
        22px;

    border:
        1px solid
        #e1edf5;

    border-radius:20px;

    background:
        linear-gradient(
            120deg,
            #f4faff,
            #eef8ff
        );
}

.gd-flow article {

    position:relative;

    display:flex;

    align-items:flex-start;

    gap:12px;

    padding:
        0
        18px;

    border-right:
        1px solid
        #dbe9f3;
}

.gd-flow article:first-child {
    padding-left:0;
}

.gd-flow article:last-child {

    padding-right:0;

    border-right:0;
}

.gd-flow article > b {

    position:absolute;

    right:-7px;
    top:22px;

    color:#4aa8eb;

    font-size:18px;
}

.gd-flow-icon {

    width:47px;
    height:47px;

    display:grid;

    place-items:center;

    flex:none;

    border-radius:50%;

    color:#087bd5;

    background:#dff2ff;

    font-size:11px;

    font-weight:900;
}

.gd-flow small {

    color:#1684e8;

    font-size:8px;

    font-weight:900;

    letter-spacing:.08em;
}

.gd-flow h3 {

    margin:
        3px
        0
        5px;

    color:#173c5d;

    font-size:13px;
}

.gd-flow p {

    margin:0;

    color:#8093a5;

    font-size:10px;

    line-height:1.55;
}


/* =========================================================
   INFO GRID
========================================================= */

.gd-info-grid {

    display:grid;

    grid-template-columns:
        1fr
        1fr;

    gap:17px;
}

.gd-card {

    padding:27px;

    border:
        1px solid
        #e0ebf3;

    border-radius:20px;

    background:
        linear-gradient(
            145deg,
            #f8fcff,
            #f2f8fc
        );
}

.gd-card-title {

    display:flex;

    align-items:center;

    gap:10px;

    margin-bottom:20px;
}

.gd-card-title > span {

    width:30px;
    height:30px;

    display:grid;

    place-items:center;

    border-radius:50%;

    color:#087bd5;

    background:#e3f3ff;

    font-weight:900;
}

.gd-card-title h3 {

    margin:0;

    font-size:20px;

    letter-spacing:-.035em;
}


/* TIME */

.gd-time-table {

    overflow:hidden;

    border:
        1px solid
        #e0e9f0;

    border-radius:13px;

    background:#fff;
}

.gd-time-table > div {

    display:grid;

    grid-template-columns:
        120px
        1fr;

    min-height:50px;

    border-bottom:
        1px solid
        #e7edf2;
}

.gd-time-table > div:last-child {
    border-bottom:0;
}

.gd-time-table strong {

    display:flex;

    align-items:center;

    padding:
        0
        18px;

    background:#f9fbfd;

    color:#183b5b;

    font-size:12px;
}

.gd-time-table span {

    display:flex;

    align-items:center;

    padding:
        0
        18px;

    color:#123b63;

    font-size:14px;

    font-weight:800;
}


/* NOTICE */

.gd-notice {

    display:flex;

    gap:11px;

    margin-top:16px;

    padding:
        15px
        16px;

    border:
        1px solid
        #cfe8fa;

    border-radius:12px;

    background:#eaf7ff;
}

.gd-notice > span {

    width:20px;
    height:20px;

    display:grid;

    place-items:center;

    flex:none;

    border:
        2px solid
        #1684e8;

    border-radius:50%;

    color:#1684e8;

    font-size:11px;

    font-weight:900;
}

.gd-notice p {

    margin:0;

    color:#2871a9;

    font-size:10px;

    line-height:1.65;
}


/* =========================================================
   HELP
========================================================= */

.gd-question-list {

    overflow:hidden;

    border:
        1px solid
        #e0e9f0;

    border-radius:13px;

    background:#fff;
}

.gd-question-list button {

    width:100%;

    min-height:48px;

    display:flex;

    align-items:center;

    justify-content:space-between;

    padding:
        0
        16px;

    border:0;
    border-bottom:
        1px solid
        #e8eef3;

    background:#fff;

    color:#435a70;

    text-align:left;

    cursor:pointer;
}

.gd-question-list button:last-child {
    border-bottom:0;
}

.gd-question-list button:hover {
    background:#f8fcff;
}

.gd-question-list button b {

    color:#8ca2b5;

    font-size:20px;
}

.gd-help-actions {

    display:grid;

    grid-template-columns:
        1.15fr
        .85fr;

    gap:10px;

    margin-top:14px;
}

.gd-ai-button,
.gd-call-button {

    min-height:48px;

    display:flex;

    align-items:center;
    justify-content:center;

    gap:10px;

    border-radius:11px;

    font-size:11px;

    font-weight:900;

    text-decoration:none;
}

.gd-ai-button {

    border:0;

    color:#fff;

    background:
        linear-gradient(
            135deg,
            #087bd5,
            #0b9ae8
        );

    cursor:pointer;
}

.gd-call-button {

    border:
        1px solid
        #d9e5ee;

    background:#fff;

    color:#075fa9;
}

.gd-help-note {

    margin:
        10px
        0
        0;

    color:#8a9bad;

    font-size:9px;

    line-height:1.5;
}


/* =========================================================
   CLOSING
========================================================= */

.gd-closing {

    position:relative;

    min-height:150px;

    margin-top:18px;

    padding:
        30px
        36px;

    overflow:hidden;

    border:
        1px solid
        #d9e8f3;

    border-radius:20px;

    background:
        linear-gradient(
            105deg,
            #f3f9fd,
            #e6f3fc
        );
}

.gd-closing small {

    color:#6987a1;

    font-size:9px;

    font-weight:900;

    letter-spacing:.14em;
}

.gd-closing h3 {

    margin:
        7px
        0;

    color:#0c3863;

    font-size:22px;

    line-height:1.35;
}

.gd-closing p {

    margin:0;

    color:#7890a5;

    font-size:10px;
}


/* decorative medical rings */

.gd-closing-art {

    position:absolute;

    right:40px;
    top:20px;

    width:200px;
    height:120px;
}

.gd-closing-art span {

    position:absolute;

    border:
        10px solid
        rgba(20,132,220,.13);

    border-radius:50%;
}

.gd-closing-art span:nth-child(1) {

    width:110px;
    height:110px;

    right:0;
    top:0;
}

.gd-closing-art span:nth-child(2) {

    width:70px;
    height:70px;

    right:90px;
    top:45px;
}

.gd-closing-art span:nth-child(3) {

    width:32px;
    height:32px;

    right:150px;
    top:15px;

    background:#1684e8;

    border:0;

    opacity:.18;
}


/* =========================================================
   OTHER PAGES
========================================================= */

.gd-general-card {

    min-height:250px;

    display:grid;

    grid-template-columns:
        100px
        1fr;

    gap:25px;

    padding:36px;

    border:
        1px solid
        #dfebf3;

    border-radius:21px;

    background:
        linear-gradient(
            145deg,
            #f8fcff,
            #f2f8fc
        );
}

.gd-general-number {

    width:75px;
    height:75px;

    display:grid;

    place-items:center;

    border-radius:20px;

    background:#e4f4ff;

    color:#087bd5;

    font-size:10px;

    font-weight:900;
}

.gd-general-card small {

    color:#1684e8;

    font-size:9px;

    font-weight:900;

    letter-spacing:.13em;
}

.gd-general-card h3 {

    margin:
        7px
        0
        15px;

    font-size:24px;
}

.gd-general-card p {

    color:#718598;

    line-height:1.8;
}

.gd-simple-contact {

    margin-top:18px;

    padding:30px;

    display:flex;

    align-items:center;
    justify-content:space-between;

    gap:25px;

    border-radius:20px;

    background:#082f58;

    color:#fff;
}

.gd-simple-contact small {

    color:#7bcaff;

    font-size:9px;

    letter-spacing:.15em;
}

.gd-simple-contact h3 {

    margin:
        6px
        0;

    font-size:21px;
}

.gd-simple-contact p {

    margin:0;

    color:
        rgba(255,255,255,.62);

    font-size:10px;
}


/* =========================================================
   MOBILE
========================================================= */

@media(max-width:900px) {

    .gd-layout {
        grid-template-columns:1fr;
    }

    .gd-sidebar {
        position:static;
    }

    .gd-side-menu nav {

        display:flex;

        overflow-x:auto;
    }

    .gd-side-menu nav a {

        min-width:max-content;

        padding:
            0
            18px;

        border-right:
            1px solid
            #e8eef3;
    }

    .gd-phone-card {
        display:none;
    }

    .gd-flow {
        grid-template-columns:1fr;
    }

    .gd-flow article {

        padding:
            15px
            0;

        border-right:0;

        border-bottom:
            1px solid
            #dbe9f3;
    }

    .gd-flow article:last-child {
        border-bottom:0;
    }

    .gd-flow article > b {

        right:5px;
        top:35px;

        transform:rotate(90deg);
    }

    .gd-info-grid {
        grid-template-columns:1fr;
    }

}


@media(max-width:600px) {

    .gd-container {
        width:calc(100% - 30px);
    }

    .gd-hero,
    .gd-hero-inner {
        min-height:290px;
    }

    .gd-hero-copy h1 {
        font-size:43px;
    }

    .gd-hero-symbol {
        display:none;
    }

    .gd-body {
        padding-top:45px;
    }

    .gd-content-head h2 {
        font-size:31px;
    }

    .gd-side-title {
        padding:
            20px;
    }

    .gd-side-menu nav a {
        min-height:48px;
    }

    .gd-card {
        padding:20px;
    }

    .gd-time-table > div {
        grid-template-columns:
            95px
            1fr;
    }

    .gd-help-actions {
        grid-template-columns:1fr;
    }

    .gd-closing {
        padding:
            27px
            23px;
    }

    .gd-closing-art {
        opacity:.45;
        right:-50px;
    }

    .gd-general-card {
        grid-template-columns:1fr;
    }

    .gd-simple-contact {
        display:block;
    }

    .gd-simple-contact > div:last-child {
        margin-top:20px;
    }

}



/* =========================================================
   GUIDE CONTENT V4
   ORIGINAL GWANGJU HOSPITAL DATA
========================================================= */

.gd-original {

    margin-top:20px;

    overflow:hidden;

    border:
        1px solid
        #dfeaf2;

    border-radius:22px;

    background:#fff;

    box-shadow:
        0 18px 50px
        rgba(18,64,103,.045);
}


/* TOP */

.gd-original-top {

    display:flex;

    align-items:center;

    gap:18px;

    padding:
        28px
        30px;

    border-bottom:
        1px solid
        #e5edf3;

    background:
        linear-gradient(
            120deg,
            #f7fbfe,
            #edf7fe
        );
}


.gd-original-icon {

    width:58px;
    height:58px;

    display:grid;

    place-items:center;

    flex:none;

    border-radius:17px;

    color:#fff;

    background:
        linear-gradient(
            145deg,
            #087bd5,
            #13a1ea
        );

    box-shadow:
        0 10px 25px
        rgba(8,123,213,.18);

    font-size:18px;

    font-weight:900;
}


.gd-original-top small {

    display:block;

    margin-bottom:5px;

    color:#1684e8;

    font-size:9px;

    font-weight:900;

    letter-spacing:.14em;
}


.gd-original-top h3 {

    margin:0;

    color:#143755;

    font-size:22px;

    letter-spacing:-.035em;
}


.gd-original-top p {

    margin:
        5px
        0
        0;

    color:#8495a5;

    font-size:11px;
}


/* CONTENT */

.gd-original-content {

    padding:
        32px
        34px;
}


/* HEADING */

.gd-source-heading {

    position:relative;

    margin:
        40px
        0
        17px;

    padding-left:15px;

    color:#123c61;

    font-size:20px;

    letter-spacing:-.03em;
}


.gd-source-heading:first-child {
    margin-top:0;
}


.gd-source-heading::before {

    content:"";

    position:absolute;

    left:0;
    top:4px;

    width:4px;
    height:19px;

    border-radius:10px;

    background:#1684e8;
}


/* NORMAL SOURCE TEXT */

.gd-source-text {

    margin:
        0
        0
        12px;

    color:#586d80;

    font-size:13px;

    line-height:1.85;

    word-break:keep-all;
}


/* STEP */

.gd-source-step {

    display:grid;

    grid-template-columns:
        38px
        minmax(0,1fr);

    gap:13px;

    align-items:start;

    margin:
        10px
        0;

    padding:
        16px
        18px;

    border:
        1px solid
        #e2ebf2;

    border-radius:13px;

    background:#fafcfe;
}


.gd-source-step > span {

    width:30px;
    height:30px;

    display:grid;

    place-items:center;

    border-radius:9px;

    color:#087bd5;

    background:#e5f4ff;

    font-size:9px;

    font-weight:900;
}


.gd-source-step p {

    margin:4px 0 0;

    color:#425b71;

    font-size:12px;

    line-height:1.7;
}


/* PHONE */

.gd-source-phone {

    display:flex;

    align-items:center;

    gap:13px;

    margin:
        11px
        0;

    padding:
        15px
        18px;

    border:
        1px solid
        #cfe6f6;

    border-radius:13px;

    background:#eff9ff;
}


.gd-source-phone span {

    width:31px;
    height:31px;

    display:grid;

    place-items:center;

    border-radius:50%;

    color:#fff;

    background:#1684e8;

    font-size:12px;
}


.gd-source-phone p {

    margin:0;

    color:#17689f;

    font-size:12px;

    font-weight:750;

    line-height:1.65;
}


/* OUTPATIENT ORIGINAL */

.gd-original-outpatient {

    margin-top:18px;
}


/* EMPTY */

.gd-source-empty {

    padding:
        45px
        35px;

    border:
        1px solid
        #e1eaf1;

    border-radius:20px;

    background:#f7fafc;
}


.gd-source-empty > span {

    color:#1684e8;

    font-size:9px;

    font-weight:900;

    letter-spacing:.15em;
}


.gd-source-empty h3 {

    margin:
        7px
        0
        10px;

    color:#173a59;

    font-size:23px;
}


.gd-source-empty p {

    margin:0;

    color:#788a9b;

    line-height:1.7;
}


/* CONTACT ACTION */

.gd-simple-actions {

    display:flex;

    gap:9px;

    min-width:310px;
}


.gd-simple-actions > * {

    flex:1;
}


/* =========================================================
   FLOOR / PHONE LONG DATA
========================================================= */

.gd-original-content
.gd-source-text:nth-child(even) {

    border-radius:8px;
}


/* =========================================================
   MOBILE
========================================================= */

@media(max-width:700px) {

    .gd-original-top {

        padding:
            22px
            20px;
    }


    .gd-original-icon {

        width:48px;
        height:48px;

        border-radius:14px;
    }


    .gd-original-top h3 {

        font-size:19px;
    }


    .gd-original-content {

        padding:
            24px
            20px;
    }


    .gd-source-heading {

        margin-top:32px;

        font-size:18px;
    }


    .gd-source-step {

        grid-template-columns:
            32px
            minmax(0,1fr);

        padding:
            14px;
    }


    .gd-simple-actions {

        min-width:0;

        margin-top:18px;

        display:grid;

        grid-template-columns:1fr;
    }

}