@charset "utf-8";

	#template-introduce .introduce-contents {
		padding-top:120px;
		margin-bottom:100px;
	}

	#template-introduce .top-visual {
		width:100%;
		height:250px;
		background:url(/images/menu1_top.png) no-repeat 50% 50%;	
	}

	#template-introduce .contents-wrap {
		max-width:1220px;
		width:100%;
		margin:0 auto;	
	}

	#template-introduce .sub-nav1{
		padding:0px;
		margin-bottom:60px;
		width:100%;
		height:70px;
	}

	#template-introduce .sub-nav1 li{
	  float:left;
   	list-style-type:none;	
  	width:32.33%;
  	height:100%;
  	line-height:70px;
  	border:1px solid #d8d8d8;
  	background-color:#f0f0f0;
  	margin:0px 0.5% 0px 0.5%;
  	font-family: 'NanumSquare', gulim;
    font-weight:500;
    font-size:25px; 	
    color:#71747a;
    text-align:center;  
    letter-spacing:-1px;
  }

  #template-introduce .sub-nav1 li > a {
	  display:block;
	  width:100%;
	  height:100%;
  }
	
  #template-introduce .sub-nav1 li > a:hover {
	  color:#71747a;
	  text-decoration:none;
  }
	
  #template-introduce .sub-nav1 .on {
	  border:1px solid #5c5e64;
	  background-color:#fff;
	  color:#2e2e2e;
	  text-decoration:none;		
  }

  #template-introduce .sub-nav1 li:hover {
	  border:1px solid #5c5e64;
	  background-color:#fff;
	  color:#2e2e2e;
  }

  #template-introduce .introduce-div {
  	clear:both;
  }

  #template-introduce .intro-txt1 {
  	font-family: 'Noto Sans KR', gulim;
    font-size:20px;
    font-weight:400;  	
    color:#2e2e2e;
    letter-spacing:-1px;
    margin-bottom:20px;
  }  	

  #template-introduce .intro-txt2 span {
  	font-family: 'Noto Sans KR', gulim;
    font-size:40px;
    font-weight:600;  	
    letter-spacing:-3px;
  }  	

  #template-introduce .col1 {
    color:#ef7e18;
  }

  #template-introduce .col2 {
      color:#e7af31;
}

  #template-introduce .col3 {
    color:#a17399;
  }

  #template-introduce .col4 {
    color:#7364aa;
  }

  #template-introduce .col5 {
    color:#199dda;
  }

  #template-introduce .col6 {
    color:#34ad7f;
  }

  #template-introduce .col7 {
    color:#7ebf42;
  }

  #template-introduce .intro_img {
  	width:100%;
  	height:220px;
  	background:url(/images/introduce_01_2024.png) no-repeat 50% 50%;	
  	margin:50px 0px;
  }

  #template-introduce .intro-txt3 {
  	font-family: 'Noto Sans KR', gulim;
    font-size:17px;
    font-weight:300;  	
    color:#4b4b4b;
    letter-spacing:-1px;
  }  	

  #template-introduce .sign {
  	height:20px;
	  background:url(/images/harfko_sign.png) no-repeat 100% 0%;		
	  margin:100px 0px 10px 0px;
  }

  #template-introduce .sign-txt {
  	text-align:right;
  	font-family: 'Noto Sans KR', gulim;
    font-size:15px;
    font-weight:500;  	
    color:#2e2e2e;
    letter-spacing:-1px;	
  }	

  #template-introduce .history-div ul {
	  padding:0px;
	  width:100%;
  }

  #template-introduce .history-div ul >li {
  	float:left;
  	padding:50px 0px 50px 110px;
  	width:50%;
  	list-style-type:none;
  }

  #template-introduce .history-div .history-img {
  	float:left;
	  width:155px;
	  height:155px;
	  background:url(/images/history_1989.png) no-repeat 50% 50%;
	  background-size:contain;
  }

  #template-introduce .history-div .history-1991 {
  	background:url(/images/history_1991.png) no-repeat 50% 50%;
  	background-size:contain;
  }

  #template-introduce .history-div .history-1993 {
  	background:url(/images/history_1993.png) no-repeat 50% 50%;
  	background-size:contain;
  }

  #template-introduce .history-div .history-1996 {
  	background:url(/images/history_1996.png) no-repeat 50% 50%;
  	background-size:contain;
  }

  #template-introduce .history-div .history-2001 {
  	background:url(/images/history_2001.png) no-repeat 50% 50%;
  	background-size:contain;
  }

  #template-introduce .history-div .history-2003 {
  	background:url(/images/history_2003.png) no-repeat 50% 50%;
  	background-size:contain;
  }

  #template-introduce .history-div .history-2005 {
  	background:url(/images/history_2005.png) no-repeat 50% 50%;
  	background-size:contain;
  }

  #template-introduce .history-div .history-2006 {
  	background:url(/images/history_2006.png) no-repeat 50% 50%;
  	background-size:contain;
  }

  #template-introduce .history-div .history-2007 {
  	background:url(/images/history_2007.png) no-repeat 50% 50%;
  	background-size:contain;
  }

  #template-introduce .history-div .history-2009 {
  	background:url(/images/history_2009.png) no-repeat 50% 50%;
  	background-size:contain;
  }

  #template-introduce .history-div .history-2011 {
  	background:url(/images/history_2011.png) no-repeat 50% 50%;
  	background-size:contain;
  }

  #template-introduce .history-div .history-2013 {
  	background:url(/images/history_2013.png) no-repeat 50% 50%;
  	background-size:contain;
  }

  #template-introduce .history-div .history-2015 {
  	background:url(/images/history_2015.png) no-repeat 50% 50%;
  	background-size:contain;
  }

  #template-introduce .history-div .history-2017 {
  	background:url(/images/history_2017.png) no-repeat 50% 50%;
  	background-size:contain;
  }

  #template-introduce .history-div .history-2019 {
  	background:url(/images/history_2019.png) no-repeat 50% 50%;
  	background-size:contain;
  }

  #template-introduce .history-div .history-2021 {
  	background:url(/images/history_2022.png) no-repeat 50% 50%;
  	background-size:contain;
  }

  #template-introduce .history-div .history-2024 {
    background:url(/images/history_2024.png) no-repeat 50% 50%;
    background-size:contain;
  }
  
  #template-introduce .history-div .history-txt1 {
    font-family: 'Titillium Web', gulim;
    font-size:24px;
    font-weight:500;  	
    color:#4b4b4b;
    letter-spacing:-1px;
    margin:0px 0px 10px 194px;
  }

  #template-introduce .history-div .history-txt2 {
	  font-family: 'Noto Sans KR', gulim;
    font-size:14px;
    font-weight:300;  	
  	color:#4b4b4b;
  	letter-spacing:-1px;
  	margin-left:194px;
	}
	
	#template-introduce .summary-div .summary-tbl {
	  font-family: 'Noto Sans KR', gulim;
	  font-size:14px;
	  font-weight:300;
	  color:#2e2e2e;
	  letter-spacing:-1px;
	  margin:15px 0px 50px 0px;
	  border-top:1px solid #5c5e64;
	  width:100%;
	}
	
	#template-introduce .summary-div .summary-tbl tr {
	  height:50px;
	  border-bottom:1px solid #d8d8d8;
	}
	
	#template-introduce .summary-div .summary-tbl th {
	  font-weight:500;
	  background-color:#f7f7f7;
	  text-align:center;
	  border-right:1px solid #d8d8d8 !important;
	}
	
	#template-introduce .summary-div .summary-tbl td {
		line-height:180%;
	  text-align:left;
	  padding:25px 0px 25px 20px;
	}
	
  #template-introduce .summary-div .map .img {
    background:url(/images/kintex_floor2022.png) no-repeat 50% 50%;
    background-size:contain;  
    width:100%;
    height:325px;
    margin: 50px 0px 30px;
  }

  #template-introduce .summary-div .map .txt1 {
    float: left;
    width:49%;
    padding-left: calc(49% - 270px);
    padding-right: 70px;
    text-align: center;
  }

  #template-introduce .summary-div .map .txt2 {
    float: left;
    display: inline-block;
    width:51%;
    padding-right: calc(51% - 270px);
    padding-left: 70px;
    text-align: center;
  }

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

	#template-introduce .contents-wrap {
		padding:0px 10px;	
	}
	
	#template-introduce .sub-nav1 li{
    font-size:25px; 	
  }

  #template-introduce .history-div ul >li {
  	padding-left:5%;	
  }  

}

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

  #template-introduce .history-div ul >li {
  	padding-left:3%;	
  }  
  	
	#template-introduce .history-div .history-img {
	  width:135px;
	  height:135px;
  }

	#template-introduce .history-div .history-txt1 {
		margin-left:160px;
	}

	#template-introduce .history-div .history-txt2 {
		font-size:12px;
		margin-left:160px;
	}
	
}	

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

	#template-introduce .introduce-contents {
		padding-top: 15vw !important;
		padding-bottom: 17vw !important;
		margin-bottom:0px;
	}	
	
	#template-introduce .sub-nav1 li{
    font-size:16px; 	
  }
	
	#template-introduce .history-div ul >li {
  	padding: 0px 0px 50px 2%;
  }	
  
	#template-introduce .history-div .history-img {
	  width:100px;
	  height:100px;
  }

	#template-introduce .history-div .history-txt1 {
		margin-left:120px;
	}

	#template-introduce .history-div .history-txt2 {
		font-size:9px;
		margin-left:120px;
	}  
	
  #template-introduce .summary-div .map .img {
    height: 60vw;
  } 
  
  #template-introduce .summary-div .map .txt1 {
    padding-left: 8vw;
    padding-right: 0px;
  }

  #template-introduce .summary-div .map .txt2 {
    padding-right: 8vw;
    padding-left: 0px;
  }  
}	

@media screen and (max-width:600px) {
	
	#template-introduce .history-div ul >li {
  	width:100%;
  }

	#template-introduce .history-div .history-img {
	  width:135px;
	  height:135px;
  }

	#template-introduce .history-div .history-txt1 {
		margin-left:160px;
	}

	#template-introduce .history-div .history-txt2 {
		font-size:12px;
		margin-left:160px;
	}  

}