@import url('/new_haema/css/common.css');

.board_list {border-top:2px solid #cd0000; clear:both;}
.board_list .list_header {width:100%; background-color:#f5f4f4; display:table;}
.board_list .list_header span {color:#8888a3; text-align:center; display:table-cell;}
.board_list ul.list {border-bottom:1px solid #7b7b7b; list-style:none;}
.board_list ul.list li {width:100%; border-top:1px solid #d7d7d7; table-layout:fixed; display:table;}
.board_list ul.list li span {color:#555; white-space:nowrap; text-overflow:ellipsis; overflow:hidden; text-align:center; display:table-cell;}
.board_list ul.list li span a {color:#555;}
.board_list ul.list li span a:hover {text-decoration:underline;}
.board_list ul.list li span.title {text-align:left;}

.board_write {border-top:1px solid #cd0000; clear:both;}
.board_write > .title input {width:100%; border:0; box-sizing:border-box; display:block;}
.board_write > .text_area textarea {width:100%; height:100%; border:1px solid #ddd; box-sizing:border-box; display:block;}
.board_write > ul {list-style:none;}
.board_write > ul li {box-sizing:border-box; position:relative;}
.board_write > ul li span {color:#707070;}
.board_write > ul li input {border:0; border-bottom:1px solid #ddd;}
.board_write > .file {border-top:1px solid #d7d7d7; border-bottom:1px solid #d7d7d7;}

.board_view .view_wrap pre {font-family:'NBG';} /* 20170619 add */

.thumb_list .list_header {display:none;}
.thumb_list ul.list:after {clear:both; content:''; display:block;}
.thumb_list li {width:33.333%; float:left;}

@media screen and (min-width:1200px) {
	#container {width:1100px; margin:0 auto; padding-bottom:100px;} /* 20170619 add (padding-bottom) */
	#container .content {padding-top:70px; position:relative;}
	#container .content h2 {margin-bottom:20px; font-size:30px; line-height:30px;}

	/* 회사소개 */
	#container .company {text-align:center; position:relative;}
	#container .company .title {margin-bottom:30px;}
	#container .company .title span {margin:30px 0; display:block;}
	#container .company .title strong {font-size:40px; line-height:100%; font-weight:normal; display:inline-block;}

	#container .company dl {padding:30px 0; position:relative;}
	#container .company dl:after {clear:both; content:''; display:block;}
	#container .company dt {width:100px; margin-top:5px; padding-left:20px; font-family:'NBG-Bold'; line-height:1.3; border-left:4px solid #ed1b24; box-sizing:border-box; text-align:left; float:left; position:relative;}
	#container .company dd {margin-left:180px; line-height:25px; text-align:left;}
	#container .company dd:after {clear:both; content:''; display:block;}

	#container .company dl.greeting strong {margin-bottom:20px; font-size:20px; line-height:1.8; display:block;}
	#container .company dl.greeting p {/*width:50%; */text-align:justify;}
	#container .company dl.greeting span {background:url('/new_haema/images/sub/bg_greeting.png') right 50%;  background-repeat:no-repeat; text-align:right; position:absolute; top:0; right:0; bottom:0; left:50%; z-index:-1;}
	#container .company dl.greeting ul {border-top:1px solid #666;}
	#container .company dl.greeting li {width:100%; table-layout:fixed; display:table;}
	#container .company dl.greeting li span {display:table-cell;}

	#container .company dl.info dd ul {border-top:1px solid #666; list-style:none;}
	#container .company dl.info ul ul {margin-top:10px; border:0;}
	#container .company dl.info dd > ul > li {width:100%; border-bottom:1px solid #efefef; table-layout:fixed; display:table;}
	#container .company dl.info dd > ul > li span {padding:20px 60px 20px; color:#666; font-size:14px; box-sizing:border-box; vertical-align:middle; position:relative; display:table-cell;}
	#container .company dl.info dd > ul > li .title {width:285px; padding-left:83px; background-color:#f9f9f9;}
	#container .company dl.info dd > ul > li .title:before {width:41px; height:36px; margin-top:-18px; background-image:url('/new_haema/images/btn_icon/icon_element.png'); background-repeat:no-repeat; content:''; position:absolute; top:50%; left:20px; display:inline-block;}
	#container .company dl.info dd > ul > li ul + strong {margin-top:20px; display:inline-block;}
    #container .company dl.info dd > ul > li li {padding-left:10px; position:relative;}
	#container .company dl.info dd > ul > li li:before {font-size:11px; content:'-'; position:absolute; top:-2px; left:0; display:inline-block;}

	/* 회사개요 title icon */
	#container .company dl.info dd > ul > li:nth-of-type(1) .title:before {background-position:0 0;}
	#container .company dl.info dd > ul > li:nth-of-type(2) .title:before {background-position:-153px 0;}
	#container .company dl.info dd > ul > li:nth-of-type(3) .title:before {background-position:-51px 0;}
	#container .company dl.info dd > ul > li:nth-of-type(4) .title:before {background-position:-102px 0;}
	#container .company dl.info dd > ul > li:nth-of-type(5) .title:before {background-position:-204px 0;}
	#container .company dl.info dd > ul > li:nth-of-type(6) .title:before {background-position:0 -46px;}
	#container .company dl.info dd > ul > li:nth-of-type(7) .title:before {background-position:-51px -46px;}
	#container .company dl.info dd > ul > li:nth-of-type(8) .title:before {background-position:-102px -46px;}

	#container .company dl.history dd {border-bottom:1px dashed #c9c9c9;}
	#container .company dl.history dd + dt {margin-top:50px;}
	#container .company dl.history ul {margin-left:-20px; list-style:none;}
	#container .company dl.history ul:after {clear:both; content:''; display:block;}
	#container .company dl.history li {width:33.333%; margin-bottom:20px; padding-left:20px; box-sizing:border-box; float:left;}
	#container .company dl.history dd > ul > li:nth-of-type(3n + 1) {clear:left;}
	#container .company dl.history li p {margin:10px 0;}
	#container .company dl.history li p em {color:#7c7c7c; font-size:11px; font-family:'dotum'; font-style:normal; line-height:100%; display:block;}
	#container .company dl.moto dd p {padding:25px 0 20px; border:4px solid #3c3c3c; text-align:center;}
	#container .company dl.moto dd p strong {padding:0 20px 0 30px;font-size:32px; line-height:32px; position:relative;}
	#container .company dl.moto dd p strong:before {margin-top:-16px; color:#808080; font-size:20px; font-weight:normal; content:' / '; position:absolute; top:50%; left:0; display:inline-block;}
	#container .company dl.moto dd p strong:first-child {padding-left:0;}
	#container .company dl.moto dd p strong:first-child:before {display:none;}

	#container .company dl.organization img {max-width:100%;}

	#container .map_area {padding:25px; background-color:#333;}
	#container .map_area #map {height:450px; border:1px solid #1b1b1b;}
	#container .map_area #map div {z-index:0!important;}
    #container .map_area p {margin:20px 0 0 20px; color:#fff;}
	#container .map_area .traffic {margin-top:10px; margin-bottom:5px; list-style:none;}
	#container .map_area .traffic:after {clear:both; content:''; display:block;}
	#container .map_area .traffic li {width:50%; padding-left:50px; color:#fff; line-height:22px; border-left:1px solid #555; box-sizing:border-box; float:left; position:relative;}
	#container .map_area .traffic li:first-child {border-left:0;}
	#container .map_area .traffic li:before {width:16px; height:19px; background-image:url('/new_haema/images/btn_icon/icon_btn.png'); background-position:-100px -40px; background-repeat:no-repeat; content:''; position:absolute; top:0; left:20px;}
	#container .map_area .traffic li:nth-of-type(2):before {background-position:-130px -40px;}

	#container .business h3 {margin-bottom:20px; font-size:20px; line-height:1.8; display:block;}
	#container .business p {margin-bottom:30px; color:#666; line-height:25px;}
	#container .slider_wrap {overflow:hidden; position:relative;}
	#container .business .thumb_list {margin-left:-10px; list-style:none; position:absolute;}
	#container .business .thumb_list:after {clear:both; content:''; display:block;}
	#container .business .thumb_list li {width:25%; padding-left:20px; box-sizing:border-box; float:left;}
	#container .business .thumb_list li span.thumb {height:150px; margin-bottom:15px; background-position:50%; background-size:cover; background-repeat:no-repeat; border:1px solid #f0f0f0; border-radius:5px; box-sizing:border-box; overflow:hidden; cursor:pointer; display:block;}
	#container .business .direction-nav li {list-style:none; position:absolute; top:50%;}
	#container .business .direction-nav li.next {right:0;}
	#container .business .direction-nav li a {font-size:0;}
	#container .business .direction-nav li a:after {width:24px; height:44px; margin-top:-37px; color:#000; background-image:url('/new_haema/images/btn_icon/btn_slide.png'); background-repeat:no-repeat; display:inline-block;}
	#container .business .direction-nav li.prev a:after {font-size:30px; background-position:0 0; content:'';}
	#container .business .direction-nav li.next a:after {font-size:30px; background-position:-24px 0; content:'';}

	#container .search {margin-bottom:20px;}
	#container .search > span {width:250px; height:40px; border:1px solid #dcdcdc; border-right:0; box-sizing:border-box; vertical-align:middle; display:inline-block;}
	#container .search > span input {width:100%; height:36px; padding:0 10px; font-size:14px; border:0; box-sizing:border-box; display:block;}
	#container .search > a {width:40px; height:40px; font-size:0; background-color:#ed1b24; text-align:center; vertical-align:middle; position:relative; display:inline-block;}
	#container .search > a:after {width:26px; height:25px; margin-top:-12px; margin-left:-13px; background:url('/new_haema/images/btn_icon/icon_btn.png') -120px 0 no-repeat; content:''; position:absolute; top:50%; left:50%; display:block;}

	#container .paging {margin:20px 0; text-align:center;}
	#container .paging a {width:25px; height:25px; margin:0 2px; color:#555; font-size:12px; font-family:'arial'; line-height:25px; border:1px solid #d7d7d7; box-sizing:border-box; text-align:center; vertical-align:middle; display:inline-block;}
	#container .paging a.on {color:#fff; background-color:#555; text-decoration:none !important; cursor:default;}
	#container .paging a:hover {text-decoration:underline;}
	#container .paging a.prev, #container .paging a.next {width:14px; height:27px; margin:0 5px; font-size:0; background-image:url('/new_haema/images/btn_icon/icon_btn.png'); background-position:0 0; background-size:75px auto; background-repeat:no-repeat; border:0;}
	#container .paging a.next {background-position:-19px 0;}

	#container .button_area {margin:20px 0;}

	.tab_area {width:100%; margin-bottom:20px; list-style:none;}
	.tab_area:after {clear:both; content:''; display:block;}
	.tab_area li {border-bottom:1px solid #ccc; text-align:center; float:left;}
	.tab_area li a {padding:21px 0; color:#888; font-size:17px; font-family:'NBG-Light'; border-bottom:1px solid transparent; display:block;}
	.tab_area li.on {border-color:#ed1b24;}
	.tab_area li.on a {color:#242424; border-color:#ed1b24;}
	.tab_area + span.selected {display:none;}

	.tab_content {display:none;}
	.tab_content.on {display:block;}

	.board_write strong.title {margin:10px 0 20px 0; padding:0 20px; display:block;}
	.board_write strong.title input {padding:20px 0; font-size:20px; line-height:100%; border-bottom:1px solid #ddd; box-sizing:border-box; display:block;}
	.board_write ul:after {clear:both; content:''; display:block;}
	.board_write ul > li {width:50%; margin-top:10px; padding:20px; float:left;}
	.board_write ul > li span {width:100px; position:absolute; top:20px; left:20px;}
	.board_write ul > li input {width:100%; height:40px; font-size:16px; display:block;}
	.board_write .text_area {height:200px; margin-top:20px; padding:0 20px;}
	.board_write .text_area textarea {padding:20px;}
	.board_write .file {margin:30px 20px 0; padding:10px 0 10px 140px; box-sizing:border-box; position:relative;}
	.board_write .file:before {width:100px; line-height:44px; background-color:#c7c7c7; text-align:center; vertical-align:middle; content:'첨부파일'; position:absolute; top:0; bottom:0; left:0;}

	.board_list .list_header span {padding:15px 10px;}
	.board_list ul.list li span {padding:20px 10px;}

	/* list column width */
	.board_list span.no {width:50px;}
	.board_list span.writer {width:100px;}
	.board_list span.date {width:120px;}
	.board_list span.hit {width:80px;}

	.board_view {line-height:1.5; border-bottom:1px solid #d7d7d7;}
	.board_view strong.title {padding-top:20px; font-size:34px; line-height:40px; position:relative; display:block;}
	.board_view strong.title:before {width:50px; border:1px solid #cd0000; content:''; position:absolute; top:0; left:0; display:block;}
	.board_view .wirte_info {margin-top:15px; font-size:13px; text-align:right;}
	.board_view .wirte_info span {margin-left:15px; display:inline-block;}
	.board_view .view_wrap {margin-top:20px; padding:20px 10px; border-top:1px solid #d7d7d7;}
	.board_view .file {height:45px; padding:15px 0 15px 120px; border-top:1px solid #d7d7d7; box-sizing:border-box; position:relative;}
	.board_view .file:before {width:100px; line-height:44px; background-color:#c7c7c7; text-align:center; vertical-align:middle; content:'첨부파일'; position:absolute; top:0; bottom:0; left:0;}
	.board_view img {max-width:100%;}

	#layerThumb {background-color:rgba(0,0,0,0.8); position:fixed; top:0; right:0; bottom:0; left:0; z-index:10;}
	#layerThumb .close {width:25px; height:25px; font-size:0; background-image:url('/new_haema/images/btn_icon/icon_btn.png'); background-position:-80px 0; box-sizing:border-box; position:absolute; top:7px; right:20px; display:block;}
	#layerThumb .popContainer {max-width:50%; max-height:90%; margin-left:-25%; padding:40px 20px 10px 20px; background-color:#222; box-sizing:border-box; text-align:center; position:absolute; left:50%;}
	#layerThumb .popContainer img {max-width:100%; max-height:100%;}
	#layerThumb .popContainer span.title {margin-top:10px; color:#fff; display:block;}
}

@media screen and (max-width:1199px) and (min-width:768px) {
	#container {width:100%; margin:0 auto; padding:0 20px 100px; box-sizing:border-box;} /* 20170619 add (padding-bottom) */
	#container .content {padding-top:70px; position:relative;}
	#container .content h2 {margin-bottom:20px; font-size:30px; line-height:30px;}

	/* 회사소개 */
	#container .company {text-align:center; position:relative;}
	#container .company .title {margin-bottom:30px;}
	#container .company .title span {margin:30px 0; display:block;}
	#container .company .title strong {font-size:40px; line-height:100%; font-weight:normal; display:inline-block;}

	#container .company dl {padding:30px 0; position:relative;}
	#container .company dl:after {clear:both; content:''; display:block;}
	#container .company dt {width:100px; margin-top:5px; padding-left:20px; font-family:'NBG-Bold'; line-height:1.3; border-left:4px solid #ed1b24; box-sizing:border-box; text-align:left; float:left; position:relative;}
	#container .company dd {margin-left:150px; line-height:25px; text-align:left;}
	#container .company dd:after {clear:both; content:''; display:block;}

	#container .company dl.greeting strong {margin-bottom:20px; font-size:20px; line-height:1.8; display:block;}
	#container .company dl.greeting p {width:50%; text-align:justify;}
	#container .company dl.greeting span {background:url('/new_haema/images/sub/bg_greeting.png') right 50%;  background-repeat:no-repeat; text-align:right; position:absolute; top:0; right:0; bottom:0; left:50%; z-index:-1;}
	#container .company dl.greeting ul {border-top:1px solid #666;}
	#container .company dl.greeting li {width:100%; table-layout:fixed; display:table;}
	#container .company dl.greeting li span {display:table-cell;}

	#container .company dl.info dd ul {border-top:1px solid #666; list-style:none;}
	#container .company dl.info ul ul {margin-top:10px; border:0;}
	#container .company dl.info dd > ul > li {width:100%; border-bottom:1px solid #efefef; table-layout:fixed; display:table;}
	#container .company dl.info dd > ul > li span {padding:20px 30px 20px; color:#666; font-size:14px; box-sizing:border-box; vertical-align:middle; position:relative; display:table-cell;}
	#container .company dl.info dd > ul > li .title {width:170px; padding-left:75px; background-color:#f9f9f9;}
	#container .company dl.info dd > ul > li .title:before {width:41px; height:36px; margin-top:-18px; background-image:url('/new_haema/images/btn_icon/icon_element.png'); background-repeat:no-repeat; content:''; position:absolute; top:50%; left:20px; display:inline-block;}
	#container .company dl.info dd > ul > li ul + strong {margin-top:20px; display:inline-block;}
	#container .company dl.info dd > ul > li li {padding-left:10px; position:relative;}
	#container .company dl.info dd > ul > li li:before {font-size:11px; content:'-'; position:absolute; top:-2px; left:0; display:inline-block;}

	/* 회사개요 title icon */
	#container .company dl.info dd > ul > li:nth-of-type(1) .title:before {background-position:0 0;}
	#container .company dl.info dd > ul > li:nth-of-type(2) .title:before {background-position:-153px 0;}
	#container .company dl.info dd > ul > li:nth-of-type(3) .title:before {background-position:-51px 0;}
	#container .company dl.info dd > ul > li:nth-of-type(4) .title:before {background-position:-102px 0;}
	#container .company dl.info dd > ul > li:nth-of-type(5) .title:before {background-position:-204px 0;}
	#container .company dl.info dd > ul > li:nth-of-type(6) .title:before {background-position:0 -46px;}
	#container .company dl.info dd > ul > li:nth-of-type(7) .title:before {background-position:-51px -46px;}
	#container .company dl.info dd > ul > li:nth-of-type(8) .title:before {background-position:-102px -46px;}

	#container .company dl.history dd {border-bottom:1px dashed #c9c9c9;}
	#container .company dl.history dd + dt {margin-top:50px;}
	#container .company dl.history ul {margin-left:-20px; list-style:none;}
	#container .company dl.history ul:after {clear:both; content:''; display:block;}
	#container .company dl.history li {width:33.333%; margin-bottom:20px; padding-left:20px; box-sizing:border-box; float:left;}
	#container .company dl.history dd > ul > li:nth-of-type(3n + 1) {clear:left;}
	#container .company dl.history li p {margin:10px 0;}
	#container .company dl.history li p em {color:#7c7c7c; font-size:11px; font-family:'dotum'; font-style:normal; line-height:100%; display:block;}
	#container .company dl.moto dd p {padding:25px 0 20px; border:4px solid #3c3c3c; text-align:center;}
	#container .company dl.moto dd p strong {padding:0 20px 0 30px;font-size:32px; line-height:32px; position:relative;}
	#container .company dl.moto dd p strong:before {margin-top:-16px; color:#808080; font-size:20px; font-weight:normal; content:' / '; position:absolute; top:50%; left:0; display:inline-block;}
	#container .company dl.moto dd p strong:first-child {padding-left:0;}
	#container .company dl.moto dd p strong:first-child:before {display:none;}

	#container .company dl.organization img {max-width:100%;}

	#container .map_area {padding:25px; background-color:#333;}
	#container .map_area #map {height:450px; border:1px solid #1b1b1b;}
	#container .map_area #map div {z-index:0!important;}
    #container .map_area p {margin:20px 0 0 20px; color:#fff;}
	#container .map_area .traffic {margin-top:10px; margin-bottom:5px; list-style:none;}
	#container .map_area .traffic:after {clear:both; content:''; display:block;}
	#container .map_area .traffic li {width:50%; padding-left:50px; color:#fff; line-height:22px; border-left:1px solid #555; box-sizing:border-box; float:left; position:relative;}
	#container .map_area .traffic li:first-child {border-left:0;}
	#container .map_area .traffic li:before {width:16px; height:19px; background-image:url('/new_haema/images/btn_icon/icon_btn.png'); background-position:-100px -40px; background-repeat:no-repeat; content:''; position:absolute; top:0; left:20px;}
	#container .map_area .traffic li:nth-of-type(2):before {background-position:-130px -40px;}

	#container .business h3 {margin-bottom:20px; font-size:20px; line-height:1.8; display:block;}
	#container .business p {margin-bottom:30px; color:#666; line-height:25px;}
	#container .slider_wrap {overflow:hidden; position:relative;}
	#container .business .thumb_list {margin-left:-10px; list-style:none; position:absolute;}
	#container .business .thumb_list:after {clear:both; content:''; display:block;}
	#container .business .thumb_list li {width:25%; padding-left:20px; box-sizing:border-box; float:left;}
	#container .business .thumb_list li span.thumb {height:150px; margin-bottom:15px; background-position:50%; background-size:cover; background-repeat:no-repeat; border:1px solid #f0f0f0; border-radius:5px; box-sizing:border-box; overflow:hidden; cursor:pointer; display:block;}
	#container .business .direction-nav li {list-style:none; position:absolute; top:50%;}
	#container .business .direction-nav li.next {right:0;}
	#container .business .direction-nav li a {font-size:0;}
	#container .business .direction-nav li a:after {width:24px; height:44px; margin-top:-37px; color:#000; background-image:url('/new_haema/images/btn_icon/btn_slide.png'); background-repeat:no-repeat; display:inline-block;}
	#container .business .direction-nav li.prev a:after {font-size:30px; background-position:0 0; content:'';}
	#container .business .direction-nav li.next a:after {font-size:30px; background-position:-24px 0; content:'';}

	#container .search {margin-bottom:20px;}
	#container .search > span {width:250px; height:40px; border:1px solid #dcdcdc; border-right:0; box-sizing:border-box; vertical-align:middle; display:inline-block;}
	#container .search > span input {width:100%; height:36px; padding:0 10px; font-size:14px; border:0; box-sizing:border-box; display:block;}
	#container .search > a {width:40px; height:40px; font-size:0; background-color:#ed1b24; text-align:center; vertical-align:middle; position:relative; display:inline-block;}
	#container .search > a:after {width:26px; height:25px; margin-top:-12px; margin-left:-13px; background:url('/new_haema/images/btn_icon/icon_btn.png') -120px 0 no-repeat; content:''; position:absolute; top:50%; left:50%; display:block;}

	#container .paging {margin:20px 0; text-align:center;}
	#container .paging a {width:25px; height:25px; margin:0 2px; color:#555; font-size:12px; font-family:'arial'; line-height:25px; border:1px solid #d7d7d7; box-sizing:border-box; text-align:center; vertical-align:middle; display:inline-block;}
	#container .paging a.on {color:#fff; background-color:#555; text-decoration:none !important; cursor:default;}
	#container .paging a:hover {text-decoration:underline;}
	#container .paging a.prev, #container .paging a.next {width:14px; height:27px; margin:0 5px; font-size:0; background-image:url('/new_haema/images/btn_icon/icon_btn.png'); background-position:0 0; background-size:75px auto; background-repeat:no-repeat; border:0;}
	#container .paging a.next {background-position:-19px 0;}

	#container .button_area {margin:20px 0;}

	.tab_area {width:100%; margin-bottom:20px; list-style:none;}
	.tab_area:after {clear:both; content:''; display:block;}
	.tab_area li {border-bottom:1px solid #ccc; text-align:center; float:left;}
	.tab_area li a {padding:21px 0; color:#888; font-size:17px; font-family:'NBG-Light'; border-bottom:1px solid transparent; display:block;}
	.tab_area li.on {border-color:#ed1b24;}
	.tab_area li.on a {color:#242424; border-color:#ed1b24;}
	.tab_area + span.selected {display:none;}

	.tab_content {display:none;}
	.tab_content.on {display:block;}

	.board_write strong.title {margin:10px 0 20px 0; padding:0 20px; display:block;}
	.board_write strong.title input {padding:20px 0; font-size:20px; line-height:100%; border-bottom:1px solid #ddd; box-sizing:border-box; display:block;}
	.board_write ul:after {clear:both; content:''; display:block;}
	.board_write ul > li {width:50%; margin-top:10px; padding:20px; float:left;}
	.board_write ul > li span {width:100px; position:absolute; top:20px; left:20px;}
	.board_write ul > li input {width:100%; height:40px; font-size:16px; display:block;}
	.board_write .text_area {height:200px; margin-top:20px; padding:0 20px;}
	.board_write .text_area textarea {padding:20px;}
	.board_write .file {margin:30px 20px 0; padding:10px 0 10px 140px; box-sizing:border-box; position:relative;}
	.board_write .file:before {width:100px; line-height:44px; background-color:#c7c7c7; text-align:center; vertical-align:middle; content:'첨부파일'; position:absolute; top:0; bottom:0; left:0;}

	.board_list .list_header span {padding:15px 10px;}
	.board_list ul.list li span {padding:20px 10px;}

	/* list column width */
	.board_list span.no {width:50px;}
	.board_list span.writer {width:100px;}
	.board_list span.date {width:120px;}
	.board_list span.hit {width:80px;}

	.board_view {line-height:1.5; border-bottom:1px solid #d7d7d7;}
	.board_view strong.title {padding-top:20px; font-size:34px; line-height:40px; position:relative; display:block;}
	.board_view strong.title:before {width:50px; border:1px solid #cd0000; content:''; position:absolute; top:0; left:0; display:block;}
	.board_view .wirte_info {margin-top:15px; font-size:13px; text-align:right;}
	.board_view .wirte_info span {margin-left:15px; display:inline-block;}
	.board_view .view_wrap {margin-top:20px; padding:20px 10px; border-top:1px solid #d7d7d7;}
	.board_view .file {height:45px; padding:15px 0 15px 120px; border-top:1px solid #d7d7d7; box-sizing:border-box; position:relative;}
	.board_view .file:before {width:100px; line-height:44px; background-color:#c7c7c7; text-align:center; vertical-align:middle; content:'첨부파일'; position:absolute; top:0; bottom:0; left:0;}
	.board_view img {max-width:100%;}

	#layerThumb {background-color:rgba(0,0,0,0.8); position:fixed; top:0; right:0; bottom:0; left:0; z-index:1000;}
	#layerThumb .close {width:25px; height:25px; font-size:0; background-image:url('/new_haema/images/btn_icon/icon_btn.png'); background-position:-80px 0; box-sizing:border-box; position:absolute; top:7px; right:20px; display:block;}
	#layerThumb .popContainer {max-width:80%; margin-left:-40%; padding:40px 20px 10px 20px; background-color:#222; box-sizing:border-box; text-align:center; position:absolute; left:50%;}
	#layerThumb .popContainer img {max-width:100%; max-height:100%;}
	#layerThumb .popContainer span.title {margin-top:10px; color:#fff; display:block;}
}

@media screen and (max-width:767px){
	img {max-width:100%;}
	#container {padding-bottom:70px;} /* 20170619 add */
	#container .content {padding-top:30px; padding-right:15px; padding-left:15px; position:relative;}
	#container .content h2 {margin-bottom:30px; font-size:18px; line-height:30px;}

	/* 회사소개 */
	#container .company {text-align:center; position:relative;}
	#container .company .title span {margin:30px 0; line-height:1.5; word-break:keep-all; display:block;}
	#container .company .title strong {font-size:24px; line-height:100%; font-weight:normal; display:inline-block;}

	#container .company dl {padding:30px 0; position:relative;}
	#container .company dl:after {clear:both; content:''; display:block;}
	#container .company dt {margin-top:5px; margin-bottom:20px; padding-left:20px; font-family:'NBG-Bold'; line-height:1.3; border-left:4px solid #ed1b24; box-sizing:border-box; text-align:left; position:relative;}
	#container .company dt br {display:none;}
	#container .company dd {line-height:25px; text-align:left;}
	#container .company dd:after {clear:both; content:''; display:block;}

	#container .company dl.greeting strong {margin-bottom:20px; font-size:24px; font-weight:normal; word-break:keep-all; line-height:1.3; text-align:center; display:block;}
	#container .company dl.greeting strong br {display:none;}
	#container .company dl.greeting p {text-align:justify;}
	#container .company dl.greeting span {background:url('/new_haema/images/sub/bg_greeting.png') right 50%;  background-repeat:no-repeat; text-align:center;}
	#container .company dl.greeting ul {border-top:1px solid #666;}
	#container .company dl.greeting li {width:100%; table-layout:fixed; display:table;}
	#container .company dl.greeting li span {display:table-cell;}

	#container .company dl.info dd ul {border-top:1px solid #666; list-style:none;}
	#container .company dl.info ul ul {margin-top:10px; border:0;}
	#container .company dl.info dd > ul > li {width:100%; border-bottom:1px solid #efefef; display:table;}
	#container .company dl.info dd > ul > li span {padding:10px; color:#666; font-size:14px; box-sizing:border-box; vertical-align:middle; position:relative; display:table-cell;}
	#container .company dl.info dd > ul > li .title {width:80px; background-color:#f9f9f9;}
	/*#container .company dl.info dd > ul > li .title:before {width:41px; height:36px; margin-top:-18px; background-image:url('/new_haema/images/btn_icon/icon_element.png'); background-repeat:no-repeat; content:''; position:absolute; top:50%; left:20px; display:inline-block;}*/
	#container .company dl.info dd > ul > li ul + strong {margin-top:20px; display:inline-block;}
	#container .company dl.info dd > ul > li li {padding-left:10px; position:relative;}
	#container .company dl.info dd > ul > li li:before {font-size:11px; content:'-'; position:absolute; top:-2px; left:0; display:inline-block;}

	/* 회사개요 title icon */
	#container .company dl.info dd > ul > li:nth-of-type(1) .title:before {background-position:0 0;}
	#container .company dl.info dd > ul > li:nth-of-type(2) .title:before {background-position:-153px 0;}
	#container .company dl.info dd > ul > li:nth-of-type(3) .title:before {background-position:-51px 0;}
	#container .company dl.info dd > ul > li:nth-of-type(4) .title:before {background-position:-102px 0;}
	#container .company dl.info dd > ul > li:nth-of-type(5) .title:before {background-position:-204px 0;}
	#container .company dl.info dd > ul > li:nth-of-type(6) .title:before {background-position:0 -46px;}
	#container .company dl.info dd > ul > li:nth-of-type(7) .title:before {background-position:-51px -46px;}
	#container .company dl.info dd > ul > li:nth-of-type(8) .title:before {background-position:-102px -46px;}

	#container .company dl.history dd {border-bottom:1px dashed #c9c9c9;}
	#container .company dl.history dd + dt {margin-top:50px;}
	#container .company dl.history ul {margin-left:-20px; list-style:none;}
	#container .company dl.history ul:after {clear:both; content:''; display:block;}
	#container .company dl.history li {width:50%; margin-bottom:20px; padding-left:20px; box-sizing:border-box; float:left;}
	#container .company dl.history dd > ul > li:nth-of-type(3n + 1) {clear:left;}
	#container .company dl.history li p {margin:10px 0;}
	#container .company dl.history li p em {color:#7c7c7c; font-size:11px; font-family:'dotum'; font-style:normal; line-height:100%; display:block;}
	#container .company dl.moto dd p {padding:15px 0 10px; border:2px solid #3c3c3c; text-align:center;}
	#container .company dl.moto dd p strong {padding:10px 20px; font-size:22px; line-height:22px; position:relative; display:block;}

	#container .map_area {padding:10px; background-color:#333;}
	#container .map_area #map {height:450px; border:1px solid #1b1b1b;}
	#container .map_area #map div {z-index:0!important;}
    #container .map_area #map img {width:100%; height:100%; object-fit:cover;}
    #container .map_area p {margin:20px 0 0 20px; color:#fff;}
	#container .map_area .traffic {margin-top:10px; margin-bottom:5px; list-style:none;}
	#container .map_area .traffic:after {clear:both; content:''; display:block;}
	#container .map_area .traffic li {margin-top:20px; padding-left:50px; color:#fff; line-height:22px; box-sizing:border-box; position:relative;}
	#container .map_area .traffic li:before {width:16px; height:19px; background-image:url('/new_haema/images/btn_icon/icon_btn.png'); background-position:-100px -40px; background-repeat:no-repeat; content:''; position:absolute; top:0; left:20px;}
	#container .map_area .traffic li:nth-of-type(2):before {background-position:-130px -40px;}

	#container .business {position:relative;}
	#container .business h3 {margin-bottom:20px; font-size:20px; line-height:1.8; display:block;}
	#container .business p {color:#666; line-height:25px;}
	#container .business .thumb_list {margin-top:15px; margin-left:-20px; list-style:none;}
	#container .business .thumb_list:after {clear:both; content:''; display:block;}
	#container .business .thumb_list li {width:50%; margin-top:15px; padding-left:20px; box-sizing:border-box; float:left;}
	#container .business .thumb_list li span.thumb {height:150px; margin-bottom:15px; background-position:50%; background-size:cover; background-repeat:no-repeat; border:1px solid #f0f0f0; border-radius:5px; box-sizing:border-box; overflow:hidden; cursor:pointer; display:block;}
	#container .business .thumb_list li span.title {line-height:16px; white-space:nowrap; text-overflow:ellipsis; overflow:hidden; display:block;}
	#container .business .direction-nav {display:none;}

	#container .paging {margin:20px 0; text-align:center;}
	#container .paging a {width:25px; height:25px; margin:0 2px; color:#555; font-size:12px; font-family:'arial'; line-height:25px; border:1px solid #d7d7d7; box-sizing:border-box; text-align:center; vertical-align:middle; display:inline-block;}
	#container .paging a.on {color:#fff; background-color:#555; text-decoration:none !important; cursor:default;}
	#container .paging a:hover {text-decoration:underline;}
	#container .paging a.prev, #container .paging a.next {width:14px; height:27px; margin:0 5px; font-size:0; background-image:url('/new_haema/images/btn_icon/icon_btn.png'); background-position:0 0; background-size:75px auto; background-repeat:no-repeat; border:0;}
	#container .paging a.next {background-position:-19px 0;}

	#container .button_area {margin:20px 0;}

	.tab_area {width:100%; margin-bottom:20px; background-color:#fff; list-style:none; position:absolute; top:39px; z-index:1; display:none;}
	.tab_area.on {display:block;}
	.tab_area:after {clear:both; content:''; display:block;}
	.tab_area li {width:100% !important; border-bottom:1px solid #ccc; text-align:center;}
	.tab_area li a {padding:17px 0 15px; color:#888; font-size:17px; font-family:'NBG-Light'; border-bottom:1px solid transparent; display:block;}
	.tab_area li.on {border-color:#ed1b24;}
	.tab_area li.on a {color:#242424; border-color:#ed1b24;}
	.tab_area + span.selected {width:100% !important; margin-bottom:15px; background-color:#fff; border:1px solid #ccc; text-align:center; display:block;}
	.tab_area + span.selected a {padding:12px 0 10px; color:#888; font-size:17px; font-family:'NBG-Light'; border-bottom:1px solid transparent; display:block;}

	.tab_content {display:none;}
	.tab_content.on {display:block;}

	.board_write strong.title {margin:10px 0 20px 0; padding:0 20px; display:block;}
	.board_write strong.title input {padding:20px 0; font-size:18px; line-height:100%; border-bottom:1px solid #ddd; box-sizing:border-box; display:block;}
	.board_write ul:after {clear:both; content:''; display:block;}
	.board_write ul > li {margin-top:10px; padding:10px 20px;}
	.board_write ul > li span {width:100px; font-size:12px; position:absolute; top:20px; left:20px;}
	.board_write ul > li input {width:100%; height:40px; font-size:16px; display:block;}
	.board_write .text_area {height:200px; margin-top:20px; padding:0 20px;}
	.board_write .text_area textarea {padding:20px;}
	.board_write .file {margin:30px 20px 0; padding:10px 0; box-sizing:border-box; position:relative;}
	.board_write .file:before {margin-bottom:10px; line-height:30px; background-color:#c7c7c7; text-align:center; vertical-align:middle; content:'첨부파일'; display:block;}

	.board_list .list_header span {padding:15px 5px; font-size:12px;}
	.board_list ul.list li span {padding:20px 5px; font-size:12px;}

	/* list column width */
	.board_list span.no {width:40px;}
	.board_list span.writer {width:80px;}
	.board_list span.date {width:80px;}
	.board_list span.hit {display:none !important;}

	.board_view {border-bottom:1px solid #d7d7d7;}
	.board_view strong.title {padding-top:20px; font-size:26px; line-height:1.3; position:relative; display:block;}
	.board_view strong.title:before {width:50px; border:1px solid #cd0000; content:''; position:absolute; top:0; left:0; display:block;}
	.board_view .wirte_info {margin-top:15px; font-size:13px; text-align:right;}
	.board_view .wirte_info:after {clear:both; content:''; display:block;}
	.board_view .wirte_info span {margin-left:15px; display:inline-block;}
	.board_view .wirte_info span.writer {float:left;}
	.board_view .wirte_info span.hit {display:none;}
	.board_view .view_wrap {margin-top:20px; padding:20px 10px; border-top:1px solid #d7d7d7;}
	.board_view .view_wrap pre {line-height:1.5; white-space:pre-wrap}
	.board_view .file {height:35px; padding:8px 0 8px 100px; border-top:1px solid #d7d7d7; box-sizing:border-box; position:relative;}
	.board_view .file:before {width:80px; font-size:12px; line-height:35px; background-color:#c7c7c7; text-align:center; vertical-align:middle; content:'첨부파일'; position:absolute; top:0; bottom:0; left:0;}
	.board_view .file a {color:#333;}
	.board_view img {max-width:100%;}

	#layerThumb {background-color:rgba(0,0,0,0.8); position:fixed; top:0; right:0; bottom:0; left:0; z-index:99999;}
	#layerThumb .close {width:25px; height:25px; font-size:0; background-image:url('/new_haema/images/btn_icon/icon_btn.png'); background-position:-80px 0; box-sizing:border-box; position:absolute; top:7px; right:20px; display:block;}
	#layerThumb .popContainer {max-width:96%; margin-left:-48%; padding:40px 20px 10px 20px; background-color:#222; box-sizing:border-box; text-align:center; position:absolute; left:50%;}
	#layerThumb .popContainer img {max-width:100%; max-height:100%;}
	#layerThumb .popContainer span.title {margin-top:10px; color:#fff; display:inline-block;}
}