@charset 'utf-8';

/* °øÅë */
:root{
	--mainColor: #ab3030;

	--baseFont: 'Pretendard', 'Noto Sans KR', 'Malgun Gothic', 'verdana', sans-serif;
	--Poppins: 'Poppins', 'Pretendard', 'Noto Sans KR', 'Malgun Gothic', 'verdana', sans-serif;
}

.w1400{ max-width: 1400px; width: 100%; margin: 0 auto; }

@media screen and (max-width: 1440px){
	.w1400{ padding: 0 20px; }
}

/* privacy */
.privacy { color:#666; width: 100%; overflow: hidden; box-sizing:border-box; padding:20px; font-size:15px;	line-height: 140%; word-break:break-all; }
.privacy h2 { font-size:18px; font-weight:bold; color:#000; text-align: left; margin:50px 0 30px; }
.privacy h2:first-child { margin-top: 0; }
.privacy > p { margin:15px 0; }
.privacy > p+dl { margin-top: 30px; }
.privacy > dl { padding-bottom:20px;}
.privacy > dl > dt{ font-size:15px;color:#3680b9;font-weight:700;padding-bottom:5px;}
.privacy > dl > dd{ padding-bottom:10px;text-align:justify; font-size:15px; line-height:140%;}
.privacy > dl > dd ul{ padding:10px; }
.privacy > dl > dd ul li{ line-height:120%; margin-top: 10px; }
.privacy > dl > dd ul li:first-child { margin-top: 0; }
.privacy > dl > dd ul li p { margin:0 10px 5px; line-height: 140%; }
.sTxt h3 { font-size:16px; color: #333; font-weight: 700; margin: 20px 0 10px; }
.sTxt p { margin-top: 10px; }
.sTxt dt { margin-top: 10px; }
.sTxt dd { margin:0 8px; }


/* header */
#header{ width: 100%; height: 100px; background: var(--mainColor); position: fixed; top: 0; left: 0; z-index: 100; display: flex; justify-content: flex-end; }
#header *{ letter-spacing: -0.03em; }
#header .inner{ max-width: 1820px; width: 100%; }
#header .flex-box{ display: flex; justify-content: space-between; align-items: center; }
#header .flex-box > div{ display: flex; align-items: center; }
#header .logo{ display: inline-block; position: relative; }
#header .logo a{ position: absolute; top: 0; right: 0; left: 0; bottom: 0; }

#header .depth01{ display: flex; }
#header .depth01 > li{ position: relative; z-index: 10; }
#header .depth01 > li > a{ display: inline-block; height: 100px; font-size: 1.8rem; font-weight: 600; color: #fff; padding: 0 30px; transition: 0.3s; transition-delay: 0.4s; line-height: 100px; }
#header .depth02{ display: none; width: 100%; position: absolute; top: calc(100% - 12px); z-index: -1; padding-bottom: 35px; background: #fff; border-radius: 0 0 10px 10px; box-shadow: 0px 0px 25px 15px rgba(0, 0, 0, 0.15); overflow: hidden; }
#header .depth02 > li > a{ display: inline-block; width: 100%; font-size: 1.6rem; font-weight: 500; color: #666666; text-align: center; padding: 14px 0; }
#header .depth02 > li > a.link::after{ content: url("/img/common/link_icon.png"); margin-left: 7px; position: relative; }

#header .depth01 > li:hover::after{ content: ""; width: calc(100% - 60px); height: 1px; background: #eee; position: absolute; bottom: 22px; left: 50%; transform: translateX(-50%); }
#header .depth01 > li:hover{ box-shadow: 0px 0px 25px 15px rgba(0, 0, 0, 0.15); }
#header .depth01 > li:hover > a{ background: #fff; color: #232323; transition: unset; transition-delay: unset; }
#header .depth02 > li > a:hover{ font-weight: 700; color: var(--mainColor); }
#header .depth02 > li > a.link:hover::after{ content: url("/img/common/link_icon_hover.png"); }

#header .member ul{ display: flex; padding: 0 15px; margin-right: 15px; }
#header .member ul li{ position: relative; }
#header .member ul li::after{ content: ""; width: 1px; height: 10px; background: rgba(255, 255, 255, 0.5); position: absolute; top: 45%; right: 0; transform: translateY(-50%); }
#header .member ul li:last-of-type::after{ display: none }
#header .member ul li a{ display: inline-block; font-size: 1.5rem; font-weight: 400; color: #fff; padding: 15px; }
#header .open{ width: 100px; height: 100px; border: none; background: #fff; }

@media screen and (max-width: 1860px){
	#header .inner{ padding-left: 20px; }
}

@media screen and (max-width: 1600px){
	#header nav{ display: none; } 
}

@media screen and (max-width: 1200px){
	#header .member{ display: none; }
}

@media screen and (max-width: 1000px){
	#header{ height: 70px; }
	#header .member ul{ padding: 0; }
	#header .open{ width: 70px; height: 70px; }
}


/* footer */
#footer{ background: #222; padding-top: 70px; }
#footer .logo{ display: inline-block; position: relative; }
#footer .logo a{ position: absolute; top: 0; right: 0; bottom: 0; left: 0; }

#footer .flex-box{ display: flex; justify-content: space-between; align-items: flex-end; padding: 25px 0 15px; border-bottom: 1px solid rgba(255, 255, 255, 0.1); }
#footer .info{ margin-bottom: -12px; }
#footer .info p{ display: inline-block; font-size: 1.4rem; font-weight: 300; color: #757575; margin-right: 30px; margin-bottom: 12px; }
#footer .info p:last-of-type{ margin-right: 0; }
#footer .info p span{ font-weight: 600; }

#footer .flex-box .sns-list{ margin-right: -10px; }
#footer .flex-box .sns-list li{ display: inline-block; padding: 0 10px; position: relative; }
#footer .flex-box .sns-list li a{ position: absolute; top: 0; right: 0; bottom: 0; left: 0; }

#footer p.copyright{ font-size: 1.4rem; font-weight: 500; color: #7f7f7f; padding: 15px 0; }

@media screen and (max-width: 950px){
	#footer{ padding-top: 20px; }
	#footer .flex-box{ flex-direction: column; align-items: flex-start; padding-bottom: 5px; }
	#footer .flex-box .sns-list{ margin-left: -10px; margin-top: 5px; }
	#footer .flex-box .sns-list li{ padding: 10px; }
}


/* ÀüÃ¼ ¸Þ´º */
#sitemap{ width: 100%; height: 100%; position: fixed; top: 0; left: 0; background: rgba(0, 0, 0, 0.7); z-index: 200; display: none; }

#sitemap .site-box{ max-width: 1720px; width: 100%; height: calc(100% - 200px); position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); background: #fff url("/img/common/symbol.png") no-repeat bottom -5px left -40px / auto; border-radius: 15px; padding: 0 80px; }
#sitemap .close{ background: none; border: none; padding: 5px; position: absolute; top: 30px; right: 30px; cursor: pointer; }
#sitemap .site-box > div{ height: 100%; }   
#sitemap .site-box .moblie{ display: none; }

#sitemap nav{ height: 100%; }  
#sitemap .depth01{ display: flex; height: 100%; border-left: 1px solid #eee; }
#sitemap .depth01 > li{ width: calc(100% / 6); height: 100%; border-right: 1px solid #eee; padding-top: 7.5%; position: relative; }
#sitemap .depth01 > li > a{ display: inline-block; width: 100%; font-size: 2.4rem; font-weight: 700; color: #111; text-align: center; padding: 35px 0; position: relative; }
#sitemap .depth02{ padding-top: 20px; }
#sitemap .depth01 > li > a::after{ content: ""; width: 60px; height: 2px; background: var(--mainColor); position: absolute; bottom: 0; left: 50%; transform: translateX(-50%); }
#sitemap .depth02 > li > a{ display: inline-block; width: 100%; font-size: 1.8rem; font-weight: 500; color: #333; text-align: center; padding: 15px 0; }

#sitemap .sns-list{ position: absolute; bottom: 20px; right: 5px; z-index: 10; }
#sitemap .sns-list li{ display: inline-block; padding: 10px; position: relative; }
#sitemap .sns-list li a{ position: absolute; top: 0; right: 0; bottom: 0; left: 0; }
#sitemap .sns-list li a::after{ position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); }
#sitemap .sns-list li:nth-of-type(1) a::after{ content: url("/img/common/facebook_gray.png"); }
#sitemap .sns-list li:nth-of-type(2) a::after{ content: url("/img/common/instagram_gray.png"); }
#sitemap .sns-list li:nth-of-type(3) a::after{ content: url("/img/common/kakao_gray.png"); }
#sitemap .sns-list li a img{ opacity: 0; }

@media screen and (max-width: 1760px){
	#sitemap .site-box{ width: calc(100% - 80px); }
}

@media screen and (max-width: 1440px){
	#sitemap .site-box{ padding: 0; }
	#sitemap .depth01{ border-left: none; }
	#sitemap .depth01 > li:last-of-type{ border-right: none; }
}

@media screen and (max-width: 1280px){
	#sitemap .depth01 > li > a{ font-size: 2.2rem; padding: 20px 0; }
	#sitemap .depth02 > li > a{ font-size: 1.6rem; }
}

@media screen and (max-width: 1200px){
	#sitemap .site-box{ height: calc(100% - 80px); overflow: hidden; }
	#sitemap .close{ top: 0; right: 15px; }
	#sitemap .site-box .pc{ display: none; }  
	#sitemap .site-box .moblie{ display: block; }
	
	#sitemap .member{ border-bottom: 1px solid #eee; }
	#sitemap .member ul{ height: 70px; display: flex; justify-content: flex-start; align-items: center; padding: 0 20px; }  
	#sitemap .member ul li a{ font-size: 1.6rem; font-weight: 500; color: #333; padding: 10px; position: relative; }
	#sitemap .member ul li a::after{ content: ""; width: 1px; height: 10px; background: #333; position: absolute; top: 52%; right: 0; transform: translateY(-50%); opacity: 0.5; }
	#sitemap .member ul li:last-of-type a::after{ display: none; }
	#sitemap .depth01{ height: calc(100% - 140px); flex-direction: column; justify-content: center; border-bottom: 1px solid #eee; }
	#sitemap .depth01 > li{ width: 100%; height: auto; padding-top: 0;  }
	#sitemap .depth01 > li::after{ content: ""; width: 100%; height: 52px; position: absolute; top: 0; left: 0; cursor: pointer; }
	#sitemap .depth01 > li > a{ padding-bottom: 15px; }
	#sitemap .depth01 > li > a::after{ transform: translateX(-50%) scaleX(0); transition: 0.3s; }
	#sitemap .depth01 > li:hover > a::after{ transform: translateX(-50%) scaleX(1); }
	#sitemap .depth02{ display: none; padding-top: 5px; }
	#sitemap .depth02 > li > a{ padding: 10px 0; }

	#sitemap .sns-list{ bottom: 15px; }
}