﻿@charset "utf-8";
/*---------------------------------------------------------------------------*/


	
/*------------------------------------------------------------------------------------------------------*/
/* 2019/xx/xx @xxx                                                                                      */
/*                                                                                                      */
/*                                                                                                      */
/*                                                                                                      */
/*                                                                                                      */
/*                                                                                                      */
/* 2020/10/14 @011 「*」の「line-height」を復活。全ての要素に適用するCSSセレクタ「*（アスタリスク）」を復活    */
/* 2020/09/21 @010 【未実施】「line-height」の見直し。全ての要素に適用するCSSセレクタ「*（アスタリスク）」を削除  */
/* 2020/09/15 @009 #Headerを#Header1から#Header7に変更し、サーバーでヘッダーの色を分けた。              */
/* 2020/01/26 @008 Table用に、TableClass1とPictureClass1を作成。                                        */
/* 2019/07/17 @007 全体のline-heightを大きくした。(140%->160%)                                          */
/* 2019/06/25 @006 ボタンクラスBClass1,BClass2を作成。                                                  */
/* 2019/06/20 @005 Tableの定義は#Mainだけにした。                                                       */
/* 2019/06/19 @004 H1,H2の高さを高くした。H3(未使用)をH2に合わせた。                                    */
/* 2019/06/19 @003 Tableを左寄せにした。「text-align: left」                                            */
/* 2019/06/18 @002 コメントを追加し、バージョンを管理するようにした。                                   */
/* 2019/06/18 @001 新規作成                                                                             */
/*------------------------------------------------------------------------------------------------------*/

/*---------------------------------------------------------------------------*/
/*【PC用とスマホ用の共通の設定】サイト全体への適用
/*---------------------------------------------------------------------------*/


/*市町村ファイルの寺院一覧表の住所などのフォントサイズを指定する。
---------------------------------------------------------------------------*/
.CityListFont {
	font-size: 16px;
}



/*【line-heightは重要】全ての要素に適用するCSSセレクタ「*（アスタリスク）」
---------------------------------------------------------------------------*/
* {
    line-height: 160%;
    line-height: 120%; /* Add @011 */
}


/*全体のページの外枠 
---------------------------------------------------------------------------*/
#Page {

	width: 800px; 


	text-align: left;
	/* background-color:#FF0000;*/
    line-height: 130%; /* Add @007 */
    line-height: 120%; /* Add @011 */

	
	border-style:solid;
	
	border-color:green;
	border-width:1px;
/* */

}

/*ヘッダー文字(Header)(PCとスマホ共通)
---------------------------------------------------------------------------*/
#Header1,#Header2,#Header3,#Header4,#Header5,#Header6,#Header7{

	background-color:#FF8; /* 標準色(黄色)*/
	background-color:#FF8; /* 【変更分】*/

	color: #000;	/*メニューの文字色*/

	/*padding 上、右、下、左*/
	padding: 4px 8px 4px 8px;
	padding: 0px 0px 0px 5px;

	border-style:solid;
	border-left-width:2px;
	border-right-width:2px;
	border-top-width:2px;
	border-bottom-width:1px;
	border-color:green;

	font-weight: normal;	/*太さを通常に戻す。太字がいいならfont-weight: bold*/
	max-width: 100%; /*Add Smart*/

	line-height:110%;
	font-size: 18px;

}

/* 【01.saikouji.jp】 */
#Header1{
background-color:#FF8;/* Saikouji HomePage */
background-color:#FF6;
}
/* 【02.西光寺.jp】 */
#Header2{
background-color:#CFC;
}
/* 【03.saikoji.com】 */
#Header3{
background-color:#FDA;
}
/* 【04.bukkyou.com/Saikouji】 */
#Header4{
background-color:#BEE;/* Saikouji HomePage */
background-color:#CEE;
}
/* 【05.bukyou.com/Saikouji】 */
#Header5{
background-color:#EDF;
}
/* 【06.tech-jp.com/Saikouji】 */
#Header6{
background-color:#FA4;/* Saikouji HomePage */
background-color:#FB6;
}
/* 【07.jpinf.com/Saikouji】 */
#Header7{
background-color:#FAA;
}


/*Mainの文書
---------------------------------------------------------------------------*/
#Main {

	/*padding 上、右、下、左*/
	padding: 0px 10px 0px 10px;

	/*width:780px;*/
	max-width: 100%; /*Add Smart*/

	font-size: 16px;

	line-height:150%;

	/*float:left;*/
	/*height:auto;*/
	white-space:normal;

	white-space:normal;

	border-style:solid;
	border-left-width:2px;
	border-right-width:2px;
	border-top-width:2px;
	border-bottom-width:1px;
	border-color:green;

	background-color:#FFFFDD;
	background-color:#FFC;

}



/*フッター
---------------------------------------------------------------------------*/
#Footer{
	/*padding 上、右、下、左*/
	padding: 1px 8px 1px 8px;

	color: #000;	/*メニューの文字色*/
	background-color:#AAFFAA;
	background-color:#8F8;

	border-style:solid;
	border-left-width:2px;
	border-right-width:2px;
	border-top-width:2px;
	border-bottom-width:1px;
	border-color:green;
	
	font-size: 16px;		/*文字サイズ*/
	font-weight: normal;	/*太さを通常に戻す。太字がいいならこの１行を外す。*/

	max-width: 100%; /*Add Smart*/

	line-height:140%;
	line-height:120%;

}

#FooterEach{
	/*padding 上、右、下、左*/
	padding: 1px 8px 1px 8px;

	color: #000;	/*メニューの文字色*/
	background-color:#EEFFCC;
	background-color:#FFE;

	border-style:solid;

	border-left-width:2px;

	border-right-width:2px;

	border-top-width:2px;
	border-bottom-width:1px;
	border-color:green;
	
	font-size: 14px;		/*文字サイズ*/
	font-weight: normal;	/*太さを通常に戻す。太字がいいならこの１行を外す。*/

	max-width: 100%; /*Add Smart*/

	line-height:160%;
}

/*---------------------------------------------------------------------------*/
/* h1-h6
/*---------------------------------------------------------------------------*/

h1 {
  position: relative;

  /*background: -webkit-linear-gradient(to right, rgb(255, 124, 111), #ffc994);*/
  /*background: linear-gradient(to right, rgb(255, 124, 111), #ffc994);*/
  background: -webkit-linear-gradient(to right, #004, #CCF);
  background: linear-gradient(to right, #004, #CCF);

  /* color: white;*/
  color: #FF0;

  font-size: 26px;
  font-weight: bold;

  border-left: 20px solid #F00;
  border-right: 30px double #FF0;
  border-radius: 6px;

  /*padding: 0.2em 0.5em;*/

  /*padding 上、右、下、左*/
  padding:10px 10px 10px 20px;
  line-height: 110%;

  box-shadow: 0 0 8px rgba(0, 0, 0, 0.56);
}


h2 {
  /*padding: .6em 1em;*/
  
  /*padding:3px 10px 3px 25px;*/
  /*padding 上、右、下、左*/
  padding:6px 5px 6px 15px;
  line-height: 110%;

  position: relative;
  width: 85%;

  /*background: #666;*/

  background: #000;

  /* background: -webkit-linear-gradient(top, #666 0%, #252525 100%); */
  /* background: linear-gradient(to bottom, #666 0%, #252525 100%); */

  background: -webkit-linear-gradient(top, #000 0%, #000 40%, #FFF 100%);
  background: linear-gradient(to bottom, #060 0%, #060 40%, #FFF 100%);

  /* border-top: 1px solid #888;*/
  /* border-bottom: 1px solid #888;*/

  border-top: 1px solid #000;
  border-bottom: 1px solid #000;

  border-right: 10px solid #f00;
  border-left: 30px double #f00;

  border-radius: 7px;

  /* color: #ddd; */
  color: #FF8;

  /*font-weight: 600;*/
  /*font-size: 1.25em;*/

}


h3 {
  position: relative;
  width: 75%;
  color: white;
  color: black;
  font-size: 18px;

  /*padding 上、右、下、左*/
  padding:10px 10px 10px 45px;
  line-height: 110%;

  background-color: #446689;
  background-color: #8F8;
  border-radius:1.5em;
  border-radius:0.8em;
}
 
h3::after {
  position: absolute;
  top: 50%;
  left:1em;
  transform:translateY(-50%);
  content: '';
  width: 16px;
  height:16px;
  background-color: white;
  background-color: #F00;
  border-radius:100%;
}



h4 {
  position: relative;
  width: 85%;

  font-size: 18px;

  /*padding 上、右、下、左*/
  /* padding: 1em 1.9em; */
  /* padding: 0.3em 0.5em; */
  padding:10px 10px 10px 25px;
  line-height: 110%;

  border: 1px solid #CCC;
  border-radius:15px;
  background: linear-gradient(#FFF 0%, #EEE 100%);
  box-shadow:inset -1px -1px 0 rgba(255,255,255,1);
}
 
h4 span::after {
  position: absolute;
  top: 50%;
  left:0.8em;
  transform:translateY(-50%);
  content: '';
  width: 8px;
  height:8px;
  border: solid 3px #446689;
  border-radius:100%;
}

/*---------------------------------------------------------------------------*/
/* TableClass1 Tableクラス(寺院の説明Tableなどで使用)                        */
/*---------------------------------------------------------------------------*/
.TableClass1 table{
  width: 90%;
  margin: 3px 3px 3px 3px;
  border-collapse: collapse;
  
}

.TableClass1 table tr{
  border-bottom: solid 2px white;
}

.TableClass1 table tr:last-child{
  border-bottom: none;
}

.TableClass1 table th{
  position: relative;
  text-align: left;
  width: 30%;
  width: 28%;

  background-color: #52c2d0;
  background-color: #88F;
  color: white;

  padding: 10px 0;
  padding: 4px 0;
  


}

.TableClass1 table th:after{
  display: block;
  content: "";
  width: 0px;
  height: 0px;
  position: absolute;
  top:calc(50% - 10px);
  right:-10px;
  border-left: 10px solid #52c2d0;
  border-left: 10px solid #88F;
  border-top: 10px solid transparent;
  border-bottom: 10px solid transparent;
}

.TableClass1 table td{
  text-align: left;
  width: 72%;
  width: 75%;
  
  background-color: #eee;
  background-color: #EEF;

  padding: 10px 0;
  padding: 4px 0;
  /*padding 上、右、下、左*/
  padding: 4px 4px 4px 15px;/* Add 19/06/19 */
}



/*---------------------------------------------------------------------------*/
/* BClass1ボタンクラス(H1の下のボタンで使用)                                 */
/*---------------------------------------------------------------------------*/
.BClass1 {
  border: 1px solid #15aeec;
  background-color: #49c0f0;
  background-color: #5ce;
  background-image: -webkit-linear-gradient(top, #49c0f0, #2cafe3);
  background-image: -webkit-linear-gradient(top, #5ce, #3be);
  background-image: linear-gradient(to bottom, #49c0f0, #2cafe3);
  background-image: linear-gradient(to bottom, #5ce, #3be);
  border-radius: 4px;
  color: #fff;
  line-height: 50px;
  line-height: 30px;
  -webkit-transition: none;
  transition: none;
  text-shadow: 0 1px 1px rgba(0, 0, 0, .3);
}

.BClass1:hover {
  border:1px solid #1090c3;
  border:1px solid #19c;
  color: #000;
  text-shadow: 0 1px 1px rgba(255, 255, 255, .5);
  background-color: #1ab0ec;
  background-color: #2be;
  background-image: -webkit-linear-gradient(top, #1ab0ec, #1a92c2);
  background-image: -webkit-linear-gradient(top, #2be, #29c);
  background-image: linear-gradient(to bottom, #1ab0ec, #1a92c2);
  background-image: linear-gradient(to bottom, #2be, #29c);
}

.BClass1:active,.BClass1_Push {
  background: #1a92c2;
  background: #29c;
  box-shadow: inset 0 3px 5px rgba(0, 0, 0, .2);
  color: #1679a1;
  color: #000;
  text-shadow: 0 1px 1px rgba(255, 255, 255, .5);
}


/*---------------------------------------------------------------------------*/
/* BClass2ボタンクラス(文書のリンクボタン)                                   */
/*     http://cssdeck.com/labs/push-the-buttons                              */
/*---------------------------------------------------------------------------*/
.BClass2 {
	position: relative;
	text-align:center;
	color:#FFF;
	text-decoration:none;
	line-height:27px;
	font-family:'Oswald', Helvetica;
	margin: 0px;
}
.BClass2:before {
	background:#f0f0f0;
	background-image:-webkit-gradient(linear, 0% 0%, 0% 100%, from(#D0D0D0), to(#f0f0f0));
	
	-webkit-border-radius:5px;
	-moz-border-radius:5px;
	border-radius:5px;
	
	-webkit-box-shadow:0 1px 2px rgba(0, 0, 0, .5) inset, 0 1px 0 #FFF; 
	-moz-box-shadow:0 1px 2px rgba(0, 0, 0, .5) inset, 0 1px 0 #FFF; 
	box-shadow:0 1px 2px rgba(0, 0, 0, .5) inset, 0 1px 0 #FFF;
	
	position: absolute;
	content: "";
	left: -6px; right: -6px;
	top: -6px; bottom: -10px;
	z-index: -1;
}

.BClass2:active {
	-webkit-box-shadow:0 1px 0 rgba(255, 255, 255, .5) inset, 0 -1px 0 rgba(255, 255, 255, .1) inset;
	top:5px;
}
.BClass2:active:before{
	top: -11px;
	bottom: -5px;
	content: "";
}

.BClass2 {
	text-shadow:-1px -1px 0 #2C7982;
	background: #3EACBA;
	border:1px solid #379AA4;

/*	background-image:-webkit-linear-gradient(top, #48C6D4, #3EACBA);*/
/*	background-image:-moz-linear-gradient(top, #48C6D4, #3EACBA);*/
/*	background-image:-ms-linear-gradient(top, #48C6D4, #3EACBA);*/
/*	background-image:-o-linear-gradient(top, #48C6D4, #3EACBA);*/
/*	background-image:linear-gradient(top, #48C6D4, #3EACBA);*/

	background-image:-webkit-linear-gradient(top, #5CD, #4BC);
	background-image:-ms-linear-gradient(top, #5CD, #4BC);
	background-image:linear-gradient(top, #5CD, #4BC);
	
	-webkit-border-radius:5px;
	-moz-border-radius:5px;
	border-radius:5px;
	
	-webkit-box-shadow:0 1px 0 rgba(255, 255, 255, .5) inset, 0 -1px 0 rgba(255, 255, 255, .1) inset, 0 4px 0 #338A94, 0 4px 2px rgba(0, 0, 0, .5);
	-moz-box-shadow:0 1px 0 rgba(255, 255, 255, .5) inset, 0 -1px 0 rgba(255, 255, 255, .1) inset, 0 4px 0 #338A94, 0 4px 2px rgba(0, 0, 0, .5);
	box-shadow:0 1px 0 rgba(255, 255, 255, .5) inset, 0 -1px 0 rgba(255, 255, 255, .1) inset, 0 4px 0 #338A94, 0 4px 2px rgba(0, 0, 0, .5);
}

.BClass2:hover {
	background: #48C6D4;

/*	background-image:-webkit-linear-gradient(top, #3EACBA, #48C6D4);*/
/*	background-image:-moz-linear-gradient(top, #3EACBA, #48C6D4);*/
/*	background-image:-ms-linear-gradient(top, #3EACBA, #48C6D4);*/
/*	background-image:-o-linear-gradient(top, #3EACBA, #48C6D4);*/
/*	background-image:linear-gradient(top, #3EACBA, #48C6D4);*/

	background-image:-webkit-linear-gradient(top, #026, #2AE);
	background-image:-ms-linear-gradient(top, #026, #2AE);
	background-image:linear-gradient(top, #026, #2AE);

}

/*----------------------------------------------------------------------------*/
/* BClass3は寺院一覧表の寺院選択(詳細)ボタン                                  */
/* https://www.nxworld.net/tips/css-only-button-design-and-hover-effects.html */
/*----------------------------------------------------------------------------*/

.BClass3 {
  position: relative;
  border-radius: 4px;
  color: #FFF;
  color: #00F;
  font-weight: bold;
  font-family : Arial,'ＭＳ Ｐゴシック',sans-serif ;
  /*padding 上、右、下、左*/
  padding: 2px 10px 2px 10px;

  /*  line-height: 50px;*/
  -webkit-box-sizing: content-box;
  -moz-box-sizing: content-box;
  box-sizing: content-box;
  -webkit-transition: none;
  transition: none;
  text-shadow: 0px 1px 0px #f56778;
}
.BClass3,
.BClass3:hover {
  border-bottom: 2px solid #cb5462;
  background-color: #f56778;
  background-image: -webkit-linear-gradient(top, #f997b0, #f56778);
  background-image: linear-gradient(to bottom, #f997b0, #f56778);
  box-shadow: inset 1px 1px 0 #fbc1d0;
}
.BClass3::before,
.BClass3::after {
  bottom: -1px;
  left: -1px;
/*  width: 200px;*/
/*  height: 50px;*/
  border: 1px solid #ee8090;
  border-bottom: 1px solid #b84d5a;
  border-radius: 4px;
  -webkit-box-sizing: content-box;
  -moz-box-sizing: content-box;
  box-sizing: content-box;
  -webkit-transition: none;
  transition: none;
}
.BClass3::before {
/*  height: 48px;*/
  bottom: -2px;
  border-top: 0;
  border-radius: 0 0 4px 4px;
  box-shadow: 0 1px 1px 0px #bfbfbf;
}
.BClass3:hover {
  background: #f56778;
  background-image: -webkit-linear-gradient(top, #f56778, #f997b0);
  background-image: linear-gradient(to bottom, #f56778, #f997b0);
  color: #913944;
  color: #000;
  /*text-shadow: 0px 1px 0px #f9a0ad;*/
}
.BClass3:active {
  bottom: -2px;
  margin-bottom: 2px;
  border: none;
  box-shadow: 1px 1px 0 #fff, inset 0 1px 1px rgba(0, 0, 0, .3);
}
.BClass3:active::before,
.BClass3:active::after {
  border: none;
  box-shadow: none;
}

.BClass3Big {
  font-size: 20px;
  /*padding 上、右、下、左*/
  padding: 2px 10px 2px 10px;
  /*margin: 10px 10px 10px 10px;*/
  line-height: 35px;

}


/*----------------------------------------------------------------------------*/
/* BClass4は市町村一覧表のソート順ボタン                                      */
/* https://css-tricks.com/examples/ButtonMaker/#                              */
/*----------------------------------------------------------------------------*/

.BClass4,.BClass4_Push {
   border-top: 1px solid #96d1f8;
   background: #97d9b6;
   background: -webkit-gradient(linear, left top, left bottom, from(#08400c), to(#97d9b6));
   background: -webkit-linear-gradient(top, #08400c, #97d9b6);
   background: -moz-linear-gradient(top, #08400c, #97d9b6);
   background: -ms-linear-gradient(top, #08400c, #97d9b6);
   background: -o-linear-gradient(top, #08400c, #97d9b6);
   padding: 5px 10px;
   -webkit-border-radius: 8px;
   -moz-border-radius: 8px;
   border-radius: 8px;
   -webkit-box-shadow: rgba(0,0,0,1) 0 1px 0;
   -moz-box-shadow: rgba(0,0,0,1) 0 1px 0;
   box-shadow: rgba(0,0,0,1) 0 1px 0;
   text-shadow: rgba(0,0,0,.4) 0 1px 0;
   color: white;
   font-size: 17px;
   font-family: Helvetica, Arial, Sans-Serif;
   text-decoration: none;
   vertical-align: middle;
   }
.BClass4:hover {
   border-top-color: #0e5732;
   background: #0e5732;
   color: #ccc;
   }
.BClass4:active,.BClass4_Push {
   border-top-color: #0c3d07;
   background: #0c3d07;
   background: #070;
   box-shadow: inset 0 3px 5px rgba(0, 0, 0, .2);
   color: #000;
   text-shadow: 0 1px 1px rgba(255, 255, 255, .5);
   }



/*---------------------------------------------------------------------------*/
/* PictureClass1 Tableクラス(本堂新築・鐘楼堂修復工事写真用)                 */
/*---------------------------------------------------------------------------*/
.PictureClass1 {
  /*float:left; floatは不要*/
  display:inline-block;
  /*【参考資料】max-width:200px;*/
  width: 200px;
  line-height:100%;
  font-size: 11px;
  vertical-align:top;
}
.PictureClass1 img {
  border-style:none;
  max-height:260px;

  max-width : 100% ;/*Add 2020/01/25*/
  height : auto ;/*Add 2020/01/25*/

}
.PictureClass1 table {
  width: 200px;


  /*【参考資料】height:100px;有効にならない。*/
  text-align: left;
  text-align: center;
  border:1px solid black;

  margin-bottom: 3px;/*Add 2020/01/25*/

}
.PictureClass1 th,td{
  padding: 3px 3px;/*Add 2020/01/25*/
}
.PictureClass1 th{
  font-weight:bold;/*Add 2020/01/25*/
}




/*---------------------------------------------------------------------------*/
/*【PC用だけの設定】スクリーン・サイズが641pixel以上の場合                   */
/*---------------------------------------------------------------------------*/
/*571pxの理由は、Xpedia ZやGalaxy 4Sが360px × 568pxのため、横でもスマホ用にするため。*/
@media screen and (min-width: 641px) {


/* 【重要】@media screen and (max-width: 480px)は一番下の方で定義しないと上書きできないため有効にならない */


/******************************************/
/*共通部分の置き換え(開始)*/
/******************************************/



}


/*【スマホ用の設定】【スマホ用の設定】【スマホ用の設定】【スマホ用の設定】【スマホ用の設定】*/
/*【スマホ用の設定】【スマホ用の設定】【スマホ用の設定】【スマホ用の設定】【スマホ用の設定】*/
/*【スマホ用の設定】【スマホ用の設定】【スマホ用の設定】【スマホ用の設定】【スマホ用の設定】*/
/*---------------------------------------------------------------------------*/
/*【スマホ用の設定】スクリーン・サイズが640pixel以下の場合*/
/*---------------------------------------------------------------------------*/
/*570pxの理由は、Xpedia ZやGalaxy 4Sが360px × 568pxのため、横でもスマホ用にするため。*/
@media screen and (max-width: 640px) {


/******************************************/
/*共通部分の置き換え(開始)*/
/******************************************/

/*全体のページの外枠 
---------------------------------------------------------------------------*/
#Page {

	max-width: 100%;
	width: auto;
	font-size: 14px;


}

/*ヘッダー文字(Header)(PCとスマホ共通)
---------------------------------------------------------------------------*/
#Header1,#Header2,#Header3,#Header4,#Header5,#Header6,#Header7{

	font-size: 14px;
}

/*Mainの文書(サイドなしの場合)
---------------------------------------------------------------------------*/
#Main {

	font-size: 15px;
	font-size: 14px;

}



#Footer {
	font-size: 15px;
	font-size: 14px;
}
#FooterEach{
	font-size: 14px;
}

/*---------------------------------------------------------------------------*/
/* h1-h6
/*---------------------------------------------------------------------------*/

h1 {

	font-size: 16px;

}

h2,h3 {

	font-size: 16px;

}

/*---------------------------------------------------------------------------*/
/* TableのCSSを設定
/*---------------------------------------------------------------------------*/
#Main table{
  width: 100%;
  margin: 0px 0px 0px 0px;
}

/*市町村ファイルの寺院一覧表の住所などのフォントサイズを指定する。
---------------------------------------------------------------------------*/
.CityListFont {
	font-size: 13px;
}


/******************************************/
/*共通部分の置き換え(終了)*/
/******************************************/


}

