@charset "utf-8";
@charset "utf-8";

/*RESET CSS BEGIN*/
/*
html5doctor.com Reset Stylesheet
v1.6.1
Last Updated: 2010-09-17
Author: Richard Clark - https://richclarkdesign.com
Twitter: @rich_clark
*/
html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure,
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video { margin:0; padding:0; border:0; outline:0; font-size:100%; vertical-align:baseline; background:transparent;}

body {	font-family: Arial, Roboto, “Droid Sans”, “游ゴシック”, YuGothic,"ヒラギノ角ゴ ProN W3", “Hiragino Kaku Gothic ProN”, “メイリオ”, Meiryo, sans-serif;  line-height:1; font-feature-settings: "palt"; background-color:#FFFFFF;}
article,aside,details,figcaption,figure,
footer,header,hgroup,menu,nav,section {display:block;}
nav ul,
nav li { list-style:none; list-style-type: none;}
blockquote, q { quotes:none;}
blockquote:before, blockquote:after,
q:before, q:after { content:'';  content:none;}
a { margin:0; padding:0; font-size:100%; vertical-align:baseline; background:transparent;}
change colours to suit your needs
ins { background-color:#ff9; color:#000; text-decoration:none;}
change colours to suit your needs
mark {
    background-color:#ff9;
    color:#000;
    font-style:italic;
    font-weight:bold;
}

del {
    text-decoration: line-through;
}

abbr[title], dfn[title] {
    border-bottom:1px dotted;
    cursor:help;
}

table {
    border-collapse:collapse;
    border-spacing:0;
}

change border colour to suit your needs
hr {
    display:block;
    height:1px;
    border:0;
    border-top:1px solid #cccccc;
    margin:1em 0;
    padding:0;
}

input, select {
    vertical-align:middle;
}

sup {
    font-size: 0.8em;
    line-height: 1;
    vertical-align: text-top;
}
/*RESET CSS END*/

/*-----全体------------*/
/*****汎用*****/
body{
	color: #333;
	font-size: 1.4em;
	/*font-family: "Helvetica", "HiraKakuProN-W3", "sans-serif";*/
	 -webkit-text-size-adjust: none;
}

p{
	margin-bottom: 5px;
}
div.description p{  margin: 3px 0;}
div.description p:first-of-type{  margin:2px 0 3px 0;}

a{
	text-decoration: none;
	color:#0088BB;
}

a:visited{
	color:#0088BB;
}

.smaller{font-size:12px!important;}
.smallest{font-size:10px!important;}

.center{text-align: center;}
.lt{text-align: left;}
.rt{text-align: right;}

.fll { float: left; margin-right: 10px;}
.flr { float: right; margin-left: 10px;}

.mb10{margin-bottom: 10px;}

.mt10{margin-top: 10px;}
.mt20{margin-top: 20px;}

.mb0{margin-bottom: 0px !important;}

.red{color: #c40000;}
.pdg5{padding-left:5px; padding-right:5px;}
.pdg10{padding-left:10px; padding-right:10px;}

a.yaji{ background-image: url(/common/img/bt_yaji.gif); background-repeat: no-repeat; background-position: 0 0; height: 20px;  padding-left: 18px; display: block; }
a.yaji:hover{ background-position: 0 -20px; }
a.yaji{
	margin: 8px auto;

	-webkit-border-radius: 8px;
	-moz-border-radius: 8px;
	border-radius: 8px;
}
a.button{ background: -moz-linear-gradient(top,#FFF 0%,#EEE); background: -webkit-gradient(linear, left top, left bottom, from(#FFF), to(#EEE)); border: 1px solid #DDD; color:#111; width: 100px; padding: 9px 20px;line-height: 30px;border-radius:3px;}
a.button_thin{ background: -moz-linear-gradient(top,#FFF 0%,#EEE); background: -webkit-gradient(linear, left top, left bottom, from(#FFF), to(#EEE)); border: 1px solid #DDD; color:#111; width: 100px; padding: 3px 20px;line-height: 2.6rem;border-radius:3px;}

#errorMessage{padding:0.3em; color:#5d7fcb; font-weight:bold; font-size:1em; margin:4px;  padding-top:1em;padding-bottom:10em;}
#message{font-size:1em;font-weight:bold;  margin:4px;}

.def{border-radius:2px; padding:0 7px; line-height:1.9em; background-color:#8e8e8e; font-size:13px; margin-right:0.3em; color:#FFFFFF;}

.arrow{ position: relative; display: inline-block; color: #000; text-decoration: none; font-size: 15px;}
.arrow::before,
.arrow::after{position: absolute; top: 0; bottom: 0; left: 0; margin: auto; content: ""; vertical-align: middle;}
.small_arrow::before {left: 5px; box-sizing: border-box; width: 4px; height: 4px; border: 4px solid transparent; border-left: 4px solid #118acf;}

/*-----全体------------*/
/*** WRAPPER ***/
#wrapper{
	min-width:320px;
}
#wrapper h2{
	margin-top: 10px;
	border-top:1px solid #fff;
	padding: 10px 5px 8px;
	background-color: #006FC9;
	color: #fff;
	font-size:14px;
}

h2.socalled {
	margin-top: 0;
    font-size: 16px;
    margin-bottom: 3px;
	background-color:#FFF;
	text-align: left;
	padding: 4px 10px 4px 4px;
	color: #000;
	text-indent:0;
}
h2 span {
    font-size: 14px;
    background-color: #dd7246;
    padding: 4px 6px;
    border-radius: 3px;
    line-height: 18px;
    color: #FFF;
    margin: 0 5px 3px 0;
}

/*** Pageslide ***/
#menu_btn{	position: fixed;	top:5px;	right: 25px;	z-index: 100;}

#search #menu_btn img{	width: 125px;	height: auto;}

#pageslide {
    /* These styles MUST be included. Do not change. */
    display: none;
    position: fixed;
    top: 0;
    height: 100%;
    z-index: 999999;

    /* Specify the width of your pageslide here */
    width: 200px;
    padding: 5px;

    /* These styles are optional, and describe how the pageslide will look */
    background-color: #EFEFEF;
    -webkit-box-shadow: inset 0 0 1px 1px #222;
    -moz-shadow: inset 0 0 1px 1px #222;
    box-shadow: inset 0 0 1px 1px #222;

}
/*** header ***/

header{
	text-align: center;
}

#header_logo{
	text-align: left;
	padding: 3px;
	display: block;
	height:53.5px;
}

#search #header_logo img{
	width:493px;
	height: auto;
}

#top_gad{
	border-top:1px solid #CCCCCC;
	border-bottom:1px solid #CCCCCC;
	padding:5px;
}
#tool_gss, #side_tool_gss{
	font-size: 14px;
	position: relative;

	/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#59acff+0,3893ed+100 */
	background: rgb(89,172,255); /* Old browsers */
	background: -moz-linear-gradient(top,  rgba(89,172,255,1) 0%, rgba(56,147,237,1) 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(89,172,255,1)), color-stop(100%,rgba(56,147,237,1))); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  rgba(89,172,255,1) 0%,rgba(56,147,237,1) 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  rgba(89,172,255,1) 0%,rgba(56,147,237,1) 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  rgba(89,172,255,1) 0%,rgba(56,147,237,1) 100%); /* IE10+ */
	background: linear-gradient(to bottom,  rgba(89,172,255,1) 0%,rgba(56,147,237,1) 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#59acff', endColorstr='#3893ed',GradientType=0 ); /* IE6-9 */

	padding: 3px 1px;
	margin: 0 0 1px;
	text-align: center;
}
#tool_localsearch{
	font-size: 14px;
	position: relative;
	background: #000B8E;
	/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#59acff+0,3893ed+100 */
	background: rgb(89,172,255); /* Old browsers */
	background: -moz-linear-gradient(top,  rgba(89,172,255,1) 0%, rgba(56,147,237,1) 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(89,172,255,1)), color-stop(100%,rgba(56,147,237,1))); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  rgba(89,172,255,1) 0%,rgba(56,147,237,1) 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  rgba(89,172,255,1) 0%,rgba(56,147,237,1) 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  rgba(89,172,255,1) 0%,rgba(56,147,237,1) 100%); /* IE10+ */
	background: linear-gradient(to bottom,  rgba(89,172,255,1) 0%,rgba(56,147,237,1) 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#59acff', endColorstr='#3893ed',GradientType=0 ); /* IE6-9 */

	padding: 8px 5px;
	border-bottom:1px solid #0053BF ;
	text-align: center;
}
#side_tool_gss{
	background: transparent;
}

#tool_gss span{
	line-height: 1em;
	padding-right: 5px;
	position: relative;
	top:2px;
	font-size: 12px;
	color: #fff;
	font-weight: bold;
}

#tool_gss input,#side_tool_gss input{
	padding: 5px;
	width: 45%;
	font-size: 16px;
}

#side_tool_gss input[type="text"]{
	border: none;
	width: 194px;
	box-shadow: inset 1px 2px 1px 1px rgba(0,0,0,0.4);
	-webkit-box-shadow: inset 1px 2px 1px 1px rgba(0,0,0,0.4);
	box-sizing: border-box;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	margin: 3px 3px 5px 3px;
}

#tool_gss input#gss_submit{
	width: 20%;
	padding: 5px auto;
}


#side_tool_gss #side_gss_submit{padding: 4px;height: auto;width: 194px;margin: 3px;}

#tool_localsearch span{
	line-height: 1em;
	padding-right: 5px;
	position: relative;
	top:2px;
	font-size: 12px;
	color: #fff;
	font-weight: bold;
}

/*** header_menu ***/
nav#header_menu h2{
	color: #000;
	padding: 0 5px;
}
nav#header_menu div.itemby2{
	overflow: hidden; line-height:1.1em; color:white; padding:0.2em 0 0em; margin-top:1px; width:50%; float:left; display:block;

}
div#header_com div{
	width: 100%;
	height: 40px;
	background:url(images/sidenavi_title_common.png) no-repeat center center;
	content:'*';
}
div#header_bio div{
	width: 100%;
	height: 40px;
	float:left;
	background:url(images/sidenavi_title_bio.png) no-repeat center center;
	content:'*';
}
div#header_index div{width: 100%;	height: 30px;	background:url(images/sidenavi_title_index.png) no-repeat center center;	content:'*';}
div#header_search div{	width: 100%;	height: 30px;	background:url(images/sidenavi_title_search.png) no-repeat center center;	content:'*';}
div#header_column div{width: 100%;	height: 30px;	background:url(images/sidenavi_title_column.png) no-repeat center center;	content:'*';}
#header_column_ul a.header_column_child,
#header_column_ul a.header_column_child:visited,
#header_column_ul a.header_column_child:link{color:#c56622;}
nav#header_menu ul li{width:50%;float:left;display: block;}
nav#header_menu div.header_menu_top ul li{width:100%;}
nav#header_menu ul li a, #side_gss_submit {display: block;/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#ffffff+0,e5e5e5+100;White+3D */
background: rgb(255,255,255); /* Old browsers */
background: -moz-linear-gradient(top,  rgba(255,255,255,1) 0%, rgba(229,229,229,1) 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(255,255,255,1)), color-stop(100%,rgba(229,229,229,1))); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  rgba(255,255,255,1) 0%,rgba(229,229,229,1) 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  rgba(255,255,255,1) 0%,rgba(229,229,229,1) 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  rgba(255,255,255,1) 0%,rgba(229,229,229,1) 100%); /* IE10+ */
background: linear-gradient(to bottom,  rgba(255,255,255,1) 0%,rgba(229,229,229,1) 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#e5e5e5',GradientType=0 ); /* IE6-9 */
	/* box-shadow: 0px 0px 5px #ccc; */
	text-align:center;padding: 10px 2px;	border-top: 1px solid #EEE;border-right: 1px solid #999;	border-left: 1px solid #CCC;	border-bottom: 1px solid #888;	margin:0;font-weight:normal;font-size:0.9em;}

nav#header_menu ul.lists li {margin: 10px 0;}
nav#header_menu ul.lists li a.xx_list{display: block;	border-radius: 6px;
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#ffffff+0,e5e5e5+100;White+3D */
background: rgb(255,255,255); /* Old browsers */
background: -moz-linear-gradient(top,  rgba(255,255,255,1) 0%, rgba(229,229,229,1) 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(255,255,255,1)), color-stop(100%,rgba(229,229,229,1))); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  rgba(255,255,255,1) 0%,rgba(229,229,229,1) 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  rgba(255,255,255,1) 0%,rgba(229,229,229,1) 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  rgba(255,255,255,1) 0%,rgba(229,229,229,1) 100%); /* IE10+ */
background: linear-gradient(to bottom,  rgba(255,255,255,1) 0%,rgba(229,229,229,1) 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#e5e5e5',GradientType=0 ); /* IE6-9 */
	padding: 8px 0 5px;font-size: 1.2em;}
nav#header_menu ul li a.fishes_list{
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#7abcff+0,60abf8+44,4096ee+100;Blue+3D+%2314 */
background: rgb(122,188,255); /* Old browsers */
background: -moz-linear-gradient(top,  rgba(122,188,255,1) 0%, rgba(96,171,248,1) 44%, rgba(64,150,238,1) 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(122,188,255,1)), color-stop(44%,rgba(96,171,248,1)), color-stop(100%,rgba(64,150,238,1))); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  rgba(122,188,255,1) 0%,rgba(96,171,248,1) 44%,rgba(64,150,238,1) 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  rgba(122,188,255,1) 0%,rgba(96,171,248,1) 44%,rgba(64,150,238,1) 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  rgba(122,188,255,1) 0%,rgba(96,171,248,1) 44%,rgba(64,150,238,1) 100%); /* IE10+ */
background: linear-gradient(to bottom,  rgba(122,188,255,1) 0%,rgba(96,171,248,1) 44%,rgba(64,150,238,1) 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#7abcff', endColorstr='#4096ee',GradientType=0 ); /* IE6-9 */
color:#FFFFFF;}
div#mainArea ul{ /*overflow:hidden;*/ height:auto;}
div#mainArea ul,
div#mainArea li{ list-style-type: none;}


/***#bottom_navi***/
#bottom_navi{
	/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#59acff+0,3893ed+100 */
	background: rgb(89,172,255); /* Old browsers */
	background: -moz-linear-gradient(top,  rgba(89,172,255,1) 0%, rgba(56,147,237,1) 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(89,172,255,1)), color-stop(100%,rgba(56,147,237,1))); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  rgba(89,172,255,1) 0%,rgba(56,147,237,1) 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  rgba(89,172,255,1) 0%,rgba(56,147,237,1) 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  rgba(89,172,255,1) 0%,rgba(56,147,237,1) 100%); /* IE10+ */
	background: linear-gradient(to bottom,  rgba(89,172,255,1) 0%,rgba(56,147,237,1) 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#59acff', endColorstr='#3893ed',GradientType=0 ); /* IE6-9 */
 color:#FFF; clear:both; overflow: auto; border-top: 1px solid #D9D9D9; margin-top:20px; padding: 20px;}
#bottom_navi p{margin: 0!important;}
#bottom_navi p.bt_back{ float: left;}
#bottom_navi p.bt_totop{ float: right;}
#bottom_navi p a{color:#FFF;}

/***footer***/
footer{clear: both;	padding:10px 0 48px; font-size:0.8em;}

div#footer ul,div#footer li{ margin: 0; padding: 0; }
div#footer li{ float: left; margin-right: 1em; list-style-type: none; }
div#footer_navi{margin:1em 0 0.6em;}
div#footer_info{box-sizing: border-box;width:100%;}
div#footer_info div h4 {box-sizing: border-box; display:block;font-size: 12px; margin-top: 0; margin-bottom: 3px; background-color:#EEEEEE; line-height:1.7em; padding:0.2em 0.4em; border-radius: 3px;}
div#footer_info_box01 ul{margin-top: 0.8em; margin-left:1em; margin-right:0.5em; list-style:none;}
div#footer_info_box01 ul li{text-indent:0; text-indent:-0.7em; margin-bottom:0.3em;}
div#footer_info_box01{box-sizing: border-box;width:100%; padding:0; font-size:11px;}
div.mail_address{}
div#footer_info_box01 p{margin:0; line-height:1em;}
div#footer_info_box01 div.fll{float:left; line-height: 1em; border-left: 2px solid #777; margin: 8px 0 5px 5px; padding: 0.2em 0.5em 0 3px;}
div#footer_info_box02{box-sizing: border-box;width:100%; padding:0; display:flex; flex-direction:column;}
  div.footer_logos{display:flex;justify-content:space-around; flex-wrap:wrap; align-content:center; align-items:center;}

div.footer_powered{margin-bottom:0.4em;}
div.footer_powered h5{display:inline-block; background-color:#FFFFFF; padding:2px 4px; font-family: helvetica; font-weight: normal; font-style: italic; margin:6px 2px 2px 1px; line-height:1em;}
div.poweredby{border: 2px dotted #eeeeee;line-height:3px; margin:-15px 1px 5px 5px;padding:12px 3px;border-radius:6px;}
div.footer_powered div a{text-decoration: none; display: block; font-size:11px; text-align:center;}
div.footer_powered h4 {display:block;font-size: 12px; margin-top: 0;　width:300px; background-color: #EEEEEE; line-height:1.7em; padding:0.2em 0.4em; border-radius: 3px;margin-bottom: 6px;}
div.footer_powered h4 a {color:#000000; text-decoration:none;}
 a#footer_bouz{flex-basis:440px;text-indent:0.3em; display:flex; align-items:center;}
 a#footer_bouz img{width: 50px; height:auto;}
 a#footer_gaiado img{width: 115px; height:auto;}
 a#footer_ars img{width: 60px; height:auto;}
 a#footer_giga img{width: 84px; height:auto;}
 div.footer_logos_sponsors {justify-content:space-between; padding:3px 20px 3px;}
 div#footer_hachimenroppi {}
 div#footer_hachimenroppi a{background: url(/common/img/logo_hachimenroppi.png) center 0px; background-size:contain; background-repeat: no-repeat; width: 114px; padding-top:30px;}


footer nav a.bt_white{margin: 10px auto;display: block;	padding-top: 7px;width: 216px;	height: 21px;text-align: center;	background-image: url(../images/bt_pc.gif);	background-size:auto cover;
	-moz-background-size: cover;-webkit-background-size: cover;font-weight: bold;}
footer p#code{text-align: center;font-size: 12px;	margin-bottom: 7px;}
footer div#copy{background-color:#000000;font-size: 11px;	color: #FFF;	padding: .8em 0;	margin-top: 1.5em;	text-align:center;}
p#copy{text-align: center;background-color: #000;color: #FFF;margin:0;padding: 0.7em 0.2em;font-size: 0.8em;}


/******タイトル*******/
h1{font-size: 1.4em;margin-top:0.7em;  background: #FFFFFF url(images/titlebg_others2.png) bottom left no-repeat; border: none; line-height: 1.2em; padding-left: 48px; min-height:33px; position:relative;padding-top: 7px;}
h1 span{	}
span.belowh1{line-height:1.3em; padding:5px 4px 0; font-size: 0.8em;}
h1+p.notes{margin: 5px 10px;font-size: 0.85em;}

/******pankuzu*********/
.breadcrumb { padding-right:0.75em; margin: 0.3em 1px !important; font-size:0.8em;}
.breadcrumb li {list-style-type:none; vertical-align:top; float: left; display:inline-block; margin:2px 0; line-height:30px;  color:#777;background:url(images/breadarrow.png) no-repeat right center; height:2.4em;}
.breadcrumb li a {  display:block;  padding:1px 3px 0 ; border:dotted 1px #CCC; margin-left:2px;margin-right:8px; background-color:#efefef; border-radius:4px;}
.breadcrumb li select { font-size:1em; line-height:32px; padding:4px 2px 6px ; border:dotted 1px #CCC; margin-left:2px;margin-right:8px; background-color:#efefef; border-radius:4px; color:#0088BB;}
.breadcrumb li a:hover, #crumbs li a:focus { color:#dd2c0d; }
.breadcrumb li:last-child {background:none;}
.breadcrumb li select.current {background-color:#f5eced; }
.breadcrumb li a.current {border:none; color:#000000; background:none;}
.breadcrumb li span.optionvalue{display:none;}

#breadcrumbLight {  display:inline; padding-right:0.75em; margin: 0.3em 1px !important; font-size:0.8em; text-align:left;}
#breadcrumbLight ul { display:inline; margin:0; padding:0; text-align:left;}
#breadcrumbLight li {list-style-type:none; border:none;}
#breadcrumbLight li { display:inline-block; margin:2px 0; line-height:2.5em;  color:#777;background:url(images/breadarrow.png) no-repeat right center;}
#breadcrumbLight li a {  display:block;  padding:0 3px 0 ; border:dotted 1px #CCC; margin-left:2px;margin-right:8px; background-color:#efefef; border-radius:4px;}
#breadcrumbLight li select {  display:block;  padding:4px 3px 6px ; border:dotted 1px #CCC; margin-left:2px;margin-right:8px; background-color:#efefef; border-radius:4px; color:#0088BB;}
#breadcrumbLight li a:hover, #crumbs li a:focus { color:#dd2c0d; }
#breadcrumbLight li:last-child {background:none;}
#breadcrumbLight li a.current {border:none; color:#000000; background:none;}

.breadcrumbLight {  display:inline; padding-right:0.75em; margin: 0.3em 1px !important; font-size:0.8em; text-align:left;}
.breadcrumbLight ul { display:inline; margin:0: padding:0; text-align:left;}
.breadcrumbLight li {list-style-type:none; border:none;}
.breadcrumbLight li { display:inline-block; margin:2px 0; line-height:2.5em;  color:#777;background:url(images/breadarrow.png) no-repeat right center;}
.breadcrumbLight li a {  display:block;  padding:0 3px 0 ; border:dotted 1px #CCC; margin-left:2px;margin-right:8px; background-color:#efefef; border-radius:4px;}
.breadcrumbLight li select {  display:block;  padding:4px 3px 6px ; border:dotted 1px #CCC; margin-left:2px;margin-right:8px; background-color:#efefef; border-radius:4px; color:#0088BB;}
.breadcrumbLight li a:hover, #crumbs li a:focus { color:#dd2c0d; }
.breadcrumbLight li:last-child {background:none;}
.breadcrumbLight li a.current {border:none; color:#000000; background:none;}

div#mainArea.biology_list h1,
div#mainArea.biology_list h2,
div#mainArea.biology_list h3{text-align: left;}

#steplist h2,
#steplist h3{margin: 0px;padding: 5px;padding-left: 1em; border-bottom: 1px solid #cccccc;}
#steplist div.biology_h3{margin-left: 1%;}
#steplist h3{line-height:1.4em; margin: 0 ; padding:7px 5px 2px 5px; background-color: #CCDEED; border-bottom: 1px solid #cccccc;border-top: 1px solid #cccccc;}
#steplist h4{line-height:1.4em; margin: 0 ; padding:7px 5px 2px 11px; border-bottom: 1px solid #cccccc;background-color:#EFEFEF;}
#steplist ul.fishlist{padding-top: 5px;}
#steplist .cursel{ background:#3388CC; color:#FFFFFF !important;}
#tabs .ui-tabs{	padding: 0;}
#tab1,#tab2{ width: 100%; padding: 0;	margin: 0 auto;}

/*索引*/
div#indexlist a{width:48%; margin-bottom:3px;text-indent:0; text-align:left; float:none;}
div#indexlist div.idxcol{width:48%;float:left; margin-left:0.3em;}
div#indexlist div.idxcol {line-height:1.3em;}
div#indexlist div.p1 {width: 33px; height: 33px; /*border:1px solid #CCC;*/ margin-bottom:1px; padding: 2px 2px 1px 2px; float:left;}
div#indexlist p {margin:0; vertical-align:middle; padding:.3em .3em .3em .3em;/*width:190px;*/}

div#indexlist div#indexlist_menu {margin:0.4em 4px 0; overflow:hidden; display:flex;flex-flow: row wrap; justify-content:flex-between;}
div#indexlist div#indexlist_menu a {display: block;  width:auto; padding:14px 0 ;  text-align:center; margin: 0.2em 1%; border-radius:4px; background-color:#3388CC; color:#FFF !important; text-decoration:none; color:#0053BF;flex-basis: 18%;}
div#indexlist div#indexlist_menu a.nolink {color:#0053BF;background-color: #c5e0f5;}

div#indexlist p.initial{width:100%; background-color:#CCC; margin-top: 1.5em;margin-bottom: .5em;}
div#indexlist p.initial a{line-height:1em; padding-top:0.3em; font-weight:bold;}


/********sideMenu************/
#header_menu #side_tool_gss{}


/*--------汎用-----------全体*/
.clearfix:after { content: "";  display: block;clear:both; }
.clear { clear: both;}
.btn {-moz-border-radius:3px;-webkit-border-radius:3px;border-radius:3px;	display:inline-block;	cursor:pointer;
	font-family:Arial;margin: 0.3em 0.1em 0.2em 0.1em !important;padding:4px 9px 3px 1.8em;vertical-align:top; float:right;
	text-decoration:none;	border:1px solid #CCC;background:url(images/logo_ss.png) 8px 50% no-repeat;}
.btn span{background:url(images/link_arrow02_s_blue.png) 96% 50% no-repeat;	padding: 0 6px 1px 8px;}
.algnr{	float:right;}
.algnl{	float:left;}

/* error pages*/
.error_message{ width:90%; margin:1em auto; line-height:1.4em; text-align:left;}
/* -------to here 汎用---------*/

/*ランキング*/
div#ranking_wrap{ width:100%;}
div#ranking_title{ background-color:#E38400; color:#ffffff; text-align:center;margin-top: 10px; padding: 10px}
div.rankings{box-sizing:border-box; width: 50%;  margin-bottom:.8em; float:left; padding:3px 2px; background-color:#FFFFFF; margin: 0px; min-height:230px;}
div.rankings p.title{ margin:0; padding:1px 3px; background-color:#edeace; color:#000;}
div.rankingsSyu{ width: 100%; }

div.rankingsSyubox2{ width: 100%; display:flex;}
div.rankingsSyubox2 .fitCover{width: 36px; height: 36px; object-fit:cover; object-position: 0% 50%; }
.rankingSyuBoxInner1-2 {padding:1px 3px 0px 0;}
.rankingSyuBoxInner2-2 {padding:1px;font-size: 0.85em; line-height:1.4em; }

span.rank_num1,
span.rank_num2,
span.rank_num3,
span.rank_num4,
span.rank_num5 {border-radius: 2px; padding:0px 4px; color:#777777; font-size:9px;}
span.rank_num1 { background-color:#bdb258; color:#FFFFFF;}
span.rank_num2 { background-color:#979797; color:#FFFFFF;}
span.rank_num3 { background-color:#a09857; color:#FFFFFF;}
span.rank_num4, span.rank_num5 { background-color:#ededed; color:#000000;}

/* ad */
.adsbygoogle{	display: inline-block;}
.ads300{	width:300px;height:250px;}
#mm_banner {background-color:#de9700; border-top:#ecc36c; border-bottom:#5d3f00; margin: 2px 0 0px 0;}
#kouen_banner {background-color:#4aa7e2; border-top:#ecc36c; border-bottom:#5d3f00; margin: 2px 0 0px 0;}
#mm_umasugi {background-color:#000000; margin: 1px 0 0px 0;}
#banner_hougen{width:100%; height:50px; background:url(images/banner_sp_hougen01.png) no-repeat center;margin:2px 0 2px 0;}

div.ad_footer{padding:20px 0 60px ;}
.responsive_ad_slot, .debugbanner_responsive{ width: 300px; height: 250px;  background-color:#EFEFEF;}
.banner_hachimen{ width: 97%; height:auto;  background-color:#EFEFEF; margin:20px auto 8px;}

@media screen and (min-width:340px) {
	.responsive_ad_slot, .debugbanner_responsive{ width: 336px; height: 280px; }
	.banner_hachimen{ width: 97%; height: auto; }
}

@media screen and (min-width: 330px) {
	.ads300{
		width:336px;
		height:280px;
	}
}
/* to here ad */

/*-----ナビゲーションバー--------------------*/
ul.footnavbar{	width:100%;position:fixed;	bottom:0;right: 0;
background: #f6f8f9; /* Old browsers */
background: -moz-linear-gradient(top,  #f6f8f9 0%, #d7dee3 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  #f6f8f9 0%,#d7dee3 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  #f6f8f9 0%,#d7dee3 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f6f8f9', endColorstr='#d7dee3',GradientType=0 ); /* IE6-9 */
	border-top:1px solid #CCCCCC;	z-index:1000;}

/*横向きにした際にサイズが100%にならない対策*/
@media screen and (orientation:landscape) {
	ul.footnavbar {  width: 100%;  }
}
ul#footnavbar  a:link,
ul#footnavbar  a.ui-link:link{color:#555555;}
.footnavbar li.menu-button {float:left; width:20%; list-style-type:none; padding:2px 0; font-size:19px;line-height: 1.4;}
.footnavbar li.menu-button a{color:#555555;}
.footnavbar li.menu-button div.menu-content{display:none;}
.footnavbar ul{display:none;}
.footnavbar input{display:none;}
.footnavbar  .menu-icon { text-align: center; width: 100%; color:#555555;    }
.footnavbar  .menu-caption{ text-align: center; width: 100%;font-size:11px;	color:#555555;}
.footnavbar  .menu-icon::before { font-family: "Font Awesome 5 Free"; font-size: 16px;}
/*to here ナビゲーションバー*/

	/**  Remodal - v1.0.3*/
html.remodal-is-locked{overflow:hidden}
.remodal,[data-remodal-id]{display:none}
.remodal-overlay{position:fixed;z-index:9999;top:-5000px;right:-5000px;bottom:-5000px;left:-5000px;display:none}
.remodal-wrapper{position:fixed;z-index:10000;top:0;right:0;bottom:0;left:0;display:none;overflow:auto;text-align:center;-webkit-overflow-scrolling:touch}
.remodal-wrapper:after{display:inline-block;height:1%;margin-left:-.05em;content:""}
.remodal-overlay,.remodal-wrapper{-webkit-backface-visibility:hidden;backface-visibility:hidden}
.remodal{position:relative;outline:none;-webkit-text-size-adjust:100%;-moz-text-size-adjust:100%;-ms-text-size-adjust:100%;text-size-adjust:100%}
.remodal-is-initialized{display:inline-block}
.remodal-bg.remodal-is-opening,.remodal-bg.remodal-is-opened{-webkit-filter:blur(3px);filter:blur(3px)}
.remodal-overlay{background:rgba(43,46,56,0.9)}
.remodal-overlay.remodal-is-opening,.remodal-overlay.remodal-is-closing{-webkit-animation-fill-mode:forwards;animation-fill-mode:forwards}
.remodal-overlay.remodal-is-opening{-webkit-animation:remodal-overlay-opening-keyframes .3s;animation:remodal-overlay-opening-keyframes .3s}
.remodal-overlay.remodal-is-closing{-webkit-animation:remodal-overlay-closing-keyframes .3s;animation:remodal-overlay-closing-keyframes .3s}
.remodal-wrapper{padding:10px 10px 0}
.remodal{-webkit-box-sizing:border-box;box-sizing:border-box;width:100%;margin-bottom:10px;padding:25px 10px 15px;-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0);color:#2b2e38;background:#fff}
.remodal.remodal-is-opening,.remodal.remodal-is-closing{-webkit-animation-fill-mode:forwards;animation-fill-mode:forwards}
.remodal.remodal-is-opening{-webkit-animation:remodal-opening-keyframes .3s;animation:remodal-opening-keyframes .3s}
.remodal.remodal-is-closing{-webkit-animation:remodal-closing-keyframes .3s;animation:remodal-closing-keyframes .3s}
.remodal,.remodal-wrapper:after{vertical-align:middle}
.remodal-close{position:absolute;top:0;left:0;display:block;overflow:visible;width:35px;height:35px;margin:0;padding:0;cursor:pointer;-webkit-transition:color .2s;transition:color .2s;text-decoration:none;color:#95979c;border:0;outline:0;background:transparent}
.remodal-close:hover,.remodal-close:focus{color:#2b2e38}
.remodal-close:before{font-family:Arial,"Helvetica CY","Nimbus Sans L",sans-serif!important;font-size:25px;line-height:35px;position:absolute;top:0;left:0;display:block;width:35px;content:"\00d7";text-align:center}
.remodal-confirm,.remodal-cancel{font:inherit;display:inline-block;overflow:visible;min-width:110px;margin:0;padding:12px 0;cursor:pointer;-webkit-transition:background .2s;transition:background .2s;text-align:center;vertical-align:middle;text-decoration:none;border:0;outline:0;margin-top:5px}
.remodal-confirm{color:#fff;background:#2DB4E0}
.remodal-confirm:hover,.remodal-confirm:focus{background:#00A4DB}
.remodal-cancel{color:#fff;background:#e57373}
.remodal-cancel:hover,.remodal-cancel:focus{background:#ef5350}
.remodal-confirm::-moz-focus-inner,.remodal-cancel::-moz-focus-inner,.remodal-close::-moz-focus-inner{padding:0;border:0}
.remodal #modal1Title{ padding-bottom:8px; background-color:#FFFFFF; color:#000000;}
@-webkit-keyframes remodal-opening-keyframes {
from{-webkit-transform:scale(1.05);transform:scale(1.05);opacity:0}
to{-webkit-transform:none;transform:none;opacity:1}
}
@keyframes remodal-opening-keyframes {
from{-webkit-transform:scale(1.05);transform:scale(1.05);opacity:0}
to{-webkit-transform:none;transform:none;opacity:1}
}
@-webkit-keyframes remodal-closing-keyframes {
from{-webkit-transform:scale(1);transform:scale(1);opacity:1}
to{-webkit-transform:scale(0.95);transform:scale(0.95);opacity:0}
}
@keyframes remodal-closing-keyframes {
from{-webkit-transform:scale(1);transform:scale(1);opacity:1}
to{-webkit-transform:scale(0.95);transform:scale(0.95);opacity:0}
}
@-webkit-keyframes remodal-overlay-opening-keyframes {
from{opacity:0}
to{opacity:1}
}
@keyframes remodal-overlay-opening-keyframes {
from{opacity:0}
to{opacity:1}
}
@-webkit-keyframes remodal-overlay-closing-keyframes {
from{opacity:1}
to{opacity:0}
}
@keyframes remodal-overlay-closing-keyframes {
from{opacity:1}
to{opacity:0}
}
@media only screen and (min-width: 641px) {
.remodal{max-width:700px}
}
.lt-ie9 .remodal-overlay{background:#2b2e38}
.lt-ie9 .remodal{width:700px}
p#modal1Desc img {width:100%;}
/**  to here Remodal - v1.0.3*/


/*ボトム固定ナビゲーションバー*/
.navi-menu-icon::before { font-weight: 900;  content:"\f0c9"; }
.home-menu-icon::before { font-weight: 900;  content:"\f015";}
.search-menu-icon::before { font-weight: 900;  content:"\f002";}
.top-menu-icon::before { font-weight: 900;  content:"\f35b";}
.pc-menu-icon::before { font-weight: 900;  content:"\f108";}
.sidebar-menu-icon::before { font-weight: 900;  content:"\f0c9";}

/*スライドメニュー*/
 div#slidemenu_close{font-size:13px; text-align:center; padding:10px 10px; background-color:rgba(96,171,248,1);
 border-bottom:#999999; content:"\f410";  font-family: "Font Awesome 5 Free";  font-size: 16px;  font-weight:900;
  margin: 0 auto;  color:#FFFFFF; }
 div#slidemenu_close:before{ content:"\f410";  font-family: "Font Awesome 5 Free";  font-size:16px;
  font-weight:900;  padding-right:3px; }
a#closeBtn:link{font-size:11px;bottom:4px;color:black;}
#slidemenu_close span,
a#btn_search_close span{font-size:12px; vertical-align:2px; line-height:20px;}

/*サーチウィンドウ*/
.new_menu_top {overflow: hidden; line-height:1.1em; color:white; padding:4px 0 4px; border-top:1px solid #0088BB; margin-top:1px;
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#7abcff+0,60abf8+44,4096ee+100;Blue+3D+%2314 */
background: rgb(122,188,255); /* Old browsers */
background: -moz-linear-gradient(top,  rgba(122,188,255,1) 0%, rgba(96,171,248,1) 44%, rgba(64,150,238,1) 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(122,188,255,1)), color-stop(44%,rgba(96,171,248,1)), color-stop(100%,rgba(64,150,238,1))); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  rgba(122,188,255,1) 0%,rgba(96,171,248,1) 44%,rgba(64,150,238,1) 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  rgba(122,188,255,1) 0%,rgba(96,171,248,1) 44%,rgba(64,150,238,1) 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  rgba(122,188,255,1) 0%,rgba(96,171,248,1) 44%,rgba(64,150,238,1) 100%); /* IE10+ */
background: linear-gradient(to bottom,  rgba(122,188,255,1) 0%,rgba(96,171,248,1) 44%,rgba(64,150,238,1) 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#7abcff', endColorstr='#4096ee',GradientType=0 ); /* IE6-9 */
}
.new_menu_top_column {overflow: hidden; line-height:1.1em; color:white; padding:4px 0 4px; border-top:1px solid #0088BB; margin-top:1px;
background: rgb(211,90,4);
background: -moz-linear-gradient(0deg, rgba(211,90,4,1) 0%, rgba(244,158,0,1) 100%);
background: -webkit-linear-gradient(0deg, rgba(211,90,4,1) 0%, rgba(244,158,0,1) 100%);
background: linear-gradient(0deg, rgba(211,90,4,1) 0%, rgba(244,158,0,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#d35a04",endColorstr="#f49e00",GradientType=1);
}
div#title_search div{width: 100%;height: 30px;background:url(images/top_title_search.png) no-repeat center center;content:*;}
#search_window{padding: 10px; font-size:0.9em;}
#search_window form{padding: 0 5px; }
#search_window div.search_byname{font-size: 14px;background:none;position: relative;	padding: 3px 0 8px 0;	text-align: center;}
#search_window div.search_byname:last-child{	font-size: 14px;	background:none;	position: relative;	padding: 8px 0 20px;	border-bottom:1px solid #0053BF ;}
#search_window div.search_byname input[type="submit"]{width: 50px;}
 form.search_form div{	text-align:left;	line-height:34px; }
#search_window span.search_title{margin-top:8px;padding:4px 8px;background-color:#4494e6;font-weight:normal;color:#FFFFFF;display:block;}
#hougen_link{line-height:26px;	font-size:11px;}
a#btn_search_close{  margin-top:15px;  background-color:rgba(96,171,248,1);}
a#btn_search_close:link{ color:#FFFFFF;}
a#btn_search_close:before{ content:"\f410";  font-family: "Font Awesome 5 Free";  font-size:16px;  font-weight:900;  padding-right:3px;  color:#FFFFFF;}
a#btn_search_close span{vertical-align:1px; color:#FFFFFF;}
#search_window .ui-radio label.ui-btn{font-size:0.95em;}

input.txt_search_box{    padding: 5px 1%;    width: 50%;    border:1px solid #aaaaaa;   background-color:#efefef;}
div.boxSearch div.searchRow input#txtLocalSearch2 {}
input.submit_button{	padding:3px 8px;  background-color:#7babdc; border: 2px solid #bed2e8;   text-align: center;   font-size:1em;   color:#FFFFFF;}
div.boxSearch #frmSearchHougen  input#txtKW { margin:0;}
select.dd{  padding:4px 2px 7px;  width:6.3em;  font-size: 13px;  border:1px solid #aaaaaa;  background-color:#efefef;border-color:#aaaaaa;}
div.ui-controlgroup-controls {width:100%;}
#frmSearchHougen2 div.ui-radio,#frmSearchHougen div.ui-radio{width:50%;}
#frmSearchHougen2 div.ui-radio label.ui-btn,#frmSearchHougen div.ui-radio label.ui-btn{text-align:center;}

/*方言*/
#mainArea div.search_byname{padding:4px;}
#search_note,
div.index_note{padding:0.5em 7px 0; margin-bottom:0; line-height:1.4em; font-size:0.9em;}
#frmSearchHougen #search_note{padding-top:0;}

/*ソーシャルリンク*/
div.fb-share-button span{vertical-align:top !important;}

/*date format*/
div.createdDate{font-family:Helvetica, Arial, Arial Black, sans-serif;width:100vw; font-size:12px; border-bottom:1px solid #777777; text-align:right;}
div.createdDate #year{display:inline-block;font-size:13px; color:#808080;padding-right:2px;}
div.createdDate #month{display:inline-block;font-size:30px; color:#c76969;}
div.createdDate #slash{display:inline-block;font-size:30px; color:#9f9f9f;}
div.createdDate #day{display:inline-block;font-size:30px; color:#000000;}


p.lead{	clear: left; padding: 3px;	line-height: 1.5;}

/*** slideshow ***/
div#slideshow {	width: 100%; height: 168px; overflow-x: hidden; overflow-y: hidden; position: relative;}
div#slideshow img {left: 0;position: absolute;top: 0;width: 100%;z-index: 8;}
div#slideshow img.active { z-index:10;}
div#slideshow img.last-active {z-index:9;}

/*** new_menu ***/
nav#new_menu{ overflow: auto;text-align: center;
/* 	border-top: 1px solid #040050;
	border-bottom: 1px solid #040050; */
}

#wrapper nav#new_menu h2{ margin-top: 0; }
nav#new_menu ul{
	/*width: 60%;
	float: left;*/
	display: block;
	width: 100%;
	text-align: center;
	background-color: #CCCCCC;
	overflow: auto;
	padding: 1px 0;
	}

.new_menu_top div{width:50%; float:left; }
nav#new_menu ul li{
	display: block;
	float: left;
	width: 50%;
}
div#title_com div{
	width: 100%;
	height: 30px;
	background:url(images/top_title_common.png) no-repeat center center;
	content:*;
}
div#title_bio div{
	width: 100%;
	height: 30px;
	background:url(images/top_title_bio.png) no-repeat center center;
	content:*;
}
div#title_index div{
	width: 100%;
	height: 30px;
	background:url(images/top_title_index.png) no-repeat center center;
	content:*;
}
div#title_column div{
	width: 100%;
	height: 30px;
	background:url(images/top_title_column.png) no-repeat center center;
	content:*;
}
nav#new_menu ul li a{
	display: block;
	border-radius: 6px;
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#ffffff+0,e5e5e5+100;White+3D */
background: rgb(255,255,255); /* Old browsers */
background: -moz-linear-gradient(top,  rgba(255,255,255,1) 0%, rgba(229,229,229,1) 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(255,255,255,1)), color-stop(100%,rgba(229,229,229,1))); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  rgba(255,255,255,1) 0%,rgba(229,229,229,1) 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  rgba(255,255,255,1) 0%,rgba(229,229,229,1) 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  rgba(255,255,255,1) 0%,rgba(229,229,229,1) 100%); /* IE10+ */
background: linear-gradient(to bottom,  rgba(255,255,255,1) 0%,rgba(229,229,229,1) 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#e5e5e5',GradientType=0 ); /* IE6-9 */

	/* box-shadow: 0px 0px 5px #ccc; */
	padding: 12px;
	border: 1px solid #999;
	font-weight: bold;
	margin:0;
	font-weight:normal;
}
div.boxSearch div.searchRow{
	padding:3px 6px 6px;
	text-align:left;
}
nav#new_menu div#search_wrapper{
	padding:0;
	text-align:center;
}
nav#new_menu span.search_title{
	padding:4px 4px;
	display:block;
	background-color:#8aa7c3;
	color:#FFFFFF;
}
nav#new_menu div.boxSearch{
	padding: 0 20px;
	margin-bottom:0.3em;
	background-color:#FFFFFF;
}
/*nav#new_menu ul.lists{
	width: 40%;
	}*/

/*nav#new_menu ul li a{
	display: block;
	border-radius: 6px;
	background: -webkit-gradient(linear, left top, left bottom, from(#fdfdfd), color-stop(0.4, #fff), to(#e8e8e8));
	box-shadow: 0px 0px 5px #ccc;
	margin: 0 auto;
	padding-top: 7px;
	height: 20px;
	width: 95%;
	border: 1px solid #999;
	font-weight: bold;
	margin: 3px auto;
}

nav#new_menu ul.lists li a{
	background: -webkit-gradient(linear, left top, left bottom, from(#ccff54), color-stop(0.4, #e3ffa0), to(#a9dc31));
}*/

/*asideタイトル見出し*/
h2.right_col_title,
.h2_col_title{font-weight:bold; background-color:#50a1f3; background: rgb(65,129,194);background: linear-gradient(0deg, rgba(65,129,194,1) 0%, rgba(96,171,248,1) 88%);color:#ffffff; text-align:center;margin-top: 10px; padding: 10px 0}

/****** Top Only ? ******/

/*** old_menu ***/

nav#old_menu{
	margin-top: 10px;
	overflow: auto;
	text-align: center;
/* 	border-top: 1px solid #040050;
	border-bottom: 1px solid #040050; */
}

nav#old_menu h3{
	padding: 5px;
	background-color: #bac8db;
}

nav#old_menu ul{
	}

nav#old_menu ul li {
	width: 90%;
	margin: 0 auto;

}

nav#old_menu ul li a{
	border-radius: 6px;
	background: -webkit-gradient(linear, left top, left bottom, from(#fdfdfd), color-stop(0.4, #fff), to(#e8e8e8));
	box-shadow: 0px 0px 5px #ccc;
	display: block;
	line-height:2em;
	text-align: center;
	border: 1px solid #999;
	font-weight:500;
	margin: 3px;
}

/* Custom ----------------------------------------------------------------- */

nav#kanren_menu,
nav#sonota_menu{
	overflow: auto;
}
nav#kanren_menu ul.kanren_ul,
nav#sonota_menu ul{
	margin: 0 1%;
}
nav#kanren_menu ul.kanren_ul li,
nav#sonota_menu ul li{
	margin: 3px;
}

ul.bouz_kanren {padding:5px;}
ul.bouz_kanren, ul.bouz_kanren li { margin: 0; padding: 0; }
ul.bouz_kanren li { list-style-type: none; margin: 2px; float:left;}

ul.bouz_kanren li a.yaji{clear: left; }

a.bt_zukan,
a.bt_zukan02,
a.bt_zukan03,
a.bt_zukan04,
a.bt_zukan05,
a.bt_zukan06,
a.bt_zukan07{background-size:cover; text-indent: -9999px; width: 145px; height: 32px; margin: 2px; padding: 0;
border: solid 1px #040050;
border-top: 1px solid #cdcdcd
border-left: 1px solid #cdcdcd;
display: block; float:left;}

a.bt_zukan:hover,
a.bt_zukan02:hover,
a.bt_zukan03:hover,
a.bt_zukan04:hover,
a.bt_zukan05:hover,
a.bt_zukan06:hover,
a.bt_zukan07:hover{background-size:cover; text-indent: -9999px; width: 158px; height: 34px; margin: 0; padding: 0;
border: solid 1px #040050;
border-top: 1px solid #cdcdcd
border-left: 1px solid #cdcdcd;
display: block; float:left;
background-position: 0 -34px;
}

a.bt_zukan{ background-image: url(/common/img/bt_zukan.gif);}
a.bt_zukan:hover{ background-image: url(/common/img/bt_zukan.gif);}
a.bt_zukan02{ background-image: url(/common/img/bt_zukan02.gif);}
a.bt_zukan02:hover{ background-image: url(/common/img/bt_zukan02.gif);}
a.bt_zukan03{ background-image: url(/common/img/bt_zukan03.gif);}
a.bt_zukan03:hover{ background-image: url(/common/img/bt_zukan03.gif);}
a.bt_zukan04{ background-image: url(/common/img/bt_zukan04.gif);}
a.bt_zukan04:hover{ background-image: url(/common/img/bt_zukan04.gif);}
a.bt_zukan05{ background-image: url(/common/img/bt_zukan05.gif);}
a.bt_zukan05:hover{ background-image: url(/common/img/bt_zukan05.gif);}
a.bt_zukan06{ background-image: url(/common/img/bt_zukan06.gif);}
a.bt_zukan06:hover{ background-image: url(/common/img/bt_zukan06.gif);}
a.bt_zukan07{ background-image: url(/common/img/bt_zukan07.gif);}
a.bt_zukan07:hover{ background-image: url(/common/img/bt_zukan07.gif);}


#likebox .fbcomments,
#likebox .fb_iframe_widget,
#likebox .fb_iframe_widget[style],
#likebox .fb_iframe_widget iframe[style],
#likebox .fbcomments iframe[style],
#likebox .fb_iframe_widget span,
#likebox iframe{
    max-width: 100% !important;
    width: 100% !important;
}
#likebox{
	margin:20px auto;
	padding: 0 10px;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;

}
.fb-box{. text-align:center;}
/* ad */
#ad_google_text_footer{
	padding-left: 1em;
}
/*amazon link*/
div#amazonbook div.book{
	border:1px solid #CCCCCC;
	margin:6px 3px;
	padding:5px 5px;
  display: flex;
  align-items:center;
}
div#amazonbook div.book img{
	margin-right:6px;
    height: 70px;
    width: 100px;
	object-fit:cover;
}


/*ランキング*/
div#ranking_wrap{ width:100%; font-size:14px;}
div.rankings{box-sizing:border-box; width: 50%;  margin-bottom:.8em; float:left; padding:3px 2px; background-color:#FFFFFF; margin: 0px; min-height:230px;}
div.rankings p.title{ margin:0; padding:2px 3px; background-color:#edeace; color:#000;}
div.rankingsSyu{ width: 100%; }

div.rankingsSyubox2{ width: 100%; display:flex;}
div.rankingsSyubox2 .fitCover{width: 36px; height: 36px; object-fit:cover; object-position: 0% 50%; }
.rankingSyuBoxInner1-2 {padding:1px 3px 0px 0;}
.rankingSyuBoxInner2-2 {padding:1px;font-size: 0.85em; line-height:1.6em; }

span.rank_num1,
span.rank_num2,
span.rank_num3,
span.rank_num4,
span.rank_num5 { border-radius: 2px; padding:1px 4px; color:#777777; font-size:11px;}
span.rank_num1 { background-color:#bdb258; color:#FFFFFF;}
span.rank_num2 { background-color:#979797; color:#FFFFFF;}
span.rank_num3 { background-color:#a09857; color:#FFFFFF;}
span.rank_num4, span.rank_num5 { background-color:#ededed; color:#000000;}


/*最新コラムリスト*/
div.right_article{width:auto;}
div.right_article > div.right_col{ overflow:hidden auto; }
div.right_article ul li{display:block;  display:flex; justify-content:space-between; padding:5px 3px 1px; border-bottom:1px dotted #666666;line-height:16px; font-size:0.9em;}
div.right_article ul li a{display:block; order:1; line-height:1.7em; text-decoration:none;}
div.right_article ul li span{align-self: center; order:2;display:block; white-space:nowrap; color:#a0a0a0; font-size:0.8em; margin-left:3px;}


/* banner*/
div.ad_banner_sp {
	border:1px solid #CCCCCC;
}
h2.official_sponcer{
	  margin-top:1px !important;font-weight: bold; color:#FFF; background-color:#E08C1D; margin-bottom:3px;}
div.spbannerarea_top_middle {position:relative; margin:0; margin-bottom:5px;}
div.spbannerarea_top_middle div.spbanner_top_middle{border-top:1px solid #DDDDDD;border-bottom:1px solid #DDDDDD; width:100%; margin:0; padding:0;}
div.spbannerarea_top_middle img {width:100%; height:auto;}

#header_logo {
    margin-bottom:0px;
}
/*SOCIAL BUTTONS*/
.socialButtons{	margin-top:-2px; padding: 2px 0px;	text-align: right; background-color:#efefef; height:35px;}
.socialButtons ul{	margin-top:4px;}
.socialButtons ul li{	display:block;	float:right; margin-right:0.5em;}


/*-----mailmagazine.php-------------------*/
#mailmagazine h2{
	margin-top: 0px;
}
#mailmagazine ul.center_ul{
	margin: 4px 0;
	padding: 2px 0.3em;
	line-height: 1.3em;
}
#mailmagazine ul.center_ul li{
	margin: 4px 0;
}
#mailmagazine ul.center_ul h4{
	padding: 2px 3px;
	line-height: 1.5em;
	border-left: 2px solid #d87500;
	border-bottom: 1px dotted #CCC;
	margin-bottom: 3px;
}
#mailmagazine ul{
	background-color:#FFFFFF;
}
#article {padding:0 3px;}
div.article_single_box{ position:relative;overflow:hidden; height: 154px; border-bottom: 5px solid #FFFFFF; margin-top:5px; line-height:21px;}
#article div.article_list_title{ background-color:#eaead5; color:#ffffff;  line-height: 22px; margin-bottom:3px;}
#article  h2{display:inline;text-indent:0.2em; padding:0.3em 0.3em 0; background-color:transparent;border:none;}
#article  h3 + div.description{padding:3px 0.6em;}
#article  h4 + div.description{padding:3px 0.6em;;}
#article img {padding: 0 0 4px; float: left; border-right: 3px solid #FFFFFF;}

span.article_type{display:inline; margin:1px 2px; background-color:#800040; padding:1px 8px 2px; border-radius:3px; font-size:12px;}
span.article_type_identity{}
span.article_type_food{background-color:#a57a40;}
span.article_type_history{background-color:#b96db0;}
span.article_type_culture{background-color:#b96db0;}
span.article_type_column{background-color:#3388CC;}
span.article_type_others{background-color:#3388CC;}
span.article_type_recipe{background-color:#0178a5;}
span.article_type_kakouhin{background-color:#b57931;}
div.move_to_article{line-height:18px; position:absolute; bottom:0; border:1px solid #2f7dbd; right:1px; background-color:#FFFFFF;font-weight:normal;  padding:0 12px 0 10px; white-space:nowrap;font-size: 12px;}
a.move_to_article{height:22px; position:absolute; bottom:0; right:1px; width: 280px;background-image: linear-gradient(to right, rgba(255,255,255,0), rgba(255,255,255,1) 48%);font-size: 12px;}
div.article_date{display:inline; color:#000000; line-height:20px; padding:2px 3px 0;font-size: 13px;}

