@charset "utf-8";
/* CSS Document */


body .content-wrapper_max {
  width: 100% ;
  color: #595757;
  font-size: 1.2em;
/*  padding: 20px 0 0 0;*/
  text-decoration: none;
  margin: 18px auto;
    }


/*---診所介紹_banner圖片--*/
	
.img-about {
  width: 100%;
  aspect-ratio: 1920 / 130;
  background-image: url(../pic/about/banner_about.png);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

/* 平板尺寸 */
@media (max-width: 768px) {
  .img-about {
    background-image: url(../pic/about/banner_about_768.png);
    aspect-ratio: 768 / 52;
  }
}


/*---診療項目_banner圖片--*/
	
.img-items {
  width: 100%;
  aspect-ratio: 1920 / 130;
  background-image: url(../pic/items/banner_items.png);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

/* 平板尺寸 */
@media (max-width: 768px) {
  .img-items {
    background-image: url(../pic/items/banner_items_768.png);
    aspect-ratio: 768 / 52;
  }
}

/*---看診流程_banner圖片--*/

.img-process{
  width: 100%;
  aspect-ratio: 1920 / 130;
  background-image: url(../pic/process/banner_process.png);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}


/* 平板尺寸 */
@media (max-width: 768px) {
  .img-process{
    background-image: url(../pic/process/banner_process_768.png);
    aspect-ratio: 768 / 52;
  }
}


/*---成功分享_banner圖片--*/

.img-successful{
  width: 100%;
  aspect-ratio: 1920 / 130;
  background-image: url(../pic/successful/banner_successful.png);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}


/* 平板尺寸 */
@media (max-width: 768px) {
  .img-successful{
    background-image: url(../pic/successful/banner_successful_768.png);
    aspect-ratio: 768 / 52;
  }
}



/*--內文編輯區--*/

.content-wrapper_middle {
  width: 90%; 
  padding: 15px 0;
  margin: 0 auto;
    }


.content-wrapper_middle p {
  font-size: 1em; 
  color: #595757; 
  line-height: 2.5;
  text-align: justify;
    }

.content-wrapper_middle h2 {
   color: #571A86; 
    }



/* 平板尺寸 */
@media (max-width: 768px) {
  .content-wrapper_middle p  {
   line-height: 2.3;
  }
}

/*--內文編輯區--*/

.content-wrapper_narrow{
  width: 50%; 
  padding: 0 0 20px 0;
  margin: 0 auto;	
}

/* 平板尺寸 */
@media (max-width: 768px) {
  .content-wrapper_narrow{
  width: 90%; 
  margin: 0 auto;	
}
}

/*--灰色底圖--*/

.bg_gray{
	background: #F2F2F3; 
	padding: 10px 0 0 0;
	margin: 0 0 10px 0;
}



/*--文字設定--*/

.w-i-diamond{
	font-size: 18px; 
	color: #571A86; 
	vertical-align: middle;
} 

.w-i-diamond_red{
	font-size: 18px; 
	color: #890C84; 
	vertical-align: middle;
} 

	/*--菱形符號-*/


.title_purple{
	font-size: 29px;  
	color: #571A86; 
	font-weight: 500;
	vertical-align: middle; 	
}

.title_purple_big{
	font-size: 36px;  
	color: #571A86; 
	font-weight: 500;	
	vertical-align:bottom;
}


.title_purple_s{
	font-size: 18px; 
	font-style: italic;  
	color: #571A86; 
	vertical-align: bottom;
}


.title_purple_s_red{
	font-size: 18px; 
	font-style: italic;  
	color: #890C84; 
	vertical-align: bottom;
}

.title_purple_red{
	font-size: 29px;  
	color: #890C84; 
	font-weight: 500;
	vertical-align: middle;
}


.title_subtitle{
	font-size: 22px; 
	color: #fff;
	font-weight: 500;
	background: #8C98CC; 
	border-radius: 10px; 
	padding: 8px 18px; 
	margin: 0 0 15px 0;
}

.title_first_visit{
	font-size: 30px; 
	text-align: center;
	color: #fff;	
	font-weight: 500;
	background: #E4007F; 
	border-radius: 20px; 
	padding: 8px 18px; 
	margin: 0 0 15px 0;
}



/*--減重流程--*/

.weight_loss {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 20px;              /* 元素間距 */
  max-width: 900px;
  margin: 20px auto;
  text-align: center;
  flex-wrap: wrap;        /* 手機可自動換行 */
}

.weight_loss span {
  display: flex;
  justify-content: center;
  align-items: center;
}

/* 文字區塊 */
.weight_loss ul {
  font-size: 50px;
  text-align: center;
  list-style: none;
  color: #E4007F;
  margin: 0;
  padding: 0;
}

/* 圖片等比縮放 */
.weight_loss img {
  max-width: 100%;
  height: auto;
  display: block;
}

/* 響應式：手機改直式排列 */
@media (max-width: 768px) {
  .weight_loss {
    flex-direction: column;
    width: 90%;
  }

  .weight_loss ul {
    font-size: 45px; 
  }
}




/*--項目框--*/

.w_list{
	border: solid 2px #B7A3CE ; 
	background: #fff;
	border-radius: 30px; 
	padding: 10px 0 0 0;
}

.w_list ul{
	font-size: 20px;
	list-style: none;
	line-height: 2.3;
	font-weight: 500;
}

/* 平板尺寸 */
@media (max-width: 768px) {
  .w_list{
	border: solid 2px #B7A3CE ; 
	background: #fff;
	border-radius: 30px; 
	padding: 10px 20px 0 0;
}
}


.w_list_purple{
	border: dotted 3px #882E8C ; 
	background: #fff;
	border-radius: 30px; 
	list-style: decimal;
}

.w_list_purple ul{
	font-size: 20px;
	list-style: none;
	line-height: 2.3;
	font-weight: 500;
}

/* 平板尺寸 */
@media (max-width: 768px) {
 .w_list_purple{
	border: dotted 3px #882E8C ; 
	background: #fff;
	border-radius: 30px; 
	list-style: decimal;
	padding: 10px 20px 0 0;
}
}


.w_list_grey{
	border: dotted 3px #B5B5B6 ; 
	background: #fff;
	border-radius: 30px; 
	padding: 20px 20px;
}


.w_list_grey ul{
	font-size: 20px;
	color: #751485;
	list-style: decimal;
	line-height: 2.3;
	font-weight: 500;
}



/*--項目說明--*/
.info_blue {
	list-style: none;
	font-size: 1em;
	line-height: 2;		
	color: #0075C2;	
	padding-left: 13px;
	margin-left: 0;	
}



/*---見證人宣告-*/

.successful_name{
	font-size: 1em;
	color: #fff;
	background: #7E3C93;
	padding: 2px 20px;
	border-radius: 20px;
	margin: 10px 0 40px 0;
	float: right;	
}

@media (max-width: 768px) {
.successful_name{
	margin: 10px 0;
	float: none;
		
}
}




/*--文繞圖設定--*/

.float-item {
  margin: 20px;
  float: left;
  max-width: 300px; /* 桌面版限制圖片區塊寬度 */
}

.float-item img {
  max-width: 100%; /* 不超過父容器寬度 */
  height: auto;    /* 等比例縮放 */
  display: block;
}


.content {
  /*padding: 10px;*/
}

.my-container {
  width: 100%;
  margin: 0 auto;
}

/* 清除浮動 */
.clearfix::before,
.clearfix::after {
  content: "";
  display: table;
}

.clearfix::after {
  clear: both;
}

/* 響應式：小於768px時，圖片在上、文字在下 */
@media (max-width: 768px) {
  .float-item {
    float: none;       /* 取消浮動 */
    max-width: 100%;   /* 寬度佔滿容器 */
    margin: 0 auto 10px;
    text-align: center;
  }

  .container {
    /*width: 90%;*/
  }

  .content {
    padding: 0;
    font-size: 1em;
	line-height: 2;
	  text-align: justify;
  }
}
