@charset "utf-8";
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans:wght@100..900&display=swap');
html,body{font-family:'Noto Sans' , sans-serif; letter-spacing:0;}
input,
select {font-family:'Noto Sans', sans-serif;}
button {font-family:'Noto Sans', sans-serif;}

.btn-gnb-nav.gnb-1 .txt {width:210px; height:36px;}
.btn-gnb-nav.gnb-2 .txt {width:204px; height:36px;}
.btn-gnb-nav.gnb-3 .txt {width:223px; height:34px;}
.btn-gnb-nav.gnb-4 .txt {width:208px; height:36px;}
.btn-gnb-nav.gnb-5 .txt {width:214px; height:29px;}
.btn-gnb-nav.gnb-1 .txt:before {background-image:url(../images/gnb-nav-1-off.png);}
.btn-gnb-nav.gnb-1 .txt:after {background-image:url(../images/gnb-nav-1-on.png);}
.btn-gnb-nav.gnb-2 .txt:before {background-image:url(../images/gnb-nav-2-off.png);}
.btn-gnb-nav.gnb-2 .txt:after {background-image:url(../images/gnb-nav-2-on.png);}
.btn-gnb-nav.gnb-3 .txt:before {background-image:url(../images/gnb-nav-3-1-off.png);}
.btn-gnb-nav.gnb-3 .txt:after {background-image:url(../images/gnb-nav-3-1-on.png);}
.btn-gnb-nav.gnb-4 .txt:before {background-image:url(../images/gnb-nav-4-off.png);}
.btn-gnb-nav.gnb-4 .txt:after {background-image:url(../images/gnb-nav-4-on.png);}
.btn-gnb-nav.gnb-5 .txt:before {background-image:url(../images/gnb-nav-5-off.png);}
.btn-gnb-nav.gnb-5 .txt:after {background-image:url(../images/gnb-nav-5-on.png);}
.btn-gnb-nav .comming-soon { display:none; width:135px; height:28px; margin:0; background:url(../images/gnb-nav-comming.png) center center no-repeat; background-size:100% 100%;}

/* .area-pop-items .item-desc {padding:0 40px;} */
.area-pop-items .item-desc {padding:0 0px;}

.agree-pop-wrap {word-break:keep-all;}
#registrationCodePop .btn-confirm {top:87.3%; left:30.5%; width:39.3%; height:7.8%;}
#registrationCodePop .item-code {top:39.4%; left:36.9%; width:54.9%; height:6.8%;}

.area-3 .over > img.over-1 {top:14.9%; left:28.1%; width:12.9%; height:20.4%;}
.area-3 .over > img.over-2 {top:22.6%; left:39.9%; width:15.7%; height:27.0%;}
.area-3 .over > img.over-3 {top:35.6%; left:52.9%; width:18.4%; height:30.3%;}
.area-3 .over > img.over-4 {top:45.7%; left:44.5%; width:11.9%; height:25.7%;}
.area-3 .over > img.over-5 {top:34.3%; left:31.4%; width:13.6%; height:42.1%;}
.area-3 .over > img.over-6 {top:59.4%; left:23.6%; width:28.4%; height:37.9%;}



.header-sns {    
    position:relative;
    display: inline-flex;
    align-items: center;    
    width:4.0rem;
    height:4.0rem;
}
.header-sns.actived .sns-list {
	transform: translate(0%, 0rem);
	opacity: 1;
	visibility: visible;
	transition-delay: 0s, 0s, 0s;
}
.btn-sns-ui {
	position: relative;
	display: inline-flex;
	align-items: center;
	width:40px;
	height:40px;
}
.btn-sns-ui::before {
	content: '';
	position: absolute;
	top:0;
	left: 0;
	width: 100%;
	height: 100%;
	background: url(/assets/images/common/header-sns-off.png) center center no-repeat;
	background-size: 100% 100%;
	opacity: 1;
	transition: opacity 0.2s ease;
}
.gnb-global .header-sns .sns-list.actived {
	display: block; 
	visibility: visible;
	opacity: 1;
	transition-property: transform, opacity, visibility;
	transition-duration: 0.2s, 0.2s, 0s;
	transition-delay: 0s, 0s, 0.2s;
	transition-timing-function: var(--transition-easeOutQuart);
}
.gnb-global  .header-sns .sns-list {
	display: none;
	position: absolute;
	top: 50%;
	right: 15%;
	transform: translate(0%, 2.0rem);
	opacity: 0;
	visibility: hidden;
	transition-property: transform, opacity, visibility;
	transition-duration: 0.2s, 0.2s, 0s;
	transition-delay: 0s, 0s, 0.2s;
	transition-timing-function: var(--transition-easeOutQuart);
}
.gnb-global .sns-list>ul {
	position: relative;
	margin-top: 2rem;
	padding:1.0rem 2rem;
	border: 1px solid #524b3f;
	background: #12100c;
	box-sizing: border-box;
}
.gnb-global .sns-list>ul:before {
	content: '';
	position: absolute;
	bottom: 100%;
	right: 0.7rem;
	width: 0px;
	height: 0px;
	border-style: solid;
	border-width: 0 0.8rem 1.6rem 0.8rem;
	border-color: transparent transparent #524b3f transparent;
}
.gnb-global .sns-list>ul:after {
	content: '';
	position: absolute;
	bottom: 100%;
	right: calc(0.7rem + 1px);
	width: 0px;
	height: 0px;
	border-style: solid;
	border-width: 0 0.7rem 1.4rem 0.7rem;
	border-color: transparent transparent #12100c transparent;
}
.gnb-global .sns-list>ul>li {
	position: relative;
}

.gnb-global .sns-list>ul>li + li {
	margin-top:0.8rem;
}

.gnb-global .sns-list>ul>li>a{
	position: relative;
	display: inline-flex;
	align-items: center;
	width:50px;
	height:50px;
}

.gnb-global .btn-header-cart {
	position:relative;
	display:inline-flex;
	width:40px;
	height:40px;
	margin-right:5px;
	font-size:0;
}
.gnb-global .btn-header-cart::after,
.gnb-global .btn-header-cart:before {
	content:'';
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
	display:block;
	background-repeat:no-repeat;
	background-size:100% 100%;
	background-position: center center;
}
        
.gnb-global .btn-header-cart::before {
	background-image:url(/assets/images/common/header-cart-off.png);
}

.gnb-wrap .header-sns {display: none;}





.foot_wrap .logo_foot {
	margin-top:2.4rem;
	display: flex;
	justify-content: center;
	gap: 1.4rem;
}
.foot_wrap .logo_foot>a {
	display: block;
	background-repeat: no-repeat;
	background-position: center center;
	background-size: 100% 100%;
	font-size: 0;
}

.foot_wrap .logo_foot>a.redlab {
	width:9.9rem;
	height: 2.3rem;
	background-image: url(/assets/images/common/logo_redlab.png);
}
.foot_wrap .logo_foot img:first-child {
	width:9.9rem;
	height: 2.3rem;
}

.foot_wrap .logo_foot>a.wemix {
	width: 13.2rem;
	height: 2.8rem;
	background-image: url(/assets/images/common/footer-logo-wemix.png);
}

.foot_wrap .info_foot{
	margin-top:1.8rem !important;
}


@media screen and (max-width:1366px) {

    .header-global{
        padding: 0 3.0rem;
    }
}


 @media screen and (max-width:1280px){
    .header-sns {
        width:40px;
        height:40px;
    }
	.header-sns  .btn-sns-ui {
		width:3.2rem;
		height:3.2rem;
	}
	.header-global .btn-header-cart,
	.header-global .btn-header-mypage {            
		width:3.2rem;
		height:3.2rem;
	}
 }


@media screen and (max-width:1440px) {
	.btn-gnb-nav.gnb-1 .txt {width:145px; height:22px;}
	.btn-gnb-nav.gnb-2 .txt {width:142px; height:22px;}
	.btn-gnb-nav.gnb-3 .txt {width:155px; height:22px;}
	.btn-gnb-nav.gnb-4 .txt {width:146px; height:22px;}
	.btn-gnb-nav.gnb-5 .txt {width:150px; height:22px;}
	.btn-gnb-nav.gnb-1 .txt:before {background-image:url(../images/gnb-nav-1-off-m.png);}
	.btn-gnb-nav.gnb-1 .txt:after {background-image:url(../images/gnb-nav-1-on-m.png);}
	.btn-gnb-nav.gnb-2 .txt:before {background-image:url(../images/gnb-nav-2-off-m.png);}
	.btn-gnb-nav.gnb-2 .txt:after {background-image:url(../images/gnb-nav-2-on-m.png);}
	.btn-gnb-nav.gnb-3 .txt:before {background-image:url(../images/gnb-nav-3-1-off-m.png);}
	.btn-gnb-nav.gnb-3 .txt:after {background-image:url(../images/gnb-nav-3-1-on-m.png);}
	.btn-gnb-nav.gnb-4 .txt:before {background-image:url(../images/gnb-nav-4-off-m.png);}
	.btn-gnb-nav.gnb-4 .txt:after {background-image:url(../images/gnb-nav-4-on-m.png);}
	.btn-gnb-nav.gnb-5 .txt:before {background-image:url(../images/gnb-nav-5-off-m.png);}
	.btn-gnb-nav.gnb-5 .txt:after {background-image:url(../images/gnb-nav-5-on-m.png);}


	.gnb-wrap .header-sns {  
		display: block;  
		position:absolute;
		bottom:0;
		left:0;
		width:100%;
		height:3.6rem;
		display:flex;
		align-items: center;  
		background: url(/assets/images/common/bg-gnb-line-m.png) no-repeat top;
		background-size: 39rem 0.05rem;  
	}
	.gnb-wrap .sns-list {
		position: relative;
		top:auto;
		right:auto;
		transform:none;
		opacity:1;
		visibility:visible;
		transition:none;
		width:100%;
		height:100%;
	}

	.gnb-wrap .sns-list>ul {
		position: relative;
		width:100%;
		height:3.6rem;
		display:flex;
		align-items:flex-start;
		justify-content:center;
		gap:0 1rem;                
		margin:0;
		padding:.3rem 0 0 0;
		border:none;
		background:none;
		box-sizing: border-box;
	}
	
	.gnb-wrap .btn-sns-ui,
	.gnb-wrap .sns-list>ul:after,
	.gnb-wrap .sns-list>ul:before {
		display:none;
	}

	.gnb-wrap .sns-list>ul>li + li {
		margin-top:0;    
	}
	.gnb-wrap .sns-list>ul>li{
		width:3rem;
		height:3rem;
	}
	.gnb-wrap .sns-list>ul>li>a{ 
		width:3rem;
		height:3rem;
	}


	.gnb-global{
		position: fixed;
		right:15px;
		height:50px;
		z-index: 1200;
	}

	.gnb-global .btn-header-cart {
		width:32px;
		height:32px;
	}

	.gnb-global .header-sns {
		display: block;
		width:32px;
		height:32px;
	}

	.gnb-global .header-sns .btn-sns-ui{
		width:32px;
		height:32px;
	}


	.gnb-global .header-sns.actived .btn-sns-ui{
		display: block;
	}
	.gnb-global .sns-list.actived  {
		display: block;
		top:0%;
		right:10%;
		opacity: 1;
		visibility: visible;
	}
	.gnb-global .sns-list>ul {
		padding:1rem;
	}
	.gnb-global .sns-list>ul>li>a {
		width: 40px;
		height:40px;
	}
	.gnb-global .sns-list>ul:before {
		border-width: 0 0.4rem .8rem 0.4rem
	}
	.gnb-global .sns-list>ul:after {
		border-width: 0 0.35rem .7rem 0.35rem;
		border-color: transparent transparent #12100c transparent;
	}
}

@media screen and (max-width:1024px) {
	.registration .txt-2 .txt {zoom:0.8;}



    .header-sns {
        display:none;
    }


    .header-global {
        height:5.0rem;
        padding:0 1.7rem;
        gap:0;
        z-index:105;
	}
	.btn-header-cart{
		width:2.8rem;
		height:2.8rem;
	}
	.btn-header-cart::after,
	.btn-header-cart::before {
		background-size:2.4rem 2.4rem;
	}




	.footer-wrap {
			padding:3rem 1.5rem 1.8rem 1.5rem;
		}
	.foot_wrap .logo_foot {
		margin-top:1rem;
		display: flex;
		justify-content: center;
		gap: 1rem;
	}
	.foot_wrap .logo_foot>a {
		display: block;
		background-repeat: no-repeat;
		background-position: center center;
		background-size: 100% 100%;
		font-size: 0;
	}

	.foot_wrap .logo_foot>a.redlab {
		width: 4.95rem;
		height: 1.15rem;
	}
	.foot_wrap .logo_foot img:first-child {
		width:4.95rem;
		height: 1.15rem;
	}

	.foot_wrap .logo_foot>a.wemix {
        width: 6.6rem;
        height: 1.4rem;
	}

	.foot_wrap .info_foot{
		margin-top:.5rem !important;
	}
}

@media screen and (max-width:768px) {
	.area-pop-items .item-desc {padding:0 20px;}
	.registration .txt-2 .txt {zoom:1;}
	.form-registration {top:68.54%; left:0; right:auto; width:100%;}

	.update .item-label {margin:0 -20px;}
}

@media screen and (max-width:380px) {
	.area-pop-items .item-desc {font-size:12px;}
}

@media screen and (min-width:769px) and (max-width:3840px) {
	footer .list_csmenu li .link_csmenu {
		font-weight: 500;
	}
}