﻿@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@300;400;500;700;900&display=swap');
/*font-family: 'Noto Sans KR', sans-serif;*/
/* CSS Reset */
body, input, textarea, select, button, table { font-family: Noto Sans KR, sans-serif; font-size: 14px; line-height: 1.3; color:#4f4f4f;}
body, p, h1, h2, h3, h4, h5, h6, ul, ol, li, dl, dt, dd, table, th, td, iframe, form, fieldset, legend, input, textarea, button, select {margin:0;padding:0;}
body{position:relative; color:#000; }
table{border-collapse:collapse;}
img {vertical-align:top;}
img, fieldset{border:0;}
ul,ol{list-style:none;}
em,address{font-style:normal;}
a{
color:inherit;text-decoration:none; 

/* 링커에 영역잡히지 않는 스타일 */
-webkit-tap-highlight-color:rgba(0,0,0,0);
-webkit-tap-highlight-color:transparent; /* For some Androids */
outline:none;
selector-dummy :expression(this.hideFocus=true);
}
a:hover, a:active {text-decoration:none; color:inherit; }
a button, a label, a strong, a em, a span {cursor :pointer;} 
.hidd {width:1px;height:1px; overflow:hidden;text-indent:-300px;position:fixed;top:-200px;left:-600px;}
.bgno { background-image:none !important; } 
/* 페이지 가로세로 변환 또는 폰트 사이즈 변환 시, 사이즈 자동변환 방지 */
* {-webkit-text-size-adjust:none;}
iframe { border:0; resize:none; padding:0; margin:0 auto; display:block; }
.float_left { float:left !important;}
.float_right { float:right !important;}
.float_center { text-align:center !important;}
.body_stop { overflow: hidden !important; width: 100%; height: 100%; position: fixed; left: 0; top: 0; }
/*스크롤메뉴 오버시 body 멈춤*/
/* --------------------------------------------------------------------- 

/* header ------------------------------------------------------------------ */
.header {width:100%; height:120px; background:#fff; position:fixed; top:0; z-index:100;border-bottom:1px solid #d5d5d5; box-sizing:border-box;}
.header .c_box {height:100%;}
.header h1 {width:27%; max-width:260px; height:100%; position:absolute; left:0; top:50%; transform:translateY(-50%);}
.header h1 a { width: 100%; height: 100%; display: block; text-indent: -500px; overflow: hidden; background: url('/img/common/img_logo.png') no-repeat center; background-size: 100% auto; }
.header ul {width:52%; height:100%; margin-left:30%; overflow:hidden; }
.header ul li {position:relative; height:100%; min-height:10px; float:left; width:25%;}
.header ul strong a { display: block; text-align: right; line-height:120px; }
.header ul.all_gnb p { display: none; }
.header ul p a { display: block; text-align:right; line-height:30px;}
.header ul strong a:hover,
.header ul strong a.active { text-decoration:none; color:#013a6c;}
.header ul p a:hover,
.header ul p a.active { color:#013a6c;}
.header .pc_gnb {background:#fff; border-bottom:1px solid #d5d5d5; padding:20px 0; margin-top:1px;}
.header .pc_gnb ul strong a { display: none; }
.header .member_box {position:absolute; right:0; top:50%; transform:translateY(-50%);}
.header .member_box a {width:56px; height:28px; margin-left:-1px; line-height:28px; display:block; float:left; border:1px solid #d2d2d2; font-size:11px; text-align:center; font-weight:300;}
.header .btn_gnblist {
	width:25px; height:20px; position: absolute; left: 10px; top: 50%; transform: translateY(-50%); text-indent:-300px; overflow:hidden; display:none;
	background:url('/img/common/bul_gnblist.gif') no-repeat center; background-size:100% auto; 
}

/* footer ------------------------------------------------------------------ */
.footer {width:100%; padding:0 0 60px; background-color:#515151; display:block; overflow:hidden; zoom:1; color:#fff; font-size:12px; font-weight:300; position:relative; z-index:0;}
.footer h1 { width: 33%; max-width: 260px; height: 30px; position: absolute; right: 0; top: 50%; transform: translateY(100%); }
.footer h1 a { width: 100%; height: 100%; display: block; text-indent: -500px; overflow: hidden; background: url('/img/common/img_logo_gray.png') no-repeat center; background-size: 100% auto; }
.footer .f_list { padding:40px 0;}
.footer .f_list a:after{ content:''; border-right:1px solid #fff; width:10px; height:12px; display:inline-block; margin-right:10px; position:relative; top:2px;}
.footer .f_list a:last-child:after{display:none;}
.footer ul li {padding:5px 0;}

/* common ------------------------------------------------------------------ */
.c_box { width:100%; max-width:1000px; margin:0 auto; box-sizing:border-box; position:relative;}
.container { position:relative; padding-top:120px;padding-bottom:7%; z-index:10;}
.content { position: relative; z-index: 50; padding:40px 0; }
.list-4th { display: flex; flex-wrap: wrap; justify-content: space-between; }
.list-4th li { width:25%;}
.list-2th { display:flex; flex-wrap:wrap;justify-content:space-between;}
.list-2th li { width:50%; }

.mask { display:none; overflow:hidden; width:100%; height:100%; background:rgba(0,0,0,0.6); position:fixed; top:0; left:0; z-index:90;}
/* paging */
.paging a{vertical-align:middle;}
.paging .btn_arrow { display: inline-block; width: 40px; height: 40px; text-indent: -9999px; border: 1px solid #c0c0c0; box-sizing: border-box; overflow:hidden; }
.paging .btn_arrow.btn_a_l { background: url("https://www.aseankorea.org/assets/css/../images/sub/arrow-left.png") no-repeat center; }
.paging .btn_arrow.btn_a_r { background: url("https://www.aseankorea.org/assets/css/../images/sub/arrow-left.png") no-repeat center; transform: rotate(180deg); }
.paging .page_num { display: inline-block; vertical-align: middle; margin: 0 .5em; }
.paging .page_num a { line-height: 40px; margin: 0 .5em; display: inline-block; }
.paging .page_num a.active { color: #008bf6; font-weight: 600; }
/* search */
.search{height:40px;position:relative; background:#fff;}
.search .s_b { width: 230px; border: 1px solid #c0c0c0; height: 40px; box-sizing: border-box; overflow:hidden; }
.search .s_b input { width: calc(100% - 40px); height: 100%; padding: 0 1em; box-sizing: border-box; border:0 none;}
.search .s_b button { width: 40px; height: 100%; background: url("https://www.aseankorea.org/assets/css/../images/sub/board-search-icon.png") #f6f6f6 no-repeat center; overflow: hidden; text-indent: -9999px; border:0 none; float:right;}
.search select { height:40px; box-sizing: border-box; border: 1px solid #c0c0c0; float:left; margin-right:10px;}
.search select:after { content:'';  display: block; width: 5px; height: 5px; position: absolute; right: 1em; top: 20px; border: 1px solid #666; border-width: 0 1px 1px 0; transform: rotate(45deg); }
@media screen and (max-width:1200px) {
	.wrap {padding:0 .5em;box-sizing:border-box;}
}
@media all and (max-width:1000px) {
.c_box { margin:0; padding:0 10px;}
.header h1 {left:10px;}
.header .member_box {right:10px;}
}
@media all and (max-width:800px) {
.paging { width: 220px; float: none; margin: 0 auto; }
.board_foot .search { margin: 0; float: none; text-align: center; margin-top: 2em; }
.header {height:60px; }
.header h1 {min-width:220px; left:50%; transform:translateY(-50%) translateX(-50%);}
.header.m_head .btn_gnblist { display:block;}
.header.m_head .gnb_b {position:relative; background:#fff;width:200px; height:calc(100% - 60px); overflow:hidden; position:fixed; left:-200px; top:60px; box-sizing: border-box; padding-bottom: 70px; transition:all 0.3s ease;}
.header.m_head .gnb_b.gnb_on { left: 0; }
.header.m_head .gnb_b.gnb_on {left:0;}
.header.m_head ul.all_gnb {width:100%;margin-left:0; overflow:hidden; overflow-y:auto; box-sizing:border-box; padding:0 10px;}
.header.m_head ul.all_gnb li { height:auto; float:none; width:100%;}
.header.m_head ul.all_gnb strong a { text-align: left; line-height:40px; border-bottom:1px solid #d5d5d5; }
.header.m_head ul.all_gnb p { display: none; background:#eee; padding:5px 0 8px;}
.header.m_head ul.all_gnb p a {text-align:left; text-indent:10px;  }
.header.m_head .pc_gnb {display:none; visibility:hidden;}
.header.m_head .member_box { width:57%; right:auto; top:auto; left:50%; bottom:20px; transform:translateY(0) translateX(-50%);}
.footer .f_list { padding:20px 0 65px;}
.footer h1 {height: 30px; min-width:220px; right: auto; top: 60px; transform: translateY(0); }
.container { padding-top:60px;}
}
@media all and (max-width:750px) {
.list-4th li { width:50%; }
.list-2th li { width:100%; }
}
@media all and (max-width:640px) {
a:hover, a:active {text-decoration:none; }
.content { padding:20px 0; }
}
@media all and (max-width:480px) {
.list-4th li { width:100% !important; }
}
.slick-slider .slick-track, .slick-slider .slick-list { height:200px;}
.slick-slide {position:relative;}
.slick-slide .s_bg{ width:100%; height:100%; position:absolute; top:0; left:0; display:block;}
.slick-slide .s_bg.bg1 { background:url('/img/img/bg_main1_1.jpg') repeat-x center; }
.slick-slide .s_bg.bg2 { background:url('/img/img/bg_main2_1.jpg') repeat-x center; }
.slick-slide .s_bg.bg3 { background:url('/img/img/bg_main3_1.jpg') repeat-x center; }
.slick-arrow { display: block; width: 70px; height: 70px; background-position: center; background-color: rgba(0,0,0,0.5); background-repeat: no-repeat; border-radius: 40px; border: 2px solid rgba(256,256,256,0.3); position: absolute; top: 50%; transform:translateY(-50%); z-index:10; text-indent:-300px; overflow:hidden; transition:all 0.3s ease;}
.slick-prev { background-image: url('/img/common/arrow_slideL.png'); left:50%; margin-left:-550px;}
.slick-next { background-image: url('/img/common/arrow_slideR.png'); right:50%;  margin-right:-550px;}
.slick-slide .s_con {position:relative; width:100%; height:100%; max-width:1000px; margin:0 auto; color:#fff;display:flex; align-items:center; justify-content:center;}
.slick-slide .s_con p {width:90%;display:flex; height:50%; justify-content:center;  flex-wrap:nowrap;}
.slick-slide .s_con p span{ padding:0 3%; border-left:1px solid #fff; transform:skewX(-10deg); box-sizing:border-box; position:relative; display:flex; flex-direction:column; }
.slick-slide .s_con p span b {font-size:48px; font-weight:700; display:block; }
.slick-slide .s_con p span em {font-weight:300; font-size:14px;display:block; height:31%; width:100px; margin-top:auto;}
.slick-slide .s_con div { text-align:center;}
.slick-slide .s_con div h1 { font-size:30px; color:#7cbbea; position:relative;right:0; opacity:0;}
.slick-slide .s_con div h1 b { color:#f8d322}
.slick-slide .s_con div h2 { font-size:30px; position:relative;right:0; opacity:0;}
.slick-slide a {position:absolute; right:8%; bottom:7%; font-size:18px; font-style:italic; text-decoration:underline; transition:all 0.6s ease; opacity:0; color: #FFEB3B}
.slick-slide.slick-current.slick-active a { right:8%; opacity: 0; transition: all 0.3s ease; animation: sani1 2s 1s forwards ease; }
.slick-slide.slick-current.slick-active p span { right: 8%; opacity: 0; transition: all 0.3s ease;  }
.slick-slide.slick-current.slick-active p span:nth-of-type(1) { animation: sani2 1.2s 0.5s forwards ease; }
.slick-slide.slick-current.slick-active p span:nth-of-type(2) { animation: sani2 1.2s 0.8s forwards ease; }
.slick-slide.slick-current.slick-active p span:nth-of-type(3) { animation: sani2 1.8s 1.5s forwards ease; }
.slick-slide.slick-current.slick-active p span:nth-of-type(4) { animation: sani2 2.4s 2.2s forwards ease; }
.slick-slide.slick-current.slick-active h1 { animation: sani2 1.2s 0.5s forwards ease;right:0; opacity:0;}
.slick-slide.slick-current.slick-active h2 { animation: sani2 2s 1s forwards ease; right: 0; opacity: 0; }
@keyframes sani1 {
	0% { opacity: 0;  }
	100% { opacity: 1; }
}
@keyframes sani2 {
	0% { opacity: 0; right: 8%; }
	100% { opacity: 1; right: 0%; }
}
.container.main h1 { font-size: 30px; font-weight: 500; display: block; padding: 5% 0 3%; text-align: center; letter-spacing: -1px; clear: both; }
.container.main .tab_btn { display:flex; justify-content:flex-end; margin-top:20px;}
.container.main .tab_btn a { background:#f4f4f4; line-height:34px; padding:0 8px; font-size:12px; color:#1d79ce;}
.container.main .tab_btn a:first-child {padding-left:16px;}
.container.main .tab_btn a:last-child {padding-right:16px;}
.container.main .tab_btn a.btn_more { color:#000;}
.container.main .tab_btn a.btn_more:after {content:'+'; padding-left:3px;}
.container.main .tab_btn a.btn_more:hover:after {text-decoration:none;}

.archive_b li {width:24%; justify-content:space-between;}
.archive_b li a{width:100%; height:100%; display:block; box-sizing:border-box;position:relative; top:0; left:0;transition:all 0.3s ease;background:#fff;}
.archive_b li a strong {height:30px; padding:10px 15px;font-weight:normal; color:#888; font-size:12px; display:block;}
.archive_b li a .img {display:block;width:100%; overflow:hidden;}
.archive_b li a .img img {width:100%; min-height:100%;}
.archive_b li a .txt {padding:15px; line-height:1.5;}
.archive_b li a .txt h2 {color:#000; font-size:18px; display:block; height:60px; overflow:hidden;}
.archive_b li a .txt .info {color:#989898; display:block; margin-bottom:10%;}
.archive_b li a .txt .info2 { color: #989898; font-size:11px;}
.archive_b li a .txt .info2 span { display:block;}
.archive_b li a .txt .info2 span em {font-weight:600;}
.archive_b li a .txt .tag {color:#1d79ce; display:block;}
.archive_b li a .txt .tag span {padding-right:5px;}
.archive_b li a .txt .tag span:before {content:'#';}
.archive_b li a:after { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; transition:all 0.3s ease; display:block; box-sizing:border-box;border:1px solid #d6d6d6; border-top-color:#152c51;}
.archive_b li a:hover { box-shadow: 3px 5px 5px rgba(0,0,0,0.2); top:-3px; left:-3px;}
.archive_b li a:hover:after {border:2px solid #1d79ce;}

.joint_b li a {width:100%; height:100%; display:block; overflow:hidden; box-sizing:border-box;position:relative; background:#f6f6f6; }
.joint_b li a .img,
.joint_b li a .txt{width:50%; height:100%; float:left; overflow:hidden;}
.joint_b li a .img img{width:100%; min-height:100%; transform:scale(1); transition:all 0.3s ease; position:relative;}
.joint_b li a .txt { padding: 15px; line-height: 1.5; box-sizing:border-box;}
.joint_b li a .txt strong{ font-size:12px; color:#1399ba; font-weight:300;}
.joint_b li a .txt h2 { font-size:14px; margin:3% 0;line-height:1.3;}
.joint_b li a .txt p { font-size:14px; color:#a6a6a6;}
.joint_b li:nth-of-type(3) a .img ,
.joint_b li:nth-of-type(4) a .img {float:right;}
.joint_b li a:before {
	content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; transition: all 0.3s ease;
	display: block; box-sizing: border-box; border: 2px solid transparent; z-index:10;
}
.joint_b li a:hover:before { border-color: #1399ba; }
.joint_b li a:hover .img img { transform:scale(1.1); }

.notice_b ul { border: solid #505050; border-width: 1px 0; }
.notice_b ul li {  border-bottom:1px solid #c3c3c3; }
.notice_b ul li a { display: flex; padding: 3% 15%; box-sizing: border-box; transition:all 0.2s ease; }
.notice_b ul li a strong  {font-weight:normal; display:block; text-align:center; line-height:1.1; margin-right:7%;}
.notice_b ul li a strong span {font-size:40px; font-weight:300; display:block;}
.notice_b ul li a strong small {font-size:15px; display:block;}
.notice_b ul li a div {display:flex; flex-direction:column; justify-content:center;}
.notice_b ul li a h2 {font-size:20px; line-height:1.2; margin-bottom:5px;}
.notice_b ul li a p {color:#9a9a9a; line-height:1.4;}
.notice_b ul li a:hover {text-decoration:none;text-shadow:3px 3px 5px rgba(0,0,0,0.3); }
.notice_b ul li a:hover strong,
.notice_b ul li a:hover div { }
.notice_b ul li a:hover h2 {text-decoration:none;}
.notice_b ul li:last-child {border-bottom:0 none; }

.btn_offer { padding-bottom: 10px; color: #1d79ce; font-size: 12px; font-weight: 500; }
.btn_offer a:hover {text-decoration:underline; }
.count_b { padding-bottom: 10px; color: #a4a4a4; font-size: 12px; font-weight: 500; text-align: right; }
.country_b { text-align:right; margin-bottom:10px; }
.country_b a { width:34px; height:24px; display:inline-block; text-align:left; text-indent:-300px; overflow:hidden; background:url("/img/common/ico_flag.gif") no-repeat;}
.country_b a.btn_kor { background-position: 0 -32px; margin-right:3px; }
.country_b a.btn_kor.sel { background-position: 0 0; }
.country_b a.btn_eng { background-position: right -32px; }
.country_b a.btn_eng.sel { background-position: right 0; }

.board_list1 ul { border: solid #909090; border-width: 1px 0; padding: 10px 0; clear:both; }
.board_list1 ul li {
	background:#fff; border-bottom:1px solid #c3c3c3; padding:20px 0; display:flex; flex-wrap:wrap; flex-direction:row;
	box-sizing:border-box; position:relative; z-index:0; top:0; transition:all 0.4s ease;
}
.board_list1 ul li:last-child { border-bottom:0 none;}
.board_list1 ul li .b_img {width:30%; max-width:300px; height:auto;display:block; overflow:hidden; position:relative;}
.board_list1 ul li .b_img img { width: 100%; min-height: 100%; position: relative; left: 50%; top: 50%; transform: scale(1) translateY(-50%) translateX(-50%); transition: all 0.3s ease; display: block; }
.board_list1 ul li .b_txt { width:66%; margin-left:auto;position:relative; line-height:1.5;}
.board_list1 ul li .b_txt strong.depth3_tit { color: #b0196b; }
.board_list1 ul li .b_txt h2 {font-size:24px; margin:1% 0 2%;transition:all 0.3s ease; line-height:1.3;}
.board_list1 ul li .b_txt .data { margin-bottom:2%; }
.board_list1 ul li .b_txt .info { color: #989898; margin-bottom: 2%; }
.board_list1 ul li .b_txt .info2 { color: #1d79ce; }
.board_list1 ul li .b_txt .info3 { color: #989898; }
.board_list1 ul li .b_txt .info3 span { display:block;}
.board_list1 ul li .b_txt .info3 span em {font-weight:600;}
.board_list1 ul li .b_txt .info3 .float_left {padding-right:20px;}
.board_list1 ul li .b_txt .tag { color: #1d79ce; display: block; }
.board_list1 ul li .b_txt .tag span { padding-right: 5px; }
.board_list1 ul li .b_txt .tag span:before { content: '#'; }
.board_list1 ul li .b_txt .btn_download { position:absolute; right:0; bottom:0; color:#9a9a9a; border:1px solid #9a9a9a; padding:5px; display:block; font-size:12px;transition:all 0.3s ease;}
.board_list1 ul li:hover .b_img img { transform: scale(1.1) translateY(-50%) translateX(-50%); }
.board_list1 ul li:hover .b_txt h2 {color:#1d79ce;}
.board_list1 ul li:hover .b_txt .data {text-decoration:underline;}
.board_list1 ul li .b_txt .btn_download:hover {box-shadow:0 0 4px rgba(0,0,0,0.3);text-shadow:1px 1px 1px rgba(0,0,0,0.2); }

.viewbox_st1 ul {border:solid #505050; border-width:1px 0; overflow:hidden;}
.viewbox_st1 ul li { padding:30px 0; border-bottom:1px solid #c3c3c3; display:flex; flex-direction:row; flex-wrap:wrap; line-height:1.6; }
.viewbox_st1 ul li h2{ width:80px; font-size:18px; font-weight:800;}
.viewbox_st1 ul li .data { width:83%; margin-left:15px; box-sizing:border-box;}
.viewbox_st1 ul li:last-child { border-bottom:0 none;  }
.viewbox_st1 .vod_b { width:90%; padding-bottom:51%; position:relative; margin:0 auto;}
.viewbox_st1 .vod_b iframe { width:100%; height:100%; position:absolute;top:0; left:0;}
.viewbox_st1 .info { color: #989898; }
.viewbox_st1 .info span { display:block;}
.viewbox_st1 .info span em {font-weight:600;}
.viewbox_st1 .info .float_left {padding-right:20px;}
.viewbox_st1 .btn_layer {color:#fff; background:#1d79ce; padding:0 10px 0 5px;}
.viewbox_st2 dl {border:solid #505050; border-width:1px 0; overflow:hidden; line-height:1.6; }
.viewbox_st2 dl dt { border-bottom:1px solid #e9e9e9; padding:3% 4%;}
.viewbox_st2 dl dt strong { font-size:30px; display:block; line-height:1.2; margin-bottom:5px;}
.viewbox_st2 dl dt em { display:block; color:#9a9a9a;}
.viewbox_st2 dl dt em span:after{content:''; display:inline-block; width:7px; height:14px; margin-right:7px; border-right:1px solid #9a9a9a; position:relative; top:2px;}
.viewbox_st2 dl dt em span:last-child:after{display:none;}
.viewbox_st2 dl dd { border-bottom:1px solid #c3c3c3; padding:3% 4% 5%; color:#3e3e3e;}
.viewbox_st2 dl dd:last-child { border-bottom:0 none;}
.viewbox_st2 dl dt.dt_answer strong { font-size:20px;color:#1d79ce;}
.viewbox_st2 dl dt.dt_answer em {color:#3e3e3e;}
.view_list { margin-top: 50px; padding: 40px 30px; box-sizing: border-box; background: #f2f2f2; }
.view_list h2 { font-size:18px; font-weight:800; margin-bottom:20px; display:block; text-align:center;}
.view_list ul { font-size:16px; border-top:1px solid #d2d2d2;}
.view_list ul li { border-bottom:1px solid #d2d2d2;}
.view_list ul li a { display:block; padding:10px; }
.view_list ul li a:before { content:''; width:6px; height:6px; margin-right:10px; background:#000; display: inline-block; position:relative; top:50%; left:0; transform:translateY(-60%);  }
.con_data { font-size:18px; line-height:2; color:#444; padding:1% 0;}
.con_data img { width:80%; display:block; margin:2% auto;}
.btnbox { overflow:hidden; margin-top:3%; display:flex; justify-content: flex-end;}
.btnbox a{ min-width:90px; line-height:34px; text-align:center; background:#f4f4f4;margin-left:5px; font-size:12px;}
.btnbox a:first-child{margin-left:0;}

.sub_top { background: #162d54; }
.sub .sub_top .archive_b {padding:40px 10px; justify-content:}
.sub .sub_top .archive_b .list-4th {justify-content:initial;}
.sub .sub_top .archive_b .list-4th li {margin-right:1.33%;}
.sub .sub_top .archive_b .list-4th li:last-child {margin-right:0;}
.sub .sub_top .archive_b li a .txt h2 {font-size:17px; height:40px; overflow:hidden; line-height:1.2;margin-bottom:3%;}
.sub .sub_top .s_t_tit { min-height:200px; height:auto; text-align: center; display: flex; justify-content: center; align-items: center; }
.sub.community .sub_top .s_t_tit{background:#162d54 url('/img/img/bg_main3.jpg') no-repeat center;color:#fff; font-weight:800; font-size: 40px; color:#fff;}
.sub.forum .sub_top .s_t_tit { background: #162d54 url('/img/img/bg4.jpg') no-repeat center; padding:4% 0; box-sizing:border-box; flex-direction:column;}
.sub.forum .sub_top .s_t_tit strong { color: #6dc1f6; font-weight: 700; font-size: 30px; transition:all 0.3s ease;}
.sub.forum .sub_top .s_t_tit h1 { font-weight: 300; font-size: 45px; color:#fff;}
.sub.forum .sub_top .s_t_tit p { font-weight: 400; font-size:18px; color:#fff; margin-top:1%;transition:all 0.3s ease;}
.sub.forum .sub_top .s_t_tit span a { margin-top:10%;min-width:170px; font-size:18px; color:#fff; background:#162d54; border:1px solid #fff; display:inline-block; line-height:50px; padding:0 10px; box-sizing:border-box;transition:all 0.3s ease;}

.sub .sub_top .board_list1 ul { border: 0 none; padding:4% 0; }
.sub .sub_top .board_list1 ul li { background: transparent; border-bottom:0 none; padding:0; color:#fff; }
.sub .sub_top .board_list1 ul li .b_txt strong.depth3_tit { color: inherit; font-weight:300;}
.sub .sub_top .board_list1 ul li .b_txt .info { color: #fff;opacity:0.5; margin-bottom:1%;}
.sub .sub_top .board_list1 ul li .b_txt .a_publication a { display:inline-block; overflow:hidden; line-height:20px;}
.sub .sub_top .board_list1 ul li .b_txt .a_publication a:before {content:''; float:left; margin-right:5px; width:20px; height:20px; display:inline-block; background:url("/img/common/bul_arrow_link.png") no-repeat; background-size:100% auto; }
.sub .sub_top .board_list1 ul li .b_txt .a_publication a:hover {color:#5b9bd5;}
.sub .sub_top .board_list1 ul li .b_txt .a_publication a:hover:before {background-image:url("/img/common/bul_arrow_over.png");}
.sub .sub_top .board_list1 ul li .b_txt .btn_down { display:inline-flex; line-height:48px; border:2px solid #fff; margin-top:3%; }
.sub .sub_top .board_list1 ul li .b_txt .btn_down strong { font-size:18px; padding:0 35px 0 12px; position:relative; }
.sub .sub_top .board_list1 ul li .b_txt .btn_down strong:after { content: ''; width: 14px; height:100%; background:url('/img/common/arrow_down1.png') no-repeat center; display: block; position: absolute; right: 12px; top: 50%; transform: translateY(-45%); background-size:100% auto;}
.sub .sub_top .board_list1 ul li .b_txt .btn_down a { background:#32538a; padding:0 12px; white-space: nowrap; overflow:hidden; position:relative;}
.sub .sub_top .board_list1 ul li .b_txt .btn_down a:after {content:''; width:1px; height:10px; background:#5272a8; display:block; position:absolute; right:0; top:50%; transform:translateY(-50%);}
.sub .sub_top .board_list1 ul li .b_txt .btn_down a:last-child:after { display: none; }
.sub.project .sub_top .board_list1 ul li .b_txt { padding-top:3%;}

.sub .lnb_nav { background:#e8e8e8; height:50px; line-height:50px; position:relative; z-index:70;}
.sub .lnb_nav .c_box { background:#f2f2f2; height:100%; display:flex;}
.sub .lnb_nav .nav_list { display: flex; }
.sub .lnb_nav .nav_list .select_b {position:relative;padding-right:20px;padding-left:10px;}
.sub .lnb_nav .nav_list .select_b strong a{padding:0 13px 0 10px; position:relative;}
.sub .lnb_nav .nav_list .select_b strong a:after {
	content:''; display:inline-block; width:10px; height:100%; position:absolute; right:0; top:0;
	background: url('/img/common/arrow_down.png') no-repeat center; }
.sub .lnb_nav .nav_list a { display: block; }
.sub .lnb_nav .nav_list .select_b p {width:100%; position: absolute; top: 50px; left: 0; padding: 10px 20px; border: 1px solid #e8e8e8; border-top:0 none; box-sizing:border-box; background:#fff; display:none;}
.sub .lnb_nav .nav_list p a { line-height:1.3; padding:5px 0;}
.sub .lnb_nav .nav_sns{ margin-left:auto; display:flex; position:relative;}
.sub .lnb_nav .nav_sns p {position:absolute; right:0; top:50px; display:none;}
.sub .lnb_nav .nav_sns p a {
	width:50px; height:50px; display:block; overflow:hidden; text-indent:-300px; box-sizing:border-box;
	background-position:center; background-repeat:no-repeat; border: 1px solid #d0d0d0; border-top:0 none; 
}
.sub .lnb_nav .nav_sns p a.sns_face { background-image: url('/img/common/bul_sns1.png'); background-color:#435e99; }
.sub .lnb_nav .nav_sns p a.sns_twit { background-image: url('/img/common/bul_sns2.png'); background-color:#3c9cd6; }
.sub .lnb_nav .nav_sns p a.sns_url { background-image: url('/img/common/bul_sns3.png'); background-color:#fff; }
.sub .lnb_nav .btn_bul {
	width:50px; height:50px; display:block; text-indent:-300px; overflow:hidden;
	background-color:#c8c8c8; background-position:center; background-repeat:no-repeat;
}
.sub .lnb_nav .btn_home { background-image:url('/img/common/bul1.png'); }
.sub .lnb_nav .ns_print { background-image:url('/img/common/bul2.png'); margin-right:1px; }
.sub .lnb_nav .ns_share { background-image:url('/img/common/bul3.png'); }
.sub .board_foot { width:100%; margin-top:3%;}
.sub .content h1 {font-weight:500; font-size:30px;}
.sub .notice_b ul li a p{font-size:12px; color:#9a9a9a; }
.sub .notice_b ul li a p span:after {content:''; display:inline-block; width:10px; height:13px; border-right:1px solid #9a9a9a; margin-right:8px; position:relative; top:-1px; }
.sub .notice_b ul li a p span:last-child:after {display:none;}
.sub .notice_b ul li a p .txt_color1{color:#b0196b; }
.sub .notice_b ul li a p .txt_color2{color:#1d79ce; }

.sub.etc { background: #f6f6f6; }
.sub.etc h1{ font-weight:400; font-size:40px; display:block; text-align:center; margin:4% 0;}
.sub.etc h2{ font-weight:600; font-size:14px; }
.sub.etc h3{ font-weight:600; font-size:14px; }
.sub.etc .box1{ background:#fff; border:1px solid #c6c6c6; padding:3% 4%; box-sizing:border-box; line-height:1.9; margin-top:-1px;}
.sub.etc .box1 h2 {margin-top:3%;}
.sub.etc .box1 h3 {margin-top:3%;}
.sub.etc .privacy .box1 a {text-decoration:underline; color:gray;}
.sub.etc .box1 a.btn_privacy { background:#f4f4f4; border:1px solid #c6c6c6; font-size:11px; line-height:25px; padding:0 15px; display:inline-block; margin-top:20px;}
.sub.etc .box1 .form {display:flex; flex-wrap:wrap; justify-content:space-between;}
.sub.etc .box1 .form p {position:relative; width:49%;border:1px solid #c6c6c6; margin-bottom:10px;}
.sub.etc .box1 .form p.message_b { width:100%; height:250px;}
.sub.etc .box1 .form p label { position: absolute; top: 15px; left: 10px; line-height: 20px; transition: all 0.3s ease; color: #b0b0b0; }
.sub.etc .box1 .form p input[type=password],
.sub.etc .box1 .form p input[type=text],
.sub.etc .box1 .form p textarea { width: 100%; position: relative; background: transparent; border: 0 none; padding-left: 10px; transition: all 0.3s ease; box-sizing:border-box;}
.sub.etc .box1 .form p input[type=password]:focus,
.sub.etc .box1 .form p input[type=text]:focus,
.sub.etc .box1 .form p textarea:focus {outline:none;}
.sub.etc .box1 .form p input[type=password],
.sub.etc .box1 .form p input[type=text] {height:50px;  }
.sub.etc .box1 .form p textarea {height:100%;}
.sub.etc .box1 .form p input[type=password]:focus,
.sub.etc .box1 .form p input[type=text]:focus{ padding-top:15px; }
.sub.etc .box1 .form p textarea:focus { height:88%;  top:10%; }
.sub.etc .box1 .form p input[type=password]:focus ~ label,
.sub.etc .box1 .form p input[type=text]:focus ~ label,
.sub.etc .box1 .form p input[type=password]:valid ~ label,
.sub.etc .box1 .form p input[type=text]:valid ~ label,
.sub.etc .box1 .form p textarea:focus ~ label,
.sub.etc .box1 .form p textarea:valid ~ label { top: 3px; font-size:11px; color:#3c9cd6;}
.sub.etc .box1 .form p.tit_b {width:80%;  }
.sub.etc .box1 .form p.check_b {width:16%;border:0 none;  }
.sub.etc .box1 .form p.check_b input[type=checkbox] {width:15px; height:15px; position:absolute; left:0; top:19px;}
.sub.etc .box1 .form p.check_b label {left:20px;}
.sub.etc .box2 {color: #848484; text-align:center; }
.sub.etc .box2 ul { max-width:390px; width:70%; min-width:290px; margin:7% auto 10%;}
.sub.etc .box2 ul li {width:100%; background:#fff; height:65px; margin-bottom:5px; border:1px solid #c6c6c6; position:relative; display:table;}
.sub.etc .box2 ul li a {width:100%; height:100%; position: relative; padding-left: 66px; display:table-cell; vertical-align:middle; box-sizing:border-box;}
.sub.etc .box2 ul li a:before {content:''; display:block; position:absolute; top:0;left:0; width:66px; height:100%; border-right:1px solid #c6c6c6; }
.sub.etc .box2 ul li a.j_facebook:before { background:url('/img/common/sns_face.jpg') no-repeat center; background-size:100% auto;}
.sub.etc .box2 ul li a.j_google:before { background: url('/img/common/sns_google.jpg') no-repeat center; background-size: 100% auto; }
.sub.etc .box2 ul li a.j_naver:before { background: url('/img/common/sns_naver.jpg') no-repeat center; background-size: 100% auto; }
.sub.etc .box2 ul li a.j_kakao:before { background: url('/img/common/sns_kakao.jpg') no-repeat center; background-size: 100% auto; }
.sub.etc.mem .box1 {padding:0; background:transparent; border:0 none; width:70%; max-width:394px; min-width:290px; margin:7% auto;}
.sub.etc.mem .box1 .form {flex-direction:column; }
.sub.etc.mem .box1 .form p { width: 100%; background:#fff;}
.sub.etc.mem .box1 .btnbox { margin-top:0;}
.sub.etc.mem .box1 .btnbox a { width: 100%; background:#aaa; line-height:40px;}

.layer_kdi { width: 595px; position: fixed; top: 50%; left: 50%; transform: translateX(-50%) translateY(-50%); background: #fff; box-shadow: 2px 2px 10px rgba(0,0,0,0.4); border: 1px solid #505050;; z-index: 91; }
.layer_kdi .l_tit { padding: 30px; display: flex; flex-wrap: nowrap; }
.layer_kdi .l_tit span.img { width: 49%; max-width: 222px; border: 1px solid #c3c3c3; }
.layer_kdi .l_tit span.img img { width: 100%; }
.layer_kdi .l_tit div { padding-left: 5%; }
.layer_kdi .l_tit strong { font-weight: 300; color: #989898; }
.layer_kdi .l_tit h1 { font-weight: 700; font-size: 20px; }
.layer_kdi dl { padding: 30px; background: #f6f6f6; line-height: 1.7; }
.layer_kdi dl dt { font-size: 18px; font-weight: 700; }
.btn_layer_close { content: ""; width: 30px; height: 30px; display: block; position: absolute; top: 10px; right: 10px; text-indent: -300px; overflow: hidden; background: url('/img/common/btn_close.png') no-repeat center; cursor: pointer; z-index: 1000; }

.layer_print { max-width: 600px; padding:30px; box-sizing:border-box; position: fixed; top: 50%; left: 50%; transform: translateX(-50%) translateY(-50%); background: #fff; z-index: 100; border:1px solid #999; display:none;  }
.layer_print .viewbox_st1 ul {margin-top:20px; }

@media all and (max-width:1200px) { .slick-prev {margin-left:-45%;}
.slick-next {margin-right:-45%;}
}
@media all and (max-width:1000px) {
.slick-prev {left: 5%; margin-left:0;}
.slick-next {right:5%; margin-right:0;}
.slick-slide .s_con p span b {font-size:4.5vw;}
.slick-slide .s_con p span em {font-size:2vw;}
.slick-slide .s_con div h1 { font-size:3.5vw; }
.slick-slide .s_con div h2 { font-size:4.5vw}
.sub.forum .sub_top .s_t_tit h1 { font-size:6.7vw;}
.viewbox_st2 dl dt strong { font-size:3.1vw;}
}
@media all and (max-width:750px) {
.slick-arrow {width:50px; height:50px; background-size:10px;}
.container.main h1{ font-size:5.5vw;}
.archive_b li {width:49%; margin-bottom:10px;}
.joint_b li:nth-of-type(2) a .img {float:right;}
.joint_b li:nth-of-type(3) a .img {float:left;}
.notice_b ul li a { padding: 3%; }
.notice_b ul li a strong { margin-right:4%; }
.board_list1 ul li { padding:10px 0; }
.board_list1 ul li .b_img { width: 250px; height: 160px; }
.board_list1 ul li .b_txt {width:100%; margin-top:3%;}
.viewbox_st2 dl dt strong { font-size:20px;}
.sub .board_foot .paging { width:280px; margin:0 auto; float:none !important; text-align:center;}
.sub .board_foot .search { width:300px; margin:0 auto; float:none !important; margin-top:3%;}
.sub .board_foot .search select{ margin-right:0; }
.sub .board_foot .search .s_b{ width:205px; float:right; }
.sub.forum .sub_top .s_t_tit strong { font-size:23px;}
.sub.forum .sub_top .s_t_tit p { font-size:16px;}
.sub.forum .sub_top .s_t_tit span a { font-size:14px; line-height:40px; min-width:130px;}
.sub .sub_top .archive_b .list-4th li:nth-of-type(2) {margin-right:0;}
}
@media all and (max-width:640px) {
.slick-slider .slick-track, .slick-slider .slick-list { height:300px;}
.slick-slide .s_con p span b {font-size:30px;}
.slick-slide .s_con p span em {font-size:14px; height:40%;}
.slick-slide a {font-size:25px;}
.container.main h1{ padding:7% 0 5%; }
.archive_b li a .txt h2 {font-size:16px; height:55px; }
.notice_b ul li a strong span {font-size:30px; font-weight:400; }
.notice_b ul li a strong small {font-size:14px; }
.notice_b ul li a h2 {font-size:18px;}
.board_list1 ul li .b_txt h2 {font-size:20px;}
.sub .sub_top .archive_b li a .txt h2 {font-size:15px; height:35px; }
.sub .sub_top .archive_b {padding:20px 10px;}
.sub .sub_top .s_t_tit{min-height:150px;}
.sub .sub_top .board_list1 ul {padding:6% 0;}
.sub .sub_top .board_list1 ul li .b_txt .btn_down { line-height:35px; border-width:1px;}
.sub .sub_top .board_list1 ul li .b_txt .btn_down strong {font-size:16px; padding:0 28px 0 9px; }
.sub .sub_top .board_list1 ul li .b_txt .btn_down strong:after {width:10px; }
.sub .sub_top .board_list1 ul li .b_txt .btn_down a { padding:0 9px; }
.sub.community .sub_top .s_t_tit{font-size:30px;}
.sub.forum .sub_top .s_t_tit{font-size:25px;}
.sub .content h1 {font-size:25px;}
.con_data { font-size:16px; line-height:1.7;}
.sub .lnb_nav .btn_home { display:none; }
.sub .lnb_nav .ns_print { display:none;}
.sub .lnb_nav .nav_list .select_b:nth-of-type(3) {display:none;}
.sub .board_foot { margin-top:5%;}
.viewbox_st1 ul li { padding:15px 0;flex-direction:column; line-height:1.5; }
.viewbox_st1 ul li h2{ width:100%; font-size:16px; margin-bottom:10px;}
.viewbox_st1 ul li .data { width:100%; margin-left:0; }
.viewbox_st1 .vod_b { width:100%; padding-bottom:55%; }
.viewbox_st2 dl dt.dt_answer strong { font-size:18px;font-weight:700;}
.view_list { margin-top:30px; padding:20px 5px;}
.view_list h2 { font-size:16px;margin-bottom:10px; }
.view_list ul { font-size:14px;}
.view_list ul li a {padding:7px; }
.view_list ul li a:before {width:5px; height:5px; margin-right:7px;  }
.layer_kdi {width:90%;}
.layer_kdi .l_tit {padding:4%;}
.layer_kdi .l_tit span.img {width:43%; }
.layer_kdi .l_tit span.img img {width:100%; }
.layer_kdi .l_tit div {padding-left:5%;}
.layer_kdi .l_tit strong {font-size:12px;}
.layer_kdi .l_tit h1 {font-size:17px;}
.layer_kdi dl {padding:4%; line-height:1.6; }
.layer_kdi dl dt {font-size:16px; }

.sub.etc h1{ font-size:30px; }
.sub.etc .box1 .form p.tit_b {width:75%;  }
.sub.etc .box1 .form p.check_b {width:20%;  }
}

@media all and (max-width:500px) {
.slick-slide .s_con { align-items:initial; }
.slick-slide .s_con p {margin-top:10%;}
.slick-slide .s_con p span em {font-size:12px; }
.slick-slide .s_con div {margin:12% auto 0; width:67%;}
.slick-slide .s_con div h1 { font-size:18px; }
.slick-slide .s_con div h2 { font-size:25px;}
.joint_b li a .img,
.joint_b li a .txt {width:100%;}
.joint_b li:nth-of-type(3) a .img {float:left;}
.board_list1 ul li .b_img { width: 100%; max-width:100%; height: auto; }
.board_list1 ul li .b_txt h2 {font-size:18px;}
.sub .lnb_nav { height:35px; line-height:35px;}
.sub .lnb_nav .nav_list .select_b { padding-left:0; padding-right:10px;}
.sub .lnb_nav .nav_list .select_b p {top:35px;}
.sub .lnb_nav .nav_sns p { top:35px;}
.sub .lnb_nav .nav_sns p a {width:35px; height:35px; background-size:70% auto;}
.sub .lnb_nav .btn_bul {width:35px; height:35px; background-size:80% auto;}
.con_data img { width:100%; }
.l_slide .l_b {height: 250px;}
.sub.etc .box1 h2 {margin-top:4%;}
.sub.etc .box1 h3 {margin-top:4%;}
.sub.etc .box1 .form p {width:100%;}
.sub.etc .box2 ul { margin:10% auto 13%;}
}
@media all and (max-width:480px) {
.slick-slider .slick-track, .slick-slider .slick-list { height:250px;}
.container.main h1{ font-size:20px;}
.archive_b li a .txt .info{margin-bottom:5%;}
.slick-slide a {font-size:20px;}
.viewbox_st2 dl dt strong { font-size:18px;}
.sub .sub_top .s_t_tit{min-height:100px;}
.sub .sub_top .archive_b .list-4th li {margin-right:0;}
.sub.community .sub_top .s_t_tit{font-size:25px;}
.sub.forum .sub_top .s_t_tit{ padding:4% 0 6%;}
.sub.forum .sub_top .s_t_tit strong { font-size:20px;}
.sub.forum .sub_top .s_t_tit h1 { font-size:25px;}
.sub.forum .sub_top .s_t_tit p { font-size:14px; margin-top:3%;}
.sub.forum .sub_top .s_t_tit span a { margin-top:7%; font-size:14px; line-height:35px; min-width:100px;}
.sub.etc h1{ font-size:25px; }
}
@media all and (max-width:450px) {
.l_slide .l_b {height: 220px;}
.sub .content .c_box { overflow:hidden;}
}

@media all and (max-width:430px) {
.layer_kdi .l_tit strong { font-size: 12px; }
.layer_kdi .l_tit h1 { font-size: 14px; }
.layer_kdi dl dt { font-size: 14px; }
.layer_kdi dl dd { font-size: 12px; }
}

@media all and (max-width:400px) {
.l_slide .l_b {height: 190px;}
}
@media all and (max-width:350px) {
.l_slide .l_b {height: 170px;}
.sub.etc .box1 .form p.tit_b {width:72%;  }
.sub.etc .box1 .form p.check_b {width:23%;  }
}
@media print {
.header .gnb_b,
.btn_gnblist,
.lnb_nav,
.footer,
.mask { display: none !important; }
.header { height: 80px; position: static; }
.container { padding-top: 0; }
.header h1 a { font-size: 40px !important; }
.layer_print { display: none; max-width: 80%; margin: 40px auto; padding: 0; position: static; top: 0; left: 0; transform: initial; border: 0 none; }
body { font-size: 16px; page-break-after: auto; page-break-before: auto; }
.board_list1 ul li .b_txt { width: 66% !important; margin-top: 0 !important; }
.sub .sub_top .board_list1 ul li .b_txt { width: 62% !important; margin-top: 0 !important; }
* { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
}
