/* ==========================================================================
   Renewal shared footer — final responsive owner
   2026-08-18

   Loaded after common.css -> page CSS -> renewal-shared.css.
   This makes the footer identical across Top / About / Service / Contact /
   archive pages and prevents intermediate-width disappearance.
   ========================================================================== */

.p-renewal-footer{
  background:#3b4b50;
  color:#fff;
  padding:40px 0 26px;
  text-align:left;
}
.p-renewal-footer > .l-content-inner{
  width:min(1180px,calc(100% - 64px));
  max-width:none;
  margin:0 auto;
  padding:0;
}
.p-renewal-footer .p-renewal-footer__brand{
  flex:none;
  display:flex;
  flex-direction:column;
  align-items:center;
  min-width:0;
}
.p-renewal-footer .p-renewal-footer__brand .logo{
  width:240px;
  max-width:100%;
  margin:0;
}
.p-renewal-footer .p-renewal-footer__brand .logo a,
.p-renewal-footer .p-renewal-footer__brand .logo img{
  display:block;
  width:100%;
}
.p-renewal-footer .p-renewal-footer__tagline{
  width:100%;
  margin:6px 0 0;
  color:rgba(255,255,255,.92);
  font-size:11.5px;
  line-height:1.6;
  font-weight:600;
  letter-spacing:.02em;
  text-align:center;
}
.p-renewal-footer a{color:#fff}

/* Desktop */
.p-renewal-footer .p-renewal-footer__top{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:38px;
}
.p-renewal-footer .p-renewal-footer__main-nav{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  flex-wrap:wrap;
  gap:14px 30px;
  margin:0 0 1px auto;
  padding:0;
}
.p-renewal-footer .p-renewal-footer__main-nav .item{
  margin:0;
  font-size:12.5px;
  line-height:1.6;
  font-weight:700;
  letter-spacing:.02em;
  white-space:nowrap;
}
.p-renewal-footer .p-renewal-footer__btm{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:28px;
  margin-top:31px;
  padding-top:17px;
  border-top:1px solid rgba(255,255,255,.23);
}
.p-renewal-footer .p-renewal-footer__sub-nav{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:12px 30px;
  margin:0;
  padding:0;
}
.p-renewal-footer .p-renewal-footer__sub-nav .item{
  margin:0;
  font-size:12px;
  line-height:1.6;
  font-weight:650;
  letter-spacing:.02em;
  white-space:nowrap;
}
.p-renewal-footer .cpy{
  flex:none;
  margin:0 0 0 auto;
  color:#d8e0e6;
  font-size:12px;
  line-height:1.6;
  font-weight:650;
  letter-spacing:.01em;
  white-space:nowrap;
}

/* Tablet */
@media screen and (max-width:1100px) and (min-width:681px){
  .p-renewal-footer{padding:40px 0 25px}
  .p-renewal-footer > .l-content-inner{width:calc(100% - 42px)}
  .p-renewal-footer .p-renewal-footer__top{
    flex-direction:column;
    align-items:center;
    gap:23px;
  }
  .p-renewal-footer .p-renewal-footer__brand{
    width:100%;
    align-items:center;
    text-align:center;
  }
  .p-renewal-footer .p-renewal-footer__tagline{text-align:center}
  .p-renewal-footer .p-renewal-footer__main-nav{
    display:flex;
    justify-content:center;
    width:100%;
    margin:0;
    gap:11px 27px;
    text-align:center;
  }
  .p-renewal-footer .p-renewal-footer__main-nav .item{text-align:center}
  .p-renewal-footer .p-renewal-footer__btm{
    flex-direction:column;
    align-items:center;
    gap:13px;
    width:100%;
    margin-top:25px;
    padding-top:17px;
  }
  .p-renewal-footer .p-renewal-footer__sub-nav{
    display:flex;
    justify-content:center;
    width:100%;
    gap:10px 26px;
    text-align:center;
  }
  .p-renewal-footer .p-renewal-footer__sub-nav .item{text-align:center}
  .p-renewal-footer .cpy{
    margin:0;
    text-align:center;
  }
}

/* Smartphone — visual-center layout v7
   The upper navigation group and lower utility group each shrink-wrap to
   their own contents and are centered as independent visual blocks.
   Odd items remain in the left column.
*/
@media screen and (max-width:680px){
  .p-renewal-footer{
    padding:36px 0 23px;
  }

  .p-renewal-footer > .l-content-inner{
    width:calc(100% - 32px);
    padding:0;
  }

  .p-renewal-footer .p-renewal-footer__top{
    display:flex;
    flex-direction:column;
    align-items:center;
    gap:22px;
  }

  .p-renewal-footer .p-renewal-footer__brand{
    width:100%;
    align-items:center;
    text-align:center;
  }

  .p-renewal-footer .p-renewal-footer__brand .logo{
    width:220px;
    margin:0 auto;
  }

  .p-renewal-footer .p-renewal-footer__tagline{
    margin-top:5px;
    font-size:11px;
    text-align:center;
  }

  /* Upper group:
     shrink-wrap the two columns themselves, then center that whole group.
     The 5th item naturally stays in the left column.
  */
  .p-renewal-footer .p-renewal-footer__main-nav{
    display:grid;
    grid-template-columns:max-content max-content;
    width:max-content;
    max-width:100%;
    margin:0 auto;
    padding:0;
    column-gap:30px;
    row-gap:13px;
    justify-content:center;
    align-items:start;
  }

  .p-renewal-footer .p-renewal-footer__main-nav .item{
    margin:0;
    font-size:12.5px;
    line-height:1.55;
    white-space:nowrap;
    text-align:left;
  }

  .p-renewal-footer .p-renewal-footer__main-nav .item:last-child:nth-child(odd){
    grid-column:auto;
    justify-self:start;
  }

  .p-renewal-footer .p-renewal-footer__main-nav .item__inn{
    display:block;
    text-align:left;
  }

  .p-renewal-footer .p-renewal-footer__btm{
    display:flex;
    flex-direction:column;
    align-items:center;
    gap:14px;
    width:100%;
    margin-top:23px;
    padding-top:18px;
    border-top:1px solid rgba(255,255,255,.23);
  }

  /* Lower group:
     first item spans both columns and is centered,
     the two lower items define their own shrink-wrapped two-column row.
  */
  .p-renewal-footer .p-renewal-footer__sub-nav{
    display:grid;
    grid-template-columns:max-content max-content;
    width:max-content;
    max-width:100%;
    margin:0 auto;
    padding:0;
    column-gap:28px;
    row-gap:12px;
    justify-content:center;
    align-items:start;
  }

  .p-renewal-footer .p-renewal-footer__sub-nav .item{
    margin:0;
    font-size:12px;
    line-height:1.55;
    white-space:nowrap;
    text-align:left;
  }

  .p-renewal-footer .p-renewal-footer__sub-nav .item:first-child{
    grid-column:1 / -1;
    justify-self:center;
    text-align:center;
  }

  .p-renewal-footer .p-renewal-footer__sub-nav .item__inn{
    display:block;
    text-align:left;
  }

  .p-renewal-footer .p-renewal-footer__sub-nav .item:first-child .item__inn{
    text-align:center;
  }

  .p-renewal-footer .cpy{
    margin:0 auto;
    font-size:11.5px;
    line-height:1.6;
    white-space:normal;
    text-align:center;
  }
}

/* Very narrow phones: keep the same structure, only reduce spacing/type.
   Do not switch to a different layout.
*/
@media screen and (max-width:360px){
  .p-renewal-footer > .l-content-inner{
    width:calc(100% - 24px);
  }

  .p-renewal-footer .p-renewal-footer__main-nav{
    column-gap:20px;
  }

  .p-renewal-footer .p-renewal-footer__sub-nav{
    column-gap:18px;
  }

  .p-renewal-footer .p-renewal-footer__main-nav .item{
    font-size:12px;
  }

  .p-renewal-footer .p-renewal-footer__sub-nav .item{
    font-size:11.5px;
  }
}