@charset "UTF-8";
html {
  overflow-y: scroll; }

body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, code, form, fieldset, legend, input, textarea, p, blockquote, th, td {
  margin: 0;
  padding: 0; }

table {
  border-collapse: collapse;
  border-spacing: 0; }

fieldset, img {
  border: 0; }

img {
  vertical-align: bottom; }

address, caption, cite, code, dfn, em, strong, th, var {
  font-style: normal;
  font-weight: normal; }

li {
  list-style: none; }

caption, th {
  text-align: left; }

h1, h2, h3, h4, h5, h6 {
  font-size: 100%;
  font-weight: normal; }

q:before, q:after {
  content: ''; }

abbr, acronym {
  border: 0;
  font-variant: normal; }

input, textarea, select {
  font-family: inherit;
  font-size: inherit;
  font-weight: inherit; }

/*to enable resizing for IE*/
input, textarea, select {
  *font-size: 100%; }

/*because legend doesn't inherit in IE */
legend {
  color: #000; }

del, ins {
  text-decoration: none; }

/******************************************************

 TOP
 
******************************************************/
.lead {
  font-family: "游明朝", "YuMincho", "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
  -webkit-font-smoothing: antialiased;
  font-feature-settings: "palt";
  font-weight: 300;
  transform: rotate(0.001deg);
  line-height: 2.4;
  letter-spacing: 0.1rem;
  font-size: 0.9rem; }

.background {
  top: 0;
  left: 0;
  right: 0;
  height: 100%;
  position: fixed;
  background-position: center center;
  opacity: 0;
  -webkit-background-size: cover;
  background-size: cover;
  -webkit-transition: all 1.5s ease;
  transition: all 1.5s ease;
  z-index: -1;
  /*
  @media screen and (max-width: 768px){
      position: relative;
      height: 450px;
      margin-top: 40px;
  }
  @media screen and (max-width: 500px){
      height: 300px;
  }
  */ }

.show .background {
  opacity: 1; }

/*
.space{
    @media screen and (max-width: 768px){
        display: none;
    }
}
*/
.contents .wrap {
  padding: 0vh 0 60vh;
  position: relative;
  z-index: 2;
  /*
  @media screen and (max-width: 768px){
      padding: 40px 0;
  }
  */ }
.contents .wrap-top {
  height: 110vh;
  position: relative;
  z-index: 2;
  /*
  @media screen and (max-width: 768px){
      display: none;
  }
  */ }
  @media screen and (max-width: 768px) {
    .contents .wrap-top {
      height: 88vh; } }
.contents .wrap-bottom {
  height: 30vh;
  position: relative;
  z-index: 2;
  /*
  @media screen and (max-width: 768px){
      display: none;
  }
  */ }

/* design*/
.content01_bg {
  background-image: url("../images/concept/bg01.jpg"); }
  @media screen and (max-width: 500px) {
    .content01_bg {
      background-image: url("../images/concept/bg01-sp@2x.jpg"); } }

.content01_bg_opa {
  background-image: url("../images/concept/bg01_opa.jpg"); }
  @media screen and (max-width: 500px) {
    .content01_bg_opa {
      background-image: url("../images/concept/bg01_opa-sp@2x.jpg"); } }

.content02_bg {
  background-image: url("../images/concept/bg02.jpg"); }

.content02_bg_opa {
  background-image: url("../images/concept/bg02_opa.jpg"); }

/*
.content03_bg {background-image: url(../images/renovation/bg03@2x.jpg);}
.content03_bg_opa {background-image: url(../images/renovation/bg03_opa@2x.jpg);}
.content04_bg {background-image: url(../images/renovation/bg04@2x.jpg);}
.content04_bg_opa {background-image: url(../images/renovation/bg04_opa@2x.jpg);}
*/
/*
.content01_bg_opa,
.content02_bg_opa{
    @media screen and (max-width: 768px){
        display: none;
    }
}
*/
.txt-Box {
  margin: auto;
  max-width: 1000px;
  width: 90%;
  text-align: center; }
  .txt-Box .effect {
    transition: 0.5s ease; }

#bg01 .txt-Box {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%); }
  #bg01 .txt-Box h3, #bg01 .txt-Box h4 {
    font-family: "游明朝", "YuMincho", "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
    -webkit-font-smoothing: antialiased;
    font-feature-settings: "palt";
    font-weight: 300;
    transform: rotate(0.001deg);
    color: #fff; }
  #bg01 .txt-Box h3 {
    margin-bottom: 20px; }
    #bg01 .txt-Box h3 img {
      width: 100%;
      height: auto;
      max-width: 528px; }
  #bg01 .txt-Box h4 {
    font-size: 1.7rem;
    letter-spacing: 0.3rem; }
  @media screen and (max-width: 600px) {
    #bg01 .txt-Box h3 {
      font-size: 2.8rem; }
    #bg01 .txt-Box h4 {
      font-size: 1.2rem; } }

#bg01_opa .wrap {
  padding-top: 15rem; }
#bg01_opa .txt-Box {
  font-family: "游明朝", "YuMincho", "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
  -webkit-font-smoothing: antialiased;
  font-feature-settings: "palt";
  font-weight: 300;
  transform: rotate(0.001deg);
  color: #fff; }
  #bg01_opa .txt-Box .logo_w {
    max-width: 233px;
    margin: 12rem auto; }
    #bg01_opa .txt-Box .logo_w img {
      width: 100%;
      height: auto; }
    @media screen and (max-width: 600px) {
      #bg01_opa .txt-Box .logo_w {
        max-width: 200px; } }
  #bg01_opa .txt-Box h3 {
    font-size: 2.5rem;
    margin-bottom: 3rem;
    line-height: 1; }
  #bg01_opa .txt-Box h4 {
    font-size: 1.4rem;
    letter-spacing: 0.3rem;
    line-height: 1.5;
    margin-bottom: 3rem; }
  #bg01_opa .txt-Box p {
    color: #fff; }
  @media screen and (max-width: 600px) {
    #bg01_opa .txt-Box h3 {
      font-size: 2.2rem;
      line-height: 1.5; }
    #bg01_opa .txt-Box h4 {
      font-size: 1.3rem; } }

#bg02 .wrap-top {
  height: 80vh; }

#bg02_opa .wrap {
  padding-bottom: 40vh; }
#bg02_opa ul {
  position: relative;
  max-width: 458px;
  margin: 3rem auto 5rem; }
#bg02_opa img {
  width: 100%;
  height: auto; }
#bg02_opa li:nth-child(2),
#bg02_opa li:nth-child(3),
#bg02_opa li:nth-child(4),
#bg02_opa li:nth-child(5),
#bg02_opa li:nth-child(6) {
  position: absolute;
  top: 0;
  left: 0; }
#bg02_opa .sub_ttl {
  text-align: center;
  letter-spacing: 0.2rem;
  margin-bottom: 4rem; }
  #bg02_opa .sub_ttl::before, #bg02_opa .sub_ttl::after {
    content: "";
    display: block;
    height: 1px;
    max-width: 800px;
    margin: auto;
    background-size: 4px 1px;
    background-image: linear-gradient(to right, #000, #000 1px, transparent 1px, transparent 4px);
    background-repeat: repeat-x; }
  #bg02_opa .sub_ttl::before {
    margin-bottom: 0.7rem; }
  #bg02_opa .sub_ttl::after {
    margin-top: 0.7rem; }
#bg02_opa h4 {
  font-size: 1.7rem;
  letter-spacing: 0.3rem;
  font-family: "游明朝", "YuMincho", "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
  -webkit-font-smoothing: antialiased;
  font-feature-settings: "palt";
  font-weight: 300;
  transform: rotate(0.001deg);
  margin-bottom: 6rem; }
@media screen and (max-width: 600px) {
  #bg02_opa .wrap {
    padding-bottom: 30vh; }
  #bg02_opa .sub_ttl {
    font-size: 0.9rem; }
  #bg02_opa h4 {
    font-size: 1.4rem;
    line-height: 1.5; } }