body{
font-family: kozuka-gothic-pr6n,sans-serif;
font-weight: 500;
font-style: normal;
}
.wrap{
  max-width: 930px;
width:100%;
margin: 0 auto;
}
body > section{
  border-top: 2px solid #000;
  
}

input[type="text"],input[type="email"],textarea {
  -webkit-appearance: none;
  line-height: 100px;
}

/*-----------------------
 header
-------------------------*/
header{
background-color: #fff;
width: 100%;
max-height: 85px;

}
header .wrap{
display: flex;
  align-items: center;
justify-content: space-between;
height: 100%;
padding: 15px 30px;
box-sizing: border-box;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
}

header .wrap .logos .logo{
width: auto;
height: auto;
/* margin-right: 15px; */
}

header .wrap .logos .phrase{
max-width:165px;
}

header .wrap .logos a{
font-weight: bold;
display: block;
}
header .wrap .logos h1{
font-size: 1.4rem;
font-weight: bold;
}
.mini{
  margin-top: 8px;
  margin-bottom: 0;
}
.tel span{
  margin-left: 10px;
  font-size: 21.45px;
  height: 100%;
  max-height: 40px;
  height: 100%;
  letter-spacing: 0.1em;
  line-height: 0.9;
}
header .wrap .telmail{
	display:flex;
  flex-direction: column;
	align-items: center;
    font-weight: bold;
}
header .wrap .telmail a.mail{
background-color: #d0002c;
color: #fff;
padding: 1em 3em;
border: 1px solid #d0002c;
border-radius: 1em;
box-shadow:3px 3px 3px rgba(208,0,44,0.5);
margin-left: 1.5em;
}
header .wrap .telmail a.mail:hover{
background-color: #fff;
color:#d0002c; 
}

header .wrap .telmail a.tel{
  max-height: 20px;
  height: 100%;
letter-spacing: 2px;
color: #f46a15;
display: flex;
align-items: center;
cursor: pointer;
}



/*-----------------------
 mv
-------------------------*/

.mv{
  padding: 25px 0 60px;
  box-sizing: border-box;
  -webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
}

.fv_title{
  position: relative;
  width: 100%;
  margin: 0 auto;
}

.fv_title h1{
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50% ,-50%);
  /* font-size: calc(22px + 26 * (50vw - 320px)/1600); */
  font-size: 30px; 
  letter-spacing: 0.1rem;
  text-align: center;
  width: inherit;
  font-weight: 700;
  line-height: 1.5em;
}

.fv_list{
  margin-top: 25px;
  min-width: 160px;
  width: 100%;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
}

.fv_item{
  position: relative;
  max-width: 206px;
  width: 100%;
}

.fv_textbox{
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50% ,-50%);
  width: inherit;
text-align: center;
}

.fv_sub{
  margin-top: 10px;
  font-size: calc(10px + 8 * (100vw - 320px)/1600);
  letter-spacing: 0.01rem;
  font-weight: 700;
}

.fv_textbox h2{
  font-size: calc(18px + 12 * (100vw - 320px)/1600);
  letter-spacing: 0.1rem;
  font-weight: 700;
}

.fv_big{
  margin-top: 22px;
  width: 100%;
}

.fv_btn{
  width: 100%;
  background-color: #f46a15;
  color: #fff;
  font-size: 3.6rem;
  letter-spacing: 0.1rem;
  text-align: center;
  padding: 40px 0;
  border: 2px solid #000;
  font-size: calc(16px + 20 * (100vw - 320px)/1600);

}
.fv_btn a{
  color: #fff;
  font-weight: 700;
}
.fv{
  max-width: 940px;
  margin: 0 auto;
  width: 100%;
}

.fv img{
  width: 100%;
}

/*-----------------------
 chigai
-------------------------*/
section.chigai{
padding: 80px 0 90px;
box-sizing: border-box;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
}

section.chigai ul{
  width: 100%;
  margin: 73px auto 0;
display: flex;
  justify-content:space-between;
height: 330px;
  
}
section.chigai ul li{
max-width: 285.65px;
width: 100%;
text-align: center;
line-height: 2;
font-size: 1.6rem;
border-radius: 10px;
border: 1px solid #070002;
flex-grow: 1;

}
section.chigai ul li .top{
display: flex;
flex-direction: column;
align-items: center;
padding: 25px 0;
box-sizing: border-box;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
border-bottom: #000 solid 1px;
background-color:#fabe00 ;
border-radius: 10px 10px 0 0;
gap: 10px;
height: 50%;
}
section.chigai ul li strong{
  font-size: 3rem;
  letter-spacing: 0.1rem;
  line-height:0.9 ;
}

.bot{
  font-size: 1.4rem;
  letter-spacing: 0.2rem;
  line-height: 1.7;
  display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 50%;
}

section.chigai .under p.txtC{
font-size: 1.6rem;
margin-top: 40px;
letter-spacing: 0.2rem;
line-height: 1.875;
}

section.chigai .under .kyouchou1{
  margin-right: 0.5em;
  color: #000;

}

section.chigai .under .kyouchou2{
  margin-left: 0.5em;
  color: #000;
}

section.chigai .under{
margin-top: 120px;
background-color: #fff;
line-height: 2;
}
section.chigai .under table{
border-collapse:separate;
border-spacing: 15px 5px;
empty-cells:show;
width: 100%;
max-width: 540px;
margin: 0 auto;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
.hukidashi{
margin: 40px auto 0;
max-width: 904px;
}
.hukidashi img{
  width: 100%;
}
.hukidashisp{
  display: none;
}
.hukidashisp img{
  width: 90%;
}
.hukidashisp img:last-of-type{
  width: 50%;
}

/*-----------------------
contact
-------------------------*/
.contact{
margin: 120px auto 0;
max-width: 815px;
border: 2px solid #000;
width: 100%;
padding: 80px 85px 40px 85px;
box-sizing: border-box;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
position: relative;
}
.contact h3{
font-size: 2.4rem;
margin: -125px auto 0;
line-height: .75;
letter-spacing: 0.1rem;
font-weight: 700;
text-align: center;
display: inline-block;
padding: 15px 80px;
box-sizing: border-box;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
border: 2px solid #000;
background-color: #fff;
max-width: 420px;
width: 100%;
position: absolute;
top: 100px;
left: 50%;
transform: translateX(-50%);
}
.form_wrapper{
  font-size: 1.8rem;
}
.hissu{
  padding: 3px 15px;
  box-sizing: border-box;
  -webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
  color: #000;
  background-color: #f3d62a;
  font-size: 1.4rem;
  margin-right: 28px;
}
.form_wrapper dd{
  margin:5px 0 20px;
  margin-left: 4.8em;
}
.form_input{
  max-width: 350px;
  width: 100%;
  padding: 10px 0 8px 10px;
  border: 1px solid #000;
  box-sizing: border-box;
  -webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
  font-size: 1.6rem;
  line-height: default;
  height: 35px;
}
.ninni{
  margin-left: 4.8em;
}
select {
  -moz-appearance: menulist;
  -webkit-appearance: menulist;
}
select::-ms-expand {
  display: block;
}
.form_mini{
  max-width: 190px;
  width: 100%;
  padding: 8px 0 8px 10px;
  box-sizing: border-box;
  -webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
  border: 1px solid #000;
  line-height: default;
  height: 35px;

}
.form_text{
  font-weight: 700;
  font-size: 1.8rem;
  letter-spacing: 0.1rem;
  margin-left: 10px;
}
.submit{
  max-width: 375px;
  width: 100%;
  margin: 50px auto 20px;
  text-align: center;
}
.submit button{
  width: 100%;
  font-size: 2rem;
  letter-spacing: .3rem;
  background-color: #f3d62a;
  border: 2px solid #000;
  padding: 10px 0 15px;
  box-sizing: border-box;
  font-weight: 700;
}
.form_wrapper .txtC{
  font-size: 12px;
  letter-spacing: .1rem;
}
.flexbox{
  display: flex;
  max-width: 895px;
  width: 100%;
  margin-top: 60px;
  justify-content: space-between;
}
.flexleft{
  position: relative;
}
.flextext{
  position: absolute;
  top: 64px;
  left: 50%;
  transform: translateX(-50%);
}
.bar{
  width: 100%;
  white-space: nowrap;
  text-decoration: underline;
  font-size: 1.74rem;
  line-height: 1;
  letter-spacing: 0.05rem;
  text-align: center;
}
.ora{
  margin-top: 20px;
  color: #f46a15;
  font-size: 3rem;
  font-weight: bold;
  letter-spacing: 0.075em;
  white-space: nowrap;
  text-align: center;
}
.flexmini{
  font-size: 1.353rem;
  font-weight: bold;
  line-height: 0.8;
  white-space: nowrap;
  text-align: center;
  margin-top: 22px;
}
.flexright{
  position: relative;
}
.black{
  margin-top: 20px;
  text-align: center;
  font-size: 2.126rem;
  line-height: 0.8;
  letter-spacing: 0.1em;
}
.flexbtn{
  display: block;
  max-width: 195px;
  margin: 15px auto 0;
  text-align: center;
  background-color: #fabe00;
  color: #000;
  font-size: 1.16rem;
  letter-spacing: 0.05em;
  line-height: 0.7;
  padding: 7px 0;
}
.contact_text{
  margin-top: 30px;
  font-size: 1.8rem;
  line-height: 1.7;
  text-decoration: underline;
}
.f-title{
  display: flex;
  align-items: center;
}

/*-----------------------
step
-------------------------*/
.step{
  padding: 80px 0 90px;
  box-sizing: border-box;
  width: 100%;
  background-color:#f4d573;
}

.step .wrap{
  max-width: 984px;
  width:100%;
margin: 0 auto;
}

.step .under{
  width: 100%;
  margin-top: 70px;
  position: relative;
}

.step .under .txtC{
  position: absolute;
  bottom: 8px;
  font-weight: 700;
  display: flex;
  flex-direction: column;
  color: #000;
}

.stepword1{
  gap: 24px;
  left: 0;
  padding-bottom: 1em;
}

.stepword2{
  gap: 24px;
  left: 50%;
  transform: translateX(-50%);
}

.stepword3{
  right: 0;
  gap: 24px;
}

.steptitle{
  font-size: calc(13px + 3 * (100vw - 320px)/1600);
  line-height: 1.5;
  letter-spacing: .1rem;
}

.steptext{
  font-size: calc(10px + 4 * (100vw - 320px)/1600);
  line-height: 1.3;
  letter-spacing: 0.05rem;
}

.step .under img{
  width: 100%;
}

.stepsp{
  display: none;
}

.sp{
  display: none;
}

/*-----------------------
 qanda
-------------------------*/
.qanda{
  padding-top: 65px;
}
section.qanda dl{
width: 100%;
padding:0 10px 70px;
margin:70px auto 0;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
line-height:1.5;
background-image: url(../img/22260851.png);
background-size: auto;
background-repeat: no-repeat;
background-position: right bottom;
}
section.qanda dl dt{
color: #f46a15;
font-size: 1.8rem;
font-weight: bold;
margin-bottom: 10px;
letter-spacing: 0.1em;
text-decoration: underline;
}

section.qanda dd .qa{
  margin-right: 20px;
}
section.qanda dl dd{
  color: #000;
  font-size: 1.6rem;
  font-weight: bold;
  margin-bottom: 45px;
  letter-spacing: 0.1em;
  text-indent: -2.7em;
  padding-left: 2.7em;
}



/*-----------------------
company
-------------------------*/
.company .wrap{
margin-top: 57px;
max-width: 615px;
width: 100%;
}
.comtitle{
  align-items: center;
  justify-content: center;
  display: flex;
  gap: 20px;
  font-size: 3rem;
  letter-spacing: 0.1rem;
}
.combox{
  display: flex;
  flex-direction: row;
  margin-top: 55px;
  gap: 35px;
  font-size: 1.6rem;
  letter-spacing: 0.1rem;
  margin-bottom: 35px;
}
.comtext{
  display: flex;
  align-items: flex-start;
  flex-direction: column;
  gap: 35px;
}
.comtextbot{
  display: flex;
  flex-direction: row;
  gap: 35px;
  font-size: 1.6rem;
  letter-spacing: 0.1rem;
  margin-bottom: 48px;
}

/*-----------------------
 footer
-------------------------*/
footer{
background-color: #f46a15;
padding:55px 0; 
letter-spacing: 0.1rem;
}
footer .wrap{
color: #fff;
text-align: center;
font-size: 1.6rem;

}

/*---------------------------------------------*
* width 900px
*----------------------------------------------*/
@media screen and (max-width:900px) {
  .flexbox{
    flex-direction: column;
    align-items: center;
    gap: 20px;
    margin-top: 20px;
  }

  section.chigai{
    padding: 40px 0;
  }
  .mv{
    padding: 15px 0 20px;
  }
  section.chigai .under{
    margin-top: 40px;
  }
  section.chigai ul{
    margin-top: 40px;
  }
  section.qanda dl{
    background-size: 20%;
  }
  section.chigai ul{
    height: 100%;
    flex-direction: column;
    align-items: center;
    gap: 20px;
  }
  .wrap{
    padding: 0 1vw;
    -webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
  }

}
/* width 900px end --------------------------------------------*/
/*---------------------------------------------*
* width 785px
*----------------------------------------------*/
@media screen and (max-width:785px) {
  .step .under .txtC{
    position: inherit;
    margin-top: 45px;
  }
  .stepword1{
    gap: 5px;
    padding-bottom: 0;
  }
  .stepword2{
    gap: 5px;
  }
  .stepword3{
    gap: 5px;
  }
  .step{
    padding: 35px 0;
  }
  .steppc{
    display: none;
  }
  .stepsp{
    display: block;
    max-width: 285px;
    max-height: 450px;
    height: 100%;
    width: 100%;
    margin: 0 auto 20px;
  }
  .steptitle{
    font-size: calc(19px + 18 * (100vw - 320px)/1600);
  }
  .steptext{
    font-size: calc(17px + 3 * (100vw - 320px)/1600);
    margin-top:5px;
    font-weight: normal;
  }
  .sp{
    display: block;
  }
}
/* width 785px end --------------------------------------------*/
/*---------------------------------------------*
* width 640px
*----------------------------------------------*/
@media screen and (max-width:640px) {
  .contact{
    padding: 50px 20px 20px;
    margin-top: 50px;
  }
  .contact_text .txtC{
    font-size: 1.6rem;
  }
  h2{
    font-size: 1.9rem;
  }
  section.qanda dl{
    padding: 0 0 20px;
  }
  .mini{
    font-size: 1.2rem;
  }
  header .wrap{
    font-size: 1.4rem;
  }
  .tel span{
    font-size: 1.4rem;
  }
  .combox{
    font-size: 1.4rem;
    gap: 15px;
  }
  .hukidashisp{
    display: flex;
    width: 100%;
    margin: 40px auto 0;
    flex-direction: column;
    gap: 20px;
    align-items: center;
  }
  .hukidashi{
    display: none;
  }

  .comtextbot{
    font-size: 1.4rem;
    gap: 15px;
  }
}
/* width 640px end --------------------------------------------*/
/*---------------------------------------------*
* width 580px
*----------------------------------------------*/
@media screen and (max-width:580px) {
  .step{
    padding: 40px 0;
  }
  section.qanda dl dt{
    font-size: 1.4rem;
  }
  section.qanda dl dd{
    font-size: 1.4rem;
    text-indent: -2em;
    padding-left: 2em;
  }
  .comtitle{
    font-size: 1.9rem;
  }
  header .wrap{
    padding: 5px;
  }
  footer .wrap{
    font-size: 1.2rem;
  }
  .fv_btn{
    padding: 20px 0;
  }
}
/* width 640px end --------------------------------------------*/
/*---------------------------------------------*
* width 480px
*----------------------------------------------*/
@media screen and (max-width:480px) {
  header .wrap .logos .logo{
    width: 20%;
  }
  .phrase{
    width: 50%;
  }
  .contact h3{
    font-size: 1.8rem;
  }
  .hissu{
    margin-right: 10px;
  }
  .ninni{
    margin-left: 0;
  }
  .form_wrapper dd{
    margin-left: 0;
  }
  .mini{
    display: none;
  }
  .tel img{
    display: none;
  }
  section.chigai .under p.txtC{
    font-size: 1.4rem;
  }
}
/* width 480px end --------------------------------------------*/

/*---------------------------------------------*
* width 375px
*----------------------------------------------*/
@media screen and (max-width:375px) {
  .contact h3{
    max-width: 300px;
    padding: 15px 0;
  }
}
