/*!
 * jquery-drawer v3.2.2
 * Flexible drawer menu using jQuery, iScroll and CSS.
 * http://git.blivesta.com/drawer
 * License : MIT
 * Author : blivesta <design@blivesta.com> (http://blivesta.com/)
 */
/*!------------------------------------*\
	  Base
\*!------------------------------------*/

/******************************************************************************
メニュー（PC表示）
******************************************************************************/
/*!------------------------------------*\
    Hamburger
\*!------------------------------------*/
.drawer-hamburger{ display:none;}

/*!------------------------------------*\
    Menu
\*!------------------------------------*/

.drawer-nav {
	float:right;
	width:700px;
	text-align:right;
	}

/*通常メニュー*/
.drawer-menu1{
	display:inline-block;
	margin-right:1%;
	}
.drawer-menu1 li{
	position:relative;
	display:inline-block;
	padding:8px 0;
	}
.drawer-menu1 li a{
	display:block;
	color:#333333;
	font-weight:bold;
	text-decoration:none;
	padding:0 15px;
	border-left:#333333 solid 1px;
	}
.drawer-menu1 li:last-child a{
	border-right:#333333 solid 1px;
	}


/*ID必要メニュー*/
.drawer-menu2{
	display:inline-block;
	background:#ffffff;
	}
.drawer-menu2 li{
	position:relative;
	display:inline-block;
	padding:8px 0;
	}
.drawer-menu2 li a{
	display:block;
	font-weight:bold;
	font-size:0.96em;
	color:#333333;
	text-decoration:none;
	padding:0 15px;
	border-left:#333333 solid 1px;
	}
.drawer-menu2 li:first-child a{
	border-left:none;
	}
.drawer-menu2 li:first-child{
	padding-left:48px;
	}
.drawer-menu2 li:first-child::before{
	position:absolute;
	top:0;
	left:0;
	font-family:FontAwesome;
	content:'\f023';
	width:40px;
	height:100%;
	background:#96bb3d;
	text-align:center;
	color:#ffffff;
	padding-top:8px;
	}



.drawer-menu1 li a:hover,
.drawer-menu1 li a:active,
.drawer-menu2 li a:hover,
.drawer-menu2 li a:active{
	color:#cc0000;
	-webkit-transition: 0s;
	-moz-transition: 0s;
	-o-transition: 0s;
	-ms-transition: 0s;
	transition: 0s;
	}




/* メニュー（SPオンリー）---------------------*/
	.drawer-menu1 li.dispSP{ display:none;}

@media all and (-ms-high-contrast:none){
	.drawer-menu1 li,
	.drawer-menu2 li{
		padding:11px 0 5px;
		}
	.drawer-menu1 li a,
	.drawer-menu2 li a{
		position:relative;
		margin-top:-3px;
		padding-top:3px;
		}
}

@media only screen and (max-width: 1120px){
	.drawer-nav {
		font-size:0.8em;
		width:580px;
	}
}

/******************************************************************************
メニュー（SP表示）
******************************************************************************/
@media only screen and (max-width: 980px){

	.drawer-open {
		overflow: hidden !important;
		position:fixed;
		height:100vh;
	}

	/*! overlay */
	.drawer-overlay {
		position: fixed;
		z-index: 100;
		top: 0;
		left: 0;
		display: none;
		width: 100%;
		height: 100%;
		background-color: rgba(0, 0, 0, .7);
	}
	.drawer-open .drawer-overlay {
		display: block;
	}

	/*! メニューBOX */
	.drawer-nav {
		float:none;
		width:100%;
		text-align:left;
		position: fixed;
		z-index: 9999;
		overflow: hidden;
		background-color:#fff;
		border:none;
		font-size:1em;
		line-height:1em;
	}
	


	/*通常メニュー---------------------*/
	.drawer-menu1{
		display:block;
		width:92%;
		margin-left:4%;
		margin-bottom:20px;
		margin-top:20px;
		}
	.drawer-menu1 li{
		display:block;
		border-bottom:1px solid #ccc;
		font-weight:bold;
		padding:0;
		}
	.drawer-menu1 li > a{
		display:block;
		color:#2997e4;
		padding:20px 15px;
		position:relative;
		text-decoration:none;
		border-left:none;
		}
	.drawer-menu1 li:last-child a{
		border-right:none;
		}

	.drawer-menu1 > li > a:before{
		font-family: FontAwesome;
		content: '\f105';
		margin-right:5px;
		position:absolute;
		top:50%;
		line-height:0;
		right:2%;
		}

	/*ID必要メニュー*/
	.drawer-menu2{
		display:block;
		width:92%;
		margin-left:4%;
		border:#96bb3d solid 1px;
		margin-bottom:20px;
		}
	.drawer-menu2 li{
		position:relative;
		display:block;
		border-bottom:1px solid #96bb3d;
		padding:0;
		}
	.drawer-menu2 li:last-child{
		border-bottom:none;
		}
	.drawer-menu2 li a{
		display:block;
		color:#333333;
		font-weight:bold;
		text-decoration:none;
		padding:20px 15px;
		border-left:none;
		}
	.drawer-menu2 li:first-child a{
		border-left:none;
		}
	.drawer-menu2 li:first-child{
		padding-left:0;
		padding-top:30px;
		}
	.drawer-menu2 li:first-child::before{
		position:absolute;
		top:0;
		left:0;
		font-family:FontAwesome  "游ゴシック体", "Yu Gothic", YuGothic, "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo;
		content:'\f023  ID/PASS\5FC5\8981';
		width:100%;
		height:30px;
		background:#96bb3d;
		text-align:center;
		color:#ffffff;
		padding-top:8px;
		}
	.drawer-menu2 > li > a:before{
		font-family: FontAwesome;
		content: '\f105';
		margin-right:5px;
		position:absolute;
		top:50%;
		line-height:0;
		right:2%;
		color:#96bb3d;
		}
	.drawer-menu2 > li:first-child > a:before{
		top:66%;
	}

	.drawer-menu1 li > a:hover,
	.drawer-menu1 li > a:active,
	.drawer-menu2 li > a:hover,
	.drawer-menu2 li > a:active{
		background:#FFFFEA;
	}



	/* メニュー（SPオンリー）---------------------*/
		.drawer-menu1 li.dispSP{
			display:block;
			background:#ffffff;
			}
		.drawer-menu1 > li.dispSP > a:before {
			display:none;
			}
		.dw-logo img{
			width:80%;
		}
}


@media (-ms-high-contrast:none) and (max-width: 980px) {
	.drawer-menu1 li a,
	.drawer-menu2 li a{
		margin-top:0;
		padding:23px 15px 17px;
		}

}


/*!------------------------------------*\
    fadeIn
\*!------------------------------------*/

@media only screen and (max-width: 980px){

.drawer--fadeIn .drawer-nav {
	float:none;
	top: 2%;
	width: 96%;
	/*max-width:750px;*/
	height: auto;
	max-height: 96%;
	display:none;
	opacity: 0;
	padding:0;
	margin-left:auto;
	margin-right:auto;
	left: 50%;
	-webkit-transform: translateX(-50%);
	-ms-transform: translateX(-50%);
	transform: translateX(-50%);
}
.drawer--fadeIn.drawer-open .drawer-nav {
	display:block;
	opacity: 1;
	animation-duration: 0.5s;
	animation-name: fade-in;
	-moz-animation-duration: 0.5s;
	-moz-animation-name: fade-in;
	-webkit-animation-duration: 0.5s;
	-webkit-animation-name: fade-in;
	}

@keyframes fade-in {
      0% {
        display: none;
        opacity: 0;
      }
      1% {
        display: block;
        opacity: 0;
      }
      100% {
        display: block;
        opacity: 1;
      }
    }

    @-moz-keyframes fade-in {
      0% {
        display: none;
        opacity: 0;
      }
      1% {
        display: block;
        opacity: 0;
      }
      100% {
        display: block;
        opacity: 1;
      }
    }

    @-webkit-keyframes fade-in {
      0% {
        display: none;
        opacity: 0;
      }
      1% {
        display: block;
        opacity: 0;
      }
      100% {
        display: block;
        opacity: 1;
      }
    }

}
/*!------------------------------------*\
    Hamburger
\*!------------------------------------*/
@media only screen and (max-width: 980px){

	.drawer-hamburger {
		position: fixed;
		z-index: 99999;
		top: 10px;
		right: 2%;
		display: block;
		width: 50px;
		height:50px;
		padding:5px 12px 0;
		border: 0;
		outline: 0;
		color:#ffffff;
		background-color: #004fad;
		cursor: pointer;
	-webkit-box-sizing: border-box;
		 -moz-box-sizing: border-box;
			 -o-box-sizing: border-box;
			-ms-box-sizing: border-box;
					box-sizing: border-box;
	}
	.drawer-hamburger:hover {
		/*background-color: #599c9f;*/
	}
	.drawer-hamburger-icon {
		position: relative;
		display: block;
		margin-bottom:15px;
	}
	.drawer-hamburger-icon,
	.drawer-hamburger-icon:before,
	.drawer-hamburger-icon:after {
		width: 100%;
		height: 3px;
		-webkit-transition: all .6s cubic-bezier(0.190, 1.000, 0.220, 1.000);
		transition: all .6s cubic-bezier(0.190, 1.000, 0.220, 1.000);
		background-color: #fff;/*トグルナビの色変更はここ*/
	}
	
	.drawer-hamburger-icon:before,
	.drawer-hamburger-icon:after {
		position: absolute;
		top: -8px;
		left: 0;
		content: ' ';
	}
	.drawer-hamburger-icon:after {
		top: 8px;
	}
	.drawer-open .drawer-hamburger-icon {
		background-color: transparent;
	}
	.drawer-open .drawer-hamburger-icon:before,
	.drawer-open .drawer-hamburger-icon:after {
		top: 0px;
	}
	.drawer-open .drawer-hamburger-icon:before {
		-webkit-transform: rotate(45deg);
						transform: rotate(45deg);
	}
	.drawer-open .drawer-hamburger-icon:after {
		-webkit-transform: rotate(-45deg);
						transform: rotate(-45deg);
	}
	.drawer-hamburger-text{
		position:absolute;
		bottom:10px;
		line-height:0;
		right:0;
		width: 100%;
		text-align:center;
		font-size:0.9em;
	}
}
/*ここまで*/



/*!------------------------------------*\
    accessibility
\*!------------------------------------*/

/*!
 * Only display content to screen readers
 * See: http://a11yproject.com/posts/how-to-hide-content
 */

.sr-only {
  position: absolute;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  border: 0;
}

/*!
 * Use in conjunction with .sr-only to only display content when it's focused.
 * Useful for "Skip to main content" links; see http://www.w3.org/TR/2013/NOTE-WCAG20-TECHS-20130905/G1
 * Credit: HTML5 Boilerplate
 */

.sr-only-focusable:active,
.sr-only-focusable:focus {
  position: static;
  overflow: visible;
  clip: auto;
  width: auto;
  height: auto;
  margin: 0;
}