@charset "utf-8";

/*------------------------------------------
　　＜全ページ共通CSS＞

		■初期設定・初期化
			：共通設定
			：ブラウザのマージンとパディング初期化
			：タグ毎のマージンとパディング初期化
			：リンク設定
			：float対策
			：イメージ初期化
		■メイン設定
		■コンテンツ設定
		■フッター設定
------------------------------------------*/
/*------------------------------------------
更新日　2019.02.02　はるか
------------------------------------------*/



/*------------------------------------------
　　ブラウザのマージンとパディング初期化
------------------------------------------*/
*{
margin:0;
padding:0;
}

/*------------------------------------------
　　タグ毎のマージンとパディング初期化
------------------------------------------*/
body,div,p,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,blockquote,table,tr,td {
padding: 0;
margin: 0;
}

/*------------------------------------------
　　リンク設定
------------------------------------------*/
a img{
border: none;
}

a {
color: #0066cc;
text-decoration:none;
}
a:hover {
color:#FF3399;
text-decoration:none;
}
a:visited {
color:#993399;
text-decoration:underline;
}

a:hover img{
opacity:0.80;
/*--IE,FF対応--*/
filter:alpha(opacity=80);
-ms-filter: "alpha( opacity=80)";
}

a:link {
    color: #666;
}


/*------------------------------------------
　　配置
------------------------------------------*/
.floatLeft{
float:left;
}

.floatRight{
float:right;
}

.floatClear{
	clear:both;
}
	
.mt30{
	margin-top:30px;
}

.mt5{
	margin-top:5px;
}

.center{
text-align:center;
}

.block{
	display:block;
}


/*------------------------------------------
　　float対策
------------------------------------------*/
.fcl { 
zoom: 100%;
}
.fcl:after {
content: " "; 
clear: both; 
height: 0; 
display: block; 
visibility: hidden;
}

/*------------------------------------------
　　イメージ初期化
------------------------------------------*/
img {
vertical-align:middle;
margin:0;
padding:0;
}

/*------------------------------------------
　　テキスト装飾
------------------------------------------*/
.txt_bold{
	font-weight:bold;
}
.txt_small{
	font-size:75%;
}
.txt_big{
	font-size:120%;
}
.txt_red{
	color:#F66;
}
.txt_blue{
	color:#0066cc;
}
.txt_gold{
	color:#82753e;
}
.txt_marker{
	background-color:#FFFF33;
}
.txt_lh{
line-height:1.5;
}
.txt_hide{
text-indent:-40000px;
height:0;
}

/*------------------------------------------
	メイン設定
------------------------------------------*/
body {
	/*background:url(../img/bg_body01.gif);*/
	background:url(../img/bg01.png);
    font-family: "メイリオ","ＭＳ Ｐゴシック","Lucida Grande","Hiragino Kaku Gothic Pro","ヒラギノ角ゴ Pro W3",Geneva,Arial,Verdana,sans-serif;
	color:#312d26;
	font-size: 16px;
	line-height: 140%;
}

#wrap{
	width:1000px;
	margin:0 auto;
}

/*#frame{
	background:#ffffff;
	width:980px;
	margin:0 auto;
	padding:5px 0 0 0;
	position:relative;
	zoom:1;
}*/

#contents{
	width:1000px;
	margin:0 auto;
	/*background-image:url(../img/side-bg.gif);
	background-repeat:repeat-y;
	background-position:right;*/
}

#main{
	float:left;
	font-size:16px;
	width:730px;
	padding: 70px 0 60px;

}
/*トップページ以外*/
#main2{
	float:left;
	font-size:16px;
	width:1000px;
	padding: 70px 0 60px;

}

/*------------------------------------------
	サイド
------------------------------------------*/

#side{
	z-index: 1;
	padding: 0;
	padding-top:20px;
	float: right;
	width: 250px;
	margin-bottom:5px;
	text-align: center;
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}

#side h3{
	margin-bottom:10px;
	border-bottom:dotted 2px #664b2f;
	color:#666;
	font-size:18px;
	margin-top:25px;
	padding-bottom:5px;
}
#side .area{
	margin:10px 10px 60px 10px;
	text-align:left;
	font-size:14px;
}

#side .area ul{
	padding:0;
	list-style-type: none;
}


#side .area li{
	padding-left: 20px;
	margin:15px;
}

#side table .city{
	padding:10px;
}

#side table{
	text-align:center;
	margin:0 auto;
	background:url(../img/area.gif) no-repeat left top;
}



#side table .ward{
	padding:5px 0 15px 0;
}


/*------------------------------------------
	header
------------------------------------------*/

/*
#header{
	background-image:url(../img/header.jpg);
	background-repeat:repeat-x;
	width:100%;
	height:80px;
	margin:0;
	padding:0;
}*/

#headerTop {
    max-width: 1000px;
    width: 100%;
    position: relative;
    overflow: hidden;
	margin: 0 auto;
}

#header{
    margin: 0 auto;
    position: relative;
    width: 1000px;
    height: 143px;
}

#headerLogo {
    position: absolute;
    top: 32px;
    left: 6px;
}
#headerLinks {
    margin-top:14px;
    position: absolute;
    right: 0;
}
#headerLinks ul{
}

#headerLinks li.tell {
	    margin-left: 15px;

}
#headerLinks li {
    display: inline;
}
#headerLinks li.form {
    margin-left: 24px;
}
#headerLinks p.title {
    margin-bottom: 15px;
}


#header h2 a{
	text-indent: -9999px;
	width: 1000px;
    height: 80px;
    display: block;
    text-indent: -9999px;
	margin:0 auto;
	position:relative;
    background: url(../img/logo.jpg) no-repeat 0 0;
}

#header p.description{
	text-align: left;
	margin: 0;
	padding: 0;
	text-indent: -9999px;
	display: none;
}



/*------------------------------------------
	h1エリア
------------------------------------------*/
#h1_area{
	width:100%;
	background: none repeat scroll 0 0 #664b2f;
	margin:0;
    padding: 2px 0 2px 30px;
	padding: 0;
}

h1{
	width: 1000px;
    color: #FFFFFF;
    font-size: 12px;
	margin:0 auto;
    padding: 0px;
	text-align:right;
}


/*------------------------------------------
	hエリア
------------------------------------------*/

h2{
	font-size:18px;
	color:#664b2f;
}

.midashi{
	line-height: 40px;
	padding-left: 1em;
	border-left: 7px solid #664b2f;
	border-bottom: 1px solid #664b2f;
	margin-top:15px;
}


h4{
	margin:0;
	border-bottom:dashed 1px #664b2f;
	color:#630;
	font-size:14px;
}


.content h5.p-g {
    background: #f0dac5;
}
.content h5 {
    background: #b39678;
    padding: 12px 10px 8px;
    max-width: 100%;
    color: #664b2f;
    border-radius: 5px;
    font-size: 16px;
    margin-top: 15px;
}


/*------------------------------------------
	ナビゲーション
------------------------------------------*/

#nav{
    background: url(../img/navbg.gif) repeat-x left top;
	height:90px;
}

#navbar{
	width:1000px;
	margin:0 auto;
	display: block;
	position: relative;
}

#navbar li{
	float:left;
	width:170px;
	margin:0;
	padding:0;
}

#navbar li.snav{
	float:left;
	width:150px;
	margin:0;
	padding:0;
}

#navbar ul{
	margin:0;
	padding:0;
	list-style-type:none;
	font-size:14px;
	line-height:42px;
	letter-spacing:2px;
}

#navbar a{
	color:#630;
	display:block;
}

/*------------------------------------------
	トップの画像
------------------------------------------*/
#topimg{
	margin:0 auto;
	max-width:1000px;
	height: auto ;			/* 縦幅を自動調整 */
}
.toptxt{
	margin-left: 50px;
	margin-top: 20px;
	position: absolute;
	font-size: 22px;
	font-family: YuMincho, "Yu Mincho", "Hiragino Mincho ProN", "serif";
	line-height: 2em;
	font-weight: bold;
}	

/*------------------------------------------
	フッター
------------------------------------------*/
#footwrap {
	background-color:#664b2f;
    margin:20px auto 0;
    padding:20px 0 20px 0;
    font-size:14px;
    line-height:1.8;
    clear:both;
	color:#FFF;
	overflow: hidden;
}

#footer{
	width:1000px;
	margin:0 auto;
	height:100px;
}

#footer a:link{
	color:#FFF;
}
	
#footer a:visited{
	color:#FFF;
}

#profile{
	text-align:left;
}
#profile .name{
	font-weight:bold;
	font-size:18px;
}

#footer2{
text-align: center;
width: 100%;
margin: 0 auto;
margin-top:20px;
}


/*------------------------------------------
	スマホ向けメニューPCで非表示
------------------------------------------*/

#toggleMenu{display:none; }

button{display:none;}

/*------------------------------------------
	トップページ以外のヘッダ部分
------------------------------------------*/

#titleArea {
    background: #664b2f;
}
#titleArea h2 {
    width: 1000px;
    margin: 30px auto 0;
    text-align: left;
    font-size: 30px;
	color:#FFF;
    padding: 25px 5px 20px;
    box-sizing: border-box;
}


/*------------------------------------------
	コンテンツ　左側画像+右テキスト
------------------------------------------*/

.mate {
    margin: 0 auto 60px;
    padding: 0 0 20px;
    background: #FFF;
    border-radius: 10px;
    border: 3px solid #ccc3ba;
}
.content {
    overflow: hidden;
    clear: right;
    margin: 0px 3%;
    text-align: justify;
    text-justify: inter-ideograph;
}
.content img.img4 {
    margin-right: 30px;
    max-width: 40%;
    height: auto;
    margin-top: 30px;
    margin-bottom: 10px;
}
.content img.img4 {
    float: left;
}
.content p.con2 {
    margin-top: 25px;
    font-size: 16px;
    line-height: 1.8em;
}

/*------------------------------------------
	よくあるご質問
------------------------------------------*/

ul.caution-list1 {
    margin: 15px 20px 40px;
    list-style-position: inside;
    list-style-type: disc;
    font-size: 14px;
}
ul.caution-list1 li, ul.caution-list2 li, ol li {
    padding-bottom: 12px;
}


/*
#################################
 
ウィンドウ幅が0〜600pxの場合に適用するCSS
 
#################################
*/
@media screen and ( max-width:600px )
{

.toptxt{
	margin-left: 10px;
	margin-top: 25px;
	position: absolute;
	font-size: 18px;
	font-family: YuMincho, "Yu Mincho", "Hiragino Mincho ProN", "serif";
	line-height: 1.5em;
	font-weight: bold;
	background-color: white;
}
	
	
/*------------------------------------------
	トップページ以外のヘッダ部分や見出し
------------------------------------------*/

#titleArea h2{
    width: 100%;
	margin-bottom:20px;
    font-size: 16px;
    padding: 12px 5px 7px;
    font-weight: bold;
    text-align: center;
    box-sizing: border-box;
}

.content h4 {
    padding: 8px 6px 3px;
    font-size: 14px;
}

/*------------------------------------------
	内容
------------------------------------------*/

#wrap{
	width:100%;
}
	
h1 {
    width: 100%;
}
img{
	max-width: 100% ;		/* 横幅の90% */
	height: auto ;			/* 縦幅を自動調整 */
}

#headerLogo img{
	    max-width: 65%;
		margin-top:10px;
}

#headerLinks p.title{
	width:100%;
}

#headerTop {
    width: 100%;
　　max-height: 350px;
    margin-bottom: 15px;
}

#header {
    margin: 0 auto;
    width: 100%;
}

#headerLogo {
	top:auto; /* position:relative;打ち消し */
}
#headerLinks {
    top: 60px;
	margin:0;
}

#topimg{
	top: 20px;
    position: relative;
	margin-top: 20px;
}
	

#headerLinks ul{
margin: 0;
width: 100%;
}

#headerLinks ul li{
    max-width:300px;
}

#headerLinks ul li img{
	width:100%;
}

#headerLinks li.tell {
	float:left;
	width:50%;
	margin:0;

}
#headerLinks li.form {
	float:right;
	width:50%;
	margin:0;
}

#contents{
	width:100%;
}

#main{
	width: auto ;
	padding: 0 ;		/* 余白 */
	border: none ;		/* 枠線 */
	float: none ;		/* floatを無効する */
}

/*トップページ以外のヘッダーにつけています*/
#main2{
	width: auto ;
	padding: 0 ;		/* 余白 */
	border: none ;		/* 枠線 */
	float: none ;		/* floatを無効する */
}


.hTop2{
	height:200px !important;
}

.hLinks2{
	top:70px !important;
}
/*ここまで*/



#side{
	width: auto ;
	float: none ;		/* floatを無効する */
}

#nav{
		display: none ;		/* 非表示にする */
}
#footwrap{
	width:100%;
	padding: 15px;
}
#footer .floatRight {
    width: 100%;
	text-align:center;
}
#footer{
	width:100%;
}

button{display:block;}  /* 表示にする */
#toggleMenu{display:block; }  /* 表示にする */

/*トグルボタン*/
button{
	font-size: 28px;
	border:none;
	background-color:transparent;
	color:#999;
	padding:6px;
    overflow: hidden;
    position: absolute;
    right: 3px;
    top: 30px;
    line-height: 1.9em;
	cursor:pointer;
}
button:focus{outline:none}

.menu{
	justify-selef:stretch;
	max-height:0;
	background-color:#FFF;
	overflow:hidden;

		transition: max-height 0.4s ease-out
		

}
/*スマフォメニューの余白を出したいとき
.inmenu{
	padding: 20px 20px 80px;
}*/

.menu ul{
	height:100%;
}
.menu li {
border-top: 1px solid #FFF;
	list-style:none;
	padding:15px;
    font-size: 16px;
	background: #664b2f;
}

.menu li a{
　　padding: 10px;
	color:#FFF;
　　display: block;
	font-size:16px;
	font-weight:bold;
	text-decoration:none;
}
.menu li a:visited {
	color:#FFF;
text-decoration:underline;
}

/*マウスオーバーで色を変えたいとき
.menu li a:hover {background-color:#CCC;
}*/


#toggleMenu{
top: 0px;
    -webkit-highlight: 0;
    right: 0;
    position: fixed;
    z-index: 10;
    min-width: 320px;
}
#spnav{
}
.close-menu{
	position: absolute;
    top: 0px;
    left: -55px;
width: 55px;
    height: 55px;
background-color: #fff;
background:url(../img/close.png) no-repeat center;
    background-color: #fff;
    background-size: 27px 32px;
    text-indent: 101%;
    white-space: nowrap;
	overflow: hidden;
	-webkit-box-align: center;
    align-items: center;
	-webkit-box-pack: center;
	justify-content: center;
	visibility: visible;
    opacity: 1;
	transition: opacity .3s cubic-bezier(.25,.46,.45,.94),visibility .3s;
	display: block;
}

#titleArea h2 {
    margin-top: -20px;
}


/*------------------------------------------
	スマホコンテンツ　左側画像+右テキスト
------------------------------------------*/

.mate {
    border: 1px solid #ccc3ba;
    padding: 0 0 10px;
    margin: 0 auto 40px;
	width: 96%;
}
.content {
    overflow: hidden;
    clear: left;
    margin: 0px 3%;
}
.content img.img4 {
    display: block;
    margin: 0 auto;
    float: none;
    max-width: 100%;
    padding-top: 20px;
}



/*------------------------------------------
	テーブル　スマホでスクロール
------------------------------------------*/

.scroll-table {
  overflow: auto;
  white-space: nowrap;  
}

}


/*
#################################
 
ウィンドウ幅が0〜400pxの場合に適用するCSS
 
#################################
*/
@media screen and ( max-width:450px )
{

#topimg {
    margin-top: -5px;	
}

#titleArea h2 {
    margin-top: -40px;
}



}
