@charset "UTF-8";
.container--section {
  padding : 0;
  position : relative;
}

.mv.on img { opacity: 1;}
.mv-ttl {
  position: absolute;
  font-size: 31px;
  font-weight: 400;
  line-height: 2;
  letter-spacing: 0;
  color: #fff;
  background-color: #ba544f;
  padding: 10px;
  bottom: 0px;
  left: 50%;
  transform: translateX(-50%) translateY(50%);
    min-width: 290px;
    min-height: 290px;
    display: flex;
    align-items: center;
    justify-content: center;
  opacity: 0;
  transition: 1.5s;
}
.mv.on + .mv-ttl { opacity: 1;}

@media screen and (max-width: 767px) {
  .mv-ttl {
    font-size: 18px;
    min-height: 160px;
    min-width: 160px;
  }
}

section {
  font-family: "Noto Sans JP";
}

.intro-inner {
  margin-top : 205px;
  margin-bottom : 60px;
  text-align : center;
}

.intro-inner h1 {
  font-size : 36px;
  font-weight : normal;
  color : #ba544f;
  margin-bottom : 20px;
}

.intro-inner h1 strong {
  font-weight : normal;
  font-size : 55px;
}

.intro-inner p {
  line-height : 2;
}

@media screen and (max-width: 767px) {
  .intro-inner {
    margin-top : 100px;
    margin-bottom : 60px;
    text-align : center;
  }
  
  .intro-inner h1 {
    font-size : 20px;
    margin-bottom : 20px;
  }
  
  .intro-inner h1 strong {
    display:block;
    font-size : 30px;
  }
  
  .intro-inner p {
    padding : 0 10px;
    font-size : 14px;
  }
}

.merit-row {
  display : flex;
  margin-bottom : 100px;
}

.merit-item {
  text-align : center;
}

@media screen and (max-width: 767px) {
  .merit-row {
    display : block;
    margin-bottom : 0;
  }
  .merit-item {
    display : flex;
  }
  .merit-item > div {
    width : 50%;
  }
  .merit-item:nth-of-type(2) .merit-img {
    order : 2;
  }
}

.merit-txt1 {
  color : #ba544f;
  font-size : 19px;
  margin-top : 10px;
}

.merit-txt1:before,
.merit-txt1:after {
  position: relative;
  display: inline-block;
  content: "";
  background: #ba544f;
  width: 1px;
  height: 2em;
  margin: 0 1em;
  margin-top: -.2em;
  vertical-align: middle;
}
 
.merit-txt1:before {
  transform: rotate(-35deg);
}
 
.merit-txt1:after {
  transform: rotate(35deg);
}

@media screen and (max-width: 767px) {
  .merit-txt1 {
    font-size : 12px;
    margin-top : 15px;
  }
}

.merit-txt2 {
  font-size : 23px;
}

@media screen and (max-width: 767px) {
  .merit-txt2 {
    font-size : 18px;
    line-height : 1.4;
  }
}

.bg-color {
  background : #f4e7e5;
  padding : 80px 0;
}

.kitchen {
  width : 1200px;
  max-width : calc(100% - 30px);
  background : #fff;
  margin : 0 auto;
  padding : 60px 65px;
}

.point-ttl {
  text-align : center;
  font-size : 20px;
  margin-bottom : 20px;
}

.kitchen-img {
  margin-bottom : 60px;
}

.point-copy {
  text-align : center;
  color : #ba544f;
  font-size : 34px;
}

@media screen and (max-width: 767px) {
  .kitchen {
    padding : 0;
  }
  .kitchen-img {
    margin-bottom : 20px;
  }
  .point-copy {
    font-size : 24px;
  }
  .point-ttl {
    font-size : 16px;
  }
}

.point-row {
  display : flex;
  flex-wrap : wrap;
  justify-content : space-between;
}

.point-item {
  width : calc((100% - 10px) / 2);
  margin-bottom : 10px;
}

.item4 {
  width : calc(710 / 1070 * 100%);
}

@media screen and (max-width: 767px) {
  .point-item,
  .item4 {
    width : 100%;
  }
}

.point-item-ttl {
  font-weight : bold;
  display : inline-block;
  background : #ce7d7e;
  position : absolute;
  left : 0;
  top : 0;
  padding : 10px 30px 10px 10px;
  color : #fff;
  clip-path: polygon(0% 0%, 100% 0%, calc(100% - 20px) 100%, 0 100%);
}

.kitchen .point-no {
  font-size : 14px;
  font-weight : bold;
  color : #000
}

.kitchen .point-no .no {
  display : inline-block;
  background : #000;
  color : #fff;
  width : 25px;
  text-align : center;
  margin : 0 3px;
  -webkit-border-radius: 40px;
  border-radius: 40px;
}

.point-row2 {
  width : 986px;
  max-width : 100%;
  margin : calc(100 / 986 * 100%) 0 0 auto;
  display : flex;
  flex-wrap : wrap;
  justify-content : space-between;
}

.point-dl {
  width : calc(392 / 986 * 100%);
}

.point-mappc1 {
  position : relative;
  width: calc(350 / 1070 * 100%);
  z-index: 2;
}

.point-map {
  width : calc(520 / 986 * 100%);
  position : relative;
  z-index: 1;
}

.map1 {
  position : absolute;
  max-width : calc(520 / 350 * 100%);
  top : 0;
  right : 0;
  z-index: 3;
}

@media screen and (max-width: 767px) {
  .point-row2 {
    flex-direction:column-reverse;
    flex-wrap:wrap;
    margin-top : 10px;
    padding : 20px;
  }
  .point-dl,
  .point-map {
    width : 100%;
  }
  .point-dl {
    margin-top : 30px;
  }
  .map1 {
    position : static;
    max-width : 100%;
  }
}

.point-dl dt {
  border-bottom : solid 2px #ae8859;
  padding-bottom : 5px;
  color : #ba544f;
  font-weight : bold;
  font-size : 21px;
}

.point-dl dd {
  padding-top : 5px;
  font-size : 16px;
  margin-bottom : calc(30 / 392 * 100%)
}

.atelier-slidearea {
  margin-top : 100px;
  background : #f6f2ec;
  padding : 20px 0 40px;
}

.atelier-slider {
  padding : 0 50px;
}

@media screen and (max-width: 767px) {
  .atelier-slidearea {
    margin-top : 0;
    padding-bottom : 60px;
  }
  .atelier-slider {
    padding : 0;
  }
  .point-dl dt {
    font-size : 18px;
  }
  .point-dl dd {
    font-size : 13px;
    letter-spacing : -0.01em;
  }
}

.slick-prev {
    left: 35px;
  z-index:5;
}

.slick-next {
    right: 55px;
  z-index:5;
}

.slick-next:before
{
  content: '';
  width : 36px;
  height: 36px;
  background : url(../img/atelier/next-arrow.svg) no-repeat;
  background-size : 100%;
  display : block;
  z-index : 10;
}

.slick-prev:before
{
  content: '';
  width : 36px;
  height: 36px;
  background : url(../img/atelier/prev-arrow.svg) no-repeat;
  background-size : 100%;
  display : block;
  z-index : 10;
}

@media screen and (max-width: 767px) {
  .slick-prev {
    left: 30%;
    top : auto;
    bottom : -36px;
    z-index : 1;
  }
  .slick-next {
    right: calc(30% + 18px);
    top : auto;
    bottom : -36px;
    z-index : 1;
  }
  .slick-next:before,
  .slick-prev:before {
    z-index : 0;
  }
}

.atelierplan {
  width : 1200px;
  max-width : calc(100% - 30px);
  margin : 100px auto 0;
}

.atelierplan-ttl {
  text-align : center;
  font-size : 30px;
  color : #ba544f;
  margin-bottom : 30px;
}

.typelist {
  display : flex;
  justify-content : space-between;
  flex-wrap : wrap;
  font-family: 'Roboto', 'Noto Sans JP', "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", Verdana, Meiryo, "M+ 1p", sans-serif;
  align-items: start;
}

.typelist__item {
  width : calc((100% - 40px) / 3);
  background : #b58e5f;
  margin-bottom : 40px;
  position : relative;
  transition : .5s;
  font-family: 'Roboto', 'Noto Sans JP', "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", Verdana, Meiryo, "M+ 1p", sans-serif;
}

.typelist__item-inner {
  padding : 40px;
}

.typelist span {
  padding : 10px;
  text-align : center;
}

.typelist__item.limited:after,
.typelist__item.comingsoon:after {
  content : "";
  background : rgba(0,0,0,.8);
  display : block;
  width : 100%;
  height : 100%;
  position : absolute;
  top : 0;
  left : 0;
}

.typelist__btn {
  background : #000;
  color : #fff;
  margin-top : 10px;
  display : block;
}

.atelierplan-cap {
  font-size : 12px;
}


@media screen and (max-width: 767px) {
  .atelierplan {
    margin : 40px auto 0;
  }
  
  .atelierplan-ttl {
    font-size : 20px;
    margin-bottom : 10px;
  }
  .typelist__item {
    width : 100%;
    margin-bottom : 10px;
  }
}