@charset "utf-8";
body {font-family: 'Barlow', noto sans tc;}
#content_main, #content { margin:0;
  background: linear-gradient(to right, rgb(0 0 0 / 3%) 1px, transparent 1px), linear-gradient(to bottom, rgba(0, 0, 0, 0.03) 1px, transparent 1px);
  background-size: 20px 20px; /* 控制格線間距 */}

/*浮動*/
.info_fix_links{ display:block !important;}/*保持展開*/
.info_fix>span { display: none;}/*隱藏展開鈕*/
.info_fix { }  
.info_fix_links { padding-bottom: 0;}
.info_fix_links a { background: rgb(81 127 165/.5);}
.info_fix_links a:hover { background: rgb(81 127 165);}
.info_fix_links a:nth-of-type(3n-1) { background: rgb(81 165 104/.5);}
.info_fix_links a:nth-of-type(3n-1):hover {  background: rgb(81 165 104);}
.info_fix_links a:nth-of-type(3n) { background: rgb(133 132 70 / .5);}
.info_fix_links a:nth-of-type(3n):hover { background: rgb(133 132 70 );}

.info_fix_tel .fa-phone-volume::after {content: "慶福堂";}
.info_fix_tel2 .fa-phone-volume::after {content: "經緯";}
.info_fix_links a i { display: flex; flex-direction: column;}
.fa-phone-volume::after {  font-size: 11px;  font-weight: 400;  margin-top: 4px;}


/*隱藏內容*/
.me_tp_features{display:none;}
.box_link{display:none;}
.path p, .path p a{display:none;}
/*醫療團隊下拉選單隱藏*/
.stellarnav li:nth-of-type(2) > a:after{ display:none; }
.stellarnav li:nth-of-type(2) > ul { display:none;}
.stellarnav li:nth-of-type(2) > a{ padding-right: 0 !important;}
.stellarnav.mobile > ul > li:nth-of-type(2) > a.dd-toggle {  display: none;}


/*================================================Logo*/
.header_area .nav-brand { transition: all 0.3s; max-width: 100%;}
.header_area.sticky .nav-brand{}

.nav-header { max-width: 470px; margin: 7px 0 5px;}

/*.header_area .nav-brand {  animation: logo 1.5s infinite linear alternate; }
@keyframes logo{ 0% { transform: translateX(-20px);} 100% { transform: translateX(20px);}}*/

/*================================================header*/
.main_header_area .container{ max-width: 100%;}
.header_area { background: white; padding: 0;}
.header_area.sticky { background: white;}
	
.navigation { max-width: 100%; margin: auto; border-top: 5px solid #cfe8ef;}
.navigation { display: flex; flex-direction: column; justify-content: flex-start;align-items: center;}
.stellarnav ul { text-align: center; background: linear-gradient(180deg, #ececec, #ffffff, #ffffff); }

/*第一層*/
.stellarnav { }
.stellarnav li { }

.stellarnav > ul > li { letter-spacing: 0.5px;}
.stellarnav > ul > li:nth-of-type(even) { background: #0000000a;}

.stellarnav > ul > li > a { color: transparent; margin: 0 7px;}
.stellarnav > ul > li > a b { color: #636363; letter-spacing: 2px;}
/*.stellarnav > ul > li:nth-child(even) > a b { color: #bbebb1; }*/

.stellarnav > ul > li > a:hover b {  color: #81cc9e;}
.stellarnav li.has-sub > a:after { border-top:6px solid #71b6c8;}

/*第二層下拉*/
.stellarnav ul ul { background: transparent;    border: 1px #c4c4c4 solid;}
.stellarnav li li {  background: #cacaca;   border: none;}

.stellarnav li li a{color: #6f6f6f;  transition: all 0.6s; text-align: center; background: #ecf2f6;}
/*.stellarnav li li:nth-child(even) a{ background: #fff6e7;}*/
.stellarnav li li:hover a{ background: #325fa8; color: white;}

/*================================================footer*/
.footer { background: #fff; border-top: 1px solid #e8e8e8;}
.footer_info { display: flex; flex-direction: column; padding: 0 80px; grid-gap: 10px;}
.footer_info ul{ max-width: 100%;}
.footer_logo { max-width: 800px; margin: auto !important;}
.footer_logo img{/*display: none;*/}

/*資訊footer(1)*/
.footer_info li p {color:#676767; padding: 0 10px 5px;}
.footer_info li p a {color: #515151; font-weight: 500;}

.footer_info li{  padding: 10px 0 0;}
.footer_info li:nth-child(1){  display: flex; flex-wrap: wrap; justify-content: center; border-bottom: 1px solid #cfcfcf;}
.footer_info li p.add2:before {  content: '時間：';}
.footer_info li p.tel:before{content: '慶福堂中醫診所｜電話';}
.footer_info li p.tel2:before{content: '經緯中醫診所｜電話';}
.footer_info li p.add:before { content: '地址｜';}

/*按鈕footer(2)*/
.footer_menu { display: flex; flex-wrap: wrap; justify-content: center;max-width: 718px; margin: auto;}
.footer_menu a { width: 140px; text-align: center;}
.footer_menu a:hover {color: #fff; background: #8bc5d4; }


.copy { border-top: none;background: #a0a0a0; color:#fff;}
.copy a{ color: #fff; }

#to_top{border: 1px solid #ffffff33;background:#00000059;box-shadow: none;border-radius: 0;color: #ffffff;}
#to_top i.top {height: 16px;}
#to_top i.top:before, #to_top i.top:after {background: white;}

/*================================================首頁外掛*/
/*英文*/
.i_prod_tit h2, .i_video_tit h2, .news_part .title_i_box h6{font-size: 24px; font-weight: 400; color: #d5d5d5;}
/*中文*/
.i_prod_tit span, .i_video_tit span, .news_part .title_i_box h4
{font-size: 20px; color: #94b9d5; letter-spacing: 3px; }
.news_part .title_i_box{ margin-bottom: 15px;}
/*外框*/
.news_part, .prod_part{ padding: 5%;}

/*促銷*/
.i_news_b { display: none;}

.news_list ul {  max-width: 825px; margin: auto;}
.news_list ul li span { display: none;}
.news_list ul li p:after { position: static; transform: none; text-align: center; color: #cacaca; margin-top: 2px;}
.news_list ul li p { display: block; width: 100%; padding: 3px; text-align: center; }
.news_list ul li a { padding: 10px;}
.news_list ul li { margin: 10px;  background: #ffffff; border: 1px #ececec solid; border-radius: 10px;}
.news_list ul li:hover{background: #f5f9fc;}
.news_list ul li a:hover{background: transparent;}
	
/*購物*/	
.products-list .more { display: none;}
.i_prod_b a { display: none;}
.products-list .name { text-align: center; height: auto; margin-top: 5px; font-size: 16px;}
.products-list .item a { padding-bottom: 0;}
.pageIndex .productsListBox{ padding: 30px 0 0;}
	
/*================================================BANNER*/
/*大圖*/
/*預設解除背景輪播*/
.bannerindex { position:relative; height:auto;}
.swiper-banner { position:static; margin:0; height:auto;} 
.swiper-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet, .swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet
{border-radius: 0;}

/* .swiper-slide img { height:auto;} */

/*內頁*/
.banner { padding: 5% 0; background-size: cover; background-image: url(https://pic03.eapple.com.tw/chingfu/ban.jpg);}

.banner h5:before{ content: 'CHING.FU';}
.banner h5 { display: flex; flex-direction: column;}

.banner h5:before{ font-size: 20px; font-weight: 400; color: #00000069;}
.banner h5{ font-size: 25px; color: #fff; letter-spacing: 3px; }
@media screen and (max-width: 600px) { 
.banner h5:before {font-size: 17px;}
.banner h5 { font-size: 22px;}}
@media screen and (max-width: 425px) { 
.banner h5:before {font-size: 15px;}
.banner h5 { font-size: 20px;}}



.banner.banC h5:before{}
.banner.banC {/*background-image: url(https://pic03.eapple.com.tw/penguin/banC.jpg);*/}
.banner.banblog h5:before{}
.banner.banblog {}


/*================================================購物*/
.related_list li a img {   height: auto;}
.products-list .pic {    aspect-ratio: 1 / 2; border-radius: 15px;}	

/*每排數量*/
.pageIndex .products-list { grid-gap: 10px; max-width: 1024px; grid-template-columns: repeat(5, 1fr);}
.products-list { grid-gap: 10px; grid-template-columns: repeat(5, 1fr);}
@media screen and (max-width: 768px) {
  .pageIndex .products-list, .products-list {  grid-template-columns: repeat(3, 1fr);}
  .pageIndex .products-list, .products-list { grid-gap: 10px;}}
@media screen and (max-width: 450px) {
  .pageIndex .products-list, .products-list {  grid-template-columns: repeat(2, 1fr);}}

/*內頁*/
.sidebarBtn { border: 1px #ddd solid;}
.prod_related h6 span:before { content: '其他醫師';}


/*================================================文章*/
.articel_mainPic{ display:none;}
.blog_list_le{ border: 1px solid #e0e0e0;}
.subbox_item a { align-items: center;}
.subbox_item a:before {  color: #ffffff;}
.subbox_item a:after { background: #0000004a;}

/*回列表按鈕*/
.blog_back a.article_btn_back{background: #cc2d35}
/*上一頁按鈕*/
.lastPage{background: #bebebe;}

h5.blog_le_t span {  display: none;}
h5.blog_le_t em:before {
   /* content: "NEWS"; border-top: 1px solid black;   width: 100px;
	font-size: 30px; font-weight: 600; color: #151515;*/
}
h5.blog_le_t em { /* display: flex; flex-direction: column; color: #151515; padding: 10px; font-size: 20px;*/}


/*================================================表單*/
/*標題*/
.list_before.info li {  padding: 10px 0 15px 60px; border-bottom: 1px #f5f5f5 solid;}
.blank_letter { padding-top: 4px; padding-left: 3px; font-size: 20px;}

.information_left:before {
    content: "CONTACT"; border-top: 1px solid black; 
	font-size: 30px; font-weight: 600;
}
.information_right:before { content: "FORM";border-top: 1px solid black; 
	font-size: 30px; font-weight: 600;}

/*左邊資料*/
.info_TEL:before, .info_TEL2:before, .info_PHONE:before, .info_LINE:before, .info_FAX:before, .info_TAXID:before, .info_MAIL:before, .info_ADD:before, .info_ADD2:before{
	width: 44px;
    margin-left: 15px;
    font-size: 15px;
    height: 25px;
    /*border-right: 1px solid #ededed;*/
    letter-spacing: 0.05em;
    color: #545454;
    font-weight: bold;
}
.info_TEL:after, .info_TEL2:after, .info_PHONE:after, .info_LINE:after, .info_FAX:after, .info_TAXID:after, .info_MAIL:after, .info_ADD:after, .info_ADD2:after{
	position: absolute;
    content: "●";
    color: #135f9f;
    font-size: 5px;
    width: 30px;
    height: 17px;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
}

/*右邊表單*/
.contact_form li{padding: 7px 0;  border-bottom: 1px #f5f5f5 solid;}
.contact_form li .form__label{letter-spacing: 0.05em; color: #545454; font-weight: bold;}
.contact_form li input.noborder, 
.contact_form li textarea.noborder { border: none; background: #f3f3f3; border-radius: 5px;}

/*================================================按鈕*/
.animated-arrow {
	background: unset;
    border: 1px #998b79 solid;
	color: #998b79;
	transition:.3s;
	position:relative;
	overflow:hidden;
}
.animated-arrow b, .animated-arrow i{position:relative; z-index:99;}
.animated-arrow::after {
	content:"";
	position:absolute;
	width:0px;
	height:100%;
	top:0px;
	left:0px;
	background: #998b79;
	transition:.5s;
}
.animated-arrow:hover {	color: #fff;}
.animated-arrow:hover::after {	width:100%;}

/*================================================RWD1024*/
@media screen and (max-width: 1024px) { 
/*Logo*/
.header_area .nav-brand{/*max-width: 150px;*/}
.header_area.sticky .nav-brand{/*max-width: 110px;*/}

/*header*/
.stellarnav {}
}

/*================================================RWD768*/
@media screen and (max-width: 768px) {
	
	
/*********************側邊選單*/
/*menu*/
.stellarnav .menu-toggle:after { color: #95c688;}
.stellarnav .menu-toggle span.bars span { background: #e3b073;}
.stellarnav .menu-toggle, .stellarnav .call-btn-mobile, .stellarnav .location-btn-mobile, .stellarnav .close-menu {  padding: 0;}
.stellarnav.mobile{margin: 5px;}

/*close*/
.stellarnav.mobile.right .close-menu, .stellarnav.mobile.left .close-menu { background: transparent; padding: 15px;}
.stellarnav .icon-close:before, .stellarnav .icon-close:after { border-bottom: solid 3px #90b788;}
.stellarnav.mobile.right .close-menu, .stellarnav.mobile.left .close-menu {  color: #949494;}

/*底色*/
.stellarnav.mobile li a { border-bottom: none;}
.stellarnav.mobile.right > ul, .stellarnav.mobile.left > ul{background: #fffffff2; max-width: 300px;backdrop-filter: saturate(93%) blur(3px);}
.stellarnav.mobile > ul > li { border-bottom: 1px #0000000f solid;}
.stellarnav.mobile > ul > li > a{ padding: 15px 43px 15px 10px;}

/*第二層*/
.stellarnav.mobile li.open{ background: transparent;}
.stellarnav.mobile ul ul {margin: 0 15px 15px;}
.stellarnav li li a {}
.stellarnav li li:hover a { background: #325fa8;}

/*文字*/
.stellarnav a.dd-toggle .icon-plus:before, .stellarnav a.dd-toggle .icon-plus:after {  border-bottom: solid 3px #767676;}

.stellarnav > ul > li > a b, .stellarnav > ul > li:nth-child(even) > a b { color: #757575;}
.stellarnav > ul > li > a b:nth-child(2){color: #b5c6b1; }
	
/*********************footer*/
#bottom_menu {display: flex; }
#bottom_menu li { background: #6683a1; border-right: 1px solid #515961;}
#bottom_menu li a { color: #fff;}
#bottom_menu li a i { color: #fff;}

#bottom_menu li:nth-child(2) a em:before{content: '慶福堂';}
#bottom_menu li:nth-child(3) a em:before{content: '經緯';}

.footer.with_shopping_mode { padding:30px 0 55px; }
#to_top { bottom:60px;}
.copy { padding-top: 8px;}
.footer_info { padding:0 10px; flex-direction: column;}
.footer_info li+li { margin-top: 0;}

h5.blog_le_t, .blog_le .accordion {display: block; text-align: center;}
h5.blog_le_t em:before {  margin: auto;}

.contact_content .information_right {  padding: 50px 10px 10px; }

/*大圖*/
.bannerindex { padding:0; /*margin:0;*/}


}
@media screen and (max-width: 600px) { 
.news_list ul li p:after { margin-right: 0;}
.news_list ul li { /*margin: 10px; background: #ffffff;*/}

.contact_form li .form__label { background: transparent;}

}

@media screen and (max-width: 570px) { 
.stellarnav .menu-toggle, .stellarnav .call-btn-mobile, .stellarnav .location-btn-mobile, .stellarnav .close-menu {  padding: 0;}
.header_area .nav-brand { margin-left: 35px; margin-right: 5px;}
}

@media screen and (max-width: 425px) { 

.footer {  animation: shake 30s linear infinite;}
}

