@charset "UTF-8";
/* 変数
**************************************************/
/* MIX IN
**************************************************/
/* ファンクション
**************************************************/
/* TOPイメージ
**************************************************/
.fade-enter-active, .fade-leave-active {
  -webkit-transition: all 2s ease;
  transition: all 2s ease;
}

.fade-enter, .fade-leave-to {
  opacity: 0;
  -webkit-transform: scale(1.5);
  transform: scale(1.5);
}

.fader_outer {
  position: relative;
  margin: 0 auto;
  width: 100%;
  overflow: hidden;
  max-width: 100%;
  max-height: 700px;
}

@media (max-width: 640px) {
  .fader_outer {
    height: 230px;
  }
  .fader_outer + .page_section {
    margin-top: 30px;
  }
}

.fader_outer .fader_inner {
  position: absolute;
  top: 0;
  width: 100%;
}

.fader_outer .fade_img {
  -o-object-fit: cover;
  object-fit: cover;
  min-width: 600px;
  width: 100%;
}

@media (max-width: 640px) {
  .fader_outer .fade_img {
    position: relative;
  }
}

@media (max-width: 640px) {
  .fader_outer .fade_img[right] {
    left: calc(100vw - 550px);
  }
}

.fader_outer .fade_img.guide {
  visibility: hidden;
}

.fader_outer .top_main_copy {
  position: absolute;
  top: 0;
  left: 0px;
  z-index: 1;
  min-width: 600px;
  width: 100%;
  height: 100%;
}

.fader_outer .top_main_copy .top_main_copy_inner {
  height: 100%;
  margin: 0 auto;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  max-width: 1000px;
}

.fader_outer .top_main_copy .top_main_copy_inner img {
  display: block;
  height: 100%;
}

@media (max-width: 640px) {
  .fader_outer .top_main_copy {
    margin-left: -100px;
  }
}

/* ご成約状況
**************************************************/
.agreement {
  margin: 0;
  margin-bottom: 10px;
  padding: 35px 0;
  background-image: radial-gradient(#0A467C 20%, transparent 30%), radial-gradient(#0A467C 20%, transparent 30%);
  background-size: 16px 16px;
  background-position: 0 0, 8px 8px;
  background-color: #007F41;
}

.agreement .innerWidth_l {
  position: relative;
}

.agreement .num {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  position: absolute;
  bottom: -5px;
  left: 60px;
}

@media (min-width: 640px) and (max-width: 1080px) {
  .agreement .num {
    bottom: calc(-0.46296vw);
    left: calc(5.55556vw);
  }
}

@media (max-width: 640px) {
  .agreement .num {
    bottom: calc(-0.46296vw);
    left: calc(5.55556vw);
  }
}

.agreement .num .tens_place, .agreement .num .ones_place {
  color: #fff;
}

.agreement .num .tens_place img, .agreement .num .ones_place img {
  font-size: 70px;
  font-weight: bold;
  line-height: 1;
  height: 87px;
}

@media (min-width: 640px) and (max-width: 1080px) {
  .agreement .num .tens_place img, .agreement .num .ones_place img {
    height: calc(8.05556vw);
  }
}

@media (max-width: 640px) {
  .agreement .num .tens_place img, .agreement .num .ones_place img {
    height: calc(8.05556vw);
  }
}

/* モデルハウス見学会
**************************************************/
.mh_tour {
  margin-top: 0;
  padding: 50px 0;
  background: #530000;
  background: -webkit-gradient(linear, left bottom, left top, from(#530000), to(#bc191f));
  background: linear-gradient(0deg, #530000 0%, #bc191f 100%);
}

.mh_tour .innerWidth_l {
  text-align: center;
}

.mh_tour .base_img {
  position: relative;
}

.mh_tour .btn_group {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  position: absolute;
  bottom: 68px;
  left: 50%;
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%);
}

@media (min-width: 640px) and (max-width: 1080px) {
  .mh_tour .btn_group {
    bottom: calc(6.2963vw);
  }
}

@media (max-width: 640px) {
  .mh_tour .btn_group {
    bottom: calc(6.2963vw);
  }
}

/* 新着情報
**************************************************/
.news {
  margin-top: 0 !important;
  padding-top: 0 !important;
}

.news .page_title::after {
  background: url("/img/kiwaki/pagetitle_news_en.png") no-repeat;
  left: 0;
}

.news .innerWidth_l {
  text-align: center;
}

.news .news_item + .btn {
  margin-top: 60px;
}

@media (max-width: 640px) {
  .news .news_item + .btn {
    margin-top: 40px;
  }
}

/* メディア
**************************************************/
.media_img_fade-enter-active, .media_img_fade-leave-active {
  -webkit-transition: all 2s ease;
  transition: all 2s ease;
}

.media_img_fade-enter, .media_img_fade-leave-to {
  opacity: 0;
}

.media {
  margin-bottom: 0;
  padding-bottom: 60px;
  background: -webkit-gradient(linear, left top, left bottom, from(transparent), color-stop(70%, transparent), color-stop(50%, #f0f6ea), to(#f0f6ea));
  background: linear-gradient(180deg, transparent 0%, transparent 70%, #f0f6ea 50%, #f0f6ea 100%);
}

.media .page_title {
  margin-top: 0;
}

.media .page_title::after {
  background: url("/img/kiwaki/pagetitle_media_en.png") no-repeat;
  left: -5%;
}

.media .innerWidth_l {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  gap: 0 40px;
}

@media (max-width: 640px) {
  .media .innerWidth_l {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 40px 0;
  }
}

.media .media_image .photo_area .frame,
.media .facebook,
.media .instagram,
.media .video video {
  -webkit-box-shadow: 3px 3px 4px rgba(51, 51, 51, 0.25);
  box-shadow: 3px 3px 4px rgba(51, 51, 51, 0.25);
}

.media .media_image {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -webkit-box-flex: 1;
  -ms-flex: 1;
  flex: 1;
}

@media (min-width: 640px) and (max-width: 1080px) {
  .media .media_image {
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
  }
}

@media (max-width: 640px) {
  .media .media_image {
    -ms-flex-preferred-size: unset;
    flex-basis: unset;
  }
}

.media .media_image .text {
  font-size: 1.125em;
  margin-bottom: 40px;
}

@media (max-width: 640px) {
  .media .media_image .text {
    font-size: 1em;
    margin-bottom: 20px;
  }
}

.media .media_image .text p {
  line-height: 1.8;
}

.media .video {
  width: 100%;
  max-width: 660px;
  text-align: center;
  border: 1px solid #eee;
}

.media .video video {
  width: 100%;
  height: 100%;
  max-width: 625px;
  max-width: 660px;
  background-color: #fff;
  -webkit-filter: drop-shadow(0px 0px rgba(0, 0, 0, 0));
  filter: drop-shadow(0px 0px rgba(0, 0, 0, 0));
  outline: none;
  border: none;
}

.media .movie {
  position: relative;
  width: 100%;
  height: 0;
  padding-top: 56.25%;
  /*アスペクト比 16:9の場合の縦幅*/
}

.media .movie iframe {
  position: absolute;
  top: 0;
  right: 0;
  width: 100%;
  height: 100%;
}

.media .photo_area {
  position: relative;
  max-width: 580px;
  max-height: 320px;
  -webkit-transform: translateX(-16px) rotate(-5deg);
  transform: translateX(-16px) rotate(-5deg);
}

@media (max-width: 640px) {
  .media .photo_area {
    margin-bottom: 55.17%;
    /*画像のアスペクト比*/
  }
}

.media .photo_area .frame {
  position: relative;
}

.media .photo_area .frame div {
  position: absolute;
  top: 0;
  -webkit-box-shadow: 0 0 0 1px #dfdfdf, 3px 3px 4px rgba(51, 51, 51, 0.25) !important;
  box-shadow: 0 0 0 1px #dfdfdf, 3px 3px 4px rgba(51, 51, 51, 0.25) !important;
}

.media .photo_area .frame div::before {
  content: "";
  position: absolute;
  bottom: -20px;
  right: -20px;
  width: 100%;
  height: 100%;
  background-image: radial-gradient(rgba(0, 127, 65, 0.5) 30%, rgba(0, 0, 0, 0) 31%), radial-gradient(rgba(0, 127, 65, 0.5) 30%, rgba(0, 0, 0, 0) 31%);
  background-size: 6px 6px;
  background-position: 0 0, 3px 3px;
  z-index: -10;
}

.media .photo_area .frame div::after {
  content: "";
  position: absolute;
  right: 5px;
  left: auto;
  top: auto;
  bottom: 12px;
  width: 50%;
  height: 20%;
  -webkit-box-shadow: 0 15px 10px rgba(51, 51, 51, 0.6);
  box-shadow: 0 15px 10px rgba(51, 51, 51, 0.6);
  -webkit-transform: rotate(3deg);
  transform: rotate(3deg);
  z-index: -10;
}

.media .photo_area img {
  width: 100%;
  height: 100%;
  border: 10px solid #FFF;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

.media .facebook {
  background-color: #fff;
  max-width: 335px;
  width: 100%;
  min-height: 450px;
  position: relative;
}

.media .facebook iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.media .facebook .fb-page {
  width: 100%;
}

.media .facebook .fb-page span, .media .facebook .fb-page iframe {
  width: 360px;
  height: 450px !important;
}

@media (min-width: 640px) and (max-width: 1080px) {
  .media .facebook .fb-page span, .media .facebook .fb-page iframe {
    width: 300px;
  }
}

.media .instagram {
  max-width: 300px;
  width: 100%;
  min-height: 450px;
  position: relative;
}

.media .instagram iframe {
  margin: 0 !important;
  width: initial !important;
  max-width: initial !important;
  min-width: initial !important;
}

/* PR
**************************************************/
.pr .company {
  margin-top: 50px;
}

@media (max-width: 640px) {
  .pr .company {
    margin-top: 20px;
  }
}

.pr .mobile_pr_img {
  margin-bottom: 20px;
}

.pr .mobile_pr_img + p {
  line-height: 2;
}

.pr .slideshow {
  margin-top: 60px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  -ms-flex-flow: row nowrap;
  flex-flow: row nowrap;
  overflow: hidden;
}

@media (max-width: 640px) {
  .pr .slideshow {
    margin-top: 40px;
  }
}

.pr .slideshow + .company {
  margin-top: 30px;
}

@media (max-width: 640px) {
  .pr .slideshow + .company {
    margin-top: 20px;
  }
}

.pr .slideshow:hover .hooper-slide {
  -webkit-animation-play-state: paused;
  animation-play-state: paused;
}

.pr .hooper {
  height: 160px;
}

@media (max-width: 640px) {
  .pr .hooper {
    height: 180px;
  }
}

.pr .hooper-slide {
  width: 1600px !important;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

@media (max-width: 640px) {
  .pr .hooper-slide {
    width: 1000px !important;
  }
}

.pr .hooper-slide:first-child {
  -webkit-animation: 40s -20s linear infinite xScroll;
  animation: 40s -20s linear infinite xScroll;
}

@media (max-width: 640px) {
  .pr .hooper-slide:first-child {
    -webkit-animation: 40s -20s linear infinite xScroll_mobile;
    animation: 40s -20s linear infinite xScroll_mobile;
  }
}

.pr .hooper-slide:last-child {
  -webkit-animation: 40s linear infinite xScroll2;
  animation: 40s linear infinite xScroll2;
}

@media (max-width: 640px) {
  .pr .hooper-slide:last-child {
    -webkit-animation: 40s linear infinite xScroll2_mobile;
    animation: 40s linear infinite xScroll2_mobile;
  }
}

.pr .slide {
  width: 320px;
}

@media (max-width: 640px) {
  .pr .slide {
    width: 200px;
  }
}

.pr .img_mask {
  padding: 0 2px;
  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;
  height: 100%;
}

.pr .img_mask a {
  display: block;
  width: 100%;
  height: 100%;
}

.pr .img_mask img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
  object-fit: cover;
}

.pr .slideshow_title {
  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;
  width: 100%;
  height: 100%;
  background-color: #eee;
}

@-webkit-keyframes xScroll {
  0% {
    -webkit-transform: translateX(1600px);
    transform: translateX(1600px);
  }
  to {
    -webkit-transform: translateX(-1600px);
    transform: translateX(-1600px);
  }
}

@keyframes xScroll {
  0% {
    -webkit-transform: translateX(1600px);
    transform: translateX(1600px);
  }
  to {
    -webkit-transform: translateX(-1600px);
    transform: translateX(-1600px);
  }
}

@-webkit-keyframes xScroll2 {
  0% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
  to {
    -webkit-transform: translateX(-3200px);
    transform: translateX(-3200px);
  }
}

@keyframes xScroll2 {
  0% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
  to {
    -webkit-transform: translateX(-3200px);
    transform: translateX(-3200px);
  }
}

@-webkit-keyframes xScroll_mobile {
  0% {
    -webkit-transform: translateX(1000px);
    transform: translateX(1000px);
  }
  to {
    -webkit-transform: translateX(-1000px);
    transform: translateX(-1000px);
  }
}

@keyframes xScroll_mobile {
  0% {
    -webkit-transform: translateX(1000px);
    transform: translateX(1000px);
  }
  to {
    -webkit-transform: translateX(-1000px);
    transform: translateX(-1000px);
  }
}

@-webkit-keyframes xScroll2_mobile {
  0% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
  to {
    -webkit-transform: translateX(-2000px);
    transform: translateX(-2000px);
  }
}

@keyframes xScroll2_mobile {
  0% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
  to {
    -webkit-transform: translateX(-2000px);
    transform: translateX(-2000px);
  }
}

/* 特徴
**************************************************/