<html><head><meta name="color-scheme" content="light dark"></head><body><pre style="word-wrap: break-word; white-space: pre-wrap;">@charset "utf-8";

.boardTop { overflow:hidden; text-align:right;}
.boardTop:after { content:""; display:block; clear:both;}
.boardTop .boardInfo { float:left; padding-top:15px;}
.boardTop .boardInfo i { font-weight:bold; color:#e33333}
.boardTop .boardSearch { float:right; margin-bottom:10px;}
.boardTop .boardSearch input[type="text"] { border-radius:5px; height:35px; box-sizing:border-box;}
.boardTop .boardSearch input[type="text"] + input[type="submit"],
.boardTop .boardSearch input[type="text"] + input[type="button"] { border-radius:0 5px 5px 0 ; border-right:none; margin-left:-10px;}

.boardTop .boardSearchBox					{ float: right; }
.boardTop .boardSearchBox .boardSearch		{ float: left; margin-right: 0; margin-left: 10px; }
.boardTop .boardSearchBox .boardSearch.datetime div					{ float: left; position: relative; }
.boardTop .boardSearchBox .boardSearch.datetime div input			{ box-sizing: border-box; border-right: 1px solid #d3d6db; border-radius: 5px; }
.boardTop .boardSearchBox .boardSearch.datetime &gt; div + div	{ padding-left: 20px; }
.boardTop .boardSearchBox .boardSearch.datetime &gt; div + div:before	{ content: "~"; position: absolute; left: 6px; line-height: 30px; }

.ocean_boradtd_img{width:90px; height:60px;}

/* form */
input[type="text"], input[type="password"], input[type="email"], input[type="number"], input[type="search"], input[type="tel"], textarea, select
{ font-family:'Nanum Gothic', '나눔고딕','Dotum', '돋움', 'Montserrat', 'Arial', 'sans-serif';}
input[type="text"], input[type="password"], input[type="email"], input[type="number"], input[type="search"], input[type="tel"], textarea { border:1px solid #d3d6db; border-radius:5px; vertical-align:middle; }
input[type="text"], input[type="password"], input[type="email"], input[type="number"], input[type="search"], input[type="tel"] { height:auto; padding:9px 5px ;}
input[type="file"] { display:inline-block; height:23px; padding:5px; border:1px solid #cccfd5; border-radius:5px; vertical-align:middle; background:#fff}
input[type="radio"], input[type="checkbox"] { margin:5px;}
input[type="radio"]:first-child, input[type="checkbox"]:first-child { margin-left:0;}
input[type="radio"] + label, input[type="checkbox"] + label { margin-right:15px;}
textarea { padding:10px;}
select { display:inline-block; height:35px; /*padding:5px;*/ border:1px solid #cccfd5; border-radius:5px; vertical-align:middle;}
.select_w {width: 12%; min-width: 80px;}

/* Button Size */
.button.small { height: 26px; /*padding:0 12px;*/ line-height: 26px; font-size: 12px;}
.button.medium { height: 35px; /*padding: 0 15px;*/ line-height:35px; font-size:13px;}
.en_button{position:relative; overflow: visible; display:-moz-inline-stack; display:inline-block; margin-bottom:2px;/* margin:0 2px; */ padding:0; vertical-align: top;  white-space: nowrap; text-decoration:none;  border-radius: 5px; color:#fff; background-color:#4a4f5a; border:1px solid #474a52; border-width:0 1px 1px 0; font-family:'Nanum Gothic', '나눔고딕','Dotum', '돋움', 'Montserrat', 'Arial', 'sans-serif'; cursor:pointer}
.button.en_medium{ height: 52px; padding:5px 35px 0 35px; line-height:40px; font-size:13px; display:inline-block;}
.button.large { height: 40px; padding:0 15px; line-height:40px; font-size:14px;}

/* Gallery 전시(Display) */
.boardExhGallery { width:100%; border-top:3px solid #61646c; border-bottom:1px solid #93969c;}
.boardExhGallery li { min-height:242px; padding:20px; border-top:1px solid #bdbdbd; overflow: hidden;}
.boardExhGallery li:first-child { border-top:none;}
.boardExhGallery li:hover { background:#f9f9f9;}
.boardExhGallery .egImg { float:left; width:160px; }
.boardExhGallery .egImg img { max-width:100%; border:1px solid #ddd}
.boardExhGallery .egCont { margin-left:180px;}
.boardExhGallery .egCont p.title { margin:5px 0 10px; font-size:16px; font-weight:bold; color:#000; white-space:nowrap; text-overflow:ellipsis; overflow:hidden}
.boardExhGallery .egCont dl.cont { overflow:hidden;}
.boardExhGallery .egCont p.title + dl.cont,
.boardExhGallery .egCont dl.cont:first-child { padding-bottom:15px; margin-bottom:15px; border-bottom:1px dashed #ddd;}
.boardExhGallery .egCont dl.cont &gt; dt { font-weight:bold; color:#000;}
.boardExhGallery .egCont dl.cont &gt; dt:before { content:""; display:inline-block; width:5px; height:2px; margin:0 3px 4px 0; background:#777;}
.boardExhGallery .egCont p.title + dl.cont &gt; dt { float:left; padding-right:15px; margin-right:15px; background:url(/resource/img/common/board/d_line.gif) no-repeat right 7px;  }
.boardExhGallery .egCont dl.cont &gt; dt,
.boardExhGallery .egCont dl.cont &gt; dd { padding:3px 0;}
.boardExhGallery .egCont dl.cont + dl.cont &gt; dd {padding:0 9px;}
.boardExhGallery .egImg img { width:100%; }

/* Board : List */
.boardTop { overflow:hidden; text-align:right;}
.boardTop:after { content:""; display:block; clear:both;}
.boardTop .boardInfo { float:left; padding-top:15px;}
.boardTop .boardInfo i { font-weight:bold; color:#e33333}
.boardTop .boardSearch { float:right; margin-bottom:10px;}
.boardTop .boardSearch input[type="text"] { border-radius:5px; height:35px; box-sizing:border-box;}
/*.boardTop .boardSearch input[type="text"] + input[type="submit"],
.boardTop .boardSearch input[type="text"] + input[type="button"] { border-radius:0 5px 5px 0 ; border-right:none; margin-left:-5px;}*/

.boardTop .boardSearchBox					{ float: right; }
.boardTop .boardSearchBox .boardSearch		{ float: left; margin-right: 0; margin-left: 10px; }
.boardTop .boardSearchBox .boardSearch.datetime div					{ float: left; position: relative; }
.boardTop .boardSearchBox .boardSearch.datetime div input			{ box-sizing: border-box; border-right: 1px solid #d3d6db; border-radius: 5px; }
.boardTop .boardSearchBox .boardSearch.datetime &gt; div + div	{ padding-left: 20px; }
.boardTop .boardSearchBox .boardSearch.datetime &gt; div + div:before	{ content: "~"; position: absolute; left: 6px; line-height: 30px; }
.boardList { width: 100%; margin-top:10px; border:0; border-spacing:0; border-collapse:separate; border-top:3px solid #61646c;}
.boardList caption { position: absolute; z-index: -10; top: 0; left: 0;width: 1px; height: 1px; overflow: hidden; }
.boardList th, .boardList td { padding:15px 5px 13px; border-bottom:1px solid #cccfd5;}
.boardList thead th { background:url(/resource/img/common/board/line_th.gif) no-repeat 0 50% #f6f6f7; border-bottom:1px solid #61646c; }
.boardList thead th:first-child { background-image:none;}
.boardList tbody td { text-align:center}
.boardList tbody td.txt_list{text-align:left;}
.boardList tbody td:nth-child(2) { text-align:left}
.boardList tbody td.title { text-align:left}
.boardList tr:hover td, .boardList tr:focus td { background:#fafafb;}

.boardList td .type-ico				{ display: inline-block; position: relative; width: 20px; height: 20px; text-indent: -999px; overflow: hidden; }
.boardList td .type-ico:before		{ display: block; width: 100%; text-align: center; text-indent: 0; font-family: 'icon'; }
.boardList td .type-ico.s001:before	{ content: "\e990"; }
.boardList td .type-ico.s002:before	{ content: "\e98f"; }

/* Board : View */
.boardView { width:100%; margin-top:10px; border-top:3px solid #61646c; border-bottom:1px solid #61646c;}
.boardView .titleArea { position:relative; padding:20px; background:#f6f6f7; border-bottom:1px solid #61646c;}
.boardView .titleArea .title { font-size:1.3em; font-weight:bold; color:#333}
.boardView .titleArea .boardDate { margin-top:15px; color:#666;}
.boardView .titleArea .boardDate .view {  padding-left:30px; background:url(/resource/img/common/board/icon_view.png) no-repeat 8px 1px;}
.boardView .infoArea { overflow:hidden; border-bottom:1px solid #cccfd5;}
.boardView .infoArea li { float:left; width:50%; padding:10px 0; border-bottom:1px solid #cccfd5;}
.boardView .infoArea li span { display:table-cell; margin-right:15px; padding:0 15px;}
.boardView .infoArea li span:first-child { min-width:50px; font-weight:bold; border-right:1px solid #cccfd5; color:#333}
.boardView .infoArea li.last { width:100%;}

.boardView .infoArea2 { overflow:hidden; border-bottom:1px solid #cccfd5;}
.boardView .infoArea2 li { padding:10px 0; border-bottom:1px solid #cccfd5;}
.boardView .infoArea2 li span { display:table-cell; margin-right:15px; padding:0 15px;}
.boardView .infoArea2 li span:first-child { min-width:50px; font-weight:bold; border-right:1px solid #cccfd5; color:#333}

.boardView .articleArea { padding:20px; /* border-bottom:1px solid #61646c; */}
.boardView .listArea li { border-top:1px solid #cccfd5; }
/*
.boardView .listArea li:first-child { border-top:1px solid #cccfd5;}
*/
.boardView .listArea li a { display:table-cell; padding:15px 15px 13px;}
.boardView .listArea li span { display:table-cell; width:100px; padding:15px 15px 13px 20px; text-align:center; font-weight:bold; background:url(/resource/img/common/board/icon_link_list.png) no-repeat 5px -85px #f5f5f5;}
.boardView .listArea li:first-child span { background-position: 5px 14px;}

/* Board : View */
.boardView2 { width:100%; margin-top:10px; border-top:3px solid #61646c; border-bottom:1px solid #61646c;}
.boardView2 .titleArea { position:relative; padding:20px; background:#f6f6f7; border-bottom:1px solid #61646c;}
.boardView2 .titleArea .title { font-size:1.3em; font-weight:bold; color:#333}
.boardView2 .titleArea .title + p { padding-top:5px; font-size:1.1em; font-weight:bold; color:#666}

.viewInfo { padding:10px 20px; border-top:1px dashed #cccfd5; }
.viewInfo li { padding:5px 0 5px 6px; }
.viewInfo li:before { content:""; display:inline-block; width:2px; height:2px; margin:0 3px 3px -6px; background:#6c6e72; vertical-align:middle}

.boardView2 .articleArea { padding:20px;;}
.boardView2 .articleArea img{ height:auto;}
.boardTag { margin:15px 20px 0;}
.boardTag i { position:relative; padding:5px 10px; border-radius:5px; margin-right:10px; color:#fff; font-weight:bold; background:#db3a0f;}
.boardTag i:after { position:absolute; top:50%; right:-10px; margin-top:-5px; content:""; display:block; width: 0; height: 0; margin-right:5px;
border-top: 4px solid transparent; border-bottom: 4px solid transparent; border-left: 5px solid #db3a0f; }

.exhContWrap { overflow:hidden; }
.exhContWrap .egImg_view { width:230px; height:250px; float:left; margin-right:1.5em;overflow: hidden; margin-bottom: 20px; }
.exhContWrap .egImg_view img { width:100%; float:left; }
.exhContWrap .exhCont { width:100%; }
.exhCont { display:table; border:1px solid #525947; border-bottom:0; }
.exhCont dt { border-right:1px solid #525947; display:table-cell; width:100px; background:#647D39; padding:12px 8px; font-weight:bold; color:#fff; }
.exhCont dd {  display:table-cell; width:300px; padding:5px 8px; }
.exhCont:last-child dt, .exhCont:last-child dd { border-bottom:1px solid #525947; }
.exhContWrap .exhContText { float:left; width:70%; }

/* Gallery */
.boardGallery, .boardGallery * { box-sizing:border-box;}
.boardGallery {  width:100%; overflow:hidden; padding:30px 0; margin-top:10px; border-top:3px solid #61646c; border-bottom:1px solid #93969c;}
.boardGallery &gt; div { float:left; width:23%; margin:1%; padding:10px 10px 15px; border:1px solid #b7b8be;}
.boardGallery &gt; div:first-child { _margin-left:0;}
.boardGallery .gImg { position: relative; overflow:hidden; width:100%; height:0px; padding-bottom:68%;}
.boardGallery .gImg img { position: absolute; top:0; left:0; width:100%; height:auto; border:1px solid #ddd; }
.boardGallery .gCont { overflow:hidden;}
.boardGallery .gCont .bTitle { margin:8px 0; font-size:14px; font-weight:bold; color:#000; white-space:nowrap; text-overflow:ellipsis; overflow:hidden;}
/* .boardGallery .gCont .bName {} */
.boardGallery .gCont .bDate { float:right; font-size:12px;}

.boardTextGallery { margin-top:10px; border-top:3px solid #61646c; border-bottom:1px solid #93969c;}
.boardTextGallery &gt; ul &gt; li { border-top:1px dashed #bdbdbd; }
.boardTextGallery &gt; ul &gt; li:after { content:""; display:block; clear:both;}
.boardTextGallery &gt; ul &gt; li:first-child { border-top:none;}
.boardTextGallery &gt; ul &gt; li:hover { background:#f9f9f9;}
.boardTextGallery a { text-decoration:none;}
.boardTextGallery &gt; ul &gt; li &gt; a { overflow:hidden; display:block; padding:20px }
.boardTextGallery .tgImg { overflow:hidden; float:left; max-width:220px; min-height:146px; margin-right:20px; }
.boardTextGallery .tgImg img { width:100%; height:inherit;}
.boardTextGallery .tgCont { box-sizing:border-box; }
.boardTextGallery .tgCont .bTitle { margin-bottom:5px; font-size:16px; font-weight:bold; color:#000; white-space:nowrap; text-overflow:ellipsis; overflow:hidden}
.boardTextGallery .tgCont .sTitle { font-weight:bold;  color:#000; white-space:nowrap; text-overflow:ellipsis; overflow:hidden}
.boardTextGallery .tgCont span { display:inline-block; padding-left:10px; margin-right:10px; font-size:12px; background:url(/resource/img/common/board/d_line.gif) no-repeat 0 4px; }
.boardTextGallery .tgCont span.bName { padding:0; font-weight:bold; background:none}
.boardTextGallery .tgCont .tgTxt { margin:10px 0 5px; }

.boardTextGallery2 { margin-top:10px; border-top:3px solid #61646c; border-bottom:1px solid #93969c;}
.boardTextGallery2 &gt; div { padding:20px; border-top:1px dashed #bdbdbd}
.boardTextGallery2 &gt; div:first-child { border-top:none;}
.boardTextGallery2 p { overflow:hidden; margin-bottom:10px; font-size:16px; line-height:28px; font-weight:bold; color:#000; }
.boardTextGallery2 p a { float:right; margin-left:10px; }
.boardTextGallery2 .gListBlock { overflow:hidden;}
.boardTextGallery2 .gListBlock:after { content:""; display:block; clear:both;}
.boardTextGallery2 .gListBlock:first-child { border-top:none;}
.boardTextGallery2 .gListBlock .tgImg { overflow:hidden; float:left; max-width:160px; }
.boardTextGallery2 .gListBlock .tgImg img { width:100%; height:inherit;}
.boardTextGallery2 .gListBlock .tgCont { margin-left:180px; box-sizing:border-box }
.boardTextGallery2 .gListBlock .tgCont li { overflow:hidden; padding-bottom:5px; _line-height:23px;}
.boardTextGallery2 .gListBlock .tgCont li a { display:block; float:left; width:65%; white-space:nowrap; text-overflow:ellipsis; overflow:hidden}
.boardTextGallery2 .gListBlock .tgCont li a:before { content:""; display:inline-block; width:5px; height:2px; margin:0 3px 4px 0; background:#777;}
.boardTextGallery2 .gListBlock .tgCont li span { float:right; font-size:12px; color:#777}
.boardTextGallery2 .gListBlock .tgCont li span i { padding-right:12px; margin-right:10px; background:url(/resource/img/common/board/d_line.gif) no-repeat right 3px;}

.boardTextGallery3 { width:100%; margin-top:10px; border-top:3px solid #61646c; border-bottom:1px solid #93969c;}
.boardTextGallery3 li { min-height:180px; padding:20px; border-top:1px solid #bdbdbd; overflow: hidden;}
.boardTextGallery3 li:first-child { border-top:none;}
.boardTextGallery3 li:hover { background:#f9f9f9;}
.boardTextGallery3 .egImg { float:left; width:160px;}
.boardTextGallery3 .egImg img { max-width:100%; border:1px solid #ddd}
.boardTextGallery3 .egCont { margin-left:180px;}
.boardTextGallery3 .egCont p.title { margin:5px 0 10px; font-size:16px; font-weight:bold; color:#000; white-space:nowrap; text-overflow:ellipsis; overflow:hidden}
.boardTextGallery3 .egCont dl { overflow:hidden;}
.boardTextGallery3 .egCont dt { float:left; padding: 3px 15px 3px 0; width:20%;  font-weight:bold; color:#000; background:url(/resource/img/common/board/d_line.gif) no-repeat right 8px; font-weight:bold; color:#000; box-sizing:border-box;}
.boardTextGallery3 .egCont dd { padding:3px 0 3px 22%; box-sizing:border-box;}
.boardTextGallery3 .egCont dt:before { content:""; display:inline-block; width:5px; height:2px; margin:0 3px 4px 0; background:#777;}
.boardTextGallery3 .egCont dd:after { content:""; display:block; clear:both;}

.boardTextGallery4 { width:100%; margin-top:10px; border-top:3px solid #61646c; border-bottom:1px solid #93969c;}
.boardTextGallery4 li { min-height:180px; padding:20px; border-top:1px solid #bdbdbd; overflow: hidden;}
.boardTextGallery4 li:first-child { border-top:none;}
.boardTextGallery4 li:hover { /**background:#f9f9f9;**/ }
.boardTextGallery4 .egImg { float:left; width:160px; margin-top:5px;}
.boardTextGallery4 .egImg img { max-width:100%; border:1px solid #ddd}
.boardTextGallery4 .egCont { }
.boardTextGallery4 .egCont p.title { margin:5px 0 10px; font-size:16px; font-weight:bold; color:#FFBB00; }
.boardTextGallery4 .egCont dl { overflow:hidden;}
.boardTextGallery4 .egCont dt { float:left; padding: 3px 15px 3px 0; width:20%;  font-weight:bold; color:#000; background:url(/resource/img/common/board/d_line.gif) no-repeat right 8px; font-weight:bold; color:#000; box-sizing:border-box;}
.boardTextGallery4 .egCont dd { padding:3px 0 3px 40px; box-sizing:border-box;}
.boardTextGallery4 .egCont dt:before { content:""; display:inline-block; width:5px; height:2px; margin:0 3px 4px 0; background:#777;}
.boardTextGallery4 .egCont dd:after { content:""; display:block; clear:both;}

.boardTextGallery .tgImg { width:200px; height:150px; float:left; }
.boardTextGallery .tgImg img { width:100%; height:100%; }
.boardTextGallery .tgCont { float:left; }
.boardTextGallery li { overflow:hidden; }
.exhCont p { font-weight:bold; }
.exhContWrap .exhCont.view { width:100%; }
.exhContWrap .exhCont.view dd { padding-bottom:9px; line-height:20px; }

/* 보건환경 life */
.boardTextGalleryseWrap {border-top:2px solid #4c6fad; padding:20px 0; border-bottom:1px solid #ddd;}
.boardTextGalleryseWrap ul li {padding: 20px 0 70px 0; border-bottom:1px solid #ddd; position:relative;}
.boardTextGalleryseWrap ul li:last-child {border-bottom:0;}
.boardTextGalleryseWrap ul li .item {display:block; width:100%; height:100%;}
.boardTextGalleryseWrap ul li .item:after {content:""; clear:both; display:block;}
.boardTextGalleryseWrap ul li .item .tgImg {float:left; width:260px; max-height:220px; overflow:hidden;}
.boardTextGalleryseWrap ul li .item .tgImg img {width:100%; max-height:180px;}
.boardTextGalleryseWrap ul li .item .tgCont {float: left; width: calc(100% - 320px); height:100%; padding-left:20px; position: relative;}
.boardTextGalleryseWrap ul li.noImg .item .tgCont {width:100%; padding-left:0;}
.boardTextGalleryseWrap ul li .item .tgCont .bTitle {font-size:18px; font-weight:bold; line-height:1.2; overflow:hidden; text-overflow: ellipsis; white-space:nowrap; margin-bottom:10px;}
.boardTextGalleryseWrap ul li .item .tgCont .tgTxt {line-height:1.5;}
.boardTextGalleryseWrap ul li .item .tgCont .tgTxt .writer { font-size:16px; margin-bottom:15px; color:#666;}
.boardTextGalleryseWrap ul li .item .tgCont .tgTxt .writer span {font-weight:bold;}
.boardTextGalleryseWrap ul li .item .tgCont .tgTxt .writer span:after {content:""; display:inline-block; width:1px; height:14px; margin:0 15px; background:#999; vertical-align: middle;}
.boardTextGalleryseWrap ul li .inkBtn {position:absolute; right:20px; bottom:20px;}


/* 파일첨부 */
.fileInfo { overflow:hidden; margin-top:10px; padding:8px; border:3px solid #ccd4e4;}
.fileInfo li { float:right}
.fileInfo li:first-child { float:left; padding-top:5px; word-break:break-all;}
.fileList { width:100%; margin-top:10px; border-bottom:1px solid #8e919a;}
.fileList th,
.fileList td { height:30px; padding:9px 10px 8px; text-align:center;}
.fileList td { border-top: 1px solid #d7d7d7; }
.fileList tr:first-child td { border:none; }
.fileList th { background:#6faf09; color:#fff; }
.srcoll-table { /*clear:both;*/ }

/*유물검색*/
.boardTop .boardSearchBox .datearea { float:left; }
.boardTextGallery3 { width:100%; margin-top:10px; border-top:3px solid #61646c; border-bottom:1px solid #93969c;}
.boardTextGallery3 li { min-height:180px; padding:20px; border-top:1px solid #bdbdbd; overflow: hidden;}
.boardTextGallery3 li:first-child { border-top:none;}
.boardTextGallery3 li:hover { background:#f9f9f9;}
.boardTextGallery3 .egImg { float:left; width:160px;}
.boardTextGallery3 .egImg img { max-width:100%; border:1px solid #ddd}
.boardTextGallery3 .egCont { margin-left:180px;}
.boardTextGallery3 .egCont p.title { margin:5px 0 10px; font-size:16px; font-weight:bold; color:#000; white-space:nowrap; text-overflow:ellipsis; overflow:hidden}
.boardTextGallery3 .egCont dl { overflow:hidden;}
.boardTextGallery3 .egCont dt { float:left; padding: 3px 15px 3px 0; width:20%;  font-weight:bold; color:#000; background:url(/resource/img/common/board/d_line.gif) no-repeat right 8px; font-weight:bold; color:#000; box-sizing:border-box;}
.boardTextGallery3 .egCont dd { padding:3px 0 3px 22%; box-sizing:border-box;}
.boardTextGallery3 .egCont dt:before { content:""; display:inline-block; width:5px; height:2px; margin:0 3px 4px 0; background:#777;}
.boardTextGallery3 .egCont dd:after { content:""; display:block; clear:both;}
.boardTop .boardSearchBox select { padding:5px 25px 5px 5px; }
.boardTextGallery3 .egImg img { width: 100%; height: 100%; }

/* Common */
.bs-board			{ position: relative; margin: 0 auto; overflow: hidden; }
.bs-board h4		{ font-size: 1.2em; margin-bottom: 20px; }

.bs-form-box			{ position: relative; margin: 0 auto; overflow: hidden; margin-bottom: 10px; border-top: 3px solid #61646c; }
.bs-form-box dl			{ display: block; position: static; height: 100%; border-bottom-style: solid; border-bottom-width: 0px;}
.bs-form-box dt			{ padding: 10px 20px; box-sizing: border-box; }
.bs-form-box dd			{ padding: 10px; box-sizing: border-box; min-height: 40px; }

.bs-form-box dt			{ position: absolute; top: 0; bottom: 0; width: 150px; color: #000; }
.bs-form-box dd			{ margin-left: 150px; overflow: hidden; }

.bs-form-box dd input,
.bs-form-box dd textarea,
.bs-form-box dd select	{ max-width: 100%; box-sizing: border-box; }
.bs-form-box dd input[type="text"],
.bs-form-box dd input[type="number"],
.bs-form-box dd input[type="email"],
.bs-form-box dd input[type="password"],
.bs-form-box dd select,
.bs-form-box dd textarea	{ width: 100%; }
.bs-form-box dd label	{ cursor: pointer; }
.bs-form-box dd div		{ display: block; float: left; margin-right:1.5em; }
.bs-form-box dd legend	{ display: block; position: absolute; top: -5px; left: -5px; width: 1px; height: 1px; overflow: hidden; }

.bs-form-box fieldset	{ display: inline; position: static; }
.bs-form-box .form-group		{ position: relative; clear: both; border-bottom-style: solid; border-bottom-width: 1px; }
.bs-form-box .form-group:after	{ content: ""; display: block; position: relative; clear: both; }

.bs-view dt			{  }
.bs-view dl.form-data-subject,
.bs-view dl.form-data-content			{ border-bottom-width: 1px; border-bottom-color: #61646c; }
.bs-view dl.form-data-subject dt,
.bs-view dl.form-data-content dt		{ position: absolute !important; width: 1px; height: 1px; left: -999px; }
.bs-view dl.form-data-subject dd,
.bs-view dl.form-data-content dd		{ margin: 0; }
.bs-view dl.form-data-content dd		{ padding: 40px 10px; }
.bs-view dl.form-data-subject			{ background: #f6f6f7; padding-bottom: 10px; }
.bs-view dl.form-data-subject h5		{ font-size: 110%; clear: both; margin: 10px 0; }
.bs-view dl.form-data-subject p			{ float: left; margin-right: 15px; color: #666666; }
.bs-view dl.form-data-subject p.date-text strong	{ display: block; position: absolute; width: 1px; height: 1px; overflow: hidden; top: -999px; left: -999px; }
.bs-view dl.form-data-subject p.hit-text strong	{ display: block; float: left; width: 21px; height: 21px; margin-right: 8px; overflow: hidden; text-indent: -999px; background: url('../img/common/icon_view.png') no-repeat 50% 50%;  }

.bs-view .form-group		{ border-bottom-color: #cccfd5; }
.bs-view dl					{ border-bottom-color: #cccfd5; }
.bs-view dt:after			{ content: ""; display: block; position: absolute; right: 0; top: 10px; bottom: 10px; width: 1px; border-right: 1px solid #cccfd5; }
.bs-view dt					{ color: #333333; font-weight: bold; }
.bs-view dd					{ color: #555; min-height: 40px; }

/** Type Layout */
.bs-form-box dl							{ width: 50%; float: left; }
.bs-form-box dl.form-data-subject,
.bs-form-box dl.form-type-B,
.bs-form-box dl.form-str-addss				{ width: 100%; clear: both; }
.bs-form-box dl.form-str-integer input		{ text-align: right; }
.bs-form-box dl.form-str-addss dd			{ padding-right: 100px; }
.bs-form-box dl.form-str-addss dd button	{ position: absolute; right: 10px; top: 10px; height: 38px; }
.bs-form-box dl.form-data-content textarea	{ height: 400px; }

/* 텍스트 banner Gallery */
.bannerGallery, .bannerGallery * { box-sizing:border-box;}
.bannerGallery {  width:100%; overflow:hidden; padding:30px 0; margin-top:10px; border-top:3px solid #61646c; border-bottom:1px solid #93969c;}
.bannerGallery &gt; div { float:left; width:48%; margin:1%; }
.bannerGallery .gImg { position: relative; overflow:hidden; width:100%; height:0px; padding-bottom:30%;}
.bannerGallery .gImg img { position: absolute; top:0; left:0; width:100%; height:auto; border:1px solid #ddd; }
.bannerGallery .gCont { overflow:hidden; margin-bottom:4px;}
.bannerGallery .gCont .bTitle { margin-top:8px; font-size:14px; font-weight:bold; color:#000; white-space:nowrap; text-overflow:ellipsis; overflow:hidden;}
.bannerGallery .gCont .bDate { padding-left:15px;font-size:12px;}
.bannderWrap .bannerimg_view a { display: inline-block; }
.bannderWrap .bannerimg_view { width:95%; margin:0 auto; display:table; }
.bannerGallery .gImg img { transition:all 0.5s; }
.bannerGallery .gImg img:hover { box-shadow:0 5px 15px #acacac; }

.calendarTit {font-size:2.0em; position:relative; margin:0 auto; text-align:center; margin-bottom:25px; }
.calendarTit .bx-prev {left:0px; background:url(../img/common/ico_controls.png) no-repeat 0 0px; }
.calendarTit .bx-next {right:0px; background:url(../img/common/ico_controls.png) no-repeat -114px 0px; }
.calendarTit .bx-prev, .calendarTit .bx-next {position: absolute;top:50%;margin-top:-17.5px;text-indent: -9999px; width:45px; height:35px; }
.calendarTable { color:#c4c4c4; font-weight:bold; width:100%; font-size:16px; width:100%; border-collapse:collapse; border-spacing:0; table-layout:fixed; }
.calendarTable th { color:#333; border-bottom:1px solid #ddd; padding:15px 0; background:#eee; border-right:1px solid #ddd; border-bottom:1px solid #ddd; }
.calendarTable td { color:#bdbdbd; text-align:left; padding:5px; position:relative; height:150px; border-right:1px solid #ddd; border-bottom:1px solid #ddd; vertical-align:top; }
.calendarTable td a { display:inline-block; display: block; }
.calendarTable td .cal_day { color:#333; padding:10px 0 10px 11px; display:block; }
.calendarTable td .cal_day.before { color:#aaa; }
.calendarTable td .cal_top_add { font-size:11px; color:#fff; background:#657199; width:15px; height:15px; border-radius:10px; letter-spacing:-1px; position:absolute; top:15px; right:5px; cursor:pointer; padding:2px; }
.calendarTable td .cal_mid { color:#333; padding:0px 0 7px 0; font-size:0.8em; overflow:hidden; }
.calendarTable td .cal_bor_last { border-right:0; }
.cal-devide{ padding:0 3px; }
.list-board-wrap {width:100%;overflow-x:auto;}
.list-board-wrap .edu-map iframe{width:100%;height: 350px;}
select.selectForm.selectDate { max-width:100%; height:2.857em; font-weight:bold; font-size:0.5em; height: 2.5em;}
.calendarTable { border-left:1px solid #ddd; border-top:2px solid #2f5883;}
.calendarTable.center th.sun, .calendarTable td a.sun { color:#e1494f; }
.calendarTable.center th.sat, .calendarTable td a.sat { color:#417ed1; }
.calendarTableWrap .icoCircle { width:7px; height:7px; background:#2f5883; border-radius:10px; display:inline-block; margin:5px 5px 0 0; float:left; }
.calendarTableWrap .cal_work { display:inline-block; float:left; width:88px; text-overflow:ellipsis; overflow:hidden; /* white-space:nowrap; */ word-wrap:break-word; }
.calendarTableWrap .todayon { background:url(../img/common/bg_todayon.png) no-repeat 0px 5px; }
.calendarTable td .cal_day.todayon { color:#fff; }
.td_scrollX { overflow-x:auto; height:115px; }

/*전시관 미리보기*/
.conL .flexslider .flex-direction-nav { position:relative; }
.conL .flexslider .flex-direction-nav .flex-prev, .conL .flexslider .flex-direction-nav .flex-next { position:absolute; z-index:5; top:50%; width:23px; height:42px; overflow:hidden; background:url('../../assets/img/main/sp_ico_slider.png') no-repeat 0 0; text-indent:-9999px; }
.conL .flexslider .flex-direction-nav .flex-prev { left:5px; top:200px; }
.conL .flexslider .flex-direction-nav .flex-next { right:5px; top:200px; background-position:-40px 0; }

/* 소장품검색 */
.tobox_button1 { position:relative; display:block; height: 22px; overflow:hidden; padding:0.3em 2.2em 0.4em 2.2em; margin-bottom:5px; border-radius:8px; background:#fff; border:1px solid #bdc3d9; font-size: 16px; font-weight: bold; color:#333; font-family:'Nanum Gothic', '나눔고딕','Dotum', '돋움', 'Montserrat', 'Arial', 'sans-serif';}
.tobox_button2 { overflow:hidden; padding:0.4em 1em 0.4em 1em;  border-radius:5px; background:#828fb7; font-size: 17px; color:#fff; font-family:'Nanum Gothic', '나눔고딕','Dotum', '돋움', 'Montserrat', 'Arial', 'sans-serif';}
.tobox_button3 { overflow:hidden; padding:0.4em 1em 0.4em 1em; margin-bottom:2px; border-radius:5px; background:#77a1bd; font-size: 17px; color:#fff; font-family:'Nanum Gothic', '나눔고딕','Dotum', '돋움', 'Montserrat', 'Arial', 'sans-serif';}
.tobox_button4 { overflow:hidden; padding:0.4em 1em 0.4em 1em; margin-bottom:2px; border-radius:5px; background:#81aeb6; font-size: 17px; color:#fff; font-family:'Nanum Gothic', '나눔고딕','Dotum', '돋움', 'Montserrat', 'Arial', 'sans-serif';}
.tobox01{position:relative; overflow:hidden;}
.tobox01 .area01{text-align:left; margin:0em 0.3em 0em 0em; }
.tobox02{width:100%; position:relative; overflow:hidden; border:1px solid #eee; border-width:0 0 1px 0; padding:0.5em 0em 0.5em 0em;}
.tobox03{width:100%; position:relative; overflow:hidden; padding:0.5em 0em 0.5em 0em;}
.area01{text-align:left; float:left; margin:0.3em 0em 0em 0em;}
.area02{text-align:left; float:left;  width:90%; }
.text02{text-align:left; float:left; padding:0.5em 0em 0.2em 2em; width:120px;}
.toFac {border: 2px solid #eee; background: url(/resource/img/tour/sub/sub16043_img07.gif) repeat-x; margin: 0em 0em 1em 0em;}
.toFac_bg {border: 3px solid #fff; padding: 0em 1em 0em 2em;}

/* 차량등록사업소 만족도 추가 | 2018-01-10 | 조승현 */
.tableWriteForm .scoreForm:after {content:""; clear:both; display:block;}
.tableWriteForm .scoreForm span {display: block; float:left;}
.tableWriteForm .scoreForm span input[type="radio"] {vertical-align: middle;}
.tableWriteForm .scoreForm span img {height: 15px;}
.boardView .scoreView img {height: 20px;}

@media all and (max-width: 1280px) {
	.boardTop .boardInfo + .boardSearchBox	{ padding-top: 15px; }
}

@media all and (max-width: 790px) {
	.boardTop .boardSearch.datetime { margin-left: 0; }
}

@media all and (max-width: 760px) {
	.bs-form-box dl { position: relative; width: 100%; float: none; clear: both; border-bottom-width: 1px; }
	.bs-form-box dt {  }
	.bs-form-box .form-group	{ border-bottom-width: 0px; }
}

@media all and (max-width: 645px) {
	.boardTop .boardSearchBox	{ clear: both; }
	.boardTop .boardSearchBox .boardSearch input[type="text"],
	.boardTop .boardSearchBox .boardSearch.datetime input[type="text"] { width: 80px; }
	.bannerGallery &gt; div { width:98%; }
}

@media all and (max-width:640px) {
	.boardTop .boardInfo { float:none; padding-top:0;}
	.boardTop .boardSearch { float:none; margin:10px 0;}

	/* Board : View */
	.boardView .infoArea2 { overflow:hidden; border-bottom:1px solid #cccfd5;}
	.boardView .infoArea2 li { /* float:left; width:50%; */ padding:10px 0; border-bottom:1px solid #cccfd5;}
	.boardView .infoArea2 li span { display:block; /* float:left; */ margin-right:15px; padding:0 15px;}
	.boardView .infoArea2 li span:first-child { min-width:100%; padding-bottom:5px; /* font-weight:bold; */ border-right:none}

	/* Banner */
	.bannerList .bannerBlock { float:none; width:100%; margin:0 0 10px 0;}

	/* Gallery */
	.boardGallery &gt; div { width:100%; margin:1% 0; }

	.boardTextGallery li a { overflow:hidden; display:block; padding:20px; }
	.boardTextGallery .tgImg { float:none; max-width:100%; height:auto; margin-left:0px; }
	.boardTextGallery .tgCont { float:none; width:100%; padding-left:0px; margin:20px 0 0 0;}

	.boardTextGallery2 .gListBlock .tgImg { overflow:hidden; float:none; max-width:100%; }
	.boardTextGallery2 .gListBlock .tgImg img { width:100%; height:inherit;}
	.boardTextGallery2 .gListBlock .tgCont { margin:20px 0 0 0; }
	.boardTextGallery2 .gListBlock .tgCont li a { width:100%; }
	.boardTextGallery2 .gListBlock .tgCont li span { float:none; padding-left:8px;}

	.boardTextGallery3 .egImg { float:none; }
	.boardTextGallery3 .egCont { margin:10px 0 0 0;}
	.boardTextGallery3 .egCont dt { float:none; width:100%; background:none; }
	.boardTextGallery3 .egCont dd { padding:3px 0 3px 10px; }
}

@media all and (max-width: 430px) {
	.boardTop .boardSearchBox .boardSearch			{ clear: both; margin-left: 0; }
	.boardTop .boardSearchBox .boardSearch.datetime	{ float: right; }
	.boardTop .boardSearchBox .boardSearch input[type="text"]		{ width: 123px; }
}

/* 조직도 */
.groupListWrap {text-align:center;}
.groupListWrap .titSection {position:relative; padding-bottom:34px;}
.groupListWrap .titSection:after {display:block; content:""; position:absolute; bottom:0; left:50%; width:4px; height:34px; margin-left:-2px; background-color:#4C750C;}
.groupListWrap .tit {display:inline-block; padding:16px 50px; font-weight:bold; font-size:171%; color:#fff; background-color:#4C750C; border-radius:3px; -webkit-border-radius:3px;}
.groupListWrap .groupChart {padding:10px 20px 20px; border:1px solid #ccc; background-color:#eff4fa; border-radius:3px; -webkit-border-radius:3px;}
.groupChart .groupChartList {overflow:hidden; margin-left:-10px;}
.groupChart .groupChartList:after {content:''; display:block; clear:both;}
.groupChart .groupChartList li {float:left;}
.groupChartList .item {margin:10px 0 0 10px; border-radius:3px; -webkit-border-radius:3px;}
.groupChartList .item span {display:table; width:100%; min-height:42px; border:1px solid #ccc; box-sizing:border-box; -webkit-box-sizing:border-box; background-color:#fff; }
.groupChartList .item a {display:table-cell; width:100%; font-weight:bold; font-size:114%; color:#666; text-align:center; background-color:#fff; vertical-align:middle;}
.groupChartList .item a:hover,
.groupChartList .item a:focus,
.groupChartList li.on .item a {color:#fff; background-color:#4C750C;}

.groupChartList.itemW20 li {width:20%;}
.groupChartList.itemW25 li {width:25%;}

/* slider */
.mcon_banner .bx-wrapper .bx-viewport { left:0;border:0;box-shadow:none;margin:0;padding:0;}
.mcon_banner .bx-wrapper ul &gt; li {min-height:200px;height:auto;}
.mcon_banner .bx-wrapper ul &gt; li img{width:100% !important;height:auto;}
.mcon_banner .play_box { display:none !important;}
/*
.mcon_banner .bx-wrapper .bx-controls {position:absolute;width:100%;height:32px;bottom:0;background:rgba(0,0,0,0.5);}
.mcon_banner .bx-wrapper .bx-pager, .bx-wrapper .bx-controls-auto {}*/

/*홍보브로슈어*/
.shortCut { padding-right:27px !important; }
.button.small.default.shortCut::after { background-position:left 5px !important; }

/*아동학대예방교육 신청하기*/
.boardView .form-group.askWrap {overflow:hidden;}
.boardView .form-group.askWrap .form-data-info dt {width:240px; float:left; position:inherit; padding:25px 0 0 10px;}
.boardView .form-group.askWrap .form-data-info dd {display:table-cell; width:68%; float:left; padding:22px 0 0 10px;}


@media only screen and (max-width:767px) {
	.boardView .articleArea {padding:4px}
	.egImg_view {margin-bottom:5.5em}
	.exhContWrap .exhContText {width:100%;}
	.boardTextGalleryseWrap ul li {padding: 20px 0 30px;}
	.boardTextGalleryseWrap ul li .item .tgImg {width:100%;}
	.boardTextGalleryseWrap ul li .item .tgImg img {max-height:none;}
	.boardTextGalleryseWrap ul li .item .tgCont {width:100%; padding-left:0; padding-top:10px;}
	.boardTextGalleryseWrap ul li .item .tgCont .tgTxt {display:none;}
}

@media only screen and (min-width:768px) and (max-width:1023px) {
	.boardView .articleArea {padding:4px}
	.egImg_view {margin-bottom:5.5em}
	.exhContWrap .exhContText {width:100%;}
}

@media all and (max-width:1023px) { /* mobile &amp; tablet ver */
	/* 조직도 */
	.groupChart .groupChartList li {width:25%;}
}

@media all and (max-width:800px) {
	/*포토갤러리 view*/
	.photoView dd { height:400px !important; margin:1.5em 0 1.5em !important;}

	/*아동학대예방교육 신청하기*/
	.boardView .form-group.askWrap .form-data-info dt {padding: 12px 0;}
	.boardView .form-group.askWrap .form-data-info dd {width:50%; padding: 10px 0 10px 20px;}
}

@media all and (max-width:655px) {
	/*아동학대예방교육 신청하기*/
	.boardView .form-group.askWrap .form-data-info dd {width:40%;}
}

@media all and (max-width:530px) {
	/*아동학대예방교육 신청하기*/
	.boardView .form-group.askWrap .form-data-info dd {padding-left:0; width:100%;}

}

/*보건환경life 뉴스레터 START*/
.boardView.newsletter * {box-sizing: border-box;}
.boardView.newsletter {font-family: "NanumSquare";}
.boardView.newsletter .form-data-content-letter dd {background: #fff;}
.boardView.newsletter .letterHeader {width: 100%; overflow:hidden;}
.boardView.newsletter .letterHeader img {width: 100%;}
.boardView.newsletter .letterContent {display: flex; flex-wrap: wrap;}
.boardView.newsletter .letterContent:after {content:""; clear:both; display:block;}
.boardView.newsletter .letterContent .letterItem {float:left; width: calc(100%/ 3); padding:40px 20px 0;}
.boardView.newsletter .letterContent .letterItem .letterContTit {display: flex; align-items: flex-end; line-height: 1.5; font-size: 1.2em; margin-bottom:15px;  color: #ffffff; }
.boardView.newsletter .letterContent .letterItem .letterContTit span.title {background-color: #1f4e79; padding-left: 3%;}
.boardView.newsletter .letterContent .letterItem .letterContTit span:first-child {width: max-content; flex-shrink: 0; padding-right: 8px; box-sizing: border-box;}
.boardView.newsletter .letterContent .letterItem .letterContTit span.assets {display: inline-block; width: 100%; height: 3px; margin-bottom: 0px; background-color: #1f4e79;}
.boardView.newsletter .letterContent .letterItem:nth-child(even) .letterContTit span.assets {background-color: #385724;}
.boardView.newsletter .letterContent .letterItem:nth-child(even) .letterContTit span.title {background-color: #385724; padding-left: 3%;}

.boardView.newsletter .letterContent .letterItem .letterContImg {width:100%; max-width:100%; height:140px; overflow:hidden; background:#f9f9f9; margin-bottom:10px;}
.boardView.newsletter .letterContent .letterItem .letterContImg &gt; a {position: relative; display:block; height:100%; z-index: 1;}
.boardView.newsletter .letterContent .letterItem .letterContImg&gt;a::before {content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; box-shadow: inset 0px 0 20px 10px rgb(255 255 255 / 80%);}
.boardView.newsletter .letterContent .letterItem .letterContImg img {position: relative; z-index: -1; width: 100%; height: 100%; object-fit: cover;}
.boardView.newsletter .letterContent .letterItem .letterContImg img.row {height:100%; width: auto; max-width: none;}
.boardView.newsletter .letterContent .letterItem .letterContTxt {font-size: 1.2em; overflow:hidden; text-overflow: ellipsis; word-break: break-word; 
	display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical}
.boardView.newsletter .letterFooter:after {content:""; clear:both; display:block;}
.boardView.newsletter .letterFooter &gt; a {display:table; width: 48%; margin-right:2%; float:left; height: 80px; text-decoration: none; overflow: hidden; background-size: cover; background-repeat: no-repeat; background-position: right center; padding:0 30px;}
.boardView.newsletter .letterFooter &gt; a:last-child {margin-right: 0;}
.boardView.newsletter .letterFooter &gt; a span {color:#fff; display:table-cell;vertical-align: middle; font-size: 1.2em;}
.boardView.newsletter .letterFooter &gt; a span:before {content:""; display:inline-block; vertical-align: middle; margin-right: 20px; background-repeat: no-repeat; background-size: cover; background-position: center center}
.boardView.newsletter .letterFooter &gt; a:hover, .boardView.newsletter .letterFooter &gt; a:focus {text-decoration: none;}
.boardView.newsletter .letterFooter .letterNewsLink {background-color:#213d70; background-image:url(/humanframe/theme/officehome/assets/img/content/letter_news_link_bg.jpg); margin-bottom: 15px;}
.boardView.newsletter .letterFooter .letterPrevLink {background-color:#297c15; background-image:url(/humanframe/theme/officehome/assets/img/content/letter_prev_link_bg.jpg);}
.boardView.newsletter .letterFooter .letterNewsLink span:before {width: 42px; height: 40px; background-image:url(/humanframe/theme/officehome/assets/img/content/letter_news_link_icon.png);}
.boardView.newsletter .letterFooter .letterPrevLink span:before {width: 48px; height: 39px; background-image:url(/humanframe/theme/officehome/assets/img/content/letter_prev_link_icon.png);}
.boardView .form-data-content dd {line-height: 1.8;}

@media all and (min-width: 1024px) {
	.boardView.newsletter .letterContent .letterItem {border-bottom: 1px solid #ddd; padding-bottom: 20px;}
	.boardView.newsletter .letterContent .letterItem:nth-child(n+4) {border-bottom: 0;}
}

@media all and (max-width: 1023px) {
	.boardView.newsletter .letterContent {padding-bottom:30px;}
	.boardView.newsletter .letterContent .letterItem {width: 50%;}
	.boardView.newsletter .letterFooter &gt; a {width: 100%; margin-right: 0;}
}

@media all and (min-width: 641px) {
	/* .boardView.newsletter .letterContent .letterItem .letterContImg img.row {height:100%; width: auto; max-width: none;} */
}

@media all and (max-width: 640px) { /* mobile ver */
	.boardView.newsletter .letterHeader img {width: 180%; max-width:none;}
	.boardView.newsletter .letterContent .letterItem {width: 100%; padding: 20px 0 0;}
	.boardView.newsletter .letterContent .letterItem .letterContImg {max-width:none;}
}
/*보건환경life 뉴스레터 END*/

/*20230913 아이프레임 스타일 추가*/
.ifrm_vx iframe{
	width:100% !important;
	border:3px solid #f0f1f5 !important;
	height:600px !important;
}

/* 20240509 낙동강 에코센터 추가 */
/* 에코센터 - 이용안내 */
.ecoUseText {width: 100%; padding: 30px; margin-top: 40px; box-sizing: border-box; background-color: #f9f9f9;}
.ecoUseText h4.h4Bl {padding-left: 35px; position: relative; box-sizing: border-box; margin-top: 0;}
.ecoUseText h4.h4Bl::before {content: ''; position: absolute; top: 0; left: 0; background: url('/humanframe/theme/officehome/assets/img/content/eco/warningIcon.png') no-repeat; width: 25px; height: 25px; background-size: 100%;}
.ecoUseText .h4Section {margin-bottom: 0;}

.useList {width: 100%; display: flex; justify-content: space-between;}
.useList li {width: 48%; padding: 25px 10px 25px 125px; box-sizing: border-box; border: 1px solid #dedede; border-top: 2px solid #4c750c;}
.useList li:first-child {background: url('/humanframe/theme/officehome/assets/img/content/eco/fac1.png') no-repeat; background-size: 54px; background-position: left 35px center;}
.useList li:nth-child(2) {background: url('/humanframe/theme/officehome/assets/img/content/eco/fac2.png') no-repeat; background-size: 49px; background-position: left 40px center;}

/* 에코센터 - 전시관안내 */
.floorTab {width: 100%; display: flex; margin-bottom: 40px;}
.floorTab li {width: 33.333%; border-bottom: 1px solid #cccccc; text-align: center; position: relative; background-color: #f6f6f7;}
.floorTab li::before {content: ''; position: absolute; top: 50%; right: -1px; margin-top: -15px; width: 1px; height: 30px; background-color: #dedede; z-index: 99;}
.floorTab li:last-child:before {display: none;}
.floorTab li.active {background-color: #fff; border-top: 2px solid #4c750c; border-bottom: none; border-left: 1px solid #ccc; border-right: 1px solid #ccc;}
.floorTab li.active::before {display: none;}
.floorTab li button {display: block; width: 100%; height: 100%; border: none; padding: 21px 0; font-size: 21px; word-break: keep-all; font-weight: 700; color: #333333; letter-spacing: -0.02em;}

.floorContent&gt;div {display: none;}
.floorContent&gt;div.active {display: block;}

/* 1층 */
.firstFloor {width: 100%; margin: 80px 0; display: flex; justify-content: flex-end; position: relative;}
.firstFloor img {position: absolute; top: -45px; left: 0; width: 69%;}
.firstFloor .text {width: 85%; height: 294px; background-color: #f7f7f7; padding: 43px 30px 43px 57.5%; box-sizing: border-box;}
.firstFloor .text .tit {word-break: keep-all; line-height: 150%; font-weight: 700; color: #333333; font-size: 20px; padding: 15px 0; border-top: 2px solid #333333; border-bottom: 1px solid #bababa; box-sizing: border-box; margin-bottom: 15px;}
.firstFloor .text .txt {word-break: keep-all; font-size: 15px; color: #333333;}

/* 2층 */
.secondFloor, .eduFloor {width: 100%; display: flex; justify-content: space-between; flex-wrap: wrap;}
.secondFloor li {width: 49%; margin-bottom: 35px; display: flex; flex-direction: column; justify-content: space-between;}
.secondFloor li img,
.eduFloor li img  {display: block; width: 100%; object-fit: cover;}
.secondFloor li .text {width: 100%; height: 100%; padding: 25px; box-sizing: border-box; position: relative; background-color: #f7f7f7;}
.secondFloor li .text .tit {font-weight: 700; font-size: 20px; line-height: 150%; color: #333333; padding-bottom: 13px; margin-bottom: 13px; border-bottom: 1px solid #d6d6d6; box-sizing: border-box; word-break: keep-all; letter-spacing: -0.02em;}
.secondFloor li .text .tit .mo {display: none;}
.secondFloor li .text .txt {font-size: 15px; color: #333333; word-break: keep-all; letter-spacing: -0.04em;}
.secondFloor li .text .zone {display: block; position: absolute; right: 30px; top: -34px; width: 68px; height: 68px; border-radius: 50%; text-align: center; line-height: 68px; color: #fff; font-weight: 700; font-size: 16px; background-color: #ff8828; box-shadow: 2px 2px 7px rgba(0, 0, 0, 0.15);}

/* 교육,편의시설 */
.eduFloor li {width: 49%; margin-bottom: 35px;}
.eduFloor li .text {width: 100%; font-weight: 700; font-size: 20px; color: #333333; text-align: center; letter-spacing: -0.02em; padding: 20px 0; background-color: #f7f7f7;}

@media screen and (max-width: 1200px) {
	.useList li {padding-left: 100px;}
	.useList li:first-child {background-size: 48px; background-position: left 25px center;}
	.useList li:nth-child(2) {background-size: 43px; background-position: left 30px center;}

	.secondFloor li .text .tit .mo {display: inline-block;}
}

@media screen and (max-width: 1025px) {
	.firstFloor {margin: 40px 0;}
	.firstFloor img {position: static; width: 60%; object-fit: cover;}
	.firstFloor .text {padding: 20px; height: auto;}
}

@media screen and (max-width: 680px) {
	.ecoUseText  {padding: 20px;}
	.useList {flex-wrap: wrap;}
	.useList li {width: 100%; padding-left: 80px;}
	.useList li:first-child {background-size: 35px; margin-bottom: 15px;}
	.useList li:nth-child(2) {background-size: 30px; background-position: left 25px center;}

	.floorTab li button {padding: 17px 0; font-size: 19px;}
	.firstFloor .text {padding: 15px;}
	.firstFloor .text .tit {padding: 10px 0; font-size: 17px; margin-bottom: 10px;}
	.firstFloor .text .txt {font-size: 14px;}

	.secondFloor li .text {padding: 15px;}
	.secondFloor li .text .tit {font-size: 17px; padding-bottom: 10px; margin-bottom: 10px;}
	.secondFloor li .text .zone {right: 10px; top: -32px; width: 50px; height: 50px; line-height: 50px; font-size: 14px;}
}

@media screen and (max-width: 480px) {
	.floorTab {margin-bottom: 25px;}
	.floorTab li button {font-size: 17px;}
	.firstFloor {flex-wrap: wrap; margin: 25px 0;}
	.firstFloor .text .tit {border-top: none; padding-top: 0;}
	.firstFloor img, .firstFloor .text {width: 100%;}

	.secondFloor li, .eduFloor li {width: 100%; margin-bottom: 15px;}
	.eduFloor li .text {font-size: 16px; padding: 15px 0;}
}</pre></body></html>