p {line-height:1em; margin: 0;}
#top {position: fixed; width:100%; height:35%; top: 0;}
#titlebase {position: absolute; width: 100%; top: 50%; left: 50%;
  -webkit-transform: translateY(-50%) translateX(-50%);
  transform: translateY(-50%) translateX(-50%);
}
.title {font-size: 9vmax;}
.kana {margin-top: -0.em;font-size: 2.1vmax;text-decoration: overline; letter-spacing:4.4vmax;padding-left: 1em;}
.magenta {color: #e5006b;}
#buttons {position:fixed;top: 35%; left: 50%; font-size: 6.8vh; width: 6.4em; margin-left:-3.2em;}
#buttons p {margin: 0.5em 0}
#bottom {position:fixed; margin:0 auto; width:100%; bottom: 1em; font-size: 3.4vh;}
#buttons p {
	opacity: 0.3;
	pointer-events: none;
}
#buttons p.startOk {
	opacity: 1;
	pointer-events: auto;
}

.r1 {background-image : url(../img/rinas/r1.png),url(../img/rinas/r1w.png);background-size:cover,0 0;}
.r2 {background-image : url(../img/rinas/r2.png),url(../img/rinas/r2w.png);background-size:cover,0 0;}
.r4 {background-image : url(../img/rinas/r4.png),url(../img/rinas/r4w.png);background-size:cover,0 0;}
.r6 {background-image : url(../img/rinas/r6.png),url(../img/rinas/r6w.png);background-size:cover,0 0;}
.r1:hover {background-size:0 0,cover;}
.r2:hover {background-size:0 0,cover;}
.r4:hover {background-size:0 0,cover;}
.r6:hover {background-size:0 0,cover;}
.r1:hover + #cord1{	background-color :white; }
.r2:hover + #cord2{	background-color :white; }
.r4:hover + #cord4{	background-color :white; }
.r6:hover + #cord6{	background-color :white; }
.r1w {background-image : url(../img/rinas/r1w.png); background-size: cover;}
.r2w {background-image : url(../img/rinas/r2w.png); background-size: cover;}
.r4w {background-image : url(../img/rinas/r4w.png); background-size: cover;}
.r6w {background-image : url(../img/rinas/r6w.png); background-size: cover;}
.cord {background-color : #e5006b; width: 2px; position:absolute; opacity: 0;}
.rina {background-repeat : no-repeat;position:absolute; opacity: 0;}
#rina1:hover, #rina2:hover, #rina4:hover, #rina6:hover {cursor: pointer;}

.h1 {background-image : url(../img/daidai/1.png);background-size:cover,0 0;}
.h2 {background-image : url(../img/daidai/2.png);background-size:cover,0 0;}
.h3 {background-image : url(../img/daidai/3.png);background-size:cover,0 0;}
.h4 {background-image : url(../img/daidai/4.png);background-size:cover,0 0;}
.h5 {background-image : url(../img/daidai/5.png);background-size:cover,0 0;}
.h6 {background-image : url(../img/daidai/6.png);background-size:cover,0 0;}
.h7 {background-image : url(../img/daidai/7.png);background-size:cover,0 0;}
.daidai {background-repeat : no-repeat;position:absolute; opacity: 1; z-index: 130;}

#mask {position:fixed; top: 0; bottom: 0; right: 0; left: 0; z-index: 120; display: none;}
#thank, #manual {
	text-align: left; position:fixed;top: 5%; left: 10%;
    width: 80%; height: 90%;
	display: none;
	z-index: 141;
}
#thank iframe, #manual iframe {
    width:100%;
	height:100%;
	border-radius: 0.5em;
	z-index: 142;
}　
.desc {padding: 1em;}
.desc table {width: 100%;}
.btn:hover {
	color: #ffffff;
	cursor: pointer;
}
.select {
	color: #ffffff;
}
.select_code {
	background-color : white;
}
table tr:nth-child(odd) td {
	background: #eeeeee;
}
html {
	touch-action: manipulation;
}
body {
	font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
	font-weight: bold;
	color: #9a9a9a;
	background-color : black;
	text-align:center;
	user-select:none;
	-webkit-user-select:none;
	-ms-user-select: none;
	-moz-user-select:none;
	-khtml-user-select:none;
	-webkit-user-drag:none;
	-khtml-user-drag:none;
	overscroll-behavior: none;
	overscroll-behavior-x: none;
	overscroll-behavior-y: none;
}