@charset "utf-8";


html,body{
	width:100%;
	color:#222020;
	font-size:100%;
	-webkit-text-size-adjust: 100%;
}

a:hover{
	opacity:0.8;
	filter: alpha(opacity=80);       /* ie lt 8 */
	-ms-filter:"alpha(opacity=80)";  /* ie 8 */
	zoom:1;
}

body{
	background-image:url(../../img/common/bg_body.jpg);
	background-repeat: repeat;
}

body.en{
	font-family: Verdana, Helvetica, sans-serif;
}

body.th{
	font-family : Tahoma,"Microsoft Sans Serif","Browallia New","CourierNew",AngsanaUPC,CordiaUPC;
}

body.ko{
	font-family: “돋움”,”중고딕”,”중명조”,dotum,AppleGothic,Arial,Helvetica,Clean,Sans-serif;
}

body.ch{
	font-family: 'PMingLiU', 'Apple LiSung', 'Arial', sans-serif;
}

body.ch_k{
	font-family: 'SimSun', 'Song', 'Arial', sans-serif;
}

/*-------------------
contents
-------------------*/
#contents_bg{
	opacity:0;
	filter: alpha(opacity=0);       /* ie lt 8 */
	-ms-filter:"alpha(opacity=0)";  /* ie 8 */
	zoom:1;
	overflow: hidden;
	position: relative;
	border-top: 5px solid #b8d8ff;
}
#contents_wrapp{
	width: 100%;
	max-width: 1143px;
	min-height: 530px;
	margin: 15px auto 0 auto;
	padding: 0 0 20px 0;
}
#container{
	margin: 0 0 0 183px;
}
.fb-like{
	width: 100%;
	text-align: right;
}
.fb_iframe_widget{
	*float:right;
}
#crumbs_box{
	/*width:950px;*/
	overflow:hidden;
}
#crumbs_box .online{
	display: block;
	float:right;
}
#crumbs_box .crumbs{
	float:left;
	font-size:11px;
	line-height:16px;
	height:16px;
	margin:11px 0 4px 20px;
	padding:1px 0 1px 20px;
	word-break:keep-all;
	background-image:url(../../img/common/ico_home.png);
	background-repeat:no-repeat;
	background-position:left center;
}
#crumbs_box .crumbs span{
	padding:0 10px;
	height:16px;
}
#crumbs_box .crumbs .home{
	/*background-image:url(../../img/common/ico_home.png);
	background-repeat:no-repeat;
	background-position:center left;
	padding-left:20px;*/
	padding-left:0;
}
.ttl02{
	margin-top:5px;
	margin-bottom:20px;
	overflow:hidden;
}
.ttl02 span.line{
	display:block;
	background-image:url(../../img/common/bg_ttl.png);
	background-repeat:repeat;
	height:3px;
	margin-bottom:2px;
}
.ttl02 .wrapp{
	background-image:url(../../img/common/bg_ttl.png);
	background-repeat:repeat;
	overflow:hidden;
	display:block;
	/*width:960px;*/
}
.ttl02 .ico{
	float: left;
	font-size: 22px;
	line-height: 54px;
	padding: 0 0 0 22px;
	background-repeat: no-repeat; /* ---------------------------------------------- */
}
.ttl02 img{
	vertical-align:middle;
}
.ttl02 span.sub{
	color:#FFFFFF;
	line-height:54px;
	font-size:22px;
	float:right;
	margin-right:20px;
}
/*-------------------
header
-------------------*/
#header_wrapp{
	width: 100%;
	max-width: 1143px;
	height: 33px;
	margin: 0 auto 0 auto;
}

#header{
	float: left;
	width: 183px;
	background-image: url("../../img/common/side_bg.png");
	background-position: left top;
	background-repeat: repeat;
	margin-bottom: -10000px;
	padding-bottom: 10000px;
}

#top_img{
	overflow: hidden;
	width: 183px;
	height: 225px;
}

#top_img>a{
	display: block;
	width: 100%;
	height: 100%;
}

#top_img img{
	display: none;
	width: 100%;
	height: 100%;
}

#nav{
	margin: 34px 0 0 0;
	padding: 0 9px 0 9px;
}

#nav_online,
#nav_mail{
	margin: 0 0 20px 0;
}

/*-------------------
banner
-------------------*/
#banner{
	display: none;
}

#banner li{
	text-align: center;
	margin: 0 0 20px 0;
}

#banner li>div{
	width: 160px;
	margin: 0 auto 0 auto;
}

/*-------------------
lang_nav
-------------------*/
#lang_nav{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 32px;
	border-top: 1px solid #ffffff;
}

#lang_wrapp{
	position: relative;
	width: 100%;
	max-width: 1143px;
	margin: 0 auto 0 auto;
}

#lang_nav #lang_shadow{
	overflow: hidden;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 20;
	width: 100%;
	height: 5px;
	text-indent: -9999em;
	background-image:url(../../img/common/shadow01.png);
	background-repeat:repeat-x;
	background-position:left top;
}

#lang_wrapp>div{
	margin: 0 0 0 193px;
}

#lang_nav ul{
	overflow: hidden;
	float: right;
	width: 505px;
}

#lang_nav li{
	float: left;
	width: 84px;
	height: 23px;
}

#lang_nav li img{
	display: none;
	width: 100%;
	vertical-align: top;
}

#lang_nav li.lang_nav_01{
	width: 85px;
}

#lang_nav li>a{
	display: block;
	width: 100%;
	height: 100%;
}

#lang_nav h1{
	float: left;
	color: #444444;
	font-size: 12px;
	line-height: 14px;
	font-weight: normal;
	margin: 5px 0 0 0;
}

/*-------------------
to_top
-------------------*/
#to_top_wrap{
	position: fixed;
	bottom: 0;
	left: 0;
	right: 0;
	z-index: 500;
	width: 100%;
}
#to_top{
	overflow: hidden;
	position: absolute;
	bottom: 16px;
	right: 5%;
	z-index: 500;
	width: 84px;
	height: 55px;
	text-indent: -9999em;
}
#to_top a{
	display: block;
	width: 100%;
	height: 100%;
	background-image:url(../../img/common/footer_pagetop_off.png);
	background-repeat:no-repeat;
}

#to_top a:hover{
	opacity:1.0;
	filter: alpha(opacity=100);       /* ie lt 8 */
	-ms-filter:"alpha(opacity=100)";  /* ie 8 */
	zoom:1;
	background-image:url(../../img/common/footer_pagetop_on.png);
}

/*-------------------
footer
-------------------*/
#footer{
	position: relative;
	width:100%;
	background-image:url(../../img/common/footer_bg_mount.png);
	background-repeat:repeat-x;
	background-position:94px 89px;
	margin: 0;
}

#footer #footer_bg_city{
	background-image:url(../../img/common/footer_bg_city_1280.png);
	background-repeat:no-repeat;
	background-position:center top;
	margin:0 auto;
	padding: 132px 0 0 0;
}

#footer #footer_bg{
	background-color:#6bbdbf;
	padding:20px 0 0 0;
}

#footer #footer_bg>div{
	overflow: hidden;
	width: 100%;
	max-width: 1143px;
	margin:0 auto 0 auto;
	padding: 0 0 20px 0;
}

#footer #footer_logo{
	float: left;
	vertical-align:top;
	height:57px;
	width:155px;
	display:inline-block;
	*display:inline;
	*zoom:1;
	margin: 0 0 0 5px;
}

#footer #footer_logo img{
	width: 100%;
	height: auto;
	vertical-align: bottom;
}

#footer #footer_banner{
	overflow: hidden;
	float: left;
	width: /*555px*//*800*/940px;
	height: 43px;
	margin: 0 0 0 30px;
}

#footer #footer_banner li{
	float: left;
	width: 165px;
	margin: 0 0 0 20px;
}

#footer #footer_banner li img{
		width: 100%;
		height: auto;
	vertical-align: bottom;
}

#footer #copy{
	width: 100%;
	height: 16px;
	line-height:16px;
	text-align:center;
	background-color:#a8cccd;
}

#footer #copy img{
	height: 16px;
	vertical-align:middle;
}

@media screen and (max-width: 842px){
	.fb-like>span{
		margin: 0 3% 0 0;
	}
/*-------------------
header
-------------------*/
	#header_wrapp{
		width: 100%;
		height: 137px;
	}

	#header{
		float: none;
		width: auto;
		height: 137px;
		background-image: url("../../img/common/side_bg.png");
		background-position: left top;
		background-repeat: repeat;
		margin: 0;
		padding: 0 20px 0 20px;
	}

	#top_img{
		float: left;
		position: absolute;
		top: -25px;
		z-index: 10;
	}

	#nav{
		float: right;
		margin: 75px 0 0 0;
		padding: 0;
	}

	#nav>*{
		display: block;
		float: right;
		margin: 0 0 0 20px;
	}

	#nav_online{
		width: 170px;
		height: 51px;
	}

	#nav_online>a{
		display: block;
		width: 100%;
		height: 100%;
	}

	#nav_mail{
		width: 50px;
		height: 51px;
	}

	#nav_mail>a{
		display: block;
		width: 100%;
		height: 100%;
	}

	#banner{
		display: none;
	}

/*-------------------
lang_nav
-------------------*/
	#lang_nav{
		height: 43px;
	}

	#lang_wrapp{
		position: relative;
		z-index: 15;
		width: auto;
		padding: 0 20px 0 20px;
	}

	#lang_nav li{
		height: 43px;
	}

/*-------------------
contents
-------------------*/
	#contents_wrapp{
		width:100%;
		margin: 60px auto 0 auto;
	}
	#container{
		clear: both;
		margin: 0;
	}
	.ttl02{
		width:100%;
	}
	#crumbs_box .online{
		display: none;
	}
	#crumbs_box .crumbs{
		float: right;
		padding: 0 20px 0 20px;
	}

/*-------------------
to_top
-------------------*/
	#to_top_wrap{
		display: none;
	}

/*-------------------
footer
-------------------*/
	#footer #footer_bg_city{
		background-image:url(../../img/common/footer_bg_city.png);
	}
	#footer #footer_bg{
		padding: 37px 0 0 0;
	}
	#footer #footer_bg>div{
		width: 650px;
	}
	#footer #footer_logo{
		width:22%;
		height: auto;
		margin: 0 0 0 2%;
	}

	#footer #footer_banner{
		display: block;
		width: 65%;
		height: auto;
		margin: 0 0 0 6%;
	}

	#footer #footer_banner li{
		width: 30%;
		margin: 0 0 0 3.33%;
		padding-bottom:2%;
	}
	#footer #copy{
		margin: 0;
	}
}

@media screen and (max-width: 768px){
/*-------------------
contents
-------------------*/
	.ttl02{
		clear:both;
		width:100%;
	}
	.ttl02 .wrapp{
		width:100%;
	}
	.ttl02 span.ico{
		margin-left:20px;
		padding: 0;
	}
	.ttl02 span.sub{
		margin-right:20px;
	}
}

@media screen and (max-width: 640px) {
	html,body{
		min-width: 320px;
	}
/*-------------------
contents
-------------------*/
	#contents_wrapp{
		width: auto;
		margin: 20px auto 0 auto;
	}
	.ttl02 span.sub{
		display: none;
	}
	#crumbs_box{
		display:none;
	}

/*-------------------
header
-------------------*/
	#header_wrapp{
		width: 100%;
		height: auto;
	}

	#header{
		float: none;
		position: relative;
		width: auto;
		height: auto;
		background-image: url("../../img/common/header_640_bg.png");
		background-position: left top;
		background-repeat: repeat;
		padding: 70px 20px 0 20px;
	}

	#top_img{
		position: relative;
		width: 44.5%; /*267/600*/
		height: auto;
		top: 0;
		left: 0;
	}

	#top_img img{
		width: 100%;
		height: auto;
	}

	#nav{
		float: none;
		position: relative;
		width: 100%;
		margin: 12px 0 0 0;
		padding: 0;
	}

	#nav_online>a,
	#nav_mail>a{
		background-size: contain;
	}

	#nav_online{
		position: absolute;
		top: 0;
		right: 11.67%;
		width: 28.33%; /*170/600*/
		height: auto;
	}

	#nav_mail{
		position: absolute;
		top: 0;
		right: 0;
		width: 8.33%;
		height: auto;
	}

	#nav_online img,
	#nav_mail img{
		width: 100%;
		height: auto;
		vertical-align: bottom;
	}

	#banner{
		display: none;
	}

/*-------------------
lang_nav
-------------------*/
	#lang_wrapp{
		overflow: hidden;
	}

	#lang_wrapp>div{
		margin: 0;
	}

	#lang_nav ul{
		float: right;
		width: 100%;
	}

	#lang_nav li{
		width: 16.66%;
		height: auto;
	}

	#lang_nav li.lang_nav_01{
		width: 16.66%;
	}

	#lang_nav li img{
		width: 100%;
		height: auto;
	}

	#lang_nav li>a:hover{
		opacity:1.0;
		filter: alpha(opacity=100);       /* ie lt 8 */
		-ms-filter:"alpha(opacity=100)";  /* ie 8 */
		zoom:1;
	}

	#lang_nav h1{
		clear: both;
		float: right;
		font-size: 10px;
		line-height: 12px;
		text-align: right;
	}

/*-------------------
footer
-------------------*/
	#footer #footer_bg>div{
		width: auto;
		margin: 0;
		padding: 0 3% 33px 3%;
	}

	#footer #footer_logo{
		float: none;
		width: 34%;
	}

	#footer #footer_banner{
		float: none;
		width: 100%;
		text-align: center;
		margin: 20px 0 0 0;
	}

	#footer #footer_banner li{
		width: 27.33%;
		margin: 0;
		padding: 0 3% 0 3%;
		padding-bottom:2%;
	}

	#footer #copy{
		display: none;
	}
}

@media screen and (max-width: 320px) {
	#footer #footer_logo{
		width: 60%;
	}

	#footer #footer_banner li{
		width: 31.33%;
		margin: 0;
		padding: 0 1% 0 1%;
		padding-bottom:4%;
	}
}