
.s_visual{position: relative; max-width: 1920px; margin: 0 auto; overflow: hidden;}
.s_visual .bar{
	position: absolute;
	width: 15px; height: 335px;
}
.s_visual .bar.n1{left: 0; top: 0;}
.s_visual .bar.n2{right: 0; bottom: 0;}

.s_visual .bar div{background-color: #000; width: 100%; height: 100%;}
.s_visual .bar.n1 div{transform-origin: center top;}
.s_visual .bar.n2 div{transform-origin: center bottom;}

@media screen and (max-width: 1680px) {
    .s_visual .bar {width: 10px;height: 30%;}
}
@media screen and (max-width: 1024px) {
    .s_visual .bar {display: none;}
}

.s_visual .flxBx{
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    height: 100vh;
}

.s_visual .flxBx .left{width: 50%;max-width: 960px;height: 100%;flex-shrink: 0;}

.s_visual .flxBx .left .wrap{
    max-width: 800px;
    margin-left: auto;
    /* border: 1px solid #000; */
    padding-top: 80px;
    padding-bottom: 40px;
    box-sizing: border-box;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}
.s_visual .flxBx .left .top{
	font-size: 13px; letter-spacing: -0.04em; line-height: calc(16/13); font-weight: 300;
    /* border: 1px solid #000; */
    margin-left: auto;
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
}
.s_visual .flxBx .left .top > div{
    /* border: 1px solid #000; */
    overflow: hidden;
    width: 100%;
    max-width: 200px;
}
.s_visual .flxBx .left .top > div > p{color: #000;text-align: left;white-space: nowrap;}
.s_visual .flxBx .left .top > div > span{
    font-size: 40px;
    font-family: "articulat-cf";
    font-weight: 600;
    color: #000;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    margin-top: calc(18/40*1em);
    /* border: 1px solid #000; */
    text-align: left;
    opacity: 0;
}
.s_visual .flxBx .left .txtBx{}
.s_visual .flxBx .left .txtBx .txt{}
.s_visual .flxBx .left .txtBx .txt > div{overflow: hidden;}
.s_visual .flxBx .left .txtBx .txt h2{
    font-size: 110px;
    line-height: calc(110/110);
    font-weight: 500;
    letter-spacing: -0.04em;
    font-family: "articulat-cf";
    opacity: 0;

}
.s_visual .flxBx .left .txtBx .txt p{
    font-size: 17px;
    line-height: calc(22/17);
    font-weight: 400;
    letter-spacing: -0.04em;
    font-family: "articulat-cf";
    color: rgba(0, 0, 0, 0.8);
    margin-top: calc(40/17*1em);
    opacity: 0;
}

.s_visual .flxBx .left .txtBx .more{
    font-size: 17px;
    line-height: calc(22/17);
    font-weight: 400;
    letter-spacing: -0.02em;
    font-family: "articulat-cf";
    text-align: center;
    color: #fff;
    background-color: #000;
    padding: calc(14/17*1em) calc(24/17*1em);
    border-radius: 4px;
    margin-top: calc(90/17*1em);
    transition: background-color 0.3s ease;
    opacity: 0;
}

.s_visual .flxBx .left .txtBx .more:hover{background-color: var(--blue);}





.s_visual .flxBx .right{width: 100%;height: 100%;max-width: 960px;}

.s_visual .flxBx .right .imgBx{
    position: relative;
    width: 100%;height: 100%;
    overflow: hidden;
}
.s_visual .flxBx .right .imgBx::before{
    content: '';display: block;
    padding-bottom: calc(980/960*100%);
}
.s_visual .flxBx .right .imgBx img{
    position: absolute;
    top: 0; left: 0;
    width: 100%; height: 100%;
    object-fit: cover;
    transform: scale(1.2);
}

@media screen and (max-width: 1680px) {
    .s_visual .flxBx .left .top > div > span{font-size: clamp(36px, 36/1440*100vw, 40px);}
    .s_visual .flxBx .left .txtBx .txt h2{font-size: clamp(100px, 100/1440*100vw, 110px);}
}
@media screen and (max-width: 1440px) {
    .s_visual .flxBx .left .top > div > span{font-size: clamp(32px, 32/1280*100vw, 36px);}
    .s_visual .flxBx .left .txtBx .txt h2{font-size: clamp(90px, 90/1280*100vw, 100px);}
}
@media screen and (max-width: 1280px) {
    .s_visual .flxBx .left .top > div > span{font-size: clamp(28px, 28/1024*100vw, 32px);}
    .s_visual .flxBx .left .txtBx .txt h2{font-size: clamp(80px, 80/1024*100vw, 90px);}
}
@media screen and (max-width: 1024px) {
    .s_visual .flxBx{height: auto;flex-direction: column;align-items: center;}
    .s_visual .flxBx .left{width: 100%;}
    .s_visual .flxBx .left .wrap{max-width: unset;}
    .s_visual .flxBx .right{width: 100%;max-width: unset;}

    .s_visual .flxBx .left .top > div > span{font-size: clamp(24px, 24/820*100vw, 28px);}
    .s_visual .flxBx .left .txtBx .txt h2{font-size: clamp(70px, 70/820*100vw, 80px);}

}
@media screen and (max-width: 820px) {
    .s_visual .flxBx .left .top > div > span {font-size: clamp(22px, 22/500*100vw, 24px);}
    .s_visual .flxBx .left .txtBx .txt h2{font-size: clamp(60px, 60/500*100vw, 70px);margin-top: calc(30/70*1em);}
    .s_visual .flxBx .left .txtBx .txt p, .s_visual .flxBx .left .txtBx .more{font-size: clamp(15px, 15/500*100vw, 17px);}
}
@media screen and (max-width: 500px) {
    .s_visual .flxBx .left .top > div > span{font-size: clamp(20px, 20/360*100vw, 22px);}
    .s_visual .flxBx .left .txtBx .txt h2{font-size: clamp(50px, 50/360*100vw, 60px);}
    .s_visual .flxBx .left .txtBx .txt p br{display: none;}
}
@media screen and (max-width: 360px) {
    .s_visual .flxBx .left .txtBx .txt h2{font-size: clamp(40px, 40/280*100vw, 50px);}
}



.s_video{
    position: relative; max-width: 1920px; margin: 0 auto; overflow: hidden;
    /* height: 100vh; */
    padding-top: 120px;
    padding-bottom: 200px;
    box-sizing: border-box;
    background: #fff;
}
.s_video .wrap{
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 10px;
}
.s_video .wrap .txtBx{
    display: flex;
    flex-direction: column;
    gap: 10px;
}
.s_video .wrap .txtBx > div{
    display: flex;
    align-items: center;
    justify-content: flex-end;
    overflow: hidden;
}
.s_video .wrap .txtBx p{
    font-size: 25px;
    font-family: "articulat-cf";
    font-weight: 400;
    letter-spacing: -0.02em;
    color: #000;
}
.s_video .wrap .txtBx i{
    font-size: 24px;
    display: inline-block;
    animation: scrollHint 1.5s ease-in-out infinite;
}

@keyframes scrollHint{
    0%, 100%{transform: translateY(0);}
    50%{transform: translateY(4px);}
}

.s_video .videoBx{
    position: relative;
    width: 100%;margin-top: 20px;
    padding: 8px;box-sizing: border-box;
    border: 1px solid #000;
}
.s_video .videoBx::before{
    content: '';display: block;
    padding-bottom: calc(800/1420*100%);
}
.s_video .videoBx iframe{
    position: absolute;
    top: 0; left: 0;
    width: 100%; height: 100%;
    object-fit: cover;
    padding: 8px;
    box-sizing: border-box;
}

@media screen and (max-width: 1680px) {
    .s_video .wrap .txtBx p{font-size: clamp(23px, 23/1440*100vw, 25px);}
}
@media screen and (max-width: 1440px) {
    .s_video .wrap .txtBx p{font-size: clamp(21px, 21/1280*100vw, 23px);}
    .s_video .wrap .txtBx i{font-size: clamp(22px, 22/1280*100vw, 24px);}
}
@media screen and (max-width: 1280px) {}
@media screen and (max-width: 1024px) {
    .s_video{padding: 80px 0;}
    .s_video .wrap .txtBx p{font-size: clamp(18px, 18/820*100vw, 21px);}
    .s_video .wrap .txtBx i{font-size: clamp(20px, 20/820*100vw, 22px);}
}
@media screen and (max-width: 820px) {
    .s_video{padding-bottom: 80px;}
    .s_video .wrap .txtBx p{font-size: clamp(16px, 16/500*100vw, 18px);}
    .s_video .wrap .txtBx i{font-size: clamp(18px, 18/500*100vw, 20px);}
}
@media screen and (max-width: 500px) {}
@media screen and (max-width: 360px) {
    .s_video .wrap .txtBx p{font-size: clamp(14px, 14/360*100vw, 16px);}
    .s_video .wrap .txtBx i{font-size: clamp(16px, 16/360*100vw, 18px);}
}



.s_what{
    position: relative; margin: 0 auto; overflow: hidden;
    /* height: 100vh; */
    padding-bottom: 200px;
    box-sizing: border-box;
    background: #fff;
}
.s_what .wrap{
    display: flex;
    flex-direction: column;
    /* align-items: flex-end; */
    gap: 10px;
    position: absolute;
    left: 50%; transform: translateX(-50%);
}
.s_what .wrap .txtBx{}
.s_what .txtBx > div{
    overflow: hidden;
}
.s_what .txtBx p{
    font-size: 20px;
    font-family: "articulat-cf";
    font-weight: 500;
    letter-spacing: -0.02em;
    color: #555555;
    font-style: italic;
}
/* .s_what .stairs{border: 1px solid #000;} */
.s_what .stairs > div{
    overflow: hidden;
}
.s_what .stairs p{
    font-size: 80px;
    font-family: "articulat-cf";
    font-weight: 500;
    letter-spacing: -0.02em;
    color: #000;
    line-height: calc(118/80);
}
.s_what .stairs > div:nth-child(1) p{ padding-left: 0; }
.s_what .stairs > div:nth-child(2) p{padding-left: 8%;}
.s_what .stairs > div:nth-child(3) p{padding-left: 18%;}
.s_what .stairs > div:nth-child(4) p{padding-left: 28%;}
.s_what .imgBx{max-width: 1600px; margin: 0 auto;width: 95%;}
.s_what .imgBx .img_inn{
    width: 100%;
    display: flex;justify-content: space-between;align-items: flex-start;
    position: relative;
    top: 3.4vw;
}
.s_what .imgBx .img{
    max-width: 408px;
    width: 100%;
    position: relative;
}
.s_what .imgBx .img::before{
    content: '';
    display: block;
    padding-bottom: calc(790/408*100%);
}
.s_what .imgBx .img img{
    position: absolute;
    top: 0; left: 0;
    width: 100%; height: 100%;
    object-fit: cover;
}
.s_what .imgBx .img:nth-child(1){ margin-top: 34vw;}
.s_what .imgBx .img:nth-child(2){ margin-top: 17vw;}
.s_what .imgBx .img:nth-child(3){ margin-top: 0;}

.s_what .txt{
    /* max-width: 1440px; */
    width: 100%;
    text-align: right;
    margin: 0 auto;
    font-size: 17px;
    font-family: 'GmarketSans';
    line-height: calc(30/17);
    font-weight: 300;
    position: relative;
    top: -2.8vw;
}

.s_what .txt > div{overflow: hidden;}

.s_what .txt span{display: inline-block;text-align: left; }


@media screen and (max-width: 1680px) {
    .s_what .stairs p{font-size: clamp(65px, 65/1440*100vw, 80px);}
}
@media screen and (max-width: 1440px) {
    .s_what .stairs p{font-size: clamp(60px, 60/1280*100vw, 65px);}
    .s_what .imgBx .img{max-width: clamp(390px, 390/1280*100vw, 408px);}
}
@media screen and (max-width: 1280px) {
    .s_what .stairs p{font-size: clamp(55px, 55/1024*100vw, 60px);}
    .s_what .imgBx .img{max-width: clamp(300px, 300/1024*100vw, 390px);}
}
@media screen and (max-width: 1024px) {
    .s_what{padding-bottom: 120px;}
    .s_what .stairs p{font-size: clamp(55px, 55/1024*100vw, 60px);}
    .s_what .txtBx p{font-size: clamp(18px, 18/820*100vw, 20px);}
    .s_what .imgBx .img{max-width: clamp(250px, 250/820*100vw, 300px);}
    .s_what .txt{font-size: clamp(15px, 15/820*100vw, 17px);}
}
@media screen and (max-width: 820px) {
    .s_what{padding-bottom: 80px;}
    .s_what .stairs p{width: 90%;font-size: clamp(40px, 40/500*100vw, 55px);}
    .s_what .wrap{position: unset;transform: unset;}
    .s_what .imgBx{margin-top: 40px;}
    .s_what .imgBx .img_inn{flex-direction: column;top: unset;gap: 60px;}
    .s_what .imgBx .img{max-width: unset;width: 95%;margin: 0 auto;}
    .s_what .imgBx .img:nth-child(1){ margin-top: 0;}
    .s_what .imgBx .img:nth-child(2){ margin-top: 0;}
    .s_what .imgBx .img:nth-child(3){ margin-top: 0;}
    .s_what .txt{top: unset;margin-top: 40px;width: 90%;}
}
@media screen and (max-width: 500px) {
    .s_what .txtBx p{font-size: clamp(16px, 16/360*100vw, 18px);}
    .s_what .stairs p{font-size: clamp(36px, 36/360*100vw, 40px);}
    .s_what .txt{font-size: 14px;}
    .s_what .txt br{display: none;}
}
@media screen and (max-width: 360px) {
    .s_what .stairs p{font-size: clamp(32px, 32/280*100vw, 36px);}
}


.s_video2 {
    position: relative; margin: 0 auto;
    overflow: hidden;box-sizing: border-box;
    background-color: #000;
}
.s_video2 .videoBx{position: relative;width: 100%;}
.s_video2 .videoBx::before{
    content: '';display: block;
    padding-bottom: calc(800/1420*100%);
}
.s_video2 .videoBx iframe{
    position: absolute;
    top: 0; left: 0;
    width: 100%; height: 100%;
    object-fit: cover;
}

.s_design{
    padding: 200px 0;box-sizing: border-box;background: #fff;
}
.s_design .row{
    display: flex;
    justify-content: space-between;
    margin-bottom: 60px;
}
.s_design .row.n3{margin-bottom: 0;}
.s_design .row.n3{
    justify-content: flex-end;
}
.s_design .row .txtBx{
    font-size: 20px;
    font-family: "articulat-cf";
    font-weight: 500;
    letter-spacing: -0.02em;
    color: #555555;
    /* font-style: italic; */
}

@media screen and (max-width: 1680px) {}
@media screen and (max-width: 1440px) {
    .s_design .row{flex-direction: column;gap: 40px;}
    .s_design .row img{width: 100%;}
}
@media screen and (max-width: 1280px) {}
@media screen and (max-width: 1024px) {
    .s_design{padding: 120px 0;}
    .s_design .row .txtBx{font-size: clamp(18px, 18/820*100vw, 20px);}
}
@media screen and (max-width: 820px) {
    .s_design{padding: 80px 0;}
    .s_design .row{margin-bottom: 30px;}
}
@media screen and (max-width: 500px) {
    .s_design .row .txtBx{font-size: clamp(16px, 16/360*100vw, 18px);}
}
@media screen and (max-width: 360px) {}

.s_thumb{
    position: relative; margin: 0 auto; overflow: hidden;
    height: 100vh;
    background-image: url('/asset/img/sub/portfolio/cmes/cmes_bg.jpg');
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    display: flex;
    align-items: center;
    justify-content: center;
}
._dalmore .s_thumb{background-image: url('/asset/img/sub/portfolio/dalmore/dalmore_bg.jpg');}
._sleep .s_thumb{background-image: url('/asset/img/sub/portfolio/sleepnomore/sleep_bg.jpg');}
._inmode .s_thumb{background-image: url('/asset/img/sub/portfolio/inmode/inmode_bg.jpg');}

.s_thumb .wrap{}

.s_thumb .wrap .imgBx{
    width: 100%;
    display: flex;
    gap: 40px;
    align-items: center;
}
.s_thumb .wrap .imgBx .row{
    width: calc((100% - (40px * 2)) / 3);
    position: relative;
}
.s_thumb .wrap .imgBx .row::before{
    content: '';
    display: block;
    padding-bottom: calc(700/560*100%);
}
.s_thumb .wrap .imgBx .row img{
    position: absolute;
    top: 0; left: 0;
    width: 100%; height: 100%;
    object-fit: cover;
}


@media screen and (max-width: 1680px) {
    /* .s_thumb .wrap .imgBx .row{max-width: clamp(420px, 420/1440*100vw, 560px);} */
}
@media screen and (max-width: 1440px) {}
@media screen and (max-width: 1280px) {}
@media screen and (max-width: 1024px) {
    .s_thumb{height: 90vh;}
}
@media screen and (max-width: 820px) {
    .s_thumb {height: auto;padding: 140px 0px;}
    .s_thumb .wrap .imgBx{flex-direction: column;}
    .s_thumb .wrap .imgBx .row{width: 100%;max-width: 400px;}
}
@media screen and (max-width: 500px) {}
@media screen and (max-width: 360px) {}



.s_mockup{
    position: relative;
    max-width: 1920px;
    margin: 0 auto;
    padding: 200px 0;
    overflow: hidden;
    background: #fff;
    --mockup-w: 304px;
}

.s_mockup .swiperBx{
    width: 100%;
    position: relative;
}

.s_mockup .swiperBx .swiper{
    width: 100%;
    /* clip-path: inset(0 calc(50% - var(--mockup-w) / 2) 0 0 round 25px); */
    clip-path: inset(0 calc(50% - var(--mockup-w) / 2) 0 -100px round 25px);

    background: #fff;
}

.s_mockup .swiperBx .swiper-wrapper{
    align-items: center;
}

.s_mockup .swiperBx .swiper-slide{
    width: calc(var(--mockup-w) - 14px);
}

.s_mockup .swiperBx .swiper-slide .img{
    position: relative;
    width: 100%;
    padding-bottom: calc(613/294*100%);
    overflow: hidden;
    border-radius: 25px;
}

.s_mockup .swiperBx .swiper-slide .img img{
    position: absolute;
    top: 0; left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.s_mockup .mockupImg{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: var(--mockup-w);
    z-index: 2;
    pointer-events: none;
}

.s_mockup .mockupImg::before{
    content: '';
    display: block;
    padding-bottom: calc(613/304*100%);
}

.s_mockup .mockupImg img{
    position: absolute;
    top: 0; left: 0;
    width: 100%; height: 100%;
    object-fit: contain;
}

.marquee{
	white-space: nowrap; display: flex; align-items: center; justify-content: flex-start;
	transform: translateY(-8%);
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 100%;
    z-index: 0;
    pointer-events: none;
}
.marquee .txt{
	padding: 0 0.2em; box-sizing: border-box;
    font-size: 250px;
    color: rgba(0, 0, 0, 0.07);
    font-family: "articulat-cf";
    font-weight: 600;
    letter-spacing: -0.02em;

}
.marquee .txt{
	animation: marquee forwards infinite 14s linear;
}
.marquee._mob {display: none;}
.s_mockup .wrap{
    padding-top: 200px;
}
.s_mockup .txtBx {
    max-width: 720px;
    width: 100%;
    margin-left: auto;
}
.s_mockup .txtBx .row{
    display: flex;
    padding: 25px 0;
    box-sizing: border-box;
    border-bottom: 1px solid #dddddd;
    width: 100%;
}
.s_mockup .txtBx .row em{
    font-size: 20px;
    color: rgba(0, 0, 0, 0.5);
    font-family: "articulat-cf";
    letter-spacing: -0.02em;
    font-weight: 500;
    min-width: 50px;
}
.s_mockup .txtBx .row .flxBx{
    display: flex;
    justify-content: space-between;
    width: 100%;
}
.s_mockup .txtBx .row .flxBx .tit{
    font-size: 20px;
    color: #000;
    font-family: "articulat-cf";
    letter-spacing: -0.02em;
    font-weight: 500;
}
.s_mockup .txtBx .row .flxBx ul{
    font-size: 17px;
    color: #000;
    font-family: "GmarketSans";
    letter-spacing: -0.025em;
    font-weight: 400;
    line-height: calc(22/17);
    display: flex;gap: 10px;
    flex-direction: column;
    max-width: 304px;width: 100%;
}
.s_mockup .txtBx .row .flxBx ul li{
    display: flex;gap: 10px;
}
.s_mockup .txtBx .row .flxBx ul li small{}


@media screen and (max-width: 1680px) {
    .s_mockup .marquee .txt{font-size: clamp(220px, 220/1440*100vw, 250px);}
}
@media screen and (max-width: 1440px) {
    .s_mockup{
        --mockup-w: clamp(280px, 280/1280*100vw, 304px);
    }
    .s_mockup .marquee .txt{font-size: clamp(200px, 200/1280*100vw, 220px);}
}
@media screen and (max-width: 1280px) {
    .s_mockup{
        --mockup-w: clamp(240px, 240/1024*100vw, 280px);
    }
    .s_mockup .wrap{padding-top: 120px;}
    .s_mockup .marquee .txt{font-size: clamp(180px, 180/1024*100vw, 200px);}
}
@media screen and (max-width: 1024px) {
    .s_mockup{
        --mockup-w: clamp(200px, 200/820*100vw, 240px);
        padding: 120px 0;
    }
    .s_mockup .swiperBx .swiper-slide{width: calc(var(--mockup-w) - 5px);}
    .s_mockup .wrap{padding-top: 80px;}
    .s_mockup .marquee .txt{font-size: clamp(140px, 140/820*100vw, 180px);}

    .s_mockup .txtBx .row .flxBx .tit, .s_mockup .txtBx .row em{font-size: clamp(18px, 18/820*100vw, 20px);}
    .s_mockup .txtBx .row .flxBx ul{font-size: 16px;}
}
@media screen and (max-width: 820px) {
    .s_mockup{
        --mockup-w: clamp(180px, 180/500*100vw, 200px);
        padding: 80px 0;
    }
    /* .s_mockup .marquee {bottom: -43%;top: unset;} */
    .s_mockup .marquee .txt{font-size: clamp(80px, 80/500*100vw, 140px);}
    .s_mockup .marquee{display: none;position: unset;transform: unset;}
    .s_mockup .marquee._mob {display: flex;margin-top: clamp(40px, 40/500*100vw, 60px);}


    .s_mockup .txtBx .row .flxBx .tit, .s_mockup .txtBx .row em{font-size: clamp(16px, 16/500*100vw, 18px);}
    .s_mockup .txtBx .row .flxBx ul {
        font-size: clamp(14px, 14/500*100vw, 16px);
        max-width: clamp(220px, 220/500*100vw, 280px);
    }
    ._sleep .s_mockup .txtBx .row .flxBx ul{
        max-width: clamp(240px, 240/500*100vw, 304px);
    }
}
@media screen and (max-width: 500px) {
    .s_mockup .txtBx .row .flxBx ul{
        max-width: unset !important;
    }
    .s_mockup .marquee .txt{font-size: clamp(60px, 60/360*100vw, 80px);}

    .s_mockup .txtBx .row, .s_mockup .txtBx .row .flxBx{
        flex-direction: column;
        gap: 12px;
        max-width: unset;
    }
}
@media screen and (max-width: 360px) {
    .s_mockup .marquee .txt{font-size: clamp(50px, 50/280*100vw, 60px);}

}


.s_color{
    position: relative; margin: 0 auto; overflow: hidden;
    padding-bottom: 200px;
    box-sizing: border-box;
    background: #fff;
}
.s_color .colorBx{
    display: flex;
    gap: 40px;
}
.s_color .colorBx .color{
    border: 1px solid #000;
    max-width: 560px;width: 100%;
    padding: 10px;box-sizing: border-box;
}

.s_color .colorBx .color .inn{
    position: relative;width: 100%;
}
.s_color .colorBx .color .inn::before{
    content: '';
    display: block;
    padding-bottom: calc(480/540*100%);
}
.s_color .colorBx .color .inn .txt{
    position: absolute;
    top: 50%; left: 50%;
    transform: translate(-50%, -50%);
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}
.s_color .colorBx .color .inn .txt h3{
    font-size: 70px;
    color: #fff;
    font-family: "articulat-cf";
    letter-spacing: -0.02em;
    font-weight: 600;
}
.s_color .colorBx .color .inn .txt p{
    font-size: 20px;
    color: rgba(255, 255, 255, 0.5);
    font-family: "articulat-cf";
    letter-spacing: -0.02em;
    font-weight: 400;
    position: absolute;
    bottom: 30px;
}
.s_color .colorBx .color .inn.n1{background-color: #3b0694;}
.s_color .colorBx .color .inn.n2{background-color: #009fe3;}
.s_color .colorBx .color .inn.n3{background-color: #000000;}

._dalmore .s_color .colorBx .color .inn.n1{background-color: #c63527;}
._dalmore .s_color .colorBx .color .inn.n2{background-color: #000000;}
._dalmore .s_color .colorBx .color .inn.n3{background-color: #000000;}

._sleep .s_color .colorBx .color .inn.n1{background-color: #f6ad3c;}
._sleep .s_color .colorBx .color .inn.n2{background-color: #000000;}
._sleep .s_color .colorBx .color .inn.n3{background-color: #000000;}

._inmode .s_color .colorBx .color .inn.n1{background-color: #59b7b3;}
._inmode .s_color .colorBx .color .inn.n2{background-color: #000000;}
._inmode .s_color .colorBx .color .inn.n3{background-color: #000000;}


@media screen and (max-width: 1680px) {
    .s_color .colorBx .color .inn .txt h3{font-size: clamp(60px, 60/1440*100vw, 70px);}
}
@media screen and (max-width: 1440px) {
    .s_color .colorBx .color .inn .txt h3{font-size: clamp(50px, 50/1280*100vw, 60px);}
    .s_color .colorBx .color .inn .txt p{font-size: clamp(18px, 18/1280*100vw, 20px);}
}
@media screen and (max-width: 1280px) {
    .s_color .colorBx {gap: 25px;}
    .s_color .colorBx .color .inn .txt h3{font-size: clamp(40px, 40/1024*100vw, 50px);}
    .s_color .colorBx .color .inn .txt p{font-size: clamp(16px, 16/1024*100vw, 18px);}

}
@media screen and (max-width: 1024px) {
    .s_color{padding-bottom: 120px;}
    .s_color .colorBx{gap: 12px;}
    .s_color .colorBx .color .inn .txt h3{font-size: clamp(30px, 30/820*100vw, 40px);}
}
@media screen and (max-width: 820px) {
    .s_color{padding-bottom: 80px;}
    .s_color .colorBx{flex-direction: column;gap: 40px;}
    .s_color .colorBx .color{max-width: unset;}
}
@media screen and (max-width: 500px) {}
@media screen and (max-width: 360px) {
    .s_color .colorBx .color .inn .txt h3{font-size: clamp(24px, 24/280*100vw, 30px);}
    .s_color .colorBx .color .inn .txt p{font-size: clamp(14px, 14/280*100vw, 16px);}
}


.s_more{
    position: relative; margin: 0 auto; overflow: hidden;
    padding-bottom: 100px;
    box-sizing: border-box;
    background: #fff;
    margin-top: 1px;
}
.s_more .flxBx{
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
}
.s_more .flxBx .left{}
/* .s_more .flxBx .left > div{overflow: hidden;} */
.s_more .flxBx .left h3{
    font-size: 130px;
    font-family: "articulat-cf";
    font-weight: 600;
    letter-spacing: -0.02em;
    color: #000;
    line-height: calc(130/140);

}
.s_more .flxBx .left p{
    font-size: 18px;
    color: #555555;
    font-family: "articulat-cf";
    letter-spacing: -0.02em;
    font-weight: 500;
    line-height: calc(28/18);
    margin-top: calc(50/18*1em);
}
.s_more .flxBx .left p em{
    font-weight: 600;
    color: #000;
}

.s_more .flxBx .right{max-width: 420px;width: 100%;}
.s_more .flxBx .right > div{overflow: hidden;}
.s_more .flxBx .right p{
    font-size: 16px;
    color: #555555;
    font-family: "articulat-cf";
    letter-spacing: -0.02em;
    font-weight: 300;
    line-height: calc(20/16);
}
.s_more .flxBx .right .linkBx{position: relative;width: 100%;margin-top: 20px;}
.s_more .flxBx .right .linkBx::before{
    content: '';
    display: block;
    padding-bottom: calc(215/420*100%);
}
.s_more .flxBx .right .linkBx a{
	display: block;
    position: absolute;
    top: 0; left: 0;
    width: 100%; height: 100%;
    object-fit: cover;
    background-color: #000;
}
.s_more .flxBx .right .linkBx a img{
	position: absolute; left: 0; top: 0; width: 100%; height: 100%;
	object-fit: cover;
}

@media screen and (max-width: 1680px) {
    .s_more .flxBx .left h3{font-size: clamp(100px, 100/1440*100vw, 130px);}
}
@media screen and (max-width: 1440px) {
    .s_more .flxBx .left h3{font-size: clamp(85px, 85/1280*100vw, 100px);}
    .s_more .flxBx .left p{font-size: clamp(16px, 16/1280*100vw, 18px);}
}
@media screen and (max-width: 1280px) {
    .s_more .flxBx .left h3{font-size: clamp(70px, 70/1024*100vw, 85px);}
}
@media screen and (max-width: 1024px) {
    .s_more .flxBx .left h3{font-size: clamp(60px, 60/820*100vw, 70px);}
    .s_more .flxBx .right{max-width: clamp(320px, 320/820*100vw, 420px);}
}
@media screen and (max-width: 820px) {
    .s_more .flxBx{flex-direction: column;align-items: flex-start;gap: 40px;}
}
@media screen and (max-width: 500px) {
    .s_more .flxBx .left h3{font-size: clamp(40px, 40/360*100vw, 60px);}
}
@media screen and (max-width: 360px) {
    .s_more .flxBx .left p, .s_more .flxBx .right p{font-size: clamp(14px, 14/280*100vw, 16px);}
}



/* _ver2 공통 */
._ver2 .s_visual .flxBx .left{
    width: 100%;
    max-width: unset;
}
._ver2 .s_visual .flxBx .left .wrap{
    max-width: unset;
    height: 100vh;
}
._ver2 .s_visual .flxBx .left .bg{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
._inmode .s_visual .flxBx .left .bg img{
    object-position: 80% center; /* 좌→우 이동, 얼굴 보이게 */
}
._ver2 .s_visual .flxBx .left .bg img{
    width: 100%;height: 100%;object-fit: cover;
    scale: 1.2;
}
._ver2 .s_visual .flxBx .left .top{
    align-items: flex-start;
}
._ver2 .s_visual .flxBx .left .top > div > p{color: #fff;z-index: 123123;
    position: relative;}
._ver2 .s_visual .flxBx .left .top > div > span{color: #fff;}
._ver2 .s_visual .flxBx .left .txtBx .txt h2{color: #fff;line-height: 1.3;}
._ver2 .s_visual .flxBx .left .txtBx .txt p{color: #fff;}
._ver2 .s_visual .flxBx .left .txtBx .more{background-color: #fff;color: #000;}
._ver2 .s_visual .flxBx .left .txtBx .more:hover{background-color: #000;color: #fff;}

._ver2 .s_visual .flxBx .left .txtBx{text-align: center;}
._ver2 .s_visual .flxBx .left .txtBx .txt{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 95%;
}
._ver2 .s_visual .flxBx .left .txtBx .more{max-width: 330px;margin: 0 auto;}

@media screen and (max-width: 820px) {
    ._ver2 .s_visual .flxBx .left .wrap{height: 80vh;}
    ._ver2 .s_visual .flxBx .left .txtBx .txt p br{display: none;}
}

