@charset "UTF-8";

.wrap_main .header {position: absolute;}
.wrap_main .footer {margin-top: 0;}
.main_cont [class*=section_main] .txt_main {color: #747474;padding-top: 5px;font-size: 14px;line-height: 18px;}
.main_cont [class*=section_main]:last-child {padding-bottom: 30px;}

/*-- main - 섹션1 --*/
.section_main1 {position: relative;width: 100%;height: 100vh;min-height: 940px;max-height: 1000px;background: url(../images/main/bg_main_visual3.jpg) 50% 50% no-repeat;background-size: cover;}
.section_main1 .inner {padding: 135px 20px 0;}
.section_main1 h2 {position: relative;color: #fff;padding-top: 60px;margin-bottom: 50px;font-size: 36px;line-height: 1.5;text-align: center;text-shadow: 0 6px 30px rgb(0 0 0 / 50%);}
.section_main1 h2::after {display:none;}
.section_main1 h2 > br {display:none;}

/* search */
.form_search fieldset {display: flex;gap: 30px;align-items: center;flex-wrap: wrap;width: 100%;overflow: hidden;margin: 0 auto;}
.form_search fieldset > div {position: relative;display:inline-flex;height: 72px;border-bottom: 2px solid #ffffffaa;vertical-align: top;align-items: center;}

.select_wrap {width: 100%;} /* 선택박스 사용안함 - 250515 */
.select_wrap select {width:100%;height:100%;border:none;color:#e5e5e5;background:none;padding:15px 45px 15px 15px;font-size:22px;font-weight:500;line-height:32px;-webkit-appearance:none;appearance:none;text-overflow:ellipsis;text-shadow:0 5px 20px rgb(0 0 0 / 50%);}
.select_wrap select:disabled,
.select_wrap select[disabled],
.select_wrap select[readonly] {border: none; color: #858585; background-color: #f9f9f9;}
.select_wrap select:focus-visible {outline: none;}
.select_wrap select option {color: #434343; font-size: 18px; padding: 15px 45px 15px 15px;}
.select_wrap i {position: absolute; top: 50%; right: 18px; transform: translateY(calc(-50% - 6px)); pointer-events: none; color: #f9f9f9;}
.select_wrap select:disabled + i,
.select_wrap select[disabled] + i,
.select_wrap select[readonly] + i {color: #858585;}

.search_wrap {width: 100%;}
.search_wrap .inp_search {display: inline-flex; width: 100%; height: 100%; padding: 15px 0 15px 15px; border: none; font-size: 18px; line-height: 32px; color: #e5e5e5; background: none; -webkit-appearance: none; appearance: none; vertical-align: top; text-shadow: 0 3px 12px rgb(0 0 0 / 50%);}
.search_wrap .inp_search::-webkit-input-placeholder {color: #e5e5e5e8;}
.search_wrap .inp_search::-moz-placeholder {color: #e5e5e5e8;} 
.search_wrap .inp_search:-ms-input-placeholder {color: #e5e5e5e8;}
.search_wrap .inp_search:-moz-placeholder {color: #e5e5e5e8;}
.search_wrap .inp_search:focus-visible {outline: none;}
.search_wrap .link_search {display: block;color: #fff;width: 80px;height: 100%;text-align: right;line-height: 70px;padding-right: 10px;font-size: 30px;}

/* data_box - 통계 */
.data_box {display: flex;flex-direction: row;flex-wrap: wrap;justify-content: center;gap: 80px 20px;margin: 50px auto;padding: 50px 0 40px;border-radius: 30px;width: 100%;}
.data_box li {width: 45%;font-size: 20px;line-height: 2;text-shadow: 0 3px 12px rgb(0 0 0 / 50%);transition: transform .3s;}
.data_box li a {display: flex;flex-direction: column;align-items: center;width:100%;color: #fff;}
.data_box li i {font-size: 21px;margin-bottom: 5px;}
.data_box li span {font-size: 28px;font-weight:700;line-height: 1.25;}

/*-- main - 섹션2 --*/
.section_main2 .inner,
.section_main3 .inner {padding: 30px 20px;}

.section_main2 h2 {font-size: 32px;font-weight: 800;padding-top: 20px;line-height: 1;}
.section_main2 h2 a {color: #1C1C1C;}
.section_main2 h2 a i {color: #1C1C1C;margin-left: 8px;}

.list_information {position: relative;width:100%;}
.list_information .menulist_tab {display: flex;gap: 8px;align-items: center;overflow: hidden;margin: 0 auto;width: 100%;margin: 25px 0 30px;flex-wrap: wrap;}
.list_information .menulist_tab li {width: auto;overflow: hidden;border-radius: 5px;text-align: center;}
.list_information .menulist_tab li a {display: flex;width: 100%;height: 100%;font-weight: 600;font-size: 18px;line-height: 21px;color: #AEAEAE;background: #F5F5F5;width: 100%;flex-direction: row;padding: 6px 10px;justify-content: center;}
.list_information .menulist_tab li a span {font-size: 16px;margin-top: 1px;font-weight: 400 !important;}
.list_information .menulist_tab a[aria-selected=true],
.list_information .menulist_tab a:hover {font-weight: 700;color: #111;background: #00E58F;transition: all 0.3s;}

.list_photo {position: relative;width:100%;padding-left:12px;}
.list_photo ul {position: relative;display: flex;width:100%;height: 100%;}
.list_photo ul li {position: relative;width: 38%;height: 230px;overflow: hidden;border-radius: 5px;padding-right: 15px;}
.list_photo ul li a {display: block;width: 100%;height: 100%;border: 1px solid #eee;overflow: hidden;border-radius: 5px;}
.list_photo ul li a img {width: 100%;height: 100%;object-fit: cover;transition: transform .3s;}
.list_photo ul li a span {position: absolute;display: flex;gap: 5px;left: 15px;bottom: 15px;flex-direction: row;}
.list_photo ul li a span em {display: block;padding: 3px 10px;color: #111;background: #e7e7e7e0;border-radius: 3px;font-weight: 500;}
.list_photo .arrows_next {position: absolute;top: 48%;right: -20px;transform: translateY(-50%);z-index: 1;}
.list_photo .arrows_prev {position: absolute;top: 48%;left: -20px;transform: translateY(-50%);z-index: 1;}
.list_photo .arrows_next button, 
.list_photo .arrows_prev button {width: 60px;height: 60px;border-radius: 50%;font-size: 30px;color: #747474;background: #fff;box-shadow: 1px 2px 9px rgb(0 0 0 / 12%);}
.list_photo .arrows_next:hover button, 
.list_photo .arrows_prev:hover button {color: #333;transition: all 0.3s;}
.list_photo #type9 li a img {object-position:top;object-fit: contain;} /* 빛나는 얼굴들(인물) */
.list_photo #type9 li a span em:nth-child(2) {display:none;}

/*-- main - 섹션3 --*/
.service_list {position: relative;display: flex;gap: 20px 0;flex-wrap: wrap;}
.service_list li {display: block;width: 100%;height: 100%;text-align: center;}
.service_list li a {position: relative;display: block;width: 100%;height: 100%;}
.service_list li a .icon_img {display: block;width: 100%;min-height: 170px;}
.service_list li a .icon_img.icon_img00 {display:none;min-height: 168px;} /* 이런 사진 찾아주세요! : pc버전일때만 보임 */
.service_list li a .icon_img.icon_img01 {background: url(../images/main/icon_item01.png) 50% 50% no-repeat;} /* 광주 100년 사진 */
.service_list li a .icon_img.icon_img02 {background: url(../images/main/icon_item02.png) 50% 50% no-repeat;} /* 광주의 변천사 */
.service_list li a .icon_img.icon_img03 {background: url(../images/main/icon_item03.png) 50% 50% no-repeat;} /* 사라진 풍물과 건물 */
.service_list li a .icon_img.icon_img04 {background: url(../images/main/icon_item04.png) 50% 50% no-repeat;} /* 작가 */

.service_list li a div {position: relative;font-size: 18px;padding: 26px 0 21px;}
.service_list li a div p {color: #747474;margin-top: 5px;}
.service_list li a div span {font-size: 28px; font-weight: 700; color: #1B1C25;}

.service_list li.data_icon {width: 100%;margin-bottom: 10px;transition: all 0.3s;}
.service_list li.data_icon a div {background: #1B1C25;border-radius: 10px;box-shadow: 1px 2px 9px rgb(0 0 0 / 12%);}
.service_list li.data_icon a div::after {position: absolute;content: "";top: -12px;right: 50%;transform: translateX(50%);width: 40px;height: 26px;background: url(../images/main/icon_items_c.png) 0 0 no-repeat;background-size: 100%;z-index: 1;}
.service_list li.data_icon a div span {font-size: 28px;font-weight: 700;color: #fff;line-height: 1;}
.service_list li.data_icon a div span em {font-weight: 700; color: #FCF27F;}
.service_list li.data_icon a div p {color: #A8A8A8;}
.service_list li.data_icon a button {display:none;}

@media only screen and (min-width: 340px) {
	.section_main1 h2 > br {display:block;}
}
@media only screen and (min-width: 400px) {
	.section_main1 h2 {font-size: 40px;padding-top: 75px;}
	.section_main2 h2 {font-size: 40px;}
	.section_main2 h2 a i {margin-left: 15px;}
}
@media only screen and (min-width: 520px) {
	.section_main1 h2 {font-size: 48px;padding-top: 70px;}
	.section_main1 h2::after {display:inline; position: absolute; bottom: 18px; width: 8px; height: 8px; margin-left:5px; background: #ffffffcc; z-index: 0; content: "";}
	.form_search fieldset, 
	.data_box {width: calc(100vw - 100px);}

	.service_list li {width: 50%;}
}
@media only screen and (min-width: 768px) {
	.main_cont [class*=section_main] .txt_main {padding-top: 10px;font-size: 18px;line-height: 24px;}

	.section_main1 {min-height: 900px;max-height: 900px;}
	.section_main1 h2 {margin-bottom: 62px;padding-top: 80px;font-size: 50px;}
	.form_search fieldset, 
	.data_box {width: calc(100vw - 200px);}
	.search_wrap .inp_search {font-size: 28px;}

	.data_box {width: calc(100vw - 80px);flex-wrap: nowrap;gap: 50px 20px;margin: 60px auto;background: none;}
	.data_box li {width: 48%;margin: 0 auto;font-size: 24px;text-shadow: 0 3px 12px rgb(0 0 0 / 50%);}
	.data_box li i {font-size: 26px;}
	.data_box li span {font-size: 36px;font-weight:700;}

	/* .list_photo::after {position: absolute;top: -10px;right: 0;width: 15%;height: 112%;background: linear-gradient(to right, rgba(255, 255, 255, 0), #fff);z-index: 0;content: "";} 뿌옇게처리되는 박스 사용안함 */
	.list_photo .arrows_next, .list_photo .arrows_prev {top: 50%;}
	.list_photo #type9 li a img {object-fit: contain;} 
}
@media only screen and (min-width: 1000px) {	
	.section_main1 .inner {padding: 182px 20px 0;}
	.section_main1 h2 {padding-top: 48px;font-size: 58px;line-height: 1.45;}
	.form_search fieldset {flex-wrap: nowrap;}

	.data_box li:hover, 
	.data_box li:focus {transform: scale(1.1);text-shadow: 0 8px 10px rgb(0 0 0 / 60%);}
	.data_box li:hover a, 
	.data_box li:focus a {color:#00ff9f;}

	.list_photo ul li a:hover img, 
	.list_photo ul li a:focus img {transform: scale(1.2);}
	.list_photo .arrows_next button, 
	.list_photo .arrows_prev button {width: 84px;height: 84px;font-size: 40px;}

	.service_list li.data_icon:hover {transform: scale(1.05);}
}
/* ---------------- pc 분기점 ---------------- */
@media only screen and (min-width: 1400px) {
	.wrap_main {background-size: 100% 930px;}
	.main_cont [class*=section_main]:last-child {padding-bottom: 60px;}

	/*-- main - 섹션1 --*/
	.section_main1 {min-height: 920px;}
	.section_main1 .inner {padding: 188px 20px 0;}
	.section_main1 h2 {padding-top: 28px;font-size: 68px;margin-bottom: 68px;}

	/* search */
	.form_search fieldset {width: calc(100vw - 600px);max-width: 980px;margin: 0 auto;}

	/* data_box - 통계 */
	.data_box {display: flex;width: calc(100% - 400px);color: #fff;flex-direction: row;flex-wrap: nowrap;gap: 0;margin:50px auto;padding: 40px 0;}
	.data_box li {width:100%;font-size: 24px;text-shadow: 0 3px 12px rgb(0 0 0 / 50%);gap: 0;}
	.data_box li i {font-size: 34px;margin-bottom: 10px;}
	.data_box li span {font-size: 46px;font-weight:700;}

	/*-- main - 섹션2 --*/
	.section_main2 .inner {padding: 60px 20px;}
	.list_information .menulist_tab {flex-wrap: nowrap;gap: 15px;}
	.list_information .menulist_tab li {width: 100%;}
	.list_information .menulist_tab li a {flex-direction: column;min-height: 68px;padding: 12px 5px 10px;font-size: 20px;}

	.list_photo ul li {height: 258px;}
	.list_photo .arrows_prev {left: -15px;}
	.list_photo .arrows_next {right: -15px;}

	/*-- main - 섹션3 --*/
	.section_main3 {background: url(../images/main/img_bg01.png) 92% 300% no-repeat;background-size: 400px;}
	.section_main3 .inner {padding: 40px 20px 58px;}
	.service_list {flex-direction:row;flex-wrap: nowrap;gap: 20px;}	
	.service_list li.data_icon {max-width:330px;margin-right: 30px;margin-bottom: 0;} /* 이런 사진 찾아주세요! */
	.service_list li.data_icon a button {position:absolute;display:block;bottom:-52px;right:50%;transform:translateX(50%);z-index:1;width:66px;height:66px;border-radius:50%;font-size:30px;color:#1B1C25;background:#fff;box-shadow:1px 2px 9px rgb(0 0 0 / 12%);}
	.service_list li.data_icon a .icon_img.icon_img00 {display: block;background: url(../images/main/icon_items00.png) 50% 68% no-repeat;background-size: 100%;}
}