@charset "utf-8";
@import url('https://fonts.googleapis.com/css?family=Noto+Sans+TC:100,300,400,500,700,900|Open+Sans:300,300i,400,400i,600,600i,700,700i,800,800i&subset=chinese-traditional&display=swap');
@import url("../fonts/icomoon/style.css");
@font-face{font-family:'SoDoSans'; font-style:normal; font-weight:100; src:url(/objects/fonts/SoDoSans-Fonts/SoDoSans-Light.woff) format('woff'), url(/objects/fonts/SoDoSans-Fonts/SoDoSans-Light.ttf) format('truetype'); }
@font-face{font-family:'SoDoSans'; font-style:normal; font-weight:400; src:url(/objects/fonts/SoDoSans-Fonts/SoDoSans-Regular.woff) format('woff'), url(/objects/fonts/SoDoSans-Fonts/SoDoSans-Regular.ttf) format('truetype'); }
@font-face{font-family:'SoDoSans'; font-style:normal; font-weight:700; src:url(/objects/fonts/SoDoSans-Fonts/SoDoSans-Bold.woff) format('woff'), url(/objects/fonts/SoDoSans-Fonts/SoDoSans-Bold.ttf) format('truetype'); }
@font-face{font-family:'SoDoSans'; font-style:normal; font-weight:900; src:url(/objects/fonts/SoDoSans-Fonts/SoDoSans-Black.woff) format('woff'), url(/objects/fonts/SoDoSans-Fonts/SoDoSans-Black.ttf) format('truetype'); }

/* reset */
*{ margin:0; padding:0; box-sizing:border-box; -webkit-tap-highlight-color:rgba(0,0,0,0); -webkit-tap-highlight-color:transparent; outline:none; font-display:swap; }
html,body{ font-family:'Noto Sans TC','SoDoSans',Arial,'Microsoft JhengHei','PingFang TC','Open Sans',sans-serif; overscroll-behavior:none; font-size:10px;}
html{ -ms-text-size-adjust:100%; -webkit-text-size-adjust:100%; }
body{ margin:0; -webkit-overflow-scrolling:touch; text-align:center; scroll-behavior:smooth;/*頁籤滑順的捲動*/ position:relative; width:100%; max-width:100%; overflow-x:clip; height:100vh; height:calc(var(--vh, 1vh) * 100); color:#3D3935; }
:before,:after{ font-family:'icomoon','Noto Sans TC','SoDoSans',Arial,'Microsoft JhengHei','PingFang TC','Open Sans',sans-serif; line-height:1; }
article,aside,details,figcaption,figure,footer,header,hgroup,main,nav,section,summary,div,a{ display:block; box-sizing:border-box; position:relative;}
a{ background:transparent; text-decoration:none; color:inherit; cursor:pointer; line-height:1em; display:inline-block; font-size:inherit;}
a:active{ outline:0; }
b,strong{ font-weight:bold; }
dfn{ font-style:normal; }
img{ border:0; vertical-align:middle; line-height:0; font-size:0; }
input,textarea,button,select,option{ border:0; margin:0; outline:none; padding:0; font-size:inherit; font-family:'Noto Sans TC','SoDoSans',Arial,'Microsoft JhengHei','Apple LiGothic Medium','Open Sans',sans-serif; -webkit-appearance:none; -moz-appearance:none; -ms-appearance:none; appearance:none; }
label,span{ font-size:inherit; }
textarea{ resize:none; }
select::-ms-expand{ display:none; }
input::-moz-placeholder,textarea::-moz-placeholder{ color:#ccc; }
input:-ms-input-placeholder,textarea:-ms-input-placeholder{ color:#ccc; }
input::-webkit-input-placeholder,textarea::-webkit-input-placeholder{ color:#ccc; }
table{ border-collapse:collapse; border-spacing:0; }
td,th{ padding:0; }
h1,h2,h3,h4,h5,h6,p,figure,form,blockquote{ margin:0; font-weight:normal; line-height:1em; margin-bottom:0;}
p,td,th,a,span,strong,b{ font-size:inherit; line-height:inherit; }
ul,ol,li,dl,dd{ margin:0; padding:0; font-size:inherit;}
ul,ol{ list-style:none; box-sizing:border-box; }

.loading{ position:fixed; width:100%; min-width:100vw; height:100%; min-height:100vh; top:0; left:0; background:#EDEEEE; z-index:100; display:flex; justify-content:center; align-items:center; }
.loading img{ width:80px; margin:16px auto; animation:loadingAni 2s infinite alternate; }
@keyframes loadingAni{from{ transform:scale(.9); } to{ transform:scale(1); } }
picture,img{ display:block; }
html:has(header .navCheck:checked) { overflow:hidden; }

/*header*/
header{ background:#fff; width:100%; box-shadow:0 1px #3d39351a; z-index:90; transition:all .6s;}
header .header-container{ padding:16px 10px; display:flex; justify-content: space-between; align-items:center; position:relative; }
header .header-container .logo{ width:auto; height:40px; transition:all 1s ease; }
header .header-container .logo img{ width:auto; height:100%; }
header .logo_reserve{ width:auto; height:44px; position:absolute; left:50%; transform:translateX(-50%); transition:all 1s ease;} 
header .logo_reserve img{ width:auto; height:100%; }
header .groupMenu{ display:flex; align-items:center; gap:12px; }
header .navCheck{ display:none; font-size:0; opacity:0; pointer-events:none; }
header .navToggle{ display:inline-block; width:35px; height:35px; box-sizing:border-box; padding:4px; cursor:pointer; }
header .navToggle span ,header .navToggle span:before ,header .navToggle span:after{ display:block; width:100%; background:#000; height:2px; border-radius:2px; }
header .navToggle span{ position:relative; top:50%; transform:translateY(-50%); transition:background .3s .6s;}
header .navToggle span:before ,header .navToggle span:after{ content:''; position:absolute; }
header .navToggle span:before{ top:-8px; transition:transform .1s .3s ,top .3s .7s;}
header .navToggle span:after{ bottom:-8px; transition:transform .1s .3s ,bottom .3s .7s;}
header .navCheck:checked ~ .navToggle span{ background:none; transition:background .3s .6s;}
header .navCheck:checked ~ .navToggle span:before{ top:0; transform:rotate(135deg); transition:top .2s .1s,transform .2s .6s;}
header .navCheck:checked ~ .navToggle span:after{ bottom:0; transform:rotate(225deg); transition:bottom .2s .1s,transform .2s .6s;}
header .navCheck:checked ~ nav{ height:calc(100vh - 72px); /*overflow:auto;*/ } 
header nav{ width:100%; position:fixed; top:72px; left:0; overflow:hidden; overscroll-behavior:contain;/*阻止滚动父元素*/ height:0; display:flex; align-items:flex-end; flex-direction:column; transition:height 1s; transform:translateY(0); background:rgba(0,0,0,.9); }
header nav .nav-container{ background:#fff; width:100%; height:100%; max-width:320px; overflow:hidden; overscroll-behavior:contain;/*阻止滚动父元素*/}
header nav ul.mainMenu{ display:flex; flex-direction:column; justify-content:flex-start; font-size:clamp(1.8rem, 5.1vw, 2rem);}
header nav ul.mainMenu > li{ font-weight:500; letter-spacing:.2em; padding:0 10px;}
header nav ul.mainMenu > li > a{ padding:.5em 1em; width:100%; border-bottom:solid 1px #3d39351a; position:relative; } 
header nav ul.mainMenu > li:has(.subMenu) > a:before{ content:'\e904'; position:absolute; top:50%; right:10px; font-size:.75em; color:#3D3935; transform:translateY(-50%); transition:transform .6s ease; } 
header nav ul.mainMenu > li .subMenu{ transition:all .4s; overflow:hidden; position:relative; transform:translateY(0); height:0; }
header nav ul.mainMenu > li .subMenu ul{ width:auto; margin:20px auto; display:flex; flex-direction:column; justify-content:center; font-size:clamp(1.6rem, 4.1vw, 1.8rem); opacity:0; transform:translateY(-10px); transition:all 1s ease; }
header nav ul.mainMenu > li .subMenu ul > li{ margin:0 20px; letter-spacing:.1em; font-weight:400;}
header nav ul.mainMenu > li .subMenu ul > li a{ display:flex; align-items:center; justify-content:center; padding:10px 15px; }
header nav ul.mainMenu > li.active{ background:#0000000d; transition:all .6s ease;}
header nav ul.mainMenu > li.active > a:before{ transform:translateY(-50%) rotateX(180deg); } 
header nav ul.mainMenu > li.active .subMenu{ height:auto;}
header nav ul.mainMenu > li.active .subMenu > ul{ opacity:1; transform:translateY(0);}
header .otherMenu{ display:flex; justify-content:center; align-items:baseline; gap:12px; z-index:1; }
header .otherMenu .icon{ background:#EBEBEA; font-size:1.6rem; color:#3D3935; padding:.25em .75em; border-radius:1.5em; display:flex; align-items:center; gap:2px; position: relative; } 
header .otherMenu .icon.home:before{ content:'\e90b'; }
header .otherMenu .icon.language:before{ content:'\e902'; }
header .otherMenu .icon.language:after{ content:'\e904'; font-size:.6em; }
header .otherMenu .icon.language ul{ position:absolute; top:0; left:0; text-align:left; display:flex ; flex-direction:column; font-size:1.4rem; background:#3d3936; border-radius:4px; color:#ebebea; display:none; }
header .otherMenu .icon.language ul a{ padding:1em .8em; border-bottom:solid 1px #ebebea; width:100%; }
header .otherMenu .icon.language:hover ul{ display:block; }
footer{ background:#3D3935; color:#F9F6F2; padding:32px 0; display:flex; flex-direction:column; align-items:center; }
footer .footer_sub{ display:flex; font-size:1.6rem; margin-bottom:24px;}
footer .footer_sub li + li:before{ content:'|'; display:inline-block; width:1.8em;}
footer p.footer_copyright{ font-size:clamp(1rem, 3vw, 1.6rem); }
.wrap a{ cursor:pointer; }
.wrap a.map:after{ content:'\e90e'; color:#D6D97E; vertical-align:baseline; margin-left:2px; }
/*.wrap .en{ font-family:Arial,'SoDoSans','Noto Sans TC',Roboto,sans-serif; }*/
.btn{ cursor:pointer; display:inline-block; font-size:clamp(1.6rem, 4.1vw, 1.8rem); line-height:1; padding:.5em 1em; transition:all .6s ease; box-shadow:0 3px 6px #00000029;}
.btn.black{ background:#3D3935; color:#EBEBEA; }
.btn.whtie{ background:#F9F6F2; box-shadow:0 0 0 1px #AA8875; color:#976D3F; transition:all .6s ease; }
.btn.whtie:hover{ background:#AA8875; box-shadow:0 0 0 1px #AA8875; color:#F9F6F2; }
.btn.border{ font-size:1.4rem; color:#3D3935; border:solid 1px; transition:all .8s ease;}
.btn.border:hover{ box-shadow:1px 1px 6px #0000004d;}
.btn.border.black{ color:#3D3935; background:transparent; }
.btn.border.brown{ color:#976D3F; }
.btn.border.gold{ border-color:#E5D2A2; }
.btn.border.disable{ color:#C4C1BE; border-color:#C4C1BE; pointer-events:none; box-shadow:none; }
.btn.toTop:before{ content:'\e905'; }
.btn.toBottom:before{ content:'\e90c'; }
.btn.toList:before{ content:'\e90d'; }
.btn.toPrev:before{ content:'\e907'; }
.btn.toNext:after{ content:'\e908'; }
.btn.big{ font-size:2.4rem; }
.fixed_btn_group{ position:fixed; right:-1px; bottom:48px; z-index:89; display:flex; flex-direction:column-reverse; gap:16px; transition:all 1s ease; }
.fixed_btn_group .btn{ width:34px; padding:6px; background:#ffffffbf; display:flex; align-items:center; justify-content:center;}
.fixed_btn_group .btn.gold{ font-size:1.6rem; padding:.6em 6px; line-height:1.2; }
.fixed_btn_group .btn.gold + .gold{ margin-bottom:-6px; }
.btn.underline{ position:relative; font-size:2.4rem; color:#3D3935; box-shadow:unset; padding:.25em .2em .25em .4em; letter-spacing:.25em; transition:all .8s ease;}
.btn.underline:before,.btn.underline:after{ position:absolute; bottom:0; left:0; content:''; height:53%; mix-blend-mode:darken; transition:width .4s ease;}
.btn.underline:before{ width:100%; }
.btn.underline:after{ width:0%; }
.btn.underline.lightGreen:before,.btn.underline.lightGreen:after{ background:#D6D97E;  }
.btn.underline.lightBlack{ font-size:inherit; letter-spacing:inherit; padding:unset; } 
.btn.underline.lightBlack:before,.btn.underline.lightBlack:after{ background:#3d3936; height:1px; }
.btn.underline:hover:before{ width:0%; left:unset; right:0; transition:width .6s ease-in-out; }
.btn.underline:hover:after{ width:100%; transition:width .6s .4s ease-in-out;}
.btn.arrow:after{ content:'\e906'; font-size:.9em; }
.btn.arrow:hover{ letter-spacing:.2em; }
.btn.close:after{ content:'\e910'; font-size:.9em; }
.btn.icon{ border:solid 1px; border-radius:50%; font-size:inherit; display:flex; justify-content:center; align-items:center; font-size:.75em; padding:0; width:24px; height:24px;} 
.btn.icon.fb:before{ content:'\e900'; } 
.btn.icon.ig:before{ content:'\e901'; }
.btn.icon.app:before{ content:'\e90f'; }

aside.fixed_menuBar{ position:fixed; right:42px; bottom:48px; max-width:260px; z-index:88; transform:translateX(150%); transition:all 1s ease;} 
aside.fixed_menuBar.open{ transform:translateX(0);} 
aside.fixed_menuBar .btn.close{ position:absolute; background:#ffffffbf; left:0; bottom:0; transform:translateX(-100%); }
aside.fixed_menuBar ul{ background:#D9CEC5; padding:24px 12px; display:flex; flex-direction:row; flex-wrap:wrap; gap:8px 36px;  margin:0 auto; box-shadow:0 3px 6px #00000029;}
aside.fixed_menuBar ul li{ width:100%; }
aside.fixed_menuBar ul li a.btn{ display:block; width:100%; padding:8px 0; font-size:1.8rem; text-align:left; letter-spacing:.1em;} 
aside.fixed_menuBar ul li a.btn.underline:before,aside.fixed_menuBar ul li a.btn.underline:after{ height:1px; background:#AA8875; }
aside.fixed_menuBar ul li a p{ margin-bottom:4px; line-height:1; }
aside.fixed_menuBar ul li a p.en{ font-size:1.4rem; text-align:left; letter-spacing:0; color:#966E3F; padding:0; box-shadow:unset; width:100%;}
aside.fixed_menuBar ul li a p.en:after{ position:absolute; left:unset; right:0; bottom:16px; font-size:.7em; }
.wrap .NDAD{ position:sticky; bottom:0; left:0; background:#fff; z-index:88; }
.wrap .NDAD img{ width:100%; max-width:1400px; height:10vh; object-fit:contain; background-position-x:center; margin:auto}
.wrap .alignRight{ text-align:right; }

.container-fill{ width:100%; padding:0 10px; margin:auto;}
.container{ position:relative; width:100%; max-width:1400px; padding:0 30px 0 20px; margin:0 auto;}
.wrap{ overflow-x:clip; min-height:calc(var(--vh, 1vh) * 100 - 200px);}
.wrap .images_block{ position:relative; width:100%;}
.wrap .images_block img{ width:100%; max-width:100%; height:auto; }
.wrap .images_block.coming:after{ content:'圖片待補'; font-size:3rem; color:#fff; position:absolute; top:0; left:0; display:block; width:100%; height:100%; background:rgba(0, 0, 0, .5); display:flex; justify-content:center; align-items:center; z-index: 2;} 
.wrap .title{ display:flex; flex-direction:column; gap:8px; margin-bottom:3rem;}
.wrap .title.right_line{ width:100%; gap:4px; flex-direction:row; font-size:clamp(2.8rem, 8.7vw, 3.4rem); font-weight:500; letter-spacing:.075em; line-height:1;}
.wrap .title.right_line:after{ content:''; display:inline-block; flex:1 2 auto; border-bottom:solid 1px;}
.wrap .title span{ display:inline-block; }
.wrap .title.straight{ position:relative; border-left:solid 1px; color:#3D3935; font-size:clamp(2.8rem, 7.5vw, 4.8rem); text-align:left; padding-left:28px; padding-top:100px; font-weight:700; line-height:1.7; margin-bottom:48px;}
.wrap .title.straight:before{ position:absolute; left:0; bottom:0; content:''; width:12px; height:calc(100% - 100px); background:#3D3935; }
.wrap .title h3{ margin-bottom:0; }


.wrap h2{ font-size:clamp(3.8rem, 8vw, 4.8rem); line-height:1.4; letter-spacing:.1em; font-weight:700; }
.wrap h2.en,.wrap h3.en{ font-size:clamp(1.8rem, 4.6vw, 2.6rem); line-height:1.4; letter-spacing:.1em; font-weight:700; margin-bottom:.8em; }
.wrap h3{ font-size:clamp(3.4rem, 7vw, 3.8rem); line-height:1.4; letter-spacing:.1em; font-weight:700;  margin-bottom:.8em;}
.wrap h4{ font-size:clamp(2rem, 5.3vw, 2.4rem); letter-spacing:.06em; font-weight:700; line-height:1.6; margin-bottom:.8em;}
.wrap p{ font-size:clamp(1.6rem, 4.1vw, 1.8rem); line-height:1.6; letter-spacing:.05em; text-align:justify; margin-bottom:.6em;}
.wrap p.big{ font-size:clamp(1.8rem, 4.6vw, 2.2rem); line-height:1.6; }
.wrap p.small{ font-size:clamp(1.4rem, 4.2vw, 1.6rem); font-weight:300; line-height:1.4; }

.logo_DP{ padding:64px 0; }
.logo_DP img{ margin:0 auto; width:80%; max-width:550px; }
.logo_DP + .title{ margin-bottom:24px; }

hr{ width:100%; height:1px; border:0; background:#3D3935; }
hr.straight{ position:relative; width:1px; height:0; margin:0 auto; border:0; background:#3D3935; margin-top:80px; overflow:clip; }
hr.straight:before{ content:''; display:block; position:absolute; top:0; left:0; width:100%; height:0%; background:#ccc; }

/*影片*/
.video_bg.darkBrown{ background:#3D3935; }
.video_container{ line-height:0; width:100%; max-width:900px; margin:0 auto;} 
.video_container .video_box{ position:relative; width:100%; height:auto; display:inline-block; margin:0 auto; background:url(../images/video_default.png); background-size:cover; }
.video_container .video_box .video_block{ width:100%; padding-top:56.25%; }
.video_container .video_box .video_block iframe{ position:absolute; top:0; left:0; width:100%; height:100%;}

/*輪播*/
.slidegroup{ position:relative;}
.slidegroup .slider-paginator{ position:absolute; bottom:0; left:0; display:flex; justify-content:center; align-items:baseline; background:#000000bf; padding:0 .5em; border-radius:2em; font-size:1.8rem; color:#ffffffa6; line-height:1; font-weight:300; }
.slidegroup .slider-paginator .arrow{ width:1.8em; height:1.8em; display:flex; align-items:center; justify-content:center; } 
.slidegroup .slider-paginator .arrow:before{ display:block; font-size:.8em; color:#fff; }
.slidegroup .slider-paginator .arrow.prev:before{ content:'\e909'; }
.slidegroup .slider-paginator .arrow.next:before{ content:'\e90a'; }
.slidegroup .slider-paginator .arrow.slick-disabled:before{ color:#ffffffa6; }
.slidegroup .slider-paginator .counter{ font-size:inherit; }
.kv.slidegroup img{ width:100%; min-height:75vw; object-fit:cover; }
.slick-slide{ cursor:grab; }
.slick-slide:active{ cursor:grabbing; }
.slick-dots{ display:flex; justify-content:center; gap:0 16px;  }
.slick-dots button{ font-size:0; width:12px; height:12px; border-radius:12px; background:#976D3F; opacity:.6; transition:all 1s ease; }
.slick-dots .slick-active button{ width:30px; opacity:1; }
/*序*/
.preface{ text-align:left; }





/* 直式 */
@media (orientation:portrait){


}

/* 橫式 */
@media (orientation:landscape){
.kv.slidegroup .slider-paginator{ bottom:16px; left:50%; transform:translateX(-50%); }
.kv.slidegroup img{ min-height:unset; }
.wrap .title{ gap:0; }
.wrap .titleh2.en{ margin-bottom:0; }

}
/* lg applies to medium devices (tablets, less than 992px) */
@media (min-width:991.98px) { 
header .header-container{ padding:26px 48px; }
header .header-container .logo{ height:60px; }
header .logo_reserve{ height:70px; }	
header .navCheck:checked ~ nav{ height:calc(100vh - 112px);  } 
header nav{ top:112px;}
header nav .nav-container{ max-width:unset; display:flex; justify-content:center; }
header nav ul.mainMenu{ flex-direction:row; padding-top:80px; }
header nav ul.mainMenu a:hover{ color:#976d3f; }
header nav ul.mainMenu > li > a{ border-bottom:unset; padding:.5em 0em;}
header nav ul.mainMenu > li.active, header nav ul.mainMenu > li:hover{ background:unset; }
header nav ul.mainMenu > li > a:before{ position:absolute; bottom:0; left:0; content:''; width:0; height:2px; background:#976d3f; transition:width .4s ease; }
header nav ul.mainMenu > li:has(.subMenu) > a:before{ content:''; display:none; }
header nav ul.mainMenu > li .subMenu{ display:block; }
header nav ul.mainMenu > li .subMenu ul > li{ border-bottom:solid 1px #D5D97E; }
header nav ul.mainMenu > li:has(.subMenu) > a{ color:inherit; cursor:default; }
header nav ul.mainMenu > li > a:hover:before{ width:100%; }
header nav ul.mainMenu > li .subMenu{ height:auto; }
header nav ul.mainMenu > li .subMenu ul{ opacity:1; transform:translateY(0); } 
header nav ul.mainMenu > li .subMenu ul > li:hover{ border-bottom:solid 1px #976d3f; }

footer{ display:flex; flex-direction:row; align-items:baseline; justify-content:space-between; padding:42px 48px; }
footer .footer_sub{ margin-bottom:0; }

.fixed_btn_group{ right:16px; bottom:56px;}
aside.fixed_menuBar{ right:60px; bottom:56px; }

.container{ padding:0 60px 0 40px;} 
.wrap{ min-height: calc(var(--vh, 1vh) * 100 - 219px); }

.logo_DP + .title{ margin:32px auto 24px; }


}

/* xl applies to large devices (desktops, less than 1200px) */
@media (min-width: 1199.98px) { 
/*.fixed_btn_group .btn.gold{ font-size:1.6rem; padding:.6em 6px; line-height:1.2; }*/




}

/* xxl applies to x-large devices (large desktops, less than 1400px) */
@media (min-width: 1399.98px) { ... }

/* XX-Large devices (larger desktops, 1400px and up)  */
@media (min-width: 1400px) { 
.container{ padding:0 40px;}
 }