/* CSS Document */
/*****Reset*****/
@import url('//fonts.googleapis.com/css?family=Noto+Sans+KR:100,300,400,500,700,900&display=swap&subset=korean');
/*  한국어 */

html, body, div, h1, h2, h3, h4, h5, h6, ul, ol, dl, li, dt, dd, p, blockquote, pre, form, fieldset, table, th, td { margin: 0; padding: 0; }
/* font import */
/*@import url('/css/font.css');*/

body, td,select,div,p,pre,input,form,textarea,center,option,pre,blockquote {
	font-family: 'Noto Sans KR', sans-serif;
	letter-spacing: 0px;
	word-break:break-all;
	/*
	word-break: keep-all;
	font-size: 15px;
	line-height:18px;
	text-align:justify;*/
}
a,button {
	font-family: 'Noto Sans KR','helvetica neue', helvetica, Dotum, sans-serif;
	letter-spacing: 0px;
	/*
	font-size: 15px;
	line-height:18px;
	text-align:justify;*/
}

#content_area h1, #content_area h3, #con_area h1, #con_area h3{
	font-family: 'Noto Sans KR','helvetica neue', helvetica, Dotum, sans-serif;
	font-style: normal;
	font-weight: 800;
	margin-bottom: 10px;
	word-break: keep-all;
}
h1, h2, h3{
	font-family: 'Noto Sans KR','helvetica neue', helvetica, Dotum, sans-serif;
	font-style: normal;
	font-weight: 300;
	margin-bottom: 10px;
	word-break: keep-all;
}

hr{
	margin-top:10px;
	margin-bottom: 10px;
}
/***상단 우측 영역 고정**/
#right_top_shape{
	position:absolute ;
	right:0px;
	top: 0px;
	z-index: 100;
}
.logo_shape{
	filter:alpha(opacity=50);
	width: 32px;
}
.font_serif{
	/*font-family:	'나눔 명조','Nanum Myeongjo', 'Palatino Linotype', 'Book Antiqua', 'Palatino', serif;*/
	font-family: 'Noto Sans KR';
	font-style: normal;
	font-weight: bold;
	font-weight: 800;
}
body {
	background-color: #fff; 
	color: #555555;
}
/*
.con_area_div img{
    width: 100%;
}
*/
/*icon 관련*/
i{
	font-size: 16px;
	padding-right: 10px;
}
p, ul, ol, dl, table { margin-bottom: 5px; }
ul, ol, dd { margin-left: 36px; }
img{
	border: 0;
}

h1{
	font-size: 30px;
	line-height:35px;
	font-style: bold;
}
h3{
	font-size: 18px;
	line-height: 25px;
	letter-spacing: 0px;
	font-style: bold;
}

/* link */

A {color: #3a76ab; font-weight:bold; text-decoration: none; cursor: pointer;}
A:link {color: #3a76ab; font-weight:bold; text-decoration: none; }
A:visited {color: #3a76ab; font-weight:bold; text-decoration: underline; }
A:hover {color: #3a76ab; font-weight:bold; text-decoration: underline;}
A:active {color: #3a76ab;  font-weight:bold; text-decoration: none;}

input.box {
	/*background: none repeat scroll 0 0 #FFF;*/
	border:1px solid #d5d0ca;
	color: #656565;
	font: 12px/15px '돋움',sans-serif;
	height: 15px;
	padding: 2px 3px;
	vertical-align: middle;
}
/*Font style*/
.line_w{
	background-color:#e9e9e9;
	height:1px;
	width: 100%;
}
#device_form{
	position: relative;
	display: inline-block;
	margin: 10px auto 10px;
	padding: 21px;
	background: #424242;
	background: #fff;
	border: 1px solid #aaa;
	border-radius: 10px;
	box-shadow: 0 12px 25px rgba(0,0,0,0.25);
	-webkit-transform-origin: 50% 0%;
	transform-origin: 50% 0%;
	-webkit-transition: -webkit-transform 0.3s;
	transition: transform 0.3s;
}
/*bt style*/
@charset "utf-8"; 
/* Jeong Chan Myeong(dece24@gmail.com) */

/* Button Reset */
.button,
.button a,
.button button,
.button input { position:relative; margin:0; display:-moz-inline-stack; display:inline-block; text-decoration:none !important; border:0; font-size:12px; font-family:Tahoma, Sans-serif; white-space:nowrap; background:url(../img/buttonWhite.gif) no-repeat; overflow:visible; color:#333;}
.button { height:23px; padding:0; vertical-align:middle; margin-right:2px; background-position:left top;}
.button a,
.button button,
.button input{ left:2px; vertical-align:top; cursor:pointer;}

/* Button Size */
.button.large { height:29px; background-position:left -30px; }
.button.xLarge { height:35px; background-position:left -65px; }
.button.small { height:18px; background-position:left -107px; }
.button a,
.button button,
.button input { height:23px; padding:0 10px 0 8px; font-size:12px; line-height:23px; background-position:right top;}
.button.large a,
.button.large button,
.button.large input { height:30px; padding:0 10px 0 8px; font-size:16px; line-height:29px; background-position:right -30px;}
.button.xLarge a,
.button.xLarge button,
.button.xLarge input { height:35px; padding:0 10px 0 8px; font-size:20px; line-height:35px; background-position:right -65px;}
.button.small a,
.button.small button,
.button.small input { height:18px; padding:0 6px 0 4px; font-size:11px; line-height:18px; background-position:right -107px;}

/* Button Text Color */
.button *:hover,
.button *:active,
.button *:focus{ color:#690;}
.button.green,
.button.green a,
.button.green button,
.button.green input { background-image:url(../img/buttonGreen.gif); color:#fff;}
.button.green *:hover,
.button.green *:active,
.button.green *:focus{ color:#ff0;}
.button.black,
.button.black a,
.button.black button,
.button.black input { background-image:url(../img/buttonBlack.gif); color:#fff;}
.button.black *:hover,
.button.black *:active,
.button.black *:focus{ color:#ff0;}
.button.red,
.button.red a,
.button.red button,
.button.red input { background-image:url(../img/buttonRed.gif); color:#fff;}
.button.red *:hover,
.button.red *:active,
.button.red *:focus{ color:#ff0;}
.button.blue,
.button.blue a,
.button.blue button,
.button.blue input { background-image:url(../img/buttonBlue.gif); color:#fff;}
.button.blue *:hover,
.button.blue *:active,
.button.blue *:focus{ color:#ff0;}

/* Button Text Strong */
.button.strong * { font-weight:bold !important;}

/* modal 창 관련 */
#simplemodal-overlay {
	background-color:#000;
}
#modal_content{
	display:none;
	margin:50 auto;
	width:300px;
	height:200px;
	background:#fff;
}
#modal_txt{
	font-size: 15px;
	font-weight: bold;
	width: 100%;
	margin-top: 70px;
	height: 90px;
	float:left;
	text-align: center;

}
#login_close{
	float:left;
	height: 30px;
	margin-bottom: 10px;
	width: 100%;
	text-align: center;
}
/*background style*/
.bg_wg{
	background-color: #efefef;
}

/*width style*/
.w_100{
	width: 100%;
}

.padding_10px{
	padding: 10px;
}
.alpha50 {
	filter:alpha(opacity=50); 
	opacity:0.5;
}
.alpha100 {
	filter:alpha(opacity=100); 
	opacity:1;
}
/**table style**/
.admin_table{
	width: 100%;
	border-collapse: collapse;
	text-align: center;
}
.admin_table td, .admin_table th{
	font-size: 8pt;
    border: 1px solid #cdcdcd;
	height: 30px;
	padding-left: 5px;
	padding-right: 5px;
}
.admin_table td {
	color:#000000;
	background-color:#efefef;
}
.admin_table a{
	font-size: 8pt;
}
/*공통영역*/


#bottom{
	clear: both;
	width: 100%;
	margin-top: 10px;
	padding-top: 30px;
	padding-bottom: 30px;
	border-top: 1px solid #efefef;
	text-align: center;
	color: #555555;
}
#bt_txt{
	padding-left: 15px;
	padding-right: 15px;
	text-align: center;
}

#bt_txt_left{
	float:left; 
	text-align: left; 
	width: 100%;
	font-weight: normal;
	font-size: 12px;
	color: #555555;
}
#bt_txt_left a{
	font-weight: normal;
	font-size: 12px;
	color: #555555;
}
#bt_txt_right{
	float:left;
	text-align: left;
	width: 100%;
	margin-top: 5px;
}
/*circle image*/
.circular {
	width: 100px;
	height: 100px;
	border-radius: 50px;
	-webkit-border-radius: 50px;
	-moz-border-radius: 50px;
	border: 1px #efefef solid; 
	/*background: url(http://link-to-your/image.jpg) no-repeat;*/
}

.circular img {
	opacity: 100;
	filter: alpha(opacity=100);
}
/*recommend*/
#other_info{
	width: 100%;
	text-align: left;
	background-color:#cdcdcd;
	/*margin-top: 10px;*/
	padding-top: 10px;
	padding-bottom: 10px;
}
#other_info h3{
	padding-left: 10px;
	padding-right: 10px;
    clear: left;
	text-align: left;
}
#other_info ul, #other_info ol{
    clear: left;
	display: block;
	width: 100%;
}
#now_weather{
    display: inline-block;
    width: 100%;
}
#map_location_texts{
    clear: left;
    width: 100%;
    margin-top: 10px;
    margin-bottom: 10px;
}
#ipg_service_zone{
	width: 100%;
	text-align: center;
	display: inline-block;
}
#view_mode{
	margin-top: 20px;
	margin-bottom: 20px;
	display: inline-block;
	width: 96%;
	border: 1px solid #efefef;
	padding-top: 10px;
	padding-bottom: 10px;
	margin-bottom: 20px;
	border-radius: 10px; 
}
#share_zone{
	display: inline-block;
	width: 96%;
	padding-bottom: 20px;
	padding-right: 15px;
}
#share_zone img{
	width: 15px;
}

#recommend{
	float: left;
	min-width: 100px;
	text-align: left;
}
#sns_area{
	float: right;
	min-width: 100px;
	text-align: right;
	padding-left: 10px;
}
.link_bt{
	width: 10px;
	margin-left: 10px;
}
/*hr 스타일*/
.hr_1{
	margin-top:10px;
	margin-bottom: 10px;
}
/*img style*/
.bt1{
	margin-left: 10px;
	width: 25px;
}
.img1{
	margin-right: 5px;
	width: 15px;
	vertical-align: middle;
	margin-bottom: 2px;
}
.img2{
	margin-left: 10px; 
	width: 20px;
}
#admin_ua_area{
	line-height: 35px;
}
/*div style*/
.con_div{
	float: left;
	width:100%;
	border-bottom: 1px solid #cdcdcd;
	margin-bottom: 20px;
}
#bg_area{
	display:none;
}
.bg_img{
	display: none;
}
.project_con{
	width: 100%;
	float: left;
	margin-bottom: 10px;
}
.bottom_guide{
	float: left;
	width:100%;
	padding-top: 10px;
	padding-bottom: 10px;
	border: 1px solid #cdcdcd;
	margin-top:10px;
	margin-bottom: 10px;
	border-radius: 10px;
	background: #efefef;
}

#page_Category{
	width: 100%;
	margin-bottom: 15px;
	border: 1px solid #cdcdcd;
	padding: 5px;
}

@media all and (max-width:799px){
	/*모바일 환경에 대한 스타일이 필요한 경우....*/
	#recommend{
	    width: 100%;
	    float: left;
	    text-align: center;
	}
	#sns_area{
	    clear: both;
	    float: left;
	    width: 100%;
	    padding: 0;
	    margin: 0;
	    text-align: center;
	    margin-top: 10px;
	    border-top: 1px solid #efefef;
	    border-bottom: 1px solid #efefef;
	    /*border: 1px solid #efefef;
	    border-radius: 10px;*/
	    padding-top: 10px;
	    padding-bottom: 10px;
	    background: #ffffff;
	}

}