@charset "UTF-8";
.eventSpaceForm main {
	font-size: 1.5rem;
	line-height: 1.6;
	color: #5d463a;
}
.eventSpaceForm h2 {
	font-size: 2.6rem;
	font-weight: bold;
	line-height: 1.5;
	text-align: center;
	position: relative;
}
.eventSpaceForm h2::after {
	content: "";
	width: 6rem;
	height: 0.2rem;
	background: #5d463a;
	position: absolute;
	bottom: -1.5rem;
	left: calc(50% - 3rem);
}
.eventSpaceForm .flow {
	max-width: 40.5rem;
	margin: 7rem auto 0;
}
@media (max-width: 768px) {
	.eventSpaceForm .wrapper {
		padding: 0;
	}
	.eventSpaceForm main {
		font-size: 1.3rem;
	}
	.eventSpaceForm h2 {
		font-size: 2rem;
	}
	.eventSpaceForm h2::after {
		width: 4rem;
		height: 0.2rem;
		bottom: -1.5rem;
		left: calc(50% - 2rem);
	}
	.eventSpaceForm .flow {
		width: 68%;
		max-width: 46.4rem;
		margin: 6rem auto 0;
	}
}

/* form */
input, button, textarea {
	margin: 0;
	padding: 0;
	background: none;
	border: none;
	border-radius: 0;
	outline: none;
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	font-family:inherit;
}
select {
	margin: 0;
	padding: 0;
	background: none;
	border: none;
	border-radius: 0;
	outline: none;
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	font-family:inherit;
}
.eventSpaceForm .formContents {
	margin-top: 7rem;
}
.eventSpaceForm .formContents .errorMessage {
	border: 0.1rem solid #D80000;
	color: #D80000;
	padding: 1.5rem;
}
.eventSpaceForm .formContents form {
	border-top: 0.1rem solid #BBB;
}
.eventSpaceForm .formContents .errorMessage + form {
	margin-top: 5rem;
}
.eventSpaceForm .formContents dl {
	padding: 2rem 0;
	border-bottom: 0.1rem solid #BBB;
	display: flex;
	align-items: center;
}
.eventSpaceForm .formContents dl dt {
	width: 31%;
	font-weight: bold;
	padding-right: 2.5rem;
}
.eventSpaceForm .formContents dl dt .note {
	font-weight: normal;
}
.eventSpaceForm .formContents dl dt .red {
	font-size: 1.3rem;
	font-weight: normal;
	color: #fff;
	background: #D80000;
	padding: 0.3rem 0.5rem;
	border-radius: 3rem;
	margin-right: 1rem;
}
.eventSpaceForm .formContents dl dd {
	width: 69%;
}
.eventSpaceForm .formContents dl dd input[type="text"] , 
.eventSpaceForm .formContents dl dd input[type="tel"] ,
.eventSpaceForm .formContents dl dd .textArea textarea {
	width: 100%;
	padding: 1rem 1.5rem;
	border: 0.1rem solid #BBB;
	background: #F4F4F4;
	border-radius: 0.4rem;
	font-size: 1.5rem;
	color: #5d463a;
}
.eventSpaceForm .formContents dl dd input[type="text"].half ,
.eventSpaceForm .formContents dl dd input[type="tel"].half {
	width: 50%;
}
.eventSpaceForm .formContents dl dd .error input[type="text"] , 
.eventSpaceForm .formContents dl dd .error input[type="tel"] ,
.eventSpaceForm .formContents dl dd .textArea.error textarea ,
.eventSpaceForm .formContents dl dd .error label.checkTxt {
	border: 0.1rem solid #D80000;
	background: #FFEDED;
}
.eventSpaceForm .formContents dl dd .errorTxt {
	display: none;
	margin-top: 1rem;
	color: #D80000;
}
.eventSpaceForm .formContents dl dd .error ~ .errorTxt {
	display: block;
}
.eventSpaceForm .formContents dl dd input::placeholder {
	color: #999;
}
.eventSpaceForm .formContents dl dd .note {
	margin-top: 1rem;
}
@media (max-width: 768px) {
	.eventSpaceForm .formContents {
		margin-top: 4rem;
	}
	.eventSpaceForm .formContents .errorMessage {
		padding: 1.4rem;
		margin: 0 1.5rem;
	}
	.eventSpaceForm .formContents .errorMessage + form {
		margin-top: 3rem;
	}
	.eventSpaceForm .formContents dl {
		display: block;
	}
	.eventSpaceForm .formContents dl dt {
		width: 100%;
		font-size: 1.5rem;
		padding: 0 1.5rem;
	}
	.eventSpaceForm .formContents dl dt .red {
		padding: 0.5rem 0.7rem;
	}
	.eventSpaceForm .formContents dl dt .note {
		font-size: 1.3rem;
	}
	.eventSpaceForm .formContents dl dd {
		margin-top: 1rem;
		width: 100%;
		padding: 0 1.5rem;
	}
	.eventSpaceForm .formContents dl dd input[type="text"] , 
	.eventSpaceForm .formContents dl dd input[type="tel"] ,
	.eventSpaceForm .formContents dl dd .textArea textarea {
		padding: 1rem 1.3rem;
		font-size: 1.3rem;
	}
	.eventSpaceForm .formContents dl dd .errorTxt {
		margin-top: 1rem;
	}
	.eventSpaceForm .formContents dl dd .note {
		margin-top: 1rem;
	}
}

/* select */
.eventSpaceForm .formContents dl dd .selectBox select {
	width: 100%;
	padding: 1rem 2.5rem 1rem 1.5rem;
	border: 0.1rem solid #BBB;
	background-color: #F4F4F4;
	border-radius: 0.4rem;
	background-image: linear-gradient(45deg, transparent 50%, #5d463a 50%), linear-gradient(135deg, #5d463a 50%, transparent 50%);
	background-size: 0.5rem 0.6rem, 0.6rem 0.6rem;
	background-position: calc(100% - 1.5rem) 50%, calc(100% - 1rem) 50%;
	background-repeat: no-repeat;
	font-size: 1.5rem;
	color: #5d463a;
	position: relative;
	cursor: pointer;
}
_:lang(x)::-internal-media-controls-overlay-cast-button, body {
	.eventSpaceForm .formContents dl dd .selectBox select {
		padding: 1.4rem 2.5rem 1.4rem 1.5rem;
	}
}
.eventSpaceForm .formContents dl dd .selectBox.error select {
	border: 0.1rem solid #D80000;
	background-color: #FFEDED;
}
.eventSpaceForm .formContents dl dd .selectBox.df {
	display: flex;
	justify-content: space-between;
}
.eventSpaceForm .formContents dl dd .selectBox.df > div {
	width: 30%;
	display: flex;
	justify-content: space-between;
	align-items: center;
}
.eventSpaceForm .formContents dl dd .selectBox.df > div select {
	width: 90%;
}
.eventSpaceForm .formContents dl dd .selectBox.df > div {
	width: 30%;
	display: flex;
	justify-content: space-between;
	align-items: center;
}
.eventSpaceForm .formContents dl dd .selectBox.df > div select {
	width: 90%;
}
@media (max-width: 768px) {
	.eventSpaceForm .formContents dl dd .selectBox select {
		width: 100%;
		padding: 1rem 2.5rem 1rem 1.3rem;
		font-size: 1.3rem;
	}
	_:lang(x)::-internal-media-controls-overlay-cast-button, body {
		.eventSpaceForm .formContents dl dd .selectBox select {
			padding: 1.4rem 2.5rem 1.4rem 1.5rem;
		}
	}
	.eventSpaceForm .formContents dl dd .selectBox.df {
		flex-wrap: wrap;
		gap: 1rem 0;
	}
	.eventSpaceForm .formContents dl dd .selectBox.df > div {
		width: 48%;
	}
	.eventSpaceForm .formContents dl dd .selectBox.df > div:first-child {
		margin-right: 48%;
	}
	.eventSpaceForm .formContents dl dd .selectBox.df > div select {
		width: 88%;
	}
}

/* radio */
.eventSpaceForm .formContents dl dd .radioBox {
	display: flex;
	flex-wrap: wrap;
	gap: 2rem 0;
}
.eventSpaceForm .formContents dl dd .radioBox > div {
	width: 17%;
}
.eventSpaceForm .formContents dl dd .radioBox > div.w30 {
	width: 30%;
}
.eventSpaceForm .formContents dl dd .radioBox .typeRadio {
	display: flex;
	align-items: center;
}
.eventSpaceForm .formContents dl dd .typeRadio > input[type="radio"] {
	position: relative;
	width: 2.2rem;
	height: 2.2rem;
	border: 0.2rem solid #888;
	border-radius: 50%;
	vertical-align: top;
	cursor: pointer;
}
.eventSpaceForm .formContents dl dd .typeRadio > input[type="radio"]:checked::before {
	content: "";
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: 1.2rem;
	height: 1.2rem;
	border-radius: 50%;
	background: #5D463A;
}
.eventSpaceForm .formContents dl dd .typeRadio span {
	margin-left: 0.5rem;
}
@media (max-width: 768px) {
	.eventSpaceForm .formContents dl dd .radioBox {
		margin-top: 1.5rem;
		gap: 2.4rem 0;
	}
	.eventSpaceForm .formContents dl dd .radioBox > div {
		width: 30%;
	}
	.eventSpaceForm .formContents dl dd .radioBox.half > div {
		width: 50%;
	}
	.eventSpaceForm .formContents dl dd .radioBox > div.w30 {
		width: 50%;
	}
	.eventSpaceForm .formContents dl dd .typeRadio span {
		margin-left: 0.8rem;
	}
}

/* textArea */
.eventSpaceForm .formContents dl dd .textArea.others {
	margin-top: 2.5rem;
}
.eventSpaceForm .formContents dl dd .textArea textarea {
	resize: none;
}
.eventSpaceForm .formContents dl dd .textArea.others textarea {
	margin-top: 1rem;
	height: 9rem;
}
.eventSpaceForm .formContents dl dd .textArea textarea {
	height: 18.9rem;
}
@media (max-width: 768px) {
	.eventSpaceForm .formContents dl dd .textArea.others {
		margin-top: 2rem;
	}
	.eventSpaceForm .formContents dl dd .textArea.others textarea {
		margin-top: 1rem;
		height: 16.2rem;
	}
	.eventSpaceForm .formContents dl dd .textArea textarea {
		height: 24.7rem;
	}
}

/* file */
.eventSpaceForm .formContents dl dd .fileBox .fileSelect input {
	display: none;
}
.eventSpaceForm .formContents dl dd .fileBox .fileArea {
	display: flex;
	align-items: center;
	gap: 0 1.5rem;
}
.eventSpaceForm .formContents dl dd .fileBox .fileSelect {
	display: block;
	width: 17rem;
	padding: 1rem 1.5rem;
	border: 0.1rem solid #BBB;
	background: #F4F4F4;
	border-radius: 0.4rem;
	font-size: 1.5rem;
	text-align: center;
	color: #5d463a;
	cursor:pointer;
}
.eventSpaceForm .formContents dl dd .fileBox.error .fileSelect {
	border: 0.1rem solid #D80000;
	background: #FFEDED;
}
@media (max-width: 768px) {
	.eventSpaceForm .formContents dl dd .fileBox .fileArea {
		gap: 0 1.2rem;
	}
	.eventSpaceForm .formContents dl dd .fileBox .fileSelect {
		width: 40%;
		max-width: 28rem;
		padding: 0.7rem;
		font-size: 1.3rem;
	}
}

/* privacy */
.eventSpaceForm .formContents dl dd .privacy {
	width: 100%;
	height: 21rem;
	padding: 1.3rem 0.6rem 1.3rem 1.3rem;
	border: 0.1rem solid #BBB;
	overflow-y: scroll;
}
.eventSpaceForm .formContents dl dd .privacy .privacyTxt {
	font-size: 1.3rem;
	line-height: 2rem;
}
.eventSpaceForm .formContents dl dd .privacy .privacyTxt p + ul {
	margin-top: 2rem;
}
@media (max-width: 768px) {
	.eventSpaceForm .formContents dl dd .privacy {
		height: 24.7rem;
		padding: 1.3rem 0.6rem 1.3rem 1.3rem;
	}
}

/* check */
.eventSpaceForm .formContents .checkArea {
	margin-top: 2rem;
	display: flex;
	align-items: center;
}
.eventSpaceForm .formContents .checkArea input ,
.eventSpaceForm .formContents .checkArea label {
	cursor: pointer;
}
.eventSpaceForm .formContents .checkArea input[type="checkbox"] {
	opacity: 0;
}
.eventSpaceForm .formContents .checkArea input[type="checkbox"] + label {
	display: inline-block;
	padding-left: 3rem;
	line-height: 1.5;
	position: relative;
}
.eventSpaceForm .formContents .checkArea input[type="checkbox"] + label::before,
.eventSpaceForm .formContents .checkArea input[type="checkbox"] + label::after {
	content: "";
	position: absolute;
	display: block;
}
.eventSpaceForm .formContents .checkArea input[type="checkbox"] + label::before {
	top: 0;
	left: 0;
	width: 1.7rem;
	height: 1.7rem;
	border: 0.2rem solid #888;
	background-color: #fff;
	border-radius: 0.2rem;
}
.eventSpaceForm .formContents .checkArea input[type="checkbox"] + label::after {
	top: 0.5rem;
	left: 0.3rem;
	width: 1.3rem;
	height: 0.4rem;
	border-bottom: 0.3rem solid #fff;
	border-left: 0.3rem solid #fff;
	transform: rotate(-45deg);
	opacity: 0;
}
.eventSpaceForm .formContents .checkArea input[type="checkbox"]:disabled + label {
	cursor: default;
	opacity: 0.5;
}
.eventSpaceForm .formContents .checkArea input[type="checkbox"]:checked + label::before {
	border: 0.2rem solid #5D463A;
	background-color: #5D463A;
}
.eventSpaceForm .formContents .checkArea input[type="checkbox"]:checked + label::after {
	opacity: 1;
}
.eventSpaceForm .formContents .checkArea .errorTxt {
	display: none;
	margin-top: 1rem;
	color: #D80000;
}
.eventSpaceForm .formContents .checkArea.error ~ .errorTxt {
	display: block;
}
@media (max-width: 768px) {
	.eventSpaceForm .formContents .checkArea {
		margin-top: 1.5rem;
	}
}

/* btn */
.eventSpaceForm .formContents .btn {
	display: block;
	width: 24.4rem;
	margin: 5.5rem auto 0;
	border: 0.1rem solid #5D463A;
	border-radius: 2.8rem;
	padding: 1.3rem;
	font-size: 1.7rem;
	font-weight: bold;
	text-align: center;
	color: #5D463A;
	cursor: pointer;
}
@media (max-width: 768px) {
	.eventSpaceForm .formContents .btn {
		width: 50%;
		max-width: 35.8rem;
		margin: 3rem auto 0;
		border-radius: 3rem;
		padding: 1rem;
		font-size: 1.5rem;
	}
}

/* confirm */
.eventSpaceForm .formContents.confirm p + p {
	margin-top: 1rem;
}
.eventSpaceForm .formContents.confirm .btnBox {
	margin-top: 5.5rem;
	display: flex;
	justify-content: center;
	gap: 0 1.2rem;
}
.eventSpaceForm .formContents.confirm .btnBox .confirmBtn {
	display: block;
	border: 0.1rem solid #5D463A;
	border-radius: 2.8rem;
	padding: 1.3rem;
	font-size: 1.7rem;
	font-weight: bold;
	text-align: center;
	color: #5D463A;
	cursor: pointer;
}
.eventSpaceForm .formContents.confirm .btnBox .backBtn {
	width: 15rem;
}
.eventSpaceForm .formContents.confirm .btnBox .submitBtn {
	width: 24.4rem;
}
@media (max-width: 768px) {
	.eventSpaceForm .formContents.confirm .btnBox {
		margin-top: 3rem;
		display: block;
	}
	.eventSpaceForm .formContents.confirm .btnBox .confirmBtn {
		max-width: 35.8rem;
		margin: 0 auto;
		border-radius: 3rem;
		padding: 1rem;
		font-size: 1.5rem;
	}
	.eventSpaceForm .formContents.confirm .btnBox .confirmBtn + .confirmBtn {
		margin-top: 2rem;
	}
	.eventSpaceForm .formContents.confirm .btnBox .backBtn {
		width: 50%;
	}
	.eventSpaceForm .formContents.confirm .btnBox .submitBtn {
		width: 50%;
	}
}

/* done */
.eventSpaceForm .doneBox {
	margin-top: 7rem;
	padding: 3rem 0;
	border-top: 0.1rem solid #BBB;
	border-bottom: 0.1rem solid #BBB;
}
.eventSpaceForm .doneBox .doneTtl {
	font-size: 1.7rem;
	font-weight: bold;
}
.eventSpaceForm .doneBox .doneTxt {
	margin-top: 2rem;
}
.eventSpaceForm .doneBox .doneTxt > p {
	line-height: 2.4rem;
}
.eventSpaceForm .doneBox .doneTxt > p + p {
	margin-top: 1.5rem;
}
.eventSpaceForm .backTopBtn {
	display: block;
	width: 24.4rem;
	margin: 5.5rem auto 0;
	border: 0.1rem solid #5D463A;
	border-radius: 2.8rem;
	padding: 1.3rem;
	font-size: 1.7rem;
	font-weight: bold;
	text-align: center;
	color: #5D463A;
	cursor: pointer;
}
@media (max-width: 768px) {
	.eventSpaceForm .doneBox {
		margin-top: 5rem;
		padding: 3rem 1.5rem;
		border-top: 0.1rem solid #BBB;
		border-bottom: 0.1rem solid #BBB;
	}
	.eventSpaceForm .doneBox .doneTtl {
		font-size: 1.5rem;
	}
	.eventSpaceForm .doneBox .doneTxt {
		margin-top: 2rem;
	}
	.eventSpaceForm .doneBox .doneTxt > p {
		line-height: 2.4rem;
	}
	.eventSpaceForm .doneBox .doneTxt > p + p {
		margin-top: 1rem;
	}
	.eventSpaceForm .backTopBtn {
		width: 50%;
		max-width: 35.8rem;
		margin: 3rem auto 0;
		border-radius: 3rem;
		padding: 1rem;
		font-size: 1.5rem;
	}
}