/*-- common css --*/

:root {

	/*font-size*/
	--fs-13: .8125rem;
	--fs-14: .875rem;
	--fs-15: .9375rem;
	--fs-18: 1.125rem;
	--fs-20: 1.25rem;
	--fs-23: 1.4375rem;
	--fs-26: 1.625rem;
	--fs-28: 1.75rem;

	/*font-weight*/
	--fw-4: 400;
	--fw-5: 500;
	--fw-6: 600;
	--fw-7: 700;
	--fw-8: 800;
	--fw-9: 900;

	/*color*/
	--color-1: #003cb5;
	--line-color-1: #eaedef;
}

/*container*/
.common-container{width: 90%;max-width: 1280px;margin: 0 auto;}

.common-section{padding-top: 120px;}

.mobile-line{display: none;height: 8px;background-color: #f7f7f7;border: none;margin: 0px;padding: 0px;}

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

	.common-section{padding-top: 100px;}
}

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

	.common-section{padding-top: 80px;}
}

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

	.common-section{padding-top: 60px;}
}

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

	.common-section{padding: 30px 0;}

	.mobile-line{display: block;}
}

/*title*/
.main-title{font-size: var(--fs-26);font-weight: var(--fw-7);margin-bottom: 28px;}

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

	.main-title{margin-bottom: 24px;}
}

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

	.main-title{font-size: 20px;margin-bottom: 16px;}
}

/*common*/
.mb_t10 {margin-top:10px;}

.member-rest{font-size: 14px;font-weight: 400;text-align: center;margin-top: 15px;color: #777;}
.member-rest a{color: #000;font-weight: 600;text-decoration: underline;}

/*common link*/
.link-wrap{display: flex;align-items: center;justify-content: center;margin-top: 29px;}
.link-wrap a{display: flex;align-items: center;justify-content: center;gap: 12px;width: 130px;line-height: 48px;border-radius: 48px;border: 1px solid #eee;font-weight: var(--fw-6);transition: all .2s ease;}
.link-wrap a img{display: block;}

/*hover*/
.link-wrap a:hover{background-color: #000;border-color: #000;color: #FFF;}
.link-wrap a:hover img{filter: brightness(1) invert(1);}

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

	.link-wrap a{width: 115px;line-height: 45px;border-radius: 45px;}
}

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

	.link-wrap{margin-top: 25px;}
	.link-wrap a{font-size: 15px;font-weight: var(--fw-4);gap: 11px;width: 100%;line-height: 42px;border-radius: 5px;border-color: var(--line-color-1);color: #999;}
	.link-wrap a img{display: none;}
}

/*common motion*/
.motion-1{transform: translateY(25px);opacity: 0;transition: transform .6s ease, opacity .4s ease;}
.common_motion.on .motion-1{transform: translateY(0);opacity: 1;}

/*-- header --*/
#header{position: fixed;top: 0;left: 0;width: 100%;border-bottom: 1px solid var(--line-color-1);background-color: #FFF;z-index: 1000;}
.header-container{display: flex;align-items: center;justify-content: space-between;height: 80px;}

.hd-lft{display: flex;align-items: center;gap: 18px;}

.hd-btn{width: 24px;height: 80px;position: relative;}
.hd-btn span{position: absolute;top: 39px;left: 0;width: 100%;height: 2px;background-color: #000;}
.hd-btn span:nth-child(1){transform: translateY(-9px);}
.hd-btn span:nth-child(3){transform: translateY(9px);}

.hd-logo{font-size: var(--fs-23);}
.hd-logo a{display: block;width: 100%;height: 100%;}

.hd-rgt{display: flex;align-items: center;}

.hd-gnb{margin-right: 22px;}
.hd-gnb>ul{display: flex;}
.hd-gnb>ul>li>a{display: block;width: 100%;height: 100%;line-height: 80px;padding: 0 22px;font-size: var(--fs-18);font-weight: var(--fw-5);}
.hd-gnb>ul>li:hover>a{color: var(--color-1);}

.hd-menu{display: flex;align-items: center;gap: 23px;}
.hd-menu li a{display: block;width: 100%;height: 100%;}
.hd-menu li figure{position: relative;}
.hd-menu li figure img{display: block;}
.hd-menu li figure img:nth-child(2){display: none;}

.alarm-dot{display: flex;align-items: center;justify-content: center;position: absolute;bottom: -2px;right: -6px;width: 16px;height: 16px;border-radius: 16px;font-weight: 500;color: #FFF;background-color: #000;}
.alarm-join{font-size: 16px;padding-bottom: 2px;padding-left: 1px;}
.alarm-cart{font-size: 11px;}

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

	.header-container{height: 70px;}

	.hd-btn{height: 70px;}
	.hd-btn span{top: 34px;}
	.hd-btn span:nth-child(1){transform: translateY(-8px);}
	.hd-btn span:nth-child(3){transform: translateY(8px);}

	.hd-gnb>ul>li>a{line-height: 70px;}
}

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

	.hd-gnb{display: none;}
}

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

	.header-container{height: 60px;}

	.hd-lft{gap: 14px;}

	.hd-btn{height: 60px;}
	.hd-btn span{top: 29px;}

	.hd-logo a{font-size: 19px;}

	.hd-menu{gap: 15px;}
	.hd-menu li:nth-child(2){display: none;}
	.hd-menu li figure img:nth-child(1){display: none;}
	.hd-menu li figure img:nth-child(2){display: block;}

	.alarm-dot{bottom: -3px;}
}

/*top banner*/
.top-banner{width: 100%;height: 45px;background-color: var(--color-1);}
.top-banner>a{display: block;width: 100%;height: 100%;}

.top-banner .common-container{display: flex;align-items: center;justify-content: center;height: 100%;position: relative;}
.top-banner span{font-size: 15px;color: #FFF;}
.top-banner span b{font-weight: var(--fw-7);}

.top-close{display: flex;align-items: center;height: 100%;position: absolute;top: 0;right: 0;z-index: 1;}
.top-close img{display: block;}

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

	.top-banner{height: 40px;}
	.top-banner span{font-size: 14px;}

	.top-close img{max-width: 12px;}
}

/*-- main visual --*/
.mainVisual-wrap{width: 100%;max-width: 1920px;margin: 0 auto;margin-top: 126px;position: relative;}

.mainVisual .swiper-slide img{display: block;}

.main-arrow{position: absolute;top: calc( 50% - 12px );z-index: 10;}
.main-arrow img{display: block;}
.main-next{right: 50px;}
.main-prev{left: 50px;}

.mainVisual-box{display: flex;align-items: center;gap: 17px;position: absolute;bottom: 30px;left: 50%;transform: translateX(-50%);z-index: 1;}
.mainVisual-pag{display: flex;align-items: center;justify-content: center;gap: 5px;width: 80px;line-height: 38px;border-radius: 38px;background-color: rgba(0,0,0,.15);color: rgba(255,255,255,.5);font-size: 12px;}
.mainVisual-pag span{font-family: "Poppins", serif;font-size: var(--fs-14);font-weight: var(--fw-4);}
.mainVisual-pag span.swiper-pagination-current{color: #FFF;}

.mainVisual-pause img{display: block;}
.mainVisual-pause img.visual-play{display: none;}

.mainVisual-pause.paused img.visual-play{display: block;}
.mainVisual-pause.paused img.visual-pause{display: none;}

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

	.mainVisual .swiper-slide img{width: 100%;}
}

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

	.mainVisual-wrap{margin-top: 116px;}

	.mainVisual-pag{width: 75px;line-height: 35px;border-radius: 35px;}
}

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

	.main-next{right: 5%;}
	.main-prev{left: 5%;}

	.mainVisual-box{bottom: 25px;}
	.mainVisual-pag{width: 72px;line-height: 32px;border-radius: 32px;}
}

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

	.mainVisual-wrap{margin-top: 101px;}

	.main-arrow{display: none;}

	.mainVisual-box{bottom: 20px;left: 5%;transform: translateX(0);gap: 0;}
	.mainVisual-pag{gap: 4px;width: 72px;line-height: 28px;border-radius: 28px;font-size: 12px;}
	.mainVisual-pag span{font-size: 13px;}

	.mainVisual-pause{display: none;}
}

/*-- item list --*/
.item-list{display: flex;gap: 22.5px;}
.item-list>li{width: calc( ( 100% - 90px ) / 5 );}

.item-img{border: 1px solid #eee;border-radius: 20px;overflow: hidden;}
.item-img>img{display: block;transition: transform .3s ease;}

.item-info{margin-top: 14px;}
.item-name{display: flex;align-items: center;gap: 11px;margin-bottom: 10px;}
.item-name span{font-family: "Poppins", serif;font-size: var(--fs-14);font-weight: var(--fw-6);line-height: 23px;padding: 0 6.5px;padding-top: 1px;border-radius: 5px;background-color: #000;color: #FFF;overflow: hidden;transition: background-color .2s ease;}
.item-name b{font-size: var(--fs-18);font-weight: var(--fw-6);transition: color .2s ease;}

.item-info>p{font-size: var(--fs-14);font-weight: var(--fw-5);color: #999;word-break: keep-all;}
.item-info>span{display: block;font-size: var(--fs-18);font-weight: var(--fw-7);margin-top: 12px;}

/*hover*/
.item-list>li>a:hover .item-img>img{transform: scale(1.05);}
.item-list>li>a:hover .item-name span{background-color: var(--color-1);}
.item-list>li>a:hover .item-name b{color: var(--color-1);}

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

	.item-list{gap: 20px;}
	.item-list>li{width: calc( ( 100% - 80px ) / 5 );}

	.item-img>img{width: 100%;}

	.item-info{margin-top: 12px;}
	.item-name{gap: 10px;}
	.item-name span{line-height: 21px;padding-top: 1px;}

	.item-info>p{line-height: 140%;}
	.item-info>span{margin-top: 10px;}
}

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

	.item-list{flex-wrap: wrap;gap: 20px;row-gap: 30px;}
	.item-list>li{width: calc( ( 100% - 40px ) / 3 );}
}

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

	.item-list{flex-wrap: wrap;gap: 14px;row-gap: 20px;}
	.item-list>li{width: calc( ( 100% - 14px ) / 2 );}

	.item-img{border-radius: 15px;}

	.item-name{gap: 8px;margin-bottom: 8px;}
	.item-name span{font-size: 12px;padding: 0 7px;}
	.item-name b{font-size: 16px;}

	.item-info>p{font-size: 14px;}
	.item-info>span{font-size: 16px;font-weight: var(--fw-8);margin-top: 8px;}
}

/*-- product list --*/
.product-wrap{position: relative;}

.product-img{border: 1px solid #eee;border-radius: 20px;position: relative;overflow: hidden;}
.product-img img{display: block;transition: transform .3s ease;}

.product-img .item-name, .product-rank{position: absolute;top: 16px;z-index: 1;}
.product-img .item-name{left: 18px;}
.product-rank{right: 17px;font-size: var(--fs-20);font-weight: var(--fw-8);}

.product-info{margin-top: 12px;}
.product-info b{font-weight: var(--fw-6);line-height: 145%;word-break: keep-all;}

.product-price{display: flex;justify-content: space-between;margin-top: 9px;}
.product-price-1{margin-top: 14px;}
.product-price-1 span{font-size: var(--fs-14);font-weight: var(--fw-5);color: #999;}
.product-price-2 span{font-weight: var(--fw-7);}

.slide-arrow{position: absolute;top: 27%;display: flex;align-items: center;justify-content: center;width: 56px;height: 56px;border-radius: 56px;background-color: #FFF;z-index: 100;
	box-shadow: 0 8px 8px rgba(0,0,0,.05);
}
.slide-arrow img{display: block;}
.slide-next{right: -28px;}
.slide-prev{left: -28px;}

/*hover*/
.product>a:hover .product-img img{transform: scale(1.1);}

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

	.product-img img{width: 100%;}

	.product-price{margin-top: 8px;}
	.product-price-1{margin-top: 12px;}
}

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

	.product-img .item-name, .product-rank{top: 12px;}
	.product-img .item-name{left: 14px;}
	.product-rank{right: 14px;}
}

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

	.slide-arrow{top: 29%;width: 50px;height: 50px;border-radius: 50px;}
	.slide-next{right: -25px;}
	.slide-prev{left: -25px;}
}

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

	.slide-arrow{display: none;}
}

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

	#main-2{overflow: hidden;}

	/*#productSlide{overflow: visible !important;}*/

	.product-img{border-radius: 15px;}

	.product-info b{display: -webkit-box;font-size: 15px;line-height: 140%;max-height: calc(140% * 2);overflow: hidden;text-overflow: ellipsis;word-break: break-word;overflow-wrap: anywhere;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 2;
	}

	.product-price-1 span, .product-price-2 span{font-size: 13px;}
}

/*-- center banner --*/
#main-3 .common-container{position: relative;}

.center-banner .swiper-slide figure{border-radius: 20px;overflow: hidden;}
.center-banner .swiper-slide figure img{display: block;max-width: 100%;}

.center-dot{display: flex;justify-content: center;gap: 13px;margin-top: 19px;}
.center-dot span{width: 6px;height: 6px;margin: 0 !important;opacity: 1 !important;background-color: #ddd;}
.center-dot span.swiper-pagination-bullet-active{background-color: var(--color-1);}

.center-arrow{position: absolute;top: calc( 50% - 28px );display: flex;align-items: center;justify-content: center;width: 56px;height: 56px;border-radius: 56px;background-color: #FFF;z-index: 100;
	box-shadow: 0 8px 8px rgba(0,0,0,.05);
}
.center-arrow img{display: block;}
.center-next{right: -28px;}
.center-prev{left: -28px;}

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

	.center-arrow{top: calc( 50% - 25px );width: 50px;height: 50px;border-radius: 50px;}
	.center-next{right: -25px;}
	.center-prev{left: -25px;}
}

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

	.center-arrow{display: none;}
}

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

	.center-dot{margin-top: 15px;}
}

/*-- review slide --*/
.review-wrap{position: relative;}

.review-info b{display: block;width: 100%;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;}

.review-cont{margin-top: 8px;}
.review-cont p{font-size: var(--fs-14);font-weight: var(--fw-5);color: #999;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;}
.review-cont span{display: block;font-size: var(--fs-14);font-weight: var(--fw-6);color: #999;margin-top: 18px;}

.review-arrow{position: absolute;top: 27%;display: flex;align-items: center;justify-content: center;width: 56px;height: 56px;border-radius: 56px;background-color: #FFF;z-index: 100;
	box-shadow: 0 8px 8px rgba(0,0,0,.05);
}
.review-arrow img{display: block;}
.review-next{right: -28px;}
.review-prev{left: -28px;}

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

	.review-arrow{top: 29%;width: 50px;height: 50px;border-radius: 50px;}
	.review-next{right: -25px;}
	.review-prev{left: -25px;}
}

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

	.review-arrow{display: none;}
}

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

	#main-4{overflow: hidden;}

	/*#reviewSlide{overflow: visible !important;}*/

	.review-cont p{font-size: 13px;}
	.review-cont span{font-size: 13px;}
}

/*-- footer --*/
#footer{background-color: #000;margin-top: 120px;padding: 50px 0;}

.ft-top{display: flex;align-items: flex-start;justify-content: space-between;margin-bottom: 27px;padding-bottom: 27px;border-bottom: 1px solid rgba(255,255,255,.1);}

.ft-customer span{display: block;font-size: var(--fs-14);font-weight: var(--fw-6);color: #FFF;}
.ft-customer b{display: block;font-size: var(--fs-28);font-weight: var(--fw-6);color: #FFF;margin-top: 6px;}

.ft-customer ul{margin-top: 12px;}
.ft-customer ul li{font-size: var(--fs-14);font-weight: var(--fw-4);color: #777;margin-top: 10px;}

.ft-btn img{display: block;}

.ft-menu ul{display: flex;gap: 27px;}
.ft-menu ul li a{display: block;width: 100%;height: 100%;font-size: var(--fs-14);font-weight: var(--fw-5);color: #FFF;}

.ft-info{margin-top: 23px;}
.ft-info i{font-size: var(--fs-14);font-weight: var(--fw-5);color: #555;padding-right: 9px;line-height: 180%;}

.ft-copy{font-size: var(--fs-14);font-weight: var(--fw-5);color: #444;margin-top: 20px;}

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

	#footer{margin-top: 100px;}
}

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

	#footer{margin-top: 80px;}
}

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

	#footer{margin-top: 60px;}
}

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

	#footer{margin-top: 30px;padding: 30px 0;padding-bottom: 90px;}

	.ft-top{margin-bottom: 22px;padding-bottom: 22px;}

	.ft-customer span{font-size: 14px;}
	.ft-customer b{font-size: 22px;}

	.ft-customer ul{margin-top: 14px;}
	.ft-customer ul li{font-size: 13px;margin-top: 6px;}

	.ft-menu ul{flex-wrap: wrap;gap: 20px;row-gap: 12px;}
	.ft-menu ul li a{font-size: 13px;}

	.ft-info i, .ft-copy{font-size: 13px;}
	.ft-copy{margin-top: 10px;}
}

/*-- right quick --*/
#right-quick{position: fixed;bottom: 50px;right: 50px;z-index: 900;}

.right-menu li + li{margin-top: 10px;}
.right-menu li a{display: flex;justify-content: center;align-items: center;width: 56px;height: 56px;border-radius: 56px;border: 1px solid #dedede;background-color: #FFF;overflow: hidden;}
.right-menu li:first-child a{background-color: #000;border-color: rgba(255,255,255,.2);}

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

	#right-quick{bottom: 25px;right: 25px;}
}

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

	#right-quick{bottom: 80px;right: 5%;}

	.right-menu li.mobile-none{display: none;}
	.right-menu li + li{margin-top: 5px;}
	.right-menu li a{width: 45px;height: 45px;border-radius: 45px;}
}

/*-- mobile quick --*/
#mobile-quick{position: fixed;bottom: 0;left: 0;width: 100%;z-index: 900;background-color: #FFF;border-radius: 15px 15px 0 0;
	-webkit-box-shadow: 0 -5px 10px rgba(0,0,0,.1);
	box-shadow: 0 -5px 10px rgba(0,0,0,.1);
}

.mobile-menu{display: flex;align-items: center;}
.mobile-menu>li{flex: 1;}
.mobile-menu>li a{display: block;width: 100%;height: 100%;padding: 10.5px 0;}
.mobile-menu>li figure{display: flex;align-items: center;justify-content: center;height: 20px;}
.mobile-menu>li figure img{display: block;}
.mobile-menu>li span{display: block;text-align: center;font-size: 11px;font-weight: var(--fw-4);margin-top: 6px;}

@media screen and (min-width: 721px){

	#mobile-quick{display: none;}
}

/*-- mobile siteMap --*/
#siteMap-mo{position: fixed;top: 0;left: 0;width: 100%;max-width: 380px;height: 100%;z-index: 2000;background-color: #FFF;transform: translateX(-101%);opacity: 0;transition: transform .3s ease, opacity .2s ease;
	border-right: 1px solid #eee;
	box-shadow: 5px 0 10px rgba(0,0,0,.05);
}
#siteMap-mo.open{transform: translateX(0);opacity: 1;}

#siteMap-mo .mobile-line{display: block !important;}

.siteMap-mo-member{display: flex;justify-content: space-between;align-items: center;}
.siteMap-mo-user li a{font-size: 15px;font-weight: 400;}
.siteMap-mo-user li a b{font-weight: 700;text-decoration: underline;text-underline-offset: 2px;}

.siteMap-mo-btn{width: 20px;height: 56px;position: relative;}
.siteMap-mo-btn span{position: absolute;top: 27.5px;left: -3px;width: 26px;height: 1px;background-color: #000;}
.siteMap-mo-btn span:nth-child(1){transform: rotate(45deg);}
.siteMap-mo-btn span:nth-child(2){transform: rotate(-45deg);}

.siteMap-mo-quick{display: flex;align-items: center;background-color: var(--color-1);border-radius: 15px;overflow: hidden;padding: 15px 0;margin-bottom: 15px;}
.siteMap-mo-quick li{flex: 1;position: relative;}
.siteMap-mo-quick li::after{content: "";position: absolute;top: 50%;right: 0;transform: translateY(-50%);width: 1px;height: 30px;background-color: rgba(255,255,255,.2);}
.siteMap-mo-quick li:last-child::after{display: none;}
.siteMap-mo-quick li figure img{display: block;margin: 0 auto;max-height: 20px;filter: brightness(1) invert(1);}
.siteMap-mo-quick li span{display: block;font-size: 13px;font-weight: 400;text-align: center;margin-top: 8px;color: #FFF;}

.siteMap-mo-gnb>ul>li{border-bottom: 1px solid var(--line-color-1);}
.siteMap-mo-gnb>ul>li:last-child{border-bottom: none;}
.siteMap-mo-gnb>ul>li>a{display: block;width: 100%;height: 100%;font-size: 17px;font-weight: 500;padding: 16px 15px;position: relative;}
/*.siteMap-mo-gnb>ul>li>a::after{content: "\e942";position: absolute;top: 50%;right: 11px;transform: translateY(-50%);z-index: 1;font-family: xeicon !important;font-size: 24px;font-weight: 100 !important;}
.siteMap-mo-gnb>ul>li:nth-child(1)>a::after{display: none;}
.siteMap-mo-gnb>ul>li:nth-child(2)>a::after{display: none;}
.siteMap-mo-gnb>ul>li:nth-child(5)>a::after{display: none;}
.siteMap-mo-gnb>ul>li:nth-child(6)>a::after{display: none;}*/

.siteMap-mo-gnb>ul>li>ul{background-color: #f7f7f7;padding: 8px 15px;border-radius: 8px;overflow: hidden;display: none;}
.siteMap-mo-gnb>ul>li>ul>li>a{display: block;width: 100%;height: 100%;font-size: 14px;font-weight: 500;padding: 8px 0;color: #232323;}
.siteMap-mo-gnb>ul>li>ul>li>ul>li>a{display: block;width: 100%;height: 100%;font-size: 14px;font-weight: 400;padding: 8px 0;padding-left: 15px;color: #454545;}

.siteMap-mo-link{display: flex;align-items: center;gap: 10px;margin-top: 15px;margin-bottom: 15px;}
.siteMap-mo-link li{width: calc( ( 100% - 10px ) / 2 );}
.siteMap-mo-link li a{display: flex;align-items: center;gap: 8px;width: 100%;height: 40px;line-height: 40px;justify-content: center;border: 1px solid var(--color-1);border-radius: 6px;overflow: hidden;font-size: 15px;font-weight: 400;color: var(--color-1);}
.siteMap-mo-link li:first-child a{background-color: var(--color-1);color: #FFF;font-weight: 500;}

.siteMap-app-link{display: flex;align-items: center;font-size: 15px;font-weight: 600;color: var(--color-1);margin-top: 15px;}
.siteMap-app-link i{font-size: 20px;}
#siteMap-mo .ft-app{margin-top: 15px;margin-bottom: 15px;}

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

	#siteMap-mo{max-width: 100%;border: none;box-shadow: none;overflow-y: scroll;}
}