@charset "utf-8";
body{
margin:0;
padding:0;
border:0;
line-height:2rem;
color:#000000;
font-size: 1.4rem;
font-family:Roboto!important, SamsungOne, "Noto Sans KR", nanum, "나눔고딕", "맑은고딕", "Malgun Gothic", "돋움", Dotum, Shruti, Arial;
background:#ffffff;
font-weight:400;
 -ms-word-break: keep-all;
    word-break: keep-all;
    -webkit-text-size-adjust: none;
    -moz-text-size-adjust: none;
    -ms-text-size-adjust: none;
/* letter-spacing:-0.75px; */
}
h1, h2, h3, h4, h5, h6 {
    font-weight: 500;
    font-family: none;
}
.sec_one .visual_wrap .visual .bg_area::after {opacity: 0.1;}
main,footer { margin-left: 0px; width: calc(100% - 0px);}
.tbtMainVisual { margin-left: 107px; border:0px solid red;}
/* .mainSection { margin-left: 224px; width: calc(100% - 224px); min-height: 300px; border:1px dashed red; background-color:transparent; display: block;
  border: 3px solid skyblue;
  height: 600vh;
  background-color: #ddd;
  background:
    url('../static/img/new_know/main_top_bg.png') no-repeat left top / 100%,
    url('../static/img/new_know/main_bottom_bg.png') no-repeat left bottom / 100%;} */
    
    
.mainSection { margin-left: 0px; width: 100%; height: 100vh; background-size:cover; box-sizing: border-box;}
.mainSection .mainSection_div { position: relative; display: flow; padding-left: 224px; width: 100%; height: auto; border-right:0px solid red; box-sizing: border-box;}
.mainSection .mainSection_div .mainSectionCon { position: relative; display: flex; flex-direction: column; justify-content: center; margin: 0 auto 0 auto; padding: 24px 24px 24px 0px; max-width: 1250px!important; box-sizing: border-box!important;  }
/* .mainSectionCon
 {
    max-width: 1250px;
    margin: 0 auto;
    padding: 48px 24px 48px 0px;
    box-sizing: border-box;
} */
/* .mainSection.sec_one > .fp-tableCell > .mainSection_div { position: absolute;  z-index: 99} */
.mainSection.sec_one { height: 100vh!important;}
/* .mainSection.sec_one { background: url(../img/new_know/main_bottom_bg01.png) no-repeat center bottom / 100%, url(../img/new_know/main_top_bg.png) no-repeat center top / cover;} */


/* tit*/
.mainSection { border:0px solid green;}
.mainSection_div { border:0px solid orange}
.mainSectionCon { border:0px solid yellow}
/* .mainSectionCon > .tit { margin: 0rem 0rem 4rem 0rem;} */
.mainSectionCon > .tit { display: flex; justify-content: center; align-items: center; letter-spacing: -1px; margin: 6rem 0rem 4rem 0rem;; width: 100%; }
.mainSectionCon > .tit > em { margin: 0 4px; font-size: 3.25rem;  font-weight: 500; color: #111; }
.mainSectionCon > .tit > strong { margin: 0 4px; font-size: 3.625rem;  /* 42px */ font-weight: 500; color: #030a65;}


/*scroll down*/
.scroll_wrap { z-index: 99;}
.scroll_wrap { border: 0px solid red; display: flex; justify-content: center; height: 60px;}
.scroll_wrap > .scroll_down { position: absolute; /* left: 50%;  */display: flex; flex-direction: column; align-items: center; bottom: 4px; /* transform: translateX(-50%); */ font-size: 14px; color:rgba(255,255,255,.9); }
.scroll_wrap > .scroll_down .txt { display: flex; flex-direction: column; margin-bottom: 5px; font-size:16px; }
.scroll_wrap > .scroll_down .scroll-mouse { flex: 1; font-size:22px; margin-bottom: 15px;}
.scroll_wrap > .scroll_down .scroll-down { flex: 1; font-size: 22px; animation: blink 2s ease-in-out infinite alternate;}
.scroll_wrap > .scroll_down:hover { color:#334b98;}

/*sch*/
.tbtMainVisualSearch { display: flex; justify-content: center; align-items: center;}
.tbtMainVisualSearch .tbt_keywordSearchInput {border: 3px solid #809abf;}
.tbtMainVisualSearch .tbt_keywordSearchInput input { height: 40px; text-align: center; }
.tbtMainVisualSearch .tbt_keywordSearchBtn { position: absolute; right: 20px; top: 16px; transform: translateY(-50%); padding-right: 0px; width: 46px; height: 46px; background: #334b98 !important; border-radius: 50%; text-align: center; z-index: 99;}
/* .tbt_keywordSearch { margin-left: 21px} *//* 수평 center 을 위한 임시 방면 */
/* world_row */				
.world_row { margin: 0px auto; width: 100%;}
.world_row > .world_wrap { overflow: hidden; }
.world_row > .world_wrap > .world{ position: relative; display: flex; align-items: center; padding: 10px; box-sizing: border-box; height: auto;}
.world_row > .world_wrap > .world::before { content: ''; position: absolute; top: 0; left: 0; right: 0; bottom: 0; background-color:rgba(0,0,0,0);  z-index: -1; } 
.world_row > .world_wrap > .world > .world_map { position: relative; width: 100%;
  max-width: 2076px;
  aspect-ratio: 2076 / 1230;
  background: url(../img/new_know/main_world.png) no-repeat center / 100% 100%;
  /* 크기 비례 단위를 쓰려면(순수 CSS) 컨테이너 쿼리 선언 */
  container-type: inline-size; /* cqw, cqh 사용 가능 (지원 브라우저에서) */

  /* JS 방식 스케일용 기본값 (아래 3번) */
  --map-scale: 1;}
.world_row > .world_wrap > .world > .world_map::before{
  content:'';
  position:absolute;
  /* ⬇︎ 원본(2076×1230) 기준으로 환산한 백분율 */
  left: 3.65%;
  top: 12.9%;
  width: 86.5%;
  height: 79.2%;
  background: url(../img/new_know/main_world_blink09.png) no-repeat center / 100% 100%;
  z-index:1;
  animation: blink 1s linear infinite;
}
.world_map::before{ outline:0px dashed red; pointer-events:none; }
.world_row > .world_wrap > .world > .world_map > .items{ position: static; z-index: 9 }
/* 공통 배지 스타일 */
.world_map .item{
  position:absolute;
  display:inline-flex;
  align-items:center;
  gap: 0.8cqw;                                  /* 컨테이너폭 기준(순수 CSS 방식) */
  padding: 0.8cqh 1.3cqw;                       /* 컨테이너 높이/폭 비례 */
  font-size: clamp(10px, 1.1cqw, 16px);         /* 너무 작/크지 않게 가드 */
  font-size: 1.2rem;
  border: 0.25cqw solid #97bad6;
  border-radius: 1.5cqw;
  background:#fff;
  box-shadow: 0 0.3cqh 0.6cqw rgba(0,0,0,.15);
  z-index:9;

  /* 좌표를 '배지 중앙아래'가 기준이 되도록 */
  transform: translate(-50%, -100%);
}
.world_row > .world_wrap > .world > .world_map > .items > .item:hover { background-color:#eff7fd; border:1px dashed #334b98; box-shadow: 1px 3px 4px 0px #7694b7;}
.world_row > .world_wrap > .world > .world_map > .items > .item button { cursor: pointer;}
.world_row > .world_wrap > .world > .world_map > .items > .item button:hover { border:1px solid blue; }
.world_row > .world_wrap > .world > .world_map > .items > .item > .map_mark { display:flex; flex-direction:column; font-size: 1em;}
.world_row > .world_wrap > .world > .world_map > .items > .item > .map_mark > strong { color:#01499f; }
.world_row > .world_wrap > .world > .world_map > .items > .item > .map_mark > span::before { content: "/"; margin: 0 5px; color:#ddd; }
.world_row > .world_wrap > .world > .world_map > .items > .item > .map_mark > span > strong { color:#01499f; font-weight: 600;}
.world_row > .world_wrap > .world > .world_map > .items > .item > .map_mark > span > em { color:#181a23; }

/* 이미 %로 바꾸신 애들은 유지 */
.world_map .item.item00 { top: 24%; left: 55.68%;} /* 국제공통 */
.world_map .item.item01 { top: 24%; left: 16%; } /* 유렵 */
.world_map .item.item02 { top: 28%; left: 31.19%; } /* 아시아 */
.world_map .item.item03 { top: 34%; left: 69.54%; }/* 북미  */
.world_map .item.item04 { top: 63%; left: 78%; }/* 중남미  */
.world_map .item.item05 { top: 86%; left: 48.65%; }/* 오세아니아  */
.world_map .item.item06 { top: 75%; left: 16.65%;} /* 아프리카  */

/* px였던 것들 → %로 교체 (2076×1230 기준) */


.world_row > .world_wrap > .world > .world_map > .items > .item.item05 .tit{ width: 140px;}



/* .world_row { margin: 0px auto; width: 100%;}
.world_row > .world_wrap { overflow: hidden; }
.world_row > .world_wrap > .world{ position: relative; display: flex; height: 500px; align-items: center; min-height: 0; padding: 10px; border-radius: 6px; box-sizing: border-box; overflow: hidden;}
.world_row > .world_wrap > .world::before { content: ''; position: absolute; top: 0; left: 0; right: 0; bottom: 0; background-color:rgba(0,0,0,0);  z-index: -1; } 
.world_row > .world_wrap > .world > .world_map { position: relative; width: 1038px; height: 500px; min-height: 373px; background: url(../img/new_know/main_world.png) no-repeat center center !important; background-size: 100% !important; border: 1px solid red;}
.world_row > .world_wrap > .world > .world_map::before { content: ''; position: absolute; width:790px; height:356px; top: 48px; left: 15px; background: url(../img/new_know/main_world_blink00.png) no-repeat center center !important;  background-size: 100% !important; z-index: 1; animation: blink 1s linear infinite;}
.world_row > .world_wrap > .world > .world_map.items { position: relative; z-index: 9 }공통: 한 줄 높이/정렬
.world_row > .world_wrap > .world > .world_map.items > .item { position: absolute; display: inline-flex; top: -50px;  left: 40px; padding: 8px 20px; background-color:#fff; border:1px solid #97bad6; border-radius: 15px; box-shadow: 1px 3px 4px 0px #7694b7;필요 시 폰트/간격 맞추세요 }왼쪽 배지
.world_row > .world_wrap > .world > .world_map.items > .item:hover { background-color:#eff7fd; border:1px dashed #334b98; box-shadow: 1px 3px 4px 0px #7694b7;}
.world_row > .world_wrap > .world > .world_map > .items > .item button { cursor: pointer;}
.world_row > .world_wrap > .world > .world_map > .items > .item button:hover { border:1px solid blue; }
.world_row > .world_wrap > .world > .world_map.items > .item > .map_mark { position: relative; display: flex; flex-direction: column; font-size: 14px;}
.world_row > .world_wrap > .world > .world_map.items > .item > .map_mark > strong { display: inline-block; color:#01499f; }
.world_row > .world_wrap > .world > .world_map.items > .item > .map_mark > span::before { content: "/"; display: inline-block; margin: 0 5px; color:#ddd; }
.world_row > .world_wrap > .world > .world_map.items > .item > .map_mark > span { display: inline-block; }
.world_row > .world_wrap > .world > .world_map.items > .item > .map_mark > span > strong { color:#01499f; font-weight: 600px;}
.world_row > .world_wrap > .world > .world_map.items > .item > .map_mark > span > em { color:#181a23; }

.world_row > .world_wrap > .world > .world_map.items > .item.item00 { top: 40px; left: 450px }
.world_row > .world_wrap > .world > .world_map.items > .item.item01 { top: 50px; left: 60px }
.world_row > .world_wrap > .world > .world_map.items > .item.item02 { top: 90px; left: 220px }
.world_row > .world_wrap > .world > .world_map.items > .item.item03 { top: 170px; left: 670px }
.world_row > .world_wrap > .world > .world_map.items > .item.item04 { top: 336px; left: 740px }
.world_row > .world_wrap > .world > .world_map.items > .item.item05 { top: 410px; left: 370px }
.world_row > .world_wrap > .world > .world_map.items > .item.item05 .tit{ width: 140px;}
.world_row > .world_wrap > .world > .world_map.items > .item.item06 { top: 350px; left: 70px } */

/* .world_map .blink {
    position: absolute;
    width: 788px;
    height: 351px;
    background-image: url(../img/new_know/main_world_blink00.png);
    background-size: cover;
    z-index: 2;
    top: 144px;
    left: 120px;
    animation: blink 1s linear infinite;
} */

/* ---------------------------------------------------------------*/
.world_map.ani-on .arrow.arrow-1 {
    animation: scale-1 6s ease-in-out forwards;  
    animation-delay: 1s;           /* ← 5초 후 시작 = 유럽  */
}
.world_map.ani-on .arrow.arrow-2 {
    animation: scale-2 6s ease-in-out forwards;  
    animation-delay: 2s;           /* ← 5초 후 시작 = 유럽  */
}

.world_map.ani-on .arrow.arrow-3 {
    animation: scale-3 6s ease-in-out forwards;
    animation-delay: 4s;           /* ← 10초 후 시작 = 아프리카  */  
}

.world_map.ani-on .arrow.arrow-4 {
    animation: scale-4 6s ease-in-out forwards;
    animation-delay: 6s;           /* ← 5초 후 시작 = 오세아니야.  */  
}

.world_map.ani-on .arrow.arrow-5 {
    animation: scale-5 6s ease-in-out forwards;
    animation-delay: 8s;            /* ← 5초 후 시작 = 북미.  */  
}

.world_map.ani-on .arrow.arrow-6 {
    animation: scale-6 6s ease-in-out forwards;
    animation-delay: 10s;           /* ← 5초 후 시작 = 중남미  */  
    
}

.world_map .arrow {
    position: absolute;
    background-size: cover;
    z-index: 2;
    opacity: 0
}

.world_map .arrow.arrow-1 {  
  left: 21.41%;
  top: 16.34%;
  width: 25.24%;
  height: 21.62%;
  background-image: url(../img/new_know/arrow-1.png);
  background-size: 100% 100%; 
}

.world_map .arrow.arrow-2 {
    width: 13%;    /* 109 / 1038 * 100 */
    height: 10%;    /* 59 / 615 * 100 */
    background-image: url(../img/new_know/arrow-2.png);
    top: 26%;      /* 236 / 615 * 100 */
    left: 33%;     /* 312 / 1038 * 100 */
    transform: rotate(60deg);   /* 이미지를 15도 아래로 회전 */
    transform-origin: center center; /* 중심축 기준 회전 */    
}

.world_map .arrow.arrow-3 {
    width: 28%;    /* 276 / 1038 * 100 */
    height: 13.87%;   /* 81 / 615 * 100 */
    background-image: url(../img/new_know/arrow-3.png);
    top: 34.13%;      /* 296 / 615 * 100 */
    left: 18.17%;     /* 147 / 1038 * 100 */ 
}

.world_map .arrow.arrow-4 {
    width: 2.70%;     /* 28 / 1038 * 100 */
    height: 26.67%;   /* 164 / 615 * 100 */
    background-image: url(../img/new_know/arrow-4.png);
    top: 36.29%;      /* 297 / 615 * 100 */
    left: 45.37%;     /* 419 / 1038 * 100 */
}

.world_map .arrow.arrow-5 {
    width: 43.74%;    /* 454 / 1038 * 100 */
    height: 26.02%;   /* 160 / 615 * 100 */
    background-image: url(../img/new_know/arrow-5.png);
    top: 33.97%;      /* 295 / 615 * 100 */
    left: 40.56%;     /* 421 / 1038 * 100 */
}

.world_map .arrow.arrow-6 {
    width: 31.60%;    /* 328 / 1038 * 100 */
    height: 9.92%;    /* 61 / 615 * 100 */
    background-image: url(../img/new_know/arrow-6.png);
    top: 27.21%;      /* 235 / 615 * 100 */
    left: 43.1%;     /* 425 / 1038 * 100 */
}

.world_map .map-arrow {
    position: absolute;
    width: 729px;
    height: 300px;
    background-image: url(../img/new_know/arrow-all.png);
    background-size: cover;
    top: 162px;
    left: 147px;
}

/* arrow 예시 (좌표는 %로, 지도 원본 1038x615px 기준 변환) */

/*##########################  animation  #############################*/
@keyframes blink {
    0% {
        opacity: 0
    }
    50% {
        opacity: 1
    }
    to {
        opacity: 0
    }
} 
@keyframes scale-1 {
  0% {
    opacity: 0;
    transform: rotate(0deg) scale(0);
    transform-origin: right bottom;
  }
  50% {
    opacity: 1;
    transform: rotate(-10deg) scale(1.06); /* 살짝 오버슈트 */
    transform-origin: right bottom;
  }
  100% {
    opacity: 0;                   /* 처음처럼 사라지게 유지 */
    transform: rotate(-10deg) scale(0);
    transform-origin: right bottom;   /* 끝에서 기준점 바꾸고 싶다면 유지 */
  }
}
@keyframes scale-2{
  0% {
    opacity: 0;
    transform: rotate(0deg) scale(0);
    transform-origin: right bottom;
  }
  50% {
    opacity: 1;
    transform: rotate(-10deg) scale(1.1); /* 살짝 오버슈트 */
    transform-origin: right bottom;
  }
  100% {
    opacity: 0;                   /* 처음처럼 사라지게 유지 */
    transform: rotate(-4deg) scale(0);
    transform-origin: left top;   /* 끝에서 기준점 바꾸고 싶다면 유지 */
  }
}
 @keyframes scale-3 { /* arrow 3*/
     0% {
    opacity: 0;
    transform: rotate(0deg) scale(0);
    transform-origin: right top;
  }
  50% {
    opacity: 1;
    transform: rotate(-10deg) scale(1.06); /* 살짝 오버슈트 */
    transform-origin: right center;
  }
  100% {
    opacity: 0;                   /* 처음처럼 사라지게 유지 */
    transform: rotate(0deg) scale(0);
    transform-origin: right top;   /* 끝에서 기준점 바꾸고 싶다면 유지 */
  }
}

@keyframes scale-4 {
    0% {
        opacity: 0;
        transform: scale(0);
        transform-origin: left top
    }

    50% {
        opacity: 1;
        transform: scale(1.16)
    }

    to {
        opacity: 0;
        transform: scale(0);
        transform-origin: left top
    }
}

@keyframes scale-5 {
    0% {
    opacity: 0;
    transform: rotate(0deg) scale(0);
    transform-origin: left top;
  }
  50% {
    opacity: 1;
    transform: rotate(8deg) scale(0.9); /* 살짝 오버슈트 */
    transform-origin: left top;
  }
  100% {
    opacity: 0;                   /* 처음처럼 사라지게 유지 */
    transform: rotate(8deg) scale(0);
    transform-origin: left top;   /* 끝에서 기준점 바꾸고 싶다면 유지 */
  }
}

@keyframes scale-6 {
    0% {
        opacity: 0;
        transform: rotate(0deg) scale(0);
        transform-origin: left bottom
    }

    50% {
        opacity: 1;
        transform: rotate(9deg) scale(0.8);
    }

    to {
        opacity: 0;
        transform: scale(0);
        transform-origin: left bottom
    }
} 


.world_row > .world_wrap > .world > .world_tab { display: flex; align-items: center;}
/* 기본은 패널 숨김 */
.world_tab .world_tab_wrap { min-width: 356px; width: 356px; border-radius: 0px; box-sizing: border-box; border: 12px solid #7979791f;}
.world_tab .world_tab_wrap .tab-container { padding: 10px 15px 14px 15px; height: 370px; background-color: #d5dbe3; border-radius: 5px; box-sizing: border-box;}
.world_tab .world_tab_wrap .tab-container .tab-list { display: flex; gap: 3px; margin-top: 10px; padding: 0;}
.world_tab .world_tab_wrap .tab-container .tab-list a { flex: 1; height: 40px; line-height: 42px; font-size: 17px; text-align: center; border-top-left-radius: 15px; border-top-right-radius: 15px; letter-spacing: -1px;} /* 기본은 패널 숨김 */
.world_tab .world_tab_wrap .tab-container .tab-list a[aria-selected="false"] { color: #f1f1f1; background-color:#8e8d8d; /* 비활성 탭 색상 */}
.world_tab .world_tab_wrap .tab-container .tab-list a[aria-selected="true"] { color: #fff; background-color:#a13b38; /* 활성 탭 색상 */}
.world_tab .world_tab_wrap .tab-container .tab-list a[aria-selected="false"]:focus { border:1px solid #716c6c; outline: none;}
.world_tab .world_tab_wrap .tab-container .tab-list a[aria-selected="true"]:focus { border:1px solid #972b28; outline: none;}

.world_tab .world_tab_wrap .tab-container .tab-content { display: none;  height: 290px;/* 기본적으로 모든 콘텐츠는 숨김 */}
.world_tab .world_tab_wrap .tab-container .tab-content.active { display: block; margin-top: 6px;  padding: 20px 14px; width: 100%; height: 290px; background-color:#f9f9f9; border: 1px solid 1px solid #cfcfcf; box-sizing: border-box;/* active 클래스가 있는 콘텐츠만 표시 */}
.world_tab .world_tab_wrap .tab-container .tab-content .tab-detail { display: flex; flex-direction: column; }
.tab-detail > .tab_head { position: relative; display: flex; justify-content: space-between; align-items: center; padding: 0 0 6px 0; height: 36px; line-height: 36px; border-bottom: 1px dashed #ddd; }
.tab-detail > .tab_head > h3 { font-size: 18px; font-weight: 600; color:#000; }
.tab-detail > .tab_head > .more { padding: 0 12px; font-size: 14px; font-weight: 400; height: 24px; line-height: 24px; color: #fff; border-radius: 30px; background-color: #0f4782; border:1px solid transparent;}
.tab-detail > .tab_head > .more:hover { border:1px solid #20568f; outline: none;}
.tab-detail > .tab_head > .more:focus { border:1px solid #20568f; outline: none; }
.tab-detail > .tab_body { margin: 14px 0px -10px 0px; overflow-y: auto; overflow-x: hidden; height: 191px;}
.tab-detail > .tab_body > .items { display: flex; flex-direction: row; flex-wrap: wrap; padding: 5px 0px 0px 0px;}
.tab-detail > .tab_body > .items > li { padding: 0px; width: 25%; box-sizing: border-box; } 
.tab-detail > .tab_body > .items > li > .item { position: relative; display: flex; padding: 4px 0 0px 0; flex-direction: column; align-items: center; }
.tab-detail > .tab_body > .items > li > .item:hover { background-color:#ffe9e9;}
.tab-detail > .tab_body > .items > li > .item > .img-wrap {
  position: relative;
  display: inline-block; /* img 폭만큼 자동 조절 */
}
.tab-detail > .tab_body > .items > li > .item > .img-wrap > img { display: block; max-width: 46px; height: 31px; border: 0px solid #dadadb; z-index: 1; }
.tab-detail > .tab_body > .items > li > .item > .img-wrap > .num { position: absolute; top: -4px; right: -10px; font-size: 10px; letter-spacing: -0.5px; width: 26px; height: 16px; line-height: 16px; text-align: center;
  background-color: #000; color: #fff; /* 오타 수정 */ border-radius: 50%; z-index: 2; /* img보다 위 */ }
 
.tab-detail > .tab_body > .items > li > .item > .tit { display: inline-block; margin: 3px 0px 5px 0px; font-size: 11px; letter-spacing: -0.5px; line-height: 23px;
    height: 23px;font-weight: 400; overflow: hidden;}
 
 
 /* section */
.techControlNewsList .grid_list_detail_info ul { display: flex; flex-direction: row; align-items: center; gap: 10px;}
 .techControlNewsList .grid_list_detail_info ul li {}
 .techControlNewsList .grid_list_detail_info ul li dl { display: flex;  flex-direction: row; align-items: center; gap: 5px;}
 .techControlNewsList .grid_list_detail_info ul li dl dt { box-sizing: border-box;}
 .techControlNewsList .grid_list_detail_info ul li dl dd { margin-left: 0px}
 .techControlNewsList .grid_list_detail_info li:not(:first-child) { padding-left: 0px; margin-left: 0px;} 

/*  swiper  */

.visual_wrap .visual .bg_area.tbtMainvisual01{background: url(../img/new_know/main_bottom_bg01.png) no-repeat center bottom / 100%, url(../img/new_know/main_top_bg.png) no-repeat center top / cover;}
.visual_wrap .visual .bg_area.tbtMainvisual02{background: url(../img/new_know/main_bottom_bg01.png) no-repeat center bottom / 100%, url(../img/new_know/main_top_bg.png) no-repeat center top / cover;}

.visual_wrap .visual .m_bgArea.tbtMainvisual01{background: url(../img/new_know/main_bottom_bg01.png) no-repeat center bottom / 100%, url(../img/new_know/main_top_bg.png) no-repeat center top / cover;}
.visual_wrap .visual .m_bgArea.tbtMainvisual02{background: url(../img/new_know/main_bottom_bg01.png) no-repeat center bottom / 100%, url(../img/new_know/main_top_bg.png) no-repeat center top / cover;}

/* layout.css - update */
.all-counter { top: 30px; } 


/* 공지사항 */
.mainNoticeList li { border: 0px solid #ddd!important; }
.mainNoticeList li:not(nth-child(1)) { border-top: 1px solid red!important }
.mainNoticeList dd{ display:inline-block; }


/* .mainSectionCon { padding: 0px 0px 0px 0px!important;} */
.sec_one { background: transparent; }
.sec_one .visual_wrap .visual .bg_area::after,
.sec_one .visual_wrap .visual .m_bgArea::after { background: transparent!important;}
.sec_one .swiper-pagination { left: 54%; bottom: 3%!important;}
.bannerAllQuick { padding-left: 112px; }
/*mainfooter 20251013*/
.main_sec_footer {margin-left: 0px!important; width: calc(100% - 0px)!important; background: #1a1d26 !important;}
.mainFooter {padding-left: 0px!important;}
.mainFooter > .WrapFooterInfo { margin: 0 auto 0 auto; max-width: 1250px;}

#gototop { display: none!important;}


/*.sec_one{background: url(../img/new_know/main_bottom_bg01.png) no-repeat center bottom / 100%, url(../img/new_know/main_top_bg.png) no-repeat center top / cover;}
 .sec_two{background:url('../img/sectionBg02.png') no-repeat center 0 #f8f8f8; background-size:cover;}
.sec_three{background:url('../img/sectionBg03.png') no-repeat center 0 #916667; background-size:cover;}
.sec_four{background:url('../img/sectionBg04.png') no-repeat center 0 #fbfbfc; background-size:cover;}
.sec_five{background:url('../img/sectionBg05.png') no-repeat center 0 #e0d8d8; background-size:cover;} */

/* ================================== media css ================================== */

@media screen and (min-width:1366px) and (max-width:1440px) {
    .mainSectionCon > .tit { margin: 0rem 0rem 4rem 0rem;}
   
    .tbtMainVisualSearch {}    
    .world_row > .world_wrap > .world > .world_map { width: 66%; }
}

@media screen and (max-width: 1365px) {
    .mobile #header .gnb-sub-menus-depth2 .gnb-sub-menu {
        height:48px;
    }
    .mobile #header .gnb-sub-menus-depth2 .gnb-sub-menu.active ul {
        height:58px;
    }
}

/* 노트북 & 테블릿 가로 (해상도 1024px ~ 1279px)*/ 
@media all and (min-width:1024px) and (max-width:1279px) { 
  .techControlNewsList .grid_list_detail_info ul {  flex-direction: column; align-items: flex-start; gap: 3px;} 
  .techControlNewsList .grid_list_detail_info li dt { width: 110px; text-align: center;}
}
/* 테블릿 가로 (해상도 768px ~ 1023px)*/ 
@media screen and (max-width:1024px) {	
.scroll_wrap { display: none;}
/* .mainSectionCon { height: 100%!important; padding: 20px!important;} */

.mainSection .mainSection_div { padding-left: 0px;}
.mainSection .mainSection_div .mainSectionCon { padding: 24px 24px 48px 24px; border:0px solid green}
/* .mainSection.sec_one .mainSection_div .mainSectionCon{ height: 94vh!important;} */
/* .mainSection.sec_one.fp-section{ height: 90%!important; border:2px solid pink;} */
/*     .mainSectionCon { padding: 15px !important; } */
    .mainSectionCon > .tit { margin: 12rem 0rem 3.6rem 0rem;} 
	.mainSectionCon > .tit > em { font-size: 3.0rem; }
	.mainSectionCon > .tit > strong { font-size: 3.2rem;}
	.tbt_keywordSearch { transform: scale(0.98);} 
    .tbt_keywordSearchBtn span { background-size: 90%;}
	.world_row { margin-top: 0px; width: 100%;}
/* 	.world_row > .world_wrap > .world { height: auto; flex-direction: column;} */
	.world_row > .world_wrap > .world > .world_map { margin-top: 0px;}
	.world_row > .world_wrap > .world > .world_tab { margin-top: 0px;}
	#fullpageArea { overflow: auto;}
	.topRightArea { right: 0px; }
	/* 공통 */
	.tbtMainVisual { margin-left: 0px; }
	.mainSection > .mainSection_div { padding: 15px; box-sizing: border-box;}
	.world_row > .world_wrap > .world{ flex-direction: column; height: auto; overflow: auto;}
	.world_tab { width: 90%;}
    .world_tab .world_tab_wrap { width: 100%; min-width: auto; }
    .world_tab .world_tab_wrap .tab-container .tab-content { height: 204px;}
    .world_tab_wrap .tab-detail > .tab_body > .items > li { width: 16%; }  
	
	.bannerAllQuick .swiper-buttonArea { right: 20px; z-index: 99;} 
	
	/* main footer */
/* 	.main_sec_footer {margin-left: 0px!important; width: calc(100% - 0px)!important; background: #1a1d26 !important; border:2px solid red;} */
	.mainFooter { margin: 0!important; padding-left: 0px!important; width: calc(100% - 0px)!important;}
	.mainFooter > .WrapFooterInfo { padding-left: 20px;}	
	} 

/* 모바일 가로 & 테블릿 세로 (해상도 480px ~ 767px)*/ 
@media screen and (max-width:767px) {    
    .all-counter { top: 90px!important; left: calc(50% + 0px);}
    .mainSectionCon > .tit { flex-direction: column; gap: 5px;}    
    .tbtMainVisualSearch { margin-bottom: 30px;}
    .world_map .item { padding: 0.4cqh 0.8cqw; }   
    .world_tab { width: 100%;}
    .world_tab .world_tab_wrap { width: 100%; min-width: auto; }
    .world_tab_wrap .tab-detail > .tab_body > .items > li { width: 20%; }  
 } 

@media screen and (max-width: 640px) {

    .tbtMainVisualSearch .tbt_keywordSearchInput { width: 360px!important}
    .techControlNewsList .grid_list_detail_info li dt { width: 110px;}
}

/* 최신 중상급 스마트폰 (390~440px 이상) */
@media (max-width: 540px) { /* 스타일 */ }


/* 가장 기본 모바일 (320~414px) */
 @media all and (max-width:480px) {
	 .world_row > .world_wrap > .world > .world_map > .items > .item > .map_mark { font-size: 0.8em; line-height: 140%;}
	 .techControlNewsList .grid_list_detail_info ul {  flex-direction: column; align-items: flex-start; gap: 3px;} 
}


/* 모바일 세로 (해상도 ~ 479px)*/ 
 @media all and (max-width:479px) {
 .mainSectionCon { padding: 20px 20px 30px 20px;}
 .world_row > .world_wrap > .world { overflow: hidden; }
 .world_row > .world_wrap > .world > .world_map > .items > .item > .map_mark { font-size: 0.8em;}
 .world_tab .world_tab_wrap { border: 8px solid #7979791f;}
 .world_tab { width: 100%;}
 .world_tab .world_tab_wrap { width: 100%; min-width: auto; }  
 .world_tab_wrap .tab-detail > .tab_body > .items > li { width: 25%; } 
 
 
  .mainSectionCon > .tit > em { font-size: 2.4rem;}
  .mainSectionCon > .tit > strong {font-size: 2.8rem;}
}

 @media all and (max-width:430px) {
	.tbtMainVisualSearch { transform: scale(0.9);} 
}

/* Galaxy Z Fold 344px*/
 @media all and (max-width:360px) {
 	.mainSectionCon > .tit { margin: 10rem 0rem 3.6rem 0rem;}
    .mainSectionCon > .tit > em { font-size: 2.2rem; border:1px solid yellow!important}
    .mainSectionCon > .tit > strong {font-size: 2.6rem;}
	.tbtMainVisualSearch { transform: scale(0.8);}
	.mainSectionCon > .tit { margin: 10rem 0rem 2rem 0rem;} 
	.tab-detail > .tab_body > .items > li > .item > .img-wrap > .num { right: -2px; }
	.world_tab .world_tab_wrap .tab-container .tab-list a { font-size: 14px;}
	.tab-detail > .tab_head > h3 { font-size: 16px;}
	.tab-detail > .tab_head > .more { font-size: 12px;}
	
	.controlNewsTitle h4 { font-size: 18px;}
	.controlNewsMore { font-size: 12px;}
	.controlNewsMain02 h5 { font-size: 16px;}
	.techControlNewsList .grid_list_detail_info dt { font-size: 12px; }
   
}






