@charset "utf-8";
@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100..900;1,100..900&family=Noto+Sans+JP:wght@100..900&family=Oswald:wght@700&display=swap');

:root {
--color-01:#f9fbfc;
}

/*==================================================
共通
==================================================*/
html {
user-select: none;
}
body {
background:var(--color-01);
font-family: "Noto Sans JP", sans-serif;
font-optical-sizing: auto;
font-style: normal;
line-height: 1.8em;
text-size-adjust: 100%;
}

img {
display:inline-block;
max-width: 100%;
height: auto;
/*image-rendering: -webkit-optimize-contrast;*/
}
a,a:link,a:visited {
text-decoration: none;
transition: all ease 0.3s;
outline: none;
color:#000;
}
a:hover,a:active {
opacity: 0.8;
}
@media screen and (max-width: 600px) {
    .spNone {
    display: none;
    }
}/* max-width: 600px */
@media screen and (min-width: 601px) {
    .pcNone {
    display: none;
    }
}/* max-width: 600px */

main.wrap {
max-width:800px;
margin:0 auto;
}

header, nav, div, h1, h2, h3, h4, h5, h6, p, ol, ul, li, dl, dt, dd, img, table, tr, td, th, input, textarea, select, a, figure {
box-sizing: border-box;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
-ms-box-sizing: border-box;
list-style: none;
margin: 0px;
padding: 0px;
font-weight: normal;
font-size: 100%;
}



/*==================================================
ヘッダー
==================================================*/
#header {
background:#FFF;
}
#header h1 {
max-width:750px;
margin:0 auto;
padding:10px 90px;
}
#header h1 img {
width:300px;
height:auto;
}

.pageHead {
text-align: center;
padding:40px 1rem;
}
.pageHead h2 {
font-size:2.2rem;
}
.pageHead h3 {
font-size:1.4rem;
margin-top:1.5em;
}



/*==================================================
フォーム
==================================================*/
.form {
background-color: #FFF;
border-radius:10px;
box-shadow:0 0 20px rgba(50,50,50,0.1);
padding:2rem;
margin:0 5%;
}
#FormGroup .formWrap dl {
padding: 1rem 1rem;
}
#FormGroup .formWrap dl:not(:first-child) {
border-top:#EEE solid 1px;
}
#FormGroup dl :is(dt,dd) {
padding-bottom:.5em;
}
#FormGroup dl dt {
font-weight:bold;
font-size:1.4rem;
line-height:1.5em;
}
#FormGroup dl dt i {
font-style: normal;
}
#FormGroup dl dt span {
font-size:70%;
font-weight: bold;
margin-left:0.8em;
line-height: 0;
min-height:1em;
}
#FormGroup dl dt span.req {
color: #B50800;
border: 1px solid #B50800;
padding: 0.8em 0.3rem;
display: inline-block;
position: relative;
top:-2px;
}
@media screen and (min-width: 601px) {

  #FormGroup .formWrap dl {
  padding: 3rem 6rem;
  }
  #FormGroup .formWrap dl:not(:first-child) {
  border-top:#EEE solid 1px;
  }
  #FormGroup dl :is(dt,dd) {
  padding-bottom:.5em;
  }
  #FormGroup dl dt {
  font-weight:bold;
  font-size:1.4rem;
  line-height:1.5em;
  }
  #FormGroup dl dt i {
  font-style: normal;
  }
  #FormGroup dl dt span {
  font-size:70%;
  font-weight: bold;
  margin-left:0.8em;
  line-height: 0;
  min-height:1em;
  }
  #FormGroup dl dt span.req {
  color: #B50800;
  border: 1px solid #B50800;
  padding: 0.8em 0.3rem;
  display: inline-block;
  position: relative;
  top:-2px;
  }
}/* max-width: 600px */


/* 弁特説明 */
#FormGroup dl.bentoku dd .setumei {
margin-top:1rem;
display: none;
}


#FormGroup .submitArea {
padding:2rem 0 4rem;
}
#FormGroup .submitArea .submit {
display:block;
width:80%;
max-width: 600px;
margin:1rem auto 2rem;
border:none;
background: #20b2aa;
border:none;
color: #FFF;
border-radius: 100vw;
padding:10px;
font-weight:bold;
box-shadow: 0 3px 0 rgba(50,50,50,0.1);
transition: all ease 100ms;
position: relative;
top:0;
}
#FormGroup .submitArea .submit:hover,
#FormGroup .submitArea .submit:active {
box-shadow: 0 3px 0 rgba(50,50,50,0);
top:3px;
}
@media screen and (min-width: 601px) {
  #FormGroup .submitArea .submit {
  font-size:120%;
  padding:1em;
  max-width: 60%;
  }
}/* min-width: 601px */


/* 非表示項目 */
.inputHidden {
display:none;
}

/* 入力 */
#FormGroup input[type="text"],
#FormGroup input[type="email"],
#FormGroup input[type="number"],
#FormGroup textarea {
width:100%;
display:block;
padding:1em;
font-size:1.5rem;
border: 1px solid #CECECE;
border-radius: 1rem;
}


/* セレクトボックス */
#FormGroup dl dd select {
appearance: none;
-webkit-appearance: none;
-moz-appearance: none;
display:block;
box-sizing:border-box;
width:100%;
padding: 1em;
font-size:1.4rem;
border-radius: 1rem;
margin-top:1rem;
color:#333;
background: url(../img/form_jiko/icon_arr_btm16.svg) no-repeat right 10px center #DDD;
background-size: 8px auto;
border:1px solid #CECECE;
}
#FormGroup dl dd select.selected {
background-color: #FFF;
}
/* 年月日 */
#FormGroup dl.hinichi dd table {
width:100%;
}
#FormGroup dl.hinichi dd table td {
width:calc(33% - 6px);
padding-right:6px;
}
#FormGroup dl.hinichi dd table td i {
font-style: normal;
display: block;
text-align: center;
font-size:1rem;
line-height:1.2em;
margin-top:0.5em;
}

@media screen and (min-width: 601px) {
  #FormGroup dl dd > select {
  width:100%;
  }
  #FormGroup dl.hinichi dd table td select {
  width:calc(100% - 30px);
  display:inline-block;
  }
  #FormGroup dl.hinichi dd table td i {
  display: inline-block;
  font-size:1.5rem;
  margin:0;
  }
}/* min-width: 601px */


/* チェックボックス */
#FormGroup dl dd input[type="radio"] {
opacity:0;
}
#FormGroup dl dd .mwform-radio-field:not(:first-of-type) {
margin-top:1.2rem;
display: block;
}
#FormGroup dl dd .mwform-radio-field label {
display:block;
background:#666;
box-shadow:0 3px 0 rgba(0,0,0,0.2);
position: relative;
top:-3px;
border-radius: 8px;
color:#FFF;
transition: all 100ms ease;
cursor: pointer;
line-height:1.5em;
padding:1em 0.5em;
font-size:1.6rem;
}
#FormGroup dl dd .mwform-radio-field label:hover,
#FormGroup dl dd .mwform-radio-field label:has(input[type="radio"]:checked) {
background:#00b7ce;
}
#FormGroup dl dd .mwform-radio-field label:has(input[type="radio"]:checked) {
box-shadow:none;
top:0;
}
#FormGroup dl dd .mwform-radio-field label:has(input[type="radio"]:checked) ::before {
content:'➡ ';
}

@media screen and (max-width: 600px) {

	#FormGroup dl dd .mwform-radio-field label  {
		display: flex;
		align-items: center;
		min-height:3em;
	}
}/* SP */




/*==================================================
thanksページ
==================================================*/
.thanks .pageHead p {
margin-top:2rem;
}

.thanks .thanksCon {
background-color: #FFF;
border-radius:10px;
box-shadow:0 0 20px rgba(50,50,50,0.1);
padding:2rem;
margin:0 5%;
}

.thanks .thanksCon a.telBox {
display:block;
text-align: center;
background-color:rgba(40, 100, 173,1);
max-width: 90%;
margin:2rem auto;
color:#FFF;
position: relative;
padding:2rem 1.5rem 2rem;
border-radius:10px;
box-shadow:0 4px 0 rgba(11, 51, 99,1);
}
.thanks .thanksCon a.telBox b,
.thanks .thanksCon a.telBox i {
display:block;
}
.thanks .thanksCon a.telBox b {
font-size:24px;
position: relative;
z-index:;
}
.thanks .thanksCon a.telBox i {
font-style: normal;
font-size:14px;
line-height:1.5em;
}

.thanks .thanksCon .telBox::before {
content:'';
display: block;
width:60px;
height:60px;
background: url(../img/form_jiko/icon_tel.svg) no-repeat center center rgba(40, 100, 173,1);
background-size:30px auto;
border-radius: 100vw;
position: absolute;
left:calc(50% - 30px); top:-30px;
z-index:0;
}

.thanks .thanksCon .txt_box {
border:#666 solid 1px;
margin-top:4rem;
}
.thanks .thanksCon .txt_box h3 {
background:#666;
text-align: center;
color:#FFF;
padding:0.5em;
font-weight:bold;
font-size:0.9em;
}
.thanks .thanksCon .txt_box p {
margin: 1em 1.5em;
font-size:0.8em;
}


/*==================================================
footer
==================================================*/
#footer {
padding:2rem 3%;
}
#footer > ul {
display:flex;
flex-wrap: nowrap;
justify-content:center;
padding:2rem 2%;
}
#footer > ul li {
text-align: center;
font-size:1.3rem;
padding:0 1.5em;
}
#footer .CopyRight {
display: block;
text-align: center;
font-size:1rem;
}
@media screen and (min-width: 601px) {

}/* max-width: 600px */