@charset "UTF-8";
/*--------------------------------------------------------------
#container
--------------------------------------------------------------*/

/* mobile */
@media (min-width: 300px) {
	
	#container {
		background: #232323;
	}
	
	
	
}

/* Small than tablet */
@media (min-width: 768px) {
	
	
	
}


/* Larger than tablet */
@media (min-width: 992px) {
	
	

}

/*--------------------------------------------------------------
#contact-area
--------------------------------------------------------------*/

/* mobile */
@media (min-width: 300px) {
	
	#contact-area {
		margin: 0;
		padding: 20px 5% 30px 5%;
		background: #2F2F2F;
	}
	
	#contact-area p.top {
		margin: 0 auto;
		padding: 0 0 30px 0;
		max-width: auto;
	}
	
}

/* Small than tablet */
@media (min-width: 768px) {
	
	
	
}


/* Larger than tablet */
@media (min-width: 992px) {
	
	#contact-area {
		margin: 0 5% 0 0;
		padding: 3.66vw 0;
		background: #2F2F2F;
	}
	
	#contact-area p.top {
		margin: 0 auto;
		padding: 0 0 6.59vw 5%;
		max-width: 73.2vw;
	}

}

/*--------------------------------------------------------------
.form-area
--------------------------------------------------------------*/

/* mobile */
@media (min-width: 300px) {
	
	.form-area {
		margin: 0 auto;
		padding: 0 0 30px 0;
		display: -webkit-flex;
		display: flex;
		-webkit-justify-content: space-between;
		justify-content: space-between;
		flex-wrap: wrap;
		max-width: auto;
	}
	
	.form-area div:first-child {
		margin: 0 0 30px 0;
		padding: 0;
		width: 100%;
		box-sizing: border-box;
	}
	
	.form-area div:first-child dl {
		margin: 0;
		padding: 0;
	}
	
	.form-area div:first-child dt {
		margin: 0;
		padding: 5px 0;
		font-size: 16px;
		font-weight: 600;
		color: #5D5D5D;
	}
	
	.form-area div:first-child dt span {
		margin: 0 20px 0 0;
		padding: 0;
		font-size: 18px;
		font-weight: 600;
		font-style: italic;
		font-family: "Exo 2", serif;
	}
	
	.form-area div:first-child dt.now {
		color: #2AB4FF;
	}
	
	.form-area div:last-child {
		margin: 0;
		padding: 0;
		width: 100%;
	}
	
	.form-area div:last-child dt {
		margin: 0;
		padding: 0;
		font-size: 16px;
		font-weight: 500;
	}
	
	.form-area div:last-child dt span {
		margin: 0 0 0 15px;
		padding: 0 2px;
		font-size: 13px;
		font-weight: 600;
		background: #2AB4FF;
	}
	
	.form-area div:last-child dd {
		margin: 0 0 25px 0;
		padding: 0;
		font-size: 16px;
		font-weight: 500;
	}
	
	.checkbox_list {
		display: flex;
		flex-direction: column; /* 縦並びにする */
		gap: 10px;
		margin-top: 20px !important;
		
	}

	.checkbox {
		display: flex;
		align-items: center;
		gap: 8px;
		cursor: pointer;
		font-weight: 500;
		white-space: nowrap;
	}

	.checkbox input[type="radio"] {
		display: none; /* デフォルトのラジオボタンを非表示 */
	}
	
	.checkbox span {
		position: relative;
		padding-left: 30px;
		cursor: pointer;
	}

	.checkbox span::before {
		content: "";
		position: absolute;
		left: 0;
		top: 50%;
		transform: translateY(-50%);
		width: 25px;  /* ラジオボタンのサイズ */
		height: 25px; /* ラジオボタンのサイズ */
		border: 2px solid #333;
		border-radius: 50%;
		background-color: #fff;
		display: inline-block;
	}

	.checkbox input[type="radio"]:checked + span::before {
		border-color: #007bff;
		background-color: #fff;
	}

	.checkbox input[type="radio"]:checked + span::after {
		content: "";
		position: absolute;
		left: 6px;
		top: 50%;
		transform: translateY(-50%);
		width: 8px;
		height: 8px;
		background-color: #007bff;
		border-radius: 50%;
	}
	
	.form-area div:last-child dd {
		margin: 0 0 1.83vw 0;
		padding: 0;
		font-size: 16px;
		font-weight: 500;
	}
	
	
	.bt-area {
		display: block;
		text-align: center;
	}
	
}

/* Small than tablet */
@media (min-width: 768px) {
	
	
	
}


/* Larger than tablet */
@media (min-width: 992px) {
	
	.form-area {
		margin: 0 auto;
		padding: 0 0 3.66vw 5%;
		display: -webkit-flex;
		display: flex;
		-webkit-justify-content: space-between;
		justify-content: space-between;
		max-width: 73.2vw;
	}
	
	.form-area div:first-child {
		margin: 0;
		padding: 0;
		width: 30%;
		box-sizing: border-box;
	}
	
	.form-area div:first-child dl {
		margin: 0;
		padding: 0;
	}
	
	.form-area div:first-child dt {
		margin: 0;
		padding: 1.10vw 0;
		font-size: 1.46vw;
		font-weight: 600;
		color: #5D5D5D;
	}
	
	.form-area div:first-child dt span {
		margin: 0 1.46vw 0 0;
		padding: 0;
		font-size: 1.46vw;
		font-weight: 600;
		font-style: italic;
		font-family: "Exo 2", serif;
	}
	
	.form-area div:first-child dt.now {
		color: #2AB4FF;
	}
	
	.form-area div:last-child {
		margin: 0;
		padding: 0;
		width: 65%;
	}
	
	.form-area div:last-child dt {
		margin: 0;
		padding: 0;
		font-size: 1.17vw;
		font-weight: 500;
	}
	
	.form-area div:last-child dt span {
		margin: 0 0 0 1.10vw;
		padding: 0 0.15vw;
		font-size: 0.95vw;
		font-weight: 600;
		background: #2AB4FF;
	}
	
	.form-area div:last-child dd {
		margin: 0 0 1.83vw 0;
		padding: 0;
		font-size: 1.245vw;
		font-weight: 500;
	}
	
	
	
	.bt-area {
		display: block;
		text-align: center;
	}

}


/*--------------------------------------------------------------
.privacy-area
--------------------------------------------------------------*/

/* mobile */
@media (min-width: 300px) {
	
	.privacy-area {
		margin: 0 auto;
		padding: 0;
		max-width: auto;
	}
	
	.privacy-area h4 {
		padding: 0 3% 20px 3%;
		font-size: 20px;
		font-weight: 600;
	}
	
	.privacy-area h4 i {
		margin: 0;
		padding: 5px 0 0 0;
		font-size: 15px;
		font-weight: 600;
		font-style: italic;
		display: block;
		font-family: "Exo 2", serif;
		line-height: 1;
	}
	
	.privacy {
		background: #383838;
		margin: 0 0 50px 0;
		padding: 0 10% 70px 10%;
		height: 150px;
		overflow: auto;
	}
	
	.privacy h5 {
		margin: 0;
		padding: 20px 0 20px 0;
		font-size: 18px;
		font-weight: 600;
	}
	
	.privacy ol {
		margin: 0;
		padding: 0;
	}
	
	.privacy-area ol li {
		margin: 0 0 0 1.5em;
		padding: 0;
	}
	
	.complate span.title {
		padding-bottom: 15px;
		font-size: 20px;
		font-weight: 600;
		display: block;
	}
	
	.complate span.pc_on {
		display: none;
	}
	
	.complate span.sp_on {
		display: inline-block;
	}
}

/* Small than tablet */
@media (min-width: 768px) {
	
	
	
}


/* Larger than tablet */
@media (min-width: 992px) {
	
	.privacy-area {
		margin: 0 auto;
		padding: 0 0 0 5%;
		max-width: 76.86vw;
	}
	
	.privacy-area h4 {
		padding: 0 3% 1.46vw 3%;
		font-size: 2.93vw;
		font-weight: 600;
	}
	
	.privacy-area h4 i {
		margin: 0;
		padding: 0.73vw 0 0 0;
		font-size: 1.46vw;
		font-weight: 600;
		font-style: italic;
		display: block;
		font-family: "Exo 2", serif;
		line-height: 1;
	}
	
	.privacy {
		background: #383838;
		margin: 0 0 3.66vw 0;
		padding: 0 10% 5.12vw 10%;
		height: 21.96vw;
		overflow: auto;
	}
	
	.privacy h5 {
		margin: 0;
		padding: 3.66vw 0 1.46vw 0;
		font-size: 1.46vw;
		font-weight: 600;
	}
	
	.privacy ol {
		margin: 0;
		padding: 0;
	}
	
	.privacy-area ol li {
		margin: 0 0 0 1.5em;
		padding: 0;
	}
	
	.complate span.title {
		padding-bottom: 1.10vw;
		font-size: 1.46vw;
		font-weight: 600;
		display: block;
	}

	.complate span.pc_on {
		display: inline-block;
	}
	
	.complate span.sp_on {
		display: none;
	}

	
}


/*--------------------------------------------------------------
input
--------------------------------------------------------------*/

/* mobile */
@media (min-width: 300px) {
	
	input[type=text],
	input[type=email]{
		width: 100%;
		height: 60px;
		margin-top: 10px;
		padding: 30px 20px;
		-moz-box-sizing: border-box;
		box-sizing: border-box;
		font-size: 14px;
		background: #fff;
		border-radius: 10px;
		font-weight: 500;
		border: 1px solid #D0D0D0;
		color: #000;
	}
	
	textarea {
		width: 100%;
		height: 180px;
		margin-top: 10px;
		padding: 1em 20px;
		font-size: 14px;
		font-weight: 500;
		-moz-box-sizing: border-box;
		box-sizing: border-box;
		background: #fff;
		border-radius: 10px;
		border: 1px solid #D0D0D0;
		color: #000;
	}
	
	input[type="radio"] {
		width: 25px;
		height: 25px;
		border-radius: 100px;
		vertical-align: -5px;
		transform:scale(1.5);
	}
	
	
	textarea:focus,
	input[type=text]:focus,
	input[type=email]:focus{
		background-color: rgba(241,252,255,1.00);
	}
	
	
	label.error,
	#system_subject_error {
		display: block;
		margin-top: 1em;
		color: rgba(249,95,128,1.00);
		font-size: 14px;
		font-weight: 500;
	}
	
	

}

/* Small than tablet */
@media (min-width: 768px) {
	
	
	
}


/* Larger than tablet */
@media (min-width: 992px) {
	
	input[type=text],
	input[type=email]{
		width: 100%;
		height: 5vw;
		margin-top: 0.83vw;
		padding: 2.5vw 1.66vw;
		-moz-box-sizing: border-box;
		box-sizing: border-box;
		font-size: 1.02vw;
		background: #fff;
		border-radius: 0.83vw;
		font-weight: 500;
		border: 0.08vw solid #D0D0D0;
		color: #000;
	}
	
	textarea {
		width: 100%;
		height: 15vw;
		margin-top: 0.83vw;
		padding: 1em 1.66vw;
		font-size: 1.02vw;
		font-weight: 500;
		-moz-box-sizing: border-box;
		box-sizing: border-box;
		background: #fff;
		border-radius: 0.83vw;
		border: 0.08vw solid #D0D0D0;
		color: #000;
	}
	
	input[type="radio"] {
		width: 1.83vw;
		height: 1.83vw;
		border-radius: 8.33vw;
		vertical-align: -5px;
		transform:scale(1.5);
	}
	
	
	label.error,
	#system_subject_error {
		display: block;
		margin-top: 1em;
		font-size: 1.02vw;
		font-weight: 500;
	}
	
}


/*--------------------------------------------------------------
.submit-btn
--------------------------------------------------------------*/

/* mobile */
@media (min-width: 300px) {
	
	
	.form_btn {
		text-align: center;
	}
	
	#submit-btn {
		background-color: transparent;
		margin: 0 5px;
		padding: 15px 0;
		font-size: 15px;
		font-weight: 600;
		text-align: center;
		outline: none;
		cursor: pointer;
		appearance: none;
		color: #FFF;
		background: #2AB4FF;
		border-radius: 10px;
		transition: 0.5s;
		width: 250px;
	}
	
	#back-btn {
		background-color: transparent;
		margin: 10px 5px 0 5px;
		padding: 15px 0;
		font-size: 15px;
		font-weight: 600;
		text-align: center;
		outline: none;
		cursor: pointer;
		appearance: none;
		color: #FFF;
		background: #CFCFCF;
		border-radius: 10px;
		transition: 0.5s;
		display: inline-block;
		width: 250px;
	}
	
	#submit-btn:hover{
		background: #169AE2;
	}
	
	#back-btn:hover{
		background: #A1A0A0;
	}
	
}

/* Small than tablet */
@media (min-width: 768px) {
	
	
	
	
	
	
}


/* Larger than tablet */
@media (min-width: 992px) {
	
	.form_btn {
		text-align: center;
	}
	
	#submit-btn {
		background-color: transparent;
		margin: 0 0.37vw;
		padding: 1.10vw 0;
		font-size: 1.10vw;
		font-weight: 600;
		text-align: center;
		outline: none;
		cursor: pointer;
		appearance: none;
		color: #FFF;
		background: #2AB4FF;
		border-radius: 0.73vw;
		transition: 0.5s;
		width: 18.3vw;
	}
	
	#back-btn {
		background-color: transparent;
		margin: 0 0.37vw;
		padding: 1.10vw 0;
		font-size: 1.10vw;
		font-weight: 600;
		text-align: center;
		outline: none;
		cursor: pointer;
		appearance: none;
		color: #FFF;
		background: #CFCFCF;
		border-radius: 0.73vw;
		transition: 0.5s;
		display: inline-block;
		width: 18.3vw;
	}
	
	#submit-btn:hover{
		background: #169AE2;
	}
	
	#back-btn:hover{
		background: #A1A0A0;
	}
	
}


/*--------------------------------------------------------------
.preview-list
--------------------------------------------------------------*/

/* mobile */
@media (min-width: 300px) {
	
	.preview-list {
		border-bottom: 1px solid #656565;
		margin-bottom: 20px;
	}
	
	.preview-list dt {
		line-height: 2;
	}
	
}

/* Small than tablet */
@media (min-width: 768px) {
	
	
	
}


/* Larger than tablet */
@media (min-width: 992px) {
	
	
	
}