@charset "UTF-8";
/* ---------------------------------------*/
/* keyvisual */
/* ---------------------------------------*/
#keyvisual {
  aspect-ratio: 1920/1200;
  background: url(../img/keyvisual_bg.webp) no-repeat center/cover;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
@media screen and (max-width: 768px) {
  #keyvisual {
    aspect-ratio: 390/670;
    background: url(../img/keyvisual_bg-sp.webp) no-repeat center/cover;
  }
}

.keyvisual-logo {
  width: 27.3%;
}
@media screen and (max-width: 768px) {
  .keyvisual-logo {
    width: 53.8%;
  }
}

/* ---------------------------------------*/
/* concept */
/* ---------------------------------------*/
#concept {
  padding: 4.68vw 0;
  background: #231914;
  color: #fff;
}
@media screen and (max-width: 768px) {
  #concept {
    padding: 14vw 0;
  }
}

.concept-content {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}
@media screen and (max-width: 768px) {
  .concept-content {
    display: block;
  }
}

.concept-content__text {
  width: 50%;
}
@media screen and (max-width: 768px) {
  .concept-content__text {
    width: 100%;
    margin: 0 0 11.5vw;
  }
}

.concept-section-heading {
  width: 27.2%;
  margin: 0 0 4.8vw;
}
@media screen and (max-width: 768px) {
  .concept-section-heading {
    width: 33.9%;
    margin: 0 0 7.69vw;
  }
}

.concept-subtitle {
  font-weight: 600;
  font-size: 4.4271vw;
  text-align: left;
  line-height: 1.4;
  letter-spacing: 0.05em;
  margin: 0 0 3.6vw;
}
@media screen and (max-width: 768px) {
  .concept-subtitle {
    font-size: 8.9744vw;
    margin: 0 0 7.6vw;
  }
}

.concept-desc {
  font-size: 1.3021vw;
  text-align: justify;
  line-height: 2.2;
  margin: 0 0 2em;
}
.concept-desc:last-of-type {
  margin: 0;
}
@media screen and (max-width: 768px) {
  .concept-desc {
    font-size: 3.5897vw;
  }
}

.concept-content__image {
  width: 55%;
}
@media screen and (max-width: 768px) {
  .concept-content__image {
    width: calc(100% + 15.2vw);
    margin: 0 0 0 -7.6vw;
  }
}

/* ---------------------------------------*/
/* products */
/* ---------------------------------------*/
#products {
  padding: 6.25vw 0 14vw;
  background: #d7dcd8;
}
@media screen and (max-width: 768px) {
  #products {
    padding: 12.8vw 0 25.6vw;
  }
}

.products-section-heading {
  width: 17.6%;
  margin: 0 0 6.25vw;
}
@media screen and (max-width: 768px) {
  .products-section-heading {
    width: 38.4vw;
    margin: 0 0 7.69vw;
  }
}

.products-list {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  position: relative;
}
.products-list::after {
  display: block;
  content: "";
  width: 1px;
  height: 100%;
  background: #231815;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  margin: auto;
}
@media screen and (max-width: 768px) {
  .products-list {
    display: block;
  }
  .products-list::after {
    display: none;
  }
}

.products-list__item {
  width: 46%;
  position: relative;
}
.products-list__item:first-child .products-list-lead__logo img {
  width: 88.4%;
  mix-blend-mode: multiply;
}
.products-list__item:nth-child(2) .products-list-lead__logo img {
  width: 55%;
}
@media screen and (max-width: 768px) {
  .products-list__item {
    width: 100%;
    margin: 0 0 12.8vw;
  }
  .products-list__item:first-child::after {
    display: block;
    content: "";
    width: 100%;
    height: 1px;
    background: #231815;
    position: absolute;
    bottom: -6.4vw;
  }
  .products-list__item:last-child {
    margin: 0;
  }
}

.products-list-lead {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  margin: 0 0 28.6vw;
}
@media screen and (max-width: 768px) {
  .products-list-lead {
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    margin: 0 0 5.12vw;
  }
}

.products-list-lead__logo {
  width: 44%;
  padding-top: 0.8em;
}
@media screen and (max-width: 768px) {
  .products-list-lead__logo {
    padding-top: 0;
  }
}

.products-list-lead__text {
  width: 56%;
}
.products-list-lead__text p {
  font-size: 1.0938vw;
  line-height: 1.9;
  text-align: justify;
  color: #231815;
  letter-spacing: -0.05em;
}
@media screen and (max-width: 768px) {
  .products-list-lead__text p {
    font-size: 2.3077vw;
  }
}

.products-list-image {
  width: 100%;
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
}
@media screen and (max-width: 768px) {
  .products-list-image {
    position: relative;
  }
}

/* ---------------------------------------*/
/* stores */
/* ---------------------------------------*/
#stores {
  padding: 0 0 6vw;
  background: #d7dcd8;
}
@media screen and (max-width: 768px) {
  #stores {
    padding: 0 0 15.3vw;
  }
}

.stores-content {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}
@media screen and (max-width: 768px) {
  .stores-content {
    display: block;
  }
}

.stores-content__text {
  width: 40%;
  padding: 1.3vw 0 0;
}
@media screen and (max-width: 768px) {
  .stores-content__text {
    width: 100%;
    padding: 0 0 7.6vw;
  }
}

.stores-section-heading {
  width: 31.7%;
  margin: 0 0 4.6vw;
}
@media screen and (max-width: 768px) {
  .stores-section-heading {
    width: 30%;
  }
}

.stores-subtitle {
  font-weight: 700;
  font-size: 4.4271vw;
  text-align: left;
  line-height: 1.4;
  letter-spacing: 0.05em;
  margin: 0 0 3.6vw;
}
@media screen and (max-width: 768px) {
  .stores-subtitle {
    font-size: 8.9744vw;
    margin: 0 0 7.6vw;
  }
}

.stores-desc {
  font-size: 1.3021vw;
  text-align: justify;
  line-height: 2.2;
  margin: 0 0 2em;
}
.stores-desc:last-of-type {
  margin: 0;
}
@media screen and (max-width: 768px) {
  .stores-desc {
    font-size: 3.5897vw;
    letter-spacing: -0.02em;
  }
}

.stores-history {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  margin: 4vw 0 0;
}
@media screen and (max-width: 768px) {
  .stores-history {
    margin: 10.2vw 0 0;
  }
}

.stores-history__image {
  width: 49.4%;
}
@media screen and (max-width: 768px) {
  .stores-history__image {
    width: 51.5%;
  }
}

.stores-history__text {
  width: 41.1%;
  border-top: solid 1px;
  border-bottom: solid 1px;
  padding: 0.8vw 0 0;
}
@media screen and (max-width: 768px) {
  .stores-history__text {
    width: 43.3%;
    padding: 1.2vw 0 0;
  }
}

.stores-history-heading {
  font-size: 1.7708vw;
  font-weight: 700;
  letter-spacing: 0.2em;
  margin: 0 0 2vw;
  position: relative;
}
.stores-history-heading::after {
  display: block;
  content: "";
  width: 0.5em;
  height: 1px;
  background: #000;
  position: absolute;
  bottom: -0.5em;
  left: 0;
  right: 0;
  margin: auto;
}
@media screen and (max-width: 768px) {
  .stores-history-heading {
    font-size: 4.359vw;
    margin: 0 0 3.4vw;
  }
  .stores-history-heading::after {
    bottom: -0.3em;
  }
}

.stores-history-desc {
  font-size: 0.8333vw;
  text-align: justify;
  line-height: 1.87;
  letter-spacing: 0.01em;
  margin: 0 0 1em;
}
@media screen and (max-width: 768px) {
  .stores-history-desc {
    font-size: 2.3077vw;
    letter-spacing: -0.08em;
  }
}

.stores-content__image {
  width: 55%;
}
@media screen and (max-width: 768px) {
  .stores-content__image {
    width: calc(100% + 15.2vw);
    margin: 0 0 0 -7.6vw;
  }
}

/* ---------------------------------------*/
/* map */
/* ---------------------------------------*/
#map {
  padding: 0 0 5.2vw;
  background: #d7dcd8;
}
@media screen and (max-width: 768px) {
  #map {
    padding: 0 0 12.8vw;
  }
}

.map-section-heading {
  width: 6.19%;
  margin: 0 0 2.6vw;
}
@media screen and (max-width: 768px) {
  .map-section-heading {
    width: 12.4vw;
    margin: 0 0 5.1vw;
  }
}

.map-content {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}
@media screen and (max-width: 768px) {
  .map-content {
    display: block;
  }
}

.map-content__map {
  width: 63%;
}
.map-content__map iframe {
  aspect-ratio: 1070/740;
  width: 100%;
}
@media screen and (max-width: 768px) {
  .map-content__map {
    width: 100%;
    margin: 0 0 5.1vw;
  }
  .map-content__map iframe {
    aspect-ratio: 330/227;
  }
}

.map-content__text {
  width: 31.6%;
}
@media screen and (max-width: 768px) {
  .map-content__text {
    width: 100%;
  }
}

.map-content__text-heading {
  width: 39.2%;
  margin: 0 0 1vw;
}
@media screen and (max-width: 768px) {
  .map-content__text-heading {
    width: 18.7%;
    margin: 0 0 2.5vw;
  }
}

.map-access-list__item {
  margin: 0 0 1.8vw;
  text-align: left;
}
@media screen and (max-width: 768px) {
  .map-access-list__item {
    margin: 0 0 3.8vw;
  }
}

.map-access-list-heading {
  font-size: 0.9115vw;
  font-weight: 400;
  padding-left: 1em;
  position: relative;
}
.map-access-list-heading::before {
  content: "■";
  position: absolute;
  top: 0;
  left: 0;
}
@media screen and (max-width: 768px) {
  .map-access-list-heading {
    font-size: 2.3077vw;
  }
}

.map-access-list-desc {
  font-size: 0.9115vw;
  line-height: 1.6;
}
@media screen and (max-width: 768px) {
  .map-access-list-desc {
    font-size: 2.3077vw;
  }
}

.map-access-spec {
  font-size: 0.8854vw;
  line-height: 1.62;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  border-top: solid 1px #231815;
}
.map-access-spec dt {
  width: 25%;
  padding: 1em 0;
  border-bottom: solid 1px #231815;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.map-access-spec dd {
  width: 75%;
  text-align: left;
  padding: 1em 0;
  border-bottom: solid 1px #231815;
}
@media screen and (max-width: 768px) {
  .map-access-spec {
    font-size: 2.5641vw;
  }
}

.map-acces-spec-open {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}
.map-acces-spec-open dt {
  padding: 0;
  border: none;
  display: block;
  text-align: left;
}
.map-acces-spec-open dd {
  padding: 0;
  border: none;
}

/* ---------------------------------------*/
/* shop */
/* ---------------------------------------*/
#shop {
  padding: 5.72vw 0;
}
@media screen and (max-width: 768px) {
  #shop {
    padding: 14vw 0;
  }
}

.shop-section-heading {
  width: 22.8%;
  margin: 0 0 5.72vw;
}
@media screen and (max-width: 768px) {
  .shop-section-heading {
    width: 49%;
    margin: 0 0 7.69vw;
  }
}

.shop-image {
  margin: 0 0 5.72vw;
}
@media screen and (max-width: 768px) {
  .shop-image {
    margin: 0 0 7.69vw;
  }
}

.shop-button {
  display: block;
  width: 30vw;
  margin: 0 auto;
}
@media screen and (max-width: 768px) {
  .shop-button {
    width: 31.7vw;
  }
}

/* ---------------------------------------*/
/* about */
/* ---------------------------------------*/
#about {
  padding: 5.2vw;
  background: #231914;
}
@media screen and (max-width: 768px) {
  #about {
    padding: 12.8vw 0;
  }
}

.about-content {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  color: #fff;
}
@media screen and (max-width: 768px) {
  .about-content {
    display: block;
  }
}

.about-content__title {
  width: 45.5%;
}
@media screen and (max-width: 768px) {
  .about-content__title {
    width: 100%;
    margin: 0 0 7.5vw;
  }
}

.about-section-heading {
  width: 24.8%;
  margin: 0 0 3.64vw;
}
@media screen and (max-width: 768px) {
  .about-section-heading {
    width: 26.6vw;
    margin: 0 0 5.1vw;
  }
}

.about-content__text {
  width: 54.8%;
}
@media screen and (max-width: 768px) {
  .about-content__text {
    width: 100%;
  }
}

.about-subtitle {
  font-size: 4.4271vw;
  font-weight: 600;
  text-align: left;
}
@media screen and (max-width: 768px) {
  .about-subtitle {
    font-size: 8.9744vw;
  }
}

.about-content-boss {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: end;
      -ms-flex-align: end;
          align-items: end;
  margin: 0 0 4.68vw;
}
@media screen and (max-width: 768px) {
  .about-content-boss {
    margin: 0 0 5.1vw;
  }
}

.about-content-boss__text {
  width: 36%;
  text-align: left;
}
@media screen and (max-width: 768px) {
  .about-content-boss__text {
    width: 35%;
  }
}

.about-boss-name {
  margin: 0 0 4.1vw;
}
.about-boss-name small {
  display: block;
  font-size: 1.3542vw;
  font-weight: 400;
}
.about-boss-name span {
  font-size: 2.6042vw;
  font-weight: 400;
  letter-spacing: -0.1em;
}
@media screen and (max-width: 768px) {
  .about-boss-name {
    margin: 0 0 7.6vw;
  }
  .about-boss-name small {
    font-size: 2.5641vw;
  }
  .about-boss-name span {
    font-size: 4.6154vw;
  }
}

.about-content-boss__image {
  width: 64%;
}
@media screen and (max-width: 768px) {
  .about-content-boss__image {
    width: 65%;
  }
}

.about-desc {
  font-size: 1.3021vw;
  line-height: 2.2;
  text-align: justify;
  margin: 0 0 2.5em;
}
.about-desc:last-of-type {
  margin: 0;
}
@media screen and (max-width: 768px) {
  .about-desc {
    font-size: 3.5897vw;
  }
}

/* ---------------------------------------*/
/* bio */
/* ---------------------------------------*/
#bio {
  padding: 6.25vw 0 11.6vw;
}
@media screen and (max-width: 768px) {
  #bio {
    padding: 14vw 0 27vw;
  }
}

.bio-section-heading {
  width: 19.4%;
  margin: 0 0 5.72vw;
}
@media screen and (max-width: 768px) {
  .bio-section-heading {
    width: 41.8vw;
    margin: 0 0 7.69vw;
  }
}

.bio-list {
  width: 75.5%;
  margin: 0 auto;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  font-size: 1.5625vw;
  border-top: solid 1px #231815;
}
.bio-list dt {
  width: 30%;
  background: #231914;
  padding: 1em 0;
  color: #fff;
  border-bottom: solid 1px;
}
.bio-list dd {
  width: 70%;
  text-align: left;
  padding: 1em 2em;
  color: #231815;
  border-bottom: solid 1px;
  border-right: solid 1px;
}
.bio-list dd li {
  margin: 0 0 1em;
}
.bio-list dd li:last-child {
  margin: 0;
}
@media screen and (max-width: 768px) {
  .bio-list {
    width: 100%;
    font-size: 2.0513vw;
  }
  .bio-list dt {
    text-align: left;
    padding: 1em 3em;
  }
}

/* ---------------------------------------*/
/* history */
/* ---------------------------------------*/
#history {
  padding: 0 0 5.2vw;
}
@media screen and (max-width: 768px) {
  #history {
    padding: 0 0 12.8vw;
  }
}

.history-section-heading {
  width: 14.1%;
  margin: 0 0 4.1vw;
}
@media screen and (max-width: 768px) {
  .history-section-heading {
    width: 30%;
    margin: 0 0 7.69vw;
  }
}

.history-list {
  width: 68%;
  margin: 0 auto;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  font-size: 1.5625vw;
}
.history-list dt {
  width: 6.5em;
  text-align: right;
  padding: 0 0 1.5em;
}
.history-list dt:last-child {
  padding: 0;
}
.history-list dd {
  width: calc(100% - 6.5em);
  text-align: left;
  padding: 0 0 1.5em 6.5em;
  position: relative;
}
.history-list dd:nth-child(2)::before {
  top: 0.4em;
}
.history-list dd:last-child {
  padding: 0 0 0 6.5em;
}
.history-list dd::before {
  display: block;
  content: "";
  width: 1px;
  height: 100%;
  background: #000;
  position: absolute;
  left: 4em;
  top: 0;
}
.history-list dd::after {
  display: block;
  content: "";
  width: 1.04vw;
  height: 1.04vw;
  background: url(../img/history_icon.svg) no-repeat center/100%;
  position: absolute;
  top: 0.4em;
  left: 3.7em;
}
@media screen and (max-width: 768px) {
  .history-list {
    width: 100%;
    font-size: 2.1795vw;
  }
  .history-list dd::after {
    width: 1.5vw;
    height: 1.5vw;
    top: 0.4em;
    left: 3.755em;
  }
}