@import url("../css/normalize.css");
@import url(https://fonts.googleapis.com/css?family=Carme|Open+Sans:400,700);
/* HTML5 Boilerplate */
html, button, input, select, textarea {color:#333;}
body{
    font-size:1em;
    line-height:1.4;
    font-family:'Microsoft JhengHei', "微軟正黑體", "Helvetica Neue", "Helvetica", Arial, sans-serif;
    text-rendering:optimizeLegibility;
    -webkit-font-smoothing:antialiased;
    -moz-osx-font-smoothing:grayscale;
    image-rendering:-webkit-optimize-contrast;
}

::-moz-selection {background:#b3e0fc; text-shadow:none;}
::selection {background:#b3e0fc; text-shadow:none;}

hr{display:block; height:1px; border:0; border-top:1px solid #ccc; margin:1em 0; padding:0;}

/* 移除圖片底下間隙 */
img{vertical-align: middle;}

/* 移除fieldset預設樣式 */
fieldset{border:0; margin:0; padding:0;}

a,a:hover, a:active, a:focus{outline:0;}
/* --- ! --- */


/* --- Alert Information --- */
.alert-info{
    padding:1em;
    line-height:180%;
    background:#fdf8ea;
    border:1px solid #fad993;
    margin:5px 0;
    text-align:center;
}
.alert-info.warning{
    color:#b3002d;
    background:#ffe8ee;
    border-color:#ffb9cb;
}
    .alert-info p{
        color:#31708f;
        text-align:center;
        padding:1.2em;
        margin:0;
    }
    .alert-info .msg{
        color:#111;
        font-size:15px;
    }
    .alert-info #sec{
        color:#0b5fd0;
        padding:5px;
    }
    .alert-info a{
        color:#06F;
        text-decoration:none;
    }
    .alert-info a:hover{
        text-decoration:underline;
    }
/* --- ! --- */


/* --- GLOBAL --- */
.upgrade_your_browser{
    font-size:12px;
    background:#fffdc6;
    padding:5px;
    text-align:center;
}
.wrapper{width:980px; margin:0 auto;}
#wide-bg{background:url(../images/bg-wide.png) 0 0 repeat-x;}
#bg{background:url(../images/bg-normal.png) 0 0 repeat-x;}

/* 設置提示文字顏色 */
::-webkit-input-placeholder{color:#aaa;}
:-moz-placeholder{color:#aaa;}
.placeholder{color:#ccc;}
.redFont{color:#f00;}
/* --- ! --- */


/* --- HEADER --- */
#header-container{
    height:134px;
    background:url(../images/top-bg.jpg) center 0 #a1e0eb no-repeat;
}
    #header-container header{
        width:980px;
        height:101px;
        margin:0 auto;
        position:relative; z-index:999;
    }
        #header-container header h1{
            background:url(../images/anesth-logo.png) no-repeat;
            width:335px;
            height:91px;
            text-indent:-9999em;
            margin:0;
        }
        #header-container header h2{
            display:none;
        }

#top-right{
    font-size:12px;
    color:#666;
    text-align:right;
    top:16px; right:10px;
}
    #top-right a{
        color:#111;
        text-decoration:none;
        margin:0 5px;
    }
    /* --- LOGIN INFORMATION --- */
    #top-right table{
        background:url(../images/top-link-bg.png);
        margin-top:10px;
        border-radius:5px;
    }
        #top-right table td{
            padding:8px;
        }
            #top-right .text{
                width:130px;
            }
            #top-right table .code{
                display:inline-block;
                background:url(../images/code_mask.png) 50% 50%;
                color:#111;
                font-size:16px; font-weight:700;
                font-style:italic;
                line-height:31px;
                height:31px;
                padding:0 3px;
                vertical-align:top;
            }

    #login-info{
        font-size:12px;
        color:#ccc;
        padding:15px 40px;
    }
    #login-info span{
        color:#111;
    }
    #login-info .logout{
        color:#d81b2b;
        text-decoration:none;
    }
    /* --- ! --- */
/* --- ! --- */


/* --- NAV TOP --- */
#header-container nav{
    margin:0 auto;
    width:980px;
    height:33px;
    background:url(../images/top-menu-bg.jpg) center bottom no-repeat;
}
    #menu{
        list-style:none;
        margin:0 auto;
        width:970px;
        position:relative; z-index:9999;
    }
    #menu > li{
        float:left;
        position:relative;
        height:33px;
    }
        #menu li a{
            display:block;
            text-decoration:none;
        }
        #menu li a:hover, #menu li a:active{
            text-decoration:none;
            transition:.2s;
        }
        #menu .menulink{
            color:#fff;
            font-size:14px; line-height:34px;
            padding:0 17px;
            height:33px;
        }
        #menu .menulink:hover{
            color:#59c3f7;
        }
            /*--- lv2 ---*/
            #menu li ul{
                display:none;
                position:absolute; top:33px; left:0; z-index:101;
                background:#fff;
                opacity:0;
                padding:0;
                margin:0;
                min-width:100%;
                white-space:nowrap;
                box-shadow:0 3px 12px rgba(0,0,0,.2);
            }
                #menu li ul li{
                    position:relative;
                    border-bottom:1px solid rgba(0,0,0,.2);
                    font-size:13px;
                    width:100%;
                }
                    #menu li ul li a{
                        padding:8px 10px;
                        color:#111;
                        line-height:18px;
                        border-left:3px solid #0c93d4;
                    }
                    #menu li ul li a:hover{
                        color:#000;
                        background-color:#86d9f5;
                    }
                    #menu .sub{
                        background:url(../images/arrow.gif) 95% center no-repeat;
                    }
                    /*--- lv3 ---*/
                    #menu li ul ul{
                        top:0px;
                    }
                        #menu li ul ul a{
                            border-left-width:1px;
                        }
/* --- ! --- */


/* --- CONTAINER --- */
#content-container-bg{
    display:block;
    background:#e3e3e3;
    width:100%;
    height:auto!important;min-height:540px;height:540px;
}
#content-container{
    margin:0 auto;
    width:980px;
}
#content-container aside{
    float:left;
    width:180px;
    margin:0; margin-left:5px;
    background:#0b92d3;
    height:100%;
    box-shadow:0 0 0 rgba(0,0,0,.3), 3px 0 3px rgba(0,0,0,.1);
}
#content{
    float:right;
    width:760px;
    margin-right:5px;
    padding-top:25px;
    position:relative;
    /*font-family:Helvetica, Arial, "微軟正黑體", "Microsoft JhengHei", serif;*/
}
#content-container #content{
    margin:0;
}
    #content article{
        font-size:.8em;
        word-wrap:break-word;
        word-break:normal;
    }
    #content article.main-content{
        background:#fff;
        height:auto!important;min-height:660px;height:660px;
        padding:18px 18px 34px;
        margin-bottom:24px;
        border:1px solid #cecece;
        box-shadow:0 1px 3px rgba(0%,0%,0%,.3);
        word-wrap:break-word;
        word-break: normal;
}
#content article header{
    position:relative;
    clear:both;
}
    #content article header .title{
        margin:0;
        color:#0c91d2;
        font-size:21px;
        font-family:Helvetica, "Microsoft JhengHei", "微軟正黑體", Arial,  serif;
        padding:5px 0;
        margin-bottom:15px;
        border-bottom:2px solid #ddd;
    }
        #content article header .title small{
            float:right;
            padding-right:5px;
        }
            #content article header .title small .button{
                box-shadow:none;
                position:relative;
                margin-right:-5px;
            }
            #content article header .title small .btn-first{
                border-top-right-radius:0; border-bottom-right-radius:0;
            }
            #content article header .title small .btn-center{
                border-radius:0; border-radius:0;
            }
            #content article header .title small .btn-last{
                border-top-left-radius:0; border-bottom-left-radius:0;
            }
            #content article header .title small .disabled{
                color:#999;
                border-color:#ddd;
                background:#fff;
                z-index:10;
                cursor:default;
            }
/* --- ! --- */


/* --- NAV LEFT --- */
#left-menu,
#left-menu *{
    -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box;
}
    #left-menu h4{
        margin:0;
        background-color:#0b92d3;
        box-shadow:inset 0 1px 0 rgba(0,0,0,.15);
        color:#fff;
        font-size:16px; line-height:1; font-weight:700;
        height:34px;
        padding:9px 10px 7px;
        position:relative;
    }
        #left-menu h4 > a{
            display:block;
            color:#fff;
            padding:9px 10px 7px;
            position:absolute; top:0; left:0;
            width:100%;
            height:100%;
        }
        #left-menu h4.doctor > a{
            background-image:url(../images/icon-photo-view.png);
            background-repeat:no-repeat;
            background-position:right 10px center;
            background-size:24px auto;
        }
    #left-menu ul{
        list-style:none;
        margin:0;
        padding:0;
        background-color:#fff;
        font-size:14px;
    }
        #left-menu a{
            text-decoration:none;
            color:#111;
            display:block;
            transition:.2s;
        }
        #left-menu a:hover{
            color:#000;
            background-color:#86d9f5;
        }
        #left-menu ul li a{
            line-height:24px;
            background-image:url(../images/menu-icon1.png);
            background-position:10px center;
            background-repeat:no-repeat;
            padding:3px 0 3px 25px;
            border-bottom:1px solid #d3d3d3;
        }
            #left-menu ul.lv2 li a{
                background-image:url(../images/menu-icon2.png);
                background-position:25px center;
                padding-left:40px;
            }
/* --- ! --- */


/* Sub Menu */
#sub-menu{
    list-style:none;
    padding:0;
    margin:0 auto 15px;
    border-bottom:1px solid #ddd;
}
    #sub-menu li{
        float:left;
        font-size:12px;
        text-align:center;
    }
        #sub-menu li a{
            display:block;
            text-decoration:none;
            padding:3px 8px;
            border:1px solid #ccc;
            background:#f4f4f4;
            color:#06C;
            margin:4px 0 -1px -1px;
        }
        #sub-menu li a:hover{
            background:#bfe9ff;
        }
        #sub-menu li a.current{
            color:#111;
            border-bottom:1px solid #fff;
            background:#fff;
            padding:5px 13px;
            margin:0 0 -1px -1px;
        }
        #sub-menu li a.current:hover{
            text-decoration:none;
            cursor:default;
        }
/* --- ! --- */


/* --- BREADCRUMB --- */
#breadcrumb{
    color:#999;
    font-size:12px; line-height:18px;
    text-align:right;
    margin-top:-20px; margin-bottom:5px;
    padding-right:5px;
}
    #breadcrumb a{
        color:#999;
        text-decoration:none;
    }
/* --- ! --- */


/* --- SEARCH --- */
#search-block{
    -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box;
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    background-color:#e4f6ff;
    border:1px dotted #9bc8e8;
    color:#333;
    font-size:13px;
    margin-bottom:15px;
    padding:8px 10px 8px;
    text-align:left;
}
    #search-block *{
        -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box;
    }
    #search-block .search-col{
        position:relative;
        padding:3px;
        line-height:1.2;
    }
    #search-block .col-1{width:8.33%;}
    #search-block .col-2{width:16.66%;}
    #search-block .col-3{width:25%;}
    #search-block .col-4{width:33.33%;}
    #search-block .col-5{width:41.66%;}
    #search-block .col-6{width:50%;}
    #search-block .col-7{width:58.33%;}
    #search-block .col-8{width:66.66%;}
    #search-block .col-9{width:75%;}
    #search-block .col-10{width:83.33%;}
    #search-block .col-11{width:91.66%;}
    #search-block .col-12{width:100%;}
    #search-block .col-auto{
        flex:1;
    }
    #search-block input[type=text],
    #search-block select{
        background:#fff;
        height:32px;
        margin-bottom:0;
    }
    #search-block input[type=submit],
    #search_block input[type=button]{
        width:60px;
        font-size:13px;
        border-color:#aaa;
    }
    #search-block input[type=submit]{
        float:right;
        margin-left:10px;
        margin-bottom:0;
    }
/* --- ! --- */


/* --- PAGE --- */
.page{
    font-size:12px;
    margin:0;
    padding-top:20px;
    text-align:center;
    border-top:1px solid #e3e3e3;
}
    .page span a, .page span a:hover,
    .page .current,
    .page .disabled{
        padding:3px 3px;
        margin:2px 0;
        border-radius:5px;
        line-height:28px;
    }
    .page a{
        color:#333;
        border:1px solid #ccc;
        cursor:pointer;
        text-decoration:none;
    }
    .page a:hover{
        color:#fff;
        background:#333;
        border:1px solid #333;
    }
    .page .current{
        color:#333;
        font-weight:bold;
        background:#fff;
        border:1px solid #fff;
    }
    .page .disabled{
        color:#ddd;
        border:1px solid #ddd;
    }
/* --- ! --- */


/* --- BANNER --- */
#banners1{
    list-style:none;
    margin:0;
    padding-top:10px;
    height:auto!important;min-height:250px;height:250px;
}
    #banners1 li{
        padding:0 0 10px;
        text-align:center;
    }
        #banners1 li img{
            margin:0 auto;
        }

.banners2-container{
    padding:15px 0;
}
    .banners2 *{box-sizing:border-box;}
    .banners2-title{
        margin:0 0 10px;
        font-size:16px;
}
    .banners2-list{
        list-style:none;
        margin:0;
        padding:0;
        display:-ms-flexbox;
        display:flex;
        -ms-flex-wrap:wrap;
        flex-wrap:wrap;
    }
        .banners2-list li{
            flex:0 1 auto;
            width:33.33333%;
            height:auto!important;min-height:70px;height:70px;
            position:relative;
            text-align:center;
            justify-content:center;
            align-items:center;
            color:#0b92d3;
            font-weight:700;
        }
            .banners2-list li div{
                padding:10px;
                background-color:#fff;
                box-shadow:0 1px 3px rgba(0%,0%,0%,.3);
            }
/* --- ! --- */


/* --- FOOTER --- */
footer{
    margin:0;
    padding-bottom:24px;
    background:url(../images/footer-bg.jpg) center 0 repeat-x #fff;
    height:134px;
    font-size:12px;
}
    footer address{
        display:block;
        width:980px;
        margin:0 auto;
        color:#333;
        font-size:12px; line-height:18px; font-style:normal;
    }
        footer address figure{
            display:block;
            float:left;
            width:250px;
            height:55px;
            padding:40px 8px;
        }
        footer address a{
            color:#333;
            text-decoration:none;
        }
        footer address ul{
            width:685px;
        }
            footer address ul li{
                float:left;
                margin-right:18px;
                padding-top:10px;
            }
                footer address ul li strong{
                    display:block;
                }
        footer address p{
            float:right;
            width:685px;
            margin:0;
            padding-top:12px;
            padding-bottom:15px;
            border-top:1px dotted #aaa;
        }
/* --- ! --- */


/* Top */
.scrollup{
    background:url(../images/icon_top.png) no-repeat;
    width:40px; height:40px;
    text-indent:-9999px;
    position:fixed; bottom:50px; right:3%;
    display:none;
}

/* Hide from both screenreaders and browsers */
.hidden{
    display:none !important;
    visibility:hidden;
}

/* Clearfix: contain floats */
.clearfix:before,
.clearfix:after{
    content: ""; /* 1 */
    display: table; /* 2 */
}
.clearfix:after{
    clear: both;
}
/* For IE 6/7 only */
.clearfix{*zoom: 1;}


/* --- COMM --- */
.box{box-sizing:border-box; overflow-x:auto;}
.ul-nostyle{ padding:0px 0px 0px 0px; list-style:none;}
.maxWidth { width:100%;}
.maxHeight { height:100%; margin:0 auto;}
.floatL{ float:left; }
.floatR{ float:right; }
.relative{ position:relative;}
.fixed{ position:fixed;}
.absolute{position:absolute;}
.explanation{font-size:12px; color:#C60; font-weight:normal;}
.required{color:#f00; font-weight:normal;}
.important{color:#f00;}
table tr.even{background:#f7f7f7;}
table tr.odd{background:#fff;}
.none{color:#999; text-align:center;}
.ui-datepicker-trigger{margin-left:3px; height:24px; width:24px;}
.ui-datepicker{
    box-shadow:0 5px 12px rgba(0,0,0,.2);
}
.ui-datepicker .ui-datepicker-title select{
    font-size:16px;
    padding:2px 3px;
}
.ui-datepicker .ui-datepicker-prev, .ui-datepicker .ui-datepicker-next,
.ui-datepicker .ui-datepicker-prev-hover, .ui-datepicker .ui-datepicker-next-hover{
    top:4px;
}

.tooltip{
    display:none;
    position:absolute;
    padding:10px;
    color:#333; font-size:13px;
    background-color:#fffbd8;
    border:1px solid #efd294;
    box-shadow:0 1px 3px rgba(0,0,0,0.3);
    border-radius:3px;
}
/* --- ! --- */

.table-responsive{
    width:100%;
    white-space:nowrap;
    overflow-x:auto;
    overflow-y:hidden;
}

/* --- Form, Input, Select, Textarea --- */
form{
    display:inline;
}
input[type=text], input[type=password], input[type=email], input[type=tel], input[type=date], textarea, select{
    background:#fff;
    border:1px solid #bbb;
    border-radius:3px;
    box-shadow:inset 0 1px 2px #ddd, 0 1px 1px rgba(100%,100%,100%,.4);
    margin-bottom:2px;
    padding:7px 4px;

}
textarea{
    resize:vertical;
}
select{
    border:1px solid #ccc;
    padding:3px 4px;
}
input[type=text]:focus, input[type=password]:focus, input[type=email]:focus, input[type=date]:focus, textarea:focus, select:focus{
    outline:0;
    background:#fffeee;
    border:1px solid #67cfff;
    box-shadow:0 0 3px rgba(123,211,255,0.8), inset 0 1px 2px #ddd;
    webkit-appearance:none;
}
#search-block input.date{width:80px;}
/* --- ! --- */


/* --- Buttons --- */
input[type=submit], input[type=button], input[type=reset], a.button, .buttons a{
    -webkit-appearance:none;
    display:inline-block; *display:inline; *zoom:1;
    vertical-align:top; text-align:center;
    background:url(../images/btn-bg.png) 0 bottom repeat-x #fff;
    color:#0b91d3; font-weight:bold; font-size:13px;
    padding:5px 8px;
    border:1px solid #0b91d3;
    border-radius:3px; -moz-border-radius:3px; -webkit-border-radius:3px;
    box-shadow:0 1px 3px rgba(0%,0%,0%,.3); -moz-box-shadow:0 1px 3px rgba(0%,0%,0%,.43); -webkit-box-shadow:0 1px 3px rgba(0%,0%,0%,.3);
    cursor:pointer;
    text-decoration:none;
}
input[type=submit]:hover, input[type=button]:hover, input[type=reset]:hover, a.button:hover, .buttons a:hover{
    background:#0a86cc;
    color:#fff;
    text-decoration:none;
}

.buttons{text-align:center;    padding-top:20px; border-top:1px solid #e3e3e3;}
.buttons input[type=submit], .buttons input[type=button], .buttons input[type=reset], .buttons a,  .buttons a.button{
    padding:8px 20px;
}
/* --- ! --- */


/* --- Social Share --- */
#social-share{float:right;}
#social-share a{
    display:block;
    width:32px; height:32px;
    background-image:url(../images/icon-social.png?v=20230811);
    background-repeat:no-repeat;
    background-size:32px auto;
    text-indent:-9999em;
    float:left;
    margin-left:5px;
    border-radius:5px;
}
#social-share .fb     {background-position:0 0;}
#social-share .twitter{background-position:0 -64px;}
#social-share .plurk  {background-position:0 -96px;}
#social-share .line{background-position:0 -128px;}
/* --- ! --- */
#validate_image{
    display:inline-block;
    vertical-align:top;
    height:34px;
    width:auto !important;
}