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


/*  PC用 */
@media print, screen and (min-width:769px){	
/* ナビメニュー  */	
nav div.panel{
  display:block !important;
  }

  a#menu{display:none;}

  * html nav#mainNav ul{height:1%;}
#mainNav{
	width:615px;
	float:right;
	position:relative;
}
.navi {
	width:100%;
	position:absolute;
	z-index:99999;
}
.navi li {
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  float: left;
  border: none;
  width:120px;
  margin-right:3px;
  -webkit-transform: skewX(-15deg);
  -ms-transform: skewX(-15deg);
  transform: skewX(-15deg);
  -webkit-transform-origin: bottom left;
  -ms-transform-origin: bottom left;
  transform-origin: bottom left;
	position:relative;
	display:block;

}
.skew_mask {
  overflow: hidden;
}

.skew_mask img {
	width:100%;
	min-width:127px;
  -webkit-transform: skewX(15deg);
  -ms-transform: skewX(15deg);
  transform: skewX(15deg);
  -webkit-transform-origin: bottom  left;
  -ms-transform-origin: bottom left;
  transform-origin: bottom rleft;
}
.navi li  span{display: none;}

.navi li ul{
  position: absolute;
  z-index:9999;
  top: 100%;
  left: 5px;
  margin: 0;
  padding: 0;
}
.navi li ul li{
	display: flex;
  -webkit-transform: skewX(15deg);
  -ms-transform: skewX(15deg);
  transform: skewX(15deg);
  -moz-transform-origin:50% 50%;
  -webkit-transform-origin:50% 50%;
  transform-origin:50% 50%;
}

.navi li ul li:nth-child(2){
	margin-left:10px;
}

.navi li ul li a{
	width:100%;
  padding: 12px 0;
  border-top: 1px solid #777777;
  background: #F7F7F7;
  text-align: center;
  font-size:12px;
  line-height:1em;
}
.navi li:hover > a{
  background: #B9B9B9;
  text-decoration:none;
}
.navi li a:hover{
  background: #B9B9B9;
  text-decoration:none;
}



.navi li ul{
  display: none;
}
.navi li:hover ul{
  display: block;
}


}

/* モニター幅940px以下 */
@media only screen and (max-width:768px){


/* ナビメニュー  */	
	*{
    -webkit-box-sizing: border-box;
       -moz-box-sizing: border-box;
         -o-box-sizing: border-box;
        -ms-box-sizing: border-box;
            box-sizing: border-box;
	}
	
	nav#mainNav{
	clear:both;
	width:100%;
	margin:0 auto;
	padding:0;
	background: -webkit-gradient(linear, left top, left bottom, color-stop(1, #054b83), color-stop(0.00, #3769a5));
	background: -webkit-linear-gradient(top, #3769a5 0%, #054b83 100%);
	background: -moz-linear-gradient(top, #3769a5 0%, #054b83 100%);
	background: -o-linear-gradient(top, #3769a5 0%, #054b83 100%);
	background: -ms-linear-gradient(top, #3769a5 0%, #054b83 100%);
	background: linear-gradient(top, #3769a5 0%, #054b83 100%);
	font-size:14px;
	}

	nav#mainNav a.menu{
	width:100%;
	display:block;
	height:40px;
	line-height:40px;
	font-weight: bold;
	text-align:left;
	color:#fff;
	}

	nav#mainNav a#menu span{padding-left:10px;}
	nav#mainNav a.menu span:before{content: "→ ";}
	nav#mainNav a.menuOpen span:before{content: "↓ ";}

	nav#mainNav a#menu:hover{cursor:pointer; text-decoration:none;}

	nav .panel{
	display: none;
	width:100%;
	position: relative;
	right: 0;
	top:0;
	z-index: 1;
	}



	nav#mainNav ul li{
	  margin-right:0;
	  transform: none;
	  text-align:left;
	float: none;
	clear:both;
	width:100%;
	height:auto;
	line-height:1.2;
	}

	nav#mainNav ul li a,nav#mainNav ul li.current-menu-item li a{
	display: block;
	padding:15px 10px;
	text-align:left;
	border-bottom:1px dashed #fff;
	color:#fff;
	background:#054b83;
	}
	
	nav#mainNav ul li:first-child a{border-top:1px dashed #fff;}
	
	nav#mainNav ul li:last-child a{border:0;}
	
	nav#mainNav ul li.active a,nav#mainNav ul li a:hover{background:#3769a5; text-decoration:none;}

	nav div.panel{float:none;}
	.skew_mask {
		display:none;
	}
	.navi li  span{display:block;}
	.navi li ul, .navi li:hover ul{
	  display: none;
	}
}