/* BASIC css start */
.move{position: fixed; right: 5%; top: 40%;z-index:25}
.move ul{}
.move ul li{margin: 15px 0;}
.move ul li a{display: block;  border-radius: 50%; width: 22px; height: 22px;position: relative;transition:all .4s; border:1px solid rgba(0,0,0,0)}
.move ul li a span{width: 10px; height: 10px; border-radius: 50%; background-color: #7d7d7d;text-indent: -9999px;  position: absolute; top: 50%;left: 50%; transform: translate(-50%,-50%);transition:all .4s}
.move ul li a.on{border: 1px solid #000; transition:all .4s}
.move ul li a.on span{background-color: #000;transition:all .4s}



/* 섹션공통 */
section{width: 100%; min-height: 100%; height:100%; }
section .sec_inner{width: 1350px; margin: 0 auto; height: 100%;}
section .shop_now{font-family: 'Lato' , sans-serif; font-size: 14px; color: #000;padding-bottom: 7px; border-bottom: 1px solid #000;font-weight: 600;letter-spacing: 1px; display: inline-block;}
section .shop_now span{display: inline-block;margin-left: 17px;}
section .shop_now span img{display:inline-block; margin-top:-3px}
section p.tit{font-family: 'Noto Sans KR', sans-serif;letter-spacing: -.2px;font-weight:500 }
.start{transition: all 2s; opacity: 0;}
.end{opacity: 1 !important;transition: all 2s;margin-top:-35px}



/* sec1 */
#sec1{width: 100%;padding-left:0;}
#sec1 .swiper{}
#sec1 .swiper ul{width: 100%;}
#sec1 .swiper ul li{width: 100%;}
#sec1 .swiper ul li a{display: block;width: 100%;}
#sec1 .swiper ul li a img{width: 100%;}
#sec1 .swiper-pagination{bottom: 60px; padding-left:208px}
#sec1 .swiper-pagination-bullet{width: 80px; height: 3px; border-radius: 0; background-color: #fff; opacity: 1; margin: 0;}
#sec1 .swiper-pagination-bullet-active{background-color: #000;}



/* sec2 */
#sec2{height:975px}
#sec2 .sec_inner{padding-top: 10%; position: relative;}
#sec2 .sec_inner .thumb{width: 675px;height: 650px;float: left;position: absolute;}
#sec2 .sec_inner .thumb img{width: 100%;}
#sec2 .sec_inner .txt_cont{width: 820px;height: 600px; background-color: #f5f5f5; float: right; margin-top: 130px; padding: 200px 20px 120px 240px;}
#sec2 .sec_inner .txt_cont h2{font-family: 'Playfair Display', serif; font-size: 48px; font-weight: 500;letter-spacing: 4px;}
#sec2 .sec_inner .txt_cont p.tit{color: #666; font-size: 15px;margin: 20px 0 70px;line-height:2.0; font-weight: 500;}
#sec2 .sec_inner .txt_cont .shop_now{}


/* sec3 */
#sec3{}
#sec3>div{width: 50%; float: left;height: 100%;}
#sec3 .sec3_left{background: url(//skin.makeshop.co.kr/skin/branded/PC_img/sec3.png) no-repeat center center; background-size: cover;position: relative;}
#sec3 .sec3_left .sec3L_cont{text-align: center; color: #fff; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%);}
#sec3 .sec3_left .sec3L_cont h2{font-family: 'Playfair Display SC', serif; color: #fff; font-size: 62px;font-weight:600} 
#sec3 .sec3_left .sec3L_cont p.tit{font-size: 18px; margin: 30px 0 30px; font-weight:400}
#sec3 .sec3_left .sec3L_cont .shop_now{color: #fff; border-color: #fff;}
#sec3 .sec3_right{background-color: #f5f5f5;position: relative;}
#sec3 .sec3_right .sec3R_cont{position: absolute; top: 50%;left: 50%;transform: translate(-50%,-50%);}
#sec3 .sec3_right .sec3R_cont h3{font-family: 'Playfair Display SC', serif; font-size: 26px; text-align: center; margin-bottom: 50px;font-weight:600; color:#000}
#sec3 .sec3_right .sec3R_cont .swiper{width: 670px;padding-bottom: 60px;}
#sec3 .sec3_right .sec3R_cont .swiper ul{}
#sec3 .sec3_right .sec3R_cont .swiper ul li{width: 325px; height: 461px;}
#sec3 .sec3_right .sec3R_cont .swiper ul li a{display:block; width:100%; height:100%}
#sec3 .sec3_right .sec3R_cont .swiper ul li a img{width:100%;object-fit:cover; height:100%}
#sec3 .swiper-pagination-bullet-active{width: 20px;border-radius: 10px;background-color: #222;}


/* sec4 기존 PC버전
#sec4{background: url(/design/murmure01/brandstory/news_bg.jpg) no-repeat center center; background-size: cover;}
#sec4 .sec_inner{display: flex; flex-direction: column; align-items: center; height: 100%; justify-content: center;}
#sec4 .sec_inner h2{margin-bottom: 60px; font-family: 'Playfair Display SC', serif; font-size: 48px; color: white; text-align: center; font-weight: 600;}
#sec4 .sec_inner ul{}
#sec4 .sec_inner ul li{display: inline-block; margin: 0 7px; width: 430px; height: 613px;}
#sec4 .sec_inner ul li>a{display: block;width: 100%;}
#sec4 .sec_inner ul li .thumb{width: 100%; height: 445px;}
#sec4 .sec_inner ul li .thumb img{width: 100%; height: 100%; object-fit: cover;}
#sec4 .sec_inner ul li .text_area{width: 100%; background-color: #fff; height: 168px; padding: 20px; position: relative;}
#sec4 .sec_inner ul li .text_area h3{padding-top: 4px; text-align: center;font-family: 'Lato' , sans-serif; color: #000; font-size: 22px; margin-bottom: 13px; font-weight: 500;}
#sec4 .sec_inner ul li .text_area p{float: left;font-family: 'Noto Sans KR', sans-serif; font-size: 16px; color: #7f7f7f; font-weight: 400;padding:0 16px}
#sec4 .sec_inner ul li .text_area .plus{float: right; position: absolute; bottom: 25px; right: 25px;}
#sec4 .sec_inner ul li .text_area .plus img{display: inline-block;}
*/






/* sec4 mo 가져온 버전*/
#sec4{
    background: url(/design/murmure01/brandstory/news_bg_1.jpg) no-repeat center center; 
    background-size: cover; 
    margin-bottom: 23%; 
    margin: 300px auto 0px; 
    width:50%;    
    transform: scale(0.8); /* 100% → 80% */
    transform-origin: top center; /* 위쪽 기준으로 축소 */
    }
    
#sec4 .sec_inner{display: flex; flex-direction: column; align-items: center; height: 100%; justify-content: center;width:100%;padding:13% 15%;}
#sec4 .sec_inner h2{margin-bottom: 35px; font-family: 'Playfair Display SC', serif; font-size: 31px; color: white; text-align: center; font-weight: 600;}
#sec4 .sec_inner .swiper{width:100%; padding-bottom:40px}
#sec4 .sec_inner ul{width:100%; }
#sec4 .sec_inner ul li{width:100%; height:100%}
#sec4 .sec_inner ul li>a{display: block;width: 100%;overflow:hidden; height:70%}
#sec4 .sec_inner ul li .thumb{width: 100%;height:100%}
#sec4 .sec_inner ul li .thumb img{width: 100%;height:100%; object-fit:cover}
#sec4 .sec_inner ul li .text_area{width: 100%; background-color: #fff;  padding:13px; position: relative;height:30%}
#sec4 .sec_inner ul li .text_area h3{padding-top: 2px; text-align: center;font-family: 'Playfair Display SC' , sans-serif; color: #000; font-size: 14px; margin-bottom: 10px; font-weight: 800;}
#sec4 .sec_inner ul li .text_area p{font-family: 'Noto Sans KR', sans-serif; font-size: 10.5px; color: #7f7f7f; font-weight: 500; width:95%; margin:0 auto;letter-spacing:-.5px}
#sec4 .sec_inner ul li .text_area .plus{position: absolute; bottom: 10px; right: 15px;}
#sec4 .sec_inner ul li .text_area .plus img{display: inline-block; transform:scale(.6)}
#sec4 .sec_inner .swiper .swiper_btn_prev{position:absolute; left:0; bottom:0; z-index:9}
#sec4 .sec_inner .swiper .swiper_btn_prev a{display:block}
#sec4 .sec_inner .swiper .swiper_btn_next{position:absolute; right:0; bottom:0; z-index:9}
#sec4 .sec_inner .swiper .swiper_btn_next a{display:block}
#sec4 .swiper-pagination-fraction{bottom:0 !important}
#sec4 .swiper-pagination{color:rgba(255,255,255,.7); z-index:6 !important}
#sec4 .swiper-pagination-current{color:#fff}













/* sec5 */
#sec5{background-color: #fff;}
#sec5 .sec_inner{display: flex; flex-direction: column; align-items: center; height: 100%; justify-content: center;}
#sec5 .sec_inner h2{margin-bottom: 60px; font-family: 'Playfair Display SC', serif; font-size: 48px; color: #000; text-align: center; font-weight: 600; }


/* 썸네일 3*2배열 */

/*.item-wrap1 {width:100%; display:grid; place-items:center; margin-top:1100px;}*/





/* 썸네일 1*4배열 */

.section-title {
font-size: 14pt;
font-weight: bold;
text-align: left;
padding-left: 5px;
width: 95%;
margin: 0 auto 20px auto;
}


.item-wrap1 {
  width: 100%;
  max-width: 1600px; /* 적절한 최대 너비 설정 */
  margin: 0 auto;
  
}

.item-cont {
  display: flex;
  flex-wrap: nowrap; /* 한 줄로만 배치 */
  justify-content: space-between;
  list-style: none;
  padding: 0;
  margin: 0;
}

.item-cont .item_list {
  width: 23%; /* 또는 정확히 25% - 여백 고려 */
  height:100%;
  box-sizing: border-box;
  margin-bottom: 0;
}


.item-wrap1 .item_list .tumb {
    max-width: 90%;
    margin: 0 auto; /* 가운데 정렬 */
}





.item-cont .tumb img {
  width: 90%;
  height: auto;
  display: block;
}


.item-wrap1 .item_list {
margin: 0 -50px -50px -50px; /* 여백 줄이기 */
padding: 0;
width: calc(25% - 10px); /* 4개씩, 간격 포함 */
box-sizing: border-box;
}

.item-wrap1 .item_list .prdname,.item-wrap1 .item_list .prdprice {max-width: 90%; margin: 2px auto 0 auto; }


.item-wrap1 .item-cont {
      display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: 10px; /* 썸네일 간 간격 */
}







/* 슬라이드 관련 */

.lookbook_slider_wrapper {
  max-width: 1440px;
  margin: 200px auto;
  padding: 0 20px;
  position: relative; /* 추가 */
  z-index: 1; /* 다른 요소와 겹치지 않게 설정 */
}

.lookbook_slider {
  width: 100%;
  overflow: hidden; /* 슬라이드 넘침 방지 */
}

.lookbook_slider .swiper-wrapper {
  display: flex; /* 슬라이드가 가로로 나열되게 설정 */
}

.lookbook_slider .swiper-slide {
  position: relative;
  overflow: hidden;
  flex-shrink: 0; /* 줄어들지 않도록 설정 */
}

.lookbook_slider .swiper-slide img {
  width: 100%;
  height: auto;
  display: block;
}
.swiper-pagination-progressbar {
  position: absolute;
  bottom: 0 !important;
  top: auto !important;
  left: 0;
  width: 100%;
  height: 2px;
  background: #e0e0e0;
  z-index: 10;
}

.swiper-pagination-progressbar-fill {
   background: #000 !important;
  height: 100%;
}
.swiper-slide {
  position: relative;
}

.slide_caption {
  position: absolute;
  bottom: 20px;
  left: 20px;
  color: #fff;
  text-align: left;
  /* 배경 제거 */
  background: none;
  padding: 0;
}

.slide_caption div {
  font-size: 18px;
  font-weight: bold;
  margin-bottom: 6px;
}

.slide_caption a {
  font-size: 14px;
  color: #fff;
  text-decoration: underline; /* 밑줄 효과 */
  padding: 0;
  background: none;
  border: none;
}
/* BASIC css end */