@charset "UTF-8";
/*
	Theme Name: CIKIGAME themes
	Description: CIKIGAME themes
	Theme URI: https://x.com/cikicraft115
	Author: Ken Kubota
	Author URI: https://x.com/cikicraft115
	Version: 1.0
	License: GNU General Public License
	License URI: http://www.gnu.org/licenses/gpl-2.0.html

*/
/*----------------------------------------
    normalize.css v8.0.1
----------------------------------------*/
html{line-height:1.15;-webkit-text-size-adjust:100%}body{margin:0}main{display:block}h1{font-size:2em;margin:.67em 0}hr{box-sizing:content-box;height:0;overflow:visible}pre{font-family:monospace,monospace;font-size:1em}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;text-decoration:underline dotted}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace,monospace;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0}button,input{overflow:visible}button,select{text-transform:none}button,[type="button"],[type="reset"],[type="submit"]{-webkit-appearance:button}button::-moz-focus-inner,[type="button"]::-moz-focus-inner,[type="reset"]::-moz-focus-inner,[type="submit"]::-moz-focus-inner{border-style:none;padding:0}button:-moz-focusring,[type="button"]:-moz-focusring,[type="reset"]:-moz-focusring,[type="submit"]:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:.35em .75em .625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal}progress{vertical-align:baseline}textarea{overflow:auto}[type="checkbox"],[type="radio"]{box-sizing:border-box;padding:0}[type="number"]::-webkit-inner-spin-button,[type="number"]::-webkit-outer-spin-button{height:auto}[type="search"]{-webkit-appearance:textfield;outline-offset:-2px}[type="search"]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}details{display:block}summary{display:list-item}template{display:none}[hidden]{display:none}
/*----------------------------------------
    Tailwind
----------------------------------------*/
.p-0{padding:0}.p-px{padding:1px}.p-1{padding:.25rem}.p-2{padding:.5rem}.p-3{padding:.75rem}.p-4{padding:1rem}.p-5{padding:1.25rem}.p-6{padding:1.5rem}.p-7{padding:1.75rem}.p-8{padding:2rem}.p-9{padding:2.25rem}.p-10{padding:2.5rem}.p-11{padding:2.75rem}.p-12{padding:3rem}.p-14{padding:3.5rem}.p-16{padding:4rem}.p-20{padding:5rem}.p-24{padding:6rem}.p-28{padding:7rem}.p-32{padding:8rem}.p-36{padding:9rem}.p-40{padding:10rem}.p-44{padding:11rem}.p-48{padding:12rem}.p-52{padding:13rem}.p-56{padding:14rem}.p-60{padding:15rem}.p-64{padding:16rem}.p-72{padding:18rem}.p-80{padding:20rem}.p-96{padding:24rem}.px-0{padding-left:0;padding-right:0}.px-px{padding-left:1px;padding-right:1px}.px-1{padding-left:.25rem;padding-right:.25rem}.px-2{padding-left:.5rem;padding-right:.5rem}.px-3{padding-left:.75rem;padding-right:.75rem}.px-4{padding-left:1rem;padding-right:1rem}.px-5{padding-left:1.25rem;padding-right:1.25rem}.px-6{padding-left:1.5rem;padding-right:1.5rem}.px-7{padding-left:1.75rem;padding-right:1.75rem}.px-8{padding-left:2rem;padding-right:2rem}.px-9{padding-left:2.25rem;padding-right:2.25rem}.px-10{padding-left:2.5rem;padding-right:2.5rem}.px-11{padding-left:2.75rem;padding-right:2.75rem}.px-12{padding-left:3rem;padding-right:3rem}.px-14{padding-left:3.5rem;padding-right:3.5rem}.px-16{padding-left:4rem;padding-right:4rem}.px-20{padding-left:5rem;padding-right:5rem}.px-24{padding-left:6rem;padding-right:6rem}.px-28{padding-left:7rem;padding-right:7rem}.px-32{padding-left:8rem;padding-right:8rem}.px-36{padding-left:9rem;padding-right:9rem}.px-40{padding-left:10rem;padding-right:10rem}.px-44{padding-left:11rem;padding-right:11rem}.px-48{padding-left:12rem;padding-right:12rem}.px-52{padding-left:13rem;padding-right:13rem}.px-56{padding-left:14rem;padding-right:14rem}.px-60{padding-left:15rem;padding-right:15rem}.px-64{padding-left:16rem;padding-right:16rem}.px-72{padding-left:18rem;padding-right:18rem}.px-80{padding-left:20rem;padding-right:20rem}.px-96{padding-left:24rem;padding-right:24rem}.py-0{padding-top:0;padding-bottom:0}.py-px{padding-top:1px;padding-bottom:1px}.py-1{padding-top:.25rem;padding-bottom:.25rem}.py-2{padding-top:.5rem;padding-bottom:.5rem}.py-3{padding-top:.75rem;padding-bottom:.75rem}.py-4{padding-top:1rem;padding-bottom:1rem}.py-5{padding-top:1.25rem;padding-bottom:1.25rem}.py-6{padding-top:1.5rem;padding-bottom:1.5rem}.py-7{padding-top:1.75rem;padding-bottom:1.75rem}.py-8{padding-top:2rem;padding-bottom:2rem}.py-9{padding-top:2.25rem;padding-bottom:2.25rem}.py-10{padding-top:2.5rem;padding-bottom:2.5rem}.py-11{padding-top:2.75rem;padding-bottom:2.75rem}.py-12{padding-top:3rem;padding-bottom:3rem}.py-14{padding-top:3.5rem;padding-bottom:3.5rem}.py-16{padding-top:4rem;padding-bottom:4rem}.py-20{padding-top:5rem;padding-bottom:5rem}.py-24{padding-top:6rem;padding-bottom:6rem}.py-28{padding-top:7rem;padding-bottom:7rem}.py-32{padding-top:8rem;padding-bottom:8rem}.py-36{padding-top:9rem;padding-bottom:9rem}.py-40{padding-top:10rem;padding-bottom:10rem}.py-44{padding-top:11rem;padding-bottom:11rem}.py-48{padding-top:12rem;padding-bottom:12rem}.py-52{padding-top:13rem;padding-bottom:13rem}.py-56{padding-top:14rem;padding-bottom:14rem}.py-60{padding-top:15rem;padding-bottom:15rem}.py-64{padding-top:16rem;padding-bottom:16rem}.py-72{padding-top:18rem;padding-bottom:18rem}.py-80{padding-top:20rem;padding-bottom:20rem}.py-96{padding-top:24rem;padding-bottom:24rem}.pt-0{padding-top:0}.pt-px{padding-top:1px}.pt-1{padding-top:.25rem}.pt-2{padding-top:.5rem}.pt-3{padding-top:.75rem}.pt-4{padding-top:1rem}.pt-5{padding-top:1.25rem}.pt-6{padding-top:1.5rem}.pt-7{padding-top:1.75rem}.pt-8{padding-top:2rem}.pt-9{padding-top:2.25rem}.pt-10{padding-top:2.5rem}.pt-11{padding-top:2.75rem}.pt-12{padding-top:3rem}.pt-14{padding-top:3.5rem}.pt-16{padding-top:4rem}.pt-20{padding-top:5rem}.pt-24{padding-top:6rem}.pt-28{padding-top:7rem}.pt-32{padding-top:8rem}.pt-36{padding-top:9rem}.pt-40{padding-top:10rem}.pt-44{padding-top:11rem}.pt-48{padding-top:12rem}.pt-52{padding-top:13rem}.pt-56{padding-top:14rem}.pt-60{padding-top:15rem}.pt-64{padding-top:16rem}.pt-72{padding-top:18rem}.pt-80{padding-top:20rem}.pt-96{padding-top:24rem}.pr-0{padding-right:0}.pr-px{padding-right:1px}.pr-1{padding-right:.25rem}.pr-2{padding-right:.5rem}.pr-3{padding-right:.75rem}.pr-4{padding-right:1rem}.pr-5{padding-right:1.25rem}.pr-6{padding-right:1.5rem}.pr-7{padding-right:1.75rem}.pr-8{padding-right:2rem}.pr-9{padding-right:2.25rem}.pr-10{padding-right:2.5rem}.pr-11{padding-right:2.75rem}.pr-12{padding-right:3rem}.pr-14{padding-right:3.5rem}.pr-16{padding-right:4rem}.pr-20{padding-right:5rem}.pr-24{padding-right:6rem}.pr-28{padding-right:7rem}.pr-32{padding-right:8rem}.pr-36{padding-right:9rem}.pr-40{padding-right:10rem}.pr-44{padding-right:11rem}.pr-48{padding-right:12rem}.pr-52{padding-right:13rem}.pr-56{padding-right:14rem}.pr-60{padding-right:15rem}.pr-64{padding-right:16rem}.pr-72{padding-right:18rem}.pr-80{padding-right:20rem}.pr-96{padding-right:24rem}.pb-0{padding-bottom:0}.pb-px{padding-bottom:1px}.pb-1{padding-bottom:.25rem}.pb-2{padding-bottom:.5rem}.pb-3{padding-bottom:.75rem}.pb-4{padding-bottom:1rem}.pb-5{padding-bottom:1.25rem}.pb-6{padding-bottom:1.5rem}.pb-7{padding-bottom:1.75rem}.pb-8{padding-bottom:2rem}.pb-9{padding-bottom:2.25rem}.pb-10{padding-bottom:2.5rem}.pb-11{padding-bottom:2.75rem}.pb-12{padding-bottom:3rem}.pb-14{padding-bottom:3.5rem}.pb-16{padding-bottom:4rem}.pb-20{padding-bottom:5rem}.pb-24{padding-bottom:6rem}.pb-28{padding-bottom:7rem}.pb-32{padding-bottom:8rem}.pb-36{padding-bottom:9rem}.pb-40{padding-bottom:10rem}.pb-44{padding-bottom:11rem}.pb-48{padding-bottom:12rem}.pb-52{padding-bottom:13rem}.pb-56{padding-bottom:14rem}.pb-60{padding-bottom:15rem}.pb-64{padding-bottom:16rem}.pb-72{padding-bottom:18rem}.pb-80{padding-bottom:20rem}.pb-96{padding-bottom:24rem}.pl-0{padding-left:0}.pl-px{padding-left:1px}.pl-1{padding-left:.25rem}.pl-2{padding-left:.5rem}.pl-3{padding-left:.75rem}.pl-4{padding-left:1rem}.pl-5{padding-left:1.25rem}.pl-6{padding-left:1.5rem}.pl-7{padding-left:1.75rem}.pl-8{padding-left:2rem}.pl-9{padding-left:2.25rem}.pl-10{padding-left:2.5rem}.pl-11{padding-left:2.75rem}.pl-12{padding-left:3rem}.pl-14{padding-left:3.5rem}.pl-16{padding-left:4rem}.pl-20{padding-left:5rem}.pl-24{padding-left:6rem}.pl-28{padding-left:7rem}.pl-32{padding-left:8rem}.pl-36{padding-left:9rem}.pl-40{padding-left:10rem}.pl-44{padding-left:11rem}.pl-48{padding-left:12rem}.pl-52{padding-left:13rem}.pl-56{padding-left:14rem}.pl-60{padding-left:15rem}.pl-64{padding-left:16rem}.pl-72{padding-left:18rem}.pl-80{padding-left:20rem}.pl-96{padding-left:24rem}.m-0{margin:0}.m-px{margin:1px}.m-1{margin:.25rem}.m-2{margin:.5rem}.m-3{margin:.75rem}.m-4{margin:1rem}.m-5{margin:1.25rem}.m-6{margin:1.5rem}.m-7{margin:1.75rem}.m-8{margin:2rem}.m-9{margin:2.25rem}.m-10{margin:2.5rem}.m-11{margin:2.75rem}.m-12{margin:3rem}.m-14{margin:3.5rem}.m-16{margin:4rem}.m-20{margin:5rem}.m-24{margin:6rem}.m-28{margin:7rem}.m-32{margin:8rem}.m-36{margin:9rem}.m-40{margin:10rem}.m-44{margin:11rem}.m-48{margin:12rem}.m-52{margin:13rem}.m-56{margin:14rem}.m-60{margin:15rem}.m-64{margin:16rem}.m-72{margin:18rem}.m-80{margin:20rem}.m-96{margin:24rem}.m-auto{margin:auto}.-m-0{margin:0}.-m-px{margin:-1px}.-m-1{margin:-.25rem}.-m-2{margin:-.5rem}.-m-3{margin:-.75rem}.-m-4{margin:-1rem}.-m-5{margin:-1.25rem}.-m-6{margin:-1.5rem}.-m-7{margin:-1.75rem}.-m-8{margin:-2rem}.-m-9{margin:-2.25rem}.-m-10{margin:-2.5rem}.-m-11{margin:-2.75rem}.-m-12{margin:-3rem}.-m-14{margin:-3.5rem}.-m-16{margin:-4rem}.-m-20{margin:-5rem}.-m-24{margin:-6rem}.-m-28{margin:-7rem}.-m-32{margin:-8rem}.-m-36{margin:-9rem}.-m-40{margin:-10rem}.-m-44{margin:-11rem}.-m-48{margin:-12rem}.-m-52{margin:-13rem}.-m-56{margin:-14rem}.-m-60{margin:-15rem}.-m-64{margin:-16rem}.-m-72{margin:-18rem}.-m-80{margin:-20rem}.-m-96{margin:-24rem}.mx-0{margin-left:0;margin-right:0}.mx-px{margin-left:1px;margin-right:1px}.mx-1{margin-left:.25rem;margin-right:.25rem}.mx-2{margin-left:.5rem;margin-right:.5rem}.mx-3{margin-left:.75rem;margin-right:.75rem}.mx-4{margin-left:1rem;margin-right:1rem}.mx-5{margin-left:1.25rem;margin-right:1.25rem}.mx-6{margin-left:1.5rem;margin-right:1.5rem}.mx-7{margin-left:1.75rem;margin-right:1.75rem}.mx-8{margin-left:2rem;margin-right:2rem}.mx-9{margin-left:2.25rem;margin-right:2.25rem}.mx-10{margin-left:2.5rem;margin-right:2.5rem}.mx-11{margin-left:2.75rem;margin-right:2.75rem}.mx-12{margin-left:3rem;margin-right:3rem}.mx-14{margin-left:3.5rem;margin-right:3.5rem}.mx-16{margin-left:4rem;margin-right:4rem}.mx-20{margin-left:5rem;margin-right:5rem}.mx-24{margin-left:6rem;margin-right:6rem}.mx-28{margin-left:7rem;margin-right:7rem}.mx-32{margin-left:8rem;margin-right:8rem}.mx-36{margin-left:9rem;margin-right:9rem}.mx-40{margin-left:10rem;margin-right:10rem}.mx-44{margin-left:11rem;margin-right:11rem}.mx-48{margin-left:12rem;margin-right:12rem}.mx-52{margin-left:13rem;margin-right:13rem}.mx-56{margin-left:14rem;margin-right:14rem}.mx-60{margin-left:15rem;margin-right:15rem}.mx-64{margin-left:16rem;margin-right:16rem}.mx-72{margin-left:18rem;margin-right:18rem}.mx-80{margin-left:20rem;margin-right:20rem}.mx-96{margin-left:24rem;margin-right:24rem}.mx-auto{margin-left:auto;margin-right:auto}.-mx-0{margin-left:0;margin-right:0}.-mx-px{margin-left:-1px;margin-right:-1px}.-mx-1{margin-left:-.25rem;margin-right:-.25rem}.-mx-2{margin-left:-.5rem;margin-right:-.5rem}.-mx-3{margin-left:-.75rem;margin-right:-.75rem}.-mx-4{margin-left:-1rem;margin-right:-1rem}.-mx-5{margin-left:-1.25rem;margin-right:-1.25rem}.-mx-6{margin-left:-1.5rem;margin-right:-1.5rem}.-mx-7{margin-left:-1.75rem;margin-right:-1.75rem}.-mx-8{margin-left:-2rem;margin-right:-2rem}.-mx-9{margin-left:-2.25rem;margin-right:-2.25rem}.-mx-10{margin-left:-2.5rem;margin-right:-2.5rem}.-mx-11{margin-left:-2.75rem;margin-right:-2.75rem}.-mx-12{margin-left:-3rem;margin-right:-3rem}.-mx-14{margin-left:-3.5rem;margin-right:-3.5rem}.-mx-16{margin-left:-4rem;margin-right:-4rem}.-mx-20{margin-left:-5rem;margin-right:-5rem}.-mx-24{margin-left:-6rem;margin-right:-6rem}.-mx-28{margin-left:-7rem;margin-right:-7rem}.-mx-32{margin-left:-8rem;margin-right:-8rem}.-mx-36{margin-left:-9rem;margin-right:-9rem}.-mx-40{margin-left:-10rem;margin-right:-10rem}.-mx-44{margin-left:-11rem;margin-right:-11rem}.-mx-48{margin-left:-12rem;margin-right:-12rem}.-mx-52{margin-left:-13rem;margin-right:-13rem}.-mx-56{margin-left:-14rem;margin-right:-14rem}.-mx-60{margin-left:-15rem;margin-right:-15rem}.-mx-64{margin-left:-16rem;margin-right:-16rem}.-mx-72{margin-left:-18rem;margin-right:-18rem}.-mx-80{margin-left:-20rem;margin-right:-20rem}.-mx-96{margin-left:-24rem;margin-right:-24rem}.my-0{margin-top:0;margin-bottom:0}.my-px{margin-top:1px;margin-bottom:1px}.my-1{margin-top:.25rem;margin-bottom:.25rem}.my-2{margin-top:.5rem;margin-bottom:.5rem}.my-3{margin-top:.75rem;margin-bottom:.75rem}.my-4{margin-top:1rem;margin-bottom:1rem}.my-5{margin-top:1.25rem;margin-bottom:1.25rem}.my-6{margin-top:1.5rem;margin-bottom:1.5rem}.my-7{margin-top:1.75rem;margin-bottom:1.75rem}.my-8{margin-top:2rem;margin-bottom:2rem}.my-9{margin-top:2.25rem;margin-bottom:2.25rem}.my-10{margin-top:2.5rem;margin-bottom:2.5rem}.my-11{margin-top:2.75rem;margin-bottom:2.75rem}.my-12{margin-top:3rem;margin-bottom:3rem}.my-14{margin-top:3.5rem;margin-bottom:3.5rem}.my-16{margin-top:4rem;margin-bottom:4rem}.my-20{margin-top:5rem;margin-bottom:5rem}.my-24{margin-top:6rem;margin-bottom:6rem}.my-28{margin-top:7rem;margin-bottom:7rem}.my-32{margin-top:8rem;margin-bottom:8rem}.my-36{margin-top:9rem;margin-bottom:9rem}.my-40{margin-top:10rem;margin-bottom:10rem}.my-44{margin-top:11rem;margin-bottom:11rem}.my-48{margin-top:12rem;margin-bottom:12rem}.my-52{margin-top:13rem;margin-bottom:13rem}.my-56{margin-top:14rem;margin-bottom:14rem}.my-60{margin-top:15rem;margin-bottom:15rem}.my-64{margin-top:16rem;margin-bottom:16rem}.my-72{margin-top:18rem;margin-bottom:18rem}.my-80{margin-top:20rem;margin-bottom:20rem}.my-96{margin-top:24rem;margin-bottom:24rem}.my-auto{margin-top:auto;margin-bottom:auto}.-my-0{margin-top:0;margin-bottom:0}.-my-px{margin-top:-1px;margin-bottom:-1px}.-my-1{margin-top:-.25rem;margin-bottom:-.25rem}.-my-2{margin-top:-.5rem;margin-bottom:-.5rem}.-my-3{margin-top:-.75rem;margin-bottom:-.75rem}.-my-4{margin-top:-1rem;margin-bottom:-1rem}.-my-5{margin-top:-1.25rem;margin-bottom:-1.25rem}.-my-6{margin-top:-1.5rem;margin-bottom:-1.5rem}.-my-7{margin-top:-1.75rem;margin-bottom:-1.75rem}.-my-8{margin-top:-2rem;margin-bottom:-2rem}.-my-9{margin-top:-2.25rem;margin-bottom:-2.25rem}.-my-10{margin-top:-2.5rem;margin-bottom:-2.5rem}.-my-11{margin-top:-2.75rem;margin-bottom:-2.75rem}.-my-12{margin-top:-3rem;margin-bottom:-3rem}.-my-14{margin-top:-3.5rem;margin-bottom:-3.5rem}.-my-16{margin-top:-4rem;margin-bottom:-4rem}.-my-20{margin-top:-5rem;margin-bottom:-5rem}.-my-24{margin-top:-6rem;margin-bottom:-6rem}.-my-28{margin-top:-7rem;margin-bottom:-7rem}.-my-32{margin-top:-8rem;margin-bottom:-8rem}.-my-36{margin-top:-9rem;margin-bottom:-9rem}.-my-40{margin-top:-10rem;margin-bottom:-10rem}.-my-44{margin-top:-11rem;margin-bottom:-11rem}.-my-48{margin-top:-12rem;margin-bottom:-12rem}.-my-52{margin-top:-13rem;margin-bottom:-13rem}.-my-56{margin-top:-14rem;margin-bottom:-14rem}.-my-60{margin-top:-15rem;margin-bottom:-15rem}.-my-64{margin-top:-16rem;margin-bottom:-16rem}.-my-72{margin-top:-18rem;margin-bottom:-18rem}.-my-80{margin-top:-20rem;margin-bottom:-20rem}.-my-96{margin-top:-24rem;margin-bottom:-24rem}.mt-0{margin-top:0}.mt-px{margin-top:1px}.mt-1{margin-top:.25rem}.mt-2{margin-top:.5rem}.mt-3{margin-top:.75rem}.mt-4{margin-top:1rem}.mt-5{margin-top:1.25rem}.mt-6{margin-top:1.5rem}.mt-7{margin-top:1.75rem}.mt-8{margin-top:2rem}.mt-9{margin-top:2.25rem}.mt-10{margin-top:2.5rem}.mt-11{margin-top:2.75rem}.mt-12{margin-top:3rem}.mt-14{margin-top:3.5rem}.mt-16{margin-top:4rem}.mt-20{margin-top:5rem}.mt-24{margin-top:6rem}.mt-28{margin-top:7rem}.mt-32{margin-top:8rem}.mt-36{margin-top:9rem}.mt-40{margin-top:10rem}.mt-44{margin-top:11rem}.mt-48{margin-top:12rem}.mt-52{margin-top:13rem}.mt-56{margin-top:14rem}.mt-60{margin-top:15rem}.mt-64{margin-top:16rem}.mt-72{margin-top:18rem}.mt-80{margin-top:20rem}.mt-96{margin-top:24rem}.mt-auto{margin-top:auto}.-mt-0{margin-top:0}.-mt-px{margin-top:-1px}.-mt-1{margin-top:-.25rem}.-mt-2{margin-top:-.5rem}.-mt-3{margin-top:-.75rem}.-mt-4{margin-top:-1rem}.-mt-5{margin-top:-1.25rem}.-mt-6{margin-top:-1.5rem}.-mt-7{margin-top:-1.75rem}.-mt-8{margin-top:-2rem}.-mt-9{margin-top:-2.25rem}.-mt-10{margin-top:-2.5rem}.-mt-11{margin-top:-2.75rem}.-mt-12{margin-top:-3rem}.-mt-14{margin-top:-3.5rem}.-mt-16{margin-top:-4rem}.-mt-20{margin-top:-5rem}.-mt-24{margin-top:-6rem}.-mt-28{margin-top:-7rem}.-mt-32{margin-top:-8rem}.-mt-36{margin-top:-9rem}.-mt-40{margin-top:-10rem}.-mt-44{margin-top:-11rem}.-mt-48{margin-top:-12rem}.-mt-52{margin-top:-13rem}.-mt-56{margin-top:-14rem}.-mt-60{margin-top:-15rem}.-mt-64{margin-top:-16rem}.-mt-72{margin-top:-18rem}.-mt-80{margin-top:-20rem}.-mt-96{margin-top:-24rem}.mr-0{margin-right:0}.mr-px{margin-right:1px}.mr-1{margin-right:.25rem}.mr-2{margin-right:.5rem}.mr-3{margin-right:.75rem}.mr-4{margin-right:1rem}.mr-5{margin-right:1.25rem}.mr-6{margin-right:1.5rem}.mr-7{margin-right:1.75rem}.mr-8{margin-right:2rem}.mr-9{margin-right:2.25rem}.mr-10{margin-right:2.5rem}.mr-11{margin-right:2.75rem}.mr-12{margin-right:3rem}.mr-14{margin-right:3.5rem}.mr-16{margin-right:4rem}.mr-20{margin-right:5rem}.mr-24{margin-right:6rem}.mr-28{margin-right:7rem}.mr-32{margin-right:8rem}.mr-36{margin-right:9rem}.mr-40{margin-right:10rem}.mr-44{margin-right:11rem}.mr-48{margin-right:12rem}.mr-52{margin-right:13rem}.mr-56{margin-right:14rem}.mr-60{margin-right:15rem}.mr-64{margin-right:16rem}.mr-72{margin-right:18rem}.mr-80{margin-right:20rem}.mr-96{margin-right:24rem}.mr-auto{margin-right:auto}.-mr-0{margin-right:0}.-mr-px{margin-right:-1px}.-mr-1{margin-right:-.25rem}.-mr-2{margin-right:-.5rem}.-mr-3{margin-right:-.75rem}.-mr-4{margin-right:-1rem}.-mr-5{margin-right:-1.25rem}.-mr-6{margin-right:-1.5rem}.-mr-7{margin-right:-1.75rem}.-mr-8{margin-right:-2rem}.-mr-9{margin-right:-2.25rem}.-mr-10{margin-right:-2.5rem}.-mr-11{margin-right:-2.75rem}.-mr-12{margin-right:-3rem}.-mr-14{margin-right:-3.5rem}.-mr-16{margin-right:-4rem}.-mr-20{margin-right:-5rem}.-mr-24{margin-right:-6rem}.-mr-28{margin-right:-7rem}.-mr-32{margin-right:-8rem}.-mr-36{margin-right:-9rem}.-mr-40{margin-right:-10rem}.-mr-44{margin-right:-11rem}.-mr-48{margin-right:-12rem}.-mr-52{margin-right:-13rem}.-mr-56{margin-right:-14rem}.-mr-60{margin-right:-15rem}.-mr-64{margin-right:-16rem}.-mr-72{margin-right:-18rem}.-mr-80{margin-right:-20rem}.-mr-96{margin-right:-24rem}.mb-0{margin-bottom:0}.mb-px{margin-bottom:1px}.mb-1{margin-bottom:.25rem}.mb-2{margin-bottom:.5rem}.mb-3{margin-bottom:.75rem}.mb-4{margin-bottom:1rem}.mb-5{margin-bottom:1.25rem}.mb-6{margin-bottom:1.5rem}.mb-7{margin-bottom:1.75rem}.mb-8{margin-bottom:2rem}.mb-9{margin-bottom:2.25rem}.mb-10{margin-bottom:2.5rem}.mb-11{margin-bottom:2.75rem}.mb-12{margin-bottom:3rem}.mb-14{margin-bottom:3.5rem}.mb-16{margin-bottom:4rem}.mb-20{margin-bottom:5rem}.mb-24{margin-bottom:6rem}.mb-28{margin-bottom:7rem}.mb-32{margin-bottom:8rem}.mb-36{margin-bottom:9rem}.mb-40{margin-bottom:10rem}.mb-44{margin-bottom:11rem}.mb-48{margin-bottom:12rem}.mb-52{margin-bottom:13rem}.mb-56{margin-bottom:14rem}.mb-60{margin-bottom:15rem}.mb-64{margin-bottom:16rem}.mb-72{margin-bottom:18rem}.mb-80{margin-bottom:20rem}.mb-96{margin-bottom:24rem}.mb-auto{margin-bottom:auto}.-mb-0{margin-bottom:0}.-mb-px{margin-bottom:-1px}.-mb-1{margin-bottom:-.25rem}.-mb-2{margin-bottom:-.5rem}.-mb-3{margin-bottom:-.75rem}.-mb-4{margin-bottom:-1rem}.-mb-5{margin-bottom:-1.25rem}.-mb-6{margin-bottom:-1.5rem}.-mb-7{margin-bottom:-1.75rem}.-mb-8{margin-bottom:-2rem}.-mb-9{margin-bottom:-2.25rem}.-mb-10{margin-bottom:-2.5rem}.-mb-11{margin-bottom:-2.75rem}.-mb-12{margin-bottom:-3rem}.-mb-14{margin-bottom:-3.5rem}.-mb-16{margin-bottom:-4rem}.-mb-20{margin-bottom:-5rem}.-mb-24{margin-bottom:-6rem}.-mb-28{margin-bottom:-7rem}.-mb-32{margin-bottom:-8rem}.-mb-36{margin-bottom:-9rem}.-mb-40{margin-bottom:-10rem}.-mb-44{margin-bottom:-11rem}.-mb-48{margin-bottom:-12rem}.-mb-52{margin-bottom:-13rem}.-mb-56{margin-bottom:-14rem}.-mb-60{margin-bottom:-15rem}.-mb-64{margin-bottom:-16rem}.-mb-72{margin-bottom:-18rem}.-mb-80{margin-bottom:-20rem}.-mb-96{margin-bottom:-24rem}.ml-0{margin-left:0}.ml-px{margin-left:1px}.ml-1{margin-left:.25rem}.ml-2{margin-left:.5rem}.ml-3{margin-left:.75rem}.ml-4{margin-left:1rem}.ml-5{margin-left:1.25rem}.ml-6{margin-left:1.5rem}.ml-7{margin-left:1.75rem}.ml-8{margin-left:2rem}.ml-9{margin-left:2.25rem}.ml-10{margin-left:2.5rem}.ml-11{margin-left:2.75rem}.ml-12{margin-left:3rem}.ml-14{margin-left:3.5rem}.ml-16{margin-left:4rem}.ml-20{margin-left:5rem}.ml-24{margin-left:6rem}.ml-28{margin-left:7rem}.ml-32{margin-left:8rem}.ml-36{margin-left:9rem}.ml-40{margin-left:10rem}.ml-44{margin-left:11rem}.ml-48{margin-left:12rem}.ml-52{margin-left:13rem}.ml-56{margin-left:14rem}.ml-60{margin-left:15rem}.ml-64{margin-left:16rem}.ml-72{margin-left:18rem}.ml-80{margin-left:20rem}.ml-96{margin-left:24rem}.ml-auto{margin-left:auto}.-ml-0{margin-left:0}.-ml-px{margin-left:-1px}.-ml-1{margin-left:-.25rem}.-ml-2{margin-left:-.5rem}.-ml-3{margin-left:-.75rem}.-ml-4{margin-left:-1rem}.-ml-5{margin-left:-1.25rem}.-ml-6{margin-left:-1.5rem}.-ml-7{margin-left:-1.75rem}.-ml-8{margin-left:-2rem}.-ml-9{margin-left:-2.25rem}.-ml-10{margin-left:-2.5rem}.-ml-11{margin-left:-2.75rem}.-ml-12{margin-left:-3rem}.-ml-14{margin-left:-3.5rem}.-ml-16{margin-left:-4rem}.-ml-20{margin-left:-5rem}.-ml-24{margin-left:-6rem}.-ml-28{margin-left:-7rem}.-ml-32{margin-left:-8rem}.-ml-36{margin-left:-9rem}.-ml-40{margin-left:-10rem}.-ml-44{margin-left:-11rem}.-ml-48{margin-left:-12rem}.-ml-52{margin-left:-13rem}.-ml-56{margin-left:-14rem}.-ml-60{margin-left:-15rem}.-ml-64{margin-left:-16rem}.-ml-72{margin-left:-18rem}.-ml-80{margin-left:-20rem}.-ml-96{margin-left:-24rem}.text-left{text-align:left}.text-center{text-align:center}.text-right{text-align:right}.text-justify{text-align:justify}
/*----------------------------------------
	Color root
----------------------------------------*/
:root {
	--white: #ffffff;
	--gr-fa: #fafafa;
	--gr-f3: #f3f3f3;
	--gr-e0: #e0e0e0;
	--gr-ee: #eeeeee;
	--gr-e9: #e9e9e9;
	--gr-dd: #dddddd;
	--gr-cc: #cccccc;
	--gr-aa: #aaaaaa;
	--bl-99: #999999;
	--bl-88: #888888;
	--bl-68: #686868;
	--bl-52: #525252;
	--bl-41: #414141;
	--bl-22: #222222;
	--black: #000000;
	--link: rgba(6,129,226,1);
	--ovarlay: rgba(0, 0, 0, 0.2);
	--fb: rgb(27,116,228);
	--pk: rgb(238,64,86);
    --line-a: rgb(147 170 187 / 20%);
	--line-b: rgb(147 170 187 / 40%);
	--txt-gr: #9faab1;
	--bg-grid: #f5f5f7;

	/* システム設定（デフォルト）に応じる設定 */
	color-scheme: light dark;

	--bg-color: light-dark(#ffffff, #060d17);
	--bg-2-color: light-dark(#fafafa, #313338);
	--text-color: light-dark(#313338, #f2f3f5);
	--line-1-color: light-dark(#e3e5e8, #3f4147);
	--line-2-color: light-dark(#ebedf0, #4e5058);
	--accent-1-color: light-dark(#5865f2, #5865f2);
	--accent-2-color: light-dark(#23a55a, #23a55a);
	--logo-1-color: light-dark(#212121, #f9f9f9);
	--logo-2-color: light-dark(#888888, #888888);
	--button-cta-color: light-dark(#5865f2, #5865f2);
	--link-color: light-dark(#0066cc, #00a8fc);
	--link-hover-color: light-dark(#5865f2, #ffffff);
}
:root[data-theme="light"] {
	color-scheme: light;
	--bg-color: #ffffff;
	--bg-2-color: #fafafa;
	--text-color: #313338;
	--line-1-color: #e3e5e8;
	--line-2-color: #ebedf0;
	--logo-1-color: #212121;
	--logo-2-color: #888888;
	--accent-1-color: #5865f2;
	--accent-2-color: #23a55a;
	--button-cta-color: #5865f2;
	--link-color: #0066cc;
	--link-hover-color: #5865f2;
}
:root[data-theme="dark"] {
	color-scheme: dark;
	--bg-color: #060d17;
	--bg-2-color: #313338;
	--text-color: #f2f3f5;
	--line-1-color: #3f4147;
	--line-2-color: #4e5058;
	--logo-1-color: #f9f9f9;
	--logo-2-color: #888888;
	--accent-1-color: #5865f2;
	--accent-2-color: #23a55a;
	--button-cta-color: #5865f2;
	--link-color: #00a8fc;
	--link-hover-color: #ffffff;
}
/*----------------------------------------
    General Setting
----------------------------------------*/
* > div {
    box-sizing: border-box;
}
html, body {
	margin: 0;
	padding: 0;
	font-size: 16px;
    -webkit-text-size-adjust: 100%;
	-webkit-tap-highlight-color:rgba(0,0,0,0);
}
body {
	overflow-x: hidden;
	background-color: var(--bg-color);
    color: var(--text-color);
    font-size: 16px;
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Helvetica Neue", "Hiragino Kaku Gothic ProN", "メイリオ", meiryo, sans-serif;
    -moz-osx-font-smoothing: grayscale;
    font-feature-settings: "palt";
    -webkit-font-feature-settings: "palt";
    letter-spacing: 0.05rem;
    line-height: 1.7;
	transition: background-color 0.05s, color 0.05s;
}
/*----------------------------------------
    Typography
----------------------------------------*/
h1, h2, h3, h4, h5, h6 {
	font-weight: normal;
    margin: 0;
}
h1 {
	margin: 0;
    font-weight: bold;
    letter-spacing: 0.05rem;
	font-size: 2rem;
}
hgroup h2 {
    font-weight: bold;
}
blockquote {
	margin-top: 2rem;
    margin-bottom: 2rem;
    margin-left: 1.5rem;
	margin-right: 0;
    padding-left: 1.25rem;
    border-left: 5px solid var(--line-1-color);
}
/*----------------------------------------
    List
----------------------------------------*/
ul,ol {
	margin: 0;
	padding: 0;
	list-style: none;
}
ul ul {
	margin-left: 1rem;
}
/*----------------------------------------
    Link
----------------------------------------*/
a {
	border-bottom: 1px solid var(--link-color);
	color: var(--link-color);
	text-decoration: none;
}
a:hover {
	border-bottom: 1px solid var(--link-color);
	color: var(--link-color);
	-webkit-transition: 0.4s;
    -moz-transition: 0.4s;
    -o-transition: 0.4s;
    transition: 0.4s;
}
/*----------------------------------------
    Images
----------------------------------------*/
figure {
	margin: 0;
}
img {
    width: 100%;
    height: auto;
    vertical-align: bottom;
}
/*----------------------------------------
    Layout
----------------------------------------*/
#__layout {
	margin: 0 auto;
	width: 100%;
}
header {
	width: 100%;
	border-bottom: 1px solid var(--line-1-color);
}
main{}
article{}
aside{}
footer {
	color: #888;
}
/*----------------------------------------
    Wrapper
----------------------------------------*/
.wrapper{}
.global-wrapper__1180 { max-width: 1180px; }
.global-wrapper__1020 { max-width: 1020px; }
.global-wrapper__960 { max-width: 960px; }
.global-wrapper__800 { max-width: 800px; }
.global-wrapper__600 { max-width: 600px; }
/*----------------------------------------
    Flex
----------------------------------------*/
.row {
	display: flex;
	flex-wrap: wrap;
	flex-direction: row;
    box-sizing: border-box;
}
.row-center {
	align-items: center;
	justify-content: space-between;
}
.row-2col-item {
	width: calc(100% / 2 - 1%);
}
.row-3col-item {
	width: calc(100% / 3 - 1%);
}
/*----------------------------------------
    Width
----------------------------------------*/
.col-mx-100{flex-basis: 100%;max-width: 100%;}
.col-mx-95{flex-basis: 95%;max-width: 95%;}
.col-mx-90{flex-basis: 90%;max-width: 90%;}
.col-mx-85{flex-basis: 85%;max-width: 85%;}
.col-mx-80{flex-basis: 80%;max-width: 80%;}
.col-mx-75{flex-basis: 75%;max-width: 75%;}
.col-mx-70{flex-basis: 70%;max-width: 70%;}
.col-mx-65{flex-basis: 65%;max-width: 65%;}
.col-mx-60{flex-basis: 60%;max-width: 60%;}
.col-mx-55{flex-basis: 55%;max-width: 55%;}
.col-mx-50{flex-basis: 50%;max-width: 50%;}
.col-mx-45{flex-basis: 45%;max-width: 45%;}
.col-mx-40{flex-basis: 40%;max-width: 40%;}
.col-mx-35{flex-basis: 35%;max-width: 35%;}
.col-mx-30{flex-basis: 30%;max-width: 30%;}
.col-mx-25{flex-basis: 25%;max-width: 25%;}
.col-mx-20{flex-basis: 20%;max-width: 20%;}
.col-mx-15{flex-basis: 15%;max-width: 15%;}
.col-mx-10{flex-basis: 10%;max-width: 10%;}
.col-mx-05{flex-basis: 5%;max-width: 5%;}
/*----------------------------------------
    Header
----------------------------------------*/
#logo {
    margin: 0 auto;
    padding: 0.5rem 0;
}
#logo a {
	border: none;
    width: 140px;
    height: auto;
    display: flex;
}
#logo a svg {
    width: 100%;
    height: auto;
    vertical-align: middle;
}
.logo-black {
	fill: var(--logo-1-color);
}
.logo-thin {
	fill: var(--logo-2-color);
}
/*----------------------------------------
    Navigation
----------------------------------------*/
nav .menu {
	position: relative;
}
nav .menu li {
    position: relative;
    width: 100%;
}
nav .menu li:last-child {
    margin-bottom: 1rem;
}
nav .menu li a {
    position: relative;
    border-bottom: none;
    font-weight: bold;
    display: block;
    padding: 1rem 0;
    width: 100%;
    text-align: center;
    background-color: var(--link-color);
    color: #fff;
    margin-top: 1rem;
    border-radius: 20px;
}
/*----------------------------------------
    Main
----------------------------------------*/
.quiz-results .buzzer-user {
    font-size: 20vw;
    font-weight: bold;
    text-align: center;
    min-height: 35vw;
}
/*----------------------------------------
    Dark Mode
----------------------------------------*/
.container {
	margin: 0;
    width: 40px;
    height: 40px;
    display: flex;
    justify-content: center;
    align-items: center;
    border: 1px solid var(--line-1-color);
    border-radius: 50%;
}
#switch {
	position: relative;
    background: transparent;
    border: 0;
    width: 30px;
    height: 30px;
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
	transform: scale(0.8);
}
#switch .mode {
    position: relative;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    background: #1a202c;
}
#switch .mode::before {
    content: "";
    position: absolute;
    width: 6px;
    height: 6px;
    left: 50%;
    top: 50%;
    transform: translateX(-50%) translateY(-50%);
    border-radius: 50%;
    background: inherit;
    z-index: -1;
    opacity: 0;
}
#switch .mode::after {
    content: "";
    position: absolute;
    width: 90%;
    height: 90%;
    top: -20%;
    left: 30%;
    border-radius: 50%;
    background: white;
}
.container.dark #switch .mode {
    transform: scale(0.5);
    background: white;
}
.container.dark #switch .mode::before {
    opacity: 1;
    box-shadow: 0 -20px 0 0 white, 0 20px 0 0 white, -20px 0 0 0 white, 20px 0 0 0 white, 15px 15px 0 0 white, 15px -15px 0 0 white, -15px 15px 0 0 white, -15px -15px 0 0 white;
}
.container.dark #switch .mode::after {
    opacity: 0;
    transform: translateX(50%) translateY(-50%);
}
/*----------------------------------------
    Form
----------------------------------------*/
label {
    margin-bottom: 0.5rem;
    display: inline-block;
    font-size: 0.9rem;
    vertical-align: top;
}
input[type="text"],
input[type="password"],
input[type="email"],
input[type="tel"],
input[type="search"],
input[type="number"],
textarea {
	margin: 0 0 1.5rem 0;
    padding: 0.75rem 1.75rem;
    max-width: 100%;
    width: 100%;
    border: none;
    -webkit-border-radius: 0.5rem;
    -moz-border-radius: 0.5rem;
    border-radius: 0.5rem;
    border: 1px solid #F7F7F7;
    background-color: #F7F7F7;
    color: #777;
    vertical-align: bottom;
    font-size: 1rem;
    line-height: 1.6;
    letter-spacing: 0.02rem;
}
#comment-area input[type="text"],
#comment-area textarea {
	display: block;
}
textarea {
	min-height: 8rem;
	overflow: auto;
}
input[type="text"]:hover,
input[type="password"]:hover,
input[type="email"]:hover,
input[type="tel"]:hover,
input[type="search"]:hover,
input[type="number"]:hover,
textarea:hover {
	border: 1px solid #F7F7F7;
	background-color: #F7F7F7;
	-webkit-box-shadow: 0 0 0 2px var(--link-color);
 	-moz-box-shadow: 0 0 0 2px var(--link-color);
	box-shadow: 0 0 0 2px var(--link-color);
	-webkit-transition: background-color 0.2s ease, outline 0.2s ease, color 0.2s ease, -webkit-box-shadow 0.2s ease;
	transition: background-color 0.2s ease, outline 0.2s ease, color 0.2s ease, -webkit-box-shadow 0.2s ease;
	transition: background-color 0.2s ease, outline 0.2s ease, color 0.2s ease, box-shadow 0.2s ease;
	transition: background-color 0.2s ease, outline 0.2s ease, color 0.2s ease, box-shadow 0.2s ease, -webkit-box-shadow 0.2s ease;
}
input[type="text"]:focus,
input[type="password"]:focus,
input[type="email"]:focus,
input[type="tel"]:focus,
input[type="search"]:focus,
input[type="number"]:focus,
textarea:focus {
	border: 1px solid #F7F7F7;
	background-color: #F7F7F7;
	outline: none;
 	color: #444;
	-webkit-box-shadow: 0 0 0 2px var(--link-color);
 	-moz-box-shadow: 0 0 0 2px var(--link-color);
	box-shadow: 0 0 0 2px var(--link-color);
}
.button,
button,
input[type="submit"],
input[type="reset"],
input[type="button"] {
    padding: 0.5rem 0.75rem;
	border: none;
	-webkit-border-radius: 0.75rem;
	-moz-border-radius: 0.75rem;
	border-radius: 0.75rem;
	background-color: var(--link-color);
	color: #fff;
	text-decoration: none;
	font-weight: bold;
	font-size: 12px;
	line-height: normal;
	cursor: pointer;
}
.button:hover,
button:hover,
input[type="submit"]:hover,
input[type="reset"]:hover,
input[type="button"]:hover {
  	border: none;
	background: var(--link-color);
	color: #fff;
}
.button:active,
button:active,
input[type="submit"]:active,
input[type="reset"]:active,
input[type="button"]:active {
	position: relative;
}

a.front-button {
    display: block;
    border: none;
    font-size: 1.15rem;
    font-weight: bold;
    text-align: center;
    border-radius: 20px;
    padding: 1.25rem;
    background-color: var(--link-color);
    background-size: 30%;
    color: #fff;
}
a.front-button:first-child {
    margin-bottom: 2rem;
}
/*----------------------------------------
    Icon
----------------------------------------*/
i.fa-regular {
    margin-right: 0.25rem;
}
/*----------------------------------------
    Responsive
----------------------------------------*/
@media only screen and (max-width: 1020px) {
}
@media only screen and (max-width: 560px) {
	body {
	    font-size: 0.95rem;
	}
	.main-container {
	    max-width: 100%;
	    flex-basis: 100%;
	}
	.main-container__inner {
	    padding: 0;
	}
	.side-container {
		max-width: 100%;
	    flex-basis: 100%;
	}
}

/*--------------------------------------------------------------
    PC
--------------------------------------------------------------*/
.pc {
	display: block;
}
.sp {
	display: none;
}
@media only screen and (max-width: 560px) {
	.pc {
		display: none;
	}
	.sp {
		display: block;
	}
}
/*----------------------------------------
    Form
----------------------------------------*/
#form {
	position: relative;
	width: 100%;
}
#player-name {
    margin: 0;
}
.host-quiz-results .buzzer-user {
    padding-top: 1rem;
    text-align: center;
    font-weight: bold;
    font-size: 3rem;
}
.button-area {
    padding-top: 2rem;
}
.button-style:first-child {
    margin-bottom: 2rem;
}
.button-style {
    display: block;
    width: 100%;
    padding: 2rem;
}
input[type="text"],
input[type="password"],
input[type="email"],
input[type="tel"],
input[type="search"],
input[type="number"],
textarea {
    font-size: 16px;
	border: 1px solid #F7F7F7;
	background-color: #F7F7F7;
    -webkit-border-radius: 25px;
    -webkit-appearance: none;
    -webkit-tap-highlight-color: rgba(0,0,0,0);
	box-sizing: border-box;
	border-radius: 25px;
}
textarea {
	overflow: auto;
    min-height: 100px;
}
input[type="text"]:focus,
input[type="password"]:focus,
input[type="email"]:focus,
input[type="tel"]:focus,
input[type="search"]:focus,
input[type="number"]:focus,
textarea:focus {
	-webkit-transition: all .4s;
    -moz-transition: all .4s;
    -o-transition: all .4s;
    transition: all .4s;
}
.button,
button,
input[type="submit"],
input[type="reset"],
input[type="button"] {
}
.button:hover,
button:hover,
input[type="submit"]:hover,
input[type="reset"]:hover,
input[type="button"]:hover {
	-webkit-transition: all .4s;
    -moz-transition: all .4s;
    -o-transition: all .4s;
    transition: all .4s;
}
/* iOS */
input[type="submit"],
input[type="button"] {
    border-radius: 0;
    -webkit-box-sizing: content-box;
    -webkit-appearance: button;
    appearance: button;
    border: none;
    box-sizing: border-box;
    cursor: pointer;
}
input[type="submit"]::-webkit-search-decoration,
input[type="button"]::-webkit-search-decoration {
    display: none;
}
input[type="submit"]::focus,
input[type="button"]::focus {
    outline-offset: -2px;
}
input[type="text"]::placeholder,
input[type="password"]::placeholder,
input[type="email"]::placeholder,
input[type="tel"]::placeholder,
input[type="search"]::placeholder,
input[type="number"]::placeholder,
textarea::placeholder {
    color: #a9a9a9;
}
input:focus::-webkit-input-placeholder { color:transparent; }
input:focus:-moz-placeholder { color:transparent; } /* FF 4-18 */
input:focus::-moz-placeholder { color:transparent; } /* FF 19+ */
input:focus:-ms-input-placeholder { color:transparent; } /* IE 10+ */
textarea:focus::-webkit-input-placeholder { color:transparent; }
textarea:focus:-moz-placeholder { color:transparent; } /* FF 4-18 */
textarea:focus::-moz-placeholder { color:transparent; } /* FF 19+ */
textarea:focus:-ms-input-placeholder { color:transparent; } /* IE 10+ */
#name-form {
    position: relative;
}
#join-button {
    position: absolute;
    width: 70px;
    top: 0;
    right: 0;
    padding: 1.05rem 0;
    border-top-right-radius: 25px;
    border-bottom-right-radius: 25px;
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
}
/*----------------------------------------
    Radio / Checkbox
----------------------------------------*/
/* デフォルトのボタン */
input[type="radio"] {
	opacity: 0;
    position: absolute;
    z-index: 2;
	top: 0;
    left: 0;
    width: 100%;
    height: 100%;
	cursor: pointer;
}
/*----------------------------------------
    Select
----------------------------------------*/
select {
    background-color: transparent;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}
select.dropdown {
    position: relative;
    display: inline-block;
}
select.dropdown {
    width: 100%;
    background: #f5f5f5;
    border: 1px solid #f5f5f5;
    padding: 15px;
    font-size: 16px;
    color: #888;
}
.form-select {
    position: relative;
}
.form-select:after {
    content: '';
    width: 7px;
    height: 7px;
	top: 0;
    bottom: 0;
	right: 23px;
    margin: auto;
    border: 0;
    border-top: solid 2px #888;
    border-right: solid 2px #888;
    -webkit-transform: rotate(135deg);
    -ms-transform: rotate(135deg);
    transform: rotate(135deg);
    position: absolute;
    -webkit-border-radius: 1px;
    -moz-border-radius: 1px;
    -o-border-radius: 1px;
    border-radius: 1px;
    display: block;
}
.form-number {
    position: relative;
}
.form-number:after {
    content: '\4EBA';
    top: 13px;
    position: absolute;
    font-weight: normal;
    margin-left: 20px;
}
/* チェック後のボタン */
input[type="radio"]:checked + .wpcf7-list-item-label {
	background-color: #1589D8;
	color: #fff;
}
input[type="radio"]:checked + .wpcf7-list-item-label:before  {
	background-color: #1589D8;
    box-shadow: inset 0 0 0 2px #fff;
	-webkit-transition: all 0.15s;
    -moz-transition: all 0.15s;
    -ms-transition: all 0.15s;
    -o-transition: all 0.15s;
    transition: all 0.15s;
}
input[type="checkbox"] {
    display: none;
}
input[type="checkbox"] + span {
    display: block;
    cursor: pointer;
    margin: 20px;
}
input[type="checkbox"] + span::before {

}
input[type="checkbox"] + span:hover {
    color: #808080;
}
input[type="checkbox"] + span:hover::before {
     background-color: #fff;
}
input[type="checkbox"]:checked + span {
     color: #36bbe7;
}
input[type="checkbox"]:checked + span::before {
    font-size: 25px;
    background-color: #fff;
    border-color: #36bbe7;
    color: #36bbe7;
	-webkit-transition: all .4s;
    -moz-transition: all .4s;
    -o-transition: all .4s;
    transition: all .4s;
}
/*----------------------------------------
    Online User
----------------------------------------*/
.buzzer-online-user {
    padding-top: 0.25rem;
    position: absolute;
    bottom: 0;
    box-sizing: border-box;
    width: 100%;
    left: 0;
    border-top: 1px solid var(--line-1-color);
    background-color: var(--bg-1-color);
    min-height: 115px;
}
.user-block {
	display: inline-block;
	width: 72px;
    margin: 8px;
    padding: 8px 0px;
	font-weight: bold;
    text-align: center;
    border-radius: 8px;
    background-color: var(--bg-2-color);
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.15);
    transition: background-color 0.1s ease;
}
.user-avatar {
    width: 54px;
    height: 54px;
    border-radius: 50%;
    object-fit: cover;
}
.user-name {
    margin-top: 4px;
    font-size: 12px;
	color: var(--text-color);
    word-break: break-all;
}
.user-block.first {
    animation: buzz-blink-blue 0.6s ease-in-out infinite;
}
@keyframes buzz-blink-blue {
    0%, 100% { background-color: var(--bg-2-color); }
    50%      { background-color: #cfe8ff; }
}
.user-block.missed {
    background-color: #ffd6d6;
}
/* フロントページの早押しボタン用（任意） */
#BuzzerQuizButton {
    width: 300px;
    height: 300px;
    display: block;
    margin: 0 auto;
    position: relative;
	margin-top: -4rem;
}
#BuzzerQuizButton div{
    position: absolute;
    top: 0;
    left: 0;
}
#BuzzerQuizButton div.buttonTop{
    width: 250px;
    height: 250px;
    margin: 0 25px;
}
#BuzzerQuizButton div#buttonTop1 {
    background-color: #dc5a1c;
    clip-path: ellipse(50% 25% at 50% 43%);
    z-index: 1000;
}
#BuzzerQuizButton:active #buttonTop1{transform: translateY(5px);}
#BuzzerQuizButton #buttonTop2 {
    background-color: #ae231d;
    clip-path: ellipse(50% 25% at 50% 53%);
    z-index: 995;
}
#BuzzerQuizButton div#buttonTop3 {
    background-color: #ae231d;
    clip-path: polygon(0 42%, 100% 42%, 100% 54%, 0 54%);
    z-index: 990;
}
#BuzzerQuizButton:active #buttonTop3{clip-path: polygon(0 45%, 100% 45%, 100% 54%, 0 54%);}
#BuzzerQuizButton div.buttonBottom{
    width: 300px;
    height: 300px;
}
#BuzzerQuizButton #buttonBottom1 {
    background-color: #f2f5c4;
    clip-path: ellipse(50% 27% at 50% 50%);
    z-index: 985;
}
#BuzzerQuizButton #buttonBottom2 {
    background-color: #b19969;
    clip-path: polygon(0 50%, 100% 50%, 100% 64%, 0 64%);
    z-index: 980;
}
#BuzzerQuizButton #buttonBottom3 {
    background-color: #b19969;
    clip-path: ellipse(50% 27% at 50% 64%);
    z-index: 975;
}


/* フロントページのアンケートボタン用（任意） */
#SurveyButton {
    width: 300px;
    height: 300px;
    display: block;
    margin: 0 auto;
    position: relative;
	margin-top: -4rem;
}
#SurveyButton div{
    position: absolute;
    top: 0;
    left: 0;
}
#SurveyButton div.buttonTop{
    width: 250px;
    height: 250px;
    margin: 0 25px;
}
#SurveyButton div#buttonTop1 {
    background-color: #1cb4dc;
    clip-path: ellipse(50% 25% at 50% 43%);
    z-index: 1000;
}
#SurveyButton:active #buttonTop1{transform: translateY(5px);}
#SurveyButton #buttonTop2 {
    background-color: #1d78ae;
    clip-path: ellipse(50% 25% at 50% 53%);
    z-index: 995;
}
#SurveyButton div#buttonTop3 {
    background-color: #1d6dae;
    clip-path: polygon(0 42%, 100% 42%, 100% 54%, 0 54%);
    z-index: 990;
}
#SurveyButton:active #buttonTop3{clip-path: polygon(0 45%, 100% 45%, 100% 54%, 0 54%);}
#SurveyButton div.buttonBottom{
    width: 300px;
    height: 300px;
}
#SurveyButton #buttonBottom1 {
    background-color: #f2f5c4;
    clip-path: ellipse(50% 27% at 50% 50%);
    z-index: 985;
}
#SurveyButton #buttonBottom2 {
    background-color: #b19969;
    clip-path: polygon(0 50%, 100% 50%, 100% 64%, 0 64%);
    z-index: 980;
}
#SurveyButton #buttonBottom3 {
    background-color: #b19969;
    clip-path: ellipse(50% 27% at 50% 64%);
    z-index: 975;
}
/* 戻るボタン（任意のスタイル例） */
#back-button,
#survey-skip-button {
    font-size: 12px;
    background: none;
    border: none;
    color: #888888;
    cursor: pointer;
    width: 280px;
    background-color: var(--bg-grid);
    padding: 1rem;
	border-radius: 14px;
    margin: 30px auto 0;
    display: block;
}

/* 正解・ハズレボタン（任意のスタイル例） */
#correct-button,
#survey-reveal-button {
    background-color: #4CAF50;
    color: #ffffff;
}

#wrong-button {
    background-color: #f44336;
    color: #ffffff;
}

.survey-results {
    border-radius: 50px;
    overflow: hidden;
    margin-top: 2rem;
}
#survey-area.disabled #SurveyButton,
#survey-area.disabled #survey-skip-button {
    opacity: 0.5;
    pointer-events: none;
    cursor: not-allowed;
}
/* survey-resultsの2段表示 */
#survey-total-label {
    font-size: 4rem;
    text-align: center;
    font-weight: bold;
    background-color: #eee;
	color: #333;
}
#survey-result-number {
    text-align: right;
    position: relative;
    background-color: #333;
    color: #fff;
    padding: 0 4rem;
}
#survey-result-value {
    font-size: 20rem;
    font-weight: bold;
    line-height: 1;
    text-align: right;
}
#survey-result-number .unit {
    font-size: 3rem;
	font-weight: bold;
}

/* 上段：ルーレットの数字（丸型・中央揃え） */
#bingo-roulette-number {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 180px;
    height: 180px;
    margin: 20px auto 0;
    border-radius: 50%;
    background-color: var(--link-color);
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);
    font-size: 92px;
    font-weight: bold;
	color: #fff;
}

/* 下段：1〜72の一覧 */
#bingo-grid {
    display: grid;
    grid-template-columns: repeat(18, 1fr);
    gap: 8px;
    margin: 24px auto 0;
}

.bingo-cell {
    aspect-ratio: 1 / 1;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background-color: #cccccc;
    color: #ffffff;
    font-size: 24px;
    font-weight: bold;
    transition: background-color 0.3s ease;
}

.bingo-cell.drawn {
    background-color: var(--link-color);
}
/*--------------------------------------------------------------
    center
--------------------------------------------------------------*/
.front-page {
    display: grid;
    place-items: center;
    height: calc(100dvh - 55px);
}
.front-inner {
    width: 100%;
}
.quiz-entry,
.survey-entry,
.host {
    display: grid;
    place-items: center;
    height: calc(100dvh - 55px);
}
a.admin-fixed-button {
    position: fixed;
    bottom: 0;
    right: 0;
}
/*--------------------------------------------------------------
    Responsive
--------------------------------------------------------------*/
@media only screen and (max-width: 768px) {
    #form .form-block th,
    #form .form-block td {
        display: block;
        width: 100%;
        padding: 7px 10px;
        border-right: 0;
    }
    #form .form-block th {
        background-color: #fff;
        color: #000;
        padding: 22px 15px;
    }
    #form .form-block th.top {
        vertical-align: text-bottom;
        padding: 22px 10px;
    }
    #form .form-block td {
        padding: 25px 0 60px;
    }
    #form .form-block .required {
        width: 40px;
        height: 18px;
        font-size: 11px;
        line-height: 18px;
        margin-left: 15px;
        margin-top: 0px;
    }
    #form .form-block span.required {
        position: inherit;
        display: inline;
        right: inherit;
    }
    #form .form-block .form-name {
        width: 100%;
    }
    #form .form-block .form-name:first-child {
        margin-bottom: 20px;
    }
    #form .form-block td .form-name span.input-txt {
    }
    #form .form-block td .form-name span:before {
	    left: -10%;
	    top: -17px;
	    width: 10%;
    }
    #form .form-block input[type="text"],
    #form .form-block input[type="password"],
    #form .form-block input[type="email"],
    #form .form-block input[type="tel"],
    #form .form-block input[type="search"],
    #form .form-block input[type="number"] {
        width: 100%;
        height: 52px;
        padding: 0 10px;
    }
    #form .form-block textarea {
        height: 250px;
        padding: 10px;
    }
    #form .button {
        width: 100%;
        height: 68px;
        margin: 0 auto;
    }
    #form .button input[type="submit"] {
        margin: 0 auto;
        width: 280px;
    }
    /* select */
    select.dropdown {
        padding: 15px 55px 15px 15px;
    }
    /* file */
    .form-file {
        display: block;
    }
    .form-file-label {
        display: block;
        padding-top: 10px;
    }
    .form-file-button {
        padding: 17px 80px 17px 20px;
    }

	#form .form-block td span.wpcf7-not-valid-tip {
	    font-size: 100%;
	    position: relative;
	}
    /* error message postion */
    .wpcf7-item-error {
        position: relative;
    }
    .wpcf7-item-error.txt-last-name-ka,
    .wpcf7-item-error.txt-first-name-ka,
    .wpcf7-item-error.txt-last-name-kana,
    .wpcf7-item-error.txt-first-name-kana {
        padding-left: 15%;
    }
}
@media only screen and (max-width: 560px) {
    .form-select:after {
        top: 50%;
        margin-top: -10px;
        -webkit-transform: rotate(135deg) translate(0, -50%);
        -ms-transform: rotate(135deg) translate(0, -50%);
        transform: rotate(135deg) translate(0, -50%);
    }
    #form .button input[type="submit"] {
        width: 100%;
    }
}
