@charset "utf-8";

/*───────────────────────────────────────────────────────────

	layout

───────────────────────────────────────────────────────────*/
    #wrap{position: relative;width: 100%;min-width: 1200px;overflow: clip;box-sizing: border-box;}
    #wrap .dn{display: none;}
	.skip_nav {position:relative;z-index:9999;}
	.skip_nav a {display:block;height:1px;width:1px;margin-bottom:-1px;overflow:hidden;font-size:12px;color:#fff;font-weight:bold;white-space:nowrap;text-align:center;}
	.skip_nav a:focus, .skip_nav a:active {height:auto;width:100%;padding:0;margin-bottom:0;position:absolute;left:0;top:0;}
	
	.wrapper{box-sizing:border-box;transition:all 0.5s;padding-top:208px;padding-bottom:80px;}
        #header.on + .wrapper{padding-top:91px;}
	.wrapper .contents_wrap, .w_custom{max-width:1200px;margin:0 auto;width:calc(100% - 60px);position: relative;box-sizing:border-box;}
	

/*───────────────────────────────────────────────────────────

    HEADER | outline/header.html, outline/nav.html

───────────────────────────────────────────────────────────*/
	#header{position:fixed;width:100%;top:0;left:0;z-index:10;background:var(--point-white);min-width:1200px;}
	#header .hd_top{box-sizing:border-box;background:var(--point-color02);padding:12px 0;}
	#header .hd_top .w_custom{display: flex;align-items: center;justify-content: space-between;}
	#header .hd_top p{font-size:14px;color:var(--black-color00);font-weight:400;}
	#header .hd_top .hd_gnb{display: flex;align-items: center;}
	#header .hd_top .hd_gnb li{display: flex;align-items: center;}
	#header .hd_top .hd_gnb li + li:before{width:1px;height:12px;content:"";background:var(--point-color03);display: inline-block;margin:0 14px;}
	#header .hd_top .hd_gnb li a, #header .hd_top .hd_gnb li span{font-size:14px;color:var(--black-color00);font-weight:600;}
	
	#header .hd_cont{text-align: center;box-sizing:border-box;border-bottom:6px solid var(--point-color03);}
	#header .hd_cont .h_logo{height:105px;opacity:1;transition:opacity .2s .35s ease,height .35s 0ms ease;position: relative;}
	#header .hd_cont .h_logo a{display:inline-block;padding-top:25px;max-width: 186px;}
	#header.on .hd_cont .h_logo{height:0;opacity:0;overflow:hidden;transition:opacity .2s ease,height .35s .2s ease;z-index: -1;}
	#header .hd_cont .hd_lnb{display: flex;align-items: center;justify-content: center;box-sizing:border-box;gap:0 40px;margin-top:12px;transition:all 0.5s;}
	#header.on .hd_cont .hd_lnb{margin-top:0;transition:all 0.5s;}
	#header .hd_cont .hd_lnb > li{position: relative;}
	#header .hd_cont .hd_lnb > li > a{font-size:18px;color:var(--black-color01);font-weight:700;display: block;padding:12px 0;}
	#header .hd_cont .hd_lnb > li.on > a{color:var(--point-color03);}
	#header .hd_cont .hd_lnb .hd_lnb_dep2{position: absolute;width:200px;box-sizing:border-box;top:calc(100% - 4px);left:0;border:1px solid var(--border-color01);display: none;}
	#header .hd_cont .hd_lnb .hd_lnb_dep2 li{box-sizing:border-box;background:var(--point-white);text-align:left;}
	#header .hd_cont .hd_lnb .hd_lnb_dep2 li + li{border-top:1px solid var(--border-color01);}
	#header .hd_cont .hd_lnb .hd_lnb_dep2 li a{font-size:16px;color:var(--black-color01);font-weight:700;display: block;padding:12px 10px;box-sizing:border-box;}
	
	#header .prd_dep2{position: absolute;top:100%;left:0;width:100%;background:var(--point-white);box-sizing:border-box;padding:30px 0;display: none;}
	#header .prd_dep2 .w_custom{display: flex;flex-wrap:wrap;gap:0 85px;}
	#header .prd_dep2 .menu_box{}
	#header .prd_dep2 .menu_box > a{display: inline-flex;box-sizing:border-box;width:175px;height:40px;align-items: center;justify-content: center;text-align: center;background: var(--black-color00);font-size:18px;color:var(--point-white);font-weight:700;transition:all 0.3s;}
	#header .prd_dep2 .menu_box ul{margin-top:20px;}
	#header .prd_dep2 .menu_box ul li + li{margin-top:12px;}
	#header .prd_dep2 .menu_box ul li a{font-size:15px;color:var(--black-color00);font-weight:400;line-height:1.33;transition:all 0.3s;}
	
	#header .prd_dep2 .prd_box{box-sizing:border-box;width:78.33%;}
	#header .prd_dep2 .prd_box .title{display: block;font-size:20px;color:var(--black-color03);font-weight:700;box-sizing:border-box;padding-bottom:14px;border-bottom:1px solid var(--black-color00);}
	#header .prd_dep2 .prd_box .list_box{margin-top:20px;}
	#header .prd_dep2 .prd_box .list_box ul{display: flex;flex-wrap:wrap;gap:0 40px;}
	
	/*상품*/
	.main_prd_box ul li{width:calc(25% - 30px);box-sizing:border-box;position: relative;text-align: center;}
	.main_prd_box ul li a{display: block;width:100%;height:100%;position: absolute;top:0;left:0;z-index:5;}
	.main_prd_box ul li .thumb{width:100%;height:0;padding-bottom:100%;position: relative;overflow:hidden;}
	.main_prd_box ul li .thumb img{width:100%;position: absolute;top:50%;left:50%;transform:translate(-50%, -50%);transition:all 0.5s;}
	.main_prd_box ul li .info{margin-top:12px;}
	.main_prd_box ul li .info .des{font-size:16px;color:var(--point-color01);font-weight:500;line-height:1.25;}
	.main_prd_box ul li .info .name{font-size:16px;color:var(--black-color00);font-weight:400;line-height:1.5;margin-top:10px;}
	
	@media only screen and (min-width:1024px){
		#header .hd_cont .hd_lnb > li:hover > a{color:var(--point-color03);}
		#header .hd_cont .hd_lnb .hd_lnb_dep2 li:hover a{color:var(--point-color03);}
		
		#header .prd_dep2 .menu_box > a:hover{background:var(--point-color01);}
		#header .prd_dep2 .menu_box ul li:hover a{color:var(--point-color03);}
		.main_prd_box ul li:hover .thumb img{transform:translate(-50%, -50%) scale(1.2);}
	}
	

/*───────────────────────────────────────────────────────────

    FOOTER | outline/footer.html

───────────────────────────────────────────────────────────*/
	.footer_box{min-width:1200px;}
	.ft_content{box-sizing:border-box;background:var(--black-color00);padding:16px 0;}
	.ft_content .w_custom{display: flex;align-items: center;justify-content: flex-end;flex-wrap:wrap;}
	.ft_content .txt{display: flex;align-items: center;flex-wrap:wrap;gap:0 50px;}
	.ft_content .txt strong{font-size:50px;color:var(--point-white);font-weight:800;}
	.ft_content .txt p{font-size:14px;color:var(--point-white);font-weight:300;line-height:1.42;}
	
	.ft_content .ft_sns{display: flex;gap:30px;align-items: center;}
	.ft_content .ft_sns li a{display: block;width:30px;}
	
	#footer{box-sizing:border-box;padding:64px 0 36px;}
	#footer .w_custom{display: flex;flex-wrap:wrap;gap:0 80px;}
	#footer .ft_logo{width:144px;}
	#footer .ft_info_box{width:calc(100% - 224px);display: flex;}
	#footer .ft_info_box dl dt{font-size:14px;color:var(--black-color00);font-weight:600;position: relative;box-sizing:border-box;padding-left:28px;}
	#footer .ft_info_box dl dt:before{width:20px;height:2px;content:"";background:var(--point-color01);position: absolute;left:0;top:7px;}
	#footer .ft_info_box dl dd{margin-top:18px;box-sizing:border-box;}
	#footer .ft_info_box dl dd span, #footer .ft_info_box dl dd ul li a{font-size:14px;color:var(--black-color00);font-weight:400;line-height:1.42;display: block;}
	#footer .ft_info_box dl dd span + span{margin-top:6px;}
	#footer .ft_info_box dl dd span a{font-size:inherit;color:inherit;font-weight:inherit;}
	#footer .ft_info_box dl dd ul li a strong{font-size:inherit;color:inherit;font-weight:700;}
	
	#footer .ft_info_box dl .copy{font-size:14px;color:rgba(102, 102, 102, 0.8);font-weight:400;line-height:1.42;margin-top:20px;}
	#footer .ft_info_box dl .copy a{display: block;font-size:inherit;color:rgba(102, 102, 102, 0.6);font-weight:inherit;margin-top:4px;}
	
	#footer .ft_info_box dl.menu_box{margin-left:28px;}
	#footer .ft_info_box dl.menu_box dd{padding-left:28px;}
	#footer .ft_info_box dl.menu_box ul{display: flex;flex-wrap:wrap;gap:12px 40px;width:280px;}
	#footer .ft_info_box dl.menu_box ul li{width:110px;}
	
	#footer .ft_info_box dl.ft_menu{margin-left:60px;}
	#footer .ft_info_box dl.ft_menu dd{padding-left:28px;}
	#footer .ft_info_box dl.ft_menu ul li + li{margin-top:12px;}
	
	.ft_quick{position: fixed;bottom:25px;right:25px;opacity:0;z-index:-1;transition:all 0.5s;}
	.ft_quick.on{opacity:1;z-index:10;}
	.ft_quick ul li{width:50px;height:50px;box-sizing:border-box;box-shadow:0px 0px 20px rgba(0, 0, 0, 0.15);border:1px solid var(--point-color02);background:var(--point-white);}
	.ft_quick ul li + li{margin-top:10px;}
	.ft_quick ul li a{display:flex;width:100%;height:100%;align-items: center;justify-content: center;position: relative;}
	.ft_quick ul li.btn_top{margin-top:20px;background:var(--black-color00);border-color:var(--black-color00);}
	.ft_quick ul li.btn_top a{font-size:0;}
	.ft_quick ul li.btn_top a:before{width:10px;height:10px;content:"";border:1px solid var(--point-white);border-width:2px 2px 0 0;transform:rotate(-45deg);display: inline-block;margin-top:6px;}
	

/*───────────────────────────────────────────────────────────

	INDEX | index.html

───────────────────────────────────────────────────────────*/
	/*visual*/
		.main_visual{position: relative;}
		.main_visual .slick-slide{height:500px;}
		.main_visual .slick-slide .thumb{height:100%;}
		.main_visual .slick-slide .thumb img{height:100%;object-fit:cover;}
		.main_visual .slick-slide > a{display: block;width:100%;height:100%;position: absolute;top:0;left:0;z-index:5;}
		.main_visual .slick-dots{display: flex;flex-wrap:wrap;align-items: center;justify-content: center;gap:16px;position: absolute;left:50%;bottom:20px;transform:translate(-50%);}
		.main_visual .slick-dots li button{font-size:0;width:10px;height:10px;box-sizing:border-box;opacity:0.6;background:var(--point-white);}
		.main_visual .slick-dots li.slick-active button{opacity:1; background:var(--point-color02);}
		
	/*공통*/
		.main_title{border-bottom:1px solid var(--black-color00);box-sizing:border-box;padding-bottom:14px;margin-bottom:20px;}
		.main_title h3{font-size:20px;color:var(--black-color03);font-weight:700;letter-spacing:0;/* text-transform:uppercase; */}
		
	/*bnr*/	
		.main_content .main_bnr{margin-top:60px;}
		.main_content .main_bnr ul{display:flex;flex-wrap:wrap;gap:30px;}
		.main_content .main_bnr ul li{box-sizing:border-box;border:1px solid var(--point-color03);text-align: center;position: relative;transition:all 0.3s;width:calc(100% / 3 - 20px);}
		.main_content .main_bnr ul li > a{display: block;width:100%;height:100%;position: absolute;top:0;left:0;z-index:5;}
		.main_content .main_bnr ul li .thumb{width:100%;position: relative;height:0;overflow:hidden;padding-bottom:430px;box-sizing:border-box;}
		.main_content .main_bnr ul li:nth-child(1) .thumb{border-bottom:1px solid var(--point-color03);}
		.main_content .main_bnr ul li:nth-child(1) .thumb img{transform:translate(-50%, -50%) scale(0.95);}
		.main_content .main_bnr ul li .thumb img{width:100%;height:100%;object-fit:cover;position: absolute;top:50%;left:50%;transform:translate(-50%, -50%);transition:all 0.5s;}
		.main_content .main_bnr ul li p{font-size:26px;color:var(--point-color01);font-weight:500;text-transform:uppercase;box-sizing:border-box;padding:12px 0 10px;transition:all 0.3s;}
		
	/*prd*/
		.main_prd{margin-top:78px;}
		.main_prd .prd_container{position: relative;}
		.main_prd .main_prd_box{box-sizing:border-box;border-bottom:1px solid rgba(146, 139, 129, 0.2);padding-bottom:23px;}
		.main_prd .main_prd_box ul li .info{margin-top:22px;}
		.main_prd .main_prd_box ul li .info .name{margin-top:9px;}
		.main_prd .swipe_arw{width:40px;height:40px;position: absolute;top:50%;transform:translateY(-50%);cursor:pointer;}
		.main_prd .swipe_arw.swiper-button-disabled{opacity:0.5;} 
		.main_prd .swipe_arw.prev{left:-40px;}
		.main_prd .swipe_arw.next{right:-40px;}
		.main_prd .swipe_arw:before{width:13px;height:13px;content:"";border:1px solid var(--point-color01);border-width:2px 2px 0 0;position: absolute;top:11px;}
		.main_prd .swipe_arw.prev:before{transform:rotate(-135deg);left:16px;}
		.main_prd .swipe_arw.next:before{transform:rotate(45deg);right:16px;}
		
	/*partner*/
		.main_partner{margin-top:78px;}
		.main_partner ul{display: flex;flex-wrap:wrap;gap:20px;}
		.main_partner ul li{box-sizing:border-box;position: relative;width:calc(25% - 15px);border:1px solid var(--point-color03);}
		.main_partner ul li a{display: block;width:100%;height:100%;position: absolute;top:0;left:0;z-index:5;}
		.main_partner ul li .thumb{width:100%;position: relative;height:0;overflow:hidden;padding-bottom:43%;}
		.main_partner ul li .thumb img{width:100%;height:100%;object-fit:cover;position: absolute;top:50%;left:50%;transform:translate(-50%, -50%);transition:all 0.5s;}
		.main_partner ul li .logo{display: flex;align-items: center;justify-content: center;height:110px;}
		.main_partner ul li .logo img{}
		
		@media only screen and (min-width:1024px){
			.main_content .main_bnr ul li:hover{border-color:var(--black-color00);}
			.main_content .main_bnr ul li:hover .thumb img{transform:translate(-50%, -50%) scale(1.1);}
			.main_content .main_bnr ul li:nth-child(1):hover .thumb img{transform:translate(-50%, -50%) scale(1);}
			.main_content .main_bnr ul li:hover p{color:var(--black-color00);}
			
			.main_prd .swipe_arw:hover:before{border-color:var(--black-color00);}
			
			.main_partner ul li:hover{border-color:var(--black-color00);}
			.main_partner ul li:hover .thumb img{transform:translate(-50%, -50%) scale(1.1);}
		}