@charset "UTF-8";
/*
z-index
*/
/*
layout
*/
/*
color
*/
/*
pxをvwに変換

ウインドウ幅1400pxに対して要素幅50pxの場合
getvw(50,1400)となる
*/
/*
メディアクエリ
記述例
body{
  @include ms-w('max',1200){
    background-color: red;
  }
}
*/
/*
overpassフォント
*/
/*
mixin
*/
/************************************************************
SCREEN ALL
*************************************************************/
section.kv .plx-target { will-change: transform; }

/************************************************************
SCREEN SP
*************************************************************/
@media screen and (max-width:1023px) {
  section.kv { margin-top: -70px; height: 540px; overflow: hidden; display: flex; align-items: center; justify-content: center; position: relative; }
  section.kv .kv-pic { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
  section.kv .kv-pic .plx-target { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-image: url("../images/kv-img.webp"); background-size: cover; background-position: center; }
  .no-webp section.kv .kv-pic .plx-target { background-image: url("../images/kv-img.jpg"); }
  section.kv .kv-title { text-align: center; position: relative; color: white; text-shadow: 0 0 10px rgba(0, 0, 0, 0.1); }
  section.kv .kv-title .kv-title-en { font-optical-sizing: auto; font-style: normal; font-size: 20px; font-weight: bold; line-height: 1.5em; }
  section.kv .kv-title .kv-title-ja { margin-top: 10px; font-size: 36px; font-weight: 600; line-height: 1.7em; letter-spacing: 0.1em; }
}
/************************************************************
SCREEN PC
*************************************************************/
@media screen and (min-width:1024px) {
  section.kv { margin-top: -100px; height: 540px; overflow: hidden; display: flex; align-items: center; justify-content: center; position: relative; }
  section.kv .kv-pic { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
  section.kv .kv-pic .plx-target { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-image: url("../images/kv-img.webp"); background-size: cover; background-position: center; }
  .no-webp section.kv .kv-pic .plx-target { background-image: url("../images/kv-img.jpg"); }
  section.kv .kv-title { text-align: center; position: relative; color: white; text-shadow: 0 0 10px rgba(0, 0, 0, 0.1); }
  section.kv .kv-title .kv-title-en { font-optical-sizing: auto; font-style: normal; font-size: 20px; font-weight: bold; line-height: 1.5em; }
  section.kv .kv-title .kv-title-ja { margin-top: 10px; font-size: 36px; font-weight: 600; line-height: 1.7em; letter-spacing: 0.1em; }
}
/************************************************************
SCREEN ALL
*************************************************************/
section.kv .kv-pic .plx-target { background-image: url("../images/kv-img.webp"); background-size: cover; background-position: center; }
.no-webp section.kv .kv-pic .plx-target { background-image: url("../images/kv-img.jpg"); }

/************************************************************
SCREEN SP
*************************************************************/
@media screen and (max-width:1023px) {
  section.personality .personality-txt-01 { margin-top: 30px !important; font-size: clamp(10px, 4.1025641026vw, 18px); line-height: 2.4em; text-align: center; }
}
/************************************************************
SCREEN PC
*************************************************************/
@media screen and (min-width:1024px) {
  section.personality .personality-txt-01 { margin-top: 30px !important; font-size: 18px; line-height: 2.4em; text-align: center; }
}
/************************************************************
SCREEN SP
*************************************************************/
@media screen and (max-width:1023px) {
  section.message { padding: 100px 0 100px; }
  section.message .message-pic { width: 90%; height: 300px; margin: 40px auto 0; }
  section.message .message-pic img { object-fit: cover; width: 100%; height: 100%; }
  section.message .message-txts { width: 90%; margin: 0 auto; padding-top: 60px; }
  section.message .message-txt-01 { font-size: 24px; font-weight: 600; line-height: 1.7em; text-align: center; margin-bottom: 30px; }
  section.message .message-txt-02 { font-size: 16px; line-height: 2em; }
  section.message .message-txt-01 + .message-txt-02 { margin-top: 30px; }
  section.message .message-txt-02 + .message-txt-02 { margin-top: 20px; }
  section.message .message-txt-name { margin-top: 30px; text-align: right; font-size: 16px; font-weight: 600; line-height: 45px; }
  section.message .message-txt-name small { font-size: 14px; font-weight: normal; line-height: 2em; display: inline-block; margin-right: 15px; }
  section.message .message-txt-name .sign { width: 153px; }
  section.message .message-links { margin-top: 60px; display: flex; flex-direction: column; gap: 20px 0; }
  section.message .message-links .message-link { width: 300px; height: 50px; margin: 0 auto; }
  section.message .message-links .message-link.-green a { font-size: 16px; }
  section.message .message-links .message-link.-green a[target=_blank] span::after { content: "\ea02"; display: inline-block; font-family: "icons"; font-style: normal; font-weight: normal; line-height: 1; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; margin-left: 0.5em; font-size: 12px; }
}
/************************************************************
SCREEN PC
*************************************************************/
@media screen and (min-width:1024px) {
  section.message { padding: 150px 0 200px; }
  section.message .message-pic { width: 900px; margin: 40px auto 0; }
  section.message .message-txts { width: 900px; margin: 0 auto; padding-top: 60px; }
  section.message .message-txt-01 { font-size: 24px; font-weight: 600; line-height: 1.7em; text-align: center; margin-bottom: 30px; }
  section.message .message-txt-02 { font-size: 16px; line-height: 2em; }
  section.message .message-txt-01 + .message-txt-02 { margin-top: 30px; }
  section.message .message-txt-02 + .message-txt-02 { margin-top: 20px; }
  section.message .message-txt-name { margin-top: 30px; text-align: right; font-size: 16px; font-weight: 600; line-height: 2em; }
  section.message .message-txt-name small { font-size: 14px; font-weight: normal; line-height: 45px; display: inline-block; margin-right: 15px; }
  section.message .message-txt-name .sign { width: 153px; }
  section.message .message-links { margin-top: 60px; display: flex; flex-direction: column; gap: 20px 0; }
  section.message .message-links .message-link { width: 400px; height: 70px; margin: 0 auto; }
  section.message .message-links .message-link.-green a { font-size: 18px; }
  section.message .message-links .message-link.-green a[target=_blank] span::after { content: "\ea02"; display: inline-block; font-family: "icons"; font-style: normal; font-weight: normal; line-height: 1; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; margin-left: 0.5em; font-size: 12px; }
}
/************************************************************
SCREEN ALL
*************************************************************/
section.data { background-color: #F4F7F6; }
section.data .common-round-btn.-green a[target=_blank] span::after { content: "\ea02"; display: inline-block; font-family: "icons"; font-style: normal; font-weight: normal; line-height: 1; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; margin-left: 0.5em; font-size: 12px; }

/************************************************************
SCREEN SP
*************************************************************/
@media screen and (max-width:1023px) {
  section.data { padding: 100px 0; }
  section.data .data-boxes { padding-top: 20px; }
  section.data .data-box { margin-top: 20px; background-color: white; border-radius: 20px; padding: 40px 7% 40px; position: relative; }
  section.data .data-box .data-box-title { font-size: 0.18rem; font-weight: 600; line-height: 1.7em; text-align: center; }
  section.data .data-box-age .charts { margin-top: 40px; display: flex; flex-direction: column; gap: 40px 0; }
  section.data .data-box-age .chart { display: flex; align-items: center; }
  section.data .data-box-age .chart .chart-name { width: 70px; min-width: 70px; font-size: 18px; font-weight: 600; line-height: 1em; position: relative; padding-left: 20px; }
  section.data .data-box-age .chart .chart-name::before { content: "\ea20"; display: inline-block; font-family: "icons"; font-style: normal; font-weight: normal; line-height: 1; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; color: #19B84F; position: absolute; top: 50%; left: 0; transform: translateY(-50%); font-size: 30px; }
  section.data .data-box-age .chart .chart-bar-track { margin: 0 10px 0 20px; width: 100%; height: 30px; background-color: #F4F7F6; }
  section.data .data-box-age .chart .chart-bar-track .chart-bar { width: 0%; height: 100%; background-color: #19B84F; transition: width 1s; }
  section.data .data-box-age .chart .chart-per { width: 60px; min-width: 60px; text-align: right; white-space: nowrap; transform: translateY(0.1em); }
  section.data .data-box-age .chart .chart-per .num { font-size: 34px; font-weight: bold; letter-spacing: 0; font-optical-sizing: auto; font-style: normal; line-height: 1em; color: #19B84F; display: inline-block; will-change: transform; }
  section.data .data-box-age .chart .chart-per .per { font-size: 16px; font-optical-sizing: auto; font-style: normal; line-height: 1em; display: inline-block; margin-left: 2px; }
  section.data .data-box-age .age-ave { margin-top: 40px; border-top: 1px solid #D5D5D5; padding-top: 15px; }
  section.data .data-box-age .age-ave .age-ave-txts { text-align: center; }
  section.data .data-box-age .age-ave .age-ave-txts.show .age-ave-txt-02 { opacity: 1; }
  section.data .data-box-age .age-ave .age-ave-txts .age-ave-txt-01 { font-size: 20px; font-weight: 600; line-height: 1.7em; display: inline-block; transform: translateY(-0.1em); }
  section.data .data-box-age .age-ave .age-ave-txts .age-ave-txt-02 { font-size: 40px; font-weight: bold; line-height: 1.5em; letter-spacing: 0; font-optical-sizing: auto; font-style: normal; color: #19B84F; display: inline-block; margin-left: 20px; will-change: transform; width: 2.1em; text-align: left; opacity: 0; }
  section.data .data-box-age .age-ave .age-ave-txts .age-ave-txt-03 { font-size: 18px; font-weight: 600; line-height: 1.7em; display: inline-block; margin-left: 4px; transform: translateY(-0.1em); }

  section.data .data-box-hometown .map-wrapper { position: relative; margin-top: 30px; width: 100%; aspect-ratio: 322 / 250; overflow: visible; }
  section.data .data-box-hometown .map .hon { width: 58.1%; transform: translateX(20%); }
  section.data .data-box-hometown .map .oki { width: 17.4%; position: absolute; bottom: 0; right: 0; }
  section.data .data-box-hometown .map-area { position: absolute; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; }
  section.data .data-box-hometown .map-area.show::before { opacity: 1; transform: scale(1); }
  section.data .data-box-hometown .map-area.show .map-area-name, section.data .data-box-hometown .map-area.show .map-area-num { opacity: 1; }
  section.data .data-box-hometown .map-area::before { content: ""; display: block; width: 100%; height: 100%; background-color: #F4F7F6; border-radius: 50%; position: absolute; top: 0; left: 0; transform: scale(0); will-change: transform; transition: transform 2s, opacity 0.5s; opacity: 0; }
  section.data .data-box-hometown .map-area .map-area-name { font-size: 14px; font-weight: 600; line-height: 1.5em; position: relative; z-index: 2; opacity: 0; transition: opacity 0.5s; }
  section.data .data-box-hometown .map-area .map-area-num { margin-top: 3px; transform: translateX(0.2em); position: relative; z-index: 3; opacity: 0; transition: opacity 0.5s; }
  section.data .data-box-hometown .map-area .map-area-num .num { font-size: 28px; font-weight: bold; font-optical-sizing: auto; font-style: normal; color: #19B84F; line-height: 1em; display: inline-block; will-change: transform; }
  section.data .data-box-hometown .map-area .map-area-num .per { font-size: 13px; font-optical-sizing: auto; font-style: normal; line-height: 1em; display: inline-block; margin-left: 3px; }
  section.data .data-box-hometown .map-area-tohoku { width: 19.4%; aspect-ratio: 1 / 1; max-width: 100px; top: 21%; left: 50%; margin-left: 17.4%; }
  section.data .data-box-hometown .map-area-kanto { width: 19.4%; aspect-ratio: 1 / 1; max-width: 100px; top: 48%; left: 50%; margin-left: 14%; }
  section.data .data-box-hometown .map-area-chubu { width: 25.3%; aspect-ratio: 1 / 1; max-width: 120px; top: 67.4%; left: 50%; margin-left: -4.7%; }
  section.data .data-box-hometown .map-area-chubu .map-area-num { margin-top: 5px; transform: translateX(0.4em); }
  section.data .data-box-hometown .map-area-chubu .map-area-num .num { font-size: 30px; }
  section.data .data-box-hometown .map-area-chubu .map-area-num .per { font-size: 18px; }
  section.data .data-box-hometown .map-area-kinki { width: 29.8%; aspect-ratio: 1 / 1; max-width: 150px; top: 12%; left: 50%; margin-left: -33.7%; }
  section.data .data-box-hometown .map-area-kinki .map-area-num { margin-top: 6px; transform: translateX(0.4em); }
  section.data .data-box-hometown .map-area-kinki .map-area-num .num { font-size: 40px; }
  section.data .data-box-hometown .map-area-kinki .map-area-num .per { font-size: 20px; }
  section.data .data-box-hometown .map-area-kyushu { width: 19.4%; aspect-ratio: 1 / 1; max-width: 100px; top: 45%; left: 50%; margin-left: -46.5%; }
  section.data .data-box-industry .industry-list { margin: 30px auto 0; }
  section.data .data-box-industry .industry-list.show ul li { opacity: 1; transform: translateX(0); }
  section.data .data-box-industry .industry-list ul { display: flex; flex-wrap: wrap; gap: 10px; }
  section.data .data-box-industry .industry-list ul li { display: inline-block; font-size: 15px; line-height: 1.5em; white-space: nowrap; padding: 13px 15px; background-color: #F4F7F6; border-radius: 5px; opacity: 0; transform: translateX(20px); transition: opacity 0.2s, transform 0.2s; will-change: transform, opacity; }
  section.data .data-box-company .logos { margin: 30px auto 0; }
  section.data .data-box-company .logos.show ul li { opacity: 1; transform: translateX(0); }
  section.data .data-box-company .logos ul { display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px; }
  section.data .data-box-company .logos ul li { opacity: 0; transform: translateX(20px); transition: opacity 0.2s, transform 0.2s; will-change: transform, opacity; }
  section.data .data-box-resin.show .resin-box { opacity: 1; transform: translateX(0); }
  section.data .data-box-resin .resin-boxes { margin-top: 30px; display: grid; gap: 10px; }
  section.data .data-box-resin .resin-boxes-col4 { grid-template-columns: repeat(2, 1fr); }
  section.data .data-box-resin .resin-boxes-col2 { grid-template-columns: repeat(2, 1fr); }
  section.data .data-box-resin .resin-boxes + .resin-boxes { margin-top: 10px; }
  section.data .data-box-resin .resin-box { border-radius: 10px; background-color: #F4F7F6; text-align: center; padding: 20px 7%; opacity: 0; transform: translateX(20px); transition: opacity 0.2s, transform 0.2s; will-change: transform, opacity; }
  section.data .data-box-resin .resin-box .resin-box-name { font-size: 18px; font-weight: 600; line-height: 1.5em; color: #19B84F; }
  section.data .data-box-resin .resin-box .resin-box-reason { margin-top: 10px; font-size: 13px; line-height: 1.5em; }
  section.data .data-box-resin .resin-box .resin-box-reason::before { content: "理由"; font-weight: 600; display: block; width: 100%; text-align: center; }
  section.data .data-box-hobby .hobby-list { margin-top: 30px; }
  section.data .data-box-hobby .hobby-list.show ul li { opacity: 1; transform: translateX(0); }
  section.data .data-box-hobby .hobby-list ul { display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px; }
  section.data .data-box-hobby .hobby-list ul li { display: block; border-radius: 10px; background-color: #F4F7F6; padding: 15px; text-align: center; font-size: 14px; line-height: 1.5em; opacity: 0; transform: translateX(20px); transition: opacity 0.2s, transform 0.2s; will-change: transform, opacity; }
  section.data .data-box-hobby .hobby-list ul li span[class^=icons-] { color: #19B84F; display: block; margin-bottom: 5px; font-size: 25px; }
  section.data .data-box-voice { padding-bottom: 2rem; }
  section.data .data-box-voice.show .voice { opacity: 1; transform: translateY(0) scale(1); }
  section.data .data-box-voice .voices { display: flex; flex-wrap: wrap; gap: 15px 10px; justify-content: center; margin: 30px auto 0; }
  section.data .data-box-voice .voice { display: inline-flex; align-items: center; padding: 0 15px; height: 53px; border-radius: 5px; background-color: #F4F7F6; position: relative; opacity: 0; transform-origin: bottom center; transform: translateY(30px) scale(0.2); transition: opacity 0.4s, transform 0.4s; will-change: transform, opacity; }
  section.data .data-box-voice .voice img { width: auto; height: 16px; }
  section.data .data-box-voice .voice::before { content: ""; display: block; background-color: #F4F7F6; height: calc(tan(60deg) * 20px / 2); width: 20px; clip-path: polygon(0 0, 100% 0, 50% 100%); position: absolute; left: 50%; bottom: -10px; transform: translateX(-50%); }
  section.data .data-box-voice .voice-pic { position: absolute; left: 50%; bottom: 40px; width: 100%; max-width: 530px; transform: translateX(-50%); }
  section.data .data-links { margin-top: 60px; display: flex; flex-direction: column; gap: 20px 0; }
  section.data .data-links .data-link { margin: 0 auto; width: 300px; height: 50px; }
  section.data .data-links .data-link a { font-size: 16px; }
}
/************************************************************
SCREEN PC
*************************************************************/
@media screen and (min-width:1024px) {
  section.data { padding: 150px 0; }
  section.data .data-boxes { margin-top: 40px; display: flex; flex-direction: column; gap: 20px 0; }
  section.data .data-box-row { display: grid; grid-template-columns: repeat(2, 1fr); gap: 0 20px; }
  section.data .data-box { background-color: white; border-radius: 20px; padding: 50px 60px 60px; position: relative; }
  section.data .data-box .data-box-title { font-size: 24px; font-weight: 600; line-height: 1.7em; text-align: center; }
  section.data .data-box-age .charts { margin-top: 40px; display: flex; flex-direction: column; gap: 0.4rem 0; }
  section.data .data-box-age .chart { display: flex; align-items: center; }
  section.data .data-box-age .chart .chart-name { width: 70px; min-width: 70px; font-size: 18px; font-weight: 600; line-height: 1em; position: relative; padding-left: 20px; }
  section.data .data-box-age .chart .chart-name::before { content: "\ea20"; display: inline-block; font-family: "icons"; font-style: normal; font-weight: normal; line-height: 1; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; color: #19B84F; position: absolute; top: 50%; left: 0; transform: translateY(-50%); font-size: 30px; }
  section.data .data-box-age .chart .chart-bar-track { margin: 0 10px 0 20px; width: 100%; height: 30px; background-color: #F4F7F6; }
  section.data .data-box-age .chart .chart-bar-track .chart-bar { width: 0%; height: 100%; background-color: #19B84F; transition: width 1s; }
  section.data .data-box-age .chart .chart-per { width: 60px; min-width: 60px; text-align: right; white-space: nowrap; transform: translateY(0.1em); }
  section.data .data-box-age .chart .chart-per .num { font-size: 34px; font-weight: bold; letter-spacing: 0; font-optical-sizing: auto; font-style: normal; line-height: 1em; color: #19B84F; display: inline-block; will-change: transform; }
  section.data .data-box-age .chart .chart-per .per { font-size: 16px; font-optical-sizing: auto; font-style: normal; line-height: 1em; display: inline-block; margin-left: 2px; }
  section.data .data-box-age .age-ave { margin-top: 40px; border-top: 1px solid #D5D5D5; padding-top: 15px; }
  section.data .data-box-age .age-ave .age-ave-txts { text-align: center; }
  section.data .data-box-age .age-ave .age-ave-txts.show .age-ave-txt-02 { opacity: 1; }
  section.data .data-box-age .age-ave .age-ave-txts .age-ave-txt-01 { font-size: 20px; font-weight: 600; line-height: 1.7em; display: inline-block; transform: translateY(-0.1em); }
  section.data .data-box-age .age-ave .age-ave-txts .age-ave-txt-02 { font-size: 40px; font-weight: bold; line-height: 1.5em; letter-spacing: 0; font-optical-sizing: auto; font-style: normal; color: #19B84F; display: inline-block; margin-left: 20px; will-change: transform; width: 2.1em; text-align: left; opacity: 0; }
  section.data .data-box-age .age-ave .age-ave-txts .age-ave-txt-03 { font-size: 18px; font-weight: 600; line-height: 1.7em; display: inline-block; margin-left: 4px; transform: translateY(-0.1em); }

  section.data .data-box-hometown .map-wrapper { width: 100%; max-width: 693px; aspect-ratio: 693 / 514; position: relative; margin: auto; left: 1.1rem; overflow: visible; }
  section.data .data-box-hometown .map .hon { width: 65.4%; }
  section.data .data-box-hometown .map .oki { width: 24.5%; position: absolute; bottom: 0; right: 0; }
  section.data .data-box-hometown .map-area { position: absolute; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; }
  section.data .data-box-hometown .map-area.show::before { opacity: 1; transform: scale(1); }
  section.data .data-box-hometown .map-area.show .map-area-name, section.data .data-box-hometown .map-area.show .map-area-num { opacity: 1; }
  section.data .data-box-hometown .map-area::before { content: ""; display: block; width: 100%; height: 100%; background-color: #F4F7F6; border-radius: 50%; position: absolute; top: 0; left: 0; transform: scale(0); will-change: transform; transition: transform 2s, opacity 0.5s; opacity: 0; }
  section.data .data-box-hometown .map-area .map-area-name { font-size: 16px; font-weight: 600; line-height: 1.5em; position: relative; z-index: 2; opacity: 0; transition: opacity 0.5s; }
  section.data .data-box-hometown .map-area .map-area-num { margin-top: 3px; transform: translateX(0.2em); position: relative; z-index: 3; opacity: 0; transition: opacity 0.5s; }
  section.data .data-box-hometown .map-area .map-area-num .num { font-size: 32px; font-weight: bold; font-optical-sizing: auto; font-style: normal; color: #19B84F; line-height: 1em; display: inline-block; will-change: transform; }
  section.data .data-box-hometown .map-area .map-area-num .per { font-size: 14px; font-optical-sizing: auto; font-style: normal; line-height: 1em; display: inline-block; margin-left: 3px; }
  section.data .data-box-hometown .map-area-tohoku { width: 13%; aspect-ratio: 1 / 1; top: 30.5%; left: 57%; }
  section.data .data-box-hometown .map-area-kanto { width: 13%; aspect-ratio: 1 / 1; top: 57.4%; left: 52.4%; }
  section.data .data-box-hometown .map-area-chubu { width: 17.3%; aspect-ratio: 1 / 1; top: 78%; left: 33.3%; }
  section.data .data-box-hometown .map-area-chubu .map-area-num { margin-top: 6px; transform: translateX(0.4em); }
  section.data .data-box-hometown .map-area-chubu .map-area-num .num { font-size: 40px; }
  section.data .data-box-hometown .map-area-chubu .map-area-num .per { font-size: 18px; }
  section.data .data-box-hometown .map-area-kinki { width: 23.1%; aspect-ratio: 1 / 1; top: 22.6%; left: 4.8%; }
  section.data .data-box-hometown .map-area-kinki .map-area-num { margin-top: 9px; transform: translateX(0.4em); }
  section.data .data-box-hometown .map-area-kinki .map-area-num .num { font-size: 50px; }
  section.data .data-box-hometown .map-area-kinki .map-area-num .per { font-size: 20px; }
  section.data .data-box-hometown .map-area-kyushu { width: 13%; aspect-ratio: 1 / 1; top: 63%; left: -13.3%; }
  section.data .data-box-industry .industry-list { margin: 30px auto 0; max-width: 960px; }
  section.data .data-box-industry .industry-list.show ul li { opacity: 1; transform: translateX(0); }
  section.data .data-box-industry .industry-list ul { display: flex; flex-wrap: wrap; gap: 10px; }
  section.data .data-box-industry .industry-list ul li { display: inline-block; font-size: 16px; line-height: 1.5em; white-space: nowrap; padding: 13px 15px; background-color: #F4F7F6; border-radius: 5px; opacity: 0; transform: translateX(20px); transition: opacity 0.2s, transform 0.2s; will-change: transform, opacity; }
  section.data .data-box-company .logos { max-width: 960px; margin: 30px auto 0; }
  section.data .data-box-company .logos.show ul li { opacity: 1; transform: translateX(0); }
  section.data .data-box-company .logos ul { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; }
  section.data .data-box-company .logos ul li { width: 184px; opacity: 0; transform: translateX(20px); transition: opacity 0.2s, transform 0.2s; will-change: transform, opacity; }
  section.data .data-box-resin.show .resin-box { opacity: 1; transform: translateX(0); }
  section.data .data-box-resin .resin-boxes { margin-top: 30px; display: grid; gap: 10px; }
  section.data .data-box-resin .resin-boxes-col4 { grid-template-columns: repeat(4, 1fr); }
  section.data .data-box-resin .resin-boxes-col2 { grid-template-columns: repeat(2, 1fr); }
  section.data .data-box-resin .resin-boxes + .resin-boxes { margin-top: 10px; }
  section.data .data-box-resin .resin-box { border-radius: 10px; background-color: #F4F7F6; text-align: center; padding: 20px 0; opacity: 0; transform: translateX(20px); transition: opacity 0.2s, transform 0.2s; will-change: transform, opacity; }
  section.data .data-box-resin .resin-box .resin-box-name { font-size: 20px; font-weight: 600; line-height: 1.5em; color: #19B84F; }
  section.data .data-box-resin .resin-box .resin-box-reason { margin-top: 10px; font-size: 14px; line-height: 1.5em; }
  section.data .data-box-resin .resin-box .resin-box-reason::before { content: "理由"; font-weight: 600; display: block; }
  section.data .data-box-hobby .hobby-list { margin-top: 30px; }
  section.data .data-box-hobby .hobby-list.show ul li { opacity: 1; transform: translateX(0); }
  section.data .data-box-hobby .hobby-list ul { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }
  section.data .data-box-hobby .hobby-list ul li { display: block; border-radius: 10px; background-color: #F4F7F6; padding: 15px; text-align: center; font-size: 14px; line-height: 1.5em; opacity: 0; transform: translateX(20px); transition: opacity 0.2s, transform 0.2s; will-change: transform, opacity; }
  section.data .data-box-hobby .hobby-list ul li span[class^=icons-] { color: #19B84F; display: block; margin-bottom: 5px; font-size: 25px; }
  section.data .data-box-voice.show .voice { opacity: 1; transform: translateY(0) scale(1); }
  section.data .data-box-voice .voices { display: flex; flex-wrap: wrap; gap: 15px 10px; justify-content: center; max-width: 410px; margin: 30px auto 0; }
  section.data .data-box-voice .voice { display: inline-flex; align-items: center; padding: 0 15px; height: 53px; border-radius: 5px; background-color: #F4F7F6; position: relative; opacity: 0; transform-origin: bottom center; transform: translateY(30px) scale(0.2); transition: opacity 0.4s, transform 0.4s; will-change: transform, opacity; }
  section.data .data-box-voice .voice img { width: auto; height: 16px; }
  section.data .data-box-voice .voice::before { content: ""; display: block; background-color: #F4F7F6; height: calc(tan(60deg) * 20px / 2); width: 20px; clip-path: polygon(0 0, 100% 0, 50% 100%); position: absolute; left: 50%; bottom: -10px; transform: translateX(-50%); }
  section.data .data-box-voice .voice-pic { position: absolute; left: 50%; bottom: 60px; width: 100%; max-width: 530px; transform: translateX(-50%); }
  section.data .data-links { margin-top: 60px; display: flex; flex-direction: column; gap: 20px 0; }
  section.data .data-links .data-link { margin: 0 auto; width: 400px; height: 70px; }
  section.data .data-links .data-link a { font-size: 18px; }
}

/* ============================================================
   カスタムスタイル（index.htmlより移植）
   ============================================================ */
/* Gutenberg段落ブロックの余白も統一 */
.wp-block-paragraph { margin-bottom: 1em !important; }

/* --- Valueセクション（#philosophy）だけ調整 --- */

/* 右カラムのテキストボックス幅を広げる（可読性を保てる範囲で） */
#philosophy .philosophy-policy-box { max-width: 720px; /* 好みで 680〜760px に調整可能 */ width: auto; /* 固定幅があれば解除 */ }

/* 段落は自然に折り返し・行間だけ調整 */
#philosophy .philosophy-policy-box-txt-03 { line-height: 1.8; white-space: normal; }

/* タブレット以下では全幅にして読みやすく */
@media (max-width: 1024px) {
  #philosophy .philosophy-policy-box { max-width: 100%; }
}

/* 箇条書きの見た目と余白 */
#philosophy .philosophy-list { margin: 0 0 1.2em 1.2em; /* 下余白＆左インデント */ padding-left: 1.2em; list-style: disc; }
#philosophy .philosophy-list li { font-size: 1em !important; /* 本文サイズに揃える */ font-weight: normal; /* 太字解除（テーマ側で太字なら） */ line-height: 1.8; margin: 0 0 .3em 0; list-style-position: outside; }
/* philosophy セクション内のリストの文字サイズを本文に合わせる（固定px指定） */
#philosophy .philosophy-list,
#philosophy .philosophy-list li { font-size: 14px !important; /* ← 好きなサイズに調整可能 */ font-weight: normal; line-height: 1.8; list-style-position: outside; }
#philosophy .philosophy-policy-box-txt-02 { font-weight: 700; /* 太字 */ font-size: 1.1em; /* 少し大きくする（任意） */ margin-top: 1em; /* 上に余白追加してメリハリ */ margin-bottom: 0.3em; /* 下余白は控えめに */ }
/* 見出しとリストの間隔を少し詰める */
#philosophy .philosophy-policy-box-txt-02 { margin-bottom: 0.3em; /* デフォルトより狭める（0.3〜0.5emお好み） */ }

/* 各リストと次の見出しの間隔を少し広げる */
#philosophy .philosophy-list { margin-bottom: 1.5em; /* ここを広げるとMetamorphoseまでの距離が取れる */ }

/* PC（768px以上）で特定のリンクを非表示にする */
    @media screen and (min-width: 1024px) {
        .pc-hide { display: none !important; }
    }

/* スマホ（767px以下）で特定のリンクを非表示にする */
    @media screen and (max-width: 1023px) {
        .mobile-hide { display: none !important; }
    }

section.data .data-box-grow .charts-wrapper { margin: 40px auto 0; width: 100%; aspect-ratio: 5 / 4; position: relative; }
section.data .data-box-grow .charts { height: 100%; display: grid; grid-template-columns: repeat(3, 1fr); gap: 0 12.5%; }
section.data .data-box-grow .chart { height: 100%; }
section.data .data-box-grow .chart .chart-bar-track { position: relative; height: 100%; }
section.data .data-box-grow .chart .chart-bar-track.show .chart-bar-wave { opacity: 1; }
section.data .data-box-grow .chart .chart-bar-track .chart-bar { position: absolute; left: 0; bottom: 0; width: 100%; background-color: #19B84F; transform: scaleY(0); transform-origin: bottom; will-change: transform; }
section.data .data-box-grow .chart .chart-bar-track .chart-bar-01 { height: 6px; transition: transform 0.5s; }
section.data .data-box-grow .chart .chart-bar-track .chart-bar-02 { height: 15px; transition: transform 0.5s; }
section.data .data-box-grow .chart .chart-bar-track .chart-bar-03 { height: 100%; transition: transform 1s; }
section.data .data-box-grow .chart .chart-bar-track .chart-bar-wave { width: 120%; position: absolute; top: 60px; left: 50%; transform: translateX(-50%); opacity: 0; transition: opacity 0.5s; transition-delay: 0.5s; }
section.data .data-box-grow .chart .chart-year { margin-top: 10px; text-align: center; font-size: 14px; font-weight: 600; line-height: 1.5em; }
section.data .data-box-grow .grow-fig { width: 65%; aspect-ratio: 260 / 254; position: absolute; top: 0; left: 0; }
section.data .data-box-grow .grow-fig.show .grow-fig-arrow { opacity: 1; transform: translateY(0); }
section.data .data-box-grow .grow-fig .grow-fig-arrow { opacity: 0; transform: translateY(40px); transition: opacity 1s, transform 1s; will-change: transform, opacity; }
section.data .data-box-grow .grow-fig .grow-fig-box { width: 69%; aspect-ratio: 1 / 1; position: absolute; top: 25%; left: 24%; border-radius: 50%; background-color: #F4F7F6; text-align: center; display: flex; flex-direction: column; justify-content: center; align-items: center; }
section.data .data-box-grow .grow-fig .grow-fig-box .grow-fig-box-txt-01 { font-size: min(18px,0.24rem); font-weight: 600; line-height: 1.7em; }
section.data .data-box-grow .grow-fig .grow-fig-box .grow-fig-box-txt-01::before { content: "\ea21"; display: inline-block; font-family: "icons"; font-style: normal; font-weight: normal; line-height: 1; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; color: #19B84F; display: inline-block; margin-right: 3px; font-size: 16px; }
section.data .data-box-grow .grow-fig .grow-fig-box .grow-fig-box-txt-02 { white-space: nowrap; margin-top: 5px; display: flex; justify-content: center; align-items: center; width: 100%; }
section.data .data-box-grow .grow-fig .grow-fig-box .grow-fig-box-txt-02 .num { font-size: min(40px,0.44rem); font-weight: bold; line-height: 1em; font-optical-sizing: auto; font-style: normal; color: #19B84F; display: inline-block; will-change: transform; }
section.data .data-box-grow .grow-fig .grow-fig-box .grow-fig-box-txt-02 .per { font-size: min(21px,0.36rem); line-height: 1em; font-optical-sizing: auto; font-style: normal; letter-spacing: 0; display: inline-block; margin-left: 2px; }
section.data .data-box-grow .grow-fig .grow-fig-box .grow-fig-box-txt-03 { font-size: min(21px,0.36rem); font-weight: 600; line-height: 1.7em; margin-top: -2px; }