/* COMMON */
.sub-visual { overflow: hidden; position: relative; height: 720px; text-align: center; background: #000; }
.sub-visual .inner { display: flex; flex-direction: column; align-items: center; padding: 270px 0 0; max-width: 1760px; height: 100%; }
.sub-visual .background { overflow: hidden; position: absolute; top: 0; left: 0; width: 100%; height: 100%; animation: subvisualFadeIn ease .85s forwards; }
.sub-visual .background .image { display: block; position: relative; width: 100%; height: 100%; }
.sub-visual .background .image::after { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-repeat: no-repeat; background-position: center; background-size: cover !important; transform: scale(1.15); animation: 2s subVisual cubic-bezier(0.39, 0.58, 0.57, 1) forwards, 1s subVisualFade ease forwards; opacity: 0; }
.sub-visual .badge { margin-bottom: 20px; font-size: 2rem; color: #fff; }
.sub-visual .title { line-height: 1.4; font-size: 8rem; color: #fff; }
.sub-visual .eng { margin-top: 20px; font-family: var(--font-display); font-weight: 400; color: #fff; }
.sub-visual--company-introduction .background .image::after { background-image: url('/theme/basic/images/sub/visual-company-introduction.jpg'); }
.sub-visual--company-moral .background .image::after { background-image: url('/theme/basic/images/sub/visual-company-moral.jpg'); }
.sub-visual--company-esg .background .image::after { background-image: url('/theme/basic/images/sub/visual-company-esg.jpg'); }
.sub-visual--company-compliance .background .image::after { background-image: url('/theme/basic/images/sub/visual-company-compliance.jpg'); }
.sub-visual--company-partner .background .image::after { background-image: url('/theme/basic/images/sub/visual-company-partner.jpg'); }
.sub-visual--products-automotive .background .image::after { background-image: url('/theme/basic/images/sub/visual-products-automotive.jpg'); }
.sub-visual--products-motive .background .image::after { background-image: url('/theme/basic/images/sub/visual-products-motive.jpg'); }
.sub-visual--brand-rocket { background: #1d1b37; }
.sub-visual--brand-rocket .background .image::after { background-image: url('/theme/basic/images/sub/visual-brand-rocket.jpg'); }
.sub-visual--brand-dr { background: #a2670f; }
.sub-visual--brand-dr .background .image::after { background-image: url('/theme/basic/images/sub/visual-brand-dr.jpg'); }
.sub-visual--brand-maxtorm { background: #2f1507; }
.sub-visual--brand-maxtorm .background .image::after { background-image: url('/theme/basic/images/sub/visual-brand-maxtorm.jpg'); }
.sub-visual--brand-rocket .badge,
.sub-visual--brand-rocket .title,
.sub-visual--brand-rocket .eng,
.sub-visual--brand-dr .badge,
.sub-visual--brand-dr .title,
.sub-visual--brand-dr .eng,
.sub-visual--brand-maxtorm .badge,
.sub-visual--brand-maxtorm .title,
.sub-visual--brand-maxtorm .eng { display: none; }
.sub-visual--battery-management .background .image::after { background-image: url('/theme/basic/images/sub/visual-battery-management.jpg'); }
.sub-visual--battery-data .background .image::after { background-image: url('/theme/basic/images/sub/visual-battery-data.jpg'); }
.sub-visual--prcenter-news .background .image::after { background-image: url('/theme/basic/images/sub/visual-prcenter-news.jpg'); }
.sub-visual--contact .background .image::after { background-image: url('/theme/basic/images/sub/visual-contact.jpg'); }
.sub-visual--normal { height: auto !important; background: transparent; }
.sub-visual--normal .inner { padding-top: 165px; }

.breadcrumb { position: absolute; top: 130px; right: 0; }
.breadcrumb ol { display: flex; justify-content: center; }
.breadcrumb li { position: relative; padding: 0 20px; font-size: 1.4rem; color: #23323B; font-weight: 500; }
.breadcrumb li:not(:last-child)::after { content: ''; position: absolute; top: 0; bottom: 0; right: 0; margin: auto; width: 1px; height: 50%; background: rgba(35, 50, 59, 0.3); }
.breadcrumb li:last-child { padding-right: 0; }
.breadcrumb a { color: inherit; }
.breadcrumb .icon-home { display: inline-block; vertical-align: -0.2em; width: 18px; height: 18px; background-repeat: no-repeat; background-position: center; background-size: auto 100%; background-image: url('/images/home.png'); }
.breadcrumb[data-breadcrub-theme="light"] li { color: #fff; }
.breadcrumb[data-breadcrub-theme="light"] li:not(:last-child)::after { background: rgba(255, 255, 255, 0.3); }
.sub-visual-tab { overflow: hidden; position: relative; }
.sub-visual-tab::after { content: ''; position: absolute; bottom: 0; left: 0; width: 100%; height: 1px; background: #dddddd; }
.sub-visual-tab .swiper { overflow: visible; margin-right: auto; margin-left: auto; width: 90%; }
.sub-visual-tab .swiper-slide { margin-right: 60px; }
.sub-visual-tab .swiper-slide:last-child { margin-right: 0; }
.sub-visual-tab ul { display: flex; margin: auto; max-width: 1500px; width: 90%; }
.sub-visual-tab li { width: auto; }
.sub-visual-tab a { display: flex; align-items: center; justify-content: center; position: relative; padding: 10px; height: 60px; font-size: 2rem; color: #999999; font-weight: 600; }
.sub-visual-tab a::after { content: ''; position: absolute; bottom: 0; left: 0; width: 100%; height: 3px; opacity: 0; background: #000; transform: scaleX(0); transform-origin: center; transition: all ease .35s; }
.sub-visual-tab li.on a { color: #231815; }
.sub-visual-tab li.on a::after { background: var(--clr-primary); opacity: 1; transform: scaleX(1); }

.section { padding-top: 160px; padding-bottom: 160px; }
.section:last-child { padding-bottom: 200px; }
.section .section-badge { margin-bottom: 30px; font-family: var(--font-display); font-size: 2rem; font-weight: 700; color: var(--clr-primary); }
@keyframes subVisualFade {
    to { opacity: 1; }
}
@keyframes subVisual {
    to { transform: none; }
}
@media screen and (pointer: fine) {
    .sub-visual-tab a:hover::after { opacity: 1; transform: scaleX(1); }
}
@media screen and (min-width: 1025px) {
    .sub-visual-tab .swiper-wrapper { justify-content: center; }
}
@media screen and (max-width: 1024px) {
    .sub-visual { height: 400px; }
    .sub-visual .inner { padding-top: 140px; }
    .sub-visual .badge { font-size: 1.8rem; margin-bottom: 10px; }
    .sub-visual .title { font-size: 5rem; }
    .sub-visual .eng { font-size: 1.4rem; margin-top: 10px; }
    .sub-visual--normal .inner { padding-top: 140px; }

    .breadcrumb { top: 110px; }
    .breadcrumb li { font-size: 1.3rem; }

	.sub-visual-tab ul { margin: 0; max-width: none; width: 100%; }
	.sub-visual-tab li { flex: 1 0 auto; margin-right: 15px; }
	.sub-visual-tab li:last-child { margin-right: 0; }
	.sub-visual-tab a { height: 50px; font-size: 1.6rem; }
    .sub-visual-tab .swiper-slide { margin-right: 30px; }

    .section { padding-top: 120px; padding-bottom: 120px; }
	.section:last-child { padding-bottom: 160px; }
    .section .section-badge { margin-bottom: 20px; font-size: 1.9rem; }
}
@media screen and (max-width: 768px) {
    .sub-visual { height: 250px; }
    .sub-visual .inner { padding-top: 90px; }
    .sub-visual .badge { font-size: 1.6rem; margin-bottom: 6px; }
    .sub-visual .title { font-size: 3.6rem; }
    .sub-visual .eng { font-size: 1.3rem; margin-top: 6px; }
    .sub-visual--company-introduction .background .image::after { background-position: right 30% center; }
    .sub-visual-tab .swiper-slide { margin-right: 10px; }
    .sub-visual-tab a { height: 30px; font-size: 1.5rem; }

    .breadcrumb { top: 90px; }
    .breadcrumb li { font-size: 1.2rem; padding: 0 10px; }

    .section { padding-top: 80px; padding-bottom: 80px; }
	.section:last-child { padding-bottom: 120px; }
    .section .section-badge { font-size: 1.8rem; }
}
@media screen and (max-width: 600px) {
    .sub-visual--brand-dr,
    .sub-visual--brand-rocket,
    .sub-visual--brand-maxtorm { height: auto; }
    .sub-visual--brand-dr::before,
    .sub-visual--brand-rocket::before,
    .sub-visual--brand-maxtorm::before { content: ''; display: block; padding-top: calc(864 / 750 * 100%); width: 100%; height: 0; }
    .sub-visual--brand-dr .inner,
    .sub-visual--brand-rocket .inner,
    .sub-visual--brand-maxtorm .inner { position: absolute; top: 0; left: 0; right: 0; }
    .sub-visual--brand-dr .background .image::after { background-image: url('/theme/basic/images/sub/visual-brand-dr-mo.jpg'); }
    .sub-visual--brand-rocket .background .image::after { background-image: url('/theme/basic/images/sub/visual-brand-rocket-mo.jpg'); }
    .sub-visual--brand-maxtorm .background .image::after { background-image: url('/theme/basic/images/sub/visual-brand-maxtorm-mo.jpg'); }
}


/* Company */
.slide-container { margin-top: 60px; }
.slide-container .controls { display: flex; justify-content: space-between; position: relative; margin-bottom: 60px; padding-bottom: 30px; }
.slide-container .controls::after { content: ''; position: absolute; bottom: 0; left: -50vw; width: 150vw; height: 1px; background: #dddddd; }
.slide-container .controls .swiper-button-prev,
.slide-container .controls .swiper-button-next { position: static; margin: 0; }
.slide-container .swiper { overflow: visible; }
.slide-container .swiper::before { content: ''; z-index: 2; position: absolute; top: 0; right: 100%; width: 50vw; height: 100%; background: #fff; }
.slide-container .swiper-slide { display: flex; flex-direction: column; height: auto; }

.image-box { overflow: hidden; margin-top: 60px; border-radius: 24px; }

/* Company - Introduction */
.introduction .section-vision .inner { display: flex; flex-direction: row-reverse; align-items: flex-end; justify-content: space-between; }
.introduction .section-vision .side { width: 45.6%; }
.introduction .section-vision .contents { width: 54.4%; }
.introduction .section-vision .heading { margin-bottom: 10px; line-height: 1.2; font-family: var(--font-display); font-size: 5.2rem; font-weight: 700; }
.introduction .section-vision .text { margin-top: 20px; }
.introduction .section-vision .media { overflow: hidden; position: relative; background: #000; border-radius: 20px; }
.introduction .section-vision .media .button { z-index: 2; position: relative; display: flex; align-items: center; justify-content: center; position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
.introduction .section-vision .media .button::before { content: ''; display: block; width: 60px; height: 60px; background: rgba(255, 255, 255, 0.1); border-radius: 50%; backdrop-filter: blur(8px); }
.introduction .section-vision .media .button::after { content: ''; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; width: 60px; height: 60px; background: url('/theme/basic/images/triangle-right-light.svg') no-repeat center / auto 34%; }
.introduction .section-vision .media .thumbnail { transition: all ease .65s; }
.introduction .section-chairman { overflow: hidden; position: relative; padding-top: 40px; padding-bottom: 0; color: #fff; }
.introduction .section-chairman .inner { display: flex; flex-direction: row-reverse; justify-content: space-between; }
.introduction .section-chairman .side { display: flex; align-items: flex-end; position: relative; }
.introduction .section-chairman .side .word { position: absolute; max-width: 145%; top: 35%; left: 55%; transform: translateX(-50%); }
.introduction .section-chairman .side .image { z-index: 2; position: relative; }
.introduction .section-chairman .contents { padding-bottom: 100px; }
/* .introduction .section-chairman .section-badge { margin-bottom: 120px; } */
.introduction .section-chairman .text-wrap { padding-top: 120px; }
.introduction .section-chairman .background { position: absolute; bottom: 0; left: 0; width: 100%; height: 715px; background: url('/theme/basic/images/sub/company/introduction/chairman-background.jpg') no-repeat center / cover; }
.introduction .section-chairman .heading { margin-bottom: 60px; line-height: 1.5; font-size: 4rem; color: inherit; }
.introduction .section-chairman .text { margin-top: 60px; }
.introduction .section-chairman div.text { display: flex; align-items: center; }
.introduction .section-chairman div.text img { margin-left: 1em; }
.introduction .section-history { overflow: hidden; }
.introduction .section-history .date { margin-bottom: 20px; text-align: center; font-family: var(--font-display); font-size: 2rem; font-weight: 700; color: var(--heading); }
.introduction .section-history .box { flex: 1 1; padding: 40px 30px; text-align: center; background: #F6F6F6; border-radius: 16px; }
.introduction .section-history .image { margin-bottom: 30px; padding: 0 10px; border-bottom: 1px solid #23323B; }
.introduction .section-history .title { font-size: 2rem; }
.introduction .section-history .title span { padding-bottom: 0.25em; background-image: linear-gradient(transparent calc(100% - 50%), rgba(147, 162, 170, 0.3) 2px); background-size: 100% 100%; background-repeat: no-repeat; }
/* .introduction .section-history .text { margin-top: 10px; font-size: 1.6rem; letter-spacing: -0.02em; } */
.introduction .section-history .text { margin-top: 10px; letter-spacing: -0.02em; }
.introduction .section-location { overflow: hidden; }
.introduction .section-location .swiper-slide { text-align: center; }
.introduction .section-location .image { margin-bottom: 20px; border-radius: 20px; }
.introduction .section-location .address { margin-top: 12px; padding-top: 10px; border-top: 1px solid #DDDDDD; }
.introduction .section-location .title { font-size: 2rem; }
.introduction .section-location .text { font-size: 1.6rem; }
.introduction .section-ci { background: var(--background); }
.introduction .section-ci .list { display: flex; margin: 45px -15px -15px; }
.introduction .section-ci .list .item { padding: 15px; width: 50%; }
.introduction .section-ci .list .board { display: flex; align-items: center; justify-content: center; background-color: #fff; background-image: linear-gradient(to right, rgba(194, 202, 208, 0.3) 1px, transparent 1px), linear-gradient(to bottom, rgba(194, 202, 208, 0.3) 1px, transparent 1px); background-size: 10px 10px; box-shadow: 0 0 0 1px #dddddd; border-radius: 20px; }
.introduction .section-ci .list .board img { mix-blend-mode: multiply; }
.introduction .section-ci .list .button { margin-top: 10px; padding-right: 16px; padding-left: 16px; height: 40px; line-height: 40px; font-family: var(--font-display); font-size: 1.8rem; font-weight: 400; word-break: break-word; }
@media (hover: hover) and (pointer: fine) {
	.introduction .section-vision .media .button:hover + .thumbnail { transform: scale(1.1); opacity: 0.6; }
}
@media screen and (min-width: 1025px) {
	.introduction .section-history { padding-top: 200px; }
}
@media screen and (max-width: 1024px) {
    .slide-container { margin-top: 45px; }
    .slide-container .controls { margin-bottom: 45px; padding-bottom: 20px; }

    .image-box { margin-top: 45px; border-radius: 14px; }

    .introduction .section-vision .heading { font-size: 3.6rem; }
    .introduction .section-chairman .background { height: 83%; }
    /* .introduction .section-chairman .section-badge { margin-bottom: 80px; } */
    .introduction .section-chairman .text-wrap { padding-top: 80px; }
    .introduction .section-chairman .heading { font-size: 3.4rem; margin-bottom: 45px; }
    .introduction .section-chairman .text { margin-top: 45px; }
    .introduction .section-chairman div.text img { width: auto; height: 36px; }
    .introduction .section-history .box { padding: 36px; }
    .introduction .section-history .date { font-size: 1.9rem; }
    .introduction .section-history .title { font-size: 1.8rem; }
    .introduction .section-history .text { font-size: 1.5rem; }
    .introduction .section-history .image { margin-bottom: 20px; }
    .introduction .section-ci .list .button { font-size: 1.7rem; }
}
@media screen and (max-width: 768px) {
    .slide-container { margin-top: 35px; }
    .slide-container .controls { margin-bottom: 35px; padding-bottom: 15px; }
    .slide-container .controls .swiper-button-prev,
    .slide-container .controls .swiper-button-next { background-size: 80% auto; }

    .image-box { margin-top: 35px; border-radius: 8px; }

    .introduction .section-vision .heading { font-size: 2.8rem; }
    .introduction .section-vision .side { margin-top: 35px; width: 100%; }
    .introduction .section-vision .contents { width: 100%; }
    .introduction .section-vision .inner { flex-direction: column-reverse; }
    .introduction .section-vision .media { border-radius: 14px; }
    .introduction .section-vision .media .thumbnail { width: 100%; }
    /* .introduction .section-chairman .section-badge { margin-bottom: 60px; } */
    .introduction .section-chairman .text-wrap { padding-top: 60px; }
    .introduction .section-chairman .background { height: 87%; background-position: top left 30%; }
    .introduction .section-chairman .inner { flex-direction: column-reverse; }
    .introduction .section-chairman .side { justify-content: flex-end; }
    .introduction .section-chairman .side .word { max-width: 65%; }
    .introduction .section-chairman .side .image { width: 180px; }
    .introduction .section-chairman .contents { padding-bottom: 30px; }
    .introduction .section-chairman .heading { font-size: 2.2rem; margin-bottom: 35px; }
    .introduction .section-chairman .text { margin-top: 35px; }
    .introduction .section-chairman div.text { flex-direction: column; align-items: flex-start; position: absolute; bottom: 40px; left: 0; width: 50%; }
    .introduction .section-chairman div.text img { margin-top: 1em; margin-left: 0; }
    .introduction .section-history .box { padding: 24px; }
    .introduction .section-history .date { font-size: 1.8rem; }
    .introduction .section-history .title { font-size: 1.7rem; }
    /* .introduction .section-history .text { font-size: 1.4rem; } */
    .introduction .section-location .address { margin-top: 10px; padding-top: 8px; }
    .introduction .section-ci .list { flex-direction: column; }
    .introduction .section-ci .list .item { width: 100%; }
    .introduction .section-ci .list .button { height: auto; line-height: 1.5; font-size: 1.6rem; }
}


/* Company - Moral */
.moral .section:first-child { padding-bottom: 0; }
.moral .section .list { margin-top: 60px; border-top: 2px solid #23323B; }
.moral .section .list .item { display: flex; align-items: center; padding: 30px; border-bottom: 1px solid #dddddd; }
.moral .section .list .icon-wrap { width: 190px; }
.moral .section .list .text-wrap { flex: 1 1; line-height: 1.55; }
.moral .section .image-box .image { clip-path: polygon(0 0, 0 0, 0 100%, 0% 100%); transition: clip-path 1s ease .35s; }
.moral .section .image-box .image.sr-animate { clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%); transition: clip-path ease 1s; }
@media screen and (max-width: 1024px) {
    .moral .section .list { margin-top: 45px; }
    .moral .section .list .item { padding: 30px 24px; }
    .moral .section .list .icon-wrap { width: 165px; }
    .moral .section .list .icon-wrap img { width: auto; height: 96px; }
}
@media screen and (max-width: 768px) {
    .moral .section .list { margin-top: 35px; }
    .moral .section .list .item { padding: 30px 0; }
    .moral .section .list .icon-wrap { margin-bottom: 15px; width: 100px; }
    .moral .section .list .icon-wrap img { width: auto; height: 80px; }
}


/* Company - ESG */
.esg .section-introduce { padding-bottom: 120px; border-bottom: 1px solid #dddddd; }
.esg .section-introduce .section-heading { text-align: center; font-size: 4rem; }
.esg .section-download { padding-top: 120px; }
.esg .section-download .section-heading { text-align: center; font-size: 4rem; }
.esg .section-download .list { margin-top: 60px; }
.esg .section-download .list .item { display: flex; justify-content: space-between; margin-top: 16px; }
.esg .section-download .list .button-wrap { width: 225px; background: #EFEFEF; border-radius: 12px; }
.esg .section-download .list .text-wrap { flex: 1 1; display: flex; align-items: center; margin-right: 16px; padding: 0 80px; background: #EFEFEF; border-radius: 12px; }
.esg .section-download .list .button { width: 100%; height: 110px; line-height: 110px; }
.esg .section-download .list p { font-family: var(--font-display); font-weight: 700; }
@media (hover: hover) and (pointer: fine) {
	.esg .section-download .list .button:hover .icon::before { background-image: url('/theme/basic/images/download.svg'); }
}
@media screen and (max-width: 1024px) {
    .esg .section-download .section-heading { font-size: 3.6rem; }
    .esg .section-download .list { margin-top: 45px; }
    .esg .section-download .list .item { margin-top: 14px; }
    .esg .section-download .list .text-wrap { margin-right: 14px; padding: 0 50px; }
    .esg .section-download .list .button { height: 80px; line-height: 80px; }
}
@media screen and (max-width: 768px) {
    .esg .section-download { padding-top: 80px; }
    .esg .section-download .section-heading { font-size: 2.8rem; }
    .esg .section-download .list { margin-top: 35px; }
    .esg .section-download .list .item { flex-direction: column; }
    .esg .section-download .list .text-wrap { margin-right: 0; margin-bottom: 5px; padding: 24px; }
    .esg .section-download .list .button-wrap { width: 100%; }
    .esg .section-download .list .button { height: 60px; line-height: 60px; }
}


/* Company - Compliance */
.compliance .section-introduce { border-bottom: 1px solid #dddddd; }
.compliance .section-introduce .section-heading { margin-bottom: 80px; font-size: 4.2rem; }
.compliance .section-introduce .image { float: left; margin: 0 80px 0 0; width: 36.334%; border-radius: 16px; }
.compliance .section-introduce .title { margin-top: 0; margin-bottom: 30px; font-size: 3.2rem; }
.compliance .section-introduce .paragraph p { margin-top: 16px; }
.compliance .section-introduce .paragraph .date { text-align: right; font-family: var(--font-display); font-size: 1.8rem; }
.compliance .section-introduce .paragraph-2 { margin-top: 70px; }
.compliance .section-program { overflow: hidden; text-align: center; }
.compliance .section-program .badge { font-family: var(--font-display); font-size: 1.8rem; }
.compliance .section-program .heading { margin: 8px 0 20px; font-size: 4.2rem; }
.compliance .section-program .highlight { margin: 60px 0 20px; }
.compliance .section-program .highlight span { padding: 10px; font-size: 4.2rem; color: #fff; background: #333333; }
.compliance .section-program .highlight + p { margin-bottom: 26px; }
/* .compliance .section-program .swiper { margin-top: 160px; } */
.compliance .section-program p + img { margin-top: 160px; }
.compliance .section-system { overflow: hidden; text-align: center; background: #EFEFEF; }
.compliance .section-system .section-heading { margin-bottom: 80px; font-size: 4.2rem; }
.compliance .section-element { overflow: hidden; text-align: center; }
.compliance .section-element .inner { max-width: 1220px; }
.compliance .section-element .section-heading { margin-bottom: 80px; font-size: 4.2rem; }
@media screen and (max-width: 1024px) {
    .compliance .section-introduce .section-heading { margin-bottom: 60px; font-size: 3.6rem; }
    .compliance .section-introduce .title { font-size: 2.8rem; }
    .compliance .section-introduce .image { margin-right: 40px; }
    .compliance .section-introduce .paragraph-2 { margin-top: 0; }
    .compliance .section-introduce .paragraph .date { font-size: 1.7rem; }
    .compliance .section-program .heading { font-size: 3.6rem; }
    .compliance .section-program .highlight { margin: 45px 0 16px; }
    .compliance .section-program .highlight span { font-size: 3.8rem; }
    .compliance .section-program .highlight + p { margin-bottom: 20px; }
    /* .compliance .section-program .swiper { margin-top: 120px; } */
    .compliance .section-program p + img { margin-top: 120px; }
    .compliance .section-program .swiper img { width: auto; height: 464px; }
    .compliance .section-system .section-heading { margin-bottom: 60px; font-size: 3.6rem; }
    .compliance .section-system .swiper img { width: auto; height: 538px; }
    .compliance .section-element .section-heading { margin-bottom: 60px; font-size: 3.6rem; }
    .compliance .section-element .swiper img { width: auto; height: 538px; }
}
@media screen and (max-width: 768px) {
    .compliance .section-introduce .section-heading { margin-bottom: 45px; font-size: 2.8rem; }
    .compliance .section-introduce .title { font-size: 2rem; margin-bottom: 20px; }
    .compliance .section-introduce .image { float: none; margin-right: 0; margin-bottom: 30px; border-radius: 8px; }
    .compliance .section-introduce .paragraph p { margin-top: 14px; }
    .compliance .section-introduce .paragraph .date { font-size: 1.6rem; }
    .compliance .section-program .heading { font-size: 2.4rem; }
    .compliance .section-program .highlight span { font-size: 2.6rem; }
    .compliance .section-program .highlight + p { margin-bottom: 10px; }
    /* .compliance .section-program .swiper { margin-top: 80px; } */
    .compliance .section-program p + img { margin-top: 80px; }
    .compliance .section-system .section-heading { margin-bottom: 45px; font-size: 2.4rem; }
    .compliance .section-element .section-heading { margin-bottom: 45px; font-size: 2.4rem; }
}
@media screen and (max-width: 480px) {
    .compliance .section-introduce .image { width: 100%; }
    .compliance .section-program .heading { font-size: 2.1rem; }
    .compliance .section-program .highlight span { font-size: 1.8rem; }
}
@media screen and (max-width: 374px) {
    .compliance .section-program .heading { font-size: 2rem; }
    .compliance .section-program .highlight span { font-size: 1.6rem; }
}


/* Company - Partner */
.partner .section-introduce { text-align: center; }
.partner .section-introduce .section-heading { margin-bottom: 20px; font-size: 4rem; }
.partner .section-introduce .section-text { font-size: 2.4rem; }
.partner .section-introduce .list { display: flex; flex-wrap: wrap; margin: 45px -15px -15px; }
.partner .section-introduce .list .item { padding: 15px; width: 33%; }
.partner .section-introduce .list .block { overflow: hidden; position: relative; background: #EFEFEF; border-radius: 24px; }
.partner .section-introduce .list .block::before { content: ''; display: block; padding-top: calc(330 / 380 * 100%); width: 100%; height: 0; }
.partner .section-introduce .list .block img { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; }
@media screen and (max-width: 1024px) {
    .partner .section-introduce .section-heading { font-size: 3rem; }
    .partner .section-introduce .list .block { border-radius: 12px; }
    .partner .section-introduce .section-text { font-size: 1.8rem; }
}
@media screen and (max-width: 768px) {
    .partner .section-introduce .section-heading { font-size: 2.4rem; }
    .partner .section-introduce .list { margin: 30px -7px -7px; }
    .partner .section-introduce .list .item { padding: 7px; }
    .partner .section-introduce .list .block { border-radius: 8px; }
    .partner .section-introduce .section-text { font-size: 1.6rem; }
}
@media screen and (max-width: 500px) {
    .partner .section-introduce .list .item { width: 100%; }
    .partner .section-introduce .list .block { width: 100%; }
    .partner .section-introduce .list img { width: 100%; }
}

/* Products - List */
.dot-list li { position: relative; padding-left: 0.73em; }
.dot-list li::before { content: ''; position: absolute; top: 0.73em; left: 0; width: 0.2em; height: 0.2em; background: currentColor; border-radius: 50%; transform: scale(1); will-change: transform; }

.products-list .section-introduce .text { text-align: center; font-size: 2.2rem; }
.products-list .section-products { background: #EFEFEF; }
.products-list .section-products .list .item { margin-top: 60px; }
.products-list .section-products .list .item:first-child { margin-top: 0; }
.products-list .section-products .list .block { overflow: hidden; display: flex; position: relative; background: #fff; border-radius: 24px; }
.products-list .section-products .list .background { position: absolute; top: 0; left: 0; width: 40.25%; height: 100%; background: url('/theme/basic/images/sub/products/products-item-background.jpg') no-repeat left / auto 100%; transition: width cubic-bezier(0.4, 0, 0.2, 1) 1s; border-radius: 24px; pointer-events: none; }
.products-list .section-products .list .side { z-index: 2; position: relative; padding: 60px 49px; width: 40.25%; }
.products-list .section-products .list .side img { width: 100%; height: auto; }
/* .products-list .section-products .list .contents { z-index: 2; position: relative; flex: 1 1; padding: 56px 60px 60px 80px; } */
.products-list .section-products .list .contents { z-index: 2; position: relative; flex: 1 1; padding: 56px 46px 60px 70px; }
/* .products-list .section-products .list .heading { display: flex; align-items: flex-end; font-family: var(--font-display); } */
.products-list .section-products .list .heading { display: flex; align-items: flex-end; letter-spacing: -0.04em; }
.products-list .section-products .list .heading h3 { font-size: 4rem; font-weight: 700; color: var(--clr-primary); }
.products-list .section-products .list .heading .eng { padding-left: 0.4em; padding-bottom: 0.6em; font-size: 2rem; color: #BDC3C6; }
.products-list .section-products .list .title { margin-top: 2px; font-size: 2.2rem; color: rgba(35, 50, 59, 0.6); }
.products-list .section-products .list p { margin-top: 12px; font-size: 1.8rem; transition: color ease .35s; }
.products-list .section-products .list ul { margin-top: 22px; }
.products-list .section-products .list li { transition: color ease .35s; }
.products-list .section-products .list .button-link { margin-top: 40px; }
.products-list .section-products .list .button-link::before { transition-duration: 1s; }
@media (hover: hover) and (pointer: fine) {
    .products-list .section-products .list .block:hover { color: #fff; }
    .products-list .section-products .list .block:hover .title { color: rgba(255, 255, 255, 0.6); }
	.products-list .section-products .list .block:hover .background { width: 100%; }
    /* .products-list .section-products .list .block:hover .button-link,
    .products-list .section-products .list .block:hover .button-link .icon { border-color: #fff; }
    .products-list .section-products .list .block:hover .button-link .icon::before { background-image: url('/theme/basic/images/chevron-2-right-light.svg'); } */
    .products-list .section-products .list .block:hover .button-link { color: #fff; border-color: var(--clr-primary) !important; }
    .products-list .section-products .list .block:hover .button-link::before { transform: none; }
    .products-list .section-products .list .block:hover .button-link .icon { background: #fff !important; border-color: #fff !important; }
    .products-list .section-products .list .block:hover .button-link .icon::before { background-image: url('/theme/basic/images/chevron-2-right-primary.svg') !important; }
}
@media screen and (min-width: 1025px) {
    .products-list .section-introduce { padding-top: 140px; padding-bottom: 140px; }
}
@media screen and (max-width: 1024px) {
    .products-list .section-introduce .text { font-size: 2rem; }
    .products-list .section-products .list .item { margin-top: 45px; }
    .products-list .section-products .list .block { border-radius: 12px; }
    .products-list .section-products .list .background { border-radius: 12px; }
    .products-list .section-products .list .contents { padding: 36px 36px 36px 48px; }
    .products-list .section-products .list .heading h3 { font-size: 3.4rem; }
    .products-list .section-products .list .heading .eng { font-size: 1.8rem; padding-bottom: 0.3rem; }
    .products-list .section-products .list .title { font-size: 2rem; }
    .products-list .section-products .list p { font-size: 1.7rem; margin-top: 10px; }
    .products-list .section-products .list ul { margin-top: 18px; }
    .products-list .section-products .list .button-link { margin-top: 30px; }
}
@media screen and (max-width: 768px) {
    .products-list .section-introduce .text { font-size: 1.8rem; }
    .products-list .section-products .list .item { margin-top: 35px; }
    .products-list .section-products .list .block { border-radius: 8px; }
    .products-list .section-products .list .background { border-radius: 8px; }
    .products-list .section-products .list .heading { margin-bottom: 14px; }
    .products-list .section-products .list .heading { flex-direction: column; align-items: flex-start; }
    .products-list .section-products .list .heading h3 { font-size: 2.4rem; }
    .products-list .section-products .list .heading .eng { margin-top: -0.25em; font-size: 1.6rem; padding-left: 0; padding-bottom: 0; }
    .products-list .section-products .list .title { font-size: 1.8rem; }
    .products-list .section-products .list p { font-size: 1.6rem; }
    .products-list .section-products .list ul { margin-top: 14px; }
    .products-list .section-products .list .block { flex-direction: column; }
    .products-list .section-products .list .background { width: 100%; height: 200px; background-size: cover; }
    .products-list .section-products .list .side { padding: 16px; width: 100%; height: 200px; }
    .products-list .section-products .list .side img { width: 100%; height: 100%; object-fit: contain; }
    .products-list .section-products .list .contents { padding: 24px; width: 100%; }
}


/* Products - View */
.media-box { position: relative; overflow: hidden; border-radius: 20px; }
.media-box .button { z-index: 2; position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
.media-box .button .icon { margin: auto; width: 100px; height: 100px; background: rgba(255, 255, 255, 0.1); border-radius: 50%; }
.media-box .button .icon::before { background-image: url('/theme/basic/images/triangle-right-light.svg'); background-size: auto 24%; }
.media-box .thumbnail { transition: transform ease .65s; }

.products-view { margin-top: -1px; }
.products-view .section-introduce { background: url('/theme/basic/images/sub/products/introduce-background.jpg') no-repeat center / cover; }
.products-view .section-introduce .inner { display: flex; justify-content: space-between; }
.products-view .section-introduce .side { width: 42.92%; }
.products-view .section-introduce .contents { flex: 1 1; padding-left: 76px; color: #fff; }
/* .products-view .section-introduce .heading { display: flex; align-items: flex-end; font-family: var(--font-display); } */
.products-view .section-introduce .heading { display: flex; align-items: flex-end; }
.products-view .section-introduce .heading h3 { font-size: 4rem; font-weight: 700; color: var(--clr-primary); letter-spacing: -0.04em; }
.products-view .section-introduce .heading .eng { padding-left: 0.4em; padding-bottom: 0.6em; font-size: 2rem; color: #BDC3C6; }
.products-view .section-introduce .title { margin-top: 2px; font-size: 2.2rem; color: rgba(255, 255, 255, 0.6); }
.products-view .section-introduce .title br { display: none; }
.products-view .section-introduce p { margin-top: 12px; font-size: 1.8rem; }
.products-view .section-introduce .specification { display: flex; margin: 26px -6px -6px; }
.products-view .section-introduce .specification .item { flex: 0 1 33.33333%; padding: 6px; }
.products-view .section-introduce .specification .block { position: relative; height: 100%; text-align: center; background: linear-gradient(0deg, rgba(0, 163, 165, 0.4) 0%, rgba(0, 163, 165, 0.07) 100%); border: 1px solid rgba(0, 162, 164, 0.2); border-radius: 12px; }
.products-view .section-introduce .specification .contents { padding: 24px 0; height: 100%; }
.products-view .section-introduce .specification .contents.center { display: flex; align-items: center; justify-content: center; }
.products-view .section-introduce .specification img { margin-bottom: 8px; }
.products-view .section-introduce .specification p { margin-top: 0; line-height: 1.4; font-size: 1.3rem; }
.products-view .section-introduce .specification .gradient { display: none; position: absolute; top: 0; left: 0; width: 100%; height: 100%; pointer-events: none; }
.products-view .section-introduce .specification .gradient svg { display: block; width: 100%; height: auto; }
.products-view .section-introduce .specification .gradient .box { fill: transparent; stroke-width: 4px; stroke: url('#logo-gradient'); }
.products-view .section-introduce .feature { margin-top: 32px; border-top: 2px solid rgba(200, 201, 201, 0.3); }
.products-view .section-introduce .feature li { padding: 16px 12px; font-size: 1.5rem; border-bottom: 1px solid rgba(200, 201, 201, 0.3); }
.products-view .section-media { padding-bottom: 0; }
.products-view .section-related { overflow: hidden; }
.products-view .section-related .swiper { overflow: visible; margin-bottom: -30px; padding-bottom: 30px; }
.products-view .section-related .swiper-slide { overflow: hidden; height: auto; border: 1px solid #dddddd; border-radius: 24px; box-sizing: border-box; }
.products-view .section-related .thumbnail { overflow: hidden; position: relative; text-align: center; background: #EFEFEF; }
.products-view .section-related .thumbnail::before { content: ''; display: block; padding-top: calc(260 / 380 * 100%); width: 100%; height: 0; }
.products-view .section-related .thumbnail img { position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; width: 86%; height: 86%; object-fit: contain; }
/* .products-view .section-related .contents { padding: 30px 20px; text-align: center; } */
.products-view .section-related .contents { padding: 30px 16px; text-align: center; }
/* .products-view .section-related .title { line-height: 1.4; font-family: var(--font-display); font-size: 2.4rem; font-weight: 700; } */
.products-view .section-related .title { line-height: 1.4; font-size: 2.4rem; font-weight: 700; letter-spacing: -0.04em; }
.products-view .section-related .text { margin-top: 12px; min-height: 58px; font-size: 1.8rem; }
.products-view .section-related .button-link { margin-top: 24px; }
.products-view .section-related .section-badge { text-align: center; }
@media (hover: hover) and (pointer: fine) {
    .media-box .button:hover { background-color: rgba(0, 0, 0, .15); }
    .media-box .button:hover + .thumbnail { transform: scale(1.1); }
}
@media screen and (min-width: 1025px) {
	.products-view .section-introduce .specification .contents.center { min-height: 100px; }
}
@media screen and (max-width: 1024px) {
    .media-box { border-radius: 12px; }
    .media-box .button .icon { width: 84px; height: 84px; }
    .products-view .section-introduce .inner { flex-direction: column; }
    .products-view .section-introduce .side { width: 100%; }
    .products-view .section-introduce .contents { padding-top: 35px; padding-left: 0; width: 100%; }
    .products-view .section-introduce .heading { flex-direction: column; align-items: flex-start; }
    .products-view .section-introduce .heading h3 { font-size: 3.4rem; }
    .products-view .section-introduce .title { font-size: 2rem; }
    .products-view .section-introduce p { font-size: 1.7rem; }
    /* .products-view .section-introduce .feature li { font-size: 1.4rem; } */
    .products-view .section-introduce .heading .eng { margin-bottom: 14px; padding-left: 0; padding-bottom: 0; font-size: 1.8rem; }
    .products-view .section-related .title { font-size: 2rem; }
    .products-view .section-related .text { font-size: 1.7rem; min-height: 51px; }
}
@media screen and (max-width: 768px) {
    .media-box { border-radius: 8px; }
    .media-box .button .icon { width: 72px; height: 72px; }
    .products-view .section-introduce { padding-top: 40px; }
    .products-view .section-introduce .contents { padding-top: 15px; }
    /* .products-view .section-introduce .heading h3 { font-size: 2.4rem; } */
    .products-view .section-introduce .heading h3 { font-size: 2.3rem; }
    .products-view .section-introduce .title { font-size: 1.8rem; }
    .products-view .section-introduce p { font-size: 1.6rem; }
    /* .products-view .section-introduce .feature li { font-size: 1.3rem; } */
    .products-view .section-introduce .heading .eng { font-size: 1.6rem; }
    .products-view .section-related .title { font-size: 1.8rem; }
    .products-view .section-related .text { min-height: 45px; font-size: 1.6rem; }
}
@media screen and (max-width: 600px) {
    .products-view .section-introduce .specification { flex-wrap: wrap; }
    .products-view .section-introduce .specification .item { flex-basis: 50%; }
    .products-view .section-introduce .specification .contents { display: flex; align-items: center; padding-left: 0.7em; padding-right: 0.7em; text-align: left; }
    .products-view .section-introduce .specification img { width: 48px; height: auto; }
    .products-view .section-introduce .specification p { padding-left: 1em; }
    .products-view .section-introduce .specification p br { display: none; }
    .products-view .section-introduce .specification .contents.center { text-align: center; }
    .products-view .section-introduce .specification .contents.center p { padding-left: 0; }
}


/* Brand */
.brand .section-logo { padding-top: 120px; padding-bottom: 120px; text-align: center; }
/* .brand .section-introduce { background: #EFEFEF; }
.brand .section-introduce .title { margin-top: 30px; font-family: var(--font-display); font-weight: 700; }
.brand .section-introduce .flex { display: flex; align-items: flex-end; justify-content: space-between; margin-top: 36px; }
.brand .section-introduce .flex .contents { flex: 1 1; padding-right: 48px; }
.brand .section-introduce .flex .button { padding-right: 30px; padding-left: 30px; height: 50px; line-height: 50px; font-family: inherit; font-weight: 400; }
.brand .section-introduce .list { display: flex; flex-wrap: wrap; margin: 65px -15px -15px; }
.brand .section-introduce .list .item { padding: 15px; width: 33.3333333%; }
.brand .section-introduce .list .block { overflow: hidden; background: #fff; border-radius: 20px; }
.brand .section-introduce .list .block img { width: 100%; height: auto; }
.brand .section-media .section-badge { text-align: center; } */
.brand .section-introduce { background: #EFEFEF; }
.brand .section-introduce .title { margin-bottom: 24px; text-align: center; font-size: 3.6rem; font-family: var(--font-display); font-weight: 700; }
.brand .section-introduce .flex { margin-top: 36px; text-align: center; }
.brand .section-introduce .flex .contents { flex: 1 1; margin-bottom: 40px; }
.brand .section-introduce .flex .contents p { margin-top: 24px; }
.brand .section-introduce .flex .button { padding-right: 30px; padding-left: 30px; height: 50px; line-height: 50px; font-family: inherit; font-weight: 400; }
.brand .section-introduce .list { display: flex; flex-wrap: wrap; margin: 65px -15px -15px; }
.brand .section-introduce .list .item { flex: 1 1; padding: 15px; }
.brand .section-introduce .list .block { overflow: hidden; text-align: center; background: #fff; border-radius: 20px; }
.brand .section-introduce .list .block img { max-width: 380px; width: 100%; height: auto; }
.brand .section-media .section-badge { text-align: center; }

@media screen and (max-width: 1024px) {
    .brand .section-logo { padding-top: 80px; padding-bottom: 80px; }
    .brand .section-logo .logo { width: auto; height: 48px; }
    /* .brand .section-introduce .logo { width: auto; height: 48px; }
    .brand .section-introduce .list { margin-top: 45px; }
    .brand .section-introduce .list .block { border-radius: 12px; } */
    .brand .section-introduce .flex .contents p { margin-top: 20px; }
    .brand .section-introduce .title { font-size: 3em; }
    .brand .section-introduce .logo { width: auto; height: 48px; }
    .brand .section-introduce .list { margin-top: 45px; }
    .brand .section-introduce .list .block { border-radius: 12px; }
}
@media screen and (max-width: 768px) {
    .brand .section-logo { padding-top: 60px; padding-bottom: 60px; }
    .brand .section-logo .logo { width: auto; height: 34px; }
    /* .brand .section-introduce .logo { width: auto; height: 34px; }
    .brand .section-introduce .title { margin-top: 20px; }
    .brand .section-introduce .flex { flex-direction: column; align-items: flex-start; margin-top: 20px; }
    .brand .section-introduce .flex .contents { padding-right: 0; padding-bottom: 24px; }
    .brand .section-introduce .list { margin: 45px -7px -7px; }
    .brand .section-introduce .list .item { padding: 7px; }
    .brand .section-introduce .list .block { border-radius: 8px; }
    .brand .section-introduce .flex .button { height: 45px; line-height: 45px; }0 */
    .brand .section-introduce .logo { width: auto; height: 34px; }
    .brand .section-introduce .title { font-size: 2.6rem; }
    .brand .section-introduce .flex { flex-direction: column; align-items: flex-start; margin-top: 20px; }
    .brand .section-introduce .flex .contents p { margin-top: 14px; }
    .brand .section-introduce .list { margin: 45px -7px -7px; }
    .brand .section-introduce .list .item { padding: 7px; }
    .brand .section-introduce .list .block { border-radius: 8px; }
    .brand .section-introduce .flex .button { height: 45px; line-height: 45px; }
}
@media screen and (max-width: 600px) {
    /* .brand .section-introduce .list { flex-direction: column; }
    .brand .section-introduce .list .item { width: 100%; } */
    .brand .section-introduce .list { flex-direction: column; }
    .brand .section-introduce .list .item { width: 100%; }
}

/* Battery - Management */
.battery { display: flex; justify-content: center; position: relative; padding-left: 11%; }
.battery .battery-side { z-index: 3; position: absolute; top: 0; left: 0; padding: 140px 0 200px 80px; height: 100%; background: #fff; }
.battery .battery-side .sticky { position: sticky; top: 140px; left: 0; }
.battery .battery-side .tab .button { justify-content: flex-start; padding: 0 20px 0 30px; width: 100%; height: 40px; line-height: 40px; font-size: 1.5rem; font-weight: 400; background: #fff; border: 1px solid #dddddd; border-radius: 40px; box-sizing: border-box; white-space: nowrap; }
.battery .battery-side .tab .button::before { content: ''; position: absolute; top: 1.15em; left: 20px; width: 0.26em; height: 0.26em; background: currentColor; border-radius: 50%; transform: scale(1); will-change: transform; }
/* .battery .battery-side .tab .button[aria-selected="true"] { color: #fff; background: #1D3641; }
.battery .battery-side .tab .button[aria-selected="true"] .icon { opacity: 1; transform: translateX(0); } */
.battery .battery-side .tab .button[aria-selected="true"] { color: #23323B; background: #D8DFE3; border-color: #D8DFE3; }
.battery .battery-side .tab .button[aria-selected="true"] .icon { opacity: 1; transform: translateX(0); }
.battery .battery-side .tab .button[aria-selected="true"]::before { background: #fff; }
/* .battery .battery-main { padding: 0 6.2% 180px 4.1%; width: 79.17%; } */
.battery .battery-main { padding: 0 0 180px; }
.battery .battery-main .section { padding: 140px 0 0; }
.battery .battery-main .section-heading { margin-bottom: 30px; font-size: 4rem; }
.battery .battery-main .button-wrap { display: flex; justify-content: flex-end; margin-bottom: 48px; }
.battery .battery-main .button-wrap .button { font-weight: 400; }
@media screen and (min-width: 1025px) {
	.battery .battery-side .sticky { overflow-x: hidden; overflow-y: auto; width: 240px; height: calc(100vh - 170px); }
	.battery .battery-side .sticky::-webkit-scrollbar { width: 8px; }
	.battery .battery-side .sticky::-webkit-scrollbar-thumb { background-color: #1D3641; border-radius: 8px; }
	.battery .battery-side .sticky::-webkit-scrollbar-track { background-color: #D9D9D9; border-radius: 8px; }
	.battery .battery-side .tab .list { display: block; transform: none !important; }
	.battery .battery-side .tab .item { margin-bottom: 10px; }
	.battery .battery-side .tab .item:last-child { margin-bottom: 0; }
	.battery .battery-side .tab .button { width: 240px; }
	/* .battery .battery-side .tab .button:hover { color: #fff; background: #1D3641; }
	.battery .battery-side .tab .button:hover .icon { transform: translateX(0); opacity: 1; } */
    .battery .battery-side .tab .button:hover { color: #23323B; background: #D8DFE3; border-color: #D8DFE3; }
	.battery .battery-side .tab .button:hover .icon { transform: translateX(0); opacity: 1; }
    .battery .battery-side .tab .button:hover::before { background: #fff; }
	.battery .battery-side .tab .swiper-scrollbar { display: none; }
}
@media screen and (max-width: 1600px) {
    .battery { padding-left: 19%; }
    .battery .battery-side { padding-left: 2.5%; }
}
@media screen and (max-width: 1024px) {
    .battery { flex-direction: column; margin-top: 0; padding-left: 0; }
    .battery .battery-side { overflow: hidden; position: sticky; top: 70px; left: 0; margin-right: auto; margin-left: auto; padding: 14px 5% 4px; max-width: var(--inner); width: 100%; background: #fff; }
    .battery .battery-side .sticky { position: static; }
    .battery .battery-side .tab { overflow: visible; padding-bottom: 20px; }
    .battery .battery-side .tab .item { width: auto; }
    .battery .battery-side .tab .button .icon { display: none; }
    .battery .battery-main { margin: 30px auto 0; padding: 0 0 160px; max-width: var(--inner); width: 90%; }
    .battery .battery-main .section { padding-top: 45px; }
    .battery .battery-main .section-heading { font-size: 3.2rem; margin-bottom: 24px; }
    .battery .battery-main .button-wrap { margin-bottom: 34px; }

    .battery .battery-side .tab .button { padding-right: 0.6em; padding-left: 0.6em; border-color: transparent; }
    .battery .battery-side .tab .swiper-slide:first-child .button { padding-left: 0; }
    .battery .battery-side .tab .swiper-slide:last-child .button { padding-right: 0; }
    .battery .battery-side .tab .button[aria-selected="true"] { font-weight: 700; color: var(--clr-primary); background-color: transparent; border-color: transparent; }
    /* .battery .battery-side .tab .button[aria-selected="true"] .icon { opacity: 1; transform: translateX(0); } */
    .battery .battery-side .tab .button::before { content: none; }
}
@media screen and (max-width: 768px) {
    .battery .battery-main .section { padding-top: 20px; }
    .battery .battery-main .section-heading { font-size: 2.4rem; margin-bottom: 20px; }
    .battery .battery-main .button-wrap { margin-bottom: 30px; }
}


.view-container { position: relative; }
.view-container .accessibility-text { display: none; flex-direction: column; align-items: center; justify-content: center; position: absolute; top: 0; left: 0; width: 100%; height: 100%; font-size: 1.5rem; color: #fff; background: rgba(0, 0, 0, 0.6); pointer-events: none; user-select: none; }
.view-container .accessibility-text::before { content: ''; display: block; margin-bottom: 0.65em; width: 42px; height: 42px; background: url('/theme/basic/images/hand.png') no-repeat center / auto 100%; }
.viewer-backdrop { background-color: rgba(0, 0, 0, 0.7); }
.viewer-container img { background: #fff; }
.viewer-button { top: 5px; right: 5px; width: 60px; height: 60px; background-color: transparent; border-radius: 0; }
.viewer-close::before { top: 0; left: 0; width: 100%; height: 100%; background: url('/theme/basic/images/close-light.svg') no-repeat center / auto 50%; }
.viewer-button:focus,
.viewer-button:hover { background: transparent; }
.viewer-canvas img { pointer-events: auto; }
@media screen and (max-width: 1024px) {
    .view-container img { pointer-events: auto; }
    .view-container .accessibility-text { display: flex; }
}

/* Contact */
.contact .section { background: #EFEFEF; }
.contact .section .section-heading { margin-bottom: 100px; text-align: center; font-size: 4rem; }
.contact .inquiry-container { padding: 80px; background: #fff; border-radius: 24px; }
.contact .inquiry-container .inquiry-head { display: flex; align-items: flex-end; justify-content: space-between; margin-bottom: 14px; }
.contact .inquiry-container .inquiry-head .title { font-size: 40px; font-weight: 700; color: #111111; }
.contact .inquiry-container .inquiry-head .note { margin: 0; color: inherit; }
.contact .inquiry-container .inquiry-body .terms-container { margin-top: 0; text-align: center; }
.contact .inquiry-container .inquiry-foot { margin-top: 60px; text-align: center; }
.contact .inquiry-container .inquiry-table { border-top: 1px solid #1c1c1c; }
/* .contact .inquiry-container .inquiry-table tr { border-bottom: 1px solid #dcdcdc; } */
.contact .inquiry-container .inquiry-table th { vertical-align: top; padding: 46px 0 24px; width: 200px; text-align: left; font-size: 1.8rem; }
.contact .inquiry-container .inquiry-table td { padding: 24px 0; }
.contact .inquiry-container .inquiry-table td:first-child { padding-right: 30px; }
.contact .inquiry-container .inquiry-table td:last-child { padding-left: 30px; }
.contact .inquiry-container input,
.contact .inquiry-container select,
.contact .inquiry-container textarea { width: 100%; background-color: #EFEFEF; border-color: #EFEFEF; border-radius: 4px; }
.contact .inquiry-container textarea { height: 420px; }
.contact .inquiry-container .radio label { font-size: inherit; color: inherit; }
.contact .inquiry-container .file-upload { display: flex; align-items: center; position: relative; margin-top: 6px; max-width: 550px; }
.contact .inquiry-container .file-upload:first-child { margin-top: 0; }
.contact .inquiry-container .file-upload .input-wrap { position: relative; width: 100%; }
.contact .inquiry-container .file-upload .input { display: block; padding: 0 40px 0 20px; line-height: 60px; height: 60px; background: #f7f7f7; user-select: none; border-radius: 0; }
.contact .inquiry-container .file-upload .delete { display: none; position: absolute; top: 0; right: 11px; bottom: 0; margin: auto; width: 30px; height: 30px; background: url('/theme/cream/images/icon-close.svg') no-repeat center / auto 50%; cursor: pointer; }
.contact .inquiry-container .file-upload .button { flex: 1 0 150px; width: 150px; line-height: 60px; height: 60px; color: #fff; cursor: pointer; background: #333333; }
.contact .inquiry-container .file-upload .file-input { position: absolute; top: 0; left: 0; margin: 0; padding: 0;  width: 1px; height: 1px; clip: rect(0 0 0 0); overflow: hidden; }
/* .contact .inquiry-container .file-upload .input.is-selected { color: #000; background: #ebebeb; border-color: #ebebeb; } */
.contact .inquiry-container .file-upload .input.is-selected ~ .delete { display: block; }
/* .contact .inquiry-container p { margin-top: 14px; font-size: 16px; color: #999999; } */
.contact .inquiry-container .check input { min-width: auto; width: 24px; }
.contact .inquiry-container .agree .check { flex-wrap: wrap; }
@media screen and (pointer: fine) {

}
@media screen and (min-width: 1025px) {
	.contact .inquiry-container table td { height: 118px; }
}
@media screen and (max-width: 1024px) {
    .contact .inquiry-container { padding: 34px; border-radius: 12px; }
    .contact .inquiry-container input,
    .contact .inquiry-container select,
    .contact .inquiry-container textarea { min-width: auto; width: 100%; }
    .contact .inquiry-container textarea { height: 300px; }
	.contact .inquiry-container .inquiry-table,
	.contact .inquiry-container .inquiry-table tbody,
	.contact .inquiry-container .inquiry-table tr,
	.contact .inquiry-container .inquiry-table th,
	.contact .inquiry-container .inquiry-table td { display: block; }
	.contact .inquiry-container .inquiry-table th { padding: 20px 0 6px; width: 100%; font-size: 1.6rem; }
	.contact .inquiry-container .inquiry-table td { padding: 6px 0 20px; }
    .contact .inquiry-container .inquiry-table tr:first-child td:first-child { padding-top: 32px; }
    .contact .inquiry-container .inquiry-table td:first-child { padding-right: 0; width: 100% !important; }
    .contact .inquiry-container .inquiry-table td:last-child { padding-left: 0; width: 100% !important; }
    .contact .inquiry-container .inquiry-table .th { margin-top: 0; margin-bottom: 14px; }
	.contact .inquiry-container .input { width: 100%; }
	.contact .inquiry-container .inquiry-head { margin-bottom: 20px; }
	.contact .inquiry-container .inquiry-head .title { font-size: 30px; }
	.contact .inquiry-container .inquiry-head .note { margin-bottom: 6px; font-size: 14px; }
	/* .contact .inquiry-container .inquiry-body .terms-container { margin-top: 40px; } */
	.contact .inquiry-container .inquiry-foot { margin-top: 50px; }
	.contact .inquiry-container .inquiry-foot .button { height: 50px; }

    .contact .section .section-heading { font-size: 2.6rem; margin-bottom: 60px; }
}
@media screen and (max-width: 768px) {
    .contact .inquiry-container { margin-left: -5.6%; margin-right: -5.6%; border-radius: 8px; padding: 34px 5%; }
    .contact .inquiry-container textarea { height: 200px; }
    .contact .input-group.email { flex-wrap: wrap; }
    .contact .input-group.email .col:last-child { width: 100%; }
    .contact .input-group.email input,
    .contact .input-group.email select { min-width: auto; }
	.contact .inquiry-container .inquiry-head { margin-bottom: 14px; }
	.contact .inquiry-container .inquiry-head .title { font-size: 24px; }
	.contact .inquiry-container .inquiry-head .note { font-size: 13px; }
	/* .contact .inquiry-container .inquiry-body .terms-container { margin-top: 30px; } */
    .contact .inquiry-container .file-upload .input { height: 50px; }
    .contact .inquiry-container .file-upload .button { height: 50px; }
    .contact .inquiry-container .inquiry-foot { margin-top: 35px; }

    .contact .section .section-heading { font-size: 1.8rem; margin-bottom: 45px; }
}


/* Search */
.search { padding-top: 100px; }
.search .inner { max-width: 1400px; }
.search .section:first-child { padding-top: 165px; }
.search .section-badge { margin-bottom: 0; text-align: center; font-family: inherit; font-size: 2rem; font-weight: 400; color: inherit; }
.search .section-heading { text-align: center; font-size: 8rem; font-weight: 400; color: inherit; }
.search .section-text { margin-top: 20px; text-align: center; font-size: 2.2rem; font-weight: 500; }
.search .filter-open { display: none; z-index: 8; position: sticky; top: 80px; left: 0; margin-top: 45px; text-align: center; }
.search .filter-open .open { padding: 0 16px; width: 100%; height: 45px; line-height: 45px; color: #fff; background: #23323B; border-radius: 4px; }
.search .filter { margin-top: 60px; padding: 60px 120px 40px; color: #fff; background: #23323B; border-radius: 24px; }
.search .filter form { position: relative; }
.search .filter .title { margin-bottom: 30px; font-family: var(--font-display); font-size: 2rem; font-weight: 700; }
.search .filter .row { display: flex; margin: 0 -10px 24px; }
.search .filter .row:last-child { margin-bottom: 0; }
.search .filter .row > .col { flex: 1 1; padding: 0 10px; }
.search .filter .row > .col-2 { flex: 0 1 20%; }
.search .filter .row > .col-4 { flex: 0 1 40%; }
.search .filter .label { display: block; margin-bottom: 8px; }
.search .filter .input,
.search .filter .select,
.search .filter .textarea { padding-left: 16px; width: 100%; height: 60px; background-color: #fff; border: 1px solid #000; border-radius: 4px; }
.search .filter .form-group { display: flex; }
.search .filter .form-group .button { margin-left: 20px; width: 240px; height: 60px; border-radius: 4px; }
.search .filter .reset { font-size: 2rem; color: inherit; }
.search .filter .reset .icon { margin-left: 0.625em; width: 16px; height: 16px; }
.search .filter .close { display: none; position: absolute; top: 7px; right: 7px; width: 50px; height: 50px; pointer-events: none; }
.search .filter .message-box { display: block; margin-top: 6px; background: rgba(255, 255, 255, 0.05); }
.search .filter .message-box .icon { filter: revert; }
.search .message-box { display: none; position: relative; margin-top: 30px; padding: 20px 64px; text-align: center; font-size: 1.6rem; background: rgba(0, 0, 0, 0.05); border-radius: 4px; }
.search .message-box .icon { position: absolute; top: 20px; left: 20px; filter: invert(1); }
.search .message-box .icon::before { background-image: url('/theme/basic/images/info-light.svg'); }

.search .search-body { overflow: hidden; }
.search .search-body .tabs { display: none; margin-top: 45px; }
.search .search-body .tabs .tab { display: flex; align-items: center; justify-content: center; position: relative; padding: 10px; height: 50px; font-family: var(--font-display); font-size: 1.5rem; color: #999999; font-weight: 600; }
.search .search-body .tabs .tab::after { content: ''; position: absolute; bottom: 0; left: 0; width: 100%; height: 3px; opacity: 0; background: #000; transform: scaleX(0); transform-origin: center; transition: all ease .35s; }
.search .search-body .tabs .tab[aria-selected="true"] { color: #231815; }
.search .search-body .tabs .tab[aria-selected="true"]::after { background: var(--clr-primary); opacity: 1; transform: scaleX(1); }

.search .search-body .panels { display: flex; margin: 105px -60px 0; }
.search .search-body .panel { overflow: hidden; padding: 0 60px; width: 33.33333%; text-align: center; border-right: 1px solid #dddddd; }
.search .search-body .panel:last-child { border-right: none; }
.search .search-body .panel .logo { margin-bottom: 80px; width: auto; height: 40px; }
.search .search-body .list { display: flex; flex-wrap: wrap; margin: -30px; }
.search .search-body .list .item { display: none; padding: 30px; width: 100%; }
.search .search-body .list .block { overflow: hidden; display: block; border: 1px solid #dddddd; border-radius: 16px; }
.search .search-body .list .thumbnail { overflow: hidden; position: relative; background: #EFEFEF; }
.search .search-body .list .thumbnail::before { content: ''; display: block; padding-top: calc(280 / 386 * 100%); width: 100%; height: 0; }
.search .search-body .list .thumbnail img { position: absolute; top: 10%; left: 10%; width: 80%; height: 80%; object-fit: cover; transition: transform ease .35s; }
.search .search-body .list .content { padding: 24px 16px; }
.search .search-body .list .title { font-family: var(--font-display); font-size: 2.4rem; font-weight: 700; }
.search .search-foot { margin-top: 60px; text-align: center; }
.search .search-foot .button { font-weight: 400; }
@keyframes panelIn {
    from { opacity: 0; visibility: hidden; }
    to { opacity: 1; visibility: visible; }
}
@keyframes panelOut {
    from { opacity: 1; visibility: visible; }
    to { opacity: 0; visibility: hidden; }
}
@media (hover: hover) and (pointer: fine) {
	.search .search-body .list .block:hover .thumbnail img { transform: scale(1.1); }
}
@media screen and (max-width: 1024px) {
    .search { padding-top: 70px; }
    .search .section:first-child { padding-top: 100px; }
    .search .section-heading { font-size: 5rem; }
    .search .section-badge { font-size: 1.8rem; }
    .search .section-text { font-size: 1.8rem; }
    .search .filter-open { display: block; }
    .search .filter .close { display: block; }
    .search .filter { display: none; z-index: 9; position: fixed; top: 0; left: 0; margin-top: 0; padding: 100px 5%; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.6); border-radius: 0; }
    .search .filter form { overflow-x: hidden; overflow-y: auto; display: block; padding: 20px; background: #23323B; border-radius: 12px; }
    .search .filter .row { flex-wrap: wrap; margin-bottom: 0; margin-right: -5px; margin-left: -5px; }
    .search .filter .row > .col,
    .search .filter .row > .col-2,
    .search .filter .row > .col-4 { flex: 0 1 50%; padding-top: 10px; padding-bottom: 10px; padding-right: 5px; padding-left: 5px; }
    .search .filter .row > .col-12-m { flex: 0 1 100%; width: 100%; }
    .search .filter .form-group .button { margin-left: 10px; }
    .search .filter .title { margin-bottom: 20px; font-size: 1.8rem; }
    .search .filter .input,
    .search .filter .select,
    .search .filter .textarea { height: 55px; font-size: 1.4rem; }
    .search .filter .reset { font-size: 1.8rem; }
    .search .filter .form-group .button { height: 55px; }
    .search .filter.on { display: block; }
    .search .filter.on .close { pointer-events: auto; }
    .search .filter .row-d-none { display: none !important; }
    .search .message-box { display: block; padding: 20px; font-size: 1.4rem; }
    .search .message-box .icon { position: static; top: 0; left: 0; margin-bottom: 8px; }
    .search .search-body .tabs { display: flex; justify-content: center; }
    .search .search-body .panels { margin-top: 45px; }
    .search .search-body .panel .logo { display: none; }
    .search .search-body .panel { display: block; width: 100%; animation: panelIn ease .35s forwards; }
    .search .search-body .panel[hidden] { display: none; animation: panelOut ease .35s forwards; }
    .search .search-body .list { margin: -16px; }
    .search .search-body .list .block { border-radius: 12px; }
    .search .search-body .list .item { padding: 16px; width: 50%; }
    .search .search-body .list .title { font-size: 2rem; }
}
@media screen and (max-width: 768px) {
    .search .section:first-child { padding-top: 45px; }
    .search .section-heading { font-size: 3.6rem; }
    .search .section-badge { font-size: 1.6rem; }
    .search .section-text { font-size: 1.6rem; }
    .search .filter .title { font-size: 1.6rem; }
    .search .filter .input,
    .search .filter .select,
    .search .filter .textarea { height: 50px; font-size: 1.3rem; }
    .search .filter .form-group .button { height: 50px; }
    .search .filter .reset { font-size: 1.6rem; }
    .search .search-body .panel { padding-bottom: 0; }
    .search .search-body .panel .logo { margin-bottom: 45px; height: 30px; }
    .search .search-body .list .block { border-radius: 8px; }
    .search .search-body .list .item { width: 100%; }
    .search .search-body .list .content { padding: 20px; }
    .search .search-body .list .title { font-size: 1.8rem; }
}


/* Privacy */
.privacy { padding-top: 100px; }
.privacy .section:first-child { padding-top: 165px; }
.privacy .section-heading { text-align: center; font-size: 8rem; font-weight: 400; color: inherit; }
.privacy .privacy-head .controls { display: flex; align-items: center; justify-content: flex-end; margin-top: 80px; }
.privacy .privacy-head .controls .text { margin-right: 30px; font-size: 1.8rem; }
.privacy .privacy-head .controls .select { min-width: 260px; }
.privacy .privacy-body { margin-top: 80px; }
.privacy .privacy-body .contents { padding: 80px; line-height: 1.6; font-size: 1.6rem; background: #EFEFEF; border-radius: 24px; }
.privacy .privacy-body .contents h1 { font-size: 2.4rem; font-weight: 600; }
.privacy .privacy-body .contents ol,
.privacy .privacy-body .contents ul { margin: 0 revert; padding: revert; list-style: revert; }
@media screen and (max-width: 1024px) {
    .privacy { padding-top: 70px; }
    .privacy .section:first-child { padding-top: 100px; }
    .privacy .section-heading { font-size: 5rem; }
    .privacy .privacy-head .controls { margin-top: 50px; }
    .privacy .privacy-head .controls .text { margin-right: 20px; font-size: 1.7rem; }
    .privacy .privacy-head .controls .select { min-width: 200px; }
    .privacy .privacy-body { margin-top: 60px; }
    .privacy .privacy-body .contents { padding: 48px; border-radius: 14px; font-size: 1.5rem; }
    .privacy .privacy-body .contents h1 { font-size: 2.2rem; }
}
@media screen and (max-width: 768px) {
    .privacy .section:first-child { padding-top: 45px; }
    .privacy .section-heading { font-size: 3.6rem; }
    .privacy .privacy-head .controls { margin-top: 40px; }
    .privacy .privacy-head .controls .text { margin-right: 16px; font-size: 1.6rem; }
    .privacy .privacy-head .controls .select { min-width: 180px; }
    .privacy .privacy-body { margin-top: 50px; }
    .privacy .privacy-body .contents { padding: 36px; border-radius: 8px; }
}
@media screen and (max-width: 500px) {
    .privacy .privacy-head .controls { flex-direction: column; justify-content: flex-start; align-items: flex-start; }
    .privacy .privacy-head .controls .text { margin-right: 0; margin-bottom: 6px; }
    .privacy .privacy-head .controls .select { min-width: auto; width: 100%; }
}