/*
Theme Name: KIQRAS
Theme URI: https://kiqras.com/
Description: キクラス建築「KIQRAS」コーポレートサイト用テーマ
Author: deliver
Version: 1.0.0
Text Domain: kiqras
*/

/* Layout: plain corporate layout — centered section titles (English + Japanese, as on the current site), square corners, text links, indigo from the logo used sparingly. */
:root{
  --bg:#fff; --bg-2:#f4f4f6; --fg:#333; --fg-2:#333; --line:#ddd; --line-2:#333;
  --accent:#1f0688;
  --font:"Noto Sans JP","Hiragino Kaku Gothic ProN","Hiragino Sans","Yu Gothic","Meiryo",sans-serif;
  --en:"Noto Sans JP","Hiragino Kaku Gothic ProN","Hiragino Sans","Yu Gothic","Meiryo",sans-serif;
  --max:1100px; --gl:max(16px,env(safe-area-inset-left,0px)); --gr:max(16px,env(safe-area-inset-right,0px));
}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]){--bg:#1c1c20;--bg-2:#26262b;--fg:#e8e8ea;--fg-2:#e8e8ea;--line:#3a3a42;--line-2:#e8e8ea;--accent:#a596ff;color-scheme:dark}}
:root[data-theme="dark"]{--bg:#1c1c20;--bg-2:#26262b;--fg:#e8e8ea;--fg-2:#e8e8ea;--line:#3a3a42;--line-2:#e8e8ea;--accent:#a596ff;color-scheme:dark}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;overflow-x:clip}
body{margin:0;background:var(--bg);color:var(--fg);font-family:var(--font);font-size:15px;line-height:2;letter-spacing:.04em}
img{max-width:100%;height:auto;display:block}
a{color:inherit;text-decoration:none}
a:focus-visible,button:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
h1,h2,h3{font-weight:500;margin:0;line-height:1.5}
p{margin:0}
ul{margin:0;padding:0;list-style:none}
.inner{max-width:var(--max);margin-inline:auto;padding-left:var(--gl);padding-right:var(--gr)}
.pc{display:inline}
@media (max-width:760px){.pc{display:none}}

/* header */
.header{position:relative;z-index:50;background:var(--bg)}
.header__inner{padding-left:0;padding-right:var(--gr);display:flex;align-items:center;justify-content:flex-end;height:80px}
.header__logo{position:absolute;top:0;left:0;z-index:2;display:block}
.header__logo img{width:128px;height:128px}
@media (max-width:860px){.header__inner{height:64px}.header__logo img{width:96px;height:96px}}
.nav ul{display:flex;gap:34px}
.nav a{font-size:14px;letter-spacing:.08em;padding:6px 0;border-bottom:2px solid transparent;transition:border-color .2s}
.nav a:hover,.nav a.current{border-bottom-color:var(--accent)}
.menu{display:none;border:0;background:none;padding:6px 0;cursor:pointer;flex-direction:column;align-items:center;gap:6px;color:var(--fg)}
.menu__bar{display:block;width:26px;height:2px;background:currentColor;box-shadow:0 -8px 0 currentColor,0 8px 0 currentColor;margin-block:8px}
.menu__label{font-family:var(--en);font-size:10px;letter-spacing:.1em}
@media (max-width:860px){
  .menu{display:flex}
  .nav{position:fixed;inset:0;width:100%;height:100%;background:#1a1a1f var(--nav-bg) center/cover no-repeat;color:#fff;opacity:0;visibility:hidden;transition:opacity .4s,visibility 0s .4s;overflow:auto;z-index:40;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:80px var(--gr) 40px var(--gl);text-align:center}
  .nav::before{content:"";position:absolute;inset:0;background:rgba(0,0,0,.78)}
  .nav>*{position:relative}
  .nav ul{flex-direction:column;gap:22px}
  .nav li{border:0}
  .nav a{display:block;padding:0;font-size:16px;letter-spacing:.12em;border-bottom:0}
  .nav a small{display:block;font-family:var(--en);font-size:10px;letter-spacing:.24em;opacity:.7;margin-top:2px}
  .nav__close{margin-top:56px;width:48px;height:48px;border:1px solid rgba(255,255,255,.6);border-radius:50%;background:none;cursor:pointer;position:relative;display:block}
  .nav__close span{position:absolute;left:50%;top:50%;width:18px;height:1px;background:#fff;transform:translate(-50%,-50%) rotate(45deg)}
  .nav__close span:last-child{transform:translate(-50%,-50%) rotate(-45deg)}
  body.nav-open .nav{opacity:1;visibility:visible;transition:opacity .4s}
  body.nav-open{overflow:hidden}
  body.nav-open .menu{position:relative;z-index:55;color:#fff}
  body.nav-open .menu__bar{box-shadow:none;transform:rotate(45deg)}
  body.nav-open .menu__bar::after{content:"";display:block;width:26px;height:2px;background:currentColor;transform:rotate(90deg)}
}
.nav__close{display:none}
.nav a small{display:none}
@media (max-width:860px){.nav__close{display:block}}

/* common */
.sec{padding-block:80px}
.sec--gray{background:var(--bg-2)}
.ttl{text-align:center;margin-bottom:48px}
.ttl .en{display:block;font-family:var(--en);font-size:12px;letter-spacing:.3em;line-height:1.2;color:var(--accent);font-weight:500}
.ttl .ja{display:block;font-size:26px;letter-spacing:.14em;margin-top:10px;line-height:1.4;font-weight:500}
.ttl--left{text-align:left}
.more{display:inline-block;font-family:var(--en);font-size:13px;letter-spacing:.2em;border:1px solid var(--accent);background:var(--accent);color:#fff;padding:13px 48px;min-width:220px;text-align:center;transition:background .2s,color .2s,border-color .2s}
.more{position:relative}
.more::after{content:"";position:absolute;right:18px;top:50%;width:7px;height:7px;border-top:1px solid currentColor;border-right:1px solid currentColor;transform:translateY(-50%) rotate(45deg);transition:right .2s}
.more:hover{background:#14045e;border-color:#14045e;color:#fff}
.more:hover::after{right:14px}
.center{text-align:center}
@media (max-width:640px){.sec{padding-block:56px}.ttl{margin-bottom:32px}.ttl .ja{font-size:22px}.page-ttl .ttl .ja{font-size:24px}}

/* hero */
.mv{position:relative;background:#dcebf7}
.mv__img{width:100%;aspect-ratio:1400/736;object-fit:cover;min-height:360px;max-height:720px}
.mv__txt{position:absolute;left:0;right:0;top:46%;padding-left:var(--gl);padding-right:var(--gr)}
.mv__txt img{width:min(640px,100%);margin:0 auto;filter:drop-shadow(0 0 10px rgba(255,255,255,.95)) drop-shadow(0 0 2px rgba(255,255,255,1))}
@media (max-width:640px){.mv__img{min-height:420px}.mv__txt{top:40%}}

/* mission */
.mission{text-align:center}
.mission__logo{width:110px;margin:0 auto 28px}
.mission__copy{font-size:clamp(16px,2vw,19px);line-height:2.2;letter-spacing:.1em}
.mission__text{margin-top:20px;color:var(--fg-2)}
.mission .more{margin-top:36px}
@media (max-width:760px){.mission__copy br{display:none}}

/* service */
.service{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:start}
.service__block{text-align:center}
.service__block .ttl{margin-bottom:24px}
.service__block p{text-align:left;max-width:30em;margin-inline:auto}
.service__block .more{margin-top:28px}
.service__img{max-width:420px;margin:0 auto 32px}
@media (max-width:760px){.service{grid-template-columns:1fr;gap:56px}}

/* works */
.works{display:grid;grid-template-columns:repeat(3,1fr);gap:40px 30px}
.work{min-width:0}
.work__img{aspect-ratio:4/3;overflow:hidden;background:var(--bg-2)}
.work__img img{width:100%;height:100%;object-fit:cover}
.work:hover .work__img img{opacity:.85}
.work__cat{font-size:12px;color:var(--fg-2);margin-top:12px;letter-spacing:.06em}
.work__ttl{font-size:15px;font-weight:500;margin-top:2px;line-height:1.6}
.work__lead{font-size:13px;color:var(--fg-2);margin-top:6px;line-height:1.8}
@media (max-width:900px){.works{grid-template-columns:repeat(2,1fr)}}
@media (max-width:540px){.works{grid-template-columns:1fr;gap:32px}}
.works-cat{display:flex;justify-content:center;flex-wrap:wrap;gap:8px 28px;margin-bottom:40px;font-size:13px}
.works-cat button{font:inherit;letter-spacing:.06em;border:0;background:none;color:var(--fg-2);padding:4px 0;border-bottom:2px solid transparent;cursor:pointer}
.works-cat button[aria-pressed="true"]{color:var(--fg);border-bottom-color:var(--accent)}
.work[hidden]{display:none}

/* news */
.news__list{border-top:1px solid var(--line);max-width:800px;margin-inline:auto}
.news__list li{border-bottom:1px solid var(--line)}
.news__list a{display:flex;gap:24px;padding:14px 0;font-size:14px}
.news__list a:hover span{text-decoration:underline;text-underline-offset:4px}
.news__list time{font-family:var(--en);flex:none;letter-spacing:.06em}
.news .more{margin-top:36px}
@media (max-width:480px){.news__list a{flex-direction:column;gap:0}}

/* contact */
.contact-sec{position:relative;background-size:cover;background-position:center;color:#fff;padding-block:100px}
.contact-sec::before{content:"";position:absolute;inset:0;background:rgba(0,0,0,.55)}
.contact-sec .inner{position:relative}
.contact{text-align:center}
.contact .ttl .en{color:#fff}
.contact p{max-width:48em;margin-inline:auto}
.contact .more{margin-top:28px;background:#fff;border-color:#fff;color:#333}
.contact .more:hover{background:var(--accent);border-color:var(--accent);color:#fff}
@media (max-width:640px){.contact-sec{padding-block:64px}}

/* footer */
.footer{background:var(--bg);border-top:1px solid var(--line);text-align:center}
.footer__inner{max-width:var(--max);margin-inline:auto;padding-left:var(--gl);padding-right:var(--gr);padding-block:48px calc(32px + env(safe-area-inset-bottom,0px))}
.footer__logo{display:inline-block}
.footer__logo img{width:100px}
.footer__name{font-size:15px;font-weight:500;letter-spacing:.1em;margin-top:16px}
.footer address{font-style:normal;font-size:13px;line-height:1.8;margin-top:4px}
.copyright{font-family:var(--en);font-size:11px;letter-spacing:.08em;margin-top:28px}

/* about */
.about-lead{text-align:center}
.about-lead__copy{font-size:clamp(22px,3vw,30px);letter-spacing:.14em;line-height:1.6;margin-bottom:20px}
.about-photos{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:48px}
.about-photos img{width:100%;aspect-ratio:4/3;object-fit:cover}
.about-row{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:center;margin-top:80px}
.about-row--rev .about-row__img{order:2}
.about-row__img img{width:100%;aspect-ratio:4/3;object-fit:cover}
.plain .about-row__txt h2{font-size:24px;letter-spacing:.14em;border:0;padding:0;margin:0 0 16px;line-height:1.5;text-align:left}
.plain .about-row__txt h2::after{content:"";position:static;display:block;width:36px;height:1px;background:var(--accent);margin:14px 0 0}
.about-name{display:grid;grid-template-columns:1fr 140px;gap:48px;align-items:center;margin:96px auto 0;max-width:860px;padding:48px 56px;border:1px solid var(--line)}
.about-name__logo{width:120px;margin-inline:auto;order:2}
.plain .about-name h2{border:0;padding:0;margin:0 0 12px;font-size:24px;letter-spacing:.14em;text-align:left}
.plain .about-name h2::after{display:none}
@media (max-width:760px){.about-photos{grid-template-columns:1fr 1fr;gap:10px}.about-photos img:first-child{grid-column:1/-1}.about-row{grid-template-columns:1fr;gap:20px;margin-top:56px}.about-row--rev .about-row__img{order:0}.about-name{margin-top:64px;padding:32px 24px;grid-template-columns:1fr;gap:24px;text-align:center}.about-name__logo{width:100px;order:0}}

/* service page */
.svc{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:center}
.svc--rev .svc__img{order:2}
.svc__img img{width:100%;aspect-ratio:980/445;object-fit:cover}
.svc__list{margin-top:20px;border-top:1px solid var(--line)}
.svc__list li{border-bottom:1px solid var(--line);padding:10px 4px;font-size:14px}
.flow{display:grid;grid-template-columns:repeat(5,1fr);gap:28px;list-style:none;margin:0;padding:0}
.flow li{background:var(--bg-2);padding:32px 20px 28px;text-align:center;position:relative}
.flow li+li::before{content:"";position:absolute;left:-20px;top:50%;width:12px;height:12px;border-top:1px solid var(--accent);border-right:1px solid var(--accent);transform:translate(-50%,-50%) rotate(45deg)}
.flow__num{display:block;font-family:var(--en);font-size:28px;font-weight:300;letter-spacing:.1em;color:var(--accent);line-height:1}
.flow__num::after{content:"";display:block;width:24px;height:1px;background:var(--accent);margin:14px auto 0}
.flow strong{display:block;font-weight:500;margin-top:14px;font-size:15px;line-height:1.5;letter-spacing:.04em}
.flow p{font-size:13px;margin-top:10px;line-height:1.8;text-align:left}
.ba{display:grid;grid-template-columns:1fr 48px 1fr;gap:16px;align-items:center;max-width:900px;margin-inline:auto}
.ba__item{margin:0;text-align:center}
.ba__item img{width:100%;aspect-ratio:4/3;object-fit:cover}
.ba__item figcaption{font-family:var(--en);font-size:12px;letter-spacing:.3em;margin-top:10px}
.ba__arrow{display:block;width:14px;height:14px;border-top:1px solid var(--fg);border-right:1px solid var(--fg);transform:rotate(45deg);margin:0 auto 32px}
@media (max-width:640px){.ba{grid-template-columns:1fr;gap:8px}.ba__arrow{transform:rotate(135deg);margin:8px auto 16px}}
.ba--small{grid-template-columns:1fr 24px 1fr;gap:10px;margin-bottom:28px}
.ba--small .ba__arrow{width:10px;height:10px;margin-bottom:28px}
.ba--small .ba__item figcaption{font-size:11px;letter-spacing:.2em;margin-top:8px}
@media (max-width:640px){.ba--small{grid-template-columns:1fr 24px 1fr;gap:10px}.ba--small .ba__arrow{transform:rotate(45deg);margin:0 auto 28px}}
@media (max-width:900px){.flow{grid-template-columns:1fr;gap:28px}.flow li+li::before{left:50%;top:-20px;transform:translate(-50%,-50%) rotate(135deg)}}
@media (max-width:760px){.svc{grid-template-columns:1fr;gap:24px}.svc--rev .svc__img{order:0}}

/* map */
.map{margin-top:24px;background:var(--bg-2)}
.map iframe{display:block;width:100%;height:420px}
@media (max-width:640px){.map iframe{height:300px}}

/* sub pages */
.page-ttl{position:relative;background-size:cover;background-position:center;color:#fff;padding-block:120px}
.page-ttl::before{content:"";position:absolute;inset:0;background:rgba(0,0,0,.5)}
.page-ttl .inner{position:relative}
.page-ttl .ttl{margin-bottom:0}
.page-ttl .ttl .en{color:#fff}
.page-ttl .ttl .ja{font-size:30px}
@media (max-width:640px){.page-ttl{padding-block:72px}}
.crumb{font-size:12px;color:var(--fg-2);display:flex;gap:8px;flex-wrap:wrap;padding-block:12px}
.crumb li+li::before{content:">";margin-right:8px}
.crumb a:hover{text-decoration:underline}
.plain{max-width:760px;margin-inline:auto}
.plain--wide{max-width:var(--max)}
.plain--wide .outline div{grid-template-columns:14em 1fr;padding:18px 0}
.plain h2{font-size:22px;letter-spacing:.12em;margin-top:96px;margin-bottom:32px;line-height:1.5;text-align:center}
.plain h2::after{content:"";display:block;width:40px;height:1px;background:var(--accent);margin:16px auto 0}
@media (max-width:640px){.plain h2{margin-top:64px;margin-bottom:24px}}
.plain h2:first-child{margin-top:0}
.plain p+p{margin-top:1em}
.outline{border-top:1px solid var(--line);width:100%;margin:16px 0 0}
.outline div{display:grid;grid-template-columns:10em 1fr;gap:16px;padding:14px 0;border-bottom:1px solid var(--line);font-size:14px}
.outline dt{color:var(--fg-2)}.outline dd{margin:0}
@media (max-width:480px){.outline div{grid-template-columns:1fr;gap:0}}
.form{display:grid;gap:20px;max-width:640px;margin-inline:auto}
.form label{display:grid;gap:6px;font-size:14px}
.form input,.form textarea,.form select{font:inherit;padding:10px 12px;border:1px solid var(--line);background:var(--bg);color:var(--fg)}
.form input:focus,.form textarea:focus,.form select:focus{outline:2px solid var(--accent)}
.form__note{font-size:12px;color:var(--fg-2)}
.form .more{justify-self:center;cursor:pointer}
.toast{padding:12px 16px;background:var(--bg-2);font-size:14px;text-align:center}
.note{font-size:12px;color:var(--fg-2);margin-top:12px}

/* work detail */
.detail-head{padding-block:40px 24px}
.detail-head__cat{font-size:13px;color:var(--fg-2)}
.detail-head h1{font-size:clamp(22px,3vw,30px);margin-top:4px;line-height:1.5}
.detail__main img{width:100%;aspect-ratio:3/2;object-fit:cover}
.detail{display:grid;grid-template-columns:1.4fr 1fr;gap:56px;margin-top:40px}
.detail__lead{font-size:18px;line-height:1.9;font-weight:500}
.detail__body{margin-top:16px}
.spec{border-top:1px solid var(--line);margin:0}
.spec div{display:grid;grid-template-columns:7em 1fr;gap:12px;padding:12px 0;border-bottom:1px solid var(--line);font-size:14px}
.spec dt{color:var(--fg-2)}.spec dd{margin:0}
.spec-ttl{font-size:15px;font-weight:500;letter-spacing:.1em;line-height:1.4;margin-bottom:12px}
@media (max-width:760px){.detail{grid-template-columns:1fr;gap:36px}}
.gallery{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:48px}
.gallery figure{margin:0;min-width:0}
.gallery img{width:100%;aspect-ratio:4/3;object-fit:cover}
.gallery a:hover img{opacity:.85}
.gallery figcaption{font-size:12px;color:var(--fg-2);margin-top:8px;line-height:1.6}
@media (max-width:640px){.gallery{grid-template-columns:1fr 1fr;gap:12px}}
.pager{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-top:56px;padding-top:24px;border-top:1px solid var(--line);font-size:13px;flex-wrap:wrap}
.pager a:hover{text-decoration:underline;text-underline-offset:4px}
.lightbox{position:fixed;inset:0;background:rgba(0,0,0,.85);z-index:90;display:flex;align-items:center;justify-content:center;padding:calc(16px + env(safe-area-inset-top,0px)) var(--gr) calc(16px + env(safe-area-inset-bottom,0px)) var(--gl);cursor:zoom-out}
.lightbox[hidden]{display:none}
.lightbox__img{max-width:min(1100px,100%);margin:0;cursor:default;text-align:center}
.lightbox__img img{max-height:80vh;width:auto;max-width:100%;margin-inline:auto}
.lightbox figcaption{color:#fff;font-size:13px;margin-top:10px}
.lightbox__close{position:absolute;top:calc(12px + env(safe-area-inset-top,0px));right:var(--gr);width:44px;height:44px;border:0;background:none;color:#fff;font-size:30px;cursor:pointer;line-height:1}

/* wp */
.entry{max-width:760px;margin-inline:auto}
.entry h2{font-size:20px;margin:40px 0 12px}
.entry p{margin-bottom:1em}
.entry img{margin-block:12px}
.wp-block-image img{height:auto}
.screen-reader-text{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.news-single__date{font-family:var(--en);letter-spacing:.06em;text-align:center;margin-bottom:8px}
.news-single h1{text-align:center;font-size:24px;letter-spacing:.1em;margin-bottom:40px}