@charset "UTF-8";

/* ========================================
   1. Variables & Reset
======================================== */
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@400;700&family=Roboto:wght@400;700&display=swap');

:root {
    --nidec-green: #00b053;
    --text-main: #53595d;

    /* Fluid Typography */
   /* --fz-3xl: clamp(30px, 4.4vw, 50px);*/
    --fz-3xl: clamp(30px, 4.2vw, 44px);
    --fz-2xl: clamp(28px, 4vw, 40px);
    --fz-xl: clamp(20px, 2.8vw, 28px);
    --fz-lg: clamp(18px, 2vw, 20px);
    --fz-base: clamp(16px, 1.5vw, 16px);
    --fz-sm: clamp(13px, 1.3vw, 13px);
}

*, *::before, *::after { box-sizing: border-box; }
body, h1, h2, h3, h4, p, ul, li, figure, dl, dt, dd { margin: 0; padding: 0; }
ul { list-style: none; }

body { padding-top: 80px; background-color: #fff; color: var(--text-main); font-family: 'Roboto', 'Noto Sans JP', sans-serif; font-size: var(--fz-base); line-height: 1.6; overflow-x: hidden; }
img { max-width: 100%; height: auto; vertical-align: bottom; }
.forSP { display: none; }
.forPC { display: inline-block; }

/* ========================================
   2. Layout & Utility
======================================== */
.container { max-width: 1100px; margin: 0 auto; }
.text-center { text-align: center; }
.text-left { text-align: left; }
.text-white { color: #fff; }
.text-green { color: var(--nidec-green); }
.text-bold { font-weight: bold; }

.section-title { margin-bottom: 10px; font-size: var(--fz-3xl); line-height: 1.1; text-align: left; text-transform: uppercase; overflow: hidden; }
.section-title::after { content: ""; position: relative; top: -0.05em; display: inline-block; width: 100%; height: 1px; margin-right: -100%; margin-left: 10px; background-color: currentColor; vertical-align: middle; }
.section-desc { margin-bottom: 20px; font-size: var(--fz-lg); }
.section-desc + p { margin-bottom: 40px; }

/* ========================================
   3. Header & Actions
======================================== */
header { position: fixed; top: 0; left: 0; z-index: 1000; display: flex; justify-content: space-between; align-items: center; width: 100%; height: 80px; background-color: #000; box-shadow: 0 2px 10px rgba(0, 0, 0, 0.5); }
header .logo { margin-left: 20px; width: 160px; font-size: 0; }
.header-actions { display: flex; height: 100%; }
.btn-header { display: flex; justify-content: center; align-items: center; padding: 0 20px; font-size: 14px; font-weight: bold; text-decoration: none; transition: opacity 0.3s; }
.btn-header:hover { opacity: 0.8; }
.btn-contact { background-color: var(--nidec-green); color: #fff; padding: 0 30px; font-size: var(--fz-lg); }
/*.btn-document { background-color: var(--nidec-green); color: #fff; }*/
.btn-contact .btn-icon { width: 30px; height: 30px; background: url('/files/user/www-nidec-com/en/special/automate2026/assets/img/icon_inquiry.svg') center left no-repeat; background-size: 20px auto; }
/*.btn-document .btn-icon { width: 25px; height: 25px; background: url('/files/user/www-nidec-com/en/special/automate2026/assets/img/icon_download.svg') center left no-repeat; background-size: 20px auto; }*/

/* ========================================
   4. Hero Section & Main Layout
======================================== */
.hero-automate { position: relative; display: flex; /*align-items: center;*/ color: #fff; }
.hero-container { position: absolute; left: 5vw; top: 6vw; z-index: 2; width: 100%; padding: 0; }
.hero-automate .interop-logo img { width: 440px; margin-bottom: 20px; filter: drop-shadow(3px 3px 10px #000); }
.hero-automate h2 { margin-bottom: 20px; font-size: var(--fz-3xl); line-height: 1.2; text-shadow: 3px 3px 10px #000; }
.hero-automate p { font-size: var(--fz-lg); font-weight: bold; text-shadow: 3px 3px 10px #000; }
.hero-automate p + p { display: inline-block; margin-top: 15px; padding: 10px 3px;border-top: 1px solid #fff; border-bottom: 1px solid #fff;  font-size: var(--fz-lg); font-weight: bold; text-shadow: 3px 3px 10px #000; }
.hero-automate .booth { position: absolute; right: 0; bottom: 0; z-index: 2;}
.hero-automate .kv,
.hero-automate .kv img { width: 100%; }
.hero-automate .booth img { width: 100%; }
.p-hero__slider { position: relative; width: 100%; overflow: hidden; z-index: 1; }
.p-hero__slider-inner { display: flex; width: 300%; animation: slideImage 12s cubic-bezier(0.25, 0.8, 0.25, 1) infinite; }
.p-hero__slide { width: 33.3333%; }
.p-hero__slide img { width: 100% !important; display: block;}
@keyframes slideImage {
  0%, 42%   { transform: translateX(0%); } 
  50%, 92%  { transform: translateX(-33.3333%); }
  100%      { transform: translateX(-66.6666%); }
}


.wrap { padding: 40px 0 120px; background: url('/files/user/www-nidec-com/en/special/automate2026/assets/img/bg.webp') center top repeat-y; background-size: 100% auto; }
#flexwave { margin-top: 80px; }
#flexwave article:last-child { margin-top: 80px; }
#kinex { margin-top: 100px; }
#other { margin-top: 70px; }
#about { padding: 100px 0 80px; }

/* ========================================
   5. Secrets (Swiper)
======================================== */
.secrets-swiper { width: 100vw; margin-top: 25px; margin-right: calc(50% - 50vw); margin-left: calc(50% - 50vw); padding-bottom: 50px; }
.secrets-swiper article { min-height: 620px; padding: 20px 35px 10px 40px; background: rgba(255, 255, 255, 0.5); border: 1px solid var(--nidec-green); border-radius: 12px; }
.secrets-swiper h3 { margin-bottom: 15px; color: var(--nidec-green); font-size: var(--fz-lg); }
.secrets-swiper h3 span { padding: 5px 13px; background: var(--nidec-green); color: #fff; border-radius: 50%; }
.secrets-swiper .swiper-desc { margin-bottom: 15px; font-size: var(--fz-xl); font-weight: bold; line-height: 1.2; text-align: left; }

.secrets-swiper .slide01 h3 + p + p { margin-top: 0; font-size: var(--fz-lg); }
.secrets-swiper .slide01 img { margin-top: 15px; width: 78%; }

.secrets-swiper .slide02 ul { display: flex; justify-content: space-between; align-items: stretch; margin: 20px auto; }
.secrets-swiper .slide02 ul li { width: 23%; text-align: center; }
.secrets-swiper .slide02 ul li dl { height: 100%; padding: 15px; background: #fff; box-shadow: 1px 1px 10px #ddd; }
.secrets-swiper .slide02 ul li dl dt { position: relative; margin-bottom: 20px; color: var(--nidec-green); font-size: var(--fz-base); font-weight: bold; text-align: center; }
.secrets-swiper .slide02 ul li dl dt::before { content: ""; position: absolute; bottom: -10px; left: 50%; width: 50px; height: 1px; background-color: var(--nidec-green); transform: translateX(-50%); }
.secrets-swiper .slide02 ul li dl dd p { margin-top: 10px; font-size: var(--fz-base); }

.secrets-swiper .slide03 ul { display: flex; flex-wrap: wrap; width: 900px; margin-left: 20px; padding-top: 10px; }
.secrets-swiper .slide03 ul li { width: 200px; margin-right: 50px; text-align: center; }
.secrets-swiper .slide03 ul li:nth-child(4) { margin-left: 120px; }
.secrets-swiper .slide03 ul li:last-child { margin-right: 0; }
.secrets-swiper .slide03 ul li dd { margin-top: 8px; color: var(--nidec-green); font-size: var(--fz-base); font-weight: bold; }
.secrets-swiper .slide04 .swiper-desc { height: 500px; padding-right: 500px; background: url('/files/user/www-nidec-com/en/special/automate2026/assets/img/slide_04.webp') right 50px top no-repeat; background-size: auto 500px; line-height: 1.35; }
.secrets-swiper .slide05 img { display: block; width: 80%; margin: 0 auto; text-align: center; }

.secrets-swiper .swiper-slide { width: 90vw; max-width: 1100px; text-align: left; opacity: 0.3; transition: opacity 0.4s ease; }
.secrets-swiper .swiper-slide-active { opacity: 1; }

.swiper-button-next, .swiper-button-prev { width: 70px; }
.swiper-button-prev::after, .swiper-button-next::after { content: none; }
.swiper-pagination-bullet-active { background: var(--nidec-green); }

.secrets-swiper .swiper-button-prev { left: calc(50vw - 600px); }
.secrets-swiper .swiper-button-next { right: calc(50vw - 600px); }

@media screen and (max-width: 1100px) {
    .secrets-swiper .swiper-button-prev { left: 20px; }
    .secrets-swiper .swiper-button-next { right: 20px; }
}

/* ========================================
   6. Products (FLEXWAVE / SmartFLEXWAVE)
======================================== */
.product-split { display: flex; flex-wrap: wrap; gap: 50px; }
.product-gallery { display: flex; flex-direction: column; width: 430px; }
.main-media-wrapper { width: 100%; overflow: hidden; border-radius: 8px; }
.main-media { width: 95%; vertical-align: bottom; transition: opacity 0.2s ease-in-out; margin: 0 auto; }

.product-gallery .thumbs { display: flex; gap: 15px; margin-top: 20px; }
.product-gallery .thumbs li { flex: 1; }
.product-gallery .thumbs button { width: 100%; padding: 0; background: none; border: 2px solid transparent; border-radius: 50%; cursor: pointer; opacity: 0.8; overflow: hidden; transition: border-color 0.3s, opacity 0.3s; }
.product-gallery .thumbs button:hover { border-color: var(--nidec-green); }
.product-gallery .thumbs button.active { border-color: var(--nidec-green); opacity: 1; }
.product-gallery .thumbs + p { margin-top: 15px; font-size: var(--fz-sm); text-align: center; }

.product-info { width: 620px; }
.product-info p { margin-top: 25px; line-height: 1.8; }
.product-info h3 { margin-bottom: 10px; font-size: var(--fz-2xl); }
.product-info h4 { margin-bottom: 30px; font-size: var(--fz-lg); line-height: 1.6; }

/* ========================================
   7. KINEX
======================================== */
.kinex-carousel-wrapper { position: relative; margin-top: 40px; overflow: visible !important; }
.kinex-main-swiper { padding-bottom: 50px; }
.kinex-item { display: flex; align-items: center; gap: 50px; }
.kinex-img { flex-shrink: 0; width: 430px; text-align: center; }
.kinex-img img { max-width: 100%; border-radius: 8px; }
.kinex-info { flex-shrink: 0; width: 620px; }
.kinex-info h3 { margin-bottom: 20px; font-size: var(--fz-2xl); }
.kinex-info p { margin-bottom: 35px; }

.kinex-button-prev, .kinex-button-next { position: absolute !important; top: calc(50% - 25px) !important; z-index: 100 !important; display: flex !important; width: 44px !important; height: 44px !important; margin-top: 0 !important; color: var(--nidec-green) !important; visibility: visible !important; opacity: 1 !important; pointer-events: auto !important; cursor: pointer; transform: translateY(-50%) !important; }
.kinex-button-prev::after, .kinex-button-next::after { display: block !important; visibility: visible !important; opacity: 1 !important; }
.kinex-button-prev { right: auto !important; left: -60px !important; }
.kinex-button-next { right: -60px !important; left: auto !important; }

@media screen and (max-width: 1160px) {
    .kinex-button-prev { left: 0 !important; }
    .kinex-button-next { right: 0 !important; }
}

/* ========================================
   8. Automate Info
======================================== */
#automate { padding: 80px 0 100px; background: url('/files/user/www-nidec-com/en/special/automate2026/assets/img/bg_booth.webp') center top no-repeat; background-size: cover; color: #fff; }
#automate h2 { margin-bottom: 20px; font-size: var(--fz-xl); }
#automate h3 { margin-bottom: 30px; }
#automate h3 + p { margin-bottom: 30px; font-size: var(--fz-base); line-height: 1.8; }

.booth-map { position: relative; max-width: 1100px; margin: 0 auto; padding: 25px; background: #fff; }
.booth-map .detail { position: absolute; top: 60%; right: 25px; width: 34%; }
.booth-map .detail dt { color: #53595d; font-size: var(--fz-lg); font-weight: bold; }
.booth-map .detail dd { color: #53595d; }
.booth-map .detail a { margin: 25px 0 0 0; color: #fff; }

/* ========================================
   9. About / Global Network (Dark Theme)
======================================== */
#about { background-image: linear-gradient(#252a2d, #53595d 50% 100%); color: #fff; }

.global-map-container { position: relative; max-width: 1100px; margin: 0 auto 60px; }
.global-map-container img { display: block; width: 100%; height: auto; }
.map-pin { position: absolute; z-index: 10; display: flex; justify-content: center; align-items: center; width: clamp(50px, 8vw, 80px); height: clamp(50px, 8vw, 80px); background: rgba(255, 255, 255, 0.6); border-radius: 50%; text-align: center; transform: translate(-50%, -100%); }
.map-pin .pin-number { color: var(--nidec-green); font-size: clamp(14px, 2.5vw, 22px); font-weight: bold; line-height: 1; }
.map-pin .pin-title { position: absolute; top: 100%; left: 50%; margin-top: 8px; color: #fff; font-size: clamp(10px, 1.5vw, 13px); line-height: 1.2; white-space: nowrap; text-shadow: 0 2px 4px rgba(0, 0, 0, 0.8); transform: translateX(-50%); }

.pin-01 { top: 41%; left: 20%; }
.pin-02 { top: 46%; left: 41%; }
.pin-03 { top: 44%; left: 73%; }
.pin-04 { top: 73%; left: 12%; }
.pin-05 { top: 84%; left: 87%; }

.size-s { width: clamp(30px, 6vw, 50px); height: clamp(30px, 6vw, 50px); }
.size-m { width: clamp(40px, 8vw, 70px); height: clamp(40px, 8vw, 70px); }
.size-l { width: clamp(60px, 10vw, 100px); height: clamp(60px, 10vw, 100px); }

.size-s .pin-number { font-size: clamp(14px, 2.5vw, 22px); }
.size-m .pin-number { font-size: clamp(17px, 3.0vw, 28px); }
.size-l .pin-number { font-size: clamp(20px, 3.5vw, 34px); }

.date { position: absolute; right: 0; bottom: 0; font-size: var(--fz-sm); text-align: right; }

.company-logo { margin: 60px 0 40px; text-align: center; }
.company-text { margin-bottom: 30px; font-size: var(--fz-base); text-align: left; }
.company-stats { display: flex; justify-content: space-between; width: 960px; margin: 0 auto; color: #fff; }
.company-stat-item { display: flex; flex: 1; flex-direction: column; justify-content: center; align-items: center; padding: 40px 20px; border-right: 1px solid #757a7d; }
.company-stat-item:last-child { border: none; }
.company-stat-icon { display: flex; align-items: center; width: 100px; margin-bottom: 15px; }
.company-stat-icon img { max-height: 100%; }
.company-stat-title { margin-bottom: 15px; font-size: var(--fz-lg); font-weight: bold; }
.company-stat-number { font-weight: bold; line-height: 1.2; text-align: center; }
.company-stat-number .js-count-up { font-size: var(--fz-3xl); }
.company-stat-number span:not(.js-count-up) { margin-left: 5px; font-size: var(--fz-lg); }

/* ========================================
   Buttons
======================================== */
.btnWrap { max-width: 620px; margin: 0 auto; }
.btnWrap .company,
.btnWrap .inquiry { width: 280px; margin: 40px auto 70px auto; text-align: center; }
.btn { position: relative; display: inline-flex; justify-content: center; align-items: center; gap: 8px; min-width: 280px; height: 60px; padding: 10px 40px 10px 25px; border: 2px solid transparent; border-radius: 60px; font-weight: bold; text-decoration: none; cursor: pointer; transition: 0.3s; }
.btn.external { margin: 0 auto; padding: 10px 25px 10px 40px; }
.btn:hover { opacity: 0.7; }
.btn--white { background-color: #fff; color: var(--nidec-green); }
.btn--green { background-color: var(--nidec-green); color: var(--color-text); }
.btn-icon { width: 18px; height: auto; }
.btn-arrow, .btn-arrow-external { position: absolute; right: 20px; width: 20px; height: 2px; background-color: currentColor; transition: transform 0.3s ease; }
.btn-arrow { top: 50%; transform: translateY(-50%); }
.btn-arrow-external { top: 45%; transform: translateY(-50%) rotate(-45deg); }
.btn-arrow::after, .btn-arrow-external::after { content: ""; position: absolute; top: -4px; right: 0; width: 10px; height: 10px; border-top: 2px solid currentColor; border-right: 2px solid currentColor; transform: rotate(45deg); }
.btn:hover .btn-arrow { transform: translateY(-50%) translateX(5px); }

.footer { padding: 15px; background: #000; color: #fff; font-size: var(--fz-base); text-align: center; }

/* ========================================
   10. Animations (Inview)
======================================== */
.fade-in-up { opacity: 0; transform: translateY(40px); transition: opacity 0.8s cubic-bezier(0.25, 1, 0.5, 1), transform 0.8s cubic-bezier(0.25, 1, 0.5, 1); }
.fade-in-up.is-inview { opacity: 1; transform: translateY(0); }
.delay-100 { transition-delay: 0.1s; }
.delay-200 { transition-delay: 0.2s; }
.delay-300 { transition-delay: 0.3s; }
.kv-anim { opacity: 0; animation: kvFadeInUp 0.8s cubic-bezier(0.25, 1, 0.5, 1) forwards; }
@keyframes kvFadeInUp { 0% { opacity: 0; transform: translateY(40px); } 100% { opacity: 1; transform: translateY(0); } }

/* ========================================
   11. Media Queries (SP)
======================================== */
@media screen and (max-width: 768px) {
    .forSP { display: block; }
    .forPC { display: none; }
    
    .container { padding: 0 5vw; }

    body { padding-top: 14vw; }
    header { height: 14vw; }
    header .logo { margin-left: 15px; width: 25vw; font-size: 0; }
    .btn-header { padding: 0 10px; font-weight: bold; font-size: 3vw; transition: opacity 0.3s; }



    .hero-automate { height: auto; padding: 0; align-items:normal;}
    .hero-automate .interop-logo img { width: 55vw; margin-bottom: 15px; filter: drop-shadow(3px 3px 10px #000); }
    .hero-container { left: 5vw; top: 20vw; width: 90vw; }
    .hero-automate h2 { font-size: 6.5vw; margin-bottom: 10px; }
    .hero-automate p { font-size: 4vw; }





   .wrap { padding: 10vw 0 15vw; background: url('/files/user/www-nidec-com/en/special/automate2026/assets/img/bg.webp') center top repeat-y; background-size: 100% auto; }


   .section-title { font-size: 6vw; }
   .section-desc { font-size: 4vw; }
   .secrets-swiper { margin-top: 20px;}
   .secrets-swiper .swiper-wrapper { align-items: stretch; }
   .secrets-swiper .swiper-slide { height: auto; }
   .secrets-swiper article { padding: 25px 15px; height: 100%; min-height: auto; display: flex; flex-direction: column; }
   .secrets-swiper .slide01 img { width: auto; }
   .secrets-swiper .slide03 ul { width: auto; margin-left: 0; padding-top: 10px; }
   .secrets-swiper .slide04 .swiper-desc { ackground: url('/files/user/www-nidec-com/en/special/automate2026/assets/img/slide_04.webp') right 50px top no-repeat; background-size: auto 500px; line-height: 1.35; }
   .secrets-swiper .slide05 img { width: auto; }
   .secrets-swiper h3 { margin-bottom: 15px; color: var(--nidec-green); font-size: var(--fz-md); display: flex; align-items: flex-start; gap: 8px;}
   .secrets-swiper h3 span { flex-shrink: 0;	width: 30px; height: 30px; display: flex; align-items: center; justify-content: center; border-radius: 50%; background: var(--nidec-green); color: #fff; line-height: 1; }
   .secrets-swiper .slide01 h3,
   .secrets-swiper .slide03 h3,
   .secrets-swiper .slide05 h3 { line-height: 1.2; }
   .secrets-swiper .swiper-desc { margin-bottom: 10px; font-size: 3.4vw; font-weight: bold; line-height: 1.2; text-align: left; }

   .secrets-swiper .slide01 h3 + p + p { margin: 0; font-size: 3.4vw; }
   .secrets-swiper .slide01 img {  }
    /*.secrets-swiper .slide02 ul { display: grid; grid-template-columns: repeat(2, 1fr); gap: 15px; margin: 20px 0 auto; }
    .secrets-swiper .slide02 ul li { width: 100%; text-align: center; }
    .secrets-swiper .slide02 ul li dl { padding: 15px 10px; height: 100%; }/*/
/* slide02 を2カラム（横並び）にしつつ、カード内を左画像・右テキストの構成に変更 */
    .secrets-swiper .slide02 ul { display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px; margin: 15px 0; }
    .secrets-swiper .slide02 ul li { width: 100%; text-align: left; }
    .secrets-swiper .slide02 ul li dl { display: grid; grid-template-columns: 45px 1fr; grid-template-rows: auto auto; gap: 5px 8px; padding: 10px 8px; align-items: start; height: 100%; box-sizing: border-box; }
    .secrets-swiper .slide02 ul li dl dd { display: contents; }
    .secrets-swiper .slide02 ul li dl dd figure { grid-column: 1 / 2; grid-row: 1 / 3; margin: 0; }
    .secrets-swiper .slide02 ul li dl dt { grid-column: 2 / 3; grid-row: 1 / 2; margin-bottom: 0; text-align: left; font-size: 3vw; line-height: 1.2; }
    .secrets-swiper .slide02 ul li dl dt::before { display: none; }
    .secrets-swiper .slide02 ul li dl dd p { grid-column: 2 / 3; grid-row: 2 / 3; margin-top: 0; text-align: left; font-size: 2.8vw; line-height: 1.2; }
    .secrets-swiper .slide02 ul + p { font-size: 3vw;}
    .secrets-swiper .slide02 .swiper-desc + p { font-size: 3.4vw; line-height: 1; }

    .secrets-swiper .slide03 ul { justify-content: space-between; gap: 15px 0; }
    .secrets-swiper .slide03 ul li { width: 30%; margin: 0 !important; }
    .secrets-swiper .slide03 ul li img { width: 80%; }
    .secrets-swiper .slide03 ul li dd { font-size: 3vw; line-height: 1.2; }
    .secrets-swiper .slide04 .swiper-desc { padding-right: 0; height: auto; background-size: 100%; background-position: -8vw bottom; padding-bottom: 65vw; }
    .secrets-swiper .slide05 .swiper-desc { margin-bottom: 25px; }
    
    .secrets-swiper .swiper-button-next, .secrets-swiper .swiper-button-prev { display: flex; transform: scale(0.6); }
    .secrets-swiper .swiper-button-prev { left: -5px; }
    .secrets-swiper .swiper-button-next { right: -5px; }

      #flexwave { margin-top: 40px; }
      #flexwave article:last-child { margin-top: 40px; }
      #kinex { margin-top: 60px; }
      #other { margin-top: 40px; }
      #automate { padding-top: 40px; }
      #about { padding: 100px 0 80px; }
      #automate h3 img { width: 80%;}

   .product-split { flex-direction: column; gap: 30px;; }
   .product-gallery, .product-info { flex: auto; width: 100%; min-width: auto; }
   .product-split h3 { font-size: var(--fz-lg); }
   .product-split h4 { font-size: 4vw; margin-bottom: 15px; }
   .product-info p { margin: 0 0 25px 0; }
   .kinex-info h3 { margin-bottom: 20px; font-size: var(--fz-lg); }
   .kinex-item { flex-direction: column; padding: 20px 0 0; gap: 20px; }
   .kinex-img, .kinex-info { width: 100%; }
   .kinex-info p+p { margin-bottom: 0; }
   .kinex-button-prev, .kinex-button-next { display: flex; transform: translateY(-50%) scale(0.6); top: 30%; }
   .kinex-button-prev { left: -3vw; }
   .kinex-button-next { right: -3vw; }

   .booth-map { padding: 5vw; }
   .booth-map .detail { position: relative; right: auto; top: auto; width: 100%; margin-top: 20px; }
   .booth-map .detail dt { font-size: 4.5vw; margin-bottom: 10px; }
   .booth-map .detail a { margin-top: 15px; }


   #about .date { position: absolute; right: 0; bottom: -2.5vw; font-size: 2.4vw; text-align: right;  }


    .company-logo { margin: 40px 0 30px; }
    .company-logo img { width: 40vw !important; }

    .company-stats { display: flex; flex-direction: column; align-items: center; gap: 20px; width: 100%; }
    .company-stat-item { border-right: none; aspect-ratio: 1 / 1; padding: 20px; display: flex; flex-direction: column; justify-content: center; align-items: center; background: rgba(255, 255, 255, 0.05); }
    .company-stat-icon { margin: 0 auto 10px auto; width: 25vw; height: auto; }
    .company-stat-icon img { width: 25vw; }
    .company-stat-title { font-size: 4vw; line-height: 1.2; margin-bottom: 5px; text-align: center; }
    .company-stat-number { margin-bottom: 0; }
    .company-stat-number span:not(.js-count-up) { font-size: var(--fz-base); }
    .company-stat-number .js-count-up { font-size: 8vw; }
    .map-pin::after { bottom: -5px; border-width: 6px 5px 0; }
    .btnWrap { width: 100%; }
    .btnWrap .company,
    .btnWrap .inquiry { width: 100%; margin: 30px auto 40px auto; }
    .btn { min-width: 100%; height: 55px; font-size: 4vw; padding: 10px 20px; }
}

@media screen and (max-width: 374px) {
    .company-stat-item { width: 70vw; }
    .company-stat-title { font-size: 12px; letter-spacing: normal; }
    .company-stat-number .js-count-up { font-size: 24px; }
    .company-stat-number span:not(.js-count-up) { font-size: 12px; }
}