@charset "utf-8";
/* CSS Document */

/*Noto+Sans+JP : 標準テキスト*/
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@100..900&family=Zen+Maru+Gothic:wght@500;700&display=swap');

:root{
	--color-orange: #f97400;
	--color-green: #359535;
}

/* ------------------------------------------------------------------------- */
/* base
/* ------------------------------------------------------------------------- */
html{
	font-size: 62.5%;
}

body{
	position: relative;
	line-height: 1.6;
	font-family: "Zen Maru Gothic", sans-serif;
	color: #444;
	font-weight: 500;
	font-size: 1.8rem;
	-webkit-font-smoothing: antialiased;
	-webkit-text-size-adjust: 100%;
}
main{
	max-width: 1000px;
	margin: 0 auto;
	padding: 0 min(3vw, 24px);
}
section{
	max-width: 1920px;
	margin: 0 auto;
	padding-top: 100px;
}

@media (max-width: 768px){
	body{
		line-height: 1.55;
		font-size: 1.6rem;
	}

	section{
		padding-top: 56px;
	}
}

@media (max-width: 499px){
	body{
		line-height: 1.5;
		font-size: 1.3rem;
	}
}

/* ------------------------------------------------------------------------- */
/* 共通
/* ------------------------------------------------------------------------- */
/* 見出し
/* --------------------------------------------------------------- */
.l-h2_wrap{
	width: fit-content;
	margin: 0 auto;
	text-align: center;
}
h2 {
	position: relative;
	font-size: 4.4rem;
	font-weight: bold;
	padding: 0 36px 8px;
	border-bottom: 2px dashed var(--color-green);
}
h2::after{
	content: "";
	display: block;
	position: absolute;
	bottom: -6px;
	left: 0;
	width: 10px;
	height: 10px;
	background-color: var(--color-green);
	border-radius: 100%;
}
@media (max-width: 768px){
	h2{
		font-size: 3.6rem;
		padding: 0 24px 6px;
	}
}
@media (max-width: 499px){
	h2{
		font-size: 2.4rem;
		padding: 0 20px 4px;
	}
	h2::after{
		bottom: -5px;
		width: 8px;
		height: 8px;
	}
}

/* マージン：トップ
/* --------------------------------------------------------------- */
.u-marginTop--64{
	margin-top: 64px !important;
}

.u-marginTop--56{
	margin-top: 56px !important;
}

.u-marginTop--48{
	margin-top: 48px !important;
}

.u-marginTop--40{
	margin-top: 40px !important;
}

.u-marginTop--32{
	margin-top: 32px !important;
}

.u-marginTop--24{
	margin-top: 24px !important;
}

.u-marginTop--16{
	margin-top: 16px !important;
}

.u-marginTop--8{
	margin-top: 8px !important;
}

/* テキスト
/* --------------------------------------------------------------- */
.u-text--center{
	text-align: center !important;
}

.u-text--left{
	text-align: left !important;
}

.u-text--right{
	text-align: right !important;
}

.u-text--orange{
	color: var(--color--orange);
}

.u-text--green{
	color: var(--color-green)
}

.u-font--bold{
	font-weight: bold !important;
}
.u-text--SS{
	font-size: 1.4rem !important;
}
.u-text--S{
	font-size: 1.8rem !important;
	font-weight: bold !important;
}
.u-text--M{
	font-size: 3rem !important;
	font-weight: bold !important;
}
.u-text--L{
	font-size: 4.4rem !important;
	font-weight: bold !important;
}

@media (max-width: 768px){
	.u-text--SS{
		font-size: 1.4rem !important;
	}

	.u-text--S{
		font-size: 1.6rem !important;
		font-weight: bold !important;
	}

	.u-text--M{
		font-size: 2.4rem !important;
		font-weight: bold !important;
	}

	.u-text--L{
		font-size: 3.6rem !important;
		font-weight: bold !important;
	}
}

@media (max-width: 499px){
	.u-text--SS{
		font-size: 1.1rem !important;
		font-weight: bold !important;
	}
	.u-text--S{
		font-size: 1.3rem !important;
		font-weight: bold !important;
	}

	.u-text--M{
		font-size: 2.0rem !important;
		font-weight: bold !important;
	}

	.u-text--L{
		font-size: 2.4rem !important;
		font-weight: bold !important;
	}
}
/* focus
/* --------------------------------------------------------------- */
.u-focus{
    padding: 24px min(3vw, 24px);
    background-color: #EDF4E9;
    border-radius: 5px;
}
.u-underline{
	
}
/* input
/* --------------------------------------------------------------- */
input[type="text"], input[type="tel"], input[type="email"], input[type="number"], input[type="search"], input[type="date"], input[type="datetime-local"], input[type="week"], input[type="time"], input[type="month"],input[type="url"], input[type="password"],textarea,select,iframe{
	width: 100%;
	padding: 8px;
	background-color: #fff;
	border: solid #e2e2e2 2px;
	border-radius: 5px;
	transition: border-color 0.2s;
}
input[type="text"], input[type="tel"], input[type="email"], input[type="number"], input[type="search"], input[type="date"], input[type="datetime-local"], input[type="week"], input[type="time"], input[type="month"],input[type="url"], input[type="password"],select{
	max-width: 300px;
}
@media (hover: hover){
	input[type="text"]:hover:not(:disabled), input[type="tel"]:hover:not(:disabled), input[type="email"]:hover:not(:disabled), input[type="number"]:hover:not(:disabled), input[type="search"]:hover:not(:disabled), input[type="date"]:hover:not(:disabled), 
	input[type="datetime-local"]:hover:not(:disabled), 
	input[type="week"]:hover:not(:disabled),
	input[type="time"]:hover:not(:disabled), input[type="month"]:hover:not(:disabled),
	input[type="url"]:hover:not(:disabled), input[type="password"]:hover:not(:disabled),
	textarea:hover:not(:disabled),
	select:hover:not(:disabled){
		border-color: #ccc;
	}
}
input[type="text"]:disabled, input[type="tel"]:disabled, input[type="email"]:disabled, input[type="number"]:disabled, input[type="search"]:disabled, input[type="date"]:disabled, input[type="datetime-local"]:disabled, input[type="week"]:disabled, input[type="time"]:disabled, input[type="month"]:disabled,input[type="url"]:disabled, input[type="password"]:disabled,
textarea:disabled,
select:disabled{
	color: #aaa;
	background-color: #e2e2e2;
	border: solid #ccc 2px;
	pointer-events: none; 
}
input:disabled::placeholder,
textarea:disabled::placeholder,
select:disabled::placeholder{
	color: #aaa;
}
input::placeholder,
textarea::placeholder{
	color: #ccc;
}

@media (max-width: 768px){
	input[type="text"], input[type="tel"], input[type="email"], input[type="number"], input[type="search"], input[type="date"], input[type="datetime-local"], input[type="week"], input[type="time"], input[type="month"],input[type="url"], input[type="password"],textarea,select,iframe{
		padding: 6px 8px;
	}
}
@media (max-width: 499px){
	input[type="text"], input[type="tel"], input[type="email"], input[type="number"], input[type="search"], input[type="date"], input[type="datetime-local"], input[type="week"], input[type="time"], input[type="month"],input[type="url"], input[type="password"],textarea,select,iframe{
		width: 100%;
	}
}
/* -- textarea：テキストエリア --*/
textarea {
	width: 100%;
	resize: vertical;
}
@media (max-width: 768px){
	textarea {
		max-width: 700px;
	}
}
/* -- select：セレクトボックス --*/
select {
	padding-right: 48px;
	background-image: url("img/icon_arrow_gray_down.png");
    background-repeat: no-repeat;
    background-size: 11px auto;
    background-position: right 12px center;
	cursor: pointer;
}
@media all and (max-width: 768px){
	select{
		min-width: 50px;
	}
}
/* -- checkbox：チェックボックス --*/
input[type="checkbox"] {
	position: relative;
	width: 18px;
	height: 18px;
	margin-right: 6px;
	background-color: #ccc;
	border-radius: 3px;
	vertical-align: -2px;
	cursor: pointer;
}
input[type="checkbox"]:checked{
	background-color: var(--color-green);
}
input[type="checkbox"]:checked:before{
	content: '';
	position: absolute;
	top: 2px;
	left: 6px;
	width: 6px;
	height: 11px;
	transform: rotate(50deg);
	border-right: 2px solid #fff;
	border-bottom: 2px solid #fff;
}
label[class*="checkbox_wrap"]{
	display: flex;
	width: fit-content;
	transition: filter 0.2s;
}

label[class*="checkbox_wrap"] > input{
	min-width: 18px;
	margin-top: 5px;
}
@media (hover: hover){
	label[class*="checkbox_wrap"]:hover:not(:disabled){
		filter: brightness(0.9);
	}
}
@media all and (max-width: 499px){
	input[type="checkbox"] {
        width: 13px;
        height: 13px;
		vertical-align: -1px;
	}
	input[type="checkbox"]:checked:before {
		left: 4px;
		width: 5px;
		height: 8px;
	}
	label[class*="checkbox_wrap"] > input{
		min-width: 13px;
		margin-top: 3px;
	}
}


/* -- file：ファイル --*/
input[type="file"]{
	width: 100%;
	/*padding: 8px 24px;*/
	/*background-color: #ebf8eb;*/
	border-radius: 5px;
	cursor: pointer;
	transition: filter 0.2s;
}
@media (hover: hover){
	input[type="file"]:hover{
		filter: brightness(0.95);
	}
}

input[type="file"]::file-selector-button{
    display: inline;
	padding: 4px 12px;
    color: #fff;
    background-color: var(--color-green);
    border: none;
    text-align: center;
    border-radius: 3px;
    cursor: pointer;
    margin-right: 12px;
	font-family: "Zen Maru Gothic", sans-serif;
}
/* リンク
/* --------------------------------------------------------------- */
a:not([class*="c-button"]){
	transition: opacity 0.2s;
}
a:any-link:not([href=""]):not([class*="c-button"]){
	text-decoration: underline;
}
a:not(:any-link),
a[href=""]{
	pointer-events: none;
}
@media (hover: hover){
	a:any-link:hover:not([class*="c-button"]){
		opacity: 0.6;
	}
}
@media (hover: none){
	a:active:not([class*="c-button"]){
		opacity: 0.6;
	}
}
.c-button{
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	width: fit-content;
	width: 100%;
	max-width: 300px;
	padding: 16px 24px;
	border-radius: 5px;
	color: #fff;
	background-color: var(--color-green);
	font-weight: bold;
	text-align: center;
	vertical-align: middle;
	text-decoration: none;
	transition: filter 0.3s;
}

.c-button.sub{
	color: var(--color-green);
	background-color: #fff;
	border: 2px solid var(--color-green);
}
.c-button.mini{
	min-width: 200px;
	padding: 12px 20px;
	font-size: 1.8rem;
}

.l-buttonWrap{
	display: flex;
	justify-content: center;
	width: 100%;
	gap: 24px;
}

.l-buttonWrap > form{
	display: contents;
}

.c-button:not(:any-link):not([type="submit"]),
.c-button[href=""],
.c-button:disabled{
	background-color: #ccc;
	color: #fff;
	pointer-events: none;
}
@media (hover: hover){
	.c-button:hover:not(:any-link):not([type="submit"]),
	.c-button:hover:not([href=""]),
	.c-button:hover:not(:disabled){
		filter: brightness(0.9);
	}
}
@media (hover: none){
	.c-button:active{
		filter: brightness(0.9);
	}
}
@media (max-width: 768px){
	.c-button{
		width: 50%;
		min-width: inherit;
		padding: 12px 20px;
		font-size: 1.8rem;
	}

	.c-button.mini{
		min-width: 150px;
		font-size: 1.4rem;
		padding: 12px 20px;
	}

	.l-buttonWrap{
		gap: 3vw;
	}
}

@media (max-width: 499px){
	.c-button{
		font-size: 1.4rem;
		padding: 8px 12px;
	}

	.c-button.mini{
		min-width: inherit;
		padding: 12px 20px;
	}
}
/* リスト
------------------------------------------------------- */
/* -- UL：箇条書き --*/
ul{
	margin: 0;
	padding: 0;
	list-style: none;
}

ul > li{
	margin-left: 1.5em;
	list-style: disc;
	text-indent: 0px;
}

ul ul > li{
	list-style: circle;
}

ul ul ul > li{
	list-style: square;
}

/* -- OL：番号付きリスト --  */
ol{
	margin: 0;
	padding: 0;
	list-style: none;
}

ol > li{
	margin-left: 1.5em;
	list-style: decimal;
	text-indent: 0px;
}

/* 要素を真ん中に配置
/* --------------------------------------------------------------- */
.u-center{
	margin: 0 auto;
}

/* PC.SP only
/* --------------------------------------------------------------- */
@media (max-width: 768px){
	.only_pc{
		display: none;
	}
}

@media (min-width: 769px){
	.only_sp{
		display: none;
	}
}
/* ------------------------------------------------------------------------- */
/* form
/* ------------------------------------------------------------------------- */
/* header
/* ------------------------------------------------------------------------- */
#p-form .l-header{
	width: 100%;
	background: url("img/background.jpg") no-repeat center /cover;
}

#p-form .l-header_inner{
	display: flex;
	width: 100%;
	max-width: 1000px;
	margin: 0 auto;
	padding: 36px min(3vw, 24px);
	height: 100%;
	justify-content: center;
	align-items: center;
}
#p-form .l-header_inner > h1{
	color: #fff;
}

@media (max-width: 768px){
	#p-form .l-header{
	}

	#p-form .l-header_inner{
		padding: min(3vw, 24px);
	}
}
/* ------------------------------------------------------------------------- */
/* フォーム内容
/* ------------------------------------------------------------------------- */
.o-formFlow {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    width: 100%;
    margin: 48px auto 0;
	border-radius: 5px;
}
.o-formFlow__item {
    position: relative;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    width: calc(100% / 3 - 4px);
	margin-right: 4px;
	border-radius: 5px;
    padding: 6px 0;
    color: #aaa;
	background-color: #e2e2e2;
}
.o-formFlow__item.current {
    background-color: var(--color-green);
    color: #fff;
}

@media all and (max-width: 812px) {
	.o-contactFlow {
		margin: 48px 0;
	}
	
	.o-contactFlow__item {
		padding-left: 1em;
		line-height: 1.5;
		text-align: center;
		font-size: var(--fs-14);
		font-size: clamp(0.75rem, 0.343rem + 2.03vw, 1.375rem)
	}
}
.o-formTable{
	width: 100%;
}
.o-formTable tr{
	border-bottom: solid #e2e2e2 2px;
}
.o-formTable th{
	width: 250px;
}
.o-formTable th,
.o-formTable td{
	padding: 36px 24px;
	vertical-align: middle;
}
.o-formTable td{
	border-left: solid #e2e2e2 2px;
	border-bottom: solid #e2e2e2 2px;
}
.o-form__input__multi{
	display: flex;
	gap: 10px 24px;
}
.o-form__input__multi > div{
	max-width: 300px;
}
.o-form__input__multi__title{
	display: inline-block;
	margin-right: 10px;
}
.o-form__input__multi input{
	width: 100%
}
.c-formIcon--hissu::before,
.c-formIcon--any::before{
	display: block;
	width: fit-content;
	margin-bottom: 2px;
	color: #fff;
	margin-right: 8px;
	padding: 2px 6px 1px;
	font-size: 1.3rem;
	font-weight: 300; 
	border-radius: 3px;
}
.c-formIcon--hissu::before{
	content: "必須";
	background-color: var(--color-orange);
}
.c-formIcon--any::before{
	content: "任意";
	background-color: #ccc;
}
.o-form--error{
	margin-bottom: 12px;
	color: #FF5B5E;
}

.o-form__agreePolicy{
	padding: 24px min(3vw, 24px);
	background-color: #FDF0E5;
	border-radius: 5px;
}
.o-form__agreePolicy iframe{
	min-height: 300px;
	resize: vertical;
	
}
.o-form__agreePolicy__check{
	width: fit-content;
	padding: 8px 12px;
	margin: 0 auto;
	background-color:  #FDDBBE;
	border-radius: 3px;
	transition: filter 0.2s;
}
@media (hover: hover){	
	.o-form__agreePolicy__check:hover{
		filter: brightness(0.95);
	}
}
@media (hover: none){
	.o-form__agreePolicy__check:active{
		filter: brightness(0.95);
	}
}

@media (max-width: 768px){
	.o-formTable th{
		width: 200px;
	}
	.o-formTable th,
	.o-formTable td{
		padding: 18px;
	}
	.o-form__input__multi{
		flex-direction: column;
	}
}

@media (max-width: 499px){
	.o-formTable th{
		width: 120px;
	}
	.o-formTable th,
	.o-formTable td{
		padding: 12px;
	}
	.c-formIcon--hissu::before,
	.c-formIcon--any::before{
		padding: 1px 6px 1px;
		font-size: 1.1rem;
	}
	.o-form__agreePolicy{
		padding: 24px 12px;
	}
}
/* ------------------------------------------------------------------------- */
/* footer
/* ------------------------------------------------------------------------- */
#p-form .l-footer{
	width: 100%;
	margin-top: 60px;
}

#p-form .l-footer_inner{
	display: flex;
	width: 100%;
	max-width: 1000px;
	margin: 0 auto;
	padding: 24px;
	height: 100%;
	justify-content: center;
	align-items: center;
	color: #ccc;
	font-size: 1.4rem;
}