/*board_top_box*/
.board_topbox{border:6px solid #ececec; padding:18px 30px; margin-bottom:40px;}
.board_topbox ul li{margin: 5px 10px 3px 0; float:left; line-height:40px;}
.board_topbox ul li a{display:inline-block; height:40px; line-height:40px; font-size:18px; color:#507895; position: relative; padding:0 24px;}
.board_topbox ul li a::after{content:''; width:4px; height:4px; background:#a2a2a2; display:block;position: absolute; left: 10px; top: 50%;}
.board_topbox ul li.on a{background:#202e70; color:#fff; padding:0 24px 0 35px}
.board_topbox ul li.on a:after{background:url(/_res/hf/ko/img/spr_spot.png) no-repeat -431px, -238px; width:14px; height:20px; left:10px; top:15px;}

@media all and (max-width:768px) {
	.board_topbox{border:none; padding:0; margin-bottom:25px;}
	.board_topbox ul {}
    .board_topbox ul  li{display:none;float:none;width:100%;box-sizing:border-box; text-align: left; padding-left:0; border:none; margin: 0; }
	.board_topbox ul  li a{width:100%;}
    .board_topbox ul  li.on{display:block; border-left:none;}
    .board_topbox ul  li.on,.board_topbox ul li:hover{background-color:#fff;border:1px solid #666;}
    .board_topbox ul  li.on a,.board_topbox ul li:hover a{ border-left:none;background: #fff url(/_res/hf/ko/img/selarr_btn.png)no-repeat 98% 50%; color:#000; }
		
	.board_topbox ul li.on a:after{display:none;}
	.board_topbox ul li a::after{display:none;}
	.board_topbox ul li.on a{padding:0 0px 0 22px}
	


}

/*검색부분*/
.board-head-wrap{display: flex; justify-content: space-between;align-items: center; margin-bottom:20px; font-size:16px;}
.board-head-wrap .page-number-wrap{display: flex; color:#272727; font-weight: 500;font-size:20px; }
.board-head-wrap .total-list-number span{color:#0054a4;}

.board-head-wrap select.custom-select{width:130px;  }
.board-head-wrap input.custom-input{width:218px; padding: 0 10px;  box-sizing: border-box; margin-right: -3px;}
.board-head-wrap .custom-submit{width:100px;   padding:0; background-color:#5f6062; color:#fff; border:1px solid #5f6062;     height: 50px;}




/* 일반게시판: bod_list */
.board_wrap {border-top:2px solid #314a66; }
.bod_list{width: 100%; text-align: center; word-break: break-all;table-layout: fixed; font-size:18px; border-top:2px solid #314a66; }
.bod_list thead th{padding:20px 0; background:#f3f5f7; color:#000; font-weight: 500;}
.bod_list thead{border-bottom:1px solid #dddfe5;}
.bod_list tbody td{padding:20px 0; border-bottom: 1px solid #dddfe5; color: #333333;position: relative;vertical-align: middle;line-height: 120%;}

.ico_new {width: 24px;height: 24px;background: #ff4141; display: inline-block;text-align: center;border-radius: 50%;margin-left: 5px;position: relative;vertical-align: top;}
.ico_new:before {content: 'N';display: inline-block;color: #fff;border-radius: 2px;font-size: 1.5rem;font-weight: 600;position: absolute;left: 7px;top:0px; line-height: 24px;}
.ico_key {width: 20px;height: 24px;display: inline-block;text-align: center;margin-left: 5px;position: relative;vertical-align: top;}
.ico_key:before {content: '';display: inline-block; width: 20px;height: 24px;  position: absolute;left: 0px;top:0px; background-image:url(/_res/hf/ko/img/icon_Key.gif);}


/* 게시판 td 너비가 필요할 때 사용 */
.list_num {width: 8%;}
.list_division{width:12%; color:#003875 !important; font-weight:400;}
.list_file {width: 10%;}
.list_write {width: 10%;}
.list_answer {width: 10%;}
.list_state {width: 10%; font-weight: 500;}
.list_date {width: 12%; }
.list_hit {width: 8%;}
.list_part{display:none;}

td.list_tit {text-align: left;padding-left: 0.5rem !important;}
td.list_tit a {color: #000;}
td.list_tit >span {display:inline-block;}
td.list_tit strong {color: #fff;background: #ff4e00;border-radius: 4px;padding: 0 5px;margin-right: 2px;font-size: 1.3rem;}
td.list_tit img[src$='ico_reply.gif'] {margin-right: 8px;}
td.list_file img {position: absolute;left: 50%;top: 50%;-webkit-transform: translate(-50%, -50%);-ms-transform: translate(-50%, -50%);transform: translate(-50%, -50%);}
.is-ie td.list_file img {transform: translate(-50%, 0%);} /* ie전용 */
td.list_date, td.list_hit{color:#666; font-weight:400;}
.notice_state {color:#0077c9; padding:5px 15px; font-size:1.5rem; border:1px solid #0077c9; font-weight: 600;}
.notice_state.mnotice{display:none;}

/** 게시판 등록 **/
.bod_write{width: 100%; text-align: center; word-break: break-all;table-layout: fixed; font-size:16px; border-top:2px solid #314a66; text-align: left;}
.bod_write th{padding:10px 20px;  box-sizing:border-box; color:#000; font-weight:500;  border-bottom: 1px solid #dddfe5; border-right: 1px solid #dddfe5; }
.bod_write th span{padding-left:25px;}
.bod_write th span.key{background:url(/_res/hf/ko/img/th_key.png) no-repeat 0 6px;    }
.bod_write td{padding:10px 0px 10px 20px;  border-bottom: 1px solid #dddfe5;}
.bod_write td input[type="text"]{background:#f4f4f4; border:0;}
.bod_write td select,.bod_write td textarea{background-color:#f4f4f4; border:0;}
.bod_write td .mail_size{width:33.3%;}
.bod_write td .input_tel{width:20%;}
.bod_write td .input_post{width:200px; margin-bottom:5px;}
.write_wp{width:20%;}


.file_input label {position: relative;  cursor: pointer;  display: inline-block;  vertical-align: middle;  overflow: hidden; width: 100px; height: 50px;  background: #9fa1a4; color: #fff; text-align: center;  line-height: 50px;}
.file_input label input {position: absolute;  width: 0;  height: 0;   overflow: hidden;}
.file_input input[type=text] { vertical-align: middle;  display: inline-block;  width: 300px;  line-height: 28px; padding: 0;  border: 0; }











/*페이징*/
.pagenation{display:flex; justify-content: center; margin-top:40px}
.pagenation > span, .pagenation > a {display:flex;justify-content:center; align-items:center;width: 38px;height: 38px; font-size:16px;}
.pagenation > span{background-color:#0154a4; color:#fff; border-radius:50%;}
.pagenation a.btn_first,
.pagenation a.btn_prev,
.pagenation a.btn_next,
.pagenation a.btn_end{border:1px solid #cccbcb; background-repeat:no-repeat; background-position:center; text-indent:-9999px; border-radius:50%; }
.pagenation a.btn_first{background-image:url("/_res/hf/ko/img/pagenation-first-btn.png"); margin-right: 10px;}
.pagenation a.btn_prev{background-image:url("/_res/hf/ko/img/pagenation-prev-btn.png");     margin-right: 10px;}
.pagenation a.btn_next{background-image:url("/_res/hf/ko/img/pagenation-next-btn.png"); margin: 0 10px;}
.pagenation a.btn_end{background-image:url("/_res/hf/ko/img/pagenation-last-btn.png");}



/*페이징*/
.paging-navigation{display:flex; justify-content: center; margin:20px 0;}
.paging-navigation > strong, .paging-navigation > a {display:flex;justify-content:center; align-items:center;width: 30px;height: 30px; font-size:16px;}
.paging-navigation > strong{background-color:#0154a4; color:#fff; border-radius:50%;}
.paging-navigation a.btn-first,
.paging-navigation a.btn-preview,
.paging-navigation a.next,
.paging-navigation a.prev,
.paging-navigation a.btn-last{border:1px solid #cccbcb; background-repeat:no-repeat; background-position:center; text-indent:-9999px; border-radius:50%; }
.paging-navigation a.btn-first{background-image:url("/_res/hf/ko/img/pagenation-first-btn.png"); margin-right: 5px;}
.paging-navigation a.btn-preview, .paging-navigation a.prev{background-image:url("/_res/hf/ko/img/pagenation-prev-btn.png");     margin-right: 5px;}
.paging-navigation a.next{background-image:url("/_res/hf/ko/img/pagenation-next-btn.png"); margin-right: 5px;}
.paging-navigation a.btn-last{background-image:url("/_res/hf/ko/img/pagenation-last-btn.png");}




/*view*/
.boardview{font-size:16px;}
.bod_view {border-top: 2px solid #585858; padding-bottom:20px; border-bottom:1px solid #ddd;}
.view_info {border-bottom:1px solid #ddd; }
.view_info:after {display: block;clear: both;content: '';}
.view_info p.title {font-size:20px; line-height:2.0rem;  color:#000; border-bottom:1px solid #ddd; padding:30px; background:#f7f7f7; font-family: 'NotoKrM'; }

.view_info ul {padding:20px 30px;}
.view_info ul li {width:50%; float:left;}
.view_info ul li span{color:#000; font-weight:500; width: 80px; display: inline-block;}

.view_cont{padding:15px 30px; font-size:17px;}
.answer_box{background:#f8f8f8; padding:30px; font-size:17px; margin:30px 0 55px 0;}
.answer_box .respondent{color:#000; font-size:18px; font-weight:600; margin-bottom:15px;}
.answer_box .respondent span{color:#666666; font-size:16px; font-weight:400; margin-left:20px;}
.answer_box .answer_tit{font-size:20px; color:#333; margin-bottom:25px; background:url(/_res/hf/ko/img/answer_re.png) no-repeat 0 2px; padding-left:55px;}

.view_file li{display: flex;  background: #f8f8f8; margin-bottom: 2px; font-size: 16px; padding: 17px 30px; align-items: center;}
.view_file .file_link a{color:#222; padding-left:35px; position: relative; font-weight:500;}
.view_file .file_link a:after{content:''; display:block;  position: absolute; background:url(/_res/hf/ko/img/icon_file.gif); top:3px; left:5px; width: 18px; height: 22px;}

.view_file .file_btn{margin-left:25px;}
.view_file .file_btn span{padding:0px 8px; border:1px solid #d7dae1; display:inline-block;}
.view_file .file_btn span{ font-size:14px; color:#555; display: inline-block; background:#fff url(/_res/hf/ko/img/icon_view.gif) no-repeat 9px center; padding-left:30px;}
.view_file .file_btn span.file-down{display:inline-block; background:#fff url(/_res/hf/ko/img/icon_down.gif) no-repeat center center; text-indent: -999999px;}


.board_bottom{display: flex; flex-direction: column;}

div.board_control {position:relative;  border-top:1px solid #dedede; }
div.board_control::after {content:''; display:block; clear:both;}
div.board_control div {box-sizing:border-box; color:#666;  display: flex;}
div.board_control div.prev, div.board_control div.next { border-bottom:1px solid #dedede; padding:20px}

div.board_control p {color:#000; position:relative; font-weight:500; padding:0 20px 0 35px; width:120px; }
div.board_control div.prev p::after {content:''; width:13px; height:7px; display:block; position:absolute; top:12px; left:0; background:url(/_res/hf/ko/img/board_icon.png) no-repeat -53px -53px}
div.board_control div.next p::after {content:''; width:13px; height:7px; display:block; position:absolute; top:12px; left:0; background:url(/_res/hf/ko/img/board_icon.png) no-repeat -54px -114px}


/*갤러리 게시판*/
.gallery_wrap{border-top: 2px solid #000; padding-top:20px;}
.gallery_list{padding-bottom: 20px; margin-bottom: 20px; border-bottom: 1px solid #ddd;} 
.gallery_list a{display: flex; align-items: center; color:#333;}
.gallery_list .img{width:335px; height:175px; margin-right:35px; overflow:hidden;     line-height: 1;}
.gallery_list .img img{width:100%; transition:all .5s; }
.gallery_list .days{width:100px; font-size:18px; color:#666666; text-align: right; font-weight:400;}
.gallery_list .subject{width:calc(100% - 490px); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; box-sizing: border-box;    transition: all .2s;}
.gallery_list a:hover .img img{transform: scale3d(1.1,1.1,1.1); -webkit-transform: scale3d(1.1,1.1,1.1); -moz-transform: scale3d(1.1,1.1,1.1);}


/* 버튼 */
.board_btn{margin:20px 0; }
.btn {transition:all .2s; padding: 10px 30px; border:1px solid #5f6062; position:relative; font-size:16px; margin-bottom:3px; margin-left:5px; display:inline-block;}
.btn.icon::after {content:''; display:inline-block; vertical-align: middle; width:22px; height:17px; background-image:url(/_res/hf/ko/img/board_icon.png);background-repeat:no-repeat; margin-left:35px;}
.btn.icon.default::after {background-position:-254px -53px;}

.btn.icon.modify{color:#fff; background-color:#01407c;}
.btn.icon.modify::after {background-position:-254px -115px;}

.btn.icon.delete{background-color:#5f6062; color:#fff;}
.btn.icon.delete::after {background-position:-254px -115px;}

.post{background:#fff; border:1px solid #9fa1a4; padding:0px 20px; height:50px; vertical-align: top;}

@media screen and (max-width:900px) {
	.board-head-wrap{display:block}
	.board-search-wrap{margin-top:10px}
	.board-head-wrap select.custom-select {width: 32%;}
	.board-head-wrap input.custom-input {width: calc(68% - 100px); font-size: 14px;}
	.board-head-wrap input.custom-input-select2{width: calc(100% - 300px);}
	.board-head-wrap input.custom-submit{width: 90px;}
	.board-head-wrap .custom-submit{font-size: 14px; width: 70px;}
  
	
	/*갤러리 게시판*/
	.gallery_list a{display: block; padding:0 30px;}
	.gallery_list .img{width:100%; height:auto; margin-right:0px; margin-bottom:20px;}
	.gallery_list .img img{width:100%; }
	.gallery_list .days, .gallery_list .subject{width:100%;}
	.gallery_list .days{text-align: left; }
	
	/* 일반게시판 */
	.bod_list tbody tr{position: relative;}
	.bod_list tbody td, .bod_maintain tbody td {text-align:left;}
	.bod_list .list_num {display: none;}	
	.notice_state.mnotice{display:inline-block;}
	.bod_list .list_file{position: absolute; width: 50px; height: 50px; right: 0; top: 20px;}	
	.bod_list .list_state {position: absolute;  right: 5px; width:80px; top: 20px; text-align: center;}
	.bod_list thead{display: none;}
	
	.bod_list .list_division{display: none;}
	.bod_list .list_part{display:block; color:#003875; font-size:16px;}	
	.bod_list .list_part, .bod_list .list_date, .bod_list .list_write{float: left; text-align: left;width: auto;}
	.bod_list .list_date, .bod_list .list_hit{font-size:16px; color:#666;}
	
	.bod_list .list_part:after{content: '';  width: 1px;  height: 14px;background: #ddd; margin: -2px 7px 0 13px; display: inline-block; vertical-align: middle;}
	.bod_list .list_write:after{content: ''; width: 1px; height: 14px; background: #ddd; margin: -2px 7px 0 13px; display: inline-block; vertical-align: middle;}
	.bod_list .list_date:after{content: '';  width: 1px;  height: 14px;background: #ddd; margin: -2px 7px 0 13px; display: inline-block; vertical-align: middle;}
	
	.bod_list .list_tit {display: block; width:calc(100% - 50px) }
	.bod_list .list_tit a {font-weight: 500;font-size: 20px; width: calc(100% - 60px); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; display: inline-block;}
	.bod_list td, .bod_list th {padding: 1px 3px !important; border-bottom: 0 !important;}
	.bod_list tr {padding: 25px 0; display: block; border-bottom: 1px solid #d9d9d9;}
	.bod_list tr:after {content: ''; display: block; clear: both;}
	.notice_state{padding:2px 5px;}
	
	.bod_view{border-bottom:none;}
	.view_info p.title{padding:23px;}
	.view_info ul{padding:18px 23px;}
	.view_info ul li.view_write, .view_info ul li.view_tel{width:60%;}
	.view_info ul li.view_date, .view_info ul li.view_hit{width:40%;}
	.view_info ul li span{width:60px;}
	.view_cont{padding:20px;}
	.view_file li{padding:13px 23px; display:block;}
	.view_file .file_btn{margin-left: 30px;}
	.board_bottom { display: flex; flex-direction: column-reverse;}
	div.board_control div.prev, div.board_control div.next{padding:10px;}
	div.board_control a{overflow: hidden; white-space: nowrap;  text-overflow: ellipsis;  width: 70%;}
	.answer_con{line-height:28px;}
	
	.bod_write th{padding:10px 8px;}
	
}

@media screen and (max-width:768px) {
	.btn{padding:10px 15px;}
	.btn.icon::after{margin-left:20px;}
	.write_wp{width:130px;}
	.input_size_100{width: 100% !important;}
	.bod_write td .mail_size{width:calc(50% - 10px); margin-bottom:5px;}
	.bod_write td .input_tel{width:calc(33.3% - 10px);}
	.bod_write td .input_post{width:calc(100% - 140px);}
	.file_input input[type=text]{width:100%; margin-bottom:5px;}
	.file_input label{width:70px;}
	.private_txt .scroll_txt{padding:25px;}
	
	
}	
@media screen and (max-width:480px) {
	
	/*갤러리 게시판*/
	.gallery_list a{display: block; padding:0 10px;}
	.gallery_list .img{ margin-bottom:10px;}
	
	.view_info p.title{padding:20px 15px; font-size:17px;}
	.view_info ul, .view_cont, .answer_box{padding:15px;}
	.view_file li{padding:13px 15px;}
	
	
}

@media screen and (max-width:400px) {
	.board-search-wrap{font-size:12px}
	
}


/*fAQ*/
.faq-list {width: 100%; clear: both;  border-top: 2px solid #4f5c5f; }
.faq-list > li {width: 100%; clear: both; border-bottom: 1px solid #eaecef; overflow: hidden;}
.faq-list > li.open .list-header{}
.faq-list > li.open .list-header:after { content: ""; background:url(/_res/hf/ko/img/board_icon.png) no-repeat -47px -43px; position: absolute; top: 30px; right: 25px; color:#ee6575; border-style:none; border:0; }
.faq-list > li.open .list-content {line-height: 22px; color: #333333; max-height: 5000px; -webkit-transition: all 0.3s ease;  -moz-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease;}
.faq-list .list-header { position: relative; padding: 30px 95px 30px 95px; font-size:18px; line-height: 24px;  cursor: pointer;  -webkit-transition: all 0.3s ease;  -moz-transition: all 0.3s ease; -o-transition: all 0.3s ease;  transition: all 0.3s ease;}
.faq-list .list-header:before{position:absolute;  content: 'Q';  background: #fff;  color: #5f5b5a;  width: 41px;  height: 41px; letter-spacing: -1px; text-align: center;  border:1px solid #d5d5d5; border-radius: 50%;  line-height: 41px;   top: 22px;    left: 28px; font-family: Arial; font-size: 23px; font-weight: 600;}
.faq-list .list-header a { color: #333333; text-decoration: none; font-weight: 500;}
.faq-list .list-header span { margin-right: 25px; color: #003875;}
.faq-list .list-header:after { content: ""; background:url(/_res/hf/ko/img/board_icon.png) no-repeat -47px -104px; width:30px; height:30px;  position: absolute; top: 30px; right: 25px;  -webkit-transition: all 0.3s ease;-moz-transition: all 0.3s ease;  -o-transition: all 0.3s ease; transition: all 0.3s ease;}

.faq-list .list-content { line-height: 22px; color: #333333; max-height: 0; overflow: hidden; -webkit-transition: max-height 1s cubic-bezier(0, 1.05, 0, 1); -moz-transition: max-height 1s cubic-bezier(0, 1.05, 0, 1);  -ms-transition: max-height 1s cubic-bezier(0, 1.05, 0, 1);  -o-transition: max-height 1s cubic-bezier(0, 1.05, 0, 1);  transition: max-height 1s cubic-bezier(0, 1.05, 0, 1);
}
.faq-list .list-content-inner {  font-size:18px; line-height: 30px; padding: 30px 95px 30px 95px;  width: 100%;  word-break: break-all; background:#f9f9f9; box-sizing: border-box; position: relative; }
.faq-list .list-content-inner:after{POSITION: absolute;	content:'A';	background: #0054a4;	color: #fff;	width:41px;	height:41px;letter-spacing: -1px;	text-align: center;	border-radius: 50%;	line-height: 41px;	top:30px; 	left:30px; font-family: Arial; font-size: 23px; font-weight: 600; border:1px solid #0054a4;}

.faq-list .icon-before, .faq-list .icon-after {display: none;}

#content.annuity_layout .faq-list .list-header a{font-size:26px;}
#content.annuity_layout .faq-list .list-content-inner{font-size:23px;}
#content.annuity_layout .board-head-wrap .page-number-wrap{font-size:26px;}
#content.annuity_layout .board-head-wrap select.custom-select, #content.annuity_layout .board-head-wrap input.custom-input, .board-head-wrap .custom-submit{font-size:19px;}

@media screen and (max-width:1150px){
	
	 #content.annuity_layout .faq-list .list-header a{font-size:20px;}
	 #content.annuity_layout .faq-list .list-content-inner{font-size:18px;}
	 #content.annuity_layout .board-head-wrap .page-number-wrap{font-size:20px;}
	 #content.annuity_layout .board-head-wrap select.custom-select, #content.annuity_layout .board-head-wrap input.custom-input, .board-head-wrap .custom-submit{font-size:15px;}
}

@media screen and (max-width:768px){
	.faq-list .list-header{padding:15px 50px;}
	.faq-list .list-content-inner {padding:27px 50px;}
	.faq-list .list-header a{line-height:30px;}
	.faq-list .list-header span{display:block;}
	.faq-list .list-header:before{width:27px; height:27px; font-size:15px; line-height:27px; left:10px;}
	.faq-list .list-content-inner:after{left:10px; width:28px; height:29px; font-size:15px; line-height:28px;}
	.faq-list .list-header:after{right:10px;}
	.faq-list > li.open .list-header:after{right:10px;}
	
}

/*영상게시판*/
.movie{}
.movie .movie_tit{font-weight:600; font-size:30px; margin-bottom:30px; color:#000;}
.movie-wrap{ display: flex; justify-content: space-between; margin-bottom:40px;}
.movie-wrap .movie-box {width:53%; height:376px;}
.movie-wrap .movie-caption{background:#f7f7f7; width:45%; box-sizing:border-box; padding:38px; font-size:17px; height:376px; overflow-x: hidden; overflow-y: auto;}

.movie .movie-photo-thumnails{border:1px solid #eee; padding:40px 45px;}
.movie .movie-photo-thumnails ul {position:relative; margin:0 -20px;}
.movie .movie-photo-thumnails li {  margin:0 10px; float:left; width:calc(25% - 20px);}
.movie .movie-photo-thumnails li:last-child{margin-right:0;}
.movie .movie-photo-thumnails li:hover .btxt a, .msec-gujung li:hover .stxt { text-decoration:underline;}
.movie .movie-photo-thumnails li:hover img {transform:scale(1.1, 1.1);-webkit-transform:scale(1.1, 1.1);-moz-transform:scale(1.1, 1.1);-ms-transform:scale(1.1, 1.1);}
.movie .movie-photo-thumnails .img {position:relative; overflow:hidden; height:150px; margin-bottom:20px;}
.movie .movie-photo-thumnails .img img {width:100%; height:100%; transition:all 1.0s;-webkit-transition:all 1.0s;-moz-transition:all 1.0s;}
.movie .movie-photo-thumnails .tit { font-size:17px;  line-height:17px; font-weight: bold; color:#333; display:block; white-space:nowrap;overflow: hidden; text-overflow:ellipsis; width:100%;}
.movie .movie-photo-thumnails .date {font-size:16px; color:#8C8C8C; position:relative;}



@media screen and (max-width:1150px){
	
	.movie .movie_tit{font-size:24px; margin-bottom:20px;}
	
	.movie-wrap{ display: block; }
	.movie-wrap .movie-box{margin-bottom: 20px; height:370px;}
	.movie-wrap .movie-box, .movie-wrap .movie-caption {width:100%;}
	.movie-wrap .movie-caption{padding:20px; line-height:24px; height:250px;}
	

	
}	
@media screen and (max-width:768px){
	.movie .movie-photo-thumnails li { width:calc(50% - 20px);}
	
}