#paneco-shared-header{top:0;left:0;color:#000;font-family:"Roboto Condensed",sans-serif;font-size:16px;font-weight:400;letter-spacing:0;line-height:1.5}#paneco-shared-header *,#paneco-shared-header *:before,#paneco-shared-header *:after{box-sizing:border-box}#paneco-shared-header ul,#paneco-shared-header li{padding:0;list-style:none}#paneco-shared-header a{text-decoration:none;color:inherit;font-weight:400}#paneco-shared-header img{display:block;width:100%;height:auto}#paneco-shared-header .header__inner{height:auto;gap:0;padding:0}#paneco-shared-header .logo{margin:0;flex-shrink:0}#paneco-shared-header button{font:inherit;appearance:none;border:0;background:transparent;border-radius:0}#paneco-shared-header button:focus-visible,#paneco-shared-header a:focus-visible{outline:2px solid #60b7ac;outline-offset:4px}
#paneco-shared-header{
  position: fixed;
  width: 100%;
  background: #fff;
  z-index: 99;
  transition: 0.3s linear;
  height: 64px;
}
@media  only screen and (min-width: 960px) {#paneco-shared-header{
    height: 150px;
    padding: 0 55px;
    display: flex;
  }}
#paneco-shared-header .header__inner{
  display: flex;
  justify-content: space-between;
}
@media  only screen and (min-width: 960px) {#paneco-shared-header .header__inner{
    width: 100%;
    max-width: 1200px;
    margin: auto;
    align-items: center;
  }}
@media  only screen and (min-width: 960px) {#paneco-shared-header.low{
    height: 70px;
  }}
#paneco-shared-header .logo{
  position: relative;
  z-index: 100;
  width: 175px;
}
#paneco-shared-header .logo__link{
  padding: 20px;
  display: block;
}
#paneco-shared-header .logo__link.inactive{
  pointer-events: none;
}
@media  only screen and (min-width: 960px) {#paneco-shared-header .logo__link{
    padding: 0;
  }}
@media  only screen and (min-width: 560px) {#paneco-shared-header .logo{
    width: 200px;
  }}
#paneco-shared-header .gnavi{
  font-family: "Roboto Condensed", "NNotoSansCJKjp", sans-serif;
}
@media  only screen and (min-width: 960px) {#paneco-shared-header .gnavi{
    width: 100%;
  }}
#paneco-shared-header .gnavi__content{
  position: fixed;
  top: 0;
  left: 0;
  z-index: 99;
  
  width: 100%;
  
  padding: 0 0 90px 0;
  height: 100%;
  transition: 0.3s ease-in-out;
  
  -webkit-overflow-scrolling: touch;
  background: #fff;
  text-align: center;
  opacity: 0;
  pointer-events: none;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
@media  only screen and (min-width: 960px) {#paneco-shared-header .gnavi__content{
    position: static;
    opacity: 1;
    padding: 0;
    display: flex;
    margin: auto;
    justify-content: flex-end;
    pointer-events: auto;
    flex-direction: row;
  }}
#paneco-shared-header .gnavi__list{
  margin: 0 0 20px;
}
@media  only screen and (min-width: 960px) {#paneco-shared-header .gnavi__list{
    display: flex;
    justify-content: center;
    margin: 0;
    width: calc(100% - 223px);
  }}
@media  only screen and (min-width: 960px) {#paneco-shared-header .gnavi__item{
    margin: 0 8px;
  }}
@media  only screen and (min-width: 1200px) {#paneco-shared-header .gnavi__item{
    margin: 0 13px;
  }}
#paneco-shared-header .gnavi__item__link{
  display: block;
  font-size: 16px;
  line-height: 55px;
  height: 55px;
  position: relative;
}
@media  only screen and (min-width: 960px) {#paneco-shared-header .gnavi__item__link{
    font-size: 14px;
    height: 40px;
    line-height: 40px;
  }}
@media  only screen and (min-width: 1200px) {#paneco-shared-header .gnavi__item__link{
    font-size: 16px;
  }}
#paneco-shared-header .gnavi__item__link.selected span{
  position: relative;
}
#paneco-shared-header .gnavi__item__link.selected span::after{
  content: "";
  display: block;
  width: 100%;
  height: 1px;
  background: #000;
  position: absolute;
  left: 0;
  bottom: -5px;
}
#paneco-shared-header .gnavi__contact{
  display: block;
  width: 100%;
  background: #000;
  color: #fff;
  line-height: 65px;
  height: 65px;
  border: 1px solid #000;
  position: absolute;
  left: 0;
  bottom: 0;
}
@media  only screen and (min-width: 960px) {#paneco-shared-header .gnavi__contact{
    position: static;
    height: 40px;
    line-height: 40px;
    width: 100px;
    transition: all 0.3s ease-in-out;
  }
#paneco-shared-header .gnavi__contact:hover{
    color: #000;
    background: #fff;
  }}
#paneco-shared-header .gnavi__pdf{
  display: block;
  width: 100%;
  background: #666;
  color: #fff;
  position: absolute;
  left: 0;
  bottom: 65px;
  padding: 25px 0;
}
@media  only screen and (min-width: 960px) {#paneco-shared-header .gnavi__pdf{
    position: relative;
    bottom: auto;
    height: 40px;
    line-height: 40px;
    width: 100px;
    margin: 0 0 0 20px;
    padding: 0;
  }}
#paneco-shared-header .gnavi__pdf:hover .gnavi__pdf__links{
  height: 80px;
}
#paneco-shared-header .gnavi__pdf__button{
  color: #fff;
}
@media  only screen and (min-width: 960px) {#paneco-shared-header .gnavi__pdf__button{
    display: block;
    transition: all 0.3s ease-in-out;
    height: 40px;
    line-height: 40px;
    cursor: pointer;
  }}
#paneco-shared-header .gnavi__pdf__links{
  display: flex;
  align-items: center;
  justify-content: center;
}
@media  only screen and (min-width: 960px) {#paneco-shared-header .gnavi__pdf__links{
    background: #666;
    position: absolute;
    left: 0;
    top: 40px;
    width: 100%;
    flex-direction: column;
    transition: all 0.3s ease-in-out;
    height: 0;
    overflow: hidden;
  }}
#paneco-shared-header .gnavi__pdf__link{
  color: #fff;
}
@media  only screen and (min-width: 960px) {#paneco-shared-header .gnavi__pdf__link{
    transition: all 0.3s ease-in-out;
    display: block;
    height: 40px;
    line-height: 40px;
    width: 100%;
  }
#paneco-shared-header .gnavi__pdf__link:hover{
    background: #333;
  }}
#paneco-shared-header .gnavi__pdf__item{
  width: 100%;
}
@media  only screen and (min-width: 960px) {#paneco-shared-header .gnavi__pdf__slash{
    display: none;
  }}
#paneco-shared-header .gnavi__unshown{
  display: none;
}
#paneco-shared-header .gnavi__open{
  display: inline-block;
  width: 60px;
  height: 60px;
  vertical-align: middle;
  padding: 20px 0 0 20px;
  position: relative;
  z-index: 10000;
  cursor: pointer;
}
#paneco-shared-header .gnavi__open span{
  position: absolute;
  height: 2px;
  
  width: 25px;
  
  border-radius: 3px;
  background: #000;
  display: block;
  content: "";
  cursor: pointer;
  transition: all 0.4s;
}
#paneco-shared-header .gnavi__open span:nth-of-type(1){
  top: 20px;
}
#paneco-shared-header .gnavi__open span:nth-of-type(2){
  top: 30px;
}
#paneco-shared-header .gnavi__open span:nth-of-type(3){
  top: 40px;
}
@media  only screen and (min-width: 960px) {#paneco-shared-header .gnavi__open{
    display: none;
  }}
#paneco-shared-header .gnavi__close{
  background: #fff;
  opacity: 0;
  pointer-events: none;
  position: fixed;
  width: 100%;
  height: 100%;
  z-index: 99;
  top: 0;
  left: 0;
  transition: opacity 0.3s ease-in-out;
}
#paneco-shared-header .gnavi__input:checked ~ .gnavi__open span:nth-of-type(1){
  transform: translateY(10px) rotate(-45deg);
}
#paneco-shared-header .gnavi__input:checked ~ .gnavi__open span:nth-of-type(2){
  opacity: 0;
}
#paneco-shared-header .gnavi__input:checked ~ .gnavi__open span:nth-of-type(3){
  transform: translateY(-10px) rotate(45deg);
}
#paneco-shared-header .gnavi__input:checked ~ .gnavi__close{
  opacity: 0.8;
  left: 0;
  pointer-events: auto;
}
@media  only screen and (min-width: 960px) {#paneco-shared-header .gnavi__input:checked ~ .gnavi__close{
    display: none;
  }}
#paneco-shared-header .gnavi__input:checked ~ .gnavi__content{
  opacity: 1;
  pointer-events: auto;
}
#paneco-shared-header .gnavi__lang{
  display: flex;
  justify-content: center;
  flex-direction: row-reverse;
}
@media  only screen and (min-width: 960px) {#paneco-shared-header .gnavi__lang{
    margin: 0;
    align-items: center;
  }}
#paneco-shared-header .gnavi__lang li{
  border: 1px solid #000;
  border-right: 0;
  position: relative;
}
#paneco-shared-header .gnavi__lang li a{
  display: block;
  width: 10.4vw;
  text-align: center;
  line-height: 10.4vw;
  transition: all 0.4s;
}
@media  only screen and (min-width: 960px) {#paneco-shared-header .gnavi__lang li a{
    width: 40px;
    line-height: 38px;
  }}
@media  only screen and (min-width: 960px) {#paneco-shared-header .gnavi__lang li a:hover{
    background: #000;
    color: #fff;
  }}
#paneco-shared-header .gnavi__lang li a[data-stt-active]{
  pointer-events: none;
}
#paneco-shared-header .gnavi__lang li a[data-stt-active]::after{
  content: "";
  display: block;
  width: 15px;
  height: 1px;
  background: #000;
  position: absolute;
  bottom: 8px;
  left: 50%;
  margin-left: -8px;
}
#paneco-shared-header .gnavi__lang li:first-child{
  border-right: 1px solid #000;
}
#paneco-shared-header .gnavi__lang li.current-lang a{
  pointer-events: none;
}
#paneco-shared-header .gnavi__lang li.current-lang::after{
  content: "";
  display: block;
  width: 15px;
  height: 1px;
  background: #000;
  position: absolute;
  bottom: 8px;
  left: 50%;
  margin-left: -8px;
}
#paneco-shared-header .gnavi__contact{color:#fff}#paneco-shared-header .gnavi__contact:hover{color:#000}.admin-bar #paneco-shared-header{top:32px}@media(max-width:782px){.admin-bar #paneco-shared-header{top:46px}}
@font-face{font-family:"Roboto Condensed";font-style:normal;font-weight:400;font-display:swap;src:url("https://paneco.tokyo/wp-content/themes/paneco/assets/font/roboto-condensed-v18-latin-regular.woff2") format("woff2")}
#paneco-shared-header{z-index:200}

html{scroll-behavior:smooth;scroll-padding-top:90px}
.project-subnav{position:relative;margin-top:150px;background:#fff;border-top:1px solid #eeeeea;border-bottom:1px solid #e3e6e2;z-index:2}
.project-subnav__inner{max-width:1200px;margin:auto;display:flex;align-items:center;justify-content:flex-end;gap:38px;height:48px;padding:0 2px}
.project-subnav a{font-size:12px;letter-spacing:.045em;color:#444e49;text-decoration:none;white-space:nowrap;transition:color .2s}
.project-subnav a:hover{color:#338477}
.project-subnav .project-subnav__cta{color:#287c70;font-weight:700;display:flex;align-items:center;gap:24px;border-left:1px solid #dde3df;padding-left:30px}
body .hero{min-height:calc(100svh - 198px);padding-top:0}
body .hero__grid{padding-top:40px;align-items:start}
body .hero__head{padding-top:0;align-self:start}
body .hero__visual{padding-top:0;padding-bottom:0}
@media(min-width:960px) and (max-width:1320px){.project-subnav__inner{padding-inline:55px}}
@media(max-width:959px){.project-subnav{margin-top:64px;overflow-x:auto}.project-subnav__inner{justify-content:flex-start;gap:22px;padding-inline:20px;height:46px;width:max-content;min-width:100%}.project-subnav a{font-size:11px}.project-subnav .project-subnav__cta{padding-left:20px;gap:12px}body .hero{min-height:0;padding-top:0}body .hero__grid{padding-top:30px}html{scroll-padding-top:80px}}
/* Material progression: textiles above board and finished product. */
body .hero__visual{grid-template-columns:1fr 1fr;grid-template-rows:auto auto;align-self:start;gap:14px}
body .hero__visual .v-shot--main{grid-column:1 / -1;grid-row:1;aspect-ratio:4 / 3}
body .hero__visual .v-shot--a{grid-column:1;grid-row:2;aspect-ratio:1 / 1;margin:0}
body .hero__visual .v-shot--b{grid-column:2;grid-row:2;aspect-ratio:1 / 1;margin:0}
body .hero__visual .v-shot--main img{object-fit:cover;object-position:center 43%}
body .hero__visual .v-shot--b img{object-fit:contain;background:#f5f5f3}

body.admin-bar .project-subnav{margin-top:150px}@media(max-width:959px){body.admin-bar .project-subnav{margin-top:64px}}

/* Keep page navigation immediately beneath the shared header. */
:root{--paneco-header-bottom:150px;--paneco-anchor-offset:218px}
.project-subnav{position:sticky;top:var(--paneco-header-bottom);z-index:190}
html{scroll-padding-top:var(--paneco-anchor-offset)}
@media(max-width:959px){:root{--paneco-header-bottom:64px;--paneco-anchor-offset:132px}}
