/* 모바일&테블릿 */
 @media (max-width : 768px) {
  body, html{overflow-x: hidden;}
   section {margin-bottom: 100px;}

   h4 {font-size: var(--mtext-title-xs);}

   h2 {font-size: var(--mtext-title-l);}

   /* ========================= 
    main-visual
  ============================ */
   .main-visual {
     padding-top: 80px;
   }
   .main-visual-inner {
     flex-direction: column;
   }
   /* 비주얼 배경이미지도 사라짐 */
   .mainbg {
     display: none;
   }

   /* 모바일에서 보여지는 공항안내 */
   .mobile-wrap-ariport {
     display: block;
     width: 90%;
     margin: auto;
   }
   .mobile-wrap-ariport h4 {
     font-size: 24px;
     font-weight: 600;
     margin-bottom: 12px;
   }
   .mobile-search-ariport {
     width: 90%;
     height: 57px;
     border: 3px solid #00519A;
     border-radius: 10px;
     background: #fafaf8;
     position: absolute;
     line-height: 57px;
     cursor: pointer;
   }
   .mobile-search-ariport>a {
     font-size: 25px;
     color: #00519A;
     font-weight: 500;
     display: flex;
     padding: 0 20px;
   }

   .mobile-search-ariport #clickPoint::before{
    top: 20%; left: 2%;
   }
   .mobile-search-ariport>a::after {
     content: '\f107';
     font-weight: 600;
     font-family: "Font Awesome 5 Free";
     position: absolute;
     right: 5%;
   }

   .mobile-search-ariport>a.active::after {
     content: '\f106';
     color: #FFC64A;
   }

   .mobile-airport-pot-wrap {
     background: #fafaf8;
     display: none;
     flex-direction: column;
     position: absolute;
     z-index: 150;
     width: 101.2%;
     line-height: 35px;
     top: 46px;
     left: -3px;
     border: 3px solid #00519A;
     border-top: none;
     padding-bottom: 10px;
     border-radius: 0 0 10px 10px;
   }

   .mobile-airport-pot-wrap a {
     padding-left: 20px;
     font-size: 22px;
   }

   .mobile-airport-pot-wrap a:hover {
     color: #0476DD;
     font-weight: 600;
   }

   .mobile-airport-pot-wrap.active {
     display: flex;
   }

   /* -------------------- 왼쪽 공항정보 ------------------------ */
   .airport-panel {
     width: 100%;
     margin: auto;
     padding: 0;
     box-shadow: 0 0 0;
     background: none;
   }

   /* --------------- 상단 공항상황 -------------- */
   .widget-card {
     padding-top: 60px;
     border-radius: 50px 50px 0 0;
   }
   .airport-name {
     width: 215px;
     height: 49px;
     line-height: 49px;
   }
   .airport-name i {
     font-size: 25px;
   }
   .airport-name a {
     font-size: 24px;
   }
   .airport-address {
     font-size: 14px;
   }

   .weather-wrap {
     margin-bottom: 30px;
     margin: 20px 10px;
   }

   .temp {
     font-size: 65px;
   }

   .weather-icon {
     width: 150px;
     height: 150px;
     right: -10%;
     bottom: -30%;
   }

   .quick-service {
     gap: 5px;
   }

   .quick-service li {
     width: 100px;
   }

   .quick-service li button {
     font-size: 14px;
   }

   .quick-service li button img {
     width: 30px;
     padding-bottom: 5px;
   }

   .quick-service .calendarClock button img {
     width: 32px;
   }

   .quick-service .searchIcon button img {
     width: 35px;
   }

   /* ----------- 하단 출도착 검색 ----------- */
   .web-ticket {
     display: none;
   }

   .flight-search {
     width: 90%;
     margin: auto;
     height: 600px;
     margin-top: 20px;
   }

   .mobile-ticket {
     display: flex;
     width: 100%;
   }

   .search-left {
     flex: 1;
     width: 100%;
     height: auto;
     bottom: 0;
   }

   .search-left .airport-area select {
     width: 300px;
     height: 38px;
   }

   .search-right {
     width: 100%;
     height: auto;
     top: 0;
   }

   .search-right .search-text {
     text-align: center;
     padding-bottom: 5px;
   }

   .search-right .search-ariport-flight {
     margin-top: 40px;
     gap: 5px;
     justify-content: space-between;
   }

   .search-right .search-ariport-flight i {
     font-size: 24px;
   }

   .search-right .search-ariport-flight input {
     width: 120px;
   }

   .search-right .date-search {
     width: 100%;
     margin: auto;
     margin-top: 20px;
   }
   .search-right .date-search label input{
    width: 90%;
   }

   .search-right .search-btn {
     border-radius: 50px;
     top: -5%;
     left: 50%;
     transform: translateX(-50%);
   }

   /* 모바일에서는 오른쪽 지도 사라짐 */
   .map-wrap {
     display: none;
   }


   /* ============================ 
  quick links
  ============================ */
   .quick-links {
     background: #fafaf8;
   }

   .quick-links .container {
     width: 90%;
     margin: auto;
   }

   .quick-links h4 {
     display: block;
     font-size: 24px;
     font-weight: 600;
     margin-bottom: 12px;
   }

   .quick-linkBtn {
     flex-wrap: wrap;
     gap: 0;
   }

   .quick-linkBtn .reserveAll {
     display: none;
   }

   .quick-linkBtn a {
     width: 98px;
     height: 80px;
     gap: 8px;
     flex: 0 0 25%;
     margin-bottom: 10px;
   }

   .quick-linkBtn svg {
     height: 28px;
     width: 28px;
   }

   .quick-linkBtn a:hover svg {
     height: 30px;
     width: 30px;
   }

   .quick-linkBtn a:hover {
     transform: translateY(-2px);
   }


   /* ============================ 
    NEWSROOM & POPUP
  ============================ */
   .main-bg {
     background: linear-gradient(180deg, #035AA9, #2B79C1, #FAFAF8);
     border-radius: 30px 0 0 0;
     top: -3%;
     height: 320px;
   }

   .news-area .container {
     width: 90%;
     margin: auto;
   }

   .news-area h4 {
     color: #fafaf8;
     position: absolute;
     top: 0;
     font-size: var(--mtext-title-xs);

   }

   #news-heading {
     font-size: var(--mtext-title-l);
     color: var(--color-white);
   }

   .news-category {
     flex-direction: column;
   }

   /* ----- 위쪽 뉴스룸 영역 ---- */
   .newsroom {
     width: 100%;
   }

   .plus-btn {
     border-color: var(--color-white);
     width: 18px;
     height: 18px;
   }

   .plus-btn-inner span {
     background: var(--color-white);
     width: 8px;
   }

   .plus-btn:hover .plus-btn-inner span {
     background: var(--color-point);
   }

   .newsBtn {
     top: 36%;
     right: 70%;
   }

   .newsroom-header {
     flex-direction: column;
     align-items: start;
   }

   .newsroom-header::after {
     display: none;
   }

   .newsroom-tabs {
     flex-direction: column;

   }

   .newsroom-tab {
     color: var(--color-white);
     background: none;
     border: none;
     text-align: center;
     border-radius: 0;
     font-size: var(--mtext-title-m);
     width: auto;
     height: auto;
     position: relative;
     padding-bottom: 5px;
   }

   .newsroom-tab.active {
     border: none;
     color: var(--color-white);

   }

   .newsroom-tab::before {
     content: '';
     position: absolute;
     width: 0;
     height: 3px;
     background: var(--color-point);
     bottom: 0;
     border-radius: 5px;
   }

   .newsroom-tab.active::before {
     width: 130%;
   }

   .newsroom-tab::after {
     content: '';
     width: 24px;
     height: 18px;
     background-repeat: no-repeat;
     background-size: contain;
     bottom: -1px;
     right: -40%;
     position: absolute;
   }

   .newsroom-tab.active::after {
     background-image: url(../images/mobile/media_news_plane.svg);
   }

   .newsroom-wrap {
     position: absolute;
     top: 38%;
     right: 0.5%;
   }

   .newsroom-content {
     flex-direction: row;
   }

   .newsroom-content li:nth-child(3) {
     display: none;
   }

   .news-list a {
     width: 150px;
     height: 160px;
     display: flex;
     flex-direction: column;
     background: var(--color-white);
     padding: 10px;
     gap: 0;
     align-items: start;
     position: relative;
   }

   .newsroom-icon {
     position: absolute;
     top: 5px;
     right: 5px;
     display: block;
     font-size: 11px;
     color: var(--color-text-gray);
     font-weight: 400;
   }

   .news-list a .star {
     position: absolute;
     right: 8%;
     top: 15%;
     display: block;
   }

   .news-list a:hover .star {
     opacity: 1;
   }

   .news-date {
     width: 55px;
     height: 55px;
     position: absolute;
     top: 10%;
   }

   .news-date .date {
     font-size: var(--mtext-s);
   }

   .news-date .year-month {
     font-size: 10px;
   }

   .news-item {
     position: absolute;
     top: 55%;
   }

   .news-item .news-item-title {
     color: var(--color-text-gray);
     font-size: var(--mtext-xs);
     font-weight: 400;
   }

   .news-item .news-content {
     color: var(--color-text-darkgray);
     font-size: var(--mtext-s);
     width: 130px;
     display: -webkit-box;
     -webkit-line-clamp: 2;
     -webkit-box-orient: vertical;
     overflow: hidden;
     white-space: normal;
   }

   /* 뉴스리스트 호버 */
   .news-list a:hover {
     background: var(--color-primary-dark);
   }

   .news-list a:hover .news-date {
     color: #fafaf8;
     background: var(--color-primary-dark);
     ;
     border-color: var(--color-white);
   }

   .news-list a:hover .news-item-title,
   .news-list a:hover .newsroom-icon {
     color: var(--color-text-lightgray);
   }

   .news-list a:hover .news-content {
     color: var(--color-white);
   }

   /* ----- 아래 팝업 영역 ---- */
   .popup {
     width: 100%;
     margin-top: 30px;
   }

   .popup-header h2 {
     display: none;
   }

   .popupBtn {
     display: none;
   }

   .popup .swiper {
     width: 100%;
   }

   .popup .swiper-slide img {
     border-radius: 15px;
   }

   .mobile-popupBtn {
     display: flex;
     background: var(--color-primary-light);
     position: absolute;
     width: 150px;
     height: 32px;
     border-radius: 30px;
     align-items: center;
     bottom: 0%;
     right: 5%;
     z-index: 5;
     gap: 12px;
     padding: 0 10px;
   }

   .mobile-popupBtn button {
     background: transparent;
   }

   .mobile-stopBtn {
     color: var(--color-primary-dark);
     font-size: 20px;
   }

   .mobile-pagination {
     display: flex;
     gap: 3px;
   }
   .swiper-pagination-fraction {align-items: center; margin-left: 10px;}
   .swiper-pagination-fraction span {
     color: var(--color-white);
   }

   /* popupbtn hover */
   .mobile-stopBtn:hover {
     color: var(--color-point);
   }

   /* ============================ 
    ESG section
  ============================ */
   .esg-bg {
     display: none;
   }
   .esg-area{margin-bottom: 60px;}
   .esg-area .container {
     width: 90%;
     margin: auto;
   }

   .esg-wrap {
     flex-direction: column;
     position: relative;
     gap: 0;
   }

   .esg-left {
     display: flex;
     justify-content: start;
   }

   .esg-left h2 {
     font-size: var(--mtext-title-l);
   }

   .esg-left p {
     display: none;
   }

   .esgbutton-next,
   .esgbutton-prev {
     position: absolute;
     bottom: 50%;
   }

   .esgbutton-next {
     right: 0;
   }

   .esg-right {
     justify-content: center;
   }

   .esg-content .swiper {
     width: 340px;
     height: 370px;
   }

   /* ========================= 
   인재채용
  ============================ */
   .jobs {
     background: #1366bc;
     height: 587px;
     padding-top: 20px;
     margin-bottom: 500px;
   }

   .container {
     width: 100%
   }

   .jobs-maintitle {
     width: 90%;
     margin: auto;
   }

   .jobs-maintitle h4 {
     color: #fafaf8;
   }

   .jobs-maintitle a {
     color: #fafaf8;
   }

   .jobs-main-card {
     display: none;
   }

   .jobSwiper {
     height: 300px;
     padding: 16px;
   }

  

   .jobs-button-next:hover svg path {
     fill: #FFC64A
   }

   .jobs-button-prev:hover svg path {
     fill: #FFC64A
   }

   .jobs-btn {
     display: flex;
     justify-content: space-between;
     padding: 50px 80px;
     cursor: pointer;
   }
   .swiper-pagination{display: block;}
   .swiper-pagination-horizontal,
   &.swiper-pagination-vertical.swiper-pagination-progressbar-opposite,
   .swiper-horizontal>&,
   .swiper-vertical>&.swiper-pagination-progressbar-opposite {
     height: var(--swiper-pagination-progressbar-size, 4px);
     left: 50% !important;
     transform: translateX(-50%) !important;
     top: 85% !important;
     width: 200px !important;
     
   }

   .swiper-pagination-progressbar {
     background: var(--swiper-pagination-progressbar-bg-color, #00000040);
     position: absolute;
     border-radius: 5px;
     overflow: hidden;
   }

   .swiper-pagination-progressbar-fill {
     background: #ffc64a !important;
     height: 100%;
     left: 0;
     position: absolute;
     top: 0;
     transform: scale(0);
     transform-origin: left top;
     width: 100%;
   }
    /* 인재채용 하단영역 */
    .jobs-bottom{
      flex-direction: column;
      width: 90%; margin: auto;
      gap: 20px;
      
    }
    /* 인재채용 공지사항 */
    .jobs-news-wrap {
      flex: 1;
    }
    .jobs-news-title{margin-bottom: 12px;}
    .jobs-news-title h4{
      font-size: 20px;
      margin-bottom: 0;
    }
    .jobs-news-title::after {display: none;}
    
    .jobs-news li a {
      padding: 10px 20px; height: 56px;
    }
   
    .jobs-news-category {
      width: 70px; height: 28px;
      font-size: 18px;
      line-height: 28px;
      font-weight: 500;
    }
    .jobs-news li a > p:nth-child(2) {
     width: 250px; 
     text-overflow: ellipsis;
     white-space: nowrap;
     overflow: hidden;
    }
    .job{
      font-size: 20px;
      font-weight: 600;
      gap: 10px;
    }
    .job::after{display: none;}
    .job:hover {
      background: #1366bc;
      color: #fafaf8;
    }
    .job:hover svg path{fill: #fafaf8;}
    .intro-img{display: none;}
    .jobs-text{
      display:block;
      width: 100%; height: 80px;
      display: flex;
      justify-content: space-between;
      align-items: center;
      padding: 0 20px;
    }
    .jobs-benefit img{display: none;}
    .jobs-button{display: none;}
    
    


  /* ======================== 
    통합예약
  ======================= */
  .reservation {
    height: 85vh;}
   .reservation-content {
     width: 90%;
     margin: auto;
     top: 80px;
   }

  .reservation-img {
     background: url(../images/mobile/media_scrollbg.png)no-repeat;
     background-size: contain;
  }

  .content-text {
     font-size: 36px;
     font-weight: 700;
  }

  .read-more-btn {
     width: 200px;
     height: 40px;
  }

  .white-text {
     font-size: 20px;
  }
  
  /* ========================= 
       ad
  ============================ */
  .ad{
    width: 90%; margin: 0 auto 30px;
  }
  .ad a img{ height: 100px;}
  

 }

 /* 스마트폰 (가로/세로): */
 @media only screen and (min-device-width : 320px) and (max-device-width : 480px) {


   section {
     margin-bottom: 100px;
   }

   h4 {
     font-size: var(--mtext-title-xs);
   }

   h2 {
     font-size: var(--mtext-title-l);
   }

   
   /* ========================= 
    main-visual
  ============================ */
   .main-visual {
     padding-top: 80px;
   }

   .main-visual-inner {
     flex-direction: column;
   }

   /* 비주얼 배경이미지도 사라짐 */
   .mainbg {
     display: none;
   }

   /* 모바일에서 보여지는 공항안내 */
   .mobile-wrap-ariport {
     display: block;
     width: 90%;
     margin: auto;
   }

   .mobile-wrap-ariport h4 {
     font-size: 24px;
     font-weight: 600;
     margin-bottom: 12px;
   }

   .mobile-search-ariport {
     width: 90%;
     height: 57px;
     border: 3px solid #00519A;
     border-radius: 10px;
     background: #fafaf8;
     position: absolute;
     line-height: 57px;
     cursor: pointer;
   }

   .mobile-search-ariport>a {
     font-size: 25px;
     padding-left: 20px;
     color: #00519A;
     font-weight: 500;
   }

   .mobile-search-ariport>a::after {
     content: '\f107';
     font-weight: 600;
     font-family: "Font Awesome 5 Free";
     position: absolute;
     right: 5%;
   }

   .mobile-search-ariport>a.active::after {
     content: '\f106';
     color: #FFC64A;
   }

   .mobile-airport-pot-wrap {
     background: #fafaf8;
     display: none;
     flex-direction: column;
     position: absolute;
     z-index: 150;
     width: 101.2%;
     line-height: 35px;
     top: 46px;
     left: -3px;
     border: 3px solid #00519A;
     border-top: none;
     padding-bottom: 10px;
     border-radius: 0 0 10px 10px;
   }

   .mobile-airport-pot-wrap a {
     padding-left: 20px;
     font-size: 22px;
   }

   .mobile-airport-pot-wrap a:hover {
     color: #0476DD;
     font-weight: 600;
   }

   .mobile-airport-pot-wrap.active {
     display: flex;
   }

   /* -------------------- 왼쪽 공항정보 ------------------------ */
   .airport-panel {
     width: 100%;
     margin: auto;
     padding: 0;
     box-shadow: 0 0 0;
     background: none;
   }

   /* --------------- 상단 공항상황 -------------- */
   .widget-card {
     padding-top: 60px;
     border-radius: 50px 50px 0 0;
   }

   .airport-name {
     width: 215px;
     height: 49px;
     line-height: 49px;
   }

   .airport-name i {
     font-size: 25px;
   }

   .airport-name a {
     font-size: 24px;
   }

   .airport-address {
     font-size: 14px;
   }

   .weather-wrap {
     margin-bottom: 30px;
     margin: 20px 10px;
   }

   .temp {
     font-size: 65px;
   }

   .weather-icon {
     width: 150px;
     height: 150px;
     right: -10%;
     bottom: -30%;
   }

   .quick-service {
     gap: 5px;
   }

   .quick-service li {
     width: 100px;
   }

   .quick-service li button {
     font-size: 14px;
   }

   .quick-service li button img {
     width: 30px;
     padding-bottom: 5px;
   }

   .quick-service .calendarClock button img {
     width: 32px;
   }

   .quick-service .searchIcon button img {
     width: 35px;
   }

   /* ----------- 하단 출도착 검색 ----------- */
   .web-ticket {
     display: none;
   }

   .flight-search {
     width: 90%;
     margin: auto;
     height: 600px;
     margin-top: 20px;
   }

   .mobile-ticket {
     display: flex;
     width: 100%;
   }

   .search-left {
     flex: 1;
     width: 100%;
     height: auto;
     bottom: 0;
   }

   .search-left .airport-area select {
     width: 300px;
     height: 38px;
   }

   .search-right {
     width: 100%;
     height: auto;
     top: 0;
   }

   .search-right .search-text {
     text-align: center;
     padding-bottom: 5px;
   }

   .search-right .search-ariport-flight {
     margin-top: 40px;
     gap: 5px;
     justify-content: space-between;
   }

   .search-right .search-ariport-flight i {
     font-size: 24px;
   }

   .search-right .search-ariport-flight input {
     width: 120px;
   }

   .search-right .date-search {
     width: 100%;
     margin: auto;
     margin-top: 20px;
   }
   .search-right .date-search label input{
    width: 80%;
   }
   .search-right .search-btn {
     border-radius: 50px;
     top: -5%;
     left: 50%;
     transform: translateX(-50%);
   }

   /* 모바일에서는 오른쪽 지도 사라짐 */
   .map-wrap {
     display: none;
   }


   /* ============================ 
  quick links
  ============================ */
   .quick-links {
     background: #fafaf8;
   }

   .quick-links .container {
     width: 90%;
     margin: auto;
   }

   .quick-links h4 {
     display: block;
     font-size: 24px;
     font-weight: 600;
     margin-bottom: 12px;
   }

   .quick-linkBtn {
     flex-wrap: wrap;
     gap: 0;
   }

   .quick-linkBtn .reserveAll {
     display: none;
   }

   .quick-linkBtn a {
     width: 98px;
     height: 80px;
     gap: 8px;
     flex: 0 0 25%;
     margin-bottom: 10px;
   }

   .quick-linkBtn svg {
     height: 28px;
     width: 28px;
   }

   .quick-linkBtn a:hover svg {
     height: 30px;
     width: 30px;
   }

   .quick-linkBtn a:hover {
     transform: translateY(-2px);
   }


   /* ============================ 
    NEWSROOM & POPUP
  ============================ */
   .main-bg {
     background: linear-gradient(180deg, #035AA9, #2B79C1, #FAFAF8);
     border-radius: 30px 0 0 0;
     top: -3%;
     height: 320px;
   }

   .news-area .container {
     width: 90%;
     margin: auto;
   }

   .news-area h4 {
     color: #fafaf8;
     position: absolute;
     top: 0;
     font-size: var(--mtext-title-xs);
     padding-top: 10px;
   }

   #news-heading {
     font-size: var(--mtext-title-l);
     color: var(--color-white);
   }

   .news-category {
     flex-direction: column;
   }

   /* ----- 위쪽 뉴스룸 영역 ---- */
   .newsroom {
     width: 100%;
   }

   .plus-btn {
     border-color: var(--color-white);
     width: 18px;
     height: 18px;
   }

   .plus-btn-inner span {
     background: var(--color-white);
     width: 8px;
   }

   .plus-btn:hover .plus-btn-inner span {
     background: var(--color-point);
   }

   .newsBtn {
     top: 36%;
     right: 60%;
   }

   .newsroom-header {
     flex-direction: column;
     align-items: start;
   }

   .newsroom-header::after {
     display: none;
   }

   .newsroom-tabs {
     flex-direction: column;

   }

   .newsroom-tab {
     color: var(--color-white);
     background: none;
     border: none;
     text-align: center;
     border-radius: 0;
     font-size: var(--mtext-title-m);
     width: auto;
     height: auto;
     position: relative;
     padding-bottom: 5px;
   }

   .newsroom-tab.active {
     border: none;
     color: var(--color-white);

   }

   .newsroom-tab::before {
     content: '';
     position: absolute;
     width: 0;
     height: 3px;
     background: var(--color-point);
     bottom: 0;
     border-radius: 5px;
   }

   .newsroom-tab.active::before {
     width: 130%;
   }

   .newsroom-tab::after {
     content: '';
     width: 24px;
     height: 18px;
     background-repeat: no-repeat;
     background-size: contain;
     bottom: -1px;
     right: -40%;
     position: absolute;
   }

   .newsroom-tab.active::after {
     background-image: url(../images/mobile/media_news_plane.svg);
   }

   .newsroom-wrap {
     position: absolute;
     top: 38%;
     right: 1%;
   }

   .newsroom-content {
     flex-direction: row;
   }

   .newsroom-content li:nth-child(2),
   .newsroom-content li:nth-child(3) {
     display: none;
   }

   .news-list a {
     width: 180px;
     height: 160px;
     display: flex;
     flex-direction: column;
     background: var(--color-white);
     padding: 10px;
     gap: 0;
     align-items: start;
     position: relative;
   }

   .newsroom-icon {
     position: absolute;
     top: 5px;
     right: 5px;
     display: block;
     font-size: 11px;
     color: var(--color-text-gray);
     font-weight: 400;
   }

   .news-list a .star {
     position: absolute;
     right: 8%;
     top: 15%;
     display: block;
   }

   .news-list a:hover .star {
     opacity: 1;
   }

   .news-date {
     width: 55px;
     height: 55px;
     position: absolute;
     top: 10%;
   }

   .news-date .date {
     font-size: var(--mtext-s);
   }

   .news-date .year-month {
     font-size: 10px;
   }

   .news-item {
     position: absolute;
     top: 55%;
   }

   .news-item .news-item-title {
     color: var(--color-text-gray);
     font-size: var(--mtext-xs);
     font-weight: 400;
   }

   .news-item .news-content {
     color: var(--color-text-darkgray);
     font-size: var(--mtext-s);
     width: 130px;
     display: -webkit-box;
     -webkit-line-clamp: 2;
     -webkit-box-orient: vertical;
     overflow: hidden;
     white-space: normal;
   }

   /* 뉴스리스트 호버 */
   .news-list a:hover {
     background: var(--color-primary-dark);
   }

   .news-list a:hover .news-date {
     color: #fafaf8;
     background: var(--color-primary-dark);
     ;
     border-color: var(--color-white);
   }

   .news-list a:hover .news-item-title,
   .news-list a:hover .newsroom-icon {
     color: var(--color-text-lightgray);
   }

   .news-list a:hover .news-content {
     color: var(--color-white);
   }

   /* ----- 아래 팝업 영역 ---- */
   .popup {
     width: 100%;
     margin-top: 20px;
   }

   .popup-header h2 {
     display: none;
   }

   .popupBtn {
     display: none;
   }

   .popup .swiper {
     width: 100%;
   }

   .popup .swiper-slide img {
     border-radius: 15px;
   }

   .mobile-popupBtn {
     display: flex;
     background: var(--color-primary-light);
     position: absolute;
     width: 150px;
     height: 32px;
     border-radius: 30px;
     align-items: center;
     bottom: 2%;
     right: 5%;
     z-index: 5;
     gap: 12px;
     padding: 0 10px;
   }

   .mobile-popupBtn button {
     background: transparent;
   }

   .mobile-stopBtn {
     color: var(--color-primary-dark);
     font-size: 20px;
   }

   .mobile-pagination {
     display: flex;
     gap: 3px;
   }

   .swiper-pagination-fraction span {
     color: var(--color-white);
   }

   /* popupbtn hover */
   .mobile-stopBtn:hover {
     color: var(--color-point);
   }

   /* ============================ 
    ESG section
  ============================ */
   .esg-bg {
     display: none;
   }
   .esg-area{margin-bottom: 50px;}
   .esg-area .container {
     width: 90%;
     margin: auto;
   }

   .esg-wrap {
     flex-direction: column;
     position: relative;
     gap: 0;
   }

   .esg-left {
     display: flex;
     justify-content: start;
   }

   .esg-left p {
     display: none;
   }

   .esgbutton-next,
   .esgbutton-prev {
     position: absolute;
     bottom: 50%;
   }

   .esg-right {
     justify-content: center;
   }

   .esg-content .swiper {
     width: 290px;
     height: 370px;
   }

   .esg-text h6 {
     font-size: var(--mtext-title-m);
   }

   .esg-text p {
     font-size: var(--mtext-m);
   }
  .esg-content .swiper {padding: 15px;}
   /* ========================= 
   인재채용
  ============================ */
   .jobs {
     background: #1366bc;
     height: 587px;
     padding-top: 20px;
   }

   .container {
     width: 100%
   }

   .jobs-maintitle {
     width: 90%;
     margin: auto;
   }

   .jobs-maintitle h4 {
     color: #fafaf8;
   }

   .jobs-maintitle a {
     color: #fafaf8;
   }

   .jobs-main-card {
     display: none;
   }

   .jobSwiper {
     height: 300px;
     padding: 16px;
   }


   .jobs-button-next:hover svg path {
     fill: #FFC64A
   }

   .jobs-button-prev:hover svg path {
     fill: #FFC64A
   }

   .jobs-btn {
     display: flex;
     justify-content: space-between;
     padding: 50px;
     cursor: pointer;
   }

   .swiper-pagination-horizontal,
   &.swiper-pagination-vertical.swiper-pagination-progressbar-opposite,
   .swiper-horizontal>&,
   .swiper-vertical>&.swiper-pagination-progressbar-opposite {
     height: var(--swiper-pagination-progressbar-size, 4px);
     left: 50% !important;
     transform: translateX(-50%) !important;
     top: 85% !important;
     width: 200px !important;
   }

   .swiper-pagination-progressbar {
     background: var(--swiper-pagination-progressbar-bg-color, #00000040);
     position: absolute;
     border-radius: 5px;
     overflow: hidden;
   }

   .swiper-pagination-progressbar-fill {
     background: #ffc64a !important;
     height: 100%;
     left: 0;
     position: absolute;
     top: 0;
     transform: scale(0);
     transform-origin: left top;
     width: 100%;
   }

      /* 인재채용 하단영역 */
    .jobs-bottom{
      flex-direction: column;
      width: 90%; margin: auto;
      gap: 20px;
      
    }
    /* 인재채용 공지사항 */
    .jobs-news-wrap {
      flex: 1;
    }
    .jobs-news-title{margin-bottom: 12px;}
    .jobs-news-title h4{
      font-size: 20px;
      margin-bottom: 0;
    }
    .jobs-news-title::after {display: none;}
    
    .jobs-news li a {
      padding: 10px 20px; height: 56px;
    }
   
    .jobs-news-category {
      width: 70px; height: 28px;
      font-size: 18px;
      line-height: 28px;
      font-weight: 500;
    }
    .jobs-news li a > p:nth-child(2) {
     width: 170px; 
     text-overflow: ellipsis;
     white-space: nowrap;
     overflow: hidden;
    }
    .job{
      font-size: 20px;
      font-weight: 600;
      gap: 10px;
    }
    .job::after{display: none;}
    .job:hover {
      background: #1366bc;
      color: #fafaf8;
    }
    .job:hover svg path{fill: #fafaf8;}
    .intro-img{display: none;}
    .jobs-text{
      display:block;
      width: 100%; height: 80px;
      display: flex;
      justify-content: space-between;
      align-items: center;
      padding: 0 20px;
    }
    .jobs-benefit img{display: none;}
    .jobs-button{display: none;}
    
    


  /* ======================== 
    통합예약
  ======================= */
  .reservation {
    height: 85vh;}
   .reservation-content {
     width: 90%;
     margin: auto;
     top: 80px;
   }

  .reservation-img {
     background: url(../images/mobile/media_scrollbg.png)no-repeat;
     background-size: contain;
  }

  .content-text {
     font-size: 36px;
     font-weight: 700;
  }

  .read-more-btn {
     width: 200px;
     height: 40px;
  }

  .white-text {
     font-size: 20px;
  }
  
  /* ========================= 
       ad
  ============================ */
  .ad{
    width: 90%; margin: 0 auto 30px;
  }
  .ad-wrap{width: 100%;}
  .ad a img{ height: 80px;}











 }


    /* iPad mini / iPad / Galaxy Tab */
 @media (min-width: 768px) and (max-width: 1023px) {
  .main-visual-inner{width: 90%; margin: auto;}
   /* 비주얼 배경이미지도 사라짐 */
   .mainbg {
     display: none;
   }
   /* 모바일에서는 오른쪽 지도 사라짐 */
   .map-wrap {
     display: none;
   }
  .airport-panel{
    margin-top: 100px;
  }
  /* 모바일에서 보여지는 공항안내 */
   .mobile-wrap-ariport {
    position: absolute;
     display: block;
     width: 100%;
   }
   .mobile-wrap-ariport h4 {
     font-size: 24px;
     font-weight: 600;
     margin-bottom: 12px;
   }
   .mobile-search-ariport {
     width: 100%;
     height: 57px;
     border: 3px solid #00519A;
     border-radius: 10px;
     background: #fafaf8;
     position: absolute;
     line-height: 57px;
     cursor: pointer;
   }
   .mobile-search-ariport>a {
     font-size: 25px;
     color: #00519A;
     font-weight: 500;
     display: flex;
     padding: 0 20px;
   }

   .mobile-search-ariport>a::after {
     content: '\f107';
     font-weight: 600;
     font-family: "Font Awesome 5 Free";
     position: absolute;
     right: 5%;
   }

   .mobile-search-ariport>a.active::after {
     content: '\f106';
     color: #FFC64A;
   }

   .mobile-airport-pot-wrap {
     background: #fafaf8;
     display: none;
     flex-direction: column;
     position: absolute;
     z-index: 150;
     width: 100.7%;
     line-height: 35px;
     top: 46px;
     left: -3px;
     border: 3px solid #00519A;
     border-top: none;
     padding-bottom: 10px;
     border-radius: 0 0 10px 10px;
   }

   .mobile-airport-pot-wrap a {
     padding-left: 20px;
     font-size: 22px;
   }

   .mobile-airport-pot-wrap a:hover {
     color: #0476DD;
     font-weight: 600;
   }

   .mobile-airport-pot-wrap.active {
     display: flex;
   }
   .quick-links h4 {display: block; padding-top: 50px;}
   .quick-links h4 a{color: var(--color-white);}
   .quick-linkBtn{flex-wrap: nowrap; gap: 5px;}
   .quick-linkBtn .reserveAll{display: none;}
   .main-bg{display: none;}
   .esg-bg {display: none;}
   .esg-wrap{
    flex-direction: column;
    padding-bottom: 500px;
  }
  .esg-content{width: 100%;}
  .esg-content .swiper{width: 100%;}
  .jobs-content .card-main-text{font-size: var(--mtext-l);}
  .jobs-content .jobs-date{font-size: var(--mtext-s); line-height: 1;}
  .reservation-content{width: 90%; margin: auto;}
 }