/* --- 3. Hero Visual --- */
        .hero {
            margin-top: 90px; width: 100%; height: 100%;  
			position:absolute;left:0; top:0;text-align:center;  
			padding-top:50px;
        }
      .hero img{ max-width:100%; margin:Auto;}
        /* --- 4. Main Content (Grid) --- */
        .content-section {
          padding-top:290px;
            padding-bottom:  0px;
            position: relative; z-index: 10;
        }
		.content-section.main{ 
		background: url('../img/main_Visual.png') no-repeat center center;  background-size: cover;
		}
        
        .grid-row {
            display: grid;
            grid-template-columns: 1fr 1fr;
            gap: 24px;
            margin-bottom: 24px;
            padding: 0 20px;
        }

        /* 공통 카드 스타일 */
        .card {
            position: relative; overflow: hidden;
            border: 8px solid transparent; /* 호버 시 테두리 공간 확보 */
            transition: all 0.4s cubic-bezier(0.25, 0.8, 0.25, 1);
            cursor: pointer;
        }
        .card:hover {
            border-color: rgba(255,255,255,0.5);
            transform: translateY(-5px);
            box-shadow: 0 40px 50px rgba(0,0,0,0.1);
        }

        /* [수정] 상단 카드 (Global/Domestic) */
        .card-lg {
            height: 400px; /* 높이를 키움 */
        }
        .card-lg.bg1 { background: url('../img/main_photo01.png') no-repeat center/cover; }
        .card-lg.bg2 { background: url('../img/main_photo02.png') no-repeat center/cover; }
        
        .card-lg .txt-box {
            position: absolute; top: 50px; left: 50px;
            color: #fff;
        }
        .card-lg .txt-box h2 {
            font-size: 42px; line-height: 1.1; font-weight: 700;
            text-shadow: 0 2px 10px rgba(0,0,0,0.3);
        }

        /* 상단 카드 화살표 (중앙 하단) */
        .card-lg .arrow-circle {
            position: absolute; bottom: 50px; left: 50%;
            transform: translateX(-50%);
            width: 80px; 
			height: 60px; 
            border-radius: 50%;
            display: flex; align-items: center; justify-content: center;
            transition: 0.3s;
        }
        .card-lg .arrow-circle img { width: 150px; }
        .card-lg:hover .arrow-circle {  border-color: #fff; }
        .card-lg:hover .arrow-circle img {  }


        /* [수정] 하단 카드 (Safe/Wireless) */
        .card-sm {
            height: 256px; /* 높이를 작게 */
            background-color: rgba(14, 25, 45, 0.6); /* 반투명 어두운 배경 (Glassy) */
            /* 배경 이미지를 깔아주되 어둡게 처리하거나, 별도 이미지를 사용 */
        }
        /* 이미지가 있다면 사용하되 오버레이 추가 */
        .card-sm.bg3 { 
			background: url('../img/main_photo03.png') no-repeat center/cover; 
        }
        .card-sm.bg4 { 
            background: url('../img/main_photo04.png') no-repeat center/cover; 
        }

        .card-sm .txt-box {
            position: absolute; top: 40px; left: 40px;
            color: #fff;
        }
        .card-sm .txt-box h2 {
            font-size: 28px; font-weight: 700; margin-bottom: 10px;
        }
        .card-sm .txt-box p {
            font-size: 14px; opacity: 0.7; line-height: 1.5; font-weight: 300;
        }

        /* 하단 카드 화살표 (우측 하단) - box_arrow.png 사용 */
        .card-sm .arrow-stick {
            position: absolute; bottom: 20px; right: 30px;
            width: 20px; transition: 0.3s;
        }
        .card-sm .arrow-stick img { width: 100%; }
        /* 호버 시 화살표 이동 효과 */
        .card-sm:hover .arrow-stick {
            right: 20px; 
        }
  

        /* --- Responsive --- */
        @media (max-width: 768px) {
            header { height: 60px; padding: 0; }
             .pc-nav, .megamenu-dark { display: none !important; }
            .mobile-btn { display: block; margin-right: 5px; }

            .hero { margin-top:  0px; height: 100%;  padding-top:84px}
            .hero img{ width:100px;}			
            .content-section { margin-top: 0; padding-top: 130px; }
            
            .grid-row {
                grid-template-columns: 1fr; /* 1열 변경 */
                gap: 20px;
            }
            .card-lg { height: 240px; }

            .card-lg .txt-box { position: absolute; top: 40px; left: 20px; color: #fff; }			
            .card-lg .txt-box h2 { font-size: 28px; }
            .card-lg .arrow-circle { left: 50px; width: 60px; height: 40px; bottom: 50px; }

            .card-sm { height: 210px; }
            .card-sm .txt-box h2 { font-size: 22px; }


        .card-sm .txt-box {
            position: absolute; top:20px; left: 10px;
            color: #fff;
        }
 
        .card-sm .txt-box p {
            font-size: 11px; opacity: 0.7; line-height: 1.5; font-weight: 300;
        }
		
        .card-sm .arrow-stick {
            position: absolute; bottom: auto; right: 10px;top:30px;
            width: 15px; transition: 0.3s;
        }
            /* 모바일에서 링크들을 가로로 유지하고 싶다면 아래 주석 해제 */
            /* .btm-right { flex-direction: row; flex-wrap: wrap; justify-content: center; } */
        }