@charset "utf-8";
/* index.css */
/*===============================================
●共通
===============================================*/

svg .noOpacity {
	opacity: 0;
}

/*mainVisual*/
.mv {
	margin: 0 auto;
	background-color: #fea182;
}
.mv_inner {
	box-sizing: border-box;
}
.mv_inner .logo {
	position: absolute;
	font-family: "Noto Sans JP", sans-serif;
	font-weight: 700;
}
.mv_inner .logo a {
	display: flex;
	justify-content: center;
	align-items: center;
	color: #fff;
	letter-spacing: 0.02em;
}
.mv_inner .logo a span {
	margin-right: 1em;
}
.mv_inner .logo a span svg {
	width: 25px;
	height: 42px;
	fill: #fff;
}
.mv_inner .mv_txt {
	width: 100%;
	position: absolute;
	color: #fff;
	text-align: right;
}
.mv_inner .mv_txt h1 {
	display: flex;
	justify-content: flex-end;
	align-items: center;
	font-family: "Kiwi Maru", serif;
	margin-bottom: 1em;
}
.mv_inner .mv_txt h1 span {
	display: flex;
	margin-right: 0.5em;
}
.mv_inner .mv_txt h1 span svg {
	height: 1px;
	fill: #fff;
}
.mv_inner .mv_txt > span {
	display: block;
	color: #fea182;
	text-shadow: 1px 1px 0 #ffff, -1px 1px 0 #fff, 1px -1px 0 #fff, -1px -1px 0 #fff;
	font-family: "Kodchasan", sans-serif;
}

/* contents */
.contents .inner {
	position: relative;
	background-color: #fff;
}
.contentsbox {
	position: relative;
	text-align: center;
}
.contentsbox .enTitle {
	position: absolute;
	left: 50%;
	font-family: "Kodchasan", sans-serif;
	color: #fff;
}
.contentsbox .inner header {text-align: center;}
.contentsbox .inner header p {
	text-align: center;
	font-family: 'Noto Serif JP', serif;
	letter-spacing: 0.05em;
	position: relative;
}
.tit_style01 {
	font-family: "Kiwi Maru", serif;
	color: #915E4D;
	letter-spacing: 0.2em;
	line-height: 1em;
	text-align: center;
}
.tit_style02 {
	display: block;
	padding-bottom: 1em;
	font-family: "Kiwi Maru", serif;
	letter-spacing: 0.1em;
	position: relative;
	text-align: center;
}
.contentsWrap .contentsText,
.contentsWrap #greetingSighn {
	letter-spacing: 0.02em;
}
.contentsWrap #greetingSighn {
	text-align: right;
}

/* contents01 */
#contents01Back {
	background-color: #FBDE5B;
}

/* contents02 */
#contents02Back {
	display: flex;
	justify-content: center;
	align-items: center;
	background-color: #FDADAD;
}
#contents02 .headImage {
	display: flex;
	justify-content: space-between;
	align-items: baseline;
}
#contents02 .articleWrap .tit_style03 { padding-bottom: 1em;}
#contents02 .tit_style01 { margin-bottom: 0.5em;}
#contents02 dl {
	max-width: 900px;
	margin: auto;
}
#contents02 dl dt {
	font-weight: bold;
	color: #915E4D;
	line-height: 1em;
	background-color: #F8EEEB;
}
#contents02 ul {
	display: flex;
	flex-wrap: wrap;
}
#contents02 ul li img {
	width: 100%;
}
#contents02 #videoWrap {
	display: flex;
	justify-content: center;
	align-items: center;
	width: 100%;
	margin-bottom: 1em;
}
#contents02 #videoWrap video {
	width: 100%;
}

/* contents03 */
#contents03Back {
	background-color: #FFBD82;
}
#contents03 .headImage {
	display: flex;
	justify-content: flex-end;
	align-items: flex-end;
	width: 100%;
	height: 100%;
	margin: 0 auto;
}
#contents03 ul li {
	border-bottom: 1px solid #FFB59C;
}
#contents03 ul li a div {
	display: flex;
	align-items: center;
}
#contents03 ul li a time {
	color: #915E4D;
}
#contents03 ul li a .label {
	background-color: #F8EEEB;
	color: #915E4D;
	text-align: center;
	font-weight: bold;
}
#contents03 ul li a p {
	line-height: 1.5;
}

/* contents04 */
#contents04Back {
	background-color: #FFB59C;
}
#contents04 .headImage {
	display: flex;
	justify-content: flex-start;
	align-items: flex-end;
	width: 100%;
	height: 100%;
	margin: 0 auto;
}
#contents04 #membership section h3 {
	font-weight: bold;
	color: #915E4D;
	line-height: 1em;
	background-color: #F8EEEB;
}
#contents04 #membership section ul li {
	border-bottom: 1px solid #F8EEEB;
}
#contents04 #membership section ul li > p {
	line-height: 1.3;
}
#contents04 #membership section ul li .addressBox p a {
	text-decoration: underline;
	padding: 0 0.2em;
}
#contents04 #googleMap iframe {
	width: 100%;
}

/*===============================================
●画面の横幅が769px以下(スマホのみ)
===============================================*/
@media screen and (max-width: 769px){
	
	/*共通*/
	.tit_style01 {
		font-size: 1.6em;
		padding-bottom: 1em;
	}
	.tit_style02 {	
		font-size: 1.12em;
		padding-bottom: 1em;
	}
	.tit_style02:after {
		width: 50px;
		bottom: 0.5em;
		left: calc(50% - 25px);
	}
	.tit_style03{
		font-size: 1.2em;
		padding-bottom: 2em;
		margin: 2.5em 0 0;
	}
	.tit_style03::after {
		width: 30px;
		top: 2em;
		left: calc(50% - 15px);
	}
	.contentsbox .inner header p {
		font-size: 1.2em;
		margin-bottom: 1.5em;
	}
	
	.mv_inner {
		height: 100vh;
		/*margin: 0 1em 3em;*/
		border: 15px solid #fff;
		padding: 1em;
		background: url("../../images/index/mainImgSP.png") no-repeat center / contain;
		position: relative;
	}
	.mv_inner .logo {
		width: 50%;
		max-width: 150px;
	}
	.mv_inner .mv_txt {
		width: auto;
		right: 1em;
		bottom: 1.5em;
		/* font-size: 3.5vw; */
	}
	.mv_inner .mv_txt h1 {
		font-size: 4vw;
	}
	.mv_inner .mv_txt h1 span svg {
		width: 3vw;
	}
	.mv_inner .mv_txt > span {
		font-size: 10vw;
		line-height: 1;
	}
	
	/* contents */
	.contentsbox {
		height: 180px;
	}
	.contentsWrap .inner {padding: 2.33em 20px 5em;}
	#contents01 .headImage img {
		width: 250px;
	}
	.contentsbox .enTitle {
		top: 50%;
		font-size: 2em;
		transform: translate(-50%, -50%);
		letter-spacing: 0.3em;
	}
	#contents01 .enTitle {
		width: 100%;
		transform: translate(-50%, -50%);
	}
	#contents01 .enTitle span:first-child {
		margin-right: 20%;
	}
	.contentsWrap .contentsText {
		margin-bottom: 1.5em;
	}

	/* #contents02 */
	#contents02Back {
		padding: 0 1em;
	}
	#contents02 .headImage div:nth-child(2) {
		text-align: right;
	}
	#contents02 .headImage div:nth-child(2) img {
		width: 50%;
	}
	#contents02 .enTitle {
		width: 240px;
		background-color: #FDADAD;
	}
	#contents02 dl {
		margin-bottom: 2em;
	}
	#contents02 dl dt {
		padding: 0.76em 1em;
		margin-bottom: 1em;
	}
	#contents02 dl dd {padding: 0 1em;}
	#contents02 dl dd:not(:last-child) {margin-bottom: 1em;}
	#contents02 ul {
		margin-bottom: 2em;
	}
	#contents02 ul li {
		width: 48%;
	}
	#contents02 ul li:nth-child(odd) {
		margin-right: 4%;
	}
	#contents02 ul li:nth-last-child(n+2) {
		margin-bottom: 1em;
	}
	#contents02 ul li img {
		margin-bottom: 0.2em;
	}
	#contents02 ul li figcaption {
		font-size: 0.8em;
	}

	/* contents03 */
	#contents03 .headImage img {
		width: 40%;
	}
	#contents03 .enTitle {
		background-color: #FFBD82;
	}
	#contents03 ul li {
		padding: 0.7em 0;
	}
	#contents03 ul li a div {
		margin-bottom: 0.7em;
	}
	#contents03 ul li a div time {
		width: 80px;
	}
	#contents03 ul li a div .label {
		width: 80px;
		padding: 0.2em 0;
	}

	/* contents04 */
	#contents04 .enTitle {
		background-color: #FFB59C;
	}
	#contents04 #membership section h3 {
		padding: 0.76em 1em;
		margin-bottom: 1em;
	}
	#contents04 #membership section:not(:last-child) {
		margin-bottom: 2em;
	}
	#contents04 #membership section ul {
		padding: 0 1em;
	}
	#contents04 #membership section ul li {
		padding: 1em 0;
	}
	#contents04 #membership section ul li > p {
		margin-bottom: 1em;
	}
	#contents04 #membership section ul li .addressBox address span {
		display: block;
	}
	#contents04 #googleMap iframe {
		height: 300px;
	}
	
}

/*===============================================
●画面の横幅が770px以上(PCのみ)
===============================================*/
@media screen and (min-width: 770px){
	
	.contents {
		font-size: 16px;
	}

	/*共通*/
	.tit_style01 {
		font-size: 2.75em;
		padding-bottom: 1.2em;
	}
	.tit_style02 {	
		font-size: 1.31em;
		padding-bottom: 2em;
	}
	.tit_style03{
		padding-bottom: 2em;
		margin: 5.55em 0 0;
		font-size: 1.2em;
	}
	.tit_style03:after {
		width: 30px;
		top: 2em;
		left: calc(50% - 15px);
	}
	.contentsWrap .contentsText,
	.contentsWrap #greetingSighn {
		line-height: 2;
	}
	.contentsWrap .contentsText {
		margin-bottom: 2.81em;
	}
	
	/* メインビジュアル */
	.mv {
		max-width: 1940px;;
	}
	.mv_inner {
		height: 100vh;
		padding: 30px;
		border: 30px solid #fff;
		background: url("../../images/index/mainImg.png") no-repeat center / 60%;
		position: relative;
	}
	.mv_inner .logo a {
		font-size: 1.47em;
	}
	.mv_inner .mv_txt {
		right: 30px;
		bottom: 30px;
	}
	.mv_inner .mv_txt h1 {
		font-size: 1.6em;
		letter-spacing: 0.32em;
	}
	.mv_inner .mv_txt h1 span svg {
		width: 39px;
	}
	.mv_inner .mv_txt > span {
		font-size: 4.8em;
		line-height: 1;
		letter-spacing: 0.1em;
		margin-bottom: 0.3em;
	}

	.contents .inner {
		padding: 3.33em 6.25em 10.66em;
		margin-top: -3.5em;
	}
	.contentsbox {
		height: 350px;
	}
	.contentsbox .enTitle {
		top: 40%;
		transform: translateX(-60%);
		font-size: 3.75em;
		letter-spacing: 0.2em;
		line-height: 1;
	}
	#contents01 .enTitle {
		letter-spacing: 0.5em;
	}
	#contents01 .enTitle span:first-child {
		margin-right: 20%;
	}
	#contents02 .headImage {
		width: 100%;
		max-width: 1060px;
	}
	#contents02 dl {
		margin-bottom: 3.75em;
	}
	#contents02 dl dt {
		padding: 0.76em 2.3em;
		margin-bottom: 2em;
	}
	#contents02 dl dd {padding: 0 2.3em;}
	#contents02 dl dd:not(:last-child) {margin-bottom: 2em;}
	#contents02 dl dd address {
		line-height: 1.875;
	}
	#contents02 ul {
		margin-bottom: 4.375em;
	}
	#contents02 ul li {
		width: 31%;
	}
	#contents02 ul li:not(:nth-child(3n)) {
		margin-right: 3.5%;
	}
	#contents02 ul li:nth-last-child(n+3) {
		margin-bottom: 1.875em;
	}
	#contents02 ul li img {
		margin-bottom: 0.5em;
	}

	/* contents03 */
	#contents03 .headImage {
		max-width: 1060px;
		padding-bottom: 3%;
	}
	#contents03 ul li a {
		display: flex;
		align-items: center;
		padding: 1.63em 0 1.31em;
	}
	#contents03 ul li a time {
		width: 100px;
		font-size: 1.125em;
	}
	#contents03 ul li a .label {
		width: 88px;
		font-size: 0.94em;
		padding: 0.5em 0;
		margin-right: 1.8em;
	}
	#contents03 ul li a p {
		font-size: 1.125em;
	}
	
	/* contents04 */
	#contents04 .headImage {
		max-width: 1060px;
		padding-bottom: 4.5%;
	}
	#contents04 .enTitle {
		transform: translateX(-40%);
	}
	#contents04 #membership section:not(:last-child) {
		margin-bottom: 2.19em;
	}
	#contents04 #membership section h3 {
		padding: 0.76em 2.3em;
		margin-bottom: 2em;
	}
	#contents04 #membership section ul li {
		display: flex;
		align-items: center;
		padding: 1em 1.875em;
	}
	#contents04 #membership section ul li > p {
		width: 37%;
	}
	#contents04 #membership section ul li .addressBox {
		display: flex;
		align-items: center;
		width: 63%;
	}
	#contents04 #membership section ul li .addressBox address {
		padding: 0 0.3em 0 1.875em;
		line-height: 1.5;
	}
	#contents04 #membership section ul li .addressBox address span {
		display: block;
		margin-right: 0.3em;
	}
}
/*===============================================
●画面の横幅が910px以上(PCのみ)
===============================================*/
@media screen and (min-width: 910px){
	#contents04 #membership section ul li .addressBox address span {
		display: inline;;
	}
}

/*===============================================
●画面の横幅が400px以上769px以下(スマホのみ)
===============================================*/
@media screen and (min-width: 400px) and (max-width: 769px){
	#contents03 .headImage img {
		width: 30%;
	}
}