@charset "UTF-8";
/* CSS Document */
/* SP（カンプ sp-top.svg：414px基準。数値は 414px を 100vw として換算。1vw = 4.14px） */
@media (max-width: 667px) {
  body {
    font-size: max(1.40rem, 0.79vw + 1.07rem);
  }
  p {
    letter-spacing: 0.05em;
  }
  /* 見出し・許可番号の改行は、SPでも生かす */
  .sp-br, .hero_catch .pc-br, .hero_license_text .pc-br, .top05_title .pc-br, .contact_lead .pc-br {
    display: inline;
  }
  /*////////////////ボタン（高さ40px）/////////////*/
  .btn01, .btn02 {
    min-width: 11.7em;
    height: 2.85em;
    padding: 0 2.6em 0 1.45em;
    font-size: 1em;
  }
  /*////////////////ヘッダー/////////////*/
  .logo {
    top: calc(max(7.2rem, 17vw) / 2);
    left: 2.5vw;
    gap: 2vw;
  }
  .logo_mark {
    width: 7.5vw;
  }
  .logo_sub {
    font-size: 0.455em;
  }
  .logo_name {
    margin-right: -0.089em;
    font-size: 1em;
    letter-spacing: 0.089em;
  }
  .header_nav {
    padding-top: 35vw;
    padding-right: 9.9%;
    padding-left: 9.9%;
  }
  .header_nav_tel a {
    font-size: 1.71em;
  }
  /*////////////////ヒーロー（写真1枚分の高さに文字を重ねる）/////////////*/
  .top_hero {
    margin: max(7.2rem, 17vw) 2.5% 0;
  }
  .header_menu_btn {
    top: calc(max(7.2rem, 17vw) / 2 - 25px);
  }
  .hero_slides {
    aspect-ratio: 394 / 744;
    min-height: 0;
    border-radius: 10px;
  }
  .hero_textbox {
    top: auto;
    right: 5%;
    bottom: calc(30vw + 2em);
    left: 5%;
  }
  .hero_head {
    position: static;
    width: auto;
  }
  .hero_en {
    margin-bottom: 0.7em;
    font-size: 0.857em;
  }
  .hero_catch {
    font-size: max(2.00rem, 5.3vw);
    line-height: 1.5;
  }
  .hero_sub {
    max-width: none;
    margin-top: 2em;
    font-size: 1em;
    line-height: 1.9;
  }
  .hero_textbox .btn02 {
    margin-top: 1.6em;
    min-width: 11.7em;
  }
  .hero_license {
    right: 5%;
    bottom: 5.5vw;
    left: 5%;
    flex-direction: column;
    align-items: flex-start;
    font-size: min(1.03vw + 0.71rem, 1.40rem);
  }
  .hero_license_year {
    margin: 0 0 0.6em;
    padding-bottom: 0.2em;
    border-bottom: 1px solid #fff;
  }
  .hero_license_text {
    padding-left: 0;
    border-left: none;
    line-height: 1.9;
  }
  /*////////////////共通：見出し/////////////*/
  .en_title {
    font-size: max(3.20rem, 5.6vw + 2.70rem);
  }
  .com_line, .top02, .top03, .top04, .contact {
    &::before {
      top: calc(1.17 * max(3.20rem, 5.6vw + 2.70rem) + 1.8em);
      left: calc(0.43em - 0.5px);
    }
  }
  .ja_title::before {
    width: 0.86em;
    height: 0.86em;
  }
  .top01 {
    margin-top: 9vw;
  }
  .sub_title_label {
    font-size: max(1.40rem, 0.79vw + 1.07rem);
  }
  /*////////////////News/////////////*/
  .top_news_li {
    padding: 5vw 0 3vw;
  }
  .top_topic_list {
    display: grid;
    grid-template-columns: 21.7vw 1fr;
    column-gap: 3.4vw;
    align-items: center;
  }
  .top_eyecatch {
    grid-row: 1 / 3;
    width: 100%;
  }
  .top_news_meta {
    flex-direction: row;
    align-items: center;
    align-self: end;
    justify-content: flex-start;
    gap: 1em;
    width: auto;
    min-width: 0;
    margin-left: 0;
  }
  .top_list_date {
    font-size: 0.857em;
  }
  .top_news_cat {
    height: 2em;
    padding: 0 0.8em;
    font-size: 1rem;
    line-height: 2em;
  }
  .top_news_title {
    align-self: start;
    margin-top: 0.7em;
  }
  /*////////////////Service/////////////*/
  .service_head {
    gap: 1em;
    padding: 0.9em 0 0.85em;
    font-size: max(1.60rem, 0.79vw + 1.27rem);
  }
  .service_num {
    width: 3.36em;
    height: 1.71em;
    font-size: 0.875em;
  }
  .service_body {
    flex-direction: column;
    align-items: stretch;
    gap: 1.4em;
    padding: 1em 0 4em;
  }
  .service_pic {
    width: 100%;
  }
  .service_text {
    max-width: none;
  }
  .service_arrow {
    bottom: 1em;
    width: 2em;
    height: 2em;
  }
  .top02_btn {
    margin-top: 2.4em;
  }
  .feature_list {
    margin-top: 4em;
    gap: 1.8em;
  }
  .feature_box {
    flex-direction: column;
    gap: 1em;
    padding: 4.5% 4.5% 5.8em;
    &::after {
      top: auto;
      right: 5%;
      bottom: 2.3em;
      transform: none;
    }
  }
  .feature_pic {
    width: 56.4%;
    aspect-ratio: 199 / 149;
  }
  .feature_textbox {
    font-size: 1em;
  }
  .feature_label {
    font-size: 0.857em;
  }
  .feature_title {
    margin-top: 0.5em;
    font-size: 1.143em;
    line-height: 1.6;
  }
  .feature_spec {
    gap: 0.9em;
    margin-top: 1.4em;
  }
  .feature_spec_li {
    dt {
      font-size: 1em;
      font-weight: 700;
    }
    dd {
      font-size: 1.43em;
    }
  }
  .feature_text {
    margin-top: 1.1em;
    padding-right: 3em;
    font-size: 1em;
    font-weight: 700;
    line-height: 1.9;
  }
  /*////////////////Works/////////////*/
  .top_works_list {
    grid-template-columns: 1fr;
    margin-top: 2em;
    gap: 1.4em;
  }
  .top_works_link {
    display: flex;
    align-items: center;
    gap: 3vw;
  }
  .top_works_pic {
    flex: 0 0 41.6%;
    min-width: 14.8rem;
  }
  .top_works_tag {
    font-size: 1rem;
    line-height: 2em;
    white-space: nowrap;
  }
  .top03_btn {
    margin-top: 2.6em;
  }
  /*////////////////About/////////////*/
  .top04_catch {
    margin-top: 1.5em;
    font-size: 1.43em;
    line-height: 1.8;
  }
  .top04_text {
    margin-top: 1.1em;
  }
  .top04_btn {
    margin-top: 1.8em;
  }
  .top04_pic {
    width: 60.4%;
    margin-top: 3em;
  }
  /*////////////////Recruit/////////////*/
  .top05 {
    min-height: 0;
    aspect-ratio: 414 / 596;
  }
  .top05_inner {
    padding: 16vw 7.5% 0;
  }
  .top05_label {
    font-size: 0.857em;
  }
  .top05_title {
    margin-top: 0.8em;
    font-size: max(2.00rem, 4.8vw);
    line-height: 1.6;
  }
  .top05_text {
    width: auto;
    margin-top: 1.3em;
  }
  .top05_btn {
    margin-top: 2.2em;
  }
  /*////////////////Contact/////////////*/
  .contact_lead {
    margin-top: 1.6em;
  }
  .contact_row {
    flex-direction: column;
    align-items: flex-start;
    gap: 2em;
    margin-bottom: 18vw;
  }
  .phone-number {
    font-size: 1.71em;
  }
  .phone-hours {
    margin-top: 0.6em;
    font-size: 1em;
    font-weight: 500;
  }
  /*////////////////フッター/////////////*/
  .footer-content {
    margin: 8vw 5% 0;
  }
  .footer-address {
    font-size: 1em;
    p + p {
      margin-top: 1.1em;
    }
  }
  .footer-license {
    margin-top: 2em;
    font-size: 0.857em;
  }
  .foot_menu_wrap {
    gap: 1.7em 1.7em;
    margin-top: 3em;
  }
  .foot_menu_single a {
    min-width: 0;
    font-size: 1em;
    letter-spacing: 0.05em;
  }
  .foot_menu_single {
    font-size: 1.3rem;
  }
  .copy {
    margin-top: 14vw;
  }
  /*////////////////下層ページ共通/////////////*/
  .sub_hero {
    padding-top: 24vw;
  }
  .sub_title_en {
    font-size: max(3.20rem, 5.6vw + 2.70rem);
  }
  .sub_title_big {
    font-size: max(2.20rem, 5vw);
    margin-bottom: 1em;
  }
  .about_sec {
    &::before {
      top: calc(1.17 * max(3.20rem, 5.6vw + 2.70rem) + 1.8em);
      left: calc(0.43em - 0.5px);
    }
  }
  .news_sec::before, .works_sec::before, .contact_sec::before {
    top: 1.8em;
  }
  .about_sec .about_sec_body {
    margin-top: 1.6em;
  }
  .about_title {
    font-size: max(1.80rem, 1.58vw + 1.15rem);
  }
  /* お知らせ詳細の本文の見出し：本文の文字の大きさを基準にして、タイトル（.about_title）より小さく、本文より大きくする */
  .news_d_body {
    h2 {
      font-size: 1.2em;
    }
    h3 {
      font-size: 1.12em;
    }
    h4, h5, h6 {
      font-size: 1.05em;
    }
  }
  .about_table_row {
    flex-direction: column;
    gap: 0.6em;
    padding: 0.8em 0 1em;
    dt {
      width: auto;
      padding: 0.35em 0.8em;
      background-color: #f0f0f0;
    }
    dd {
      padding: 0 0.8em;
    }
  }
  .about_company_pic {
    margin-top: 1.6em;
  }
  /* 会社案内 */
  .about_lead_catch {
    font-size: max(2.00rem, 4.8vw);
  }
  .about_message_inner {
    flex-direction: column;
    gap: 2em;
  }
  .about_message_pic {
    width: 70%;
  }
  .about_philosophy_words {
    font-size: max(1.80rem, 4.3vw);
  }
  .about_history_row {
    grid-template-columns: 1fr;
    padding-left: 2em;
  }
  .about_license_top {
    flex-direction: column;
    align-items: stretch;
    gap: 1.6em;
  }
  .about_license_pic {
    width: 100%;
  }
  /* 1行に収まらないので、工事業名と許可番号を縦に並べる */
  .about_regist_list {
    grid-template-columns: 1fr;
  }
  .about_license_list {
    grid-template-columns: 1fr;
  }
  /* 事業内容 */
  .svc_flow {
    grid-template-columns: 1fr;
  }
  .svc_flow_pic {
    aspect-ratio: 16 / 9;
  }
  .svc_body {
    flex-direction: column;
    gap: 1.4em;
  }
  .svc_pics {
    grid-template-columns: 1fr 1fr;
    width: 100%;
  }
  /* 鋼管つば出し加工機・漏水調査 */
  .flare_intro, .leak_intro {
    flex-direction: column;
    align-items: stretch;
    gap: 2em;
    margin-top: 8vw;
    margin-bottom: 14vw;
  }
  .flare_intro_catch {
    margin-top: 0.2em;
  }
  .flare_intro_pic, .leak_intro_pic {
    width: 100%;
    aspect-ratio: 3 / 2;
  }
  .flare_process_inner {
    flex-direction: column;
    gap: 2em;
  }
  .flare_video {
    width: 100%;
  }
  .flare_big {
    max-width: 100%;
    li {
      padding: 1em 1em 1.2em;
      border-radius: 5px;
    }
  }
  .flare_big_num {
    font-size: max(2rem, 7vw);
  }
  .flare_flow_title {
    font-size: max(1.60rem, 0.79vw + 1.27rem);
  }
  .svc_flow_title {
    font-size: max(1.60rem, 0.79vw + 1.27rem);
    font-weight: 700;
  }
  .leak_checks {
    grid-template-columns: 1fr;
    gap: 0.8em;
  }
  .leak_split_pics {
    grid-template-columns: 1fr;
    gap: 1em;
  }
  .leak_card {
    grid-template-columns: 1fr;
  }
  .leak_card_text {
    padding: 1.2em 1.4em 1.4em;
  }
  .leak_price_row {
    grid-template-columns: 1fr;
    dt {
      padding: 1em 1em 0;
      white-space: normal;
    }
    dd {
      padding: 0.4em 1em 1em;
    }
  }
  .leak_price_dots li, .leak_price_list li span {
    white-space: normal;
  }
  .leak_cta {
    flex-direction: column;
    align-items: flex-start;
    gap: 2em;
    margin-bottom: 14vw;
  }
  .leak_cta_head {
    font-size: max(2.00rem, 5vw);
  }
  .leak_cta_tel {
    font-size: max(2.60rem, 7vw);
  }
  .leak_faq_qtext {
    font-size: max(1.40rem, 0.79vw + 1.07rem);
  }
  /* 施工実績・お知らせ */
  .list_tab {
    font-size: 1.2rem;
    padding: 0.4em 0.8em;
  }
  .list_tabs {
    gap: 0.5em;
  }
  /* 施工実績の一覧：トップの施工実績と同じ（写真が左、文字が右） */
  .works_list {
    grid-template-columns: 1fr;
    gap: 1.4em;
  }
  .works_link {
    display: grid;
    grid-template-columns: minmax(14.8rem, 41.6%) 1fr;
    column-gap: 3vw;
    align-items: center;
  }
  .works_pic {
    grid-row: 1 / 4;
  }
  .works_tag {
    font-size: 1rem;
    line-height: 2em;
    white-space: nowrap;
  }
  /* 施設名・工事内容は2行まで。あふれた分は「…」 */
  .works_name, .works_work {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    overflow: hidden;
  }
  .works_name {
    margin-top: 0;
    font-size: 0.857em;
    letter-spacing: 0.05em;
    line-height: 1.7;
  }
  .works_work {
    margin-top: 0.3em;
    font-size: 0.857em;
    letter-spacing: 0.05em;
    line-height: 1.7;
  }
  .works_year {
    margin-top: 0.4em;
    font-size: 0.786em;
    line-height: 1.5;
  }
  .works_d_row {
    grid-template-columns: 1fr;
    gap: 0.2em;
  }
  .works_d_nav, .news_d_nav {
    flex-wrap: wrap;
    justify-content: space-between;
    .btn01 {
      order: 3;
      justify-content: center;
      width: 100%;
      margin-top: 1.4em;
      padding: 0 2.6em;
    }
  }
  .cpage_lead {
    margin-top: 2em;
  }
  /* お問い合わせ */
  .cform_row {
    grid-template-columns: 1fr;
    gap: 0.6em;
  }
  .contact_label {
    padding-top: 0;
  }
  .contact_tel_num {
    font-size: max(2.80rem, 7vw);
  }
  .contact_btns {
    flex-wrap: wrap;
    gap: 1em;
  }
  /* 採用情報 */
  .recruit_message_text p {
    font-size: 1em;
    line-height: 2.3;
  }
  .recruit_head_en {
    font-size: max(1.40rem, 0.68vw + 1.14rem);
    gap: 0.2em;
  }
  .recruit_head_ja {
    margin-top: 0.2em;
  }
  .recruit_hero_set {
    height: max(90vw, 36rem);
  }
  .recruit_interview_body {
    margin-top: max(5.7vw, calc(15.75rem - 23.5vw + 2rem));
  }
  .recruit_bubble {
    top: calc(2.5vw + 35cqw * 2 / 3 - 0.875 * 15em);
    left: 36%;
    width: 15em;
    margin: 0 -5vw 1.6em auto;
    padding: 0 2.1em 0.9em;
    font-size: 1.2rem;
  }
  .recruit_job .about_table_row dt {
    width: auto;
  }
  .recruit_day_item {
    grid-template-columns: 4.6em 1fr;
    gap: 0.2em 1em;
  }
  .recruit_day_text {
    grid-column: 2;
  }
  .recruit_entry {
    flex-direction: column;
    align-items: flex-start;
    gap: 1.6em;
  }
  .recruit_entry {
    margin-top: 12vw;
    margin-bottom: 16vw;
    padding: 2em 1.6em;
  }
  .recruit_hero_catch {
    font-size: 6.2vw;
  }
  .recruit_hero_sub {
    font-size: max(1.40rem, 3.6vw);
  }
  .recruit_lead {
    margin-top: 5em;
  }
  /* 会社案内のページ内リンク：5つとも1行に収める（画面幅に合わせて小さくなる） */
  .page_nav {
    flex-wrap: nowrap;
    gap: 1vw;
  }
  .page_nav a {
    font-size: max(0.9rem, 2.7vw);
    letter-spacing: 0;
  }
}