@charset 'utf-8';

/* °øÅë */
*{ word-break: keep-all; box-sizing: border-box; line-height: 1.3; }
.engFont{ font-family: 'Red Hat Display', sans-serif; }
.w1740{ width: 100%; max-width: 1740px; margin: 0 auto; }
.w1700{ width: 100%; max-width: 1700px; margin: 0 auto; }
.w1560{ width: 100%; max-width: 1560px; margin: 0 auto; }
.w1500{ width: 100%; max-width: 1500px; margin: 0 auto; }

/* º¯¼ö */
:root{
	--engFont: 'Red Hat Display', sans-serif;
	--red: #E60012;
}

/* privacy */
.privacy { color:#666; width: 100%; overflow: hidden; box-sizing:border-box; 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%; position: fixed; top: 0; left: 0; z-index: 100; }
#header img.on{ display: none; }
#header .bgColor{ display: none; width: 100%; height: 80px; background-color: #000; position: absolute; top: 100px; left: 0; opacity: 0.9; }
#header .flex-box{ display: flex; justify-content: space-between; align-items: center; }
#header .logo{ display: inline-block; position: relative; padding: 0 20px; }
#header .logo a{ position: absolute; top: 0; right: 0; bottom: 0; left: 0; }

#header nav{ position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); }
#header nav .depth01{ display: flex; position: relative; }
#header nav .depth01 > li{ position: relative; }
#header nav .depth01 > li > a{ display: inline-block; font-family: 'Red Hat Display', sans-serif; font-size: 18px; font-weight: 400; color: #fff; padding: 40px 77.5px; position: relative; }

#header nav .depth02{ display: none; width: max-content; position: absolute; top: 98px; left: 50%; transform: translateX(-50%); overflow: hidden; }
#header nav .depth02 ul{ width: 100%; display: flex; justify-content: center; align-items: center; }
#header nav .depth02 ul > li > a{ display: inline-block; font-size: 18px; font-weight: 200; color: #ccc; padding: 30px 20px; }

#header .icon ul{ display: flex; align-items: center; }
#header .icon ul li{ padding: 40px 20px; cursor: pointer; }
#header .icon ul li.search{ position: relative; z-index: 10; }
#header .icon ul li.search .input{ display: none; position: absolute; top: 50%; right: 0; z-index: -1; transform: translateY(-50%); }
#header .icon ul li.search .input button{ border: none; background: none; padding: 0; position: absolute; top: 50%; right: 20px; z-index: 10; transform: translateY(-50%); cursor: pointer; }
#header .icon ul li.search input{ width: 272px; border: 1px solid #ddd; background-color: #fff; border-radius: 25px; font-size: 16px; font-weight: 300; color: #333; line-height: 2.1875; padding: 0 40px 0 20px; }

/* header hover */
#header nav .depth01 > li:hover > a{ font-weight: 700; color: #e60012; }
#header nav .depth01 > li:hover > a::before{ content: ""; width: 100%; height: 5px; background-color: #e60012; position: absolute; top: -1px; left: 50%; transform: translateX(-50%); }
#header nav .depth01 > li:hover > a::after{ content: ""; width: 18px; height: 8px; background: url("/img/common/header_hover.png") no-repeat; position: absolute; bottom: -1px; left: 50%; transform: translateX(-50%); }
#header nav .depth02 ul > li:hover a{ font-weight: 500; color: #e60012; }

/* header.hover */
#header.hover{ background-color: #fff; }
#header.hover img{ display: none; }
#header.hover img.on{ display: block; }
#header.hover .depth01 > li > a{ color: #595757; }

/* header.scroll */
#header.scroll img:not(button img){ display: none; }
#header.scroll img.on{ display: block; }
#header.scroll .depth01 > li > a{ color: #595757; }

/* header - search hover */
#header .icon ul li.search.hover .input{ display: block; }
#header .icon ul li.search.hover > img{ display: none; }


/* fullmenu */
#fullmenu{ display: none; width: 100%; height: 100%; position: fixed; top: 0; left: 0; z-index: 150; background-color: #fff; }
#fullmenu  > .text_right{ text-align: right; position: absolute; top: 0; left: 50%; transform: translateX(-50%); }
#fullmenu button.close{ border: none; background: none; padding: 40px 20px; cursor: pointer; }

#fullmenu .flex-box{ width: 100%; height: 100%; display: flex; flex-direction: column; justify-content: center; padding-top: 100px; }
#fullmenu .moblie{ display: none; }
#fullmenu h3{ font-size: 6rem; font-weight: 700; color: #000; text-align: center; padding: 0 0 6%; margin-top: -5%; }
#fullmenu .depth01{ display: flex; }
#fullmenu .depth01 > li{ max-width: 420px; width: 100%; padding-bottom: 3%; }
#fullmenu .depth01 > li:not(:last-of-type){ border-right: 1px solid #ddd; }
#fullmenu .depth01 > li > a{ display: inline-block; width: 100%; font-family: 'Red Hat Display', sans-serif; font-size: 3.5rem; font-weight: 700; color: #000; text-align: center; padding: 0 0 30px; }
#fullmenu .depth02 ul > li > a{ display: inline-block; width: 100%; font-size: 1.8rem; font-weight: 300; color: #595757; text-align: center; padding: 12.5px 0; }

/* fullmenu hover */
#fullmenu .depth01 > li:hover > a{ color: #e60012; }
#fullmenu .depth02 ul > li > a:hover{ font-weight: 700; color: #e60012; }


/* footer */
#footer{ background-color: #000; padding: 55px 0; position: relative; }
#footer ul{ display: flex; }
#footer ul li{ display: flex; flex-direction: column; justify-content: flex-end; width: 50%; }
#footer ul li:last-of-type{ align-items: flex-end; }
#footer ul li p{ font-size: 1.8rem; font-weight: 500; color: #fff; line-height: 1.5555; letter-spacing: -0.015em; padding-bottom: 10px; }
#footer ul li a{ display: inline-block; font-size: 1.6rem; font-weight: 500; color: #fff; line-height: 1.75; letter-spacing: -0.015em; }
#footer ul li span{ font-size: 1.6rem; font-weight: 300; color: #999; line-height: 1.75; letter-spacing: -0.015em; margin-top: 5px; }

/* ¹ÝÀÀÇü */
@media screen and (max-width: 1740px){
	.w1700{ padding: 0 20px; }
}

@media screen and (max-width: 1700px){
	/* header */
	#header nav .depth01 > li > a{ padding: 40px 50px; }
}

@media screen and (max-width: 1540px){
	.w1500{ padding: 0 20px; }
}

@media screen and (max-width: 1400px){
	/* header */
	#header .icon ul li.search input{ width: 240px; }

	/* fullmenu */
	/* #fullmenu h3{ font-size: 5rem; } */
}

@media screen and (max-width: 1250px){
	/* header */
	#header nav{ display: none; }

	/* fullmenu */
	#fullmenu .depth02 ul > li > a{ font-size: 1.6rem; }

	.topBtn.pc{ display: none; }
	.topBtn.moblie{ display: block; }
} 

@media screen and (max-width: 1000px){
	/* fullmenu */
	#fullmenu .pc{ display: none; }
	#fullmenu .moblie{ display: block; }
	#fullmenu h3{ display: none }
	#fullmenu .depth01{ flex-direction: column; align-items: center; }
	#fullmenu .depth01 > li{ position: relative; }
	#fullmenu .depth01 > li::after{ content: ""; width: 100%; height: 40px; position: absolute; top: 0; left: 0; z-index: 10; cursor: pointer; }
	#fullmenu .depth01 > li:not(:last-of-type){ border-right: none; }
	#fullmenu .depth01 > li > a{ padding-bottom: 0; margin-bottom: 30px; }
	#fullmenu .depth02{ display: none; }

	/* footer */
	#footer ul{ flex-direction: column; }
	#footer ul li{ width: 100%; align-items: center; }
	#footer ul li:last-of-type{ flex-direction: column-reverse; align-items: center; }
	#footer ul li a{ padding-top: 15px; }
}