﻿@charset "UTF-8";

/*-- インフレームの書式 --*/

*, *:before, *:after {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-o-box-sizing: border-box;
	-ms-box-sizing: border-box;
	box-sizing: border-box;
}

body{
 	background: #eff;
	margin:30px;
	font-family: "游ゴシック","Yu Gothic","游ゴシック体","YuGothic","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","メイリオ",Meiryo,Osaka,"ＭＳ Ｐゴシック","MS PGothic",sans-serif;
}

div {
 	background: rgba(254,254,254,0.7);
	margin:5px;
	width: 620px;
	padding: 5px;
	font-color; #000000;
}

#atama {
	position:fixed;
	z-index:1;
	top: 10px;
	left: 2px;
	background: #cff;
	width: 4%;
	margin:0;	
	padding:0;
}

.prt {
	position:relative;
	width: 70%;
	text-align: center;
	color: #f00;
	background: #bee;
	margin:10px 2px 10px;	
	padding:0;
}

.waku {
	padding: 10px; 
	margin: 10px; 
	border: solid 5px;
	border-color: #aaaaaa; 
	border-radius: 10px; 
	width: 600px; 
	text-align: center;
	font-size: 20px;
	font-color: #aa0000;
}

h1{
	font-size:30px;
	position: relative;
	padding: 0.25em 0;
}

h1:after {
  content: "";
  display: block;
  height: 4px;
  background: -webkit-linear-gradient(to right, rgb(230, 90, 90), transparent);
  background: linear-gradient(to right, rgb(230, 90, 90), transparent);
}

h2 {
  position: relative;
  color: #6eb0f9;
  line-height: 1.4;
  -webkit-box-reflect: below -10px -webkit-linear-gradient(top,rgba(0,0,0,0),rgba(0,0,0,0) 10%,rgba(0, 0, 0, 0.6));
}
h3 {
  position: relative;
  color: white;
  background: #81d0cb;
  line-height: 1.4;
  padding: 0.5em 0.5em 0.5em 1.8em;
}

h3:before {
  font-family: "Font Awesome 5 Free";
  content: "\f14a";
  position: absolute;
  left : 0.5em; /*左端からのアイコンまでの距離*/
}
h4 {
  font-size:20px;
  position: relative;
  background: #f1f8ff;
  padding: 0.25em 0.5em;
  border-left: solid 2em #5c9ee7;
  display: inline-block;/*おまじない*/
}

h4:before {
  font-family: "Font Awesome 5 Free";
  content: "\f303";
  position: absolute;
  padding: 0em;
  color: white;
  font-weight: normal;
  left: -1.35em;
  top: 50%;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
}
h5 {
  font-size:18px;
  color: #505050;/*文字色*/
  padding: 0.5em;/*文字周りの余白*/
  display: inline-block;/*おまじない*/
  line-height: 1.0;/*行高*/
  background: #dbebf8;/*背景色*/
  vertical-align: middle;
  border-radius: 25px 0px 0px 0px;/*左側の角を丸く*/
}

h5:before {
  content: '●';
  content-size:16px;
  color: white;
  margin-right: 8px;
}

h6 {
  font-size:20px;
  padding: 0.5em;/*文字周りの余白*/
  color: #010101;/*文字色*/
  background: #eaf3ff;/*背景色*/
  border-bottom: solid 3px #516ab6;/*下線*/
}
h6:first-letter {
  font-size: 2em;
}

p {
	position: relative;
	width: auto;
	margin: 0 0 0 0;
	color: #050505;
	font-size: 16px;
	font-weight: 500;
	line-height: 1.5em;
	letter-spacing: 0.1em;
	padding: 2px 2px 2px 2px;
}

strong {
	font-weight: 900;
}

table {
	width: auto;
	margin: 0.5em 1em 0.5em 2em;
	border-collapse: collapse;
	border: 1px solid #ccc;
	background: #fff;
}
th {
	padding: 5px 8px 2px;
	text-align: center;
	vertical-align: top;
	border: 1px solid #ccc;
	background: #eee;
	text-align: left;
}
td {
	padding: 5px 8px 2px;
	text-align: left;
	border: 1px solid #ccc;
	vertical-align: top;
}

/*-- 図表設定 --*/
figure {
	padding: 10px;
	border:solid 2px;
	border-color: #aaa;
	border-radius: 10px;
}

figcaption {
	color: #000;
	font-size: 1.2em;
}

/*-- トップボタン --*/
#page_top {
	position: fixed;
	bottom: 100px;
	right: 0px;
	width: 5%;
	font-size: 16px;
	background: rgba(40,40,40,0.1);
	border-radius: 8px 8px 8px 8px;
}

#page_top a {
	display: block;
	background: rgba(50,50,50,0.2);
	border: 2px solid rgba(60,60,60,0.1);
	border-radius: 6px 6px 6px 6px;
	color: #fff;
	padding: 0;
	text-align: center;
	text-decoration: none;
}

#page_top a:hover {
	background: rgba(50,50,50,0.8);
	color: #fff;
	text-decoration: none;
	transform: translateY(-10px);
	-webkit-transform: translateY(-10px);
}

#page_top a:active {
	color: #ddd;
}

#page_top a,
#page_top a::before,
#page_top a::after {
	-webkit-transition: all .5s ease 0;
	transition: all .5s ease 0;
}