/* CSS Document */

@charset "utf-8";

/*============================================================================

全デバイス共通のスタイルとPC向けレイアウトの指定

============================================================================*/



/*================================
body
================================*/

body {
  background-color:#FFF;
  font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  color:#333;
  line-height:1.2em;
  background:url(../images/bg_wrapper.png) center top repeat;
}

#wrapper {
	width:100%;
}

div.inner {
	width:100%;
	max-width:960px;
	margin:0 auto;
}

.bold {
	font-weight:bold;
}

/*================================
ヘッダーのスタイル
================================*/

#header {
	width:100%;
	position:relative;
}

#header h1 {
	width:100%;
	max-width:960px;
	margin:0 auto;
}

#header h1 span {
	display:block;
	width:20.8%;
	max-width:200px;
	min-height:300px;
	background:url(../images/logo_L.png) 0 0 no-repeat;
	background-size:100% auto;
	text-indent:-9999px;
	position:absolute;
	top:0;
}

#mainvisual {
	width:100%;
	margin:0 auto;
	text-align:center;
}

#mainvisual img {
	width:100%;
	margin:0 auto;
}


nav {
	background-color:rgba(255,255,255,0.9);
	width:100%;
	height:50px;
	/* box-shadow */
	box-shadow:0px 7px 8px -7px #333333;
	-moz-box-shadow:0px 7px 8px -7px #333333;
	-webkit-box-shadow:0px 7px 8px -7px #333333;
}

#btn_logo, #btn_menu {
	display:none;
}

.fixed {
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 10000;
}

nav #nav_inner {
	width:100%;
	max-width:960px;
	margin:0 auto;
}

#header nav ul li {
	float:left;
	border-right:1px dotted #333;
}

#header nav ul li:last-child{
	border:none;
}

#header nav ul #nav_about {
	width:15.6%;
}

#header nav ul #nav_about a {
	margin:0 auto;
	display:block;
	background:url(../images/nav_about.png) center top no-repeat;
	width:100%;
	height:50px;
	text-indent:-9999px;
}

#header nav ul #nav_about a:hover {
	background:url(../images/nav_about.png) center bottom no-repeat;
	
}

#header nav ul #nav_butsudan {
	width:14.3%;
}

#header nav ul #nav_butsudan a {
	margin:0 auto;
	display:block;
	background:url(../images/nav_butsudan.png) center top no-repeat;
	width:100%;
	height:50px;
	text-indent:-9999px;
}

#header nav ul #nav_butsudan a:hover {
	background:url(../images/nav_butsudan.png) center bottom no-repeat;
}

#header nav ul #nav_ihai {
	width:14.3%;
}

#header nav ul #nav_ihai a {
	margin:0 auto;
	display:block;
	background:url(../images/nav_ihai.png) center top no-repeat;
	width:100%;
	height:50px;
	text-indent:-9999px;
}

#header nav ul #nav_ihai a:hover {
	background:url(../images/nav_ihai.png) center bottom no-repeat;
}

#header nav ul #nav_grave {
	width:6.9%;
}

#header nav ul #nav_grave a {
	margin:0 auto;
	display:block;
	background:url(../images/nav_grave.png) center top no-repeat;
	width:100%;
	height:50px;
	text-indent:-9999px;
}

#header nav ul #nav_grave a:hover {
	background:url(../images/nav_grave.png) center bottom no-repeat;
}

#header nav ul #nav_chiisanaohaka {
	width:12.4%;
}

#header nav ul #nav_chiisanaohaka a {
	margin:0 auto;
	display:block;
	background:url(../images/nav_chiisanaohaka.png) center top no-repeat;
	width:100%;
	height:50px;
	text-indent:-9999px;
}

#header nav ul #nav_chiisanaohaka a:hover {
	background:url(../images/nav_chiisanaohaka.png) center bottom no-repeat;
}

#header nav ul #nav_tsuya-sogi {
	width:12.4%;
}

#header nav ul #nav_tsuya-sogi a {
	margin:0 auto;
	display:block;
	background:url(../images/nav_tsuya-sogi.png) center top no-repeat;
	width:100%;
	height:50px;
	text-indent:-9999px;
}

#header nav ul #nav_tsuya-sogi a:hover {
	background:url(../images/nav_tsuya-sogi.png) center bottom no-repeat;
}

#header nav ul #nav_access {
	width:10.5%;
}

#header nav ul #nav_access a {
	margin:0 auto;
	display:block; 
	background:url(../images/nav_access.png) center top no-repeat;
	width:100%;
	height:50px;
	text-indent:-9999px;
}

#header nav ul #nav_access a:hover {
	background:url(../images/nav_access.png) center bottom no-repeat;
}

#header nav ul #nav_gallery {
	width:12.8%;
}

#header nav ul #nav_gallery a {
	margin:0 auto;
	display:block;
	background:url(../images/nav_gallery.png) center top no-repeat;
	width:100%;
	height:50px;
	text-indent:-9999px;
}

#header nav ul #nav_gallery a:hover {
	background:url(../images/nav_gallery.png) center bottom no-repeat;
}

#header nav ul li a {
  overflow: hidden;
  transition: background 0.3s ease-out;
  -webkit-transition: background 0.3s ease-out;
  position: relative;
 }

/*================================
コンテンツ
================================*/

/*-------　クラス設定　--------*/
h3.price {
	font-size:larger;
	color:#990000;

}

p.price_text {
	margin-bottom:30px;
}


#contents {
	width:100%;
	max-width:960px;
	margin:0 auto;
}

#contents section {
	width:90%;
	margin:0 auto;
	background-color:#fff;
	margin-top:30px;
	padding:30px;
}

#contents section h2 {
	width:100%;
	max-width:900px;
	margin:0 auto;
	background:url(../images/bg_h2.jpg) 0 0 repeat-x;
}

#contents .contents_inner {
	width:95%;
	max-width:860px;
	margin:0 auto;
	padding-bottom:30px;
}

#contents .img01 {
	float:left;
	width:47.6%;
	max-width:410px;
}

#contents .img02 {
	float:right;
	width:47.6%;
	max-width:410px;
}

#contents .img01 img, #contents .img02 img {
	width:100%;
	height:auto;
}

#contents .contents_text {
	width:100%;
	max-width:860px;
	margin:20px auto;
}

#contents .telnum {
	font-size:larger;
	color:#990000;
	font-weight:bold;
	text-decoration:underline;
	margin:20px auto;
}

/*安養寺について*/
#about_block .about_inner {
	width:95%;
	max-width:820px;
	margin:20px auto;
}

#about_block .about_inner .img01, #about_block .about_inner .img02 {
	width:48.7%;
	max-width:400px;
}

#about span {
	display:block;
	background:url(../images/ttl_about.png) 10px -5px no-repeat;
	width:133px;
	height:40px;
	text-indent:-9999px;
}

#about_block h3 {
	width:100%;
	max-width:860px;
	margin:30px auto 0 auto;
	border-left:5px #339900 solid;
	border-bottom:1px #339900 solid;
}

#about_block h3 span {
	padding:5px 0 3px 7px;
}

/*仏壇型納骨壇*/
#butsudan span {
	display:block;
	background:url(../images/ttl_butsudan.png) 10px -5px no-repeat;
	width:214px;
	height:40px;
	text-indent:-9999px;
}

#butsudan_block p.copy img {
	width:100%;
	max-width:664px;
	margin:20px 0;
}

/*仏壇型納骨壇*/
#ihai span {
	display:block;
	background:url(../images/ttl_ihai.png) 10px -5px no-repeat;
	width:214px;
	height:40px;
	text-indent:-9999px;
}

#ihai_block p.copy img {
	width:100%;
	max-width:664px;
	margin:20px 0;
}


/*墓地*/
#grave span {
	display:block;
	background:url(../images/ttl_grave.png) 10px -5px no-repeat;
	width:45px;
	height:40px;
	text-indent:-9999px;
}

#grave_block p.copy img {
	width:100%;
	max-width:568px;
	margin:20px 0;
}


/*墓地*/
#chiisanaohaka span {
	display:block;
	background:url(../images/ttl_chiisanaohaka.png) 10px -5px no-repeat;
	width:195px;
	height:40px;
	text-indent:-9999px;
}

#chiisanaohaka_block p.copy img {
	width:100%;
	max-width:568px;
	margin:20px 0;
}


/*通夜・葬儀*/
#tsuya-sogi span {
	display:block;
	background:url(../images/ttl_tsuya-sogi.png) 10px -5px no-repeat;
	width:99px;
	height:40px;
	text-indent:-9999px;
}

#tsuya-sogi_block p.copy img {
	width:100%;
	max-width:626px;
	margin:20px 0;
}



/*交通手段*/
#access span {
	display:block;
	background:url(../images/ttl_access.png) 10px -5px no-repeat;
	width:81px;
	height:40px;
	text-indent:-9999px;
}

#access_block .way_left {
	float:left;
	width:46.5%;
	max-width:400px;
	background:url(../images/bg_way.jpg) 0 0 repeat;
	padding:20px 0;
	margin-top:20px;
}

#access_block .way_right {
	float:right;
	width:46.5%;
	max-width:400px;
	background:url(../images/bg_way.jpg) 0 0 repeat;
	padding:20px 0;
	margin-top:20px;
}

#access_block .way_left h4, #access_block .way_right h4  {
	font-size:larger;
	margin-top:20px;
}

#access_block .way_left .way_inner, #access_block .way_right .way_inner {
	width:84.7%;
	max-width:340px;
	margin:0 auto;
}

#access_block .way_left .way_inner .way_detail, #access_block .way_right .way_inner .way_detail {
	border-bottom:1px dashed #333;
}

#access_block .way_left .way_inner .way_detail_last, #access_block .way_right .way_inner .way_detail_last {
	border-bottom:none;
}

#access_block .way_left .way_inner .way_detail p, #access_block .way_right .way_inner .way_detail p {
	margin:20px 0;
}

#access_block .way_left .way_inner .way_detail p img, #access_block .way_right .way_inner .way_detail p img {
	width:100%;
}

#access_block .way_left .way_inner .way_detail_last p, #access_block .way_right .way_inner .way_detail_last p {
	margin:20px 0 50px 0;
}

#access_block .way_left .way_inner .way_detail_last p img, #access_block .way_right .way_inner .way_detail_last p img {
	width:100%;
}

#address {
	padding:20px;
	background:url(../images/jimon_gray.png) 0 0 no-repeat;
	background-size:contain;
}

#address p {
	margin-bottom:10px;
	line-height:1.5em;
}

#address p.bold {
	font-size:x-large;
	margin-bottom:20px;
}

/*=== google map 設定 ===*/
.ggmap {
  position: relative;
  padding-bottom: 56.25%;
  padding-top: 30px;
  height: 0;
  overflow: hidden;
  margin:20px auto;
}
 
.ggmap iframe, .ggmap object, .ggmap embed {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}


/*ギャラリー*/
#gallery span {
	display:block;
	background:url(../images/ttl_gallery.png) 10px -5px no-repeat;
	width:97px;
	height:40px;
	text-indent:-9999px;
}

/*=== slide 設定 ===*/
.slide {
	position:relative;
	margin: 20px auto;
	width:100%;
	max-width:860px;
	font-size:0;
}

.slide img {
	max-width:100%;
}

/*写真の配置*/
.slide > .container {
	position:relative;
	overflow:hidden;
	margin:0;
	padding:0;
	list-style:none;
}

.slide > .container > li {
	position:absolute;
	z-index:0;
	top:0;
	left:0;
	opacity:0;
	transition:opacity 1s linear;
}

.slide > .container > li.current {
	position:relative;
	z-index:1;
	opacity:1;
}


.slide a.prev, .slide a.next {
	position:absolute;
	display:block;
	top:45%;
	width:40px;
	heigth:40px;
	text-indent:-9999px;
	z-index:10;
}

.slide a.prev {
	background:url(../images/arrow-left1.png) 50% 50% no-repeat;
	left:0;
}

.slide a.prev:hover {
	background:url(../images/arrow-left2.png) 50% 50% no-repeat;
}

.slide a.prev:active {
	background:url(../images/arrow-left3.png) 50% 50% no-repeat;
}

.slide a.next {
	background:url(../images/arrow-right1.png) 50% 50% no-repeat;
	right:0;
}

.slide a.next:hover {
	background:url(../images/arrow-right2.png) 50% 50% no-repeat;
}

.slide a.next:active {
	background:url(../images/arrow-right3.png) 50% 50% no-repeat;
}






/*================================
ページトップのスタイル
================================*/
#page-top {
    position: fixed;
    bottom: 20px;
    right: 20px;
    font-size: 77%;
}
#page-top a {
    background: #666;
    text-decoration: none;
    color: #fff;
    width: 100px;
    padding: 30px 0;
    text-align: center;
    display: block;
    border-radius: 5px;
}
#page-top a:hover {
    text-decoration: none;
    background: #999;
}

/*================================
フッターのスタイル
================================*/

footer {
	width:100%;
	background:url(../images/bg_footer.jpg) 0 0 repeat-x;
	min-height:300px;
	font-size:x-small;
	color:#666;
	margin-top:50px;
}

footer .inner {
	padding-top:30px;
	width:90%;
	max-width:900px;
	margin:0 auto;
}

#footer_left {
	float:left;
	width:20%;
	padding-right:5%;
}

#footer_center {
	float:left;
	width:50%;
}

#footer_right {
	float:left;
	width:20%;
	padding-left:5%;
}



/*============================================================================

大型タブレット向けレイアウト指定(768px～960px)

============================================================================*/

@media only screen and (max-width:960px) {








} 


/*============================================================================

スマホ向けレイアウト指定(768px～960px)

============================================================================*/

@media only screen and (max-width:768px) {
#header h1 {
	display:none;
}

nav {
	display:none;
}

#sp_nav {
	background-color:rgba(255,255,255,0.85);
	width:100%;
	max-width:768px;
	position:fixed;
	top:0;
	z-index:999;
}

#header #btn_logo {
	display:block;
	background:url(../images/logo_S.png) 0 0 no-repeat;
	width:110px;
	height:60px;
	text-indent:-9999px;
	float:left;
}

#header #btn_menu {
	display:block;
	background:url(../images/btn_menu.png) 0 0 no-repeat;
	width:100px;
	height:60px;
	text-indent:-9999px;
	float:right;
}

#mainvisual {
	margin-top:60px;
}

.open {
	display:block;
	width:100%;
	max-width:768px;
	margin-top:60px;
	position:fixed;
	top:0;
	background:none;
}

.open #nav_inner #gnavi li {
	border-bottom:1px dotted #333;
	background-color:rgba(255,255,255,0.85);
}

.open #nav_inner #gnavi li:nth-child(odd){
	float:left;
	width:49.5%;
	border-right:1px dotted #333;
}

.open #nav_inner #gnavi li:nth-child(even) {
	float:left;
	width:50%;
	border-right:none;
}


.open #nav_inner #gnavi li a {
	display:block;
	width:100%;
}


#contents section {
	padding:0;
}

#contents .img01 {
	float:none;
	width:100%;
	max-width:768px;
	margin-bottom:20px;
}

#contents .img02 {
	float:none;
	width:100%;
	max-width:768px;
}

#contents .img02 img {
	width:100%;
	max-width:768px;
}

#about_block .about_inner .img01, #about_block .about_inner .img02 {
	float:none;
	width:100%;
	max-width:768px;
}

#about_block .about_inner .img01 img, #about_block .about_inner .img02 img {
	width:100%;
	max-width:768px;
}


#access_block .way_left {
	float:none;
	width:100%;
	max-width:768px;
	background:url(../images/bg_way.jpg) 0 0 repeat;
	padding:20px 0;
	margin-top:20px;
}

#access_block .way_right {
	float:none;
	width:100%;
	max-width:768px;
	background:url(../images/bg_way.jpg) 0 0 repeat;
	padding:20px 0;
	margin-top:20px;
}

#access_block .way_left .way_inner, #access_block .way_right .way_inner {
	width:84.7%;
	max-width:768px;
	margin:0 auto;
}



/*=== slide 設定 ===*/
.slide a.prev, .slide a.next {
	top:40%;
}




#page-top {
    position: fixed;
    bottom: 20px;
    right: 20px;
    font-size: 77%;
}
#page-top a {
    background: #666;
    text-decoration: none;
    color: #fff;
    width: 80px;
    padding: 10px 0;
    text-align: center;
    display: block;
    border-radius: 5px;
}
#page-top a:hover {
    text-decoration: none;
    background: #999;
}




}