@charset "UTF-8";

/*****************************************************************/
/*지방통계청 - Sub Content */
/*2022-08 */
/*****************************************************************/

b { font-weight: 600; }
/* 인사말 지청장사진없을경우 20230320 */
.z_greeting{position:relative; display:block; width:100%}
.greeting_box{display:block; width:100%; height:196px; line-height:196px; font-size: 24px; color:#000;  text-align:center; background:url('../../img/region/greeting_bg01.png') no-repeat left center/ cover}
.greeting_box span{position:relative; display:inline-block; }
.greeting_box span::before{content:""; position:absolute; display:block; top:40%; left:-35px;  width:31px; height:26px; background:url('../../img/region/upper_01.png') no-repeat center}
.greeting_box span::after{content:""; position:absolute; display:block; top:40%; right:-30px;  width:31px; height:26px; background:url('../../img/region/upper_02.png') no-repeat center}

.greeting_box strong{font-size:28px; color:#0052c1; font-weight:500}

.z_greeting ul{position:relative; display:table; width:100%;  margin:30px auto 0 auto}
.z_greeting li:nth-child(1){display:block; float:right; width:calc(100% - 270px)}
.z_greeting li:nth-child(1) p{margin-bottom:10px; word-break:keep-all}
.z_greeting li:nth-child(2){display:block; float:left; width:270px; text-align:center; font-size:16px; font-weight:500;}
.z_greeting li:nth-child(2) strong{font-size:22px; font-weight:500; color:#000 }
.z_greeting ul:after{content:""; clear:both}

@media only screen and (max-width: 850px) {
.z_greeting li:nth-child(1){float:none; width:100%}
.z_greeting li:nth-child(2){float:none; width:100%; text-align:right}
.z_greeting li:nth-child(1) p br{display:none}
}

@media only screen and (max-width: 750px) {
.greeting_box{padding:30px; height:auto; line-height:35px; font-size: 24px; box-sizing:border-box; word-break:keep-all}
.greeting_box span::before{display:none}
.greeting_box span::after{display:none}
}

/* 2024.04.23 호남청장 css변경 */
/* 인사말  20230705변경*/
.greeting {display:block;  width:100%; word-break:keep-all}
.greeting ul{position:relative; width:100%; height:auto; min-height:347px;  margin:0 auto 50px auto;  padding:120px 370px 0 50px; box-sizing:border-box; background:url('../img/img_sub/greeting_bg.png') no-repeat left bottom; }
.greeting li:nth-child(1){font-size:30px; color:#000; margin-bottom:20px}
.greeting li:nth-child(1) strong{font-weight:600; color:#0052c1}
.greeting li:nth-child(1) span{display:block}
.greeting li:nth-child(1) br{display:none}
.greeting li:nth-child(2){position:absolute;  bottom:0; right:0 ; display:block; width:400px; height:347px;  text-align:center}

.greeting div{position:relative; display:block; width:100%;   padding:0 400px 10px 50px; box-sizing:border-box; }
.greeting div p{margin-bottom:15px;}
.greeting div p.text_01{display:none}

.greeting_name{position:absolute;  top:-20px; right:0 ; display:block; width:370px; color:#000;  font-size:18px!important; font-weight:500; text-align:center}
.greeting_name strong{font-size:30px!important; color:#000}

@media (min-width:1200px) and (max-width:1639px) {
.greeting ul{padding:120px 370px 50px 50px}
.greeting li:nth-child(1){font-size:28px; margin-bottom:10px; line-height:40px}
.greeting div{padding:0 370px 10px 50px}
}

@media all and (max-width:1100px){
.greeting li:nth-child(1){line-height:35px}
}

@media all and (max-width:900px){
.greeting ul{padding:120px 370px 0 50px; }
.greeting li:nth-child(1){font-size:28px; margin-bottom:0; line-height:40px}
.greeting li:nth-child(3){display:none}

.greeting div{ padding:0 20px}
.greeting div p.text_01{display:block}

.greeting_name{position:static;  top:0; width:100%;   text-align:right}
}

@media all and (max-width:640px){
.greeting ul{padding:100px 150px 0 20px; min-height:306px; background-size:100% 90%}
.greeting li:nth-child(2){ width:280px; height:242.75px; }
.greeting li:nth-child(2) img{width:100%}
}

@media all and (max-width:520px){
.greeting ul{padding:0; min-height:auto; background:none; margin:0 auto 30px auto;  }
.greeting li:nth-child(1){font-size:24px; line-height:32px; margin-bottom:10px}
.greeting li:nth-child(2){ position:static; width:100%; height:200px; overflow:hidden; left:0; padding:20px 0 0 0; box-sizing:border-box;  background:url('../img/img_sub/greeting_bg.png') no-repeat left bottom;}
.greeting li:nth-child(2) img{width:220px}

.greeting div{ padding:0}
.greeting_name{font-size:16px!important;}
.greeting_name strong{font-size:24px!important; }

}




/* 지방청인사말 */
.sub_greeting{display:block; width:100%; padding:40px 30px 10px 30px; border:1px solid #e5eaf0; box-sizing:border-box; background: url('../../img/region/greeting_bg02.png') no-repeat left top,  url('../../img/region/greeting_bg03.png') no-repeat right bottom #f8fbff }
.sub_greeting p{margin-bottom:10px}
.sub_greeting p.name{color:#000; font-weight:500; text-align:right}
.sub_greeting p.name strong{font-weight:600; font-size:20px}

/* 도서관이용안내 */
.narasem {}
.narasem > article { margin-bottom: 30px; }
.narasem > article .librBox { margin-bottom: 20px; }
.narasem > article .librBox > p { padding-bottom: 3px; }
.narasem > article .smallBox { border: solid 1px #eaeaea; background-color: #fbfbfb; padding: 20px; margin-bottom: 5px; }

.narasemUse { display: flex; flex-wrap: wrap; justify-content: space-between; }
.narasemUse > article { width: 31%; position: relative; border: solid 1px #d6d6d6; border-radius: 6px 6px 0 0; }
.narasemUse > article::after { height: 24px; width: 15px; background-image: url("../img/img_sub/mvArrow.png"); background-repeat: no-repeat; position: absolute; content: ""; right: -28px; top: 45%; }
.narasemUse > article:nth-of-type(3)::after { content: none; }
.narasemUse > article > p { text-align: center; padding: 14px 0; background-color: #2f5876; color: #ffffff; border-radius: 6px 6px 0 0; }
.narasemUse > article > ul { }
.narasemUse > article > ul > li { }

@media only screen and (max-width: 1640px) {
	.narasemUse > article::after { right: -22px; }
}
@media only screen and (max-width: 1200px) {
	.narasemUse > article::after { right: -28px; }
}
@media only screen and (max-width: 920px) {
	.narasemUse > article::after { right: -24px; }
}
@media only screen and (max-width: 800px) {
	.narasemUse { }
	.narasemUse > article { width: 100%; margin-bottom: 30px; }
	.narasemUse > article::after { left: 50%; right: 50%; bottom: -29px; top: unset; transform: rotate(90deg);}
}

/* 인사말 */
.greetingArea { display:flex; }
.greetingArea .zGreeting { flex-grow: 1; flex-shrink: 1; flex-basis: 0; margin-right: 50px; }
.greetingArea .zGreeting h2 { font-size: 24px; line-height: 1.3; padding-bottom: 10px; }
.greetingArea .zGreeting p { line-height: 1.5; }
.greetingArea .imgGreeting{ width: 367px; margin: 0 auto; }
.greetingArea .imgGreeting img{ display: block; width: 100%; height: auto; }

.zName { font-size: 18px; padding: 20px 0; }
.zName > b { font-size: 22px; padding-left: 5px; }

@media only screen and (max-width: 800px) {
	.greetingArea .zGreeting{ margin-right: 20px; }
	.greetingArea .zGreeting h2 br { display:none; }
	.greetingArea .imgGreeting{ width: 300px; }
}

@media only screen and (max-width: 650px) {
	.greetingArea{ flex-direction: column-reverse; }
	.greetingArea .zGreeting{ margin-right: 0; }
	.greetingArea .zGreeting h2 { font-size:20px; }
	.greetingArea .imgGreeting{ width: 100%; max-width: 367px; margin-bottom:30px; }
}

/* 기존 인사말 */
/*
.zGreeting { padding: 30px; background-image: url("../img/img_sub/greetingPic_hn_2.jpg"); background-repeat: no-repeat; background-position: 90% top; min-height: 400px;}
.zGreeting h2 { font-size: 24px; line-height: 1.3; padding-bottom: 10px; }
.zGreeting sapn { }
.zGreeting p { line-height: 1.3; }

.zName { font-size: 18px; padding: 20px 0; }
.zName > b { font-size: 22px; padding-left: 5px; }

@media only screen and (max-width: 1640px) {
	.zGreeting { background-position: 100% top; }
}
@media only screen and (max-width: 920px) {
	.zGreeting { background-size: 320px auto; background-position-y: 31px; padding: 30px 0; }
}
@media only screen and (max-width: 830px) {
	.zGreeting { background-image: none; }
}
*/

/* 미션및비전 */
.mv_cc #mv01 dl { display: flex; align-items: center; margin-bottom: 15px;  }
.mv_cc #mv01 dt { width: 80px; height: 74px; line-height: 73px; border-radius: 40px; background: #0a79b8; text-align: center; font-size: 17px; color: #fff; font-weight: 500; }
.mv_cc #mv01 .vision dt { background: #087a87; }
.mv_cc #mv01 dd { box-sizing: border-box; width: 100%; padding-left: 47px; background: url('../img/img_sub/mvArrow.png') no-repeat left 15px center;}
.mv_cc #mv01 dd p { border: 4px solid #ededed; width: 100%; box-sizing: border-box; padding: 18px 10px; text-align: center; border-radius: 50px; font-size:18px;}

.mv_cc #mv02 { margin-top: 45px; }
.mv_cc #mv02 dl { display: flex; align-items: center; flex-direction: column; margin-bottom: 40px; }
.mv_cc #mv02 dt { min-width: 100px; }
.mv_cc #mv02 dd { width: 100%; }

.mv_cc .mv02a ul { display: flex; justify-content: space-between;  }
.mv_cc .mv02a li { width: 24.5%; text-align: center; box-sizing: border-box; padding: 12px 14px; background: #dde8f2; word-break: keep-all; vertical-align: middle; line-height: 1.2; }
/* .mv02a li:nth-child(2n) { background: #8cacca; } */

.mv_cc .mv02b { margin-top: 30px;  }
.mv_cc .mv02b dd { display: flex; justify-content: space-between; }
.mv_cc .mv02b ul { width: 24.5%; box-sizing: border-box; padding: 10px 5px 10px 0; border:2px solid #e0e3e6; }
.mv_cc .mv02b ul:nth-child(2n) { border: 2px solid #c7daeb; }

.mv_cc .mv02c { margin-top: 30px;  }
.mv_cc .mv02c ul { display: flex; justify-content: space-between;  }
.mv_cc .mv02c li {width: 28%; text-align: center; font-weight: 500; color: #fff; background: rgba(7, 101, 143, 0.86); padding: 15px 10px; border-radius: 50px; position: relative;}
.mv_cc .mv02c li:nth-child(2) {  margin-left: -5%; background: rgba(53, 179, 193, 0.8); color: #333; z-index: 3; }
.mv_cc .mv02c li:nth-child(3) {  margin-left: -5%; }
.mv_cc .mv02c li:nth-child(4) {  margin-left: -5%; background: rgba(53, 179, 193, 0.8); color: #333; z-index: 3; }

p.titleBar { vertical-align: middle; padding: 9px 0; text-align: center; color: #223c5c; font-weight: 600; position: relative; font-size: 22px; }
p.titleBar::before { position: absolute; width: 15px; height: 2px; background-color: #2481b5; content: ""; left: 50%; top: 0; transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%) }

@media only screen and (max-width: 980px) {
	.mv_cc .mv02a ul,
	.mv_cc #mv02 dd { flex-wrap: wrap; }
	.mv_cc .mv02a li,
	.mv_cc .mv02b ul { width: 49.5%; margin-bottom: 10px; }
}

@media only screen and (max-width: 600px) {
	.mv_cc #mv01 dl{flex-direction:column;}
	.mv_cc #mv01 dt{width:100%;height:auto;padding:10px;line-height:1.6rem;border-radius:0;}
	.mv_cc #mv01 dd{padding:0;background:none;}
	.mv_cc #mv01 dd p{padding:10px;font-size:16px;border-radius:0;}
}

@media only screen and (max-width: 450px) {
	.mv_cc .mv02a li, .mv_cc .mv02b ul{width:100%;}
	.mv_cc .mv02a li{padding:10px;}
	.mv_cc .mv02c ul{flex-direction:column;}
	.mv_cc .mv02c li{width:100%;margin-bottom:10px;}
	.mv_cc .mv02c li:last-child{margin-bottom:0;}
	.mv_cc .mv02c li:nth-child(2),.mv_cc .mv02c li:nth-child(3),.mv_cc .mv02c li:nth-child(4){margin-left:0;}
}

/* 연혁 */
.history_list { }
.history_list > li {display: flex; width: 100%;}
.history_list li > h2 { width: 260px; font-size: 24px; padding-top: 24px; position: relative; }
.history_list li > h2::before { content: ""; position: absolute; width: 12px; height: 2px; background-color: #4b91e1; left: 0; top: 14px; }
.history_list li > .h_group { flex-grow: 1; flex-shrink: 1; flex-basis: 0; box-sizing: border-box;}
.history_list dl { display: flex; align-items: baseline; padding: 15px 0; border-bottom: 1px dashed #e1e1e1; }
.history_list dl dt { width: 155px; text-align: left; font-weight: 500; }
.history_list dl dd { flex-grow: 1; flex-shrink: 1; flex-basis: 0; text-align: left; font-size: 14px; word-break: keep-all; position: relative; }
.history_list dl dd .bsListin{margin:0;}

.history_list > li:nth-child(1) {margin-bottom: 40px;}

.history_list .pd_none {padding: 0;}

@media only screen and (max-width: 1200px) {
	.history_list dl dt { width: 100px; }
}

@media only screen and (max-width: 768px) {
    .history_list > li {display: block;}
	.history_list > li:nth-child(1){margin-bottom: 20px;}
    .history_list li > h2 { width: 100%; margin-bottom: 15px; }
    .history_list li > .h_group { width: 100%; padding-left: 0;}
    .history_list dl{padding: 10px 0;}
	.history_list dl:first-child{border-top: 1px dashed #e1e1e1;}
	.history_list dl dt{width: 80px;}
}

@media only screen and (max-width: 450px) {
	.history_list dl{flex-direction: column;}
	.history_list dl dt{width: 100%; margin-bottom:5px; padding-left: 10px;}
}

/* 조직도  */
#org { width: 100%; display: flex; flex-wrap: wrap; }
#org dt { width: 63%; position: relative;}
#org dt a { display: block; width: 255px; height: 50px; background: #0a79b8; color: #fff;  text-align: center; border-radius: 30px; font-weight: 500; padding: 15px 10px; box-sizing: border-box; position: absolute; left: 31%; top: 115px; line-height: 1.2; }
#org dt a::before { content: ''; display: block; position: absolute; left: 100%; top: 48%; width: 100%; height: 3px; border-top: 2px solid #eee; box-sizing: border-box; z-index:-1;}
#org dt a::after { content: ''; display: block; position: absolute; left: 50%; top: 100%; width: 3px; height: 165px; border-left: 2px solid #eee; box-sizing: border-box; }

#org dd#org01 { width: 37%; position: relative; z-index:1;}
#org dd#org01::before { content: ''; display: block; position: absolute; left: 0px; top: 26px; width: 3px; height: 232px; border-left: 2px solid #eee; box-sizing: border-box; }

#org dd#org01 li { margin-bottom: 10px; padding-left: 50px; position: relative; }
#org dd#org01 li:last-child { margin-bottom: 0;}
#org dd#org01 li::before { content: ''; display: block; position: absolute; left: 0; top: 23px; width: 50px; height: 3px; border-top: 2px solid #eee; z-index:-1; }
#org dd#org01 a { display: block; width: 100%; height: 48px; text-align: center; background: #dde8f2; padding: 12px 10px; box-sizing: border-box; color: inherit; }

#org dd#org02 { width: 100%; margin-top: 50px; position: relative; }
#org dd#org02::before { content: ''; display: block; position: absolute; left: 5.3%; top: 0; width: 89.5%; height: 3px; border-top: 2px solid #eee; box-sizing: border-box; }
#org dd#org02 ul { display: flex; justify-content: space-between;  }
#org dd#org02 li { width: 10.5%; padding-top: 40px; position: relative; }
#org dd#org02 li::before { content: ''; display: block; position: absolute; left: 50%; top: 0px; width: 3px; height: 40px; border-left: 2px solid #eee; box-sizing: border-box; }
#org dd#org02 li a { word-break: keep-all; text-align: center; display: block; border: 2px solid #d1d1d1; box-sizing: border-box; padding: 13px 5px; overflow: hidden;  color: inherit; }

@media screen and (min-width:0) and (max-width: 1080px) {
    #org dt { width: 50%;}
    #org dt a {left:10%; width:80%; max-width:80%; z-index:1;}
    #org dt a::before{top:49%;}
    #org dd#org01 { width: 50%; }
	#org dd#org01 a{width:100%;}
	#org dd#org01::before{top:24px;}
	#org dd#org02 ul{background:#fff;}
	#org dd#org02 li {display:inline-flex;}
	#org dd#org01 li::before{top:50%;}
    #org dd#org02 li a {width:100%; padding: 10px 0; line-height: 1.2; font-size:14px; word-break:break-all;}
}
@media only screen and (max-width: 768px) {
	#org dt{width:48%;}
	#org dt::after{top:145px;left:43%;}
	#org dt a{width:90%; max-width:90%; top:50%; left:0; transform:translateY(-50%);}
	#org dt a::before{top:50%;}
	#org dt a::after{height:161px;}
	#org dd#org01{width:52%;}
	#org dd#org01::before{top: 23px;height: calc(100% - 42px);}
	#org dd#org01 a{width:100%; height:auto; padding:10px;}
	#org dd#org01 li{padding-left:15%; font-size:14px;}
	#org dd#org02{width:100%; margin-top:30px;}
	#org dd#org02::before{left:calc((48% - 30px) / 2); top:30px; width:calc(24% + 20px);}
	#org dd#org02 ul{flex-direction: column; position:relative; width: 52%; margin: 0 0 0 auto;}
	#org dd#org02 ul::before{content:''; position:absolute; top:30px; left:0; width:2px; height:calc(100% - 50px); background:#eee;}
	#org dd#org02 li{width:100%; padding-top:0;  margin-top:10px; padding-left:15%;}
	#org dd#org02 li::before{ left: 0; top: 50%; width: 50px; height: 1px; border-top: 2px solid #eee; border-left: 0;}
	#org dd#org02 li a{padding:10px; font-size:14px; background:#fff; z-index:1;}
}

@media only screen and (max-width: 500px) {
	#org dd#org02::before{left:calc((48% - 20px) / 2);}
}

@media only screen and (max-width: 400px) {
	#org{justify-content:space-between;}
	#org dt a{padding:18px 5px; font-size:14px;}
	#org dt a::after{height:158px;}
	#org dd#org01 a{padding:10px 0;}
	#org dd#org01 li,#org dd#org02 li a{font-size:13px;}
}

/* 사이트맵 */
.site_map {}
.site_map .site_h2 {margin:0 0 17px 0; padding:0 0 13px 0; font-size:22px; font-weight:500; color:#0064cc; border-bottom:2px solid #444444;}
.site_map ul {font-size:0; padding:0 0 15px 0; margin-bottom:40px; border-bottom:1px solid #e0e0e0; overflow:hidden;}
.site_map > ul > li {font-size:15px; width:25%; vertical-align:top; display:inline-block; font-weight:500; margin:0 0 4px 0;}
.site_map > ul > li > a {color:#222222; display:block; background: #f5f5f5; padding: 10px 0 10px 10px;  width:90%; margin:0 auto;}
.site_map > ul > li > a[target="_blank"] {background:#f5f5f5 url(../img/img_sub/t_blank_icon.png) no-repeat 94% center;}
.site_map > ul > li li > a[target="_blank"]:after {content: ''; position:absolute; width:18px; height:15px; background:#ffffff url(../img/img_sub/t_blank_icon.png) no-repeat 94% center;}
.site_map > ul > li  ul {width:1000%;  border-bottom:none;font-weight:normal; margin:4px 0 16px 5%; padding:0;}
.site_map > ul > li  ul li {font-size:13px; background: url(../img/img_sub/li_bul4.png) no-repeat 1px 6px; padding:0 0 0 10px; margin:9px 0;}
.site_map > ul > li  ul li a {color:#444444;}
.site_map > ul > li  ul li a:hover {color:#111111;}

@media only screen and (max-width: 768px) {
	.site_map > ul > li { width: 100%; background-color: #f5f5f5; }
	.site_map > ul > li > a { background: transparent; width: auto; margin: 0; display: inline-block; }
	.site_map > ul > li > a[target="_blank"] {background:#f5f5f5 url(../img/img_sub/t_blank_icon.png) no-repeat 94% center; padding-right: 20px;}
	.site_map > ul > li li > a[target="_blank"]:after {content: ''; position:absolute; width:18px; height:15px; background:#ffffff url(../img/img_sub/t_blank_icon.png) no-repeat 94% center;}
}