/* morenvy.com 240617 서정환 */
@charset "utf-8";

/* 메인 여백 */
#container {padding:0 !important}

/* 메인 : 공용 타이틀 */
.main_title {display: flex; align-items: center; justify-content: space-between; font-size: 1.6rem; line-height: 2.4rem; font-weight: 400; color: var(--black); margin-bottom: 2.4rem;}
.main_title a {font-size: 1.4rem; line-height: 2.4rem; padding-right:2rem; font-weight: 400; color: var(--black); background: url('../../img/mimg/btn_arrow_16b.svg') no-repeat right / auto;}
.button_area {position: relative; display: flex; align-items: center; height: 2.4rem;}
.button_area div {position: static; height: 100%;}
.button_area .swiper-button-prev {margin-right: -1px;}
.button_area .swiper-button-disabled {z-index: 0; opacity: 1;}
.button_area div svg {width: auto; height: 100%;}
.button_area div svg path,
.button_area div svg rect {transition: 0.3s;}
.button_area .swiper-button-disabled svg path {fill: var(--gray_03);}
.button_area .swiper-button-disabled svg rect {stroke: var(--gray_05);}

.swiper-pagination-fraction {display: inline-flex; justify-content: center; align-items: center; width:auto; position: absolute; left:50%; transform: translate(-50%, 0%);bottom:7.2rem !important;}
.swiper-pagination-fraction span {display: inline-flex; justify-content: center; align-items: center; font-size:1.4rem; font-weight: 400; line-height:2rem; color: var(--white); min-width:20px;}
.swiper-pagination-custom {bottom:0px;}
.swiper-button-next,
.swiper-button-prev { top:auto !important; transform: translateY(0%); font-size:1.4rem; line-height:2.0rem; color: var(--white) !important;width:auto !important;}
.swiper-button-prev {left: auto; left:3.2rem;}
.swiper-button-prev::before {content:"<"; padding-right:0.6rem;}
.swiper-button-next {right: auto; right:3.2rem;}
.swiper-button-next::after {content:">" !important; font-size:1.4rem !important; padding-left:0.6rem; font-family:'SUIT',sans-serif !important;display:inline-block !important;}

/* 메인 : 키비주얼 */
.m_sec01 {padding:0; margin: 0 auto; background-color: var(--black); margin-top: 12rem;}
.m_sec01 .swiper-slide {width:100%; height:100vh;}
.m_sec01 .swiper-slide .bg {width:100%; height:100%; display: flex;}
.m_sec01 .swiper-slide .bg img {width: 100%; object-fit: cover;}
.m_sec01 .swiper-slide .text {position:absolute; top:50%; left:50%; transform:translate(-50%, -50%); text-align:center; }
.m_sec01 .swiper-slide .text .t01 {margin-top: 0rem; font-size: 2.4rem; font-weight: 700; line-height: 3.2rem; color: var(--white); letter-spacing: 0.8rem; }
.m_sec01 .swiper-slide .text .t02 {margin-top: 1.2rem; font-size: 1.6rem; font-weight: 400; line-height: 2.4rem; color: var(--white);}
.m_sec01 .swiper-slide .text .t03 {margin-top: 4rem; font-size: 1.4rem; 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_sec01 .swiper-button-prev {left:6.4rem;bottom:7.2rem;}
.m_sec01 .swiper-button-next {right:6.4rem;bottom:7.2rem;}
.m_sec01 .swiper-scrollbar {position:absolute !important;top:auto !important;left:6.4rem !important;bottom:4rem !important;width:calc( 100% - 12.8rem) !important;background:rgba(255,255,255,0.5);}
.m_sec01 .swiper-scrollbar .swiper-scrollbar-drag {background: #ffffff; border-radius:0;}

/* 메인 : 키워드샵 */
.m_sec02 {padding:0 6.4rem; margin:12rem auto 16rem; }
.m_sec02 ul {display:flex; flex-wrap: wrap; align-items: center;gap: 1.2rem;}
.m_sec02 ul li a {display: flex; align-items: center; gap: 0 1.2rem; border: 1px solid var(--gray_line); padding: 0.8rem 2.4rem 0.8rem 0.8rem; border-radius:50rem; }
.m_sec02 ul li a:hover {background-color: var(--gray_bg01);}
.m_sec02 ul li .text {font-size:1.5rem; line-height:2.4rem; color: var(--black); display: flex; gap: 0 0.6rem;}
.m_sec02 ul li .text span {color: var(--gray_01);}
.m_sec02 ul li img {width: 5.6rem; border-radius:50rem;}

/* 메인 : 탭 상품 */
.m_sec03 {padding:0 6.4rem; margin: 0 auto 16rem;}
.m_sec03 .tab_area {display: flex; align-items: flex-start; justify-content: space-between; border-bottom: 1px solid var(--gray_line);margin-bottom:2.4rem;}
.m_sec03 .tab_area ul {display: flex; gap: 0 3.2rem;}
.m_sec03 .tab_area ul li {font-size: 1.4rem; line-height: 3.2rem; font-weight: 400; color: var(--gray_02); padding-bottom:0.6rem; cursor: pointer;margin:0;}
.m_sec03 .tab_area ul li.on {color: var(--black); font-weight:700; border-bottom:3px solid var(--black);}
.m_sec03 .tab_area .button_area {cursor:pointer;user-select:none;}
.m_sec03 .tab_area .button_area div {position: relative; z-index: 1; font-size:1.4rem; line-height:3.2rem; color: var(--black) !important;margin-top:0;}
.m_sec03 .tab_area .button_area .swiper-button-prev {margin-right: 1.6rem;left:0;}
.m_sec03 .tab_area .button_area .swiper-button-prev::before{content:"<"; padding-right:0.6rem;}
.m_sec03 .tab_area .button_area span.line {background-color: var(--gray_02); width: 0.1rem; height: 1.2rem; display:inline-block; margin-left: 1.6rem; position:relative; top:0.1rem; opacity: 0.6;}
.m_sec03 .tab_area .button_area .swiper-button-next {right:0;}
.m_sec03 .tab_area .button_area .swiper-button-next::after {content:">"; padding-left: 0.6rem;}
.m_sec03 .tab_area .button_area .disabled {z-index: 0; color: var(--gray_02);}

/* 메인 : 브랜드 컬렉션 */
.m_sec04 {padding:0 6.4rem;margin:12rem auto 16rem;}
.m_sec04 .inner {display: flex; gap: 0 1.6rem; flex-wrap: wrap;}
.m_sec04 .inner .brand_banner {width: calc(33.33% - 1.08rem);}
.m_sec04 .inner .brand_banner .ban_area {position:relative;}
.m_sec04 .inner .brand_banner .ban_area img {width:100%;}
.m_sec04 .inner .brand_banner .ban_area a .text { position: absolute; top: 2.4rem; left: 2.4rem; text-align: left;}
.m_sec04 .inner .brand_banner .ban_area a .text .t01 {font-size: 1.6rem; line-height: 2.4rem; font-weight: 400; color: var(--white);}
.m_sec04 .inner .brand_banner .ban_area a .text .t02 {font-size: 1.6rem; line-height: 2.4rem; font-weight: 700; color: var(--white); padding-top: 0.4rem;}

/* 메인 : 랭킹 01 */
.m_sec05_1 {padding:0; margin-bottom: 16rem;}
.m_sec05_1 .main_title {padding: 0 0 2.3rem; margin: 0 auto; border-bottom:1px solid var(--black);}
.m_sec05_1 .inner {padding: 0 6.4rem; margin: 0 auto;}
.m_sec05_1 .inner {display: flex; gap: 0 4rem;}
.m_sec05_1 .inner .prd_area {width: calc(50% - 1.2rem);}
.m_sec05_1 .inner .prd_area .prd_area_product {display: flex; gap: 0 2.4rem; margin: 0;overflow:hidden;}
.m_sec05_1 .inner .prd_area .prd_area_product .goods_list {width:100%;}
.m_sec05_1 .inner .ban_area {width: calc(50% - 1.2rem); background-color: var(--black);}
.m_sec05_1 .inner .ban_area .swiper-slide .bg {width:100%; height:100%; min-height:588px;}
.m_sec05_1 .inner .ban_area a .text {position: absolute; top: 2.4rem; left:3.2rem;text-align: left;}
.m_sec05_1 .inner .ban_area a .text .t01 {font-size: 1.6rem; line-height: 2.4rem; font-weight: 700; color: var(--white);}
.m_sec05_1 .inner .ban_area a .text .t02 {font-size: 1.4rem; line-height: 2.0rem; font-weight: 400; color: var(--white); padding-top:0.4rem;}
.m_sec05_1 .swiper-button-next {bottom:2.4rem;right:3.2rem;height:auto;}
.m_sec05_1 .swiper-button-prev {bottom:2.4rem;left:3.2rem;height:auto;}
.m_sec05_1 .swiper-pagination-fraction {bottom:2.4rem !important;}

/* 메인 : 랭킹 02 */
.m_sec05_2 {padding:0; margin-bottom: 16rem;}
.m_sec05_2 .main_title {padding: 0 0 2.3rem; margin: 0 auto; border-bottom:1px solid var(--black);}
.m_sec05_2 .inner {padding: 0 6.4rem; margin: 0 auto;}
.m_sec05_2 .inner {display: flex; gap: 0 4rem;}
.m_sec05_2 .inner .prd_area {width: calc(50% - 1.2rem);}
.m_sec05_2 .inner .prd_area .prd_area_product {display: flex; gap: 0 2.4rem; margin: 0;overflow:hidden;}
.m_sec05_2 .inner .prd_area .prd_area_product .goods_list {width:100%;}
.m_sec05_2 .inner .ban_area {width: calc(50% - 1.2rem); background-color: var(--black);}
.m_sec05_2 .inner .ban_area .swiper-slide .bg {width:100%; height:100%; min-height:588px;}
.m_sec05_2 .inner .ban_area a .text {position: absolute; top: 2.4rem; left:3.2rem;text-align: left;}
.m_sec05_2 .inner .ban_area a .text .t01 {font-size: 1.6rem; line-height: 2.4rem; font-weight: 700; color: var(--white);}
.m_sec05_2 .inner .ban_area a .text .t02 {font-size: 1.4rem; line-height: 2.0rem; font-weight: 400; color: var(--white); padding-top:0.4rem;}
.m_sec05_2 .swiper-button-next {bottom:2.4rem;right:3.2rem;height:auto;}
.m_sec05_2 .swiper-button-prev {bottom:2.4rem;left:3.2rem;height:auto;}
.m_sec05_2 .swiper-pagination-fraction {bottom:2.4rem !important;}

/* 메인 : 브랜드 프로모션 */
.m_sec06 {padding:0 6.4rem; margin: 0 auto 16rem; }
.m_sec06 .main_promo {background-color: var(--black);}
.m_sec06 .swiper-slide {width:100%; }
.m_sec06 .swiper-slide .bg {width:100%; }
.m_sec06 .swiper-slide .bg img {width:100%;}
.m_sec06 .swiper-slide .text {position:absolute; top:2.4rem; left:3.2rem; text-align:left;}
.m_sec06 .swiper-slide .text .t01 {margin-top: 0rem; font-size: 1.6rem; font-weight: 700; line-height: 2.4rem; color: var(--white);}
.m_sec06 .swiper-slide .text .t02 {margin-top: 0.8rem; font-size: 1.4rem; font-weight: 400; line-height: 2.0rem; color: var(--white);}
.m_sec06 .swiper-slide .text2 { position:absolute; top:2.4rem; right:3.2rem; font-size: 1.4rem; 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_sec06 .swiper-button-next {bottom:2.4rem;right:3.2rem;height:auto;}
.m_sec06 .swiper-button-prev {bottom:2.4rem;left:3.2rem;height:auto;}
.m_sec06 .swiper-pagination-fraction {bottom:2.4rem !important;}

/* 메인 : 브랜드 컬렉티브 */
.m_sec07 {padding:0 6.4rem; margin: 0 auto 16rem;}

/* 메인 : 매거진 */
.m_sec08 {padding:0 6.4rem; margin: 0 auto 16rem;}
.m_sec08 .main_title {border-bottom:1px solid var(--black); padding: 0 0 2.3rem; margin-bottom: 4rem;}
.m_sec08 .imgLink img {width:100%; height:auto; margin:0px;}
.m_sec08 ul {display: flex; align-items: flex-start; flex-wrap: wrap; gap: 4rem 0px; margin: 0 auto;}
.m_sec08 ul li {display: flex;width: 100%; align-items: flex-end;margin:0px; gap: 0 4.8rem; border-bottom:1px solid #eeeeee; padding-bottom:4rem;}
.m_sec08 .thumb_area {width: calc(50% - 1.2rem);}
.m_sec08 .content_area {width: calc(50% - 1.2rem);}
.m_sec08 .content_area .subject {font-size: 2.4rem; line-height: 3.2rem; font-weight: 700; color: #151515;}
.m_sec08 .content_area .contents {display:block; font-size: 1.6rem; line-height: 2.4rem; font-weight: 400; color: #999999; margin-top:2.4rem; max-width:64rem; max-height:7.2rem; overflow:hidden; }
.m_sec08 .content_area .contents img {display:none;}
.m_sec08 .content_area a.board_more {display:inline-block; margin-top:40px; font-size: 1.4rem; line-height: 2.4rem; padding-right:2rem; font-weight: 400; color: var(--black); background: url('../../img/mimg/btn_arrow_16b.svg') no-repeat right / auto;}

/* 메인 : 스타일별 쇼핑하기 */
.m_sec09 {padding:0 6.4rem; margin: 0 auto 16rem;}
.m_sec09 .inner{display: flex; gap: 0 1.6rem;}
.m_sec09 .inner .style_banner {width: calc(33.33% - 1.08rem);}
.m_sec09 .inner .style_banner .ban_area {position:relative;}
.m_sec09 .inner .style_banner .ban_area img {width:100%;}
.m_sec09 .inner .ban_area a .text { position: absolute; top: 2.4rem; left: 2.4rem; text-align: left;}
.m_sec09 .inner .ban_area a .text .t01 {font-size: 1.6rem; line-height: 2.4rem; font-weight: 400; color: var(--white);}
.m_sec09 .inner .ban_area a .text .t02 {font-size: 1.6rem; line-height: 2.4rem; font-weight: 700; color: var(--white); padding-top: 0.4rem;}
.m_sec09 .inner .ban_area a .t03 { position: absolute; bottom: 2.4rem; right: 2.4rem; text-align: left;}
.m_sec09 .inner .ban_area a .t03 {margin-top: 3.2rem; font-size: 1.4rem; 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;}

/* 메인 커서 */
#cursor {position:fixed;z-index: 99; left: 0; top: 0; pointer-events: none; will-change: transform;}
@media (hover: hover) and (pointer: fine) {
	.cursor__circle {
		width: 64px;
		height: 64px;
		margin-top: -50%;
		margin-left: -50%;
		border-radius: 50%;
		border: solid 1px rgba(255, 255, 255, 0);
		transition: opacity 0.3s cubic-bezier(0.25, 1, 0.5, 1),
		background-color 0.3s cubic-bezier(0.25, 1, 0.5, 1),
		border-color 0.3s cubic-bezier(0.25, 1, 0.5, 1),
		width 0.3s cubic-bezier(0.25, 1, 0.5, 1),
		height 0.3s cubic-bezier(0.25, 1, 0.5, 1);
	}
	#cursor.arrow .cursor__circle {width:120px; height:120px;border-color: #ffffff;}
	#cursor.arrow::after{content: ''; position: absolute;left: -50%; top: -50%; width: 100%; height: 100%;background-image: url('../../img/mimg/arrow_swipe.svg');background-repeat: no-repeat; background-position: center;}
}