@charset "utf-8";

html{scroll-behavior: smooth;}
#wrap{overflow:visible;}

header{background:#000;}
h1 a img{max-width:200px;}
nav{background:url(/wp/wp-content/uploads/bg_flower.png) #222;border-top:solid 2px #974;}
nav a{display:grid;place-content:center;height:60px;padding:0;font-size:1.4em;font-family:"Tangerine",serif;font-weight:bold;line-height:0.7;color:#b79f76;background:none;}
nav a:hover{opacity:0.8;color:#7d6c4f;}

/*トップ画像*/
#helo{position:relative;display:grid;place-content:center;
	background:
		url(/wp/wp-content/uploads/couner_1.png) no-repeat top left,
		url(/wp/wp-content/uploads/couner_2.png) no-repeat top right,
		url(/wp/wp-content/uploads/couner_3.png) no-repeat bottom left,
		url(/wp/wp-content/uploads/couner_4.png) no-repeat bottom right,
		linear-gradient(90deg, #000, #1f1f1f 50%, #000);
}
#helo > img{margin:0 auto;}
#helo img{filter:none;}
#helo div{position:absolute;left:0;bottom:2em;width:100%;text-align:center;}
#helo div img{display:block;width:100%;max-width:20px;aspect-ratio:45 / 150;animation: loop_animation 2s linear infinite;}
@keyframes loop_animation{
	0%{transform:rotateY(0deg);}
	30%{transform:rotateY(180deg);}
	60%,100%{transform:rotateY(360deg);}
}
#helo div span::after{content:'Scroll';display:block;text-align:center;color:#974;font-family:serif;letter-spacing:1px;}


h2{font-size: clamp(1.8em, calc(1.8rem + ((1vw - 0.234375em) * 0.6214)), 2.4em);}
h2::before{content:none;}
/*
h2::before{margin:0 auto 1em;padding-top:1em;padding-bottom:0.2em;border-bottom:solid 1px #974;
font-size:0.8em;font-family:Tangerine,serif;
background:url(https://bar-2face.com/wp/wp-content/uploads/bijou_h2_img1.png) no-repeat top center;
}
*/
h2 span,h3 span{display:block;}

#link{display:none;}

#weekday_schedule ul.week_calendar li.target a{background:#974!important;}

#sns{display:none;}


main > section{position:relative;border-bottom:solid 2px #974;}
main > section::before{content:'';display:block;width:40px;height:20px;background:url(/wp/wp-content/uploads/sec_img.png) no-repeat center;background-size:contain;
	position:absolute;left:50%;top:0;transform:translateX(-50%) rotateZ(180deg);z-index:10;}
main > section::after{content:'';display:block;width:40px;height:20px;background:url(/wp/wp-content/uploads/sec_img.png) no-repeat center;background-size:contain;
	position:absolute;left:50%;bottom:0;transform:translateX(-50%);z-index:10;}
#bunny section .box{max-width:700px;padding:5em 1.4em;}
#bunny #helo{padding:0;height:calc(100dvh - 60px);}

#read{background:url(/wp/wp-content/uploads/bg_flower.png) #222;color:#ccc;}
#concept{background:#f9f9f9;;}
#point{background:url(/wp/wp-content/uploads/bg_flower.png) #222;color:#ccc;}
#member{background:#f9f9f9;;}
#step{background:#222;color:#ccc;}
#scene{background:#f9f9f9;}


#about{background:url(/wp/wp-content/uploads/bg.png) #3b3123;border-bottom:solid 6px #974;}
#about .img_col3{border-bottom:solid 6px #974;}


#point .box{max-width:960px;}
#point h2 span{white-space:nowrap;}
#point ul{max-width:960px;margin:auto;}
#point li{flex:1;padding:2em;border:solid 2px #974;background:#222;}
#point li:not(:last-child){margin-bottom:1.8em;}
#point h3{padding:0;font-size:1.3em;}
@media (width >= 820px) {
	#point ul{display:flex;gap:2em;}
	#point li:not(:last-child){margin-bottom:0;}
}


#step .box{max-width:600px;}
#step ol{counter-reset:step;}
#step ol li{position:relative;list-style:none;padding:1em;text-align:center;border:solid 2px #974;counter-increment:step;}
#step ol li:not(:last-child){margin-bottom:1.8em;}
#step ol li:not(:last-child)::after{content:'▼';position:absolute;left:0;bottom:0;display:block;width:100%;text-align:center;color:#974;transform:translateY(100%);}
#step ol li span{display:block;font-size:1.4em;}
#step ol li span::before{content:'Step' counter(step);display:block;margin-bottom:0.3em;padding-bottom:0.3em;font-size:1.2em;line-height:1;color:#974;font-weight:bold;font-family:"Tangerine",serif;border-bottom:solid 1px #974;}


#scene .box{text-align:center;}
#scene ul{display:inline-block;margin:0 auto 1em;text-align:left;}
#scene li{display:flex;line-height:1;padding:0.5em 0;align-items:center;}
#scene li::before{content:'◆';display:inline-block;padding-right:1em;color:#974;font-size:0.5em;/*width:20px;height:20px;background:url(/wp-content/uploads/list_arrow.png) no-repeat center;background-size:contain;*/}
#scene p{}
@media (width >= 820px) {
	/*.sec5 ul{display:flex;gap:2em;}
	.sec5 li{flex:1;display:grid;place-content:center;padding:2em;width:300px;aspect-ratio:1 / 1;border:solid 2px #974;border-radius:100%;}*/
}


#system{background:url(/wp/wp-content/uploads/bg_flower.png) #222;}
#bunny #system .box{box-sizing:border-box;text-align:center;padding:2em 1em;border-image:url(/wp/wp-content/uploads/system_bg.png) 150 / 60px repeat;background-color:#111;color:#974;}
#system table{margin-bottom:2em;width:auto;}
#system table.plus{margin-top:2em;}
#system th,#system td{padding:0.5em;text-align:center;color:#974;}
#system th{font-weight:normal;}
#system td{font-weight:700;font-size:1.2em;}
#system p{margin-bottom:2em;}
#system .box > p:last-of-type{padding-bottom:2em;border-bottom:double 4px #974;}

#qr{padding:4em 1em;text-align:center;background:#111;}
#qr img{width:100%;max-width:250px;}
#qr p{color:#fff;font-size:1.2em;}

#info{text-align:center;}
#info .box{display:inline-block;max-width:none;}
#info ul{}
#info ul li{padding:0 1em;text-align:left;}
#info ul li:not(:last-child){margin-bottom:1em;padding-bottom:1em;border-bottom:dotted 1px #111;}
#info ul li h3{margin-bottom:0.5em;padding:0;font-size:1em;text-align:left;}
#info ul li p{margin:0;}



/************************************
** レスポンシブデザイン用のメディアクエリ
************************************/

/*481px以上*/
@media screen and (min-width: 481px){
  /*必要ならばここにコードを書く*/
#helo img{max-width:600px;}

}

/*641px以上*/
@media screen and (min-width: 641px){
header{padding:0.3em 1em;}
	nav a{box-sizing:border-box;padding:1em 2em;font-size:1.6em;}

}

/*1025px以上*/
@media screen and (min-width: 1025px){
  /*必要ならばここにコードを書く*/
	#helo {max-height:750px;}
	#helo div{display:none;}
	nav{background:none;border:none;}
}


#tel{padding:4em 1em;text-align:center;background:url(/wp/wp-content/uploads/bg_flower.png) #333;}
#tel::before,#tel::after{content:none;}
#tel p span{display:block;max-width:300px;margin:auto;}
#tel p span:not(:last-child){margin-bottom:1em;}
#tel input#passcode{padding:0.5em;font-size:1.1em;}
#tel .ng{color:#ff0;}
#tel .button{display:flex;justify-content:center;align-items:center;}
#tel .button::before,#tel .button::after{content:'';display:block;width:40px;height:auto;aspect-ratio:50 / 34;background:url(/wp/wp-content/uploads/tel_frame.png) no-repeat center;background-size:contain;}
#tel .button::after{transform:rotateY(180deg);}
#tel p button{display:block;flex-basis:250px;line-height:2em;background:#111;color:#974;border:solid 2px #974;}
#tel p.ok span a{display:block;padding:0 1em;font-size:2em;color:#fff;border:solid 2px #974;}