@charset "UTF-8";
/*数値の設定
------------------------------------------*/
/*上記数値の設定を呼び出しているmixin
------------------------------------------*/
/*
よく使用するmixin
------------------------------------------*/
.sizeL {
  display: block;
}
@media screen and (max-aspect-ratio: 16/9) {
  .sizeL {
    display: none;
  }
}

.sizeM {
  display: none;
}
@media screen and (max-aspect-ratio: 16/9) {
  .sizeM {
    display: block;
  }
}
@media screen and (max-aspect-ratio: 12/10) {
  .sizeM {
    display: none;
  }
}

.sizeS {
  display: none;
}
@media screen and (max-aspect-ratio: 12/10) {
  .sizeS {
    display: block;
  }
}

.contents_in {
  width: 72.91%;
  max-width: 1400px;
  margin-left: auto;
  margin-right: auto;
}
@media only screen and (max-width: 1440px) {
  .contents_in {
    width: calc(100% - 100px);
  }
}
@media only screen and (max-width: 767px) {
  .contents_in {
    width: calc(100% - 70px);
  }
}
@media only screen and (max-width: 320px) {
  .contents_in {
    width: calc(100% - 40px);
  }
}

.tit_com01 {
  font-size: 22px;
  letter-spacing: 0.1em;
  margin-bottom: 100px;
}
@media only screen and (max-width: 767px) {
  .tit_com01 {
    font-size: 16px;
    margin-bottom: 50px;
  }
}
.tit_com01 strong {
  display: block;
  text-transform: uppercase;
  line-height: 1.2;
  font-size: 5em;
  letter-spacing: 0em;
}
@media only screen and (max-width: 1200px) {
  .tit_com01 strong {
    font-size: 10vw;
  }
}
@media only screen and (max-width: 991px) {
  .tit_com01 strong {
    font-size: 8vw;
  }
}

.kv {
  width: 86.45%;
  margin-bottom: 130px;
}
@media only screen and (max-width: 991px) {
  .kv {
    width: calc(100% - 50px);
  }
}
@media only screen and (max-width: 767px) {
  .kv {
    margin-bottom: 60px;
  }
}

.sec_com {
  background: url(../images/lifestylestudio/bg01.jpg) center center/cover no-repeat;
  box-sizing: border-box;
  padding: 65px 60px;
  margin-bottom: 50px;
}
@media only screen and (max-width: 991px) {
  .sec_com {
    display: block;
    background-position: 30% 50%;
  }
}
@media only screen and (max-width: 767px) {
  .sec_com {
    padding: 20px;
    margin-bottom: 30px;
  }
}
.sec_com .sec_tit01 {
  font-size: 30px;
  letter-spacing: 0.1em;
  margin-bottom: 1.33em;
}
@media only screen and (max-width: 767px) {
  .sec_com .sec_tit01 {
    font-size: 20px;
  }
}
.sec_com .sec_flex {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: flex-start;
  gap: 20px 0px;
}
.sec_com .sec_flex.rr {
  flex-direction: row-reverse;
}
.sec_com .sec_flex .txtBox {
  width: 52.26%;
}
@media only screen and (max-width: 991px) {
  .sec_com .sec_flex .txtBox {
    width: 100%;
  }
}
.sec_com .sec_flex .imgBox {
  width: 41.2%;
}
@media only screen and (max-width: 991px) {
  .sec_com .sec_flex .imgBox {
    width: 100%;
  }
}
.sec_com .sec_flex > li {
  width: 21.93%;
}
@media only screen and (max-width: 991px) {
  .sec_com .sec_flex > li {
    width: 49%;
  }
}
.sec_com .sec_flex > li .tit {
  text-align: center;
  font-size: 23px;
  letter-spacing: 0.1em;
  margin-bottom: 1em;
}
@media only screen and (max-width: 767px) {
  .sec_com .sec_flex > li .tit {
    font-size: 16px;
  }
}
.sec_com .sec_flex > li .img {
  margin-bottom: 15px;
}
@media only screen and (max-width: 767px) {
  .sec_com .sec_flex > li .img {
    margin-bottom: 10px;
  }
}
.sec_com .sec_flex > li .txt {
  font-size: 14px;
}
@media only screen and (max-width: 767px) {
  .sec_com .sec_flex > li .txt {
    font-size: 13px;
  }
}

.online_btn {
  display: block;
  width: 100%;
  max-width: 550px;
  margin-left: auto;
  margin-right: auto;
  font-size: 24px;
  text-align: center;
  background-color: #978953;
  color: #fff;
  padding: 10px 0px;
  box-sizing: border-box;
  letter-spacing: 0.1em;
  margin-bottom: 80px;
}
@media only screen and (max-width: 767px) {
  .online_btn {
    margin-bottom: 40px;
    font-size: 16px;
  }
}

.sec_life04 .sec_life_com_in {
  width: 100%;
  max-width: 800px;
  margin-left: auto;
  margin-right: auto;
}
.sec_life04 .tit01 {
  font-optical-sizing: auto;
  font-weight: 500;
  font-style: normal;
  text-align: center;
  font-size: 54px;
  margin-bottom: 50px;
  letter-spacing: 3px;
}
@media only screen and (max-width: 767px) {
  .sec_life04 .tit01 {
    font-size: 30px;
    text-align: left;
    margin-bottom: 30px;
  }
}
.sec_life04 .img_map {
  margin-bottom: 30px;
}
@media only screen and (max-width: 767px) {
  .sec_life04 .img_map {
    margin-bottom: 20px;
  }
}
.sec_life04 .sec_life04_flex {
  width: 100%;
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
}
@media only screen and (max-width: 767px) {
  .sec_life04 .sec_life04_flex {
    display: block;
  }
}
.sec_life04 .sec_life04_flex .txt01 {
  width: 56.25%;
  font-size: 14px;
  line-height: 1.6;
}
@media only screen and (max-width: 767px) {
  .sec_life04 .sec_life04_flex .txt01 {
    width: 100%;
    margin-bottom: 40px;
  }
}
.sec_life04 .sec_life04_flex .btn01 {
  display: block;
  width: 43.75%;
  text-align: center;
  box-sizing: border-box;
  color: #fff;
  background-color: #3F2022;
  padding: 20px 0;
  font-size: 14px;
  position: relative;
}
@media only screen and (max-width: 767px) {
  .sec_life04 .sec_life04_flex .btn01 {
    width: 100%;
  }
}