/*===========================================
clearfix
===========================================*/

.clearfix:before, .clearfix:after {
	display : block;
	overflow : hidden;
	content : "";
}

.clearfix:after {
	clear : both;
}

.clearfix {
	zoom : 1;
}


/*===========================================
all
===========================================*/

* {
	box-sizing : border-box;
}

html, body {
	color : #333333;
	font-size : 14px;
	line-height : 1.6;

	-webkit-text-size-adjust : 100%;
}


/*===========================================
wapper
===========================================*/

#wrapper {
	position : relative;
}

#contents {
	padding : 20px;
}

#disable-layer {
	display : none;
	position : fixed;
	z-index : 998;
	top : 0;
	left : 0;
	width : 100%;
	height : 100%;
	background : rgba(0, 0, 0, 0.3);
}


/*===========================================
header
===========================================*/

#header {
	display : table;
	position : fixed;
	z-index : 2;
	top : 0;
	width : 100%;

/*	padding: 10px; */
	padding : 5px;
	background : #ffffff;
	box-shadow : 0 4px 4px rgba(0, 0, 0, 0.1);
}

#header .logo {
	display : table-cell;
	font-size : 18px;
	vertical-align : middle;
}

#header .right {
	display : table-cell;
	text-align : right;
}

#header .open {
	display : inline-block;
	padding : 10px 15px;
	color : #ffffff;
	border-radius : 7px;

/*	background: #000; */
	background : #05ace0;
	cursor : pointer;
	text-decoration : none;
}


/*===========================================
global
===========================================*/

#global {
	overflow-y : auto;
	position : fixed;
	z-index : 999;
	top : 0;
	left : 100%;
	width : 280px;
	height : 100%;
	background : #ffffff;
	line-height : 1.2;
}

#global a {
	color : #333333;
	text-decoration : none;
}

#global .headline {
	display : table;
	width : 100%;
	padding : 10px;
	color : #ffffff;

/*	background: #000; */
	background : #05ace0;
	font-size : 16px;
	font-weight : normal;
}

#global .headline {
	display : block;
	padding : 15px 10px;
	color : #ffffff;

/*	background: #000; */
	background : #05ace0;
}

#global-menu li {
	border-top : 1px solid #d9d9d0;
}

#global-menu li .parent {
	display : block;
	padding : 15px 10px;
	color : #ffffff;

/*	background: #000; */
	background : #05ace0;
}

#global-menu li a {
	display : block;
	position : relative;
	padding : 15px 10px;
}

#global-menu>li>a:after {
	position : absolute;
	top : 50%;
	right : 10px;
	margin-top : -7px;

/*	content: '\f054'; */
	content : "";
}

#global-menu ul li:first-child {
	border-top : none;
}

#global-menu .children {
	background : #f3f3f1;
}



#global-menu .children li .trigger {
	display : block;
	position : relative;
	padding : 15px 10px;
	cursor : pointer;
}

#global-menu .children li .trigger:after {
	position : absolute;
	top : 50%;
	right : 10px;
	margin-top : -7px;
	content : "▼";
}

#global-menu .children li .trigger.active {
	background : #dddddd;
}

#global-menu .children li .trigger.active:after {
	position : absolute;
	top : 50%;
	right : 10px;
	margin-top : -7px;
	content : "▲";
}

#global-menu .children li .target {
	display : none;
	background : #ffffff;
}

#global-menu .children li .target.active {
	display : block;
}

#global-menu .children li .target li a:after {
	position : absolute;
	top : 50%;
	right : 10px;
	margin-top : -7px;

/*	content: '\f054'; */
	content : "";
}

#global-buttons {
	padding : 10px;
	border-top : 1px solid #d9d9d0;
}

#global-buttons a {
	color : #ffffff;
}

#global-buttons .btn-1 {
	float : left;
	width : 48.5%;
}

#global-buttons .btn-2 {
	float : right;
	width : 48.5%;
}

#global-buttons .btn-1 a, #global-buttons .btn-2 a {
	display : block;
	position : relative;
	z-index : 1;
	padding : 15px 10px;
	color : #ffffff;
	border-radius : 7px;

/*	background: #000; */
	background : #05ace0;
	font-size : 12px;
	text-align : center;
	text-decoration : none;
}

#global-pages li {
	display : table;
	float : left;
	width : 50%;
	border-top : 1px solid #d9d9d0;
}

#global-pages li a {
	display : table-cell;
	position : relative;
	padding : 15px 20px 15px 10px;
	vertical-align : middle;
}

#global-pages li a:after {
	position : absolute;
	top : 50%;
	right : 10px;
	margin-top : -10px;
	font-size : 20px;

/*	content: '\f105'; */
	content : "";
}

#global-pages li:nth-child(odd) {
	border-right : 1px solid #d9d9d0;
}

#global-close {
	/*	padding: 10px; */
	/*	background: #000; */
}

#global-close .close {
	display : block;
	position : relative;
	width : 180px;
	margin : auto;
	padding : 15px 10px;
	border-radius : 5px;
	background : #ffffff;
	font-size : 1.2rem;
	cursor : pointer;
	text-align : right;
}
#global-close .close span {
	position : absolute;
	top : 12px;
	left : 95px;
}


/*===========================================
transition
===========================================*/

#global, #wrapper {
	transition : all 0.5s ease;
}


/*===========================================
Font Awesome
===========================================*/

#global-menu>li>a:after, #global-menu .children li a:after, #global-menu .children li .trigger:after, #global-menu .children li .target li a:after, #global-pages li a:after {
	display : inline-block;
	float : left;
	font : normal normal normal 14px/1 FontAwesome;
	font-family : "FontAwesome";
	font-size : inherit;
	font-weight : normal;
	font-style : normal;

	text-rendering : auto;
	-webkit-font-smoothing : antialiased;
	-moz-osx-font-smoothing : grayscale;
}