@charset "utf-8";

/* View */
.view-wrap .img-photo i { background: rgb(245, 245, 245); padding: 16px; border-radius: 50%; width: 80px; height: 80px; text-align: center; color: rgb(143, 143, 143); font-size: 40px; display: inline-block; }
.view-wrap .img-photo img { border-radius: 50%; width: 80px !important; height: 80px !important; display:inline-block; }
.view-wrap .img-resize img { max-width:100%; height:auto; }
.view-wrap .no-attach { border:0px; padding:0; margin-top:0;}

.view-wrap h1 {font-family: "SpoqaHanSansNeo","Noto Sans KR", sans-serif;  font-size: 22px; font-weight:bold; margin:0px; line-height:normal; display:block; text-overflow:ellipsis; white-space:nowrap; word-wrap:normal; overflow:hidden; padding:0 0 0 0; color: rgb(59, 62, 67); letter-spacing:-1px; }
.view-wrap h1 span.talker-photo { margin-bottom:10px; margin-right:10px; }
.view-head { border-left:0px; border-right:0px; border:none; padding:0;}
.view-head .sp { display:inline-block; width:20px; text-align:center; font-size:11px; color:#888; }
.view-head .list-group-item { padding:5px 15px; border-style:dotted; }
.view-tag { margin:10px 0px; padding:0px; color:#888; }
.view-tag a { color:#888; }
.view-tag a:hover { color:crimson; }
.view-cnt { margin-top:4px; }
.view-img img { display:block; border:0; height:auto; max-height:400px; margin:0 auto;}
.view-content { padding:0px; }
.view-mobile .view-content { padding:0px 0px 20px; }
.view-content img { width:auto; height:auto; max-width:100%; }
.view-content p { padding:0; margin:0; line-height:22px; font-size:16px;}
.view-good-box { text-align:center; }
.view-good-box span { margin:15px 6px; width:80px; height:80px; display:inline-block; }
.view-good-box a { background: rgb(245, 245, 245); padding-top:14px; border-radius: 50%; width: 80px; height: 80px; text-align: center; color: rgb(51, 51, 51); font-size: 22px; line-height:26px; display: inline-block; }
.view-good-box .view-good a:hover { background: rgb(223, 17, 25); color: rgb(255, 255, 255); }
.view-good-box .view-nogood a:hover { background: rgb(0, 0, 0); color: rgb(255, 255, 255); }
.view-author .auth-photo { width:160px; padding-right:15px; }
.view-comment { color: rgb(51, 51, 51); font-family: "Roboto", sans-serif; margin: 0px 0px 10px; padding: 0px 0px 5px; text-transform: capitalize; overflow: hidden; font-size: 20px; font-weight: 500; border-bottom-color: rgb(51, 51, 51); border-bottom-width: 1px; border-bottom-style: solid; display: inline-block; position: relative; }

#bo_v_sns {margin:4px 0 15px;padding:0;list-style:none;zoom:1}
#bo_v_sns:after {display:block;visibility:hidden;clear:both;content:""}
#bo_v_sns li {float:left;margin:0 5px 0 0}

@media screen and (max-width:991px){
	.view-content p{font-size:14px;}
}


/* Comment */
.comment-media { }
.comment-media .photo i { background: rgb(245, 245, 245); padding: 15px; border-radius: 50%; width: 64px; height: 64px; text-align: center; color: rgb(143, 143, 143); font-size: 30px; display: inline-block; }
.comment-media .photo img { border-radius: 50%; width: 64px !important; height: 64px !important; display:inline-block; }
.view-mobile .comment-media .photo i { padding: 10px; width: 54px; height: 54px; }
.view-mobile .comment-media .photo img { width: 54px !important; height: 54px !important; }

.comment-media .media { border-top:1px solid #eee; margin:7px 0px; padding:7px 0px 0px; }
.comment-media :first-child.media { border-top:0px; margin-top:0px; padding-top:0px; }
.comment-media h5 { margin:2px 0px; line-height: 22px; }
.comment-media .media .media-body { padding-left:0px; }
.comment-media .media .media-info { margin-left:10px; }
.comment-media .media .media-content { margin-top:8px; }
.comment-media .media .media-btn {	margin-left:4px; }
.comment-media .cmt-good-btn { text-align:right; padding-right:1px; }
.comment-media .cmt-good, .comment-media .cmt-nogood { display:inline-block; width:74px; height:20px; margin-top:10px; padding-right:10px; margin-right:-1px; font:bold 11px verdana; text-align:right; letter-spacing:-1px; line-height:19px; cursor:pointer; }
.comment-media .cmt-good { background: url('./img/cmt_good.gif') no-repeat left center; color:#f4695b; }
.comment-media .cmt-nogood { background: url('./img/cmt_nogood.gif') no-repeat left center; color:#888; }

#bo_vc_opt ol {	margin:0;padding:0;list-style:none;zoom:1; }
#bo_vc_opt ol:after { display:block;visibility:hidden;clear:both;content:""; }
#bo_vc_opt ol li { float:left;margin:0; }
#bo_vc_send_sns ul { margin:0;padding:0;list-style:none;zoom:1; }
#bo_vc_send_sns ul:after { display:block;visibility:hidden;clear:both;content:""; }
#bo_vc_send_sns ul li {	float:left;margin:0 0 0 20px; }
#bo_vc_send_sns input {	margin:0 0 0 5px; }

@media all and (max-width:460px) {
	.responsive .view-wrap h1 { text-overflow:clip; overflow:none; white-space:normal; line-height: 24px; font-size: 18px; margin-bottom:16px; }
	.responsive .view-wrap h1 .photo { display:none; }
	.responsive .view-author .auth-photo { float:none; width:100%; padding-right:0px; }
}


/*타이틀 */
.con1 .inner {padding:0;}
.panel .panel-heading {background-color:transparent !important;border:0;padding:0;}

@media screen and (max-width:767px){
.con1 .title_txt{padding:25px 10px; text-align:center;margin-bottom:15px;}
.con1 .title_txt h1{font-size:24px;margin:0 0 5px;}
.con1 .title_txt h4 {font-size: 14px; margin-bottom:0;}
}

@media screen and (max-width:991px){
.con1 .title_txt { margin-top: 50px;}
}

/*서브타이틀*/
.sub-title {margin: 0 auto; }

@media screen and (max-width:991px){
	.view-wrap h1 {margin-bottom:20px;width: 100%; }
	.sub-title{flex-direction: column;    width: 100%;}
	
	.view-content { font-size: 14px;}
}
@media screen and (max-width:767px){

}


/* 서브 타이틀 */
.table-responsive {border:0;}
.at-container .table-responsive{max-width:100% !important;}
.con1 .inner {padding:0;}
.board-nav{background:url("/img/metech_ps/ps_title01_4.jpg") no-repeat center / cover; }
.board-nav > .page-nav {display:none;}
.con1 .title_txt{padding:40px 0 40px 60px; line-height:1.4;margin-bottom:30px;margin-top:160px;}	
.con1 .title_txt h1{ letter-spacing: -1px;margin-top:0; font-weight: bold; color:#fff; margin-bottom:25px;}
.con1 .title_txt h4{color:#fff; font-size: 20px; font-weight: normal;}

.div-title-underbar {letter-spacing: -1px;padding:80px 0 80px 60px;border-bottom:0;margin-top:150px;}
.div-title-underbar span {border-bottom:0; line-height: 1.1; font-size: 36px; padding: 0; font-weight: bold; color: #fff; margin: 0 auto;}
.div-title-underbar p {color:#fff; font-size: 20px; font-weight: normal;margin:10px 0 0 0;}

.at-ie-zone {height:100vh;}


.exhibition {display:none;}


@media screen and (max-width:1200px){
.btn-group>.btn, .btn-group-vertical>.btn {padding:10px 20px;}
}

@media screen and (max-width:991px){
	.div-title-underbar { margin-top: 50px; }
	.div-title-underbar span {font-size:24px;}
	.div-title-underbar p {font-size:14px;}
	.view-wrap .panel { width: 100%; background-color: #efefef; padding: 6px 10px;}
	.div-title-underbar{padding:40px 0 40px 60px;}
}
@media screen and (max-width:767px){
	.view-wrap .panel { margin:0 auto 10px;}
	.view-img img { /* width:100%; */ }
	.div-title-underbar {padding-left:0;text-align: center;}
	.div-table.table > thead > tr{ font-size: 14px;}
	.div-table.table > tbody > tr > td { font-size:14px;}
	.list-pc .list-tbl th, .list-pc .list-tbl td {padding: 15px 5px;width:70px; }
	.list-pc .list-subject a {overflow:hidden; text-overflow:ellipsis; white-space:nowrap !important; width:120px;}
	.list-btn-box {display: flex; justify-content: center;}
	.responsive .list-btn {margin:initial;}
	.btn-group>.btn, .btn-group-vertical>.btn {padding:6px 10px !important;}
	.pagination-sm>li>a, .pagination-sm>li>span {padding:2px 10px;}
	.responsive .view-btn i{line-height: 23px;}
}

.ie-zone{padding-left:0 !important; padding-right:0 !important;}
.at-body .at-boxed.at-container {padding:0 10px;}

.panel>.list-group:last-child .list-group-item:last-child{border-bottom:1px dotted #ddd;}


/* 221007 전시 수정 */
/* 상단 전시소개 */
#sit_inf {margin-bottom:80px;}

#sit_inf .sit_inf_explan_artist { display:flex; justify-content:space-between; margin:0 auto;  width:100%;}
#sit_inf .artist_img_wrap { position:relative;width:500px;} 

#sit_inf .artist_img_wrap .artist_img { position:relative; z-index:1; width:100%; background-repeat:no-repeat; background-position:center center; background-size:100%;}
#sit_inf .artist_info_wrap {padding:40px 0; width:calc(100% - 595px); border-top:2px solid #333333; border-bottom:1px solid #dddddd;}
#sit_inf .artist_name { font-size:26px; color:#211e1f; font-family: "SpoqaHanSansNeo","Noto Sans KR", sans-serif; line-height:36px; font-weight:bold;}
#sit_inf .artist_eng_name {font-family: "SpoqaHanSansNeo","Noto Sans KR", sans-serif; display:inline-block; font-size:20px; color:#C9AB81; word-break:keep-all; vertical-align:text-bottom; line-height:36px;}
#sit_inf .artist_sum { display:flex; position:relative; margin-top:17px;}
#sit_inf .artist_sum dt {width:105px; font-size:18px; color:#333333; font-weight:500; line-height:24px;}
#sit_inf .artist_sum dd {width:calc(100% - 105px); padding:0 15px; font-size:16px; color:#666666; line-height:24px;}
#sit_inf dl:first-of-type {margin-top:30px;}

@media screen and (max-width:991px){
	#sit_inf .sit_inf_explan_artist {flex-wrap:wrap;}
	#sit_inf .artist_img_wrap {margin:0 auto;max-width:500px;width:100%;}
	#sit_inf .artist_info_wrap {margin:40px auto 0;padding:30px 0; width:100%;}
}

@media screen and (max-width:767px){
	#sit_inf{margin-bottom:60px;}
	#sit_inf .item_desc_con {font-size:14px !important;}
	#sit_inf dl {flex-wrap:wrap;}
	#sit_inf .artist_sum dt {width:100%;font-size:16px;}
	#sit_inf .artist_sum dd {padding:5px 0 0; width:100%; font-size:14px;}
	#sit_inf .artist_name {font-size:20px; margin:0;}
	#sit_inf .artist_eng_name {display:block;  margin:0 0 10px 0; font-size:16px;}
}

/* 하단 tab */
.nav-tabs{display:flex;justify-content: center; align-items: center; margin: 0 auto; width: 100%; border: none; border-bottom: 1px solid #dddddd;border-top:1px solid #ddd;}
.nav-tabs>li{flex:1; text-align:center; display: inline-block;  margin-bottom: -1px; text-align: center; line-height: 40px; font-size: 0.92em; font-size: 12px;  margin-left: -1px;}
.nav-tabs>li>a{border-radius:0px;display: block; position: relative; padding: 0; border: none !important; font-size: 20px; color: #666666;  font-family: 'Noto Sans KR', sans-serif; font-weight: 500; line-height: 65px;}
.nav-tabs>li.active>a{color:#000; font-weight:bold;background-color:#eee;}
.nav-tabs>li.active>a:after{content: ""; position: absolute; left: 0; bottom: 0; width: 100%; height: 1px; background-color: #333;}
.charter-wrap{min-height:500px; padding:40px 0; font-size:16px;}
.tab-content hr{margin:40px 0;}
.view-wrap p{font-size:16px; line-height:1.5; margin-top:10px;}
.view-wrap h4{ line-height:1.5; word-break:keep-all;}
.view-wrap .introduce img{width:100%; max-width:300px;}


/* 갤러리 */
.gallery > div{margin-bottom:30px; height:350px; overflow:hidden; padding-bottom:40px;}
.gallery img{ margin:0 auto; height:100%; text-align:center; display:block;}
.nav-tabs>li.active>a, .nav-tabs>li.active>a:hover, .nav-tabs>li.active>a:focus{background-color:#eee;}

@media screen and (max-width:1199px){
	.gallery > div{ height:240px;}
}

@media screen and (max-width:767px){
	.box {display:flex;  align-items: center;  justify-content: space-between;}
	.nav-tabs>li>a{font-size:14px; white-space: nowrap;}
	.gallery > div{margin-bottom:0; padding:0; height:100%;border-bottom:1px solid #ddd;}
	.gallery > div:first-child {padding-bottom:20px;} /* 여기서 첫 번째 div에 padding을 적용합니다. */
	.gallery > div~div {padding:20px 0;}
	.gallery img{width:35%; margin: inherit; margin-right: 15px;}
	.view-wrap p{line-height:1.5; margin-left:15px; }
	.box p {display: -webkit-box; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis; -webkit-line-clamp: 2; /* 두 줄 이후로 말줄임표가 표시됩니다 */word-break: keep-all;width: calc(100% - 45%);}
	.view-wrap .introduce img {display:block; max-width:250px; margin:0 auto 30px;}
}


