/*!
 * 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/)
 */

/*!------------------------------------*\
		Navbar
\*!------------------------------------*/

*,
*::before,
*::after {
-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-menu{
	margin:0 auto;
	padding:20px 20px 40px;
	}
.drawer-menu > ul{
	float:none;
	width:100%;
	padding-right:0;
	}
.drawer-menu > ul > li{
	display:block;
	border-bottom:1px solid #fff;
	}
.drawer-menu > ul > li > a{
	display:block;
	padding:15px;
	position:relative;
	text-decoration:none;
	font-weight:bold;
	background:#2f62ad;
	color:#fff;
	}

.drawer-menu > ul > li > a:before{
	display:inline-block;
	vertical-align:middle;
	font-family:"Font Awesome 6 Free";
	font-weight:900;/*solid icons*/
	content:"\f352";
	margin-right:10px;
	}

.drawer-menu > ul > li:after {display: block; content:''; clear: both; height: 0; visibility: hidden; }
.drawer-menu > ul > li > a:hover{
	background:#123d7c;
	}
/*SPオンリー*/
.drawer-menu > ul > li.dispSP{ display:block;}

/*ロゴ*/
.drawer-menu > ul > li.logo {
	float:none;
	padding-right:50px;
	width:100%;
	max-width:100%;
	}
.drawer-menu > ul > li.logo a{background:#fff;}
.drawer-menu > ul > li.logo a:before{ display:none;}

/*お問い合わせ*/
.drawer-menu > ul > li.dw-mail a{background:#319041;}
.drawer-menu > ul > li.dw-mail a:hover,
.drawer-menu > ul > li.dw-mail a:active,
.drawer-menu > ul > li.dw-mail a.navActive{ background:#1d6729;}
.drawer-menu > ul > li.dw-mail i{ margin-right:4px;}
/*iPROS*/
.drawer-menu > ul > li.dw-iPROS a{background:#123d7c;}
.drawer-menu > ul > li.dw-iPROS img{ display:inline-block; vertical-align:middle; height:18px;}
.drawer-menu > ul > li.dw-iPROS a:hover,
.drawer-menu > ul > li.dw-iPROS a:active,
.drawer-menu > ul > li.dw-v a.navActive{ background:#072653;}
.drawer-menu > ul > li.dw-iPROS a:hover img,
.drawer-menu > ul > li.dw-iPROS a:active img{ opacity:1;}
/*sns*/
.drawer-menu > ul > li.dw-sns{ text-align:center; padding:10px 0; border-bottom:#ddd solid 1px;}
.drawer-menu > ul > li.dw-sns p{ display:inline-block; vertical-align:middle; font-size:2em; line-height:1em; margin:10px;}
.drawer-menu > ul > li.dw-sns a{ background:inherit; color:#222;}
.drawer-menu > ul > li.dw-sns a:hover,
.drawer-menu > ul > li.dw-sns a:active{color:#c00;}
/*tel*/
.drawer-menu > ul > li.dw-tel a{ background-color:#2f62ad;}
.drawer-menu > ul > li.dw-tel a:before{ display:none;}
.drawer-menu > ul > li.dw-tel img{ max-height:60px; margin:auto;}
.drawer-menu > ul > li.dw-tel a:hover,
.drawer-menu > ul > li.dw-tel a:active{ background-color:#123d7c;}


@media only screen and (min-width: 1140px){
	.drawer-menu{ padding:0;}
	.drawer-menu:after {
		content: '';
		display: block;
		clear: both;
		height: 0;
		visibility: hidden;
		}
	.drawer-menu > ul{ text-align:right;}
	.drawer-menu > ul > li{
		display:inline-block;
		border:none;
		height:66px;
		font-size:0;
		line-height:0;
		}
	.drawer-menu > ul > li > a{
		display:block;
		position:relative;
		height:100%;
		padding:20px 5px;
		text-decoration:none;
		background:inherit;
		color:#222;
		font-size:1.46rem;
		line-height:1.5em;
		}
	.drawer-menu > ul > li > a:hover,
	.drawer-menu > ul > li > a:active{
		color:#fff !important;
		background:#2e62ad;
		}

	.drawer-menu > ul > li > a.navActive{ color:#123d7c;}

	.drawer-menu > ul > li > a:before{
		display:none;
		}
	.drawer-menu > ul > li > a img{display:inline-block; !important; vertical-align:-2px;}

	/*SPオンリー*/
	.drawer-menu > ul > li.dispSP{ display:none;}
	/*ロゴ*/
	.drawer-menu > ul > li.logo{}
	/*お問い合わせ*//*iPROS*/
	.drawer-menu > ul > li.dw-mail,
	.drawer-menu > ul > li.dw-iPROS{ vertical-align:top; height:40px;margin-left:5px;}
	.drawer-menu > ul > li.dw-iPROS{}
	.drawer-menu > ul > li.dw-mail a,
	.drawer-menu > ul > li.dw-iPROS a{
		color:#fff;
		padding:8px 10px;
		border-radius: 0 0 8px 8px / 0 0 8px 8px;
		-moz-border-radius: 0 0 8px 8px / 0 0 8px 8px;
		-webkit-border-radius: 0 0 8px 8px / 0 0 8px 8px;
		}
}

@media only screen and (min-width: 1200px){
		.drawer-menu > ul > li > a{font-size:1.6rem;line-height:1.5em;}

}
@media only screen and (min-width: 1380px){
	.drawer-menu > ul > li > a{padding:20px 15px;}
	.drawer-menu > ul > li.dw-mail a,
	.drawer-menu > ul > li.dw-iPROS a{padding:8px 20px;}

}







/*!------------------------------------*\
    Dropdown
\*!------------------------------------*/

.drawer-dropdown{
	/*position:relative;*/
	}
.drawer-dropdown > a{
	position:relative;
	display:block;
	}
.drawer-dropdown > a:hover,
.drawer-dropdown > a:active,
.drawer-dropdown > a.navActive{
	}

.drawer-menu > ul > li.drawer-dropdown > a:before{
	display:inline-block;
	vertical-align:middle;
	font-family:"Font Awesome 6 Free";
	font-weight:900;/*solid icons*/
	content:"\f350";
	margin-right:10px;
	}

.drawer-dropdown-menu {
  display: block;
  box-sizing: border-box;
  width: 100%;
  margin: 0;
  padding: 0;
  background-color:#fff;
	position:relative;
	z-index:888;
	font-size:0.9em;	
	}
.drawer-dropdown-menu li {
  width: 100%;
  list-style: none;
	border-bottom:#ccc dotted 1px;
	}
.drawer-dropdown-menu li:last-child{
	border-bottom:none;
	}
.drawer-dropdown-menu li > a {
	position:relative;
  display: block;
  padding: 10px 10px 10px 15px;
  text-decoration: none;
  background-color:#fff;
	color:#222;
	}
.drawer-dropdown-menu li > a:before{
	position:absolute;
	right:22px;
	top:14px;
	display:block;
	font-family:"Font Awesome 6 Free";
	font-weight:900;/*solid icons*/
	content:"\f054";
	color:#2f62ad;
	}
.drawer-dropdown-menu li > a:hover,
.drawer-dropdown-menu li > a:active
.drawer-dropdown-menu li > a.navActive{
	background:#F0FAFF;
	color:#2e62ad;
	}

.drawer-dropdown-menu li  br{
	display:none;
	}
/* ユーザー仕様 */
.dw-ico{
	display:inline-block;
	vertical-align:middle;
	margin-right:10px;
	}
.dw-ico img{height:29px;}


@media only screen and (min-width: 1140px){
	.drawer-menu{position: relative; z-index:101;}
	.drawer-menu > ul {}
	.drawer-dropdown > a{
		/*pointer-events: none;/*リンク無効化*/
		cursor:pointer;
		}

	.drawer-menu > ul > li.drawer-dropdown > a:before{display:none;}


	.drawer-dropdown-menu {
		position: absolute;
		top: 100%; /* 親項目の直下に配置 */
		left: 0;
		visibility: hidden; /* 下層メニューを非表示 */
		background:rgba(47,98,173,.95);
		margin-left: -webkit-calc(-3% - 300px);
		margin-left: calc(-3% - 300px);
		width: 100%;
    width: -webkit-calc(106% + 600px) !important;
    width: calc(106% + 300px) !important;
		}
	.drawer-dropdown-menu > div {
			width:96%;
			max-width:1200px;/*サイトの幅に調整****************/
			margin:auto;
			}
	.drawer-dropdown-menu > div:aftre{
			content: "";
			display: block;
			clear: both;
			height: 0;
			visibility: hidden;
			}

  /*! dropdown */
  .drawer-dropdown.open .drawer-dropdown-menu,
	.drawer-dropdown:hover .drawer-dropdown-menu,
	.drawer-dropdown:hover ul li{
			visibility: visible; /* 下層メニューを表示 */
		}
  .drawer-dropdown.open > a ,
  .drawer-dropdown:hover > a {
		background:#2e62ad !important;
		color:#fff;
		}
	 /*! dropdown-menu */
	.drawer-dropdown-menu li{
		border-bottom:none;
		font-size:1.4rem;
		line-height:1.2em;
		padding:10px 0;
		text-align:left;
		float:left;
		margin:0;
		}
	.drawer-dropdown-menu .dw-column3 li{ width:33.3333%;}
	.drawer-dropdown-menu .dw-column4 li{ width:25%;}
	.drawer-dropdown-menu .dw-column5 li{ width:20%;}
	.drawer-dropdown-menu li > a {
		display:table;
		vertical-align:middle;
		width:100%;
		padding: 10px;
		background-color:inherit;
		color:#fff;
		border-left:#fff solid 1px;
		}
	.drawer-dropdown-menu li:last-child > a,
	.drawer-dropdown-menu .dw-column3 li:nth-child(3n) > a,
	.drawer-dropdown-menu .dw-column4 li:nth-child(4n) > a,
	.drawer-dropdown-menu .dw-column5 li:nth-child(5n) > a {
		border-right:#fff solid 1px;
		}


	.drawer-dropdown-menu li > a:hover,
	.drawer-dropdown-menu li > a:active{
		background-color:#123d7c;
		color:#fff;
		}
	.drawer-dropdown-menu li > a:before{
		display:none;
		}
	.drawer-dropdown-menu span{
		display:table-cell;
		vertical-align:middle;
		}
.drawer-dropdown-menu li  br{
	display:block;
	}

	/* ユーザー仕様 */
	.dw-ico{
		display:table-cell;
		vertical-align:middle;
		width:74px;
		padding-right:10px;
		margin-right:0;
		}
	.dw-ico img{height:50px;}



	.drawer-dropdown .drawer-caret {
		display:none;
	}

}



/*!------------------------------------*\
    Base
\*!------------------------------------*/

.drawer-open {
  overflow: hidden !important;
}
/*! overlay */

.drawer-overlay {
  position: fixed;
  z-index: 100;
  top: 0;
  left: 0;
  display: none;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, .8);
}

.drawer-open .drawer-overlay {
  display: block;
}
.drawer-open .drawer-nav{
  overflow: auto;
  -webkit-overflow-scrolling: touch;
}





/*!------------------------------------*\
    Top
\*!------------------------------------*/
/*! メニューBOX */
.drawer-nav {
	position: fixed;
	z-index: 802;
	overflow: hidden;
	background-color:#fff;
	border:none;
}
.drawer--top .drawer-nav {
  top: -100%;
  left: 0;
  width: 100%;
  height: auto;
  max-height: 100%;
  -webkit-transition: top .6s cubic-bezier(0.190, 1.000, 0.220, 1.000);
  transition: top .6s cubic-bezier(0.190, 1.000, 0.220, 1.000);
}

.drawer--top.drawer-open .drawer-nav {
  top: 0;
}

/*PC*/
@media only screen and (min-width : 1140px){
	.drawer--top .drawer-nav {
		position:fixed;
		left:auto;
		right:2%;
		top:0 !important;
		display:block !important;
		opacity:1 !important;
		padding:0 !important;
		overflow: initial;
		background-color:inherit;
		width : -webkit-calc(96% - 300px) ;
		width : calc(96% - 300px) ;
	}


}


/*!------------------------------------*\
    Hamburger
\*!------------------------------------*/


.drawer-hamburger {
  display: block;
  position:fixed;
  z-index: 99999;
  top: 2px;
  right: 2px;
  width: 50px;
  height:50px;
  padding:4px 10px 0;
  border: 0;
  outline: 0;
	color:#ffffff;
	background-color: #2f62ad;
  cursor: pointer;
	border-radius:3px;
	-moz-border-radius:3px;
	-webkit-border-radius:3px;
-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: #002c76;
}
.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.8em;
}
@media only screen and (min-width: 1140px){
	.drawer-hamburger{display:none;}
}


/*!------------------------------------*\
    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;
}
