/* BASIC css start */
/* morenvy.com 220505 서정환 */
@charset "utf-8";


div#contentWrapper {max-width: 1920px; padding: 0; width: 100%; min-width: 1650px; margin:  0 auto;}

div#mfooter {margin-top: 0; border-top: 0;}
section {margin-bottom: 160px !important;}


/* 메인 : 스와이퍼 좌우버튼 */
div.swiper-button-prev,
div.swiper-button-next {top: 50%; margin: 0; width: auto; height: auto; transform: translateY(-50%);}
div.swiper-button-prev:after {font-size: 0; line-height: 1; content: url('/design/jewelrytop/0797drorganic/prev.svg');}
div.swiper-button-next:after {font-size: 0; line-height: 1; content: url('/design/jewelrytop/0797drorganic/next.svg');}


/* 메인 : 더보기 */
.more {position: relative; display: block; width: 160px; padding: 12px 0 12px 8px; box-sizing: border-box; font-size: 14px; line-height: 24px; letter-spacing: 0.04em; font-weight: 700; color: #1a1a1a; transition: color 0.5s; transition: padding-left 0.5s;}
.more span {position: relative; z-index: 2; display: flex; align-items: center; justify-content: space-between; background: url('/design/jewelrytop/0797drorganic/right.svg') no-repeat center right / 24px 24px; transition: 0.5s;}
.more:hover {color: #fff; padding-left:24px;}
.more:hover span {background: url('/design/jewelrytop/0797drorganic/right_on.svg') no-repeat center right 16px / 24px 24px;}
.more:after {content: ''; display: block; width: 100%; height: 2px; background-color: #1a1a1a; z-index: 1; position: absolute; bottom: 0; left: 0; transition: height 0.5s;}
.more:hover:after {height: 100%;}


/* 메인01 : 메인 비주얼 */
section.mm_sec01 {position: relative;}
section.mm_sec01 .swiper-slide .inner {position: absolute; top: 50%; left: 16.15%; transform: translateY(-50%);}
section.mm_sec01 .swiper-slide .inner .t01 {margin-bottom: 40px; display: inline-block; font-size: 14px; line-height: 24px; font-weight: 700; color: #ffffff; padding: 4px 16px; background-color: #1a1a1a; border-radius: 20px;}
section.mm_sec01 .swiper-slide .inner .t02 {margin-bottom: 24px; font-size: 56px; line-height: 72px; font-weight: 700; color: #1a1a1a;}
section.mm_sec01 .swiper-slide .inner .t03 {margin-bottom: 48px; font-size: 20px; line-height: 32px; font-weight: 400; color: #6a6a6a;}
section.mm_sec01 .swiper-slide .inner .more {}
section.mm_sec01 .swiper-button-next {right: 8%;}
section.mm_sec01 .swiper-button-prev {left: 8%;}
section.mm_sec01 .swiper-pagination {width: 100%; left: inherit; right: 0; bottom: 4%; display: flex; align-items: center; justify-content: center;}
section.mm_sec01 .swiper-pagination span.swiper-pagination-bullet {opacity: 1; background-color: #c8c8c8; width: 4px; height: 4px; border-radius: 50%; margin: 0 10px;}
section.mm_sec01 .swiper-pagination span.swiper-pagination-bullet-active {border: 3px solid #1a1a1a; background-color: transparent;}

section.mm_sec01 .swiper-button-prev {left:80px;}
section.mm_sec01 .swiper-button-next {right:80px;}
section.mm_sec01 .swiper-button-next {top: 50%; margin: 0; width: auto; height: auto; transform: translateY(-50%);}
section.mm_sec01 .swiper-button-prev:after {font-size: 0; line-height: 1; content: url('/design/jewelrytop/0797drorganic/prev_main.svg');}
section.mm_sec01 .swiper-button-next:after {font-size: 0; line-height: 1; content: url('/design/jewelrytop/0797drorganic/next_main.svg');}


/* 메인02 : 탭 상품 */
section.mm_sec02 .swiper02 {margin:0px auto; background-color:#ffffff; overflow: hidden;}
section.mm_sec02 .swiper02_text {display: flex; align-items: center; justify-content: center; margin-top: 48px;}
section.mm_sec02 .swiper02_text li {position: relative; display: inline-block; font-size: 22px; line-height: 40px; font-weight: 400; color: #777777; cursor: pointer; transition: color 0.3s; margin:0px 24px;}
section.mm_sec02 .swiper02_text li:after {content: ''; position: absolute; bottom: -2px; left: 50%; transform: translateX(-50%); display: block; width: 0; height: 2px; background-color: #1a1a1a; transition: width 0.3s;}
section.mm_sec02 .swiper02_text li.swiper_over {color:#1a1a1a;font-weight:700;}
section.mm_sec02 .swiper02_text li.swiper_over:after {width: 100%;}
section.mm_sec02 .swiper02_text li:before {content: ''; position:absolute; top:11px; left:-24px; display: flex; width: 1px; height: 18px; background-color: #e1e1e1;}
section.mm_sec02 .swiper02_text li:first-child:before {display:none;}

section.mm_sec02 .swiper02 .swiper-pagination2 {display:none;}
section.mm_sec02 .swiper02 .swiper-slide {display:block; background-color:#ffffff; box-sizing:border-box; height:auto !important;}
section.mm_sec02 .swiper02 .drag_bar02 {width:31.25%;margin:0 auto; display:none;}
section.mm_sec02 .swiper02 .swiper-scrollbar2 {left:0px !important; bottom:0px !important;height:4px !important;  background:#e8e8e8;border-radius:0px;}
section.mm_sec02 .swiper02 .swiper-scrollbar-drag {background-color:#1a1a1a; border-radius:0px; height:4px;}

section.mm_sec02 .more_btn {display: flex; align-items: center; justify-content: center;}
section.mm_sec02 .more_btn button.more {background: transparent; outline: none;}
section.mm_sec02 .more_btn button.more span {visibility: visible; background: url('/design/jewelrytop/0797drorganic/pro_more.svg') no-repeat center right / 24px 24px;}
section.mm_sec02 .more_btn:hover button.more span {background: url('/design/jewelrytop/0797drorganic/pro_more_on.svg') no-repeat center right 16px / 24px 24px;;}


/* 메인03 : 가로 배너 */
section.mm_sec03 {padding: 0 40px;}
section.mm_sec03 .m_titleArea .t01 {font-size:42px; line-height:56px;}
section.mm_sec03 .swiper-slide {font-size: 0;}
section.mm_sec03 .swiper-slide .m_titleArea {position: absolute; top: 50%; left: 15%; transform: translate(0%, -50%); width: 70%; text-align: left;}
section.mm_sec03 .swiper-button-prev {left: 5%;}
section.mm_sec03 .swiper-button-next {right: 5%;}
section.mm_sec03 .more {margin-top:48px;}


/* 메인04 : 키워드 */
section.mm_sec04 .keyword {display: flex; margin: 0 -20px; flex-wrap: wrap;}
section.mm_sec04 .keyword a {display: flex; align-items: center; justify-content: center; width: calc(20% - 40px); padding: 4% 0; margin: 0 20px; border: 1px solid #e5e5e5; box-sizing: border-box; border-radius: 16px; font-size: 20px; line-height: 32px; font-weight: 500; color: #1a1a1a; transition: 0.3s;}
section.mm_sec04 .keyword a:hover {border: 1px solid #1a1a1a; box-shadow: 0 8px 12px 0 rgb(0 0 0 / 10%);}
section.mm_sec04 .keyword a:nth-child(n+6) {margin-top: 40px;}


/* 메인05 : 타임세일 */
section.mm_sec05 {display: flex;}
section.mm_sec05 .m_titleArea {/*width: 24%; margin-right: 1%; */ width:416px; text-align: left;}
section.mm_sec05 .swiper_sec05 {flex: 1;}

section.mm_sec05 .item-cont li.item-list .prd-info > ul li.prd-price, 
section.mm_sec05 .item-cont li.item-list .prd-info > ul li.prd-subname,
section.mm_sec05 .item-cont li.item-list .prd-info > ul li.prd-ico,
section.mm_sec05 span.snap_review_count,
section.mm_sec05 .item-cont li.item-list .prd-info > ul li.prd-name a {text-align: center;}


/* 메인06 : 분할 배너 */
section.mm_sec06 {background-color: #f6f6f6; padding: 120px 0;}
section.mm_sec06 .w1600 {position: relative;}
section.mm_sec06 .inner {position: relative; width: 77.5%; margin: 0 auto; height: 0; padding: 18.75% 0;}
section.mm_sec06 .inner > div {position: absolute; width: 51.6%; height: 0; padding: 21% 0; display: flex; align-items: center; justify-content: center;}
section.mm_sec06 .inner .ban {z-index: 1; right: 0; top: 0;}
section.mm_sec06 .inner .text {z-index: 2; left: 0; bottom: 0; background-color: #fff;}
section.mm_sec06 .inner .text .m_titleArea {text-align: left; margin: 0; width: 100%; padding-left: 12.5%; box-sizing: border-box;}
section.mm_sec06 .inner .text .m_titleArea a.more {margin-top: 128px;}
section.mm_sec06 .swiper-button-prev {left: 4%;}
section.mm_sec06 .swiper-button-next {right: 4%;}


/* 메인07 : 탭 상품 */
section.mm_sec07 .sec07_tab {display: flex; align-items: center; justify-content: center; margin-top: 48px;}
section.mm_sec07 .sec07_tab li {position: relative; display: inline-block; font-size: 22px; line-height: 40px; font-weight: 400; color: #777777; cursor: pointer; transition: color 0.3s;}
section.mm_sec07 .sec07_tab li:after {content: ''; position: absolute; bottom: -2px; left: 50%; transform: translateX(-50%); display: block; width: 0; height: 2px; background-color: #1a1a1a; transition: width 0.3s;}
section.mm_sec07 .sec07_tab span {display: inline-block; width: 1px; height: 18px; background-color: #e1e1e1; margin: 0px 24px;}
section.mm_sec07 .sec07_tab li.on {color: #1a1a1a; font-weight: 700;}
section.mm_sec07 .sec07_tab li.on:after {width: 100%;}
section.mm_sec07 .sec07_prd > div {display: none;}
section.mm_sec07 .sec07_prd > div.tab_open {display: block;}
section.mm_sec07 .more_btn {display: flex; align-items: center; justify-content: center;}
section.mm_sec07 .more_btn button.more {background: transparent; outline: none;}
section.mm_sec07 .more_btn button.more span {visibility: visible; background: url('/design/jewelrytop/0797drorganic/pro_more.svg') no-repeat center right / 24px 24px;}
section.mm_sec07 .more_btn:hover button.more span {background: url('/design/jewelrytop/0797drorganic/pro_more_on.svg') no-repeat center right 16px / 24px 24px;;}


/* 메인08 : 키워드 */
section.mm_sec08 .m_titleArea {margin-bottom:48px;}
section.mm_sec08 ul {display: flex; margin: 0 120px; flex-wrap: wrap; gap:16px; align-items: center; justify-content: center;}
section.mm_sec08 ul li a {display: flex; color:#1a1a1a; font-size:18px; line-height:24px; padding:16px 20px; border:1px solid #dddddd; box-sizing:border-box;}
section.mm_sec08 ul li a:hover {border-color:#1a1a1a; background-color:#fafafa;}


/* 메인09 : 좌측 배너 */
section.mm_sec09 .m_titleArea .t01 {font-size:42px; line-height:56px;}
section.mm_sec09 .swiper_sec09 .swiper-slide {display: flex;}
section.mm_sec09 .swiper_sec09 .swiper-slide > div {flex:1; flex-basis: 50%;}
section.mm_sec09 .swiper_sec09 .ban {position: relative;}
section.mm_sec09 .swiper_sec09 .ban .button_area {z-index: 1; position: absolute; bottom: 0; right: 0; font-size: 0;}
section.mm_sec09 .swiper_sec09 .ban .button_area > div {position: static; display: inline-block; padding: 4px; background-color: #fff; transform: translateY(0);}

section.mm_sec09 .swiper_sec09 .box {display: flex; flex-direction: column; justify-content: center; padding-left: 7.5%; box-sizing: border-box;}
section.mm_sec09 .swiper_sec09 .box .min_title {margin-bottom: 16px; font-size: 24px; line-height: 1; font-weight: 700; color: #1a1a1a;}
section.mm_sec09 .swiper_sec09 .box .m_titleArea {text-align: left;}
section.mm_sec09 .swiper_sec09 .box .m_titleArea .t02 {margin-top: 48px;}
section.mm_sec09 .swiper_sec09 .box .tag {margin-top: 64px; font-size: 0; margin: 0 -8px;}
section.mm_sec09 .swiper_sec09 .box .tag li {position: relative; display: inline-block; margin: 0 8px 5px; font-size: 16px; line-height: 24px; letter-spacing: -0.02em; font-weight: 400; color: #777777;}
section.mm_sec09 .swiper_sec09 .box .tag li:before {content: ''; display: block; z-index: -1; position: absolute; bottom: 0; left: 0; width: 100%; height: 8px; background-color: #f3f3f3;}
section.mm_sec09 .swiper_sec09 .box a.more {margin-top: 115px;}


/* 메인10 : 선물하기 */
section.mm_sec10 .m_titleArea {margin-bottom:48px;}
section.mm_sec10 ul {display: flex; flex-wrap: wrap; gap:24px; align-items: center; justify-content: center;}
section.mm_sec10 ul li {text-align:center;}
section.mm_sec10 ul li .ban {}
section.mm_sec10 ul li .txt {margin-top:16px; color:#1a1a1a; font-size:16px; line-height:24px; letter-spacing:-0.020em;}


/* 메인11 : 리뷰 모 음 */
section.mm_sec11 {padding: 120px 0; background-color: #f6f6f6; margin-bottom: 0 !important;}
section.mm_sec11 .inner {display: flex;}
section.mm_sec11 .m_titleArea {/*width: 24%; margin-right: 1%; */ width:416px; text-align: left;}
section.mm_sec11 .swiper_sec11 {flex: 1; height: max-content;}
section.mm_sec11 .swiper_sec11 .swiper-slide {padding: 32px 32px 40px; box-sizing: border-box; background-color: #fff; border: 1px solid #ededed; height: auto;}
section.mm_sec11 .swiper_sec11 .swiper-slide .top {width: 100%; padding-bottom: 16px; border-bottom: 1px solid #ededed;}
section.mm_sec11 .swiper_sec11 .swiper-slide .top .thumb {position: relative; display: flex; align-items: center; justify-content: center; height: 0; padding: 50% 0; margin-bottom: 24px; overflow: hidden;}
section.mm_sec11 .swiper_sec11 .swiper-slide .top .thumb img {position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); width: 100%; min-height: 100%; object-fit: cover;}
section.mm_sec11 .swiper_sec11 .swiper-slide .top .t01 {font-size: 18px; line-height: 28px; letter-spacing: -0.02em; font-weight: 400; color: #1a1a1a; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
section.mm_sec11 .swiper_sec11 .swiper-slide .top .t02 {margin-top: 8px; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; white-space:normal; overflow:hidden; text-overflow:ellipsis; font-size: 14px; line-height: 20px; max-height: 40px; letter-spacing: -0.02em; font-weight: 400; color: #8a8a8a;}
section.mm_sec11 .swiper_sec11 .swiper-slide .top .t03 {display: flex; align-items: center; margin-top: 32px; font-size: 13px; line-height: 16px; font-weight: 400; color: #8a8a8a;}
section.mm_sec11 .swiper_sec11 .swiper-slide .top .t03 img {width: 16px; height: 16px; margin: 0 4px;}
section.mm_sec11 .swiper_sec11 .swiper-slide .bottom {padding-top: 16px;}
section.mm_sec11 .swiper_sec11 .swiper-slide .bottom a {display: flex; align-items: center;}
section.mm_sec11 .swiper_sec11 .swiper-slide .bottom .img {flex-shrink: 0; display: flex; align-items: center; justify-content: center; margin-right: 12px; width: 40px; height: 40px; border: 1px solid #ededed; border-radius: 50%; overflow: hidden;}
section.mm_sec11 .swiper_sec11 .swiper-slide .bototm .img img {width: 100%;}
section.mm_sec11 .swiper_sec11 .swiper-slide .bottom .prd_name {flex:1; display: flex; flex-wrap: wrap; align-items: center;}

section.mm_sec11 .swiper_sec11 .swiper-slide .bottom .prd_name .count {display: block; width: 100%;  height: 12px; font-size: 12px; color:#F27370; line-height: 1; margin-bottom: 4px;}
section.mm_sec11 .swiper_sec11 .swiper-slide .bottom .prd_name .count .MS_review_mark {height: 100%;}
section.mm_sec11 .swiper_sec11 .swiper-slide .bottom .prd_name .count .MS_review_mark_icon {font-size: 12px; line-height: 1;}

section.mm_sec11 .swiper_sec11 .swiper-slide .bottom .prd_name .name {width: 80%; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; font-size: 13px; line-height: 20px; font-weight: 400; color: #1a1a1a;}
section.mm_sec11 .swiper_sec11 .swiper-slide .bottom .prd_name > img {width: 20px; height: 20px; margin-left: auto;}
section.mm_sec11 .swiper_sec11 .swiper-scrollbar {position: static; margin-top: 80px;}


/* BASIC css end */