@charset "UTF-8";
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans:ital,wght@0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap'); /*felixtitlingmt*/
@import url('https://fonts.googleapis.com/css2?family=Noto+Serif+TC:wght@200..900&display=swap'); /*思源宋*/
body {
	font-family: "Noto Serif TC", serif;
	overflow-x: hidden;
	background-position: top right;
	background-repeat: no-repeat;
	width: 100%;
	letter-spacing: 1px;
	color: #454747;
	background-color: #fff;
	font-weight: 600;
}
.font_e {
	font-family: 'felixtitlingmt';
	text-transform: uppercase;
}
.Noto {
	font-family: "Noto Serif TC", serif;
	text-transform: uppercase;
	font-weight: 600;
}
html {
	overflow-x: hidden;
	width: 100%;
	position: relative;
}
img {
	max-width: 100%;
	height: auto;
	width: auto;
}
html, body {
	height: 100%;
	margin: 0;
}
body {
	display: flex;
	flex-direction: column;
	min-height: 100vh; /* 至少填滿視窗高度 */
}
form, main {
	flex: 1; /* 自動撐開中間區域 */
}
div:focus {
	outline: none;
}
a {
	text-decoration: none;
	color: #454747;
}
a:hover {
	color: #78ad51;
}
textarea {
	resize: none;
}
.gotop {
	position: fixed;
	right: 10px;
	top: 65%;
	z-index: 99;
	width: 40px;
	text-align: center;
}
.floating-btn {
	position: fixed;
	top: 50%;
	right: 10px;
	z-index: 99;
	width: 40px;
}
.floating-btn a, .floating-btn a:hover {
	color: #fff;
	padding: 10px 0;
}
.visually-hidden {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}
/*--------------------------------------------------------------
# img size
--------------------------------------------------------------*/
.img_1x1 {
	width: 100%; /* 可以依需要調整為你想要的寬度 */
	aspect-ratio: 1 / 1; /* 保持比例 */
	overflow: hidden;
	position: relative;
}
.img_1x1 img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.6s ease-out;
}
.card:hover .img_1x1 img, a:hover .img_1x1 img {
	transform: scale(1.1);
}
.img_4x3 {
	width: 100%; /* 可以依需要調整為你想要的寬度 */
	aspect-ratio: 4 / 3; /* 保持比例 */
	overflow: hidden;
	position: relative;
}
.img_4x3 img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.6s ease-out;
}
.card:hover .img_4x3 img, a:hover .img_4x3 img {
	transform: scale(1.1);
}
.img_16x9 {
	width: 100%; /* 可以依需要調整為你想要的寬度 */
	aspect-ratio: 16 / 9; /* 保持比例 */
	overflow: hidden;
	position: relative;
}
.img_16x9 img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.6s ease-out;
}
.card:hover .img_16x9 img, a:hover .img_16x9 img {
	transform: scale(1.1);
}
.img_21x9 {
	width: 100%; /* 可以依需要調整為你想要的寬度 */
	aspect-ratio: 21 / 9; /* 保持比例 */
	overflow: hidden;
	position: relative;
}
.img_21x9 img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.6s ease-out;
}
.card:hover .img_21x9 img, a:hover .img_21x9 img {
	transform: scale(1.1);
}
.breadcrumb-item.active {
	color: #d6011b;
}
.mt_top {
	margin-top: 78px;
}
.multiline_ellipsis {
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 2;
	overflow: hidden;
}
/*--------------------------------------------------------------
# box_border
--------------------------------------------------------------*/
.box_border {
	border: 1px solid #78ad51;
}
/*--------------------------------------------------------------
# social_media
--------------------------------------------------------------*/
ul.social_media {
	display: inline;
	padding: 0px;
	margin: 0;
	text-align: center;
}
ul.social_media li {
	display: inline-block;
	position: relative;
}
ul.social_media li a i {
	width: 45px;
	height: 45px;
	line-height: 45px;
	font-size: 25px;
	text-align: center;
	background-color: #fff;
	border-radius: 50px;
	color: #3c4650;
}
ul.social_media li a:hover i {
	background-color: #78ad54;
	color: #fff;
}
ul.social_media li a img {
	width: 30px;
	height: 30px;
	line-height: 30px;
}
/* Accordion 按鈕箭頭 */
.accordion-button::after {
 background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%2378ad51'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
 transform: rotate(0deg);
 transition: transform .3s ease;
}
/* 展開時旋轉箭頭 */
.accordion-button:not(.collapsed)::after {
 transform: rotate(180deg);
 background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%2378ad51'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
}
.accordion-button:not(.collapsed) {
 color: #78ad51;
 background-color: #f8f5ec;
 box-shadow: none;
}
.accordion-button:focus {
	box-shadow: 0 0 0 0 transparent;
	background-color: #fff;
}
/*--------------------------------------------------------------
# color
--------------------------------------------------------------*/
.main_color {
	color: #78ad51;
}
.red_color {
	color: #af0a0a;
}
.bg_main_color {
	background-color: #f7f7f7;
}
.gray_bg_color {
	background-color: #f3eee3;
}
.bg_green_color {
	background-color: #78ad51;
}
.orange_color {
	color: #ff8e14;
}
/*--------------------------------------------------------------
# font-size
--------------------------------------------------------------*/ :root {
 --fluid-min: 320; /* 最小螢幕寬度 */
 --fluid-max: 1920; /* 最大螢幕寬度 */
}
.fs {
 --font-size: calc((var(--min-size) * 1px) + (var(--max-size) - var(--min-size)) * ((100cqw - var(--fluid-min) * 1px) / (var(--fluid-max) - var(--fluid-min))));
 font-size: clamp(calc(var(--min-size) * 1px), var(--font-size), calc(var(--max-size) * 1px));
}
.fs_1 {
	font-size: clamp(40px, 4vw, 50px);
	line-height: 0.75;
} /* H1 */
.fs_2 {
	font-size: clamp(32px, 3vw, 37px);
	line-height: 1.1;
} /* H2 */
.fs_3 {
	font-size: clamp(25px, 2.5vw, 32px);
	line-height: 1.3;
} /* H3 */
.fs_4 {
	font-size: clamp(18px, 2vw, 24px);
	line-height: 1.4;
} /* H4 */
.fs_5 {
	font-size: clamp(16px, 1.5vw, 18px);
	line-height: 1.4;
} /* H5 */
.fs_6 {
	font-size: clamp(14px, 1vw, 15px);
	line-height: 1.45;
} /* H6 */
.fs_p {
	font-size: clamp(15px, 1vw, 16px);
	line-height: 1.6;
} /* 內文 */
.fs_small {
	font-size: clamp(12px, 0.8vw, 14px);
	line-height: 1.6;
} /* 小字 */
/*--------------------------------------------------------------
# pagination
--------------------------------------------------------------*/
.pagination {
	justify-content: center;
}
.page-link {
	color: #333;
	border-radius: 50px;
	margin: 0 10px;
	width: 35px;
	height: 35px;
	line-height: 30px;
	padding: 0;
	background-color: #fff;
	border: 0;
	border: 2px solid #78ad51;
}
.page-item.active .page-link {
	z-index: 3;
	color: #fff;
	background-color: #78ad51;
	border-color: #78ad51;
}
.page-link:hover {
	color: #fff;
	background-color: #78ad51;
	border-color: #78ad51;
}
.page-link:focus {
	z-index: 3;
	color: #fff;
	background-color: #78ad51;
	outline: 0;
	box-shadow: 0 0 0 0rem rgba(13, 110, 253, .25);
}
.page-item:first-child .page-link {
	border-radius:  50px;
}
.page-item.active .page-link {
	border-radius:  50px;
}
.page-item:last-child .page-link {
	border-radius:  50px;
}
/*--------------------------------------------------------------
# table
--------------------------------------------------------------*/
.table-responsive > .table > tbody > tr > td, .table-responsive > .table > thead > tr > th {
	white-space: nowrap;
	margin-bottom: 0;
}
.table-responsive {
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
}
.table th {
	padding: 10px 10px;
}
.table td {
	padding: 10px 10px;
	border-bottom: 0;
}
/*--------------------------------------------------------------
# banner
--------------------------------------------------------------*/
.banner_area {
	font-size: 30px;
	color: #78ad51;
	position: relative;
	margin-bottom: 20px;
	line-height: 50px;
	text-transform: capitalize;
	text-align: center;
}
.sbanner_area {
	font-size: 30px;
	color: #78ad51;
	position: relative;
	margin-bottom: 20px;
	line-height: 50px;
	padding: 8px 20px;
	background-color: #e8e4dc;
}
.sbanner_area:after {
	position: absolute;
	content: '';
	top: 100%;
	left: 30px;
	border: 15px solid transparent;
	border-top: 15px solid #e8e4dc;
	width: 0;
	height: 0;
}
/*--------------------------------------------------------------
# form style
--------------------------------------------------------------*/
.form-control {
	line-height: 28px;
	border-radius: 0px;
	background-color: #fff;
	color: #493c35;
	border: 1px solid #ccc;
	padding: 8px 8px;
}
.form-control::placeholder {
 color: #999;
}
.form-control:focus {
	box-shadow: 0 0 0 0 transparent;
	color: #493c35;
	background-color: #fff;
	border: 1px solid #78ad51;
	padding: 8px 8px;
}
.form-control_search:focus {
	background-color: #fff;
}
.form-control_search {
	line-height: 28px;
	border-radius: 0px;
	background-color: #fff;
	color: #493c35;
	border: 0;
	padding: 8px 8px;
}
.form-select {
	line-height: 28px;
	border-radius: 0px;
	background-color: #fff;
	color: #493c35;
	border: 1px solid #ccc;
	padding: 8px 8px;
}
.form-select::placeholder {
 color: #ccc;
}
.form-select:focus {
	box-shadow: 0 0 0 0 transparent;
	color: #493c35;
	background-color: #fff;
	border: 1px solid #78ad51;
	padding: 8px 8px;
}
/*btn*/
.btn:focus {
	box-shadow: 0 0 0 0rem rgba(0, 140, 255, 1.00);
	-webkit-box-shadow: 0 0 0 0rem rgba(0, 140, 255, 1.00);
}
.main_btn {
	color: #fff;
	background-color: #71bd40;
	padding: 8px;
	position: relative;
	border: 1px solid #71bd40;
	border-radius: 0px;
}
.main_btn:hover, a:hover.main_btn {
	border: 1px solid #78ad51;
	background-color: #78ad51;
	color: #fff;
}
.more_btn {
	color: #ff8e14;
	position: relative;
	padding: 0 70px 0 0;
}
.more_btn::before {
 position: absolute;
 top: 50%;
 right: 0;
 width: 50px;
 height: 1px;
 background-color: #ff8e14;
 content: '';
}
.btn-close {
	position: absolute;
	top: -10px;
	right: -10px;
	z-index: 999;
	width: 30px;
	height: 30px;
	line-height: 30px;
	border-radius: 50px;
	background-color: #fff;
}
/*--------------------------------------------------------------
# navbar
--------------------------------------------------------------*/
.dropdown:hover .dropdown-menu {
	display: block;
	margin-top: 0;
}
#menu .btn-close {
	position: absolute;
	top: 1rem;
	right: 1rem;
	padding: 10px;
	font-size: 1rem;
	z-index: 1100;
}
.navbar-nav {
	margin-top: 70px;
	font-size:18px;
}
.navbar-toggler:focus {
	text-decoration: none;
	outline: 0;
	box-shadow: 0 0 0 0;
}
.navbar-light .navbar-toggler {
	border: 1px solid #78ad51;
	background-color: #78ad51;
	padding: 0;
	border-radius: 50px;
	width: 50px;
	height: 50px;
	line-height: 50px;
	color: #fff;
}
.navbar-light .navbar-toggler:hover {
	background-color: #fff;
	color: #78ad51;
	border: 1px solid #78ad51;
}
.navbar-light .navbar-nav .nav-link {
	color: #493c35;
	padding: 20px 0;
}
.navbar-light .navbar-nav.show {
	color: #78ad51;
	background-color: #78ad51;
	border-radius: 0px;
	font-weight: 800;
}
.navbar-light .navbar-nav a:hover.nav-link {
	color: #78ad51;
}
.dropdown-menu a:hover {
	background-color: transparent;
	color: #78ad51;
}
.dropdown-toggle::after {
 position: absolute;
 right: 10px;
 top: 20px;
 font-size: 16px;
 font-family: "Font Awesome 6 Free";
 content: '\f107';
 font-weight: 700;
 border: 0;
}
.navbar-collapse {
	height: 100vh;
	z-index: 999;
}
.navbar-nav .nav-link {
	padding: 15px 15px;
	border-bottom: 1px solid #eee;
}
.dropdown-menu {
	border: 0;
	background-color: #f7f7f7;
	padding: 0;
}
.dropdown-item {
	padding: 15px 15px;
	border-bottom: 1px solid #eee;
}
/*--------------------------------------------------------------
# 選單
--------------------------------------------------------------*/
ul.side_menu {
	padding: 0;
	margin: 0;
	text-align: center;
}
ul.side_menu > li {
	display: inline-block;
	list-style: none;
	position: relative;
}
ul.side_menu > li > a {
	text-decoration: none;
	display: block;
	background-color: #fff;
	padding: 6px 20px;
	border: 1px solid #78ad51;
	border-radius: 30px;
	margin: 0 3px;
}
ul.side_menu > li > a:hover, ul.side_menu > li .current {
	text-decoration: none;
	display: block;
	color: #fff;
	background-color: #78ad51;
	border: 1px solid #78ad51;
}
ul.side_menu > li > a:hover::before, ul.side_menu > li .current::before {
 content: '\f0d7';
 font-family: "Font Awesome 6 Free";
 position: absolute;
 bottom: -24px;
 left: 40%;
 width: 20%;
 text-align: center;
 font-weight: 900;
 color: #78ad51;
 font-size: 30px;
}
/* 子選單預設隱藏 */
ul.side_menu li ul {
	display: none;
	position: absolute;
	top: 100%;
	left: 0;
	padding: 0;
	margin: 0;
	background: #fff;
	border: 1px solid #ddd;
	min-width: 160px;
	z-index: 999;
}
/* hover 顯示子選單 */
ul.side_menu li:hover > ul {
	display: block;
}
/* 子選單樣式 */
ul.side_menu li ul li {
	display: block;
	list-style: none;
	padding: 10px;
	white-space: nowrap;
}
ul.side_menu li ul li a {
	color: #333;
	text-decoration: none;
	display: block;
	padding: 8px 20px;
	border-bottom: 1px solid #eee;
}
/* hover 效果 */
ul.side_menu li ul li a:hover {
	background: #78ad51;
	color: #fff;
	padding: 8px 20px;
}
/* 第三層子選單向右展開 */
ul.side_menu li ul li ul {
	top: 0;
	left: 100%;
}
/*--------------------------------------------------------------
# mobile_dropdown
--------------------------------------------------------------*/
.accordion-button:not(.collapsed) {
 color: #493c35;
 background-color: #fff;
 box-shadow: inset 0 -1px 0 rgba(0, 0, 0, .125);
}
ul.mobile_dropdown, .sub-menu, .sub-sub-menu {
	list-style: none;
	padding: 0;
	margin: 0;
}
ul.mobile_dropdown li {
	position: relative;
}
ul.mobile_dropdown li a {
	display: block;
	color: #493c35;
	padding: 13px 10px 13px 30px;
	font-size: 15px;
	border-bottom: 1px solid #eee;
	background-color: #fff;
	text-align: left;
	position: relative;
}
ul.mobile_dropdown li a:hover {
	background-color: #78ad51;
	color: #fff;
}
ul.mobile_dropdown li a::before {
 position: absolute;
 top: 45%;
 left: 15px;
 font-size: 5px;
 font-family: "FontAwesome";
 content: '\f111';
 font-weight: 700;
}
/* 有子選單的箭頭 */
.has-sub::after {
 content: "+";
 font-family: "FontAwesome";
 position: absolute;
 right: 15px;
 top: 50%;
 transform: translateY(-50%);
 font-size: 14px;
}
/* 開啟時箭頭改變 */
.show-sub > .has-sub::after {
 content: "\f068"; /* FontAwesome 上箭頭 */
}
/* 隱藏巢狀選單 */
.sub-menu, .sub-sub-menu {
	display: none;
	background: #78ad51;
	padding-left: 20px;
}
/* 展開巢狀選單 */
.show-sub > .sub-menu, .show-sub > .sub-sub-menu {
	display: block;
}
/*--------------------------------------------------------------
# footer
--------------------------------------------------------------*/
@media (min-width:480px) {
}
@media only screen and (min-width: 768px) {
}
@media (max-width: 991px) {
  /*--------------------------------------------------------------
# navbar
--------------------------------------------------------------*/
  .navbar-collapse {
 position: fixed;
 top: 0px;
 right: -100%;
 width: 100%;
 height: 100vh;
 background-color: #fff;
 transition: right 0.3s ease-in-out;
 z-index: 1050;
 padding: 1rem;
 max-width: 300px;
}
 .navbar-collapse.show {
 right: 0;
}
}
@media (min-width:992px) {
 .mt_top {
 margin-top: 110px;
}
  /*--------------------------------------------------------------
# navbar
--------------------------------------------------------------*/
  .navbar-nav {
 margin-top: 0px;
}
 .navbar-expand-lg .navbar-collapse {
 display: flex !important;
 justify-content: center;
}
 .navbar-expand-lg .navbar-nav .nav-link {
 padding: 10px 13px;
}
 .dropdown-toggle::after {
 display: none;
}
 .navbar-nav .nav-link {
 border: 0;
}
 .navbar-light .navbar-nav .nav-link {
 border-bottom: 0;
}
 .navbar-collapse {
 height: auto;
}
 .nav-item .nav-link {
 position: relative;
}
 .nav-item::before {
 background-repeat: no-repeat;
 position: absolute;
 left: -2px;
 top: 20%;
 content: '';
 width: 3px;
 height: 25px;
 background-image: url(../images/menu_dot.png);
}
 .nav-item:first-child::before {
 background-repeat: no-repeat;
 position: absolute;
 right: -5px;
 top: 20%;
 content: '';
 background-image:none;
 width: 3px;
 height: 25px;
}
 .nav-link {
 padding: 15px 0;
 border-bottom: 0;
}
 .dropdown-item {
 padding: 15px;
 border-bottom: 1px solid #eee;
}
 .dropdown-menu {
 padding: 0;
}
 /*--------------------------------------------------------------
# main
--------------------------------------------------------------*/
.main_area {
 position: relative;
 z-index: 0;
}
.main_area::before {
 content: '房產活化的解決專家';
 position: absolute;
 right:80px;
 bottom: -14px;
 font-family: "Noto Serif TC", serif;
 font-size:40px;
 color: #78ad51;
 z-index: -1;
 opacity:0.2;
 font-weight:600;
 font-style:italic;
}
}
@media (min-width:1200px) {
 .gotop {
 width: 50px;
}
 .floating-btn {
 width: 70px;
}
 .mt_top {
 margin-top: 135px;
}
  /*--------------------------------------------------------------
# navbar
--------------------------------------------------------------*/
  .navbar-expand-lg .navbar-collapse {
 justify-content: end;
}
/*--------------------------------------------------------------
# main
--------------------------------------------------------------*/
}
@media (min-width:1400px) {
 .mt_top {
 margin-top: 109px;
}
 .navbar-expand-lg .navbar-nav .nav-link {
 padding: 0px 8px;
}
 .nav-item::before {
 top: 6%;
}
 .navbar-expand-lg .navbar-collapse {
 justify-content: left;
}
.navbar-nav {
 font-size:20px;
}
}
@media (min-width:1600px) {
 .navbar-expand-lg .navbar-nav .nav-link {
 padding: 0px 15px;
}
/*--------------------------------------------------------------
# main
--------------------------------------------------------------*/
.main_area::before {
 bottom: -15px;
 font-size:60px;
}
}