@charset "utf-8";

/* ---------------------------------------------
	reset
--------------------------------------------- */
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td,img { margin: 0; padding: 0; }
table {	border-collapse: collapse; border-spacing: 0; }
fieldset,img { border: 0; }
img { display: block; }
img a { border: none; }
address,caption,cite,code,dfn,em,strong,th,var { font-style: normal; font-weight: normal; }
ol, ul { list-style: none; }
caption, th { text-align: left; }
h1,h2,h3,h4,h5,h6 {	font-size: 100%; font-weight: normal; line-height: 1.0; }
q:before, q:after {	content: ""; }
figure { width: 100%; margin: 0; padding: 0;}

/* ---------------------------------------------
	common
--------------------------------------------- */
* {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}
body {
	-webkit-text-size-adjust: 100%;
	word-break: break-all;
}
#contents img { width: 100%; height: auto; }
#contents a { text-decoration: none; }
#contents a:hover { -webkit-transition: all .3s; transition: all .3s; opacity: 1;}
#contents p {line-height: 1.4;}
#contents {
	font-size: 15px;
	font-family: Meiryo, メイリオ, 游ゴシック体, 'Yu Gothic', YuGothic, 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', Osaka, 'MS PGothic', arial, helvetica, sans-serif;
	color: #333;
	margin-bottom: 0;
}
.indent {text-indent: -1em; padding-left: 1em;}


/* ---------------------------------------------
	header
--------------------------------------------- */
.headerTTL {
}
.mainSP { display: none; }

/* ---------------------------------------------
	footer
--------------------------------------------- */
.footerArea {
	padding: 60px 0 0;
  background-color: #d7eced;
}
.footer {
  width: 96%;
	max-width: 1000px;
	margin: 0 auto;
}
.footerSP { display: none; }
.footerBottom {
  background: url("../img/footer-bottom.png") repeat-x center #d7eced;
  height: 205px;
}
@media only screen and (max-width: 768px) {
  .footerBottom {
    height: 100px;
    background-size: cover;
  }
}
@media only screen and (max-width: 480px) {
  .footerBottom {
    height: 50px;
  }
}
.footerMap img {
  border: 6px solid #fff;
  border-radius: 10px;
}
.footerInfo {
  margin-top: 45px;
  display: flex;
  justify-content: space-between;
}
@media only screen and (max-width: 480px) {
  .footerInfo {
    display: block;
  }
}
.footerInfoText {
  width: 80%;
}
.footerInfoIcon {
  width: 14%;
  text-align: center;
}
@media only screen and (max-width: 480px) {
  .footerInfoText {
    width: 100%;
  }
  .footerInfoIcon {
    width: 40%;
    margin: 0 auto;
  }
}
.footerInfoIcon p {
  margin-top: 5px;
  font-size: 12px;
  font-weight: bold;
}
.footerInfoIcon p span {
  display: block;
  font-size: 10px;
  font-weight: normal;
}
.footerInfoTextWrapper {
  display: flex;
  justify-content: space-between;
  margin-bottom: 20px;
}
.footerInfoTextLeft {
  width: 20%;
}
.footerInfoTextRight {
  width: 77%;
}
.footerInfoTextLeft span {
  display: block;
  background-color: #00a1e9;
  width: 100%;
  padding: 17px 0;
  color: #fff;
  font-size: clamp(0.875rem, 0.821rem + 0.27vw, 1.125rem);
  text-align: center;
  border-radius: 6px;
  line-height: 1em;
}
@media only screen and (max-width: 480px) {
  .footerInfoTextLeft span {
    padding: 10px;
    font-size: 12px;
  }
}
.footerInfoTextRight .tel {
  font-weight: bold;
  font-size: clamp(1.25rem, 1.053rem + 0.84vw, 2rem);
}
.footerInfoTextRight .telSub {
  font-size: clamp(0.75rem, 0.696rem + 0.27vw, 1rem);
}
.footerInfoTextRight .trainSub {
  font-size: clamp(0.75rem, 0.696rem + 0.27vw, 1rem);
}
.footerInfoTextRight .train {
  font-weight: bold;
  font-size: clamp(1rem, 0.946rem + 0.27vw, 1.25rem);
}
.footerInfoTextRight .train li {

}
.footerInfoTextRight .train li::before {
  content: "●";
  color: #22b573;
}

/* ---------------------------------------------
	contents
--------------------------------------------- */
#contents { margin-bottom: 0; }
.contentsBG {
	padding: 40px 20px;
}
.event {
	width: 100%;
	margin: 0 auto;
}
.event ul {
	display: flex;
	flex-wrap: wrap;
  justify-content: center;
}
.event ul li {
	width: calc((100% - 60px) / 4);
	margin-right: 20px;
	margin-bottom: 20px;
	background: #fffdcd;
}
.event ul li:last-child {
	margin-right: 0;
}
.event ul li a {
	display: block;
}
.event ul li a:hover {
	opacity: 0.8;
}
.event ul li a img {
  border-radius: 6px 6px 0 0;
}
.event ul li p.date {
	margin-top: 10px;
	text-align: center;
	font-size: 17px;
	font-weight: bold;
	color: #1c4a7b;
}
/* ---------------------------------------------
	1120px 以下
--------------------------------------------- */
@media only screen and (max-width: 1120px) {
	.event {
		max-width: 960px;
	}
	.event ul li {
		width: calc((100% - 20px) / 2);
	}
	.event ul li:nth-child(2n) {
		margin-right: 0;
	}
	
}

/* ---------------------------------------------
	768px 以下
--------------------------------------------- */
@media only screen and (max-width: 768px) {

	/* ---------------------------------------------
		header
	--------------------------------------------- */
	.mainPC { display: none; }
	.mainSP { display: block; }

	/* ---------------------------------------------
		footer
	--------------------------------------------- */
	.footerPC { display: none; }
	.footerSP { display: block; }

	.event ul li p.date {
		font-size: 15px;
	}
	
}

/* ---------------------------------------------
	480px 以下
--------------------------------------------- */
@media only screen and (max-width: 480px) {

	/* ---------------------------------------------
		contents
	--------------------------------------------- */
	.contentsBG {
		padding: 20px 20px;
	}
	.event {
		max-width: 320px;
		margin: 0 auto;
	}
	.event ul li {
		width: 100%;
		margin-right: 0;
		margin-bottom: 20px;
	}

}
