/*------------------------------------------------------------
	FOR PC LAYOUT CSS
------------------------------------------------------------*/
@media screen and (min-width:768px){

/*------------------------------------------------------------
	BODY BASIC
------------------------------------------------------------*/
body{
font-size:14px;
line-height:1.75;
font-feature-settings:'palt';
letter-spacing:.15em;
}

/*------------------------------------------------------------
	RESPONSIVE
------------------------------------------------------------*/
.pconly{ display:block; }
.sponly{ display:none; }


/*------------------------------------------------------------
	HEADER
------------------------------------------------------------*/
header{
width:1400px;
height:42px;
position:absolute;
top:25px;
left:50%;
transform:translate(-50%, 0);
display:flex;
justify-content:space-between;
padding:0 100px 0 60px;
align-items:center;
box-sizing:border-box;
z-index:10;
}

.head-logo{
display:flex;
justify-content:space-between;
width:526px;
align-items:center;
}

.bc-mark{
width:74px;
}
.bcd-mark{
width:388px;
}


.head-navi{
width:432px;
}
.navi{
display:flex;
justify-content:space-between;
position:relative;
}

.navi li a{
display:block;
padding:5px 0;
position:relative;
}


.navi li:nth-child(1) a{ width:74px; }
.navi li:nth-child(2) a{ width:68px; }
.navi li:nth-child(3) a{ width:56px; }
.navi li:nth-child(4) a{ width:53px; }
.navi li:nth-child(5) a{ width:72px; }


.navi li a::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -4px; /* テキストの下に配置 */
  width: 100%;
  height: 1px;
  background: #ef8200;
  transform: scaleX(0);
  transform-origin: center; /* 中央から伸びる */
  transition: transform 0.2s ease;
}

.navi li a:hover::after {
  transform: scaleX(1); /* フル幅に */
}





/*------------------------------------------------------------
	CONTENT
------------------------------------------------------------*/
#kv{
width:100%;
height:0;
padding-bottom:50%;
background:url(img/kv.jpg) no-repeat center top;
background-size:cover;
margin:0 auto;
position:relative;
}

.kv-copy{
width:442px;
height:92px;
position:absolute;
top:50%;
left:200px;
margin-top:-46px;
}

.para{
will-change: transform;
transition: transform 0.1s linear;
}


#index1{
padding:76px 0 103px;
}
.i1-ttl{
width:59px;
margin:0 auto 45px;
}

.i1-copy{
font-size:20px;
line-height:38px;
text-align:center;
letter-spacing:.2em;
margin:0 0 40px;
font-weight:bold;
}

.i1-lead{
width:792px;
margin:0 auto;
text-align:justify;
font-size:14px;
line-height:37px;
letter-spacing:.14em;
}

#index2{
padding:0 0 85px;
}

.scr-d{
margin-bottom:100px;
}


.svc-cont01{
padding:10px 0 130px;
background:linear-gradient(to bottom, #fef9f2 90%, transparent 100%);
}

.i2-ttl{
width:59px;
margin:0 auto 73px;
}

.i2-copy{
font-size:27px;
line-height:38px;
letter-spacing:.18em;
font-weight:bold;
margin-bottom:10px;
text-align:center;
}
.i2-copy-sub{
text-align:center;
font-size:19px;
line-height:38px;
font-weight:bold;
letter-spacing:.2em;
}


.bcd-svc{
width:520px;
height:520px;
margin:200px auto 0;
position:relative;
}

.bal01,
.bal02,
.bal03,
.bal04{
width:200px;
height:200px;
position:absolute;
}

.svc-txt{
width:344px;
height:103px;
position:absolute;
top:50%;
left:50%;
margin-top:-52px;
margin-left:-172px;
}


.bal01{ top:-32px; left:-32px; }
.bal02{ top:-32px; right:-32px; }
.bal03{ bottom:-32px; left:-32px; }
.bal04{ bottom:-32px; right:-32px; }




.svc-cont02{
padding:0 0 0;
}

.svc-copy{
width:616px;
margin:0 auto 50px;
}
.svc-desc{
width:790px;
margin:0 auto 78px;
font-size:14px;
line-height:33px;
letter-spacing:.15em;
}

.flow{
width:1000px;
margin:0 auto;
display:flex;
flex-wrap:wrap;
gap:62px 0;
justify-content:flex-end;
}

.flow01{
width:1000px;
}
.flow02{
width:956px;
}


#index3 {
  position: relative;
  height: auto;
}

.ttl-works{
width:43px;
height:10px;
margin:0 auto 92px;
}


.tabs {
  position: relative;
  height:calc(730px * 3 + 600px);
}
.tab {
  position: absolute;
  width: 1000px;
  height: 730px;
  left: 0;
  transform: translate(0, 200%); 
  transition: none;
  opacity: 1; 
  }
  
.tab-cont {
  opacity: 1;
  transition: none; 
}

.tab img {
  width: 1000px;
  max-width:1000px;
}

.last-tab{
width:1000px;
height:730px;
background:linear-gradient(to top, #fff 75%, transparent 100%);
}

.tab-ttl{
background:linear-gradient(to right, #a0a0a0 0%, #e6e6e6 100%);
color:#fff;
font-size:16px;
line-height:20px;
height:30px;
padding:5px 20px;
}

.tab-ttl-2{
background:linear-gradient(to left, #a0a0a0 0%, #e6e6e6 100%);
color:#fff;
font-size:16px;
line-height:20px;
height:30px;
padding:5px 20px;
}


#index4{
padding:400px 0 75px;
background:linear-gradient(to top, #fff 65%, transparent 100%);
position:relative;
z-index:30;
}
.i4-wrap{
width:1000px;
margin:0 auto;
display:flex;
justify-content:space-between;
}
.i4L{
width:400px;
display:flex;
justify-content:center;
flex-direction:column;
font-family:'Zen Kaku Gothic New';
margin:0;
}

.i4-ttl{
width:42px;
height:7px;
margin:0 0 65px;
}
.bcd-logo-bk{
width:314px;
margin:0 0 35px;
}
.add{
font-size:13px;
line-height:17px;
letter-spacing:.06em;
margin:0 0 40px;
}

.route li{
padding-left:1.2em;
position:relative;
font-size:11px;
line-height:25px;
letter-spacing:0.05em;
}
.route li::before{
content:'＊';
position:absolute;
top:0;
left:0;
}


.i4R{
width:550px;
height:350px;
border-radius:8px;
overflow:hidden;
}

.ggmap iframe{
filter: grayscale(1);
}




.backbtn a{
margin:0 auto;
width:40px;
height:40px;
border-right:2px solid #ccc;
border-bottom:2px solid #ccc;
transform:rotate(-135deg);
position:absolute;
left:50%;
bottom:10px;
margin-left:-40px;
}




/*------------------------------------------------------------
	FOOTER
------------------------------------------------------------*/
footer{
background:#ef8200;
width:100%;
margin:0 auto;
padding:58px 0 70px;
font-family: "Zen Kaku Gothic New", sans-serif;
color:#fff;
position:relative;
z-index:30;
font-weight:normal;
}

.footer-contact{
width:1000px;
margin:0 auto 38px;
}
.ttl-contact{
width:46px;
height:7px;
margin:0 0 31px;
}
.f-email{
font-size:38px;
line-height:50px;
}


.f-info-wrap{
width:680px;
display:flex;
justify-content:space-between;
}

.f-info{
width:520px;
display:flex;
justify-content:space-between;
flex-wrap:wrap;
letter-spacing:0.05em;
}

.f-info-ttl{
width:100%;
}

.ttl-com{
width:53px;
height:9px;
margin:0 0 36px;
}

.f-com-ja{
width:245px;
font-size:13px;
line-height:17px;
margin:0;
}
.f-com-en{
width:200px;
font-size:13px;
line-height:17px;
}


.footer-inner{
width:1000px;
margin:0 auto;
display:flex;
justify-content:space-between;
align-items:center;
}

.com-name{
margin:0 0 24px;
}

.f-add{
margin:0 0 24px;
}

.f-logo{
width:106px;
height:61px;
position:relative;
right:auto;
bottom:auto;
}


.ttl-menu{
width:31px;
height:7px;
margin:0 0 38px;
}

.f-navi{
font-size:13px;
line-height:30px;
}
.f-navi li a{
color:#fff;
}



}

/*------------------------------------------------------------
	END PC LAYOUT CSS
------------------------------------------------------------*/
}