@charset "UTF-8";

/* --------------------------------
 * base
 * -------------------------------- */
html {
	font-size: 62.5%;
    background-color: #006747;
}
body {
	color: #333333;
	font-size: 1.4rem;
	font-family: 'Open Sans', 'Meiryo', "Hiragino Kaku Gothic ProN",  sans-serif;
	border-top: 4px solid #006747;
    background-color: #fff;
}
*, *::before, *::after {
	box-sizing: border-box;
}
a:link, a:visited, a:hover, a:active {
	color: #333333;
	text-decoration: none;
}
.contsArea a:link, .contsArea a:visited, .contsArea a:active {
	color: #00875d;
	text-decoration: none;
}
.contsArea a:hover {
	text-decoration: none;
}
.main a:link, .contsArea a:visited, .contsArea a:active {
	text-decoration: underline;
}
.main a:hover {
	opacity: 0.7;
}
.top a:link, .top a:visited, .top a:hover, .top a:active {
	color: #333333;
	text-decoration: none;
}


/* --------------------------------
 * parts
 * -------------------------------- */
.clearfix::after {
  content: '';
  display: block;
  clear: both;
}
/* TOPへ戻るボタン */
#page-top {
    position: fixed;
    bottom: -2px;
    right: 25px;
    font-size: 2.5rem;
}
#page-top a {
    background: #999;
    text-decoration: none;
    color: #fff;
    width: 50px;
    padding: 6px 0 10px;
    text-align: center;
    display: block;
    border-radius: 6px;
}
#page-top a:hover {
    text-decoration: none;
    background: #66d2b0;
	transition: 0.15s;
}
.contsArea .cntBtn a {
	display: block;
	margin: 40px auto;
	width: 350px;
	font-size: 1.6rem;
	text-align: center;
	padding: 15px 0;
	color: #fff;
	background: #215da5;
	position: relative;
	border-radius: 6px;
	transition: 0.15s;
	text-decoration: none;
}
.contsArea .cntBtn a:hover {
	opacity: 0.7;
	filter: alpha(opacity=70);
}

/* --------------------------------
 * header
 * -------------------------------- */
.header {
	text-align: left;
}
.header:after {
	content: '';
	display: block;
	clear: both;
}
.headerInner {
	width: 960px;
	height: 110px;
	margin: 0 auto;
	padding: 15px 0;
}
.headerInner:after {
	content: '';
	display: block;
	clear: both;
}

/* ロゴ */
.logo {
	float: left;
	width: 85%;

}
.logo h1 {
	font-size: 2.8rem;
	margin: 0;
	padding: 0;
	font-weight: normal;
}
.logo h1 span.small {
	font-size: 2rem;
}
.logo h1 a {
	transition: 0.15s;
}
.logo h1 a:hover {
	opacity: 0.8;
	filter: alpha(opacity=80);
}
.logo img {
	float: left;
	margin-right: 15px;
	margin-top: 10px;
	height: auto;
}
.logo a:hover img {
	opacity: 0.8;
	filter: alpha(opacity=80);
}

/* サブナビ */
.subNav {
	float: right;
	position: relative;
	top: 50px;
	right: 0;
}
.subNav ul {
	float: right;
	margin: 0;
	padding: 0;
	list-style: none;
}
.subNav li a {
	font-size: 13px;
	display: inline-block;
    width: 100px;
	padding: 4px 0 5px;
	margin: 0 auto;
	transition: 0.15s;
	background-color: #006747;
	border-radius: 15px;
	text-align: center;
	color: #fff;
}
.subNav li a:hover {
	background-color: #2db68e;
}
.subNav li {
}

/* グローバルナビ */ 
.gNavArea {
	width: 100%;
	clear: both;
}
.gNavArea {
	background-color: #006747;
}
.gNav {
	width: 960px;
	margin: 0 auto;
}
.gNav:after {
	content: '';
	display: block;
	clear: both;
}
.gNav ul {
	margin: 0;
	padding: 0;
	list-style: none;
}
.gNav li a {
	display: block;
	padding: 1em 0px;
	color: #fff;
	font-size: 1.4rem;
	transition: 0.15s;
}
.gNav li a:hover {
	background-color: #00b47c;
}
.gNav li {
	display: inline-block;
	text-align: center;
	width: 120px;	
}
.gNav li.nav-item-last {
}

/* トグルボタン */
#menubtn {
	padding: 10px 10px;
	border: solid 1px #aaaaaa;
	border-radius: 4px;
	background-color: #ffffff;
	position: absolute;
	top: 25px;
	right: 18px;
	cursor: pointer;
}
#menubtn:hover {
	background-color: #dddddd;
}
#menubtn:focus {
	outline: none;
}
#menubtn i {
	color: #888888;
	font-size: 20px;
}

/* --------------------------------
 * contsArea
 * -------------------------------- */
.contsArea {
	width: 960px;
	margin: 0 auto;
	padding-top: 40px;
	padding-bottom: 40px;
}
.contsArea:after {
	content: '';
	display: block;
	clear: both;
}

/* imgArea:TOP */ 
.imgArea {
	position: relative;
	background: url('../images/top_main.jpg') no-repeat;
	background-color: gray;
	width: 960px;
	height: 300px;
	background-size: cover;
	margin: 0 0 40px;
}
.imgArea h1 {
	width: 960px;
	height: 2.5rem;
	position: absolute;
	line-height: 3.5rem;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	margin: auto;
	text-align: center;
	font-size: 2.5rem;
	font-family: "Roboto Slab" , Garamond , "Times New Roman" , "游明朝" , "Yu Mincho" , "游明朝体" , "YuMincho" , "ヒラギノ明朝 Pro W3" , "Hiragino Mincho Pro" , "HiraMinProN-W3" , "HGS明朝E" , "ＭＳ Ｐ明朝" , "MS PMincho" , serif;
	letter-spacing: 2px;
	color: #000;
	font-weight: normal;
}

/* news:TOP */ 
.news {
	float: left;
	width: 700px;
	margin-bottom: 40px;
}
.news h2 {
	margin: 0 0 5px;
	padding: 0 0 5px;
	font-size: 1.8rem;
	font-weight: normal;
	border-bottom: 2px solid #00b47c;
}
.news dl {
	width: 100%;
	margin: 0 auto;
}
.news dt {
	float: left;
	width: 9rem;
	padding: 0.75em 0;	
	color: #996600;
	font-size: 1.3rem;
	line-height: 1.5;
}
.news dd {
	font-size: 1.3rem;
	line-height: 1.5;
	margin: 0;
	padding: 0.75em 0;
	padding-left: 9rem;
	border-bottom: 1px solid #ccc;
}
.news a:link {
	text-decoration: underline;
}
.news a:hover {
	color: #999;
	text-decoration: underline;
}
.banner {
	float: right;
	width: 220px;
}
.banner ul {
	list-style: none;
	margin: 0;
	padding: 0;
}
.banner ul li {
	float: left;
	width: 100%;
	margin-bottom: 15px;
	display: list-item;
    text-align: -webkit-match-parent;
}
.banner ul li a {
	display: block;
	padding: 25px 25px;
	background-color: #cccccc;
}
.banner ul li a.recruitment {
	height: 75px;
}
.banner ul li a.message {
	height: 75px;
}
.banner ul li a:hover {
	opacity: 0.8;
	filter: alpha(opacity=80);
}

/* welcome:TOP */ 
.welcome {
	clear: both;
	width: 100%;
	height: 330px;
	background-color: #ccf0e5;
	border-radius: 8px;
	padding: 30px;
	position: relative;
}
.welcome {
	content: '';
	display: block;
	clear: both;
}
.welcome h2 {
	color: #006747;
	margin: 0 0 .25em;
	padding: 0;
	font-size: 2.6rem;
	font-weight: normal;
}
.welcome h3 {
	color: #99c2b5;
	font-size: 5rem;
	letter-spacing: .25rem;
	position: absolute;
	right: 0;
	top: -10px;
	padding: 0;
	margin: 0;
}
.welcome .wel-img {
	float: left;
	width: 330px;
    height: 220px;
	margin: 0;
    padding: 0;
}
.welcome .wel-img img {
    width: 100%;
	border: 5px solid #fff;
}
.welcome .wel-img .inner {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
#slideshow {
   position: relative;
   width:  330px; /* 画像の横幅に合わせて記述 */
   height: 220px; /* 画像の高さに合わせて記述 */
}
#slideshow img {
   position: absolute;
   top: 0;
   left:0;
   z-index: 8;
   opacity: 0.0;
}
#slideshow img.active {
   z-index: 10;
   opacity: 1.0;
}
#slideshow img.last-active {
   z-index: 9;
}
.welcome-txt {
	float: left;
	width: 570px;
	padding: 0 0 0 20px;
	margin: 0;
}
.welcome-txt p {
	margin: 0 auto 1em;
	color: #333333;
	font-size: 1.4rem;
	line-height: 1.7;
}
.welcome-txt ul.welcome-ul {
	list-style-position: outside;
	list-style-type: disc;
	margin: 0 0 1em 0;
	padding: 0 0 0 20px;
	font-weight: bold;
}
.welcome-txt ul.welcome-ul li {
	margin-left: 0;
	margin-left: 0;
}


/* --------------------------------
 * 第２階層
 * -------------------------------- */
 /* コンテンツ共通 */
.ttlArea {
	width: 100%;
	height: 120px;
	margin-bottom: 60px;
	border-top: 2px solid #cccccc;
	border-bottom: 2px solid #009966;
}
.ttlArea h1 {
	position: relative;
	top: 50%;
	-webkit-transform: translateY(-50%); /* Safari用 */
	transform: translateY(-50%);
	margin: 0 auto;
	padding-left: 30px;
	font-size: 3rem;
	line-height: 1;
	letter-spacing: 1px;
	font-weight: normal;
	color: #006747;
}
.sideMenu {
	float: left;
	width: 220px;
	background-color: #faf6f0;
	border-radius: 8px 8px 0 0;
}
.sideMenu h2 {
	margin: 0;
	padding: 10px 0 8px 10px;
	border-radius: 8px 8px 0 0;
	background-color: #006747;
	color: #fff;
	font-size: 1.6rem;
	font-weight: normal;
}

/* サイドメニュー（通常） */ 
ul.normal {
	margin: 0;
	padding: 0;
	list-style-type: none;
}
ul.normal li {
	border-bottom: 1px solid #6bb39c;
	line-height: 1.3;
    font-size: 1.4rem;
	font-weight: bold;
}
ul.normal a {
	color: #00875d;
	text-decoration: none;
	padding: 12px 10px;
	display: block;
	-moz-transition: all, 0.25s, linear;
	-o-transition: all, 0.25s, linear;
	-webkit-transition: all, 0.25s, linear;
	transition: all, 0.25s, linear;
}
ul.normal a:hover {
    color: #00875d;
    background: #e5e1da;
}

/* サイドメニュー（アコーディオン） */ 
.ul_open {
	list-style-type: none;
	margin: 0;
	padding: 0;
	border-bottom: 1px solid #6bb39c;
}
.ul_open li {
    line-height: 1.4;
}
.ul_open li a {
	display: block;
	color: #00875d;
	padding: 8px 12px;
    word-break: break-all;
}
.ul_open li a:hover {
	background: #e5e1da;
}
.ul_open > li:last-child {
	border-bottom: 1px solid #6bb39c;
    border: 0;
}
.open_h3 {
	margin: 0;
	padding: 10px;
	color: #00875d;
	border-bottom: 1px solid #6bb39c;
    cursor: pointer;
    display: block;
	position: relative;
}
.open_h3:after, 
.open_h3.active:after {
    font-size: 1.6rem;
    margin-right: 10px;
	position: absolute;
	right: 0px;
	top: 27%;
}
.open_h3.active::after {
	font-family: "fontello";
	content: '\E803';
}
.open_h3::after {
	font-family: "fontello";
	content: '\E801';
}
.close_h3 {
	position: relative;
	margin: 0;
	border-bottom: 1px solid #6bb39c;
}
.close_h3 a {
	padding: 10px;
	color: #00875d;
	display: block;
}
.close_h3 a:hover {
	background: #e5e1da;
}
.sideMenu span {
	font-size: 1.2rem;
    padding-left: 10px;
}
.sideMenu span.br4 {
	font-size: 1.4rem;
    padding-left: 0;
}


/* コンテンツ */ 
.main {
	float: right;
	width: 720px;
}
.main h2 {
	width: 100%;
	font-size: 2rem;
	font-weight: normal;
	margin: 0 0 1em;
	padding: 15px 20px 12px;
	color: #fff;
	line-height: 1.3;
	background-color: #2db68e;
	border-radius: 8px;
    clear: both;
}
.main h3 {
	width: 95%;
	font-size: 1.6rem;
	margin: 1.5em auto .5em;
	color: #996600;
    clear: both;
}
.main p {
	width: 95%;
	margin: 0 auto 1em;
	color: #333333;
	line-height: 1.7;

}
.main p.w100 {
	width: 100%;
}
.main ul {
	width: 95%;
	margin: 0 0 1em;
	font-size: 1.4rem;
}
.main ul li {
	margin: 0 0 .5em 0;
	line-height: 1.7;
}
.main ol {
	margin: 0;
	font-size: 1.4rem;
}
.main ol li {
	margin: 0 0 .4em 0;
	line-height: 1.3;
}
.main article {
	margin-bottom: 40px;
}
.main dl {
	width: 95%;
	margin: 0 auto 1em;
	font-size: 1.4rem;
	line-height: 1.7;
}
.main table {
	width: 95%;
	margin: 0 auto;
}
.main table th {
	padding: 8px;
	border: 1px solid #ccc;
	text-align: left;
	vertical-align: top;
	background-color: #e5e5e5;
	width: 7em;
}
.main table td {
	padding: 8px;
	border: 1px solid #ccc;
}
.main table.member th {
	width: 7em;
}
ul.noticeBox {
	background-color: #ccf0e5;
	padding: 25px 30px 20px 40px;
	font-size: 1.6rem;
	font-weight: bold;
	font-family: Garamond , "Times New Roman" , "游明朝" , "Yu Mincho" , "游明朝体" , "YuMincho" , "ヒラギノ明朝 Pro W3" , "Hiragino Mincho Pro" , "HiraMinProN-W3" , "HGS明朝E" , "ＭＳ Ｐ明朝" , "MS PMincho" , serif;
}
ul.noticeBox li {
}
.colorBox {
	width: 95%;
	background-color: #ccf0e5;
	padding: 20px;
	margin: 20px auto; 
}
.colorBox p {
	font-weight: bold;
	margin-bottom: 0;
}
.colorBox ul {
	margin-bottom: 0;
	margin-left: 0;		
}
.colorBox li {
	margin-bottom: 0;
}
.italic {
    font-style: italic;
}

/* メンバー */ 
.name {
	width: 95%;
	margin: 0 auto;
	border-bottom: 2px solid #006747;

}
.name h3 {
	font-size: 2.8rem;
	margin: 1em auto .5em 0;
}
.name h3 .en {
	font-size: 1.8rem;
	font-style: italic;
}
.name p.syozoku {
	width: 100%;
	padding-bottom: 5px;
}
.member h3 {
	color: #006747;
}
.member h4 {
	width: 95%;
	font-size: 1.6rem;
	margin: 1.5em auto .5em;
	color: #996600;
}
.gakubu {
	width: 45%;
	float: left;
	margin-left: 2.5%;
	margin-right: 2.5%;
	padding-top: 20px;
	border-top: 2px solid #2db68e;
}
.gakubuBox {
	float: left;
	width: 100%;
	margin-bottom: 20px;
}
.gakubu h3 {
	font-size: 2.0rem;
	margin: 0 auto .5em 0;
	line-height: 1.2;
}
.gakubu h3 .en {
	font-size: 1.4rem;
	font-style: italic;
}
.gakubu p.syozoku {
	width: 100%;
}
.gakubu h4 {
	width: 100%;
	margin: 1.2em auto .25em;
}
.member p {
	font-size: 1.4rem;
	line-height: 1.7;
}
.member p.photo1, .member p.photo2 {
	width: auto;
	float: right;
	margin-top: 20px;
	margin-right: 2.5%;
	margin-left: 20px;
}
.member p.photo3 {
	width: auto;
	float: right;
	margin-right: 0;
	margin-left: 10px;
}
.member p.photo1 img {
	width: 180px;
	height: auto;
	border: 1px solid #006747;
}
.member p.photo2 img {
	width: 160px;
	height: auto;
	border: 1px solid #006747;
}
.member p.photo3 img {
	width: 90px;
	height: auto;
	border: 1px solid #006747;
}
.member dl.dl-table1, .member dl.dl-table2, .member dl.dl-line {
	width: 95%;
	margin: 0 auto;
}
.member dl.dl-table1 dt, .member dl.dl-table2 dt {
	float: left;
	margin: 0;
	padding: 0;
    font-weight: bold;
}
.member dl.dl-table1 dd {
	margin: 0 0 0 14%;
	padding: 0;
}
.member dl.dl-table2 dd {
	margin: 0 0 0 20%;
	padding: 0;
}
.member dl.dl-line dt {
    width: 100%;
	font-weight: bold;
    float: none;
	margin: 0;
	padding: 0;
}
.member dl.dl-line dd {
	margin: 0;
	padding: 0;
}
.underline {
    text-decoration: underline;
}

/* 研究テーマ */ 
dl.theme  {
	width: 95%;
	margin: 0 auto 1em;
    clear: both;
}
dl.theme dt {
	width: 9em;
	float: left;
	clear: left;
	margin: 0;
	padding: 0;
	font-weight: bold;
}
dl.theme dd {
	margin: 0 0 0 9em;
	padding: 0;
}
figure {
	margin: 0 0 40px;
	padding-left: 20px;
	padding-right: 20px;
}
figcaption {
	line-height: 1.4;
	margin: .4rem 0;
	text-align: center;
}
figure.figure1 {
	width: 100%;
	text-align: center;
}
figure.figure2 {
	float: left;
	width: 50%;
}
figure img.figure_80 {
	width: 80%;
}
figure img.figure_60 {
	width: 60%;
}
figure img {
	width: 100%;
}
p.jsps-logo, p.biorima_logo {
    width: auto;
    height: auto;
    float: right;
    margin-right: 2.5%;
    margin-left: 15px;
    margin-bottom: 1em;
}
p.jsps-logo img {
    width: 180px;
}
p.biorima_logo img {
    width: 100px;  
}

/* 研究業績 */
.publication {
    float: none;
    width: 960px;
}
.publication ul.pubbtn {
    list-style: none;
    margin: 40px auto;
    padding: 0;
}
.publication ul.pubbtn li {
    font-size: 2.0rem;
    line-height: 1.2;
    margin-bottom: 2rem;
    font-weight: bold;
}
.publication ul.pubbtn span {
    font-size: 1.4rem;
    font-weight: normal;
    padding-left: 1em;
}
.publication ul.pubbtn li a {
    text-decoration: none;
    display: inline-block;
    background-color: #faf6f0;
    border: 1px solid #6bb39c;
    padding: 15px 30px;
    border-radius: 4px;
    width: 100%;
}
.publication ul.pubbtn li a:hover {
    text-decoration: none;
    color: #00875d;
    background: #e5e1da;
    opacity: 1;
}
.publication ul.pubbtn .fas {
    padding-left: 4px;
}

/*.publication ul {
    margin: 0 auto;
}
.publication ul li {
	margin: 0 0 3em 0;
	font-size: 1rem
}
.publication ul li h1 {
	font-size: 1.6rem;
	margin: .2em 0;
	line-height: 1.4;
}
.publication ul li .journal {
	font-size: 1.2rem;
	line-height: 1.1;
}
.publication ul li .author {
	font-size: 1.2rem;
	font-style: italic;
	line-height: 1.1;
}*/


/* ギャラリー */ 
.gallery {
	display: flex;
	flex-flow: row wrap;
	justify-content: space-between;
	align-items: stretch;
	width: 960px;
}
.galleryphoto {
	width: calc(50% - 2%);
margin-bottom: 20px;
	text-align: center;

}
.galleryphoto img {
	width: 100%;
}
.galleryphoto img.tate {
	width: 80%;
}
.galleryphoto p {
	text-align: center;
    width: 100%;

    font-size: 1.3rem;
}

/* アクセス */ 
.ggmap {
position: relative;
padding-bottom: 56.25%;
padding-top: 30px;
height: 0;
overflow: hidden;
}

.ggmap iframe,
.ggmap object,
.ggmap embed {
margin: 0 2.5%;
position: absolute;
top: 0;
left: 0;
width: 95%;
height: 95%;
}

/* News */
dl.date {
	margin-bottom: 0;
}
dl.date dt {
	width: 8em;
	float: left;
	clear: left;
	margin: 0 auto .25rem;
	font-weight: bold;
}
dl.date dd {
	padding-left: 8rem;
	margin: 0 auto .25rem;
}
dl.date2 dt {
	width: 14em;
	float: left;
	clear: left;
	margin: 0 auto .25rem;
	font-weight: bold;
}
dl.date2 dd {
	padding-left: 14rem;
	margin: 0 auto .25rem;
}

/* --------------------------------
 * footer
 * -------------------------------- */
.footer {
	float: left;
	width: 100%;
	margin: 0;
	padding: 0;
	background-color: #006747;
	border-top: 3px solid #00b47c;
	background-image: url(../images/nanomaterial.png);
	background-repeat: no-repeat;
	background-position: 85% 50%;
}
.footer p {
	font-size: 1.3rem;
	color: #fff;
}
.footer a {
	color: #fff;
	text-decoration: none;
}
.footer a:hover {
	color: #ccc;
}
.footInner {
	width: 960px;
	margin: 0 auto;
	padding: 50px 0;
}
.footInner:after {
	content: '';
	display: block;
	clear: both;
}
.footInfo {
	float: left;
	width: 100%;
}
.copyright {
	clear: both;
}
/*
.footMenu {
	float: left;
	width: 20%;
}
.footMenu ul {
	padding: 0;
	list-style: none;
	border-left: 1px solid #eee;
}
.footMenu ul li {
	font-size: 1.3rem;
	margin: 0.2rem 0;
	padding-left: 10px;
}
*/



/* --------------------------------
 * smart phone
 * -------------------------------- */
/* 1024px以下 */ 
@media (max-width: 1024px) {
.headerInner {
	width: 95%;
	height: auto;
}
.hBox {
	width: 95%;
}
.gNav {
	width: 95%;
}
.gNav li {
	width: 12.5%;
}
.gNav li a {
	font-size: 1.2rem;
}
.gNav li.nav-item-last {
	width: 12.5%;
}
.ttlBox {
	width: 100%;
}
.contsArea {
	width: 95%;
}
.imgArea {
	width: 100%;
}
.imgArea-txt {
	width: 100%;
}
.imgArea h1 {
	width: 100%;
}
.news {
	width: 70%;
}
.banner {
	width: 28%;
}
.welcome {
	float: left;
	height: auto;
}
.welcome .wel-img {
	width: 35%;
}
#slideshow {
   width: 35%;
}
.welcome-txt {
	width: 63%;
    padding-left: 2%;
}
.sideMenu {
	width: 100%;
	margin-bottom: 30px;
}
.sideMenu h2 {
	padding: 8px 0 6px 8px;
}
.main {
	width: 100%;
}
.member h2 {
	padding: 12px 0 10px 18px;
}
.footInner {
  width: 95%;
}
    .br_sidemenu{
  	content: "\A";
	white-space: pre;
    padding-left: 10px;
    }
}

/* --- 890px以上 --- */
@media (min-width: 891px) {
.br2:before {
	content: "\A";
	white-space: pre;	
}
.br4:before {
	content: "\A";
	white-space: pre;
}
}

/* --- 890px以下 --- */
@media (max-width: 890px) {
.imgArea h1 {
	font-size: 2.4rem;
}
.welcome h2 {
	font-size: 2.4rem;
}
.welcome h3 {
	font-size: 4rem;
}
.br2:before {
	display: none;	
}
.br4:before {
	display: none;
}
.imgBox .br:before {
	content: "\A";
	white-space: pre;	
}
}

/* --- 769px以上 --- */
@media (min-width: 769px) {
/* トグルボタン */
#menubtn {
	display: none;
}
}

/* --- 768px以下 --- */
@media (max-width: 768px) {
.contsArea {
	padding-top: 20px;
	padding-bottom: 20px;
}
.header {
	border-bottom: 2px solid #006747;
	margin-bottom: 10px;
}
.logo {
	width: 80%;
}
.logo h1 {
	font-size: 2rem;
}
.logo h1 span.small {
	font-size: 1.6rem;
}
.logo img {
	width: 65px;
	margin-right: 10px;
	margin-top: 0px;
}
.subNav {
	position: absolute;
	top: 38px;
	right: 75px;
	text-align: center;
}
.subNav li a {
    font-size: 12px;
    width: 80px;
}
.imgArea {
	margin: 0px 0 20px;
	height: 250px;
}
.imgArea h1 {
	font-size: 2rem;
	line-height: 1.4;
	height: 4rem;
}
.ttlArea {
	margin-bottom: 30px;
	height: 120px;
}
.ttlArea h1  {
	font-size: 2.8rem;
}
.sideMenu {
	margin-bottom: 30px;
}
.main {
	margin-bottom: 30px;
}
.gakubu {
	width: 95%;
	float: none;
	margin: 0 auto;
	padding-top: 20px;
	border-top: 2px solid #2db68e;
}
figure.figure2 {
	clear: both;
	width: 100%;
}
figcaption {
	font-size: 1.3rem;
}
img.img-r {
	clear: both;
	width: 100%;
}
p.jsps-logo, p.biorima_logo {
    width: 95%;
    float: none;
    margin-right: auto;
    margin-left: auto;
    text-align: center;
}
p.jsps-logo img {
    width: 150px;    
}
p.biorima_logo img {
    width: 80px;
}
.gakubuBox {
	float: none;
	width: 100%;
	margin-bottom: 20px;
}
.member p.photo1, .member p.photo2 {
	width: 95%;
	float: none;
	margin-right: auto;
	margin-left: auto;
	text-align: center;
}
.member p.photo3 {
	float: none;
	margin-right: auto;
	margin-left: auto;
	text-align: center;
}
.member p.photo1 img, .member p.photo2 img, .member p.photo3 img {
	width: 140px;
}
.member dl.dl-table1 dt, .member dl.dl-table2 dt {
    float: none;
}
.member dl.dl-table1 dd, .member dl.dl-table2 dd {
     margin: 0 0 .5em 0;   
}
.galleryphoto {
	float: none;
	width: 95%;
}
.br3:before {
	content: "\A";
	white-space: pre;	
}
/* News */
dl.date, dl.date2 {
	margin-bottom: 0;
}
dl.date dt, dl.date2 dt {
	width: auto;
	float: none;
	margin: 0 auto 0;
}
dl.date dd, dl.date2 dd {
	padding-left: 0;

}

/* グローバルナビ（縦並び） */
.gNav {
	display: none;
}
.gNav {
	width: 100%;
	margin-top: 0px;
	margin-bottom: 0;
	padding-right: 0;
}
.gNav ul {
	margin: 0;
}
.gNav li.nav-item-last {
	width: 100%;
	border-right: none;
}
.gNav li a {
	width: 100%;
	height: auto;;
	margin: 0;
	padding: 10px 0;
	color: #ffffff;
	background-color: #006747;
	font-size: 1.4rem;
	text-decoration: none;
	border-top: 1px solid #fff;
	-webkit-transition: all 0.2s;
	transition: all 0.2s;
}
.gNav li a:hover {
	background-color: #2db68e;
	border-radius: 0px;
}
.gNav li {
	display: block;
	width: 100%;
	padding: 0;
	border-left: none;
}
.news {
	width: 100%;
}
.banner {
	width: 100%;
	margin-bottom: 30px;
}
.welcome .wel-img {
	width: 100%;
    float: none;
    height: auto;
    padding-top: 67%;
}
#slideshow {
   width: 100%;
}
.welcome-txt {
    margin-top: 1em;
    padding-left: 0;
	width: 100%;
}
.footer {
	background-image: url(../images/nanomaterial.png);
	background-repeat: no-repeat;
	background-position: 100% 50%;
	color: #fff;
}

.serviceList {
	padding-bottom: 20px;
}
.serviceList h2 {
	text-align: center;
}
.serviceList ul li {
}
.serviceList ul li a {
	width: 100%;
	height: auto;
	margin-bottom: 20px;
}
.serviceList .slBox {
	width: 100%;
	margin-right: 0;
}
.serviceList .slBox_end {
	width: 100%;
}
.pickUp {
	padding-bottom: 40px;
}
.pickUp ul li a {
	width: 100%;
	padding: 20px 20px;
	margin-bottom: 20px
}
.puBox1 {
	width: 100%;
	margin-right: 0;
}
.puBox2 {
	width: 100%;
}
.pickUp h2 {
	font-size: 1.8rem;
}
.companyInfo {
	float: none;
	width: 300px;
	margin: 0 auto;
}
.ciBox1 {
	width: 90px;
}
.footMenu {
	float: none;
	width: 100%;
}
.footMenu ul {
	padding: 0;
	border-left: none;
}
.footMenu ul li {
	width: 100%;
	border-bottom: 1px solid green;
	margin: 0;
	padding: 0;
	line-height: 2;
}
.footMenu ul li a {
	display: block;
	margin: 0;
	padding: 3px 10px;
}
.fm1 {
	width: 100%;
	margin: 0;
	padding: 0;
}
.fm2 {
	width: 100%;
	margin: 0;
	padding: 0;
}
#page-top {
	bottom: 2px;
    font-size: 2.8rem;
}
#page-top a {
    width: 50px;
    padding: 3px 0 8px;
    border-radius: 4px;
}
.ttlArea {
	height: 120px;
}
.ttlImg {
	height: 120px;
}
.ttlArea h1 {
	font-size: 3.2rem;
}
.contsArea .cntBtn a {
	font-size: 1.4rem;
}

/* コンテンツ共通 */ 
.main h2 {
	font-size: 2.0rem;
}
.main p {
	font-size: 1.3rem;
	line-height: 1.6;
}
.main ul {
	font-size: 1.3rem;
	line-height: 1.6;
    padding-left: 30px;
}
.main ol {
	font-size: 1.3rem;
}
.main dl {
	font-size: 1.3rem;
	line-height: 1.6;
}
.colorBox {
	padding: 15px;
}
}

@media (max-width: 640px) {
.headerInner {
	padding-top: 15px;
    padding-bottom: 20px;
}
.logo h1 {
	font-size: 1.6rem;
	margin-bottom: 3px;
}
.logo h1 span.small {
	font-size: 1.4rem;
}
.logo img {
	width: 60px;
	margin-right: 5px;
	margin-top: 10px;
}
#menubtn {
	top:20px;
}
.subNav {
	position: absolute;
	top: 80px;
	right: 12px;
}
.subNav li a {
	font-size: 11px;
    padding: 3px 0 5px;
    width: 62px;
}
.gNav {
	margin-bottom: 0;
}
.imgArea h1 {
	font-size: 1.8rem;
}
.welcome {
	padding: 35px 15px 10px;
}
.welcome h2 {
	font-size: 2.2rem;
}
.welcome h3 {
	letter-spacing: 0;
	font-size: 3.6rem;
}
.footer {
	background-image: url(../images/nanomaterial_s.png);
	background-position: 120% 50%;
}
.footer	p {
	font-size: 1.2rem;	
}
.footInner {
	padding: 10px 0;
}
.ttlArea {
	height: 100px;
}
.ttlArea h1  {
	padding-left: 20px;
	font-size: 2.4rem;
}
.br:before {
	content: "\A";
	white-space: pre;	
}
.imgBox img {
	float: none;
	width: 100%;
	height: auto;
	margin-left: 0;
	padding-bottom: 0px;
	margin-bottom: 10px;
}
.contsArea table th {
	padding: 10px;
	font-size: 1.2rem;
}
.contsArea table td {
	padding: 10px;
	font-size: 1.2rem;
}
.contsArea table.outline th {
	width: 7em;
}
.contsArea table.recruit th {
	width: 6em;
}
.contsArea table.contact .tel {
	font-size: 1.8rem;
}
.contsArea table.contact .small {
	font-size: 1.4rem;
}
.contsArea table.contact i{
	display: none;
}
figure img.figure_80 {
	width: 100%;
}
figure img.figure_60 {
	width: 80%;
}
.publication ul.pubbtn {
    margin: 20px auto;
}
.publication ul.pubbtn li {
    font-size: 1.8rem;
}
.publication ul.pubbtn span {
    font-size: 1.2rem;
}
.publication ul.pubbtn li a {
    padding: 15px 15px 10px;
}
}

@media screen and (min-width: 600px) {
  a[href^="tel:"] {
    pointer-events: none;
  }
}