html {
    height: 100%;
}

html, button, input, select, textarea {
    color: #333;
}

body {
    font-size: 16px;
    color: #333;
    font-weight: 500;
    font-family: "微軟正黑體", "Microsoft JhengHei", "Microsoft JhengHei UI", 'Droid Sans', 'Noto Sans TC', "Nanum Gothic", "游ゴシック", YuGothic, "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo", "\5FAE\8F6F\96C5\9ED1", "微软雅黑体", "Microsoft YaHei", Arial, sans-serif;
    -webkit-font-smoothing: antialiased;
    height: auto !important;
    min-height: 100%;
    height: 100%;
    background-color: #e9f5fe;
    overflow-x: hidden;
}

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

/* 反白 */
::-moz-selection {
    background: #bce8ff;
    color: #000;
    text-shadow: none;
}

::selection {
    background: #bce8ff;
    color: #000;
    text-shadow: none;
}

/* 設置提示文字顏色 */
::-webkit-input-placeholder {
    color: #aaa;
}

::-moz-placeholder {
    color: #aaa;
}

:-ms-input-placeholder {
    color: #aaa;
}

.placeholder {
    color: #aaa;
}

.fontYellow {
    color: #fff495;
}

.fontPink {
    color: #e2007f;
}

.required {
    color: #f00;
}

.fontBold {
    font-weight: 600;
}

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

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

/* 移除fieldset預設樣式 */
fieldset {
    border: 0;
    margin: 0;
    padding: 0;
}

/* 只允許文字區域垂直調整大小 */
textarea {
    resize: vertical;
}

a {
    color: #06f;
    text-decoration: none;
}
a:hover, a:active, a:focus {
    outline: 0;
    color: #009cff;
}
h1, h2, h3, h4, h5 {
    font-family: "微軟正黑體";
}
.btn{
    font-family: "微軟正黑體", "Microsoft JhengHei", "Microsoft JhengHei UI", 'Droid Sans', 'Noto Sans TC', "Nanum Gothic", "游ゴシック", YuGothic, "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo", "\5FAE\8F6F\96C5\9ED1", "微软雅黑体", "Microsoft YaHei", Arial, sans-serif;
}
#scrollUp{
    display:none;
    width:48px; height:48px;
    background:url('/Img/arrowTop.png') 50% 50% rgba(0,0,0,.4) no-repeat;
    color:#fff;
    font-size:20px;
    border-radius:3px;
    line-height:36px;
    text-align:center;
    position:fixed; right:5px; bottom:5px;
    z-index:9998;
}

.wrapper {
    width: 700px;
    min-width: 700px;
    margin: 0 auto;
    padding: 0 20px;
    position: relative;
}

h1 {
    font-size: 60px;
    color: #333;
}

h3 {
    margin: 35px 0 15px;
}

/*
===================================================
Header
===================================================
*/
header{
    padding:20px 0 25px;
    overflow:hidden;
    background-color:#fff;
}
header #logoClinic {
    float:left;
    margin-top:14px;
}
header #logoClinic a{}
header #logoClinic a img{}
header #btnBox{
    float:right;
}
header #btnBox ul{
    margin:0; padding:0;
    list-style:none;
}
header #btnBox ul li{
    margin-left:4px;
}
header #btnBox ul li:nth-child(1){
    display:inline-block;
}
header #btnBox ul li:nth-child(2){
    display:inline-block;
}
header #btnBox ul li:nth-child(3){
    margin-top:6px;
}
header #btnBox ul li a{
    display:block;
    font-size:17px;
    letter-spacing:1px;
    font-weight:500;
    color:#fff;
}
header #btnBox ul li a span.glyphicon{
    margin-right:5px;
    font-size:13px;
}
/*
===================================================
Main Box
===================================================
*/
#mainBox {
    padding:40px 0;
    border-top:1px solid #ddd;
}
#myModal .modal-body table td .txtMsg {
    color: red;
    font-size: 14px;
    margin-top: 2px;
}
/*
===================================================
Footer
===================================================
*/
#footer {
    padding: 20px 0;
    background-color: #e9f5fe;
    border-top: 5px solid #00a4e4;
    font-size:14px;
}
#footer .textBox {
    text-align:center;
}
#footer .textBox p{
    margin:2px 0;
}

/*
--------------------------------------------------------------------
Media Device Size
--------------------------------------------------------------------
*/


/*
----------------------------------------
700
----------------------------------------
*/
@media screen and (max-width:700px) {
    .wrapper {
        width: 100%;
        min-width: 100%;
    }
    /*header*/
    header #logoClinic {
        float: none;
        text-align: center;
        margin-bottom:20px;
    }
    header #btnBox {
        float: none;
        text-align:center;
    }
    header #btnBox ul li:nth-child(1){width:60%;}
    header #btnBox ul li:nth-child(2){width:36%;}
    header #btnBox ul li a{ padding:6px 5px;}
}
/*
----------------------------------------
    i6 Plus 414
----------------------------------------
*/
@media screen and (max-width:480px){
    h1 {
        font-size: 48px;
    }

    h3 {
        margin: 30px 0 10px;
    }
    #mainBox{
        padding-top:30px;
    }
    /*表單欄位*/
    #myModal .modal-body table.inputForm tbody th,
    #myModal .modal-body table.inputForm tbody td{
        display:block;
        text-align:left;
        padding-top:10px;
        padding-bottom:10px;
    }
    #myModal .modal-body table.inputForm tbody th{
        padding-left:5px;
        padding-right:5px;
        background-color:#e4f4ff;
        border-radius:5px;
    }
    #myModal .modal-body table.inputForm tbody td div.col-md-10,
    #myModal .modal-body table.inputForm tbody td div.col-md-12{
        padding:0;
    }
}
/*
----------------------------------------
    i7
----------------------------------------
*/
@media screen and (max-width:375px){
    .wrapper{
        padding:0 10px;
    }
}

/*
----------------------------------------
    i5
----------------------------------------
*/
@media screen and (max-width:320px){
    #footer{
        font-size:13px;
    }
}