/*
Theme Name: Twenty Twenty-one Child
Version: 1.6
Template: twentytwentyone
*/
:root {
  --viewport-width: min(100vw, 2000px);
  --b: calc(var(--viewport-width) / 160);
}

#staff #intro {
  background: #fff;
}
#staff #intro .intro__wrapper {
  position: relative;
  display: flex;
  justify-content: space-between;
  gap: max(17rem, 50px);
  padding-top: max(21rem, 100px);
  padding-bottom: max(26rem, 120px);
}
@media screen and (max-width: 768px) {
  #staff #intro .intro__wrapper {
    flex-direction: column;
  }
}
#staff #intro .intro__wrapper aside.sidebar {
  position: -webkit-sticky;
  position: sticky;
  flex-shrink: 0;
  top: max(9rem, 90px);
  width: max(17.5rem, 125px);
  height: -webkit-fit-content;
  height: -moz-fit-content;
  height: fit-content;
}
@media screen and (max-width: 768px) {
  #staff #intro .intro__wrapper aside.sidebar {
    position: relative;
    top: 0;
    width: 50%;
  }
}
#staff #intro .intro__wrapper aside.sidebar ul.sidebar__list {
  display: grid;
  -moz-column-gap: max(3.5rem, 30px);
       column-gap: max(3.5rem, 30px);
}
#staff #intro .intro__wrapper aside.sidebar ul.sidebar__list li.sidebar__item .sidebar__btn {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
#staff #intro .intro__wrapper aside.sidebar ul.sidebar__list li.sidebar__item .sidebar__btn--text {
  font-size: max(1.6rem, 14px);
  font-weight: 400;
  line-height: 1;
  letter-spacing: 0.15em;
}
#staff #intro .intro__wrapper .intro__main {
  flex: 1;
}
#staff #intro .intro__wrapper .intro__main p.intro__first {
  margin-bottom: max(7.5rem, 30px);
}
#staff #intro .intro__wrapper .intro__main .intro__content:not(:first-of-type) {
  margin-top: max(15.5rem, 70px);
}
#staff #intro .intro__wrapper .intro__main .intro__content .intro__list .intro__item {
  display: flex;
  gap: max(5rem, 20px);
}
@media screen and (max-width: 1000px) {
  #staff #intro .intro__wrapper .intro__main .intro__content .intro__list .intro__item {
    flex-direction: column;
  }
}
#staff #intro .intro__wrapper .intro__main .intro__content .intro__list .intro__item:not(:first-of-type) {
  margin-top: max(4rem, 40px);
}
#staff #intro .intro__wrapper .intro__main .intro__content .intro__list .intro__item .imageBox {
  width: max(25.5rem, 200px);
  aspect-ratio: 1/1;
}
#staff #intro .intro__wrapper .intro__main .intro__content .intro__list .intro__item .imageBox img {
  width: 100%;
  height: 100%;
}
#staff #intro .intro__wrapper .intro__main .intro__content .intro__list .intro__item .textBox {
  flex: 1;
}
#staff #intro .intro__wrapper .intro__main .intro__content .intro__list .intro__item .textBox .intro__personal--position {
  font-size: max(1.6rem, 14px);
  font-weight: 400;
  line-height: 2;
  letter-spacing: 0.1em;
}
#staff #intro .intro__wrapper .intro__main .intro__content .intro__list .intro__item .textBox .intro__personal--name {
  font-family: YakuHanJP, "Jost", "Noto Sans JP", sans-serif;
  font-size: max(3.3rem, 28px);
  font-weight: 400;
  line-height: 1;
  letter-spacing: 0.15em;
  margin-top: max(0.5rem, 5px);
  margin-bottom: max(2.5rem, 15px);
}/*# sourceMappingURL=staff.css.map */