@charset "euc-kr";
@import url("common.css");


/** ¸ÞÀκñÁÖ¾ó **/
#visual{position:relative; width:100%; max-width:640px; margin:0 auto; }
#visual .box{position:relative; }
#visual .vtxt{position:Absolute; right:4%; top:50%; margin-top:-57px; width:160px;}
	#visual .vtxt h6{width:100%; margin-bottom:12px}
	#visual .vtxt p{font-family:"Roboto", Sans-serif; color:rgba(255,255,255,0.65); font-size:14px; font-style:italic; letter-spacing:0.5pt; text-indent:16px}

	#visual .slick-dots{position:absolute;  clear:both; right:4%; top:50%; z-index:90; width:144px; margin-top:48px;}
	#visual .slick-dots li{float:left; overflow:hidden; width:9px; height:9px; background:rgba(245,245,245,0.5); border-radius:50%; margin-right:5px;vertical-align:middle; cursor:pointer; }
	#visual .slick-dots li button{border:none; text-indent:-999999999px; background:none;cursor:pointer; }
	#visual .slick-dots li.slick-active {background:#fff; width:12px !important; height:12px !important; position:Relative; top:-2px;}

.visual_in .slick-active .vtxt{ -webkit-animation: moveUp 0.7s ease-in-out both; -moz-animation: moveUp 0.7s ease-in-out both; -o-animation: moveUp 0.7s ease-in-out both; -ms-animation: moveUp 0.7s ease-in-out both; animation: moveUp 0.7s ease-in-out both; opacity:1; transition:all 0.25s ease-in-out; transition-delay:0.3s; }
	@-webkit-keyframes moveUp{ 0% {-webkit-transform: translateY(20px);} 100% {-webkit-transform: translateY(0px);} }
	@-moz-keyframes moveUp{ 0% {-moz-transform: translateY(20px);} 100% {-moz-transform: translateY(0px);} }
	@-o-keyframes moveUp{ 0% {-o-transform: translateY(20px);} 100% {-o-transform: translateY(0px);}  }
	@-ms-keyframes moveUp{ 0% {-ms-transform: translateY(20px);} 100% {-ms-transform: translateY(0px);} }
	@keyframes moveUp{ 0% {transform: translateY(20px);} 100% {transform: translateY(0px);}}


.main_tit{line-height:110%; color:#3a3a3a; font-size:22px; font-family:'Roboto', sans-serif; font-weight:700; letter-spacing:0.35pt; display:inline-block; width:auto; background:url('/img/main_tit_line.png') no-repeat left center, url('/img/main_tit_line.png') no-repeat right center; padding:0 15px; background-size:7px auto; margin:0 0 12px;}

/* Ä«´Þ·Î±× */
.main_catalog{position:Relative; margin:-180px 0 0;  }
	.main_catalog > a{display:block; width:50%; position:absolute; left:0; top:0; z-index:900; height:100%; box-sizing:border-box; padding:0 0 0 8%;}
	.main_catalog h6{font-size:17px; color:#fff; font-family:"Roboto", Sans-serif; line-height:120%; font-weight:600; padding:54% 0 0;}
	.main_catalog p{font-size:13px; line-height:155%; color:#dee1e6; padding:6px 0 8px;}
	.main_catalog p br{display:none; }
	.main_catalog span{display:inline-block; font-size:12px; line-height:120%; color:#153565; background:#fff; border-radius:50px; padding:8px 19px; font-family:"Roboto", Sans-serif;}
	
	.main_catalog ul{position:absolute; right:4%; overflow:hidden; clear:Both; bottom:15%; }
	.main_catalog li{float:left; margin-left:15px; }
	.main_catalog li span{display:inline-block; height:26px; line-height:26px; vertical-align:top; font-size:12px; padding:0 8px; border-radius:5px; background:#3a1c1c; color:#fff; letter-spacing:-0.45pt; margin-left:8px; position:Relative;}
	.main_catalog li span:after{ content:""; background:url('/m/img/foot_sns_kakao_arrow2.png') no-repeat center; width:6px; height:7px; display:block; font-size:12px; position:Absolute; top:10px; left:-5px; z-index:1; color:#3a1c1c;}
	.main_catalog li img{height:30px; vertical-align:top;}

.main_catalog.login{z-index:900;}
.main_catalog.login h6{padding:50% 0 0;}

/* ¼¥¹ÙÀÌ */
.main_shop{ text-align:Center; }
	.main_shop ul{padding:0 4%;}
	.main_shop li{text-align:left; border-radius:5px; overflow:hidden; margin:0 0 5px; }
	.main_shop a{display:block; box-sizing:Border-box; padding:28px 4%; font-family:'Roboto', sans-serif; font-size:15px; letter-spacing:0.25pt; line-height:120%; font-weight:500; color:#fff; }
	.main_shop a:link, .main_shop a:visited, .main_shop a.focus{color:#fff; }
	.main_shop .type01{background:url('/m/img/shopBy_img01.jpg') no-repeat center; background-size:cover; }
	.main_shop .type02{background:url('/m/img/shopBy_img02.jpg') no-repeat center; background-size:cover; }
	.main_shop .type03{background:url('/m/img/shopBy_img03.jpg') no-repeat center; background-size:cover; }
	.main_shop .type04{background:url('/m/img/shopBy_img04.jpg') no-repeat center; background-size:cover; }
	.main_shop .type05{background:url('/m/img/shopBy_img05.jpg') no-repeat center; background-size:cover; }
	.main_shop .type04 a, .main_shop .type05 a{color:#3a3a3a;}
	.main_shop .type04 a:link, .main_shop .type05 a:link{color:#3a3a3a;}
	.main_shop .type04 a:visited, .main_shop .type05 a:visited{color:#3a3a3a;}
	.main_shop .type04 a:focus, .main_shop .type05 a:focus{color:#3a3a3a;}

/* º£½ºÆ®¼¿·¯ */
.main_prd{text-align:center; background:#ececec; padding:36px 0; margin:36px 0 0;}
	.main_prd .mainPrd_in{padding:0 2%;position: relative;}
	.main_prd .mainPrd_in dl{margin:0 3%; border-radius:5px; overflow:hidden; background:#fff; }
	.main_prd .mainPrd_in dt{background-repeat:no-repeat; background-size:cover;}
	.main_prd .mainPrd_in dd{padding:0 0 15px;}
		.main_prd .mainPrd_in dd h6{font-size:15px; font-weight:400; color:#3a3a3a; padding:0 0 8px;}
		.main_prd .mainPrd_in dd p{font-size:13px;}
		.main_prd .mainPrd_in dd s{font-size:12px; color:#909090; font-family:"Roboto", Sans-serif;margin-right:2px;}
		.main_prd .mainPrd_in dd span{font-family:"Roboto", Sans-serif; color:#153565; font-size:17px; font-weight:600; vertical-align:bottom; margin-right:2px;}
		.main_prd .mainPrd_in dd .price_ko{font-family:NotoKR-Regular, sans-serif; font-size:15px; letter-spacing:-0.25pt; font-weight:700; }
	/* Arrows */
	.mainPrd_in .slick-prev, .mainPrd_in .slick-next{position: absolute; display: block;width:25px; height: 16px; padding: 0; cursor: pointer; color: transparent; border: none; outline: none; background: transparent; top:-30px; z-index:10; }
	.mainPrd_in .slick-prev{left:4%; background:url('/m/img/arrow_prev.gif') no-repeat left center; background-size:100%;}
	.mainPrd_in .slick-next{right:4%; background:url('/m/img/arrow_next.gif') no-repeat right center; background-size:100%;}

/* SNS */
.main_sns{background:#ececec; padding:0 4%; overflow:hidden; clear:both; }
	.main_sns dd{width:49%; float:left; border-radius:5px; text-align:center; }
	.main_sns dd span{display:block; width:36px; height:36px; border-radius:36px; background:#fff; margin:0 auto 6px; box-sizing:Border-box; }
	.main_sns dd span img{display:block; height:52%; margin:0 auto 0; padding:9px 0 0;}
	.main_sns dd a{display:block; width:100%; height:100%; padding:18px 0; line-height:120%; font-family:"Roboto", Sans-serif; font-size:15px; color:#fff; font-weight:500; letter-spacing:0.25pt;}
	.main_sns .insta{background:url('/m/img/bn_insta_bg.gif') no-repeat center bottom; background-size:cover; margin-right:2%;}
	.main_sns .fb{background:#153565;}

.main_webhard{padding:9px 4%; background:#ececec; position:Relative; }
.main_webhard img{border-radius:5px;  }
.main_webhard.login .info{position:absolute; background:rgba(34,34,34,0.8); width:92%; height:calc(100% - 20px); text-align:Center; left:4%; top:9px;border-radius:5px; }
	.main_webhard .info div{position:absolute; top: 50%; -moz-transform:translateY(-50%); -ms-transform:translateY(-50%); -webkit-transform: translateY(-50%); transform: translateY(-50%); width:100%;}
	.main_webhard .info h6{font-family:"Roboto", Sans-serif;  color:#fff; font-size:18px; letter-spacing:0.35pt; }
	.main_webhard .info p{font-family:"Roboto", Sans-serif;  color:#fff; letter-spacing:0.25pt; padding:5px 0 9px;}
	.main_webhard .info a{display:block; height:30px; border-radius:30px; border:1px solid #fff; color:#fff; font-size:13px; line-height:30px; width:50%; margin:0 auto;}



/* °øÁö»çÇ× */
.main_notice{text-align:Center; padding:0 4% 40px;background:#ececec;}
	.main_notice > div{background:#fff; border-radius:5px; position:Relative; padding:28px 10px;}
	.main_notice li{padding-bottom:5px; text-align:left; overflow:hidden; clear:both; }
	.main_notice li a{font-size:13px; letter-spacing:-0.35pt; text-align:left;}
	.main_notice li a p{font-size:13px; letter-spacing:-0.35pt; width:calc(100% - 48px); overflow:hidden; float:left; height:18px;}
	.main_notice li a span{float:right; font-size:12px; color:#888; font-family:"Roboto", Sans-serif; padding:2px 2px 0 0;}
	.main_notice .more{position:absolute; right:4%; width:16px; top:31px; }

.main_notice.login  > div {padding-bottom:0;}
.main_notice.login .mem_only{display:block; border-top:1px solid #ddd; width:100%;  padding:10px 0; color:#3a3a3a; font-size:13px; font-family:NotoKR-Medium; margin-top:12px}


/*******************************************************************************
	@media
*******************************************************************************/
@media all and (max-width:640px) {

}


/*******************************************************************************
	@media 420px~ 460px
*******************************************************************************/
@media all and (max-width:460px) {

/* Ä«´Þ·Î±× */
.main_catalog{ margin:-180px 0 0;}
	.main_catalog h6{font-size:16px;padding:54% 0 0;}
	.main_catalog p{font-size:12px; padding:1px 0 7px;}
	.main_catalog p br{display:block; }
	.main_catalog span {font-size:11px; padding:5px 18px;}

.main_catalog ul{ }
	.main_catalog li{margin-left:10px; }
	.main_catalog li img{height:25px; }
	.main_catalog li span{height:23px; line-height:23px;font-size:11px; } 
	.main_catalog li span:after{top:8px}


}


/*******************************************************************************
	@media ~420px
*******************************************************************************/
@media all and (max-width:420px) {

	.main_catalog{position:Relative; margin:-120px 0 0;}
		.main_catalog h6{padding:48% 0 0;}

	.main_catalog.login h6{padding:43% 0 0;}

.main_catalog ul{ }
	.main_catalog li{margin-left:7px; }


}



/*******************************************************************************
	@media 320px~ 340px
*******************************************************************************/
@media all and (max-width:355px) {


	.main_catalog{position:Relative; margin:-90px 0 0;}
		.main_catalog h6{padding:42% 0 0;}

	.main_catalog.login h6{padding:37% 0 0;}

.main_catalog ul{ bottom:12%;}
	.main_catalog li{margin-left:7px; }
	.main_catalog li img{height:22px;}
	.main_catalog li span{font-size:10px; letter-spacing:-0.55pt;} 



}