/* ******************************************************************
 *	File name		: base.css
 *	Summary			: css base
 * ******************************************************************
 */
/*

青　#ADD8E6　rgba(173,216,230,1.0)
青（濃）　#74B7CE　rgba(116,183,206,1)

青（新）　#003F88　rgbA(0,63,136,1)　

紺　#313140　rgba(49,49,64,1)
オレンジ　#E7782E　rgba(231,120,46,1)

*/

/* -----------------------------------------------------------------
   base
----------------------------------------------------------------- */

body{
	position:relative;
	width:100%;
	height:100%;
	line-height:145%;
	color:#222;
	background:#FFF;
}
#wrapper{
	position:relative;
	width:100%;
	height:100%;
}

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

header{
	position:fixed;
	top:0px;
	left:0px;
	width:270px;
	height:100%;
	padding-top:255px;
	background:rgba(0,63,136,0.2);
	z-index:50;
	}
	header h1{
		position:absolute;
		top:0px;
		left:0px;
		width:160px;
		padding:13px 15px 8px;
		background:rgba(255,255,255,1);
		-moz-box-shadow: 0px 0px 5px rgba(0,0,0,0.3);
		-webkit-box-shadow: 0px 0px 5px rgba(0,0,0,0.3);
		box-shadow: 0px 0px 5px rgba(0,0,0,0.3);
		z-index:2;
	}
	header h1 img{
	}
	header #nomura_txt{
		position:absolute;
		top:45px;
		left:30px;
		width:210px;
		height:190px;
		background:#313140;
		z-index:1;
}

header nav{
	position:relative;
	width:225px;
	z-index:100;
	transition-duration:1.0s;
}
header nav ul{
	display:block;
	position:relative;
	width:225px;
	margin-bottom:25px;
	list-style:none;
	}
	header nav ul li{
		position:relative;
		width:225px;
		min-height:35px;
		margin-bottom:2px;
		font-size:0.9rem;
		text-align:left;
		color:#FFF;
		background:linear-gradient(90deg, rgba(49,49,64,0), rgba(49,49,64,1), rgba(49,49,64,1));
		transition-duration:0.5s;
		}
		header nav ul li:before,
		header nav ul li:after{
			content:" ";
			position:absolute;
			position:absolute;
			right:-5px;
			z-index:0;
		}
		header nav ul li:before{
			top:0px;
			width:5px;
			height:calc(100% - 6px);
			background:#313140;
		}
		header nav ul li:after{
			bottom:0px;
			border: 3px solid transparent;
			border-top: 3px solid #313140;
			border-left: 3px solid #313140;
	}
	header nav ul li a{
		display:block;
		position:absolute;
		top:0px;
		left:0px;
		width:230px;
		height:100%;
		padding:6px 10px 0px 105px;
		text-decoration:none;
		color:#FFF;
		z-index:10;
		transition-duration:0.5s;
	}
	header nav ul li a:hover{
		width:240px;
		text-decoration:none;
	}

/* icon */
header nav ul li#nav_research a{background:url(../../image/base/nav/nav_research.png) no-repeat 70px center;}
header nav ul li#nav_members a{background:url(../../image/base/nav/nav_members.png) no-repeat 70px center;}
header nav ul li#nav_device a{background:url(../../image/base/nav/nav_device.png) no-repeat 70px center;}
header nav ul li#nav_events a{background:url(../../image/base/nav/nav_events.png) no-repeat 70px center;}
header nav ul li#nav_achievements a{background:url(../../image/base/nav/nav_achievements.png) no-repeat 70px center;}
header nav ul li#nav_activities a{background:url(../../image/base/nav/nav_activities.png) no-repeat 70px center;}
header nav ul li#nav_links a{background:url(../../image/base/nav/nav_links.png) no-repeat 70px center;}

header nav ul li#nav_research a:hover{background:url(../../image/base/nav/nav_research_on.png) no-repeat 70px center #E7782E;}
header nav ul li#nav_members a:hover{background:url(../../image/base/nav/nav_members_on.png) no-repeat 70px center #E7782E;}
header nav ul li#nav_device a:hover{background:url(../../image/base/nav/nav_device_on.png) no-repeat 70px center #E7782E;}
header nav ul li#nav_events a:hover{background:url(../../image/base/nav/nav_events_on.png) no-repeat 70px center #E7782E;}
header nav ul li#nav_achievements a:hover{background:url(../../image/base/nav/nav_achievements_on.png) no-repeat 70px center #E7782E;}
header nav ul li#nav_activities a:hover{background:url(../../image/base/nav/nav_activities_on.png) no-repeat 70px center #E7782E;}
header nav ul li#nav_links a:hover{background:url(../../image/base/nav/nav_links_on.png) no-repeat 70px center #E7782E;}

header nav ul li#nav_top,
header nav ul li#nav_contact{
	display:none;
}
header nav ul li:hover{
	width:235px;
}

/* project_banner */
#project_banner{
	position:relative;
	width:100%;
}
#project_banner:before{
	content:" ";
	position:absolute;
	top:8px;
	left:0px;
	width:100%;
	height:1px;
	border-bottom:2px solid rgba(0,0,0,0.3);
	z-index:0;
}
#project_banner strong{
	display:inline-block;
	position:relative;
	margin:0 0 12px 20px;
	padding:0 5px;
	background:#CCD8E7;
	z-index:10;
}
#project_banner ul{
	list-style:none;
	text-align:center;
}
#project_banner ul li{
	margin-bottom:10px;
}


/* --- responsive --- */
@media(max-width:960px){
	header{
		display:none;
	}
}

/* -----------------------------------------------------------------
   main
----------------------------------------------------------------- */

main{
	position:relative;
	display:block;
	width:100%;
	padding-top:75px;
	overflow:hidden;
	z-index:0;
}

#main_contents{
	position:relative;
	min-height:500px;
	padding:0 30px 30px 300px;
}

section{
	position:relative;
	max-width:100%;
	margin-bottom:35px;
	padding:0px;
}

.contents{
	position:relative;
	width:1080px;
	max-width:100%;
	margin:0 auto;
}

/* --- responsive --- */
@media(max-width:960px){
	main{
		padding-top:65px;
	}
	#main_contents{
		padding:0 20px 20px;
	}
}

/* -----------------------------------------------------------------
   Link
----------------------------------------------------------------- */

#ft_link{
	position:relative;
	padding:20px 30px 13px 0;
	background:#E0E0E3;
	}
	#ft_link ul{
		position:relative;
		width:100%;
		list-style:none;
		text-align:center;
	}
	#ft_link ul li{
		display:inline-block;
		position:relative;
		margin:0 10px 7px;
	}
	#ft_link ul li:hover{
		background:rgba(0,0,0,0.1);
		transition-duration:1.0s;
	}
	#ft_link ul li a{
}

/* -----------------------------------------------------------------
   head_contact
----------------------------------------------------------------- */

#head_contact{
	position:absolute;
	top:0px;
	right:0px;
	width:50%;
	text-align:right;
	background:linear-gradient(90deg, rgba(231,120,46,0), rgba(231,120,46,1));
	color:#FFF;
}
#head_contact a{
	position:relative;
	text-decoration:none;
	padding:0 30px 0 20px;
	font-size:0.8rem;
	color:#FFF;
	background:url(../../image/base/mail.png) no-repeat 0 3px;
	z-index:49;
}
/* --- responsive --- */
@media(max-width:960px){
	#head_contact{
		display:none;
	}
}

/* -----------------------------------------------------------------
   footer
----------------------------------------------------------------- */

footer{
	clear:both;
	position:relative;
	width: calc(100% - 270px);
	margin-left:270px;
	text-align:center;
	color:#FFF;
	z-index:20;
	background:#646473;
	}
	footer #copyright{
		position:relative;
		padding:10px 0 70px;
		text-align:center;
		font-size:0.75em;
}

/* --- responsive --- */
@media(max-width:960px){
	footer{
		clear:both;
		position:relative;
		width:100%;
		margin-left:0px;
		text-align:center;
		color:#FFF;
		z-index:20;
		background:#646473;
		}
		footer #copyright{
			position:relative;
			padding:10px 0 70px;
			text-align:center;
			font-size:0.75em;
	}
}

/* -----------------------------------------------------------------
   pagetop
----------------------------------------------------------------- */

#pagetop{
	position:fixed;
	right:20px;
	bottom:25px;
	width:50px;
	height:50px;
	border-radius:10px;
	-webkit-border-radius:10px;
	-moz-border-radius:10px;
	background:rgba(47,43,92,1);
	opacity:0.5;
	z-index:999;
	}
	#pagetop:before,
	#pagetop:after{
		content:" ";
		position:absolute;
	}
	#pagetop:before{
		top:8px;
		left:10px;
		width: 0;
		height: 0;
		margin-top: -15px;
		border:15px solid transparent;
		border-bottom:15px solid rgba(255,255,255,1);
	}
	#pagetop:after{
		top:23px;
		left:19px;
		width:13px;
		height:18px;
		background:rgba(255,255,255,1);
		z-index:0;
	}
	#pagetop span{
		display:none;
		position:absolute;
		top:-25px;
		height:22px;
		right:0px;
		width:80px;
		font-family:"ＭＳ ゴシック", "MS Gothic", "Osaka－等幅", Osaka-mono, monospace;
		font-size:10px;
		background:rgba(255,255,255,1);
		border:1px solid #000;
		border-radius:5px;
		-webkit-border-radius:5px;
		-moz-border-radius:5px;
		color:#000;
		line-height:20px;
		}
		#pagetop span:before,
		#pagetop span:after{
			content:" ";
			position:absolute;
		}
		#pagetop span:before{
			bottom:-12px;
			right:8px;
			width:0;
			height:0;
			border:5px solid transparent;
			border-top:7px solid rgba(0,0,0,1);
		}
		#pagetop span:after{
			bottom:-11px;
			right:8px;
			width:0;
			height:0;
			border:5px solid transparent;
			border-top:7px solid rgba(255,255,255,1);
	}
	/* hover */
	#pagetop:hover{
		opacity:1;
	}
	
	#pagetop a{
		display:block;
		position:absolute;
		left:0px;
		top:0px;
		width:100%;
		height:100%;
		color:#0061B1;
		border-radius:6px;
		-webkit-border-radius:6px;
		-moz-border-radius:6px;
		z-index:1;
}
@media print{
	#pagetop{
		display:none;
	}
}