@charset "UTF-8";
/* CSS Document */
/*-------------------------------
SP only
--------------------------------*/
@media screen and (max-width: 768px) {
.pageNav ul {
width:90%;
margin:20px auto;
display: flex;
flex-wrap: wrap;
}
.pageNav li {
margin: 0 auto 10px;
float: left;
height:32px;
}
.pageNav li img {
height:32px;
padding:0;
}
.pageNav li a:hover,
.pageNav li a img:hover{
filter:drop-shadow(0 0 6px #cf1889);
cursor: pointer;
}
}
/*-------------------------------
PC only
--------------------------------*/
@media screen and (min-width: 769px) {
.pageNav ul {
width:90%;
margin:20px auto;
display: flex;
flex-wrap: wrap;
}
.pageNav li {
margin: 0 auto 20px;
float: left;
height:36px;
}
.pageNav li img {
height:36px;
padding:0;
}
.pageNav li a:hover,
.pageNav li a img:hover{
filter:drop-shadow(0 0 6px #cf1889);
cursor: pointer;
}}
/*-------------------------------
common
--------------------------------*/
/*header*/
#nav-open {
top:10px;
z-index: 99999;
}
#wrap_conts{
position: relative;
}
/*チェックボックス*/
.nav-unshown {
display:none;
}
/*menuアイコン*/
#nav-open {
display: inline-block;
width: 50px;
height: 40px;
vertical-align: middle;
padding:15px 10px;
margin:0 auto;
position: absolute;
right:10px;
background:#701919;
border-radius: 40px;
border:1px solid #f6c300;
box-shadow: 0 0 5px 1px #fff;
}
#nav-open span{
height: 40px;
width: 50px;
display: block;
content: '';
cursor: pointer;
background:url(../img/nav/menu.png) no-repeat center center;
background-size:50px;
}/*
#nav-open span,
#nav-open span:before,
#nav-open span:after {
position: absolute;
height: 4px;
width: 50px;
background:#f6c300;
display: block;
content: '';
cursor: pointer;
}
#nav-open span:before {
bottom: -12px;
}
#nav-open span:after {
bottom: -24px;
}
/*closeBG*/
#nav-close {
display: none;
position: fixed;
z-index: 9999;
top: 0;
left: 0;
width: 100%;
height: 100%;
background:#000;
opacity: 0;
transition: 1s ease-in-out;
}
/*content*/
#nav-content {
overflow: auto;
position: fixed;
top: 90px;
left: 0;
z-index: 999999;/**/
width:100%;/**/
height:auto;
transition:0.5s ease-in-out;/**/
-webkit-transform: translateY(-150%);
transform: translateY(-150%);/**/
}
/**/
#nav-input:checked ~ #nav-open span{
background:url(../img/nav/menu_close.png) no-repeat center center;
background-size:50px;
transition: 0.5s ease-in-out;
}
/**/
#nav-input:checked ~ #nav-close {
display: block;/**/
opacity: 0.8;
z-index: 9999px;
}
#nav-input:checked ~ #nav-content {
-webkit-transform: translateY(0%);
transform: translateY(0%);
}
/**/
#navMenu{
margin:0 auto;
}
#navMenu nav ul{
width:100%;
margin:0 auto;
background:rgba(0,0,0, 0.8);
}
#navMenu nav ul li{
margin:0 auto;
padding: 0;
text-align:center;
width:100%;
border-bottom:1px solid	#f6c300;
text-indent:-9999px;
}
#navMenu nav ul li a{
display: block;
height:54px;
margin: 0;
}
#navMenu nav ul li a:link{
display: block;
padding:0;
margin:0 auto;
}
#navMenu nav ul li:hover{
margin:0 auto;
padding:0;
cursor: pointer;
}
#navMenu nav ul li.nav01 a{background:url(../img/nav/navTitle01.png) no-repeat center center;background-size:contain;}
#navMenu nav ul li.nav02 a{background:url(../img/nav/navTitle02.png) no-repeat center center;background-size: contain;}
#navMenu nav ul li.nav03 a{background:url(../img/nav/navTitle03.png) no-repeat center center;background-size: contain;}
#navMenu nav ul li.nav04 a{background:url(../img/nav/navTitle04.png) no-repeat center center;background-size: contain;}
#navMenu nav ul li.nav05 a{background:url(../img/nav/navTitle05.png) no-repeat center center;background-size: contain;}
#navMenu nav ul li.nav06 a{background:url(../img/nav/navTitle06.png) no-repeat center center;background-size: contain;}
#navMenu nav ul li.nav07 a{background:url(../img/nav/navTitle07.png) no-repeat center center;background-size: contain;}
/**/
#navMenu nav ul li.nav01 a:hover{background:url(../img/nav/navTitle_on01.png) no-repeat center center;background-size:contain;}
#navMenu nav ul li.nav02 a:hover{background:url(../img/nav/navTitle_on02.png) no-repeat center center;background-size: contain;}
#navMenu nav ul li.nav03 a:hover{background:url(../img/nav/navTitle_on03.png) no-repeat center center;background-size: contain;}
#navMenu nav ul li.nav04 a:hover{background:url(../img/nav/navTitle_on04.png) no-repeat center center;background-size: contain;}
#navMenu nav ul li.nav05 a:hover{background:url(../img/nav/navTitle_on05.png) no-repeat center center;background-size: contain;}
#navMenu nav ul li.nav06 a:hover{background:url(../img/nav/navTitle_on06.png) no-repeat center center;background-size: contain;}
#navMenu nav ul li.nav07 a:hover{background:url(../img/nav/navTitle_on07.png) no-repeat center center;background-size: contain;}

/*子階層*/
#navMenu nav ul li ul.menu-child {
padding-bottom:0;
background:rgba(0,0,0, 0);
}
#navMenu nav ul li ul.menu-child li{
border-bottom:none;
padding:10px 0;
;}
#navMenu nav ul li ul.menu-child li a,
#navMenu nav ul li ul.menu-child li a:hover{
background: none;
height:40px;
display: block;
}
.accordion {
margin: 0 auto;
max-width: 60vw;
}
.toggle {
display: none;
}
.plus,
.menu-child {
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
transform: translateZ(0);
transition: all /*1s*/0.2s;
}
.plus {
padding: 1em;
display: block;
font-weight: bold;
text-indent: 0;
}
.plus::before {
content: "▼";
position: absolute;
font-size:24px;
color:#f6c300;
top:0;
margin-left:-12px;
}
/*content: "";
position: absolute;
width: 3px;
height: 1em;
top:0;
background-color: #fff;
transition: all 0.3s;
}*/
.plus::after {
transform: rotate(90deg);
}
.menu-child {
max-height: 0;
overflow: hidden;
}
.menu-child li {
margin: 0;
padding: 20px 0;
}
.toggle:checked + .plus + .menu-child {
max-height: 500px;
/*transition: all 1.5s;*/
}
.toggle:checked + .plus::before {
transform: rotate(180deg) !important;
}
#navMenu nav ul li ul.menu-child li{
margin:0;
padding:0;
text-align:center;
}
#navMenu nav ul li ul.menu-child li:last-child{
border-bottom:none;
}
/*Chara*/
#navMenu nav ul li.nav04 ul.menu-child li.MCnav01 a{background:url(../../characters/img/navChara_sub01.png) no-repeat center center;background-size:contain;}
#navMenu nav ul li.nav04 ul.menu-child li.MCnav02 a{background:url(../../characters/img/navChara_sub02.png) no-repeat center center;background-size:contain;}
#navMenu nav ul li.nav04 ul.menu-child li.MCnav03 a{background:url(../../characters/img/navChara_sub03.png) no-repeat center center;background-size:contain;}
#navMenu nav ul li.nav04 ul.menu-child li.MCnav04 a{background:url(../../characters/img/navChara_sub04.png) no-repeat center center;background-size:contain;}
#navMenu nav ul li.nav04 ul.menu-child li.MCnav05 a{background:url(../../characters/img/navChara_sub05.png) no-repeat center center;background-size:contain;}
#navMenu nav ul li.nav04 ul.menu-child li.MCnav06 a{background:url(../../characters/img/navChara_sub06.png) no-repeat center center;background-size:contain;}
/**/
#navMenu nav ul li.nav04 ul.menu-child li.MCnav01 a:hover{background:url(../../characters/img/navChara_on_sub01.png) no-repeat center center;background-size:contain;}
#navMenu nav ul li.nav04 ul.menu-child li.MCnav02 a:hover{background:url(../../characters/img/navChara_on_sub02.png) no-repeat center center;background-size:contain;}
#navMenu nav ul li.nav04 ul.menu-child li.MCnav03 a:hover{background:url(../../characters/img/navChara_on_sub03.png) no-repeat center center;background-size:contain;}
#navMenu nav ul li.nav04 ul.menu-child li.MCnav04 a:hover{background:url(../../characters/img/navChara_on_sub04.png) no-repeat center center;background-size:contain;}
#navMenu nav ul li.nav04 ul.menu-child li.MCnav05 a:hover{background:url(../../characters/img/navChara_on_sub05.png) no-repeat center center;background-size:contain;}
#navMenu nav ul li.nav04 ul.menu-child li.MCnav06 a:hover{background:url(../../characters/img/navChara_on_sub06.png) no-repeat center center;background-size:contain;}
/*System*/
#navMenu nav ul li.nav05 ul.menu-child li.MCnav01 a{background:url(../../system/img/nav_System_sub01.png) no-repeat center center;background-size:contain;}
#navMenu nav ul li.nav05 ul.menu-child li.MCnav02 a{background:url(../../system/img/nav_System_sub02.png) no-repeat center center;background-size:contain;}
#navMenu nav ul li.nav05 ul.menu-child li.MCnav03 a{background:url(../../system/img/nav_System_sub03.png) no-repeat center center;background-size:contain;}
#navMenu nav ul li.nav05 ul.menu-child li.MCnav04 a{background:url(../../system/img/nav_System_sub04.png) no-repeat center center;background-size:contain;}
#navMenu nav ul li.nav05 ul.menu-child li.MCnav05 a{background:url(../../system/img/nav_System_sub05.png) no-repeat center center;background-size:contain;}
#navMenu nav ul li.nav05 ul.menu-child li.MCnav06 a{background:url(../../system/img/nav_System_sub06.png) no-repeat center center;background-size:contain;}
/*System_on*/
#navMenu nav ul li.nav05 ul.menu-child li.MCnav01 a:hover{background:url(../../system/img/nav_System_on_sub01.png) no-repeat center center;background-size:contain;}
#navMenu nav ul li.nav05 ul.menu-child li.MCnav02 a:hover{background:url(../../system/img/nav_System_on_sub02.png) no-repeat center center;background-size:contain;}
#navMenu nav ul li.nav05 ul.menu-child li.MCnav03 a:hover{background:url(../../system/img/nav_System_on_sub03.png) no-repeat center center;background-size:contain;}
#navMenu nav ul li.nav05 ul.menu-child li.MCnav04 a:hover {background:url(../../system/img/nav_System_on_sub04.png) no-repeat center center;background-size:contain;}
#navMenu nav ul li.nav05 ul.menu-child li.MCnav05 a:hover{background:url(../../system/img/nav_System_on_sub05.png) no-repeat center center;background-size:contain;}
#navMenu nav ul li.nav05 ul.menu-child li.MCnav06 a:hover{background:url(../../system/img/nav_System_on_sub06.png) no-repeat center center;background-size:contain;
}