@charset "UTF-8";

@import url(root.css);

article {
  overflow-x: hidden;
}

.background {
  opacity: 0;
  transition: opacity 1s ease;
}
.background.show {
  opacity: 1;

  bottom: 0;
  left: 0;
  overflow: hidden;
  position: fixed;
  right: 0;
  top: 0;
	z-index: -1;
}

.bg-video {
  box-sizing: border-box;
  height: 56.25vw; /* 16:9 の高さなので 56.25% (= 9 ÷ 16) */
  left: 50%;
  min-height: 100%;
  min-width: 100%;
  position: absolute;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 177.77777778vh; /* 16:9 の幅なので 177.77% (= 16 ÷ 9) */
	display: none;
}
@media (min-aspect-ratio: 16/9) {
  .bg-video {
    width: 100vw;
    height: 56.25vw;
  }
}
@media (min-aspect-ratio: 9/16) {
	.bg-video {
		height: 177.78vh;
	}
}
@media (min-width: 768px) {
	.video-pc {
		display: block;
	}
}

@media (max-width: 767px) {
	.video-sp {
		display: block;
	}
}

/* visual */
.visual {
  position: relative;
}
.visual_img img {
  vertical-align: top;
}
.visual_title_block{
  position: absolute;
  color: #fff;
}
.visual_title {
  text-align: center;
}
.visual_title_en {
  width: 100%;
}
.visual_catch {
  font-weight: 700;
}
.visual_caption {
  color: #fff;
  width: auto;
}

@media (min-width: 768px) {
  .visual_title_block{
    left: calc((170vw / 1366) * 100);
    top: calc((235vw / 1366) * 100);
    width: calc((390vw / 1366) * 100);
  }
  .visual_title {
    margin: 0 auto;
    width: calc((260vw / 1366) * 100);
  }
  .visual_title_ja {
    font-size: calc((21vw / 1366) * 100);
    line-height: calc((30vw / 1366) * 100);
    margin-top:  calc((-10vw / 1366) * 100);
    text-shadow: 0 0 calc((10vw / 1366) * 100) #000;
  }
  .visual_catch {
    text-align: center;
    font-size: calc((26vw / 1366) * 100);
    line-height: calc((37vw / 1366) * 100);
    text-shadow: 0 0 calc((10vw / 1366) * 100) #000;
    margin-top: calc((28vw / 1366) * 100);
    white-space: nowrap;
  }
}

@media (max-width: 767px) {
  .visual_title_block{
    top: calc((361vw / 390) * 100);
    left: 0;
    right: 0;
    margin: 0 auto;
  }
  .visual_title {
    margin: 0 auto;
    width: calc((175vw / 390) * 100);
  }
  .visual_title_ja {
    color: #fff;
    font-size: calc((16vw / 390) * 100);
    line-height: calc((30vw / 390) * 100);
    text-shadow: 0 0 calc((10vw / 390) * 100) #000;
  }
  .visual_catch {
    color: #fff;
    font-size: calc((18vw / 390) * 100);
    line-height: calc((22vw / 390) * 100);
    text-align: center;
    text-shadow: 0 0 calc((10vw / 390) * 100) #000;
    margin-top: calc((8vw / 390) * 100);
    text-align: center;
  }
  .visual_caption {
    bottom: calc((9vw / 390) * 100);
    font-size: calc((8vw / 390) * 100);
    right: calc((10vw / 390) * 100);
  }
}


.quality_breadcrumb {
  background-color: rgba(175, 146, 101,0.9);
  color: #fff;
}
.quality_breadcrumb a {
  color: #fff;
}
main#content .-en {
  font-family: 'Times New Roman', Times, serif;
  font-style: italic;
}
/* catnav */
.catnav_wrap{
  background-color: rgba(175, 146, 101,0.9);
}
.catnav{
  position: relative;
  color: #fff;
  font-weight: 700;
}
.catnav::before{
  content: "";
  position: absolute;
  inset: 0;
  background-color: #AF9265;
  mix-blend-mode: multiply;
  pointer-events: none;
  z-index: 0;
}
.catnav_list{
  position: relative;
  z-index: 1;
}
.catnav_item{
  font-weight: 600;
}
.catnav a{
  color: #fff;
  display: block;
  text-align: center;
  position: relative;
}
.catnav a::after {
    content: "";
    opacity: 0;
    transition: all 0.3s;
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 70%;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.5) 100%);
    z-index: 1;
}
.catnav a:hover::after {
    opacity: 0.5;
}
.catnav a:hover{
  text-decoration: none;
}
.catnav_list {
  margin: 0 auto;
  position: relative;
  z-index: 2;
}
.catnav_item-en{
  display: block;
  margin: 0 auto;
}

@media (min-width: 768px) {
  .catnav {
    padding: calc((60vw / 1366) * 100) 0 ;
  }
  .catnav_list {
    display: flex;
    flex-wrap: wrap;
    gap: calc((60vw / 1366) * 100) calc((35vw / 1366) * 100);
    width: calc((1000vw / 1366) * 100);
    margin: 0 auto;
  }
  .catnav_item{
    line-height: 1.0;
    font-size: calc((20vw / 1366) * 100);
    width: calc((310vw / 1366) * 100);
    border-bottom: calc((1vw / 1366) * 100) solid #fff;
  }
  .catnav_item a{
    padding-bottom: calc((13vw / 1366) * 100);
    box-sizing: border-box;
    height: 100%;
  }
  .catnav_item-en{
    margin-bottom: calc((15vw / 1366) * 100);
  }
  .catnav_item-kitchen .catnav_item-en{
    width: calc((71vw / 1366) * 100);
  }
  .catnav_item-bathroom .catnav_item-en{
    width: calc((96vw / 1366) * 100);
  }
  .catnav_item-prt .catnav_item-en{
    width: calc((224vw / 1366) * 100);
  }
  .catnav_item-amenity .catnav_item-en{
    width: calc((83vw / 1366) * 100);
  }
  .catnav_item-dp .catnav_item-en{
    width: calc((190vw / 1366) * 100);
  }
  .catnav_item-security .catnav_item-en{
    width: calc((81vw / 1366) * 100);
  }
}

@media (max-width: 767px) {
  .catnav {
    padding: calc((50vw / 390) * 100) 0 calc((60vw / 390) * 100);
  }
  .catnav_list {
    display: flex;
    flex-direction: column;
    gap: calc((16vw / 390) * 100) 0;
    width: calc((310vw / 390) * 100);
    margin: 0 auto;
  }
  .catnav_item{
    line-height: 1.0;
    font-size: calc((14vw / 390) * 100);
    width: calc((310vw / 390) * 100);
    border-bottom: calc((1vw / 390) * 100) solid #fff;
  }
  .catnav_item a{
    padding-bottom: calc((10vw / 390) * 100);
  }
  .catnav_item-en{
    margin-bottom: calc((15vw / 390) * 100);
  }
  .catnav_item-kitchen .catnav_item-en{
    width: calc((61vw / 390) * 100);
  }
  .catnav_item-bathroom .catnav_item-en{
    width: calc((82vw / 390) * 100);
  }
  .catnav_item-prt .catnav_item-en{
    width: calc((192vw / 390) * 100);
  }
  .catnav_item-amenity .catnav_item-en{
    width: calc((72vw / 390) * 100);
  }
  .catnav_item-dp .catnav_item-en{
    width: calc((163vw / 390) * 100);
  }
  .catnav_item-security .catnav_item-en{
    width: calc((70vw / 390) * 100);
  }
}
/* quality_head */
.quality {
  background-color: rgba(175, 146, 101,0.9);
  position: relative;
  font-weight: 700;
  color: #fff;
  z-index: 2;
}
.quality_outer{
  margin: 0 auto;
}
.quality_head_title{
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.quality_head_title::before,
.quality_head_title::after{
  content: "";
  background-color: #fff;
  flex: 1;
}
.quality_head_copy{
  background-color: #fff;
  color: #AF9265;
  text-align: center;
  display: flex;
  justify-content: center;
  align-items: center;
  font-weight: 500;
}
.quality_head_copy--mt0{
  margin-top: 0 !important;
}
.quality_title{
  display: flex;
  flex-direction: column;
  line-height: 1.0;
}
.quality_itmes{
  display: flex;
  flex-wrap: wrap;
}
.quality_itmes_img{
  position: relative;
}
.quality_itme {
  display: flex;
  flex-direction: column;
}
.quality_itmes_desc-note{
  display: inline;
}
.quality_itme_row{
  display: flex;
}
.quality_leadarea{
  background-color: #fff;
  color: #AF9265;
  box-sizing: border-box;
}
.quality_leadarea_copy{
  text-align: center;
}
.quality_note--right{
  text-align: right;
  color: #77797B;
}
.quality_leadarea_block{
  display: flex;
}
.quality_leadarea_kv{
  display: flex;
  align-items: center;
  justify-content: center;
}
.quality_contents,
.quality_leadarea_title{
  font-weight: 700;
}
.quality_head_title {
  text-align: center;
}
@media screen and (min-width: 768px) {
  .quality {
    padding: calc((120vw / 1366) * 100) 0 ;
  }
  .quality_contents + .quality_contents{
    margin-top: calc((133vw / 1366) * 100);
  }
  .quality_outer{
    margin: 0 auto;
    width: calc((1000vw / 1366) * 100);
  }
  .quality_head_title {
    gap: 0 calc((43vw / 1366) * 100);
    font-size: calc((70vw / 1366) * 100);
    line-height: 1.0;
  }
  .quality_head_title::before,
  .quality_head_title::after{
    height: calc((1vw / 1366) * 100);
    width: calc((350vw / 1366) * 100);
  }
  .quality_head_copy{
    margin-top: calc((100vw / 1366) * 100);
    height: calc((50vw / 1366) * 100);
    font-size: calc((26vw / 1366) * 100);
  }
  .quality-detail {
    margin-top: calc((120vw / 1366) * 100);
  }
  .quality_head_copy + .quality-detail {
    margin-top: calc((80vw / 1366) * 100);
  }
  .quality-detai_block{
    margin-top: calc((40vw / 1366) * 100);
  }
  .quality_title-en{
    font-size: calc((50vw / 1366) * 100);
  }
  .quality_title-ja{
    font-size: calc((22vw / 1366) * 100);
    margin-top: calc((10vw / 1366) * 100);
  }
  .quality_kv{
    margin-top: calc((30vw / 1366) * 100);
  }
  .quality_desc{
    font-size: calc((22vw / 1366) * 100);
    line-height: calc((33vw / 1366) * 100);
    margin-top: calc((24vw / 1366) * 100);
  }
  .quality_desc_note{
    font-size: calc((14vw / 1366) * 100);
    line-height: calc((22vw / 1366) * 100);
    margin-top: calc((15vw / 1366) * 100);
  }

  .quality_itmes{
    margin-top: calc((32vw / 1366) * 100);
    gap: calc((32vw / 1366) * 100) calc((24vw / 1366) * 100);
  }
  .quality_itme{
    gap: calc((8vw / 1366) * 100) ;
    width: calc((232vw / 1366) * 100) ;
  }
  .quality_itme_row{
    gap: calc((32vw / 1366) * 100) calc((24vw / 1366) * 100);
  }
  .quality_itmes--wide{
    gap: calc((32vw / 1366) * 100) calc((20vw / 1366) * 100);
  }
  .quality_itmes--wide .quality_itme{
    width: calc((320vw / 1366) * 100) ;
  }
  .quality_itmes_name{
    font-size: calc((17vw / 1366) * 100);
    line-height: calc((26vw / 1366) * 100);
  }
  .quality_itmes_desc{
    font-size: calc((14vw / 1366) * 100);
    line-height: calc((22vw / 1366) * 100);
  }
  .quality_itmes_desc-note{
    font-size: calc((12vw / 1366) * 100);
  }

  .quality_note{
    font-size: calc((14vw / 1366) * 100);
    line-height: calc((22vw / 1366) * 100);
    margin-top: calc((32vw / 1366) * 100);
  }
  .quality_note--right{
    margin-top: calc((16vw / 1366) * 100);
  }

  .quality_leadarea{
    margin-top: calc((32vw / 1366) * 100);
    padding: calc((88vw / 1366) * 100) calc((128vw / 1366) * 100);
  }
  .quality_leadarea_copy{
    font-size: calc((26vw / 1366) * 100);
    line-height: calc((37vw / 1366) * 100);
  }
  .quality_leadarea_block{
    margin-top: calc((64vw / 1366) * 100);
    gap: 0 calc((32vw / 1366) * 100);
  }
  .quality_leadarea_block:first-child{
    margin-top: calc((48vw / 1366) * 100);
  }
  .quality_leadarea_desc{
    flex: 1;
  }
  .quality_leadarea_title{
    font-size: calc((17vw / 1366) * 100);
    line-height: calc((26vw / 1366) * 100);
  }
  .quality_leadarea_txt{
    margin-top: calc((16vw / 1366) * 100);
    font-size: calc((14vw / 1366) * 100);
    line-height: calc((22vw / 1366) * 100);
  }
  .quality_leadarea_kv{
    border: calc((1vw / 1366) * 100) solid #CECECE;
    padding: calc((8vw / 1366) * 100) 0 ;
    min-height: calc((180vw / 1366) * 100);
    width: calc((362vw / 1366) * 100);
  }
  .quality_leadarea-1 .quality_leadarea_kv img{
     width: calc((120vw / 1366) * 100);
  }
  .quality_leadarea-2 .quality_leadarea_kv img{
     width: calc((326vw / 1366) * 100);
  }

}
@media screen and (max-width: 767px) {
  .quality {
    padding: calc((80vw / 390) * 100) 0 ;
  }
  .quality_contents + .quality_contents{
    margin-top: calc((80vw / 390) * 100);
  }
  .quality_outer{
    margin: 0 auto;
    width: calc((342vw / 390) * 100);
  }
  .quality_head_title {
    font-size: calc((48vw / 390) * 100);
    gap: 0 calc((15vw / 390) * 100);
    justify-content: center;
  }
  .quality_head_title::before,
  .quality_head_title::after{
    display: none;
  }
  .quality_head_copy{
    margin-top: calc((56vw / 390) * 100);
    height: calc((76vw / 390) * 100);
    font-size: calc((18vw / 390) * 100);
    line-height: calc((26vw / 390) * 100);
  }

  .quality-detail{
    margin-top: calc((44vw / 390) * 100);
  }
  .quality-detai_block{
    margin-top: calc((32vw / 390) * 100);
  }
  .quality_title-en{
    font-size: calc((28vw / 390) * 100);
  }
  .quality_title-ja{
    font-size: calc((16vw / 390) * 100);
    margin-top: calc((10vw / 390) * 100);
  }
  .quality_kv{
    margin-top: calc((16vw / 390) * 100);
  }
  .quality_desc{
    font-size: calc((15vw / 390) * 100);
    line-height: calc((22vw / 390) * 100);
    margin-top: calc((10vw / 390) * 100);
  }
  .quality_desc_note{
    font-size: calc((12vw / 390) * 100);
    line-height: calc((22vw / 390) * 100);
    margin-top: calc((10vw / 390) * 100);
  }

  .quality_itmes{
    margin-top: calc((32vw / 390) * 100);
    gap: calc((24vw / 390) * 100) calc((16vw / 390) * 100);
  }
  .quality_itme{
    gap: calc((8vw / 390) * 100) 0;
    width: calc((100% - calc((16vw / 390) * 100)) / 2 );
  }
  .quality_itmes--wide{
    flex-direction: column;
    gap: calc((32vw / 390) * 100) 0;
  }
  .quality_itmes--wide .quality_itme{
    width: auto;
  }
  .quality_itme_row{
    flex-direction: column;
    width: calc((100% - calc((16vw / 390) * 100)) / 2 );
    gap: calc((24vw / 390) * 100) 0;
  }
  .quality_itme_row .quality_itme{
    width: auto;
  }
  .quality_itmes_name{
    font-size: calc((15vw / 390) * 100);
    line-height: calc((22vw / 390) * 100);
  }
  .quality_itmes_desc{
    font-size: calc((12vw / 390) * 100);
    line-height: calc((20vw / 390) * 100);
  }
  .quality_itmes_desc-note{
    font-size: calc((10vw / 390) * 100);
  }

  .quality_note{
    font-size: calc((10vw / 390) * 100);
    line-height: calc((16vw / 390) * 100);
    margin-top: calc((32vw / 390) * 100);
  }
  .quality_note--right{
    margin-top: calc((16vw / 390) * 100);
  }

  .quality_leadarea{
    margin-top: calc((16vw / 390) * 100);
    padding: calc((40vw / 390) * 100) calc((27vw / 390) * 100);
  }
  .quality_leadarea_copy{
    font-size: calc((18vw / 390) * 100);
    line-height: calc((26vw / 390) * 100);
  }
  .quality_leadarea_block{
    margin-top: calc((40vw / 390) * 100);
    flex-direction: column;
    gap: calc((18vw / 390) * 100) 0;
  }
  .quality_leadarea_block:first-child{
    margin-top: calc((32vw / 390) * 100);
  }
  .quality_leadarea_desc{
    flex: 1;
  }
  .quality_leadarea_title{
    font-size: calc((17vw / 390) * 100);
    line-height: calc((26vw / 390) * 100);
  }
  .quality_leadarea_txt{
    margin-top: calc((12vw / 390) * 100);
    font-size: calc((14vw / 390) * 100);
    line-height: calc((22vw / 390) * 100);
  }
  .quality_leadarea_kv{
    border: calc((1vw / 390) * 100) solid #CECECE;
    padding: calc((8vw / 390) * 100) 0 ;
    min-height: calc((143vw / 390) * 100);
  }
  .quality_leadarea-1 .quality_leadarea_kv img{
     width: calc((120vw / 390) * 100);
  }
  .quality_leadarea-2 .quality_leadarea_kv img{
     width: calc((260vw / 390) * 100);
  }
}
@media screen and (min-width: 768px) {
  .quality_head-ad .quality_head_title {
    font-size: calc((35vw / 1366) * 100);
  }
}
@media screen and (max-width: 767px) {
  .quality_head-ad .quality_head_title {
    font-size: calc((34vw / 390) * 100);
  }
}



.c-blank {
	/* display: none; */
}
.c-entrybtn-pageend{
  display: flex;
  justify-content: center;
  align-items: center;
}
.c-entrybtn-pageend a {
	margin: 0;
}
@media screen and (min-width: 768px) {
	.c-entrybtn-pageend {
    margin-top: calc((80vw / 1366) * 100);
    gap: 0 calc((16vw / 1366) * 100);
	}
}

@media screen and (max-width: 767px) {
	.c-entrybtn-pageend {
    flex-direction: column;
    margin-top: calc((56vw / 390) * 100);
    gap: calc((15vw / 390) * 100);
	}
	.c-entrybtn-pageend .c-entrybtn {
			width: calc((300vw / 390) * 100);
	}
}

/* c-imagephoto */
.c-imagephoto{
  position: absolute;
  color: #fff;
  font-weight: 600;
  box-sizing: border-box;
  display: flex;
  justify-content:flex-end;
  align-items:flex-end;
  flex-direction: column;
  width: auto;
}
.c-imagephoto.c-imagephoto-black{
  color: #251E1C;
}

@media screen and (min-width: 768px) {
  .c-imagephoto{
    line-height: 1;
    right: calc((15vw / 1366) * 100);
    bottom: calc((10vw / 1366) * 100);
    text-shadow: 0 0 calc((10vw / 1366) * 100) rgba(0, 0, 0, 0.87);
  }
  .quality_itmes_img .c-imagephoto{
    right: calc((5vw / 1366) * 100);
    bottom: calc((5vw / 1366) * 100);
    text-shadow: none;
  }
}
@media screen and (max-width: 767px) {
  .c-imagephoto{
    line-height: 1;
    right: calc((4vw / 390) * 100);
    bottom: calc((4vw / 390) * 100);
    text-shadow: 0 0 calc((10vw / 390) * 100) rgba(0, 0, 0, 0.87);
  }
  .quality_itmes_img .c-imagephoto{
    text-shadow: none;
  }
  .c-imagephoto span{
    font-size: calc((6vw / 390) * 100);
  }
}