/*----------------------------------------------------------------------------
******************************************************************************
common　共通スタイル
******************************************************************************
----------------------------------------------------------------------------*/
/* ==== Base === */
body {
	font-size:14px;
	font-family:Verdana, Geneva, sans-serif;
	color: #333;
	padding:0;
	padding-bottom:10px;
}
a {
	text-decoration: none;
	color:#036DB7;
}
p {
	line-height:2;
	font-size:14px;
}


/*----------------------------------------------------------------------------
******************************************************************************
スマホのスタイル
******************************************************************************
----------------------------------------------------------------------------*/
/* ==== Backgraund === */
#wrap {
	overflow:hidden;
	background: url(../images/mirai_img.png) no-repeat 90% bottom;
	background-size: 200px;
	padding-bottom:30px;
}
#top {
	background:url(../images/top_bg_img.png) no-repeat center 105%;
	background-size: 450px;
}



/*#top_wrap {
	background:url(../images/top_bg_img.png) no-repeat center 105%;
	background-size: 450px;
}*/
/* ==== Header === */
header  {
	position:relative;
	height:70px;
}
header h1 img {
	width:200px;
	margin-left:20px;
	margin-top:5px
}
#mail_box p {
	margin:0;
	width:20%;
	font-size:17px;
	text-indent: 100%;
	white-space: nowrap;
	overflow: hidden;
	position: absolute;
	top:-20px;
	right:10px;
}
#mail_box p a {
	color:#FFFFFF;
	padding:12px;
	box-sizing:border-box;
	display:block;
	background:url(../images/icon_mail.png) no-repeat center center #F1BC18;
	background-size:30px;
	border-radius:0 0 5px 5px;
}
/* ==== Content === */
#contents {
	width:96%;
	margin:0 auto;
}

/* ==== Navigation === */
nav ul {
	list-style:none;
	margin:0;
	padding:0;
	font-size:0;
}
nav ul li {
	display: inline-block;
	width:50%;
	background:#036DB7;
	border-bottom:1px solid #FFF;
	box-sizing:border-box;
}
nav ul li:nth-child(odd) {
	border-right:1px solid #FFF;	
}
nav ul li a {
	color: #FFF;
	display:block;
	padding: 15px 20px;
	font-size:15px;
	line-height:18px;
	background: url(../images/icon_arrow.png) no-repeat 92% 50%;
	background-size: 30px;
}
nav ul li span.nav_s {
	font-size:10px;
	font-weight: normal;
}
nav ul li a:hover,
nav ul li.current a {
	background: url(../images/icon_arrow_hv.png) no-repeat 92% 50%;
	background-size: 30px;
}

/* ==== Index === */
#top p img {
	width: 200px;
	height:auto;
}
/* ==== 各ページh2のスタイル === */
#wrap h2 {
	border: 5px solid #CCCCCC;
	border-radius:10px;
	margin-top:20px;
	position:relative;
	font-size:20px;
	line-height:18px;
	padding: 25px 0 20px 35px;
	box-sizing:border-box;
}
#wrap h2 .h2_s {
	font-size:12px;
	font-weight:normal;
}
#wrap h2::before {
	position: absolute;
	content:"";
	width:5px;
	height:45px;
	background:#036DB7;
	top: 20px;
	left: 20px;
}
/*各ページ各h２背景画像*/
#greeting h2 {
	background: url(../images/h2_greeting_bg.jpg) no-repeat;
	background-size: cover;
}
#research h2 {
	background: url(../images/h2_research_bg.jpg) no-repeat;
	background-size: cover;

}
#innovation h2 {
	background: url(../images/h2_innovation_bg.jpg) no-repeat;
	background-size: cover;
}

#book h2 {
	background: url(../images/h2_book_bg.jpg) no-repeat;
	background-size: cover;
}


/* ==== 各ページh３のスタイル === */
h3 {
	font-size:21px;
	color:#026CB7;
	font-family:"ＭＳ Ｐ明朝", "MS PMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", serif;
	font-weight:normal;
	line-height:1.4em;
	margin-top:40px;
}

/* ==== ごあいさつ === */
#greeting_R p {
	text-align:center;
}
#greeting_R p#name img {
	width: 140px;
}
/* table  */
.table_B {
	width: 100%;
	border-top: 1px solid #D7D7D7;
	border-left: 1px solid #D7D7D7;
	border-collapse: collapse;
  　border-spacing: 0;
	margin-top:30px;
}
.table_B td {	
	width:100%;
	display:block;
	box-sizing:border-box;
	border-right: 1px solid #D7D7D7;
	border-bottom: 1px solid #D7D7D7;
	vertical-align: top;
	padding: 15px 5px;
}
.table_B th {	
	width:100%;
	display:block;
	box-sizing:border-box;
	border-right: 1px solid #D7D7D7;
	border-bottom: 1px solid #D7D7D7;
	background-color: #DEEAF7;
	text-align: center;
	font-weight: bold;
	padding: 15px;
	letter-spacing:5px;
}
/* ==== 研究事業 === */
#research ul {
	list-style:none;
	margin:20px 0 20px 0;
	padding:0;
}
#research ul li img {
	max-width:100%;
}
#research ul li {
	text-align:center;
	margin-bottom: 30px;
}

/* ==== 振興事業 === */
#innovation_bg {
	background:url(../images/innovation_bg_img.png) no-repeat center bottom;
	background-size:contain;
	padding-bottom:200px;
}

/* ==== page top === */
#page-top {
    position: fixed;
    bottom: 0px;
    right: 0px;
}
#page-top a {
    background: #F1BC18;
    text-decoration: none;
    display: block;
	text-align:center;
	padding:5px;
}
#page-top a img {
	width: 30%;
}

/* ==== Footer === */
footer img {
	width:250px;
	height:auto;
}
footer {
	text-align:center;
	padding-top: 20px;
}

/*----------------------------------------------------------------------------
******************************************************************************
タブレットのスタイル
******************************************************************************
----------------------------------------------------------------------------*/
@media screen and (min-width:570px){
/* ==== Base === */
.layout {}
/* ==== Backgraund === */
#wrap {
	overflow:hidden;
	background: url(../images/mirai_img.png) no-repeat 90% bottom;
	background-size: 300px;
	padding-bottom:50px;
}
#top {
	background:none;
}


#top_wrap {
	background:url(../images/top_bg_img.png) no-repeat right 300px;
	background-size: 650px;
}

/* ==== Header === */
header h1 img {
	width:250px;
	margin-left:20px;
	margin-top:0px
}

/* ==== Content === */
#contents {
	width:96%;
	margin:0 auto;
}

/* ==== Index === */
#top  {
	width:65%;
}
#top p {
	font-size:16px;
}
#top p img {
	width: 200px;
	height:auto;
	margin-left:150px;
}
/* ==== 各ページh2のスタイル === */
#wrap h2 {
	border: 7px solid #CCCCCC;
	font-size:25px;
	padding: 55px 0 50px 55px;
}
#wrap h2 .h2_s {
	font-size:13px;
}
#wrap h2::before {
	position: absolute;
	content:"";
	width:5px;
	height:45px;
	background:#036DB7;
	top: 50px;
	left: 35px;
}
/* ==== 各ページh３のスタイル === */
h3 {
	font-size:22px;
}
/* ==== ごあいさつ === */

/* ==== 研究事業 === */
#research ul {
	list-style:none;
	margin:20px -1% 20px 0;
	padding:0;
}
#research ul li {
	width: 48%;
	display: inline-block;
	margin-right:1%;
	margin-bottom: 10px;
}

/* ==== 振興事業 === */
#innovation_bg {
	background:url(../images/innovation_bg_img.png) no-repeat center bottom;
	background-size:contain;
	padding-bottom:350px;
}

/* ==== Footer === */
#ft {}
/* ==== page top === */
#page-top a {}
}



/*----------------------------------------------------------------------------
******************************************************************************
PCのスタイル
******************************************************************************
----------------------------------------------------------------------------*/
@media screen and (min-width:960px){
/* ==== Base === */
#layout {
	width: 960px;
	margin:0 auto;
}
/* ==== Backgraund === */

#top {
	background:none;
}



#top_wrap {
	background:url(../images/top_bg_img.png) no-repeat center 210px;
	background-size:auto;
}
#wrap {
	background: url(../images/mirai_img.png) no-repeat right bottom;
	background-size: auto;
	padding-bottom:10px;
}
/* ==== Header === */
header { 
	height:140px;
	position:relative;
}
/* ==== h1 img === */
h1 {
	position:absolute;
	top:13px;
	left:20px;
}
header h1 img {
	width:336px;
}

#mail_box p {
	position:absolute;
	top:0px;
	right:0px;
	margin:0;
	width:230px;
	font-size:17px;
	text-indent:0;
}
#mail_box p a {
	color:#FFFFFF;
	padding:12px 0px 12px 90px;
	box-sizing:border-box;
	display:block;
	background:url(../images/icon_mail.png) no-repeat 40px center #F1BC18;
	background-size:40px;
	border-radius:0 0 5px 5px;
}
#mail_box p a:hover {
	background: url(../images/icon_mail.png) no-repeat 40px center rgba(241,188,24,0.8);
	background-size:40px;
}


/* ==== Navigation === */
nav ul {
	display:-webkit-box;/*--- Androidブラウザ用 ---*/
    display:-ms-flexbox;/*--- IE10 ---*/
    display: -webkit-flex;/*--- safari（PC）用 ---*/
    display:flex;	
	list-style:none;
	margin:0;
	padding:0;
	margin-right:-13px;
}
nav ul li {
	width:230px;
	background:#036DB7;
	border-radius:4px;
	margin-right:13px;
}
nav ul li a {
	color: #FFF;
	display:block;
	padding: 16px 20px;
	font-size:18px;
	line-height:18px;
	background: url(../images/icon_arrow.png) no-repeat 92% 50%;
	background-size: 40px;
}
nav ul li span.nav_s {
	font-size:12px;
	font-weight: normal;
}
nav ul li a:hover,
nav ul li.current a {
	background: url(../images/icon_arrow_hv.png) no-repeat 92% 50%;
	background-size: 40px;
}

/* ==== Content === */
#contents { 
	width:100%;
}
#sidenav {
	display: none;
}
main {}

/* ==== Index === */
#top  {
	width:520px;
}
#top p {
	font-size:16px;
}
#top p img {
	width:417px;
	margin-left: 80px;
}
/* ==== 各ページh2のスタイル === */
#wrap h2 {
	border-left: 7px solid #036DB7;
	border: 7px solid #CCCCCC;
	border-radius:10px;
	height:235px;
	margin-top:30px;
	position:relative;
	font-size:30px;
	line-height:20px;
	padding: 90px 0 90px 80px;
	box-sizing:border-box;
}
#wrap h2 .h2_s {
	font-size:15px;
	font-weight:normal;
}
#wrap h2::before {
	position: absolute;
	content:"";
	width:7px;
	height:60px;
	background:#036DB7;
	top: 80px;
	left: 50px;
}
/*各ページ各h２背景画像*/
#greeting h2 {
	background: url(../images/h2_greeting_bg.jpg) no-repeat;
}
#research h2 {
	background: url(../images/h2_research_bg.jpg) no-repeat;
}
#innovation h2 {
	background: url(../images/h2_innovation_bg.jpg) no-repeat;
}

/* ==== 各ページh３のスタイル === */
h3 {
	font-size:30px;
	color:#026CB7;
	font-family:"ＭＳ Ｐ明朝", "MS PMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", serif;
	font-weight:normal;
	line-height:1.4em;
	margin-top:40px;
}

/* ==== ごあいさつ === */
#greeting_L {
	width:710px;
	display:inline-block;
}
#greeting_R {
	width:210px;
	display:inline-block;
	vertical-align:top;
	margin-left:30px;
}
#greeting_R p#name {
	text-align:center;
}
#greeting_R p#name img {
	width: 170px;
}
/*  table  */
.table_B {
	width:100%;
	border-top: 1px solid #D7D7D7;
	border-left: 1px solid #D7D7D7;
	border-collapse: collapse;
  　border-spacing: 0;
	font-size:15px;
	line-height:25px;
	margin-top:30px;
	display:table;
}
.table_B td {
	display: table-cell;
	border-right: 1px solid #D7D7D7;
	border-bottom: 1px solid #D7D7D7;
	vertical-align: top;
	padding: 15px;
	width:610px;
	box-sizing:border-box;
}
.table_B th {
	display: table-cell;
	border-right: 1px solid #D7D7D7;
	border-bottom: 1px solid #D7D7D7;
	background-color: #DEEAF7;
	text-align: center;
	font-weight: bold;
	width:350px;
	padding: 15px;
	letter-spacing:5px;
	box-sizing:border-box;
}

/* ==== 研究事業 === */
#research ul {
	list-style:none;
	margin:20px -55px 40px 0;
	padding:0;
}
#research ul li {
	width:450px;
	display: inline-block;
	margin-right:55px;
	margin-bottom: 50px;
}

/* ==== 振興事業 === */
#innovation_bg {
	background:url(../images/innovation_bg_img.png) no-repeat center bottom;
	padding-bottom:400px;
}

/* ==== page top === */
#page-top {
    position: fixed;
    bottom: 0px;
    right: 20px;
}
#page-top a {
    background: #F1BC18;
    text-decoration: none;
    display: block;
	text-align:center;
	padding:10px;
}
#page-top a img {
	width: 50%;
}

/* ==== Footer === */
#top_footer {
	padding:0px 0 30px;

}
footer {
	padding:40px 0 30px;
	text-align:left;
}
footer img {
	width: 526px;
	
}

}

/* ==== Release追加　20201230 === */

#release .full{
	width:100%;
	float:left;
	margin-bottom:20px;
}

#release .half{
	width:100%;
	float:left;
}


#release h4{
	font-size:40px;
	color:#F7B52C;
	font-family:"ＭＳ Ｐ明朝", "MS PMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", serif;
	font-weight:normal;
	margin-bottom:0px;
}

#release h4:first-letter{
	font-size:50px;
}


#release h5{
	color:#026CB7;
	font-family:"ＭＳ Ｐ明朝", "MS PMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", serif;
	font-weight:normal;
	margin-top:30px;
	margin-bottom:20px;
}

#release h5{
	font-size:26px;
}


#release h5 span{
	font-size:22px;
	color:#000000;
}

#release h5 span:before{
	content:"―"
}

#release .book_data{
	border:solid 3px #efefef;
	border-radius:5%;
}

#release dl.author dt{
	color:#026CB7;
}

img.amazon{
	border:solid 1px #cccccc;
}

img.amazon:hover{
	opacity:0.8;
	
}

#release .book_data{
	border:solid 3px #efefef;
	border-radius:5%;
	width:95%;
	float:left;
	margin-left:0%;
	margin-top:10px;

}

#release .book_img{
	width:32%!important;
	float:left;
	margin:4%;
}

#release .book_img:hover{
	opacity:0.8;
}

#release .book_img img{
	width:100%;
}

#release .book_shop{
	width:52%;
	float:left;
	marign:4%;
}


#release dl.author dt{
	color:#026CB7;
	font-size:19px;
	margin-bottom:10px;
}

#release dl.author dd{
	margin-left:0px;
	font-size:14px;
	margin-bottom:5px;
}

.shop_link{
	width:100%;
	float:left;
}

.shop_link img{
	width:100%;	
}

img.amazon{
	border:solid 1px #cccccc;
	width:100%;
}

img.amazon:hover{
	opacity:0.8;
}



@media screen and (min-width:570px){
	#release{
		width:100%;
		float:left;
	}

	#release h4{
		font-size:40px;
	}

	#release h4:first-letter{
		font-size:50px;
	}


	#release h5 span{
		font-size:22px;
	}

	#release p{
	    font-size: 16px;
	}

	#release .full{
		width:100%;
		float:left;
	}

	#release .half{
		width:49%;
		float:left;
	}

	#release .book_data{
		width:95%;
		float:left;
		margin-left:5%;
		margin-top:0px;

	}

		#release .book_img{
		width:40%!important;
		float:left;
	}

	#release .book_shop{
		width:40%;
		float:left;
	}


	#release dl.author dt{
		font-size:16px;
		margin-bottom:10px;
	}

	#release dl.author dd{
		margin-left:10px;
		font-size:14px;
		margin-bottom:5px;
	}
}

@media screen and (min-width:570px){
	.sp_none{
		display:block;
	}

	.pc_none{
		display:none;
	}
}


.more_btn{
	display: inline-block;
	width:100%;
	background:#036DB7;
	border-bottom:1px solid #FFF;
	box-sizing:border-box;
	text-align:center;
	border-radius:5px;
}

.more_btn a{
	color: #FFF;
	display:block;
	padding: 15px 20px;
	font-size:15px;
	line-height:18px;
	background: url(../images/icon_arrow.png) no-repeat 92% 50%;
	background-size: 30px;
}

.more_btn a:hover{
	background: url(../images/icon_arrow_hv.png) no-repeat 92% 50%;
	background-size: 30px;

}


@media screen and (min-width: 960px){
	.more_btn a{
		color: #FFF;
		display: block;
		padding: 16px 20px;
		font-size: 18px;
		line-height: 18px;
		background: url(../images/icon_arrow.png) no-repeat 92% 50%;
		background-size: 40px;
		}
}