/* Author URI: http://www.af5.jp/ */
@charset "utf-8";


/*---------------------------------------------------------------------------*/
body {
	color: #474747; margin: 0px; padding: 0px; font: 14px/2 "メイリオ", Meiryo, "ＭＳ Ｐゴシック", Osaka, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro"; background: #ededed url(./images/bg-body.png) repeat;}

h1,h2,h3,h4,h5,p,ul,ol,li,dl,dt,dd,form,figure{margin: 0px; padding: 0px;}
ul{list-style-type: none; }
img {border: none;}
input,textarea,select {font-size: 1em;}
form {margin: 0px;}
table {border-collapse:collapse; font-size: 100%; border-spacing: 0;}

/*---------------------------------------------------------------------------*/
a {color: #0000cc;}
a:hover {color: #DA251D;}

/*---------------------------------------------------------------------------*/
body > h1 {font-size: 10px; color: #FFF; background: #284c7e; text-align: right; }
body > h1 a, body > h1 a:hover {color: #FFF; text-decoration: none;}

/*---------------------------------------------------------------------------*/
/* #container {width: 980px; margin-right: auto; margin-left: auto;} */
#container {width: 1230px; margin-right: auto; margin-left: auto;}

/*---------------------------------------------------------------------------*/
header {width: 100%; background: #ededed url(./images/bg-body.png) repeat; }

header h1 {line-height: 1; padding: 30px 0px 30px 35px;}
header h1 img{vertical-align: middle;}
header h1 a{color: #474747; text-decoration: none;}
header #logotxt{font-weight: bold;}

/*---------------------------------------------------------------------------*/
nav#menu ul {background-color: #0f4fab;
	background-image: -webkit-gradient(linear, left top, left bottom, from(#6996d3), to(#000));
	background-image: -webkit-linear-gradient(#6996d3, #000);
	background-image: linear-gradient(#6996d3, #000);
	border-radius: 10px 10px 10px 10px;
	-webkit-box-shadow: 1px 2px 7px #b7b7b7;
	box-shadow: 1px 2px 7px #b7b7b7;
	height: 50px;
	padding-top: 13px;
	padding-left: 36px;
	margin-bottom: 25px;
}

nav#menu ul li {float: left; width: 222px; border-right: 1px dotted rgba(255,255,255,0.6); line-height: 1.6; text-align: center; font-weight: bold;}
nav#menu ul li a {color: #FFF; text-decoration: none; display: block; /*-webkit-transition: 0.5s;	transition: 0.5s;*/}

nav#menu ul li:first-child {border-left: 1px dotted rgba(255,255,255,0.6);}

nav#menu ul li a:hover {color: #000; background: #FFF;}

nav#menu ul li a span {font-size: 9px; display: block; font-weight: normal; letter-spacing: 0.2em; color: #999;}

/*---------------------------------------------------------------------------*/
#mainimg {clear: left; width: 980px; height: 290px; position: relative; background-color: #FFF; margin-bottom: 25px;
	border-radius: 10px 10px 10px 10px; -webkit-box-shadow: 1px 2px 7px #b7b7b7;
	box-shadow: 1px 2px 7px #b7b7b7;
}
#mainimg img {border-radius: 10px 10px 10px 10px; vertical-align: bottom;}
#mainimg .slide_file {display: none; }
#slide_image {z-Index:2; position: absolute; left:0px; top:0px;}
#slide_image2 {z-Index:1; position: absolute; left:0px; top:0px;}

/*---------------------------------------------------------------------------*/
/* #contents {clear: left; width: 950px; background-color: #FFF; padding: 15px 15px 0px; */
#contents {clear: left; width: 1200px; background-color: #FFF; padding: 15px 15px 0px;
	border-radius: 10px 10px 10px 10px;
	-webkit-box-shadow: 1px 2px 7px #b7b7b7;
	box-shadow: 1px 2px 7px #b7b7b7;
}

/*---------------------------------------------------------------------------*/
/* #main {float: left; width: 680px; padding-bottom: 30px;} */
#main {float: left; width: 880px; padding-bottom: 30px;}

#main h1 {background-color: #0f4fab; font-size: 160%; color: #FFF; padding: 5px 10px 5px 15px; margin: 0px 0px 20px; clear: both;
	background-image: -webkit-gradient(linear, left top, left bottom, from(#6996d3), to(#0f4fab));
	background-image: -webkit-linear-gradient(#6996d3, #0f4fab);
	background-image: linear-gradient(#6996d3, #0f4fab);
	border-radius: 10px 10px 10px 10px;
	-webkit-box-shadow: 1px 2px 7px #999;
	box-shadow: 1px 2px 7px #999;
}

#main h2 {background-color: #fff; font-size: 150%; color: #0f4fab; padding: 5px 10px 5px 15px; margin: 30px 0px 20px; clear: both; border-left:10px solid #0f4fab; border-bottom:3px solid #0f4fab;}

#main h3 {position:relative; font-size: 140%; color: #0f4fab; font-weight: bold; padding-left:30px; margin: 30px 0px 20px; border-bottom:2px dotted #ccc; line-height: 38px;}
#main h3:before{
	content:''; 
	border-radius:30px;
	-webkit-border-radius:30px;
	-moz-border-radius:30px; 
	height:12px; 
	width:12px; 
	display:block; 
	position:absolute; 
	top:13px; 
	left:5px; 
	background-color:#0f4fab;
	box-shadow: 0 0 2px 2px rgba(255,255,255,0.2) inset;
}

#main p {padding: 0.5em 10px 1em; font-size: 130%;}
#main > p {background-color: #FFF;}

#main ul{list-style-type:square; margin:1em 30px 1em 50px;}
#main ul li{padding:5px; font-size:130%;}

#main ol{list-style-type:decimal; margin:1em 30px 1em 50px;}
#main ol li{padding:5px; font-size:130%;}


/*
---------------------------------------------------------------------------*/
/* #sub {float: right; width: 250px; padding-bottom: 30px;} */
#sub {float: right; width: 300px; padding-bottom: 30px;}

#sub h2 {border: 1px solid #CCC; border-radius: 6px 6px 0 0; font-size: 100%; text-align: center; padding: 5px 0px; margin-top:20px;
	background-color: #e0e1e2;
	background-image: -webkit-gradient(linear, left top, left bottom, from(#f3f3f5), to(#e0e1e2));
	background-image: -webkit-linear-gradient(#f3f3f5, #e0e1e2);
	background-image: linear-gradient(#f3f3f5, #e0e1e2);
}

#sub aside{margin-bottom: 20px;}

#sub ul {margin-bottom: 1em;}
#sub ul li{display: block; line-height:30px;
	border-right: 1px solid #CCC; border-bottom: 1px solid #CCC; border-left: 1px solid #CCC;
	padding-left: 10px; -webkit-transition: 0.5s; transition: 0.5s;
}
#sub ul li:first-child{border-top:1px #ccc solid;}

#sub ul li:hover {background-color: #dcdcdc; cursor:pointer;}
#sub ul li a {color: #474747; text-decoration: none; }
#sub ul li.topic {display: block; line-height:30px; padding:;list-style-type:none;font-weight:bold;}
#sub ul li.topic:hover {background-color: #fff; cursor:auto;}

/*---------------------------------------------------------------------------*/
footer {clear: both; text-align: center; padding-top: 15px; padding-bottom: 15px; color: #333;}
footer .pr {display: block; font-size: 80%; }
footer a {text-decoration: none; color: #333;}

/*---------------------------------------------------------------------------*/
#pagetop {clear: both; text-align: left;}
#pagetop a {color: #FFF; background-color: #0f4fab; text-decoration: none; text-align: center; width: 14em; font-size: 10px; letter-spacing: 0.1em; display: inline-block;}
#pagetop a:hover {background-color: #333; color: #FFF;}


/*-media----------------------------------------------------------------------*/
@media only screen and (min-width: 481px) and (max-width: 800px) {

	body > h1 {display: none;}
	#container {width: auto; margin-right: 6px; margin-left: 6px;}

	header {text-align: center;}

	header h1 {padding: 30px 0 30px 0;}

	nav#menu ul {height: auto; padding: 0; margin-bottom: 0;}

	nav#menu ul li {float: left; border: none !important; margin-bottom: 5px; width: 50%;
		background-image: -webkit-gradient(linear, left top, left bottom, from(#6996d3), to(#000));
		background-image: -webkit-linear-gradient(#6996d3, #000);
		background-image: linear-gradient(#6996d3, #000);
		border-radius: 10px 10px 10px 10px;
		-webkit-box-shadow: 1px 2px 7px #b7b7b7;
		box-shadow: 1px 2px 7px #b7b7b7;
	}
	nav#menu ul li a {padding: 7px;}

	nav#menu ul li:last-child {margin-bottom: 20px;}

	nav#menu ul li a span {display: none;}

	#contents {width: auto;}

	#main, #sub {float: none; width: auto;}

	#mainimg {height: auto; width: 100%;}
	#slide_image {height: auto; width: 100%; position: relative;}
	#slide_image2 {height: auto; width: 100%; position: absolute; left:0px; top:0px;}

}

/*-media----------------------------------------------------------------------*/
@media only screen and (max-width: 480px) {

	body > h1 {display: none;}

	#container {width: auto; margin-right: 6px; margin-left: 6px;}

	header {text-align: center; }
	header h1 {padding: 20px 0 20px 0; }

	header h1 img {width: 80%; height: auto;}

	nav#menu ul {height: auto; padding: 0;}

	nav#menu ul li {float: none; width: auto; border: none !important; text-align: left;
	background-image: url(./images/btn_arrow.png), -webkit-gradient(linear, left top, left bottom, from(#6996d3), to(#000));
	background-image: url(./images/btn_arrow.png), -webkit-linear-gradient(#6996d3, #000);
	background-image: url(./images/btn_arrow.png), linear-gradient(#6996d3, #000);
	background-repeat: no-repeat;
	background-position: right center;
	}

	nav#menu ul li a {padding: 10px 0px 10px 20px;}

	nav#menu ul li:first-child {border-radius: 10px 10px 0 0;}

	nav#menu ul li:last-child {border-radius: 0 0 10px 10px;margin-bottom: 10px;}

	nav#menu ul li a span {display: none;}

	#contents {width: auto;}

	#main, #sub {float: none; width: auto;}
	#main p {padding: 0;}

	#mainimg {display: none;}
}


/*-customize table----------------------------------------------------------------------*/
table.table_box {
  border-collapse: collapse;
  margin: 0 auto;
  padding: 0;
  width: 95%;
  margin-left: auto;
  margin-right: auto;
  box-shadow: 0 0 15px -6px #00000073;
}

table th:nth-child(1) {
	width: 35%;
}

table th:nth-child(2) {
	width: 65%;
}

table.table_box tr {
  background-color: #fff;
}

table.table_box th,
table.table_box td {
  padding: 5px 10px;
  border: 1px solid #202060;
}

table.table_box th {
  /*width: 20%;*/
  padding: 15px;
  background-color: #202060;
  color:#fff;
  align:center;
  font-size: 1.3rem;
}

table.table_box td {
  font-size: 0.82rem;
}

table.table_box tr{
  /*width: 20%;*/
  padding: 20px 0;
  background-color: #fff;
  color:#3a3a3a;
}

table.table_box tr:hover{
  background-color: #d4faff;
}


/*-customize Yotube----------------------------------------------------------------------*/
/* レスポンシブ対応 */
div.movie-wrap {
     position: relative;
     padding-bottom: 56.25%; /*アスペクト比 16:9の場合の縦幅*/
     height: 0;
     overflow: hidden;
}

div.movie-wrap iframe {
     position: absolute;
     top: 0;
     left: 0;
     width: 100%;
     height: 100%;
}