@charset "UTF-8";
/* @import url('https://cdn.jsdelivr.net/gh/orioncactus/pretendard/dist/web/static/pretendard.css'); */

@font-face {
  font-family: 'Pretendard';
  src: url('../font/Pretendard-Regular.ttf') format('truetype');
}

@font-face {
	font-family: '국립박물관문화재단클래식B';
	src: url('../font/국립박물관문화재단클래식B.ttf') format('truetype');
	font-weight: normal;
	font-style: normal;
}
@font-face {
	font-family: '국립박물관문화재단클래식L';
	src: url('../font/국립박물관문화재단클래식L.ttf') format('truetype');
	font-weight: 300;
	font-style: normal;
}
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	vertical-align: baseline;
	line-height:160%;
}
html, body { height:100%;}
body {font-family: 'Pretendard', sans-serif; font-size:16px; color:#373737; font-weight: 400; background: #fff;  width: 100%; overflow-x:hidden;}
address { font-style:normal;}
a { display:block;}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
	display: block;
}
li, ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}

table {
	border-collapse: collapse;
	border-spacing: 0;
}

input, select {
  appearance: none;
  -moz-appearance: none;
  -ms-appearance: none;
  -o-appearance: none;
  border:none;
  background:none;
  background-color:none;
  vertical-align:initial;
  font-size:inherit;
  font-family: inherit;
  line-height:inherit;
}

input[type=submit], button{
  cursor:pointer;
  background-color:#dfdfdf;
  border:none;
}

input[type=text]{
  background-color:#fff;
}
input[type=text]::placeholder{
  font-size: 0.8em;
  font-weight:300
}
select {
  background-color:#fff;
}
img {
	border:none;
	vertical-align:top;
	max-width:100%;
}

.clearfix:after {
	content:"";
	display:block;
	clear:both;
}
a:link, a:visited { color:inherit; text-decoration:none;}
a:active, a:hover { color:inherit; text-decoration:none;}

/* .site-wrap { height:100%;} */

/*hidden*/
.hidden { position:absolute; left:-9999px; font-size:1px; width:1px; height:1px; line-height:0; }

/*스킵메뉴*/
#skip_menu { width:300px; position:absolute; z-index:9999;}
#skip_menu a { position:absolute; top:-100px;}
#skip_menu a:hover,
#skip_menu a:active,
#skip_menu a:focus { position:absolute; top:0; width:300px; height:20px; display:block; background:#333; color:#fff; text-align:center; font-size:16px; font-weight:bold;}

/* wrapper */
.wrapper {max-width:1800px; margin:auto;}

/* 공통컬러 */
:root {
  --main-color: #101010;
  --point-color: #00a2e6;
  --lightgray-color: #eaecef;
}

@keyframes fadeInDown {
    0% {
        opacity: 0;
        transform: translate3d(0, -50%, 0);
    }
    to {
        opacity: 1;
        transform: translateZ(0);
    }
}


/* header */
#header { position: absolute; top: 0; left: 0; width: 100%; transition:all 0.3s linear; z-index: 9999;}
#header .hd_bg {display: none; position: relative; width: 100%; height: 285px; box-shadow:0 5px 5px rgba(0,0,0,0.2); overflow:hidden; z-index: 9998;}
#header .header_wrap {border-bottom: 2px solid #fff; padding: 3.75rem 0 0;color: #fff; position: relative; }
#header .logo {float: left; margin-bottom: 19px; }
#header .hdMenuWrap {float: right; padding-right: 4rem; position: relative; }
#header .ulDepth1 {display: flex;}
#header .ulDepth1 li {position: relative;}
#header .ulDepth1 li a {font-size: 1.25rem; font-weight: 600; padding: 0.5rem 2rem 1rem; text-align: center; position: relative;}
#header .ulDepth1 > li > a {min-width:80px; box-sizing:border-box;}
#header .ulDepth1 li a:hover, #header .ulDepth1 li.on > a {color: var(--point-color);}
#header .ulDepth1 li a:after {content:''; width: 0; height: 4px; background:var(--point-color); position: absolute; left: 50%; bottom:-2px; transform:translateX(-50%); transition:0.2s all linear;}
#header .ulDepth1 > li > a:hover:after, #header .ulDepth1 > li.on > a:after {width: 100%; transition:0.2s all linear;}

#header .ulDepth2 {position: absolute; width: 100%; height: 285px; padding-top: 1rem; left: 0; top: 100%; display: none; z-index: 9999; box-sizing:border-box;}
#header .ulDepth2 li {text-align: center;}
#header .ulDepth2 li a {font-size: inherit; text-align: center; padding: 0.5rem 0; letter-spacing:-0.5px; display: inline-block; margin: auto; text-shadow:2px 2px 3px rgba(0,0,0,0.2); position: relative; transform:none; }
#header .ulDepth2 li.on a, #header .ulDepth2 li a:hover {text-shadow:2px 2px 3px rgba(0,0,0,0);}
#header .ulDepth2 li a:after {content:''; width: 6px; height: 6px; border-radius:50%; background:var(--point-color); position: absolute; left: -12px; top: 10px;transform:none; opacity:0;}
#header .ulDepth2 > li.on > a:after, #header .ulDepth2 > li > a:hover:after {opacity:1; width: 6px;}

#header .search {width: 33px; height: 32px; background: url('../img/common/icon_search_wh.png') center no-repeat; text-indent:-99999px;position: absolute; right: 1rem; bottom: 1rem; cursor: pointer; z-index: 9999;}
.searchForm {display: none; position: relative; width: 100%; box-shadow:0 5px 5px rgba(0,0,0,0.2); overflow:hidden; z-index: 9998; text-align: center; box-sizing:border-box; padding: 5rem 0;}
.searchForm .schWrap {display: inline-block; border-bottom: 3px solid var(--main-color);}
.searchForm .schWrap .txt_sch {font-size: 1.875rem; font-weight: 600; padding: 0.5rem; float: left; background: transparent;}
.searchForm .schWrap .txt_sch::placeholder {font-weight: 600; color: #ccc;}
.searchForm .schWrap .txt_sch::focus {outline:0;}
.searchForm .schWrap .btn_sch {background: url('../img/common/icon_search_bk.png') center no-repeat; width: 52px; height: 52px; float: left; text-indent:-9999px;}

#header.subHeader {background: #fff; position: relative;}
#header.subHeader .header_wrap {color: var(--main-color); border-bottom: 2px solid var(--main-color); }
#header.subHeader .search {background-image: url('../img/common/icon_search_bk.png'); }
#header.subHeader .hd_bg {position: absolute; background: #fff;}
#header.subHeader .searchForm {position: absolute; background: #fff;}

#header.active {background: #fff;}
#header.active .header_wrap {color: var(--main-color); border-bottom: 2px solid var(--main-color);}
#header.active .ulDepth2 li a {text-shadow:2px 2px 3px rgba(0,0,0,0);}
#header.active .search {background-image: url('../img/common/icon_search_bk.png'); }
#header.active .search.on {background-image: url('../img/common/icon_close.png');}




/* footer */
#footer {background:var(--main-color); color:#fff; box-sizing:border-box; padding: 3.75rem 0;}
.ftTop {position: relative;}
.ftTop .ftMenu {}
.ftTop .ftMenu li {display: inline-block;}
.ftTop .ftMenu li + li {margin-left: 2rem;}
.ftTop .ftMenu li a {font-size: 1.125rem; font-weight: 600;}
.ftTop .ftMenu li a:hover {color: var(--point-color);}
.ftUtil {position: absolute; right: 0; top: -0.625rem;}
.ftUtil .gubun {box-sizing:border-box; float: left; border: 1px solid #fff; font-size: 1.125rem; padding: 1rem; min-width:200px; padding: 0.5rem 1rem; position: relative;}
.ftUtil .gubun + .gubun {border-left: none;}
.ftUtil .gubun.hp {width: 250px;}
.ftUtil .gubun:after {content:''; width: 12px; height: 8px; background: url("../img/common/icon_arrow_down_wh.png") center no-repeat; position: absolute; right: 1rem; top: 50%; transform:translateY(-50%);transition:0.2s all linear;}
.ftUtil .gubun.on:after {transform:translateY(-50%) rotate(180deg); transition:0.2s all linear;}
.ftUtil .utilTit {}
.ftUtil .utilList {display: none; position: absolute; bottom: 100%; width: calc(100% + 2px); height:194px; box-sizing: border-box; border: 1px solid #fff; left: -1px; overflow-y: scroll;}
.ftUtil .gubun.on .utilList {display: block;}
.ftUtil .utilList li {}
.ftUtil .utilList li + li {border-top: 1px solid #fff;}
.ftUtil .utilList li a {padding:0.375rem 1rem; font-size: 1rem; background: #303030; color: var(--main-color); font-weight: 500; color: #fff;}
.ftUtil .utilList li a:hover {background: #484848;}
.ftBot {margin-top: 2.5rem; position: relative; }
.ftBot .address {font-size: 1.125rem;}
.ftBot .ftInfo {line-height: 2;}
.ftBot .ftInfo b {display: inline-block;}
.ftBot .ftLogo {display: inline-block; margin-top: 2.5rem;}
.ftBot .copyright {position: absolute; right: 0; bottom: 0; font-size: 0.875rem;}


/* 반응형 */
@media(max-width:1919px){


}

@media(max-width:1800px){

	/* wrapper */
	.wrapper {padding:0 1%; box-sizing: border-box;}


}

@media(max-width:1600px){

}

@media(max-width:1200px){

	/* header */
	#header .header_wrap {padding: 2.5rem 0 0;}
	#header .logo {width: 280px;}
	#header .hdMenuWrap {padding-right: 3rem;}
	#header .ulDepth1 li a {font-size: 19px; padding: 0 1.75rem 1.125rem;}
	#header .search {width: 28px; height: 27px; bottom:1.25rem; background-size: cover;}


	/* footer */
	#footer {padding: 2.5rem 0 3.75rem;}
	.ftUtil .gubun {min-width:140px;}
	.ftUtil .gubun.hp {width: 200px;}
	.ftTop .ftMenu li + li {margin-left: 1.5rem;}

}

@media(max-width:1024px){

	/* header */
	#header {position: relative; background: #fff;}
	#header .header_wrap {height: 90px; box-sizing: border-box; padding: 0; border-bottom: none;}
	#header .wrapper {padding: 0;}
	#header .logo {float: none; margin: 0; position: absolute; left: 1rem; top: 50%; transform:translateY(-50%);}
	#header .hd_bg, #header .hdMenuWrap {position: fixed; top: 90px; height: calc(100% - 90px);}
	#header .hdMenuWrap {padding-right: 0; float: none; }
	#header .hd_bg {width: 100%; left: 0; background: rgba(0,0,0,0.5); overflow: hidden; z-index: -1;}

	#m_gnb {display: block;position: absolute; right: 1rem; top: 50%; transform:translateY(-50%); width: 40px; height: 32px; z-index: 200;}
	#m_gnb > div { display: block; margin-top: -2px; top: 2px; }
	#m_gnb > div, #m_gnb > div:after, #m_gnb > div:before { position: absolute; width: 40px; height: 4px; transition-timing-function: ease; transition-duration: .15s; transition-property: transform; border-radius: 4px; background: #000; }
	#m_gnb > div:before { top: 15px; transition-timing-function: ease; transition-duration: .15s; transition-property: transform,opacity; }
	#m_gnb > div:after { top:30px; }
	#m_gnb > div:after, #m_gnb > div:before { display: block; content:''; }
	.is-active #m_gnb > div{ transform: translate3d(0,15px,0) rotate(45deg); }
	.is-active #m_gnb > div:before { transform: rotate(-45deg) translate3d(-5.71429px,-11px,0); opacity: 0; }
	.is-active #m_gnb > div:after { transform: translate3d(0,-30px,0) rotate(-90deg); }

	#GNB{width:400px; right:-400px; background:#fff; overflow-x:hidden; overflow-y:auto; z-index:99;transition:0.2s all linear;}
	#GNB .ulDepth1{display:block;}
	#GNB .ulDepth1 > li{border-bottom:1px solid #eaeaea; float:none; width:100%;}
    #GNB .ulDepth1 > li:first-child{border-top: 1px solid #eaeaea;}
	#GNB .ulDepth1 > li > a{color:#222; height:auto; line-height:1.4; font-size:1.125rem; padding:1em 0;}
	#GNB .ulDepth2{padding:10px 0; border-right:none; height:auto; background-color:#f5f5f5; position:relative; top:0; left:0;}
	#GNB .ulDepth2 > li > a{ padding: 7px 0; text-shadow: none; color: var(--main-color); font-size: inherit;}

	.is-active #GNB {right: 0; transition:0.2s all linear;}

	#header .search {width: 33px; height: 32px; right: 5rem; bottom: 48%; transform: translateY(50%);background-image: url('../img/common/icon_search_bk.png'); }
	#header .search.on {background-image: url('../img/common/icon_close.png');}
	.searchForm {position: absolute; top: 90px; background: #fff; border-top: 2px solid var(--main-color);}


	/* footer */
	#footer {padding: 2.5rem 0;}
	.ftTop .ftMenu li a {font-size: inherit; font-weight: 400;}
	.ftUtil .gubun, .ftUtil .utilList li a {font-size: inherit;}
	.ftBot {margin-top: 2rem; border-top: 1px solid #999; padding-top: 5rem;}
	.ftBot .ftLogo {position: absolute; margin-top: 0; top: 1.75rem; left: 0;}
	.ftBot .address {font-size: inherit;}
	.ftBot .copyright {position: inherit; right: auto; bottom: auto; margin-top: 1rem;}
}

@media(max-width:970px){

	/* footer */
	#footer {text-align: center;}
	.ftUtil {position: inherit; top: auto; margin-top: 1rem;}
	.ftUtil .gubun {float: none; display: inline-block;}
	.ftUtil .utilTit, .ftUtil .utilList {text-align: left;}
	.ftUtil .gubun.hp {border-left: 1px solid #fff;}
	.ftBot {margin-top: 2.25rem;padding-top: 7rem;}
	.ftBot .ftLogo {transform: translateX(-50%); top: 2.25rem; left: 50%; width: 260px;}
	.ftBot .address {word-break:keep-all;}

}

@media(max-width:768px){

	body {font-size: 15px;}
	.wrapper {padding:0 1rem;}

 	/* header */
 	#header .header_wrap {height: 70px;}
	#header .logo {width: 240px;}
	#header .hd_bg, #header .hdMenuWrap {top: 70px; height: calc(100% - 70px);}

	#m_gnb {width: 32px; height: 30px;}
	#m_gnb > div, #m_gnb > div:after, #m_gnb > div:before {width: 32px; height: 3px;}
	#m_gnb > div:before {top: 13px;}
	#m_gnb > div:after {top: 27px;}
	.is-active #m_gnb > div:after {transform:translate3d(0,-27px,0) rotate(-90deg);}

	#header .search {width: 28px; height: 27px;right: 4.25rem; bottom: 50%;}
	.searchForm {padding: 3rem 0; top: 70px; }
	.searchForm .schWrap .txt_sch {font-size: 1.5rem;}
	.searchForm .schWrap .btn_sch {width: 40px; height: 40px; -webkit-background-size: inherit;	background-size: inherit;}



}

@media(max-width:640px){


}


@media(max-width:480px){

	body {font-size: 14px;}


	/* header */
	#header .header_wrap {height: 65px;}
	#header .logo {width: 200px; top: 52%;}
	#header .hd_bg, #header .hdMenuWrap {top: 65px; height: calc(100% - 65px);}

	#m_gnb {width: 30px; height: 26px;}
	#m_gnb > div, #m_gnb > div:after, #m_gnb > div:before {width: 30px;}
	#m_gnb > div:before {top: 11px;}
	#m_gnb > div:after {top: 22px;}
	.is-active #m_gnb > div {transform:translate3d(0,12px,0) rotate(45deg);}
	.is-active #m_gnb > div:after {transform:translate3d(0,-22px,0) rotate(-90deg);}

 	#header .search {width: 26px; height: 25px; right: 4rem;}
	.searchForm .schWrap {max-width:90%;}
	.searchForm { top: 65px; }
	.searchForm .schWrap .txt_sch {max-width:250px;font-size: 1.25rem;}
	.searchForm .schWrap .btn_sch {width: 29px; height: 28px; -webkit-background-size: cover; background-size: cover; margin-top: 5px; }

	#GNB{width:100%; right:-100%; }
	#GNB .ulDepth1 > li > a {font-size: 1rem; padding: 0.875rem 0;}
	#GNB .ulDepth2 {padding: 5px 0;}

	/* footer */
	#footer {padding: 2.25rem 0 2rem;}
	.ftTop .ftMenu li + li {margin-left:2rem}
	.ftBot {padding-top: 6rem;}
	.ftBot .ftLogo {width: 220px;}
	.ftUtil .gubun {min-width:120px; padding: 0.375rem 0.75rem;}
	.ftUtil .gubun.hp {width: 170px;}

}

@media(max-width:420px){

	/* footer */
	.ftTop .ftMenu {width: 90%; margin: auto;}
	.ftTop .ftMenu li:nth-child(4) {margin-left: 0;}
	.ftTop .ftMenu li:nth-child(4), .ftTop .ftMenu li:last-child {margin-top: 5px;}
}

@media(max-width:360px){

}