@charset "utf-8";

body {
	position: relative;
	/*width: 100%;*/
	max-width: 60em;
	margin: auto;
	scrollbar-track-color: #fff8dc;
/*	text-align: center; */
	background-color: #fff;
	background-image:url("http://www.act-hokkaido.com/images/Background_AoiIke.jpg");
/*	background-image:url("http://www.act-hokkaido.com/wp/wp-content/themes/twentyeleven/images/back.jpg"); */
	background-size: min(100%, 60em);
	background-position: top;
	background-repeat: no-repeat;
}

/* 説明表示窓開始*/
#exp_window {
	position: fixed;
	top:0;
	width: 100%;
	max-width:58em;
/*	height: 2.2em; */
	display: none;
	text-align: left;
	z-index:9999;
/*	background-color:#ffe; */
}

iframe[name="exp_content"] {
	position: fixed;
	top:45px;
	width: 95%;
	max-width: 56em;
	height: 50%;
	background:#dff;
	overflow-y: scroll; 
/*	border-radius: 1rem; */
}

.exp_open {
	cursor:pointer;
	color: blue;
	background-color: #ff4;
}

.close_button {
	position: absolute;
		left: 0vw;
	cursor:pointer;
	background-color:#aff;
	color: #400;
	font-weight:bold;
	font-size: 1.2rem;
	line-height:1.8rem;
	border: 2px solid #444;
	border-radius: 0.5rem;
}


.navi_btn {
	position: absolute;
	top: 5px;
	line-height: 45px;
	right: 0.2rem;
	font-size: min(3vw, 1.2em);
	z-index:100;
	opacity:70%;
}

.navi_btn img {
	width: min(7vw,42px);
}


/* 本体開始*/

#header {
	width: 100%;
	font-size: min(4vw,38px);
	font-weight: bold;
	max-width: 58em;
	line-height:1em;
	padding-top: 4vw;
	padding-left: 2em;
	text-align: left;
	color: #a00;
	text-shadow: 0.05em -0.05em 0.1em #fff;
	display: inline-block;
}

#main_frame {
/*	width: 100%; */
	max-width: 60em;
	position: relative;
	top: min(17vw, 12em);
/*	padding-left: 1em; */
}

/*
#h_index {
	width: 100%; 
	max-width: 58em;
	height: 3em;
	overflow-y: scroll;
	border: 2px solid #d44;
	padding-left: 2em;
	text-align: left;
	font-size: 1.2em;
	font-weight: bold;
}
*/

.btn1 {
	width: auto;
	text-decoration: none;
	font-weight: bold;
	display:inline-block;
	border: 2px solid #ab9;
	border-radius:10px;
	background-color: #cfc;
	margin: 0.1em;
	padding: 0.1em 0.2em 0.1em 0.2em;
	opacity:0.7;
	cursor: pointer;
}

/*
.btn2{
	text-decoration: none;
	font-weight: bold;
	border: 2px solid #ab9;
	border-radius:10px;
	background-color: #dfd;
	margin: 0.1em;
	padding: 0.1em 0.2em 0.1em 0.2em;
	cursor: pointer;
}
*/


.formula {
	font-family: "New Century Schoolbook", Times, serif;
	font-size: 1.2em;
	text-align: left;
	margin-left: 0.3em;
}

.formula sub,sup {
	font-size: 0.5em;
}

.mokuji1  {
	 border: 1px solid;
	 padding: 0.5em;
}

.mokuji1 div {
	margin-left: 2em;
	 font-size: 1.2em;
	 font-weight: bold;
}

.mokuji1 a {
	display: inline-block;
	text-indent: -1em;
	padding-left: 1em;
	 margin-bottom: 0.5em;
	 font-size: 1em;
	 font-weight: bold;
}

.mokuji1 a:before {
    content: '➤';
}


/*用語解説へのリンク*/
.explink {
	color: #040;
	background-color: #ff8;
}

.glist {
	texgt-align: left;
	font-size: 1.2em;
}

.glist a {
	display: inline-block;
	margin-bottom:1em;
	margin-right:1em;
}
.glist a:before {
	content: '《';
}

.glist a:after {
	content: '》';
}

h1 {
	clear:both;
	margin-top: 1em;
	margin-left: 1em;
	margin-right: 1em;
	font-size: 1.5em;
	text-align: center;
	color: #008;
	border-bottom: solid 2px green;
}

/* h1:before {
    content: '■';
} */

h2 {
	clear:both;
	margin-top: 1.3em;
	margin-left: 1em;
	margin-bottom: 0.3em;
	font-size: 1.2em;
	text-align: left;
}


p {
	clear: both;
	margin-top: 1em;
	text-align: left;
}

a {
	text-decoration: none;
}

hr.green1 {
	border-top: 1px dotted #4f4;
}

.olink {
/*	display: block; */
	padding-left:2em;
	text-indent:-1em;
}

.olink:before {
    content: '★';
}

.list1 div {
	margin-left: 1em;
	margin-bottom: 1em;
}

.list1 a {
	color:#04a;
	font-weight:bold;
	font-size: 1.2em;
}

.list1 a:before {
    content: '➤';
}

.droplet {
	height: 85px;
	text-align: left;
	background-image: url(../images/droplet.svg);
	background-repeat: no-repeat;
}
/*
.droplet > img {
	float: left;
	width: 74px;
	height: 85px;
}
*/

.droplet > span {
	position: relative;
	left: 35px;
	top: 28px;
	font-size: 1.5em;
}

.note {
	padding: 0.5em 1em;
	margin: 2em 0;
	border: solid 1px #c66;
	border-radius: 10px;
	color: #600;
}

.inyo {
	font-style: italic;
	color: navy;
}

.tbl1 {
	border-collapse: collapse;
	border: 1px solid #333;
}

.tbl1 > thead > tr {
	background-color: #228;
}

.tbl1 > thead > tr >th {
	color: #fff;
	border: 1px solid #000;
	text-align: center;
}

.tbl1 > tbody  tr {
	border: 1px solid #000;
}

.tbl1 > tbody > tr > th {
	text-align: center;
	vertical-align: middle;
}

.tbl1 > tbody > tr > td {
	text-align: left;
	border: 1px solid #333;
}