@charset "utf-8";
/* CSS Document */

.flow{ display:flex; justify-content: center; margin:30px auto}
.flow div:nth-child(1),.flow div:nth-child(4),.flow div:nth-child(7){ background-color:#000; font-size:28px; width:40px; line-height:40px; text-align:center; color:#FFF}
.flow div:nth-child(2),.flow div:nth-child(5),.flow div:nth-child(8){ font-size:16px; line-height:40px; padding:0 0 0 20px; text-align:left}
.flow div:nth-child(3),.flow div:nth-child(6){ width:30px; margin:20px; height:1px; background-color:#000}
.on_b{ background-color:#006B8B !important; color:#FFF}
.on_f{ color:#006B8B !important}

.inquiry{ width:80%; margin:50px auto; border-top:2px solid #000; }
.inquiry ul{list-style:none; display:flex; padding:0; margin:10px 0; border-bottom:1px #000000 solid; padding:10px 0}
.inquiry ul li:nth-child(1){ width:70px; text-align:center; background:#F0F0F0; font-size:12px; line-height:30px; padding:0 10px; height:30px }
.inquiry ul li:nth-child(2){ width:200px; font-size:14px; line-height:30px; padding:0 20px; text-align:left }
.inquiry ul li:nth-child(3){width : calc(100% - 270px) ; text-align:left;}
.inquiry ul li:nth-child(3) input,.inquiry li:nth-child(3) textarea ,.inquiry li:nth-child(3) select{ background:#F0F0F0; border:none; padding:10px; }
.bt{ background-color:#000; color:#FFF; font-size:14px; line-height:40px; height:40px; padding:0 50px; margin:50px auto }
.copy{ font-size:14px; line-height:30px; width:80%; margin:50px auto; }
#com, #comkana,#name,#namekana,#namae3,#mail,#toiawase{ width:100%}


@media only screen and (max-width:768px) {
.inquiry{ width:90%; }
.inquiry ul{flex-flow: row wrap;}
.inquiry ul li:nth-child(1){ width:100px; font-size:16px; }
.inquiry ul li:nth-child(2){font-size:22px; width: calc(100% - 120px); }
.inquiry ul li:nth-child(3){width:100%; margin-top:10px;}
.inquiry ul li:nth-child(3) input,.inquiry li:nth-child(3) textarea ,.inquiry li:nth-child(3) select{ background:#FFF; border:#000 1px solid; padding:10px;font-size:22px; line-height:32px; margin:10px 0 }
.copy{ font-size:20px; line-height:30px; width:90%;}
.flow div:nth-child(1),.flow div:nth-child(4),.flow div:nth-child(7){ font-size:20px; width:30px; line-height:30px; height:30px}
.flow div:nth-child(2),.flow div:nth-child(5),.flow div:nth-child(8){ font-size:14px; line-height:30px; padding:0 0 0 10px}
.flow div:nth-child(3),.flow div:nth-child(6){ width:10px;}
}

@media only screen and (max-width:550px) {
.copy{ font-size:12px; line-height:22px; width:90%; }
.flow div:nth-child(3),.flow div:nth-child(6){ display:none}
.flow div:nth-child(2),.flow div:nth-child(5),.flow div:nth-child(8){ font-size:12px; padding:0 5px}
.inquiry ul li:nth-child(2){font-size:16px; }
.inquiry ul li:nth-child(3) input,.inquiry li:nth-child(3) textarea ,.inquiry li:nth-child(3) select{ padding:5px;font-size:16px; line-height:24px; }

}