/* HTML5 display-role reset for older browsers */
@import url('https://fonts.googleapis.com/css?family=Noto+Sans+KR:300,400,500,700,900&subset=korean');
@import url('https://fonts.googleapis.com/css?family=Open+Sans:300,400,900|Source+Code+Pro');
@font-face {
    font-family: 'SBAggroB';
    src: url('../font/SBAggroM.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'AritaSemiBold';
    src: url('../font/Arita-buri-SemiBold.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'Paperlogy';
    src: url('../font/Paperlogy-4Regular.woff2') format('woff2');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Paperlogy';
    src: url('../font/Paperlogy-6SemiBold.woff2') format('woff2');
    font-weight: 600;
    font-style: normal;
}


article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
	display: block;
}
body {
	line-height: 1;
    font-family:'Open Sans','Noto Sans KR', Dotum,'돋움',Helvetica, sans-serif; 
}
ol, ul, dl, dd, dt {	padding: 0;	margin:0;	list-style: none;}
a{color: #222222;}
a:hover{text-decoration: none; color : #222222;}
blockquote, q {	quotes: none;}
blockquote:before, blockquote:after,
q:before, q:after {	content: '';	content: none;}
table {	border-collapse: collapse;	border-spacing: 0;}

.arita  {font-family: 'AritaSemiBold', sans-serif;}
.paper {font-family: 'Paperlogy';}
.displaynone {display: none;}
.max_width {max-width: 1240px; margin: auto;}

:root {
	--main-color : #8b6cc7;
	--main-color2 : #b0b0d4;
	--bg-lightblue :  #c6d5e7;
	--bg-lightgreen :  #cbe3cd;
	--bg-gray :  #f2f2f2;
	--color1 : #f1e7c8;
	--color2 : #f1d7c8;

}

.bg-lightblue { background-color: var(--bg-lightblue);}
.bg-lightgreen { background-color: var(--bg-lightgreen);}
.bg-gray { background-color: var(--bg-gray);}
.bg-main-color {background-color: var(--main-color);}
.bg-color1 {background-color: var(--color1);}
.bg-color2 {background-color: var(--color2);}

.txcolor1 {color: var(--main-color);}

.pc_br{display: block;}
.mo_br{display: none;}
@media (max-width: 768px) { 
    .pc_br{display: none;}
    .mo_br{display: block;}
}





/* 화면낭독기 사용자용 */
#hd_login_msg {position:absolute;top:0;left:0;font-size:0;line-height:0;overflow:hidden}
.msg_sound_only, .sound_only {display:inline-block !important;position:absolute;top:0;left:0;margin:0 !important;padding:0 !important;font-size:0;line-height:0;border:0 !important;overflow:hidden !important}

/* 본문 바로가기 */
#hd_h1 {position:absolute;font-size:0;line-height:0;overflow:hidden}
#skip_to_container a {z-index:100000;position:absolute;top:0;left:0;width:1px;height:1px;font-size:0;line-height:0;overflow:hidden}
#skip_to_container a:focus, #skip_to_container a:active {width:100%;height:75px;background:#21272e;color:#fff;font-size:2em;font-weight:bold;text-align:center;text-decoration:none;line-height:3.3em}

.clear:after {display:block;visibility:hidden;clear:both;content:""}
.width100 {width: 100%;}
.w100p {width: 100%;}
.w80p {width: 80%;}
.w60p {width: 60%;}
.tx_sm {font-size: 13px;}
.sm_tit {    color: #f37d1b;    font-weight: 500;}

#wrap {position: relative; overflow: hidden;}

#header{padding: 10px 0; background-color: #fff; width: 100%; height: 80px; border-bottom: 1px solid #dcdcdc; position: fixed; z-index: 10; 
	-webkit-transition: all  0.5s ease-in-out 0s;
    -moz-transition: all  0.5s ease-in-out 0s;
    -ms-transition: all  0.5s ease-in-out 0s;
    -o-transition: all  0.5s ease-in-out 0s;
    transition: all  0.5s ease-in-out 0s;}

#header .logotx p{font-size: 24px; font-weight: nomal; display: block; color: #ffffff; padding-top: 17px; text-align: center;}
#header .logo {text-align: center;}
#header .logo img {max-width: 270px; padding-top: 2px;}
#header .home img{max-width: 36px; padding: 10px 0;}

#header .header_txt{text-align: center; font-size: 20px; font-weight: bold; color: #2b2b2b;}
#header span {color: #d14a3f  }

#container {width: 100%; margin: auto; max-width: 1240px;}
#container p {line-height: 30px; margin: 0; }
#content{max-width: 1240px; margin: auto;}
#content p {line-height: 30px; margin: 0; }



.mainslider {height: 520px;  background: url(../img/main_banner.jpg) center center no-repeat; background-size: cover; margin-top: 80px;
	display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}
.mainslider .pic img {margin-bottom: 35px;}
.mainslider .tx {color: #fff;  font-family: 'Noto Sans KR', sans-serif; text-align: center; }
.mainslider .tx  h3 {font-size: 40px; font-weight: bold; display: inline-block; padding-top: 20px;}
.mainslider .tx  p {font-size: 24px;  margin-bottom: 25px; font-weight: 500;}
.mainslider .tx a {display: block; position: absolute;  bottom: -15%; padding: 10px 20px; background-color: #ffffff; color: #222222; 
	font-size: 20px; border-radius: 30px; font-weight: bold;
	-webkit-transition: all  0.5s ease-in-out 0s;
    -moz-transition: all  0.5s ease-in-out 0s;
    -ms-transition: all  0.5s ease-in-out 0s;
    -o-transition: all  0.5s ease-in-out 0s;
    transition: all  0.5s ease-in-out 0s;}


@media (max-width: 1000px) {
	#header {position: fixed; z-index: 90; width: 100%; height: 80px; top: 0; background-color: #fff;}
	#header .logotx p{font-size: 20px; text-align: right;}
	#header  .home {display:none; }
	.mainslider .pic {padding: 10px 0 10px 0; }	
	.mainslider .pic img {max-width: 200px;}
	.mainslider {height: 350px;}
	.mainslider .tx{text-align: center;  }
	.mainslider .tx  h3 {font-size: 26px;line-height: 36px; font-weight: bold;}
	.mainslider .tx  p {font-size: 16px; margin-top: 5px;}
	.mainslider .tx a {font-size: 14px; top: 150px; left: 50%;   transform: translateX(-50%); padding: 10px 25px; line-height: 20px; height: 40px; }
	.mainslider img {max-width: 400px;}		
	
}


@media (max-width: 768px) {
	#wrap {margin-top: 60px;}
	#header {position: fixed; z-index: 90; width: 100%; height: 60px; top: 0; background-color: #fff; padding-top: 14px;}
	#header .logo {text-align: center; padding: 0; }
	#header .logo img {padding-top: 0px; max-width: 155px;}
	#header .logotx p {font-size: 14px; text-align: center; padding-top: 10px;}
	#header .header_txt {font-size: 15px; white-space: nowrap; text-align: left; padding-right: 0; padding-left: 5px; letter-spacing: -1px;}

	.menu_name {display: none;}
	.mainslider {height: 250px; margin-top: 0}
	.mainslider .tx{text-align: center; }
	.mainslider .tx  p{margin-top: 10px; font-size: 14px;}
	.mainslider img {max-width: 250px;}
	.mainslider .tx h3 {font-size: 18px; padding-top: 5px;}
	
	.sub01 .sub04_6pc{display: none;}
	.sub01 .sub04_6mo{display: block;}
	
}

.sub01 .sub04_6mo{display: none;}
.sub01 p.indent {text-indent: -10px; padding-left: 26px;}
.sub01 .bullet1{padding-left: 20px; position: relative;}
.sub01 .bullet1::before {content: ""; display: inline-block;	width: 12px; height: 12px; 
	background-color: #ffffff; border: 1px solid #222222;
	position: absolute;	left: 0; top: 5px;  }

 
div.btn_menu{width: 70px; position: relative; float: right; margin-top: 10px;}
div.btn_menu  span:nth-of-type(1){width: 25px; height: 3px; position: absolute; top: 0px; left: 0; background-color: #222222;}
div.btn_menu  span:nth-of-type(2){width: 25px; height: 3px; position: absolute; top: 8px; left: 0; background-color: #222222;}
div.btn_menu  span:nth-of-type(3){width: 25px; height: 3px; position: absolute; top: 16px; left: 0; background-color: #222222;}
div.btn_menu a {padding-left: 25px;}

.nav_menu { text-align: right; position: fixed; top: 2px; right: 20px; z-index: 300; display: none; }


/* 좌측 슬라이드 메뉴  */
#asideright {position: fixed; top:0; right: -530px; max-width: 500px; width: 80%; height: 100%;  z-index: 100; border-left: 1px solid #2b2b2b; 
	padding:40px 20px 0 30px; background-color: #2b2b2b; overflow-y: auto;
    box-shadow: 1px 5px 5px #999;     box-shadow: 2px -1px 10px #777777;

    -webkit-transition: all  0.5s ease-in-out 0s;
    -moz-transition: all  0.5s ease-in-out 0s;
    -ms-transition: all  0.5s ease-in-out 0s;
    -o-transition: all  0.5s ease-in-out 0s;
    transition: all  0.5s ease-in-out 0s;}

#asideright .menu  { text-align: left; margin: auto; font-size: 0;}
#asideright .menu li {display: block;  vertical-align:top; padding: 6px 5px 8px 20px;}

#asideright .menu .big_menu.subon {background: url('../img/icon_plus.png') 99%  14px no-repeat;  }
#asideright .menu .big_menu{font-size: 18px; color: var(--main-color); display: block;  font-weight: bold; line-height: 1.5; cursor: pointer; padding: 15px 0;}

#asideright .menu li a{display: block;  color: #fff;  font-size: 16px; text-align: left; letter-spacing: -0.5px; line-height: 1.5; font-weight: 500;     word-break: keep-all;}
#asideright .menu li a span {font-weight: normal; color: #999; font-size: 15px;     display: block;}

#asideright .big_menu .submenu {padding-left: 20px;}
#asideright .submenu{display: none; margin-bottom: 20px;}

#asideright .mainmenuimg{max-width: 20px; margin-left: 10px; padding-bottom: 4px;}
#asideright .mainmenuimg2{max-width: 18px; margin-left: 10px; padding-bottom: 4px;}


#asideright .menu  a.btn_close {position: absolute; top: 15px; right: 20px;}
#asideright .menu  a.btn_close img{width: 40px;}
#asideright h6 {margin-top: -15px;}
#asideright h5 {padding-bottom: 10px; border-bottom: 2px solid var(--main-color); font-size: 22px; color: #fff; font-weight: bold;}
#asideright select {width: 100%;
    padding: 10px 20px;
    height: auto;
    border-radius: 4px;
    font-size: 16px;
    color: #333;
	background: #fff url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polyline points="6,9 12,15 18,9"></polyline></svg>') no-repeat right 15px center;
	background-size: 20px;
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    cursor: pointer;
    transition: all 0.3s ease; }

#asideright .main_site a{font-size: 16px; background: #fff; border-radius: 50px; color: #2b2b2b; padding: 10px 20px; display: inline-block; font-weight: bold; margin-top: 20px;}


a.btn_close { position: absolute; top: 15px; right: 20px; z-index: 110;   -webkit-transition: all  0.5s ease-in-out 0s; 
    transition: all  0.5s ease-in-out 0s;}

a.btn_close img{width: 40px;}


@media (max-width: 768px){
	#asideright .menu .big_menu{font-size: 15px; display: block;  font-weight: bold; line-height: 1.5; cursor: pointer; padding: 10px 0;}
	#asideright .menu  a.btn_close img{display: none;}
	#asideright .menu h6 {font-size: 14px;}
	#asideright h5 {font-size: 20px;}
	#asideright .main_site a {font-size: 14px; }
	#asideright .menu li a {font-size: 14px;}
	.nav_menu {display: block;  text-align: right; position: fixed; top: 18px; right: 16px; z-index: 1000;}
}

/* 새로만든 우측메뉴  */
.sidebar {	}
.sidebar .menu-container {	padding: 0;}

/* 공통 메뉴 스타일 */
.sidebar .menu-list {	list-style: none;	margin: 0;	padding: 0;}
.sidebar .menu-item {	border-bottom: 1px solid #5c5c5cb4;}
.sidebar .menu-item a {color: #ffffff;}
.sidebar .menu-list.depth-4 a {color: #ffffff;display:block; font-weight: bold;}
.sidebar .menu-list.depth-4  span {display:block; font-weight: 300;}

.sidebar .menu-link {	display: flex;	align-items: center;	justify-content: space-between;	padding: 15px 20px;	text-decoration: none;
	color: #ffffff;	transition: all 0.3s ease;	cursor: pointer;	position: relative;}
.sidebar .menu-link:hover {		color: #b38cd3;}

/* 1단계 메뉴 - 링크 없는 카테고리 */
.sidebar .depth-1 .menu-category {	display: flex;	align-items: center;	justify-content: space-between;	padding: 20px 20px 20px 10px;	font-weight: bold;
	cursor: pointer;	transition: all 0.3s ease; color: #ffffff; 	font-size: 16px;}
.sidebar .depth-1 .menu-category:hover,
.sidebar .depth-1 .menu-category.active {		background-color: #3e3e3e; border-top: 1px solid var(--main-color);}

/* 2단계 메뉴 */
.sidebar .depth-2 {		max-height: 0;	overflow: hidden;	transition: max-height 0.3s ease;}
.sidebar .depth-2.show {	max-height: 1500px;     background-color: #3e3e3e;}
.sidebar .depth-2 .menu-link {	padding-left: 20px;	font-size: 15px;}
.sidebar .depth-2 .menu-link.active {    border-bottom: 1px solid #5c5c5cb4;}

/* 3단계 메뉴 */
.sidebar .depth-3 {		max-height: 0;	overflow: hidden;	transition: max-height 0.3s ease;}
.sidebar .depth-3.show {	max-height: 1500px;}
.sidebar .depth-3 .menu-link {	padding-left: 35px;	font-size: 15px;	color: #ffffff;}
.sidebar .depth-3 .menu-link:hover {	color: #b38cd3;}

/* 4단계 메뉴 */
.sidebar .depth-4 {	max-height: 0;	overflow: hidden;	transition: max-height 0.3s ease;}
.sidebar .depth-4.show {	max-height: 1500px;}
.sidebar .depth-4 .menu-link {	padding: 10px 20px 10px 50px;	font-size: 14px;	color: #ffffff;	line-height: 1.4;	border-bottom: 0px solid #e0e0e0;}
.sidebar .depth-4 .menu-item:last-child .menu-link {	border-bottom: none;}
.sidebar .depth-4 .menu-link:hover {		color: #b38cd3;}

/* 화살표 아이콘 */
.sidebar .menu-icon {	transition: transform 0.3s ease; }
.sidebar .menu-icon img {	 width: 20px;}

.sidebar .menu-category.active .menu-icon,
.sidebar .menu-link.active .menu-icon {	transform: rotate(90deg);	color: #b38cd3;}

/* 활성화된 메뉴 표시 */
.sidebar .menu-link.current {color: #fff;}

.sidebar .menu-link.current:hover {	background-color: #b38cd3;}
.sidebar .noborderbottom {border-bottom: 0px;}


.scroll-to-top {
    position: fixed;
    bottom: 2em;
    right: 15px;
    background: url(../img/arrow-up-circle.svg) no-repeat;
    width: 50px;
    height: 50px;
    padding-right: 1em;
    display: none;
    z-index: 999;
	cursor: pointer;
	opacity: 0.6;
}
.scroll-to-top a {display: block; width: 100%; height: 100%}
.text-bold {font-weight: bold;}



/* 햄버거메뉴 */
	.menu-trigger,
	.menu-trigger span {
		display : inline-block !important;
		transition : all .4s;
		box-sizing : border-box;
	}
	.menu-trigger {
		position : relative;
		width : 30px;
		height : 26px;
		margin: 0px  0;
		font-size: 24px;
	    line-height: 28px;
	}
	.menu-trigger span {
		position : absolute;
		right : 0;
		width : 25px;
		height : 2px;
		background-color : #222;
	}
	.menu-trigger span:nth-of-type(1) {	top : 0px;		}
	.menu-trigger span:nth-of-type(2) {	top : 10px;	 width : 20px;}
	.menu-trigger span:nth-of-type(3) {	top : 20px;	}
	.menu-trigger.active span:nth-of-type(1) {
		-webkit-transform:translateY(10px) rotate(-45deg);
		transform:translateY(10px) rotate(-45deg);
	}
	.menu-trigger.active span:nth-of-type(2) {
		opacity : 0;
	}
	.menu-trigger.active span:nth-of-type(3) {
		-webkit-transform:translateY(-6px) rotate(45deg);
		transform:translateY(-10px) rotate(45deg);
	}
	.menu-trigger.active span {background-color : #fff;}


.tree {border-bottom: 1px solid #dddddd;}
.tree .treemenu { display: flex;  align-items: center;   justify-content: flex-start; }
.tree .treemenu li {padding: 10px 20px; position: relative; border-right: 1px solid #dddddd; height: 100%; }
.tree .treemenu dl {display: inline-block; }
.tree .treemenu a {display: inline-block; font-size: 13px;  color: #555555; transition: .2s linear;}
.tree .treemenu dt {font-size: 13px;  line-height: 28px; }
.tree .treemenu dt {    position: relative;    padding-right: 28px;    cursor: pointer;}
.tree .treemenu dt:after {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    width: 12px;
    height: 100%;
    background: url(../img/arrow_locat.svg) no-repeat 50% 50% / contain;
    transition: .2s linear;
}
.tree .treemenu .on dt:after {    transform: rotate(180deg);}
.tree .treemenu dd {    position: absolute;    top: 50px;    left: 0px;     padding: 20px;    background: #f2f2f2;
    border-radius: 10px;    box-shadow:  1px 5px 3px 3px #00000020;  display: none; z-index: 100; }
.tree .treemenu dd a {    display: block;    font-size: 14px;    color: #666;  line-height: 28px; 
    word-break: keep-all; white-space: nowrap;}
.tree .treemenu dd a.on {    color: var(--main-color);}

/* 툴팁 색상*/
.tooltip .tooltip-inner { background-color:#dddddd !important; color: #333333; }
.tooltip .arrow:before{ border-top-color:#dddddd !important;  }

.menu_name{font-size: 22px; font-weight: bold; color: #2b2b2b;}


/* 탭메뉴 */
	.base_tab {    position: relative;    text-align: left;    border-bottom: 1px solid #999999;    font-size: 0;    margin: 20px 0 ;  }
	.base_tab li {z-index: 1;    display: inline-block;    position: relative;    text-align: center;       border: 1px solid #f0f0f0;    border-bottom: 0px;	  margin-left: -1px;  background-color: #fafafa; vertical-align: middle;}
	.base_tab li a{display: block;     padding: 5px 2px;     font-size: 13px;    letter-spacing: -1px;    color: #444; text-decoration:none;  height: 40px; line-height: 30px;	}
	.base_tab li.active {	    z-index: 10;    color: #222;    background: #fff;    border: 1px solid #999999;	border-bottom: 1px solid #fff;    bottom: -1px;    font-weight: normal; background-color: #ffffff; font-weight: bold;}
	.base_tab li:first-child {  margin-left: 0;}
	.base_tab.tab1  li { width: 50%;}
	.base_tab.tab2  li { width: 50%;}
	.base_tab.tab3  li { width: 33.3333%;}
	.base_tab.tab4  li { width: 25%;}
	.base_tab.tab5  li { width: 20%;}
	.base_tab.tab6  li { width: 16.66%;}
	.base_tab.tab7  li { width: 14.28%;}
	.base_tab.tab8  li { width: 12.57%;}
	.base_tab.tab9  li { width: 11.19%;}
	.base_tab.tab12  li { width: 8.4%;}

	 @media screen and (max-width: 992px) {   /* 텝메뉴 2줄로 넘어갈때 */
		.base_tab li a.line2 {line-height: 16px;}
	}





/* 페이지 이동 */
.page_move{width: 100%; margin: auto; margin-bottom: 30px; border-top: 1px solid #b6b6b6; padding-top: 30px; max-width: 1240px; }
.page_move .page_before a, .page_move .page_next a{background: #fff; padding: 20px 0px; display: inline-block;}
.page_move .page_next{text-align: right; color: #ffffff; font-weight: bold; font-size: 16px;}
.page_move .page_next a{color: #666666;}
.page_move .page_next a:hover{color: var(--main-color2); transition: 0.3s}

.page_move .page_before{text-align: left; color: #666666; font-weight: bold; font-size: 16px;}
.page_move .page_before a{color: #666666;}
.page_move .page_before a:hover{color: var(--main-color2); transition: 0.3s}

.page_move div:nth-child(2){padding: 0;}
.page_move .page_home img{width: 100%; max-width:60px; margin: auto; display: block;}
.page_move .page_home{text-align: center;}
.page_move i { font-size: 30px;  vertical-align: middle; }


#top_normal { position: relative; }
#top_normal .subimg {width: 100%;}
#top_normal .subtit {   font-size: 44px;    line-height: 48px;    font-weight: 600;   text-align: center;  margin-top: 20px;  }



/* 하단 */
#footer {background-color: #111111; padding:  20px 0 10px; margin: 30px 0 0;}
#footer .address p {line-height: 1.2; color: #fff; font-size: 16px;}

#footer {
	background-color: #111111;
	padding: 20px 0 10px;
	margin: 0 !important;
}


@media screen and (max-width: 768px) {

	#footer .address p {font-size: 14px;}
	#footer .tail_link li {height: 100px; padding:10px 0; }
	.searchArea_m {display: block;}

}


@media (max-width: 900px) {
	.main_slider .slide_tx h4 p{font-size: 30px;}
	.main_slider .slide_tx h4 span{font-size: 20px; }
	.main_slider .slide_tx a.detail {font-size: 16px;}
	.slider {margin-top: 70px;}
	#top_search  {margin-top: 70px;}
	#top_normal  {margin-top: 70px;}
 }



/* main_ index */

.main_index h4{font-size: 20px; font-weight: bold; color: #2b2b2b;  line-height: 1.5; text-align: left;}

.main_index{margin: 50px 0 50px 0;  box-sizing: border-box;}
.main_index .post .post_text, .main_img{ /* box-shadow: 5px 5px 5px #dcdcdc; */}
.main_index .mainmenuimg{max-width: 20px; margin-right: 3px; padding-bottom: 4px;}
.main_index .card {border-radius: 20px; box-shadow: 1px 4px 10px 4px #00000014;}

.main_index .post_text{height: 100px; background: #fff; padding: 0 0 0 5px; }
.main_index .post_text .main_name{padding-top: 10px; font-size: 16px; font-weight: bold; color: #8d8d8d;  line-height: 1.5; margin-bottom: 5px; text-align: left;}
.main_index .main_subtit{font-size: 16px; font-weight: 400; color: #fff; line-height: 1.5; padding: 8px 20px; display: inline-block; text-align: center; border-radius: 50px; background-color: var(--main-color2); text-align: left;}
.main_index .main_subtit1{font-size: 16px; font-weight: 400; color: #fff; line-height: 1.5; padding: 8px 20px; margin: auto;  text-align: center; border-radius: 50px; background-color: var(--main-color2);}


.main_index .arrow_sub{text-align: right; margin-right: 10px; }
.main_index .arrow_sub img{width: 25px; height: 25px; display: inline-block;}


.main_index .post a {  display: block;   box-shadow: 1px 4px 10px 4px #00000014;  }
.main_index .post2 a {  display: block;   box-shadow: 1px 4px 10px 4px #00000014; border-radius: 20px 20px 0 0 ; overflow: hidden;  }
.main_index .post .main_img{overflow: hidden;}
.main_index .post .main_img > img{ width: 100%; height: 100%; transition: all 0.8s;}
.main_index .post2 .main_img > img{ width: 100%; height: 100%; transition: all 0.8s;}
.main_index .post:hover .main_img >img{transform : scale(1.1);}
.main_index .post2:hover .main_img >img{transform : scale(1.1);}
.main_index .post2 .post_text {	height: 120px; padding: 15px 15px 20px 15px; }

#main_container {background-color: #f1f1f1;}






@media (max-width: 1000px) {
	.main_index h4{font-size: 16px;word-break: keep-all;}
	.main_index .main_subtit{font-size: 14px;}
	.main_index .post_text .main_name{font-size: 15	px;}
 }


 @media screen and (max-width: 768px) {
	.main_index .post_text{height: 100px;}
	.main_index{margin: 20px 0 20px 0;}
	.main_index1{margin-top: 30px;}
	.main_index1 .post1 .post_text{width: 300px}
	.main_index1 .post1 .post_text h4{float: none;}
	.main_index1 .post1 img{height: 200px;}
	.main_index1 .post2, .main_index1 .post1{margin-bottom: 20px;}
	.tree {display:none;}
	.main_index .post2 .post_text {		height: 100px;	}

 }




/*sub*/

/* 공통 */
.sub_bg{height: 200px; position: relative; margin-top: 80px;
	background-image: url('../img/main_sub.jpg');
	background-color: #00000050; 
    background-blend-mode: multiply; /* 혼합 모드 */
	background-position-x: 73%;
}

.submain{background-color: #fff; width: 100%;}
.title_main{font-size: 35px; font-weight: 500;  color: #fff; margin: auto; text-align: center; position:absolute; top:50%; left:50%; 
	transform: translate(-50%, -50%);       font-family: 'SBAggroB';}
.title_main span {display: block; padding-top: 5px; font-size: 25px; font-weight: 400;   font-family: 'SBAggroM';}
.sub_text{font-size: 18px; line-height: 1.5; color: #2b2b2b;}


::selection{background: #accfff;}

/* sub */

.Sp_cript{ font-size: 10px; vertical-align: super; margin-left:3px; font-weight: 400;}

.sub01{padding-top: 30px;}
.sub01 .tree{font-size: 16px;}

.sub01 h3{font-size: 35px; font-weight: bold; color: #2b2b2b; margin: 130px 0 20px 0; line-height: 1.5;     word-break: keep-all;}
.sub01 h3 p {font-family: 'Noto Sans KR';font-weight: 400;font-size: 0.9em; display: inline-block;}
.sub01 .tab-content h3{font-size: 35px; font-weight: bold; color: #2b2b2b; margin: 50px 0 70px 0; line-height: 1.5;}
.sub01 h3 span{font-size: 25px; font-weight:normal; color: #2b2b2b;}
.sub01 .tit_name{text-align: right; font-size: 18px;  color: #727171; margin-bottom: 50px;}
.tit_part {font-family: 'Paperlogy'; font-weight: 600; padding : 10px 10px 8px 20px;  display: flex;
	justify-content: space-between; align-items: center;}
.tit_part h4 {font-weight: 600;}	
.tit_part span {font-size: 0.8em; font-weight: 400;}
.tit_part a {font-size: 16px; background-color: #ffffffcf; padding: 10px 20px; border-radius: 30px; }
.tit_part a img {width: 20px;}

.sub01 .sub_text_name span.tx_sm2 {font-size: 14px; color:#ffffff; padding: 3px 15px; background: #b8b1d5; border-radius: 30px; font-weight: 400;}

.question {display: flex;align-items: flex-start; padding: 25px 20px; background-color: var(--bg-lightblue);
            border-radius: 8px;margin-bottom: 5px;position: relative;}
.question .text {flex: 1;line-height: 1.6;margin-top: 5px;font-weight: 500;}		
.question span {  background: linear-gradient(135deg, #527bc7, #266fcf);
            color: white;border-radius: 50%;width: 35px;height: 35px;display: flex;align-items: center;justify-content: center;font-weight: bold;
			font-size: 18px;margin-right: 15px;            flex-shrink: 0; }

.answer {display: flex;align-items: flex-start; padding: 25px 20px;
            border-radius: 8px; margin-bottom: 5px;position: relative;}
.answer .text {flex: 1;line-height: 1.6;margin-top: 5px;font-weight: 500;}		
.answer span {background: linear-gradient(135deg, #bbb3d8, #8978c4);
            color: white;border-radius: 50%;width: 35px;height: 35px;display: flex;align-items: center;justify-content: center;font-weight: bold;
			font-size: 18px;margin-right: 15px;            flex-shrink: 0; }


.sub01 .sub_text{text-align: justify; color: #333; font-size: 18px; line-height: 1.5; border-bottom: 1px solid #757575; padding-bottom: 50px;}
.sub_text02{text-align: justify; color: #333; font-size: 18px; padding-bottom: 30px; }
.sub_text02 p.dot {padding-left: 30px; text-indent: -10px;}

.sub01 .sub_text03{text-align: justify; color: #555; font-size: 18px; padding: 10px 10px; margin-bottom: 20px; border: 1px solid #ebebeb; word-break: keep-all;}

.sub_list{text-align: center; color: #555; font-size: 18px;  line-height: 1.5; border: 1px solid #ffcb54; margin-bottom: 20px; padding: 15px 30px; display: inline-block;}

.sub01 .sub_text_name{font-size: 18px; color: #727171; margin-bottom: 50px; text-align: right; line-height: 1.5; }
.sub01 .sub_text_name span{ font-weight: bold; color: #2b2b2b;}
.sub01 .sub_text_name .sub_img01{margin-bottom: 20px;}
.pic_infotext {font-size: 16px; color: #777777;}

.sub01 .sub_text02 .sub_tit{font-weight: bold; margin-bottom: 15px;}
.sub_text02 h6 {font-size: 20px; font-weight: 600;}
.sub01 .sub_text02 h5 {font-size: 20px; font-weight: 600;}

.sub01 .sub_link{background: rgb(243, 243, 243); padding: 20px 30px; line-height: 1.5; font-size: 16px;}
.sub01 .sub_link span{font-weight: bold;}
.sub01 .sub_link a{margin-left: 15px; background: #fff; display: inline-block; padding: 3px 10px; border-radius: 50px}
.sub01 .sub_link a:hover{color:#fff; background: #ffcb54; transition: all 0.8s;}

.sub01 .sub_img{border: 1px solid rgb(215, 215, 215); padding: 15px 10px 50px; margin: 0 10px 20px;}


.sub01 .line{border-bottom: 1px solid #757575;}
.sub01 .sub_footer .line{border-bottom: 1px solid #757575; padding: 0 0 30px 0;}
.sub01 .img_text{color: #555555; margin: auto; padding: 5px 0 10px 0; line-height: 1.5;}

.sub01 h5{font-size: 18px; padding: 30px 0 20px 0; color: #333; text-align: center;}
.sub01 h5 img.sub_flag{max-width: 40px;}

.sub01 .sub_03{display: block; background-color: #efefef; padding: 20px 30px; margin: auto; text-align: center;}
.sub01 .origin{color: #7c7c7c; margin-bottom: 50px; line-height: 1.5; font-size: 16px;}

.sub01 .sub_text02 span.sub_qu{display: block; font-weight: bold; margin-bottom: 15px; color: #ffcb54;}
.sub01 .sub_text03 span.sub_qu{display: block; font-weight: bold; margin-bottom: 15px; color: #ffcb54;}
.sub01 .sub_text03 span.sub_subtit{display: block; font-weight: bold; padding-bottom: 20px; color: #8a8a8a; margin: auto; text-align: center;}

.sub01 .poesia{max-width: 600px; margin-top: 60px; margin: auto; border: 1px solid #afafaf; padding: 50px 40px 10px 40px;}
.sub01 .poesia .sub_text03{text-align: center;}
.sub01 .poesia .sub_text03 span{display: block; text-align: right;}

.sub01 .img_text_mo{color: #555555; margin: auto; padding: 15px 0; display: none;}
.sub01 .img_text_pc{color: #555555; margin: auto; padding: 15px 0; }

.site_go{margin-left: 5px; background: #fff; display: inline-block; padding: 3px 10px; border-radius: 50px; font-size: 16px; border: 1px solid #c4c4c4;}
.site_go:hover{color:#fff; background: #ffcb54; transition: all 0.8s;}

.table-container .table {min-width: 800px;}
.table thead{background: #a1c5df;}
.table thead tr th{color: #fff; text-align: center;    vertical-align: middle; }
.table tbody tr th{font-size: 18px; text-align: center; font-weight: normal; color: #2b2b2b; line-height: 1.5; vertical-align: middle; background: #e7ecf0;
			padding: 10px;}
.table tbody tr th.table_tit{font-weight: bold; background: rgb(240, 240, 240);}
.table tbody tr th p{margin-bottom: 0px; position: relative; padding-left: 15px; font-size: 18px;}
.table tbody tr th p::before{content: '·'; position: absolute; color: #333; top: 0; left: 0;}
.table tbody tr td {line-height: 24px;  vertical-align: middle; text-align: center;padding: 10px; }

.table_h4{font-size: 20px; text-align-last: left; margin-bottom: 20px; font-weight: bold; color: #2b2b2b; line-height: 1.5;}

.slidelist{margin-top: 50px;}



.sub01 .main_mv{margin-bottom: 50px; position: relative;}
.sub01 .main_mv video{text-align: center; margin: auto; max-width: 1000px; width: 100%;}
#btn_play{position: absolute; top: 48%; left: 48%;}
#btn_play img{max-width: 50px;}

.lineheight30 {line-height: 30px;}

.qna {padding: 10px 0px; }
.qna .name {display: inline-block; padding: 10px 20px; border : 1px solid transparent; border-radius: 5px;}
.qna .color1 {color: #0c5460; background-color: #d1ecf1; border-color: #bee5eb;}
.qna .color2 {    color: #856404;    background-color: #fff3cd;    border-color: #ffeeba;}
.qna.answer {display: flex; 	justify-content:flex-start; 	align-items:flex-start;	gap: 0 20px;}
.qna.answer p:first-child {white-space: nowrap;}

a.btn_link {    display: block;
    width: fit-content;
    padding: 14px 27px;
    font-size: 20px;
    text-align: center;
    background-color: #8d8dc8;
    color: #ffffff;
    margin: auto;
    line-height: 1.5em;
    border-radius: 8px;
    box-shadow: 1px 3px 10px 1px #00000042;}

.nav-tabs {text-align: center; margin-top: 130px;}
.nav-tabs.tab7 .nav-link { width: 14.28%; margin-left: -1.5px;  font-size: 15px;  border: 1px solid #ebebeb; border-top-left-radius: 10px;  border-top-right-radius: 10px; word-break: keep-all; line-height: 1.5; text-align: center; height: 60px;}
.nav-tabs .nav-link.active, .nav-tabs .nav-item.show .nav-link {background-color: #ffcb54; color: #ffffff;}
.nav-link:nth-child(1),.nav-link:nth-child(3),.nav-link:nth-child(4),.nav-link:nth-child(6),.nav-link:nth-child(7){padding-top: 17px;}

.sub_text04 {font-size: 24px; text-align: center;}
.sub_text04 span{font-size: 0.8em; }

@media screen and (max-width: 768px){
	.main{padding-top: 20px;}
	.sub01{padding-left: 10px; padding-right: 10px;}
	.sub01 .sub_img{border: 1px solid rgb(215, 215, 215); padding: 15px 10px 30px; margin: 0 0 10px 0;}
	.sub01 .sub_text_name {font-size: 14px;}
	.title_main span  {font-size: 20px;}
	.table tbody tr td {font-size: 14px;}

	.section .slide-control label{position:absolute;z-index:1;bottom:0;transform:translateY(-50%);padding:40px;cursor:pointer;}

	.title_main{font-size: 20px; font-weight: bold; color: #fff; margin: auto; text-align: center; position:absolute; top:50%; left:50%; transform: translate(-50%, -50%); white-space: nowrap;}

	.slidelist{margin-top: 0px;}

	.sub_bg{height: 150px; margin-top: 0; background-size: cover;}
	.sub01 .tree{display: none;}
	.sub01 .sub_text{text-align: justify; color: #333; font-size: 16px;}
	.sub01 .sub_text,.sub01 .sub_text02{font-size: 16px;}

	.submain{background-color: #fff; width: 100%;}

	.sub01 h3{font-size: 24px; font-weight: bold; color: #2b2b2b; margin: 50px 0 30px 0; line-height: 1.5;}

	.sub01 .img_text_mo{color: #555555; margin: auto; padding: 15px 0; display: block;}
	.sub01 .img_text_pc{color: #555555; margin: auto; padding: 15px 0; display: none;}

	.nav-tabs.tab7 .nav-link { width: 50%; font-size: 13px;}
	.base_tab.tab7  li { width: 25%;}
	.nav-link{padding-top: 16px;}

	.sub01 h5{word-break: keep-all;}
	.sub01 h5 img.sub_flag{max-width: 30px; display: block; margin: auto; padding-bottom: 10px;}
	.sub01 h3 span {font-size: 20px;}
	.sub_text02 h6 {font-size: 18px;}
	
	.col_reverse {flex-direction: column-reverse;}
	.qna.answer {display: block;}
	.qna .name {padding: 5px 10px; margin-bottom: 5px !important;}

	.sub_text04 {font-size: 18px; }
	.tit_part {display: block;}
	.tit_part a {font-size: 12px; padding: 10px; margin-top: 5px;}
	.tit_part h4 {font-size: 18px; }
	

}


/* subtitle */
.subtitle::before{background-color: #EE7C1B; width: 2px; height: 14px; top: 50%; left: -10px; position: absolute; content: ''; transform: translateY(-50%);}
.subtitle::after{background-color: #EE7C1B; width: 2px; height: 14px; top: 50%; right: -10px;  position: absolute; content: ''; transform: translateY(-50%); }

.video video{    width: 100%;    height: 470px;    margin: 0 auto;    display: block;}
.video .bg {
    background: url(../img/bg_longform.png) top no-repeat;
    background-size: 100%;
    width: 860px;
    padding: 15px 15px 80px;
    margin: auto;
    box-sizing: border-box;
    position: relative;
}
.video2 video{    width: 100%;    height: 700px;    margin: 0 auto;    display: block;}
.video2 .bg {
    background: url(../img/bg_video2.png) top no-repeat;
    background-size: 100%;
    width: 540px;
    padding: 15px 15px 80px;
    margin: auto;
    box-sizing: border-box;
    position: relative;
}

h5.tit_2_7 {font-size: 24px; padding: 0; font-weight: 600; font-family: 'Paperlogy';}


@media screen and (max-width: 768px) {

	.sub_text02 h4 {font-size: 20px;}
	h5.tit_2_7 {font-size: 20px; }
	.video .bg {        width: 100%;        padding: 10px 10px 40px 10px;        background-size: cover;    }
	.video  video {height: auto;  max-height: 100vh;    }

	.video2 .bg {        width: 100%;        padding: 0px;        background:none; }
	.video2  video {height: auto;  max-height: 100vh;    }


	.tit_part {font-size: 20px;}
	.btn_youtube {font-size: 12px;}
	/* table */
	.table-container{
		width:100%;	
		overflow-x:auto;
		overflow-y: hidden;
		white-space: nowrap;}
	.table{width:auto;}
	::-webkit-scrollbar { -webkit-appearance: none; } 
	::-webkit-scrollbar:vertical { width: 12px; } 
	::-webkit-scrollbar:horizontal { height: 8px; } 
	::-webkit-scrollbar-thumb { background-color: rgba(0, 0, 0, .5); border-radius: 10px; border: 2px solid #ffffff; } 
	::-webkit-scrollbar-track { border-radius: 10px; background-color: #ffffff; }

	.table thead th{font-size: 16px;}
	.table tbody tr th{font-size: 14px;}
	.table tbody tr th p{font-size: 14px;}

}

/* 카드뉴스 슬라이드 */
#carouselExampleIndicators {max-width: 800px; width: 100%; margin: auto; }
.slide button {border: 0; background: transparent;}
.carousel-indicators {bottom: 10px;}
.carousel-indicators li {width: 10px; height: 10px; background-color: #222222; border: 0; border-radius: 10px;}
.carousel-control-prev i, .carousel-control-next i {width: 40px; height: 40px; cursor: pointer; color: #222222; font-size: 40px;}
.carousel-control-prev {left: -80px;}
.carousel-control-next {right: -80px;}

@media screen and (max-width: 768px) {
	.carousel-control-prev {left: 10px;}
	.carousel-control-next {right: 10px;}
	
}