@charset "UTF-8";

/* footer */
.footer { background-color: #101a27; color: #838a92; font-size: 16px; letter-spacing: normal; word-break: keep-all; }
.footer .footer_wrap { position: relative; }
.footer .footer_inner { max-width: 1680px; }
.footer .footer_top { border-bottom: 1px solid #273548; }
.footer .footer_top .footer_inner { display: flex; position: relative; align-items: center; justify-content: space-between; height: 10rem; }
.footer .foot_logos { display: flex; flex-wrap: wrap; align-items: center; }
.footer .foot_logo { display: block; margin-right: 3rem; }
.footer .foot_logo:last-child { margin-right: 0; }
.footer .foot_logo.foot_logo1 img { height: 2.3rem; }
.footer .footer_bottom { padding: 4rem 0; }
.footer .footer_bottom .footer_inner { display: flex; position: relative; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; }
.footer .foot_nav { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; margin: 0 -1.5rem; color: #ccc; }
.footer .foot_nav > li { position: relative; padding: 0 1.5rem; }
.footer .foot_nav > li.point { color: #fff; font-weight: bold; }
.footer .foot_nav > li:before { display: block; position: absolute; top: 50%; right: 0; width: 0.3rem; height: 0.3rem; margin-top: -0.15rem; margin-right: -0.15rem; border-radius: 1000px; background-color: #ccc; content: ""; }
.footer .foot_nav > li:last-child:before { display: none; }
.footer .foot_info { margin-bottom: 2rem; }
.footer .foot_info > li { margin-bottom: 0.5rem; }
.footer .foot_info > li:last-child { margin-bottom: 0; }
.footer .foot_info .dot { display: inline-block; width: 0.3rem; height: 0.3rem; margin: 0 0.5rem; overflow: hidden; border-radius: 1000px; background-color: #838a92; text-indent: 100%; vertical-align: middle; white-space: nowrap; }
.footer .footer_familysite_wrap { position: absolute; top: -11.5rem; right: calc(var(--bs-gutter-x) + 13rem); }
.footer .footer_familysite { display: inline-block; position: relative; width: 23rem; }
.footer .footer_familysite_title { display: flex; align-items: center; width: 100%; height: 5rem; padding: 0 2rem; border: 1px solid #838a92; border-radius: var(--border_radius5); font-weight: bold; transition: background-color 0.5s ease; }
.footer .footer_familysite_title:after { display: block; position: absolute; top: 50%; right: 2rem; width: 1.4rem; height: 0.8rem; margin-top: -0.5rem; background: url(../../images/common/icon_arrow_down2.svg) no-repeat center/contain; content: ""; }
.footer .footer_familysite_options { visibility: hidden; z-index: 100; position: absolute; right: 0; bottom: calc(100% + 5px); left: 0; width: 100%; padding: 1rem 2rem; padding-right: 1rem; border: 1px solid #838a92; border-radius: var(--border_radius5); background-color: #101a27; font-weight: bold; text-align: left; word-break: break-all; opacity: 0; }
.footer .footer_familysite_options a { display: block; padding: 5px 0; font-size: 14px; line-height: 1.3; }
.footer .footer_familysite_options a:last-child { margin-bottom: 0; }
.footer .footer_familysite_options a:hover { color: var(--primary); }
.footer .footer_familysite_options a:focus-visible { outline-offset: -5px !important; }
.footer .footer_familysite_options_scroll { max-height: 15rem; padding-right: 1rem; overflow-x: hidden; overflow-y: auto; }
.footer .footer_familysite_options_scroll::-webkit-scrollbar { width: 4px; height: 4px; }
.footer .footer_familysite_options_scroll::-webkit-scrollbar-thumb { background: #838a92; }
.footer .footer_familysite_options_scroll::-webkit-scrollbar-track { background: transparent; }
.footer .footer_familysite.opened .footer_familysite_title:after { background-image: url(../../images/common/icon_arrow_up2.svg); }
.footer .footer_familysite.opened .footer_familysite_options { visibility: visible; opacity: 1; }
.footer .top_btn { display: block; z-index: 100; position: absolute; top: 0; right: var(--bs-gutter-x); width: 10rem; height: 10rem; margin-left: auto; border-right: 1px solid #273548; border-left: 1px solid #273548; transition: 0.2s; }
.footer .top_btn span { font-weight: bold; }
.footer .top_btn span:before { display: block; width: 2rem; height: 1.1rem; margin: 0 auto; margin-bottom: 0.8rem; background: url(../../images/common/icon_arrow_up2.svg) no-repeat center/contain; content: ""; }

/* layout */
.sub_page { margin-top: 120px; padding-top: 8.7rem; padding-bottom: 15rem; }
.sub_page_head { margin-bottom: 7rem; color: #222; }
.sub_page_head_nav { font-size: 16px; animation: fadeInUp 0.6s ease-out 0.2s; animation-fill-mode: both; }
.sub_page_head_nav .nav_list { display: flex; margin: -0.5rem -2rem; }
.sub_page_head_nav .nav_list > li { position: relative; padding: 0.5rem 2rem; font-weight: bold; text-decoration: underline; }
.sub_page_head_nav .nav_list > li:before { position: absolute; top: 50%; right: 0; width: 0.4rem; height: 0.4rem; margin-top: -0.2rem; margin-right: -0.2rem; border-radius: 1000px; background-color: #222; content: ""; }
.sub_page_head_nav .nav_list > li.home span { position: relative; padding-left: 2.7rem; }
.sub_page_head_nav .nav_list > li.home span:before { display: block; position: absolute; top: 50%; left: 0; width: 1.8rem; height: 1.8rem; margin-top: -0.9rem; background: url(../../images/common/icon_home.svg) no-repeat center/contain; content: ""; }
.sub_page_head_nav .nav_list > li:last-child:before { display: none; }
.sub_page_head_title { margin-top: 2.5rem; font-weight: 800; font-size: 45px; letter-spacing: -0.18rem; animation: fadeInUp 0.6s ease-out 0.4s; animation-fill-mode: both; }
.sub_page .real_content { animation: fadeInUp 0.6s ease-out 0.4s; animation-fill-mode: both; }

/* datepicker */
.ui-widget { font-size: 15px; font-family: "NotoSansKR"; }
.ui-widget-header { background: var(--primary); color: #fff; }
.ui-datepicker .ui-datepicker-header { padding: 0.2em; }
.ui-datepicker .ui-datepicker-prev,
.ui-datepicker .ui-datepicker-next { top: 50%; margin-top: -0.9em; cursor: pointer; }
.ui-datepicker .ui-datepicker-prev { left: 7px; }
.ui-datepicker .ui-datepicker-next { right: 7px; }
.ui-datepicker .ui-datepicker-prev:hover,
.ui-datepicker .ui-datepicker-next:hover { border: none; background-color: transparent; }
.ui-widget-header .ui-icon { background-image: url(../../images/common/ui-icons_ffffff_256x240.png); }
.ui-datepicker select.ui-datepicker-month,
.ui-datepicker select.ui-datepicker-year { width: 40%; margin-right: 5px; margin-left: 5px; padding: 0 0.2em; border-radius: 5px; color: #000; }

/* 메인 */
.main_page { margin-top: 120px; overflow: hidden; background-color: #f8f8f8; }
.main_page .section { padding: 8rem 0; }
.main_page .section.section3 { position: relative; padding: 0; }
.main_page .section.section4 { padding: 10rem 0; padding-bottom: 12rem; }
.main_page .main_bg_w { background-color: #fff; }
.main_page .main_bg_b { background-color: #e7effc; }
.main_page .inner { max-width: 1680px; }
.main_page .banner { position: relative; overflow: hidden; border-radius: var(--border_radius20); }
.main_page .banner .swiper-slide a { display: block; position: relative; }
.main_page .banner .swiper-slide a img { transition: 0.3s ease; }
.main_page .banner .swiper-slide a:after { display: block; position: absolute; top: 0; right: 0; bottom: 0; left: 0; background-color: rgba(0, 0, 0, 0.5); content: ""; opacity: 0; transition: 0.3s ease; }
.main_page .banner .swiper-slide a:hover:after { opacity: 1; }
.main_page .banner .swiper-slide a:hover img { transform: scale(1.1); }
.main_page .stats { display: grid; grid-template-columns: repeat(2, 1fr); height: 100%; gap: 3rem; }
.main_page .stats .stat_card { position: relative; padding: 3rem; border: 1px solid #eee; border-radius: var(--border_radius20); background-color: #fff; letter-spacing: -0.06em; transition: transform 0.3s ease; }
.main_page .stats .stat_title { color: var(--secondary); font-weight: bold; font-size: 19px; }
.main_page .stats .stat_value { font-weight: 800; font-size: 45px; line-height: 1.3; }
.main_page .stats .stat_icon { display: flex; position: absolute; top: 3rem; right: 3rem; bottom: 3rem; align-items: flex-end; }
.main_page .stats .stat_icon img { height: 45%; }
.main_page .lab_intro { padding-top: 2rem; letter-spacing: -0.13em; }
.main_page .lab_intro .intro_title { margin-bottom: 3rem; font-weight: 800; font-size: 40px; line-height: 1.3; }
.main_page .lab_intro .intro_title .point { color: var(--secondary); }
.main_page .lab_intro .intro_desc { line-height: 1.6; letter-spacing: normal; word-break: keep-all; }
.main_page .lab_cards { display: flex; overflow: auto; gap: 2rem; }
.main_page .lab_cards > li { flex: 1 0 220px; }
.main_page .lab_card { display: block; position: relative; height: 27rem; overflow: hidden; border: 1px solid #eee; border-radius: var(--border_radius10); word-break: keep-all; transition: all 0.3s ease; }
.main_page .lab_card .lab_card_wrap { position: relative; height: inherit; transition: all 0.3s ease; }
.main_page .lab_card .lab_card_wrap::before { display: flex; z-index: 1; position: absolute; top: 40px; right: -10px; align-items: center; justify-content: center; width: 50px; height: 50px; transform: translate(-50%, -50%); border-radius: 50%; background: rgba(0, 123, 255, 0.2); content: "Hover"; color: var(--primary); font-weight: bold; font-size: 10px; animation: pulseAnimation 2s infinite; opacity: 0; pointer-events: none; transition: opacity 0.3s ease; }
.main_page .lab_card .lab_card_default,
.main_page .lab_card .lab_card_overlay { position: relative; height: 100%; padding: 3.5rem 2.5rem; }
.main_page .lab_card .lab_card_default { display: flex; flex-direction: column; align-items: center; justify-content: center; background-color: #fff; }
.main_page .lab_card .lab_card_overlay { background-color: var(--primary); color: #fff; }
.main_page .lab_card .lab_card_default .card_icon { margin-bottom: 2.5rem; transition: all 0.3s ease; }
.main_page .lab_card .lab_card_default .card_icon img { height: 6.5rem; }
.main_page .lab_card .lab_card_default .card_title { font-weight: 800; font-size: 21px; text-align: center; transition: all 0.3s ease; }
.main_page .lab_card .lab_card_default .card_label { margin-bottom: 1rem; padding: 0.2rem 1.2rem; border-radius: var(--border_radius5); background-color: #e7effc; color: var(--primary); font-weight: bold; font-size: 14px; }
.main_page .lab_card .lab_card_overlay .card_title { margin-bottom: 2rem; font-weight: 800; font-size: 21px; }
.main_page .lab_card .lab_card_overlay .card_description { font-size: 15px; line-height: 1.6; letter-spacing: -0.02em; }
.main_page .lab_card:hover { box-shadow: 0 0.6rem 1.2rem rgba(0, 0, 0, 0.15); }
.main_page .lab_card:hover .lab_card_wrap { transform: translateY(-100%); }
.main_page .organization { display: flex; }
.main_page .organization .organization_info { display: flex; align-items: center; justify-content: space-between; width: 25rem; }
.main_page .organization .organization_title { flex-shrink: 0; font-weight: bold; font-size: 24px; }
.main_page .organization .organization_slide_wrap { width: calc(100% - 25rem); padding-left: 4.5rem; }
.main_page .organization .organization_slide { margin: 0 -1rem; }
.main_page .organization .organization_slide .swiper-slide { padding: 0 1rem; }
.main_page .organization .organization_slide .slide_item { display: flex; align-items: center; justify-content: center; height: 7.5rem; padding: 1rem; border: 1px solid #ddd; border-radius: var(--border_radius10); }
.main_page .organization .organization_slide .slide_item img { max-height: 100%; }
.main_page .livinglab { position: relative; padding: 0 6rem; padding-top: 3rem; }
.main_page .livinglab .swiper-slide { padding: 0 1.5rem; padding-top: 3rem; }
.main_page .livinglab .livinglab_box { display: flex; flex-direction: column; justify-content: center; overflow: hidden; border: 1px solid #ddd; border-radius: var(--border_radius15); transition: transform 0.3s ease, box-shadow 0.3s ease; }
.main_page .livinglab .livinglab_thumb { overflow: hidden; }
.main_page .livinglab .livinglab_thumb_img { width: 100%; transition: 0.3s ease; }
.main_page .livinglab .livinglab_content { padding: 2rem; transition: 0.3s ease; }
.main_page .livinglab .livinglab_date { margin-bottom: 1rem; font-weight: 800; font-size: 20px; }
.main_page .livinglab .livinglab_info { display: flex; margin: -0.3rem -1.5rem; font-weight: bold; font-size: 16px; letter-spacing: -0.05em; }
.main_page .livinglab .livinglab_info > li { display: -webkit-box; position: relative; max-width: 50%; -webkit-line-clamp: 2; padding: 0.3rem 1.5rem; word-break: keep-all; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis; }
.main_page .livinglab .livinglab_info > li:before { display: block; position: absolute; top: 50%; right: 0; width: 1px; height: 1.6rem; margin-top: -0.8rem; background-color: #ddd; content: ""; }
.main_page .livinglab .livinglab_info > li:last-child:before { display: none; }
.main_page .livinglab .swiper-slide-active .livinglab_box { transform: translateY(-3rem); border: 2px solid #000; box-shadow: 0 0.5rem 1.5rem 0 rgba(0, 0, 0, 0.15); }
.main_page .livinglab .swiper-slide-active .livinglab_thumb::after { opacity: 1; }
.main_page .livinglab .livinglab_box:hover .livinglab_thumb_img { transform: scale(1.1); }
.main_page .livinglab .livinglab_box:hover .livinglab_content { color: var(--primary); }
.main_page .board_area { display: flex; flex-wrap: wrap; }
.main_page .board_area .left,
.main_page .board_area .right { padding: 10rem 0; }
.main_page .board_area .left { display: flex; flex-direction: column; width: 55%; padding-right: 10rem; }
.main_page .board_area .right { position: relative; width: 45%; padding-left: 10rem; }
.main_page .board_area .right:before { display: block; position: absolute; top: 0; right: -100vw; bottom: 0; left: 0; background-color: #101a27; content: ""; }
.main_page .board_area .board_box { position: relative; margin-bottom: 3rem; padding: 3.5rem 4rem; padding-bottom: 4rem; border: 1px solid #eee; border-radius: var(--border_radius20); background-color: #fff; }
.main_page .board_area .board_box:last-child { margin-bottom: 0; }
.main_page .board_area .board_box.box2 { flex-grow: 1; }
.main_page .board_area .board_more { z-index: 1; position: absolute; top: 4rem; right: 4rem; }
.main_page .announce .announce_link { display: block; }
.main_page .announce .announce_title_wrap { display: flex; align-items: center; margin-bottom: 1.5rem; }
.main_page .announce .announce_state { flex-shrink: 0; margin-right: 1rem; }
.main_page .announce .announce_title { overflow: hidden; font-weight: 800; font-size: 20px; text-overflow: ellipsis; white-space: nowrap; transition: 0.3s ease; }
.main_page .announce .announce_desc { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis; }
.main_page .announce .announce_info { margin-top: 2.5rem; padding-top: 2.5rem; border-top: 1px solid #ddd; font-size: 16px; }
.main_page .announce .announce_info > li { position: relative; padding-left: 1.5rem; }
.main_page .announce .announce_info > li:before { display: block; position: absolute; top: 50%; left: 0; width: 4px; height: 4px; margin-top: -2px; border-radius: 1000px; background-color: #888; content: ""; }
.main_page .announce .announce_info dl { display: flex; align-items: center; margin: -0.5rem -1.5rem; }
.main_page .announce .announce_info dt,
.main_page .announce .announce_info dd { position: relative; padding: 0.5rem 1.5rem; }
.main_page .announce .announce_info dt { flex-shrink: 0; }
.main_page .announce .announce_info dt:before { display: block; position: absolute; top: 50%; right: 0; width: 1px; height: 1.4rem; margin-top: -0.7rem; background-color: #ddd; content: ""; }
.main_page .announce .announce_link:hover .announce_title { color: var(--primary); }
.main_page .notice .notice_list { margin: -2rem 0; }
.main_page .notice .notice_list > li { border-bottom: 1px solid #ddd; }
.main_page .notice .notice_list > li:last-child { border-bottom: none; }
.main_page .notice .notice_list .cm_nodata1 { border-bottom: none !important; }
.main_page .notice .notice_box { display: flex; align-items: center; padding: 2rem 0; }
.main_page .notice .notice_date { display: flex; flex-shrink: 0; flex-direction: column; align-items: center; justify-content: center; width: 8rem; height: 8rem; margin-right: 2rem; border-radius: var(--border_radius10); background-color: #f2f2f2; color: #666; font-weight: bold; font-size: 16px; line-height: 1.2; letter-spacing: -0.01em; transition: background-color 0.2s ease; }
.main_page .notice .notice_date .date1 { font-weight: 800; font-size: 24px; }
.main_page .notice .notice_date .date2 { letter-spacing: -0.05em; }
.main_page .notice .notice_content { width: calc(100% - 10rem); letter-spacing: -0.05em; }
.main_page .notice .notice_title { overflow: hidden; font-weight: bold; font-size: 20px; text-overflow: ellipsis; white-space: nowrap; transition: 0.2s ease; }
.main_page .notice .notice_desc { margin-top: 1rem; overflow: hidden; color: #444; text-overflow: ellipsis; white-space: nowrap; }
.main_page .notice .notice_box:hover .notice_title { color: var(--primary); }
.main_page .notice .notice_box:hover .notice_date { background-color: var(--secondary); color: #fff; }
.main_page .timeline { position: relative; color: #fff; }
.main_page .cm_title2 .icon_time { display: inline-block; position: relative; padding-left: 6.5rem; }
.main_page .cm_title2 .icon_time:before { display: block; position: absolute; top: 50%; left: 0; width: 4.9rem; height: 4.9rem; margin-top: -2.45rem; background: url(../../images/common/icon_time.png) no-repeat center/contain; content: ""; }
.main_page .timeline_title_wrap { font-weight: 800; }
.main_page .timeline_btitle { overflow: hidden; font-size: 24px; text-overflow: ellipsis; white-space: nowrap; }
.main_page .timeline_stitle { margin-top: 0.5rem; overflow: hidden; font-size: 20px; text-overflow: ellipsis; white-space: nowrap; }
.main_page .cm_timeline { max-width: none; margin-top: 4rem; margin-bottom: 0; }
.main_page .cm_timeline:before { left: 0.9rem; }
.main_page .cm_timeline .cm_circle { top: -13rem; right: -9rem; bottom: auto; }
.main_page .cm_timeline .timeline_item:before { background-color: #101a27; }
.main_page .cm_timeline .timeline_content { width: calc(100% - 28rem); }
.main_page .cm_timeline .timeline_thumb { width: 28rem; border-radius: var(--border_radius10); }
.main_page .cm_timeline .timeline_item_wrap { max-height: 76rem; padding-right: 1rem; padding-left: 1rem; overflow-x: hidden; overflow-y: auto; }
.main_page .cm_timeline .timeline_item_wrap::-webkit-scrollbar { width: 5px; height: 5px; }
.main_page .cm_timeline .timeline_item_wrap::-webkit-scrollbar-thumb { background: #ff9600; }
.main_page .cm_timeline .timeline_item_wrap::-webkit-scrollbar-track { border-radius: var(--border_radius10); background: #fff; }
.main_page .youtube { overflow: hidden; border-radius: var(--border_radius20); }
.main_page .press { height: 100%; }
.main_page .press .press_list { display: flex; height: 100%; margin: 0 -1rem; }
.main_page .press .press_list > li { width: 33.3%; padding: 0 1rem; }
.main_page .press .press_box { display: flex; position: relative; flex-direction: column; height: 100%; overflow: hidden; border-radius: var(--border_radius10); background-color: #fff; transition: box-shadow 0.3s ease; }
.main_page .press .press_box:before { display: block; z-index: 1; position: absolute; top: 0; right: 0; bottom: 0; left: 0; border: 2px solid #000; border-radius: inherit; content: ""; opacity: 0; transition: opacity 0.2s ease; }
.main_page .press .press_thumb { flex-shrink: 0; overflow: hidden; }
.main_page .press .press_thumb_img { transition: 0.3s ease; }
.main_page .press .press_content { display: flex; flex-grow: 1; flex-direction: column; justify-content: center; padding: 1rem 2rem; }
.main_page .press .press_title { display: -webkit-box; -webkit-line-clamp: 2; font-size: 16px; -webkit-box-orient: vertical; overflow: hidden; font-weight: bold; text-overflow: ellipsis; }
.main_page .press .press_date { margin-top: 1.5rem; color: #666; font-size: 15px; }
.main_page .press .press_box:hover { box-shadow: 0 0.5rem 1.5rem 0 rgba(0, 0, 0, 0.15); }
.main_page .press .press_box:hover:before { opacity: 1; }
.main_page .press .press_box:hover .press_thumb_img { transform: scale(1.1); }

/* 서브 공통 */
.cm_section { margin: 7.5rem 0; }
.cm_section:last-of-type { margin-bottom: 0; }
.cm_section .bg { position: relative; padding: 7.5rem 0; }
.cm_section .bg:before { display: block; z-index: -1; position: absolute; right: 0; bottom: 0; left: 0; content: ""; }
.cm_section .design_type1 { position: relative; }
.cm_section .design_type1 .left { position: absolute; bottom: 1rem; left: 3rem; }
.cm_section .design_type1 .right .top,
.cm_section .design_type1 .right .btm { padding-left: 30rem !important; }
.cm_section .design_type1 .right .btm { padding: 3rem; border: 1px solid #ddd; border-radius: var(--border_radius15); }

/* 소개 */
.page_LL3,
.page_LL4,
.page_LL5,
.page_LL59,
.page_LL62 { font-size: 20px; }

/* 리빙랩 소개 */
.page_LL3 .cm_section.section2 { padding: 7.5rem 0; background-color: #f8f8f8; }
.page_LL3 .cm_section.section4 .bg { padding-top: 0; }
.page_LL3 .cm_section.section4 .bg:before { height: 60%; background-color: #f4f8ff; }

/* 라스트마일 딜리버리 리빙랩 */
.page_LL4 .cm_section.section1 { position: relative; padding-bottom: 7.5rem; }
.page_LL4 .cm_section.section1:before { display: block; z-index: -1; position: absolute; right: 0; bottom: 0; left: 0; height: 35%; background-color: #f4f8ff; content: ""; }
.page_LL4 .cm_section.section2 .bg:before { height: 100%; background-color: #f8f8f8; }
.page_LL4 .cm_section.section4 .bg:before { height: 100%; background-color: #f8f8f8; }
.page_LL4 .cm_section.section6 .bg:before { height: 100%; background-color: #f8f8f8; }

/* 혁신생태계 발굴형 리빙랩 */
.page_LL5 .cm_section.section1 .bg { padding-bottom: 7.5rem; }
.page_LL5 .cm_section.section1 .bg:before { height: 60%; background-color: #f4f8ff; }

/* 시민연구원 */
.sub_page.page35 { position: relative; }
.sub_page.page35:before { position: absolute; right: 0; bottom: 0; left: 0; height: 35%; background-color: #f4f8ff; content: ""; }
@media screen and (min-width:1200px) {

	/* header */
	.header { z-index: 9999; position: fixed; top: 0; left: 0; width: 100%; height: 120px; }
	.header .header_wrapper { position: relative; box-shadow: 3px 4px 15px 0px rgba(0, 0, 0, 0.05); }
	.header .header_wrapper:before { display: block; z-index: 1; position: absolute; top: 0; right: 0; left: 0; height: 120px; background-color: #fff; content: ""; }
	.header .header_bg { display: none; position: absolute; top: 120px; left: 0; width: 100%; height: 0; border-top: 1px solid #ddd; background-color: #fff; box-shadow: 0px 8px 19px 0px rgba(7, 0, 2, 0.1); }
	.header .header_inner { display: flex; z-index: 1; position: relative; align-items: flex-start; justify-content: center; max-width: 1630px; height: 120px; }
	.header .logo { display: inline-flex; position: absolute; top: 0; left: var(--bs-gutter-x); flex-shrink: 0; align-items: center; height: 120px; }
	.header .logo_img { display: block; }
	.header .logo img { display: block; height: 24px; }
	.header .gnb_depth1 { display: flex; align-items: flex-start; justify-content: center; }
	.header .gnb_depth1 > li { position: relative; flex-grow: 1; min-width: 160px; }
	.header .gnb_depth1 > li > a { display: flex; align-items: center; justify-content: center; height: 120px; padding: 0 20px; }
	.header .gnb_depth1 > li > a:before { display: block; position: absolute; top: 100%; left: 50%; width: 7px; height: 7px; margin-top: -3.5px; margin-left: -3.5px; transform: scale(0); border-radius: 1000px; background-color: #014df9; content: ""; transition: transform 0.3s ease; }
	.header .gnb_depth1 > li > a span { display: block; font-weight: 800; font-size: 22px; }
	.header .gnb_depth2_wrap { display: none; position: absolute; left: 0; width: 100%; }
	.header .gnb_depth2 { position: relative; padding: 35px 0 50px; }
	.header .gnb_depth2 > li { z-index: 1; position: relative; }
	.header .gnb_depth2 > li > a { display: flex; align-items: center; justify-content: center; padding: 5px 0; text-align: center; word-break: keep-all; }
	.header .gnb_depth2 > li > a span { display: block; position: relative; color: #666; font-size: 17px; }
	.header .gnb_depth2 > li > a span:before { display: block; position: absolute; top: 100%; right: 0; left: 0; height: 1px; transform: scaleX(0); background-color: #222; content: ""; transition: transform 0.3s ease; }
	.header .gnb_depth1 > li:hover > a { color: #014df9; }
	.header .gnb_depth1 > li:hover > a:before { transform: scale(1); }
	.header .gnb_depth2 > li > a:hover span { color: #222; font-weight: bold; }
	.header .gnb_depth2 > li > a:hover span:before { transform: scaleX(1); }
	.header .util { display: inline-flex; position: absolute; top: 0; right: var(--bs-gutter-x); flex-shrink: 0; align-items: center; height: 120px; }
	.header .util_menu { display: flex; margin: 0 -20px; }
	.header .util_menu > li { position: relative; padding: 0 20px; }
	.header .util_menu > li.mobile_menu { display: none; }
	.header .util_menu > li:before { display: block; position: absolute; top: 50%; right: 0; width: 1px; height: 14px; margin-top: -7px; background-color: #ddd; content: ""; }
	.header .util_menu > li:nth-child(2):before { display: none; }
	.header .util_menu > li > a { font-weight: bold; font-size: 17px; }
}
@media screen and (min-width:1200px) and (max-width:1489px) {
	.header .gnb_depth1 > li { min-width: auto; }
}
@media screen and (max-width:1680px) {
	.main_page .board_area .left { padding-right: 5rem; }
	.main_page .board_area .right { padding-left: 5rem; }
}
@media screen and (max-width:1489px) {
	.main_page .row { --bs-gutter-x: 1rem; }
	.main_page .stats { gap: 1.5rem; }
	.main_page .stats .stat_card { padding: 2rem; }
	.main_page .stats .stat_title { font-size: 16px; }
	.main_page .stats .stat_value { font-size: 35px; }
	.main_page .lab_cards { gap: 1.5rem; }
	.main_page .board_area .left,
	.main_page .board_area .right { padding: 5rem 0; }
	.main_page .board_area .left { width: 100%; }
	.main_page .board_area .right { width: 100%; }
	.main_page .board_area .right:before { right: calc(var(--bs-gutter-x) * -1); left: calc(var(--bs-gutter-x) * -1); }
}
@media screen and (max-width:1489px) and (max-width:1199px) {
	.main_page .stats .stat_title { font-size: 14px; }
	.main_page .stats .stat_value { font-size: 21px; }
}
@media screen and (max-width:1199px) {
	body.header_open { overflow: hidden; }
	.header { z-index: 9999; position: fixed; top: 0; left: 0; width: 100%; height: 56px; border-bottom: 1px solid #ddd; background-color: #fff; }
	.header .logo { display: inline-flex; position: absolute; top: 0; left: var(--bs-gutter-x); flex-shrink: 0; align-items: center; height: 55px; }
	.header .logo_img { display: block; }
	.header .logo img { display: block; width: 120px; }
	.header .gnb { z-index: 9999; position: fixed; top: 56px; right: -100%; bottom: 0; width: 100%; padding: 0 20px; background-color: #fff; line-height: 1.3; letter-spacing: -0.05em; transition: right 0.3s ease; }
	.header .gnb_depth1 > li { border-bottom: 1px solid #ddd; }
	.header .gnb_depth1 > li > a { display: flex; position: relative; align-items: center; min-height: 55px; padding: 5px 0; font-weight: 800; font-size: 16px; }
	.header .gnb_depth1 > li.has_depth > a:before { display: block; position: absolute; top: 50%; right: 0; width: 14px; height: 8px; margin-top: -4px; background: url(../../images/common/icon_arrow_down2.svg) no-repeat center/contain; content: ""; }
	.header .gnb_depth1 > li.has_depth.hover > a:before { background-image: url(../../images/common/icon_arrow_up2.svg); }
	.header .gnb_depth2_wrap { display: none; }
	.header .gnb_depth2 { margin-bottom: -1px; padding: 10px 20px; background-color: #f6f9fe; }
	.header .gnb_depth2 > li > a { display: flex; align-items: center; min-height: 40px; padding: 5px 0; font-size: 15px; }
	.header .gnb_depth2 > li.active > a { color: var(--primary); font-weight: bold; }
	.header .gnb_depth1 > li.active .gnb_depth2_wrap { display: block; }
	.header .util { display: flex; position: absolute; top: 0; right: 55px; flex-shrink: 0; align-items: center; justify-content: center; height: 55px; }
	.header .util_menu { display: flex; margin: 0 -10px; }
	.header .util_menu > li { position: relative; padding: 0 10px; }
	.header .util_menu > li:before { display: block; position: absolute; top: 50%; right: 0; width: 1px; height: 14px; margin-top: -7px; background-color: #ddd; content: ""; }
	.header .util_menu > li:nth-child(2):before { display: none; }
	.header .util_menu > li:nth-child(3):before { display: none; }
	.header .util_menu > li.mobile_menu { padding: 0; }
	.header .util_menu > li > a { font-weight: bold; font-size: 12px; }
	.header .mobile_menu_btn { display: flex; position: fixed; top: 0; right: 12px; align-items: center; justify-content: center; width: 35px; height: 55px; border: none; outline: none; background: transparent; cursor: pointer; }
	.header .mobile_menu_btn .line_wrap { position: relative; width: 18px; height: 14px; }
	.header .mobile_menu_btn .line { position: absolute; left: 0; width: 100%; height: 2px; background: #000; transition: all 0.3s; }
	.header .mobile_menu_btn .line:nth-child(1) { top: 0; }
	.header .mobile_menu_btn .line:nth-child(2) { top: 50%; transform: translateY(-50%); }
	.header .mobile_menu_btn .line:nth-child(3) { bottom: 0; }
	.header .mobile_menu_btn.active .line:nth-child(1) { transform: translateY(6px) rotate(45deg); }
	.header .mobile_menu_btn.active .line:nth-child(2) { opacity: 0; }
	.header .mobile_menu_btn.active .line:nth-child(3) { transform: translateY(-6px) rotate(-45deg); }
	.header.open .gnb { right: 0; }
	.footer { font-size: 14px; }
	.footer .footer_familysite_options a { font-size: 14px; }
	.sub_page_head_nav { font-size: 14px; }
	.sub_page_head_title { font-size: 27px; }
	.sub_page { margin-top: 50px; }
	.sub_page_head { margin-bottom: 20px; }
	.ui-widget { font-size: 14px; }
	.main_page { margin-top: 50px; }
	.main_page .banner { margin-bottom: 10px; }
	.main_page .stats .stat_title { font-size: 14px; }
	.main_page .stats .stat_value { font-size: 27px; }
	.main_page .stats .stat_card { padding-bottom: 6rem; }
	.main_page .lab_intro .intro_title { font-size: 24px; }
	.main_page .lab_card .lab_card_default .card_title { font-size: 14px; }
	.main_page .lab_card .lab_card_default .card_label { font-size: 14px; }
	.main_page .lab_card .lab_card_overlay .card_title { font-size: 14px; }
	.main_page .lab_card .lab_card_overlay .card_description { font-size: 14px; }
	.main_page .lab_card { height: 42rem; }
	.main_page .lab_cards > li { flex-basis: 48%; }
	.main_page .organization .organization_title { font-size: 15px; }
	.main_page .organization .organization_info { display: none; }
	.main_page .organization .organization_slide_wrap { width: 100%; padding-left: 0; }
	.main_page .livinglab .livinglab_date { font-size: 14px; }
	.main_page .livinglab .livinglab_info { flex-direction: column; font-size: 14px; }
	.main_page .livinglab .livinglab_info > li { max-width: none; }
	.main_page .livinglab .livinglab_info > li:before { display: none; }
	.main_page .announce .announce_title { font-size: 14px; }
	.main_page .announce .announce_info { font-size: 14px; }
	.main_page .notice .notice_date { width: 56px; height: 56px; font-size: 12px; }
	.main_page .notice .notice_date .date1 { font-size: 15px; }
	.main_page .notice .notice_title { font-size: 14px; }
	.main_page .timeline_btitle { font-size: 15px; }
	.main_page .timeline_stitle { font-size: 14px; }
	.main_page .cm_timeline { max-width: none; }
	.main_page .press .press_title { font-size: 14px; }
	.main_page .press .press_date { font-size: 14px; }
	.cm_section .design_type1 { display: flex; align-items: center; padding: 2rem; gap: 1rem; border: 1px solid #ddd; border-radius: var(--border_radius15); }
	.cm_section .design_type1 .left { position: static; flex-shrink: 0; }
	.cm_section .design_type1 .right .top,
	.cm_section .design_type1 .right .btm { padding-left: 0 !important; }
	.cm_section .design_type1 .right .btm { padding: 0; border: 0; }
	.page_LL3,
	.page_LL4,
	.page_LL5,
	.page_LL59,
	.page_LL62 { font-size: 14px; }
}
@media screen and (max-width:1024px) {
	.footer .footer_bottom .footer_inner { flex-direction: column; align-items: stretch; text-align: center; }
	.footer .foot_nav { margin-top: 15px; }
	.footer .footer_familysite_wrap { position: static; margin-bottom: 15px; }
	.footer .footer_familysite { width: 100%; }
	.footer .footer_familysite_title { height: 35px; }
}
@media screen and (max-width:768px) {
	.main_page .cm_timeline .timeline_content { width: 100%; }
	.main_page .press { overflow: auto; }
	.main_page .press .press_list > li { min-width: 150px; }
	.cm_section .design_type1 .left { width: 30%; }
}
@media screen and (max-width:480px) {
	.main_page .cm_timeline .timeline_thumb { width: 80%; }
	.cm_section .design_type1 { flex-direction: column-reverse; padding: 0; border: 0; }
}