@charset "UTF-8";
@media only screen and (min-width: 768px) {
  body {
    font: 17px Georgia, 游明朝, "Yu Mincho", YuMincho, "Hiragino Mincho ProN", HGS明朝E, メイリオ, Meiryo, serif;
    color: #76416a;
    margin: 0 auto; }

  .title {
    font-size: 34px; }

  a {
    text-decoration: none;
    color: #76416a; }

  a:hover {
    opacity: 0.5; }

  a[href^=tel] {
    pointer-events: none; }

  header {
    height: 115px; }
    header img {
      float: left;
      height: 44px;
      padding: 36px 0 0 37px; }
    header ul {
      float: right;
      font-size: 19px;
      padding: 28px 67px 0 0; }
    header li {
      display: inline-block;
      padding-left: 39px; }

  #hero {
    height: 456px;
    background-image: url("../images/hero.jpg"); }
    #hero p {
      font-size: 51px;
      padding-top: 193px;
      padding-left: 44px;
      color: white;
      margin: 0px;
      letter-spacing: 8px;
      text-align: center; }

  #about, #need {
    padding-top: 90px;
    max-width: 1200px;
    margin: 0 auto; }
    #about .image, #need .image {
      float: left;
      padding-left: 12%; }
    #about .contents, #need .contents {
      float: left;
      padding-left: 8%; }
    #about p, #need p {
      padding-top: 17px;
      line-height: 178%; }

  #about {
    height: 684px; }

  #sample {
    max-width: 1200px;
    margin: 0 auto; }
    #sample img {
      width: 25%; }

  #fee {
    height: 255px;
    background-image: url("../images/fee.jpg");
    padding-top: 80px;
    max-width: 1200px;
    margin: 0 auto; }
    #fee .contents {
      padding-left: 13%; }
    #fee p {
      padding-left: 16%;
      font-size: 20px; }

  #need {
    height: 530px; }

  footer {
    height: 595px;
    background-image: url("../images/footer.jpg"); }
    footer #contact {
      font-size: 28px;
      padding: 48px 0 0 83px; }
      footer #contact .tell {
        font-size: 40px;
        padding-top: 8px;
        display: block;
        letter-spacing: 3px; }
    footer .contents {
      padding: 68px 79px 0 0;
      float: right; }
      footer .contents p {
        padding-top: 10px;
        line-height: 177%; }
    footer #copyright {
      font-size: 15px;
      position: relative;
      clear: both;
      text-align: right;
      padding: 64px 32px 0 0; }

  .br-sp1, .br-sp2, .br-sp3 {
    display: none; } }
@media only screen and (max-width: 1085px) {
  #about .image, #need .image {
    padding-left: 10%; }
  #about .contents, #need .contents {
    padding-left: 5%; } }
@media only screen and (max-width: 994px) {
  #about .image, #need .image {
    padding-left: 5%; }
  #about .contents, #need .contents {
    padding-left: 2%; } }
@media only screen and (max-width: 907px) {
  #about .image, #need .image {
    padding-left: 2%; } }
@media only screen and (max-width: 878px) {
  body {
    font: 18px serif;
    color: #76416a;
    margin: 0 auto; }

  .title {
    font-size: 33px; }

  a {
    text-decoration: none;
    color: #76416a; }

  a:hover {
    opacity: 0.5; }

  header {
    height: 170px; }
    header img {
      float: left;
      height: 40px;
      padding: 39px 0 0 37px; }
    header ul {
      float: right;
      font-size: 18px;
      padding: 28px 50px 0 0; }
    header li {
      display: inline-block;
      padding-left: 40px; }

  #hero {
    height: 380px;
    background-image: url("../images/sp/hero.jpg"); }
    #hero p {
      font-size: 40px;
      padding-top: 158px;
      padding-left: 42px;
      color: white;
      margin: 0px;
      letter-spacing: 8px;
      text-align: center; }

  #about, #need {
    display: -webkit-box;
    display: -moz-box;
    display: box;
    -webkit-box-orient: vertical;
    -moz-box-orient: vertical;
    box-orient: vertical;
    padding-top: 0;
    max-width: 750px;
    margin: 0 auto; }
    #about .image, #need .image {
      padding-top: 35px;
      padding-left: 49%;
      -webkit-box-ordinal-group: 2;
      -moz-box-ordinal-group: 2;
      box-ordinal-group: 2;
      float: none;
      margin-top: 0; }
      #about .image img, #need .image img {
        width: 80%; }
    #about .contents, #need .contents {
      padding-top: 70px;
      padding-left: 10%;
      -webkit-box-ordinal-group: 1;
      -moz-box-ordinal-group: 1;
      box-ordinal-group: 1;
      float: none; }
    #about p, #need p {
      padding-top: 17px;
      line-height: 178%; }

  #about {
    height: 1238px; }

  #sample img {
    width: 25%; }

  #fee {
    height: 300px;
    background-image: url("../images/sp/fee.jpg"); }
    #fee .contents {
      padding: 53px 0 0 76px; }
    #fee p {
      padding-left: 13px;
      font-size: 18px; }

  #need {
    height: 974px; }

  footer {
    height: 676px;
    background-image: url("../images/sp/footer.jpg"); }
    footer #contact {
      font-size: 28px;
      padding: 48px 0 0 45px; }
      footer #contact .tell {
        font-size: 38px;
        padding-top: 8px;
        display: block;
        letter-spacing: 2px; }
    footer .contents {
      padding: 109px 49px 0 0;
      float: right; }
      footer .contents p {
        padding-top: 10px;
        line-height: 177%; }
    footer #copyright {
      font-size: 15px;
      position: relative;
      clear: both;
      text-align: right;
      padding: 96px 32px 0 0; } }
@media only screen and (min-width: 683px) and (max-width: 878px) {
  .br-sp2 {
    display: none; } }
@media only screen and (min-width: 605px) and (max-width: 878px) {
  .br-sp3 {
    display: none; } }
@media only screen and (min-width: 565px) and (max-width: 878px) {
  .br-sp1 {
    display: none; } }
@media only screen and (max-width: 605px) {
  footer {
    height: 720px; } }
@media only screen and (max-width: 609px) {
  header li {
    padding-left: 20px; }

  #hero p {
    padding-left: 20px; }

  #about .image img, #need .image img {
    width: 90%; }
  #about .contents, #need .contents {
    padding-left: 5%; } }
@media only screen and (max-width: 565px) {
  header ul {
    padding-right: 40px; } }
@media only screen and (max-width: 520px) {
  header ul {
    padding-right: 30px; }

  #about .image img, #need .image img {
    width: 85%; }

  #fee .contents {
    padding: 63px 0 0 60px; }

  footer {
    height: 544px; }
    footer #contact {
      font-size: 23px;
      padding-top: 50px;
      padding-left: 30px; }
      footer #contact .tell {
        font-size: 30px; }
    footer .contents {
      padding-right: 10px;
      padding-top: 56px;
      font-size: 15px; }
      footer .contents img {
        width: 80%; }
    footer #copyright {
      padding-top: 48px; } }
@media only screen and (max-width: 504px) {
  header ul {
    font-size: 15px; }

  #hero {
    height: 300px; }
    #hero p {
      padding-top: 95px;
      font-size: 34px; }

  #about .contents, #need .contents {
    padding-top: 58px; }
    #about .contents .title, #need .contents .title {
      font-size: 25px; }
  #about p, #need p {
    font-size: 14px; }

  #fee {
    height: 296px; }
    #fee .contents {
      padding-top: 58px; }
      #fee .contents .title {
        font-size: 25px; }
    #fee p {
      font-size: 14px; }

  #about {
    height: 1000px; }

  #need {
    height: 710px; }

  footer {
    height: 475px; }
    footer #contact {
      font-size: 18px;
      padding-top: 29px;
      padding-left: 25px; }
      footer #contact .tell {
        font-size: 23px; }
    footer .contents {
      padding-right: 0px;
      padding-top: 56px;
      font-size: 15px; }
      footer .contents img {
        width: 65%; }
      footer .contents p {
        padding-top: 0px; }
    footer #copyright {
      padding-top: 48px;
      font-size: 12px; } }
@media only screen and (max-width: 425px) {
  header img {
    padding-left: 21px; }
  header ul {
    font-size: 13px; }
  header li {
    padding-left: 12px; }

  #hero {
    height: 280px; }

  #about {
    height: 963px; }

  #fee {
    height: 268px; }
    #fee .contents {
      padding: 42px 0 0 48px; }

  footer {
    height: 426px; }
    footer #contact {
      padding-top: 23px;
      padding-left: 19px; }
    footer .contents {
      font-size: 13px;
      padding-left: 51px; }
      footer .contents img {
        width: 58%; }
    footer #copyright {
      padding-top: 37px; } }

/*# sourceMappingURL=common.css.map */