@charset "UTF-8";
/* CSS Document */
p.btn a {
background: #0a70a1;
line-height: 200%;
border: 3px solid #00a2de;
text-decoration: none;
padding: 10px 20px;
color: #fff;
position: relative;
border-radius: 10px;
}
p.btn a:hover {
background: #f21854;
border: 3px solid #7b2265;
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:fixed;
background:#5f6f99;
border-radius: 50px;
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;
}
/*closeBG*/
#nav-close {
display: none;
position: fixed;
z-index: 9999;
top: 0;
left: 0;
width: 100%;
height: 100%;
background:#0a70a1;
opacity: 0;
transition: 1s ease-in-out;
}
/*content*/
#nav-content {
overflow: auto;
position: fixed;
top: 120px;
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: 9999;
}
#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:#0a70a1;
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: 1;
background:#00a2de;	
}
#navMenu nav ul li.nav00 a{background:url(../img/nav/navTit00.png) no-repeat center center;background-size:320px;}
#navMenu nav ul li.nav01 a{background:url(../img/nav/navTit01.png) no-repeat center center;background-size:320px;}
#navMenu nav ul li.nav02 a{background:url(../img/nav/navTit02.png) no-repeat center center;background-size:320px;}
#navMenu nav ul li.nav03 a{background:url(../img/nav/navTit03.png) no-repeat center center;background-size:320px;}
#navMenu nav ul li.nav04 a{background:url(../img/nav/navTit04.png) no-repeat center center;background-size:320px;}
#navMenu nav ul li.nav05 a{background:url(../img/nav/navTit05.png) no-repeat center center;background-size:320px;}
/**/
#navMenu nav ul li.nav00 a:hover{background:url(../img/nav/navTit00_on.png) no-repeat center center;background-size:320px;}
#navMenu nav ul li.nav01 a:hover{background:url(../img/nav/navTit01_on.png) no-repeat center center;background-size:320px;}
#navMenu nav ul li.nav02 a:hover{background:url(../img/nav/navTit02_on.png) no-repeat center center;background-size:320px;}
#navMenu nav ul li.nav03 a:hover{background:url(../img/nav/navTit03_on.png) no-repeat center center;background-size:320px;}
#navMenu nav ul li.nav04 a:hover{background:url(../img/nav/navTit04_on.png) no-repeat center center;background-size:320px;}
#navMenu nav ul li.nav05 a:hover{background:url(../img/nav/navTit05_on.png) no-repeat center center;background-size:320px;}


/*-------------------------------
SP only
--------------------------------*/
@media screen and (max-width: 768px) {
#nav-open {
top:10px;
left:10px;
}
.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:32px;
position: relative;
color: #fff;
background:#0a70a1;
border-radius: 10px;
border: 3px solid #00a2de;
}
.pageNav li a img:hover{
filter:drop-shadow(0 0 6px #f21854);
background: #f21854;
border: 3px solid #7b2265;
}
#navMenu nav ul li.nav00 a{background:url(../img/nav/navTit00.png) no-repeat center center;background-size:60%;}
#navMenu nav ul li.nav01 a{background:url(../img/nav/navTit01.png) no-repeat center center;background-size:60%;}
#navMenu nav ul li.nav02 a{background:url(../img/nav/navTit02.png) no-repeat center center;background-size:60%;}
#navMenu nav ul li.nav03 a{background:url(../img/nav/navTit03.png) no-repeat center center;background-size:60%;}
#navMenu nav ul li.nav04 a{background:url(../img/nav/navTit04.png) no-repeat center center;background-size:60%;}
#navMenu nav ul li.nav05 a{background:url(../img/nav/navTit05.png) no-repeat center center;background-size:60%;}
/**/
#navMenu nav ul li.nav00 a:hover{background:url(../img/nav/navTit00_on.png) no-repeat center center;background-size:60%;}
#navMenu nav ul li.nav01 a:hover{background:url(../img/nav/navTit01_on.png) no-repeat center center;background-size:60%;}
#navMenu nav ul li.nav02 a:hover{background:url(../img/nav/navTit02_on.png) no-repeat center center;background-size:60%;}
#navMenu nav ul li.nav03 a:hover{background:url(../img/nav/navTit03_on.png) no-repeat center center;background-size: 60%;}
#navMenu nav ul li.nav04 a:hover{background:url(../img/nav/navTit04_on.png) no-repeat center center;background-size:60%;}
#navMenu nav ul li.nav05 a:hover{background:url(../img/nav/navTit05_on.png) no-repeat center center;background-size:60%;}	
}
/*-------------------------------
PC only
--------------------------------*/
@media screen and (min-width: 769px) {
#nav-open {
top:10px;
left: calc(50% - 500px);
}	
.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;
position: relative;
color: #fff;
background:#0a70a1;
border-radius: 10px;
border: 3px solid #00a2de;
}
.pageNav li a img:hover{
filter:drop-shadow(0 0 6px #f21854);
background: #f21854;
border: 3px solid #7b2265;
}
}