body {
    background-color: rgba(250,250,250,1.00);
    }


.wap #works h1 {
    padding-top: calc(40 / 980 * 100%);
    padding-bottom: calc(16 / 980 * 100%);
}

@media (max-width:768px){
    .wap #works h1 {
    padding-top: calc(50 / 750 * 100%);
    padding-bottom: calc(20 / 750 * 100%);
}
    .wap .home02 h1::after {
        border-bottom-width: 0.1em;        
    }

}


#formWrap {
    width: 100%;
    max-width: 980px;
    margin: calc(34 / 1180 * 100%) auto auto;
    font-size: 0.938em;
    line-height: 2;
    font-family: YakuHanJP , 'Noto Sans JP';
    box-sizing: border-box;
    letter-spacing: 0.05em;
    color: rgba(51,51,51,1.00);
}

#formWrap p {
    font-weight: 500;
    text-align: center;
}

#form {
    max-width: calc(800 / 980 * 100%);
    margin: calc(42 / 980 * 100%) auto auto;
    text-align: left;
}
    
table.formTable{
	width:100%;
	margin:0 auto;
	border-collapse:collapse;
}
table.formTable tr{
	margin:0 auto;
	border-collapse:collapse;
    display:flex;
    justify-content:space-between;
    align-items:baseline;
    border-bottom: 1px solid #dddddd;
}
table.formTable tr:nth-of-type(1) {
    border-top: 1px solid #dddddd;
}


table.formTable td,table.formTable th{
	border:0px solid #ccc;
	margin-top: calc(30 / 800 * 100%);
	margin-bottom: calc(30 / 800 * 100%);
    display:flex;
    justify-content:space-between;
    align-items:flex-start;
    box-sizing: border-box;
}
table.formTable td{
	border:0px solid #ccc;
    flex-direction: column;
    margin-right: calc(50 / 800 * 100%);
}


table.formTable th{
	width: calc(192 / 800 * 100%);
    max-width: 192px;
    vertical-align: middle;
    margin-left: calc(30 / 800 * 100%);
    max-height: 109px;
}
table.formTable th.textarea {
    vertical-align:top;
    align-self: flex-start;
    margin-top: calc(41 / 800 * 100%);
}

#formWrap table.formTable th p{
	font-weight:700;
	text-align:left;
    display: inline-block;
}

table.formTable th img{
    display: inline-block;
    margin: auto 0 auto auto;
	text-align:right;
    vertical-align:text-top;
   /* margin-top: calc(0.5em + 41 / 800 * 100%);*/
}
table.formTable td{
    width: calc(478 / 800 * 100%);
    max-width: 478px;
}
table.formTable td input{
    padding: calc(18 / 478 * 100%);
    line-height: 333%;
}
table.formTable td textarea{
    padding: calc(18 / 478 * 100%);
    height: 14.9333em;
}

table.formTable td input,
table.formTable td textarea {
    width: 100%;
    border-radius: 4px;
    border-width: 1px;
    border-color: #dddddd;
    border-style: solid;
    background-color: #ffffff;
    font-family: YakuHanJP , 'Noto Sans JP';
    font-size: 1em;
    line-height: 1;
    box-sizing: border-box;
    -webkit-appearance : none;
}

table.formTable td input:placeholder-shown,
table.formTable td textarea:placeholder-shown {
    color: rgba(187,187,187,1.00); 
}

#formWrap .agree {
    width: 100%;
    font-weight: 700;
    text-align: center; 
}
#formWrap .agree .pspan {
    margin-top: calc(40 / 800 * 100%);
    margin-bottom: 0;
    display: block;
}
#formWrap label .bak2index span
{
    display: block;
    padding: 0.6em 0;
}

#formWrap .bak2index,
#formWrap label .bak2index span
{
    cursor: pointer;
    
}

#formWrap label .bak2index {
    line-height: 1.7;
    color: #FFFFFF;
    font-size: 1.333em
}

#formWrap label:hover .bak2index span {
}
#formWrap .bak2index:hover {
    background-color: rgba(238,238,238,0.00);
    color: rgba(51,51,51,1.00);
}


#formWrap .bak2index {
    width: calc(360 / 800 * 100%);
    max-height: 70px;
    max-width: 360px;
    display: flex;
    align-content: center;
    justify-content: space-around;
    margin: calc(50 / 800 * 100%) auto calc(100 / 800 * 100%) auto
}
.wap .bak2index::after {
    top: calc(50% - 0.5em);
    height: calc(21 / 20 * 1em);
    max-height: 21px;
    right: 5.617%;
    margin-top: -1px;
}


#agree{
    width: 0px;
    height: 0px;
    margin-top: -13px;
    display: block;
    opacity: 0;
}
span+#agree.error {
    width: 0px;
     height: 13px;
    margin-top: -13px;
    display: block;
    opacity: 0;
}
#formWrap .sendh {
    margin-bottom: calc(40 / 980 * 100%);
}

#submitb {
    display: none;
}

input[type="checkbox"]~label.agree a {
    border-bottom: 1px solid rgba(51,51,51,0.75);
    position: relative;
    cursor: pointer;
    letter-spacing: 0;
}


input[type="checkbox"]~label.agree .pspan span{
    position: relative;
    cursor: pointer;
    letter-spacing: 0;
    margin-left: calc(36 / 223 * 25%);
    display: inline-block;
}

input[type="checkbox"]~label.agree .pspan span::before {
    position: absolute;	
    box-sizing: border-box;
    width: calc(26 / 223 * 100%);
    left: calc(36 / 223 * -100%);
    height: 100%;
    content: url('../img/contact/ppOff.svg');
    display: inline-block;
}
input[type="checkbox"]:checked~label.agree .pspan span::before {
    position: absolute;
    box-sizing: border-box;
    width: calc(26 / 223 * 100%);
    left: calc(36 / 223 * -100%);
    height: 100%;
    content: url('../img/contact/ppOn.svg');
}
.formop {opacity: 0.5}


#warning {
		display: none;
	}

  
table.formTable td input.error, 
table.formTable td textarea.error
{
    background-color: rgba(251,232,230,1.00);
}
  
table.formTable td span.error, 
table.formTable td span.error
{
    color: rgba(216,19,24,1.00);
}

#warning{
    height: 3.33em;
    line-height: 3.33;
    vertical-align: middle;
    background-color: rgba(251,232,230,1.00);
    color: rgba(216,19,23,1.00);
    font-size: 1em;
    margin-bottom: calc(30 / 800 * 100%);
}



@media (max-width:768px){
    #formWrap {
    max-width: calc(670 / 750 * 100vw);
    margin: calc(42 / 750 * 100%) auto auto;
    font-size: calc(26 / 750 * 100vw);
    line-height: 1.923;
    letter-spacing: -0.02em;
    text-align: justify;
}
#form {
    max-width: 100%;
    margin: calc(50 / 750 * 100%) auto auto;
}
table.formTable tr {
    display: block;
}
table.formTable th{
    width: auto;
    margin-left: 0px;
    margin-top: calc(40 / 750 * 100vw);
    margin-bottom: calc(40 / 750 * 100vw);
    max-width: calc(670 / 750 * 100vw);
    
}
table.formTable td {
    width: 100%;
    max-width: calc(670 / 750 * 100vw);
    margin-top: 0;
    margin-right: 0;
    margin-bottom: calc(40 / 750 * 100vw);
}
#formWrap table.formTable th p {
    line-height: 1;
}
table.formTable th img {
        margin: auto auto auto calc(14 / 750 * 100vw);
        height: calc(30 / 750 * 100vw);
    }
    table.formTable td input {
     padding-top: calc(43 / 750 * 100vw);
     padding-bottom: calc(43 / 750 * 100vw);
     padding-left: calc(30 / 750 * 100vw);
     padding-right: calc(30 / 750 * 100vw);
  font-size: 16px;
 /* transform: scale(0.8);*/
}
table.formTable td input,
table.formTable td textarea {
    border-width: 2px;
    -webkit-appearance : none;
}
#formWrap .agree p {
    margin-top: calc(60 / 750 * 100vw);
}

input[type="checkbox"]+label.agree .pspan span{
    margin-left: calc(46 / 750 * 100vw);
} 
input[type="checkbox"] + label.agree .pspan span::before {
    content: "";
    width: calc(46 / 750 * 100vw);
    height: calc(46 / 750 * 100vw);
    left: calc(64 / 750 * -100vw);
    background-image: url(../img/contact/ppOff.svg);
    background-position: center center;
    background-repeat: no-repeat;
    background-size: contain;
}
input[type="checkbox"]:checked + label.agree .pspan span::before {
    content: "";
    width: calc(46 / 750 * 100vw);
    height: calc(46 / 750 * 100vw);
    left: calc(64 / 750 * -100vw);
    background-image: url(../img/contact/ppOn.svg);
    background-position: center center;
    background-repeat: no-repeat;
    background-size: contain;
}
    #formWrap .bak2index {
    width: calc(616 / 750 * 100vw);
        max-width: 616px;
        max-height: 120px;
        margin: calc(60 / 750 * 100vw) auto calc(100 / 750 * 100vw) auto;
    }
    .wap .bak2index span {
        font-size: calc(34.22 / 750 * 100vw);
    }
.wap .bak2index::after {
    top: calc(50% - (37 / 308 * 100%));
    height: calc(37 / 750 * 100vw);
}
#formWrap form #warning {
    height: auto;
    line-height: 1.769;
    font-size: calc(26 / 750 * 100vw);
    margin-bottom: calc(40 / 750 * 100vw);
    text-align: left;
    padding-top: calc(32 / 750 * 100vw);
    padding-bottom: calc(32 / 750 * 100vw);
    padding-left: calc(39 / 750 * 100vw);
}
#formWrap .sendh {
    font-size: calc(26 / 750 * 100vw);
    text-align: left;
    margin-bottom: calc(50 / 750 * 100vw);
    letter-spacing: -0.09em;
}
  
#formWrap .agree .pspan {
    margin-top: calc(60 / 750 * 100vw);
}  
    
    
}


.compWap {
    width: 100%;
    max-width: 980px;
    margin: calc(30 / 980 * 100%) auto calc(50 / 980 * 100%);
    font-size: 0.938em;
    text-align: center;
    line-height: 2;
    font-family: YakuHanJP , 'Noto Sans JP';
    box-sizing: border-box;
    letter-spacing: 0.05em;
    color: rgba(51,51,51,1.00);
}
.compWap .tellWap {
    display: flex;
    align-items: center;
    justify-content: center;

}
.compWap .comp {
    font-size: 1.2em;
    font-weight: 400;
    line-height: 1.889;
    margin-bottom: calc(32 / 980 * 100%);
}
.compWap .comp2 {
    font-size: 0.867em;
    font-weight: 500;
    line-height: 2;
    margin-bottom: calc(32 / 980 * 100%);
}
.compWap .tellWap .tellIcon {
    padding-bottom: calc(54 / 980 * 100%);
    padding-left: calc(54 / 980 * 100%);
    background-image: url(../img/contact/telIcon.svg);
    background-position: center center;
    background-size: contain;
    background-clip: border-box;
    background-repeat: no-repeat;
    margin-right: calc(12 / 980 * 100%);
}
.compWap .tellWap img {
    display: none;
}

.compWap .tellWap .tell {
    font-size: 2.133em;
    font-weight: 400;
    line-height: 1;
    text-align: left;
    color:  #000000;
}
.compWap .tellWap p {
    font-size: 0.933em;
    font-weight: 500;
    line-height: 2.857;
    text-align: left;
    color: rgba(51,51,51,1.00);
    margin-top: calc(12 / 980 * 100%);
    
}
.compWap .tellWap .tell a {
    font-size: 100%;
    font-weight: 400;
    line-height: 1;
    text-align: left;
    color:  #000000;
}
@media (max-width:768px){

.compWap {
    width: 100%;
    max-width: calc(670 / 750 * 100vw);
    margin: calc(30 / 750 * 100vw) auto calc(50 / 750 * 100vw);
    font-size: 0.938em;
    text-align: justify;
    line-height: 2;
    font-family: YakuHanJP , 'Noto Sans JP';
    box-sizing: border-box;
    letter-spacing: 0.05em;
    color: rgba(51,51,51,1.00);
    
}

.compWap .comp {
    font-size: calc(32 / 750 * 100vw);
    line-height: 1.875;
    margin-bottom: calc(45 / 750 * 100vw);
}
.compWap .comp2 {
    font-size: calc(22 / 750 * 100vw);
    line-height: 1.818;
    margin-bottom: calc(40 / 750 * 100vw);
}
.compWap .tellWap .tellIcon {
    padding-bottom: calc(80 / 750 * 100vw);
    padding-left: calc(80 / 750 * 100vw);
    margin-right: calc(20 / 750 * 100vw);
}

.compWap .tellWap .tell {
    font-size: calc(50 / 750 * 100vw);
}
.compWap .tellWap p {
    font-size: calc(22 / 750 * 100vw);
    line-height: 1.818;
    margin-top: calc(19 / 750 * 100vw);
    
}
.compWap .tellWap .tell a {
    font-size: 100%;
    font-weight: 400;
    line-height: 1;
    text-align: left;
    color:  #000000;
}
    
}
 @supports (-ms-ime-align: auto) {
    /* Edge */
table.formTable td,table.formTable th{
	border:0px solid #ccc;
	margin-top: calc(30 / 800 * 100%);
	margin-bottom: calc(30 / 800 * 100%);
    padding-top: 2em;
    padding-bottom: 2em;
    display:flex;
    justify-content:space-between;
    align-items:flex-start;
    box-sizing: border-box;
}
table.formTable td input{
    padding: calc(18 / 478 * 100%);
    line-height: 333%;
}
table.formTable td textarea{
    padding: 1em;
    height: 14.9333em;
}
.compWap .tellWap .tellIcon {
    padding-bottom: calc(54 / 980 * 100%);
    padding-left: calc(54 / 980 * 100%);
    background-image: url(../img/contact/telIcon.svg);
    background-position: center right;
    background-size: contain;
    background-clip: border-box;
    background-repeat: no-repeat;
    margin-right: calc(12 / 980 * 100%);
}
.compWap .tellWap img {
    display: inline-block;
    opacity: 0;
}
}