@charset "UTF-8";

/*============================================
全般的なスタイル
============================================*/
* {
	margin:0; padding:0;    	/*全要素のマージン・パディングをリセット*/
}

html * {
	box-sizing: border-box;
}

body {
	margin: 0;
        width: 480px;
        background-color:#dddddd;	/*ページ全体の背景色*/
	font-size:20px;			/* フォントサイズを20pxにする */
	font-family: "ＭＳ ゴシック",sans-serif;	/* フォントの種類をゴシック系にする */
	line-height:30px;		/* 行の高さを30pxにする */
	color:#333333;  		/* 文字色を濃い目のグレーにする */
}

hr {
	clear:both;		/*フロート配置をクリアする*/
	width:100%;		/*幅の指定*/
        float: right;
	margin:10px 0px;		/*マージン*/
	border:1px dotted #333333;	/*内容の区切りをグレーの点線表示にする*/
}

/*============================================
ヘッダ
============================================*/
header {
        background: #ccccff;
        display: flex;
}
.header-nav-wrapper {
        position: fixed;
        z-index: 10;
        left: 0;
        top: 0;
        max-width: 1000px;
        width: 100%;
}
.logo {
        flex: 0 0 110px;
}
.taitoru {
        flex: 1 1 auto;
}
.infoimg2_index {
	width:90px; height:80px;	/*画像の表示サイズを指定*/
	margin:5px 5px 0px 5px;	/*マージン*/
}
.main-title {
	padding:20px 0px 0px 20px;		/*見出しの位置調整*/
	font-size:48px;				/*フォントのサイズ*/
	font-family:Arial, Helvetica, sans-serif;	/*フォントの種類*/
        text-align: center;                     /*文字の中央揃え*/
        color: #800080;
}
.subtitle {
        display: block;
        padding:5px 0 0px 0;
        font-size: 18px;
        font-weight: normal;
        color: #222222;
        text-align: center;
}

/*============================================
メインメニュー
============================================*/
nav {
        background: #999999;
}

.nav-container {
        max-width: 1000px;
}

.globalnav {
	display: flex;
	flex-flow: row;
	list-style: none;
        justify-content: space-around;
}

.globalnav li {
        flex: 1 0 auto;
}

.globalnav li a {
	display:block;  		/*リンク部分をブロック表示にする*/
	background-color: #006633;		/*背景色*/
	color: #ffffff;			/*文字色*/
	padding: 5px 0px 5px 0px;	/*上パディング、下パディング*/
	text-align: center;		/*テキストをセンター揃えにする*/
	text-decoration: none;  	/*リンク部分を下線無しにする*/
	font-size: 18px;
}

.globalnav li a:hover {
	background-color:#000066; 	/*リンクにマウスが乗ったら背景色を変更する*/
}
.globalnav li a.current {
        background-color:#000066; 	/*ページが切り替わったら背景色を変更する*/
}

/*============================================
全ボディ
============================================*/
.whole-body {
        width: 1000px;
        display: flex;
        position: relative;
}

/*============================================
サブメニュー（左カラム）
============================================*/
h2 {
	width:190px; height:43px;		/*幅と高さ*/
	padding:5px 20px 20px 30px;		/*パディング*/
	font-size:16px;			/*フォントサイズ*/
	background-color:#000077;		/*背景色*/
	color:#ffffff;  		/*文字色*/
	margin:10px 0px 0 0;   	/*位置調整*/
}
.sidebar {
        position: relative;
        flex: 0 0 190px;
        order: 1;
        border: none;
        font-size:16px;			/*フォントサイズ*/
	margin:0 0px 20px 10px;   	/*位置調整*/
        z-index: 0;
        left: 0;
        top: 140px;
        max-width: 200px;
}
.sidebar ul li {
	list-style-type:none;		/*リストマーカー無しにする*/
}
.sidebar ul li a {
	display:block;  		/*リンク部分をブロック表示にする*/
	height:30px;    		/*高さを45pxにする*/
	padding:0 0 10px 15px;		/*パディング*/
	text-decoration:none;   	/*リンクの下線を無くす*/
	border-bottom:1px dotted gray;  /*リンク領域の下部にボーダーを付ける*/
	background-image:url(images/bg_submenu.png);   /*リンク領域に背景画像を付ける*/
	background-repeat:no-repeat;    /*背景画像を繰り返さない*/
	color:#333333;                  /*文字色*/
}
.sidebar ul li:first-child a {
	border-top:1px dotted gray;		/*一番上のリンクに上線を表示*/
}
.sidebar ul li a:hover	{
	text-decoration:underline;	/*リンクにマウスが乗ったら下線を表示*/
}
.sidebar ul li a:before {
	content: url("images/icon_submenu.png");	/*アイコン画像を挿入*/
	margin:0px 10px 0px 0px;		/*マージン*/
	vertical-align:text-top;			/*縦方向の表示位置*/
}
.infoimg1_index {
	width:160px; height:120px;	/*画像の表示サイズを指定*/
	margin:5px 10px 0px 10px;	/*マージン*/
}
.info_toyokoro {
        line-height: 100%;
	margin:0px 0px 20px 20px;	/*マージン*/
}

/*============================================
ヘッダ画像
============================================*/
.main-wrapper {
        flex: 1 1 auto;
        position: relative;
        z-index: 0;
        /*left: 210px;*/
        top: 150px;
        max-width: 790px;
        margin: 0 0 0 10px;
        width: 100%;
        order: 2;
}

.header-picture {
        overflow: hidden;
        position: relative;
        /*width: 100%;*/
}

.img_index1 {
        /*width: 100%;*/
        float: left;
        height: auto;
        text-align: center;
        max-width: 395px;
        font-size: 0;
}
.img_index2 {
        /*width: 100%;*/
        float: left;
        height: auto;
        text-align: center;
        max-width: 395px;
        font-size: 0;
}
.img_index1 img {
        width: 100%;
}
.img_index2 img {
        width: 100%;
}
.copy-a {
        position: absolute;
        right: 395px;
        bottom: 15px;
        background: #000000;
        opacity: 0.5;
        text-align: center;
}
.copy-a p {
        font-size: 12px;
        color: #ffffff;
        text-decoration: none;
        /*font-weight: bold;*/
}
.copy-b {
        position: absolute;
        right: 0px;
        bottom: 15px;
        background: #000000;
        opacity: 0.5;
        text-align: center;
}
.copy-b p {
        font-size: 12px;
        color: #ffffff;
        text-decoration: none;
        /*font-weight: bold;*/
}
/*============================================
メインボディ
============================================*/
main { }

.maincol {
        flex: 1 1 auto;
        margin: 20px 0 0 0;
}

.ribbon20-wrapper {  
  display: block;
  position: relative;
  margin: 20 auto;
  margin-left: 10px;
  padding: 5px 0;
  width: 250px;
  background: #dddddd;
  }
.ribbon20 {
  display: inline-block;
  position: absolute;
  left: 0;
  top: 5px;
  box-sizing: border-box;
  padding: 0 12px;
  margin: -8px 0 0 0;
  height: 30px;
  line-height: 30px;
  font-size: 18px;
  letter-spacing: 0.1em;
  color: white;
  background: #70c7ff;
  box-shadow: 0 2px 2px rgba(0, 0, 0, 0.12);

  -webkit-animation: ribbon20 3s ease-in-out infinite;
   animation: ribbon20 3s ease-in-out infinite;
}
@-webkit-keyframes ribbon20 {
	0% {opacity: 0;}
	100% {opacity: 1;}
}
@keyframes ribbon20 {
	0% {opacity: 0;}
	100% {opacity: 1;}
}

.ribbon20:before {
  position: absolute;
  content: '';
  top: 0;
  left: -7px;
  border: none;
  height: 38px;
  width: 7px;
  background: #70c7ff;
  border-radius: 5px 0 0 5px;
}
.ribbon20:after {
  position: absolute;
  content: '';
  bottom: -7px;
  left: -5px;
  border: none;
  height: 7px;
  width: 5px;
  background: #4d99ca;
  border-radius: 5px 0 0 5px;
}

h3 {
        margin: 0 0 10px 0;
	font-size:24px;			/*文字サイズ*/
	width:100%;			/*横幅*/
	padding:20px 0px 5px 5px;		/*パディング*/
	color:#800080;  		/*文字色*/
	border-radius:5px;			/*角丸にする*/
        padding-top: 130px;
        margin-top: -130px;
	/*background-color:#003399;		背景色*/
        font-weight: bold;
}
.infoimg_index {
	width:180px; height:120px;	/*画像の表示サイズを指定*/
	margin:10px 0px 0px 10px;	/*マージン*/
}
.imagebox {
        width:200px;
        float:right;
	font-size:14px;
        text-align: center;
}
.imagebox p {
        margin-top: -10px;
}
table {
        border-collapse: collapse;
        width: 790px;
}
td,th {
        border: 1px solid #b7b7b7;
        font-size: 16px;
}

th:nth-child(n+1) {
        white-space: no-wrap;
        text-align: center;
}
td:nth-child(n+1),td:nth-child(n+2) {
        white-space: no-wrap;
        text-align: center;
}
td:nth-child(n+3),td:nth-child(n+3) {
        text-align: left;
        width:170px;
}
td:nth-child(n+4),td:nth-child(n+5) {
        text-align: right;
        width:50px;
}
td:nth-child(n+6) {
        text-align: left;
        width:190px;
}
.newcolor {
        color: blue;
        text-align: center;
}
.kukaku {
        position: relative;
        float: left;
        margin-right: 10px;
}
.titen_usubetsu {
        position: absolute;
        left: 97px;
        top: 447px;
}
.titen_ushisyubetsu {
        position: absolute;
        left: 277px;
        top: 278px;
}
.titen_ninomiya {
        position: absolute;
        left: 182px;
        top: 329px;
}
.titen_yuudou {
        position: absolute;
        left: 315px;
        top: 529px;
}
.titen_choubushi {
        position: absolute;
        left: 431px;
        top: 474px;
}
.titen_ohtsu {
        position: absolute;
        left: 510px;
        top: 446px;
}
.titen_tabikorai {
        position: absolute;
        left: 395px;
        top: 382px;
}
.titen_seoi {
        position: absolute;
        left: 320px;
        top: 317px;
}
.titen_ankotsu {
        position: absolute;
        left: 370px;
        top: 289px;
}
.titen_horooka {
        position: absolute;
        left: 398px;
        top: 242px;
}
.titen_moiwa {
        position: absolute;
        left: 295px;
        top: 217px;
}
.titen_noyaushi {
        position: absolute;
        left: 191px;
        top: 218px;
}
.titen_chuou {
        position: absolute;
        left: 335px;
        top: 193px;
}
.titen_toyokoro {
        position: absolute;
        left: 383px;
        top: 168px;
}
.titen_ikusoda {
        position: absolute;
        left: 308px;
        top: 158px;
}
.titen_reisakubetsu {
        position: absolute;
        left: 240px;
        top: 173px;
}
.titen_rebunnai {
        position: absolute;
        left: 350px;
        top: 111px;
}
.titen_hokuei {
        position: absolute;
        left: 273px;
        top: 99px;
}
.titen_touhutsu {
        position: absolute;
        left: 316px;
        top: 67px;
}
.titen_tounai {
        position: absolute;
        left: 192px;
        top: 117px;
}
.infoimg3_index {
	width:65px; height:22px;	/*画像の表示サイズを指定*/
        opacity:0.0;
        z-index: 10;
}
.infoimg3_index:active {
        opacity:0.5;
}
.float_clear {
        clear: both;
}

/*============================================
フッタ
============================================*/
.koushin {
	clear:both;			/*回り込みを解除する*/
	height:10px;			/*高さの指定*/
	padding:0px 0px 10px 40px;	/*パディング*/
	font-size:x-small;		/*フォントサイズを小さくする*/
	text-align:left;		/*センタリング*/
}
.copyright {
	height:20px;			/*高さの指定*/
	padding:0px 0px 20px 0px;	/*パディング*/
	font-size:x-small;		/*フォントサイズを小さくする*/
	text-align:center;		/*センタリング*/
}