@charset "utf-8";

.clear {
	clear: both ;
}

body {
	font-size: 100% ;
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif ;
}

.sen1 {
	width: 100% ;
	height: 3px ;
	background-color: #336699 ;
}
@media(max-width:768px) {
.sen1 {
	height: 2px ;
}
}
@media(max-width:480px) {
.sen1 {
	height: 1px ;
}
}
.sen2 {
	width: 100% ;
	height: 1px ;
	background-color: #336699 ;
}
.sen3 {
	width: 80% ;
	height: 3px ;
	background-color: #336699 ;
	margin: auto ;
}
.sen4 {
	width: 30% ;
	height: 1px ;
	background-color: #336699 ;
	margin: auto ;
}
@media(max-width:768px) {
.sen4 {
	width: 60% ;
	height: 1px ;
	background-color: #336699 ;
	margin: auto ;
}
}
@media(max-width:480px) {
.sen4 {
	width: 70% ;
	height: 1px ;
	background-color: #336699 ;
	margin: auto ;
}
}

#hd1 {
	width: 100% ;
	background: #fff ;
	padding: 1% 0px 1% 0px ;
}
#navi1 {
	width: 50% ;
	float: left ;
	text-align: center ;
	padding: 10px 0px 10px 0px ;
}
#navi1 img {
	width: 26% ;
}
.navi2 {
	width: 40% ;
	float: left ;
	padding: 10px 0px 10px 0px ;
}
.navi2 ul {
	width: 90% ;
}
.navi2 ul li{
	width: 20% ;
	float: left ;
}
.navi2 ul li img {
	width: 100% ;
}

@media(max-width:480px) {
#hd1 {
width: 100% ;
background: #fff ;
padding: 0px ;
}
#navi1 {
	width: 100% ;
	float: left ;
	text-align: center ;
	padding: 10px 0px 10px 0px ;
}
#navi1 img {
	width:60% ;
}
.navi2 {
	width: 100% ;
	float: left ;
	padding: 0px ;
}
.navi2 ul {
	width: 90% ;
}
.navi2 ul li{
	width: 100% ;
	float: none ;
	text-align: center ;
}
.navi2 ul li img {
	width: 100% ;
}
}

/*-----------------------------
box1
------------------------------*/
.box1 {
	width: 80% ;
	top:60;
	margin: auto;
	padding-top: 8% ;
	background: url(../image/hd_bk1.png) no-repeat center top ;
	background-size: cover ;
}
.box1 .josei1 {
	width: 40% ;
	float: left ;
	text-align: right ;
}
.box1 .josei1 img {
	width: 50% ;
}
.box1 #logo {
	width: 60% ;
	float: left ;
	text-align: left ;
}
.box1 #logo img {
	width: 60% ;
}
.box1 #logo1 {
	width: 60% ;
	float: left ;
	text-align: center ;
}
.box1 #logo1 img {
	width: 60% ;
}
.box1 #pc1 {
	width: 50% ;
	float: left ;
	text-align: center ;
}
.box1 #pc1 img {
	width: 60% ;
}
.box1 #sita1 {
	width: 60% ;
	text-align: center ;
}
.box1 #sita1 img {
	width: 3% ;
}
/*-------------------------
box2
--------------------------*/
.box2 {
	width: 100% ;
	padding: 5% 0px 5% 0px ;
	background: #fff ;
}
.box2 #Area {
	width: 50% ;
	margin: auto ;
	padding-bottom: 1% ;
	text-align: center ;
}
.box2 #Area img {
	width: 60% ;
}
.box2 #Area1 {
	width: 66% ;
	margin: auto ;
	margin-bottom: 20px ;
	margin-top: 40px ;
}
.box2 #Area1 img {
	width: 100% ;
}
.box2 #Area2 {
	width: 66% ;
	margin: auto ;
}
.box2 #Area2 img {
	width: 100% ;
}

@media(max-width:768px) {
.box2 #Area {
	width: 90% ;
}
.box2 #Area img {
	width: 80% ;
}
.box2 #Area1 {
	width: 90% ;
}
.box2 #Area2 {
	width: 90% ;
	margin: auto ;
}
}
@media(max-width:480px) {
.box2 #Area {
	width: 90% ;
}
.box2 #Area img {
	width: 80% ;
}
.box2 #Area1 {
	width: 96% ;
	margin-top: 20px ;
}
.box2 #Area2 {
	width: 96% ;
	margin: auto ;
}
}

/*---------------------------------
box3
----------------------------------*/
.box3 {
	width: 100% ;
	padding: 10% 0px 10% 0px ;
	background: #fff ;
}
.box3 #Area3 {
	width: 35% ;
	margin: auto ;
	text-align: center ;
	float: left ;
	margin-left: 15% ;
	color: #333 ;
}
.box3 #Area3 img {
	width: 50% ;
}
.box3 #Area3 h2 {
	width: 60% ;
	font-weight: bold ;
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif ;
	font-size: 120% ;
	line-height: 40px ;
	margin: auto ;
	margin-top: 40px ;
}
.box3 #Area3 h3 {
	width: 60% ;
	font-weight: bold ;
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif ;
	font-size: 120% ;
	line-height: 40px ;
	margin: auto ;
	margin-top: 20px ;
}
.box3 #Area3 p {
	width: 60% ;
	font-size: 100% ;
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif ;
	/*font-weight: bold ;*/
	line-height: 28px ;
	margin: auto ;
}
.box3 #Area4 {
	width: 35% ;
	margin: auto ;
	text-align: center ;
	float: left ;
	margin-right: 15% ;
	color: #333 ;
}
.box3 #Area4 img {
	width: 50% ;
}
.box3 #Area4 h3 {
	width: 80% ;
	font-weight: bold ;
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif ;
	font-size: 120% ;
	line-height: 40px ;
	margin: auto ;
	margin-top: 40px ;
}
.box3 #Area4 p {
	width: 80% ;
	font-size: 100% ;
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif ;
	/*font-weight: bold ;*/
	line-height: 40px ;
	margin: auto ;
	margin-top: 20px ;
}
.box3 #Area3 #kotira1 {
	width: 60% ;
	margin: auto ;
	margin-top: 30px ;
}
.box3 #Area3 #kotira1 img {
	width: 80% ;
}
.box3 #Area4 #kotira1 {
	width: 60% ;
	margin: auto ;
	margin-top: 30px ;
}
.box3 #Area4 #kotira1 img {
	width: 80% ;
}

@media(max-width:768px) {
.box3 #Area3 {
	width: 80% ;
	float: none ;
	margin-left: 0% ;
	margin: auto ;
}
.box3 #Area3 img {
	width: 70% ;
}
.box3 #Area3 h2 {
	width: 70% ;
}
.box3 #Area3 h3 {
	width: 70% ;
}
.box3 #Area3 p {
	width: 70% ;
	font-size: 100% ;
}
.box3 #Area4 {
	width: 80% ;
	text-align: center ;
	float: none ;
	margin-right: 0% ;
    margin: auto ;
	margin-top: 50px ;
}
.box3 #Area4 img {
	width: 70% ;
}
.box3 #Area4 h3 {
	width: 70% ;
}
.box3 #Area4 p {
	width: 70% ;
}
.box3 #Area3 #kotira1 {
	width: 60% ;
	margin: auto ;
	margin-top: 30px ;
}
.box3 #Area3 #kotira1 img {
	width: 80% ;
}
.box3 #Area4 #kotira1 {
	width: 60% ;
	margin: auto ;
	margin-top: 30px ;
}
.box3 #Area4 #kotira1 img {
	width: 80% ;
}
}

@media(max-width:480px) {
.box3 #Area3 {
	width: 90% ;
	float: none ;
	margin-left: 0% ;
	margin: auto ;
}
.box3 #Area3 img {
	width: 90% ;
}
.box3 #Area3 h2 {
	width: 90% ;
	font-size: 90% ;
}
.box3 #Area3 h3 {
	width: 90% ;
	font-size: 90% ;
}
.box3 #Area3 p {
	width: 90% ;
	font-size: 80% ;
}
.box3 #Area4 {
	width: 90% ;
	text-align: center ;
	float: none ;
	margin-right: 0% ;
    margin: auto ;
	margin-top: 50px ;
}
.box3 #Area4 img {
	width: 90% ;
}
.box3 #Area4 h3 {
	width: 90% ;
	font-size: 90% ;
}
.box3 #Area4 p {
	width: 90% ;
	font-size: 80% ;
}
.box3 #Area3 #kotira1 {
	width: 60% ;
	margin: auto ;
	margin-top: 30px ;
}
.box3 #Area3 #kotira1 img {
	width: 80% ;
}
.box3 #Area4 #kotira1 {
	width: 60% ;
	margin: auto ;
	margin-top: 30px ;
}
.box3 #Area4 #kotira1 img {
	width: 80% ;
}
}

/*---------------------------------------
box4
----------------------------------------*/
.box4 {
	width: 100% ;
	padding: 10% 0px 10% 0px ;
	background: #fff ;
}
.box4 #Area5 {
	width: 70% ;
	margin: auto ;
	text-align: center ;
}
.box4 #Area5 img {
	width: 26% ;
}
.box4 #Area6 {
	width: 70% ;
	margin: auto ;
	margin-top: 30px ;
}
.box4 #Area7 {
	width: 50% ;
	margin: auto ;
	text-align: center ;
	margin-top: 20px ;
	font-size: 100% ;
	color: #333 ;
	line-height: 34px ;
}
.box4 #Area7 span {
	font-size: 140% ;
	font-weight: bold ;
}
.box4 #Area8 {
	width: 50% ;
	text-align: center ;
	margin: auto ;
	margin-top: 20px ;
}
.box4 #Area8 img {
	width: 30% ;
}
@media(max-width:768px) {
.box4 #Area5 img {
	width: 70% ;
}
.box4 #Area7 {
	width: 80% ;
	margin: auto ;
	text-align: center ;
	margin-top: 20px ;
	font-size: 100% ;
	color: #333 ;
	line-height: 34px ;
}
.box4 #Area7 span {
	font-size: 130% ;
}
.box4 #Area8 img {
	width: 70% ;
}
}
@media(max-width:480px) {
.box4 #Area5 img {
	width: 70% ;
}
.box4 #Area7 {
	width: 80% ;
	margin-top: 20px ;
	font-size: 80% ;
	line-height: 26px ;
}
.box4 #Area7 span {
	font-size: 120% ;
}
.box4 #Area8 img {
	width: 70% ;
}
}

/*---------------------------------
footer上部
----------------------------------*/
.ft1{
	width: 100% ;
	padding: 3% 0px 3% 0px ;
	background: url(../image/body_bk1.png) ;
}
#ftArea1 {
	width: 60% ;
	margin: auto ;
}
#ftArea2 {
	width: 30% ;
	float: left ;
	margin-right: 10% ;
	text-align: center ;
	padding-top: 20px ;
}
#ftArea2 img {
	width: 80% ;
}
#ftArea2 p {
	font-size: 70% ;
	color: #666 ;
	line-height: 20px ;
	margin-top: 10px ;
}
#ftArea3 {
	width: 30% ;
	float: left ;
	margin-right: 5% ;
	border-left: 1px outset #999 ;
}
#ftArea3 p {
	line-height: 30px ;
	font-size: 80% ;
	color: #666 ;
	padding-left: 30px ;
}
#ftArea3 p a {
	text-decoration: none ;
	color: #666 ;
}
#ftArea3 p a:hover {
	color: #2ca6e0;
}
#ftArea4 {
	width: 20% ;
	float: left ;
}
#ftArea4 img {
	width: 100% ;
	margin-bottom: 10px ;
}
@media(max-width:768px) {
.ft1{
	width: 100% ;
	padding: 3% 0px 3% 0px ;
	background: url(../image/body_bk1.png) ;
}

#ftArea1 {
	width: 100% ;
	margin: auto ;
}
#ftArea2 {
	width: 30% ;
	float: left ;
	margin-right: 10% ;
	text-align: center ;
	padding-top: 20px ;
}
#ftArea2 img {
	width: 60% ;
}
#ftArea2 p {
	font-size: 70% ;
	color: #666 ;
	line-height: 20px ;
	margin-top: 10px ;
}
#ftArea3 {
	width: 30% ;
	float: left ;
	margin-right: 5% ;
	border-left: 1px outset #999 ;
}
#ftArea3 p {
	line-height: 30px ;
	font-size: 80% ;
	color: #666 ;
	padding-left: 30px ;
}
#ftArea3 p a {
	text-decoration: none ;
	color: #666 ;
}
#ftArea3 p a:hover {
	color: #2ca6e0;
}
#ftArea4 {
	width: 20% ;
	float: left ;
}
#ftArea4 img {
	width: 100% ;
	margin-bottom: 10px ;
}
}
@media(max-width:480px) {
.ft1{
	width: 100% ;
	padding: 3% 0px 3% 0px ;
	background: url(../image/body_bk1.png) ;
}
#ftArea1 {
	width: 100% ;
	margin: auto ;
}
#ftArea2 {
	width: 100% ;
	float: none ;
	margin-right: 10% ;
	text-align: center ;
	padding-top: 20px ;
}
#ftArea2 img {
	width: 80% ;
}
#ftArea2 p {
	font-size: 90% ;
	color: #666 ;
	line-height: 20px ;
	margin-top: 10px ;
}
#ftArea3 {
	width: 80% ;
	float: none ;
	margin: auto ;
	border: none ;
	padding-top: 2% ;
	padding-bottom: 2% ;
}
#ftArea3 p {
	line-height: 26px ;
	font-size: 80% ;
	color: #666 ;
	padding-left: 30px ;
}
#ftArea3 p a {
	text-decoration: none ;
	color: #666 ;
}
#ftArea3 p a:hover {
	color: #2ca6e0;
}
#ftArea4 {
	width: 100% ;
	margin: auto ;
	float: none ;
	text-align: center ;
}
#ftArea4 img {
	width: 80% ;
	margin-bottom: 10px ;
}
}
/*---------------------------------
footer
----------------------------------*/
footer {
	width: 100% ;
	padding: 1% 0px 1% 0px ;
	background: #336699 ;
	text-align: center ;
	font-size: 80% ;
	color: #fff ;
}