@charset "UTF-8";

@font-face {
	font-family: "CenturyGothic";
	src: url("https://lib.kasaiyuki.com/fonts/CenturyGothic.ttf") format("truetype");
}
body {
	padding: 0;
	margin: 0;
	background-color: #050505;
}
#wrap {
	width: 100%;
	color: white;
	background-color: #0A0A0A;
	font-size: 2.5vw;
	font-family: "CenturyGothic";
	aspect-ratio: 16 / 9;
}
#top-wrap {
	height: 8%;
	background-color: #050505;
	position: relative;
}
#top-wrap .logo {
	height: 100%;
	margin-left: 1%;
}
#top-wrap .logo img {
	height: 80%;
	margin-top: 0.4%;
}
#top-wrap .time {
	text-align: right;
	padding-right: 1%;
	height: 90%;
	position: absolute;
	bottom: 0;
	right: 0;
}
table {
	border-collapse: collapse;
	width: 100%;
	height: 90%;
}
tr {
	height: 16.6%;
}
tr:nth-child(odd) {
	background-color: #1A1920;
}
td {
	border: 1px solid white;
	white-space: nowrap;
	overflow: hidden;
}
td.title {
	width: 50%;
	max-width: 0;
	border-left: none;
	padding-left: .5%;
	padding-right: .5%;
	font-family: 'Open Sans', 'Helvetica Neue', sans-serif;
}
td.time {
	width: 10%;
	text-align: center;
	border-right: none;
	position: relative;
}
td .english {
	font-family: "CenturyGothic";
	font-size: 0.6em;
}

/***** 残りわずか・完売 *****/
/* 時間を全面に持ってくる */
td.time div.time {
	position: relative;
	z-index: 9;
}
/* 背景 */
.few {
	background-color: #7F4E00;
}
.sold {
	background-color: #600704;
}
/* マーク */
td.time.few div.mark {
	width: 100%;
	height: 60%;
	position: absolute;
	top: -8%;
	color: #CD8013;
	font-size: 1.8em;
}
td.time.sold div.mark {
	width: 100%;
	height: 60%;
	position: absolute;
	top: -36%;
	color: #CD1E01;
	font-size: 3.5em;
}
td.time.few div.mark::before {
	content: "△";
}
td.time.sold div.mark::before {
	content: "×";
}
/* テキスト */
td.time div.text,
td.time div.option {
	display: flex;
	justify-content: center;
	align-items: center;
	width: 100%;
	height: 40%;
	position: absolute;
	bottom: 0;
	left: 0;
}
td.time.few div.text {
	background-color: #b47012;
	font-size: 0.6em;
}
td.time.sold div.text {
	background-color: #9A1200;
	font-size: 0.7em;
}
td.time.few div.text::before {
	content: "残りわずか";
}
td.time.sold div.text::before {
	content: "完売";
}

td.time.tcx div.text,
td.time.imax div.text,
td.time.mx4d div.text,
td.time.goon div.text,
td.time.scrx div.text,
td.time.premium div.text {
	display: none;
}
td.time.tcx div.option {
	width: 50%;
	background: url(./asset/tcx_logo.png);
	background-size: cover;
}
td.time.imax div.option {
	width: 50%;
	background: url(./asset/imax_logo.png);
	background-size: cover;
}
td.time.mx4d div.option {
	width: 50%;
	background: url(./asset/mx4d_logo.png);
	background-size: cover;
}
td.time.goon div.option {
	width: 50%;
	background: url(./asset/goon_logo.png);
	background-size: cover;
}
td.time.premium div.option {
	width: 50%;
	background: url(./asset/premium_logo.png);
	background-size: cover;
}
td.time.scrx div.option {
	width: 50%;
	background: url(./asset/screenx_logo.png);
	background-size: cover;
}

/*
残りわずか　#7F4E00
三角　　　　#CD8013
完売　上　　#600704
完売　下　　#9A1200
バツ　　　　#CD1E01

ＩＭＡＸ　　#008ED6
？？？　　　#008488
*/