@charset "UTF-8";

/*フォーム*/
input[type="text"],input[type="password"],input[type="file"],textarea,select{
font-family: inherit; font-weight: 450; line-height: 1.4; display: inline-block; outline:none; font-size: 100%; -webkit-appearance: none;
border: none; border-radius: 0.2em; background-color: #fff; padding: 0.5em; margin: 0.3em 0; box-shadow: 0 0 0 1px rgba(0,0,0,0.2) inset,0 0 0 0.3em rgba(0,0,0,0.05) inset;
}
input[type="text"]:focus,input[type="password"]:focus,input[type="file"]:focus,textarea:focus, select:focus{
box-shadow: 0 0 0 1px rgba(61,156,255,1) inset,0 0 0 0.3em rgba(61,156,255,0.2) inset;}

/*ボタン*/
input[type="button"],input[type="submit"],input.button{display: inline-block; line-height: 1.4; text-align: center; font-family: inherit; font-size: 100%; -webkit-appearance: none;}

/*プレイスホルダ*/
::placeholder{font-size: 90%;}
@media screen and (max-width:900px){
::placeholder{font-size: 80%;}
}

/*ラベル*/
label{line-height:1.4; padding:0.1em 0 0.1em 2em; margin: 0.2em 1em 0.2em 0; vertical-align:middle; cursor: pointer; position:relative; display:inline-block;}
/*デフォルトのチェックとラジオを消す*/
label:has(input[type="checkbox"]) input,
label:has(input[type="radio"]) input{display:none;}
/*オリジナルのチェックとラジオを作成*/
label:has(input[type="checkbox"]):before,
label:has(input[type="radio"]):before{ content:""; display:block; width:1.6em; height:1.6em; position:absolute; top:0; left:0; box-shadow: 0 0 0 1px rgba(0,0,0,0.2) inset,0 0 0 0.3em rgba(0,0,0,0.05) inset; background: #fff;}
label:has(input[type="checkbox"]:checked):before,
label:has(input[type="radio"]:checked):before{ box-shadow: 0 0 0 1px rgba(61,156,255,1) inset,0 0 0 0.3em rgba(61,156,255,0.2) inset;}
/*チェックアイコン*/
label:has(input[type="checkbox"]):after,
label:has(input[type="radio"]):after{font-family:"Font Awesome 6 Free"; content:"\f00c"; font-weight:600; display:block; width:1.6em; height:1.6em; line-height:1.6em; position: absolute; top: 0; left: 0; text-align: center; color: rgba(61,156,255,1); opacity: 0;}
/*チェックされたら*/
label:has(input[type="checkbox"]:checked):after,
label:has(input[type="radio"]:checked):after{opacity: 1;}
/*ラジオは...*/
label:has(input[type="radio"]):before{ border-radius:99em;}
label:has(input[type="radio"]:checked):after{content:"\f111";}

/*セレクト*/
select::-ms-expand {display:none;}
select{ -webkit-appearance: none; -moz-appearance: none; appearance: none;
background-image:url(../img/select.png); background-repeat: no-repeat; background-position: right 0.6em center; background-size:0.6em auto; padding-right:1.8em; cursor:pointer;}

/*------------------------------
メールフォーム
------------------------------*/
.mailform .any{display: inline-block; /*font-size: 80%;*/ padding: 0 0.5em; margin: 0 0.5em 0 0; color: #666; background: #fff; /*border:1px solid #ccc;*/ border:none; font-weight: 450; position: relative; top: -0.1em;}
.mailform .must{display: inline-block; /*font-size: 80%;*/ padding: 0 0.5em; margin: 0 0.5em 0 0; color: red; background: #fff; /*border:1px solid #FFB2B2;*/ border:none; font-weight: 450; position: relative; top: -0.1em;}
.mailFormErrorElement {	background: #FFF2F2 !important;}
.mailFormErrorMessage {	color: red; font-size:90%; font-weight: bold;}

table.mailform{margin: 1em auto;}
table.mailform tr{display: flex; flex-direction: column;}
table.mailform tr+tr{}
table.mailform th{padding: 0.5em; padding-bottom: 0; color:#000;}
table.mailform td{padding: 0.5em; padding-top: 0;}

.mailform_buttons{display: flex; align-items: stretch; justify-content: center; gap:1em; margin: 1.5em auto;}
.mailform_buttons .button{font-size: 110% !important; padding: 1em 4em; line-height: 1.2;}
@media screen and (max-width:900px){
.mailform_buttons{flex-direction: column-reverse;}
.mailform_buttons .button{padding: 1em;}
}

/*メールフォームのP*/
table.mailform td p{margin: 0.3em 0; font-size: 90%;}
table.mailform td p:first-child{margin-top: 0;}
table.mailform td p:last-child{margin-bottom: 0;}

/* メールフォームの入力項目 */
table.mailform input[type="text"],
table.mailform select,
table.mailform textarea { width: 100%; }
table.mailform textarea { height:12em; resize: vertical;}

/*お問い合わせ完了*/
#finish{border: 2px solid #33d0b1; background: #EAFFFB; padding: 1.5em 2em 0.5em; margin: 2em auto; overflow: hidden; font-size: 95%;}
#finish h3{ color: #33d0b1; margin-bottom: 0.3em; font-size: 140%; line-height: 1.4; font-weight: bold;}
#finish img{float: left; margin: 0 4% 0 0; display: block; width: 16%;}
@media screen and (max-width:900px){
#finish{padding: 1.5em 1em 0.5em;}
#finish h3{text-align: center;}
#finish img{float:none; margin: auto auto 1.5em; width: 50%; max-width:200px;}
}

/*添付ファイルリスト*/
ul#fileList li{padding: 0.7em 0; border-bottom: 1px solid #ccc;}
ul#fileList li:first-child{padding-top: 0;}
ul#fileList li:last-child{padding-bottom: 0; border-bottom: none;}
ul#fileList li img{width:2em; height:2em; border: 1px solid #ccc; object-fit: contain; margin-right:0.5em;}
ul#fileList input[type="file"]{width: 100%;}

/*プライバシーポリシー*/
.privacy_wrap h2.heading{font-size: 140%;}
@media screen and (max-width:900px){
.privacy_wrap h2.heading{font-size: 130%;}
}