@charset "UTF-8";
/*! 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:bolder}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{
    --primary-color:#50b500;
    --primary-rgb:80,181,0;
    --link-color:#0480f3;
    --hover-color:#005aff;
    --yellow:#ffde00;
    --red:#e31737;
}
body{
    color:#333;
    font-size:16px; line-height:1.75rem;
    font-family:Varela Round, 'Kosugi Maru', "微軟正黑體", "Microsoft JhengHei", Arial, Helvetica, 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;
    background-color:#a28464;
    overflow-x:hidden;
}
body.isFixed{
    overflow:hidden;
}
@media screen and (max-width:360px){/* i12 Mini */
    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 #ccc; margin:2em 0; padding:0;}

/* 移除圖片底下間隙 */
img{vertical-align:middle;}

a{color:var(--link-color); text-decoration:none;}
a:hover, a:active, a:focus{color:var(--hover-color);}


/*-------------------------------------------
Live直播(顯示/隱藏)
-------------------------------------------*/
.menuLive,
.spLive,
#liveInfo{
    display:none !important;
}

/*-------------------------------------------
Wrapper
-------------------------------------------*/
.wrapper{
    width:1000px; min-width:1000px; 
    margin:0 auto; 
    position:relative;
    /* box-shadow:inset 0 0 1px rgba(0,0,0,.9); */
}
@media screen and (max-width:1024px){
    .wrapper{
        width:100%; min-width:100%;
    }
}

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

/*-------------------------------------------
Header
-------------------------------------------*/
#headerContainer{
    background-color:#fff;
}
    .headerBar{
        background-color:rgba(255,255,255,.8);
        position:absolute; z-index:10;
        width:100%;
        height:45px;
        overflow:hidden;
    }
        .pediatrTitle{
            margin:0;
            display:inline-block;
            width:204px;
            height:34px;
            background:url(../images/heading@2x.png) no-repeat 0 0;
            background-size:204px 34px;
            position:absolute; top:6px; left:15px;
        }
            .pediatrTitle span{
                font-size:0rem;
                visibility:hidden;
            }
        .topLinks{
            position:absolute; top:12px; right:15px;
            font-size:.875rem; line-height:24px;
        }
            .topBtn{
                display:inline-block;
                color:var(--link-color);
                margin-left:20px;
                background-position:0 -2px;
                background-repeat:no-repeat;
                background-size:24px 24px;
                padding-left:26px;
            }
            .topBtn:hover{
                color:#005aff;
            }
            .topLoginName{
                margin-left:20px;
            }
            .topIconHome{
                background-image:url(../images/top_icon-home.svg);
            }
            .topIconLogin{
                background-image:url(../images/top_icon-person.svg);
            }
            .topIconMyCal{
                background-image:url(../images/top_icon-event.svg);
            }
            .topIconLogout{
                margin-left:5px;
                background-image:url(../images/top_icon-logout.svg);
            }
            .topIconContact{
                background-image:url(../images/top_icon-contact.svg);
            }
    .headerTheme{
        background-color:#f8f4f3;
        background-image:url(../images/theme_img-bg.jpg);
        background-position:50% 50%;
        background-repeat:no-repeat;
        background-size:cover;
        height:300px;
        overflow:hidden;
        position:relative;
    }
        .headerTheme::before{
            content:"";
            display:block;
            background:url(../images/theme_img-rainbow.png) no-repeat center top -25px;
            background-size:auto 90%;
            position:absolute; top:0; left:0;
            width:100%;
            height:100%;
            pointer-events:none;
        }
        .headerTheme::after{
            content:"";
            display:block;
            background:url(../images/theme_img-house1.png) no-repeat left  15% bottom 22px,
                       url(../images/theme_img-house2.png) no-repeat right 15% bottom 22px;
            background-size:auto 30%;
            position:absolute; top:0; left:0;
            width:100%;
            height:100%;
            pointer-events:none;
        }
        .headerTheme > .wrapper{
            height:100%;
            z-index:2;
        }
            .headerTheme > .wrapper::before,
            .headerTheme > .wrapper::after{
                content:"";
                display:block;
                background-repeat:no-repeat;
                background-position:0 0;
                background-size:contain;
                position:absolute; bottom:10px; z-index:0;
            }
            .headerTheme > .wrapper::before{
                aspect-ratio:50 / 52;
                background-image:url(../images/theme_img-bird1.png);
                width:50px;
                top:25%; left:2%;
                animation:butterfly 2.3s ease-in-out 0s infinite;
            }
            .headerTheme > .wrapper::after{
                aspect-ratio:50 / 51;
                background-image:url(../images/theme_img-bird2.png);
                width:40px;
                top:25%; right:2%;
                animation:butterfly 2s ease-in-out 0s infinite;
            }
            .themeTitle{
                position:absolute; top:80px; left:50%; z-index:10;
                transform:translateX(-50%);
                transition:.2s;
            }
            .themeTitle:focus,
            .themeTitle:hover{
                top:82px;
            }
                .themeTitle h1{
                    margin:0;
                    color:#111;
                    font-size:3rem; font-weight:bold;
                    line-height:1;
                    text-shadow:0 -3px white, 2px -2px white, 3px 0 white, 2px 2px white, 0 3px white, -2px 2px white, -3px 0 white, -2px -2px white, 0 5px 5px rgba(0,0,0,.4); 
                    white-space:nowrap;
                }
                    .themeTitle h1 span{
                        display:none;
                    }
                    .themeTitle h1 i{font-style:normal;}
                    .themeTitle h1 i:nth-of-type(1){color:#ec6f81;}
                    .themeTitle h1 i:nth-of-type(2){color:#1e94d4;}
                    .themeTitle h1 i:nth-of-type(3){color:#f5cf4a;}
                    .themeTitle h1 i:nth-of-type(4){color:#70b131;}
                    .themeTitle h1 i:nth-of-type(5){color:#70b131;}
                    .themeTitle h1 i:nth-of-type(6){color:#631e79;}
                    .themeTitle h1 i:nth-of-type(7){color:#4569b3;}
                    .themeTitle h1 i:nth-of-type(8){color:#d21478;}
                .themeTitle h3{
                    margin:5px 0 0;
                    color:#264f9f;
                    font-size:1.4rem; font-weight:bold;
                    line-height:1.5;
                    text-shadow:0 -2px white, 1px -1px white, 2px 0 white, 1px 1px white, 0 2px white, -1px 1px white, -2px 0 white, -1px -1px white, 0 5px 5px rgb(0,0,0,.2); 
                    white-space:nowrap;
                }
                    .themeTitle .themeTitleAddr{
                        font-size:1.125rem;
                        font-weight:400;
                    }
                    .themeTitle .googleSearch{
                        font-weight:400;
                        line-height:1;
                        /* padding-left:3em; */
                    }
        .themeImgPos{
            position:absolute; z-index:2;
        }
        .themeBoy{
            aspect-ratio:26 / 36;
            width:135px;
            bottom:18px; left:8%; z-index:4;
        }
        .themeGirl{
            aspect-ratio:25 / 33;
            width:135px;
            bottom:18px; right:8%; z-index:3;
        }
            .themeImg{
                margin:0;
                background-repeat:no-repeat;
                background-position:0 0;
                background-size:contain;
                position:absolute;
                transition:.4s;
                width:100%;
                height:100%;
                pointer-events:none;
            }
            .themeBoy .themeImg{
                background-image:url(../images/theme_img-boy.png);
            }
            .themeGirl .themeImg{
                background-image:url(../images/theme_img-girl.png);
            }
        @keyframes butterfly{
            0% { transform:translateY(0); }
            50% { transform:translateY(3px); }
            100% { transform:translateY(0); }
        }
@media screen and (max-width:1680px){
    .headerTheme::after{
        background-position:left  10% bottom 22px,
                            right 10% bottom 22px;
        background-size:auto 28%;
    }
}
@media screen and (max-width:1440px){
    .headerTheme::after{
        background-position:left  6% bottom 28px,
                            right 6% bottom 28px;
        background-size:auto 28%;
    }
}
@media screen and (max-width:1280px){/* Air Mac */
    .headerTheme::after{
        background-position:left  3% bottom 28px,
                            right 3% bottom 28px;
        background-size:auto 25%;
    }
    .themeBoy{
        left:12%;
    }
    .themeGirl{
        right:12%;
    }
}
@media screen and (max-width:1024px){
    .headerTheme::after{
        background-position:left  0% bottom 28px,
                            right 0% bottom 28px;
        background-size:auto 25%;
    }
}
@media screen and (max-width:992px){
    .headerBar{
        height:50px;
    }
        .pediatrTitle{
            top:10px;
        }
        .topLinks{
            top:10px; right:85px;
            line-height:32px;
        }
            .topBtn{
                text-indent:-99999em;
                background-position:0 50%;
                background-size:32px 32px;
                padding-left:32px;
            }
    .headerTheme{
        background-position-x:70%;
        height:270px;
    }
        .themeTitle{
            top:83px; 
        }
            .themeTitle .themeTitleAddr{
                display:block;
                font-size:1rem;
                padding-left:4em;
            }
            .themeBoy{
                width:123px;
                left:13%; bottom:4%;
            }
            .themeGirl{
                width:123px;
                right:14%; bottom:4%;
            }
}
@media screen and (max-width:820px){/* iPad Air and Portrait */
    .themeTitle{
        /* left:4%; */
    }
        .themeTitle h1{
            font-size:2.5rem;
        }
        .themeTitle h3{
            font-size:1.25rem;
        }
        .themeBoy{
            left:8%; bottom:1%;
        }
            .themeBoy .themeImg{
                background-image: url(../images/theme_img-boy_sp.png);
            }
        .themeGirl{
            right:10%; bottom:1%;
        }
            .themeGirl .themeImg{
                background-image: url(../images/theme_img-girl_sp.png);
            }
}
@media screen and (max-width:768px){
    .headerTheme{
        /* height:260px; */
    }
        .headerTheme > .wrapper::before{
            /* width:30px; */
        }
        .headerTheme > .wrapper::after{
            /* width:30px; */
        }
}
@media screen and (max-width:667px){/* i6, i7, i8 Landscape */
    .headerTheme{
        height:240px;
    }
        .themeTitle{
            
        }
            .themeTitle h1{
                font-size:2.5rem;
            }
        .themeBoy{
            width:100px;
            left:0; /* bottom:15px; */
        }
        .themeGirl{
            width:100px;
            right:2%; /* bottom:15px; */
        }
}
@media screen and (max-width:576px){
    .topLinks{
        display:none;
    }
    .headerTheme{
        height:220px;
    }
        .headerTheme::after{
            background-position:left 0% bottom 22px, right 0% bottom 22px;
            background-size:auto 22%;
            filter:blur(1px);
        }
            .headerTheme > .wrapper::before{
                width:35px;
            }
            .headerTheme > .wrapper::after{
                width:35px;
            }
        .themeTitle{
            top:76px;
        }
            .themeTitle h1{
                font-size:2rem;
            }
            .themeTitle h3{
                font-size:1.125rem;
            }
        .themeBoy{
            /* left:0; */
        }
        .themeGirl{
            /* right:3%; */
        }
}
@media screen and (max-width:440px){/* i16 Pro Max */
    .headerTheme{
        background-image:url(../images/theme_img-bg_sp.jpg);
        height:280px;
    }
        .headerTheme::before {
            background-position:center top 10px;
            background-size:auto 70%;
        }
        .headerTheme::after{
            background-image:url(../images/theme_img-house1.png);
            background-position:left 0% bottom 32px;
            filter:blur(1px);
        }
        .themeTitle{
            top:85px; left:5%;
            transform:translateX(0);
        }
            .themeTitle h1{
                font-size:7.25vw;
            }
            .themeTitle h3{
                font-size:3.5vw;
                white-space:normal;
                width:14em;
            }
            .themeTitle .themeTitleAddr{
                font-size:.875rem;
                margin-top:-3px;
            }
            .themeTitle .googleSearch{
                padding-left:0;
            }
                .themeTitle .googleSearch .br{
                    display:block;
                    margin-top:5px;
                }
        .headerTheme > .wrapper::before{
            top:43px; left:2%;
        }
        .headerTheme > .wrapper::after{
            right:3%;
        }
        .themeBoy{
            left:48%; bottom:0%;
        }
        .themeGirl{
            right:10px; bottom:1%;
        }
}
@media screen and (max-width:375px){/* SE, iX, XS, i11 Pro, i13 Mini, i6, i7, i8 */
    .headerTheme{
        height:265px;
    }
        .themeTitle{
            top:75px;
        }
            .themeTitle h3{
                font-size:3.875vw;
            }
        .themeBoy{
            width:90px;
            left:40%;
        }
        .themeGirl{
            width:90px;
            right:0;
        }
}
@media screen and (max-width:320px){/* i5 */
    .headerTheme{
        height:250px;
    }
        .themeBoy{
            /* width:70px; */
            /* top:95px; */
        }
        .themeGirl{
            /* width:70px; */
            /* top:100px; */
        }
}

/*-------------------------------------------
Menu icon
-------------------------------------------*/
@media screen and (max-width:992px){
    .toggleMenu{
        display:inline-block;
        width:50px;
        height:50px;
        line-height:50px;
        text-align:center;
        padding:0;
        /* background-color:#fff; */
        border-radius:50%;
        position:fixed; right:15px; top:0; z-index:701;
        transition:.4s ease;
    }
    .activeScroll .toggleMenu{
        top:5px;
        background-color:#fff;
        box-shadow:0 5px 15px rgba(0,0,0,.15);
    }
    .toggleMenu.active{
        top:5px;
        box-shadow:none;
    }
        #icon-menu{
            display:block;
            width:32px;
            height:32px;
            margin:0 auto;
            position:relative; top:50%;
            transform:translateY(-50%);
            -webkit-transition:.4s ease;transition:.4s ease;
            cursor:pointer;
            /* box-shadow:0 0 3px rgba(0,0,0,.2); */
        }
        .activeScroll #icon-menu{
            width:28px;
            height:28px;
        }
            #icon-menu span{
                display:block;
                position:absolute; left:0;
                width:100%;
                height:4px;
                margin-top:-2px;
                background-color:var(--primary-color);
                border-radius:5px;
                opacity:1;
                -webkit-transform:rotate(0deg);-moz-transform:rotate(0deg);-o-transform:rotate(0deg);transform:rotate(0deg);
                -webkit-transition:.25s ease-in-out;-moz-transition:.25s ease-in-out;-o-transition:.25s ease-in-out;transition:.25s ease-in-out;
            }
            #icon-menu span:nth-child(1){top:15%;}
            #icon-menu span:nth-child(2){top:50%;}
            #icon-menu span:nth-child(3){top:85%;}

        #icon-menu.active span{
            background-color:#5c3224;
            transition-delay:0s;-webkit-transition-delay:0s;
        }
        #icon-menu.active span:nth-child(1){
            top:48%;
            -webkit-transform:rotate(-45deg);-moz-transform:rotate(-45deg);-o-transform:rotate(-45deg);transform:rotate(-45deg);
        }
        #icon-menu.active span:nth-child(2){
            opacity:0;
        }
        #icon-menu.active span:nth-child(3){
            top:48%;
            -webkit-transform:rotate(45deg);-moz-transform:rotate(45deg);-o-transform:rotate(45deg);transform:rotate(45deg);
        }
}

/*-------------------------------------------
Menu
-------------------------------------------*/
#menuContainer{
    background-color:#fff;
    height:64px;
    position:relative; z-index:5;
}
    .spLoginInfo{
        display:none;
    }
    .menuList{
        list-style:none; margin:0 auto; padding:0;
        display:-webkit-box;
        display:-ms-flexbox;
        display:flex;
        display:-webkit-flex;
        flex-wrap:wrap;
        -webkit-flex-wrap:wrap;
        -ms-flex-wrap:wrap;
    }
        .menuItem{
            -webkit-flex:1 0 auto; /* Safari 6.1+ */
            -ms-flex:1 0 auto; /* IE 10 */ 
            flex:1 0 auto;
            position:relative;
            text-align:center;
            line-height:18px;
        }
            .menuItem a{
                position:relative; top:-30px;
                display:inline-block;
                min-width:48px;
                color:#000; 
                font-size:1rem;
                -webkit-transition:.2s;    transition:.2s;
            }
                .menuItem .icon{
                    position:relative;
                    display:block;
                    width:100%;
                    height:48px;
                    background-position:50% 50%;
                    background-repeat:no-repeat;
                    background-size:48px 48px;
                    margin-bottom:10px;
                    -webkit-transition:.2s;    transition:.2s;
                }
                .menuItem a:hover .icon{
                    margin-top:-5px; margin-bottom:12px;
                }
                .menuHome .icon{background-image:url(../images/menu_icon-home@2x.png);}
                .menuNews .icon{background-image:url(../images/menu_icon-news@2x.png);}
                .menuProgram .icon{background-image:url(../images/menu_icon-program@2x.png);}
                .menuLive .icon{background-image:url(../images/menu_icon-live@2x.png);}
                .menuFloorPlan .icon{background-image:url(../images/menu_icon-floorplan@2x.png);}
                .menuTraffic .icon{background-image:url(../images/menu_icon-traffic@2x.png);}
                .menuAccommodation .icon{background-image:url(../images/menu_icon-hotel@2x.png);}
                .menuWebLinks .icon{background-image:url(../images/menu_icon-webLinks@2x.png);}
                .menuAbstract .icon{background-image:url(../images/menu_icon-contribute@2x.png);}
                .menuSubmission .icon{background-image:url(../images/menu_icon-search@2x.png);}

@media screen and (max-width:992px){
    #menuContainer{
        position:fixed; top:0; left:0; bottom:0; 
        z-index:0;
        background-color:#fff;
        opacity:0;
        /* width:100vw; */
        /* height:100vh; */
        width:100%;
        height:100%;
        overflow-x:hidden;
        overflow-y:auto;
        pointer-events:none;
        transition:.3s ease;
        padding:0;
    }
    #menuContainer.active{
        opacity:1;
        z-index:700;
        pointer-events:auto;
    }
        .menuContainer > .wrapper{
            height:100%;
        }
            .spLoginInfo{
                display:block;
                height:50px;
                padding-top:5px; padding-left:10px;
                line-height:50px;
            }
            .menuList{
                align-items:center;
                justify-content:center;
                position:fixed; top:50%; left:0;
                transform: translateY(-50%);
                width:100%;
            }
                .menuItem{
                    -webkit-flex:1 0 20%; /* Safari 6.1+ */
                    -ms-flex:1 0 20%; /* IE 10 */ 
                    flex:1 0 20%;
                    padding:20px 10px;
                }
                    .menuItem a{
                        top:0;
                        font-size:1rem;
                    }
}
@media screen and (max-width:576px){
    .menuItem{
        padding:10px;
    }
}
@media screen and (max-width:440px){/* i16 Pro Max */
    .menuItem{
        -webkit-flex:1 0 33.33333%; /* Safari 6.1+ */
        -ms-flex:1 0 33.33333%; /* IE 10 */ 
        flex:1 0 33.33333%;
        padding:15px 10px;
    }
    .menuHome{
        -webkit-flex:1 0 100%; /* Safari 6.1+ */
        -ms-flex:1 0 100%; /* IE 10 */ 
        flex:1 0 100%;
    }
}
@media screen and (max-width:576px){
    .menuSubmission a{
        font-size:.875rem;
    }
}

/*-------------------------------------------
Container
-------------------------------------------*/
#contentContainer{
    background-color:#f1eee9;
    height:auto!important;min-height:420px;height:420px;
    position:relative; z-index:0;
    padding:50px 15px;
}
    #pageTitle{
        font-size:1.875rem; line-height:1; color:#000;
        margin:0; margin-bottom:15px;
        padding-left:60px;
        position:relative;
    }
        #pageTitle .icon{
            display:inline-block;
            vertical-align:top;
            width:48px;
            height:48px;
            background-image:url(../images/menu_icon-wraning@2x.png);
            background-repeat:no-repeat;
            background-size:48px 48px;
            background-position:50% 50%;
            position:absolute; top:50%; left:0;
            transform:translateY(-50%);
        }
    #pageContent{
        position:relative;
        background-color:#fff;
        padding:25px;
        border-radius:5px;
        box-shadow:0 5px 12px rgba(0,0,0,.1);
        padding:30px 40px;
        min-height:210px;
    }
    
        #pageContent .partTitle{
            color:var(--primary-color);
            font-size:1.25rem; font-weight:400;
            padding-bottom:5px;
            border-bottom:1px solid #ddd;
        }
        #pageContent .partTitle:first-of-type{
            margin-top:0;
        }
@media screen and (max-width:992px){
    #contentContainer{
        padding:40px 24px;
    }
}
@media screen and (max-width:576px){
    #contentContainer{
        padding:30px 15px 40px;
    }
        #pageContent{
            padding:30px 15px;
        }
}
@media screen and (max-width:320px){/* i5 */
    #pageContent{
        padding:20px 15px;
    }
}

/*-------------------------------------------
Search Block
-------------------------------------------*/
#searchBlock{
    border-bottom:1px solid #ccc;
    padding-bottom:10px;
    margin-bottom:30px;
}
    #searchBlock ul{
        list-style:none;
        margin:0;
        padding:0;
    }
        #searchBlock ul li{
            display:inline-block;
            vertical-align:top;
            margin-right:15px;
        }
@media screen and (max-width:440px){/* i16 Pro Max */
    #searchBlock ul li{
        display:block;
        margin:0 0 10px;
    }
}

/*-------------------------------------------
Table (list)
-------------------------------------------*/
.tableList{
    margin:0 auto;
}
    .tableList th, .tableList td{
        padding:5px;
    }
    .tableList thead th{
        color:#000;
        font-size:.875rem; line-height:1.2;
        text-align:left;
        background-color:rgba(var(--primary-rgb),.08);
        border-bottom:2px solid rgba(var(--primary-rgb),.8); 
        padding:5px;
    }
    .tableList tbody th{
        border-bottom:1px solid rgba(var(--primary-rgb),.2); 
        background-color:#f5f5f5;
        line-height:1.2;
    }
    .tableList tbody td{
        border-bottom:1px solid #e1e1e1; 
        position:relative;
        line-height:1.2;
        word-wrap:break-word;
        padding:12px 5px;
    }
        .tableList a{
            word-break:break-all;
        }
        .tableList .btn,
        .tableList [type='button']{
            font-size:.85rem;
            padding-left:5px; padding-right:5px;
        }

/*-------------------------------------------
Table (content)
-------------------------------------------*/
.tableContent{
    margin:0 auto;
}
    .tableContent caption{
        color:#000;
        font-size:1.4rem; line-height:1.2; font-weight:bold;
        text-align:left;
        padding:10px 0;
        border-bottom:1px solid #ccc;
    }
    .tableContent th, .tableContent td{
        padding:10px;
    }
    .tableContent tbody tr:first-child th{
        border-top:1px solid #ccc;
    }
    .tableContent tbody th{
        border-bottom:1px solid #e1e1e1;
        background-color:#f5f5f5; 
        text-align:right;
        color:#000;
        letter-spacing:1.05px;
    }
    .tableContent tbody tr:first-child td{
        border-top:1px solid #e1e1e1;
    }
    .tableContent tbody td{
        border-bottom:1px solid #e1e1e1;
        position:relative;
        word-wrap:break-word;
    }
        .tableContent a{
            word-break:break-all;
        }

/*-------------------------------------------
Common
-------------------------------------------*/
.floatL{float:left;}
.floatR{float:right;}
.hidden{display:none;}
.explanation{color:#C60; font-size:.85rem; line-height:1.2; padding:5px 0;}
.required{color:red !important;}
.important{color:red;}
.noneData{color:#333; text-align:center; clear:both; padding:20px; background-color:#fdf8ea;}

/*-------------------------------------------
Alert Information
-------------------------------------------*/
.alert{padding:20px;}
.alertInfo{
    background:#fefcf0; 
    border:2px solid #ffd800;
    font-size:16px; color:#111;
    text-align:center; 
    padding:25px 20px;
    margin:10px 0 20px;
    border-radius:8px;
}
    .alertInfo a{
        color:#09F;
    }
    /* error */
    .alertError{
        background:#fdf1f1;
        border:1px solid #e4b6b6;
    }

/*-------------------------------------------
Attachment
-------------------------------------------*/
.attachment{
    position:relative;
    border-top:1px solid #ddd;
    padding:15px 0;
    line-height:1.2;
}
    .attachmentLabel{
        display:block;
        padding-bottom:5px;
    }
    .attachment ul{
        list-style:none; margin:0; padding:0;
    }
        .attachment ul li{
            float:left;
            padding:0 5px 5px 0;
        }
            .attachment a{
                display:inline-block;
                background-image:url(../images/icon_file@2x.png);
                background-repeat:no-repeat;
                background-position:15px 50%;
                background-size:16px 16px;
                background-color:#fff;
                padding:9px 15px 9px 38px;
                border:1px solid #aaa;
                border-radius:3px;
                color:#333;
                font-size:13px; line-height:18px;
                transition:.2s;
            }
            .attachment a:hover{
                color:#000;
                background-color:#f4f4f4;
                box-shadow:0 1px 3px rgba(0,0,0,.2);
            }
            .attachment a[href *='.pdf']{background-image:url(../images/icon_pdf@2x.png);}
            .attachment a[href *='.doc'], .attachment a[href *='.docx']{background-image:url(../images/icon_word@2x.png);}
            .attachment a[href *='.xls'], .attachment a[href *='.xlsx']{background-image:url(../images/icon_excel@2x.png);}
            .attachment a[href *='.ppt'], .attachment a[href *='.pptx']{background-image:url(../images/icon_powerpoint@2x.png);}
            .attachment a[href *='.jpg'], .attachment a[href *='.JPG'], 
            .attachment a[href *='.png'], .attachment a[href *='.PNG']{background-image:url(../images/icon_img@2x.png);}
            .attachment a[href *='.rar']{background-image:url(../images/icon_rar@2x.png);}
            .attachment a[href *='.zip']{background-image:url(../images/icon_zip@2x.png);}

/*-------------------------------------------
Input, Select, Textarea
-------------------------------------------*/
[type=text], [type=password], [type=email], [type=tel], [type=date], textarea, select{
    -webkit-appearance:none; appearance:none;
    font-family:inherit;
    font-size:16px; line-height:18px;
    padding:9px 10px; 
    margin:0 0 2px;
    background-color:#fff;
    box-shadow:inset 0 1px 3px rgba(0,0,0,.15);
    border:1px solid #bbb; 
    transition:.2s; -moz-transition:.2s; -webkit-transition:.2s;
}
select{
    padding:9px 25px 9px 10px;
    background-image:url(../images/select_arrow.svg);
    background-repeat:no-repeat;
    background-position:right center;
    background-size:24px 24px;
}
select::-ms-expand{
    display:none;
}
textarea{
    resize:vertical;
    width:100%;
}
input.datepicker, input.date{
    width:120px;
}
[type=text]:focus, [type=password]:focus, [type=email]:focus, [type=date]:focus,
textarea:focus,
select:focus{
    outline:0;
    background-color:#fff;
    border:1px solid #1ea1f3 !important;
    box-shadow:0 0 5px rgba(35,173,244,.4);
}
/*-------------------------------------------
Radio & Checkbox
-------------------------------------------*/
[type=radio], [type=checkbox]{
    margin:0; padding:0;
    display:none;
}
[type=radio] + label, 
[type=checkbox] + label{
    display:inline-block;
    position:relative;
    padding-left:35px;
}
[type=radio] + label::before, 
[type=checkbox] + label::before{
    display:inline-block;
    content:"  ";
    height:24px;
    line-height:24px;
    padding-left:28px;
    vertical-align:-7px;
    background-repeat:no-repeat;
    background-position:50% 50%;
    background-size:cover;
    position:absolute; left:0;
}
[type=radio] + label::before{
    background-image:url(../images/icon-radio.svg);
}
[type=checkbox] + label::before{
    background-image:url(../images/icon-checkbox.svg);
}
/* checked */
[type=radio]:checked + label::before{
    background-image:url(../images/icon-radio-checked.svg);
}
[type=checkbox]:checked + label::before{
    background-image:url(../images/icon-checkbox-checked.svg);
}
/* disabled */
[type="radio"]:disabled + label::before,
[type="checkbox"]:disabled + label::before{
    opacity:.4;
}
/*-------------------------------------------
Buttons
-------------------------------------------*/
[type=submit], [type=button], [type=reset], .btn{
    -webkit-appearance:none; appearance:none;
    display:inline-block;
    text-align:center; vertical-align:top;
    text-decoration:none;
    font-family:inherit;
    color:#fff;
    line-height:18px;
    background-color:#1ea1f3;
    border:none;
    border-radius:30px;
    padding:10px 15px;
    margin:0 0 2px;
    box-shadow:inset 0 0 0 1px transparent, inset 0 0 0 1px transparent, 0 3px 8px rgba(0,0,0,.2);
    transition:.2s; -webkit-transition:.2s;
    cursor:pointer; 
    outline:none;
    position:relative; z-index:1;
}
input.btnSecondary, .btn.btnSecondary, [type="reset"]{
    color:#1ea1f3;
    background-color:#fff;
    box-shadow:inset 0 0 0 1px #1ea1f3, inset 0 0 0 1px transparent, 0 3px 8px rgba(0,0,0,.2);
}
[type=submit]:hover, [type=button]:hover, [type=reset]:hover, .btn:hover,
[type=submit]:focus, [type=button]:focus, [type=reset]:focus, .btn:focus{
    color:#fff !important;
    box-shadow:inset 0 0 0 1px transparent, inset 0 0 30px 30px rgba(0,0,0,.2), 0 0 0 rgba(0,0,0,.0);
}

.buttons{
    text-align:center;
    padding:30px 0 0; 
    position:relative;
}
    .buttons [type=submit], .buttons [type=button], .buttons [type=reset], .buttons .btn{
        padding:14px 30px; 
        font-size:1.25rem; line-height:1;
        margin:0 15px;
    }
@media screen and (max-width:440px){/* i16 Pro Max */
    .buttons [type=submit], .buttons [type=button], .buttons [type=reset], .buttons .btn{
        padding:14px 20px; 
        font-size:1.15rem;
        margin:0 8px;
    }
}

/*-------------------------------------------
Footer
-------------------------------------------*/
footer{
    min-height:125px;
    text-align:center;
    padding:40px 0;
    border-top:9px solid #ead38c;
    color:#fff;
    font-size:.85rem; line-height:1.5;
}
    footer a{
        color:#fff;
    }
    footer a:focus,
    footer a:hover{
        color:#fff;
        opacity:.8;
    }
    .visitors{
        padding-left:10px;
        opacity:.5;
    }
    .recommendBrowsers{
        color:#000;
        font-size:.75rem;
        opacity:.8;
    }
    .designedByHuaweb{
        color:#000;
        font-size:.75rem;
        opacity:.2;
    }
@media screen and (max-width:992px){
    footer{
        font-size:.75rem;
    }
        .recommendBrowsers{
            display:none;
        }
        .designedByHuaweb{
            display:block;
        }
}
@media screen and (max-width:440px){/* i16 Pro Max */
    .copyrightYear,
    .visitors{
        display:block;
    }
}

/*-------------------------------------------
UI Dialog
-------------------------------------------*/
.speech-dialog{
    border:none !important;
    background-color:rgba(0,0,0,.7);
    color:#fff !important;
}
    .speech-dialog .ui-dialog-titlebar{
        display:none;
    }
    .speech-dialog .ui-dialog-content{
        color:#fff !important; font-size:1.5rem;
        height:auto!important;min-height:24px;height:24px;
        text-align:center !important;
        padding-top:25px !important; padding-bottom:25px !important;
    }
    .speech-dialog .ui-dialog-icon{
        display:block;
        height:80px;
        background-size:80px 80px;
        background-position:50% 50%;
        background-repeat:no-repeat;
        background-size:80px 80px;
        margin-bottom:18px;
    }
    .speech-dialog .ui-dialog-program{background-image:url(../images/dialog-icon-favicon@2x.png?20160728);}
    .speech-dialog .ui-dialog-save{background-image:url(../images/dialog-icon-save@2x.png?20160728);}
    .speech-dialog .ui-dialog-delete{background-image:url(../images/dialog-icon-delete@2x.png?20160728);}
    .speech-dialog .ui-dialog-send{background-image:url(../images/dialog-icon-send@2x.png?20160728);}
    .speech-dialog .ui-dialog-mail{background-image:url(../images/dialog-icon-mail@2x.png?20160728);}
    .speech-dialog .ui-dialog-buttonpane{
        border:none !important;
        background:none!important;
        text-align:center !important;
    }
        .speech-dialog .ui-dialog-buttonpane .ui-dialog-buttonset{
            float:none !important;
        }
            .speech-dialog .ui-dialog-buttonpane .ui-dialog-buttonset .ui-button-text{
                background:#fff !important;
                outline:none !important;
                border:none !important;
            }


/*-------------------------------------------
Upgrade New Browser
-------------------------------------------*/    
#upgradeNewBrowser{
    width:760px;
    position:fixed; left:50%; margin-left:-380px; top:220px; z-index:1000;
    padding:30px;
    border:3px solid #ec1616;
    border-radius:8px;
    background-color:#fffee8;
    color:#000;
    box-shadow:0 5px 12px rgba(0,0,0,.2);
    -webkit-animation-delay:.5s;animation-delay:.5s;
}
    #upgradeNewBrowser .btnClose{
        color:#fff;
        background-color:#ec1616;
        padding:10px 20px;
        margin-top:10px;
    }
@media screen and (max-width:992px){
    #upgradeNewBrowser{
        display:none !important;
    }
}