@charset "utf-8";
/* CSS Document */

/*------------------------------
　共通
------------------------------*/
body{display:flex;flex-direction:column;    justify-content: space-between;}
.sp{display: none !important;}
.-sankaku,.have-child{display: none !important;}
.w1100{width: 1100px;margin: 0 auto;}
right{        display: flex; justify-content: flex-end;}

.m-b30{margin-bottom: 30px;}
.m-t30{margin-top: 30px;}
.m-b50{margin-bottom: 50px;}
.m-t50{margin-top: 50px;}
.p-20{padding:20px !important;}
.p-30{padding:30px !important;}
.p-50{padding:50px !important;}
.p-t50{padding-top:50px !important;}

h1{font-size: 15px;font-weight: 500;letter-spacing: .1rem;color:#222222;}
h2{font-size: 26px;font-weight: 600;letter-spacing: .05rem;line-height:1.6;}

.txt-arrow:after{content:"";background: url(../../../image/common/txt-arrow.svg) no-repeat center right / contain;width: 10px; height: 14px;}
.en{font-family: "Outfit", sans-serif;font-weight: 600;font-style: normal;font-size:130%;line-height:1;letter-spacing:1px;}


.bt-mail{font-weight: 600; font-size: 21px; background-color:#e65b9e;color:#FFF;border-radius: 60px; line-height: 1; padding: 25px 60px; display: inline-flex; justify-content: center;gap:15px;margin-bottom:30px;transition:.3s;
box-shadow: rgba(0, 0, 0, 0.16) 2px 8px 0px}
.bt-mail:hover{background-color:#ec59a1;color:#FFF;transform: scale(1.05);box-shadow: rgba(0, 0, 0, 0.15) 0px 15px 15px, rgba(0, 0, 0, 0.05) 0px 5px 8px;}
.bt-mail:before{content:"";display:inline-block;background: url(../../../image/common/icon-mail_w.svg) no-repeat center center / contain;width: 34px; height:24px;transform: scale(1);transition:.3s;}
.bt-mail:hover::before{background: url(../../../image/common/icon-mail_w.svg) no-repeat center center / contain;transform: scale(1.05);
}

.more-bt{cursor: pointer;min-width:230px;font-weight: 600; font-size: 16px; line-height: 1; padding: 15px 30px 15px 20px; display: inline-flex; justify-content: center;gap:6px;margin-top:30px;transition:.3s;color:#FFF;letter-spacing:.1rem;}
.more-bt{background:#111 url(../../../image/common/more-bt-arrow_w.svg) no-repeat center right / 40px;}
.more-bt:hover{background:#808080 url(../../../image/common/more-bt-arrow_w.svg) no-repeat center right / 40px; color:#FFF;}

.more-bt.-red{background-color:#ff2929;}
.more-bt.-red:hover{background:#FFF url(../../../image/common/more-bt-arrow_b.svg) no-repeat center right / 40px; color:#222222;}
.pic img{width:100%;height:auto;}

.w1100-wrap {max-width: 1100px;margin: 20px auto 50px;position: relative;z-index: 1;}

.-white{color:#FFF !important;}
p .red{color:#ff2929;}
.whiteboard{padding:0 30px; background-color: rgb(255 255 255 / 85%);}
.whiteboard p{padding:20px 0;font-size:18px;line-height:1.6;}
/*------------------------------
　ヘッダー
------------------------------*/
header{width:100%;position:fixed;top:0;z-index:999;}
.header-inner{position:relative;box-shadow: rgb(0 0 0 / 30%) 0px 18px 15px -20px;height:100px;}
.h-head-set{background-color:#f0f0f0;padding:5px 0 2px 210px;display:flex;justify-content:space-between;line-height:1;align-items: center;height:36px;}

.h-logo{position:absolute;top:0;left:0;width:min(300px,28vw);}
.h-logo img{width:100%;height:auto;}
.h-bt-set {
  position: absolute;
  top: 0;
  right: 0;
  display: flex;
}

.h-bt-set .btn {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}

/* 左ボタン（灰色）: 左端も透過の斜めカット */
.btn-gray {
  background: #6e6e6e;
  /* 左上だけ斜めにカットされ、そこは透過になる */
  clip-path: polygon(20% 0, 100% 0, 100% 100%, 0% 100%, 0 100%);
}

/* 右ボタン（赤）: 左上カット */
.btn-red {
  background: #f03737;
  margin-left: -55px; /* 重なり調整 */
  clip-path: polygon(20% 0, 100% 0, 100% 100%, 0% 100%);
}

.btn::before {
  background-color: #fff;
  content: "";
  display: block;
  position: absolute;
  top: -100px;
  left: 0;
  width: 30px;
  height: 100%;
  opacity: 0;
  transition: cubic-bezier(0.32, 0, 0.67, 0);
}
.btn:hover::before {
  animation: kiran 0.5s linear;
}
 
@keyframes kiran {
  0% {
    transform: scale(2) rotate(45deg);
    opacity: 0;
  }
  20% {
    transform: scale(20) rotate(45deg);
    opacity: 0.6;
  }
  40% {
    transform: scale(30) rotate(45deg);
    opacity: 0.4;
  }
  80% {
    transform: scale(45) rotate(45deg);
    opacity: 0.2;
  }
  100% {
    transform: scale(50) rotate(45deg);
    opacity: 0;
  }
}
/* ホバー・JS共通で使うベーススタイル */
.btn::before {
  background-color: #fff;
  content: "";
  display: block;
  position: absolute;
  top: -100px;
  left: 0;
  width: 30px;
  height: 100%;
  opacity: 0;
  pointer-events: none;
}

/* キラリ再生用の一時クラス */
.btn.kirakira::before {
  animation: kiran 0.5s linear;
}


.hamburger-set{display: none;}
.nav-set{background-color:#FFF;display: flex;justify-content: space-between;padding:0 500px 0 300px;height:64px;}
.nav-set-wrapper{display:flex;justify-content:center;flex:1;z-index:5;}
.nav-list{display: flex;justify-content: center;align-items:center;gap:min(3vw,80px);font-size: min(16px,1.05vw);position:relative;}

.head-apply-bt{position:absolute;right:0;bottom:0;}
.head-apply-bt img{height:100px;width:auto;}

@media (max-width: 1200px){
	.h-head-set{flex-direction:column;align-items:flex-end;}
	.h-head-set h1{padding-bottom:5px;}

	.nav-set-wrapper{justify-content:flex-end;}
	.nav-set{padding-left:unset;}
	.nav-list{font-size:14px;gap:3vw;}
}

.flex-waku{display:flex;justify-content:center;gap:25px;flex-wrap:wrap;}
.flex-waku img{width:100%;height:auto;}
/*------------------------------
　TOPコンテンツ
------------------------------*/

.slider-waku{position:relative;margin-top:100px;line-height:0;}

/* 施工事例 */
section.works{position: relative;}
section.works::before {
  content: "";position: absolute;
  top: 0;left: 0;
  width: 60%;height: 200px;
  background-color: #222222;
  clip-path: polygon(0 0, 100% 0, 80% 100%, 0% 100%);
  z-index: 0;
}
section.works h2{color:#FFF;font-size: 40px;letter-spacing: 4px; line-height: 1;padding: 40px 0;}
.works-flex{display:flex;justify-content:center;gap:min(30px,3vw);flex-wrap:wrap;}
.works-box{width:calc(33% - 19px);background-color:#FFF;border:2px solid #222;position:relative;}
.works-box .pic{aspect-ratio: 1.4 / 1;overflow:hidden;display:flex;justify-content:center;align-items:center;}
.works-box .pic img{width:100%;height:100%;object-fit:cover;object-position:center;transition:.3s;}
.works-box:hover .pic img{width:110%;height:110%;opacity:.8;object-position:center;transition:.3s;}
.works-box .txt{padding:15px 50px 15px 15px;}
.works-cat{display:inline-block;font-size:14px;color:#FFF;background-color:#222;text-align:center;padding:8px;margin-bottom:10px;}
.works-box h3{line-height:1.5;font-size:16px;}
.works-box .works-bt{position:absolute;bottom:0;right:0;width:95px;height:90px;background:url(../../../image/common/works-bt.svg) no-repeat bottom right;transition:.3s;}
.works-box:hover .works-bt{position:absolute;bottom:0;right:0;width:95px;height:90px;background:url(../../../image/common/works-bt_hover.svg) no-repeat bottom right;transition:.3s;}
@media (max-width: 1200px){
	.works-flex{max-width: 94%;}
	.works-box .txt{padding:10px 10px 50px 10px;}
}
	
/* 弊社の強み */
section.concept{background-image:url(../../../image/concept/concept-bg.webp);background-position:center;padding:20px 0;background-size:cover;}
.concept-waku{text-align:center;max-width:1000px;margin:0 auto;}

.os-waku{text-align:left;max-width:800px;margin:20px auto 50px;}
.os-list{padding:10px 30px 10px 60px;position:relative;border-bottom: 1px solid #e2e2e2;}
.os-list:before{content:url(../../../image/common/check-box.svg);display:block;position:absolute;left: 0px;top: 23px;}
.os-title{font-size:24px;font-weight:700;padding:10px 0;}
.os-list p{font-size:18px;}

/* コスト削減実績 */
section.jisseki{background-image:url(../../../image/costdown/jisseki-bg.webp);background-position:top right;padding:50px 0;background-size:100%;position:relative;background-repeat:no-repeat;background-color: #dbdbdb;z-index:2;}
section.jisseki{padding:50px 0;text-align:center;}
.jisseki-waku{ max-width: 1100px; margin: 0 auto;}
.top-jisseki-in{max-width:800px;margin:0 auto;}
.top-jisseki-in .page-sub-title{margin-bottom:0;padding-left:20px !important;}
.top-jisseki-in .jisseki-box{display:block;max-width:760px;transition: transform .6s ease;}
.top-jisseki-in .jisseki-box:after{content:"";display:block;background: url(../../../image/common/works-bt.svg);width:95px;height:90px;position:absolute;right:0;bottom:0;}

.top-jisseki-in .jisseki-box:hover{transform: scale(1.05);}
.top-jisseki-in .jisseki-box:hover::after{content:"";display:block;background: url(../../../image/common/works-bt_hover.svg);width:95px;height:90px;position:absolute;right:0;bottom:0;}

/* 建築中の現場 */
.genba-waku{display:flex;gap:min(40px,3vw); padding: 40px; background-color: rgb(240 240 240 / 80%);margin-bottom:25px;min-height:300px;justify-content:center;align-items:center;}
.genba-waku .pic{flex:1;aspect-ratio: 1.4 / 1;overflow:hidden;display:flex;justify-content:center;align-items:center;}
.genba-waku .pic img{width:100%;height:100%;object-fit:cover;object-position:center;transition:.3s;}
.genba-waku .info{flex:1;display: flex;flex-direction: column;justify-content: space-between;}
.genba-waku .info h3{font-size: 24px;font-weight: 600; line-height: 1.5; padding-bottom: 10px; border-bottom: 2px solid;}
.genba-waku .info .date{text-align:right;padding:10px 0 15px;line-height:1;font-size:14px;}
.genba-waku .info .txt{text-align:justify;line-height:1.8;flex:1;display:flex;flex-direction:column;justify-content:space-between;}

.genba-waku .info > .more-bt{margin-top:15px;}

.more-txt{font-weight: 600; font-size: 14px; line-height: 1; padding: 10px 20px 10px 14px; display: inline-flex; justify-content: center;gap:6px;transition:.3s;color:#222;letter-spacing:.1rem;}
.more-txt{background:#FFF url(../../../image/common/more-bt-arrow_b.svg) no-repeat center right / 30px;}
.more-txt:hover{background:#ababab url(../../../image/common/more-bt-arrow_w.svg) no-repeat center right / 30px; color:#FFF;}

.no-box{font-size:18px;}
/*------------------------------
　下層ページ
------------------------------*/

.single-waku{flex:1;margin:100px auto 0;width:100%;position:relative;}
.single-title{position:relative;}
.single-title::before {
  content: "";position: absolute;
  top: 0;left: 0;
  width: 60%;height: 200px;
  background-color: #222222;
  clip-path: polygon(0 0, 100% 0, 80% 100%, 0% 100%);
  z-index: -1;
}
.single-title h2{max-width:1100px;margin:0 auto;color:#FFF;font-size: 40px;letter-spacing: 4px; line-height: 1;padding: 40px 0;}
.page-title{text-align:center;line-height:1.4;font-size:52px;letter-spacing:.2rem;padding-bottom:.5rem;font-weight: 700;}
.page-title span{color:#ff2929;}
.sub-title{text-align:center;line-height:1.6;font-weight:600;font-size:20px;margin-bottom:40px;}
.page-sub-title{font-size:33px;font-weight:600;line-height:1.6;text-align:left;margin-bottom:10px;}
.page-sub-title > p{font-size:20px !important;display: flex;align-items: center;}
.page-sub-title > p > span{font-size:30px;line-height:1;padding-left:3px;}
.point-title{font-size:28px;padding:10px;font-weight:600;line-height:1.8;letter-spacing:.05rem;text-align:center;}
.point-title span{color:#ff2929;background-color:#FFF;display: inline-block; margin: 0 3px;background-color: #FFF;padding:0 6px;font-weight:700;}

.single-waku table{margin:15px auto;font-size:15px;border: 1px solid hsla(0, 0%, 78%, .5);width:800px;}
.single-waku th,.single-waku td{padding:15px 25px;border-bottom: 1px solid hsla(0, 0%, 78%, .5); vertical-align: middle;}
.single-waku th{font-weight:500;border-left: 1px solid hsla(0, 0%, 78%, .5);line-height:1.6;width:25%;}
.single-waku th span{display:block;font-size:12px;}
.single-waku td{border-left: 1px solid hsla(0, 0%, 78%, .5);}
.single-waku th.red{background-color: hsl(0deg 100% 50% / 75%);color: #FFF;}
.single-waku td.red{background-color: hsl(0deg 100% 50% / 15%);font-weight:600;font-size:16px;}
.single-waku td.red span{font-size:14px;padding-left:3px;font-weight:500;}
.kigou{line-height:1 !important;font-size:150% !important;font-weight:600 !important;}
.kigou small{display:block;font-size:12px;padding-top: 5px;}
.red.kigou{font-size: 190% !important;font-weight: 900 !important;}
.red.kigou small{font-weight:500 !important;}
.table-hosoku{font-size:12px;color:444;font-weight:400;}


/* コスト削減実例 */
.jisseki-box{position:relative;background-color:#FFF;width:100%;box-shadow: rgba(0, 0, 0, 0.15) 0px 7px 15px, rgba(0, 0, 0, 0.05) 0px 5px 10px;margin-bottom:30px;}
.jisseki-box > p{padding:15px 0 30px;line-height:1.6;text-align:justify;font-size:18px;}

.jisseki-box .flex-waku{margin-top:30px;}
.jisseki-reibox{padding:15px;}
.rei-txt{font-size:21px;font-weight:600;line-height:1.6;}
.rei-txt span{font-size:140%;}
.rei-txt b{font-weight:inherit;}

.rei-title{background-color:#222;color:#FFF;font-size:22px;padding:10px;line-height:1.2;letter-spacing:.05rem;}
.hari-p{width:30%;padding:0 10px;}

.concept-waku > p{padding:15px 0 30px;line-height:1.6;text-align:justify;font-size:18px;}
.tokucho-point{display:flex;flex-direction:column;}
.tokucho-point .pic {border:1px solid #afafaf;}
.tokucho-point .pic img{max-height:200px;width:auto;}
.tokucho-point p{font-size:18px;line-height:1.6;font-weight:500;}
.tokucho-point p span{color:#ff2929;}
.group-linkbox{display:block;padding:10px 0;}
.group-linkbox img{background-color:#FFF;transition:.3s;}
.group-linkbox img:hover{background-color:#ffe0ae;}
.works h2{padding-top:20px !important;}
.works .post-title{color:#FFF;font-size:21px;line-height:1.6;padding-top:10px;border-top:2px solid #FFF;margin-top:-15px;}
.post-title2{color:#FFF;font-size:24px;line-height:1.6;padding-top:15px;border-top:2px solid #FFF;margin-top:-15px;margin-bottom:30px;}

.works-page-flex{display:flex;justify-content:space-between;gap:2vw;padding:50px;}
.works-page-flex .pic-main {aspect-ratio: 1.6 / 1; flex:1;}
.works-page-flex .pic-main img{width:100%;height:100%;object-fit:cover;}
.works-page-flex .info {flex:1.1;}
.works-page-flex .info li{text-align:left;padding:10px;border-bottom:1px dashed #e0e0e0;font-size:18px;}
.works-page-flex .info li span{display: inline-block;width: 70px;font-weight: 500;color: #333;line-height:1;padding:5px;border-right:1px solid #e0e0e0;margin-right:1rem;}


.gallery-title{display:flex;justify-content:flex-start;align-items:center;font-family: "Jost", sans-serif; font-weight: 500;font-size: 30px;color: #222;padding:0;letter-spacing:.1rem;margin-bottom:15px;}
.gallery-title:after{border-top: 1px solid #e0e0e0;content: "";width: 100%;margin-left:10px;}

.cospakenchiku-waku{background-color:#ececec;padding-top:30px;}
.cospakenchiku-waku h3{background-color: #f56f0f;color:#FFF;font-size: 33px;font-weight: 600;line-height: 1.6;padding:10px 0;}
.cospakenchiku-waku h3 span{color:#ff6f09;}

.bubble {
        position: relative;
        display: inline-block;
        padding: 6px 10px;
        margin: 0 5px;
        background-color: #222;
        text-align: left;
        letter-spacing: .1rem;
        font-weight: 600;
        line-height: 1.5;
        color: #FFF;
}

.bubble::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 25%;
  border-style: solid;
  border-width: 30px 15px 0 0;
  border-color: #222 transparent transparent;
  translate: calc(-50% - 0.4px) 100%;
}


/* 会社概要 */
@import url('https://fonts.googleapis.com/css2?family=Yuji+Syuku&display=swap');

.sign {font-family: 'Yuji Syuku', serif; font-size: 1.6rem;text-align: right;padding-top: 10px;}
.sign span { font-size: 1rem;}
.message-box{max-width: 1100px;margin: 0px auto;padding: 30px;background-color: #FFF;display: flex;justify-content: space-between;gap: 30px;}
.message-txt{line-height: 2;text-align:justify;}
.message-pic{}
.c-gaiyo{width:calc(100% - 60px) !important;border:unset !important;}
.c-gaiyo th,.c-gaiyo td{border-left:unset !important;}
.c-gaiyo td{line-height:2;position:relative;}
.c-gaiyo td:before{content: ""; display: block;position: absolute;top: 15px;left: 0px;background-color: #e0e0e0;width: 3px;height: calc(100% - 30px);}

/* 建築中の現場 */
.genba-main{display:flex;gap:30px;align-items:stretch;margin-bottom:30px;}
.genba-main .wrap{display: flex;flex-direction: column;flex: 1;gap: 20px;}
.genba-main .days{text-align:right;padding-bottom:10px;border-bottom:1px dashed #dfdfdf;margin-bottom:10px;color:#6e6e6e}
.genba-main .txt{line-height:1.8;flex:1;}
.genba-main .pic{flex:2;}
.genba-main .pic img{width:100%;height:auto;}

.genba-blog-flex{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;margin:30px auto;}
.genba-blog-box{width:calc(33% - 14px);}
.genba-blog-box img{width:100%;height:auto;}
.genba-blog-box .txt{padding-top:6px;font-size:14px;line-height:1.5;text-align:justify;letter-spacing:.01rem;}

/* イベント情報 */
section.event{padding:50px;background-color:#f7f7f7;}
.event-flex{display:flex;justify-content:space-between;gap:30px;max-width:1000px;margin:30px auto;}
.event-flex .pic{flex:2;}
.event-flex .txt{font-size: 18px;font-weight: 500;flex:1.4;}
.event-flex .txt li{padding:12px;}
.event-flex .txt li span{padding-right:10px;border-right:2px solid #dfdfdf;margin-right:10px;}
section.event .more-bt{width:100%;height:110px;display:flex;align-items:center;font-size:24px;}
section.event .more-bt:hover{background-color:#6e6e6e;color:#FFF;}
section.event .more-bt:hover{background-image:url(../../../image/common/more-bt-arrow_w.svg) ;}

/*------------------------------
　フッター
------------------------------*/
.apply-bana-set {
  display: flex;
  position: relative;
  width: 100%;
  height: 360px;
  margin: 0 auto;
}

.apply-bana-set a {
  flex: 1;
  height: 360px;
  background-size: cover;
  display: flex;justify-content: center;align-items:center;transition:.3s;
}
.apply-bana-set a:hover{filter: brightness(1.3);}
.apply-bana-set a.-panf {
  background-image: url(../../../image/common/bana-bg-panf.webp);
	background-position: right;
  clip-path: polygon(0 0, 100% 0, 85% 100%, 0 100%);
  -webkit-clip-path: polygon(0 0, 100% 0, 85% 100%, 0 100%);
  z-index: 1;
}

.apply-bana-set a.-apply {
  background-image: url(../../../image/common/bana-bg-apply.webp);
	background-position: left;
  clip-path: polygon(15% 0, 100% 0, 100% 100%, 0 100%);
  -webkit-clip-path: polygon(15% 0, 100% 0, 100% 100%, 0 100%);
  margin-left: -8%;
  z-index: 2;
}
.apply-bana-set img{max-width:100%;height:auto;}
@media (max-width: 1200px){
.bana-set{margin: 30px 7vw;max-width: calc(100% - 8vw);min-width: 800px;}
}

footer{background-color:#222;padding:50px;}
.footer-wrap{max-width:1100px;margin:0 auto;color:#FFF;display:flex;justify-content:center;align-items:center;}
.footer-logo{padding:0 10px;border-right:2px solid;}
.footer-address{padding-left:10px;line-height:2;}
.copyright{text-align:center;color: #a5a5a5;font-size: 14px;letter-spacing: .1rem;padding-top: 30px;}
/*************************************************
 * カタログDL
 * ********************************************************/
#panf-img-set {padding:30px;}
#panf-img-set .wpcf7-checkbox{display:flex;justify-content:center;flex-wrap:wrap;gap:20px;}
#panf-img-set .wpcf7-list-item{width:calc(33% - 20px);margin:0;}
#panf-img-set .wpcf7-list-item:before{content:"";display: block;aspect-ratio: 42 / 28;background-size: cover;background-repeat: no-repeat;}
#panf-img-set .wpcf7-list-item label{display:flex;align-items:center;justify-content:flex-start;padding:6px;gap:6px;}
#panf-img-set .wpcf7-list-item input{width: 24px;height: 24px;}


#panf-img-set .wpcf7-list-item:nth-child(1)::before{background-image:url(../../../image/catalog/catalog1.webp);}
#panf-img-set .wpcf7-list-item:nth-child(2)::before{background-image:url(../../../image/catalog/catalog2.webp);}
#panf-img-set .wpcf7-list-item:nth-child(3)::before{background-image:url(../../../image/catalog/catalog3.webp);}

.apply-title{text-align:center;padding-top:30px;}
.apply-thx-come{text-align: center;font-size: 18px;line-height:2.2;margin:50px auto;}

.form-thanks{width:100%;padding:60px 40px;text-align:center;line-height:2;background-color:rgb(255 255 255 / 80%);margin-top:20px;}
.thanks-title{font-size:36px;}