.conceptSect__head .enTtl {
  color: #a47e40;
  font-family: "Cinzel", serif;
  font-weight: 400;
  text-align: center;
}

@media screen and (min-width: 768px) {
  .conceptSect__head .enTtl {
    font-size: 48px;
  }
}

@media screen and (max-width: 768px) {
  .conceptSect__head .enTtl {
    font-size: calc(28 / 390 * 100vw);
  }
}

@media screen and (min-width: 768px) {
  .conceptSect__head .enTtl + .photo {
    margin-top: 64px;
  }
}

@media screen and (max-width: 768px) {
  .conceptSect__head .enTtl + .photo {
    margin-top: calc(64 / 390 * 100vw);
  }
}

@media screen and (min-width: 768px) {
  .conceptSect__head .photo {
    margin-left: auto;
    margin-right: auto;
    max-width: 880px;
  }
}

@media screen and (max-width: 768px) {
  .conceptSect__head .photo {
    margin-left: calc(-24 / 390 * 100vw);
    width: 100vw;
  }
}

@media screen and (min-width: 768px) {
  .conceptSect__head + .conceptSect__cont {
    margin-top: 64px;
  }
}

@media screen and (max-width: 768px) {
  .conceptSect__head + .conceptSect__cont {
    margin-top: calc(24 / 390 * 100vw);
  }
}

@media screen and (min-width: 768px) {
  .conceptSect__cont {
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    gap: 137px;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
    padding-left: 88px;
  }
}

@media screen and (min-width: 768px) {
  .conceptSect__txt {
    width: 528px;
  }
}

@media screen and (max-width: 768px) {
  .conceptSect__txt + .conceptSect__img {
    margin-top: calc(24 / 390 * 100vw);
  }
}

@media screen and (min-width: 768px) {
  .conceptSect__img {
    width: 487px;
  }
}

@media screen and (max-width: 768px) {
  .conceptSect__img {
    margin-left: auto;
    width: calc(279 / 390 * 100vw);
  }
}

@media screen and (min-width: 768px) {
  .designerArea__head .heading {
    font-size: 32px;
  }
}

@media screen and (max-width: 768px) {
  .designerArea__head .heading {
    font-size: calc(22 / 390 * 100vw);
  }
}

@media screen and (min-width: 768px) {
  .designerArea__head .heading + .photo {
    margin-top: 24px;
  }
}

@media screen and (max-width: 768px) {
  .designerArea__head .heading + .photo {
    margin-top: calc(16 / 390 * 100vw);
  }
}

@media screen and (min-width: 768px) {
  .designerArea__head .photo {
    width: calc(390 / 1440 * 100vw);
  }
}

@media screen and (max-width: 768px) {
  .designerArea__head .photo {
    width: 100%;
  }
}

.designerArea__head .photo__image {
  width: 100%;
}

@media screen and (min-width: 768px) {
  .designerArea__head .photo + .designerArea__svg {
    margin-top: 24px;
  }
}

@media screen and (max-width: 768px) {
  .designerArea__head .photo + .designerArea__svg {
    margin-top: calc(16 / 390 * 100vw);
  }
}

@media screen and (min-width: 768px) {
  .designerArea__head + .designerArea__cont {
    margin-top: 24px;
  }
}

@media screen and (max-width: 768px) {
  .designerArea__head + .designerArea__cont {
    margin-top: calc(16 / 390 * 100vw);
  }
}

@media screen and (min-width: 768px) {
  .designerArea__svg {
    width: 184px;
  }
}

@media screen and (max-width: 768px) {
  .designerArea__svg {
    width: calc(184 / 390 * 100vw);
  }
}

.designerArea__cont .txt {
  line-height: 2;
}

.designerArea__cont .txt:before {
  content: '';
  margin-top: calc((1 - 2) * .5em);
}

.designerArea__cont .txt:after {
  margin-bottom: calc((1 - 2) * .5em);
}

.designerArea__cont .txt:before, .designerArea__cont .txt:after {
  content: '';
  display: block;
  height: 0;
  width: 0;
}

@media screen and (min-width: 768px) {
  .designerArea__cont .txt {
    font-size: 12px;
  }
}

@media screen and (max-width: 768px) {
  .designerArea__cont .txt {
    font-size: calc(12 / 390 * 100vw);
  }
}

.designerArea__ttl {
  border-bottom: 1px solid #999999;
}

@media screen and (min-width: 768px) {
  .designerArea__ttl {
    padding-bottom: 24px;
  }
}

@media screen and (max-width: 768px) {
  .designerArea__ttl {
    padding-bottom: calc(24 / 390 * 100vw);
  }
}

.designerArea__ttl .ttl {
  display: block;
}

@media screen and (min-width: 768px) {
  .designerArea__ttl .ttl {
    font-size: 12px;
  }
}

@media screen and (max-width: 768px) {
  .designerArea__ttl .ttl {
    font-size: calc(12 / 390 * 100vw);
  }
}

@media screen and (min-width: 768px) {
  .designerArea__ttl .ttl + .name {
    margin-top: 8px;
  }
}

@media screen and (max-width: 768px) {
  .designerArea__ttl .ttl + .name {
    margin-top: calc(16 / 390 * 100vw);
  }
}

.designerArea__ttl .name {
  display: block;
}

@media screen and (min-width: 768px) {
  .designerArea__ttl .name {
    font-size: 28px;
  }
}

@media screen and (max-width: 768px) {
  .designerArea__ttl .name {
    font-size: calc(28 / 390 * 100vw);
  }
}

@media screen and (min-width: 768px) {
  .designerArea__ttl .name .small {
    font-size: 18px;
  }
}

@media screen and (max-width: 768px) {
  .designerArea__ttl .name .small {
    font-size: calc(18 / 390 * 100vw);
  }
}

.designerArea__ttl .name .en {
  font-family: "Cinzel", serif;
}

@media screen and (min-width: 768px) {
  .designerArea__ttl .name .en {
    font-size: 14px;
    margin-left: 16px;
  }
}

@media screen and (max-width: 768px) {
  .designerArea__ttl .name .en {
    display: block;
    font-size: calc(14 / 390 * 100vw);
    margin-top: calc(16 / 390 * 100vw);
  }
}

@media screen and (min-width: 768px) {
  .designerArea__ttl + .txt {
    margin-top: 24px;
  }
}

@media screen and (max-width: 768px) {
  .designerArea__ttl + .txt {
    margin-top: calc(24 / 390 * 100vw);
  }
}

.entranceSect__head .enTtl {
  color: #ffffff;
  font-family: "Cinzel", serif;
  font-weight: 400;
  text-align: center;
}

@media screen and (min-width: 768px) {
  .entranceSect__head .enTtl {
    font-size: 48px;
  }
}

@media screen and (max-width: 768px) {
  .entranceSect__head .enTtl {
    font-size: calc(28 / 390 * 100vw);
  }
}

@media screen and (min-width: 768px) {
  .entranceSect__head .enTtl + .photo {
    margin-top: 64px;
  }
}

@media screen and (max-width: 768px) {
  .entranceSect__head .enTtl + .photo {
    margin-top: calc(40 / 390 * 100vw);
  }
}

@media screen and (max-width: 768px) {
  .entranceSect__head .photo {
    margin-left: calc(-24 / 390 * 100vw);
    width: 100vw;
  }
}

@media screen and (min-width: 768px) {
  .entranceSect__head + .entranceSect__cont {
    margin-top: 64px;
  }
}

@media screen and (max-width: 768px) {
  .entranceSect__head + .entranceSect__cont {
    margin-top: calc(40 / 390 * 100vw);
  }
}

@media screen and (min-width: 768px) {
  .entranceSect__cont .headingCombi {
    margin: 0;
    padding-left: 120px;
  }
}

@media screen and (min-width: 768px) {
  .entranceSect__cont .headingCombi .heading {
    font-size: 28px;
  }
}

@media screen and (max-width: 768px) {
  .entranceSect__cont .headingCombi .heading {
    font-size: calc(22 / 390 * 100vw);
  }
}

@media screen and (min-width: 768px) {
  .entranceSect__cont .headingCombi .heading + .txt {
    margin-top: 32px;
  }
}

@media screen and (max-width: 768px) {
  .entranceSect__cont .headingCombi .heading + .txt {
    margin-top: calc(24 / 390 * 100vw);
  }
}

@media screen and (min-width: 768px) {
  .entranceSect__cont .headingCombi .heading .txt {
    font-size: 16px;
  }
}

@media screen and (max-width: 768px) {
  .entranceSect__cont .headingCombi .heading .txt {
    font-size: calc(14 / 390 * 100vw);
  }
}

@media screen and (min-width: 768px) {
  .entranceSect__cont .headingCombi + .usableList {
    margin-top: 64px;
  }
}

@media screen and (max-width: 768px) {
  .entranceSect__cont .headingCombi + .usableList {
    margin-top: calc(32 / 390 * 100vw);
  }
}

@media screen and (min-width: 768px) {
  .entranceSect__cont .usableList {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    gap: 32px;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
  }
}

@media screen and (min-width: 768px) {
  .entranceSect__cont .usableList__item {
    width: calc((1 / 3 * 100%) - 16px);
  }
}

@media screen and (max-width: 768px) {
  .entranceSect__cont .usableList__item {
    width: 100%;
  }
}

@media screen and (min-width: 768px) {
  .entranceSect__cont .usableList__item .descriptionCard {
    width: 100%;
  }
}

@media screen and (max-width: 768px) {
  .entranceSect__cont .usableList__item .descriptionCard {
    width: 100%;
  }
}

@media screen and (min-width: 768px) {
  .entranceSect__cont .usableList__item .descriptionCard__head {
    margin-bottom: 24px;
  }
}

.entranceSect__cont .usableList__item .descriptionCard__txt {
  line-height: 2;
}

.entranceSect__cont .usableList__item .descriptionCard__txt:before {
  content: '';
  margin-top: calc((1 - 2) * .5em);
}

.entranceSect__cont .usableList__item .descriptionCard__txt:after {
  margin-bottom: calc((1 - 2) * .5em);
}

.entranceSect__cont .usableList__item .descriptionCard__txt:before, .entranceSect__cont .usableList__item .descriptionCard__txt:after {
  content: '';
  display: block;
  height: 0;
  width: 0;
}

@media screen and (min-width: 768px) {
  .entranceSect__cont .usableList__item .descriptionCard__txt {
    font-size: 12px;
  }
}

@media screen and (max-width: 768px) {
  .entranceSect__cont .usableList__item .descriptionCard__txt {
    font-size: calc(12 / 390 * 100vw);
  }
}

@media screen and (max-width: 768px) {
  .entranceSect__cont .usableList__item + .usableList__item {
    margin-top: calc(24 / 390 * 100vw);
  }
}

.landscapeSect__head .enTtl {
  color: #ffffff;
  font-family: "Cinzel", serif;
  font-weight: 400;
  text-align: center;
}

@media screen and (min-width: 768px) {
  .landscapeSect__head .enTtl {
    font-size: 48px;
  }
}

@media screen and (max-width: 768px) {
  .landscapeSect__head .enTtl {
    font-size: calc(28 / 390 * 100vw);
  }
}

@media screen and (min-width: 768px) {
  .landscapeSect__head + .landscapeSect__cont {
    margin-top: 64px;
  }
}

@media screen and (max-width: 768px) {
  .landscapeSect__head + .landscapeSect__cont {
    margin-top: calc(40 / 390 * 100vw);
  }
}

@media screen and (min-width: 768px) {
  .landscapeSect__cont {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    gap: 64px;
  }
}

@media screen and (min-width: 768px) {
  .landscapeSect__cont .photo {
    max-width: 784px;
  }
}

@media screen and (max-width: 768px) {
  .landscapeSect__cont .photo {
    margin-left: calc(-24 / 390 * 100vw);
    width: 100vw;
  }
}

@media screen and (max-width: 768px) {
  .landscapeSect__cont .photo + .headingCombi {
    margin-top: calc(40 / 390 * 100vw);
  }
}

.landscapeSect__cont .headingCombi {
  -ms-flex-negative: 0;
      flex-shrink: 0;
}

@media screen and (min-width: 768px) {
  .landscapeSect__cont .headingCombi .heading {
    font-size: 28px;
  }
}

@media screen and (max-width: 768px) {
  .landscapeSect__cont .headingCombi .heading {
    font-size: calc(22 / 390 * 100vw);
  }
}

@media screen and (min-width: 768px) {
  .landscapeSect__cont .headingCombi .heading + .txt {
    margin-top: 32px;
  }
}

@media screen and (max-width: 768px) {
  .landscapeSect__cont .headingCombi .heading + .txt {
    margin-top: calc(24 / 390 * 100vw);
  }
}

.landscapeSect__cont .headingCombi .txt {
  line-height: 2;
}

.landscapeSect__cont .headingCombi .txt:before {
  content: '';
  margin-top: calc((1 - 2) * .5em);
}

.landscapeSect__cont .headingCombi .txt:after {
  margin-bottom: calc((1 - 2) * .5em);
}

.landscapeSect__cont .headingCombi .txt:before, .landscapeSect__cont .headingCombi .txt:after {
  content: '';
  display: block;
  height: 0;
  width: 0;
}

@media screen and (min-width: 768px) {
  .landscapeSect__cont .headingCombi .txt {
    font-size: 16px;
  }
}

@media screen and (max-width: 768px) {
  .landscapeSect__cont .headingCombi .txt {
    font-size: calc(14 / 390 * 100vw);
  }
}

@media screen and (min-width: 768px) {
  .mapSect {
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    gap: calc(96 / 1440 * 100vw);
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
  }
}

@media screen and (min-width: 768px) {
  .mapSect__head {
    width: calc(624 / 1440 * 100vw);
  }
}

@media screen and (min-width: 768px) {
  .mapSect__head .photo {
    max-width: 624px;
  }
}

@media screen and (max-width: 768px) {
  .mapSect__head + .mapSect__cont {
    margin-top: calc(32 / 390 * 100vw);
  }
}

@media screen and (min-width: 768px) {
  .mapSect__cont {
    width: calc(560 / 1440 * 100vw);
  }
}

@media screen and (max-width: 768px) {
  .mapSect__cont {
    margin-left: calc(-4 / 390 * 100vw);
  }
}

.mapSect__cont .usableList {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}

@media screen and (max-width: 768px) {
  .mapSect__cont .usableList {
    gap: calc(16 / 390 * 100vw);
  }
}

@media screen and (min-width: 768px) {
  .mapSect__cont .usableList__item .descriptionCard {
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    gap: calc(32 / 1440 * 100vw);
    width: calc(560 / 1440 * 100vw);
  }
}

@media screen and (max-width: 768px) {
  .mapSect__cont .usableList__item .descriptionCard {
    width: calc(165 / 390 * 100vw);
  }
}

@media screen and (min-width: 768px) {
  .mapSect__cont .usableList__item .descriptionCard__head {
    -ms-flex-negative: 0;
        flex-shrink: 0;
    width: calc(260 / 1440 * 100vw);
  }
}

@media screen and (min-width: 768px) {
  .mapSect__cont .usableList__item .descriptionCard__head + .descriptionCard__cont {
    margin-top: 0;
  }
}

.mapSect__cont .usableList__item .descriptionCard__ttl {
  padding-bottom: 0;
  line-height: 1.6;
}

.mapSect__cont .usableList__item .descriptionCard__ttl:before {
  display: none;
}

.mapSect__cont .usableList__item .descriptionCard__ttl:before {
  content: '';
  margin-top: calc((1 - 1.6) * .5em);
}

.mapSect__cont .usableList__item .descriptionCard__ttl:after {
  margin-bottom: calc((1 - 1.6) * .5em);
}

.mapSect__cont .usableList__item .descriptionCard__ttl:before, .mapSect__cont .usableList__item .descriptionCard__ttl:after {
  content: '';
  display: block;
  height: 0;
  width: 0;
}

@media screen and (min-width: 768px) {
  .mapSect__cont .usableList__item .descriptionCard__ttl {
    font-size: 16px;
    letter-spacing: .08em;
    margin-bottom: calc(24 / 1440 * 100vw);
  }
}

@media screen and (max-width: 768px) {
  .mapSect__cont .usableList__item .descriptionCard__ttl {
    font-size: calc(12 / 390 * 100vw);
  }
}

.mapSect__cont .usableList__item .descriptionCard__txt {
  line-height: 2;
}

.mapSect__cont .usableList__item .descriptionCard__txt:before {
  content: '';
  margin-top: calc((1 - 2) * .5em);
}

.mapSect__cont .usableList__item .descriptionCard__txt:after {
  margin-bottom: calc((1 - 2) * .5em);
}

.mapSect__cont .usableList__item .descriptionCard__txt:before, .mapSect__cont .usableList__item .descriptionCard__txt:after {
  content: '';
  display: block;
  height: 0;
  width: 0;
}

@media screen and (min-width: 768px) {
  .mapSect__cont .usableList__item .descriptionCard__txt {
    font-size: 12px;
  }
}

@media screen and (max-width: 768px) {
  .mapSect__cont .usableList__item .descriptionCard__txt {
    font-size: calc(12 / 390 * 100vw);
  }
}

@media screen and (min-width: 768px) {
  .mapSect__cont .usableList__item + .usableList__item {
    margin-top: 32px;
  }
}

@media screen and (min-width: 768px) {
  * + .mapSect {
    margin-top: 64px;
  }
}

@media screen and (max-width: 768px) {
  * + .mapSect {
    margin-top: calc(32 / 390 * 100vw);
  }
}

.philosophySect {
  position: relative;
}

@media screen and (min-width: 768px) {
  .philosophySect {
    -webkit-box-align: end;
        -ms-flex-align: end;
            align-items: end;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    gap: calc(40 / 1440 * 100vw);
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
    padding-left: calc(88 / 1440 * 100vw);
  }
}

@media screen and (min-width: 768px) {
  .philosophySect__ttl {
    position: absolute;
    right: -40px;
    top: 0;
  }
}

@media screen and (max-width: 768px) {
  .philosophySect__ttl {
    text-align: end;
  }
}

.philosophySect__ttl .enTtl {
  color: #000000;
  font-family: "Cinzel", serif;
}

@media screen and (min-width: 768px) {
  .philosophySect__ttl .enTtl {
    font-size: 32px;
  }
}

@media screen and (max-width: 768px) {
  .philosophySect__ttl .enTtl {
    font-size: calc(22 / 390 * 100vw);
  }
}

@media screen and (max-width: 768px) {
  .philosophySect__ttl + .philosophySect__head {
    margin-top: calc(40 / 390 * 100vw);
  }
}

@media screen and (min-width: 768px) {
  .philosophySect__head {
    -ms-flex-negative: 0;
        flex-shrink: 0;
    width: calc(460 / 1440 * 100vw);
  }
}

@media screen and (max-width: 768px) {
  .philosophySect__head + .philosophySect__cont {
    margin-top: calc(40 / 390 * 100vw);
  }
}

.philosophySect__cont {
  display: grid;
  grid-template-columns: calc(290 / 756 * 100%) calc(450 / 756 * 100%);
}

@media screen and (min-width: 768px) {
  .philosophySect__cont {
    gap: calc(16 / 1440 * 100vw);
    margin-right: calc(-96 / 1440 * 100%);
    max-width: 756px;
    width: calc(756 / 1440 * 100vw);
  }
}

@media screen and (max-width: 768px) {
  .philosophySect__cont {
    gap: calc(16 / 390 * 100vw);
    margin-right: calc(-24 / 390 * 100vw);
  }
}

.philosophySect__cont .photo {
  height: -webkit-fit-content;
  height: -moz-fit-content;
  height: fit-content;
}

.philosophySect__cont .photo__capIn {
  letter-spacing: 0;
}

@media screen and (min-width: 768px) {
  .philosophySect__cont .photo__capIn {
    font-size: 10px;
    padding-right: 5px;
  }
}

@media screen and (max-width: 768px) {
  .philosophySect__cont .photo__capIn {
    font-size: calc(8 / 390 * 100vw);
    padding-right: calc(5 / 390 * 100vw);
  }
}

.philosophySect__cont .photo:nth-child(1) {
  grid-column: 1 / 2;
  grid-row: 1 / 3;
  margin-top: auto;
}

.philosophySect__cont .photo:nth-child(2) {
  grid-column: 2 / 3;
  grid-row: 1 / 2;
}

.philosophySect__cont .photo:nth-child(3) {
  grid-column: 2 / 3;
  grid-row: 2 / 3;
  width: calc(368 / 450 * 100%);
}

@media screen and (min-width: 768px) {
  .templateSect__cont {
    margin-top: 64px;
  }
}

@media screen and (max-width: 768px) {
  .templateSect__cont {
    margin-top: calc(64 / 390 * 100vw);
  }
}

@media screen and (min-width: 768px) {
  .templateSect + .templateSect {
    margin-top: 60px;
    width: 389px;
  }
}

@media screen and (max-width: 768px) {
  .templateSect + .templateSect {
    margin-top: calc(60 / 390 * 100vw);
  }
}

@media screen and (min-width: 768px) {
  .wrap {
    max-width: 1248px;
    width: calc(1248 / 1440 * 100vw);
  }
}

.design-concept {
  position: relative;
  z-index: 2;
}

.design-concept:before {
  aspect-ratio: 1;
  border: solid;
  border-color: #f3ede6;
  border-radius: 50%;
  border-width: 215px;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  content: '';
  display: block;
  position: absolute;
  right: calc(50% - 75px);
  z-index: -1;
}

@media screen and (min-width: 768px) {
  .design-concept:before {
    bottom: 303px;
    width: 1073px;
  }
}

@media screen and (max-width: 768px) {
  .design-concept:before {
    bottom: calc(366 / 390 * 100vw);
    width: calc(740 / 390 * 100vw);
  }
}

@media screen and (min-width: 768px) {
  .design-concept {
    padding: 96px 0 120px;
  }
}

@media screen and (max-width: 768px) {
  .design-concept {
    padding: calc(64 / 390 * 100vw) 0 calc(64 / 390 * 100vw);
  }
}

.design-philosophy {
  overflow: hidden;
  position: relative;
  z-index: 2;
}

.design-philosophy:after {
  background-color: #e3e4e3;
  content: '';
  display: block;
  height: 100%;
  left: 50%;
  position: absolute;
  top: 0;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  width: 100vw;
  z-index: -1;
}

.design-philosophy:before {
  aspect-ratio: 1;
  border: solid;
  border-color: #9a8ea0;
  border-radius: 50%;
  border-width: 215px;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  content: '';
  display: block;
  opacity: .15;
  position: absolute;
  z-index: 0;
}

@media screen and (min-width: 768px) {
  .design-philosophy:before {
    bottom: -54px;
    left: calc(50% - 158px);
    width: 958px;
  }
}

@media screen and (max-width: 768px) {
  .design-philosophy:before {
    top: calc(-72 / 390 * 100vw);
    width: calc(740 / 390 * 100vw);
  }
}

@media screen and (min-width: 768px) {
  .design-philosophy {
    padding: 96px 0 96px;
  }
}

@media screen and (max-width: 768px) {
  .design-philosophy {
    padding: calc(64 / 390 * 100vw) 0 calc(64 / 390 * 100vw);
  }
}

.design-entrance {
  background-color: #504c42;
  background-size: cover;
  color: #ffffff;
}

@media screen and (min-width: 768px) {
  .design-entrance {
    background-image: url("../imgs/pc/bg-entrance-01.jpg");
    padding: 96px 0;
  }
}

@media screen and (max-width: 768px) {
  .design-entrance {
    background-image: url("../imgs/sp/bg-entrance-01.jpg");
    padding: calc(64 / 390 * 100vw) 0 calc(64 / 390 * 100vw);
  }
}

.design-hall {
  background-color: #2c2c2c;
  background-size: cover;
  color: #ffffff;
}

@media screen and (min-width: 768px) {
  .design-hall {
    background-image: url("../imgs/pc/bg-hall-01.jpg");
    padding: 96px 0;
  }
}

@media screen and (max-width: 768px) {
  .design-hall {
    background-image: url("../imgs/sp/bg-hall-01.jpg");
    padding: calc(64 / 390 * 100vw) 0 calc(64 / 390 * 100vw);
  }
}

.design-landscape {
  background-color: #504c42;
  color: #ffffff;
}

@media screen and (min-width: 768px) {
  .design-landscape {
    padding: 96px 0;
  }
}

@media screen and (max-width: 768px) {
  .design-landscape {
    padding: calc(64 / 390 * 100vw) 0 calc(64 / 390 * 100vw);
  }
}