@charset "utf-8";

.DefBanner-wrap-wrap { width: 100%; padding:0 10px; overflow: hidden; background: url(../../Images/Layout/RWD/DefBanner-wrap-wrap.png) bottom right no-repeat; background-size: contain; padding-bottom: 100px; }
.DefBanner-wrap { width: 100%; max-width: 1570px; margin: 0 auto; }
.DefBanner-wrap .DefBanner { width: 100%; max-width: 1570px; float: left; }
.DefBanner-wrap .swiper-slide { position: relative; overflow: hidden; border-radius: 30px; }
.DefBanner-wrap .swiper-slide img.m768-hide { aspect-ratio: 1570/690;}
.DefBanner-wrap .swiper-slide img.m768-show { aspect-ratio: 768/400;aspect-ratio: 768/500;}
.DefBanner-wrap .swiper-slide:before { content: ''; display: block; width: 0; opacity: 0; height: 100%; overflow: hidden; position: absolute; top: 0; left: 0; background: url(../../Images/Layout/RWD/DefBanner-before.png) left bottom no-repeat; background-size: 1570px 690px; z-index: 1; }
.DefBanner-wrap .swiper-slide:after { content: ''; display: block; width: 0; opacity: 0; height: 100%; overflow: hidden; position: absolute; top: 0; left: 0; background: url(../../Images/Layout/RWD/DefBanner-after.png) left bottom no-repeat; background-size: 1570px 690px; z-index: 2; }

@keyframes DefBanner-before_Ani { 0% { width: 0; opacity: 0; } 100% { width: 100%; opacity: 1; } }
@keyframes DefBanner-after_Ani { 0% { width: 0; opacity: 0; } 100% { width: 100%; opacity: 1; } }

.DefBanner-wrap .swiper-slide.swiper-slide-active:before { animation: DefBanner-before_Ani 0.5s forwards linear; animation-delay: 0.5s; }
.DefBanner-wrap .swiper-slide.swiper-slide-active:after { animation: DefBanner-after_Ani 0.5s forwards linear; animation-delay: 0.75s; }

.DefContent { width: 100%; height: auto; }
.DefContent * { padding: 0; margin: 0; list-style: none; text-decoration: none; }
.DefContent > div { width: 100%; height: auto; }
/*sap-root-wrapper */
.DefContent #gsap-root-wrapper { all: initial; display: block; width: 100%; max-width: 100%; position: relative; overflow: hidden; background: transparent; font-family: "Microsoft JhengHei", sans-serif; z-index: 0; box-sizing: border-box; }
.DefContent #gsap-root-wrapper .gsap-section { position: relative; height: auto; width: 100%; display: flex; flex-direction: column; justify-content: center; align-items: center; margin: 0; padding:0 10px; overflow: hidden; box-sizing: border-box;}
.DefContent #gsap-root-wrapper .gsap-section .grass-icon { position: absolute; top: 0; left: 0; width: 60px; height: auto; z-index: 1; display: block; pointer-events: none; }
.DefContent #gsap-root-wrapper .gsap-section .grass-icon img { width: 100%; height: auto; display: block; }
.DefContent #gsap-root-wrapper .gsap-section .gsap-svg-layer { position: absolute; top: 0; left: 0; width: 100%; height: 100%; pointer-events: none; z-index: 1; }
.DefContent #gsap-root-wrapper .gsap-section .gsap-svg-layer path { stroke: orange; stroke-width: 3px; stroke-dasharray: 10, 10; fill: none; opacity: 0.3; vector-effect: non-scaling-stroke; }

/*Def-services*/
.Def-services .Def-services-wrap { display:flex; gap: 20px; width: 1430px; max-width:100%; padding-top:10px; margin-bottom:50px; position:relative; z-index:1; }
.Def-services .Def-services-wrap .services-box { position: relative; width:calc( 50% - 10px ); height:auto; border-radius: 24px; overflow: hidden; box-shadow: 0 10px 20px rgba(0, 0, 0, 0.1); display: flex; align-items: center; transition: transform 0.3s ease; }
.Def-services .Def-services-wrap .services-box:hover { transform: translateY(-5px); }
.Def-services .Def-services-wrap .services-box:before { content:''; display:block; width:100%; height:100%; position:absolute; z-index:1; top:0; left:0; background:url(../../Images/Layout/RWD/Home/Def-services.png) 0 0 no-repeat; background-size:100% 100%;}
.Def-services .Def-services-wrap .services-box img { display:block; width:100%; height:100%; position:absolute; top:0; right:0; object-fit: cover; object-position:right top;}
.Def-services .Def-services-wrap .services-box .text-content { position:relative; z-index: 3; width: 50%; padding:60px 60px 90px 30px; color:white; display: flex; flex-direction: column; justify-content:flex-start; height: 100%; box-sizing: border-box;}
.Def-services .Def-services-wrap .services-box .text-content h2 { font-size:30px; margin:0; margin-bottom:20px; color:white;}
.Def-services .Def-services-wrap .services-box .text-content p { font-size:20px; line-height: 1.6; margin: 0 0 20px 0; color:white;}
.Def-services .Def-services-wrap .services-box .text-content .btn-more { display: inline-flex; align-items: center; text-decoration: none; color: #fff; font-size: 16px; font-weight: 500; gap: 10px; transition: opacity 0.3s; position:absolute; left:30px; bottom:30px; }
.Def-services .Def-services-wrap .services-box .text-content .btn-more:hover { opacity: 0.8; }
.Def-services .Def-services-wrap .services-box .text-content .icon-circle { width: 32px; height: 32px; background-color: #fff; border-radius: 50%; display: flex; justify-content: center; align-items: center; }
.Def-services .Def-services-wrap .services-box .text-content .icon-arrow { display:block; width:32px; height:32px; overflow:hidden; background:url(../../Images/Layout/RWD/Home/Def-icon-arrow.png) center center no-repeat; background-size:contain; text-indent:-9999px;}

/* --- Def-icon --- */
.Def-services .Def-icon { display: flex; justify-content: space-between; align-items: flex-start; width: 1280px; max-width:100%; gap: 30px; flex-wrap: wrap; margin-bottom:50px; position:relative; z-index:1;}
.Def-services .Def-icon .nav-item { display: flex; flex-direction: column; align-items: center; text-decoration: none; width:calc( ( 100% / 6 ) - 30px ); transition: margin-top 0.3s ease; overflow:hidden; position:relative;}
.Def-services .Def-icon .nav-item:hover { margin-top:-10px; }
.Def-services .Def-icon .nav-item .icon-circle-wrapper { width:100%; height:auto; border-radius: 50%; background-color: #eaf8ff; border: 2px solid #bce0fd; display: flex; justify-content: center; align-items: center; margin-bottom: 20px; transition: all 0.3s ease; position: relative; }
.Def-services .Def-icon .nav-item:hover .icon-circle-wrapper { box-shadow: 0 10px 20px rgba(0,0,0,0.1); background-color: #fff;border-color: #f7b52c; color:#f7b52c;}
.Def-services .Def-icon .nav-item .icon-circle-wrapper .icon-img { display:block; width:100%; height: auto; object-fit: contain; background:#bce0fd; border-radius: 50%; border:5px solid white;transition: all 0.3s ease; }
.Def-services .Def-icon .nav-item:hover .icon-circle-wrapper .icon-img { background:#f7b52c; }
.Def-services .Def-icon .nav-item .nav-text { font-size:24px; color: #2d9cdb; text-align: center; transition: color 0.3s; }
.Def-services .Def-icon .nav-item:hover .nav-text { font-weight: bold; filter: brightness(0.9); color:#f7b52c; }

.Def-plan { background:url(../../Images/Layout/RWD/gsap-section.png) 0 0 no-repeat; background-size:contain;}
.Def-plan .container { width: 1430px; max-width:100%; margin: 0 auto; padding:50px 0; position:relative; z-index:2; }
.Def-plan .container .section-title { text-align: center; color: #5b87c4; font-size: 36px; font-weight: bold; margin-bottom: 40px; letter-spacing: 2px; }
.Def-plan .container .plans-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 24px; padding-top:5px; margin-bottom: 40px; }
.Def-plan .container .plan-card { background: #fff; border: 1px solid #e0e0e0; border-radius: 20px; display: flex; flex-direction: column; transition: transform 0.3s ease, box-shadow 0.3s ease; position: relative; overflow: hidden; }
.Def-plan .container .plan-card:hover { transform: translateY(-5px); box-shadow: 0 10px 20px rgba(0, 0, 0, 0.08);border: 1px solid #fbdca8; }
.Def-plan .container .plan-card > a { display:block; width:100%; height:auto; overflow:hidden;}
.Def-plan .container .plan-card .card-img-wrap { position: relative; width: 100%; padding-top:70%; background-color: #eee; }
.Def-plan .container .plan-card .card-img-wrap img { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; }
.Def-plan .container .plan-card .btn-arrow { position: absolute; bottom: -20px; right: 20px; width: 40px; height: 40px; border-radius: 50%; display: flex; justify-content: center; align-items: center; color: #fff; font-size: 18px; border: 2px solid #fff; cursor: pointer; z-index: 2; transition: background-color 0.3s; background-color: #5085c8;}
.Def-plan .container .plan-card:hover .btn-arrow { background-color: #f5a623; }
.Def-plan .container .plan-card .btn-arrow::after { content: ''; display: block; width: 8px; height: 8px; border-top: 2px solid #fff; border-right: 2px solid #fff; transform: rotate(45deg); margin-right: 2px; }
.Def-plan .container .card-body { padding:20px; flex-grow: 1; }
.Def-plan .container .card-title { font-size: 20px; font-weight: bold; margin: 0 0 12px 0; color: #222; white-space:nowrap; overflow:hidden; text-overflow: ellipsis; }
.Def-plan .container .plan-card:hover .card-title { color: #f5a623; }
.Def-plan .container .card-desc { font-size: 14px; color: #666; line-height: 1.6; margin: 0; text-align: justify; }
.Def-plan .container .price-wrap { line-height: 1.6; margin: 10px 0 0 0; text-align: justify; display: flex;
justify-content:space-between;
flex-wrap:wrap; }
.Def-plan .container .price-wrap .productprice  { width:100%; padding:0;font-size:14px;
display: flex;
align-items:center;
flex-wrap:wrap;}
.Def-plan .container .price-wrap .productprice small { display:inline-block; width:auto; height:auto; overflow:hidden; float:left; padding:5px 10px; border:1px solid #ccc; border-radius:30px; margin-right:5px; font-size:14px;}
.Def-plan .container .add-compare { display:block; width:100%; height:auto; overflow:hidden; padding:20px; border-top:1px solid #eee;}
.Def-plan .container .add-compare input { margin-right:10px;}
.Def-plan .container .bottom-link-wrap { display: flex; justify-content: center; align-items: center;}
.Def-plan .container .bottom-link-wrap .bottom-link { display:inline-block; width:auto; text-align: center; font-size: 18px; color: #444; cursor: pointer; font-weight: 500; padding:0 20px;}
.Def-plan .container .bottom-link-wrap .bottom-link:hover { color: #f5a623; }
.Def-plan .container .bottom-link-wrap .bottom-link:nth-child(1) { border-right:1px solid #ccc;}

.Def-news{ width: 100%; padding: 40px 0; background:url(../../Images/Layout/RWD/gsap-section2.png) 0 0 no-repeat; background-size:contain;}
.Def-news .news-section-wrap { width: 1430px; max-width:100%; margin: 0 auto; padding:0; }
.Def-news .tab-header { display: flex; justify-content: center; align-items: center; margin-bottom: 40px; gap: 20px 0; }
.Def-news .tab-btn { display:inline-block; width:auto; line-height:65px; font-size: 32px; font-weight: bold; color: #999; cursor: pointer; position: relative; padding: 0 10px; transition: color 0.3s; }
.Def-news .tab-btn.active { color: #5b87c4; border:1px solid #5b87c4; border-bottom:0;  border-radius:20px 20px 0 0; }
.Def-news .tab-btn:hover { color: #5b87c4; }
.Def-news .tab-content { display: none; animation: fadeIn 0.5s ease; }
.Def-news .tab-content.active { display: block; }
@keyframes fadeIn { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: translateY(0); } }
/* 針對此區塊的 Swiper 設定，避免全域衝突 */
.Def-news .news-swiper { width: 100%; padding-bottom: 50px !important; padding-top: 10px; overflow:hidden; }
.Def-news .swiper-slide { height: auto; display: flex;transition:all 0.3s; border-radius: 20px; overflow:hidden;}
.Def-news .swiper-slide:hover { transform: translateY(-5px); }
.Def-news .swiper-slide a { display:block; width:100%; height:auto;}
.Def-news .swiper-slide .news-card { background: #fff; background:rgba(255,255,255,0.8); overflow: hidden; width: 100%; display: flex; flex-direction: column; position: relative; cursor: pointer; }
.Def-news .swiper-slide .news-card .card-img-box { position: relative; width: 100%; padding-top:75%; border-radius: 20px; box-shadow: 0 5px 15px rgba(0,0,0,0.05); transition:all 0.3s; border:3px solid #eee;}
.Def-news .swiper-slide .news-card:hover .card-img-box { box-shadow: 0 10px 25px rgba(0,0,0,0.1); border:3px solid #f5a623;}
.Def-news .swiper-slide .news-card img { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; border-radius: 18px; }
.Def-news .swiper-slide .news-card .float-arrow-btn { position: absolute; bottom: -25px; right: 25px; width: 50px; height: 50px; border-radius: 50%; display: flex; justify-content: center; align-items: center; color: #fff; font-size: 20px; border: 3px solid #fff; z-index: 3;background-color: #5b87c4; transition: background-color 0.3s; }
.Def-news .swiper-slide .news-card:hover .float-arrow-btn{ background-color: #d48c15; }
.Def-news .swiper-slide .news-card .float-arrow-btn .arrow-icon { width: 10px; height: 10px; border-top: 2px solid #fff; border-right: 2px solid #fff; transform: rotate(45deg); margin-right: 3px; }
.Def-news .swiper-slide .news-card .card-text-box { padding: 10px 25px 30px 25px; flex-grow: 1; display: flex; flex-direction: column; }
.Def-news .swiper-slide .news-card .card-text-box .news-date { color: #5b87c4; font-size: 14px; font-weight: 500;  margin-bottom: 10px;}
.Def-news .swiper-slide .news-card:hover .card-text-box .news-date { color: #f5a623; }
.Def-news .swiper-slide .news-card .card-text-box .news-title { font-size: 20px; font-weight: bold; color: #333; margin: 0 0 15px 0; line-height: 1.4; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.Def-news .swiper-slide .news-card .card-text-box .news-desc { font-size: 15px; color: #888; line-height: 1.6; margin: 0; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
/* 覆寫 Swiper 分頁點，只針對這個區塊 */
.Def-news .swiper-pagination-bullet { width: 12px; height: 12px; background: #dcdcdc; opacity: 1; }
.Def-news .swiper-pagination-bullet-active { background: #5b87c4; }
.Def-news .swiper-pagination-bullet:only-child { display:none;}

.Def-products { width: 100%; padding: 60px 20px!important; margin-bottom:40px!important; background:url(../../Images/Layout/RWD/gsap-section.png) left bottom no-repeat; background-size:contain;}
.Def-products:before { content:''; display:block; width:calc( 50% + 120px ); height:85%; position:absolute; right:0; top:calc( 60px + 40px ); z-index:0;  border-radius:20px 0 0 20px; background-image: linear-gradient(90deg, rgba(237, 245, 250, 1) 0%, rgba(237, 245, 250, 0) 100%);}
.Def-products:after { content:''; display:block; position:absolute; width:50%; height:calc( 100% - 60px ); top:60px; left:0; background:url(/tw/Images/Layout/RWD/Def-products-bg.png) 0 0 no-repeat; background-size:700px auto; z-index:-1;}
.Def-products .service-container { width: 1180px; max-width:100%;margin: 0 auto; position:relative; z-index:2; }
.Def-products .section-title { display: flex; align-items: center; font-size: 28px; color: #3b5a86; margin-bottom: 10px; font-weight: bold; }
.Def-products .title-icon { margin-right: 10px; display: flex; align-items: center; width:60px; height:60px; }
.Def-products .title-icon img { display:block; width:100%; height:auto;}
.Def-products .service-wrapper { display: flex; align-items: flex-start; gap: 40px; }
.Def-products .service-tabs { width: 460px; flex-shrink: 0; display: flex; flex-direction: column; gap: 15px; position: relative; margin-top:60px; margin-bottom:60px; }
.Def-products .tab-item { width:260px; display: flex; align-items: center; padding: 10px; background: #fff; border: 1px solid #eee; border-radius: 20px; cursor: pointer; transition: all 0.3s ease; position: relative; color:#5b87c4; font-size: 16px; font-weight: 500; margin-left:70px; }
.Def-products .tab-item:hover { border-color: #f5a623; color: #f5a623; }
.Def-products .tab-num { width: 35px; height: 35px; background: #5b87c4; color: #fff; border-radius: 50%; display: flex; justify-content: center; align-items: center; font-size: 22px; margin-right: 12px; transition: all 0.3s; font-family:Arial, Helvetica, sans-serif; line-height:35px; }
.Def-products .tab-item:hover .tab-num  { background:#f5a623; }
.Def-products .tab-item.active { background-color: #f5a623; border-color: #f5a623; color: #fff; box-shadow: 0 4px 10px rgba(245, 166, 35, 0.3); }
.Def-products .tab-item.active .tab-num { background: #fff; color: #f5a623; font-weight: bold; }
/* 模擬圖片中連接右邊的線條 (選用) */
.Def-products .tab-item.active::after { content: ''; position: absolute; right: -200px; top: 50%; width: 200px; height: 2px; background: linear-gradient(90deg, #f5a623 0%, rgba(237, 245, 250, 1) 50%); pointer-events: none; opacity: 0.6; z-index: 0; }
.Def-products .service-content-area { padding:0; min-height: 400px; position: relative; }
.Def-products .content-panel { display: none; animation: fadeInRight 0.5s ease; }
.Def-products .content-panel.active { display: block; }
.Def-products .panel-img-wrap { width: 100%; position:relative; height:auto; padding-top:54.6875%; border-radius: 15px; overflow: hidden; margin-bottom: 25px; box-shadow: 0 5px 15px rgba(0,0,0,0.05); background: #fff; }
.Def-products .panel-img-wrap img { width: 100%; height: 100%; object-fit: cover; position:absolute; top:0; left:0; }
.Def-products .panel-info h3 { font-size: 24px; color: #3b5a86; margin: 0 0 15px 0; font-weight: bold; }
.Def-products .panel-info p { font-size: 16px; color: #555; line-height: 1.6; text-align: justify; margin: 0; }
.Def-products .panel-info p + a.btn-more { display: inline-flex; align-items: center; text-decoration: none; color: #3b5a86; font-size: 16px; font-weight: 500; gap: 5px; margin-top:20px; }
.Def-products .panel-info p + a.btn-more:hover { opacity: 0.8; color:#d48c15; }
.Def-products .panel-info p + a.btn-more .icon-circle { width: 30px; height: 30px; border-radius: 50%; display: flex; justify-content: center; align-items: center; color: #fff; font-size: 20px; z-index: 3;background-color: #5b87c4; transition: background-color 0.3s; }
.Def-products .panel-info p + a.btn-more:hover .icon-circle{ background-color: #d48c15; }
.Def-products .panel-info p + a.btn-more  .icon-arrow { width: 10px; height: 10px; border-top: 2px solid #fff; border-right: 2px solid #fff; transform: rotate(45deg); margin-right: 3px; }

.def-contact { position:relative; width:100%; height:auto; overflow:hidden; background:url(../../Images/Layout/RWD/Home/def-contact.jpg) left bottom no-repeat; background-size:100% auto; padding:40px 0; background:rgba(237, 245, 250, 1);}
.def-contact > h2 { text-align: center; color: #5b87c4; font-size: 36px; font-weight: bold; margin-bottom: 40px; letter-spacing: 2px; }
.def-contact > div { width:1230px; padding:0; max-width:100%; height:auto; margin:0 auto; display:flex; flex-wrap:wrap; gap:0 30px;}
.def-contact > div > .w50 { width:calc( 50% - 15px ); padding:0 10px; background:#bce0fd; border-radius:20px; box-shadow: 0 5px 15px rgba(0,0,0,0.05);}
.def-contact > div > .w50 .form-type-2form-def { border:0; outline:none;}
.def-contact > div > .w50 .form-type-2form-def .ContactUsBox { display:flex; background:white; border-radius:20px; border:1px solid #d1d1d1; border:0; overflow:hidden; margin:10px 0; font-size:16px; line-height:30px;}
.def-contact > div > .w50 .form-type-2form-def .ContactUsBox > label { width:200px; padding:10px 5px 10px 10px; white-space:nowrap;}
.def-contact > div > .w50 .form-type-2form-def .ContactUsBox > label .required-mark { float:left; margin-right:5px; font-size:18px;}
.def-contact > div > .w50 .form-type-2form-def .ContactUsBox > .ContactUsBoxR { width:calc( 100% - 200px ); padding:10px 10px 10px 5px; position:relative; display:flex; gap:5px; flex-wrap:wrap;}
.def-contact > div > .w50 .form-type-2form-def .ContactUsBox > .ContactUsBoxR > * { float:left;}
.def-contact > div > .w50 .form-type-2form-def .ContactUsBox > .ContactUsBoxR input[type="text"] { width:100%; border:0; border-radius:10px; font-size:1rem;}
.def-contact > div > .w50 .form-type-2form-def .ContactUsBox > .ContactUsBoxR > span { display:inline-flex; max-height:30px; align-items:center; float:left; margin-right:10px;}
.def-contact > div > .w50 .form-type-2form-def .ContactUsBox > .ContactUsBoxR > span > input { width:25px; height:25px; margin-right:5px;}
.def-contact > div > .w50 .form-type-2form-def .ContactUsBox > .ContactUsBoxR select { font-size:16px; border:0;}
.def-contact > div > .w50 .form-type-2form-def .ContactUsBox.ContentDiv > .ContactUsBoxR { height:81px; overflow:hidden;}
.def-contact > div > .w50 .form-type-2form-def .ContactUsBox.ContentDiv > .ContactUsBoxR textarea { width:100%; padding:0 5px; font-size:1rem; height:60px; margin:0; outline:none; border:0; border-radius:10px;}
.def-contact > div > .w50 .form-type-2form-def .ContactUsBox > .ContactUsBoxR.Captcha {display:flex; align-items:center;}
.def-contact > div > .w50 .form-type-2form-def .ContactUsBox > .ContactUsBoxR.Captcha > * { float:left;}
.def-contact > div > .w50 .form-type-2form-def .ContactUsBox > .ContactUsBoxR.Captcha > input[type="text"] { border:1px solid #ccc;}
.def-contact > div > .w50 .form-type-2form-def .btn { padding:0 10px;}
.def-contact > div > .w50.info > div { display:flex; align-items:center; justify-content:center; flex-wrap:wrap; background:white; border-radius:20px; border:1px solid #d1d1d1; border:0; font-size:1em; overflow:hidden; margin:10px 0; padding:10px; font-size:16px; line-height:30px;}
.def-contact > div > .w50.info > div a { /*font-size:30px;*/ font-family:Arial, Helvetica, sans-serif; /*line-height:1;*/}
.def-contact > div > .w50.info > div.icon { padding:5px 10px;}
.def-contact > div > .w50.info > div.icon a { display:block; width:40px; height:40px; border-radius:100%; background:#777777; padding:5px; margin:0 5px;}
.def-contact > div > .w50.info > div.icon a:hover,
.def-contact > div > .w50.info > div.icon a:active { background:#5b87c4;}
.def-contact > div > .w50.info > div.icon a img { display:block; max-width:100%; height:auto; max-height:30px;}
.def-contact > div > .w50.info > div iframe { margin-top:10px;}
.def-contact > div > .w50 .form-type-2form-def .notice-info { font-size:14px; margin-bottom:10px;}
.def-contact > div > .w50 .form-type-2form-def .notice-info .notice { text-align:left;}

@keyframes fadeInRight { from { opacity: 0; transform: translateX(20px); } to { opacity: 1; transform: translateX(0); } }

@media (max-width: 1700px) {
	.DefBanner-wrap-wrap { padding-bottom:80px;}
	.DefContent #gsap-root-wrapper .gsap-section .grass-icon,
	.DefContent #gsap-root-wrapper .gsap-section .gsap-svg-layer { opacity:0.5;}
 }

@media (max-width: 1590px) {
	.DefBanner-wrap-wrap { padding-bottom:60px;}
	.DefBanner-wrap .swiper-slide:before { background-size:calc( 100vw - 10px ) calc( ( 100vw * 0.439490446 ) - 10px ); }
	.DefBanner-wrap .swiper-slide:after { background-size:calc( 100vw - 10px ) calc( ( 100vw * 0.439490446 ) - 10px ); }
 }
@media (max-width:1250px) {
	.def-contact > div { padding:0 10px;}
}
@media (max-width: 1220px) {
	.Def-products .service-content-area { width:calc( 100% - 460px - 40px );}
	.Def-products:before { width:calc( 100% - 460px - 20px );}
	.def-contact > div { gap:10px;}
	.def-contact > div > .w50 { width:calc( 50% - 5px );}
 }

@media (max-width: 1190px) {
	.def-contact > div > .w50 .form-type-2form-def .ContactUsBox1 > .ContactUsBoxR > span { width:100%;}
 }


@media (max-width: 1024px) {
	.DefBanner-wrap-wrap { padding-bottom:40px;}
	.Def-services .Def-services-wrap { flex-wrap:wrap; margin-bottom:40px;}
	.Def-services .Def-services-wrap .services-box { width:100%;}
	.Def-services .Def-services-wrap .services-box:hover { transform: none; }
	.Def-services .Def-services-wrap .services-box .text-content .btn-more:hover { opacity: 1; }
	.Def-services .Def-icon { gap:20px; margin-bottom:40px;}
	.Def-services .Def-icon .nav-item { width:calc( ( 100% / 6 ) - 20px );}
	.Def-services .Def-icon .nav-item:hover { transform: translateY(0); }
	.Def-services .Def-icon .nav-item .icon-circle-wrapper { margin-bottom:10px;}
	.Def-services .Def-icon .nav-item:hover .icon-circle-wrapper { box-shadow:none; background-color:#eaf8ff;border-color: #bce0fd; color:#bce0fd;}
	.Def-services .Def-icon .nav-item:hover .icon-circle-wrapper .icon-img { background:#bce0fd; }
	.Def-services .Def-icon .nav-item .nav-text { font-size:20px; }
	.Def-services .Def-icon .nav-item:hover .nav-text { font-weight: normal; filter:none; color:#2d9cdb;}
	.Def-plan .container { padding:0; padding-bottom:40px;}
	.Def-plan .container .plans-grid { display:flex; overflow-x:auto; gap:10px;flex-direction:row; flex-wrap:nowrap; -webkit-overflow-scrolling: touch; }
	.Def-plan .container .plan-card { width:240px; flex-shrink: 0;}
	.Def-plan .container .plan-card:hover { transform: none; box-shadow: none; border: 1px solid #e0e0e0; }
	.Def-plan .container .plan-card:hover .btn-arrow { background-color: #5085c8; }
	.Def-plan .container .plan-card:hover .card-title { color: #222; }
	.Def-plan .container .bottom-link:hover { color: #444; }
	.Def-news .tab-btn:hover { color: #999; }
	.Def-news .swiper-slide .news-card:hover { transform: none; }
	.Def-news .swiper-slide .news-card:hover .card-img-box { box-shadow: 0 5px 15px rgba(0,0,0,0.05); border: 3px solid #eee; }
	.Def-news .swiper-slide .news-card:hover .float-arrow-btn { background-color: #5b87c4; }
	.Def-news .swiper-slide .news-card:hover .card-text-box .news-date { color: #5b87c4; }
	.Def-products .tab-item:hover { border-color: #eee; }
	.Def-products .service-tabs { width:280px;}
	.Def-products .title-icon { display:none;}
	.Def-products .tab-item { margin-left:0;}
	.Def-products .service-content-area { width:calc( 100% - 280px - 40px );}
	.Def-products:before { width:calc( 100% - 280px - 30px );}
	.Def-products:after { opacity:0;}
	.def-contact { background:url(../../Images/Layout/RWD/Home/def-contact.jpg) left bottom no-repeat; background:rgba(237, 245, 250, 1); background-size:auto 100%; padding:20px 0;}
	.def-contact > div { gap:10px; width:512px;}
	.def-contact > div > .w50 { width:100%; padding:10px;}
	.def-contact > div > .w50.info > div:nth-child(1) { height:82px;}
	.def-contact > div > .w50 .form-type-2form-def .ContactUsBox1 > .ContactUsBoxR > span { width:100%;}
	.def-contact > div > .w50 .form-type-2form-def .ContactUsBox { display:block;}
	.def-contact > div > .w50 .form-type-2form-def .ContactUsBox > label { width:100%; display:block; overflow:hidden; padding:10px; background:#5b87c4; color:white;}
	.def-contact > div > .w50 .form-type-2form-def .ContactUsBox > .ContactUsBoxR  { width:100%; overflow:hidden; padding:10px;}
	.def-contact > div > .w50 .form-type-2form-def .ContactUsBox1 > .ContactUsBoxR > span { width:auto;}
	.def-contact > div > .w50 .form-type-2form-def .ContactUsBox > .ContactUsBoxR select { width:100%;}
	.def-contact > div > .w50.info > div:nth-child(1) { height:auto;}
	.def-contact > div > .w50.info > div iframe { height:30vh;}
	/*.def-contact > div > .w50 .form-type-2form-def .notice-info { color:white;}
	.def-contact > div > .w50 .form-type-2form-def .notice-info .notice { color:Crimson;}
	.def-contact > div > .w50.info > div a { font-size:16px; line-height:30px;}*/

}

@media (max-width: 900px) {
	.Def-services .Def-services-wrap { margin-bottom:30px;}
    .section-bg-A .icon-nav-container { justify-content: center; }
    .section-bg-A .nav-item { width: 45%; margin-bottom:0; }
    .section-bg-A .icon-circle-wrapper { width: 120px; height: 120px; }
	.Def-plan .container { padding-bottom:30px;}
	.Def-plan .container .section-title { margin-bottom:30px;}
	.Def-news .tab-header { margin-bottom:30px;}
	.Def-products { background:url(../../Images/Layout/RWD/gsap-section.png) 0 0 no-repeat; background-size:contain; padding-bottom:20px!important;}
	.Def-products .section-title { margin-bottom:30px; margin-top:30px;}
	.Def-products .service-content-area { width:calc( 100% - 280px - 40px );}
	.Def-products:before { width:calc( 100% - 280px - 30px );}
	.Def-products:after { width:100%; height:120px; top:45px; background-size:contain; background-position: center right; opacity:0.8;}
	.Def-products .service-wrapper { flex-direction: column; }
	.Def-products .title-icon { display:block;}
	.Def-products .service-tabs { width: 100%; flex-direction: row; flex-wrap: wrap; gap: 10px; margin:0; }
	.Def-products .section-title { width:100%;}
	.Def-products .tab-num { width:25px; height:25px; line-height:25px; margin-right:5px;}
	.Def-products .tab-item { width: calc(33.33% - 10px); font-size:16px; }
	.Def-products .tab-item.active::after { display: none; }
	.Def-products:before { height:calc( 100% - ( 204px + 65px ) ); width:calc( 100% - 5px ); top:auto; bottom:0;}
	.Def-products .service-content-area { width:100%;}
	.def-contact > h2 { margin-bottom:30px;}
}

/* --- 手機版響應式 (變成單欄) --- */
@media (max-width: 768px) {
	.DefBanner-wrap-wrap { padding:20px 30px; padding-bottom:20px;}
	.DefContent #gsap-root-wrapper .gsap-section { padding:0 30px; margin-bottom:60px;}
	.DefContent #gsap-root-wrapper .gsap-section#section-C { margin-bottom:0;}
	.Def-services .Def-services-wrap { margin-bottom:20px;}
	.Def-services .Def-services-wrap .services-box:before { background-size:120% 100%;}
	.Def-services .Def-services-wrap .services-box .text-content { width:60%; padding:30px 40px 60px 20px;}
	.Def-services .Def-services-wrap .services-box .text-content h2 { font-size:24px;}
	.Def-services .Def-services-wrap .services-box .text-content p { font-size:16px;
	display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;}
	.Def-services .Def-services-wrap .services-box .text-content .btn-more { font-size:12px; left:20px;}
    .section-bg-A .Def-services-wrap { grid-template-columns: 1fr; }
	.Def-services .Def-icon { gap:10px; margin-bottom:20px;}
	.Def-services .Def-icon .nav-item { width:calc( ( 100% / 3 ) - 10px );}
	.Def-services .Def-icon .nav-item .nav-text { font-size:16px; }
    .section-bg-A .card-overlay { background: linear-gradient(115deg, rgba(55, 87, 133, 1) 50%, rgba(55, 87, 133, 0.9) 70%, rgba(55, 87, 133, 0) 90%); }
    .section-bg-A .card-content { width: 70%; }
	.Def-plan .container .section-title { margin-bottom:20px;}
	.Def-news .tab-header { margin-bottom:20px;}
	.Def-news .tab-btn { line-height:50px;}
	.Def-news .tab-btn { font-size: 24px; }
	.Def-news .card-text-box { padding: 35px 20px 20px 20px; }
	.Def-products:before { height:calc( 100% - ( 226px + 85px ) );}
	.Def-products .service-tabs { gap:5px;}
	.Def-products .tab-item { font-size:14px; padding:10px 5px; width:calc(50% - 5px);}
	.def-contact > h2 { margin-bottom:20px;}
	.def-contact > div > .w50 .form-type-2form-def .ContactUsBox { margin-top:0;}
	.Def-products { padding: 60px 30px!important;}
	.def-contact > div { padding:0 30px;}
}
@media (max-width: 600px) {
	.Def-services .Def-icon { justify-content:center;}
	.Def-services .Def-icon .nav-item { width:calc( 33.33% - 10px );}
	.Def-services .Def-icon .nav-item .nav-text { font-size:16px; }
	.Def-plan .container .plans-grid { grid-template-columns: 1fr; } .Def-plan .container .section-title { font-size: 28px; }
	.def-contact > h2 { font-size: 28px; }
	.Def-plan .container .plans-grid { flex-direction:column; width:400px; max-width:100%; margin:0 auto; background:rgba(0,0,0,0.1); height:540px; overflow:hidden; overflow-y:auto; border:1px solid #efefef; border-radius:20px; padding:10px; margin-bottom:10px;}
	.Def-plan .container .plan-card { width:380px; max-width:100%; margin:0 auto;}
}
@media (max-width: 480px) {
	/*.Def-services .Def-services-wrap .services-box { display:block;}
	.Def-services .Def-services-wrap .services-box:nth-child(1) { background:url(../../Images/Layout/RWD/Home/Def-services-01-m.jpg) 0 0 no-repeat; background-size:100% auto;}
	.Def-services .Def-services-wrap .services-box:nth-child(2) { background:url(../../Images/Layout/RWD/Home/Def-services-02-m.jpg) 0 0 no-repeat; background-size:100% auto;}
	.Def-services .Def-services-wrap .services-box:before { display:none;}
	.Def-services .Def-services-wrap .services-box img { position:static; height:auto; opacity:0; height:calc( ( 100vw - 20px ) * 0.65 );}
	.Def-services .Def-services-wrap .services-box .text-content h2 { margin-bottom:10px;}
	.Def-services .Def-services-wrap .services-box .text-content p { margin-bottom:10px;}
	.Def-services .Def-services-wrap .services-box .text-content { width:100%; padding:15px 10px; height:auto; background:#4b6896;}
	.Def-services .Def-services-wrap .services-box .text-content .btn-more { position:static;}*/
	.Def-services .Def-services-wrap .services-box .text-content { width:60%;}
	.Def-services .Def-services-wrap .services-box .text-content p { -webkit-line-clamp: 3;}
	.Def-news .tab-header { margin-bottom:10px;}
	.Def-news .tab-btn { line-height:45px; font-size:20px;}
	.Def-news .tab-btn.active { border-radius:15px 15px 0 0;}
	.Def-news .news-swiper { padding-top:0;}
    .section-bg-A .nav-item { width: 100%; }
	.def-contact { padding:20px 0;}
}
@media (max-width: 460px) {
	.Def-services .Def-icon .nav-item { width:calc( 50% - 10px );}
	#txtCaptchacode { width:auto; max-width:80px;}
}
@media (max-width: 380px) {
	.Def-services .Def-services-wrap .services-box:before { background-size:100% 100%;}
	.Def-services .Def-services-wrap .services-box .text-content { width:55%; min-height:70vw;}
}