@charset "utf-8";
/* CSS Document */
/*메인 */
.sp_50{ width:100%; float:left; height:50px}
.sp_30{ width:100%; float:left; height:30px}
.sp_20{ width:100%; float:left; height:20px}
.com_100box{ width:100%; float:left; font-size:14px }
/*컨텐츠 공간 */
.cont_top_padding { margin:50px 0px 0px 0px}
.irm_left{ width:90%; overflow:hidden}

.center_title{
	width:100%;
	float:left;
	margin:50px 0px 30px 0px;
	text-align: center;
	overflow: hidden;
	background-image: url(../_img/common/title_line.gif);
	background-repeat: repeat-x;
	background-position: left center;
}
.center_title .title{ background-color:#fff; padding:10px; font-size:24px; color:#000 ; line-height:24px ;display: inline-block; vertical-align: middle;}

.com_title{
	width:100%;
	float:left; margin-bottom:10px;  font-size:24px; color:#000 ; line-height:24px
}


.cont01_0101{ float:left; width:100%}
.cont01_0102{ float:left; width:48%}
.cont01_0102_ { float:center; width:48%}
.r_padding{ float:left;  margin-right:2%}
.cont01_0103{ float:left; width:100%; margin-top:50px}
.cont01_0103 .inbox{ float:left; width:30%}
.cont01_0103 .inbox .title{
	float:left;
	padding-right:30px;
	background-image: url(../_img/02/img01_0103.gif);
	background-repeat: no-repeat;
	background-position: right 10px; font-size:20px; color:#000; margin-bottom:15px
}
.cont01_0103 .inbox .text{	float:left; width:100%; font-size:13px}
.r_line{ border-right:1px solid #ccc; margin-right:2.5% ; height:150px}


.cont01_0201{ float:left; width:100%; }
.cont01_0201 .title{ float:left; width:100%; border-bottom:1px solid #666666; margin-bottom:20px }

.cont01_0201 .title .title_text{ float:left; padding:10px 20px; color:#fff; background-color:#666666; font-size:20px}
.cont01_0201 .inbox{
	float:left;
	width:100%;
	padding:20px 0px;
	background-image: url(../_img/common/dot_line.gif);
	background-repeat: repeat-x;
	background-position: left bottom;
}
.cont01_0201 .inbox .title1{	float:left;	width:300px; font-size:20px; color:#000; padding:20px 0px 0px 0px; box-sizing:border-box}
.cont01_0201 .inbox .img{	float:right;	}

.cont02_0101{float:left; width:100%; text-align:center; margin-bottom:30px }


.cont02_0102{float:left; width:100%; background-color:#f7f7f7; padding:50px; box-sizing:border-box}
.cont02_0102 .inbox{float:left; width:50%;}
.cont02_0102 .inbox .stitle{float:left; width:100%; margin-bottom:10px; color:#000; font-size:18px}
.cont02_0102 .inbox ul li{
	float:left;
	width:100%;
	background-image: url(../_img/common/dot_01.png);
	background-repeat: no-repeat;
	background-position: left 8px; box-sizing:border-box; padding-left:10px; font-size:14px; color:#666; margin-bottom:5px
}
.cont02_0102 .inbox .btn{
	float:left; margin-top:20px
}
.cont02_0102 .inbox .btn a{
	float:left; padding:15px 20px; background-color:#3269ad; color:#Fff; font-size:14px
}
.cont02_0102 .inbox .btn a:hover{ background-color:#15457f; text-decoration:none 
}
.left_line{ padding-left:20px; box-sizing:border-box; border-left:1px solid #ccc
}


.cont03_0101{float:left; width:100%	; margin-top:30px}
.cont03_0101 .text{float:left; width:100%; font-size:14px; color:#666; margin-bottom:30px}
.cont03_0101 .img{float:left; width:100%; }

.cont03_0102{float:left; width:100%; background-color:#f7f7f7; padding:30px; box-sizing:border-box; border:1px solid #ccc}
.cont03_0102 .inbox{float:left; width:50%;}
.cont03_0102 .inbox .title_line{float:left; width:100%; border-bottom:1px solid #666666; margin-bottom:30px}
.cont03_0102 .inbox .title_line .text_s{float:left; padding:10px 20px; color:#fff; font-size:18px ; background-color:#666}
.cont03_0102 .inbox .img{float:left; width:100%;}
.cont03_0102 .inbox .text{float:left; width:100%; margin-top:30px}


.cont03_0201{float:left; width:100%	;  margin-top:30px}
.cont03_0202{float:left; width:100%	; background-color:#f7f7f7; padding:50px 40px; box-sizing:border-box; border:1px solid #eee}
.cont03_0202 .title_b{color:#000; font-size:22px ;  margin-bottom:30px; display:block; width:auto; float:left; border-bottom:1px solid #333}
.cont03_0202 .img{  color:#fff; font-size:18px ;}


.cont03_0301{float:left; width:100%	;  margin-top:30px}
.cont03_0301 .left{float:left; width:680px;}
.cont03_0301 .right{float:right; width:360px;}
.cont03_0301 .right .title{float:left; width:100%; font-size:24px; color:#000; margin-bottom:20px; margin-top:50px}
.cont03_0301 .right .text{float:left; width:100%; font-size:14px; color:#666; }
.cont03_0302{float:left; width:100%	;  background-color:#f7f7f7; padding:30px; box-sizing:border-box; position:relative;border:1px solid #eee}

.cont03_0302 .title{color:#000; font-size:22px ;  margin-bottom:30px; display:block; width:auto; float:left; border-bottom:1px solid #333; position:absolute; top:50px; left:50px}
.cont03_0302 .title em{color:#999; font-size:16px ; margin-left:10px }


.cont03_0401{float:left; width:100%	;  margin-top:30px}
.cont03_0401 .left_title{float:left; width:20%; }
.cont03_0401 .left_title .line{float:left; width:100%; box-sizing:border-box; border-left:30px solid #666; height:1px ; margin-bottom:10px}
.cont03_0401 .left_title .title_t{float:left; width:100%; font-size:24px; line-height:26px; color:#000}
.cont03_0401 .img1{float:left; width:320px; }
.cont03_0401  .text_box{float:left; width:500px; font-size:16px; color:#333; padding:20px; box-sizing:border-box }
.cont03_0401 .img{float:right; width:80%; }


.cont03_0501{float:left; width:100%	;  margin-top:30px}
.cont03_0501 .left{float:left; width:320px;}
.cont03_0501 .right{float:right; width:750px;}
.cont03_0501 .right .title{float:left; width:100%; font-size:24px; color:#000; margin-bottom:20px; margin-top:50px}
.cont03_0501 .right .text{float:left; width:100%; font-size:14px; color:#666; }
.cont03_0502{float:left; width:100%	;  background-color:#f7f7f7; padding:50px; box-sizing:border-box; position:relative;border:1px solid #eee; text-align:center}



.cont04_0101{float:left; width:100%	;  margin-top:30px}
.cont04_0101 .left{float:left; width:630px;}
.cont04_0101 .right{float:right; width:430px;}
.cont04_0101 .right .title{float:left; width:100%; font-size:24px; color:#000; margin-bottom:20px; margin-top:50px}
.cont04_0101 .right .text{float:left; width:100%; font-size:14px; color:#666; }
.cont04_0102{float:left; width:100%	;  background-color:#f7f7f7; padding:50px; box-sizing:border-box; position:relative;border:1px solid #eee; text-align:center}

.cont04_0103{float:left; width:100%	; margin-top:50px }
.cont04_0103 .title{float:left; width:100%	; text-align:center; font-size:24px; color:#000 }
.cont04_0103 .title em{ font-size:16px; color:#666}

.cont04_0103 .listbox2{float:left; width:100%	; border-top:1px solid #ccc; padding:0px 0px; margin-top:50px}
.cont04_0103 .listbox2 ul li{float:left; width:100%	; padding:20px 0px;;border-bottom:1px solid #ccc;}
.cont04_0103 .listbox2 ul li .left{
	float:left;
	width:220px;
	background-image: url(../_img/02/img03_0503.jpg);
	background-repeat: no-repeat;
	background-position: right center;
}
.cont04_0103 .listbox2 ul li .left .intitle{
	float:left;
	width:175px; height:175px; background-color:#8392c5; border-radius: 200px; text-align:center; vertical-align:middle; color:#fff; padding-top:60px; box-sizing:border-box
}
.cont04_0103 .listbox2 ul li .left .intitle em{ color:#fff; font-size:24px
}
.cont04_0103 .listbox2 ul li .left .intitle2{
	float:left;
	width:175px; height:175px; background-color:#8392c5; border-radius: 200px; text-align:center; vertical-align:middle; color:#fff; padding-top:80px; box-sizing:border-box; font-size:24px
}

.cont04_0103 .listbox2 ul li .right{
	float:right;
	width:830px; padding-top:20px
}


.cont04_0201 { background-color:#f7f7f7; padding:50px; box-sizing:border-box; width:100%; float:left; text-align:center; box-sizing:border-box; border:1px solid #eee}



.year_title{	float:left;	width:100%; font-size:26px; color:#000; margin-bottom:10px}
.year_title2{	float:left;	width:100%; font-size:26px; color:#000; margin-bottom:10px; text-align:right}
.year_title em{ color:#7da1d2}
.year_list{float:left;	width:100%; font-size:14px; color:#666;}
.year_list2{float:left;	width:100%; font-size:14px; color:#666; text-align:right}






.cont0102{ float:left; width:100%}
.cont0102 .left_img{ float:left; width:100%; margin-top:30px}
.cont0102 .right_cont{
	float:left;
	width:100%;
	background-image: url(../_img/01/img04_02.jpg);
	background-repeat: no-repeat;
	background-position: center top; position:relative;  height:400px; margin-bottom:50px; margin-top:30px
}
.cont0102 .right_cont .y_2015{
	float:left;
	width:600px;
	background-image: url(../_img/01/img04_03.png);
	background-repeat: no-repeat;
	background-position: right 0px;
	position:absolute; top:60px;left:-40px; padding-right:80px;
}
.cont0102 .right_cont .y_2014{
	float:left;
	width:600px;
	background-image: url(../_img/01/img04_04.png);
	background-repeat: no-repeat;
	background-position: left 0px;
	position:absolute; top:130px; left:542px; padding-left:80px;
}

.cont0102 .right_cont .y_2013{
	float:left;
	width:600px;
	background-image: url(../_img/01/img04_03.png);
	background-repeat: no-repeat;
	background-position: right 0px;
	position:absolute; top:200px; left:-40px; padding-right:80px;
}
.cont0102 .right_cont .y_2012{
	float:left;
	width:600px;
	background-image: url(../_img/01/img04_04.png);
	background-repeat: no-repeat;
	background-position: left 0px;
	position:absolute; top:280px; left:542px; padding-left:80px;
}

.cont0102 .right_cont .y_2002{
	float:left;
	width:500px;
	background-image: url(../_img/01/img04_03.png);
	background-repeat: no-repeat;
	background-position: right 0px;
	position:absolute; top:370px; left:165px; padding-right:130px;
}
.cont0102 .right_cont .y_1992{
	float:left;
	width:380px;
	background-image: url(../_img/01/img04_04.png);
	background-repeat: no-repeat;
	background-position: left 0px;
	position:absolute; top:450px; left:525px; padding-left:130px;
}

.cont0103{ float:left; width:100%; margin-top:30px}


.about01_01{ float:left; width:100%; margin-top:30px;}
.about01_01 .left{ float:left;  width:650px;}
.about01_01 .left .title_box2{ float:left; width:100%; margin-bottom:10px }
.about01_01 .left .title_box2 .line{ float:left; width:100%; border-left:30px solid #333; margin-bottom:20px; height:1px; box-sizing:border-box }
.about01_01 .left .title_box2 .title_text{ float:left; width:100%; font-size:30px; color:#000; margin-bottom:20px }
.about01_01 .left .text_box2{ float:left; width:100%; font-size:14px ; color:#666}
.about01_01 .left .text_box2 em{ float:left; width:100%; font-size:18px ; color:#333}
.about01_01 .right{ float:right;  width:431px;}

.about01_02{ float:left; width:100%; background-color:#f9f9f9; padding:50px; box-sizing:border-box ; margin-top:50px }
.about01_02 .left_title{ float:left; width:180px;  }
.about01_02 .left_title .line{ float:left; width:100%; border-left:30px solid #333; margin-bottom:20px; height:1px; box-sizing:border-box }
.about01_02 .left_title .title_text{ float:left; width:100%; font-size:30px; color:#000; margin-bottom:20px }
.about01_02 .right_inbox{ float:left; width:770px;  }
.about01_02 .right_inbox ul li{ float:left; width:100%; border-bottom:1px solid #ccc; padding:20px 0px  }
.about01_02 .right_inbox ul li .title_a{	float:left;	width:182px;	height:65px;	background-image: url(../_img/01/img01_02.gif);	background-repeat: no-repeat; text-align:center; color:#fff; line-height:64px;; margin-right:20px; font-size:16px;}

.about01_02 .right_inbox ul li .title_b{	float:left;	width:182px;	height:65px;	background-image: url(../_img/01/img01_03.gif);	background-repeat: no-repeat; text-align:center; color:#fff; line-height:64px; margin-right:20px;font-size:16px;}
.about01_02 .right_inbox ul li .text_t{	float:left;	width:540px;	height:62px;	 color:#666; font-size:14px; padding-top:10px}



.about03{ float:left; width:100%; margin-top:30px;}
.about03{ float:left; width:100%; margin-top:30px;}
.about03 .left{ float:left; width:15%; font-size:22px; color:#000}
.about03 .right{ float:left; width:80%; padding-left:20px; border-left:1px solid #ccc; box-sizing:border-box;  font-size:14px; color:#666 ;}
.about03 .right .stitle{ float:left; width:100%; font-size:16px; color:#000 ; margin-bottom:5px}
.about03 .right .text{ float:left; width:100%; font-size:14px; color:#666 ; margin-bottom:30px }



.main_f{	float:left;	width:100%; background-color:#003}

.main_a{	float:left;	width:100%;	height:750px;	background-image: url(../_img/main/main_bg01.jpg);	background-repeat: no-repeat;	background-position: center top; position:relative; }
.main_a .container { position:relative}
.main_a .container .title{	float:left;	width:100%; margin-top:70px	; margin-bottom:50px; text-align:center}
.main_a .container .title .img{	float:left;	width:100%; margin-bottom:20px; font-size:40px;  color:#333; font-family: 'Roboto', sans-serif; font-weight:400;}
.main_a .container .title .img em{	 color:#000  ; font-family: 'Roboto', sans-serif; font-weight:700}
.main_a .container .title .text{	float:left;	width:100%; text-align: center; font-size:15px; color:#666}
.main_a .container .imgbox{	float:left;	width:100%;  margin-bottom:100px; text-align:center; position:absolute; top:200px ; z-index:99}
.main_a .container .imgbox ul li{	float:left;	width:50%;}

.main_b{	float:left;	width:100%;	height:302px;	background-image: url(../_img/main/main03.jpg);	background-repeat: no-repeat;	background-position: center top;	position:relative}

.main_c {float:left;	width:100%; padding:50px 0px;  background-color:#fff;  position:relative}
.main_c .container  ul li{float:left;	width:25%; border-right:1px solid #ccc ; height:280px	}
.main_c .container  ul li .left_title{float:left;	width:100%; margin-top:40px; margin-bottom:20px; font-size:25px; color:#000;font-family: 'Roboto', sans-serif;}
.main_c .container  ul li .left_title em{color:#000;color:#000; font-weight:700; font-family: 'Roboto', sans-serif;font-size:30px;}
.main_c .container  ul li .left_text{float:left;	width:100%; font-size:14px; color:#666; margin-bottom:20px}
.main_c .container  ul li .left_more{	float:left;	width:100%;	font-size:12px;	color:#ff9900;	text-decoration: underline;}
.main_c .container  ul li .img{float:left;	width:100%; margin-top:10px; margin-bottom:10px; text-align:center}
.main_c .container  ul li .title{float:left;	width:100%; margin-top:10px; margin-bottom:10px; text-align:center; font-size:20px; color:#000;}
.main_c .container  ul li .stext{float:left;	width:100%; margin-top:10px; margin-bottom:10px; text-align:center; font-size:14px; color:#666; box-sizing:border-box; padding:0px 20px}



		.thumbnailWrapper { width:1100px; margin:0px auto; } /* not important */
		
		.thumbnailWrapper ul { 
			list-style-type: none; /* remove the default style for list items (the circles) */ 
			margin:0px; /* remove default margin */
			padding:0px; /* remove default padding */
		}
		.thumbnailWrapper ul li { 
			float:left; /* important: left float */
			position:relative; /* so we can use top and left positioning */
			overflow:hidden; /* hide the content outside the boundaries (ZOOM) */
			
		}
		.thumbnailWrapper ul li a{ 
			float:left; /* important: left float */
			position:relative; /* so we can use top and left positioning */
		
		}
.thumbnailWrapper ul li .zoom_cont01{ width:275px;	float:left; /* important: left float */ background-color: rgba(38, 38, 67, 0.7); position:absolute; top:0px; left:0px; z-index:9999999; height:240px; padding:0px 25px; box-sizing:border-box; }
.thumbnailWrapper ul li .zoom_cont01 .zoom_title{ width:100%;	float:left; color:#26a0dc; margin-bottom:10px; font-size:22px; text-align:left; margin-top:40px}
.thumbnailWrapper ul li .zoom_cont01 .zoom_text{ width:100%;	float:left; color:#fff; margin-bottom:10px; font-size:13px; text-align:left; }
.thumbnailWrapper ul li .zoom_cont01 .zoom_text a{color:#fff; } 
.thumbnailWrapper ul li .zoom_cont01 .logo{ position:absolute; bottom:20px; right:20px}

.thumbnailWrapper ul li .zoom_cont02{ width:275px;	float:left; /* important: left float */  position:absolute; top:0px; left:0px; z-index:9999999; height:240px; padding:0px 25px; box-sizing:border-box; background: url(../_img/main/main_02.jpg)	}
.thumbnailWrapper ul li .zoom_cont02 .zoom_title{ width:100%;	float:left; color:#26a0dc; margin-bottom:10px; font-size:22px; text-align:left;text-align:left; margin-top:40px	}
.thumbnailWrapper ul li .zoom_cont02 .zoom_text{ width:100%;	float:left; color:#fff; margin-bottom:10px; font-size:13px; text-align:left; color:#666}
.thumbnailWrapper ul li .zoom_cont02 .logo{ position:absolute; bottom:20px; right:20px}


.thumbnailWrapper ul li .zoom_cont03{ width:275px;	float:right; /* important: left float */  background: url(../_img/main/main_02_2.jpg); position:absolute; top:0px; right:0px; z-index:9999999; height:240px; padding:0px 25px; box-sizing:border-box;			}
.thumbnailWrapper ul li .zoom_cont03 .zoom_title{ width:100%;	float:left; color:#26a0dc; margin-bottom:10px; font-size:22px; text-align:left;margin-top:40px	}
.thumbnailWrapper ul li .zoom_cont03 .zoom_text{ width:100%;	float:left; color:#666; margin-bottom:10px; font-size:13px; text-align:left}
.thumbnailWrapper ul li .zoom_cont03 .logo{ position:absolute; bottom:20px; right:20px}

.thumbnailWrapper ul li .zoom_cont04{ width:275px;	float:right; /* important: left float */  position:absolute; top:0px; right:0px; z-index:9999999; height:240px; padding:0px 25px; box-sizing:border-box; background-color: rgba(0, 0, 0, 0.7); 	}
.thumbnailWrapper ul li .zoom_cont04 .zoom_title{ width:100%;	float:left; color:#26a0dc; margin-bottom:10px; font-size:22px; text-align:left	;margin-top:40px}
.thumbnailWrapper ul li .zoom_cont04 .zoom_text{ width:100%;	float:left; color:#fff; margin-bottom:10px; font-size:13px; text-align:left}
.text a{ margin-top:5px ; color:#999}
.thumbnailWrapper ul li .zoom_cont04 .logo{ position:absolute; bottom:20px; right:20px}



		.thumbnailWrapper ul li a img { 
			width:550px; /* not important, the pics we use here are too big */
			position:relative; /* so we can use top and left positioning */
			border:none; /* remove the default blue border */
			opacity:1.0
		}
		.thumbnailWrapper ul li a:hover img { 
			width:550px; /* not important, the pics we use here are too big */
			position:relative; /* so we can use top and left positioning */
			border:none; /* remove the default blue border */opacity:1.0
		}
		
		.caption{
			position:absolute; /* needed for positioning */
			bottom:0px; /* bottom of the list item (container) */
			left:0px; /* start from left of the list item (container) */
			width:100%; /* stretch to the whole width of container */
			display:none; /* hide by default */
			/* styling bellow */
			background:#000;
			color:white;
			opacity:0.5; 
		}
		.caption .captionInside{
			/* just styling */
			padding:10px;
			margin:0px;
		}
		.clear { clear:both; } /* to clear the float after the last item */a{ color:#FFCC00;}