@charset "utf-8";
/* CSS Document */

/*============================================================================================================================
													Layout 설정
=============================================================================================================================*/
/*======================================
			모바일용 CSS
========================================*/

/* 헤더 영역 */
.header ul.util_m li {border-left:2px solid #0080c5;}
.header ul.util_m li.util_m_total a {background:#bedff0 url('images/util_m_menu.png') center center no-repeat; background-size:22px 16px;}

/* 통합검색 */
.search_layer {border-top:2px solid #0080c5;}
.search_layerin .search_cont {border:2px solid #0080c5;}
.search_layerin .search_cont .input_img {background:url('images/bt_tfind_img.png') center center no-repeat;}

/* 메뉴 */
#nav .gnb_close a {background:#516f9c url('images/gnb_close.png') center center no-repeat; background-size:20px 20px;}
#nav .gnb_close2 {background:#a5b6d0 url('images/w_logo.png') 15px center no-repeat; border-top:2px solid #516f9c; border-bottom:2px solid #516f9c;}
#nav .gnb .depth_01 a {background:#516f9c;}
#nav .gnb .depth_01 ul .depth_02 a:hover {background:#e1f2fa;}

/* Location */
.location2_section {background:url('images/sky_bg.jpg') right top no-repeat; border-bottom:2px solid #c3dff5;}
	h2.location2_title {background:url('images/bullet_title.jpg') left bottom no-repeat;}
	
/* Location - 사용안함 */
.location_section .location_section_area {border-bottom:2px solid #0080c5;}
.location_dropdown_1, .location_dropdown_2 {background:#0079b6;}
.location_dropdown_1.active, .location_dropdown_2.active {background:#4cbeff;}
/* 1 depth */
.location_dropdown_1 .btn_location_home a {background:#165678 url('images/btn_location_home.png') center center no-repeat; background-size:20px 18px;}
/* 2 depth */
.location_dropdown_2 {background: #fff;}




/*======================================
			태블릿 CSS
========================================*/
@media all and (min-width:768px){

	/* 헤더 영역 */
	.header {border-bottom:2px solid #0080c5;}
	.header ul.util_m li.util_m_total a {background-size:30px 28px;}
	.header ul.util_m li.util_m_total a:hover {background:#fad094 url('images/util_m_menu.png') center center no-repeat; background-size:30px 28px;}
	
	/* 통합검색 영역 */
	.search_layer {border-top:none;}
	
	/* Location */
	.location_section {background:url('images/sub_top_bg.png') left top repeat-x;}
	
	.location_dropdown_1.active, .location_dropdown_2.active {background:#0079b6;}
	.location_dropdown_1 .dropdown li:hover a, .location_dropdown_2 .dropdown li:hover a {background:#666;}
	
	.location_dropdown_1 .dropdown li:nth-child(4n - 3) a {border-left:5px solid #86dafa;}
	.location_dropdown_1 .dropdown li:nth-child(4n - 2) a {border-left:5px solid #00aced;}
	.location_dropdown_1 .dropdown li:nth-child(4n - 1) a {border-left:5px solid #4183C4;}
	.location_dropdown_1 .dropdown li:nth-child(4n) a {border-left:5px solid #3B5998;}
	
	.location_dropdown_2 .dropdown li:nth-child(4n - 3) a {border-left:5px solid #86dafa;}
	.location_dropdown_2 .dropdown li:nth-child(4n - 2) a {border-left:5px solid #00aced;}
	.location_dropdown_2 .dropdown li:nth-child(4n - 1) a {border-left:5px solid #4183C4;}
	.location_dropdown_2 .dropdown li:nth-child(4n) a {border-left:5px solid #3B5998;}
	
	/* Location bg 이미지 */
	.location_section .location_section_area.location_img1 {background:#f4f4f4 url('images/sub_top_img1.png') left top no-repeat;}
	.location_section .location_section_area.location_img2 {background:#f4f4f4 url('images/sub_top_img2.png') left top no-repeat;}
	.location_section .location_section_area.location_img3 {background:#f4f4f4 url('images/sub_top_img3.png') left top no-repeat;}
	.location_section .location_section_area.location_img4 {background:#f4f4f4 url('images/sub_top_img4.png') left top no-repeat;}
	.location_section .location_section_area.location_img5 {background:#f4f4f4 url('images/sub_top_img5.png') left top no-repeat;}
	.location_section .location_section_area.location_img6 {background:#f4f4f4 url('images/sub_top_img6.png') left top no-repeat;}
	
	.location_dropdown_1, .location_dropdown_2 {background:#f4f4f4;}
}





/*======================================
			PC기반 CSS
========================================*/
@media all and (min-width:1024px){

	/* 헤더 영역 */
	.header {border-bottom:2px solid #0080c5;}
	
	/* 메뉴 */
	#nav .gnb {border-bottom:2px solid #0080c5;}
	#nav .gnb.gnb_4 {background:#fff url('images/nav_bg_4.png') left top repeat-y;}
	#nav .gnb.gnb_5 {background:#fff url('images/nav_bg_5.png') left top repeat-y;}
	#nav .gnb.gnb_6 {background:#fff url('images/nav_bg_6.png') left top repeat-y;}
	#nav .gnb.gnb_7 {background:#fff url('images/nav_bg_7.png') left top repeat-y;}
	#nav .gnb li.depth_01 a.hover {border-bottom:4px solid #C35500; color:#C35500;}
	#nav .gnb li.depth_01 > a:hover {border-bottom:4px solid #C35500; color:#C35500;}
	#nav .gnb li.depth_01 ul .depth_02 a:hover {background:#C35500;}
	#nav .gnb li.depth_01 > ul {border-top:2px solid #0080c5;}
	
	/* 푸터 영역 CSS 여기부터 수정 할것 */
	.all_visit {border:1px solid #0088cc; color:#0088cc;}
	

}




/*============================================================================================================================
													main
=============================================================================================================================*/
/*======================================
			모바일용 CSS
========================================*/

/* 바로가기 영역 */
.reunion_info_section ul.reunion_home_btn li a:hover {color:#6bc6f5;}
.reunion_info_section ul.reunion_home_btn li:nth-child(1) a 		{background:url('images/home_btn1.png') 10px center no-repeat; background-size:30px 30px;}
.reunion_info_section ul.reunion_home_btn li:nth-child(1) a:hover 	{background:url('images/home_btn1_over.png') 10px center no-repeat; background-size:30px 30px;}
.reunion_info_section ul.reunion_home_btn li:nth-child(2) a 		{background:url('images/home_btn2.png') 10px center no-repeat; background-size:30px 30px;}
.reunion_info_section ul.reunion_home_btn li:nth-child(2) a:hover 	{background:url('images/home_btn2_over.png') 10px center no-repeat; background-size:30px 30px;}
.reunion_info_section ul.reunion_home_btn li:nth-child(3) a 		{background:url('images/home_btn3.png') 10px center no-repeat; background-size:30px 30px;}
.reunion_info_section ul.reunion_home_btn li:nth-child(3) a:hover 	{background:url('images/home_btn3_over.png') 10px center no-repeat; background-size:30px 30px;}
.reunion_info_section ul.reunion_home_btn li:nth-child(4) a 		{background:url('images/home_btn4.png') 10px center no-repeat; background-size:30px 26px;}
.reunion_info_section ul.reunion_home_btn li:nth-child(4) a:hover 	{background:url('images/home_btn4_over.png') 10px center no-repeat; background-size:30px 26px;}
.reunion_info_section ul.reunion_home_btn li:nth-child(5) a 		{background:url('images/home_btn5.png') 10px center no-repeat; background-size:30px 34px;}
.reunion_info_section ul.reunion_home_btn li:nth-child(5) a:hover 	{background:url('images/home_btn5_over.png') 10px center no-repeat; background-size:30px 34px;}
.reunion_info_section ul.reunion_home_btn li:nth-child(6) a 		{background:url('images/home_btn6.png') 10px center no-repeat; background-size:30px 29px;}
.reunion_info_section ul.reunion_home_btn li:nth-child(6) a:hover 	{background:url('images/home_btn6_over.png') 10px center no-repeat; background-size:30px 29px;}

/* 게시판 영역 */
.reunion_board_box .board_box_top.board_box_top1 {background:url('images/board_bg1.png') left top repeat;}
.reunion_board_box .board_box_top.board_box_top2 {background:url('images/board_bg2.png') left top repeat;}

.reunion_board_box .board_box_top .more a {background:#fff url('images/more_bg.png') center center no-repeat;}
.reunion_board_box .board_box_top .more a:hover {background:#d9edf7 url('images/more_bg.png') center center no-repeat;}

.reunion_board_box .board_box_top .viewMore a {background:#fff url('images/viewMore_bg.png') center center no-repeat;}
.reunion_board_box .board_box_top .viewMore a:hover {background:#d9edf7 url('images/viewMore_bg.png') center center no-repeat;}

/* 사진갤러리 및 이산가족신청 영역 */
.main_tab input:hover + label {background-color:#3861bd;}
.main_tab input:checked + label {background-color:#3861bd;}

.main_tab_content div .more a {background:#fff url('images/more_bg.png') center center no-repeat;}
.main_tab_content div .more a:hover {background:#d9edf7 url('images/more_bg.png') center center no-repeat;}

.main_tab_content div .viewMore a {background:#fff url('images/viewMore_bg.png') center center no-repeat;}
.main_tab_content div .viewMore a:hover {background:#d9edf7 url('images/viewMore_bg.png') center center no-repeat;}

/* 이산가족 신청 */
.reunion_request .request_top .more a {background:#fff url('images/more_bg.png') center center no-repeat;}
.reunion_request .request_top .more a:hover {background:#d9edf7 url('images/more_bg.png') center center no-repeat;}

.reunion_request .request_top .viewMore a {background:#fff url('images/viewMore_bg.png') center center no-repeat;}
.reunion_request .request_top .viewMore a:hover {background:#d9edf7 url('images/viewMore_bg.png') center center no-repeat;}

/* 사연소개 */
.reunion_story_section .more a {background:#fff url('images/more_bg.png') center center no-repeat;}
.reunion_story_section .more a:hover {background:#d9edf7 url('images/more_bg.png') center center no-repeat;}

/*======================================
			PC기반 CSS
========================================*/
@media all and (min-width:1024px){
	.reunion_info_section ul.reunion_home_btn li:nth-child(1) a 		{background:url('images/home_btn1.png') 18px center no-repeat; background-size:42px 42px;}
	.reunion_info_section ul.reunion_home_btn li:nth-child(1) a:hover 	{background:url('images/home_btn1_over.png') 18px center no-repeat; background-size:42px 42px;}
	.reunion_info_section ul.reunion_home_btn li:nth-child(2) a 		{background:url('images/home_btn2.png') 18px center no-repeat; background-size:38px 38px;}
	.reunion_info_section ul.reunion_home_btn li:nth-child(2) a:hover 	{background:url('images/home_btn2_over.png') 18px center no-repeat; background-size:38px 38px;}
	.reunion_info_section ul.reunion_home_btn li:nth-child(3) a 		{background:url('images/home_btn3.png') 18px center no-repeat; background-size:38px 38px;}
	.reunion_info_section ul.reunion_home_btn li:nth-child(3) a:hover 	{background:url('images/home_btn3_over.png') 18px center no-repeat; background-size:38px 38px;}
	.reunion_info_section ul.reunion_home_btn li:nth-child(4) a 		{background:url('images/home_btn4.png') 18px center no-repeat; background-size:37px 30px;}
	.reunion_info_section ul.reunion_home_btn li:nth-child(4) a:hover 	{background:url('images/home_btn4_over.png') 18px center no-repeat; background-size:37px 30px;}
	.reunion_info_section ul.reunion_home_btn li:nth-child(5) a 		{background:url('images/home_btn5.png') 18px center no-repeat; background-size:39px 44px;}
	.reunion_info_section ul.reunion_home_btn li:nth-child(5) a:hover 	{background:url('images/home_btn5_over.png') 18px center no-repeat; background-size:39px 44px;}
	.reunion_info_section ul.reunion_home_btn li:nth-child(6) a 		{background:url('images/home_btn6.png') 18px center no-repeat; background-size:37px 35px;}
	.reunion_info_section ul.reunion_home_btn li:nth-child(6) a:hover 	{background:url('images/home_btn6_over.png') 18px center no-repeat; background-size:37px 35px;}
}





/*============================================================================================================================
													board.css
=============================================================================================================================*/
/*======================================
			모바일용 CSS
========================================*/

/*  ****************************  리스트  ****************************  */
/* 가로리스트 스타일 */
.uni-list-table tr th {border-top:2px solid #0080c5;}
.uni-list-table-brd tr th {border-top:2px solid #0080c5;}

/*  ****************************  갤러리 등 이미지 리스트  ****************************  */
ul.uni-data-list-ul {border-top:2px solid #0080c5;}

/*  **************************** 갤러리 view ****************************  */
.gallery {border-top:2px solid #0080c5;}

/*  ****************************  동영상 리스트  ****************************  */
ul.uni-movie-list-ul {border-top:2px solid #0080c5;}

/*  ****************************  컨텐츠 탭  ****************************  */
ul.content_tab {border-bottom:2px solid #35aa90;}
ul.content_tab li a:hover {background: #35aa90 url('images/tab_bg.png') right bottom no-repeat;}
ul.content_tab li.on {background: #35aa90 url('images/tab_bg.png') right bottom no-repeat;}

/*  ****************************  쓰기 화면  ****************************  */
/* 쓰기 공통 */
.uni-form-table tbody {border-top:2px solid #0080c5;}
.uni-form-table-brd tbody {border-top:2px solid #0080c5;}

/* 쓰기 기본 : 2단 이상용 */
.uni-form-basic-table tbody {border-top:2px solid #0080c5;}
.uni-form-basic-table-brd tbody {border-top:2px solid #0080c5;}

/*  ****************************  리스트 페이징  ****************************  */
/* Paging */
.page_select ol li {border-radius:3px;}
.page_select ol li a {border-radius:3px;}
.page_select ol li a:hover{background:#C35500;}
.page_select ol li.pcurrent {background:#C35500; border-radius:3px;}

.page_select ol li.btn_prev_first a:hover	{background: #C35500 url('images/btn_prev_first_over.png') center center no-repeat;}
.page_select ol li.btn_prev_more a:hover 	{background: #C35500 url('images/btn_prev_more_over.png') center center no-repeat;}
.page_select ol li.btn_prev a:hover			{background: #C35500 url('images/btn_prev_over.png') center center no-repeat;}
.page_select ol li.btn_next a:hover			{background: #C35500 url('images/btn_next_over.png') center center no-repeat;}
.page_select ol li.btn_next_more a:hover	{background: #C35500 url('images/btn_next_more_over.png') center center no-repeat;}
.page_select ol li.btn_next_last a:hover	{background: #C35500 url('images/btn_next_last_over.png') center center no-repeat;}

/* 페이지 설명 */
.page_info_area {background:#fff9f0;}
.page_info_area ul li {background:url('images/bullet1.png') left 6px no-repeat;}


/*======================================
			태블릿 CSS
========================================*/
@media all and (min-width:768px){
	
	/* 페이지 설명 */
	.page_info_area {background:#fffdf0 url('images/icon_info.png') 20px center no-repeat;}

}




/*============================================================================================================================
											로그인, 폼 등 시스템 화면
=============================================================================================================================*/
/*======================================
			모바일용 CSS
========================================*/

/*  ****************************  2단 폼  ****************************  */
.form_area .form_title {background:#4487ef;}




/*============================================================================================================================
											통합검색
=============================================================================================================================*/
/*======================================
			모바일용 CSS
========================================*/

/* 통합검색 영역 */
.total_searchbox {border:2px solid #0080c5;}

/* 카테고리별 상세내용 */
h3.search_category_title {background: url('images/icon_arrow.png') no-repeat left 3px;}
ul.search_category_list li .title_area .util .accuracy_graph_area .accuracy_graph { background: #0096e3;}





/*======================================
			태블릿용 CSS
========================================*/
@media all and (min-width:768px){
	
	/* 통합검색 영역 */
	.total_searchbox {background:#f8f8f8 url('images/search_img.png') no-repeat left top;}
}


/*======================================
			PC용 CSS
========================================*/
@media all and (min-width:1024px){

}




/*============================================================================================================================
													자주사용하는 기능 설정
=============================================================================================================================*/

/* 라디오 및 체크 버튼 설정 */
.RadioCheckbox p:not(#cssbrowser)>input[type="checkbox"] + label, .RadioCheckbox p:not(#cssbrowser)>input[type="radio"] + label {background:url('images/bg_radiocheckbox.png') no-repeat left top;}
.RadioCheckbox p:not(#cssbrowser)>input[type="radio"] + label { background-position:left -100px; }

.RadioCheckbox p:not(#cssbrowser)>input[type="checkbox"]:disabled + label { background-position:left -25px; }
.RadioCheckbox p:not(#cssbrowser)>input[type="checkbox"]:checked + label { background-position:left -50px; }
.RadioCheckbox p:not(#cssbrowser)>input[type="checkbox"]:checked:disabled + label { background-position:left -75px; }

.RadioCheckbox p:not(#cssbrowser)>input[type="radio"]:disabled + label { background-position:left -125px; }
.RadioCheckbox p:not(#cssbrowser)>input[type="radio"]:checked + label { background-position:left -150px; }
.RadioCheckbox p:not(#cssbrowser)>input[type="radio"]:checked:disabled + label { background-position:left -175px; }

	
/*======================================
				Button
========================================*/
.button_color a, .button_color button {background:#C35500; border:1px solid #A34700;}
.button_color a:hover, .button_color button:hover {background:#A34700;}

.button_20_color a, .button_20_color button {background:#C35500; border:1px solid #A34700;}
.button_20_color a:hover, .button_20_color button:hover {background:#A34700;}

.button_30_color a, .button_30_color button {background:#C35500; border:1px solid #A34700;}
.button_30_color a:hover, .button_30_color button:hover {background:#A34700;}





