@charset "UTF-8";
.rough-equipment,
.rough-eco {
  width: 1024px;
  margin: 0 auto; }

/* -------------------------/ 

common

------------------------- */
.page-equipment,
.page-structure {
  background: #262626;
  /* Old browsers */
  background: -moz-linear-gradient(top, #262626 0%, #464646 100%);
  /* FF3.6-15 */
  background: -webkit-linear-gradient(top, #262626 0%, #464646 100%);
  /* Chrome10-25,Safari5.1-6 */
  background: linear-gradient(to bottom, #262626 0%, #464646 100%);
  /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */ }
  .page-equipment img,
  .page-structure img {
    width: 100%; }
  .page-equipment .page-link ul,
  .page-structure .page-link ul {
    margin: 0 auto 4rem;
    display: -webkit-box;
    display: -moz-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    justify-content: space-between;
    -webkit-justify-content: space-between; }
    @media screen and (max-width: 750px) {
      .page-equipment .page-link ul,
      .page-structure .page-link ul {
        margin: 0 auto 3.5rem; } }
    .page-equipment .page-link ul li,
    .page-structure .page-link ul li {
      width: 49%;
      font-size: 2.0rem;
      text-align: center;
      display: flex;
      align-items: stretch; }
      @media screen and (max-width: 750px) {
        .page-equipment .page-link ul li,
        .page-structure .page-link ul li {
          font-size: 1.6rem;
          line-height: 1.4; } }
      .page-equipment .page-link ul li a,
      .page-structure .page-link ul li a {
        width: 100%;
        display: flex;
        align-items: center;
        justify-content: center;
        border: 2px solid #A89F8D;
        background: none;
        color: #A89F8D;
        padding: 2rem 0;
        transition: all 0.3s ease 0s; }
        @media screen and (max-width: 750px) {
          .page-equipment .page-link ul li a,
          .page-structure .page-link ul li a {
            padding: 1rem 0; } }
        .page-equipment .page-link ul li a:hover,
        .page-structure .page-link ul li a:hover {
          background: #A89F8D;
          color: #FFF; }
      .page-equipment .page-link ul li.on a,
      .page-structure .page-link ul li.on a {
        border: 2px solid #A89F8D;
        background: #A89F8D;
        color: #FFF;
        position: relative;
        cursor: default; }
        .page-equipment .page-link ul li.on a:before,
        .page-structure .page-link ul li.on a:before {
          content: '';
          position: absolute;
          display: block;
          z-index: 1;
          border-style: solid;
          border-color: #A89F8D transparent;
          border-width: 10px 10px 0 10px;
          bottom: -10px;
          left: 50%;
          margin-left: -10px; }
        .page-equipment .page-link ul li.on a:hover,
        .page-structure .page-link ul li.on a:hover {
          opacity: inherit; }
  .page-equipment .page-link.bottom ul,
  .page-structure .page-link.bottom ul {
    margin: 4.5rem auto 0;
    padding-bottom: 4.5rem;
    display: -webkit-box;
    display: -moz-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    justify-content: space-between;
    -webkit-justify-content: space-between; }
    @media screen and (max-width: 750px) {
      .page-equipment .page-link.bottom ul,
      .page-structure .page-link.bottom ul {
        margin: 2.5rem auto 0;
        padding-bottom: 2.5rem; } }
    .page-equipment .page-link.bottom ul li.on a:before,
    .page-structure .page-link.bottom ul li.on a:before {
      content: '';
      position: absolute;
      display: block;
      z-index: 1;
      border-style: solid;
      border-color: #A89F8D transparent;
      border-width: 0px 10px 10px 10px;
      bottom: 100%;
      left: 50%;
      margin-left: -10px; }
  @media screen and (max-width: 750px) {
    .page-equipment .h3-wrap,
    .page-structure .h3-wrap {
      margin-bottom: 6rem; } }
  @media screen and (max-width: 750px) {
    .page-equipment .h3-wrap .h3-common,
    .page-equipment .h3-wrap .text,
    .page-structure .h3-wrap .h3-common,
    .page-structure .h3-wrap .text {
      width: 100%; } }
  .page-equipment .h4-title h4,
  .page-structure .h4-title h4 {
    font-size: calc(16px + ((20 - 16) * (100vw - 480px) / (1920 - 480)));
    padding-bottom: 1rem;
    margin-bottom: 1.5rem;
    border-bottom: 2px solid #A89F8D;
    color: #A89F8D;
    line-height: 1.6;
    font-weight: 600; }
  .page-equipment .h5-title h5,
  .page-structure .h5-title h5 {
    font-size: calc(14px + ((18 - 14) * (100vw - 480px) / (1920 - 480)));
    color: #7FB2E4;
    line-height: 1.6;
    font-weight: 600;
    margin-bottom: 1.2rem; }
    @media screen and (max-width: 750px) {
      .page-equipment .h5-title h5,
      .page-structure .h5-title h5 {
        margin-bottom: .5rem; } }
  .page-equipment .h5-sub-title h5,
  .page-structure .h5-sub-title h5 {
    font-size: calc(16px + ((20 - 16) * (100vw - 480px) / (1920 - 480)));
    color: #A89F8D;
    line-height: 1.6;
    font-weight: 600;
    margin-bottom: 1.2rem; }
    @media screen and (max-width: 750px) {
      .page-equipment .h5-sub-title h5,
      .page-structure .h5-sub-title h5 {
        margin-bottom: .5rem; } }
  .page-equipment .cap,
  .page-structure .cap {
    color: #FFF;
    font-size: calc(10px + ((12 - 10) * (100vw - 480px) / (1920 - 480)));
    margin-top: 1.5rem;
    line-height: 1.6; }
    .page-equipment .cap .cap-title,
    .page-structure .cap .cap-title {
      text-align: center;
      border: 1px solid #FFF;
      padding: .5rem;
      margin-bottom: .7rem; }
    .page-equipment .cap a,
    .page-structure .cap a {
      display: inline-block;
      color: #A89F8D;
      text-decoration: underline; }
      .page-equipment .cap a:hover,
      .page-structure .cap a:hover {
        color: #FFF; }
  .page-equipment .flex,
  .page-structure .flex {
    display: -webkit-box;
    display: -moz-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    justify-content: space-between;
    -webkit-justify-content: space-between;
    flex-wrap: wrap;
    flex-wrap: -webkit-wrap; }
    @media screen and (max-width: 750px) {
      .page-equipment .flex.sp-order,
      .page-structure .flex.sp-order {
        flex-direction: row; }
        .page-equipment .flex.sp-order .box:nth-child(1),
        .page-structure .flex.sp-order .box:nth-child(1) {
          order: 2; }
        .page-equipment .flex.sp-order .box:nth-child(2),
        .page-structure .flex.sp-order .box:nth-child(2) {
          order: 1; } }
    .page-equipment .flex .col-1,
    .page-structure .flex .col-1 {
      width: 100%; }
    .page-equipment .flex .col-2,
    .page-structure .flex .col-2 {
      max-width: 490px;
      width: 48%; }
      @media screen and (max-width: 1170px) {
        .page-equipment .flex .col-2,
        .page-structure .flex .col-2 {
          max-width: inherit; } }
      @media screen and (max-width: 750px) {
        .page-equipment .flex .col-2,
        .page-structure .flex .col-2 {
          width: 100%; } }
    .page-equipment .flex .col-3,
    .page-structure .flex .col-3 {
      max-width: 320px;
      width: 31.5%; }
      @media screen and (max-width: 1170px) {
        .page-equipment .flex .col-3,
        .page-structure .flex .col-3 {
          max-width: inherit; } }
      @media screen and (max-width: 750px) {
        .page-equipment .flex .col-3,
        .page-structure .flex .col-3 {
          width: 100%; } }
    .page-equipment .flex .col-4,
    .page-structure .flex .col-4 {
      width: 23%; }
      @media screen and (max-width: 750px) {
        .page-equipment .flex .col-4,
        .page-structure .flex .col-4 {
          max-width: inherit; } }
    .page-equipment .flex .flex-main,
    .page-structure .flex .flex-main {
      max-width: 600px;
      width: 60%; }
      @media screen and (max-width: 1170px) {
        .page-equipment .flex .flex-main,
        .page-structure .flex .flex-main {
          max-width: inherit;
          width: 60%; } }
      @media screen and (max-width: 750px) {
        .page-equipment .flex .flex-main,
        .page-structure .flex .flex-main {
          width: 100%; } }
    .page-equipment .flex .flex-sub,
    .page-structure .flex .flex-sub {
      max-width: 370px;
      width: 36%; }
      @media screen and (max-width: 1170px) {
        .page-equipment .flex .flex-sub,
        .page-structure .flex .flex-sub {
          max-width: inherit;
          width: 35%; } }
      @media screen and (max-width: 750px) {
        .page-equipment .flex .flex-sub,
        .page-structure .flex .flex-sub {
          width: 100%; } }
    .page-equipment .flex .box,
    .page-structure .flex .box {
      display: -webkit-box;
      display: -moz-box;
      display: -webkit-flex;
      display: -ms-flexbox;
      display: flex;
      flex-direction: column;
      flex-direction: -webkit-column; }
      .page-equipment .flex .box .text,
      .page-structure .flex .box .text {
        flex-grow: 1; }
      .page-equipment .flex .box .cap.flex-grow-first,
      .page-structure .flex .box .cap.flex-grow-first {
        flex-grow: 1; }
      .page-equipment .flex .box.flex-grow .text,
      .page-structure .flex .box.flex-grow .text {
        flex-grow: inherit; }
      .page-equipment .flex .box.flex-grow .flex-grow-first,
      .page-structure .flex .box.flex-grow .flex-grow-first {
        flex-grow: 1; }
      .page-equipment .flex .box.flex-grow .flex-grow-one-thirty,
      .page-structure .flex .box.flex-grow .flex-grow-one-thirty {
        flex-grow: 1.3; }
      .page-equipment .flex .box.flex-grow .flex-grow-one-point-four,
      .page-structure .flex .box.flex-grow .flex-grow-one-point-four {
        flex-grow: 0.6; }
    .page-equipment .flex .unit,
    .page-structure .flex .unit {
      display: -webkit-box;
      display: -moz-box;
      display: -webkit-flex;
      display: -ms-flexbox;
      display: flex;
      flex-direction: column;
      flex-direction: -webkit-column; }
      .page-equipment .flex .unit .text,
      .page-structure .flex .unit .text {
        flex-grow: 1; }
  .page-equipment .wrap-box .box,
  .page-structure .wrap-box .box {
    margin-bottom: 7rem; }
    .page-equipment .wrap-box .box .text,
    .page-structure .wrap-box .box .text {
      line-height: 1.8;
      font-size: calc(12px + ((14 - 12) * (100vw - 480px) / (1920 - 480)));
      color: #FFF; }
      .page-equipment .wrap-box .box .text.margin-top,
      .page-structure .wrap-box .box .text.margin-top {
        margin-top: 1.5rem; }
    .page-equipment .wrap-box .box .img,
    .page-structure .wrap-box .box .img {
      margin-top: 2rem; }
      .page-equipment .wrap-box .box .img.margin-top-0,
      .page-structure .wrap-box .box .img.margin-top-0 {
        margin-top: 0; }
      .page-equipment .wrap-box .box .img .img-cap-border,
      .page-structure .wrap-box .box .img .img-cap-border {
        position: absolute;
        bottom: .5rem;
        right: .5rem;
        font-size: calc(10px + ((12 - 10) * (100vw - 480px) / (1920 - 480)));
        background: #FFF;
        width: 60px;
        text-align: center;
        border: 1px solid #000;
        padding: .5rem 0;
        font-family: "Noto Sans CJK JP", "Noto Sans JP", "Yu Gothic Medium", "游ゴシック Medium", YuGothic, "游ゴシック体", sans-serif;
        color: #000; }
        @media screen and (max-width: 750px) {
          .page-equipment .wrap-box .box .img .img-cap-border,
          .page-structure .wrap-box .box .img .img-cap-border {
            font-size: 1.0rem;
            font-weight: 500;
            width: 45px; } }
    @media screen and (max-width: 750px) {
      .page-equipment .wrap-box .box .flex .col-2,
      .page-structure .wrap-box .box .flex .col-2 {
        width: 100%; } }
    @media screen and (max-width: 750px) {
      .page-equipment .wrap-box .box .flex .col-3,
      .page-structure .wrap-box .box .flex .col-3 {
        width: 100%; } }
    @media screen and (max-width: 750px) {
      .page-equipment .wrap-box .box .flex .col-4,
      .page-structure .wrap-box .box .flex .col-4 {
        width: 100%; } }
    .page-equipment .wrap-box .box .box-service,
    .page-structure .wrap-box .box .box-service {
      margin-bottom: 4rem; }

/* -------------------------/ 

unique

------------------------- */
/* -------------------------/ 
equipment
------------------------- */
.page-equipment {
  /* equipment--キッチン */
  /* equipment--洗面＆トイレ */
  /* equipment--その他 */
  /* equipment--エコロジー＆エコノミー */
  /* equipment--設計・仕様 */ }
  .page-equipment .page-title {
    background: url("../equipment/images/mv-page.jpg") no-repeat center; }
    @media screen and (max-width: 750px) {
      .page-equipment .page-title {
        background: url("../equipment/images/mv-page-sp.png") no-repeat center; } }
  .page-equipment .equipment-kitchen .wrap-box .box.box-cabinet .flex .flex-sub {
    max-width: 310px;
    width: 31%;
    position: relative;
    margin-top: 1rem; }
    @media screen and (max-width: 750px) {
      .page-equipment .equipment-kitchen .wrap-box .box.box-cabinet .flex .flex-sub {
        max-width: inherit;
        width: 100%; } }
    .page-equipment .equipment-kitchen .wrap-box .box.box-cabinet .flex .flex-sub .unit:nth-child(2) {
      position: absolute;
      bottom: 0; }
      @media screen and (max-width: 750px) {
        .page-equipment .equipment-kitchen .wrap-box .box.box-cabinet .flex .flex-sub .unit:nth-child(2) {
          position: inherit;
          bottom: inherit;
          margin-top: 6rem; } }
      .page-equipment .equipment-kitchen .wrap-box .box.box-cabinet .flex .flex-sub .unit:nth-child(2) .img .cap {
        margin-bottom: 1rem; }
  .page-equipment .equipment-kitchen .wrap-box .box.box-cabinet .flex .flex-main {
    max-width: 670px;
    width: 65%;
    position: relative; }
    @media screen and (max-width: 750px) {
      .page-equipment .equipment-kitchen .wrap-box .box.box-cabinet .flex .flex-main {
        max-width: inherit;
        width: 100%; } }
    .page-equipment .equipment-kitchen .wrap-box .box.box-cabinet .flex .flex-main .img {
      margin-top: 1rem; }
      .page-equipment .equipment-kitchen .wrap-box .box.box-cabinet .flex .flex-main .img .border {
        width: 70%;
        position: absolute;
        bottom: 3rem;
        left: -5rem; }
        @media screen and (max-width: 750px) {
          .page-equipment .equipment-kitchen .wrap-box .box.box-cabinet .flex .flex-main .img .border {
            position: inherit;
            bottom: inherit;
            left: inherit; } }
  .page-equipment .equipment-bath {
    margin-top: 12rem; }
    @media screen and (max-width: 750px) {
      .page-equipment .equipment-bath {
        margin-top: 9rem; } }
    .page-equipment .equipment-bath .wrap-box .box-bath .flex-main {
      max-width: 670px;
      width: 65%; }
      @media screen and (max-width: 750px) {
        .page-equipment .equipment-bath .wrap-box .box-bath .flex-main {
          max-width: inherit;
          width: 100%; } }
    .page-equipment .equipment-bath .wrap-box .box-bath .flex-sub {
      max-width: 310px;
      width: 31%; }
      @media screen and (max-width: 750px) {
        .page-equipment .equipment-bath .wrap-box .box-bath .flex-sub {
          max-width: inherit;
          width: 100%;
          margin-top: 4rem; } }
      .page-equipment .equipment-bath .wrap-box .box-bath .flex-sub .unit .flex li {
        width: 46%;
        margin-top: 3rem; }
    .page-equipment .equipment-bath .wrap-box .box-toilet .unit {
      margin-top: 4rem; }
  .page-equipment .equipment-other {
    margin-top: 12rem; }
    @media screen and (max-width: 750px) {
      .page-equipment .equipment-other {
        margin-top: 9rem; } }
    .page-equipment .equipment-other .wrap-box .box-service .flex {
      margin-bottom: 3rem; }
      @media screen and (max-width: 750px) {
        .page-equipment .equipment-other .wrap-box .box-service .flex .col-2 {
          width: 100%; } }
      .page-equipment .equipment-other .wrap-box .box-service .flex .unit .h5-title h5 {
        margin-bottom: .2rem; }
      .page-equipment .equipment-other .wrap-box .box-service .flex .unit:first-child .h5-title {
        margin-top: 3rem; }
        .page-equipment .equipment-other .wrap-box .box-service .flex .unit:first-child .h5-title:first-child {
          margin-top: 0; }
      @media screen and (max-width: 750px) {
        .page-equipment .equipment-other .wrap-box .box-service .flex .unit:last-child {
          margin-top: 3rem; } }
  .page-equipment .equipment-eco .wrap-box .box .h4-title .number {
    display: inline-block;
    border-radius: 50%;
    width: 30px;
    height: 30px;
    color: #FFF;
    text-align: center;
    background: #B50000;
    margin-right: 1rem;
    line-height: 1.5; }
    @media screen and (max-width: 750px) {
      .page-equipment .equipment-eco .wrap-box .box .h4-title .number {
        line-height: 1.8; } }
  .page-equipment .equipment-eco .wrap-box .box .flex .text {
    max-width: 330px;
    width: 65%; }
    @media screen and (max-width: 750px) {
      .page-equipment .equipment-eco .wrap-box .box .flex .text {
        max-width: inherit;
        flex: none; } }
  .page-equipment .equipment-eco .wrap-box .box .flex .logo {
    max-width: 145px;
    width: 30%; }
    @media screen and (max-width: 750px) {
      .page-equipment .equipment-eco .wrap-box .box .flex .logo {
        max-width: inherit; } }
  .page-equipment .equipment-plan {
    margin-top: 10rem; }
    @media screen and (max-width: 750px) {
      .page-equipment .equipment-plan {
        margin-top: 5rem; } }

/* -------------------------/ 
structure
------------------------- */
.page-structure {
  /* common */
  /* structure--耐震 */
  /* structure--構造 */
  /* structure--セキュリティ */ }
  .page-structure .page-title {
    background: url("../structure/images/mv-page.jpg") no-repeat center; }
    @media screen and (max-width: 750px) {
      .page-structure .page-title {
        background: url("../structure/images/mv-page-sp.png") no-repeat center; } }
  .page-structure .wrap-box .box .text.col-2,
  .page-structure .wrap-box .box .img.col-2 {
    margin-top: 0; }
    @media screen and (max-width: 750px) {
      .page-structure .wrap-box .box .text.col-2,
      .page-structure .wrap-box .box .img.col-2 {
        width: 100%;
        max-width: inherit; } }
  .page-structure .structure-antiquake .wrap-box .box.box-image .img {
    margin-top: 0; }
  .page-structure .structure-structure {
    margin-top: 10rem; }
    @media screen and (max-width: 750px) {
      .page-structure .structure-structure {
        margin-top: 5rem; } }
  .page-structure .structure-security .box-interphone .flex .text {
    max-width: 235px;
    width: 47%;
    flex: none; }
  .page-structure .structure-security .box-interphone .flex .img {
    max-width: 235px;
    width: 47%;
    margin-top: 0; }
  .page-structure .structure-security .box-enkaku {
    background: #F7EFE3;
    padding: 3rem 4rem; }
    @media screen and (max-width: 750px) {
      .page-structure .structure-security .box-enkaku {
        padding: 3rem; } }
    @media screen and (max-width: 750px) {
      .page-structure .structure-security .box-enkaku .flex-sub {
        margin-bottom: 4rem; } }
    .page-structure .structure-security .box-enkaku .flex-sub .text,
    .page-structure .structure-security .box-enkaku .flex-sub .cap {
      color: #000; }
    @media screen and (max-width: 750px) {
      .page-structure .structure-security .box-enkaku .flex-sub .img {
        width: 70%;
        margin: 2rem auto 0; } }

/* -------------------------/ 

TOPからのアンカーリンクのため

------------------------- */
#curtain,
#moving,
#internet-trash {
  padding-top: 100px;
  margin-top: -100px; }