@charset "utf-8";

main .main-slide div .s1 { background: url(../img/sub3/1/image1.jpg) no-repeat center/cover; }
main .main-slide div .s2 { background: url(../img/sub3/1/image2.jpg) no-repeat center/cover; }
main .main-slide div .s3 { background: url(../img/sub3/1/image3.jpg) no-repeat center/cover; }
main .main-slide div .s4 { background: url(../img/sub3/1/image4.jpg) no-repeat center/cover; }

main .txtbox { font-size: 36px; line-height:normal; }
main .txtbox span { display: block; font-size: 16px; font-family: 'Interop'; margin-bottom: 10px; line-height:normal; }


.e-info { display: flex; flex-direction: column; justify-content: space-between; padding: 150px 40px 0;}
.e-info> div { display: flex; justify-content: space-between ;}
.e-info> div> :first-child { width: 47.572%; }
.e-info> div> :last-child { width: 50%; }
.e-info div .txtbox p { margin-bottom: 20px; }
.e-info div .txtbox h1 { font-family: "Eulyoo1945-SemiBold"; }
.e-info .topbox> :last-child p { margin-top: 60px; }
.e-info .topbox div p span { font-weight: 600; }
.e-info div .img1 { aspect-ratio: 784/423; background-image: url(../img/sub3/1/image1.jpg); }
.e-info div .img2 { aspect-ratio: 865/423; background-image: url(../img/sub3/1/image3.jpg); }


.e-detail { position: relative; padding: 150px 40px 150px 17.597%; width: 90%; margin-left: auto; display: block;}
.e-detail .rightp { position: absolute; right: 40px; top: 10px; }
.e-detail .topimgs { display: flex; justify-content: space-between; margin-bottom: 150px; }
.e-detail .imgbox { position: relative; }
.e-detail .topimgs .img1 { width: 31%; aspect-ratio: 1/1.618; background-image: url('../img/sub3/1/image2.jpg'); }
.e-detail .topimgs .img2 { width: 39.341%; aspect-ratio: 1/1; background-image: url('../img/sub3/1/image4.jpg'); margin-top: 350px; }
.e-detail .topimgs .img2::before { position: absolute; top: -100px; left: -23.636%; content: ""; width: 100%; height: 100%; background: #c9c3bb; z-index: -1; }
.e-detail .imgbox .txtbox { position: absolute; bottom: -10px; width: 100%; display: flex; justify-content: space-between; font-weight: normal; transform: translateY(100%); }
.e-detail .img3 { width: 100%; aspect-ratio: 1398/508; background-image: url('../img/sub3/1/image1.jpg'); }
.e-detail .deco-bg { position: absolute; top: 400px; left: 0; width: 29.224%; height: calc(100% - 400px); background: #f5efe7; opacity: .5; z-index: -1; }

footer .imgbox { background-image: url('../img/sub3/1/image2.jpg'); }

@media screen and (max-width: 1024px){ 
    .e-info { padding: 150px 4% 0;}
    .e-detail { width: 100%; padding: 150px 4%; }
    .e-detail .rightp { right: 4%; }
    .e-detail .topimgs .img1 { width: 36%; }
}

@media screen and (max-width: 840px){ 
    main { height: 45vh !important; }
    main .txtbox { font-size: 32px; }
    main .txtbox span { font-size: 12px; }

    .e-info { padding: 80px 4% 10px; }
    .e-info div .txtbox p { margin-bottom: 10px; }
    .e-info .topbox { margin-bottom: 40px; }

    .e-detail { padding: 80px 4%; }
    .e-detail .topimgs { margin-bottom: 100px; }
    .e-detail .topimgs .img1 { width: 38%; }
    .e-detail .deco-bg { top: 300px; width: 70%; height: calc(100% - 300px); z-index: -2; }
}

@media screen and (max-width: 600px){ 
    .e-info { padding: 80px 4%; }
    .e-info> div { display: block; }
    .e-info .topbox div { width: 100%; }
    .e-info .topbox> :last-child p { margin-top: 40px; }
    .e-info div .imgbox { width: 100%; aspect-ratio: 1.618/1; } 
    .e-info div .img1 { margin-bottom: 20px; }

    .e-detail .rightp { top: 40px; }
    .e-detail .topimgs { display: block; margin-bottom: 80px; }
    .e-detail .topimgs .img1 { width: 100%; aspect-ratio: 4/3; }
    .e-detail .topimgs .img2 { margin-top: 130px; width: 70%; margin-left: auto; }
    .e-detail .topimgs .img2::before { top: -60px; }
    .e-detail .img3 { aspect-ratio: 1.618/1; }
    .e-detail .deco-bg { top: 0; width: 100%; height: 100%; }
}