﻿@charset "utf-8";
/*****************************************************************************************************
全ページ共通のCSS
******************************************************************************************************/

/*********************************************************
リセット
**********************************************************/
body,
div,
h1,h2,h3,h4,h5,h6,
p,
ul,ol,li,
dl,dt,dd {
	margin: 0;
	padding: 0;
}

/*********************************************************
clearfix
**********************************************************/
.clearfix:after {
	content: "";
	clear: both;
	display: block;
}

/*********************************************************
フォント
**********************************************************/
body {
	font-family: YuGothic, 'Yu Gothic', "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", "sans-serif";
	-webkit-font-smoothing: antialiased;
	line-height: 1.5;
}

/*********************************************************
リンク
**********************************************************/
a {
	color: #0059B2;
}
a:visited {
	color: #003366;
}

@media only screen and (min-width: 700px) {
a.tel {
	color: #000;
	text-decoration: none;
}
}

/*********************************************************
改行防止
**********************************************************/
.nobr {
	white-space: nowrap;
}

/*********************************************************
メールアドレス画像
**********************************************************/
img.mail {
	vertical-align: bottom;
}








/****************************************************************************************
ヘッダーのスペースを確保
*****************************************************************************************/
.header-spacer {
	width: 100%;
	height: 100px;
	background-color: #002040;
}
@media only screen and (max-width: 1024px) {
.header-spacer {
	height: 60px;
	background-color: #FFF;
}
}

/****************************************************************************************
オフセットアンカー
*****************************************************************************************/
a.anchor {
	position: absolute;
	top: -60px;
}

/****************************************************************************************
ヘッダー PC
*****************************************************************************************/
.header-1 {
	width: 100%;
	height: 100px;
	background-color: #002040;
	position: fixed;
	top: 0;
	z-index: 99999;
}

/* ロゴ ***************************/
.header-1 .logo {
	height: 60px;
	position: absolute;
	top: 20px;
	left: 20px;
}
.header-1 .logo:hover {
	opacity: 0.8;
}

/* リスト 第一階層 ********************************/
.header-1 ul.nav {
	list-style: none;
	position: absolute;
	top: 20px;
	right: 5px;
}
.header-1 ul.nav > li {
	float: left;
	position: relative;
}

/* リスト 第二階層 *********************************/
.header-1 ul.nav > li > ul {
	display: none;
	list-style: none;
	background-color: #002040;
	position: absolute;
	top: 60px;
	left: 0;
}
.header-1 ul.nav > li:hover > ul {
	display: block;
}

.header-1 ul.nav > li > ul > li {
	border-top: solid 1px rgba(255,255,255,0.25);
	margin: 0 15px;
}

/* リンク 第一階層 ********************************/
.header-1 ul.nav > li > a {
	color: #FFF;
	text-decoration: none;
	font-size: 16px;
	font-weight: bold;
	display: block;
	height: 60px;
	line-height: 60px;
	padding: 0 10px;
}

.header-1 ul.nav > li > a.plus {
	cursor: default;
}

.header-1 ul.nav > li > a .only-sd {
	display: none;
}

/* リンク 第二階層 *********************************/
.header-1 ul.nav > li > ul > li > a {
	color: #FFF;
	text-decoration: none;
	font-size: 14px;
	display: block;
	white-space: nowrap;
	padding: 10px 0;
}

/* ホバー ****************************************/
.header-1 ul.nav > li:hover > a,
.header-1 ul.nav > li > ul > li > a:hover {
	color: rgba(255,255,255,0.6);
}

/* サイト内検索 ***************************************************/
.header-1 ul.nav > li.nav-search > ul {
	left: -30px;
}
.header-1 ul.nav > li.nav-search > ul > li {
	padding: 10px 0;
	text-align: center;
}
.header-1 ul.nav > li.nav-search > ul > li input.search-box {
	width: 150px;
	margin-bottom: 10px;
}

/* スクロールした時 ************************************************************/
.header-1.scrolled {
	height: 60px;
	transition: height 0.5s;
}
.header-1.scrolled .logo {
	height: 40px;
	top: 10px;
	left: 10px;
	transition: height 0.5s, top 0.5s, left 0.5s;
}
.header-1.scrolled ul.nav {
	top: 0;
	transition: top 0.5s;
}
/* スクロールから戻った時 ***********************************/
.header-1 {
	transition: height 0.5s;
}
.header-1 .logo {
	transition: height 0.5s, top 0.5s, left 0.5s;
}
.header-1 ul.nav {
	transition: top 0.5s;
}



/****************************************************************************************
ヘッダー モバイル
*****************************************************************************************/
.header-2 {
	display: none;
	width: 100%;
	height: 60px;
	background-color: #002040;
	
	box-sizing: border-box;
	padding-top: 60px;
	overflow: hidden;
	
	position: fixed;
	top: 0;
	z-index: 99999;
}
.header-2.opened {
	height: 100%;
	transition: height 0.5s;
}
.header-2 {
	transition: height 0.5s;
}

/* ロゴ *************************/
.header-2 .logo {
	height: 40px;
	position: absolute;
	top: 10px;
	left: 10px;
}

/* メニューボタン **********************/
.header-2 .icon-bars {
	width: 60px;
	height: 60px;
	position: absolute;
	top: 0;
	right: 0;
	background-repeat: no-repeat;
	background-position: 25px center;
	background-image: url(../img/common/icon-header-bars.png);
}
.header-2 .icon-bars.opened {
	background-image: url(../img/common/icon-header-x.png);
}

/* リスト 第一階層 ********************************/
.header-2 ul.nav {
	list-style: none;
	width: 100%;
	height: 100%;
	overflow: auto;
}
.header-2 ul.nav > li {
	border-bottom: solid 1px rgba(255,255,255,0.5);
	margin: 0 15px;
}

/* リスト 第二階層 *********************************/
.header-2 ul.nav > li > ul {
	display: none;
	list-style: none;
}
.header-2 ul.nav > li > ul > li {
	border-top: solid 1px rgba(255,255,255,0.25);
	margin-left: 15px;
}

/* リンク 第一階層 ********************************/
.header-2 ul.nav > li > a {
	color: #FFF;
	text-decoration: none;
	font-size: 16px;
	font-weight: bold;
	
	display: block;
	padding: 15px 0;
}

.header-2 ul.nav > li > a .only-pc {
	display: none;
}

/* リンク 第二階層 *********************************/
.header-2 ul.nav > li > ul > li > a {
	color: #FFF;
	text-decoration: none;
	font-size: 14px;
	
	display: block;
	padding: 10px 0;
}
.header-2 ul.nav > li > ul > li:last-child > a {
	padding-bottom: 15px;
}

/* サイト内検索 *********************************************/
.header-2 ul.nav > li.nav-search > ul > li {
	padding: 10px 0 15px 0;
	
}

/* 開閉ボタン **************************************/
.header-2 ul.nav > li > a.plus {
	background-repeat: no-repeat;
	background-position: center right;
	background-image: url(../img/common/icon-white-plus.png);
}
.header-2 ul.nav > li > a.plus.opened {
	background-image: url(../img/common/icon-white-x.png);
}


/************************************************************************************************
ヘッダー PC モバイル 切り替え
************************************************************************************************/
@media only screen and (max-width: 1024px) {
.header-1 {
	display: none;
}
.header-2 {
	display: block;
}
}


/************************************************************************************************
現在位置
************************************************************************************************/
/* 第一階層 */
.dir-program       		.nav-program     > a,
.dir-project       		.nav-project     > a,
.dir-topics        		.nav-topics      > a,
.dir-archive-column 	.nav-archive      > a,
.dir-archive-project 	.nav-archive     > a,
.dir-information   		.nav-information > a {
	color: #66B5CB !important;
}

/* 第二階層 */
.page-program-index          .nav-program-index          > a,
.page-program-generalization .nav-program-generalization > a,
.page-program-team           .nav-program-team           > a,
.page-program-profile        .nav-program-team           > a,
.page-program-organization   .nav-program-organization   > a,
.page-program-proposal       .nav-program-proposal       > a,
.page-program-report         .nav-program-report         > a,

.page-topics-index          .nav-topics-index   > a,
.page-archive-column        .nav-archive-column > a,
.page-archive-project		.nav-archive-project  > a,

.page-information-index .nav-information-index > a,
.page-information-links .nav-information-links > a {
	color: #66B5CB !important;
}






/*****************************************************************************************************
フッター
******************************************************************************************************/
.footer {
	width: 100%;
	border-top: solid 1px #CCC;
}

/* ロゴ *********************************************/
ul.footer-logo {
	list-style-type: none;
	font-size: 0;
	text-align: center;
	padding: 25px 0;
}
ul.footer-logo li {
	display: inline-block;
	vertical-align: middle;
	padding: 25px;
}
ul.footer-logo li img {
	display: block;
	width: 100%;
}
ul.footer-logo li.logo-policy-door img { max-width: 208px; }
ul.footer-logo li.logo-scirex      img { max-width: 122px; }
ul.footer-logo li.logo-ristex      img { max-width: 280px; }
ul.footer-logo li.logo-jst         img { max-width: 190px; }

/* フッター 二段目 **********************************/
.footer-2nd {
	width: 100%;
	max-width: 1030px;
	margin: 0 auto;
	box-sizing: border-box;
	padding: 0 15px;
	position: relative;
}

/* 区切り線 **************************************/
.footer-line {
	width: 100%;
	height: 1px;
	background-color: #CCC;
}

/* フッターリンク *********************************/
ul.footer-link {
	list-style-type: none;
	margin: 1.5em 0 1em 0;
}
ul.footer-link li {
	display: inline-block;
	border-right: solid 1px #000;
	padding: 0 10px 0 5px;
	margin: 0.25em 0;
}
ul.footer-link li:first-child {
	padding-left: 0;
}
ul.footer-link li:last-child {
	border-right: none;
}

ul.footer-link li a {
	font-size: 14px;
	color: #000;
	text-decoration: none;
}
ul.footer-link li a:hover {
	text-decoration: underline;
}

/* SNS *********************************************/
ul.footer-sns {
	list-style-type: none;
	font-size: 0;
	position: absolute;
	top: 28px;
	right: 15px;
}
ul.footer-sns li {
	display: inline-block;
	vertical-align: middle;
	margin-right: 13px;
}
ul.footer-sns li:last-child {
	margin-right: 0;
}
ul.footer-sns li img {
	display: block;
	width: 35px;
}

/* コピーライト *************************************/
p.footer-copy {
	font-size: 14px;
	margin: 1em 0 50px 0;
}

@media only screen and (max-width: 800px) {
ul.footer-link,
ul.footer-sns,
p.footer-copy {
	position: static;
	text-align: center;
}
}




/*****************************************************************************************************
ページトップへ戻る
******************************************************************************************************/
a#top {
	position: absolute;
	top: 0;
}
a.back-to-top {
	display: block;
	width: 40px;
	height: 40px;
	background-color: #002040;
	background-repeat: no-repeat;
	background-position: center center;
	background-image: url(../img/common/icon-back-to-top.png);
	
	white-space: nowrap;
	text-indent: 100%;
	overflow: hidden;

	position: fixed;
	right: 0;
	bottom: -40px;
}
/* スクロールした時 ***************************/
a.back-to-top.scrolled {
	bottom: 20px;
	transition: bottom 0.5s;
}
/* スクロールから戻った時 ***************/
a.back-to-top {
	transition: bottom 0.5s;
}





/*****************************************************************************************************
更新情報
******************************************************************************************************/
ul.list {
	list-style-type: none;
	margin: 1em 0;
}
ul.list li {
	margin: 0;
	padding: 1em 0;
	border-bottom: solid 1px #DDD;
	position: relative;/* アンカーを absolute で設置するため */
}
ul.list li:first-child {
	border-top: solid 1px #DDD;
}
ul.topics_data li:first-child {
	border-top: none;
}

ul.list dt {
	font-weight: bold;
}
ul.list dt span {
	display: inline-block;
	white-space: nowrap;
	text-indent: 100%;
	overflow: hidden;
	width: 65px;
	height: 14px;
	margin-right: 5px;
	background-repeat: no-repeat;
	background-position: 0 0;
}
ul.list dt.column    span { background-image: url(../img/common/ic_column.gif); }
ul.list dt.event     span { background-image: url(../img/common/ic_event.gif); }
ul.list dt.info      span { background-image: url(../img/common/ic_info.gif); }
ul.list dt.interview span { background-image: url(../img/common/ic_interview.gif); }
ul.list dt.others    span { background-image: url(../img/common/ic_others.gif); }
ul.list dt.project   span { background-image: url(../img/common/ic_project.gif); }
ul.list dt.topics    span { background-image: url(../img/common/ic_topics.gif); }





/*****************************************************************************************************
SNSシェアボタン
******************************************************************************************************/
.fb_iframe_widget > span {
	vertical-align: baseline !important;
}
ul.sns-share {
	list-style-type: none;
	margin: 1em 0;
	text-align: right;
}
ul.sns-share li {
	display: inline-block;
	vertical-align: top;
	margin: 0 !important;
}
@media only screen and (max-width: 700px) {
ul.sns-share {
	text-align: center;
}
}



/*****************************************************************************************************
パンくず
******************************************************************************************************/
ul.pan {
	list-style-type: none;
	width: 100%;
	background-color: #F7F7F7;
	box-sizing: border-box;
	border-bottom: solid 1px #CCC;
	padding: 10px 15px;
}
ul.pan li {
	display: inline;
	font-size: 87.5%;
}
ul.pan li strong {
	font-weight: normal;
}
/*****************************************************************************************************
Google search area
******************************************************************************************************/
.pc-gcarea{ left: -178px !important; }
.pc-gcarea li{ width: 300px; }


