@charset "utf-8";
/****************************************
 * 上書き用のスタイルシート 			*
 * # スタイルの変更はここに記載			*
 ****************************************/

/* CSS Document */
footer.page-footer {
	background-color: #c6d3d3;
	color: #666666;
}

.yellow-text {
	color: #f1c411;
}

/* index */
html,body#index {
	height: 100vh;
	height: 100%;
}

body#index {
	margin: 0;
	padding: 0;
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center middle;
}

#index ul.index-nav {
	margin: 0 0 0 20px;
	padding: 0;
	width: 280px;
	height: 100%;
	background-color: rgba(120, 120, 120, 0.75);
	z-index: 100;
}

#index ul.index-nav li.logo * {
	margin: 0;
	padding: 0;
}

#index ul.index-nav li.logo {
	width: 280px;
	height: 150px;
	layout-grid-line: 150px;
	background-color: rgb(148, 195, 117);
	color: #333;
	display: table-cell;
	text-align: center;
	vertical-align: middle;
}

#index ul.index-nav li.logo h1 {
	vertical-align: middle;
	margin: 0;
	padding: 0;
}

#index ul.index-nav li a,#index ul.index-nav li a:link,#index ul.index-nav li a:visited,#index ul.index-nav li a:active
	{
	padding: 7px 10px;
	display: block;
	color: #fff;
}

#index ul.index-nav li a:hover {
	background-color: rgba(148, 100, 151, 0.75);
	color: #fff;
}

#index ul.index-nav li ul.sub-nav li a,#index ul.index-nav li ul.sub-nav li a:link,#index ul.index-nav li ul.sub-nav li a:visited,#index ul.index-nav li ul.sub-nav li a:active
	{
	padding: 7px 30px;
	display: block;
	color: #fff;
}

#index ul.index-nav li ul.sub-nav2 li a,#index ul.index-nav li ul.sub-nav2 li a:link,#index ul.index-nav li ul.sub-nav2 li a:visited,#index ul.index-nav li ul.sub-nav2 li a:active
	{
	padding-top: 7px;
	padding-bottom: 7px;
	padding-left: 60px;
	display: block;
	color: #fff;
}

#index ul.index-nav li.logo h1 a,#index ul.index-nav li.logo h1 a:link,#index ul.index-nav li.logo h1 a:visited,#index ul.index-nav li.logo h1 a:active,#index ul.index-nav li.logo h1 a:hover
	{
	margin: 0;
	padding: 0;
	background: none;
}

#index footer.page-footer p {
	margin: 0;
	padding-left: 10px;
	font-size: 13px;
}

#index div#index-right-contents {
	margin-left: 30px;
	padding: 15px;
}

#index div.language {
	width: 100%;
	text-align: right;
}

#index .index-news {
	margin: 15px 10px;
}

#index #searchBox {
	position: relative;
	top: 0px;
	width: 500px;
	margin-right: 10px;
	float: right;
}

#index li.lastUpdate font{
	font-weight:bold;
	font-size:14px;
	color: #FFF;
	padding-left: 10px;
}

#index li.lastUpdate span{
	font-size:14px;
	color: #FFF;
	padding-left: 10px;
}

/* PC版のみの設定 */
@media screen  and (min-width: 601px){
	div.contactForm {
		/*padding: 0 7%;*/
		margin: 30px 30% 30px 0px;
	}
}

/* ウィンドウの高さが890px以上ある場合 */
/*@media screen and (min-height: 875px)  and (min-width: 601px){*/
@media screen and (min-height: 965px)  and (min-width: 601px){
	#index footer.page-footer {
		margin: -116px 0 0 0;
		padding: 0;
		z-index: 1;
		position: absolute;
		width: 100%;
	}
	body#index div#container {
		margin: 0;
		padding: 0;
		height: 100%;
	}
	#name {
		font-family: Verdana, Helvetica, sans-serif;
		font-size: 12px;
		font-style: italic;
		color: #fff;
		padding: 0;
		margin: 15px 0;
		position: absolute;
		bottom: 130px;
		right: 20px;
	}
}
/* ウィンドウの高さが889px以下の場合 */
/*@media screen and (max-height: 874px)  and (min-width: 601px){*/
@media screen and (max-height: 964px)  and (min-width: 601px){
	body#index div#container {
		margin: 0;
		padding: 0;
/*		height: 800px;*/
		height: 890px;
	}
	#index footer.page-footer {
		margin: -20px 0 0 0;
		padding: 0;
		z-index: 1;
		position: absolute;
		width: 100%;
	}
	#name {
		font-family: Verdana, Helvetica, sans-serif;
		font-size: 12px;
		font-style: italic;
		color: #fff;
		padding: 0;
		margin: 15px 0;
		position: absolute;
/*		top: 725px;*/
		top: 815px;
		right: 20px;
		z-index: -1;
	}
}

#index-information {
	padding: 15px;
	border: 1px solid #fff;
	margin: 15px 0;
	background-color: rgba(255, 255, 255, 0.8);
	color: red;
	position: relative;
    top: 105px;
}

.teal {
	background-color: #808080 !important;
}

#index footer.page-footer .row {
	margin-left: auto;
	margin-right: auto;
	margin-top: 20px;
	margin-bottom: 20px;
}

/* フッター */
footer.page-footer .footer-copyright{
	overflow: hidden;
	height: 30px;
	line-height: 5px;
	color: rgba(255, 255, 255, 0.8);
	background-color: #048e81;
}

#index footer.page-footer .footer-copyright  {
	line-height: 30px;
}

ul.footer_navi {
	margin-top: 5px;
}

div.font-w {
	color: #fff;
	font-family: Verdana, Helvetica, sans-serif;
	font-size: 12px;
}

.font-w a {
	text-decoration: underline;
	color: #fff;
}

ul.footer_navi li {
	display: inline-block;
	padding: 0 15px;
}

ul.footer_navi a {
	text-decoration: underline;
	color: #fff;
}

div.staff_only {
	height: 60px;
	padding-top: 40px;
}

div.staff_only a {
	float: right;
	text-decoration: underline;
	padding-right: 15px;
	color: #fff;
}

footer.page-footer p {
	padding-left: 10px;
	font-size: 13px;
}

/* 検索ボックス */
.pad5 {
	padding: 0 5px;
}

/* 下層ページヘッダーデザイン */
#header {
	height: 230px;
}

div.logo {
	width: 280px;
	height: 150px;
	layout-grid-line: 150px;
	background-color: rgb(148, 195, 117);
	color: #333;
	display: table-cell;
	text-align: center;
	vertical-align: middle;
}

#imagebox {
	position: relative;
	background-size: cover;
	height: 188px;
}

#searchBox {
	position: relative;
	top: -200px;
	width: 500px;
	margin-right: 10px;
	float: right;
}

div.topBar{
	position: absolute;
	top: 0px;
	right: 0px;
	float: right;
	background-color: rgba(85,85,85, 0.3);
	color: #FFF;
}

div.keyword{
	position: absolute;
	top: 30px;
	right: 0px;
	float: right;
	color: #FFF;
}

div.keyword .txt{
	background-color: rgba(85,85,85, 0.3);
}

div.keyword input[type=text] {
	width: 185px;
	margin-bottom: 5px;
	height: 30px;
}

/* Google Chrome, Safari, Opera 15+, Android, iOS */
::-webkit-input-placeholder {
    color: #FFF; }

/* Firefox 18- */
:-moz-placeholder {
    color: #FFF; opacity: 1; }

/* Firefox 19+ */
::-moz-placeholder {
    color: #FFF; opacity: 1; }

/* IE 10+ */
:-ms-input-placeholder {
    color: #FFF; }
input:focus::-webkit-input-placeholder { color:transparent; }
input:focus:-moz-placeholder { color:transparent; }
input:focus::-moz-placeholder { color:transparent; }

div.topBar span{
	margin: 0px 3px;
}

div.row i {
	vertical-align: middle;
	margin-right: 3px;
	color: #FFF;
}

i.small{
	font-size: 20px;
}

div.topBar img{
	vertical-align: middle;
	padding-right: 3px;
}
div.input-field span.language{
	margin-left:10px;
}
div.input-field span.language a{
	color: #039be5;
	border-bottom: 1px solid #FFF;
}

div.input-field span.email a, div.input-field span.sitemap a {
	color: #FFF;
	border-bottom: 1px solid;
}

div.advancedSearchLink {
	position: absolute;
	padding: 3px;
	top: 70px;
	right: 55px;
	font-size: 12px;
	background: rgba(85, 85, 85, 0.3);
}

div.advancedSearchLink span{
	margin-right: 5px;
	margin-left: 5px;
	color: #FFF;
}

div.advancedSearchLink a{
	margin: 0px 5px;
	color: #FFF;
	border-bottom: 1px solid;
}

.clear-float {
	clear: both;
	font-size: 1%;
	line-height: 1%;
	width: 1%;
}
/* menu */
div.nav_menu {
	width: 100%;
	height: 38px;
	position: relative;
	text-align: center;
	background: rgba(255,255,255, 0.5);
	padding-left: 5%;
	padding-right: 5%;
	top: -15px;
}

#grobal_menu {
	list-style-type: none;
}

#grobal_menu li {
	width: 20%;
	float: left;
	height: 38px;
	text-align: center;
}

#grobal_menu li a {
	height: 38px;
	color: #fff;
	font-weight: bold;
	padding: 10px 0;
	margin-left: 3px;
	text-decoration: none;
	display: block;
	background: rgba(85,85,85, 0.6);
}

#grobal_menu li a:hover {
	background: rgba(0,0,0, 0.6);
}

#grobal_menu li.nav_active a {
	height: 38px;
	color: #fff;
	font-weight: bold;
	padding: 10px 0;
	margin-left: 3px;
	text-decoration: none;
	display: block;
	background: rgba(0,0,0, 1);
}

/* SUBメニュー */
div.insert_sub {
	width: 100%;
	height: 30px;
	position: absolute;
	text-align: center;
	background: #ebf1de;
	padding-left: 3%;
	padding-right: 5%;
}

#sub_menu {
	list-style-type: none;
}

ul#sub_menu {
	margin: 1px 0px;
}

ul#sub_menu.resourceMenu {
	margin-left: 20%;
}

#sub_menu li {
	width: 20%;
	float: left;
	text-align: center;
	color: #000;
	white-space: nowrap;
}

#sub_menu li a {
	color: #777;
	font-weight: bold;
	padding: 5px 0;
	margin-left: 3px;
	text-decoration: none;
	display: block;
}

#sub_menu li a:hover {
	color: #000;
}

#sub_menu li.nav_active a {
	color: brown;
}
/* パンくず */
#history_nav {
	width: 100%;
	padding: 0 7%;
	font-size: 12px;
}

#history_nav a {
	color: #000;
}

#history_nav a:hover {
	color: #FFF;
	background: #555;
}

/* コンテンツ */
#main-contents {
	height: 100%;
	min-height: 400px;
}

#main-contents div.contents {
	height: 100%;
	padding-left: 10%;
/* 	padding-right: 5%; */
	padding-right: 10%;
	margin-bottom: 50px;
}

#main-contents div.contents.strainContents {
	padding-left: 8%;
}

#main-contents div.summary {
	height: 100%;
	padding-left: 10%;
	padding-right: 5%;
	margin-bottom: 30px;
}

#main-contents h2 {
	padding-bottom: 5px;
	padding-left: 10px;
	font-size: 30px;
	color: #333;
	font-family: serif;
	border-bottom: 1px solid #666;
	margin: 30px 5%;
/* 	white-space: nowrap; */
}

#main-contents h2 span {
	padding-left: 10px;
	border-left: 10px solid #92d050;
}

#main-contents h3 {
	position: relative;
	padding-bottom: 5px;
	padding-left: 10px;
	font-size: 28px;
	color: #333;
	font-family: serif;
	margin: 10px 5%;
}

#main-contents h3.request {
	width: 80%;
	border-bottom: 1px solid #666;
}

#main-contents h3 span {
	padding-left: 10px;
	border-left: 7px solid #ffc000;
}

#main-contents h3.request span {
	/* border-left: 7px solid #385d8a; */
}

#main-contents h3 span font{
	margin: 0px 5px 0px 30px;
}
#main-contents h3 span font.count{
	font-size: 18px;
	margin: 5px;
}

#main-contents h3 span a {
	margin-left: 50px;
	border-bottom: 1px solid #666;
	font-size: 12px;
}

#main-contents h4 {
	position: relative;
	font-size: 18px;
	color: #333;
	font-family: serif;
}

#main-contents h4 span {
	padding-left: 10px;
	border-left: 5px solid #808080;
}

div.contents p {
	line-height: 180%;
	font-size: 15px;
	margin-bottom: 5px;
}

/* feature,application */
#listBox {
	padding: 0 7%;
	margin-bottom: 30px;
}

#listBox ul li {
	padding-top: 5px;
}

#listBox ul li a {
	color: #000;
	border-bottom: 1px solid #666;
}

figure img {
	margin-top: 10px;
	margin-bottom: 20px;
}

div.figure_note {
	text-align: center;
	font-size: 12px;
	padding: 0 20%;
}

/* pagetop */
p.page-top {
	float: right;
	font-size: 12px;
}

p.page-top a {
	color: #333;
	font-size: 12px;
	border-bottom: 1px solid #666;
}

p.page-top a img {
	width: 10px;
	height: 10px;
	margin-right: 3px;
	transform: rotate(-90deg)
}

/* 問い合わせ */
table.requestTable {
	width: 100%;
	border: 1px solid #000;
}

div.contactForm tr {
	border-radius: 0;
}

div.contactForm th {
/* 	width: 25%; */
	color: #FFF;
	background-color: #808080;
/* 	padding-right: 20px; */
	border: 1px solid #000;
	border-radius: 0;
}

div.contactForm input[type=text] {
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	border: 1px solid #777;
	padding-left: 5px;
	height: 30px;
	width: 95%;
	margin-bottom: 5px;
}

div.contactForm input[type=text]:focus:not([readonly]){
	border: 1px solid #26a69a;
	box-shadow: 0px 0px #26a69a;
}

div.contactForm td {
	padding: 10px;
	border: 1px solid #000;
}

div.formTable {
/* 	width: 45%; */
/*	padding: 0px 5% 20px 5%;*/
	padding: 0px 5% 20px 0%;
}

div.formTable caption {
	color: #048e81;
}

div.formTable th {
	border-radius: 0;
	padding: 5px;
	background: #808080;
	color: #FFF;
	border: 1px solid #000;
}

div.formTable td {
	padding: 5px;
	border: 1px solid #000;
}

/* 検索 */
p.page_back a {
	color: #333;
	border-bottom: 1px solid #666;
}

img.backImg {
	width: 10px;
	height: 10px;
	margin-right: 3px;
	transform: rotate(180deg);
}

span.summary {
	color: #333;
	margin-right: 20px;
	border-bottom: 1px solid #666;
}

span.summary a {
	padding-right: 10px;
	border-bottom: 1px solid #666;
}

table.resourceList {
	width: 80%;
}

p.resourceList {
	margin-right: 20%;
}

table.summaryTable {
	width:80%;
	margin-top: 10px;
	border-radius: 0;
	padding: 5px;
	border: 1px solid #000;
}
table.summaryTable th {
	width: 60%;
	border-radius: 0;
	padding: 5px 5px 5px 20px;
	background: #D9D9D9;
	border: 1px solid #000;
	text-align: left;
}

table.summaryTable td {
	padding: 5px;
	border: 1px solid #000;
/* 	font-size:16px; */
	text-align: right;
}

table.summaryTable .section_span {
	background: #808080;
	color: #FFF;
/* 	font-size: 18px; */
	font-family: serif;
    font-weight: bold;
    text-align: left;
}

table.strainTable th {
	border-radius: 0;
	padding: 5px;
	background: #808080;
	color: #FFF;
	border: 1px solid #000;
	text-align: center;
}

table.strainTable th.species_name {
	width: 45%;
}

table.strainTable th.distributional {
	width: 15%;
}

table.strainTable th.ploidy {
	width: 10%;
}
table.strainTable th.stock {
	width: 10%;
}

table.strainTable td {
	padding: 5px;
	border: 1px solid #000;
	font-size:16px;
}

table.strainTable .section_span {
	background: #D9D9D9;
	font-size:14px;
}

/* 詳細ページ */
h2 span font {
	font-size: 24px;
	padding-left: 20px;
}

table.strain_info{
	margin-left: 15px;
}

table.strain_info th {
	background: #FFFBA3;
	color: #000;
}

.marks th, td.marks {
 	width: 70px;
	text-align: center;
}

table.strain_info td.item img {
	height: 100px;
	margin: 5px;
	vertical-align: middle;
}

table.strain_info td.thumb img {
	min-width: 20px;
	height: 40px;
	margin: 3px;
	vertical-align: middle;
}

.strain_span {
	background: #808080;
	color: #FFF;
}

tr.stock_column th {
	text-align: center;
}

table#speciesInfo {
	width: auto;
	margin-bottom: 10px;
}

table#speciesInfo i{
	color: #92D050;
}

div#imgSpace {
	padding: 10px;
	border: 1px solid #D0D0D0;
}

#imgMain, #imgMainSp {
	text-align: center;
	padding: 5px 5px 15px 5px;
}

#gallery img, #gallerySp img {
	height: 70px;
	padding: 1px;
}

div#infoSpace.col {
	padding-right: 50px;
}

div.strainTitle{
	margin: 5px 15px;
}

div.strainTitle i {
	color: #FFC000;
	margin-left: 5px;
	vertical-align: bottom;
}

div.strainTitle span {
	font-weight: bold;
}

div.strainTitle font {
	padding-left: 10px;
}

/* クロス表 */
table.crossTable {
	width: 100%;
	border-collapse: separate;
	border-spacing: 6px;
}

table.crossTable a{
	color: #333;
	border-bottom: 1px solid #666;
}

table.crossTable th {
	padding: 6px;
	text-align: center;
	vertical-align: top;
	color: #000;
	border: 3px solid #385d8a;
	background-color: #E5EEFF;
}

table.crossTable th.clearBorder {
	border: none;
	background-color: #FFF;
}

table.crossTable td {
	border: 1px solid #b9b9b9;
	vertical-align: top;
}

table.crossTable td.section-cell {
	padding: 0px 18px;
	text-align: center;
	vertical-align: middle;
	font-weight: bold;
	border-width: 3px;
	background-color: #FFFFCC;
}

table.crossTable tr.col-green td.section-cell {
	    white-space: nowrap;
	background-color: #CCFFCD;
}

table.crossTable tr.col-yellow td.section-cell {
	white-space: nowrap;
	background-color: #FFFFCC;
}

table.crossTable td.section-cell span {
	-ms-writing-mode: tb-rl; /* IE用　*/
	-webkit-writing-mode: vertical-rl; /* chrome用　*/
	-o-writing-mode: vertical-rl; /* opera用　*/
	writing-mode: vertical-rl;
	padding: 5px 0px 5px 0px;
	min-height: 120px;
}

table.crossTable td.section-w {
	min-width: 30px;
	white-space: nowrap;
	padding: 0px;
	text-align: center;
	vertical-align: middle;
	font-weight: bold;
	border-width: 3px;
	background-color: #F7FBFF;
}

table.crossTable td.section-w span {
	-ms-writing-mode: tb-rl; /* IE用　*/
	-webkit-writing-mode: vertical-rl; /* chrome用　*/
	-o-writing-mode: vertical-rl; /* opera用　*/
	writing-mode: vertical-rl;
	min-height: 130px;
	padding: 5px 0px 5px 0px;
}

ul.species_name {
	padding: 0px 6px;
	vertical-align: top;
	margin: 0px;
}

ul.species_name li {
	clear: both;
}

tr.col-green td {
	border-color: #92d050;
}

tr.col-yellow td {
	border-color: #ffdd00;
}

tr.col-gray td {
	border-color: #b9b9b9;
}

tr.col-lightblue td {
	border-color: #9DC3E6;
}
tr.col-zawadskii td {
	border-color: #9DC3E6;
}
div.strain-bar {
	width: 100%;
	height: auto;
	text-align: left;
}
div.strain-name {
	font-size: 14px;
	white-space: nowrap;
}
table.crossTable th.img {
	width: 15%;
	height: 100%;
}

table.crossTable td.img {
	text-align: center;
}

table.crossTable td.img img{
	margin: 5px;
	padding: 5px;
	height: 120px;
}

#sourceBox {
	text-align: left;
	padding-left: 70%;
}
#sourceBox span{
	margin-left: 10px;
}

/* sitemap */
ul#siteMap {
	display: inline-flex;
}

ul#siteMap li{
	margin: 0px 10px;
}

/* 項目検索 */
.autocomplete-content {
	position: absolute;
	margin: 0px;
	width: 98%;
}

div.input-field {
	margin-top:0;
}

table.requestTable td span {
	margin-right: 10px;
}

table.requestTable td label {
	color: #000;
	padding-left: 25px;
}

.ui-autocomplete {
    max-height: 200px;
    overflow-y: auto;
    overflow-x: hidden;
    padding-right: 20px;
}

.whitesmoke {
	background-color: whitesmoke;
}

.dropdown-content {
	max-height: 250px;
}

.exListClear {
	position: absolute;
	top : 37px;
	right: -30px;
	padding: 0px 8px;
}

#tabletLink  {
	background: rgba(85, 85, 85, 0.3);
	position: absolute;
	top: 95px;
	right: 34px;
}

.spSpecies_name {
	width: 70%
}

ul.stockList li {
	display: inline-block;
	margin-right: 5px;
}
.padL50 {
	padding-left: 50px;
}

.bordered th{
	/* white-space: nowrap; */
}
.padL20{
	padding-left:20px;
}

/* 広義キク属のアナウンス (shigenアナウンス以外) */
.announcement-kiku {
	width: 50%;
	margin-top: 130px;
	background-color: #FFFFFF;
	opacity: 0.8;
	border-radius: 10px;
}