@charset "utf-8";
/* =========================================================
   SOKEN CONSTRUCTION - page.css（下層ページ共通）
   ========================================================= */

.pageHead{position:relative;padding:20rem 0 8rem;overflow:hidden}
@media screen and (max-width:768px){.pageHead{padding:14rem 0 5rem}}
.pageHead .sub{display:block;font-size:1.3rem;letter-spacing:.1em;color:var(--c-sub)}
.pageHead .sub::before{content:"";display:inline-block;width:2.4rem;height:.1rem;background:var(--accent);margin-right:1rem;vertical-align:middle}
.pageHead .title{display:block;font-family:"Poppins",sans-serif;font-weight:500;font-size:9.6rem;line-height:1.15;letter-spacing:-.01em;margin-top:1.2rem}
.pageHead .title .inner{display:block;overflow:hidden}
@media screen and (max-width:768px){.pageHead .title{font-size:4.4rem}}
.pageHead .deco{position:absolute;z-index:-1}
.pageHead .deco.--01{top:14rem;right:12rem;width:9rem;height:9rem;--shape-color:var(--c-main)}
.pageHead .deco.--02{top:24rem;right:26rem;width:5rem;height:5rem;--shape-color:var(--c-accent)}
.pageHead .deco.--03{top:9rem;right:4rem;width:6rem;height:6rem;--shape-color:var(--c-beige2)}
@media screen and (max-width:768px){
  .pageHead .deco.--01{top:10rem;right:2rem;width:5rem;height:5rem}
  .pageHead .deco.--02{top:16rem;right:9rem;width:3rem;height:3rem}
  .pageHead .deco.--03{display:none}
}

.pageBody{padding-bottom:12rem}
@media screen and (max-width:768px){.pageBody{padding-bottom:8rem}}

.secTitle{margin-bottom:4.8rem}
.secTitle .en{display:block;font-family:"Poppins",sans-serif;font-size:4rem;line-height:1.2}
.secTitle .jp{display:block;font-size:1.4rem;color:var(--c-sub);margin-top:.6rem;letter-spacing:.08em}
@media screen and (max-width:768px){.secTitle .en{font-size:2.8rem}.secTitle{margin-bottom:3.2rem}}

/* ---------- MESSAGE（私たちについて） ---------- */
.messageArea{display:flex;gap:8rem;align-items:flex-start}
@media screen and (max-width:768px){.messageArea{flex-direction:column;gap:3.2rem}}
.messageArea .left{position:relative;width:44rem;flex-shrink:0;position:sticky;top:12rem}
@media screen and (max-width:768px){.messageArea .left{width:100%;position:static}}
.messageArea .left .ph{width:100%;aspect-ratio:3/4}
.messageArea .left .deco{position:absolute;bottom:-3rem;right:-3rem;width:8rem;height:8rem;--shape-color:var(--c-accent);z-index:2}
@media screen and (max-width:768px){.messageArea .left .deco{bottom:-1.4rem;right:-1.2rem;width:5.2rem;height:5.2rem}}
.messageArea .right{flex:1;padding-top:1rem}
.messageArea .right p{margin-bottom:3.2rem;font-size:1.6rem;line-height:2.4;letter-spacing:.04em}
@media screen and (max-width:768px){.messageArea .right p{font-size:1.4rem;line-height:2.2;margin-bottom:2.4rem}}
.messageArea .sign{margin-top:5.6rem;text-align:right}
.messageArea .sign .role{display:block;font-size:1.3rem;color:var(--c-sub)}
.messageArea .sign .name{display:block;font-size:2.2rem;font-weight:700;letter-spacing:.16em;margin-top:.6rem}

/* ---------- BUSINESS（事業内容） ---------- */
.vennArea{padding:6rem 0 12rem}
@media screen and (max-width:768px){.vennArea{padding:2rem 0 7rem}}

/* 2つの円を大きく重ね、交差部に「大工工事」を置く */
.venn{position:relative;width:66rem;height:42rem;margin:0 auto}
.venn .circle{
  position:absolute;top:0;width:42rem;height:42rem;border-radius:50%;
  display:grid;place-items:center;text-align:center;
  border:.2rem solid var(--circle-color);
  background:rgba(0,0,0,.03);
  background:color-mix(in srgb,var(--circle-color) 9%,transparent);
  transition:background .5s var(--ease);
}
.venn .circle.--01{left:0;--circle-color:var(--c-main);--circle-ink:var(--c-main-ink)}
.venn .circle.--02{right:0;--circle-color:var(--c-accent);--circle-ink:var(--c-accent-ink)}
.venn .circle:hover{background:color-mix(in srgb,var(--circle-color) 18%,transparent)}
.venn .circle .en{display:block;font-family:"Poppins",sans-serif;font-size:1.2rem;letter-spacing:.16em;color:var(--circle-ink,var(--circle-color))}
.venn .circle .jp{display:block;font-size:2.4rem;font-weight:700;margin-top:-0.8rem;letter-spacing:.04em}
.venn .circle .txt{display:block;font-size:1.3rem;color:var(--c-sub);margin-top:-0.8rem;line-height:1.8}
/* 交差部を避けて外側へ寄せる */
.venn .circle.--01 .inner{transform:translateX(-9rem)}
.venn .circle.--02 .inner{transform:translateX(9rem)}

/* 交差部（レンズ）の中心 */
.venn .center{
  position:absolute;inset:0;margin:auto;width:fit-content;height:fit-content;
  z-index:3;text-align:center;pointer-events:none;
}
.venn .center .label{display:block;font-size:2rem;font-weight:700;letter-spacing:.08em;line-height:1.5}
.venn .center .en{display:block;font-family:"Poppins",sans-serif;font-size:1rem;letter-spacing:.16em;color:var(--c-sub);margin-top:.2rem}

@media screen and (max-width:768px){
  /* SPは縦積みで重ねる */
  .venn{width:28rem;max-width:100%;height:47rem}
  .venn .circle{width:100%;height:28rem}
  .venn .circle.--01{top:0;left:0;right:auto}
  .venn .circle.--02{top:19rem;left:0;right:auto}
  .venn .circle.--01 .inner,.venn .circle.--02 .inner{transform:none}
  .venn .circle .jp{font-size:2rem}
  .venn .circle .txt{font-size:1.2rem}
  .venn .center{top:23.5rem;bottom:auto;height:auto;transform:translateY(-50%)}
  .venn .center .label{font-size:1.7rem}
}

.bizList{display:grid;gap:9rem}
@media screen and (max-width:768px){.bizList{gap:5.6rem}}
.bizItem{display:flex;align-items:center;justify-content:space-between;gap:6rem}
.bizItem.--reverse{flex-direction:row-reverse}
@media screen and (max-width:768px){.bizItem,.bizItem.--reverse{flex-direction:column;gap:3.2rem}}
.bizItem .left{width:44rem;flex-shrink:0}
.bizItem .en{display:block;font-family:"Poppins",sans-serif;font-size:1.2rem;letter-spacing:.16em;color:var(--accent-ink)}
.bizItem .title{display:block;font-size:2.8rem;font-weight:700;letter-spacing:.04em;margin:.8rem 0 2.4rem;line-height:1.5}
@media screen and (max-width:768px){.bizItem .title{font-size:2.1rem;margin:.6rem 0 1.6rem}}
.bizItem .title::after{content:"";display:block;width:4rem;height:.2rem;background:var(--accent);margin-top:1.6rem}
.bizItem .text{font-size:1.5rem;line-height:2.2}
@media screen and (max-width:768px){.bizItem .text{font-size:1.4rem}}
.bizItem .right{position:relative;width:56rem;flex-shrink:0}
@media screen and (max-width:768px){.bizItem .left,.bizItem .right{width:100%}}
.bizItem .right .ph{width:100%;aspect-ratio:4/3}
.bizItem .deco{position:absolute;z-index:2}
.bizItem .deco.--01{top:-2.4rem;right:-2.4rem;width:6.4rem;height:6.4rem;--shape-color:var(--c-main)}
.bizItem .deco.--02{bottom:-2.4rem;left:-2.4rem;width:5.6rem;height:5.6rem;--shape-color:var(--c-accent)}
.bizItem.--reverse .deco.--01{right:auto;left:-2.4rem}
.bizItem.--reverse .deco.--02{left:auto;right:-2.4rem}
@media screen and (max-width:768px){
  .bizItem .deco.--01{top:-1.4rem;right:-1.2rem;width:4rem;height:4rem}
  .bizItem .deco.--02{bottom:-1.4rem;left:-1.2rem;width:3.4rem;height:3.4rem}
}

.bizNote{margin-top:4rem;padding:3.2rem;border:.1rem dashed var(--c-line);border-radius:1.6rem;font-size:1.5rem;line-height:2.2}
@media screen and (max-width:768px){.bizNote{padding:2.4rem;font-size:1.4rem}}

/* ---------- PROFILE（会社概要） ---------- */
.infoTable{width:100%;border-top:.1rem solid var(--c-line)}
.infoTable th,.infoTable td{padding:2.4rem 0;border-bottom:.1rem solid var(--c-line);text-align:left;vertical-align:top;font-size:1.5rem;line-height:2}
.infoTable th{width:24rem;font-weight:700;letter-spacing:.06em}
@media screen and (max-width:768px){
  .infoTable th,.infoTable td{display:block;padding:0;border:0;font-size:1.4rem}
  .infoTable th{width:auto;padding-top:2rem;color:var(--c-sub);font-size:1.2rem}
  .infoTable td{padding:.4rem 0 2rem;border-bottom:.1rem solid var(--c-line)}
}
.infoTable td a:hover{color:var(--accent-ink)}

.historyList{margin-top:8rem}
.historyList .item{display:flex;gap:4rem;padding:2.4rem 0;border-bottom:.1rem solid var(--c-line);align-items:baseline}
@media screen and (max-width:768px){.historyList .item{gap:2rem}}
.historyList .year{font-family:"Poppins",sans-serif;font-size:2.4rem;color:var(--accent-ink);flex-shrink:0;width:12rem}
@media screen and (max-width:768px){.historyList .year{font-size:1.8rem;width:8rem}}
.historyList .text{font-size:1.5rem}

/* ---------- CONTACT（お問い合わせ） ---------- */
.formArea{max-width:80rem;margin-inline:auto}
.formNote{margin-bottom:4.8rem;padding:2.4rem;background:var(--c-gray);border-radius:1.2rem;font-size:1.4rem;line-height:2}
.formRow{margin-bottom:3.2rem}
.formRow .label{display:flex;align-items:center;gap:1rem;margin-bottom:1rem;font-size:1.4rem;font-weight:700;letter-spacing:.06em}
.formRow .req{font-size:1.1rem;padding:.2rem .8rem;border-radius:.4rem;background:var(--c-main);color:#fff;font-weight:500}
.formRow .any{font-size:1.1rem;padding:.2rem .8rem;border-radius:.4rem;background:var(--c-line);color:var(--c-sub);font-weight:500}
.formRow input[type=text],.formRow input[type=email],.formRow input[type=tel],.formRow select,.formRow textarea{
  width:100%;padding:1.6rem;border:.1rem solid var(--c-line);border-radius:.8rem;
  font:inherit;font-size:1.5rem;background:var(--c-white);color:var(--c-text);
  transition:border-color .3s var(--ease);
}
.formRow textarea{min-height:18rem;resize:vertical;line-height:1.9}
.formRow input:focus,.formRow select:focus,.formRow textarea:focus{outline:none;border-color:var(--accent-ink)}
.formRow .privacy{display:flex;align-items:flex-start;gap:1rem;font-size:1.4rem;line-height:1.8}
.formRow .privacy input{margin-top:.4rem;width:1.8rem;height:1.8rem;accent-color:var(--c-main)}
.formRow .privacy a{text-decoration:underline}
.formSubmit{text-align:center;margin-top:5.6rem}
.formSubmit .btn-cp1{cursor:pointer}

.thanksArea{text-align:center;padding:6rem 0 4rem}
.thanksArea .title{font-size:3.2rem;font-weight:700;line-height:1.6;margin-bottom:2.4rem}
.thanksArea > .text{font-size:1.5rem;line-height:2.2;margin-bottom:4.8rem}
@media screen and (max-width:768px){.thanksArea .title{font-size:2.2rem}}

/* ---------- PRIVACY（プライバシーポリシー） ---------- */
.policyArea{max-width:84rem;margin-inline:auto}
.policyArea .lead{font-size:1.5rem;line-height:2.2;padding-bottom:4.8rem;border-bottom:.1rem solid var(--c-line)}
.policySec{margin-top:4.8rem}
.policySec .title{font-size:1.9rem;font-weight:700;letter-spacing:.04em;margin-bottom:1.6rem;line-height:1.6}
.policySec .text{font-size:1.5rem;line-height:2.2}
.policySec .text + .list{margin-top:1.6rem}
.policySec .list{padding-left:1.8rem}
.policySec .list li{position:relative;font-size:1.5rem;line-height:2.2}
.policySec .list li::before{content:"";position:absolute;left:-1.8rem;top:1.5rem;width:.6rem;height:.6rem;border-radius:50%;background:var(--accent)}
.policyBox{margin-top:2.4rem;padding:2.8rem 3.2rem;background:var(--c-beige);border-radius:1.2rem}
.policyBox .name{font-size:1.6rem;font-weight:700;letter-spacing:.04em}
.policyBox .addr,.policyBox .tel{font-size:1.4rem;line-height:2;color:var(--c-sub);margin-top:.4rem}
.policyBox a:hover{color:var(--accent-ink)}
.policyDate{margin-top:6.4rem;padding-top:2.4rem;border-top:.1rem solid var(--c-line);font-size:1.3rem;color:var(--c-sub);text-align:right}
@media screen and (max-width:768px){
  .policyArea .lead{font-size:1.4rem;padding-bottom:3.2rem}
  .policySec{margin-top:3.6rem}
  .policySec .title{font-size:1.7rem}
  .policySec .text,.policySec .list li{font-size:1.4rem}
  .policyBox{padding:2rem 2.2rem}
}

/* ---------- Contact Form 7 ---------- */
.cf7Wrap .wpcf7-form-control-wrap{display:block}
.cf7Wrap input[type=text],.cf7Wrap input[type=email],.cf7Wrap input[type=tel],
.cf7Wrap select,.cf7Wrap textarea{
  width:100%;padding:1.6rem;border:.1rem solid var(--c-line);border-radius:.8rem;
  font:inherit;font-size:1.5rem;background:var(--c-white);color:var(--c-text);
  transition:border-color .3s var(--ease);
}
.cf7Wrap textarea{min-height:18rem;resize:vertical;line-height:1.9}
.cf7Wrap input:focus,.cf7Wrap select:focus,.cf7Wrap textarea:focus{outline:none;border-color:var(--accent-ink)}
.cf7Wrap .privacy{display:flex;align-items:flex-start;gap:1rem;font-size:1.4rem;line-height:1.8}
.cf7Wrap .privacy input[type=checkbox]{margin-top:.4rem;width:1.8rem;height:1.8rem;accent-color:var(--c-main)}
.cf7Wrap .privacy .wpcf7-list-item{margin:0}
.cf7Wrap .privacyNote{margin-top:.8rem;font-size:1.3rem}
.cf7Wrap .privacyNote a{text-decoration:underline}
.cf7Wrap .privacyNote a:hover{color:var(--accent-ink)}
.cf7Wrap .formSubmit input[type=submit]{
  width:28rem;height:6.4rem;border-radius:3.2rem;border:.1rem solid var(--c-ink);
  background:none;color:var(--c-ink);font-size:1.5rem;font-weight:700;letter-spacing:.04em;
  cursor:pointer;transition:background .4s var(--ease),color .4s var(--ease),border-color .4s var(--ease);
}
.cf7Wrap .formSubmit input[type=submit]:hover{background:var(--accent);color:var(--on-accent);border-color:var(--accent)}
@media screen and (max-width:768px){.cf7Wrap .formSubmit input[type=submit]{width:100%;max-width:30rem;height:5.6rem}}
.cf7Wrap .wpcf7-not-valid-tip{display:block;margin-top:.8rem;font-size:1.3rem;color:var(--c-main)}
.cf7Wrap .wpcf7-response-output{
  margin:3.2rem 0 0;padding:1.6rem 2rem;border:.1rem solid var(--c-line);border-radius:.8rem;
  font-size:1.4rem;line-height:1.9;
}
.cf7Wrap .wpcf7-spinner{display:block;margin:1.6rem auto 0}
