/*a{
  pointer-events: none;
}*/
#mv {
  width: 100%;
  position: relative;
  top: 0;
  left: 0;
  overflow: hidden;
  height: 100vh;
}
#mv h1{
  font-size:400%;
    bottom: 2vw;
}
#mv p{
  font-size:50%;
}
.mv-bg {
  width: 100%;
  height: 100%;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
  opacity: 0;
  position: absolute;
  top: 0;
  left: 0;
}
#mv01 {
  z-index: 20;
  animation: anime 20s 0s 1;
}
#mv02 {
  z-index: 18;
  animation: anime2 45s 0s 1;
}
#mv03 {
  z-index: 16;
  animation: anime3 70s 0s 1;
}
#mv04 {
  z-index: 14;
  animation-delay: 95s;
  opacity: 1;
}

@keyframes anime {
  0% { opacity: 1; }
  20% { opacity: 1; }
  50% { opacity: 0; }
  /*100% { transform: scale(1.2); }*/
}
@keyframes anime2 {
  0% { opacity: 1; }
  20% { opacity: 1; }
  30% { opacity: 0; }
  /*100% { transform: scale(1.2); }*/
}
@keyframes anime3 {
  0% { opacity: 1; }
  20% { opacity: 1; }
  30% { opacity: 0; }
  /*100% { transform: scale(1.2); }*/
}
#news a:hover{
  text-decoration: none;
}
.greeting{
  background-position:bottom center;
  background-repeat:no-repeat; 
}
#greeting h1 {
    display: inline-block;
    position: relative;
  text-shadow:1px 1px 0 #FFF, -1px -1px 0 #FFF,
              -1px 1px 0 #FFF, 1px -1px 0 #FFF,
              0px 1px 0 #FFF,  0-1px 0 #FFF,
              -1px 0 0 #FFF, 1px 0 0 #FFF;
}
/*#greeting h1:before {
    content: '';
    display: inline-block;
    position: absolute;
    bottom: -10px;
    left: 50%;
    transform: translateX(-50%);
    width: 80px;
    height: 4px;
    background-color:#e06e10;
}*/

#greeting ul li{
  border-bottom:dashed 1px #ccc;
  line-height: 2em;
}
#banner{
  background-size: cover;
  background-position: top;
  position: relative;
}
#banner:before{
  content: "";
  position: absolute;
  top:0;
  left:0;
  width: 100%;
  height: 100%;
  background-color: rgb(255,255,255,50%);
  background-image: linear-gradient(180deg, transparent 0 60%, #FFF 100%);
}
#banner .contents_bar{
}
.banner_img {
  color:#6f532a;
  height: 22vw;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
}

#banner h1,
#banner h2 {
  /*position: absolute;
  width: 100%;
  left: 0;*/
}
#banner h1 {
    width: 70%;
    margin: -25px auto 20px auto;
  color: #fff;
  font-size: 160%;
  transition: 0.2s ease-out;
  background-color: #e20000;
}
#banner h1 span {
    border-top: solid 1px #fff;
  border-radius: .3vw;
  color: #fff;
  transition: 0.2s ease-out;
}
#banner h2 {
  font-size: 100%;
  bottom: 0;
  transition: 0.2s ease-out;
}
#banner a:hover h1 {
  top: -1.3vw;
  color: #FFDD01;
}
#banner a:hover h1 span {
  color: #FFDD01;
}
#banner a:hover h2 {
  bottom: .5vw;
}
#banner .container{
  height: 40vw;
  position: relative;
}
#banner .container .row{
  position: absolute;
    width: 100%;
    top: 5vw;
}
.bnr-line {
  content: "";
  position: absolute;
  z-index: 123;
  border: solid 1px #666;
  display: block;
  transition: 0.2s ease-out;
}
.vt,
.vb {
  border-width: 0 0 0 1px;
  height: 19vw;
}
.hr,
.hl {
  border-width: 1px 0 0 0;
  width: 33vw;
}
.vt {
  right: 6%;
  bottom: -20vw;
}
.bnr-link:hover .vt {
  right: 6%;
  bottom: 17%;
}
.vb {
  left: 36%;
  top: 20vw;
}
.bnr-link:hover .vb {
  left: 36%;
  top: 55%;
}
.hl {
  right: -33vw;
  bottom: 17%;
}
.bnr-link:hover .hl {
  right: 6%;
  bottom: 17%;
}
.hr {
  left: -33vw;
  top: 55%;
}
.bnr-link:hover .hr {
  left: 36%;
  top: 55%;
}
a.btn-fullhouse:hover{
  color: #fff;
}
/*#news ul {
  height: 20vw;
  overflow: auto;
}*/
#greeting{
  position: relative;
}
#greeting .greeting_area{
  position: absolute;
  top: 20%;
  right: 0;
}
#greeting .greeting_textarea{
  line-height:1.6;
  background-color:rgb(255,255,255,70%);
}
.slider {/*横幅94%で左右に余白を持たせて中央寄せ*/
   width:94%;
    margin:0 auto;
}

.slider img {
    width:100%;/*スライダー内の画像を横幅100%に*/
    height:auto;
    padding: 5px;
    box-shadow: 0 0 5px #ccc;
}

/*slickのJSで書かれるタグ内、スライド左右の余白調整*/

.slider .slick-slide {
    margin:0 10px;
}

/*矢印の設定*/

/*戻る、次へ矢印の位置*/
.slick-prev, 
.slick-next {
    position: absolute;/*絶対配置にする*/
    top: 42%;
    cursor: pointer;/*マウスカーソルを指マークに*/
    outline: none;/*クリックをしたら出てくる枠線を消す*/
    border-top: 2px solid #666;/*矢印の色*/
    border-right: 2px solid #666;/*矢印の色*/
    height: 15px;
    width: 15px;
}

.slick-prev {/*戻る矢印の位置と形状*/
    left: -1.5%;
    transform: rotate(-135deg);
}

.slick-next {/*次へ矢印の位置と形状*/
    right: -1.5%;
    transform: rotate(45deg);
}

/*ドットナビゲーションの設定*/

.slick-dots {
    text-align:center;
  margin:20px auto 0 auto;
}

.slick-dots li {
    display:inline-block;
  margin:0 5px;
}

.slick-dots button {
    color: transparent;
    outline: none;
    width:8px;/*ドットボタンのサイズ*/
    height:8px;/*ドットボタンのサイズ*/
    display:block;
    border-radius:50%;
    background:#ccc;/*ドットボタンの色*/
}

.slick-dots .slick-active button{
    background:#333;/*ドットボタンの現在地表示の色*/
}
@media (max-width: 1199px){
  
}

@media (max-width: 991px){
  
}

@media (max-width: 767px){
  #mv {
    height: 30vh;
  }
  #greeting header {
      font-size: 2vw;
  }
  .greeting {
    height: 90vw;
  }
  #greeting ul li,
  #greeting p{
    font-size: 2.6vw;
  }
  #banner > div {
    margin-bottom: 10vw;
  }
  #banner img {
    height: 55vw;
  }
  #banner h1 {
    top: -3.5vw;
  }
  .btn-fullhouse {
    width: 60vw;
  }
  #news ul {
    height: 40vw;
  }
  #banner .container {
    height: auto;
  }
  #banner .container .row{
    position: relative;
  }
  .banner_img {
    height: 50vw;
  }
}

@media (max-width: 575px){
  #greeting header{
    font-size:2.8vw;
  }
  #greeting ul li,
  #greeting p{
    font-size: 3.5vw;
  }
}


