@charset "utf-8";
/**
 *
 *
 *
 */

/*********************************************
**********************************************
		input[type="radio"]
**********************************************
**********************************************/
@media print,screen {
	input[type="radio"]#gridpreview {
		display: none;
	}
	input[type="radio"]#listpreview {
		display: none;
	}
}
/*********************************************
**********************************************
		loginwrapper
**********************************************
**********************************************/
@media print,screen {
	#loginwrapper {
		height: 600px;
		background-image: url(./image/panel01.jpg);
		background-position: 50% 50%;
		background-size: cover;
	}
	#loginwrapper > .inner {
		background-color: #d0e9e7;
		width: 500px;
		height: 600px;
		margin: 0 auto;
	}
	#loginwrapper > .inner > .title {
		width: 380px;
		margin: 0 auto;
		border-bottom: double 3px #888;
		padding-top: 130px;
		padding-bottom: 60px;
	}
	#loginwrapper > .inner > .txt {
		text-align: center;
		margin-top: 30px;
		font-size: 1.6rem;
		line-height: 1.4;
		color: #333;
	}
	#loginwrapper > .inner > .form {
		width: 300px;
		margin: 5px auto 0 auto;
	}
	#loginwrapper > .inner > .form > input {
		margin-top: 5px;
		width: 300px;
		appearance: none;
		height: 24px;
		border: solid 1px #ccc;
		padding-left: 5px;
		font-size: 1.5rem;
		line-height: 1.5;
		background-color: #fff;
		color: #000;
		border-radius: 3px;
		ime-mode: disabled;
	}
	#loginwrapper > .inner > .form > input:focus {
		background-color: #f3ffff;
		border-color: #099;
	}
	#loginwrapper > .inner > .submit {
		text-align: center;
		margin-top: 10px;
	}
	#loginwrapper > .inner > .submit > div {
		display: inline-block;
		background-color: #333;
		font-size: 1.4rem;
		line-height: 1;
		color: #fff;
		border-radius: 20px;
		padding: 5px 20px;
		cursor: pointer;
	}
	#loginwrapper > .inner > .submit > div:hover {
		opacity: 0.7;
	}
	#loginwrapper > .inner > .reissue {
		text-align: center;
		margin: 20px 0 0 0;
	}
	#loginwrapper > .inner > .reissue > a {
		text-decoration: none;
		font-size: 1.3rem;
		line-height: 1.2;
		color: #333;
	}
	#loginwrapper > .inner > .reissue > a:hover {
		opacity: 0.7;
	}
	#loginwrapper > .inner > .border {
		width: 65%;
		border-top: solid 2px #66b9b5;
		margin: 20px auto 0 auto;
	}
	#loginwrapper > .inner > .account {
		text-align: center;
		margin: 20px 0 0 0;
	}
	#loginwrapper > .inner > .account > a {
		text-decoration: none;
		font-size: 1.7rem;
		line-height: 1.2;
		color: #333;
	}
	#loginwrapper > .inner > .account > a:hover {
		opacity: 0.7;
	}
}
@media screen and (max-width:669px) {
	#loginwrapper {
		display: none;
	}
}
/*********************************************
**********************************************
		imagewrapper
**********************************************
**********************************************/
@media screen and (min-width:670px) {
	#imagewrapper {
		display: none;
	}
}
/*********************************************
**********************************************
		login02wrapper
**********************************************
**********************************************/
@media print,screen {
	#login02wrapper {
		padding: 20px 5% 0 5%;
	}
	#login02wrapper > .inner {
		border: solid 1px #0f9090;
		border-radius: 5px;
		padding: 10px;
	}
	#login02wrapper > .inner > .txt {
		text-align: center;
		font-size: 1.5rem;
		line-height: 1.4;
		color: #0f9090;
	}
	#login02wrapper > .inner > .form {
		width: 300px;
		margin: 5px auto 0 auto;
	}
	#login02wrapper > .inner > .form > input {
		margin-top: 5px;
		width: 100%;
		appearance: none;
		height: 24px;
		border: solid 1px #ccc;
		padding-left: 5px;
		font-size: 1.5rem;
		line-height: 1.5;
		background-color: #fff;
		color: #000;
		border-radius: 3px;
		ime-mode: disabled;
	}
	#login02wrapper > .inner > .form > input:focus {
		background-color: #f3ffff;
		border-color: #099;
	}
	#login02wrapper > .inner > .submit {
		text-align: center;
		margin-top: 10px;
	}
	#login02wrapper > .inner > .submit > div {
		display: inline-block;
		background-color: #333;
		font-size: 1.4rem;
		line-height: 1;
		color: #fff;
		border-radius: 20px;
		padding: 5px 20px;
		cursor: pointer;
	}
	#login02wrapper > .inner > .submit > div:hover {
		opacity: 0.7;
	}
	#login02wrapper > .inner > .reissue {
		text-align: center;
		margin-top: 10px;
	}
	#login02wrapper > .inner > .reissue > a {
		text-decoration: none;
		font-size: 1.2rem;
		line-height: 1.1;
		color: #1f93df;
	}
	#login02wrapper > .inner > .reissue > a:hover {
		opacity: 0.7;
	}
}
@media screen and (min-width:670px) {
	#login02wrapper {
		display: none;
	}
}
@media screen and (max-width:419px) {
	#login02wrapper > .inner > .form {
		width: calc(100% - 20px);
	}
}
/*********************************************
**********************************************
		login03wrapper
**********************************************
**********************************************/
@media print,screen {
	#login03wrapper {
		padding: 20px 5% 0 5%;
	}
	#login03wrapper > a {
		display: block;
		text-decoration: none;
		font-size: 1.4rem;
		line-height: 1.2;
		color: #0f9090;
		border: solid 1px #0f9090;
		border-radius: 5px;
		padding: 10px;
		text-align: center;
	}
	#login03wrapper > a:hover {
		color: #fff;
		background-color: #0f9090;
	}
}
@media screen and (min-width:670px) {
	#login03wrapper {
		display: none;
	}
}
/*********************************************
**********************************************
		switchwrapper
**********************************************
**********************************************/
@media print,screen {
	#switchwrapper {
		margin: 30px 5% 0 5%;
	}
	#switchwrapper > .inner {
		margin: 0 auto;
		max-width: 830px;
		display: flex;
		justify-content: flex-end;
	}
	#switchwrapper > .inner > label {
		border: solid 1px #aaa;
		cursor: pointer;
	}
	#switchwrapper > .inner > label:nth-of-type(2) {
		border-style: solid solid solid none;
	}
	#switchwrapper > .inner > label:hover {
		opacity: 0.7;
	}
}
/*********************************************
**********************************************
		titlewrapper
**********************************************
**********************************************/
@media print,screen {
	.titlewrapper {
		margin: 50px 5% 0 5%;
		text-align: center;
	}
	.titlewrapper > h1 {
		margin: 0;
		font-size: 2.0rem;
		line-height: 1.3;
		color: #333;
		font-family: "Noto Sans JP",メイリオ,Meiryo,sans-serif;
		font-weight: 300;
	}
	.titlewrapper > p {
		margin-top: 5px;
		font-size: 1.6rem;
		line-height: 1.3;
		color: #333;
	}
}
/*********************************************
**********************************************
		contestwrapper grid
**********************************************
**********************************************/
@media print,screen {
	input[type="radio"]#gridpreview:checked + input + div + .contestwrapper,
	input[type="radio"]#gridpreview:checked + input + div + .contestwrapper + div + .contestwrapper {
		margin-top: 30px;
		padding: 0 5%;
	}
	input[type="radio"]#gridpreview:checked + input + div + .contestwrapper > .inner,
	input[type="radio"]#gridpreview:checked + input + div + .contestwrapper + div + .contestwrapper > .inner {
		margin: 0 auto;
		max-width: 960px;
		display: flex;
		justify-content: center;
		flex-wrap: wrap;
	}
	input[type="radio"]#gridpreview:checked + input + div + .contestwrapper > .inner > a,
	input[type="radio"]#gridpreview:checked + input + div + .contestwrapper + div + .contestwrapper > .inner > a {
		width: 300px;	/*IE*/
		max-width: 300px;
		margin: 10px;
		text-decoration: none;
	}
	input[type="radio"]#gridpreview:checked + input + div + .contestwrapper > .inner > a:hover,
	input[type="radio"]#gridpreview:checked + input + div + .contestwrapper + div + .contestwrapper > .inner > a:hover {
		opacity: 0.7;
	}
	/*----*/
	input[type="radio"]#gridpreview:checked + input + div + .contestwrapper > .inner > a > .txt,
	input[type="radio"]#gridpreview:checked + input + div + .contestwrapper + div + .contestwrapper > .inner > a > .txt {
		display: flex;
		justify-content: space-between;
		background-color: #cfebea;
		padding: 10px;
		max-width: 300px;	/*IE*/
		box-sizing: border-box;	/*IE*/
	}
	input[type="radio"]#gridpreview:checked + input + div + .contestwrapper > .inner > a > .txt > p,
	input[type="radio"]#gridpreview:checked + input + div + .contestwrapper + div + .contestwrapper > .inner > a > .txt > p {
		margin: 0;
		font-size: 1.4rem;
		line-height: 1.4;
		color: #333;
	}
	/*----*/
	input[type="radio"]#gridpreview:checked + input + div + .contestwrapper > .inner > a > .date,
	input[type="radio"]#gridpreview:checked + input + div + .contestwrapper + div + .contestwrapper > .inner > a > .date {
		background-color: #e8f4f3;
		padding: 5px 10px;
		max-width: 300px;	/*IE*/
		box-sizing: border-box;	/*IE*/
	}
	input[type="radio"]#gridpreview:checked + input + div + .contestwrapper > .inner > a > .date > p,
	input[type="radio"]#gridpreview:checked + input + div + .contestwrapper + div + .contestwrapper > .inner > a > .date > p {
		margin: 0;
		font-size: 1.4rem;
		line-height: 1.3;
		color: #2bb;
	}
	/*----*/
	input[type="radio"]#gridpreview:checked + input + div + .contestwrapper > .inner > a > .txt > div,
	input[type="radio"]#gridpreview:checked + input + div + .contestwrapper + div + .contestwrapper > .inner > a > .txt > div {
	}
	input[type="radio"]#gridpreview:checked + input + div + .contestwrapper > .inner > a > .img,
	input[type="radio"]#gridpreview:checked + input + div + .contestwrapper + div + .contestwrapper > .inner > a > .img {
	}
	input[type="radio"]#gridpreview:checked + input + div + .contestwrapper > .inner > a > .img > img,
	input[type="radio"]#gridpreview:checked + input + div + .contestwrapper + div + .contestwrapper > .inner > a > .img > img {
		max-width: 100%;
		height: auto;
	}
	/*----*/
	input[type="radio"]#gridpreview:checked + input + div + .contestwrapper + div + .contestwrapper > .inner > div {
		min-width: 320px;
	}
}

/*********************************************
**********************************************
		contestwrapper list
**********************************************
**********************************************/
@media print,screen {
	input[type="radio"]#listpreview:checked + div + .contestwrapper,
	input[type="radio"]#listpreview:checked + div + .contestwrapper + div + .contestwrapper {
		margin-top: 30px;
		padding: 0 5%;
	}
	input[type="radio"]#listpreview:checked + div + .contestwrapper > .inner,
	input[type="radio"]#listpreview:checked + div + .contestwrapper + div + .contestwrapper > .inner {
		margin: 0 auto;
		max-width: 960px;
	}
	input[type="radio"]#listpreview:checked + div + .contestwrapper > .inner > a,
	input[type="radio"]#listpreview:checked + div + .contestwrapper + div + .contestwrapper > .inner > a {
		margin: 10px;
		text-decoration: none;
		display: flex;
		background-color: #e8f4f3;
	}
	input[type="radio"]#listpreview:checked + div + .contestwrapper > .inner > a:hover,
	input[type="radio"]#listpreview:checked + div + .contestwrapper + div + .contestwrapper > .inner > a:hover {
		opacity: 0.7;
	}
	/*----*/
	input[type="radio"]#listpreview:checked + div + .contestwrapper > .inner > a > .txt,
	input[type="radio"]#listpreview:checked + div + .contestwrapper + div + .contestwrapper > .inner > a > .txt {
		padding: 10px;
		flex-grow: 1;
	}
	input[type="radio"]#listpreview:checked + div + .contestwrapper > .inner > a > .txt > p,
	input[type="radio"]#listpreview:checked + div + .contestwrapper + div + .contestwrapper > .inner > a > .txt > p {
		margin: 0;
		font-size: 1.4rem;
		line-height: 1.4;
		color: #333;
	}
	input[type="radio"]#listpreview:checked + div + .contestwrapper > .inner > a > .txt > div,
	input[type="radio"]#listpreview:checked + div + .contestwrapper + div + .contestwrapper > .inner > a > .txt > div {
		display: none;
	}
	/*----*/
	input[type="radio"]#listpreview:checked + div + .contestwrapper > .inner > a > .date,
	input[type="radio"]#listpreview:checked + div + .contestwrapper + div + .contestwrapper > .inner > a > .date {
		padding: 10px;
	}
	input[type="radio"]#listpreview:checked + div + .contestwrapper > .inner > a > .date > p,
	input[type="radio"]#listpreview:checked + div + .contestwrapper + div + .contestwrapper > .inner > a > .date > p {
		margin: 0;
		font-size: 1.4rem;
		line-height: 1.4;
		color: #2bb;
	}
	/*----*/
	input[type="radio"]#listpreview:checked + div + .contestwrapper > .inner > a > .img,
	input[type="radio"]#listpreview:checked + div + .contestwrapper + div + .contestwrapper > .inner > a > .img {
	}
	input[type="radio"]#listpreview:checked + div + .contestwrapper > .inner > a > .img > img,
	input[type="radio"]#listpreview:checked + div + .contestwrapper + div + .contestwrapper > .inner > a > .img > img {
		width: auto;
		height: 80px;
	}
}
@media screen and (max-width:1059px) {
	input[type="radio"]#listpreview:checked + div + .contestwrapper > .inner > a,
	input[type="radio"]#listpreview:checked + div + .contestwrapper + div + .contestwrapper > .inner > a {
		flex-direction: column;
	}
	input[type="radio"]#listpreview:checked + div + .contestwrapper > .inner > a > .txt,
	input[type="radio"]#listpreview:checked + div + .contestwrapper + div + .contestwrapper > .inner > a > .txt {
		padding: 10px 10px 0 10px;
	}
	input[type="radio"]#listpreview:checked + div + .contestwrapper > .inner > a > .date,
	input[type="radio"]#listpreview:checked + div + .contestwrapper + div + .contestwrapper > .inner > a > .date {
		padding: 5px 10px 5px 10px;
	}
	input[type="radio"]#listpreview:checked + div + .contestwrapper > .inner > a > .img,
	input[type="radio"]#listpreview:checked + div + .contestwrapper + div + .contestwrapper > .inner > a > .img {
		margin: 0 0 10px 10px;
	}
	input[type="radio"]#listpreview:checked + div + .contestwrapper > .inner > a > .img > img,
	input[type="radio"]#listpreview:checked + div + .contestwrapper + div + .contestwrapper > .inner > a > .img > img {
		width: auto;
		height: 60px;
	}
}

/*********************************************
**********************************************
		contestwrapper list
**********************************************
**********************************************/
@media print,screen {
	.contestwrapper > .empty {
		display: none;
		text-align: center;
	}
	.contestwrapper > .empty > div {
		display: inline-block;
		background-color: #e8f4f3;
		padding: 20px 30px;
		font-size: 1.4rem;
		line-height: 1.4;
		color: #666;
	}
	.contestwrapper > .inner:empty + .empty {
		display: block;
	}
}
/*--- end of file ---*/
