@charset "UTF-8";

/*------------------------------------------------------------------------------
	Hamamatsu Visitors and Convention Bureau. - KOHOKUGOZAN CSS
	URL: http://hamamatsu-daisuki.net/
	Date: 2016-05-10
	Copyright (C) Hamamatsu Visitors and Convention Bureau. All Rights Reserved.
------------------------------------------------------------------------------*/
body#kohokugozanIndex {
	font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}
body#kohokugozanIndex p{
	font-size:110%;
	line-height:1.8;
}
body#kohokugozanIndex #sub .bnr,
body#kohokugozanIndex #sub .navigation,
body#kohokugozanIndex #sub #ranking{
	display:none;
}
body#kohokugozanIndex #wrapper #wrapperInner #main {
	width:100%;
}
body#kohokugozanIndex #main .section{
    background: #fff;
    border-radius: 10px;
    box-shadow: rgb(111, 170, 219) 0px 5px 0px -1px;
    -webkit-box-shadow: rgb(111, 170, 219) 0px 5px 0px -1px;
    -moz-box-shadow: rgb(111, 170, 219) 0px 5px 0px -1px;
    padding: 5px;
    margin-bottom: 20px;
}

/*NAVIGATION*/
body#kohokugozanIndex #templeNavi {
	border:5px solid #fff;
	border-radius:10px;
	width:129px;
	position:fixed;
	right:20px;
	top:100px;
	display:none;
	background:#fff;
	overflow:hidden;
}
body#kohokugozanIndex #templeNavi a{
	-webkit-transition: all 1s ease;
	transition: all 1s ease;
	display:block;
}
body#kohokugozanIndex #templeNavi a:hover{
	opacity:0.6;
}

/*MAP CANVAS*/
body#kohokugozanIndex #mainvisual{
	overflow:hidden;
	position:relative;
}
body#kohokugozanIndex #map-canvas{
	height:540px;
	border-radius:5px 5px 0 0;
}
body#kohokugozanIndex #mainvisual .overlayBox{
	background-color:rgba(21,47,90,0.34);
	position:absolute;
	top:0;
	left:0;
	height:100%;
	width:100%;
	z-index:99;
	border-radius:5px 5px 0 0;
}
body#kohokugozanIndex #mainvisual #kohokugozanTitle span{
	vertical-align:top;
	display:inline-block;
}
body#kohokugozanIndex #mainvisual #kohokugozanTitle{
	position: absolute;
    top: 50%;
    left: 50%;
    margin-right: -50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
	width:180px;
	text-align:center;
	background:url(../../kohokugozan/img/bg_hamanako.png) no-repeat center center;
}
body#kohokugozanIndex #introductionArea {
	text-align:center;
	padding:40px 0;
	background:url(../../kohokugozan/img/bg_hamanako_point.png) no-repeat center top;	
}
body#kohokugozanIndex #introductionArea .minFont{
	font-size:170%;
	color:#2c356b;
	line-height:2;
	font-family:"ヒラギノ明朝 Pro W3","ＭＳ Ｐ明朝", "MS PMincho","Hiragino Mincho Pro", serif;
	margin-bottom:0;
}

body#kohokugozanIndex .temple{
	overflow:hidden;
	padding-bottom:110px;
	margin-bottom:40px;
}
body#kohokugozanIndex .mvBox{
	position:relative;
}
body#kohokugozanIndex .templeTitle{
	position: absolute;
    top: 50%;
    left: 50%;
    margin-right: -50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
	
}
body#kohokugozanIndex .englishTitle,
body#kohokugozanIndex .mainTitle{
	display:inline-block;
	vertical-align:top;
}
body#kohokugozanIndex .mainTitle{
	margin-right:6px;
	font-size:100%;
	font-weight:normal;
}
body#kohokugozanIndex .mainTitle img{
	display:block;
	margin-bottom:15px;
}


body#kohokugozanIndex .textField{
	color:#fff;
	width:685px;
	padding:30px 0 30px 30px;
	box-sizing:border-box;
}
body#kohokugozanIndex .textField .textBox{
	padding:0 165px 30px 0;
	margin-bottom:30px;
	border-bottom:1px solid rgba(255,255,255,0.4);
	position:relative;
}
body#kohokugozanIndex .textField .kohokuPoint{
	position:absolute;
	bottom:0;
	right:20px;
}
body#kohokugozanIndex .textField .infoTable{
	width:390px;
	margin-right:30px;
	margin-bottom:0;
}
body#kohokugozanIndex .textField .infoTable th,
body#kohokugozanIndex .textField .infoTable td{
	background:none;
	border:none;
	line-height:1.3;
	font-size:90%;
}
body#kohokugozanIndex .textField .infoTable th{
	font-weight:normal;
	width:30%;
}
body#kohokugozanIndex .textField .infoTable tr:nth-child(odd) th,
body#kohokugozanIndex .textField .infoTable tr:nth-child(odd) td{
	background:rgba(0,0,0,0.17);
}
body#kohokugozanIndex .photo02{
	width:265px;
	box-sizing:border-box;
	padding:30px;
}
body#kohokugozanIndex .url a{
	color:#fff;
	padding-left:20px;
	background:url(../../kohokugozan/img/ico_externallink.png) no-repeat left center;
	background-size:auto 70% !important;
}
body#kohokugozanIndex .note{
	display:block;
	font-size:90%;
	padding-left:30px;
	margin-top:5px;
}
body#kohokugozanIndex .photo03{
	width:458px;
}
/*▽▽layoutL▽▽*/
body#kohokugozanIndex .layoutL .textField{
	float:left;
}
body#kohokugozanIndex .layoutL .photo02{
	float:right;
}
body#kohokugozanIndex .layoutL .photo03{
	float:right;
	margin:-260px 30px 0 0;
}
/*▽▽layoutR▽▽*/
body#kohokugozanIndex .layoutR .textField{
	float:right;
}
body#kohokugozanIndex .layoutR .photo02{
	float:left;
}
body#kohokugozanIndex .layoutR .photo03{
	margin:-260px 0 0 30px;
	float:left;
}
body#kohokugozanIndex .layoutR .infoTable{
	float:right;
}
/*▽▽SHOSANHOURINJI▽▽*/
body#kohokugozanIndex #shosanhourinji{
	background:url(../../kohokugozan/img/pho_separator001.png) no-repeat right bottom;
}
body#kohokugozanIndex #shosanhourinji .textField{
	background:#2e3667;
}
body#kohokugozanIndex #shosanhourinji .note{
	color:#2e3667;
	background:url(../../kohokugozan/img/ico_note001.png) no-repeat left 4px;
}
body#kohokugozanIndex #shosanhourinji .templeTitle{
	padding-top:80px;
}
/*△△SHOSANHOURINJI△△*/
/*▽▽RYOUTANJI▽▽*/
body#kohokugozanIndex #ryoutanji{
	background:url(../../kohokugozan/img/pho_separator002.png) no-repeat left bottom;
}
body#kohokugozanIndex #ryoutanji .textField{
	background:#466c3a;
}
body#kohokugozanIndex #ryoutanji .note{
	color:#466c3a;
	background:url(../../kohokugozan/img/ico_note002.png) no-repeat left 4px;
}
/*△△RYOUTANJI△△*/
/*▽▽HOUKOUJI▽▽*/
body#kohokugozanIndex #houkouji{
	background:url(../../kohokugozan/img/pho_separator003.png) no-repeat right bottom;
}
body#kohokugozanIndex #houkouji .textField{
	background:#9b7543;
}
body#kohokugozanIndex #houkouji .note{
	color:#9b7543;
	background:url(../../kohokugozan/img/ico_note003.png) no-repeat left 4px;
}
/*△△HOUKOUJI△△*/
/*▽▽MAKAYAJI▽▽*/
body#kohokugozanIndex #makayaji{
	background:url(../../kohokugozan/img/pho_separator004.png) no-repeat center bottom;
}
body#kohokugozanIndex #makayaji .textField{
	background:#3d597b;
}
body#kohokugozanIndex #makayaji .note{
	color:#3d597b;
	background:url(../../kohokugozan/img/ico_note004.png) no-repeat left 4px;
}
body#kohokugozanIndex #makayaji .photo03{
	margin-top:-147px;
}
/*△△MAKAYAJI△△*/
/*▽▽DAIFUKUJI▽▽*/
body#kohokugozanIndex #daifukuji{
	background:url(../../kohokugozan/img/pho_separator001.png) no-repeat right bottom;
}
body#kohokugozanIndex #daifukuji .textField{
	background:#6b9238;
}
body#kohokugozanIndex #daifukuji .note{
	color:#6b9238;
	background:url(../../kohokugozan/img/ico_note005.png) no-repeat left 4px;
}
/*△△DAIFUKUJI△△*/



/*==============================================================
　.cssanimations  : アニメーション
===============================================================*/
.cssanimations .mainTitle img,
.cssanimations .englishTitle,
.cssanimations .hamanakoTitle{
	opacity:0;
}
.cssanimations #mainvisual .action .mainTitle img:nth-child(1){
	-webkit-animation:mainFadeIn 1s ease-out 1s 1 forwards;
    animation:mainFadeIn 1s ease-out 1s 1 forwards;
}
.cssanimations #mainvisual .action .mainTitle img:nth-child(2){
	-webkit-animation:mainFadeIn 1s ease-out 1.5s 1 forwards;
    animation:mainFadeIn 1s ease-out 1.5s 1 forwards;
}
.cssanimations #mainvisual .action .mainTitle img:nth-child(3){
	-webkit-animation:mainFadeIn 1s ease-out 2s 1 forwards;
    animation:mainFadeIn 1s ease-out 2s 1 forwards;
}
.cssanimations #mainvisual .action .mainTitle img:nth-child(4){
	-webkit-animation:mainFadeIn 1s ease-out 2.5s 1 forwards;
    animation:mainFadeIn 1s ease-out 2.5s 1 forwards;
}
.cssanimations #mainvisual .action .mainTitle img:nth-child(5){
	-webkit-animation:mainFadeIn 1s ease-out 3s 1 forwards;
    animation:mainFadeIn 1s ease-out 3s 1 forwards;
}

.cssanimations .temple.action .mainTitle img:nth-child(1){
	-webkit-animation:mainFadeIn 1s ease-out 0.5s 1 forwards;
    animation:mainFadeIn 1s ease-out 0.5s 1 forwards;
}
.cssanimations .temple.action .mainTitle img:nth-child(2){
	-webkit-animation:mainFadeIn 1s ease-out 1s 1 forwards;
    animation:mainFadeIn 1s ease-out 1s 1 forwards;
}
.cssanimations .temple.action .mainTitle img:nth-child(3){
	-webkit-animation:mainFadeIn 1s ease-out 1.5s 1 forwards;
    animation:mainFadeIn 1s ease-out 1.5s 1 forwards;
}
.cssanimations .temple.action .mainTitle img:nth-child(4){
	-webkit-animation:mainFadeIn 1s ease-out 2s 1 forwards;
    animation:mainFadeIn 1s ease-out 2s 1 forwards;
}
.cssanimations .temple.action .mainTitle img:nth-child(5){
	-webkit-animation:mainFadeIn 1s ease-out 2.5s 1 forwards;
    animation:mainFadeIn 1s ease-out 2.5s 1 forwards;
}




.cssanimations .action .englishTitle{
	-webkit-animation:fadeIn 1s ease-out 0.5s 1 forwards;
    animation:fadeIn 1s ease-out 0.5s 1 forwards;
}
.cssanimations .action .hamanakoTitle{
	-webkit-animation:fadeIn 1s ease-out 0s 1 forwards;
    animation:fadeIn 1s ease-out 0s 1 forwards;
}
.cssanimations .textBox,
.cssanimations .photo02,
.cssanimations .photo03,
.cssanimations .infoTable{
	opacity:0;
}
.cssanimations .action .textBox{
	-webkit-animation:fadeIn 1s ease-out 0s 1 forwards;
    animation:fadeIn 1s ease-out 0s 1 forwards;
}
.cssanimations .action .photo02{
	-webkit-animation:fadeIn 1s ease-out 1s 1 forwards;
    animation:fadeIn 1s ease-out 1s 1 forwards;
}
.cssanimations .action .photo03{
	-webkit-animation:fadeIn 1s ease-out 0.4s 1 forwards;
    animation:fadeIn 1s ease-out 0.4s 1 forwards;
}
.cssanimations .action .infoTable{
	-webkit-animation:fadeIn 1s ease-out 0.7s 1 forwards;
    animation:fadeIn 1s ease-out 0.7s 1 forwards;
}

@-webkit-keyframes fadeIn{
  0% {
	  opacity:0;
        -webkit-transform: translate3d(0,20%,0);
        transform: translate3d(0,20%,0);
	  }
  100% {
	  opacity:1;
        -webkit-transform:none;
        transform: none;
	  }
}
@keyframes fadeIn{
  0% {
	  opacity:0;
        -webkit-transform: translate3d(0,20%,0);
        transform: translate3d(0,20%,0);
	  }
  100% {
	  opacity:1;
        -webkit-transform:none;
        transform: none;
	  }
}
@-webkit-keyframes mainFadeIn{
  0% { opacity:0;}

  100% { opacity:1;}
}
@keyframes mainFadeIn{
  0% { opacity:0;}

  100% { opacity:1;}
}


/*==============================================================
　.mobile  : スマホ
===============================================================*/
html.mobile{
	font-size: 100%;
}
.mobile body#kohokugozanIndex {
	font-size: 1.4rem;
}
.mobile body#kohokugozanIndex p{
	font-size:1.6rem;
}
.mobile body#kohokugozanIndex .mvBox{
	overflow:hidden;
}
.mobile body#kohokugozanIndex .mvBox > img{
	float:right;
}
.mobile body#kohokugozanIndex #map-canvas{
	border-radius:0;
}
.mobile body#kohokugozanIndex #main .textField{
	padding:4%;
	width:100%;
}
.mobile body#kohokugozanIndex .textField .textBox{
	padding:0 ;
}
.mobile body#kohokugozanIndex .textField .infoTable{
	width:100%;
	margin:0;
}
.mobile body#kohokugozanIndex .textField .infoTable th,
.mobile body#kohokugozanIndex .textField .infoTable td{
	font-size:1.4rem;
}
.mobile body#kohokugozanIndex .photo02,
.mobile body#kohokugozanIndex .photo03{
	margin:0;
	float:none;
	overflow:hidden;
	width:100%;
	padding:4% 4% 0;	
}
.mobile body#kohokugozanIndex .photo02 img{
	float:left;
	width:32% !important;
	height:auto;
}
.mobile body#kohokugozanIndex .photo02 .note{
	float:left;
	width:64%;
	margin-left:3.2%;
}
.mobile body#kohokugozanIndex .photo03 img{
	width:100% !important;
	height:auto;
}
.mobile body#kohokugozanIndex .note{
	background-position:left 0.5em !important;
}
.mobile body#kohokugozanIndex .telNumber a{
	color:#fff;
	padding-left:30px;
	background:url(../../kohokugozan/img/ico_tellink.png) no-repeat left center;
}
.mobile body#kohokugozanIndex .url{
	padding-left:30px;
	background:url(../../kohokugozan/img/ico_externallink.png) no-repeat left center;
}
.mobile body#kohokugozanIndex #introductionArea .minFont{
	font-size:1.7rem;
	padding:4%
}
.mobile body#kohokugozanIndex #introductionArea .minFont br{
	display:none;
}
























































































/*--EOF-----------------------------------------------------------------------*/
