@charset "utf-8";
@import url('http://fonts.googleapis.com/earlyaccess/notosanskr.css');
@import url('https://cdn.jsdelivr.net/gh/orioncactus/pretendard/dist/web/static/pretendard.css');
@import url('https://fonts.googleapis.com/css2?family=Outfit:wght@100;200;300;400;500;600;700;800;900&display=swap');
 
@font-face {
    font-family: "KingSejong";
    src : url('../Typo_KingSejong_Jeongeum.ttf') format('truetype');
}

*, html {box-sizing: border-box; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; } 
*, *:before, *:after {box-sizing: border-box;-webkit-box-sizing: border-box; -moz-box-sizing: border-box;}

html, body, div, p, span, strong, b, em, iframe, pre, h1, h2, h3, h4, h5, h6, img, dl, dt, dd, fieldset, form, legend, label, table, caption, thead, tbody, tfoot, tr, th, td, ul, ol, li, a, input, select, textarea {margin: 0;padding: 0; border:none; }
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; padding:0;margin:0; font-family: 'Outfit', 'Pretendard', "Noto Sans KR", sans-serif !important;} 
body { line-height:1.4; color:#333; font-family: 'Outfit', 'Pretendard', "Noto Sans KR", sans-serif !important; word-break:keep-all;   -webkit-text-size-adjust: none; text-size-adjust: none;-o-text-size-adjust: none;} 
button {font-family: 'Outfit', 'Pretendard', "Noto Sans KR" ,sans-serif !important;  -webkit-appearance: none; -moz-appearance: none; appearance: none; cursor:pointer;}
button, select, input, button, textarea,pre  {font-family: 'Outfit', 'Pretendard', "Noto Sans KR" ,sans-serif !important;}

ul,li,ol,dl,dd,dt{list-style:none;word-break:keep-all;line-height:1.4;}
em, address {font-style: normal;}
caption {overflow: hidden;width: 0;height: 0;font-size: 0; line-height: 0;}
table{margin:0px;border-collapse:collapse;border-spacing: 0;}
td,th{-ms-word-break:keep-all;word-break:keep-all;vertical-align: middle;}
ol:after, ul:after{display:none}

img{display:block; border:0;line-height:0; max-width:100%;}
input[type='text'] , textarea, button, select {-webkit-border-radius: 0;}
textarea, button, select {-webkit-appearance: none; -webkit-border-radius: 0;}
button {padding: 0 !important;}
a, b, span, strong{ font-family: 'Outfit', 'Pretendard', "Noto Sans KR", sans-serif !important; }
a:link, a:visited{text-decoration:none;color:inherit}
a:active, a:hover{color:inherit;text-decoration:none;}
a img, input.type-image {border:none;}
strong{font-weight:500}
form{margin:0; padding:0}
input.type-text, textarea {border:1px solid #ddd;background:#fff;padding:1px;}
input[type=button] {cursor: pointer;}
select{border:1px solid #ddd;padding:1px; color: #000;}
input:focus, button:focus, textarea:focus  {outline: none;}
input:-internal-autofill-selected, button:-internal-autofill-selected {background-color:#fff !important;}




header{display:none}
#header2024{display:block;}

.wrap8{width:89.5%; max-width:1800px; margin:0 auto;}
.wrap2{width:90%; max-width:1600px; margin:0 auto 5rem;}
.wrap4{width:90%; max-width:1400px; margin:0 auto;}
.wrap{width:90%; max-width:1600px; margin:0 auto;}
.flex{display:flex; flex-wrap:wrap; align-items:center;justify-content: space-between;}
.p150{padding:150px 0;}
.pb0{padding-bottom:0 !important}
.pt0{padding-top:0 !important}


.side-btn dl { background-color:#d75600; text-align:center; padding:20px 0}
.side-btn dt {text-align:-webkit-center; width:100%; padding-bottom:5px}
.side-btn dd {text-align:center; color:#fff}
.side-btn{position:fixed; top:50%; transform:translateY(-50%); right:0; z-index:9999;  border-radius:15px 0 0 15px; overflow:hidden; box-shadow:0 0 10px rgba(0,0,0,.07)}
.side-btn ul{display:flex; flex-flow:column;}
.side-btn ul li:nth-child(n+2){border-top:1px solid rgba(255,255,255,.2)}
.side-btn ul li a{display:flex; flex-flow:column; align-items:center;  justify-content: center; text-align:center; background:#0072bc; width:100%; height:100%; padding:12px 9px; height:90px}
.side-btn ul li a img{width:40px; opacity:0.8}
.side-btn ul li p{font-size:14px; font-weight:400; line-height:1; margin-top:6px; color:#fff;}
.side-btn ul li:hover a{background:#006299; transition:.2s;}
.side-btn ul li:hover a img{opacity:1}

#header2024{width:100%; position: absolute; top:0; left:0; height:150px; z-index:999999}
#header2024 .wrap8{height:150px; }
a.logo img{height:80px;}
#header2024 .wrap8{position:relative}
.dcmi{position:absolute; bottom:-40px; right:0px; transition:.2s; display:none}
.dcmi a{display:flex; flex-wrap:wrap; background: #977c5a; border-radius: 8px;  padding: 0px 25px 0px 25px;}
.dcmi:hover a{background:#714f24;transition:.2s}
.dcmi a p{color: #fff;  font-size: 14px; font-weight: 600;line-height:40px; }
.dcmi a img{width:20px; margin-left:10px;}

/*sticky*/
.sticky{background:rgba(255,255,255,.8); box-shadow:0 0 10px rgba(0,0,0,.2); transition:.3s;}

/*메뉴*/
.menu > li {position:relative;}
@media (min-width: 1024px) {


.menu > li > a{padding:0 30px; font-size:19px; line-height:150px; font-weight:600; }
.menu > li:hover > a{color:#714f24; font-weight:700}
.sub-menu { position: absolute; top:150px; left:50%; margin-left: 0px; border-radius:10px; opacity: 0; pointer-events: none; overflow:Hidden; -webkit-transition: 0.5s all 0.1s;-moz-transition:0.5s all 0.1s ;-ms-transition: 0.5s all 0.1s;-o-transition: 0.5s all 0.1s;background:#055257; -webkit-box-shadow: 0 0 20px rgba(145, 150, 124, 0.2);-moz-box-shadow: 0 0 20px rgba(145, 150, 124, 0.2);box-shadow: 0 0 20px rgba(145, 150, 124, 0.2);}
.menu  > li:hover .sub-menu {  opacity: 1; pointer-events: auto; margin-left: -85px;} 
.sub-menu li {position: relative; text-align:center; min-width:180px; line-height:1.3;}
.sub-menu li a {color:#fff; display: inline-block; padding:10px; width:100%; position:relative;  z-index:1;}
.sub-menu li a span{color:#fff; font-weight: 300;font-size:15px; line-height:1.3; }
.sub-menu li:hover {background: #997649;}
.sub_menu2{display:none !important}

}




/*언어*/
.lang-position{width:50px; height:150px; position:relative;}
.lang {position:absolute;  top: 50px; right:5%; background: #714f24; color: #fff; z-index:111; text-align: center;  width:50px; border-radius:100px; font-size:15px; font-weight: 500;}
.lang > a {display:block; font-weight:500;height: 50px; line-height: 50px; border-radius:100px;}
.lang > a:hover {background: rgba(93, 104, 69,0.05); }
#langLinks {width:100%; text-align: center; height: 0; border-bottom: none;overflow:hidden;  -webkit-transition: 0.3s;-moz-transition: 0.3s;-ms-transition: 0.3s;-o-transition: 0.3s;transition: 0.3s;}
.lang.active #langLinks{display:block; height: 92px;}
#langLinks li {height: 30px; line-height: 30px; }
#langLinks li a {display:block;  color:rgba(255,255,255,0.5); font-weight: 300;}
.lang.active {-webkit-transition: 0.3s;-moz-transition: 0.3s;-ms-transition: 0.3s;-o-transition: 0.3s;transition: 0.3s;}
#langLinks li:hover a {color:#fff;}

/*모바일메뉴*/
.side_menu {display:none}
.sideOpen:before {display: none;}

/*visual*/
#visual {margin-top:150px;background:url('/images/common/bg_gradient.png') no-repeat center/100% 100% }
#visual .video{height:960px; background:#ddd; border-radius:40px; position:relative; overflow:hidden}
.video video{position:absolute; /*top:50%; left:50%; transform:translate(-50%, -50%); min-height:100%; min-width:100%*/ width:100%; height:100%}

/*국채보상운동 소개*/
#sec01{background:#fbf8f6}
.gukchae-title{flex-flow:column; margin-bottom:70px;}
.gukchae-title p{font-size:36px; line-height:1;font-family: "KingSejong" !important;}
.gukchae-title h1{font-size:76px; line-height:1; margin:20px 0 12px; font-family: "KingSejong" !important;}
.gukchae-title b{color:#555; font-weight:400; line-height:1.3; font-size:20px}
img.quotes{height:50px; margin-bottom:30px}
.gukchae li{width:calc(100%/3 - 50px);}
.gukchae li a{width:100%; height:100%; display:flex; flex-flow:column; align-items:center; text-align:center;}
.gukchae li img{height:130px; margin-bottom:20px}
.gukchae li a p{font-size:20px; font-weight:600; color:#444; line-height:1.3}
.gukchae li:hover a p{color:#000; transition:.2s;}

/*타이틀 공통*/
.main-title{width:100%;margin-bottom:60px; align-items:flex-end}
.main-title > .txt{display:flex; flex-flow:column; align-items:flex-start;}
.main-title > .txt b{font-size:21px; font-weight:400; letter-spacing:1px; line-height:1; position:relative;}
.main-title > .txt b::before{content:''; display:block; width:6px; height:6px; background:#cc0009; border-radius:20px; position:absolute; bottom:4px; right:-12px;}
.main-title > .txt h1{font-size:48px; font-weight:800; line-height:1; margin:15px 0 12px}
.main-title > .txt p{font-size:18px; color:#555;}
.main-title > .more{position: relative; width:50px; height:50px; border-radius:100px; border:1px solid #000;}
.main-title > .more a{width:100%; height:100%; display:flex; flex-wrap:wrap; align-items:center; justify-content:center;}
.main-title > .more a b{font-size:30px; font-weight:300}
.main-title > .more:hover{background:#000; color:#fff; transition:.2s;}
.main-title > .more:hover a b{ transform: rotate( 90deg ); transition:.2s;}

/*유네스코 process*/
.proc{width:100%;}
.proc li{width:calc(100%/3 - 50px); height:340px; background:#fff; padding:40px; border-radius:20px; box-shadow:0 0 20px rgba(0,0,0,.25); position:relative; overflow:hidden; z-index:10}
.proc li::before{content:''; display:block; width:100%; height:70%; background: rgb(0,0,0); background: linear-gradient(0deg, rgba(0,0,0,.5) 0%, rgba(0,0,0,0) 100%);  position:absolute; bottom:0; left:0; z-index:-1;}
.proc li span{padding:10px 18px; font-size:15px; line-height:1; color:#fff; background:#cc0009; border-radius:100px; font-weight:500}
.proc li p {position:absolute; bottom:40px; left:40px; font-size:20px; line-height:1.3; font-weight:500; color:#fff}
.proc li:nth-child(1){background:url('/new_images/sub/step01.jpg') no-repeat center/cover}
.proc li:nth-child(2){background:url('/new_images/sub/step02.jpg') no-repeat center/cover}
.proc li:nth-child(3){background:url('/new_images/sub/step04.jpg') no-repeat center/cover}


/*행사안내*/
#sec02{background:#fbf8f6}
#sec02 .wrap{align-items:flex-start}
#sec02 .w50{width:48%}
.swiper {width: 100%; height: 100%;}
.swiper-slide {width:100%; text-align: center; display: flex;  justify-content: center;  align-items: center;}
.swiper-slide img { display: block; width: 100%;  height: 100%; object-fit: cover;}
.list-box > a{width:100%; height:100%; display:flex; flex-flow:column; align-items:flex-start}
.list-box .thum{width:100%; height:300px; margin-bottom:10px; background:#ddd}
.list-box span{ color:#666; margin-top:5px; padding:0 5px; font-size:15px; line-height:1;}
.list-box h1{font-size:18px; font-weight:600; padding:0 5px; width:100%; text-align:left; overflow: hidden;  text-overflow: ellipsis; display: -webkit-box;  -webkit-line-clamp: 1;  -webkit-box-orient: vertical;}
.down-btn{padding:0 5px; margin-top:5px; display:flex; flex-wrap:wrap; justify-content:flex-start}
.down-btn a:first-child{display:none;}
.down-btn a{font-size:14px; border:1px solid #888; color:#666; padding:0 10px;}
.down-btn a:nth-child(n+3){margin-left:3px;}
.down-btn a:hover{color:#fff; border:1px solid #000; background:#000; transition:.2s;}

/*공지사항*/
#sec03 .wrap4.flex{align-items:normal}
.board-box{width:48%;}
.ntc-tab {display:flex; flex-wrap:wrap; justify-content:flex-start; overflow: hidden; text-align: center;}
.ntc-tab li {color: #999; font-size: 40px;padding:10px; padding-top:0 !important; font-weight:700; transition:0.2s; cursor:pointer; box-shadow: none; overflow: hidden; position: relative; transform: translateZ(0);}
.ntc-tab li:nth-child(n+2){margin-left:10px}
.ntc-tab li:before {content: ''; height: 4px;position: absolute; left: 0; right: 100%; bottom: 0;  background: #777;  transition: right 0.3s ease-out;}
.ntc-tab li:hover:before, .ntc-tab li:focus:before, .ntc-tab li:active:before { right: 0;}
.ntc-tab li.click{ color: #cc0009; background: #fff; box-sizing:border-box;}
.ntc-tab li.click:before{background: #cc0009; content: ''; width:100%;  height: 4px; left: 0;bottom: 0; position: absolute;}
.ntc-tab li:hover {color: #777;}
.ntc-tab li.click:hover{ color: #cc0009;}
.tabcontent {display: none; overflow:hidden; margin-top:40px}
.tabcontent.click {display: block;}
.notice{width:100%; border-bottom:1px solid #ddd}
.notice li{border-top:1px solid #ddd; padding:25px 10px; align-items:flex-start; cursor:pointer }
.notice li:hover{background:rgba(0,0,0,.015)}
.notice li .data{width:150px; font-size:18px; font-weight:600; color:#cc0009; line-height:1}
.notice li h3{width:calc(100% - 150px); }
.notice li h3{font-weight:600; font-size:18px; line-height:1; overflow: hidden;  text-overflow: ellipsis; display: -webkit-box;  -webkit-line-clamp: 1;  -webkit-box-orient: vertical;}
.more-btn{display:flex; flex-wrap:wrap; align-items:center; justify-content:center; margin-top:30px;}
.more-btn a{background:#333; color:#fff; line-height:1; font-size:18px; padding:15px 35px; border-radius:100px; overflow:hidden; position: relative; transform: translateZ(0);  transition: color 0.3s ease;}
.more-btn a:before { position: absolute; bottom: 0; left: 0; right: 0; top: 0; background: #cc0009; color:#fff; content: ''; transform: scaleX(0); transform-origin: left; transition: transform 0.3s ease-out; z-index: -1;}
.more-btn a:hover, .more-btn a:focus, .more-btn a:active {color: #fff; cursor: pointer;}
.more-btn a:hover:before, .more-btn a:focus:before, .more-btn a:active:before {transform: scaleX(1);}

/*유튜브 링크 비디오*/
.u-link{display: flex;  flex-flow: column;  justify-content: space-between;}
.u-link h1{color: #000; display:flex; flex-wrap:wrap; align-items:center; font-size: 40px; font-weight:700; line-height:1.4}
.u-link h1 img{height:40px; margin-right:10px}
.u-video{width:100%; height:380px; background:#ddd; position:relative; border-radius:30px}
.u-video .you-btn{position:absolute; bottom:15px; right:15px; z-index:9}
.u-video iframe{width:100%; min-height:100%; position:absolute; top:50%; left:50%; transform:translate(-50%, -50%); border-radius:30px}

/*오시는길*/
.location .flex{align-items: flex-end;}
.loca-bg{width:60%; height:350px; /*background:url('/images/common/location-img.png') no-repeat center/cover*/}
.loca-txt{width:40%; height:350px; background:#EFF4F9; padding:50px; position:relative}
.loca-txt b{font-size:18px; font-weight:300}
.loca-txt h1{font-size:40px; font-weight:700; margin:10px 0 30px}
.loca-txt p, .loca-txt span{font-size:17px; line-height:1.4}
.loca-txt span{color:#cc0009; font-weight:600; margin-top:5px}
.map-link{position:absolute; bottom:50px; left:50px}
.map-link a.flex{border:1px solid #000; padding:10px 20px; flex-flow:row; align-items:center; justify-content:flex-start}
.map-link a img{height:11px; margin-left:10px}
.map-link a p{font-size:15px}


/*하단 로고*/
.logo-bn{width:100%; background:#f5f5f5; padding:40px 0;}
.logo-bn ul li{width:calc(100%/5 - 25px); border:1px solid #ddd; background:#fff; display:flex; flex-wrap:wrap; align-items:center; justify-content:center;}

/*footer*/
footer{display:block; background:#333; padding:40px 0}
.ft-menu{justify-content:flex-start; padding-bottom:15px; margin-bottom:15px; border-bottom:1px solid rgba(255,255,255,.2)}
.ft-menu li:nth-child(n+2){margin-left:20px;}
.ft-menu li a{font-size:15px; color:#fff;}
.ft-menu li:nth-child(2) a{color:#FFBC00; font-weight:500}
footer .info ul{justify-content:flex-start; }
footer .info ul li{color:#fff; font-size:15px;}
footer .info ul li:nth-child(n+2){padding-left:20px; position:relative; }
footer .info ul li:nth-child(n+2)::before{content:''; display:block; width:1px; height:15px; background:#fff; position:absolute; top:50%; left:10px; transform:translateY(-50%);}
footer .info p{margin-top:5px; color:rgba(255,255,255,.8); font-size:14px; font-weight:300;}

/*gotop*/
.gotop{z-index:99999;display: flex; flex-wrap: wrap; align-items: center; justify-content: center; cursor:pointer; position:fixed; bottom:20px; right:20px; width:52px; height:52px; border-radius:100px; background:#000; color:#fff; font-weight:500; font-size:15px; align-items:center; justify-content: center;}
.gotop p{color:#fff; -webkit-transform: rotate(-30deg); -moz-transform: rotate(-30deg); -ms-transform: rotate(-30deg); -o-transform: rotate(-30deg);  transform: rotate(-30deg);}
.gotop:hover p{transition: all .2s ease-in-out; transform: none; -webkit-transform: none; -moz-transform: none; -ms-transform: none; -o-transform: none;}


.winner  {
	width:31%;
	margin: 1%;
	text-align:center;
	float:left
	
}


.winner dl img{
	width:100%;
	
}


.winner dd{
	padding-top:15px;
	max-height:580px;
	line-height:1.3
	
	
}


.winner dd strong{
	font-weight:bold;
	font-size:1.5rem
	
	
}

@media (max-width: 1600px){
.p150{padding:130px 0;}

#header2024{ height:130px;}
#header2024 .wrap8{height:130px; }
a.logo img{height:70px;}

/*메뉴*/
.menu > li > a{padding:0 25px; font-size:18px; line-height:130px; }
.sub-menu {top:130px;}
.menu  > li:hover .sub-menu {margin-left: -85px;} 
.sub-menu li {min-width:170px;}

/*언어*/
.lang-position{height:130px;}
.lang {top: 42px;}

#visual { margin-top: 130px;}
#visual .video{height:750px}

/*국채보상운동 소개*/
.gukchae-title p{font-size:32px; }
.gukchae-title h1{font-size:70px;}
.gukchae-title b{font-size:19px}
img.quotes{height:45px; }
.gukchae li{width:calc(100%/3 - 70px);}
.gukchae li img{height:120px;}
.gukchae li a p{font-size:19px;}


/*타이틀 공통*/
.main-title{margin-bottom:50px;}
.main-title > .txt b{font-size:20px;}
.main-title > .txt h1{font-size:36px; font-weight:700;}
.main-title > .txt p{font-size:17px;}
.main-title > .more{width:46px; height:46px;}
.main-title > .more a b{font-size:28px}

/*행사안내*/
.list-box .thum{height:240px;}
.list-box h1{font-size:17px;}

/*공지사항*/
.ntc-tab li {font-size: 36px;padding:9px; }
.tabcontent {margin-top:35px}
.notice li{padding:20px 10px; }
.notice li .data{width:135px; font-size:17px;}
.notice li h3{width:calc(100% - 135px); }
.notice li h3{font-size:17px;}
.more-btn{margin-top:28px;}
.more-btn a{font-size:17px; padding:14px 32px;}

/*유튜브 링크 비디오*/
.u-link h1{font-size: 36px;}
.u-link h1 img{height:36px;}
.u-video{height:320px;}

/*유네스코 process*/
.proc li{width:calc(100%/3 - 30px); height:300px; padding:35px; border-radius:20px; }
.proc li::before{height:70%;}
.proc li span{padding:10px 18px; font-size:15px;}
.proc li p {bottom:35px; left:35px; font-size:19px;}


/*오시는길*/
.loca-txt{padding:46px; }
.loca-txt b{font-size:17px;}
.loca-txt h1{font-size:36px;}
.map-link{bottom:46px; left:46px}
}



@media (max-width: 1400px){
.p150{padding:110px 0;}

#header2024{ height:110px;}
#header2024 .wrap8{height:110px; }
a.logo img{height:65px;}

/*메뉴*/
.menu > li > a{padding:0 20px; font-size:17px; line-height:110px; }
.sub-menu {top:110px;}
.menu  > li:hover .sub-menu {margin-left: -80px;} 
.sub-menu li {min-width:160px;}
.sub-menu li a span{font-size:14px; }

/*언어*/
.lang-position{width:46px; height:110px;}
.lang { top: 33px;  width:46px; font-size:14px;}
.lang > a {height: 46px; line-height: 46px;}
.lang.active #langLinks{height: 90px;}
#langLinks li {height: 30px; line-height: 30px; }

/*visual*/
#visual { margin-top: 110px;}
#visual .video{height:650px}


/*국채보상운동 소개*/
.gukchae-title{margin-bottom:60px;}
.gukchae-title p{font-size:28px; }
.gukchae-title h1{font-size:60px; margin:18px 0 10px; }
.gukchae-title b{font-size:18px}
img.quotes{height:38px; margin-bottom:26px}
.gukchae li{width:calc(100%/3 - 50px);}
.gukchae li img{height:110px; margin-bottom:18px}
.gukchae li a p{font-size:18px;}

/*타이틀 공통*/
.main-title{margin-bottom:45px;}
.main-title > .txt b{font-size:18px;}
.main-title > .txt h1{font-size:34px;     margin: 13px 0 10px;}
.main-title > .txt p{font-size:16px;}
.main-title > .more{width:42px; height:42px;}
.main-title > .more a b{font-size:24px}

/*행사안내*/
.list-box .thum{height:260px;}
.down-btn a{font-size:13px; padding:0 5px;}


/*공지사항*/
.ntc-tab li {font-size: 34px;padding:9px; }
.tabcontent {margin-top:35px}
.notice li{padding:20px 10px; }
.notice li .data{width:135px; font-size:17px;}
.notice li h3{width:calc(100% - 135px); }
.notice li h3{font-size:17px;}
.more-btn{margin-top:28px;}
.more-btn a{font-size:17px; padding:14px 32px;}

/*유튜브 링크 비디오*/
.u-link h1{font-size: 36px;}
.u-link h1 img{height:36px;}
.u-video{height:320px;}

/*유네스코 process*/
.proc li{width:calc(100%/3 - 15px); height:260px; padding:32px; border-radius:16px; }
.proc li span{padding:9px 16px; font-size:14px;}
.proc li p {bottom:32px; left:32px; font-size:18px;}

/*하단 로고*/
.logo-bn{padding:30px 0;}
.logo-bn ul li{width:calc(100%/5 - 15px);}

/*footer*/
footer{padding:35px 0}
.ft-menu li:nth-child(n+2){margin-left:18px;}
footer .info ul li:nth-child(n+2){padding-left:18px; }
footer .info ul li:nth-child(n+2)::before{left:9px; }


/*오시는길*/
.loca-txt h1{font-size:34px;}
}



@media (max-width: 1230px){
.p150{padding:100px 0;}

#header2024{ height:90px;}
#header2024 .wrap8{height:90px; }
a.logo img{height:55px;}
.dcmi{bottom:-36px;}
.dcmi a{  border-radius: 6px; padding: 0px 22px 0px 22px;}
.dcmi a p{font-size: 13px; font-weight: 500; line-height:36px;}
.dcmi a img{width:16px; margin-left:8px;}


/*메뉴*/
.menu > li > a{padding:0 13px; font-size:15px; line-height:90px; }
.sub-menu {top:90px;}
.menu  > li:hover .sub-menu {margin-left: -75px;} 
.sub-menu li {min-width:140px;}
.sub-menu li a span{font-size:13px; }

/*언어*/
.lang-position{width:40px; height:90px;}
.lang { top: 25px;  width:40px; font-size:13px;}
.lang > a {height: 40px; line-height: 40px;}
.lang.active #langLinks{height: 90px;}
#langLinks li {height: 30px; line-height: 30px; }

/*visual*/
#visual { margin-top: 90px;}
#visual .video{height:580px}

/*국채보상운동 소개*/
.gukchae-title{margin-bottom:50px;}
.gukchae-title p{font-size:24px; }
.gukchae-title h1{font-size:54px; margin:16px 0 10px; }
.gukchae-title b{font-size:17px}
img.quotes{height:32px; margin-bottom:20px}
.gukchae li{width:calc(100%/3 - 20px);}
.gukchae li img{height:100px; margin-bottom:15px}
.gukchae li a p{font-size:17px;}

/*타이틀 공통*/
.main-title{margin-bottom:40px;}
.main-title > .txt b{font-size:17px;}
.main-title > .txt h1{font-size:30px;  margin: 10px 0 8px;}
.main-title > .txt p{font-size:15px;}
.main-title > .more{width:38px; height:38px;}
.main-title > .more a b{font-size:22px}

/*공지사항*/
.ntc-tab li {font-size: 30px;padding:8px; }
.tabcontent {margin-top:30px}
.notice li{padding:18px 8px; }
.notice li .data{width:120px; font-size:16px;}
.notice li h3{width:calc(100% - 120px); }
.notice li h3{font-size:16px;}
.more-btn{margin-top:25px;}
.more-btn a{font-size:16px; padding:12px 28px;}

/*유튜브 링크 비디오*/
.u-link h1{font-size: 30px;}
.u-link h1 img{height:30px;}
.u-video{height:280px;}

/*유네스코 process*/
.proc li{width:calc(100%/3 - 7px); height:220px; padding:28px; border-radius:15px; }
.proc li p {bottom:28px; left:28px; font-size:17px;}

/*오시는길*/
.loca-txt{padding:42px; }
.loca-txt b{font-size:17px;}
.loca-txt h1{font-size:30px; margin:8px 0 26px}
.loca-txt p, .loca-txt span{font-size:16px}
.map-link{bottom:42px; left:42px}
.map-link a.flex{padding:8px 18px}
.map-link a img{height:11px; margin-left:10px}
.map-link a p{font-size:14px}
}






@media (max-width: 1023px){
.side-btn{border-radius:13px 0 0 13px;}
.side-btn ul li a{padding:10px 8px; height:82px}
.side-btn ul li a img{width:35px; }
.side-btn ul li p{font-size:13px;margin-top:5px}

/*메뉴*/
.menu{display:none}
.lang-position{right:45px}

/*모바일메뉴*/
.side_menu {display: block; background: #000;height: 100%; right: -300px; position: fixed; top: 0; width: 300px; z-index:999999999999;-webkit-transition: all 300ms ease-in-out; transition: all 300ms ease-in-out;}
.side_menu .container{position:absolute;height:100%; width:100%; padding:120px 35px 20px; overflow-y:auto;}
.burger_box {display:block; position: fixed; top: 0px; right: 5%; z-index:9999999999999}
.burger_box a.menu-icon {display: inline-block; float: none; height: 60px; padding: 0px; opacity: 1; width: 60px; z-index: 100;color:#000;font-size:13px;}
.burger_box .menu-icon_box {display: inline-block; height: 30px; position: relative; text-align: left; width: 30px;margin-top:30px}
.burger_box .menu-icon_line {background: #000; display: inline-block; height: 2px; position: absolute; left:0px; width: 100%;top:30px}
.burger_box .menu-icon_line--1 {top: 3px;}
.burger_box .menu-icon_line--2 {top: 13px;}
.burger_box .menu-icon_line--3 {top: 23px;}
.burger_box .menu-icon_line--1 {transition: top 200ms 250ms, transform 200ms;-webkit-transition: top 200ms 250ms, -webkit-transform 200ms;}
.burger_box .menu-icon_line--2 {transition: opacity 0ms 300ms; -webkit-transition: opacity 0ms 300ms;}
.burger_box .menu-icon_line--3 {transition: top 100ms 300ms, transform 200ms; -webkit-transition: top 100ms 300ms, -webkit-transform 200ms;}
.burger_box .menu-icon {width:30px; height: 30px; cursor:pointer; text-align: center;}
.burger_box .menu-icon.opened .menu-icon_box {transform: scale3d(0.9, 0.9, 0.9); -webkit-transform: scale3d(0.9, 0.9, 0.9); right:-15px}
.burger_box .menu-icon.opened .menu-icon_line {top: 13px;}
.burger_box .menu-icon.opened .menu-icon_line--1 {transform: rotate3d(0, 0, 1, 45deg); -webkit-transform: rotate3d(0, 0, 1, 45deg); transition: top 100ms, transform 200ms 250ms; -webkit-transition: top 100ms, -webkit-transform 200ms 250ms; background: #fff;}
.burger_box .menu-icon.opened .menu-icon_line--2 {opacity: 0; transition: opacity 200ms; -webkit-transition: opacity 200ms;}
.burger_box .menu-icon.opened .menu-icon_line--3 {transform: rotate3d(0, 0, 1, -45deg); -webkit-transform: rotate3d(0, 0, 1, -45deg); transition: top 200ms, transform 200ms 250ms; -webkit-transition: top 200ms, -webkit-transform 200ms 250ms; background: #fff;}
.sideOpen:before {display: block;content:''; position:fixed; top:0; left:0; bottom:0; right:0; background: rgba(0,0,0,0.4); width:100%; height: 100vh; z-index:99999999;}
/* .sd_menu {display:table; width:100%; }
.sd_menu >  ul{display:table-cell; vertical-align:top;font-size:18px;} */
.sd_menu > ul >  li a,.sd_menu > ul >  li span{font-weight:700;line-height:45px;color:#fff; cursor:pointer;}
.sd_menu ul ul li a:before {content:'·'; margin-right: 5px;}


.sd_smenu {margin-bottom: 20px;}
.sd_smenu li a {font-weight: 400 !important;}
.sd_smenu li {font-size:15px}
.sd_smenu .on {position:relative;}
.sd_smenu .on:before {content:''; position:absolute; width:6px; height: 6px; border-radius:100%; background: #d54b4b; top:0; right:-5px;;}
.sd_menu ul ul li a {	-webkit-transition: all 0.15s;	-moz-transition: all 0.15s;	-o-transition: all 0.15s;	-ms-transition: all 0.15s;	transition: all 0.15s; line-height: 32px !important;}
.sd_menu ul li ul {	display:none; position:relative; top:auto;}
.sd_menu li.active  ul {height:auto;}



.sd_menu > ul > li {position:relative; text-align: left; margin-bottom: 10px; border-bottom: 1px solid rgba(255,255,255,0.2);}
.its-parent .active {color:#FFBC00; font-weight:600;cursor:pointer}
.its-parent span {position: relative;}
.its-parent span b {position: absolute; display: inline-block;width: 15px;height: 15px;z-index:1;transition:0.3s; right:0; top:50%; margin-top: -7.5px;}
.its-parent span b:after, .its-parent span b:before {content: ""; position: absolute; background: #aaa; transition:.4s;-webkit-transition:.4s;-moz-transition:.4s}
.its-parent span b:after {width: 100%; height: 1px; left: 0; top: 50%; margin-top: -0.5px;}
.its-parent span b:before {width: 1px; height: 100%; left: 50%; top: 0; margin-left: -0.5px;}
.its-parent .active b:before{ transform:rotate(90deg);-webkit-transform:rotate(90deg);-moz-transform:rotate(90deg);}
.sd_menu ul ul li a:hover {color:#FFBC00}
.sd_menu > ul > li:hover > a, .sd_menu > ul > li:hover > span {color:#FFBC00}

/*visual*/
#visual .video{height:500px; border-radius:30px}

/*국채보상운동 소개*/
.gukchae-title{margin-bottom:45px;}
.gukchae-title p{font-size:22px; }
.gukchae-title h1{font-size:48px; margin:15px 0 8px; }
.gukchae-title b{font-size:16px}
img.quotes{height:28px; margin-bottom:18px}
.gukchae li{width:calc(100%/3);}
.gukchae li img{height:90px; margin-bottom:13px}
.gukchae li a p{font-size:16px;}

/*타이틀 공통*/
.main-title{margin-bottom:30px;}
.main-title > .txt b{font-size:16px;}
.main-title > .txt b::before {width: 5px;  height: 5px;  bottom: 3px;   right: -10px;}
.main-title > .txt h1{font-size:25px;  margin: 8px 0 5px;}
.main-title > .txt p{font-size:14px;}
.main-title > .more{width:32px; height:32px;}
.main-title > .more a b{font-size:20px}

/*행사안내*/
.list-box .thum{height:220px;}
.list-box span{font-size:14px;}
.list-box h1{font-size:16px;}
.down-btn a{font-size:12px;}

/*공지사항*/
.board-box {width: 49%;}
.ntc-tab li {font-size: 25px;padding:7px; }
.tabcontent {margin-top:25px}
.notice li{padding:15px 7px; }
.notice li .data{width:110px; font-size:15px;}
.notice li h3{width:calc(100% - 110px); }
.notice li h3{font-size:15px;}
.more-btn{margin-top:20px;}
.more-btn a{font-size:15px; padding:11px 22px;}

/*유튜브 링크 비디오*/
.u-link h1{font-size: 25px;}
.u-link h1 img{height:25px; margin-right:8px;}
.u-video{height:260px;}

/*유네스코 process*/
.proc li{width:calc(100%/3 - 8px); height:200px; padding:20px; border-radius:14px; }
.proc li span{padding:8px 14px; font-size:13px;}
.proc li p {bottom:20px; left:20px; font-size:16px;}

/*하단 로고*/
.logo-bn{padding:25px 0;}
.logo-bn ul li{width:calc(100%/5 - 8px);}

/*오시는길*/
.loca-bg {width:48%; height: 300px;}
.loca-txt {width:52%; height: 300px;}
.loca-txt{padding:36px; }
.loca-txt b{font-size:16px;}
.loca-txt h1{font-size:25px; margin:6px 0 22px}
.loca-txt p, .loca-txt span{font-size:15px}
.map-link{bottom:36px; left:36px}
.map-link a.flex{padding:7px 15px}
.map-link a img{height:10px; margin-left:8px}
.map-link a p{font-size:13px}


/*footer*/
footer{padding:32px 0}
.ft-menu{padding-bottom:12px; margin-bottom:12px;}
.ft-menu li a{font-size:14px;}
footer .info ul li{font-size:14px;}
footer .info p{font-size:13px; line-height:1.3}

/*gotop*/
.gotop{ bottom:18px; right:18px; width:48px; height:48px; font-size:14px;}

}





@media (max-width: 768px){
.p150{padding:90px 0;}

.side-btn{border-radius:10px 0 0 10px;}
.side-btn ul li a{padding:12px; height:auto}
.side-btn ul li a img{width:34px; }
.side-btn ul li p{display:none}


#header2024{ height:80px;}
#header2024 .wrap8{height:80px; }
a.logo img{height:48px;}

.dcmi{width:100%; bottom:-32px;}
.dcmi a{justify-content: space-between;  align-items: center; width:100%; border-radius: 6px; padding: 8px 20px 8px 20px;}
.dcmi a p{width:calc(100% - 25px); font-size: 13px;line-height:1.3;}
.dcmi a img{width:15px; margin-left:0px;}

/*모바일메뉴*/
.burger_box .menu-icon_box {margin-top:25px}

/*언어*/
.lang-position{width:38px; height:80px; right:40px}
.lang { top: 20px;  width:38px; font-size:13px;}
.lang > a {height: 38px; line-height: 38px;}
.lang.active #langLinks{height: 80px;}
#langLinks li {height: 26px; line-height: 26px; }

/*visual*/
#visual { margin-top: 80px;}
#visual .video{height:360px}

/*국채보상운동 소개*/
.gukchae-title{margin-bottom:40px;}
.gukchae-title p{font-size:20px; }
.gukchae-title h1{font-size:42px; margin:13px 0 7px; }
.gukchae-title b{font-size:15px}
img.quotes{height:25px; margin-bottom:15px}
.gukchae li{width:calc(100%/3);}
.gukchae li img{height:80px; margin-bottom:10px}
.gukchae li a p{font-size:15px;}

/*타이틀 공통*/
.main-title{margin-bottom:30px;}
.main-title > .txt b{font-size:15px;}
.main-title > .txt h1{font-size:22px;}
.main-title > .txt p{font-size:14px;}
.main-title > .more{width:32px; height:32px;}
.main-title > .more a b{font-size:20px}

/*행사안내*/
#sec02 .w50 {width: 100%;}
#sec02 .w50:nth-of-type(n+2){margin-top:80px}
.list-box .thum{height:240px;}
.list-box span{font-size:13px; margin-top:3px}
.list-box h1{font-size:15px; font-weight:500}
.down-btn {margin-top:3px;}
.down-btn a{font-size:12px; padding:0 5px;}


/*공지사항*/
.board-box {width: 100%;}
.ntc-tab li {font-size: 22px;padding:6px; }
.tabcontent {margin-top:22px}
.notice li{padding:15px 5px; }
.notice li .data{width:95px; font-size:15px; }
.notice li h3{width:calc(100% - 95px); }
.notice li h3{font-size:15px;font-weight:500}
.more-btn{margin-top:20px;}
.more-btn a{font-size:14px; padding:10px 20px;}
.ntc-tab li:before, .ntc-tab li.click:before{height: 3px}

/*유튜브 링크 비디오*/
.u-link {margin-top:90px}
.u-link h1{font-size: 22px; margin-bottom:15px}
.u-link h1 img{height:22px; margin-right:5px;}
.u-video{height:260px;}

/*유네스코 process*/
.proc li{width:calc(100%/2 - 8px); height:220px; padding:18px; border-radius:12px; }
.proc li:nth-child(3){width:100%; margin-top:15px}
.proc li span{padding:8px 14px; font-size:13px;}
.proc li p {bottom:18px; left:18px; font-size:15px;}

/*하단 로고*/
.logo-bn{padding:22px 0;}
.logo-bn ul{    justify-content: flex-start;}
.logo-bn ul li{width:calc(100%/3 - 10px);}
.logo-bn ul li:nth-child(n+2){margin-left:15px;}
.logo-bn ul li:nth-child(4){margin-left:0;}
.logo-bn ul li:nth-child(n+4){margin-top:15px;}

/*오시는길*/
.loca-bg {width:40%; height: 300px;}
.loca-txt {width:60%; height: 300px;}
.loca-txt{padding:30px; }
.loca-txt b{font-size:15px;}
.loca-txt h1{font-size:22px; margin:6px 0 22px}
.loca-txt p, .loca-txt span{font-size:15px}
.map-link{bottom:30px; left:30px}

/*footer*/
footer{padding:28px 0}
.ft-menu{padding-bottom:10px; margin-bottom:10px;}
.ft-menu li:nth-child(n+2){margin-left:14px;}
.ft-menu li a{font-size:13px;}
footer .info ul {flex-flow: column;  align-items: flex-start;}
footer .info ul li{font-size:13px;}
footer .info ul li:nth-child(n+2){padding-left:0px; }
footer .info ul li:nth-child(n+2)::before{display:none}
footer .info p{font-size:12px; padding-right:50px}

/*gotop*/
.gotop{ bottom:15px; right:15px; width:40px; height:40px; font-size:12px;}
}





@media (max-width: 600px){
.dcmi{bottom:-50px;}
.dcmi a{height:50px; }
.dcmi a img{width:17px;}
}




@media (max-width: 500px){
.p150{padding:70px 0;}

#header2024{ height:65px;}
#header2024 .wrap8{height:65px; }
a.logo img{height:42px;}

/*언어*/
.lang-position{width:35px; height:65px;}
.lang { top: 15px;  width:35px; font-size:12px;}
.lang > a {height: 35px; line-height: 35px;}
.lang.active #langLinks{height: 70px;}
#langLinks li {height: 22px; line-height: 22px; }


/*모바일메뉴*/
.side_menu {right: -260px; width: 260px}
.side_menu .container{padding:100px 25px 20px;}
.burger_box a.menu-icon { height: 60px; width: 60px; font-size:13px;}
.burger_box .menu-icon_box {height: 25px; width: 25px; margin-top:20px}
.burger_box .menu-icon {width:25px; height: 25px;}
.burger_box .menu-icon.opened .menu-icon_box {right:-5px}
.sd_menu >  ul{font-size:17px; transition:1s all;}
.sd_menu > ul >  li a,.sd_menu > ul >  li span{font-weight:600;line-height:40px;}
.sd_menu > ul >  li a{font-weight:300 !important}
.sd_smenu {margin-bottom: 15px;}
.sd_smenu li {font-size:14px}


/*visual*/
#visual { margin-top: 65px;}
#visual .video{height:210px; border-radius:20px}

/*국채보상운동 소개*/
.gukchae-title{margin-bottom:40px;}
.gukchae-title p{font-size:18px; }
.gukchae-title h1{font-size:36px; margin:13px 0 7px; }
.gukchae-title b{font-size:14px}
img.quotes{height:22px;}
.gukchae li img{height:70px; }
.gukchae li a p{font-size:14px;}

/*타이틀 공통*/
.main-title{margin-bottom:20px;}
.main-title > .txt {width: calc(100% - 50px);}
.main-title > .txt b{font-size:14px;}
.main-title > .txt h1{font-size:20px;}
.main-title > .txt p{font-size:13px; line-height:1.4}
.main-title > .more{width:28px; height:28px;}
.main-title > .more a b{font-size:18px}


/*공지사항*/
.ntc-tab li {font-size: 20px;padding:5px; }
.tabcontent {margin-top:20px}
.notice li{padding:15px 5px; }
.notice li .data{width:85px; font-size:14px; }
.notice li h3{width:calc(100% - 85px); }
.notice li h3{font-size:14px;}
.more-btn{margin-top:16px;}
.more-btn a{font-size:13px; padding:8px 15px;}
.ntc-tab li:before, .ntc-tab li.click:before{height: 2px}

/*유튜브 링크 비디오*/
.u-link {margin-top:70px}
.u-link h1{font-size: 20px; margin-bottom:13px}
.u-link h1 img{height:20px; margin-right:5px;}
.u-video{height:230px;}

/*유네스코 process*/
.proc li{width:100%; height:210px; padding:15px; border-radius:10px; }
.proc li:nth-child(n+2){margin-top:15px}
.proc li span{padding:7px 10px; font-size:12px;}
.proc li p {bottom:15px; left:15px; font-size:14px;}

/*오시는길*/
.location .flex{flex-flow:column;}
.loca-bg {width:100%; height: 200px;}
.loca-txt {width:100%; height: 260px;}
.loca-txt{padding:26px; }
.loca-txt b{font-size:14px;}
.loca-txt h1{font-size:20px; margin:5px 0 15px}
.loca-txt p, .loca-txt span{font-size:14px}
.map-link{bottom:26px; left:26px}


/*footer*/
.ft-menu li{width:50%}
.ft-menu li:nth-child(n+2) {margin-left: 0;}
.ft-menu li a {line-height: 1.6;}

/*하단 로고*/
.logo-bn ul li{width:calc(100%/3 - 5px);}
.logo-bn ul li:nth-child(n+2){margin-left:7px;}
.logo-bn ul li:nth-child(4){margin-left:0;}
.logo-bn ul li:nth-child(n+4){margin-top:7px;}
}




@media (max-width: 400px){
/*하단 로고*/
.logo-bn{padding:20px 0;}
.logo-bn ul{    justify-content: space-between;}
.logo-bn ul li{width:49%; margin-left:0 !important}
.logo-bn ul li:nth-child(n+3){margin-top:8px;}
}



@media (max-width: 340px){
.dcmi{bottom:-70px;}
.dcmi a{height:70px; padding:5px 15px }
.dcmi a img{width:17px;}
}