@charset "utf-8";


@media (min-width: 1200px) {
	
	/* 헤더 */
	header {z-index:9999; position:absolute; top:0; width:100%; height:120px; overflow:hidden; transition:var(--ani);}
	header:after {width:100%; height:1px; background:var(--gray1); left:0; top:120px; position:absolute; display:block; content:'';}
	header .header-wrap {height:100%; display:flex; position:relative;}
	header h1.logo {height:120px; position:relative; z-index:9; display:flex; align-items:center;}

	header .headAside {display:flex; height:120px; gap:30px; align-items:center;}
	header .headAside a {width:35px; height:35px; line-height:46px; background:0 50% no-repeat; overflow:hidden; white-space:nowrap;}
	header .headAside a.kakao {background-image:url(/images/common/icon_aside_chat_white.svg);}
	header .headAside a.item {background-image:url(/images/common/icon_aside_item_white.svg);}
	header .headAside a.youtube {background-image:url(/images/common/icon_aside_youtube_white.svg);}
	header .headAside a.time {background-image:url(/images/common/icon_aside_time_white.svg);}
	header .headAside a.search {background-image:url(/images/common/icon_aside_search_white.svg);}
	header .headAside a.menu {background-image:url(/images/common/icon_aside_menu_white.svg);}
	header .headAside a span {width:0; opacity:0; transition:var(--ani);}
	header .headAside a.hover:hover span {width:auto; opacity:1;}
	header .headAside a.hover:hover {width:auto; height:46px; padding:0 15px 0 60px; background-color:var(--base1); color:#fff; background-position:15px 50%;border-radius:100px;}
	
	
	/* .headerH {height:100%;} */

	/* gnb */
	nav.pc {padding-left:80px; height:100%; overflow:hidden;flex-grow:1;}
	nav.pc .gnb {height:100%; display:flex;}
	nav.pc .gnb .dep1 {height:120px; display:flex; align-items:center;}
	nav.pc .gnb .dep1>li {position:relative;}
	nav.pc .gnb .dep1>li+li {padding-left:40px; margin-left:40px;}
	nav.pc .gnb .dep1>li+li:before {width:1px; height:16px; background:var(--gray2); left:0; top:6px; position:absolute; display:block; content:'';}
	nav.pc .gnb .dep1>li>a {padding:10px 0; color: #fff;font-size: var(--fs22);font-weight: 600;line-height: normal; position:relative;}
	nav.pc .gnb .dep1>li>a:before {width:5px; height:5px; background:var(--base1); border-radius:50%; left:50%; bottom:0; position:absolute; display:block; content:''; opacity:0; transform:translateX(-50%);}
	nav.pc .gnb .dep1>li:hover>a {color:var(--base1);}
	nav.pc .gnb .dep1>li.on>a {color:var(--base1);}
	nav.pc .gnb .dep1>li.on>a:before {opacity:1;}
	
	nav.pc .gnb .dep2 {position:absolute; top:110px;}
	nav.pc .gnb .dep2>li {}
	nav.pc .gnb .dep2>li+li {}
	nav.pc .gnb .dep2>li a {border-bottom:2px solid transparent; color: #333; font-size: var(--fs17); line-height: 200%; display:inline-block;}
	nav.pc .gnb .dep2>li:hover a {color:var(--base1);}
	nav.pc .gnb .dep2>li.on a {color:var(--base1); border-color:var(--base1);}
	
	
	/* 헤더온 */
	header.on {height:310px; box-shadow: 0 10px 10px 0 rgba(0, 0, 0, 0.15);background:#fff;}
	header.on h1.logo img.off {display:none;}
	header.on h1.logo img.on {display:block;}
	header.on nav {}
	header.on nav .gnb {}
	header.on nav .gnb .dep1 {}
	header.on nav .gnb .dep1>li {}
	header.on nav .gnb .dep1>li>a {color:#000;}
	header.on nav .gnb .dep1>li:hover>a {color:var(--base1);}
	header.on nav .gnb .dep1>li.on>a {color:var(--base1);}
	
	header.on .headAside a.kakao {background-image:url(/images/common/icon_aside_chat.svg);}
	header.on .headAside a.item {background-image:url(/images/common/icon_aside_item.svg);}
	header.on .headAside a.youtube {background-image:url(/images/common/icon_aside_youtube.svg);}
	header.on .headAside a.time {background-image:url(/images/common/icon_aside_time.svg);}
	header.on .headAside a.search {background-image:url(/images/common/icon_aside_search.svg);}
	header.on .headAside a.menu {background-image:url(/images/common/icon_aside_menu.svg);}
	
	header .gnbCover {background:rgba(0,0,0,.9); width:100%; height:100vh; left:0; top:0; position:absolute; }
	
	nav.sitemap {
		flex-direction:column;
		width:100%; height:100vh; position:fixed; left:50%; top:0; z-index:999999; transform:translateX(-50%);
	}
	nav.sitemap.active {}
	
	nav.sitemap .sitemap-wrap {display:flex;flex-direction:column; align-items:center; justify-content:center; gap:100px; height:100%; position:relative; z-index:1;}
	nav.sitemap .sitemap-tit {width:100%; height:60px; display:flex; justify-content:space-between; align-items:center;}
	nav.sitemap .sitemap-tit p {font-size:var(--fs60); color:#fff; font-weight:700;}
	nav.sitemap .sitemap-tit .gnbClose {width:50px; height:50px; border:1px solid var(--gray3); background:url(/images/common/icon_nav_close.png)center /20px no-repeat; border-radius:50%;}
	nav.sitemap .sitemap-tit .gnbClose:hover {transform:rotate(180deg); transition:var(--ani);}
	
	nav.sitemap .gnb {width:100%;}
	nav.sitemap .gnb .dep1 {display:flex; gap:120px;}
	nav.sitemap .gnb .dep1>li {width:calc((100% - 360px)/4); display:flex; gap:50px; flex-direction:column;}
	nav.sitemap .gnb .dep1>li>a {padding:0; color:#fff; line-height:1.3; font-size:var(--fs36); font-weight:700; border-bottom:3px solid transparent; display:block; align-self:start;}
	nav.sitemap .gnb .dep1>li>a:hover,
	nav.sitemap .gnb .dep1>li.on>a {border-color:#fff; color:#fff;}
	
	nav.sitemap .gnb .dep2 {display:flex; gap:30px; flex-direction:column;}
	nav.sitemap .gnb .dep2>li {}
	nav.sitemap .gnb .dep2>li>a {color:#fff; padding:0 0 0 16px; line-height:1.4; display:inline-block; font-size:var(--fs18); position:relative; opacity:.6;}
	nav.sitemap .gnb .dep2>li>a:before {width:4px; height:4px; background:#fff; border-radius:50%; left:0; top:10px; position:absolute; display:block; content:'';}
	nav.sitemap .gnb .dep2>li>a:hover,
	nav.sitemap .gnb .dep2>li.on>a {opacity:1; color:#fff;}
	nav.sitemap .gnb .dep2>li>a:hover:before,
	nav.sitemap .gnb .dep2>li.on>a:before {background:#fff;}
	
	.sub-visual {position:relative; height:500px; background:url(/images/common/coverImg_01.jpg)center /cover no-repeat;}
	.sub-visual .cover {width:100%; height:100%; background:rgba(0,0,0,0.7); left:0;top:0; position:absolute;}
	.sub-visual-wrap {padding:300px 0 0; display:flex; align-items:end; justify-content:space-between; position:relative;}
	.sub-visual-text {}
	.sub-visual-text p {color:var(--base1); font-size:var(--fs24); font-weight:600; line-height:1.2;}
	.sub-visual-text h2 {padding:15px 0 0; color:#fff; font-size:var(--fs60); font-weight:800; line-height:1;}
	.sub-visual-nav {display:flex; gap:10px; align-items:center; opacity:.8;}
	.sub-visual-nav p {color:#fff; line-height:1.2;}
	
	.lnb {background:var(--base1);}
	.lnb-wrap {display:flex; border-left:1px solid var(--gray5);}
	.lnb-home {width:60px; height:60px;border-right:1px solid var(--gray5);}
	.lnb-home img {width:100%; height:100%; object-fit:scale-down;}
	.lnb-menu {position:relative; border-right:1px solid var(--gray5);}
	.lnb-menu>a {padding:0 20px; width:240px; color:#fff; line-height:60px; background:url(/images/common/icon_lnb_arrow.svg)calc(100% - 15px) 50% no-repeat; display:block;}
	.lnb-menu ul {width:100%; display:none; left:0; top:60px; background:#fff; position:absolute; box-shadow:0 0 10px rgba(0,0,0,.1);}
	.lnb-menu:hover ul {display:block;}
	.lnb-menu ul li {}
	.lnb-menu ul li a {padding:10px 20px; display:block;}
	.lnb-menu ul li+li a {border-top:1px solid var(--gray3);}
	.lnb-menu ul li a:hover {background:#f5f5f5;}
	.lnb-menu ul li.on a {color:var(--base1); font-weight:500;}
	
	/* 검색 */
	body .searchBox {display:none;width:100%; position:fixed; left:0; top:0;z-index:9999;}
	body .searchBox.active {display:block;}
	body .searchBox .cover {width:100%; height:100vh; background:#000; opacity:.7; left:0; top:0; position:absolute;}
	body .searchBox-wrap {width:100%; background:var(--base1);  position:relative; z-index:9;}
	body .searchBox-close {position:absolute; right:50px; top:50px; cursor:pointer; }
	body .searchBox-close img {width:34px;transition:var(--ani);}
	body .searchBox-close:hover img {transform:rotate(90deg);}
	body .searchBox-con {}
	body .searchBox-form {padding:50px 0; display:flex; flex-direction:column; gap:20px; align-items:center; justify-content:center;}
	body .searchBox-form h2 {font-size:var(--fs27); font-weight:500; color:#fff; line-height:1;}
	body .searchBox-input {width:500px; height:56px; max-width:100%; border:1px solid #e5e5e5; position:relative;}
	body .searchBox-input input {padding:0 20px; width:calc(100% - 60px); height:100%; border:0; background:transparent; color:#fff;}
	body .searchBox-input input::placeholder {color:#fff;}
	body .searchBox-input input:focus {border:0; outline:0;}
	body .searchBox-input button {width:60px; height:100%; position:absolute; right:0; top:0;}
	body .searchBox-input button img {width:100%; height:100%; object-fit:scale-down;}
	
	

}





@media (max-width: 1199px) {
	/*헤더*/
	.headerH {}
	header {z-index:999; width:100%; left:0; top:0; position:absolute;}
	header .gnbView {width:60px; height:60px; background:url(/images/common/icon_aside_menu_white.svg)0 50% no-repeat;right:0; top:0;  position:absolute;}
	header .searchBtn {width:60px; height:60px; background:url(/images/common/icon_aside_search_white.svg)0 50% no-repeat;right:60px; top:0;  position:absolute;}
	/* header .gnbCover {background:rgba(0,0,0,.5); width:100%; height:100vh; left:0; top:0; position:absolute;} */
	
	header .headAside {display:flex; flex-direction:column; gap:10px; align-items:center; position:fixed; right:20px; bottom:90px;}
	header .headAside a {width:50px; height:50px; line-height:46px; background:#333 50% /28px no-repeat; overflow:hidden; white-space:nowrap; border-radius:50%;}
	header .headAside a.kakao {background-image:url(/images/common/icon_aside_chat_white.svg);}
	header .headAside a.item {background-image:url(/images/common/icon_aside_item_white.svg);}
	header .headAside a.youtube {background-image:url(/images/common/icon_aside_youtube_white.svg);}
	header .headAside a.time {background-image:url(/images/common/icon_aside_time_white.svg);}
	header .headAside a.search {background-image:url(/images/common/icon_aside_search_white.svg);}
	header .headAside a.menu {background-image:url(/images/common/icon_aside_menu_white.svg);}
	header .headAside a span {display:none;}
	
	header h1 {height:60px; display:flex; align-items:center;}
	header h1 a {height:100%; display:flex; align-items:center;}
	header h1 a img {height:23px}
	
	header .gnbCover {background:rgba(0,0,0,.9); width:100%; height:100vh; left:0; top:0; position:absolute; }
	
	/*gnb*/
	nav.sitemap {
		flex-direction:column;
		width:100%; height:100vh; position:fixed; left:50%; top:0; z-index:999999; transform:translateX(-50%);
	}
	nav.sitemap.active {}
	
	nav.sitemap .sitemap-wrap {padding:50px 30px; display:flex;flex-direction:column; gap:80px; justify-content: center; height:100%; position:relative; z-index:1;}
	nav.sitemap .sitemap-tit {width:100%; height:60px; display:flex; gap:100px; justify-content: center; align-items:center;}
	nav.sitemap .sitemap-tit p {font-size:var(--fs60); color:#fff; font-weight:700;}
	nav.sitemap .sitemap-tit .gnbClose {
		width:46px; height:46px; border:1px solid var(--gray3); background:url(/images/common/icon_nav_close.png)center /20px no-repeat; border-radius:50%;
		position:absolute; right:30px; top:30px;
	}
	nav.sitemap .sitemap-tit .gnbClose:hover {transform:rotate(180deg); transition:var(--ani);}
	
	nav.sitemap .gnb {width:100%;}
	nav.sitemap .gnb .dep1 {display:flex; gap:30px;}
	nav.sitemap .gnb .dep1>li {width:calc((100% - 90px)/4); display:flex; flex-direction:column;}
	nav.sitemap .gnb .dep1>li>a {padding:0; color:#fff; line-height:1.3; font-size:var(--fs36); font-weight:700; border-bottom:3px solid transparent; display:block; align-self:start;}
	nav.sitemap .gnb .dep1>li>a:hover,
	nav.sitemap .gnb .dep1>li.on>a {border-color:#fff; color:#fff;}
	
	nav.sitemap .gnb .dep2 {display:flex; gap:10px; flex-direction:column;}
	nav.sitemap .gnb .dep2>li {}
	nav.sitemap .gnb .dep2>li>a {color:#fff; padding:0 0 0 16px; line-height:1.4; display:inline-block; font-size:var(--fs18); position:relative; opacity:.6; white-space:nowrap;}
	nav.sitemap .gnb .dep2>li>a:before {width:4px; height:4px; background:#fff; border-radius:50%; left:0; top:10px; position:absolute; display:block; content:'';}
	nav.sitemap .gnb .dep2>li>a:hover,
	nav.sitemap .gnb .dep2>li.on>a {opacity:1; color:#fff;}
	nav.sitemap .gnb .dep2>li>a:hover:before,
	nav.sitemap .gnb .dep2>li.on>a:before {background:#fff;}
	
	
	.sub-visual {position:relative; height:300px; background:url(/images/common/coverImg_01.jpg)center /cover no-repeat;}
	.sub-visual .cover {width:100%; height:100%; background:rgba(0,0,0,0.7); left:0;top:0; position:absolute;}
	.sub-visual-wrap {padding:160px 30px 0; display:flex; align-items:end; justify-content:space-between; position:relative;}
	.sub-visual-text {}
	.sub-visual-text p {color:var(--base1); font-size:var(--fs24); font-weight:600; line-height:1.2;}
	.sub-visual-text h2 {padding:15px 0 0; color:#fff; font-size:var(--fs60); font-weight:800; line-height:1;}
	.sub-visual-nav {display:flex; gap:10px; align-items:center; opacity:.8;}
	.sub-visual-nav p {color:#fff; line-height:1.2;}
	
	.lnb {background:var(--base1);}
	.lnb-wrap {display:flex; border-left:1px solid var(--gray5);}
	.lnb-home {width:60px; height:60px;border-right:1px solid var(--gray5);}
	.lnb-home img {width:100%; height:100%; object-fit:scale-down;}
	.lnb-menu {position:relative; border-right:1px solid var(--gray5);}
	.lnb-menu>a {padding:0 20px; width:240px; color:#fff; line-height:60px; background:url(/images/common/icon_lnb_arrow.svg)calc(100% - 15px) 50% no-repeat; display:block;}
	.lnb-menu ul {width:100%; display:none; left:0; top:60px; background:#fff; position:absolute; box-shadow:0 0 10px rgba(0,0,0,.1);}
	.lnb-menu:hover ul {display:block;}
	.lnb-menu ul li a {padding:10px 20px; display:block;}
	.lnb-menu ul li+li a {border-top:1px solid var(--gray3);}
	.lnb-menu ul li a:hover {background:#f5f5f5;}
	.lnb-menu ul li.on a {color:var(--base1); font-weight:500;}
	
	/* 검색 */
	body .searchBox {display:none;width:100%; position:fixed; left:0; top:0;z-index:9999;}
	body .searchBox.active {display:block;}
	body .searchBox .cover {width:100%; height:100vh; background:#000; opacity:.7; left:0; top:0; position:absolute;}
	body .searchBox-wrap {width:100%; background:var(--base1);  position:relative; z-index:9;}
	body .searchBox-close {position:absolute; right:50px; top:50px; cursor:pointer; }
	body .searchBox-close img {width:34px;transition:var(--ani);}
	body .searchBox-close:hover img {transform:rotate(90deg);}
	body .searchBox-con {}
	body .searchBox-form {padding:50px 0; display:flex; flex-direction:column; gap:20px; align-items:center; justify-content:center;}
	body .searchBox-form h2 {font-size:var(--fs27); font-weight:500; color:#fff; line-height:1;}
	body .searchBox-input {width:500px; height:56px; max-width:100%; border:1px solid #e5e5e5; position:relative;}
	body .searchBox-input input {padding:0 20px; width:calc(100% - 60px); height:100%; border:0; background:transparent; color:#fff;}
	body .searchBox-input input::placeholder {color:#fff;}
	body .searchBox-input input:focus {border:0; outline:0;}
	body .searchBox-input button {width:60px; height:100%; position:absolute; right:0; top:0;}
	body .searchBox-input button img {width:100%; height:100%; object-fit:scale-down;}
	
	
	
	
	
}

@media (max-width: 767px) {
	
	header h1 a img {height:19px}
	header .gnbView {background-size:30px;}
	header .searchBtn {background-size:30px; right:50px;}
	
	header .headAside {bottom:75px; gap:5px;}
	header .headAside a {width:40px; height:40px; background-size:24px;}
	
	nav.sitemap .sitemap-wrap {gap:40px; justify-content:start;}
	nav.sitemap .sitemap-tit .gnbClose {width:42px; height:42px;}
	
	
	nav.sitemap .gnb .dep1 {flex-direction:column;align-items: center;}
	nav.sitemap .gnb .dep1>li {gap:10px; align-items: center;}
	
	nav.sitemap .gnb .dep2 {align-items: center;}
	
	.sub-visual {height:auto;}
	.sub-visual-wrap {padding:120px 30px 30px;flex-direction:column; gap:10px; align-items:start;}
	.sub-visual-text {}
	.sub-visual-text h2 {padding:10px 0 0;}
	
	.sub-visual-nav p img {width:12px;}
	
	body .searchBox-close {right:20px; top:20px;}
	body .searchBox-close img {width:26px;}
	body .searchBox-input {height:50px;}
	
	
	
	
	
	
	
	
	
	
}