/* ==========================================================
   株式会社 Y's twin — Top page design refine
   ========================================================== */

:root{
  --c-ink:#2a2826;
  --c-ink-2:#5c5753;
  --c-ink-3:#8c8680;
  --c-line:#e3ddd5;
  --c-line-2:#efeae3;
  --c-base:#fff;
  --c-off:#f8f6f1;      /* オフホワイト */
  --c-cream:#fbf8f0;    /* 既存ベージュ(#fcfaf2)を継承 */
  --c-brand:#c7463b;    /* 既存 #ce4f45 を少し落ち着かせた赤 */
  --c-brand-d:#a63a31;
  --c-brand-l:#f6e9e6;
  --c-leaf:#5a8a42;     /* ロゴのグリーン（控えめに使用） */

  --f-ja:"Noto Sans JP","Hiragino Kaku Gothic ProN","Hiragino Sans",Meiryo,sans-serif;
  --f-en:"Cormorant Garamond",Georgia,"Times New Roman",serif;

  --w-content:1140px;
  --gutter:clamp(20px,5vw,48px);
  --sec-y:clamp(72px,9vw,128px);

  --ease:cubic-bezier(.22,.61,.36,1);
  --dur:.6s;
}

*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{
  margin:0;
  font-family:var(--f-ja);
  font-weight:400;
  font-size:15px;
  line-height:1.9;
  letter-spacing:.04em;
  color:var(--c-ink);
  background:var(--c-base);
  font-feature-settings:"palt";
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
img{max-width:100%;height:auto;display:block}
a{color:inherit;text-decoration:none}
ul,ol{margin:0;padding:0;list-style:none}
h1,h2,h3,p,figure,address{margin:0}
address{font-style:normal}
button{font:inherit;color:inherit;background:none;border:0;padding:0;cursor:pointer}

.container{width:min(100% - var(--gutter)*2,var(--w-content));margin-inline:auto}
.pc{display:inline}
@media (max-width:767px){.pc{display:none}}

/* ---------- Section heading ---------- */
.sec-head{text-align:center;margin-bottom:clamp(40px,5vw,64px)}
.sec-head--left{text-align:left}
.sec-head__en{
  display:block;
  font-family:var(--f-en);
  font-style:italic;
  font-weight:500;
  font-size:clamp(17px,1.6vw,21px);
  letter-spacing:.08em;
  color:var(--c-brand);
  line-height:1;
  margin-bottom:14px;
}
.sec-head__ja{
  font-size:clamp(26px,3vw,36px);
  font-weight:700;
  letter-spacing:.08em;
  line-height:1.4;
  position:relative;
  padding-bottom:18px;
}
.sec-head__ja::after{
  content:"";
  position:absolute;left:50%;bottom:0;
  width:28px;height:1px;background:var(--c-ink);
  transform:translateX(-50%);
}
.sec-head--left .sec-head__ja::after{left:0;transform:none}

/* ---------- Button ---------- */
.btn{
  position:relative;
  display:inline-flex;align-items:center;justify-content:space-between;gap:28px;
  min-width:280px;min-height:56px;
  padding:14px 26px 14px 30px;
  border:1px solid var(--c-ink);
  color:var(--c-ink);
  font-size:14px;font-weight:500;letter-spacing:.1em;
  overflow:hidden;
  transition:color .4s var(--ease),border-color .4s var(--ease);
}
.btn::before{
  content:"";position:absolute;inset:0;
  background:var(--c-ink);
  transform:scaleX(0);transform-origin:right;
  transition:transform .5s var(--ease);
}
.btn::after{
  content:"";
  width:22px;height:1px;background:currentColor;
  flex:none;position:relative;
  transition:transform .4s var(--ease);
}
.btn span{position:relative}
.btn:hover{color:#fff}
.btn:hover::before{transform:scaleX(1);transform-origin:left}
.btn:hover::after{transform:translateX(6px)}

.btn--fill{background:var(--c-brand);border-color:var(--c-brand);color:#fff}
.btn--fill::before{background:var(--c-brand-d)}
.btn--white{border-color:#fff;color:#fff}
.btn--white::before{background:#fff}
.btn--white:hover{color:var(--c-brand)}

/* ---------- Reveal (scroll animation) ---------- */
.reveal{
  opacity:0;transform:translateY(22px);
  transition:opacity .7s var(--ease) var(--d,0s),transform .7s var(--ease) var(--d,0s);
}
.reveal.is-in{opacity:1;transform:none}
.reveal--img{transform:none;clip-path:inset(0 0 100% 0)}
.reveal--img img{transform:scale(1.06);transition:transform 1.2s var(--ease)}
.reveal--img{transition:clip-path .9s var(--ease) var(--d,0s),opacity .3s}
.reveal--img.is-in{clip-path:inset(0 0 0 0)}
.reveal--img.is-in img{transform:none}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .reveal,.reveal--img{opacity:1;transform:none;clip-path:none;transition:none}
  .reveal--img img{transform:none;transition:none}
  *{animation:none !important;transition-duration:.01ms !important}
}

/* ==========================================================
   HEADER
   ========================================================== */
.site-header{
  position:fixed;inset:0 0 auto;z-index:100;
  background:rgba(255,255,255,.0);
  transition:background .5s var(--ease),box-shadow .5s var(--ease);
}
.site-header::after{
  content:"";position:absolute;left:0;right:0;bottom:0;height:1px;
  background:var(--c-line-2);opacity:0;transition:opacity .5s;
}
.site-header.is-scrolled{background:rgba(255,255,255,.92);backdrop-filter:blur(8px)}
.site-header.is-scrolled::after{opacity:1}
.site-header__inner{
  display:flex;align-items:center;justify-content:space-between;
  height:88px;
  padding-inline:clamp(20px,3vw,44px);
  transition:height .4s var(--ease);
}
.site-header.is-scrolled .site-header__inner{height:72px}
.site-logo img{width:190px;transition:width .4s var(--ease)}
.site-header.is-scrolled .site-logo img{width:164px}

.gnav__list{display:flex;align-items:center;gap:clamp(18px,2.2vw,34px)}
.gnav__list>li{position:relative}
.gnav__list>li>a{
  display:inline-block;padding:8px 0;
  font-size:14px;font-weight:500;letter-spacing:.08em;
  position:relative;
}
.gnav__list>li>a::after{
  content:"";position:absolute;left:0;bottom:2px;width:100%;height:1px;
  background:var(--c-brand);
  transform:scaleX(0);transform-origin:right;
  transition:transform .4s var(--ease);
}
.gnav__list>li:hover>a::after{transform:scaleX(1);transform-origin:left}
.gnav__contact{
  padding:9px 20px !important;
  background:var(--c-brand);color:#fff;
  transition:background .3s;
}
.gnav__contact::after{display:none}
.gnav__contact:hover{background:var(--c-brand-d)}

.gnav__sub{
  position:absolute;top:100%;left:50%;
  min-width:250px;padding:12px 0;
  background:#fff;border:1px solid var(--c-line-2);
  box-shadow:0 14px 30px -14px rgba(40,30,20,.25);
  transform:translate(-50%,8px);
  opacity:0;visibility:hidden;
  transition:opacity .35s var(--ease),transform .35s var(--ease),visibility 0s .35s;
}
.gnav__list>li:hover .gnav__sub,.gnav__list>li:focus-within .gnav__sub{
  opacity:1;visibility:visible;transform:translate(-50%,0);transition-delay:0s;
}
.gnav__sub a{
  display:block;padding:9px 22px;
  font-size:13px;letter-spacing:.06em;color:var(--c-ink-2);
  transition:color .3s,background .3s;
}
.gnav__sub a:hover{color:var(--c-brand);background:var(--c-off)}

.menu-btn{display:none}

@media (max-width:1023px){
  .gnav{display:none}
  .site-header__inner{height:72px}
  .site-header.is-scrolled .site-header__inner{height:64px}
  .site-logo img{width:160px}
  .site-header.is-scrolled .site-logo img{width:148px}
  .menu-btn{
    display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;
    width:56px;height:56px;margin-right:-10px;
    position:relative;z-index:110;
  }
  .menu-btn span{display:block;width:24px;height:1.5px;background:var(--c-ink);transition:transform .4s var(--ease),opacity .3s}
  .menu-btn em{font-family:var(--f-en);font-style:normal;font-size:10px;letter-spacing:.12em;line-height:1;margin-top:2px}
  .menu-btn.is-open span:nth-child(1){transform:translateY(3.5px) rotate(45deg)}
  .menu-btn.is-open span:nth-child(2){transform:translateY(-3px) rotate(-45deg)}
  .site-header.is-menu-open{background:#fff}
}

/* SP menu */
.sp-menu{
  position:fixed;inset:0;z-index:105;
  background:var(--c-cream);
  padding:92px var(--gutter) 40px;
  overflow-y:auto;
  opacity:0;visibility:hidden;transform:translateY(-8px);
  transition:opacity .45s var(--ease),transform .45s var(--ease),visibility 0s .45s;
}
.sp-menu.is-open{opacity:1;visibility:visible;transform:none;transition-delay:0s}
.sp-menu__nav>ul>li{border-bottom:1px solid var(--c-line)}
.sp-menu__nav>ul>li>a,.sp-menu__acc>button{
  display:flex;align-items:center;justify-content:space-between;width:100%;
  padding:18px 4px;
  font-size:16px;font-weight:500;letter-spacing:.08em;text-align:left;
}
.sp-menu__acc>button::after{
  content:"";width:9px;height:9px;
  border-right:1px solid var(--c-ink);border-bottom:1px solid var(--c-ink);
  transform:rotate(45deg);margin-right:6px;
  transition:transform .35s var(--ease);
}
.sp-menu__acc>button[aria-expanded="true"]::after{transform:rotate(-135deg)}
.sp-menu__acc>ul{
  display:grid;grid-template-rows:0fr;
  transition:grid-template-rows .4s var(--ease);
}
.sp-menu__acc>ul>li{overflow:hidden}
.sp-menu__acc.is-open>ul{grid-template-rows:1fr}
.sp-menu__acc>ul>li:first-child{margin-top:-6px}
.sp-menu__acc>ul>li:last-child{padding-bottom:12px}
.sp-menu__acc>ul a{
  display:block;padding:9px 4px 9px 20px;
  font-size:14px;color:var(--c-ink-2);
  position:relative;
}
.sp-menu__acc>ul a::before{
  content:"";position:absolute;left:4px;top:50%;width:8px;height:1px;background:var(--c-brand);
}
.sp-menu__tel{
  display:block;margin-top:36px;padding:18px;text-align:center;
  background:var(--c-brand);color:#fff;
  font-size:24px;font-weight:700;letter-spacing:.04em;line-height:1.2;
}
.sp-menu__tel small{display:block;font-size:12px;font-weight:400;margin-bottom:6px;letter-spacing:.1em}
body.is-locked{overflow:hidden}

/* ==========================================================
   MAIN VISUAL
   ========================================================== */
.mv{
  position:relative;
  padding-top:88px;
  background:var(--c-base);
}
.mv__media{
  position:relative;overflow:hidden;
  animation:mvIn 1.2s var(--ease) both;
}
.mv__img{
  width:100%;aspect-ratio:1920/500;object-fit:cover;object-position:center;
  animation:mvZoom 2.4s var(--ease) both;
}
@keyframes mvIn{from{opacity:0;clip-path:inset(0 0 8% 0)}to{opacity:1;clip-path:inset(0)}}
@keyframes mvZoom{from{transform:scale(1.04)}to{transform:scale(1)}}

.mv__scroll{
  position:absolute;right:clamp(20px,3vw,44px);bottom:-10px;
  display:flex;flex-direction:column;align-items:center;gap:10px;
  font-family:var(--f-en);font-style:italic;font-size:13px;letter-spacing:.14em;color:var(--c-ink-3);
}
.mv__scroll::after{
  content:"";width:1px;height:44px;background:var(--c-ink-3);
  animation:scrollLine 2.2s var(--ease) infinite;
  transform-origin:top;
}
@keyframes scrollLine{0%{transform:scaleY(0);transform-origin:top}45%{transform:scaleY(1);transform-origin:top}55%{transform:scaleY(1);transform-origin:bottom}100%{transform:scaleY(0);transform-origin:bottom}}

@media (max-width:1023px){.mv{padding-top:72px}}
@media (max-width:767px){
  .mv__img{aspect-ratio:750/1335;max-height:min(82vh,640px)}
  .mv__scroll{display:none}
}

/* News bar */
.newsbar{
  border-bottom:1px solid var(--c-line-2);
  background:var(--c-base);
}
.newsbar__inner{
  display:flex;align-items:center;gap:22px;
  padding:16px 0;font-size:14px;
}
.newsbar__label{
  flex:none;
  font-size:12px;font-weight:500;letter-spacing:.12em;color:var(--c-brand);
  padding-right:22px;border-right:1px solid var(--c-line);
}
.newsbar__link{
  position:relative;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
  background:linear-gradient(currentColor,currentColor) no-repeat 0 100%/0 1px;
  transition:background-size .4s var(--ease);
}
.newsbar__link:hover{background-size:100% 1px}
@media (max-width:767px){
  .newsbar__inner{gap:14px;padding:13px 0;font-size:13px}
  .newsbar__label{padding-right:14px}
}

/* ==========================================================
   ABOUT
   ========================================================== */
.about{
  padding:var(--sec-y) 0;
  position:relative;isolation:isolate;
}
.about::before{
  /* 右側に淡いクリームの面を敷き、写真が面を跨ぐ構図に */
  content:"";position:absolute;top:clamp(40px,6vw,96px);right:0;bottom:0;
  width:58%;background:var(--c-cream);z-index:-1;
}
.about__inner{
  display:grid;grid-template-columns:1.05fr .95fr;
  align-items:center;gap:clamp(40px,6vw,96px);
}
.about__photo{overflow:hidden}
.about__photo img{width:100%;aspect-ratio:600/391;object-fit:cover}
.about__text{
  font-size:clamp(15px,1.15vw,16px);line-height:2.2;
  margin-bottom:36px;
  color:var(--c-ink-2);
}
@media (max-width:767px){
  .about::before{top:0;width:100%;left:0}
  .about{padding:var(--sec-y) 0 calc(var(--sec-y) * .9)}
  .about__inner{grid-template-columns:1fr;gap:32px}
  .about__photo{width:calc(100% + var(--gutter));margin-left:calc(var(--gutter) * -1)}
  .about__text{line-height:2;margin-bottom:28px}
}

/* ==========================================================
   SHOP
   ========================================================== */
.shop{padding:var(--sec-y) 0;background:var(--c-base)}
.shop__list{
  display:grid;grid-template-columns:repeat(3,1fr);
  gap:clamp(36px,4vw,56px) clamp(24px,3vw,40px);
}
.shop__item a{display:block}
.shop__photo{
  overflow:hidden;
  aspect-ratio:3/2;
  background:var(--c-off);
}
.shop__photo img{
  width:100%;height:100%;object-fit:cover;
  transition:transform 1s var(--ease);
}
.shop__item a:hover .shop__photo img{transform:scale(1.05)}
.shop__body{padding:18px 0 0;border-top:1px solid var(--c-line);margin-top:16px;position:relative}
.shop__body::before{
  content:"";position:absolute;top:-1px;left:0;height:1px;width:0;
  background:var(--c-brand);transition:width .6s var(--ease);
}
.shop__item a:hover .shop__body::before{width:100%}
.shop__name{
  font-size:clamp(16px,1.25vw,18px);font-weight:700;letter-spacing:.06em;line-height:1.5;
  margin-bottom:8px;
  transition:color .3s;
}
.shop__item a:hover .shop__name{color:var(--c-brand)}
.shop__addr{font-size:13.5px;color:var(--c-ink-2);line-height:1.7}
.shop__tel{
  font-size:13.5px;color:var(--c-ink-2);letter-spacing:.06em;
  font-feature-settings:"tnum";
}
@media (max-width:959px){.shop__list{grid-template-columns:repeat(2,1fr)}}
@media (max-width:767px){
  .shop__list{grid-template-columns:1fr 1fr;gap:34px 16px}
  .shop__body{padding-top:14px;margin-top:12px}
  .shop__name{font-size:15px}
  .shop__addr,.shop__tel{font-size:12px;letter-spacing:.02em}
}

/* ==========================================================
   REASON
   ========================================================== */
.reason{padding:var(--sec-y) 0;background:var(--c-off)}
.reason__list{
  display:grid;grid-template-columns:repeat(3,1fr);
  gap:0;
  border-top:1px solid var(--c-line);
  border-left:1px solid var(--c-line);
}
.reason__item{
  position:relative;
  padding:clamp(32px,3.6vw,52px) clamp(22px,2.6vw,38px) clamp(32px,3.2vw,44px);
  border-right:1px solid var(--c-line);
  border-bottom:1px solid var(--c-line);
  background:var(--c-off);
  transition:background .5s var(--ease);
}
.reason__item:hover{background:#fff}
.reason__num{
  position:absolute;top:18px;left:clamp(22px,2.6vw,38px);
  font-family:var(--f-en);font-weight:600;font-size:15px;letter-spacing:.06em;
  color:var(--c-brand);line-height:1;
}
.reason__icon{
  width:104px;height:104px;margin:14px auto 22px;
  border-radius:50%;overflow:hidden;
  box-shadow:0 0 0 1px var(--c-line),0 0 0 7px var(--c-off);
  outline:1px solid var(--c-line);outline-offset:7px;
  transition:outline-color .4s,box-shadow .4s;
}
.reason__item:hover .reason__icon{box-shadow:0 0 0 1px var(--c-line),0 0 0 7px #fff;outline-color:var(--c-brand)}
.reason__icon img{width:100%;height:100%;object-fit:cover}
.reason__title{
  text-align:center;
  font-size:clamp(17px,1.35vw,19px);font-weight:700;letter-spacing:.08em;
  margin-bottom:12px;
}
.reason__text{
  font-size:14px;line-height:1.95;color:var(--c-ink-2);
  text-align:left;
}
@media (max-width:959px){.reason__list{grid-template-columns:repeat(2,1fr)}}
@media (max-width:767px){
  .reason__list{grid-template-columns:1fr;border-left:0}
  .reason__item{
    display:grid;grid-template-columns:84px 1fr;column-gap:20px;
    padding:26px 4px 26px 0;
    border-right:0;
  }
  .reason__num{position:static;grid-column:2;margin-bottom:6px}
  .reason__icon{grid-row:1/4;width:76px;height:76px;margin:4px 0 0;outline-offset:4px;box-shadow:0 0 0 1px var(--c-line),0 0 0 4px var(--c-off)}
  .reason__title{grid-column:2;text-align:left;font-size:16px;margin-bottom:6px}
  .reason__text{grid-column:2;font-size:13.5px;line-height:1.85}
}

/* ==========================================================
   RECRUIT
   ========================================================== */
.recruit{
  padding:var(--sec-y) 0;
  background:var(--c-base);
  position:relative;isolation:isolate;
}
.recruit::before{
  content:"";position:absolute;left:0;top:clamp(40px,6vw,96px);bottom:0;
  width:62%;background:var(--c-cream);z-index:-1;
}
.recruit__inner{
  display:grid;grid-template-columns:1.05fr .95fr;
  align-items:center;gap:clamp(40px,6vw,96px);
}
.recruit__photo{overflow:hidden}
.recruit__photo img{width:100%;aspect-ratio:3/2;object-fit:cover}
.recruit__body .sec-head__ja{font-size:clamp(28px,3.2vw,40px)}
.recruit__text{
  font-size:clamp(15px,1.15vw,16px);line-height:2.2;color:var(--c-ink-2);
  margin-bottom:36px;
}
@media (max-width:767px){
  .recruit::before{width:100%;top:0}
  .recruit__inner{grid-template-columns:1fr;gap:32px}
  .recruit__photo{width:calc(100% + var(--gutter));margin-right:calc(var(--gutter) * -1)}
  .recruit__text{line-height:2;margin-bottom:28px}
}

/* ==========================================================
   INFORMATION
   ========================================================== */
.info{padding:var(--sec-y) 0}
.info__inner{
  display:grid;grid-template-columns:260px 1fr;gap:clamp(32px,5vw,80px);
  align-items:start;
}
.info__inner .sec-head{margin-bottom:0}
.info__list{border-top:1px solid var(--c-line)}
.info__list li{border-bottom:1px solid var(--c-line)}
.info__list a{
  display:grid;grid-template-columns:110px auto 1fr;align-items:center;gap:22px;
  padding:22px 8px;
  transition:background .4s var(--ease);
}
.info__list a:hover{background:var(--c-off)}
.info__list time{
  font-family:var(--f-en);font-weight:600;font-size:17px;letter-spacing:.06em;
  color:var(--c-ink-2);
}
.info__cat{
  font-size:11px;letter-spacing:.12em;color:var(--c-brand);
  border:1px solid currentColor;padding:3px 12px;line-height:1.5;
}
.info__title{
  font-size:15px;
  background:linear-gradient(var(--c-ink),var(--c-ink)) no-repeat 0 100%/0 1px;
  transition:background-size .5s var(--ease);
  width:fit-content;
}
.info__list a:hover .info__title{background-size:100% 1px}
.info__more{margin-top:32px;text-align:right}
@media (max-width:767px){
  .info__inner{grid-template-columns:1fr;gap:28px}
  .info__list a{grid-template-columns:auto auto;grid-template-rows:auto auto;gap:8px 14px;padding:18px 4px}
  .info__title{grid-column:1/-1;font-size:14px}
  .info__list time{font-size:15px}
  .info__more{text-align:center}
}

/* ==========================================================
   CONTACT
   ========================================================== */
.contact{
  background:var(--c-brand);
  color:#fff;
  padding:clamp(56px,6.5vw,88px) 0;
}
.contact__inner{
  display:grid;grid-template-columns:1fr 1px 1fr;
  align-items:center;gap:clamp(32px,5vw,80px);
}
.contact__col{text-align:center}
.contact__divider{height:120px;background:rgba(255,255,255,.35)}
.contact__label{
  font-size:14px;letter-spacing:.12em;margin-bottom:16px;
  opacity:.9;
}
.contact__tel{
  display:inline-flex;align-items:center;gap:12px;
  font-family:var(--f-en);font-weight:600;
  font-size:clamp(34px,3.4vw,46px);letter-spacing:.04em;line-height:1;
  font-feature-settings:"tnum";
  transition:opacity .3s;
}
.contact__tel:hover{opacity:.8}
.contact__tel svg{flex:none;margin-top:2px}
.contact__note{font-size:12px;letter-spacing:.12em;margin-top:14px;opacity:.85}
.contact .btn--white{min-width:300px}
@media (max-width:767px){
  .contact__inner{grid-template-columns:1fr;gap:36px}
  .contact__divider{height:1px;width:60px;margin-inline:auto}
  .contact__tel{font-size:36px}
  .contact .btn--white{min-width:0;width:100%}
}

/* ==========================================================
   FOOTER
   ========================================================== */
.site-footer{
  background:var(--c-cream);
  border-top:1px solid var(--c-line-2);
  font-size:13.5px;
}
.site-footer__inner{
  display:grid;grid-template-columns:1.4fr .8fr 1fr;
  gap:clamp(32px,5vw,80px);
  padding:clamp(56px,6vw,80px) 0 clamp(40px,5vw,64px);
}
.site-footer__brand img{width:200px;margin-bottom:24px}
.site-footer address{line-height:1.9;color:var(--c-ink-2)}
.site-footer__desc{margin-top:18px;line-height:1.8;color:var(--c-ink-3);font-size:12.5px}
.site-footer__nav ul{display:grid;grid-template-columns:1fr 1fr;gap:12px 24px}
.site-footer__nav a,.site-footer__shops a{
  display:inline-block;
  background:linear-gradient(currentColor,currentColor) no-repeat 0 100%/0 1px;
  transition:background-size .4s var(--ease),color .3s;
}
.site-footer__nav a:hover,.site-footer__shops a:hover{background-size:100% 1px;color:var(--c-brand)}
.site-footer__shops h3{
  font-size:14px;font-weight:700;letter-spacing:.1em;margin-bottom:16px;
  padding-bottom:10px;border-bottom:1px solid var(--c-line);
}
.site-footer__shops li{margin-bottom:10px;padding-left:14px;position:relative}
.site-footer__shops li::before{
  content:"";position:absolute;left:0;top:.9em;width:6px;height:1px;background:var(--c-brand);
}
.site-footer__bottom{border-top:1px solid var(--c-line)}
.site-footer__bottom-inner{
  display:flex;justify-content:space-between;align-items:center;
  padding:20px 0;font-size:12px;color:var(--c-ink-3);letter-spacing:.06em;
}
.site-footer__bottom a{transition:color .3s}
.site-footer__bottom a:hover{color:var(--c-brand)}
@media (max-width:767px){
  .site-footer__inner{grid-template-columns:1fr;gap:36px;padding:48px 0 40px}
  .site-footer__brand img{width:180px;margin-bottom:18px}
  .site-footer__bottom-inner{flex-direction:column;gap:12px;text-align:center}
}

/* ---------- Page top ---------- */
.pagetop{
  position:fixed;right:20px;bottom:20px;z-index:90;
  width:48px;height:48px;
  display:flex;align-items:center;justify-content:center;
  background:#fff;border:1px solid var(--c-line);color:var(--c-ink);
  opacity:0;visibility:hidden;transform:translateY(10px);
  transition:opacity .4s var(--ease),transform .4s var(--ease),visibility 0s .4s,background .3s,color .3s;
}
.pagetop.is-show{opacity:1;visibility:visible;transform:none;transition-delay:0s}
.pagetop:hover{background:var(--c-ink);color:#fff}
