@charset "utf-8";

/*body--------------------------------------------------------------*/

body
{
	margin			: 0 auto;
	padding			: 0;
	font			: 16px/1.6 Meiryo, 'メイリオ', 'Hiragino Kaku Gothic Pro', 'ヒラギノ角ゴ Pro W3', 'ＭＳ Ｐゴシック', 'Lucida Grande', 'Lucida Sans Unicode', sans-serif;
	color			: #333;
	background		: #EEE;
	text-align		: center;
	-webkit-text-size-adjust		: 100%;
}

/*Opera用*/
html:first-child body
{
	font			: 16px/1.5  Meiryo, 'メイリオ', 'Hiragino Kaku Gothic Pro', 'ヒラギノ角ゴ Pro W3', 'ＭＳ Ｐゴシック', 'Lucida Grande', 'Lucida Sans Unicode', sans-serif;
}

div,form,map
{
	margin			: 0;
	padding			: 0;
}

p
{
	margin-top      : 0;
	padding         : 0;
}

img
{
	border			: 0;
	vertical-align  : top;
}

/*システムが絡む場合、GoogleMapを使用する場合は消す*/
table
{
	margin-left		: auto;
	margin-right	: auto;
}

#side p,#side h1,#side #side h2,#side h3,
#header p,#header h1,#header h2,#header h3,
#footer p,#footer h1,#footer h2,#footer h3
{
	margin			: 0;
	padding 		: 0px; 
	font			: normal 1em  Meiryo, 'メイリオ', 'Hiragino Kaku Gothic Pro', 'ヒラギノ角ゴ Pro W3', 'ＭＳ Ｐゴシック', 'Lucida Grande', 'Lucida Sans Unicode', sans-serif;
	text-align		: left;
}

/*link--------------------------------------------------------------*/

a:link,
a:visited
{
	color           : #fc9d33; 
	text-decoration : none;
}

a:hover,
a:active
{
	color           : #fc9d33; 
	text-decoration : none;
}
#wrapper
{
	width 				: 100%;
	margin 				: 0px;
	padding-top 		: 61px; 
}

/*▼auth------------------------------------------------------------*/

body#auth_body
{
	width 				: 100%;
	height 				: 100vh;

}
#auth_wrapper
{
	width 				: 100%;
	height 				: 100vh;
	background 			: url("../images/common/base/login_bg.jpg") 50% 50% / cover no-repeat;
	position 			: relative;
	overflow 			: hidden;

}

#auth_body .auth_container
{
	width 				: 80%;
	padding 			: 10px 15px;
	background 			: #FFF;
	position 			: absolute;
	top 				: 50%;
 	 left 				: 50%;
 	 transform 			: translateY(-50%) translateX(-50%);
 	 -webkit- transform : translateY(-50%) translateX(-50%);
	 border-top 		: 5px solid #4a660b;
	 border-bottom 		: 5px solid #cccccc;

}
#auth_body .auth_container img
{
	max-width 			: 100%;
	height 				: auto;
}
#auth_body .system_name
{
	width 				: 60%;
	margin 				: 0 auto 10px; 
}
#auth_body .login_sub_text
{
	font-size 			: 14px;
	width 				: 100%;
	position 			: relative;
	padding-left 		: 30px;
	box-sizing 			: border-box;
	text-align 			: left;
	margin-bottom 		: 5px;
	line-height 		: 1.3em; 
}
#auth_body .login_sub_text span
{
	color 				: #425f00;
	font-weight 		: bold;
}
#auth_body .login_sub_text .fa-arrow-circle-down
{
	color 				: #425f00;
	font-size 			: 22px;
	position 		 	: relative;
	right 				: 5px;
   	top 				: 13px;
  -webkit-transform 	: translateY(-50%);
  -ms-transform 		: translateY(-50%);
  transform 			: translateY(-50%);
  line-height 			: normal;
}
#auth_body .auth_input_area
{
	background 			: #425f00;
	padding 			: 15px;
	border-radius 		: 3px;
-webkit-border-radius 	: 3px;
-moz-border-radius 		: 3px;
	width 				: 100%;
	box-sizing 			: border-box;
	position 			: relative;
	margin-bottom 		: 15px; 
}
#auth_body .auth_input_area:before
{
	content: "";
	width 				: 0;
	height 				: 0;
	border-left 		: 10px solid transparent;
	border-right 		: 10px solid transparent;
	border-top 		 	: 10px solid #425f00;
	position 			: absolute;
	bottom 				: -9px;
	left 				: 50%;
  -webkit-transform 	: translateX(-50%);
  -ms-transform 		: translateX(-50%);
  transform 			: translateX(-50%);

}
.auth_input_area dl,
.auth_input_area dt,
.auth_input_area dd
{
	margin 				: 0px;
	padding 			: 0px;
	list-style 			: none;
}
.auth_input_area dt
{
	text-align 			: left;
	color 				: #FFF;
	padding 			: 0px 0px 5px; 
}
.auth_input_area dt .fa-user,
.auth_input_area dt .fa-unlock-alt
{
	margin-left 		: 5px;
	vertical-align 		: middle;
	font-size 			: 16px;
	margin-top 			: -2px; 
}
.auth_input_area dd
{
	padding 			: 0px 0px 8px;

}
.auth_input_area dl:last-child dd
{
	padding-bottom 		: 0px; 
}
.auth_input_area input
{
   	font-size:16px;
	border: none;
    padding: 7px 0.8em;
	margin: 0px;
	box-sizing 	: border-box;
	width : 100%;
 	background: transparent;
-webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}

.auth_input_area .input_area_text
{
    box-shadow: inset 0 4px 4px rgba(0,0,0,0.4);
	display: block;
    border-radius:3px;
	width 		: 100%;
	background: #FFF;
}



#auth_body .login_btn button
{
        background-color 		: transparent;
        border 					: none;
        cursor 				 	: pointer;
        outline 				: none;
        padding 				: 0;
        appearance 				: none;
		display 				: block;
		width 					: 95%;
		margin 					: 0 auto 10px;

}
#auth_body .login_btn button:hover
{
	opacity 					: 0.9;
}
#auth_body .login_btn button span.btn
{
		display 				: table;
		background 				: url("../images/common/base/login_btn_bg.png") 0 0 / auto 100% repeat-x;
		width 					: 99%;
		border 					: 1px #fb6c00 solid;
			border-radius 			: 3px;
 	-webkit-border-radius 		: 3px;
 	-moz-border-radius 			: 3px;
		color 					: #FFF;
		box-sizing 				: border-box;
}

#auth_body .login_btn button span.text,
#auth_body .login_btn button span.arrow
{
	display 					: table-cell;
	vertical-align 				: middle;
	font-weight 				: bold;
	font-size 					: 20px;
	font-weight 				: bold;
	text-align 					: center;
	vertical-align 				: middle;
	padding 					: 10px; 
}
#auth_body .login_btn button span.text
{
	border-right 				: 1px solid #ffc55f; 
}
#auth_body .login_btn button span.arrow
{
	border-left 				: 1px #fb6c00 solid;
	width 						: 15%;
	text-align: center;
}
#auth_body .login_btn button span.arrow img
{
	width 						: 20px;
	height 						: auto;
}
#auth_body .resetting
{
	margin-bottom 				: 0px; 
}
#auth_body .resetting a
{
	color 						: #fb6c00
}


/*▼header------------------------------------------------------------*/

#header
{
	background 			: #FFF;
	box-shadow 			: rgba(0, 0, 0, 0.0470588) 0px 0px 1px 3px;
-webkit-box-shadow 		: rgba(0, 0, 0, 0.0470588) 0px 0px 1px 3px;
-moz-box-shadow 		: rgba(0, 0, 0, 0.0470588) 0px 0px 1px 3px;
 	text-align 			: center;
	width 				: 100%;
	position 			: fixed;
	box-sizing 			: border-box;
	z-index 			: 100;
	height 				: 58px; 
	top 				: 0px;
	left 				: 0px; 
	border-bottom: 1px #CCC solid;
}
#header .admin
{
	position 			: absolute;
	right 				: 10px;
	top 				: 50%;
  -webkit-transform 	: translateY(-50%);
  -ms-transform 		: translateY(-50%);
  transform 			: translateY(-50%);
  font-size 			: 12px;
  width 				: 96px;
  text-align: right;
}
#header .admin span.name
{
	font-weight 		: bold;
	display				: -moz-inline-box;
    display				: inline-block;
    /display			: inline;
    /zoom				: 1;
    vertical-align 		: top;
}


#header .logo
{
	position 			: absolute;
 	 top 				: 47%;
 	 left 				: 50%;
 	 transform 			: translateY(-50%) translateX(-50%);
 	 -webkit- transform : translateY(-50%) translateX(-50%);
	 width 				: 120px; 
}
#header .logo img
{
	width 				: 100%; 
	height 				:  auto;
}


/*▼side------------------------------------------------------------*/

#side {
    width: 200px;
    position: fixed;
    top: 58px;
    left: -200px;
    height: 100%;
    background: #425f00;
    z-index: 260;
    font-size: 14px;
	-webkit-transition: all 0.5s ease;
 	-moz-transition: all 0.5s ease;
 	-o-transition: all 0.5s ease;
	transition: all 0.5s ease;
}
#main_contents.open #side
{
	left 	: 0px; 		 
}
#main_contents
{
	display: block;
	width 	: 100%; 
}

#side .nav_btn span
{
	background 	: #425f00 url("../images/common/icon/menu_open.png") 50% 50% no-repeat;
	display 	: block;
	width 		: 54px;
	height 		: 58px;
	cursor 		: pointer;
}
#side .nav_btn
{
	top 		: 0px;
	left 		: 0px; 
	position 	: fixed;
	z-index 	: 270;
}

#main_contents.open .nav_btn span
{
	background 	: #425f00 url("../images/common/icon/menu_close.png") 50% 50% no-repeat;	
}
#side .side_nav,
#side .side_nav dt,
#side .side_nav dd
{
	margin 			: 0px;
	padding 		: 0px; 
}
#side .side_nav dt
{
	border-bottom 	 	: 1px #507300 solid;
	color 				: #FFF;
	font-weight 		: bold;
	font-size 			: 18px;
	padding 			: 15px; 
}

#side .side_nav dd a
{
	display 		: block;
	padding 		: 15px;
	font-size 		: 18px;
	color 			: #FFF;
	background 		: #689400 url("../images/common/icon/nav_arrow.png") 96% 95% no-repeat;
	border-top 	 		: 1px #002b00 solid;
	border-bottom 	 	: 1px #7eb400 solid; 
	text-decoration 	: none;
	font-weight 		: bold;
	border-left 		: 3px #FFF solid; 
}

#main_contents .side_nav
{
	border-bottom 	 		: 1px #002b00 solid;	
}

#side .side_nav dd a:hover,
#side .side_nav dd a.active
{
	background 		: #425f00 url("../images/common/icon/nav_arrow_on.png") 96% 95% no-repeat;	
	border-bottom 	 	: 1px #507300 solid;
	border-top 	 		: 1px #002b00 solid;
	color 				: #ffeca2;
	border-left 		: 3px #ffeca2 solid; 	
}


#side .side_nav dd a:before
{
	content 		 		: "";
	width 			 		: 50px;
	height 			 		: 50px;
	background-position 	: 50% 50%;
	background-repeat 		: no-repeat;
	display 				: block;
	margin 					: 0 auto;
	background-size 		: 100% auto;
}
#side .side_nav dd.dashboard a:before
{
	background-image 		: url("../images/common/icon/nv_icon01.png");
}
#side .side_nav dd.task a:before
{
	background-image 		: url("../images/common/icon/nv_icon02.png");
}
#side .side_nav dd.execution a:before
{
	background-image 		: url("../images/common/icon/nv_icon03.png");
}
#side .side_nav dd.history a:before
{
	background-image 		: url("../images/common/icon/nv_icon04.png");
}

#side .side_nav dd.profile a:before
{
	background-image 		: url("../images/common/icon/nv_icon05.png");
}

#side .side_nav dd.dashboard a:hover:before,
#side .side_nav dd.dashboard a.active:before
{
	background-image 		: url("../images/common/icon/nv_icon01_on.png");
}
#side .side_nav dd.task a:hover:before,
#side .side_nav dd.task a.active:before
{
	background-image 		: url("../images/common/icon/nv_icon02_on.png");
}

#side .side_nav dd.execution a:hover:before,
#side .side_nav dd.execution a.active:before
{
	background-image 		: url("../images/common/icon/nv_icon03_on.png");
}
#side .side_nav dd.history a:hover:before,
#side .side_nav dd.history a.active:before
{
	background-image 		: url("../images/common/icon/nv_icon04_on.png");
}
#side .side_nav dd.profile a:hover:before,
#side .side_nav dd.profile a.active:before
{
	background-image 		: url("../images/common/icon/nv_icon05_on.png");
}
#side .nav_container
{
overflow: auto;
-webkit-overflow-scrolling: touch;
}
    



/*▼main------------------------------------------------------------*/
#main
{
	text-align 		: left; 
}
#main .main_inner
{
	padding 		: 20px 15px;
	background 		: #EEE url("../images/common/base/main_bg.gif") top left repeat-x;
}


/*▼footer------------------------------------------------------------*/
#footer
{
	background: #333333;
}
#footer small
{
	display: block;
	font-size: 14px;
	color: #FFF;
	padding 			: 15px;	 
}


/*321以上の指定（スマホ縦)*/
@media screen and (min-width: 321px) {
	
#auth_body .login_sub_text
{
	padding-left 		: 35px;
	margin-bottom 		: 10px; 
}
#auth_body .auth_container
{
    padding 			: 10px 15px 15px;
}
#auth_body .resetting .fa-question-circle
{
	margin-right 		: 5px; 
}



}
/*480以上の指定（スマホ横)*/
@media screen and (min-width: 480px) {



}

/*812以下かつデバイス横向き*/
@media (orientation: landscape) and  (max-width: 812px)
{
body#auth_body
{
	height: auto;
}
#auth_wrapper
{
	height: auto;
	padding 	: 20px 0px;
	overflow: auto
}

#auth_body .auth_container
{
	position: static;
	margin: 0 auto;
 	 transform 			: translateY(0%) translateX(0%);
 	 -webkit- transform : translateY(0%) translateX(0%);
}

}





/*481以上の指定（スマホ・タブレット）*/
@media screen and (min-width: 481px) {
#header .logo
{
	width 			: 130px; 
}
#header .admin br
{
	display: none;
}
#header .admin
{
	width: auto;
}
#main .main_inner
{
	padding 			: 30px 30px 
}
#header .admin 
{
	font-size 			: 14px; 
}
#wrapper
{
	padding-top 		: 58px; 
}
}

/*768以上の指定（タブレット）*/
@media screen and (min-width: 768px) {

	#auth_body .auth_container
	{
		padding 			: 20px 30px 25px;
		 border-top 		: 10px solid #4a660b;
		 border-bottom 		: 10px solid #cccccc; 
	}
	
	#auth_body .system_name
	{
		width 				: 500px;
		margin 				: 0 auto 30px; 
	}
	#auth_body .login_sub_text
	{
		font-size 			: 18px;
		padding-left 		: 0px;
		box-sizing 			: border-box;
		text-align 			: center;
		margin-bottom 		: 15px; 
	}
	
	#auth_body .login_sub_text .fa-arrow-circle-down
	{
		font-size 			: 22px;
		position 		 	: static;
		left 				: 0px;
		   top 				: 0px;
		display				: -moz-inline-box;
		display				: inline-block;
		/display			: inline;
		/zoom				: 1;
		vertical-align 		: middle;
	  -webkit-transform 	: translateY(0%);
	  -ms-transform 		: translateY(0%);
	  transform 			: translateY(0%);
	  line-height 			: normal;
	  margin-right 			: 5px; 
	}
	#auth_body .auth_input_area
	{
	
		padding 			: 20px 25px;
		margin-bottom 		: 30px; 
	}
	#auth_body .auth_input_area:before
	{
	
		border-left 		: 20px solid transparent;
		border-right 		: 20px solid transparent;
		border-top 		 	: 20px solid #425f00;
		position 			: absolute;
		bottom 				: -19px;
	
	
	}
	.auth_input_area dl
	{
		display 			: table;
		width 				: 100%; 
	}
	.auth_input_area dt,
	.auth_input_area dd,
	.auth_input_area dl:last-child dd
	{
		display 			: table-cell;
		padding 			: 13px 10px 13px;
		font-size 			: 20px;
		vertical-align 		: middle;
	}
	.auth_input_area dt
	{
		width 				: 31%;
	}
	
	.auth_input_area dt .fa-user,
	.auth_input_area dt .fa-unlock-alt
	{
		margin-left 		: 15px;
		font-size 			: 34px; 
	}
	#auth_body .login_btn button
	{
			width 					: 80%;
			margin-bottom 			: 30px; 
	}
	
	.auth_input_area input
	{
		padding: 13px 1em;
		font-size: 18px;
	}
	#auth_body .login_btn button span.text,
	#auth_body .login_btn button span.arrow
	{
	
		font-size 					: 38px;
		padding 					: 10px; 
	}
	#auth_body .login_btn button span.text
	{
		border-right 				: 1px solid #ffc55f; 
	}
	#auth_body .login_btn button span.arrow
	{
		border-left 				: 1px #fb6c00 solid;
		width 						: 15%;
		text-align: center;
	}
	#auth_body .login_btn button span.arrow img
	{
		width 						: 30px;
		height 						: auto;
		vertical-align 				: middle;
	}
	#auth_body .resetting
	{
		font-size 					: 18px;
	}
	#auth_body .resetting .fa-question-circle
	{
		font-size 					: 28px;
		vertical-align: middle;
	}
	
	
	}
	
	
/*1100以上の指定（PC）*/
@media screen and (min-width: 1100px) {
#wrapper
{
	padding-top 		: 0px; 
}
#header
{
	position: relative;
}
#header .logo
{
 	left 				: 17px;
 	 transform 			: translateY(-50%) translateX(0%);
 	 -webkit- transform : translateY(-50%) translateX(0%);	
}
#header .admin
{
	right 				: 15px; 
}
#main_contents
{
	display 		: table;
	width 			: 100%; 
}
#main_contents #side .side_inner
{
	position 		: relative;
	width 			: 100%; 
}
#main_contents #side .side_inner .nav_btn
{
    border-left: 1px #002b00 solid;
	position 		: absolute;
	right 			: -55px;
	top 			: 0px;
	left 			: auto;

}
#side .nav_btn span
{
	height 				: 50px;
    border-left: 1px #507300 solid;	
}



#main_contents #side
{
	width 			: 0px;
	position 		: static;
	display 		: table-cell;
	height 			: auto;
	z-index: auto;
	overflow: visible;
}
#main_contents #side .nav_container
{
	width 			: 0px;
	height 			: 100%!important; 
	overflow 		: hidden;
-webkit-transition 	: all 0.5s ease;
 -moz-transition 	: all 0.5s ease;
 -o-transition 		: all 0.5s ease;
transition 			: all 0.5s ease;
}

#main_contents.open #side,
#main_contents.open #side .nav_container
{
	width 			: 183px;
}
#main_contents .side_nav
{
	width 			: 183px; 
}
#main
{
	display 		: table-cell;
	vertical-align: top;
}
#side .side_nav dt
{
	padding 		: 11px; 
}
#side .side_nav dd a:before
{
	width 			: 70px;
	height 			: 70px; 
}
#side .side_nav dd a
{
	padding 		: 28px 20px; 
}
#footer
{
	text-align 		: left;
}

#auth_body .auth_container
{
	width 			: 768px;
	box-sizing 		: border-box;
 	padding 		: 25px 30px 30px;
}
.auth_input_area dt
{
	width 			: 27%; 
}
.auth_input_area dt, .auth_input_area dd, .auth_input_area dl:last-child dd
{
	padding 		: 15px; 
}
#auth_body .auth_input_area
{
	padding 		: 15px 25px;
	margin-bottom 	: 35px; 
}

}






/*---------------------------------------------------------*/
/*    copyright(C) CloudWorks. All rights reserved. Ver1.0   */
/*---------------------------------------------------------*/