/* overwrite default drawer settings */
.drawer--left .drawer-hamburger,
.drawer--left.drawer-open .drawer-nav,
.drawer--left.drawer-open .drawer-navbar .drawer-hamburger {
  left: auto;
  right: 0;
}

.drawer--left .drawer-hamburger,
.drawer--left.drawer-open .drawer-nav,
.drawer--left.drawer-open .drawer-navbar .drawer-hamburger {
  left: auto;
  right: 0;
}

.drawer-nav {
  /*width: calc(895 * 100vw / 1125);*/
}

.drawer--left .drawer-nav {
  left: auto;
  /*width: calc(895 * 100vw / 1125);*/
  right: -16.25rem;
  -webkit-transition: right .6s cubic-bezier(.19, 1, .22, 1);
  -o-transition: right .6s cubic-bezier(.19, 1, .22, 1);
  transition: right .6s cubic-bezier(.19, 1, .22, 1);
/*
  background: url(../img/top/sp/bg-navigation.png) no-repeat left top;
*/
  background-color:#181818;
  background-size: auto 100vh;
}

.drawer--left.drawer-open .drawer-hamburger {
  background-color:#181818;
  left: auto;
  right: 16.25rem;
  top: 0;
  padding: 0 10px 0;
	height: calc(154 * 100vw / 1125);
}

.drawer-hamburger-icon,
.drawer-hamburger-icon:after,
.drawer-hamburger-icon:before {
  background: none #fff;
  height: 1px;
}

.drawer-hamburger-icon {
  margin: 0px;
  transform: translateY(5px);
}
.drawer-open .drawer-hamburger-icon {
  transform: translateY(0px);
}

.drawer-hamburger-icon:after {
  top: 6px;
}

.drawer-hamburger-icon:before {
  top: -6px;
}

.drawer-hamburger {
  left: auto;
  padding-top: 0;
  padding-bottom: 0;
  right: calc(50 * 100vw / 1125);
  top: calc(28* 100vw / 1125);
  width: calc(72 * 100vw / 1125);
  height: calc(65 * 100vw / 1125);
}

.drawer-menu li {
  background: url(../img/top/sp/navi-dot-line.png) no-repeat left bottom;
  background-size: 90%;
}

.drawer-menu li a {
  color: #fff;
}

.drawer-extra img {
  width: calc(90 * 100vw / 1125);
  margin-left: calc(30 * 100vw / 1125);
  margin-top: calc(60 * 100vw / 1125);
}

.sidebnr {
  position: fixed;
  /*top: calc(610 * 100vw / 1400);*/
  bottom: 50px;
  left: 0;
  max-width: 55px;
  text-align: center;
}

.sidebnr h3 {
	display: none;
}
.sidebnr__sns {
  margin: 87px 0 0;
}

.sidebnr__sns a {
  display: block;
}

.sidebnr__sns a img {
  margin: 0 0 10px;
}

#g_menu {
  position: relative;
  z-index: 100001;
  font-family: "Oswald","游ゴシック体", "Yu Gothic", YuGothic, "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo", sans-serif;
}

.fixed_menu {
  position: fixed;
  width: 100%;
  height: 72px;
  top: 0px;
  -webkit-transition-duration: .5s;
       -o-transition-duration: .5s;
          transition-duration: .5s;
  -webkit-transition-property: background-color;
  -o-transition-property: background-color;
  transition-property: background-color;
  background-color: rgba(0, 0, 0, 0);
}

#home .fixed_menu {
  position: fixed;
  width: 100%;
  height: 72px;
  -webkit-transition-duration: .10s;
       -o-transition-duration: .10s;
          transition-duration: .10s;
  -webkit-transition-property: background-color,top;
  -o-transition-property: background-color,top;
  transition-property: background-color,top;
  background-color: rgba(0, 0, 0, 0);
  top: 0px;
}

#home .fixed_menu.active {
  position: fixed;
  width: 100%;
  height: 72px;
  -webkit-transition-duration: .10s;
       -o-transition-duration: .10s;
          transition-duration: .10s;
  -webkit-transition-property: background-color,top;
  -o-transition-property: background-color,top;
  transition-property: background-color,top;
  background-color: rgba(0, 0, 0, 1);
  top: 0;
}

.fixed_menu.active {
  -webkit-transition-duration: .5s;
       -o-transition-duration: .5s;
          transition-duration: .5s;
  -webkit-transition-property: background-color;
  -o-transition-property: background-color;
  transition-property: background-color;
  background-color: rgba(0, 0, 0, 1);
}

.fixed_menu .inbox {
  position: relative;
  z-index: 20000;
  width: 1400px;
  height: 100%;
  margin: auto;
}

.fixed_menu h1 {
  line-height: 1;
  position: absolute;
  top: 50%;
  left: 48px;
  -webkit-transform: translateY(-50%);
      -ms-transform: translateY(-50%);
          transform: translateY(-50%);
}

.fixed_menu #pcNav {
  position: absolute;
  top: 50%;
  right: 37px;
  -webkit-transform: translateY(-50%);
      -ms-transform: translateY(-50%);
          transform: translateY(-50%);
}

.fixed_menu #pcNav a {
  font-family: 'Noto Sans JP', sans-serif;
  font-size: 12px;
  color: #fff;
  font-weight: bold;
  display: inline-block;
  /*margin-top: 1.1em;*/
  line-height: 1.2em;
  letter-spacing: 0.05em;
}

.fixed_menu #pcNav a + a {
  margin-left: 1.2em;
	position:relative;
}

.fixed_menu #pcNav a span.new{
	position:absolute;
	top: -17px;
	left: 20px;
	font-size: 100%;
	color:#ff0000;
	border:none;
}

.fixed_menu #pcNav a span.update{
	position:absolute;
	top: -17px;
	left: 1px;
	font-size: 100%;
	color:#ffff00;
	border:none;
}


header[role="banner"] {
  display: none;
}

#mainHeader {
  position: static;
  height: auto;
  padding-top: 0;
}

@media screen and (max-width: 768px) {
  .sidebnr {
    max-width: none;
    bottom: 0;
    -webkit-transition-property: -webkit-transform;
    transition-property: -webkit-transform;
    -o-transition-property: transform;
    transition-property: transform;
    transition-property: transform, -webkit-transform;
    -webkit-transition-duration: 1s;
         -o-transition-duration: 1s;
            transition-duration: 1s;
    -webkit-transform: translateY(200px);
        -ms-transform: translateY(200px);
            transform: translateY(200px);
  }

  .sidebnr.active {
    -webkit-transition-duration: .5s;
         -o-transition-duration: .5s;
            transition-duration: .5s;
    -webkit-transition-property: -webkit-transform;
    transition-property: -webkit-transform;
    -o-transition-property: transform;
    transition-property: transform;
    transition-property: transform, -webkit-transform;
    display: block;
    -webkit-transform: translateY(0);
        -ms-transform: translateY(0);
            transform: translateY(0);
  }

  .sidebnr__ticket img {
    max-width: 100%;
  }

  .sidebnr__sns {
    display: none;
  }

  .sidebnr h3 {
    display: none;
  }

  #g_menu {
    height: calc(154 * 100vw / 1125);
  }

	#home .fixed_menu {
    -webkit-transition-duration: 0s;
         -o-transition-duration: 0s;
            transition-duration: 0s;
    background: none #000;
    height: calc(154 * 100vw / 1125);
	  top: 0;
	}

	#home .fixed_menu.active {
    -webkit-transition-duration: 0s;
         -o-transition-duration: 0s;
            transition-duration: 0s;
    background: none #000;
    height: calc(154 * 100vw / 1125);
	  top: 0;
	}

  .fixed_menu {
    -webkit-transition-duration: 0s;
         -o-transition-duration: 0s;
            transition-duration: 0s;
    background: none #000;
    height: calc(154 * 100vw / 1125);
  }

  .fixed_menu h1 {
    background: none #000;
    width: 100%;
  }

  .fixed_menu h1 a {
    background: none #000;
    display: inline-block;
    height: calc(48 * 100vw / 1125);
    width: 100%;
    background: url(../img/top/sp/logo-iwf-sp.svg) no-repeat calc(0 * 100vw / 1125) center;
    background-size: auto 100%;
  }

  .fixed_menu h1 img {
    display: none;
  }

  .fixed_menu #pcNav {
    display: none;
  }

  header[role="banner"] {
    display: block;
    position: relative;
    z-index: 99999;
  }

	.drawer-menu {
    margin-top: calc(0 * 100vw / 1125);
	}

	.drawer-menu li {
    margin-left: calc(70 * 100vw / 1125);
	}

	.drawer-menu li a span.new {
	    width: auto;
	    display: inline-block;
	    font-size: 14px;
	    line-height: 0 !important;
	    text-indent: 0 !important;
	    letter-spacing: 0 !important;
	    margin: 0 !important;
	    padding: 0 !important;
	    color: #ff0000;
	    border: none;
	}

	.drawer-menu li a span.update {
	    width: auto;
	    display: inline-block;
	    font-size: 14px;
	    line-height: 0 !important;
	    text-indent: 0 !important;
	    letter-spacing: 0 !important;
	    margin: 0 !important;
	    padding: 0 !important;
	    color: #ffff00;
	    border: none;
	}

	.drawer-extra {
    margin-left: calc(70 * 100vw / 1125);
	}
}

@media screen and (max-width: 1400px) {
  .fixed_menu .inbox {
    width: auto;
  }

  .fixed_menu h1 img {
    /*width: calc(436 * 100vw / 1400);*/
  }
}

