@charset "utf-8";
/*───────────────────────────────────────────────────────────
	
	header, footer, main 관련 작성 css 파일입니다.

	** 이와 서브페이지 관련 css는 /css/sub.css 에 있습니다.

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

/*───────────────────────────────────────────────────────────
	layout common
───────────────────────────────────────────────────────────*/
	/** PC 일반 **/
		#wrap {position:relative;height:100%;width:100%;margin:0;padding:0;} /* #header 와 #container, #footer 전체 감싸는 영역 */
		#wrap #footer {width:100%;margin:0;}
			/* #container 안의 레이아웃 */
		#contents_wrap {width:1400px;margin:0 auto;padding:0;position:relative;z-index:1;box-sizing:border-box;} /* #container 안의 컨텐츠 감싸는 영역 */
		#contents_wrap #side_box {width:100%;padding:110px 0 0 0;box-sizing:border-box;} /* lnb 감싸는 영역 */
		#contents_wrap #contents_box {width:100%;padding:100px 0 7.2% 0;box-sizing:border-box;} /* 컨텐츠를 감싸는 영역 */
		#contents_wrap #side_box + #contents_box {padding-top:0;} /* lnb와 컨텐츠가 float 일때 사이즈 재설정 */
			/* navigation layout */
		#contents_wrap .nav_wrap {box-sizing:border-box;}
			/* #content */
		#content {width:100%;margin:0;padding:0;text-align:left;box-sizing:border-box;} /* navigation 을 제외한 컨텐츠 */
		#content .sub_content{width:100%;margin:0 auto;background:#fff;box-sizing:border-box;}
		#content .sub_content:after {clear:both;content:"";display:block;}
			/* 컨텐츠 전체 가로 사이즈 */
		.w_custom {width:1400px;text-align:left;margin:0 auto;padding:0;box-sizing:border-box;}
		.main_w_custom{width:100%;box-sizing:border-box;padding-right:120px;padding-left:120px;position: relative;}

	@media only screen and (max-width:1800px) {
		.main_w_custom{padding-right:80px;padding-left:80px;}
	}
	@media only screen and (max-width:1500px) {
		.main_w_custom{padding-right:60px;padding-left:60px;}
		.w_custom{width:100%;padding-right:30px;padding-left:30px;}
		#contents_wrap {width:100%;padding-left:30px;padding-right:30px;}
	}
	@media only screen and (max-width:1300px) {
		.main_w_custom{padding-right:30px;padding-left:30px;}
	}
	@media only screen and (max-width:1217px) {
		body.on {height:100%;overflow:hidden;}
	}
	@media only screen and (max-width:1200px) {
		
	}
	@media only screen and (max-width:1024px) {
		#contents_wrap #side_box {padding: 85px 0 0 0;}
		#contents_wrap #contents_box {padding:8.8% 0 12.4% 0;}
	}
	@media only screen and (max-width:860px) {
		#contents_wrap #side_box {padding: 85px 0 0 0;}
	}
	@media only screen and (max-width:767px) {
		/*.w_custom {padding-left:4% !important;padding-right:4% !important;}*/
		#contents_wrap #side_box {display:none;}
		.sub_goods #contents_wrap #side_box {display:block;padding:0;}
	}
	@media only screen and (max-width:640px) {
		#contents_wrap {padding-right:15px;padding-left:15px;}
		.w_custom{width:100%;padding-left:15px;padding-right:15px;}
		#contents_wrap #contents_box {padding:14.2% 0 20.4% 0;}
		.w_custom{width:100%;padding-right:15px;padding-left:15px;}

		.main_w_custom{padding-right:15px;padding-left:15px;}
	}
	@media only screen and (max-width:479px) {
	}
	@media only screen and (max-width:320px) {
	}

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

	 인트로

───────────────────────────────────────────────────────────*/
	.main_intro{width:100%;height:100%;position: fixed;top:0;left:0;z-index:12;transition:all 0.5s;}
	.main_intro:before{width:100%;height:100%;content:"";background: #fff;position: absolute;top:0;left:0;transition:all 1.5s;transition-delay:3s;}
	.main_intro.fold{opacity:0;z-index:-1;}
	.main_intro .logo{position: absolute;top:50%;left:50%;transform:translate(-50%, -50%);width:68px;height:68px;background:url('../images/skin/intro_logo.png')no-repeat center;background-size:100%;transition:all 2s;}
	.main_intro .txt{position: absolute;top:50%;left:50%;transform:translate(-50%, -20%);text-align: center;opacity:0;transition:all 1.5s;}
	.main_intro .txt h1{font-size:80px;color:#111;font-weight:700;text-transform:uppercase;transition:all 1s;}
	.main_intro .txt p{font-size:40px;color:#000;font-weight:700;transition:all 1s;}

	.main_intro.dn .logo{display: none;}

	.main_intro.fold:before{opacity:0;z-index:-1;}
	.main_intro.effect .logo{width:200%;height:200%;opacity:0;}
	.main_intro .txt.on{transform:translate(-50%, -50%);opacity:1;}
	.main_intro .txt.move{text-align: left;transform:none;top:29px;left:195px;}
	.main_intro .txt.move h1{font-size:30px;}
	.main_intro .txt.move p{font-size:22px;}

	@media only screen and (max-width:1800px){
		.main_intro .txt.move{left:154px;}	
	}
	@media only screen and (max-width:1500px){
		.main_intro .txt.move{left:134px;}	
	}
	@media only screen and (max-width:1400px){
		.main_intro .txt.move{top:36px;}
		.main_intro .txt h1{font-size:60px;}
		.main_intro .txt p{font-size:30px;}
		.main_intro .txt.move h1{font-size:24px;}
		.main_intro .txt.move p{font-size:18px;}
	}
	@media only screen and (max-width:1300px){
		.main_intro .txt.move{left:104px;}		
	}
	@media only screen and (max-width:1024px){
		.main_intro .txt.move{top:24px;}
	}
	@media only screen and (max-width:640px){
		.main_intro .txt.move{top:28px;left:70px;}
		.main_intro .txt h1{font-size:30px;}
		.main_intro .txt p{font-size:20px;}
		.main_intro .txt.move h1{font-size:20px;}
		.main_intro .txt.move p{font-size:16px;}
	}
	@media only screen and (max-width:500px){
		.main_intro .txt.move{top:16px;left:56px;}
		.main_intro .txt h1{font-size:24px;}
		.main_intro .txt p{font-size:16px;}
		.main_intro .txt.move h1{font-size:18px;}
		.main_intro .txt.move p{font-size:14px;}
	}

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

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

───────────────────────────────────────────────────────────*/
	.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;}
	
	#header{position: fixed;width:100%;top:0;left:0;box-sizing:border-box;border-bottom:1px solid rgba(255,255,255,0.2);z-index:10;}
	#header .header_cont{display: flex;align-items: center;justify-content: space-between;height:120px;}
	#header .hd_logo{}
	#header .hd_logo a{display: block;position: relative;box-sizing:border-box;padding-left:75px;background:url('../images/skin/hd_logo_symbol.png')no-repeat;background-position:left top 8px !important;transition:all 0.5s;}
	#header .hd_logo strong{font-size:30px;color:#fff;font-weight:700;text-transform:uppercase;transition:all 0.5s;}
	#header .hd_logo p{font-size:22px;color:#fff;font-weight:700;transition:all 0.5s;}
	
	#header .hd_lnb{display: flex;position: absolute;left:50%;top:50%;transform:translate(-50%, -50%);}
	#header .hd_lnb > li{display: inline-block;vertical-align: top;position: relative;}
	#header .hd_lnb > li + li{margin-left:100px;}
	#header .hd_lnb > li > a{font-size:20px;color:#fff;font-weight:500;letter-spacing:0.01em;transition:all 0.5s;line-height:120px;}
	#header .hd_lnb > li:hover > a{color:#015C98 !important;}
	#header .hd_lnb .dep2{position: absolute;top:100%;left:50%;transform:translate(-50%);box-sizing:border-box;border-radius:0 0 10px 10px;background:#fff;min-width:200px;text-align: center;padding:12px 10px 22px;display: none; box-shadow:3px 3px 5px rgba(0,0,0,0.1);}
	#header .hd_lnb .dep2:before{width:4px;height:4px;content:"";box-sizing:border-box;border-radius:100%;background: #015C98;position: absolute;left:50%;top:-21px;transform:translate(-50%);}
	#header .hd_lnb .dep2 li + li{margin-top:22px;}
	#header .hd_lnb .dep2 li a{font-size:18px;color:#333;font-weight:400;letter-spacing:-0.02em;}
	#header .hd_lnb .dep2 li:hover a{color:#14ACB8;text-decoration: underline;font-weight:500;}
	

	#header .hd_right{}
	#header .hd_right a{display: block;width:32px;height:23px;position: relative;}
	#header .hd_right a span{display: inline-block;width:8px;height:8px;content:"";box-sizing:border-box;background: #fff;position: absolute;border-radius:100%;transition:all 0.5s;}
	#header .hd_right a span:nth-child(1){bottom:0;left:0;}
	#header .hd_right a span:nth-child(2){top:0;left:50%;transform:translate(-50%);}
	#header .hd_right a span:nth-child(3){bottom:0;right:0;}

	/*on*/
	#header.on{background: #fff;border-bottom:1px solid #ddd;}
	#header.on .hd_logo a{background:url('../images/skin/hd_logo_symbol_ov.png')no-repeat;}
	#header.on .hd_logo strong, #header.on .hd_logo p{color:#222;}
	#header.on .hd_lnb li a{color:#222;}
	#header.on .hd_right a span{background: #666;}
	
	/*over*/	
	@media only screen and (min-width:1024px) {
		#header:hover{background: #fff;border-bottom:1px solid #ddd;}
		#header:hover .hd_logo a{background:url('../images/skin/hd_logo_symbol_ov.png')no-repeat;}
		#header:hover .hd_logo strong, #header:hover .hd_logo p{color:#222;}
		#header:hover .hd_lnb li a{color:#222;}
		#header:hover .hd_right a span{background: #666;}

		#header .hd_right a:hover span:nth-child(1){bottom:50%;left:50%;transform:translate(-50%, 50%);}
		#header .hd_right a:hover span:nth-child(2){top:50%;transform:translate(-50%, -50%);}
		#header .hd_right a:hover span:nth-child(3){bottom:50%;right:50%;transform:translate(50%, 50%);}
	}

	@media only screen and (max-width:1400px) {
		#header .hd_logo a{background-position:left top !important;background-size:auto 100% !important;}
		#header .hd_logo strong{font-size:24px;}
		#header .hd_logo p{font-size:18px;}

		#header .hd_lnb > li + li{margin-left:60px;}
		#header .hd_lnb > li > a{font-size:18px;}
		#header .hd_lnb .dep2 li a{font-size:16px;}
	}
	@media only screen and (max-width:1100px) {
		#header .hd_lnb > li + li{margin-left:30px;}
		#header .hd_lnb > li > a{font-size:16px;}
		#header .hd_lnb .dep2 li a{font-size:14px;}
	}
	@media only screen and (max-width:1024px) {
		#header .hd_lnb{display: none;}
		#header .header_cont{height:100px;}
	}
	@media only screen and (max-width:640px) {
		#header .hd_logo a{padding-left:56px;}
		#header .hd_logo strong{font-size:20px;}
		#header .hd_logo p{font-size:16px;}

		#header .hd_right a{width:26px;height:18px;}	
		#header .hd_right a span{width:6px;height:6px;}
	}
	@media only screen and (max-width:500px) {
		#header .header_cont{height:70px;}
		#header .hd_logo a{background-size:auto 78% !important;background-position:left center !important;padding-left:42px;}
		#header .hd_logo strong{font-size:18px;}
		#header .hd_logo p{font-size:14px;}
	}
		

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

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

───────────────────────────────────────────────────────────*/
	/* PC 일반 */
		#aside {top:-100%;right:0;width:100%;transition:0.8s;height:100%;box-sizing:border-box;box-sizing:border-box;position:fixed;background:#fff;z-index:99;opacity:0;}
		#aside.on {top:0%;opacity:1;}

		.aside_bg {left:0px;top:0px;bottom:0;right:0;width:100%;height:100%;background:rgba(0,0,0,0.6);opacity:0;transition:0.8s;z-index:50;position:fixed;display:none;}
		.aside_bg.on {opacity:1;display:block;}
		#aside .aside_box{box-sizing:border-box;background:url('../images/skin/aside_bg.jpg')no-repeat center;background-size:cover;width:100%;height:100%;padding-top:60px;padding-bottom:60px;overflow-x:hidden;overflow-y:auto;}

		#aside .aside_top{display: flex;align-items: center;justify-content: space-between;}
		#aside .aside_logo a{display: block;width:100%;height:100%;}
		#aside .btn_aside_close{width:44px;height:44px;}
		#aside .btn_aside_close a{display: block;width:100%;height:100%;position: relative;}
		#aside .btn_aside_close a span{display: inline-block;width:100%;height:2px;background: #fff;position: absolute;top:50%;}
		#aside .btn_aside_close a span:nth-child(1){transform:rotate(45deg);}
		#aside .btn_aside_close a span:nth-child(2){transform:rotate(-45deg);}
	
		#aside .aside_menu.ver_m{display: none;}
		#aside .aside_menu{display: flex;box-sizing:border-box;padding:0 220px;justify-content: space-between;text-align: center;margin-top:87px;}
		#aside .aside_menu > li{width:calc(25% - 150px);box-sizing:border-box;}
		#aside .aside_menu > li + li{margin-left:200px;}
		#aside .aside_menu > li > a{font-size:36px;color:#fff;font-weight:600;font-family:'Noto Sans KR', sans-serif;letter-spacing:-0.02em;}	 
		#aside .aside_menu > li .dep2{margin-top:32px;}
		#aside .aside_menu > li .dep2 > li + li{margin-top:20px;}
		#aside .aside_menu > li .dep2 > li > a{font-size:22px;color:#fff;font-weight:500;letter-spacing:-0.01em;font-family:'Noto Sans KR', sans-serif;word-break:keep-all;}
		#aside .aside_menu > li .dep3{margin-top:15px;padding-bottom:7px;}
		#aside .aside_menu > li .dep3 li + li{margin-top:8px;}
		#aside .aside_menu > li .dep3 li a{font-size:19px;color:rgba(255,255,255,0.8);font-weight:400;font-family:'Inter', 'Noto Sans KR', sans-serif;}
		
		/*over*/
		@media only screen and (min-width:1024px){
			#aside .aside_menu > li:hover > a{color:#14ACB8;}
			#aside .aside_menu > li .dep2 > li:hover > a{color:#14ACB8;text-decoration:underline;}
			#aside .aside_menu > li .dep3 li:hover a{color:#fff;}
		}

		@media only screen and (max-width:1900px){
			#aside .aside_menu{padding:0 100px;}
			#aside .aside_menu > li{width:calc(25% - 60px);}
			#aside .aside_menu > li + li{margin-left:80px;}
		}
		@media only screen and (max-width:1300px){
			#aside .aside_box{padding-top:30px;padding-bottom:30px;}
			#aside .aside_logo img{height:50px;}
			#aside .btn_aside_close{width:32px;height:32px;}

			#aside .aside_menu{padding:0 30px;}
			#aside .aside_menu > li{width:25%;padding:0 10px;}
			#aside .aside_menu > li + li{margin:0;}
			#aside .aside_menu > li > a{font-size:28px;}
			#aside .aside_menu > li .dep2{margin-top:20px;}
			#aside .aside_menu > li .dep2 > li > a{font-size:20px;}
			#aside .aside_menu > li .dep3 li a{font-size:16px;}

		}
		@media only screen and (max-width:860px){
			#aside .aside_menu{margin-top:50px;}
			#aside .aside_menu > li > a{font-size:24px;}
			#aside .aside_menu > li .dep2 > li + li{margin-top:12px;}
			#aside .aside_menu > li .dep2 > li > a{font-size:18px;}
			#aside .aside_menu > li .dep3{margin-top:10px;padding-bottom:5px;}
			#aside .aside_menu > li .dep3 li + li{margin-top:6px;}
			#aside .aside_menu > li .dep3 li a{font-size:14px;}
		}
		@media only screen and (max-width:767px){
			#aside{width:100%;top:0;right:-100%;}
			#aside.on{right:0;}
			#aside .aside_logo img{height:40px;}
			#aside .btn_aside_close{height:26px;width:26px;}

			#aside .aside_menu.ver_m{display:block;}
			#aside .aside_menu.ver_pc{display: none;}
			#aside .aside_menu li{width:100%;padding:10px 0;position: relative;text-align:left;}
			#aside .aside_menu li + li{margin-top:0 !important;}
			#aside .aside_menu li a{display: block;}
			#aside .aside_menu li ul{margin-top:0 !important;display: none;}
			#aside .aside_menu > li > a{font-size:26px;line-height:40px;}
			#aside .aside_menu > li.on > a{color:#14ACB8;}
			#aside .aside_menu li > .icons{width:40px;height:40px;position: absolute;top:10px;right:0;z-index:5;cursor:pointer;}
			#aside .aside_menu li > .icons:before{width:13px;height:13px;content:"";border:2px solid #fff;border-width:2px 2px 0 0;transform:rotate(135deg);position: absolute;top:7px;left:13px;transition:All 0.5s;}
			#aside .aside_menu li.on > .icons:before{border-color:#14ACB8;transform:rotate(-45deg);top:16px;}
			#aside .aside_menu > li .dep2{box-sizing:border-box;padding:0 15px;}
			#aside .aside_menu > li .dep2 li .icons{width:26px;height:26px;}
			#aside .aside_menu > li .dep2 li .icons:before{width:8px;height:8px;top:5px;left:8px;}
			#aside .aside_menu > li .dep2 li.on .icons:before{top:10px;}
			#aside .aside_menu > li .dep3{margin-top:10px !important;}
			#aside .aside_menu > li .dep3 li{padding:5px 0;}
			#aside .aside_menu > li .dep3 li a{font-size:16px;}
		}
		@media only screen and (max-width:640px){
			#aside .aside_menu{padding:0 15px;}

		}
		@media only screen and (max-width:500px){
			#aside .aside_box{padding-top:20px;padding-bottom:20px;}
			#aside .aside_logo img{height:34px;}
			#aside .btn_aside_close{width:22px;height:22px;}
			
			#aside .aside_menu{margin-top:20px;}
			#aside .aside_menu > li > a{font-size:22px;line-height:30px;}
			#aside .aside_menu > li > .icons{width:30px;height:30px;}
			#aside .aside_menu > li > .icons:before{width:10px;height:10px;top:5px;left:10px;}
			#aside .aside_menu > li.on > .icons:before{top:11px;}

			#aside .aside_menu > li .dep2{margin-top:8px !important;}
			#aside .aside_menu > li .dep2 > li{padding:5px 0;}
			#aside .aside_menu > li .dep2 > li > a{font-size:16px;}
			#aside .aside_menu > li .dep2 li .icons{width:24px;height:24px;}
			#aside .aside_menu > li .dep2 li .icons:before{top:4px;left:7px;}
			#aside .aside_menu > li .dep2 li.on .icons:before{top:9px;}

			#aside .aside_menu > li .dep3{margin-top:6px !important;}
			#aside .aside_menu > li .dep3 li a{font-size:14px;}
		}
	

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

	 FOOTER | outline/footer.html

───────────────────────────────────────────────────────────*/
	#footer{box-sizing:border-box;border-radius:30px 30px 0 0;background:#102533 url('../images/skin/ft_bg.png')no-repeat right 7% center;padding:81px 0 87px;}
	#footer .main_w_custom{display: flex;flex-wrap:wrap;}
	#footer .info_box{box-sizing:border-box;max-width:83%;padding-left:80px;}
	#footer .ft_gnb{font-size:0;}
	#footer .ft_gnb li{display: inline-block;vertical-align: top;}
	#footer .ft_gnb li + li{margin-left:42px;}
	#footer .ft_gnb li a{font-size:16px;color:#ddd;font-weight:400;}
	#footer .ft_gnb li a strong{font-size:inherit;color:#fff;font-weight:400;}

	#footer .info{width:calc(100% + 35px);margin-left:-17.5px;margin-top:34px;}
	#footer .info span{font-size:15px;color:#ddd;font-weight:400;font-family: "NEXON Lv2 Gothic";display: inline-block;margin:0 17.5px;letter-spacing:0;line-height:1.8;}
	#footer .info span a{font-size:inherit;color:inherit;font-weight:inherit;font-family:inherit;}

	#footer .copy{font-size:14px;color:#aaa;font-weight:400;font-family: "NEXON Lv2 Gothic";letter-spacing:0;margin-top:25px;}
	#footer .copy a{font-size:inherit;color:inherit;font-weight:inherit;font-family:inherit;display: inline-block;margin-left:31px;}

	.ft_btn_top{position: fixed;width:60px;height:60px;box-sizing:border-box;border-radius:100%;background: #14ACB8;box-shadow:0 0 20px 0 rgba(0,0,0,0.15);right:33px;bottom:50px;opacity:0;z-index:-1;transition:all 0.5s;cursor:pointer;}		
	.ft_btn_top.on{z-index:10;opacity:1;}
	.ft_btn_top span{display:flex;width:100%;height:100%;align-items: center;justify-content: center;}

	@media only screen and (max-width:1400px) {
		#footer{padding:50px 0 50px;background-size:auto 100%;background-position:right 4% center;}
		#footer .info_box{width:calc(100% - 236px);padding-left:36px;max-width:100%;}
		#footer .info{width:calc(100% + 20px);margin-left:-10px;}
		#footer .info span{font-size:14px;margin:0 10px;}
		#footer .info br{display: none;}
	}
	@media only screen and (max-width:1024px) {
		.ft_btn_top{width:50px;height:50px;right:20px;bottom:30px;;}
		.ft_btn_top img{max-height:45%;}
	}
	@media only screen and (max-width:860px) {
		#footer{background:#102533;}
		#footer .ft_logo{width:180px;}
		#footer .ft_gnb li a{font-size:15px;}
		#footer .info_box{width:calc(100% - 180px);}
		#footer .copy a{display: block;margin:5px 0 0;}
	}
	@media only screen and (max-width:640px) {
		#footer{border-radius:20px 20px 0 0}
		#footer .ft_gnb li + li{margin-left:20px;}
		#footer .info_box{width:100%;padding:20px 0 0;}
		#footer .info{margin-top:25px;}
		#footer .copy{margin-top:25px;}

		.ft_btn_top{width:40px;height:40px;}
	}
	@media only screen and (max-width:500px) {
		#footer .ft_gnb li a{font-size:13px;}
		#footer .info span{font-size:13px;}
		#footer .copy{font-size:12px;}
	}

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

	 MAIN | index.html

───────────────────────────────────────────────────────────*/
	/* visual */
		#wrap .main_visual {position:relative;width:100%;margin:0;height:980px;background:#000;}
		#wrap .main_visual .slick-slide {overflow:hidden;position:relative;text-align:center;height:980px;border:none;min-height:100% !important;}
		.main_visual .slick-slide > a {display:inline-block;height:100%;width:100%;max-width:1920px;margin:0 auto;text-align:Center;position:absolute;left:0;top:0;outline:0;transition:transform 2s ease-in-out;transform:scale(1);opacity:0.5;}
		.main_visual .txt_box {width:100%;text-align:center;transform:translate(-50%, -50%);position:absolute;left:50%;top:50%;font-size:0;}
		.main_visual .txt_box h3,
		.main_visual .txt_box p,
		.main_visual .txt_box div {opacity:0;transform:translateY(100px);transition:all 0.5s;}
		.main_visual .txt_box h3{font-size:80px;color:#fff;font-weight:700;letter-spacing:0.01em;}
		.main_visual .txt_box p{font-size:30px;color:#fff;font-weight:500;margin-top:26px;word-break:keep-all;}
		.main_visual .txt_box div{display: flex;align-items: center;justify-content: center;margin-top:50px;}
		.main_visual .txt_box div span{display: inline-flex;box-sizing:border-box;align-items: center;justify-content: center;width:450px;height:60px;border-radius:30px;background:rgba(0,0,0,0.4);font-size:24px;color:#fff;font-weight:500;letter-spacing:-0.03em;}
		.main_visual .txt_box div span + span{margin-left:20px;}

		.main_visual .slick-arrow{position: absolute;font-size:0;width:110px;height:110px;z-index:5;top:44.5%;}
		.main_visual .slick-prev{left:93px;}
		.main_visual .slick-next{right:93px;}
		.main_visual .slick-arrow:before{width:60%;height:60%;content:"";border:1px solid #fff;border-width:2px 2px 0 0;position: absolute;opacity:0.57;top:20px;}
		.main_visual .slick-prev:before{transform:rotate(-135deg);left:40px;}
		.main_visual .slick-next:before{transform:rotate(45deg);right:40px;}

		.main_visual .scroll_down{position: absolute;left:50%;bottom:40px;transform:translate(-50%);text-align: center;cursor:pointer;}
		.main_visual .scroll_down span{font-size:16px;color:#fff;font-weight:400;letter-spacing:0;box-sizing: border-box;padding-bottom:41px;display: block;position: relative;}
		.main_visual .scroll_down span:before{width:18px;height:30px;content:"";box-sizing:border-box;border-radius:8px;border:1px solid #fff;position: absolute;bottom:-15px;left:50%;transform:translate(-50%, -50%);}
		.main_visual .scroll_down span:after{width:4px;height:4px;content:"";box-sizing:border-box;border-radius:100%;background: #fff;position: absolute;left:50%;transform:translate(-50%, -50%);bottom:44%;animation:scroll 1.5s ease-in Infinite Alternate;}

		@keyframes scroll{
			0%{bottom:30%;}
			50%{bottom:8%;}
			100%{bottom:30%;}
		} 

		/*active*/
			.main_visual .active > a{transform:scale(1.05);}
			.main_visual .active .txt_box h3,
			.main_visual .active .txt_box p,
			.main_visual .active .txt_box div{opacity:1;transform:translateY(0);transition:all 0.5s;}
			.main_visual .active .txt_box p,
			.main_visual .active .txt_box div{transition-delay:0.3s;}

	/*product*/
		.main_prd{padding-top:120px;padding-bottom:160px;background:url('../images/skin/main_prd_bg.png')no-repeat right 62% top 19%;background-size:auto 70%;}
		.main_prd > a{position: absolute;top:-80px;}
		.main_prd .prd_wrap{position: relative;}
		.main_prd .main_title{position: absolute;top:18px;left:0;}
		.main_prd .main_title span{font-size:24px;color:#015C98;font-weight:500;letter-spacing:0;}
		.main_prd .main_title h3{font-size:70px;color:#000;font-weight:500;letter-spacing: 0.02em;margin-top:30px;}
		.main_prd .main_title p{font-size:70px;color:#222;font-weight:700;letter-spacing:0.01em;opacity:0.03;margin-top:39px;line-height:1.3;}

		.main_prd .prd_list{display: flex;flex-wrap:wrap;width:calc(100% + 20px);margin-left:-10px;}
		.main_prd .prd_list li{box-sizing:border-box;position: relative;margin:0 10px 20px;width:calc(25% - 20px);}
		.main_prd .prd_list li a{display: block;width:100%;height:100%;position: relative;border-radius:30px;box-sizing:border-box;}
		.main_prd .prd_list li a:before{width:100%;height:100%;content:"";background:url('../images/skin/prd_bg.png')no-repeat center;background-size:cover;box-shadow: 0px 0px 30px 0px rgba(0, 0, 0, 0.25);border:1px solid #222;box-sizing:border-box;border-radius:30px;position: absolute;top:0;left:0;z-index:-1;opacity:0;transition:all 0.5s;}
		.main_prd .prd_list li .thumb{width:100%;height:0;padding-bottom:100%;position: relative;overflow:hidden;border-radius:30px;box-sizing:border-box;background: #f5f5f5;}
		.main_prd .prd_list li .thumb img{width:100%;position: absolute;top:50%;left:50%;transform:translate(-50%, -50%);transition:all 0.5s;}
		.main_prd .prd_list li .txt{width:100%;text-align: center;position: absolute;left:0;bottom:45px;z-index:6;transition:all 0.5s;}
		.main_prd .prd_list li .txt .logo{opacity:0;margin-bottom:30px;transition:all 0.5s;}
		.main_prd .prd_list li .txt p{font-size:26px;color:#000;font-weight:500;letter-spacing:0.01em;position: relative;transition:all 0.5s;}
		.main_prd .prd_list li .txt p:before{opacity:0;width:36px;height:20px;content:"";background:url('../images/skin/prd_more.png')no-repeat center;position: absolute;bottom:0;left:45%;transform:translate(-50%);transition:all 0.5s;}

	/*contact*/
		.main_wide{transform:translateY(30px);position: relative;}
		.main_wide .wide_bnr{position: relative;overflow:hidden;box-sizing:border-box;border-radius:40px 40px 0 0;margin:0 auto;}
		.main_wide .wide_bnr .thumb{content:"";position: absolute;top:0;left:50%;transform:translate(-50%);background:url('../images/skin/contact_bg.jpg')no-repeat center;background-size:cover;width:100%;height:100%;box-sizing:border-box;border-radius:40px 40px 0 0;}
		.main_wide .txt_box{text-align: center;position: relative;padding:148px 0;}
		.main_wide .txt_box .logo{margin:0 auto;}
		.main_wide .txt_box h3{font-size:70px;color:#fff;font-weight:700;margin-top:40px;}
		.main_wide .txt_box .cs_info{display: flex;justify-content: center;margin-top:25px;}
		.main_wide .txt_box .cs_info span{font-size:22px;color:#fff;font-weight:500;display: inline-block;letter-spacing:0.01em;word-break:keep-all;}
		.main_wide .txt_box .cs_info span + span{margin-left:60px;}
		.main_wide .txt_box a{display: inline-flex;align-items: center;justify-content: center;box-sizing:border-box;width:240px;height:70px;text-align: center;position: relative;border-radius:35px;font-size:22px;color:#015C98;font-weight:500;letter-spacing:0.01em;background: #fff;margin-top:60px;}
		.main_wide .txt_box a:before{width:0;height:calc(100% + 2px);content:"";box-sizing:border-box;border-radius:inherit;position: absolute;background: #015C98;z-index:1;top:-1px;left:-1px;transition:width 0.5s;}
		.main_wide .txt_box a span{z-index:3;position: relative;font-size:inherit;color:inherit;font-weight:inherit;}
		.main_wide .txt_box a:after{width:0;height:14px;content:"";background: url('../images/skin/arw_wh.png')no-repeat center;display: inline-block;vertical-align: middle;transition:all 0.5s;position: relative;z-index:3;}

	/*over*/
	@media only screen and (min-width:1024px) {
		/*visual*/
			.main_visual .slick-arrow:hover:before{opacity:1;}

		/*prodcut*/
			.main_prd .prd_list li:hover a:before{z-index:5;opacity:1;transition:all 0.5s;}
			.main_prd .prd_list li:hover .thumb img{top:60%;}
			.main_prd .prd_list li:nth-child(4):hover .thumb img{top:50%;}
			.main_prd .prd_list li:hover .txt{bottom:50%;transform:translateY(50%);}
			.main_prd .prd_list li:hover .txt .logo{opacity:1;}
			.main_prd .prd_list li:hover .txt p{padding-bottom:62px;}
			.main_prd .prd_list li:hover .txt p:before{opacity:1;left:50%;}

		/*contact*/
			.main_wide .txt_box a:hover{color:#fff;}
			.main_wide .txt_box a:hover:before{width:calc(100% + 2px);}
			.main_wide .txt_box a:hover:after{width:28px;margin-left:22px;}
	}
	@media (min-width:1024px) and (max-width:1200px) {
		.main_prd .prd_list li:hover .txt p{padding-bottom:30px;}
	}
	@media only screen and (max-width:1700px) {
		/*product*/
			.main_prd .main_title p{font-size:60px;margin-top:10px;}
	}
	@media only screen and (max-width:1400px) {
		/*visual*/
			.main_visual .slick-prev{left:20px;}
			.main_visual .slick-next{right:20px;}

			.main_visual .txt_box h3{font-size:70px;}
			.main_visual .txt_box p{font-size:24px;}
			.main_visual .txt_box div span{width:370px;font-size:20px;}

		/*prodcut*/
			.main_prd {padding-top:90px;padding-bottom:120px;}
			.main_prd .main_title h3{font-size:60px;margin-top:5px;}
			.main_prd .main_title p{font-size:50px;margin-top:5px;}
			
			.main_prd .prd_list li .txt .logo{margin-left:auto;margin-right:auto;width:50%;}
			.main_prd .prd_list li .txt p{font-size:20px;}
	}
	@media only screen and (max-width:1200px) {
		/*visual*/
			#wrap .main_visual, #wrap .main_visual .slick-slide{height:75vw;}
			.main_visual .txt_box h3{font-size:60px;}
			.main_visual .txt_box div{margin-top:25px;}
			.main_visual .txt_box div span{width:300px;font-size:18px;height:50px;}

			.main_visual .slick-arrow{width:80px;height:80px;}
			.main_visual .slick-arrow:before{top:14px;}
			.main_visual .slick-prev:before{left:30px;}
			.main_visual .slick-next:before{right:30px;}

		/*product*/
			.main_prd .prd_list li .txt{bottom:20px;}
			.main_prd .prd_list li .txt .logo{margin-bottom:15px;}

		/*contact*/
			.main_wide .txt_box{padding:100px 0;}
			.main_wide .txt_box .logo{width:75px;}
			.main_wide .txt_box h3{font-size:58px;margin-top:30px;}
			.main_wide .txt_box .cs_info span{font-size:20px;}
			.main_wide .txt_box .cs_info span + span{margin-left:35px;}
			.main_wide .txt_box a{width:200px;height:60px;font-size:20px;margin-top:40px;}
	}
	@media only screen and (max-width:1024px) {
		/*visual*/
			.main_visual .slick-arrow{display: none !important;}
			.main_visual .txt_box{box-sizing:border-box;padding:0 30px;width:100%;}
			.main_visual .txt_box div span{width:calc(50% - 10px);}

		/*product*/
			.main_prd .main_title{position: static;}
			.main_prd .prd_list{margin-top:40px;}
			.main_prd .prd_list li:nth-child(-n+2){display: none;}
			.main_prd .prd_list li{width:calc(33.3333% - 20px);}

		/*contact*/
			.main_wide .txt_box .cs_info{flex-wrap:wrap;}
			.main_wide .txt_box .cs_info span{width:100%;}
			.main_wide .txt_box .cs_info span + span{margin:15px 0 0;}
	}
	@media only screen and (max-width:860px) {
		/*visual*/
			#wrap .main_visual, #wrap .main_visual .slick-slide{height:90vw;}
			.main_visual .txt_box h3{font-size:50px;}
			.main_visual .txt_box p{font-size:20px;margin-top:20px;}
			.main_visual .txt_box div span{width:calc(50% - 5px);}
			.main_visual .txt_box div span + span{margin-left:10px;}

		/*prodcut*/
			.main_prd .main_title span{font-size:20px;}
			.main_prd .main_title h3{font-size:50px;}
			.main_prd .main_title p{font-size:40px;}

			.main_prd .prd_list li .txt{box-sizing:border-box;padding:0 15px;}
			.main_prd .prd_list li .txt p{font-size:16px;}
	}
	@media only screen and (max-width:640px) {
		/*visual*/
			#wrap .main_visual, #wrap .main_visual .slick-slide{height:100vw;}	
			.main_visual .txt_box{padding:0 15px;}
			.main_visual .txt_box h3{font-size:40px;}
			.main_visual .txt_box div{flex-wrap:wrap;}
			.main_visual .txt_box div span{width:100%;}
			.main_visual .txt_box div span + span{margin:10px 0 0 0;}

		/*product*/
			.main_prd{padding-top:60px;padding-bottom:90px;}
			.main_prd .main_title span{font-size:18px;}
			.main_prd .main_title h3{font-size:40px;}
			.main_prd .main_title p{font-size:32px;}

			.main_prd .prd_list{width:calc(100% + 15px);margin-left:-7.5px;}
			.main_prd .prd_list li{margin:0 7.5px 20px;width:calc(50% - 15px);}
			
			.main_prd .prd_list li a, .main_prd .prd_list li .thumb{border-radius:10px;}

		/*contact*/
			.main_wide .txt_box .logo{width:56px;}
			.main_wide .txt_box h3{font-size:40px;margin-top:20px;}
			.main_wide .txt_box .cs_info{margin-top:10px;}
			.main_wide .txt_box .cs_info span{font-size:18px;}
			.main_wide .txt_box .cs_info span + span{margin-top:10px;}
			.main_wide .txt_box a{width: 160px;height: 50px;font-size: 16px;margin-top: 30px;}

	}
	@media only screen and (max-width:500px) {
		/*visual*/
			#wrap .main_visual, #wrap .main_visual .slick-slide{height:100vh;}	
			.main_visual .txt_box h3{font-size:34px;}
			.main_visual .txt_box div span{font-size:16px;height:46px;}
			.main_visual .txt_box p{font-size:18px;margin-top:16px;}

			.main_visual .scroll_down{bottom:20px;}
			.main_visual .scroll_down span{font-size:14px;}

		/*product*/
			.main_prd{padding-top:45px;padding-bottom:80px;}
			.main_prd .main_title span{font-size:16px;}
			.main_prd .main_title h3{font-size:32px;}
			.main_prd .main_title p{font-size:24px;}	

			.main_prd .prd_list{margin-top:26px;}
			.main_prd .prd_list li .txt{padding:0 5px;bottom:10px;}
			.main_prd .prd_list li .txt p{font-size:14px;}

		/*contact*/
			.main_wide .wide_bnr{border-radius:20px 20px 0 0;}
			.main_wide .wide_bnr .thumb{border-radius:20px 20px 0 0;}		
			.main_wide .txt_box{padding:70px 15px;}
			.main_wide .txt_box .logo{width:45px;}
			.main_wide .txt_box h3{font-size:32px;}
			.main_wide .txt_box .cs_info span{font-size:16px;}

	}