@charset "utf-8";
/* CSS Document */

@import url(//fonts.googleapis.com/earlyaccess/notosanstc.css);

body{
	font-family: 'Noto Sans TC','Microsoft JhengHei',sans-serif;
	margin: 0;
	padding: 0;
/*	background-color: lightyellow;*/
}

/*中間區域*/

    /* 自訂內容寬度為 85% 並置中 */
body .content-wrapper {
  width: 85% ;
  border-radius: 30px;
  color: #595757;
  font-size: 1.2em;
  line-height: 2;
  padding: 1rem 1rem;/*
  display: inline-block;*/
  text-decoration: none;
  border: 1px solid #ccc;
  margin: 0 auto 10px auto ;
    }

body .content-wrapper_nobr {
  width: 85% ;
  color: #595757;
  font-size: 1.2em;
  padding: 1rem 0 0 0;
  text-decoration: none;
  margin: 0 auto;
    }




/*--診所門診時間表用--*/

body .content-wrapper_clinic {
  width: 65% ;
  color: #595757;
  font-size: 1.2em;
  padding: 1rem 0 0 0;
  text-decoration: none;
  margin: 0 auto;
    }

/* 平板尺寸 */
@media (max-width: 768px) {
  body .content-wrapper_clinic {
  width: 90% ;
  color: #595757;
  margin: 0 auto;
    }
}


/*---footer_start--*/

body .content-footer {
	width: 95%;
    margin: 0 auto;
	padding: 0 20px;
    }


.footer i.fas {
  color: #751485;
  margin: 0 0.5em;
}

.footer ul li {
  margin-bottom: 0.3em;
  font-size: 20px;
  line-height: 1.5;
  color: #595757;
}

/* 平板尺寸 */
@media (max-width: 768px) {
  .footer ul li {
  margin-bottom: 0.3em;
  font-size: 16px;
  line-height: 1.5;
  color: #595757;
}
}



/*---footer-晨曦----*/
.img-footer-sh {
  display: block;
  width: 100%;
  max-width: 255px;
  aspect-ratio: 255 / 150; /*--圖片尺寸--*/
  background-image: url(../pic/index/copyright_chenshi.png);
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
 
}

/* 平板尺寸 */
@media (max-width: 768px) {
  .img-footer-sh {
    max-width: 120px;
    aspect-ratio: 120 / 70;
    background-image: url(../pic/index/copyright_chenshi_s.png);
  }
}

/* 手機 */
@media (max-width: 416px) {
  .img-footer-sh {
    max-width: 100px;
    aspect-ratio: 100 / 56;
    background-image: url(../pic/index/copyright_chenshi_100.png);
  }
}


/*---footer-迎曦----*/
.img-footer-si {
  display: block;
  width: 100%;
  max-width: 231px;
  aspect-ratio: 231 / 150; /*--圖片尺寸--*/
  background-image: url(../pic/index/copyright_yingsi.png);
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;

}

/* 平板尺寸 */
@media (max-width: 768px) {
  .img-footer-si {
    max-width: 100px;
    aspect-ratio: 100 / 70;
    background-image: url(../pic/index/copyright_yingsi_100.png);
  }
}


.copyright {
  color: #fff;
  font-size: 1em;
  text-align: center;
  background: #aaabab;
  height: 55px;
  display: flex;
  align-items: center;     /* 垂直置中 */
  justify-content: center; /* 水平置中 */
  margin: 0 auto;
	padding: 10px;

}


/* 平板尺寸 */
@media (max-width: 768px) {
  .copyright {
  color: #fff;
  font-size: 14px;
  text-align: center;
  background: #aaabab;
  height: 55px;
  display: flex;
  align-items: center;     /* 垂直置中 */
  justify-content: center; /* 水平置中 */
  margin: 0 auto;
  padding: 10px;

}
}


/* 平板尺寸 */
@media (max-width: 416px) {
  .copyright {
  color: #fff;
  font-size: 13px;
  text-align: center;
  background: #aaabab;
  height: 55px;
  display: flex;
  align-items: center;     /* 垂直置中 */
  justify-content: center; /* 水平置中 */
  margin: 0 auto;
  padding: 10px;

}
}





/*---footer_end--*/





/*------文字------*/
	.title_Purple {
	color: #AE0082;
	font-size: 1.5em;	
		
	}

.title_Purple_tel {
	color: #A674B0;
	font-size: 1.5em;	
		
	}

.title_green_tel {
	color: #3EBA5A;
	font-size: 1.5em;	
		
	}

.custom-news-box{ /*各家診所公告_原本設定的區塊-舊設計*/
	padding: 0 25px;
	line-height: 35px;
	
}

/*--扈醫師台北看診區塊使用的文字設定_start---*/
.hu_tp_month {
	color: #6E60A8;
	font-size: 25px;
	background-color: #E9E6F3;
	margin: 3px 0;		
	}

.hu_tp_span {
	color: #595757;
	font-size: 1em;
	margin: 0 8px;
		
	}


/*--成功分享區塊使用的文字圖片設定_start---*/


.successful{
	text-align: left;
	margin: 3px 0;
	padding: 0 1em;	
}

.successful h1{
	color: #751485;
	font-size: 1.5em;	
}


.successful p{
	color: #595757;
	font-size: 1em;	
	line-height: 2;
}

.successful_img{
  width: 100%;
  max-width: 300px;
  aspect-ratio: 300 / 246;
  background-image: url(../pic/index/Successful-300.png);
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  margin: 0 auto; /* ✅ 這行是水平置中的關鍵 */

}


.read_more{	
	color: #666;
	font-size: 15px;
	background: #fff;
	text-decoration: none;
	border: #ccc 1px solid;
	border-radius:20px;
	padding: 5px 5px;
	margin: 1em 0;
	transition: 0.3s, color 0.3s;
}

.read_more:hover{
	color: #fff;
	font-size: 15px;
	background: #E4007F;
	border: none;
}


/*--成功分享區塊使用的文字設定_end---*/


/*最上端_4家診所連結鈕_因排序繼承問題_css位置需在此_不然會被bootstrap影響而失效*/

/*台北*/
 .custom-button_tp {
  background-color: #9198CB;
  border-radius: 20px;
  color: #fff;
  font-size: 1.2em;
  padding: 0.5rem 1rem;
  display: inline-block;
  text-decoration: none;
  border: none;
  transition: 0.3s, color 0.3s;
  margin: 2px 0;
}

.custom-button_tp:hover {
  background-color: #615CA8;
  color: #fff;
}
	
/*竹北*/
 .custom-button_zp {
  background-color: #AA73AF;
  border-radius: 20px;
  color: #fff;
  font-size: 1.2em;
  padding: 0.5rem 1rem;
  display: inline-block;
  text-decoration: none;
  border: none;
  transition: 0.3s, color 0.3s;
  margin: 2px 0;
}

.custom-button_zp:hover {
  background-color: #8B4690;
  color: #fff;
}
	

/*台中*/
 .custom-button_tc {
  background-color: #DB569A;
  border-radius: 20px;
  color: #fff;
  font-size: 1.2em;
  padding: 0.5rem 1rem;
  display: inline-block;
  text-decoration: none;
  border: none;
  transition: 0.3s, color 0.3s;
  margin: 2px 0;
}

.custom-button_tc:hover {
  background-color: #BA318C;
  color: #fff;
}
	
/*迎曦*/
 .custom-button_ys {
  background-color: #A3CF7B;
  border-radius: 20px;
  color: #fff;
  font-size: 1.2em;
  padding: 0.5rem 1rem;
  display: inline-block;
  text-decoration: none;
  border: none;
  transition: 0.3s, color 0.3s;
  margin: 2px 0;
}

.custom-button_ys:hover {
  background-color: #50A77B;
  color: #fff;
}
	
/*---以上是各家服務據點css結束位置----*/



/*---以下是網站項目按鈕的css起始位置---*/

.dropdown-menu.custom-dropdown {
  background-color: #f8f9fa;
  font-size: 1.1em;
  border-radius: 0;
  padding: 0;
  display: none;
  position: absolute;
  top: 100%;
  left: 0;
  z-index: 1000;
  min-width: 220px;
}

.nav-item.dropdown:hover .dropdown-menu {
  display: block;
}

.dropdown-subitem a {
  display: block;
  padding: 0.6rem 1.5rem;
  color: #f8f9fa;
  background: #EFEFEF;
  border-bottom: 1px solid #ccc;
  min-width: 180px;
  text-decoration: none;
  position: relative;
}

.dropdown-subitem a:hover {
  background-color: #e2e6ea;
  color: #fff;
  background: #7A62A9;
}
/*巢狀選單*/
.sub-dropdown {
  display: none;
  position: absolute;
  left: 100%;
  top: 0;
  background-color: #f8f9fa;
  border-bottom: 1px solid #ccc;
  list-style: none;
  padding: 0;
  margin: 0 0 0 2px;/*--距離選單左側距離--*/
  min-width: 180px;
  z-index: 1001;
 
}

.dropdown-subitem:hover .sub-dropdown {
  display: block;
  border: #ccc 1px solid;
}

.sub-dropdown li a {
  padding: 0.6rem 1rem;
  display: block;
  color: #7A62A9;
  text-decoration: none;
  white-space: nowrap;
}

.sub-dropdown li a:hover {
  background-color: #7A62A9;
  color: #fff;
}


/*---以下是網站項目按鈕的css結束位置---*/



/*---以下是陰影區塊設定---*/
.custom_shadow{
	box-shadow: inset 0 5px 8px #ccc; 
	height: 15px; 
	display: block;
	
}


/*---以下是各區塊的title--start---*/



/*--門診異動公告--*/

.title_01 {
 background-image: url(../pic/index/title_bg_grey.png);
  color: #584C9D;
  font-size: 2em;
  line-height: 110%;
  display: flex;
  align-items: center; /* 垂直置中 */
  width: 100%;
  height: 78px;
  padding: 0 0.5em;
  vertical-align: middle;
}


/* 平板尺寸 */
@media (max-width: 768px) {
  .title_01 {
  background-image: url(../pic/index/title_bg_grey.png);
  color: #584C9D;
  font-size: 1.8em;
  line-height: 110%;
  display: flex;
  align-items: center; /* 垂直置中 */
  width: 100%;
  height: 78px;
  padding: 0 0.5em;
  vertical-align: middle;

}
}


.title_02 {
  background-image: url(../pic/index/title_bg_grey.png);
  color: #27A155;
  font-size: 2em;
  line-height: 110%;
  display: flex;
  align-items: center; /* 垂直置中 */
  width: 100%;
  height: 78px;
  padding: 0 0.5em;
  vertical-align: middle;
}


/* 平板尺寸 */
@media (max-width: 768px) {
  .title_02 {
  background-image: url(../pic/index/title_bg_grey.png);
  color: #27A155;
  font-size: 1.8em;
  line-height: 110%;
  display: flex;
  align-items: center; /* 垂直置中 */
  width: 100%;
  height: 78px;
  padding: 0 0.5em;
  vertical-align: middle;

}
}



.title_hu {
  background-image: url(../pic/index/title_bg_grey.png);
  color: #A5308C;
  font-size: 2em;
  line-height: 110%;
  display: flex;
  align-items: center; /* 垂直置中 */
  width: 100%;
  height: 78px;
  padding: 0 0.5em;
  vertical-align: middle;
}

/* 平板尺寸 */
@media (max-width: 768px) {
  .title_hu {
  background-image: url(../pic/index/title_bg_grey.png);
  color: #A5308C;
  font-size: 1.8em;
  line-height: 110%;
  display: flex;
  align-items: center; /* 垂直置中 */
  width: 100%;
  height: 78px;
  padding: 0 0.5em;
  vertical-align: middle;

}
}



.title_articles {
  background-image: url(../pic/index/title_bg_grey.png);
  color: #584C9D;
  font-size: 2em;
  line-height: 110%;
  display: flex;
  align-items: center; /* 垂直置中 */
  width: 100%;
  height: 78px;
  padding: 0 0.5em;
  margin: 0 0 0.5em 0;
  vertical-align: middle;
}

/* 平板尺寸 */
@media (max-width: 768px) {
  .title_articles {
   background-image: url(../pic/index/title_bg_grey.png);
  color: #584C9D;
  font-size: 1.8em;
  line-height: 110%;
  display: flex;
  align-items: center; /* 垂直置中 */
  width: 100%;
  height: 78px;
  padding: 0 0.5em;
  margin: 0 0 0.5em 0;
  vertical-align: middle;

}
}



	
/*---以下是各區塊的title--end---*/




/*-------新聞vs公告_設定_start---------*/

.news {
  width: 100%;
  margin-bottom: 1em;
}

/* 新增：一行一行的排法 */
.news_row {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 1em; /* 可調整欄位間距 */
}

.news_title {
  color: #A18CC1;
  font-size: 1em;
  text-align: center;
  border-bottom: solid 3px #A18CC1;
  flex: 0 0 30%;  /* 固定20%寬 */
  padding:10px 0;
}

.news_title02 {
  color: #A18CC1;
  font-size: 1em;
  border-bottom: solid 3px #A18CC1;
  flex: 1;         /* 剩下空間全部給這欄 */
  padding:10px 0;
}

.news_title_w {
  color: #595757;
  font-size: 1em;
  border-bottom: dotted 1px #ccc;
  flex: 0 0 30%;  /* 固定20%寬 */
  padding:10px 0;
  display: flex;
  align-items: center;
  justify-content: center;
}


/*--日期---*/
.date-range {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
}

/*--~文字垂直設定---*/
.vertical-wave {
  display: inline-block;
  transform: rotate(90deg);
  font-size: 1em; /* 可視需要調整大小 */
}

.news_title02_w {
  color: #595757;
  font-size: 1em;
  display: flex;
  align-items: center;
  border-bottom: dotted 1px #ccc;
  flex: 1;         /* 剩下空間全部給這欄 */
  padding:10px 0;
}



/*-------新聞vs公告_設定_end---------*/




/*---以下頁面最頂端的logo底圖設定--start---*/

.logo {
  display: block;
  width: 100%;
  max-width: 1040px;
  aspect-ratio: 1040 / 190; /*--圖片尺寸--*/
  background-image: url(../pic/index/logo-1040.png);
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  margin: 0 auto;
}

/* 平板尺寸 */
@media (max-width: 768px) {
  .logo {
    max-width: 768px;
    aspect-ratio: 768 / 140;
    background-image: url(../pic/index/logo-768.png);
  }
}

/* 手機尺寸 */
@media (max-width: 416px) {
  .logo {
    max-width: 416px;
    aspect-ratio: 416 / 76;
    background-image: url(../pic/index/logo-416.png);
  }
}




/*---以下頁面最頂端的logo底圖設定--end---*/

		  

/*---廣告_圖片--*/
	
.img-news {
  width: 100%;
  aspect-ratio: 1920 / 400;
  background-image: url(../pic/index/ad_1920.png);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  }

/* 平板尺寸 */
@media (max-width: 768px) {
  .img-news {
    background-image: url(../pic/index/ad_768.png);
    aspect-ratio: 768 / 300;
  }
}
	
/*---文章_減重新知_圖片--*/

.img-articles  {
  width: 100%;
  aspect-ratio: 1920 / 400;
  background-image: url(../pic/index/articles_1920.png);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}


	

/* 手機尺寸 */
/*@media (max-width: 416px) {
  .img-articles {
    max-width: 416px;
    aspect-ratio: 416 / 76;
    background-image: url(../pic/index/articles_768.png);
  }
}
*/

/*---成功分享_圖片--*/

.img-successful {
  width: 100%;
  aspect-ratio: 1920 / 400;
  background-image: url(../pic/index/successful_1920.png);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  margin: 1em 0;
}

	
/* 平板尺寸 */
@media (max-width: 768px) {
  .img-articles {
    background-image: url(../pic/index/articles_768.png);
    aspect-ratio: 768 / 160;
  }
		
  .img-successful {
	width: 100%;
    background-image: url(../pic/index/successful_768.png);
    aspect-ratio: 768 / 300;
  }
	
}