@charset "UTF-8";
@media screen and (max-width: 767px) {
  /*************************** 01. 枠組共通 ***********************/
  /*************************** 02. header（ヘッダー） ***********************/
  .p-header-team {
    height: 60px;
    padding-inline: 2rem;
    background-color: #fff;
  }
  .p-header-team__hamburger {
    display: block;
    width: 32px;
    height: 32px;
    padding-block: 0.5rem;
  }
  .p-header-team__hamburger-line {
    display: block;
    width: 32px;
    height: 1px;
    background-color: #000;
    transition: 0.3s;
    margin-inline: auto;
  }
  .p-header-team__hamburger-line:nth-child(2) {
    margin-top: 1rem;
  }
  .p-header-team__hamburger.is-active span:nth-child(1) {
    position: relative;
    transform: rotate(45deg);
    top: 4px;
  }
  .p-header-team__hamburger.is-active span:nth-child(2) {
    position: relative;
    transform: rotate(-45deg);
    top: -8px;
  }
  .p-header-team__drawer {
    display: none;
    position: fixed;
    top: 60px;
    right: 0;
    background-color: #000;
    width: 100%;
    z-index: 1;
  }
  .p-header-team__drawer.is-active {
    display: block;
  }
  .p-header-team__nav {
    flex-direction: column;
    gap: 4rem;
    padding: 3rem 1rem;
  }
  .p-header-team__nav-btns {
    flex-direction: column;
    gap: 2rem;
    width: 100%;
  }
  .p-header-team__nav-list {
    flex-direction: column;
    text-align: center;
    gap: 3.2rem;
  }
  .p-header-team__nav-item a {
    color: #fff;
  }
  .p-header-team__nav-btn--contact {
    width: 100%;
    height: 7rem;
  }
  .p-header-team__nav-btn--line {
    width: 100%;
    height: 7rem;
  }
  /*************************** 03. 共通パーツ ***********************/
  .c-btn {
    padding: 1.2rem;
  }
  .p-cta {
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
  }
  .p-cta__inner {
    max-width: 100%;
    padding-left: 0;
    padding-right: 0;
  }
  .p-cta__btn {
    position: absolute;
    bottom: 3rem;
    left: 0;
    text-align: center;
  }
  /* company-page */
  .company-table.is-style-float > .swell-block-dl__dt {
    width: 100%;
    border-bottom: 0;
    padding-left: 1.2rem;
    padding-right: 0;
    padding-top: 2.4rem;
    padding-bottom: 0;
  }
  .company-table.is-style-float > .swell-block-dl__dd {
    width: 100%;
    padding-left: 1.2rem;
    padding-block: 0.8rem 2.4rem;
  }
  /* about page */
  .about-concept {
    padding-inline: 2rem;
  }
  .swell-block-columns .swell-block-column.concept-left {
    padding-inline: 0;
  }
  /*************************** 04. breadcrumb（パンくず） ***********************/
  /*************************** 05. aside（サイドバー） ***********************/
  /*************************** 06. footer（フッター） ***********************/
  .l-footer {
    padding-block: 3.2rem;
  }
  .l-footer::before {
    font-size: clamp(4rem, 10vw, 7rem);
    bottom: 0;
  }
  .p-footer__menu {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 3rem;
    padding-left: 0;
    max-width: 600px;
    margin-inline: auto;
  }
  #custom_html-4 > div > div > p:nth-child(3) {
    font-size: 1.4rem;
  }
}
@media screen and (max-width: 599px) {
  input[type=button],
  input[type=email],
  input[type=submit],
  input[type=text],
  input[type=url],
  input[type=number],
  input[type=tel],
  input[type=password],
  select,
  textarea {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    border-radius: 0;
    padding: 10px;
    width: 100%;
  }
  select {
    border-radius: 0;
    background: #fff url(/wp-content/themes/proximo/assets/images/icons/sort-down-solid.svg) no-repeat right 2px top 20%;
    background-size: 14px;
  }
}
@keyframes menu-barTop {
  0% {
    transform: translateY(7px) rotate(45deg);
  }
  50% {
    transform: translateY(7px) rotate(0);
  }
  100% {
    transform: translateY(0) rotate(0);
  }
}
@keyframes menu-barBottom {
  0% {
    transform: translateY(-7px) rotate(-45deg);
  }
  50% {
    transform: translateY(-7px) rotate(0);
  }
  100% {
    transform: translateY(0) rotate(0);
  }
}
@keyframes active-menu-barTop {
  0% {
    transform: translateY(0) rotate(0);
  }
  50% {
    transform: translateY(7px) rotate(0);
  }
  100% {
    transform: translateY(7px) rotate(45deg);
  }
}
@keyframes active-menu-barBottom {
  0% {
    transform: translateY(0) rotate(0);
  }
  50% {
    transform: translateY(-7px) rotate(0);
  }
  100% {
    transform: translateY(-7px) rotate(-45deg);
  }
}