@charset "UTF-8";
/* Common */
html { font-size: 62.5%; scroll-behavior: smooth; }
body { font-family: "游ゴシック Medium", YuGothic, YuGothicM, "Hiragino Kaku Gothic ProN", "Hiragino Kaku Gothic Pro", メイリオ, Meiryo, sans-serif; }
html, body { scroll-padding-top: 40px; }
@media screen and (max-width: 750px) {
	html, body { scroll-padding-top: 76px; }
}
div, section, article, aside, header, footer, nav, 
dl, dt, dd, ul, li, ol, p, a { box-sizing: border-box; }
br.show-pc { display: inline; }
img.show-pc { display: block; }
br.show-sp, img.show-sp, span.show-sp { display: none; }
@media screen and (max-width: 750px) {
	br.show-sp, span.show-sp { display: inline; }
	img.show-sp { display: block; }
	br.show-pc, img.show-pc, span.show-pc { display: none; }
}
* img { display: block; width: 100%; height: auto; vertical-align: top; object-fit: contain; }

p { font-size: clamp(1.4rem, calc((16 / 960) * 100vw), 1.6rem); line-height: 2; word-break: break-all; }
a { text-decoration: none; transition: color ease 0.3s, background ease 0.3s, opacity ease 0.3s; }
@media (hover:hover) {
	a:hover,
	a:focus { opacity: 0.5; }
}
small { font-size: 1.2rem; color: #333; }
hr { display: block; border: none; background-color: #333; height: 1px; margin: 10px auto; }
sup { font-size: 50%; vertical-align: text-top; }

/* Header */
#header { display: flex; flex-wrap: wrap; align-items: center; width: 100%; padding: 0 3%; position: fixed; z-index: 999; }
.logo { display: block; flex-shrink: 0; max-width: 323px; margin-right: auto; }
@media screen and (max-width: 750px) {
	#header { background-color: rgba(255,255,255,0.9); padding: 10px 0 0 0; }
	.logo { margin: auto; }
}

/* Navigation */
nav.gnav {}
nav.gnav ul { list-style: none; display: flex; font-size: clamp(1.5rem, calc((14 / 750) * 100vw), 1.4rem); font-weight: bold; }
nav.gnav ul > li { flex-shrink: 0; }
nav.gnav ul > li:not(:last-child) { margin-right: 10px; }
nav.gnav ul > li > a { display: block; background-color: #fff; border: 1px solid #ccc; color: #646464; padding: 8px 20px; }
nav.gnav ul > li > a[href=""] { background-color: #ccc; cursor: none; pointer-events: none; }
@media (hover:hover) {
	nav.gnav ul > li > a:hover,
	nav.gnav ul > li > a:focus { color: #fff; background-color:#fdacc5; opacity: 1!important; }
}
@media screen and (max-width: 750px) {
	nav.gnav { width: 100%; box-sizing: unset; margin-top: 10px; }
	nav.gnav ul { justify-content: space-between; }
	nav.gnav ul > li { flex-shrink: 0; width: 50%; }
	nav.gnav ul > li:not(:last-child) { margin-right: 0px; }
	nav.gnav ul > li > a { text-align: center; width: 100%; padding: 4px 10px; }
}

/* Container */
.box-inner { width: 90%; max-width: 1100px; margin: 0 auto; }
@media screen and (max-width: 750px) {
	.box-inner { width: 100%; padding-left: 20px; padding-right: 20px; }
}

/* Main visual */
#mv { background: url( "../img/main_bg.png") center center / cover no-repeat; aspect-ratio: 1400 / 800; width: 100%; position: relative; overflow: hidden; }
#mv .main-logo { width: 35.7vw; height: auto; margin: 0 auto; position: absolute; bottom: 80px; left: calc(50% - 35.7vw); z-index: 2; }
#mv .main-icon { width: calc((165 / 1400) * 100vw); height: auto; filter: drop-shadow(4px 4px 4px rgba(0, 0, 0, 0.45)); position: absolute; right: 10vw; bottom: 80px; z-index: 1; }
@media screen and (min-width: 751px), print {
	#mv { min-height: 800px; }
}
@media screen and (max-width: 750px) {
	#mv { background: url( "../img/main_bg_sp.jpg") center center / cover no-repeat; aspect-ratio: 750 / 946; }
	#mv .main-logo { width: calc((334 / 375) * 100vw); bottom: calc((16 / 375) * 100vw); left: calc((20 / 375) * 100vw); }
	#mv .main-icon { width: calc((120 / 375) * 100vw); right: calc((20 / 375) * 100vw); bottom: calc((10 / 375) * 100vw); }
}
@media screen and (max-width: 750px) and (orientation: landscape) {
	#mv { height: 100vh; min-height: 480px; }
	#mv .main-logo { bottom: 16vh; }
}

/* Outline */
#outline { background-color: #ffc4d6; padding: 80px 0; }
#outline article { width: 50%; margin: 0 auto; }
#outline article > p { text-align: center; margin-bottom: 40px; }
@media screen and (max-width: 750px) {
	#outline { padding: 40px 0; }
	#outline article { width: 100%; }
	#outline p.line01 { width: calc((287 / 375) * 100vw); margin: 0 auto 20px; }
	#outline p.line02 { margin-bottom: 20px; }
	#outline p.line03 { margin-bottom: 0; }
}

/* About */
#about { padding: 80px 0; }
#about article { width: 78.5%; max-width: 1100px; margin: 0 auto 70px; }
#about .about__ttl { max-width: 698px; height: auto; margin: 0 auto 40px; }
#about p { font-size: 1.4rem; text-align: center; line-height: 1.4; margin-bottom: 20px; }
#about article p.img_place { max-width: 697px; height: auto; margin-left: auto; margin-right: auto; }
#about article p.img_target { max-width: 1251px; height: auto; margin-left: auto; margin-right: auto; }

#about span.atte-red { display: block; color: #cf689c; font-weight: bold; }
#about figure.map { text-align: center; width: 100%; margin: 0 auto 30px; }
@media screen and (min-width: 751px), print {
	#about figure.map img { max-width: 498px; height: auto; margin: 0 auto 10px; }
}
@media screen and (max-width: 750px) {
	#about { padding: 40px 0; }
	#about article { width: 100%; margin: 0 auto 10px; }
	#about .about__ttl { margin-bottom: 30px; }
	#about article p { font-size: 1.6rem; }
	#about article p.img_place { width: calc((226 / 375) * 100vw); margin: 0 auto 10px; }
	#about article p.img_target { width: calc((268 / 375) * 100vw); margin: 0 auto calc((32 / 375) * 100vw); }
}

p.txt-online { display: block; max-width: 580px; height: auto; margin: 64px auto; }
@media screen and (max-width: 750px) {
	#about p.txt-online { margin-bottom: 32px; }
}

.flexbox { display: flex; flex-direction: row; }
.flexbox.col2 { flex-wrap: wrap; justify-content: space-around; }
.flexbox.col2 > div,
.flexbox.col2 > article { width: 45%; }
@media screen and (max-width: 750px) {
	.flexbox.col2 { width: 100%; margin: auto; }
	.flexbox.col2 > div,
	.flexbox.col2 > article { width: 100%; }
	.flexbox.col2 > div:not(:last-child) { margin-bottom: 10px; }
}

.box--yellow { border: 4px solid #fdd741; }
.box--yellow > div { padding: 15px; }
.box__label { background-color: #fdd741; }
.box__label > img { width: auto; height: 100%; max-height: 60px; padding: 5px 0; }
.box__ttl { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; }
.box__ttl > img { display: block; width: 30%; border-width: 0px 4px 4px 0px; border-style: solid; border-color: #fdd741; }
.box__ttl > strong { display: block; width: 62%; font-size: clamp(1.8rem, calc((20 / 960) * 100vw), 2rem); line-height: 1.3; color: #666; padding-right: 15px; }
@media screen and (max-width: 750px) {
	.box__label > img { width: 100%; height: auto; max-height: 120px; }
}

/* Reserved */
#reserved { background-color: #ffc4d6; padding: 80px 0; }
#reserved .reserved__ttl { text-align: center; background-color: #fff; max-width: 50%; margin: 0 auto 40px; padding: 10px; }
#reserved .reserved__ttl > img { display: block; height: 24px; width: auto; margin: 0 auto; }
#reserved p { font-size: clamp(1.5rem, calc((17 / 960) * 100vw), 1.7rem); font-weight: bold; text-align: center; margin: 0 auto 10px; }
@media screen and (max-width: 750px) {
	#reserved { padding: 40px 0; }
	#reserved .reserved__ttl { max-width: 90%; }
	#reserved .reserved__ttl > img { width: 70%; height: auto; }
	#reserved p { font-feature-settings: "palt" 1; line-height: 1.5; }
	#reserved ol.ol--square { max-width: 100%; padding: 0; margin: 20px auto 40px; }
}

/* List */
ol.ol--circle { display: block; color: #666; font-size: clamp(1.6rem, calc((15 / 960) * 100vw), 1.5rem); font-weight: bold; }
ol.ol--circle > li { display: block; position: relative; padding-left: 20px; }
ol.ol--circle > li::before { content: '●'; color: #fdd741; position: absolute; top: 0; left: 0; }

ol.ol--square { display: block; max-width: 70%; margin: 0 auto 40px; padding: 15px; }
ol.ol--square li { font-size: 1.4rem; margin-bottom: 5px; padding-left: 16px; position: relative; }
ol.ol--square li::before { content: '■'; position: absolute; top: 0; left: 0; }

/* Button */
a.btn_reserved { display: block; width: 46%; margin: 0 auto 40px; transform: translateX(0%); }
@media (hover:hover) {
	a.btn_reserved:hover,
	a.btn_reserved:focus { opacity: 1!important; animation: swing 1.25s ease infinite forwards; }
}
@media screen and (max-width: 750px) {
	a.btn_reserved { width: 100%; margin-bottom: 10px; }
}
/* hover時のanimation */
@keyframes swing {
	0% { transform: translateX(0%); }
	20% { transform: translateX(5%); }
	35% { transform: translateX(0%); }
	55% { transform: translateX(5%); }
	70% { transform: translateX(0%); }
	100% { transform: translateX(0%); }
}

/* Outline02 */
#outline02 {}
#outline02 .box-inner { padding-top: 70px; padding-bottom: 70px; }
#outline02 .outline02__ttl { max-width: 700px; height: auto; margin: 0 auto 40px; }
#outline02 figure { text-align: center; max-width: 699px; margin-left: auto; margin-right: auto; }
#outline02 figure > img { max-width: 699px; height: auto; }
#outline02 figure > figcaption { font-size: 1.2rem; text-align: right; margin-top: 20px; }

/* Contents */
#contents { padding: 16px 0 40px; }
#contents .contents__ttl { margin-bottom: 32px; }
#contents .contents__ttl > img { max-width: 244px; height: auto; margin: 0 auto; }
@media screen and (max-width: 750px) {
	#contents .contents__ttl > img { width: calc((488 / 960) * 100vw); height: auto; } 
}
#contents .flexbox { gap: clamp(20px, calc((40 / 960) * 100vw), 40px); }

/* Box */
.contents__ttl + div { display: flex; flex-direction: row; flex-wrap: wrap; column-gap: 4.36%; }
.content { display: flex; flex-direction: column; align-items: stretch; margin-bottom: 8.72%; }

.content__ttl { color: #fff; font-size: clamp(2rem, calc((26 / 960) * 100vw), 2.6rem); font-weight: bold; line-height: 1; padding: 12px 16px; position: relative; z-index: 1; margin-bottom: 10px; }
.content__ttl::after { content: ''; position: absolute; left: 0; top: 0; z-index: -1; width: 100%; height: 100%; clip-path: polygon(0% 0%, 98% 0%, 100% 50%, 98% 100%, 0% 100%); background-color: #ccc; }
.content.orange .content__ttl::after { background-color: #ec8f25; }
.content.blue .content__ttl::after { background-color: #1a92c3; }
.content.red .content__ttl::after { background-color: #c43f3b; }
.content.skyblue .content__ttl::after { background-color: #6aafba; } 

.content h5 { font-size: clamp(2.4rem, calc((29 / 960) * 100vw), 2.9rem); line-height: 1.4; color: #646464; margin-bottom: 16px; }
.content h5 > small { font-size: 76%; color: #646464; }

.content__ttl + div > h5 + p { margin-bottom: 48px; }

.content p { font-size: clamp(1.5rem, calc((18 / 960) * 100vw), 1.8rem); line-height: 1.7; color: #646464; }
.content p > strong { display: inline-block; font-size: clamp(1.8rem, calc((22 / 960) * 100vw), 2.2rem); margin-bottom: calc((24 / 960) * 100vw); }
.content p.time { font-size: clamp(2rem, calc((24 / 960) * 100vw), 2.4rem); line-height: 1.3; }
.content.orange p.time { color: #ec8f25; }
.content.blue p.time { color: #1a92c3; }
.content.red p.time { color: #c43f3b; }
.content.skyblue p.time { color: #6aafba; }
.content p.time > span.small { font-size: 80%; vertical-align: middle; }

.content figure { text-align: center; height: auto; margin-top: auto; }
.content figure > img { display: inline-block; }
@media screen and (min-width: 751px), print {
	.content { width: 46.3%; max-width: 510px; }
	.content p.time { min-height: 70px; }
	.content figure { max-width: 510px; }
}
@media screen and (max-width: 750px) {
	.content { width: 100%; margin-bottom: 8%; }
	.content__ttl + div > h5 + p { margin-bottom: calc((48 / 375) * 100vw); }
	.content p.time { margin-bottom: calc((16 / 375) * 100vw); }
	.noshow { display: none; visibility: hidden; }
}

.mgb0 { margin-bottom: 0!important; }

/* Company */
#company { background-color: #f9d3e3; padding: 54px 0; }
#company .company__ttl { text-align: center; margin-bottom: 32px; }
#company .company__ttl > span { display: inline-block; background-color: #fff; padding: 8px 16px; }
#company .company__ttl img { max-width: 344px; height: auto; }

p.txt-cs { max-width: 442px; height: auto; margin: 0 auto; }
@media screen and (min-width: 751px), print {
	p.txt-cs { width: 30%; }
}
@media screen and (max-width: 750px) {
	p.txt-cs { width: calc((220 / 375) * 100vw); margin: calc((56 / 375) * 100vw) auto calc((130 / 375) * 100vw); }
}

/* Footer */
#footer { display: block; background-color: #b7dfcd; text-align: center; width: 100%; padding: 60px 20px 40px; }
p#copy { font-size: 1.1rem; text-align: center; }

/* Organizer */
dl.organizer { font-size: clamp(1.3rem, calc((14 / 960) * 100vw), 1.4rem); text-align: left; line-height: 1.5; }
dl.organizer > div { display: flex; }
dl.organizer > div:not(:last-child) { margin-bottom: 10px; }
dl.organizer dt { flex-shrink: 0; }
dl.organizer dt::after { content: ':'; margin-right: 10px; }
@media screen and (max-width: 750px) {
	#footer { padding: 20px 0; }
}

/* Banner Area */
ul.banner_area { display: flex; flex-wrap: wrap; gap: 4%; margin-left: auto; }
ul.banner_area li { margin-bottom: 4%; }
ul.banner_area li:nth-child(2) { margin-left: 6%; }
ul.banner_area li a { display: block; text-align: left; width: auto; height: 24px; }
ul.banner_area li a > img { width: auto; height: 100%; }

/* SNS icons */
ul.sns { width: 90%; list-style: none; display: flex; justify-content: center; align-items: center; margin: 30px auto; }
ul.sns li { flex-shrink: 0; margin: 0 1% 5px; }
ul.sns li a { display: block; width: 36px; height: 36px; }

/* About kihrc */
.about-kihrc { display: flex; margin-top: 37px; }
.about-kihrc > div:nth-child(2) { margin-left: auto; width: 34%; }
.about-kihrc-info { text-align: left; }
.about-kihrc-info p { font-size: 1.1rem; line-height: 1.5; margin-bottom: 0!important; }
a.kihrc-logo { display: block; width: 255px; height: auto; margin-bottom: 10px; }
p.txt-tel {}
p.txt-address {}
p.txt-hour {}
@media screen and (max-width: 750px) {
	.about-kihrc { display: block; }
	.about-kihrc-info { margin-bottom: 16px; }
	.about-kihrc > div:nth-child(2) { width: 100%; }
}

/* Others */
.txt--circle { font-size: 1.6rem; line-height: 1.5; }
.txt--circle::before { content: '●'; display: inline-block; vertical-align: middle; margin-right: 8px; }
.txt--center { text-align: center; }
.bold { font-weight: bold; }

.btn_contact { background-color: #000; border: 1px solid #000; border-radius: 24px; color: #fff; font-size: 1.4rem;  display: inline-block; padding: 4px 16px; margin-top: 10px; }
.btn_contact:hover { color: #000; background-color: transparent; }

/* Scroll Animation　*/
.fadein { opacity: 0; transition: opacity ease 1s 0.25s; }
.fade_action { opacity: 1; }