html, body { scroll-behavior:smooth; }
body,p{
	color: #555555;
	font-family: "微軟正黑體","sans-serif","新細明體",Helvetica, Arial;
	font-size: 15px;
}

.container{ max-width: 1300px;}
.body-container{ min-height: calc(100vh - 131px);}
.clearfix{ clear: both;}

.text-red{ color: #FA151F;}
.text-green{ color: #00a338;}
.text-blue{ color: #2936AC;}
.bg-yellow{ background: #FE9126; color: #ffffff;}
.bg-pink{ background: #f40BBA; color: #ffffff;}
.bg-red{ background: #FA151F; color: #ffffff;}
.bg-blue{ background: #2936AC; color: #ffffff;}
.bg-skyblue{ background: #0088c7; color: #ffffff;}
.bg-green{ background: #00a338; color: #ffffff;}
.bg-gray{ background: #aaaaaa; color: #ffffff;}
.bg-brown{ background: #a52a2a; color: #ffffff;}
.bg-blue a{ color: #ffffff;}
.bg-blue:hover a{ text-decoration: none;}

textarea:focus, 
textarea.form-control:focus, 
input:focus,
input.form-control:focus, 
select:focus,
select.form-control:focus,
option:focus,
button:focus,
.btn:focus{
  box-shadow: none;
  outline: none;
}
.btn-square{
	padding: 6px 25px;
	border-radius: 0px;
	color: #ffffff;
	opacity: 1;
}
.btn-square:hover{
	color: #ffffff;
	opacity: 0.8;
}
.wrap-input{ padding: 15px;}
.wrap-input option:nth-child(odd){
	background: rgba(0,167,255,0.1);
}
.wrap-input label{ 
	font-size: 1rem;
	margin-bottom: 0px;
	font-weight: bold;
}
.wrap-input label i{width: 25px;}
.btn-search{ padding: 6px 25px;}
.with-errors{ color: #FA151F;}
.with-errors ul{ margin-bottom: 0px;}
@media screen and (max-width: 575px){
	.wrap-input label,
	.wrap-input input,
	.wrap-input select,
	.btn-search,
	.btn{ 
		font-size: 15px;
	}
	.btn-square{ width: 100%;}
}

/* --------------------- header footer --------------------- */

/* MENU */
.mobile-nav{ background: #fafafa;}
.navbar{ padding: 0px 20px;}
.logo{ max-height: 65px;}
.navbar .nav-item{ margin: 0px 3px;}
.navbar .nav-link{
	font-weight: bold;
	font-size: 17px;
	color: #666666!important;
}
.navbar-toggler,
.navbar-toggler:focus{
    border: 0px solid transparent;
}
a.nav-link:hover,
a.nav-link.active,
a.dropdown-item:hover{
    color: #16b29c!important;
}
.dropdown-menu{
    top: 59px;
    padding: 0px;
    margin: 0px;
    font-size: 16px;
    border-radius: 0px;
}
.dropdown-item{ padding: 10px 15px;}
.dropdown-item:active {
    color: #16B29C;
    background-color: #FAFAFA;
}
.navbar-toggler {
    font-size: 22px;
}
@media (max-width:1199px) and (min-width: 992px){
	.navbar .nav-item{ margin: 0px;}
}
@media screen and (max-width:991px){
	#navmenu{
		position: absolute;
		top: 78px;
		right: 0;
		z-index: 9999;
		width: 100%;
	}
	#navmenu .navbar-nav{
	    max-height: 80vh;
	    overflow-y: auto;
	    overflow-x: hidden;
	    background: #ffffff;
	    box-shadow: 0px 3px 3px rgba(0, 0, 0, 0.2);
	}
	ul.navbar-nav li.nav-item{
		border-bottom: 1px solid #eceff4;
	}
	ul.navbar-nav li.nav-item a.nav-link{
		line-height: 25px;
		padding: 15px 30px;
	}
	.dropdown-menu{ border-width: 0px;}
	.dropdown-menu{
		border-top: 1px solid #eceff4;
		padding-left: 30px;
	}
	.dropdown-menu:hover .dropdown-item{ background: #ffffff;}
}
@media screen and (max-width: 575px){
	.navbar{ padding: 2px 15px;}
	.logo{ max-height: 50px;}
	#navmenu{ top: 65px;}
	.navbar .nav-link{ font-size: 16px;}
	.dropdown-menu{ font-size: 15px;}
	.dropdown-item{ padding: 8px 15px;}
	ul.navbar-nav li.nav-item a.nav-link{
		line-height: 25px;
		padding: 10px 20px;
	}
}

/* footer */
.footer{
	background: #F0F0F0;
	border-top: 0px solid #dfdfdf;
	line-height: 16px;
}
.footer{ padding: 20px;}
.footer>.container{ margin: 0 auto;}
.footer p{ margin: 0px;}
.footer p>a{
	color: #00a338;
	padding: 0px 3px;
	text-decoration: underline;
}
.footer p>a:hover{color: #555555;}
.footer .social a{
	margin: 0px 3px;
	font-size: 16px;
	color: #4f4f4f;
}
.footer .social a:hover{color: #727272;}
.footer .d-flex div:first-child{
	border-right: 1px solid #dddddd;
}
@media screen and (max-width: 767px){
	.footer .d-flex{
		display: block!important;
		text-align: center;
	}
	.footer .d-flex div:first-child{ 
		border-right: 0px solid #dddddd;
	}
}
@media screen and (max-width: 575px){
	.footer{ padding: 20px 10px;}
}

/* --------------------- 各頁banner --------------------- */
.banner{
	height: 280px;
	background-repeat: no-repeat;
	background-size: cover;
	background-position: top center;
}
#news-banner{ background-image: url("../images/banner_news_lg.jpg");}
#health-banner{ background-image: url("../images/banner_health_lg.jpg");}
#article-banner{ background-image: url("../images/banner_article_lg.jpg");}
#discuss-banner{ background-image: url("../images/banner_discuss_lg.jpg");}
#med-banner{ background-image: url("../images/banner_med_lg.jpg");}
#clinic-banner{ background-image: url("../images/banner_clinic_lg.jpg");}
@media screen and (max-width: 1299px){
	.banner{ height: 250px; background-position: top right;}
	#news-banner{ background-image: url("../images/banner_news.jpg");}
	#health-banner{ background-image: url("../images/banner_health.jpg");}
	#article-banner{ background-image: url("../images/banner_article.jpg");}
	#discuss-banner{ background-image: url("../images/banner_discuss.jpg");}
	#med-banner{ background-image: url("../images/banner_med.jpg");}
	#clinic-banner{ background-image: url("../images/banner_clinic.jpg");}
}

@media screen and (max-width: 991px){
	.banner{ height: 200px;}
}
@media screen and (max-width: 767px){
	.banner{ height: 180px;}
}
@media screen and (max-width: 575px){
	.banner{ 
		height: 150px;
		background-position: right top;
	}
	#news-banner{ background-image: url("../images/banner_news_m.jpg");}
	#health-banner{ background-image: url("../images/banner_health_m.jpg");}
	#article-banner{ background-image: url("../images/banner_article_m.jpg");}
	#discuss-banner{ background-image: url("../images/banner_discuss_m.jpg");}
	#med-banner{ background-image: url("../images/banner_med_m.jpg");}
	#clinic-banner{ background-image: url("../images/banner_clinic_m.jpg");}
}
/* --------------------- 首頁 --------------------- */

a.navbar-brand span{
	font-size: 17px; 
	letter-spacing: 1px;
	margin-left: 10px;
	color: #777777;
}
.title{
	background: #16b29c;
	color: #ffffff;
	padding: 8px 15px;
	font-size: 20px;
	font-weight: bold;
	margin-bottom: 10px;
}
.title a{ 
	border-radius: 20px;
	padding: 3px 5px;
	font-size: 15px; 
	color: rgba(255,255,255,0.8);
}
.title a:hover{ 
	color: rgba(255,255,255,1);
	text-decoration: none;
}
marquee{ font-size: 17px;}
.ad img{ width: 100%;}

/* Carousel */
.carousel-control{width: 10%;}
.carousel-control i{
    position: absolute;
    top: 50%;
    z-index: 5;
    display: inline-block;
}
.carousel-control-next, 
.carousel-control-prev{ 
	width: 10%;
	font-size: 30px;
	color: rgba(0,0,0,0.4);
}
.carousel-control-next:focus,
.carousel-control-prev:focus,
.carousel-control-next:hover,
.carousel-control-prev:hover{
	color: rgba(0,0,0,0.8);
}
ol.carousel-indicators{ margin-bottom: 10px;}
.carousel-indicators li {
    border-top: 5px solid transparent!important;
    border-bottom: 5px solid transparent!important;
    background-color: #777777;
}
.carousel-indicators .active{
    background-color: #16b29c;
}
.carousel .carousel-item { height: 350px;}
.carousel .carousel-item > *:first-child {
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
  height: inherit;
}
@media screen and (max-width: 991px){
	.carousel .carousel-item { height: 300px;}
}
@media screen and (max-width: 767px){
	.carousel-indicators {bottom: 0px;}
	.carousel .carousel-item { height: 250px;}
}
@media screen and (max-width: 576px){
	.carousel .carousel-item { height: 180px;}
}

/* 最新消息 */
.news{ padding-left: 0px;}
.news li{
	list-style-type:none;
	overflow : hidden;
	text-overflow : ellipsis;
	white-space : nowrap;
	width : 100%;
	padding: 10px 0px;
	border-bottom: 1px dashed #dddddd;
	font-size: 16px;
}
.news li a{ color: #555555;}
.news span{
	padding: 2px 4px;
	margin-right: 10px;
}
/* 討論區 */
.post{
	margin: 10px 0px 2px 0px;
    background-color: #eeeeee;
    overflow: hidden;
}
.post .post-img{
	position: relative;
	width: 100%;
	height: 150px;
    background-position: center center;
	background-repeat: no-repeat; 
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
}
.post #post-img-1{background-image: url("../images/3515881_s.jpg");}
.post #post-img-2{background-image: url("../images/724505_s.jpg");}
.post #post-img-3{background-image: url("../images/323776_m.jpg");}
.post .post-sub{
    font-size: 14px;
    background: #eff48e;
    color: #555555;
    padding: 2px 8px;
    position: absolute;
    top: 10px;
    left: 0px;
}
.post .content{
	padding: 11px 10px;
}
.post .post-title{
    color: #737373;
    z-index: 2;
    width: 100%;
    overflow : hidden;
	text-overflow : ellipsis;
	white-space : nowrap;
	font-size: 16px;
	margin-bottom: 5px;
}
.post .post-title a{color: #555555;}

@media screen and (max-width: 768px){
	.post .post-img{
		width: 100%;
		height: 180px;
	}
}
@media screen and (max-width: 575px){
	.title{
		padding: 8px 10px;
		font-size: 17px;
		font-weight: normal;
	}
	.navbar .nav-link{ font-size: 16px;}
	marquee{ font-size: 16px;}
	.news li,.post .post-title{ font-size: 15px;}
	.news span{
		padding: 1px 3px;
		margin-right: 5px;
		font-size: 14px;
	}
	a.navbar-brand{ margin: 0 auto;}
}


/* --------------------- 最新消息 --------------------- */
.breadcrumbs{
	width: 100%;
	overflow : hidden;
	text-overflow : ellipsis;
	white-space : nowrap;
}
.btn-newsletter{
	padding: 6px 25px;
	background: #3a54ab;
	border-radius: 0px;
	color: #ffffff;
}
.btn-newsletter a{ color: #ffffff;}
.searchbar{
	background: #f5f5f5;
	padding: 15px 20px 15px 20px;
}
.search-title{
	padding: 0px 20px;
	font-size: 20px;
	font-weight: bold;
	color: #2936AC;
	text-align: right;
}
.search-title i{ font-size: 22px;}
.search-content{ display: none;}
.btn-search{ 
	background: #16b29c; 
	color: #ffffff;
	border-radius: 0px;
}
.news-content{ padding: 15px;}
.news-list{
	padding: 10px 0px;
	border-bottom: 1px dashed #ededed;
}
.news-list .news-tag{ 
	padding-left: 5px;
	text-align: center;
	padding-right: 15px;
}
.news-list .news-tag span{
	padding: 2px 4px;
	font-size: 15px;
}
.news-list .news-title{
	overflow : hidden;
	text-overflow : ellipsis;
	white-space : nowrap;
	width : 100%;
	margin-bottom: 0px;
}
.news-list .news-title a{
	font-size: 1rem;
	color: #333333;
}
.news-list .news-title a:hover{ color: #16b29c;}
.news-list .news-date{
	font-size: 14px;
	color: #777777;
	text-align: right;
}
li.page-item { margin: 0px 3px;}
li.page-item.disabled .page-link{ color: rgba(46, 193, 172,0.3);}
li.page-item a.page-link{ color: #16b29c;}
li.page-item:hover a.page-link,
li.page-item.active a.page-link{ 
	color: #ffffff;
	background: #16b29c;
	border-color: #16b29c;
}
.page-item:first-child .page-link{
    margin-left: 0;
    border-top-left-radius: 0px;
    border-bottom-left-radius: 0px;
}
.page-item:last-child .page-link{
    margin-left: 0;
    border-top-right-radius: 0px;
    border-bottom-right-radius: 0px;
}
.newsletter{
	padding: 30px 50px;
	background: rgba(58,84,171,0.1);
	background-image: url("../images/3205468_m.jpg");
	background-size: cover;
	background-position: center center;
	text-align: center;
	margin: 0px auto 40px auto;
}
.pagination {
    display: flex;
}
@media screen and (max-width: 767px){
	.news-list .news-date{text-align: left;}
}
@media screen and (max-width: 575px){
	.news-list .news-title a,
	.breadcrumbs{ font-size: 15px; padding: 0px;}
	.news-content{ padding: 15px 0px;}
	.news-list .news-tag{ 
		padding-left: 3px; 
		padding-right: 3px;
		text-align: left;
	}
	.news-list .news-tag span{
		font-size: 14px; 
		padding: 1px 3px;
	}
	li.page-item { margin: 0px 2px;}
	li.page-item a{ font-size: 13px; padding: 5px 8px;}
	.searchbar{ padding: 10px 15px;}
	.search-title{ padding: 0px 0px; font-size: 17px;}
	.search-title i{ font-size: 20px;}
}
/* --------------------- 訂閱電子報 --------------------- */
.newsletter-container{
	padding: 70px 8% 40px 8%;
}
.newsletter-container h1{
	font-size: 36px;
	color: #2936AC;
	font-weight: bold;
}
.newsletter-content{
	padding: 40px 30px;
	margin: 30px auto;
	background: #f0f0f0;
}
.newsletter-content p{
	font-size: 17px;
	text-align: justify;
}
.newsletter-content .input-group-text{
	background: #2936AC;
	color: #ffffff;
}
.captcha img{ height: 38px; width: auto;}
.captcha a{ color: #FA151F; font-size: 14px;}

@media screen and (max-width: 575px){
	.newsletter-container{ padding: 50px 0px 10px 0px;}
	.newsletter-content{
		padding: 30px 15px;
		margin: 15px 0px;
	}
	.newsletter-container h1{ font-size: 28px;}
	.newsletter-container h1 img{ width: 70px;}
	.newsletter-content p{
		font-size: 16px;
		line-height: 28px;
	}
	.captcha{ text-align: right;}
}

/* --------------------- 內文 --------------------- */
.text-container{ margin: 40px auto;}
.text-container h1{
	font-size: 28px;
	line-height: 40px;
	font-weight: bold;
	color: #00A338;
	text-align: justify;
	border-bottom: 2px solid #00A338;
	padding: 15px 0px;
}
.text-date{
	margin: 5px auto 45px auto;
	font-size: 15px;
	font-weight: bold;
	letter-spacing: 1.5px;
	color: #3669AD;
	padding: 5px 0px;
	text-align: right;
}
.text-date span{ color: #777777;}
.text-content{
	padding: 20px 0px;
	display: block;
}
.text-content img{
	float: right;
	margin-left: 15px;
	margin-bottom: 15px;
	min-width: 250px;
	max-width: 100%;
}
.text-content p{
	font-size: 17px;
	line-height: 35px;
	text-align: justify;
	color: #555555;
	margin-bottom: 30px;
}
.text-source{
	color: #666666;
	font-size: 16px;
	text-align: right;
}

.social-share{
	border-top: 1px solid #dfdfdf;
	border-bottom: 1px solid #dfdfdf;
	padding: 10px 10px;
	color: #777777;
}
.social-share a i{
	width: 32px;
	height: 32px;
	line-height: 32px;
	background: #dfdfdf;
	text-align: center;
	color: #ffffff;
	opacity: 0.8;
}
.social-share a i:hover{ opacity: 1;}
.social-share .fb i{ background: #1877F2;}
.social-share .google i{ background: #EA4335;}
.social-share .twitter i{ background: #1A91DA;}
.social-share .mail i{ background: #DB483B;}

@media screen and (max-width: 576px){
	.text-container{ margin: 20px auto 35px auto;}
	.text-date{
		margin: 5px auto 20px auto;
		font-size: 14px;
	}
	.text-container h1{
		font-size: 21px;
		line-height: 30px;
	}
	.text-content p{
		font-size: 16px;
		line-height: 28px;
		margin-bottom: 25px;
	}
	.text-content img {
	    float: none;
	    display: block;
	    margin: 0px auto 15px auto!important;
	    width: 100%;
	}
	.text-source{
		font-size: 15px;
		text-align: right;
	}
}
/* --------------------- 討論區&新話題 --------------------- */
.discuss-content{
	border: 0px solid #ededed;
	border-top: 4px solid #16B29C;
	padding: 15px;
}
.discuss-nav{ margin-top: 50px;}
.btn-discuss{
	border-radius: 30px;
	padding: 3px 8px;
	font-size: 14px;
}
.btn-discuss:hover{
	color: #ffffff;
	opacity: 0.8;
}
.discuss-nav ul{
	margin-bottom: 0px;
	text-align: left;
}
.discuss-nav ul li:nth-child(2) span{ color: #00A338;}
.discuss-nav ul li:nth-child(3) span{ color: #F40BBA;}
.discuss-nav ul li:nth-child(4) span{ color: #FE9126;}
.discuss-nav ul li.list-inline-item:not(:last-child){
	margin-right: 0px;
}
.discuss-nav ul li{
	padding: 3px 10px;
	font-size: 18px;
	letter-spacing: 1.5px;
	border: 1px solid #16B29C;
	margin-bottom: -1px;
	border-top-left-radius: 0px;
	border-top-right-radius: 0px;
}
.discuss-nav ul li a{ color: #777777;}
.discuss-nav ul li.active,
.discuss-nav ul li:hover{
	background: #16B29C;
}
.discuss-nav ul li:nth-child(2):hover span,
.discuss-nav ul li.active:nth-child(2) span,
.discuss-nav ul li:nth-child(3):hover span,
.discuss-nav ul li.active:nth-child(3) span,
.discuss-nav ul li:nth-child(4):hover span,
.discuss-nav ul li.active:nth-child(4) span{ 
	color: #ffffff;
}
.discuss-nav ul li.active a,
.discuss-nav ul li:hover a{
	color: #ffffff;
	text-decoration: none;
}
.discuss-tag{ 
	border-radius: 50%;
	padding: 2px 4px;
	margin-right: 5px;
}
.discuss-author{  width: 100px; text-align: center;}
.discuss-date{ width:85px;}
.discuss-views{ width: 95px; text-align: left;}
.new-discuss ol{ 
	margin-top: 15px;
	padding-inline-start: 18px;
}
.new-discuss ol li{ 
	padding: 5px 0px 5px 10px;
	text-align: justify;
}

@media screen and (max-width: 767px){
	.discuss-content .news-date{text-align: left;}
	.discuss-author{ width: 140px; text-align: left;}
	.discuss-date{ width:140px; padding-left: 27px;}
	.discuss-date:before{
		font-family: "Font Awesome 5 Free";
		font-weight: 400;
    	content: "\f073";
    	margin-right: 8px;
	}
	.discuss-author:before{
		font-family: "Font Awesome 5 Free";
		font-weight: 900;
    	content: "\f4ff";
    	margin-right: 3px;
	}
	.discuss-nav{ margin-top: 30px;}
}
@media screen and (max-width: 575px){
	
	.discuss-content .news-tag{padding: 0px!important;}
	.discuss-content{ padding: 15px 0px;}
	.discuss-tag { 
		font-size: 12px;
	    height: 16px;
	    line-height: 16px;
	    padding: 0px 3px;
	    text-align: center;
	}
	.discuss-nav ul li{
		padding: 2px 4px;
		font-size: 16px;
		letter-spacing: 0px;
	}
}
@media screen and (max-width: 374px){
	.discuss-author,.discuss-views,.discuss-date{ 
		padding-left: 27px;
		width: 100%;
		text-align: left;
	}
}
@media screen and (max-width: 374px){
	.discuss-nav ul li{
		width: 100%;
		text-align: center;
	}
}
/* --------------------- 討論區內文 --------------------- */
.question-container{ margin: 40px auto;}
.question-content{
	border: 1px solid #cccccc;
	border-radius: 5px;
	padding: 20px 15px 10px 15px;
	margin: 15px auto 50px auto;
	background: #fafafa;
}
.answer-body{
	border: 1px solid #dddddd;
	border-radius: 5px;
	padding: 20px 15px 10px 15px;
	background: #fafafa;
	margin: 30px auto;
}
.question-header{
	border-bottom: 1px dashed #dddddd;
	padding-bottom: 10px;
}
.question-header h3{ color: #00a338;}
.question-body{
	padding-top: 20px;
	font-size: 16px;
	line-height: 30px;
	text-align: justify;
}
.question-body p{ font-size: 16px;}
.question-replay{ 
	width: 60%; 
	margin-left: auto; 
	margin-right: auto;
}
.question-container h4{
	background: #16B29C;
	color: #ffffff;
	padding: 6px 10px;
	margin: 30px auto;
}
.replay-fixed{
	position: fixed;
	right: -70px;
	top: 150px;
	background: #2936AC;
	padding: 5px 10px;
	border-top-left-radius: 5px;
	border-bottom-left-radius: 5px;
	z-index: 10;
}
.replay-fixed:hover{
	transform:translate(-70px);
    -moz-transform:translate(-70px);
    -webkit-transform:translate(-70px);
    transition-duration: 500ms;
}
.replay-fixed a{
	color: #ffffff;
}
@media screen and (max-width: 991px){
	.question-replay{ width: 80%;}
}
@media screen and (max-width: 767px){
	.question-replay{ width: 100%;}
}
@media screen and (max-width: 575px){
	.question-header h3{ font-size: 20px;}
	.question-body{ 
		font-size: 15px;
		line-height: 26px;
	}
	.question-body p{ font-size: 15px;}
	.question-container h4{ font-size: 20px;}
	.replay-fixed{
		top: 85px;
	}
	.replay-fixed:hover{
		transform:translate(0px);
	    -moz-transform:translate(0px);
	    -webkit-transform:translate(0px);
	    transition-duration: 0ms;
	}
}

/* --------------------- 養身導覽 --------------------- */
.subtitle_health{
	margin: 20px auto 50px auto;
	text-align: right;
	font-size: 20px;
}
.subtitle_health span {
    font-size: 25px;
    font-weight: 300;
    padding: 0 2px;
}
.sub_season { color: #16B29C;}
.card-slider{
	width: 100%;
	margin: 35px auto 20px auto;
	overflow: hidden;
}
.card-slider .inner{
	overflow:hidden;
	position: relative;
}
.card-slider ul{
	margin:0;
	padding:0;
	width:100%;
	display:flex;
	flex-wrap:wrap;
	position:relative;
	transition:left .2s ease;
	left:0;
}
.card-slider ul li{
	margin:0;
	list-style:none;
	position:relative;
	/*flex:1 0 250px;*/
	flex:1 0 300px;
	vertical-align:top;
	box-sizing:border-box;
	white-space:normal;
	padding: 10px;
}
.card-slider ul li div{
	padding: 0px;
	text-align: justify;
}
.card-slider div h3{
	color: #ffffff;
	background: #16b29c;
	padding: 8px 15px;
	font-size: 24px;
}
.card-slider div h3 a{ color: #ffffff;}
.card-slider div h3 a:hover{ color: #ffffff; text-decoration: none;}
.card-slider ul li div h4 a{
	color: #333333;
	font-size: 18px;
	text-decoration: underline;
}
.card-slider ul li div > a{
	overflow: hidden;
	text-overflow: ellipsis;
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 1;
	margin-bottom: 0px;
	max-height: 25px;
	color: #555555;
}
.card-slider .slider-nav .btn{
	position: absolute;
	z-index: 1;
	top: 50%;
	transform:translateY(-50%);
}
.card-slider .slider-nav .btn-left{ left: -10px;}
.card-slider .slider-nav .btn-right{ right: -10px;}
.card-slider .slider-nav .btn i{
	font-size: 20px;
	height: 30px;
	width: 30px;
	padding: 5px 5px 5px 7px;
	background: #707070;
	color: #ffffff;
	box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.4);
	opacity:0.9;
}
.card-slider .slider-nav .disabled{opacity:0.4;}

figure>div{
	height: 180px;
	width: 100%;
	background-size: cover;
	background-position: center;
}
@media screen and (max-width: 576px){
	.card-slider{margin: 30px auto 15px 0px;}
	.card-slider div h3{ font-size: 18px;}
	.subtitle_health .d-inline-block{
		text-align: center;
		display: block!important;
		margin: 3px 0px!important;
	}
	.subtitle_health{
		margin: 20px auto 35px auto;
		font-size: 15px;
	}
	.card-slider ul li div h4 a{ font-size: 16px;}
	.subtitle_health span { font-size: 15px;}
	figure>div{
		height: 200px;
	}
}
/* --------------------- 人氣文章 --------------------- */
.article-header{ margin: 20px 0px 25px 0px;}
.article-tags{ margin-bottom: 0px;}
.tags{
  list-style: none;
  margin: 0;
  overflow: hidden; 
  padding: 0;
}
.tags li{ display:inline-block;}
.tag{
  background: #923258;
  border-radius: 3px 0px 0px 3px;
  color: #ffffff;
  display: inline-block;
  height: 30px;
  line-height: 30px;
  padding: 0px 20px 0px 23px;
  position: relative;
  margin: 0px 10px 10px 0px;
  text-decoration: none;
  -webkit-transition: color 0.2s;
  font-size: 17px;
}
.tag:hover{ text-decoration: none;}
.tag::before {
  background: #ffffff;
  border-radius: 10px;
  box-shadow: inset 0 1px rgba(0, 0, 0, 0.25);
  content: '';
  height: 6px;
  left: 10px;
  position: absolute;
  width: 6px;
  top: 10px;
}
.tag::after {
  background: #ffffff;
  border-bottom: 15px solid transparent;
  border-left: 13px solid #923258;
  border-top: 15px solid transparent;
  content: '';
  position: absolute;
  right: 0;
  top: 0;
}
.tag:hover{ background-color: crimson; color: white;}
.tag:hover::after { border-left-color: crimson; }
.article-body{ margin: 20px auto 40px auto;}
.article-hot{ padding: 20px 40px;}
.article-hot ol{
	list-style: none;
    counter-reset: li;
    padding-left: 0; 
}
.article-hot h4,
.catalog-content h4{
	color: #2936AC;
	font-weight: bold;
	padding: 5px 10px;
}
.article-hot h4{ 
	font-size: 30px;
	padding: 10px 0px;
}
.article-hot ol li{ 
	counter-increment: li;
	margin: 5px 0px;
	font-size: 16px;
}
.article-hot ol li:before{
	content: counter(li);
	background: #923258;
	color: #ffffff;
	padding: 2px 5px;
	margin-right: 10px;
}
.catalog-card{
	border: 1px solid #dddddd;
	box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.15);
	margin: 15px auto;
}
.article-video{
	background: #f0f0f0;
	margin: 0px auto 25px 0px;
}
.video-box{
  position: relative;
  padding-bottom: 40%;
  height: 350px;
  overflow: hidden;
}
.video-box iframe, .video-box object, .video-box embed {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.catalog-img,.catalog-img>div{
	height: 100%;
	width: 100%;
	background-size: cover;
	background-position: right bottom;
}
.catalog-content{ 
	padding: 10px 15px;
	min-height: 260px;
}
.catalog-content ul{
	list-style-type: square;
}
.catalog-content ul li,
.article-hot ol li{
	overflow: hidden;
	text-overflow: ellipsis;
	white-space : nowrap;
	width: 100%;
	padding: 2px 0px;
}
.catalog-content ul li a,
.article-hot ol li a{
	color: #666666;
}
.catalog-content .catalog-more{
	position: absolute;
	bottom: 15px;
	right: 15px;
}
.catalog-content .catalog-more i{
	font-size: 13px;
}
.catalog-content .catalog-more a{
	background: #16b29c;
	padding: 3px 8px;
	color: #ffffff;
	font-size: 13px;
	border-radius: 30px;
}
.catalog-items .news-tag span{
	background: #2936AC;
	color: #ffffff;
}
@media screen and (max-width: 576px){
	.catalog-content{ 
		min-height: auto;
		padding: 10px 15px 40px 15px;
	}
	.article-hot h4{ font-size: 24px;}
	.catalog-img{ height: 200px;}
	.article-hot{ padding: 10px 15px;}
	.video-box{ height: 200px;}
	.article-hot ol li{ font-size: 15px;}
	.catalog-content ul li{ padding: 4px 0px;}
	.tag{ 
		height: 26px; 
		line-height: 26px;
		font-size: 14px;
	}
	.tag::after {
		border-bottom: 13px solid transparent;
		border-left: 10px solid #923258;
		border-top: 13px solid transparent;
	}
}

/* --------------------- 中醫藥知識 --------------------- */
.medicine-header{
	background: #f5f5f5;
	padding: 15px 20px;
	margin: 40px auto;
}
.medicine-header label{ margin-bottom: 0px;}
.medicine-header h1{
	font-size: 28px;
	font-weight: bold;
	color: #00A338;
	border-bottom: 1px solid #00A338;
	padding: 10px 0px;
	text-align: justify;
}
.medicine-body{ margin: 40px auto 70px auto;}
.medicine-body h3{ 
	color: #2936AC;
	text-align: center;
}
.medicine-content{ padding: 15px;}
.medicine-content .btn-med{
	width: 100%;
	border: 1px solid #16B29C;
	margin: 5px 0px;
	border-radius: 0px;
	font-size: 15px;
	padding: 8px 5px;
}
.medicine-content .btn-med:hover{
	background: #16B29C;
	color: #ffffff;
}
@media screen and (max-width: 575px){
	.medicine-content{ padding: 15px 0px;}
}
@media screen and (max-width: 374px){
	.medicine-content .form-row .col-6{ 
		flex: 0 0 100%;
   		max-width: 100%;
	}
}

/* --------------------- 診所查詢 --------------------- */
.clinic-content{
	margin: 50px auto;
}
.clinic-search .nav-link{
    border: 1px solid transparent;
    border-color: #dee2e6;
    color: #777777;
}
.clinic-search .nav-link:last-child{ margin-left: -1px;}
.clinic-search .nav-link.active{
	background: #f5f5f5;
	color: #ffffff;
	border-bottom-color: #f5f5f5;
}
.clinic-search .nav-link.active,
.clinic-search .nav-link:hover{
    color: #777777!important;
}

.tab-clinic{
	background: #f5f5f5;
	padding: 25px 30px;
	border: 1px solid #dee2e6;
	border-top-width: 0px;
}
.tab-clinic .tab-pane h3{
	font-size: 26px;
	color: #00a338;
	font-weight: bold;
	margin-bottom: 35px;
	padding: 10px 0px;
	border-bottom: 1px solid #00a338;
}
.tab-clinic .tab-pane .col-form-label{
	font-size: 16px;
	color: #333333;
	font-weight: bold;
}
.tab-clinic .tab-pane .col-form-label i{ width: 22px;}
.clinic-body{ 
	margin: 45px 0px 70px 0px;
}
.clinic-body h2{
	font-size: 26px;
	color: #00a338;
	font-weight: bold;
	margin-bottom: 25px;
}
.no-select{
	background-color: #f0f0f0;
}
/*table*/
.table-clinic{
	margin: 0;
	padding: 0;
	width: 100%;
	table-layout: fixed;
}
.th-name{ width: 160px;}
.th-phone{ width: 125px;}
.th-doctor{ width: 100px;}
.table-clinic th,
.table-clinic td {
	padding: 0.625em;
}
.table-clinic thead tr{
	color: #333333;
	background: #F5F5F5;
	font-weight: bold;
	font-size: 16px;
}
.table-clinic thead th {
    border-width: 0px;
    border-bottom: 0px solid #dee2e6;
}
.table-clinic tbody td{
    border-top: 0px solid #dee2e6;
    border-bottom: 1px dashed #dee2e6;
    color: #555555;
}
.table-clinic tbody td a{ color: #3B55A9;}

@media screen and (max-width: 575px) {
	.tab-clinic .tab-pane h3,.clinic-body h2{
		font-size: 20px;
	}
	.table-clinic thead{
		border: none;
		clip: rect(0 0 0 0);
		height: 1px;
		margin: -1px;
		overflow: hidden;
		padding: 0;
		position: absolute;
		width: 1px;
	}
	.table-clinic tbody tr{
		display: block;
		margin-bottom: 25px;
	}
	.table-clinic tbody td{ 
		display: flex;
		padding: 8px 5px;
	}
	.table-clinic tbody td:first-child{ 
		background: #f5f5f5;
		padding: 10px 5px;
	}
	.table-clinic td:before{
		content: attr(data-label);
		display: flex;
		flex: 0 0 75px;
		font-weight: bold;
		text-transform: uppercase;
		color: #333333;
	}
}

@media screen and (max-width: 375px){
	.tab-clinic{ padding: 20px 15px;}
	.tab-clinic .tab-pane h3{ font-size: 20px;}
}
@media screen and (max-width: 270px){
	.clinic-search .nav-item{ width: 100%;}
	.clinic-search .nav-link:last-child{ margin-left: 0px;}
}

/* --------------------- 診所介紹 --------------------- */
.clinic-body h1{
	font-size: 35px;
	letter-spacing: 2px;
	color: #00a338;
	font-weight: bold;
	margin-bottom: 45px;
	text-align: center;
}
.clinic-body h1 i{ font-size: 30px;}
.clinic-body h1 img{ 
	width: 30px;
	margin-top: -5px;
}
.clinic-nav .list-group-item{
    background-color: #f5f5f5;
}
.clinic-nav .list-group-item.active,
.clinic-nav .list-group-item:hover{
	background-color: #16B29C;
	border-color: rgba(0,0,0,.125);
	color: #ffffff;
}
.clinic-tabpanel .tab-pane{
	padding: 15px 0px;
	font-size: 16px;
}
.clinic-tabpanel .clinic-info-img img{
	min-width: 100%;
}
.clinic-tabpanel h3{
	color: #2936ac;
	margin-bottom: 20px;
}
.clinic-tabpanel hr{ 
	margin: 0px 0px 40px 0px;
	border-color: #f0f0f0;
}
.clinic-tabpanel p{ 
	font-size: 16px;
	line-height: 28px;
}
.clinic-tabpanel .remarks{
	background-color: #f0f0f0;
	padding: 5px 25px;
	font-size: 17px;
	color: #00a338;
	line-height: 60px;
}
.announcement .news-list{
	padding: 8px 10px;
	align-items: center;
}
.announcement-title.news-list{
	background-color: #ECFFEC;
	padding: 10px;
	font-weight: bold;
	border-bottom: 0px dashed #ededed;
}
.announcement-title .news-title{
	color: #333333;
}
.announcement-title .news-date{
	font-size: 16px;
	color: #333333;
}
.map{
	width: 100%;
	height: 450px;
	border-width: 0px;
}
.clinic-flex div{ padding: 5px;}
.clinic-flex div:first-child{
	flex: 0 0 120px;
	color: #333333;
	font-weight: bold;
}
.clinic-flex i{ width: 25px;}
.doctor-info{
	margin-bottom: 15px;
	padding: 10px;
	font-size: 15px;
	line-height: 28px;
	text-align: justify;
}
.doctor-info .clinic-flex{
	border-bottom: 1px dashed #dddddd;
}
.doctor-info .clinic-flex div:first-child{
	flex: 0 0 90px;
	color: #2936AC;
}
.clinic-oh thead tr{ background-color: #ECFFEC;}
.clinic-oh tr{
	text-align: center;
	word-break: break-word;
	font-size: 15px;
}
.clinic-oh tr td{
	padding: 10px 5px;
	vertical-align: middle;
}
.clinic-oh .period{ width: 110px;}
.clinic-oh .closed{ color: #900900;}
.clinic-oh td span{ display: block;}

.announcement li.page-item a.page-link {
    color: #777777;
}
.announcement li.page-item:hover a.page-link, 
.announcement li.page-item.active a.page-link{
    color: #777777;
    background: #F5F5F5;
    border-color: #dee2e6;
}

@media screen and (max-width: 767px){
	.clinic-tabpanel .tab-pane{ padding: 40px 10px 0px 10px;}
}
@media screen and (max-width: 575px){
	.clinic-body h1{ 
		font-size: 24px; 
		letter-spacing: 0px;
		margin-bottom: 25px;
	}
	.clinic-body h1 i{ font-size: 24px;}
	.clinic-body h1 img{ width: 24px;}
	.clinic-tabpanel .tab-pane{ padding: 40px 0px 0px 0px;}
	.clinic-tabpanel h3{ font-size: 20px;}
	.clinic-tabpanel hr{ margin: 0px 0px 20px 0px;}
	.clinic-tabpanel p{  font-size: 15px; line-height: 25px;}
	.clinic-tabpanel .tab-pane{ font-size: 15px;}
	.map{ height: 250px;}
	.clinic-flex{
		flex-direction: column;
		flex-wrap: wrap;
		margin-bottom: 20px;
	}
	.doctor-info .clinic-flex{ margin-bottom: 0px;}
	.doctor-info{
		padding: 10px 0px;
		line-height: 25px;
	}
	.clinic-flex div:first-child{flex: 0 0 100%;}
	.clinic-oh tbody td:first-child{ 
		background-color: #ECFFEC;
	}
	.clinic-oh tbody td{ 
		display: block;
		text-align: left;
	}
	.clinic-oh td:before{
		display: inline-block;
		width: 60px;
	}
	.clinic-oh td span{ display: inline; margin-right: 10px;}
	.announcement-title .news-date{ display: none;}
}

/* --------------------- 聯絡我們 --------------------- */
.contactus .sub-col{ text-align: right;}
.contactus h5{ 
	font-size: 17px; 
	line-height: 30px;
	margin-top: -25px;
	margin-bottom: 20px;
	padding-left: 120px;
}
.contactus hr{
	margin-bottom: 50px;
}
@media screen and (max-width: 767px){
	.contactus .sub-col{ text-align: left;}
}
@media screen and (max-width: 575px){
	.contactus h5{ 
		font-size: 16px; 
		line-height: 25px;
		margin-top: 0px;
		margin-bottom: 10px;
		padding-left: 0px;
	}
}