@charset "utf-8";
@import url('https://fonts.googleapis.com/css?family=Hind+Guntur:400,600');
/* 色 */
/* 
濃ピンク　#bb0322
ピンク　#dd3366
淡ピンク　#ffb6b9
淡淡ピンク　#ffe2e3
トップへ＆ハンバーガー　#66172d
リンク　#dd3366
リンク済み　#992233

濃グリーン　#009988
グリーン　#2db588
淡グリーン　#8dd9bf
淡淡グリーン　#d8e6d5
トップへ＆ハンバーガー　#17664c
リンク　#2db588
リンク済み　#229972

本文　#252525
	*/

/* 全体
----------------------------------------------------------- */
body {
		font-family: -apple-system, BlinkMacSystemFont, 'Helvetica Neue', 'Segoe UI', "ヒラギノ角ゴ Pro",'Hiragino Kaku Gothic ProN', "メイリオ","Meiryo" , "游ゴシック",'Yu Gothic', sans-serif;
color: #333;
background: #fff;
}
a{
font-size:14px;
font-size:1.4rem;
}
p {
font-size:14px;
font-size:1.4rem;
line-height: 1.5;
margin:0px 60px 40px 60px;
padding:0px;
text-align: left;
}

.static {
position: static;
}
.relative {
position: relative;
}
.absolute {
position: absolute;
}
.w960{
width:960px;
margin: 0px auto;
padding: 0px;
display: inline-table;
min-height: 1%;
}
.w960:after {
display: block;
clear: both;
height: 0;
visibility: hidden;
content: ".";
}
.w960 p img{
display: block;
margin:0 auto;
padding:0px;
width:400px;
height:auto;
}

.author{
font-size:14px;
font-size:1.4rem;
text-decoration:underline;
}
.attention{
font-size:16px;
font-size:1.6rem;
color:#06bf7b;
}
.code{
font-size:16px;
font-size:1.6rem;
font-family:monospace;
line-height:1.8;
}
small{
font-size:12px;
font-size:1.2rem;
}

/*見出し
----------------------------------------------------------- */
h1{
margin:18px 0px 40px 0px;
padding:0px 0px 2px 10px;
background-color:#ffb6b9;
line-height:1;
}
h1 .top-h1{
display:block;
width:960px;
margin: 0px auto -20px auto;
padding: 0px 0px 0px 0px;
font-family: 'Hind Guntur', sans-serif;
font-size:40px;
font-size:4rem;
text-align:right;
line-height:1.1;
color:#ffe2e3;
filter: alpha(opacity=50);        /* ie lt 8 */
-ms-filter: "alpha(opacity=50)";  /* ie 8 */
-moz-opacity:0.5;                 /* FF lt 1.5, Netscape */
-khtml-opacity: 0.5;              /* Safari 1.x */
opacity:0.5;
}
h1 .top-h1-small{
display:block;
width:960px;
margin: 0px auto -20px auto;
padding: 4px 0px 0px 0px;
font-family: 'Hind Guntur', sans-serif;
font-size:30px;
font-size:3rem;
text-align: right;
line-height:1;
color:#ffe2e3;
filter: alpha(opacity=50);        /* ie lt 8 */
-ms-filter: "alpha(opacity=50)";  /* ie 8 */
-moz-opacity:0.5;                 /* FF lt 1.5, Netscape */
-khtml-opacity: 0.5;              /* Safari 1.x */
opacity:0.5;
}
h1 .bottom-h1{
display:block;
width:960px;
margin: 0px auto 0px auto;
padding: 0px;
font-size:24px;
font-size:2.4rem;
color:#bb0322;
text-align: left;
line-height:1;
filter: alpha(opacity=70);        /* ie lt 8 */
-ms-filter: "alpha(opacity=70)";  /* ie 8 */
-moz-opacity:0.7;                 /* FF lt 1.5, Netscape */
-khtml-opacity: 0.7;              /* Safari 1.x */
opacity:0.7;
}
h2{
position: relative;
margin:0px 0px 20px 0px;
padding:0px 0px 0.5rem 10px;
font-size:20px;
font-size:2rem;
text-align: left;
line-height:1.2;
border-bottom:4px solid #ffb6b9;
}
h2 a{font-size:20px;font-size:2rem;}
h2::after {
position: absolute;
bottom: -4px;
left: 0;
z-index: 2;
content: '';
width: 120px;
border-bottom:4px solid #dd3366;
}
h3{
margin:0px 0px 20px 60px;
padding:0px 0px 0.5rem 0px;
font-size:16px;
font-size:1.6rem;
text-align: left;
line-height:1.2;
border-bottom:4px solid #ffb6b9;
}
h3 a{font-size:16px;font-size:1.6rem;}

/*リスト
----------------------------------------------------------- */
ul{
margin:0px 60px 40px 60px;
padding:0px;
text-align: left;
}
ol{
margin:0px 60px 40px 90px;
padding:0px;
text-align: left;
}
ol.list{
list-style-type: decimal;
}
ol.list li{
margin:0px ;
padding:0px 0px 20px 0px ;
text-align: left;
line-height:1.5;
font-size:14px;
font-size:1.4rem;
}
ol.list li::after{
	content: '';
	width: 0em;
	height: 0em;
background-color: transparent;
}
.list li{
margin:0px ;
padding:0px 0px 10px 12px;
position: relative;
text-align: left;
line-height:1.5;
font-size:14px;
font-size:1.4rem;
}
.list li::after{
	position: absolute;
	top: 7px;
	left: 0;
	z-index: 2;
	content: '';
	width: .4em;
	height: .4em;
-moz-border-radius: .2em; /* gecko */
-webkit-border-radius: .2em; /* webkit */
-khtml-border-radius: .2em; /* old konkeror */
border-radius: .2em; /* CSS3 standard */
	background-color: #ff9498;
}
.list li ul{
margin:0px ;
padding:10px 0px 0px 1.2em;
position: relative;
text-align: left;
}
.list li ul li{
margin:0px ;
padding:0px 0px 10px 12px;
position: relative;
text-align: left;
font-size:14px;
font-size:1.4rem;
}
.list li ul li::after{
	position: absolute;
	top: 7px;
	left: 0;
	z-index: 2;
	content: '';
	width: .4em;
	height: .4em;
-moz-border-radius: .2em; /* gecko */
-webkit-border-radius: .2em; /* webkit */
-khtml-border-radius: .2em; /* old konkeror */
border-radius: .2em; /* CSS3 standard */
	background-color: #ffb6b9;
}

/*テーブル
----------------------------------------------------------- */
table{
border-collapse: separate;
border-spacing: 0px 20px;
margin:0px 60px 40px 60px;
padding:0px;
text-align: left;
width : 90% ; /* IE8以下とAndroid4.3以下用フォールバック */
width : -webkit-calc(100% - 60px) ;
width : calc(100% - 60px) ;
}
th{
margin: 0px;
padding: 5px 10px;
white-space:nowrap;
text-align: left;
border-right:4px solid #bb0322;
font-size:14px;
font-size:1.4rem;
line-height:1.5;
}
.wrap th{
white-space:normal;
}
td{
margin: 0px;
padding: 5px 0px 5px 10px;
font-size:14px;
font-size:1.4rem;
line-height:1.5;
}
th a, td a{font-size:14px;font-size:1.4rem;}

.grant_box, .patent_box {
border-collapse: separate;
border-spacing: 0px;
}
.grant_box td:first-child , .patent_box td:first-child{
padding:10px ;
border:none;
border-top:2px solid #bb0322;
white-space:normal;
text-align: center;
}

.grant_box td:nth-of-type(2){
width:20%;
}
.grant_box td:nth-of-type(3){
padding-left:15px;
}
.patent_box td:nth-of-type(2){
width:20%;
}
.patent_box td:nth-of-type(3){
width:20%;
padding-left:10px;
}
.patent_box td:nth-of-type(4){
width:15%;
padding-left:10px;
}
.patent_box td:nth-of-type(5){
padding-left:25px;
}

.grant_box td , .patent_box td{
border-top:1px solid #bb0322;
}
.grant_box tr:last-child td , .patent_box tr:last-child td{
border-bottom:2px solid #bb0322;
}



/*ヘッダー
----------------------------------------------------------- */
.header , .header-sub{
position: relative;
margin: 0px;
padding: 0px;
background: #ffe2e3;
}

.head-h1{
width:960px;
margin: 0px auto;
padding: 20px 20px 0px 0px;
text-align: left;
background: #ffe2e3;
}
.head-h1 a , .header-sub .head-h1 a{
background: transparent;
border:none;
}
.header-sub .head-h1{
padding: 10px 10px 0px 0px;
}
.lang-en{
position: absolute;
	top:0;
width: 100%;
margin: 0px;
padding: 135px 20px 0px 0px;
text-align:right;
background: #fff;
color: #dd3366;
}
.header-sub .lang-en{
padding: 82px 20px 0px 0px;
}
.head-h1 img{
position: relative;
width: 500px;
z-index: 1;
}
.header-sub .head-h1 img{
width: 320px;
}
.breadcrumb{
width:960px;
margin: 27px auto -11px  auto;
padding: 0px;
font-size:14px;
font-size:1.4rem;
}
/*フッター
----------------------------------------------------------- */
.footer {
width: 100%;
margin: 40px 0px 0px 0px;
padding: 15px 0px;
background: #ffb6b9;
color:#66172d;
font-size:14px;
font-size:1.4rem;
line-height:1.5;
}


/*トップページ
----------------------------------------------------------- */
.topphoto__cap{
margin: 0px;
padding: 10px 0px 40px 0px;
text-align: center;
}
.contents__topphoto{
background: #ffe2e3;
text-align: center;
}
.contents__topphoto img{
margin:  40px 0px 0px 0px;
padding: 0px;
width: 400px;
}
.contents__top{
margin: 0px;
padding: 40px 0px 20px 0px;
text-align: center;
background: #fff;
}

.counter{
margin: 0px;
padding: 0px 0px 40px 0px;
text-align: center;
background: #fff;
color: #bb0322;
}

/*オーバーレイ
----------------------------------------------------------- */
.wrapper {
position: relative;
width: 100%;
height: 100%;
text-align: center;
background: #fff;
-webkit-transition: all .5s ease;
transition: all .5s ease;
z-index: 2;
}
.wrapper:before,
.wrapper:after {
	display: table;
	content: " ";
}
.wrapper:after {
	clear: both;
}
.side-open .wrapper,
.side-open .overlay {
-webkit-transform: translate3d(-300px, 0, 0);
transform: translate3d(-300px, 0, 0);
}

.overlay {
content: '';
visibility: hidden;
position: fixed;
top: 0;
left: 0;
display: block;
width: 100%;
height: 100%;
background: rgba(255,255,255,0);
-webkit-transition: all .5s ease;
transition: all .5s ease;
z-index: 3;
}

.side-open .overlay {
visibility: visible;
cursor: pointer;
background: rgba(221,51,102,.5);
}

.overlay::after {
visibility: hidden;
position: fixed;
display: block;
width: 100%;
height: 50px;
color: rgba(255,255,255,0);
-webkit-transition: all .5s ease;
transition: all .5s ease;
}

.side-open .overlay::after {
visibility: visible;
color: rgba(255,255,255,.8);
}

/*サイドメニュー
----------------------------------------------------------- */
.side-menu {
position: fixed;
top: 0;
right: 0;
box-sizing: border-box;
width: 300px;
height: 100%;
padding-top: 65px;
text-align: left;
z-index: 1;
}
ul.side-menu__ul , ul.side-menu__ul li {
margin:0px;
}

.side-menu__ul {
width: 100%;
height: 100%;
display: block;
overflow: auto;
}

.side-menu__ul--child{
display: none;
margin:0px;
}

.active .side-menu__ul--child{
display: block;
margin:0px;
}
.side-menu__ul--childchild {
margin:0px;
}
.side-menu__ul--child li a {
display: block;
margin:0px;
padding: 12px 0px 10px 30px;
font-size: 14px;
font-size: 1.4rem;
color: #bb0322;
border:none;
}
.side-menu__ul > li h2 {
display: block;
margin:0px;
padding: 12px 0px 10px 30px;
font-size: 14px;
font-size: 1.4rem;
color: #bb0322;
border:none;
border-top:2px dotted #bb0322;
}
.side-menu__ul > li h2::after {
border:none;
}
.side-menu__ul > li h3 {
display: block;
margin:0px;
padding: 0px 0px 0px 30px;
font-size: 14px;
font-size: 1.4rem;
color: #bb0322;
border:none;
}
.side-menu__ul > li h3.side-menu__li-kenkyu {
display: block;
margin:0px;
padding: 0px;
font-size: 14px;
font-size: 1.4rem;
color: #bb0322;
border:none;
}
.side-menu__ul > li h3.side-menu__li-kenkyu a{
margin:0px;
padding: 12px 0px 10px 30px;
font-size: 14px;
font-size: 1.4rem;
}
.side-menu__ul--childchild > li a{
display: block;
margin:0px;
padding: 6px 0px 4px 50px;
color: #bb0322;
border:none;
font-size: 14px;
font-size: 1.4rem;
}

.side-menu__ul > li > a{
display: block;
margin:0px;
padding: 12px 0px 10px 30px;
color: #bb0322;
border-top:2px dotted #bb0322;
font-size: 14px;
font-size: 1.4rem;
}
.side-menu__ul--child li.topline a{
border-top:2px dotted #bb0322;
}
.side-menu__ul > li.nav__last > a{
border-bottom:2px dotted #bb0322;
}
.side-menu__ul > li.gotoHome > a{
border-top:none;
padding-right:15px;
}
.side-menu__ul > li.gotoHome{
text-align:right;
}
.side-menu__ul > li.gotoEN{
text-align:right;
}
.side-menu__ul > li.gotoEN > a{
border-top:none;
padding-right:15px;
}

.side-menu__ul h2 {
cursor: pointer;
-webkit-transition: all .5s;
transition: all .5s;
}

.side-menu__ul > li{
position:relative;
}
.side-menu__ul > li > h2:after {
position: absolute;
bottom: 8px;
left: 10px;
content: '+';
color: #bb0322;
font-size: 20px;
font-size: 2rem;
}

.side-menu__ul > li.active h2:after {
position: absolute;
bottom: 8px;
left: 10px;
content: ' -';
font-size: 20px;
font-size: 2rem;
}
.side-menu__ul--child > li{
position:relative;
}
.side-menu__ul--child > li h2:after {
position: absolute;
bottom: 8px;
left: 15px;
content: ' -';
font-size: 20px;
font-size: 2rem;
}

.side-menu__ul > li > h2:hover,
.side-menu__ul > li a:hover {
background: #ffe9ea;
color: #dd3366;
}

/* --------------------------------------------------- ellipsis btn */
.side-menu-btn {
position: fixed;
top: 0px;
right: 30px;
width: 40px;
height: 40px;
cursor: pointer;
z-index: 4;
}

.ellipsis-v {
position: relative;
display: block;
cursor: pointer;
width: 60px;
height: 40px;
padding: 10px;
background: #fff;
}

.ellipsis-v .point{
position: absolute;
left: 0;
right: 0;
display: block;
width: 40px;
height: 6px;
margin: auto;
background: #66172d;
-webkit-transition: all .3s;
transition: all .3s;
}
.ellipsis-v .point.top {
top: 10px;
}
.ellipsis-v .point.mid {
top: 22px;
}
.ellipsis-v .point.bot {
top: 34px;
}
.ellipsis-v .let {
position: absolute;
left: 0;
right: 0;
top: 40px;
text-align:center;
font-family: 'Hind Guntur', sans-serif;
font-weight:600;
background: #fff;
font-size:14px;
font-size:1.4rem;
line-height:1.8;
}
.ellipsis-v .let-open {
display:none;
}

.side-menu-btn:hover .top,
.side-menu-btn:hover .mid,
.side-menu-btn:hover .bot
{
background: #bb0322;
}
.side-open .let {
display:none;
}
.side-open .ellipsis-v .let-open {
position: absolute;
left: 0;
right: 0;
top: 40px;
text-align:center;
font-family: 'Hind Guntur', sans-serif;
font-weight:600;
background: #fff;
font-size:14px;
font-size:1.4rem;
line-height:1.8;
display:block;
}
.side-open .side-menu-btn:hover .top,
.side-open .top {
left: 15px;
width: 36px;
height: 4px;
background: #dd3366;
-webkit-transform-origin: left top;
-ms-transform-origin: left top;
transform-origin: left top;
-webkit-transform: rotate(45deg);
-ms-transform: rotate(45deg);
transform: rotate(45deg);
}

.side-open .mid {
opacity: 0;
}

.side-open .side-menu-btn:hover .bot,
.side-open .bot {
left: 15px;
width: 36px;
height: 4px;
background: #dd3366;
-webkit-transform-origin: left bottom;
-ms-transform-origin: left bottom;
transform-origin: left bottom;
-webkit-transform: rotate(-45deg);
-ms-transform: rotate(-45deg);
transform: rotate(-45deg);
}

/* --------------------------------------------------- go to Top */
#gotoTop {
	position: fixed;
	bottom: 20px;
	right: 20px;
}
p#gotoTop {
margin:0px;
padding:0px;
z-index:5;
}
#gotoTop a {
	display: block;
	color: #fff;
	font-size: 14px;
	font-size: 1.4rem;
font-family: 'Hind Guntur', sans-serif;
font-weight:600;
	background-color: #66172d;
	text-decoration: none;
	width: 75px;
	padding: 14px 5px 10px 5px;
	text-align: center;
-moz-border-radius: 10px; /* gecko */
-webkit-border-radius: 10px; /* webkit */
-khtml-border-radius: 10px; /* old konkeror */
border-radius: 10px; /* CSS3 standard */
}
.print-space{display:none;}
/* --------------------------------------------------- 印刷用 */
@media print {
.print-space{display:block;margin:0px;padding: 10px;width: 100%;height: 200px;}
.breadcrumb,
.side-open .overlay,
.side-menu , .side-menu__ul , 
.ellipsis-v , .ellipsis-v .point , 
.side-menu-btn:hover .top,
.side-menu-btn:hover .mid,
.side-menu-btn:hover .bot ,
.side-open .ellipsis-v .let-open ,
.side-open .side-menu-btn:hover .top,
.side-open .top,
.side-open .side-menu-btn:hover .bot,
.side-open .bot,
p#gotoTop a{
display:none;
}
	.header-sub .head-h1 a{
		background: transparent;
		border:none;
	}
	.header-sub .head-h1 a:after{
		content: "HARUMI MURAKAMI Laboratory / 村上晴美研究室";
		font-size:18px;
		font-size:1.8rem;
		line-height:1.5;
	}
	.header-sub .lang-en , 
.header-sub .head-h1 img{
		display:none;
	}
}