@charset "utf-8";

/* 【リセットCSS】 */

/* Google Fonts

.noto-sans-jp-<uniquifier> {
	font-family: "Noto Sans JP", sans-serif;
	font-optical-sizing: auto;
	font-weight: <weight>;
	font-style: normal;
}
	font-weight: 100; (Thin)
	font-weight: 200; (ExtraLight)
	font-weight: 300; (Light)
	font-weight: 400; (Regular)
	font-weight: 500; (Medium)
	font-weight: 600; (SemiBold)
	font-weight: 700; (Bold)
	font-weight: 800; (ExtraBold)
	font-weight: 900; (Black)

.noto-serif-jp-<uniquifier> {
	font-family: "Noto Serif JP", serif;
	font-optical-sizing: auto;
	font-weight: <weight>;
	font-style: normal;
}
	font-weight: 200; (ExtraLight)
	font-weight: 300; (Light)
	font-weight: 400; (Regular)
	font-weight: 500; (Medium)
	font-weight: 600; (SemiBold)
	font-weight: 700; (Bold)
	font-weight: 800; (ExtraBold)
	font-weight: 900; (Black)

*/
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@100..900&family=Noto+Serif+JP:wght@200..900&display=swap');

:root {
	--max-width: 1200px;				/* ウィンドウ幅 */
	--required-w: 76px;					/* 必須/任意（幅） */
	--required-r: #dd0000;				/* 必須（赤色） */
	--required-b: #0000dd;				/* 任意（青色） */
	--item01: 400px;					/* 単一見出し */
	--item02: 500px;					/* 単一入力 */
	--item03: 350px;					/* 氏名・・（見出し） */
	--item04: 50px;						/* 姓・・（見出し） */
	--item05: 200px;					/* 姓・・（入力） */
	--item06: 50px;						/* 名前の余白 */
	--item07: 70px;						/* 人数（入力） */
	--item08: 50px;						/* 内部見出し */
	--item09: 450px;					/* 内部見出し（入力） */
}

*,*::before,*::after {
	box-sizing: border-box;
}
html {
	font-size: 18px;
	scroll-behavior: smooth;
}
body,h1,h2,h3,h4,h5,h6,article,section,header,footer,nav,aside,p,hr,ul,ol,li,dl,dt,dd,div,
main,em,strong,small,i,b,spantable,caption,tr,th,td,pre,label,input,textarea,select,button {
	padding: 0;
	margin: 0;
	font-size: inherit;
	font-weight: inherit;
	line-height: 1.6;
	word-wrap: break-word;
}
body,input,textarea,button {
	font-family: "Noto Serif JP", serif;
	font-optical-sizing: auto;
	font-weight: 400;
	font-style: normal;
	color: var(--cFont-g);
}
address,em,i {
	font-style: normal;
}
strong,th,b {
	font-weight: normal;
}
img {
	width: 100%;
	height: auto;
	vertical-align: bottom;
}
a {
	color: inherit;
	text-decoration: none;
}
a:hover {
	opacity: 0.6;
}
.noto-sans {
	font-family: "Noto Sans JP", sans-serif;
	font-optical-sizing: auto;
	font-weight: 400;
	font-style: normal;
}

/* 【ユーザーCSS】 */

/* ■共通■ */
.container-w {
	background: #a9cfdf;
}
.container {
	background: #f8f8f8;
}
.wrapper {
	max-width: var(--max-width);
	margin: 0 auto;
	padding: 40px 20px;
}

/* チェックボックス */
.checkbox {
}
.checkbox > input {
	display: none;
}
.checkbox > span {
	position: relative;
}
.checkbox > span::before {
	content: "";
	display: inline-block;
	width: 1.4rem;
	height: 1.4rem;
	margin-right: 8px;
	margin-top: -3px;
	background: linear-gradient(45deg, #d0d0d0, #ffffff);
	border: 1px #888 solid;
	border-radius: 5px;
	vertical-align: middle;
}
.checkbox > input:checked + span::before {
	border: 2px #888 solid;
}
.checkbox:hover > input + span::before {
	border: 2px #888 solid;
}
.checkbox > input:checked + span::after {
	content: "";
	display: inline-block;
	width: 1.4rem;
	height: 1.4rem;
	position: absolute;
	left: 2px;
	top: 50%;
	margin-top: -13px;
	background-image: url(../images/icon-chk.svg);
	background-position: center center;
	background-repeat: no-repeat;
	background-size: contain;
}

/* ラジオボタン */
.radio {
}
.radio > input {
	display: none;
}
.radio > span {
	position: relative;
}
.radio > span::before {
	content: "";
	display: inline-block;
	width: 23px;
	height: 23px;
	margin-right: 8px;
	margin-top: -7px;
	border-radius: 50%;
	border: 1px #666 solid;
	vertical-align: middle;
}
.radio > input:checked + span::before {
	border: 2px #666 solid;
}
.radio:hover input + span::before {
	border: 2px #666 solid;
}
.radio > input:checked + span::after {
	content: "";
	display: inline-block;
	height: 13px;
	width: 13px;
	position: absolute;
	left: 5px;
	top: 6px;
	border-radius: 50%;
	background: #666;
}

/* スマホ制御 */
.sp {
	display: none;
}
@media screen and (max-width: 760px) {
	.sp {
		display: inline;
	}
}
.pc {
	display: inline;
}
@media screen and (max-width: 760px) {
	.pc {
		display: none;
	}
}

/* 改行 */
.lf5 {
	margin-bottom: 5px;
}
.lf10 {
	margin-bottom: 10px;
}
.lf15 {
	margin-bottom: 15px;
}
.lf20 {
	margin-bottom: 20px;
}
.lf30 {
	margin-bottom: 30px;
}
.lf40 {
	margin-bottom: 40px;
}
.lf50 {
	margin-bottom: 50px;
}
.lf60 {
	margin-bottom: 60px;
}

/* ■ヘッダー■ */
header {
}
header h1 {
	padding: 20px 0;
	font-size: 2.0rem;
	text-align: center;
}
.wrapper h2 {
	padding: 10px 0 10px 20px;
	font-size: 1.5rem;
	background: #ccc;
}
@media screen and (max-width: 1200px) {
	.wrapper h2 {
		text-align: center;
	}
}

/* メッセージ */
#message {
	color: var(--required-r);
}
#message ul {
	margin-left: 30px;
}
.c-alert::after {
	content: "★";
	color: var(--required-r);
	padding-left: 5px;
}

/* ■フッター■ */
footer {
}
/* ■フッター■ */
footer p {
	text-align: center;
}

/* ■■ 入力画面 ■■ */

/* ■共通フォーマット■ */
.input main .row-hr, .input main .row-hb {
	display: flex;
	flex-wrap: wrap;
}
.input main .row-hr > span:nth-child(1), .input main .row-hb > span:nth-child(1) {
	display: block;
	width: var(--required-w);
}
.input main .row-hr > span:nth-child(1) {
	color: var(--required-r);
}
.input main .row-hb > span:nth-child(1) {
	color: var(--required-b);
}

/* ■応募の注意事項■ */

.input main .caution {
	margin-left: 30px;
}
.input main .row-p01 > span:nth-child(2) {
	width: calc(100% - var(--required-w));
}

/* 注意事項（チェック） */
.input main .row-p02 {
	display: flex;
	flex-wrap: wrap;
}
.input main .row-p02 > span:nth-child(2) {
	width: calc(100% - 40px);
}
.input main .row-p02 .d-terms {
	color: blue;
	text-decoration:
	blue underline;
}
.input main .row-p02 .d-terms:hover {
	cursor: pointer;
}

/* ■作家に関して■ */

/* 氏名 */
.input main .row-p03 > span:nth-child(2) {
	display: block;
	width: var(--item03);
}
@media screen and (max-width: 760px) {
	.input main .row-p03 > span:nth-child(2) {
		width: calc(100% - var(--required-w));
	}
}
.input main .row-p03 > span:nth-child(3) {
	display: block;
	width: var(--item04);
}
@media screen and (max-width: 760px) {
	.input main .row-p03 > span:nth-child(3) {
		margin: 0 0 0 20px;
	}
}
.input main .row-p03 > span:nth-child(4) {
	display: block;
	width: var(--item05);
}
@media screen and (max-width: 760px) {
	.input main .row-p03 > span:nth-child(4) {
		width: 90px;
	}
}
.input main .row-p03 > span:nth-child(4) input {
	width: 100%;
	padding: 0 7px;
}
.input main .row-p03 > span:nth-child(5) {
	display: block;
	width: var(--item06);
}
@media screen and (max-width: 760px) {
	.input main .row-p03 > span:nth-child(5) {
		display: none;
	}
}
.input main .row-p03 > span:nth-child(6) {
	display: block;
	width: var(--item04);
}
@media screen and (max-width: 760px) {
	.input main .row-p03 > span:nth-child(6) {
		margin: 0 0 0 20px;
	}
}
.input main .row-p03 > span:nth-child(7) {
	display: block;
	width: var(--item05);
}
@media screen and (max-width: 760px) {
	.input main .row-p03 > span:nth-child(7) {
		width: 90px;
	}
}
.input main .row-p03 > span:nth-child(7) input {
	width: 100%;
	padding: 0 7px;
}

/* 年齢 */
.input main .row-p04 > span:nth-child(2) {
	display: block;
	width: var(--item03);
}
@media screen and (max-width: 760px) {
	.input main .row-p04 > span:nth-child(2) {
		width: calc(100% - var(--required-w));
	}
}
.input main .row-p04 > span:nth-child(3) {
	display: block;
	width: var(--item04);
}
@media screen and (max-width: 760px) {
	.input main .row-p04 > span:nth-child(3) {
		margin: 0 0 0 20px;
	}
}
.input main .row-p04 > span:nth-child(4) {
	display: block;
	width: 120px;
}
.input main .row-p04 > span:nth-child(4) input {
	width: 100%;
	padding: 0 7px;
}
.input main .row-p04 > span:nth-child(5) {
	display: block;
	width: 100px;
}
.input main .row-p04 > span:nth-child(6) {
	display: block;
	width: 240px;
}
@media screen and (max-width: 760px) {
	.input main .row-p04 > span:nth-child(6) {
		margin: 0 0 0 20px;
	}
}

/* 単一入力（アーティスト名・画号・グループ名、住所、施設名、メールアドレスなど） */
.input main .row-p05 > span:nth-child(2) {
	display: block;
	width: var(--item01);
}
@media screen and (max-width: 760px) {
	.input main .row-p05 > span:nth-child(2) {
		width: calc(100% - var(--required-w));
	}
}
.input main .row-p05 > span:nth-child(3) {
	display: block;
	width: var(--item02);
}
@media screen and (max-width: 760px) {
	.input main .row-p05 > span:nth-child(3) {
		margin: 0 0 0 20px;
		width: calc(100% - 20px);
	}
}
.input main .row-p05 > span:nth-child(3) input {
	width: 100%;
	padding: 0 7px;
}

/* 作家・グループ人数 */
.input main .row-p06 > span:nth-child(2) {
	display: block;
	width: var(--item01);
}
@media screen and (max-width: 760px) {
	.input main .row-p06 > span:nth-child(2) {
		width: calc(100% - var(--required-w));
	}
}
.input main .row-p06 > span:nth-child(3) {
	display: block;
	width: var(--item07);
}
@media screen and (max-width: 760px) {
	.input main .row-p06 > span:nth-child(3) {
		margin: 0 0 0 20px;
	}
}
.input main .row-p06 > span:nth-child(3) input {
	width: 100%;
	padding: 0 7px;
}

/* 障害種別 */
.input main .row-p07 > span:nth-child(2) {
	display: block;
	width: var(--item01);
}
@media screen and (max-width: 760px) {
	.input main .row-p07 > span:nth-child(2) {
		width: calc(100% - var(--required-w));
	}
}
.input main .row-p07 > span:nth-child(3) {
	display: flex;
	flex-wrap: wrap;
	width: var(--item02);
}
@media screen and (max-width: 760px) {
	.input main .row-p07 > span:nth-child(3) {
		margin: 0 0 0 20px;
	}
}
.input main .row-p07 > span:nth-child(3) label {
	display: block;
	width: 160px;
}
@media screen and (max-width: 760px) {
	.input main .row-p07 > span:nth-child(3) label {
		width: 150px;
	}
}

/* 障害種別（その他） */
.input main .row-p08 > span:nth-child(2) {
	display: block;
	width: var(--item01);
}
.input main .row-p08 > span:nth-child(3) {
	display: block;
}
@media screen and (max-width: 760px) {
	.input main .row-p08 > span:nth-child(3) {
		margin: 0 0 0 20px;
	}
}
.input main .row-p08 > span:nth-child(3) label {
	display: block;
}

/* 障害種別（その他：入力欄） */
.input main .row-p09 > span:nth-child(2) {
	display: block;
	width: var(--item01);
}
@media screen and (max-width: 760px) {
	.input main .row-p09 > span:nth-child(2) {
		width: calc(100% - var(--required-w));
	}
}
.input main .row-p09 > span:nth-child(3) {
	display: block;
	width: var(--item02);
}
@media screen and (max-width: 760px) {
	.input main .row-p09 > span:nth-child(3) {
		margin: 0 0 0 20px;
		width: calc(100% - 20px);
	}
}
.input main .row-p09 > span:nth-child(3) textarea {
	display: block;
	width: 100%;
	height: 120px;
	padding: 0 7px;
}

/* 郵便番号 */
.input main .row-p10 > span:nth-child(2) {
	display: block;
	width: var(--item01);
}
@media screen and (max-width: 760px) {
	.input main .row-p10 > span:nth-child(2) {
		width: calc(100% - var(--required-w));
	}
}
.input main .row-p10 > span:nth-child(3) {
	display: block;
	width: 85px;
}
@media screen and (max-width: 760px) {
	.input main .row-p10 > span:nth-child(3) {
		margin: 0 0 0 20px;
	}
}
.input main .row-p10 > span:nth-child(4) {
	display: block;
	width: 150px;
}
.input main .row-p10 > span:nth-child(4) input {
	display: inline-block;
	width: 150px;
	padding: 0 7px;
}
.input main .row-p10 > span:nth-child(5) {
	display: block;
	width: 200px;
}
@media screen and (max-width: 760px) {
	.input main .row-p10 > span:nth-child(5) {
		margin: 0 0 0 20px;
	}
}

/* ■作品に関して■ */

/* 内部見出し */
.input main .row-p11 > span:nth-child(2) {
	display: block;
	width: var(--item01);
}
@media screen and (max-width: 760px) {
	.input main .row-p11 > span:nth-child(2) {
		width: calc(100% - var(--required-w));
	}
}
.input main .row-p11 > span:nth-child(3) {
	display: block;
	width: var(--item08);
}
@media screen and (max-width: 760px) {
	.input main .row-p11 > span:nth-child(3) {
		margin: 0 0 0 20px;
	}
}
.input main .row-p11 > span:nth-child(4) {
	display: block;
	width: var(--item09);
}
@media screen and (max-width: 760px) {
	.input main .row-p11 > span:nth-child(4) {
		width: calc(100% - 70px);
	}
}
.input main .row-p11 > span:nth-child(4) input {
	display: block;
	width: 100%;
	padding: 0 7px;
}

/* 作品サイズ */
.input main .row-p12 > span:nth-child(2) {
	display: block;
	width: var(--item01);
}
@media screen and (max-width: 760px) {
	.input main .row-p12 > span:nth-child(2) {
		width: calc(100% - var(--required-w));
	}
}
.input main .row-p12 > span:nth-child(3) {
	display: flex;
	flex-wrap: wrap;
	width: var(--item02);
}
@media screen and (max-width: 760px) {
	.input main .row-p12 > span:nth-child(3) {
		margin: 0 0 0 20px;
	}
}
.input main .row-p12 > span:nth-child(3) label {
	display: block;
	width: 160px;
}
.input main .row-p12 > span:nth-child(3) label input {
	width: 80px;
	padding: 0 7px;
}

/* 画像入力 */
.input main .row-p13 > span:nth-child(2) {
	display: block;
	width: var(--item01);
}
@media screen and (max-width: 760px) {
	.input main .row-p13 > span:nth-child(2) {
		width: calc(100% - var(--required-w));
	}
}
.input main .row-p13 > span:nth-child(3) {
	display: block;
}
@media screen and (max-width: 760px) {
	.input main .row-p13 > span:nth-child(3) {
		margin: 0 0 0 20px;
		width: calc(100% - 20px);
	}
}
.input main .row-p13 > span:nth-child(3) .upload-input {
	display: none;
}
.input main .row-p13 > span:nth-child(3) .upload-button {
	display: inline-block;
	width: 240px;
	vertical-align: top;
}
.input main .row-p13 > span:nth-child(3) .upload-name {
	display: inline-block;
	width: 400px;
}
@media screen and (max-width: 760px) {
	.input main .row-p13 > span:nth-child(3) .upload-name {
		width: calc(100% - 20px);
	}
}

/* 画像表示 */
@media screen and (max-width: 760px) {
	.input main .row-p14 > span:nth-child(1) {
		width: 20px;
	}
}
.input main .row-p14 > span:nth-child(2) {
	display: block;
	width: var(--item01);
}
@media screen and (max-width: 760px) {
	.input main .row-p14 > span:nth-child(2) {
		width: calc(100% - var(--required-w));
	}
}
.input main .row-p14 > span:nth-child(3) {
	display: block;
	width: 400px;
}
@media screen and (max-width: 760px) {
	.input main .row-p14 > span:nth-child(3) {
		margin: 0 0 0 20px;
		width: calc(100% - 20px);
	}
}

/* 作品種別 */
.input main .row-p15 > span:nth-child(2) {
	display: block;
	width: var(--item01);
}
@media screen and (max-width: 760px) {
	.input main .row-p15 > span:nth-child(2) {
		width: calc(100% - var(--required-w));
	}
}
.input main .row-p15 > span:nth-child(3) {
	display: flex;
	flex-wrap: wrap;
	width: var(--item02);
}
@media screen and (max-width: 760px) {
	.input main .row-p15 > span:nth-child(3) {
		margin: 0 0 0 20px;
	}
}
.input main .row-p15 > span:nth-child(3) label {
	display: block;
	width: 160px;
}
@media screen and (max-width: 760px) {
	.input main .row-p15 > span:nth-child(3) label {
		width: 100px;
	}
}

/* ■ボタン■ */

/* メッセージ */
.input main .row-send {
	padding: 10px;
	text-align: center;
	background: #ccc;
}

/* ボタン */
.input main .row-button {
	text-align: center;
}
.input main .row-button .send-input {
	display: none;
}
.input main .row-button .send-button {
	display: inline-block;
	width: 200px;
	padding: 5px 0;
	font-size: 1.5rem;
}

/* ■規約表示ダイアログ■ */

.terms-dialog {
	width: 100%;
	max-width: var(--max-width);
	padding: 40px;
}
.terms-dialog h3 {
	font-size: 1.5rem;
	padding: 0 0 20px 0;
}
.terms-dialog h4 {
	font-size: 1.3rem;
	padding: 20px 0 20px 0;
}
.terms-dialog ol {
	margin: 0 0 0 20px;
}
.terms-dialog .button {
	margin: 40px 0 0 0;
	text-align: center;
}
.terms-dialog .button button {
	width: 100px;
	padding: 5px 0;
}

/* ■■ 確認画面 ■■ */

/* ■入力内容の確認について■ */

.confirm main .caution {
	margin-left: 30px;
}

/* ■作家に関して■ */

.confirm main .row-p01 {
	display: flex;
}
@media screen and (max-width: 760px) {
	.confirm main .row-p01 {
		display: block;
	}
}
.confirm main .row-p01 > span:nth-child(1) {
	display: block;
	width: 350px;
}
.confirm main .row-p01 > span:nth-child(1)::before {
	content: "■ ";
}
.confirm main .row-p01 > span:nth-child(2) {
	display: block;
	width: calc(100% - 350px);
}
@media screen and (max-width: 760px) {
	.confirm main .row-p01 > span:nth-child(2) {
		width: calc(100% - 20px);
		margin: 0 0 0 20px;
	}
}
.confirm main .row-p01 > span:nth-child(2) img {
	max-width: 400px;
	padding: 5px 0 5px 0;
}

/* ■ボタン■ */

/* メッセージ */
.confirm main .row-send {
	padding: 10px;
	text-align: center;
	background: #ccc;
}

/* ボタン */
.confirm main .row-button {
	text-align: center;
}
.confirm main .row-button .send-input {
	display: none;
}
.confirm main .row-button .send-button {
	display: inline-block;
	width: 200px;
	padding: 5px 0;
	font-size: 1.5rem;
}
@media screen and (max-width: 760px) {
	.confirm main .row-button .send-button {
		width: 140px;
	}
}

/* ■■ サイトメッセージ ■■ */

/* ■サイトメッセージ■ */

.noservice main p {
	text-align: center;
}