@charset "utf-8";

/*공통*/
#ctn p, #ctn ul {text-align:left;}
#ctn h4 {text-align:left; font-size:28px; margin:40px 0 20px;}
#ctn h5 {text-align:left; font-size:24px; margin:30px 0 20px; background:url('/design/repa/img/layout/h5_bl.png') no-repeat 0 12px;}
#ctn h4 {text-align:left; font-size:28px; margin:40px 0 20px;}
#ctn h4.first {margin:0 0 20px;}
#ctn h5.first {margin:0 0 20px;}

/*리스트*/
.dept01 {margin:10px 0 20px;}
.dept01 > li {overflow:hidden; margin:5px 0; padding-left:15px; background:url('/design/repa/img/layout/dept01.png') no-repeat 0 12px;}
.dept02 {margin:5px 0 10px;}
.dept02 > li {margin:3px 0; padding-left:15px; background:url('/design/repa/img/layout/dept02.png') no-repeat 0 12px;}

/*박스*/
.box {background:#f6f6f6; padding:30px; border-radius:15px 0 15px 0;}
.imgbox {border:1px solid #ddd; border-radius:15px; padding:50px;}
.box.top_member {background:url('/design/repa/img/content/member_bg.png') no-repeat 10% center #f6f6f6; padding:50px;}
.box.top_member p, .box.top_member ul {padding-left:30%; margin:0;}


@media all and (max-width:750px){
	#ctn h4 {font-size:24px; margin:40px 0 15px;}
	.imgbox {padding:30px;}
	.box.top_member {background-position:center 30px; padding:30px;}
	.box.top_member p, .box.top_member ul {padding:220px 0 0 0;}
}
@media all and (max-width:480px){
	.imgbox {padding:20px;}
}


/*테이블*/
.tbl_area {overflow-x:auto; margin:20px 0; clear:both;}
.tbl_type1 {border-collapse: separate; border-top:1px solid #555; margin-left:-1px; width:100%; }
.tbl_type1 thead th {background:#f4f4f4; font-size:18px; padding:15px; border-left:1px solid #c4c4c4; border-bottom:1px solid #c4c4c4; text-align:center; }
.tbl_type1 tbody th {background:#fafafa; font-size:18px; font-weight:500; }
.tbl_type1 tbody td, .tbl_type1 tfoot td {background:#fff; font-size:18px; }
.tbl_type1 tbody th, .tbl_type1 tbody td, .tbl_type1 tfoot th, .tbl_type1 tfoot td { border-left:1px solid #d4d4d4; border-bottom:1px solid #d4d4d4; text-align:center; padding:15px; word-break:break-all;}
.no_data {text-align:center;}

.tbl_type.board {border-collapse: separate; border-top:2px solid #000; margin-left:-1px; width:100%; }
.tbl_type.board thead th {font-size:18px; padding:15px; border-bottom:1px solid #000; text-align:center; background:url('/design/repa/img/layout/board_th_line.gif') no-repeat left center;}
.tbl_type.board thead th:first-child {background:none;}
.tbl_type.board tbody th {background:#fafafa; font-size:18px; font-weight:500; }
.tbl_type.board tbody td, .tbl_type.board tfoot td {background:#fff; font-size:18px; }
.tbl_type.board tbody th, .tbl_type.board tbody td, .tbl_type.board tfoot th, .tbl_type.board tfoot td {border-bottom:1px solid #ddd; text-align:center; padding:20px 15px; word-break:break-all;}
.tbl_type.board tbody td a.blank span {background:url('/design/repa/img/layout/board_blank.gif') no-repeat right center; padding-right:20px;}
.tbl_type.board tbody td a.view {display:inline-block; overflow:hidden; border:3px solid #026cba; text-transform:uppercase; font-size:18px; font-weight:500; border-radius:100px; padding:8px 20px; transition:all 0.3s;}
.tbl_type.board tbody td a.view span {background:url('/design/repa/img/layout/board_view.png') no-repeat left center; padding-left:30px;}
.tbl_type.board tbody td a.view:hover {background:#026cba; color:#fff;}
.tbl_type.board tbody td a.view:hover span {background:url('/design/repa/img/layout/board_view_w.png') no-repeat left center;}

@media all and (max-width:1023px){
	/*.tbl_type.board tbody th, .tbl_type.board tbody td, .tbl_type.board tfoot th, .tbl_type.board tfoot td {white-space:nowrap;}*/
	.tbl_type.board tbody td img {max-width:none;}

}
@media all and (max-width:600px){
	.tbl_type1 tbody th, .tbl_type1 tbody td, .tbl_type1 tfoot th, .tbl_type1 tfoot td {white-space:nowrap;}
}


/* button */
.btn_style_wrap {margin-top:30px; text-align:center;}
.btn_style {display:inline-block; overflow:hidden; border:2px solid #026cba; text-transform:uppercase; font-size:18px; font-weight:500; border-radius:100px;}
.btn_style span {display:inline-block; position:relative; padding:10px 30px 10px 60px; transition:all 0.3s;}
.btn_style.down span {background:url('/design/repa/img/layout/ico_down.png') no-repeat 30px center;}
.btn_style.view span {background:url('/design/repa/img/layout/board_view.png') no-repeat 30px center;}
.btn_style.blank span {background:url('/design/repa/img/layout/ico_blank.png') no-repeat 30px center;}
.btn_style.down:hover span {background:url('/design/repa/img/layout/ico_down_w.png') no-repeat 30px center;}
.btn_style.view:hover span {background:url('/design/repa/img/layout/ico_view_w.png') no-repeat 30px center;}
.btn_style.blank:hover span {background:url('/design/repa/img/layout/ico_blank_w.png') no-repeat 30px center;}
.btn_style:hover {background-color:#026cba; color:#fff;}
.btn_style2 {display:inline-block; overflow:hidden; border:2px solid #111; text-transform:uppercase; font-size:16px; font-weight:500; border-radius:100px;}
.btn_style2 span {display:inline-block; position:relative; padding:5px 15px 5px 45px; transition:all 0.3s;}
.btn_style2.down span {background:url('/design/repa/img/layout/ico_down.png') no-repeat 15px center;}
.btn_style2.view span {background:url('/design/repa/img/layout/board_view.png') no-repeat 15px center;}
.btn_style2.blank span {background:url('/design/repa/img/layout/ico_blank.png') no-repeat 15px center;}
.btn_style2.down:hover span {background:url('/design/repa/img/layout/ico_down_w.png') no-repeat 15px center;}
.btn_style2.view:hover span {background:url('/design/repa/img/layout/board_view_w.png') no-repeat 15px center;}
.btn_style2.blank:hover span {background:url('/design/repa/img/layout/ico_blank_w.png') no-repeat 15px center;}
.btn_style2:hover {background-color:#111; color:#fff;}
a.text_blank, a.text_link, a.list_link {background:url('/design/repa/img/layout/ico_blank.png') no-repeat right center; padding-right:15px; color:#026cba;}
a.text_blank:hover, a.text_link:hover, a.list_link:hover {color:#004089; text-decoration:underline;}
.btnL {display:inline-block; border:2px solid #111; text-transform:uppercase; font-size:18px; font-weight:500; border-radius:100px; padding:10px 40px; transition:all 0.3s;}
.btnL:hover {background-color:#111; color:#fff;}
.btnL.blue {display:inline-block; border:2px solid #026cba; text-transform:uppercase; font-size:18px; font-weight:500; border-radius:100px; padding:10px 40px; transition:all 0.3s;}
.btnL.blue:hover {background-color:#026cba; color:#fff;}


/*caution*/
.caution span {background:url('/design/repa/img/layout/caution.png') no-repeat 0 3px; font-size:18px; padding-left:28px;}


/*회원사소개*/
.membership {border-top:2px solid #000; margin-top:20px;}
.membership ul li {overflow:hidden; padding:20px 0; border-bottom:1px solid #ddd;}
.membership ul li p {float:left; display:table-cell; vertical-align:middle; height:110px; text-align:center !important; position:relative;}
.membership ul li p > a,
.membership ul li p > span {position:absolute; left:50%; top:50%; transform:translate(-50%,-50%);}
.membership ul li p.rank {width:15%;}
.membership ul li p.photo {width:15%;}
.membership ul li p.office {width:20%;}
.membership ul li p.name {width:15%;}
.membership ul li p.pos {width:15%;}
.membership ul li p.info {width:20%;}
.membership ul li p.info a.view {display:inline-block; overflow:hidden; border:3px solid #026cba; text-transform:uppercase; font-size:18px; font-weight:500; border-radius:100px; padding:8px 20px; transition:all 0.3s;}
.membership ul li p.info a.view span {background:url('/design/repa/img/layout/board_view.png') no-repeat left center; padding-left:30px;}
.membership ul li p.info a.view:hover {background:#026cba; color:#fff;}
.membership ul li p.info a.view:hover span {background:url('/design/repa/img/layout/board_view_w.png') no-repeat left center;}
.membership ul li p.office a.blank span {background:url('/design/repa/img/layout/board_blank.gif') no-repeat right center; padding-right:20px;}
.membership ul li p.office a {width:100%;}
.membership ul li p.name span {width:100%;}

@media all and (max-width:750px){
	.membership ul li {padding:20px 0 0 0;}
	.membership ul li p.rank {height:40px; background:#f6f6f6; width:100%;}
	.membership ul li p.photo {clear:both; width:100%; text-align:center; margin:20px 0;}
	.membership ul li p.office {clear:both;}
	.membership ul li p.office,
	.membership ul li p.name,
	.membership ul li p.pos ,
	.membership ul li p.info {width:25%; border-top:1px dotted #ddd; height:80px;}
}
@media all and (max-width:650px){
	.membership ul li p.office,
	.membership ul li p.name,
	.membership ul li p.pos {width:33.3%; height:40px;}
	.membership ul li p.info {clear:both; width:100%; margin:0 auto;}
}
@media all and (max-width:500px){
	.membership ul li {border-bottom:1px solid #999;}
	.membership ul li p.office,
	.membership ul li p.name,
	.membership ul li p.pos,
	.membership ul li p.info {clear:both; width:100%; margin:0 auto; border-top:1px dotted #bbb;}
}


/*회원사소개 수정 211210*/
.memberList > ul {overflow:hidden;}
.memberList > ul > li {float:left; width:49%; overflow:hidden; margin-left:2%; border:1px solid #ddd; padding:20px; margin-top:20px; position:relative; min-height:240px;}
.memberList > ul > li:nth-child(2n+1) {margin-left:0; clear:both;}
.memberList > ul > li .img { float:left; width:150px;}
.memberList > ul > li .img img {width:100%; height:auto !important; }
.memberList > ul > li dl {float:right; width:calc(100% - 180px);}
.memberList > ul > li dl dt {font-size:25px; font-weight:600; margin:0 0 10px; }
.memberList > ul > li dl dt a {display:inline-block; overflow:hidden; cursor:inherit;}
.memberList > ul > li dl dt a span {float:left;}
.memberList > ul > li dl dt a.none {cursor:inherit;}
.memberList > ul > li dl dt a span.logo img {max-width:100px; height:21px; margin-top:12px; margin-right:12px;}
.memberList > ul > li dl dt a[target="_blank"] span:last-child {padding-right:20px; background:url('/design/repa/img/layout/board_blank.gif') no-repeat right center; cursor:pointer;}
.memberList > ul > li dl a.view {float:right; overflow:hidden; border:3px solid #026cba; text-transform:uppercase; font-size:18px; font-weight:500; border-radius:100px; padding:8px 20px; transition:all 0.3s;}
.memberList > ul > li dl a.view span {background:url('/design/repa/img/layout/board_view.png') no-repeat left center; padding-left:30px;}
.memberList > ul > li dl a.view:hover {background:#026cba; color:#fff;}
.memberList > ul > li dl a.view:hover span {background:url('/design/repa/img/layout/board_view_w.png') no-repeat left center;}
.memberList > ul > li dl dd .dept01 > li strong {float:left; width:120px;}
.memberList > ul > li dl dd .dept01 > li span {display:inline-block; position:relative; padding-left:10px; margin-left:10px;}
.memberList > ul > li dl dd .dept01 > li span:before {content:''; position:absolute; top:50%; left:0; width:1px; height:15px; background:#ddd; margin-top:-7px;}
.memberList.type3 > ul > li {min-height:200px; width:32%;}
.memberList.type3 > ul > li dl {width:100%;}
.memberList.type3 > ul > li:nth-child(2n+1) {clear:none; margin-left:2%;}
.memberList.type3 > ul > li:nth-child(3n+1) {margin-left:0; clear:both;}
.memberList.type3 > ul > li dl dd .dept01 > li span:before {display:none;}
@media all and (max-width:1200px){
	.memberList > ul > li dl a.view {font-size:16px; padding:5px 10px;}
	.memberList > ul > li dl dt a span {float:none;}
	.memberList > ul > li dl dt a span.logo {display:block;}
	.memberList > ul > li dl dt a span.logo img {height:21px; margin-bottom:7px; margin-right:0;}
}
@media all and (max-width:1023px){
	.memberList > ul > li .img {float:none; width:120px; margin:0 auto;}
	.memberList > ul > li dl {float:none; padding:10px; margin-top:15px; border-top:1px dotted #ccc; width:100%;}
	.memberList > ul > li dl a.view {float:none; font-size:18px; padding:8px 20px;}
	.memberList > ul > li dl a.view {position:static; margin:0 auto;}
	.memberList > ul > li dl dd:last-child {text-align:center;}
	.memberList.type3 > ul > li {width:49%; padding:10px; min-height:auto;}
	.memberList.type3 > ul > li:first-child {margin-left:0 !important;}
	.memberList.type3 > ul > li:nth-child(3n+1) {margin-left:2%; clear:none;}
	.memberList.type3 > ul > li:nth-child(2n+1) { clear:both; margin-left:0;}
	.memberList.type3 > ul > li dl {margin-top:0; border-top:0;}
	.memberList.type3 > ul > li dl dt {font-size:20px;}
	.memberList.type3 > ul > li dl dd .dept01 {margin:10px 0 0 0;}
}
@media all and (max-width:700px){
	.memberList > ul > li {width:100%; margin-left:0; min-height:auto;}
	.memberList > ul > li .img {float:left; width:100px;}
	.memberList > ul > li dl {float:right; width:calc(100% - 130px); margin-top:0; border-top:0; padding-top:0;}
	.memberList > ul > li dl a.view {position:absolute; top:15px; bottom:auto; right:15px; font-size:13px; padding:5px 10px; border:2px solid #026cba;}
	.memberList > ul > li dl dt {font-size:22px;}
	.memberList > ul > li dl dt > span {font-size:17px; margin:0 0 0 10px; padding-left:10px;}
	.memberList > ul > li dl dd .dept01 {margin:0 !important;}
	.memberList > ul > li dl dd .dept01 > li {font-size:16px !important;}
	.memberList > ul > li dl dd .dept01 > li strong {width:100px;}
	.memberList.type3 > ul > li {width:100%; margin-left:0; margin-top:5px;}
	.memberList.type3 > ul > li:nth-child(3n+1) {margin-left:0;}
}
@media all and (max-width:480px){
	.memberList > ul > li .img {width:90px;}
	.memberList > ul > li dl {width:calc(100% - 100px);}
	.memberList > ul > li dl a.view {position:absolute; top:15px; bottom:auto; right:15px; font-size:13px; padding:5px 10px; border:2px solid #026cba;}
	.memberList > ul > li dl dt {font-size:20px;}
	.memberList > ul > li dl dt > span {font-size:17px; margin:0 0 0 10px; padding-left:0; border:0;}
	.memberList > ul > li dl dd .dept01 > li {font-size:16px !important;}
	.memberList > ul > li dl dd .dept01 > li strong {width:50px;}
}
@media all and (max-width:450px){
	.memberList > ul > li dl a.view {position:absolute; top:auto; bottom:20px; right:auto; left:20px; font-size:13px; padding:3px 10px; border:2px solid #026cba;}
	.memberList > ul > li dl a.view span {background-size:15px; padding-left:18px;}
	.memberList > ul > li dl a.view:hover span {background-size:15px; }
}
