@charset "utf-8";

/*****tablet setting***********************************************************************/
@media screen and (max-width: 999px){
  #business .bs_table:nth-of-type(2) p{ margin: 0 auto; }
}

/*****tablet&mobile setting***********************************************************************/
@media screen and (max-width: 959px){
/***common***/
body{ font-size: 15px; }
article{ padding: 80px 0 100px; }
h1{
  margin: 0;
  font-size: 25px;
  letter-spacing: .05em;
}
h2{ font-size: 45px; }
.subHeading{ margin: 0 0 30px; }
h3{
  font-size: 23px;
  margin: 0 0 30px;
}


/***navigation***/
  nav header{
    display: none;
    width: calc(100% - 70px);
    height: 400px;
    background: #fff;
    transition: 0s;
  }
  nav header > a{
    display: block;
    text-align: center;
  }
  nav header .logo{
    width: 130px;
    margin: 20px auto;
  }
  nav header ul{ margin: 40px auto 0; }
  nav header ul,
  nav header ul li{
    display: block;
    width: 100%;
  }
  nav header ul li a{
    display: block;
    width: 80%;
    height: 80px;
    margin: 0 auto;
    padding: 20px 0 0;
    border-bottom: 1px solid #eee;
    text-align: center;
    font-size: 1.5em;
  }
  nav header ul li:last-child a{ border-bottom: none; }
  nav header ul li span{ color: #5dadc6; }
  nav header ul li:hover span::before{ width: 0; }
  nav #smpbtn{
    display: block;
    position: fixed;
    top: 10px;
    right: 10px;
    width: 60px;
    height: 60px;
    background: #fff;
    box-shadow: 2px 2px 2px rgba(0,0,0,0.2);
    z-index: 9999;
  }
  nav #smpbtn img{
    display: block;
    width: 40px;
    margin: 11px auto 0;
  }


  /***keyVisual***/
  #keyVisual{
    height: 400px;
    padding: 140px 0 0;
  }
  #keyVisual .logo{
    width: 140px;
    margin: 0 auto 30px;
  }
  #keyVisual span{
    margin: 10px 0 0;
    font-size: 13px;
  }


  /***banner***/
  #banner figure{
      min-width: 160px;
      height: 50px;
  }
  #banner figure img{
      max-width: 90%;
  }

  /***about***/
  #about p{ width: 80%; }
  #about p br{ display: none; }


  /***business***/
  #business .bs_table{
    margin: 0 10px;
    font-size: 15px;
  }
  #business .bs_table:first-child{
    margin: 0 10px 50px;
  }
  #business .bs_table p{
    width: 80%;
    margin: 0 auto;
    font-size: 15px;
  }
  #business .bs_balloon{
    width: 300px;
    height: 60px;
    margin: 0 auto;
    padding: 15px 0 0;
    border-radius: 30px;
    font-size: 20px;
  }
  #business .bs_balloon::after{ margin: 12px auto 0; }
  #business .bs_table ul{ margin: 0 0 15px; }
  #business .bs_table ul li{
    text-indent: -37px;
    padding: 0 0 0 37px;
    line-height: 30px;
  }
  #business .bs_table figure{
    width: 150px;
    height: 150px;
    padding: 32px 0 0;
  }
  #business .bs_table figure img{
    width: 95px;
    margin: 0 auto;
  }
  #business .bs_table:nth-of-type(2) ul li::before{ margin: 0 15px 0 7px; }
  #business .bs_table:nth-of-type(2) p{ margin: 0 auto; }


  /***company***/
  #company table{ width: 80%; }
  #company tr th,
  #company tr td{
    display: block;
    width: auto;
    padding: 0;
    text-align: center;
  }
  #company tr th{ margin: 0 0 .5em; }
  #company tr td{ margin: 0 0 2em; }
  #company tr td div{ font-size: 15px; }


  /***inquiries***/
  #inquiries table{ width: 100%; }
  #inquiries tr{
    display: block;
    width: 80%;
    margin: 0 auto 20px;
  }
  #inquiries tr *{ font-size: 15px; }
  #inquiries tr th,
  #inquiries tr td{
    display: block;
    width: auto;
    margin: 0 0 5px;
    text-align: left;
  }
  #inquiries input:not(.inq_send),
  #inquiries textarea{
    width: 100%;
    margin: 0;
  }
  #inquiries textarea{ height: 200px; }
  #inquiries .inq_send{ width: 250px; }

  /***footer***/
  nav #return{
    position: static;
    width: 55px;
    height: 55px;
    margin: 0 auto;
  }
  nav footer{
    height: auto;
    padding: 20px 0 0;
  }
  nav footer > a{
    display: block;
    text-align: center;
  }
  nav footer .logo{
    width: 130px;
    margin: 20px auto;
  }
  nav footer ul,
  nav footer ul li{
    display: block;
    position: static;
    width: 100%;
  }
  nav footer ul li a{
    display: block;
    width: 80%;
    max-width: 240px;
    height: 80px;
    margin: 0 auto;
    padding: 20px 0 0;
    border-bottom: 1px solid #777;
    text-align: center;
    font-size: 1.5em;
  }
  nav footer ul li:last-child a{ border-bottom: none; }
  nav footer ul li span{ color: #5dadc6; }
  nav footer ul li:hover span::before{ width: 0; }
  nav footer small{
    margin: 50px 0 0;
    position: static;
  }
}
@media screen and (min-width: 500px) and (max-width: 959px){
  h1{ font-size: 35px; }
  nav header{ width: 300px; }
}
