*{padding: 0; margin: 0; list-style: none; line-height: 1.0em;}
a{text-decoration: none;}
img,table,iframe{border: none;}
body {
    background-color: #111;
    font-size: 12px;
    color: white;
}

nav{
    position: fixed;
    top: 0;
    z-index: 999;
    width: 100%;
    height: 40px;
    background-color: #111;
    overflow-x: scroll;
}
#indMenu{
    box-sizing: border-box;
    display: flex;
    flex-flow: row nowrap;
    width: 180%;
}
#indMenu li{
    width: 25%;
    height: 40px;    
    font-family: "Bebas Neue", sans-serif;
    font-size: 14px;
    position: relative;
}
#indMenu li a{
    display: flex;
    justify-content: center;
    align-items: center;
    height: 40px;
    color: #eee;
    border-right: solid 2px #222;
}


#indMain{
    position: relative;
    width: 100%;
    height: calc(100vh - 40px);
    margin-top: 40px;
    overflow: hidden;
    opacity: 0.5;
}
/*ノイズ導入*/
#indMain::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: calc(100vh - 40px);
    background-image: 
        radial-gradient(circle, rgba(255, 0, 0, 0.774) 1px, transparent 1px), /* 赤 */
        radial-gradient(circle, rgba(0, 72, 117, 0.674) 1px, transparent 1px), /* 青 */
        radial-gradient(circle, rgb(0, 255, 119) 1px, transparent 1px); /* 緑 */
    background-size: 3px 3px; /* ノイズの粒のサイズ */
    background-position: 
        0 0,
        1px 1px,
        2px 4px; /* ノイズの配置をランダムに見せる */
    opacity: 0.5; /* 透明度を設定 */
    pointer-events: none;
    z-index: 1;/* 要素によって調整が必要 */
}
.indSlide{
    position: absolute;
    top:0;
    left:0;
    width: 100%;
    height: calc(100vh - 40px);
    background-size: cover;
    background-repeat: no-repeat;    
}
.is01{
    background-image: url(../images/IndexFade/ind_bg1.jpg);
    background-position: bottom center;
    animation: slide-animation-01 40s infinite;
}
.is02{
    background-image: url(../images/IndexFade/ind_bg2.jpg);
    background-position: bottom center;
    animation: slide-animation-02 40s infinite;
}
.is03{
    background-image: url(../images/IndexFade/ind_bg6.jpg);
    background-position: top center;
    animation: slide-animation-03 40s infinite;
}
.is04{
    background-image: url(../images/IndexFade/ind_bg3.jpg);
    background-position: center center;
    animation: slide-animation-04 40s infinite;
}
.is05{
    background-image: url(../images/IndexFade/ind_bg5.jpg);
    background-position: center center;
    animation: slide-animation-05 40s infinite;
}

/* 各スライドのアニメーション（1枚あたり10秒表示） */
@keyframes slide-animation-01 {
    0% {opacity: 1; transform: scale(1.0);}
    18% {opacity: 1;}
    20% {opacity: 0; transform: scale(1.1);}
    80% {opacity: 0;}
    100% {opacity: 1; transform: scale(1.0);}
}
@keyframes slide-animation-02 {
    0% {opacity: 0;}
    18% {opacity: 0; transform: scale(1.1);}
    20% {opacity: 1;}
    38% {opacity: 1;}
    40% {opacity: 0; transform: scale(1.0);}
    100% {opacity: 0;}
}
@keyframes slide-animation-03 {
    0% {opacity: 0;}
    38% {opacity: 0; transform: scale(1.0);}
    40% {opacity: 1;}
    58% {opacity: 1;}
    60% {opacity: 0; transform: scale(1.1);}
    100% {opacity: 0;}
}
@keyframes slide-animation-04 {
    0% {opacity: 0;}
    58% {opacity: 0; transform: scale(1.1);}
    60% {opacity: 1;}
    78% {opacity: 1;}
    80% {opacity: 0; transform: scale(1.0);}
    100% {opacity: 0;}
}
@keyframes slide-animation-05 {
    0% {opacity: 0;}
    78% {opacity: 0; transform: scale(1.0);}
    80% {opacity: 1;}
    98% {opacity: 1;}
    100% {opacity: 0; transform: scale(1.1);}
}

footer{
    background: linear-gradient(rgba(85, 85, 85, 0), #111 90%);
    width: 100%;
    height: 50vh;
    position: fixed;
    bottom: 0;
    text-align: center;
}
#ind_ttl{
    font-family: "Anton", sans-serif;
    font-size: 48px;
    font-weight: normal;
    margin-top: -1%;
}
#ind_ttl span{
    display: inline-block;
    background: linear-gradient(45deg, #8c7537 0%, #dbb00b 45%, #fde79d 70%, #dbb10c 85%, #bc7f04 90% 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
}
#ind_subttl{
    font-family: "Roboto Condensed", sans-serif;
    font-size: 11px;
    color: #ccc;
    font-weight: normal;
    letter-spacing: 1px;
    margin-top: 1em;
}
#ind_btn{
    display: inline-block;
    font-family: "Oswald", sans-serif;
    font-size: 20px;
    font-weight: bold;
    letter-spacing: 1px;
    color: white;
    text-shadow: 0 0 10px #111;    
    background-color:#ad0e0e;
    padding: 0.5em 2em;
    border-radius: 5px;
    margin-top: 2em;
}