/* CSS 변수로 Safe Area 값 저장 */
:root {
	--sat: env(safe-area-inset-top);
	--sab: env(safe-area-inset-bottom);
	--sal: env(safe-area-inset-left);
	--sar: env(safe-area-inset-right);
}

/* 전역 리셋 */
* {
	margin: 0;
	padding: 0;
	box-sizing: border-box;
	-webkit-tap-highlight-color: transparent;
}

html {
	/* 스크롤 바운스 방지 */
	position: fixed;
	width: 100%;
	height: 100%;
	overflow: hidden;
}

body {
	width: 100%;
	height: 100%;
	overflow: hidden;
	font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto,
		sans-serif;
	background: #fff !important;
	/* 터치 스크롤 최적화 */
	-webkit-overflow-scrolling: touch;
	/* 텍스트 크기 자동 조정 방지 */
	-webkit-text-size-adjust: 100%;
}
.input-box:focus {
    outline: 2px solid #007AFF;}
.content-wrapper .nice-select {
	height: 40px;
	line-height: 40px;
	border-radius: 0.8rem;
	border: 1px solid var(--gray2);
}

.content-wrapper .nice-select span {
	vertical-align: text-bottom;
}
/*.header{ margin-top:0px;margin-top: constant(safe-area-inset-top);
            margin-top: env(safe-area-inset-top);}*/
.header {
	padding-top: constant(safe-area-inset-top, 50px) !important;
	padding-top: env(safe-area-inset-top, 50px) !important;
	margin-top: constant(safe-area-inset-top);
	margin-top: env(safe-area-inset-top);
}

.tab-container {
	margin-top: 0;
	position: relative;
	height: auto;
	overflow-y: hidden;
	z-index: 10;
}

.ham-top-con2 {
	margin-top: 20px;
}

.header.active {
	position: fixed;
	top: 0;
	left: 50%;
	right: 50%;
	/* iOS 상태바 높이 적용 */
	/* padding-top: 0;
            padding-top: constant(safe-area-inset-top) !important;
            padding-top: env(safe-area-inset-top) !important;*/
	padding-top: constant(safe-area-inset-top, 0px) !important;
	padding-top: env(safe-area-inset-top, 0px) !important;
	padding-top: env(titlebar-area-height, 0px);
	padding-bottom: env(keyboard-inset-height, 0px);
	transform: translate3d(-50%, 0%, -50%);
	display: block;
	/*height:46px;*/
	margin-top: constant(safe-area-inset-top);
	margin-top: env(safe-area-inset-top);
	background: none;
}

/* iOS 크롬에서만 추가 스타일 */

.ios.ios-chrome #main-header-container, .ios.ios-chrome #main-header-container .header,
	.ios.ios-chrome #header-container, .ios.ios-chrome #header-container .header
	{ /*background:#00a0ff;*/
	padding-top: 0 !important;
	margin-top: 0 !important;
	height: 60px;
}

/* iOS 네이버에서만 추가 스타일 */
.ios.ios-naver #main-header-container, .ios.ios-naver #main-header-container .header,
	.ios.ios-naver #header-container, .ios.ios-naver #header-container .header
	{ /*background:#32ea00;*/
	padding-top: 0 !important;
	margin-top: 0 !important;
	height: 60px;
}
/* iOS 카카오톡에서만 추가 스타일 */
.ios.ios-kakao  #main-header-container, .ios.ios-kakao  #main-header-container .header,
	.ios.ios-kakao  #header-container, .ios.ios-kakao  #header-container .header
	{
	padding-top: 0 !important;
	margin-top: 0 !important;
	height: 60px;
}
/* iOS 웨일만 */
.ios.ios-whale #main-header-container, .ios.ios-whale #main-header-container .header,
	.ios.ios-whale #header-container, .ios.ios-whale #header-container .header
	{
	padding-top: 0 !important;
	margin-top: 0 !important;
	height: 60px;
}

.ios.ios-chrome .footer, .ios.ios-chrome .ali-row.bali, .ios.ios-naver .footer,
	.ios.ios-naver .ali-row.bali, .ios.ios-kakao .footer, .ios.ios-kakao .ali-row.bali,
	.ios.ios-whale .footer, .ios.ios-whale .ali-row.bali {
	padding-bottom: 0 !important;
}

.full_content {
	margin-top: 0 !important;
}
/* 메인 스크롤 컨테이너 */
.main-scroll-container {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	overflow-y: auto;
	overflow-x: hidden;
	-webkit-overflow-scrolling: touch;
	/* 스크롤바 숨기기 */
	scrollbar-width: none;
	-ms-overflow-style: none;
}

.main-scroll-container::-webkit-scrollbar {
	display: none;
}

/* Edge-to-Edge 컨테이너 */
.app-container {
	min-height: 100vh;
	position: relative;
	/* 초기 로드 시 safe area 강제 적용 
            padding-top: 0;
            padding-top: constant(safe-area-inset-top);
            padding-top: env(safe-area-inset-top);*/
}

/* 1. 고정 헤더 (상태바 영역 포함) */
.fixed-header, .fixed-bottom-nav {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	z-index: 1;
	/* 배경을 상태바까지 확장 */
	/*background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);*/
	background: none;
	/* 상태바 높이만큼 패딩 */
	padding-top: constant(safe-area-inset-top);
	padding-top: env(safe-area-inset-top);
	transform: translateZ(0); /* 하드웨어 가속 */
	height: 40px;
}

.fixed-bottom-nav.active {
	background: rgba(0, 0, 0, 0.5);
}
/*.header.active {background: rgba(0, 0, 0, 0.5);}*/
#wrap {
	width: 100%;
	max-width: 440px;
	margin: 0 auto;
	background-color: var(--white);
	display: flex;
	flex-direction: column;
	min-height: 100vh;
}
/*.tab-container{margin-top:40px;}*/
#header-container {
	height: 40px;
}

.search-overlay, .main-container, #wrap { /* 상태바 높이만큼 패딩 */
	padding-top: constant(safe-area-inset-top);
	padding-top: env(safe-area-inset-top);
}

.header-content {
	height: 56px;
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 0 16px;
	padding-left: max(16px, constant(safe-area-inset-left));
	padding-left: max(16px, env(safe-area-inset-left));
	padding-right: max(16px, constant(safe-area-inset-right));
	padding-right: max(16px, env(safe-area-inset-right));
	color: white;
}

.android .footer, .android .ali-row.bali {
	padding-bottom: 10px;
}

.footer, .ali-row.bali { /* 홈 인디케이터 영역 확보 */
	padding-bottom: constant(safe-area-inset-bottom);
	padding-bottom: env(safe-area-inset-bottom);
	min-height: 60px;
	height: auto;
	bottom: 0;
}

.content-wrapper {
	padding-bottom: constant(safe-area-inset-bottom);
	padding-bottom: env(safe-area-inset-bottom);
	height: calc(100dvh - 18rem - env(safe-area-inset-bottom));
}

.content-wrapper_footer_none{
	height: calc(100dvh - 7.5rem - env(safe-area-inset-bottom));
	overflow: auto;
}

 #ajaxContent {
	height: calc(100dvh - 13rem - env(safe-area-inset-bottom));
	overflow: auto;
}


#content {
	padding: 0 0 20px;
	padding-bottom: constant(safe-area-inset-bottom);
	padding-bottom: env(safe-area-inset-bottom);
}

.content-wrapper2.content-wrapper_footer_none {
	height: calc(100dvh - 10rem - env(safe-area-inset-bottom));
	overflow: auto;
}

.content-wrapper3.content-wrapper.content-wrapper_footer_none {
	overflow: auto;
	padding-bottom: 0;
}

#content {
	height: calc(100dvh - 7rem - env(safe-area-inset-bottom));
	overflow: auto;
	margin-top: calc(max(10px, 10px - env(safe-area-inset-top)));
	overflow-x: hidden;
}

.content-wrapper2_1 {
	height: calc(100dvh - 40px - env(safe-area-inset-bottom));
}

.content-wrapper3_1 {
	overflow-y: auto;
	padding: 20px;
	margin-bottom: 100px;
	margin-top: 70px;
	padding-bottom: constant(safe-area-inset-bottom);
	padding-bottom: env(safe-area-inset-bottom);
	height: calc(100dvh - 12rem - env(safe-area-inset-bottom));
}

.content-wrapper_footer_none_2 {
	height: calc(100dvh - 15rem - env(safe-area-inset-bottom));
}

.fixed-bottom-nav.ham {
	transform: none; /* GPU 사용 안 함 */
	transition: opacity 0.3s ease-in-out, visibility 0.3s ease-in-out;
}
/*.menu-overlay {
   max-height: calc(100dvh - env(safe-area-inset-bottom));overflow:auto;
}*/
.menu-overlay-inner {
	margin-top: constant(safe-area-inset-top);
	margin-top: env(safe-area-inset-top);
	padding-top: constant(safe-area-inset-top);
	padding-top: env(safe-area-inset-top);
	height: calc(100dvh - 50px - env(safe-area-inset-top))- env(safe-area-inset-bottom));
	overflow: auto;
}
/* 2. 첫 번째 히어로 섹션 (전체 화면) */
.hero-section {
	position: relative;
	width: 100vw;
	height: auto;
	/* 상태바 영역부터 시작 */
	margin-top: calc(-1 * constant(safe-area-inset-top));
	margin-top: calc(-1 * env(safe-area-inset-top));
	/* background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);*/
	background: none;
	display: flex;
	align-items: center;
	justify-content: center;
	overflow: hidden;
	transform: translate(-50%, 0%);
	left: 50%;
	top: 0;
}

.hero-content {
	text-align: center;
	color: white;
	padding: 20px;
	/* Safe area 패딩 적용 */
	padding-top: calc(20px + constant(safe-area-inset-top));
	padding-top: calc(20px + env(safe-area-inset-top));
	padding-left: max(20px, constant(safe-area-inset-left));
	padding-left: max(20px, env(safe-area-inset-left));
	padding-right: max(20px, constant(safe-area-inset-right));
	padding-right: max(20px, env(safe-area-inset-right));
	z-index: 2;
}

.hero-bg-pattern {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	opacity: 0.1;
	background-image: repeating-linear-gradient(45deg, transparent, transparent 35px, rgba(255
		, 255, 255, .1) 35px, rgba(255, 255, 255, .1) 70px);
}

/* 3. Edge-to-Edge 이미지 배너 */
.edge-image-banner {
	position: relative;
	width: 100vw;
	height: 400px;
	overflow: hidden;
	/* 좌우 패딩 제거 */
	margin-left: calc(-1 * max(16px, constant(safe-area-inset-left)));
	margin-left: calc(-1 * max(16px, env(safe-area-inset-left)));
	margin-right: calc(-1 * max(16px, constant(safe-area-inset-right)));
	margin-right: calc(-1 * max(16px, env(safe-area-inset-right)));
}

.banner-image {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.banner-overlay {
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
	padding: 40px;
	padding-left: max(40px, constant(safe-area-inset-left));
	padding-left: max(40px, env(safe-area-inset-left));
	padding-right: max(40px, constant(safe-area-inset-right));
	padding-right: max(40px, env(safe-area-inset-right));
	background: linear-gradient(to top, rgba(0, 0, 0, 0.8), transparent);
	color: white;
}

/* 4. Edge-to-Edge 가로 스크롤 */
.horizontal-scroll {
	display: flex;
	overflow-x: auto;
	overflow-y: hidden;
	scroll-snap-type: x mandatory;
	-webkit-overflow-scrolling: touch;
	gap: 12px;
	padding: 20px 0;
	/* 첫 번째 아이템 시작 위치 */
	padding-left: constant(safe-area-inset-left);
	padding-left: env(safe-area-inset-left);
	padding-left: max(16px, constant(safe-area-inset-left));
	padding-left: max(16px, env(safe-area-inset-left));
	/* 마지막 아이템 끝 위치 */
	padding-right: constant(safe-area-inset-right);
	padding-right: env(safe-area-inset-right);
	padding-right: max(16px, constant(safe-area-inset-right));
	padding-right: max(16px, env(safe-area-inset-right));
	/* 컨테이너 마진 조정 */
	margin-left: calc(-1 * max(16px, constant(safe-area-inset-left)));
	margin-left: calc(-1 * max(16px, env(safe-area-inset-left)));
	margin-right: calc(-1 * max(16px, constant(safe-area-inset-right)));
	margin-right: calc(-1 * max(16px, env(safe-area-inset-right)));
	/* 스크롤바 숨기기 */
	scrollbar-width: none;
	-ms-overflow-style: none;
}

.horizontal-scroll::-webkit-scrollbar {
	display: none;
}

.scroll-item {
	flex: 0 0 280px;
	height: 180px;
	background: white;
	border-radius: 16px;
	scroll-snap-align: start;
	box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
	overflow: hidden;
	position: relative;
}

/* 5. 일반 콘텐츠 영역 */
.content-section {
	padding: 24px 16px;
	padding-left: max(16px, constant(safe-area-inset-left));
	padding-left: max(16px, env(safe-area-inset-left));
	padding-right: max(16px, constant(safe-area-inset-right));
	padding-right: max(16px, env(safe-area-inset-right));
	background: #f8f9fa;
}

/* 6. 하단 고정 네비게이션 */
.bottom-nav {
	position: fixed;
	bottom: 0;
	left: 0;
	right: 0;
	background: rgba(255, 255, 255, 0.98);
	backdrop-filter: blur(20px);
	-webkit-backdrop-filter: blur(20px);
	border-top: 1px solid rgba(0, 0, 0, 0.08);
	/* 홈 인디케이터 영역 확보 */
	padding-bottom: constant(safe-area-inset-bottom);
	padding-bottom: env(safe-area-inset-bottom);
	transform: translateZ(0); /* 하드웨어 가속 */
	z-index: 1000;
}

.nav-content {
	display: flex;
	height: 56px;
	align-items: center;
	justify-content: space-around;
	/* 좌우 Safe Area */
	padding-left: constant(safe-area-inset-left);
	padding-left: env(safe-area-inset-left);
	padding-right: constant(safe-area-inset-right);
	padding-right: env(safe-area-inset-right);
}

.nav-item {
	flex: 1;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	text-decoration: none;
	color: #666;
	font-size: 11px;
	padding: 4px;
}

.nav-icon {
	font-size: 24px;
	margin-bottom: 2px;
}

/* 하단 네비게이션 공간 확보 */
.bottom-spacing {
	/*  height: 56px;*/
	padding-bottom: constant(safe-area-inset-bottom);
	padding-bottom: env(safe-area-inset-bottom);
}

/* 로딩 시 깜빡임 방지 */
.app-container>* {
	animation: fadeIn 0.3s ease-out;
}

@ keyframes fadeIn {from { opacity:0;
	transform: translateY(10px);
}

to {
	opacity: 1;
	transform: translateY(0);
}

}

/* 가로 모드 대응 */
@media screen and (orientation: landscape) {
	.hero-section {
		max-width: 100%;
	}
	.fixed-header {
		padding-left: constant(safe-area-inset-left);
		padding-left: env(safe-area-inset-left);
		padding-right: constant(safe-area-inset-right);
		padding-right: env(safe-area-inset-right);
	}
	.header.active {
		padding-left: constant(safe-area-inset-left);
		padding-left: env(safe-area-inset-left);
		padding-right: constant(safe-area-inset-right);
		padding-right: env(safe-area-inset-right);
	}
}
/*세로가 아닌 가로 화면 데스크탑 */
@media ( min-width :1024px) and (orientation: landscape) {
	.hero-section {
		max-width: 440px;
	}
	#footer-container-overlay .footer-overlay, .popup-bottom,
		.main-container, .banner-slider .main-banner, #footer-container .footer,
		#footer-container-overlay .footer, #footer-container .footer-overlay,
		.main-container #top-tab, .main-container .tab-container {
		max-width: 440px;
	}
	.header {
		max-width: 440px;
		left: 50%;
		transform: translateX(-50%);
	}
}

/* 다크모드 대응 */
@media ( prefers-color-scheme : dark) {
	body {
		background: #000;
	}
	.content-section {
		background: #1c1c1e;
		color: white;
	}
	.bottom-nav {
		background: rgba(28, 28, 30, 0.98);
		border-top-color: rgba(255, 255, 255, 0.08);
	}
	.scroll-item {
		background: #2c2c2e;
	}
}

/* 디버깅용 Safe Area 표시 */
.debug-safe-area {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	background: rgba(255, 0, 0, 0.2);
	height: constant(safe-area-inset-top);
	height: env(safe-area-inset-top);
	z-index: 9999;
	pointer-events: none;
	display: none; /* 필요시 block으로 변경 */
}

.content-wrapper2, .content-wrapper2_1 {
	overflow-y: auto;
	padding: 20px;
	height: calc(100dvh - 120px);
	margin: 0;
}

.content-wrapper.content-wrapper_3_2 {
	max-height: calc(100dvh - 100px);
	overflow: auto;
	padding-bottom: 20px;
}

.main-container {
	min-height: auto;
}

.content-wrapper_footer_none_1 {
	height: calc(100dvh - 40px - env(safe-area-inset-bottom));
	overflow: auto;
}

.android .content-wrapper_footer_none_1 {
	height: calc(100dvh - 70px - env(safe-area-inset-bottom));
	overflow: auto;
}

.main-container_1 {
	height: 100dvh;
}

.tab-wrapper.sb {
	margin-top: 1.5rem;
}

.android .content-wrapper {
	padding-bottom: calc(20px + env(safe-area-inset-bottom));
}

.content-wrapper.content-wrapper_3_2 {
	height: calc(100dvh - 80px);
}

.android .content-wrapper.content-wrapper_3_2 {
	height: calc(100dvh - 110px);
}


.ios .content-wrapper.content-wrapper_3_2 {
	max-height: calc(100dvh - 150px);
}

.ios .content-wrapper_footer_none_2, .android .content-wrapper_footer_none_2
	{
	max-height: calc(100dvh - 17rem - env(safe-area-inset-bottom));
}

.ios .footer, .ios .ali-row.bali {
	padding-bottom: 20px;
}

.ios .content-wrapper_footer_none_1 {
	height: calc(100dvh - 70px - env(safe-area-inset-bottom));
	overflow: auto;
}

/* 화면 너비가 768px 이상일 때 적용 (태블릿, 폴드 펼친 상태, 데스크탑) */
@media screen and (min-width: 650px) {

    /**/
    .android .header {
		padding-top: constant(safe-area-inset-top, 70px) !important;
		padding-top: env(safe-area-inset-top, 70px) !important;
		padding-top: env(titlebar-area-height, 70px);
		padding-bottom: env(keyboard-inset-height, 70px);
		margin-top: calc(50px - constant(safe-area-inset-top));
		margin-top: calc(50px - env(safe-area-inset-top));
	}
	.android .header.active {
		padding-top: constant(safe-area-inset-top, 50px) !important;
		padding-top: env(safe-area-inset-top, 50px) !important;
		margin-top: calc(40px - constant(safe-area-inset-top));
		margin-top: calc(40px - env(safe-area-inset-top));
		background: none;
		height: calc(30px + env(safe-area-inset-top))
	}
	.android .fixed-header, .ios .fixed-bottom-nav {
		height: calc(30px + env(safe-area-inset-top))
	}
    .ham_list {
    min-height: calc(100dvh - 450px);
}
    .ham-top-con2 img {
        margin: 0 !important;
    }
    
}


/* 너비가 650px 이상이고, 화면 비율이 정사각형에 가까운 기기 */
@media screen and 
      (min-width: 650px) and 
      (aspect-ratio > 3/4) and 
      (aspect-ratio < 1/1) {

    /* 갤럭시 폴드 펼친 상태 (세로)만 */
   .android #header-container {
    height: 65px;
}
    .android .header {
    position: relative;
		padding-top: constant(safe-area-inset-top, 100px) !important;
		padding-top: env(safe-area-inset-top, 100px) !important;
		padding-top: env(titlebar-area-height, 100px);
		padding-bottom: env(keyboard-inset-height, 100px);
		margin-top: calc(30px - constant(safe-area-inset-top));
		margin-top: calc(30px - env(safe-area-inset-top));
        
	}
	.android .header.active {
		padding-top: constant(safe-area-inset-top, 0px) !important;
		padding-top: env(safe-area-inset-top, 0px) !important;
		margin-top: calc(0px - constant(safe-area-inset-top));
		margin-top: calc(0px - env(safe-area-inset-top));
		background: none;
		height: calc(0px + env(safe-area-inset-top))
	}
   .android .tab-container{margin-top:30px;}
}




@media only screen and (min-device-width: 550px) and (max-device-width:
	1024px) and (orientation: portrait) and
	(-webkit-min-device-pixel-ratio: 1) {
	/* iPad 세로 */
	.ali-row.bali {
		max-width: 100%;
		width: 100%;
		padding: 0 10%;
		bottom: env(safe-area-inset-bottom);
        background: rgba(255, 255, 255, 0.9);
	}
	.menu-overlay {
		max-width: 100%;
	}
	.ham-top-con2 img {
		margin-right: 0.5rem !important;
	}
	.menu-overlay .footer_location_info {
		position: relative;
		bottom: 0;
		width: 100%;
	}
}

@media only screen and (min-device-width: 550px) and (max-device-width:
	1024px) and (orientation: landscape) and
	(-webkit-min-device-pixel-ratio: 1) {
	/* iPad 가로 */
	/*.ios .header {
		margin-top: 10px !important;
	}*/
	.search-overlay {
		max-width: 440px;
		left: 50%;
		transform: translateX(-50%);
	}
}

@media ( max-width : 500px) {
	.ali-row.bali {
		max-width: 100%;
		width: 100%;
		padding: 0 10%;
		background: rgba(255, 255, 255, 0.9);
	}
}

@media ( max-width : 430px) {
	/* iPhone 계열 대부분 */
	.ios .header {
		padding-top: constant(safe-area-inset-top, 70px) !important;
		padding-top: env(safe-area-inset-top, 70px) !important;
		padding-top: env(titlebar-area-height, 70px);
		padding-bottom: env(keyboard-inset-height, 70px);
		margin-top: calc(70px - constant(safe-area-inset-top));
		margin-top: calc(70px - env(safe-area-inset-top));
	}
	.ios .header.active {
		padding-top: constant(safe-area-inset-top, 70px) !important;
		padding-top: env(safe-area-inset-top, 70px) !important;
		margin-top: calc(70px - constant(safe-area-inset-top));
		margin-top: calc(70px - env(safe-area-inset-top));
		background: none;
		height: calc(40px + env(safe-area-inset-top))
	}
	.ios .fixed-header, .ios .fixed-bottom-nav {
		height: calc(40px + env(safe-area-inset-top))
	}
}

/* iPhone 14 Plus, 15 Plus */
@media only screen and (max-width: 430px) and (max-height: 932px) {
	.ios .header.active {
		padding-top: constant(safe-area-inset-top, 60px) !important;
		padding-top: env(safe-area-inset-top, 60px) !important;
		margin-top: calc(60px - constant(safe-area-inset-top));
		margin-top: calc(60px - env(safe-area-inset-top));
		background: none;
		height: calc(30px + env(safe-area-inset-top))
	}
	.ios .fixed-header, .ios .fixed-bottom-nav {
		height: calc(30px + env(safe-area-inset-top))
	}
}

/* iPhone 12, 13, 14, 15 */
@media only screen and (max-width: 390px) and (max-height: 844px) {
	.ios .header {
		padding-top: constant(safe-area-inset-top, 50px) !important;
		padding-top: env(safe-area-inset-top, 50px) !important;
		padding-top: env(titlebar-area-height, 50px);
		padding-bottom: env(keyboard-inset-height, 50px);
		margin-top: calc(60px - constant(safe-area-inset-top));
		margin-top: calc(60px - env(safe-area-inset-top));
	}
	.ios .header.active {
		padding-top: constant(safe-area-inset-top, 50px) !important;
		padding-top: env(safe-area-inset-top, 50px) !important;
		margin-top: calc(50px - constant(safe-area-inset-top));
		margin-top: calc(60px - env(safe-area-inset-top));
		background: none;
		height: calc(40px + env(safe-area-inset-top))
	}
	.ios .fixed-header, .ios .fixed-bottom-nav {
		height: calc(40px + env(safe-area-inset-top))
	}
}


@media ( max-width : 375px) {
	/* iPhone Plus, Pro Max 모델들 */
	.ios .header {
		padding-top: constant(safe-area-inset-top, 60px) !important;
		padding-top: env(safe-area-inset-top, 60px) !important;
		padding-top: env(titlebar-area-height, 60px);
		padding-bottom: env(keyboard-inset-height, 60px);
		margin-top: calc(60px - constant(safe-area-inset-top));
		margin-top: calc(60px - env(safe-area-inset-top));
	}
}

@media screen and (max-width: 380px) {
    /* S22 최적화 스타일 */
    .android .header {
		padding-top: constant(safe-area-inset-top, 100px) !important;
		padding-top: env(safe-area-inset-top, 100px) !important;
		padding-top: env(titlebar-area-height, 100px);
		padding-bottom: env(keyboard-inset-height, 100px);
		margin-top: calc(0px - constant(safe-area-inset-top));
		margin-top: calc(0px - env(safe-area-inset-top));
	}
	.android .header.active {
		padding-top: constant(safe-area-inset-top, 50px) !important;
		padding-top: env(safe-area-inset-top, 50px) !important;
		margin-top: calc(0px - constant(safe-area-inset-top));
		margin-top: calc(0px - env(safe-area-inset-top));
		background: #fff;
		height: calc(60px + env(safe-area-inset-top))
	}
	.android .fixed-header, .android .fixed-bottom-nav {
		height: calc(60px + env(safe-area-inset-top))
	}
   .android .tab-container{margin-top:20px;}
}

@media screen and (min-width: 390px) and (max-width: 430px) {
  /* 여기에 갤럭시 S25 울트라에 최적화된 스타일을 넣으세요.
    S22보다 화면이 넓으므로 여백을 더 주거나 폰트를 살짝 키울 수 있습니다.
  */
  .android .header {
		padding-top: constant(safe-area-inset-top, 100px) !important;
		padding-top: env(safe-area-inset-top, 100px) !important;
		padding-top: env(titlebar-area-height, 100px);
		padding-bottom: env(keyboard-inset-height, 100px);
		margin-top: calc(30px - constant(safe-area-inset-top));
		margin-top: calc(30px - env(safe-area-inset-top));
	}
	.android .header.active {
		padding-top: constant(safe-area-inset-top, 50px) !important;
		padding-top: env(safe-area-inset-top, 50px) !important;
		margin-top: calc(20px - constant(safe-area-inset-top));
		margin-top: calc(20px - env(safe-area-inset-top));
		background: none;
		height: calc(90px + env(safe-area-inset-top))
	}
	.android .fixed-header, .android .fixed-bottom-nav {
		height: calc(90px + env(safe-area-inset-top))
	}
   .android .tab-container{margin-top:30px;}
   .android .search-overlay-inner{padding-top:50px;}
}


/* 모든 폴드 시리즈 커버 디스플레이 */
@media screen and (max-width: 375px) {
 /* 갤럭시 폴드 펼친 상태 (세로)만 */
    .android .header {
		padding-top: constant(safe-area-inset-top, 100px) !important;
		padding-top: env(safe-area-inset-top, 100px) !important;
		padding-top: env(titlebar-area-height, 100px);
		padding-bottom: env(keyboard-inset-height, 100px);
		margin-top: calc(30px - constant(safe-area-inset-top));
		margin-top: calc(30px - env(safe-area-inset-top));
	}
	.android .header.active {
		padding-top: constant(safe-area-inset-top, 50px) !important;
		padding-top: env(safe-area-inset-top, 50px) !important;
		margin-top: calc(20px - constant(safe-area-inset-top));
		margin-top: calc(20px - env(safe-area-inset-top));
		background: none;
		height: calc(80px + env(safe-area-inset-top))
	}
	.android .fixed-header, .android .fixed-bottom-nav {
		height: calc(80px + env(safe-area-inset-top))
	}
   .android .tab-container{margin-top:20px;}

}

@media screen and (max-width: 360px) {
.android .header {
	padding-top: constant(safe-area-inset-top, 50px) !important;
	padding-top: env(safe-area-inset-top, 50px) !important;
	padding-top: env(titlebar-area-height, 50px);
	padding-bottom: env(keyboard-inset-height, 50px);
	margin-top: constant(safe-area-inset-top);
	margin-top: env(safe-area-inset-top);
    height: calc(5px + env(safe-area-inset-top))
}

.android .header.active {
	position: fixed;
	top: 0;
	left: 50%;
	right: 50%;
	/* iOS ??? ?? ?? */
	/* padding-top: 0;
            padding-top: constant(safe-area-inset-top) !important;
            padding-top: env(safe-area-inset-top) !important;*/
	padding-top: constant(safe-area-inset-top, 0px) !important;
	padding-top: env(safe-area-inset-top, 0px) !important;
	padding-top: env(titlebar-area-height, 0px);
	padding-bottom: env(keyboard-inset-height, 0px);
	transform: translate3d(-50%, 0%, -50%);
	display: block;
	/*height:46px;*/
	background: none;
}
.android .tab-container{margin-top:0px;}
}