@charset "UTF-8";
/*!===========================
このcssはSassから生成されていますので、
直接編集しないようご注意ください。
===========================*/
@media (max-width: 767px) {
  html {
    font-size: 2.34375vw;
  }
  table > tbody > tr > th {
    width: 30%;
  }
  /* class
  ============================== */
  .pc {
    display: none;
  }
  .sp {
    display: block;
  }
  img.sp,
span.sp {
    display: inline;
  }
  table.sp {
    display: table;
  }
  .alignleft,
.alignright {
    float: none;
    max-width: 100% !important;
    margin-bottom: 0;
  }
  .alignleft {
    margin-right: 0;
  }
  .alignright {
    margin-left: 0;
  }
  .col:not(table) {
    display: block;
  }
  .col:not(table) > * {
    width: auto !important;
    margin-left: 0 !important;
  }
  .col:not(table) > *:nth-child(n+2) {
    margin-top: 2rem !important;
  }
  .col:not(table) > table {
    width: 100% !important;
  }
  .btn {
    margin: 0 auto;
  }
  .scroll {
    overflow-x: auto;
  }
  .scroll::-webkit-scrollbar {
    height: 5px;
  }
  .scroll::-webkit-scrollbar-track, .scroll::-webkit-scrollbar-thumb {
    border-radius: 5px;
  }
  .scroll::-webkit-scrollbar-track {
    background: #CCCCCC;
  }
  .scroll::-webkit-scrollbar-thumb {
    background: #666666;
  }
  .scroll table {
    white-space: nowrap;
  }
  /* ==================================================
  header
  ================================================== */
  header {
    padding: 2rem 5rem 2rem 2rem;
  }
  header > div {
    display: block;
  }
  #hlogo {
    width: 20rem;
  }
  #gnav-wrap {
    width: 30rem !important;
    padding: 6rem 0;
    background: #006CB8;
    overflow-y: auto;
  }
  .drawer--right .drawer-nav {
    right: -30rem;
  }
  #gnav {
    display: block;
    color: #fff;
    border-bottom: 1px solid rgba(255, 255, 255, 0.2);
  }
  #gnav li {
    writing-mode: horizontal-tb !important;
    margin: 0;
    border-top: 1px solid rgba(255, 255, 255, 0.2);
  }
  #gnav li a {
    display: block;
    padding: 1em 2rem;
  }
  .drawer-hamburger {
    position: absolute;
    width: 2rem;
    margin: 2.4rem 2rem 0 0;
    padding: 0;
  }
  .drawer--right.drawer-open .drawer-hamburger {
    right: 0;
  }
  .drawer-hamburger-icon {
    margin: 0.5rem 0;
  }
  .drawer-hamburger-icon, .drawer-hamburger-icon::before, .drawer-hamburger-icon::after {
    height: 1px;
  }
  .drawer-hamburger-icon::before {
    top: -0.5rem;
  }
  .drawer-hamburger-icon::after {
    top: 0.5rem;
  }
  /* ==================================================
  footer
  ================================================== */
  footer > div:not([id]) {
    display: block;
  }
  footer > div:not([id]) > * {
    width: auto !important;
  }
  footer address {
    text-align: center;
  }
  #flogo img {
    width: 20rem;
  }
  #fnav {
    margin-top: 4rem;
  }
  #fnav ul {
    justify-content: center;
  }
  #fnav ul li:first-child {
    margin-left: 0;
  }
  /* ==================================================
  main
  ================================================== */
  #content {
    margin-top: 0;
  }
  body:not(#top) #content h2 {
    font-size: 2.8rem;
  }
  #pttl {
    padding-top: 4rem;
  }
  #pttl::after {
    height: 20rem;
  }
  #pttl h1,
#pttl .h1 {
    font-size: 2.4rem;
    padding: 2.5rem 5%;
  }
  /* base
  ============================== */
  .base h1,
.base h2,
.base h3,
.base h4,
.base h5,
.base h6 {
    letter-spacing: 0;
  }
  .base h1,
.base h2,
.base h3 {
    font-size: 2.4rem !important;
  }
  /* top
  ============================== */
  #top-kv {
    padding-top: 0;
  }
  #top-kv p {
    top: 5%;
  }
  #top-sec01 {
    text-align: left;
    padding-top: 6rem;
  }
  #top-sec01 h2 {
    top: -4rem;
    padding: 2rem;
  }
  #top-sec02,
#top-sec03,
#top-sec04,
#top-sec05 {
    margin: 0;
    padding: 6rem 2rem;
  }
  #top-sec02 > figure,
#top-sec03 > figure,
#top-sec04 > figure,
#top-sec05 > figure {
    position: static;
  }
  #top-sec02 > div,
#top-sec03 > div,
#top-sec04 > div,
#top-sec05 > div {
    width: auto;
    padding: 2rem 0 0 !important;
  }
  #top-sec02 h2,
#top-sec03 h2,
#top-sec04 h2,
#top-sec05 h2 {
    text-align: center;
    margin-left: 0 !important;
  }
  #top-sec02 .ttl,
#top-sec03 .ttl,
#top-sec04 .ttl,
#top-sec05 .ttl {
    text-align: center;
  }
  #top-sec02 .btn-wrap02,
#top-sec03 .btn-wrap02,
#top-sec04 .btn-wrap02,
#top-sec05 .btn-wrap02 {
    display: flex;
    align-items: center;
    flex-direction: column;
  }
  #top-sec02 .btn-wrap02 li,
#top-sec03 .btn-wrap02 li,
#top-sec04 .btn-wrap02 li,
#top-sec05 .btn-wrap02 li {
    width: 28rem;
    max-width: 100%;
  }
  #top-sec02 .btn-wrap02,
#top-sec05 .btn-wrap02 {
    padding-bottom: 6rem;
  }
  #top-sec03::after,
#top-sec04::after {
    left: 0 !important;
    right: auto !important;
    width: 100%;
  }
  #top-sec05 h2 span {
    color: inherit;
  }
  /* about
  ============================== */
  #about-sec01 .gmap {
    flex-direction: column;
  }
  #about-sec01 .gmap iframe {
    width: 100%;
  }
  /* strength
  ============================== */
  #strength-sec01, #service-sec01 {
    text-align: left;
  }
  #strength-sec01 figure.pt01::after, #service-sec01 figure.pt01::after {
    top: -9rem;
    width: 18rem;
    height: 18rem;
  }
  #strength-sec01 figure.pt02 div, #service-sec01 figure.pt02 div {
    width: 50%;
  }
  /* service
  ============================== */
}
/*# sourceMappingURL=sp.css.map */