@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@100..900&display=swap');
/* font-family: "Noto Sans JP", sans-serif; */
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans:wght@100;200;300;400;500;600;700&display=swap');
/* font-family: 'Noto Sans', sans-serif; */

/* SEO: Visually hidden class for screen readers and search engines */
.visually-hidden {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    border: 0;
}

/* SEO: Product page H1 styling */
h1.product-title {
    font-size: 2.4rem;
    font-weight: 700;
    color: #c19648;
    margin-bottom: 8px;
}

/* NOTE: 共通 */
body, html { width: 100%; height: 100%;}
html { font-size: 62.5%;}
body { font-size: 1.6em; color: #444; font-family: "Noto Sans JP", sans-serif; font-weight: 400;}
#wrapper { position: relative; height: 100%;}
/* .spacer { height: 70px;} */
.desktop-only { display: none;}
#onScrollTarget { position: absolute; top: 0; left: 0; width: 0; height: 0; display: block;}

/* NOTE: header */
header { position: fixed; top: 0; left: 0; width: 100%; z-index: 100; transition: 0.3s;}
header .logo_dark { display: none;}
header.scrolled { background: #fff;}
header.scrolled .logo_wh { display: none;}
header.scrolled .logo_dark { display: block;}
header.scrolled { opacity: 1; background: #fff;}
header .inner { width: 100%; height: 70px; display: flex; align-items: center; padding-left: 20px;}
header .inner .logo { position: absolute; top: 50%; left: 20px; transform: translateY(-55%); width: 80px;}
header .inner .logo img { width: 100%;}
header .inner ul.main { display: none;}

/* NOTE: hamburger */
#hamburger { position: fixed; width: 50px; height: 50px; top: 12px; right: 10px; cursor: pointer; z-index: 102; transition: 0.3s;}
#hamburger span { position: absolute; left: 50%; transform: translateX(-50%); transition: all .3s ease-out;}
#hamburger span:nth-of-type(1) { top: 12px; width: 26px; height: 3px; background: #c19648;}
#hamburger span:nth-of-type(2) { top: 21px; width: 26px; height: 3px; background: #c19648;}
#hamburger span:nth-of-type(3) { top: 30px; width: 26px; height: 3px; background: #c19648;}
#hamburger.active span:nth-of-type(1) { top: 20px; transform: translateX(-50%) translateY(-50%) rotate(-45deg); background: #c19648;}
#hamburger.active span:nth-of-type(2) { opacity: 0;}
#hamburger.active span:nth-of-type(3) { top: 20px; transform: translateX(-50%) translateY(-50%) rotate(45deg);  background: #c19648;}

/* NOTE: nav */
nav#global { position: fixed; top: 0; right: -100%; width: 100%; height: 100%; overflow: auto; -webkit-overflow-scrolling: touch; z-index: 101; transition: 0.3s; background: #fff; padding: 0 0 30px 0;}
nav#global.active { transform: translateX(-100%); transition-duration: 0.3s;}
nav#global .line { width: 100%; height: 70px; background: #666; display: flex; align-items: center; padding-left: 20px;}
nav#global .line img { width: 80px;}
nav#global > ul { list-style: none; padding: 10px 30px 30px 30px; }
nav#global ul li { border-bottom: 1px solid #ddd;}
nav#global ul li a { display: block; font-size: 1.6rem; text-decoration: none; color: #666; line-height: 1.2; padding: 20px 0;}
nav#global > ul li span { display: block; font-size: 1.6rem; text-decoration: none; color: #666; line-height: 1.2; padding: 20px 0;}
nav#global .under { padding-left: 20px;}
nav#global .under ul { list-style: none;}
nav#global .under ul li { border-top: 1px solid #ddd; border-bottom: none;}

/* 移动端语言下拉框样式 */
nav#global li.lang-dropdown-mobile { border-bottom: none;}
nav#global li.lang-dropdown-mobile .lang-current { display: block; padding: 15px 20px; color: #333; font-size: 1.5rem; cursor: pointer; background: #f5f5f5; border-radius: 8px; margin: 10px 20px;}
nav#global li.lang-dropdown-mobile .lang-current:after { content: ' ▼'; font-size: 0.9rem;}
nav#global li.lang-dropdown-mobile .lang-menu { display: none; background: #fff; margin: 0 20px 10px; border-radius: 8px; overflow: hidden; box-shadow: 0 2px 10px rgba(0,0,0,0.1);}
nav#global li.lang-dropdown-mobile.open .lang-menu { display: block;}
nav#global li.lang-dropdown-mobile .lang-menu ul { list-style: none; padding: 0;}
nav#global li.lang-dropdown-mobile .lang-menu ul li { border-bottom: 1px solid #eee;}
nav#global li.lang-dropdown-mobile .lang-menu ul li:last-child { border-bottom: none;}
nav#global li.lang-dropdown-mobile .lang-menu ul li a { display: block; padding: 12px 20px; color: #333; text-decoration: none; font-size: 1.4rem;}
nav#global li.lang-dropdown-mobile .lang-menu ul li a:hover { background: #f9f9f9;}
nav#global li.lang-dropdown-mobile .lang-menu ul li a.active { color: #c19648; font-weight: 600; background: #fdf8f0;}

/* NOTE: footer */
#pagetop { opacity: 0; pointer-events: none; background: rgba(193, 150, 72, 0.9); color: #fff; width: 50px; height: 50px; border-radius: 50%; text-align: center; line-height: 45px; position: fixed; bottom: 20px; right: 10px; cursor: pointer; z-index: 90; transition: 0.3s;}
#pagetop.active { opacity: 1; pointer-events: auto;}
footer { width: 100%; background: #eeeff0;}
footer .inner { width: 100%; padding: 0 20px 50px 20px;}
footer .inner ul { list-style: none; margin-bottom: 30px;}
footer .inner ul li { border-bottom: 1px solid #ddd; padding: 20px 0;}
footer .inner ul li .mi { display: none;}
footer .inner ul li a { display: inline-block; font-size: 1.5rem; color: #666; text-decoration: none; position: relative; padding-bottom: 5px;}
footer .inner ul li br + a { margin-top: 25px;}
footer .inner ul li a:hover { color: #c19648;}
footer .inner ul li a:after { position: absolute; bottom: 0; left: 50%; transform: translateX(-50%); content: ''; width: 0; height: 1px; background: #c19648; transition: .3s all; }
footer .inner ul li a:hover::after { width: 100%;}
footer .inner small { display: block; font-size: 1.4rem; color: #444; letter-spacing: 3px; text-align: center;}

/* NOTE: breadcrumbs */
#breadCrumbs { width: 100%; padding: 10px 0; font-size: 1.3rem; line-height: 1.2; color: #444; background: #f6f6f6;}
#breadCrumbs #breadCrumbsInner { width: 100%; padding: 0 20px;}
#breadCrumbs span { margin: 0 8px;}
#breadCrumbs span:first-child { margin: 0 5px 0 0;}
#breadCrumbs a { color: #444; text-decoration: none;}
#breadCrumbs a:hover { text-decoration: underline;}

/* NOTE: IntersectionObserver */
/* .target { transform: translateY(30px); opacity: 0; transition: 0.5s;}
.target.active { transform: none; opacity: 1;} */

/* NOTE: pageHome */
#pageHome section.hero { width: 100%; height: 100vh; position: relative;}
#pageHome section.hero canvas { position: absolute; top: 0; left: 0; bottom: 0; right: 0; width: 100%; height: 100%; z-index: -1;}

#pageHome section.hero .intrologo { opacity: 0; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); z-index: 1; pointer-events: none;}
#pageHome section.hero.active .intrologo { animation: anime01 3s 0s forwards;}
#pageHome section.hero .intrologo img { width: 180px; height: auto;}
@keyframes anime01 {
  0% { opacity: 0;}
  70% { opacity: 1;}
  100% { opacity: 0;}
}

#pageHome section.hero .swiper { position: absolute; top: 0; left: 0; bottom: 0; right: 0; width: 100%; height: 100%; object-fit: cover; z-index: -2;}
#pageHome section.hero .swiper-wrapper { width: 100%; height: 100vh;}
#pageHome section.hero .swiper-wrapper li { width: 100%; height: 100vh; overflow: hidden;}
#pageHome section.hero .swiper-wrapper li img { width: 100%; height: 100%; object-fit: cover;}

#pageHome section.hero .product { opacity: 0; position: absolute; top: 0; left: 0; bottom: 0; right: 0; display: flex; justify-content: center; align-items: center; transition: 0s;}
#pageHome section.hero .product.active { opacity: 1; transition: 3s;}
#pageHome section.hero .product.active ul li img { transform: scale(1); opacity: 1; transition: 0s;}
#pageHome section.hero .product.active2 { opacity: 1;}
#pageHome section.hero .product.active2 ul li:nth-of-type(1) img { transform: none; transition: 0.8s; transition-delay: 1s; opacity: 1;}
#pageHome section.hero .product.active2 ul li:nth-of-type(2) img { transform: none; transition: 0.8s; opacity: 1;}
#pageHome section.hero .product.active2 ul li:nth-of-type(3) img { transform: none; transition: 0.8s; opacity: 1;}
#pageHome section.hero .product.active2 ul li:nth-of-type(4) img { transform: none; transition: 0.8s; transition-delay: 1s; opacity: 1;}
#pageHome section.hero .product ul { width: 100%; padding: 0 10px; display: flex; justify-content: space-between; align-items: center; list-style: none;}
#pageHome section.hero .product ul li { height: 120px;}
#pageHome section.hero .product ul li img { height: 100%; transition: 0.3s; cursor: pointer; transform: scale(0.9); opacity: 0;}
#pageHome section.hero .product ul li:hover img { transform: scale(1.05);}

#pageHome section.hero .prodetail.active { opacity: 1; pointer-events: auto;}
#pageHome section.hero .prodetail.active .inner .img img { opacity: 1; transition: 0.3s;}
#pageHome section.hero .prodetail.active .inner .txt { opacity: 1; transition: 0.8s; transition-delay: 0.3s;}
#pageHome section.hero .prodetail { opacity: 0; position: absolute; top: 0; left: 0; bottom: 0; right: 0; display: flex; justify-content: center; align-items: center; transition: 0.5s; pointer-events: none;}
#pageHome section.hero .prodetail .arrow { position: absolute; top: 100px; left: 20px;}
#pageHome section.hero .prodetail .arrow img { width: 40px; height: 40px; cursor: pointer;}
#pageHome section.hero .prodetail .inner { width: 100%;}
#pageHome section.hero .prodetail .inner .img { width: 100%; text-align: center; margin-bottom: 30px;}
#pageHome section.hero .prodetail .inner .img img { opacity: 0; width: auto; height: 150px; transition: 0s;}
#pageHome section.hero .prodetail .inner .txt { width: 100%; color: #fff; padding: 0 20px; opacity: 0; transition: 0s; display: flex; justify-content: center; align-items: center; flex-direction: column;}
#pageHome section.hero .prodetail .inner .txt .name { font-size: 2.4rem; font-weight: 600; letter-spacing: 0.3rem; margin-bottom: 20px;}
#pageHome section.hero .prodetail .inner .txt p { font-size: 1.7rem; line-height: 1.8; font-weight: 400; letter-spacing: 0rem; margin-bottom: 50px;}
#pageHome section.hero .prodetail .inner .txt .btn { width: 100%; text-align: center;}
#pageHome section.hero .prodetail .inner .txt .btn a { display: inline-block; width: 80%; background: #fff; border-radius: 5px; text-align: center; padding: 12px 0; color: #c19648; font-size: 1.8rem; font-weight: 500; letter-spacing: 0.3rem; text-decoration: none; transition: 0.3s;}
#pageHome section.hero .prodetail .inner .txt .btn a:hover { background: #e3f3c3; outline: solid #fff 2px; outline-offset: -2px; transform: translateY(-3px);}

#pageHome section.history { padding: 50px 0;}
#pageHome section.history > .inner { width: 100%;}
#pageHome section.history h2 { font-size: 2.8rem; font-weight: 700; text-align: center; margin-bottom: 10px;}
#pageHome section.history ul { list-style: none;}
#pageHome section.history ul li { padding: 0 20px; text-align: center;}
#pageHome section.history ul li + li { margin-top: 50px;}
#pageHome section.history ul li .item { text-align: center;}
#pageHome section.history ul li .item .number { font-family: 'Noto Sans', sans-serif; font-size: 6.0rem; font-weight: 900; color: #c19648;}
#pageHome section.history ul li .item .plus { display: inline-block; font-family: 'Noto Sans', sans-serif; font-size: 6.0rem; font-weight: 900; color: #c19648; transform: translateY(10px); margin-left: 5px;}
#pageHome section.history ul li .txt { }
#pageHome section.history ul li .txt span:nth-of-type(1) { display: inline-block; font-size: 1.8rem; color: #c19648; margin-bottom: 30px;}
#pageHome section.history ul li .txt span:nth-of-type(2) { font-size: 1.6rem; color: #666;}

#pageHome section.rd { width: 100%; position: relative;}
#pageHome section.rd .bg { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; z-index: -2;}
#pageHome section.rd .overlay { position: absolute; top: 0; left: 0; bottom: 0; right: 0; background: rgba(0, 0, 0, 0.3); z-index: -1;}
#pageHome section.rd ul { list-style: none;}
#pageHome section.rd ul li { width: 100%; padding: 20px 20px;}
#pageHome section.rd ul li + li { border-top: 1px solid #fff;}
#pageHome section.rd ul li { height: 300px; display: flex; justify-content: center; align-items: center; flex-direction: column;}
#pageHome section.rd ul li .txt { display: flex; justify-content: center; align-items: center; flex-direction: column; transition: 1s;}
#pageHome section.rd ul li:hover .txt { transform: translateY(-30px); transition: 1s;}
#pageHome section.rd ul li .icon { transform: scale(2.0); margin-bottom: 20px;}
#pageHome section.rd ul li p { font-size: 1.8rem; color: #fff; text-align: center; margin-bottom: 20px;}
#pageHome section.rd ul li a { font-size: 1.8rem; display: inline-block; background: #fff; color: #c19648; font-weight: 600; padding: 10px 30px; border-radius: 30px; text-decoration: none; transition: 0.3s;}
#pageHome section.rd ul li a:hover { background: #c19648; color: #fff; transition: 0.3s;}

#pageHome section.experts { padding: 50px 0; background: #f7f8f9;}
#pageHome section.experts > .inner { width: 100%; padding: 0 20px;}
#pageHome section.experts h2 { font-size: 2.8rem; font-weight: 700; text-align: center; margin-bottom: 30px;}
#pageHome section.experts ul { list-style: none;}
#pageHome section.experts ul li { width: 100%; background: #fff; padding: 30px; border-radius: 20px; box-shadow: 0 0 8px #ccc; display: flex; align-items: center; flex-direction: column; transition: 0.3s;}
#pageHome section.experts ul li:hover { transform: scale(1.05); transition: 0.3s;}
#pageHome section.experts ul li + li { margin-top: 20px;}
#pageHome section.experts ul li .img { display: inline-block; position: relative; margin-bottom: 10px; text-align: center;}
#pageHome section.experts ul li .img img.spacer { width: 150px; height: 150px;}
#pageHome section.experts ul li .img img.photo { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; border-radius: 20px;}
#pageHome section.experts ul li .name { font-size: 2.0rem; font-weight: 600; margin-bottom: 10px; text-align: center;}
#pageHome section.experts ul li p { line-height: 1.8; color: #666; text-align: left;}
#pageHome section.experts ul li:last-of-type { background: none; box-shadow: none; padding: 0; display: flex; justify-content: center; align-items: center;}
#pageHome section.experts ul li:last-of-type:hover { transform: scale(1.0);}
#pageHome section.experts ul li:last-of-type a { display: block; width: 100%; text-align: center; background: #fff; border: 2px solid #c19648; color: #c19648; border-radius: 30px; padding: 15px 0; font-size: 1.8rem; font-weight: 600; text-decoration: none; transition: 0.3s;}
#pageHome section.experts ul li:last-of-type a:hover { background: #c19648; color: #fff; transition: 0.3s;}

#pageHome section.topics { padding: 50px 0; background: #f7f8f9;}
#pageHome section.topics > .inner { width: 100%; padding: 0 20px;}
#pageHome section.topics h2 { font-size: 2.8rem; font-weight: 700; text-align: center; margin-bottom: 30px;}
#pageHome section.topics ul { list-style: none;}
#pageHome section.topics ul li { width: 100%; background: #fff; padding: 20px; transition: 0.3s;}
#pageHome section.topics ul li + li { margin-top: 20px;}
#pageHome section.topics ul li:hover { box-shadow: 0 0 8px #ccc; transition: 0.3s;}
#pageHome section.topics ul li a { text-decoration: none;}
#pageHome section.topics ul li .date { font-family: 'Noto Sans', sans-serif; font-size: 1.4rem; color: #c19648; margin-bottom: 30px;}
#pageHome section.topics ul li .title { font-size: 2.0rem; line-height: 1.5; color: #c19648; margin-bottom: 30px;}
#pageHome section.topics ul li .btn { display: inline-block; background: #c19648; color: #fff; border-radius: 30px; padding: 15px 40px; font-size: 1.5rem; font-weight: 600; text-decoration: none; margin-bottom: 30px; transition: 0.3s;}
#pageHome section.topics ul li:hover .btn { background: #fff; color: #c19648; outline: 1px solid #c19648; transition: 0.3s;}
#pageHome section.topics ul li .img { position: relative;}
#pageHome section.topics ul li .img img.spacer { width: 100%; height: auto;}
#pageHome section.topics ul li .img img.photo { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover;}

/* NOTE: pageAbout */
#pageAbout section.hero { width: 100%; height: 60vh; position: relative;}
#pageAbout section.hero .bg { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; z-index: -2;}
#pageAbout section.hero .overlay { position: absolute; top: 0; left: 0; bottom: 0; right: 0; background: rgba(0, 0, 0, 0.3); z-index: -1;}
#pageAbout section.hero .inner { width: 100%; height: 60vh; display: flex; align-items: center;}
#pageAbout section.hero .inner .txt { width: 100%; color: #fff; padding: 0 30px;}
#pageAbout section.hero .inner .txt .mi { font-size: 2.8rem; font-weight: 500; letter-spacing: 0.3rem; line-height: 1.3; margin-bottom: 20px;}
#pageAbout section.hero .inner .txt p { font-size: 1.6rem; line-height: 1.8;}

#pageAbout section.column { width: 100%; position: relative;}
#pageAbout section.column .bg { opacity: 0;}
#pageAbout section.column .bg.active { opacity: 1;}
#pageAbout section.column .bg1-1 { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; z-index: -3;}
#pageAbout section.column .bg1-2 { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; z-index: -2; clip-path: inset(0 0 75% 0); filter: blur(10px);}
#pageAbout section.column .bg2-1 { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; z-index: -3;}
#pageAbout section.column .bg2-2 { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; z-index: -2; clip-path: inset(25% 0 50% 0); filter: blur(10px);}
#pageAbout section.column .bg3-1 { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; z-index: -3;}
#pageAbout section.column .bg3-2 { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; z-index: -2; clip-path: inset(50% 0 25% 0); filter: blur(10px);}
#pageAbout section.column .bg4-1 { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; z-index: -3;}
#pageAbout section.column .bg4-2 { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; z-index: -2; clip-path: inset(75% 0 0 0); filter: blur(10px);}

#pageAbout section.column .overlay { position: absolute; top: 0; left: 0; bottom: 0; right: 0; background: rgba(0, 0, 0, 0.3); z-index: -1;}
#pageAbout section.column > .inner { }
#pageAbout section.column ul { list-style: none;}
#pageAbout section.column ul li { width: 100%; height: 300px; display: flex; justify-content: center; align-items: center; flex-direction: column; padding: 0 30px;}
#pageAbout section.column ul li.active { background: rgba(0, 0, 0, 0.3);}
#pageAbout section.column ul li .mi { font-size: 2.4rem; font-weight: 700; color: #fff; margin-bottom: 30px;}
#pageAbout section.column ul li p { font-size: 1.8rem; line-height: 1.8; color: #fff;}

#pageAbout section.expert { padding: 50px 0; background: #f7f8f9; position: relative;}
.anchor { position: absolute; top: -70px;}
#pageAbout section.expert > .inner { }
#pageAbout section.expert h2 { font-size: 2.8rem; font-weight: 700; text-align: center; margin-bottom: 30px;}
#pageAbout section.expert ul.main { list-style: none;}
#pageAbout section.expert ul.main > li { padding: 40px 20px; background: #fff;}
#pageAbout section.expert ul.main > li:nth-of-type(2) { background: #f7f7f7; padding: 40px 20px 0 20px;}
#pageAbout section.expert ul li .img { width: 60%; margin: 0 20%; position: relative; border-radius: 10px; overflow: hidden; margin-bottom: 20px; display: flex; justify-content: center; align-items: center;}
#pageAbout section.expert ul li .img img.spacer { width: 100%; height: auto;}
#pageAbout section.expert ul li .img img.photo { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover;}
#pageAbout section.expert ul li .txt1 { width: 100%; margin-bottom: 20px;}
#pageAbout section.expert ul li .txt1 .mi { font-size: 2.4rem; font-weight: 700; margin-bottom: 20px; text-align: center;}
#pageAbout section.expert ul li .txt1 p { font-size: 1.8rem; font-weight: 500; line-height: 1.8;}
/* #pageAbout section.expert ul li .txt2 { width: 100%;}
#pageAbout section.expert ul li .txt2 ul { padding-left: 20px;}
#pageAbout section.expert ul li .txt2 ul li { line-height: 1.4;}
#pageAbout section.expert ul li .txt2 ul li + li { margin-top: 20px;} */

#pageAbout section.collaborating { padding: 50px 20px; background: #f7f8f9;}
#pageAbout section.collaborating > .inner { }
#pageAbout section.collaborating h2 { font-size: 2.8rem; font-weight: 700; text-align: center; margin-bottom: 30px;}
#pageAbout section.collaborating .swiper { width: 100%; height: auto;}
#pageAbout section.collaborating .swiper-wrapper { width: 100%; height: auto;}
#pageAbout section.collaborating .swiper-wrapper li { background: #fff; padding: 20px; border-radius: 10px;}
#pageAbout section.collaborating .swiper-wrapper li .txt { width: 100%; display: flex; justify-content: center; flex-direction: column; margin-bottom: 20px;}
#pageAbout section.collaborating .swiper-wrapper li .txt .mi { font-size: 2.8rem; font-weight: 700; margin-bottom: 30px; text-align: center;}
#pageAbout section.collaborating .swiper-wrapper li .txt p { font-size: 1.8rem; line-height: 1.8;}
#pageAbout section.collaborating .swiper-wrapper li .img { width: 100%;}
#pageAbout section.collaborating .swiper-wrapper li .img img { width: 100%; height: 100%; object-fit: cover; border-radius: 10px;}
#pageAbout section.collaborating .thumslider { text-align: center; list-style: none; margin-top: 10px;}
#pageAbout section.collaborating .thumslider li {}
#pageAbout section.collaborating .thumslider li + li { margin-top: 10px;}
#pageAbout section.collaborating .thumslider li a { display: block; background: #fff; border: 2px solid #c19648; padding: 12px 20px; text-decoration: none; color: #c19648; font-size: 1.8rem; border-radius: 5px;}
#pageAbout section.collaborating .thumslider li.active a { background: #c19648; color: #fff;}

/* NOTE: pageProduct */
#pageProduct section.hero { width: 100%; height: 100vh; position: relative; overflow: hidden; display: flex; justify-content: center; align-items: center; flex-direction: column;}
#pageProduct section.hero .bg { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; z-index: -1;}
#pageProduct section.hero .inner { width: 100%;}
#pageProduct section.hero .inner .txt { width: 100%; color: #fff; padding: 0 20px; margin-bottom: 30px;}
#pageProduct section.hero .inner .txt .name { font-size: 2.8rem; font-weight: 500; letter-spacing: 0.3rem; line-height: 1.2; margin-bottom: 20px; text-align: center;}
#pageProduct section.hero .inner .txt .mi { font-size: 1.8rem; line-height: 1.5; margin-bottom: 10px; text-align: center;}
#pageProduct section.hero .inner .txt p { font-size: 1.6rem; line-height: 1.5; text-align: center;}
#pageProduct section.hero .inner .txt .btn { margin-top: 30px; text-align: center;}
#pageProduct section.hero .inner .txt .btn a { font-size: 1.8rem; display: inline-block; background: #fff; color: #c19648; font-weight: 600; padding: 10px 30px; border-radius: 30px; text-decoration: none; transition: 0.3s;}
#pageProduct section.hero .inner .txt .btn a:hover { background: #c19648; color: #fff; transition: 0.3s;}
#pageProduct section.hero .inner .img { text-align: center;}
#pageProduct section.hero .img img { height: 180px;}
#pageProduct section.hero .img img + img { margin-left: 10px;}
#pageProduct section.hero .link { display: flex; justify-content: center; align-items: center; padding: 0 20px; margin-top: 30px;}
#pageProduct section.hero ul { display: flex; background: rgba(255, 255,255, 0.1); border-radius: 20px; list-style: none;}
#pageProduct section.hero ul li { display: inline-block;}
#pageProduct section.hero ul li + li { margin-left: 10px;}
#pageProduct section.hero ul li a { display: inline-block; border-radius: 20px; padding: 10px 10px; color: #fff; font-weight: 600; text-decoration: none;}
#pageProduct section.hero ul li.active a { background: #967e3e;}
#pageProduct section.hero ul li a:hover { background: #967e3e;}

#pageProduct section.slider1 { width: 100%; background: #fff; padding: 50px 30px; overflow: hidden;}
#pageProduct section.slider1 h2 { font-size: 2.8rem; font-weight: 700; text-align: center; margin-bottom: 30px;}
#pageProduct section.slider1 .swiper { width: 100%; box-shadow: 0 0 8px #ccc;}
#pageProduct section.slider1 .swiper-wrapper { width: 100%;}
#pageProduct section.slider1 .swiper-wrapper li { background: #fff;}

#pageProduct section.slider1 .swiper-wrapper li .txt { width: 100%; padding: 20px;}
#pageProduct section.slider1 .swiper-wrapper li .txt .mi { font-size: 2.4rem; font-weight: 700; text-align: center; margin-bottom: 30px;}
#pageProduct section.slider1 .swiper-wrapper li .txt p { font-size: 1.8rem; line-height: 1.8;}
#pageProduct section.slider1 .swiper-wrapper li .txt p span { color: #c19648;}
#pageProduct section.slider1 .swiper-wrapper li .img { width: 100%; height: auto;}
#pageProduct section.slider1 .swiper-wrapper li .img img { width: 100%; height: 100%; object-fit: cover;}
#pageProduct section.slider1 .thumslider { list-style: none; margin-top: 20px;}
#pageProduct section.slider1 .thumslider li {}
#pageProduct section.slider1 .thumslider li + li { margin-top: 5px;}
#pageProduct section.slider1 .thumslider li a { display: block; background: #fff; border: 2px solid #c19648; padding: 12px 20px; text-decoration: none; color: #c19648; font-size: 1.8rem; border-radius: 5px; text-align: center;}
#pageProduct section.slider1 .thumslider li.active a { background: #c19648; color: #fff;}

#pageProduct section.effects { background: #fff; width: 100%; padding: 0 0 0 0; position: relative; overflow: hidden;}
#pageProduct section.effects > .inner { }
#pageProduct section.effects h2 { font-size: 2.8rem; font-weight: 700; text-align: center; margin-bottom: 30px;}
#pageProduct section.effects .block { padding: 50px 20px;}
#pageProduct section.effects .block .inner { width: 100%;}
#pageProduct section.effects .block .img { width: 100%;}
#pageProduct section.effects .block .img img { width: 100%; height: auto; border-radius: 20px;}
#pageProduct section.effects .block .txt { width: 100%; margin-top: 30px;}
#pageProduct section.effects .block .txt .mi { font-size: 2.4rem; font-weight: 600; margin-bottom: 20px;}
#pageProduct section.effects .block .txt p { font-size: 1.8rem; line-height: 1.8;}
#pageProduct section.effects .block:nth-of-type(2n) { background: #f6f6f6;}
#pageProduct section.effects .block:nth-of-type(2n) .inner { flex-direction: row-reverse;}
#pageProduct section.effects .block:nth-of-type(2n) .txt { padding-left: 0;}

#pageProduct section.effects .block.target .img { transform: translateX(-50px); transition: 0.5s; opacity: 0;}
#pageProduct section.effects .block.target.active .img { transform: none; transition: 0.5s; opacity: 1;}
#pageProduct section.effects .block.target .txt { transform: translateX(50px); transition: 0.5s; opacity: 0;}
#pageProduct section.effects .block.target.active .txt { transform: none; transition: 0.5s; opacity: 1;}

#pageProduct section.effects .block:nth-of-type(2n).target .img { transform: translateX(50px); transition: 0.5s; opacity: 0;}
#pageProduct section.effects .block:nth-of-type(2n).target.active .img { transform: none; transition: 0.5s; opacity: 1;}
#pageProduct section.effects .block:nth-of-type(2n).target .txt { transform: translateX(-50px); transition: 0.5s; opacity: 0;}
#pageProduct section.effects .block:nth-of-type(2n).target.active .txt { transform: none; transition: 0.5s; opacity: 1;}

#pageProduct section.features { background: #fff; width: 100%; padding: 50px 20px 0 20px; position: relative;}
#pageProduct section.features > .inner { width: 100%;}
#pageProduct section.features h2 { font-size: 2.8rem; font-weight: 700; text-align: center; margin-bottom: 30px;}
#pageProduct section.features ul { list-style: none;}
#pageProduct section.features ul li { width: 100%; background: #fff; box-shadow: 0 0 8px #ccc; padding: 20px; margin-top: 10px; transition: 0.3s;}
#pageProduct section.features ul li:hover { transform: translateY(-10px); transition: 0.3s;}
#pageProduct section.features ul .img { width: 80%; margin: 0 10%;}
#pageProduct section.features ul .img img { width: 100%; height: auto; border-radius: 5px;}
#pageProduct section.features ul .txt { display: flex; justify-content: center; flex-direction: column;}
#pageProduct section.features ul .txt .mi { font-size: 2.2rem; font-weight: 600; margin-bottom: 10px; margin-top: 20px;}
#pageProduct section.features ul .txt p { font-size: 1.6rem; line-height: 1.8; color: #666;}

#pageProduct section.authority { background: #fff; width: 100%; padding: 50px 20px; position: relative; overflow: hidden;}
#pageProduct section.authority > .inner { }
#pageProduct section.authority h2 { font-size: 2.8rem; font-weight: 700; text-align: center; margin-bottom: 30px; overflow: hidden;}
#pageProduct section.authority .block { width: 100%; padding: 20px 0; border-bottom: 1px solid #eee; display: flex; justify-content: center; align-items: center; flex-direction: column;}
#pageProduct section.authority .block .icon { font-size: 4.4rem; background: #f2f7fb; width: 100px; height: 100px; display: flex; justify-content: center; align-items: center; border-radius: 100%; margin-bottom: 30px;}
#pageProduct section.authority .block .txt { width: 100%;}
#pageProduct section.authority .block .txt .mi { font-size: 2.4rem; font-weight: 600; text-align: center; margin-bottom: 10px;}
#pageProduct section.authority .block .txt p { font-size: 1.8rem; line-height: 1.8;}

#pageProduct section.authority .block.target .icon { transform: translateX(-50px); transition: 0.5s; opacity: 0;}
#pageProduct section.authority .block.target.active .icon { transform: none; transition: 0.5s; opacity: 1;}
#pageProduct section.authority .block.target .txt { transform: translateX(50px); transition: 0.5s; opacity: 0;}
#pageProduct section.authority .block.target.active .txt { transform: none; transition: 0.5s; opacity: 1;}

#pageProduct section.slider2 { width: 100%; padding: 30px 0; overflow: hidden;}
#pageProduct section.slider2 h2 { font-size: 2.8rem; font-weight: 700; text-align: center; margin-bottom: 30px; padding: 0 20px;}
#pageProduct section.slider2 .inner { padding: 30px 0; background: #f9f8f5; }
#pageProduct section.slider2 .swiper1 { width: 100%; height: 100px;}
#pageProduct section.slider2 .swiper2 { width: 100%; height: 100px; margin-top: 30px;}
#pageProduct section.slider2 .swiper-wrapper { width: 100%; height: 100px; transition-timing-function: linear;}
#pageProduct section.slider2 .swiper-wrapper li { width: 100px; height: 100px; border-radius: 100%; overflow: hidden; position: relative;}
#pageProduct section.slider2 .swiper-wrapper li + li { margin-left: 50px;}
#pageProduct section.slider2 .swiper-wrapper li img.spacer { width: 100%; height: auto;}
#pageProduct section.slider2 .swiper-wrapper li img.photo { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover;}
#pageProduct section.slider2 .swiper-wrapper li:hover .txt { opacity: 1; transition: 0.3s;}
#pageProduct section.slider2 .swiper-wrapper li:hover { transform: scale(1.2); transition: 0.3s;}
#pageProduct section.slider2 .swiper-wrapper li .txt { cursor: pointer; opacity: 0; position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; background: rgba(0,0,0,0.7); padding: 15px; display: flex; justify-content: center; align-items: center; flex-direction: column; transition: 0.3s;}
#pageProduct section.slider2 .swiper-wrapper li .txt .mi { color: #fff; font-size: 1.1rem; line-height: 1.0; font-weight: 600; text-align: center; margin-bottom: 5px; font-feature-settings: "palt";}
#pageProduct section.slider2 .swiper-wrapper li .txt p { color: #fff; font-size: 1.0rem; line-height: 1.3; text-align: center; font-feature-settings: "palt";}

#pageProduct section.comparison { background: #fff; width: 100%; padding: 50px 20px; position: relative; overflow: hidden;}
#pageProduct section.comparison > .inner { }
#pageProduct section.comparison h2 { font-size: 2.8rem; font-weight: 700; text-align: center; margin-bottom: 30px;}
#pageProduct section.comparison .inner { width: 100%;}
#pageProduct section.comparison .block { display: flex;}
#pageProduct section.comparison .block:first-of-type div { background: #f6e9cd; color: #c19648;}
#pageProduct section.comparison .block div { width: 33.3%; padding: 20px 5px; font-size: 1.6rem; font-weight: 600; line-height: 1.3; text-align: center; display: flex; justify-content: center; align-items: center;}
#pageProduct section.comparison .block:not(:first-of-type) div:first-of-type { color: #000; background: #f3f4f6;}
#pageProduct section.comparison .block:not(:first-of-type) div:nth-of-type(2) { color: #368237; background: #fff1f1;}
#pageProduct section.comparison .block:not(:first-of-type) div:nth-of-type(3) { color: #cb2d2d; background: #f2fbf4;}
#pageProduct section.comparison .block:first-of-type div:first-of-type { border-radius: 20px 0 0 0;}
#pageProduct section.comparison .block:first-of-type div:last-of-type { border-radius: 0 20px 0 0;}
#pageProduct section.comparison .block:last-of-type div:first-of-type { border-radius: 0 0 0 20px;}
#pageProduct section.comparison .block:last-of-type div:last-of-type { border-radius: 0 0 20px 0;}
#pageProduct section.comparison .block a { display: block; width: 100%; color: #c19648; padding: 5px; border: 2px solid #c19648; text-decoration: none; border-radius: 30px; transition: 0.3s;}
#pageProduct section.comparison .block a:hover { background: #c19648; color: #fff; transition: 0.3s;}

#pageProduct section.users { background: #fff; width: 100%; padding: 0 20px 50px 20px; position: relative;}
#pageProduct section.users > .inner { width: 100%;}
#pageProduct section.users h2 { font-size: 3.0rem; font-weight: 700; text-align: center; margin-bottom: 30px;}
#pageProduct section.users ul { list-style: none;}
#pageProduct section.users ul li { width: 100%; background: #fff; box-shadow: 0 0 5px #ccc; padding: 20px; margin-top: 20px;}
#pageProduct section.users ul li .mi { font-size: 1.8rem; font-weight: 600; margin-bottom: 5px;}
#pageProduct section.users ul li p { line-height: 1.5; color: #666;}

#pageProduct section.usage { background: #fff; width: 100%; padding: 0 20px 50px 20px; position: relative; overflow: hidden;}
#pageProduct section.usage > .inner { width: 100%;}
#pageProduct section.usage h2 { font-size: 2.8rem; font-weight: 700; text-align: center; margin-bottom: 30px;}
#pageProduct section.usage ul { list-style: none;}
#pageProduct section.usage ul li { width: 100%;}
#pageProduct section.usage ul li + li { margin-top: 5%;}
#pageProduct section.usage ul li .mi { font-size: 2.0rem; font-weight: 600; color: #c19648; padding-bottom: 20px; border-bottom: 1px solid #ccc;}
#pageProduct section.usage ul li p { line-height: 1.8; margin-top: 20px;}
#pageProduct section.usage ul.sub { padding-left: 20px; list-style: circle; margin-top: 20px;}

#pageProduct section.usage ul li.target .mi { transform: translateX(-30px); transition: 0.5s; opacity: 0;}
#pageProduct section.usage ul li.target.active .mi { transform: none; transition: 0.5s; opacity: 1;}
#pageProduct section.usage ul li.target p { transform: translateX(30px); transition: 0.5s; opacity: 0;}
#pageProduct section.usage ul li.target.active p { transform: none; transition: 0.5s; opacity: 1;}
#pageProduct section.usage ul li.target ul.sub { transform: translateX(30px); transition: 0.5s; opacity: 0;}
#pageProduct section.usage ul li.target.active ul.sub { transform: none; transition: 0.5s; opacity: 1;}

#pageProduct section.series { background: #fff; width: 100%; padding: 0 20px 50px 20px; position: relative;}
#pageProduct section.series > .inner { width: 100%;}
#pageProduct section.series h2 { font-size: 2.8rem; font-weight: 700; text-align: center; margin-bottom: 30px;}
#pageProduct section.series p.com { margin-top: 10px;}
#pageProduct section.series .block { width: 100%; background: #fff; padding: 20px; box-shadow: 0 0 8px #ccc; transition: 0.3s; margin-top: 20px;}
#pageProduct section.series .block:hover { transform: translateY(-10px); transition: 0.3s;}
#pageProduct section.series .block:nth-of-type(2n) { margin-right: 0;}
#pageProduct section.series .block .title { margin-bottom: 20px;}
#pageProduct section.series .block .title .name { width: 100%; font-size: 2.2rem; font-weight: 700; color: #c19648; line-height: 1.3; margin-bottom: 10px;}
#pageProduct section.series .block .title .spec { width: 100%; font-size: 1.4rem; line-height: 1.3;}
#pageProduct section.series .block .title .spec span { display: inline-block; margin-right: 5px; font-weight: 600; color: #c19648;}
#pageProduct section.series .block .line { display: flex; margin-bottom: 5px;}
#pageProduct section.series .block .line span:nth-of-type(1) { display: inline-block; font-weight: 600; margin-right: 10px;}
#pageProduct section.series .block .line span:nth-of-type(2) { flex: 1; display: inline-block; position: relative;}
#pageProduct section.series .block .line span:nth-of-type(2):after { content: ''; position: absolute; top: 50%; display: inline-block; width: 100%; height: 2px; background: #c19648; right: 0;}
#pageProduct section.series .block ul { list-style: none;}
#pageProduct section.series .block ul li { display: flex; background: #c19648; color: #fff; padding: 5px 0;}
#pageProduct section.series .block ul li span { display: block; width: 30px; display: flex; justify-content: center; align-items: center;}
#pageProduct section.series .block ul li p { flex: 1; font-weight: 500; line-height: 1.4;}
#pageProduct section.series .block ul li:nth-of-type(2n) { background: #f4f4f4; color: #c19648;}
#pageProduct section.series .block .txt { padding: 20px 0; font-size: 2.0rem; font-weight: 600; color: #ebddcf; line-height: 1.3; text-align: center;}
#pageProduct section.series .block .img { width: 100%;}
#pageProduct section.series .block .img img  { width: 100%;}

/* NOTE: pageRd */
#pageRd section.hero { width: 100%; height: 60vh; position: relative;}
#pageRd section.hero .bg { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; z-index: -2;}
#pageRd section.hero .overlay { position: absolute; top: 0; left: 0; bottom: 0; right: 0; background: rgba(0, 0, 0, 0.3); z-index: -1;}
#pageRd section.hero .inner { width: 100%; height: 60vh; display: flex; align-items: center;}
#pageRd section.hero .inner .txt { width: 100%; color: #fff; padding: 0 30px;}
#pageRd section.hero .inner .txt .mi { font-size: 2.8rem; font-weight: 500; letter-spacing: 0.3rem; line-height: 1.3; margin-bottom: 20px;}
#pageRd section.hero .inner .txt p { font-size: 1.6rem; line-height: 1.8;}

#pageRd section.effects { background: #fff; width: 100%; padding: 30px 0 0 0; position: relative; overflow: hidden;}
#pageRd section.effects > .inner { }
#pageRd section.effects h2 { font-size: 2.8rem; font-weight: 700; text-align: center; margin-bottom: 30px;}
#pageRd section.effects .block { padding: 50px 20px;}
#pageRd section.effects .block .inner { width: 100%;}
#pageRd section.effects .block .img { width: 100%;}
#pageRd section.effects .block .img img { width: 100%; height: auto; border-radius: 20px;}
#pageRd section.effects .block .txt { width: 100%; margin-top: 30px;}
#pageRd section.effects .block .txt .mi { font-size: 2.4rem; font-weight: 600; margin-bottom: 20px;}
#pageRd section.effects .block .txt p { font-size: 1.8rem; line-height: 1.8;}
#pageRd section.effects .block:nth-of-type(2n) { background: #f6f6f6;}
#pageRd section.effects .block:nth-of-type(2n) .inner { flex-direction: row-reverse;}
#pageRd section.effects .block:nth-of-type(2n) .txt { padding-left: 0;}

#pageRd section.effects .block.target .img { transform: translateX(-50px); transition: 0.5s; opacity: 0;}
#pageRd section.effects .block.target.active .img { transform: none; transition: 0.5s; opacity: 1;}
#pageRd section.effects .block.target .txt { transform: translateX(50px); transition: 0.5s; opacity: 0;}
#pageRd section.effects .block.target.active .txt { transform: none; transition: 0.5s; opacity: 1;}

/* 新增：研发页面Hero Section更新 */
#pageRd section.hero .inner .txt .sub { font-size: 1.6rem; font-weight: 400; letter-spacing: 0.1rem; margin-bottom: 12px; opacity: 0.9;}
#pageRd section.effects .block .txt .patent { font-size: 1.3rem; color: #c19648; margin-bottom: 12px; font-weight: 500;}

/* 新增：研发理念模块 */
#pageRd section.rd-philosophy { background: #f8f9fa; padding: 40px 20px;}
#pageRd section.rd-philosophy .inner { width: 100%;}
#pageRd section.rd-philosophy ul { list-style: none; display: flex; flex-wrap: wrap; gap: 15px;}
#pageRd section.rd-philosophy ul li { width: calc(50% - 8px); background: #fff; padding: 25px 15px; border-radius: 12px; text-align: center; box-shadow: 0 3px 12px rgba(0,0,0,0.05);}
#pageRd section.rd-philosophy ul li .icon { font-size: 2.4rem; margin-bottom: 10px;}
#pageRd section.rd-philosophy ul li .txt .mi { font-size: 1.5rem; font-weight: 600; color: #333; margin-bottom: 8px;}
#pageRd section.rd-philosophy ul li .txt p { font-size: 1.2rem; color: #666; line-height: 1.5;}
#pageRd section.rd-philosophy ul li.target { transform: translateY(20px); opacity: 0; transition: 0.5s;}
#pageRd section.rd-philosophy ul li.target.active { transform: translateY(0); opacity: 1;}

/* 新增：研发里程碑模块 */
#pageRd section.slider1 { background: linear-gradient(135deg, #1a1a2e 0%, #16213e 100%); padding: 50px 20px; color: #fff;}
#pageRd section.slider1 h2 { font-size: 2.4rem; font-weight: 700; text-align: center; margin-bottom: 30px; color: #fff;}
#pageRd section.slider1 .inner { width: 100%;}
#pageRd section.slider1 .milestoneSlider { width: 100%; height: 380px; overflow: hidden; position: relative;}
#pageRd section.slider1 .milestoneSlider .slides-wrapper { position: relative; width: 100%; height: 100%;}
#pageRd section.slider1 .milestoneSlider .slide { display: flex; flex-direction: column; padding: 20px; height: 380px; box-sizing: border-box;}
#pageRd section.slider1 .milestoneSlider .slide .img { width: 100%; margin-bottom: 20px;}
#pageRd section.slider1 .milestoneSlider .slide .img img { width: 100%; height: 180px; object-fit: cover; border-radius: 10px;}
#pageRd section.slider1 .milestoneSlider .slide .txt { width: 100%;}
#pageRd section.slider1 .milestoneSlider .slide .txt .mi { font-size: 1.8rem; font-weight: 600; margin-bottom: 15px; color: #c19648;}
#pageRd section.slider1 .milestoneSlider .slide .txt p { font-size: 1.4rem; line-height: 1.7; color: rgba(255,255,255,0.85);}
#pageRd section.slider1 .thumslider { list-style: none; display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; margin-top: 25px;}
#pageRd section.slider1 .thumslider li a { display: inline-block; padding: 8px 16px; background: rgba(255,255,255,0.1); border-radius: 20px; color: rgba(255,255,255,0.7); text-decoration: none; font-size: 1.2rem; transition: 0.3s;}
#pageRd section.slider1 .thumslider li a:hover,
#pageRd section.slider1 .thumslider li a.active { background: #c19648; color: #fff;}

/* 新增：品质认证模块 */
#pageRd section.authority { background: #fff; padding: 40px 20px;}
#pageRd section.authority .inner { width: 100%;}
#pageRd section.authority .inner > h2 { font-size: 2.4rem; font-weight: 700; text-align: center; margin-bottom: 25px;}
#pageRd section.authority .inner > .block { display: flex; align-items: flex-start; background: #f8f9fa; padding: 20px; border-radius: 10px; margin-bottom: 15px;}
#pageRd section.authority .inner > .block .icon { font-size: 2.2rem; margin-right: 15px; flex-shrink: 0;}
#pageRd section.authority .inner > .block .txt .mi { font-size: 1.5rem; font-weight: 600; color: #333; margin-bottom: 6px;}
#pageRd section.authority .inner > .block .txt p { font-size: 1.3rem; color: #666; line-height: 1.6;}
#pageRd section.authority .inner > .block.target { transform: translateX(-20px); opacity: 0; transition: 0.4s;}
#pageRd section.authority .inner > .block.target.active { transform: translateX(0); opacity: 1;}

/* 新增：研发实力数据模块 */
#pageRd section.rd-stats { background: linear-gradient(135deg, #c19648 0%, #d4a85a 100%); padding: 50px 20px;}
#pageRd section.rd-stats .inner { width: 100%;}
#pageRd section.rd-stats h2 { font-size: 2.4rem; font-weight: 700; text-align: center; color: #fff; margin-bottom: 35px;}
#pageRd section.rd-stats ul { list-style: none; display: flex; flex-wrap: wrap; gap: 15px;}
#pageRd section.rd-stats ul li { width: calc(50% - 8px); text-align: center; background: rgba(255,255,255,0.15); padding: 25px 15px; border-radius: 10px;}
#pageRd section.rd-stats ul li .number { font-size: 3.2rem; font-weight: 700; color: #fff; line-height: 1;}
#pageRd section.rd-stats ul li .number span { font-size: 1.8rem;}
#pageRd section.rd-stats ul li .label { font-size: 1.4rem; font-weight: 600; color: #fff; margin: 10px 0 5px;}
#pageRd section.rd-stats ul li p { font-size: 1.1rem; color: rgba(255,255,255,0.8);}
#pageRd section.rd-stats ul li.target { transform: translateY(20px); opacity: 0; transition: 0.5s;}
#pageRd section.rd-stats ul li.target.active { transform: translateY(0); opacity: 1;}

/* 新增：研究合作机构模块 */
#pageRd section.collaborating { background: #f8f9fa; padding: 50px 20px;}
#pageRd section.collaborating h2 { font-size: 2.4rem; font-weight: 700; text-align: center; margin-bottom: 30px; color: #333;}
#pageRd section.collaborating .inner { width: 100%;}
#pageRd section.collaborating .partnerSlider { width: 100%; height: 380px; overflow: hidden; background: #fff; border-radius: 12px; box-shadow: 0 3px 15px rgba(0,0,0,0.06); position: relative;}
#pageRd section.collaborating .partnerSlider .slides-wrapper { position: relative; width: 100%; height: 100%;}
#pageRd section.collaborating .partnerSlider .slide { display: flex; flex-direction: column; padding: 25px 20px; height: 380px; box-sizing: border-box;}
#pageRd section.collaborating .partnerSlider .slide .img { width: 100%; margin-bottom: 20px;}
#pageRd section.collaborating .partnerSlider .slide .img img { width: 100%; height: 160px; object-fit: cover; border-radius: 10px;}
#pageRd section.collaborating .partnerSlider .slide .txt { width: 100%;}
#pageRd section.collaborating .partnerSlider .slide .txt .mi { font-size: 1.8rem; font-weight: 600; margin-bottom: 15px; color: #c19648;}
#pageRd section.collaborating .partnerSlider .slide .txt p { font-size: 1.4rem; line-height: 1.7; color: #555;}
#pageRd section.collaborating .thumslider { list-style: none; display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; margin-top: 25px;}
#pageRd section.collaborating .thumslider li a { display: inline-block; padding: 8px 16px; background: #e8e8e8; border-radius: 20px; color: #666; text-decoration: none; font-size: 1.2rem; transition: 0.3s;}
#pageRd section.collaborating .thumslider li a:hover,
#pageRd section.collaborating .thumslider li a.active { background: #c19648; color: #fff;}

#pageProduct section.effects .block:nth-of-type(2n).target .img { transform: translateX(50px); transition: 0.5s; opacity: 0;}
#pageProduct section.effects .block:nth-of-type(2n).target.active .img { transform: none; transition: 0.5s; opacity: 1;}
#pageProduct section.effects .block:nth-of-type(2n).target .txt { transform: translateX(-50px); transition: 0.5s; opacity: 0;}
#pageProduct section.effects .block:nth-of-type(2n).target.active .txt { transform: none; transition: 0.5s; opacity: 1;}

/* NOTE: pageRdfeedback */
#pageRdfeedback section.hero { width: 100%; height: 60vh; position: relative;}
#pageRdfeedback section.hero .bg { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; z-index: -2;}
#pageRdfeedback section.hero .overlay { position: absolute; top: 0; left: 0; bottom: 0; right: 0; background: rgba(0, 0, 0, 0.3); z-index: -1;}
#pageRdfeedback section.hero .inner { width: 100%; height: 60vh; display: flex; align-items: center;}
#pageRdfeedback section.hero .inner .txt { width: 100%; color: #fff; padding: 0 30px;}
#pageRdfeedback section.hero .inner .txt .mi { font-size: 2.8rem; font-weight: 500; letter-spacing: 0.3rem; line-height: 1.3; margin-bottom: 20px;}
#pageRdfeedback section.hero .inner .txt p { font-size: 1.6rem; line-height: 1.8;}

/* NOTE: pageTopics */
#pageTopics section.hero { width: 100%; height: 30vh; position: relative;}
#pageTopics section.hero .bg { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; z-index: -2;}
#pageTopics section.hero .overlay { position: absolute; top: 0; left: 0; bottom: 0; right: 0; background: rgba(0, 0, 0, 0.3); z-index: -1;}
#pageTopics section.hero .inner { width: 100%; height: 30vh; display: flex; align-items: center;}
#pageTopics section.hero .inner .txt { width: 100%; color: #fff; padding: 0 30px;}
#pageTopics section.hero .inner .txt .mi { font-size: 2.8rem; font-weight: 500; letter-spacing: 0.3rem; line-height: 1.3; margin-bottom: 20px;}

#pageTopics section.tab { margin: 30px 0;}
#pageTopics section.tab > .inner { width: 100%; padding: 0 20px;}
#pageTopics section.tab ul { list-style: none;}
#pageTopics section.tab ul li + li { margin-top: 10px;}
#pageTopics section.tab ul li a { display: inline-block; padding: 5px 0; color: #888; text-decoration: none;}
#pageTopics section.tab ul li a.active { color: #c19648; border-bottom: 2px solid #c19648;}

#pageTopics section.topics { display: none; padding: 0 20px; margin-bottom: 30px;}
#pageTopics section.topics.active { display: block;}
#pageTopics section.topics > .inner { width: 100%;}
#pageTopics section.topics ul { list-style: none;}
#pageTopics section.topics ul li { width: 100%; background: #fff; box-shadow: 0 0 8px #ccc; margin-right: 5%; margin-bottom: 20px;}
#pageTopics section.topics ul li:hover img.photo { transform: scale(1.05); transition: 0.3s;}
#pageTopics section.topics ul li a { text-decoration: none;}
#pageTopics section.topics ul li .img { width: 100%; position: relative; overflow: hidden;}
#pageTopics section.topics ul li .img img.spacer { width: 100%; height: auto;}
#pageTopics section.topics ul li .img img.photo { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; transition: 0.3s;}
#pageTopics section.topics ul li .txt { padding: 20px;}
#pageTopics section.topics ul li .txt .mi { font-size: 2.0rem; font-weight: 600; line-height: 1.4; margin-bottom: 20px; color: #000;}
#pageTopics section.topics ul li .txt .date { font-family: 'Noto Sans', sans-serif; font-size: 1.5rem; font-weight: 500; line-height: 1.4; color: #ccc; margin-bottom: 20px;}
#pageTopics section.topics ul li .txt p { font-weight: 400; line-height: 1.6; color: #888;}

/* NOTE: ページャー */
#pager { text-align: center; margin-top: 30px;}
#pager .wp-pagenavi a, #pager .wp-pagenavi span { color: #fff; display: inline-block; font-size: 1.6rem; line-height: 33px; border: none !important; background: #ccc; width: 40px; height: 40px;}
#pager .wp-pagenavi a:hover { background: #1b8fcb;}
#pager .wp-pagenavi span.current { font-weight: normal; background: #1b8fcb; border: none !important;}
#pager .wp-pagenavi span.pages,
#pager .wp-pagenavi a.nextpostslink,
#pager .wp-pagenavi a.previouspostslink,
#pager .wp-pagenavi a.last,
#pager .wp-pagenavi a.first { display: none;}

/* NOTE: pageSingle */
#pageSingle section.contents { padding: 80px 0 30px 0;}
#pageSingle section > .inner { width: 90%; margin: 0 auto; padding: 20px; background: #fff; box-shadow: 0 0 8px #ccc;}
#pageSingle section.contents .date { display: inline-block; font-size: 1.5rem; letter-spacing: 1px; color: #666; padding: 20px 0;}

#pageSingle header { background: #fff;}
#pageSingle header .logo_wh { display: none;}
#pageSingle header .logo_dark { display: block;}
#pageSingle header { opacity: 1; background: #fff;}

/* NOTE: ネイティブCSS */
.native-block p { display: block; margin: 30px 0; font-size: 1.6rem; line-height: 2.0;}
.native-block a { color: #0066ff;}
.native-block strong { font-weight: bold; }
.native-block em { font-style: italic; }
.native-block h1 { font-size: 2.4rem; font-weight: 500; line-height: 1.3; margin-bottom: 30px;}
.native-block h2 { font-size: 2.2rem; font-weight: 500; margin: 50px 0 30px 0; line-height: 1.3; position: relative;}
.native-block h3 { font-size: 2.0rem; font-weight: 500; margin: 30px 0; line-height: 1.3;}
.native-block h4 { font-size: 1.8rem; font-weight: 500; margin: 20px 0; line-height: 1.3;}
.native-block h5 { font-size: 1.6rem; font-weight: 500; line-height: 1.3;}
.native-block ul { padding-left: 20px; line-height: 1.8; margin-bottom: 20px;}
.native-block ol { padding-left: 20px; line-height: 1.8; margin-bottom: 20px;}
.native-block blockquote { display: block; -webkit-margin-before: 1em; -webkit-margin-after: 1em; -webkit-margin-start: 40px; -webkit-margin-end: 40px;}
.native-block .aligncenter { display: block; width: 100%; margin: 0 auto; text-align: center;}
.native-block .alignright { float: right; margin: 0 0 10px 20px;}
.native-block .alignleft { float: left; margin: 0 20px 10px 0;}
.native-block img { max-width: 100%; height: auto;}
.native-block figure figcaption { display: block; width: 100%; text-align: center; font-size: 1.4rem;}
.native-block figure.aligncenter figcaption { display: block; width: 100%;}
.native-block hr.wp-block-separator { border-top: 1px solid #ccc; border-bottom: 0;}
.native-block figure.wp-block-image { margin: 10px 0 !important;}
.native-block figure.wp-block-table { margin: 30px 0;}

/* NOTE: pageContact */
#pageContact section.hero { width: 100%; height: 30vh; position: relative;}
#pageContact section.hero .bg { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; z-index: -2;}
#pageContact section.hero .overlay { position: absolute; top: 0; left: 0; bottom: 0; right: 0; background: rgba(0, 0, 0, 0.3); z-index: -1;}
#pageContact section.hero .inner { width: 100%; height: 30vh; display: flex; align-items: center;}
#pageContact section.hero .inner .txt { width: 100%; color: #fff; padding: 0 30px;}
#pageContact section.hero .inner .txt .mi { font-size: 2.8rem; font-weight: 500; letter-spacing: 0.3rem; line-height: 1.3; margin-bottom: 20px;}

#pageContact section.body > .inner { width: 100%; padding: 30px 30px 50px 30px;}
#pageContact section.body p { font-size: 1.5rem; line-height: 1.6;}

input, button { all: unset;}
select, textarea { font-size: 1.8rem; margin: 0; padding: 0; background: none; border: none; border-radius: 0; outline: none; -webkit-appearance: none; -moz-appearance: none; appearance: none;}
select::-ms-expand { display: none; }

input[type="text"], input[type="email"], input[type="tel"], input[type="number"], input[type="date"] { font-size: 1.8rem; height: 50px; width: 100%; text-indent: 10px; border-radius: 3px; border: 1px solid #ccc; background: #f6f6f6; align-items: center;}
textarea { width: 100%; height: 100px; padding: 10px; background: #f6f6f6; border-radius: 3px; border: 1px solid #ccc;}
button { font-size: 1.8rem; letter-spacing: 1px; display: inline-block; color: #fff; text-align: center; width: 100%; cursor: pointer; padding: 8px 0; background: #c19648; border-radius: 20px;}
button.back { background: #f48033; color: #fff;}
button + button { margin-top: 10px;}
button:hover { opacity: 0.9;}
span.error { display: inline-block !important; background: #ffe5e8; margin: 5px 0; padding: 5px 15px;font-weight: 500;}
textarea::placeholder { color: #666; font-size: 1.6rem;}

/* input[type="radio"],input[type="checkbox"] */
input[type="checkbox"], input[type="radio"] { display: none;}
span.mwform-checkbox-field-text, span.mwform-radio-field-text { position: relative; display: inline-block; padding-left: 30px; font-weight: 100;}
span.mwform-checkbox-field-text::before { content: ""; position: absolute; top: 3px; left: 0; width: 20px; height: 20px; background: #fff; border: 1px solid #ccc;}
span.mwform-radio-field-text::before { content: ""; position: absolute; top: 3px; left: 0; width: 20px; height: 20px; border-radius: 50%; background: #fff; border: 1px solid #ccc;}
input[type="checkbox"]:checked + span.mwform-checkbox-field-text::after { content: ""; position: absolute; top: 8px; left: 5px; width: 10px; height: 10px; background: #444;}
input[type="radio"]:checked + span.mwform-radio-field-text::after { content: ""; position: absolute; top: 8px; left: 5px; width: 10px; height: 10px; border-radius: 50%; background: #444;}

.vertical-item span.mwform-radio-field-text::before { top: 7px;}
.vertical-item input[type="radio"]:checked + span.mwform-radio-field-text::after { top: 12px;}

#pageContact .form { margin-top: 20px;}
#pageContact .form dl { border-bottom: 1px solid #ddd;}
#pageContact .form dl:first-of-type { border-top: 1px solid #ddd;}
#pageContact .form dl dt { line-height: 1.2; width: 100%; padding: 20px 0 0 0;}
#pageContact .form span.required { font-size: 1.1rem; line-height: 1.0; background: #fc1414; padding: 3px 7px; color: #fff; margin-right: 8px; margin-top: 2px; white-space: nowrap; border-radius: 3px;}
#pageContact .form span.any { font-size: 1.1rem; line-height: 1.0; background: #999; padding: 3px 7px; color: #fff; margin-right: 8px; margin-top: 2px; white-space: nowrap; border-radius: 3px;}
#pageContact .form dl dd { width: 100%; padding: 20px 0;}
#pageContact .form .formbt { padding: 10px 0; text-align: center;}

/* 確認画面 */
#pageContact section .mw_wp_form_confirm span.required { display: none;}
#pageContact section .mw_wp_form_confirm span.any { display: none;}
#pageContact section .mw_wp_form_confirm dl { padding-bottom: 20px;}
#pageContact section .mw_wp_form_confirm dl dd { font-size: 1.8rem; background: #f6f6f6;  border-radius: 3px; padding: 20px; margin-top: 20px;}

/* 完了画面 */
#pageContact section.thanks { text-align: center; line-height: 1.6; padding: 80px 20px;}
#pageContact section.thanks .btn { margin-top: 30px; text-align: center;}
#pageContact section.thanks .btn a { display: inline-block; text-decoration: none; text-align: center; font-size: 1.8rem; line-height: 1.0; color: #fff; padding: 12px 30px; background: #222; border-radius: 20px;}
#pageContact section.thanks .btn a:hover { background: #000;}

/* NOTE: pageNotfound */
#pageNotfound section.body { text-align: center;}
#pageNotfound section.body > .inner { width: 100%; padding: 80px 30px 50px 30px;}
#pageNotfound section.body span { font-size: 3.8rem; color: #ccc; letter-spacing: 2px;}
#pageNotfound section.body h1 { font-size: 1.8rem; font-weight: 400;}
#pageNotfound section.body p { margin: 50px 0; font-size: 1.5rem; line-height: 1.5;}
#pageNotfound section.body .btn { margin-top: 50px; text-align: center;}
#pageNotfound section.body .btn a { display: inline-block; text-decoration: none; text-align: center; font-size: 1.8rem; line-height: 1.0; color: #fff; padding: 12px 30px; background: #222; border-radius: 20px;}
#pageNotfound section.body .btn a:hover { background: #000;}

/* NOTE: pageAbout 擴展樣式 */
/* 品牌歷程 - slider1 */
#pageAbout section.slider1 { background: #fff; padding: 40px 15px; overflow: hidden;}
#pageAbout section.slider1 h2 { font-size: 2.2rem; font-weight: 700; text-align: center; margin-bottom: 20px;}
#pageAbout section.slider1 .inner { width: 100%;}
#pageAbout section.slider1 .swiper { width: 100%; height: auto; box-shadow: 0 0 6px #ccc;}
#pageAbout section.slider1 .swiper-wrapper { width: 100%; height: auto;}
#pageAbout section.slider1 .swiper-wrapper li { display: flex; flex-direction: column-reverse; background: #fff;}
#pageAbout section.slider1 .swiper-wrapper li .txt { width: 100%; padding: 25px 20px;}
#pageAbout section.slider1 .swiper-wrapper li .txt .mi { font-size: 1.8rem; font-weight: 700; margin-bottom: 15px; color: #c19648;}
#pageAbout section.slider1 .swiper-wrapper li .txt p { font-size: 1.5rem; line-height: 1.7; color: #555;}
#pageAbout section.slider1 .swiper-wrapper li .img { width: 100%; height: 180px; overflow: hidden;}
#pageAbout section.slider1 .swiper-wrapper li .img img { width: 100%; height: 100%; object-fit: cover;}
#pageAbout section.slider1 .thumslider { display: flex; flex-wrap: wrap; justify-content: center; list-style: none; margin-top: 15px; gap: 8px;}
#pageAbout section.slider1 .thumslider li a { display: inline-block; background: #fff; border: 2px solid #c19648; padding: 8px 15px; text-decoration: none; color: #c19648; font-size: 1.4rem; border-radius: 5px; transition: 0.3s;}
#pageAbout section.slider1 .thumslider li.active a { background: #c19648; color: #fff;}

/* 核心專利技術 - effects */
#pageAbout section.effects { background: #fff; width: 100%; padding: 40px 0; position: relative;}
#pageAbout section.effects > .inner { width: 100%; padding: 0 15px;}
#pageAbout section.effects > .inner > h2 { font-size: 2.2rem; font-weight: 700; text-align: center; margin-bottom: 20px;}
#pageAbout section.effects .block { padding: 25px 0;}
#pageAbout section.effects .block .inner { display: flex; flex-direction: column; width: 100%;}
#pageAbout section.effects .block .img { width: 100%; margin-bottom: 15px;}
#pageAbout section.effects .block .img img { width: 100%; height: auto; border-radius: 15px;}
#pageAbout section.effects .block .txt { width: 100%;}
#pageAbout section.effects .block .txt .mi { font-size: 1.8rem; font-weight: 600; margin-bottom: 10px;}
#pageAbout section.effects .block .txt p { font-size: 1.5rem; line-height: 1.7; color: #666;}
#pageAbout section.effects .block:nth-of-type(2n) { background: #f6f6f6;}
#pageAbout section.effects .block:nth-of-type(2n) .inner { flex-direction: column;}
#pageAbout section.effects .block.target .img { transform: translateY(-20px); transition: 0.4s; opacity: 0;}
#pageAbout section.effects .block.target.active .img { transform: none; transition: 0.4s; opacity: 1;}
#pageAbout section.effects .block.target .txt { transform: translateY(20px); transition: 0.4s; opacity: 0;}
#pageAbout section.effects .block.target.active .txt { transform: none; transition: 0.4s; opacity: 1;}

/* 品質認證/研發實力 - authority */
#pageAbout section.authority { background: #fff; width: 100%; padding: 40px 15px; position: relative;}
#pageAbout section.authority > .inner { width: 100%;}
#pageAbout section.authority > .inner > h2 { font-size: 2.2rem; font-weight: 700; text-align: center; margin-bottom: 20px;}
#pageAbout section.authority > .inner > .block { display: flex; align-items: center; width: 100%; padding: 15px 0; border-bottom: 1px solid #eee;}
#pageAbout section.authority > .inner > .block:last-child { border-bottom: none;}
#pageAbout section.authority .block .icon { font-size: 3.0rem; background: #f2f7fb; width: 70px; height: 70px; min-width: 70px; display: flex; justify-content: center; align-items: center; border-radius: 100%; margin-right: 20px;}
#pageAbout section.authority .block .txt { flex: 1; display: flex; flex-direction: column; justify-content: center;}
#pageAbout section.authority .block .txt .mi { font-size: 1.7rem; font-weight: 600; margin-bottom: 5px;}
#pageAbout section.authority .block .txt p { font-size: 1.5rem; line-height: 1.6; color: #666;}
#pageAbout section.authority .block.target .icon { transform: translateX(-30px); transition: 0.4s; opacity: 0;}
#pageAbout section.authority .block.target.active .icon { transform: none; transition: 0.4s; opacity: 1;}
#pageAbout section.authority .block.target .txt { transform: translateX(30px); transition: 0.4s; opacity: 0;}
#pageAbout section.authority .block.target.active .txt { transform: none; transition: 0.4s; opacity: 1;}

/* 產品系列 - products-grid */
#pageAbout section.products-grid { padding: 40px 15px; overflow: hidden; background: #f6f6f6;}
#pageAbout section.products-grid > .inner { width: 100%;}
#pageAbout section.products-grid > .inner > h2 { font-size: 2.2rem; font-weight: 700; text-align: center; margin-bottom: 20px;}
#pageAbout section.products-grid ul { display: flex; justify-content: center; list-style: none; gap: 15px; flex-wrap: wrap;}
#pageAbout section.products-grid ul li { width: calc(50% - 8px); background: #fff; border-radius: 10px; box-shadow: 0 0 6px #ccc; overflow: hidden; transition: 0.3s;}
#pageAbout section.products-grid ul li a { display: block; text-decoration: none; color: inherit;}
#pageAbout section.products-grid ul li .img-wrap { width: 100%; height: 100px; background: linear-gradient(135deg, #faf8f5 0%, #f0ece6 100%); display: flex; justify-content: center; align-items: center; padding: 15px;}
#pageAbout section.products-grid ul li .img-wrap img { max-width: 85%; max-height: 70px; object-fit: contain;}
#pageAbout section.products-grid ul li .txt { padding: 15px 10px; text-align: center; background: #fff;}
#pageAbout section.products-grid ul li .txt .mi { font-size: 1.5rem; font-weight: 600; color: #c19648; margin-bottom: 5px;}
#pageAbout section.products-grid ul li .txt p { font-size: 1.3rem; line-height: 1.4; color: #888;}
#pageAbout section.products-grid ul li.target { transform: translateY(15px); opacity: 0; transition: 0.4s;}
#pageAbout section.products-grid ul li.target.active { transform: translateY(0); opacity: 1;}

/* ========== FAQ Page Mobile Styles ========== */
#pageFaq section.hero { width: 100%; height: 50vh; position: relative;}
#pageFaq section.hero .bg { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; z-index: -2;}
#pageFaq section.hero .overlay { position: absolute; top: 0; left: 0; bottom: 0; right: 0; background: linear-gradient(135deg, rgba(0,0,0,0.6) 0%, rgba(0,0,0,0.3) 100%); z-index: -1;}
#pageFaq section.hero .inner { width: 100%; height: 50vh; display: flex; align-items: center; justify-content: center; padding: 0 20px;}
#pageFaq section.hero .inner .txt { width: 100%; color: #fff; text-align: center;}
#pageFaq section.hero .inner .txt .mi { font-size: 2.8rem; font-weight: 700; letter-spacing: 0.2rem; margin-bottom: 10px;}
#pageFaq section.hero .inner .txt .sub { font-size: 1.4rem; font-weight: 400; margin-bottom: 15px; opacity: 0.9;}
#pageFaq section.hero .inner .txt p { font-size: 1.4rem; line-height: 1.7;}

#pageFaq section.faq-category { background: #fff; padding: 20px 15px; border-bottom: 1px solid #eee; position: sticky; top: 60px; z-index: 90;}
#pageFaq section.faq-category .inner { width: 100%;}
#pageFaq section.faq-category .category-nav { display: flex; justify-content: flex-start; gap: 10px; overflow-x: auto; -webkit-overflow-scrolling: touch; padding-bottom: 5px;}
#pageFaq section.faq-category .category-nav::-webkit-scrollbar { display: none;}
#pageFaq section.faq-category .category-nav a { display: inline-block; padding: 10px 20px; background: #f5f5f5; color: #666; text-decoration: none; border-radius: 25px; font-size: 1.4rem; font-weight: 500; transition: 0.3s; white-space: nowrap; flex-shrink: 0;}
#pageFaq section.faq-category .category-nav a.active { background: #c19648; color: #fff;}

#pageFaq section.faq-list { padding: 50px 15px 40px;}
#pageFaq section.faq-list:nth-of-type(odd) { background: #faf9f7;}
#pageFaq section.faq-list:nth-of-type(even) { background: #fff;}
#pageFaq section.faq-list .inner { width: 100%;}
#pageFaq section.faq-list h2 { font-size: 2.4rem; font-weight: 700; text-align: center; margin-bottom: 30px; color: #333; position: relative;}
#pageFaq section.faq-list h2:after { content: ''; display: block; width: 50px; height: 3px; background: #c19648; margin: 12px auto 0;}

#pageFaq .faq-item { background: #fff; border-radius: 10px; margin-bottom: 15px; box-shadow: 0 2px 10px rgba(0,0,0,0.06); overflow: hidden; transition: 0.3s;}
#pageFaq .faq-item.target { transform: translateY(15px); opacity: 0; transition: 0.4s;}
#pageFaq .faq-item.target.active { transform: translateY(0); opacity: 1;}

#pageFaq .faq-item .question { display: flex; align-items: center; padding: 18px 15px; cursor: pointer; background: #fff; transition: 0.3s;}
#pageFaq .faq-item .q-icon { display: flex; align-items: center; justify-content: center; width: 32px; height: 32px; background: linear-gradient(135deg, #c19648 0%, #d4aa5c 100%); color: #fff; font-size: 1.6rem; font-weight: 700; border-radius: 50%; flex-shrink: 0;}
#pageFaq .faq-item .q-text { flex: 1; margin-left: 12px; font-size: 1.6rem; font-weight: 600; color: #333; line-height: 1.5;}
#pageFaq .faq-item .arrow { width: 16px; height: 16px; position: relative; flex-shrink: 0; transition: 0.3s; margin-left: 10px;}
#pageFaq .faq-item .arrow:before, #pageFaq .faq-item .arrow:after { content: ''; position: absolute; background: #999; transition: 0.3s;}
#pageFaq .faq-item .arrow:before { width: 10px; height: 2px; top: 50%; left: 50%; transform: translate(-50%, -50%) rotate(45deg);}
#pageFaq .faq-item .arrow:after { width: 10px; height: 2px; top: 50%; right: 50%; transform: translate(50%, -50%) rotate(-45deg);}
#pageFaq .faq-item.open .arrow:before { transform: translate(-50%, -50%) rotate(-45deg);}
#pageFaq .faq-item.open .arrow:after { transform: translate(50%, -50%) rotate(45deg);}

#pageFaq .faq-item .answer { display: none; padding: 0 15px 20px 15px; background: #fdf8f0;}
#pageFaq .faq-item.open .answer { display: block;}
#pageFaq .faq-item .a-icon { display: none;}
#pageFaq .faq-item .a-text p { font-size: 1.5rem; line-height: 1.7; color: #555; margin-bottom: 12px;}
#pageFaq .faq-item .a-text p:last-child { margin-bottom: 0;}
#pageFaq .faq-item .a-text ul { margin: 12px 0; padding-left: 18px;}
#pageFaq .faq-item .a-text ul li { font-size: 1.5rem; line-height: 1.7; color: #555; margin-bottom: 6px;}
#pageFaq .faq-item .a-text ul li:last-child { margin-bottom: 0;}
#pageFaq .faq-item .a-text ul li strong { color: #333;}
#pageFaq .faq-item .a-text a { color: #c19648; text-decoration: underline;}

#pageFaq section.faq-cta { background: linear-gradient(135deg, #c19648 0%, #d4aa5c 100%); padding: 50px 20px; text-align: center;}
#pageFaq section.faq-cta .inner { width: 100%;}
#pageFaq section.faq-cta h2 { font-size: 2.4rem; font-weight: 700; color: #fff; margin-bottom: 12px;}
#pageFaq section.faq-cta p { font-size: 1.5rem; color: rgba(255,255,255,0.9); margin-bottom: 25px;}
#pageFaq section.faq-cta .btn { display: inline-block; padding: 15px 40px; background: #fff; color: #c19648; font-size: 1.6rem; font-weight: 600; text-decoration: none; border-radius: 50px; transition: 0.3s;}

/* ========== Insights Page Styles ========== */
#pageInsights section.hero { width: 100%; height: 45vh; position: relative;}
#pageInsights section.hero .bg { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; z-index: -2;}
#pageInsights section.hero .overlay { position: absolute; top: 0; left: 0; bottom: 0; right: 0; background: linear-gradient(to bottom, rgba(0,0,0,0.3) 0%, rgba(0,0,0,0.7) 100%); z-index: -1;}
#pageInsights section.hero .inner { width: 100%; height: 45vh; display: flex; align-items: flex-end; justify-content: center; padding: 0 20px 40px;}
#pageInsights section.hero .inner .txt { color: #fff; text-align: center;}
#pageInsights section.hero .inner .txt .mi { font-size: 3.0rem; font-weight: 700; letter-spacing: 0.1rem; margin-bottom: 10px;}
#pageInsights section.hero .inner .txt .sub { font-size: 1.6rem; font-weight: 400; margin-bottom: 15px; opacity: 0.9;}
#pageInsights section.hero .inner .txt p { font-size: 1.4rem; line-height: 1.6; max-width: 90%; margin: 0 auto;}

#pageInsights section.insights-filter { background: #fff; padding: 20px 15px; border-bottom: 1px solid #eee; position: sticky; top: 60px; z-index: 90;}
#pageInsights section.insights-filter .inner { width: 100%;}
#pageInsights section.insights-filter .filter-nav { display: flex; gap: 10px; overflow-x: auto; padding-bottom: 5px; -webkit-overflow-scrolling: touch;}
#pageInsights section.insights-filter .filter-nav a { flex-shrink: 0; display: inline-block; padding: 10px 20px; background: #f5f5f5; color: #666; text-decoration: none; border-radius: 25px; font-size: 1.4rem; font-weight: 500; transition: 0.3s;}
#pageInsights section.insights-filter .filter-nav a.active { background: #c19648; color: #fff;}

#pageInsights section.insights-list { padding: 40px 15px 60px; background: #fff;}
#pageInsights section.insights-list .inner { width: 100%;}

#pageInsights .article-list { list-style: none; padding: 0; margin: 0;}
#pageInsights .article-item { border-bottom: 1px solid #eee;}
#pageInsights .article-item:first-child { border-top: 1px solid #eee;}
#pageInsights .article-item a { display: block; padding: 25px 15px; text-decoration: none; transition: 0.3s;}
#pageInsights .article-item .category { display: inline-block; background: rgba(193,150,72,0.15); color: #c19648; padding: 4px 10px; border-radius: 12px; font-size: 1.2rem; font-weight: 600; margin-bottom: 8px;}
#pageInsights .article-item h3 { font-size: 1.7rem; font-weight: 600; color: #333; line-height: 1.5; margin-bottom: 8px;}
#pageInsights .article-item .meta { font-size: 1.3rem; color: #999;}
#pageInsights .article-item.target { transform: translateX(-10px); opacity: 0; transition: 0.4s;}
#pageInsights .article-item.target.active { transform: translateX(0); opacity: 1;}

#pageInsights section.insights-cta { background: linear-gradient(135deg, #c19648 0%, #d4aa5c 100%); padding: 50px 20px; text-align: center;}
#pageInsights section.insights-cta .inner { width: 100%;}
#pageInsights section.insights-cta h2 { font-size: 2.4rem; font-weight: 700; color: #fff; margin-bottom: 12px;}
#pageInsights section.insights-cta p { font-size: 1.5rem; color: rgba(255,255,255,0.9); margin-bottom: 25px; line-height: 1.6;}
#pageInsights section.insights-cta .cta-buttons { display: flex; flex-direction: column; gap: 15px; align-items: center;}
#pageInsights section.insights-cta .btn { display: inline-block; padding: 15px 35px; font-size: 1.5rem; font-weight: 600; text-decoration: none; border-radius: 50px; transition: 0.3s; min-width: 200px; text-align: center;}
#pageInsights section.insights-cta .btn-primary { background: #fff; color: #c19648;}
#pageInsights section.insights-cta .btn-secondary { background: transparent; color: #fff; border: 2px solid #fff;}

/* ========== Article Page Styles ========== */
.page-article section.hero { width: 100%; height: 45vh; position: relative;}
.page-article section.hero .bg { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; z-index: -2;}
.page-article section.hero .overlay { position: absolute; top: 0; left: 0; bottom: 0; right: 0; background: linear-gradient(to bottom, rgba(0,0,0,0.3) 0%, rgba(0,0,0,0.7) 100%); z-index: -1;}
.page-article section.hero .inner { width: 100%; height: 45vh; display: flex; align-items: flex-end; justify-content: center; padding: 0 20px 40px;}
.page-article section.hero .inner .txt { color: #fff; text-align: center;}
.page-article section.hero .inner .txt .mi { font-size: 2.6rem; font-weight: 700; letter-spacing: 0.1rem; margin-bottom: 10px;}
.page-article section.hero .inner .txt .sub { font-size: 1.6rem; font-weight: 400; line-height: 1.4; max-width: 90%; margin: 0 auto;}
.page-article section.hero .inner .txt p { font-size: 1.4rem; line-height: 1.6; max-width: 90%; margin: 15px auto 0;}

.page-article section.article-content { padding: 40px 20px 60px; background: #fff;}
.page-article section.article-content .inner { width: 100%;}
.page-article section.article-content .article-meta { display: flex; gap: 15px; margin-bottom: 20px; flex-wrap: wrap;}
.page-article section.article-content .article-meta .category { display: inline-block; background: rgba(193,150,72,0.15); color: #c19648; padding: 5px 12px; border-radius: 15px; font-size: 1.2rem; font-weight: 600;}
.page-article section.article-content .article-meta .date { font-size: 1.3rem; color: #999; display: flex; align-items: center;}

.page-article section.article-content h1 { font-size: 2.4rem; font-weight: 700; color: #333; line-height: 1.4; margin-bottom: 30px; padding-bottom: 20px; border-bottom: 2px solid #eee;}
.page-article section.article-content h2 { font-size: 2.0rem; font-weight: 700; color: #333; margin: 35px 0 20px; padding-bottom: 12px; border-bottom: 2px solid #c19648;}
.page-article section.article-content h3 { font-size: 1.7rem; font-weight: 600; color: #444; margin: 30px 0 15px;}
.page-article section.article-content h4 { font-size: 1.5rem; font-weight: 600; color: #555; margin: 25px 0 12px;}
.page-article section.article-content p { font-size: 1.5rem; line-height: 1.8; color: #555; margin-bottom: 18px;}
.page-article section.article-content p strong { color: #333;}
.page-article section.article-content p em { font-style: italic;}
.page-article section.article-content ul, .page-article section.article-content ol { margin: 15px 0 25px; padding-left: 25px;}
.page-article section.article-content ul li, .page-article section.article-content ol li { font-size: 1.5rem; line-height: 1.7; color: #555; margin-bottom: 10px;}
.page-article section.article-content ul li strong, .page-article section.article-content ol li strong { color: #333;}
.page-article section.article-content blockquote { background: #faf9f7; border-left: 3px solid #c19648; padding: 20px; margin: 25px 0; border-radius: 0 8px 8px 0;}
.page-article section.article-content blockquote p { font-size: 1.4rem; color: #666; margin-bottom: 0; font-style: italic;}
.page-article section.article-content table { width: 100%; border-collapse: collapse; margin: 25px 0; font-size: 1.4rem;}
.page-article section.article-content table th, .page-article section.article-content table td { padding: 12px 10px; border: 1px solid #eee; text-align: left;}
.page-article section.article-content table th { background: #faf9f7; font-weight: 600; color: #333;}
.page-article section.article-content table td { color: #555;}