@charset "utf-8";

/* 게시판 레이아웃 */
div#contents{
    max-width:1440px; margin:0 auto 110px;
}

@media screen and (max-width: 1440px) {
    div#contents{
        padding:0 20px;
    }
}
@media screen and (max-width: 768px) {
    div#contents{
        margin-bottom:80px;
    }
}
@media screen and (max-width: 360px) {
    div#contents{
        margin-bottom:40px;
    }
}


/* 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 > div { float:left; width:23%; margin:1%; padding:10px 10px 15px; border:1px solid #b7b8be; }
.boardGallery > 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 .bDate { float:right; font-size:12px;}
.boardTextGallery { margin-top:10px; border-top:3px solid #61646c; border-bottom:1px solid #93969c;}
.boardTextGallery > ul > li { border-top:1px dashed #bdbdbd; }
.boardTextGallery > ul > li:first-child { border-top:none;}
.boardTextGallery > ul > li:hover { background:#f9f9f9;}
.boardTextGallery a { text-decoration:none;}

.boardTextGallery > ul > li > a {
	padding:20px; display: flex; flex-direction: row; justify-content: flex-start; align-items: flex-start; gap:20px; width:100%;}
.boardTextGallery > ul > li > a:focus{
	outline:2px solid #000;
}
.boardTextGallery > ul > li > .inkBtn { overflow:hidden; display:inline-block; padding:20px; float:right; }
.boardTextGallery .tgImg { 
	display:block; overflow:hidden; width:300px; aspect-ratio:4 / 3; min-width:300px;}
.boardTextGallery .tgImg img {
	width:100%;
	height:100%;
	object-fit:cover;
	object-position:center;
}
.boardTextGallery .tgCont { 
	display:flex; flex-direction: column; justify-content: flex-start; align-items: flex-start; width:100%; flex: 1 1 0;
}
.boardTextGallery .bTitle {margin-bottom:5px;font-size:2.2rem;line-height:1.6; font-weight:700;color:#000;overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical;}
.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; }
.boardTextGallery .tgCont .tgTxt .writer {margin-bottom: 10px; }
.boardTextGallery .jump { margin:0 10px 10px 0; }
.boardTextGallery .tgCont a:hover { text-decoration:underline; }
.boardTextGallery.seWrap .tgCont .tgTxt .writer {margin-bottom: 5px; line-height: 1.6; display: flex; flex-direction: row; justify-content: flex-start; align-items: center;}
.boardTextGallery.seWrap .tgCont .tgTxt .writer > span{
	font-size:1em; background:none; display: block; position: relative; padding-left:0; padding-right:10px;
}
.boardTextGallery.seWrap .tgCont .tgTxt .writer > span::after{
	display: block; content:''; width:1px; height:16px; background:#dbdbdb; position: absolute; top:50%; right:0; transform: translateY(-50%)
}
.boardTextGallery.seWrap .tgCont .tgTxt .writer > span:last-child::after{
	display: none;
}

.boardTextGallery2 { margin-top:10px; border-top:3px solid #61646c; border-bottom:1px solid #93969c; }
.boardTextGallery2 > div { padding:20px; border-top:1px dashed #bdbdbd; }
.boardTextGallery2 > 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 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;}


@media all and (max-width: 768px) {
	.boardTextGallery.seWrap .tgCont .tgTxt .writer{
		flex-wrap: wrap;
	}
	.boardTextGallery.seWrap .tgCont .tgTxt .txtL.cont{
		overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical;}
}
@media all and (max-width: 480px) {
	.boardTextGallery > ul > li > a{
		flex-direction: column
	}
	.boardTextGallery .tgImg{
		width:100%; min-width:inherit;
	}
}




/************** msry Gallery ****************/
.msryGallery {
	display: block;
	width: 100%;
	margin: 0 auto;
	overflow: visible;
	position:relative;
}
  
.msryList {
	width: 100%;
	overflow: visible;
}
  
.msryItem {
	/* break-inside: avoid;
	-webkit-column-break-inside: avoid; */
	width:calc(25% - 30px);
	margin-bottom: 40px;
	height: auto;
	overflow: visible;
	box-sizing: border-box;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
    gap: 30px 0;
}
  
.msryItem > .egImg {
	display: block;
	width: 100%;
	height: auto;
}
  
.msryItem > .egImg > a {
	display: block;
	width: 100%;
}
.msryItem > .egImg img {
	display: block;
	width: 100%;
	height: auto;
}
.thumbItem > a > .egCont,
.msryItem .egCont {
	width: 100%;
	height: auto;
	overflow: visible;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
}
.msryItem .egCont .title{
    font-size: 2.4rem;
    line-height: 1.2em;
    font-weight: 600;
}
.msryItem .egCont .title,
.msryItem .egCont .cont {
	white-space: normal;
	overflow: visible;
}
.thumbItem > a > .egCont > .cont,
.msryItem .egCont .cont {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
	align-items: flex-start;
	flex-wrap: wrap;
	width:100%;
}

.thumbItem > a > .egCont .cont > dt,
.msryItem .egCont .cont > dt{
    padding: 0;
    line-height: 1.8em;
    font-weight: 700;
    color: #000;
    background: url(/resource/img/common/board/d_line.gif) no-repeat right top 9px;
    box-sizing: border-box;
    margin-right: 10px; padding-right:10px;
}
.thumbItem > a > .egCont .cont > dd,
.msryItem .egCont .cont > dd{
	line-height: 1.8em; word-break: break-all; width:100%; flex:1 1 0; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;
}

@media all and (max-width: 1024px) {
	.msryItem {
		width:calc(33.3333% - 18.6666px) !important;
	}
}
@media all and (max-width: 768px) {
	
	.msryItem .egCont .title{
		font-size: 2rem;
	}
}
@media all and (max-width: 580px) {
	.msryItem {
		width:calc(50% - 8px) !important;
		padding-bottom: 40px;
		gap: 16px 0;
	}
	.msryItem .egCont{
		gap: 0;
	}
}
@media all and (max-width: 360px) {
	.msryItem {
		width:100% !important;
	}
}
/**********스토리텔링 추가 스타일**********/
.msryItem .egCont .cont.sttl > dt{
	width:70px;
}
.msryItem .egCont .cont.sttl > dd{
	width:calc(100% - 110px);
}


/* 검색 */


.boardTop { 
    padding: 20px 30px;
    background: #f7f7f7;
	margin-bottom: 40px;
	display: flex;
	flex-direction: row;
	justify-content: space-between;
	align-items: center;
	width:100%;
}
.boardTop .boardInfo {
	line-height: 1em;
}
.boardTop .boardInfo i { font-weight:bold; color:#e33333}
.boardTop .boardSearch{
    display: flex;
    flex-direction: row;
    justify-content: flex-end;
    align-items: stretch;
}
.boardTop .boardSearch input[type="text"] { 
	font-size : 1.8rem;
	line-height:1em;
	padding: 10px 20px 11px 19px;
	width:400px;
	border:1px solid #ddd;
}
.boardSearchForm .btnTypeM.btnIcoSearch,
.boardTop .boardSearch input[type="text"] + input[type="submit"],
.boardTop .boardSearch input[type="text"] + input[type="button"] {
	width:60px;
	height:50px;
	background-image: url(/humanframe/theme/busan815/assets/img/content/iconSearch.png);
	background-repeat: no-repeat;
	background-size: auto;
	background-position: center;
	background-color: #000 !important;
	text-indent: -9999px;
    border: 0;
    margin: 0;
}

.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 > div + div	{ padding-left: 20px; }
.boardTop .boardSearchBox .boardSearch.datetime > div + div:before{ content: "~"; position: absolute; left: 6px; line-height: 30px; }

.boardSearchForm.snsSearch{
	flex-direction: column;
	align-items: flex-start;
	gap:8px 0;
}
.boardSearchForm.snsSearch .rowTable{
	display:block;
	width:100%;
}
.boardSearchForm.snsSearch .rowTable .row .group{
	width:auto;
	display: flex;
	flex-direction: row;
	justify-content: flex-start;
	align-items:center;
	gap:0;
}
.boardSearchForm .cellInDvSearchCell.srchKeyword{
	display:flex;
	flex-direction: row;
	justify-content: flex-start;
	align-items: stretch;
}
.boardSearchForm.snsSearch .rowTable .row{
	display:flex;
	flex-direction:row;
	justify-content:space-between;
	align-items:stretch;
	width:100%;
}
.boardSearchForm.snsSearch .cellInDv{
	display:flex;
	flex-direction:row;
	justify-content:flex-start;
	align-items:center;
	gap:0 8px;
}
@media all and (max-width: 1120px) {
	input.textForm {
		width: 160px !important;
	}
}

@media all and (max-width: 1024px) {
	#contents >	.tabStyle{
		display:none;
	}
}
@media all and (max-width: 980px) {
	.boardSearchForm .rowTable .cell{
		flex-direction: column;
		justify-content: flex-start;
		align-items: flex-start;
		gap: 16px 0;
	}
	input.textForm {
		width: 200px !important;
	}
}
@media all and (max-width: 768px) {
	.searchOneItem .boardListTxt{font-size:1.5rem;}
	.boardSearchForm .rowTable .cell > .cellInDv{
		padding:0;
		width:100%;
	}
	.boardSearchForm .rowTable .cell{
		height:auto;
	}
	.boardSearchForm .rowTable .group > .cell{
		height:auto;
		display: flex;
		flex-direction: column;
		justify-content: flex-start;
		align-items: flex-start;
		gap: 8px 0;
	}
	.boardSearchForm .rowTableTypeSearchBar .cellInDvSearch .cellInDvSearchCell.srchOption{
		width:auto;
	}
	.boardSearchForm .rowTableTypeSearchBar .cellInDvSearch .cellInDvSearchCell + .cellInDvSearchCell{
		padding:0;
		width:calc(100% - 100px);
	}
	.boardTop .boardSearch input[type="text"] {
		font-size:1.6rem;
		width:240px;
		padding: 6px 20px 4px 19px;
	}
	.boardTop .boardSearch input[type="text"] + input[type="submit"],
	.boardTop .boardSearch input[type="text"] + input[type="button"]{
		height:36px;
		background-size: auto 16px;
	}
	select.selectForm,
	.boardSearchForm .rowTable .cell input.date,
	input.textForm{
		font-size:2rem;
	}
	.ui-datepicker-trigger{
		width:47px; height:47px;
	}
	.boardSearchForm .rowTable .cell .hyphen{
		margin:0 8px;
	}
	.boardSearchForm .rowTableTypeSearchBar .cellInDvSearch .cellInDvSearchCell.srchOption select{
		width:100px !important; max-width:unset; font-size: 2rem;
	}
}
@media all and (max-width: 640px) {
	input.textForm{
		width:140px !important;
	}
}
@media all and (max-width: 560px) {
	.boardTop{
		flex-direction: column;
		gap: 16px 0;
		align-items:flex-start;
	}
	#searchFrm,
	.boardTop .boardSearch{
		width:100%;
	}
	.boardTop .boardSearch input[type="text"]{
		width:calc(100% - 60px);
	}
}
@media all and (max-width: 500px) {
	.boardSearchForm .rowTable .cell > .cellInDv{
		flex-wrap: wrap
	}
	.boardSearchForm .rowTable .cell input.date{
		width:calc(100% - 47px) !important;
		margin-bottom:8px;
	}
	.boardSearchForm .rowTable .cell .hyphen{
		display:none;
	}
	.boardSearchForm .rowTableTypeSearchBar .cellInDvSearch .cellInDvSearchCell + .cellInDvSearchCell{
		width:calc(100% - 80px);
	}
}

/* 검색 수정 */
.boardSearchForm{
	padding:20px 30px; background:#f7f7f7; border:0;
}
.boardSearchForm .rowTable .row .group{
	display: flex; flex-direction: row; justify-content: space-between; align-items:stretch; width:100% !important; gap:20px;
}
.boardSearchForm .rowTable .cell{
	padding:0;
}
.boardSearchForm .rowTable .cellHeader{
	position:static !important; width:auto;
}
.boardSearchForm .rowTable .cell{
	display: flex; flex-direction: row; justify-content: flex-start; align-items: center;
}
.boardSearchForm .rowTableTypeSearchBar .cellInDv + .cellInDv{
	display: flex; flex-direction:row; justify-content: flex-start; align-items: center;
}

.boardSearchForm .rowTable .cell > .cellInDv{
	display: flex; flex-direction: row; justify-content: flex-start; align-items: center;
}
.boardSearchForm .rowTable .cell > .cellInDv.cellInDvSearch{
	justify-content: flex-end;
}
.boardSearchForm .rowTable .cell input{
	width: auto !important; font-size:2.2rem; line-height:1em; padding:11px 20px 12px 19px; height:auto; max-width:250px;
}
.ui-datepicker-trigger{
	background:#757575; height:51px;
}
button.ui-datepicker-trigger img{
	height:auto;
}
select.selectForm{
	height:51px; font-size:2.2rem; border-right:0;
}

@media all and (max-width: 1280px) {
	.boardSearchForm .rowTable .cell input{
		width:200px !important;
	}
}
@media all and (max-width: 1024px) {
	.boardSearchForm .rowTable .cellHeader.txtCenter{
		display: none;
	}
	.boardSearchForm .rowTable .cell input{
		width:130px !important;
	}
}
@media all and (max-width: 768px) {
	.boardSearchForm .rowTable .row .group{
		flex-direction: column;
	}
	.boardSearchForm .rowTableTypeSearchBar .cellInDv{
		 gap:8px 0;
	}
	.boardSearchForm .rowTable .cell input{
		font-size:2rem; padding:10px 20px 10px 19px; max-width: inherit;
	}
	.ui-datepicker-trigger,
	select.selectForm,
	.boardSearchForm .rowTable .cell .btnTypeM.btnIcoSearch{
		height:45.7px;
	}
	.boardSearchForm .rowTable .group > .cell{
		width:100%;
	}
	.boardSearchForm .rowTableTypeSearchBar .cellInDvSearch .cellInDvSearchCell + .cellInDvSearchCell{
		width:100%; flex:1 1 0;
	}
}
@media all and (max-width: 500px) {
	.boardSearchForm .rowTable .cell input.date{
		margin-bottom:0;
	}
}
@media all and (max-width: 480px) {
	.boardSearchForm{
		padding:20px;
	}
}



/*******주요 소장품 상세******/

.boardView .articleArea {
	padding:0px 0 40px 0;
}
.exhContWrap .egImg_view {
	display: block;
	width:100%;
	padding-bottom:50px;
}
.exhContWrap .egImg_view img {
	display:block;
	width:auto;
	margin:0 auto;
}

.egContRowWrap{
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: flex-start;
	gap: 0 60px;
	width:100%;
}
.egContRowWrap > div{
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
	align-items: flex-start;
    padding: 40px 0 0 0;
}
.egContRowWrap > .exhContLeft{
    width: 400px;
    gap: 37px 0;
	border-top: 1px solid #000;
}
.egContRowWrap > .exhContRight{
    width: calc(100% - 460px);
	border-top: 1px solid #ddd;
}
.egContRowWrap > .exhContLeft > .exhCont{
	display:flex; flex-direction: column; justify-content: flex-start; align-items: flex-start; border-bottom: 0; gap: 20px 0;
}
.egContRowWrap > .exhContLeft > .exhCont > .title{
    font-weight: 700;
	line-height: 1em;
}
.egContRowWrap > .exhContLeft > .exhCont > .cont{
	line-height: 1.4em;
}
.egContRowWrap .exhCont{
	border-bottom:0;
    flex-direction: column;
    justify-content: flex-start;
    align-items:flex-start;
}
.egContRowWrap > .exhContRight > .exhCont > .cont{
	line-height: 1.5em;
	white-space: pre-line;
	word-break:break-all;
}
@media all and (max-width: 1024px) {
	.egContRowWrap{
		gap: 0 30px;
	}
	.egContRowWrap > .exhContRight{
		width: calc(100% - 430px);
	}
}
@media all and (max-width: 768px) {
	.egContRowWrap{
		flex-direction: column;
		gap: 40px 0;
	}
	.egContRowWrap > .exhContLeft{
		width: 100%;
	}
	.egContRowWrap > .exhContRight{
		width: 100%;
	}
}
#topHtml{
	margin-bottom: 60px;
}
#topHtml p{
	white-space: pre-line;
}
#topHtml p:not(:last-of-type) {
	margin-bottom:20px;
}
@media all and (max-width: 1280px){
	#topHtml p{
		white-space: normal;
	}
	
} 
@media all and (max-width: 768px) {
	#topHtml{
		margin-bottom: 40px;
	}
}


.btnArea.btnRt{
	margin:0; display:flex; flex-direction: row; justify-content: center; align-items: center; width:100%; margin-bottom:50px;
}
.btnArea.btnRt > .btnTypeM.btnLineType1{
	font-size: 2rem; line-height: 1em; padding: 20px 74px; background-color:#1a38a4 !important; color: #fff !important; font-weight: 500; border: 0 !important; height: auto;
}
@media all and (max-width: 768px) {
	.btnArea.btnRt > .btnTypeM.btnLineType1{
		font-size: 1.8rem;
	}
}

/* 공지사항 */
.boardList td.title > a{
	overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical;
}

/* 뷰어 */
.view h3.titPage{
    padding-bottom: 51px;
    border-bottom: 2px solid #111;
    margin: 0 auto 40px;
    letter-spacing: -0.05em;
}
.boardView{
	border-top:none;
}
.boardView .form-group h4,
.boardView .form-data-subject {
	border:1px solid #ddd; background:#f7f7f7; text-align:left; padding:29px 15px 27px; font-size:2.6rem; color:#000; 
}
.boardView .form-data-info {
	border-bottom:1px solid #ddd;
}
.boardView .form-data-content{
	margin:50px 0
}
.boardView .form-data-info dt{
	width:100px !important;
}
.btnArea.btnRt{
	margin-top:50px
}
.boardView .form-data-content{
	background:#fff; border-bottom:1px solid #ddd;
}
.boardView .form-data-content dd{
	padding:0
}
.boardView .form-data-content dd > div > iframe{
    width: 80%;
    margin: 0 auto;
    height: 60vh;
    display: block;
}
.boardView .form-group{
	border-top:0;
}
@media all and (max-width: 1560px) {
    .view h3.titPage {
        margin: 0 auto 40px;
        padding: 0 0 50px 0;
        max-width: inherit;
    }
	
}
@media all and (max-width: 1024px) {
    .view h3.titPage {
        margin: 0 auto 40px;
        padding: 0 0 28px 0;
    }

}
@media all and (max-width: 768px) {
    .view h3.titPage {
		padding-bottom: 24px;
        font-size: 3rem;
    }
	
	.boardView .form-data-content dd > div > iframe{
		width: 100%;
	}
	
	.bs-view dl.form-data-subject h5,
	.boardView .form-group h4,
	.boardView .form-data-subject{
		font-size:2rem; padding:15px
	}
	.bs-form-box .form-group{
		border-bottom:0
	}
	.bs-form-box dl{
		width:100%; float:none; position:relative; border-bottom:1px solid #ddd
	}
	.bs-form-box dd{
		margin-left:120px;
	}
	.bs-form-box dt{
		width:120px;
	}
}
@media all and (max-width: 360px) {
    .view h3.titPage {
		padding-bottom: 26px;
        font-size: 2.2rem;
	}
}

/* 부산의 독립운동가 */
.thumbList{
	display: grid; grid-template-columns: repeat(2, 1fr); gap:30px; align-items: stretch;
}
.thumbItem{
	display: block; width:100%;
}
.thumbItem > a{
	display: flex; flex-direction: row; justify-content: flex-start; align-items: stretch; border:1px solid #dbdbdb; transition: 0.3s; width:100%; height:100%;
}
.thumbItem > a > .egImg{
	aspect-ratio:304 / 360; border-right:1px solid #dbdbdb; width:304px; display: grid; grid-template-columns: 1fr; align-items:center;
}
.thumbItem > a > .egImg > img{
	display: block; width:100%; height:100%; object-fit: cover; object-position: center top;
}
.thumbItem > a > .egImg.noImg{
	background:#c1c1c1;
}
.thumbItem > a > .egImg.noImg > img{
	width:100%; object-fit: inherit;
}
.thumbItem > a > .egCont{
	flex:1 1 0; width:100%; padding:43px 40px 40px;
}
.thumbItem > a > .egCont > .tit{
	font-size: 2.4rem; font-weight:700; line-height: 1.4; padding-bottom:35px; border-bottom:1px solid #dbdbdb; transition: 0.3s; width:100%; margin-bottom:30px;
}
.thumbItem > a > .egCont > .tit .birth{
	font-weight:600;
}

.thumbItem > a:hover{
	border:1px solid #1a38a4; transition: 0.3s;
}
.thumbItem > a:hover > .egCont > .tit{
	color: #1a38a4; transition: 0.3s;
}
@media all and (max-width: 1280px) {
	.thumbItem > a > .egImg{width:240px;
	}
}
@media all and (max-width: 1180px) {
	.thumbList{
		grid-template-columns: 1fr;
	}
	.thumbItem > a{
		align-items: flex-start;
	}
	.thumbItem > a > .egImg{
		width:304px; min-width: inherit;
	}
	.thumbItem > a > .egCont{
		flex-direction: row; flex-wrap: wrap;
	}
	.thumbItem > a > .egCont > .cont{
		width:50%;
	}
}
@media all and (max-width: 768px) {
	.thumbItem > a > .egCont{
		padding:20px 40px;
	}
	.thumbItem > a > .egCont > .tit{
		font-size: 2rem; padding-bottom:20px; margin-bottom:15px;
	}
	.thumbItem > a > .egCont > .cont{
		width:100%;
	}
}
@media all and (max-width: 600px) {
	.thumbItem > a{
		flex-direction: column; align-items: flex-start;
	}
	.thumbItem > a > .egImg{
		width:100%; height:auto; border-right:0; padding:20px; aspect-ratio:inherit; 
	}
	.thumbItem > a > .egImg > img{
		width:100%; max-width:304px; margin:0 auto; height:auto;
	}
	.thumbItem > a > .egCont{
		padding:20px;
	}
	.thumbItem > a > .egCont > .tit{
		text-align: center;
	}
}
@media all and (max-width: 386px) {
	.thumbItem > a > .egCont{
		padding-top:0;
	}
	.thumbItem > a > .egCont > .tit{
		text-align: left;
	}
}

/* 부산의 독립운동가 뷰어*/
.slideViewer{
	display: flex; flex-direction: row; justify-content: flex-start; align-items: stretch; gap:30px; padding-bottom:60px;
}
.slideViewer > .swiper{
	margin:0;
}
.gallerySlide{
	width:calc(100% - 290px); flex: 1 1 0;
}
.gallerySlide .swiper-slide{
	display: flex; flex-direction: row; justify-content: center; align-items:center; background:#f0f0f0; aspect-ratio:1150 / 680; padding:20px; 
}
.gallerySlide .swiper-slide > img{
	display: block; object-fit: contain; width:100%; height:100%;
}
.thumbSlide {
	width:260px; display: flex !important; flex-direction: column; justify-content: flex-start;align-content: flex-start;
}
.thumbSlide .swiper-slide{
	aspect-ratio:260 / 140; object-fit: contain; height:auto !important; background-color:#f0f0f0; padding:16px;
}
.thumbSlide .swiper-slide.swiper-slide-thumb-active{
	border:2px solid #777
}
.swiper-button-lock{
	display: block;
}

.slideViewer .swiper-button-next,
.slideViewer .swiper-button-prev{
	color:inherit; background-image: url(/humanframe/theme/busan815/assets/img/common/iconCtr.png);
    text-indent: -9999px; background-size: 100% auto; width:34px; height:62px; background-repeat: no-repeat; background-position: center; margin:0;
}
.slideViewer .swiper-button-prev{
	transform:rotate(180deg);
}
.slideViewer .swiper-button-next.swiper-button-disabled,
.slideViewer .swiper-button-prev.swiper-button-disabled{
	opacity: 1;
}
.gallerySlide > .swiper-button-next,
.gallerySlide > .swiper-button-prev{
	margin-top: calc(0px - (var(--swiper-navigation-size) / 2)); right:38px;
}
.gallerySlide > .swiper-button-prev{
	left:38px;
}
.thumbSlide > .swiper-button-next,
.thumbSlide > .swiper-button-prev{
	position: static; width:100%; height:30px; background-color:#585858; background-position: center; background-repeat: no-repeat; background-image: url(/humanframe/theme/busan815/assets/img/common/iconCtrWh.png);  background-size:auto;transform: rotate(180deg); display: block;
}
.thumbSlide > .swiper-button-prev{
	transform:rotate(0deg);
}
.thumbSlide > .swiper-wrapper{
	flex: 1 1 0; height:100%; max-height:620px;
}
@media all and (max-width: 1024px) {
	.thumbSlide{
		width:200px;
	}
}
@media all and (max-width: 768px) {
	.slideViewer{
		flex-wrap: wrap; padding-bottom:30px; align-items: flex-start;
	}
	.gallerySlide{
		width:100%;
	}
	
	.gallerySlide .swiper-slide{
		padding:10px; 
	}
	.gallerySlide > .swiper-button-next,
	.gallerySlide > .swiper-button-prev{
		width:14px; height:29px; right:12px; margin-top:-14px;
	}
	.gallerySlide > .swiper-button-prev{
		left:12px;
	}
	.thumbSlide{
		width:100%; flex-direction: row; justify-content: flex-start; align-items: stretch;
	}
	.thumbSlide > .swiper-button-next,
	.thumbSlide > .swiper-button-prev{
		width:30px; height:auto; background-image: url(/humanframe/theme/busan815/assets/img/common/iconCtrWhRow.png); transform: rotate(180deg);
	}
	.thumbSlide > .swiper-button-next{
		transform: rotate(0);
	}
	.thumbSlide > .swiper-wrapper{
		height:auto; width:calc(100% - 60px);
	}
	.thumbSlide .swiper-slide{
		aspect-ratio:1;
	}
}

/*저작권표시*/
.cclBx {    
	display: block; padding: 20px; background: #f4f4f4;
}
.cclTit{
	font-weight: 700;
}
.cclCont{
	display: block; font-size: 1.8rem;line-height:1.4em; padding:10px 0;
}
.cclCntc{
	font-size: 1.8rem; margin-top:8px; font-weight:600; color:#555;
}
.cclCallBtn{
	display: inline-block; padding: 8px 12px; border-radius: 40px; background:#e2e2e2; font-size: 1.6rem; color:#999; font-weight:600; line-height:1em; margin-left:10px;
}
@media all and (max-width: 768px) {
	.cclCont,
	.cclCntc{
		font-size: 1.6rem;
	}
}
@media all and (max-width: 360px) {
	.cclCont,
	.cclCntc{
		font-size: 1.4rem;
	}
}