*!------------------------------------*\
    Base
\*!------------------------------------*/
.drawer-open{
	overflow:hidden!important;
}
.drawer-nav{
	position:fixed;
	top:0;
	overflow:hidden;
	width:220px;
	width:18.25rem;
	height:100%;
	color:#000;
	padding-top: 20px;
	z-index: 300;
}
.drawer-nav hr{
	border: 0;
	border-top: solid 1px #A7C0A4;
	height: 12px;
	margin-top: 12px;
}

.drawer-brand{
	font-size:24px;
	font-size:1.5rem;
	font-weight:700;
	line-height:60px;
	line-height:3.75rem;
	display:block;
	padding-right:9pt;
	padding-right:.75rem;
	padding-left:9pt;
	padding-left:.75rem;
	text-decoration:none;
	color:#fff;
}
.drawer-menu{
	margin:20px 0 0 0;
	padding:0;
	list-style:none
}
.drawer-menu-item{
	font-size:14px !important;
	display:block;
	padding:5px 0 6px 35px !important;
    margin: 5px 0 !important;
	text-decoration:none;
	color:#fff
}
.en-spnavi .drawer-menu-item{
	font-size:13px !important;
	display:block;
	padding:5px 0 6px 25px !important;
    margin: 5px 0 !important;
	text-decoration:none;
	color:#fff;
    transition: 0.2s;
}
.drawer-menu-item:hover{
	color:#2a6419;
	background-color:#fff;
    font-weight: 500;
    transition: 0.2s;
}
.nolink a{
    color: #888 !important;
    pointer-events: none !important;
}
/*! overlay */
.drawer-overlay{
	position:fixed;
	z-index:200;
	top:0;
	left:0;
	display:none;
	width:100%;
	height:100%;
	background-color:transparent;
}
.drawer-open .drawer-overlay{
	display:block;
}

/*!------------------------------------*\
    Top
\*!------------------------------------*/
.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
}
.drawer--top .drawer-hamburger,.drawer--top.drawer-open .drawer-hamburger{
	right:0
}

/*!------------------------------------*\
    Left
\*!------------------------------------*/
.drawer--left .drawer-nav{
	left:-220px;
	left:-18.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-hamburger,.drawer--left.drawer-open .drawer-nav,.drawer--left.drawer-open .drawer-navbar .drawer-hamburger{
	left:0
}
.drawer--left.drawer-open .drawer-hamburger{
	left:220px;
	left:18.25rem
}
/*!------------------------------------*\
    Right
\*!------------------------------------*/
.drawer--right .drawer-nav{
	background-image: url("../images/navi_bg2.png");
	margin-top: 0;
	right:-220px;
	right:-18.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-hamburger,.drawer--right.drawer-open .drawer-nav,.drawer--right.drawer-open .drawer-navbar .drawer-hamburger{
	right:0
}
.drawer--right.drawer-open .drawer-hamburger{
	right:220px;
	right:18.25rem
}
/*!------------------------------------*\
    Hamburger
\*!------------------------------------*/

.drawer-hamburger{
	position:fixed;
	z-index:300;
	top:20px;
	display:block;
	box-sizing:content-box;
	width:18px;
	padding:0;
	padding-right:1px;
	padding-left:1px;
	padding:5px 7px 14px;
	right: 10px !important;
	-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:#000;
	margin-top: 10px;
    border-radius: 3px;
    cursor: pointer;
    transition: 1.0s;
}

.drawer-hamburger.fixed{
    top:3px;
    transition: 0.40s;
}

@media screen and ( max-width: 768px ) {
	.drawer-menu{
		margin:-8px 0 0 0 !important;
	}
.drawer-hamburger{
		top:0 !important;
	}
	.drawer-nav{
		top:0 !important;
	}
	.drawer-menu-item{
		font-size:14px !important;
		line-height: 120% !important;
		padding:6px 0 4px 35px !important;
	}
}


.drawer-hamburger:active{
	cursor:pointer;
	background-color:#ccc;
}
	
.drawer-hamburger-icon{
	position:relative;
	display:block;
	margin-top:10px
}
	
.drawer-hamburger-icon,.drawer-hamburger-icon:after,.drawer-hamburger-icon:before{
	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:#fff
}

.drawer-hamburger-icon:after,.drawer-hamburger-icon:before{
	position:absolute;
	top:-6px;
	left:0;content:' '
}
	
.drawer-hamburger-icon:after{
	top:6px
}
.drawer-open .drawer-hamburger-icon{
	background-color:transparent
}
.drawer-open .drawer-hamburger-icon:after,.drawer-open .drawer-hamburger-icon:before{
	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)
}
/*!------------------------------------*\
    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
}
/*!------------------------------------*\
    Sidebar
\*!------------------------------------*/
.drawer--sidebar,.drawer--sidebar .drawer-contents{
	background-color:#fff
}
@media (min-width:64em){
	.drawer--sidebar .drawer-hamburger{
		display:none;
		visibility:hidden
	}
	.drawer--sidebar .drawer-nav{
		display:block;
		-webkit-transform:none;
		transform:none;
		position:fixed;
		width:12.5rem;
		height:100%
	}

  /*! Left */
  .drawer--sidebar.drawer--left .drawer-nav{
 	 	left:0;
		border-right:1px solid #ddd
	}
	.drawer--sidebar.drawer--left .drawer-contents{
		margin-left:12.5rem
	}

  /*! Right */
  .drawer--sidebar.drawer--right .drawer-nav{
  		right:0;
		border-left:1px solid #ddd
	}
	.drawer--sidebar.drawer--right .drawer-contents{
		margin-right:12.5rem
	}

  /*! container */
  .drawer--sidebar .drawer-container{
  		max-width:48rem
	}
}

@media (min-width:75em){
	.drawer--sidebar .drawer-nav{
		width:16.25rem
	}
	.drawer--sidebar.drawer--left .drawer-contents{
		margin-left:16.25rem
	}
	.drawer--sidebar.drawer--right .drawer-contents{
		margin-right:16.25rem
	}

  /*! container */
  .drawer--sidebar .drawer-container{
  		max-width:60rem
	}
}

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

/*! .drawer-navbar modifier */
.drawer-navbar--fixed{
	position:fixed
}
.drawer-navbar-header{
	position:relative;
	z-index:3;
	box-sizing:border-box;
	width:100%;
	height:60px;
	height:3.75rem;
	padding:0 9pt;
	padding:0 .75rem;
	text-align:center
}
.drawer-navbar .drawer-brand{
	line-height:60px;
	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:60px;
	padding-top:3.75rem
}
.drawer-navbar .drawer-menu{
	padding-bottom:90pt;
	padding-bottom:7.5rem
}
@media (min-width:64em){
	.drawer-navbar{
		height:3.75rem;
		border-bottom:1px solid #ddd;
		background-color:#fff
	}
	.drawer-navbar .drawer-navbar-header{
		position:relative;
		display:block;
		float:left;
		width:auto;
		padding:0;
		border:0
	}
	.drawer-navbar .drawer-menu--right{
		float:right
	}
	.drawer-navbar .drawer-menu li{
		float:left
	}
	.drawer-navbar .drawer-menu-item{
		line-height:3.75rem;
		padding-top:0;
		padding-bottom:0
	}
	.drawer-navbar .drawer-hamburger{
		display:none
	}
	.drawer-navbar .drawer-nav{
		position:relative;
		left:0;
		overflow:visible;
		width:auto;
		height:3.75rem;
		padding-top:0;
		-webkit-transform:translate3d(0,0,0);
		transform:translate3d(0,0,0)
	}
	.drawer-navbar .drawer-menu{
		padding:0
	}

  /*! dropdown */
  .drawer-navbar .drawer-dropdown-menu{
		position:absolute;
		width:16.25rem;
		border:1px solid #ddd
	}
.drawer-navbar .drawer-dropdown-menu-item{
		padding-left:.75rem
	}
}

/*!------------------------------------*\
    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:60px;
	line-height:3.75rem;
	display:block;
	padding:0;
	padding-right:9pt;
	padding-right:.75rem;
	padding-left:24px;
	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:-webkit-transform .2s ease,opacity .2s ease;transition:transform .2s ease,opacity .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
}
@media (min-width:64em){
	.drawer-container{
		max-width:60rem
	}
}

@media (min-width:75em){
	.drawer-container{
		max-width:70rem
	}
}
.fi{
	display:inline-block;
	width:1em;
	height:1em;
	vertical-align:text-bottom
}
.fi--2x,.fi--3x,.fi--4x,.fi--full{
	vertical-align:middle
}
.fi--2x{
	width:2em;
	height:2em
}
.fi--3x{
	width:3em;
	height:3em
}
.fi--4x{
	width:4em;
	height:4em
}
.fi--full{
	width:100%;
	height:auto
}
.fi--round{
	border-radius:4px
}
.fi--circle{
	border-radius:50%
}
.fi--fill{
	background-color:#ccc
}
.fi--border{
	border:1px solid #ccc
}

.diff .hljs-header,.hljs-comment{
	color:#998;
	font-style:italic
}
.css .rule .hljs-keyword,.hljs-keyword,.hljs-request,.hljs-status,.hljs-subst,.hljs-winutils,.nginx .hljs-title{
	color:#333;
	font-weight:700
}
.hljs-hexcolor,.hljs-number,.ruby .hljs-constant{
	color:teal
}
.hljs-doctag,.hljs-string,.hljs-tag .hljs-value,.tex .hljs-formula{
	color:#d14
}
.hljs-id,.hljs-title,.scss .hljs-preprocessor{
	color:#900;
	font-weight:700
}
.hljs-list .hljs-keyword,.hljs-subst{
	font-weight:400
}
.hljs-class .hljs-title,.hljs-type,.tex .hljs-command,.vhdl .hljs-literal{
	color:#458;
	font-weight:700
}
.django .hljs-tag .hljs-keyword,.hljs-rule .hljs-property,.hljs-tag,.hljs-tag .hljs-title{
	color:navy;
	font-weight:400
}
.hljs-attribute,.hljs-name,.hljs-variable,.lisp .hljs-body{
	color:teal
}
.hljs-regexp{
	color:#009926
}
.clojure .hljs-keyword,.hljs-prompt,.hljs-symbol,.lisp .hljs-keyword,.ruby .hljs-symbol .hljs-string,.scheme .hljs-keyword,.tex .hljs-special{
	color:#990073
}
.hljs-built_in{
	color:#0086b3
}
.hljs-cdata,.hljs-doctype,.hljs-pi,.hljs-pragma,.hljs-preprocessor,.hljs-shebang{
	color:#999;
	font-weight:700
}
.hljs-deletion{
	background:#fdd
}
.hljs-addition{
	background:#dfd
}
.diff .hljs-change{
	background:#0086b3
}
.hljs-chunk{
	color:#aaa
}
.Button--fill svg{
	fill:#fff
}
.label{
	display:inline-block;
	font-weight:700;
	margin-bottom:2px;
	padding:9pt 24px;
	padding:.75rem 1.5rem;
	background-color:#f5f5f5
}
.carbon{
	font-size:80%;
	min-height:75pt;
	margin-bottom:20px;
	padding:9pt;
	padding:.75rem;
	background-color:#fafafa
}
.carbon a{
	text-decoration:none;
	color:#757575
}
.carbon img{
	float:left;
	margin-right:9pt;
	margin-right:.75rem;
	margin-bottom:9pt;
	margin-bottom:.75rem
}
.carbon .carbon-poweredby{
	display:block;
	margin-top:8px;
	margin-top:.5rem
}