h1 { padding-top:15px; text-align:center; }
h1 a { color:var(--text); }
h1 a:hover ,
h1 b { color:var(--linkactive); }

.sptoplikepage { display:inline-block; width:60px; height:24px; padding:6px 0 0 0; vertical-align:middle; }

.sp_lotto_top { width:320px; height:100px; }
@media (min-width:768px) { .sp_lotto_top { width:728px; height:90px; } }
@media (min-width:1000px) { .sp_lotto_top { width:970px; height:90px; } }
@media (min-width:1000px) and (min-height:700px) { .sp_lotto_top { width:970px; height:250px; } }

.lotto-mobile-middle { width:300px; height:250px; }
@media(min-width:336px) { .lotto-mobile-middle { width:336px; height:280px; } }

.lotto-mobile-middle2 { width:300px; height:250px; }
@media(min-width:336px) { .lotto-mobile-middle2 { width:336px; height:280px; } }

.lotto-mobile-middle3 { width:300px; height:250px; }
@media(min-width:336px) { .lotto-mobile-middle3 { width:336px; height:280px; } }
@media(min-height:500px) { .lotto-mobile-middle3 { width:300px; height:600px; } }
@media(min-width:800px) { .lotto-mobile-middle3 { width:600px; height:280px; } }
@media(min-width:1000px) { .lotto-mobile-middle3 { width:970px; height:280px; } }

#maincontent { padding:15px 0 0 0; text-align:center; }

#resultbox { padding:10px 0 20px 0; }
#resultbox .xsign { width:60px; height:60px; vertical-align:middle; }
#resultbox .xnum { display:inline-block; padding:0 0 0 8px; vertical-align:middle; font-size:24pt; letter-spacing:5px; }
#resultbox .xres { padding:8px 2px 0 2px; font-size:26pt; }

.spcard { position:relative; box-sizing:border-box; width:98%; max-width:450px; margin:0 auto 20px auto; padding:15px 5px; border-radius:10px; border:1px solid #d0d3aa; background-color:#f7fad4; font-size:14pt; color:#222; }
.spcard .xlabel { position:absolute; left:5px; top:20px; width:46%; }
.spcard .xnum { padding:0 0 0 47%; ; font-size:36pt; font-weight:bold; color:#ee2244; }
.spcard .xdateth { padding:5px 0 0 47%; ; font-size:18pt; }
.spcard .xdateen { padding:5px 0 0 47%; ; font-size:13pt; color:#ee2244; }
.spcard .xinfo { position:absolute; left:5px; bottom:20px; width:46%; font-size:12pt; }
.spcard .xinfo .xl { display:inline-block; padding:2px 7px; border-radius:5px; background-color:#ee2244; vertical-align:middle; color:#eee; }
.spcard .xinfo .xv { display:inline-block; padding:2px 15px 2px 7px; vertical-align:middle; color:#ee2244; }
.spcard .xinfo .xv:last-child { padding-right:0; }

.spdn { box-sizing:border-box; width:98%; max-width:1200px; margin:0 auto 35px auto; padding:15px 5px; border-radius:10px; background-color:var(--primary); text-align:center; font-size:16pt; font-family:prompt,sans-serif; font-weight:bold; color:var(--primarytext); }
.spdn .x1 { font-size:24pt; }
.spdn .x2 { padding:5px 0 10px 0; }
.spdn .xqrimg { width:250px; height:250px; }

.spshbar { text-align:center; }
.spshbar .xlabel { display:inline-block; padding:0 10px 0 0; vertical-align:middle; font-size:11pt; color:var(--text2); }
.spshbar .xbt { display:inline-block; width:28px; height:28px; padding:5px 8px; border-radius:5px; vertical-align:middle; cursor:pointer; }
.spshbar .xbt:hover { background-color:var(--bg3); }

#cform { box-sizing:border-box; width:100%; max-width:720px; margin:15px auto 10px auto; text-align:center; }
#cform input { box-sizing:border-box; vertical-align:middle; }
#cform input[type=number] { width:calc(100% - 165px); height:50px; padding:5px 0 5px 10px; border-radius:10px; outline:none; border:1px solid var(--bg4); background-repeat: no-repeat; background-position:8px 12px; font-size:20pt; font-weight:bold; color:var(--text); }
#cform input[type=number]:focus { border-color:var(--text4); }
#cform input[type=number]::placeholder { font-size:16pt; color:var(--text4); }
#cform input[type=number]::-webkit-inner-spin-button { -webkit-appearance:none; }
#cform input[type=submit] { width:140px; height:50px; margin-left:10px; border-radius:10px; outline:none; border:1px solid var(--primary); background-color:var(--primary); font-size:14pt; color:var(--primarytext); }
#cform input[type=submit]:hover { border-color:var(--text); }
#cform .xscan { display:inline-block; box-sizing:border-box; height:54px; margin:5px 0 5px 5px; padding:5px 0 0 12px; border-left:1px solid var(--bg4); vertical-align:middle; font-size:14pt; color:var(--linkpj); }
#cform .xscan img { margin:0 3px 0 0; vertical-align:middle; }
#cform .xscan:hover { filter:brightness(115%); }

.spfbcm { max-width:700px; margin:10px auto; }
.spfbcm h3 { margin:0px; padding:0 0 5px 0; font-size:16pt; font-weight:normal; color:var(--textblue); }

.spwins { padding:20px 0 0 0; text-align:center; }
.spwins .xtitle { font-size:18pt; color:var(--textred); }
.spwins .xcount { display:inline-block; box-sizing:border-box; width:100%; max-width:800px; margin:5px 0; padding:5px 10px; border-radius:5px; background-color:var(--bgred); font-size:14pt; color:var(--text); }
.spwins .xnote { font-size:13pt; color:var(--text3); }

.spapplink { display:block; margin:20px 0 0 0; text-align:center; }
.spapplink img { width:92%; max-width:360px; border-radius:5px; }

@media(max-width:900px){
	#showform { padding-left:10px; }
}
@media(max-width:700px){
	.spht .xlink ,
	.spht .xmore { width:49%; }
}
@media(max-width:500px){
	.spdn .x1 { font-size:22pt; }
	#cform input[type=number]::placeholder { font-size:14pt; }
	.spht .xlink { width:100%; max-width:320px; }
	.spht .xmore { width:100%; max-width:320px; padding:10px; }
}
@media(max-width:400px){
	.spcard .xnum { font-size:32pt; }
	.spcard .xdateth { font-size:16pt; }
	.spcard .xdateen { font-size:13pt; }
}
@media(max-width:340px){
	.spcard .xnum { font-size:28pt; }
	.spcard .xinfo .xl { padding:2px 4px; }
	.spcard .xinfo .xv { padding:2px 5px 2px 2px; }
}