﻿@charset "utf-8";
/*******************************************************************************************/
/* 【ShareSaikoujiTempleGeneratorMain】【SaikoujiとTempleGeneratorで共用(共通仕様)する】   */
/* 【重要】【ShareSaikoujiTempleGeneratorMainを更新する場合は、まずSaikoujiでテストする。】*/
/*         【その後、OKであればTempleGeneratorへコピーして使用する。】                     */
/* 【機能】 SaikoujiとTempleGeneratorの共用部分を定義                                      */
/*******************************************************************************************/

/************************************************************************************/
/* ShareSaikoujiTempleGeneratorMain【開始】                                         */
/************************************************************************************/

/*---------------------------------------------------------------------------*/
/*【PC用とスマホ用の共通の設定】サイト全体への適用
/*---------------------------------------------------------------------------*/

/************************************************************************************/
/* 【PCのみ表示、スマホは非表示】【PC用とスマホ用の共通の設定】【開始】             */
/************************************************************************************/

.PCOnly{
	display:inline;
}

/* ================================================================================ */
/* 【PCのみ表示、スマホは非表示】【終了】                                           */
/* ================================================================================ */


/************************************************************************************/
/* 【HeaderGroupとHeaderButtonXクラス】【PC用とスマホ用の共通の設定】【開始】       */
/*     【機能】ヘッダーの設定とヘッダーで使うボタンの定義                           */
/************************************************************************************/

/*------------------------------------------------------------------------------*/
/* ヘッダー(HeaderGroup1-7)で使用するボタンの定義【PC用とスマホ用の共通の設定】 */
/*------------------------------------------------------------------------------*/

.HeaderButton1,.HeaderButton2,.HeaderButton3,.HeaderButton4,.HeaderButton5,.HeaderButton6,.HeaderButton7,.HeaderButton8,.HeaderButton9{
  /* margin 上、右、下、左 */
  margin: 2px 3px 2px 3px;
  /* padding 上、右、下、左 */
  padding: 4px 12px 2px 12px;
  text-decoration: none;/*テキストリンクのアンダーラインを消す*/
  display: inline-block;/*ボタンのテキストが途中で改行しないようにする。(white-space: nowrapよりもお勧め)*/
  border-bottom: 5px solid #003;
  border-top: none;
  border-left: none;
  border-right: none;
  background: linear-gradient(#00F,#88F,#23F,#008);
  color: #FFF;
  border-radius: 7px;
  box-shadow: 0px 2px 10px grey;
  color: white;
}

.HeaderButton1:hover,.HeaderButton2:hover,.HeaderButton3:hover,.HeaderButton4:hover,.HeaderButton5:hover,.HeaderButton6:hover,.HeaderButton7:hover,.HeaderButton8:hover,.HeaderButton9:hover {
  /* margin 上、右、下、左 */
  margin: 2px 3px 5px 3px;
  border: none;
  border-bottom: 2px solid #000;
  box-shadow: 0px 1px 5px grey;
  background: linear-gradient(#400,#F00,#400);
  color: #FF0;
}

.HeaderButton2,.HeaderButton6,.HeaderButton8{
  border-bottom: 5px solid #030;
  background: linear-gradient(#0F0,#8F8,#2F3,#080);
  background: linear-gradient(#050,#0E0,#030);
  box-shadow: 0px 2px 10px grey;
}

.HeaderButton5,.HeaderButton7{
  border-bottom: 5px solid #300;
  background: linear-gradient(#600,#D00,#400);
  box-shadow: 0px 2px 10px grey;
}
.HeaderButton5:hover,.HeaderButton7:hover{
  border-bottom: 2px solid #000;
  box-shadow: 0px 1px 5px grey;
  background: linear-gradient(#880,#FF0,#FF0,#440);
  color: #00F;
}


/*---------------------------------------------------------------------------*/
/* 各サーバーで設定を変更するヘッダー(HeaderGroup1-7)の定義【PC用とスマホ用の共通の設定】 */
/*---------------------------------------------------------------------------*/

/* ヘッダーに使う文字(スマートフォンは文字が小さくなる) */
.HeaderFontBig {
	font-size:24px;
}
.HeaderFontMiddle {
	font-size:20px;
}

/*---------------------------------------------------------------------------*/
/* 各サーバーで設定を変更するヘッダー(HeaderGroup1-7)の定義【PC用とスマホ用の共通の設定】 */
/* 【重要】将来的にHeaderGroupはHeaderに変更する                             */
/* 【重要】将来的にHeaderGroupはHeaderに変更する                             */
/* 【重要】将来的にHeaderGroupはHeaderに変更する                             */
/*---------------------------------------------------------------------------*/

#Header1,#HeaderTemp1,#Header2,#HeaderTemp2,#Header3,#HeaderTemp3,#Header4,#HeaderTemp4,#Header5,#HeaderTemp5,#Header6,#HeaderTemp6,#Header7,#HeaderTemp7,#Header8,#HeaderTemp8,#Header9,#HeaderTemp9 {
	/* margin 上、右、下、左 */
	margin: 0px 0px 2px 0px;
	/* padding 上、右、下、左 */
	padding: 8px 8px 8px 8px;

/*	float:left;
*/
	font-size:16px;
	width: 100%;
	line-height: 1.3;
	/* border までが幅と高さになるため、width 100%と合わせるとPageの幅に自動的になり位置がずれない。 */
	box-sizing: border-box;
	border-radius: 6px; /*角の丸み*/
	border: 3px solid #080; /* 枠線の太さ・色 */
}


/* 【01.saikouji.com】 */
#Header1,#HeaderTemp1 {
	border: 5px solid #AF0; /*線の太さ・色*/
	border-radius: 10px; /*角の丸み*/
	/* box-shadow +右-左、+下-上、ぼかし距離 、広がり距離  */
	box-shadow: -4px 4px 8px 0px rgba(0,0,0,0.8) inset;
	background-image: linear-gradient(60deg, #FF6 0%,#FFD 30%,#FFC 70%, #FF2 100%);
}

/* 【02.西光寺.jp】 */
/**********************************************************************************************************/
/*【重要】外枠を2pxで作成し、その中をshadowで7本の線で内枠を構成。中は、円のグラデーションをかけている。  */
/**********************************************************************************************************/
#Header2,#HeaderTemp2{
	padding: 12px;
	overflow-x: hidden; /* For Opera */
	border: 2px solid #0A0; /*線の太さ・色*/
	border-radius: 6px; /*角の丸み*/
	box-shadow:
		inset #0E0 0 0 0 2px,
		inset #4F4 0 0 0 4px,
		inset #8F8 0 0 0 6px,
		inset #AFA 0 0 0 8px,
		inset #CFC 0 0 0 10px,
		inset #EFE 0 0 0 12px,
		inset #FAFFFA 0 0 0 14px;
	background-image: radial-gradient(#C8FFC8, #FFF);
}

/* 【03.saikoji.com】 */
#Header3,#HeaderTemp3{
	border: 3px solid #F44; /*線の太さ・色*/
	border: 3px solid #F00; /*線の太さ・色*/
	border-radius: 8px; /*角の丸み*/
	/* box-shadow +右-左、+下-上、ぼかし距離 、広がり距離  */
	box-shadow: -4px 4px 8px 0px rgba(0,0,0,0.6) inset;
	background-image: linear-gradient(60deg, #FBA 0%,#FEE 20%,#FEE 75%, #FBA 100%);
	background-image: linear-gradient(60deg, #FDD 0%,#FFF8F8 20%,#FFF8F8 75%, #FDD 100%);
}
/* 【04.bukkyou.com/Saikouji】 */
#Header4,#HeaderTemp4{
	border: 3px solid #04F; /*線の太さ・色*/
	border-radius: 8px; /*角の丸み*/
	/* box-shadow +右-左、+下-上、ぼかし距離 、広がり距離  */
	box-shadow: -4px 4px 8px 0px rgba(0,0,0,0.6) inset;
	background-image: linear-gradient(60deg, #BEF 0%,#EFF 20%,#EFF 75%, #BEF 100%);
}
/* 【05.bukyou.com/Saikouji】 */
#Header5,#HeaderTemp5{
	border: 3px solid #B7D; /*線の太さ・色*/
	border-radius: 8px; /*角の丸み*/
	/* box-shadow +右-左、+下-上、ぼかし距離 、広がり距離  */
	box-shadow: -4px 4px 8px 0px rgba(0,0,0,0.6) inset;
	background-image: linear-gradient(60deg, #C9E 0%,#FEF 20%,#FEF 75%, #C9E 100%);
}

/* 【06.tech-jp.com/Saikouji】 */
/**********************************************************************/
/*【重要】Border dashedでステッチを作る。                             */
/**********************************************************************/
#HeaderTemp6{
	/* margin 上、右、下、左 【ステッチまでの幅】*/
	margin: 6px 6px 6px 6px;
	width:calc(100% - 16px);
	background-color: #EA4;
	box-shadow: 0 0 0 8px #EA4;
	border: 2px dashed #FFFFFF;
	border-radius: 1px;
	color: #555555;
}

/* 【06.tech-jp.com/Saikouji】 *//* Saikouji専用タイトルCSS(ステッチなし) */
#Header6{
	border: 4px solid #E83; /*線の太さ・色*/
	border-radius: 8px; /*角の丸み*/
	/* box-shadow +右-左、+下-上、ぼかし距離 、広がり距離  */
	box-shadow: -4px 4px 8px 0px rgba(0,0,0,0.6) inset;
	background-image: linear-gradient(60deg, #FA4 0%,#FEB 20%,#FEB 75%, #FA4 100%);
	background-image: linear-gradient(60deg, #FCA 0%,#FFF8D0 20%,#FFF8D0 75%, #FCA 100%);
}

/* 【07.jpinf.com/Saikouji】 */
#Header7,#HeaderTemp7 {
	border: 3px solid #FCE; /*線の太さ・色*/
	border-radius: 8px; /*角の丸み*/
	/* box-shadow +右-左、+下-上、ぼかし距離 、広がり距離  */
	box-shadow: -4px 4px 8px 0px rgba(0,0,0,0.6) inset;
	background-image: linear-gradient(60deg, #FCE 0%,#FEE 20%,#FEE 75%, #FCE 100%);
}


/* 【08.jpinf.sakura.ne.jp】 */
#Header8,#HeaderTemp8 {
	/* margin 上、右、下、左 */
	margin: 4px 3px 5px 3px;
	/* padding 上、右、下、左 */
	padding: 6px 6px 6px 6px;
	/* border までが幅と高さになるため、width 100%と合わせるとPageの幅に自動的になり位置がずれない。 */
	box-sizing: border-box;
	width: calc(100% - 6px);
	color: #000; /* 文字色 */
	background-color: #fff; /* 背景色 */
	/* box-shadow +右-左、+下-上、ぼかし距離 、広がり距離  */
	box-shadow: 0 0 5px 5px #CCC, 0 0 5px 3px #CCC inset; /* 影 */
	box-shadow: 0 0 2px 1px #888, 0 0 2px 1px #888 inset; /* 影 */
	box-shadow: 0 0 3px 1px #444, 0 0 3px 1px #444 inset; /* 影 */
	box-shadow: 0 0 4px 4px #000, 0 0 inset; /* 影 */
	border-radius: 8px; /*角の丸み*/
	background-image: linear-gradient(150deg,#642 0%, #DA8 30%, #DA8 70%, #642 100%);
	background-image: linear-gradient(150deg,#254 0%, #CF6 49%, #CF6 51%, #254 100%);
	
}

/* 【09.jpinf.boo.jp】 */
#Header9,#HeaderTemp9 {
	/* margin 上、右、下、左 */
	margin: 4px 3px 5px 3px;
	margin: 2px 2px 2px 2px;
	/* padding 上、右、下、左 */
	padding: 6px 6px 6px 6px;
	padding: 3px 3px 3px 3px;
	/* border までが幅と高さになるため、width 100%と合わせるとPageの幅に自動的になり位置がずれない。 */
	box-sizing: border-box;
	width: calc(100% - 6px);
	color: #FFF; /* 文字色 */
	/* background-color:#191919; */
	background-image: linear-gradient(150deg,#421 0%, #642 30%, #B75 48%, #B75 52%, #642 70%, #421 100%);
	border:6px solid #a60;
	border-radius:3px;
	box-shadow:2px 2px 4px #999,2px 2px 2px #000 inset;
}

/* ================================================================================ */
/* 【HeaderとHeaderButtonXクラス】【PC用とスマホ用の共通の設定】【終了】       */
/* ================================================================================ */

/*---------------------------------------------------------------------------*/
/* 各サーバーで設定を変更するヘッダー(HeaderGroup1-7)の定義【PC用とスマホ用の共通の設定】 */
/* 【重要】将来的にHeaderGroupはHeaderに変更する                             */
/* 【重要】将来的にHeaderGroupはHeaderに変更する                             */
/* 【重要】将来的にHeaderGroupはHeaderに変更する                             */
/*---------------------------------------------------------------------------*/

#HeaderGroup1,#HeaderGroup2,#HeaderGroup3,#HeaderGroup4,#HeaderGroup5,#HeaderGroup6,#HeaderGroup7,#HeaderGroup8,#HeaderGroup9 {
	/* margin 上、右、下、左 */
	margin: 0px 0px 2px 0px;
	/* padding 上、右、下、左 */
	padding: 8px 8px 8px 8px;
	overflow:hidden;

/*	float:left;
*/
	font-size:16px;
	width: 100%;
	line-height: 1.3;
	/* border までが幅と高さになるため、width 100%と合わせるとPageの幅に自動的になり位置がずれない。 */
	box-sizing: border-box;
	border-radius: 6px; /*角の丸み*/
	border: 3px solid #080; /* 枠線の太さ・色 */
}


/* 【01.saikouji.com】 */
#HeaderGroup1 {
	border: 5px solid #AF0; /*線の太さ・色*/
	border-radius: 10px; /*角の丸み*/
	/* box-shadow +右-左、+下-上、ぼかし距離 、広がり距離  */
	box-shadow: -4px 4px 8px 0px rgba(0,0,0,0.8) inset;
	background-image: linear-gradient(60deg, #FF6 0%,#FFD 30%,#FFC 70%, #FF2 100%);
}

/* 【02.西光寺.jp】 */
/**********************************************************************************************************/
/*【重要】外枠を2pxで作成し、その中をshadowで7本の線で内枠を構成。中は、円のグラデーションをかけている。  */
/**********************************************************************************************************/
#HeaderGroup2{
	padding: 12px;
	overflow-x: hidden; /* For Opera */
	border: 2px solid #0A0; /*線の太さ・色*/
	border-radius: 6px; /*角の丸み*/
	box-shadow:
		inset #0E0 0 0 0 2px,
		inset #4F4 0 0 0 4px,
		inset #8F8 0 0 0 6px,
		inset #AFA 0 0 0 8px,
		inset #CFC 0 0 0 10px,
		inset #EFE 0 0 0 12px,
		inset #FAFFFA 0 0 0 14px;
	background-image: radial-gradient(#C8FFC8, #FFF);
}

/* 【03.saikoji.com】 */
#HeaderGroup3{
	border: 3px solid #F44; /*線の太さ・色*/
	border: 3px solid #F00; /*線の太さ・色*/
	border-radius: 8px; /*角の丸み*/
	/* box-shadow +右-左、+下-上、ぼかし距離 、広がり距離  */
	box-shadow: -4px 4px 8px 0px rgba(0,0,0,0.6) inset;
	background-image: linear-gradient(60deg, #FBA 0%,#FEE 20%,#FEE 75%, #FBA 100%);
	background-image: linear-gradient(60deg, #FDD 0%,#FFF8F8 20%,#FFF8F8 75%, #FDD 100%);
}
/* 【04.bukkyou.com/Saikouji】 */
#HeaderGroup4{
	border: 3px solid #04F; /*線の太さ・色*/
	border-radius: 8px; /*角の丸み*/
	/* box-shadow +右-左、+下-上、ぼかし距離 、広がり距離  */
	box-shadow: -4px 4px 8px 0px rgba(0,0,0,0.6) inset;
	background-image: linear-gradient(60deg, #BEF 0%,#EFF 20%,#EFF 75%, #BEF 100%);
}
/* 【05.bukyou.com/Saikouji】 */
#HeaderGroup5{
	border: 3px solid #B7D; /*線の太さ・色*/
	border-radius: 8px; /*角の丸み*/
	/* box-shadow +右-左、+下-上、ぼかし距離 、広がり距離  */
	box-shadow: -4px 4px 8px 0px rgba(0,0,0,0.6) inset;
	background-image: linear-gradient(60deg, #C9E 0%,#FEF 20%,#FEF 75%, #C9E 100%);
}

/* 【06.tech-jp.com/Saikouji】 */
/**********************************************************************/
/*【重要】Border dashedでステッチを作る。                             */
/**********************************************************************/
#HeaderGroup6{
	/* margin 上、右、下、左 【ステッチまでの幅】*/
	margin: 6px 6px 6px 6px;
	width:calc(100% - 16px);
	background-color: #EA4;
	box-shadow: 0 0 0 8px #EA4;
	border: 2px dashed #FFFFFF;
	border-radius: 1px;
	color: #555555;
}

/* 【06.tech-jp.com/Saikouji】 *//* Saikouji専用タイトルCSS(ステッチなし) */
#HeaderGroup6Sai{
	border: 4px solid #E83; /*線の太さ・色*/
	border-radius: 8px; /*角の丸み*/
	/* box-shadow +右-左、+下-上、ぼかし距離 、広がり距離  */
	box-shadow: -4px 4px 8px 0px rgba(0,0,0,0.6) inset;
	background-image: linear-gradient(60deg, #FA4 0%,#FEB 20%,#FEB 75%, #FA4 100%);
	background-image: linear-gradient(60deg, #FCA 0%,#FFF8D0 20%,#FFF8D0 75%, #FCA 100%);
}

/* 【07.jpinf.com/Saikouji】 */
#HeaderGroup7 {
	border: 3px solid #FCE; /*線の太さ・色*/
	border-radius: 8px; /*角の丸み*/
	/* box-shadow +右-左、+下-上、ぼかし距離 、広がり距離  */
	box-shadow: -4px 4px 8px 0px rgba(0,0,0,0.6) inset;
	background-image: linear-gradient(60deg, #FCE 0%,#FEE 20%,#FEE 75%, #FCE 100%);
}


/* 【08.jpinf.sakura.ne.jp】 */
#HeaderGroup8 {
	/* margin 上、右、下、左 */
	margin: 4px 3px 5px 3px;
	/* padding 上、右、下、左 */
	padding: 6px 6px 6px 6px;
	/* border までが幅と高さになるため、width 100%と合わせるとPageの幅に自動的になり位置がずれない。 */
	box-sizing: border-box;
	width: calc(100% - 6px);
	color: #000; /* 文字色 */
	background-color: #fff; /* 背景色 */
	/* box-shadow +右-左、+下-上、ぼかし距離 、広がり距離  */
	box-shadow: 0 0 5px 5px #CCC, 0 0 5px 3px #CCC inset; /* 影 */
	box-shadow: 0 0 2px 1px #888, 0 0 2px 1px #888 inset; /* 影 */
	box-shadow: 0 0 3px 1px #444, 0 0 3px 1px #444 inset; /* 影 */
	box-shadow: 0 0 4px 4px #000, 0 0 inset; /* 影 */
	border-radius: 8px; /*角の丸み*/
	background-image: linear-gradient(150deg,#642 0%, #DA8 30%, #DA8 70%, #642 100%);
	background-image: linear-gradient(150deg,#254 0%, #CF6 49%, #CF6 51%, #254 100%);
	
}

/* 【09.jpinf.boo.jp】 */
#Header9{
	color: #FFF;	/*メニューの文字色*/
}

#HeaderGroup9 {
	/* margin 上、右、下、左 */
	margin: 4px 3px 5px 3px;
	margin: 2px 2px 2px 2px;
	/* padding 上、右、下、左 */
	padding: 6px 6px 6px 6px;
	padding: 3px 3px 3px 3px;
	/* border までが幅と高さになるため、width 100%と合わせるとPageの幅に自動的になり位置がずれない。 */
	box-sizing: border-box;
	width: calc(100% - 6px);
	color: #FFF; /* 文字色 */
	/* background-color:#191919; */
	background-image: linear-gradient(150deg,#421 0%, #642 30%, #B75 48%, #B75 52%, #642 70%, #421 100%);
	background-image: linear-gradient(150deg,#953 0%, #B75 30%, #C97 48%, #C97 52%, #B75 70%, #953 100%);
	border:6px solid #a60;
	border-radius:3px;
	box-shadow:2px 2px 4px #999,2px 2px 2px #000 inset;
}

/* ================================================================================ */
/* 【HeaderGroupとHeaderButtonXクラス】【PC用とスマホ用の共通の設定】【終了】       */
/* ================================================================================ */

/************************************************************************************/
/* 【MultiDisplayImageクラス】【PC用とスマホ用の共通の設定】【開始】（自分で作成）  */
/*     【機能】４枚の写真（イメージ）を順番に表示させる。写真ごとにリンクを貼れる。 */
/*     【その他】表示間隔を帰る場合は、animation-duration:の時間を変更し、          */
/*               animation-delay:の時間を新たに設定した時間の1/4づつに変更する。    */
/*               写真の重なり合う時間を変更するには、@keyframesの割合を変更する。   */
/************************************************************************************/

/*********************************************************/
/*ヘッダーの右上に置く透明の長方形を作成する             */
/*【目的】スマホの場合は、４枚の写真を表示しないので、   */
/*　　　　ハンバーガーメニューで文字が隠れないために使用 */
/*********************************************************/
.MDspImg_Rectangle {
	/*margin 上、右、下、左*/
	margin: 0px 0px 0px 0px;
	/*padding 上、右、下、左*/
	padding: 0px 0px 0px 0px;
	width: 45px;/*この大きさがハンバーガーメニューからギリギリはみだす大きさ(background-colorをRedにして確認する)*/
	height: 55px;/*この大きさがハンバーガーメニューからギリギリはみだす大きさ(background-colorをRedにして確認する)*/
	background-color: transparent;
}

.MDspImg1,.MDspImg2,.MDspImg3,.MDspImg4,.MDspImg5,.MDspImg6,.MDspImg7,.MDspImg8,.MDspImg9 {
	/* margin 上、右、下、左 */
	margin: 0px 5px 5px 0px;
	margin: 0px 5px 0px 0px;
	/* padding 上、右、下、左 */
	padding: 0px 0px 0px 0px;
	/*background-color: white;*/ /* 背景色は指定せず、透明にする。 */
	position: relative;
}
.MDspImg1 img,.MDspImg2 img,.MDspImg3 img,.MDspImg4 img,.MDspImg5 img,.MDspImg6 img,.MDspImg7 img,.MDspImg8 img,.MDspImg9 img {
    /* 写真（イメージ）大きさを変更するには、widthとheightを変更する。 */
	width:120px;
	width:200px;
	width:160px;
	width:160px;/*25/07/20 画像が大きすぎてメニューが右にずれたため、一時的に縮小した*/
	width:180px;
	height:89px;
	height:148px;
	height:119px;
	height:105px;/*25/07/20 画像が大きすぎてメニューが右にずれたため、一時的に縮小した*/
	height:133px;
	position: relative;
	animation-name: MultiDisplayImage;
	animation-duration: 20s;
	animation-iteration-count: infinite;
	opacity: 0;
	border: 2px solid;
	border-color: #060;
}

.MDspImg4 img,.MDspImg7 img,.MDspImg9 img {
	/* 画像のフレームの枠の設定は、以下の３行(コメントを除く)で行う。 */
    /* box-shadow:は、水平方向の距離 垂直方向の距離 ぼかし距離 広がり距離 影の色 */
    box-shadow: -4px 4px 2px 1px rgba(0, 0, 0, 0.4);
    box-shadow: -4px 4px 2px 2px rgba(0, 0, 0, 0.5);
    border: double 6px #400;
    border: solid 2px #F00;
    background-color: #F00;
}

.MDspImg1 .image1,.MDspImg2 .image1,.MDspImg3 .image1,.MDspImg4 .image1,.MDspImg5 .image1,.MDspImg6 .image1,.MDspImg7 .image1,.MDspImg8 .image1,.MDspImg9 .image1 {
	animation-delay:0s;
}
.MDspImg1 .image2,.MDspImg2 .image2,.MDspImg3 .image2,.MDspImg4 .image2,.MDspImg5 .image2,.MDspImg6 .image2,.MDspImg7 .image2,.MDspImg8 .image2,.MDspImg9 .image2 {
	animation-delay:5s;
	position: absolute;top: 0;left: 0;/* image1は入れない。 */
}
.MDspImg1 .image3,.MDspImg2 .image3,.MDspImg3 .image3,.MDspImg4 .image3,.MDspImg5 .image3,.MDspImg6 .image3,.MDspImg7 .image3,.MDspImg8 .image3,.MDspImg9 .image3 {
	animation-delay:10s;
	position: absolute;top: 0;left: 0;/* image1は入れない。 */
}
.MDspImg1 .image4,.MDspImg2 .image4,.MDspImg3 .image4,.MDspImg4 .image4,.MDspImg5 .image4,.MDspImg6 .image4,.MDspImg7 .image4,.MDspImg8 .image4,.MDspImg9 .image4 {
	animation-delay:15s;
	position: absolute;top: 0;left: 0;/* image1は入れない。 */
}

/* 4枚の場合は、opacityの値は、0%=0,X%=1,25%=1,25+X%=0,100%=0にする。 */
/* z-indexの値は、画像のリンクを有効にするため、表示中の画像を最上位にもってくる。 */
@keyframes MultiDisplayImage {
	0% {
		opacity: 0;
		z-index: 100;
	}
	
	20% {
		opacity: 1;
	}
	25% {
		opacity: 1;
		z-index: 10;
	}
	45% {
		opacity: 0;
	}
	100% {
		opacity: 0;
	}
}
/* ================================================================================ */
/* 【MultiDisplayImageクラス】【終了】                                              */
/* ================================================================================ */

/************************************************************************************/
/* 【BClassArrowボタンクラス】【開始】                                              */
/************************************************************************************/

/*---------------------------------------------------------------------------*/
/* BClassArrowボタンクラス【西光寺が最新、TempleGeneratorは西光寺のコピー】  */
/* 【機能】ページを前後させるボタンの定義                                    */
/* 【注意点】                                                                */
/*   _Aははじめに戻る、_Bは一つ戻る、_Cは一つ進む、_Dは最後へ移動            */
/* 【使用場所】                                                              */
/*   1.寺院の移動ボタン                                                      */
/*---------------------------------------------------------------------------*/

.BClassArrow_A,.BClassArrow_B,.BClassArrow_C,.BClassArrow_D,.BClassArrow_A_Disable,.BClassArrow_B_Disable,.BClassArrow_C_Disable,.BClassArrow_D_Disable,.BClassArrow_Z {
	/*margin 上、右、下、左*/
	margin: 2px 0px 2px 0px;
	margin: 3px 3px 3px 3px;
	display: block;
	display:   inline-block;
	display:inline-flex;
	justify-content: center;
	align-items: center;
	width: auto;
	max-width:140px;
	max-width:200px;
	max-width:300px;
	line-height:0.98;

/*Add 22/01/14*/
	box-sizing: border-box;

	height: 33px;
	height: 36px;
	height: 45px;
	text-align: right;
	text-align: center;

	background: #000;
	font-weight: none;
	text-decoration: none;
	border-radius: 5px;

	color: #FFF;
	position: relative;

	text-shadow:1px 1px 0 rgba(255,255,255,1);
	box-shadow:0 0 0 1px rgba(255,255,255,0.5) inset;
	background-image: linear-gradient(to bottom,
          rgba(180, 180, 180, 1.0),
          rgba(253, 253, 253, 1.0) 25%,
          rgba(240, 240, 240, 1.0) 30%,
          rgba(253, 253, 253, 1.0) 36%,
          rgba(225, 225, 225, 1.0) 50%,
          rgba(200, 200, 200, 1.0) 80%,
          rgba(170, 170, 170, 1.0)
          );

	border-top: 1.5px solid #EEE;
	border-left: 1.5px solid #EEE;
	border-right: 2.5px solid #222;
	border-bottom: 2.5px solid #222;

	text-shadow: 2px 2px 2px #800,-2px 2px 2px #800,2px -2px 2px #800,-2px -2px 2px #800,2px 2px 2px #800,-2px 2px 2px #800,2px -2px 2px #800,-2px -2px 2px #800;
	text-shadow: 2px 2px 2px #00F,-2px 2px 2px #00F,2px -2px 2px #00F,-2px -2px 2px #00F,2px 2px 2px #00F,-2px 2px 2px #00F,2px -2px 2px #00F,-2px -2px 2px #00F;
	text-shadow: 2px 2px 2px #080,-2px 2px 2px #080,2px -2px 2px #080,-2px -2px 2px #080,2px 2px 2px #080,-2px 2px 2px #080,2px -2px 2px #080,-2px -2px 2px #080;

}

.BClassArrow_A_Disable,.BClassArrow_B_Disable,.BClassArrow_C_Disable,.BClassArrow_D_Disable,.BClassArrow_Z_Disable {

	border-top: 1.5px solid #EEE;
	border-left: 1.5px solid #EEE;
	border-right: 2.5px solid #222;
	border-bottom: 2.5px solid #222;

}

.BClassArrow_Z {
	/*padding 上、右、下、左*/
	padding:3px 25px 0px 25px;
	padding:0px 25px 0px 25px;
}
.BClassArrow_A,.BClassArrow_A_Disable {
	/*padding 上、右、下、左*/
	padding:3px 15px 0px 35px;
	padding:0px 8px 0px 28px;
	padding:0px 4px 0px 26px;
}
.BClassArrow_B,.BClassArrow_B_Disable {
	/*padding 上、右、下、左*/
	padding:3px 15px 0px 35px;
	padding:0px 8px 0px 28px;
	padding:0px 4px 0px 26px;
}

.BClassArrow_C,.BClassArrow_C_Disable {
	/*padding 上、右、下、左*/
	padding:3px 35px 0px 15px;
	padding:0px 28px 0px 8px;
	padding:0px 26px 0px 4px;
}
.BClassArrow_D,.BClassArrow_D_Disable {
	/*padding 上、右、下、左*/
	padding:3px 35px 0px 15px;
	padding:0px 28px 0px 8px;
	padding:0px 26px 0px 4px;
}


.BClassArrow_A_Disable {
	text-shadow: none;
	color: #666;
}
.BClassArrow_B_Disable {
	text-shadow: none;
	color: #666;
}
.BClassArrow_C_Disable {
	text-shadow: none;
	color: #666;
}
.BClassArrow_D_Disable {
	text-shadow: none;
	color: #666;
}



.BClassArrow_B::before,.BClassArrow_C::before,.BClassArrow_B_Disable::before,.BClassArrow_C_Disable::before{
	content: "";
	position: absolute;
	top: 34%;
	width: 12px;
	height: 12px;
	border-top: 10px solid #C00;
	border-right: 10px solid #C00;
	margin-top: -5px;

/*Add 22/01/14*/
	width: 15px;
	height: 15px;
	border-radius:5px;
	margin-top: -7px;


}


.BClassArrow_A::before,.BClassArrow_D::before,.BClassArrow_A_Disable::before,.BClassArrow_D_Disable::before{
	content: "";
	position: absolute;
	top: 34%;
	width: 18px;
	height: 18px;
	border-top: 3px solid #C00;
	border-right: 3px solid #C00;
	margin-top: -5px;

/*Add 22/01/14*/
	width: 21px;
	height: 21px;
	border-radius:3px;
	margin-top: -7px;



}
.BClassArrow_A::after,.BClassArrow_D::after,.BClassArrow_A_Disable::after,.BClassArrow_D_Disable::after{
	content: "";
	position: absolute;
	top: 34%;
	width: 18px;
	height: 18px;
	border-top: 3px solid #C00;
	border-right: 3px solid #C00;
	margin-top: -5px;


/*Add 22/01/14*/
	width: 21px;
	height: 21px;
	border-radius:3px;
	margin-top: -7px;

}
.BClassArrow_A::before,.BClassArrow_B::before,.BClassArrow_A_Disable::before,.BClassArrow_B_Disable::before{
	left: 10px;
	transform: rotate(225deg);

/*Add 22/01/14*/
	left: 5px;


}

.BClassArrow_A::after,.BClassArrow_A_Disable::after{
	left: 16px;
	transform: rotate(225deg);

/*Add 22/01/14*/
	left: 12px;

}

.BClassArrow_C::before,.BClassArrow_D::before,.BClassArrow_C_Disable::before,.BClassArrow_D_Disable::before{
	right: 10px;
	transform: rotate(45deg);

/*Add 22/01/14*/
	right: 5px;

}

.BClassArrow_D::after,.BClassArrow_D_Disable::after{
	right: 16px;
	transform: rotate(45deg);

/*Add 22/01/14*/
	right: 12px;

}

.BClassArrow_A_Disable::before{
	border-color: #777;
}
.BClassArrow_B_Disable::before{
	border-color: #777;
}
.BClassArrow_C_Disable::before{
	border-color: #777;
}
.BClassArrow_D_Disable::before{
	border-color: #777;
}
.BClassArrow_A_Disable::after{
	border-color: #777;
}
.BClassArrow_D_Disable::after{
	border-color: #777;
}


.BClassArrow_A:hover,.BClassArrow_B:hover,.BClassArrow_C:hover,.BClassArrow_D:hover,.BClassArrow_Z:hover {
  color: #000;
  color: #FFF;
  text-shadow: 0 1px 1px rgba(255, 255, 255, .5);
  text-shadow: 2px 2px 2px #333,-2px 2px 2px #333,2px -2px 2px #333,-2px -2px 2px #333,2px 2px 2px #333,-2px 2px 2px #333,2px -2px 2px #333,-2px -2px 2px #333;

  background-image: linear-gradient(to bottom, #2be, #29c);
  background-image: linear-gradient(to bottom, #A00, #FCC, #A00);

/*Add 22/01/14*/
/*Move 22/01/16*/
/*  box-sizing: border-box; */

/*
  border-top: 2px solid  #555;
  border-bottom: 2px solid  #555;
*/
}


.BClassArrow_B:hover::before,.BClassArrow_C:hover::before{
	border-top: 10px solid #333;
	border-right: 10px solid #333;
}

.BClassArrow_A:hover::before,.BClassArrow_D:hover::before{
	border-top: 3px solid #333;
	border-right: 3px solid #333;
}
.BClassArrow_A:hover::after,.BClassArrow_D:hover::after{
	border-top: 3px solid #333;
	border-right: 3px solid #333;
}



/*---------------------------------------------------------------------------*/
/*BClassArrow_NO1-8の個別設定。                                              */
/*---------------------------------------------------------------------------*/

/*【青系ボタン(1:Saikouji)】*/
.BClassArrow_NO1 {
  border-top: 1.5px solid #EEF;
  border-left: 1.5px solid #EEF;
  border-right: 2px solid #22F;
  border-bottom: 2px solid #22F;
  text-shadow: 2px 2px 2px #44F,-2px 2px 2px #44F,2px -2px 2px #44F,-2px -2px 2px #44F,2px 2px 2px #44F,-2px 2px 2px #44F,2px -2px 2px #44F,-2px -2px 2px #44F;
}

/*【黄色系Hover(1)】*/
.BClassArrow_NO1:hover {
  background-image: linear-gradient(to bottom, #A0A, #FCF, #A0A);
  background-image: linear-gradient(to bottom, #AA0, #FFC, #AA0);
  background-image: linear-gradient(to bottom, #DD0, #FFF, #DD0);

  /*【文字の色】*/
  /*color: #000;*/
  /*【文字の縁取り】*/
  text-shadow: 2px 2px 2px #800,-2px 2px 2px #800,2px -2px 2px #800,-2px -2px 2px #800,2px 2px 2px #800,-2px 2px 2px #800,2px -2px 2px #800,-2px -2px 2px #800;
  text-shadow: 2px 2px 2px #F00,-2px 2px 2px #F00,2px -2px 2px #F00,-2px -2px 2px #F00,2px 2px 2px #F00,-2px 2px 2px #F00,2px -2px 2px #F00,-2px -2px 2px #F00;
  text-shadow: 2px 2px 2px #C00,-2px 2px 2px #C00,2px -2px 2px #C00,-2px -2px 2px #C00,2px 2px 2px #C00,-2px 2px 2px #C00,2px -2px 2px #C00,-2px -2px 2px #C00;
  /*【上下２本線の色と太さ】*/
  border-top: 2px solid #F00;
  border-bottom: 2px solid #F00;

}

/*【緑色系ボタン(2:西光寺)】*/
.BClassArrow_NO2 {
  border-top: 1.5px solid #EFE;
  border-left: 1.5px solid #EFE;
  border-right: 1.5px solid #2F2; /*緑色は色が強いため、2pxでなく1.5pxにする*/
  border-bottom: 1.5px solid #2F2; /*緑色は色が強いため、2pxでなく1.5pxにする*/
  text-shadow: 2px 2px 2px #080,-2px 2px 2px #080,2px -2px 2px #080,-2px -2px 2px #080,2px 2px 2px #080,-2px 2px 2px #080,2px -2px 2px #080,-2px -2px 2px #080;
}

/*【緑系Hover(2)】*/
.BClassArrow_NO2:hover{
  background-image: linear-gradient(to bottom, #060, #DFD, #060);
  background-image: linear-gradient(to bottom, #0A0, #DFD, #0A0);
  /*【上下２本線の色と太さ】*/
  border-top: 2px solid  #555;
  border-bottom: 2px solid  #555;
}

/*【ピンク系ボタン(3:Saikoji)】*/
.BClassArrow_NO3{
  border-top: 1.5px solid #FEE;
  border-left: 1.5px solid #FEE;
  border-right: 2px solid #F22;
  border-bottom: 2px solid #F22;
  color: #008;
  /*【文字の縁取り】*/
  text-shadow: 2px 2px 2px #F88,-2px 2px 2px #F88,2px -2px 2px #F88,-2px -2px 2px #F88,2px 2px 2px #F88,-2px 2px 2px #F88,2px -2px 2px #F88,-2px -2px 2px #F88;
  text-shadow: 2px 2px 2px #FAA,-2px 2px 2px #FAA,2px -2px 2px #FAA,-2px -2px 2px #FAA,2px 2px 2px #FAA,-2px 2px 2px #FAA,2px -2px 2px #FAA,-2px -2px 2px #FAA;
  text-shadow: 1px 1px 1px #FAA,-1px 1px 1px #FAA,1px -1px 1px #FAA,-1px -1px 1px #FAA,1px 1px 1px #FAA,-1px 1px 1px #FAA,1px -1px 1px #FAA,-1px -1px 1px #FAA;
}

/*【ピンク系Hover(3)】*/
.BClassArrow_NO3:hover{
  background-image: linear-gradient(to bottom, #060, #DFD, #060);
  background-image: linear-gradient(to bottom, #F8F, #FEF, #F8F);
  /*【文字の縁取り】*/
  text-shadow: 2px 2px 2px #FF0,-2px 2px 2px #FF0,2px -2px 2px #FF0,-2px -2px 2px #FF0,2px 2px 2px #FF0,-2px 2px 2px #FF0,2px -2px 2px #FF0,-2px -2px 2px #FF0;
  text-shadow: 2px 2px 2px #00F,-2px 2px 2px #00F,2px -2px 2px #00F,-2px -2px 2px #00F,2px 2px 2px #00F,-2px 2px 2px #00F,2px -2px 2px #00F,-2px -2px 2px #00F;
  /*【上下２本線の色と太さ】*/
  border-top: 2px solid #00F;
  border-bottom: 2px solid #00F;
}

/*【青系ボタン(4:Bukkyou)】*/
.BClassArrow_NO4 {
  border-top: 1.5px solid #EEF;
  border-left: 1.5px solid #EEF;
  border-right: 2px solid #22F;
  border-bottom: 2px solid #22F;
  text-shadow: 2px 2px 2px #44F,-2px 2px 2px #44F,2px -2px 2px #44F,-2px -2px 2px #44F,2px 2px 2px #44F,-2px 2px 2px #44F,2px -2px 2px #44F,-2px -2px 2px #44F;
}

/*【青系Hover(4)】*/
.BClassArrow_NO4:hover {
  background-image: linear-gradient(to bottom, #00A, #CCF, #00A);
  background-image: linear-gradient(to bottom, #88F, #DDF, #88F);
  background-image: linear-gradient(to bottom, #88F, #EEF, #88F);
  /*【上下２本線の色と太さ】*/
  border-top: 2px solid  #555;
  border-bottom: 2px solid  #555;
}

/*【赤色系ボタン(5:Bukyou)】*/
.BClassArrow_NO5 {
  border-top: 1.5px solid #FEE;
  border-left: 1.5px solid #FEE;
  border-right: 2px solid #F22;
  border-bottom: 2px solid #F22;
  color: #FFD;
  text-shadow: 2px 2px 2px #D00,-2px 2px 2px #D00,2px -2px 2px #D00,-2px -2px 2px #D00,2px 2px 2px #D00,-2px 2px 2px #D00,2px -2px 2px #D00,-2px -2px 2px #D00;
}

/*【赤色系Hover(5)】*/
.BClassArrow_NO5:hover {
  background-image: linear-gradient(to bottom, #A00, #FCC, #A00);
  /*【文字の縁取り】*/
  text-shadow: 2px 2px 2px #00F,-2px 2px 2px #00F,2px -2px 2px #00F,-2px -2px 2px #00F,2px 2px 2px #00F,-2px 2px 2px #00F,2px -2px 2px #00F,-2px -2px 2px #00F;
  /*【なし】【上下２本線の色と太さ】*/
}

/*【緑色系ボタン(6)】*/
.BClassArrow_NO6 {
  border-top: 1.5px solid #EFE;
  border-left: 1.5px solid #EFE;
  border-right: 1.5px solid #2F2; /*緑色は色が強いため、2pxでなく1.5pxにする*/
  border-bottom: 1.5px solid #2F2; /*緑色は色が強いため、2pxでなく1.5pxにする*/
  text-shadow: 2px 2px 2px #080,-2px 2px 2px #080,2px -2px 2px #080,-2px -2px 2px #080,2px 2px 2px #080,-2px 2px 2px #080,2px -2px 2px #080,-2px -2px 2px #080;
}

/*【黄色系Hover(6)】*/
.BClassArrow_NO6:hover {
  background-image: linear-gradient(to bottom, #AA0, #FFC, #AA0);
  background-image: linear-gradient(to bottom, #DD0, #FFE, #DD0);
  /*【文字の縁取り】*/
  text-shadow: 2px 2px 2px #00F,-2px 2px 2px #00F,2px -2px 2px #00F,-2px -2px 2px #00F,2px 2px 2px #00F,-2px 2px 2px #00F,2px -2px 2px #00F,-2px -2px 2px #00F;
  /*【上下２本線の色と太さ】*/
  border-top: 3px solid  #00F;
  border-bottom: 3px solid  #00F;
}

/*【ピンク系ボタン(7)】*/
.BClassArrow_NO7{
  color: #008;
  border-top: 1.5px solid #FEE;
  border-left: 1.5px solid #FEE;
  border-right: 2px solid #F22;
  border-bottom: 2px solid #F22;
  text-shadow: 2px 2px 2px #F88,-2px 2px 2px #F88,2px -2px 2px #F88,-2px -2px 2px #F88,2px 2px 2px #F88,-2px 2px 2px #F88,2px -2px 2px #F88,-2px -2px 2px #F88;
  text-shadow: 2px 2px 2px #FAA,-2px 2px 2px #FAA,2px -2px 2px #FAA,-2px -2px 2px #FAA,2px 2px 2px #FAA,-2px 2px 2px #FAA,2px -2px 2px #FAA,-2px -2px 2px #FAA;
  text-shadow: 1px 1px 1px #FAA,-1px 1px 1px #FAA,1px -1px 1px #FAA,-1px -1px 1px #FAA,1px 1px 1px #FAA,-1px 1px 1px #FAA,1px -1px 1px #FAA,-1px -1px 1px #FAA;
}

/*【緑系Hover(7)】*/
.BClassArrow_NO7:hover{
  background-image: linear-gradient(to bottom, #060, #DFD, #060);
  /*【文字の縁取り】*/
  text-shadow: 2px 2px 2px #F00,-2px 2px 2px #F00,2px -2px 2px #F00,-2px -2px 2px #F00,2px 2px 2px #F00,-2px 2px 2px #F00,2px -2px 2px #F00,-2px -2px 2px #F00;
  text-shadow: 2px 2px 2px #C00,-2px 2px 2px #C00,2px -2px 2px #C00,-2px -2px 2px #C00,2px 2px 2px #C00,-2px 2px 2px #C00,2px -2px 2px #C00,-2px -2px 2px #C00;
  text-shadow: 2px 2px 2px #800,-2px 2px 2px #800,2px -2px 2px #800,-2px -2px 2px #800,2px 2px 2px #800,-2px 2px 2px #800,2px -2px 2px #800,-2px -2px 2px #800;
  text-shadow: 2px 2px 2px #A00,-2px 2px 2px #A00,2px -2px 2px #A00,-2px -2px 2px #A00,2px 2px 2px #A00,-2px 2px 2px #A00,2px -2px 2px #A00,-2px -2px 2px #A00;
  /*【なし】【上下２本線の色と太さ】*/
}

/*【青系ボタン(8)】*/
.BClassArrow_NO8 {
  border-top: 1.5px solid #EEF;
  border-left: 1.5px solid #EEF;
  border-right: 2px solid #22F;
  border-bottom: 2px solid #22F;
  text-shadow: 2px 2px 2px #44F,-2px 2px 2px #44F,2px -2px 2px #44F,-2px -2px 2px #44F,2px 2px 2px #44F,-2px 2px 2px #44F,2px -2px 2px #44F,-2px -2px 2px #44F;
}

/*【黄色系Hover(8)】*/
.BClassArrow_NO8:hover {
  background-image: linear-gradient(to bottom, #A0A, #FCF, #A0A);
  background-image: linear-gradient(to bottom, #AA0, #FFC, #AA0);
  /*【文字の縁取り】*/
  text-shadow: 2px 2px 2px #800,-2px 2px 2px #800,2px -2px 2px #800,-2px -2px 2px #800,2px 2px 2px #800,-2px 2px 2px #800,2px -2px 2px #800,-2px -2px 2px #800;
  text-shadow: 2px 2px 2px #A00,-2px 2px 2px #A00,2px -2px 2px #A00,-2px -2px 2px #A00,2px 2px 2px #A00,-2px 2px 2px #A00,2px -2px 2px #A00,-2px -2px 2px #A00;
  text-shadow: 2px 2px 2px #F00,-2px 2px 2px #F00,2px -2px 2px #F00,-2px -2px 2px #F00,2px 2px 2px #F00,-2px 2px 2px #F00,2px -2px 2px #F00,-2px -2px 2px #F00;
  text-shadow: 2px 2px 2px #C00,-2px 2px 2px #C00,2px -2px 2px #C00,-2px -2px 2px #C00,2px 2px 2px #C00,-2px 2px 2px #C00,2px -2px 2px #C00,-2px -2px 2px #C00;
  /*【なし】【上下２本線の色と太さ】*/
}

/*【茶色系ボタン(9:Lilipop)】*/
.BClassArrow_NO9{
  border-top: 1.5px solid #FEC;
  border-left: 1.5px solid #FEC;
  border-right: 2px solid #A62;
  border-bottom: 2px solid #A62;
  color: #008;
  color: #FFF;
  /*【文字の縁取り】*/
  text-shadow: 1px 1px 1px #FAA,-1px 1px 1px #FAA,1px -1px 1px #FAA,-1px -1px 1px #FAA,1px 1px 1px #FAA,-1px 1px 1px #FAA,1px -1px 1px #FAA,-1px -1px 1px #FAA;
  text-shadow: 2px 2px 2px #753,-2px 2px 2px #753,2px -2px 2px #753,-2px -2px 2px #753,2px 2px 2px #753,-2px 2px 2px #753,2px -2px 2px #753,-2px -2px 2px #753;
}

/*【茶色系Hover(9)】*/
.BClassArrow_NO9:hover{
  background-image: linear-gradient(to bottom, #F8F, #FEF, #F8F);
  background-image: linear-gradient(to bottom, #FA7, #A85, #753);
  /*【文字の縁取り】*/
  text-shadow: 2px 2px 2px #00F,-2px 2px 2px #00F,2px -2px 2px #00F,-2px -2px 2px #00F,2px 2px 2px #00F,-2px 2px 2px #00F,2px -2px 2px #00F,-2px -2px 2px #00F;
  /*【上下２本線の色と太さ】*/
  border-top: 2px solid #00F;
  border-bottom: 2px solid #00F;

  border-top: 2px solid #000;
  border-bottom: 2px solid #000;
}

/* ================================================================================ */
/* 【BClassArrowボタンクラス】【終了】                                              */
/* ================================================================================ */

/************************************************************************************/
/* 【Box(X)Title,.Box(X)NoTitleの設定】【PC用とスマホ用の共通の設定】【開始】       */
/* 【機能】タイトル付きボックス(Box(X)Title)、タイトルなしボックス(Box(X)NoTitle)   */
/************************************************************************************/

.Box01Title,.Box01NoTitle,.Box02Title,.Box02NoTitle,.Box03Title,.Box03NoTitle,.Box04Title,.Box04NoTitle,.Box05Title,.Box05NoTitle,.Box06Title,.Box06NoTitle,.Box07Title,.Box07NoTitle,.Box08Title,.Box08NoTitle,.Box09Title,.Box09NoTitle {
    position: relative;
	/* margin 上下、左右(emはフォントサイズの高さを 1 )(上、右、下、左) */
    margin: 2.7em 0.5em 1.5em 0.5em;
	/* padding 上下、左右(emはフォントサイズの高さを 1 )(上、右、下、左) */
    padding: 0.6em 0.8em;
	padding:0.6em 0.6em 0.3em 0.6em;
    border: double 3px #88D;
    border: double 3px #D88;
	background-image: linear-gradient(0deg, #FFF0F0 0%,#FFFEFE 50%, #FFFEFE 80%,#FFEAEA 100%);
	background-image: linear-gradient(0deg, #F8F8FF 0%,#FEFFFF 50%, #FFFFFF 80%,#EAEAFF 100%);
}
.Box01NoTitle,.Box02NoTitle,.Box03NoTitle,.Box04NoTitle,.Box05NoTitle,.Box06NoTitle,.Box07NoTitle,.Box08NoTitle,.Box09NoTitle {
	/* margin 上下、左右(emはフォントサイズの高さを 1 )(上、右、下、左) */
    margin: 1em 0.5em 1.5em 0.5em;
    padding-top: 0.3em;
}
.Box01Title .TitleName,.Box02Title .TitleName,.Box03Title .TitleName,.Box04Title .TitleName,.Box05Title .TitleName,.Box06Title .TitleName,.Box07Title .TitleName,.Box08Title .TitleName,.Box09Title .TitleName {
    position: absolute;
    display: inline-block;
    top: -31px;
    left: -3px;
	/* padding 上下、左右(上、右、下、左) */
    padding: 0 9px;
    height: 28px;
    line-height: 28px;
    font-size: 17px;
    background: #62c1ce;
    background: #C44;
	background-image: linear-gradient(0deg, #F44 0%,#C44 50%,#800 80%,#400 100%);
	background-image: linear-gradient(0deg, #44F 0%,#44C 50%,#008 80%,#004 100%);
	background-image: linear-gradient(0deg, #ADF 0%,#44C 35%,#008 80%,#004 100%);
	background-image: linear-gradient(0deg, #DDF 0%,#44C 35%,#008 80%,#004 100%);
    color: #ffffff;
    color: #FF0;
    /* font-weight: bold;*/
    /* border-radius 左上、右上、右下、左下 */
    border-radius: 5px 5px 0 0;
	border-left: 5px solid #AAF;
	border-bottom:4px solid #F00;
}

/*【黄色系】*/
.Box01Title .TitleName,.Box05Title .TitleName {
    background: #FF0;
    color: #FFF;
    color: #00F;
    /* font-weight: bold;*/
	border-bottom:1px solid #00F;
	border-top: 2px solid #00F;
	border-left: 2px solid #00F;
	border-right: 2px solid #00F;

}

/*【緑色系】*/
.Box02Title .TitleName,.Box06Title .TitleName,.Box08Title .TitleName {
	background-image: linear-gradient(0deg, #040 0%,#080 35%,#0C0 70%,#0F0 100%);
    color: #FF0;
    /* font-weight: bold;*/
	border-bottom:1px solid #080;
	border-top: 2px solid #040;
	border-left: 2px solid #040;
	border-right: 2px solid #040;

}

/*【赤色系】*/
.Box03Title .TitleName,.Box07Title .TitleName,.Box09Title .TitleName {
	background-image: linear-gradient(0deg, #400 0%,#800 35%,#C00 70%,#F00 100%);
    color: #FFF;
    /* font-weight: bold;*/
	border-bottom:1px solid #F00;
	border-top: 2px solid #F00;
	border-left: 2px solid #F00;
	border-right: 2px solid #F00;

}

/* ================================================================================ */
/* 【Box(X)Title,.Box(X)NoTitleの設定】【終了】                                     */
/* ================================================================================ */

/************************************************************************************/
/* 【FrameMenuクラス】【PC用とスマホ用の共通の設定】【開始】                          */
/* 【機能】県、市区町村、寺院を前後に移動するボタンを囲う枠のフレームを設定する。   */
/************************************************************************************/
.FrameMenu {

	/*margin 上、右、下、左*/
	margin: 2px 0px 2px 0px;
	/*padding 上、右、下、左*/
	padding: 0px 0px 0px 0px;
	display:flex;
	flex-direction: row;          /* 配置方向（横並び） */
	flex-wrap: wrap;           /* 折り返し設定 */
	justify-content: flex-start; /* 主軸方向の配置 */
	align-items: stretch;        /* 交差軸方向の配置 */
	gap: 6px; /* ← ボタン間の間隔を指定 */
	row-gap: 0px; /* ← 行と行の縦間隔を設定！ */
	/*text-align: center;*//*htmlで指定するので不要*/

	border-radius: 6px;
	box-shadow:0 0 0 1px rgba(255,255,255,0.5) inset;
	background-image: linear-gradient(0deg, #0F0 0%,#080 80%, #080 90%,#0C0 100%);

}

.FrameMenu a{
	/*margin 上、右、下、左*/
	margin: 1px 0px 1px 0px;
	/*padding 上、右、下、左*/
	padding: 0px 7px 0px 7px;
	display:inline-flex;
	justify-content: center;
	align-items: center;
	width: auto;
	line-height:0.98;
	box-sizing: border-box;
	height: 28px;
	text-align: center;
	background: #000;
	font-weight: none;
	text-decoration: none;
	border-radius: 5px;
	color: #FFF;
	position: relative;
	text-shadow:1px 1px 0 rgba(255,255,255,1);
	box-shadow:0 0 0 1px rgba(255,255,255,0.5) inset;
	background-image: linear-gradient(to bottom,
          rgba(180, 180, 180, 1.0),
          rgba(253, 253, 253, 1.0) 25%,
          rgba(240, 240, 240, 1.0) 30%,
          rgba(253, 253, 253, 1.0) 36%,
          rgba(225, 225, 225, 1.0) 50%,
          rgba(200, 200, 200, 1.0) 80%,
          rgba(170, 170, 170, 1.0)
          );
	border-top: 1.5px solid #EEE;
	border-left: 1.5px solid #EEE;
	border-right: 2.5px solid #222;
	border-bottom: 2.5px solid #222;

/*	text-shadow: 2px 2px 2px #080,-2px 2px 2px #080,2px -2px 2px #080,-2px -2px 2px #080,2px 2px 2px #080,-2px 2px 2px #080,2px -2px 2px #080,-2px -2px 2px #080;
*/
}

.FrameMenu a:hover {
  color: #000;
  color: #FFF;
  text-shadow: 0 1px 1px rgba(255, 255, 255, .5);
  text-shadow: 2px 2px 2px #333,-2px 2px 2px #333,2px -2px 2px #333,-2px -2px 2px #333,2px 2px 2px #333,-2px 2px 2px #333,2px -2px 2px #333,-2px -2px 2px #333;

  background-image: linear-gradient(to bottom, #2be, #29c);
  background-image: linear-gradient(to bottom, #A00, #FCC, #A00);

}

/*********************/
/*FrameMenu1,4,8(青系) */
/*********************/

.FrameMenu1,.FrameMenu4,.FrameMenu8 {

	/*margin 上、右、下、左*/
	margin: 3.5px 3.5px 3.5px 3.5px;
	/*padding 上、右、下、左*/
	padding: 0px 0px 0px 0px;
	box-sizing: border-box;
	border: 3.5px double #00F; /*線の太さ・色*/
	position: relative;     /* 基準値とする */



/*	border-top: 2.5px solid #99F;
	border-left: 2.5px solid #99F;
	border-right: 2.5px solid #00F;
	border-bottom: 2.5px solid #00F;
	background-color: #FFC;
*/

	background-image: linear-gradient(0deg, #CCF 0%,#44C 70%, #00F 85%, #00A 90%,#00A 100%);/*青系*/
}
.FrameMenu1::before,.FrameMenu4::before,.FrameMenu8::before {
	content: "";              /* 疑似要素には必須 */
	display: block;           /* ブロック要素にする */
	width: calc(100% + 7.5px);  /* 適度な大きさを指定 */
	height: calc(100% + 8.5px); /* 適度な大きさを指定 */
	border: 2px solid #00F; /*線の太さ・色*/
	border-radius: 5px;
	position: absolute;       /* 相対位置に指定 */
	top: -5.5px;                /* 大きさに合わせて微調整 */
	top: -6.5px;                /* 大きさに合わせて微調整 */
	left: -5.5px;               /* 大きさに合わせて微調整 */
}

.FrameMenu1 a,.FrameMenu4 a,.FrameMenu8 a{
	text-shadow: 2px 2px 2px #080,-2px 2px 2px #080,2px -2px 2px #080,-2px -2px 2px #080,2px 2px 2px #080,-2px 2px 2px #080,2px -2px 2px #080,-2px -2px 2px #080;/*緑系*/
	text-shadow: 2px 2px 2px #800,-2px 2px 2px #800,2px -2px 2px #800,-2px -2px 2px #800,2px 2px 2px #800,-2px 2px 2px #800,2px -2px 2px #800,-2px -2px 2px #800;/*赤系*/
	text-shadow: 2px 2px 2px #008,-2px 2px 2px #008,2px -2px 2px #008,-2px -2px 2px #008,2px 2px 2px #008,-2px 2px 2px #008,2px -2px 2px #008,-2px -2px 2px #008;/*青系*/
}

/*******************/
/*FrameMenu2,6(緑系) */
/*******************/

.FrameMenu2,.FrameMenu6 {

	box-sizing: border-box;
	/*border: 1px solid #0F0;*/ /*緑色は色が強いため、1.5pxでなく1pxにする*/
	border-top: 1.5px solid #9F9;/*緑色は色が強いため、2.5pxでなく1.5pxにする*/
	border-left: 1.5px solid #9F9;/*緑色は色が強いため、2.5pxでなく1.5pxにする*/
	border-right: 1.5px solid #0F0;/*緑色は色が強いため、2.5pxでなく1.5pxにする*/
	border-bottom: 1.5px solid #0F0;/*緑色は色が強いため、2.5pxでなく1.5pxにする*/
	background-color: #FFC;

	background-image: linear-gradient(0deg, #66F 0%,#008 80%, #008 90%,#00C 100%);/*青系*/
	background-image: linear-gradient(0deg, #F66 0%,#800 80%, #800 90%,#C00 100%);/*赤系*/
	background-image: linear-gradient(0deg, #0F0 0%,#080 80%, #080 90%,#0C0 100%);/*緑系*/

}

.FrameMenu2 a,.FrameMenu6 a{
	text-shadow: 2px 2px 2px #800,-2px 2px 2px #800,2px -2px 2px #800,-2px -2px 2px #800,2px 2px 2px #800,-2px 2px 2px #800,2px -2px 2px #800,-2px -2px 2px #800;/*赤系*/
	text-shadow: 2px 2px 2px #008,-2px 2px 2px #008,2px -2px 2px #008,-2px -2px 2px #008,2px 2px 2px #008,-2px 2px 2px #008,2px -2px 2px #008,-2px -2px 2px #008;/*青系*/
	text-shadow: 2px 2px 2px #080,-2px 2px 2px #080,2px -2px 2px #080,-2px -2px 2px #080,2px 2px 2px #080,-2px 2px 2px #080,2px -2px 2px #080,-2px -2px 2px #080;/*緑系*/
}


/*********************/
/*FrameMenu3,5,7(赤系) */
/*********************/

/*********************/
/*FrameMenu3,5,7(赤系) */
/*********************/

.FrameMenu3,.FrameMenu5,.FrameMenu7 {

	/*margin 上、右、下、左*/
	margin: 3.5px 3.5px 3.5px 3.5px;
	/*padding 上、右、下、左*/
	padding: 0px 0px 0px 0px;
	box-sizing: border-box;
	border: 3.5px double #F00; /*線の太さ・色*/
	position: relative;     /* 基準値とする */

/*	border-top: 2.5px solid #F99;
	border-left: 2.5px solid #F99;
	border-right: 2.5px solid #F00;
	border-bottom: 2.5px solid #F00;
	background-color: #FFC;
*/

	background-image: linear-gradient(0deg, #0F0 0%,#080 80%, #080 90%,#0C0 100%);/*緑系*/
	background-image: linear-gradient(0deg, #66F 0%,#008 80%, #008 90%,#00C 100%);/*青系*/
	background-image: linear-gradient(0deg, #F66 0%,#800 80%, #800 90%,#C00 100%);/*赤系*/
	background-image: linear-gradient(0deg, #FCC 0%,#C44 70%, #E00 85%, #F00 90%,#C00 100%);/*赤系*/

}
.FrameMenu3::before,.FrameMenu5::before,.FrameMenu7::before {
	content: "";              /* 疑似要素には必須 */
	display: block;           /* ブロック要素にする */
	width: calc(100% + 7.5px);  /* 適度な大きさを指定 */
	height: calc(100% + 8.5px); /* 適度な大きさを指定 */
	border: 2px solid #F00; /*線の太さ・色*/
	border-radius: 5px;
	position: absolute;       /* 相対位置に指定 */
	top: -5.5px;                /* 大きさに合わせて微調整 */
	top: -6.5px;                /* 大きさに合わせて微調整 */
	left: -5.5px;               /* 大きさに合わせて微調整 */
}
.FrameMenu3 a,.FrameMenu5 a,.FrameMenu7 a{
	text-shadow: 2px 2px 2px #080,-2px 2px 2px #080,2px -2px 2px #080,-2px -2px 2px #080,2px 2px 2px #080,-2px 2px 2px #080,2px -2px 2px #080,-2px -2px 2px #080;/*緑系*/
	text-shadow: 2px 2px 2px #008,-2px 2px 2px #008,2px -2px 2px #008,-2px -2px 2px #008,2px 2px 2px #008,-2px 2px 2px #008,2px -2px 2px #008,-2px -2px 2px #008;/*青系*/
	text-shadow: 2px 2px 2px #842,-2px 2px 2px #842,2px -2px 2px #842,-2px -2px 2px #842,2px 2px 2px #842,-2px 2px 2px #842,2px -2px 2px #842,-2px -2px 2px #842;/*茶系*/
	text-shadow: 2px 2px 2px #800,-2px 2px 2px #800,2px -2px 2px #800,-2px -2px 2px #800,2px 2px 2px #800,-2px 2px 2px #800,2px -2px 2px #800,-2px -2px 2px #800;/*赤系*/
}




/*****************/
/*FrameMenu9(茶系) */
/*****************/


/*****************/
/*FrameMenu9(茶系) */
/*****************/


.FrameMenu9 {

	/*margin 上、右、下、左*/
	margin: 3.5px 3.5px 3.5px 3.5px;
	/*padding 上、右、下、左*/
	padding: 0px 0px 0px 0px;
	box-sizing: border-box;
	border:2.5px solid #842; /*線の太さ・色*/
	border: 3px double #842; /*線の太さ・色*/
	position: relative;     /* 基準値とする */


/*	border-top: 2.5px solid #A53;
	border-left: 2.5px solid #A53;
	border-right: 2.5px solid #421;
	border-bottom: 2.5px solid #421;
*/
/*	background-color: #FFC;
*/


	background-image: linear-gradient(0deg, #F84 0%,#842 80%, #842 90%,#C63 100%);/*茶系*/
	background-image: linear-gradient(0deg, #FDC 0%,#842 80%, #842 90%,#C63 100%);/*茶系*/
	background-image: linear-gradient(0deg, #FDC 0%,#A63 80%, #842 90%,#EB8 100%);/*茶系*/

	}

.FrameMenu9::before {
	content: "";              /* 疑似要素には必須 */
	display: block;           /* ブロック要素にする */
	width: calc(100% + 6.0px);  /* 適度な大きさを指定 */
	height: calc(100% + 5.5px); /* 適度な大きさを指定 */
	border: 2px solid #A41; /*線の太さ・色*/
	border-radius: 5px;
	position: absolute;       /* 相対位置に指定 */
	top: -5.5px;                /* 大きさに合わせて微調整 */
	left: -5.0px;               /* 大きさに合わせて微調整 */
}


.FrameMenu9 a{
	text-shadow: 2px 2px 2px #842,-2px 2px 2px #842,2px -2px 2px #842,-2px -2px 2px #842,2px 2px 2px #842,-2px 2px 2px #842,2px -2px 2px #842,-2px -2px 2px #842;/*茶系*/
}

/* ================================================================================ */
/* 【FrameMenuクラス】【終了】                                                        */
/* ================================================================================ */


/************************************************************************************/
/* 【FrameBBクラス】【PC用とスマホ用の共通の設定】【開始】                          */
/* 【機能】県、市区町村、寺院を前後に移動するボタンを囲う枠のフレームを設定する。   */
/************************************************************************************/
.FrameBB {

	/*margin 上、右、下、左*/
	margin: 2px 0px 2px 0px;
	/*padding 上、右、下、左*/
	padding: 0px 0px 0px 0px;
	line-height:95%; /*ボタンの間隔*/

	/*text-align: center;*//*htmlで指定するので不要*/

	/*【Flexboxで要素を均等に配置】*/
	justify-content: space-evenly; /*すべてのスペースが均等に分配される（要素間も端の余白も同じ）*/
	justify-content: space-between; /*最初と最後の要素を端に寄せて、残りのスペースを均等に配置します*/
	justify-content: space-around; /*各要素の前後に均等なスペースが入るが、端のスペースが半分になる*/

	border-radius: 6px;

	box-shadow:0 0 0 1px rgba(255,255,255,0.5) inset;
	background-image: linear-gradient(to bottom,
          rgba(140, 140, 140, 1.0),
          rgba(250, 250, 250, 1.0) 25%,
          rgba(220, 220, 220, 1.0) 30%,
          rgba(250, 250, 250, 1.0) 36%,
          rgba(225, 225, 225, 1.0) 50%,
          rgba(160, 160, 160, 1.0) 80%,
          rgba(120, 120, 120, 1.0)
          );

}

/*********************/
/*FrameBB1,4,8(青系) */
/*********************/

.FrameBB1,.FrameBB4,.FrameBB8 {

	box-sizing: border-box;
	/*border: 1.5px solid #44F;*/
	border-top: 2.5px solid #99F;
	border-left: 2.5px solid #99F;
	border-right: 2.5px solid #00F;
	border-bottom: 2.5px solid #00F;
	background-color: #FFC;

}

/*******************/
/*FrameBB2,6(緑系) */
/*******************/

.FrameBB2,.FrameBB6 {

	box-sizing: border-box;
	/*border: 1px solid #0F0;*/ /*緑色は色が強いため、1.5pxでなく1pxにする*/
	border-top: 1.5px solid #9F9;/*緑色は色が強いため、2.5pxでなく1.5pxにする*/
	border-left: 1.5px solid #9F9;/*緑色は色が強いため、2.5pxでなく1.5pxにする*/
	border-right: 1.5px solid #0F0;/*緑色は色が強いため、2.5pxでなく1.5pxにする*/
	border-bottom: 1.5px solid #0F0;/*緑色は色が強いため、2.5pxでなく1.5pxにする*/
	background-color: #FFC;

}

/*********************/
/*FrameBB3,5,7(赤系) */
/*********************/

.FrameBB3,.FrameBB5,.FrameBB7 {

	box-sizing: border-box;
	/*border: 1.5px solid #F44;*/
	border-top: 2.5px solid #F99;
	border-left: 2.5px solid #F99;
	border-right: 2.5px solid #F00;
	border-bottom: 2.5px solid #F00;
	background-color: #FFC;

}

/*****************/
/*FrameBB9(茶系) */
/*****************/


.FrameBB9 {

	box-sizing: border-box;
	/*border: 2px solid #842;*/ /*線の太さ・色*/
	border-top: 2.5px solid #A53;
	border-left: 2.5px solid #A53;
	border-right: 2.5px solid #421;
	border-bottom: 2.5px solid #421;
	background-color: #FFC;
	}

/* ================================================================================ */
/* 【FrameBBクラス】【終了】                                                        */
/* ================================================================================ */


/*---------------------------------------------------------------------------*/
/*【PC用だけの設定】スクリーン・サイズが641pixel以上の場合
/*---------------------------------------------------------------------------*/
/*@media screen and (min-width: 481px) {*/
/*571pxの理由は、Xpedia ZやGalaxy 4Sが360px × 568pxのため、横でもスマホ用にするため。*/
@media screen and (min-width: 641px) {


/* 【重要】@media screen and (max-width: 480px)は一番下の方で定義しないと上書きできないため有効にならない */
/* 【重要】@media screen and (max-width: 480px)は一番下の方で定義しないと上書きできないため有効にならない */
/* 【重要】@media screen and (max-width: 480px)は一番下の方で定義しないと上書きできないため有効にならない */
/* 【重要】@media screen and (max-width: 480px)は一番下の方で定義しないと上書きできないため有効にならない */
/* 【重要】@media screen and (max-width: 480px)は一番下の方で定義しないと上書きできないため有効にならない */


/******************************************/
/*共通部分の置き換え(開始)*/
/******************************************/


/*---------------------------------------------------------------------------*/
/* PCのみ表示、スマホは非表示【スマホ用の設定】 */
/*---------------------------------------------------------------------------*/

/* =======================================================================
ハンバーガーメニュー用追加【開始】
======================================================================= */

.NonPCOnly{
	display:none!important;
}

/* =======================================================================
ハンバーガーメニュー用追加【終了】
======================================================================= */

/*==================================================*/
/*共通部分の置き換え(終了)　　　　　　　　　　　　　*/
/*==================================================*/

}

/*【スマホ用の設定】【スマホ用の設定】【スマホ用の設定】【スマホ用の設定】【スマホ用の設定】*/
/*【スマホ用の設定】【スマホ用の設定】【スマホ用の設定】【スマホ用の設定】【スマホ用の設定】*/
/*【スマホ用の設定】【スマホ用の設定】【スマホ用の設定】【スマホ用の設定】【スマホ用の設定】*/
/*---------------------------------------------------------------------------*/
/*【スマホ用の設定】スクリーン・サイズが640pixel以下の場合*/
/*---------------------------------------------------------------------------*/
/*@media screen and (max-width: 480px) {*/
/*570pxの理由は、Xpedia ZやGalaxy 4Sが360px × 568pxのため、横でもスマホ用にするため。*/
@media screen and (max-width: 640px) {



/******************************************/
/*共通部分の置き換え【スマホ用の設定】(開始)*/
/******************************************/

/*---------------------------------------------------------------------------*/
/* PCのみ表示、スマホは非表示【スマホ用の設定】 */
/*---------------------------------------------------------------------------*/
.PCOnly{
	display:none!important;
}

.MDspImg1 img,.MDspImg2 img,.MDspImg3 img,.MDspImg4 img,.MDspImg5 img,.MDspImg6 img,.MDspImg7 img,.MDspImg8 img,.MDspImg9 img {
	width:155px;
	width:100px;
	width:120px;
	height:114px;
	height:74px;
	height:89px;
;
}

.Box01Title,.Box01NoTitle,.Box02Title,.Box02NoTitle,.Box03Title,.Box03NoTitle,.Box04Title,.Box04NoTitle,.Box05Title,.Box05NoTitle,.Box06Title,.Box06NoTitle,.Box07Title,.Box07NoTitle,.Box08Title,.Box08NoTitle,.Box09Title,.Box09NoTitle {
	font-size : 14px ;
}
.Box01Title .TitleName,.Box02Title .TitleName,.Box03Title .TitleName,.Box04Title .TitleName,.Box05Title .TitleName,.Box06Title .TitleName,.Box07Title .TitleName,.Box08Title .TitleName,.Box09Title .TitleName {
	font-size : 14px ;
}



}

/*==================================================*/
/*共通部分の置き換え【スマホ用の設定】(終了)        */
/*==================================================*/


/*==================================================*/
/* 【重要】この下は、最後の括弧が１つある。 */
/*==================================================*/

}
