@charset "utf-8";

/* @group Reset */

*{ margin: 0;padding: 0}

a { text-decoration : none}
ul, ol { list-style : none}
img {  vertical-align : middle;
 align: center}

/* @end */


/* @group Fluid-img */

img { max-width : 100%}

/* @end */


/* @group HTML */
body { background-color: #d8c2a4 }

html {
font-family : verdana, sans-serif;
font-size : 75%; /*レスポンシブタイプセッティングの指定*/
line-height : 1.5}

/* @end */


/* @group Heading */

h1 {
font-size : 3em; /* 48px */
line-height : 1; /* 48px */
margin-bottom : 0.5em } 

h2 {
font-size : 2.25em; /* 36px */
line-height : 1.3333; /* 48px */
margin-bottom : 0.6667em } 

h3 {
font-size : 1.5em; /* 24px */
line-height : 1; /* 24px */
margin-bottom : 1em } 

hgroup h2,h4,h5,h6 {
font-size : 1em; /* 16px */
line-height : 1.5; /* 24px */
margin-bottom : 1.5em } 


/* @end */

/* @group Header */

header { 
text-align : center;
padding-top : 1.5em;
background : #211f1f}

header h1 { margin-bottom : 0.5em}
header h2 { color : #fff}

/* @end */

/* @group Nav */
.text-text {
	font-family: "ＭＳ Ｐゴシック", Osaka, "ヒラギノ角ゴ Pro W3";
	font-size: 16px;
	font-style: normal;
	line-height: 16px;
	font-weight: normal;
	color: #003366;
	text-align: left;
}

.text-text-b {
	font-family: "ＭＳ Ｐゴシック", Osaka, "ヒラギノ角ゴ Pro W3";
	font-size: 12px;
	font-style: normal;
	line-height: 16px;
	font-weight: bold;
	color: #003366;
}

.table-kihon {
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	font-size: 18px;
	font-style: normal;
	line-height: 18px;
	font-weight: normal;
	color: #066;
	background-color: #FFC;
	text-align: left;
	margin: 1px;
	width: 80%;
	padding-top: 1px;
	padding-right: 5px;
	padding-bottom: 1px;
	padding-left: 1px;
	border-top-width: 1px;
	border-right-width: 1px;
	border-bottom-width: 1px;
	border-left-width: 1px;
	border-top-color: #FC6;
	border-right-color: #FC6;
	border-bottom-color: #FC6;
	border-left-color: #FC6;
}

.span-coment-middle {
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	font-size: 18px;
	font-style: normal;
	color: #066;
	background-color: #CFF;
	text-align: left;
	margin: 10px;
	padding: 10px;
	border-top-color: #F4F3EE;
	border-right-color: #F4F3EE;
	border-bottom-color: #F4F3EE;
	border-left-color: #F4F3EE;
}

.sub-index-title-4 {
	font-family: "ＭＳ Ｐゴシック", Osaka, "ヒラギノ角ゴ Pro W3";
	font-size: 18px;
	font-style: normal;
	line-height: normal;
	font-weight: bold;
	color: #990000;
}

.info{width: 90%;
padding-left:5em}

.section_middle{ 
text-align : center;
padding-top : 1.5em;
background : #99ffff;
align-content: center;
text-color: #fff}

.span-coment-middle {
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	font-size: 18px;
	font-style: normal;
	color: #066;
	background-color: #CFF;
	text-align: left;
	margin: 10px;
	padding: 10px;
	border-top-color: #F4F3EE;
	border-right-color: #F4F3EE;
	border-bottom-color: #F4F3EE;
	border-left-color: #F4F3EE;
}
.sub-title-left {
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	font-size: 18px;
	color: #066;
	background-color: #CFF;
	margin: 10px;
	padding: 10px;
	text-align: left;
	border: 2px solid #036;
}
.nav_upper {
	text-align: center;
margin-bottom : 1.em;
background-color: #007700;
background: -moz-linear-gradient(top, rgba(125,73,52,1) 0%, rgba(43,21,18,1) 88%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(125,73,52,1)), color-stop(88%,rgba(43,21,18,1))); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top, rgba(125,73,52,1) 0%,rgba(43,21,18,1) 88%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top, rgba(125,73,52,1) 0%,rgba(43,21,18,1) 88%); /* Opera 11.10+ */
background: linear-gradient(to bottom, rgba(125,73,52,1) 0%,rgba(43,21,18,1) 88%); /* W3C */
}
.nav_sub {
margin-bottom : 1.5em;
background-color: #007700;
background: -moz-linear-gradient(top, rgba(125,153,88,1) 0%, rgba(43,21,18,1) 88%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(125,153,88,1)), color-stop(88%,rgba(43,21,18,1))); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top, rgba(125,153,88,1) 0%,rgba(43,21,18,1) 88%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top, rgba(125,153,88,1) 0%,rgba(43,21,18,1) 88%); /* Opera 11.10+ */
background: linear-gradient(to bottom, rgba(125,153,88,1) 0%,rgba(43,21,18,1) 88%); /* W3C */
}
.nav_footer {
margin-bottom : 1.em;
background-color: #007700;
background: -moz-linear-gradient(top, rgba(0,102,153,1) 0%, rgba(43,21,18,1) 88%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(0,102,153,1)), color-stop(88%,rgba(43,21,18,1))); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top, rgba(0,102,153,1) 0%,rgba(43,21,18,1) 88%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top, rgba(0,102,153,1) 0%,rgba(43,21,18,1) 88%); /* Opera 11.10+ */
background: linear-gradient(to bottom, rgba(0,102,153,1) 0%,rgba(43,21,18,1) 88%); /* W3C */
}
nav ul { overflow : hidden}
nav ul li { width : 25%; float : left  }
nav ul li a {
display : block;
color : white;
padding : 0.55em 0}

nav ul li a:hover {
color : white;
background-color : #83b4d8}

/* @end */

/* @group Contents */

#contents {
width : 90%;
margin : 0 auto;
text-align : center}

#contents p { 
margin-bottom : 1.5em;
text-align : left}
#contents img { 
margin-bottom : 1.5em; 
box-shadow : 0 0 5px #2f1f1f}

/* @end */

/* @group Footer */

footer {
padding : 1.5em 0;
color : #5A1214;
text-align : center;
background-color : black}

/* @end */

/*768px*/
@media screen and (min-width : 768px){

html{ font-size : 87.5%} /*レスポンシブタイプセッティングの指定*/
#contents { text-align : left;
	}

}

/*1024px*/
@media screen and (min-width : 1024px) {

html{ font-size : 100%} /*レスポンシブタイプセッティングの指定*/

/* @group Nav */

nav ul {
width : 93.75%;/* 960/1024 */
margin : 0 auto}

/* @end */

/* @group Contents */

#contents {
overflow : hidden;
width : 93.75%}

#contents #main,
#contents #sub { 
float : left;
margin : 0 1.0416667%;
	} 

#contents #main { width : 64.5833333%;
	}
#contents #sub { width : 31.25%;
	}

/* @end */


/* @group Footer */

footer {
width : 100%; /*940/1024*/
margin : 0 auto}

/* @end */

}