@charset "euc-kr";

/* 모바일 최적화 스타일 */
/* 모바일에서 팝업 폼 글자 크기 조정 */

/* 기본 모바일 스타일 */
@media screen and (max-width: 768px) {
	/* 팝업 관련 모바일 최적화 */
	.pop_report {
		width: 95% !important;
		max-height: 95vh !important;
	}
	
	.popup-title {
		font-size: 1.6em !important;
		padding: 0.8em !important;
	}
	
	.pop_reIn {
		padding: 1.5em !important;
	}
	
	.input_box {
		padding: 10px !important;
		font-size: 0.9em !important;
	}
	
	.item-label {
		font-size: 1em !important;
	}
	
	.submit-button {
		padding: 12px !important;
		font-size: 1.1em !important;
	}
	
	/* 메인 섹션 모바일 최적화 */
	.hero-section {
		min-height: 100vh !important;
		padding: 2em 1em !important;
	}
	
	.hero-content {
		text-align: center !important;
		padding: 2em 1em !important;
	}
	
	.main-title {
		font-size: clamp(2rem, 8vw, 3rem) !important;
		line-height: 1.2 !important;
		margin-bottom: 1em !important;
	}
	
	.sub-title {
		font-size: clamp(1.5rem, 6vw, 2rem) !important;
		margin-bottom: 1em !important;
	}
	
	.sub-subtitle {
		font-size: clamp(1.2rem, 4vw, 1.5rem) !important;
		margin-bottom: 2em !important;
	}
	
	.cta-button {
		padding: 15px 30px !important;
		font-size: 1.2rem !important;
	}
	
	/* 혜택 섹션 모바일 최적화 */
	.benefits-section {
		padding: 3em 1em !important;
	}
	
	.benefit-card {
		margin-bottom: 2em !important;
		padding: 2em 1.5em !important;
	}
	
	.benefit-icon {
		width: 60px !important;
		height: 60px !important;
		font-size: 1.5rem !important;
	}
	
	.benefit-title {
		font-size: 1.3rem !important;
		margin-bottom: 1em !important;
	}
	
	.benefit-desc {
		font-size: 1rem !important;
		line-height: 1.6 !important;
	}
	
	/* 푸터 모바일 최적화 */
	#footer {
		padding: 2em 1em !important;
	}
	
	.footer-content {
		flex-direction: column !important;
		text-align: center !important;
		gap: 1.5em !important;
	}
	
	.footer-left, .footer-right {
		width: 100% !important;
	}
	
	.footer-info {
		font-size: 0.9rem !important;
	}
}

/* 작은 모바일 화면 */
@media screen and (max-width: 480px) {
	.popup-title {
		font-size: 1.4em !important;
		padding: 0.6em !important;
	}
	
	.pop_reIn {
		padding: 1em !important;
	}
	
	.item-label {
		font-size: 1em !important;
	}
	
	.input_box {
		padding: 8px !important;
		font-size: 0.85em !important;
	}
	
	.submit-button {
		padding: 12px !important;
		font-size: 1.1em !important;
	}
	
	/* 메인 섹션 더 작은 화면 */
	.hero-section {
		padding: 1.5em 0.8em !important;
	}
	
	.hero-content {
		padding: 1.5em 0.8em !important;
	}
	
	.main-title {
		font-size: clamp(1.8rem, 7vw, 2.5rem) !important;
	}
	
	.sub-title {
		font-size: clamp(1.3rem, 5vw, 1.8rem) !important;
	}
	
	.sub-subtitle {
		font-size: clamp(1rem, 3.5vw, 1.3rem) !important;
	}
	
	.cta-button {
		padding: 12px 25px !important;
		font-size: 1.1rem !important;
	}
	
	/* 혜택 섹션 더 작은 화면 */
	.benefits-section {
		padding: 2em 0.8em !important;
	}
	
	.benefit-card {
		padding: 1.5em 1em !important;
	}
	
	.benefit-icon {
		width: 50px !important;
		height: 50px !important;
		font-size: 1.3rem !important;
	}
	
	.benefit-title {
		font-size: 1.2rem !important;
	}
	
	.benefit-desc {
		font-size: 0.9rem !important;
	}
	
	/* 푸터 더 작은 화면 */
	#footer {
		padding: 1.5em 0.8em !important;
	}
	
	.footer-info {
		font-size: 0.8rem !important;
	}
}

/* 매우 작은 모바일 화면 */
@media screen and (max-width: 360px) {
	.popup-title {
		font-size: 1.3em !important;
		padding: 0.5em !important;
	}
	
	.pop_reIn {
		padding: 0.8em !important;
	}
	
	.input_box {
		padding: 6px !important;
		font-size: 0.8em !important;
	}
	
	.submit-button {
		padding: 10px !important;
		font-size: 1em !important;
	}
	
	/* 메인 섹션 매우 작은 화면 */
	.hero-section {
		padding: 1em 0.5em !important;
	}
	
	.hero-content {
		padding: 1em 0.5em !important;
	}
	
	.main-title {
		font-size: clamp(1.6rem, 6vw, 2.2rem) !important;
	}
	
	.sub-title {
		font-size: clamp(1.2rem, 4.5vw, 1.6rem) !important;
	}
	
	.sub-subtitle {
		font-size: clamp(0.9rem, 3vw, 1.2rem) !important;
	}
	
	.cta-button {
		padding: 10px 20px !important;
		font-size: 1rem !important;
	}
	
	/* 혜택 섹션 매우 작은 화면 */
	.benefits-section {
		padding: 1.5em 0.5em !important;
	}
	
	.benefit-card {
		padding: 1.2em 0.8em !important;
	}
	
	.benefit-icon {
		width: 45px !important;
		height: 45px !important;
		font-size: 1.2rem !important;
	}
	
	.benefit-title {
		font-size: 1.1rem !important;
	}
	
	.benefit-desc {
		font-size: 0.85rem !important;
	}
	
	/* 푸터 매우 작은 화면 */
	#footer {
		padding: 1em 0.5em !important;
	}
	
	.footer-info {
		font-size: 0.75rem !important;
	}
}

/* 모바일 터치 최적화 */
@media (hover: none) and (pointer: coarse) {
	.cta-button:hover {
		transform: none !important;
	}
	
	.benefit-card:hover {
		transform: none !important;
	}
	
	.submit-button:hover {
		transform: none !important;
	}
	
	/* 터치 영역 확대 */
	.cta-button, .submit-button {
		min-height: 44px !important;
	}
	
	input[type="radio"], input[type="checkbox"] {
		min-width: 24px !important;
		min-height: 24px !important;
	}
}

/* 모바일 가로 모드 */
@media screen and (max-width: 768px) and (orientation: landscape) {
	.hero-section {
		min-height: 100vh !important;
		padding: 1em !important;
	}
	
	.hero-content {
		padding: 1em !important;
	}
	
	.main-title {
		font-size: clamp(1.8rem, 6vw, 2.5rem) !important;
	}
	
	.sub-title {
		font-size: clamp(1.4rem, 4.5vw, 1.8rem) !important;
	}
	
	.sub-subtitle {
		font-size: clamp(1.1rem, 3.5vw, 1.4rem) !important;
	}
	
	.benefits-section {
		padding: 2em 1em !important;
	}
}

/* 모바일 성능 최적화 */
@media screen and (max-width: 768px) {
	/* 애니메이션 최적화 */
	* {
		animation-duration: 0.3s !important;
		transition-duration: 0.3s !important;
	}
	
	/* 복잡한 애니메이션 비활성화 */
	.benefit-icon {
		animation: none !important;
	}
	
	/* 그림자 효과 최적화 */
	.benefit-card, .cta-button, .submit-button {
		box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1) !important;
	}
	
	/* 그라데이션 최적화 */
	.cta-button, .submit-button {
		background: #ff4200 !important;
	}
}

/* 모바일 접근성 개선 */
@media screen and (max-width: 768px) {
	/* 포커스 표시 개선 */
	.cta-button:focus,
	.submit-button:focus,
	.input_box:focus {
		outline: 3px solid #ff4200 !important;
		outline-offset: 2px !important;
	}
	
	/* 터치 피드백 */
	.cta-button:active,
	.submit-button:active {
		transform: scale(0.98) !important;
	}
	
	/* 텍스트 가독성 */
	.main-title, .sub-title, .sub-subtitle {
		text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.3) !important;
	}
}