@charset "utf-8";
.main { overflow: hidden; }


/* Main Visual */
.main-visual { position: relative; height: 100vh; background: linear-gradient(270deg, #E4ECFE 0%, #FBFCFF 100%); overflow: hidden; }
.main-visual .main-visual-bg { position: absolute; left:50%; top:50%; transform: translate(-50%,-50%); height: 80%; aspect-ratio: 905/839; background: url('/images/main/main_visual_bg.png') no-repeat center/contain; }
.main-visual .inner { height: 100%; display: flex; align-items: center; justify-content: center; padding-top: 3rem; text-align: center; }
.main-visual h2 { font-size: 11rem; line-height: 1.1; font-weight: 500; }
.main-visual h2 span { background: var(--gradient-color); background-clip: text; -webkit-background-clip: text; color: transparent; }
.main-visual p { max-width: 582px; margin: 3.4rem auto 9rem; font-size: var(--font-size-4); font-weight: 300; }
.main-visual .main-visual-buttons { display: flex; justify-content: center; gap:1.5rem; }
.main-visual .main-visual-buttons a:nth-child(1) { background: white; }
.main-visual .main-visual-buttons a:nth-child(1):hover { background: var(--main-black); }
.main-visual .main-visual-buttons a:nth-child(1):hover::after { filter: saturate(0) brightness(10); }
.main-visual .main-visual-buttons a .trans-x-box > span::after { color:white; }
.main-visual .main-visual-buttons a:nth-child(2) { background: var(--gradient-color); color:white; }
.main-visual .main-visual-buttons a:nth-child(2)::after { filter: saturate(0) brightness(10); }
.main-visual .main-visual-buttons a:nth-child(2)::before { content: ''; z-index: -1; position: absolute; left:0; top:0; width: 100%; height: 100%; background: #00000033; opacity: 0; transition: .3s ease-in-out; }
.main-visual .main-visual-buttons a:nth-child(2):hover::before { opacity: 1; }


/* Consulting Section */
.consulting-section { z-index: 1; position: relative; padding:0 22px; }
.consulting-section .h3-wrap span { color:white; }
.consulting-section .h3-wrap span::before { filter: saturate(0) brightness(10); }
.consulting-section::before { content: ''; z-index: -1; position: absolute; left:0; top:0; width:100%; height:10rem; background: linear-gradient(270deg, #E4ECFE 0%, #FBFCFF 100%); }
.consulting-section .consulting-inner { z-index: 1; position: relative; display: flex; align-items: center; justify-content: center; padding: 16rem 0; border-radius: 3.2rem; background: #0B1A40; color:white; text-align: center; overflow: hidden; }
.consulting-section .consulting-bg { z-index: -1; position: absolute; left:50%; top:50%; transform: translate(-50%,-50%); height: 100%; aspect-ratio: 1096/894; border-radius: 50%; background: radial-gradient(50% 50% at 50% 50%, #293D9590 0%, #293D9500 100%); }
.consulting-section .consulting-content { max-width: 1437px; width: 92%; }
.consulting-section .description { max-width: 74.4rem; margin: 2.6rem auto 7.7rem; font-size: var(--font-size-4); font-weight: 300; }
.consulting-section .swiper-container { overflow: visible; }
.consulting-section li * { cursor:none; }
.consulting-section li { z-index: 1; position: relative; height: auto; background: #FFFFFF0D; border-radius: 3rem; overflow: hidden; transition: .6s ease-in-out; }
.consulting-section li a { display: block; padding: 4.2rem 1rem 7.7rem; height: 100%; }
.consulting-section li::before { z-index: -1; content: ""; position: absolute; inset: 0; padding: 1px; border-radius: 3rem; background: linear-gradient(140deg, #FFFFFF -13%, rgba(255, 255, 255, 0) 40%); -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0); -webkit-mask-composite: xor; mask-composite: exclude; background-size: 300%; background-position: 90% 90%; transition: .6s ease-in-out; }
.consulting-section li:hover { transform: translateY(-20px); }
.consulting-section li:hover::before { background-position: 0; }
.consulting-section dt { margin-top: 6px; font-size: var(--font-size-3); font-weight: 600; }
.consulting-section dd { margin-top: 1.6rem; font-size: var(--font-size-5); }
.consulting-section .consulting-cursor { z-index: 3; position: absolute; left: 0; top:0; display: flex; align-items: center; gap:5px; height: 4.8rem; padding: 0 3rem; background: var(--gradient-color); color:white; font-size: var(--font-size-5); border-radius: 5rem; transform: scale(0.8); opacity: 0; pointer-events: none;}
.consulting-section .consulting-cursor::after { content: ''; display: block; width: 2.2rem; aspect-ratio: 1/1; background: url('/images/common/btn_arw.svg') no-repeat center/contain; filter: saturate(0) brightness(10); }


/* Solution Section */
.solution-section { z-index: 1; position: relative; padding: 17rem 0; text-align: center; }
.solution-section .inner::before { content: ''; position: absolute; right:-5%; top:-20rem; width: 20rem; aspect-ratio: 200/255; background: url('/images/main/main_deco_1.png') no-repeat center/contain; pointer-events: none; animation: float 3s ease-in-out infinite; }
.solution-section .description { margin: 2.6rem auto 7rem; font-size: var(--font-size-4); color:var(--sub-black); }
.solution-section .solution-list ul { display: flex; gap: 24px; } 
.solution-section .solution-list li { flex: 1; }
.solution-section dt { margin: 2.8rem 0 1.2rem; font-size: var(--font-size-3); font-weight: 600; line-height: 1.25; }
.solution-section dd { line-height: 1.25; color:var(--sub-black); font-size: var(--font-size-4); }
.solution-section .icon { width: 8.8rem; margin:0 auto; aspect-ratio: 1/1; transition: .4s ease-out; }
.solution-section li:nth-child(1) .icon { background: url('/images/main/main_solution_1.png') no-repeat center/contain; }
.solution-section li:nth-child(1):hover .icon { background: url('/images/main/main_solution_1_h.png') no-repeat center/contain; }
.solution-section li:nth-child(2) .icon { background: url('/images/main/main_solution_2.png') no-repeat center/contain; }
.solution-section li:nth-child(2):hover .icon { background: url('/images/main/main_solution_2_h.png') no-repeat center/contain; }
.solution-section li:nth-child(3) .icon { background: url('/images/main/main_solution_3.png') no-repeat center/contain; }
.solution-section li:nth-child(3):hover .icon { background: url('/images/main/main_solution_3_h.png') no-repeat center/contain; }
.solution-section li:nth-child(4) .icon { background: url('/images/main/main_solution_4.png') no-repeat center/contain; }
.solution-section li:nth-child(4):hover .icon { background: url('/images/main/main_solution_4_h.png') no-repeat center/contain; }

@keyframes float {
	0% { transform: translateY(0px); }
	50% { transform: translateY(-15px); }
	100% { transform: translateY(0px); }
}

/* Redefining Section */
#redefining-img-1-1 { left:14%; top:31%; color:var(--sub-black); font-size: max(.8vw, 8px); }
/* #redefining-img-1-3 { left:16%; top:65%; width: 51%; backdrop-filter: blur(3px); } */
#redefining-img-2-1 { left:28.8%; top:12.8%; display: flex; flex-direction: column; justify-content: space-between; width: 45%; aspect-ratio: 307/159; }
#redefining-img-2-1 p { display: flex; align-items: center; gap:6px; height: 25%; padding: 0; }
#redefining-img-2-1 span { height: 60%; border-radius: 0 max(.4vw, 4px) max(.4vw, 4px) 0; }
#redefining-img-2-1 p:nth-child(1) span { width: 81%; background: linear-gradient(90deg, rgba(209, 224, 255, 0.7) 0%, rgba(21, 94, 239, 0.7) 100%); }
#redefining-img-2-1 p:nth-child(2) span { width: 62%; background: linear-gradient(90deg, rgba(209, 224, 255, 0.3) 0%, rgba(21, 94, 239, 0.3) 100%); }
#redefining-img-2-1 p:nth-child(3) span { width: 16%; background: linear-gradient(90deg, rgba(209, 224, 255, 0.1) 0%, rgba(21, 94, 239, 0.1) 100%); }
#redefining-img-2-1 b { flex-shrink: 0; font-size: max(.6vw, 7px); }
#redefining-img-2-3 { width: 4%; top:70%; left:60%; }
#redefining-img-3-1 { animation: float2 3s ease-in-out infinite; animation-delay: 1.5s; }
#redefining-img-3-2 { animation: float2 3s ease-in-out infinite; }
#redefining-img-3-3 { left:45%; top:auto; bottom:1%; width: 19%; }
#redefining-img-4-4 { width: 5.5%; top:80%; left:60%; rotate: -13deg; }
#redefining-img-4-4 img { max-width: none; }

@keyframes float2 {
	0% { transform: translateY(0px); }
	50% { transform: translateY(-5px); }
	100% { transform: translateY(0px); }
}


/* Impact Section */
.impact-section { position: relative; padding: 17rem 0 10rem; background: #fff; } 
.impact-section .inner { overflow: visible; }
.impact-section .inner::before { content: ''; position: absolute; left:-5%; top:-25rem; width: 16.4rem; aspect-ratio: 164/170; background: url('/images/main/main_deco_2.png') no-repeat center/contain; pointer-events: none; animation: float 3s ease-in-out infinite; }
.impact-section .impact-content { display: flex; }
.impact-section .impact-content .impact-left { flex: 1; }
.impact-section .impact-content .impact-left .description { max-width: 35rem; margin-top: 2.5rem; font-size: var(--font-size-4); color:var(--sub-black) }
.impact-section .impact-content .impact-right { display: flex; position: relative; padding-top: 6.6rem; } 

.trusted-by { position: relative; margin-top: 10rem; }
.trusted-by::before { z-index: 1; content: ''; position: absolute; left:50%; bottom:0; transform: translateX(-50%); width:100vw; height: 6rem; background: linear-gradient(90deg, rgba(255, 255, 255, 1) 2%, rgba(255, 255, 255, 0) 10%, rgba(255, 255, 255, 0) 90%, rgba(255, 255, 255, 1) 98%); pointer-events: none; }
.trusted-by h4 { font-size: var(--font-size-4); font-weight: 400; }
.trusted-by-logos ul { display: flex;  margin-top: 3rem; }
.trusted-by-logos li { height: 6rem; padding: 0 6.3rem; flex-shrink: 0; }
.trusted-by-logos li img { width: auto; height: 100%; }


/* Text Section */
.text-section { z-index: 1; position: relative; padding: 7rem 0; }
.text-section .circle { width: 100%; height: 100vh; margin:0 auto; aspect-ratio: 1/1; background: radial-gradient(50% 50% at 50% 50%, #155EEF 0%, rgba(21, 94, 239, 0.00) 100%); border-radius: 50%; opacity: .05; }
.text-section .text-1 { z-index: 2; position: absolute; left:50%; transform: translateX(-50%); bottom:50%; font-size: 20rem; font-weight: 600; line-height: .9; text-transform: uppercase; white-space: nowrap; color:#EDF4FFCC; text-align: center; }
.text-section .text-2 { z-index: 2; position: absolute; left:50%; transform: translateX(-50%); top:50%; font-size: 20rem; font-weight: 600; line-height: .9; text-transform: uppercase; white-space: nowrap; color:transparent; background: linear-gradient(180deg, #99A8EF 0%, #155EEF 100%); background-clip: text; -webkit-background-clip: text; text-align: center; }


@media screen and (max-width:1600px){
	.consulting-section dd br { display: none; }
}
@media screen and (max-width:1200px){
	.text-section .text-1 { font-size: 15rem; }
	.text-section .text-2 { font-size: 15rem; }
	
	.main-visual .main-visual-bg { height: 60%; }
	.main-visual h2 { font-size: 60px; }
	.main-visual p { max-width: 322px; }
	
	.consulting-section .consulting-inner { padding: 12rem 0; }
	.consulting-section li .icon { width: 200px; margin: 0 auto; }
	.consulting-section li a { padding: 3.2rem 2rem 6.4rem; }
	
	.solution-section .inner::before { width: 14rem; }
	.solution-section { padding: 12rem 0; }
	.solution-section .solution-list ul { gap:2rem; }
	
	.impact-section .inner::before { width: 12rem; }
	.impact-section .impact-content { flex-wrap:wrap; }
	.impact-section .impact-content .impact-right { width: 100%; justify-content: right; }
	.impact-section { padding: 12rem 0 10rem; }

	.trusted-by-logos li { padding: 0 3rem; }
}
@media screen and (max-width:1024px){
	.text-section .text-1 { font-size: 80px; }
	.text-section .text-2 { font-size: 80px; }

	.solution-section .solution-list ul { flex-wrap:wrap; gap:4rem 2rem; }
	.solution-section .solution-list li { flex:auto; width: calc((100% - 2rem)/2); }

	.trusted-by-logos li { padding: 0 2rem; }
}
@media screen and (max-width:768px){
	.main-visual .main-visual-bg { width: 92%; max-width: 400px; height: auto; }
	.main-visual h2 { max-width: 300px; margin:0 auto; font-size: 50px; }
	.main-visual p { margin-top: 16px; margin-bottom: 46px; }
	.main-visual .inner { padding-top: 200px; }
	.main-visual .inner > div { width: 100%; }
	.main-visual .main-visual-buttons { padding: 0 7px; gap:14px; }

	.consulting-section { padding: 0; }
	.consulting-section .consulting-inner { padding: 80px 0 100px; border-radius: 20px; }
	.consulting-section .description { margin: 20px auto 45px; }
	.consulting-section .swiper-container { width: 90%; margin:0 auto; }
	.consulting-section li:hover { transform: translateY(0px); }
	.consulting-section li::before { background-position: 0; }
	.consulting-section li a { padding: 6px 2rem 35px; }
	.consulting-section dd { margin-top: 8px; }

	.solution-section { padding: 80px 0; }
	.solution-section .inner::before { width: 80px; right:20px; top:-120px; }
	.solution-section .description { margin: 20px 0 40px; }
	.solution-section .solution-list ul { gap:38px 0; max-width: 320px; margin: 0 auto; }
	.solution-section .solution-list li { width: 100%; display: flex; align-items: center; gap:24px; text-align: left; }
	.solution-section .solution-list li .icon { width: 44px; flex-shrink: 0; margin: 0; }
	.solution-section .solution-list li dt { margin-top: 0; margin-bottom: 8px; }

	.impact-section { padding: 70px 0; }
	.impact-section .inner::before { width: 74px; left:20px; top:-100px; }
	.impact-section .impact-content .impact-left .description { margin-top: 14px; }
	.impact-section .impact-content .impact-right { display: block; padding-top: 16px; }

	.trusted-by { margin-top: 70px; }
	.trusted-by-logos li { padding: 0 25px; }

	.text-section { padding: 0; }
}