/* BASIC css start */
body{overflow:hidden;}
.top_banner{position:fixed; top:0; left:0; transition:top 0.3s; width:100%;}
#header{position:fixed; top:32px; left:0; transition:top 0.3s; z-index:9;}
.gnb{display:none;}


.about{height: 100vh; overflow-y: scroll; scroll-snap-type: y mandatory;}
.about .panel{scroll-snap-align: start; height: 100vh; position:relative; overflow:hidden; padding-top:52px;}

.about .panel.con0{height:auto;padding-top:84px}
.about .panel.con0 img{width:100%}

.about .panel.con1{height:100vh; width:100%;  background-image:url(http://justmysize.img15.kr/echo2025/echo_brand%20about/mo/bgimg_bk_mo.png); background-repeat:no-repeat; background-size:cover; background-position:center;}
.about .panel.con1 .video_box{position:absolute; top: 0; left: 0; width: 100%; height: 100%; /*z-index: -1;*/ overflow: hidden;}
.about .panel.con1 .video_box iframe{position: absolute; top: 50%; left: 50%; width: 56.25vh;  height: 100vh; aspect-ratio: 16 / 9; object-fit: cover; transform: translate(-50%, -50%); pointer-events: none;}
.about .panel.con1 .txt{position:absolute; top:calc(50% + 52px); left:50%; transform:translate(-50%, -50%); text-align:center; width:100%;}
.about .panel.con1 .txt img{filter: invert(95%) sepia(100%) saturate(0%) hue-rotate(86deg) brightness(104%) contrast(105%); width:155px;}
.about .panel.con1 .txt p{margin-top:33px; font-size:18px; font-weight:400; line-height:28px; color:#fff;}


.about .panel.con2{background-image:url(http://justmysize.img15.kr/echo2025/echo_brand%20about/mo/2_bg.jpg); background-repeat:no-repeat; background-position:center center; background-size:cover;}
.about .panel.con2 img:first-child{position:absolute; left:1rem; top:0; transform:translate(0px, -100%); width:70%}
.about .panel.con2 img:nth-child(2){position: absolute; right: 1rem; top: 40%; opacity:0; width:60%;}
.about .panel.con2 .txt{position:absolute; left:1rem; bottom:58px; opacity:0; color:#fff;}
.about .panel.con2 .txt p{font-size:16px; font-weight:400; line-height:24px; color:#fff;}

.about .panel.con3{padding-top:84px;}
.about .panel.con3 .swiper{max-height:calc(100vh - 430px);}
.about .panel.con3 .swiper .swiper-wrapper{max-height:calc(100vh - 430px);}
.about .panel.con3 .swiper .swiper-wrapper .swiper-slide{max-height:calc(100vh - 430px);}
.about .panel.con3 .swiper .swiper-wrapper .swiper-slide img{width:auto; max-height:calc(100vh - 430px);}
.about .panel.con3 .txt{position:absolute; left:1rem; bottom:58px;}
.about .panel.con3 .txt p:nth-child(1){font-size:16px; font-weight:600; line-height:26px; color:#000; opacity:0;}
.about .panel.con3 .txt p:nth-child(2){font-size:22px; font-weight:600; line-height:28px; color:#000; opacity:0; margin-top:4px;}
.about .panel.con3 .txt p:nth-child(3){font-size:16px; font-weight:400; line-height:24px; color:#333; opacity:0; margin-top:18px;}
.about .panel.con3 .txt ul{margin-top:28px; display:flex; opacity:0;}
.about .panel.con3 .txt ul li{font-size:10px; font-weight:700; line-height:14px; color:#000;}
.about .panel.con3 .txt ul li:not(:last-child){padding-right:52px; position:relative;}
.about .panel.con3 .txt ul li:not(:last-child)::after{content:''; display:block; position:absolute; width:20px; height:1px; background:#000; right:16px; top:50%; transform:translateY(-50%);}

.about .panel.con4{padding-bottom:58px; height:fit-content;}
.about .panel.con4 .video:first-child{height:500px; position:relative;}
.about .panel.con4 .video:first-child iframe{position: absolute; top: 50%; left: 50%;width:258.78%; height: 100%; aspect-ratio: 16 / 9; object-fit: cover; transform: translate(-50%, -50%); pointer-events: none;}
.about .panel.con4 .video .txt{position:absolute; top:50%; left:50%; transform:translate(-50%, -50%); width:100%; text-align:center;}
.about .panel.con4 .video .txt span{font-size:20px; font-weight:400; line-height:20px; color:#fff;}
.about .panel.con4 .video .txt p{font-size:26px; font-weight:600; line-height:28px; color:#fff; padding-top:10px;}
.about .panel.con4 > .txt{padding:36px 1rem;}
.about .panel.con4 > .txt p{font-size:16px; font-weight:400; line-height:24px; color:#333;}
.about .panel.con4 > .txt p:first-child{padding-bottom:12px;}
.about .panel.con4 .video:nth-child(3){padding: 177.78% 0 0 0; position: relative;}

.about .panel.con5{padding-bottom:58px; height:fit-content;}
.about .panel.con5 > div:first-child{height:500px; position:relative; background-image:url(http://justmysize.img15.kr/echo2025/echo_brand%20about/mo/5_bg%20photo.jpg); background-repeat:no-repeat; background-size:cover; background-position:center center;}
.about .panel.con5 > div:first-child .txt{position:absolute; top:50%; left:50%; width:100%; transform:translate(-50%, -50%); text-align:center;}
.about .panel.con5 > div:first-child .txt span{font-size:20px; font-weight:400; line-height:26px; color:#e0e0e0;}
.about .panel.con5 > div:first-child .txt p{padding-top:10px; font-size:26px; font-weight:600; line-height:34px; color:#fff;}
.about .panel.con5 > .txt{padding:36px 1rem 76px 1rem; }
.about .panel.con5 > .txt p{font-size:16px; font-weight:400; line-height:24px; color:#333;}
.about .panel.con5 > .txt p:last-child{margin-top:12px;}
.about .panel.con5 .swiper .swiper-slide p:first-child{font-size:22px; font-weight:600; line-height:28px; color:#000;}
.about .panel.con5 .swiper .swiper-slide p:nth-child(2){font-size:16px; font-weight:400; line-height:24px; color:#333; margin-top:12px; height:108px;}
.about .panel.con5 .swiper .swiper-slide img{width:100%;}


.about .panel.con6{background-image:url(http://justmysize.img15.kr/echo2025/echo_brand%20about/mo/6_%20bg%20photo_mo.jpg); background-position:center center; background-size:cover; background-repeat:no-repeat;}
.about .panel.con6 .txt{position:absolute; top:calc(50% + 52px); left:50%; transform:translate(-50%, -50%); width:100%; text-align:center;}
.about .panel.con6 .txt img{filter: invert(95%) sepia(100%) saturate(0%) hue-rotate(86deg) brightness(104%) contrast(105%); width:104px;}
.about .panel.con6 .txt p:nth-child(2){margin-top:56px; font-size:18px; font-weight:400; line-height:28px; color:#fff;}
.about .panel.con6 .txt p:nth-child(3){margin-top:12px; font-size:18px; font-weight:400; line-height:28px; color:#fff;}
.about .panel.con6 .txt p:nth-child(4){margin-top:56px; font-size:16px; font-weight:600; line-height:25px; color:#fff;}

.about .panel.footer{height:auto; padding-top:0;}
/* BASIC css end */