@charset "UTF-8";
/* ==========================================================
TOP PAGE
MV
========================================================== */

.mv{
position:relative;
display:flex;
align-items:center;
min-height:700px;
overflow:hidden;
background:#0f2747;
color:#fff;
}

.mv-bg{
position:absolute;
inset:0;
z-index:1;
}

.mv-bg img{
width:100%;
height:100%;
object-fit:cover;
}

.mv::before{
content:"";
position:absolute;
inset:0;
background:rgba(0,0,0,.45);
z-index:2;
}

.mv .container{
position:relative;
z-index:3;
}

.mv-content{
max-width:720px;
}

.mv-sub-title{
margin-bottom:1rem;
font-size:1rem;
font-weight:700;
letter-spacing:.2em;
text-transform:uppercase;
color:#fff;
}

.mv-title{
margin-bottom:1.5rem;
font-size:clamp(2.5rem,5vw,4.5rem);
line-height:1.2;
font-weight:700;
}

.mv-text{
margin-bottom:2rem;
font-size:1.125rem;
line-height:2;
}

/* ==========================================================
ABOUT
========================================================== */

.about-wrapper{
display:grid;
grid-template-columns:1fr 1fr;
gap:4rem;
align-items:center;
}

.about-image img{
border-radius:12px;
box-shadow:var(--shadow);
}

.about-content>p{
margin-bottom:2rem;
}

.about-points{
display:grid;
gap:1.5rem;
}

.about-point{
padding:1.25rem 1.5rem;
background:#fff;
border-radius:12px;
box-shadow:var(--shadow);
	letter-spacing:.1em;

}

.about-point-icon{
margin-bottom:1rem;
}

.about-point-icon img{
width:60px;
height:60px;
object-fit:contain;
}

.about-point h3{
margin-bottom:.75rem;
color:var(--color-primary);
		font-size: 18px !important;
}

/* ==========================================================
SERVICE
========================================================== */

.service-grid{
display:flex;
flex-wrap:wrap;
justify-content:center;
gap:2rem;
}

.service-card{
height:100%;
overflow:hidden;
background:#fff;
border-radius:12px;
box-shadow:var(--shadow);
transition:var(--transition);
flex:0 0 calc((100% - 4rem) / 3);
max-width:calc((100% - 4rem) / 3);
}

.service-card:hover{
transform:translateY(-8px);
}

.service-image{
overflow:hidden;
}

.service-image img{
width:100%;
aspect-ratio:4/3;
object-fit:cover;
transition:transform .4s ease;
}

.service-card:hover .service-image img{
transform:scale(1.05);
}

.service-body{
padding:1.25rem 1.5rem;
}

.service-title{
margin-bottom:1rem;
font-size:18px;
font-weight:700;
color:var(--color-primary);
}

.service-text{
margin-bottom:1.5rem;
line-height:1.8;
}

.service-button{
display:inline-block;
font-weight:700;
color:var(--color-secondary);
}
@media (max-width:1024px){

.service-card{
flex:0 0 calc((100% - 2rem) / 2);
max-width:calc((100% - 2rem) / 2);
}

}

@media (max-width:768px){

.service-card{
flex:0 0 100%;
max-width:100%;
}

}
/* ==========================================================
RECRUIT
========================================================== */

.recruit-inner{
display:grid;
grid-template-columns:1fr 1fr;
gap:4rem;
align-items:center;
}

.recruit-content{
display:flex;
flex-direction:column;
justify-content:center;
text-align:center;
}

.recruit-text{
margin:2rem 0;
font-size:;
line-height:2;
color:var(--color-text);
	max-width:600px;
margin:30px auto 0;
}

.recruit-buttons{
display:flex;
	justify-content:center;
	margin-top:40px;
flex-wrap:wrap;
gap:20px;
}

.recruit-image img{
display:block;
width:100%;
border-radius:12px;
box-shadow:var(--shadow);
object-fit:cover;
}

@media (max-width:768px){

.recruit-inner{
grid-template-columns:1fr;
gap:3rem;
}

.recruit-content{
text-align:center;
}

.recruit-buttons{
justify-content:center;
	margin-bottom:30px;
}

.recruit-image{
order:-1;
}

}

@media (max-width:480px){

.recruit-buttons{
flex-direction:column;
align-items:center;
}

.recruit-buttons .btn-primary,
.recruit-buttons .btn-secondary{
width:100%;
max-width:320px;
}

}
/* ==========================================================
NEWS
========================================================== */

.news-grid{
display:flex;
flex-wrap:wrap;
justify-content:center;
gap:2rem;
}

.news-card{
flex:0 0 calc((100% - 4rem) / 3);
max-width:calc((100% - 4rem) / 3);
background:#fff;
border-radius:12px;
overflow:hidden;
box-shadow:var(--shadow);
transition:var(--transition);
}

.news-card:hover{
transform:translateY(-6px);
}

.news-image{
overflow:hidden;
}

.news-image img{
width:100%;
aspect-ratio:4/3;
object-fit:cover;
transition:transform .4s ease;
}

.news-card:hover .news-image img{
transform:scale(1.05);
}

.news-body{
padding:0rem 1.5rem;
}

.news-body time{
display:block;
margin-bottom:.75rem;
font-size:.875rem;
color:#888;
}

.news-body h3{
margin-bottom:.75rem;
font-size:16px;
font-weight:700;
line-height:0;
color:var(--color-primary);
}

.news-body p{
line-height:1.8;
margin-bottom:1rem;
}

.news-button{
margin-top:40px;
text-align:center;
}

.news-button .btn-primary{
display:inline-flex;
}
/* ==========================================================
CONTACT
========================================================== */

.contact-box{
padding:5px 40px 40px;
background:var(--color-primary);
border-radius:16px;
text-align:center;
color:#fff;
}

.contact-box .section-subtitle{
color:#fff;
}

.contact-box .section-title{
margin-bottom:1.5rem;
color:#fff;
}

.contact-text{
max-width:760px;
margin:0 auto 2rem;
line-height:2;
}

/* ==========================================================
Responsive
========================================================== */
@media (max-width:1024px){

.service-card,
.news-card{
flex:0 0 calc((100% - 2rem) / 2);
max-width:calc((100% - 2rem) / 2);
}

}

@media (max-width:768px){

.mv{
min-height:560px;
}

.about-wrapper{
grid-template-columns:1fr;
gap:3rem;
	margin-bottom:40px;
}

.service-grid,
.news-grid{
grid-template-columns:1fr;
}

.contact-box{
padding:5px 2rem;
}
.service-card,
.news-card{
flex:0 0 100%;
max-width:100%;
}
}

@media (max-width:480px){

.mv{
min-height:500px;
}

.mv-title{
font-size:2.2rem;
}

.mv-text{
font-size:1rem;
}

.contact-box{
padding:5px 1.5rem 20px;
}

}

.recruit .section-title{
border:none !important;
}
.contact .section-title{
border:none !important;
}
