/* morenvy.com 240628 서정환 */
@charset "utf-8";
@import url("../goods/goods.css");
/* 메인에서 여백 삭제 */
#wrap #header_wrap {padding-top:0 !important}

/* 메인 : 공용 타이틀 */
.main_title {display: flex; align-items: center; justify-content: space-between; margin-bottom: 1.6rem; font-size: 1.4rem; line-height: 2.0rem; font-weight: 400; color: var(--black);}
.main_title a {font-size: 1.2rem; line-height: 1.6rem; padding-right:2rem; font-weight: 400; color: var(--black); background: url('../../img/mimg/btn_arrow_16b.svg') no-repeat right / auto;}

/* 메인 : 키비주얼 */
.m_sec01 {margin: 0 auto 4rem; padding-top: 9.4rem;}
.m_sec01 .main_visual {z-index:100;}
.m_sec01 .swiper-slide .bg {display: flex; align-items: center; justify-content: center;}
.m_sec01 .swiper-slide .bg  {width: 100%; height:80vh;}
.m_sec01 .swiper-slide .text {position:absolute; top:50%; left:50%; transform:translate(-50%, -50%); text-align:center; width: 100%;}
.m_sec01 .swiper-slide .text img {padding:0 4.8rem; max-height:5.6rem;}
.m_sec01 .swiper-slide .text .t01 {margin-top: 0rem; font-size: 1.6rem; font-weight: 700; line-height: 2.4rem; color: var(--white); letter-spacing: 0.6rem; }
.m_sec01 .swiper-slide .text .t02 {margin-top: 1.2rem; font-size: 1.4rem; font-weight: 400; line-height: 2.0rem; color: var(--white);}
.m_sec01 .swiper-slide .text .t03 {margin-top: 2.4rem; font-size: 1.2rem; font-weight: 400; line-height: 1.6rem; color: var(--white); padding-right:2rem; background: url('../../img/mimg/btn_arrow_16.svg') no-repeat right / auto; display:inline-block;}
.m_sec01 .swiper-button-prev {left:1.6rem;}
.m_sec01 .swiper-button-next {right:1.6rem;}

/* 메인 : 키워드 */
.m_sec02 {padding: 0rem 0rem 0rem 1.6rem; margin: 0 auto 8rem;}
.m_sec02 .m_keyword {display: flex; align-items: center; justify-content: space-between; margin-bottom:0.8rem;}
.m_sec02 .m_keyword ul { display: flex; gap: 0 0.6rem;overflow:auto;overflow-y:hidden;}
.m_sec02 .m_keyword ul::-webkit-scrollbar {display:none;}
.m_sec02 .m_keyword ul li  { border: 1px solid var(--gray_line); padding: 0.6rem 2.4rem 0.6rem 0.6rem; border-radius:50rem; }
.m_sec02 .m_keyword ul li:last-child {margin-right:1.6rem;}
.m_sec02 .m_keyword ul li a { width: max-content; display: flex; gap: 0 0.8rem;}
.m_sec02 .m_keyword ul li .img {font-size:0;}
.m_sec02 .m_keyword ul li .text {font-size:1.2rem; line-height:1.6rem; color: var(--black); display: flex; gap: 0 0.6rem; align-items: center;}
.m_sec02 .m_keyword ul li .text span {color: var(--gray_01);}
.m_sec02 .m_keyword ul li img {border-radius:50rem; height:4.0rem;font-size:0;}

/* 메인 : 탭 상품 */
.m_sec03 {padding: 0 1.6rem; margin: 0 auto 6.4rem;}
.m_sec03 .tab_area {display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid var(--gray_line);margin-bottom:2.4rem;}
.m_sec03 .tab_area ul {display: flex; gap: 0 1.6rem; overflow-y: hidden;}
.m_sec03 .tab_area ul li {font-size: 1.4rem; line-height: 3.2rem; padding-bottom: 0.6rem; font-weight: 400; color: var(--gray_02); transition: 0.3s;  border-bottom: 2px solid var(--white); white-space: nowrap;}
.m_sec03 .tab_area ul li a {color: var(--gray_02);}
.m_sec03 .tab_area ul li.on {color: var(--black); font-weight: 400; border-bottom: 2px solid var(--black);}
.m_sec03 .tab_area ul li.on a {color: var(--black);}
.m_sec03 .prd_area .goods_tab_box {display:none;}
.m_sec03 .prd_area .goods_tab_box.on {display:block;}
.m_sec03 .button_area .swiper-button-prev,
.m_sec03 .button_area .swiper-button-next {position:static;color: var(--black);}
.m_sec03 .button_area .swiper-button-prev {margin-right: 0.8rem;}
.m_sec03 .button_area .swiper-button-prev::before  {content:"<"; padding-right:0.6rem;}
.m_sec03 .button_area span.line {background-color: var(--gray_02); width: 0.1rem; height: 1rem; display:inline-block; margin-left: 0.8rem; position:relative; top:0.1rem; opacity: 0.6;}
.m_sec03 .button_area .swiper-button-next::after {content:">"; padding-left: 0.6rem;}
.m_sec03 .button_area .disabled {z-index: 0; color: var(--gray_02);}

/* 메인 : 브랜드 컬렉션 */
.m_sec04 {padding: 0 1.6rem; margin: 0 auto 4.8rem;}
.m_sec04 .brand_banner {margin-bottom:4.8rem;}
.m_sec04 .brand_banner .img {font-size:0;}
.m_sec04 .brand_banner .img img {width:100%;}
.m_sec04 .ban_area {position:relative;}
.m_sec04 .ban_area a .text { position: absolute; top: 1.6rem; left: 1.6rem; text-align: left;}
.m_sec04 .ban_area a .text .t01 {font-size: 1.4rem; line-height: 2.0rem; font-weight: 400; color: var(--white);}
.m_sec04 .ban_area a .text .t02 {font-size: 1.3rem; line-height: 1.8rem; font-weight: 700; color: var(--white); padding-top: 0.4rem;}

/* 메인 : 랭킹상단배너 공통 */
.m_sec05 {padding: 0 1.6rem; margin-bottom: 6.4rem;}
.m_sec05 .ranktop .img {aspect-ratio: 1 / 1;}
.m_sec05 .ranktop .img img {width:100%; height: 100%; object-fit: cover;}
.m_sec05 a .text { position: absolute; top: 1.6rem; left: 1.6rem; text-align: left;}
.m_sec05 a .text .t01 {font-size: 1.4rem; line-height: 2rem; font-weight: 700; color: var(--white);}
.m_sec05 a .text .t02 {font-size: 1.3rem; line-height: 1.8rem; font-weight: 400; color: var(--white); padding-top: 0.4rem;}

/* 메인 : 랭킹 01 */
.m_sec06_1 {padding:0; margin-bottom: 6.4rem;}
.m_sec06_1 .main_title {margin:0 1.6rem;padding-bottom:1.2rem; border-bottom:1px solid var(--black);}
.m_sec06_1 .prd_area {width: 100%; padding: 0 0rem; box-sizing: border-box; overflow:visible;}
.m_sec06_1 .prd_area .num {min-width: 4rem; font-size: 1.4rem; line-height: 1; font-weight: 600; color: var(--gray_02);text-align:center;}
.m_sec06_1 .prd_area .num.rank {color: var(--black);}
.m_sec06_1 .rank_prd {padding:0 1.6rem;}

/* 메인 : 랭킹 02 */
.m_sec06_2 {padding:0; margin-bottom: 6.4rem;}
.m_sec06_2 .main_title {margin:0 1.6rem;padding-bottom:1.2rem; border-bottom:1px solid var(--black);}
.m_sec06_2 .prd_area {width: 100%; padding: 0 0rem; box-sizing: border-box; overflow:visible;}
.m_sec06_2 .prd_area .num {min-width: 4rem; font-size: 1.4rem; line-height: 1; font-weight: 600; color: var(--gray_02);text-align:center;}
.m_sec06_2 .prd_area .num.rank {color: var(--black);}
.m_sec06_2 .rank_prd {padding:0 1.6rem;}


/* 메인 : 브랜드 프로모션 */
.m_sec07 {padding: 0 1.6rem; margin: 0 auto 4.8rem;}
.m_sec07 .main_promo .img img {width:100%;}
.m_sec07 a .text { position: absolute; top: 1.6rem; left: 1.6rem; text-align: left;}
.m_sec07 a .text .t01 {font-size: 1.4rem; line-height: 2rem; font-weight: 700; color: var(--white);}
.m_sec07 a .text .t02 {font-size: 1.3rem; line-height: 1.8rem; font-weight: 400; color: var(--white); padding-top: 0.4rem;}

/* 메인 : 오피스 컬렉티브 */
.m_sec08 {padding: 0 1.6rem; margin: 0 auto 4.8rem;}
.m_sec08 .main_prd_list {margin:0 -0.4rem !important;}

/* 메인 : 매거진 */
.m_sec09 {padding: 0 1.6rem; margin-bottom: 4.8rem;}
.m_sec09 .main_title {border-bottom:1px solid var(--black); padding-bottom: 1.2rem;}
.m_sec09 .thumb_area {font-size:0;}
.m_sec09 .imgLink img {width:100%;}
.m_sec09 ul {margin: 0 auto;}
.m_sec09 ul li {border-bottom:1px solid var(--gray_line);padding:2.4rem 0;}
.m_sec09 ul li:first-child {padding-top:0;}
.m_sec09 .content_area {padding-top:1.6rem;}
.m_sec09 .content_area .subject {font-size:1.6rem; line-height:2.4rem; font-weight: 700; color:var(--black);}
.m_sec09 .content_area .contents {display:block; font-size: 1.3rem; line-height:1.4; font-weight: 400; color: #999999; margin-top:0.8rem;max-height:7.2rem; overflow:hidden; }
.m_sec09 .content_area .contents img {display:none;}
.m_sec09 .content_area a.board_more {display:inline-block; margin-top:2.4rem; font-size: 1.2rem; line-height:1; padding-right:2rem; font-weight: 400; color: var(--black); background: url('../../img/mimg/btn_arrow_16b.svg') no-repeat right / auto;}

/* 메인 : 스타일쇼핑 */
.m_sec10 {padding: 0 1.6rem; margin-bottom: 4.8rem;}
.m_sec10 .style_banner {margin-bottom:4.8rem;}
.m_sec10 .style_banner .img {font-size:0;}
.m_sec10 .style_banner .img img {width:100%;}
.m_sec10 .ban_area {position:relative;}
.m_sec10 .ban_area a .text { position: absolute; top: 1.6rem; left: 1.6rem; text-align: left;}
.m_sec10 .ban_area a .text .t01 {font-size: 1.4rem; line-height: 2.0rem; font-weight: 400; color: var(--white);}
.m_sec10 .ban_area a .text .t02 {font-size: 1.3rem; line-height: 1.8rem; font-weight: 700; color: var(--white); padding-top: 0.4rem;}
.m_sec10 .inner .ban_area a .t03 {position: absolute; bottom:1.6rem; right:1.6rem; text-align: left;font-size: 1.2rem; font-weight: 400; line-height: 2.2rem; color: var(--white); padding-right:2rem; background: url('../../img/mimg/btn_arrow_16.svg') no-repeat right / auto; display:inline-block;}
.m_sec10 .prd_area {margin-top:0.8rem;}
.m_sec10 .main_prd_list {display: flex; gap:0.8rem; align-items: center;}