@charset "UTF-8";
/* CSS Document */

/* --------------------------------------------------- SMARTPHONE */

@media only screen and (max-width : 768px) {

  /* [ base ] */
  * { -webkit-box-sizing: border-box;box-sizing: border-box; }

  #page {
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
  }

  #support * a:hover,
  #support * a:visited {
    text-decoration: none;
  }

  body {
    min-width: initial;
  }

  /* [ header ] */
  #top #Header {
    height: auto;
    border-top-width: 3px;
    border-bottom: 1px solid #ddd;
    box-shadow: none;
  }
  #Header #HeaderInner {
    width: auto;
  }
  #Header #HeaderInner #Logo.single {
    width: 172px;
    margin: 7px 8px 7px 8px;
  }
  #Header #HeaderInner #Logo img {
    width: 172px;
    height: 29px;
  }

  /* [ footer ] */
  .footer, .copyright {
    min-width: initial;
  }
  .footer {
    padding-top: 0;
  }
  .copyright {
    background-color: #005a9e;
    font-size: 100%;
  }
}

/* ---------------------------------------------- SUPPORT(SMARTPHONE) */

@media only screen and (max-width : 768px) {

  /* [ base ] */
  #support {
    padding-top: 20px;
    padding-bottom: 0;
  }
  #support .content {
    width: 100%;
  }

  /* [ visual ] */
  #support .visual {
    margin-bottom: 10px;
  }
  #support .visual .content {
    padding: 15px 10px;
  }
  #support .visual .hgroup {
    float: none;
    padding: 0;
  }
  #support .visual h1 {
    margin-bottom: 5px;
  }
  #support .visual h1 img {
    display: block;
  }
  #support .visual .content h1,
  #support .visual .content p {
    line-height: 1.4;
  }
  #support .visual .image {
    display: none;
  }

  /* [ main content ] */
  #support .main-content,
  #support .aside {
    width: auto;
    float: none;
  }

  #support .aside #concierge-banner-pc {
      display: none;
  }

  #support .aside #concierge-banner-mobile {
      display: inline;
      width: 100%;
  }

  #support .main-content .menu {
    width: auto;
    float: none;
    margin-top: 5px;
  }

  #support .main-content .content {
    width: auto;
    float: none;
  }
  #support .main-content .title h1 {
    margin: 15px 10px 10px;
  }

  /* [ aside ] */
  #support .aside {
    margin: 10px 10px 15px;
  }

  /* [ search ] */
  #support .search {
    padding: 0 10px;
    border: 0;
    margin-bottom: 10px;
  }
  #support .search p {
    float: none;
  }
  #support .search .button button {
    width: 60px;
  }

  /* [ category ] */
  #support .category {
    margin: 0px;
  }
  #support .category section {
    width: auto;
    float: none;
  }
  #support .category section dd ul {
    padding: 0;
  }
  #support .category section li {
    background: transparent;
    margin: 0;
    list-style: none;
  }
  #support .category section li a {
    background: url(../images/icon-list.png) 10px 50% no-repeat;
    line-height: 1.5em;
    display: block;
    padding: 10px 10px 10px 30px;
    border-bottom: 1px solid #C3C3C3;
  }
  #support .category section dd .list {
    height: auto !important;
  }
  #support .category section .link {
    padding: 0;
  }
  #support .category section .link a {
    display: block;
    float: none;
    text-align: right;
    line-height: 45px;
    padding-right: 10px;
  }
  #support #category .ranking {
    margin: 10px 10px 15px;
  }
  #support #category .ranking li a:hover,
  #support #category .ranking li a:active {
    text-decoration: none;
  }

  #support #category .list li {
    padding: 5px 10px;
  }

  /* [ top-inquiry ] */
  #support .top-inquiry {
      margin: 0px;

  }

  #support .top-inquiry section {
      width: auto;
      float: none;
  }

  #support .top-inquiry section fieldset {
      height: auto !important;
  }

  #support .top-inquiry section fieldset ul {
    padding: 0;
    margin-top: -10px;
  }

  #support .top-inquiry section li {
    background: transparent;
    margin: 0;
    padding: 10px;
    list-style: none;
  }

  /* [ detail ] */
  #support #detail section {
    margin-bottom: 5px;
  }

  /* [ list ] */
  #support #list {
    margin-bottom: 10px;
  }
  #support #list li {
    padding: 10px;
  }
  #support .notfound {
    margin-left: 10px;
  }

  /* [ contact ] */
  #support #contact {
    margin: 10px 10px 15px;
  }
  #support #contact .search p {
    margin-left: 0;
  }
  #support #contact .search {
    padding: 0;
  }
  #support #contact .title {
    margin-top: 30px;
    margin-bottom: 10px;
  }
  #support #contact .title h1 {
    margin-bottom: 0px;
    padding-bottom: 0;
    border: 0;
  }
  #support #contact .form {
    margin: 0;
  }
  #support #contact .form dl {
    padding: 10px;
  }
  #support #contact .form dt {
    float: none;
  }
  #support #contact .form footer .button {
    padding: 4px 15px;
  }
  #support #contact .form footer .button.confirmation {
    background-color: #35b2ea;
    border-color: #4198c1;
    border-color: #4198c1 #4198c1 #236e92;
  }
  #support #contact .error {
    padding: 10px;
    margin-bottom: 15px;
  }
  #support #contact .error li {
    font-size: 90%;
  }

  /* 個人情報、生成AIについての同意 */
  #support #contact .consent-line {
      gap: 8px;
      display: flex;
  }
  #support #contact .agreement-wrapper {
      margin-bottom: 14px;
  }
  #support #contact .agreement {
      gap: 8px;
  }
  #support #contact .form footer .button {
      padding: 6px 12px;
      font-size: 10px;
      line-height: 100%;
      font-weight: 600;
  }
  #support #contact .form footer {
      padding: 16px 19.5px;
  }
  /* 個人情報、生成AIについての同意 ここまで */
}