@charset "UTF-8";

/* =========================================================
   Child Responsive Overrides
   目的：親テーマのブレイクポイント設計を上書き
   基準：1024 / 768 / 485
========================================================= */

/* ======================================================================
   [PARENT THEME DEPENDENCY]
   - story_tcd041 固定（親テーマのDOM/クラス構造・既存JS挙動前提）
   - header / global-nav / signage / breadcrumb / content_inner など
====================================================================== */
@media only screen and (min-width: 767px) {
  a[href^='tel:'] {
    pointer-events: none;
  }
}

@media only screen and (max-width: 1200px) {
  .header-bar {
    height: 55px;
    border: none;
    box-shadow: none;
  }

  .logo-image {
    height: 55px;
    left: 15px;
    width: 250px;
  }

  .global-nav-button {
    border: none;
    background-color: var(--color-sub);
    line-height: 55px;
    height: 55px;
    width: 55px;
  }

  .global-nav-button::before {
    color: var(--color-white);
  }

  .global-nav>ul>li>a {
    height: 50px;
    margin: 0 auto !important;
    line-height: 50px !important;
    border-top: 1px solid var(--color-gray);
    font-size: 1em;
  }

  .global-nav>ul>li.global-menu-home>a {
    display: block;
    border: none;
  }

  .global-nav, .header-bar-fixed .global-nav {
    top: 55px;
    max-width: 400px;
    right: 0;
  }

  .global-nav a {
    color: var(--color-text) !important;
  }

  .global-nav>ul>li.global-menu-other>a::after {
    display: none;
  }

  .global-nav>ul>li.global-menu-contact>a {
    border: none;
  }

  .global-nav .menu-item-has-children>a span::before {
    color: var(--color-text);
  }

  .global-nav>ul>li>a:before {
    display: none;
  }

  .global-nav>ul>li.global-menu-contact>a::after {
    position: relative;
    width: auto;
    display: inline-block;
    bottom: 0;
    margin-left: 1em;
  }

  .global-nav .sub-menu a {
    width: 100%;
    font-size: 1em;
  }

  .global-nav .sub-menu {
    left: 0;
  }

  .content02-inner {
    padding: 0;
    width: 84%;
  }

  .inner {
    width: 84%;
  }
}

@media only screen and (max-width: 991px) {
  .top-slider, .header-youtube {
    height: auto;
  }

  .breadcrumb-wrapper .inner, .main>.inner, .footer .inner {
    width: 84%;
    padding: 0;
  }
}

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

  /* content02（既存ブロックに合わせて調整） */
  .content02-content {
    width: 100%;
    margin: 0 auto 2em;
    font-size: 1em;
  }

  .content02-content:last-of-type {
    margin-bottom: 0;
  }

  .content02-inner {
    font-size: 1em;
  }

  .content02-button {
    position: relative;
    bottom: 0;
    width: 100%;
    margin-top: 1em;
  }

  .content02::before {
    height: 70px;
  }

  /* front-third */
  .front-third {
    padding: 70px 0 0;
  }

  .third-box {
    width: 100%;
    margin-bottom: 70px;
  }

  .front-third-text {
    width: 84%;
    margin: 0 auto !important;
    padding: 0 !important;
  }

  .front-third-text-inner {
    max-width: unset;
  }

  .front-third-img {
    width: 92%;
    margin: 2.5em auto 0 0 !important;
  }

  .third-box:nth-of-type(even) .front-third-img {
    margin: 2.5em 0 0 auto !important;
  }

  /* セクション余白 */
  #content01 {
    padding: 70px 0;
  }

  .content02 {
    padding: 0 0 70px;
  }

  .front_second_inner {
    padding: 70px 0;
    width: 100%;
  }

  .front_topics {
    padding: 70px 0;
  }

  .front_topics::before {
    height: 140px;
  }

  section.footer__contact {
    padding: 50px 0;
  }

  /* ファーストビュー下2カラム */
  .front_inner-text {
    width: 100%;
    margin: 0 auto 2em;
  }

  .front_inner-img {
    width: 100%;
    padding: 0;
  }

  footer {
    padding: 70px 0 120px;
    font-size: 0.9em;
  }

  .post-content a[href^='tel:'] {
    color: var(--color-text);
  }
}

@media only screen and (max-width: 767px) {
  .pagetop a {
    width: auto;
    height: auto;
  }

  .pagetop a::before {
    font-size: unset;
    width: 1px;
    height: 40px;
  }

  .article03-content {
    padding: 1em 1.5em 1.5em;
  }

  .top-blog {
    margin: 0px 0 -1em auto;
  }

  .article03 {
    width: calc((100% / 2) - 0.5em);
    margin-bottom: 1em;
    margin-right: 0;
    background: none;
  }

  .article03:nth-of-type(odd) {
    margin-right: 1em;
  }

  .top-blog::before {
    height: calc(100% - 1em);
  }

  p.copyright {
    height: auto;
  }
}

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

  .top-slider-wrapper {
    width: 100%;
  }

  .scroll-box {
    display: none;
  }

  a.footer_but:last-of-type {
    margin-bottom: 0;
  }

  .post-content td, .post-content th {
    display: block;
    width: 100%;
  }

  .post-content th {
    padding-right: 0;
    padding-bottom: 0;
  }

  .post-content td {
    padding-top: 0.25em;
  }

  .wpcf7 form.invalid .wpcf7-response-output, .wpcf7 form.unaccepted .wpcf7-response-output {
    text-align: left;
    padding: 10px 15px;
  }

  .flow-box::after {
    width: 60px;
    height: 60px;
    line-height: 60px;
  }

  .flow-box::before {
    left: 29px;
  }

  .flow-box {
    padding-left: 90px;
  }

  .top-blog {
    width: calc(100% - 4em);
    padding-left: 2em;
    margin: 0 0 0 auto;
  }

  .article03, .article03:nth-of-type(odd) {
    width: 100%;
    margin: 0 auto 1em;
  }

  .article03:last-of-type {
    margin-bottom: 0;
  }

  .top-blog::before {
    height: 100%;
  }

  a.footer_but {
    width: 100%;
    margin: 0 auto 1.5em;
  }

  a.footer_but:last-of-type {
    margin-bottom: 0;
  }

  .footer_about_inner {
    width: 100%;
    padding: 0;
    margin: 0 auto 2em;
  }

  .footer-menu {
    width: 100%;
    max-width: unset;
    padding: 0;
  }

  p.copyright {
    position: relative;
    text-align: center;
    margin: 4em auto 0;
    font-size: 0.9em;
  }
}

@media only screen and (max-width: 1200px) {
  .signage {
    height: auto;
  }
}

@media only screen and (max-width: 991px) {
  .content_inner {
    padding: 60px 0 70px;
  }
}

@media only screen and (max-width: 767px) {
  .post-content p {
    margin-bottom: 1.5em;
  }

  .signage-title {
    font-size: 2em;
  }

  .breadcrumb-wrapper {
    height: auto;
  }
}

@media only screen and (max-width: 767px) {
  .post-header {
    margin: 0 auto 2em;
  }
}

/* ====================================================================== */
@media only screen and (max-width: 485px) {
  p.front__main--copy {
    font-size: 3em;
  }

  .footer__contact--tel {
    width: 100%;
  }

  address.footer_tel {
    text-align: center;
  }

  .footer__contact--mail {
    width: 100%;
  }
}