@charset "utf-8";
/* 서브 비주얼 영역 */
#sub_visual {position:relative; overflow:hidden}
#sub_visual ul {position:relative; overflow:hidden}
#sub_visual ul li {position:absolute; top:0; left:0; height:450px; z-index:5}
#sub_visual ul li.active {position:relative; z-index:30}
#sub_visual ul li img {display:block; width:100%; height:100%}
#sub_visual .title {position:absolute; top:40%; left:0; width:100%; text-align:center; z-index:50}
#sub_visual .title h2 {font-size:60px; font-weight:600; letter-spacing:5px; color:#fff}
#sub_visual .title h2:after {display:block; margin:30px auto; width:50px; height:1px; content:''; background:#fff}
#sub_visual .title h3 {font-size:30px; font-weight:400; color:#fff}
#sub_visual .scrollbg {position:absolute; top:0; left:0; width:100%; height:100%;opacity:0; filter:alpha(opacity='0'); z-index:30}
/* 로케이션 영역 */
#container .location_bar {height:60px; border-bottom:1px solid #e6e6e6; background:#fff}
#container .location_bar .inner {max-width:1400px; margin:0 auto; padding:0 50px; text-align:right}
#container .location_bar .inner ul {text-align:right}
#container .location_bar .inner ul li {display:inline-block; color:#888; line-height:60px}
#container .location_bar .inner ul li.divider {margin:0 5px}
#container .location_bar .inner ul li.current {color:#333}
/* 컨텐츠 영역 레이아웃 */
#container {background:#fff}
#container > .inner:before {position:absolute; top:0; left:0; content:''; border-left:1px solid #e6e6e6; width:1px; height:100%}
#container > .inner {position:relative; max-width:1300px; margin:0 auto; padding:50px 50px 80px}
#container > .inner.he{height:1285px}
#container > .inner:after {clear:both; display:block; content:''; position:absolute; top:0; right:0; border-right:1px solid #e6e6e6; width:1px; height:100%}
.btm_img {clear:both; height:560px; background:url(../img/sub_btm_img.jpg) center top no-repeat; background-size:cover}
.btm_img .inner {max-width:1400px; margin:0 auto; padding:0 50px}
.btm_img .inner .caption {padding-top:10%}
.btm_img .inner .caption h2 {font-size:50px; font-weight:600; color:#fff; line-height:1; margin-bottom:30px}
.btm_img .inner .caption p {font-size:15px; font-weight:300; color:#fff; max-width:60%}
/* 좌측 서브메뉴 */
#nav {height:50px; border-bottom:1px solid #e6e6e6}
#nav .inner {max-width:1400px; margin:0 auto; padding:0 50px}
#nav .title {float:left; width:50px; height:100%; background:#1c1c1c}
#nav .title a {display:block; width:100%; height:100%; font-size:16px; font-weight:600; color:#fff; text-align:center; line-height:50px}
#nav .dropdown {position:relative; float:left; margin-left:-1px; min-width:180px; z-index:10}
#nav .dropdown > a {position:relative; display:block; width:100%; height:100%; padding:0 75px 0 25px; color:#444; font-weight:600; line-height:50px; border-right:1px solid #e6e6e6; font-size:16px;}
#nav .dropdown > a:before {position:absolute; width:0; height:0; top:50%; right:15px; margin-top:-2px; content:''; border-style:solid; border-width:4px; border-color:transparent; border-top-color:#333}
#nav .dropdown.open > a:before {margin-top:-6px; border-top-color:transparent; border-bottom-color:#333}
#nav .dropdown > a:hover{background:#21bbb1; color: #fff;}
#nav .dropdown > ul.mnuList {display:none; position:absolute; top:49px; left:0; width:100%; border:1px solid #e6e6e6; background:#fff; box-shadow:0 2px 2px rgba(0,0,0,.12)}
#nav .dropdown > ul.mnuList li {border-top:1px solid #e6e6e6}
#nav .dropdown > ul.mnuList li:first-child {border-top:none}
#nav .dropdown > ul.mnuList li a {display:block; padding:10px 25px; font-size:15px}
#nav .dropdown > ul.mnuList li a:hover {background:#21bbb1; color: #fff;}

/* 좌측 서브메뉴 게시판 */
#nav_board {height:50px; border-bottom:1px solid #e6e6e6}
#nav_board .inner {max-width:1400px; margin:0 auto; padding:0 50px}
#nav_board .title {float:left; width:50px; height:100%; background:#1c1c1c}
#nav_board .title a {display:block; width:100%; height:100%; font-size:16px; font-weight:600; color:#fff; text-align:center; line-height:50px}
#nav_board .dropdown {position:relative; float:left; margin-left:-1px; min-width:180px; z-index:20}
#nav_board .dropdown > a {position:relative; display:block; width:100%; height:100%; padding:0 75px 0 25px; color:#444; font-weight:600; line-height:50px; text-transform:uppercase; border-right:1px solid #e6e6e6; font-size:16px}
#nav_board .dropdown > a:before {position:absolute; width:0; height:0; top:50%; right:15px; margin-top:-2px; content:''; border-style:solid; border-width:4px; border-color:transparent; border-top-color:#333}
#nav_board .dropdown.open > a:before {margin-top:-6px; border-top-color:transparent; border-bottom-color:#333}
#nav_board .dropdown > div.mnuList {display:none; position:absolute; top:49px; left:0; width:100%; border:1px solid #e6e6e6; background:#fff; box-shadow:0 2px 2px rgba(0,0,0,.12)}
#nav_board .dropdown > div.mnuList li {border-top:1px solid #e6e6e6;list-style:none;}
#nav_board .dropdown > div.mnuList li:first-child {border-top:none}
#nav_board .dropdown > div.mnuList li a {display:block; padding:12px 25px; text-transform:uppercase}
#nav_board .dropdown > div.mnuList li a:hover {background:#f9f9f9}

/* 컨텐츠 내부 공통 */
#container > .inner img.img_tab, #container > .inner img.img_mob {display:none !important}
#container > .inner .title {margin-bottom:40px}
#container > .inner .title h2 {font-size:35px; font-weight:600; color:#333; line-height:1.2; margin-bottom:15px}
#container > .inner .title .index { display:block}
#container > .inner .title p {font-size:12px; color:#888; line-height:1.6}
#container > .inner h3.sub_tit {font-size:22px; font-weight:400; line-height:1.2; color:#555; margin-bottom:30px}
#container > .inner img {max-width:100%}

/* COMPANY - 회사소개 */
#container > .inner .greeting .grt_tit {margin-bottom:60px; text-align:center;}
#container > .inner .greeting .grt_tit h3 {font-size:40px; font-weight:400; color:#444; line-height:1.2; margin-bottom:20px}
#container > .inner .greeting .grt_tit p{font-size:35px; color:#11469d; font-weight:600;} 
#container > .inner .greeting > img{width:47%; height:500px;float:left}
#container > .inner .greeting ul.teamList {text-align:justify; margin-bottom:60px}
#container > .inner .greeting ul.teamList:after {display:inline-block; width:100%; content:''}
#container > .inner .greeting ul.teamList > li {display:inline-block; width:30%; vertical-align:top}
#container > .inner .greeting ul.teamList > li .info {margin-bottom:30px}
#container > .inner .greeting ul.teamList > li .info h4 {font-size:18px; font-weight:600; color:#555; line-height:1.5}
#container > .inner .greeting ul.teamList > li .info span {font-size:12px; color:#888}
#container > .inner .greeting ul.teamList > li .info ul {margin-top:20px}
#container > .inner .greeting ul.teamList > li .info ul li {color:#666; line-height:1.75}
#container > .inner .greeting ul.teamList > li .info ul li:before {display:inline-block; width:2px; height:2px; content:''; margin-right:5px; background:#ccc; vertical-align:middle}
#container > .inner .greeting ul.teamList > li .imgArea {width:80%; margin:0 auto; border-radius:50%; overflow:hidden}
#container > .inner .greeting .info_box { width:50%; height:600px;float:right; font-family:"Noto Sans KR"}
#container > .inner .greeting .info_box .text {font-size:1.2rem; word-break:keep-all;}
#container > .inner .greeting .info_box .text > strong{ font-size:30px;}
#container > .inner .greeting .info_box .text > .th{ display:block; font-size:23px}
#container > .inner .greeting .info_box .text > span{ color:#09C; font-weight:bold}
#container > .inner .greeting .info_box .text .txt {font-size:1.5rem; font-weight: normal; float:right;color:#333;}
#container > .inner .greeting .info_box .text .txt > strong{ font-weight:bold;}
/* COMPANY - 연혁 */
#container > .inner .history{background:url(../img/PHOTOKORE_a5847909_XL.jpg) no-repeat;background-position:bottom}
#container > .inner .history .history_box {margin-bottom:60px}
#container > .inner .history .history_box:after {clear:both; display:block; content:''}
#container > .inner .history .history_box .his_tit {margin-bottom:30px; padding-bottom:15px; border-bottom:2px solid #aaa}
#container > .inner .history .history_box .his_tit span {font-size:20px; color:#888}
#container > .inner .history .history_box .his_tit h3 {font-size:24px; font-weight:600; color:#444; line-height:1}
#container > .inner .history .history_box .left { display:none;float:left; width:45%}
#container > .inner .history .history_box .left p {color:#666; margin-bottom:25px; text-align:justify}
#container > .inner .history .history_box .right {width:100%}
#container > .inner .history .history_box .right dl {clear:both; margin:0 0 20px 0; overflow:hidden}
#container > .inner .history .history_box .right dl dt {float:left; width:60px; font-size:24px; font-weight:600; color:#444}
#container > .inner .history .history_box .right dl dd {font-size:24px;color:#666}
#container > .inner .history .history_box .right.two dl dd:last-child {padding-left:20px}
/* COMPANY - 찾아오시는 길 */
#map {position:relative; height:400px; margin-bottom:30px; overflow:hidden}
#container > .inner .txt_tit{padding:20px 0; font-size:25px; font-weight:bold;}
#container > .inner .txt_tit.bor{margin-top:30px; border-top:2px dotted #ccc}
#container > .inner .map_box { margin-top:20px;padding:30px; background:#f6f6f6}
#container > .inner .map_box ul.map_info li {color:#666; font-size:16px;}
#container > .inner .map_box ul.map_info li:before {display:inline-block; width:3px; height:3px; margin-right:5px; content:''; background:#aaa; vertical-align:4px}

/* BUSINESS - 사업안내 */
#container > .inner .product ul.typeList {text-align:justify; margin-bottom:60px}
#container > .inner .product ul.typeList:after {display:inline-block; width:100%; content:''}
#container > .inner .product ul.typeList li {display:inline-block; width:23%; vertical-align:top}
#container > .inner .product ul.typeList .imgArea {margin-bottom:25px; overflow:hidden}
#container > .inner .product ul.typeList .info h4 {font-size:18px; font-weight:400; color:#444; line-height:1; margin-bottom:15px}
#container > .inner .product ul.typeList .info p {color:#666}
#container > .inner .product ul.processList {text-align:justify; margin-bottom:60px}
#container > .inner .product ul.processList:after {display:inline-block; width:100%; content:''}
#container > .inner .product ul.processList li {display:inline-block; width:31%}
#container > .inner .product ul.processList .imgArea {margin-bottom:20px; overflow:hidden}
#container > .inner .product ul.processList .info {padding:10px 15px; background:#ebebeb}
#container > .inner .product ul.processList .info.color {background:#555}
#container > .inner .product ul.processList .info.color span {color:#fff}
#container > .inner .product ul.processList .info span {font-size:15px; color:#777}
/* BUSINESS - 사업영역 */
#container > .inner .product .area_wrap {text-align:justify; overflow:hidden}
#container > .inner .product .area_wrap:after {display:inline-block; width:100%; content:''}
#container > .inner .product .area_wrap > .imgArea {overflow:hidden; text-align:center}
#container > .inner .product .area_wrap > .area_box {display:inline-block; width:49.5%; margin-bottom:20px; vertical-align:top}
#container > .inner .product .area_wrap > .area_box .info {padding:30px; min-height:260px; height:750px; background:#efefef}
#container > .inner .product .area_wrap > .area_box .info h4 {font-size:24px; font-weight:400; color:#444; line-height:1; margin-bottom:30px}
#container > .inner .product .area_wrap > .area_box .info p {font-size:17px; font-weight:bold; margin-bottom:20px}
#container > .inner .product .area_wrap > .area_box .info ul {}
#container > .inner .product .area_wrap > .area_box .info ul li { font-size:15px; word-break:keep-all; margin-bottom:10px;}
#container > .inner .product .area_wrap > .area_box .info ul li > span{ display:block;}
#container > .inner .product .area_wrap > .area_box .info ul li:before{ margin-right:10px;display: inline-block;content:""; width:5px; height:5px; border-radius:50%; background:#000;}
#container > .inner .product .area_wrap > .area_box.all{ width:100%;}
#container > .inner .product .area_wrap > .area_box.all .info.function{ height:360px;}
#container > .inner .product .area_wrap > .imgArea.bottom{margin-bottom:30px;}
#container > .inner .product .area_wrap > .area_box.table{ width:100%; overflow:auto;}
#container > .inner .product .area_wrap > .area_box.table strong{ display:block;text-align:center;font-size:24px;}
#container > .inner .product .area_wrap > .area_box.table table{ margin:30px auto 0;width:100%; text-align:center;border:1px solid #000; border-collapse:collapse}
#container > .inner .product .area_wrap > .area_box.table table th{height:30px;border:1px solid #000; font-size:16px}
#container > .inner .product .area_wrap > .area_box.table table tr{border:1px solid #000;font-size:16px}
#container > .inner .product .area_wrap > .area_box.table table td{height:30px;border:1px solid #000;font-size:16px}
#container > .inner .product .area_wrap > .area_box.table table .title{ text-align:left; padding-left:20px}
#container > .inner .product .area_wrap > .area_box.table .text{font-size:15px;}

/*디지털 수도미터*/
#container > .inner .product .area_wrap > .area_box.digital {width:100%;}
#container > .inner .product .area_wrap > .area_box.digital .info.dig{ height:auto}
/*수도미터(직독/원격)*/
#container > .inner .product .area_wrap > .area_box.control .info.con{ height:450px}

/*수도미터 분류 및 선정*/
#container > .inner .product .area_wrap > .and {width:100%; margin-bottom:20px;}
#container > .inner .product .area_wrap > .and > .info.con{ height:auto !important}
#container > .inner .product .area_wrap > .and > .info.con > span.text{ font-size:15px;}
#container > .inner .product .area_wrap > .and > .info.con > strong.col{ color:#00a1a4; font-size:15px;}
#container > .inner .product .area_wrap > .and > .info.con > ul > li > span.s-text{ display:inline-block; font-size:10px}
#container > .inner .product .area_wrap > .and > .info.con > ul > li > img{ margin:0 auto;display:block;} 


/* 타일 섹션 */
#container .section6 .inner .upper {text-align:justify;}
#container .section6 .inner .upper:after {display:inline-block; width:100%; content:''}
#container .section6 .inner .tile {display:inline-block; padding:30px 20px ;width:45%; height:300px; overflow:hidden; vertical-align:top; background:#f5f5f5; box-sizing:border-box;}
#container .section6 .inner .center{background:#4c85bd}
#container .section6 .inner .center > ul >li{float:left; width:160px}
#container .section6 .inner .upper a {display:block}
#container .section6 .inner .upper .tile .imgArea {position:relative; margin-bottom:30px}
/*#container .section6 .inner .tile .imgArea:after {position:absolute; top:0; left:0; bottom:0; right:0; content:'';  opacity:0; filter:alpha(opacity='0'); transition:all .3s ease}*/
#container .section6 .inner .tile .imgArea img {display:block;margin:0 auto;}
#container .section6 .inner .tile .email img{padding-bottom:12px;width:50%;}
#container .section6 .inner .tile h3 {font-size:30px; font-weight:400; margin-bottom:20px; transition:all .3s ease; text-align:center; color:#2b4689;}
#container .section6 .inner .tile .centerTitle{font-size:30px; font-weight:400; margin-bottom:50px; transition:all .3s ease; text-align:center; color:#fff;}
#container .section6 .inner .tile .caption p {font-size:17px; color:#fff; text-align:center}
#container .section6 .inner .tile .caption.left {width:100%;padding:10px; box-sizing:border-box; font-size:18px;color:#2b4689; text-align:center}
#container .section6 .inner .tile .caption.right { display:none; float:right;width:40%;padding:10px; box-sizing:border-box; font-size:18px;color:#2b4689;}
#container .section6 .inner .tile:hover .caption h3 {color:#21bbb1}
#container .section6 .inner .tile:hover .imgArea:after {opacity:1; filter:alpha(opacity='100')}
#container .section6 .inner .lower {text-align:justify}
#container .section6 .inner .lower:after {display:inline-block; width:100%; content:''}
#container .section6 .inner .lower .tile_wrap {display:inline-block; width:49%; text-align:justify}
#container .section6 .inner .lower .tile_wrap:after {display:inline-block; width:100%; content:''}
#container .section6 .inner .lower .tile_wrap .tile {width:48%}
#container .section6 .inner .lower .tile_wrap .tile .imgArea {position:relative}
#container .section6 .inner .lower .tile_wrap .tile .caption {margin-top:30px}




/* 제품소개 스타일 */
.portfolio-list {width:102.67%; margin-left:-1.219%}
.portfolio-list > li {float:left; display:block; width:30.89% !important; margin:0 1.219% 30px 1.219%}
.portfolio-list > li.board {width:100% !important}
.portfolio-list li.bbsnewf5 a > img {display:block; width:100%; height:auto !important; transition:all .5s ease}
.portfolio-list li.bbsnewf5 a:hover > img {transform:scale(1.1)}
.portfolio-list .hoverBox {position:absolute; display:block; top:0; left:0; width:100%; height:100%; padding:32% 30px 0 30px; text-align:center; background:rgba(0,0,0,.8); opacity:0; transition:all .5s ease}
.portfolio-list .hoverBox .inner {}
.portfolio-list .hoverBox .inner h3 {font-size:24px; font-weight:600; color:#fff; line-height:1.2}
.portfolio-list .hoverBox .inner h3:after {display:block; width:40px; height:1px; margin:20px auto; content:''; background:#fff; opacity:.5}
.portfolio-list .hoverBox .inner p {display:-webkit-box; color:#fff; max-height:69px; -webkit-box-orient:vertical; -webkit-line-clamp:3; overflow:hidden; text-overflow:ellipsis}
.portfolio-list .bbsnewf5:hover .hoverBox {opacity:1}
.bbsnewf5 {position:relative; overflow:hidden}
.pg_wrap {display:none !important;text-align:center}
.brd_paging {display:none; text-align:center}
.brd_paging > b, .brd_paging > a {display:inline-block; width:38px; height:38px; line-height:36px; text-align:center; margin:0 -2px; border:1px solid #e8e8e8}
.brd_paging > b {color:#fff; border-color:#666; background:#666}
.brd_paging > a {color:#666}
.brd_paging > a:hover {color:#555; border-color:#cdcdcd; background:#f4f4f4}
.btn-more {display:block; width:185px; margin:30px auto; height:45px; font-size:16px; color:#000; text-align:center; border:2px solid #000; background:transparent; cursor:pointer; transition:all .3s ease; vertical-align:middle}
.btn-more:disabled {color:#bbb !important; border-color:#ccc !important; background:#f4f4f4 !important}
.btn-more:hover {color:#fff; background:#000}
/*2018-02-27추가 게시판 공통 */
.bbsnewf5 {font:inherit !important}
.bbsnewf5 a:hover {color:inherit !important}
.board {font-family:inherit !important}
.tbl_brd {width:100%; margin-bottom:40px; border-top:2px solid #666}
.tbl_brd input {font:inherit !important}
.tbl_brd input[type=file] {width:80%}
.tbl_brd input[type=text], .tbl_brd input[type=password] {width:80%; height:40px; padding-left:10px; border:1px solid #e8e8e8; border-radius:3px; color:#666}
.tbl_brd input[type=text]:focus, .tbl_brd input[type=text]:hover, .tbl_brd input[type=password]:focus, .tbl_brd input[type=password]:hover {border-color:#d8d8d8}
.tbl_brd select {height:40px; line-height:38px; padding:0 10px; border:1px solid #e0e0e0; cursor:pointer}
.tbl_brd textarea {font:inherit !important; width:80%; max-height:120px; padding:10px; border:1px solid #e0e0e0; border-radius:3px}
.tbl_brd textarea:focus, .tbl_brd textarea:hover {border-color:#d8d8d8}
.tbl_brd select:focus, .tbl_brd select:hover {border-color:#d8d8d8}
.tbl_brd tbody td {font:inherit !important; font-size:14px !important; padding:15px; border-bottom:1px solid #e0e0e0}
.tbl_brd tbody td font, .tbl_brd tbody td span, .tbl_brd tbody td a {font:inherit !important; font-size:14px !important}
.board_bgcolor {width:30% !important; font:inherit !important; color:#333; background:#f9f9f9 !important}
#post_area img {max-width:100%; height:auto !important}
.prvThumbList {margin-top:40px}
.prvThumbList > table td table {width:135px}
div.nneditor-container .seResize2 span {font-size:0 !important}
.brd_btngroup {margin-top:50px}
.brd_btngroup a {margin-top:2px; margin-bottom:2px}
#check_all {margin-left:5px; vertical-align:-5px}
.board_bottom {margin-top:50px}
.board_bottom > a {float:right}
#ext_search {float:left}
#ext_search select {height:35px; line-height:38px; margin-right:5px; padding:0 10px; border:1px solid #e0e0e0; cursor:pointer}
#ext_search select:focus, #ext_search select:hover {border-color:#d8d8d8}
#ext_search input[type=text] {height:35px; margin-right:5px; padding-left:10px; border:1px solid #e8e8e8; border-radius:3px; color:#666}
#ext_search input[type=text]:focus, #ext_search input[type=text]:hover {border-color:#d8d8d8}
.board_comment_bgcolor {padding-bottom:20px; background-color:#f9f9f9 !important}
.comment_txt {padding:10px 0 !important; word-break:}
.comment_txt:first-child {padding:20px !important}
.comment_txt textarea {width:60%; width:-webkit-calc(100% - 120px); width:-moz-calc(100% - 120px); width:calc(100% - 120px); height:50px; padding:10px; font:inherit !important; border:1px solid #e8e8e8; border-radius:3px}
.comment_txt > a.btn {margin:2px 0; padding:0 15px !important; height:30px !important; line-height:28px !important}
.comment_txt > font {display:block; margin-bottom:10px; color:#ccc !important}
.comment_name {color:#333 !important; width:20% !important}
.comment_name input[type=checkbox] {margin-right:5px; vertical-align:middle}
/* 게시판 카테고리 탭 */
.cate_select {display:none !important}
.board_tab {position:relative; margin-bottom:50px}
.board_tab > a {display:none}
.board_tab ul {border-bottom:1px solid #e0e0e0}
.board_tab ul > li {float:left; margin-bottom:-1px; margin-left:-1px}
.board_tab ul > li:first-child {margin-left:0}
.board_tab ul > li > a {display:block; padding:12px 30px; color:#999; border:1px solid #e0e0e0; background:#f4f4f4}
.board_tab ul > li.on > a {position:relative; color:#333; border-color:#aaa; border-bottom-color:#fff; background:#fff; z-index:10}
/* 미디어 쿼리 */
@media screen and (max-width:1280px) {
 /* 제품소개 스타일 */
 .portfolio-list .hoverBox {padding-top:25%}
 
 #container .section5 .inner > ul > li{width:390px;}
#container .section5 .inner h3{ font-size:22px;}
}
/* 미디어 쿼리 */
@media screen and (max-width:1024px) {
 /* 서브 비주얼 영역 */
 #sub_visual ul li {height:500px}
 /* 서브 공통 레이아웃 */
 #container > .inner {border:none}
 #container > .inner img.img_tab {display:block !important}
 #container > .inner img.img_pc, #container > .inner img.img_mob {display:none !important}
 #nav {float:none; width:100%; margin:0; border-bottom:1px solid #dcdcdc}
 #nav:after {clear:both; display:block; content:''}
 
  #nav_board {float:none; width:100%; margin:0; border-bottom:1px solid #dcdcdc}
 #nav_board:after {clear:both; display:block; content:''}
 
 .btm_img {height:450px}
 .btm_img .inner .caption p {max-width:90%}
 /* COMPANY - 회사소개 */
 #container > .inner .greeting .grt_tit p br {display:none}
 #container > .inner .greeting ul.teamList > li .info ul li {font-size:12px}
 #container > .inner .greeting ul.teamList > li .info span {font-size:11px}
 #container > .inner .greeting ul.teamList > li .imgArea {width:70%}
 /* BUSINESS - 사업안내 */
 #container > .inner .business > p br {display:none}
 #container > .inner .business ul.typeList li {width:48%; margin-bottom:40px}
 #container > .inner .business ul.typeList li .imgArea {max-height:250px}
 #container > .inner .business ul.typeList li .imgArea img {margin-top:-20%}
 #container > .inner .business ul.processList .info span {font-size:13px}
 /* BUSINESS - 사업영역 */
 #container > .inner .business .area_wrap > .area_box .info {min-height:280px}

#container > .inner .product .area_wrap > .area_box .info {height:1000px;}
#container > .inner .product .area_wrap > .area_box.control .info.con{ height:600px}

 /* 타일 섹션 */
  #container .section6 .inner .tile {clear:both; display:block; width:100%; margin-bottom:30px}
  #container .section6 .inner .tile .caption.left { text-align:center}
#container .section6 .inner .tile .caption.right { text-align:center}
 #container .section6 .inner .tile .caption h3 {font-size:16px}
 #container .section6 .inner .tile .caption p {font-size:13px}
 #container .section6 .inner .lower .tile .caption p {display:-webkit-box; max-height:45px; -webkit-box-orient:vertical; -webkit-line-clamp:2; overflow:hidden}
 #container .section6 .inner .center > ul >li{width:280px}
#container .section6 .inner .tile .email img{width:25%;}

/*2018-02-27추가 게시판 카테고리 탭 */
.cate_select {display:none !important}
.board_tab {margin:auto auto 50px auto}
.board_tab > a {position:relative; display:block !important; width:100%; height:50px; padding-left:15px; font-size:16px; line-height:50px; border:1px solid #e0e0e0}
.board_tab > a:after {position:absolute; font-family:'FontAwesome'; font-size:18px; color:#333; right:20px; content:'\f107'}
.board_tab > a.open:after {content:'\f106'}
.board_tab ul {display:none; position:absolute; top:49px; width:100%; margin:0; border:1px solid #e8e8e8; border-top:none; background:#fff; z-index:30}
.board_tab ul > li {float:none; display:block; margin:0}
.board_tab ul > li > a {display:block; padding:12px 15px; font-size:16px; color:#999; border:none; border-top:1px solid #f0f0f0; background:none}
.board_tab ul > li.on > a {color:#333; border-color:#f0f0f0}

 /* 제품소개 스타일 */
 .portfolio-list .hoverBox {padding-top:20%}
 .portfolio-list .hoverBox .inner h3 {font-size:18px}
 .portfolio-list .hoverBox .inner p {font-size:12px; max-height:63px}

}
@media screen and (min-width:810px) and (max-width:980px){
	#container > .inner .product .area_wrap > .area_box .info {height:760px;}

	
}
@media screen and (min-width:769px) and (max-width:809px){
	#container > .inner .product .area_wrap > .area_box .info {height:850px;}

	
}

@media screen and (max-width:768px) {
 /* 서브 비주얼 영역 */
 #sub_visual ul li {height:380px}
 #sub_visual .title {top:35%}
 #sub_visual .title h2 {font-size:32px}
 #sub_visual .title h2:after {margin:20px auto; width:32px}
 #sub_visual .title h3 {font-size:18px}

 /* 제품소개 스타일 */
 .portfolio-list {width:103.5%; margin-left:-1.6129%}
 .portfolio-list > li {width:46.77% !important; margin:0 1.6129% 20px 1.6129%;}
 .portfolio-list .hoverBox {padding:25% 20px 0 20px}
 
 #container > .inner .product .area_wrap > .area_box .info {height:1300px;}
 #container > .inner .product .area_wrap > .area_box.all .info.function{ height:500px;}
#container > .inner .product .area_wrap > .area_box.control .info.con{ height:800px}

 
 /* 타일 섹션 */
 #container .section6 .inner .upper:after, #container .section6 .inner .lower .tile_wrap:after {display:none}
 #container .section6 .inner .tile .caption h3 {font-size:14px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
 #container .section6 .inner .tile .caption p {font-size:12px}
 #container .section6 .inner .upper {margin-bottom:0}
 #container .section6 .inner .lower .tile_wrap {display:block; width:100%}
 #container .section6 .inner .lower .tile_wrap .tile {width:100%}
 #container .section6 .inner .lower .tile_wrap .tile .imgArea {float:left; width:45%}
 #container .section6 .inner .lower .tile_wrap .tile .caption {margin-top:0; margin-left:50%}
 #container .section6 .inner .lower .tile_wrap .tile .caption p {max-height:85px; -webkit-line-clamp:3}
  #container .section6 .inner .center > ul >li{width:200px}
#container .section6 .inner .tile .email img{width:40%;}
}
 
/*2018-02-27추가 게시판 읽기 */
.tbl_brd tbody td {font-size:12px !important; padding:12px 10px}
.tbl_brd tbody td font, .tbl_brd tbody td span, .tbl_brd tbody td a {font-size:12px !important}
.prvThumbList table td {padding:2px !important}
.prvThumbList > table {width:100%}
.prvThumbList > table td table {width:33%}
.prvThumbList img {width:100%; height:auto}
/* 게시판 공통 */
#ext_search {display:none}
.comment_name {display:block !important; width:100% !important; padding:10px !important}
.comment_txt[align=left], .comment_txt[align=right] {display:block !important; width:100% !important; text-align:left !important; padding:10px !important}

}
/*회사소개*/
#container > .inner .greeting > .main_imgArea{ text-align:center;}
#container > .inner .greeting > .main_imgArea .left {float:left; width:48%}
#container > .inner .greeting > .main_imgArea .right {float:right; width:48%;}
#container > .inner .greeting > .main_imgArea span {font-size:20px; font-weight:bold}
#container > .inner .greeting > .main_imgArea img{ display:inline-block;width:100%; height:300px}

#container > .inner .greeting > .sub_imgArea{ margin-bottom:30px;text-align:center}
#container > .inner .greeting > .sub_imgArea img{ display:inline-block; width:24%; height:170px;}
#container > .inner .greeting .info_box { width:100%;}

@media screen and (max-width:640px) {
 /* 서브 비주얼 영역 */
 #sub_visual ul li {height:300px !important}
 
 /* 서브 공통 레이아웃 */
 #container > .inner {padding:30px 30px 50px 30px}
 #container > .inner .title h2 {font-size:24px}
 #nav .title {display:none}
 #nav .inner {padding:0}
 #nav .inner:after {clear:both; display:block; content:''}
 #nav .dropdown {min-width:inherit; width:50%; width:-webkit-calc(50% + 1px); width:-moz-calc(50% + 1px)}
 #nav .dropdown:last-child a {border-right:none}
 #nav .dropdown > a {padding:0 50px 0 15px; font-size:12px; font-weight:400}
 #nav .dropdown > ul.mnuList li a {padding:10px 15px; font-size:12px}
 
  #nav_board .title {display:none}
 #nav_board .inner {padding:0}
 #nav_board .inner:after {clear:both; display:block; content:''}
 #nav_board .dropdown {min-width:inherit; width:50%; width:-webkit-calc(50% + 1px); width:-moz-calc(50% + 1px)}
 #nav_board .dropdown:last-child a {border-right:none}
 #nav_board .dropdown > a {padding:0 50px 0 15px; font-size:12px; font-weight:400}
 #nav_board .dropdown > div.mnuList li a {padding:10px 15px; font-size:12px}
 
 #container > .inner h3.sub_tit {font-size:16px; font-weight:600}
 #container > .inner img.img_mob {display:block !important}
 #container > .inner img.img_pc, #container > .inner img.img_tab {display:none !important}
 .btm_img {height:400px}
 .btm_img .inner {padding:0 30px}
 .btm_img .inner .caption h2 {font-size:36px}
 .btm_img .inner .caption p {max-width:100%; font-size:13px}
 /* COMPANY - 회사소개 */
 #container > .inner .greeting .grt_tit h3 {font-size:16px}
 #container > .inner .greeting > img{ height:300px}
 #container > .inner .greeting ul.teamList > li {width:100%; margin-bottom:30px; padding-top:30px; text-align:center; border-top:1px solid #e6e6e6}
 #container > .inner .greeting ul.teamList > li:first-child {border-top:none}
 #container > .inner .greeting ul.teamList > li .imgArea {width:160px}
 #container > .inner .greeting .info_box dl {border-bottom:1px dotted #ccc}
 #container > .inner .greeting .info_box dl dt {width:20%; border:none}
 #container > .inner .greeting .info_box dl dd {margin-left:25%; border:none}
#container > .inner .greeting .info_box .text > strong{ font-size:25px;}
#container > .inner .greeting .info_box .text .txt {font-size:1.3rem}


 /* COMPANY - 연혁 */
 #container > .inner .history{background:none}
 #container > .inner .history .history_box .his_tit span {font-size:14px}
 #container > .inner .history .history_box .his_tit h3 {font-size:18px; margin-top:5px}
 #container > .inner .history .history_box .left {float:none; width:100%; margin-bottom:40px}
 #container > .inner .history .history_box .left p {font-size:12px}
 #container > .inner .history .history_box .right {margin-left:none; width:100%}
 #container > .inner .history .history_box .right dl {margin:15px 0; padding:15px 0 0 0; border-top:1px solid #e6e6e6}
 #container > .inner .history .history_box .right dl:first-child {border-top:none}
 #container > .inner .history .history_box .right dl dt {width:45px; font-size:18px}
 #container > .inner .history .history_box .right dl dd { line-height:3; font-size:12px}
 #container > .inner .history .history_box .right.two dl dd:last-child {padding-left:5px}
 /* COMPANY - 찾아오시는 길 */
 #map {height:350px}
 #container > .inner .map_box ul.map_info li {font-size:12px}
 /* BUSINESS - 사업안내 */
 #container > .inner .product ul.typeList li {width:100%}
 #container > .inner .product ul.typeList .info h4 {font-size:15px}
 #container > .inner .product ul.typeList li .imgArea {max-height:inherit}
 #container > .inner .product ul.typeList li .imgArea img {margin-top:0}
 #container > .inner .product ul.processList li {width:100%; margin-bottom:40px}
 #container > .inner .product ul.processList li:last-child {margin-bottom:0}
 /* BUSINESS - 사업영역 */
 #container > .inner .product .area_wrap > .area_box {width:100%; margin-bottom:15px}
 #container > .inner .product .area_wrap > .area_box .info {min-height:inherit; height:auto; padding:20px}
 #container > .inner .product .area_wrap > .area_box.all .info.function{ height:auto;}
 #container > .inner .product .area_wrap > .area_box .info h4 {font-size:17px; font-weight:600; margin-bottom:20px}
 #container > .inner .product .area_wrap > .area_box .info p {font-size:15px}
 #container > .inner .product .area_wrap > .area_box .info ul li {word-break:normal}
 #container > .inner .product .area_wrap > .area_box.table .text{ display:block;padding-left:0; font-size:13px; width:400px}
/*수도미터(직독/원격)*/
#container > .inner .product .area_wrap > .area_box.control .info.con{ height:auto}

#container .section6 .inner .tile > ul{ margin-left:15px;}
#container .section6 .inner .tile .caption.right {width:50%;font-size:13px;}
#container .section6 .inner .center > ul >li{width:170px}
#container .section6 .inner .center > ul >li .caption.email-text p{margin-left:10px}
#container .section6 .inner .tile .email{margin-left:10px}
#container .section6 .inner .tile .email img{padding-bottom:0;width:50%;}
#container .section6 .inner .upper .tile .imgArea.email {margin-top:10px}

/*2018-02-27추가 게시판 - 공지사항 */
.brd_notice .att_title:first-child {display:none}
.brd_notice .att_title:nth-child(3) {display:none}
.brd_notice .bbsno {display:none}
.brd_notice .bbswriter {display:none}
/* 게시판 - QNA */
.brd_qna .att_title:first-child {display:none}
.brd_qna .att_title:nth-child(4) {display:none}
.brd_qna .att_title:nth-child(5) {display:none}
.brd_qna .att_title:nth-child(6) {display:none}
.brd_qna .bbsno {display:none}
.brd_qna .bbsetc_dateof_write {display:none}
.brd_qna .bbspublic_ox {display:none}

}
@media screen and (max-width:480px) {
		#container > .inner .greeting .info_box .text {font-size:1.1rem; word-break:initial; }

		/*회사소개*/
	#container > .inner .greeting > .main_imgArea img{width:100%}
#container > .inner .greeting > .sub_imgArea img{width:100%;}
#container > .inner .greeting .info_box { margin-bottom:30px;height:auto;}
/*찾아오시는길*/
#container > .inner .greeting > .main_imgArea .left {float:none; width:100%}
#container > .inner .greeting > .main_imgArea .right {float:none; width:100%;}

 /* 서브 비주얼 영역 */
 #sub_visual ul li {height:225px !important}
 #sub_visual .title h2 {font-size:28px}
 #sub_visual .title h3 {font-size:15px}
 
 #container .section6 .inner .center > ul >li{width:120px}
 #container .section6 .inner .tile .email img{padding-bottom:0;width:70%;}
 
}
@media screen and (max-width:390px) {
	#container > .inner .product .area_wrap > .area_box.table table th{font-size:13px}

	}
@media screen and (max-width:375px){
	#container .section6 .inner .tile > ul{ margin-left:0;}
	#container .section6 .inner .tile .caption.left {font-size:16px;}
 #container .section6 .inner .center > ul >li{width:90px}
 #container .section6 .inner .tile .email img{width:100%;}
	}	
@media screen and (min-width:601px) and (max-width:1044px) {
	
	#container > .inner .Change_5 img {max-width:32%}
	#container > .inner .Change_3 img {max-width:32%}

}	
@media screen and (min-width:601px) and (max-width:878px) {
	
	#container > .inner .Change img {max-width:32%}

}
@media screen and (min-width:525px) and (max-width:600px) {
	
	#container > .inner .Change_3 img {max-width:32%}

}

@media screen and (min-width:723px) and (max-width:1035px) {
	
	#container > .inner .Change_2_4 img {max-width:32%}
	#container > .inner .Change_2_3 img {max-width:32%}

}