@charset "utf-8";

*{ padding:0; margin:0; box-sizing:border-box; font-family:'notosans', sans-serif; letter-spacing:-0.05em;}
*:focus { outline:none; }

html,body { overflow-x:hidden; }
.clear:after { display:block; content:""; clear:both; }
ul { list-style:none; } 
a { text-decoration:none; }
.container { width:100%; padding:0 20px; }
input:focus { outline:none; }
.gray { width:100%; background:#f5f5f5; padding:40px 0;}
.no_pb { padding-bottom:0 !important; }
.cont.alert { text-align:center; border:1px solid #ddd; padding:50px 0; }

.btn_box { text-align:center; margin-top:20px; }
.btn_style { display:inline-block; padding:10px 0; width:50%; color:#ddd; }
.btn_style_h3 { display:inline-block; padding:10px 0; width:30%; color:#ddd; }
.go_list_btn { background:#004b59; color:#fff; }

input { appearance: none;
-webkit-appearance: none;
-webkit-border-radius: 0; }

select { -webkit-appearance: none;
-moz-appearance: none; 
appearance: none;
background:url(../images/icon_select2.png) no-repeat 95% 50% #fff;
border-radius: 0;}

span.lv1_bg { background:#34b0c7; }
span.lv2_bg { background:#40c36e; }
span.lv3_bg { background:#eccb2f; }
span.lv4_bg { background:#d93a2e; }
span.lv0_bg { background:#ccc; }

span.lv_1 { color:#34b0c7; }
span.lv_2 { color:#40c36e; }
span.lv_3 { color:#eccb2f; }
span.lv_4 { color:#d93a2e; }
span.lv_5 { color:#ccc; }

h1.small_title { font-size:16px; padding-left:18px; position:relative; color:#004b59; }
h1.small_title:before { content:""; border:3px solid #004b59; width:7px; height:7px; position:absolute; left:0; top:7px; border-radius:10px; }

/* 헤더 */ 
#header { position:absolute; width:100%; z-index:3; transition:all 0.3s;}
#header .main_logo { float:left; }
#header .main_logo img { padding-top:30px; }
#header .menu_btn { float:right; padding-top:26px; }


.menu_shadow { width:100%; height:100%; position:fixed; background:rgba(0,0,0,0.5); left:0; top:0; z-index:1; display:none;}
.m_menu_box { width:80%; height:100%; position:fixed; background:#fff; z-index:3; right:-80%; top:0; overflow-y:auto; transition:all 0.3s;}
.menu_on { right:0; }
.m_menu_box > ul > li { width:100%;  }
.m_menu_box > ul > li > a { display:block; padding:20px; border-bottom:1px solid #ddd;color:#555;   }
.m_menu_box > ul > li.sm > a { background:url(../images/m_menu_open.png) no-repeat 95% 50%; }
.m_menu_box > ul > li.login { background:#004b59; }
.m_menu_box > ul > li.login > a {  color:#fff; padding:20px;font-weight:700; width:50%; border-bottom:none;}
.m_menu_box .m_close_btn { position:absolute; right:4%; top:20px; z-index:9; }
  
ul.sm_menu { background:#f5f5f5; display:none; }
ul.sm_menu li a { display:block; padding:15px; font-size:14px; border-bottom:1px solid #ddd; color:#555; }

ul.main_menu > li.on > a { background:url(../images/m_menu_close.png) no-repeat 95% 50%; }

#wrap { position:relative; }
/*#wrap .top_box { width:100%; padding:100px 0 80px; background:url(../images/m_main_top_bg.png) no-repeat; background-size:cover; }*/
#wrap .top_box { width:100%; padding:100px 0 80px; background:url(../images/m_platform_top_bg.png) no-repeat; background-size:cover; }
#wrap .top_box h1 { text-align:center;font-size:26px; font-weight:700; color:#fff; }
#wrap .top_box h1 span { display:block; font-size:13px; font-weight:400; text-transform:uppercase; letter-spacing:0em;  display:none;}

#wrap .main_top_box2 { width:100%; height:700px; background:url(../images/m_main_bg.jpg) no-repeat; background-size:cover; color:#fff; padding-top:360px; background-position:right top;}
#wrap .main_top_box2 h1 { font-size:30px; padding-bottom:20px;}
#wrap .main_top_box2 p { font-size:16px; }

.main_cont1 { text-align:center; padding:70px 0;}
.main_cont_title { font-size:24px; color:#333; font-weight:800; line-height:1em; border-bottom:3px solid #333; padding-bottom:3px; display:inline-block; }
.main_cont1 p { padding-top:50px; line-height:30px; font-size:14px; font-weight:300; }

.main_cont2 { width:100%; padding:70px 0 300px; background:url(../images/m_main_cont1.jpg) no-repeat; background-size:cover; background-position:bottom; text-align:center;}
.main_cont2 h6 { font-size:24px; line-height:1.2em; padding:20px 0 40px;}
.main_cont2 li { padding:3px 0; padding-left:27px;position:relative; text-align:left; font-weight:300; }
.main_cont2 li:before { content:""; width:20px; height:20px; background:url(../images/icon_check.png) no-repeat; position:absolute; left:0; top:6px; }

.main_cont3 { width:100%; padding:70px 0; text-align:center;}
.main_cont3 h3 { font-size:18px; font-weight:200; padding-top:10px; }
.main_cont3 ul { width:100%;  padding-top:70px;}
.main_cont3 ul li { width:100%; margin-bottom:50px;}
.main_cont3 ul li:last-child { margin-bottom:0; }
.main_cont3 ul li:after { display:block; content:""; clear:both; }
.main_cont3 ul li img { width:30%;float:left; }
.main_cont3 ul li .txt { width:70%; float:left; text-align:left; padding-left:20px; }
.main_cont3 ul li h6 { font-size:25px; color:#004b59; font-weight:800; }
.main_cont3 ul li p { font-size:14px; padding-top:10px; }
.main_cont3 ul li p span { color:#004b59; font-weight:800;  }

.main_cont4 { width:100%; background:url(../images/m_main_cont2.jpg) no-repeat; background-size:100%; padding:70px 0; background-position:top; text-align:center;  padding-bottom:0;}
.main_cont4 p { padding-top:25px; font-size:14px;  }
.main_cont4 .device_slide_wrap { width:100%; box-shadow:2px 2px 6px rgba(0,0,0,0.1); background:#fff; margin-top:70px; position:relative;}
.main_cont4 .device_slider { height:430px; position:relative; width:100%;}
.main_cont4 .device_slider:after { display:block; content:""; clear:both; }
.main_cont4 .device_slider .img { width:100%; height:200px; padding:30px 0;}
.main_cont4 .device_slider .img img { height:100%; margin:0 auto;}
.main_cont4 .device_slider .disc { width:100%; padding:0 50px; text-align:left;}
.main_cont4 .device_slider .disc h1 { font-size:30px; color:#004b59;  }
.main_cont4 .device_slider .disc p { padding-top:5px; }
.main_cont4 .device_slider .disc ul {padding-top:30px;}
.main_cont4 .device_slider .disc ul li { float:left; margin-right:10px; width:60px; height:60px; background:#f4f4f4; border-radius:60px; text-align:center;padding-top:11px; line-height:1em;}
.main_cont4 .device_slider .disc ul li.line_1 { padding-top:20px }

.main_cont5  { width:100%; padding:70px 0; text-align:center; }
.main_cont5 h3 { font-size:18px; font-weight:200; padding-top:10px; }
.main_cont5 ul { width:100%;  padding-top:50px;}
.main_cont5 ul li { width:100%; text-align:left; margin-bottom:20px; }
.main_cont5 ul li img { width:100%; padding-bottom:15px; }
.main_cont5 ul li h6 { font-size:18px; font-weight:800; }
.main_cont5 ul li p { font-size:14px; padding-top:10px; }

#wrap .cont_box { width:100%; padding:80px 0; min-height:400px; position:relative; }
h1.title { font-size:21px; color:#333; font-weight:700; line-height:25px; text-align:center; width:90%; position:absolute; left:5%; top:-26px; background:#fff; padding-top:30px;}
h1.title span { font-weight:200; display:block; text-transform:capitalize; font-size:14px; display:none;}
h1.title.s_title { width:100%; position:relative; top:auto; left:auto; background:none; padding-bottom:30px; }

.main_top_box { width:100%; padding:160px 30px;background:url(../images/m_main_top_bg.png) no-repeat;background-size:cover; }
.main_top_box h1 { font-size:22px; color:#fff;text-align:center; }
.main_top_box h1 span { display:block; padding-top:8px; font-weight:300; font-size:14px;}

/* 플랫폼 소개 */

.part_box ul li { width:100%; border:2px solid #004b59; box-shadow:5px 5px 5px rgba(0,0,0,0.12); background:#f5f5f5; margin-bottom:24px;}
.part_box ul li .logo { width:100%;  background:#fff; position:relative;  padding:40px 0;}
.part_box ul li .logo img { position:absolute; left:50%; top:50%; transform:translate(-50%, -50%); }
.part_box ul li h1 { font-size:16px; font-weight:700; color:#004b59; text-align:center; padding:10px 0;}
.part_box ul li p {font-size:12px; color:#555;text-align:center; width:100%; padding:0 15px; padding-bottom:15px;}

.service_text { width:100%; padding:20px 0 40px;}
.service_text h1 { width:100%; color:#004b59; font-size:18px; font-weight:700; }
.service_text .txt { width:100%; }
.service_text .txt p { color:#555; font-size:14px; line-height:24px; font-weight:200; }
.service_text .txt .img_box { width:100%; padding-top:15px; }
.service_text .txt .img_box img { width:30%; float:left; margin-right:2%; }
.service_text .txt .img_box p { font-size:12px; line-height:22px; float:left; width:68%;}
.service_text .txt .img_box p span { font-size:16px; font-weight:700; display:block; padding-top:10px;}

.search_station { width:100%; position:relative; }
.search_station .left { width:100%;position:relative; padding-bottom:30px; display:none;}
.search_station .left .map_area { width:100%; border:1px solid #ddd;  position:relative; }
.search_station .left .map_area .map_img { width:100%;  }
.search_station .left .map_list { width:100%; }
.search_station .left .map_list img { width:100%; position:absolute; left:0; top:0; display:none;}
.search_station .right { width:100%; }
.search_station .right .top { background:#f5f5f5; border-top:3px solid #004b59; padding:20px;}
.search_station .right .top select { width:100%; padding:10px; margin-bottom:5px; }
.search_station .right .top a { display:inline-block; background:#004b59; color:#fff; width:100%; padding:8px 0; text-align:center; }
.search_station .right .list { margin-top:20px;height:400px; overflow-y:auto; border:1px solid #ddd; margin-bottom:50px; }
.station_tbl { width:100%;  }
.station_tbl tr th { background:#004b59; color:#fff;  padding:10px; font-size:12px;}
.station_tbl tr td { padding:10px; border-bottom:1px solid #ddd; font-size:12px;  color:#555;}
.station_tbl tr td a { color:#555; }
.station_tbl tr td.station_name { text-align:center; border-right:1px solid #ddd; }
.station_tbl tr:last-child td { border-bottom:none; }

.station_category select { width:100%; padding:10px; margin-bottom:20px; }
.search_map { width:100%; border:1px solid #ddd; height:600px; position:relative; margin-bottom:100px;}
.search_map .station_pop { width:100%; } 
.search_map .station_pop h1 { width:100%; font-size:16px;  background:#004b59; color:#fff; padding:10px;}
.search_map .station_pop .station_cont { padding:10px; }
.search_map .station_pop .station_cont table th {text-align:left;width:90px; padding-bottom:10px;}  
.search_map .station_pop .station_cont table td { padding-left:10px; padding-bottom:10px;line-height:1em;}
.search_map .station_pop a { display:block; text-align:Center; font-size:12px; padding:10px 0; border-top:1px solid #ddd; cursor:pointer;}

.location { width:100%; }
.location .map { width:100%;}
.location .map img { width:100%; border:1px solid #ddd !important; }
.location .map div { padding:20px; background:#f9f9f9; margin-top:7px; }
.location .map h2 { padding-bottom:10px; font-size:20px; margin-bottom:10px; border-bottom:1px solid #ddd;}
.location .map p span { font-weight:700; width:70px; display:inline-block; }
.location .txt { width:100%;  margin-top:30px; }
.location .txt div { padding-bottom:20px; }
.location .txt h1 {  font-size:20px; color:#004b59;}
.location .txt h1 span { font-weight:300; font-size:18px; padding-left:10px; }
.location .txt h2 {font-size:16px; font-weight:500;}
.location .txt p {padding-left:15px; font-size:14px; padding-bottom:20px; line-height:24px;}
.location .txt p:last-child {padding-bottom:0;}

/* 미세먼지 통합정보 */

.pminfo { width:100%; }
.pminfo ul.pminfo_list { width:100%; border:2px solid #004b59;}
.pminfo ul.pminfo_list li { width:33.3%; float:left; text-align:center; border-right:2px solid #004b59;}
.pminfo ul.pminfo_list li a { display:block; background:#fff; padding:10px 0; color:#004b59; font-size:13px;}
.pminfo ul.pminfo_list li:last-child { border-right:none; }
.pminfo ul.pminfo_list li.on a { background:#004b59; color:#fff; }
.pminfo select { width:100%; border:2px solid #004b59; padding:9px; font-size:13px; margin:5px 0; background:url(../images/icon_select.png) no-repeat 95% 50% #fff;}
.pminfo_data { width:100%; background:#f8f8f8; border-top:3px solid #004b59; }
.pminfo_data .pminfo_map { width:100%; min-height:240px;}
.pminfo_data a.view_btn { width:100%; text-align:center; display:block; color:#fff; background:#004b59; font-size:16px; padding:10px 0; }
.pminfo_data select { width:90%; display:block; margin:15px auto 0; border:1px solid #ddd; font-size:14px; padding:5px; }
.pminfo .pminfo_date { width:100%; margin-bottom:18px;}
.pminfo .pminfo_date strong { float:left; line-height:36px; width:13%; font-size:14px;}
.pminfo .pminfo_date li { width:46%; float:left; }
.pminfo .pminfo_date li input { border:2px solid #004b59; width:100%; padding:7px 0; text-align:center;}
.pminfo .pminfo_date span { width:8%; line-height:36px; float:left; display:block; text-align:center; color:#004b59; font-weight:800;}
.pminfo .pminfo_date button.search_btn { width:100%; margin-top:10px; padding:6.5px 0; background:#004b59; border:none; cursor:pointer;}
.pminfo_data .search_data { width:100%; padding:20px; background:#f8f8f8; }
.pminfo_data .search_data ul { width:100%; padding:10px; }
.pminfo_data .search_data .graph { min-height:160px; margin:10px 0; background:#f8f8f8; border:1px solid #ddd; }
.pminfo_data .search_data .graph:last-child { margin-bottom:0; }

.pminfo_data .search_data h2 { font-size:15px; padding-bottom:5px; border-bottom:1px solid #ddd;  }
.pminfo_data .search_data h2 span { float:right; font-size:12px; color:#666; font-weight:400; }
.search_data h1 { font-size:16px; padding-left:25px; position:relative; color:#004b59; }
.search_data h1:before { content:""; border:4px solid #004b59; width:7px; height:7px; position:absolute; left:0; top:6px; border-radius:10px; }
.pminfo_data .pm_box li { width:50%;float:left; text-align:center; }
.pminfo_data .pm_box li span.lv_circle { display:inline-block; width:55px; padding:13px 0; font-size:20px; color:#fff; font-weight:700; border-radius:50px;}
.pminfo_data .pm_box li h6 { font-size:15px; color:#555; font-weight:700; line-height:17px; padding-top:7px;}
.pminfo_data .pm_box li h6 span { display:block; font-weight:300; }

.pm_table { clear:both; width:100%; border-top:3px solid #004b59; font-size:12px; margin-top:20px; }
.pm_table th { width:12.5%; padding:15px 0;  background:#f8f8f8;}
.pm_table th span { display:block; line-height:18px; font-weight:300; color:#666; }
.pm_table td { padding:15px 0; border-bottom:1px solid #ddd; text-align:center;}

.pm_btn { width:100%; clear:both; margin:15px 0;text-align:center;}
.pm_btn a.download_btn { display:block; background:#004b59;color:#fff;font-size:16px;padding:13px 0; padding-left:28px;position:relative;}
.pm_btn a.download_btn:before { content:""; width:21px;height:18px; position:absolute; left:35%; top:16px; background:url(../images/icon_download2.png) no-repeat; }

.w_current, .w_forecast { width:100%; position:relative; padding-bottom:30px; }
.w_tbl { width:100%; text-align:center; border-left:1px solid #ddd; border-top:1px solid #ddd; }
.w_tbl th { border-right:1px solid #ddd; border-bottom:1px solid #ddd;background:#004b59; color:#fff; padding:10px 0; font-size:12px;}
.w_tbl td { border-right:1px solid #ddd; border-bottom:1px solid #ddd; padding:10px 0; line-height:1em; font-size:12px; }
.w_tbl img { width:50px; vertical-align:middle;margin-right:10px;}
.w_current .w_tbl td { width:calc(100% / 5) }
.w_forecast .w_tbl td { width:calc(100% / 14) }

.w_forecast .w_tbl tr:last-child td { line-height:1.5em; }
.w_forecast .left { width:100px; position:absolute; left:0; top:0; }
.w_forecast .right { margin-left:100px; overflow-x:scroll; }
.w_forecast .right .w_tbl { width:500px; }
.w_forecast .w_tbl th { padding:7px 0; }
.w_forecast .w_tbl tr:first-child th { padding:40px 0; }
.w_forecast .w_tbl tr:nth-child(2) th { padding:26px 0; }
.w_forecast .w_tbl tr:last-child th { padding:19.5px 0; }

.service_img { padding:50px 0 100px; text-align:center;}
.service_img h4 { background:#004b59; color:#fff; padding:10px 70px; margin:50px 0; font-size:16px; display:inline-block; border-radius:100px;  min-width:90%;}
.service_img h4 span { display:block; }
.service_img img { max-width:90%;  }

.system_cont { text-align:center; padding-bottom:100px;}
.system_cont h4 { background:#004b59; color:#fff; padding:10px 70px; margin:50px 0; font-size:16px; display:inline-block; border-radius:100px; }
.system_cont h4:first-child { margin-top:0; }
.system_cont img { max-width:90%;  }

/* 빅데이터 분석 서비스 */

.pm_left, .pm_right { width:100%; }
.pm_left .map { background:#f8f8f8; min-height:330px;  }

.pm_right .pm_current h1 { font-size:18px;text-align:center; padding:10px 0;  }

.pm_current .graph { padding:40px 20px; position:relative;border-top:1px solid #ddd;  }
.pm_current .graph .img { position:relative; float:left; width:50%;  }
.pm_current .graph .img img { width:120px; }
.pm_current .graph .text { width:50%; float:right; text-align:center; padding-top:15px; }
.pm_current .graph .text h2 { font-size:18px; color:#555; font-weight:700; line-height:22px;  }
.pm_current .graph .text h2 span { display:block; font-weight:300; }
.pm_current .graph .text h3 { font-size:20px; padding-top:5px;  }
.pm_current .list li a { display:block; border-top:1px solid #ddd; padding:10px 0;font-weight:700; }
.pm_current .list li a:after { display:block; content:""; clear:both; }
.pm_current .list li a h4 { float:left; font-size:15px; color:#555;}
.pm_current .list li a p { float:right; font-size:15px;  }

.school_name { width:100%; border:1px solid #ddd;}

/* 모니터링 */

.current { width:100%; border-top:3px solid #004b59; background:#f8f8f8; margin:15px 0;}
.current h1 { display:block; padding:10px; font-size:18px; color:#004b59; font-weight:800; border-bottom:1px solid #ddd; }
.current .pm_box { display:inline-block; width:100%; padding:30px; }
.current .pm_box li { width:50%;float:left; text-align:center; }
.current .pm_box li span.lv_circle { display:inline-block; width:55px; padding:13px 0; font-size:20px; color:#fff; font-weight:700; border-radius:50px;}
.current .pm_box li h6 { font-size:15px; color:#555; font-weight:700; line-height:17px; padding-top:7px;}
.current .pm_box li h6 span { display:block; font-weight:300; }

.data_list { width:100%; padding:0 25px 15px; }
.data_list li { padding-bottom:10px; }
.data_list li:after { display:block; content:""; clear:both; }
.data_list span.lv_circle2 { width:12px; height:12px; display:block; float:left; border-radius:12px; margin-top:5px; margin-right:5px; }
.data_list h3 { font-size:15px; color:#666; font-weight:500; float:left;}
.data_list h3 span { display:inline-block; font-weight:300; padding-left:5px; }
.data_list h5 { float:right; font-size:15px; font-weight:500; color:#666;}

.device_list { width:100%; }
.device_list h3.line { display:block; padding:10px 0; border-bottom:2px solid #004b59; font-size:15px; color:#004b59; margin-bottom:15px; }
.graph_box { width:100%; background:#f8f8f8; padding:15px; min-height:200px; clear:both; }
.graph_box h1 { font-size:12px; font-weight:700; background-color:#004e97; color:#ffffff; padding:20px;}
.graph_box h1 span { font-weight:400; float:right; }
.graph_box .data { width:100%; height:200px; margin-bottom:40px;}

.select_box select {margin-bottom:5px; font-size:14px; color:#004b59; border:2px solid #004b59; width:100%; padding:7px; background:url(../images/icon_select.png) no-repeat 95% 50% #fff; 
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;}

.device_box { height:256px;  overflow-y:auto;}
.device_box li { width:49%; float:left; margin-right:2%; border:1px solid #ddd; padding:15px; font-size:14px; font-weight:700;  margin-bottom:10px; cursor:pointer;}
.device_box li:nth-child(2n) { margin-right:0; }
.device_box li.on { box-shadow:inset 0 0 0 3px #004b59; border:1px solid #004b59; }
.device_box span.lv_circle3 { width:15px; height:15px; display:block; float:left; border-radius:12px; margin-top:7px; margin-right:5px; }
.device_box span.on_bg { background:#41d976; }
.device_box span.off_bg { background:#ddd; }

.device_container { position:relative; }
a.select_all_btn { padding:10px 20px;  cursor:pointer; margin-bottom:15px;
    display: block;
	font-size:14px;
    background: #004b59;
    color: #fff;
    text-align: center; }
a.data_btn { padding:10px 20px;  cursor:pointer; margin-bottom:15px;
    display: block;
	font-size:14px;
    background: #004b59;
    color: #fff;
    text-align: center;}

.search_box { width:100%; padding:20px; border:1px solid #ddd; background:#f8f8f8; }
.search_box .device{ margin-bottom:10px;}
.search_box select.company_select { margin-bottom:10px; }
.search_box select.time_select { margin-top:10px; }
.search_box h1 { font-size:15px; margin-right:20px; padding-bottom:10px; color:#555;  }
.search_box select{ width:100%; border:1px solid #ddd; font-size:15px; padding:5px 10px; }
.search_box input { width:45%; border:1px solid #ddd; font-size:15px; padding:5px 10px; float:left; }
/*.search_box .date a { width:10%;display:block; float:left; border:1px solid #ddd; border-left:0; text-align:center; background:#fff; padding:5px; height:39px; }
.search_box .date a img { width:100%;display:block; }*/
.btn { margin:10px 0;}
.btn a { display:block; float:left; background:#004b59; width:49%; margin-right:2%; color:#fff;text-align:center; font-size:16px;padding:13px 0; padding-left:18px;position:relative;}
.btn a.down_btn { margin-right:0; padding-left:28px;}
.btn a.search_btn:before { content:""; width:20px;height:20px; position:absolute; left:26px; top:16px; background:url(../images/icon_search.png) no-repeat; }
.btn a.down_btn:before { content:""; width:21px;height:18px; position:absolute; left:16px; top:16px; background:url(../images/icon_download2.png) no-repeat; }
.search_box span { text-align:center; float:left; display:block;width:10%; padding-top:5px;}

.search_data { width:100%;  }
.search_data .cont { border:1px solid #ddd; padding:20px; margin-bottom:10px;}
.search_data .cont:last-child { margin-bottom:0; }

.search_data .graph { width:100%;  min-height:140px; margin-top:10px; }

.search_list li { float:left; width:33.3%; }

/* 교육 */

.edu_text { width:100%; padding:20px 0 40px;}
.edu_text h1 { width:100%; color:#004b59; font-size:18px; font-weight:700; }
.edu_text p { width:100%; color:#555; font-size:14px; line-height:24px; padding-top:15px;  }

.edu_youtube { position:relative; width:100%; height:250px; }

.search_area { background:#f5f5f5; padding:15px;text-align:center; border-top:3px solid #004b59; margin-bottom:20px; }
.search_area select { border:1px solid #ddd; width:100%; font-size:14px; padding:5px 10px;}
.search_area input { font-size:18px; border:1px solid #ddd; padding:5px 10px; width:100%;font-size:14px; margin:5px 0;}
.search_area a.search { display:block; width:100%; color:#fff; background:#004b59; padding:7px 0; font-size:14px; }

/* 환경 */

.citizen_txt p { font-size:14px; font-weight:300; }
.citizen_application ul { width:100%; }
.citizen_application ul li { width:100%; border:1px solid #ddd; background:#fff;}
.citizen_application ul li + li {margin-top:20px;}
.citizen_application ul li .img { width:100%;  }
.citizen_application ul li .img img { display:block; width:100%; }
.citizen_application ul li .txt { width:100%;font-size:16px; font-weight:300; padding:20px;}
.citizen_application ul li .txt h6 { font-size:18px; font-weight:600; padding-bottom:10px;}
.citizen_application ul li .txt p { font-size:14px; }

.citizen_activity ul li { width:100%; border:1px solid #ddd; padding:20px;position:relative; margin-bottom:20px; border-top:5px solid #004b59;}
.citizen_activity ul li h1 {font-size:18px; color:#004b59;}
.citizen_activity ul li h1 span { display:block;font-size:27px; font-weight:700; color:#004b59; }
.citizen_activity ul li p { font-size:14px;  font-weight:300;}
.citizen_activity ul + div { text-align:center; padding-top:20px; }
.citizen_activity ul + div img { width:100%; margin-top:20px; }
.citizen_activity ul + div p { border:1px solid #ddd; font-size:16px; padding:10px; margin-top:10px;  }

.citizen_img { padding-top:0; }
.citizen_img h4:first-child { margin-top:0; }

/* 게시판 */

.list_num { font-size:14px; }
.list_style { width:100%; font-size:14px; border-top:3px solid #004b59; margin-top:10px; color:#555;}
.list_style tr th { font-weight:700; background:#f5f5f5; border-bottom:1px solid #9e9e9e; padding:10px 0; }
.list_style tr td { font-weight:400; border-bottom:1px solid #9e9e9e; padding:10px; text-align:center; }
.list_style tr td:nth-child(1) { text-align:left; }
.list_style tr td a { color:#555; }
.list_style strong { padding-right:10px; }

.read_tb .title { font-weight:400; text-align:left; padding-left:15px; }
.read_tb .sub_title { font-weight:400; padding-right:15px;text-align:right; }
.read_tb .cont { padding:15px; line-height:30px; text-align:left;vertical-align: top; }

.list_paging { text-align:center; margin-top:40px;}
.list_paging ul { display:inline-block; }
.list_paging ul li { float:left; padding:0 5px;  }
.list_paging ul li a { display:block; font-size:14px; border:1px solid #004b59; padding:0 6px; color:#004b59; }
.list_paging ul li.on a { background:#004b59; color:#fff; }
.list_paging ul li.first_btn a,
.list_paging ul li.prev_btn a,
.list_paging ul li.next_btn a,
.list_paging ul li.last_btn a { border:none; padding:0;}
.list_paging ul li a img { height:12px; }

.input_title {width:100%; border:1px solid #ddd; padding:5px; font-size:17px;}
.input_contents {width:100%; height:250px; border:1px solid #ddd; padding:5px; font-size:17px;}
.input_file {width:80%;}

.app_download { width:100%; position:relative; background:#f5f5f5; text-align:center;}
.app_download img { width:50%; display:block;position:relative; margin: 40px auto 0;}
.app_download p { font-size:14px; font-weight:200; padding:40px 0 20px;}
.app_download button { width:50%; background:#004b59; color:#fff; border:none; font-size:20px; padding:10px 0; border-radius:10px; cursor:pointer;}

.menual_btn { width:100%; margin-top:20px; }
.menual_btn a { display:block; width:50%; text-align:center;float:left; font-size:14px;  padding:10px 20px; border:1px solid #ddd; background:#fff; color:#777; cursor:pointer;}
.menual_btn a.on { color:#fff; background:#004b59; border:1px solid #004b59; }

.download_menual { position:relative; }
.download_menual .menual_box { width:100%; background:#f5f5f5; padding:30px; }
.download_menual .menual_box > div { width:100%;margin-right:5%; position:relative; text-align:center;}
.download_menual .menual_box > div img { display:inline-block; width:70%; }
.download_menual .menual_box > div p { font-size:16px; line-height:1em; min-height:63px; font-weight:200; }
.download_menual .menual_box > div p span { font-weight:500; }

.menual_box .slick-dots { position:relative !important; }
.menual_box .slick-dots li { margin:0; }
.menual_box .slick-dots li button:before { font-size:25px; }

.download_menual h3 { border:1px solid #ddd; padding:20px; font-size:14px; font-weight:200; margin-top:20px; }
.menual_box.home_ios_box { position:absolute; left:0;top:62px; }

/* 멤버 */

.login_box { width:100%; border:1px solid #ddd; background:#fbfbfb; padding:20px;}
.login_box input { width:100%; border:1px solid #ddd; padding:15px; margin-bottom:10px; font-size:14px;  }
.login_box a.login_btn { display:block; width:100%; text-align:center; background:#004b59; color:#fff; padding:15px 0; }

.login_btn_box { width:100%; margin:20px auto 0; }
.login_btn_box a { width:49%; margin-right:2%; float:left; display:block; text-align:center; background:#999; color:#fff; padding:15px 0;}
.login_btn_box a:last-child { margin-right:0; }

.join_box { width:100%; } 
.join_box p.red { text-align:right; color:red; padding-bottom:10px; }
.join_tb { border:1px solid #ddd; width:100%;  font-size:18px;padding:20px 0;}
.join_tb tr td { padding:10px 20px; color:#555;}
.join_tb tr td h1 { font-size:16px; padding-bottom:5px; position:relative;}
.join_tb tr td h1.info_require { padding-left:8px; } 
.join_tb tr td h1.info_require:before { position:absolute; content:'*'; color:red; left:-3px; top:3px; }
.join_tb tr td input { width:100%; padding:5px; border:1px solid #ddd; font-size:15px;}
.join_tb tr td input.short,
.join_tb tr td select { width:57px; padding:5px;border:1px solid #ddd;font-size:15px; float:left; }
.join_tb tr td input.short + span { width:8%;font-size:14px; text-align:center; float:left; padding-top:6px; display:block;}

.join_tb tr td.birth input.short {width:25.3%;}
.join_tb tr td.email input.short,
.join_tb tr td.email select {width:46%;}
.join_tb tr td.phone input.short {width:28%; }

input[type="radio"].radio_st1 { display:none; }
input[type="radio"].radio_st1 + label { padding-left:20px; position:relative; font-size:15px; margin-right:10px;}
input[type="radio"].radio_st1 + label:before { content:''; width:10px; height:10px; position:absolute; left:0; top:8px; border:2px solid #004b59; border-radius:10px; }
input[type="radio"].radio_st1:checked + label:after { content:''; width:6px; height:6px; position:absolute; left:4px; top:12px; background:#004b59; border-radius:10px; }

input[type="checkbox"].check_st1 { display:none; }
input[type="checkbox"].check_st1 + label { padding-left:20px; position:relative; font-size:15px; margin-right:10px;}
input[type="checkbox"].check_st1 + label:before { content:''; width:10px; height:10px; position:absolute; left:0; top:4px; border:2px solid #004b59;  }
input[type="checkbox"].check_st1:checked + label:after { content:''; width:6px; height:6px; position:absolute; left:4px; top:8px; background:#004b59; }

.join_btn_box { text-align:center; margin-top:30px; }
.join_btn_box a { width:49%; margin-right:2%; display:inline-block; color:#fff; padding:15px 0; float:left; }
.join_btn_box a.join_btn { background:#004b59; }
.join_btn_box a.modify_btn { background:#004b59; width:100%; }
.join_btn_box a.go_home_btn { background:#bbb; margin-right:0; }

.find_box { width:100%; text-align:center; }
.find_tb { border:1px solid #ddd;  width:100%;  font-size:18px;}
.find_tb tr td {  padding:15px; color:#555; text-align:left; }
.find_tb tr td h1 { font-size:16px; padding-bottom:5px; }
.find_tb tr td input { width:100%; padding:5px; border:1px solid #ddd; font-size:18px; float:left;}
.find_tb tr td input.short,
.find_tb tr td select { width:30%; padding:5px;border:1px solid #ddd;font-size:18px; }
.find_tb tr td input.short + span { padding-top:3px; display:block; width:5%; text-align:center; float:left;}

.find_box ul { width:100%; margin-bottom:20px; border:2px solid #004b59; }
.find_box ul li { float:left; width:50%; }
.find_box ul li a{ color:#004b59; padding:15px 25px; display:block; font-size:14px;}
.find_box ul li.on a{ background:#004b59; color:#fff; }

.find_btn_box { margin-top:30px; }
.find_btn_box a { display:inline-block; width:160px;color:#fff; background:#004b59;padding:15px 0; }

.tbl_st1 { width:90%; margin:0 auto; border:1px solid #ddd; border-bottom:none; }
.tbl_st1 th { width:calc(100% / 3); padding:15px 0; background:#f5f5f5;  border-bottom:1px solid #ddd; }
.tbl_st1 td { text-align:center; padding:15px 0; border-bottom:1px solid #ddd; transition:all 0.3s;}
.tbl_st1 a { display:block; padding:5px 0; font-size:15px; }
.tbl_st1 a.btn_st1 { width:80%; background:#999; color:#fff; margin:0 auto; }
.tbl_st1 a.reset_password { margin:0 auto; width:80%; background:#999; color:#fff;}

.pop_st1 { width:100%; height:100%; position:fixed; z-index:99; top:0; left:0; display:none;}
.pop_st1:before { content:""; width:100%; height:100%; position:fixed; left:0; top:0; background:rgba(0,0,0,.5); z-index:-1; }
.pop_st1 .pop_cont { width:80%; max-height:80%; background:#fff; position:absolute; left:10%; top:50%; transform:translateY(-50%); z-index:88;}
.pop_st1 .pop_cont a.closebtn { width:100%;padding:10px 0; text-align:center;text-align:center; background:#004b59; color:#fff;  }
.pop_st1 h3 { padding:20px; font-size:20px; padding-bottom:15px; border-bottom:1px solid #ddd; margin-bottom:15px; }
.pop_st1 h1 { width:100%; font-size:16px; }
.pop_st1 input { font-size:14px; padding:3px; width:100%; border:1px solid #ddd; margin:5px 0 10px; }
.pop_st1 .area { width:100%; max-height:80%;overflow-y:auto; padding:20px;}
.pop_st1 .pop_btn { width:100%; }
.pop_st1 .pop_btn a { display:block; width:100%; font-size:15px;padding:5px 0; }
.pop_st1 a.reset_password { display:block; margin:5px auto; width:100%; background:#999; color:#fff; text-align:center; padding: 5px 0;}
.pop_st1 ul { width:100%; margin:5px auto;border:1px solid #999; }
.pop_st1 ul li { float:left; width:50%;  }
.pop_st1 ul li a { display:block; color:#999; text-align:center;padding: 5px 0;}
.pop_st1 ul li.on a { background:#004b59; color:#fff; }
.pop_st1 select {  width:100%; border:1px solid #ddd; font-size:15px; padding:5px 10px; margin:5px 0;  }

.data_downcont ul { border:1px solid #ddd; padding:10px 0; height:200px; padding:0 10px; overflow-y:auto;}
.data_downcont a.down_btn { display:block; padding:5px 0;margin:5px auto; width:100%; background:#999; color:#fff; text-align:center; }
.data_down ul li { float:none; width:100%;  margin:5px 0;}

.correction_cont .correction_date input { width:80%; float:left; height:45px; padding:15px; margin:0; margin-bottom:25px;}
.correction_cont .correction_date a { width:20%; float:left; border:1px solid #ddd;  height:45px; text-align:center; padding:0; padding-top:10px; border-left:none; margin-bottom:25px;}
.pop_cont.correction_cont .pop_btn a { width:50%;  padding:15px 0; background:#b1b1b1; float:left; color:#fff; text-align:center;}
.pop_cont.correction_cont .pop_btn a.data_btn2 {  background:#004b59;} 

.pop_cont.member_modicont .pop_btn a { width:50%; padding:15px 0; background:#004b59; float:left; color:#fff; text-align:center; }
.pop_cont.member_modicont .pop_btn a.closebtn { background:#b1b1b1; }

.footer_slider { width:100%; border-top:1px solid #ddd;  }
.footer_slider .container { position:relative; }
.footer_slider .slider { width:70%; overflow:hidden; border:1px solid #ddd;position:relative; height:72px; margin:10px auto;  }
.footer_slider .slider > div { width:100%; }
.footer_slider .slider .slick-slide img { display:inline-block !important; } 
.footer_slider .slider .slick-slide > div { float:left; }
.footer_slider .slick-slide { }
.footer_slider .slide_btn { position:absolute; width:100%; top:20px; left:0; }
.footer_slider .slide_btn > div { position:absolute; cursor:pointer;top:0;  }
.footer_slider .slide_btn .slide_prev { left:10px; }
.footer_slider .slide_btn .slide_next { right:10px; }
.footer_slider .slick-slide { text-align:center; }


#footer { width:100%; background:#272727;text-align:center;}
#footer .f_logo { width:100%; border-bottom:1px solid #ddd; padding:20px 0;}
#footer .f_copy { width:100%; color:#717171; line-height:21px; padding:20px; padding-bottom:40px; font-size:12px;}
#footer .f_copy span { display:inline-block; width:1px; height:12px; background:#717171; margin:-2px 10px;  } 


@media screen and (min-width :600px){

.join_tb tr td input.short + span { width:28px;}

.join_tb tr td.birth input.short,
.join_tb tr td.email input.short,
.join_tb tr td.email select,
.join_tb tr td.phone input.short {width:100px;}

.pm_btn a.download_btn { width:200px; margin:0 auto;}
.pm_btn a.download_btn:before { content:""; width:21px;height:18px; position:absolute; left:58px; top:16px; background:url(../images/icon_download2.png) no-repeat; }

.w_forecast .right .w_tbl { width:100%; }


.service_img h4 span { display:inline-block; }
.service_img h4 { background:#004b59; color:#fff; padding:20px 70px; margin:50px 0; font-size:24px; display:inline-block; border-radius:100px;  width:80%;}
.service_img img { max-width:90%;  }

.part_box ul li h1 { font-size:18px; font-weight:700; color:#004b59; text-align:center; padding:10px 0;}
.part_box ul li p {font-size:14px; color:#555;text-align:center; width:100%; padding:0 15px; padding-bottom:15px;}

.download_menual .menual_box > div img { width:50%; }

}

/* 관리자 장비관리의 개인형장비 원시데이터 다운로드 시의 파일 리스트  표출 */
.data_box { width:100%; margin:0 auto; }
.data_box table { width:100% !important; }
#listbox_devpast { padding:20px; border:1px solid #ddd; }
.fileListBox {}
.fileListBox, .fileListBox ul { list-style:none; padding-left:15px; }

.fileListBox input[type="checkbox"] + label { position:relative; padding-left:10px; cursor:pointer;}
.fileListBox input[type="checkbox"] + label.item_dir:before { content:''; width:4px;height:7px; background:url(../images/icon_folder.png) no-repeat; position:absolute; left:0; top:9px; }
.fileListBox input[type="checkbox"] + label.item_file { padding-left:15px; }
.fileListBox input[type="checkbox"] + label.item_file:before { content:''; width:9px;height:11px; background:url(../images/icon_item.png) no-repeat; position:absolute; left:0; top:8px; }
.fileListBox input[type="checkbox"]:checked + label:after { display:none; }

.tab_btn { width:100%; }
.tab_btn a { width:50%; display:block; float:left; font-size:18px;  padding:10px 20px; border:1px solid #ddd; background:#fff; color:#777; text-align:center; margin-bottom:15px;}
.tab_btn a.on { color:#fff; background:#004b59; border:1px solid #004b59; }