@import url('https://fonts.googleapis.com/css?family=Oxygen:300,400,700&display=swap');
  @import url('https://fonts.googleapis.com/css?family=Work+Sans:100,200,300,400,500,600,700&display=swap');
  @import url('https://fonts.googleapis.com/css2?family=Playfair+Display:wght@400;500;600;700&display=swap');
  
 h2 {font-size:2.1em; color:#444; line-height:1.3em;}
 h3 {font-size:1.4em; color:#444; line-height:1.2em;}
 h4 {font-size:1.2em; color:#555; line-height:1.4em;}
 h5 {font-size:1.0em; color:#555;}
 
  p {font-size:1em; line-height:1.7em;}
  
 @media screen and (max-width: 767px) {
 h2 {font-size:1.7em;}
 }

 
 .main_wrap{
width:100%; position:relative; }

.section {padding-top:60px; background:#fff; position:relative; }
.section.mg_0 {margin:0px;}
.section.pd_0 {padding:0px;}

.section .title {text-align:center; margin-bottom:40px; padding:0 10%;}
.section .title p {margin-top:10px;}

.button { margin:20px auto 0; padding:8px 30px; border:1px solid #a3bece;  }
.button:hover{color:#fff; background:#a3bece; border:1px solid transparent; text-decoration:none;}

.button_solid {
		border:1px solid transparent; text-align: center; color:#fff; background: rgba(14, 129, 136, 0.5);	}
	.button_solid:hover {
		background: rgba(14, 129, 136, 1);}
		
.button_circle {
 width:90px; height:90px; padding:0; border-radius:50%; display:table; line-height:1.5em;
border:1px solid #fff;}
.button_circle span {
display:table-cell; vertical-align:middle;}
.button_circle:hover {
border:1px solid transparent; background:rgba(0,0,0, 0.5);}

.button_white {
color:#fff; border-color:#fff;}
.button_white:hover {
border:1px solid transparent; background:rgba(0,0,0, 0.5);}

	.dark, .dark h2, .dark h3, .dark h4, .dark a {
	color:#fff;}	
		
.bg {
background-size: cover !important;
		background-position: center center !important;}
.bg_none {
background:none;}
.bg_org {
background:#e69934;}

.d_tb {display:table;}	
.d_tbc {display:table-cell; vertical-align:middle;}	

.overlay {position:absolute; left:0; top:0; width:100%; height:100%;}

.line_ver {width:1px; height:20px; background:#ccc;}

.ov_h {overflow:hidden;}

.bd {border:1px solid #ccc;}


	

/* Intro */
	.intro {
		/*background: url("../main/main_bg.jpg");*/
		background-size: cover;
		background-attachment: fixed;
		/*height:100vh;*/ /**/ max-height: 800px; position:relative; z-index:0;}

.intro .container {
		position:relative;}			
	.intro .caption { 
  position: absolute;  top:35%; left: 10%; right: 10%;  z-index: 20; text-align: center; }
 .intro .caption h2 {
    font-family: 'open sans','nanum gothic', sans-serif;  font-size:3.0em; letter-spacing:-1px; 
	text-shadow: 0 1px 2px rgba(0, 0, 0, .5); padding-bottom:20px; position:relative;}
 .intro .caption h2:before{
	content: ''; background: #fff; width: 10%; height: 2px;
    position: absolute; bottom: 0%; left: 45%;}
.intro .caption p {
    font-size: 1em; text-shadow:none; padding:0; margin: 20px auto 0;}

.intro .item_grid { position:relative; text-align:center;  
clear:both; margin-bottom:30px;}
.intro .img_cell { 
 margin:0 auto; width:70%;}

.intro .floating-item {
  -webkit-animation-name: floating-item;
          animation-name: floating-item;
  -webkit-animation-duration: 2s;
          animation-duration: 2s;
  -webkit-animation-iteration-count: infinite;
          animation-iteration-count: infinite;
  -webkit-animation-timing-function: ease-in-out;
          animation-timing-function: ease-in-out; }

@-webkit-keyframes floating-item {
  from {
    -webkit-transform: translate(0%, 0);
            transform: translate(0%, 0); }
  50% {
    -webkit-transform: translate(0%, 10px);
            transform: translate(0%, 10px); }
  to {
    -webkit-transform: translate(0%, 0);
            transform: translate(0%, 0); } }

@keyframes floating-item {
  from {
    -webkit-transform: translate(0%, 0);
            transform: translate(0%, 0); }
  50% {
    -webkit-transform: translate(0%, 10px);
            transform: translate(0%, 10px); }
  to {
    -webkit-transform: translate(0%, 0);
            transform: translate(0%, 0); } }

	
.intro .movie {
margin:0 0;}
.intro .movie:after {
	content: ''; background: rgba(0,0,0, 0.4); width: 100%; height: 100%;
    position: absolute; top:0%; left: 0%;}
.intro .movie:before {
content: ''; background: url("../main/overlay.png"); 
    width: 100%; height: 100%;  position: absolute; top: 0%; left: 0%; z-index:1;}
.carousel-control {display:none;
  position: absolute; top: 50%; width: 10%;  padding-top:0px;}


@media screen and (max-width: 1199px) {
.intro .item {height:600px; }
   .intro .caption h2 {}
}
	
@media screen and (max-width: 991px) {
.intro .item {height:500px; }
}

@media (max-width: 767px) {
.intro .item {height:300px; }
.intro .caption {
   left: 10%; right: 10%; top:30%;}
	.intro .caption h2 {font-size:2.5em;}
		.intro .button {display:none;}
	.carousel-indicators {
  bottom: 10px;}
.carousel-indicators li {
  width: 20px; height: 6px; }
.carousel-indicators .active {
  width: 20px; height: 6px; }
	}
	
	@media screen and (max-width: 480px) {
	.intro .caption h2 {
			font-size:1.8em; }
	}
	
	
	
	
	.tag {
	background:#222; margin-top:0px; padding:0px 0; position:relative;	text-align:center;}
	.tag .grid {
	display:inline-block; margin:0 auto; height:50px; vertical-align:middle;}
	.tag .thumb {
	float:left; display:inline-block; position:relative; height:100%; margin-right:10px;}
	.tag .thumb img{
	width:auto; height:100%;}
	.tag .desc {
	 float:left; display:table; padding:0px 0; height:100%; }
	
	.tag h4{
	font-size:1.0em; letter-spacing:1px; text-align:center; text-transform:uppercase;}
	.tag h4 span {
	margin-left:10px; color:#eea629;}
.tag .img_cell {
min-height:150px; background: url("../main/tag.jpg");}
 .pop_close { line-height: 35px; position:absolute; right:5%; top:10%;}
.pop_close input {width:20px; height:20px; margin:0 10px -5px 0; }
.pop_close i {font-size:1.3em; margin:0 0px 0 10px;}
.tag_off {padding:10px 0;}
.tag_on .desc {
	position:absolute; left:0; top:45%; width:100%; text-align:center; }

	@media screen and (max-width: 991px) {
	.tag, #tag_banner {display:none;}
	}
	
	
	
	
	.md_01 {
	margin: 0px auto; }
.md_01 .grid {position:relative; padding:0 0;}
.md_01 .cell_01{/*left:0; top:30%;*/ text-align:right; /*position:absolute;*/ width:42%; float: left;}
.md_01 .cell_02 {/*right:0%; top:25%;*/ /*position:absolute;*/ width:55%;/*42%*/ float: right; }
.md_01 h2 {font-family:'Oxygen'; font-weight:400; margin-top:0;}
.md_01 h4 {margin-top:0px;}
.md_01 p {margin-top:5px;}
.md_01 .img_cell {text-align:center; width:14%; margin:0 auto; }
.md_01 .img_cell img {max-width:100%;}

@media screen and (max-width: 1199px) {
.md_01 .cell_01{top:25%;}
.md_01 .cell_02 {top:20%; right:0%;}
}
@media screen and (max-width: 991px) {
.md_01 .desc_grid {position:relative; width:100%; left:0; }
.md_01 .cell_01, .md_01 .cell_02{top:0%; text-align:center; position:relative; width:100%;}
.md_01 h4 {margin-top:10px;}
.md_01 .img_cell {text-align:center; width:50%; margin:20px auto 0; }
}


	
	.md_02 {
		margin-top:0px;	}
.md_02  h2 {letter-spacing:-0.5px;}
	.md_02 h2 span {color:#116a98;}
.md_02 .desc {
	 width: 100%; text-align:center; position: relative; 
	 transition:0.2s ease-out; -webkit-transition: all 0.2s ease-out;
}
.md_02 .desc h3 {margin-top:25px; border-bottom:1px solid #aaa; 
 width: 100%;  padding: 0px 0 15px; 
}
.md_02 .desc p { 
margin: 10px 0px 0px; padding:0 5%;}
.md_02 .col .img_cell {
	overflow: hidden;  border-radius:5px; position:relative;
}
.md_02 .img_cell img {
width: 100%;
	transition:0.2s ease-out;  transform: scale(1); -webkit-transition: all 0.2s ease-out; -webkit-transform: scale(1);	}
.md_02 .col:hover .img_cell img {
	transform: scale(1.2); -webkit-transform: scale(1.2);}

@media screen and (max-width: 767px) {
.md_02 .col {
	margin: 50px 0px 0px;
}
.md_02 .col:first-child {
	margin-top: 0px;}
}



.md_03 {	background: url("../main/con_03_bg.jpg");
		background-size:cover;
		background-attachment: fixed;
		background-position: center center;
	margin: 0px auto 0; padding:80px 0; position:relative;
}
.md_03 .grid {
text-align:center; }
.md_03 .desc h2 {
	font-weight: 400;
}
.md_03 .desc p {
	margin-top: 20px; }
.md_03 .icon {
padding:0 10%; }
.md_03 i {
font-size:2.2em; line-height:1.2em; margin:10px auto 10px; 
transition: 0.2s ease-out; -webkit-transition: all 0.2s ease-out;}
.md_03 .col:hover i {
margin:0px auto 20px;}
.md_03 .line-ver {
width:1px; height:30px; background:#ddd; margin:10px auto 10px; 
transition: 0.2s ease-out; -webkit-transition: all 0.2s ease-out;}
.md_03 .col:hover .line-vertical {
height:40px; margin-bottom:0;}
.md_03 .button_solid {
	margin: 30px 0px 0; text-align: center; color:#fff; 
}

@media all and (max-width: 767px) {
.md_03 .col {
width:50%; float:left; min-height:150px;}
.md_03 .col:nth-child(2) {
margin-top:0;}
.md_03 h4 {
font-size:1.1em;}
	}
	

	

.md_04 {margin-top:0px;}
.md_04 .col {}
.md_04 .bn {
	 overflow: hidden; margin-top:15px;
}
.md_04 .img_cell i { 
	border-radius: 6px; border:1px solid #ddd; transition:0.4s ease-out; width: 30%; text-align: center; 
	line-height: 95px; font-size: 3.0em; 
	float: left;  -webkit-transition: all 0.4s ease-out;
}
.md_04 .img_cell img {display:none;
max-width:100%;}
.md_04 .desc {
	width: 70%; padding-left: 20px; float: right; text-align:left;
}
.md_04 .desc h3 {margin-top:0px;}
.md_04 .desc h4 {
	margin: 0; transition:0.2s ease-out; -webkit-transition: all 0.2s ease-out;
}
.md_04 .desc p {
	text-align: left;  margin-top:0px;}

	.md_04 .nav > li > a {
	padding: 5px 15px;}
	.md_04 .nav-tabs {
  border-bottom: 1px solid #ccc;}
.md_04 .nav-tabs > li > a {
  border-radius: 4px 4px 0 0;}
.md_04 .nav-tabs > li > a:hover {
  border-color: #eee #eee #ccc;}
.md_04 .nav-tabs > li.active > a,
.md_04 .nav-tabs > li.active > a:hover,
.md_04 .nav-tabs > li.active > a:focus {
  border: 1px solid #ccc; border-bottom-color: transparent;}
.md_04 .board_recent .header {
text-align:left; border-bottom:1px solid #ccc; padding:0 5px 5px; margin-bottom:10px; }
.md_04 .board_recent .more {float:right; color:#777777;font-size:11px; margin-top:2px;} 
	.md_04 .board_list_output {padding:0; margin-top:10px;}
	
	@media screen and (max-width: 1199px) {
	.md_04 .board_list_output {margin-top:0px; }
	}
		

	
	
.md_05 {margin-top:0px; text-align:center;}	
.md_05 .icon ul {
	overflow: hidden; margin:0 auto; display:inline-block;
}
.md_05 .icon li {
float: left; margin:0 5px; padding: 0px; border-radius: 50%; text-align:center;
	border:0px solid #bbb; transition:0.2s ease-out; width: 36px; height: 36px; overflow: hidden; 
	opacity: 1; -webkit-transition: all 0.2s ease-out; background:#ddd; display:table;
}
.md_05 .icon li:nth-child(1) {background:#6087c1;}
.md_05 .icon li:nth-child(2) {background:#90a291;}
.md_05 .icon li:nth-child(3) {background:#deb162;}
.md_05 .icon li:nth-child(4) {background:#90a291;}
.md_05 .icon li a {width:100%; height:100%; display:inline-block; color:#fff; }
.md_05 .icon li:hover {opacity:0.5;} 
.md_05 .icon li i {
font-size:1.4em; margin-top:8px;}
.md_05 .icon li img {display:none; width: 100%; height: 100%;}

.md_05  h3 {
	text-align: center; font-size: 1.3em; font-weight: 400; margin-top:20px;
}
.md_05  h3 span {font-weight:600;}
.md_05 p {
	margin-top: 10px;  
}

@media screen and (max-width: 767px) {
.md_05  h3 {
	font-size: 1.2em;}
}






.md_08 {
margin-top:0px;}
.md_08 .col {
	height: 250px; width: 100%;
	border-right:1px solid #fff; border-bottom:1px solid #fff; 
	float: left; position:relative; overflow:hidden;
}
.md_08 .center_grid .col {
	height: 530px; }
.md_08 .col:nth-child(2) {
	margin-top:30px;}
	
.md_08 .cell {
	width: 100%; height: 100%; display: table; background-color: rgba(0, 0, 0, 0.1);
	position:absolute; z-index:10;
	transition:0.2s ease-out; -webkit-transition: all 0.2s ease-out;}
.md_08 .cell:hover {
	background-color: rgba(0, 0, 0, 0.6);
}
.md_08 .left_grid .col:nth-child(1) .img_cell {background: url("../main/pic_01.jpg");}
.md_08 .left_grid .col:nth-child(2) .img_cell {background: url("../main/pic_02.jpg");}
.md_08 .center_grid .col:nth-child(1) .img_cell {background: url("../main/pic_03.jpg");}
.md_08 .right_grid .col:nth-child(1) .img_cell {background: url("../main/pic_04.jpg");}
.md_08 .right_grid .col:nth-child(2) .img_cell {background: url("../main/pic_05.jpg");}

.md_08 .img_cell {
position:relative; left:0; top:0; width:100%; height:100%; 
transition: 0.2s ease-out; -webkit-transition: all 0.2s ease-out;
	background-position: center !important; background-size: cover !important;}

.md_08 .desc {
	text-align: center; vertical-align: middle; display: table-cell; 
	padding-top:20px;
	transition:0.2s ease-out; -webkit-transition: all 0.2s ease-out;
}
.md_08 .desc:hover {
	padding-top: 0px;
}
.md_08 .desc i {
	margin-bottom: 10px; font-size: 2em; display: inline-block;}
.md_08 .desc h3 {
	text-align: center; margin-top:0px; 
}
.md_08 .desc p {
	text-align: center; opacity:0; margin-top:10px; padding:0 30px;
}
.md_08 .desc:hover p {opacity:1.0;}

.md_08 .info {
padding:0 15%; margin-top:30px; color:#666; text-align:center;}

	@media screen and (min-width: 1400px) {
	.md_08 .col {}
	}

@media screen and (max-width: 767px) {
.md_08 .col {
	width: 100%; height: 200px; margin-top: 0px;
}	
}








.board_gallery_output table {
	width: 100%;
}
.board_gallery_output .board_output_gallery_img {
	border: 0px solid rgb(255, 0, 0); padding:0 10px 0 5px;
}
.board_gallery_output .board_output_gallery_img img {
	width: 100%; height: auto; border-radius:5px; overflow:hidden; 
}
.board_gallery_output .board_output_gallery_img a {
	width: 100%; height: 100%; display: block; position: relative;
}
.board_gallery_output .board_output_gallery_img a::before {
	transition:0.2s ease-out; left: 0px; top: 0px; width: 100%; height: 100%; position: absolute; content: ""; opacity: 0; 
	background-color: #fff;
}
.board_gallery_output .board_output_gallery_img a:hover::before {
	opacity: 0.5;
}
.board_gallery_output tbody tr td {
 width: 10%;
}
.board_gallery_output tbody tr td table {
	border: 0; width: 100%; text-align: center;
}
.board_gallery_output .board_output .board_output_gallery_img br{
display:none;}
.board_output_gallery_subject {font-family:'nanum gothic'; color:#666; margin:5px auto 20px; display:inline-block;}
.board_output_gallery_subject a {font-family:'nanum gothic'; color:#666;}
.board_output_gallery_subject a:hover {text-decoration:none;}

	@media screen and (max-width: 767px) {	
			.board_gallery_output .board_output img{width:100%; height:auto;	}
	}

	

.board_list_output .board_output .board_output tbody > tr > td {
	padding: 2px 0px; font-size: 0.9em; border-bottom-color:#ddd; border-bottom-width: 1px; border-bottom-style: dotted;
}
.board_list_output .board_output .board_output tr td:nth-child(1) {
	width: 3%;
}
.board_list_output .board_output .board_output tr td:nth-child(2) {
	width: 70%; text-align: left;
}
.board_list_output .board_output .board_output tr td:nth-child(3) {
	width: 27%; text-align: right; font-size: 0.87em;
}
.board_list_output .list_output .bd_out1 {
	padding: 2px 0px;
}
.board_list_output .board_output .board_output a {font-family:'nanum gothic'; color:#666;}
.board_list_output .board_output .board_output a:hover {text-decoration:none;}
.board_list_output .board_output {font-family:'nanum gothic'; font-size:15px; color:#777;}

@media all and (max-width: 767px) {
.board_list_output .board_output .board_output tr td:nth-child(3) {
	display:none;}
}



.board_blog_output .board_output .board_output tbody > tr > td {
	padding: 5px 0px; font-size: 0.9em; border-bottom-color:#ddd; border-bottom-width: 1px; border-bottom-style: dotted;
}
.board_blog_output .board_output .board_output tr td:nth-child(1) {
	display:none;}
.board_blog_output .board_output .board_output tr td:nth-child(2) {
	width: 20%;}
.board_blog_output .board_output .board_output tr td:nth-child(3) {
	width: 30%; text-align: left; padding-left:20px;
}
.board_blog_output .board_output .board_output tr td:nth-child(4) {
	width: 50%; padding-left:20px;}
.board_blog_output .board_output .board_output img {
width:100%; height:auto;}
.board_blog_output .board_output {font-family:'nanum gothic'; color:#777; }
.board_blog_output .board_output .board_output a {font-family:'nanum gothic'; color:#666;}
.board_blog_output .board_output .board_output a:hover {text-decoration:none;}

@media all and (max-width: 767px) {}



#pop {padding:0px; position:absolute; left:5%;bottom:0px; z-index:20;visibility:hidden;}
#pop .desc {position:absolute; left:0; top:50%; z-index:20; width:100%;
text-align:center;}
#pop .close_tab {text-align:center; position:absolute; bottom:0px; width:100%; height:30px; padding:0px 0; 
background:rgba(0,0,0, 0.4); font-size:0.9em;}

@media screen and (max-width: 991px) {
			#pop, #pro {display:none;}			
	}

	
	#pro img {opacity:1; transition:0.2s ease-out; -webkit-transition: all 0.2s ease-out;}
#pro img:hover {opacity:1;}



.modal-dialog {margin-top:100px;}
.modal-header .close {
	margin-top: -15px;font-size: 50px;}
.modal-header .close:hover {background:none;}
.modal-body {
  padding: 20px;
}
.modal-body img{ width:100%;}
.modal-body p{
  margin-top:20px; line-height: 30px;
}
	


#preloader {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #f5f5f5;
    /* change if the mask should be a color other than white */
    z-index: 1000;
    /* makes sure it stays on top */
}

.pre-container {
    position: absolute;
    left: 50%;
    top: 50%;
    bottom: auto;
    right: auto;
    -webkit-transform: translateX(-50%) translateY(-50%);
    transform: translateX(-50%) translateY(-50%);
    text-align: center;
}

.spinner {
    width: 40px;
    height: 40px;
    position: relative;
    margin: 100px auto;
}

.double-bounce1,
.double-bounce2 {
    width: 100%;
    height: 100%;
    border-radius: 50%;
    background-color: #ffbf00;
    opacity: 0.6;
    position: absolute;
    top: 0;
    left: 0;
    -webkit-animation: bounce 2.0s infinite ease-in-out;
    animation: bounce 2.0s infinite ease-in-out;
}

.double-bounce2 {
    -webkit-animation-delay: -1.0s;
    animation-delay: -1.0s;
}

@-webkit-keyframes bounce {
    0%,
    100% {
        -webkit-transform: scale(0.0)
    }
    50% {
        -webkit-transform: scale(1.0)
    }
}

@keyframes bounce {
    0%,
    100% {
        transform: scale(0.0);
        -webkit-transform: scale(0.0);
    }
    50% {
        transform: scale(1.0);
        -webkit-transform: scale(1.0);
    }
}
  
  
 
	
	
	
	
/* Footer */
#footer{
	margin-top:80px;
}
	.bottom_info {
		position: relative;
		margin-top: 0px; padding:40px 0;
		background: #39454b;
		color: #bbb;
		overflow: hidden;
	}
	.bottom_info  h4 {color:#ddd;}
	.bottom_info  p {margin-top:10px;}
.bottom_info .info {margin-top:10px; font-size:0.95em;}
.bottom_info .info ul li {
	padding-bottom: 5px; width:100%;
}
		#bottom a {
			color: #bbb;}
			#bottom a:hover {
				color: #bbb;}


.bottom_info .social {
	/*float: left;*/ overflow: hidden;}
.bottom_info .social li {
float: left; margin-right:15px; border-radius: 3px; text-align:center;
	border:1px solid #999; transition:0.2s ease-out; width: 28px; height: 28px; overflow: hidden; 
	opacity: 1; -webkit-transition: all 0.2s ease-out; font-size:0.9em; line-height:19px;
}
.bottom_info .social i {
margin-top:4px; font-size:1.4em;} 


.copyright { padding:15px 0;
font-size:0.95em; background: #222; color: #fff;}
.copyright .info ul li {
	padding-bottom: 5px; float:left; }
	.copyright .info ul li.add {
	padding-right: 20px;  }
.copyright .info ul li.copy {
	width:100%; }

	


/* scroll to top */
	.scrollToTop {
	border-radius: 2px; transition:0.1s ease-out; text-align: center; right: 20px; bottom: 20px; display: none; position: fixed; z-index: 100; background-color: rgb(17, 17, 17); -webkit-transition: all 0.1s ease-out;
}
.scrollToTop:hover {
	bottom: 25px;
}
.scrollToTop a {
	transition:0.1s ease-out; width: 40px; height: 40px; color: rgb(170, 170, 170); padding-top: 7px; font-size: 1em; display: block; -webkit-transition: all 0.1s ease-out;
}
.scrollToTop a:hover {
	color: rgb(255, 255, 255);
}



.md_04 .main_news {
    width: 50%;
    margin: 0 auto;
}
.bottom_info .social:after {display: block; content: ""; clear: both;}
#bottom .catalog {clear: both; margin-top: 10px;}
#bottom .catalog a {display: inline-block; padding: 5px 12px; border:1px solid #ccc; ; background: #eeeeee; color: #b83032; text-decoration: none; font-size: 12px; transition: all 0.3s;}
#bottom .catalog a:hover {background: #bbb;  transition: all 0.3s;}