.project_wapper{display: block; width: 100%; font-size: 16px; background-color:#11181e;line-height:1.8em;position: relative;}
/*-----logo------*/
.nu_logo{display: block; width: 120px;height: 33px; position: absolute; top: 10px; left: 10px;z-index: 99;}

/*-----側邊諮詢入口-----*/
.advisory a{display: block; width: 50px; height: 200px;background: linear-gradient(45deg, #aa8776 0%,#aa8776 44%,#d9beb0 53%);writing-mode: vertical-lr;/*position: absolute;*/ top: 15px; right: 20px; z-index: 10;font-size: 20px;color: #fff; text-align: center;line-height:50px;border-radius: 50px;box-shadow: 0px 0px 5px 0px rgba(0,0,0,.5);transition: all .3s; }
.advisory a img{width:45px;height: 45px;}
.advisory a:hover{background: linear-gradient(45deg, #8d6a59 0%,#8d6a59 44%,#aa8776 53%);}

/*-----主視覺-----*/
.Key_Visual{display: block;height:1000px;/*background-image: url(/images/nu_images/HeadImg/01.jpg);*/background-position:center 60%;background-size:cover;background-repeat: no-repeat;position: relative;overflow: hidden;}
.Key_Visual:before{display: block;content: "";width: 100%;height: 1000px; background-color:rgba(0,0,0,.3);}
.Key_Visual:after{display: block;content: ""; width:75%; height:120px;background-color:#11181e;position: absolute;z-index: 10;bottom: 0;}
.Key_Visual p{display:block; color: #fff; font-size:22px;font-family: 'Noto Serif TC';text-align: center;letter-spacing:10px; position: absolute;    right: 0;  bottom:20%;  left: 0;  margin: auto;padding: 0 20px; box-sizing: border-box;z-index: 999;}
.Key_Visual p span{display: inline-block;font-family: 'Noto Serif TC';font-size: 18px;position: relative;bottom:3px;}
.Key_Visual p span+span{display:inline-block; width: 50px; height: 1px; background-color: #fff;position: relative;bottom:8px; margin: 0 10px;}

.sidebar {display: flex;flex-direction: column;}
.swiper-container a {display: flex;justify-content: center; /* 水平置中 */align-items: center; /* 垂直置中 */}
.swiper-container-horizontal > .swiper-pagination-bullets { display: inline-block; width: 25%; position: absolute; right: 0; bottom: 30px;text-align: center;left: 75%;}
/* 簡單的樣式調整 */
.case_slide {opacity: 0.5; transition-property: transform;}
.case_slide_active { opacity: 1;}
.case_slide_prev, .case_slide_next {display: flex; opacity: 0.5;}
.project_swiper_dot a.active {font-weight: bold;}
.project_swiper_dot a.active span {background-color: #dbbfb1;}
.project_swiper_dot a.active p {color: #dbbfb1;}
.bg-layer {position: absolute;top: 0;left: 0; width: 100%; height: 100%;background-size: cover;background-position: center;background-repeat: no-repeat;transition: opacity 0.6s ease-in-out;z-index: 0; opacity: 0;}
.bg-layer.current {opacity: 1;z-index: 1;}
.bg-layer.next {z-index: 2;}


.swiper_dot{display: inline-block;width:25%; position: absolute;right:0;bottom:30px;text-align: center;z-index:99;}
.swiper_dot a{display:inline-block; width:10px; height:10px; border:1px solid #fff;border-radius: 100%; margin: 0 15px;}
.swiper_dot a:hover , .swiper_dot a:focus ,.swiper_dot a.active{background-color:#fff;}


/*-----切換dot-----*/
.swiper-pagination{display: inline-block;width:25%; position: absolute;right:0;bottom:30px;text-align: center;}
.swiper-pagination-bullet{display:inline-block; width:10px; height:10px; border:1px solid #fff;border-radius: 100%; margin: 0 15px;}
.swiper-pagination-bullet:hover , .swiper-pagination-bullet:focus{background-color:#fff;opacity:1;}
.swiper-pagination-bullet-active{background-color:#fff;}
.swiper-container-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet {margin: 0 15px;}
/*----整體樣式-----*/
section {
    display: block;
    width: 100%;
    color: #cecece;
    box-sizing: border-box;
    padding-bottom: 100px;
    box-sizing: border-box;
}
section h2{color: #dbbfb1;font-size: 44px;margin-bottom:30px;}
section h3{color: #dbbfb1;font-size: 24px;font-weight: bold;margin-bottom:10px;}
section strong {display: block; font-size:24px;font-weight: bold;line-height: 1.6em;}
section h4{font-size: 30px;font-weight: bold;margin-top: 10px; } 

/*----exclusive-----*/
.section_exclusive_part{display: flex;max-width: 1200px; margin: 0 auto;flex-wrap: wrap;margin-top: 20px;flex-direction: row;}
.marketing_img{display:block; width:350px; height: 550px;background-image: url(/images/nu_images/S__232079439_0.jpg);background-position: center;background-size: cover;}
.marketing_text{display: block;width:50%; margin-left:50px;}
.marketing_text h4 , .marketing_text strong{font-style: italic; color: #fff;line-height: 1.4em;}

/*----residentail-----*/
.section_residentail_part h2 , .section_service_part h2{text-align: center;}
.project_box{display: flex;max-width: 1000px;margin: 0 auto;flex-wrap: wrap;justify-content:space-between;}
.project_intro{display: block;width: 85%;}
.project_intro h3{display:inline-block;color:#cecece;font-size: 30px; padding: 5px 20px 5px 60px;border:1px solid #cecece;position: relative;}
.project_intro h3 span{display: block; width: 95px;position: absolute;left: -40px;}
.project_intro p{display: block; margin-left:60px;margin-top: 20px;}
/*-----案例切換dot-----*/
.project_swiper_dot{display:block; width:50px;}
.project_swiper_dot  a{display: flex;color:#11181e;}
.project_swiper_dot  a span{display: inline-block;width: 10px; height: 10px; border:1px solid #dbbfb1; border-radius: 100%;position: relative;top:9px;margin-right: 10px;}
.project_swiper_dot  a:hover{color:#dbbfb1; }
.project_swiper_dot  a:hover span{background-color:#dbbfb1; }

.imgDescription { display: none;}
.imgDescription:first-child {display: block;}
.swiper-container.project_img {display: flex;justify-content: space-evenly;flex-direction: row;margin-top: 50px;position: relative;}
.swiper-slide a {display: block;width: 100%;height: 0;padding-bottom: 66.7%;overflow: hidden;position: relative;opacity: .5; margin-left: 6%;}
.swiper-slide div:hover, .swiper-slide div:focus {transform: scale(1.1,1.1);transition: all .3s;}
.swiper-slide div a:hover, .swiper-slide div a:focus {opacity: 1;}
.swiper-slide img {display: block;position: absolute;top: 0;left: 0;right: 0;margin: 0 auto;width: 100%;height: 100%;}
.swiper-slide.swiper-slide-active img { opacity: 1;}
.swiper-slide:hover img {transform: scale(1.1); opacity: 1;}
.swiper-button-prev,.swiper-button-next { width: 90px; height: 50px;background: rgba(0, 0, 0, 0.5);top: 45%; color: #fff; z-index: 10;}
.swiper-button-prev {left: 5px; top: 50%;}
.swiper-button-next {right: 5px;top: 50%;}
.swiper-button-prev:hover,.swiper-button-next:hover {background: rgba(0, 0, 0, 1);}
.project_img .swiper-button-prev img, .project_img .swiper-button-next img { width: 60%;}
.swiper-wrapper{padding:0 32.5%;}
.video-swiper .swiper-wrapper{padding:0 34%;}
.swiper-slide div{width:85%;}
div.swiper-slide{display:flex;justify-content:center;}
.swiper-container2.project_img {display: flex;justify-content: space-evenly;flex-direction: row;margin-top: 50px;position: relative;}
.swiper-slide2 img {display: block;position: absolute;top: 0;left: 0;right: 0;margin: 0 auto;width: 100%;height: 100%;}
.swiper-container2 a {display: flex;justify-content: center; /* 水平置中 */align-items: center; /* 垂直置中 */}

.swiper-button-prev.video-prev, .swiper-button-next.video-next {
    width: 90px;
    height: 50px;
    background: rgba(0, 0, 0, 0.5);
    top: 45%;
    color: #fff;
    z-index: 10;
}
.swiper-button-prev.video-prev {left: 5px; top: 50%;}
.swiper-button-next.video-next{right: 5px; top: 50%;}
.swiper-button-prev.video-prev img, .swiper-button-next.video-next img { width: 60%;}

/*----service-----*/
.section_service_part{display: block; margin:0 auto;}
.service_intro {display: flex; max-width: 1200px; margin: 0 auto;justify-content:space-between;flex-wrap: wrap;}
.service_desc{width: 45%;margin-top: 30px; }
.service_desc h3{font-size: 30px;}
.service_desc strong{font-size: 24px;}
.service_desc p{margin-bottom:30px;}
.service_desc a{display: block; width:50%;height: 50px; border:1px solid #dbbfb1;text-align: center;font-size:20px; font-weight: bold;line-height: 50px; color: #dbbfb1;border-radius: 60px;margin: 0 auto;}
.service_desc a:hover{background-color:#dbbfb1;color:#11181e; }
.service_desc ul {margin-top:30px;}
.service_desc ul li{display: block;margin: 5px 0;}
.service_desc ul li:before{display: inline-block; content: "✓";color:#dbbfb1;margin-right: 8px;}
.service_desc ul li span{color:#dbbfb1;}

.service_img{display: block; width:44%; height:0;padding-bottom:48%; background-image: url(/images/nu_images/service.png);background-size: contain;background-repeat: no-repeat;}

/*-----另開視窗------*/
.service_pop_up{display:none; max-width: 800px;position: relative;padding:80px 40px 30px 40px; border:1px solid #debcab;box-sizing: border-box;border-radius: 30px;margin: 0 auto;background-color:rgba(17, 24, 30, .9);position: absolute; top: 60%;    left: 50%;  transform: translate(-50%, -20%);	margin: 0 auto;z-index: 10;}
.service_pop_up .closebtn {position: absolute;top: 0;right: 25px;font-size: 36px; }
.service_pop_up a {padding: 15px 0px;text-decoration: none;font-size: 20px;color: #debcab;display: block;transition: 0.3s;line-height: 1em;}
.service_pop_up ul {list-style-type:decimal;margin-left: 20px;}
.service_pop_up ul li{text-align: left;color:#cecece; }

table, th, td {border-collapse: collapse;padding: 15px 10px;color: #fff;font-size: 24px;font-weight: bold;text-align: center;}
table {width: 100%;margin-bottom: 30px;}
table {border-collapse: collapse;border-spacing: 0;}
th {background: #debcab;color: #11181e;}
.service_pop_up td {border-right: 1px solid #debcab;vertical-align: middle;border-bottom:1px solid #debcab;color: #debcab;}
.service_pop_up thead th{ border-right: 1px solid #11181e; }
table, th, td:nth-child(3){border-right:0;}
table span{font-size: 16px;}

/*-----CONCEPT------*/
.section_concept_part{display: block; width:100%;}
.concept_img{display: block;max-width: 1250px; height: 400px;background-image: url(/images/nu_images/S__232079423_0.jpg);background-position:center 70%;background-size:cover;background-repeat: no-repeat;}
.concept_desc{display: block; max-width: 900px;margin-top: 50px;margin-left:350px;}
.concept_desc div{display: block; margin-left:100px;max-width:800px;}

/*------input樣式------*/
.block {display: block;margin-top: 25px;position: relative;}
input {width: 100%;border: 1px solid #dbbfb1;border-radius: 30px;background-color:rgba(17,24,30,.8);box-sizing: border-box;height: 45px;line-height: 45px;padding: 0 20px;color: #fff;font-size: 1em;-webkit-transition: .18s ease-out;-moz-transition: .18s ease-out;-o-transition: .18s ease-out;transition: .18s ease-out;font-family: "Noto Sans SC Sliced";}
textarea {width: 100%;height: 200px;padding: 20px;box-sizing: border-box;font-family: "Noto Sans SC Sliced";border-radius: 20px;border: 1px solid #dbbfb1;background-color:#11181e;color: #fff;
}
:-moz-placeholder {color: #dbbfb1; }
::-moz-placeholder { color:#dbbfb1;}
:-ms-input-placeholder {color:#dbbfb1 !important;}
::placeholder { color:#dbbfb1;}

/*-----CONCEPT------*/
.section_contact_part{display:flex; max-width: 1200px;margin: 0 auto;position: relative; align-content: center;position: relative;flex-wrap: wrap;}
.contact_img{display: block;width: 950px;height: 750px;background-image: url(/images/nu_images/S__232079439_0.jpg);background-size:cover;background-position: center;background-repeat:no-repeat;border-radius: 20px;}
.information_form{display:block; width:48%; height: 750px; border-radius: 30px;border: 1px solid #dbbfb1;background-color:rgba(17,24,30,.8);box-sizing: border-box;padding:50px 70px;position:absolute;  top: 50%;right: 0; transform: translate(0%, -57%);    box-shadow: 0px 0px 8px 5px rgba(0, 0, 0, .1);
    -webkit-box-shadow: 0px 0px 8px 5px rgba(0, 0, 0, .3);}
.information_form h2{display: block;text-align: center;}
.information_form a{display: block;width:100%;height: 50px;text-align: center;font-size: 20px;font-weight: bold;line-height: 50px;color:#11181e;    border-radius: 60px; margin-top: 25px; background-color: #dbbfb1;}

.project_wapper .nu_copyright{display: block; background-color: #000;color: #7e7b7b;height:30px;line-height:30px;font-size: 12px;text-align: center;}


@media (min-width:320px) and (max-width:1024px) { 
.Key_Visual p span{display: block;margin-bottom: 15px;}
.Key_Visual p span+span{display: none;}
.section_exclusive_part{justify-content: center;flex-direction:column-reverse;} 
.marketing_text{width:60%;margin: 0 auto;margin-bottom: 30px;}
.marketing_img{margin: 0 auto;width:60%;background-size: contain;background-repeat:no-repeat;}
.service_img{display: block; width:67%; height:0;padding-bottom:73%;}
/* 移除 wrapper padding，避免縮小 swiper-slide 可用空間 */
.swiper-wrapper {padding: 0 !important;}
/* 每個 slide 強制寬度 100% */
.swiper-container.project_img .swiper-slide.slide-head {width: 100% ;margin: 0 auto ;justify-content: center !important;}
/* 移除內部 div 的寬度限制 */
/*.swiper-container.project_img div {width: 100% !important;padding: 0 !important;}*/
/* 裡面的 a 標籤設定滿寬 */
.swiper-slide a {margin-left: 0 !important;width: 100% !important;}
/* 保證圖片不會被壓縮或超出 */
/*.swiper-slide img {width: 100% !important;height: auto !important;object-fit: cover;}*/
.swiper-slide {display: flex !important;justify-content: center;align-items: center;}
.swiper-container.project_img .swiper-button-prev{left: 0;}    
.swiper-container.project_img .swiper-button-next{right: 0;}
.project_box{padding: 0 20px; box-sizing: border-box;}
.project_intro h3{margin-left:30px;}
.project_intro p{margin-left: 90px;}

/*videorecord*/
.video-swiper .swiper-button-prev.video-prev{left: 0;}    
.video-swiper .swiper-button-next.video-next{right: 0;}


.service_intro{padding: 0 20px;}
.service_intro{justify-content: center;}
.service_desc{width:60%;margin-bottom: 30px;}
.concept_desc{padding: 0 20px;box-sizing: border-box;margin: 0 auto;margin-top: 50px;}
.concept_desc div{max-width: 100%;}
.section_contact_part{padding: 0 20px;}
.contact_img{width: 700px;}
.information_form{top: 56%;right: 20px;}
 
.service_pop_up{width:70%;}	
table {  width:100%; }
table, th, td {text-align:left;}
table tr{display: block;}
thead {display: none;}
td {display: block;}
td:before {   content: attr(data-title);display: inline-block;width: auto;min-width:40%;font-weight: 600;color: #fff;  }    
.service_pop_up td{border-right: 0;}    
.nu_copyright{margin-top:50px;}   
	
	
	
}

@media (min-width:320px) and (max-width:820px) { 
    .section_contact_part{display: block;}
    .contact_img{display: none;}
    .information_form{position: relative;width: 100%;top: 0;right: 0;transform: translate(0%, 0%); }    

}

@media (min-width:320px) and (max-width:768px) { 
    .Key_Visual{height: 500px;}
    .Key_Visual:after{display: none;}
    .swiper-container-horizontal > .swiper-pagination-bullets {
        width: 100%;
        position: absolute;
        bottom: 30px;
        text-align: center;
        left: 0%;
        z-index:999;
    }
    .swiper-container-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet {
        margin: 0 15px;
    }
    .swiper_dot{width:100%;}
    .section_exclusive_part{margin-top:100px;}
    section h2{font-size:40px;text-align: center;}
    .project_intro{width: 100%;}
    .project_intro p{margin-left: 0;}
    .project_swiper_dot{display: block;width: 100%;text-align: center;    }
    .project_swiper_dot a{display: inline-block;text-align: center;margin:8px;}
    .project_swiper_dot a span{display: block;margin:8px;}
    .swiper-container.project_img{margin-top: 30px;}
	table, th, td{font-size: 20px;}
	 .concept_desc div{margin-left: 0;}
}

@media (min-width:320px) and (max-width:640px) { 
    .advisory a{top: 8px;right: 8px;}
    .Key_Visual p span{font-size:16px;}
    .Key_Visual p{letter-spacing: 5px;font-size: 20px;bottom: 15%;}
    .marketing_text{width: 100%;padding: 0 20px;box-sizing: border-box;}
    .marketing_img{width: 100%;}
	.service_img{display: block; width:80%; height:0;padding-bottom:87%;}
    .project_intro{width: 100%;}
    .project_intro p{margin-left: 0;}
    .service_desc{width: 100%;}
   
	.service_pop_up{width:80%;}	


}

@media (min-width:320px) and (max-width:460px) { 
    section h2{font-size: 36px;line-height: 1.2em;}
    section h3 , section strong{font-size: 20px}
    .project_intro h3 , .service_desc h3{font-size: 24px;}

    .information_form{padding:50px 30px;}
	 .service_desc a{width: 100%;}
	.service_pop_up{padding:60px 20px 20px 20px}
	td:before { display:block;  } 
}