* {font-family: "Helvetica", "Arial","LiHei Pro","黑體-繁","微軟正黑體", sans-serif;} 
img { height: auto;max-width: 100%; }
body {background: url("bg.jpg") scroll repeat center top;}

.img-fluid {width: 100%;}
.img_shadow{filter:drop-shadow(0px 5px 3px rgba(0,0,0,.5)) ;}
.img_shadow_w{filter:drop-shadow(0px 5px 3px rgba(255,255,255,.8)) ;}

hr {border-top: 1px solid #fa0;margin-top: 10px;margin-bottom: 10px;}

h2,h3 {font-weight: 600;line-height:1.2;}
h4,h5 { margin-top: 20px; }
h2{ font-size:4.5rem;} 
h3{ font-size:3.5rem;}
h4 { font-size:2.8rem;}
h5,.panel-title{ font-size:2.4rem;}
h6,.btn,li { font-size:2rem;line-height:1.6;}
p,body { font-size:1.6rem;line-height:1.6;}

.btn {padding: 4px 16px 2px; margin:3px auto;border-radius: 15px;}
.btn-lg {font-size:2.7rem;padding: 6px 25px 3px;}
.btn-md {font-size:2.1rem;}
.btn-xs {font-size:1.4rem;border-radius: 10px;padding: 2px 5px 0;}
.btn-secondary {margin:0 auto;}

small { font-size: 80%;}
strong.lead,span.lead,a.lead,em.lead,ins.lead {font-size:130%;font-weight: 600;margin-bottom: 0;}
.title {margin-bottom: 30px;}

ol>li,ul>li {line-height: 1.5;}
ol li li::marker{
   content: counters(list-item,"-",list-item)" ";
   color:#777;
}
ul.disc>li {list-style:disc;}
ul.square>li {list-style-type: square;} 
ol.sort>li {list-style: decimal;}


a,a:link,a:visited,a:hover,a:focus,a:active {text-decoration: none;}
.text-link,a.text-link:link,a.text-link:visited {color:#333;}
a.text-link:hover,a.text-link:focus,a.text-link:active {color:#ea5413;}


.font_arial { font-family: Arial, Helvetica, sans-serif;}
.font_pd {font-family: "Playfair Display", serif;}
.font_my,.title {font-family: Microsoft YaHei;letter-spacing: 2px;font-weight: 600;}


.text-justify .text-center,.middle_bg p.text-center {text-align:center;}
.text-red {color:#c00;}
.text-orange,.title.text-orange {color: #ea5413;}
.text-white {color:#fff;}
.text-blue,.title {color:#1868b3;}

.title {position: relative; margin-bottom:50px}
.title h2::before {
    position: absolute;
    content: '……';
    width: 150px;
    bottom: -25px;
    left: 50%;
    transform: translateX(-50%);
    color: #ea5413;
}
.title.text-orange h2::before {color: #1868b3;}


.text-shadow_w{text-shadow: 0px 0px 10px #fff, 0px 0px 10px #fff, 0px 0px 10px #fff, 0px 0px 10px #fff, 0px 0px 10px #fff, 0px 0px 10px #fff, 0px 0px 10px #fff;}

.bg_white {background-color:#fff;}
.bg_orange {background-color: #ea5413;}
.bg_blue {background-color:#1868b3;}


.col_btn{padding-top:30px;padding-bottom:30px;}
.col_btn a,.col_link a,.col_icon a{margin:3px;}
.col_map {margin:20px auto;}
.col_map iframe{border-radius: 15px;}

.btn-warning {
  background-color: #ea5413;
  border-color: #ea5413;
}
.btn-warning:hover {
  background-color: #1868b3;
  border-color: #1868b3;
}


.col_mt {margin-top:40px;}
.col_mb {margin-bottom:40px;}
.col_pt {padding-top:30px;}
.col_pb {padding-bottom:50px;}



.flex {display: flex; align-items: start;}
.flex-end {align-items: flex-end;}
.flex-center {align-items: center;}
.flex-wrap {flex-wrap: wrap;} 
.flex-jc-c {justify-content:center;}


/*------------Bootstrap------------*/
.pull-left {margin-right:10px}
.pull-right {margin-left:10px}

.well,.alert,.panel,.panel-heading,.img-rounded,.img-thumbnail {border-radius: 15px;}
.panel-heading {border-bottom-right-radius: 0;border-bottom-left-radius:0;}
.panel-footer {border-bottom-right-radius: 14px;border-bottom-left-radius: 14px;}


.well h2,.well h3,.well h4,.well h5,.well h6{margin-top:0;}
.panel-heading h2,.panel-heading h3,.panel-heading h4,.panel-heading h5,.panel-heading h6,.panel-body p,
.alert h2,.alert h3,.alert h4,.alert h5,.alert h6,.alert p,.well p {margin:0 auto;}

.alert {padding:10px;}
.alert-primary {
  color: #fff;
  background-color: #1868b3;
  border-color: #1868b3;
}
.alert-orange,.panel-orange > .panel-heading  {color: #fff;background-color: #ea5413;border-color: #ea5413;}
.panel-orange {border-color: #ea5413;}

.panel-light { border-color: #ccc;}
.panel-light > .panel-heading { border-color: #ccc;background-color:#eee;}
.panel-warning2 {border-color: #ea5413;}
.panel-warning2 > .panel-heading{background-color: #ea5413;border-color: #ea5413;color: #fff;}


.card {
  position: relative;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: column;
  flex-direction: column;
  min-width: 0;
  word-wrap: break-word;
  background-color: #fff;
  background-clip: border-box;
  border: 1px solid rgba(0,0,0,.125);
  border-radius: 15px;
  margin-bottom: 20px;
}
.card-img-top {
  width: 100%;
  border-top-left-radius: calc(15px - 1px);
  border-top-right-radius: calc(15px - 1px);
}
.card-img-bottom{
border-bottom-right-radius: calc(15px - 1px);
border-bottom-left-radius: calc(15px - 1px);
}
.card-body {
  -ms-flex: 1 1 auto;
  flex: 1 1 auto;
  padding: 15px;
}
.card-body .list-group { margin-bottom: 0;}

.card-title{margin-top:0; font-weight:600;}
.card-title small,.card-title strong,.card-title span,.card-title em { margin-left:5px;} 







/*------------NAV------------*/
ol,ul {list-style: none;}
.navbar-brand {padding: 15px 10px;height: auto;}
.navbar-brand > img {width: 12vw;}
.navbar-default {
border-radius: 0;
border-bottom-right-radius: 10px;
border-bottom-left-radius: 10px;
min-height: auto;
margin-bottom: 0;}
.navbar-default .navbar-nav > li > a {color: #1868b3;}
.navbar-default .navbar-nav > li > a.disabled {pointer-events: none;}
.navbar-right {margin-top:25px;}
.navbar-nav > li > a.dropdown {padding-right:30px;}

        ul.nav>li {
            position: relative;
        }
        ul.nav>li a:hover {
            text-decoration: none;
            background:rgba(255,255,255,0.4);
            color:#ea5413;
        }
       
        ul.nav>li ul>li{
            border-left: solid 1px #ccc;/*選單側邊線顏色*/
        }
        ul.nav>li>ul>li a{
            color: #1868b3;/*選單連結顏色*/
            display: block;
            padding-top: 10px;
            padding-bottom: 10px;
            text-decoration:none;
        }
        ul.nav>li>ul>li a:hover {color:#999;}
        ul.nav>li ul>li {border-bottom: solid 1px #ccc;} /*選單隔線顏色*/
        ul.nav>li ul>li:last-child{border-bottom:0;}
        ul.nav>li>ul li>ul.sub-menu {border-top: solid 1px #ccc;}/*子選單隔線顏色*/
        ul.nav>li>ul.sub-menu li>ul.sub-menu{display:none;}
        ul.nav>li ul {padding-left:20px;}/*階層式向後退的像素*/
        ul.nav>li ul>li>a:before{
            font-family: 'FontAwesome';
            content: '\f105';
            padding-right:7px;
            padding-left:7px;
            font-size:10px;
        }



        /*桌機*/
        @media(min-width:768px) {
            ul>li>a>b.arrow:after {
                font-family: 'FontAwesome';
                content: '\f078';
                font-size: 12px;
                position: absolute;
                right: 15px;
            }
            ul>li>ul>li>a>b.arrow:after {
                font-family: 'FontAwesome';
                content: '\f078';
                font-size: 15px;
                position: absolute;
                top:0;
                right: 0;
                padding:10px 15px;
            }
            ul>li>ul>li>a>b.on:after {
                font-family: 'FontAwesome';
                content: '\f00d';
            }
            ul.nav>li:hover>a+ul {
                visibility: visible;
                opacity: 1;
            }
            ul.nav>li>ul.sub-menu {
                position: absolute;
                top: 50px;
                left: 0;
                z-index: 9999;
                background: #fff;
                width: 20vw;
                text-align: left;
                border-left: solid 1px #ededed;
                border-bottom: solid 1px #ededed;
                border-right: solid 1px #ededed;
                box-shadow: 0px 5px 2px rgba(0, 0, 0, 0.3);
                opacity: 0;
                visibility: hidden;
                -webkit-transition: all .5s;
                transition: all .5s;
            }
        }
        
        
        
@media only screen and (max-width: 1280px) { 
.navbar-brand {padding: 8px 10px;}
.navbar-brand > img {width: 15vw;}
.navbar-right {margin-top:5px;}
ul.nav>li>ul.sub-menu {top: 44px;width: 160px;}
}        
        
/*手機*/
@media(max-width:768px) {
            b.arrow:after {
                font-family: 'FontAwesome';
                content: '\f078';
                position: absolute;
                top: 3px;
                right: 0;
                padding: 10px 20px 10px 40px;
            }
            a.dropdown+ul {
                display: none;
            }
            b.on:after {
                font-family: 'FontAwesome';
                content: '\f00d';
            }
            ul.nav>li>a {border-bottom: solid 2px #ccc;}/*選單隔線顏色*/
            ul.nav>li:last-child>a {border-bottom: 0;}          
            ul.nav>li>ul.sub-menu {
                border-bottom: solid 2px #ccc;/*子選單隔線顏色*/
            }
            ul.nav>li>ul.sub-menu {width: 100%;}
            ul.nav > li > ul > li a {color: #eee;}


.navbar-nav { margin: 7.5px -15px 0;}
.navbar-default .navbar-toggle {border-color:#1868b3;background-color: #1868b3;margin-top: 12px;}
.navbar-default .navbar-toggle:focus,.navbar-default .navbar-toggle:hover {background-color: #ccc;border-color: #ccc;}
.navbar-default .navbar-toggle .icon-bar {background-color: #fff;height: 3px;}
.navbar-default .navbar-nav > li > a {border-bottom: solid 1px #4b403a;}
.navbar-brand > img {width: 22vw;}   
.navbar-right {margin-top:0;}
.navbar-collapse {border-top: 1px solid #4b403a;}            
}   

@media only screen and (max-width: 640px) { 
.navbar-brand {padding: 10px;}
.navbar-brand > img {width: 42vw;}  
}

/*------------↑ NAV ↑------------*/





/*------↓↓↓footer↓↓↓------*/
footer {padding-top:30px; padding-bottom:30px;background-color:#fbddd0; }
footer h6 { margin-bottom:0; color:#1868b3;}
footer p,footer a {line-height: 1.4; margin:0 auto; } 
footer a.link,footer a.link:link,footer a.link:visited { color:#333;}
footer a.link:hover,footer a.link:focus,footer a.link:active { color:#337ab7;}
.col_add {border-right: 1px dashed #000;border-left: 1px dashed #000;}
footer .col_btn{padding-top:10px;padding-bottom:10px;}
footer .col_btn .btn {display: block;}
footer img { margin-bottom:5px;}    


/*-----文章頁----------*/
.alert-contact { margin-top:20px;text-align: center; }
a.list-group-item .list-group-item-heading, button.list-group-item .list-group-item-heading,
a.list-group-item p {margin:0 auto;}
a.list-group-item .list-group-item-heading {
overflow:hidden;
white-space: nowrap;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 1;/*限制行數*/
-webkit-box-orient: vertical;
white-space: normal;
}
.list-group-item{color: #1868b3;}
.list-group-item h6 {line-height:1;}
.list-group-item > i {float: right;color: #999;top:3px;}
.col_article img,.col_article .col_img img{margin-bottom:15px;border-radius: 6px;}





/*------------淡入------------*/
.shape-ex1{ animation: fade 4s linear ;}
@keyframes fade {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}

/*------------移入------------*/
.shape-ex3{ animation: leftIn 2s forwards ;opacity: 0;}
@keyframes leftIn {
    	from{transform: translateX(-100px); opacity: 0;}
	to{transform: translateX(0); opacity: 1;}
}

.shape-ex2{
	opacity: 0;
	animation: ani_fadeinup 0.6s forwards ;
}
@keyframes ani_fadeinup{
	from{transform: translateY(100px); opacity: 0;}
	to{transform: translateY(0); opacity: 1;}
}


/*滑入黑底+說明*/
.hover {position: relative; }
.hover .overlay {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  height: 100%;
  width: 100%;
  opacity: 0;
  transition: .5s ease;
  background:rgba(0,0,0,0.7);
}
.hover .overlay2 {
  position: absolute;
  bottom: 0;
  background:rgba(0,0,0,0.7);   
  opacity: 1;
  height: auto;
  width: 100%;
}
.hover:hover .overlay {opacity: 1;}
.hover:hover .overlay2 {opacity: 0;}
.text {
  color: #fff;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  text-align: center;
}
.text small {color: #fff; font-size:90%;}
.hover .overlay2 h5{color: #fff;position: relative;text-align: center; margin:5px auto; line-height:1.2;}


/*--- btn-09 ---*/
.btn-09 {
position: relative;
display: inline-block;
animation: btn9scale 2s infinite;
}
@keyframes btn9scale {
  0% {transform: scale(1);}
  50% {transform: scale(1.2);}
}
.col_btn a.btn-09 {margin:10px 25px;}




    

.main {}
.main img {margin-bottom:10px;}
.home_page{ display:none;}
.topimg {margin-top:50px; }





/*------------Home------------*/
#w1 {
background: url("002a.png") scroll no-repeat center top /100%;
text-align: justify;
}
#w1 .well {background:rgba(255,255,255,0.7);}

#w2 {background: #d9edf7 url("003a.gif") scroll no-repeat center 20px; padding-top:80px;} 
#w2 .bg {background: #d9edf7 url("003b.gif") scroll no-repeat left bottom / 50%;} 

.dr_label span{
background-color: #5cb85c;
display: inline;
padding: 3px 5px 0px;
line-height: 1.7;
color: #fff;
white-space: nowrap;
vertical-align: baseline;
border-radius: 5px;
margin: 2px;
}


.col_hospital {background: #d9edf7 url("bg2.gif") scroll repeat left bottom / 50%;} 
.col_hospital img {margin-bottom:50px;}
.col_hospital2 .btn {border-radius: 8px;}


.col_time {cursor: pointer;}
.col_time .panel { background-color: transparent;  border: 0;}
.col_time .panel .img-rounded {margin:5px auto;}





/*------------inside_page------------*/





@media only screen and (max-width: 1680px) { }
@media only screen and (max-width: 1280px) { 
h2{ font-size:3.5rem;} 
h3{ font-size:3rem;}
h4 { font-size:2.5rem;}
h5,.panel-title{ font-size:2.1rem;}
h6,.btn,li { font-size:1.8rem;}
p,body { font-size:1.5rem;}
.btn-lg {font-size:2rem;}   
.btn-md { font-size:1.9rem;}
.btn-xs { font-size:1.3rem;}

}

@media only screen and (max-width: 992px) { 
main {padding-top:50px;}      
}
@media only screen and (max-width: 800px) { 
#w2 {background: #d9edf7 url("003a.gif") scroll no-repeat left top; padding-bottom:0;} 
}
@media only screen and (max-width: 768px) { 
.hover .overlay,.hover:hover .overlay {opacity: 0;}
.col_add {border: 0;}
footer .col_btn .btn {display: inline-flex;}
footer .col_btn{padding-bottom:30px;}
.btn-sm {padding: 2px 5px 0;}

}

@media only screen and (max-width: 640px) { 
h2{ font-size:2.8rem;} 
h3{ font-size:2.4rem;}
h4 { font-size:2.1rem;}
h5,.panel-title,.btn-lg { font-size:1.9rem;}
    
}
@media (max-width: 480px) { 
footer .col_link img {max-width: 40px;}    
.col_hospital2 .btn+a img {height:35px;}
}