/* 株式会社エム・エム・クリーンサポート — Jimdo テンプレートの見た目を再現した静的版 */
*, *::before, *::after { box-sizing: border-box; }
html, body { margin: 0; }
body {
  background: #f2f2f2;
  color: #888;
  font: 16px/24px "Open Sans", Arial, sans-serif;
  -webkit-text-size-adjust: 100%;
}
img { max-width: 100%; height: auto; border: 0; }
figure { margin: 0; }

/* ---------- global navigation (desktop) ---------- */
.jtpl-navigation { background: #601f27; font-family: "Mulish", sans-serif; }
.jtpl-navigation__container,
.jtpl-header, .jtpl-subnavigation, .jtpl-content, .jtpl-footer { max-width: 960px; margin: 0 auto; }
.jtpl-navigation ul, .jtpl-subnavigation ul { margin: 0; padding: 0; list-style: none; overflow: hidden; }
.jtpl-navigation li, .jtpl-subnavigation li { display: inline; }
.jtpl-navigation a, .jtpl-subnavigation a {
  display: inline-block; color: #fff; text-decoration: none;
  font-size: 13px; line-height: 1.5; padding: 7px 35px;
  transition: background-color 200ms, color 200ms;
}
.jtpl-navigation a { background: #601f27; }
.jtpl-navigation a:hover { background: #4a1820; }

/* ---------- site title ---------- */
.jtpl-header { margin-bottom: 0; padding: 20px 0; text-align: center; }
.jtpl-header__title a { color: #212121; text-decoration: none; font-size: 22px; line-height: 34px; letter-spacing: .02em; }

/* ---------- sub navigation ---------- */
.jtpl-subnavigation { background: #47383a; font-family: "Mulish", sans-serif; }
.jtpl-subnavigation a:hover { background: #5c4a4c; }

/* ---------- content ---------- */
.jtpl-content__container { background: #fff; padding: 25px; display: flow-root; }
.jtpl-sidebar { background: #504f4a; color: #e6e6e6; min-height: 50px; }
.n { padding: 5px; }
.content-options p { margin: 0; }
.content-options h1, .content-options h2, .content-options h3 {
  margin: 0; color: #5f5b55; font-weight: normal;
  font-family: "Noto Serif", Georgia, "Times New Roman", sans-serif;
}
.content-options h1 { font-size: 32px; line-height: 40px; padding: 16px 0 3.2px; }
.content-options h2 { font-size: 24px; line-height: 32px; padding: 12px 0 2.4px; }
.content-options h3 { font-size: 16px; line-height: 24px; padding: 8px 0 1.6px; }
.j-module a, .jtpl-footer a { color: #212121; }
.j-module ul, .j-module ol { margin: 0; }
.j-hr hr { border: 0; border-bottom: 1px solid #ccc; margin: 10px 0; }
.cc-m-spacer { display: block; }
.cc-clear { clear: both; }
.clearover::after, .j-module::after { content: ""; display: table; clear: both; }

/* image modules */
.cc-imagewrapper { position: relative; }
.cc-imagewrapper img { display: inline; max-width: 100%; vertical-align: top; }
.cc-m-image-align-1 { text-align: left; }
.cc-m-image-align-2 { text-align: right; }
.cc-m-image-align-3 { text-align: center; }
.j-textWithImage .cc-m-image-align-1 { float: left; margin: 4px 20px 4px 0; }
.j-textWithImage .cc-m-image-align-2 { float: right; margin: 4px 0 4px 15px; }
.j-textWithImage .cc-imagewrapper.cc-m-width-maxed,
.j-textWithImage .cc-imagewrapper.cc-m-width-maxed img { width: 100%; }

/* horizontal grid */
.j-hgrid { padding: 0 !important; }
.j-hgrid::after { content: ""; display: table; clear: both; }
.cc-m-hgrid-column { float: left; min-height: 1px; padding: 0 2% 0 0; box-sizing: content-box; }
.cc-m-hgrid-column.last { float: right; padding: 0; }

/* gallery: thumbnails (ccgalerie) */
.ccgalerie > div, .ccgalerie > div * { box-sizing: content-box; }
.ccgalerie .thumb_pro1 { float: left; border: 1px solid #ccc; padding: 3px; }
.ccgalerie .innerthumbnail { display: table-cell; text-align: center; vertical-align: middle; }
.ccgalerie .thumb_sq1 { float: left; margin: 0 5px 5px 0; }
.ccgalerie .thumb_sq1 img { display: block; border: 1px solid #ccc; padding: 3px; background: #fff; }
.ccgalerie .thumb_sq1 a:hover img { background: #eee; }

/* gallery: justified rows (cool) */
.cc-m-gallery-cool { display: flex; flex-wrap: wrap; }
.cc-m-gallery-cool-item { flex: var(--r, 1.333) 1 calc(var(--r, 1.333) * 140px); padding: 0 5px 5px 0; }
.cc-m-gallery-cool-item img { display: block; width: 100%; height: auto; }

/* gallery: slider */
.cc-m-gallery-slider ul { margin: 0; padding: 0; list-style: none; }
.mm-slider { position: relative; }
.mm-slider__viewport { position: relative; height: 400px; overflow: hidden; }
.mm-slider__viewport li { position: absolute; inset: 0; opacity: 0; transition: opacity .6s; display: flex; align-items: center; justify-content: center; }
.mm-slider__viewport li.is-active { opacity: 1; z-index: 1; }
.mm-slider__viewport img { width: 100%; height: 100%; max-width: none; object-fit: contain; }
.mm-slider__btn {
  position: absolute; top: 50%; z-index: 2; width: 32px; height: 32px; margin-top: -16px;
  border: 0; border-radius: 50%; background: rgba(0,0,0,.15); color: #fff; cursor: pointer;
  font-size: 18px; line-height: 32px; padding: 0;
}
.mm-slider__btn:hover { background: rgba(0,0,0,.35); }
.mm-slider__btn--prev { left: 10px; }
.mm-slider__btn--next { right: 10px; }
.cc-m-gallery-light-ui .mm-slider__btn { background: rgba(255,255,255,.6); color: #333; }
.mm-slider__caption:empty { display: none; }
.mm-slider__caption { text-align: right; font-size: 13px; padding-right: 8%; }
.mm-slider__thumbs { text-align: center; padding: 6px 0; line-height: 0; }
.mm-slider__thumbs button { width: 25px; height: 25px; margin: 0 1px; padding: 0; border: 0; background: none; cursor: pointer; opacity: .55; }
.mm-slider__thumbs button.is-active, .mm-slider__thumbs button:hover { opacity: 1; }
.mm-slider__thumbs img { width: 25px; height: 25px; object-fit: cover; display: block; }

/* lightbox */
.mm-lightbox { position: fixed; inset: 0; z-index: 1000; background: rgba(0,0,0,.85); display: none; align-items: center; justify-content: center; flex-direction: column; }
.mm-lightbox.is-open { display: flex; }
.mm-lightbox img { max-width: 92vw; max-height: 84vh; background: #fff; padding: 6px; }
.mm-lightbox__title { color: #eee; font-size: 14px; margin-top: 8px; min-height: 20px; }
.mm-lightbox button { position: absolute; background: none; border: 0; color: #fff; font-size: 34px; cursor: pointer; padding: 10px 16px; line-height: 1; }
.mm-lightbox__close { top: 6px; right: 6px; }
.mm-lightbox__prev { left: 4px; top: 50%; transform: translateY(-50%); }
.mm-lightbox__next { right: 4px; top: 50%; transform: translateY(-50%); }

/* contact form */
.j-googleform iframe { display: block; width: 100%; border: 0; }
.mm-form-placeholder { border: 1px dashed #ccc; padding: 24px; text-align: center; }

/* privacy policy */
.mm-policy h3 { margin-top: 18px; }
.mm-policy ul { padding-left: 1.6em; margin: 4px 0; }
.mm-policy p { margin: 4px 0; }
.mm-policy__date { margin-top: 24px !important; text-align: right; }

/* sitemap page */
.j-sitemap ul { padding-left: 1.5em; }
.j-sitemap > ul { padding-left: 0; list-style: none; }
.j-sitemap li { line-height: 2; }

/* ---------- footer ---------- */
.jtpl-footer { padding: 20px 30px; color: #999; }
.j-meta-links { font-size: 12.8px; line-height: 19.2px; }
.j-meta-links a { color: #5f5b55; }

/* ---------- mobile ---------- */
.nav-toggle, .mobile-button, .mobile-navigation { display: none; }
@media (max-width: 767px) {
  .jtpl-navigation, .jtpl-subnavigation { display: none; }
  .mobile-button {
    display: block; position: fixed; top: 0; right: 0; z-index: 900;
    width: 60px; height: 56px; background: rgba(0,0,0,.8); cursor: pointer;
  }
  .mobile-button span, .mobile-button span::before, .mobile-button span::after {
    position: absolute; left: 18px; width: 24px; height: 3px; background: #fff; content: ""; transition: transform .2s;
  }
  .mobile-button span { top: 26px; }
  .mobile-button span::before { left: 0; top: -8px; }
  .mobile-button span::after { left: 0; top: 8px; }
  .nav-toggle:checked ~ .mobile-button span { background: transparent; }
  .nav-toggle:checked ~ .mobile-button span::before { transform: translateY(8px) rotate(45deg); }
  .nav-toggle:checked ~ .mobile-button span::after { transform: translateY(-8px) rotate(-45deg); }
  .nav-toggle:checked ~ .mobile-navigation {
    display: block; position: fixed; inset: 0; z-index: 800; overflow-y: auto;
    background: #fff; padding-top: 56px; font-family: "Mulish", sans-serif;
  }
  .mobile-navigation ul { list-style: none; margin: 0; padding: 0; }
  .mobile-navigation a { display: block; padding: 12px 20px; color: #4c4c4c; text-decoration: none; border-bottom: 1px solid #eee; font-size: 15px; }
  .mobile-navigation .lv1 a { padding-left: 40px; font-size: 14px; }
  .mobile-navigation .is-current > a { background: #f2f2f2; }
  .jtpl-header { padding: 18px 64px 18px 16px; }
  .jtpl-header__title a { font-size: 18px; line-height: 26px; }
  .jtpl-content__container { padding: 15px; }
  .cc-m-hgrid-column, .cc-m-hgrid-column.last { float: none; width: 100% !important; padding: 0; }
  .j-textWithImage .cc-m-image-align-1, .j-textWithImage .cc-m-image-align-2 { float: none; margin: 4px 0 10px; display: block; text-align: center; }
  .mm-slider__viewport { height: 62vw; }
  .ccgalerie > div { width: calc(50% - 15px) !important; height: auto !important; }
  .ccgalerie > div > div { width: auto !important; height: auto !important; display: block; }
  .ccgalerie img { max-width: calc(100% - 8px); height: auto; }
  .jtpl-footer { padding: 20px 16px; }
}