@charset "utf-8";
@media only screen and (max-width: 750px) {
	/*--------------------*/
	/*---- sp_cont.css ----*/
	/*--------------------*/

	/*------------------------------------
		基本設定
	-------------------------------------*/
	html {
		font-size: 62.5%;
		overflow: auto;
	}

	body {
		font-size: 1.4rem;
		overflow-x: hidden;
		/* text-align: justify; */
		background: var(--cont-body-color);
	}

	img {
		width: 100%;
		max-width: 100%;
		height: auto;
		vertical-align: bottom;
	}

	.spNone {
		display: none;
	}

	/*ーーーーー
	※レイアウト調整用
	* {
		outline: 1px solid #555;
	}
	ーーーーー*/

	/*------------------------------------
		section共通設定
	-------------------------------------*/
	.sectionCommon {
		padding: 0 20px;
	}

	/*------------------------------------
		header
	-------------------------------------*/
	.headerWrap {
		background: #fff;
		box-shadow: 0 1px 8px rgba(0, 0, 0, 0.10);
		position: relative;
		z-index: 2;
	}
	.headerInner {
		padding: 15px 15px 15px 15px;
		text-align: center;
	}
	.headerTitle {
		color: #0583C9;
		line-height: 1.25;
	}
	.headerTitle p {
		font-weight: var(--font-w-bold);
	}
	.headerTitle p span {
		display: inline;
	}
	.headerTitle .dateText {
		font-size: 1.4rem;
	}
	.headerTitle .dayText {
		font-size: 1.6rem;
	}
	.headerTitle h1 {
		position: relative;
		display: inline-block;
		margin-top: 4px;
		padding: 0 29px;
		font-size: 2.4rem;
		font-weight: var(--font-w-black);
		line-height: 1.2;
	}
	.headerTitle h1::before,
	.headerTitle h1::after {
		content: "";
		position: absolute;
		top: 50%;
		width: 23px;
		height: 1px;
		background: #0583C9;
	}
	.headerTitle h1::before {
		left: 0;
	}
	.headerTitle h1::after {
		right: 0;
	}
	.headerCredits {
		width: 230px;
		margin: 17px auto 0;
	}
	.headerCredits img {
		width: 100%;
	}

	/*------------------------------------
		hero
	-------------------------------------*/
	.heroWrap {
		display: flex;
		justify-content: center;
		align-items: center;
		padding: 35px 0px;
		background-color: var(--header-color);
	}
	.heroInner {
		text-align: center;
	}
	.siteLabel {
		display: inline-flex;
		align-items: center;
		justify-content: center;
		width: fit-content;
		padding: 20px 35px 20px 35px;
		border-radius: 100px;
		background: #fff;
		color: #ff7300;
		font-size: 2.8rem;
		font-weight: var(--font-w-bold);
		line-height: 1.2;
		box-shadow: 0 3px 4px rgba(0, 0, 0, 0.12) inset;
	}

	/* --------- kana nav ----------- */
	.kanaNav {
		background: var(--tab-base-color);
	}
	.kanaNavInner {
		padding: 0;
	}
	.spMenuBtn {
		display: flex;
		align-items: center;
		justify-content: center;
		width: 100%;
		height: 64px;
		border: 0;
		background: var(--tab-base-color);
		color: #fff;
		font-family: inherit;
		font-size: 1.8rem;
		font-weight: var(--font-w-bold);
		letter-spacing: 0;
	}
	.spMenuBtn span,
	.spMenuBtn span::before,
	.spMenuBtn span::after {
		display: block;
		width: 26px;
		height: 3px;
		background: #fff;
	}
	.spMenuBtn span {
		position: relative;
		margin-right: 20px;
	}
	.spMenuBtn span::before,
	.spMenuBtn span::after {
		content: "";
		position: absolute;
		left: 0;
	}
	.spMenuBtn span::before {
		top: -9px;
	}
	.spMenuBtn span::after {
		top: 9px;
	}
	.kanaNav ul {
		display: none;
	}
	.kanaNav li {
		text-align: center;
	}
	.kanaNav a {
		display: flex;
		align-items: center;
		justify-content: center;
		width: 100%;
		min-height: 55px;
		padding: 16px 20px;
		color: #fff;
		font-size: 1.6rem;
		font-weight: var(--font-w-bold);
		line-height: 1.35;
	}
	.kanaNav a.current {
		min-height: 55px;
		background: var(--cont-body-color);
		color: var(--tab-text-color);
	}
	.spMenuClose {
		display: none;
		align-items: center;
		justify-content: center;
		width: 100%;
		height: 70px;
		border: 0;
		background: var(--tab-base-color);
		color: #fff;
		font-family: inherit;
		font-size: 1.6rem;
		font-weight: var(--font-w-bold);
		letter-spacing: 0;
	}
	.spMenuClose span {
		position: relative;
		display: block;
		width: 28px;
		height: 28px;
		margin-right: 20px;
	}
	.spMenuClose span::before,
	.spMenuClose span::after {
		content: "";
		position: absolute;
		top: 50%;
		left: 0;
		display: block;
		width: 30px;
		height: 4px;
		background: #fff;
	}
	.spMenuClose span::before {
		transform: rotate(45deg);
	}
	.spMenuClose span::after {
		transform: rotate(-45deg);
	}

	/*------------------------------------
		content
	-------------------------------------*/
	.contentWrap {
		padding: 40px 0 70px;
		background: var(--cont-body-color);
	}
	.contentInner {
		padding: 0;
	}
	.contentBox {
		width: 100%;
		padding: 30px 20px;
		background: #fff;
	}
	.mainVisual img {
		border-radius: 10px;
	}
	.textSection h2 {
		margin-top: 28px;
		margin-bottom: 10px;
		color: #ff7300;
		font-size: 2.0rem;
		font-weight: var(--font-w-bold);
		line-height: 1.6;
		overflow-wrap: anywhere;
		line-break: strict;
	}
	.textSection {
		margin-top: 48px;
	}
	.textSection + .textSection {
		margin-top: 39px;
	}
	.textSection h3 {
		position: relative;
		display: inline-block;
		margin-top: 40px;
		margin-bottom: 30px;
		padding: 0 10px;
		font-size: 2.4rem;
		font-weight: var(--font-w-bold);
		line-height: 1.45;
		letter-spacing: 1px;
		overflow-wrap: anywhere;
		line-break: strict;
		z-index: 0;
	}
	.textSection h3::before {
		content: "";
		position: absolute;
		left: 0;
		right: 0;
		bottom: -8px;
		height: 17px;
		background: #E5F89F;
		border-bottom: 1px solid #6EAB38;
		z-index: -1;
	}
	.textSection p {
		font-size: 1.6rem;
		font-weight: var(--font-w-regular);
		line-height: 1.8;
		overflow-wrap: anywhere;
		line-break: strict;
	}
	.textSection p + p {
		margin-top: 23px;
	}
	.textSection a {
		border-bottom: 1px solid #222;
	}
	.infoSection {
		margin-top: 47px;
	}
	.infoSection h3 {
		margin-bottom: 30px;
	}
	.textSection th,
	.textSection td {
		padding-bottom: 15px;
	}
	.infoList {
		font-size: 1.6rem;
		line-height: 1.8;
		overflow-wrap: anywhere;
		line-break: strict;
	}
	.infoList div {
		display: flex;
	}
	.infoList dt {
		width: 96px;
		font-weight: var(--font-w-bold);
		flex-shrink: 0;
	}

	/* --------- gallery list ----------- */
	.pageListInner {
		padding: 0;
	}
	.galleryList {
		padding: 0 20px;
	}
	.galleryList ul {
		display: grid;
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 35px 20px;
	}
	.galleryList a {
		display: block;
		color: #222;
	}
	.galleryList figure {
		display: flex;
		flex-direction: column;
		align-items: center;
		width: 100%;
	}
	.galleryList img {
		width: 150px;
		max-width: 100%;
		box-shadow: 0 1px 7px rgba(0, 0, 0, 0.03);
	}
	.galleryList figcaption {
		width: 100%;
		margin-top: 12px;
		font-size: 1.3rem;
		line-height: 1.5;
		text-align: center;
		overflow-wrap: anywhere;
	}
	.galleryDivider {
		width: 30px;
		height: 96px;
		margin: 56px auto 44px;
		border-right: 9px solid #a9a9a9;
		border-radius: 50%;
	}
	.pageListBox {
		padding: 30px 20px 30px;
		background: #fff;
	}
	.pageListBox {
		margin-top: 90px;
	}

	/* --------- archive ----------- */
	.archiveBox {
		margin-top: 50px;
		padding: 27px 26px 30px;
		border: 4px solid #6EAB38;
		border-radius: 12px;
	}
	.archiveBox h2 {
		margin-bottom: 25px;
		font-size: 2.0rem;
		font-weight: var(--font-w-bold);
		text-align: center;
		letter-spacing: 1px;
	}
	.archiveBox li + li {
		margin-top: 20px;
	}
	.archiveBox a {
		display: flex;
		align-items: center;
		justify-content: center;
		padding: 14px 12px;
		border: 1px solid #6EAB38;
		border-radius: 6px;
		color: #4F990E;
		font-size: 1.4rem;
		font-weight: var(--font-w-bold);
		line-height: 1.6;
		overflow-wrap: anywhere;
		text-align: center;
		box-shadow: 0 2px 0 #6EAB38;
	}
	.archiveBox a::after {
		content: "";
		width: 13px;
		height: 11px;
		margin-left: 12px;
		flex-shrink: 0;
		background: url(../files/images/icon_arrow.svg) center / contain no-repeat;
	}

	/* --------- contact ----------- */
	.contactBox {
		margin-top: 47px;
		padding: 32px 27px 35px;
		border-radius: 8px;
		background: #f5f5f5;
	}
	.contactBox h2 {
		margin-bottom: 25px;
		font-size: 2.0rem;
		font-weight: var(--font-w-bold);
		text-align: center;
		letter-spacing: 1px;
	}
	.contactBox dl {
		font-size: 1.6rem;
		line-height: 1.7;
		overflow-wrap: anywhere;
	}
	.contactBox div + div {
		margin-top: 32px;
	}
	.contactBox dt {
		margin-bottom: 8px;
		font-weight: var(--font-w-bold);
	}
	.contactBox dd,
	.contactBox a {
		color: #333;
	}

	/* --------- gallery modal ----------- */
	body.is-modal-open {
		overflow: hidden;
	}
	.galleryModal {
		position: fixed;
		inset: 0;
		display: none;
		align-items: flex-start;
		justify-content: center;
		overflow-y: auto;
		z-index: 1000;
	}
	.galleryModalOverlay {
		position: fixed;
		inset: 0;
		background: rgba(0, 0, 0, 0.8);
	}
	.galleryModalBox {
		position: relative;
		width: 100%;
		background: #fff;
		overflow: hidden;
		z-index: 1;
	}
	.galleryModalClose {
		position: absolute;
		top: 13px;
		right: 10px;
		display: flex;
		flex-direction: column;
		align-items: center;
		border: 0;
		background: transparent;
		color: #222;
		font-family: inherit;
		font-size: 1.1rem;
		font-weight: var(--font-w-regular);
		line-height: 1.4;
		z-index: 2;
	}
	.galleryModalClose img {
		width: 41px;
		margin-bottom: 5px;
	}
	.galleryModalImage {
		padding: 80px 0 20px;
		text-align: center;
	}
	.galleryModalImage img {
		width: 90%;
	}
	.galleryModalCaption {
		padding: 31px 20px 33px;
		background: #f3f3f3;
		font-size: 1.8rem;
		line-height: 1.5;
		text-align: center;
	}

	/*------------------------------------
		footer
	-------------------------------------*/
	/* --------- ページトップボタン ----------- */
	#gPagetop {
		transition: 0.3s;
		cursor: pointer;
		visibility: hidden;
	}
	#gPagetop .pagetopBtn {
		position: fixed;
		right: 15px;
		display: block;
		width: 45px;
		height: 45px;
		border-radius: 100%;
		z-index: 100;
	}
	#gPagetop .pagetopBtn::after {
		content: "";
		position: absolute;
		top: 0;
		right: 0px;
		display: block;
		width: 45px;
		height: 45px;
		border-radius: 100%;
		background-image: url(../files/images/pagetop_icon.svg);
		background-position: center;
		background-size: contain;
		background-repeat: no-repeat;
		transition: all 0.2s ease;
		z-index: 100;
	}
	.footerWrap {
		height: 102px;
		background-color: var(--footer-color);
	}
	.footerInner {
		display: flex;
		align-items: flex-end;
		justify-content: center;
		height: 100%;
		padding: 0 0 20px;
	}
	.copyright {
		font-size: 1.3rem;
		font-weight: var(--font-w-regular);
	}
}
