/*
Template:bootstrap-basic4
Theme Name:child-yamamoto_seizai
*/
@charset "utf-8";
@import url('https://fonts.googleapis.com/css2?family=M+PLUS+1p:wght@700;800;900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@300;400;500;700;900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Noto+Serif+JP:wght@300;400;500;700;900&display=swap');
:root { --primary: #16a34a; --accent: #081d4f; --white: #FFFFFF; --light-gray: #cfcfcf; --dark-gray: #333333; --transition: all 0.3s ease; --bg:#ffffff;--ink:#1f2937;--muted:#6b7280;--primary:#16a34a;--primary-weak:#eaf7ee;--line:#e5e7eb;--card:#ffffff;--radius:16px;--shadow:0 8px 24px rgba(0,0,0,.08);--w:980px;--step:44px;--badge:#14532d;}
* { margin: 0; padding: 0; box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { font-family: '游明朝', 'YuMincho', 'Hiragino Mincho ProN', 'HGS明朝E', 'MS PMincho', serif; color: var(--dark-gray); line-height: 1.6; background-color: var(--white); }
img { max-width: 100%; height: auto; }

/*------BASE------*/
.container { max-width: 1030px; }
.btn{border-radius: 0; padding: 1rem 6rem;}
.btn-1 { background-color: var(--accent); color: var(--white); transition: var(--transition); border: 2px solid var(--accent); }
.btn-1:hover { background-color: var(--white); color: var(--accent); }
.noto { font-family: 'Noto Sans JP', 'Meiryo', sans-serif; font-weight: 400; }
.mplus{ font-family: 'M PLUS 1p', 'Meiryo', sans-serif; font-weight: 900; }
.bg-1 { background-color: #ffd600; }
.bg-2 { background-color: var(--accent); }
.c-1 { color: #081d4f; }
.c-2 { color: #555; }
.c-3 { color: #d43f3a; }
.zoomup{right: 10px; bottom: 10px; color: #fff; font-size: 20px;}


/*------HEADER------*/
.header { width: 100%; top: 0; z-index: 1000; position: fixed; background-color: var(--white);}
.header-container { display: flex; justify-content: space-between; align-items: center; padding: 0 1rem; }
.logo-text { font-weight: 700; font-size: 1.2rem; }
.logo-text a { color: var(--dark-gray); }
.nav-menu > ul { display: flex; list-style: none; }
.ul-nav{padding: 1rem;}
.nav-link { text-decoration: none; font-weight: 600; color: var(--dark-gray); transition: var(--transition); position: relative; }
.nav-link:hover, .current-menu-item .nav-link, .nav-link.active { color: var(--accent); }
.nav-link:after { content: ''; position: absolute; bottom: 0px; left: 0; width: 0; height: 2px; background-color: var(--accent); transition: var(--transition); }
.show > .nav-link:after, .nav-link:hover:after, .current-menu-item .nav-link:after, .nav-link.active:after { width: 100%; }
.hamburger { display: none; background: none; border: none; cursor: pointer; font-size: 1.5rem; color: var(--dark-gray); }
.nav-contact .btn{padding: 0.75rem 1rem; color: var(--white);}
.nav-contact .btn span{display: block;}
.btn-tel{background-color: #081d4f;}
.btn-contact{background-color: #d43f3a;}

/* ドロップダウンメニュー */
.nav-menu .menu-item-has-children { position: relative; }
.nav-menu .dropdown-menu { position: absolute; top: 100%; float: none; left: 0; background: var(--white); min-width: 200px; margin: 0; box-shadow: 0 4px 8px rgba(0,0,0,0.1); border-radius: 4px; display: none; z-index: 1000; padding: 0; }
.nav-menu .dropdown-item.active, .nav-menu .dropdown-item:active { background-color: var(--accent); color: var(--white); }

/* PCでのホバー表示 */
@media (min-width: 769px) {
    .nav-menu .menu-item-has-children:hover .dropdown-menu, .nav-menu .menu-item-has-children.show .dropdown-menu {display: block !important;}
}

.nav-menu .dropdown-item { display: block; padding: 8px 15px; color: var(--dark-gray); text-decoration: none; transition: var(--transition); }
.nav-menu .dropdown-item:hover { background-color: #f8f9fa; color: var(--accent); }

/* ドロップダウンの矢印アイコン */
.dropdown-toggle::after{border:none;}
.nav-menu .dropdown-toggle::after { content: ' ▼'; left: 10px; bottom: 5px; font-size: 0.8em; transition: transform 0.3s ease; }
.nav-menu .menu-item-has-children:hover .dropdown-toggle::after,
.nav-menu .menu-item-has-children.show .dropdown-toggle::after { transform: rotate(180deg); left: 0; bottom: 0;}

/*bread*/
.breadcrumbs { padding: 0.25rem 0; font-size: 11px; background-color: #f4f4f4; }
.breadcrumbs,.breadcrumbs a { color: #373737; }
.breadcrumbs > .container > span { margin: 0 5px; }
.breadcrumbs > .container > span:first-child { margin-left: 0; }
.single-project .breadcrumbs { margin-bottom: 0; }

/*------GLOBAL------*/
body { padding-top: 74px;}
main { position: relative;}
.sec { padding: 60px 0; }
.sec-title{ margin-bottom: 1.5rem; font-size: 1.8rem; }
.sec-btn{ text-align: center; margin-top: 2rem; }

/*------INDEX------*/
.wrp-swipe{position: relative;}
.swiper-text{position: absolute;  font-size: 4rem; font-weight: bold; color: #fff;top: 50%; left: 50%; transform: translate(-50%, -50%); z-index: 999;}
.swiper {
  width: 100%;
  height: 70vh;
  position: relative;
  overflow: hidden;
}

.swiper-slide {
  position: relative;
}

.swiper-slide img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transform: scale(1);
  transition: transform 9s ease, opacity 1s ease;
  opacity: 0;
}

/* アクティブ時のズームイン＋フェードイン */
.swiper-slide-active img {
  transform: scale(1.1);
  opacity: 1;
}
.hero{color:#fff;position:relative; background:#000 center/cover no-repeat url("assets/images/mv01.png")}
.hero::before{content:"";position:absolute;inset:0;background:rgba(0,0,0,.55)}
.hero > .container{z-index: 2; position: relative;}

/*news*/
.news li { display: flex; align-items: center; margin-bottom: 20px; }
.tag { padding: 4px 10px; border-radius: 0; color: #fff; font-size: 12px; margin-right: 15px; }
.tag.new { background: #d43f3a; }
.tag.info { background: #ffb347; }
.item-topic .item-inner{margin-right: 40px;}
.item-topic .item-label a{color: var(--dark-gray); font-weight: 600; text-decoration: underline;}
.item-news .news-title{font-size: 1rem; margin: 0.5rem 0;}
.item-news .btn{padding: 0.25rem 0rem;}
.item-news .card-body{padding: 1rem;}
.item-news .item-date{font-size: 0.875rem;}

/*work*/
.sec-works {
  display: flex;
  flex-direction: column;
}
.work {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
}

.work:nth-child(even){
  flex-direction: row-reverse;
}

.work img {
  width: 50%;
  height: auto;
}

.work-body {
  flex: 1 1 45%;
  padding: 5rem;
}
.work-title {padding-bottom: 1rem; font-size: 1.5rem; font-weight: 700; border-bottom: 1px solid var(--accent); margin-bottom: 1rem;}
.work-body p {margin-bottom: 1rem;}

/*事例*/
.wrp-photos, .wrp-posts, .wrp-news.v-work{display: flex;  gap: 1rem; flex-wrap: wrap;}
.wrp-posts .item-news,
.photo-item{width: calc(25% - 1rem); box-shadow: 0 4px 8px rgba(0,0,0,0.1); transition: var(--transition);}
.photo-item img{width: 100%; height: auto; display: block;}
.photo-item p{padding: 0.5rem; text-align: center; font-weight: 600; color: var(--accent);}

/*------ARCHIVE------*/
.page-item.active .page-link {background-color: #081d4f; border-color: #081d4f;}
.page-link,.page-link:hover{color: #081d4f;}

/*------SINGLE------*/
/* 施工詳細ページ */
.single-work-page {position: relative;}
.main-image img { width: 100%; height: auto; margin-bottom: 30px; position: relative; z-index: 1;}
.work-title { font-size: 2rem; margin-bottom: 20px; }
.work-comment { font-size: 1.1rem; margin-bottom: 30px; font-weight: 300;}
.work-gallery h2 { font-size: 1.4rem; margin-bottom: 15px; }
.gallery-grid { display: flex; flex-wrap: wrap; gap: 5px; margin-bottom: 40px; }
.gallery-item { width: calc(33.333% - 13.333px); padding: 0.5px;}
.gallery-item img { width: 100%; height: auto;}
.work-table table { width: 100%; border-collapse: collapse; margin-bottom: 40px; }
.work-table th, .work-table td { border: 1px solid #ccc; padding: 10px; text-align: left; vertical-align: top; }
.work-table th { background: #f8f8f8; width: 30%; }
.work-table td { font-weight: 300;}

/*------PAGE------*/
.page-head{color:#fff; position:relative; padding: 3rem 0; background:#000 center/cover no-repeat url("assets/images/new-01.png")}
.page-title{margin: 0; font-size: 2rem; font-weight: bold; color: var(--white); }
.page-subtitle{margin-bottom: 1rem; font-size: 1.5rem; font-weight: bold; color: var(--accent);}
.page-subtitle::after{content:""; display: block; width: 50px; height: 3px; background: var(--accent); margin-top: 0.5rem;}

.wrp-post_head{margin-bottom: 2rem;}
.wrp-post_head .post-title{margin-bottom:0.75rem; font-size: 1.5rem; font-weight: 900;}
.wrp-post_head .item-img{margin-top: 1rem; max-width: 400px; position: relative;}
.wrp-post_head .item-inner{gap: 0.5rem;}
.wrp-post_head .item-date{margin-left: 1rem;}
.page-block{margin-bottom: 3rem;}

/* NEW-HOUSE */
.new-house-subtitle{margin-bottom: 25.35px; font-size: 34px; font-weight: bold; font-family: YakuHanJP, "游ゴシック", "Yu Gothic", "游ゴシック体", "YuGothic", YuGothic, "游ゴシック Medium", YuGothic, YuGothicM, Arial,"ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","HG丸ｺﾞｼｯｸM-PRO","HGMaruGothicMPRO";}
.new-house-subtitle-text{margin-bottom: 87px; font-size: 24px; line-height: 1.8; font-weight: bold;}
.new-house-maintitle{margin-bottom: 20px; font-size: 28px; font-weight: bold; font-family: YakuHanJP, "游ゴシック", "Yu Gothic", "游ゴシック体", "YuGothic", YuGothic, "游ゴシック Medium", YuGothic, YuGothicM, Arial,"ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","HG丸ｺﾞｼｯｸM-PRO","HGMaruGothicMPRO";}
.new-house-maintitle-text{font-size: 16px;  font-family: YakuHanJP, "游ゴシック", "Yu Gothic", "游ゴシック体", "YuGothic", YuGothic, "游ゴシック Medium", YuGothic, YuGothicM, Arial,"ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","HG丸ｺﾞｼｯｸM-PRO","HGMaruGothicMPRO";}
.new-house-container {display: flex; /* 横並び配置 */align-items: center; /* 垂直方向の中央揃え */max-width: 1200px; /* コンテンツの最大幅 */margin-bottom: 25px;}
.new-house-container img {width: 300px; /* 画像の幅を調整 */height: auto; /* アスペクト比を保持 */border-radius: 10px; /* 角を少し丸く */object-fit: cover;}
.new-house-text {width: 80%; /* テキストの幅 */text-align: left; /* 文章の左揃え */padding-left: 60px; /* 画像とテキストの間隔を確保 */}

/* company */
.concept-maintitle{margin-bottom: 50px; font-size: 24px; font-weight: bold; font-family: YakuHanJP, "游ゴシック", "Yu Gothic", "游ゴシック体", "YuGothic", YuGothic, "游ゴシック Medium", YuGothic, YuGothicM, Arial,"ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","HG丸ｺﾞｼｯｸM-PRO","HGMaruGothicMPRO";}
.concept-maintitle-text{font-weight: bold; font-size: 18px;  font-family: YakuHanJP, "游ゴシック", "Yu Gothic", "游ゴシック体", "YuGothic", YuGothic, "游ゴシック Medium", YuGothic, YuGothicM, Arial,"ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","HG丸ｺﾞｼｯｸM-PRO","HGMaruGothicMPRO";}
.concept-maintitle2{margin-bottom: 50px; font-size: 18px; font-family: YakuHanJP, "游ゴシック", "Yu Gothic", "游ゴシック体", "YuGothic", YuGothic, "游ゴシック Medium", YuGothic, YuGothicM, Arial,"ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","HG丸ｺﾞｼｯｸM-PRO","HGMaruGothicMPRO";}
.concept-maintitle-text2{font-size: 18px;  font-family: YakuHanJP, "游ゴシック", "Yu Gothic", "游ゴシック体", "YuGothic", YuGothic, "游ゴシック Medium", YuGothic, YuGothicM, Arial,"ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","HG丸ｺﾞｼｯｸM-PRO","HGMaruGothicMPRO";}
.concept-container {display: flex; /* 横並び配置 */align-items: center; /* 垂直方向の中央揃え */max-width: 1200px; /* コンテンツの最大幅 */margin-bottom: 80px;}
.concept-container img {width: 500px; /* 画像の幅を調整 */height: auto; /* アスペクト比を保持 */border-radius: 10px; /* 角を少し丸く */object-fit: cover;}
.concept-text {width: 80%; /* テキストの幅 */text-align: left; /* 文章の左揃え */padding-left: 30px; /* 画像とテキストの間隔を確保 */}
.image-links {display: flex; /* 横並びにする */justify-content: space-around; /* 中央配置 */gap: 0px; /* 画像の間隔 */margin: 20px 0; /* 上下余白 */}
.image-item {position: relative; /* 子要素の位置調整の基準にする */display: block; /* クリック範囲を画像全体に */width: 30%; /* 3つ並べるために30%指定 */max-width: 380px; /* 最大幅を指定 */overflow: hidden; /* はみ出した部分を隠す */border-radius: 0; /* 角を丸く */}
.image-item img {width: 100%; /* 画像のサイズをaタグに合わせる */height: auto; /* アスペクト比を維持 */transition: transform 0.5s ease-in-out; /* なめらかな拡大アニメーション */}
.image-item:hover img {transform: scale(1.1); /* ホバー時に画像をズーム */}
.table-responsive > table{min-width: 640px; margin-bottom: 0;}

/* 耐震改修 */
.flow{position:relative;margin-left:4px}
.flow:before{content:"";position:absolute;left:23px;top:0;bottom:0;width:2px;background:linear-gradient(var(--primary),var(--primary) 40px,transparent 40px) top/2px calc(100% - 20px) no-repeat, var(--line)}
.step{position:relative;display:grid;grid-template-columns:60px 1fr;gap:18px;margin:0 0 18px;padding:16px;border-radius:var(--radius);background:var(--card);box-shadow:var(--shadow);border:1px solid var(--line)}
.step .icon{width:46px;height:46px;border-radius:12px;background:var(--primary-weak);display:grid;place-items:center;border:1px solid #d7efe0}
.step .icon svg{width:22px;height:22px;fill:var(--primary)}
.step .title{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.step .title h2{font-size:18px;margin:0;font-weight:800}
.badge{font-size:12px;color:#fff;background:var(--badge);padding:2px 8px;border-radius:999px}
.body{padding-left:60px}
.kv{display:flex;gap:8px;flex-wrap:wrap;margin:8px 0 2px}
.kv .time{font-size:12px;color:var(--muted);background:#f6f7f8;border:1px solid var(--line);padding:2px 8px;border-radius:999px}
.notes{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px}
.note{position:relative;background:#f9fafb;border:1px solid var(--line);border-left:4px solid var(--primary);padding:8px 10px;border-radius:10px}

.earthquake-resistant-text {font-size: 1.2rem; line-height: 1.8; margin-bottom: 30px; font-weight: bold;}
.earthquake-resistantsection { margin-bottom: 3rem; background: #fff; padding: 1.5rem; border-radius: 8px; box-shadow: 0 0 10px rgba(0,0,0,0.05); }
.flow-title { font-weight: bold; font-size: 1.2rem; margin-top: 1rem; }
.photo-row { display: flex; gap: 10px; margin-top: 2rem; }
.photo-cell { flex: 1; overflow: hidden;}
.photo-cell img { width: 80%; height: 250px; object-fit: cover; display: block; }
.earthquake-sec{padding: 1.5rem 0;}
.sub-title{font-size: 1.5rem; font-weight: bold; margin: 30px 0 15px; border-left: 10px solid #111; border-bottom: 1px solid #111; padding:0 0 5px 10px ;}


/*contact*/
.wrp-form p { margin-bottom: 1rem; }
.tb-form { font-size: 1rem; }
.wpcf7-spinner { position: absolute; right: -17px; top: 103%;}

/*------Footer------*/
.footer {background-color: var(--light); padding: 2rem 0 0; }
.footer-right{gap: 2rem;}
.ul-f_nav a{color: var(--dark-gray); font-weight: 600; text-decoration: underline;}
.copyright { text-align: center; font-size: 12px; padding: 0.5rem 0; color: var(--dark-gray); border-top: 1px solid #e0e0e0; margin-top: 2rem;}

/*------PC small------*/
@media only screen and (max-width: 1280px) {
}

/*------PAD pro------*/
@media only screen and (max-width: 1080px) {
    #header { padding: 0.75rem 1rem; }
}

/*------PAD------*/
@media only screen and (max-width: 880px) {
    .nav-link { padding: .5rem; }
}

/*------SP------*/
@media (max-width: 768px) {
    body { font-size: 0.9rem; padding-top: 70px;}

    .header-container{padding: 1rem;}
    .hamburger { display: block; }
    .nav-menu { position: fixed; z-index: 999; top: 70px; left: -100%; flex-direction: column; background-color: var(--white); width: 100%; text-align: center; transition: var(--transition); box-shadow: 0 10px 15px rgba(0, 0, 0, 0.1); }
    .nav-menu > ul.ul-nav { display: block; width: 100%; padding: 0;}
    .nav-menu.active { left: 0; }
    .nav-link { text-align: left; padding: 1rem; border-top: 1px solid var(--light-gray); }
    .nav-menu .dropdown-menu { position: static; width: 100%; border: none; box-shadow: none; background: #fff; margin-left: 0; border-radius: 0; padding: 0; display: block !important; }
    .nav-menu .dropdown-item { padding: 0.5rem 2rem; font-size: 0.9rem; border-top: 1px solid #e0e0e0; }
    .nav-menu .dropdown-toggle::after { display: none; }
    .nav-contact, .nav-contact .btn{width: 100%;}
    .nav-contact > li{width: 50%;}
    .button-bar { flex-wrap: wrap; }
    .button-bar .btn { width: 45%; }
    .btn-001 { width: 100%; }

    /*------MAIN------*/
    .sec { padding: 30px 0; }
    .sec-title { margin-bottom: 2rem; font-size: 1.4rem; }
    .tag { font-size: 10px; padding: 3px 8px; margin-right: 10px; }

    /*------INDEX------*/
    .swiper-text{font-size: 2rem;}
    .item-topic .item-inner { margin-right: 15px; min-width: 130px; }
    .item-topic .item-date { font-size: 12px; }
    .work img { width: 100%; }
    .work-body { padding:1.5rem 1rem; }
    .work-body .item-btn{text-align: center;}
    .work-title { font-size: 1.5rem; }
    .wrp-posts .item-news,
    .photo-item { width: calc(50% - 0.5rem); }


    /*------SINGLE------*/
    .single-right { border-top: 2px solid #004aad; border-left: none; margin-top: 2rem; padding-top: 2rem; }

    /*------PAGE------*/
    .page-title { font-size: 1.5rem; }
    .page-subtitle{ font-size: 1.2rem; }
    .earthquake-resistant-text { font-size: 1rem; }
    .flow:before{left:19px}
    .step{grid-template-columns:40px 1fr;padding:14px}
    .body{padding-left:0}
    .new-house-container{flex-direction: column; text-align: center;}
    .new-house-text{width: 100%; padding: 20px 0 0;}
    .new-house-maintitle{font-size: 20px;}
    .concept-container{flex-direction: column; text-align: center; margin-bottom: 2rem;}
    .concept-text{width: 100%; padding: 20px 0 15px;}
    .concept-maintitle{font-size: 20px; margin-bottom: 30px;}
    .concept-maintitle-text{font-size: 16px;}
    .concept-maintitle2{font-size: 16px; margin-bottom: 20px;}

    /*contact*/
    .tb-form { font-size: 0.75rem; }

  /*------Footer------*/
  .footer-inner { display: block;}
  .footer-right { margin-top: 1rem; gap: 1rem; }
  .ul-f_nav{width: 50%;}
}