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

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

.m-b30{margin-bottom: 30px;}
.m-b50{margin-bottom: 50px;}

h1{font-size: 32px;font-weight: 500;}
h2{font-size: 26px;font-weight: 600;color: #41210f;letter-spacing: .1rem;}
h3{font-size: 21px;font-weight: 500;color: #41210f;letter-spacing: .1rem;margin-top: 16px;}
h3:before{content: "◆";color: #41210f;letter-spacing: .1rem;}

.bana-mae-txt{font-size:18px;font-weight:600;max-width:1000px;margin:0 auto;line-height:1.8;text-align:center;color:#41210f;}
.bana-waku{max-width:1000px;margin:30px auto;}
.bana-waku img{width:100%;height:auto;}
/*------------------------------
　ヘッダー
------------------------------*/
header{}
.header-inner{display: flex;justify-content: space-between;height:90px; }
.h-logo{line-height: 1;padding: 0 10px;}
.h-bt-set{display: flex;justify-content: flex-end;}
.bt-tel{display: flex;justify-content: center;align-items: center;padding: 0 20px;}
.bt-aly,.bt-clg{display: flex;justify-content: space-between;gap:10px; align-items: center;color: #FFF;font-size: 14px;padding: 0 10px 0 20px;line-height: 1.2;letter-spacing: .02rem;width: 150px;}
.bt-aly{background-color: #1db7ce;}
.bt-clg{background-color: #72441f;}
.h-bt-arrow{width: 10px !important;height: auto !important;}

.hamburger-set{display: none;}
.nav-set{background-size: auto auto;
        background-color: rgba(65, 33, 15, 1);
        background-image: repeating-linear-gradient(135deg, transparent, transparent 7px, rgba(78, 40, 18, 1) 7px, rgba(78, 40, 18, 1) 9px);}
.nav-list{display: flex;justify-content: center;max-width: 1280px;margin: 0 auto;padding: 14px;}
.nav-list li{}
.nav-list li a{font-size: 16px;color: #FFF; padding: 7px 40px;display: flex;justify-content: center;border-left: 1px solid #FFF;}
.nav-list li:first-child a{border-left: unset;}


/*------------------------------
　TOPコンテンツ
------------------------------*/

.list-bt{display: flex;justify-content: space-between;align-items: center;color: #FFF;border-radius: 5px; height: 50px;width: 240px;padding: 15px 10px 15px 15px;font-size: 16px;margin: 25px auto;
background-size: auto auto;
background-color: rgba(65, 33, 15, 1);
background-image: repeating-linear-gradient(135deg, transparent, transparent 7px, rgba(78, 40, 18, 1) 7px, rgba(78, 40, 18, 1) 9px);}
.list-bt:hover{background-color: #72441f;background-image: repeating-linear-gradient(135deg, transparent, transparent 7px, #8a5429 7px, #8a5429 9px);}
.list-bt.apply-go{width:100%;padding:30px;font-size:21px;font-weight:500;margin:0;letter-spacing:1px;transition:.3s;background-color: #1db7ce;background-image: repeating-linear-gradient(135deg, transparent, transparent 7px, #2bcbe3 7px, #2bcbe3 9px);}
.list-bt.apply-go:hover{background-color:#20cfea;}
.apply-go .h-bt-arrow{width:20px !important;}
.slider{}
.slider img{width: 100%;height: auto;}
.slider-waku{max-height: 600px;position: relative;overflow: hidden;}
.slider-come{height: 600px; display: flex;justify-content: center;align-items: center;}

.bana-set{display: flex;justify-content: center;align-items: center;gap:30px;max-width: 900px;margin: 40px auto;}
.bana-set img{width: 100%;height: auto;}

.section-title{max-width: 1280px;margin: 30px auto 0;}
.event-waku{display: flex;justify-content: space-between;align-items: stretch;gap:30px;max-width: 1280px;padding:30px 0;margin:0 auto;}
.event-waku + .event-waku{border-top:1px dashed #afafaf;}
.event-pic{flex:1;}
.event-pic img{width: 100%;height: auto;}
.event-info{flex:1.4;display: flex;flex-direction: column;align-items: stretch;justify-content: space-between;}
.event-info h2{font-size: 32px;font-weight: 600;padding: 0 10px 15px;border-bottom: 2px solid;margin-bottom: 15px;}
.event-info .info-set{flex:1;}
.event-info .info-set div{font-size: 18px; padding: 10px 15px;width: 100%;border-bottom:1px dotted #ccc;}
.event-info div span{font-weight: 600;padding-right: 10px;}
.event-info p{margin-top: 15px; padding: 15px;}
.more-bt{display: block;text-align: right;}
.more-bt img{max-width: 320px; width: auto;height: auto;}


.-single .event-info{justify-content: flex-start;}
.-single .info-set{flex:unset;padding-bottom:15px;}


section#about{padding: 50px;background-color: #f5ece6;}
.about-flex{max-width: 1280px;margin: 0 auto;display: flex;justify-content: center;align-items:center;gap:4vw;}
.kouzou-pic img{max-height: 500px;width: auto;}
.about-txt {}
.about-txt p{line-height: 2.2;padding: 10px;font-size: 18px;}
.about-txt p b{color:#1db7ce; }

section#works{max-width: 1280px;margin: 50px auto;display: flex;justify-content: center;align-items: flex-start;}
.works-flex{display: flex;gap:20px;flex-wrap:wrap;}
.works-list-box{width: calc((100% / 3) - 15px);border:1px solid #2f4a55;position: relative;}
.works-list-box .pic{aspect-ratio: 1.4 / 1;}
.works-list-box .pic img{width: 100%;height:100%;object-fit:cover;}
.works-list-box .info-set{padding: 5px;}
.works-list-box .txt{font-size: 14px;padding: 6px;}
.works-list-box .txt b{font-size:18px;}
.works-list-box:after{position: absolute;bottom:6px;right:10px; content: "";background-image: url("../../../image/common/more-arrow-mini.svg");background-repeat: no-repeat; width: 80px;height: 20px;background-size: 100%;background-position: bottom;}

section#service{display: flex;justify-content: space-between;align-items: flex-start;gap:2px;}
.service-waku{width: 100%;}
.service-waku img{width: 100%;height: auto;}

/*------------------------------
　フッター
------------------------------*/
footer{background-color: #f0f0f0;padding: 2vw;}
.f-logo{flex:1.6;padding-right: 30px;}
.f-logo img{width: 100%;height: auto;}
.footer-inner{max-width: 1280px;margin: 0px auto;display: flex;gap:30px;}
.f-menu{flex:1;font-size: 14px;color: #41210f;}
.f-menu li{padding: 6px;}
.f-menu-bt-set{display: flex;justify-content: flex-start; flex:3;gap:20px;}
.f-menu-bt-set img{height: auto;width: 100%;}

/*------------------------------
　下層ページ
------------------------------*/
.page-title{background-color: #795548;padding: 30px;line-height: 1.2;text-align: center;color: #FFF;letter-spacing: .2rem;}
.page-title h1{max-width: 1280px;margin: 0 auto;}

.post-title{padding:15px;font-size:26px;border-bottom:2px solid #41210f;border-top:2px solid #41210f;font-weight:600;}
.single-post{padding:30px;}
.single-post p{padding:1rem !important;}
.single-post h1 {background: #f5ece6;border-left: solid 10px #41210f;padding: 0.75rem 1.5rem;}
.single-post h2 {background: #41210f;padding: 1rem;position: relative;color: #fff;margin:30px auto 20px;}
.single-post h2:before {position: absolute;content: '';top: 100%;left: 0px;border: none;border-bottom: solid 10px transparent;border-right: solid 20px rgb(20, 86, 110);}
.single-post h3{padding-left:1rem;margin:20px auto 0;}
.single-post h4{background-color:#f5ece6;padding:10px;margin:20px 0 0px 1rem;}

.single-page{max-width: 1280px;margin: 60px auto 30px;flex:1;}
.single-page img{width: 100%;height: auto;}
.single-page h2{}
.single-page h2 b{background:linear-gradient(transparent 70%, #fff877 0%);}

.single-page p{line-height: 2.2;padding: 24px 0;}
.spec-hoso{display: block;line-height: 1.5;}
.spec-hoso h4{font-weight:600;padding-bottom:5px;}
.spec-hoso li{display:block;}
.spec-hoso li:last-child{padding-bottom:10px;}
.spec-hoso li:before{content:"●";padding-left:10px;padding-right:5px;font-size:12px;}
.hoso{display: block;font-size: 88%;color: #666;line-height: 1.5;}
.color-waku{background-color: #f5ece6;text-align: center;padding: 30px 0 0;margin-top: -30px;}
.inner{max-width: 1280px;margin: 0 auto;}
.inner img{width: 100%;height: auto;}

.flex-waku{display: flex;justify-content: space-between;align-content: flex-start;}
.flex-waku.a-bottom{align-items: flex-end;}
.flex-waku.-center{justify-content: center;gap:30px;}
.flex-waku > .waku-1{width: 260px;}
.flex-waku > .waku-2{flex:2;}
.flex-waku > .waku-3{flex:3;}

.flex-waku > .waku-2 img{width:100%;height:auto;padding-left:30px;}

/* 超ローコストの理由 */
.kakaku-list{margin: 15px auto;width: 100%;border:1px solid #41210f;}
.kakaku-list tr{}
.kakaku-list th{font-weight: 500; background-color: #41210f;color: #FFF;padding: 10px;letter-spacing: .1rem;text-align: center;border-left: 1px dotted;}
.kakaku-list td{padding: 10px;letter-spacing: .1rem;text-align: center;border-left: 1px dotted #e0e0e0;}
.kakaku-list tr:nth-child(odd) td{background-color: #e7e4d4;}

.planimg {position: relative;display: inline-block;}
.planimg img {display: block;width: 100%;height: auto;}

/* クリックエリア1 */
.-p01 > .click-zone {
  position: absolute;
  top: 435px;
  left: 62px;
  width: 475px;
  height: 304px;
  cursor: pointer;
  background: rgba(255, 255, 255, 0); /* 完全透明 */
  z-index: 10;
}

/* クリックエリア2 */
.-p02 > .click-zone {
  position: absolute;
  top: 122px;
  left: 62px;
  width: 475px;
  height: 304px;
  cursor: pointer;
  background: rgba(255, 255, 255, 0); /* 完全透明 */
  z-index: 10;
}

/* モーダル（拡大画像） */
.modal {
  display: none; /* ← 初期状態 */
  position: fixed;
  z-index: 9999;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0,0,0,0.7);
  justify-content: center;
  align-items: center;
}
.modal-content {
  position: relative;
  margin: 5% auto;
  padding: 10px;
  width: 80%;
  max-width: 800px;
  background-color: #fff;
  text-align: center;
}

.modal-content img {
  max-width: 100%;
  height: auto;
}

.close-button {
  position: absolute;
  top: 10px;
  right: 20px;
  font-size: 28px;
  font-weight: bold;
  color: #333;
  cursor: pointer;
}



/* 建築の流れ */
.anchor-bt{background-color: #c3b993;color: #FFF;display: flex;justify-content: center;align-content: center;width: 400px;padding: 30px 20px;letter-spacing: .1rem;font-size: 21px;position: relative;}
.anchor-bt.-active{background-color: #41210f;}
.anchor-bt.-active:before {
  content: "";
  position: absolute;
  top: 100%;
  left: 50%;
  margin-left: -30px;
  border: 30px solid transparent;
  border-top: 30px solid #41210f;
}

.flow-waku{}
.flow-list{width: 1000px;margin: 40px auto;}
.flow-list-flex{display: flex;justify-content: flex-start;align-items: stretch;}
.flow-title{width: 240px;font-size: 18px;background-color: #f5ece6;color: #41210f;display: flex;justify-content: flex-start;flex-direction: column;align-items: center;position: relative;font-weight: 500;padding-top: 60px;}
.flow-list-flex:nth-child(n+2) .flow-title{}
.flow-list-flex:nth-child(n+2) .flow-title:before{content: "";background-image: url("../../../image/flow/flow-arrow.svg");background-size: 100%;display: block;position: absolute;top:-1px;left:0; background-position: bottom;height: 40px;width: 100%;}
.flow-list-flex:first-child .flow-txt{padding-top: 30px;}
.flow-list-flex:last-child .flow-title,.flow-list-flex:last-child .flow-txt{padding-top: 60px;padding-bottom: 40px;}
.flow-title .no b{font-size: 160%;}
.flow-title .dai{padding-top: 12px;}
.flow-txt{flex:1;border-bottom: 1px dashed #abcf70;padding: 40px 30px; line-height: 1.6;position: relative;}

/* 会社概要 */
#company.single-page{max-width: 1000px;}

@import url('https://fonts.googleapis.com/css2?family=Yuji+Syuku&display=swap');
.sign {font-family: 'Yuji Syuku', serif; font-size: 1.8rem;text-align: right;}
.sign span { font-size: 1.1rem;}

.message{padding-right: 30px;flex:1;}
.message p{text-align:justify;}
.company-line-waku{margin: 30px auto;}
.company-line{display: flex;border-bottom:1px solid #41210f;}
.company-line > div{line-height: 1.6; padding: 5px 15px; margin: 10px auto;}
.company-line-l{width: 240px;color: #41210f;font-weight: 500;border-left:3px solid #c3b993;}
.company-line-r{width: auto;flex:1;border-left:2px solid #f0f0f0;}

.company-line-r iframe {width: 100%;height: 200px;}

/* 施工事例 */
.wks-info{margin:10px 0 10px;letter-spacing: 1px;}
.wks-info tr{display:flex;align-items: center;}
.wks-info th{font-weight: 500; font-size: 88%; padding: 3px 10px 5px; background-color: #949494;border-radius: 5px;color: #FFF; line-height: 1;}
.wks-info td{padding:2px 1.5rem 5px .5rem;}

/* 新規プロジェクト情報 */
.project-catch{font-size:18px;text-align:center;line-height:1.8;font-weight:500;}
.project-midashi{text-align:center;font-size:26px;font-weight:600;color:#384b55;letter-spacing:.1rem;padding:30px 0 40px;}
.project-midashi b{font-size:200%;color:#41210f;}

.project-flex{display:flex;justify-content:center;gap:20px;}
.merit-box{width:calc((100% / 3) - 15px);position:relative;border-radius: 20px 0;border:1px solid #41210f;display:flex;flex-direction:column;justify-content:space-between;}
.merit-box .number{background-color:#41210f;display:flex;justify-content:center;align-items:center;color:#FFF;font-size:30px; width: 60px;height: 60px; border-radius: 18px 0;position:absolute;}
.merit-box .pic{}
.merit-box .pic img{width:100%;height:100%;object-fit:cover; border-radius: 20px 0 0;}
.merit-title{font-size:21px;font-weight:500;padding:10px;color:#41210f;text-align:center;flex:1;display:flex;flex-direction: column; align-items: center; justify-content: center;line-height: 1.4;}
.merit-title p{font-size:12px;line-height:1.4;font-weight:normal;color:#555;padding:6px 10px 0 !important;}
.project-midashi2{text-align:center;font-size:26px;font-weight:600;color:#384b55;letter-spacing:.1rem;padding:60px 0 0;}

/*************************************************
 * カタログ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: 13 / 9;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/gran_RC.webp);}
#panf-img-set .wpcf7-list-item:nth-child(2)::before{background-image:url(../../../image/catalog/gran-tochi.webp);}
#panf-img-set .wpcf7-list-item:nth-child(3)::before{background-image:url(../../../image/catalog/gran-souzoku.webp);}

.apply-title{text-align:center;}
.apply-thx-come{text-align: center;font-size: 18px;line-height:2;padding:30px 0;margin-top: 60px; background-color: #f0f0f0;}