@charset "UTF-8";

/*----------------------------------------------------------------------------
*                                                      パーツレイアウト変更
----------------------------------------------------------------------------*/

select,
input[type="text"],
input[type="number"],
textarea {
    margin: unset;
    font-size: 100%;
    padding: 0.2em 0.5em;
}

input[type="radio"],
input[type="checkbox"] {
    display: none;
}
a{
	cursor: pointer;
	text-decoration: none;
}
a:hover{
	text-decoration: none;
}
.radioParts {
    padding-left: 1.6em;
}
.radioParts {
    display: block;
    width: 100%;
    cursor: pointer;
    position: relative;
    margin-right: 1em;
    padding: 0.2em 0 0.3em 1.6em;
}
.radioParts::before {
    content: "";
    display: block;
    width: 1em;
    height: 1em;
    border: 1px solid #999;
    border-radius: 50%;
    background-color: #FFF;
    position: absolute;
    top: 0.8em;
    left: 0;
    transform: translateY(-50%);
}
.radioInput:checked + .radioParts::after {
    content: "";
    display: block;
    width: 0.7em;
    height: 0.7em;
    background-color: #0f6cbb;
    border-radius: 50%;
    position: absolute;
    top: 0.45em;
    left: 0.25em;
}


.checkboxParts {
    padding: 0.2em 0 0.3em 2.1em;
    display: block;
    width: 100%;
    cursor: pointer;
    position: relative;
}
.checkboxParts::before {
    content: "";
    display: block;
    width: 1em;
    height: 1em;
    border: 1px solid #999;
    border-radius: 25%;
    background-color: #FFF;
    position: absolute;
    top: 1em;
    left: 0.7em;
    transform: translateY(-50%);
}
.checkboxInput:checked + .checkboxParts::after{
  content:"";
  display:block;
  width:0.7em;
  height:0.7em;
  background-color:#0f6cbb;
  border-radius:25%;
  position:absolute;
  top:0.6em;
  left:0.92em;
}






sectionInnerBox .dispBlock{ display: block;}


.sectionInnerBox{  width: 55%; margin: 5em auto 0;}

.sectionInnerBox h4{ font-size: 100%;}

.sectionInnerBox dl{ display: flex; align-items: center;}
.sectionInnerBox dt{ width: 130px;}
.sectionInnerBox dd{ display: flex; width: calc(100% - 130px);}
.sectionInnerBox dd input{ margin-left: 10px;  padding: 3px 5px; width: calc(50% - 10px);}


.sectionInnerBox .clearFlex{ display: block;}
.sectionInnerBox .clearFlex input{ width: calc(100% - 23px);}
.sectionInnerBox .clearFlex p{ margin-left: 10px; font-size: 86%; color: #3b3b3b;}


#errorBox{
	margin: 20px 10px;
    padding: 10px;
    border: double #f25e5e 3px;
}
#errorBox dd{ display: block; margin: auto; width: fit-content;}

.sectionInnerBox .clearFlex .btn{ display: block; margin: auto;}


.sectionInnerBox .dispNone{ display: none;}


@media screen and (max-width: 950px) {

	.sectionInnerBox{ width: 90% !important; margin: 3.5em auto 0;}

	.sectionInnerBox h4{ font-size: 105%;}

	.sectionInnerBox dt{ width: 100px;}
	.sectionInnerBox dd{ width: calc(100% - 100px); font-size: 120%;}

	.sectionInnerBox .clearFlex input{ width: calc(100% - 10px);}

	#errorBox{ margin: 20px 0px;}

	.sectionInnerBox .clearFlex .btn{ font-size: 100%;}

}

@media screen and (max-width: 350px) {

	.sectionInnerBox h4{ font-size: 92%;}
	.sectionInnerBox dt{ width: 110px;}


	.sectionInnerBox .clearFlex p{ font-size: 78%; color: #000;}
}


