@charset "UTF-8";

/* Office identity: quiet typography, survey-like rules and warm paper. */
html { font-size: 62.5%; scroll-padding-top: 105px; }
body { color: #34332f; font-size: 1.5rem; font-weight: 400; line-height: 2; background: #fffefa; }
.inner { width: calc(100% - 112px); max-width: 1120px; }
.site-header { background: #fffefa; border-bottom-color: #e8e3d9; }
.header-inner .site-logo a { font-family: "Yu Mincho", "Hiragino Mincho ProN", serif; letter-spacing: .06em; font-weight: 600; }
.main-navigation li { border-left: 0; }
#menu a { font-size: 1.3rem; }
.main-navigation .page-header-nav-tel { width: 210px; }
.page-header-nav-tel a { font-size: 2rem !important; padding: 30px 12px !important; }
.page-header-nav-tel a::before { width: 19px; height: 19px; }
.jumbotron { position: relative; margin: 94px 0 110px; min-height: 570px; display: flex; align-items: center; overflow: hidden; background: #f3f0e8; }
.jumbotron > img { position: absolute; width: 65%; height: 100%; right: 0; top: 0; object-fit: cover; object-position: 60% center; }
.jumbotron::after { content: ""; position: absolute; width: 80px; height: 1px; background: #ef7c00; bottom: 42px; left: max(56px, calc((100% - 1120px) / 2)); }
.hero-copy { position: relative; z-index: 1; padding: 65px 40px 80px max(56px, calc((100% - 1120px) / 2)); width: 54%; background: linear-gradient(90deg, #f3f0e8 80%, rgba(243,240,232,.94)); }
.eyebrow { color: #9a581d; font-size: 1.2rem; font-weight: 500; letter-spacing: .16em; line-height: 1.8; }
.hero-copy h2 { margin: 22px 0; font-family: "Yu Mincho", "Hiragino Mincho ProN", serif; font-size: clamp(3.4rem, 3.7vw, 5.5rem); letter-spacing: .09em; line-height: 1.65; font-weight: 500; }
.hero-copy > p { font-size: 1.4rem; letter-spacing: .08em; }
.hero-link { display: inline-flex; gap: 40px; margin-top: 25px; padding-bottom: 8px; border-bottom: 1px solid #bda98e; color: inherit; font-size: 1.3rem; text-decoration: none; }
.hero-link span { color: #b56016; }
.section-heading { margin-bottom: 45px; }
.section-heading .eyebrow { margin-bottom: 15px; color: #75695c; font-size: 1.3rem; font-weight: 400; letter-spacing: .04em; }
.content-header-blue { margin: 0; padding: 0; background: none; color: #34332f; text-align: left; font: 500 clamp(2.5rem, 3vw, 3.6rem)/1.6 "Yu Mincho", "Hiragino Mincho ProN", serif; letter-spacing: .05em; }
.content-header-blue::after { display: none; }
.top-greeting { display: grid; grid-template-columns: 1fr 1.4fr; column-gap: 70px; margin-bottom: 120px; }
.top-greeting .section-heading { grid-row: span 2; }
.top-greeting .txtblock { width: 100%; text-align: left; font-size: 1.5rem; line-height: 2.3; }
.top-greeting .ta-c { grid-column: 2; text-align: right; margin-top: 25px; font-family: "Yu Mincho", serif; }
.top-company { padding-top: 65px; border-top: 1px solid #d9d2c5; margin-bottom: 110px; }
.top-company-info { display: grid; grid-template-columns: minmax(0, 1.65fr) minmax(0, 1fr); gap: 55px; align-items: start; }
.top-company-info-table { border: 0; margin: 0; width: 100%; font-size: 1.4rem; }
.top-company-info-table th, .top-company-info-table td { border: 0; border-bottom: 1px solid #e3ded4; padding: 19px 0; text-align: left; vertical-align: top; }
.top-company-info-table tr th:nth-of-type(1) { background: transparent; color: #82766a; width: 135px; font-weight: 400; padding-right: 18px; }
.top-company-info-table td { overflow-wrap: anywhere; }
.top-company-info-map-1clm { width: 100%; margin: 0; padding: 10px; background: #eeeae1; }
.top-company-info-map-1clm iframe { display: block; height: 400px; }
.top-products { margin-bottom: 110px; }
.top-products > ul { gap: 34px; counter-reset: service; }
.top-products > ul > li { width: calc((100% - 68px) / 3); counter-increment: service; position: relative; }
.top-products > ul > li::before { content: "0" counter(service); display: block; color: #b5651e; font: 400 2rem/1 Georgia, serif; margin-bottom: 16px; }
.top-products > ul > li > img { aspect-ratio: 4 / 3; }
.top-products .product-detail { padding: 24px 0 0; }
.top-products .product-detail dt { font: 500 2.1rem/1.6 "Yu Mincho", serif; text-align: left; margin-bottom: 9px; }
.service-en { text-align: left; font: 400 1.2rem/1.6 Georgia, serif; letter-spacing: .12em; color: #9a581d; margin-bottom: 20px; }
.top-products .service-list li { border-bottom: 1px solid #e8e3d9; padding: 8px 0; font-size: 1.4rem; }
.top-products .service-list li::before { display: none; }
#contact { background: #f3f0e8; padding: 80px 0; margin: 0; }
#contact .inner { max-width: 900px; }
#contact .txtblock { width: 100%; font-size: 1.4rem; margin-bottom: 30px; }
.privacy-policy { border-top: 1px solid #d7cebf; border-bottom: 1px solid #d7cebf; margin-bottom: 35px; }
.privacy-policy summary { padding: 15px 0; cursor: pointer; font-size: 1.3rem; }
.privacy-policy .contact-detail { height: auto; max-height: 280px; background: #fffefa; margin: 0 0 20px; overflow: auto; }
.form-note { font-size: 1.2rem; color: #75695c; margin-bottom: 16px; }
#contact .table { width: 100%; }
#contact .table tr { border-top: 1px solid #ded7ca; }
#contact .table tr th { width: 26%; text-align: left; vertical-align: top; padding: 26px 20px 26px 0; font-size: 1.4rem; font-weight: 400; }
#contact .table tr td { padding: 20px 0; }
#contact .table br.sp { display: none; }
#contact .required { display: inline-block; margin-left: 10px; font-size: 1rem; line-height: 1.8; padding: 0 5px; border: 1px solid #c58e5c; color: #975018; }
#contact input[type="text"], #contact input[type="email"], #contact input[type="tel"], #contact textarea { width: 100%; max-width: 100%; border: 1px solid #d6cfc2; background: #fffefa; border-radius: 3px; padding: 14px 16px; font: inherit; font-size: 1.5rem; color: #34332f; box-shadow: none; }
#contact textarea { resize: vertical; min-height: 160px; }
#contact input::placeholder, #contact textarea::placeholder { color: #9a9389; opacity: 1; }
a:focus-visible, summary:focus-visible, #contact input:focus-visible, #contact textarea:focus-visible { outline: 2px solid #a95613; outline-offset: 4px; }
#contact .checkbox { display: inline-flex; align-items: center; gap: 10px; font-size: 1.4rem; }
#contact .checkbox input[type="checkbox"] { display: inline-block; width: 19px; height: 19px; accent-color: #bd661b; }
#contact .checkbox span { padding: 0; }
#contact .checkbox span::before, #contact .checkbox span::after { display: none; }
#contact .form-btn { display: flex; align-items: center; justify-content: center; gap: 30px; margin: 32px 0 0; }
#contact .form-btn li { display: block; padding: 0; width: auto; }
#contact .form-btn a { background: none; color: #75695c; font-size: 1.2rem; padding: 10px 0; border-bottom: 1px solid #aca18e; }
#contact .form-btn input[type="submit"] { background: #bd641a; border-radius: 3px; font-size: 1.4rem; padding: 20px 44px; cursor: pointer; }
#contact .form-btn input[type="submit"]:hover { background: #a65412; }
.page-footer { padding: 55px 0; background: #333; color: #fff; }
.page-footer-logo { font-family: "Yu Mincho", serif; letter-spacing: .06em; }
@media (min-width: 770px) and (max-width: 1250px) {
  .page-header-nav-tel a { padding: 25px 10px !important; font-size: 1.6rem !important; }
  .main-navigation .page-header-nav-tel { width: 180px; }
  .jumbotron { margin-top: 78px; }
}
@media (max-width: 769px) {
  html { font-size: 62.5%; scroll-padding-top: 75px; }
  .inner { width: calc(100% - 40px); }
  .header-inner .site-logo { top: 0; padding: 23px 0 0 16px; left: 0; }
  .header-inner .site-logo a { font-size: 1.4rem; letter-spacing: 0; }
  .jumbotron { margin: 60px 0 65px; min-height: 0; display: block; padding-top: 225px; }
  .jumbotron > img { width: 100%; height: 265px; object-position: center; }
  .jumbotron > img.pc { display: none; }
  .hero-copy { width: calc(100% - 20px); padding: 30px 24px 45px; background: #f3f0e8; }
  .hero-copy h2 { font-size: 3.5rem; margin: 15px 0; }
  .hero-copy > p { font-size: 1.3rem; }
  .jumbotron::after { left: 24px; bottom: 20px; width: 45px; }
  .eyebrow { font-size: 1.1rem; }
  .section-heading { margin-bottom: 28px; }
  .content-header-blue { font-size: 2.6rem; line-height: 1.65; }
  .top-greeting { display: block; margin-bottom: 65px; }
  .top-greeting .txtblock { font-size: 1.4rem; line-height: 2.2; }
  .top-greeting .txtblock br { display: none; }
  .top-greeting .ta-c { font-size: 1.4rem; }
  .top-company { padding-top: 40px; margin-bottom: 65px; }
  .top-company-info { display: block; }
  .top-company-info-table { font-size: 1.3rem; margin-bottom: 30px; }
  .top-company-info-table tr th:nth-of-type(1) { width: 100px; padding-right: 12px; }
  .top-company-info-table th, .top-company-info-table td { padding-top: 15px; padding-bottom: 15px; }
  .top-company-info-map-1clm iframe { height: 280px; }
  .top-products { margin-bottom: 65px; }
  .top-products > ul { display: block; }
  .top-products > ul > li { width: 100%; margin-bottom: 40px; }
  .top-products > ul > li > img { max-height: 260px; }
  .top-products .product-detail dt { font-size: 2rem; }
  .service-en { font-size: 1.2rem; }
  #contact { padding: 50px 0; }
  #contact .table, #contact .table tbody, #contact .table tr, #contact .table tr th, #contact .table tr td { display: block; width: 100%; }
  #contact .table tr th { padding: 18px 0 0; }
  #contact .table tr td { padding: 10px 0 20px; }
  #contact input[type="text"], #contact input[type="email"], #contact input[type="tel"], #contact textarea { font-size: 16px; }
  #contact .checkbox { margin: 6px 15px 6px 0; }
  #contact .checkbox + .checkbox { margin-left: 0; }
  #contact .form-btn { flex-direction: column-reverse; gap: 18px; }
  #contact .form-btn li:last-child, #contact .form-btn input[type="submit"] { width: 100%; }
  .page-footer { padding: 40px 0; }
  .page-footer-logo { font-size: 1.8rem; }
  .page-footer-info { font-size: 1.3rem; }
}
