@charset "UTF-8";
/*===========================================
Common
===========================================*/
/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */
html{line-height:1.15;-webkit-text-size-adjust:100%}body{margin:0}main{display:block}h1{font-size:2em;margin:.67em 0}hr{box-sizing:content-box;height:0;overflow:visible}pre{font-family:monospace,monospace;font-size:1em}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;text-decoration:underline dotted}b,strong{font-weight:700}code,kbd,samp{font-family:monospace,monospace;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0}button,input{overflow:visible}button,select{text-transform:none}[type=button],[type=reset],[type=submit],button{-webkit-appearance:button}[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner,button::-moz-focus-inner{border-style:none;padding:0}[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring,button:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:.35em .75em .625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal}progress{vertical-align:baseline}textarea{overflow:auto}[type=checkbox],[type=radio]{box-sizing:border-box;padding:0}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}details{display:block}summary{display:list-item}template{display:none}[hidden]{display:none}
/*--- (e)normalize.css v8.0.1 ---*/

:root{
    /*--doctor-primary:#FFDB00;*/
    --doctor-primary:#FCEA0D;
    --public-primary:#00a651;
    --common-black:#251e1c;
}

body{
    margin:0;
    color:#333;
    font-size:16px;
    line-height:1.75rem;
    font-family:'Roboto', 'Noto Sans TC', 'Helvetica', 'Helvetica Neue', Arial, sans-serif;
    text-shadow:0 .3px .3px rgba(0,0,0,.08);
    text-rendering:optimizeLegibility;
    -webkit-font-smoothing:antialiased;
    -moz-osx-font-smoothing:grayscale;
    image-rendering:-webkit-optimize-contrast;
    overflow-x:hidden;
    position:relative;
    background-color:var(--common-black);
    word-wrap:break-word;
    word-break:break-word;
}
body.is-fixed{
    position:fixed;
    width:100%;
}
@media screen and (max-width:360px){/* Xiaomi */
    body{
        font-size:15px;
    }
}

*{-webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box;}

hr{display:block; height:1px; border:0; border-top:1px solid #e3e3e3; margin:2em 0; padding:0;}

a{color:#09F; text-decoration:none;}
a:hover, a:active, a:focus{color:#0060ff;}
/* a:focus{outline:2px dashed blue;} */

/*-------------------------------------------
Wrapper
-------------------------------------------*/
.wrapper{
    width:1280px; min-width:1280px;
    height:100%; 
    margin:0 auto; 
    padding:0 40px;
    position:relative;
    /* box-shadow:inset 0 0 1px rgba(0,0,0,.9); */
}
@media screen and (max-width:1280px){
    .wrapper{
        width:100%; min-width:100%;
    }
}
@media screen and (max-width:1024px){
    .wrapper{
        padding:0 30px;
    }
}
@media screen and (max-width:992px){
    .wrapper{
        padding:0 20px;
    }
}
@media screen and (max-width:440px){/* i16 Pro Max */
    .wrapper{
        padding:0 15px;
    }
}

/*-------------------------------------------
Clearfix: contain floats
-------------------------------------------*/
.clearfix::after{content:""; display:table; clear:both;}
/* For IE 6/7 only */
.clearfix{*zoom: 1;}

/*-------------------------------------------
Header
-------------------------------------------*/
#header__container{
    position:relative; z-index:10;
    height:115px;
    background-color:#fff;
    /* box-shadow:0 1px 8px rgba(0,0,0,.2); */
}
    .heading__link{
        display:inline-block;
        position:absolute; left:40px; top:15px; z-index:2;
        width:352px; height:83px;
        background-image:url(../images/derma_logo_dr@2x.png?t=20200930);
        background-repeat:no-repeat;
        background-position:0 0;
        background-size:352px 83px;
        overflow:hidden;
    }
        .heading__tw{
            margin:0;
            opacity:0;
        }
@media screen and (max-width:1024px){
    #header__container{
        height:60px;
    }
        .heading__link{
            top:9px; left:30px;
            width:215px; height:42px;
            background-image:url(../images/derma_logo_dr_sp@2x.png?t=20200930);
            background-size:215px 42px;
        }
}
@media screen and (max-width:992px){
    .heading__link{
        left:20px;
    }
}
@media screen and (max-width:440px){/* i16 Pro Max */
    .heading__link{
        left:15px;
    }
}

/*-------------------------------------------
top links
-------------------------------------------*/
.top__links{
    position:absolute; top:40px; right:40px; z-index:2; 
    text-align:right;
}
    .top__list{
        list-style:none;
        margin:0;
        padding:0;
    }
        .top__item{
            float:left;
            margin-left:25px;
            font-size:.875rem; line-height:1;
            position:relative;
        }
            .top__item .btn,
            .top__item a{
                display:inline-block;
                color:#000;
                font-size:1rem;
                text-align:left;
                transition:.2s;
            }
            .top__item .btn{
                min-height:34px;
            }
            .top__item a:hover{
                color:#000;
                opacity:.65;
            }
            .top__item .separate{
                color:#ccc;
                margin:0 5px;
            }
            .top__item i{
                display:inline-block;
                vertical-align:middle;
                background-position:50% 50%;
                background-repeat:no-repeat;
                background-size:cover;
                width:34px;
                height:34px;
            }
            .top__item .lang__link i{
                background-image:url(/images/icon-language.svg);
                background-size:38px auto;
                margin-right:8px;
            }
            .top__item .fb__link i{
                background-image:url(/images/icon-social-facebook.svg);
                text-indent:-99999em;
            }
            .top__item .fb__link span{
                display:none;
            }
@media screen and (max-width:1024px){
    .top__links{
        display:none;
    }
}
@media screen and (max-width:992px){
    .top__links{
        right:20px;
    }
}

/*-------------------------------------------
Menu icon
-------------------------------------------*/
@media screen and (max-width:1024px){
    .toggle-menu{
        display:inline-block;
        width:50px;
        height:50px;
        line-height:50px;
        text-align:center;
        border-radius:50%;
        background-color:var(--doctor-primary);
        box-shadow:0 5px 10px rgba(0,0,0,.15);
        position:fixed; top:5px; z-index:200;
        padding:0;
        right:calc(env(safe-area-inset-right) + 30px);
        transition:.4s ease;
    }
    .toggle-menu.toggle-menu--active{
        background-color:var(--common-black);
    }
    .toggle-menu.toggle-menu--scroll{
        /* box-shadow:0 3px 8px rgba(0,0,0,.2); */
    }
        .toggle-menu::after{
            content:"";
            display:block;
            background-color:var(--doctor-primary);
            width:100%;
            height:100%;
            border-radius:50%;
            position:absolute; top:0; left:0;
            opacity:0;
            transition:.3s;
            pointer-events:none;
        }
        .toggle-menu.toggle-menu--scroll::after{
            transform:scale(2);
            opacity:.98;
        }
        .icon-menu{
            display:block;
            width:100%;
            height:100%;
            margin:0 auto;
            position:relative; z-index:2;
            transform:rotate(0deg);
            transition:.4s ease;
            cursor:pointer;
        }
        .toggle-menu--scroll .icon-menu{
            /* width:60%; */
        }
            .icon-menu span{
                display:block;
                position:absolute; left:25%;
                height:3px;
                width:50%;
                margin:-2px auto 0;
                background-color:var(--common-black);
                border-radius:30px;
                opacity:1;
                transform:rotate(0deg);
                transition:.25s ease-in-out;
            }
            .icon-menu span:nth-child(1){top:35%;}
            .icon-menu span:nth-child(2){top:50%;}
            .icon-menu span:nth-child(3){top:65%;}

        .toggle-menu--active .icon-menu span{
            transition-delay:0s;-webkit-transition-delay:0s;
            background-color:#fff;
        }
        .toggle-menu--active .icon-menu span:nth-child(1){
            top:50%;
            -webkit-transform:rotate(-45deg);-moz-transform:rotate(-45deg);-o-transform:rotate(-45deg);transform:rotate(-45deg);
        }
        .toggle-menu--active .icon-menu span:nth-child(2){
            opacity:0;
        }
        .toggle-menu--active .icon-menu span:nth-child(3){
            top:50%;
            -webkit-transform:rotate(45deg);-moz-transform:rotate(45deg);-o-transform:rotate(45deg);transform:rotate(45deg);
        }
}
@media screen and (max-width:992px){
    .toggle-menu{
        right:calc(env(safe-area-inset-right) + 15px);
    }
}
@media screen and (max-width:320px){/* i5 */
    .toggle-menu{
        right:calc(env(safe-area-inset-right) + 10px);
    }
}

/*-------------------------------------------
Menu Container
-------------------------------------------*/
.menu__container{
    background-color:var(--doctor-primary);
    box-shadow:0 5px 10px rgba(0,0,0,.1);
    position:relative; bottom:0; left:0; z-index:10;
    width:100%;
}
    .menu__inner{
        padding:0;
    }

@media screen and (max-width:1024px){
    .menu__container{
        /* display:none; */
        position:fixed; top:0; left:0;
        z-index:0;
        opacity:0;
        width:100%;
        height:100%;
        overflow:visible;
        background-color:var(--doctor-primary);
        pointer-events:none;
        transform-origin:left top;
        transform:skewX(-10deg) translateX(-100%);
        transition:.5s ease;
    }
    .menu__container.menu--active{
        display:block;
        opacity:1;
        z-index:100;
        /* width:100%; */
        pointer-events:auto;
        transform:skewX(0deg) translateX(0%);
    }
        .menu__inner{
            position:relative; left:0; top:0;
            width:100%;
            height:100%;
            overflow-x:hidden;
            overflow-y:auto;
            padding:60px 0;
        }
            .menu__inner::before{
                content:"";
                display:inline-block;
                width:215px; height:42px;
                background-image:url(../images/derma_logo_dr_sp@2x.png?t=20200930);
                background-size:215px 42px;
                background-repeat:no-repeat;
                background-position:0 0;
                overflow:hidden;
                position:absolute; top:9px; left:30px; z-index:1;
            }
}
@media screen and (max-width:992px){
    .menu__inner::before{
        left:20px;
    }
}
/*-------------------------------------------
Menu
-------------------------------------------*/
.menu__header{
    display:none;
}
.menu{
    list-style:none;
    margin:0 auto;
    padding:0;
    display:flex;
    /* flex-wrap:wrap; */
}
    .menu__item{
        flex-basis:0;
        flex-grow:1;
        flex:1 0 auto;
        width:auto;
        position:relative;
        text-align:center;
    }
        .menu__link{
            display:block;
            position:relative;
            color:#000;
            font-size:1rem; font-weight:400;
            line-height:50px;
            transition:.2s;
        }
        .menu__link:hover,
        .menu__link:focus{
            color:#fff;
            background-color:var(--common-black);
        }
        .menu__copyright{
        display:none;
        }
@media screen and (max-width:1024px){
    .menu__header{
        display:block;
        list-style:none;
        margin:0 auto;
        padding:0 30px;
        display:flex;
        flex-wrap:wrap;
        color:#000;
    }
        .menu__header__item{
            flex:1 0 auto;
            width:auto;
            text-align:center;
            padding:15px 0;
        }
            .menu__header__item .btn,
            .menu__header__item a{
                display:inline-block;
                color:#000;
                font-size:.875rem; line-height:32px;
                text-align:left;
                transition:.2s;
            }
            .menu__header__item a:hover{
                color:#000;
                opacity:.65;
            }
                .menu__header__item i{
                    display:inline-block;
                    vertical-align:middle;
                    background-position:50% 50%;
                    background-repeat:no-repeat;
                    background-size:cover;
                    width:32px;
                    height:32px;
                }
                .menu__header__item .lang__link i{
                    background-image:url(../images/icon-language.svg);
                    background-size:38px 38px;
                    margin-right:8px;
                }
                .menu__header__item .fb__link i{
                    background-image:url(../images/icon-social-facebook-black.svg);
                    text-indent:-99999em;
                }
                .menu__header__item .fb__link span{
                    display:none;
                }
    .menu{
        padding:20px 30px 0;
        flex-wrap:wrap;
    }
        .menu__item{
            flex:1 0 100%;
            width:100%;
            text-align:left;
            border-bottom:1px solid rgba(0,0,0,.1);
        }
            .menu__link{
                padding:0 20px;
            }
            .have-sub-menu .menu__link::after{
                content:"";
                display:inline-block;
                background-image:url(../images/icon-arrow-next-white.svg);
                background-repeat:no-repeat;
                background-size:contain;
                background-position:50% 50%;
                width:24px;
                height:24px;
                position:absolute; right:8px; top:50%;
                transform:translateY(-50%) rotate(90deg);
                transition:.2s;
            }
            .have-sub-menu .menu__link.menu__link--active::after{
                transform:translateY(-50%) rotate(-90deg);
            }
}
@media screen and (max-width:992px){
    .menu__header,
    .menu{
        padding-left:20px; padding-right:20px;
    }
}
@media screen and (max-width:440px){/* i16 Pro Max */
    .menu__header__item a{
        font-size:.875rem;
    }
        .menu__header__item i{
            width:24px;
            height:24px;
        }
        .menu__header__item .dr__link i,
        .menu__header__item .lang__link i{
            background-size:28px 28px;
        }
    .menu__link{
        font-size:4.75vw; line-height:48px;
        padding:0 15px;
    }
}
@media screen and (max-width:320px){/* i5 */
    .menu__header,
    .menu{
        padding-left:15px; padding-right:15px;
    }
        .menu__header__item a{
            font-size:.75rem;
        }
}

/*-------------------------------------------
Sub Menu
-------------------------------------------*/
.sub-menu{
    list-style:none;
    margin:0;
    padding:0;
    background-color:var(--doctor-primary);
    position:absolute; top:90%; left:0;
    width:auto;
    min-width:100%;
    box-shadow:0 5px 12px rgba(0,0,0,.2);
    opacity:0;
    pointer-events:none;
    transition:.3s;
}
.menu__item:hover .sub-menu{
    opacity:1;
    top:100%;
    pointer-events:auto;
}
    .sub-menu__item{
        text-align:left;
        box-shadow:0 1px 0 rgba(0,0,0,.15);
        position:relative;
    }
    .sub-menu__item:last-of-type{
        box-shadow:none;
    }
        .sub-menu__link{
            display:block;
            background-position:18px 50%;
            background-repeat:no-repeat;
            background-size:20px auto;
            color:#000;
            line-height:1.2;
            padding:10px 18px;
            position:relative;
            transition:.2s;
        }
        .sub-menu__link:hover,
        .sub-menu__link:focus{
            color:#fff;
            background-color:var(--common-black);
        }
            .sub-menu__link[target*='_blank']::after{
                content:"";
                display:inline-block;
                vertical-align:-3px;
                background:url(/images/icon-open-new.svg) no-repeat 50% 50%;
                background-size:cover;
                width:16px;
                height:16px;
                margin-left:5px;
            }
            .sub-menu__link[target*='_blank']:focus::after,
            .sub-menu__link[target*='_blank']:hover::after{
                background-image:url(/images/icon-open-new-white.svg);
            }
            .have-third-menu .sub-menu__link::after{
                content:"";
                display:inline-block;
                background-image:url(/images/icon-menu-arrow.svg);
                background-repeat:no-repeat;
                background-position:50% 50%;
                background-size:contain;
                width:18px;
                height:18px;
                position:absolute; top:50%; right:0; z-index:1;
                transform:rotate(-90deg) translateX(50%);
                pointer-events:none;
            }
            .menu__item:last-of-type .have-third-menu .sub-menu__link::after{
                left:0; right:auto;
                transform:rotate(90deg) translateX(-50%);
            }
@media screen and (max-width:1280px){/* Air Mac */
    .menu__item:nth-last-child(-n+4) .sub-menu{
        left:auto; right:0;
    }
}
@media screen and (max-width:1024px){
    .sub-menu{
        position:static;
        transform:translateX(0%);
        opacity:1;
        padding:0 0 10px;
        pointer-events:auto;
        box-shadow:none;
        transition:none;
        display:none;
    }
        .sub-menu__item{
            box-shadow:none;
            display:inline-block;
            vertical-align:top;
            width:32.5%;
            padding:0 20px;
            text-align:left;
        }
        .sub-menu__item.have-third-menu{
            display:block;
            width:100%;
        }
            .sub-menu{
                padding-top:5px;
            }
            .sub-menu__link{
                display:inline-block;
                font-size:1rem; 
                position:relative;
                padding:12px 0 9px 15px;
            }
            .have-third-menu .sub-menu__link{
                /* padding-right:24px; */
                padding-right:0;
            }
            .sub-menu__link--active,
            .sub-menu__link:hover,
            .sub-menu__link:focus{
                opacity:1;
                background-color:transparent;
            }
            .sub-menu__link.login__link,
            .sub-menu__link.logout__link,
            .sub-menu__link.passport__link{
                border-radius:30px;
                padding-right:20px;
            }
            .sub-menu__link.login__link:hover,
            .sub-menu__link.logout__link:hover,
            .sub-menu__link.passport__link:hover{
                background-color:var(--common-black);
                color:var(--doctor-primary:#ffd942);
            }
                .sub-menu__link::before{
                    content:"";
                    display:inline-block;
                    width:8px;
                    border-bottom:2px solid var(--common-black);
                    position:absolute; top:18px; left:2px;
                }
                .have-third-menu .sub-menu__link::after{
                    width:22px;
                    height:22px;
                    background-size:cover;
                    right:auto;
                    transform:translateY(-50%);
                    margin:0 0 0 5px;
                    opacity:.6;
                    transition:.3s;
                    display:none;
                }
                .have-third-menu .sub-menu__link.sub-menu__link--active::after{
                    transform:translateY(-50%) rotate(-180deg);
                }
                .menu__item:last-of-type .have-third-menu .sub-menu__link::after{
                    left:auto; right:auto;
                    transform:translateY(-50%) rotate(0deg);
                }
                .menu__item:last-of-type .have-third-menu .sub-menu__link.sub-menu__link--active::after{
                    transform:translateY(-50%) rotate(-180deg);
                }
}
@media screen and (max-width:440px){/* i16 Pro Max */
    .sub-menu__item{
        padding-left:15px; padding-right:0;
        vertical-align:top;
    }
        .sub-menu__link{
            font-size:4.875vw;
        }
}
/*-------------------------------------------
Third Menu
-------------------------------------------*/
.third-menu{
    background-color:var(--doctor-primary);
    list-style:none;
    margin:0 0 0 -5px;
    padding:0;
    position:absolute; top:0; left:100%;
    overflow:hidden;
    box-shadow:0 5px 12px rgba(0,0,0,.2);
    opacity:0;
    pointer-events:none;
    transition:.3s;
}
.menu__item:last-of-type .third-menu{
    left:auto; right:100%;
    margin:0 -5px 0 0;
}
.sub-menu__item:hover .third-menu{
    margin:0;
    opacity:1;
    pointer-events:auto;
}
    .third-menu li{
        box-shadow:0 1px 0 rgba(0,0,0,.15);
    }
    .third-menu li:last-of-type{
        box-shadow:none;
    }
        .third-menu a{
            display:block;
            color:#000;
            line-height:1.2;
            white-space:nowrap;
            padding:12px 10px;
            transition:.2s;
        }
        .third-menu a:hover,
        .third-menu a:focus{
            color:#fff;
            background-color:var(--common-black);
        }
            .third-menu a::after{
                display:inline-block;
                content:"";
                background-position:50% 50%;
                background-repeat:no-repeat;
                background-size:cover;
                width:16px;
                height:16px;
                vertical-align:-2px;
                margin-left:8px;
            }
            .third-menu a[href*=".pdf"]::after{
                background-image:url(/images/icon_pdf@2x.png)
            }
@media screen and (max-width:1024px){
    .third-menu,
    .menu__item:last-of-type .third-menu,
    .sub-menu__item:hover .third-menu{
        /* display:none; */
        border-radius:0;
        position:static;
        transform:translateX(0%);
        border-left:1px solid rgba(0,0,0,.2);
        /* border-bottom:1px solid rgba(0,0,0,.2); */
        margin:0 0 0 20px;
        opacity:1;
        pointer-events:auto;
        box-shadow:none;
        transition:none;        
    }
        .third-menu li{
            background-color:transparent;
            box-shadow:none;
        }
            .third-menu a{
                overflow:hidden;
                text-overflow:ellipsis;
            }
            .third-menu a:hover,
            .third-menu a:focus{
                background-color:transparent;
            }
}
@media screen and (max-width:440px){/* i16 Pro Max */
    .third-menu a{
        font-size:4.25vw;
    }
}

/*-------------------------------------------
Fourth Menu
-------------------------------------------*/
.fourth-menu{
    list-style:none;
    padding:0;
}
    .fourth-menu li{
        position:relative;
    }
        .fourth-menu a{
            padding-left:30px;
        }
            .fourth-menu a:after{
                background:url(/images/icon-menu-arrow.svg) no-repeat 50% 50%;
                background-size:cover;
                width:16px;
                height:16px;
                position:absolute; top:50%; left:0; z-index:1;
                transform:rotate(-90deg) translateX(50%);
                pointer-events:none;
            }
            .fourth-menu a:focus:after,
            .fourth-menu a:hover:after{
                background-image:url(/images/icon-menu-arrow-white.svg);
            }
@media screen and (max-width:1024px){
    .fourth-menu li{
        box-shadow:none;
    }
}

/*-------------------------------------------
Page Header
-------------------------------------------*/
.page__header{
    background-color:var(--common-black);
    position:relative;
    display:flex;
    align-items:center;
    padding:80px 20px;
    overflow:hidden;
}
    .page__header::before{
        content:"";
        display:block;
        background-image:url(../images/dr/page_header_bg.jpg);
        background-position:50% 50%;
        background-repeat:no-repeat;
        background-size:cover;
        position:absolute; top:0; left:0; z-index:1;
        width:100%;
        height:100%;
        opacity:.7;
        pointer-events:none;
    }
    .page__header__title{
        margin:auto;
        color:#fff;
        font-size:3rem; line-height:1.3; font-weight:700;
        text-align:center;
        position:relative; z-index:2;
    }
        .page__header__title small{
            display:block;
            font-size:1rem; font-weight:400;
            opacity:.65;
            margin-top:10px;
        }
    .page__header::after{
        content:"";
        display:block;
        background-color:transparent;
        background-position:50% 50%;
        background-repeat:no-repeat;
        background-size:cover;
        position:absolute; top:0; left:0; z-index:0;
        width:100%;
        height:100%;
        filter:grayscale(1);
        pointer-events:none;
    }
@media screen and (max-width:1024px){
    .page__header{
        padding:60px 20px;
    }
}
@media screen and (max-width:992px){
    .page__header{
        padding:40px 20px;
    }
}
@media screen and (max-width:768px) and (orientation:portrait){/* portrait */
    .page__header{
        padding-top:40px; padding-bottom:40px;
    }
}
@media screen and (max-width:440px){/* i16 Pro Max */
    .page__header__title{
        font-size:9.5vw;
    }
    .page__header__title::after{
        background-size:110%;
        width:240px;
        height:240px;
        top:-10px; left:100%;
    }
}

/*-------------------------------------------
Container
-------------------------------------------*/
#content__container{
    background-color:#fff;
    height:auto!important; min-height:550px;
    position:relative; z-index:0;
    /* iOS 11.0 */
    padding-right:constant(safe-area-inset-right);
    padding-left:constant(safe-area-inset-left);
    /* iOS 11.2 */
    padding-right:env(safe-area-inset-right);
    padding-left:env(safe-area-inset-left);
}
    .article__content{
        padding-top:50px; padding-bottom:70px;
        position:relative;
    }
@media screen and (max-width:375px){/* i6,i7,i8,iX */
    #content__container{
        min-height:450px;
    }
}
@media screen and (max-width:320px){/* i5 */
    #content__container{
        min-height:350px;
    }
}

/*-------------------------------------------
Bread Crumbs
-------------------------------------------*/
.breadcrumbs{
    background-color:rgba(0,0,0,.03);
    color:#aaa;
    font-size:.75rem; line-height:1.2;
    padding:1.25em 0;
}
    .breadcrumbs ul{
        list-style:none;
        margin:0;
        padding:0;
    }
        .breadcrumbs li{
            display:inline-block;
            margin:3px 0;
            position:relative;
        }
        .breadcrumbs li:nth-child(n+2)::before{
            content:"";
            display:inline-block;
            border-bottom:2px solid #999;
            width:4px;
            margin:0 8px 0 6px;
            vertical-align:3px;
        }
        .breadcrumbs li:last-child{
            background-image:none;
            padding-right:0;
        }
            .breadcrumbs a{
                color:#333;
                transition:.2s;
            }
            .breadcrumbs a:hover{
                color:#000;
                text-decoration:underline;
            }
@media screen and (max-width:992px){
    .breadcrumbs li:nth-child(n+2)::before{
        margin:0 7px 0 5px;
    }
}
@media screen and (max-width:576px){
    .breadcrumbs{
        padding:1em 0;
    }
}

/*-------------------------------------------
Side Menu
-------------------------------------------*/
#side-menu{
    float:left;
    width:220px;
    position:sticky; top:50px;
}
    .side-menu__title{
        margin:0;
        color:#000;
        font-size:1.875rem; line-height:1.3; font-weight:normal;
        padding:0 0 20px;
        position:relative; z-index:1;
    }
    .side-menu__list__wrap{
        background-color:var(--doctor-primary);
        overflow:hidden;
    }
        .side-menu__list{
            margin:0; 
            padding:0; 
            list-style:none;
            position:relative; z-index:2;
        }
            .side-menu__item{
                position:relative;
                border-bottom:1px solid rgba(0,0,0,.15);
            }
            .side-menu__item:last-child{
                border-bottom:none;
            }
                .side-menu__link{
                    display:block;
                    background-repeat:no-repeat;
                    background-size:18px auto;
                    background-position:20px 50%;
                    color:#000;
                    line-height:1.3;
                    padding:1em 20px;
                    transition:.2s;
                }
                .side-menu__link:hover{
                    background-color:var(--common-black);
                    color:#fff;
                }
                .current-item .side-menu__link,
                .current-item .side-menu__link:hover{
                    background-color:transparent;
                    color:#000;
                    opacity:.65;
                    cursor:default;
                }
                    .side-menu__link[target*='_blank']::after{
                        content:"";
                        display:inline-block;
                        vertical-align:-3px;
                        background:url(/images/icon-open-new.svg) no-repeat 50% 50%;
                        background-size:cover;
                        width:16px;
                        height:16px;
                        margin-left:5px;
                    }
                    .side-menu__link[target*='_blank']:focus::after,
                    .side-menu__link[target*='_blank']:hover::after{
                        background-image:url(/images/icon-open-new-white.svg)
                    }
@media screen and (max-width:1024px){
    #side-menu{
        float:none;
        width:calc(100% + 60px);
        margin:-50px -30px 0;
        position:relative; top:0; left:0; right:0;
    }
        .side-menu__title{
            display:none;
        }
        .side-menu__list__wrap{
            border-radius:0 !important;
            position:relative;
            overflow:initial;
        }
            .side-menu__list__wrap.have-arrow::before,
            .side-menu__list__wrap.have-arrow::after{
                content:"";
                display:inline-block;
                background-position:50% 90%;
                background-repeat:no-repeat;
                background-size:100% auto;
                background-color:rgba(255,255,255,.1);
                /* backdrop-filter: blur(2px); */
                /* -webkit-backdrop-filter: blur(2px); */
                position:absolute; bottom:-20px; z-index:3;
                width:16px;
                height:16px;
                pointer-events:none;
                opacity:.6;
            }
            .side-menu__list__wrap.have-arrow::before{
                background-image:url(/images/icon-arrow-left.svg);
                left:0;
            }
            .side-menu__list__wrap.have-arrow::after{
                background-image:url(/images/icon-arrow-right.svg);
                right:0;
            }
            .side-menu__list{
                display:flex;
                white-space:nowrap;
                overflow-x:auto;
                overflow-y:hidden;
                padding:0 15px;
            }
                .side-menu__item{
                    display:inline-block;
                    position:relative;
                    border-bottom:none;
                }
                    .side-menu__item:nth-of-type(n+2)::before{
                        content:"";
                        display:inline-block;
                        border-left:1px solid rgba(0,0,0,.15);
                        position:absolute; top:5%; left:-1px; bottom:5%;
                    }
                    .side-menu__link{
                        line-height:50px;
                        padding:0 1em;
                    }
                    .side-menu__link:focus,
                    .side-menu__link:hover{
                        background-color:transparent;
                        color:#000;
                    }
                        .side-menu__link[href*="void(0)"]::after{
                            content:"";
                            display:inline-block;
                            vertical-align:-3px;
                            background:url(../images/icon-menu-arrow.svg) no-repeat 50% 50%;
                            background-size:contain;
                            width:16px;
                            height:16px;
                        }
                        .side-menu__link[href*="void(0)"].active::after{
                            transform:rotate(-180deg);
                            opacity:.6;
                        }
}
@media screen and (max-width:992px){
    #side-menu{
        width:calc(100% + 40px);
        margin-left:-20px; margin-right:-20px;
    }
}
@media screen and (max-width:576px){
    .side-menu__link{
        font-size:.875rem;
    }
}
@media screen and (max-width:440px){/* i16 Pro Max */
    #side-menu{
        width:calc(100% + 30px);
        margin-left:-15px; margin-right:-15px;
    }
        .side-menu__link{
            line-height:1;
            padding:12px 8px;
        }
}

/*-------------------------------------------
Side Menu lv3
-------------------------------------------*/
.side-menu__item ul{
    list-style:none;
    margin:0;
    padding:0 0 10px;
}
    .side-menu__item ul li{
        position:relative;
    }
        .side-menu__item ul li a{
            display:block;
            color:#000;
            font-size:.875rem; line-height:1.3;
            opacity:.8;
            padding:.5em 10px .5em 2.5em;
            position:relative;
            transition:.2s;
        }
        .side-menu__item ul li a:hover{
            background-color:var(--common-black);
            color:#fff;
        }
        .side-menu__item ul li.current-item a,
        .side-menu__item ul li.current-item a:hover{
            background-color:transparent;
            opacity:.65;
            cursor:default;
        }
            .side-menu__item ul li a::before{
                content:"";
                display:inline-block;
                background-image:url(../images/icon-menu-arrow.svg);
                background-repeat:no-repeat;
                background-position:50% 50%;
                background-size:cover;
                transform:rotate(-90deg);
                width:18px;
                height:18px;
                position:absolute; top:.5em; left:1em;
            }
@media screen and (max-width:1024px){
    .side-menu__item ul{
        display:none;
        background-color:rgba(255,255,255,.5);
        padding-bottom:0;
    }
    .side-menu__item .side-menu__link.active + ul{
        display:block;
    }
        .side-menu__item ul li a{
            line-height:1;
            padding:10px 10px 10px 2.5em;
        }
}

/*-------------------------------------------
Contents
-------------------------------------------*/
#contents{
    margin-left:280px;
}
#contents.no-side{
    margin-left:0;
}
    .article__header{
        border-bottom:3px solid var(--doctor-primary);
        margin-bottom:30px;
        padding-bottom:20px;
        position:relative;
    }
        .article__title{
            margin:0;
            color:#000;
            font-size:1.75rem; line-height:1.3; font-weight:700;
        }
        .article__header__buttons{
            position:absolute; right:0; top:0;
        }
@media screen and (max-width:1024px){
    #contents{
        margin-top:40px; margin-left:0;
    }
    #contents.no-side{
        margin-top:-15px;
    }
}
@media screen and (max-width:576px){
    .article__header__buttons{
        position:static;
        margin-top:10px; margin-bottom:-10px;
        text-align:center;
    }
}
@media screen and (max-width:440px){/* i16 Pro Max */
    .article__header{
        padding-bottom:20px;
    }
        .article__title{
            font-size:6vw;
        }
}
@media screen and (max-width:320px){/* i5 */
    .article__header{
        padding-bottom:10px;
    }
}

/*-------------------------------------------
Tab
-------------------------------------------*/
.tabs__buttons{
    white-space:nowrap;
    position:absolute; top:5px; right:0;
}
    .tabs__list{
        display:inline-block;
        list-style:none;
        margin:0;
        padding:0;
    }
        .tabs__list li{
            display:inline-block;
            vertical-align:top;
            position:relative;
            transition:.2s;
        }
        .tabs__list li:nth-child(n+2){
            border-left:1px solid #ddd;
        }
            .tabs__list li a{
                display:block;
                color:#666;
                line-height:1.3;
                padding:5px 25px;
                transition:.2s;
            }
            .tabs__list li a:hover,
            .tabs__list li.is-current a{
                color:#000;
            }
            .tabs__list li.is-current a{
                font-weight:700;
            }
@media screen and (max-width:1024px){
    .tabs__list li a{
        padding-left:20px; padding-right:20px;
    }
}
@media screen and (max-width:576px){
    .tabs__buttons{
        margin-top:-10px;
        position:static;
        padding-bottom:30px;
        overflow-x:auto;
        overflow-y:hidden;
        text-align:center;
    }
        .tabs__list{
            border-bottom:2px solid #f1f1f1;
        }
            .tabs__list li{
                border-bottom:2px solid transparent;
                top:2px;
            }
            .tabs__list li:nth-child(n+2){
                border-left:none;
            }
            .tabs__list li:hover,
            .tabs__list li.is-current{
                border-color:var(--doctor-primary);
            }
                .tabs__list li a{
                    padding:10px 15px;
                }
}
@media screen and (max-width:440px){/* i16 Pro Max */
    .tabs__list{
        font-size:.875rem;
    }
}

/*-------------------------------------------
Search
-------------------------------------------*/
.search__container{
    /* background-color:rgba(0,0,0,.04); */
    background-color:#eaf6f5;
    margin-top:-30px; margin-bottom:40px;
    padding:10px 20px;
    font-size:.875rem;
}
    .search__container .form__col{
        align-self:flex-end;
    }
    .search__container .col-buttons{
        align-self:flex-end !important;
        text-align:right;
    }
        .search__container .col__label{
            margin-bottom:3px;
        }
        .search__container .form__col::after{
            display:none;
        }
@media screen and (max-width:440px){/* i16 Pro Max */
    .search__container{
        margin-bottom:20px;
        padding:10px;
    }
        .search__container .form__col{
            align-self:flex-start;
            padding-top:5px; padding-bottom:5px;
        }
        .search__container .col-buttons{
            align-self:flex-end;
        }
}

/*-------------------------------------------
Alert Information
-------------------------------------------*/
.alert{
    background-color:#fdf8ea; 
    border:1px solid #fad993;
    color:#000;
    text-align:center;
    padding:20px 15px;
    margin:5px 0;
}
@media screen and (max-width:440px){/* i16 Pro Max */
    .alert{
        font-size:.875rem;
    }
}

/*-------------------------------------------
Input, Select, Textarea
-------------------------------------------*/
::placeholder{
  color:#aaa;
  opacity:1;
}
:-ms-input-placeholder{
  color:#aaa;
}
::-ms-input-placeholder{
  color:#aaa;
}
[type=text], [type=password], [type=email], [type=tel], [type=date], textarea, select{
    box-sizing:border-box; -webkit-box-sizing:border-box;
    -webkit-appearance:none; appearance:none;
    background-color:#fff;
    border:1px solid #bbb; 
    border-radius:5px;
    font-size:1rem;
    line-height:1;
    min-height:36px;
    padding:6px 8px; 
    margin-bottom:3px;
    transition:.2s;
}
input.datepicker, input.bir, input.hasDatepicker{
    width:110px !important;
}
div[id*="twzipcode"], div[data-role="county"], div[data-role="district"], div[data-role="zipcode"]{
    float:left;
}
.zipcode, [name*="code1"], [name*="code2"]{
    width:70px !important;
}
select{
    padding:8px 20px 8px 6px;
    background-image:url(/images/select_arrow.svg);
    background-repeat:no-repeat;
    background-position:right center;
    background-size:20px auto;
}
select::-ms-expand{
    display:none;
}
textarea{
    line-height:1.2;
    resize:vertical;
    width:100%;
}
[type=text]:focus, [type=password]:focus, [type=email]:focus, [type=date]:focus, textarea:focus, select:focus{
    outline:0;
    background-color:#fff;
    border:1px solid #09F !important;
    box-shadow:0 0 0 2px rgba(0,153,2550,0.1);
}
[type=checkbox], [type=radio]{
    position:absolute; z-index:-1;
    opacity:0;
}
[type='checkbox'] + label,
[type='radio'] + label{
    padding-left:30px;
    position:relative;
}
    [type='checkbox'] + label::before,
    [type='radio'] + label::before{
        content:"";
        display:inline-block;
        background-position:0 0;
        background-repeat:no-repeat;
        background-size:cover;
        width:28px;
        height:28px;
        position:absolute; left:0; top:-6px;
    }
    [type='checkbox'] + label::before{
        background-image:url(/images/icon-checkbox.svg?v=2023);
    }
    [type='checkbox']:checked + label::before{
        background-image:url(/images/icon-checkbox-checked.svg?v=2023);
    }
    [type='radio'] + label::before{
        background-image:url(/images/icon-radio.svg?v=2023);
    }
    [type='radio']:checked + label::before{
        background-image:url(/images/icon-radio-checked.svg?v=2023);
    }
.check__list{
    position:relative;
}
    .check__item{
        position:relative;
    }
[type="file"]{
    margin:0 0 5px 0;
}
    [type="file"]::file-selector-button {
        border:1px solid #aaa;
        border-radius:5px;
        font-size:16px;
        line-height:1;
        min-height:36px;
        padding:8px 10px;
    }
    [type="file"]::file-selector-button:hover {
        background-color:var(--common-black);
        border-color:var(--common-black);
        color:#fff;
    }
.field-file{
    color:#000!important;
    font-size:.875rem; font-weight:400; 
    padding:5px 10px !important;
    overflow:hidden;
    position:relative;
}
.field-file [type=file]{
    display:block;        
    min-height:100%; min-width:100%;
    opacity:0;
    position:absolute; top:0; right:0;
    text-align:right;
    cursor:pointer;
}
[name="input_code"]{
    width:120px;
}
[name="validate_image"]{
    height:36px;
    vertical-align:middle;
}
@media screen and (max-width:320px){/* i5 */
    input.datepicker, input.bir, input.hasDatepicker{
        width:100px !important;
        padding-left:5px; padding-right:5px;
    }
    select{
        padding-left:5px;
    }
}

/*-------------------------------------------
Buttons
-------------------------------------------*/
[type=submit], [type=button], [type=reset], .btn, .field-file{
    box-sizing:border-box; -webkit-box-sizing:border-box;
    display:inline-block;
    -webkit-appearance:none; appearance:none;
    text-align:center;
    text-decoration:none;
    font-family:inherit;
    color:#000;
    font-size:1rem; font-weight:700;
    line-height:1;
    border:none;
    border-radius:30px;
    background-color:var(--doctor-primary);
    background-repeat:no-repeat;
    box-shadow:0 5px 10px rgba(0,0,0,.1);
    min-height:36px;
    padding:10px 15px 10px;
    margin-bottom:3px;
    transition:.2s;
    cursor:pointer;
    outline:none;
}
.btn-secondary, [type="reset"], [name='viewBtn']{
    color:#333;
    background-color:#fff !important;
    box-shadow:inset 0 0 0 1px var(--doctor-primary), 0 5px 10px rgba(0,0,0,.1);
}
.btn-del, [name='deleteBtn']{
    color:#fff !important;
    background-color:#c00 !important;
    padding-left:10px; padding-right:10px;
}
.btn-back{
    background-image:url(../images/icon-back.svg?v=2023) !important;
}
[type=submit]:hover, [type=button]:hover, [type=reset]:hover, .btn:hover, .field-file:hover,
[type=submit]:focus, [type=button]:focus, [type=reset]:focus, .btn:focus, .field-file:focus{
    color:#fff !important;
    background-color:var(--common-black) !important;
    box-shadow:inset 0 0 0 1px transparent, 0 1px 3px rgba(0,0,0,.2) !important;
}
hr + .buttons{
    padding:0;
}
.buttons{
    text-align:center; 
    padding:30px 0 20px; 
    position:relative;
}
    .buttons [type=submit], .buttons [type=button], .buttons [type=reset], .buttons .btn{
        font-size:1.125rem; line-height:1;
        margin-left:10px; margin-right:10px;
        padding:1em 2.5em; 
    }
@media screen and (max-width:440px){/* i16 Pro Max */
    .buttons{
        margin:0 -15px;
    }
        .buttons [type=submit], .buttons [type=button], .buttons [type=reset], .buttons .btn{
            font-size:1.125rem;
            margin-left:5px; margin-right:5px; margin-bottom:10px;
            padding:.875em 1.75em; 
        }
}
@media screen and (max-width:320px){/* i5, SE */
    [type=submit], [type=button], [type=reset], .btn, .field-file{
        padding-left:10px; padding-right:10px;
    }
}

/*-------------------------------------------
Common
-------------------------------------------*/
.explanation{
    color:#C60;
    font-size:.875rem; font-weight:400;
    line-height:1.5;
    padding:2px 0;
}
.required{
    color:#f00 !important;
}
.noneData,
.none-data,
.none-data{
    background-color:#f8f8f8;
    color:#999;
    font-weight:400;
    flex-basis:100%;
    width:100%;
    text-align:center !important;
    padding:20px 5px !important;
}
.important{
    color:#f00 !important;
}
.part__title{
    margin:0 0 1.3em;
    background-color:#fff8e4;
    color:#000;
    font-size:1.25rem; line-height:1.3; font-weight:700;
    position:relative;
    padding:.5rem 0 .5rem .75em;
}
    .part__title::before{
        content:"";
        display:block;
        position:absolute; left:.75rem; bottom:0;
        width:3em;
        height:3px;
        border-bottom:3px solid #ffe200;
    }

/*-------------------------------------------
Table (list)
-------------------------------------------*/
.table__list{
    margin:0 auto;
    border-collapse:collapse;
    border-bottom:1px solid #ddd;
}
    .table__list caption{
        text-align:left;
        font-size:1.25rem; font-weight:700;
        color:#000;
        padding:5px 0;
    }
    .table__list tbody tr:nth-child(even){
        background-color:#f7f7f7;
    }
    .table__list thead th{
        color:#777;
        font-size:.875rem; line-height:1.2; font-weight:400;
        background-color:#fafafa;
        border-left:1px solid rgba(0,0,0,.05);
        border-bottom:2px solid #ccc;
        padding:5px 8px;
        text-align:left;
        vertical-align:top;
    }
    .table__list thead th:first-child{
        border-left:none;
    }
    .table__list tbody th{
        line-height:1.3;
        border-bottom:1px solid #ddd;
        background-color:#f5fbff; 
        padding:10px 8px;
    }
    .table__list tbody tr:nth-child(even){
        /* background-color:rgba(0,0,0,.04); */
    }
    .table__list tbody td{
        border-bottom:1px solid rgba(0,0,0,.1);
        border-left:1px solid rgba(0,0,0,.05);
        position:relative;
        line-height:1.3;
        padding:10px 8px;
    }
    .table__list tbody td:first-child{
        border-left:none;
    }
        .table__list td [type="submit"],
        .table__list td [type="button"],
        .table__list td [type="reset"]{
            font-size:.875rem;
        }
        .table__list td select{
            padding-top:8px; padding-bottom:8px;
        }
    .table__list tfoot tr{
        background-color:#fdf8ea;
    }
        .table__list tfoot td{
            background-color:#fdf8ea;
            border-top:3px solid #aaa;
            font-size:1.25rem;
            color:#000;
            padding-bottom:15px;
        }
/*--- table ---*/
.table__wrap{
    width:100%;
    overflow-x:auto;
    overflow-y:hidden;
}
@media screen and (max-width:1024px){
    .table__list thead th{
        padding:5px 5px;
    }
    .table__list tbody th,
    .table__list tbody td{
        padding:8px 5px;
    }
}
@media screen and (max-width:992px){
    .table__wrap::before,
    .table__wrap::after{
        display:block;
        content:"*表格過寬時，可左右滑動觀看";
        color:#C60;
        font-size:.75rem;
        position:sticky; left:0;
    }
    .table__wrap table{
        min-width:100% !important;
    }
        .table__list thead th{
            padding:5px 5px;
            font-size:.75rem;
        }
        .table__wrap .table__list thead th{
            font-size:.75rem;
            white-space:nowrap;
        }
        .table__list tbody td{
            font-size:.875rem;
            padding:8px 5px;
        }
}

/*-------------------------------------------
Table (content)
-------------------------------------------*/
.table__content{
    margin:0 auto;
    border-collapse:collapse;
    float:none;
}
    .table__content caption{
        text-align:left;
        font-size:1.25rem; font-weight:700;
        color:#000;
        padding:5px 0;
    }
    .table__content th, .table__content td{
        padding:10px 8px;
    }
    .table__content tbody th{
        color:#777;
        font-size:.875rem; font-weight:400;
        letter-spacing:1.2px;
        background-color:#fafafa;
        border-bottom:1px solid #ddd;
    }
    .table__content tbody tr:first-child th{
        border-top:1px solid #e1e1e1;
    }
    .table__content tbody td{
        border-bottom:1px solid #e3e3e3; 
        border-left:1px solid rgba(0,0,0,.05);
        height:40px;
        position:relative;
        word-break: break-word;
    }
        .table__content tbody td a{
            word-break:break-all;
        }
    .table__content tbody tr:first-child td{
        border-top:1px solid #e1e1e1;
    }
    .table__content tbody tr td:first-child{
        border-left:none;
    }
@media screen and (max-width:576px){
    .table__content{
        border-bottom:1px solid #e3e3e3;
    }
        .table__content tbody tr:first-child td{
            border-top:none;
        }
        .table__content tbody tr:first-child th{
            border-bottom:none;
        }
        .table__content tr,
        .table__content tbody th,
        .table__content tbody td{
            display:block;
            width:100%;
            text-align:left;
            height:auto;
            border:none;
        }
        .table__content tbody th{
            padding:2px 8px;
            border-top:1px solid #e1e1e1;
        }
        .table__content tbody td{
            min-height:32px;
            padding:10px 8px 15px;
        }
            .table__content .explanation{
                display:block;
                margin-top:5px;
            }
}

/*-------------------------------------------
URL
-------------------------------------------*/
.url{
    position:relative;
    background-color:#edf7ff;
    margin-top:2px;
    padding:20px 20px 20px 6.5em;
    font-size:.875rem; line-height:1.3;
    word-break:break-all;
}
    .url__label{
        display:inline-block;
        position:absolute; left:20px;
    }
@media screen and (max-width:992px){
    .url{
        margin-left:-20px; margin-right:-20px;
    }
}
@media screen and (max-width:576px){
    .url{
        padding-left:20px;
    }
        .url__label{
            display:block;
            position:static;
            padding-bottom:5px;
        }
}

/*-------------------------------------------
Attachment
-------------------------------------------*/
.attachment{
    list-style:none;
    margin:2px 0 0;
    padding:20px;
    position:relative;
    background-color:#f7f7f7;
}
    .att__item{
        display:inline-block;
        vertical-align:top;
        padding:5px 10px 5px 0;
    }
        .attachment a{
            display:inline-block;
            background-color:#fff;
            color:#333;
            font-size:.875rem; line-height:1.3;
            padding:8px 15px;
            border:1px solid #ccc;
            border-radius:8px;
            margin-bottom:3px;
            transition:.2s;
        }
        .attachment a:hover{
            color:#000;
            background-color:#f4f4f4;
            box-shadow:0 1px 8px rgba(0,0,0,.1);
        }
@media screen and (max-width:992px){
    .attachment{
        margin:0 -15px;
    }
}
@media screen and (max-width:440px){/* i16 Pro Max */
    .att__item{
        display:block;
        padding-right:0;
    }
}

/*-------------------------------------------
延伸閱讀
-------------------------------------------*/
.next__page{
    background-color:#fff6e9;
    margin-top:2px;
    padding:20px;
}
    .next__label{
        display:inline-block;
        vertical-align:top;
        font-size:.875rem;
    }
    .next__link{
        display:inline-block;
        max-width:calc(100% - 15px);
        overflow:hidden;
        text-overflow:ellipsis;
        white-space:nowrap;
    }
@media screen and (max-width:992px){
    .next__page{
        margin:0 -15px;
    }
}
@media screen and (max-width:440px){/* i16 Pro Max */
    .next__label{
        display:block;
        padding-right:0;
    }
}

/*-------------------------------------------
Share 分享
-------------------------------------------*/
.share{
    list-style:none;
    margin:0;
    padding:20px 0 0;
    position:relative;
    box-shadow:0 -1px 0 rgba(0,0,0,.1);
}
    .share__item{
        display:inline-block;
        padding-right:15px;
        line-height:24px;
    }
        .share__label{
            display:inline-block;
            font-size:.875rem;
        }
        .share__link{
            display:inline-block;
            text-indent:-99999em;
            background-repeat:no-repeat;
            background-position:50% 50%;
            background-size:24px 24px;
            width:24px; height:24px;
            margin-right:5px;
            transition:.2s;
        }
        .share__link:hover{
            opacity:.7;
        }
        .btn-twitter{background-image:url(/images/icon-social-x.svg);}
        .btn-fb{background-image:url(/images/icon-social-facebook.svg);}
        .btn-line{background-image:url(/images/icon-social-line.svg);}
        .btn-mailto{background-image:url(/images/icon-social-mail.svg);}
        .btn-clipboard{background-image:url(/images/icon-social-clipboard.svg);}
@media screen and (max-width:440px){/* i16 Pro Max */
    .share{
        margin:0 -15px;
        padding:15px;
    }
}

/*-------------------------------------------
file format
-------------------------------------------*/
.file-format::after{
    content:"FILE";
    display:inline-block;
    vertical-align:1px;
    color:#333;
    font-size:.75rem; line-height:1; font-weight:400;
    border-radius:30px;
    margin-left:5px;
    padding:3px 10px;
    border:1px solid #333;
    transition:.2s;
}
.file-format:hover::after{
    color:#fff;
    background-color:#333;
}
.file-format[href *='.pdf']::after{
    content:"PDF";
    color:#ea2020;
    border-color:#ea2020;
}
.file-format[href *='.pdf']:hover::after{
    color:#fff;
    background-color:#ea2020;
}
.file-format[href *='.doc']::after{
    content:"WORD";
    color:#0061b2;
    border-color:#0061b2;
}
.file-format[href *='.doc']:hover::after{
    color:#fff;
    background-color:#0061b2;
}
.file-format[href *='.xls']::after{
    content:"EXCEL";
    color:#0e932e;
    border-color:#0e932e;
}
.file-format[href *='.xls']:hover::after{
    color:#fff;
    background-color:#0e932e;
}
.file-format[href *='.ppt']::after{
    content:"POWER POINT";
    color:#eb4f38;
    border-color:#eb4f38;
}
.file-format[href *='.ppt']:hover::after{
    color:#fff;
    background-color:#eb4f38;
}
.file-format[href *='.jpg']::after, .file-format[href *='.JPG']::after, 
.file-format[href *='.png']::after, .file-format[href *='.PNG']::after{
    content:"IMG";
    color:#ea8010;
    border-color:#ea8010;
}
.file-format[href *='.jpg']:hover::after, .file-format[href *='.JPG']:hover::after, 
.file-format[href *='.png']:hover::after, .file-format[href *='.PNG']:hover::after{
    color:#fff;
    border-color:#ea8010;
}
.file-format[href *='.rar']::after{
    content:"RAR";
    color:#4e52b3;
    border-color:#4e52b3;
}
.file-format[href *='.rar']:hover::after{
    color:#fff;
    background-color:#4e52b3;
}
.file-format[href *='.zip']::after{
    content:"ZIP";
    color:#cd9a14;
    border-color:#cd9a14;
}
.file-format[href *='.zip']:hover::after{
    color:#fff;
    background-color:#cd9a14;
}

/*-------------------------------------------
Page
-------------------------------------------*/
.page{
    clear:both;
    margin-top:30px;
    font-size:.875rem;
    line-height:30px;
    text-align:center;
}
    .page span{
        display:inline-block;
        min-width:30px;
        margin:0 3px 5px;
    }
        .page a{
            display:block;
            border:1px solid #ccc;
            border-radius:5px;
            color:#333;
            padding:0 8px;
            transition:.2s;
        }
        .page a:focus,
        .page a:hover{
            color:#fff;
            background-color:#333;
            border-color:#333;
        }
    .page .current{
        color:#111;
        font-weight:700;
    }
    .page .disabled{
        cursor:default;
        opacity:.4;
    }
    .page .pageTo{
        margin:2px;
        width:50px;
    }
@media screen and (max-width:440px){/* i16 Pro Max */
    .page{
        margin-top:20px;
    }
        .page .pageTo{
            display:block;
            margin:5px auto;
        }
}

/*-------------------------------------------
Contact
-------------------------------------------*/
.tda__contact{
    height:250px;
    background:url(/images/map_bg.png) 50% 0 no-repeat;
    position:relative; z-index:5;
    overflow:hidden;
}
    .tda__contact::before{
        content:"";
        display:block;
        background:url(/images/bg_color.jpg) no-repeat 50% 50%;
        background-size:cover;
        width:100%;
        height:100%;
        opacity:.5;
        position:absolute; top:0; left:0; z-index:0;
    }
    .tda__contact .contact__information{
        width:390px;
        height:180px;
        background-color:var(--doctor-primary);
        color:#000;
        position:absolute; left:20px; top:30px; z-index:3;
        padding:20px 30px;
        line-height:1.8; font-weight:normal;
    }
        :lang(en) .contact__information .contact__address{
            font-size:.875rem; line-height:1.5;
            margin-bottom:10px;
        }
    .tda__contact .pin{
        background-image:url(/images/dr/map_pin.png);
        background-repeat:no-repeat;
        background-position:50% 0;
        background-size:53px 66px;
        width:53px; height:66px;
        position:absolute; left:58%; top:80px; z-index:5;
    }
@media screen and (max-width:1600px){
    .tda__contact .pin{
        left:60%;
    }
}
@media screen and (max-width:1366px){
    .tda__contact .pin{
        left:61.5%;
    }
}
@media screen and (max-width:1280px){
    .tda__contact .pin{
        left:62%;
    }
}
@media screen and (max-width:1024px){
    .tda__contact .pin{
        left:65%;
    }
}
@media screen and (max-width:992px){
    .tda__contact .pin{
        left:69%;
    }
}
@media screen and (max-width:736px){/* i6,i7,i8 Plus Landscape */
    .tda__contact .pin{
        left:71%;
    }
}
@media screen and (max-width:576px){
    .tda__contact .contact__information{
        width:auto;
        height:auto;
        padding:20px;
        font-size:.875rem;
    }
    .tda__contact .pin{
        left:77%;
    }
}
@media screen and (max-width:440px){/* i16 Pro Max */
    .tda__contact{
        height:auto;
        background-position:60% 0;
        background-image:none;
        background-color:var(--common-black);
    }
        .tda__contact::before{
            display:none;
        }
        .tda__contact .contact__information{
            width:auto;
            padding:20px;
            position:static;
            margin:0 -15px;
        }
        .tda__contact .pin{
            left:51%;
            display:none;
        }
}
@media screen and (max-width:320px){/* i5 */
    .tda__contact .contact__information{
        margin:0 -15px;
    }
}

/*-------------------------------------------
Footer
-------------------------------------------*/
footer{
    color:#fff;
    font-size:.75rem; line-height:1.5;
    text-align:center;
    padding:30px 0;
    /* iOS 11.0~11.1 */
    padding-bottom:calc(constant(safe-area-inset-bottom) + 30px);
    /* iOS 11.2 */
    padding-bottom:calc(env(safe-area-inset-bottom) + 30px);
}
    footer label{
        color:var(--doctor-primary);
    }
    footer a{
        color:#fff;
        transition:.2s;
    }
    footer a:hover{
        color:#fff;
        opacity:.65;
    }
    .footer__contact{
        list-style:none;
        margin:0;
        padding:0;
    }
        .footer__contact li{
            display:inline-block;
            margin-right:1.5em;
            font-size:.875rem;
        }
    .footer__copyright{
        margin-top:0;
    }
        .footer__visits{
            display:inline;
        }
    .footer__recommended{
        color:#fff;
        opacity:.65;
    }
    .huaweb{
        opacity:.2;
    }
@media screen and (max-width:1024px){
    .footer__recommended{
        display:none;
    }
}
@media screen and (max-width:576px){
    .footer__visits{
        display:block;
    }
}
@media screen and (max-width:440px){/* i16 Pro Max */
    footer{
        text-align:left;
    }
        .footer__contact li{
            display:list-item;
        }
        .footer__copyright .en{
            display:block;
        }
}

/*-------------------------------------------
Keyword Label
-------------------------------------------*/
.keyword__label{
    position:absolute; left:0; bottom:0; z-index:-1;
    height:0px;
    overflow:hidden;
}
    .keyword__label span{
        display:inline-block;
        line-height:1;
    }

/*-------------------------------------------
SimpleLightbox
-------------------------------------------*/
.has-lightbox{
    height:auto;
    overflow:hidden;
}
    .has-lightbox body.hidden-scroll{
        background-color:#fff;
        padding-right:0 !important;
        margin-right:17px;
        overflow:hidden;
        height:auto;
    }
    .has-lightbox .sl-wrapper{
        outline:none;
    }
        .has-lightbox .sl-wrapper .sl-close{
            color:#fff;
            outline:none;
            margin:0;
            width:48px;
            height:48px;
            line-height:48px;
            top:20px; right:20px;
        }
        .has-lightbox .sl-wrapper .sl-navigation button.sl-prev,
        .has-lightbox .sl-wrapper .sl-navigation button.sl-next{
            color:#fff;
            outline:none;
            margin:-24px 0 0;
            width:48px;
            height:48px;
            line-height:48px;
        }
        .has-lightbox .sl-wrapper .sl-counter{
            color:#fff;
            top:16px; left:16px;
        }
            .has-lightbox .sl-wrapper .sl-counter .sl-current{
                font-size:1.5rem;
            }
        .has-lightbox .sl-wrapper .sl-image .sl-caption{
            background: rgba(0,0,0,0.3);
            font-size:.875rem; line-height:1.5;
        }
    .has-lightbox .sl-overlay{
        background:#000;
        opacity:.85;
    }
@media screen and (max-width:1024px){
    .has-lightbox .sl-wrapper .sl-close{
        top:6px; right:6px;
    }
}
@media screen and (max-width:440px){/* i16 Pro Max */
    .has-lightbox .sl-wrapper .sl-navigation button.sl-prev,
    .has-lightbox .sl-wrapper .sl-navigation button.sl-next{
        width:32px;
    }
    .has-lightbox .sl-wrapper .sl-navigation button.sl-prev{
        left:0;
    }
    .has-lightbox .sl-wrapper .sl-navigation button.sl-next{
        right:0;
    }
    .has-lightbox .sl-wrapper .sl-image .sl-caption{
        font-size:.75rem;
    }
}

/*-------------------------------------------
JQuery UI
-------------------------------------------*/
.ui-widget{
    font-family:inherit;
    box-shadow:0 3px 12px rgba(0,0,0,.2);
}
    .ui-widget input,
    .ui-widget select,
    .ui-widget textarea,
    .ui-widget button{
        font-family:inherit;
        padding:5px;
    }
    .ui-datepicker-week-end{
        color:#c00;
    }
    .ui-datepicker th{
        padding:.3em;
    }
    img.ui-datepicker-trigger{
        display:inline-block;
        vertical-align:-5px;
        height:24px;
        position:relative; left:3px;
        cursor:pointer;
    }