@charset "utf-8";

/* =========================== PAGE */
#about1024{position:relative;padding:100px 0 0;font-size:15px;line-height:1.5;color:#777;font-family:var(--k-font)}
#about1024 .inner{max-width:var(--mainsize);margin:0 auto}
#about1024 .pl{white-space:pre-line}
#about1024 *{word-break:keep-all}

#about1024 .tit{margin-bottom:30px}
#about1024 .tit span{font-weight:600}
#about1024 .tit h2{font-size:35px;font-weight:700;color:#111}
#about1024 .box01 img{overflow:hidden;border-radius:30px}
#about1024 .box01 dt{margin-bottom:10px;padding-bottom:10px;border-bottom:2px solid var(--primary);font-weight:700;color:var(--primary)}
#about1024 .box01 dd{font-size:18px;font-weight:500;color:#111}
#about1024 .box01 .info{display:grid;grid-template-columns:repeat(2,1fr);margin-top:50px}

#about1024 .box02{margin-top:100px;padding:100px 0;background:#f5f5f5}
#about1024 .box02 .tit{margin-bottom:80px;text-align:center}
#about1024 .box02 .review{display:flex;justify-content:space-between;gap:20px}
#about1024 .box02 ul{display:flex;flex-wrap:wrap;gap: 20px;
    width: 75%;}
#about1024 .box02 ul li{overflow:hidden;border-radius:30px;width:calc(100% / 3 - 20px);height:550px;background-position:center;background-size:cover}
#about1024 .box02 ul li:nth-child(1){background-image:url('../img/sub/about1024_img02.jpg')}
#about1024 .box02 ul li:nth-child(2){background-image:url('../img/sub/about1024_img03.jpg')}
#about1024 .box02 ul li:nth-child(3){background-image:url('../img/sub/about1024_img04.jpg')}
#about1024 .box02 ul li:nth-child(4){background-image:url('../img/sub/about1024_img05.jpg')}
#about1024 .box02 ul li:nth-child(5){background-image:url('../img/sub/about1024_img06.jpg')}
#about1024 .box02 ul li:nth-child(6){background-image:url('../img/sub/about1024_img07.jpg')}
#about1024 .box02 ul li:nth-child(4), #about1024 .box02 ul li:nth-child(6){transform:translateY(-220px)}
#about1024 .box02 ul li a{position:relative;display:block;height:100%;padding:24px;color:#fff}
#about1024 .box02 ul li a span{
    font-weight: 700;
    font-size: 14px;
    display: block;
    padding: 8px 12px;
    border-radius: 12px;
    background: #fff;
    color: var(--primary);
    width:fit-content;
}
#about1024 .box02 ul li:nth-child(1), #about1024 .box02 ul li:nth-child(3){height:325px}
#about1024 .box02 ul li div{position:relative;z-index:10;display:flex;flex-direction:column;justify-content:space-between;height:100%;}
#about1024 .box02 ul li a:after{position:absolute;content:'';top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,.2);transition:all .3s}

#about1024 .box02 ul li p{
    font-size: 16px;
}



#about1024 .box02 .sticky{position:sticky;top:30px;display:flex;flex-direction:column;align-items:flex-start;justify-content:space-between;width:330px;height:330px;padding:40px 30px;border-radius:30px;color:#fff;background:#111}
#about1024 .box02 .sticky p{margin-bottom:10px;font-size:30px;font-weight:700}
#about1024 .box02 .sticky a{display:inline-block;padding:10px 25px;border-radius:50px;border:2px solid #fff;font-weight:600;color:#fff;text-align:center;transition:all .3s}

#about1024 .box03{padding:150px 0;color:#fff;text-align:center;background:url('../img/sub/about_bottom.jpg') no-repeat center;background-size:cover}
#about1024 .box03 .tit{margin-bottom:10px}
#about1024 .box03 .tit h2{margin-top:15px;color:#fff}
#about1024 .box03 a{display:block;width:160px;margin:25px auto 0;padding:12px 0;border:2px solid #fff;border-radius:50px;font-size:16px;font-weight:700;color:var(--primary);background:#fff;transition:all .3s}

@media(hover:hover){
/* #about1024 .box02 ul li a:hover:after{opacity:0} */
#about1024 .box02 ul li a:hover:after{
    /* background: #ff852e96; */
    background: #c56119db;
}
#about1024 .box02 .sticky a:hover{color:#111;background:#fff}
#about1024 .box03 a:hover{color:#fff;background:none}
}

@media(max-width:1440px){
    #about1024 .inner{padding:0 15px}
    #about1024 .box01 img{width:100%}
    #about1024 .box03{padding:90px 0}
    #about1024 .box01 .info {
        gap: 20px;
    }
    #about1024 .box01 .info .desc br{
        display: none;
    }
}
@media(max-width:1024px){
    #about1024 .tit h2{font-size:30px}
    #about1024 .box01 dd{font-size:16px}
    #about1024 .box02{margin-top:70px;padding:70px 0}
    #about1024 .box02 .sticky p{font-size:18px}
    #about1024 .box02 .sticky{width:250px;height:250px}
    #about1024 .box02 .sticky a{padding:5px 20px}
    #about1024 .box02 ul{width:70%}
    #about1024 .box02 ul li{width:calc(100% / 2 - 30px);height:400px !important}
    #about1024 .box02 ul li:nth-child(4), #about1024 .box02 ul li:nth-child(6){transform:translateY(0)}

}
@media(max-width:768px){
    #about1024 {padding:50px 0 0;font-size:14px}
    #about1024 .tit{text-align:center}
    #about1024 .tit h2{font-size:25px}
    #about1024 .box01 dd{font-size:14px}
    #about1024 .box01 .info{
        margin-top:20px;
        grid-template-columns: repeat(1,1fr);
    }
    #about1024 .box02 ul li p {
        font-size: 14px;
    }
    #about1024 .box02 .tit{margin-bottom:30px}
    #about1024 .box02 .review{display:block}
    #about1024 .box02 .sticky{position:relative;top:0;display:block;width:100%;height:auto;margin-bottom:20px;text-align:center}
    #about1024 .box02 .sticky div{margin-bottom:10px}
    #about1024 .box02 ul li{width:calc(100% / 2 - 15px);height:300px !important}
    #about1024 .box02 ul li:nth-child(n+4){display:none}
    #about1024 .box02 ul{width:100%;gap:15px}
    #about1024 .box03{padding:55px 0}
    #about1024 .box03 a{width:150px;padding:10px 0;font-size:15px}
}
@media(max-width:480px){
    #about1024 .tit h2{font-size:22px}
    #about1024 .box02{margin-top:40px;padding:40px 0}
    #about1024 .box02 ul li{width:100%}
    #about1024 .box02 ul li a{padding:30px}
    #about1024 .box02 .sticky{padding:25px}
}
@media(max-width:380px){
    #about1024 .tit h2{font-size:18px}
}