/* ウィンドウ幅が481px以上の場合に適用するCSS */
@media screen and ( min-width:481px )
{

body{
	width: 100%;
	margin: 0px; 
	font-size: 14px;
	min-width: 1000px;
}

/*==================== header area ====================*/
#header_area{
	width: 100%;
	background: #006DD9;
	padding: 10px;
	box-sizing: border-box;
	box-shadow: 0 4px 2px -2px #CCC;
}

#header_area_inner{
	width: 1000px;
	margin: 0px auto;
	position: relative;
}

#header_area_inner .title{
	text-align: center;
}

h1{
	color: #FFF;
	margin: 0px;
	font-size: 25px;
}

#header_area_inner .user_name{
	position: absolute;
	top:15%;
	left:0;
	font-size: 14px;
}

#header_area_inner .user_name p{
	color: #FFF;
	margin: 0px;
}

#header_area_inner .right_area{
	position: absolute;
	top:15%;
	right:0;
	font-size: 14px;
}

#header_area_inner .date{
	color: #FFF;
	float: left;
	margin: 0px;
}

#header_area_inner .logout{
	float: left;
	width: 80px;
	background: #DDD;
	padding: 4px;
	box-sizing: border-box;
	margin-left: 10px;
	margin-top:-2%;
	text-align: center;
	box-sizing: border-box;
	border-radius: 10px;        /* CSS3草案 */  
    -webkit-border-radius: 10px;    /* Safari,Google Chrome用 */  
    -moz-border-radius: 10px;   /* Firefox用 */
	cursor:pointer;
}

/*==================== main area ====================*/
#main_area{
	width: 100%;
}

/*==================== cont area ====================*/
#cont_area{
	width: 1000px;
	margin: 1.5em auto;
}

#cont_area_s{
	width: 1000px;
	margin: 4.5em auto;
}

/*==================== login ====================*/
#login_box{
	width: 500px;
	margin:1em auto;
	padding:2em 1em;
	box-sizing: border-box;
	box-shadow:0 0 5px #fff, 0 0 5px #999, 0 0 1px #aaa;
-webkit-box-shadow:0 0 5px #fff, 0 0 5px #999, 0 0 1px #aaa;
-moz-box-shadow:0 0 5px #fff, 0 0 5px #999, 0 0 1px #aaa;
}

#login_box p{
	margin: 0px 0px 6px 0px;
	font-size: 16px;
}

#login_box p.s{
	margin: 1em 0px 6px 0px;
	font-size: 16px;
}

#login_box input[type="text"]{
	width: 95%;
	padding: 6px;
}
	
#login_box input[type="password"]{
	width: 95%;
	padding: 6px;
}

.login_button{
	width: 200px;
	margin:1.5em auto 0px auto;
	display:block;
	background: #006DD9;
	color: #FFF;
	padding: 20px 10px;
	text-align: center;
	box-sizing: border-box;
	font-size: 20px;
	border-radius: 10px;        /* CSS3草案 */  
    -webkit-border-radius: 10px;    /* Safari,Google Chrome用 */  
    -moz-border-radius: 10px;   /* Firefox用 */  
    box-shadow: 0 8px 4px -4px #999;
	cursor:pointer;
	border: none;
}
	
/*==================== footer area ====================*/
#footer_area{
	width: 100%;
	background: #006DD9;
	padding: 15px;
	box-sizing: border-box;
}

#footer_area_inner{
	width: 1000px;
	margin: 0px auto;
}

}
/* ウィンドウ幅が480px以下の場合に適用するCSS */
@media screen and ( max-width:480px )
{
body{
	width: 100%;
	margin: 0px; 
	font-size: 2.5vw;
}
	
/*==================== header area ====================*/
#header_area{
	width: 100%;
	background: #006DD9;
	padding: 10px;
	box-sizing: border-box;
	box-shadow: 0 4px 2px -2px #CCC;
}

#header_area_inner{
	width: 100%;
	margin: 0px auto;
	position: relative;
}

#header_area_inner .title{
	text-align: center;
}

h1{
	color: #FFF;
	margin: 0px;
	font-size:3vw;
}

/*==================== main area ====================*/
#main_area{
	width: 100%;
}

/*==================== cont area ====================*/
#cont_area_s{
	width: 100%;
	margin: 1.5em auto;
}

/*==================== login ====================*/
#login_box{
	width: 80%;
	margin:1em auto;
	padding:1em;
	box-sizing: border-box;
	box-shadow:0 0 5px #fff, 0 0 5px #999, 0 0 1px #aaa;
-webkit-box-shadow:0 0 5px #fff, 0 0 5px #999, 0 0 1px #aaa;
-moz-box-shadow:0 0 5px #fff, 0 0 5px #999, 0 0 1px #aaa;
}

#login_box p{
	margin: 0px 0px 6px 0px;
	font-size: 3vw;
}

#login_box p.s{
	margin: 1em 0px 6px 0px;
	font-size: 3vw;
}

#login_box input{
	font-size: 3vw;
}
	
#login_box input[type="text"]{
	width: 95%;
	padding: 2px;
}
	
#login_box input[type="password"]{
	width: 95%;
	padding: 2px;
}

.login_button{
	width: 30%;
	margin:1.5em auto 0px auto;
	display:block;
	background: #006DD9;
	color: #FFF;
	padding: 10px;
	text-align: center;
	box-sizing: border-box;
	font-size: 3vw;
	border-radius: 10px;        /* CSS3草案 */  
    -webkit-border-radius: 10px;    /* Safari,Google Chrome用 */  
    -moz-border-radius: 10px;   /* Firefox用 */  
    box-shadow: 0 8px 4px -4px #999;
	cursor:pointer;
	border: none;
}


/*==================== footer area ====================*/
#footer_area{
	width: 100%;
	background: #006DD9;
	padding: 10px;
	box-sizing: border-box;
}

#footer_area_inner{
	width: 100%;
	margin: 0px auto;
}
	
	
}