@charset "UTF-8";
/* CSS Document */

/* ----------------------------------------
	基本設定
---------------------------------------- */

*{
	margin:0;
	padding:0;
	}

html{
	/*height:100%;*/
	}
body{
	/*height:100%;*/
	margin:0;
	padding:0;
	font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	font-size:12px;
	color: #000;
}

img{
	border:0;
	vertical-align:bottom; /* Firefox用 */
	}

p{
	margin:0;
	padding:0;
	}

ul{
	list-style:none;
	margin:0;
	padding:0;
	}

h1,h2,h3,h4,h5,h6{
	font-weight:normal;
	}


/* link */



a:link {
	color: #fff;
	text-decoration: none;
}

a:visited {
	opacity:0.7;
	filter: alpha(opacity=70);
}

a:hover {
	opacity:0.7;
	filter: alpha(opacity=70);
}


a:hover img{
	opacity:0.7;
	filter: alpha(opacity=70);
}

/*------共通事項--------*/


/*中央寄せの時に使う*/
.container{
	width: 1000px;
	margin:0 auto;
}

/*-------nav--------*/

nav{
	width: 100%;
	height: 75px;
	background-color: #8cb9be;
}

.nav_innner{
	width: 1000px;
	padding: 15px 2px 0 2px;
	margin: 0 auto;
}
ul.nav_innner li{
	float: left;
}

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


#head_wrap{
	width: 100%;
	height: 185px;
	background:url(../images/top/head_back.jpg) repeat-x;
}

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

header h1{
	position:absolute;
	top:15px;
	left: 5px;
	font-size: 10px;
}

header h2{
	width: 230px;
	height:61px;
	background:url(../images/top/head_tel.png);
	position: absolute;
	left:5px;
	top:114px;
	text-align: left;
    /*リンク要素に画像置換を行った場合、
    クリックするとアウトラインが9999px分表示されるブラウザが一部あります。
    そのための解決策。*/
    overflow: hidden;
    /*ファークメソッド*/
    text-indent: -9999px;
}

header h3 a{
	display:block;
	height:100%;
	text-indent:-9999px;
	background:url(../images/top/head_logo.png);
}

header h3 a:focus{
/**/
	overflow: hidden;
/**/
}

header h3 a:hover{
	background:none !important;
}

header h3{
	width: 320px;
	height:101px;
	background:url(../images/top/head_logo.png);
	position: absolute;
	left:336px;
	top:47px;
	text-align: left;
    /*リンク要素に画像置換を行った場合、
    クリックするとアウトラインが9999px分表示されるブラウザが一部あります。
    そのための解決策。*/
    overflow: hidden;
    /*ファークメソッド*/
    text-indent: -9999px;
}


.h_link{
	position: absolute;
	left:763px;
	top:15px;
}

.sns_link{
	position: absolute;
	left:921px;
	top:137px;
}

ul.sns_link li{
	float: left;
}



.slider_wrap1{
	background: url(../images/top/renga_back.jpg) repeat-x left top;
}


/*中央寄せの時に使う*/
.container{
	width: 1000px;
	margin:0 auto;
}



/*-------contents--------*/

#cont_box{
	width: 100%;
	background-color:#f1efdf;
	padding-bottom: 80px;
}

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

ul.top_con{
	margin: 0 0 0 20px;
	padding: 30px 0 0 0;
}


ul.top_con li{
	float:left;
}

ul.top_con li h3{
	margin: 0 0 23px 0;
}

.renga_bar{
	background:url(../images/top/renga_back.jpg);
	width: 100%;
	height: 60px;
	/*画像置換のコード*/
	text-indent: 100%;
    white-space: nowrap;
    overflow: hidden;
}

#info_box{
	width: 100%
}

ul.infoarea{
	width: 960px;
	margin: 30px auto 55px auto;
}

ul.infoarea li{
	float: left;
}

.bloginfo{
	width: 465px;
	margin-right: 30px;
}

.infoarea h2{
	margin-bottom: 36px;
}

.infoarea h3{
	border: 1px #999 dotted;
	padding: 5px;
}

.fbinfo{
	width: 465px;
}


#contact_box{
	width: 100%;
	height: 190px;
	padding: 41px 0;
	background:url(../images/top/renga_back.jpg);
}

ul.contact_area{
	width: 960px;
	margin: 0 auto;
}

ul.contact_area li{
	float:left;
}


.google-maps {
position: relative;
padding-bottom: 25%; // これが縦横比
height: 0;
overflow: hidden;
}
.google-maps iframe {
position: absolute;
top: 0;
left: 0;
width: 100% !important;
height: 100% !important;
}




/*-------footer--------*/


#foot_box{
    width: 100%;
	height: 300px;
	background-color: #8cb9be;
}

footer{
	width: 472px;
	margin: 0 auto;
	position: relative;
}

footer h2{
	width: 372px;
	height:115px;
	background:url(../images/top/foot_logo.png);
	margin: 0 auto;
	position: absolute;
	left:50px;
	top:25px;
	/*画像置換のコード*/
	text-indent: 100%;
    white-space: nowrap;
    overflow: hidden;
}

footer h3{
	font-size: 12px;
	text-align: center;
	color: #fff;
	padding-top: 160px;
	}

#footend{
	background:url(../images/top/renga_back.jpg);
	width: 100%;
	height: 55px;
}
#footend h2{
	text-align: center;
    padding-top: 20px;
	color: #fff;
	font-size: 10px;
}


/* ----------------------------------------
	topへ戻る
---------------------------------------- */

#page-top {
	display:none;
    position: fixed;
    bottom: 174px;
    right: 0px;
}




/* ----------------------------------------
	共有
---------------------------------------- */

/* ---リセット---- */	

html,body,h1,h2,h3,h4,h5,h6,p,div,ul,ol,li,label,dl,dt,dd {
margin:0;
padding:0;
list-style:none;
}

/* ---ブロック　インライン---- */	

.block {     /* ブロック要素にする */
    display:block
    }
.inline {    /* インライン要素にする */
    display:inline
    }

.clear{
	clear:both;
}	

/* ---フロート--- */	
	
.f_l{
	float:left;
	}	

.f_r{
	float:right;
	}	
	
.liststyle{
	list-style:none;
	}	
	
/* --- Clearfix --- */	
.clearfix:after {
    height:0.1px;
    content: "";
    clear: both;
    display: block;
    visibility: hidden;
    font-size:0.1em;
    line-height:0;
    }

.clearfix {
    *zoom:1;
    }
	
.clearfix{
  *overflow:hidden;
}	

 	
	
/* ---text align---- */	

.tx_center{
	text-align:center;
	}
	
.tx_left{
	text-align:left;
	}	
	
.tx_right{
	text-align:right;
	}	
	
.mdl{
	vertical-align:middle;
	}	
	
.tx_u{
	text-decoration:underline;
		}	
	
/* ---color	---- */

.red{
	color:#CC0033;
	}	
	
.pink{
	color:#cc6666;
	}	
	


/* ---font---- */

.font_80{
	font-size:80%;
	}

.font_90{
	font-size:90%;
	}

.font_110{
	font-size:110%;
	}

.fb{
	font-weight:bold;
	}

/* ---padding---- */

.mt5{
	margin-top: 5px;
}

.mt10{
	margin-top: 10px;
}
.mt15{
	margin-top: 15px;
}
.mt20{
	margin-top: 20px;
}
.mt25{
	margin-top: 25px;
}
.mt80{
	margin-top: 80px;
}


.mb5{
	margin-bottom: 5px;
}

.mb10{
	margin-bottom: 10px;
}
.mb15{
	margin-bottom: 15px;
}
.mb20{
	margin-bottom: 20px;
}

.mr5{
	margin-right: 5px;
}
.mr10{
	margin-right: 10px;
}
.mr15{
	margin-right: 15px;
}
.mr20{
	margin-right: 20px;
}

.mr25{
	margin-right: 25px;
}

.mr30{
	margin-right: 30px;
}

.ml5{
	margin-left: 5px;
}
.ml10{
	margin-left: 10px;
}
.ml15{
	margin-left: 15px;
}
.ml20{
	margin-left: 20px;
}


.p10_t{
	padding-top:10px;
	}
	
.p5_l{
	padding-left:5px;
	}	
	
p5_r{
	padding-right:5px;
	}	
	
.p7_l{
	padding-left:7px;
	}		
	
.p10_l{
	padding-left:10px;
	}	
	
.p15_t{
	padding-top:15px;
	}	

.p20_t{
	padding-top:20px;
	}	
	
.p_10t_5b{
	padding:10px 0 5px 0;
	}	


.p_10t_5l{
	padding:10px 0 0 5px;
	}

.p5_b{
	padding-bottom:5px;
	}	
	
.p10_b{
	padding-bottom:10px;
	}	
	
.p15_b{
	padding-bottom:15px;
	}	
	
.p20_b{
	padding-bottom:20px;
	}	
	
.p5_t_b{
	padding:5px 0;
	}
	
.p10_t_b{
	padding:10px 0;
}

.p30_l{
	padding-left:30px;
	}
	
.p30_t{
	padding-top:30px;
	}
	
	
.p25_l_r{
	padding:0 25px;
	}
	
	
.p25_l{
	padding-left:25px;
	}
	
		
.p34_r{
	padding-right:34px;
	}			
	
.p30_r{
	padding-right:30px;
	}	
	
.m30_l{
	margin-left:30px;
	}
	
.m25_l_r{
	margin:0 25px;
	}	
	
.m30_r{
	margin-right:30px;
	}
.m20_l{
	margin-left:20px;
	}
.m25_l{
	margin-left:25px;
	}	
	
.m40_l{
	margin-left:40px;
}

.m100_l{
	margin-left:104px;
}

