@charset "utf-8";
/* CSS Document */

.calendarWrap{ width: 100%; min-width: 1279px; background: #f7f7f7; font-family: "HiraKakuPro-W6-AlphaNum"; color: #333; text-align: center; padding: 80px 0 0;  letter-spacing: 0.12em; margin: 0 auto;}
.wrapArea{max-width: 1220px; width: 100%; margin: 0 auto 100px; position: relative;}
.wrapArea::after{ background: #dfdfdf; content: ''; display: block; height: 1px; max-width: 1220px; position:relative; bottom: -75px; left: 0; -webkit-transcalendar: translateX(-50%); transcalendar: translateX(-50%); width: 100%; margin-top: 75px;}
.wrapArea .subpage-inner{ margin-bottom: 100px;}/*
.wrapArea .ttlImg{ width: 320px; margin: 25px auto 80px;}*/
.wrapArea .monthWrap{ width: 1220px; margin: 80px auto 50px; background: #FFF; padding: 80px 80px 20px 80px;}
.wrapArea h3.calendar-title{ font-size: 26px; margin: 0 0 35px;}
.wrapArea h3.calendar-title span{ display: inline-block; position: relative; z-index: 1;}
.wrapArea h3.calendar-title span::before { background: url("../images/h3-line.jpg") center/cover repeat; content: ''; bottom: 3px; display: block; position: absolute; left: 0; height: 7px; width: 100%; z-index: -1;}
.wrapArea .monthWrap h4{ font-size:20px; color:#009999; margin:25px 0 20px; font-weight:normal;}
.wrapArea .monthWrap h5{ font-size:26px; color:#009999; text-align:left; margin:25px 0 10px 20px; font-weight:normal;}
.wrapArea .monthWrap h5:before{ position: relative; display: inline-block; width: 20px; height: 20px; content: ""; border-radius: 100%; background: #c8f3c8; top: -1.5px; left: -10px;}
.wrapArea .monthWrap ul{ text-align: left; font-weight: normal !important; font-size: 14px; line-height: 200%;}
.wrapArea .monthWrap li{ margin-bottom: 15px; text-indent: -14px; padding-left: 14px;}
.wrapArea .monthWrap li:last-child{ margin-bottom: 0;}
.wrapArea .monthWrap li:before{ position: relative; display: inline-block; width: 12px; height: 12px; content: ""; border-radius: 100%; background: #c8f3c8; top: 1px; left: -10px;}
.wrapArea .monthWrap .caution{ margin: 50px auto;}
.wrapArea .monthWrap .caution::after{   content: ""; display: block; clear: both;}
.wrapArea .monthWrap p.txt{ float:left; vertical-align:text-bottom; font-size:14px; color:#999; text-align: left;}
.wrapArea .monthWrap p.link{ float: left; vertical-align:middle; font-size:14px; color:#999;}
.wrapArea .monthWrap p.date{ float:right; vertical-align:text-bottom; font-size:14px; color:#999;}
.wrapArea table { width:100%; margin:0 auto 50px; font-size:14px;font-family: "HiraKakuPro-W3-AlphaNum";}
.wrapArea table tr{  border-bottom: 1px dotted #ccc;}
.wrapArea table tr:first-child{ border-top: 1px solid #ccc;}
.wrapArea table tr:last-child{ border-bottom: 1px solid #ccc;}
.wrapArea table th{ width:300px; padding:15px 0 15px 10px; text-align:left; vertical-align:middle;}
.wrapArea table td{ padding:15px 0 15px; text-align:left;}
.wrapArea table td span.big{ padding:15px 0 15px; text-align:left; font-family: "HiraKakuPro-W6-AlphaNum";}

.wrapArea a{ color: #009999; text-decoration: none;}
.wrapArea a.big{ color: #009999; text-decoration: none; font-family: "HiraKakuPro-W6-AlphaNum";}
.wrapArea a:hover{ text-decoration: underline;}
.wrapArea .mt20{ margin: 20px 0 0; padding: 0 0 50px; text-align: left;}

/* 共通ナビ */
.wrapArea ul.guideBtn { display: flex; justify-content: center;font-family: "HiraKakuPro-W3-AlphaNum";font-size:20px; font-weight: 400; margin: 50px auto;}
.wrapArea ul.guideBtn li{ position: relative; width:25%; border-left: 1px solid #000; }
.wrapArea ul.guideBtn li img{ display: inline-block; width: 35px; height: 35px; vertical-align: bottom; margin-right: 5px;}
.wrapArea ul.guideBtn li.here{ position: relative; width:25%;  border-left: 1px solid #000; font-weight: 600; }
.wrapArea ul.guideBtn li:last-child{ position: relative;width:25%;  border-right: 1px solid #000;}
.wrapArea ul.guideBtn li a::before{
	content: '';
	position: absolute;
	box-sizing: border-box;
  display: inline-block;
	top: 2.5em;
	left:7em;
  width: 20px;
  height: 20px;
  border-style: solid;
  border-width: 1px 1px 0 0;
  border-color: black;  
  transform: rotate(135deg);
	transition: all .3s;
}

.wrapArea ul.guideBtn li.here a::before{
	content: '';
	position: absolute;
	box-sizing: border-box;
  display: inline-block;
	top: 2.5em;
	left:7em;
  width: 20px;
  height: 20px;
  border-style: solid;
  border-width: 3px 3px 0 0;
  border-color: black;  
  transform: rotate(135deg);
	transition: all .3s;
}
.wrapArea ul.guideBtn li a:hover::before{ transform: translateY(10px) rotate(135deg); }
.wrapArea ul.guideBtn li a.here:hover::before{ transform: translateY(10px) rotate(135deg); }

.wrapArea ul.guideBtn a{ color: #000; text-decoration: none;}

.red{color:#dd8080;}

.pc{ display:inherit !important;}
.sp{ display:none !important;}


@media screen and (max-width: 749px) {
.calendarWrap{ width: 100%; min-width: 100%; background: #f7f7f7; font-family: "HiraKakuPro-W6-AlphaNum"; color: #333; text-align: center; padding: 10% 0  10% ; letter-spacing: 0.12em;}
.wrapArea{ width: 100%; max-width: auto; margin: 0 auto; position: relative;}
.wrapArea::after{ background: #dfdfdf; content: ''; display: block; height: 1px; position: absolute; bottom: -85px; left: 17px; -webkit-transcalendar: translateX(-50%); transcalendar: translateX(-50%); width: calc(100% - 40px); margin-top: 5%;}
.wrapArea .subpage-inner{ margin-bottom: 70px}
.wrapArea .ttlImg{ width: 80%; margin: 2.5% auto 15%;}
.wrapArea .monthWrap{ width: auto; margin: 10% 3% 5%; background: #FFF; padding: 8% 3% 1%;}
.wrapArea h3.month-title{ font-size: 19px; margin: 0 0 8%;}
.wrapArea h3.month-title span{ display: inline-block; position: relative; z-index: 1;}
.wrapArea h3.month-title span::before { background: url("../images/h3-line.jpg") center/cover repeat; content: ''; bottom: 3px; display: block; position: absolute; left: 0; height: 7px; width: 100%; z-index: -1;}
.wrapArea .monthWrap h5{ font-size:20px; color:#009999; text-align:left; margin:0% 0 5% 5%; font-weight:normal;}
.wrapArea .monthWrap h5:before{ position: relative; display: inline-block; width: 15px; height: 15px; content: ""; border-radius: 100%; background: #c8f3c8; top: 0; left: -10px;}
.wrapArea .monthWrap ul{ text-align: left; font-weight: normal !important; font-size: 12px; line-height: 200%;}
.wrapArea .monthWrap li{ margin-bottom: 15px; text-indent: -14px; padding-left: 14px;}
.wrapArea .monthWrap li:last-child{ margin-bottom: 0;}
.wrapArea .monthWrap li:before{ position: relative; display: inline-block; width: 12px; height: 12px; content: ""; border-radius: 100%; background: #c8f3c8; top: 1px; left: -5px;}
.wrapArea .monthWrap .caution{ margin: 5% auto 0;}
.wrapArea .monthWrap .caution::after{   content: ""; display: block; clear: both;}
.wrapArea .monthWrap p.txt{ float: left; font-size:10px; color:#999;}
.wrapArea .monthWrap p.link{ float: left; font-size:10px; color:#999;}
.wrapArea .monthWrap p.date{ float: right; font-size:10px; color:#999; margin-top: 10%;}
.wrapArea table { width:100%; margin: 0 auto 12%; font-size:12px;font-family: "HiraKakuPro-W3-AlphaNum";}
.wrapArea table tr{ border-bottom: 1px dotted #ccc;}
.wrapArea table tr:first-child{ border-top: 1px solid #ccc;}
.wrapArea table tr:last-child{ border-bottom: 1px solid #ccc;}
.wrapArea table th{ display: block; width:100%; padding:5% 0 0 3%; text-align:left; vertical-align:middle; border-bottom: none;}
.wrapArea table td{ display: block; padding:3% 0 3% 3%; text-align:left;}
.wrapArea a{ color: #009999; text-decoration: none;}
.wrapArea a.green{ color: #50ae32; text-decoration: underline;}
.wrapArea a.green:hover{ text-decoration: underline;}
.wrapArea .mt20{ margin: 20px 0 0; padding: 0 0 20%; text-align: left;}

/* 共通ナビ */
.wrapArea ul.guideBtn { flex-wrap: wrap; width: 96%; font-size:14px; font-weight: 400; margin: 5% auto 5%;}
.wrapArea ul.guideBtn li{ position: relative; width:50%; border-left: 1px solid #000; margin:10px 0;}
.wrapArea ul.guideBtn li img{ display: block; width: 30px; height: 30px; vertical-align: bottom; margin:0 auto 3% ;}
.wrapArea ul.guideBtn li.here{ position: relative; width:50%;  border-left: 1px solid #000; font-weight: 600; }
.wrapArea ul.guideBtn li:nth-child(2n){ position: relative;width:50%;  border-right: 1px solid #000;}
.wrapArea ul.guideBtn a{ color: #000; text-decoration: none;}

	.wrapArea ul.guideBtn li a::before{
	content: '';
	position: absolute;
	box-sizing: border-box;
  display: inline-block;
	top: 4.5em;
	left:6em;
  width: 20px;
  height: 20px;
  border-style: solid;
  border-width: 1px 1px 0 0;
  border-color: black;  
  transform: rotate(135deg);
	transition: all .3s;
}

.wrapArea ul.guideBtn li.here a::before{
	content: '';
	position: absolute;
	box-sizing: border-box;
  display: inline-block;
	top: 4.5em;
	left:6em;
  width: 20px;
  height: 20px;
  border-style: solid;
  border-width: 3px 3px 0 0;
  border-color: black;  
  transform: rotate(135deg);
	transition: all .3s;
}
.wrapArea ul.guideBtn li a:hover::before{ transform: translateY(10px) rotate(135deg); }
.wrapArea ul.guideBtn li a.here:hover::before{ transform: translateY(10px) rotate(135deg); }

.red{color:#dd8080;}

.pc{ display:none !important;}
.sp{ display:inherit !important;}
	
}

/*20240520　画像化*/
 p.ttlImg  {
  display: inline-block;
  position: relative;
	font-size:28pt;
	margin: 10px auto 25px;
	letter-spacing: 0.15em;
  font-family: "Noto Serif JP", serif;
  font-weight: 600;
}
@media screen and (max-width: 750px) {
p.ttlImg   {
    display: block;
	font-size:20pt;
	margin: 5px auto 30px;
	letter-spacing: 0;
  font-family: "Noto Serif JP", serif;
  font-weight: 600;
}
}