/* ================================================== 
	목록
===================================================== */
#bo_gall { width:100%; }
#bo_gall #gall_ul { margin-left:-2%; }
#bo_gall #gall_ul:after { content:""; display:block; visibility:hidden; clear:both; }
#bo_gall .gall_li { float:left; width:48%; margin-left:2%; margin-bottom:2%; border:1px solid #ddd; padding:10px; position:relative; transition:all 0.3s ease-out; }
#bo_gall .gall_li:hover { border:1px solid #1a1a1a; }
#bo_gall .gall_li .check { position:absolute; top:10px; left:15px; z-index:1; }
#bo_gall .gall_li .check input { padding:0; margin:0; }
#bo_gall .gall_con { margin:0; padding:0; }
#bo_gall .gall_con .gall_href { padding-left:150px; min-height:195px; }
#bo_gall .gall_con .gall_href .l_img { position:absolute; top:10px; left:10px; width:130px; height:195px; overflow:hidden; }
#bo_gall .gall_con .gall_href .l_img img { width:100%; height:auto; margin:0 auto; vertical-align:middle; }
#bo_gall .gall_con .gall_href .l_info { padding-top:20px; }
#bo_gall .gall_con .gall_href .l_info,
#bo_gall .gall_con .gall_href .l_info a { font-size:1em; }
#bo_gall .gall_con .gall_href .l_info .subject { }
#bo_gall .gall_con .gall_href .l_info .subject a { font-weight:500; font-size:1.2em; }
#bo_gall .gall_con .gall_href .l_info .info_list { padding-right:10px; }
#bo_gall .gall_con .gall_href .l_info .info_list p { padding:1px 0; }
#bo_gall .gall_con .gall_href .l_info .info_list p.i_subject {  }
#bo_gall .gall_con .gall_href .l_info .info_list p.i_tel a,
#bo_gall .gall_con .gall_href .l_info .info_list p.i_mail a { color:#666; }
#bo_gall .gall_con .gall_href .l_info .info_list p.i_work { color:#666; word-break:keep-all; font-size:0.9em; padding-top:4px; }
#bo_gall .gall_con .gall_href .l_info .info_list p.i_work span { padding-right:4px; }
#bo_gall .gall_con .gall_href .l_link { position:absolute; right:0; top:0; z-index:1; text-align:center; }
#bo_gall .gall_con .gall_href .l_link a { display:block; width:56px; height:56px; line-height:56px; background:#1a1a1a; color:#fff; font-size:0.85em; font-weight:500; }
#bo_gall .gall_con .gall_href .l_link a:hover { }






/* ================================================== 
	보기
===================================================== */
#bo_story { clear:both; width:100%; height:auto; overflow:hidden; border:1px solid #ddd; }
#bo_story div { box-sizing:border-box; font-size:13px; }

#bo_story .story_in { padding:25px 30px; }

/********************************* 좌측 *********************************/
#story_left { float:left; width:75%; max-width:900px; min-height:800px; border-right:1px solid #ddd; padding-bottom:30px; position:relative; }

/* 타이틀 영역 */
#story_left #story_title { text-align:left; }
#story_left #story_title .v_img { display:inline-block; vertical-align:middle; width:130px; height:185px; margin:0 auto; background:url("./img/noimg.png") center center no-repeat; background-size:100%; }
#story_left #story_title .v_img img { width:100%; height:100%; }
#story_left #story_title .v_info { display:inline-block; vertical-align:middle; padding-left:30px; min-width:300px; }
#story_left #story_title .v_info .v_info_tit { border-bottom:1px solid #ddd; }
#story_left #story_title .v_info .v_info_tit h2 { position:relative; display:inline-block; padding-bottom:5px; }
#story_left #story_title .v_info .v_info_tit h2:before { content:""; position:absolute; bottom:-1px; left:0; width:100%; height:2px; background:#363636; }
#story_left #story_title .v_info .v_info_tit h2 span { color:#888; font-weight:normal; }
#story_left #story_title .v_info .v_info_wr { padding-top: 30px; }
#story_left #story_title .v_info .v_info_wr p { font-size:1.07em; }

/* 이미지 슬라이드 영역 */
#story_left #bo_v_img { width:100%; overflow:hidden; zoom:1; padding:0 30px; }
#story_left #bo_v_img:after { display:block; visibility:hidden; clear:both; content:""; }
#story_left #bo_v_img a { display:block; }
#story_left #bo_v_img img { width:100%; height:auto; }

/* 탭 영역 */
#story_left .css3-tab {
	clear:both; 
	position:relative;
	width:100%;
}
#story_left .css3-tab input[type="radio"] {
	display:none;
}
#story_left .css3-tab .css3-tab-nav {
	/* display:table; */
	/* table-layout:fixed; */
	width:100%;
	padding:0 25px;
	font-size:0; 
}
#story_left .css3-tab .css3-tab-nav label {
	/* display:table-cell; */
	display:inline-block; 
	min-width:150px; 
	padding:8px 30px;
	text-align:center; 
	background-color:#e1e1e1;
	border-radius:6px 6px 0 0;
	box-shadow:inset 0 -6px 10px 0px #d9d9d9;
	font-size:15px;
	color:#666;
	font-weight:500;
	transition:all .3s;
	transform-origin:50% 90%;
}
#story_left .css3-tab .css3-tab-nav label:hover {
	cursor:pointer;
	color:#acacac;
	transition:all .3s ease 0s;
}
#story_left .css3-tab .css3-tab-content {
	display:none;
	clear:left;
	overflow:hidden;
	width:100%;
	height:auto;
	min-height:300px;
	background:#fcfcfc;
	border:10px solid #f7f7f7;
	padding:30px 20px;
	word-break:keep-all;
	line-height:1.8;
	font-size:1.2em;
}
#story_left .css3-tab .css3-tab-content img {
	max-width:100%;
	height:auto;
}
#story_left .css3-tab input[id="tabOne"]:checked ~ .css3-tab-nav label[for="tabOne"] {
	cursor:default;
	background-color:#eee;
	box-shadow:none;
	font-weight:bold;
	color:#333;
	z-index:1;
	transform:scale(1.15);
}
#story_left .css3-tab input[id="tabOne"]:checked ~ div.tab-one {
	display:block;
}
#story_left .css3-tab input[id="tabTwo"]:checked ~ .css3-tab-nav label[for="tabTwo"] {
	background-color:#eee;
	box-shadow:none;
	font-weight:bold;
	color:#333;
	z-index:1;
	transform:scale(1.15);
	cursor:default;
}
#story_left .css3-tab input[id="tabTwo"]:checked ~ div.tab-two {
	display:block;
}
#story_left .css3-tab input[id="addNew"]:checked ~ .css3-tab-nav label[for="addNew"] {
	background-color:#eee;
	box-shadow:none;
	font-weight:bold;
	color:#333;
	z-index:1;
	transform:scale(1.15);
	cursor:default;
}
#story_left .css3-tab input[id="addNew"]:checked ~ div.add-new {
	display:block;
}



/********************************* 우측 *********************************/
#story_right { float:right; width:25%; text-align:center; }

/* 주요업무 */
#story_right .v_info { clear:both; border-bottom:1px solid #ddd; }
#story_right .v_info p { font-size:1.07em; font-size:0; }
#story_right .v_info span { display:inline-block; background:#eee; border-radius:20px; padding:4px 12px; color:#555; word-break:keep-all; margin:2px 2px; font-weight:bold; font-size:13px; }

/* 공유하기 */
#story_right .share_btn { clear:both; border-bottom:1px solid #ddd; }
#story_right .share_btn a { display:inline-block; padding:0 2px; }

/* 이전, 다음 */
.bo_v_nb_custom { clear:both; }
.bo_v_nb_custom:after { display:block; visibility:hidden; clear:both; content:""; }
.bo_v_nb_custom > div a { display:block; background:#fff; border:1px solid #ddd; padding:0 15px; line-height:34px; font-size:12px; }
.bo_v_nb_custom > .btn_prv,
.bo_v_nb_custom > .btn_next { display:inline-block; margin:0 2px; transition:all 0.1s ease-out; }
.bo_v_nb_custom > .btn_prv { }
.bo_v_nb_custom > .btn_next { }





/* ================================================== 
	반응형
===================================================== */
@media (max-width:1024px) {
	#bo_gall .gall_li { padding:20px; }
	#bo_gall .gall_con .gall_href { padding-left:0; }
	#bo_gall .gall_con .gall_href .l_img { position:static; top:inherit; left:inherit; margin:0 auto; }
	#bo_gall .gall_con .gall_href .l_info .info_list p.i_work { font-size:1em; }

	#bo_story .story_in { padding:20px 20px; }
	#story_left, 
	#story_right { float:none; clear:both; width:100%; max-width:100%; }
	#story_left { min-height:auto; border-right:0; padding-bottom:0; }
	#story_left .css3-tab { padding-top:40px; }
	#story_right { background:#f7f7f7; border-top:1px solid #ddd; }
	#story_right .v_info span { border:1px solid #ddd; }
}


@media (max-width:768px) {
	#bo_gall #gall_ul { margin-left:0; }
	#bo_gall .gall_li { 
		float:none; 
		width:100%; 
		margin-left:0; 
		padding:20px 20px 60px; 
	 }
	#bo_gall .gall_con .gall_href .l_info { padding-top:5px; text-align:center; }
	#bo_gall .gall_con .gall_href .l_info .subject:after { left:50%; margin-left:-10px; }
	#bo_gall .gall_con .gall_href .l_link { position:absolute; right:0; left:0; top:inherit; bottom:0 ;z-index:1; text-align:center; }
	#bo_gall .gall_con .gall_href .l_link a { display:block; width:100%; height:40px; line-height:40px; background:#1a1a1a; color:#fff; font-size:1em; font-weight:500; }
	#bo_gall .gall_con .gall_href .l_link a:hover { }

	#story_left .css3-tab { padding:10px 20px; }
	#story_left .css3-tab .css3-tab-nav { padding:0; }
	#story_left .css3-tab .css3-tab-nav label {
		min-width:auto;
		width:50%;
		padding:10px 10px;
		border-radius:0;
		font-size:14px;
	}
	#story_left .css3-tab input[id="tabOne"]:checked ~ .css3-tab-nav label[for="tabOne"] {
		transform:scale(1);
	}
	#story_left .css3-tab input[id="tabTwo"]:checked ~ .css3-tab-nav label[for="tabTwo"] {
		transform:scale(1);
	}
	#story_left .css3-tab input[id="addNew"]:checked ~ .css3-tab-nav label[for="addNew"] {
		transform:scale(1);
	}
	#story_left .css3-tab .css3-tab-content { min-height:auto; padding:20px 15px 25px; border:0; font-size:1em; }
}


@media (max-width:640px) {
	#story_left #story_title .v_img,
	#story_left #story_title .v_info { display:block; }
	#story_left #story_title .v_info { padding-left:0; padding-top: 30px; }
}