html{font-size: 62.5%;}

body {
	font-size:1.6rem;/* 16px */
	line-height: 1.5;
	font-family: "Helvetica Neue",Arial,"Hiragino Kaku Gothic ProN","Hiragino Sans",Meiryo,sans-serif;
}

* {
	margin: 0px;
	padding: 0px;
}

*, *::before, *::after {
  box-sizing: border-box;
}

h1,h2,h3,h4,h5,h6,p,dl {
	font-size: 1.6rem;
	font-weight: normal;
}

ul {list-style: none;}




/* form reset */

input,
button,
select,
textarea {
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	background: transparent;
	border: none;
	border-radius: 0;
	font: inherit;
	outline: none;
}

textarea {resize: vertical;}

input[type='checkbox'],
input[type='radio'] {display: none;}

input[type='submit'],
input[type='button'],
label,
button,
select {cursor: pointer;}

select::-ms-expand {display: none;}


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

.form_item_text{max-width: 400px;}

input[type="text"] {
	height: 2.4em;
	width: 100%;
	padding: 0 16px;
	border-radius: 4px;
	border: none;
	box-shadow: 0 0 0 1px #cae4ff inset;
	appearance: none;
	-webkit-appearance: none;
	-moz-appearance: none;
	background: #f3f9ff;
}

input[type="text"]:focus {
	outline: 0;
	box-shadow: 0 0 0 1px rgb(126, 193, 255) inset;
}

/* radio */

.c_form_radio{
	display: flex;
	flex-direction: column;
	align-items: flex-start;
}

.c_form_radio input {
	position: absolute;
	white-space: nowrap;
	width: 1px;
	height: 1px;
	overflow: hidden;
	border: 0;
	padding: 0;
	clip: rect(0 0 0 0);
	clip-path: inset(50%);
	margin: -1px;
}

.c_form_radio_name {
	cursor: pointer;
	display: inline-flex;
	align-items: center;
}

.c_form_radio_name:before {
	content: "";
	display: inline-block;
	width: 1.2em;
	height: 1.2em;
	border: 1px solid #ccc;
	border-radius: 50%;
	margin-right: 6px;
	flex-shrink: 0;
}

.c_form_radio input:checked + .c_form_radio_name {color: rgb(208, 218, 246);}

.c_form_radio input:checked + .c_form_radio_name:before {
	border: 0.35em solid rgb(208, 218, 246);
}

.c_form_radio input:focus_visible + .c-form_radio_name .c_form-radio_text {
	background: linear-gradient(transparent 90%, rgba(215, 215, 215, 0.3) 90%);
}

/* checkbox */
/* ---------------- */

.c_form_checkbox{
	display: flex;
	justify-content: center;
}

.c_form_checkbox input {
	position: absolute;
	white-space: nowrap;
	width: 1px;
	height: 1px;
	overflow: hidden;
	border: 0;
	padding: 0;
	clip: rect(0 0 0 0);
	clip-path: inset(50%);
	margin: -1px;
}

.c_form_checkbox_name {
	cursor: pointer;
	display: inline-flex;
	align-items: center;
	color: #666;
	position: relative;
}

.c_form_checkbox_name:before {
	content: "";
	display: inline-block;
	width: 1.2em;
	height: 1.2em;
	border: 1px solid #ccc;
	border-radius: 3px;
	margin-right: 6px;
	flex-shrink: 0;
}

.c_form_checkbox input:checked + .c_form_checkbox_name {
	color: rgb(208, 218, 246);
}

.c_form_checkbox input:checked + .c_form_checkbox_name:before {
	border: 1px solid rgb(208, 218, 246);
	background-color: rgb(208, 218, 246);
}

.c_form_checkbox input:checked + .c_form_checkbox_name:after {
	content: "";
	position: absolute;
	border: solid #fff;
	border-width: 0 2px 2px 0;
	left: 0.4em;
	top: 0;
	bottom: 0;
	margin: auto;
	width: 0.4em;
	height: 0.65em;
	transform: translateY(-1px) rotate(45deg);
}

.c_form_checkbox input:focus-visible + .c_form_checkbox_name .c_form_checkbox_text {
	background: linear-gradient(transparent 90%, rgba(215, 215, 215, 0.3) 90%);
}

/* select */
/* ---------------- */

.form_item_select{width: 100%;}

select{color: #888;}


.c_form_select {
	position: relative;
	background: #f3f9ff;
}

.c_form_select:before {
	content: "";
	position: absolute;
	top: 0;
	bottom: 0;
	margin: auto;
	right: 12px;
	width: 8px;
	height: 8px;
	border-top: 2px solid #555;
	border-right: 2px solid #555;
	transform: rotate(135deg);
	pointer-events: none;
}

.c_form_select select {
	height: 2.4em;
	width: 100%;
	padding: 0 8px;
	border-radius: 4px;
	border: none;
	box-shadow: 0 0 0 1px #cae4ff inset;
	appearance: none;
	-webkit-appearance: none;
	-moz-appearance: none;
	cursor: pointer;
}

.c_form_select select::-ms-expand {display: none;}

.c_form_select select:focus {
	outline: 0;
	box-shadow: 0 0 0 1px rgb(126, 193, 255) inset;
}

/* textarea */

.form_item_textarea{height: 300px;}

.c_form_textarea {
	display: block;
	width: 100%;
	height: 200px;
	padding: 4px 16px;
	border-radius: 4px;
	border: none;
	box-shadow: 0 0 0 1px #7ec1ff inset;
	appearance: none;
	-webkit-appearance: none;
	-moz-appearance: none;
	resize: none;
	background: #f3f9ff;
	line-height: 30px;
}

.c_form_textarea:focus {
	outline: 0;
	box-shadow: 0 0 0 2px rgb(208, 218, 246) inset;
}

/* input submit */
/* button */

.form_submit {
	margin: 40px auto 0;
	width: 300px;
}

.c_form_submit_button {
	display: inline-block;
	width: 100%;
	padding: 8px;
	border: none;
	border-radius: 4px;
	background-color: #333;
	color: #fff;
	font-weight: bold;
	appearance: none;
	-webkit-appearance: none;
	-moz-appearance: none;
	cursor: pointer;
	border: 2px solid transparent;
}

.c_form_submit_button:hover {background-color: #000;}

.c-form_submit_button:focus {
	outline: 0;
	background-color: #000;
	border: 2px solid rgb(33, 150, 243);
}


/* file 選択 */

input[type="file"]::file-selector-button {
	width: 100px;
	height: 30px;
	opacity: 0;
	position: relative;
}

input[type="file"]::before{ 
	position: absolute;
	content: "選択";
	width: 100px;
	height: 30px;
	background: #f3f9ff;
	border: 1px solid #7ec1ff;
	font-size: 1.6rem;
	border-radius: 6px;
	text-align: center;
	align-items: center;
	display: grid;
	cursor: pointer;
	color: #555 !important;
}







.confirmation_btn {
	width: 100%;
	background: #f28022 !important;
	color: #fff !important;
	border-radius: 6px;
}









/*追加スタイル*/


.wrapper {
	width: 90%;
	margin: 50px auto;
	max-width: 960px;
}

.slider {
	width: 100%;
	margin: 0 auto;
	padding: 0;

}


.contact_form {
	width: 90%;
	margin: 0 auto;
}
.contact_form dt{
	margin-bottom: 5px;
	padding: 0 0 5px 0;
}
.contact_form dd{margin-bottom: 30px;}

.contact_form dd .half {
	width: 50%;
	display: flex;
	justify-content: center;
	align-items: center;
}

.contact_form dd .half span {
	margin-left: 10px;
	font-size: 1.6rem;
}


.form_item {
	border-bottom: 1px solid #eee;
	padding: 40px 0;
}

.form_item_name {
	display: block;
	font-weight: bold;
}

.form_item_body {
	margin-top: 4px;
}

.error_text {
	margin-top: 4px;
	color: #f33f3f;
}

.error_text_center{
	text-align: center;
}







.arrow_box {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin: 15px 0 0;
	position: relative;
	width: 96%;
	margin: 0 auto 30px;
}

.prev-arrow,
.next-arrow {
	display: block;
	width: 50px;
	height: 50px;
	background: #f3889c;
	color: #fff;
	font-weight: 500;
	border-radius: 50%;
	transition: all .3s ease;
	cursor: pointer;
	position:relative;
}

.prev-arrow {margin-right:0px;}

.prev-arrow,
.next-arrow {
	display:flex;
	justify-content:center;
	align-items:center;
}
.slick-prev.slick-disabled:before,
.slick-next.slick-disabled:before {}



/*ここからループさせないときの指定例*/
.arrow_box .slick-disabled,
.arrow_box .slick-disabled {opacity: 0;}

.arrow_box .slick-disabled:before,
.arrow_box .slick-disabled:before {opacity: 1;}

.arrow_box .slick-disabled:after,
.arrow_box .slick-disabled:after {opacity: 1;}

.submit_area {
	width: 50%;
	margin: 0 auto;
}

.submit_area input[type="submit"] {
	display: block;
	width: 100%;
	margin: 50px auto;
	padding: 10px;
	background: #446cfd;
	color: #fff;
}



.agreement {
	text-align: center;
	color:  #ed4f00;
}



.agreement input[type="checkbox"] {
	position: relative;
	width: 16px;
	height: 16px;
	border: 1px solid #000;
	vertical-align: -5px;
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
}

.agreement input[type="checkbox"]:checked:before {
	position: absolute;
	top: 1px;
	left: 4px;
	transform: rotate(50deg);
	width: 4px;
	height: 8px;
	border-right: 2px solid #000;
	border-bottom: 2px solid #000;
	content: '';
}




.contact_form dt .caution {
	color: #f28022;
	margin-left: 1rem;
	font-size: 1.2rem;
}


@media screen and (min-width:768px) {
/* 画面サイズが768pxからはここを読み込む */

	.contact_form {width: 100%;}

	.contact_form dt {
		width: 50%;
		padding: 0 10px;
		margin-bottom: 10px;
	}

	.contact_form dd {
		width: 100%;
		padding: 0 10px;
		margin-bottom: 50px;
	}

	.contact_form dd .half {
		width: 50%;
		display: flex;
	justify-content: center;
	align-items: center;
	}

	.contact_form dd .half span {
		margin-left: 10px;
		font-size: 1.6rem;
	}

	.arrow_box {
		width: 50%;
		margin: 0 auto 50px;
	}

}

/* datepicer Datepicker */

.ui-datepicker {
	width: 90%;
	padding: .2em .2em 0;
	display: none;
}


.contact_form_explanation {
	width: 98%;
	margin: 0 auto 50px;
	border: 1px solid #ccc;
	padding: 20px 20px 0;
	text-align: center;
}

.contact_form_explanation p {
	text-align: center;
	margin-bottom: 20px;
}

.contact_form_explanation p .caution {color: #f28022;}


@media screen and (min-width:768px) {
/* 画面サイズが768pxからはここを読み込む */

	.contact_form_explanation {
		width: 100%;
		max-width: 960px;
		margin: 0 auto 50px;
		border: 1px solid #ccc;
		padding: 20px 20px 0;
		text-align: center;
	}

}

.form_headline {
	position: relative;
	margin-bottom: 50px;
	padding: 1rem 0.5rem;
	font-weight: 500;
	font-size: 2rem;
	text-align: center;
}

.form_headline:before,
.form_headline:after {
	position: absolute;
	top: 45%;
	width: 17rem;
	border-top: 6px double #f3889c;
	content: '';
}

.form_headline:before {left: 0rem;}

.form_headline:after {right: 0rem;}


@media screen and (max-width:767px) {
/* 画面サイズが767pxまではここを読み込む */

	.form_headline {
		margin-bottom: 30px;
		font-size: 2rem;
	}

	.form_headline:before,
	.form_headline:after {width: 11rem;}

	.form_headline:before {}

	.form_headline:after {}

}

@media screen and (min-width:768px) {
/* 画面サイズが768pxからはここを読み込む */

	.form_headline {
		width: 50%;
		margin: 0 auto 50px;
		position: relative;
		padding: 0 65px;
		text-align: center;
	}

}

@media screen and (min-width:768px) {
/* 画面サイズが768pxからはここを読み込む */

	.img_box {
		width: 100%;
		max-width: 960px;
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
		margin: 0 auto 100px;
	}

	.img_box_inner_left {width: 50%;}

	.img_box_inner_left p {margin-bottom: 30px;}

	.img_box_inner_left .caution {color: #f28022;}

	.img_box_inner_right {
		width: 50%;
		display: flex;
		justify-content: flex-end;
	}

	.img_box_inner_right img {max-width: 500px;}

	.c_form_checkbox {
		width: 100%;
		max-width: 960px;
	}

}

@media screen and (max-width:767px) {
/* 画面サイズが767pxまではここを読み込む */

	.img_box {
		width: 100%;
		margin: 0 auto 50px;
	}

	.img_box_inner_left {}

	.img_box_inner_left p {margin-bottom: 30px;}

	.img_box_inner_left .caution {color: #f28022;}

	.img_box_inner_right {
		display: flex;
		justify-content: center;
		align-items: center;
	}

	.img_box_inner_right img {max-width: 90%;}

	.c_form_checkbox {}

}


.radio-b li {margin-right:0;}

.radio-b input[type="radio"]{
	position: absolute;
	white-space: nowrap;
	border: 0;
	clip: rect(0 0 0 0);
	clip-path: inset(50%);
	overflow: hidden;
	height: 1px;
	width: 1px;
	margin: -1px;
	padding: 0;
}

.radio-b li {margin: 0 0 10px 0;}

.radio-b label{
	position: relative;
	padding-left: 30px;
	cursor: pointer;
}

.radio-b label::before,
.radio-b label::after{
	content: "";
	display: inline-block;
	aspect-ratio: 1 / 1;
	width: 20px;
	border-radius: 50%;
	position: absolute;
	left: 0;
	top: 50%;
	transition: .1s;
}

.radio-b label::before{
	transform: translateY(-50%);
	border: 2px solid #ddd;
}

.radio-b label::after{
	transform: translateY(-50%) scale(0);
	background-color: #c4c4c4;
	border: 2px solid #c4c4c4;
}

.radio-b input[type="radio"]:checked + label::before{border-color: #f2f2f2;}

.radio-b input[type="radio"]:checked + label::after{
	transform: translateY(-50%) scale(0.5);
	opacity: 1;
}

@media (hover: hover){
	.radio-b label:hover::after{
		transform: translateY(-50%) scale(0.5);
		opacity: 0.5;
	}
}

.submit_b {
	width: 100%;
	margin: 0 auto;
	display: flex;
	justify-content: space-between;
}

.submit_btn,
.reset_btn {
	display: block;
	width: 60%;
	background: #2196f3;
	color: #fff;
	border-radius: 6px;
	padding: 10px;
}

.submit_btn{margin: 20px 10px;}

.reset_btn {margin: 0 auto;}

.submit_btn:hover,
.reset_btn_btn:hover {opacity: 0.75;}

@media screen and (min-width:768px) {
/* 画面サイズが768pxからはここを読み込む */
	.radio-b{
		display: flex;
		justify-content: flex-start;
	}

	.radio-b li {margin: 0 20px 0 0;}

	.radio-b li:last-child {margin-right: 0;}

	.submit_btn {width: 100%;}
}


.form_line {
	width: 74%;
	border: none;
	border-top: 1px solid #3395ee;
	margin: 40px auto ;
}

.contact_form .b_none {border: none;}


@media screen and (min-width:768px) {
/* 画面サイズが768pxからはここを読み込む */

	.form_line {
		width: 50%;
		border: none;
		border-top: 1px solid #3395ee;
		margin: 60px auto ;
	}

}

.contact_form dd .w60 {
	width: 60%;
	display: flex;
	justify-content: center;
	align-items: center;
}

.contact_form dd .w70 {
	width: 70%;
	display: flex;
	justify-content: center;
	align-items: center;
}

.contact_form dd .w60 span,
.contact_form dd .w70 span,
.contact_form dd .half span {
	margin-left: 10px;
	font-size: 1.6rem;
}

@media screen and (min-width:768px) {
/* 画面サイズが768pxからはここを読み込む */

	.form_line {
		width: 50%;
		border: none;
		border-top: 1px solid #3395ee;
		margin: 60px auto ;
	}

}


::placeholder{color:#888;}




/* ====================
　datepicker
 ==================== */

.ui-datepicker {
	width: 80% !important;
	margin: 0 auto ;
}

@media screen and (max-width:767px) {
	ui-datepicker-title {width: 100%;}

	.ui-datepicker-month,
	.ui-datepicker-year {width: 20% !important;}
}

@media screen and (min-width:768px) {
/* 画面サイズが768pxからはここを読み込む */
	.ui-datepicker {
		width: 30% !important;
		margin: 0 auto ;
	}
}



.ui-datepicker-month,
.ui-datepicker-year {color: #fff !important;}

.ui-datepicker-year {
	text-align: right !important;
	margin-right: 1rem !important;
}

.ui-datepicker .ui-datepicker-title select {margin-left: 1rem !important;}









/* ====================
　女性スタッフ用登録フォーム
 ==================== */

.slick-item input[type="text"] {
	box-shadow: 0 0 0 1px #ffd9e2 inset;
	background: #fff2f5;
}

.slick-item input[type="text"]:focus {
	box-shadow: 0 0 0 1px rgb(249, 193, 207) inset;
}

.slick-item .c_form_select {
	position: relative;
	background: #fff2f5;
}

.slick-item .c_form_select select:focus {
	box-shadow: 0 0 0 1px rgb(249, 193, 207) inset;
}

.slick-item .c_form_textarea {
	box-shadow: 0 0 0 1px #ffd9e2 inset;
	background: #fff2f5;
}

.slick-item input[type="file"]::before{ 
	background: #fff2f5;
	border: 1px solid #ffd9e2;
}