@charset "utf-8";
@font-face{
	font-family: 'anr';
	src: url(../font/anr.otf);
	
}
@font-face{
	font-family: 'anb';
	src: url(../font/anb.otf);
}
@font-face{
	font-family: 'mb';
	src: url(../font/mb.otf);
}
@font-face{
	font-family: 'mol';
	src: url(../font/mol.otf);
}
@font-face{
	font-family: 'mm';
	src: url(../font/mm.otf);
}
@font-face{
	font-family: 'mr';
	src: url(../font/mr.otf);
}
:root {
  /* 导航高度 */
  --header-height: 72px;
  /* COLOR */
  --color-active: #3C323A;
  --color-blue-004: #3C323A;
  --color-blue-095: #095cae;69
  --color-blue-163: #163494;
  --color-blue-1635: #163595;
  --color-blue-345: #345999;
  --color-red-e41: #e41313;
  --color-white: #fff;
  --color-black: #282828;
  --color-gray-f6: #f6f6f6;
  --color-gray-f4: #f4f4f4;
  --color-gray-eee: #eee;
  --color-gray-ddd: #ddd;
  --color-gray-bbb: #bbb;
  --color-gray-999: #999;
  --color-gray-666: #666;
  --color-gray-444: #444;
  --color-gray-333: #333;
  /* --- font40以下 */
  --font12: clamp(12px, 0.12rem, 12px);
  --font14: clamp(12px, 0.14rem, 14px);
  --font15: clamp(12px, 0.15rem, 15px);
  --font16: clamp(13px, 0.16rem, 16px);
  --font17: clamp(13px, 0.17rem, 17px);
  --font18: clamp(14px, 0.18rem, 18px);
  --font20: clamp(15px, 0.2rem, 20px);
  --font22: clamp(16px, 0.22rem, 22px);
  --font24: clamp(17px, 0.24rem, 24px);
  --font26: clamp(18px, 0.26rem, 26px);
  --font28: clamp(18px, 0.28rem, 28px);
  --font30: clamp(20px, 0.3rem, 30px);
  --font32: clamp(20px, 0.32rem, 32px);
  --font34: clamp(22px, 0.34rem, 34px);
  --font36: clamp(22px, 0.36rem, 36px);
  --font38: clamp(24px, 0.38rem, 38px);
  /* --- font40 */
  --font40: clamp(23px, 0.4rem, 40px);
  --font42: clamp(24px, 0.42rem, 42px);
  --font44: clamp(24px, 0.44rem, 44px);
  --font46: clamp(25px, 0.46rem, 46px);
  --font48: clamp(26px, 0.48rem, 48px);
  /* --- font50 */
  --font50: clamp(28px, 0.5rem, 50px);
  --font52: clamp(28px, 0.52rem, 52px);
  --font54: clamp(28px, 0.54rem, 54px);
  --font56: clamp(28px, 0.56rem, 56px);
  --font58: clamp(29px, 0.58rem, 58px);
  /* --- font60 */
  --font60: clamp(30px, 0.6rem, 60px);
  --font62: clamp(31px, 0.62rem, 62px);
  --font64: clamp(31px, 0.66rem, 64px);
  --font66: clamp(31px, 0.66rem, 66px);
  /* --- font70以及以上 */
  --font70: clamp(32px, 0.7rem, 70px);
  --font72: clamp(32px, 0.72rem, 72px);
  --font74: clamp(32px, 0.74rem, 74px);
  --font80: clamp(32px, 0.8rem, 80px);
  --font100: 1rem;
  --font120: 1.2rem;
  --font160: 1.6rem;
  --font230: 2.3rem;
}
@media (max-width: 1580px) {
  :root {
    --header-height:72px;
  }
}
/* 公共字体 */
.font12 {
  font-size: var(--font12);
}
.font14 {
  font-size: var(--font14);
}
.font15 {
  font-size: var(--font15);
}
.font16 {
  font-size: var(--font16);
}
.font18 {
  font-size: var(--font18);
}
.font20 {
  font-size: var(--font20);
}
.font22 {
  font-size: var(--font22);
}
.font24 {
  font-size: var(--font24);
}
.font26 {
  font-size: var(--font26);
}
.font28 {
  font-size: var(--font28);
}
.font30 {
  font-size: var(--font30);
}
.font32 {
  font-size: var(--font32);
}
.font34 {
  font-size: var(--font34);
}
.font36 {
  font-size: var(--font36);
}
.font38 {
  font-size: var(--font38);
}
.font40 {
  font-size: var(--font40);
}
.font42 {
  font-size: var(--font42);
}
.font44 {
  font-size: var(--font44);
}
.font46 {
  font-size: var(--font46);
}
.font48 {
  font-size: var(--font48);
}
.font50 {
  font-size: var(--font50);
}
.font52 {
  font-size: var(--font52);
}
.font54 {
  font-size: var(--font54);
}
.font56 {
  font-size: var(--font56);
}
.font58 {
  font-size: var(--font58);
}
.font60 {
  font-size: var(--font60);
}
.font62 {
  font-size: var(--font62);
}
.font64 {
  font-size: var(--font64);
}
.font66 {
  font-size: var(--font66);
}
.font70 {
  font-size: var(--font70);
}
.font72 {
  font-size: var(--font72);
}
.font72 {
  font-size: var(--font74);
}
.font80 {
  font-size: var(--font80);
}
.font100 {
  font-size: var(--font100);
}
.font120 {
  font-size: var(--font120);
}
.font160 {
  font-size: var(--font160);
}
.font230 {
  font-size: var(--font230);
}
html {
  font-size: calc(100vw/19.2);
  -webkit-text-size-adjust: 100%;
  -ms-text-size-adjust: 100%;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
@media (min-width: 1901px) {
  html {
    font-size: 100px;
  }
}
@media (max-width: 1580px) {
  html {
    font-size: calc(100vw / 21);
  }
}
@media (max-width: 1280px) {
  html {
    font-size: calc(100vw / 19.3);
  }
}
@media (max-width: 767px) {
  html {
    font-size: calc(100vw/15);
  }
}
@media (max-width: 480px) {
  html {
    font-size: calc(100vw/7.5);
  }
}
h1 {
	font-size: var(--font72);
	line-height: 1;
	font-weight: bold;
	color: #3C323A;
}
h2{
	font-size: var(--font48);
	line-height: 1.1666;
	font-weight: bold;
	color: #3C323A;
}
h3{
	font-size: var(--font32);
	line-height: 1.5;
	color: #3C323A;
}
h4{
	font-size: var(--font24);
	line-height: 1.5;
}
h5{
	font-size: var(--font20);
	line-height: 1.5;
}
p{
	font-size: var(--font18);
	line-height: 1.44;
	color: #605036;
	margin-bottom: 1em;
}
html, body, div, span, iframe, map, font, img, a img, samp, hr, h1, h2, h3, h4, h5, h6, b, p, blockquote, a, address, code, dl, dt, dd, ol, ul, li, form, label, table, tr, td, th,textarea{ padding: 0; margin: 0; border: 0; font-weight: normal; font-family:'mr';  list-style:none;}
html, body { position: relative; height: 100%;}
body { font-family: 'mr'; font-size: 16px; color: #3C323A; background: #f8f5ee; overflow-x: hidden; padding-top: 72px;}
body::-webkit-scrollbar { width:2px;}
body::-webkit-scrollbar-track { background: rgba(232, 232, 232, 1);}
body::-webkit-scrollbar-thumb { background: #3C323A;}
img{ border:0; max-width: 100%; }
input,button,a { outline: none;}
a{ text-decoration:none; color:#3C323A;  }
a:hover{ color:red;  }
.clear { clear:both;}
.clearfix { zoom:1;}
.clearfix:after { content:''; display:block; height:0; clear:both;}
div { box-sizing:border-box;}
.dn { display: none;}
#screen { display: none; position: fixed; left: 0; top: 0; width: 100%; height: 100%; z-index: 10; background: rgba(0,0,0,0.5);}
/*通用样式*/
.container {
 width: 1200px;
 max-width: 92%;
 margin: 0 auto;
}
h2 { font-family: 'mb';}

.fcc {display: flex;display: -webkit-flex;justify-content: center;align-items: center;}
.fsc {display: flex;display: -webkit-flex;justify-content: flex-start;align-items: center;}
/*通用样式*/
.menuBtn { display: none;}
.logo { position: relative;}
.logo img { display: block; width: 204px; transition: all 0.5s;}

.header { background: #ffffff; height: var(--header-height); transition: all 0.5s; position: fixed; left: 0; top: 0; width: 100%; z-index: 20; display: flex; padding: 0 45px; justify-content: space-between; align-items: center;}
.headerCont { width: 92%; max-width: 1500px; margin: 0 auto; display: flex; align-items: center; justify-content: space-between;}
.small-header .header { transform: translateY(-100%);}
.show-header .header { transform: translateY(0);}
.small-header .header{ box-shadow: 0 0 10px rgba(0,0,0,0.2); background: #ffffff;}
.header:hover { background: #ffffff;}

.header:hover .searchEnter,.small-header .header .searchEnter { background: url(../images/blackSearch.png) center no-repeat;}
.header .nav li h2 a:hover { color: #7F3611;}
.nav>ul{ display: flex; justify-content: center; align-items: center;}
.nav li { position: relative; display: flex; justify-content: center; align-items: center; margin-right: clamp(20px,.64rem,64px);}
.nav li::after { content: ''; position: absolute; bottom: -15px; width: 100%; height: 15px;}
.nav li:last-child { margin-right: 0;}
.nav li h2 { height: 42px; line-height: 42px; position: relative;}
.nav li h2::after { content: ''; height: 2px; position: absolute; bottom: 0; left: 50%; transform: translateX(-50%); transition: all 0.5s; width: 0; background: #7F3611;}
.nav li.cur h2::after { width:100%;}
.nav li h2 a { display: block; transition: all 0.5s; line-height: 42px; white-space: nowrap; font-size: clamp(16px,.18rem,18px); color: #605036;}
.header .nav li.cur h2 a,.nav li:hover h2 a { color: #7F3611;}
.nav li { position: relative;}
.nav li dl { padding:4px 12px; box-sizing: border-box; display: none; width:160px; background: #ffffff; position: absolute;  top:57px; left: -12px; text-align: left;}
.nav li dt {  margin-bottom: 20px;}
.nav li dt:last-child { margin-bottom: 0;}
.nav li dt a { font-size: clamp(14px,.16rem,16px); line-height:1.5; position: relative; padding-bottom: 4px; display: block; transition: all 0.3s;}
.nav li dt a::after { content: ''; left: 0; transition: all .4s; position: absolute; bottom: 0; height: 2px; width: 0; background: #7F3611;}
.nav li dt:hover>a { color: #7F3611; }
.nav li dt:hover a::after{ width: 100%; }
.menuControl { display: flex; gap: 26px; align-items: center;}

.langChose h2 { font-family: 'anr'; font-size: var(--font16); display: flex; align-items: center;
 line-height: 42px; color: #3C323A; background-size: 24px;}
 .langChose h2 img { display: block; width: 24px; transform: translateY(1px);}
.langChose h2 span { display: block;}
.langChose { cursor: pointer; position: relative; height: var(--header-height); display: flex; align-items: center;}
.langChose dl { box-sizing: border-box; padding: 4px 14px; overflow: hidden; box-shadow:0 0 10px rgba(0,0,0,0.1); display: none; background: #ffffff; border-radius:0 0 4px 4px; text-align: center; width: 50px; position: absolute; top:var(--header-height); left: 50%; transform: translateX(-50%);}
.langChose dt a{ position: relative; transition: all .5s; line-height: 1.5; padding-bottom: 4px; display: block; font-size: 14px; color: #3C323A;}
.langChose dt a::after { content: '';height: 2px; position: absolute; bottom: 0; left: 50%; transform: translateX(-50%); transition: all 0.5s; width: 0; background: #3C323A;}
.langChose dt.cur a::after { width: 100%;}
.langChose dt:not(:last-child) { margin-bottom: 8px;}
.langChose:hover dl { display: block;}
.header .searchEnter:hover { background: url(../images/searchon.png) center no-repeat;}
.headerRight { display: flex; gap: 1.12rem; align-items: center;}

/*banner*/
.banner { position: relative; overflow: hidden;max-width:1920px; margin:0 auto;}
.banner .swiper { width: 100%;}
.bannerImg { position: relative; float: right; border-radius: 0 0 0 .64rem; overflow: hidden; width: 66.56%; max-width: 1278px;}
.banner video { aspect-ratio: 1278/852; object-fit: cover; display:block; width: 100%;}
.bannerImg>img { display: block; width: 100%;}
.bannerImg .swiper-slide video { display: block; object-fit: cover; width: 100%; aspect-ratio: 1278/852;}
.bannerImg .bannerControl { display: none;}
.banner .swiper-slide img{ display: block; width: 100%;}
.banner .swiper-slide { overflow: hidden;}
.banner .swiper-pagination { text-align: left; left: 50%; bottom: 7.3vw; width: 1400px; transform: translateX(-50%);}
.banner .swiper-pagination span { opacity: 1; transition: all 0.3s; box-sizing: border-box; border: 2px solid #ffffff; background: none; outline: none; width: 16px; height: 16px; margin:0 18px 0 0!important;}
.banner .swiper-pagination span.swiper-pagination-bullet-active{ background: #ffffff;}
.bannerText { position: absolute; width: 100%; text-align: center; top: 50%; left: 0; transform: translateY(-50%);}
.bannerText p { font-size: 3.125vw; color: #ffffff;}
.bannerControl { z-index: 2; position: absolute; width: 373px; height: 54px; display: flex; justify-content: space-between; position: absolute; right: 0; bottom: 0; background: #E5B177;
padding: 0 64px;  align-items: center;}
.bannerButton { display: flex; gap:8px;}
.bannerControl a { color: #7F3611;}
.bannerButton span { width:30px; cursor: pointer; display: block; transition: all .4s;}
.bannerButton span:hover { opacity: .7;}
.bannerInt { align-items: start; z-index: 2; display: flex; flex-direction: column; gap: .28rem; position: absolute; left: 10.9%; bottom: .88rem;}
.bannerInt h2 { font-weight: bold; font-size: var(--font72); color: #3C323A; line-height: 1;}
.bannerInt p {width: 70%; color: #605036;  font-size: var(--font18); line-height: calc(1em + .1rem); max-width: 368px;}
.bannerInt a { font-size: 18px; color: #7F3611; align-items: center; transition: all .4s; display: inline-flex; padding: 0 14px; line-height: 44px; background: #E5B177; gap: 48px;}
.bannerInt a img { transition: all .4s; display: block; width: 16px!important;}
.bannerInt a:hover { color: #ffffff; background: #7F3611;}
.bannerInt a:hover img {filter: brightness(0) invert(1);}
/*inBanner*/

.page-banner { position: relative; overflow: hidden;background:#000;}
.page-banner .img img { width: 100%; display: block; height: 100%; min-height: 200px; object-fit: cover;}
.page-banner:before { content: ''; position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.2); z-index: 2;}
.inText { z-index: 3; position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%);}
.inText h2 { color: #ffffff; font-weight: bold; line-height: 1; margin-bottom: .2rem; font-size:var(--font60); -webkit-animation-duration: 0.8s; animation-duration: 0.8s;-webkit-animation-fill-mode: both;animation-fill-mode: both; -webkit-animation-name: h-line-mask-anim;animation-name: h-line-mask-anim;}
.inText p { color: #ffffff;line-height: 1.4; margin-bottom: .32rem; font-size: var(--font20);-webkit-animation-duration: 0.8s; animation-duration: 0.8s;-webkit-animation-fill-mode: both;animation-fill-mode: both; -webkit-animation-name: h-line-mask-anim;animation-name: h-line-mask-anim;animation-delay: .2s;}
@-webkit-keyframes h-line-mask-anim {
  0% {
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
    -webkit-clip-path: polygon(-10% -100%, 110% -100%, 110% 0%, -10% 0%);
    clip-path: polygon(-10% -100%, 110% -100%, 110% 0%, -10% 0%);
  }
  100% {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    -webkit-clip-path: polygon(-10% 0%, 110% 0%, 110% 110%, -10% 110%);
    clip-path: polygon(-10% 0%, 110% 0%, 110% 110%, -10% 110%);
  }
}
@keyframes h-line-mask-anim {
  0% {
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
    -webkit-clip-path: polygon(-10% -100%, 110% -100%, 110% 0%, -10% 0%);
    clip-path: polygon(-10% -100%, 110% -100%, 110% 0%, -10% 0%);
  }
  100% {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    -webkit-clip-path: polygon(-10% 0%, 110% 0%, 110% 110%, -10% 110%);
    clip-path: polygon(-10% 0%, 110% 0%, 110% 110%, -10% 110%);
  }
}
/*footer*/
.footer { background: #4A2410;}
.footerTop { align-items: center; padding: 64px 0; display: flex; justify-content: space-between;}
.footLeft p {color: #F7DEB9; font-weight: bold; font-size: 20px; line-height: 1.5; margin-bottom: 8px;}
.footLeft span { opacity: .8; display: block; font-size: 18px; line-height: calc(1em + 10px); color: #F7DEB9;}
.footerContact { text-align: right;}
.footerContact h3,.footLink h3 { line-height: 1; color: #ffffff; font-size:20px; font-weight: 500; margin-bottom: 8px;}
.footerContact p { font-size: 18px; font-weight: 400; color: #ffffff80; line-height: calc(1em + 10px);}
.footLink a { transition: all .4s; margin-right: 17px; display: inline-flex; font-size: 18px; line-height: 26px; padding: 8px 7px; color: #ffffff; font-weight: 500;}
.footLink a:last-child { margin: 0;}
.copyRight { border-top: 1px solid #ffffff20; line-height:68px; display: flex; justify-content: space-between; align-items: center;}
.copyFlex { padding: 22px 0; display: flex; justify-content:center; gap: 24px; align-items: center;}
.copyRight p,.copyRight p a { font-size: 16px;  color: #F7DEB9; transition: all .4s;}
.copyRight p a:hover { color: #ffffff;}
.linkList a:hover { color: #7F3611;}
.footLogo { width: 204px; margin-bottom: 46px;}
.privacy a { font-size: 18px; color: #F7DEB9; line-height: calc(1em + 10px);}
.privacy { display: flex; gap: 33px;}
.bottomText { margin-bottom: 32px;}
.footerContact p { margin-bottom: 37px; color: #F7DEB9; font-size: 20px; line-height: 1.5;}
.soshowlink { display: flex; justify-content: space-between; align-items: center; gap:24px}
.soshowlink a.footAbout { font-size: 18px; line-height: 42px; padding: 0 24px; background: #E5B177; color:#7F3611; border-radius: 4px;}
.linkFlex { display: flex; align-items: center; gap:32px}
.linkFlex img { display: block;}
/**/
.power { padding: 88px 0;}
.powerDesc { display: flex; justify-content: space-between; gap: 64px;}
.descCont { width: 706px;}
.descCont span { display: block; line-height: 1; font-size: 18px; color: #605036; line-height: calc(1em + 10px); margin-bottom: .16rem;}
.descCont h2 { margin-bottom: .64rem;}
.descCont p { margin-bottom: 1em;}
.descCard { width: 35.8333%;}
.descArt { padding: 32px 24px 0;}
.descArt h2 { color: #3C323A; font-weight: bold;}
.descArt p { color: #605036; font-size: var(--font18); line-height: calc(1em + .1rem);}
.powerDesc .descCard { text-align: right;}
.subDesc { display: flex; justify-content: space-between;}
.subDesc .descCard:nth-child(1) { width: 35.8333%;}
.subDesc .descCard:nth-child(2) { padding-top: 88px; width: 53.33333%;}
.category { padding: 88px 0;}
.titleCell h2 { color: #3C323A;}
.categoryList ul { margin-top: 64px; gap: 64px; display: flex; justify-content: space-between;}
.categoryList li { border-radius: 24px; flex: 1; box-sizing: border-box; padding: 24px 48px 66px;}
.categoryList li h3 { color:#3C323A; font-weight: bold; font-size: 32px; line-height: 1; margin-bottom: 24px; text-align: center;}
.categoryList li:nth-child(1) { background: #F5E1EC;}
.categoryList li:nth-child(2) { background: #DCE2F2;}
.categoryList li .categoryImg img { display: block; width: 100%; aspect-ratio: 472/350; object-fit: cover; border-radius: 24px;}
.categoryList dl { margin-top: 64px;}
.categoryList dt { position: relative; border-radius: 16px; overflow: hidden;}
.categoryList dt a { transition: all .4s; background: #E5B177; color: #7F3611; font-size: 18px; line-height: 42px; display: inline-flex; gap: 44px; align-items: center; padding: 0 14px; border: 1px solid #E5B177; border-radius: 2px;}
.categoryList li a { transition: all .4s; color: #3C323A; font-size: 18px; line-height: 42px; display: inline-flex; gap: 44px; align-items: center; padding: 0 14px; border: 1px solid #3C323A; border-radius: 2px;}
.categoryList li a img,.categoryList dt a img { width: 16px; transition: all .4s;}
.categoryList li a:hover { color: #ffffff; background: #7F3611; border:1px solid #7F3611;}
.categoryList dt a:hover { background: #ffffff; border:1px solid #ffffff;}
.categoryList li a:hover img{filter: brightness(0) invert(1);}
.categoryList dl { display: flex; gap: 16px; justify-content: space-between;}
.categoryList dt { width: 39.33%; height: 712px; background-size: cover!important; background-position: center!important; background-repeat: no-repeat;  transition: all .4s;}
.categoryList dt.act {width:59.33%; flex: none;}
.categoryList dt .categoryImg img { height:712px!important; width: 100%; object-fit: cover;}
.categoryDesc { margin-top: 24px; min-height: 228px;}
.categoryDesc p { margin-bottom: 28px;}
.postText { background-image: linear-gradient(to bottom,rgba(52,17,0,0),rgba(52,17,0,.8)); padding: 0 48px 24px; position: absolute; left: 0; bottom: 0; width: 100%;}
.categoryList dt h3 { color: #ffffff; font-weight: bold; font-size: 32px; line-height: 1.5; margin-bottom: 16px;}
.categoryList dt .categoryDesc p { color: #ffffff;}
.categoryList dt .categoryDesc { min-height:auto!important; height: auto;}
.titleCell p { margin-top: 24px; font-size: 18px; line-height: calc(1em + 10px); color: #605036;}
.gellarySwiper .swiper-slide img { display: block; width: 100%; object-fit: cover; aspect-ratio: 446/670; transition: all .8s;}
.gellarySwiper .swiper-slide{overflow: hidden;}
.gellarySwiper .swiper-slide:hover img { transform: scale(1.1);}
.gellarySwiper { margin: 32px auto;}
.gellarySwiper .swiper-button-prev,.gellarySwiper .swiper-button-next { color: #494542; transition: all .4s; font-size: 20px;}
.gellarySwiper .swiper-button-prev:hover,.gellarySwiper .swiper-button-next:hover { color: #7F3611;}
.gellarySwiper .swiper-button-prev:after,.gellarySwiper .swiper-button-next::after { font-size: 30px;}
.centerMore { text-align: center;}
.centerMore a { transition: all .4s; color: #3C323A; font-size: 18px; line-height: 42px; display: inline-flex; gap: 44px; align-items: center; padding: 0 14px; border: 1px solid #3C323A; border-radius: 2px;}
.centerMore a img { width: 16px; transition: all .4s;}
.centerMore a:hover { color: #ffffff; background: #7F3611; border:1px solid #7F3611;}
.centerMore a:hover img {filter: brightness(0) invert(1);}
.gellary { padding-bottom: 55px;}
.keyFeature {padding: 88px 0;}
.featureList ul { margin-top: 48px; display: flex; justify-content: space-between; gap: 24px;}
.featureList li { border-radius: 8px; transition: all .4s; background: #F6EEDE; flex: 1; box-sizing: border-box; text-align: center; padding: 16px 0;}
.featureList img { width: 68px; display: block; margin: 0 auto 16px;}
.featureList h5 {font-weight: bold; margin-bottom: 8px;}
.featureList p { font-size: 18px; line-height: calc(1em + 10px);color: #605036;}
.featureList li:hover { transform: translateY(-10px); box-sizing: 0 10px 10px rgba(0,0,0,0.1);}
.brochure { background: #F6EEDE; padding: 88px 0;}
.brochure li { padding: 16px 24px; display: flex; justify-content: space-between; align-items: center; border: 1px solid #E8DDD2; border-radius: 8px;}
.brochure ul { margin-top: 48px; padding: 24px; background: #ffffff; border-radius: 8px; display: flex; flex-direction: column; gap: 24px;}
.brochure li p {   color: #3C323A; max-width: calc(100% - 150px); display: flex; align-items: center;}
.brochure li p img { width: 20px; display: block; margin-right: 8px;}
.brochure a { color: #605036; font-size: 16px; display: flex; align-items: center; gap: 5px;}
.brochure a img { display: block; width: 12px;}
/**/
.category_show { padding: .64rem 0 .88rem;}
.category_Tit { display: flex; align-items: center; gap: 16px;}
.category_Tit a { display: block; padding: 0 14px; line-height: 44px; font-size: 18px; color:#7F3611;}
.category_Tit a.cur { background: #E5B177;}
.category_Tit h2 { font-weight: bold; font-size: var(--font72); color: #3C323A; margin-bottom: .64rem;}
.categoryFlex { display: flex;  justify-content: space-between;}
.categoryMenu { width: 100%; margin-top: 20px;}
.categoryMenu ul { display: flex; flex-wrap: wrap; gap: 16px;}
.categoryMenu li { overflow: hidden; transition:all .4s; cursor: pointer; width: calc((100% - 48px)/4); box-sizing: border-box; position: relative;}
.categoryMenu li:hover { box-shadow: 0 0 10px #3C323A;}

.categoryMenu li img { transition: all .4s; display: block; width: 100%; aspect-ratio: 1/1;}
.categoryMenu li:hover img { transform: scale(1.2);}
.categoryMenu li h5 { position: absolute; top: 50%; z-index: 2; transform: translateY(-50%); left: 0; width: 100%; text-align: center; color: #ffffff;}
.categorySlide { width: calc(50% - 51.5px); position: relative;}
.categoryMenu li:last-child { margin: 0;}
.categorySwiper .swiper-slide img { display: block; width: 100%;}
.categoryGroup { display: flex; justify-content: space-between;}
.categorySwiper { position: relative;}
.categorySwiper p { position: absolute; bottom: 16px; width: 100%; z-index: 2; color: #ffffff; left: 0; font-size: 32px; padding: 0 24px; box-sizing: border-box; font-weight: bold;}
/* 右侧固定侧边栏 */
.fixSidebar { max-width: 100%; position: fixed; top: 0; right: -100%; width: 540px; height: 100vh; background: #fff; box-shadow: -4px 0 20px rgba(0,0,0,0.08); z-index: 999; display: flex; flex-direction: column; overflow-y: auto; overflow-x: hidden; }
.fixSidebar::-webkit-scrollbar { width: 4px; }
.fixSidebar::-webkit-scrollbar-track { background: transparent; }
.fixSidebar::-webkit-scrollbar-thumb { background: #d9c4a8; border-radius: 2px; }
.fixSidebar::-webkit-scrollbar-thumb:hover { background: #c4a882; }
.fixSidebar .sidebarInner { padding: 24px; flex: 1; }
.fixSidebar h3 { font-size: 48px; font-weight: bold; line-height: 72px; color: #222; margin: 0 0 16px 0; }
.fixSidebar .formRow { display: flex; gap: 16px; margin-bottom: 24px; }
.fixSidebar .formCol { flex: 1; }
.fixSidebar .formCol.full { width: 100%; margin-bottom: 24px; }
.fixSidebar .formCol>label { display: block; font-size: 18px; color: #3C323A; line-height: calc(1em + 10px); margin-bottom: 8px; font-weight: 500; }
.fixSidebar label span.required { color: #e74c3c; margin-left: 2px; }
.fixSidebar input,
.fixSidebar select { width: 100%; height: 40px; border: 1px solid #E8DDD2; border-radius: 4px; padding: 0 12px; font-size: 16px; color: #3C323A; background: #fff; outline: none; box-sizing: border-box; transition: border-color 0.2s; }
.fixSidebar input:focus,
.fixSidebar select:focus,.mesArea:focus { border-color: #e5b177; background: #fff; }
.fsCheckList { display: flex; flex-wrap: wrap; gap: 8px 24px; margin-top: 4px;}
.fsCheckList li { width: calc(50% - 12px); }
.fsCheckList input { position: absolute; opacity: 0; width: 0; height: 0; }
.fsCheckList label { display: inline-flex; color: #3C323A; align-items: center; gap: 6px; cursor: pointer; font-size: 16px; line-height: 1.5; color: #555; position: relative; padding-left: 22px;}
.fsCheckList label::before { content: ''; position: absolute; left: 0; top: 50%; transform: translateY(-50%); width: 16px; height: 16px; background: url(../images/ccheck.png) no-repeat center/contain; }
.fsCheckList input:checked + label::before { background-image: url(../images/cchecked.png); }
.fixSidebar input::placeholder { color: #8E7A6B; font-size: 16px; }
.fixSidebar select { cursor: pointer; appearance: none; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath d='M0 0l5 6 5-6z' fill='%23999'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 12px center; padding-right: 28px; }
.fixSidebar .sidebarFoot { flex-direction: column; padding: 20px 24px; display: flex; align-items: center; justify-content: space-between; }
.contactType { width: 100%; display: flex; align-items: center; margin-bottom: 10px; justify-content: space-between;}
.contactType ul { gap: 10px; display: flex;}
.contactType p { color: #8E7A6B; font-size: var(--font18);}

.contactType li a { display: flex; justify-content: center; align-items: center; height: 40px; width: 40px; border-radius: 50%;}
.contactType li:nth-child(1) a{ transition: all .4s; background: #F3C5C7;}
.contactType li:nth-child(2) a{ transition: all .4s; background: #CDEBF6;}
.contactType li:nth-child(3) a{ transition: all .4s; background: #98F6A2;}
.contactType li a img { max-width: 50%; transition: all .4s;}
.contactType li a:hover { background: #7F3611;}
.contactType li a:hover img {filter: brightness(0) invert(1);}
.fixSidebar .shippingTip { font-size: 18px; color: #8E7A6B; margin-bottom: 0; }
.fixSidebar .submitBtn { width: 100%; padding: 0 32px; height: 44px; background: #E5B177; color: #7F3611; border: none; border-radius: 4px; font-size: 22px; cursor: pointer; transition: background 0.2s; }
.fixSidebar .submitBtn:hover { background: #7F3611; color: #ffffff; }
.mesArea { border: 1px solid #DDDDDD; transition: all .4s; outline: none; padding: 6px 8px; resize: none; box-sizing: border-box; border-radius: 8px; width: 100%; height: 84px;}
.mesArea::placeholder { color: #8E7A6B;}
/**/
.categoryArt { margin-top: 64px; display: flex; gap: 48px; padding: 48px; border-radius: 24px;background: #DCE2F2;}
.categoryArt .categoryImg { width: 472px; }
.categoryArt .categoryImg img { aspect-ratio: 472 / 350; object-fit: cover; display: block; width: 100%;}
.categoryArt .categoryDesc { flex: 1;}
.categoryDesc h2 { font-size: 32px; font-weight: bold; color: #3C323A; margin-bottom: 24px;}
.categoryDesc p { color: #3C323A; font-size: 18px;}
.artDesc { align-items: start; display: flex; flex-direction: column; justify-content: space-between; max-width: calc(100% - 496px);}
.artDesc a { display: inline-flex; transition: all .4s;border: 1px solid #3C323A; align-items: center; gap: 48px; color: #3C323A; font-size: 18px; line-height: 28px;
padding: 8px 14px;}
.artDesc a img { width: 16px; transition: all .4s;}
.artDesc a:hover { border: 1px solid #7F3611; background: #7F3611; color:#ffffff;}
.artDesc a:hover img { filter: brightness(0) invert(1);}
/* 联系弹窗 */
.contactOverlay { display: none; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.5); z-index: 1100; justify-content: center; align-items: center; }
.contactOverlay.show { display: flex; }
.contactModal { width: 600px; background: #F8F5EE; border-radius: 8px; padding:32px; position: relative; box-shadow: 0 10px 40px rgba(0,0,0,0.15); }
.contactModal h2 { font-size: 48px; font-weight: 700; color: #3C323A; line-height: 1.5; margin: 0 0 40px 0; }
.contactModal .interestBox { background: #F7DEB9; border-radius: 6px; padding:24px; margin-bottom: 40px; }
.interestBox span { display: block; font-size: 20px;color: #3C323A; line-height: 1; margin-bottom: 8px;}
.contactModal .interestBox p { font-weight: 600; font-size:24px;color: #3C323A; line-height: 1; }
.contactModal .contactRow { display: flex; align-items: center; justify-content: space-between; }
.contactModal .contactTip { font-size: 20px; color: #8E7A6B;}
.contactModal .contactIcons { display: flex; gap: 10px; }
.contactModal .iconBtn { width: 50px; height: 50px; border-radius: 50%; display: flex; align-items: center; justify-content: center; cursor: pointer; transition: background 0.2s; border: none; }
.contactModal .iconBtn.phoneBg { background: #FADBD8; }
.contactModal .iconBtn.emailBg { background: #D4E6F1; }
.contactModal .iconBtn:hover { background: #7F3611; }
.contactModal .iconBtn:hover img { filter: brightness(0) invert(1); }
.contactModal .iconBtn img { transition: filter 0.2s; }
.contactModal .closeModal { position: absolute; top: 16px; right: 16px; width: 28px; height: 28px; border: none; background: none; cursor: pointer; font-size: 22px; color: #999; line-height: 1; padding: 0; }

/* 文章页 */
.articlePage { padding-top: 48px;  margin-bottom: 48px; }
.articleContent {padding:0 0 16px;}
.articleBreadcrumb { font-size: 18px; color: #666E78; margin-bottom: 48px; }
.articleBreadcrumb a{ color: #666E78;}
.articleTitle { text-align: center; font-size: 32px; font-weight: 700; color: #222; line-height: 1.4; margin-bottom: 36px; }
.articleInfor { padding: 48px 32px 0; border: 1px solid #DDDDDD;}
.articleContent { font-size: 18px; color: #605036; line-height: calc(1em + 10px); }
.articleContent p,
.articleContent li,
.articleContent span,
.articleContent strong,
.articleContent em,
.articleContent a,
.articleContent td,
.articleContent div { font-size: inherit; font-family: inherit; line-height: inherit; color: inherit; }
.articleContent p { margin-bottom: 18px; }
.articleContent strong { color: #333; }
.articleContent ul, .articleContent ol { padding-left: 20px; margin-bottom: 18px; }
.articleContent li { margin-bottom: 8px; list-style: decimal; }
.articleContent ul li { list-style: disc; }
.articleImg { margin-top: 36px; }
.articleImg img { display: block; margin:0 auto 32px; max-width: 100%; border-radius: 4px; }
.noticeBelow { text-align: center;}
.noticeBelow img { display: block; margin: 0 auto;}
.noticeBelow p { font-size: 18px; line-height: calc(1em + 10px); color: #3C323A;}
.plankDetail { padding: 0 0 88px;}
.detailSwiper { float: right; position: relative; width: 668px;}
.detailSwiper .swiper-slide img { display: block; width: 100%; aspect-ratio: 1/1; object-fit: cover;}
.postDetail { align-items: center; display: flex; justify-content: space-between; z-index: 2; position: absolute; left: 0; top: 50%; transform: translateY(-50%); width: 787px; padding: 60px 48px; background: #ffffff;}
.plankDetail ul { margin-top: 64px;}
.plankDetail li { margin-bottom: 64px; overflow: hidden; position: relative;}
.plankDetail li:last-child { margin: 0;}
.plankDetail li:nth-child(2n) .detailSwiper { float: left;}
.plankDetail li:nth-child(2n) .postDetail { left: auto; right:0}
.plankDetail .bannerControl a { display: none;}
.plankDetail .bannerControl { background: none; width: auto!important; padding: 0 10px; bottom:24px; height: auto;}
.plankDetail li:nth-child(2n) .bannerControl { right: auto; left: 0;}

.detailSwiper .prevBtn,.detailSwiper .nextBtn { cursor: pointer;  border-radius: 3px;transition: all .4s; display: flex;  background: #E5B177; border: 1px solid #E5B177;  justify-content: center; align-items: center; width: 32px;  height: 32px;}
.detailSwiper .prevBtn img,.detailSwiper .nextBtn img { width: 16px;}
.detailSwiper .prevBtn:hover,.detailSwiper .nextBtn:hover { opacity: .5;}

.postDesc { flex: 1; text-align: right;}
.descNumber span {color: #3C323A; font-weight: 500; line-height: calc(1em + 8px); display: block; font-size: 18px;}
.descNumber p { font-weight: 600;color: #7F3611; line-height: 1; font-size: 32px;}
.descNumber { position: relative; display: inline-block; padding-bottom: 14px; margin-bottom: 10px;}
.descNumber::after { content: ''; position: absolute; right: 0; bottom: 0; height: 1px; width: 130px; background: #E8DDD2;}
.descSystem p { font-size: 48px; line-height: calc(1em + 8px); color: #7F3611;}
.descSystem { position: relative; margin-bottom: 11px;}
.descSystem::after{content: ''; position: absolute; right: 0; bottom: 0; height: 1px; width: 143px; background: #E8DDD2;}
.matt { display: flex; flex-direction: column; align-items: end;}
.matt p {font-size: 18px; line-height: calc(1em + 10px); margin-bottom: 12px;}
.mattIcon { flex-wrap: wrap; width: 184px; display: flex; gap: 8px; flex-wrap: wrap; justify-content: end;}
.mattIcon img { width:40px;}
.postImg { position: relative; width: 374px;}
.postImg p { font-weight: bold; position: absolute; color: #ffffff; left: 52px; top: 22px; font-size: 18px;}
.postImg span { position: absolute; color: #ffffff; left: 52px; font-weight: bold; bottom: 22px; font-size: 32px}
.postImg img { display: block; width: 100%;}
.detailButton { margin-top: 32px; display: flex; gap: 16px; justify-content: end;}
.detailButton a {transition: all .4s; width: auto; max-width: none; flex: 0 0 auto; padding: 0 20px; white-space: nowrap; display: inline-flex; font-size: 18px; line-height: 40px; box-sizing: border-box; justify-content: center; align-items: center;}
.detailButton a.ask { transition: all .4s; border-radius: 2px; color: #3C323A;  border: 1px solid #3C323A;}
.detailButton a.buy { background: #E5B177; color: #7F3611;border: 1px solid #E5B177;}
.detailButton a:hover { color: #ffffff; background: #7F3611; border: 1px solid #7F3611;}
/**/
.inspirationType { display: flex; justify-content: end; align-items: center; gap: 30px; overflow: hidden; margin-bottom: 42px;}
.inspirationType span { cursor: pointer;}
.inspirationType span img{ opacity: .7; display: block; width: auto; height: 30px; }
.inspirationType span.cur img{ opacity: 1;}
.inspirationList { padding: 84px 0;}
.insDesc {background: #F6EEDE;width: 742px;padding:24px 48px;}
.insImg img { display: block; width: 100%;}
.insImg { width: 896px; max-width: 100%;}
.insDesc h4 { color: #3C323A; font-weight: 600; margin-bottom:24px;}
.insDesc p { min-height: 3em; font-size: var(--font18); color: #8E7A6B;}
/* .insDesc a { display: inline-flex; align-items: center; margin-top: 48px; padding: 8px 14px; border: 1px solid #E8DDD2; transition: all .4s; gap: 50px; color: #3C323A;
font-size: 18px; line-height: calc(1em + 10px);}
.insDesc a img { width: 16px; display: block; transition: all .4s;}
.insDesc a:hover {color: #ffffff; background: #7F3611; border: 1px solid #7F3611;}
.insDesc a:hover img {filter: brightness(0) invert(1);} */
.insDesc { float: right; max-width: 90%; margin-top: -127px; position: relative; z-index: 2;}
.insDesc span { display: block; color: #8E7A6B; font-size: var(--font16); line-height: 1.5; margin-top: 1.5em;}
.inspirationList li::after { content: ''; clear: both; display: block; height: 0;}
.inspirationList li { margin-bottom: 86px;}
.inspirationList li:nth-child(2n) .insImg{margin-left: calc(100% - 896px);}
.inspirationList li:nth-child(2n) .insDesc { float: left;}
.inspirationList .act li { display: flex;}
.inspirationList .act li .insDesc { align-items: start; display: flex; flex-direction: column; justify-content: space-between; margin: 0; padding: 48px 48px 48px 116px;}
.inspirationList .act .insImg { margin: 0!important; width: 600px;}
.inspirationList .act .insImg img { aspect-ratio: 60/34; object-fit: cover;}
/**/
.partnerCont { padding: 88px 0;}
.partnerDesc p { color: #605036; font-size: 18px; line-height: calc(1em + 10px);}
.partnerDesc { margin: 24px auto 48px;}
.partnerForm { background: #F7DEB9; border-radius: 12px; padding: 36px 40px 32px; margin-top: 48px; }
.partnerForm .pfRow { display: flex; gap: 20px; margin-bottom: 20px; }
.partnerForm .pfRow.pfFoot { align-items: center; justify-content: space-between; margin-bottom: 0; margin-top: 28px; }
.partnerForm .pfCol { flex: none; }
.partnerForm .pfCol.pfCompany { width: 536px; }
.partnerForm .pfCol.pfPerson { flex: 1; }
.partnerForm .pfCol.pfFull { width: 536px; }
.partnerForm .pfCol.pfInterest { width: 536px; }
.partnerForm .pfRow:not(.pfFoot) .pfCol:not(.pfCompany):not(.pfFull):not(.pfInterest) { width: 252px; }
.partnerForm label { display: block; font-size: 18px; line-height: calc(1em + 10px); color: #3C323A; margin-bottom: 8px; font-weight: 500; }
.partnerForm label span.required { color: #C66F28; margin-left: 2px; }
.partnerForm input,
.partnerForm textarea { width: 100%; height: 42px; border: 1px solid #D4C4A8; border-radius: 4px; padding: 0 14px; font-size: 15px; color: #3C323A; background: none; outline: none; box-sizing: border-box; transition: border-color 0.2s; }
.partnerForm textarea { height: 90px; padding: 12px 14px; resize: none; line-height: 1.6; }
.partnerForm input::placeholder,
.partnerForm textarea::placeholder { color: #B8A88E; }
.partnerForm input:focus,
.partnerForm textarea:focus { border-color: #B8976F; }
.partnerForm .pfNameRow { display: flex; gap: 16px; }
.partnerForm .pfNameRow input { width: 252px; }
.partnerForm .pfRadio { display: flex; align-items: center; gap: 18px; font-size: 18px; color: #3C323A; }
.partnerForm .pfRadio span { color: #605036; margin-right: 4px; }
.partnerForm .pfRadio label { font-size: 18px; display: flex; align-items: center; gap: 8px; margin-bottom: 0; cursor: pointer; font-weight: normal; color:#3C323A; }
.partnerForm .pfRadio input[type="radio"] { width: 18px; height: 18px; opacity: 0; position: absolute; margin: 0; z-index: 1; }
.partnerForm .pfRadio label::before { content: ''; display: inline-block; width: 18px; height: 18px; background: url(../images/check.png) no-repeat center / contain; flex-shrink: 0; transition: background 0.2s; }
.partnerForm .pfRadio input[type="radio"]:checked + label::before { background-image: url(../images/checked.png); }
.partnerForm .pfSubmit { padding: 0 44px; transition: all .4s; height: 44px; background: #E5B177; color: #7F3611; border: none; border-radius: 4px; font-size: 16px; font-weight: 600; cursor: pointer; transition: background 0.2s; white-space: nowrap; }
.partnerForm .pfSubmit:hover { background: #7F3611; color: #ffffff; }

/* FAQ 页面 */
.faqTop { background: #f8f5ee; padding: 88px 0; }
.faqTopInner { display: flex; justify-content: space-between; align-items: flex-start; gap: 60px; }
.faqLeft { flex: 1; max-width: 480px; }
.faqLeft h2 { font-size: 48px; font-weight: 700; color: #3C323A; line-height: 56px; margin-bottom:48px; }
.faqLeft p { font-size: 18px; color: #605036; line-height: 1.8; }
.faqRight { width: 568px; flex-shrink: 0; }
.contactCard { display: flex; align-items: center; gap:24px; padding: 56px 48px; border-radius: 12px; margin-bottom: 48px; }
.contactCard:last-child { margin: 0;}
.contactCard.cardPink { background: #F5E1EC; }
.contactCard.cardYellow { background: #F7DEB9; }
.ccIcon { width: 96px; height: 96px; border-radius: 50%; display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
.cardPink .ccIcon { background: #FF8D7E; }
.cardYellow .ccIcon { background: #E5B177; }
.cardPink .ccIcon img { width:35px; }
.cardYellow .ccIcon img{ width: 46px;}
.ccInfo h4 { font-size: 24px; font-weight: 600; line-height: 1; color: #7F3611; margin: 0 0 16px 0; }
.ccInfo p { font-size: 18px; color: #3C323A; line-height: calc(1em + 10px); }
.ccInfo span { font-size: 18px; color: #3C323A; line-height: calc(1em + 10px); display: block; }
.faqBottom { background: #f6eede; padding: 80px 0; }
.faqType { white-space: nowrap; overflow-x: auto; padding-left: .4rem; margin-top: .48rem; display: flex; gap: .32rem;}
.faqType span { position: relative; padding: 0 clamp(10px,.16rem,16px); display:block; line-height: 1.8333; cursor: pointer; font-size: var(--font24); color: #8E7A6B;}
.faqType span.cur { color: #3C323A; background: #ffffff; border-radius: .16rem .16rem 0 0;}
.faqType span.cur:before { content: ''; background: url(../images/ol.svg) center no-repeat; background-size: 100% 100%; width: clamp(10px,.16rem,16px); height: clamp(10px,.16rem,16px); left: 0; position: absolute; bottom: 0; transform: translateX(-90%);}
.faqType span.cur:after { content: ''; background: url(../images/or.svg) center no-repeat; background-size: 100% 100%; width: clamp(10px,.16rem,16px); height: clamp(10px,.16rem,16px); right: 0; position: absolute; bottom: 0; transform: translateX(90%);}
.faqBox { margin-top: -.05px; border-radius: 8px; background: #ffffff; padding: 24px; }
.faqBox > h2 { padding: 0 .5em; font-size: 48px; line-height: 56px; font-weight: 700; color: #222; margin-bottom: 48px; }
.faqItem { background: #fff; border-radius: 8px; margin-bottom: 16px; overflow: hidden; }
.faqQ { display: flex; align-items: center; justify-content: space-between; padding: 16px 24px; cursor: pointer; user-select: none; }
.faqQ span { font-size: 24px; color: #3C323A; font-weight: bold; }
.faqQ .arrow { width: 16px; height: 16px; background: url(../images/down.png) no-repeat center / contain; transition: transform 0.3s; flex-shrink: 0; }
.faqItem.open .faqQ .arrow { transform: rotate(180deg); }
.faqA { display: none; padding: 0 24px 24px; }
.faqA p { font-size: 20px; color: #3C323A; line-height: 1.7; margin-bottom: 10px; }
.faqA ul { padding-left: 18px; }
.faqA li { font-size: 14px; color: #555; line-height: 1.8; list-style: disc; }

/* About Contact us */
.aboutContact { padding: 80px 0; background: #f8f5ee; }
.acLeft > h2 { font-size: 48px; line-height: 56px; font-weight: 700; color: #222; margin-bottom: 48px; }
.acInner { display: flex; gap: 50px; align-items: flex-start; }
.acLeft { width: 568px; flex-shrink: 0; }
.acRight { flex: 1; background: #ffffff;border: 1px solid #E8DDD2; padding: 32px; }
.acForm label { display: block; font-size: 18px; line-height: calc(1em + 10px); color: #3C323A; margin-bottom: 8px; font-weight: normal; }
.acForm label .required { color: #e74c3c; }
.acRow { display: flex; gap: 16px; margin-bottom: 16px; }
.acRow:nth-child(3) { margin-bottom: 14px;}
.acCol { flex: 1; }
.acCol.acWide { width: 100%; }
.acForm input, .acForm select, .acForm textarea { width: 100%; height: 40px; border: 1px solid #8E7A6B; border-radius: 4px; padding: 0 12px; font-size: 14px; outline: none; box-sizing: border-box; background: none; color: #3C323A; }
.acForm select { appearance: none; cursor: pointer; }

.acForm textarea { display: block; height:84px; box-sizing: border-box; resize: none; padding: 10px 12px; line-height: 1.5; }
.acForm input::placeholder, .acForm textarea::placeholder { color: #8E7A6B; }
.acForm input:focus, .acForm select:focus, .acForm textarea:focus { border-color: #B8976F; }
.acCheckGroup { display: flex; flex-wrap: wrap; gap: 0; }
.acCheckItem { line-height: 24px; width: 50%; margin-bottom: 8px; }
.acCheckItem input[type="checkbox"] { width: auto; height: auto; opacity: 0; position: absolute; margin: 0; z-index: 1; }
.acCheckItem label { display: inline-flex; align-items: center; gap: 6px; cursor: pointer; font-size: 13px; color: #555; margin-bottom: 0; position: relative; }
.acCheckItem label::before { content: ''; display: inline-block; width: 16px; height: 16px; background: url(../images/ccheck.png) no-repeat center / contain; flex-shrink: 0; transition: background 0.2s; }
.acCheckItem input[type="checkbox"]:checked + label::before { background-image: url(../images/cchecked.png); }
.acSendBtn { width: 100%; height: 46px; background: #D4944A; color: #7F3611; border: none; border-radius: 4px; font-size: 16px; font-weight: 600; cursor: pointer; transition: background 0.2s;}
.acSendBtn:hover { background: #c4853b; }

/* About Address */
.aboutAddress { padding: 100px 0; background: #F6EEDE; }
.aaInner { display: flex; align-items: stretch; }
.aaImg { width: 50%; flex-shrink: 0; }
.aaImg img { width: 100%; aspect-ratio: 6/4; object-fit: cover; display: block; }
.aaInfo { width: 50%; background: #fff; padding: 48px 88px; display: flex; align-items: center; justify-content: start; gap: 24px; }
.aaIcon { width: 64px; display: flex; justify-content: center; align-items: center; border-radius: 50%; background: #B5C9FF; height: 64px; margin-bottom: 16px; }
.aaIcon img { width: 40%; display: block; }
.aaInfo h3 { font-size: 48px; line-height: 72px; font-family: 'anb'; color: #3C323A; margin: 0 0 16px 0; }
.aaInfo p { font-size: 24px; color: #3C323A;  line-height: 1.5; }
.whatsCont { position: relative;}
.whatsBg { position: absolute; right: 0; top: 0; width: 50%; height: 100%; object-fit: cover;}
.whatsInfor { width: 50%; padding: 56px 68px 88px 0;}
.whatsInfor .titleCell { margin: 56px 0 48px;}
.whatsCont { background: #F6EEDE;}
.whatsCont li { display: flex; margin-bottom: 24px; align-items: center; gap: 24px;}
.whatsCont li h5 {font-weight: bold; color: #3C323A;}
.whatsCont li span { color: #605036; font-size: 18px; line-height: calc(1em + 10px);}
.whatsCont li:last-child { margin: 0;}
.whatsImg { width: 56px; min-width: 56px;}
.faqList .faqItem{ border-radius: 8px; border: 1px solid #E8DDD2;}
/**/
.vision { padding: 84px 0;}
.visionSub { margin: 16px 0 0; text-align: center; color: #3C323A;}
.vision .titleCell { text-align: center;}
.vision ul { margin-top: 48px; display: flex; justify-content: space-between; gap: 24px;}
.vision li { transition: all .4s; flex:1; box-sizing: border-box; padding: 16px; background: #F6EEDE; border-radius: 8px; text-align: center;}
.visionImg img { width:68px; display: block; margin: 0 auto;}
.visionImg { margin-bottom: 16px;}
.vision li h5 { font-weight: 600; margin-bottom: 8px;}
.vision li p {color: #605036; }
.vision li:hover { transform: translateY(-10px); box-shadow: 0 0 10px rgba(0,0,0,0.1);}
.story { padding: 88px 0; background: #F6EEDE;}
.story li { align-items: center; margin-bottom: 84px; display: flex; gap: 64px;}
.storyImg {width: 47.33%;}
.storyImg img { display: block; width: 100%; object-fit: cover; aspect-ratio:568/447 ;}
.storyDesc { flex: 1;}
.story li:nth-child(2n) { flex-direction: row-reverse;}
.story li:last-child { margin: 0;}
.storyTitle h3 {font-weight: 600; color: #3C323A; line-height: 1; font-size: 32px; margin-bottom: 8px;}
.storyTitle span {color: #605036; display: block; font-size: 18px; line-height: calc(1em + 10px);}
.storyTitle { padding-bottom: 12px; margin-bottom: 12px; position: relative;}
.storyTitle::after { content: ''; position: absolute; bottom: 0; left: 0; height: 2px; width: 180px; background: #E8DDD2;}
.storyDesc p {color: #605036; font-size: 18px; line-height: calc(1em + 10px);}
.descImg img { display: block; width: 100%;}
/*aside*/
.fixAside { position: fixed;  right: 32px; bottom:6vw; z-index: 2; width: 80px;}
.fixAside span img { display: block; width: 100%;}
.fixAside li a{ display: flex; width: 64px; height: 64px; border-radius: 50%; margin: 0 auto 8px; justify-content: center; align-items: center;}
.fixAside li:nth-child(1) img { transition: all .4s;width: 32px;}
.fixAside li:nth-child(2) img { transition: all .4s;width: 24px;}
.fixAside li:nth-child(3) img { transition: all .4s; width: 32px;}
.fixAside li:nth-child(4) img { transition: all .4s; width: 36px;}
.fixAside li:nth-child(1) a{ transition: all .4s; background: #F8F5EE;}
.fixAside li:nth-child(2) a{ transition: all .4s; background: #F3C5C7;}
.fixAside li:nth-child(3) a{ transition: all .4s; background: #CDEBF6;}
.fixAside li:nth-child(4) a{ transition: all .4s; background: #98F6A2;}
.fixAside li a:hover { background: #7F3611;}
.fixAside li a:hover img {filter: brightness(0) invert(1);}
.fixAside::after { opacity: 0; transition: all .4s; content: ''; position: absolute; bottom: 0; width: 100%; top: -8px; background: rgba(60,50,58,.3); z-index: -1; border-radius: 80px; left:0;}
.fixAside ul { display: none; transition: all .4s; visibility: hidden; opacity: 0;}
.fixAside:hover ul { display: block; opacity: 1; visibility: visible;}
.fixAside:hover::after { opacity: 1;}
.insArt { background: #F6EEDE; padding: 16px;}
.inspirationSlide dl { display: flex; flex-wrap: wrap; gap: 40px 32px;}
.inspirationSlide dt { overflow: hidden; width: calc((100% - 96px)/4); border-radius: 24px;}
.insPic { width: 100%; overflow: hidden;}
.insPic img { transition: all .4s; display: block; width: 100%; object-fit: cover; aspect-ratio: 276/220;}
.insArt h2 { color: #3C323A; font-size: 24px; font-weight: 600; line-height: 1.5; margin-bottom: 8px; overflow: hidden;text-overflow: ellipsis; display: -webkit-box;-webkit-line-clamp:2;-webkit-box-orient: vertical; }
.insArt p { color: #8E7A6B; height: 4.32em; overflow: hidden;text-overflow: ellipsis; display: -webkit-box;-webkit-line-clamp: 3;-webkit-box-orient: vertical;
margin-bottom: 16px;}
.insArt span {line-height: 24px;color: #605036; font-size: 14px;}
.inspirationSlide dt:hover img { transform: scale(1.1);}
.inspirationSlide .descArts h3 { font-weight: bold;  overflow: hidden;text-overflow: ellipsis; display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;
}
.inspirationSlide li .insDesc a.linkMore { transition: all .4s; margin-top: 20px; font-size: 18px; color: #3C323A; align-items: center; transition: all .4s; display: inline-flex; padding: 0 14px; line-height: 44px; background: #E5B177;  gap: 48px;}
.inspirationSlide li .insDesc a.linkMore img { transition: all .4s; width: 16px;}
.inspirationSlide li .insDesc a.linkMore:hover { color: #ffffff; background: #7F3611;}
.inspirationSlide li .insDesc a.linkMore:hover img {filter: brightness(0) invert(1);}
.banner .swiper-button-prev,.banner .swiper-button-next { color: #7F3611; transition: all .4s;}
.banner .swiper-button-prev:hover,.banner .swiper-button-next:hover { color: #E5B177;}
.descImg { border-radius: 46px; overflow: hidden;}
.plankBanner { background: url(../images/plankbg.jpg) center no-repeat; background-attachment: fixed!important; background-size: cover!important; position: relative; z-index: 2; padding: .52rem 4%; text-align: center;}
.plankBanner h2 { margin-bottom: .24rem; font-weight: bold; font-size: var(--font48); line-height: calc(1em + 8px); color: #ffffff;}
.plankBanner p { font-size: var(--font18); line-height: calc(1em + 8px); color: #ffffff;}
.plankBanner a { padding: 0 15.5px; border-radius: 2px; transition: all .4s; line-height: 42px; display: none; justify-content: center; align-items: center; color: #7F3611; background: #E5B177;}
.plankBanner a:hover { color: #ffffff; background: #7F3611;}
.inspirationSlide h2.insTit {margin-bottom: .32rem; font-weight: bold; font-size: var(--font48); line-height: calc(1em + 8px); color: #3C323A;}
/* 分页器 */
.pageNav { display: flex; justify-content: center; align-items: center; gap: 20px; margin-top: 48px; padding-bottom: 20px;}
.pageNav .pageBtn { display: flex; justify-content: center; align-items: center; width: 36px; height: 36px; color: #7F3611; font-size: 22px; line-height: 1; transition: all 0.3s; text-decoration: none; background: none; border: none;}
.pageNav .pageBtn:hover:not(.disabled) { opacity: 0.6;}
.pageNav .pageBtn.disabled { opacity: 0.35; pointer-events: none;}
.pageNav .pageNums { display: flex; align-items: center; gap: 8px;}
.pageNav .pageNums a { color: #605036; font-size: 16px; min-width: 36px; height: 36px; line-height: 36px; text-align: center; text-decoration: none; border-radius: 3px;}
.pageNav .pageNums a:hover { color: #7F3611;}
.pageNav .pageNums a.cur { color: #7F3611; font-weight: bold; background: #E5B177;}
.bottomNotice { padding-bottom: .88rem;}
.mobTop { display: none;}
.gellaryControl { margin: 0 auto; margin-top: 48px; display: flex; align-items: center; justify-content: end; width: 1200px; max-width: 92%; gap: 24px;}
.gellaryControl span { cursor: pointer; border-radius: 3px; transition: all .4s; display: flex; background: #E5B177; border: 1px solid #E5B177; justify-content: center; align-items: center; width: 32px; height: 32px;}
.gellaryControl span:hover { opacity: .5;}
.gellaryControl span img { width: 16px; display: block; transition: all .4s;}
.inBanner .prevBtn { z-index: 3; position: absolute; left: 6.77%; top: 50%; transform: translateY(-50%); cursor: pointer; border-radius: 3px; transition: all .4s; display: flex; background: #E5B177; border: 1px solid #E5B177; justify-content: center; align-items: center; width: 32px; height: 32px;}
.inBanner .nextBtn { z-index: 3; position: absolute; right: 6.77%; top: 50%; transform: translateY(-50%);cursor: pointer; border-radius: 3px; transition: all .4s; display: flex; background: #E5B177; border: 1px solid #E5B177; justify-content: center; align-items: center; width: 32px; height: 32px;}
.inBanner .prevBtn img,.inBanner .nextBtn img { width: 16px;}
.inBanner .nextBtn:hover,.inBanner .prevBtn:hover { opacity: .5;}
@media screen and (max-width: 1800px) {

}
@media screen and (max-width: 1600px) {

}

@media screen and (max-width: 1500px) {

}
@media screen and (max-width: 1440px) {

}
@media screen and (max-width: 1280px) {
	
}
@media screen and (max-width: 1200px) {
	.bannerInt a { font-size: 14px; gap: 16px; padding: 0 8px; line-height: 28px;}
	:root{
		--header-height: 60px; 
	}
	.langChose { padding-top: 0; height: var(--header-height);}
	.header { padding: 0 20px;}
	.header,.small-header .header { height: 60px;background: #fff; box-shadow: 0 0 10px rgba(0,0,0,0.2);}
	.logo img { width: auto; height: 40px;}
	.headerCont { width: 100%;}
	
	.header .nav li h2 a{ color: #333333;}
	.searchEnter { background: url(../images/blackSearch.png) center no-repeat; background-size: 100% auto;}

	.nav { height:100vh; position: fixed; left: -110%; overflow-y: auto; top:60px; width: 200px; background: #ffffff; bottom: 0;}
	.nav ul { display: block;}
	.nav li { border-bottom: 1px solid #eee; float: none; margin: 0!important;}
	.nav li h2{position: relative;}
	.nav li h2 i { transition: all .5s; background: url(../images/menuEnter.png) center no-repeat;
	width: 8px; height: 14px; background-size: 100% auto; position: absolute; right:15px; top: 50%; margin-top: -7px;}
	.nav li h2 a {  line-height: 40px; color: #333333;}
	.nav li.cur h2 i{ background: url(../images/menuEntero.png) center no-repeat; background-size: 100% auto; transform: rotate(90deg);}
	.menubox{ transform: scale(.75); display: block; position: absolute;right: 2%; top: 18px; width:30px; height: 30px;opacity: 1;pointer-events: auto;transition: 0.3s;}
	.menubox div{position: absolute;left: 0;width: 30px;height: 2px;background-color: #3C323A;transition: 0.6s;}
	.menubox div:nth-child(1){top: 0px;}
	.menubox div:nth-child(2){top: 10px;}
	.menubox div:nth-child(3){top: 20px;}
	.menubox.on div:nth-child(1){top: 9px;transform: rotateZ(45deg);}
	.menubox.on div:nth-child(2){top: 0px;opacity: 0;}
	.menubox.on div:nth-child(3){top: 9px;transform: rotateZ(-45deg);}
	.langChose { margin-right: 50px;}
	.nav li dl { position: static; width: 100%; padding: 0; transform: translateX(0); text-align: left;}
	.nav li dl dt { text-align: left; text-indent:30px;}
	.nav li h2::after { display: none!important;}
	.mobSub dl { display: block!important;}
	.nav li dl dt dt { text-indent: 40px;}
	.nav li dt h3 a { font-size: 16px;}
	.nav li dt dt a { font-size: 14px;}
	body { padding-top: 60px;}
	.langChose dl { top: 60px; border-radius: 0 0 6px 6px;}
	.langChose h2 { font-size: 14px;}
	.bannerInt h2 {font-size: 20px;}
	.bannerInt { left: 4%;}
	.bannerImg { width: 100%; border-radius: 0;}
	.keyFeature,.brochure {padding: 30px 0;}
	.brochure ul { margin-top: 20px; padding: 10px; gap: 10px;}
	.whatsCont li { gap: 16px;}
	.titleCell h2 { font-size: 22px;}
	.featureList ul { margin-top: 20px; flex-wrap: wrap; gap: 10px;}
	.featureList li { width: calc(50% - 5px); flex: auto;}
	.featureList h3 { font-size: 16px;}
	.featureList p {font-size: 14px;}
	.brochure a { font-size: 14px;}
	.brochure li { padding: 16px 6px;}
	.brochure li p { font-size: 14px;}
	.power {padding: 30px 0;}
	.powerDesc { flex-direction: column; gap: 20px;}
	.descCont { width: 100%;}
	.descCont span { font-size: 16px;}
	.descCont h2 { font-size:20px; margin-bottom: 10px;}
	.descCard { width: 100%;}
	.descCont p:last-child { margin: 0;}
	.category { padding: 30px 0;}
	.categoryList ul { margin-top: 20px; flex-direction: column;}
	.categoryList li { padding: 20px;}
	.categoryList li h3 { font-size: 18px; margin-bottom: 10px;}
	.categoryDesc p { font-size: 14px; margin-bottom: 1em; line-height: calc(1em + 10px);}
	.categoryDesc { margin-top: 10px; min-height:auto;}
	.categoryList li a { font-size: 14px; gap: 16px; padding: 0 8px; line-height: 28px;}
	.titleCell p { font-size: 14px; margin-top: 10px;}
	.partnerForm .pfRow { flex-direction: column;}
	.partnerForm .pfCol.pfCompany,.partnerForm .pfCol.pfInterest { width: 100%;}
	.partnerForm .pfCol.pfPerson { width: 100%!important;}
	.partnerForm .pfNameRow input { width: auto; flex: 1;}
	.partnerForm .pfCol { width: 100%!important;}
	.inspirationSlide li a {font-size: 14px; gap: 16px; padding: 0 8px; line-height: 28px;}
	.inspirationSlide li a img {}
}
@media screen and (max-width: 1080px) {
	.copyFlex { flex-direction: column;gap: 4px;}
	.searchinput { width: 100%; top: 60px; margin: 0; background: #ffffff; padding: 10px; transform-origin: center; top: ;}
	.searchBox { position: static;}
	.footLink { display: none;}
	.footLeft span { font-size: 14px;}
	.footLeft p { font-size: 18px;}
	.footLogo { width: 20%; margin-bottom: 24px;}
	.footLogo img { width: 100%; height: auto; display: block;}
	.copyRight { display: block; line-height: 1.5; text-align: center; padding:16px 0;}
	.copyRight p, .copyRight a { font-size: 12px; line-height: 18px;}
	.footerContact p { font-size: 16px; line-height: 24px; margin-bottom: 8px; text-align: left;}
	.footLeft { margin-bottom: 24px;}
	.soshowlink { flex-direction: column; justify-content: start; align-items: start;}
	.linkFlex img { width: 24px;}
	.linkFlex { gap: 16px;}
	.soshowlink a.footAbout { line-height: 2; padding: 0 8px; font-size: 14px;}
	.privacy a { font-size: 12px; line-height: 18px;}
	.privacy { margin-bottom: 0; margin-top: 24px;}
	.copyRight br { display: block;}
	.footerContact h2 { font-size: 16px; margin-bottom: 0;}
	.contactLink ul { justify-content: center;}
	.footer { text-align: center;}
	.contactLink { margin-bottom: 10px;}
	.footerTop { padding: 24px 0; flex-direction: column; justify-content: start; align-items: start; text-align: left;}
	.bannerInt p { font-size: 12px;}
	.banner .bannerControl { width:57.33%; padding: 0 4%;}
	.bannerInt { bottom: auto; top: 50%; transform: translateY(-50%);}
	.descArt { padding: 0 10px 0;}
	.subDesc { flex-direction: column; gap: 20px;}
	.subDesc .descCard{ width: 100%!important;}
	.subDesc .descCard:nth-child(2) {padding-top: 0;}
	.powerDesc .descCard { text-align: left; margin-bottom: 20px;}
	.descCont h2 br { display: none;}
	.descArt h2 { font-size: 18px; margin-bottom: 10px;}
	.centerMore a { font-size: 14px; line-height: 2.5;}
	.inspirationList { padding: 30px 0;}
	.category_Tit a { flex: 1; text-align: center; font-size: 14px; line-height: 32px;}
	.inspirationType span img { height: 20px;}
	.insDesc { max-width: 100%; margin: 0; padding: 16px;}
	.insDesc h3 { font-size:18px; margin-bottom: 8px;}
	.insDesc p { font-size: 14px;}
	/* .insDesc a { gap: 16px; font-size: 14px; margin-top: 20px; line-height: 2; padding: 0 8px;} */
	.inspirationList li:nth-child(2n) .insImg { margin: 0;}
	.inspirationList li { margin-bottom: 10px;}
	.inspirationList .act li .insDesc { padding: 10px;}
	.inspirationList .act .insImg img { aspect-ratio: auto; height: 100%; object-fit: cover;}
	.inspirationType { gap: 15px; margin-bottom: 20px;}
	.pageNav { margin-top: 24px; gap: 14px;}
	.pageNav .pageBtn { width: 32px; height: 32px; font-size: 18px;}
	.pageNav .pageNums { gap: 6px;}
	.pageNav .pageNums a { font-size: 14px; min-width: 32px; height: 32px; line-height: 32px;}
	.partnerCont { padding: 30px 0;}
	.partnerDesc p {font-size: 14px;}
	.partnerDesc { margin: 10px 0 0;}
	.partnerForm label {font-size: 14px;}
	.faqTop { padding: 30px 0;}
	.faqTopInner { flex-direction: column; gap: 20px;}
	.faqLeft h2 { font-size: 22px; margin-bottom:16px; line-height: 1;}
	.faqLeft h2 br { display: none;}
	.faqLeft p {font-size: 14px;}
	.faqRight { width: 100%;}
	.faqBottom { padding: 30px 0;}
	.faqBox > h2 { font-size:18px; padding: 0; line-height: 1.5; margin-bottom: 10px;}
	.faqQ span { font-size: 18px;}
	.faqQ { padding: 16px 10px;}
	.faqQ .arrow { width: 10px;}
	.faqA p { font-size: 14px;}
	.faqA { padding: 0 10px 10px;}
	.vision {padding: 30px 0;}
	.visionSub { font-size: 14px;}
	.story { padding: 30px 0;}
	.acInner { gap:20px; flex-direction: column;}
	.acLeft {width: 100%;}
	.aboutContact { padding: 30px 0;}
	.acRight { width: 100%; padding: 20px;}
	.acLeft > h2 { font-size: 20px; margin-bottom: 20px; line-height: 1;}
	.aboutAddress { padding: 30px 0;}
	.plankDetail { padding:30px 0;}
	.footerContact { display: flex; flex-direction: column-reverse;}
}
@media screen and (max-width: 780px){
	.banner,.inBanner .swiper-slide { display: flex; flex-direction: column-reverse;}
	.inBanner .swiper-button-prev,.inBanner .swiper-button-next { transform: translate(0); margin: 0; font-size: 20px; top: 20%;}
	.inBanner .swiper-button-prev::after,.inBanner .swiper-button-next::after { font-size: 20px;}
	.bannerInt { display: none; transform: translate(0); max-width: 92%; width: 92%; margin: -20px auto 0; position: static;}
	.bannerInt p { font-size: 14px; width: 100%; max-width: 100%;}
	/* Products banner: title + CTA centered on the image (mobile entry) */
	.inBanner .swiper-slide { display: block; position: relative; }
	.inBanner .bannerImg { float: none; width: 100%; border-radius: 0; }
	.inBanner .bannerInt {
		display: flex !important;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		gap: 14px;
		position: absolute;
		left: 50%;
		top: 50%;
		transform: translate(-50%, -50%) !important;
		z-index: 2;
		width: auto;
		max-width: 78%;
		margin: 0;
		bottom: auto !important;
		text-align: center;
		pointer-events: none;
	}
	.inBanner .bannerInt h2 {
		font-size: 32px;
		line-height: 1.15;
		font-weight: 700;
		color: #ffffff;
		text-shadow:
			0 2px 4px rgba(0,0,0,.55),
			0 4px 16px rgba(0,0,0,.45),
			0 0 2px rgba(0,0,0,.8);
		width: 100%;
		margin: 0;
		letter-spacing: 0.02em;
	}
	.inBanner .bannerInt .bannerDesc { display: none !important; }
	.inBanner .bannerInt a {
		pointer-events: auto;
		font-size: 14px;
		line-height: 36px;
		padding: 0 18px;
		gap: 12px;
	}
	.inBanner .prevBtn,
	.inBanner .nextBtn { top: 50%; }
	.categoryMenu li p { font-size: 14px;}
	.categoryMenu li { margin-right: 8px; border-radius: 2px; overflow: hidden; border: 2px solid #93471500;}
	.categoryMenu li.cur { border:1px solid #934715; background: #934715;}
	.categoryMenu li.cur p { color: #ffffff;}
	.category_Tit span { font-size: 14px;}
	.categoryList ul { gap: 20px;}
	.descNumber span {font-size: 14px;}
	.descNumber p { font-size: 16px;}
	.descSystem p { font-size: 18px;}
	.matt p { font-size: 12px; line-height: 18px; margin: 0 0 8px;}
	.mattIcon{ justify-content: end; width: 100%; gap: 5px;}
	.plankDetail li { display: flex; flex-direction: column; margin-bottom:24px;}
	.postDesc { text-align: left;}
	.descNumber::after,.descSystem::after { right: auto; right: 0;}
	.postImg { width:50%;}
	.descSystem { margin: 0; display: flex; justify-content: end;}
	.matt { justify-content: end; text-align: right; align-items: end;}
	.postDesc { text-align: right;}
	.descNumber { display: flex; align-items: center; line-height: 32px; padding: 0; margin: 0; justify-content: end;}
	.descNumber span,.descNumber p { line-height: 32px; font-size: 14px;}
	.descSystem p { font-size: 14px;}
	.plankDetail ul { margin-top: 0;}
	.postDetail { position: static; transform: translate(0); max-width: 100%; padding: 12px;}
	.detailSwiper { width: 100%;}
	.bannerControl a { font-size: 14px;}
	.categoryMenu { width: 100%; margin-top: 10px;}
	.categoryMenu ul { overflow-x: auto; display: block; white-space: nowrap; flex-wrap: nowrap;}
	.categoryMenu li {  flex-direction: row-reverse; border: 1px solid #E8DDD2; display: inline-flex; width: auto; align-items: center;}
	.categoryMenu li h5 { padding: 0 8px; transform: translate(0); color: #3C323A; white-space: nowrap; position: static;}
	.categoryMenu li img { width: 28px; height: 28px;}
	.categoryFlex { flex-direction: column; gap: 10px;}
	.categorySwiper { width: 100%;}
	.plankBanner h2,.category_Tit h2 { font-size: 22px;}
	.plankBanner h2 br { display: none;}
	.acForm label { font-size: 14px;}
	.aaInner { flex-direction: column;}
	.aaImg { width: 100%;}
	.aaInfo { width: 100%; padding: 20px;}
	.aaIcon { height: 60px; width: 60px;}
	.aaInfo h3 { font-size:20px; line-height: 1;}
	.aaInfo p { font-size: 14px;}
	.acCheckItem label { white-space: nowrap;}
	.acCheckItem { width: auto;}
	.acCheckGroup { gap: 0 10px;}
	.acRow { flex-direction: column; gap: 10px;}
	.story li { gap: 20px; flex-direction: column!important; margin-bottom: 20px;}
	.storyTitle h3 { font-size: 20px;}
	.storyTitle span { font-size: 14px;}
	.storyDesc p { font-size: 14px;}
	.storyImg { width: 100%;}
	.vision ul { flex-wrap: wrap; gap: 10px;}
	.vision ul li { flex: auto; width: 100%;}
	.vision li p {font-size: 14px;}
	.faqQ span { font-size: 14px;}
	.copyFlex { flex-direction: column;}
	.banner .swiper-pagination span { width: 8px; height: 8px; border: 1px solid #ffffff; margin-right: 6px!important;}
	.subEwm { width: 100px; top: 40px;}
	.partnerForm { margin-top: 30px; padding: 20px;}
	.pfNameRow {flex-direction: column;}
	.partnerForm .pfNameRow input { flex: auto;}
	.partnerForm .pfRow { gap: 10px; margin-bottom: 10px;}
	.partnerForm .pfRadio label {font-size: 14px;}
	.partnerForm .pfRadio { gap: 10px; flex-wrap: wrap;}
	.partnerForm .pfRadio span { font-size: 14px; width: 100%;}
	.partnerForm .pfRow.pfFoot { margin-top: 10px;}
	.whatsInfor { width: 100%; padding: 30px 0;}
	.whatsBg { position: static; width: 100%; display: block;}
	.whatsInfor .titleCell { margin: 0 0 20px;}
	.whatsCont li p { font-size: 16px;}
	.whatsCont li span {font-size: 14px;}
	.whatsImg { min-width: 40px; width: 40px;}
	.contactCard { margin-bottom: 10px; padding: 30px; flex-direction: column; justify-content: center; text-align: center; align-items: center;}
	.ccInfo h4 { font-size: 20px;}
	.ccInfo p { font-size: 14px;}
	.ccIcon { width: 60px; height: 60px;}
	.cardYellow .ccIcon img,.cardPink .ccIcon img { width: 26px;}
	.langChose { margin-right: 30px;}
	.articlePage { padding: 30px 0 0; margin-bottom: 0;}
	.articleBreadcrumb { font-size: 14px; margin-bottom: 20px;}
	.articleInfor { border: none; padding: 0;}
	.articleTitle { margin-bottom: 1em; font-size: 20px;}
	.articleContent { font-size: 16px; }
	.articleContent p { margin-bottom: 0;}
	.articleContent ul, .articleContent ol { margin-bottom: 0;}
	.fixAside { top: auto; width: 50px; bottom: 32px; right: 4%;}
	.fixAside li a { width: 44px; height: 44px;}
	.fixAside li:nth-child(1) img { width: 22px;}
	.fixAside li:nth-child(2) img { width: 16px;}
	.fixAside li:nth-child(3) img { width: 18px;}
	.fixAside li:nth-child(4) img { width: 26px;}
	.categorySlide { width: 100%;}
	.categoryArt { gap: 20px; padding: 20px; flex-direction: column; margin-top: 20px;}
	.categoryArt .categoryImg { width: 100%;}
	.artDesc {  max-width: 100%; width: 100%;}
	.categoryDesc h2 { font-size: 20px; margin-bottom: 10px;}
	.artDesc a { font-size: 14px; line-height:2; gap: 16px; padding: 0 8px;}
	.categorySwiper p { font-size: 20px;}
	.plankBanner a { padding: 0 9.5px; font-size: 14px; line-height: 28px;}
	.plankBanner p { display: none;}
	.inspirationSlide dl { gap: 10px;}
	.inspirationSlide dt{ border-radius: 12px; width: calc(50% - 5px);}
	.insArt { padding: 10px;}
	.insArt h2 { font-size:16px}
	.insArt p { font-size: 14px; margin: 0; height: 42px;}
	.insArt span { font-size: 12px;}
	.fixSidebar h3 { font-size: 20px; line-height: 2;}
	.matt { align-items: end;}
	.mattIcon img { width: 20px;}
	.mattIcon {width: 96px;}
	.detailButton { margin-top:16px;}
	.detailButton a { line-height: 2; max-width: none; width: auto; padding: 0 12px; font-size: 14px;}
	.fixSidebar { max-width: 90%;}
	.fsCheckList { flex-direction: column;}
	.fsCheckList li { width: 100%;}
	.formRow { flex-direction: column;}
	.fixSidebar input, .fixSidebar select,.fixSidebar input::placeholder, .fixSidebar select::placeholder { font-size: 14px;}
	.fixSidebar .sidebarInner { padding-bottom: 0;}
	.fixSidebar .formCol.full:last-child { margin: 0;}
	.banner .bannerControl { width: 45%; bottom: 0; height: 40px;}
	.bannerButton span { width: 24px;}
	.bannerButton img { display: block; width: 100%;}
	.bannerImg .swiper { border-radius: 0;}
	.detailSwiper .bannerControl { width: 46%; padding: 8px 16px; bottom: 0; height: auto; line-height: 24px;}
	.detailSwiper .swiper-slide img { aspect-ratio: 380/254;}
	.contactType li a {width: 24px; height: 24px;}
	.powerDesc .descCard { display: flex; align-items: start;}
	.subDesc .descCard { display: flex; align-items: start;}
	.descImg { border-radius: 16px; width: 40%; min-width: 40%;}
	.subDesc .descCard:nth-child(odd) { flex-direction: row-reverse;}
	.descArt h2 { font-size: 16px;}
	.descCont span { margin-bottom: 0;}
	.brochure span { display: none;}
	.brochure li p { max-width: calc(100% - 20px);}
	.subDesc .descCard:nth-child(2) { display: block;}
	.subDesc .descCard:nth-child(2) .descImg { margin-right: 10px; float: left;}
	.subDesc .descCard:nth-child(2) .descArt { padding-left: 0;}
	.subDesc .descCard:nth-child(1) .descArt { padding-left: 0;}
	.powerDesc .descArt { padding-right: 0;}
	.header .nav li h2 { width: 100%; text-align: center;}
	.header .nav li h2 a { display: block; text-align: center;}
	.mobFlex { display: flex; justify-content:space-between; align-items: center;}
	.mobTop { display: block; background: #F7DEB9; border-bottom: 4px solid #7F3611; padding: 16px 24px 14px;}
	.mobTop h2 { font-family: 'mr'; font-weight: normal; margin-bottom: 8px; color: #7F3611; font-size: 16px; line-height: 1.5;}
	.mobLink { display: flex; justify-content: center; align-items: center; gap: 8px;}
	.mobLink a { display: block; width: 32px;}
	.mobFlex .mobAbout { width: 85px; font-size: 14px; line-height: 32px; display: block; text-align: center; background: #E5B177; color: #7F3611;}
	.categoryList dl { margin-top: 16px; flex-direction: column;}
	.categoryList dt { height: 327px; position: relative; width: 100%!important;}
	.postText { padding: 0 16px 16px;}
	.categoryList dt h3 { font-size: 18px; line-height: 22px;}
	.categoryList dt p { font-size: 12px; line-height: 18px;}
	.categoryList dt a {font-size: 14px;
        gap: 16px;
        padding: 0 8px;
        line-height: 28px;}
	.banner video { aspect-ratio:auto; height: calc(100vh - 162px);}
	.gellaryControl { margin-top: 20px;}
	.gellarySwiper { margin-bottom: 0; margin-top: 16px;}
	.categoryMenu li:hover{ border: 1px solid #934715;}
}