@import url('https://fonts.googleapis.com/css2?family=Zilla+Slab:wght@400;500;600&display=swap');
.en{
    font-family: 'Zilla Slab', serif!important;
    font-weight:500;
}
.Russo,.font1{
    font-family: 'Zilla Slab', serif!important;
    font-weight:600;    
}    
.linkStyle{color: #f48b00;}
#header{background-color: rgba(255,255,255,0.3);}
#vegas{height:100vh;}
.t_before{
    height:100vh!important;
    left: -300px!important;
}
.t_after{
    height:100vh!important;
    right: -300px!important;
    
}

.video{
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    overflow: hidden;
    border: none;
    padding: 0;
    margin: 0;
    }
/*---背景アニメーション------------------------------------*/ 
    
.bg_roop{position:relative;}
/*街並みループ*/
#roop {
    width: 100%;
    height: 150px;
    background: url(./Dup/img/bg.png) repeat-x;
    background-position: 0 0;
    -webkit-animation: bgroop 30s linear infinite;
    animation: bgroop 30s linear infinite;
}
@-webkit-keyframes bgroop {
    from {
        background-position: -1956px  0;
    }
    to {
        background-position: 0 0;
    }
}
@keyframes bgroop {
    from {
        background-position: -1956px 0;
    }
    to {
        background-position: 0 0;
    }
}

/*車がガタガタ*/
.fluffy {
  background-image:url(./Dup/img/car.png);
  width: 215px;
  height: 115px;
  animation: fluffy1 2s ease infinite;
  position:absolute;
  top:30px;
  left:0;
  right:0;
  margin:auto;
}

@keyframes fluffy1 {
  0% { transform:translateY(0) }
  5% { transform:translateY(0) }
  10% { transform:translateY(0) }
  20% { transform:translateY(-5px) }
  25% { transform:translateY(0) }
  30% { transform:translateY(-5px) }
  50% { transform:translateY(0) }
  100% { transform:translateY(0) }
}
/*-------------------------------------------------*/

#top_message{margin-bottom:100px;}
#top_message p:first-of-type{font-size:6rem;}


#top_contents1 h3::before, #top_contents2 h3::before{
    font-family: 'Zilla Slab', serif!important;
    font-weight:600;   
    color:#fff;
}
#top_contents3{
    background:url(./Dup/img/bg2.png) transparent no-repeat left 20px top;
    background-size:contain;
}
#top_contents3 .item1{text-align:center;}
#top_contents3 .item1 img{width:auto;}
#top_contents3 h3{
    font-size: 2rem;
    font-weight: bold;
}
/*スクロールでアンダーライン*/
.Text-Span {
  position: relative;
  z-index: 1;
}
.Text-Span:after {
  content: '';
  position: absolute;
  left: 0;
  bottom: -10px;
  width: 0%;
  height: 5px;
  background: #f48b00;
  z-index: -1;
  transition: all 1s;
}
.Text-Span.isActive:after {
  width: 100%;
}

/*下からフェードイン*/
 .fadein {
  opacity: 0;
  transform : translate(0, 50px);
  transition : all 1500ms;
}

.fadein.scrollin{
  opacity: 1;
  transform: translate(0, 0);
}

#top_cms .font1{font-size:5rem;}
#top_cms .top_cms_sec{border-bottom:1px dotted #333;}

/*----------------under page-----------------------------------------*/
footer{background-color:#333!important;}
#footer {border-bottom: 1px solid #fff;}
.footer_sitemap {border-left: 1px solid #fff;}
#filter_white {background-color: rgba(228, 243, 247, 0.5);}
#filter_white h2{color:#333;}



/* ---------- タブレット ---------- */
@media screen and (max-width: 768px){
.l-header__toggle{top: 20px;}
#header {
    background-color: rgba(255,255,255,0.1);
    border-bottom: 0;
}
#vegas{height:40vh;}
#top_message{padding-top:50px;}
#top_message p:first-of-type,#top_cms .font1 {font-size: calc(5rem - 5px);}
#top_contents1 h3::before, #top_contents2 h3::before{
    color: #f48b00;
    top: -120%;
}
#top_contents1,#top_contents2{padding-top:40px;}
.cate_list li{width:50%;}
}

/* ---------- スマートフォン ---------- */
@media screen and (max-width: 667px){
.l-header__toggle {top: 15px;}
#vegas{margin-bottom:50px;}
#top_message p:first-of-type, #top_cms .font1 {font-size: calc(4rem - 5px);}
#top_message h2 {font-size: 22px;}
#top_contents3{background-size: auto;}
#top_contents3 h3 {font-size: calc(1rem + 5px);}
.cate_list li{width:100%;}
}

/* ---------- IEの処理 ---------- */
@media all and (-ms-high-contrast: none){

}