@charset "utf-8";

/* ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */
/* »çÀÌÆ®³» »ç¿ë ÆùÆ® Àû¿ë */
/* ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */

/* Noto-sans-kr - korean */
@font-face {
  font-family: 'Noto Sans KR';
  font-style: normal;
  font-weight: 100;
  src: url('../fonts/noto-sans-kr-v8-korean-100.eot'); /* IE9 Compat Modes */
  src: local('Noto Sans KR Thin'), local('NotoSansKR-Thin'),
       url('../fonts/noto-sans-kr-v8-korean-100.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/noto-sans-kr-v8-korean-100.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/noto-sans-kr-v8-korean-100.woff') format('woff'), /* Modern Browsers */
       url('../fonts/noto-sans-kr-v8-korean-100.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/noto-sans-kr-v8-korean-100.svg#NotoSansKR') format('svg'); /* Legacy iOS */
}
@font-face {
  font-family: 'Noto Sans KR';
  font-style: normal;
  font-weight: 300;
  src: url('../fonts/noto-sans-kr-v8-korean-300.eot'); /* IE9 Compat Modes */
  src: local('Noto Sans KR Light'), local('NotoSansKR-Light'),
       url('../fonts/noto-sans-kr-v8-korean-300.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/noto-sans-kr-v8-korean-300.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/noto-sans-kr-v8-korean-300.woff') format('woff'), /* Modern Browsers */
       url('../fonts/noto-sans-kr-v8-korean-300.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/noto-sans-kr-v8-korean-300.svg#NotoSansKR') format('svg'); /* Legacy iOS */
}
@font-face {
  font-family: 'Noto Sans KR';
  font-style: normal;
  font-weight: 400;
  src: url('../fonts/noto-sans-kr-v8-korean-regular.eot'); /* IE9 Compat Modes */
  src: local('Noto Sans KR Regular'), local('NotoSansKR-Regular'),
       url('../fonts/noto-sans-kr-v8-korean-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/noto-sans-kr-v8-korean-regular.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/noto-sans-kr-v8-korean-regular.woff') format('woff'), /* Modern Browsers */
       url('../fonts/noto-sans-kr-v8-korean-regular.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/noto-sans-kr-v8-korean-regular.svg#NotoSansKR') format('svg'); /* Legacy iOS */
}
@font-face {
  font-family: 'Noto Sans KR';
  font-style: normal;
  font-weight: 500;
  src: url('../fonts/noto-sans-kr-v8-korean-500.eot'); /* IE9 Compat Modes */
  src: local('Noto Sans KR Medium'), local('NotoSansKR-Medium'),
       url('../fonts/noto-sans-kr-v8-korean-500.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/noto-sans-kr-v8-korean-500.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/noto-sans-kr-v8-korean-500.woff') format('woff'), /* Modern Browsers */
       url('../fonts/noto-sans-kr-v8-korean-500.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/noto-sans-kr-v8-korean-500.svg#NotoSansKR') format('svg'); /* Legacy iOS */
}
@font-face {
  font-family: 'Noto Sans KR';
  font-style: normal;
  font-weight: 700;
  src: url('../fonts/noto-sans-kr-v8-korean-700.eot'); /* IE9 Compat Modes */
  src: local('Noto Sans KR Bold'), local('NotoSansKR-Bold'),
       url('../fonts/noto-sans-kr-v8-korean-700.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/noto-sans-kr-v8-korean-700.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/noto-sans-kr-v8-korean-700.woff') format('woff'), /* Modern Browsers */
       url('../fonts/noto-sans-kr-v8-korean-700.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/noto-sans-kr-v8-korean-700.svg#NotoSansKR') format('svg'); /* Legacy iOS */
}
@font-face {
  font-family: 'Noto Sans KR';
  font-style: normal;
  font-weight: 900;
  src: url('../fonts/noto-sans-kr-v8-korean-900.eot'); /* IE9 Compat Modes */
  src: local('Noto Sans KR Black'), local('NotoSansKR-Black'),
       url('../fonts/noto-sans-kr-v8-korean-900.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/noto-sans-kr-v8-korean-900.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/noto-sans-kr-v8-korean-900.woff') format('woff'), /* Modern Browsers */
       url('../fonts/noto-sans-kr-v8-korean-900.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/noto-sans-kr-v8-korean-900.svg#NotoSansKR') format('svg'); /* Legacy iOS */
}


/* Pretendard ÇÁ¸®Åٴٵå ÆùÆ® */
@font-face {
	font-family: 'Pretendard';
	font-weight: 900;
	font-display: swap;
	src: local('Pretendard Black'), url('../fonts/Pretendard-Black.woff2') format('woff2'), url('../fonts/Pretendard-Black.woff') format('woff');
}

@font-face {
	font-family: 'Pretendard';
	font-weight: 800;
	font-display: swap;
	src: local('Pretendard ExtraBold'), url('../fonts/Pretendard-ExtraBold.woff2') format('woff2'), url('../fonts/Pretendard-ExtraBold.woff') format('woff');
}

@font-face {
	font-family: 'Pretendard';
	font-weight: 700;
	font-display: swap;
	src: local('Pretendard Bold'), url('../fonts/Pretendard-Bold.woff2') format('woff2'), url('../fonts/Pretendard-Bold.woff') format('woff');
}

@font-face {
	font-family: 'Pretendard';
	font-weight: 600;
	font-display: swap;
	src: local('Pretendard SemiBold'), url('../fonts/Pretendard-SemiBold.woff2') format('woff2'), url('../fonts/Pretendard-SemiBold.woff') format('woff');
}

@font-face {
	font-family: 'Pretendard';
	font-weight: 500;
	font-display: swap;
	src: local('Pretendard Medium'), url('../fonts/Pretendard-Medium.woff2') format('woff2'), url('../fonts/Pretendard-Medium.woff') format('woff');
}

@font-face {
	font-family: 'Pretendard';
	font-weight: 400;
	font-display: swap;
	src: local('Pretendard Regular'), url('../fonts/Pretendard-Regular.woff2') format('woff2'), url('../fonts/Pretendard-Regular.woff') format('woff');
}

@font-face {
	font-family: 'Pretendard';
	font-weight: 300;
	font-display: swap;
	src: local('Pretendard Light'), url('../fonts/Pretendard-Light.woff2') format('woff2'), url('../fonts/Pretendard-Light.woff') format('woff');
}

@font-face {
	font-family: 'Pretendard';
	font-weight: 200;
	font-display: swap;
	src: local('Pretendard ExtraLight'), url('../fonts/Pretendard-ExtraLight.woff2') format('woff2'), url('../fonts/Pretendard-ExtraLight.woff') format('woff');
}

@font-face {
	font-family: 'Pretendard';
	font-weight: 100;
	font-display: swap;
	src: local('Pretendard Thin'), url('../fonts/Pretendard-Thin.woff2') format('woff2'), url('../fonts/Pretendard-Thin.woff') format('woff');
}


/* s-core-dream ¿¡½ºÄÚ¾î µå¸²Ã¼ ÆùÆ® */
@font-face {
    font-family: 'SCoreDream';
    font-weight: 100;
    font-style: normal;
    src: url('../fonts/SCoreDreamThin.eot');
    src: url('../fonts/SCoreDreamThin.eot?#iefix') format('embedded-opentype'),
        url('../fonts/SCoreDreamThin.woff2') format('woff2'),
        url('../fonts/SCoreDreamThin.woff') format('woff'),
        url('../fonts/SCoreDreamThin.ttf') format("truetype");
}
@font-face {
    font-family: 'SCoreDream';
    font-weight: 200;
    font-style: normal;
    src: url('../fonts/SCoreDreamExtraLight.eot');
    src: url('../fonts/SCoreDreamExtraLight.eot?#iefix') format('embedded-opentype'),
        url('../fonts/SCoreDreamExtraLight.woff2') format('woff2'),
        url('../fonts/SCoreDreamExtraLight.woff') format('woff'),
        url('../fonts/SCoreDreamExtraLight.ttf') format("truetype");
}
@font-face {
    font-family: 'SCoreDream';
    font-weight: 300;
    font-style: normal;
    src: url('../fonts/SCoreDreamLight.eot');
    src: url('../fonts/SCoreDreamLight.eot?#iefix') format('embedded-opentype'),
        url('../fonts/SCoreDreamLight.woff2') format('woff2'),
        url('../fonts/SCoreDreamLight.woff') format('woff'),
        url('../fonts/SCoreDreamLight.ttf') format("truetype");
}
@font-face {
    font-family: 'SCoreDream';
    font-weight: 400;
    font-style: normal;
    src: url('../fonts/SCoreDreamRegular.eot');
    src: url('../fonts/SCoreDreamRegular.eot?#iefix') format('embedded-opentype'),
        url('../fonts/SCoreDreamRegular.woff2') format('woff2'),
        url('../fonts/SCoreDreamRegular.woff') format('woff'),
        url('../fonts/SCoreDreamRegular.ttf') format("truetype");
}
@font-face {
    font-family: 'SCoreDream';
    font-weight: 500;
    font-style: normal;
    src: url('../fonts/SCoreDreamMedium.eot');
    src: url('../fonts/SCoreDreamMedium.eot?#iefix') format('embedded-opentype'),
        url('../fonts/SCoreDreamMedium.woff2') format('woff2'),
        url('../fonts/SCoreDreamMedium.woff') format('woff'),
        url('../fonts/SCoreDreamMedium.ttf') format("truetype");
}
@font-face {
    font-family: 'SCoreDream';
    font-weight: 600;
    font-style: normal;
    src: url('../fonts/SCoreDreamBold.eot');
    src: url('../fonts/SCoreDreamBold.eot?#iefix') format('embedded-opentype'),
        url('../fonts/SCoreDreamBold.woff2') format('woff2'),
        url('../fonts/SCoreDreamBold.woff') format('woff'),
        url('../fonts/SCoreDreamBold.ttf') format("truetype");
}
@font-face {
    font-family: 'SCoreDream';
    font-weight: 700;
    font-style: normal;
    src: url('../fonts/SCoreDreamExtraBold.eot');
    src: url('../fonts/SCoreDreamExtraBold.eot?#iefix') format('embedded-opentype'),
        url('../fonts/SCoreDreamExtraBold.woff2') format('woff2'),
        url('../fonts/SCoreDreamExtraBold.woff') format('woff'),
        url('../fonts/SCoreDreamExtraBold.ttf') format("truetype");
}
@font-face {
    font-family: 'SCoreDream';
    font-weight: 800;
    font-style: normal;
    src: url('../fonts/SCoreDreamHeavy.eot');
    src: url('../fonts/SCoreDreamHeavy.eot?#iefix') format('embedded-opentype'),
        url('../fonts/SCoreDreamHeavy.woff2') format('woff2'),
        url('../fonts/SCoreDreamHeavy.woff') format('woff'),
        url('../fonts/SCoreDreamHeavy.ttf') format("truetype");
}
@font-face {
    font-family: 'SCoreDream';
    font-weight: 900;
    font-style: normal;
    src: url('../fonts/SCoreDreamBlack.eot');
    src: url('../fonts/SCoreDreamBlack.eot?#iefix') format('embedded-opentype'),
        url('../fonts/SCoreDreamBlack.woff2') format('woff2'),
        url('../fonts/SCoreDreamBlack.woff') format('woff'),
        url('../fonts/SCoreDreamBlack.ttf') format("truetype");
}


/* ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */
/* Reset ÃʱâÈ­ ¼³Á¤ */
/* ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */

*, *:after, *:before {box-sizing: border-box;}
* {outline:0 !important;} /* focus ¹ß»ý ½Ã ű׿¡ ÆĶõ»ö ¶óÀÎ »ý±è ¹æÁö */

/* ¹ÝÀÀÇü ±âº» ÆùÆ® ¹× ÆùƮũ±â ¼³Á¤ */
html,body,h1,h2,h3,h4,h5,h6,div,p,blockquote,pre,code,address,ul,ol,li,menu,nav,section,article,aside,dl,dt,dd,table,thead,tbody,tfoot,label,caption,th,td,form,fieldset,
legend,hr,input,button,textarea,object,figure,figcaption {font-family: "Pretendard", sans-serif; font-size: 62.5%;} /* ±âº»ÆùÆ® 10px ¼³Á¤°ª > 1rem=10px == 10px % 16px(ºê¶ó¿ìÀú ±âº»ÆùƮũ±â) X 100 = 62.5% */

body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,textarea,p,blockquote,th,td,input,select,textarea,button {margin: 0; padding: 0;}
html {-webkit-touch-callout:none; /*-webkit-user-select:none;*/ -webkit-tap-highlight-color:rgba(0,0,0,0);} /* È­¸é²Ú´©¸£¸é ¸Þ´º³ªÅ¸³², »ç¿ëÀÚ°¡ Ŭ¸¯¹×µå·¡±×±â´É ÀÌ¿ëÇÔ, ¸µÅ©Å¬¸¯½Ã ¹ØÁÙ/¾Æ¿ô¶óÀλý±è±â´Éµé ¹æÁö */
body {min-width: 320px; background: #fff; word-wrap: break-word; word-break: break-all; -webkit-text-size-adjust:none;} /* ºäǥƮ º¯È¯½Ã ÆùƮũ±â ÀÚµ¿È®´ë ¹æÁö */
html, h1, h2, h3, h4, h5, h6, form, fieldset, img {border: 0;}
article, aside, details, figcaption, figure, footer, header, hgroup, section {display: block;}

dl,ul,ol,li {list-style: none;}
legend {position: absolute; font-size: 0; line-height: 0; text-indent: -9999em; overflow: hidden;}
caption {position: absolute; overflow: hidden; width: 0; height: 0; font-size: 0; line-height: 0;}
label, input, button, select {font-family: "Pretendard", sans-serif; vertical-align: middle;}
textarea {font-family: "Pretendard", sans-serif; vertical-align: middle;}
img {vertical-align: top;}
button {cursor: pointer;}
hr {display: none;}
pre {overflow-x:scroll;}

table {margin: 0; padding: 0; border: 0; border-collapse: collapse; border-spacing: 0;}
input[type="text"],input[type="password"],input[type="submit"],input[type="search"] {-webkit-appearance:none; border-radius: 0;}
input:checked[type="checkbox"] {background-color:#666; -webkit-appearance:checkbox;}
button,input[type="button"],input[type="submit"],input[type="reset"],input[type="file"] {-webkit-appearance:button; border: 0; border-radius:0}
input[type="search"]::-webkit-search-cancel-button {-webkit-appearance:none}

/* chrome ¹× ±âŸºê¶ó¿ìÀú input ¿¡ ÀÚµ¿ ä¿öÁö´Â ¹è°æ»ö»ó ±ÛÀÚ»ö»ó º¯°æ */
input:-webkit-autofill, input:-webkit-autofill:hover, input:-webkit-autofill:focus, input:-webkit-autofill:active {transition: background-color 5000s ease-in-out 0s; -webkit-transition: background-color 9999s ease-out; -webkit-box-shadow: 0 0 0px 1000px white inset !important; -webkit-text-fill-color: #111 !important;}
input:autofill, input:autofill:hover, input:autofill:focus, input:autofill:active {-webkit-text-fill-color: #000; -webkit-box-shadow: 0 0 0px 1000px #fff inset; box-shadow: 0 0 0px 1000px #fff inset; transition: background-color 5000s ease-in-out 0s;}

a {cursor: pointer; text-decoration: none;}
a:link, a:visited {text-decoration: none;}
a:hover, a:focus, a:active {text-decoration: none /*underline*/;}
p {margin: 0 !important;}


/* ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */
/* Root ±âº» ¼³Á¤°ª */
/* ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */

:root {

/* Àüä »çÀÌÆ® ¼³Á¤°ª */
--max-width: 128rem;
--header-center: 90px;

/* ¸ð¼Ç ¼³Á¤°ª */
--transition: all 0.3s ease;

/* Ä÷¯ ¼³Á¤ */
--blue: #196ef7;            /* ºí·ç Ä÷¯ - °øÅëÀû¿ë */
--violet: #7c4dff;          /* º¸¶ó»ö Ä÷¯ */
--black: #000;              /* ºí·¢ Ä÷¯ */
--blackdark: #555;          /* ´ÙÅ© Ä÷¯*/

/* ±âŸ ¼³Á¤ */
--borderline: #e8e8e8;      /* °øÅë ¶óÀÎ Ä÷¯ */
--btn-borderline: #ddd;    /* °øÅë ¹öÆ°¶óÀÎ Ä÷¯ */
--rollover-color: #0e41c1;  /* °øÅë ·Ñ¿À¹ö Ä÷¯ */

}


/* ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */
/* ·¹À̾ƿô °øÅë */
/* ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */

#wrap {float: left; width: 100%;}
#header {float: left; width: 100%;}
#contents {float: left; width: 100%;}
#footer {float: left; width: 100%;}
#overlay {display: none; position: fixed; top: 12.3rem; left: 0; width: 100%; height: calc(100% - 12.3rem); background: rgba(0,0,0,0.7); z-index: 1000000;} /*index = 7*/


/* ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */
/* PC ÃÖ»ó´Ü Çì´õ ¿µ¿ª GNB Common */
/* ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */

#header-inner {position: relative; width: 100%; background-color: #fff; z-index: 10000000;}
#header-inner .inner {margin: 0 auto; width: 100%; max-width: var(--max-width);}

/* ½ºÅ©·Ñ½Ã »ó´Ü Ä«Å×°í¸® ¸Þ´º °íÁ¤ */
.page-header {z-index: 100000000;} /*index = 9*/
.page-header.sticky {position: fixed !important; top: 0 !important; z-index: 100000000;} /*index = 9*/

/* ÃÖ»ó´Ü - ¿ìÃø ·Î±×ÀÎ,ȸ¿ø°¡ÀÔ ÄÁÅÙÃ÷ ¿µ¿ª */
.aside-wrap {position: relative; width: 100%; background: linear-gradient(90deg, var(--violet) 0%, var(--blue) 100%);}
.aside-wrap .user-member {display: flex; justify-content: flex-end; height: 3.2rem;}
.aside-wrap .user-member a {display: inline-flex; align-items: center; flex-wrap: wrap; width: auto; height: 100%; font-size: 1.35rem; color: rgba(255,255,255,0.85); font-weight: 400; letter-spacing: -0.035rem; margin-left: 2rem;}
.aside-wrap .user-member a i {font-size: 1.45rem; color: rgba(255,255,255,0.85); margin-right: 0.4rem; vertical-align: middle;}
.aside-wrap .user-member a:first-child {margin-left: 0;}
.aside-wrap .user-member a.admin {font-size: 1.35rem; color: #000; padding: 0.5rem 1rem; margin-left: 2rem; background-color: #fff; transition: var(--transition);}
.aside-wrap .user-member a:hover {color: #fff;}
.aside-wrap .user-member a:hover i {color: #fff;}
.aside-wrap .user-member a.admin:hover {background-color: var(--default-color);}

/* ÃÖ»ó´Ü - »çÀÌÆ® Çì´õ ¿µ¿ª */
.site-header {position: relative; backdrop-filter: blur(18px); background: rgba(255,255,255,.88); border-bottom: 1px solid var(--borderline); box-shadow: 0 10px 30px rgba(53,76,173,0.06);}
.site-header .inner {display: flex; justify-content: space-between; align-items: center; height: var(--header-center);}
h1.logo {display: flex; align-items: center; width: auto; font-size: 0; margin-bottom: 0;}
h1.logo a {width: 100%;}
h1.logo img {width: 100%;}

.header-search {position: absolute; left: 50%; transform: translateX(calc(-50% + 0.5px)); width: 43.4rem;}
.header-search label.sr-only {position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); border: 0;}
.header-search input {width: 100%; height: 60px; font-size: 1.5rem; color: var(--text); padding: 0 58px 0 30px; background: #f5f5f5; border: 0; border-radius: 999px; outline: none; transition: var(--transition);}
.header-search input:focus {border-color: var(--blue);}
.header-search button {position: absolute; right: 6px; top: 50%; transform: translateY(-50%); width: 4.5rem; height: 4.5rem; border: 0; border-radius: 50%; background: #555; cursor: pointer;}
.header-search button i {display: flex; justify-content: center; align-items: center; font-size: 2rem; color: #fff;}

/* ÃÖ»ó´Ü - »çÀÌÆ® Çì´õ ¿µ¿ª - ´ëÇ¥ÀüÈ­¹øÈ£ */
.call-number a {display: inline-flex; align-items: center; justify-content: center; padding: 0.8rem 2rem 0.8rem 0.8rem; border: 1px solid var(--btn-borderline); background: #fff; border-radius: 5.8rem;}
.call-number a i {display: flex; justify-content: center; align-items: center; width: 3.5rem; height: 3.5rem; font-size: 2rem; color: #fff; margin-right: 1rem; background: #959595; border-radius: 5.8rem;}
.call-number a span {font-size: 2.3rem; font-weight: 600; letter-spacing: -0.030rem; line-height: 1; animation: colorChange .8s ease-in-out infinite;}

/* ÅؽºÆ® ±ôºýÀÓ ¾Ö´Ï ¿µ¿ª */
@keyframes colorChange {
  0% {
    color: #345cff;
  }
  50% {
    color: #ff000a;
  }
  100% {
    color: var(--blue);
  }
}

/* »ó´Ü GNB Ä«Å×°í¸® ¸Þ´º ¿µ¿ª */
#head-gnb {position: relative; width: 100%; background-color: #fff; border-bottom: 1px solid var(--borderline);}
#head-gnb .inner {margin: 0 auto; width: 100%; max-width: var(--max-width);}
#head-gnb .gnb-wrap {display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; width: 100%; height: 60px;}

/* »ó´Ü GNB Ä«Å×°í¸® ¸Þ´º - ¸Þ´º ¿ÀÇÂŬ¸¯ ¹öÆ° ¿µ¿ª */
#head-gnb .gnb-wrap .gnb-menu {display: flex; align-items: center; flex-wrap: wrap;}
#head-gnb .gnb-wrap .gnb-menu .categorymenu-group {display: flex; align-items: center; height: 60px;}
#head-gnb .gnb-wrap .gnb-menu .categorymenu-group a {display: flex; align-items: center; flex-wrap: wrap; width: 100%; height: 46px; padding: 0 20px; border-radius: 8px; background: var(--black);}
#head-gnb .gnb-wrap .gnb-menu .categorymenu-group a div.cate-tit {display: inline-block; transform: rotate(-0.04deg); font-size: 1.55rem; color: #fff; font-weight: 700; line-height: 1; letter-spacing: -0.08rem; margin-left: 1rem;}
#head-gnb .gnb-wrap .gnb-menu .categorymenu-group a span {position: relative; display: inline-block; width: 2rem; height: 1.4rem; text-indent: -9999px; border-radius: 0.8rem;}
#head-gnb .gnb-wrap .gnb-menu .categorymenu-group a span.open {position: relative; display: inline-block; width: 18px; height: 18px;}
#head-gnb .gnb-wrap .gnb-menu .categorymenu-group a span.open strong.line {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 18px; height: 2px; background: #fff; border-radius: 999px; transition: var(--transition);}
#head-gnb .gnb-wrap .gnb-menu .categorymenu-group a span.open:before {content: ""; position: absolute; top: 3px; left: 50%; transform: translateX(-50%); width: 18px; height: 2px; background: #fff; border-radius: 999px; transition: var(--transition);}
#head-gnb .gnb-wrap .gnb-menu .categorymenu-group a span.open:after {content: ""; position: absolute; bottom: 3px; left: 50%; transform: translateX(-50%); width: 18px; height: 2px; background: #fff; border-radius: 999px; transition: var(--transition);}

/* »ó´Ü GNB Ä«Å×°í¸® ¸Þ´º - ¸Þ´º ¿ÀÇÂŬ¸¯ ¹öÆ° ¿µ¿ª - Ŭ¸¯ ÈÄ close »óÅ */
#head-gnb .gnb-wrap .gnb-menu .categorymenu-group a span.close {position: relative; display: inline-block; width: 18px; height: 18px;}
#head-gnb .gnb-wrap .gnb-menu .categorymenu-group a span.close strong.line {opacity: 0; transform: translate(-50%, -50%) scaleX(0);}
#head-gnb .gnb-wrap .gnb-menu .categorymenu-group a span.close:before {content: ""; position: absolute; top: 50%; left: 50%; width: 18px; height: 2px; background: #fff; border-radius: 999px; transform: translate(-50%, -50%) rotate(45deg); transition: var(--transition);}
#head-gnb .gnb-wrap .gnb-menu .categorymenu-group a span.close:after {content: ""; position: absolute; top: 50%; left: 50%; width: 18px; height: 2px; background: #fff; border-radius: 999px; transform: translate(-50%, -50%) rotate(-45deg); transition: var(--transition);}

/* »ó´Ü GNB Ä«Å×°í¸® ¸Þ´º - ÇÏÀ§¸Þ´º ¿ÀÇ ¿µ¿ª */
#head-gnb .gnb-wrap .gnb-menu .categorymenu-group .categorymenu-list {display: none; position: absolute; top: 6.1rem; left: 0; right: 0; width: 100%; background: #fff !important; border-bottom: 2px solid #000; overflow: hidden; z-index: 100000000;} /*index = 8*/
#head-gnb .gnb-wrap .gnb-menu .categorymenu-group .categorymenu-list .menuopen-wrap {display: flex; flex-wrap: wrap; margin: 0 auto; width: 100%; max-width: var(--max-width);}
#head-gnb .gnb-wrap .gnb-menu .categorymenu-group .categorymenu-list .menu-depth {display: grid; grid-template-columns: repeat(6, 1fr); gap: 0 2rem; width: 88%;}
#head-gnb .gnb-wrap .gnb-menu .categorymenu-group .categorymenu-list .menu-depth ul {padding: 3rem 0 3rem; padding-left: 2rem; border-left: 1px solid #e8e8e8;}
#head-gnb .gnb-wrap .gnb-menu .categorymenu-group .categorymenu-list .menu-depth ul.last {padding: 3rem 0 3rem; padding-left: 2rem;}
#head-gnb .gnb-wrap .gnb-menu .categorymenu-group .categorymenu-list .menu-depth ul li {width: 100%; vertical-align: top;}
#head-gnb .gnb-wrap .gnb-menu .categorymenu-group .categorymenu-list .menu-depth ul li .tit {display: flex; align-items: center; flex-wrap: wrap; height: 3.4rem; transform: rotate(-0.03deg); font-size: 1.7rem; color: #111; font-weight: 700; letter-spacing: -0.08rem; margin-bottom: 1rem;}
#head-gnb .gnb-wrap .gnb-menu .categorymenu-group .categorymenu-list .menu-depth ul li .tit i {font-size: 2.4rem; color: #888888; font-weight: 400; margin-left: 0.2rem;}
#head-gnb .gnb-wrap .gnb-menu .categorymenu-group .categorymenu-list .menu-depth ul li a {position: relative; display: block; width: 100%; height: auto; background: none; box-shadow: none; padding: 0; transform: rotate(-0.03deg); font-size: 1.45rem; color: rgba(0,0,0, .52); font-weight: 500; line-height: 1.4; margin-bottom: 0.5rem;}
#head-gnb .gnb-wrap .gnb-menu .categorymenu-group .categorymenu-list .menu-depth ul li a:hover {color: #1139be; text-decoration: underline;}
#head-gnb .gnb-wrap .gnb-menu .categorymenu-group .categorymenu-list .menu-depth ul li a:hover:after {content: "*"; position: absolute; top: 50%; left: -12px; transform: translateY(-50%); font-size: 2rem; color: #2677f0;}

#head-gnb .gnb-wrap .gnb-menu .categorymenu-group .categorymenu-list .menu-customer {width: 12%; padding-top: 3rem; padding-left: 2rem; padding-bottom: 3rem; background-color: #f9f9f9; border-left: 1px solid #e8e8e8; border-right: 1px solid #e8e8e8;}
#head-gnb .gnb-wrap .gnb-menu .categorymenu-group .categorymenu-list .menu-customer .tit {display: flex; align-items: center; flex-wrap: wrap; height: 3.4rem; transform: rotate(-0.03deg); font-size: 1.7rem; color: #111; font-weight: 600; letter-spacing: -0.08rem; margin-bottom: 1rem;}
#head-gnb .gnb-wrap .gnb-menu .categorymenu-group .categorymenu-list .menu-customer .tit i {font-size: 2.4rem; color: #888888; font-weight: 400; margin-left: 0.5rem;}
#head-gnb .gnb-wrap .gnb-menu .categorymenu-group .categorymenu-list .menu-customer a {position: relative; display: block; width: 100%; height: auto; background: none; box-shadow: none; padding: 0; transform: rotate(-0.03deg); font-size: 1.5rem; color: rgba(0,0,0, .52); font-weight: 500; line-height: 1.4; margin-bottom: 0.5rem;}
#head-gnb .gnb-wrap .gnb-menu .categorymenu-group .categorymenu-list .menu-customer a:hover {color: #2677f0; text-decoration: underline;}
#head-gnb .gnb-wrap .gnb-menu .categorymenu-group .categorymenu-list .menu-customer a:hover:after {content: "*"; position: absolute; top: 50%; left: -12px; transform: translateY(-50%); font-size: 2rem; color: #2677f0;}

/* »ó´Ü GNB Ä«Å×°í¸® ¸Þ´º - ¸Þ´ºº° µå·Ó´Ù¿î ¸Þ´º °³º° ¿ÀÇ ¿µ¿ª */
#head-gnb .gnb-wrap .gnb-menu .menu-list {height: 60px; margin-left: 2.5rem;}
#head-gnb .gnb-wrap .gnb-menu .menu-list > ul {text-align: left; overflow: visible;}
#head-gnb .gnb-wrap .gnb-menu .menu-list > ul > li {display: inline-block; position: relative; overflow: visible; margin-right: 3.6rem; vertical-align: middle;}
#head-gnb .gnb-wrap .gnb-menu .menu-list > ul > li > a {height: 60px; line-height: 60px; transform: rotate(-0.03deg); font-size: 1.85rem; color: #111827; font-weight: 700; letter-spacing: -0.035rem; display: inline-block; position: relative; transition: var(--transition);}
#head-gnb .gnb-wrap .gnb-menu .menu-list > ul > li > a:after {content: ""; opacity: 0; height: 4px; background-color: var(--blue); position: absolute; bottom: -1px; left: 50%; right: 50%; transition: var(--transition);}
#head-gnb .gnb-wrap .gnb-menu .menu-list > ul > li:hover > a {color: var(--blue);}
#head-gnb .gnb-wrap .gnb-menu .menu-list > ul > li:hover > a:after {opacity: 1; left: -5px; right: -5px;}

.open-menu {position: absolute; top: 65px; left: -40px; height: 0; overflow: hidden; z-index: 10000000000;} /*index = 10*/
.open-menu .sub-menu {width: 220px; margin: 10px;}
.open-menu .menu-shadow {border-radius: 14px; background: #fff; border: 1px solid #e1dfdf; box-shadow: 7px 7px 9px -2px rgba(0, 0, 0, 0.065);}
.open-menu .menu-box {margin: 0; padding: 20px 0; border-radius: 20px; overflow: hidden;}
.open-menu .menu-box > li {display: block; padding: 0 20px; background: #fff;}
.open-menu .menu-box > li > a {display: block; height: 30px; line-height: 30px; font-size: 15px; color: #696a6a; font-weight: 400; text-align: left; padding: 0 10px; transition: var(--transition);}
.open-menu .menu-box > li:hover > a {color: var(--blue); font-weight: 800; padding: 0 10px 0 15px; background: #eee;}

#head-gnb .gnb-wrap .right-btn {position: relative; display: flex; align-items: center; flex-wrap: wrap;}
#head-gnb .gnb-wrap .right-btn .ex-menu {display: flex;}
#head-gnb .gnb-wrap .right-btn .ex-menu a {display: flex; align-items: center; width: auto; height: 46px; font-size: 1.85rem; color: #fff; font-weight: 500; padding: 0 1.8rem; background-color: var(--blue); border: 1px solid var(--blue); border-radius: 8px; transition: var(--transition);}
#head-gnb .gnb-wrap .right-btn .ex-menu a i {font-size: 2rem; margin-right: 1rem;}
#head-gnb .gnb-wrap .right-btn .ex-menu a:hover {color: var(--blue); background-color: #fff;}


/* ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */
/* °øÅë ºÎÆ®½ºÆ®·¦ ¸ð´Þ ¿µ¿ª common */
/* ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */

/* ºÎÆ®½ºÆ®·¦ ¸ð´Þ ½ÇÇà½Ã Àüü ½ºÅ©·Ñ »ý¼º ±ÝÁö */
html:has(body.modal-open),
body.modal-open {overflow: hidden !important; padding-right: 0 !important;}

/* ¸ð´Þ Æ˾÷ - 1:1 »ó´ã */
.qnaform_title {float: left; width: 100%;}
.qnaform_etctxt {float: left; width: 800px; height: 50px; font-family: "Noto Sans KR", sans-serif; font-size: 20px; color: #fff; font-weight: 400; line-height: 50px; text-align: center; background: #363636;}
.qnaform_etctxt span {font-size: 15px; font-weight: 300;}
.qnaform_table {float: left; width: 800px;}
#qnaform_tablelayout {font-family: "Noto Sans KR", sans-serif; margin-bottom: 10px; border-top: 1px solid #ccc; border-bottom: 1px solid #ccc;}
#qnaform_tablelayout tr th {width: 24%; font-size: 15px; color: #525151; font-weight: 500; text-align: center; padding: 5px 0; background-color: #f2f1f1; border-bottom: 1px solid #cbcaca;}
#qnaform_tablelayout tr td {font-size: 14px; font-weight: 400; color: #504f4f; padding: 8px 0 8px 15px; background-color: #fff; border-bottom: 1px solid #dadada;}
#qnaform_tablelayout tr:last-child th {border-bottom: 0;}
#qnaform_tablelayout tr:last-child td {border-bottom: 0;}
.qnaform_input {height: 33px; font-family: "Noto Sans KR", sans-serif; font-size: 14px; color: #737272; padding: 0 10px; margin-right: 10px; border: 1px solid #ccc;}
.qnaform_select {height: 35px; font-family: "Noto Sans KR", sans-serif; font-size: 14px; color: #737272; padding-left: 10px; margin-right: 7px; border: 1px solid #ccc;}
.qnaform_select_mobile {width: 80px;}
.qnaform_input_mobile {width: 80px;}
.qnatextarea_box {width: 80%; height: 80px; font-size: 13px; color: #757576; line-height: 24px; padding: 10px 0 0 10px; white-space: pre-line; border: 1px solid #ccc;}


/* ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */
/* °øÅë ÇÏ´Ü ÄÁÅÙÃ÷ - ÇÏ´Ü °øÁö»çÇ× ¹× ¼­ºñ½º ¿µ¿ª common */
/* ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */

/* °øÅë ÇÏ´Ü - ¹è³Ê ¿µ¿ª */
.foot-baneer {width: 100%; margin: 5rem 0;}
.foot-baneer .bannimg {width: 100%; border-radius: 2rem; overflow: hidden;}
.foot-baneer .bannimg img {width: 100%;}

/* °øÅë ÇÏ´Ü - °øÁö»çÇ× ¹× ¹Ù·Î°¡±â¹öÆ° ¿µ¿ª */
.foot-service {width: 100%; padding: 0 0 5rem;}
.foot-service .inner {margin: 0 auto; width: 100%; max-width: var(--max-width);}

.service-wrap {display: flex; gap: 5rem; width: 100%;}
.service-wrap .board .title {display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; padding-bottom: 1.4rem; border-bottom: 2px solid #111;}
.service-wrap .board .title h3 {font-size: 2.2rem; color: #000; font-weight: 700; line-height: 1; margin: 0 !important;}
.service-wrap .board .title .morebtn {display: flex;}
.service-wrap .board .title .morebtn a {display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; width: 100%; font-size: 1.35rem; color: #000; font-weight: 300;}
.service-wrap .board .title .morebtn a i {font-size: 1.65rem; padding-left: 1rem;}

.service-wrap .notice {flex: 1;}
.service-wrap .notice .notice-content ul {display: flex; flex-wrap: wrap; width: 100%;}
.service-wrap .notice .notice-content ul li {display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; width: 100%; height: 5rem; border-bottom: 1px solid var(--borderline);}
.service-wrap .notice .notice-content ul li a {display: flex; width: 100%; font-size: 1.55rem; color: #606060; font-weight: 500; line-height: 1; transition: var(--transition);}
.service-wrap .notice .notice-content ul li a:hover {color: var(--blue); text-decoration: underline;}

.service-wrap .bannerbtn {flex: 1;}
.service-wrap .bannerbtn .bannerbtn-list {display: grid; grid-template-columns: repeat(2, 1fr); width: 100%; border-bottom: 1px solid var(--borderline);}
.service-wrap .bannerbtn .bannerbtn-list .item-row {display: flex; width: 100%;}
.service-wrap .bannerbtn .bannerbtn-list .item-row a {display: flex; align-items: center; flex-wrap: wrap; gap: 2rem; width: 100%; height: 10rem;}
.service-wrap .bannerbtn .bannerbtn-list .item-row i {display: inline-flex; justify-content: center; align-items: center; width: 7rem; height: 6.95rem; font-size: 3rem; background: #f5f5f5; border-radius: 50%; transition: var(--transition);}
.service-wrap .bannerbtn .bannerbtn-list .item-row .bannitem {display: inline-flex; flex-direction: column; flex-wrap: wrap;}
.service-wrap .bannerbtn .bannerbtn-list .item-row .bannitem strong {font-size: 1.75rem; color: #363636; font-weight: 700; line-height: 1; margin-bottom: 1rem;}
.service-wrap .bannerbtn .bannerbtn-list .item-row .bannitem p {font-size: 1.45rem; color: #555; font-weight: 400; line-height: 1;}

.service-wrap .bannerbtn .bannerbtn-list .item-row a:hover i {color: #fff; background: var(--blue);}
.service-wrap .bannerbtn .bannerbtn-list .item-row a:hover .bannitem strong {color: var(--blue);}


/* ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */
/* Footer ÇÏ´Ü ¿µ¿ª °øÅë common */
/* ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */

/* ÇÏ´Ü À¯Àú ¹Ù·Î°¡±â¸Þ´º ¿µ¿ª */
.foot-use {width: 100%; background: #161616; border-bottom: 1px solid #353535;}
.foot-use .inner {margin: 0 auto; width: 100%; max-width: var(--max-width);}

.foot-usemenu {display: flex; align-items: center; height: 6rem;}
.foot-usemenu a[type="button"] {font-size: 1.5rem; color: #7f7f7f; font-weight: 400; letter-spacing: -0.025rem; margin-right: 2.5rem; transition: var(--transition);}
.foot-usemenu a {font-size: 1.5rem; color: #7f7f7f; font-weight: 400; letter-spacing: -0.025rem; margin-right: 2.5rem; transition: var(--transition);}
.foot-usemenu a:last-child {margin-right: 0;}
.foot-usemenu a[type="button"]:hover {color: #fff;}
.foot-usemenu a:hover {color: #fff;}

/* ÇÏ´Ü ·Î°í ¹× »ç¾÷ÀÚÁ¤º¸, °í°´¼¾ÅÍ ¿µ¿ª */
.foot-wrap {width: 100%; padding: 5rem 0; background: var(--black);}
.foot-wrap .inner {display: flex; justify-content: space-between; flex-wrap: wrap; margin: 0 auto; width: 100%; max-width: var(--max-width);}

.foot-wrap .foot-left {width: 54%;}
.foot-wrap .foot-left .foot-logo {display: inline-flex; width: auto; opacity: 0.7;}
.foot-wrap .foot-left .foot-logo img {width: 100%;}
.foot-wrap .foot-left .foot-address {display: inline-flex; flex-wrap: wrap; margin-top: 3rem;}
.foot-wrap .foot-left .foot-address address {font-style: normal;}

.foot-wrap .foot-left .foot-address ul li {position: relative; display: inline-flex; padding-right: 2rem; margin-bottom: 1rem;}
.foot-wrap .foot-left .foot-address ul li strong {font-size: 1.5rem; color: rgba(255,255,255,0.6); font-weight: 600; line-height: 1.1; letter-spacing: -0.025rem; margin-right: 1rem;}
.foot-wrap .foot-left .foot-address ul li p {font-size: 1.5rem; color: rgba(255,255,255,0.4); font-weight: 400; line-height: 1.1; letter-spacing: -0.025rem;}
.foot-wrap .foot-left .foot-copyright {font-size: 1.4rem; color: rgba(255,255,255,0.3); font-weight: 300; line-height: 1.1; letter-spacing: 0.02rem;}

.foot-wrap .foot-right .foot-customer p {font-size: 1.85rem; color: #fff; font-weight: 600; line-height: 1.1; letter-spacing: -0.035rem; text-align: right; margin-bottom: 1rem;}
.foot-wrap .foot-right .foot-customer p.call {font-family: "SCoreDream", sans-serif; transform: rotate(-0.03deg); font-size: 3rem; color: #fff; font-weight: 700; line-height: 1.1; letter-spacing: -0.035rem; text-align: right; margin-top: 1rem !important;}
.foot-wrap .foot-right .foot-hours {margin-top: 1rem;}
.foot-wrap .foot-right .foot-hours span {display: inline-flex; font-size: 1.45rem; color: rgba(255,255,255,0.4); font-weight: 400; line-height: 1.1; letter-spacing: -0.035rem; text-align: right; margin-bottom: 0.4rem;}
.foot-wrap .foot-right .foot-hours span:nth-of-type(2) {margin-left: 1rem;}
.foot-wrap .foot-right .foot-certifymark {display: flex; justify-content: flex-end; margin-top: 1.9rem;}
.foot-wrap .foot-right .foot-certifymark ul li {display: inline-flex; width: 8rem;}
.foot-wrap .foot-right .foot-certifymark ul li:last-child {margin-left: 1rem;}
.foot-wrap .foot-right .foot-certifymark ul li img {width: 100%;}


/* ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */
/* ¿ìÃø QuickMenu common */
/* ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */

#quickmenu {position: fixed; right: 20px; top: 50%; transform: translateY(-50%) translateX(20px); z-index: 90; opacity: 0; visibility: hidden; pointer-events: none; transition: opacity .3s ease, visibility .3s ease, transform .3s ease;}
#quickmenu.show {opacity: 1; visibility: visible; pointer-events: auto; transform: translateY(-50%) translateX(0);}
#quickmenu.hide-bottom {opacity: 0; visibility: hidden; pointer-events: none; transform: translateY(-50%) translateX(20px);}

#quickmenu .quickmenu-list ul {display: grid; gap: 10px;}
#quickmenu .quickmenu-list ul li a {width: 105px;}