/* menu */
body {
    background: #000;
    margin: 0;
    font-family: a-otf-ryumin-pr6n,serif;
    font-style: normal;
    font-weight: 300;
    color:#fff;
}
ul,li {
    list-style: none;
    padding: 0;
    margin: 0;
} 
a {
    text-decoration: none;
    z-index:50;
}
html { font-size: calc(100vw / 32); }
@media only screen and (min-width: 751px) { html { font-size: 16px; } }

#particles-js,#particles-js_cover { 
    position:fixed;
    width: 100%;
    height: 100%;
    background-color: transparent; 
    background-repeat: no-repeat; 
    background-size: cover;
    background-position: 50% 50%;
    z-index: -5;
}
#loading {
  position: fixed;
  width: 100%;
  height: 100%;
  text-align: center;
  background-color: #000;
  z-index: 9999;
  overflow: hidden;
}
.displaynone {
  display: none;
}

#main {
    display: flex;
}
#sidenav {
    width: 220px;
    position: absolute;
}
#fixedback {
    position: fixed;
    z-index: -10;
    display: block;
    width: 100%;
    min-width: 1180px;
    height: 100%;
    margin-left: 110px;
}
.contents {
    width: 100%;
    margin-left:220px;
}

h1 img {
    width:185px;
    margin-left:15px;
}
h2 {
    color: #fff;
    font-size: 50px;
    margin: 90px 0 70px;;
    text-align: center;
    font-weight: 400;
    font-family: garamond-premier-pro, serif;
}
nav {
    width: 220px;
}
nav .onair {
    font-size: 55px;
    color: #D3B37C;
    margin-left: 25px;
    line-height: 0.6em;
    font-family: garamond-premier-pro, serif;
}
nav .onair span {
    font-size: 37px;
}
nav .menu {
    margin: 20px 0 0 30px;
}
nav li {
    margin-bottom: 15px;
    font-family: garamond-premier-pro, serif;
}
nav a {
    color:#fff;
}
nav .menu li a {
    padding: 4px 10px 0 0;
    text-decoration: none;
    font-size: 18px;
    line-height: 25px;
    position: relative;
    display: inline-block;
    background-color: transparent;
    z-index: 10;
}
nav .menu li a:before {
    content: "";
    position: absolute;
    display: block;
    background-color: #D3B37C;
    width: 0;
    top: 0;
    bottom: 0;
    bottom: 0;
    left: -5px;
    -webkit-transition: .4s ease 0s;
    transition: .4s ease 0s;
    z-index: -1;
}
nav .menu li a:hover {
    color: #000;
    text-decoration: none;
}
nav .menu li a:hover:before {
    width: 100%;
}
.share {
    margin: 50px auto 0;
    text-align: center;
    font-size: 14px;
    transition: 0.5s;
    -webkit-transition: 0.3s ease-out;
    -moz-transition: 0.3s ease-out;
    -ms-transition: 0.3s ease-out;
    -o-transition: 0.3s ease-out;
    transition: 0.3s ease-out;
}
.share a:hover{
    opacity: 0.4;
    -webkit-transition: 0.3s ease-out;
    -moz-transition: 0.3s ease-out;
    -ms-transition: 0.3s ease-out;
    -o-transition: 0.3s ease-out;
    transition: 0.3s ease-out;
}
.share p {
    margin: 0;
    font-family: garamond-premier-pro, serif;
}
.share ul li {
    display: inline-block;
    margin: 0 5px;
}
.share img {
    width: 25px;
    padding-top: 7px;
}

footer {
    margin-top: 100px;
    padding: 90px 0;
    text-align: center;
    background: #000;
}
.foot_onair {
    font-size: 72px;
    font-family: garamond-premier-pro, serif;
}
.foot_onair_catch {
    margin-bottom: 20px;
}
.foot_onair span {
    font-size: 60px;
}
footer small {
    font-size:13px;
    font-family: dnp-shuei-gothic-gin-std,sans-serif;
    font-weight: 500;
    font-style: normal;
}
#page_top {
    width: 50px;
    height: 50px;
    position: fixed;
    bottom: 0;
    right: 0;
    z-index: 99;
}

.hamburger {
    display: none;
}


/* メディアクエリ */
@media screen and (max-width:750px){
    html.is-fixed,
    html.is-fixed body {
        height: 100%;
        overflow: hidden;
    }
    #sidenav {
        position: fixed;
        height: 100px;
        width: 100%;
        background: #000;
        z-index: 999;
    }
    h1 {
        margin:10px 0 0 0;
    }
    .onair {
        display: none;
    }
    /*　ハンバーガーボタン　*/
    .hamburger {
        display : block;
        position: fixed;
        z-index : 350;
        right : 25px;
        top   : 30px;
        width : 40px;
        height: 40px;
        cursor: pointer;
        text-align: center;
        transition: 0.3s;
    }
    .hamburger span {
        display : block;
        position: absolute;
        width   : 40px;
        height  : 2px ;
        background : #D3B37C;
        transition : 0.3s ease-in-out;
    }
    .hamburger span:nth-child(1) {
        top: 10px;
    }
    .hamburger span:nth-child(2) {
        top: 20px;
    }
    .hamburger span:nth-child(3) {
        top: 30px;
    }

    .hamburger.display span:nth-child(1) {
        top : 20px;
        transform        : rotate(315deg);
    }

    .hamburger.display span:nth-child(2),
    .hamburger.display span:nth-child(3) {
        top: 20px;
        transform        : rotate(-315deg);
    }
    nav {
        background:url(../img/common/bg_sp.jpg) center top;
        background-size: cover;
        /*height: 80%;*/
        height: calc(100vh - 100px);
        width: 100%;
        z-index: 500;
        position: fixed;
        top: 100px;
        padding-top: 100px;
        opacity: 0;
        transition: 0.5s;
        visibility: hidden;
        text-align: center;
        overflow: auto;
        -webkit-box-sizing: border-box;
           -moz-box-sizing: border-box;
                box-sizing: border-box;
    }
    nav ul {
        margin-left:0px;
    }
    nav li {
        margin-bottom: 70px;
    }
    nav li a {
        color: #fff !important;
        font-size: 44px;
        transition: 0.3s;
    }
    nav li a:before {
        background-color: transparent !important;
    }
    nav.display {
        opacity: 100;
        visibility: inherit;
    }   
    .share {
        width: auto;
        margin: 160px auto 100px;
        font-size: 30px;
    }
    .share img {
        width: 50px;
    }
    
    .foot_onair {
        font-size: 60px;
        margin-bottom: 0;
    }
    .foot_onair_catch {
      padding: 0 15px;
      text-align: left;
    }
    .foot_onair span {
        font-size: 30px;
    }
    
    /* 下層ページ共通 */
    .contents {
        width: 100%;
        margin: 0;
    }
    #fixedback {
        min-width: inherit;
        margin: 0;
    }
    h2 {
        margin-top: 120px;
        font-size: 40px;
    }

    footer {
        margin-top: 50px;
        padding: 50px 0;
        text-align: center;
        background: #000;
    }
    .foot_onair {
        font-size: 40px;
    }   
}

html { font-size: calc(100vw / 32); }
@media only screen and (min-width: 751px) { html { font-size: 16px; } }

img { vertical-align: bottom; }

@media only screen and (min-width: 751px) { .sp { display: none; }
  .contents { min-height: calc(100vh - 406px); }
  nav .menu li a:before { -webkit-transition: all 0.4s cubic-bezier(0.33, 1, 0.68, 1); -moz-transition: all 0.4s cubic-bezier(0.33, 1, 0.68, 1); -ms-transition: all 0.4s cubic-bezier(0.33, 1, 0.68, 1); -o-transition: all 0.4s cubic-bezier(0.33, 1, 0.68, 1); transition: all 0.4s cubic-bezier(0.33, 1, 0.68, 1); }
  #page_top img { -webkit-transition: all 0.4s cubic-bezier(0.33, 1, 0.68, 1); -moz-transition: all 0.4s cubic-bezier(0.33, 1, 0.68, 1); -ms-transition: all 0.4s cubic-bezier(0.33, 1, 0.68, 1); -o-transition: all 0.4s cubic-bezier(0.33, 1, 0.68, 1); transition: all 0.4s cubic-bezier(0.33, 1, 0.68, 1); }
  #page_top:hover img { -webkit-transform: translateY(-10px); -moz-transform: translateY(-10px); -ms-transform: translateY(-10px); -o-transform: translateY(-10px); transform: translateY(-10px); } }
@media only screen and (max-width: 750px) { #main { overflow: hidden; }
  nav { padding: 13.33vw 0 9.33vw; }
  nav .menu { margin: 0; margin-bottom: 16vw; }
  nav .menu li { margin-bottom: 9.33vw; }
  nav .menu li a { padding: 0; font-size: 2rem; }
  nav .share { margin: 0 0 13.33vw; font-size: 1.4rem; }
  nav .share li { width: 9.33vw; }
  nav .share li img { width: 100%; }
  footer small { font-size: 0.8rem; }
  h2 { font-size: 3rem; margin: calc(100px + 6vw) 0 9.33vw; } }
h2 span { position: relative; display: inline-block; opacity: 0; -webkit-transform: translateX(-40px); -moz-transform: translateX(-40px); -ms-transform: translateX(-40px); -o-transform: translateX(-40px); transform: translateX(-40px); }

.is_open h2 span { opacity: 1; -webkit-transform: translateX(0); -moz-transform: translateX(0); -ms-transform: translateX(0); -o-transform: translateX(0); transform: translateX(0); -webkit-transition: all 0.8s cubic-bezier(0.33, 1, 0.68, 1); -moz-transition: all 0.8s cubic-bezier(0.33, 1, 0.68, 1); -ms-transition: all 0.8s cubic-bezier(0.33, 1, 0.68, 1); -o-transition: all 0.8s cubic-bezier(0.33, 1, 0.68, 1); transition: all 0.8s cubic-bezier(0.33, 1, 0.68, 1); }
.is_open h2 span:nth-child(1) { -webkit-transition-delay: 0.6625s; -moz-transition-delay: 0.6625s; -ms-transition-delay: 0.6625s; -o-transition-delay: 0.6625s; transition-delay: 0.6625s; }
.is_open h2 span:nth-child(2) { -webkit-transition-delay: 0.725s; -moz-transition-delay: 0.725s; -ms-transition-delay: 0.725s; -o-transition-delay: 0.725s; transition-delay: 0.725s; }
.is_open h2 span:nth-child(3) { -webkit-transition-delay: 0.7875s; -moz-transition-delay: 0.7875s; -ms-transition-delay: 0.7875s; -o-transition-delay: 0.7875s; transition-delay: 0.7875s; }
.is_open h2 span:nth-child(4) { -webkit-transition-delay: 0.85s; -moz-transition-delay: 0.85s; -ms-transition-delay: 0.85s; -o-transition-delay: 0.85s; transition-delay: 0.85s; }
.is_open h2 span:nth-child(5) { -webkit-transition-delay: 0.9125s; -moz-transition-delay: 0.9125s; -ms-transition-delay: 0.9125s; -o-transition-delay: 0.9125s; transition-delay: 0.9125s; }
.is_open h2 span:nth-child(6) { -webkit-transition-delay: 0.975s; -moz-transition-delay: 0.975s; -ms-transition-delay: 0.975s; -o-transition-delay: 0.975s; transition-delay: 0.975s; }
.is_open h2 span:nth-child(7) { -webkit-transition-delay: 1.0375s; -moz-transition-delay: 1.0375s; -ms-transition-delay: 1.0375s; -o-transition-delay: 1.0375s; transition-delay: 1.0375s; }
.is_open h2 span:nth-child(8) { -webkit-transition-delay: 1.1s; -moz-transition-delay: 1.1s; -ms-transition-delay: 1.1s; -o-transition-delay: 1.1s; transition-delay: 1.1s; }
.is_open h2 span:nth-child(9) { -webkit-transition-delay: 1.1625s; -moz-transition-delay: 1.1625s; -ms-transition-delay: 1.1625s; -o-transition-delay: 1.1625s; transition-delay: 1.1625s; }
.is_open h2 span:nth-child(10) { -webkit-transition-delay: 1.225s; -moz-transition-delay: 1.225s; -ms-transition-delay: 1.225s; -o-transition-delay: 1.225s; transition-delay: 1.225s; }
.is_open h2 span:nth-child(11) { -webkit-transition-delay: 1.2875s; -moz-transition-delay: 1.2875s; -ms-transition-delay: 1.2875s; -o-transition-delay: 1.2875s; transition-delay: 1.2875s; }
.is_open h2 span:nth-child(12) { -webkit-transition-delay: 1.35s; -moz-transition-delay: 1.35s; -ms-transition-delay: 1.35s; -o-transition-delay: 1.35s; transition-delay: 1.35s; }
.is_open h2 span:nth-child(13) { -webkit-transition-delay: 1.4125s; -moz-transition-delay: 1.4125s; -ms-transition-delay: 1.4125s; -o-transition-delay: 1.4125s; transition-delay: 1.4125s; }
.is_open h2 span:nth-child(14) { -webkit-transition-delay: 1.475s; -moz-transition-delay: 1.475s; -ms-transition-delay: 1.475s; -o-transition-delay: 1.475s; transition-delay: 1.475s; }
.is_open h2 span:nth-child(15) { -webkit-transition-delay: 1.5375s; -moz-transition-delay: 1.5375s; -ms-transition-delay: 1.5375s; -o-transition-delay: 1.5375s; transition-delay: 1.5375s; }
.is_open h2 span:nth-child(16) { -webkit-transition-delay: 1.6s; -moz-transition-delay: 1.6s; -ms-transition-delay: 1.6s; -o-transition-delay: 1.6s; transition-delay: 1.6s; }
.is_open h2 span:nth-child(17) { -webkit-transition-delay: 1.6625s; -moz-transition-delay: 1.6625s; -ms-transition-delay: 1.6625s; -o-transition-delay: 1.6625s; transition-delay: 1.6625s; }
.is_open h2 span:nth-child(18) { -webkit-transition-delay: 1.725s; -moz-transition-delay: 1.725s; -ms-transition-delay: 1.725s; -o-transition-delay: 1.725s; transition-delay: 1.725s; }
.is_open h2 span:nth-child(19) { -webkit-transition-delay: 1.7875s; -moz-transition-delay: 1.7875s; -ms-transition-delay: 1.7875s; -o-transition-delay: 1.7875s; transition-delay: 1.7875s; }

.scroll_in { opacity: 0; -webkit-transform: translateX(-40px); -moz-transform: translateX(-40px); -ms-transform: translateX(-40px); -o-transform: translateX(-40px); transform: translateX(-40px); }
.scroll_in.active { opacity: 1; -webkit-transform: translateX(0); -moz-transform: translateX(0); -ms-transform: translateX(0); -o-transform: translateX(0); transform: translateX(0); -webkit-transition: all 0.6s cubic-bezier(0.5, 1, 0.89, 1); -moz-transition: all 0.6s cubic-bezier(0.5, 1, 0.89, 1); -ms-transition: all 0.6s cubic-bezier(0.5, 1, 0.89, 1); -o-transition: all 0.6s cubic-bezier(0.5, 1, 0.89, 1); transition: all 0.6s cubic-bezier(0.5, 1, 0.89, 1); }