@charset "UTF-8";

/*------------------------
    TOP
-------------------*/
body{
 padding-top: 0;
}
header:not(.fixed):not(.active){
 border-bottom: none;
 background: none;
}
header:not(.fixed):not(.active) > div{
 border-bottom: 1px rgba(255,255,255,.2) solid;
}
header:not(.fixed):not(.active) #logo{
 background: url("../images/logo_wh.svg") no-repeat left top /100% auto;
}
header:not(.fixed):not(.active) #logo img{
 opacity: 0;
}

@media screen and (min-width: 769px) {/*PC TOP header */
header:not(.fixed) #gnaviList > li > a{
  color: #fff;
 }
}/*-PC only-*/
@media screen and (max-width: 768px) {/*SP TOP header */
header:not(.fixed):not(.active) .menu span{
  background: #fff;
 }
}/*-SP only-*/

/*toptest*/
#top.pgs main section{
 opacity: 1;
 transform: translateY(0px);
 transition:none;
}
/*-----------------*/
.mvbg{
 position: fixed;
top: 0;
 left: 0;
 background: #fff;
 width: 100%;
 height: 100vh;
 z-index: 0;
}
.mvbg::after{
 content: "";
 display: block;
 background: url(../images/filter_img.png) no-repeat left top/100% 100%;
 width: 100%;
 height: 100%;
 position: absolute;
 top: 0;
 left: 0;
 z-index: 999;
}
.mvbg video{
 object-fit: cover;
 width: 100%;
 height: 100%;
}
#mv{
 position: relative;
 height: 100vh;
 padding: 0;
}
#mv::after{
 content: "";
 display: block;
 background: linear-gradient(to bottom,  rgba(255,255,255,0) 0%,rgba(255,255,255,1) 100%);
 width: 100%;
 height: 65.82%;
 position: absolute;
 bottom:0px;
 left: 0;
}

/*#mvSlider{
 position: relative;
 z-index: 0;
}
#mvSlider::after{
 content: "";
 display: block;
 background: url(../images/filter_img.png) no-repeat left top/100% 100%;
 width: 100%;
 height: 100%;
 position: absolute;
 top: 0;
 left: 0;
 z-index: 999;
}
#mvSlider figure{
 height: 100vh;
}
#mvSlider figure img{
 object-fit: cover;
 width: 100%;
 height: 100%;
}
*/

#mv h2{
 position: absolute; 
 top: 50%;
 left: 50%;
 transform: translate(-50%, -50%);
 color: #fff;
 font-size: 16px;
 font-weight: 400;
 letter-spacing: 0.3em;
 line-height: 1;
 text-align: center;
 white-space: nowrap;
 z-index: 1;
}
#mv h2 span{
 display: block;
 margin-bottom: 15px;
 font-size: 50px;
 font-family: "Kantumruy Pro", sans-serif;
 letter-spacing: 0.25em;
}

@media screen and (max-width: 768px) {/*SP MV*/
#mv{
 height: 100svh;
}
#mv::after{
 background: linear-gradient(to bottom,  rgba(60,75,68,0) 0%,rgba(60,75,68,1) 100%);
 height: 49.2%;
}

#mv h2{
 top: auto;
 bottom: 16.23vh;
 font-size:26px;
 line-height: 1.46;
}
#mv h2 span{
 margin-top: 20px;
 font-size: 16px;
}

}/*-SP only-*/

main section{
 padding-top: 0;
 padding-bottom: 0;
}

/**/
#top #topAbout{
 padding: 100px 0 200px;
 background: #fff;
}
#topAbout .inner{
 position: sticky;
 top:107px;
 z-index: 1;
}
#topAbout .txts p{
 margin-bottom: 1.29em;
 line-height: 2.28;
}
#topAbout .txts .btnWrap{
 margin-top: 60px;
}

#topAbout .ph01{
 width: 41.28vw;
 margin-top: -288px;
/* max-width: 578px;*/
}
#topAbout .ph02{
 width: 41.28vw;
 margin: -16.6vw 0 0 auto;
/* max-width: 578px;*/
}
#topAbout .ph03{
 width: 30.85vw;
 margin: 7.28vw 0 0 14.14vw;
}
#topAbout .ph04{
 width: 30.35vw;
 margin:-11.2vw 11vw 0 auto;
}
#topAbout .ph05{
 width: 42.14vw;
 margin: 7vw 0 0 2.85vw;
}
#topAbout .ph06{
 width: 41.28vw;
 margin:6.35vw 0 200px auto;
}
@media screen and (min-width: 769px) {

#topAbout .txts{
 width: 50%;
 margin: 0 0 0 auto;
 padding-top: 50px;
}

}/*-PC only-*/
@media screen and (max-width: 768px) {/*SP topAbout*/
#top #topAbout{
 padding: 0 0 200px;
}
#topAbout .inner{
 position: sticky;
 top:87px;
}
#topAbout .txts{
 padding-top: 60px;
 padding-bottom: 50px;
}
#topAbout .txts p{
 font-size: min(3.27vw,14px);
 margin-bottom: 2em;
 line-height: 2;
}
#topAbout .txts .btnWrap{
 margin-top: 40px;
 text-align: right;
}
#topAbout .ph01{
 width: 77.1vw;
 margin-top: -232px;
}
#topAbout .ph02{
 width: 61.44vw;
 margin: 32.7vw 0 0 auto;
}
#topAbout .ph03{
 width: 63.55vw;
 margin: 32.7vw 0 0 5.8vw;
}
#topAbout .ph04{
 width: 55.6vw;
 margin:32.7vw 5.8vw 0 auto;
}
#topAbout .ph05{
 width: 61.44vw;
 margin: 32.7vw 0 0 0;
}
#topAbout .ph06{
 width: 69.15vw;
 margin:32.7vw 0 0 auto;
}
}/*-SP only-*/

/**/

#topBusiness{
 padding-top: 160px;
 padding-bottom: 200px;
}
#topBusiness::before{
 content: "";
	position: absolute;
	top: 0;
	left: -500%;
 background: var(--LLgray);
	width: 1000%;
	height: 100%;
	z-index: -1;
}
#topBusiness::after{
 content: "";
 display: block;
 background: url("../images/top_bg_business.svg") no-repeat left bottom/100% auto;
 width: 62%;
 height: 100%;
 position: absolute;
 left: 50%;
 bottom: 0;
 z-index: -1;
}

#topBusiness > p{
	margin-bottom: 1em;
	line-height: 2.28; /* 秋村組について(#topAbout)のリード文と行間を統一 */
}
#topBusiness p.kako{
	text-indent: -.5em;
}

.topBusinessBox{}
.topBusinessBox::before{
 content: "";
	position: absolute;
	top: 0;
	left: -500%;
 background: var(--LLgray);
	width: 1000%;
	height: 100%;
	z-index: -1;
}
.topBusinessBox .num{
 position: absolute;
 left: 0;
 -ms-writing-mode: tb-rl;
 writing-mode: vertical-rl;
 line-height: 1;
}
.topBusinessBox h2{
 margin-bottom: 30px;
 font-size: 18px;
}
.topBusinessBox h2 span{
 display: inline-block;
 margin-left: 15px;
 color: var(--gray);
 font-size: 14px;
}
@media screen and (min-width: 769px) {
 #top .topBusinessBox{
 position: sticky;
 top: 0;
 left: 0;
 background: var(--LLgray);
 padding: calc(107px + 90px) 0 90px;
}
 .topBusinessBox{
  flex-flow: row-reverse;
 }
 .topBusinessBox figure{
  width: 71.6%;
  max-width: 887px;
  margin-right: min(-6.6%,-80px);
 }
 .topBusinessBox .txts{
  width: 35%;
  max-width: 433px;
  padding: 0 8% 0 50px;
 }
}/*-PC only-*/
#topBusiness01{}

@media screen and (max-width: 768px) {/*SP #topBusiness*/
#topBusiness{
 padding-top: 100px;
}
.topBusinessBox{
 padding: 70px 0 40px 7.9%;
 }
 .topBusinessBox + .topBusinessBox::before{
  border-top: 1px var(--Lgray) solid;
 }
 .topBusinessBox figure{
  margin: 0 -5.8vw 30px 0;
 }
 .topBusinessBox figure img{
  object-fit: cover;
 width: 100%;
 height: 100%;
 aspect-ratio:369/344;
 }
 .topBusinessBox p{
  line-height: 1.85;
 }
 #topBusiness .btnWrap,
 .topBusinessBox .btnWrap{
  text-align: right;
 }

}/*-SP only-*/
/**/
#topCase{
 background: #fff;
 padding:160px 0;
 z-index: 0;
}
@media screen and (min-width: 769px) {
#topCase::before{
 content: "";
 display: block;
 background: rgba(247,247,247,.5);
 width: calc(100% - 43px);
 height: 42vw;
 clip-path: polygon(0 0, 72% 100%, 100% 0);
 position: absolute;
 top: 0;
 right: 0;
 z-index: -1;
}
}/*-PC only-*/
#topCase .inner >p{
 line-height: 2.28; /* 他セクションのリード文と行間を統一 */
}
/* 事例カードのホバー：画像・文字ともに少し薄く */
#topCase ul li a:hover{
 opacity: .7;
}
#topCase ul li figure{
 margin: 0 0 25px;
}
#topCase ul li figure img{object-fit: cover;
 width: 100%;
 height: 100%;
 aspect-ratio:1/1;
}
#topCase ul li h4{
 margin: 0 0 12px;
 line-height: 1.5; /* 2行になったときの行間を広げる */
}
#topCase ul li p{
 margin-top: 2px;
 color: var(--gray);
 font-size: 12px;
}
#topCase .btnWrap{
 border-top: 1px var(--Lgray) solid;
 margin-top: 60px;
 padding-top: 40px;
}
@media screen and (min-width: 769px) {
 #topCase ul{
  gap:0 4%;
  margin-top: 60px;
 }
 #topCase ul li{
  width: 22%;
  max-width: 270px;
 }
}/*-PC only-*/

@media screen and (max-width: 768px) {/*SP #topCase*/
#topCase{
 overflow: hidden;
  border-top: 1px var(--Lgray) solid;
 padding:90px 0 20px;
 z-index: 0;
}
#topCase .inner >p{
 line-height: 2;
}
 #topCase ul{
  margin: 50px 0 0;
  padding-right:19.4vw;
 }
 #topCase .slick-list{
  overflow: visible;
 }
 #topCase .slick-slide{
  margin-right: 25px;
 }
#topCase .btnWrap{
 border-top: 1px var(--Lgray) solid;
 margin-top: 40px;
 padding-top: 50px;
}
}/*-SP only-*/

/**/
#topFeature{
 background: #fff;
 padding-bottom: 160px;
}
#topFeature div.inner{
 padding-top: 160px;
}
#topFeature div.inner > p{
 line-height: 1.7;
}
#topFeature .pcScrollWrap{
 border-top: 1px var(--Lgray) solid;
 margin-top: 55px;
}

@media screen and (min-width: 769px) {
 #topFeature .pcScrollWrap{
  overflow:auto;
 border-bottom: 1px var(--Lgray) solid;
 }
 #topFeature .pcFlex{
  flex-flow: nowrap;
 }
 #topFeature .pcFlex li{
  flex: 1 0 auto;
  padding: 40px 0;
 }
 #topFeature .pcFlex li:only-child a{
  margin: 0 auto;
 }
 
 #topFeature .bnrFeature{
  max-width: 740px;
 }
 #topFeature .pcFlex li + li{  
  border-left: 1px var(--Lgray) solid;
  padding-left: 40px;
  padding-right: 80px;
  margin-left: 40px;
 }
 #topFeature .btnWrap{
  margin-top: 60px;
 }
}/*-PC only-*/

@media screen and (max-width: 768px) {/*SP #topFeature*/
#topFeature{
 padding-bottom: 60px;
}
#topFeature div.inner{
 padding-top: 80px;
}
#topFeature div.inner > p{
 line-height: 2;
}
 #topFeature ul{
  padding-top: 15px;
 }
 #topFeature ul li {
  margin-top: 50px;
 }
 #topFeature .btnWrap{
  margin-top: 55px;
 }
}/*-SP only-*/
/**/
#topNews{
 background: #fff;
 padding-bottom: 160px;
}
#topNews .inner{
 position: relative;
}
@media screen and (min-width: 769px) {
 #topNews .txts{
  width: 28%;
  max-width: 347px;
 }
 #topNews ul{
  width: 66%;
  max-width: 814px;}
 #topNews .btnWrap{
  position: absolute;
  bottom: 0;
  left: 0;
 }
}/*-PC only-*/
#topNews ul{
 border-top: 1px var(--Lgray) solid;}
#topNews ul li{
 border-bottom: 1px var(--Lgray) solid;
}
#topNews ul li a{
 position: relative;
 display: block;
 background: url("../images/arrow_circle.svg") no-repeat right center/48px auto;
 padding: 35px 50px 35px 0;
 line-height: 1;
}
/* ホバー時：右の丸矢印に、反転した丸（塗りつぶし＋白矢印）を重ねて表示 */
#topNews ul li a::after{
 content: "";
 position: absolute;
 right: 0;
 top: 50%;
 transform: translateY(-50%);
 width: 48px;
 height: 48px;
 border-radius: 50%;
 background: var(--base) url("../images/arrow_circle_wh.svg") no-repeat center / 48px auto;
 opacity: 0;
 transition: opacity .25s ease;
 pointer-events: none;
}
#topNews ul li a:hover::after{
 opacity: 1;
}
/* ホバー時：文字部分だけ少し薄く（丸の反転::afterは除く） */
#topNews ul li a:hover > *{
 opacity: .6;
}
#topNews ul .date{
 display: inline-block;
 font-size: 13px;
 font-family: "Rubik", sans-serif;
 font-weight: 300;
}
#topNews ul .cat{
 position: relative;
 margin-left: 15px;
 display: inline-block;
 padding:0px 0 3px 15px;
 font-size: 12px;
}
#topNews ul .cat::before{
 content: "";
 background: var(--Lgray);
 width: 1px;
 height: 9px;
 position: absolute;
 left: 0;
 top: 0;
 bottom: 0;
 margin: auto;
}
#topNews ul p{
 margin-top: 15px;
 font-size: 16px;
 line-height: 1.5;
}

@media screen and (max-width: 768px) {/*SP topNews*/
#topNews{
 border-top: 1px var(--Lgray) solid;
 padding-top: 100px;
 padding-bottom: 70px;
}
#topNews .txts{
 padding-bottom: 50px;
 }
#topNews ul li a{
 padding: 25px 104px 25px 0;
 line-height: 1;
}
 #topNews .btnWrap{
  text-align: right;
 }
 
}/*-SP only-*/
/**/
#topRecruit{
 background: #fff;
 padding-bottom: 160px;
}
@media screen and (min-width: 769px) {
#topRecruit .inner{
 position: relative;
 border-top: 1px var(--Lgray) solid;
 padding-top: 80px;
}
 #topRecruit .txts{
  width: 28%;
  max-width: 347px;
  padding-bottom: 90px;
 }
 #topRecruit figure{
  width: 66%;
  max-width: 814px;
 }
 #topRecruit .btnWrap{
  position: absolute;
  bottom: 0;
  left: 0;
 }
}/*-PC only-*/

@media screen and (max-width: 768px) {/*SP #topRecruit*/
#topRecruit{
 border-top: 1px var(--Lgray) solid;
 padding-top: 70px;
 padding-bottom: 100px;
}
 #topRecruit figure{
  margin: 40px -5.8vw 0 0;
 }
 #topRecruit .btnWrap{
  margin-top: 30px;
  text-align: right;
 }
}/*-SP only-*/



@media screen and (min-width: 769px){
  #topNews .txts{ display: flex; flex-direction: column; }
  #topNews .btnWrap{ position: static; margin-top: auto; padding-top: 30px;}
}

