@media screen and (max-width: 1260px) {
  .first_view h3 {
    font-size: 4.2rem;
    width: 96%;
    margin: auto 2%; }
  .first_view .circle_message li {
    font-size: 5.0rem; }
  .third_view .container {
    width: 90%;
    margin: auto 5%; } }

@media screen and (max-width: 960px) {
  .first_view h3 {
    font-size: 3.8rem; }
  .first_view .circle_message li {
    font-size: 4.2rem; }
  .second_view .col-3, .fourth_view .col-3 {
    width: 44%;
    margin: 1em 3%; }
  .fifth_view .col-twenty {
    width: calc(94% / 3);
    margin: 1em 1%; } }

@media screen and (max-width: 768px) {
  .header h1 {
    height: 55px; }
    .header h1 svg {
      width: 227px;
      height: 55px; }
  .header nav ul.forPC li.phone {
    font-size: 2.4rem; }
  .first_view {
    width: 90%;
    margin: -55vh 5% 0; }
  #contact .col-half {
    width: 94%;
    margin: 1em 3%; }
  #contact ul li {
    margin: 2rem 0 0; } }

@media screen and (max-width: 640px) {
  .header h1 {
    height: 40px; }
    .header h1 svg {
      width: 165px;
      height: 40px; }
  .header nav {
    margin-top: -8px; }
    .header nav ul.forPC li.phone {
      top: 32px; } }

@media screen and (min-width: 569px) {
  .header nav ul.forSP {
    display: none; } }

@media screen and (max-width: 568px) {
  header {
    height: 90vh; }
  .header {
    padding-bottom: 25px; }
    .header h1 {
      width: 58%;
      margin-left: 4%; }
    .header nav {
      width: 38%; }
      .header nav ul.forPC {
        display: none; }
      .header nav ul.forSP {
        display: block; }
        .header nav ul.forSP li {
          display: inline-block;
          font-size: 3.4rem;
          margin: 5px 0 0 .35em; }
          .header nav ul.forSP li a, .header nav ul.forSP li a:visited {
            color: white; }
    .header.fix {
      padding-bottom: 4px; }
      .header.fix nav ul.forSP li {
        margin-top: -5px; }
        .header.fix nav ul.forSP li a, .header.fix nav ul.forSP li a:visited {
          color: white; }
  .first_view {
    margin-top: -60vh; }
  .container, .wide-container, .full-container {
    width: 90%;
    margin-left: auto;
    margin-right: auto;
    padding: 0; } }

@media screen and (max-width: 480px) {
  .first_view h2 {
    font-size: 2.8rem; }
  .first_view h3 {
    font-size: 2.8rem; }
  button.rainbow {
    height: 5rem;
    line-height: 5rem;
    font-size: 1.8rem;
    padding: 0 3rem; }
  .second_view .col-3, .fourth_view .col-3 {
    width: 94%;
    margin: 1em 3%; }
  .fifth_view .col-twenty {
    width: 70%;
    margin: 1em 15% 5em; }
    .fifth_view .col-twenty:last-child {
      margin-bottom: 0; } }

@media screen and (max-width: 400px) {
  .first_view h2 {
    font-size: 2.4rem; }
  .first_view h3 {
    font-size: 2.4rem; }
  .second_view .col-3, .fourth_view .col-3 {
    width: 90%;
    margin: 1em 5%; }
  #contact dl {
    display: block; }
  #contact dt {
    width: 100%;
    text-align: left; }
  #contact dd {
    width: 95%;
    margin-left: 5%; } }

@media screen and (max-width: 375px) {
  header {
    height: 92vh; }
  .header {
    padding: 20px 0 15px; }
  .first_view h2 {
    font-size: 2.2rem; }
  .first_view h3 {
    font-size: 2.2rem; }
  .first_view p {
    bottom: 8vh; } }

@media screen and (max-width: 320px) {
  main h2.title {
    font-size: 2.6rem; }
  .first_view h3 {
    font-size: 2.2rem; }
  .first_view p {
    bottom: 4vh; }
  .third_view .container p {
    font-size: 1.6rem; } }

/*# sourceMappingURL=../../maps/responsive.css.map */