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

p.btn a {
background: #feac35;
line-height: 200%;
border: 3px solid #fff;
text-decoration: none;
padding: 10px 20px;
color: #fff;
position: relative;
border-radius: 30px;
}
p.btn a:hover {
background: #ff64c5;
border: 3px solid #603813;
cursor: pointer;
}


/*-------------------------------
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:40px;
}
.pageNav li img {
height:40px;
position: relative;
color: #fff;
background: #feac35;
border-radius: 10px;
border: 3px solid #603813;
}
.pageNav li a img:hover{
filter:drop-shadow(0 0 6px #ff64c5);
border: 3px solid #603813;
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:48px;
}
.pageNav li img {
height:48px;
position: relative;
color: #fff;
background: #feac35;
border-radius: 10px;
border: 3px solid #603813;
}
.pageNav li a img:hover{
filter:drop-shadow(0 0 6px #ff64c5);
border: 3px solid #603813;
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;
left:10px;
background:#005aac;
border-radius: 10px;
border:1px solid #fff;
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:#005aac;
opacity: 0;
transition: 1s ease-in-out;
}
/*content*/
#nav-content {
overflow: auto;
position: fixed;
top: 160px;
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:#005aac;
border-top:2px solid #fff;
}
#navMenu nav ul li{
margin:0 auto;
padding: 0;
text-align:center;
width:100%;
border-bottom:2px solid	#fff;
text-indent:-9999px;
}
#navMenu nav ul li a{
display: block;
height:72px;
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;
opacity: 0.6;
background:#089ddc;	
}
 


#navMenu nav ul li.nav00 a{background:url(../img/nav/nav_Title00.png) no-repeat center center;background-size:contain;}
#navMenu nav ul li.nav01 a{background:url(../img/nav/nav_Title01.png) no-repeat center center;background-size: contain;}
#navMenu nav ul li.nav02 a{background:url(../img/nav/nav_Title02.png) no-repeat center center;background-size: contain;}
#navMenu nav ul li.nav03 a{background:url(../img/nav/nav_Title03.png) no-repeat center center;background-size: contain;}
#navMenu nav ul li.nav04 a{background:url(../img/nav/nav_Title04.png) no-repeat center center;background-size: contain;}
#navMenu nav ul li.nav05 a{background:url(../img/nav/nav_Title05.png) no-repeat center center;background-size: contain;}
#navMenu nav ul li.nav06 a{background:url(../img/nav/nav_Title06.png) no-repeat center center;background-size: contain;}
/**/
#navMenu nav ul li.nav00 a:hover{background:url(../img/nav/nav_Title00_on.png) no-repeat center center;background-size:contain;}
#navMenu nav ul li.nav01 a:hover{background:url(../img/nav/nav_Title01_on.png) no-repeat center center;background-size: contain;}
#navMenu nav ul li.nav02 a:hover{background:url(../img/nav/nav_Title02_on.png) no-repeat center center;background-size: contain;}
#navMenu nav ul li.nav03 a:hover{background:url(../img/nav/nav_Title03_on.png) no-repeat center center;background-size: contain;}
#navMenu nav ul li.nav04 a:hover{background:url(../img/nav/nav_Title04_on.png) no-repeat center center;background-size: contain;}
#navMenu nav ul li.nav05 a:hover{background:url(../img/nav/nav_Title05_on.png) no-repeat center center;background-size: contain;}
#navMenu nav ul li.nav06 a:hover{background:url(../img/nav/nav_Title06_on.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;
}