@charset "UTF-8";

#contents_section { background: #FCF7EC; }
@media screen and (max-width: 767px) {
	#contents_section { padding: 0 5%; }
}

article p {margin: 0 !important; font-size: 16px; line-height: 1.75; }

/*article*/
.article { width: 100%; margin-bottom: 80px; font-size: 16px; line-height: 1.75; border-top: 1px solid #B1B1B2; padding-top: 50px; }

.articleHead { margin: 0 auto 60px; text-align: center; }
.articleHead img { display: inline-block; width: 120px; vertical-align: middle; }
.articleHead h2 { display: inline-block; margin: 0 0 0 1em !important; color: #002063; font-size: 22px; font-weight: bold !important; vertical-align: middle; text-align: left; }
.articleHead h2 span { display: block; font-size: 11px; padding: 0; font-weight: bold !important; }

.articleLead { margin: 0 auto 60px; }

.articleImage { margin: 0 auto 60px; }
.articleImage img { display: block; width: 100%; }

.articleAbout { width: 70%; margin: 0 auto 60px; padding-left: 72px; }
.articleAboutBox { padding: 40px; border-top: 2px solid #002063; border-bottom: 2px solid #002063; }
.articleAboutBox h3 { font-weight: bold; margin-bottom: 5px; }
@media screen and (max-width: 767px) {
	.articleAbout { width: 100%; margin: 0 auto 30px; padding-left: 0; }
	.articleAboutBox { padding: 5% 0  5% 12%; }
}

.articleFacilities {  }
.articleFacilities h2 { text-align: center; margin-bottom: 30px;font-size: 30px; font-weight: bold; color: #002063; }
.articleFacilities h2 span { font-size: 30px; font-weight: bold; color: #002063; background: #FCF7EC; }
.articleFacilities > p { text-align: center; margin-bottom: 50px !important; }
.articleFacilitiesBox { display: flex; justify-content: space-between; }
.articleFacility { width: 30%; color: #002063; }
.articleFacilityImg { margin-bottom: 20px; }
.articleFacilityImg img { display: block; width: 100%; }
.articleFacilityTxt { font-size: 14px; color: #002063; }
.articleFacility h4 { font-size: 18px; line-height: 1.5; font-weight: bold; margin-bottom: 10px; color: #002063; }
.articleFacility h4 span {  }
.articleFacility p { font-size: 14px; }
.articleFacility address { font-size: 14px; border-top: 1px dotted #002063; margin-top: 1em; padding-top: 1em; }
@media screen and (max-width: 767px) {
	.articleFacilitiesBox { display: block; }
	.articleFacilities h2,
	.articleFacilities h2 span { font-size: 20px; }
	.articleFacilities > p { font-size: 14px; margin-bottom: 30px !important; }
	.articleFacility { overflow: hidden; width: 100%; color: #002063; margin-bottom: 30px; }
	.articleFacility h4 { font-size: 18px; line-height: 1.5; font-weight: bold; margin-bottom: 10px; color: #002063; }
	.articleFacilityImg { float: left; width: 30%; margin: 0; }
	.articleFacilityTxt { float: right; width: 65%; }
}

/*lead*/
#lead { width: 80%; margin: 0 auto 60px; }
#lead h2 { text-align: center; font-size: 26px; margin-bottom: 20px; font-weight: 700; }
#lead h2 img { display: block; margin: 0 auto 20px; height: 80px; }
#kobayashi { clear: both; overflow: hidden; color: #002063; margin-top: 60px; }
#kobayashi .articleL { float: left; width: 20%; }
#kobayashi .articleR { float: right; width: 79%; padding: 40px 0; border-top: 1px solid #002063; border-bottom: 1px solid #002063; display: flex; justify-content: space-between; }
#kobayashi img { border: 0 !important; margin: 0 !important; width: 100%; }
#experience { width: 41px; height: 41px; background: #002063; color: #fff; border-radius: 50px; padding: 3px; }
#experience span { display: block; width: 40px; height: 40px; font-size: 10px; line-height: 40px; text-align: center; border: 1px solid #fff; border-radius: 50px; }
#experienceName { margin: 0 1em; width: 8.5em; font-size: 20px; line-height: 1; }
#experienceName em { display: block; }
#experienceName span { font-size: 12px; }
#kobayashi p { font-size: 14px; line-height: 1.5; margin: 0 !important; flex-grow: 1; }
@media screen and (max-width: 767px) {
	#lead { width: 100%; margin: 0 auto 40px; }
	#kobayashi .articleL { float: left; width: 30%; }
	#kobayashi .articleR { float: right; width: 65%; padding: 10px 0 0 5%; border-top: 1px solid #002063; border-bottom: 0; display: block; }
	#experience { float: left; }
	#experienceName { float: left; }
	#kobayashi p { clear: both; overflow: hidden; padding-top: 1em !important; }
}

/*anchorLnk*/
#anchorLnk { width: 80%; margin: 0 auto 100px; }
#anchorLnk ul { display: flex; justify-content: space-between; text-align: center; }
#anchorLnk ul li { display: inline-block; width: 15%; font-size: 16px; }
#anchorLnk ul li img { margin-bottom: 10px; }
@media screen and (max-width: 767px) {
	#anchorLnk { width: 100%; margin: 0 auto 50px; }
	#anchorLnk ul li { width: 17%; font-size: 10px; }
	#anchorLnk ul li img { margin-bottom: 5px; }

}

#bouldering .articleAbout { background: url("./img/icn-rock.svg") no-repeat 0 40px; background-size: 11%; }
@media screen and (max-width: 767px) {
	#bouldering .articleAbout { background-position:  0 5%; }
}

#tennis .articleFacilities h2 { background: url("./img/net.svg") no-repeat 0 50%; background-size: contain; }
#tennis .articleFacilities h2 span { background: #FCF7EC; padding: .3em.5em !important; margin: 0 !important; }
#tennis .articleFacilityTxt h4 { background: url("./img/icn-racket.svg") no-repeat 0 50%; background-size: contain; padding-left: 40px; }

#golf .articleAbout { background: url("./img/icn-golfcource.svg") no-repeat 0 40px; background-size: 11%; }
@media screen and (max-width: 767px) {
	#golf .articleAbout { background-position:  0 5%; }
}
#archery .articleAbout { background: url("./img/icn-target.svg") no-repeat 0 40px; background-size: 11%; }
@media screen and (max-width: 767px) {
	#archery .articleAbout { background-position:  0 5%; }
}

#boat .articleAbout { background: url("./img/icn-wave.svg") no-repeat 0 100%; background-size: contain; padding: 0; }
#boat .articleAboutBox { padding-bottom: 80px; }
@media screen and (max-width: 767px) {
	#boat .articleAboutBox { padding: 5% 0 1.8em 0; }

}
