@charset "UTF-8";
/* CSS Document */
/***********************************************
								共 通 項 目
***********************************************/
body { overflow-x: hidden; background-color: #FEFEFE; }

@media (min-width: 769px) { a[href^="tel:"] { pointer-events: none; } }
.anchor-point { margin-top: -8rem; padding-top: 8rem; }

.attention { background-color: #F2F2F2; }
.attention div p { font-size: 1.4rem; font-size: clamp(1.4rem, calc(1.4rem + ((1vw - 0.2rem) * 0.3636)), 1.6rem); line-height: 1.4; font-weight: 700; border: solid 2px #FF0000; position: relative; transition: .4s; color: #FF0000; }
.attention div p a { position: absolute; top: 0; left: 0; width: 100%; height: 100%; display: block; text-indent: -9999px; }
.attention div p:hover { background-color: #FEFEFE; }
@media (min-width: 768px) { .attention div p { text-align: center; } }

.button { line-height: 1.8; font-weight: 500; font-size: 1em; background-color: #84734D; color: #FEFEFE; /*border-radius: 1em;*/ position: relative; text-align: center; border: solid 2px #84734D; transition: .4s; }
.button a { width: 100%; height: 100%; position: absolute; top: 0; left: 0; display: block; text-indent: -9999px; }
.button:hover { background-color: transparent; color: #84734D; }

p { margin-bottom: 0; }

/*
.btn { width: 100%; text-align: center; background-color: #FFAE00; color: #FEFEFE!important; position: relative; font-size: 1em; transition: .4s;
	a { position: absolute; top: 0; left: 0; width: 100%; height: 100%; text-indent: -9999px;}
	&:hover { background-color: #D79200;}
}
*/
.bg-blk { background-color: #000000; }

.bg-gray { background-color: #292828; }

.bg-wht { background-color: #FFFFFF; }

.txt-blk { color: #000000; }

.txt-gray { color: #292828; }

.txt-wht { color: #FFFFFF; }

.txt-gold { color: #84734D; }

.youtube { position: relative; background-color: #000; }
.youtube .start { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 15%; max-width: 213px; height: auto; }
.youtube a { position: absolute; top: 0; left: 0; width: 100%; height: 100%; display: block; text-indent: -9999px; }
.youtube:hover .tbn { opacity: .6; }

/***********************************************
								コ ン テ ン ツ
***********************************************/
.hero-area { background-color: #000000; }

.content-box h2 { font-size: 2em; font-weight: 700; }
.content-box p { font-size: 1.4rem; font-size: clamp(1.4rem, calc(1.4rem + ((1vw - 0.2rem) * 0.3636)), 1.6rem); line-height: 1.4; }

.intro h3 { font-size: 1.8em; font-weight: 700; font-style: italic; }
.intro p { line-height: 1.8; font-weight: 500; }

.segment { display: flex; flex-direction: column; height: 100%; align-items: flex-start; padding: 0; /*position: relative;*/ }
.segment .img { width: 100%; transition: 0.4s; min-height: 0%; }
.segment .img img { width: 100%; flex-shrink: 0; height: auto; }
.segment .title { font-weight: 700; margin: 0; transition: 0.4s; }
.segment .title span { font-size: 0.8rem; }
.segment.itemlink { flex-direction: row; align-items: center; font-size: initial; border-radius: 1rem; overflow: hidden; }
.segment.itemlink .img { width: 35%; aspect-ratio: 5 / 6; }
.segment.itemlink .img img { width: auto; height: 100%; }
.segment.itemlink .title { font-size: 1.2em; line-height: 1; }
.segment.itemlink .title span { font-size: 0.6em; }

.notice { width: 100%; font-size: 0; background-color: #FEFEFE; border: solid 1px #DDD; font-size: 1.4rem; font-size: clamp(1.4rem, calc(1.4rem + ((1vw - 0.2rem) * 0.3636)), 1.6rem); line-height: 1.4; }
.notice h3 { font-size: 1.2em; font-weight: 500; border-left: solid 0.75rem #e60044; border-bottom: solid 1px #e60044; line-height: 1.6; }
.notice p { font-size: 1.0em; }
.notice p span { font-weight: 700; }

#venue h3 { font-weight: 700; font-size: 1.2em; }
#venue h4 { font-weight: 700; border-bottom: dashed 1px #CCC; }
#venue p span { font-size: 0.8em; }
#venue a { color: #333; text-decoration: none; }
#venue a:hover { color: #333; text-decoration: underline; }

#corona h2, #point h2 { line-height: normal; }
#corona h2 span, #point h2 span { font-size: 2em; border-bottom: solid 3px #FF0000; }
#corona h2 span::after, #point h2 span::after { display: none; }
#corona h3, #point h3 { font-weight: 500; font-size: 1.4em; }
#corona ul, #point ul { background-color: #EEE; border: solid 1px #666; }
#corona ul li, #point ul li { padding-left: 1.0em; text-indent: -1.0em; font-size: 1.4rem; font-size: clamp(1.4rem, calc(1.4rem + ((1vw - 0.2rem) * 0.3636)), 1.6rem); line-height: 1.4; }
#corona ul li span, #point ul li span { font-weight: 700; }

/***********************************************
								ト ピ ッ ク ス
***********************************************/
.page-title { background-color: #F2F2F2; }
.page-title h2 { font-size: 1.4rem; font-size: clamp(1.4rem, calc(1.4rem + ((1vw - 0.2rem) * 0.3636)), 1.6rem); line-height: 1.4; }
.page-title h2 span { font-size: 1.8em; font-weight: 700; }

.content-detail .bb1, .about .bb1 { border-bottom: solid 1px #CCC; }
.content-detail h2, .about h2 { font-size: 1.6em; font-weight: 700; }
.content-detail .date, .about .date, .content-detail .place, .about .place { font-size: 1.2em; font-weight: 500; }
.content-detail .synopsis, .about .synopsis { line-height: 1.6; }
.content-detail .synopsis span, .about .synopsis span { font-style: italic; font-weight: 700; }
.content-detail .overview h3, .about .overview h3 { font-size: 1.4em; font-weight: 700; background-color: #F2F2F2; }
.content-detail .overview ul, .about .overview ul { position: relative; }
.content-detail .overview ul::before, .about .overview ul::before { position: absolute; top: 0; left: 0; width: 3px; height: 100%; border-radius: 3px; background-color: #333; content: ""; display: block; }
.content-detail .overview ul li, .about .overview ul li { font-size: 1.4rem; font-size: clamp(1.4rem, calc(1.4rem + ((1vw - 0.2rem) * 0.3636)), 1.6rem); line-height: 1.4; }
.content-detail .overview h4, .about .overview h4 { font-size: 1em; font-weight: 700; }
.content-detail .overview ul.caution::before, .about .overview ul.caution::before { display: none; }
.content-detail .overview ul.caution li, .about .overview ul.caution li { position: relative; padding-left: 1.25em; }
.content-detail .overview ul.caution li::before, .about .overview ul.caution li::before { content: "○"; position: absolute; top: 0.25em; left: 0.7em; transform: translateX(-0.5em); display: block; font-size: 0.6em; }
.content-detail .overview ul.caution span, .about .overview ul.caution span { font-weight: 700; }

.about h2 { position: relative; padding-left: 6.5rem; font-size: 1.8em; }
.about h2::before { height: 6rem; width: 6rem; position: absolute; top: 50%; transform: translateY(-50%); left: 0; content: ""; display: block; background: url("../img/k-logo.svg") center/contain no-repeat; }
.about h2 span { font-size: 0.4em; }
.about .genre { padding: 0.2em 0.5em; color: #FEFEFE; background-color: #FF0000; font-size: 0.8em; line-height: 1.4; border-radius: 1.2em; font-weight: 400 !important; }
.about .genre.main { background-color: #BA1C44; }
.about .genre.annex { background-color: #3F69B0; }
.about .place span { font-size: 0.9em; }
.about .place span.open { color: #FF0000; }
.about p span { font-weight: 700; }
.about p a:hover { text-decoration: underline; }
