@media (min-width: 1441px) {
  #what::before {
    width: calc(50% + 216px); }
  #what::after {
    left: calc(50% + 216px); }

  #companyContainer {
    padding: 0 5vw; } }
@media (min-width: 1680px) {
  #memberContainer {
    padding-inline: 15vw; } }
@media (min-width: 2048px) {
  #companyContainer {
    padding: 0 2.5vw; }

  #news .newsList {
    padding-inline: 10vw; } }
@media (max-width: 1280px) {
  .bx-controls-direction {
    display: none; }

  #what::before {
    width: 62%; }
  #what::after {
    left: 62%;
    width: 100px; } }
@media (max-width: 1023px) {
  #header #menuContainer {
    display: none; }

  .drawer-hamburger {
    display: block; }

  #contact #contactContainer {
    padding-inline: 10vw; }

  .contactForm dl {
    padding-inline: 10vw; } }
@media (max-width: 821px) {
  body {
    font-size: 16px; }

  h2 {
    margin-bottom: 2rem; }

  #what {
    background: var(--red);
    padding: 4rem 0; }
    #what::before, #what::after {
      display: none; }
    #what .container .whatContainer {
      flex-wrap: wrap; }
      #what .container .whatContainer #whatList,
      #what .container .whatContainer #whatContact {
        width: 100%; }
      #what .container .whatContainer #whatList {
        row-gap: 1.5rem;
        justify-content: space-between;
        margin-bottom: 3rem;
        padding-inline: 5vw; }
        #what .container .whatContainer #whatList .item {
          display: flex;
          padding: 0;
          text-align: left;
          width: 49%; }
          #what .container .whatContainer #whatList .item .icon {
            margin: 0 1.5rem 0 0; }
      #what .container .whatContainer #whatContact h3 {
        margin-bottom: 2rem; }
      #what .container .whatContainer #whatContact .btn a {
        background: var(--white);
        color: var(--red);
        display: block;
        margin: 0 auto;
        width: 65%; }

  #company {
    padding: 4rem 0; }
    #company #companyContainer {
      padding: 0 5vw;
      flex-wrap: wrap; }
      #company #companyContainer #companyLeft,
      #company #companyContainer #companyRight {
        width: 100%; }
      #company #companyContainer #companyLeft {
        margin-bottom: 3rem; }
        #company #companyContainer #companyLeft .companySubTitle {
          margin-right: 3rem; }

  #office {
    padding: 4rem 0; }

  #member {
    margin-bottom: 4rem; }
    #member #memberContainer {
      padding-inline: 10vw; }

  #news {
    padding: 4rem 0; }
    #news .newsList {
      padding-inline: 5vw; }

  #recruit {
    padding: 4rem 0; }
    #recruit .recruitList {
      padding-inline: 5vw; }
      #recruit .recruitList ul {
        flex-wrap: wrap;
        gap: 1.5rem; }
        #recruit .recruitList ul li {
          width: 100%; }

  #security-policy,
  .security-content {
    padding: 4rem 0; }
    #security-policy .securityContainer,
    .security-content .securityContainer {
      padding-inline: 5vw; }

  #contact {
    padding: 4rem 0; }
    #contact #contactContainer {
      padding-inline: 5vw; }
    #contact form .checkContainer {
      text-align: left; }

  #access {
    padding: 4rem 0; }
    #access .googlemaps {
      padding-bottom: 45%; }

  /* Contact Form */
  .contactFormLogo h1 {
    width: 32%; }

  .contactForm dl {
    padding-inline: 10vw; }
    .contactForm dl dt {
      width: 32%; }
    .contactForm dl dd {
      width: 68%; }

  /* Remodal */
  .remodal-large,
  .remodal-medium {
    width: 85%; }

  .memberModal {
    flex-wrap: wrap; }
    .memberModal .memberModalLeft,
    .memberModal .memberModalRight {
      width: 100%; }

  .tabNone {
    display: none; } }
@media (max-width: 481px) {
  #footer .copy {
    font-size: 85%; }

  #what {
    padding: 3rem 0; }
    #what .container .whatContainer #whatList {
      padding-inline: 0; }
      #what .container .whatContainer #whatList .item {
        align-items: center;
        width: 100%; }
        #what .container .whatContainer #whatList .item p {
          width: calc(100% - 4.5rem); }
    #what .container .whatContainer #whatContact .btn a {
      padding: 0.8em 2em;
      width: 80%; }

  #company {
    padding: 3rem 0; }
    #company #companyContainer {
      padding: 0; }
      #company #companyContainer #companyLeft,
      #company #companyContainer #companyRight {
        flex-wrap: wrap; }
        #company #companyContainer #companyLeft .companySubTitle,
        #company #companyContainer #companyLeft .companyContent,
        #company #companyContainer #companyRight .companySubTitle,
        #company #companyContainer #companyRight .companyContent {
          width: 100%; }
        #company #companyContainer #companyLeft .companySubTitle,
        #company #companyContainer #companyRight .companySubTitle {
          margin-right: 0;
          margin-bottom: 1rem; }
        #company #companyContainer #companyLeft .companyContent,
        #company #companyContainer #companyRight .companyContent {
          border: none;
          padding-left: 0; }

  #office {
    padding: 3rem 0; }

  #member {
    margin-bottom: 3rem; }
    #member #memberContainer {
      gap: 3rem;
      padding: 0; }
      #member #memberContainer #memberLeft,
      #member #memberContainer #memberRight {
        width: 100%; }
      #member #memberContainer #memberCenter {
        padding-top: 0; }

  #news {
    padding: 3rem 0; }
    #news .newsList {
      padding: 0; }
      #news .newsList tr {
        display: flex;
        flex-wrap: wrap;
        padding-block: 1.5rem; }
        #news .newsList tr td {
          padding: 0;
          width: 100%; }
          #news .newsList tr td:first-child {
            margin-bottom: 0.5rem; }

  #recruit {
    padding: 3rem 0; }
    #recruit .recruitList {
      padding: 0; }
      #recruit .recruitList ul {
        gap: 1rem; }

  #security-policy,
  .security-content {
    padding: 3rem 0; }
    #security-policy h3,
    .security-content h3 {
      text-align: center; }
    #security-policy .securityContainer,
    .security-content .securityContainer {
      padding-inline: 0; }
    #security-policy #pMarkContainer,
    .security-content #pMarkContainer {
      margin-top: 3rem; }
      #security-policy #pMarkContainer dl.pMark,
      .security-content #pMarkContainer dl.pMark {
        flex-wrap: wrap; }
        #security-policy #pMarkContainer dl.pMark dt, #security-policy #pMarkContainer dl.pMark dd,
        .security-content #pMarkContainer dl.pMark dt,
        .security-content #pMarkContainer dl.pMark dd {
          width: 100%; }
        #security-policy #pMarkContainer dl.pMark dt,
        .security-content #pMarkContainer dl.pMark dt {
          margin: 0 auto 1.5rem;
          width: 30%; }
    #security-policy .securitySign,
    .security-content .securitySign {
      margin-top: 3rem; }
    #security-policy .myNumberList tr,
    .security-content .myNumberList tr {
      display: flex;
      flex-wrap: wrap; }
    #security-policy .myNumberList th,
    #security-policy .myNumberList td,
    .security-content .myNumberList th,
    .security-content .myNumberList td {
      width: 100%; }

  #contact {
    padding: 3rem 0; }
    #contact #contactContainer {
      padding: 0; }
    #contact form .FirstName,
    #contact form .FamilyName,
    #contact form .CompanyName,
    #contact form .PositionName,
    #contact form .Tel,
    #contact form .Fax {
      width: 100%; }
    #contact form .checkContainer {
      text-align: left; }
    #contact form ul.submitBtnContainer {
      flex-wrap: wrap; }
      #contact form ul.submitBtnContainer li.Submit {
        margin-bottom: 1rem;
        order: 1;
        width: 80%; }
        #contact form ul.submitBtnContainer li.Submit input {
          width: 100%; }
      #contact form ul.submitBtnContainer li.Cancel {
        margin-right: 0;
        order: 2; }
        #contact form ul.submitBtnContainer li.Cancel input {
          border: none;
          padding: 0.5rem 2rem; }
    #contact .securityForm {
      margin-top: 3rem; }

  #access {
    padding: 3rem 0; }
    #access .accessInfo {
      margin-bottom: 2rem; }
      #access .accessInfo dl.address {
        display: block;
        text-align: center; }
        #access .accessInfo dl.address dt {
          margin-bottom: 1rem;
          margin-right: 0; }
    #access .googlemaps {
      padding-bottom: 75%; }
    #access .accessContainer {
      padding-inline: 5vw; }

  /* Contact Form */
  .contactFormLogo h1 {
    width: 50%; }

  .contactForm dl {
    padding-inline: 0;
    width: 100%; }
    .contactForm dl dt, .contactForm dl dd {
      width: 100%; }
    .contactForm dl dt {
      padding-bottom: 0; }
      .contactForm dl dt:last-of-type {
        border-bottom: none; }
    .contactForm dl dd {
      border-top: none; }
  .contactForm ul {
    flex-wrap: wrap; }
    .contactForm ul li.back {
      order: 2; }
      .contactForm ul li.back button {
        border: none;
        padding: 0; }
    .contactForm ul li.send {
      margin-bottom: 1rem;
      order: 1;
      width: 80%; }
      .contactForm ul li.send button {
        width: 100%; }

  /* Remodal */
  .remodal-large,
  .remodal-medium {
    width: 90%; }

  .modalWhat .whatComment {
    text-align: left; }

  .memberModalRight dl {
    display: flex;
    flex-wrap: wrap;
    gap: 0; }
    .memberModalRight dl dt, .memberModalRight dl dd {
      width: 100%; }
    .memberModalRight dl dt {
      margin-bottom: 0.25rem; }
    .memberModalRight dl dd {
      margin-bottom: 1rem; }
      .memberModalRight dl dd:last-child {
        margin-bottom: 0; } }