/**
 * Section dlab - desktop
 */
@media (min-width: 768px) {
	.scroll_root {
		position: fixed;
		width: 100vw;
		height: 100vh;
		/* transition: 0.3s; */
		/* transition-timing-function: ease-out; */
	}
	#dlab {
		height: 100vh;
		background-color: #000000;
	}
	#dlab .slide_img_cover {
		position: relative;
	}
	#dlab .slide_img {
		position: absolute;
		left: 0;
		top: 0;
		width: 100vw;
		height: 100vh;
		object-fit: cover;
		transition: 0.4s;
	}
	#dlab .slide_img.slide2,
	#dlab .slide_img.slide3 {
		opacity: 0;
	}
	#dlab .slide_text_cover {
		position: absolute;
		top: 0;
		right: calc(100vw / 1440 * 180);
		overflow: hidden;
		width: calc(100vw / 1440 * 436);
		transition: 0.4s;
		transition-timing-function: ease-out;
	}
	#dlab .slide_text_container .slide_blank {
		height: calc(100vw / 1440 * 240);
	}
	#dlab .slide_text_container .slide_text2 {
		margin-top: calc(100vw / 1440 * 16);
		font-family: brandon-grotesque;
	}
	#dlab .slide_text_container .slide_text3 {
		margin-top: calc(100vw / 1440 * 70);
		font-family: brandon-grotesque;
		word-break: keep-all;
	}
	#dlab .slide1.slide_text_container .slide_text3 {
		font-size: calc(100vw / 1440 * 100);
		line-height: 1em;
	}
	#dlab .slide2.slide_text_container .slide_text3 {
		font-size: calc(100vw / 1440 * 54);
	}
	#dlab .slide3.slide_text_container .slide_text3 {
		font-size: calc(100vw / 1440 * 46);
	}
	#dlab .slide_text_container .slide_body {
		padding-top: calc(100vw / 1440 * 70);
		max-width: calc(100vw / 1440 * 436);
		word-break: keep-all;
		font-family: "Noto Sans KR";
		font-weight: 400;
		font-size: calc(100vw / 1440 * 21);
		line-height: 1.8em;
	}
	#banner .banner_container {
		width: 100vw;
		height: 100vh;
		background-color: black;
	}
	#banner .banner {
		width: 100vw;
		height: 100vh;
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
	}
	#banner .banner_top {
		display: flex;
		align-items: center;
		height: calc(100vw / 1440 * 125);
	}
	#banner .banner_content_left,
	#banner .banner_content_right {
		font-family: brandon-grotesque;
		font-weight: 700;
	}
	#banner .banner_content {
		width: calc(100vw / 1440 * 324);
		text-align: center;
	}
	#banner .banner1 {
		text-align: center;
		font-family: marydale;
	}
	#banner .banner2 {
		text-align: center;
		font-family: marydale;
		color: #499184;
	}
	#banner .banner5 {
		text-align: center;
		font-family: marydale;
		color: #eddf4c;
	}
	#banner .banner8 {
		text-align: center;
		font-family: marydale;
		color: #366dc8;
	}
	#banner .banner10 {
		text-align: center;
		font-family: marydale;
		color: #a764b7;
	}
	#banner .banner_img {
		width: calc(100vw / 1440 * 210);
		height: auto;
	}
	#banner .banner2,
	#banner .banner3,
	#banner .banner4,
	#banner .banner5,
	#banner .banner6,
	#banner .banner7,
	#banner .banner8,
	#banner .banner9,
	#banner .banner10 {
		display: none;
	}
	#banner .banner_bottom {
		text-align: center;
		margin-top: calc(100vw / 1440 * 120);
		color: #666666;
	}
}

/**
 * Section dlab - mobile
 */
@media (max-width: 767.98px) {
	.dlab_mobile {
		width: 100vw;
		height: 100vh;
	}

	.dlab_mobile .swiper-wrapper {
		margin: 0px;
		padding: 0px;
	}

	.dlab_mobile .swiper-slide {
		list-style: none;
		width: 100vw;
	}

	.dlab_mobile .slide {
		position: relative;
		width: 100%;
		height: 100%;
	}

	.dlab_mobile .slide_img {
		width: 100%;
		height: 100%;
		object-fit: cover;
	}

	.dlab_mobile .slide_description {
		position: absolute;
		top: 0;
		left: 0;
		display: flex;
		flex-direction: column;
		padding-left: calc(100vw / 360 * 24);
		box-sizing: border-box;
		width: 100%;
		height: 100%;
	}
	.dlab_mobile .slide_description .scroll_container {
		overflow-y: auto;
	}
	.dlab_mobile .slide_description .scroll_container::-webkit-scrollbar {
		display: none;
	}
	.dlab_mobile .slide_description .slide_blank_top {
		height: calc(100vw / 360 * 320);
	}
	.dlab_mobile .slide_description .slide_blank_bottom {
		height: calc(100vw / 360 * 100);
	}
	.dlab_mobile .slide_description .slide_text2 {
		margin-top: calc(100vw / 360 * 4);
		font-family: brandon-grotesque;
	}
	.dlab_mobile .slide_description .slide_text3 {
		font-family: brandon-grotesque;
	}
	.dlab_mobile .slide_description .slide_text4 {
		margin-top: calc(100vw / 360 * 40);
	}
	.dlab_mobile .slide_description .slide_text5 {
		margin-top: calc(100vw / 360 * 16);
	}
	.dlab_mobile .slide_description .slide_text6 {
		margin-top: calc(100vw / 360 * 16);
	}

	.dlab_mobile .swiper-pagination {
		bottom: 24px !important;
	}
	.dlab_mobile .swiper-pagination .swiper-pagination-bullet {
		width: 8px;
		height: 8px;
		background: #555555;
		border: none;
		opacity: 1;
	}
	.dlab_mobile .swiper-pagination .swiper-pagination-bullet-active {
		background: #bbbbbb !important;
	}

	.dlab_mobile .slide_gradient {
		position: absolute;
		left: 0;
		bottom: 0;
		width: 100vw;
		height: calc(100vw / 360 * 100);
		background: linear-gradient(to top, rgba(0, 0, 0, 0.8) 35.47%, rgba(0, 0, 0, 0) 96.56%);
	}

	.banner_container {
		width: 100vw;
		height: 100vh;
		background: black;
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
	}

	.banner_container .banner_title {
		font-family: brandon-grotesque;
	}
	.banner_container .banner_content {
		margin-top: calc(100vw / 360 * 20);
		height: calc(100vw / 360 * 60);
	}
	.banner_container .banner1 {
		text-align: center;
		font-family: marydale;
	}
	.banner_container .banner2 {
		text-align: center;
		font-family: marydale;
		color: #499184;
	}
	.banner_container .banner5 {
		text-align: center;
		font-family: marydale;
		color: #eddf4c;
	}
	.banner_container .banner8 {
		text-align: center;
		font-family: marydale;
		color: #366dc8;
	}
	.banner_container .banner10 {
		text-align: center;
		font-family: marydale;
		color: #a764b7;
	}
	.banner_container .banner_img {
		width: calc(100vw / 360 * 105);
		height: auto;
	}
	.banner_container .banner2,
	.banner_container .banner3,
	.banner_container .banner4,
	.banner_container .banner5,
	.banner_container .banner6,
	.banner_container .banner7,
	.banner_container .banner8,
	.banner_container .banner9,
	.banner_container .banner10 {
		display: none;
	}

	.banner_container .banner_description {
		color: #666666;
		margin-top: calc(100vw / 360 * 80);
		text-align: center;
	}
	.banner_container .banner_description:last-child {
		margin-top: calc(100vw / 360 * 16);
	}
}

/**
 * Section philosophy - desktop
 */
@media (min-width: 768px) {
	#philosophy {
		padding-top: calc(100vw / 1440 * 160);
		padding-left: calc(100vw / 1440 * 180);
		padding-right: calc(100vw / 1440 * 180);
		padding-bottom: calc(100vw / 1440 * 200);
	}

	#philosophy .title {
		font-family: brandon-grotesque;
		font-weight: 900;
		color: #111111;
	}

	#philosophy .sub_title {
		margin-top: calc(100vw / 1440 * 8);
		margin-bottom: calc(100vw / 1440 * 20);
		font-weight: 700;
		color: #555555;
	}
	#philosophy .row {
		margin-top: calc(100vw / 1440 * 96);
		display: flex;
		align-items: center;
		gap: calc(100vw / 1440 * 20);
	}
	#philosophy .row:nth-child(4) {
		gap: calc(100vw / 1440 * 91);
	}
	#philosophy .col1:not(:has(img)),
	#philosophy .col2:not(:has(img)) {
		flex: 1;
	}
	#philosophy .col_description:first-child {
		margin-top: calc(100vw / 1440 * 20);
	}
	#philosophy .col_description:not(:first-child) {
		margin-top: calc(100vw / 1440 * 20);
	}
	#philosophy .philosophy_img1,
	#philosophy .philosophy_img2,
	#philosophy .philosophy_img3 {
		width: calc(100vw / 1440 * 620);
		height: calc(100vw / 1440 * 330);
		object-fit: cover;
		border-radius: 4px;
		display: block;
	}
}

/**
 * Section philosophy - mobile
 */
@media (max-width: 767.98px) {
	.philosophy_mobile {
		padding-top: calc(100vw / 360 * 100);
		padding-bottom: calc(100vw / 360 * 60);
	}

	.philosophy_mobile .title {
		font-family: brandon-grotesque;
		margin-left: calc(100vw / 360 * 24);
	}
	.philosophy_mobile .sub_title {
		margin-left: calc(100vw / 360 * 24);
	}

	.philosophy_mobile .row {
		margin-left: calc(100vw / 360 * 24);
		margin-bottom: calc(100vw / 360 * 40);
	}

	.philosophy_mobile .philosophy_img {
		margin-top: calc(100vw / 360 * 40);
		width: 100vw;
		height: auto;
		object-fit: cover;
	}
	.philosophy_mobile .row_title {
		margin-top: calc(100vw / 360 * 32);
	}
	.philosophy_mobile .row_description {
		margin-top: calc(100vw / 360 * 16);
	}
}

/**
 * Section manifesto - desktop
 */
@media (min-width: 768px) {
	#manifesto {
		position: relative;
		width: 100vw;
		height: calc(100vw / 1440 * 1240);
	}

	#manifesto .video_background {
		position: absolute;
		width: 100vw;
		height: calc(100vw / 1440 * 1240);
		left: 0;
		top: 0;
		object-fit: cover;
	}

	#manifesto .content {
		position: absolute;
		width: 100vw;
		left: 0;
		top: 50%;
		transform: translateY(-50%);
		z-index: 10;
		padding-left: calc(100vw / 1440 * 240);
	}
	#manifesto .title_container {
		display: flex;
	}
	#manifesto .title {
		font-family: brandon-grotesque;
	}
	#manifesto .sub_title {
		margin-left: calc(100vw / 1440 * 20);
	}

	#manifesto .separator_top {
		margin-top: calc(100vw / 1440 * 70);
		width: calc(100vw / 1440 * 530);
		height: 1px;
		background-color: #f74902;
	}
	#manifesto .separator_bottom {
		width: calc(100vw / 1440 * 530);
		margin-top: calc(100vw / 1440 * 32);
		height: 1px;
		background-color: #f74902;
	}

	#manifesto .page_content {
		box-sizing: border-box;
		overflow: hidden;
	}
	#manifesto .page {
		width: calc(100vw / 1440 * 530);
	}
	#manifesto .page_title {
		padding-top: calc(100vw / 1440 * 48);
		height: calc(100vw / 1440 * 192);
		font-family: brandon-grotesque;
	}
	#manifesto .page_navigation {
		margin-top: calc(100vw / 1440 * 10);
		margin-left: calc(100vw / 1440 * 456.67);
		display: flex;
	}
	#manifesto .prev_page {
		width: calc(100vw / 1440 * 9.88);
		height: calc(100vw / 1440 * 16);
		cursor: pointer;
	}
	#manifesto .next_page {
		margin-left: calc(100vw / 1440 * 38.89);
		width: calc(100vw / 1440 * 9.88);
		height: calc(100vw / 1440 * 16);
		cursor: pointer;
	}
	#manifesto .swiper-slide {
		opacity: 0;
		transition: opacity 200ms linear;
	}
	#manifesto .swiper-slide.swiper-slide-active {
		opacity: 1;
		transition: opacity 200ms linear;
	}
}

/**
 * Section manifesto - mobile
 */
@media (max-width: 767.98px) {
	.manifesto_mobile {
		width: 100vw;
		background-color: #111111;
		padding-top: calc(100vw / 360 * 94);
		padding-bottom: calc(100vw / 360 * 80);
	}
	.manifesto_mobile .title {
		font-family: brandon-grotesque;
		margin-left: calc(100vw / 360 * 24);
	}
	.manifesto_mobile .sub_title {
		margin-left: calc(100vw / 360 * 24);
	}
	.manifesto_mobile .content {
		margin-top: calc(100vw / 360 * 40);
		width: calc(100vw / 360 * 360);
		height: calc(100vw / 360 * 340);
		background-image: url("../images/about/mobile_7-belief.jpg");
		background-size: cover;
	}

	.manifesto_mobile .swiper-wrapper {
		margin: 0px;
		padding: 0px;
	}
	.manifesto_mobile .swiper-slide {
		list-style: none;
		width: 100vw;
	}
	.manifesto_mobile .slide {
		position: relative;
		width: 100%;
		height: 100%;
		padding-top: calc(100vw / 360 * 60);
		padding-left: calc(100vw / 360 * 24);
	}
	.manifesto_mobile .slide .page_title {
		font-family: brandon-grotesque;
		height: calc(100vw / 360 * 126);
	}
	.manifesto_mobile .slide .page_description {
		margin-top: calc(100vw / 360 * 16);
	}
	.manifesto_mobile .swiper-pagination {
		bottom: 32px !important;
	}
	.manifesto_mobile .swiper-pagination .swiper-pagination-bullet {
		width: 8px;
		height: 8px;
		background: #555555;
		border: none;
		opacity: 1;
	}
	.manifesto_mobile .swiper-pagination .swiper-pagination-bullet-active {
		background: #bbbbbb !important;
	}

	.manifesto_mobile .content_bottom {
		padding-left: calc(100vw / 360 * 24);
		padding-right: calc(100vw / 360 * 24);
		padding-top: calc(100vw / 360 * 32);
		box-sizing: border-box;
	}
}

@keyframes hover-opacity {
	from {
		opacity: 0;
	}
	to {
		opacity: 1;
	}
}

/**
 * Section business - desktop
 */
@media (min-width: 768px) {
	#business {
		padding-top: calc(100vw / 1440 * 160);
		padding-left: calc(100vw / 1440 * 240);
		padding-right: calc(100vw / 1440 * 240);
		padding-bottom: calc(100vw / 1440 * 100);
	}
	#business .title {
		font-family: brandon-grotesque;
		color: #111111;
		text-align: center;
	}
	#business .sub_title {
		color: #555555;
		text-align: center;
	}
	#business .content {
		margin-top: calc(100vw / 1440 * 80);
	}
	#business .row {
		display: flex;
	}
	#business .row:not(:first-child) {
		margin-top: calc(100vw / 1440 * 16);
	}
	#business .col:last-child {
		margin-left: calc(100vw / 1440 * 16);
	}
	#business .col {
		width: calc(100vw / 1440 * 473);
		height: calc(100vw / 1440 * 310);
	}
	#business .card {
		position: relative;
		display: flex;
		flex-direction: column;
		width: 100%;
		height: 100%;
		border-radius: 4px;
		box-sizing: border-box;
	}
	#business .card_content {
		position: absolute;
		left: calc(100vw / 1440 * 40);
		top: calc(100vw / 1440 * 29);
	}
	#business .card.card1 {
		background-image: url("../images/about/8-business.jpg");
		background-size: cover;
	}
	#business .card.card2 {
		background-image: url("../images/about/9-business.jpg");
		background-size: cover;
	}
	#business .card.card3 {
		background-image: url("../images/about/10-business.jpg");
		background-size: cover;
	}
	#business .card.card4 {
		background-image: url("../images/about/11-business.jpg");
		background-size: cover;
	}
	#business .card.card5 {
		background-image: url("../images/about/12-business.jpg");
		background-size: cover;
	}
	#business .card.card6 {
		background-image: url("../images/about/13-business.jpg");
		background-size: cover;
	}
	#business .card::before {
		content: '';
		position: absolute;
		width: 100%;
		height: 100%;
		left: 0;
		top: 0;
		border-radius: 4px;
		background: linear-gradient(to bottom, rgba(0, 0, 0, 0.667) 0%, rgba(0, 0, 0, 0) 66.7%);
		pointer-events: none;
	}
	#business .card:hover::before {
		opacity: 0;
	}
	#business .card_title {
		margin-top: calc(100vw / 1440 * 8);
	}
	#business .card:hover .card_hover {
		display: block;
		animation: hover-opacity 0.5s;
	}
	#business .card_hover {
		display: none;
		position: absolute;
		width: 100%;
		height: 100%;
		left: 0;
		top: 0;
		background: rgba(247, 73, 2, 0.5);
		backdrop-filter: blur(24px);
		box-sizing: border-box;
		border-radius: 4px;
	}
	#business .hover_content {
		position: absolute;
		left: calc(100vw / 1440 * 40);
		top: calc(100vw / 1440 * 29);
		padding-right: calc(100vw / 1440 * 37);
	}
	#business .card_hover_description {
		margin-top: calc(100vw / 1440 * 8);
	}
}

/**
 * Section business - mobile
 */
@media (max-width: 767.98px) {
	.business_mobile {
		width: 100vw;
		padding-top: calc(100vw / 360 * 100);
	}
	.business_mobile .title {
		font-family: brandon-grotesque;
		margin-left: calc(100vw / 360 * 24);
	}
	.business_mobile .sub_title {
		margin-left: calc(100vw / 360 * 24);
	}
	.business_mobile .content {
		margin-top: calc(100vw / 360 * 40);
		width: calc(100vw / 360 * 360);
		height: calc(100vw / 360 * 360);
	}

	.business_mobile .swiper-wrapper {
		margin: 0px;
		padding: 0px;
	}
	.business_mobile .swiper-slide {
		list-style: none;
		width: 100vw;
	}
	.business_mobile .slide {
		position: relative;
		width: 100%;
		height: 100%;
		padding-top: calc(100vw / 360 * 24);
		padding-left: calc(100vw / 360 * 24);
		padding-right: calc(100vw / 360 * 24);
		box-sizing: border-box;
	}
	.business_mobile .slide_content {
		position: relative;
	}
	.business_mobile .slide_overlay {
		position: absolute;
		width: 100%;
		height: 100%;
		left: 0;
		top: 0;
		z-index: 2;
		background: rgba(247, 73, 2, 0.5);
		backdrop-filter: blur(24px);
		box-sizing: border-box;
		opacity: 0;
		pointer-events: none;
		transition: opacity 0.5s;
	}
	.business_mobile .slide.touched .slide_overlay {
		opacity: 1;
		pointer-events: auto;
	}
	.business_mobile .slide_overlay .overlay_content {
		padding-top: calc(100vw / 360 * 24);
		padding-left: calc(100vw / 360 * 24);
		padding-right: calc(100vw / 360 * 24);
	}
	.business_mobile .slide_overlay .overlay_description {
		margin-top: calc(100vw / 360 * 8);
		word-break: keep-all;
	}
	.business_mobile .slide.slide1 {
		background-image: url("../images/about/mobile_8-business.jpg");
		background-size: cover;
	}
	.business_mobile .slide.slide2 {
		background-image: url("../images/about/mobile_9-business.jpg");
		background-size: cover;
	}
	.business_mobile .slide.slide3 {
		background-image: url("../images/about/mobile_10-business.jpg");
		background-size: cover;
	}
	.business_mobile .slide.slide4 {
		background-image: url("../images/about/mobile_11-business.jpg");
		background-size: cover;
	}
	.business_mobile .slide.slide5 {
		background-image: url("../images/about/mobile_12-business.jpg");
		background-size: cover;
	}
	.business_mobile .slide.slide6 {
		background-image: url("../images/about/mobile_13-business.jpg");
		background-size: cover;
	}
	.business_mobile .slide::before {
		content: '';
		position: absolute;
		width: 100%;
		height: 100%;
		left: 0;
		top: 0;
		background: linear-gradient(to bottom, rgba(0, 0, 0, 0.667) 0%, rgba(0, 0, 0, 0) 66.7%);
		pointer-events: none;
	}
	.business_mobile .slide.touched::before {
		opacity: 0;
	}
	.business_mobile .slide .page_title {
		margin-top: calc(100vw / 360 * 4);
	}
	.business_mobile .swiper-pagination {
		bottom: 32px !important;
	}
	.business_mobile .swiper-pagination .swiper-pagination-bullet {
		width: 8px;
		height: 8px;
		background: #555555;
		border: none;
		opacity: 1;
	}
	.business_mobile .swiper-pagination .swiper-pagination-bullet-active {
		background: #bbbbbb !important;
	}

	.modal_container {
		display: none;
	}

	.business_modal {
		position: fixed;
		width: 100vw;
		height: 100vh;
		left: 0;
		top: 0;
		background: rgba(17, 17, 17, 0.4);
		backdrop-filter: blur(2px);
		z-index: 1000;

		padding-left: calc(100vw / 360 * 24);
		padding-right: calc(100vw / 360 * 24);
		box-sizing: border-box;

		display: flex;
		align-items: center;
	}

	.business_modal .modal_body {
		position: relative;
		width: 100%;
		height: auto;
		background: rgba(255, 255, 255, 0.8);
		backdrop-filter: blur(60px);
		border-radius: 4px;

		padding-top: calc(100vw / 360 * 60);
		padding-bottom: calc(100vw / 360 * 20);
		padding-left: calc(100vw / 360 * 20);
		padding-right: calc(100vw / 360 * 20);
		box-sizing: border-box;
	}
	.business_modal .modal_close {
		width: calc(100vw / 360 * 24);
		height: calc(100vw / 360 * 24);
		position: absolute;
		top: calc(100vw / 360 * 20);
		right: calc(100vw / 360 * 20);
	}
	.business_modal .modal_content {
		display: none;
	}
	.business_modal .modal_content .description {
		word-break: keep-all;
		height: calc(100vw / 360 * 156);
		display: flex;
		align-items: flex-end;
	}
	.business_modal .modal_content .modal_title {
		margin-top: calc(100vw / 360 * 4);
	}
}