@media screen and (max-width: 1600px) {
  #gnb_layout .depth1_ul > li {
    margin: 0 10px;
    /*대메뉴사이간격조절*/
  }

  #gnb_layout .depth1_ul .item {
    padding: 0 0 0 400px;
  }

  #gnb_layout .depth1_ul .item .gnb-title .bg-text {
    background-position: left 80px center;
  }

  #gnb_layout .depth1_ul .item .gnb-title {
    padding: 60px 40px 0 80px;
    width: 400px;
  }

  #gnb_layout .depth2_ul {
    max-width: 700px;
    padding-left: 25px;
  }

  #gnb_layout .depth2_ul > li > a {
    min-width: 120px;
    font-size: 14px;
  }
}

@media screen and (max-width: 1460px) {
  .lnb_wrap {
    padding: 0 4%;
  }

  .pd-cont {
    padding: 0 2%;
  }

  .pd-cont-2 {
    padding: 0 4%;
  }

  .pd-cont-3 {
    padding: 75px 4%;
    min-width: auto;
  }

  #top_layout .top_wrap #logo {
    left: 3%;
  }

  #top_layout .top_wrap .utile_wrap {
    right: 3%;
  }

  #gnb_layout .depth1_ul .item .gnb-title {
    padding: 40px 40px 0 40px;
    width: 350px;
  }

  #gnb_layout .depth1_ul .item .gnb-title .bg-text {
    background-position: left 40px center;
  }

  #gnb_layout .depth1_ul .item {
    padding: 0 0 0 350px;
  }

  .depth2_ul > li > a {
    min-width: 120px;
  }

  #gnb_layout .depth1_ul > li {
    margin: 0 10px;
    /*대메뉴사이간격조절*/
  }

  #gnb_layout .depth1_ul > li > a span {
    padding: 0 20px;
    font-size: 20px;
  }

  #gnb_layout .depth1_ul {
    margin-left: 50px;
  }

  #gnb_layout .depth2_ul {
    max-width: 580px;
    padding-left: 20px;
  }

  #gnb_layout .depth2_ul > li > a {
    min-width: 120px;
    font-size: 14px;
  }

  #list_01 .list_item {
    width: calc(50% - 20px);
  }

  #list_01 .list_item2 {
    width: calc(50% - 20px);
  }

  #view_02 .view_body .btn_all_down2 a {
    display: block;
    font-size: 16px;
    font-weight: 700;
    text-align: left;
    padding: 20px 30px;
    color: #fff;
  }

  #view_02 .view_body .btn_all_down2 {
    background-size: 15px;
  }

  /*홍보자료*/
  .info__btn-container {
    display: none;
  }

  /*연혁*/
  .timeline-items {
    flex-direction: column;
    gap: 10px;
  }

  .timeline-item {
    flex: 1 1 100%;
    max-width: 100%;
    text-align: left !important; /* 좌우 정렬 제거 */
  }
}

@media screen and (max-width: 1200px) {
  /*게시판&배너*/
  .content-wrapper {
    flex-direction: row; /* PC 구조 유지 */
    max-width: 100%; /* wrapper가 화면 폭에 맞도록 */
  }

  .left-section {
    flex: 7;
    padding-right: 15px;
  }

  .right-section {
    flex: 3;
  }

  .content-display {
    width: 700px !important; /* 기존 940px -> 화면에 맞게 줄임 */
    padding: 40px 30px 25px 30px; /* 패딩도 줄임 */
  }

  /* 배너 너비 조정 */
  .top-banner-container,
  .bottom-banner-container {
    width: 250px !important; /* 기존 320px -> 화면 폭에 맞춤 */
  }

  .bottom-banner-container .swiper-slide img {
    width: 250px !important;
    height: auto; /* 비율 유지 */
  }

  /*즐겨찾기*/
  .bipa-content {
    max-width: 1200px;
    padding: 0 20px;
    justify-content: space-between;
  }

  /* 왼쪽 홍보동영상 */
  .bipa-video-banner,
  .bipa-video-banner img {
    max-width: 500px !important;
    height: 300px;
  }

  /* 가운데 자주찾는 메뉴 */
  .bipa-menu-items {
    width: 280px !important;
  }

  .bipa-menu-link {
    max-width: 280px !important;
    padding: 25px 0;
  }

  .bipa-menu-text {
    font-size: 18px;
    margin-left: 25px;
  }

  .bipa-menu-icon {
    width: 35px;
    height: 35px;
    margin-right: 20px;
  }

  /* 오른쪽 배너 */
  .bipa-banner-item {
    width: 280px !important;
  }

  .bipa-banner-link {
    max-width: 280px !important;
    padding: 35px 0;
  }

  .bipa-banner-img {
    width: 60px;
    height: 60px;
    margin-right: 20px;
  }

  .bipa-banner-title {
    font-size: 18px;
    margin-left: 25px;
  }

  .bipa-banner-text {
    font-size: 14px;
    margin-left: 25px;
  }

  /* 제목 영역 */
  .bipa-title {
    font-size: 32px;
  }

  .bipa-tit2 {
    font-size: 30px;
  }

  /* 전체 섹션 패딩도 약간 줄임 */
  .bipa-menu-section {
    padding: 40px 0;
  }

  #top_layout .top_wrap .utile_wrap {
    display: flex;
    justify-content: flex-end; /* 오른쪽 정렬 */
    gap: 15px; /* 아이템 간격 */
    position: relative; /* 필요시 right 적용 가능 */
  }

  /* PC 전용 요소 숨기기 */
  #top_layout .top_wrap .utile_wrap > li.pc {
    display: none;
  }

  /* MO 전용 요소 보이기 */
  #top_layout .top_wrap .utile_wrap > li.mo {
    display: block; /* flex 아이템이면 block/inline-block 충분 */
  }

  /* site-link 숨기기 (중복 제거) */
  #top_layout .top_wrap .utile_wrap.pc .site-link {
    display: none;
  }

  #gnb_layout {
    display: none;
  }

  #sub_top .sub_title {
    margin-left: 20px;
  }

  /* 메뉴 */
  #subCont {
    margin: 0;
  }

  #subCont .inner {
    flex-wrap: wrap;
    gap: 10px;
    width: auto;
    padding: 0 15px;
  }

  #subCont .page-left {
    width: 100%;
    margin-right: 0;
    margin-bottom: 20px;
  }

  #subCont .left-top {
    border-radius: 10px;
  }

  #subCont .page-name {
    padding: 20px 25px;
    font-size: 20px;
  }

  #subCont .page-name:after {
    display: none;
  }

  /* 모바일에서는 메뉴를 가로 스크롤 형태로 변경 */
  #subCont .m-snb ul.left-menu {
    display: flex;
    overflow-x: auto;
    padding: 10px;
    white-space: nowrap;
    -webkit-overflow-scrolling: touch;
    touch-action: pan-x;
  }

  #subCont .m-snb ul.left-menu > li {
    margin: 0 5px;
    flex-shrink: 0;
  }

  #subCont .m-snb ul.left-menu > li a {
    padding: 12px 15px;
    font-size: 15px;
  }

  /* 선택된 메뉴 스타일 조정 */
  #subCont .m-snb ul.left-menu > li.on > a {
    padding-left: 15px;
    background: #e8f3ff;
    background-image: none;
    /* 아이콘 제거 */
  }

  #subCont .m-snb ul.left-menu > li:not(.on) a:hover {
    background: #f5f9ff;
    color: #0068b7;
    /* 로고 색상으로 변경 */
  }

  #subCont .m-snb ul.left-menu > li.on > a:hover {
    background: #e8f3ff;
    background-image: none;
    /* 아이콘 제거 */
    color: #0068b7;
  }

  #footer .foot-body .logo_wrap > .f-logo {
    background-size: 65%;
  }

  #footer .foot-body .logo_wrap {
    margin-bottom: 10px;
  }

  footer .foot-body .social-icons {
    float: left;
    position: absolute;

    margin-left: 280px;
  }

  #footer .foot-body .social-icons a {
    margin-left: 10px;
  }

  #footer .foot-body .social-icons img {
    width: 39px;
    height: 39px;
  }

  /*홍보자료*/
  .info__btn-container {
    display: none;
  }

  /*추진사업*/
  .project-table .col-wide {
    width: 50%;
  }

  .project-table .col-narrow {
    width: 50%;
  }

  /*비전*/
  .vision-box {
    padding: 30px 20px;
    max-width: 90%;
  }

  .strategy-card {
    max-width: 95%;
  }

  .task-card-horizontal {
    width: 90%;
  }

  /*연혁*/
  .timeline-items {
    flex-direction: column;
    gap: 15px;
  }

  .timeline-item {
    flex: 1 1 100%;
    max-width: 100%;
    text-align: left !important; /* 좌우 정렬 제거 */
  }
}

@media screen and (max-width: 900px) {
  .sub-org-card {
    flex: 0 0 calc(50% - 10px);
  }

  /*오시는길*/
  .task-card-horizontal {
    width: 100%; /* 화면이 좁아지면 한 줄에 하나 */
  }
}

@media screen and (max-width: 768px) {
  .slide-wrapper {
    position: relative;
  }

  /*메인이미지*/
  .main-visual {
    height: auto !important;
  }

  .bg-video {
    display: none !important;
  }

  .bg-main-slide {
    position: relative !important; /* 배경은 뒤로 */
    z-index: 1 !important;
    height: 500px !important;
  }

  .bg-main-slide img {
    width: 100%;
    height: 100% !important;
    display: none; /* JS로 순차적 표시 */
  }

  .visual-text {
    flex-direction: column !important; /* 세로 배치 */
    top: 150px !important;
    z-index: 6 !important;
  }

  .main-slogan {
    font-size: 22px !important; /* 모바일에 맞게 크기 줄이기 */
    margin-right: 0 !important; /* 가로 여백 제거 */
  }

  .image-text-img {
    max-width: 220px !important; /* 이미지 크기 축소 */
  }

  .overlay {
    z-index: 5 !important;
  }

  .image-text-img {
    max-width: 100%; /* 이미지의 최대 너비 설정 */
    height: auto; /* 비율 유지 */
  }

  /*추진사업*/
  .promotion-section {
    padding: 40px 0 !important;
  }

  .promotion-content {
    flex-direction: column; /* 세로 배치 */
    padding: 0 15px; /* 좌우 여백 살짝 줄이기 */
  }

  .pro-left-section,
  .pro-right-section {
    flex: none; /* 비율 초기화 */
    width: 100%; /* 전체 폭 사용 */
    padding-left: 10px !important; /* 오른쪽 여백 제거 */
    margin-bottom: 20px !important; /* 섹션 간 간격 */
  }

  .pro-txt {
    font-size: 12px !important;
  }

  .pro-left-section h2 {
    font-size: 32px !important;
    margin-bottom: 30px !important;
  }

  .pro-left-section p {
    font-size: 16px !important;
    color: #fff;
    margin-bottom: 15px;
  }

  .pro-buttons .pro-button1 {
    padding: 10px 20px !important;
    background-color: #22a9fd;
    color: white;
    font-size: 14px !important;
    margin-right: 10px;
  }

  .pro-buttons .pro-button2 {
    padding: 10px 20px !important;
    background-color: #4a52cc;
    color: white;
    font-size: 14px !important;
  }

  .pro-banner {
    gap: 10px !important;
  }

  .pro-banner-item {
    position: relative !important;
    width: calc(49% - 10px) !important; /* 한 줄에 2개 */
    float: left; /* 좌우로 나열 */
  }

  .pro-banner-link {
    padding: 0px !important;
    background-color: #20548d;
    color: white;
    text-align: left;
    font-size: 14px !important;
    height: 120px !important;
  }

  .pro-banner-link a {
    color: white;
    text-align: left;
  }

  .pro-banner-btn {
    display: none;
  }

  /*즐겨찾기*/
  .bipa-video-banner {
    margin: 0 auto !important;
    height: auto !important;
    padding-bottom: 20px !important;
  }

  .bipa-video-banner img {
    margin: 0 auto;
    width: 100% !important;
    height: 250px !important;
    border-radius: 10px;
    cursor: pointer;
  }

  .bipa-middle-section {
    margin: 0 auto;
    width: 100% !important;
  }

  .bipa-right-section {
    margin: 0 auto;
    width: 100% !important;
  }

  .bipa-title {
    font-size: 32px !important;
  }

  .bipa-tit2 {
    font-size: 32px !important;
  }

  .bipa-menu-items {
    width: 100% !important; /* 콘텐츠 크기에 맞춤 */
    margin: 0 auto;
  }
  .bipa-menu-text {
    font-size: 16px !important;
  }
  .bipa-banner-title {
    font-size: 16px !important;
  }
  .bipa-banner-text {
    font-size: 14px !important;
  }
  .bipa-menu-item {
    width: 100% !important;
    display: flex; /* 가운데 정렬을 위한 flex */
    justify-content: center; /* 가로 중앙 */
    align-items: center; /* 세로 중앙 (선택 사항) */
    text-align: center;
    margin-bottom: 10px !important;
  }

  .bipa-menu-link {
    display: flex;
    flex-direction: column; /* 아이콘 위, 텍스트 아래 */
    align-items: center;
    justify-content: center;
    width: auto; /* 필요 시 auto로 */
    padding: 10px 0 !important;
  }

  .bipa-banner-item {
    width: 100% !important;
    display: flex; /* 가운데 정렬을 위한 flex */
    justify-content: center; /* 가로 중앙 */
    align-items: center; /* 세로 중앙 (선택 사항) */
    text-align: center;
  }

  .bipa-banner-link {
    display: flex;
    flex-direction: column; /* 아이콘 위, 텍스트 아래 */
    align-items: center;
    justify-content: center;
    width: auto; /* 필요 시 auto로 */
    padding: 10px 0 !important;
    max-width: 100% !important;
  }

  #top_layout .top_wrap {
    height: 74px;
  }

  #top_layout .top_wrap #logo {
    display: inline-block;
    width: auto;
    top: 27px;
  }

  #top_layout .top_wrap #logo > .f-logo {
    display: inline-block;
    width: 240px;
  }

  #top_layout .top_wrap .utile_wrap {
    top: 27px;
  }

  .lnb_wrap {
    padding: 0;
    /* margin-top: 75px;*/
  }

  .pd-cont {
    padding: 0 2%;
  }

  .pd-cont-3 {
    padding: 0 4%;
  }

  #sub_top .sub_title {
    font-size: 24px;
    margin-bottom: 40px;
    margin-left: 15px;
  }

  /* 메뉴 */
  #subCont {
    margin: 0;
  }

  #subCont .inner {
    flex-wrap: wrap;
    gap: 10px;
    width: auto;
    padding: 0 15px;
  }

  #subCont .page-left {
    width: 100%;
    margin-right: 0;
    margin-bottom: 20px;
  }

  #subCont .left-top {
    border-radius: 10px;
  }

  #subCont .page-name {
    padding: 20px 25px;
    font-size: 20px;
  }

  #subCont .page-name:after {
    display: none;
  }

  /* 모바일에서는 메뉴를 가로 스크롤 형태로 변경 */
  #subCont .m-snb ul.left-menu {
    display: flex;
    overflow-x: auto;
    padding: 10px;
    white-space: nowrap;
    -webkit-overflow-scrolling: touch;
    touch-action: pan-x;
  }

  #subCont .m-snb ul.left-menu > li {
    margin: 0 5px;
    flex-shrink: 0;
  }

  #subCont .m-snb ul.left-menu > li a {
    padding: 12px 15px;
    font-size: 15px;
  }

  /* 선택된 메뉴 스타일 조정 */
  #subCont .m-snb ul.left-menu > li.on > a {
    padding-left: 15px;
    background: #e8f3ff;
    background-image: none;
    /* 아이콘 제거 */
  }

  #subCont .m-snb ul.left-menu > li:not(.on) a:hover {
    background: #f5f9ff;
    color: #0068b7;
    /* 로고 색상으로 변경 */
  }

  #subCont .m-snb ul.left-menu > li.on > a:hover {
    background: #e8f3ff;
    background-image: none;
    /* 아이콘 제거 */
    color: #0068b7;
  }

  .lnb_wrap div.lnb_item:first-child {
    width: 40px;
  }

  .lnb_wrap .home {
    width: 17px;
    margin-left: 15px;
    text-align: center;
    background-image: url("../../../images/home/home.svg");
    /* 아이콘 이미지 경로 설정 */
    background-size: contain;
    /* 이미지 크기 맞추기 */
    background-repeat: no-repeat;
    /* 이미지 반복 방지 */
    display: inline-block;
    /* 텍스트를 표시할 필요 없으므로 inline-block으로 변경 */
    height: 17px;
    /* 이미지 높이 설정 */
  }

  .lnb_wrap div.lnb_item {
    width: calc((100% - 40px) / 2);
  }

  .lnb_wrap .lnb_item .dropdown .dropdown-toggle {
    min-width: auto;
    padding: 0 10px;
    font-size: 14px;
  }

  .lnb_wrap .lnb_item .dropdown .dropdown-toggle::after {
    top: 0;
    right: 15px;
  }

  #footer .foot-head > ul {
    position: relative;
    padding-left: 0px;
  }

  #footer .foot-head > ul > li:last-child {
    float: none;
    width: 100%;
    position: absolute;
    top: 0;
    margin-top: 0px;
    padding: 0;
  }

  #footer .foot-head > ul > li > a {
    font-size: 14px;
    padding: 15px 0 15px 20px;
    opacity: 0.6;
  }

  #footer .foot-head > ul > li:last-child a {
    opacity: 1;
  }

  #footer .foot-head > ul > li {
    position: relative;
    margin-top: 50px;
    padding-left: 0;
  }

  #footer .foot-head .quick_menu.on > .quick_list li a {
    padding: 15px 20px;
  }

  #footer .foot-body .foot-info li {
    font-size: 14px;
    padding-right: 10px !important;
  }

  #footer .foot-body .logo_wrap {
    float: left;
    margin-right: 30px;
  }

  #footer .foot-body .social-icons {
    float: left !important;
    position: absolute !important;
    margin-left: 280px;
    top: 30px;
  }

  #footer .foot-body .social-icons a {
    margin-left: 10px;
  }

  #footer .foot-body .social-icons img {
    width: 30px;
    height: 30px;
  }

  #footer .foot-head {
    position: absolute;
    left: 0;
    width: 100%;
  }

  #footer .foot-body {
    padding-top: 30px;
  }

  #footer .foot-body .logo_wrap {
    float: none;
    width: 100%;
  }

  #footer .foot-body .foot-info {
    float: none;
    width: 100%;
  }

  #footer .foot-body .copyright {
    margin-top: 15px;
    font-size: 14px;
    opacity: 0.8;
  }

  #footer .foot-body .logo_wrap > .f-logo {
    display: inline-block !important;
    width: 254px !important;
  }

  /*홍보자료*/
  .pstit_icon,
  .promo__button img {
    display: none;
  }

  .promo__buttons {
    display: flex;
    gap: 7px;
  }

  .promo__button a {
    background-color: #0068b7;
    color: white;
    text-align: center;
    margin: 10px;
    font-size: 12px;
    border-radius: 8px;
    cursor: pointer;
  }

  .promo__btn {
    background-image: none;
    /* 배경 이미지 제거 */
  }

  /* 비디오, 이미지 전체 폭 */
  .promo__video-wrapper video {
    width: 100%;
    max-width: 100%;
    height: auto;
  }

  /* 영상 트랜스크립트 */
  .transcript {
    max-height: 300px;
    /* 모바일에서 조금 줄임 */
  }

  .info__btn-container {
    display: none;
  }

  /*추진사업*/
  .project-card {
    background: #fff;
    border: 1px solid #e6eaf0;
    border-radius: 10px;
    padding: 5px;
    margin-bottom: 20px;
  }

  .project-title {
    margin: 10px;
    font-size: 1.2rem;
    font-weight: 600;
    color: #005bac;
  }

  .project-desc {
    margin: 0 0 12px;
    line-height: 1.6;
    font-size: 0.95rem;
    color: #444;
  }

  .project-info {
    font-size: 0.9rem;
    color: #555;
    border-top: 1px dashed #ccc;
    padding-top: 8px;
  }

  .pro-gallery {
    display: none;
    /* 모바일에서 사진 숨김 */
  }

  .project-table .col-wide {
    width: 50%;
  }

  .project-table .col-narrow {
    width: 50%;
  }

  /*입주시설안내*/
  .facility-map-section {
    height: 300px; /* 작은 화면에서는 높이 조정 */
  }

  .photo-carousel {
    max-width: 100%;
  }

  .facility-tab {
    flex: 2 0 30%;
    font-size: 14px;
  }

  .facility-table th,
  td {
    font-size: 12px;
    padding: 8px;
  }

  .training-table-container {
    overflow-x: auto; /* 작은 화면에서는 가로 스크롤을 활성화 */
    white-space: nowrap;
    -webkit-overflow-scrolling: touch;
    touch-action: pan-x;
  }

  .training-table th,
  .training-table td {
    padding: 10px 15px;
    font-size: 12px;
  }

  /*인사말*/
  .greeting-header {
    flex-direction: column;
    text-align: center;
    height: auto;
    padding: 10px;
  }

  .greeting-header .greeting-text h1 {
    max-width: 100%;
    font-size: 20px;
    align-items: center;
    margin-bottom: 5px;
    margin-top: 5px;
  }

  .greeting-header .greeting-text p {
    max-width: 100%;
    font-size: 20px;
    align-items: center;
  }

  .greeting-header .director-photo {
    display: none;
  }

  .initial-text {
    padding: 25px;
  }

  .greeting-message .message-content {
    flex-direction: column;
    text-align: center;
  }

  .greeting-message .message-content .photo {
    margin-right: 0;
  }

  .greeting-message .message-content .photo img {
    width: 80%;
    margin: 0 auto;
  }

  .greeting-message .message-content .text p {
    margin-bottom: 20px;
    text-align: left;
  }

  /*설립목적/연혁*/
  .purpose {
    padding-left: 25px;
    padding-right: 25px;
    padding-top: 15px;
    padding-bottom: 15px;
    margin-bottom: 20px;
  }

  .timeline {
    padding: 20px;
  }

  /*연혁*/
  .timeline-items {
    flex-direction: column;
    gap: 15px;
  }

  .timeline-item {
    flex: 1 1 100%;
    max-width: 100%;
    text-align: left !important; /* 좌우 정렬 제거 */
  }

  /*비전*/
  .strategy-card {
    flex-direction: column;
    text-align: center;
  }

  .highlight-text,
  .str-description {
    width: 100%;
  }

  .task-card-horizontal {
    flex-direction: column;
    align-items: flex-start;
    gap: 15px;
    width: 95%;
  }

  .task-card-horizontal .highlight,
  .task-card-horizontal .task-details {
    width: 100%;
  }

  .values-container {
    gap: 15px;
  }

  .value-card {
    width: 100px;
    height: 100px;
    font-size: 14px;
  }

  /*ESG*/
  .vision-sub-tab-btn {
    flex: 1 1 calc(50% - 6px);
    /* 두 개씩 */
  }

  .vision-content-block .block-img img {
    width: 100%;
    height: auto;
    /* 이미지가 컨테이너를 넘지 않도록 */
  }

  /*오시는길*/
  .map_container {
    display: block;
  }

  .map_left {
    width: 100%;
  }

  .bs_map {
    display: none; /* 지도 숨김 */
  }

  .map_right {
    border-left: 1px solid #fff;
    padding-left: 0px;
  }

  .institution_detail h5 {
    font-size: 1.2em;
    font-weight: bold;
    margin-bottom: 10px;
    margin-top: 20px;
  }

  /* 헤더를 두 줄 구성으로 */
  .sub-org-header {
    flex-direction: column; /* 세로 정렬 */
    align-items: flex-start; /* 왼쪽 정렬 */
    gap: 10px;
    margin-bottom: 20px;
  }

  /* 타이틀 크기 조정 */
  .sub-org-title {
    font-size: 18px;
  }

  /* 컨트롤 버튼을 별도 줄에 표시 */
  .sub-org-controls {
    width: 100%;
    display: flex;
    justify-content: flex-end;
    gap: 8px;
  }

  .sub-org-card {
    flex: 0 0 calc(100% - 10px) !important;
  }

  /*영문동영상&브로셔*/
  .vision-block-inner {
    flex-direction: column;
    display: block; /* flex 해제 → 세로 쌓기 */
    align-items: unset;
    gap: 24px;
  }

  .vision-media,
  .vision-text {
    max-width: 100%;
    flex: none;
  }

  .vision-title {
    font-size: 1.5rem;
    text-align: center;
  }

  .vision-desc {
    font-size: 0.95rem;
    text-align: center;
  }

  .vision-tabs {
    flex-wrap: wrap;
    justify-content: center;
  }

  .vision-tab-btn {
    flex: 1 1 auto;
    text-align: center;
  }
  .vision-brochure {
    margin-top: 24px;
    max-width: 100%;
  }
  .brochure-download {
    width: 100%;
    max-width: 280px;
    margin-bottom: 10px;
  }
  .brochure-img img {
    max-width: 100%;
    height: auto;
  }
  /*진흥원에 바란다*/
  .opinion-guide {
    padding: 30px 20px;
  }

  .opinion-wrap {
    padding: 10px;
  }

  .step-flow {
    flex-direction: column;
    gap: 10px;
  }

  .step-arrow {
    display: none;
  }

  .step-item {
    width: 80%;
  }
}

/* 모바일 환경에서 추가 조정 */
@media (max-width: 480px) {
  #subCont .page-name {
    font-size: 18px;
    padding: 20px 25px;
  }

  .pd-cont {
    padding: 0 2%;
  }

  .pd-cont-3 {
    padding: 75px 4%;
    min-width: auto;
  }

  #subCont .m-snb ul.left-menu > li a {
    padding: 10px 12px;
    font-size: 13px;
  }

  #footer .foot-body .social-icons {
    float: left;
    position: absolute;

    margin-left: 170px;
  }

  #footer .foot-body .social-icons a {
    margin-left: 10px;
  }

  #footer .foot-body .social-icons img {
    width: 24px;
    height: 24px;
  }

  /*교육일정*/
  .top-page-header .title {
    font-size: 1.3rem; /* 더욱 작은 화면에서는 타이틀 크기 줄이기 */
  }

  .description-container .description {
    font-size: 0.9rem; /* 설명글 폰트 크기 더 줄이기 */
  }

  /*비전*/
  .section-label {
    font-size: 18px;
  }

  .vision-box .line1 {
    font-size: 18px;
  }

  .vision-box .line2 {
    font-size: 15px;
  }

  .strategy-summary {
    font-size: 18px;
  }

  .highlight-text {
    font-size: 16px;
  }

  .str-description {
    font-size: 14px;
    padding: 15px;
  }

  .task-card-horizontal {
    padding: 15px;
  }

  .task-card-horizontal .highlight {
    font-size: 16px;
  }

  .task-card-horizontal .task-details {
    font-size: 14px;
  }

  .core-values .main {
    width: auto;
    font-size: 16px;
  }

  .value-card {
    width: 85px;
    height: 85px;
    font-size: 13px;
  }

  /*ESG*/
  .vision-sub-tab-btn {
    flex: 1 1 100%;
  }

  .vision-content-block .block-img img {
    width: 100%;
    height: auto;
    /* 이미지가 컨테이너를 넘지 않도록 */
  }

  .promo__section {
    padding: 0;
    margin: 1.5rem 0;
    display: flex;
    flex-direction: column;
    justify-content: center;
    border-radius: 0;
    box-shadow: none;
  }
  .promo__brochure-item {
    padding-left: 0px !important;
    gap: 1rem;
  }
  .promo__button {
    font-size: 12px !important;
  }
  section.timeline {
    padding: 15px;
    border-radius: 0;
    box-shadow: none;
  }
  .vision-tab-btn {
    padding: 6px 10px;
  }
  .vision-content-block {
    margin-top: 0px;
    background-color: #fff;
    padding: 0;
    border-radius: 0;
    border: 0;
  }
  .vision-tab-content {
    padding: 20px;
  }
  .gu-mobile .gu li a {
    font-size: 12px;
  }
}
/*해상도별 미디어쿼리 기반 max-width 설정*/
/* 1600px 이상 - 초고해상도 */

@media (min-width: 1600px) {
  .sub-container {
    max-width: 1350px;
    /* 1600 - 250 */
    margin-left: 0;
  }
}

@media (min-width: 1460px) and (max-width: 1599px) {
  .sub-container {
    max-width: 1100px;
    /* 1460 - 160 = 여백 확보 */
    margin-left: 0;
  }
}

@media (min-width: 1280px) and (max-width: 1359px) {
  .sub-container {
    max-width: 1000px;
  }
}

@media (min-width: 1200px) and (max-width: 1459px) {
  .sub-container {
    max-width: 920px;
    margin-left: 0;
  }
}

@media (min-width: 768px) and (max-width: 1199px) {
  .sub-container {
    max-width: 100%;
    margin: auto;
  }
}

/* 스마트폰 */
@media (max-width: 767px) {
  .sub-container {
    max-width: 100%;
    padding: 0 16px;
    margin: auto;
  }
}

/* 480px 이상 ~ 767px 이하 (일반 스마트폰) */
@media (min-width: 480px) and (max-width: 767px) {
  .sub-container {
    max-width: 470px;
    padding: 0 16px;
    margin: auto;
  }
}

/* 480px 이하 (작은 스마트폰) */
@media (max-width: 479px) {
  .sub-container {
    max-width: 100%;
    padding: 0;
    margin: auto;
  }
}