@charset "utf-8";

/* ==========================================================================
높이기준
========================================================================== */
@media (max-height: 1080px) {
	.solution-layout {
		height: 100vh;
	}
	.solution-title-bar {
		padding-top: 15rem;
	}
}

@media (max-height: 900px) {
	.sectionSolution {
		padding: 16rem 0 0;
	}

	.solution-left {
		align-items: initial;
	}

	.solution-title-bar {
		padding-top: 0;
	}
}

/* ==========================================================================
1600px
========================================================================== */
@media (max-width: 1600px) {
	.inner,
	.solution_inner {
		max-width: 140rem;
	}
}

/* ==========================================================================
1400px
========================================================================== */
@media (max-width: 1400px) {
	/* 솔루션*/
	.solution_tit {
		font-size: 2.2rem;
	}
	.solution-layout {
		gap: 4rem;
	}

	/* 도입변화 */
	.sectionGrow .stat-card b {
		font-size: 6rem;
	}

	/* 플랜  */
	.plan-grid {
		grid-template-columns: repeat(4, 1fr);
		gap: 1.4rem;
	}
	.plan-card {
		padding: 2.8rem;
		min-height: 50rem;
	}
	.plan-card .price-wrap .now .price {
		font-size: 3.4rem;
	}

	/* 파이널 */
	.final_box .title_box h2 {
		font-size: 5.5rem;
	}
}

/* ==========================================================================
1280px
========================================================================== */
@media (max-width: 1280px) {
	/* 히어로 */
	.sectionHero .hero_tit {
		font-size: 7rem !important;
	}

	/* 솔루션*/
	.solution-scroll-container {
		display: none !important;
	}

	/* 솔루션 모바일 슬라이더 스타일 */
	.solution-slider-wrap {
		display: block;
	}

	.solution-slider-wrap .solution-title-bar {
		padding-top: 16rem;
	}

	.solution-slider {
		position: relative;
		overflow: hidden;
		touch-action: pan-y;
	}

	.solution-slide-track {
		display: flex;
		transition: transform 0.45s cubic-bezier(0.4, 0, 0.2, 1);
		will-change: transform;
	}

	.solution-slide {
		width: 100%;
		flex: 0 0 100%;
		padding: 0 2rem;
		box-sizing: border-box;
	}

	.solution-slide .slide-video-wrap {
		width: 100%;
		border-radius: 2rem;
		aspect-ratio: 16/9;
		background: #000;
		margin-bottom: 3.2rem;
		overflow: hidden;
	}

	.solution-slide .slide-video-wrap video {
		display: block;
		width: 100%;
		height: 100%;
		object-fit: cover;
	}

	.solution-slide .slide-text {
		padding: 0 0.4rem;
	}

	.solution-slide .slide-num {
		font-size: 1.8rem;
		font-weight: 700;
		color: #5890FF;
		margin-bottom: 1.2rem;
	}

	.solution-slide .slide-title-long {
		display: block;
		margin-bottom: 2.4rem;
		font-size: 3rem;
		font-weight: 700;
		line-height: 1.45;
		letter-spacing: -0.02em;
		color: #f0ede8;
		font-family: var(--font-en-tit), var(--font-ko), sans-serif;
	}

	.solution-slide .slide-desc {
		display: flex;
		width: 100%;
		gap: .8rem;
	}

	.solution-slide .slide-desc p {
		position: relative;
		width: 100%;
		height: 100%;
		padding: 2rem;
		font-size: 1.8rem;
		line-height: 1.6;
		font-weight: 600;
		color: #fff;
		border-radius: 1.6rem;
		background: #FFFFFF0D;
		z-index: 1;
		overflow: hidden;
	}

	.solution-slider-nav {
		display: flex;
		align-items: center;
		justify-content: center;
		gap: 2.4rem;
		margin-top: 4rem;
		padding-bottom: 2rem;
	}

	.solution-slider-arrow {
		display: flex;
		align-items: center;
		justify-content: center;
		width: 4.8rem;
		height: 4.8rem;
		border-radius: 50%;
		background: #FFFFFF15;
		border: 1px solid #FFFFFF25;
		color: #fff;
		cursor: pointer;
		transition: background 0.2s ease;
		flex-shrink: 0;
	}

	.solution-slider-arrow:hover {
		background: #FFFFFF30;
	}

	.solution-slider-arrow:disabled {
		opacity: 0.3;
		cursor: default;
	}

	.solution-slider-arrow svg {
		width: 2rem;
		height: 2rem;
	}

	.solution-slider-dots {
		display: flex;
		align-items: center;
		gap: 1rem;
	}

	.solution-dot {
		width: 0.8rem;
		height: 0.8rem;
		border-radius: 50%;
		background: #FFFFFF30;
		cursor: pointer;
		transition: background 0.25s ease, transform 0.25s ease;
		border: none;
		padding: 0;
	}

	.solution-dot.active {
		background: #5890FF;
		transform: scale(1.4);
	}

	.solution-slider-counter {
		display: flex;
		align-items: center;
		justify-content: center;
		min-width: 5rem;
		gap: .4rem;
		font-size: 1.5rem;
		color: #FFFFFF60;
	}

	.solution-slider-counter .current {
		color: #fff;
		font-weight: 700;
	}

	.sectionSolution .title_box {
		margin-bottom: 6rem;
	}

	.sectionSolution .end_btn {
		padding-top: 4rem;
		padding-bottom: 6rem;
	}

	.chart_list dl dt {
		flex-wrap: wrap;
	}

	:lang(en) .chart_list dl p {
		width: 100%;
		margin-right: 0;
		margin-bottom: 1.6rem;
	}
}

/* ==========================================================================
1200px
========================================================================== */
@media (max-width: 1200px) {
	html {
		font-size: 56.25%;
	}
	section {
		padding: 12rem 0;
	}

	/* Header */
	.gnb {
		gap: 3.2rem;
		font-size: 1.5rem;
	}

	/* 솔루션*/
	.solution_left {
		min-width: 32rem;
	}
	.feature_box {
		max-width: 36rem;
		padding: 2rem 2.8rem;
	}
	.feature_box .tit {
		font-size: 2.4rem;
	}

	/* 도입변화 */
	.sectionGrow .stat-card {
		padding: 3.6rem 2.8rem;
	}
	.sectionGrow .stat-card b {
		font-size: 5.6rem;
	}

	/* 플랜  */
	.plan-grid {
		grid-template-columns: repeat(2, 1fr);
		gap: 1.6rem;
	}
	.plan-card {
		min-height: auto;
	}

	/*뉴스*/
	.news-card {
		flex: 0 0 1;
		margin-right: 2.4rem;
	}

	/* 파이널 */
	.final_box .title_box h2 {
		font-size: 5rem;
	}
}

/* ==========================================================================
1024px
========================================================================== */
@media (max-width: 1024px) {
	html {
		font-size: 50%;
	}
	section {
		padding: 10rem 0;
	}
	.inner {
		padding: 0 2rem;
	}
	.mo {
		display: block;
	}
	.pc {
		display: none;
	}

	/* Header */
	.gnb {
		display: none;
	}

	/*히어로*/
	.sectionHero .hero_cont {
		padding-top: 0;
		min-height: auto;
	}

	/* 솔루션*/
	.solution_card {
		flex-direction: column;
	}
	.solution_left {
		min-width: 100%;
		flex: none;
	}
	.solution_right {
		width: 100%;
		flex: none;
	}
	.feature_box {
		max-width: 100%;
		width: 100%;
	}

	/* 도입변화 */
	.sectionGrow .stat-grid {
		grid-template-columns: 1fr;
		gap: 1.6rem;
		margin-top: 6rem;
	}
	.sectionGrow .stat-card {
		padding: 2.8rem 2rem;
	}

	/* FAQ */
	.faq_inner {
		width: 100%;
		grid-template-columns: 1fr;
		gap: 4rem;
	}

	/* Mobile Menu */
	.mobile-menu {
		--header-h: 7.2rem;
	}
	.mobile-menu a {
		padding: 1.8rem 1.6rem;
		font-size: 1.8rem;
		font-weight: 600;
	}
	.mobile-menu a:last-child {
		display: flex;
		justify-content: center;
		border-bottom: 0;
		margin-top: 1.2rem;
		padding: 1.8rem;
		background: var(--gradient-1);
		border-radius: 1.2rem;
	}

	/* 파이널 */
	.final_box .title_box h2 {
		font-size: 4.4rem;
	}
}

/* ==========================================================================
768px
========================================================================== */
@media (max-width: 768px) {
	html {
		font-size: 50%;
	}
	section {
		padding: 8rem 0;
	}
	.title_box h2 {
		font-size: 4.5rem !important;
	}
	.cont_wrap {
		margin-top: 4rem;
	}

	/* Header */
	header {
		height: 7.2rem;
	}
	.header-logo img {
		height: 3.2rem;
	}

	/*히어로*/
	.sectionHero .hero_tit {
		font-size: 7rem !important;
		word-break: keep-all;
		white-space: wrap;
	}
	.btn_wrap {
		flex-direction: column;
		align-items: center;
		gap: 1.2rem;
	}
	.btn_lg {
		width: 100%;
		max-width: fit-content;
		justify-content: center;
	}

	/* 솔루션*/
	.solution-slide .slide-desc {
		flex-direction: column;
	}

	/* 도입변화 */
	.sectionGrow .stat-grid {
		grid-template-columns: 1fr;
		gap: 1.6rem;
		margin-top: 6rem;
	}
	.sectionGrow .stat-card {
		padding: 3.6rem 2.4rem;
		border-radius: 2.4rem;
	}
	.sectionGrow .stat-card b {
		font-size: 6.4rem;
	}
	.chart_list {
		grid-template-columns: 1fr;
		gap: 1.6rem;
		margin-top: 6rem;
	}

	/*파트너 */
	.partnerSwiper {
		grid-template-columns: repeat(3, 1fr);
	}

	/*뉴스*/
	.title_box.flex {
		align-items: flex-end;
		gap: 2rem;
	}
	.news-card {
		margin-right: 2.6rem;
	}

	/* 플랜  */
	.plan-grid {
		grid-template-columns: 1fr;
		gap: 1.4rem;
	}
	.plan-card {
		min-height: auto;
		padding: 3rem;
	}
	.plan-card .price-wrap .now .price {
		font-size: 3.8rem;
	}

	/* FAQ */
	.faq-q {
		font-size: 1.8rem;
		padding: 2rem;
	}
	.faq-a {
		font-size: 1.5rem;
		padding: 0 2rem 2rem;
	}

	/* 파이널 */
	.final_box .title_box h2 {
		font-size: 3.8rem;
	}

	/* Footer */
	footer {
		padding: 4rem 2.4rem;
	}
	.footer-top {
		flex-direction: column;
		align-items: flex-start;
		gap: 2.4rem;
	}
	.footer-col {
		text-align: left;
	}
	.footer-bottom {
		margin-top: 4rem;
	}
}

/* ==========================================================================
480px
========================================================================== */
@media (max-width: 480px) {
	html {
		font-size: 46.875%;
	}
	section {
		padding: 7rem 0;
	}
	.inner {
		padding: 0 1.6rem;
	}
	.title_box h2 {
		font-size: 2.8rem;
	}

	/* Header */
	header {
		height: 6.4rem;
	}
	.header-logo img {
		height: 2.8rem;
	}

	/* 솔루션 */
	.solution_tit {
		flex-direction: column;
		align-items: flex-start;
		gap: 1rem;
		padding: 2rem;
		font-size: 1.8rem;
	}
	.feature_box {
		padding: 1.6rem 2rem;
	}
	.feature_box .tit {
		font-size: 2rem;
	}
	.solution_body .end_btn {
		flex-direction: column;
		align-items: stretch;
	}

	/* 도입변화 */
	.sectionGrow .stat-card p {
		font-size: 2.2rem;
	}
	.sectionGrow .stat-card b {
		font-size: 5.6rem;
	}
	.sectionGrow .stat-card span {
		font-size: 1.6rem;
	}

	/*뉴스*/
	.news-card .news-thumb {
		height: 28rem;
	}

	/* 플랜  */
	.plan-card .plan-name {
		font-size: 2.4rem;
	}
	.plan-card .price-wrap .now .price {
		font-size: 3.4rem;
	}
	.plan-card .feat-list li {
		font-size: 1.4rem;
	}
	.billingBtn {
		font-size: 1.4rem;
		height: 3.6rem;
		padding: 0 2.2rem;
	}

	/*파트너 */
	.partnerSwiper {
		grid-template-columns: repeat(2, 1fr);
	}

	/* FAQ */
	.faq-q {
		font-size: 1.6rem;
	}

	/* 파이널 */
	.final_box .title_box h2 {
		font-size: 3.2rem;
	}
	.sectionFinal {
		padding: 7rem 0;
	}

	/* Footer */
	footer {
		font-size: 1.3rem;
	}
	.footer-top .nav-logo {
		width: 8rem;
	}
}

/* ==========================================================================
360px
========================================================================== */

@media (max-width: 360px) {
	html {
		font-size: 43.75%;
	}

	.title_box h2 {
		font-size: 2.6rem !important;
	}

	.sectionHero .hero_tit {
		font-size: 3rem !important;
	}

	.final_box .title_box h2 {
		font-size: 2.8rem !important;
	}

	.plan-card .price-wrap .now .price {
		font-size: 3rem !important;
	}
}


@media (hover: none) {
	.btn:hover {
		transform: translateY(0);
	}

	.plan-card:hover {
		transform: translateY(0) !important;
	}

	.news-card:hover .news-thumb img {
		transform: scale(1);
	}

	.news-card:hover .btn_txt i {
		transform: translateX(0);
	}

	.btn_txt:hover i {
		transform: translateX(0);
	}
}

@media (prefers-reduced-motion: reduce) {
	.logo_track {
		animation: none;
	}

	.scroll_ani {
		animation: none;
	}

	* {
		transition-duration: 0.01ms !important;
		animation-duration: 0.01ms !important;
	}
}