@charset "UTF-8";
/*//////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////

	変数設定

//////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////*
/* color */
/* trans */
/* breakpoint */
/* margin */
/*---------------------------*/
/* 変数設定 */
/*
@mixin default_padding { padding:$block_margin 0 !important; }
.block_padding { @include default_padding; }
.block_mt { margin-top:$block_margin !important; }
.block_mb { margin-bottom:$block_margin !important; }

//$breakpoint:1200px;
@mixin container { width:$breakpoint; margin:0 auto; }
.container { @include container }
*/
/* CSS Document */
/* --------------------------------------------------
	ユーザー画面用CSS
-------------------------------------------------- */
#vrBlock {
  text-align: center;
  margin-bottom: 60px; }
  #vrBlock blockquote {
    margin: 0 auto; }

#vrNav {
  width: 100%;
  border: 1px solid #ccc;
  overflow: hidden;
  margin: 60px 0; }
  #vrNav.column_1 {
    display: none; }
  #vrNav.column_2 li {
    width: 50%; }
  #vrNav.column_3 li {
    width: calc(100% / 3); }
  #vrNav.column_4 li {
    width: 25%; }
  #vrNav.column_5 li {
    width: 20%; }
  #vrNav li {
    float: left;
    text-align: center;
    padding: 10px;
    border-right: 1px solid #ccc;
    color: #333;
    transition: 0.35s cubic-bezier(0.2, 0.9, 0.7, 1);
    cursor: pointer; }
  #vrNav li:last-child {
    border-right: none; }
  #vrNav li.active {
    color: #fff;
    background: #cc0000; }
  #vrNav li:hover {
    color: #fff;
    background: #cc0000; }

/* VR */
#vrBlock {
  margin-bottom: 120px; }

/* 動画 */
#vrMovieBlock {
  display: none;
  margin-bottom: 120px; }

/* 間取り */
#vrFloorPlanBlock {
  display: none;
  margin-bottom: 120px; }
  #vrFloorPlanBlock li {
    margin-bottom: 60px; }
  #vrFloorPlanBlock li:last-child {
    margin-bottom: 0; }

/* gallery */
#vrGalleryBlock {
  display: none;
  margin-bottom: 60px;
  /* type_1 */
  /* type_2 */
  /* type_3 */ }
  #vrGalleryBlock .gallery_list {
    overflow: hidden; }
    #vrGalleryBlock .gallery_list li {
      margin-bottom: 20px; }
      #vrGalleryBlock .gallery_list li img {
        width: 100%; }
      #vrGalleryBlock .gallery_list li .caption {
        margin: 10px; }
  #vrGalleryBlock .gallery_list.type_1 li:nth-child(1) {
    width: 100%; }
  #vrGalleryBlock .gallery_list.type_1 li:nth-child(2) {
    width: 100%; }
  #vrGalleryBlock .gallery_list.type_1 li:nth-child(3) {
    width: calc(50% - 10px);
    float: left; }
  #vrGalleryBlock .gallery_list.type_1 li:nth-child(4) {
    width: calc(50% - 10px);
    float: right; }
  #vrGalleryBlock .gallery_list.type_1 li:nth-child(5) {
    width: calc(50% - 10px);
    float: right; }
  #vrGalleryBlock .gallery_list.type_1 li:nth-child(6) {
    width: 100%;
    clear: both; }
  #vrGalleryBlock .gallery_list.type_1 li:nth-child(7) {
    width: calc(50% - 10px);
    float: left; }
  #vrGalleryBlock .gallery_list.type_1 li:nth-child(8) {
    width: calc(50% - 10px);
    float: right; }
  #vrGalleryBlock .gallery_list.type_1 li:nth-child(9) {
    width: calc(50% - 10px);
    float: left;
    clear: both; }
  #vrGalleryBlock .gallery_list.type_1 li:nth-child(10) {
    width: calc(50% - 10px);
    float: right; }
  #vrGalleryBlock .gallery_list.type_2 li:nth-child(1) {
    width: 100%; }
  #vrGalleryBlock .gallery_list.type_2 li:nth-child(2) {
    width: calc(50% - 10px);
    float: left; }
  #vrGalleryBlock .gallery_list.type_2 li:nth-child(3) {
    width: calc(50% - 10px);
    float: right; }
  #vrGalleryBlock .gallery_list.type_2 li:nth-child(4) {
    width: 100%;
    clear: both; }
  #vrGalleryBlock .gallery_list.type_2 li:nth-child(5) {
    width: calc((100% - 40px)/3);
    float: left;
    margin-right: 20px; }
  #vrGalleryBlock .gallery_list.type_2 li:nth-child(6) {
    width: calc((100% - 40px)/3);
    float: left; }
  #vrGalleryBlock .gallery_list.type_2 li:nth-child(7) {
    width: calc((100% - 40px)/3);
    float: right; }
  #vrGalleryBlock .gallery_list.type_2 li:nth-child(8) {
    width: calc((100% - 40px)/3);
    float: left;
    margin-right: 20px;
    clear: both; }
  #vrGalleryBlock .gallery_list.type_2 li:nth-child(9) {
    width: calc((100% - 40px)/3);
    float: left; }
  #vrGalleryBlock .gallery_list.type_2 li:nth-child(10) {
    width: calc((100% - 40px)/3);
    float: right; }
  #vrGalleryBlock .gallery_list.type_3 li:nth-child(1) {
    width: calc(50% - 10px);
    float: left; }
  #vrGalleryBlock .gallery_list.type_3 li:nth-child(2) {
    width: calc(50% - 10px);
    float: right; }
  #vrGalleryBlock .gallery_list.type_3 li:nth-child(3) {
    width: calc((100% - 40px)/3);
    float: left;
    margin-right: 20px;
    clear: both; }
  #vrGalleryBlock .gallery_list.type_3 li:nth-child(4) {
    width: calc((100% - 40px)/3);
    float: left; }
  #vrGalleryBlock .gallery_list.type_3 li:nth-child(5) {
    width: calc((100% - 40px)/3);
    float: right; }
  #vrGalleryBlock .gallery_list.type_3 li:nth-child(6) {
    width: calc(50% - 10px);
    float: left;
    clear: both; }
  #vrGalleryBlock .gallery_list.type_3 li:nth-child(7) {
    width: calc(50% - 10px);
    float: right; }
  #vrGalleryBlock .gallery_list.type_3 li:nth-child(8) {
    width: calc((100% - 40px)/3);
    float: left;
    margin-right: 20px;
    clear: both; }
  #vrGalleryBlock .gallery_list.type_3 li:nth-child(9) {
    width: calc((100% - 40px)/3);
    float: left; }
  #vrGalleryBlock .gallery_list.type_3 li:nth-child(10) {
    width: calc((100% - 40px)/3);
    float: right; }

/* お客様ストーリー */
#vrStoryBlock {
  display: none; }
  #vrStoryBlock li {
    margin-bottom: 120px; }
    #vrStoryBlock li h4 {
      font-size: 1.5rem;
      margin-bottom: 10px; }
    #vrStoryBlock li p,
    #vrStoryBlock li .img_box,
    #vrStoryBlock li .movie_box {
      margin-bottom: 30px; }
    #vrStoryBlock li .img_box img {
      width: 100%; }

/* adjust_box */
.adjust_box {
  position: relative;
  width: 100%;
  height: auto;
  margin: 0 !important;
  overflow: hidden; }
  .adjust_box.box_1x1:before {
    content: "";
    display: block;
    padding-top: 100%; }
  .adjust_box.box_16x9:before {
    content: "";
    display: block;
    padding-top: 56%; }
  .adjust_box .inner {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    overflow: hidden; }
    .adjust_box .inner img {
      width: 100%;
      height: auto; }
  .adjust_box iframe {
    width: 100%; }

.img_box img {
  width: 100%; }

@media screen and (max-width: 768px) {
  #vrBlock {
    margin-bottom: 30px; }

  #vrNav {
    margin: 30px 0; }
    #vrNav.column_1 {
      display: none; }
    #vrNav.column_2 li {
      width: 50%; }
    #vrNav.column_3 li {
      width: 50%; }
    #vrNav.column_4 li {
      width: 50%; }
    #vrNav.column_5 li {
      width: 50%; }
    #vrNav li {
      padding: 10px;
      border: none;
      border-bottom: 1px solid #ccc; }
    #vrNav li:last-child {
      border-bottom: none; }
    #vrNav li:nth-child(odd) {
      border-right: 1px solid #ccc; }
    #vrNav.column_2 li:last-child {
      border-bottom: 1px solid #ccc; }
    #vrNav.column_4 li:nth-child(3) {
      border-bottom: none; }

  #vrBlock {
    margin-bottom: 30px; }

  #vrMovieBlock {
    margin-bottom: 30px; }

  #vrGalleryBlock {
    margin-bottom: 30px; }

  /* gallery */
  .gallery_list li {
    margin-bottom: 10px; }
    .gallery_list li .caption {
      margin: 5px; }

  /* type_1 */
  .gallery_list.type_1 li:nth-child(3) {
    width: calc(50% - 5px); }
  .gallery_list.type_1 li:nth-child(4) {
    width: calc(50% - 5px); }
  .gallery_list.type_1 li:nth-child(5) {
    width: calc(50% - 5px); }
  .gallery_list.type_1 li:nth-child(7) {
    width: calc(50% - 5px); }
  .gallery_list.type_1 li:nth-child(8) {
    width: calc(50% - 5px); }
  .gallery_list.type_1 li:nth-child(9) {
    width: calc(50% - 5px); }
  .gallery_list.type_1 li:nth-child(10) {
    width: calc(50% - 5px); }

  /* type_2 */
  .gallery_list.type_2 li:nth-child(1) {
    width: 100%; }
  .gallery_list.type_2 li:nth-child(2) {
    width: 100%; }
  .gallery_list.type_2 li:nth-child(3) {
    width: 100%; }
  .gallery_list.type_2 li:nth-child(4) {
    width: 100%; }
  .gallery_list.type_2 li:nth-child(5) {
    width: calc(50% - 5px);
    float: left;
    margin-right: 10px; }
  .gallery_list.type_2 li:nth-child(6) {
    width: calc(50% - 5px);
    float: right;
    margin-right: 0; }
  .gallery_list.type_2 li:nth-child(7) {
    width: calc(50% - 5px);
    float: left;
    margin-right: 10px; }
  .gallery_list.type_2 li:nth-child(8) {
    width: calc(50% - 5px);
    float: right;
    margin-right: 0;
    clear: none; }
  .gallery_list.type_2 li:nth-child(9) {
    width: calc(50% - 5px);
    float: left;
    margin-right: 10px; }
  .gallery_list.type_2 li:nth-child(10) {
    width: calc(50% - 5px);
    float: right;
    margin-right: 0; }

  /* type_3 */
  .gallery_list.type_3 li:nth-child(1) {
    width: 100%; }
  .gallery_list.type_3 li:nth-child(2) {
    width: 100%; }
  .gallery_list.type_3 li:nth-child(3) {
    width: calc(50% - 5px);
    float: left;
    margin-right: 10px; }
  .gallery_list.type_3 li:nth-child(4) {
    width: calc(50% - 5px);
    float: right;
    margin-right: 0; }
  .gallery_list.type_3 li:nth-child(5) {
    width: 100%; }
  .gallery_list.type_3 li:nth-child(6) {
    width: 100%; }
  .gallery_list.type_3 li:nth-child(7) {
    width: calc(50% - 5px);
    float: left;
    margin-right: 10px; }
  .gallery_list.type_3 li:nth-child(8) {
    width: calc(50% - 5px);
    float: right;
    margin-right: 0;
    clear: none; }
  .gallery_list.type_3 li:nth-child(9) {
    width: calc(50% - 5px);
    float: left;
    margin-right: 10px; }
  .gallery_list.type_3 li:nth-child(10) {
    width: calc(50% - 5px);
    float: right;
    margin-right: 0; } }