/*
@import url('https://fonts.googleapis.com/css2?family=Italianno&display=swap&text="ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz"');
*/
@font-face {
	font-family: "Italianno";
	font-display: swap;
	src:
	url("font/Italianno-Regular.woff2")format("woff2"),
	url("font/Italianno-Regular.woff")format("woff"),
	url("font/Italianno-Regular.eot")format("eot"),
	url("font/Italianno-Regular.ttf")format("truetype")
	;
}
html{
	overscroll-behavior: none;
}
body{
	font-family: "Helvetica Neue", Arial, "Hiragino Kaku Gothic ProN", "Hiragino Sans", "BIZ UDPGothic",Meiryo, sans-serif;
	color:#555;
	background:#ddd;
	margin:0;
	padding-block:10rem;/*jsが動作しない時用*/
	box-sizing: border-box;
}

a{
	text-decoration: none;
	color: #04c;
}
small, .small, .note{
	font-size:smaller;
}
figure>img, a>img, figure>iframe{
	width:100%;
	margin:0;
	vertical-align:bottom;
}
@media (min-width: 721px){
	.mobile{
		display:none;
	}
}
@media (max-width: 720px){
	.pc{
		display:none;
	}
}

#band{
	margin-block:0;
	font-size:0.9rem;
	line-height:1.8rem;
}
#band.italic{
	font-size:1rem;
}
#band.split{
	display:flex;
	flex-wrap: wrap;
	justify-content: space-between;
	margin-inline: auto;
}
#band.center{
	text-align:center;
}

#band:not(.light), #band:not(.light) a{
	color:#eee;
}

header{
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	z-index: 20;
	transition: opacity 1s;
	background: white;
}
header #band, header>#main{
	margin-inline: auto;
}
@media (min-width: 721px){
	header #band, header>#main{
		width: 720px;
	}
}
@media (max-width: 720px){
	header #band, header>#main{
		width:95%;
	}
}

@media (min-width: 721px){
	header #main.split{
		display:flex;
		flex-wrap: wrap;
		align-items: center;
	}
}
@media (max-width: 720px){
	header #main.split{
		text-align: center;
	}
}
header #main.split>svg, header #main.split>img{
	vertical-align:middle;
}

header h1{
	font-weight: normal;
	margin-block:0;
	line-height:2rem;
	display:inline-block;
	vertical-align:middle;
}
header h1>small{
	display:block;
	font-size:50%;
	line-height:1rem;
}

header nav{
	padding-inline:0;
}
@media (min-width: 721px){
	header #main.split nav{
		display:inline-block;
		vertical-align:middle;
		margin-inline:auto 0;
	}
}
@media (max-width: 720px){
	header nav{
		position: fixed;
		left: 0;
		right: 0;
		transition: opacity 1s;
	}
}
header ul{
	margin-block:0;
	padding-inline-start:0;
}
@media (max-width: 720px){
	header ul{
		margin-inline:5%;
		display: flex;
		justify-content: space-between;
		align-items: end;
	}
}

header li a, header li button{
	color:#333;
}
@media (min-width: 721px){
	header li{
		display:inline-block;
	}
	header li a{
		display:block;
		line-height:1.5rem;
		padding-block-start:0.5rem;
		margin-block-end:0.5rem;
	}
	header li:not(:first-child){
		margin-inline-start:0.5rem;
	}
	header li a:hover, header li.indicate a{
		border-block-end: solid 1px chocolate;
	}
}
@media (max-width: 720px){
	header li{
		width:14%;
		list-style:none;
		text-align:center;
	}
	header li svg{
		width:1.5rem;
		height:1.5rem;
		fill: currentColor;
		color:#333;
		margin-inline:auto;
	}
	header li p{
		font-size:0.6rem;
		text-align:center;
		margin-block:0.1rem;
	}
	header li.indicate svg{
		color:maroon;
	}
}

footer{
	position: fixed;
	bottom: 0;
	left: 0;
	right: 0;
	z-index: 10;
	transition: opacity 1s;
	background: white;
}
@media (min-width: 721px){
	footer{
		margin-block-start:4rem;
	}
}
address{
	font-style:normal;
}

body>img, body>figure{
	margin: 0 auto;
}
body>img{
	display:block;
}
@media (min-width: 721px){
	body>img, body>figure{
		width: 720px;
	}
}
@media (max-width: 720px){
	body>img, body>figure{
		width:95vw;
	}
}

#slide{
	position:relative;
	aspect-ratio: 16 / 9;
}

#slide>img{
	position: absolute;
	top: 0;
	left: 0;
	opacity: 0;
	transition: 2s;
	aspect-ratio: 16 / 9;
	object-fit: cover;
}
#slide>figcaption{
	opacity: 0;
	transition: 2s;
}
#slide>img.show, #slide>figcaption.show{
	opacity: 1;
}

img.wide{
	aspect-ratio: 16 / 9;
	object-fit: cover;
}
img.cinema{
	aspect-ratio: 235 / 100;
	object-fit: cover;
}


main{
	margin: 0 auto;
	line-height:1.5rem;
	text-align:center;
	background: white;
	box-sizing: border-box;
}
@media (min-width: 721px){
	main{
		width: 720px;
		padding:3rem 5rem 4rem;
	}
}
@media (max-width: 720px){
	main{
		width:95vw;
		padding:3rem 2% 4rem;
	}
}
main figcaption, main caption{
	padding-block:0.5rem;
}

main>img, main>svg, main>a{
	display:block;
}
@media (min-width: 721px){
	main>img, main>svg, main>a, main>form{
		width:85%;
		margin-inline:auto;
	}
}
@media (max-width: 720px){
	main>img, main>svg, main>a, main>form{
		width:100%;
	}
}
form>table, td>input[type=text], td>textarea{
	width:100%;
}
form>table input{
	line-height:1.5rem;
}

.double{
	margin-block:1rem;
}
.double>img, .double>figure, .double>a{
	margin-block:0.5rem;
	margin-inline:0;
	vertical-align:bottom;
}
@media (min-width: 721px){
	.double>img, .double>figure, .double>a{
		display:inline-block;
		width:48%;
		margin-block:0.5rem;
		margin-inline:0;
	}
}
@media (max-width: 720px){
	.double>img, .double>figure, .double>a{
		width:90%;
		margin-inline:auto;
	}
	.double>a{
		display:block;
	}
}

figure.caption{
	position:relative;
}
figure.caption figcaption{
	position: absolute;
	right: 0.5rem;
	bottom: 0.5rem;
	font-size:0.8rem;
	color:white;
	background-color: rgba(0, 0, 0, 0.3);
}
figure.caption figcaption a{
	color:#ccc;
}


main h1 small, .italic{
	font-family:'Italianno', serif;
	font-style:normal;
	letter-spacing: 0.05rem;
	font-size:smaller
}
main h1 small{
	display:block;
	margin-block-start:0.2rem;
	font-weight: normal;
}


main h1{
	font-size:1.4rem;
	color:#333;
}
main h1:not(:first-child){
	padding-block-start:4rem;
}
h2{
	font-size: 1.2rem;
	padding-block-start:2rem;
	color:#333;
}
main>h2+p, main>h2+ul, main>h2+ol, main>h3+p, main>h3+ul, main>h3+ol{
	margin-block-start:0;
}
h3{
	font-size:1.1rem;
	padding-block-start:2rem;
	color:#333;
}
main p{
	margin:0.5rem 0;
}
button{
	cursor: pointer;
}
header button{
	border:0;
	background:white;
}
form button, main>button,main>p>button{
	color:#eee;
	border:0;
	font-size:1rem;
	margin-block:0.5rem;
	padding:0.5rem 1rem ;
	border-radius: 100vh;
}

main>ul, main>ol, main>table, main>img, main>figure, main>a{
	margin:1rem auto;
}
main>ul.li-margin li, main>dl.dd-margin dd{
	margin-block-end:0.5rem;
}

main .left, li,td,dt, table.th-left th, table.td-left td, tr.th-left th, tr.td-left td{
	text-align:left;
}
main dd{
	text-align:justify;
}
.center, table.th-center th, table.td-center td, tr.th-center th, tr.td-center td{
	text-align:center;
}
.right, table.th-right th, table.td-right td, tr.th-right th, tr.td-right td{
	text-align:right;
}
.top, table.th-top th, table.td-top td, tr.th-top th, tr.td-top td{
	vertical-align: top;
}
main p, dl{
	display:inline-block;
	text-align:justify;
}
main ul, ol{
	display:inline-block;
	padding-inline-start:1rem;
}

main p.center, main p.right{
	display:block;
}
dd{
	margin-inline-start:0;
}
dd+dt{
	margin-block-start:0.5rem;
}
th,td{
	padding:0.25rem 0.5rem;
}
.oneline th, .oneline td{
	line-height:1rem;
	padding-block:0.5rem;
}
th{
	white-space:nowrap;
}
table.th-normal th{
	font-weight:normal;
}
.twotone{
	border-collapse: collapse;
}
.twotone th{
	color:#eee;
	background:#333;
	border: solid 1px white;
}
.twotone td{
	border: solid 1px #ddd;
}
table.border {
	border:1px solid #ccc;
}

details {
	margin-block-end:0.7rem;
}
details[open] {
	margin-block-end:2rem;
}

details[open] summary {
	color:firebrick;
}
details b{
	font-weight:normal;
}
summary{
	color:#333;
	cursor: pointer;
}
summary small{
	color:#555;
}

p.note, p.warn{
	padding-inline-start:1.5rem;
	text-indent:-1.5rem;
}
p.note::before{
	content:'※ ';
}
ul.note>li{
	list-style-type:'※ ';
}
p.warn::before{
	content:'！ ';
	color:firebrick;
	font-size:1.3rem;
}

.phone {
	display:block;
	text-align:center;
	font-size: 1.5rem;
	line-height: 2rem;
}
.phone:before{
	content: "\0260e\0a0";/*phpのため2つ*/
	color:orange;
}


body{
	background:blanchedalmond;
}
header{
	background:linear-gradient(maroon 0%,maroon 1.8rem,white 1.8rem,white 100%);
	border-block-end:1px solid blanchedalmond;
}
footer{
	border-block-start:1px solid blanchedalmond;
	text-align:center;
}
@media (min-width: 721px){
	footer{
		background:linear-gradient(to top,maroon 0%,maroon 1.8rem,white 1.8rem,white 100%);
	}
}
@media (max-width: 720px){
	footer{
		border-block-end:2px solid maroon;
	}
}
small, .note{
	font-size:0.9rem;
}

button, table.twotone th{
	background:maroon;
	color:#eee;
}
h2, dt,summary[open]{
	color:firebrick;
}
b{
	color:chocolate;
}

@media (min-width: 721px){
	header #main{
		margin-block:2rem;
	}
}
@media (max-width: 720px){
	header #main{
		margin-block:1rem 2rem;
	}
}

header #main>img{
	width:1.3rem;
	margin-inline-end:0.4rem;
}
header h1{
	font-size: 1.5rem;
	letter-spacing: 0.02rem;
	text-align:left;
}

@media (max-width: 720px){
 	header li:first-child img{/*個別サイズ調整*/
		width:95%;
	}
	header li:nth-child(4) img{/*個別サイズ調整*/
		width:130%;
	}
}

footer p{
	margin-block:0;
}
@media (min-width: 721px){
	address p:first-child{
		padding-block:0.5rem 0;
		font-size:1.2rem;
		color:#333;
	}
	address p:nth-child(2){
		padding-block:1.5rem 0.5rem;
		font-size:0.9rem;
	}
}
@media (max-width: 720px){
	address p:first-child{
		padding-block:5rem 0.2rem;
		font-size:1rem;
		color:#333;
	}
	address p:nth-child(2){
		padding-block:0.2rem;
		font-size:0.8rem;
	}
	footer #band{
		display:none;
	}
}

@media (min-width: 721px){
	#nav2 button{
		width:5rem;
		height:5rem;
		line-height:4.8rem;
		border: 3px solid teal;
		border-radius:3rem;
		background:white;
		color:black;
		margin:1rem 0.2rem;
		padding:0;
		font-weight:normal;
	}
}
@media (max-width: 720px){
	#nav2 button{
		background:teal;
		width:30%;
	}
	#nav2 button:nth-child(-n+2){
		width:46%;
	}
}
