@charset "UTF-8";
/* =========================================================
   Web Up 基本設定（全ページ）
   旧「カスタム CSS & JS」プラグインで指定していた内容のうち、
   リニューアル後も必要なものを整理して移したものです。
   ========================================================= */

/* ---------- フォント（Google Fonts は functions.php で読み込み） ---------- */
body, input, textarea, select, button { font-family: "Lato", "Noto Sans JP", sans-serif; }
.font-mincho { font-family: "Noto Serif JP", serif; }

/* ---------- 全体 ---------- */
html { scroll-behavior: smooth; }
:target { scroll-margin-top: 80px; }
@media (max-width: 599px) { :target { scroll-margin-top: 64px; } }
.l-content { margin-bottom: 0 !important; }
.display-none { display: none !important; }
.notce--swlr-no-activated { display: none; }
.c-tabBody__item > p { text-align: center; }
.wp-block-video video { display: block; width: 100%; height: auto; object-fit: cover; border: 0; clip-path: inset(1px); }
.is-style-check_list li::before { color: var(--wu-blue); }

/* ---------- トップページ：ファーストビューをヘッダーの真下（ページ最上部）から始める ---------- */
#body_wrap.home #content { padding: 0; }

/* ---------- ヘッダー ---------- */
#header .c-gnav > .menu-item > a .ttl { letter-spacing: .08em; font-size: 1rem; }
#fix_header .c-gnav > .menu-item > a .ttl { letter-spacing: .05em; font-size: .9rem; }
#header .c-gnav > .menu-item > a { margin: 0 9px; padding: 0 19px; }
#fix_header .c-gnav > .menu-item > a { margin: 0 8px; padding: 0 18px; }
/* 資料請求・お問い合わせを丸いボタンに（色は wu-common.css） */
:is(#header, #fix_header) :is(.menu-item-8677, .menu-item-8678) { display: grid; place-items: center; }
:is(#header, #fix_header) :is(.menu-item-8677, .menu-item-8678) > a { height: 45px; border-radius: 30px; color: #fff; transition: opacity .3s; }
:is(#header, #fix_header) :is(.menu-item-8677, .menu-item-8678) > a:hover { opacity: .7; }
:is(#header, #fix_header) :is(.menu-item-8677, .menu-item-8678) > a::after { display: none; }
#header .sub-menu { padding: 10px; }
#fix_header::before { background: rgba(255, 255, 255, .85); backdrop-filter: blur(4px); -webkit-backdrop-filter: blur(4px); }

/* ---------- スマホ開閉メニュー（画面いっぱい・白ベース。色・文字は wu-common.css） ---------- */
#sp_menu, #sp_menu .p-spMenu__inner { width: 100vw; }
#sp_menu .p-spMenu__inner { padding-top: 0 !important; }
#sp_menu .p-spMenu__inner::before { width: 100vw; }
[data-spmenu="closed"] #sp_menu.-right .p-spMenu__inner,
[data-spmenu="opened"] #sp_menu.-right .p-spMenu__inner { transform: none; }
[data-spmenu="closed"] .p-spMenu { opacity: 0; transition: opacity .2s ease-in; }
[data-spmenu="opened"] .p-spMenu { opacity: 1; transition: opacity .2s ease-out; }
[data-spmenu="opened"] .icon-menu-thin::before { content: "\e920"; }
#sp_menu .c-widget__title.-spmenu { display: none; }
#sp_menu .p-spMenu__body { margin: 0 auto; }
#sp_menu .p-spMenu__nav { position: relative; z-index: 2; margin: 0 auto; }
#sp_menu .c-spnav a { display: block; border-bottom: 0; }
/* サービスの子メニューは開いた状態で表示（JavaScript不使用） */
#sp_menu .c-spnav .sub-menu { display: block; }

/* ---------- フッター ---------- */
.w-beforeFooter { margin: 0 !important; padding-top: 0 !important; background-color: #fff; }

/* ---------- 下層ページ（固定ページ） ---------- */
/* ページタイトル(h1)は本文の見出しと重複するため非表示 */
#body_wrap.page:not(.home) .c-pageTitle { display: none; }
#body_wrap.page:not(.home) #content { padding-top: 2em; }
#body_wrap.page:not(.home) .post_content { margin-top: 0; }
.c-pageTitle { text-align: center; }
.c-pageTitle__subTitle { display: none; }
#top_title_area .u-obf-cover { object-position: top left; }

/* サービス一覧のカード */
#content .p-service-list .wp-block-columns { gap: 1rem !important; }
#content .p-service-list .item { display: flex; flex-direction: column; padding: 20px; }
#content .p-service-list .item h3 { letter-spacing: .05em; font-size: 1.125rem; }
#content .p-service-list .item .swell-block-button { margin-top: auto !important; width: 100%; }
@media (max-width: 599px) { #content .p-service-list .item { padding: 16px 10px 20px; } }

/* 各サービスページ */
#content :is(.c-service-merit, .c-service-service, .c-service-feature, .c-service-onayami) .title { padding: .5em 1.2em; }
@media (max-width: 959px) {
  #content :is(.c-service-merit, .c-service-feature, .c-service-onayami, .c-service-service) .swell-block-columns__inner { gap: 0 !important; }
  #content :is(.c-service-merit, .c-service-feature, .c-service-onayami, .c-service-service) h3 { text-align: left; }
}
@media (max-width: 768px) { #content :is(.c-service-merit, .c-service-service, .c-service-feature, .c-service-onayami) .title { padding: .3em .8em; text-align: left; } }
#content .c-service-plan .wp-block-table table { table-layout: fixed; width: 100%; }
#content .c-service-plan .wp-block-table :is(th, td):first-child { width: 120px; }
#content .c-service-plan .icon img { width: 80px; }
#content .c-service-flow img { width: 300px; }
@media (max-width: 600px) { #content .c-service-osusume .wp-block-media-text__content { margin-top: -2em !important; } }

/* 会社情報の表 */
#body_wrap.page-id-8670 :is(th, td) { padding: 2em; }
@media (max-width: 599px) { #body_wrap.page-id-8670 :is(th, td) { padding: 1em .5em; } }

/* ---------- 制作事例・ブログ ---------- */
[class*="product"] .c-postThumb__figure, #body_wrap.post-type-archive-product .c-postThumb__figure { aspect-ratio: 4 / 3; }
:is(.blog, .product) .p-postList__item .category { padding: 5px 12px; border-radius: 999px; background: var(--wu-pale); color: var(--wu-blue); font-size: .75rem; font-weight: 700; line-height: 1; }
#body_wrap:is(.single-product, .single-blog) .p-articleMetas__termList { display: none; }
#body_wrap:is(.single-product, .single-blog) .p-articleMetas { display: block; }
#body_wrap:is(.single-product, .single-blog) .p-articleMetas__times { margin-top: 10px; }
.post-terms { display: flex; flex-wrap: wrap; gap: 5px; text-align: left; }
.post-terms .c-taxList__link, #body_wrap .post-terms span { display: inline-block; padding: 5px 12px; border-radius: 999px; font-size: .75rem; line-height: 1; }
/* 一覧ページのカテゴリー切り替え */
.taxonomy-block .links { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; }
.taxonomy-block .links > a { display: inline-block; line-height: 1; font-size: 1rem; }
@media (max-width: 599px) { .taxonomy-block .links > a { font-size: .9rem; } }
/* 制作事例の一覧はサイドバーなしで全幅 */
#body_wrap:is([class*="tax-product"], .post-type-archive-product) #sidebar { display: none; }
#body_wrap:is([class*="tax-product"], .post-type-archive-product) #main_content { width: 100%; }
/* サイドバー：投稿の種類ごとに関係するウィジェットだけ表示 */
#body_wrap[class*="blog"] :is(.sidebar-product, .sidebar-info) { display: none !important; }
#body_wrap[class*="product"] :is(.sidebar-blog, .sidebar-info) { display: none !important; }
#body_wrap[class*="info"] :is(.sidebar-blog, .sidebar-product) { display: none !important; }
#sidebar .banner { transition: opacity .3s; }
#sidebar .banner:hover { opacity: .7; }
.p-authorBox__iconList { display: none; }

/* ---------- お問い合わせ・資料請求フォーム（Contact Form 7） ---------- */
@media (min-width: 600px) { .page-contact .l-content { padding-top: 0; } }
.page-contact .confirm_area { display: none; }
.page-contact .wpcf7 br { display: none; }
.page-contact .wpcf7 { width: min(640px, 100%); margin: 0 auto; }
.page-contact .wpcf7 span.required { display: inline-block; margin: 0 10px; padding: 4px 10px; border-radius: 999px; background: var(--wu-blue); color: #fff; font-size: .75em; font-weight: 700; line-height: 1; letter-spacing: .1em; }
.page-contact .wpcf7 :is(input[type="text"], input[type="email"], input[type="tel"], textarea) { width: 100%; margin-top: 6px; padding: .7em .9em; border: 2px solid var(--wu-line); border-radius: 12px; background: #fff; line-height: 1.6; }
.page-contact .wpcf7 :is(input, textarea):focus { border-color: var(--wu-blue); outline: none; }
.page-contact .wpcf7 textarea { min-height: 200px; height: 200px; resize: vertical; }
.page-contact .wpcf7 ::placeholder { color: #b3bccd; }
.page-contact .wpcf7 .fzSmall { font-size: .8em; }
.page-contact .wpcf7 .Form-Item:not(:first-of-type) { margin-top: 22px; }
.page-contact .wpcf7 .btnWrap { margin-top: 40px; }
.page-contact .wpcf7 .btnWrap p { display: flex; align-items: center; justify-content: center; gap: 20px; }
.page-contact .wpcf7 .btnWrap .error-message { display: none; text-align: center; }
.page-contact .wpcf7 :is(input[type="button"], input[type="submit"]) {
  display: grid; place-items: center; width: min(320px, 100%); margin-inline: auto; border: 2px solid var(--wu-blue); border-radius: 999px;
  background: var(--wu-blue); color: #fff; font-size: 17px; font-weight: 700; line-height: 58px; letter-spacing: .08em;
  box-shadow: 0 14px 28px -12px rgba(41, 104, 236, .7); transition: transform .25s, opacity .25s;
}
.page-contact .wpcf7 input[type="submit"]:hover { transform: translateY(-3px); }
.page-contact .wpcf7 input[type="button"] { background: #fff; color: var(--wu-blue); box-shadow: none; }
.page-contact .wpcf7 .wpcf7-spinner { margin: 0; }
.page-contact .wpcf7 .wpcf7-form-control-wrap[data-name="acceptance-985"] { display: block; margin-top: 20px; text-align: center; }
.page-contact .wpcf7 .wpcf7-form-control-wrap[data-name="acceptance-985"] .wpcf7-list-item label { display: flex; align-items: center; }
.page-contact .wpcf7 .wpcf7-form-control-wrap[data-name="acceptance-985"] input { width: 22px; height: 22px; margin-right: 10px; }
.page-contact .Select-Request-Type .wpcf7-list-item { margin: 0 1em 0 0; }
.page-contact .Select-Request-Type .wpcf7-list-item label { display: flex; align-items: center; gap: .5em; margin-top: 10px; padding: .8em 1em; border: 2px solid var(--wu-line); border-radius: 12px; cursor: pointer; transition: border-color .2s; }
.page-contact .Select-Request-Type .wpcf7-list-item label:has(input:checked) { border-color: var(--wu-blue); background: var(--wu-pale); }
.cf7-cf-turnstile { margin: 20px 0 !important; text-align: center; }

/* 送信成功時は、完了ページへ移動するまでの間に出る Contact Form 7 の標準メッセージを表示しない
   （送信エラーや入力不備のメッセージはこれまでどおり表示） */
.wpcf7 form.sent .wpcf7-response-output { display: none !important; }
/* 送信中はボタンを押せない見た目にする */
.wpcf7 form.submitting :is(input[type="submit"], input[type="button"]) { opacity: .6; pointer-events: none; }

/* ---------- 送信完了ページ（お問い合わせ・資料請求） ---------- */
#body_wrap .post_content .wu-thanks { max-width: 720px; margin-inline: auto; padding: clamp(32px, 5vw, 56px) clamp(20px, 5vw, 56px); border-radius: 28px; background: var(--wu-pale); text-align: center; }
#body_wrap .post_content .wu-thanks__icon { display: grid; place-items: center; width: 84px; height: 84px; margin: 0 auto 22px; border-radius: 50%; background: var(--wu-blue); }
#body_wrap .post_content .wu-thanks__icon::before { content: ""; width: 36px; height: 20px; margin-top: -8px; border-left: 5px solid #fff; border-bottom: 5px solid #fff; rotate: -45deg; }
#body_wrap .post_content .wu-thanks__txt { font-size: 16px; line-height: 2; color: var(--wu-ink); }
#body_wrap .post_content .wu-thanks__note { margin-top: 16px; font-size: 13px; color: var(--wu-mute); }
#body_wrap .post_content .wu-thanks__btns { display: flex; flex-wrap: wrap; justify-content: center; gap: 14px; margin-top: 32px; }
#body_wrap .post_content .wu-thanks__btns .wu-btn { text-align: center; }
@media (max-width: 599px) {
  #body_wrap .post_content .wu-thanks__btns { display: grid; }
  #body_wrap .post_content .wu-thanks__btns .swell-block-button__link { width: 100%; }
}