html,body {
  text-size-adjust: none;
  -webkit-text-size-adjust: none;
  -moz-text-size-adjust: none;
  -ms-text-size-adjust: none;
}

body{
background-color: #fff5bb;
font-family: ヒラギノ丸ゴ ProN;
}
/* 表は　#f5f0b8 */

h1,h2 {
margin: 1px 0 ;
}

h3 {
margin: 10px 0 ;
}

p {
text-align: center;
}

h1 {
text-align: center;
text-shadow:
0.5px 0.5px #680439, -0.5px -0.5px #680439,
-0.5px 0.5px #680439, 0.5px 0px #680439,
2px 2px 2px white, -2px -2px 2px white,
-2px 2px 2px white,  2px -2px 2px white;
color: #cb5425;
}

.grid {
display: grid;
width: 90%;
max-width: 960px;
grid-template-columns: repeat(3, auto);
grid-template-rows: auto repeat(7, auto) auto;
grid-gap: 0px;
margin: 0 auto;
text-align: center;
}

.horizon {
grid-column: 1 / -1;
}

.big {
grid-column: 1 / -2;
grid-row: 2 / 5;
position: auto auto;
}

.large-h {
object-fit: cover;
/*object-position: top;*/
height: calc(99%);
}

.middle {
/*grid-row: span1;*/
grid-column: 1 / -2;
}

.small{
grid-row: span1;
grid-column: span1;
}

img {
border-radius: 5px; /* 角の丸み */
}


/* 詳細部分 */
.detail {
grid-template-columns: 1fr;
grid-template-rows: auto auto;
background-color: #ffffee;
display: grid;
width: 90%;
max-width: 800px;
margin: 5px auto;
padding: 10px;
border-radius: 5px; /* 角の丸み */
}

.img {
grid-row: 2 / -1;
grid-columns: 2;
}

.genre {
border-radius: 0.8em;
display: inline;
padding: 0 0.3em;
vertical-align: middle;
margin-right: 0.2em;
}

/* ジャンル色指定 */
.stage {
background-color: #faa5df;
}
.ws {
background-color: #fff100;
}
.exhi {
background-color: #bbe3f9;
}


h2 {
grid-row: 1 / 2;
grid-column: 1 / -1;
}

h3 {
grid-column: 1 / -1;
margin-top: 2px;
}

h3 + div {
padding: 0 2rem 0.2rem;
}

.large-d {
grid-template-columns: 20% auto;
}

th,td {
border-bottom: 1px dotted #cb5425;
}

tr:last-child td,
tr:last-child th {
border-bottom: none;
}

th { width: 20%; }

span { display: inline-block; }

em { 
font-style: none;
font-weight: bold;
}

/* スマホ用 */
@media only screen and (max-width: 600px) {
	.detail, .grid {
	width: calc(100%-10px);
	}
	
	.big {
	grid-column: 1 / -1;
	}
	.largeh {
	height: auto;
	}
	
	.grid {
	grid-template-columns: repeat(1, auto);
	grid-template-rows: none;
	}
	.big {
	grid-column: 1 / -1;
	object-fit: cover;
	object-position: top;
	}
	
	.detail {
	background-color: rgba(250,250,255,0.7);
	}
	.large-d {
	grid-template-columns: 1fr;
	}
	
	h1,h2 { font-size: 1.3rem; }
	h3 { font-size: 1.1rem; }
	
	h3 + div { padding: 0 0.5rem 0.1rem; }
	
	th { width: 30%; }
}
*/