@charset "utf-8";
/* CSS Document */
html, body, img, div, span, h1, h2, h3, p, ol, ul, li, dl, dt, dd,a{
	margin:0;
	padding:0;
	border:0;
}
ul,li{
	list-style:none;
	margin:0;
	padding:0;
}

body {
	font-family:"ＭＳ Ｐ明朝", "MS PMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", serif;
	color:#fff;
	line-height:1.5rem;
	font-size:87.5%;
 	background:url(../shrine/image/back_img01.jpg) no-repeat center center fixed;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
}


.bg{
	height:100vh;
	width:100%;
}

.box {
  width: 100%;
  height: 100vh;
  color: #fff;
  display: flex;
  align-items: center; /* 縦方向中央揃え */
  justify-content: center; /* 横方向中央揃え */
  flex-direction: column;
}

.box02 {
  width: 100%;
  height: 100vh;
  color: #fff;
  display: flex;
  justify-content: center; /* 横方向中央揃え */
}
@media screen and (max-width: 600px) {
	body {
 		background:none;
	}

	.bg{
		height:100vh;
		width:100%;

	}
	.box {
		width: 100vw;
		height:inherit;
		color: #fff;
		display: flex;
		align-items: center; /* 縦方向中央揃え */
		justify-content: center; /* 横方向中央揃え */
		flex-direction: column;
	}
	.box02 {
		width: 100vw;
		height:inherit;
		color: #fff;
		display: flex;
		justify-content: center; /* 横方向中央揃え */
	}
}

.box__bg_black {
  background-color:rgba(255,255,255,0.45);
}
.box__bg_gray {
  background-color:rgba(0,0,0,0.60);
}

.back_img{
	  background-size: cover;
	  background-position: center center;
	  background-repeat: no-repeat;
	  -webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
}
@media screen and (max-width: 600px) {
	.back_img{
		background-size:cover;
		-webkit-background-size:cover;
		-moz-background-size:cover;
		-o-background-size:cover;
	}
}
.back_img01{
  background-image:url(../shrine/image/back_img01.jpg);
}
.back_img0102{
  background-image:url(../shrine/image/back_img0102.jpg);
}
.back_img02{
  background-image:url(../shrine/image/back_img02.jpg);
}
.back_img0202{
  background-image:url(../shrine/image/back_img0202.jpg);
}
.back_img03{
  background-image:url(../shrine/image/back_img03.jpg);
}
.back_img0302{
  background-image:url(../shrine/image/back_img0302.jpg);
}
.back_img04{
  background-image:url(../shrine/image/back_img04.jpg);
}
.back_img0402{
  background-image:url(../shrine/image/back_img0402.jpg);
}
.back_img05{
  background-image:url(../shrine/image/back_img05.jpg);
}
.back_img06{
  background-image:url(../shrine/image/back_img06.jpg);
}

@media screen and (max-width: 600px) {
.back_img07{
	background-image:url(../shrine/image/back_img01.jpg);
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
	z-index:-10;
}
}



/* ページメニュー */
#menu{
	z-index:2; position:fixed; top:0; width:100%; margin:auto; background-color:rgba(0,0,0,0.45); padding-bottom:1%;
}
#menu h1{
	font-size:430%; text-align:center; padding:3% 0 2% 0;
}
@media screen and (max-width: 600px) {
#menu h1{
	font-size:120%;
}
}
#menu ul{
	width:100%; margin:auto; text-align:center;
}
#menu li{
	display:inline-block; margin-left:50px; line-height:1.2em;
}
#menu li:fast-child{
	margin-left:0;
}
#menu li:last-child{
	margin-right:5%;
}
#menu li span{
	font-size:0.9em;
}

#menu a{
	color:#fff; text-decoration:none; border-bottom:1px solid #fff; padding-bottom:3px; font-size:95%; display:block;
}
#menu a:hover,
#menu a.on{
	border-bottom:1px solid #CB3119; padding-bottom:3px;
}
#menu p{
	color:#fff; text-decoration:none; border-bottom:1px solid #fff; padding-bottom:3px; font-size:95%; display:block;
}

/* ページナビ */
.p_nav{
	width:14px; float:left;
}
.p_nav li{
	margin-bottom:10px;
}
.p_nav a{
	display:block;
	text-indent:-9999px;
	width:8px;
	height:8px;	
}
.p_nav a.nav{
	background:url(../image/common/page_nav01.png) no-repeat;
}
.p_nav a:hover.nav
,.p_nav a.nav_on{
	background:url(../image/common/page_nav01_on.png) no-repeat;
}

/* totop */
 #topbutton {
      /* ▼表示位置を画面の右下に固定 */
      position: fixed; /* ←表示場所を固定 */
      bottom: 18px;   /* ←下端からの距離 */
      right: 18px;    /* ←右端からの距離 */
      width: 32px;     /* ←横幅 */
	  height:32px;

      /* ▼最初は非表示にしておく */
      display: none;
   }
   #topbutton a {
	   background:url(../image/common/to_top.png) no-repeat;
	   display:block;
		text-indent:-9999px;
		width:32px;
		height:32px;
   }
   #topbutton a:hover {
       background:url(../image/common/to_top_on.png) no-repeat;
   }


/* スクロール */
#scroll{
	width:100%; text-align:center; position:absolute; bottom:2%; left:0;
}
#scroll a{
	 background:url(../image/common/scroll.png) no-repeat;
	 display:block; 
	 text-indent:-9999px;
	 width:48px;
	 height:45px;
	 text-align:center;
	 margin:auto;
}
#scroll a:hover{
     background:url(../image/common/scroll_on.png) no-repeat;
}



.box_contents{
	width:90%; margin:8% auto 0 auto;
}

h2{
	text-align:center;
}
.box_contents > h2.english{
	font-size:1.2em; line-height:1.4em; text-align:center; margin:auto;
}
.box_contents > h2.english span{
	font-size:1.5em;
}
@media screen and (max-width: 600px) {
	h2 img{
		width:80%;
	}
}
img.left{
	float:left;
}
img.right{
	float:right;
}


div.second{
	width:80%; text-align:center; margin:auto; padding-top:4%; padding-bottom:0%; overflow:hidden;
}
div.second > p.text01{
	text-align:center; width:100%; margin:50px auto 15px auto; font-size:180%; line-height:2.6rem;
}
div.second > p.text02{
	text-align:left; font-size:180%; line-height:2.6rem;
}
div.second > div.text_area{
	width:55%; float:left;
}
div.second > p.english{
	font-size:1.2em; line-height:1.4em; text-align:left; width:80%; margin:auto; padding-top:4%; padding-bottom:0%; overflow:hidden;
}
div.second > p.japanese{
	font-size:1.15em; line-height:1.4em; width:80%; margin:auto; padding-top:2%; padding-bottom:0%; overflow:hidden;
}
@media screen and (max-width: 600px) {
	div.second > p.english{
		font-size:90%;
	}
	div.second > p.japanese{
		font-size:88%;
	}
}

div.second h3{
	font-size:260%; text-align:center; line-height:2.2rem; margin-bottom:20px; margin-top:50px;
}
div.second h3 span{
	font-size:50%;
}
div.second p.text03{
	text-align:center; font-size:180%; width:100%; margin:auto; line-height:2.6rem; 
}

@media screen and (max-width: 600px) {
	div.second > p.text01{
		text-align:center; width:100%; margin:50px auto 15px auto; font-size:80%; line-height:1.2rem;
	}
	div.second > p.text02{
		text-align:left; font-size:80%; line-height:1.2rem;
	}
	div.second > div.text_area{
		width:55%; float:left;
	}	
	div.second h3{
		font-size:150%; text-align:center; line-height:2.2rem; margin-bottom:20px; margin-top:50px;
	}
	div.second h3 span{
		font-size:50%;
	}
	div.second p.text03{
		text-align:center; font-size:80%; width:100%; margin:auto; line-height:1.2rem; 
	}
}
div.second > div.photo01{
	width:40%; float:right; position:relative; height:350px;
}
div.second > div.photo01 img.p01{
	position:absolute; top:0; left:0; z-index:3; width:60%;
}
div.second > div.photo01 img.p02{
	position:absolute; top:45%; right:0; z-index:2; width:60%;
}
div.second > div.photo01 img.p03{
	position:absolute;top:67%; left:0; z-index:1; width:60%;
}

div.second > img.img01{
	/* margin-right:50px; */ margin-top:10px; width:25%; margin-bottom:5%;
}
div.second > img.img02{
	margin-left:40px; margin-top:10px; width:30%;
}
div.second img.img03{
	margin-left:40px; margin-top:10px; width:30%;
}
div.second img.img04{
	margin-top:10px; width:20%;
}
div.second img.img05{
	margin-top:10px; width:20%; margin-bottom:5%;
}
@media screen and (max-width: 600px) {
	div.second > img.img01{
		/* margin-right:50px; */ margin-top:10px; width:50%; margin-bottom:0;
	}
	div.second > img.img02{
		margin-left:40px; margin-top:10px; width:50%;
	}
	div.second img.img03{
		margin-left:40px; margin-top:10px; width:50%;
	}
	div.second img.img04{
		margin-top:10px; width:60%;
	}
	div.second img.img05{
		margin-top:10px; width:50%; margin-bottom:0;
	}

}

ul.img_box{
	width:100%; margin:0 auto; letter-spacing:-.4em;
}
ul.img_box li{
	display:inline-block; margin-right:2%; letter-spacing:normal;
}
ul.img_box li:last-child{
	margin-right:0;
}
ul.img_box img{
	width:100%;
}
