/* ===============================
  FAQ風 共通サポート装飾
================================ */
/* ===============================
 sidebar
=============================== */

.qa-side{
    position:sticky;
    
}
.qa-side-main a{
    color:#fff;
}

.qa-side-main,
.qa-side-group{
    background:#fff;
    border-radius:20px;
    box-shadow:0 10px 28px rgba(70,50,20,.07);
    overflow:hidden;
    margin-bottom:18px;
}

.qa-side-main{
    padding:18px 20px;
    background:#01C8BD;
    color:#fff;
    font-weight:900;
}

.qa-side-group h3{
    margin:0;
    padding:16px 20px;
    background:#fffdf8;
    color:#242424;
    font-size:16px;
    font-weight:900;
    border-bottom:1px solid #eee;
}

.qa-side-group h3.active{
    color:#01C8BD;
}

.qa-side-group a{
    display:block;
    padding:13px 20px;
    color:#555;
    font-size:14px;
    font-weight:700;
    border-bottom:1px solid #eee;
    text-decoration:none;
    transition:.25s;
}

.qa-side-group a:last-child{
    border-bottom:none;
}

.qa-side-group a:hover{
    color:#01C8BD;
    background:#f7fffe;
}

@media(max-width:1024px){

    .qa-side{
        position:static;
    }

}
.pop-toy{
  position:relative;
  overflow:hidden;

  font-family:"Zen Kaku Gothic New",sans-serif;
}

.pop-toy-text{
    padding-left: 5%;
}


.pop-toy-inner{
  position:relative;
  z-index:2;
  margin:0 auto;
}

.pop-toy-hero{
  display:grid;
  grid-template-columns:1fr .95fr;
  gap:56px;
  align-items:center;
  margin-bottom:76px;
}

.pop-toy-label{
  display:flex;
  align-items:center;
  gap:18px;
  margin:0 0 24px;
  color:#01c8bd;
  font-size:20px;
  font-weight:900;
  letter-spacing:.08em;
}

.pop-toy-label span{
  width:86px;
  height:3px;
  background:#01c8bd;
  border-radius:999px;
}

.pop-toy-text h2{
  margin:0 0 28px;
  color:#111;
  font-size:2.5rem;
  line-height:1.55;
  font-weight:900;
  letter-spacing:.03em;
}

.pop-toy-text h2 strong{
  color:#01C8BD;
}

.pop-toy-text p{
  margin:0 0 20px;
  color:#222;
  font-size:1.5rem;
  line-height:2;
  font-weight:700;
}

.pop-toy-main-img{
  position:relative;
  overflow:hidden;

  width:85%;          /* 追加 */
  max-width:480px;    /* 追加 */

  margin:0 auto;      /* 中央寄せ */

  aspect-ratio:1.2 / 1;
  border-radius:42% 58% 48% 52% / 50% 42% 58% 50%;
  background:#f6f6f6;
  box-shadow:0 20px 40px rgba(40,30,20,.12);
}

.pop-toy-main-img img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}

.pop-toy-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:34px;
}

.pop-toy-card{
  position:relative;
  display:grid;
  grid-template-columns:230px 1fr;
  gap:24px;
  align-items:center;
  min-height:220px;
  padding:26px;
  border-radius:34px;

}


.pop-toy-icon{
  position:absolute;
  
}

.pop-toy-img{
  overflow:hidden;
  aspect-ratio:4 / 3;
  border-radius:45% 55% 50% 50% / 55% 45% 55% 45%;
  background:#f7f7f7;
  margin-left:12px;
}

.pop-toy-img img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}

.pop-toy-body h3{
  margin:0 0 14px;
  color:currentColor;
  font-size:24px;
  line-height:1.45;
  font-weight:900;
  letter-spacing:.04em;
}

.pop-toy-body p{
  margin:0;
  color:#222;
  font-size:15px;
  line-height:1.9;
  font-weight:800;
}

.pop-toy::before,
.pop-toy::after{
  pointer-events:none;
}

@media(max-width:1024px){
  .pop-toy-hero{
    grid-template-columns:1fr;
  }

  .pop-toy-main-img{
    width:min(680px,100%);
    margin:0 auto;
  }

  .pop-toy-grid{
    grid-template-columns:1fr;
  }

  .pop-toy-card{
    grid-template-columns:240px 1fr;
  }
}

@media(max-width:640px){
  .pop-toy{
    padding:64px 16px 86px;
  }

  .pop-toy-label{
    justify-content:center;
    font-size:16px;
  }

  .pop-toy-label span{
    width:44px;
  }

  .pop-toy-text h2{
    text-align:center;
    font-size:2rem;
  }

  .pop-toy-card{
    grid-template-columns:1fr;
    padding:22px;
    border-radius:26px;
  }

  .pop-toy-img{
    margin:42px 0 0;
  }

  .pop-toy-body h3{
    font-size:21px;
  }
}





/* ===============================
SVG
=============================== */

.ps_object1,
.ps_object2,
.ps_object3,
.ps_object4{
    position:absolute;
    height:auto;
    object-fit:contain;
    pointer-events:none;
}

/* ---------- PC ---------- */

    .ps_object1{
        width:20%;
        top:15%;
    }

    .ps_object2{
        width:25%;
        top:0;
        right:0;
    }

    .ps_object3{
        width:20%;
        top:55%;
        left:0;
    }



/* ---------- Tablet ---------- */

@media (max-width:1024px){

    .ps_object1{
        width:20%;
        top:30%;
    }

    .ps_object2{
        width:30%;
        top:0;
    }

    .ps_object3{
        width:40%;
        top:50%;
        left:0;
    }
  }



/* ---------- Mobile ---------- */

@media (max-width:767px){

    .ps_object1{
        width:20%;
        top:30%;
    }

    .ps_object2{
        width:30%;
        top:0;
    }

    .ps_object3{
        width:40%;
        top:50%;
        left:0;
    }
@media(max-width:640px){

.pop-toy-grid{
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 16px;
}

}

}
/* ===============================
  上部見出しエリア追加
=============================== */

.ps-page{
  position:relative;
  overflow:hidden;
  background:#f7f2e9;
}

.toy-top-hero{
  position:relative;
  z-index:3;
  width:100%;
  padding:100px 20px 90px;
  text-align:center;
}

.toy-top-inner{
  width:min(1180px,100%);
  margin:0 auto;
}

.toy-top-en{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:28px;
  margin:0 0 24px;
  color:#01C8BD;
  font-size:32px;
  line-height:1;
  font-weight:900;
  letter-spacing:.12em;
}

.toy-top-en span{
  width:135px;
  height:4px;
  background:#01C8BD;
  border-radius:999px;
}

.toy-top-hero h1{
  margin:0 0 22px;
  color:#242424;
  font-size:clamp(44px,5vw,68px);
  line-height:1.25;
  font-weight:900;
  letter-spacing:.08em;
}

.toy-top-lead{
  max-width:1080px;
  margin:0 auto;
  color:#555;
  font-size:18px;
  line-height:2.1;
  font-weight:900;
  letter-spacing:.04em;
}

.toy-top-lead strong{
  color:#01C8BD;
}

/* SVG 下からポワン */
.ordermade_page .ps_object1,
.ordermade_page .ps_object2,
.ordermade_page .ps_object3{
  opacity:0;
  animation:toySvgPoyon 2s cubic-bezier(.19,1,.22,1) forwards;
  will-change:transform, opacity;
}

.ordermade_page .ps_object1{ animation-delay:.15s; }
.ordermade_page .ps_object2{ animation-delay:.4s; }
.ordermade_page .ps_object3{ animation-delay:.65s; }

@keyframes toySvgPoyon{
  0%{
    opacity:0;
    transform:translateY(90px) scale(.82);
  }

  60%{
    opacity:1;
    transform:translateY(-12px) scale(1.04);
  }

  80%{
    transform:translateY(5px) scale(.98);
  }

  100%{
    opacity:1;
    transform:translateY(0) scale(1);
  }
}

/* tablet */
@media(max-width:1024px){
  .toy-top-hero{
    padding:80px 18px 70px;
  }

  .toy-top-en{
    font-size:24px;
    gap:20px;
  }

  .toy-top-en span{
    width:90px;
  }
}

/* mobile */
@media(max-width:767px){
  .toy-top-hero{
    padding:64px 16px 54px;
  }

  .toy-top-en{
    gap:12px;
    font-size:17px;
  }

  .toy-top-en span{
    width:42px;
    height:3px;
  }

  .toy-top-hero h1{
    font-size:34px;
  }

  .toy-top-lead{
    font-size:1rem;
    line-height:2;
    margin: 0 auto;
  }
}
/* 画像だけふわっと拡大 */

.pop-toy-img{
    overflow:hidden;
}

.pop-toy-img img{
    display:block;
    transition:transform .35s ease;
    will-change:transform;
    width:120%;
    height: 100%;
}

.pop-toy-img a:hover img{
    transform:scale(1.06);
}

/* ===========================
   HERO タイトル上のライン
=========================== */

.hero-category{
    display:flex;
    align-items:center;
    gap:28px;
    margin-bottom:24px;
    width:fit-content;
    margin-top: 100px;
}

.hero-category span{
    width:90px;
    height:2px;
    background:#3a3a3a;
    display:block;
}

.hero-category .en{
    margin:0;
    color:#222;
    font-size:3rem;
    font-weight:900;
    line-height:1;
    letter-spacing:.08em;
}

/* ---------- iPad ---------- */

@media (max-width:1024px){

.hero-category{
    gap:20px;
    margin-top: 100px;
}

.hero-category span{
    width:60px;
}

.hero-category .en{
    font-size:3rem;
}

}

/* ---------- SP ---------- */

@media (max-width:767px){

.hero-category{
    justify-content:center;
    margin:0 auto 18px;
    gap:16px;
}

.hero-category span{
    width:42px;
}

.hero-category .en{
    font-size:18px;
}

}
/* ===============================
  HERO 配置調整
=============================== */

.pop-toy-hero{
  width:min(1180px, calc(100% - 40px));
  margin:0 auto 76px;
  display:grid;
  grid-template-columns:1.08fr .82fr;
  gap:42px;
  align-items:center;
}

.pop-toy-text{
  padding-left:0;
}

.pop-toy-main-img{
  width:100%;
  max-width:420px;
  margin:0 auto;
}

.pop-toy-main-img-sp{
  display:none;
}

/* iPad */
@media(max-width:1024px){

  .pop-toy-hero{
    width:min(760px, calc(100% - 36px));
    display:block;
    margin-bottom:56px;
  }

  .pop-toy-main-img-pc{
    display:none;
  }

  .pop-toy-main-img-sp{
    display:block;
    width:72%;
    max-width:420px;
    margin:26px auto 28px;
  }

  .pop-toy-text h2{
    text-align:center;
  }

  .pop-toy-text p{
    text-align:left;
  }

}

/* SP */
@media(max-width:640px){

  .pop-toy-hero{
    width:calc(100% - 24px);
    margin-bottom:42px;
  }

  .pop-toy-main-img-sp{
    width:82%;
    max-width:300px;
    margin:22px auto 24px;
  }

  .pop-toy-text h2{
    font-size:2rem;
    line-height:1.55;
  }

  .pop-toy-text p{
    font-size:1rem;
    line-height:1.9;
  }

}
.os-case{
  padding:0;
}

.os-case-inner{
  display:grid;
  grid-template-columns:1fr auto;
  align-items:center;
  min-height:230px;
}

.os-case .os-en,
.os-case .os-title{
  text-align:center;
}

.case-list-section{
  padding:70px 24px;
  background:#f5f1e9;
}

.case-list{
  width:min(1500px,100%);
  margin:0 auto;
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:34px;
}

.case-item{
  background:#fff;
  border-radius:24px;
  padding:28px;
}

.case-item a{
  display:grid;
  grid-template-columns:1.05fr .95fr;
  gap:34px;
  align-items:center;
  color:inherit;
  text-decoration:none;
}

.case-img{
  width:100%;
  aspect-ratio:1.35/1;
  border-radius:12px;
  overflow:hidden;
}

.case-img img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}

.case-category{
  display:inline-flex;
  min-width:140px;
  margin:0 0 18px;
  padding:7px 20px;
  border:3px solid #222;
  border-radius:999px;
  background:#fff;
  font-size:18px;
  font-weight:900;
}

.case-content h3{
  position:relative;
  margin:0 0 18px;
  padding-left:18px;
  padding-bottom:18px;
  border-bottom:2px dashed #222;
  font-size:20px;
  line-height:1.55;
  font-weight:900;
}

.case-content h3::before{
  content:"";
  position:absolute;
  left:0;
  top:.45em;
  width:6px;
  height:18px;
  border-radius:999px;
  background:#f4c800;
}

.case-type{
  margin:0 0 12px;
  font-size:17px;
  font-weight:900;
}

.case-tags{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
}

.case-tags span{
  display:inline-flex;
  align-items:center;
  min-height:30px;
  padding:5px 15px;
  border-radius:5px;
  background:#999;
  color:#fff;
  font-size:15px;
  font-weight:900;
}

.case-btn-wrap{
  margin-top:70px;
  margin-bottom:100px;
  display:flex;
  justify-content:center;
}

.case-btn{

  background:#fff;
  border:4px solid #2d2d2d;
  border-radius:999px;
  display:flex;
  align-items:center;
  justify-content:center;
  color:#2d2d2d;
  text-decoration:none;
  font-weight:900;
  transition:.3s;
}

.case-btn i{
  width:4px;
  height:54px;
  background:#2d2d2d;
  position:relative;
}


.case-btn i::after{
  content:"→";
  position:absolute;
  left:16px;
  top:50%;
  transform:translateY(-50%);
  font-style:normal;
  font-size:62px;
  font-weight:300;
}

.case-btn:hover{
  background:#2d2d2d;
  color:#fff;
}

.case-btn:hover i,
.case-btn:hover i::after{
  background:#fff;
  color:#fff;
}

.os-section.os-case{
  margin-top: 50px;
}
@media(max-width:1024px){
  .case-list{
    grid-template-columns:1fr;
  }
}

@media(max-width:640px){
  .case-list-section{
    padding:40px 14px;
  }

  .case-item{
    padding:18px;
    border-radius:18px;
  }

  .case-item a{
    grid-template-columns:1fr;
    gap:20px;
  }

  .case-category{
    font-size:15px;
  }

  .case-content h3{
    font-size:16px;
  }

  .case-type{
    font-size:14px;
  }

  .case-tags span{
    font-size:13px;
  }

  .case-btn{
    width:80%;
    height:72px;
    gap:22px;
    font-size:18px;
    border-width:2px;
  }

  .case-btn i{
    height:34px;
    width:2px;
  }

  .case-btn i::after{
    left:6px;
    font-size:16px;
  }
}
/* =========================================
   CASE タイトル
========================================= */

.os-case{
    padding:0;
}

.os-case .os-en{
    margin:0 0 12px;
    text-align:center;
    color:#01C8BD;
    font-size:18px;
    font-weight:900;
    line-height:1;
    letter-spacing:.08em;
}

.os-case .os-title{
    margin:0;
    text-align:center;
    color:#222;
    font-size:clamp(34px,4vw,48px);
    line-height:1.35;
    font-weight:900;
    letter-spacing:.06em;
}

.os-case-inner{
    display:grid;
    grid-template-columns:1fr auto;
    align-items:center;
    min-height:230px;
}

/* ---------- Tablet ---------- */

@media(max-width:1024px){

    .os-case .os-en{
        font-size:16px;
    }

    .os-case .os-title{
        font-size:36px;
    }

    .os-case-inner{
        grid-template-columns:1fr;
        gap:36px;
    }

}

/* ---------- SP ---------- */

@media(max-width:767px){

    .os-case .os-en{
        font-size:15px;
    }

    .os-case .os-title{
        font-size:28px;
        line-height:1.45;
    }

}

.case-btn-wrap{
    margin-top:56px;
    margin-bottom:80px;
    display:flex;
    justify-content:center;
}

.case-btn{
    width:360px;
    max-width:90%;
    height:64px;

    display:flex;
    align-items:center;
    justify-content:center;
    gap:26px;

    background:#fff;
    border:3px solid #2d2d2d;
    border-radius:999px;

    color:#2d2d2d;
    text-decoration:none;

    font-size:20px;
    font-weight:900;

    transition:.3s;
}

.case-btn span{
    line-height:1;
}

.case-btn i{
    width:3px;
    height:36px;
    background:#2d2d2d;
    position:relative;
}

.case-btn i::after{
    content:"→";
    position:absolute;
    left:10px;
    top:50%;
    transform:translateY(-50%);
    font-size:24px;
    font-style:normal;
    font-weight:400;
    line-height:1;
}

.case-btn:hover{
    background:#2d2d2d;
    color:#fff;
}

.case-btn:hover i{
    background:#fff;
}

.case-btn:hover i::after{
    color:#fff;
}

@media(max-width:767px){

    .case-btn{
        width:280px;
        height:56px;
        gap:16px;
        font-size:16px;
    }

    .case-btn i{
        height:28px;
        width:2px;
    }

    .case-btn i::after{
        left:8px;
        font-size:18px;
    }

}
/* =========================================================
   キッズ遊具 6カラム：全デバイス中央寄せ調整
   ※デザインは変更せず、横幅と余白だけ整える
========================================================= */
.pop-toy-grid{
  width:min(1080px, calc(100% - 64px));
  margin:0 auto;
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 500px));
  justify-content:center;
  gap:34px;
}

.pop-toy-card{
  width:100%;
  max-width:500px;
  margin:0 auto;
}

@media(max-width:1024px){
  .pop-toy-grid{
    width:min(720px, calc(100% - 56px));
    grid-template-columns:1fr;
    justify-content:center;
    gap:28px;
  }

  .pop-toy-card{
    max-width:680px;
    margin:0 auto;
  }
}

@media(max-width:640px){
  .pop-toy-grid{
    width:min(430px, calc(100% - 36px));
    grid-template-columns:1fr;
    justify-content:center;
    gap:24px;
  }

  .pop-toy-card{
    width:100%;
    max-width:390px;
    margin:0 auto;
  }
}

/* =========================================================
   キッズ遊具 6カラム中央寄せ調整 完全版追記
   PC / iPad / SP すべて2カラム維持
========================================================= */

.pop-toy-grid{
  width:min(1040px, calc(100% - 56px));
  margin:0 auto;
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:30px;
  justify-content:center;
  align-items:stretch;
}

.pop-toy-card{
  width:100%;
  max-width:500px;
  margin:0 auto;
}

@media(max-width:1024px){
  .pop-toy-grid{
    width:min(820px, calc(100% - 48px));
    grid-template-columns:repeat(2, minmax(0, 1fr));
    gap:22px;
  }

  .pop-toy-card{
    grid-template-columns:1fr;
    max-width:390px;
    padding:20px;
    text-align:center;
  }

  .pop-toy-img{
    width:100%;
    margin:0 auto 14px;
    aspect-ratio:1 / 1;
  }

  .pop-toy-body{
    text-align:center;
  }

  .pop-toy-body h3,
  .pop-toy-body p{
    text-align:center;
  }
}

@media(max-width:640px){
  .pop-toy-grid{
    width:calc(100% - 28px);
    grid-template-columns:repeat(2, minmax(0, 1fr));
    gap:14px;
  }

  .pop-toy-card{
    max-width:none;
    min-height:auto;
    padding:14px;
    border-radius:20px;
  }

  .pop-toy-img{
    width:100%;
    margin:0 auto 12px;
    aspect-ratio:1 / 1;
    border-radius:38% 62% 48% 52% / 52% 42% 58% 48%;
  }

  .pop-toy-body h3{
    margin-bottom:8px;
    font-size:15px;
    line-height:1.4;
  }

  .pop-toy-body p{
    font-size:11px;
    line-height:1.55;
  }
}

@media(max-width:390px){
  .pop-toy-grid{
    width:calc(100% - 20px);
    gap:10px;
  }

  .pop-toy-card{
    padding:12px 10px;
    border-radius:18px;
  }

  .pop-toy-body h3{
    font-size:14px;
  }

  .pop-toy-body p{
    font-size:10px;
  }
}
/* =========================================================
   ブロック遊具など一覧：中央寄せ・画像途切れ防止・iPad画像縮小
========================================================= */

.pop-toy-grid{
  width:min(980px, calc(100% - 64px)) !important;
  margin:0 auto !important;
  display:grid !important;
  grid-template-columns:repeat(2, minmax(0, 1fr)) !important;
  justify-content:center !important;
  align-items:stretch !important;
  gap:28px !important;
}

.pop-toy-card{
  width:100% !important;
  max-width:470px !important;
  margin:0 auto !important;
}

.pop-toy-img{
  width:100% !important;
  max-width:210px !important;
  margin:0 auto 16px !important;
  aspect-ratio:1 / 1 !important;
  overflow:hidden !important;
}

.pop-toy-img img{
  width:100% !important;
  height:100% !important;
  object-fit:contain !important;
  object-position:center !important;
  transform:none !important;
}

/* iPad */
@media(max-width:1024px){

  .pop-toy-grid{
    width:min(720px, calc(100% - 48px)) !important;
    grid-template-columns:repeat(2, minmax(0, 1fr)) !important;
    gap:22px !important;
  }

  .pop-toy-card{
    max-width:330px !important;
    padding:18px !important;
  }

  .pop-toy-img{
    max-width:165px !important;
    margin:0 auto 14px !important;
  }

  .pop-toy-body h3{
    font-size:17px !important;
  }

  .pop-toy-body p{
    font-size:12px !important;
  }

}

/* スマホ */
@media(max-width:640px){

  .pop-toy-grid{
    width:calc(100% - 24px) !important;
    grid-template-columns:repeat(2, minmax(0, 1fr)) !important;
    gap:12px !important;
  }

  .pop-toy-card{
    max-width:none !important;
    padding:12px !important;
  }

  .pop-toy-img{
    max-width:120px !important;
    margin:0 auto 10px !important;
    aspect-ratio:1 / 1 !important;
  }

  .pop-toy-body h3{
    font-size:14px !important;
    line-height:1.35 !important;
  }

  .pop-toy-body p{
    font-size:10px !important;
    line-height:1.5 !important;
  }

}
/* =========================================================
   一覧画像：枠内にきれいに収める
========================================================= */

.pop-toy-img{
  width:100% !important;
  max-width:none !important;
  aspect-ratio:4 / 3 !important;
  margin:0 auto 16px !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  overflow:hidden !important;
}

.pop-toy-img a{
  width:100% !important;
  height:100% !important;
  display:block !important;
}

.pop-toy-img img{
  width:100% !important;
  height:100% !important;
  object-fit:cover !important;
  object-position:center !important;
  transform:none !important;
}

/* iPad：画像を少し小さくしつつ枠内に収める */
@media(max-width:1024px){

  .pop-toy-img{
    width:88% !important;
    max-width:220px !important;
    aspect-ratio:4 / 3 !important;
    margin:0 auto 14px !important;
  }

}

/* スマホ：2カラム内で枠に収める */
@media(max-width:640px){

  .pop-toy-img{
    width:100% !important;
    max-width:none !important;
    aspect-ratio:4 / 3 !important;
    margin:0 auto 10px !important;
  }

}
/* ==========================
   ALL ITEM 見出し
========================== */

.vaultingbox-products-inner{
    text-align:center;
    margin-top: 100px;
}

.vaultingbox-products-en{
    margin:0 0 12px;
    color:var(--main);
    font-size:2rem;
    line-height:1;
    font-weight:900;
    letter-spacing:.08em;

    display:flex;
    justify-content:center;
    align-items:center;
}

.vaultingbox-products-title{
    margin:0 0 60px;
    color:#222;
    font-size:clamp(30px,4vw,48px);
    line-height:1.42;
    font-weight:900;
    letter-spacing:.04em;
}