@charset "utf-8";

/* Migrated from editor CSS for Sibloo compatibility. */
* {
  box-sizing: border-box;
}

body {
  margin: 0;
}

* {
  box-sizing: border-box;
}

.case-page {
  background-image: none;
  background-position: 0% 0%;
  background-size: auto;
  background-repeat: repeat;
  background-origin: padding-box;
  background-clip: border-box;
  background-attachment: scroll;
  background-color: rgb(255, 254, 251);
  background: rgb(255, 254, 251);
  color: rgb(51, 64, 52);
  font-family: "Noto Sans JP", sans-serif;
}

body .top-header {
  background-color: rgb(41, 58, 44);
  position: relative;
  z-index: 10;
}

body .top-header-name,
body .top-header-link {
  color: rgb(255, 255, 255);
}

body .top-header-sub {
  color: rgba(255, 255, 255, 0.8);
}

.case-hero {
  min-height: 475px;
  overflow: hidden;
  padding-top: 78px;
  padding-right: 6%;
  padding-bottom: 76px;
  padding-left: 6%;
  padding: 78px 6% 76px;
  position: relative;
  background-image: url("https://masakenchiku.jp/uploads/cases/4/6a64d8de4009a4.jpg");
  background-position: 0% 0%;
  background-size: cover;
  background-repeat: no-repeat;
  background-origin: padding-box;
  background-clip: border-box;
  background-attachment: scroll;
  background-color: transparent;
  background: url("https://masakenchiku.jp/uploads/cases/4/6a64d8de4009a4.jpg") 0% 0% / cover no-repeat;
}

.case-hero-overlay {
  background-image: linear-gradient(90deg, rgba(35, 49, 37, 0.94) 0%, rgba(35, 49, 37, 0.76) 39%, rgba(35, 49, 37, 0.1) 73%);
  background-position: 0% 0%;
  background-size: auto;
  background-repeat: repeat;
  background-origin: padding-box;
  background-clip: border-box;
  background-attachment: scroll;
  background-color: transparent;
  background: linear-gradient(90deg, rgba(35, 49, 37, 0.94) 0%, rgba(35, 49, 37, 0.76) 39%, rgba(35, 49, 37, 0.1) 73%);
  inset: 0px;
  position: absolute;
}

.case-hero-content {
  margin-top: 0px;
  margin-right: auto;
  margin-bottom: 0px;
  margin-left: auto;
  margin: 0px auto;
  max-width: 1180px;
  position: relative;
}

.case-breadcrumb {
  color: rgba(255, 255, 255, 0.72);
  font-family: "Noto Serif JP", serif;
  font-size: 11px;
  letter-spacing: 0.1em;
  margin-top: 0px;
  margin-right: 0px;
  margin-bottom: 0px;
  margin-left: 0px;
  margin: 0px;
}

.case-breadcrumb > i {
  color: rgba(255, 255, 255, 0.48);
  margin-top: 0px;
  margin-right: 11px;
  margin-bottom: 0px;
  margin-left: 11px;
  margin: 0px 11px;
}

.case-hero-title {
  color: rgb(255, 255, 255);
  font-family: "Noto Serif JP", serif;
  font-size: 46px;
  font-weight: 600;
  letter-spacing: 0.1em;
  line-height: 1.45;
  margin-top: 64px;
  margin-right: 0px;
  margin-bottom: 0px;
  margin-left: 0px;
  margin: 64px 0px 0px;
}

.case-hero-lead {
  color: rgba(255, 255, 255, 0.94);
  font-size: 15px;
  letter-spacing: 0.06em;
  line-height: 2;
  margin-top: 18px;
  margin-right: 0px;
  margin-bottom: 0px;
  margin-left: 0px;
  margin: 18px 0px 0px;
}

.case-intro {
  align-items: center;
  background-image: none;
  background-position: 0% 0%;
  background-size: auto;
  background-repeat: repeat;
  background-origin: padding-box;
  background-clip: border-box;
  background-attachment: scroll;
  background-color: rgb(244, 240, 233);
  background: rgb(244, 240, 233);
  border-bottom: 1px solid rgb(230, 224, 215);
  border-bottom-width: 1px;
  border-bottom-style: solid;
  border-bottom-color: rgb(230, 224, 215);
  display: flex;
  justify-content: center;
  min-height: 146px;
  padding-top: 30px;
  padding-right: 24px;
  padding-bottom: 30px;
  padding-left: 24px;
  padding: 30px 24px;
  text-align: left;
}

.case-intro-inner {
  margin-top: 0px;
  margin-right: auto;
  margin-bottom: 0px;
  margin-left: auto;
  margin: 0px auto;
  max-width: 1180px;
  width: 100%;
}

.case-intro p {
  color: rgb(101, 105, 95);
  font-family: "Noto Serif JP", serif;
  font-size: 15px;
  letter-spacing: 0.07em;
  line-height: 2;
  margin-top: 0px;
  margin-right: 0px;
  margin-bottom: 0px;
  margin-left: 0px;
  margin: 0px;
}

.case-works {
  padding-top: 85px;
  padding-right: 6%;
  padding-bottom: 110px;
  padding-left: 6%;
  padding: 85px 6% 110px;
}

.case-container {
  margin-top: 0px;
  margin-right: auto;
  margin-bottom: 0px;
  margin-left: auto;
  margin: 0px auto;
  max-width: 1180px;
}

.case-section-title {
  color: rgb(60, 74, 58);
  font-family: "Noto Serif JP", serif;
  font-size: 34px;
  font-weight: 600;
  letter-spacing: 0.12em;
  margin-top: 0px;
  margin-right: 0px;
  margin-bottom: 0px;
  margin-left: 0px;
  margin: 0px;
  text-align: center;
}

.case-works .webgene-blog {
  display: grid;
  gap: 30px 26px;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin-top: 48px;
}

.case-works .webgene-blog .webgene-item.case-card {
  background-color: rgb(255, 255, 255);
  border-width: 1px;
  border-top-width: 1px;
  border-right-width: 1px;
  border-bottom-width: 1px;
  border-left-width: 1px;
  border-style: solid;
  border-top-style: solid;
  border-right-style: solid;
  border-bottom-style: solid;
  border-left-style: solid;
  border-color: rgb(230, 225, 216);
  border-top-color: rgb(230, 225, 216);
  border-right-color: rgb(230, 225, 216);
  border-bottom-color: rgb(230, 225, 216);
  border-left-color: rgb(230, 225, 216);
  border-top: 1px solid rgb(230, 225, 216);
  border-right: 1px solid rgb(230, 225, 216);
  border-bottom: 1px solid rgb(230, 225, 216);
  border-left: 1px solid rgb(230, 225, 216);
  border-image: none;
  display: flex !important;
  flex-direction: column;
  margin-top: 0px !important;
  margin-right: 0px !important;
  margin-bottom: 0px !important;
  margin-left: 0px !important;
  margin: 0px !important;
  overflow: hidden;
  width: auto !important;
}

.case-works .webgene-blog .case-card-link {
  color: inherit;
  display: flex;
  flex-grow: 1;
  flex-shrink: 1;
  flex-basis: auto;
  flex: 1 1 auto;
  flex-direction: column;
  text-decoration: none;
}

.case-works .webgene-blog .case-card-link:focus-visible {
  outline: 2px solid rgb(174, 119, 56);
  outline-offset: -3px;
}

.case-works .webgene-blog .case-card-image {
  aspect-ratio: 1.42 / 1;
  display: block !important;
  height: auto !important;
  max-width: 100% !important;
  object-fit: cover;
  width: 100% !important;
}

.case-works .webgene-blog .case-card-body {
  display: flex !important;
  flex-grow: 1;
  flex-shrink: 1;
  flex-basis: 0%;
  flex: 1 1 0%;
  flex-direction: column;
  padding-top: 17px;
  padding-right: 16px;
  padding-bottom: 20px;
  padding-left: 16px;
  padding: 17px 16px 20px;
}

.case-works .webgene-blog .case-card-labels {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  margin-top: 0px;
  margin-right: 0px;
  margin-bottom: 10px;
  margin-left: 0px;
  margin: 0px 0px 10px;
}

.case-works .webgene-blog .case-card-label {
  border-width: 1px;
  border-style: solid;
  border-color: rgb(174, 119, 56);
  border-top: 1px solid rgb(174, 119, 56);
  border-top-width: 1px;
  border-top-style: solid;
  border-top-color: rgb(174, 119, 56);
  border-right: 1px solid rgb(174, 119, 56);
  border-right-width: 1px;
  border-right-style: solid;
  border-right-color: rgb(174, 119, 56);
  border-bottom: 1px solid rgb(174, 119, 56);
  border-bottom-width: 1px;
  border-bottom-style: solid;
  border-bottom-color: rgb(174, 119, 56);
  border-left: 1px solid rgb(174, 119, 56);
  border-left-width: 1px;
  border-left-style: solid;
  border-left-color: rgb(174, 119, 56);
  border-image: none;
  font-size: 12px;
  font-weight: 500;
  letter-spacing: 0.08em;
  line-height: 1.4;
  padding-top: 4px;
  padding-right: 9px;
  padding-bottom: 4px;
  padding-left: 9px;
  padding: 4px 9px;
}

.case-works .webgene-blog .case-card-label-type {
  background-image: none;
  background-position: 0% 0%;
  background-size: auto;
  background-repeat: repeat;
  background-origin: padding-box;
  background-clip: border-box;
  background-attachment: scroll;
  background-color: rgb(174, 119, 56);
  background: rgb(174, 119, 56);
  color: rgb(255, 255, 255);
}

.case-works .webgene-blog .case-card-label-feature {
  background-image: none;
  background-position: 0% 0%;
  background-size: auto;
  background-repeat: repeat;
  background-origin: padding-box;
  background-clip: border-box;
  background-attachment: scroll;
  background-color: rgb(255, 255, 255);
  background: rgb(255, 255, 255);
  color: rgb(140, 91, 36);
}

.case-card h3 {
  color: rgb(57, 69, 56);
  font-size: 19px;
  font-weight: 600;
  letter-spacing: 0.04em;
  line-height: 1.55;
  margin-top: 0px;
  margin-right: 0px;
  margin-bottom: 0px;
  margin-left: 0px;
  margin: 0px;
}

.case-pagination-direction span {
  color: rgb(128, 134, 126);
  font-size: 19px;
  line-height: 1;
}

.case-pagination button:disabled {
  cursor: default;
  opacity: 0.38;
}

.case-card[hidden] {
  display: none;
}

@media (max-width: 920px) {
  .case-hero {
    min-height: 440px;
    padding-top: 65px;
  }

  .case-hero-title {
    font-size: 39px;
  }

  .case-works .webgene-blog {
    gap: 22px;
  }

  .case-card h3 {
    font-size: 18px;
  }
}

@media (max-width: 767px) {
  .case-hero {
    min-height: 490px;
    padding-top: 88px;
    padding-right: 22px;
    padding-bottom: 55px;
    padding-left: 22px;
    padding: 88px 22px 55px;
    background-position: 62% center;
  }

  .case-hero-overlay {
    background-image: linear-gradient(90deg, rgba(35, 49, 37, 0.92), rgba(35, 49, 37, 0.62));
    background-position: 0% 0%;
    background-size: auto;
    background-repeat: repeat;
    background-origin: padding-box;
    background-clip: border-box;
    background-attachment: scroll;
    background-color: transparent;
    background: linear-gradient(90deg, rgba(35, 49, 37, 0.92), rgba(35, 49, 37, 0.62));
  }

  .case-hero-title {
    font-size: 30px;
    letter-spacing: 0.08em;
    margin-top: 52px;
  }

  .case-hero-lead {
    font-size: 13px;
    line-height: 1.9;
  }

  .case-hero-lead br {
    display: none;
  }

  .case-intro {
    min-height: 164px;
    padding-top: 29px;
    padding-right: 24px;
    padding-bottom: 29px;
    padding-left: 24px;
    padding: 29px 24px;
    text-align: left;
  }

  .case-intro p {
    font-size: 12px;
    line-height: 1.95;
  }

  .case-intro p br {
    display: none;
  }

  .case-works {
    padding-top: 55px;
    padding-right: 22px;
    padding-bottom: 70px;
    padding-left: 22px;
    padding: 55px 22px 70px;
  }

  .case-section-title {
    font-size: 28px;
  }

  .case-works .webgene-blog {
    grid-template-columns: 1fr;
    margin-top: 34px;
  }

  .case-card h3 {
    font-size: 19px;
  }
}

.sbl-line-break {
  display: block;
}

/* 2026-07 content-width and typography */
.case-hero-content, .case-intro-inner, .case-container, .case-consultation-inner { max-width: 1100px; }
.case-page h1 { font-size: 42px; }
.case-page h2 { font-size: 30px; }
.case-page h3 { font-size: 20px; }
.case-page h4 { font-size: 18px; }
.case-page p { font-size: 16px; }
.case-page .case-breadcrumb { font-size: 14px; }
.case-page .case-consultation-button { font-size: 16px; }
@media (max-width: 767px) { .case-page h1 { font-size: 32px; } .case-page h2 { font-size: 24px; } }

*{box-sizing:border-box}

/* Use the plan page's two-column hero while retaining the case page content. */
@media (min-width:768px){
  .case-hero{background:#f5f0ea;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);min-height:460px;padding:0}
  .case-hero-overlay{display:none}
  .case-hero-content{align-self:center;grid-column:1;grid-row:1;margin:0;max-width:none;padding:64px 48px 64px max(24px,calc((100vw - 1100px) / 2));width:100%;z-index:1}
  .case-hero-image{border-radius:9999px 0 0 9999px;grid-column:2;grid-row:1;overflow:hidden;width:100%}
  .case-hero-image img{display:block;height:100%;object-fit:cover;width:100%}
  .case-hero-title{color:rgb(43,42,38);font-family:"Noto Serif JP","Noto Serif CJK JP","Hiragino Mincho ProN","Yu Mincho",serif;font-size:42px;font-weight:500;letter-spacing:.04em;line-height:1.1;margin:0 0 32px}
  .case-hero-lead{color:rgb(51,48,43);font-family:"Noto Serif JP","Noto Serif CJK JP","Hiragino Mincho ProN","Yu Mincho",serif;font-size:24px;font-weight:500;letter-spacing:.06em;line-height:1.75;margin:0 0 28px}
  .case-breadcrumb{display:none}
}
@media (max-width:767px){.case-hero-image{display:none}}

@media (max-width:767px){
  .case-hero{background:#f5f0ea;display:block;min-height:0;padding:0}
  .case-hero-overlay{display:none}
  .case-hero-content{margin:0;max-width:none;padding:40px 24px 32px;width:100%}
  .case-hero-image{border-radius:0;display:block;height:260px;overflow:hidden;width:100%}
  .case-hero-image img{display:block;height:100%;object-fit:cover;width:100%}
  .case-hero-title{color:rgb(43,42,38);font-size:32px;font-weight:500;letter-spacing:.04em;line-height:1.2;margin:0 0 24px}
  .case-hero-lead{color:rgb(51,48,43);font-size:16px;line-height:1.75;margin:0}
  .case-breadcrumb{display:none}
}

*{box-sizing:border-box}

.case-page{background-image:none;background-position:0% 0%;background-size:auto;background-repeat:repeat;background-origin:padding-box;background-clip:border-box;background-attachment:scroll;background-color:rgb(255,254,251);background:rgb(255,254,251);color:rgb(51,64,52);font-family:"Noto Sans JP",sans-serif}

body .top-header{background-color:rgb(41,58,44);position:relative;z-index:10}

.case-hero{min-height:475px;overflow:hidden;padding-top:78px;padding-right:6%;padding-bottom:76px;padding-left:6%;padding:78px 6% 76px;position:relative;background-image:url(https://masakenchiku.jp/system_panel/uploads/images/20260725160733724327.jpeg);background-position:0% 0%;background-size:cover;background-repeat:no-repeat;background-origin:padding-box;background-clip:border-box;background-attachment:scroll;background-color:transparent;background:url(https://masakenchiku.jp/system_panel/uploads/images/20260725160733724327.jpeg)0% 0%/cover no-repeat}

.case-hero-overlay{background-image:linear-gradient(90deg,rgba(35,49,37,0.94) 0%,rgba(35,49,37,0.76) 39%,rgba(35,49,37,0.1) 73%);background-position:0% 0%;background-size:auto;background-repeat:repeat;background-origin:padding-box;background-clip:border-box;background-attachment:scroll;background-color:transparent;background:linear-gradient(90deg,rgba(35,49,37,0.94) 0%,rgba(35,49,37,0.76) 39%,rgba(35,49,37,0.1) 73%);inset:0px;position:absolute}

.case-intro{align-items:center;background-image:none;background-position:0% 0%;background-size:auto;background-repeat:repeat;background-origin:padding-box;background-clip:border-box;background-attachment:scroll;background-color:rgb(244,240,233);background:rgb(244,240,233);border-bottom:1px solid rgb(230,224,215);border-bottom-width:1px;border-bottom-style:solid;border-bottom-color:rgb(230,224,215);display:flex;justify-content:center;min-height:146px;padding-top:30px;padding-right:24px;padding-bottom:30px;padding-left:24px;padding:30px 24px;text-align:center}

.case-works .webgene-blog{display:grid;gap:30px 26px;grid-template-columns:repeat(3,minmax(0,1fr));margin-top:48px}

.case-works .webgene-blog .webgene-item.case-card{background-color:rgb(255,255,255);border-width:1px;border-top-width:1px;border-right-width:1px;border-bottom-width:1px;border-left-width:1px;border-style:solid;border-top-style:solid;border-right-style:solid;border-bottom-style:solid;border-left-style:solid;border-color:rgb(230,225,216);border-top-color:rgb(230,225,216);border-right-color:rgb(230,225,216);border-bottom-color:rgb(230,225,216);border-left-color:rgb(230,225,216);border-top:1px solid rgb(230,225,216);border-right:1px solid rgb(230,225,216);border-bottom:1px solid rgb(230,225,216);border-left:1px solid rgb(230,225,216);border-image:none;display:flex!important;flex-direction:column;margin-top:0px!important;margin-right:0px!important;margin-bottom:0px!important;margin-left:0px!important;margin:0px!important;overflow:hidden;width:auto!important}

.case-works .webgene-blog .case-card-link{color:inherit;display:flex;flex-grow:1;flex-shrink:1;flex-basis:auto;flex:1 1 auto;flex-direction:column;text-decoration:none}

.case-works .webgene-blog .case-card-link:focus-visible{outline:2px solid rgb(174,119,56);outline-offset:-3px}

.case-works .webgene-blog .case-card-image{aspect-ratio:1.42/1;display:block!important;height:auto!important;max-width:100%!important;object-fit:cover;width:100%!important}

.case-works .webgene-blog .case-card-body{display:flex!important;flex-grow:1;flex-shrink:1;flex-basis:0%;flex:1 1 0%;flex-direction:column;padding-top:17px;padding-right:16px;padding-bottom:20px;padding-left:16px;padding:17px 16px 20px}

.case-pagination button:disabled{cursor:default;opacity:0.38}

.case-consultation{background-color:rgb(245,241,234);border-top:1px solid rgb(232,227,217);border-top-width:1px;border-top-style:solid;border-top-color:rgb(232,227,217);padding-top:48px;padding-right:6%;padding-bottom:48px;padding-left:6%;padding:48px 6%}

.case-consultation-inner{align-items:center;display:grid;gap:22px;grid-template-columns:minmax(260px,1.35fr) 82px minmax(190px,0.9fr) minmax(190px,0.9fr);margin-top:0px;margin-right:auto;margin-bottom:0px;margin-left:auto;margin:0px auto;max-width:1120px}

.case-consultation-copy{min-width:0px}

.case-consultation-vase{display:block;height:auto;justify-self:center;max-width:82px;width:100%}

.case-consultation-actions{display:flex;gap:14px;grid-column:3/5}

.case-consultation-button{align-items:center;border-width:1px;border-top-width:1px;border-right-width:1px;border-bottom-width:1px;border-left-width:1px;border-style:solid;border-top-style:solid;border-right-style:solid;border-bottom-style:solid;border-left-style:solid;border-color:rgb(91,102,87);border-top-color:rgb(91,102,87);border-right-color:rgb(91,102,87);border-bottom-color:rgb(91,102,87);border-left-color:rgb(91,102,87);border-top:1px solid rgb(91,102,87);border-right:1px solid rgb(91,102,87);border-bottom:1px solid rgb(91,102,87);border-left:1px solid rgb(91,102,87);border-image:none;color:rgb(57,69,56);display:flex;flex-grow:1;flex-shrink:1;flex-basis:0%;flex:1 1 0%;font-family:"Noto Serif JP",serif;font-size:13px;justify-content:center;letter-spacing:0.04em;min-height:52px;padding-top:10px;padding-right:16px;padding-bottom:10px;padding-left:16px;padding:10px 16px;text-align:center;text-decoration:none}

@media (max-width:920px){.case-hero{min-height:440px;padding-top:65px}.case-hero-title{font-size:39px}.case-works .webgene-blog{gap:22px}.case-card h3{font-size:18px}.case-consultation-inner{gap:18px;grid-template-columns:minmax(230px,1fr) 68px minmax(160px,1fr)}.case-consultation-actions{grid-column:3;flex-direction:column}.case-consultation-vase{max-width:68px}}

@media (max-width:767px){.case-hero{min-height:490px;padding-top:88px;padding-right:22px;padding-bottom:55px;padding-left:22px;padding:88px 22px 55px;background-position:62%center}.case-hero-overlay{background-image:linear-gradient(90deg,rgba(35,49,37,0.92),rgba(35,49,37,0.62));background-position:0% 0%;background-size:auto;background-repeat:repeat;background-origin:padding-box;background-clip:border-box;background-attachment:scroll;background-color:transparent;background:linear-gradient(90deg,rgba(35,49,37,0.92),rgba(35,49,37,0.62))}.case-hero-title{font-size:30px;letter-spacing:0.08em;margin-top:52px}.case-hero-lead{font-size:13px;line-height:1.9}.case-hero-lead br{display:none}.case-intro{min-height:164px;padding-top:29px;padding-right:24px;padding-bottom:29px;padding-left:24px;padding:29px 24px;text-align:left}.case-intro p{font-size:12px;line-height:1.95}.case-intro p br{display:none}.case-works{padding-top:55px;padding-right:22px;padding-bottom:70px;padding-left:22px;padding:55px 22px 70px}.case-section-title{font-size:28px}.case-works .webgene-blog{grid-template-columns:1fr;margin-top:34px}.case-card h3{font-size:19px}.case-consultation{padding-top:38px;padding-right:22px;padding-bottom:38px;padding-left:22px;padding:38px 22px}.case-consultation-inner{align-items:stretch;display:flex;flex-direction:column;gap:24px}.case-consultation-copy h2{font-size:20px}.case-consultation-copy p{font-size:12px}.case-consultation-vase{align-self:center;margin-top:-12px;max-width:70px}.case-consultation-actions{flex-direction:column}.case-consultation-button{font-size:12px;min-height:49px}}

*{box-sizing:border-box}

/* Final desktop precedence for the plan-style case hero. */
@media (min-width:768px){
  .case-hero{background:#f5f0ea;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);min-height:460px;padding:0}
  .case-hero-overlay{display:none}
  .case-hero-content{align-self:center;grid-column:1;grid-row:1;margin:0;max-width:none;padding:64px 48px 64px max(24px,calc((100vw - 1100px) / 2));width:100%;z-index:1}
  .case-hero-image{border-radius:9999px 0 0 9999px;grid-column:2;grid-row:1;overflow:hidden;width:100%}
  .case-hero-image img{display:block;height:100%;object-fit:cover;width:100%}
  .case-hero-title{color:rgb(43,42,38);font-family:"Noto Serif JP","Noto Serif CJK JP","Hiragino Mincho ProN","Yu Mincho",serif;font-size:42px;font-weight:500;letter-spacing:.04em;line-height:1.1;margin:0 0 32px}
  .case-hero-lead{color:rgb(51,48,43);font-family:"Noto Serif JP","Noto Serif CJK JP","Hiragino Mincho ProN","Yu Mincho",serif;font-size:24px;font-weight:500;letter-spacing:.06em;line-height:1.75;margin:0 0 28px}
  .case-breadcrumb{display:none}
}
@media (max-width:767px){.case-hero-image{display:none}}

*{box-sizing:border-box}

*{box-sizing:border-box}

*{box-sizing:border-box}

*{box-sizing:border-box}

*{box-sizing:border-box}

*{box-sizing:border-box}

*{box-sizing:border-box}
