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

.drawer-open { overflow: hidden !important; }
.drawer-nav { position: fixed; z-index: 101; top: 0; /*overflow: hidden;*/ overflow: auto; width: 100vh;/*width: 16.25rem;*/  background-color: rgba(96, 76, 63, .9); transition-duration: 0.3s; height: 100%; color: #fff; line-height: 2; letter-spacing: .1em; font-family: 游明朝,"Yu Mincho",YuMincho,"Hiragino Mincho ProN",HGS明朝E,メイリオ,Meiryo,serif; }
@media screen and (max-width: 768px){
	.drawer-nav {
		background-color: rgba(96, 76, 63, .95);
	 }
}
.drawer-nav h1 { padding-top: 30px; }
.drawer-nav h1 img { display: block; height: 40px; margin: 0 auto; }
@media screen and (max-width: 768px){
	.drawer-nav h1 { padding-top: 15px; }
	.drawer-nav h1 img { /*height: 30px;*/ }
}
.drawer-nav a { color: #fff; }
.drawer-brand { font-size: 1.5rem; font-weight: bold; line-height: 3.75rem; display: block; padding-right: .75rem; padding-left: .75rem; text-decoration: none; color: #222; }
.drawer-menu { font-size: 16px; width: 14em; margin: 0 auto; padding: 0 20px 0; list-style: none; }
.drawer-menu li:hover { background-color: rgba(255,255,255,0.2); }
.drawer-menu li a { display: inline-block; padding: 6px 0; width: 100%; }
.drawer-menu li.navEnglish { border: 0; font-size: 14px; margin: 0; }
.drawer-menu li.navEnglish a {
	display: block;
	padding: 5px 0;
	border: 1px solid #9B8F86;
	border-top: none;
	font-size: 16px;
}
.drawer-menu li.navEnglish:first-of-type a {
	border-top: 1px solid #9B8F86;
}
.drawer-menu li.navSNS { display: inline; border: 0; text-align: center; margin: 10px auto 10px auto; padding: 0 5px; }
.drawer-menu li.navSNS img { display: block; width: 27px; margin: 0 5px; }
.drawer-menu li.navSNS a { padding: 0px 0; }
@media screen and (max-width: 768px){
	.drawer-menu {margin-top:2em;}
	.drawer-menu li { border-bottom: 1px solid #9B8F86; }
}

.drawer-menu-item { font-size: 1rem; display: block; padding: .75rem; text-decoration: none; color: #222; }
.drawer-menu-item:hover { text-decoration: underline; color: #555; background-color: transparent; }

.drawer-menu li.pc,
.drawer-menu li.sp { margin-bottom:20px;}
.drawer-menu li.navText { margin-bottom:20px;}

.drawer-menu li.navText { font-size: 12px; line-height: 1.2; padding: 3px 0; }
.drawer-menu li.navText a { text-decoration: underline; }

/*! overlay */
.drawer-overlay { position: fixed; z-index: 100; top: 0; left: 0; display: none; width: 100%; height: 100%; }
.drawer-open .drawer-overlay { display: block; }

/*!------------------------------------Top------------------------------------*/
.drawer--top .drawer-nav { top: -100%; left: 0; width: 100%; height: 100vh; 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; }
.drawer--top .drawer-hamburger,
.drawer--top.drawer-open .drawer-hamburger { right: 1em; }

/*!------------------------------------Left------------------------------------*/
.drawer--left .drawer-nav { left: -16.25rem; -webkit-transition: left .6s cubic-bezier(0.190, 1.000, 0.220, 1.000); transition: left .6s cubic-bezier(0.190, 1.000, 0.220, 1.000); }
.drawer--left.drawer-open .drawer-nav,
.drawer--left .drawer-hamburger,
.drawer--left.drawer-open .drawer-navbar .drawer-hamburger { left: 0; }
.drawer--left.drawer-open .drawer-hamburger { left: 16.25rem; }

/*!------------------------------------Right------------------------------------*/
.drawer--right .drawer-nav { right: -16.25rem; -webkit-transition: right .6s cubic-bezier(0.190, 1.000, 0.220, 1.000); transition: right .6s cubic-bezier(0.190, 1.000, 0.220, 1.000); }
.drawer--right.drawer-open .drawer-nav,
.drawer--right .drawer-hamburger,
.drawer--right.drawer-open .drawer-navbar .drawer-hamburger { right: 0; }
.drawer--right.drawer-open .drawer-hamburger { right: 16.25rem; }

/*!------------------------------------Hamburger------------------------------------*/
.drawer-hamburger { position: absolute; z-index: 104; top: -8px; display: block; box-sizing: content-box; width: 3rem; padding: 0; padding-top: 10px; padding-right: .75rem; padding-bottom: 30px; padding-left: .75rem; -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); -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); border: 0; outline: 0; background-color: transparent; }
.drawer-hamburger:hover { cursor: pointer; background-color: transparent; }
.drawer-hamburger-icon { position: relative; display: block; margin-top: 10px; }
.drawer-hamburger-icon,
.drawer-hamburger-icon:before,
.drawer-hamburger-icon:after { width: 100%; height: 2px; -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: #222; }
.drawer-hamburger-icon:before,
.drawer-hamburger-icon:after { position: absolute; top: -10px; left: 0; content: ' '; }
.drawer-hamburger-icon:after { top: 10px; }
.drawer-open .drawer-hamburger-icon { background-color: transparent; }
.drawer-open .drawer-hamburger-icon:before,
.drawer-open .drawer-hamburger-icon:after { top: 0; }
.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-open #header .drawer-hamburger { display: none; }
.drawer-open #globalNavi .drawer-hamburger { top: 1em; }
.drawer-open #globalNavi .drawer-hamburger-icon:before,
.drawer-open #globalNavi .drawer-hamburger-icon:after { background-color: #fff; }

@media screen and (max-width: 768px){
	.drawer-hamburger { top: -15px; right: 0 !important; }
	.drawer-open #globalNavi .drawer-hamburger { top: 0;  }
}




/*!------------------------------------accessibility------------------------------------*/
/*!* Only display content to screen readers* See: http://a11yproject.com/posts/how-to-hide-content*/
.sr-only { display:none; position: absolute; width: 100%; text-align: center; bottom: 0; left: 0; /*overflow: hidden; clip: rect(0, 0, 0, 0); width: 1px; height: 1px; margin: -1px;*/ padding: 0; border: 0; }
.drawer-open #globalNavi .sr-only { color: #fff; }

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

/*!------------------------------------Sidebar------------------------------------*/
.drawer--sidebar {  }
.drawer--sidebar .drawer-contents {  }

/*!------------------------------------Navbar------------------------------------*/
.drawer--navbarTopGutter { padding-top: 3.75rem; }
.drawer-navbar .drawer-navbar-header { border-bottom: 1px solid #ddd; background-color: #fff; }
.drawer-navbar { z-index: 102; top: 0; width: 100%; }

/*! .drawer-navbar modifier */
.drawer-navbar--fixed { position: fixed; }
.drawer-navbar-header { position: relative; z-index: 102; box-sizing: border-box; width: 100%; height: 3.75rem; padding: 0 .75rem; text-align: center; }
.drawer-navbar .drawer-brand { line-height: 3.75rem; display: inline-block; padding-top: 0; padding-bottom: 0; text-decoration: none; }
.drawer-navbar .drawer-brand:hover { background-color: transparent; }
.drawer-navbar .drawer-nav { padding-top: 3.75rem; }
.drawer-navbar .drawer-menu { padding-bottom: 7.5rem; }


/*!------------------------------------Dropdown------------------------------------*/
.drawer-dropdown-menu { display: none; box-sizing: border-box; width: 100%; margin: 0; padding: 0; background-color: #fff; }
.drawer-dropdown-menu > li { width: 100%; list-style: none; }
.drawer-dropdown-menu-item { line-height: 3.75rem; display: block; padding: 0; padding-right: .75rem; padding-left: 1.5rem; text-decoration: none; color: #222; }
.drawer-dropdown-menu-item:hover { text-decoration: underline; color: #555; background-color: transparent; }

/*! open */
.drawer-dropdown.open > .drawer-dropdown-menu { display: block; }

/*! drawer-caret */
.drawer-dropdown .drawer-caret { display: inline-block; width: 0; height: 0; margin-left: 4px; -webkit-transition: opacity .2s ease, -webkit-transform .2s ease; transition: opacity .2s ease, -webkit-transform .2s ease; transition: transform .2s ease, opacity .2s ease; transition: transform .2s ease, opacity .2s ease, -webkit-transform .2s ease; -webkit-transform: rotate(0deg); transform: rotate(0deg); vertical-align: middle; border-top: 4px solid; border-right: 4px solid transparent; border-left: 4px solid transparent; }

/*! open */
.drawer-dropdown.open .drawer-caret { -webkit-transform: rotate(180deg); transform: rotate(180deg); }

/*!------------------------------------Container------------------------------------*/
.drawer-container { margin-right: auto; margin-left: auto; }





.navi_insta_btn { cursor:pointer; margin-top:30px; text-align:right!important; display:inline!important;}
.navi_insta_link { margin:0 auto; padding:0; width:192px;}
.navi_insta_link li { margin:0!important; padding:0; width:100%; display:block; box-sizing:border-box;border-bottom: 1px solid #9B8F86;}
.navi_insta_link li a { display:block; text-align:center; padding:10px 0; margin:0; width:100%; box-sizing:border-box;}
.navi_insta_link li:nth-child(2) {}
.navi_insta_link li a span:before { content:''; display: inline-block; width:20px; height:20px; background:url(../img/icnInstagramW.png) no-repeat 50% 50%; background-size: contain; vertical-align: middle; padding-left:10px;}
