/* BASIC css start */
.section{}
.section .sec_inner{padding:0 5%; margin:0 auto}
.section h2{font-family: 'Pretendard', sans-serif;font-size:23px; color:#121212; font-weight:600;margin-bottom:30px }
.more{display:flex; align-items:center; justify-content:center;}
.more a{color: #5d5d5d;font-family: 'Pretendard', sans-serif;border:1px solid #d8d8d8; font-size:13px; border-radius:20px ;padding:10px 37px; display:inline-block; font-weight:500;}

#container{padding-top:0 !important}
/* sec1 모바일용 */
#sec1 { position: relative; width: 100%; overflow: hidden; }
#sec1 .swiper { position: relative; width: 100%; }
#sec1 .swiper>ul { list-style: none; padding: 0; margin: 0; }
#sec1 .swiper>ul>li { position: relative; width: 100%; }
#sec1 .swiper>ul>li>a { display: block; width: 100%; overflow: hidden; }
#sec1 .swiper>ul>li>a>img { width: 100%; height: auto; display: block; object-fit: cover; }

/* 텍스트 하단 중앙 */
#sec1 .swiper>ul>li>.txt {
    position: absolute;
    bottom: 9%;            /* 화면 하단에서 위 */
    left: 50%;             /* 가로 중앙 */
    transform: translateX(-50%);
    text-align: center;     
    width: 90%;            /* 모바일 폭에 맞춰 */
    max-width: 500px;      /* 너무 넓어지지 않도록 */
    z-index: 10;
}

/* 등장 애니메이션 */
#sec1 .swiper>ul>li>.txt>* {
    position: relative;
    opacity: 0;
    top: 15px;             /* 아래에서 올라오는 느낌 */
    transition: top .5s ease, opacity .8s ease;
}
#sec1 .swiper>ul>li>.txt.act>* {
    top: 0;
    opacity: 1;
}

/* 글자 크기 조정 */
#sec1 .swiper>ul>li>.txt p.sub {
    font-family: 'Pretendard', sans-serif;
    font-size: 15px;       /* 모바일에 맞게 조금 줄임 */
    font-weight: bold;
    color: #7D4D2B;        
    margin-bottom: 18px;
}
#sec1 .swiper>ul>li>.txt h2 {
    font-family: 'Pretendard', sans-serif;
    font-size: 28px;       /* 모바일에 맞춰 조정 */
    color: #323232;
    line-height: 1.2;
    margin-top: 2px;
    margin-bottom: 22px;
}
#sec1 .swiper>ul>li>.txt a {
    display: inline-block;
    font-family: 'Pretendard', sans-serif;
    font-size: 13px;
    color: #323232;
    margin-bottom: 15px;    
}

/* 페이지네이션 */
#sec1 .swiper-pagination {
    position: absolute;
    left: 50%;
    bottom: 3%;
    transform: translateX(-50%);
    z-index: 20;
}
#sec1 .swiper-pagination-bullet { opacity: 1; background-color: #fff; }
#sec1 .swiper-pagination-bullet-active { background-color: #53341f; }

.sec1_bar {
    width: 100%;
    background-color: #f5e6dc; 
    border-bottom: 1px solid #eee;
}

.sec1_bar .swiper {
    margin: 0 auto;
    height: 50px; /* 세로 높이 약간 증가 */
}

.sec1_bar .swiper ul {
    width: 100%;
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
}

.sec1_bar .swiper ul li.swiper-slide p {
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: 'Pretendard', sans-serif;
    font-size: 15px; 
    font-weight: 500;
    color: #502c1d; !important; 
    padding: 10px 0;
    margin: 0;
}

.sec1_bar .swiper ul li.swiper-slide p a {
    color: #502c1d; !important; 
    text-decoration: none;
}

.sec1_bar p span {
    display: flex;
    margin-right: 10px;
}

.sec1_bar p span img {
    transform: scale(.66);
    transform-origin: center center;
}

#sec2 { margin-top: 50px; }

#sec2 .sec2_top { 
    display: flex; 
    justify-content: center; /* 가운데 정렬 */
    align-items: center; 
    margin-bottom: 30px;  
}

/* Swiper 컨테이너 */
#sec2 .swiper { width: 100%; }
#sec2 .swiper .swiper-wrapper { display: flex; flex-wrap: wrap; gap: 4%; }

/* 개별 슬라이드 - 한 줄 2개 */
#sec2 .swiper li.swiper-slide { width: 48%; margin-bottom: 10px; position: relative; }

/* 이미지 영역 */
#sec2 .swiper li .thumb a { display: block; width: 100%; }
#sec2 .swiper li .thumb a img { width: 100%; height: auto; object-fit: cover; }

/* 제품 정보 */
#sec2 .swiper li .info { padding: 8px 0; text-align: center; font-family: 'Pretendard', sans-serif; }
#sec2 .swiper li .info .prdname { font-size: 12px; color: #333; margin-bottom: 5px; }
#sec2 .swiper li .info .prdprice {
    font-size: 11px;
    color: #5d5d5d;
    display: block;      /* 전체를 블록으로 만들어 줄바꿈 */
    margin-top: 2px;     /* 기존가와의 간격 조정 */
}

#sec2 .swiper li .info .prdprice strike {
    color: #999;
    display: block;      /* 기존가를 따로 줄바꿈 */
    margin-bottom: 2px;  /* 아래 간격 */
}

.prdprice .discount {
    color: #502c1d;      /* 브라운 */
    font-weight: bold;
    font-size: 13px;
    margin-left: 2px;    /* 판매가와 간격 */
    display: inline-block; /* 판매가 옆에 붙이되, 전체는 줄바꿈 */
}

/* 썸네일 위 스티커 숨김 */
#sec2 .swiper li .thumb span.sticker { display: none; }

/* 제품 설명 숨김 */
#sec2 .swiper li .info .prdetc { display: none; }

/* 페이지네이션 숨김 */
#sec2 .swiper-pagination,
#sec2 .swiper-pagination-bullet,
#sec2 .swiper-pagination-bullet-active { display: none; }


/* =========================
   SEC3 모바일 전용
========================= */
#sec3 {
    width: 100%;
    position: relative;
    margin-top: 80px; /* 모바일 간격 */
}

/* 배경 */
#sec3 .bg {
    width: 100%;
}
#sec3 .bg img {
    width: 100%;
}

/* 텍스트 컨텐츠 */
#sec3 .txt_cont {}
#sec3 .txt_cont .txt_inner {
    padding: 20px 5% 30px;
    text-align: center; /* 가운데 정렬 */
}
#sec3 .txt_cont .txt_inner > * {
    font-family: 'Pretendard', sans-serif;
}
#sec3 .txt_cont .txt_inner p.tit {
    color: #323232;
    font-size: 15px;
    font-weight: 500;
    margin-bottom: 8px;
}
#sec3 .txt_cont .txt_inner h3 {
    color: #53341f;   /* 브라운 */
    font-size: 27px;
    font-weight: 700;
    margin-bottom: 15px;
}
#sec3 .txt_cont .txt_inner p.cont {
    color: #575757;
    font-size: 12px;
    line-height: 1.4;
    font-weight: 300;
    margin-bottom: 20px;
}
#sec3 .txt_cont .txt_inner > a {
    color: #575757;   /* 브라운 */
    font-size: 13px;
    display: block;
    font-weight: 300;
}

/* Swiper 컨테이너 */
#sec3 .swiper {
    padding-top: 20px;
    padding-left: 15px;
    padding-bottom: 15px; /* progressbar 공간 확보 */
    position: relative;
}

/* Swiper wrapper */
#sec3 .swiper ul.swiper-wrapper {
    display: flex;
    align-items: stretch;
}

/* 슬라이드 카드 */
#sec3 .swiper ul.swiper-wrapper li.swiper-slide {
    width: 90%;
    margin-right: 10px;
    border-radius: 10px;
    overflow: hidden;
    background-color: #fff;
    box-shadow: 0 0 15px rgba(0, 0, 0, 0.1);
    display: flex;
    flex-direction: column;
    text-align: center; /* 카드 전체 텍스트 중앙 */
}

/* 이미지 */
#sec3 .swiper ul.swiper-wrapper li.swiper-slide .thumb {
    width: 100%;
    padding-bottom: 100%; /* 정방형 */
    position: relative;
}
#sec3 .swiper ul.swiper-wrapper li.swiper-slide .thumb a {
    display: block;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
}
#sec3 .swiper ul.swiper-wrapper li.swiper-slide .thumb a img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* 카드 텍스트 */
#sec3 .swiper ul.swiper-wrapper li.swiper-slide .info {
    width: 100%;
    padding: 8px 0 12px;
    flex-shrink: 0;
}
#sec3 .swiper ul.swiper-wrapper li.swiper-slide .info p {
    font-size: 12px;
}

/* view product */
#sec3 .swiper-slide a.view_product {
    display: flex;
    justify-content: center;
    align-items: center; /* 수직 가운데 정렬 */
    width: 100px;  /* 도형 너비 */
    height: 36px;  /* 도형 높이 */
    margin: 40px auto 0; /* 위로 올림 */
    background-color: transparent;
    border: 1px solid #8B4513; /* 브라운 테두리 */
    border-radius: 20px; /* 도형 느낌 */
    font-family: 'Noto Sans KR', sans-serif;
    font-size: 11px;
    font-weight: 400;
    color: #8B4513; /* 브라운 글자색 */
    text-decoration: none;
    line-height: 1; /* 글자가 아래에 딱 붙는 현상 방지 */
    padding-top: 5px; /* 글자 위로 올리기 */
    box-sizing: border-box;
}

/* 페이지네이션 progressbar */
#sec3 .swiper-pagination {
    position: relative;
    bottom: auto;
    margin-top: 10px;
}
#sec3 .swiper-pagination-progressbar {
    background-color: rgba(0, 0, 0, 0.09); /* 그레이 */
    height: 4px !important;
}
#sec3 .swiper-pagination-progressbar .swiper-pagination-progressbar-fill {
    background-color: #53341f; /* 브라운 */
}


#sec4{margin-top:150px}
#sec4 .sec_inner{}
#sec4 .sec_inner h2{}
#sec4 .sec_inner h2 a.more{}
#sec4 .sec_inner .sec4_cont{}
#sec4 .sec_inner .sec4_cont ul{}
#sec4 .sec_inner .sec4_cont ul li{width:70%;  }
#sec4 .sec_inner .sec4_cont ul li a{display: block; width: 100%;}
#sec4 .sec_inner .sec4_cont ul li a img{width:100%}
#sec4 .sec_inner .sec4_cont ul li a .info{position: absolute;width: 100%; bottom: 0px; left: 0;padding:15px 12px;}
#sec4 .sec_inner .sec4_cont ul li a .info .inner{background-color: rgba(255,255,255,.7);transition: background-color .5s; padding: 25px 0 20px;}
#sec4 .sec_inner .sec4_cont ul li a .info .inner p{text-align: center;}
#sec4 .sec_inner .sec4_cont ul li a .info .inner p.brandname{font-family: 'Pretendard', sans-serif; font-size: 20px; color: #000; font-weight: 700; margin-bottom: 15px;}
#sec4 .sec_inner .sec4_cont ul li a .info .inner p.txt{ font-family: 'Pretendard', sans-serif; font-size: 12px; color: #575757; font-weight: 500;}

#sec5{width: 100%;margin-top:120px}

#sec6{margin-top:120px}

#sec7{width: 100%;margin-top:120px}
#sec7 a{display: block;width: 100%;}
#sec7 a img{width: 100%;}

#sec8 {
    width: 100%;
    margin: 90px 0 0;
}

#sec8 .sec_inner {
    max-width: 850px;       /* PC 기준 최대폭 */
    width: 100%;
    padding: 0 0%;           /* 좌우 5% 패딩 sec7~1과 동일 */
    margin: 0 auto;
    box-sizing: border-box;
}

#sec8 h2 {
    font-size: 20px;
    font-weight: 600;
    text-align: center;
    margin-bottom: 20px;
}

#sec8 .sec8_review > .review {
    display: flex;
    flex-wrap: wrap;                 /* 모바일 한 줄 2개용 */
    justify-content: space-between;  /* 좌우 균등 정렬 */
    padding: 0;
    margin: 0;
    list-style: none;
    box-sizing: border-box;
}

#sec8 .sec8_review > .review > li {
    width: 48%;                /* 두 개 균등 폭, gap 고려 */
    margin-bottom: 10px;       /* 세로 간격 */
    box-sizing: border-box;
    text-align: center;
}

#sec8 .sec8_review li img {
    width: 100%;
    height: auto;
    object-fit: cover;
    display: block;
    border-radius: 0;
}

#sec8 .sec8_review .more {
    margin: 10px 0 40px;
    text-align: center;
}

.instagram_widget {
    width: 100%;
    padding: 0 0%;       
    box-sizing: border-box;
    margin: 0 auto;
}

.instagram_widget iframe {
    width: 100%;         /* 부모 컨테이너 폭에 맞춤 */
    height: 300px;       /* 원하시는 높이로 조정 */
    border: none;
    overflow: hidden;
    display: block;
}
/* BASIC css end */