﻿@charset "utf-8";
/* CSS Document */

* { margin:0; padding:0; font-size:100%; line-height:1.6;}

body { position:relative; min-width:1000px;
 margin:0; padding:0; text-align:center; color:#000; font-size:16px; line-height:1.5;
 font-family:"Roboto Slab" , Garamond , "Times New Roman" , "游明朝" , "Yu Mincho" , "游明朝体" , "YuMincho" , "ヒラギノ明朝 Pro W3" , "Hiragino Mincho Pro" , "HiraMinProN-W3" , "HGS明朝E" , "ＭＳ Ｐ明朝" , "MS PMincho" , serif;
 background:#FFF;}


@media only screen and (max-width: 680px) {
body{ min-width:auto; font-size:15px;}
}

/* Chromeフォント対応 */
@media screen and (-webkit-min-device-pixel-ratio: 0) {
  * { text-shadow: transparent 0 0 0, rgba(0, 0, 0, .7) 0 0 0 !important; }
}


a:link { color:#502558; text-decoration:none; overflow:hidden;}
a:hover { color:#874994; text-decoration:underline;}

#content a:link { text-decoration:underline;}
#content a:hover { text-decoration:none;}

#index #content a:link { text-decoration:none;}
#index #content a:hover { text-decoration:underline;}


img { vertical-align:top; border:none;}
table,th,td { border-collapse:collapse;}
ul,li,dl,dt,dd { list-style-type:none; margin:0; padding:0;}

/* レイアウト ----------------- */

.floatL { float:left;}
.floatR { float:right;}
.alignL { text-align:left;}
.alignR { text-align:right;}
.imgL { float:left; margin:0; padding:0 20px 15px 0;}
.imgR { float:right; margin:0; padding:0 0 15px 20px;}

.pc_img { }
.sp_img { display:none!important; }
@media only screen and (max-width: 680px) {
.pc_img { display:none!important; }
.sp_img { display:block!important; }
}


.clear { clear:both; margin:0; padding:0;}
.center { text-align:center;}

/* フォント ----------------- */
em { color:#F00; font-weight:normal; font-style:normal;}

/* Index ----------------- */
#mv_area { height:200px;}
#mv_area_sp { display:none!important;}

#index .bx-wrapper { box-shadow: none; border: none; margin-bottom: 0; background: #502558;}
#index .bx-wrapper:before { display: block; content: ""; position: absolute; z-index: 1; top: 50%; left: 50%; transform: translate(-50%, -50%); height: 85%; max-height:530px; width: 100%; background: url( "../parts/top_mv_slide_logo.png") no-repeat 50%; background-size: contain;}

#mv_area li,
#mv_area_sp li { position: absolute; top: 0;}

#index #mv_area img,
#index #mv_area_sp img { width:100%;}


@media only screen and (max-width: 680px) {
  #mv_area { display:none!important;}
  #mv_area_sp { display:block!important;}
  #index .bx-wrapper { top: 50px;}
  #index #mv_area { padding:0;}
  #index #mv_area img { width:100%;}
  #index .bx-wrapper:before { height:50%; max-height: ;}
}


/* Header ----------------- */
header { clear:both; width:1080px; margin: 20px auto;}

#navbar { clear:both; width:1080px; margin:0 auto; overflow:hidden;}
header #navbar h1 { float:left;}


#navbar nav { margin: 0 auto;}

#nav-head { display:none;}

#nav-menu { display:block;}
#nav-menu ul { float:right; background:url(../parts/menu_line.png) no-repeat right 8px;}
#nav-menu ul:after { content: "."; display: block; visibility: hidden; height: 0.1px; font-size: 0.1em; line-height: 0; clear: both;}
#nav-menu ul li { display:inline-block; padding:5px 14px 0 14px; background:url(../parts/menu_line.png) no-repeat left 8px; font-size:17px; font-weight:bold;}
#nav-menu ul li:last-child { background-image: url(../parts/menu_line.png),url(../parts/menu_line.png); background-position: left 8px, right 8px; }

header #nav-menu ul li a { text-decoration: none; } /* reset default css */
header #nav-menu ul li a::after { content: ""; display: block; width: 0; margin: 0 auto -1px auto; transition: width 0.3s; border-bottom: 2px solid #C9BD5D;}
header #nav-menu ul li a:hover::after { width: 100%;}
header #nav-menu ul li.sp_menu { display: none;}

@media only screen and (max-width: 680px) {
header { width:100%; margin:0 auto; z-index:100;}

#navbar { width:100%; padding-bottom:5px; position:absolute; top:0; left:0; background:#FFF; z-index:999; overflow:inherit;}
header #navbar h1 { margin:5px 0 0 5px;}

#navbar nav { width:100%; margin: 0;}
#nav-head { display:block;}

/* toggle-panel */
#nav-btn { display:block; position: absolute; top:0; right:0; width: 50px; height:50px; margin:0; padding-top:30px; text-align:center;}

a#nav-btn  { color:#999; text-decoration:none; font-size:11px; font-family: "Sawarabi Mincho"; }

#nav-btn:hover { }
#nav-btn-icon { display: block; position: absolute; top: 17px; left: 23px; width: 18px; height: 2px; margin: -1px 0 0 -7px; background: #999; transition: .2s; }
#nav-btn-icon:before, #nav-btn-icon:after { display: block; content: ""; position: absolute; top: 50%; left: 50%; width: 18px; height: 2px; margin-left: -9px; background: #999; transition: .3s; }
#nav-btn-icon:before { margin-top: -6px; }
#nav-btn-icon:after { margin-top: 4px; }

#nav-btn .close { background: transparent; }
#nav-btn .close:before, #nav-btn .close:after { margin-top: 0; }
#nav-btn .close:before { transform: rotate(-45deg); -webkit-transform: rotate(-45deg); }
#nav-btn .close:after { transform: rotate(-135deg); -webkit-transform: rotate(-135deg); }

#nav-menu { width:100%; display: none; position:absolute; top:50px; right:0;}
#nav-menu ul { width:100%; margin:0; padding:0; background-image:none; background-color: rgba( 255, 255, 255, 0.8 );}
#nav-menu ul li { display:block; padding:0; font-size:14px; border-bottom:1px solid #999; background-image:none; text-align:left; font-family: "Sawarabi Mincho"; }

header #nav-menu ul li a { display:block; padding:10px; }
header #nav-menu ul li a::after { content: ""; display: block; width: 0; margin: 0; transition: width 0.3s; border-bottom:none;}
header #nav-menu ul li a:hover::after { width: 100%;}
header #nav-menu ul li.sp_menu { display: block;}
#nav-menu ul li:last-child { background-image: none;}
}

@media only screen and (max-width: 400px) {
header #navbar h1 { margin-top:10px; text-align:left;}
header #navbar h1 img { width:80%; }
#navbar { height:45px;}
}


/* Contents ----------------- */
#content { clear:both; width:100%; margin:0 0 100px 0; padding:0; overflow:hidden;}
#content .bg { width:100%; padding: 45px 0; background:url(../parts/box_bg.png) repeat;}

@media only screen and (max-width: 1000px) {
#content{ overflow:visible;}
}

@media only screen and (max-width: 680px) {
#content { padding:50px 0 0 0;}
#content .bg { width:96%; padding: 5% 2%; background:url(../parts/box_bg.png) repeat;}
}

#content h2 { margin:0 ; padding:22px 20px 18px 20px; font-weight:normal; background-image:url(../parts/h2.png),url(../parts/box_bg.png); background-repeat:no-repeat, repeat; background-position:center 28px ; font-size:34px; color:#F6ED65; overflow:visible;}
#content h2.hottime{ font-size: 30px; }
#content h3 { margin:0 0 30px 0;  font-size:30px; font-weight:normal; text-align:center;}
#content h3:before { content: url("../parts/h3_L.png"); display: inline-block; margin-right: 20px; vertical-align: middle;} 
#content h3:after { content: url("../parts/h3_R.png"); display: inline-block; margin-left: 20px; vertical-align: middle;} 
#content h4 { padding:0 0 7px 25px; background:url(../parts/h4.png) no-repeat left 8px; font-size:22px; font-weight:normal;}
#content h5 { margin:10px 0; padding-bottom:15px; background:url(../parts/square_p.png) no-repeat center bottom; font-weight:bold; font-size:17px; text-align:center;}

#index #content h2 { margin-bottom:30px; padding:0; background:url(../parts/h3.png) no-repeat center 3px; color:#000; font-size:24px; font-weight:normal; text-align:center;}
#index #content .bg h2 { margin-bottom:30px; background:url(../parts/h3bg.png) no-repeat center 4px; color:#F6EE65;}
#index #content h3 { margin-bottom:10px; padding:10px 0 15px 0; background:url(../parts/h4.png) no-repeat center bottom; font-size:17px; font-weight:bold;}
#index #content h3:before,
#index #content h3:after { display: none; }

#index .bn_box { clear:both; width:100%; max-width:1000px; margin:0 auto 30px auto; font-size:14px; overflow:hidden;}
#index .bn_box:after { content:" "; display:block; clear:both;}
#index .bn_box li { float: left; width: 48.5%; margin: 0 3% 20px 0;}
#index .bn_box li:last-child { margin-right:0;}
#index .bn_box li img { width:100%;}
#index .bn_box li a { color:#000;}

@media only screen and (max-width: 680px) {
#content { }
#content h2 { font-family: "Sawarabi Mincho";}

#index #content { margin: 50px auto 0 !important;}
#index .bn_box li { float: none; width: calc(100% - 40px); margin: 0 auto 20px auto;}
#index .bn_box li:last-child { margin-right:auto;}
}


@media only screen and (max-width: 480px) {
#index #content h2{ padding:12px 0 10px 0; font-size:24px; background:url(../parts/sp/h3.png) no-repeat center; background-size:200px;}
#index #content .bg h2 { margin-bottom:20px; background:none; border-top:none; border-bottom:3px double #F6EE65;}
#index #content h3 { border:none;}

#content h3 { font-size:20px;}
#content h3:before { content:''!important; width: 50px; height: 30px; background: url("../parts/h3_L.png") no-repeat left top; background-size: contain;} 
#content h3:after { content:''!important; width: 50px; height: 30px; background: url("../parts/h3_R.png") no-repeat left top; background-size: contain; } 
}

@media only screen and (max-width: 400px) {
#content h2 { background-size:0, auto; font-size:30px;}
}

#content .page_mv { margin:40px 0 0 0; }

@media only screen and (max-width: 680px) {
#content .page_mv { margin:0;}
#content .page_mv img { width:100%; }
}

#content .box { clear:both; width:1000px; margin:0 auto; padding:20px 0 40px 0; text-align:left; overflow:hidden;}
#content .boxB { clear:both; width:1000px; margin:0 auto 60px auto; padding:40px 0 0 0; text-align:left; border-top:1px dotted #BFB2BF; overflow:hidden;}
#content .bg .box  { clear:both; width:920px; margin:0 auto; padding:0 40px; border:2px solid #AC9F68; text-align:left;}

#content .boxL { float:left; width:480px; margin-right:20px;}
#content .boxR { float:right; width:480px;}

@media only screen and (max-width: 680px) {
.boxB img { width:100%;}
}

@media only screen and (max-width: 680px) {
#content .box,
#content .boxB { width:95%;}
#content .bg .box { width:87%; padding:4%;}
#content .box img { width:100%;}
#content .boxL { float:none; width:100%; margin:0 0 20px 0;}
#content .boxR { float:none; width:100%; margin:30px 0 20px 0;}
}


/* Index */

#index #content { clear:both; width:100%; margin:0; padding:20px 0 0 0; border-top:1px solid #BFB2BF;}

#index #content .boxL { float:left; width:450px;}
#index #content .boxR { float:right; width:450px; padding:20px; background:url(../parts/top_hottime.jpg) no-repeat center top; background-size:100%;}
#index #content .event_bn { float:right; width:490px; margin-bottom: 20px;}

@media only screen and (max-width: 680px) {
#index #content .boxL { float:none; width:100%; margin:0 0 20px 0;}
#index #content .boxR { float:none; width:calc(100% - 40px); margin:30px 0 20px 0;}
#index #content .event_bn { float:none; width:100%; margin-bottom: 20px;}
}

#index #content .boxR h2 { height:35px; padding-top:5px; font-size:30px; color:#502558; background:none;
  -webkit-text-shadow:0px 0px 3px #FFF; /* Safari, Chrome用 */
  -moz-text-shadow:0px 0px 3px #FFF; /* Firefox用 */
  text-shadow:0px 0px 3px #FFF; /* CSS3 */}
#index #content .boxL h3 { margin:10px 0 !important; padding: 0 0 0 25px; background: url(../parts/square_y.png)  no-repeat left 5px; font-size: 16px; font-weight: bold; text-align:left !important;}
#index #content .boxR h3 { margin-bottom: 10px;
    padding: 10px 0 15px 0;
    background: url(../parts/h4.png) no-repeat center bottom;
    font-size: 17px;
    font-weight: bold;}
#index #content .boxL h4 { background:none; margin:5px 0; padding:0; font-size:16px; font-weight:bold;}

#index #content .boxL ul{}
#index #content .boxL ul li{ margin-bottom: 10px; padding:0 0 10px 15px; font-size:15px; background: url("../parts/event_next.png") no-repeat 2px 7px; border-bottom: 1px dotted #CCC;}
#index #content .boxL p { text-align: right;}
#index #content .boxL p:before { display: inline-block; margin: -8px 10px 0 0; content: url("../parts/event_next.png"); vertical-align: middle;}

#index #content .boxR .hottime { margin-bottom:10px; padding:20px 20px 15px 20px; font-size:15px; background-color:rgba( 255, 255, 255, 0.6 );}

#index #content .boxL p,
#index #content .boxR p { margin-bottom:5px; line-height:120%;} 

#index #content .boxL img,
#index #content .boxR img { display:block; margin:30px auto 10px auto; width:100%;}

#index #content .box .boxR dl { width:100%; }
#index #content .box .boxR dl dt { float:left; width:80px; margin:0; padding:10px 10px 5px 20px; border-bottom:1px dotted #BFB2BF; background:url(../parts/square_y.png) no-repeat left 14px; font-size:16px; font-weight:bold; }
#index #content .box .boxR dl dd { margin:0 0 5px 80px; padding:10px 10px 6px 10px; border-bottom:1px dotted #BFB2BF; overflow:hidden;}
#index #content .box .boxR dl dd img { max-width:200px;}

#index #content .box .boxR a.btn { display: block; width: 200px; height:31px; margin:20px auto 0 auto; padding-top: 9px; text-align: center; color: #FFF; background: #502558;}
#index #content .box .boxR a.btn:hover { background:#8A649B;}
#index #content .box .boxR a.btn:active { box-shadow: 0 0 2px rgba(0, 0, 0, 0.30); }

@media only screen and (max-width: 680px) {	
#index #content .box dl dd img { max-width:100%;}
}

#index #content .bg .box p { margin-bottom:30px; color:#FFF; font-size:18px;}
#index #content .bg h2 { margin-top:40px; padding: 0; background: none;}
#index #content .bg h2:before { content: url("../parts/h2_ico.png"); display: inline-block; margin-right: 20px; vertical-align: middle;} 
#index #content .bg h2:after { content: url("../parts/h2_ico.png"); display: inline-block; margin-left: 20px; vertical-align: middle;}
#index #content .bg hr { height:1px; border:none; background:#A99F6B; margin-bottom: 50px;}

#index #content .bg ul { margin-bottom:30px;}
#index #content .bg ul li { width: 45%; display: inline-block; margin-right: 4.5%; overflow: hidden;}
#index #content .bg ul li:last-child { margin: 0;}
#index #content .bg ul li img { width: 100%; margin-bottom: 20px; }
#index #content .bg ul p { text-align: center;}


@media only screen and (max-width: 680px) {	
#index #content .bg .box p { margin-bottom:10px; font-size:15px;}
#index #content .boxL img,
#index #content .boxR img { max-width:60%;}

#index #content .bg ul li { width: 100%; display: block; margin-right:0; margin-bottom: 10px;}
}

#index #content .box ul.place { margin-top:20px;}
#index #content .box ul.place li { display:inline-block; width:320px; margin-right:15px; vertical-align:top;}
#index #content .box ul.place li:last-child { margin:0 0 0 -1px; }
#index #content .box ul.place li h4 { margin:10px 0; padding-bottom:15px; background:url(../parts/square_p.png) no-repeat center bottom; font-weight:bold; font-size:17px; text-align:center;}


@media only screen and (max-width: 680px) {	
#index #content .box ul.place {}
#index #content .box ul.place li { display:block; width:80%; margin:0 auto 20px auto;}
#index #content .box ul.place li:last-child { display:block; width:80%; margin:0 auto 20px auto; }
#index #content .box ul.place li img { display: block; width:auto; margin:0 auto;}
}

@media only screen and (max-width: 400px) {
#index #content .box ul.place li img { width:100%;}
#index #content .box dl dt { font-size:18px;}
}


#index #content .box.tour { clear:both; margin-bottom:50px;}
#index #content .box.tour h3 { font-size:20px; letter-spacing:-0.05em; background: none;}
#index #content .box.tour h3:before { content: url("../parts/h3_L.png"); display: inline-block; margin-right: 10px; vertical-align: middle;} 
#index #content .box.tour h3:after { content: url("../parts/h3_R.png"); display: inline-block; margin-left: 10px; vertical-align: middle;} 


#index #content .box.pers { max-width: calc(1000px - 44px); margin: 30px auto; padding: 20px 20px 10px 20px; border: 2px solid #D25999; }
#index #content .box.pers ul li img { display: block; width: 100%; margin: 0 auto 5px auto; }
#index #content .box.pers.koyasu ul { text-align: center;}
#index #content .box.pers.koyasu ul li { display: inline-block; width: 40%; margin:0 2.5% 10px 0;}
#index #content .box.pers.koyasu ul li:last-child { margin-right:0;}


/* Page */

#about {}
#about #content .boxL { float:left; width:320px; margin:0 20px 50px 0; }
#about #content .boxR { float:right; width:650px;}
#about #content ul { clear:both;}
#about #content ul li { display:inline-block; margin-right:16px; vertical-align: top;}
#about #content ul li:last-child { margin-right:0;} 
#about #content .bg h4 { margin-bottom:30px; padding:5px 0 10px 0;  background:url(../parts/h3bg.png) no-repeat center 4px; color:#F6EE65; text-align: center;font-size:24px;}
#about #content .bg .box { padding-bottom: 30px; color: #FFF; }

@media only screen and (max-width: 680px) {
#about #content .boxL { float:none; margin:0 auto 20px auto; }
#about #content .boxR { float:none; width:100%;}
#about #content ul li { display:block; margin-right:0;}
#about #content ul li img { display:block; width:auto; margin:0 auto 10px auto;}
}

@media only screen and (max-width: 400px) {
#about #content .boxL { width:100%;}
#about #content ul li img { width:100%; }
}

#about #content .box.pers { max-width: calc(1000px - 44px); margin-bottom: 30px; padding: 20px 20px 10px 20px; border: 2px solid #D25999; }
#about #content .box.pers ul { overflow: hidden; }
#about #content .box.pers ul li { width: 32%; margin:0 1.5% 10px 0; text-align: center; vertical-align: top; }
#about #content .box.pers ul li:nth-child(3) { margin-right: 0;}
#about #content .box.pers ul li img { display: block; width: 100%; margin: 0 auto 5px auto; }

@media only screen and (max-width: 680px) {
    #about #content .box.pers { max-width: calc(95% - 44px);}
    #about #content .box.pers h3 { font-size:24px;}
    #about #content .box.pers ul li { display: inline-block; margin:0 1% 10px 0;}
}

@media only screen and (max-width: 500px) {
    #about #content .box.pers h3 { font-size:20px;}
    #about #content .box.pers h3:before,
    #about #content .box.pers h3:after { display: none;}
    #about #content .box.pers ul li,
    #about #content .box.pers ul li:nth-child(3) { width: 47.5%; margin-right: 2%; }
    #about #content .box.pers ul li:nth-child(even) { margin-right: 0;}

    #about #content .box.pers.koyasu ul li { width: 100%; margin: 0 0 15px 0;}
    #about #content .box.pers.koyasu ul li:last-child { margin:0 0 10px 0;}
}

/*　一乗寺について（about）から子安堂へのリンクBOX　*/
.page_link { width: 100%; max-width: 1000px; margin: 50px auto 80px auto;}
.page_link img { width:100%;}
.page_link ul {}

.page_link ul { clear:both; width:100%; margin:0 auto; padding:0; border:2px solid #AC9F68; text-align: center}

.page_link ul li { display: inline-block; width: 45%; margin: 0 2%; vertical-align: top;}
.page_link ul li a { display: block; margin: 0; height:60px; padding-top: 20px; color: #F6ED65; font-size: 26px; font-weight: bold; text-align: center;  background: #502558;}
.page_link ul li a:hover { opacity:0.75; filter: alpha(opacity=75); -webkit-transition: all .3s; transition: all .3s; }

@media only screen and (max-width: 680px) {
    .page_link { width: 95%; margin-top:0;}
}



#event {}

#event .page_link { max-width: 1000px; margin: 50px auto; }
#event .page_link ul { border: none;}
#event .page_link ul li { display: inline-block; width: 45%; margin: 0 2%; vertical-align: top;}
#event .page_link ul li a { display: block; margin: 0; height:60px; padding-top: 20px; color: #F6ED65; font-size: 26px; font-weight: bold; text-align: center;  background: #502558;}
#event .page_link ul li a:hover { opacity:0.75; filter: alpha(opacity=75); -webkit-transition: all .3s; transition: all .3s; }

@media only screen and (max-width: 580px) {
#event .page_link ul li { display: block; width: 95%; margin: 0 auto 10px auto; vertical-align: top;}

}


#event h4 { margin-bottom:30px;}
.list_box { position: relative;	overflow: hidden; width: 100%; max-width: 480px; margin:5px auto; border-bottom:1px dotted #BFB2BF;}
.list_box:last-child { }
.list_box input { position: absolute; z-index: -1; opacity: 0;}
.list_box label { padding:10px 30px 0 10px; color:#B39F57; font-size:18px; font-weight:bold; position: relative; display: block; cursor: pointer; margin: 0 0 1px 0; padding-bottom:10px; }
.list_box label span { white-space: nowrap; display: inline-block;}
.list_box label span:nth-of-type(2) { margin-right: 0.5em;}
.list_box label span:last-of-type { margin-right: 0;}
.list_box .list_box-content { overflow: hidden; max-height: 0; -webkit-transition: max-height 0.35s;
 transition: max-height 0.5s;}
.list_box .list_box-content p { margin: 1em;}
/* :checked */
.list_box input:checked ~ .list_box-content { max-height: 20em;}
/* Icon */
.list_box label::after {
	line-height: 3;
	position: absolute;
	top: -7px;
	right: 0;
	display: block;
	width: 3em;
	height: 3em;
	-webkit-transition: all 0.35s;
	transition: all 0.35s;
	text-align: center;
    color:#4F2757;
    font-size:20px;
    font-weight:bold;
}
.list_box input[type=checkbox] + label::after {
	content: '+';
}
.list_box input[type=checkbox]:checked + label::after {
	transform: rotate(315deg);
}

/*     お寺 DE ほっとタイム    */

#event.hottime {  }

#event.hottime dl { max-width: 500px; margin:10px 0 0 0 ; text-align: left; border-bottom:1px dotted #BFB2BF;}
#event.hottime dl dt { float: left; width: 120px; padding: 10px 0; border-top:1px dotted #BFB2BF; }
#event.hottime dl dd { margin-left: 120px; padding: 10px 0; border-top:1px dotted #BFB2BF;}

/*     お寺 DE ほっとタイム:予告の横に写真有のレイアウト    */
#event.hottime dl dd.hottotime_notice_photo { display: flex; gap: 15px;}
#event.hottime dl dd.hottotime_notice_photo div { min-width: 66%;}
#event.hottime dl dd.hottotime_notice_photo img { margin: 10px auto 0 auto; max-width: 32%;}


#event.hottime a.btn { max-width: 300px; position:relative; display:inline-block;
    margin:20px 0 10px 0; padding:8px 5% 8px 5%; width:90%; vertical-align:middle;
	text-align:center; text-decoration:none; font-size:16px; color:#FFF; background: #583160;}

#event .box.event_info { margin-top: 20px;}
#event .box.event_info h3 { margin-top: 30px; margin-bottom: 10px;}
#event .box.event_info dl { max-width: 1000px !important; margin-bottom: 50px; border: none;}
#event .box.event_info dl dt { width: calc(100% - 20px); margin-bottom: 5px; padding:0 0 0 20px !important; font-size: 20px; font-weight: bold; background: url(../parts/square_y.png) no-repeat left 7px; border:none;}
#event .box.event_info dl dd { clear: both; margin: 10px 0 30px 0 !important; padding: 15px 15px 30px 15px; overflow: hidden; border:1px solid #BFB2BF;}
#event .box.event_info dl dd p.data { font-size:12px; margin-bottom: 10px;}
#event .box.event_info dl dd p.data span { display: inline-block; width:30px; margin-right: 10px; padding:5px; color: #FFF; text-align: center; line-height: 12px;}
#event .box.event_info dl dd p.data span.notice { background-color: #DA78AC;}
#event .box.event_info dl dd p.data span.report { background-color: #4E2858;}

#event .box.event_info ul li.prev { float: left; padding-left: 15px; background: url("../parts/event_prev.png") no-repeat left 7px;}
#event .box.event_info ul li.next { float: right; padding-right: 15px; background: url("../parts/event_next.png") no-repeat right 7px;}

#event .box.event_info dl dd .event_box { margin:10px 0; padding:7px 15px; background-color:#FFF0F4; clear: both; overflow: auto;}
#event .box.event_info dl dd p.event_box ruby rt { font-size: 9px;}
#event .box.event_info dl dd p.event_box em { font-size: 18px; font-weight: bold;}
#event .box.event_info dl dd p.event_box strong { font-size: 18px; font-weight: bold;}
#event .box.event_info dl dd ruby rt { font-size: 10px;}
#event .box.event_info dl dd p.event_box img.imgR { padding: 0 0 15px 10px;}

#event .box.event_info dl dd h4 { font-weight:bold; padding-left:0; font-size:18px; background:none!important; border-bottom:1px dotted #666;}
#event .box.event_info dl img.info016 { width: 300px;}



/*　ほっとタイム　写真並び　
    写真　3枚*/
#event ul.hottime_photo { clear:both; text-align: center;}
#event ul.hottime_photo li { display:inline-block; margin-right:1%; vertical-align: top; width:32%;}
#event ul.hottime_photo li:last-child { margin-right:0;}
#event ul.hottime_photo li img { max-width:100%; max-height:550px; margin-top: 20px;}

/*　写真　2枚*/
#event ul.hottime_photo2 { clear:both; text-align: center;}
#event ul.hottime_photo2 li { display:inline-block; margin-right:2%; vertical-align: top; width:40%;}
#event ul.hottime_photo2 li:last-child { margin-right:0;}
#event ul.hottime_photo2 li img { max-width:100%; max-height:550px; margin-top: 20px;}

/*　写真　4枚*/
#event ul.hottime_photo4 { clear:both; text-align: center;}
#event ul.hottime_photo4 li { display:inline-block; margin-right:1%; vertical-align: top; width:23.9%;}
#event ul.hottime_photo4 li:last-child { margin-right:0;}
#event ul.hottime_photo4 li img { max-width:100%; max-height:550px; margin-top: 20px;}

/*　写真　3枚（縦・横混合・中央ぞろえ）*/
#event ul.hottime_photo3_tate_yoko { clear:both; text-align: center;}
#event ul.hottime_photo3_tate_yoko li { display:inline-block; margin-right:2%; vertical-align: middle; width: 31.7%;}
#event ul.hottime_photo3_tate_yoko li:last-child { margin:0 0 0 -1%;}
#event ul.hottime_photo3_tate_yoko li img { max-width:100%; max-height:350px; margin-top: 20px;}


@media only screen and (max-width: 680px) {
#event ul.hottime_photo li { margin-right:1%; width:48%;}

#event ul.hottime_photo2 li { margin-right:1%; width:48%;}

#event ul.hottime_photo3_tate_yoko li { margin-right:1%; width:48%;}

#event ul.hottime_photo4 li { margin-right:1%; width:48%;}
	
#event.hottime dl dd.hottotime_notice_photo { display: block;}
#event.hottime dl dd.hottotime_notice_photo img { max-width: 50%;}
	
#event .box.event_info dl dd .flex-right { display: block;}
#event .box.event_info dl dd .flex-right img { padding: 0px; margin: 0 0 1em;}
	
#event .box.event_info dl img.info016 { width: 60%; }
}
@media only screen and (max-width: 400px) {
#event ul.hottime_photo li img { width:100%; }
	
#event ul.hottime_photo2 li img { width:100%; }
	
#event ul.hottime_photo4 li img { width:100%; }
	
#event .box.event_info dl img.info016 { width: 100%; }
	
}

#koyasu .box h3 { margin-top: 10px; margin-bottom: 20px;}
#koyasu .box h3 + p { text-align: center; padding-bottom: 30px; margin-bottom: 30px; border-bottom: 1px dotted #BFB2BF;}
#koyasu .box p { margin-bottom: 30px;}

#koyasu .box-gray { background: #EEE; padding: 7.5px; margin-bottom: 85px;}
#koyasu .box-gray div { border: 1px solid #fff; padding: 15px;}
#koyasu .box-gray h4 { font-size: 24px; background: none; padding: 0; margin-bottom: 15px;}
#koyasu .box-gray h4 span {font-size: 15px;}
#koyasu .box-gray p { margin-bottom: 15px;}
#koyasu .box-gray p:last-of-type { margin-bottom: 5px;}

#koyasu .sanpaihouhou { display: flex; flex-wrap: wrap; justify-content: space-between; border-bottom: 1px dotted #BFB2BF;}
#koyasu .sanpaihouhou h3,
#koyasu .sanpaihouhou p { width: 100%;}
#koyasu .sanpaihouhou .flex-left { width: 65%;}
#koyasu .sanpaihouhou .flex-left ol li { list-style: "◆ "; margin-left: 1.25em; color: #D25999; font-size: 20px; margin-bottom: 20px;}
#koyasu .sanpaihouhou .flex-left ol li span { color: #000;}
#koyasu .sanpaihouhou .flex-left ol li span span { font-size: 16px;}
#koyasu .sanpaihouhou .flex-left ul { background: #F8F9D0; padding: 15px; margin-bottom: 50px;}
#koyasu .sanpaihouhou .flex-left ul li { list-style: "● "; color: #AC9F68; font-size: 15px; margin-bottom: 0;}
#koyasu .sanpaihouhou .flex-left ul li span { margin-left: 0.25em; font-weight: 900;}
#koyasu .sanpaihouhou .flex-right ul { padding: 0.25em; margin-bottom: 25px;}
#koyasu .sanpaihouhou .flex-right p { text-align: center!important; font-size:14px;}

@media only screen and (max-width: 680px) {
  #koyasu .sanpaihouhou .flex-left { width: 100%;}
	#koyasu .sanpaihouhou .flex-right { width:100%;}
	#koyasu .sanpaihouhou .flex-right ul { width:100%;}
	#koyasu .sanpaihouhou .flex-right li { width:48%; float:left;}
	#koyasu .sanpaihouhou .flex-right li:nth-child(even) { margin-left:4%;}
}
@media only screen and (max-width: 480px) {
	#koyasu .sanpaihouhou .flex-right li { width:80%; float:none; margin:0 auto;}
	#koyasu .sanpaihouhou .flex-right li:nth-child(even) { margin-left:auto;}
	#koyasu .sanpaihouhou .flex-right p { font-size:13px;}
}


#access {}
#access #content #map-canvas { width:1000px; height:500px; margin:40px auto; }
#access #content .mapbox { clear:both; width:1000px; margin:0 auto; padding:40px 0; text-align:left; overflow:hidden;}
#access #content ul { margin-top:20px;}
#access #content ul li { display:inline-block; width:410px; margin-bottom:50px;}
#access #content ul li:last-child { display:inline-block; width:550px; margin-left:35px;}

#access #content ul li p.pS  { padding-top:10px;}

#access #content .mapbox img.mapimg { float:right; margin:0; padding:0 0 15px 20px;}


@media only screen and (max-width: 680px) {
#access #content #map-canvas { width:95%;}
#access #content .mapbox { display: flex; flex-direction:column; width:95%; margin:0 auto; }
#access #content .mapbox h3 {order: 1;}
#access #content .mapbox ul {order: 2; width:100%; margin:20px 0 0 0;}	
#access #content .mapbox ul li { display:block; width:100%; margin-bottom:20px; padding:0;}
#access #content .mapbox ul li:last-child { display:block; width:100%; margin-left:0; margin-bottom:20px;}
#access #content .mapbox ul li img { width:100%;}
#access #content .mapbox ul li img.imgL { width:auto;}

#access #content .mapbox img.mapimg { order: 3; float:none; width:100%; padding:0;}	
}



#contact {}
#contact .boxMap { clear:both; display:table; width:920px; margin:40px auto 0 auto; padding:40px; background:#F8F9D0; text-align:center; overflow:hidden;}
#contact .boxMap img.imgL { margin-left:20px;}
#contact .boxMap .add { width:450px; display: table-cell; vertical-align:middle; }
#contact .boxMap h3 { background:none; font-size:14px;}
#contact .boxMap h3:before,
#contact .boxMap h3:after { display: none;}
#contact .boxMap h3 img { display:block; margin:0 auto 10px auto; }
#contact .boxMap p { margin:0 0 35px 0;}
#contact .boxMap span { display:block; margin:5px 0; font-size:30px; font-weight:bold;}

#contact #content ul {}
#contact #content ul li { display:inline-block; width:480px; margin-right:36px; vertical-align: top;}
#contact #content ul li:last-child { width:480px; margin-right:0px;}
#contact #content ul li h4 { margin:10px 0;}

#contact #content .boxbg { clear:both; width:920px; margin:10px auto 60px auto; padding:40px; background:url(../parts/box_bg.png) repeat; text-align:left; color:#FFF; font-size:18px; border:1px solid #AC9F68;}
#contact #content .boxbg h3 { margin:0 0 20px 0; padding:0; background:url(../parts/h2.png) no-repeat center 3px; font-size:30px; color:
#F6EC65;}
#contact #content .boxbg h3:before,
#contact #content .boxbg h3:after { display: none;}
#contact #content .boxbg img { margin:30px auto 0 auto;}

#contact #content .ema { border-top: 1px dotted #BFB2BF; margin-top: 30px; padding-top: 30px;}
#contact #content .ema p { margin-top: 10px; margin-bottom: 30px;}
#contact #content .ema ul.list { list-style: disc; padding-left: 1em; margin-bottom: 30px;}
#contact #content .ema ul.list li { list-style: "●"; width: 100%; display: list-item; padding-left: 0.5em;}
#contact #content .ema ul.list li::marker { font-size: 22px; color: #AC9F68;}
#contact #content .ema ul.pics { display: flex; gap:30px;}
#contact #content .ema ul.pics li { width: calc((100% - 60px) / 3); margin-right: 0; display: inherit;}
#contact #content .ema ul.pics li dl { width: 100%;}
#contact #content .ema ul.pics li dl dt { margin: 10px auto; width: 100%; font-size: 18px; text-align: center; font-weight: bold;}
#contact #content .ema ul.pics li:nth-child(1) dl dt { color: #0085B2;}
#contact #content .ema ul.pics li:nth-child(2) dl dt { color: #CD476C;}
#contact #content .ema ul.pics li:nth-child(3) dl dt { color: #EE865A;}
#contact #content .ema ul.pics li dl dd { text-align: center; font-size:14px;}
#contact #content .ema span { width: 100%; text-align: right; display: block; margin-top: 25px; font-size: 13px;}

@media only screen and (max-width: 680px) {
	#contact #content .ema ul li { margin-bottom: 0;}
	#contact #content .ema ul.pics li dl dt { font-size: 16px;}
	#contact #content .ema ul.pics li dl dd { font-size:13px;}
}

@media only screen and (max-width: 480px) {
	#contact #content .ema ul.pics { flex-direction: column;}
	#contact #content .ema ul.pics li { width: 100%;}
	#contact #content .ema ul.pics li img { max-width: 100%; width: auto; margin: 0 auto; display: block;}
	#contact #content .ema ul.pics li dl{ padding:0 10%;}
	#contact #content .ema span { text-align: center; font-size: 11px;}
}

@media only screen and (max-width: 680px) {
#contact .boxMap { width:90%; padding:2.5%;}
#contact .boxMap .add { width:100%; display:inline;}
#contact .boxMap .add h3 { border:none; }
#contact .boxMap img.imgL { float:none; display:block; width:100%; margin:10px auto 0 auto;}

#contact #content ul {}
#contact #content ul li { display:block; width:100%; margin-right:0; margin-bottom:30px;}
#contact #content ul li:last-child { width:100%; margin-right:0px;}

#contact #content .boxbg { width:85%; margin:10px auto 80px auto; padding:5%;}
#contact #content .boxbg h3 { margin:0 0 20px 0; padding:0; background:url(../parts/h2.png) no-repeat center 3px; font-size:30px; color:#F6EC65; border:none;}
#contact #content .boxbg img { width:100%;}
}

@media only screen and (max-width: 480px) {
#contact #content .boxbg { font-size:16px;}
#contact #content .boxbg h3 { margin:0 0 10px 0; background:none; font-size:26px;}
#contact #content .boxbg img { margin:15px 0 0 0;}
}


#diary { }
#diary h3 { margin:20px 0 10px 0; padding:0 0 0 25px; background:url(../parts/h4.png) no-repeat left 5px; text-align: left; font-size:18px; font-weight:normal;}
#diary h3:before,
#diary h3:after { display: none;}
#diary h4 { width: 100%; margin-bottom: 15px; padding:0 0 5px 0; color: #B59F57; border-bottom:1px dotted #CCC; font-size: 22px; background: none;}
#diary h4 span { display: inline-block; width:100%; text-align: right; font-size: 16px;}

#diary .box .diary_box { display: block; margin: 0 auto; padding: 20px 20px 5px 20px; border:1px solid #CCC; overflow: hidden; }
#diary .box .diary_box ruby rt { font-size: 9px;}
#diary .box .diary_box p { margin-bottom:15px;}
#diary h4 {text-align: left}


#diary #content ul { width: 95%; max-width:1000px; margin: 0 auto;}
#diary #content ul li.prev { float: left; padding-left: 15px; background: url("../parts/event_prev.png") no-repeat left 7px;}
#diary #content ul li.next { float: right; padding-right: 15px; background: url("../parts/event_next.png") no-repeat right 7px;}


/* Footer ----------------- */
footer { padding:30px 0; border-top:1px solid #BFB2BF;}
footer ul { margin-bottom:20px;}
footer ul li { display:inline-block; margin-right:50px; background:url(../parts/foot_ico.png) no-repeat left 6px; }
footer ul li:last-child { margin:0;}
footer ul li a { display:block; padding:0 0 0 10px;}


@media only screen and (max-width: 680px) {
footer { padding:0 0 30px 0; width:100%; border-top:2px solid #BFB2BF;}
footer ul { margin-bottom:30px;}
footer ul li { display:block; margin-right:0; background:none; border-bottom:1px solid #BFB2BF; }
footer ul li a { display:block; padding:15px 10px 10px 10px; font-weight:bold;}
}

@media only screen and (max-width: 340px) {
footer img { width:80%;}
}

footer h3 { margin-bottom:20px;}
footer span.tel { margin-right:15px;}
footer .copyright { margin-top:20px; font-size:13px;}

