.banner{ margin-top: 113px; aspect-ratio: 72 / 25; position: relative; background-repeat: no-repeat; background-position: center; background-size: cover; }
.banner::after{ content: ""; display: block; position: absolute; z-index: 1; inset: 0; margin: auto; background: linear-gradient(to bottom,  rgba(134,198,54,1) 0%,rgba(63,168,187,0.2) 60%); }
.banner h1{ position: absolute; inset: 0; margin: auto; z-index: 2; color: #fff; text-shadow: 5px 5px 4px rgba(0,0,0,0.25); display: flex; justify-content: center; align-items: center; }
.banner .nav{ max-width:1328px; margin: auto; padding: 0 24px; position: absolute; z-index: 3; bottom: 15px; left: 0; right: 0; margin: auto; display: flex; align-items: flex-end;flex-wrap: wrap; gap:7px; }
.banner .nav .img{ font-size: 0; }
.banner .nav img{ vertical-align: middle; }
.banner .nav a,.banner .nav span{ display: inline-flex; align-items: flex-end; color: #fff; font-size: 1.125rem; align-items: center;}
.banner .nav a:after,.banner .nav span:after{ content: "/"; display: inline; margin-left: 7px; color: #fff; font-size: 1.25rem; }
.banner .nav a:last-child:after,.banner .nav span:last-child:after{ display: none; }

/* 昇和服務 */
.service_container{ display: flex; gap: 35px 0; justify-content: center; margin-bottom: 60px; margin-left: -35px; }
.service_container:last-child{ margin-bottom: 0; }
.service_item{ padding: 0 0 0 35px; width: 33.3333%; min-height: 650px; }
.service_item .item{ display: block; width: 100%; height: 100%; padding: 30px 40px; position: relative; border-radius: 20px; box-shadow: 0 0 20px rgba(0,0,0,0.1); overflow: hidden; }
.service_item .item .position_relative{ position: relative; z-index: 2; height: 100%; }
.service_item .item .title{ display: flex; align-items: center; gap: 15px; margin-bottom: 25px; }
.service_item .item .title .icon{ width: 30px; }
.service_item .item .title h3{ color: var(--color-tertiary); }
.service_item .item p{ line-height: 1.8; }
.service_item .item .flex_box{ display: flex; flex-direction: column; justify-content: space-between; height: 100%; }
.service_item .item .btn{ width: 80px; height: 80px; border-radius: 100%; display: flex; justify-content: center; align-items: center;
background: linear-gradient(to bottom,  rgba(134,198,54,1) 0%,rgba(63,168,187,1) 100%); }
.service_item .item .btn i{ color: #fff; font-size: 2rem; }
.service_item .item .item_bg{ width: 100%; position: absolute; bottom: 0; left: 0; right: 0; margin: auto; padding-bottom: 100%;     background-size: 130%; background-position: left 50% top; background-repeat: no-repeat; }
.service_item .item .item_bg::before{ content: ""; display: block; width: 100%; height: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; background: linear-gradient(165deg, rgba(255, 255, 255, 1) 20%, rgba(255, 255, 255, 0) 100%); }

/* 昇和服務 詳細 */
.service_sort{ display: flex; justify-content: space-between; }
.service_sort .item{ display: flex; gap:15px; border: 1px solid #ccc; border-radius: 10px; padding: 10px 40px; }
.service_sort .item .icon{ width: 30px; aspect-ratio: 1 / 1; }
.service_sort .item .txt{ font-size: 1.25rem; color: var(--color-tertiary); }
.service_sort .item.active{ background-color: var(--color-primary); border-color: var(--color-primary); }
.service_sort .item.active .icon img{ filter: brightness(1000%) }
.service_sort .item.active .txt{ color: #fff; }
.btn_close_service{ display: none; }

.sort_btn_mobile{ display: none; text-align: right; }
.sort_btn_mobile .btn{ display: inline-block; width: 30px; }
.sort_btn_mobile i{ font-size: 1.75rem; color: var(--color-secondary); }

.service_main_title{ display: flex; align-items: center; gap: 50px; margin-bottom: 50px; }
.service_main_title .line{ flex:1; height: 1px; background-color: var(--color-gray-ccc); }

.service_box{ line-height: 1.6; }
.service_box p{ font-size: 1.125rem; }
.service_box .blue{ color: var(--color-secondary); }
.service_box .gray{ color: var(--color-gray-aaa); }
.service_box .bold{ font-weight: 700; }

.service_title{ display: flex; align-items: baseline; gap:10px; }
.service_title h3{ color: var(--color-tertiary); }
.service_title .remark{ background-color: #eee; color: var(--color-tertiary); font-size: 1.25rem; padding:2px 5px; }

.service_ul,.service_ul li{ list-style: disc; }
.service_ul li{ margin-bottom: 15px; margin-left: 25px; }
.service_ul li .emphasis{ color: var(--color-secondary); font-weight: bold; } 

.service_nav_list{ display: flex; align-items: baseline; margin-bottom: 15px; }
.service_nav_list:last-child{ margin-bottom: 0; }
.service_nav_list .green_style{ display: flex; align-items: baseline; color: var(--color-primary); font-weight: bold; gap: 5px; }
.service_nav_list .green_style i{ color: var(--color-primary); font-weight: bold; }
.service_nav_list .flex_text{ flex:1 }

.service_remark{ background-color: var(--color-secondary); color: #fff; padding: 20px 15px; }

.service_list_box{ display: flex; flex-direction: column; }
.service_list_box .list_flex{ display: flex; width: 100%; padding: 20px 0; border-bottom: 1px solid #ccc; gap: 10px; }
.service_list_box .list_flex .bullet{ width: 28px; height: 28px; background-color: var(--color-primary); color: #fff; border-radius: 100%; text-align: center; }
.service_list_box .list_flex .contact_grid{ flex:1; display: flex; align-items: baseline; gap:15px; }
.service_list_box .list_flex .contact_grid.column{ flex-direction: column; }
.service_list_box .list_flex .contact_grid .remark{ font-size: 0.875rem; color: var(--color-tertiary); margin-right: 10px; }
.service_list_box .list_flex .contact_grid .remark.gray{ color: var(--color-gray-aaa); }
.service_list_box .list_flex .contact_grid .multiple{ display: flex; gap:5px; }
.service_list_box .list_flex .contact_grid .multiple .green_style{ color: var(--color-primary); font-size: 1.125rem; font-weight: 700; }
.service_list_box .list_flex .contact_grid .multiple .green_style i{ color: var(--color-primary); }
.service_list_box .list_flex .contact_grid .multiple p{ flex:1; }

.service_box .table{ border-radius: 10px; overflow: hidden; border-collapse: collapse; width: 100%; }
.service_box .table th{ background-color: var(--color-primary); color: #fff; font-size: 1.125rem; border: 1px solid #fff; padding: 10px; }
.service_box .table td{ background-color: var(--color-gray-eee); font-size: 1.125rem; border: 1px solid #fff; padding: 10px; text-align: center; }
.service_box .table.sp{ display: none; }
.service_box .table th.w_33{ width: 33%; }

.service_box .compare_box{ display: flex; }
.service_box .compare_box .compare_grid{ flex:1; border-right: 1px solid #ccc; padding: 0 60px 0 0; }
.service_box .compare_box .compare_grid:last-child{ border-right: none; padding: 0 0 0 60px; }
.service_box .compare_box .compare_grid h3{ color: var(--color-primary); margin-bottom: 20px; }
.service_box .compare_box .condition_flex{ display: flex; align-items: baseline; gap:20px; margin-bottom: 20px; }
.service_box .compare_box .condition_flex:last-child{ margin-bottom:0; }
.service_box .compare_box .condition_flex .title{ width: 165px; background-color: var(--color-primary); color: #fff; text-align: center; padding: 10px 0; font-size: 1.125rem; }
.service_box .compare_box .condition_flex .contentTxt{ flex:1; font-size: 1.125rem; line-height: 1.8; }
.service_box .compare_box .condition_flex .contentTxt .emphasis{ color: var(--color-primary); font-size: inherit; line-height:inherit }

.service_box .compare_box .compare_grid:last-child h3{ color: var(--color-secondary); }
.service_box .compare_box .compare_grid:last-child .condition_flex .title{ background-color: var(--color-secondary); }
.service_box .compare_box .compare_grid:last-child .condition_flex .contentTxt .emphasis{ color: var(--color-secondary); }

.service_box .construction{ display: flex; justify-content: space-between; gap:20px; }
.service_box .construction .item{ width: 25%; max-width: 260px; }
.service_box .construction .item .img{ width: 100%; aspect-ratio: 1 / 1; border-radius: 100%; background-repeat: no-repeat; background-size: cover; background-position: center; }
.service_box .construction .item .title{ text-align: center; font-size: 1.25rem; margin-top: 20px; }

.service_box .stepbox{ border: 1px solid #ccc; padding: 40px; border-radius: 20px; display: flex; gap:70px }
.service_box .stepbox .left_data{ display: flex; flex-direction: column; justify-content: space-between; }
.service_box .stepbox .left_data .txt{ border: 2px #ccc dashed; padding: 10px; text-align: center; font-size: 1.75rem; color: var(--color-primary); font-weight: 700; border-radius: 10px; }
.service_box .stepbox .right_table{ width: 30%; }

.service_box .formula_img01{ width: 77.8125%; }
.service_box .formula_img02{ width: 54.14%; }

.service_box .merit{ display: flex; gap: 20px; }
.service_box .merit .grid{ flex:1; border: 2px solid var(--color-secondary); border-radius: 20px; overflow: hidden; }
.service_box .merit .grid .icon_box{ border-radius:0 0 20px 20px; padding: 20px; background-color: var(--color-secondary); }
.service_box .merit .grid .icon_box .icon{ background-color: #fff; width:50%; max-width: 100px; aspect-ratio: 1 / 1; border-radius: 100%; display: flex; justify-content: center; align-items: center; margin: auto; box-shadow: 5px 5px 10px rgba(0,0,0,0.2); }
.service_box .merit .grid .icon_box .icon img{ width: 50%; }
.service_box .merit .txt{ font-size: 1.125rem; padding: 30px; }
.service_box .merit .txt .blue{ display: block; margin-bottom: 10px; font-weight: 700; color: var(--color-secondary); font-size: inherit; }

.service_box .img_sp{ display: none; }

.service_sort_mark.other{ display: block; position: static; background: none; margin-bottom: 60px; }
.service_sort_mark.other .service_sort{ justify-content: center; gap: 30px; flex-direction:row; }
.service_sort_mark.contact{ margin-bottom: 0; }

/* 最新消息 */
.news_flex{ display: flex; gap:60px 20px; flex-wrap: wrap; }
.news_flex .item{ width: calc((100% - (2 * 20px)) / 3); display: block; }
.news_flex .item .img{ width: 100%; padding-bottom: 65.57%; border-radius: 20px; overflow: hidden; position: relative; }
.news_flex .item .img img{ position: absolute; inset: 0; margin: auto; max-width: none; width: 100%; }
.news_flex .item .event_info{ display: flex; align-items: center; justify-content: space-between; }
.news_flex .item .category_tag{ background-color: var(--color-primary); color: #fff; font-size: 0.875rem; padding: 0 5px; }
.news_flex .item .date{ color: var(--color-gray-aaa); font-size: 1.125rem; }
.news_flex .item h4{ color: var(--color-tertiary); display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; line-height: 1.6; }
.news_flex .item .align{ text-align: center; }
.news_flex .item .btn_more{  background-color:var(--color-secondary); border-radius: 50px; display: inline-flex; padding: 10px 20px; min-width: 120px; justify-content: center; align-items: center; }
.news_flex .item .btn_more .txt{ flex:1; color: #fff; font-size: 1.125rem; }
.news_flex .item .btn_more i{ color: #fff; }

.category_box{ text-align: right; margin-bottom: 40px; }
.category_box .btn{ display: inline-block; border: 1px solid #ccc; padding: 0 0 0 20px; border-radius: 10px; position: relative; }
.category_box .btn::after{ content: ""; display: block; border-style: solid; width: 0; height: 0; border-width: 8px 5px 0 5px; border-color: #000 transparent transparent transparent; position: absolute; top: 0; bottom: 0; margin: auto; right: 10px; pointer-events: none; }
.category_box .btn select{ background: none; border: none; width: 100%; font-size: 1.25rem; color: var(--color-tertiary); height: 56px; -webkit-appearance: none; -moz-appearance: none; appearance: none; padding: 0 30px 0 0; }

/* 最新消息 詳細 */
.news_detail_event_info{ display: flex; align-items: center; gap:20px; }
.news_detail_event_info .category_tag{ background-color: var(--color-primary); color: #fff; font-size: 1.125rem; padding:5px 10px; }
.news_detail_event_info .date{ color: var(--color-gray-aaa); font-size: 1.125rem; padding-right: 10px; }
.news_detail_event_info .line{ flex:1; height: 1px; background-color: var(--color-gray-ccc); }

.news_detail_content{ display: flex; flex-direction: column; gap: 80px; }
.news_detail_content h4{ color: var(--color-tertiary); }
.news_detail_content .news_listing_item{ display: flex; align-items: center; gap:50px; }
.news_detail_content .news_listing_item .image{ width: 40%; aspect-ratio: 257 / 168; background-color: var(--color-gray-eee); border-radius: 20px; background-position: center; background-size: cover; background-repeat: no-repeat; overflow: hidden; }
.news_detail_content .news_listing_item .image img{ width: 100%; height: 100%; object-fit: cover; vertical-align: middle; }
.news_detail_content .news_listing_item .video{ width: 40%; aspect-ratio: 257 / 168; background-color: var(--color-gray-eee); border-radius: 20px; position: relative; overflow: hidden; }
.news_detail_content .bottom .news_listing_item .video, .news_detail_content .top .news_listing_item .video, .news_detail_content .all .news_listing_item .video{ width: 70%; aspect-ratio: 257 / 168; }
.news_detail_content .news_listing_item .video iframe{ position: absolute; top: 0; left: 0; height: 100% !important; width: 100% !important; }

.news_detail_content .all .news_listing_item{ flex-direction: column; gap: 30px; }
.news_detail_content .all .news_listing_item .image{ width: 100%; text-align: center; background:none; overflow: initial; aspect-ratio:initial; border-radius: 0; }
.news_detail_content .all .news_listing_item .image img{ max-width: 100%; width: auto; height: auto; vertical-align: middle; border-radius: 20px; }

.news_detail_content .news_listing_item .text_box{ flex:1; }
.news_detail_content .news_listing_item .text_box p{ word-break: break-all; }

.news_detail_content .left .news_listing_item{ flex-direction:row-reverse; }
.news_detail_content .top .news_listing_item{ flex-direction:column-reverse; gap:30px; }
.news_detail_content .bottom .news_listing_item{ flex-direction:column; gap:30px; }
.news_detail_content .bottom .news_listing_item .image,.news_detail_content .top .news_listing_item .image{ width: 100%; aspect-ratio:auto; }
.news_btn{ text-align: center; margin-top: 100px; }
.news_btn .btn{ display: inline-flex; align-items: center; border-radius: 10px; max-width: 240px; width: 90%; padding: 0 10px; height: 62px; justify-content: center; gap:10px; background: linear-gradient(to bottom,  rgba(134,198,54,1) 0%,rgba(63,168,187,1) 100%); }
.news_btn .btn i{ color: #fff; }
.news_btn .btn .text{ color: #fff; font-size: 1.25rem; }

/* 聯絡昇和 */
.contact_flex{ display: flex; flex-direction: column; gap:60px; }
.contact_flex .item .title{ display: flex; align-items: center; gap: 50px; }
.contact_flex .item .divider{ flex:1; height: 1px; background-color: var(--color-gray-ccc); }
.contact_flex .item .data_flex{ display: flex; gap: 20px; }
.contact_flex .item .data_flex .left_data{ flex:1; display:flex; flex-direction: column; gap:10px; }
.contact_flex .item .data_flex .left_data .item_data{ display: flex; gap:20px; align-items: baseline; }
.contact_flex .item .data_flex .left_data .item_data .title_m{ font-size: 1.5rem; color: var(--color-secondary); font-weight: 700; }
.contact_flex .item .data_flex .left_data .item_data .text{ font-size: 1.125rem; flex:1; }
.contact_flex .item .data_flex .right_map{ flex: 1; }
.contact_flex .item .data_flex .right_map iframe{ width: 100%; aspect-ratio: 155 / 79; border-radius: 20px; }
.contact_flex .item .form_flex{ display: flex; flex-direction: column; gap: 30px; }
.contact_flex .item .form_flex .form_item{ display: flex; align-items: center; gap: 40px; }
.contact_flex .item .form_flex .form_item .title_m{ font-size: 1.5rem; color: var(--color-secondary); font-weight: 700; width: 96px; }
.contact_flex .item .form_flex .form_item .text{ flex:1 }
.contact_flex .item .form_flex .form_item .code_flex{ display: flex; gap: 20px; align-items: center; flex-wrap: wrap; }
.contact_flex .item .form_flex .form_item .code_flex .code_flex_1{ flex:1; font-size: 1rem; color: var(--color-gray-aaa); }
.contact_flex .item .form_flex .form_item .input,.contact_flex .item .form_flex .form_item .textarea{ height: 56px; line-height: 56px; padding:0 15px; background-color: #f8f8f8; font-size: 1.125rem; color: #000; width: 100%; border: none; border-radius: 5px; }
.contact_flex .item .form_flex .form_item .textarea{ height: 200px; resize:none; }
.contact_flex .item .form_flex .from_btn{ text-align: center; margin-top: 100px; }
.contact_flex .item .form_flex .from_btn .btn{ cursor: pointer; display: inline-flex; align-items: center; justify-content: center; gap: 10px; max-width: 240px; width: 90%; padding: 0 10px; height: 62px; border-radius: 10px; background: linear-gradient(to bottom,  rgba(134,198,54,1) 0%,rgba(63,168,187,1) 100%); border: none; }
.contact_flex .item .form_flex .from_btn .btn .icon{ width: 24px; aspect-ratio: 1 / 1; background-image: url(../images/page/icon_form.svg); background-repeat: no-repeat; background-position: center; background-size: cover; }
.contact_flex .item .form_flex .from_btn .btn .word{ color: #fff; font-size: 1.25rem; }

/* 昇和環境 */
.environment_box{ display: flex; flex-direction: column; gap: 120px; }
.environment_item{ position: relative; width: 100%; }
.environment_item:after{ content: ""; display: block; width: 100%; background-color: #eee; height: 45%; position: absolute; bottom: 0; left: 0; right:0; border-radius: 20px; z-index: 1; }
.environment_item .event_info{ width: 100%; display: flex; position: relative; z-index: 2; }
.environment_item .event_info .item{ max-width: 50%; flex: 1; padding: 0 40px; position: relative; z-index: 3; }
.environment_item .event_info .item::after{ content: ""; display: block; height: 33%; background-color: var(--color-primary); border-radius: 20px 20px 0 0; position: absolute; z-index: 2; top: -20px; left: 20px; right: 20px; }
.environment_item .event_info .item .img{ position: relative; z-index: 3; width: 100%; aspect-ratio: 273 / 200; border-radius: 20px; background-position: center; background-repeat: no-repeat; background-size: cover; box-shadow: 0 10px 15px rgba(0,0,0,0.25); }
.environment_item .event_info .item h4{ text-align: center; padding: 20px 0; }

.environment_item:nth-child(odd) .event_info .item:nth-child(even)::after{ background-color: var(--color-secondary); }
.environment_item:nth-child(even) .event_info .item:nth-child(odd)::after{ background-color: var(--color-secondary); }

.environment_item:nth-child(odd) .event_info .item:nth-child(even):before{ content: ""; display: block; width: 9.375%; aspect-ratio: 61/185; background-image: url(../images/index/bg_service_01.svg); background-position: center; background-repeat: no-repeat; background-size: cover; position: absolute; top: -14%; right: 0; z-index: 1;  }

.environment_item:nth-child(even) .event_info .item:nth-child(odd):before{ content: ""; display: block; width: 9.375%; aspect-ratio: 61/185; background-image: url(../images/index/bg_service_01.svg); background-position: center; background-repeat: no-repeat; background-size: cover; position: absolute; top: -14%; left: 0; z-index: 1;  }

/* 關於 */
.about_flex{ display: flex; flex-direction: column; gap: 80px; }
.about_brief_word{ position: relative; }
.about_brief_word:after{ content: ""; display: block; position: absolute; z-index: 1;  background-color: var(--color-gray-eee); border-radius: 20px; top: 0; left:0; bottom: 0px; width: 80%; }
.about_brief_word .item{ position: relative; z-index: 2; display: flex; align-items: center; gap: 40px; }
.about_brief_word .item .text_box{ width: 60%; padding: 60px 20px 60px 60px; }
.about_brief_word .item .text_box h3{ color: var(--color-tertiary); }
.about_brief_word .item .text_box p{ font-size: 1.125rem; line-height: 1.8; }
.about_brief_word .item .imgs{ width: 40%; aspect-ratio: 103 / 62; position: relative; background-image: url(../images/page/img_about_01.jpg); background-size: cover; background-repeat: no-repeat; background-position: center; border-radius: 20px; box-shadow: 5px 5px 15px rgba(0,0,0,0.15); }

.about_ohter_block h3{ color: var(--color-tertiary); }
.about_ohter_block .flex_box{ display: flex; gap: 20px; }
.about_ohter_block .flex_box .left_img{ max-width: 520px; width: 40.625%; }
.about_ohter_block .flex_box .right_box{ flex:1; display: flex; flex-direction: column; gap: 20px; }
.about_ohter_block .flex_box .right_box > p { font-size: 1.125rem; }
.about_ohter_block .flex_box .right_box .feature_box{ display: flex; gap:20px; flex: 1; }
.about_ohter_block .flex_box .right_box .feature_box .item{ background-color: var(--color-gray-eee); border-radius: 20px; padding: 20px; flex:1; }
.about_ohter_block .flex_box .right_box .feature_box .item .title{ text-align: center; font-size: 1.25rem; color: var(--color-tertiary); font-weight: 700; margin-bottom: 10px; }
.about_ohter_block .flex_box .right_box .feature_box .item p{  font-size: 1.125rem; line-height: 1.8; }

.about_join .title{ color: var(--color-primary); }
.about_join .from_btn{ text-align: center; margin-top: 100px; }
.about_join .from_btn .btn{ cursor: pointer; display: inline-flex; align-items: center; justify-content: center; gap: 10px; max-width: 240px; width: 90%; padding: 0 10px; height: 62px; border-radius: 10px; background: linear-gradient(to bottom,  rgba(134,198,54,1) 0%,rgba(63,168,187,1) 100%); border: none; }
.about_join .from_btn .btn .icon{ width: 24px; aspect-ratio: 1 / 1; background-image: url(../images/page/icon_form.svg); background-repeat: no-repeat; background-position: center; background-size: cover; }
.about_join .from_btn .btn .word{ color: #fff; font-size: 1.25rem; }

/* 頁碼 */
.pagination-container { display: flex; justify-content: center; margin:100px 0 0 0; }
.pagination-list { list-style: none;  padding: 0; margin: 0; display: flex;  gap: 8px; }

.pagination-link {
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 40px;
  height: 40px;
  padding:0 10px;
  border-radius: 4px; 
  text-decoration: none; 
  color: #333; 
  background-color: #f9f9f9; 
  transition: all 0.2s ease-in-out; 
  cursor: pointer; 
}

.pagination-link:hover:not(.disabled) {
  background-color: #e0e0e0;
  border-color: #a0a0a0;
  color: #000;
}

.pagination-link[aria-current="page"] {
  background-color: var(--color-secondary); 
  color: #fff;
  cursor: default; 
}

.pagination-link[aria-current="page"]:hover {
  background-color: var(--color-secondary); 
  color: #fff;
}

.pagination-link.disabled {
  opacity: 0.3;
  cursor: not-allowed;
  background-color: #eee;
  border-color: #ddd;
  color: #999;
}



/***************************平板***************************/
@media screen and (width < 1200px) {
.banner{ margin-top: 0; }

/* 昇和服務 詳細*/
.service_sort_mark{ display: none; align-items: center; z-index: 100; position: fixed; top: 0; left: 0; right: 0; bottom: 0; margin: auto; background-color: rgba(255,255,255,0.95); }
.service_sort{ gap:20px; flex-direction: column; width: 90%; max-width: 600px; margin: auto; padding: 20px 0; }
.service_sort .item{ padding: 10px 20px; }
.btn_close_service{ display: block; border-radius: 10px; border:1px solid var(--color-primary); color: var(--color-primary); background-color: rgba(134,198,54,0.2); height: 50px; line-height: 50px; text-align: center; font-size: 1.25rem; cursor: pointer; }

.sort_btn_mobile{ display: block; }
.sort_btn_mobile i{ font-size: 2.5rem;  }
.sort_btn_mobile .btns{ display: inline-flex; align-items: center; gap: 20px; border: 1px solid #ccc; padding: 5px 30px 5px 5px; border-radius:50px; color: var(--color-secondary); cursor: pointer; }

}

/***************************平板***************************/
@media screen and (width < 1024px) {
/* 昇和服務 */
.service_container{ flex-wrap: wrap; justify-content:flex-start; margin-bottom: 35px; }
.service_item{ width: 50%; min-height: 550px; }
.service_item .item .btn{ width: 50px; height: 50px; }
.service_item .item .btn i{ font-size: 1.5rem; }

/* 昇和服務 詳細 */
.service_box .stepbox{ flex-direction: column; }
.service_box .stepbox .left_data{ justify-content: flex-start; gap: 30px; }
.service_box .stepbox .left_data .txt{ font-size: 1.25rem; }
.service_box .stepbox .right_table{ width: 100%; }

.service_box .merit{ flex-wrap: wrap; }
.service_box .merit .grid{ flex:none; width: calc(50% - 10px ); }

/* 最新消息 */
.news_flex{ gap: 40px 20px; }
.news_flex .item{ width: calc((100% -  20px) / 2); }
}

/***************************手機***************************/
@media screen and (width < 768px) {
.banner{ aspect-ratio: 3 / 2; }
.banner .nav{ padding: 0 20px; }
.banner .nav a, .banner .nav span{ font-size: 0.875rem; align-items: center;}
.banner .nav a:after, .banner .nav span:after{ font-size: 1rem; }
.banner .nav .img{ width: 15px; }
.banner .nav a:last-child,.banner .nav span:last-child{ max-width: 50%; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; display: block; }

/* 昇和服務 */
.service_item{ width: 100%; min-height: 500px; }
.service_item .item{ padding: 30px; border-radius: 10px; }

.service_sort_mark.other{ margin-bottom: 30px; }
.service_sort_mark.contact{ margin-bottom: 0; }

/* 昇和服務 詳細*/
.service_sort .item .icon{ width: 20px; }
.service_sort .item .txt{ font-size: 1rem; }
.btn_close_service{ font-size: 1rem; }

.sort_btn_mobile i{ font-size: 1.75rem; }
.sort_btn_mobile .btns{ font-size: 0.875rem; gap:10px; padding: 5px 15px 5px 5px; }

.service_main_title{ margin-bottom: 20px; }
.service_main_title .line{ display: none; }
.service_box p{ font-size: 1rem; }

.service_title .remark{ font-size: 1rem; }

.service_nav_list{ flex-direction: column; }

.service_remark{ font-size: 1rem; padding: 10px; }

.service_box .compare_box{ flex-direction: column; gap:20px }
.service_box .compare_box .compare_grid{ border: none; padding: 0; }
.service_box .compare_box .compare_grid:last-child{ padding: 0; }
.service_box .compare_box .compare_grid h3{ margin-bottom: 10px; }
.service_box .compare_box .condition_flex{ margin-bottom: 15px; gap:5px; flex-direction: column; }
.service_box .compare_box .condition_flex .title{ font-size: 1rem; width: 125px; padding: 5px 0; }
.service_box .compare_box .condition_flex .contentTxt{ font-size: 1rem; }

.service_box .table.sp{ display: block; }
.service_box .table.pc{ display: none; }

.service_box .table .tr{ background-color: var(--color-gray-eee); border-radius: 10px; overflow: hidden; margin-bottom: 15px; }
.service_box .table .tr:last-child{ margin-bottom: 0; }
.service_box .table .tr .title{ background-color: var(--color-primary); color: #fff; text-align: center; padding: 10px; font-weight: 700; }
.service_box .table .tr .td{ display: flex; gap:10px; padding: 10px; border-bottom:1px solid #ccc ; }
.service_box .table .tr .td:last-child{ border: none; }
.service_box .table .tr .td.w-auto:before{ width: auto; }
.service_box .table .tr .td.nowrap:before{  white-space:nowrap; }
.service_box .table .tr .td:before{ content: attr(data-title); display: block; font-weight: 700; width: 40%; }
.service_box .table .tr .td .flex_1{ flex:1; }
.service_box .table th{ font-size: 1rem; }
.service_box .table td{ font-size: 1rem; }

.service_list_box .list_flex .contact_grid .multiple{ flex-direction: column; }
.service_list_box .list_flex .contact_grid .multiple .green_style{ font-size: 1rem; }

.service_box .construction{ flex-wrap: wrap; gap:40px 0; }
.service_box .construction .item{ width: 50%; padding: 0 10px; }
.service_box .construction .item .title{ font-size: 1rem; margin-top: 10px; }
 

.service_box .stepbox{ padding: 15px; border-radius: 10px; gap:30px }
.service_box .stepbox .left_data .txt{ font-size: 1.125rem; }

.service_box .merit .grid{ width: 100%; border-radius: 10px; }
.service_box .merit .grid .icon_box{ border-radius: 0 0 10px 10px; }
.service_box .merit .grid .icon_box .icon{ max-width: 80px; }
.service_box .merit .txt{ font-size: 1rem; }

.service_box .img_pc{ display: none; }
.service_box .img_sp{ display: block; }
.service_box .m-auto{ margin: auto; }

/* 最新消息 */
.news_flex .item{ width: 100%; }
.news_flex .item .date{ font-size: 1rem; }
.news_flex .item .btn_more{ padding: 8px 10px; min-width: 80px; }
.news_flex .item .btn_more .txt{ font-size: 1rem; }
.category_box{ margin-bottom: 20px; }
.category_box .btn{ padding: 0 0 0 10px; }
.category_box .btn::after{ right: 12px; border-width: 6px 4px 0 4px; }
.category_box .btn select{ font-size: 1rem; height: 42px; }

.news_detail_content{ gap: 40px; }
.news_detail_content .news_listing_item .image{ border-radius: 5px; aspect-ratio: 80 / 40; }
.news_detail_content .news_listing_item .video{ border-radius: 5px; width: 100%; }
.news_detail_content .right .news_listing_item,.news_detail_content .left .news_listing_item{ flex-direction:column-reverse; gap:20px; }
.news_detail_content .top .news_listing_item{ gap:20px; }
.news_detail_content .bottom .news_listing_item{ gap:20px; }
.news_detail_content .left .news_listing_item .image,.news_detail_content .right .news_listing_item .image{ width: 100%; }
.news_detail_event_info{ gap:10px; }
.news_detail_event_info .category_tag{ font-size: 0.875rem; padding: 2px 5px; }
.news_detail_event_info .date{ font-size: 0.875rem; }

.news_btn{ margin-top: 50px;  }
.news_btn .btn{ max-width: 150px; height: 50px; }
.news_btn .btn i{ font-size: 0.875rem; }
.news_btn .btn .text{ font-size: 0.875rem; }

/* 最新消息 詳細 */
.news_detail_content .bottom .news_listing_item .video, .news_detail_content .top .news_listing_item .video,.news_detail_content .all .news_listing_item .video{ width: 100%; aspect-ratio: 257 / 168; }

/* 聯絡昇和 */
.contact_flex h2{ font-size: 1.25rem; }
.contact_flex .item .data_flex{ flex-direction: column; }
.contact_flex .item .title{ gap: 20px; }
.contact_flex .item .data_flex .left_data .item_data .title_m{ font-size: 1.125rem; }
.contact_flex .item .data_flex .left_data .item_data .text{ font-size: 1rem; }
.contact_flex .item .data_flex .right_map iframe{ border-radius: 10px; }

.contact_flex .item .form_flex{ gap: 20px; }
.contact_flex .item .form_flex .form_item{ flex-direction: column; gap:10px; align-items: initial; }
.contact_flex .item .form_flex .form_item .title_m{ font-size: 1.125rem; }
.contact_flex .item .form_flex .form_item .input, .contact_flex .item .form_flex .form_item .textarea{ font-size: 1rem; }

.contact_flex .item .form_flex .from_btn{ margin-top: 20px; }

.contact_flex .item .form_flex .from_btn .btn{ max-width: 150px; height: 50px; }
.contact_flex .item .form_flex .from_btn .btn .icon{ width: 14px; }
.contact_flex .item .form_flex .from_btn .btn .word{ font-size: 0.875rem; }

.contact_flex .item .form_flex .form_item .code_flex{ gap: 10px; }
.contact_flex .item .form_flex .form_item .code_flex .code_flex_1{ flex: none; width: 100%; font-size: 0.875rem; }
.contact_flex .item .form_flex .form_item .code_flex .w1{ width: 50%; }

/* 關於昇和 */
.about_flex{ gap:30px }
.about_brief_word{ background-color: var(--color-gray-eee); border-radius: 10px; padding: 20px; }
.about_brief_word:after{ display: none; }
.about_brief_word .item{ flex-direction: column; gap: 20px; }
.about_brief_word .item .text_box{ width: 100%; padding: 0px; }
.about_brief_word .item .text_box h3{ text-align: center; }
.about_brief_word .item .imgs{ width: 100%; border-radius: 10px; }
.about_brief_word .item .text_box p{ font-size: 1rem; }

.about_ohter_block .flex_box{ flex-direction: column; }
.about_ohter_block .flex_box .left_img{ width: 100%; }

.about_ohter_block .flex_box .right_box .feature_box{ flex-direction: column; }
.about_ohter_block .flex_box .right_box .feature_box .item{ border-radius: 10px; }
.about_ohter_block .flex_box .right_box > p{ font-size: 1rem; }
.about_ohter_block .flex_box .right_box .feature_box .item p{ font-size: 1rem; }

.about_join .from_btn{ margin-top: 20px; }
.about_join .from_btn .btn{ max-width: 150px; height: 50px; }
.about_join .from_btn .btn .icon{ width: 14px; }
.about_join .from_btn .btn .word{ font-size: 0.875rem; }


/* 昇和環境 */
.environment_box{ gap: 30px; }
.environment_item:after{ display: none; }
.environment_item .event_info{ flex-direction: column; gap: 30px; }
.environment_item .event_info .item{ max-width: none; }
.environment_item .event_info .item:before{ display: none !important; }
.environment_item .event_info .item{ padding: 0 20px; }
.environment_item .event_info .item::after{ top: -10px; left: 10px; right: 10px; }
.environment_item .event_info .item .img{ border-radius: 10px; box-shadow: 0 5px 10px rgba(0, 0, 0, 0.25); }

.environment_item .event_info .item:nth-child(odd)::after{ background-color: var(--color-primary) !important; }
.environment_item .event_info .item:nth-child(even)::after{ background-color: var(--color-secondary) !important; }

/* 頁碼 */
.pagination-container{ margin-top: 50px; }
.pagination-link{ width: 30px; height: 30px; padding: 0 5px; min-width: 30px; }
}