@charset "utf-8";
/* CSS Document */
/******************************************************************************

 PC 

******************************************************************************/
@media screen and (min-width: 768px) {
/******************************************************************************
 Layout
******************************************************************************/
#wrapper {
 width: 100%;
 position: relative;
 height: auto !important; /*IE6対策*/
 height: 100%;
 min-height: 100%;
 font-size:14px;
 line-height:1.5em;
 min-width: 1200px;
 background: #000;
 background-size: 100% auto;
}
#wrapper.home {
 /*background:url(../images/top/bg_top_mv.jpg) no-repeat center top #000;*/
/* background-size: 70% auto;*/
    background-size: contain;
}
.inner {
 clear:both;
 margin:0 auto;
 padding: 0 10px;
 width:1200px;
 height:auto;
 box-sizing: border-box;
 position: relative;
}

/* header ****************************************************/
header {
 width: 100%;
 background:url(../images/common/bg_header.jpg) no-repeat center top #000;
 box-shadow:0px 4px 4px -3px rgba(0,0,0,0.9);
 height: 85px;
 box-sizing: border-box;
 position: relative;
}
header.fixed {
    position: fixed;
    top: 0;
    z-index: 10;
}


header h1{
 position: absolute;
 top:5px;
 left: 50%;
 transform: translateX(-50%);
 z-index: 10;
 width: 120px;
}
header img {
 width: 100%;
 height: auto;
}
header.topheader{
 background:url(../images/common/bg_header_top.jpg) no-repeat center top #000;
}
header.topheader:before {
	content: '';
	width: 100%;
	height: 4px;
	position: absolute; 
	left: 0;
	top:0px;
	background: #dfc878; /* Old browsers */
	background: -webkit-linear-gradient(45deg, #dfc878 0%,#ffffff 22%,#dfc878 50%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(45deg, #dfc878 0%,#ffffff 22%,#dfc878 50%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#dfc878', endColorstr='#dfc878',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
}
header:after {
	content: '';
	width: 100%;
	height: 4px;
	position: absolute;
	left: 0;
	bottom:0px;
	background: #dfc878; /* Old browsers */
	background: -webkit-linear-gradient(45deg, #dfc878 0%,#ffffff 22%,#dfc878 50%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(45deg, #dfc878 0%,#ffffff 22%,#dfc878 50%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#dfc878', endColorstr='#dfc878',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
}

header .headerInner{
	 width: 1200px;
	 padding: 20px 0 0;
	 margin: 0 auto;
	 box-sizing: border-box;
	 position: relative;
	 z-index: 20;
	 text-align: center;
}
header .gnav{
	 display: -webkit-flex;
	 display: flex;
	 flex-wrap:wrap;
	 -webkit-flex-wrap:wrap;
	 justify-content:space-between;
	 -webkit-box-pack:justify;
	 -webkit-justify-content:space-between;
	 align-items:center; 
	 -webkit-box-align:center;
	 -webkit-align-items:center;
}

/*トップページのみ*/
header.topheader .gnav li:nth-child(5),header.topheader .gnav li:nth-child(1){
 width: auto;
}
.headerticketbtn{
    background: #1ec5cc;
    border-radius: 5px;
    padding: 2px 30px;
}
.headerticketbtn a{
    color:#333;
} 
header .gnav li a{
 font-family: 'Anton', 'Noto Sans Japanese', sans-serif;
 line-height:2.2em;
 font-size: 214.285%;
}

header .jaFont li.topnolink{
 font-weight: bold;
 color: #999;
}
header .jaFont li a{
 font-family: 'Noto Sans Japanese', sans-serif;
　line-height: 2.2em;
  font-size: 1.3rem;
 font-weight: bold;
 
}
header .gnav li a.nolink{
 color: #777;
}
header .gnav li a.nolink:hover{
 color: #777;
}
header .gnav li a:hover,
header .gnav li.current a{
 color: #dfc878;
}
header .gnav li.lang {
 /*position: absolute;
 right: 0;
 padding-left: 40px;*/
}
header .gnav li.lang a{
font-size: 14px;
font-weight: 600;
font-family: 'Roboto', sans-serif;
 letter-spacing: 1.2px;
}
#lang.lang a{
 display: block;
 border: 2px solid #FFF;
 border-radius: 20px;
 padding: 4px 15px 3px;
}
@media screen and (max-width: 767px) {
 header,header.mvMove.on { display: none;}
}


/* nav ****************************************************/
nav {}
#menu { display:none;}
#overlay{  display:none;}
/* main contents ****************************************************/
#wrapper > .container {
 clear:both;
 width:100%;
 margin:0 auto;
 padding: 0 0 60px 0;
 height:auto;
 box-sizing: border-box;
 position: relative;
 /*background:url(../images/top/bg_top_cont.jpg) no-repeat center top 85px #000;*/
 background-size: 100% auto;
}

#wrapper > .fixedcnt{
 margin-top:100px;

}
#home.container {
 /*padding: 55px 0 60px;
 background:url(../images/top/bg_top_cont.jpg) no-repeat center top #000;
 background-size: 100% auto;*/
}
#ema.container {
 padding: 85px 0 60px;
 background:url(../images/ema/bg_shrine.jpg) repeat center top #ebe3d6;
 color: #000;
}
.container img {
 width: 100%;
 height: auto;
}
/* footer ****************************************************/
footer {
 width: 100%;
 position: relative;
 padding: 30px 0 80px;
 border-top: 2px solid #e71a21;
 text-align: center;
 font-size: 85.714%;
 line-height: 2em;
}
footer p.njpw {
 margin-top: 40px;
}

 
 
 
 
 
 
 
 
 
 
 
 
 
 
}

/******************************************************************************

 SP 

******************************************************************************/
@media screen and (max-width: 767px) {
/******************************************************************************
 Layout
******************************************************************************/
header .gnav li a.nolink:hover{
 color: #777;
}
#wrapper {
 font-size:12.5px;
 line-height:1.5em;
}
#wrapper.home {
/* background: url(../images/top/bg_top_mv_sp.jpg) no-repeat center top;*/
 background-size: 100% auto;
}
.mvchange{
	display: none;
}
#wrapper img {
 width: 100%;
 height: auto;
}
.inner {
 width:100%;
 position: relative;
}

/* header ****************************************************/
header,header.mvMove.on { display: none;}
.topheader{display:block;}

/* nav ****************************************************/
nav.drawer-nav {
 background-color: #000;
}
nav .navInner {
 padding-top:45px;
 padding-left: 25px;
}
nav .drawer-menu li{
 padding-left: 10px;
 margin-bottom: 20px;
}
nav .drawer-menu li a{
    font-family:  'Noto Sans Japanese' ,'Anton', sans-serif;
    line-height: 1.5em;
    font-size: 130%;
}
nav .drawer-menu li a.nolink{
	color:#888;
}
.current a{ color: #1ec5cc;}
nav .lang {
 display: -webkit-flex;
 display: flex;
 flex-wrap:wrap;
 -webkit-flex-wrap:wrap;
 margin-top: 30px;
 margin-bottom: 40px;
}
nav .lang li{
 width: 80px;
 padding-left: 10px;
}
nav .lang li a{
 font-size: 88%;
}
nav .logo { 
 width: 50px;
}
nav li.card{ display: none;}
nav li.card.on{ display: block;}
#menu.drawer-hamburger {
 top: 45px;
 width: 35px;
 padding-top: 5px;
 padding-right: 10px;
 padding-bottom: 15px;
 padding-left: 10px;
 background-color: rgba(0,0,0,0.7);
 box-sizing: border-box;
}
.drawer-hamburger-icon,
.drawer-hamburger-icon:before,
.drawer-hamburger-icon:after {
 width: 100%;
 height: 2px;
 background-color: #FFF;
}
.drawer-hamburger-icon:before,
.drawer-hamburger-icon:after {
 position: absolute;
 top: -6px;
 left: 0;
 content: ' ';
}
.drawer-hamburger-icon:after {
 top: 6px;
}
.drawer-hamburger-icon:after {
 top: 6px;
}
.drawer-overlay {
 background-color: rgba(0, 0, 0, .5);
}

.topmenu{
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    -ms-grid-template-columns: repeat(2, 1fr);
    padding-left: 10px;
}
.topmenu li{
    margin: 5px 10px 5px 0;
	background: url(../images/top/bg_top_btn_sp.jpg) no-repeat center top #000;
    padding: 15px 0;
    text-align: center;
    font-weight:bold;
    border: #1ec5cc solid 1px;

}
.topmenu li .nolink{
	color:#888;
	position: relative;
    display: block;
}
.topmenu li .nolink:after{
	content: "coming soon!";
	position: absolute;
    color: #f00;
    left: 0;
    right: 0;
    margin: auto;
    top:10px;
}

.menubtn01{
grid-row: 1;
grid-column: 1;
-ms-grid-row: 1;
-ms-grid-column: 1;
}
.menubtn02{
grid-row: 1;
grid-column: 2;
-ms-grid-row: 1;
-ms-grid-column: 2;
}
.menubtn03{
grid-row: 2;
grid-column: 1;
-ms-grid-row: 2;
-ms-grid-column: 1;
}
.menubtn04{
grid-row: 2;
grid-column: 2;
-ms-grid-row: 2;
-ms-grid-column: 2;
}
.menubtn05{
grid-row: 3;
grid-column: 1;
-ms-grid-row: 3;
-ms-grid-column: 1;
}
.menubtn06{
grid-row: 3;
grid-column: 2;
-ms-grid-row: 3;
-ms-grid-column: 2;
}
.menubtn07{
grid-row: 4;
grid-column: 1;
-ms-grid-row: 4;
-ms-grid-column: 1;
}
.menubtn08{
grid-row: 4;
grid-column: 2;
-ms-grid-row: 4;
-ms-grid-column: 2;
}


/* main contents ****************************************************/
#wrapper > .container {
 clear:both;
 margin:0 auto;
 /*padding: 40px 3% 30px;*/
 width:100%;
 height:auto;
 box-sizing: border-box;
 position: relative;
 background:url(../images/common/bg_under.jpg) no-repeat center top #000;
 background-size: 100% auto;
}
#home.container {
 padding-top: 0;
 background-image: none;
}
#ema.container {
 padding: 0;
 background:url(../images/ema/bg_shrine.jpg) repeat center top #ebe3d6;
 color: #000;
}
/* footer ****************************************************/
footer {
 width: 100%;
 position: relative;
 padding: 30px 3%;
 box-sizing: border-box;
 border-top: 2px solid #e71a21;
 text-align: center;
 line-height: 1.4em;
}
footer p.copy {
 margin-bottom:1em;
}
footer p.njpw {
 width: 20%;
 margin: 1em auto;
}
 
}