/*스타일*/

body {
	transition: 1s ease;
	background: #000;
}
body.fade-in {
	opacity: 0;
	transition-duration: 0s;
	animation: fadeIn 1s ease both;
}
body.fade-out {
	opacity: 0;
	/* animation: fadeOut 1s ease both; */
}
body.fade-in.fade-out {
	opacity: 1;
	transition-duration: 0.5s;
}
body.moving-out {
	opacity: 1;
	transition-duration: 1s;
}
body.moving-in {
	opacity: 1;
	transition-duration: 0s;
	animation: movingFadeIn 1s ease both;
}
body.moving-fade-out {
	opacity: 0;
	transition-duration: 0.5s;
}
/* body.theme--white {
	background: #fff;
} */

body.active {
	background: #001;
	transition-duration: 0.5s;
}

@keyframes fadeIn {
	0% {
		opacity: 0;
	}
	100% {
		opacity: 1;
	}
}

@keyframes fadeOut {
	0% {
		opacity: 1;
	}
	100% {
		opacity: 0;
	}
}

@keyframes movingFadeIn {
	0% {
		opacity: 1;
	}
	100% {
		opacity: 1;
	}
}

/*인트로*/
.intro {
	width: 100%;
	height: var(--nvh);
	display: flex;
	align-items: center;
	justify-content: center;
	background-color: #000;
	/* background: linear-gradient(
				to bottom,
				transparent 28px,
				rgba(255, 255, 255, 0.05) 28px
			)
			0 0 / 100vw 30px repeat-y,
		linear-gradient(to right, transparent 28px, rgba(255, 255, 255, 0.05) 28px)
			0 0 / 30px var(--nvh) repeat-x black; */
	position: relative;
	overflow: hidden;
}
.intro .intro-wrap {
	width: 100%;
}
.intro .intro-wrap h1 {
	width: 80px;
	height: 60px;
	background: url(/img/com/logo.svg) center no-repeat;
	background-size: cover;
	font-size: 0;
	margin: 0 auto;
}
.intro .intro-wrap .loading-wrap {
	width: 100%;
	max-width: 400px;
	margin: 0 auto;
	margin-top: var(--gap-40);
}
.intro .intro-wrap .loading-wrap .loading {
	width: 100%;
	height: 3px;
	background: rgba(255, 255, 255, 0.3);
	position: relative;
}
.intro .intro-wrap .loading-wrap .loading .bar {
	height: 100%;
	background: var(--white);
	position: absolute;
	left: 0;
	top: 0;
	animation: loading 1s linear both;
}
.intro a {
	width: 100%;
	height: 100%;
	position: absolute;
	left: 0;
	top: 0;
}

@keyframes loading {
	0% {
		width: 0%;
	}
	100% {
		width: 100%;
	}
}

/*메인*/
.main {
	width: 100%;
	height: var(--nvh);
	position: relative;
	visibility: hidden;
	overflow: hidden;
}
.main.active {
	visibility: visible;
}

.main .main-intro {
	width: 100%;
	height: var(--nvh);
	display: flex;
	align-items: center;
	justify-content: center;
	visibility: hidden;
	opacity: 0;
	position: absolute;
	z-index: 10;
	background: rgba(0, 0, 0, 1);
}
.main .main-intro .main-intro-wrap {
	width: 100%;
	text-align: center;
}
.main .main-intro .main-intro-wrap .conts {
	text-align: center;
	font-size: var(--font-24);
	color: var(--white);
	font-weight: 600;
}
.main .main-intro.active {
	animation: mainIntro 5s ease-in-out both;
}
.main .main-intro.mo {
	z-index: 90;
}

@keyframes mainIntro {
	0% {
		visibility: hidden;
		z-index: 90;
		opacity: 0;
		background: rgba(0, 0, 0, 1);
	}
	60% {
		visibility: visible;
		z-index: 90;
		opacity: 1;
	}
	100% {
		visibility: hidden;
		z-index: 1;
		opacity: 0;
		background: rgba(0, 0, 0, 0);
	}
}

.main .map {
	width: 100%;
	height: 100%;
	position: relative;
}
.main .map .map-box {
	width: 100%;
	height: 100%;
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	transition: 2s ease;
}
.main .map .map-box > span {
	display: block;
	width: 100%;
	height: 100%;
	position: relative;
}
.main .map .map-box span > img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
}

.main .map .map-box svg {
	width: 100%;
	height: 100%;
}
.main .map .map-box svg a {
	position: relative;
	z-index: 20;
}
.main .map .map-box svg .link {
	opacity: 0;
	fill: #ffffff;
}
.main .map .map-box svg .gnb-pin .basic-pin {
	visibility: visible;
	opacity: 1;
	transition: 0.5s ease;
}
.main .map .map-box svg .gnb-pin .basic-pin .round {
	opacity: 0.65;
}
.main .map .map-box svg .gnb-pin .basic-pin .round-stroke {
	fill: none;
	stroke: #ffffff;
	stroke-miterlimit: 10;
}
.main .map .map-box svg .gnb-pin .basic-pin .title-txt {
	fill: #ffffff;
	font-family: var(--Pretendard);
	font-size: 20px;
}
.main .map .map-box svg .gnb-pin .basic-pin .icon-more {
	fill: #ffffff;
}
.main .map .map-box svg .gnb-pin .hover-pin {
	visibility: hidden;
	opacity: 0;
	transition: 1s ease;
}
.main .map .map-box svg .gnb-pin .hover-pin .round {
	opacity: 0.5;
}
.main .map .map-box svg .gnb-pin .hover-pin .round-stroke {
	fill: none;
	stroke: #ffffff;
	stroke-miterlimit: 1;
	opacity: 0.7;
}
.main .map .map-box svg .gnb-pin .hover-pin .hover-conts {
	/*fill:#FFFFFF;*/
	fill: none;
}
.main .map .map-box svg .gnb-pin .hover-pin .title-txt {
	font-family: var(--Pretendard);
	font-size: 25px;
	fill: #ffffff;
}
.main .map .map-box svg .gnb-pin .hover-pin .icon-more {
	fill: #ffffff;
}

.main .map .map-box svg .gnb-pin.expand .basic-pin {
	visibility: hidden;
	opacity: 0;
}
.main .map .map-box svg .gnb-pin.expand .hover-pin {
	visibility: visible;
	opacity: 1;
}
.main .map .map-box svg .gnb-pin.hide {
	display: none;
}
.main .map .map-box svg > * {
	transition: 1s ease;
}
.main .map .map-box .map-basic {
	position: relative;
	z-index: 1;
}
.main .map.active .map-box svg .gnb-pin {
	visibility: hidden;
	opacity: 0;
	transform: translateY(30px);
	animation: gnbPinUp 0.7s 0.7s ease both;
}

.main .map .map-box svg .on-area .on-img {
	visibility: hidden;
	opacity: 0;
}
.main .map .map-box svg .on-area .on-img.active {
	visibility: visible;
	opacity: 1;
}

.main .main-contents {
	width: 100%;
	height: 100%;
	position: relative;
	z-index: 2;
}
.main .main-contents > .wrap {
	width: 100%;
	height: 100%;
	position: relative;
}
.main .main-contents .main-area {
	width: 100%;
	height: 100%;
	position: relative;
	z-index: 10;
}
.main .main-contents .main-area .map .map-box.off {
	z-index: 2;
}
.main .main-contents .main-area .map .map-box.on {
	z-index: 1;
	visibility: hidden;
}
.main .main-contents .main-area .map .map-box.on svg {
	display: none;
}

.main .main-contents .main-area .map.active .map-box.off {
	opacity: 0;
	z-index: 2;
	visibility: hidden;
}
.main .main-contents .main-area .map.active .map-box.on {
	visibility: visible;
}
.main .main-contents .main-area .map.active .map-box.on svg {
	display: block;
}

/*.title-area .title-box {width:fit-content; height:200px; position:absolute; font-family:var(--NotoSerif); font-size:120px; letter-spacing:-3px; color:var(--white); font-weight:600; z-index:50; line-height:1; display:flex; align-items:center; overflow:hidden; visibility:hidden; opacity:1;}
.title-area .title-box span {display:block; opacity:0; transform:translateY(100%); transition:1s ease;}
.title-area .title-box.active {visibility:visible; opacity:1;}
.title-area .title-box.active span {opacity:1; transform:translateY(0);}
.title-area .title-box.hide {display:none;}
.title-area .title-box[data-id="interior"] {left:10%; top:calc(var(--nvh) * 0.30);}
.title-area .title-box[data-id="about"] {left:50%; justify-content:center; bottom:calc(var(--nvh) * 0.15); transform:translateX(-50%);}
.title-area .title-box[data-id="architecture"] {right:10%; top:calc(var(--nvh) * 0.35);}
.title-area .title-box[data-id="sm"] {left:50%; top:calc(var(--nvh) * 0.50); transform:translateX(-50%);}
.title-area .title-box[data-id="interior-index"] {left:8%; top:calc(var(--nvh) * 0.45);}*/

.title-wrap .title-box {
	transform: translateY(50px);
	opacity: 0;
	transition: 1s ease;
	position: relative;
	z-index: 10;
}
.title-wrap .title-box .title {
	fill: #ffffff;
	font-family: var(--KoPub);
	font-size: 130px;
	font-weight: 700;
}
.title-wrap .title-box.active {
	transform: translateY(0);
	opacity: 1;
}

.depth-title-area {
	opacity: 0;
	visibility: hidden;
	transition: 1s ease;
}
.depth-title-area.active {
	opacity: 1;
	visibility: visible;
}
.depth-title-area.hide {
	display: none;
}
.depth-title-wrap .main-title {
	fill: #ffffff;
	font-family: var(--Pretendard);
	font-size: 130px;
	font-weight: 700;
	letter-spacing: -0.03em;
}
.depth-title-wrap .sub-title {
	fill: #ffffff;
	font-family: var(--Exo2);
	font-size: 100px;
	font-weight: 600;
	letter-spacing: -0.05em;
}
.depth-title-wrap .sub-title .sp-0 {
	letter-spacing: 0;
}
.depth-title-wrap .conts {
	fill: #ffffff;
	font-family: var(--Pretendard);
	font-size: 20px;
	font-weight: 500;
	letter-spacing: -0.05em;
}
.outline-txt {
	visibility: hidden;
}
.outline-txt .outline {
	fill: none;
	stroke: rgba(255, 255, 255, 0.6);
	stroke-miterlimit: 10;
}

.moving-area {
	width: 100%;
	height: var(--nvh);
	position: absolute;
	left: 0;
	top: 0;
	z-index: 50;
	visibility: hidden;
	opacity: 0;
	transition: 1s ease;
}
.moving-area .moving-wrap {
	width: 100%;
	height: 100%;
}
.moving-area .moving-wrap .moving-box {
	width: 100%;
	height: 100%;
	position: absolute;
	left: 0;
	top: 0;
	visibility: hidden;
	opacity: 0;
	transition: 1s ease;
}
.moving-area .moving-wrap .moving-box span {
	display: block;
	width: 100%;
	height: 100%;
	position: relative;
}
.moving-area .moving-wrap .moving-box span video {
	width: 100%;
	height: 100%;
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	object-fit: cover;
}

.moving-area.active {
	visibility: visible;
	opacity: 1;
}
.moving-area.active .moving-wrap .moving-box.active {
	visibility: visible;
	opacity: 1;
}
/*.moving-area.hide {z-index:0;}*/

@keyframes gnbPinUp {
	0% {
		visibility: hidden;
		opacity: 0;
		transform: translateY(30px);
	}
	100% {
		visibility: visible;
		opacity: 1;
		transform: translateY(0);
	}
}

.depth-area.hide {
	display: none;
}

.depth-1 {
	width: 100%;
	height: var(--nvh);
	position: absolute;
	left: 0;
	top: 0;
	z-index: 0;
	visibility: hidden;
	opacity: 0;
	transition: 1s ease;
}
.depth-1.active {
	z-index: 20;
	visibility: visible;
	opacity: 1;
}
.depth-1 > .wrap {
	width: 100%;
	height: 100%;
	position: relative;
}
.depth-1 .depth-conts {
	width: 100%;
	height: 100%;
	position: relative;
	z-index: 10;
}
.depth-1 .btn-back {
	height: 50px;
	width: fit-content;
	background: #fff;
	padding: 0 20px;
	position: absolute;
	left: 0;
	bottom: 20px;
}

.depth-2 {
	width: 100%;
	height: var(--nvh);
	position: absolute;
	left: 0;
	top: 0;
	z-index: 0;
	visibility: hidden;
	opacity: 0;
	transition: 1s ease;
}
.depth-2.active {
	z-index: 30;
	visibility: visible;
	opacity: 1;
}
.depth-2 > .wrap {
	width: 100%;
	height: 100%;
	position: relative;
}
.depth-2 .depth-conts {
	width: 100%;
	height: 100%;
	position: relative;
	z-index: 10;
}
.depth-2 .btn-back {
	height: 50px;
	width: fit-content;
	background: #fff;
	padding: 0 20px;
	position: absolute;
	left: 0;
	bottom: 20px;
}

/************************** contents  **************************/

.contents {
	width: 100%;
}
.contents section {
	width: 100%;
	position: relative;
}

@keyframes fadeIn {
	0% {
		opacity: 0;
	}
	100% {
		opacity: 1;
	}
}

/************************** about us **************************/

.about-us {
	visibility: hidden;
	opacity: 0;
	transition: visibility 1s ease-in-out, opacity 1s ease-in-out;
}
.about-us.active {
	visibility: visible;
	opacity: 1;
}

.about-us .section-1 {
	overflow: hidden;
}
.about-us .section-1 > .wrap {
	width: 100%;
}
.about-us .section-1 .intro-conts-wrap {
	width: 100%;
	height: var(--nvh);
}
.about-us .section-1 .intro-conts-wrap .bg {
	width: 100%;
	height: 100%;
	position: absolute;
	left: 0;
	top: 0;
	z-index: 1;
}
.about-us .section-1 .intro-conts-wrap .bg span {
	display: block;
	width: 100%;
	height: 100%;
	position: relative;
}
.about-us .section-1 .intro-conts-wrap .bg span img {
	display: block;
	width: 100%;
	height: 100%;
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	object-fit: cover;
	object-position: right center;
	z-index: 0;
}
.about-us .section-1 .intro-conts-wrap .bg span:after {
	content: '';
	width: 100%;
	height: 100%;
	background: rgba(0, 0, 0, 0.5);
	position: absolute;
	left: 0;
	top: 0;
	z-index: 1;
}

.about-us .section-1 .intro-conts-wrap .intro-conts {
	width: 100%;
	height: 100%;
	position: relative;
	z-index: 2;
	display: flex;
	align-items: center;
	justify-content: center;
}
.about-us .section-1 .intro-conts-wrap .intro-conts .conts-wrap {
	width: 100%;
	padding-bottom: 10vh;
}
.about-us
	.section-1
	.intro-conts-wrap
	.intro-conts
	.conts-wrap
	.conts-box
	.text-row {
	display: flex;
	justify-content: center;
	opacity: 0;
}
.about-us
	.section-1
	.intro-conts-wrap
	.intro-conts
	.conts-wrap
	.conts-box
	.text-row
	span {
	font-family: var(--Poppins);
	font-size: 200px;
	color: var(--white);
	line-height: 1;
	position: relative;
	opacity: 0;
}
.about-us
	.section-1
	.intro-conts-wrap
	.intro-conts
	.conts-wrap
	.conts-box
	.sub-text-row {
	display: flex;
	justify-content: center;
}
.about-us
	.section-1
	.intro-conts-wrap
	.intro-conts
	.conts-wrap
	.conts-box
	.sub-text-row
	span {
	font-size: 50px;
	color: var(--white);
	font-weight: 500;
	opacity: 0;
	transform-origin: 50% 50%;
	animation: aboutIntroSubTextAni 1.3s ease-in-out both;
}
.about-us
	.section-1
	.intro-conts-wrap
	.intro-conts
	.conts-wrap
	.conts-box
	.sub-text-row
	span
	i {
	font-style: normal;
}

.about-us
	.section-1
	.intro-conts-wrap
	.intro-conts
	.conts-wrap
	.conts-box
	.text-row.ani-lr {
	transform: translateX(200px);
	animation: aboutIntroAniLR 1s ease-in-out both;
}
.about-us
	.section-1
	.intro-conts-wrap
	.intro-conts
	.conts-wrap
	.conts-box
	.text-row.ani-lr
	span {
	transform: translateX(100px);
	animation: aboutIntroTextAniLR 1.2s ease-in-out both;
}
.about-us
	.section-1
	.intro-conts-wrap
	.intro-conts
	.conts-wrap
	.conts-box
	.text-row.ani-lr
	span:nth-child(1) {
	animation-delay: 0;
}
.about-us
	.section-1
	.intro-conts-wrap
	.intro-conts
	.conts-wrap
	.conts-box
	.text-row.ani-lr
	span:nth-child(2) {
	animation-delay: 0.15s;
}
.about-us
	.section-1
	.intro-conts-wrap
	.intro-conts
	.conts-wrap
	.conts-box
	.text-row.ani-lr
	span:nth-child(3) {
	animation-delay: 0.3s;
}
.about-us
	.section-1
	.intro-conts-wrap
	.intro-conts
	.conts-wrap
	.conts-box
	.text-row.ani-lr
	span:nth-child(4) {
	animation-delay: 0.45s;
}
.about-us
	.section-1
	.intro-conts-wrap
	.intro-conts
	.conts-wrap
	.conts-box
	.text-row.ani-lr
	span:nth-child(5) {
	animation-delay: 0.6s;
}

.about-us
	.section-1
	.intro-conts-wrap
	.intro-conts
	.conts-wrap
	.conts-box
	.text-row.ani-rl {
	transform: translateX(-200px);
	animation: aboutIntroAniRL 1s ease-in-out both;
}
.about-us
	.section-1
	.intro-conts-wrap
	.intro-conts
	.conts-wrap
	.conts-box
	.text-row.ani-rl
	span {
	transform: translateX(-100px);
	animation: aboutIntroTextAniRL 1.2s ease-in-out both;
}
.about-us
	.section-1
	.intro-conts-wrap
	.intro-conts
	.conts-wrap
	.conts-box
	.text-row.ani-rl
	span:nth-child(1) {
	animation-delay: 0.15s;
}
.about-us
	.section-1
	.intro-conts-wrap
	.intro-conts
	.conts-wrap
	.conts-box
	.text-row.ani-rl
	span:nth-child(2) {
	animation-delay: 0;
}

.about-us
	.section-1
	.intro-conts-wrap
	.intro-conts
	.conts-wrap
	.conts-box
	.sub-text-row
	span:nth-child(1) {
	transform: translate(120px, 50px) rotate(-120deg) rotateY(-5deg)
		rotateX(-140deg) scale(0.6, 0.6);
}
.about-us
	.section-1
	.intro-conts-wrap
	.intro-conts
	.conts-wrap
	.conts-box
	.sub-text-row
	span:nth-child(2) {
	transform: translate(160px, 70px) rotate(105deg) rotateY(-12deg)
		rotateX(91deg) scale(0.77, 0.77);
}
.about-us
	.section-1
	.intro-conts-wrap
	.intro-conts
	.conts-wrap
	.conts-box
	.sub-text-row
	span:nth-child(3) {
	transform: translate(200px, 90px) rotate(-15deg) rotateY(19deg)
		rotateX(-168deg) scale(1.2, 1.2);
}
.about-us
	.section-1
	.intro-conts-wrap
	.intro-conts
	.conts-wrap
	.conts-box
	.sub-text-row
	span:nth-child(5) {
	transform: translate(240px, 110px) rotate(23deg) rotateY(-142deg)
		rotateX(-67deg) scale(0.7, 0.7);
}
.about-us
	.section-1
	.intro-conts-wrap
	.intro-conts
	.conts-wrap
	.conts-box
	.sub-text-row
	span:nth-child(6) {
	transform: translate(280px, 130px) rotate(-46deg) rotateY(-117deg)
		rotateX(-107deg) scale(1.3, 1.3);
}
.about-us
	.section-1
	.intro-conts-wrap
	.intro-conts
	.conts-wrap
	.conts-box
	.sub-text-row
	span:nth-child(7) {
	transform: translate(320px, 150px) rotate(-164deg) rotateY(126deg)
		rotateX(59deg) scale(1.5, 1.5);
}
.about-us
	.section-1
	.intro-conts-wrap
	.intro-conts
	.conts-wrap
	.conts-box
	.sub-text-row
	span:nth-child(8) {
	transform: translate(360px, 170px) rotate(-41deg) rotateY(-72deg)
		rotateX(-136deg) scale(0.66, 0.66);
}
.about-us
	.section-1
	.intro-conts-wrap
	.intro-conts
	.conts-wrap
	.conts-box
	.sub-text-row
	span:nth-child(9) {
	transform: translate(400px, 190px) rotate(-157deg) rotateY(-134deg)
		rotateX(103deg) scale(1.4, 1.4);
}

.about-us
	.section-1
	.intro-conts-wrap
	.intro-conts
	.conts-wrap
	.conts-box
	.logo-box {
	width: 60%;
	max-width: 450px;
	margin: 0 auto;
	animation: logoBoxAni 1s ease-in-out 1.2s both;
	opacity: 0;
}
.about-us
	.section-1
	.intro-conts-wrap
	.intro-conts
	.conts-wrap
	.conts-box
	.logo-box
	span {
	display: block;
	width: 100%;
	height: 0;
	padding-bottom: calc(485 / 640 * 100%);
	position: relative;
}
.about-us
	.section-1
	.intro-conts-wrap
	.intro-conts
	.conts-wrap
	.conts-box
	.logo-box
	span
	img {
	display: block;
	width: 100%;
	height: 100%;
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	object-fit: cover;
}

.about-us .section-1 .intro-conts-wrap .down {
	width: var(--n-80);
	height: var(--n-80);
	background: url(/img/conts/icon_arrow_down.svg) center no-repeat;
	background-size: cover;
	position: absolute;
	left: 50%;
	bottom: 2vh;
	transform: translateX(-50%);
	z-index: 3;
	animation: fadeIn 0.7s 0.8s ease-in-out both;
}

@keyframes aboutIntroAniLR {
	0% {
		transform: translateX(200px);
		opacity: 0;
	}
	100% {
		transform: translateX(0);
		opacity: 1;
	}
}

@keyframes aboutIntroTextAniLR {
	0% {
		transform: translateX(100px);
		opacity: 0;
	}
	100% {
		transform: translateX(0);
		opacity: 1;
	}
}

@keyframes aboutIntroAniRL {
	0% {
		transform: translateX(-200px);
		opacity: 0;
	}
	100% {
		transform: translateX(0);
		opacity: 1;
	}
}

@keyframes aboutIntroTextAniRL {
	0% {
		transform: translateX(-100px);
		opacity: 0;
	}
	100% {
		transform: translateX(0);
		opacity: 1;
	}
}

@keyframes aboutIntroSubTextAni {
	0% {
		opacity: 0;
	}
	100% {
		transform: translate(0px, 0px) rotate(0deg) rotateY(0deg) rotateX(0deg)
			scale(1, 1);
		opacity: 1;
	}
}

@keyframes logoBoxAni {
	0% {
		opacity: 0;
	}
	100% {
		opacity: 1;
	}
}

@media screen and (max-width: 1280px) {
	.about-us
		.section-1
		.intro-conts-wrap
		.intro-conts
		.conts-wrap
		.conts-box
		.text-row
		span {
		font-size: 150px;
	}
	.about-us
		.section-1
		.intro-conts-wrap
		.intro-conts
		.conts-wrap
		.conts-box
		.sub-text-row
		span {
		font-size: 42px;
	}
	.about-us .section-1 .intro-conts-wrap .down {
		width: var(--n-60);
		height: var(--n-60);
	}
}

@media screen and (max-width: 768px) {
	.about-us .section-1 .intro-conts-wrap .bg span img {
		object-position: right 10% top 0;
	}

	.about-us
		.section-1
		.intro-conts-wrap
		.intro-conts
		.conts-wrap
		.conts-box
		.text-row
		span {
		font-size: 100px;
	}
	.about-us
		.section-1
		.intro-conts-wrap
		.intro-conts
		.conts-wrap
		.conts-box
		.sub-text-row
		span {
		font-size: 36px;
	}
}

@media screen and (max-width: 480px) {
	.about-us .section-1 .intro-conts-wrap .bg span img {
		object-position: right 17% top 0;
	}

	.about-us
		.section-1
		.intro-conts-wrap
		.intro-conts
		.conts-wrap
		.conts-box
		.text-row
		span {
		font-size: 70px;
	}
	.about-us
		.section-1
		.intro-conts-wrap
		.intro-conts
		.conts-wrap
		.conts-box
		.sub-text-row
		span {
		font-size: 24px;
	}
}

.about-us .section-2 {
	position: relative;
	height: var(--nvh);
	overflow: hidden;
}
.about-us .section-2 > .wrap {
	width: 100%;
	height: var(--nvh);
}
.about-us .section-2 .img-box {
	width: 30%;
	max-width: 550px;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	z-index: 0;
}
.about-us .section-2 .img-box span {
	display: block;
	width: 100%;
}
.about-us .section-2 .img-box span img {
	display: block;
	max-width: 100%;
	margin: 0 auto;
}
.about-us .section-2 .main-title {
	position: absolute;
	z-index: 10;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: 100%;
}
.about-us .section-2 .main-title .title-row {
	width: 80%;
	margin: 0 auto;
	text-align: center;
	font-size: 60px;
	font-weight: 700;
	color: var(--white);
	line-height: 1.2;
	letter-spacing: -5px;
}

@media screen and (max-width: 1280px) {
	.about-us .section-2 .main-title .title-row {
		font-size: 42px;
	}
}

@media screen and (max-width: 1024px) {
	.about-us .section-2 .main-title .title-row {
		font-size: var(--font-40);
	}
}

@media screen and (max-width: 480px) {
	.about-us .section-2 .img-box {
		width: 40%;
	}
}

.about-us .section-3 {
	position: relative;
	background: #000;
}
.about-us .section-3 .sec-conts-wrap {
	width: 100%;
	position: relative;
}
.about-us .section-3 .sec-conts-wrap .layout-container {
	width: 100%;
	display: flex;
}
.about-us .section-3 .sec-conts-wrap .layout-container > * {
	width: 50%;
}
.about-us .section-3 .sec-conts-wrap .layout-container .layout-conts-wrap {
	height: calc(var(--nvh) * 5);
	position: relative;
}
.about-us
	.section-3
	.sec-conts-wrap
	.layout-container
	.layout-conts-wrap
	.conts-wrap {
	width: 100%;
	height: var(--nvh);
	overflow: hidden;
	position: sticky;
	top: 0;
}
.about-us
	.section-3
	.sec-conts-wrap
	.layout-container
	.layout-conts-wrap
	.conts-wrap
	.conts-box {
	width: 100%;
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	text-align: center;
	position: absolute;
	left: 0;
	top: 0;
	padding: var(--gap-32);
}
.about-us
	.section-3
	.sec-conts-wrap
	.layout-container
	.layout-conts-wrap
	.conts-wrap
	.conts-box
	.conts {
	font-size: 60px;
	letter-spacing: -1px;
	color: var(--white);
	opacity: 0;
	transition: opacity 0.5s ease-in-out;
}
.about-us
	.section-3
	.sec-conts-wrap
	.layout-container
	.layout-conts-wrap
	.conts-wrap
	.conts-box
	.conts
	p {
	font-weight: 200;
}
.about-us
	.section-3
	.sec-conts-wrap
	.layout-container
	.layout-conts-wrap
	.conts-wrap
	.conts-box
	.conts
	span {
	font-weight: 800;
}
.about-us
	.section-3
	.sec-conts-wrap
	.layout-container
	.layout-conts-wrap
	.conts-wrap
	.conts-box.active
	.conts {
	opacity: 1;
}

.about-us
	.section-3
	.sec-conts-wrap
	.layout-container
	.layout-wrap
	.layout-box
	.img-box {
	width: 100%;
	height: var(--nvh);
	position: relative;
	overflow: hidden;
}
.about-us
	.section-3
	.sec-conts-wrap
	.layout-container
	.layout-wrap
	.layout-box
	.img-box
	.img-wrap {
	width: 100%;
	height: 100%;
	position: absolute;
	left: 0;
	top: 0;
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	background-attachment: fixed;
	transform-origin: center;
}
.about-us
	.section-3
	.sec-conts-wrap
	.layout-container
	.layout-wrap
	.layout-box
	.conts-box {
	display: none;
}

.about-us
	.section-3
	.sec-conts-wrap
	.layout-container
	.layout-wrap
	.layout-box:nth-child(1)
	.img-box
	.img-wrap {
	background-image: url(/img/conts/aboutus_sec_03_img_01.png);
}
.about-us
	.section-3
	.sec-conts-wrap
	.layout-container
	.layout-wrap
	.layout-box:nth-child(2)
	.img-box
	.img-wrap {
	background-image: url(/img/conts/aboutus_sec_03_img_02.png);
}
.about-us
	.section-3
	.sec-conts-wrap
	.layout-container
	.layout-wrap
	.layout-box:nth-child(3)
	.img-box
	.img-wrap {
	background-image: url(/img/conts/aboutus_sec_03_img_03.png);
}
.about-us
	.section-3
	.sec-conts-wrap
	.layout-container
	.layout-wrap
	.layout-box:nth-child(4)
	.img-box
	.img-wrap {
	background-image: url(/img/conts/aboutus_sec_03_img_04.png);
}
.about-us
	.section-3
	.sec-conts-wrap
	.layout-container
	.layout-wrap
	.layout-box:nth-child(5)
	.img-box
	.img-wrap {
	background-image: url(/img/conts/aboutus_sec_03_img_05.png);
}

@media screen and (max-width: 1280px) {
	.about-us
		.section-3
		.sec-conts-wrap
		.layout-container
		.layout-conts-wrap
		.conts-wrap
		.conts-box
		.conts {
		font-size: 42px;
	}
}

@media screen and (max-width: 1024px) {
	.about-us .section-3 .sec-conts-wrap .layout-container {
		display: block;
		position: relative;
	}
	.about-us .section-3 .sec-conts-wrap .layout-container > * {
		width: 100%;
	}
	.about-us .section-3 .sec-conts-wrap .layout-container .layout-conts-wrap {
		position: absolute;
		left: 0;
		top: 0;
		z-index: 100;
	}
	.about-us
		.section-3
		.sec-conts-wrap
		.layout-container
		.layout-conts-wrap
		.conts-wrap
		.conts-box
		.conts {
		font-size: var(--font-40);
		text-shadow: 0 0 20px rgba(0, 0, 0, 0.8);
	}
}

.about-us .section-4 {
	overflow: hidden;
	height: var(--nvh);
}
.about-us .section-4 .reveal-conts-wrap {
	width: 100%;
	max-width: 700px;
	margin: 0 auto;
	padding: 0 var(--gap-40);
	height: var(--nvh);
	display: flex;
	align-items: center;
	position: relative;
}
.about-us .section-4 .reveal-conts-wrap .conts-box {
	width: 100%;
}
.about-us .section-4 .reveal-conts-wrap .conts-box .reveal-type {
	font-size: calc(0px + 9.8vw);
	letter-spacing: calc(0.3vw * -1);
	-webkit-text-stroke-width: 2px;
	-webkit-text-stroke-color: var(--white);
	color: transparent;
	font-weight: 700;
}
.about-us .section-4 .reveal-conts-wrap .conts-box .reveal-type .blank {
	display: inline-block;
	width: calc(100vw - ((9.8vw * 8.5) + (0.03vw * 8)));
	height: 2px;
}
.about-us .section-4 .reveal-conts-wrap .conts-box .txt-row {
	font-size: 60px /*calc(0px + 9.8vw)*/; /*letter-spacing:calc(0.3vw * -1);*/
	font-weight: 700;
	color: var(--white);
	opacity: 0;
	transition: 0.5s ease-in-out;
}
.about-us .section-4 .reveal-conts-wrap .conts-box .txt-row.lf {
	transform: translateX(-100%);
}
.about-us .section-4 .reveal-conts-wrap .conts-box .txt-row.rt {
	text-align: right;
	transform: translateX(100%);
}
.about-us .section-4 .reveal-conts-wrap .conts-box .txt-row.active {
	opacity: 1;
	transform: translateX(0);
}

@media screen and (max-width: 1280px) {
	.about-us .section-4 .reveal-conts-wrap .conts-box .reveal-type {
		font-size: calc(0px + 9vw);
	}
	.about-us .section-4 .reveal-conts-wrap .conts-box .txt-row {
		font-size: 42px;
	}
}

@media screen and (max-width: 1024px) {
	.about-us .section-4 .reveal-conts-wrap .conts-box .txt-row {
		font-size: var(--font-40);
	}
}

@media screen and (max-width: 648px) {
	/*.about-us .section-4 .reveal-conts-wrap .conts-box .reveal-type,
	.about-us .section-4 .reveal-conts-wrap .conts-box .txt-row {font-size:calc(0px + 8.2vw); letter-spacing:calc(0.2vw * -1); -webkit-text-stroke-width:1px;}
	.about-us .section-4 .reveal-conts-wrap .conts-box .reveal-type .blank,
	.about-us .section-4 .reveal-conts-wrap .conts-box .txt-row .blank {width:calc(100vw - ((8.2vw * 10) + (0.02vw * 8)));}*/
	.about-us .section-4 .reveal-conts-wrap .conts-box .reveal-type {
		font-size: calc(0px + 8.2vw);
		letter-spacing: calc(0.2vw * -1);
		-webkit-text-stroke-width: 1px;
	}
	.about-us .section-4 .reveal-conts-wrap .conts-box .reveal-type .blank,
	.about-us .section-4 .reveal-conts-wrap .conts-box .txt-row .blank {
		width: calc(100vw - ((8.2vw * 10) + (0.02vw * 8)));
	}
}

.about-us .section-5 {
	width: 100%;
}
.about-us .section-5 > .wrap {
	width: 100%;
	height: 100%;
}
.about-us .section-5 .values-wrap .layout-wrap {
	width: 100%;
	display: flex;
	gap: 120px;
}
.about-us .section-5 .values-wrap .layout-wrap > * {
	width: calc((100% - 120px) / 2);
}
.about-us .section-5 .values-wrap .layout-wrap .card-wrap .card-box {
	width: 100%;
	height: var(--nvh);
	display: flex;
	align-items: center;
}
.about-us
	.section-5
	.values-wrap
	.layout-wrap
	.card-wrap
	.card-box
	.card-inner {
	width: 60%;
	max-width: 500px;
}
.about-us
	.section-5
	.values-wrap
	.layout-wrap
	.card-wrap
	.card-box
	.card-inner
	img {
	max-width: 100%;
}
.about-us
	.section-5
	.values-wrap
	.layout-wrap
	.card-wrap
	.card-box
	.hidden-box {
	display: none;
}
.about-us .section-5 .values-wrap .layout-wrap .conts-wrap {
	height: calc(var(--nvh) * 4);
	position: relative;
}
.about-us .section-5 .values-wrap .layout-wrap .conts-wrap .conts-container {
	width: 100%;
	height: var(--nvh);
	overflow: hidden;
	position: sticky;
	top: 0;
}
.about-us .section-5 .values-wrap .layout-wrap .conts-wrap .conts-box {
	width: 100%;
	height: var(--nvh);
	display: flex;
	align-items: center;
	justify-content: flex-end;
	text-align: right;
	color: var(--white);
	position: absolute;
	left: 0;
	top: 0;
	background: var(--black);
	opacity: 0;
}
.about-us .section-5 .values-wrap .layout-wrap .conts-wrap .conts-box .conts {
	overflow: hidden;
	display: flex;
	align-items: center;
}
.about-us
	.section-5
	.values-wrap
	.layout-wrap
	.conts-wrap
	.conts-box
	.conts
	> .inner {
	transform: translateY(100%);
	transition: transform 0.7s ease-in-out;
}
.about-us
	.section-5
	.values-wrap
	.layout-wrap
	.conts-wrap
	.conts-box
	.conts
	span {
	display: block;
	font-family: var(--Poppins);
	color: var(--gray-9);
	font-size: var(--font-30);
	font-weight: 200;
}
.about-us .section-5 .values-wrap .layout-wrap .conts-wrap .conts-box .conts p {
	font-size: 80px;
	letter-spacing: -2px;
	font-weight: 500;
}
.about-us .section-5 .values-wrap .layout-wrap .conts-wrap .conts-box.active {
	opacity: 1;
}
.about-us
	.section-5
	.values-wrap
	.layout-wrap
	.conts-wrap
	.conts-box.active
	.conts
	> .inner {
	transform: translateY(0);
}

@media screen and (max-width: 1024px) {
	.about-us .section-5 .values-wrap .layout-wrap {
		gap: 80px;
	}
	.about-us .section-5 .values-wrap .layout-wrap > * {
		width: calc((100% - 80px) / 2);
	}
	.about-us
		.section-5
		.values-wrap
		.layout-wrap
		.conts-wrap
		.conts-box
		.conts
		p {
		font-size: 62px;
	}
}

@media screen and (max-width: 768px) {
	.about-us .section-5 .values-wrap .layout-wrap {
		gap: 60px;
	}
	.about-us .section-5 .values-wrap .layout-wrap > * {
		width: calc((100% - 60px) / 2);
	}
	.about-us
		.section-5
		.values-wrap
		.layout-wrap
		.conts-wrap
		.conts-box
		.conts
		p {
		font-size: 40px;
	}
}

@media screen and (max-width: 480px) {
	.about-us .section-5 .values-wrap .layout-wrap {
		gap: 0;
		flex-wrap: wrap;
	}
	.about-us .section-5 .values-wrap .layout-wrap > * {
		width: 100%;
	}
	.about-us .section-5 .values-wrap .layout-wrap .card-wrap {
		position: relative;
		z-index: 1;
	}
	.about-us .section-5 .values-wrap .layout-wrap .card-wrap .card-box {
		justify-content: center;
		position: relative;
	}
	.about-us
		.section-5
		.values-wrap
		.layout-wrap
		.card-wrap
		.card-box
		.hidden-box {
		display: block;
		width: 100%;
		height: 100%;
		position: absolute;
		left: 0;
		top: 0;
		color: var(--white);
	}
	.about-us
		.section-5
		.values-wrap
		.layout-wrap
		.card-wrap
		.card-box
		.hidden-box
		.conts-box {
		width: 100%;
		height: 100%;
		display: flex;
		align-items: flex-end;
		justify-content: flex-end;
		padding-bottom: calc(var(--nvh) * 0.3);
	}
	.about-us
		.section-5
		.values-wrap
		.layout-wrap
		.card-wrap
		.card-box
		.hidden-box
		.conts-box
		.conts {
		padding: 0 var(--gap-32);
		overflow: hidden;
	}
	.about-us
		.section-5
		.values-wrap
		.layout-wrap
		.card-wrap
		.card-box
		.hidden-box
		.conts-box
		.conts
		> .inner {
		transform: translateY(100%);
		transition: transform 0.7s ease-in-out;
	}
	.about-us
		.section-5
		.values-wrap
		.layout-wrap
		.card-wrap
		.card-box
		.hidden-box
		.conts-box
		.conts
		span {
		display: block;
		font-size: var(--font-24);
		color: var(--gray-9);
		font-weight: 200;
	}
	.about-us
		.section-5
		.values-wrap
		.layout-wrap
		.card-wrap
		.card-box
		.hidden-box
		.conts-box
		.conts
		p {
		font-size: 28px;
		font-weight: 500;
	}
	.about-us
		.section-5
		.values-wrap
		.layout-wrap
		.card-wrap
		.card-box
		.hidden-box.active
		.conts-box
		.conts
		> .inner {
		transform: translateY(0);
	}
	.about-us .section-5 .values-wrap .layout-wrap .conts-wrap {
		display: none;
	}
}

.about-us .section-6 {
	width: 100%;
	height: var(--nvh);
	overflow: hidden;
}
.about-us .section-6 > .wrap {
	width: 90%;
	max-width: 1600px;
	margin: 0 auto;
	height: 100%;
}
.about-us .section-6 .operation-wrap {
	width: 100%;
	height: 100%;
	color: var(--white);
	position: relative;
	display: flex;
	align-items: center;
	justify-content: space-between;
}
.about-us .section-6 .operation-wrap > * {
	flex: 1;
}
.about-us .section-6 .operation-wrap .shape-wrap {
	display: flex;
	align-items: center;
	justify-content: center;
	position: relative;
	width: 100%;
	height: 100%;
}
.about-us .section-6 .operation-wrap .shape-wrap .shape-conts-wrap {
	display: flex;
	align-items: center;
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
}
.about-us .section-6 .operation-wrap .shape-wrap .shape-box {
	width: 280px;
	height: 270px;
	display: flex;
	align-items: center;
	justify-content: center;
	background: url(/img/conts/pentagon.png) center no-repeat;
	background-size: 100% auto;
}
.about-us .section-6 .operation-wrap .shape-wrap .shape-box.type-B {
	background-image: url(/img/conts/plus.svg);
}
.about-us .section-6 .operation-wrap .shape-wrap .shape-box .conts {
	width: 100%;
	text-align: center;
	font-size: 40px;
	font-weight: 700;
	padding-top: 10%;
	opacity: 0;
}
.about-us .section-6 .operation-wrap .conts-wrap {
	display: none;
}
.about-us .section-6 .operation-wrap .conts-wrap .conts-box .conts {
	font-size: var(--font-80);
	font-weight: 200;
	letter-spacing: -1px;
	text-align: right;
}
.about-us .section-6 .operation-wrap .conts-wrap .conts-box .conts span {
	font-weight: 800;
}

@media screen and (max-width: 1600px) {
	.about-us .section-6 .operation-wrap .shape-wrap .shape-box {
		width: 220px;
		height: 212px;
	}
	.about-us .section-6 .operation-wrap .shape-wrap .shape-box .conts {
		font-size: 32px;
	}
}

@media screen and (max-width: 1280px) {
	.about-us .section-6 .operation-wrap .shape-wrap .shape-box {
		width: 180px;
		height: 174px;
	}
	.about-us .section-6 .operation-wrap .shape-wrap .shape-box .conts {
		font-size: 24px;
	}
}

@media screen and (max-width: 1024px) {
	.about-us .section-6 .operation-wrap {
		flex-direction: column;
	}
	.about-us .section-6 .operation-wrap .shape-wrap {
		height: calc(var(--nvh) / 2);
		align-items: flex-end;
		padding: var(--gap-32) 0;
	}
	.about-us .section-6 .operation-wrap .conts-wrap {
		height: calc(var(--nvh) / 2);
		padding: var(--gap-32) 0;
	}
	.about-us .section-6 .operation-wrap .conts-wrap .conts-inner {
		height: 100%;
		display: flex;
		justify-content: center;
	}
	.about-us .section-6 .operation-wrap .conts-wrap .conts-box .conts {
		text-align: center;
	}
}

@media screen and (max-width: 648px) {
	.about-us .section-6 .operation-wrap .shape-wrap .shape-box {
		width: 150px;
		height: 145px;
	}
	.about-us .section-6 .operation-wrap .shape-wrap .shape-box .conts {
		font-size: 18px;
	}
}

@media screen and (max-width: 480px) {
	.about-us .section-6 .operation-wrap .shape-wrap .shape-box {
		width: 100px;
		height: 96px;
	}
	.about-us .section-6 .operation-wrap .shape-wrap .shape-box .conts {
		font-size: 12px;
	}
}

.about-us .section-7 {
	width: 100%;
	padding: var(--gap-40) 0;
}
.about-us .section-7 > .wrap {
	width: 90%;
	max-width: 1600px;
	margin: 0 auto;
	min-height: var(--nvh);
	display: flex;
	align-items: center;
	justify-content: center;
}
.about-us .section-7 .work-wrap {
	width: 100%;
	color: var(--white);
}
.about-us .section-7 .work-wrap .top-txt {
	width: 100%;
	font-size: var(--font-80);
	font-weight: 700;
	letter-spacing: -1px;
	font-weight: 200;
	text-align: center;
}
.about-us .section-7 .work-wrap .top-txt .txt em {
	font-weight: 800;
}
.about-us .section-7 .work-wrap .icon-container {
	width: 100%;
	margin: var(--gap-80) 0 calc(var(--gap-40) * 3) 0;
}
.about-us .section-7 .work-wrap .icon-container .icon-wrap {
	margin-top: 10px;
	display: flex;
	justify-content: center;
}
.about-us .section-7 .work-wrap .icon-container .icon-wrap:first-child {
	margin-top: 0;
}
.about-us .section-7 .work-wrap .icon-container .icon-wrap .icon-box {
	width: 280px;
	height: 280px;
	border-radius: 50%;
	background: #171717;
	box-shadow: 0 0 30px rgba(0, 0, 0, 1);
	margin: 0 -10px;
	display: flex;
	align-items: center;
	justify-content: center;
	text-align: center;
}
.about-us .section-7 .work-wrap .icon-container .icon-wrap .icon-box .icon {
	display: block;
	width: 100px;
	height: 100px;
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
}
.about-us
	.section-7
	.work-wrap
	.icon-container
	.icon-wrap
	.icon-box
	.icon.finance {
	background-image: url(/img/conts/aboutus_sec_07_icon_01.svg);
}
.about-us
	.section-7
	.work-wrap
	.icon-container
	.icon-wrap
	.icon-box
	.icon.legal {
	background-image: url(/img/conts/aboutus_sec_07_icon_02.svg);
}
.about-us
	.section-7
	.work-wrap
	.icon-container
	.icon-wrap
	.icon-box
	.icon.audit {
	background-image: url(/img/conts/aboutus_sec_07_icon_03.svg);
}
.about-us
	.section-7
	.work-wrap
	.icon-container
	.icon-wrap
	.icon-box
	.icon.marketing {
	background-image: url(/img/conts/aboutus_sec_07_icon_04.svg);
}
.about-us .section-7 .work-wrap .icon-container .icon-wrap .icon-box .icon.pcm {
	background-image: url(/img/conts/aboutus_sec_07_icon_05.svg);
}
.about-us
	.section-7
	.work-wrap
	.icon-container
	.icon-wrap
	.icon-box
	.icon.construction {
	background-image: url(/img/conts/aboutus_sec_07_icon_06.svg);
}
.about-us .section-7 .work-wrap .icon-container .icon-wrap .icon-box .icon.cs {
	background-image: url(/img/conts/aboutus_sec_07_icon_07.svg);
}
.about-us
	.section-7
	.work-wrap
	.icon-container
	.icon-wrap
	.icon-box
	.icon.design {
	background-image: url(/img/conts/aboutus_sec_07_icon_08.svg);
}
.about-us
	.section-7
	.work-wrap
	.icon-container
	.icon-wrap
	.icon-box
	.icon.implementation {
	background-image: url(/img/conts/aboutus_sec_07_icon_09.svg);
}
.about-us .section-7 .work-wrap .icon-container .icon-wrap .icon-box p {
	font-size: 30px;
	font-weight: 500;
	margin-top: var(--gap-32);
}
.about-us .section-7 .work-wrap .conts-wrap {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: var(--gap-80);
}
.about-us .section-7 .work-wrap .conts-wrap .num {
	font-family: var(--Poppins);
	font-size: 15vw;
	line-height: 1;
	letter-spacing: calc(1vw * -1);
}
.about-us .section-7 .work-wrap .conts-wrap .conts-box {
	font-size: var(--font-80);
	font-weight: 200;
	letter-spacing: -1px;
	line-height: 1.3;
}
.about-us .section-7 .work-wrap .conts-wrap .conts-box .txt-row {
	display: flex;
	align-items: center;
	overflow: hidden;
}
.about-us .section-7 .work-wrap .conts-wrap .conts-box em {
	font-weight: 800;
}

@media screen and (max-width: 1600px) {
	.about-us .section-7 .work-wrap .icon-container .icon-wrap .icon-box {
		width: 220px;
		height: 220px;
	}
	.about-us .section-7 .work-wrap .icon-container .icon-wrap .icon-box .icon {
		width: 80px;
		height: 80px;
	}
}

@media screen and (max-width: 1280px) {
	.about-us .section-7 .work-wrap .icon-container .icon-wrap .icon-box {
		width: 180px;
		height: 180px;
	}
	.about-us .section-7 .work-wrap .icon-container .icon-wrap .icon-box .icon {
		width: 60px;
		height: 60px;
	}
	.about-us .section-7 .work-wrap .icon-container .icon-wrap .icon-box p {
		font-size: 24px;
		margin-top: var(--gap-20);
	}
}

@media screen and (max-width: 1024px) {
	.about-us .section-7 .work-wrap .icon-container .icon-wrap .icon-box {
		width: 150px;
		height: 150px;
	}
	.about-us .section-7 .work-wrap .icon-container .icon-wrap .icon-box .icon {
		width: 40px;
		height: 40px;
	}
	.about-us .section-7 .work-wrap .icon-container .icon-wrap .icon-box p {
		font-size: 18px;
	}
}

@media screen and (max-width: 768px) {
	.about-us .section-7 .work-wrap .icon-container .icon-wrap .icon-box {
		width: 120px;
		height: 120px;
	}
	.about-us .section-7 .work-wrap .icon-container .icon-wrap .icon-box .icon {
		width: 30px;
		height: 30px;
	}
	.about-us .section-7 .work-wrap .icon-container .icon-wrap .icon-box p {
		font-size: 14px;
	}
}

@media screen and (max-width: 648px) {
	.about-us .section-7 .work-wrap .icon-container .icon-wrap .icon-box {
		width: 100px;
		height: 100px;
	}
}

@media screen and (max-width: 480px) {
	.about-us .section-7 .work-wrap .icon-container .icon-wrap {
		flex-wrap: wrap;
	}
	.about-us .section-7 .work-wrap .icon-container .icon-wrap:last-child {
		max-width: 235px;
		margin: 0 auto;
	}
	.about-us .section-7 .work-wrap .icon-container .icon-wrap .icon-box {
		width: 80px;
		height: 80px;
		margin: 0 -5px;
	}
	.about-us .section-7 .work-wrap .icon-container .icon-wrap .icon-box .icon {
		width: 25px;
		height: 25px;
	}
	.about-us .section-7 .work-wrap .icon-container .icon-wrap .icon-box p {
		font-size: 12px;
		margin-top: 8px;
	}
	.about-us .section-7 .work-wrap .conts-wrap {
		flex-direction: column;
		gap: var(--gap-40);
	}
	.about-us .section-7 .work-wrap .conts-wrap > * {
		width: 100%;
		text-align: center;
	}
	.about-us .section-7 .work-wrap .conts-wrap .num {
		font-size: 25vw;
	}
	.about-us .section-7 .work-wrap .conts-wrap .conts-box .txt-row {
		justify-content: center;
		text-align: center;
	}
}

.about-us .section-8 {
	width: 100%;
	height: var(--nvh);
	overflow: hidden;
}
.about-us .section-8 > .wrap {
	width: 100%;
	height: 100%;
	display: flex;
	align-items: center;
	max-width: 1920px;
	margin: 0 auto;
}
.about-us .section-8 .photo-wrap {
	width: 100%;
}
.about-us .section-8 .photo-wrap .com-txt {
	width: 90%;
	max-width: 1440px;
	margin: 0 auto;
}
.about-us .section-8 .photo-wrap .com-txt .txt-row {
	display: flex;
	align-items: center;
	overflow: hidden;
}
.about-us .section-8 .photo-wrap .com-txt .txt-row p {
	font-size: calc(var(--font-80) * 0.75);
	letter-spacing: -0.5px;
	color: var(--white);
	font-weight: 500;
}
.about-us .section-8 .photo-wrap .bottom-txt .txt-row {
	text-align: right;
	justify-content: flex-end;
}
.about-us .section-8 .photo-wrap .photo-conts-wrap {
	width: 100%;
	overflow: hidden;
	padding: calc(var(--gap-80) + var(--gap-40)) 0;
}
.about-us .section-8 .photo-wrap .photo-conts-wrap .scroll-wrap {
	display: flex;
	align-items: center;
	gap: var(--gap-20);
}
.about-us .section-8 .photo-wrap .photo-conts-wrap .scroll-wrap .photo-box {
	width: 320px;
	border-radius: 40px;
	overflow: hidden;
	flex-shrink: 0;
}
.about-us
	.section-8
	.photo-wrap
	.photo-conts-wrap
	.scroll-wrap
	.photo-box
	span {
	display: block;
	width: 100%;
	height: 0;
	padding-bottom: 100%;
	position: relative;
}
.about-us
	.section-8
	.photo-wrap
	.photo-conts-wrap
	.scroll-wrap
	.photo-box
	span
	img {
	width: 100%;
	height: 100%;
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	object-fit: cover;
}
.about-us
	.section-8
	.photo-wrap
	.photo-conts-wrap
	.scroll-wrap
	.photo-box:nth-child(odd) {
	transform: translateY(var(--gap-40));
}
.about-us
	.section-8
	.photo-wrap
	.photo-conts-wrap
	.scroll-wrap
	.photo-box:nth-child(even) {
	transform: translateY(calc(var(--gap-40) * -1));
}

@media screen and (max-width: 1600px) {
	.about-us .section-8 .photo-wrap .photo-conts-wrap .scroll-wrap .photo-box {
		width: 200px;
		border-radius: 20px;
	}
}

@media screen and (max-width: 768px) {
	.about-us .section-8 .photo-wrap .photo-conts-wrap .scroll-wrap .photo-box {
		width: 250px;
		border-radius: 30px;
	}
}

@media screen and (max-width: 480px) {
	.about-us .section-8 .photo-wrap .com-txt .txt-row p {
		font-size: var(--font-32);
	}
	.about-us .section-8 .photo-wrap .photo-conts-wrap .scroll-wrap .photo-box {
		width: 180px;
		border-radius: 20px;
	}
}

.about-us .section-9 {
	width: 100%;
	height: var(--nvh);
	overflow: hidden;
}
.about-us .section-9 > .wrap {
	width: 90%;
	max-width: 1320px;
	height: 100%;
	margin: 0 auto;
	display: flex;
	align-items: center;
	justify-content: center;
}
.about-us .section-9 .one-stop-wrap {
	width: 100%;
}
.about-us .section-9 .one-stop-wrap .layout-wrap {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 160px;
}
.about-us .section-9 .one-stop-wrap .layout-wrap .img-wrap {
	position: relative;
	width: 500px;
	height: 500px;
}
.about-us .section-9 .one-stop-wrap .layout-wrap .img-wrap .img-box {
	width: 500px;
	position: absolute;
	left: 0;
	top: 0;
}
.about-us .section-9 .one-stop-wrap .layout-wrap .img-wrap .img-box span {
	display: block;
	width: 100%;
	height: 0;
	padding-bottom: 100%;
	position: relative;
}
.about-us .section-9 .one-stop-wrap .layout-wrap .img-wrap .img-box span img {
	width: 100%;
	height: 100%;
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	object-fit: cover;
}
.about-us .section-9 .one-stop-wrap .layout-wrap .conts-wrap {
	width: 570px;
	color: var(--white);
}
.about-us .section-9 .one-stop-wrap .layout-wrap .conts-wrap .title-box {
	font-family: var(--Poppins);
	font-size: calc(var(--font-80) * 1.125);
	letter-spacing: -1px;
	font-weight: 600;
	line-height: 1.3;
	margin-bottom: 80px;
}
.about-us .section-9 .one-stop-wrap .layout-wrap .conts-wrap .detail-conts {
	width: 100%;
	height: 200px;
	position: relative;
}
.about-us
	.section-9
	.one-stop-wrap
	.layout-wrap
	.conts-wrap
	.detail-conts
	.conts-box {
	width: 100%;
	padding-left: 140px;
	position: absolute;
	left: 0;
	top: 0;
}
.about-us
	.section-9
	.one-stop-wrap
	.layout-wrap
	.conts-wrap
	.detail-conts
	.conts-box
	.conts {
	font-size: var(--font-40);
	color: var(--gray-c);
	font-weight: 500;
}

@media screen and (max-width: 1440px) {
	.about-us .section-9 .one-stop-wrap .layout-wrap {
		gap: 100px;
	}
	.about-us .section-9 .one-stop-wrap .layout-wrap .img-wrap {
		width: 400px;
		height: 400px;
	}
	.about-us .section-9 .one-stop-wrap .layout-wrap .img-wrap .img-box {
		width: 400px;
	}
	.about-us .section-9 .one-stop-wrap .layout-wrap .conts-wrap {
		width: 460px;
	}
	.about-us .section-9 .one-stop-wrap .layout-wrap .conts-wrap .title-box {
		margin-bottom: 60px;
	}
	.about-us
		.section-9
		.one-stop-wrap
		.layout-wrap
		.conts-wrap
		.detail-conts
		.conts-box {
		padding-left: 80px;
	}
}

@media screen and (max-width: 1024px) {
	.about-us .section-9 .one-stop-wrap .layout-wrap {
		gap: 100px;
		flex-direction: column;
	}
	.about-us .section-9 .one-stop-wrap .layout-wrap .conts-wrap {
		width: 100%;
	}
	.about-us .section-9 .one-stop-wrap .layout-wrap .conts-wrap .title-box {
		width: 100%;
		text-align: center;
		margin-bottom: var(--gap-40);
	}
	.about-us
		.section-9
		.one-stop-wrap
		.layout-wrap
		.conts-wrap
		.detail-conts
		.conts-box {
		padding-left: 0;
		text-align: center;
	}
}

@media screen and (max-width: 648px) {
	.about-us .section-9 .one-stop-wrap .layout-wrap .img-wrap {
		width: 320px;
		height: 320px;
	}
	.about-us .section-9 .one-stop-wrap .layout-wrap .img-wrap .img-box {
		width: 320px;
	}
}

@media screen and (max-width: 480px) {
	.about-us .section-9 .one-stop-wrap .layout-wrap .img-wrap {
		width: 220px;
		height: 220px;
	}
	.about-us .section-9 .one-stop-wrap .layout-wrap .img-wrap .img-box {
		width: 220px;
	}
	.about-us
		.section-9
		.one-stop-wrap
		.layout-wrap
		.conts-wrap
		.detail-conts
		.conts-box
		.conts {
		font-size: var(--font-28);
	}
}

.about-us .section-10 {
	width: 100%;
	min-height: var(--nvh);
}
.about-us .section-10 > .wrap {
	width: 100%;
}
.about-us .section-10 .portfolio-container {
	width: 100%;
	height: 100%;
	overflow: hidden;
}
.about-us .section-10 .portfolio-container .scroll-wrap {
	display: flex;
	position: relative;
	width: 100%;
	height: var(--nvh);
}
.about-us .section-10 .portfolio-container .scroll-wrap .portfolio-box {
	width: 100%;
	height: var(--nvh);
	flex-shrink: 0;
	position: absolute;
	left: 0;
	top: 0;
	background: var(--black);
	z-index: 10;
}
.about-us .section-10 .portfolio-container .scroll-wrap .portfolio-box.type-B {
	background: var(--white);
}
.about-us
	.section-10
	.portfolio-container
	.scroll-wrap
	.portfolio-box
	.portfolio-wrap {
	width: 90%;
	max-width: 1460px;
	margin: 0 auto;
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	position: relative;
}
.about-us
	.section-10
	.portfolio-container
	.scroll-wrap
	.portfolio-box
	.portfolio-wrap
	.portfolio-intro {
	width: 100%;
	display: flex;
	gap: 70px;
}
.about-us
	.section-10
	.portfolio-container
	.scroll-wrap
	.portfolio-box
	.portfolio-wrap
	.portfolio-intro
	.col-l {
	width: calc((100% - 70px) * 0.68);
}
.about-us
	.section-10
	.portfolio-container
	.scroll-wrap
	.portfolio-box
	.portfolio-wrap
	.portfolio-intro
	.col-l
	.layout-title-wrap {
	width: 100%;
}
.about-us
	.section-10
	.portfolio-container
	.scroll-wrap
	.portfolio-box
	.portfolio-wrap
	.portfolio-intro
	.col-l
	.layout-title-wrap
	.title-box
	.title {
	overflow: hidden;
}
.about-us
	.section-10
	.portfolio-container
	.scroll-wrap
	.portfolio-box
	.portfolio-wrap
	.portfolio-intro
	.col-l
	.layout-title-wrap
	.title-box
	.title
	h2 {
	font-size: var(--font-80);
	letter-spacing: -1px;
	color: var(--white);
	font-weight: 800;
	line-height: 1.3;
}
.about-us
	.section-10
	.portfolio-container
	.scroll-wrap
	.portfolio-box
	.portfolio-wrap
	.portfolio-intro
	.col-l
	.layout-title-wrap
	.title-box
	.sub-txt {
	overflow: hidden;
}
.about-us
	.section-10
	.portfolio-container
	.scroll-wrap
	.portfolio-box
	.portfolio-wrap
	.portfolio-intro
	.col-l
	.layout-title-wrap
	.title-box
	.sub-txt
	p {
	font-family: var(--Poppins);
	font-size: calc(var(--font-80) * 0.75);
	color: rgba(255, 255, 255, 0.6);
	font-weight: 200;
}
.about-us
	.section-10
	.portfolio-container
	.scroll-wrap
	.portfolio-box
	.portfolio-wrap
	.portfolio-intro
	.col-l
	.img-wrap {
	width: 100%;
	margin-top: var(--gap-60);
}
.about-us
	.section-10
	.portfolio-container
	.scroll-wrap
	.portfolio-box
	.portfolio-wrap
	.portfolio-intro
	.col-l
	.img-wrap
	.img-box {
	width: 75%;
	max-width: 700px;
	margin-left: auto;
	margin-right: 0;
	position: relative;
}
.about-us
	.section-10
	.portfolio-container
	.scroll-wrap
	.portfolio-box
	.portfolio-wrap
	.portfolio-intro
	.col-l
	.img-wrap
	.img-box:after {
	content: '';
	width: 100%;
	height: 100%;
	border-radius: var(--gap-16);
	background: rgba(255, 255, 255, 0.2);
	position: absolute;
	left: calc(var(--gap-40) * -1);
	top: var(--gap-40);
	z-index: 0;
}
.about-us
	.section-10
	.portfolio-container
	.scroll-wrap
	.portfolio-box
	.portfolio-wrap
	.portfolio-intro
	.col-l
	.img-wrap
	.img-box
	span {
	display: block;
	width: 100%;
	height: 0;
	padding-bottom: calc(400 / 700 * 100%);
	position: relative;
	border-radius: var(--gap-16);
	overflow: hidden;
}
.about-us
	.section-10
	.portfolio-container
	.scroll-wrap
	.portfolio-box
	.portfolio-wrap
	.portfolio-intro
	.col-l
	.img-wrap
	.img-box
	span
	img {
	width: 100%;
	height: 100%;
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	object-fit: cover;
	z-index: 1;
}
.about-us
	.section-10
	.portfolio-container
	.scroll-wrap
	.portfolio-box.type-B
	.portfolio-wrap
	.portfolio-intro
	.col-l
	.img-wrap
	.img-box:after {
	background: rgba(0, 0, 0, 0.2);
}
.about-us
	.section-10
	.portfolio-container
	.scroll-wrap
	.portfolio-box
	.portfolio-wrap
	.portfolio-intro
	.col-r {
	width: calc((100% - 70px) * 0.32);
}
.about-us
	.section-10
	.portfolio-container
	.scroll-wrap
	.portfolio-box
	.portfolio-wrap
	.portfolio-intro
	.col-r
	.img-wrap {
	width: 100%;
}
.about-us
	.section-10
	.portfolio-container
	.scroll-wrap
	.portfolio-box
	.portfolio-wrap
	.portfolio-intro
	.col-r
	.img-wrap
	.img-box {
	width: 80%;
	position: relative;
}
.about-us
	.section-10
	.portfolio-container
	.scroll-wrap
	.portfolio-box
	.portfolio-wrap
	.portfolio-intro
	.col-r
	.img-wrap
	.img-box
	span {
	display: block;
	width: 100%;
	height: 0;
	padding-bottom: calc(480 / 360 * 100%);
	position: relative;
	border-radius: var(--gap-16);
	overflow: hidden;
}
.about-us
	.section-10
	.portfolio-container
	.scroll-wrap
	.portfolio-box
	.portfolio-wrap
	.portfolio-intro
	.col-r
	.img-wrap
	.img-box
	span
	img {
	width: 100%;
	height: 100%;
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	object-fit: cover;
}
.about-us
	.section-10
	.portfolio-container
	.scroll-wrap
	.portfolio-box
	.portfolio-wrap
	.portfolio-intro
	.col-r
	.button-wrap {
	width: 100%;
	margin-top: var(--gap-80);
}
.about-us
	.section-10
	.portfolio-container
	.scroll-wrap
	.portfolio-box
	.portfolio-wrap
	.portfolio-intro
	.col-r
	.button-wrap
	.button-box {
	overflow: hidden;
}
.about-us
	.section-10
	.portfolio-container
	.scroll-wrap
	.portfolio-box
	.portfolio-wrap
	.portfolio-intro
	.col-r
	.button-wrap
	.button-box
	.btn-dir {
	width: fit-content;
	height: var(--n-80);
	border-radius: 100px;
	background: var(--white);
	padding: 0 var(--gap-32);
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: var(--font-30);
	color: var(--black);
	font-weight: 700;
	margin-left: auto;
	margin-right: 0;
}
.about-us
	.section-10
	.portfolio-container
	.scroll-wrap
	.portfolio-box
	.portfolio-wrap
	.portfolio-intro
	.col-r
	.button-wrap
	.button-box
	.btn-dir
	span {
	position: relative;
	padding-right: calc(var(--gap-16) + var(--n-40));
}
.about-us
	.section-10
	.portfolio-container
	.scroll-wrap
	.portfolio-box
	.portfolio-wrap
	.portfolio-intro
	.col-r
	.button-wrap
	.button-box
	.btn-dir
	span:after {
	content: '';
	width: var(--n-40);
	height: var(--n-40);
	background: url(/img/conts/arrow_dir.svg) center no-repeat;
	background-size: cover;
	position: absolute;
	right: 0;
	top: 50%;
	transform: translateY(-50%);
}

.about-us
	.section-10
	.portfolio-container
	.scroll-wrap
	.portfolio-box.type-B
	.portfolio-wrap
	.portfolio-intro
	.col-l
	.layout-title-wrap
	.title-box
	.title
	h2 {
	color: var(--black);
}
.about-us
	.section-10
	.portfolio-container
	.scroll-wrap
	.portfolio-box.type-B
	.portfolio-wrap
	.portfolio-intro
	.col-l
	.layout-title-wrap
	.title-box
	.sub-txt
	p {
	color: rgba(0, 0, 0, 0.6);
}
.about-us
	.section-10
	.portfolio-container
	.scroll-wrap
	.portfolio-box.type-B
	.portfolio-wrap
	.portfolio-intro
	.col-r
	.button-wrap
	.button-box
	.btn-dir {
	background: var(--black);
	color: var(--white);
}
.about-us
	.section-10
	.portfolio-container
	.scroll-wrap
	.portfolio-box.type-B
	.portfolio-wrap
	.portfolio-intro
	.col-r
	.button-wrap
	.button-box
	.btn-dir
	span:after {
	background-image: url(/img/conts/arrow_dir_white.svg);
}

.about-us
	.section-10
	.portfolio-container
	.scroll-wrap
	.portfolio-box
	.portfolio-wrap.type-B {
	max-width: 1320px;
}
.about-us
	.section-10
	.portfolio-container
	.scroll-wrap
	.portfolio-box
	.portfolio-wrap
	.portfolio-detail {
	width: 100%;
	display: flex;
	gap: 120px;
}
.about-us
	.section-10
	.portfolio-container
	.scroll-wrap
	.portfolio-box
	.portfolio-wrap
	.portfolio-detail
	.detail-box {
	width: calc((100% - 120px) / 2);
	display: flex;
	flex-direction: column;
	gap: var(--gap-40);
}
.about-us
	.section-10
	.portfolio-container
	.scroll-wrap
	.portfolio-box
	.portfolio-wrap
	.portfolio-detail
	.detail-box:nth-child(even) {
	flex-direction: column-reverse;
}
.about-us
	.section-10
	.portfolio-container
	.scroll-wrap
	.portfolio-box
	.portfolio-wrap
	.portfolio-detail
	.detail-box
	.title-box {
	font-size: calc(var(--font-80) * 0.625);
	font-weight: 700;
	color: var(--white);
}
.about-us
	.section-10
	.portfolio-container
	.scroll-wrap
	.portfolio-box
	.portfolio-wrap
	.portfolio-detail
	.detail-box
	.title-box
	span {
	display: block;
	font-weight: 200;
}
.about-us
	.section-10
	.portfolio-container
	.scroll-wrap
	.portfolio-box.type-B
	.portfolio-wrap
	.portfolio-detail
	.detail-box
	.title-box {
	color: var(--black);
}
.about-us
	.section-10
	.portfolio-container
	.scroll-wrap
	.portfolio-box
	.portfolio-wrap
	.portfolio-detail
	.detail-box:nth-child(odd)
	.title-box {
	text-align: right;
}
.about-us
	.section-10
	.portfolio-container
	.scroll-wrap
	.portfolio-box
	.portfolio-wrap
	.portfolio-detail
	.detail-box
	.img-wrap {
	width: 100%;
}
.about-us
	.section-10
	.portfolio-container
	.scroll-wrap
	.portfolio-box
	.portfolio-wrap
	.portfolio-detail
	.detail-box
	.img-wrap
	.img-box {
	width: fit-content;
	max-width: 100%;
	border-radius: var(--gap-16);
	overflow: hidden;
}
.about-us
	.section-10
	.portfolio-container
	.scroll-wrap
	.portfolio-box
	.portfolio-wrap
	.portfolio-detail
	.detail-box
	.img-wrap
	.img-box
	img {
	display: block;
	max-width: 100%;
}
.about-us
	.section-10
	.portfolio-container
	.scroll-wrap
	.portfolio-box
	.portfolio-wrap
	.portfolio-detail
	.detail-box:nth-child(odd)
	.img-wrap
	.img-box {
	margin-left: auto;
	margin-right: 0;
}

.about-us
	.section-10
	.portfolio-container
	.scroll-wrap
	.portfolio-box
	.portfolio-wrap
	.portfolio-detail.type-B {
	gap: var(--gap-40);
}
.about-us
	.section-10
	.portfolio-container
	.scroll-wrap
	.portfolio-box
	.portfolio-wrap
	.portfolio-detail.type-B
	.detail-wrap {
	width: calc((100% - (var(--gap-40) * 2)) / 3);
	display: flex;
}
.about-us
	.section-10
	.portfolio-container
	.scroll-wrap
	.portfolio-box
	.portfolio-wrap
	.portfolio-detail.type-B
	.detail-wrap
	.detail-box {
	width: 100%;
}
.about-us
	.section-10
	.portfolio-container
	.scroll-wrap
	.portfolio-box
	.portfolio-wrap
	.portfolio-detail.type-B
	.detail-wrap
	.detail-box
	.title-box {
	font-size: calc(var(--font-80) * 0.45);
}
.about-us
	.section-10
	.portfolio-container
	.scroll-wrap
	.portfolio-box
	.portfolio-wrap
	.portfolio-detail.type-B
	.detail-wrap:nth-child(1) {
	align-items: center;
}
.about-us
	.section-10
	.portfolio-container
	.scroll-wrap
	.portfolio-box
	.portfolio-wrap
	.portfolio-detail.type-B
	.detail-wrap:nth-child(2) {
	align-items: flex-start;
}
.about-us
	.section-10
	.portfolio-container
	.scroll-wrap
	.portfolio-box
	.portfolio-wrap
	.portfolio-detail.type-B
	.detail-wrap:nth-child(3) {
	align-items: flex-end;
}
.about-us
	.section-10
	.portfolio-container
	.scroll-wrap
	.portfolio-box
	.portfolio-wrap
	.portfolio-detail.type-B
	.detail-wrap:nth-child(1)
	.detail-box
	.title-box {
	text-align: left;
}
.about-us
	.section-10
	.portfolio-container
	.scroll-wrap
	.portfolio-box
	.portfolio-wrap
	.portfolio-detail.type-B
	.detail-wrap:nth-child(2)
	.detail-box
	.title-box {
	text-align: center;
}
.about-us
	.section-10
	.portfolio-container
	.scroll-wrap
	.portfolio-box
	.portfolio-wrap
	.portfolio-detail.type-B
	.detail-wrap:nth-child(3)
	.detail-box
	.title-box {
	text-align: right;
}

@media screen and (max-width: 1024px) {
	.about-us
		.section-10
		.portfolio-container
		.scroll-wrap
		.portfolio-box
		.portfolio-wrap
		.portfolio-intro {
		gap: 50px;
	}
	.about-us
		.section-10
		.portfolio-container
		.scroll-wrap
		.portfolio-box
		.portfolio-wrap
		.portfolio-intro
		.col-l {
		width: calc((100% - 50px) * 0.68);
	}
	.about-us
		.section-10
		.portfolio-container
		.scroll-wrap
		.portfolio-box
		.portfolio-wrap
		.portfolio-intro
		.col-r {
		width: calc((100% - 50px) * 0.32);
	}
	.about-us
		.section-10
		.portfolio-container
		.scroll-wrap
		.portfolio-box
		.portfolio-wrap
		.portfolio-intro
		.col-r
		.button-wrap
		.button-box
		.btn-dir {
		height: var(--n-64);
		padding: 0 var(--gap-24);
		font-size: var(--font-24);
	}
	.about-us
		.section-10
		.portfolio-container
		.scroll-wrap
		.portfolio-box
		.portfolio-wrap
		.portfolio-intro
		.col-r
		.button-wrap
		.button-box
		.btn-dir
		span {
		padding-right: calc(var(--gap-16) + var(--n-32));
	}
	.about-us
		.section-10
		.portfolio-container
		.scroll-wrap
		.portfolio-box
		.portfolio-wrap
		.portfolio-intro
		.col-r
		.button-wrap
		.button-box
		.btn-dir
		span:after {
		width: var(--n-32);
		height: var(--n-32);
	}

	.about-us
		.section-10
		.portfolio-container
		.scroll-wrap
		.portfolio-box
		.portfolio-wrap
		.portfolio-detail {
		gap: 70px;
	}
	.about-us
		.section-10
		.portfolio-container
		.scroll-wrap
		.portfolio-box
		.portfolio-wrap
		.portfolio-detail
		.detail-box {
		width: calc((100% - 70px) / 2);
	}
}

@media screen and (max-width: 900px) {
	.about-us
		.section-10
		.portfolio-container
		.scroll-wrap
		.portfolio-box
		.portfolio-wrap
		.portfolio-detail.type-B
		.detail-wrap
		.detail-box
		.title-box {
		font-size: calc(var(--font-80) * 0.4);
	}
}

@media screen and (max-width: 768px) {
	.about-us .section-10 .portfolio-container .scroll-wrap {
		flex-wrap: wrap;
		height: 100%;
	}
	.about-us .section-10 .portfolio-container .scroll-wrap .portfolio-box {
		position: relative;
		height: auto;
		min-height: var(--nvh);
		padding: var(--gap-40) 0;
	}
	.about-us
		.section-10
		.portfolio-container
		.scroll-wrap
		.portfolio-box
		.portfolio-wrap
		.portfolio-intro {
		flex-direction: column;
		gap: var(--gap-40);
	}
	.about-us
		.section-10
		.portfolio-container
		.scroll-wrap
		.portfolio-box
		.portfolio-wrap
		.portfolio-intro
		.col-l,
	.about-us
		.section-10
		.portfolio-container
		.scroll-wrap
		.portfolio-box
		.portfolio-wrap
		.portfolio-intro
		.col-r {
		width: 100%;
	}
	.about-us
		.section-10
		.portfolio-container
		.scroll-wrap
		.portfolio-box
		.portfolio-wrap
		.portfolio-intro
		.col-r
		.img-wrap {
		display: none;
	}
	.about-us
		.section-10
		.portfolio-container
		.scroll-wrap
		.portfolio-box
		.portfolio-wrap
		.portfolio-intro
		.col-l
		.layout-title-wrap
		.title-box
		.title
		h2,
	.about-us
		.section-10
		.portfolio-container
		.scroll-wrap
		.portfolio-box
		.portfolio-wrap
		.portfolio-intro
		.col-l
		.layout-title-wrap
		.title-box
		.sub-txt
		p {
		text-align: center;
	}
	.about-us
		.section-10
		.portfolio-container
		.scroll-wrap
		.portfolio-box
		.portfolio-wrap
		.portfolio-intro
		.col-l
		.img-wrap
		.img-box {
		width: 85%;
		margin: 0 auto;
	}
	.about-us
		.section-10
		.portfolio-container
		.scroll-wrap
		.portfolio-box
		.portfolio-wrap
		.portfolio-intro
		.col-l
		.img-wrap
		.img-box:after {
		width: calc(100% + 10px);
		left: 50%;
		top: 30px;
		transform: translateX(-50%);
	}
	.about-us
		.section-10
		.portfolio-container
		.scroll-wrap
		.portfolio-box
		.portfolio-wrap
		.portfolio-intro
		.col-r
		.button-wrap
		.button-box
		.btn-dir {
		height: var(--n-60);
		padding: 0 var(--gap-32);
		font-size: var(--font-24);
		margin: 0 auto;
	}
	.about-us
		.section-10
		.portfolio-container
		.scroll-wrap
		.portfolio-box
		.portfolio-wrap
		.portfolio-intro
		.col-r
		.button-wrap
		.button-box
		.btn-dir
		span {
		padding-right: calc(var(--gap-16) + var(--n-32));
	}
	.about-us
		.section-10
		.portfolio-container
		.scroll-wrap
		.portfolio-box
		.portfolio-wrap
		.portfolio-intro
		.col-r
		.button-wrap
		.button-box
		.btn-dir
		span:after {
		width: var(--n-32);
		height: var(--n-32);
	}

	.about-us
		.section-10
		.portfolio-container
		.scroll-wrap
		.portfolio-box
		.portfolio-wrap
		.portfolio-detail {
		flex-direction: column;
		gap: var(--gap-60);
	}
	.about-us
		.section-10
		.portfolio-container
		.scroll-wrap
		.portfolio-box
		.portfolio-wrap
		.portfolio-detail
		.detail-box {
		width: 100%;
	}
	.about-us
		.section-10
		.portfolio-container
		.scroll-wrap
		.portfolio-box
		.portfolio-wrap
		.portfolio-detail
		.detail-box:nth-child(even) {
		flex-direction: column;
	}
	.about-us
		.section-10
		.portfolio-container
		.scroll-wrap
		.portfolio-box
		.portfolio-wrap
		.portfolio-detail
		.detail-box
		.title-box,
	.about-us
		.section-10
		.portfolio-container
		.scroll-wrap
		.portfolio-box
		.portfolio-wrap
		.portfolio-detail
		.detail-box:nth-child(odd)
		.title-box {
		text-align: center;
	}
	.about-us
		.section-10
		.portfolio-container
		.scroll-wrap
		.portfolio-box
		.portfolio-wrap
		.portfolio-detail
		.detail-box
		.img-wrap {
		width: 85%;
		margin: 0 auto;
	}
	.about-us
		.section-10
		.portfolio-container
		.scroll-wrap
		.portfolio-box
		.portfolio-wrap
		.portfolio-detail
		.detail-box
		.img-wrap
		.img-box {
		margin: 0 auto !important;
	}

	.about-us
		.section-10
		.portfolio-container
		.scroll-wrap
		.portfolio-box
		.portfolio-wrap
		.portfolio-detail.type-B {
		gap: var(--gap-60);
	}
	.about-us
		.section-10
		.portfolio-container
		.scroll-wrap
		.portfolio-box
		.portfolio-wrap
		.portfolio-detail.type-B
		.detail-wrap {
		width: 100%;
	}
	.about-us
		.section-10
		.portfolio-container
		.scroll-wrap
		.portfolio-box
		.portfolio-wrap
		.portfolio-detail.type-B
		.detail-wrap
		.detail-box
		.title-box {
		font-size: calc(var(--font-80) * 0.625);
	}
	.about-us
		.section-10
		.portfolio-container
		.scroll-wrap
		.portfolio-box
		.portfolio-wrap
		.portfolio-detail.type-B
		.detail-wrap:nth-child(1)
		.detail-box
		.title-box,
	.about-us
		.section-10
		.portfolio-container
		.scroll-wrap
		.portfolio-box
		.portfolio-wrap
		.portfolio-detail.type-B
		.detail-wrap:nth-child(2)
		.detail-box
		.title-box,
	.about-us
		.section-10
		.portfolio-container
		.scroll-wrap
		.portfolio-box
		.portfolio-wrap
		.portfolio-detail.type-B
		.detail-wrap:nth-child(3)
		.detail-box
		.title-box {
		text-align: center;
	}
}

.about-us .section-11 {
	width: 100%;
	padding: var(--gap-80) 0;
}
.about-us .section-11 > .wrap {
	width: 90%;
	max-width: 1320px;
	margin: 0 auto;
}
.about-us .section-11 .section-title {
	width: 100%;
}
.about-us .section-11 .section-title .title-box {
	font-size: calc(var(--font-80) * 1.25);
	color: var(--white);
	letter-spacing: -1px;
	line-height: 1.3;
	text-align: center;
	font-weight: 200;
}
.about-us .section-11 .section-title .title-box .txt-row {
	overflow: hidden;
}
.about-us .section-11 .section-title .title-box .txt-row span {
	font-weight: 800;
}
.about-us .section-11 .slogan-wrap {
	width: 100%;
	margin-top: calc(var(--gap-80) * 3);
}
.about-us .section-11 .slogan-wrap .slogan-box {
	width: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 0 120px;
	margin-top: calc(var(--gap-100) * 2);
}
.about-us .section-11 .slogan-wrap .slogan-box .img-box {
	width: calc((100% - 120px) * 0.67);
	max-width: 800px;
}
.about-us .section-11 .slogan-wrap .slogan-box .img-box span {
	width: 100%;
	height: 0;
	padding-bottom: calc(550 / 800 * 100%);
	position: relative;
	border-radius: var(--gap-16);
	display: block;
	overflow: hidden;
}
.about-us .section-11 .slogan-wrap .slogan-box .img-box span img {
	width: 100%;
	height: 100%;
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	object-fit: cover;
}
.about-us .section-11 .slogan-wrap .slogan-box .conts-box {
	flex: 1;
}
.about-us .section-11 .slogan-wrap .slogan-box .conts-box .title {
	margin-bottom: var(--gap-40);
}
.about-us .section-11 .slogan-wrap .slogan-box .conts-box .title span {
	display: block;
	font-size: calc(var(--font-80) * 0.375);
	color: rgba(255, 255, 255, 0.6);
	font-family: var(--Poppins);
	font-weight: 200;
}
.about-us .section-11 .slogan-wrap .slogan-box .conts-box .title h3 {
	font-size: calc(var(--font-80) * 0.75);
	color: var(--white);
	font-weight: 700;
}
.about-us .section-11 .slogan-wrap .slogan-box .conts-box .conts {
	font-size: calc(var(--font-80) * 0.5);
	color: var(--white);
	font-weight: 500;
}

.about-us .section-11 .slogan-wrap .slogan-box:nth-child(even) {
	flex-direction: row-reverse;
}
.about-us .section-11 .slogan-wrap .slogan-box:nth-child(even) .conts-box {
	text-align: right;
}

@media screen and (max-width: 1280px) {
	.about-us .section-11 .slogan-wrap .slogan-box {
		gap: 80px;
	}
	.about-us .section-11 .slogan-wrap .slogan-box .img-box {
		width: calc((100% - 80px) * 0.67);
	}
}

@media screen and (max-width: 1024px) {
	.about-us .section-11 .slogan-wrap .slogan-box {
		gap: 50px;
	}
	.about-us .section-11 .slogan-wrap .slogan-box .img-box {
		width: calc((100% - 50px) * 0.67);
	}
}

@media screen and (max-width: 768px) {
	.about-us .section-11 .section-title .title-box {
		font-size: calc(var(--font-80) * 1.1);
	}
	.about-us .section-11 .slogan-wrap .slogan-box {
		flex-direction: column;
	}
	.about-us .section-11 .slogan-wrap .slogan-box .img-box {
		width: 100%;
	}
	.about-us .section-11 .slogan-wrap .slogan-box:nth-child(even) {
		flex-direction: column;
	}
	.about-us .section-11 .slogan-wrap .slogan-box .conts-box,
	.about-us .section-11 .slogan-wrap .slogan-box:nth-child(even) .conts-box {
		text-align: center;
	}
}

@media screen and (max-width: 768px) {
	.about-us .section-11 .section-title .title-box {
		font-size: var(--font-60);
	}
}

.about-us .section-12 {
	width: 100%;
	height: var(--nvh);
	overflow: hidden;
}
.about-us .section-12 > .wrap {
	width: 100%;
	height: 100%;
	display: flex;
	align-items: center;
}
.about-us .section-12 .conts-wrap {
	width: 100%;
}
.about-us .section-12 .conts-wrap .com-txt {
	width: 90%;
	max-width: 1320px;
	margin: 0 auto;
	font-size: calc(var(--font-80) * 0.75);
	color: var(--white);
	font-weight: 200;
}
.about-us .section-12 .conts-wrap .com-txt .conts span {
	font-weight: 700;
}
.about-us .section-12 .conts-wrap .com-txt .conts .txt-row {
	overflow: hidden;
}
.about-us .section-12 .conts-wrap .top-txt {
	transform: translateY(100%);
}
.about-us .section-12 .conts-wrap .bottom-txt {
	text-align: right;
	margin-top: var(--gap-80);
}
.about-us .section-12 .line-img-wrap #line_illust {
	stroke-dasharray: 20000;
	stroke-dashoffset: 20000;
}
.about-us .section-12 .line-img-wrap #line_illust.active {
	animation: ani 10s linear both;
}

@keyframes ani {
	from {
		stroke-dashoffset: 20000;
	}
	to {
		stroke-dashoffset: 0;
	}
}

@media screen and (max-width: 1024px) {
	.about-us .section-12 .conts-wrap .top-txt {
		transform: translateY(20%);
	}
	.about-us .section-12 .conts-wrap .bottom-txt {
		margin-top: 10%;
	}
	.about-us .section-12 .conts-wrap .line-img-wrap {
		transform: scale(1.6);
	}
}

@media screen and (max-width: 480px) {
	.about-us .section-12 .conts-wrap .com-txt {
		font-size: calc(var(--font-80) * 0.5);
	}
	.about-us .section-12 .conts-wrap .top-txt {
		transform: translateY(0);
	}
	.about-us .section-12 .conts-wrap .bottom-txt {
		margin-top: 12%;
	}
	.about-us .section-12 .conts-wrap .line-img-wrap {
		transform: scale(1.8);
	}
}

.about-us .section-13 {
	width: 100%;
	padding: var(--gap-100) 0;
}
.about-us .section-13 > .wrap {
	width: 94%;
	max-width: 1500px;
	margin: 0 auto;
}
.about-us .section-13 .section-title {
	width: 100%;
	text-align: center;
	font-size: calc(var(--font-80) * 1.25);
	color: var(--white);
	font-weight: 200;
	letter-spacing: -1px;
	line-height: 1.3;
}
.about-us .section-13 .section-title .title-box .txt-row {
	overflow: hidden;
}
.about-us .section-13 .section-title .title-box .txt-row span {
	font-weight: 800;
}

.about-us .section-13 .vision-wrap {
	width: 100%;
	height: calc(var(--nvh) * 4);
	position: relative;
	margin-top: calc(var(--nvh) / 2);
}
.about-us .section-13 .vision-wrap .vision-container {
	width: 100%;
	height: calc(var(--nvh) * 4);
	position: sticky;
	top: 0;
}
.about-us .section-13 .vision-wrap .vision-container > .inner {
	width: 100%;
	height: 0;
	padding-bottom: calc(720 / 1500 * 100%);
	position: sticky;
	top: 50%;
	overflow: hidden;
	transform: translateY(-50%);
}
.about-us .section-13 .vision-wrap .vision-box {
	width: 100%;
}
.about-us .section-13 .vision-wrap .vision-box:nth-child(n + 2) {
	position: absolute;
	left: 0;
	top: 0;
}
.about-us .section-13 .vision-wrap .vision-box .vision-conts {
	width: 100%;
	position: relative;
}
.about-us .section-13 .vision-wrap .vision-box .img-box {
	width: 100%;
	position: relative;
	z-index: 5;
	border-radius: var(--gap-16);
	overflow: hidden;
}
.about-us .section-13 .vision-wrap .vision-box .img-box:after {
	content: '';
	width: 100%;
	height: 100%;
	position: absolute;
	left: 0;
	top: 0;
	background: rgba(0, 0, 0, 0.5);
	z-index: 2;
}
.about-us .section-13 .vision-wrap .vision-box .img-box span {
	display: block;
	width: 100%;
	height: 0;
	padding-bottom: calc(720 / 1500 * 100%);
	position: relative;
	z-index: 2;
}
.about-us .section-13 .vision-wrap .vision-box .img-box span img {
	width: 100%;
	height: 100%;
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	object-fit: cover;
}
.about-us .section-13 .vision-wrap .vision-box .conts-box {
	width: 100%;
	height: 100%;
	position: absolute;
	left: 0;
	top: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	z-index: 5;
}
.about-us .section-13 .vision-wrap .vision-box .conts-box .conts {
	font-size: var(--font-80);
	letter-spacing: -1px;
	color: var(--white);
	line-height: 1.3;
	font-weight: 800;
	text-align: center;
}
.about-us .section-13 .vision-wrap .vision-box .conts-box .conts span {
	font-weight: 200;
}

@media screen and (max-width: 768px) {
	.about-us .section-13 .vision-wrap .vision-container > .inner {
		padding-bottom: calc(1200 / 1500 * 100%);
	}
	.about-us .section-13 .vision-wrap .vision-box .img-box span {
		padding-bottom: calc(1200 / 1500 * 100%);
	}
}

@media screen and (max-width: 648px) {
	.about-us .section-13 .vision-wrap .vision-container > .inner {
		padding-bottom: calc(1000 / 1500 * 100%);
	}
	.about-us .section-13 .vision-wrap .vision-box .img-box span {
		padding-bottom: calc(1000 / 1500 * 100%);
	}
	.about-us .section-13 .vision-wrap .vision-box .conts-box .conts {
		font-size: calc(var(--font-80) * 0.75);
	}
}

@media screen and (max-width: 480px) {
	.about-us .section-13 .section-title {
		font-size: calc(var(--font-80) * 1);
		line-height: 1.4;
	}
	.about-us .section-13 .vision-wrap .vision-box .conts-box .conts {
		font-size: calc(var(--font-80) * 0.6);
	}
}

/*********************** about 공통 ***********************/

.about {
	background: var(--black);
	position: relative; /*z-index:10;*/
	visibility: hidden;
	opacity: 0;
	transition: visibility 1s ease-in-out, opacity 1s ease-in-out;
}
.about.active {
	visibility: visible;
	opacity: 1;
}

.about .sec-1 {
	position: relative;
}
.about .intro-visual {
	width: 100%;
	max-width: 3480px;
	margin: 0 auto;
	position: relative;
}
.about .intro-visual .img-wrap {
	width: 100%;
	position: relative;
	z-index: 1;
}
.about .intro-visual .img-wrap .img-box {
	transform: scale(0.1);
	transform-origin: center;
	animation: historyIntroAni1 1s ease both;
}
.about .intro-visual .img-wrap .img-box span {
	display: block;
	width: 100%;
	height: 0;
	padding-bottom: calc(973 / 1920 * 100%);
	position: relative;
	transition: 0.5s ease;
}
.about .intro-visual .img-wrap .img-box span:after {
	content: '';
	width: 100%;
	height: 100%;
	background: rgba(0, 0, 0, 0.5);
	position: absolute;
	left: 0;
	top: 0;
	z-index: 1;
}
.about .intro-visual .img-wrap .img-box span img {
	width: 100%;
	height: 100%;
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	object-fit: cover;
	display: block;
	z-index: 0;
}

.about .intro-visual .conts-wrap {
	width: 100%;
	height: 100%;
	position: absolute;
	left: 0;
	top: 0;
	z-index: 10;
}
.about .intro-visual .conts-wrap .conts-box {
	width: 100%;
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
}
.about .intro-visual .conts-wrap h2 {
	font-size: var(--font-80);
	font-weight: 700;
	color: var(--white);
	letter-spacing: -2px;
	animation: historyIntroAni2 0.7s 1.05s ease both;
}

.about .intro-visual .scroll-down {
	width: 100%;
	position: absolute;
	left: 0;
	bottom: var(--gap-60);
	z-index: 10;
	display: flex;
	align-items: center;
	justify-content: center;
	animation: historyIntroAni2 0.7s 1.05s ease both;
}
.about .intro-visual .scroll-down .obj {
	width: var(--n-80);
	height: var(--n-80);
	background: url(/img/com/down.png) center no-repeat;
	background-size: cover;
	border-radius: 50%;
}

@keyframes historyIntroAni1 {
	0% {
		transform: scale(0.1);
	}
	100% {
		transform: scale(1);
	}
}

@keyframes historyIntroAni2 {
	0% {
		transform: translateY(100px);
		opacity: 0;
	}
	100% {
		transform: translateY(0);
		opacity: 1;
	}
}

@media screen and (max-width: 1280px) {
	.about .intro-visual .img-wrap .img-box span {
		padding-bottom: calc(1200 / 1920 * 100%);
	}
	/*.about .intro-visual .conts-wrap h2 {font-size:120px;}*/
	.about .intro-visual .scroll-down .obj {
		width: var(--n-60);
		height: var(--n-60);
	}
}

@media screen and (max-width: 768px) {
	.about .intro-visual .img-wrap .img-box span {
		padding-bottom: calc(1400 / 1920 * 100%);
	}
	/*.about .intro-visual .conts-wrap h2 {font-size:80px; letter-spacing:-1.5px;}*/
}

@media screen and (max-width: 648px) {
	.about .intro-visual .conts-wrap h2 {
		font-size: 70px;
	}
	.about .intro-visual .scroll-down {
		bottom: var(--gap-24);
	}
	.about .intro-visual .scroll-down .obj {
		width: var(--n-40);
		height: var(--n-40);
	}
}

@media screen and (max-width: 480px) {
	.about .intro-visual .img-wrap .img-box span {
		padding-bottom: 0;
		height: var(--nvh);
		max-height: 700px;
	}
	/*.about .intro-visual .conts-wrap h2 {font-size:50px; letter-spacing:-1px;}*/
	.about .intro-visual .scroll-down {
		bottom: var(--gap-24);
	}
	.about .intro-visual .scroll-down .obj {
		width: var(--n-40);
		height: var(--n-40);
	}
}

/*********************** history ***********************/

.history .sec-2 {
	width: 100%;
	/* padding: calc(var(--gap-60) * 4) 0; */
	padding: calc((var(--gap-60) * 4) + 52px) 0;
}
.history .sec-2 > .wrap {
	width: 92%;
	max-width: 1400px;
	margin: 0 auto;
}
.history .sec-2 .timeline {
	width: 100%;
	position: relative;
}
.history .sec-2 .timeline .timeline-wrap {
	width: 100%;
	position: relative;
}
.history .sec-2 .timeline .timeline-wrap .timeline-box {
	width: 100%;
	margin-top: calc(var(--gap-60) * 4);
	display: flex;
	color: #fff;
	position: relative;
}
.history .sec-2 .timeline .timeline-wrap .timeline-box:before {
	content: '';
	width: 1px;
	height: calc(100% + (var(--gap-60) * 4));
	background: #333;
	position: absolute;
	left: 50%;
	top: 0;
	transform: translateX(-50%);
}
.history .sec-2 .timeline .timeline-wrap .timeline-box:first-child {
	margin-top: 0;
}
.history .sec-2 .timeline .timeline-wrap .timeline-box:first-child:before {
	height: calc((100% + var(--gap-60) * 4) - var(--gap-32) - var(--n-20));
	top: calc(var(--gap-32) + var(--n-20));
}
.history .sec-2 .timeline .timeline-wrap .timeline-box:last-child:before {
	height: calc(100% - var(--gap-32) + 10px);
}
.history .sec-2 .timeline .timeline-wrap .timeline-box:nth-child(even) {
	flex-direction: row-reverse;
}
.history .sec-2 .timeline .timeline-wrap .timeline-box > * {
	width: 50%;
}

.history .sec-2 .timeline .timeline-wrap .timeline-box .year-box {
	font-family: var(--Poppins);
	font-size: 70px;
	color: rgba(255, 255, 255, 0.5);
	letter-spacing: -1px;
	line-height: 1;
	padding: 0 120px 0 0;
	text-align: right;
}
.history
	.sec-2
	.timeline
	.timeline-wrap
	.timeline-box:nth-child(even)
	.year-box {
	padding: 0 0 0 120px;
	text-align: left;
}
.history .sec-2 .timeline .timeline-wrap .timeline-box.aos-animate .year-box {
	color: rgba(255, 255, 255, 0.5);
}

.history .sec-2 .timeline .timeline-wrap .timeline-box .history-wrap {
	padding: var(--gap-32) 0 0 var(--gap-60);
}
.history
	.sec-2
	.timeline
	.timeline-wrap
	.timeline-box
	.history-wrap
	.history-box {
	width: 100%;
	margin-top: var(--gap-40);
	position: relative;
	display: flex;
	gap: var(--gap-32);
	color: var(--white);
}
.history
	.sec-2
	.timeline
	.timeline-wrap
	.timeline-box
	.history-wrap
	.history-box:first-child {
	margin-top: 0;
}
.history
	.sec-2
	.timeline
	.timeline-wrap
	.timeline-box
	.history-wrap
	.history-box:before {
	content: '';
	width: 10px;
	height: 10px;
	background: var(--white);
	border-radius: 50%;
	position: absolute;
	left: calc((var(--gap-60) + 5px) * -1);
	top: 17px;
	z-index: 10;
}
.history
	.sec-2
	.timeline
	.timeline-wrap
	.timeline-box
	.history-wrap
	.history-box
	.date {
	width: 100px;
	font-family: var(--Poppins);
	font-size: var(--font-24);
	font-weight: 200;
}
.history
	.sec-2
	.timeline
	.timeline-wrap
	.timeline-box
	.history-wrap
	.history-box
	.conts {
	font-size: var(--font-24);
	font-weight: 700;
	width: calc(100% - 100px - var(--gap-32));
}
.history
	.sec-2
	.timeline
	.timeline-wrap
	.timeline-box:nth-child(even)
	.history-wrap {
	padding: var(--gap-32) var(--gap-60) 0 0;
}
.history
	.sec-2
	.timeline
	.timeline-wrap
	.timeline-box:nth-child(even)
	.history-wrap
	.history-box {
	flex-direction: row-reverse;
	text-align: right;
}
.history
	.sec-2
	.timeline
	.timeline-wrap
	.timeline-box:nth-child(even)
	.history-wrap
	.history-box:before {
	left: auto;
	right: calc((var(--gap-60) + 5px) * -1);
}
.history
	.sec-2
	.timeline
	.timeline-wrap
	.timeline-box:nth-child(even)
	.history-wrap
	.history-box
	.date {
	justify-content: flex-end;
}

.history
	.sec-2
	.timeline
	.timeline-wrap
	.timeline-box
	.history-wrap
	.history-box:after {
	content: '';
	width: 1px; /*height:calc(100% + var(--gap-40));*/
	height: 0;
	background: var(--white);
	position: absolute;
	left: calc(var(--gap-60) * -1);
	top: 17px;
	z-index: 1;
	transition: height 0.5s linear;
}
.history
	.sec-2
	.timeline
	.timeline-wrap
	.timeline-box
	.history-wrap
	.history-box.aos-animate:after {
	height: calc(100% + var(--gap-40));
}
.history
	.sec-2
	.timeline
	.timeline-wrap
	.timeline-box
	.history-wrap
	.history-box:last-child.aos-animate:after {
	height: calc(100% + (var(--gap-60) * 4) + 34px);
}
.history
	.sec-2
	.timeline
	.timeline-wrap
	.timeline-box:nth-child(even)
	.history-wrap
	.history-box:after {
	left: auto;
	right: calc(var(--gap-60) * -1);
}

@media screen and (max-width: 1600px) {
	.history .sec-2 .timeline .timeline-wrap .timeline-box .year-box {
		/*font-size:80px;*/
		padding: 0 80px 0 0;
	}
	.history
		.sec-2
		.timeline
		.timeline-wrap
		.timeline-box:nth-child(even)
		.year-box {
		padding: 0 0 0 80px;
	}
}

@media screen and (max-width: 1280px) {
	.history .sec-2 .timeline .timeline-wrap .timeline-box .year-box {
		font-size: 54px;
		padding: 0 60px 0 0;
	}
	.history
		.sec-2
		.timeline
		.timeline-wrap
		.timeline-box:nth-child(even)
		.year-box {
		padding: 0 0 0 60px;
	}
	.history
		.sec-2
		.timeline
		.timeline-wrap
		.timeline-box
		.history-wrap
		.history-box {
		gap: var(--gap-30);
	}
	.history
		.sec-2
		.timeline
		.timeline-wrap
		.timeline-box
		.history-wrap
		.history-box
		.date {
		align-content: center;
		width: 100px;
		font-size: var(--font-30);
	}
	.history
		.sec-2
		.timeline
		.timeline-wrap
		.timeline-box
		.history-wrap
		.history-box
		.conts {
		width: calc(100% - 100px - var(--gap-24));
		font-size: var(--font-30);
	}
}

@media screen and (max-width: 1024px) {
	.history .sec-2 .timeline .timeline-wrap {
		padding-left: var(--gap-60);
	}
	.history .sec-2 .timeline .timeline-wrap .timeline-box,
	.history .sec-2 .timeline .timeline-wrap .timeline-box:nth-child(even) {
		flex-direction: column;
	}
	.history .sec-2 .timeline .timeline-wrap .timeline-box:before {
		left: calc((var(--gap-60) / 2) * -1);
		transform: none;
	}
	.history .sec-2 .timeline .timeline-wrap .timeline-box:first-child:before {
		height: calc(
			(100% + var(--gap-60) * 4) - var(--gap-32) - var(--n-80) -
				var(--n-20)
		);
		top: calc(var(--n-80) + var(--gap-32) + var(--n-20));
	}
	.history .sec-2 .timeline .timeline-wrap .timeline-box > * {
		width: 100%;
	}

	.history .sec-2 .timeline .timeline-wrap .timeline-box .year-box,
	.history
		.sec-2
		.timeline
		.timeline-wrap
		.timeline-box:nth-child(even)
		.year-box {
		text-align: left;
		padding: 0;
	}
	.history .sec-2 .timeline .timeline-wrap .timeline-box .year-box {
		width: 100%;
		height: var(--n-80);
		display: flex;
		align-items: center;
		font-size: var(--font-60);
	}

	.history .sec-2 .timeline .timeline-wrap .timeline-box .history-wrap,
	.history
		.sec-2
		.timeline
		.timeline-wrap
		.timeline-box:nth-child(even)
		.history-wrap {
		padding: var(--gap-32) 0 0 0;
	}
	.history
		.sec-2
		.timeline
		.timeline-wrap
		.timeline-box
		.history-wrap
		.history-box:before,
	.history
		.sec-2
		.timeline
		.timeline-wrap
		.timeline-box:nth-child(even)
		.history-wrap
		.history-box:before {
		left: calc(((var(--gap-60) + 7px) / 2) * -1);
	}
	.history
		.sec-2
		.timeline
		.timeline-wrap
		.timeline-box:nth-child(even)
		.history-wrap
		.history-box:before {
		right: auto;
	}
	.history
		.sec-2
		.timeline
		.timeline-wrap
		.timeline-box:nth-child(even)
		.history-wrap
		.history-box {
		flex-direction: row;
		text-align: left;
	}

	.history
		.sec-2
		.timeline
		.timeline-wrap
		.timeline-box
		.history-wrap
		.history-box:after,
	.history
		.sec-2
		.timeline
		.timeline-wrap
		.timeline-box:nth-child(even)
		.history-wrap
		.history-box:after {
		left: calc(((var(--gap-60) - 1px) / 2) * -1);
		right: auto;
		top: 15px;
	}
	.history
		.sec-2
		.timeline
		.timeline-wrap
		.timeline-box
		.history-wrap
		.history-box:last-child.aos-animate:after {
		height: calc(100% + (var(--gap-60) * 4) + var(--n-80) + var(--gap-32));
	}
	.history
		.sec-2
		.timeline
		.timeline-wrap
		.timeline-box:last-child
		.history-box:last-child.aos-animate:after {
		height: 0;
	}
}

@media screen and (max-width: 768px) {
	.history
		.sec-2
		.timeline
		.timeline-wrap
		.timeline-box
		.history-wrap
		.history-box
		.date {
		width: 90px;
	}
	.history
		.sec-2
		.timeline
		.timeline-wrap
		.timeline-box
		.history-wrap
		.history-box
		.conts {
		width: calc(100% - 90px - var(--gap-32));
	}
	.history
		.sec-2
		.timeline
		.timeline-wrap
		.timeline-box
		.history-wrap
		.history-box:before {
		width: 8px;
		height: 8px;
		top: 15px;
	}
	.history
		.sec-2
		.timeline
		.timeline-wrap
		.timeline-box:nth-child(even)
		.history-wrap
		.history-box:before {
		left: calc(((var(--gap-60) + 6px) / 2) * -1);
	}
}

@media screen and (max-width: 480px) {
	.history
		.sec-2
		.timeline
		.timeline-wrap
		.timeline-box
		.history-wrap
		.history-box,
	.history
		.sec-2
		.timeline
		.timeline-wrap
		.timeline-box:nth-child(even)
		.history-wrap
		.history-box {
		flex-direction: column;
		gap: var(--gap-16);
	}
	.history
		.sec-2
		.timeline
		.timeline-wrap
		.timeline-box
		.history-wrap
		.history-box
		.date,
	.history
		.sec-2
		.timeline
		.timeline-wrap
		.timeline-box
		.history-wrap
		.history-box
		.conts {
		width: 100%;
	}
	.history
		.sec-2
		.timeline
		.timeline-wrap
		.timeline-box:last-child
		.history-box:last-child.aos-animate:after {
		height: 60%;
	}
}

/*********************** organization ***********************/

/*.organization .sec-2 {width:100%; padding:var(--gap-32) 0 calc(var(--gap-100) * 2);}*/
.organization .sec-2 {
	width: 100%;
	padding: calc(var(--gap-100) * 2) 0;
}
.organization .sec-2 > .wrap {
	width: 92%;
	max-width: 1484px;
	margin: 0 auto;
}
.organization .sec-2 .depth-category-container {
	width: 100%;
	margin-bottom: calc(var(--gap-80) * 2);
}
.organization .sec-2 .depth-category-container .depth-category-wrap {
	width: fit-content;
	max-width: 100%;
	padding: 10px;
	background: rgba(255, 255, 255, 0.2);
	border-radius: 100px;
	margin: 0 auto;
	transition: top 0.5s ease;
	top: 0;
}
.organization
	.sec-2
	.depth-category-container
	.depth-category-wrap
	.scroll-wrap {
	width: 100%;
	overflow-x: auto;
	overflow-y: hidden;
}
.organization
	.sec-2
	.depth-category-container
	.depth-category-wrap
	.scroll-wrap::-webkit-scrollbar {
	background: transparent;
	height: 4px;
}
.organization
	.sec-2
	.depth-category-container
	.depth-category-wrap
	.scroll-wrap::-webkit-scrollbar-thumb {
	background: rgba(0, 0, 0, 0.2);
}
.organization
	.sec-2
	.depth-category-container
	.depth-category-wrap
	.depth-category-box {
	display: flex;
	gap: 10px;
	align-items: center;
}
.organization
	.sec-2
	.depth-category-container
	.depth-category-wrap
	.depth-category-box
	.category {
	width: fit-content;
	height: var(--n-40);
	padding: 0 var(--gap-20);
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: var(--font-18);
	color: var(--white);
	font-weight: 500;
	border-radius: 100px;
	background: transparent;
	transition: background 0.3s ease;
	cursor: pointer;
}
.organization
	.sec-2
	.depth-category-container
	.depth-category-wrap
	.depth-category-box
	.category.active,
.organization
	.sec-2
	.depth-category-container
	.depth-category-wrap
	.depth-category-box
	.category:hover {
	background: var(--white);
	color: var(--black);
}

.organization .sec-2 .depth-category-container.fix .depth-category-wrap {
	max-width: 75%;
	position: fixed;
	left: 50%;
	top: 20px;
	transform: translateX(-50%);
	z-index: 1000;
	background: #333;
}

@media screen and (max-width: 648px) {
	.organization .sec-2 .depth-category-container.fix .depth-category-wrap {
		max-width: 60%;
		top: 5px;
	}
}

/*.organization .sec-2 .organization-wrap {width:100%; display:flex; flex-wrap:wrap; gap:calc(var(--gap-60) * 4) 250px; justify-content:space-between; position:relative; z-index:10;}
.organization .sec-2 .organization-wrap .organization-box {width:calc((100% - 250px) / 2); max-width:520px;}*/
.organization .sec-2 .organization-wrap {
	width: 100%;
	display: flex;
	flex-wrap: wrap;
	gap: 0 250px;
	justify-content: space-between;
	position: relative;
	z-index: 10;
}
.organization .sec-2 .organization-wrap .org-wrap {
	width: calc((100% - 250px) / 2);
}
.organization .sec-2 .organization-wrap .org-wrap.rt {
	transform: translateY(calc(120px + (var(--gap-24) * 2)));
}
.organization .sec-2 .organization-wrap .organization-box {
	width: 100%;
	max-width: 580px;
	margin-top: calc(var(--gap-60) * 4);
}
.organization .sec-2 .organization-wrap .organization-box:first-child {
	margin-top: 0;
}
.organization .sec-2 .organization-wrap .organization-box .head {
	width: 100%;
	display: flex;
	align-items: center;
	gap: 10px var(--gap-30);
	margin-bottom: var(--gap-30);
}
.organization .sec-2 .organization-wrap .organization-box .icon {
	flex-shrink: 0;
	width: 120px;
	height: 120px;
	border-radius: 50%;
	background: #1e1e1e;
	position: relative;
}
.organization .sec-2 .organization-wrap .organization-box .icon img {
	display: block;
	object-fit: cover;
	width: 100%;
	height: 100%;
}
.organization .sec-2 .organization-wrap .organization-box .title {
	width: calc(100% - 70px - var(--gap-24));
	display: flex;
	align-items: flex-end;
	gap: var(--gap-20);
}
.organization .sec-2 .organization-wrap .organization-box .title em {
	font-size: 60px;
	font-weight: 700;
	letter-spacing: -1px;
	color: var(--white);
	line-height: 1;
}
.organization .sec-2 .organization-wrap .organization-box .title span {
	font-size: 48px;
	font-weight: 500;
	font-family: var(--Poppins);
	color: rgba(255, 255, 255, 0.3);
	line-height: 1.2;
	letter-spacing: -0.5px;
}
.organization .sec-2 .organization-wrap .organization-box[data-id='cs'] .title,
.organization
	.sec-2
	.organization-wrap
	.organization-box[data-id='judicial']
	.title {
	align-items: center;
}
.organization .sec-2 .organization-wrap .organization-box .conts-box {
	font-size: 24px;
	color: var(--white);
	font-weight: 500;
}
.organization .sec-2 .organization-wrap .organization-box .conts-box .conts {
	width: 100%;
	margin-top: var(--gap-20);
}
.organization
	.sec-2
	.organization-wrap
	.organization-box
	.conts-box
	.conts:first-child {
	margin-top: 0;
}
.organization .sec-2 .organization-wrap .organization-box .txt-conts {
	-webkit-text-stroke-width: 1px;
	-webkit-text-stroke-color: #555;
	color: transparent;
	font-family: var(--Poppins);
	font-size: 80px;
	letter-spacing: -2px;
	line-height: 1.2;
	font-weight: 500;
}
/*.organization .sec-2 .organization-wrap .organization-box:nth-child(even) {transform:translateY(calc(120px + (var(--gap-24) * 2)));}*/

@media screen and (max-width: 1440px) {
	/*.organization .sec-2 .organization-wrap {gap:calc(var(--gap-60) * 4) 140px;}
    .organization .sec-2 .organization-wrap .organization-box {width:calc((100% - 140px) / 2);}*/
	.organization .sec-2 .organization-wrap {
		gap: 0 140px;
	}
	.organization .sec-2 .organization-wrap .org-wrap {
		width: calc((100% - 140px) / 2);
	}
}

@media screen and (max-width: 1280px) {
	/*.organization .sec-2 .organization-wrap {gap:calc(var(--gap-60) * 4) 100px;}
    .organization .sec-2 .organization-wrap .organization-box {width:calc((100% - 100px) / 2); max-width:480px;}*/
	.organization .sec-2 .organization-wrap {
		gap: 0 100px;
	}
	.organization .sec-2 .organization-wrap .org-wrap {
		width: calc((100% - 100px) / 2);
	}
	.organization .sec-2 .organization-wrap .org-wrap.rt {
		transform: translateY(calc(80px + (var(--gap-24) * 2)));
	}
	.organization .sec-2 .organization-wrap .organization-box {
		max-width: 480px;
	}
	.organization .sec-2 .organization-wrap .organization-box .icon {
		width: 60px;
		height: 60px;
	}
	.organization .sec-2 .organization-wrap .organization-box .title {
		width: calc(100% - 60px - var(--gap-24));
	}
	.organization .sec-2 .organization-wrap .organization-box .title em {
		font-size: 70px;
	}
	.organization .sec-2 .organization-wrap .organization-box .title span {
		font-size: 42px;
	}
	.organization .sec-2 .organization-wrap .organization-box .conts-box {
		font-size: 24px;
	}
	.organization .sec-2 .organization-wrap .organization-box .txt-conts {
		font-size: 70px;
	}
	/*.organization .sec-2 .organization-wrap .organization-box:nth-child(even) {transform:translateY(calc(80px + (var(--gap-24) * 2)));}*/
}

@media screen and (max-width: 1024px) {
	/*.organization .sec-2 .organization-wrap {flex-direction:column; gap:calc(var(--gap-60) * 3)}*/
	.organization .sec-2 .organization-wrap {
		flex-direction: column;
		gap: calc(var(--gap-60) * 3);
	}
	.organization .sec-2 .organization-wrap .org-wrap {
		width: 100%;
	}
	.organization .sec-2 .organization-wrap .org-wrap.rt {
		display: none;
	}
	.organization .sec-2 .organization-wrap .organization-box {
		width: 100%;
		display: flex;
		max-width: 100%;
	}
	.organization .sec-2 .organization-wrap .organization-box:nth-child(even) {
		transform: none;
		justify-content: flex-end;
	}
	.organization .sec-2 .organization-wrap .organization-box .txt-conts .br {
		display: inline-block;
		margin-left: -12px;
	}
	.organization
		.sec-2
		.organization-wrap
		.organization-box
		.txt-conts
		.hypen {
		display: none;
	}
}

@media screen and (max-width: 648px) {
	.organization .sec-2 .organization-wrap .organization-box .icon {
		width: var(--n-60);
		height: var(--n-60);
	}
	.organization .sec-2 .organization-wrap .organization-box .title {
		width: calc(100% - var(--n-60) - var(--gap-24));
	}
	.organization .sec-2 .organization-wrap .organization-box .title em {
		font-size: calc(var(--font-60) * 1.2);
	}
	.organization .sec-2 .organization-wrap .organization-box .title span {
		font-size: calc(var(--font-80) * 0.65);
	}
	.organization .sec-2 .organization-wrap .organization-box .conts-box {
		font-size: var(--font-24);
	}
	.organization .sec-2 .organization-wrap .organization-box .txt-conts {
		font-size: var(--font-80);
	}
	.organization .sec-2 .organization-wrap .organization-box .txt-conts .br {
		margin-left: -8px;
	}
	.organization
		.sec-2
		.organization-wrap
		.organization-box
		.conts-box
		.conts
		.br {
		display: none;
	}
}

@media screen and (max-width: 480px) {
	.organization .sec-2 .organization-wrap .organization-box .icon {
		width: var(--n-50);
		height: var(--n-50 - var(--gap-24));
	}
	.organization .sec-2 .organization-wrap .organization-box .title {
		width: calc(100% - var(--n-50));
	}
}

.portfolio-view .sec-1 .visual {
	width: 100%;
}
.portfolio-view .sec-1 .visual span {
	display: block;
	width: 100%;
	height: 0;
	padding-bottom: calc(973 / 1920 * 100%);
	position: relative;
	transition: 0.3s ease;
}
.portfolio-view .sec-1 .visual span img {
	width: 100%;
	height: 100%;
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	object-fit: cover;
}

@media screen and (max-width: 1280px) {
	.portfolio-view .sec-1 .visual span {
		padding-bottom: calc(1200 / 1920 * 100%);
	}
}

@media screen and (max-width: 768px) {
	.portfolio-view .sec-1 .visual span {
		padding-bottom: calc(1600 / 1920 * 100%);
	}
}

@media screen and (max-width: 480px) {
	.portfolio-view .sec-1 .visual span {
		padding-bottom: 0;
		height: var(--nvh);
		max-height: 700px;
	}
}

.portfolio-view .sec-2 {
	padding: calc(var(--gap-60) * 4) 0;
}
.portfolio-view .sec-2 > .wrap {
	width: 92%;
	max-width: 1520px;
	margin: 0 auto;
}
.portfolio-view .sec-2 .project-info-wrap {
	width: 100%;
	display: flex;
	justify-content: space-between;
	color: var(--white);
	gap: 120px;
}
.portfolio-view .sec-2 .project-info-wrap > * {
	width: calc((100% - 120px) / 2);
}
.portfolio-view .sec-2 .project-info-wrap .title-wrap > * {
	display: block;
}
.portfolio-view .sec-2 .project-info-wrap .title-wrap span {
	font-family: var(--Poppins);
	font-weight: 200;
	font-size: var(--font-30);
	line-height: 1.2;
	margin-bottom: var(--gap-32);
}
.portfolio-view .sec-2 .project-info-wrap .title-wrap em {
	font-size: var(--font-60);
	font-weight: 800;
	line-height: 1.3;
}
.portfolio-view .sec-2 .project-info-wrap .info-wrap .info-container {
	width: 100%;
	padding: 80px 80px 230px 80px;
	background: #1e1e1e;
	opacity: 0;
	transform: translateY(100px);
	transition: 0.5s ease;
}
.portfolio-view .sec-2 .project-info-wrap .info-wrap .info-container .info-box {
	width: 100%;
	margin-top: calc(var(--gap-40) * 2);
	opacity: 0;
	transform: translateY(50px);
	transition: transform 0.5s ease, opacity 0.5s ease;
	transition-delay: 0.6s;
}
.portfolio-view
	.sec-2
	.project-info-wrap
	.info-wrap
	.info-container
	.info-box:first-child {
	margin-top: 0;
}
.portfolio-view
	.sec-2
	.project-info-wrap
	.info-wrap
	.info-container
	.info-box
	.head {
	width: 100%;
	font-family: var(--Poppins);
	font-size: var(--font-20);
	margin-bottom: var(--gap-16);
}
.portfolio-view
	.sec-2
	.project-info-wrap
	.info-wrap
	.info-container
	.info-box
	.conts {
	width: 100%;
	font-size: var(--font-30);
	font-weight: 700;
	line-height: 1.3;
}
.portfolio-view
	.sec-2
	.project-info-wrap
	.info-wrap
	.info-container
	.info-box
	.conts
	ul
	li {
	display: flex;
	gap: 30px;
	margin-top: var(--gap-16);
}
.portfolio-view
	.sec-2
	.project-info-wrap
	.info-wrap
	.info-container
	.info-box
	.conts
	ul
	li:first-child {
	margin-top: 0;
}
.portfolio-view
	.sec-2
	.project-info-wrap
	.info-wrap
	.info-container
	.info-box
	.conts
	ul
	li
	span {
	font-weight: 500;
	width: 120px;
}
.portfolio-view
	.sec-2
	.project-info-wrap
	.info-wrap
	.info-container
	.info-box
	.conts
	ul
	li
	em {
	font-weight: 700;
	width: calc(100% - 150px);
}
.portfolio-view
	.sec-2
	.project-info-wrap
	.info-wrap.aos-animate
	.info-container {
	opacity: 1;
	transform: translateY(0);
}
.portfolio-view
	.sec-2
	.project-info-wrap
	.info-wrap.aos-animate
	.info-container
	.info-box {
	opacity: 1;
	transform: translateY(0);
}

@media screen and (max-width: 1320px) {
	.portfolio-view .sec-2 .project-info-wrap {
		gap: 60px;
	}
	.portfolio-view .sec-2 .project-info-wrap > * {
		width: calc((100% - 60px) / 2);
	}
	.portfolio-view .sec-2 .project-info-wrap .info-wrap .info-container {
		padding: 60px 60px 180px 60px;
	}
}

@media screen and (max-width: 1280px) {
	.portfolio-view .sec-2 .project-info-wrap .title-wrap span {
		font-size: 24px;
	}
	.portfolio-view .sec-2 .project-info-wrap .title-wrap em {
		font-size: 46px;
	}
	.portfolio-view
		.sec-2
		.project-info-wrap
		.info-wrap
		.info-container
		.info-box
		.head {
		font-size: 16px;
	}
	.portfolio-view
		.sec-2
		.project-info-wrap
		.info-wrap
		.info-container
		.info-box
		.conts {
		font-size: 24px;
	}
	.portfolio-view
		.sec-2
		.project-info-wrap
		.info-wrap
		.info-container
		.info-box
		.conts
		ul
		li {
		gap: 20px;
	}
	.portfolio-view
		.sec-2
		.project-info-wrap
		.info-wrap
		.info-container
		.info-box
		.conts
		ul
		li
		span {
		width: 100px;
	}
	.portfolio-view
		.sec-2
		.project-info-wrap
		.info-wrap
		.info-container
		.info-box
		.conts
		ul
		li
		em {
		width: calc(100% - 120px);
	}
}

@media screen and (max-width: 1024px) {
	.portfolio-view .sec-2 .project-info-wrap {
		flex-direction: column;
		gap: var(--gap-60);
	}
	.portfolio-view .sec-2 .project-info-wrap > * {
		width: 100%;
	}
	.portfolio-view .sec-2 .project-info-wrap .title-wrap {
		text-align: center;
	}
	.portfolio-view .sec-2 .project-info-wrap .title-wrap span {
		font-size: var(--font-24);
	}
	.portfolio-view .sec-2 .project-info-wrap .title-wrap em {
		font-size: var(--font-40);
	}
	.portfolio-view
		.sec-2
		.project-info-wrap
		.info-wrap
		.info-container
		.info-box
		.head {
		font-size: var(--font-16);
	}
	.portfolio-view
		.sec-2
		.project-info-wrap
		.info-wrap
		.info-container
		.info-box
		.conts {
		font-size: var(--font-24);
	}
}

@media screen and (max-width: 648px) {
	.portfolio-view .sec-2 .project-info-wrap .info-wrap .info-container {
		padding: 40px 40px 120px 40px;
	}
	.portfolio-view
		.sec-2
		.project-info-wrap
		.info-wrap
		.info-container
		.info-box
		.conts
		ul
		li {
		gap: 20px;
	}
	.portfolio-view
		.sec-2
		.project-info-wrap
		.info-wrap
		.info-container
		.info-box
		.conts
		ul
		li
		span {
		width: 80px;
	}
	.portfolio-view
		.sec-2
		.project-info-wrap
		.info-wrap
		.info-container
		.info-box
		.conts
		ul
		li
		em {
		width: calc(100% - 100px);
	}
}

@media screen and (max-width: 480px) {
	.portfolio-view .sec-2 .project-info-wrap .info-wrap .info-container {
		padding: 30px 30px 90px 30px;
	}
	.portfolio-view
		.sec-2
		.project-info-wrap
		.info-wrap
		.info-container
		.info-box
		.conts
		ul
		li {
		gap: 10px;
	}
	.portfolio-view
		.sec-2
		.project-info-wrap
		.info-wrap
		.info-container
		.info-box
		.conts
		ul
		li
		span {
		width: 70px;
	}
	.portfolio-view
		.sec-2
		.project-info-wrap
		.info-wrap
		.info-container
		.info-box
		.conts
		ul
		li
		em {
		width: calc(100% - 80px);
	}
}

.portfolio-view {
	width: 100%;
}

.portfolio-view .com-layout-wrap {
	width: 100%;
	max-width: 1920px;
	margin: 0 auto;
}
.portfolio-view .com-layout-wrap .img-box {
	width: 100%;
	position: relative;
	overflow: hidden;
}
.portfolio-view .com-layout-wrap .img-box span {
	display: block;
	width: 100%;
	height: 0;
	padding-bottom: calc(973 / 1920 * 100%);
	position: relative;
	transition: 0.3s ease;
	z-index: 1;
}
.portfolio-view .com-layout-wrap .img-box span img {
	display: block;
	width: 100%;
	height: 100%;
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	object-fit: cover;
}
.portfolio-view .com-layout-wrap .img-box .mask {
	width: 100%;
	height: 100%;
	background: var(--black);
	position: absolute;
	left: 0;
	top: 0;
	z-index: 2;
	transition: 0.7s ease;
}
.portfolio-view .com-layout-wrap .img-box.aos-animate .mask {
	transform: translateX(100%);
}
.portfolio-view .com-layout-wrap .conts-box {
	width: 80%;
	max-width: 1000px;
	background: rgba(255, 255, 255, 0.6);
	padding: 60px;
	position: relative;
	z-index: 10;
	opacity: 0;
	margin-top: 100px;
	transition: 0.5s ease;
}
.portfolio-view .com-layout-wrap .conts-box.aos-animate {
	opacity: 1;
	margin-top: 0;
}
.portfolio-view .com-layout-wrap .conts-box .title-box {
	width: 100%;
	display: flex;
	gap: 40px;
	opacity: 0;
	transform: translateY(50px);
	transition: 0.5s ease;
	transition-delay: 0.5s;
}
.portfolio-view .com-layout-wrap .conts-box .title-box span {
	width: 40px;
	font-family: var(--Poppins);
	color: var(--gray-9);
	font-size: 30px;
}
.portfolio-view .com-layout-wrap .conts-box .title-box em {
	font-size: 50px;
	font-weight: 700;
	line-height: 1.2;
}
.portfolio-view .com-layout-wrap .conts-box .conts {
	width: 100%;
	margin-top: var(--gap-40);
	padding-left: 80px;
	font-size: 30px;
	color: #333;
	opacity: 0;
	transform: translateY(50px);
	transition: 0.5s ease;
	transition-delay: 0.7s;
}
.portfolio-view .com-layout-wrap .conts-box.aos-animate .title-box,
.portfolio-view .com-layout-wrap .conts-box.aos-animate .conts {
	opacity: 1;
	transform: translateY(0);
}
.portfolio-view .com-layout-wrap.typeA .conts-box {
	transform: translate(100px, -50%);
}
.portfolio-view .com-layout-wrap.typeB .conts-box {
	transform: translateY(-50%);
	margin-left: auto;
	margin-right: 100px;
}

@media screen and (max-width: 1280px) {
	.portfolio-view .com-layout-wrap .img-box span {
		padding-bottom: calc(1200 / 1920 * 100%);
	}
	.portfolio-view .com-layout-wrap .conts-box {
		padding: 40px;
	}
	.portfolio-view .com-layout-wrap.typeA .conts-box {
		transform: translate(8%, -50%);
	}
	.portfolio-view .com-layout-wrap.typeB .conts-box {
		margin-right: 8%;
	}
	.portfolio-view .com-layout-wrap .conts-box .title-box {
		gap: 30px;
	}
	.portfolio-view .com-layout-wrap .conts-box .title-box span {
		width: 35px;
		font-size: var(--font-20);
	}
	.portfolio-view .com-layout-wrap .conts-box .title-box em {
		font-size: calc(var(--font-60) * 0.8);
	}
	.portfolio-view .com-layout-wrap .conts-box .conts {
		font-size: var(--font-20);
		padding-left: 65px;
	}
}

@media screen and (max-width: 768px) {
	.portfolio-view .com-layout-wrap .img-box span {
		padding-bottom: calc(1600 / 1920 * 100%);
	}
	.portfolio-view .com-layout-wrap .conts-box .title-box {
		gap: 20px;
	}
	.portfolio-view .com-layout-wrap .conts-box .title-box span {
		width: 30px;
	}
	.portfolio-view .com-layout-wrap .conts-box .conts {
		padding-left: 50px;
	}
}

@media screen and (max-width: 480px) {
	.portfolio-view .com-layout-wrap .img-box span {
		padding-bottom: 0;
		height: calc(var(--nvh) * 0.7);
		max-height: 400px;
	}
	.portfolio-view .com-layout-wrap .conts-box {
		padding: 25px;
	}
	.portfolio-view .com-layout-wrap .conts-box .title-box {
		gap: 15px;
	}
	.portfolio-view .com-layout-wrap .conts-box .title-box em {
		font-size: calc(var(--font-60) * 0.7);
	}
	.portfolio-view .com-layout-wrap .conts-box .conts {
		padding-left: 45px;
		margin-top: var(--gap-24);
	}
}

.portfolio-view .sec-4 {
	width: 100%;
	padding-bottom: calc(var(--gap-60) * 4);
	overflow: hidden;
}
.portfolio-view .sec-4 > .wrap {
	width: 100%;
	position: relative;
}
.portfolio-view .sec-4 .project-img-wrap {
	width: 85%;
	max-width: 1420px;
	position: relative;
	margin: 0 auto;
	display: flex;
	justify-content: space-between;
	gap: var(--gap-40);
	z-index: 10;
}
.portfolio-view .sec-4 .project-img-wrap .img-box {
	flex: 1;
	max-width: 615px;
}
.portfolio-view .sec-4 .project-img-wrap .img-box span {
	display: block;
	width: 100%;
	height: 0;
	padding-bottom: calc(769 / 615 * 100%);
	position: relative;
}
.portfolio-view .sec-4 .project-img-wrap .img-box span img {
	display: block;
	width: 100%;
	height: 100%;
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	object-fit: cover;
}
.portfolio-view .sec-4 .project-img-wrap .img-box:first-child {
	margin-top: 20%;
}
.portfolio-view .sec-4 .txt-line {
	width: 100%;
	height: 100%;
	position: absolute;
	left: 0;
	top: 0;
	z-index: 0;
	display: flex;
	align-items: center;
	font-size: calc(var(--font-30) * 5);
	font-family: var(--Poppins);
	color: rgba(255, 255, 255, 0.2);
	font-weight: 500;
	overflow: hidden;
}
.portfolio-view .sec-4 .txt-line .line-wrap {
	width: fit-content;
	display: flex;
	align-items: center;
	justify-content: center;
}
.portfolio-view .sec-4 .txt-line p {
	white-space: nowrap;
}

@media screen and (max-width: 1280px) {
	.portfolio-view .sec-4 .txt-line {
		font-size: 100px;
	}
}

@media screen and (max-width: 768px) {
	.portfolio-view .sec-4 .txt-line {
		font-size: 80px;
	}
}

@media screen and (max-width: 648px) {
	.portfolio-view .sec-4 .txt-line {
		font-size: 50px;
	}
}

@media screen and (max-width: 480px) {
	.portfolio-view .sec-4 .txt-line {
		font-size: 30px;
	}
}

.portfolio-view .sec-6 {
	width: 100%;
	padding-bottom: calc(var(--gap-60) * 4);
	overflow: hidden;
}
.portfolio-view .sec-6 > .wrap {
	width: 100%;
	position: relative;
}
.portfolio-view .sec-6 .project-img-cont-wrap {
	width: 92%;
	max-width: 1550px;
	position: relative;
	margin: 0 auto;
	display: flex;
	justify-content: space-between;
	gap: 150px 150px;
	z-index: 10;
	flex-wrap: wrap;
	padding-bottom: 5%;
}
.portfolio-view .sec-6 .project-img-cont-wrap .layout-box {
	width: calc((100% - 150px) / 2);
	max-width: 700px;
}
.portfolio-view .sec-6 .project-img-cont-wrap .layout-box .img-box {
	width: 100%;
	opacity: 0;
	transform: translateY(80px);
	transition: 0.7s ease;
}
.portfolio-view .sec-6 .project-img-cont-wrap .layout-box .img-box span {
	display: block;
	width: 100%;
	height: 0;
	padding-bottom: calc(500 / 700 * 100%);
	position: relative;
}
.portfolio-view .sec-6 .project-img-cont-wrap .layout-box .img-box span img {
	display: block;
	width: 100%;
	height: 100%;
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	object-fit: cover;
}
.portfolio-view .sec-6 .project-img-cont-wrap .layout-box .conts-box {
	width: 100%;
	margin-top: var(--gap-32);
	opacity: 0;
	transform: translateY(80px);
	transition: 0.7s ease;
}
.portfolio-view .sec-6 .project-img-cont-wrap .layout-box .conts-box > * {
	display: block;
}
.portfolio-view .sec-6 .project-img-cont-wrap .layout-box .conts-box span {
	font-family: var(--Poppins);
	font-size: 30px;
	font-weight: 500;
	color: var(--gray-9);
}
.portfolio-view .sec-6 .project-img-cont-wrap .layout-box .conts-box em {
	font-size: 40px;
	font-weight: 700;
	color: var(--white);
}
.portfolio-view .sec-6 .project-img-cont-wrap .layout-box .img-box.aos-animate,
.portfolio-view
	.sec-6
	.project-img-cont-wrap
	.layout-box
	.conts-box.aos-animate {
	opacity: 1;
	transform: translateY(0);
}
.portfolio-view .sec-6 .project-img-cont-wrap .layout-box:nth-child(odd) {
	padding-top: 1%;
}
.portfolio-view .sec-6 .project-img-cont-wrap .layout-box:nth-child(even) {
	transform: translateY(25%);
}
.portfolio-view .sec-6 .project-img-cont-wrap .layout-box:nth-child(1),
.portfolio-view
	.sec-6
	.project-img-cont-wrap
	.layout-box:nth-child(n + 4):nth-child(4n + 1) {
	transform: translateX(5%);
}
.portfolio-view .sec-6 .project-img-cont-wrap .layout-box:nth-child(2),
.portfolio-view
	.sec-6
	.project-img-cont-wrap
	.layout-box:nth-child(n + 4):nth-child(4n + 2) {
	transform: translate(5%, 25%);
}
.portfolio-view .sec-6 .project-img-cont-wrap .layout-box:nth-child(3),
.portfolio-view
	.sec-6
	.project-img-cont-wrap
	.layout-box:nth-child(n + 5):nth-child(3n + 1) {
	transform: translateX(-5%);
}
.portfolio-view .sec-6 .project-img-cont-wrap .layout-box:nth-child(4),
.portfolio-view
	.sec-6
	.project-img-cont-wrap
	.layout-box:nth-child(n + 5):nth-child(4n) {
	transform: translate(-5%, 25%);
}

@media screen and (max-width: 1500px) {
	.portfolio-view .sec-6 .project-img-cont-wrap {
		gap: 150px 100px;
	}
	.portfolio-view .sec-6 .project-img-cont-wrap .layout-box {
		width: calc((100% - 100px) / 2);
	}
}

@media screen and (max-width: 1024px) {
	.portfolio-view .sec-6 .project-img-cont-wrap .layout-box .conts-box span {
		font-size: 20px;
	}
	.portfolio-view .sec-6 .project-img-cont-wrap .layout-box .conts-box em {
		font-size: 32px;
	}
}

@media screen and (max-width: 900px) {
	.portfolio-view .sec-6 .project-img-cont-wrap {
		flex-direction: column;
		gap: calc(var(--gap-40) * 3);
	}
	.portfolio-view .sec-6 .project-img-cont-wrap .layout-box {
		width: 90%;
	}
	.portfolio-view .sec-6 .project-img-cont-wrap .layout-box:nth-child(odd) {
		padding-top: 0;
	}
	.portfolio-view .sec-6 .project-img-cont-wrap .layout-box:nth-child(even),
	.portfolio-view .sec-6 .project-img-cont-wrap .layout-box:nth-child(1),
	.portfolio-view
		.sec-6
		.project-img-cont-wrap
		.layout-box:nth-child(n + 4):nth-child(4n + 1),
	.portfolio-view .sec-6 .project-img-cont-wrap .layout-box:nth-child(2),
	.portfolio-view
		.sec-6
		.project-img-cont-wrap
		.layout-box:nth-child(n + 4):nth-child(4n + 2),
	.portfolio-view .sec-6 .project-img-cont-wrap .layout-box:nth-child(3),
	.portfolio-view
		.sec-6
		.project-img-cont-wrap
		.layout-box:nth-child(n + 5):nth-child(3n + 1),
	.portfolio-view .sec-6 .project-img-cont-wrap .layout-box:nth-child(4),
	.portfolio-view
		.sec-6
		.project-img-cont-wrap
		.layout-box:nth-child(n + 5):nth-child(4n) {
		transform: none;
	}
	.portfolio-view .sec-6 .project-img-cont-wrap .layout-box:nth-child(even) {
		margin-left: auto;
		margin-right: 0;
	}
	.portfolio-view .sec-6 .project-img-cont-wrap .layout-box .conts-box span {
		font-size: var(--font-24);
	}
	.portfolio-view .sec-6 .project-img-cont-wrap .layout-box .conts-box em {
		font-size: var(--font-40);
	}
}

.portfolio-view .sec-7 {
	padding-bottom: calc(var(--gap-60) * 3);
}
.portfolio-view .sec-7 > .wrap {
	width: 100%;
	max-width: 1920px;
	margin: 0 auto;
}
.portfolio-view .sec-7 .project-detail-conts {
	width: 100%;
}
.portfolio-view .sec-7 .project-detail-conts .img-slide-wrap {
	width: 100%;
	position: relative;
	opacity: 0;
	transform: translateY(100px);
	transition: 0.8s ease;
}
.portfolio-view
	.sec-7
	.project-detail-conts
	.img-slide-wrap
	ul.project-img-list {
	width: 100%;
}
.portfolio-view
	.sec-7
	.project-detail-conts
	.img-slide-wrap
	ul.project-img-list
	li {
	width: 100%;
	line-height: 0;
}
.portfolio-view
	.sec-7
	.project-detail-conts
	.img-slide-wrap
	ul.project-img-list
	li
	span {
	display: block;
	width: 100%;
	height: 0;
	padding-bottom: calc(700 / 1920 * 100%);
	position: relative;
}
.portfolio-view
	.sec-7
	.project-detail-conts
	.img-slide-wrap
	ul.project-img-list
	li
	span
	img {
	display: block;
	width: 100%;
	height: 100%;
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	object-fit: cover;
}
.portfolio-view .sec-7 .project-detail-conts .img-slide-wrap .slide-control {
	width: 100%;
	position: absolute;
	left: 0;
	bottom: var(--gap-40);
	display: flex;
	align-items: center;
	justify-content: center;
	gap: var(--gap-20);
}
.portfolio-view
	.sec-7
	.project-detail-conts
	.img-slide-wrap
	.slide-control
	button {
	width: var(--n-40);
	height: var(--n-40);
	position: relative;
	font-size: 0;
}
.portfolio-view
	.sec-7
	.project-detail-conts
	.img-slide-wrap
	.slide-control
	button:after {
	content: '';
	width: 100%;
	height: 100%;
	background: url(/img/com/arrow_right.svg) center no-repeat;
	position: absolute;
	left: 0;
	top: 0;
	background-size: cover;
}
.portfolio-view
	.sec-7
	.project-detail-conts
	.img-slide-wrap
	.slide-control
	button.btn-slide-prev:after {
	transform: scaleX(-1);
}
.portfolio-view
	.sec-7
	.project-detail-conts
	.img-slide-wrap
	.slide-control
	.slide-counter {
	font-size: var(--font-30);
	font-family: var(--Poppins);
	font-weight: 200;
}
.portfolio-view
	.sec-7
	.project-detail-conts
	.img-slide-wrap
	.slide-control
	.slide-counter
	.current {
	font-weight: 600;
}
.portfolio-view .sec-7 .project-detail-conts.aos-animate .img-slide-wrap {
	opacity: 1;
	transform: translateY(0);
}

@media screen and (max-width: 1024px) {
	.portfolio-view
		.sec-7
		.project-detail-conts
		.img-slide-wrap
		ul.project-img-list
		li
		span {
		padding-bottom: calc(900 / 1920 * 100%);
	}
}

@media screen and (max-width: 648px) {
	.portfolio-view
		.sec-7
		.project-detail-conts
		.img-slide-wrap
		ul.project-img-list
		li
		span {
		padding-bottom: calc(1000 / 1920 * 100%);
	}
}

@media screen and (max-width: 480px) {
	.portfolio-view
		.sec-7
		.project-detail-conts
		.img-slide-wrap
		.slide-control {
		bottom: 20px;
		gap: 10px;
	}
	.portfolio-view
		.sec-7
		.project-detail-conts
		.img-slide-wrap
		.slide-control.portfolio-view
		.sec-7
		.project-detail-conts
		.img-slide-wrap
		.slide-control
		button {
		width: 30px;
		height: 30px;
	}
	.portfolio-view
		.sec-7
		.project-detail-conts
		.img-slide-wrap
		.slide-control
		.slide-counter {
		font-size: var(--font-20);
	}
}

.portfolio-view .sec-7 .project-detail-conts .detail-conts {
	width: 90%;
	max-width: 1560px;
	margin: 0 auto;
	margin-top: var(--gap-40);
	display: flex;
	gap: var(--gap-32);
	opacity: 0;
	transform: translateY(100px);
	transition: 0.8s ease;
	transition-delay: 0.3s;
}
.portfolio-view .sec-7 .project-detail-conts .detail-conts > * {
	width: calc((100% - var(--gap-32)) / 2);
	color: var(--white);
}
.portfolio-view .sec-7 .project-detail-conts .detail-conts .tlt {
	font-size: 50px;
	font-weight: 700;
}
.portfolio-view .sec-7 .project-detail-conts .detail-conts .conts {
	font-size: var(--font-30);
}
.portfolio-view .sec-7 .project-detail-conts.aos-animate .detail-conts {
	opacity: 1;
	transform: translateY(0);
}

@media screen and (max-width: 1280px) {
	.portfolio-view .sec-7 .project-detail-conts .detail-conts .tlt {
		font-size: 42px;
	}
	.portfolio-view .sec-7 .project-detail-conts .detail-conts .conts {
		font-size: var(--font-24);
	}
}

@media screen and (max-width: 1024px) {
	.portfolio-view .sec-7 .project-detail-conts .detail-conts {
		flex-direction: column;
	}
	.portfolio-view .sec-7 .project-detail-conts .detail-conts > * {
		width: 100%;
		text-align: center;
	}
	.portfolio-view .sec-7 .project-detail-conts .detail-conts .tlt {
		font-size: calc(var(--font-60) * 0.8);
	}
}

.about-intro {
	visibility: hidden;
	opacity: 0;
	transition: visibility 1s ease-in-out, opacity 1s ease-in-out;
	overscroll-behavior: none;
	background: url(/img/conts/about_intro_bg.png) center no-repeat;
	background-size: cover;
}
.about-intro.active {
	visibility: visible;
	opacity: 1;
}

.about-intro .about-intro-container {
	width: 100%;
	height: var(--nvh);
	height: calc(var(--vh, 1vh) * 100);
	display: flex;
	align-items: center;
	justify-content: center;
}
.about-intro .about-intro-container .about-intro-inner {
	width: 100%;
	max-width: 600px;
	margin: 0 auto;
	display: flex;
	align-items: center;
	justify-content: center;
	height: 100%;
}
.about-intro .about-intro-wrap {
	display: flex;
	justify-content: center;
	align-items: center;
	position: relative;
	overflow: hidden;
	width: 100%;
	aspect-ratio: 16/9;
	perspective: 100vmax;
	padding-bottom: var(--n-80);
}
.about-intro .about-intro-wrap ul.gall {
	position: relative;
	width: 55vmin;
	aspect-ratio: 5/3.5;
	max-width: 800px;
	transform-style: preserve-3d;
}
.about-intro .about-intro-wrap ul.gall li.gall-item {
	position: absolute;
	width: 100%;
	height: 100%;
	backdrop-filter: blur(5px);
	user-select: none;
	-webkit-box-reflect: below 0px
		linear-gradient(to bottom, transparent 50%, #0004);
}
.about-intro .about-intro-wrap ul.gall li.gall-item .img-box {
	width: 100%;
	height: 100%;
	position: relative;
	z-index: 10;
}
.about-intro .about-intro-wrap ul.gall li.gall-item .img-box:after {
	content: '';
	width: 100%;
	height: 100%;
	background: rgba(0, 0, 0, 0.5);
	position: absolute;
	left: 0;
	top: 0;
}
.about-intro .about-intro-wrap ul.gall li.gall-item .img-box span {
	display: block;
	width: 100%;
	height: 100%;
	position: relative;
}
.about-intro .about-intro-wrap ul.gall li.gall-item .img-box span img {
	width: 100%;
	height: 100%;
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	object-fit: cover;
}
.about-intro .about-intro-wrap ul.gall li.gall-item .title-box {
	width: 100%;
	height: 100%;
	position: absolute;
	left: 0;
	top: 0;
	z-index: 11;
	display: flex;
	align-items: center;
	justify-content: center;
	visibility: hidden;
	opacity: 0;
	transition: 1s ease;
}
.about-intro .about-intro-wrap ul.gall li.gall-item .title-box .title {
	width: 100%;
	text-align: center;
	color: var(--white);
}
.about-intro .about-intro-wrap ul.gall li.gall-item .title-box .title span {
	display: block;
	font-size: var(--font-24);
	font-family: var(--Poppins);
	font-weight: 200;
}
.about-intro .about-intro-wrap ul.gall li.gall-item .title-box .title h2 {
	display: flex;
	align-items: center;
	justify-content: center;
	column-gap: 20px;
	font-size: calc(var(--font-60) * 0.85);
	font-weight: 700;
	line-height: 1.3;
}
.about-intro
	.about-intro-wrap
	ul.gall
	li.gall-item
	.title-box
	.title
	h2
	i[class^='icon'] {
	width: 94px;
	height: 54px;
	background-size: cover;
	filter: invert(0);
}
.about-intro .about-intro-wrap ul.gall li.gall-item a {
	width: 100%;
	height: 100%;
	position: absolute;
	left: 0;
	top: 0;
	z-index: 12;
	/* visibility: hidden; */
	/* opacity: 0; */
}
.about-intro .about-intro-wrap ul.gall li.gall-item.active .title-box,
.about-intro .about-intro-wrap ul.gall li.gall-item.active a {
	visibility: visible;
	opacity: 1;
}
.about-intro .about-intro-wrap ul.gall li.gall-item.next-item .next-area {
	display: none;
	width: 100%;
	height: 100%;
	position: absolute;
	left: 0;
	top: 0;
	z-index: 20;
	cursor: pointer;
}
.about-intro .about-intro-wrap ul.gall li.gall-item.prev-item .prev-area {
	display: none;
	width: 100%;
	height: 100%;
	position: absolute;
	left: 0;
	top: 0;
	z-index: 20;
	cursor: pointer;
}
.about-intro .about-intro-wrap .arrow-button-wrap {
	width: 100%;
	position: absolute;
	left: 0;
	bottom: calc(var(--footerH) + var(--gap-80));
	display: flex;
	align-items: center;
	justify-content: center;
	gap: var(--gap-32);
}
.about-intro .about-intro-wrap .arrow-button-wrap .arrow-cursor {
	width: var(--n-80);
	height: var(--n-80);
	background: rgba(0, 0, 0, 0.5);
	border: 1px solid rgba(255, 255, 255, 0.3);
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	font-size: 0;
	position: relative;
}
.about-intro .about-intro-wrap .arrow-button-wrap .arrow-cursor:before {
	content: '';
	width: calc(100% - 10px);
	height: calc(100% - 10px);
	border-radius: 50%;
	background: rgba(255, 255, 255, 0.7);
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	z-index: 0;
}
.about-intro .about-intro-wrap .arrow-button-wrap .arrow-cursor:after {
	content: '';
	width: 100%;
	height: 100%;
	background: url(/img/com/arrow_left.svg) center no-repeat;
	background-size: auto 40%;
	position: absolute;
	left: 0;
	top: 0;
	opacity: 0.8;
	z-index: 1;
}
.about-intro
	.about-intro-wrap
	.arrow-button-wrap
	.arrow-cursor.arrow-next-cursor:after {
	transform: scaleX(-1);
}

@media screen and (max-width: 2500px) {
	.about-intro .about-intro-wrap ul.gall {
		width: 45vmin;
	}
}

@media screen and (max-width: 1440px) {
	.about-intro .about-intro-wrap ul.gall {
		width: 43vmin;
	}
}

@media screen and (max-width: 1024px) {
	.about-intro .about-intro-wrap {
		width: 100%;
		aspect-ratio: 1; /*height:var(--nvh);*/
	}
	.about-intro .about-intro-wrap ul.gall {
		width: 30vmin;
		aspect-ratio: 5/4;
		max-width: 650px;
		transform-style: preserve-3d;
	}
}

@media screen and (max-width: 768px) {
	.about-intro .about-intro-wrap ul.gall li.gall-item .title-box .title span {
		font-size: var(--font-20);
	}
	.about-intro .about-intro-wrap ul.gall li.gall-item .title-box .title h2 {
		column-gap: 8px;
		font-size: var(--font-32);
	}
	.about-intro
		.about-intro-wrap
		ul.gall
		li.gall-item
		.title-box
		.title
		h2
		i[class^='icon'] {
		width: 38px;
		height: 22px;
	}
}

@media screen and (max-width: 480px) {
	.about-intro .about-intro-wrap ul.gall li.gall-item .title-box .title span {
		font-size: var(--font-16);
	}
	.about-intro .about-intro-wrap ul.gall li.gall-item .title-box .title h2 {
		column-gap: 5px;
		font-size: var(--font-28);
	}
	.about-intro
		.about-intro-wrap
		ul.gall
		li.gall-item
		.title-box
		.title
		h2
		i[class^='icon'] {
		width: 24px;
		height: 14px;
	}
	.about-intro .about-intro-wrap .arrow-button-wrap {
		bottom: calc(var(--footerH) + var(--gap-40));
	}
	.about-intro .about-intro-wrap .arrow-button-wrap .arrow-cursor {
		width: var(--n-60);
		height: var(--n-60);
	}
}

.about-intro .aboutus-intro-wrap {
	width: 70%;
	border: 2px solid red;
}
[carousel='wrap'] {
	will-change: contents;
	--3d-carousel-item-width: 40vw;
	--3d-carousel-gap: 7vw;
	--3d-carousel-rotate: 0deg;
	--3d-carousel-rotate-x: 0deg;
	--3d-carousel-z: 0px;
}
[carousel='wrap'] > div {
	transform-style: preserve-3d;
	transform: translate3d(0px, 0px, var(--3d-carousel-z))
		rotateX(var(--3d-carousel-rotate-x)) rotateY(var(--3d-carousel-rotate));
}
[carousel='wrap'] > div > div {
	width: var(--3d-carousel-item-width);
}
.swiper-button-disabled {
	pointer-events: none;
	opacity: 0.4;
}
.carousel_arrow_wrap {
	pointer-events: none;
}
.carousel_arrow_link {
	pointer-events: auto;
}

@media screen and (max-width: 991px) {
	[carousel='wrap'] {
		--3d-carousel-item-width: 70vw;
		--3d-carousel-gap: 6vw;
	}
}

.navigation {
	width: 45px;
	position: fixed;
	right: 3%;
	top: 50%;
	transform: translateY(-50%);
	z-index: 1000;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-direction: column;
}
.navigation span {
	width: 30px;
	height: 30px;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 12px;
	color: rgba(255, 255, 255, 0.6);
	font-family: var(--Poppins);
	font-weight: 200;
	cursor: pointer;
	position: relative;
}
.navigation span:before {
	content: '';
	width: 100%;
	height: 100%;
	border-radius: 50%;
	box-sizing: border-box;
	border: 1px solid rgba(0, 0, 0, 0.2);
	background: rgba(255, 255, 255, 0.2);
	transition: 0.3s ease;
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	z-index: -1;
}
.navigation span.on {
	width: 45px;
	height: 45px;
	color: var(--black);
	font-size: 16px;
	font-weight: 500;
}
.navigation span.on:before {
	border-color: rgba(0, 0, 0, 1);
	background: rgba(255, 255, 255, 1);
}

.navigation .nav {
	width: 30px;
	height: 45px;
	position: relative;
	margin-left: auto;
	margin-right: 0;
}
.navigation .nav .btn-navi {
	width: 30px;
	position: absolute;
	right: 0;
	top: 50%;
	display: flex;
	align-items: center;
	justify-content: flex-end;
	cursor: pointer;
	transform: translateY(-50%);
}
.navigation .nav .btn-navi:before {
	content: '';
	width: 100%;
	height: 100%;
	border-radius: 1000px;
	box-sizing: border-box;
	border: 1px solid rgba(0, 0, 0, 0.2);
	background: rgba(255, 255, 255, 0.2);
	transition: 0.3s ease;
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	z-index: -1;
}
.navigation .nav .btn-navi .txt {
	font-size: 0;
	width: 0;
}
.navigation .nav .btn-navi .num {
	width: 30px;
	height: 30px;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 12px;
	font-family: var(--Poppins);
	font-weight: 200;
}
.navigation .nav.on,
.navigation .nav:hover {
	height: 45px;
}
.navigation .nav.on .btn-navi,
.navigation .nav:hover .btn-navi {
	width: fit-content;
}
.navigation .nav.on .btn-navi:before,
.navigation .nav:hover .btn-navi:before {
	border-color: rgba(0, 0, 0, 1);
	background: rgba(255, 255, 255, 1);
}
.navigation .nav.on .btn-navi .txt,
.navigation .nav:hover .btn-navi .txt {
	font-size: 16px;
	width: fit-content;
	white-space: nowrap;
	padding-left: var(--gap-16);
	font-weight: 500;
}
.navigation .nav.on .btn-navi .num,
.navigation .nav:hover .btn-navi .num {
	width: 45px;
	height: 45px;
	font-size: 16px;
	font-weight: 500;
}

@media screen and (max-width: 648px) {
	.navigation {
		width: 22px;
		gap: 10px;
	}
	.navigation span,
	.navigation span.on {
		font-size: 0;
	}
	.navigation span {
		width: 16px;
		height: 16px;
	}
	.navigation span.on {
		width: 28px;
		height: 28px;
	}

	.navigation .nav {
		width: 16px;
		height: 16px;
		margin: 0 auto;
	}
	.navigation .nav .btn-navi {
		width: 16px;
		left: 50%;
		transform: translate(-50%, -50%);
	}
	.navigation .nav .btn-navi .num {
		width: 16px;
		height: 16px;
		font-size: 0;
	}
	.navigation .nav.on {
		height: 28px;
	}
	.navigation .nav.on .btn-navi {
		width: 28px;
	}
	.navigation .nav.on .btn-navi .txt {
		font-size: 0;
		width: 0;
		padding: 0;
	}
	.navigation .nav.on .btn-navi .num {
		width: 28px;
		height: 28px;
		font-size: 0;
	}

	.navigation .nav:not(.on):hover {
		height: 16px;
	}
	.navigation .nav:not(.on):hover {
		width: 16px;
	}
	.navigation .nav:not(.on):hover .btn-navi .txt {
		font-size: 0;
		width: 0;
		padding: 0;
	}
	.navigation .nav:not(.on):hover .btn-navi .num {
		width: 16px;
		height: 16px;
		font-size: 0;
	}
}

/* .masterpiece {
	width: 100%;
	height: var(--nvh);
	overflow: hidden;
	position: relative;
} */
.masterpiece .masterpiece-wrap {
	width: calc((var(--nvh) * 3200) / 973);
	height: var(--nvh);
	position: absolute; /*left:50%; top:50%; transform:translate(-50%,-50%);*/
	left: 0;
	top: 0;
}
.masterpiece .masterpiece-wrap .masterpiece-box {
	width: 100%;
	height: 100%;
	position: relative;
}
.masterpiece .masterpiece-wrap svg {
	width: 100%;
	height: 100%;
}

.masterpiece .masterpiece-wrap #page-title .title {
	fill: var(--white);
	font-family: var(--Pretendard);
	font-size: 50px;
	font-weight: 700;
}
.masterpiece .masterpiece-wrap #page-title .sub-title {
	fill: var(--white);
	font-family: var(--Poppins);
	font-size: 30px;
	font-weight: 500;
}
.masterpiece .masterpiece-wrap #frame-wrap .frame-tle,
.masterpiece .masterpiece-wrap #frame-wrap .frame-box {
	fill: #333;
}
.masterpiece .masterpiece-wrap #frame-wrap.type-B .frame-tle,
.masterpiece .masterpiece-wrap #frame-wrap.type-B .frame-box {
	fill: var(--white);
}
.masterpiece .masterpiece-wrap #view-more .btn-view-box {
	opacity: 0.5;
}
.masterpiece .masterpiece-wrap #view-more .btn-view-box .line {
	fill: var(--white);
}
.masterpiece .masterpiece-wrap #view-more .txt {
	font-family: var(--Poppins);
	font-size: 16px;
	font-weight: 500;
	fill: var(--white);
}
.masterpiece .masterpiece-wrap #view-more .icon-plus {
	fill: var(--white);
}

.snb-category-wrap {
	height: var(--headerH);
	position: fixed;
	left: 50%;
	top: 0;
	transform: translateX(-50%);
	z-index: 1000;
	display: flex;
	align-items: center;
	justify-content: center;
}
.snb-category-wrap .snb-category-box {
	width: fit-content;
	padding: 10px;
	background: rgba(0, 0, 0, 0.3);
	border-radius: 100px;
	transition: background 0.3s ease-in-out, box-shadow 0.3s ease-in-out;
}
/* .pg-about-us--v2.snap-section-11 .snb-category-wrap .snb-category-box {
	background: rgba(255, 255, 255, 1);
	box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
} */
.snb-category-wrap .snb-category-box ul {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
}
.snb-category-wrap .snb-category-box ul li a {
	display: flex;
	align-items: center;
	justify-content: center;
	width: fit-content;
	height: var(--n-40);
	font-size: var(--font-18);
	color: var(--white);
	padding: 0 var(--gap-20);
	transition: 0.3s ease;
	white-space: nowrap;
}
/* .pg-about-us--v2.snap-section-11 .snb-category-wrap .snb-category-box ul li a {
	color: var(--black);
} */
.snb-category-wrap .snb-category-box ul li a:hover,
.snb-category-wrap .snb-category-box ul li a.on {
	background: var(--white);
	border-radius: 100px;
	color: var(--black);
}

.pg-about-us--v2.snap-section-11
	.snb-category-wrap
	.snb-category-box
	ul
	li
	a:hover,
.pg-about-us--v2.snap-section-11
	.snb-category-wrap
	.snb-category-box
	ul
	li
	a.on {
	background: var(--black);
	color: var(--white);
}
@media screen and (max-width: 1024px) {
	.snb-category-wrap .snb-category-box ul li a {
		font-size: 14px;
	}
}

@media screen and (max-width: 768px) {
	.snb-category-wrap .snb-category-box ul li a {
		font-size: 12px;
	}
}

@media screen and (max-width: 767px) {
	.snb-category-wrap {
		display: none;
	}
}

.portfolio {
	width: 100%;
	height: var(--nvh);
	overflow: hidden;
	position: relative;
}
.portfolio .portfolio-wrap {
	width: 100%;
	height: 100%;
	position: relative;
}
.portfolio .portfolio-wrap .portfolio-box {
	width: 100%;
	height: 100%;
	position: relative;
	z-index: 1;
}
.portfolio .portfolio-wrap .portfolio-box svg {
	width: 100%;
	height: 100%;
}

.portfolio .portfolio-wrap .portfolio-box #page-title .title {
	fill: var(--white);
	font-family: var(--Pretendard);
	font-size: 50px;
	font-weight: 700;
}
.portfolio .portfolio-wrap .portfolio-box #page-title .sub-title {
	fill: var(--white);
	font-family: var(--Poppins);
	font-size: 30px;
	font-weight: 500;
}

.portfolio .portfolio-wrap .portfolio-list-wrap {
	width: 100%;
	height: 100%;
	position: absolute;
	left: 0;
	top: 0;
	display: flex;
	align-items: center;
	justify-content: center;
}
.portfolio .portfolio-wrap .portfolio-list-wrap .portfolio-list-box {
	width: 100%;
}
.portfolio
	.portfolio-wrap
	.portfolio-list-wrap
	.portfolio-list-box
	.swiper-container {
	overflow: visible;
}
.portfolio
	.portfolio-wrap
	.portfolio-list-wrap
	.portfolio-list-box
	.portfolio-list
	.list-box {
	position: relative;
}
.portfolio
	.portfolio-wrap
	.portfolio-list-wrap
	.portfolio-list-box
	.portfolio-list
	.list-box
	.thumbnail {
	width: 100%;
	max-width: 400px;
	margin: 0 auto;
}
.portfolio
	.portfolio-wrap
	.portfolio-list-wrap
	.portfolio-list-box
	.portfolio-list
	.list-box
	.thumbnail
	span {
	display: block;
	width: 100%;
	height: 0;
	padding-bottom: calc(260 / 400 * 100%);
	position: relative;
	box-sizing: border-box;
	border: 3px solid transparent;
	background: transparent;
}
.portfolio
	.portfolio-wrap
	.portfolio-list-wrap
	.portfolio-list-box
	.portfolio-list
	.swiper-slide-active
	.list-box
	.thumbnail
	span {
	border-color: #fff;
	background: #fff;
}
.portfolio
	.portfolio-wrap
	.portfolio-list-wrap
	.portfolio-list-box
	.portfolio-list
	.list-box
	.thumbnail
	span
	img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
}
.portfolio
	.portfolio-wrap
	.portfolio-list-wrap
	.portfolio-list-box
	.portfolio-list
	.list-box
	.title-box {
	width: 100%;
	text-align: center;
	font-size: 40px;
	font-weight: 700;
	letter-spacing: -1px;
	color: var(--white);
	line-height: 1.3;
	visibility: hidden;
	position: absolute;
	left: 0;
	top: 100%;
	padding-top: var(--gap-40);
}
.portfolio
	.portfolio-wrap
	.portfolio-list-wrap
	.portfolio-list-box
	.portfolio-list
	.swiper-slide-active
	.list-box
	.title-box {
	visibility: visible;
}

@media screen and (max-width: 1440px) {
	.portfolio
		.portfolio-wrap
		.portfolio-list-wrap
		.portfolio-list-box
		.portfolio-list
		.list-box
		.title-box {
		font-size: 32px;
	}
}

@media screen and (max-width: 1024px) {
	.portfolio
		.portfolio-wrap
		.portfolio-list-wrap
		.portfolio-list-box
		.portfolio-list
		.list-box
		.title-box {
		font-size: 28px;
	}
}

@media screen and (max-width: 768px) {
	.portfolio
		.portfolio-wrap
		.portfolio-list-wrap
		.portfolio-list-box
		.portfolio-list
		.list-box
		.title-box {
		font-size: 22px;
	}
}

@media screen and (max-width: 648px) {
	.portfolio
		.portfolio-wrap
		.portfolio-list-wrap
		.portfolio-list-box
		.portfolio-list
		.list-box
		.title-box {
		font-size: 18px;
	}
}

@media screen and (max-width: 480px) {
	.portfolio
		.portfolio-wrap
		.portfolio-list-wrap
		.portfolio-list-box
		.portfolio-list
		.list-box
		.title-box {
		font-size: 15px;
	}
}

.mo-main {
	width: 100%;
	height: var(--nvh);
	background: var(--black);
	position: fixed;
	left: 0;
	top: 0;
	z-index: 0;
	overflow: hidden;
	min-width: 280px;
	visibility: hidden;
	opacity: 0;
}
.mo-main.active {
	visibility: visible;
	opacity: 1;
	z-index: 80;
}

.mo-main .section {
	width: 100%;
	height: var(--nvh);
	position: absolute;
	left: 0;
	top: 0;
	z-index: 1;
}
.mo-main .section.active {
	z-index: 4;
}

.mo-main .section .bg {
	width: 100%;
	height: 100%;
	position: absolute;
	left: 0;
	top: 0;
	z-index: 1;
}
.mo-main .section .bg:after {
	content: '';
	width: 100%;
	height: 100%;
	background: rgba(0, 0, 0, 0.5);
	position: absolute;
	left: 0;
	top: 0;
	z-index: 2;
}
.mo-main .section .bg span {
	display: block;
	width: 100%;
	height: 100%;
	position: relative;
	overflow: hidden;
	z-index: 1;
}
.mo-main .section .bg span img {
	display: block;
	width: 100%;
	height: 100%;
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	object-fit: cover;
}

.mo-main .section .section-wrap {
	width: 100%;
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	position: relative;
	z-index: 2;
}
.mo-main .section .section-wrap .section-conts {
	width: 100%;
	display: flex;
	align-items: center;
}
.mo-main .section .section-wrap .section-conts.type-B {
	align-items: flex-start;
}

.mo-main .mo-main-intro {
	z-index: 3;
}
.mo-main .mo-main-intro .gnb-wrap {
	width: 90%;
	margin: 0 auto;
	max-width: 310px;
}
.mo-main .mo-main-intro .gnb-wrap .gnb-box {
	width: 100%;
	display: flex;
	flex-wrap: wrap;
	gap: 80px 30px;
	transform: translateY(-80px);
}
.mo-main .mo-main-intro .gnb-wrap .gnb-box .btn-gnb {
	width: 140px;
	height: 140px;
	border-radius: 50%;
	position: relative;
	border: 1px solid var(--white);
	background: rgba(0, 0, 0, 0.5);
	position: relative;
	cursor: pointer;
}
.mo-main .mo-main-intro .gnb-wrap .gnb-box .btn-gnb:nth-child(even) {
	transform: translateY(50%);
}
.mo-main .mo-main-intro .gnb-wrap .gnb-box .btn-gnb:before {
	content: '';
	width: calc(100% - var(--gap-20));
	height: calc(100% - var(--gap-20));
	background: var(--white);
	border-radius: 50%;
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	z-index: 0;
}
.mo-main .mo-main-intro .gnb-wrap .gnb-box .btn-gnb .btn-wrap {
	width: 100%;
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	position: relative;
	z-index: 1;
}
.mo-main .mo-main-intro .gnb-wrap .gnb-box .btn-gnb .btn-wrap span {
	font-size: 18px;
	font-weight: 700;
	position: relative;
	padding-bottom: 34px;
}
.mo-main .mo-main-intro .gnb-wrap .gnb-box .btn-gnb .btn-wrap span:after {
	content: '';
	width: 24px;
	height: 24px;
	background: url(/img/main/pin_plus.svg) center no-repeat;
	background-size: cover;
	position: absolute;
	left: 50%;
	bottom: 0;
	transform: translate(-50%);
}

@media screen and (max-width: 480px) {
	.mo-main .mo-main-intro .gnb-wrap {
		max-width: 270px;
	}
	.mo-main .mo-main-intro .gnb-wrap .gnb-box {
		gap: 60px 30px;
		transform: translateY(-60px);
	}
	.mo-main .mo-main-intro .gnb-wrap .gnb-box .btn-gnb {
		width: 120px;
		height: 120px;
	}
	.mo-main .mo-main-intro .gnb-wrap .gnb-box .btn-gnb:before {
		width: calc(100% - var(--gap-16));
		height: calc(100% - var(--gap-16));
	}
	.mo-main .mo-main-intro .gnb-wrap .gnb-box .btn-gnb .btn-wrap span {
		font-size: 15px;
		padding-bottom: 26px;
	}
	.mo-main .mo-main-intro .gnb-wrap .gnb-box .btn-gnb .btn-wrap span:after {
		width: 18px;
		height: 18px;
	}
}

@media screen and (max-width: 320px) {
	.mo-main .mo-main-intro .gnb-wrap {
		max-width: 220px;
	}
	.mo-main .mo-main-intro .gnb-wrap .gnb-box {
		gap: 60px 20px;
	}
	.mo-main .mo-main-intro .gnb-wrap .gnb-box .btn-gnb {
		width: 100px;
		height: 100px;
	}
	.mo-main .mo-main-intro .gnb-wrap .gnb-box .btn-gnb .btn-wrap span {
		font-size: 13px;
		padding-bottom: 23px;
	}
	.mo-main .mo-main-intro .gnb-wrap .gnb-box .btn-gnb .btn-wrap span:after {
		width: 15px;
		height: 15px;
	}
}

.mo-main .section .depth-wrap {
	width: 90%;
	height: 100%;
	margin: 0 auto;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
}
.mo-main .section .depth-wrap .depth-box {
	width: 100%;
}
.mo-main .section .depth-wrap .depth-box .title {
	width: 100%;
	font-size: 40px;
	font-weight: 700;
	color: var(--white);
	text-align: center;
	margin-bottom: var(--gap-40);
}
.mo-main .section .depth-wrap .depth-box .snb-wrap {
	width: 100%;
	max-width: 200px;
	margin: 0 auto;
}
.mo-main .section .depth-wrap .depth-box .snb-wrap a.btn-snb {
	width: 100%;
	height: 50px;
	border-radius: 100px;
	border: 1px solid var(--white);
	background: rgba(0, 0, 0, 0.6);
	font-size: 18px;
	font-weight: 700;
	color: var(--white);
	text-align: center;
	padding: 0 8px;
	display: flex;
	align-items: center;
	margin-top: var(--gap-32);
}
.mo-main .section .depth-wrap .depth-box .snb-wrap a.btn-snb span {
	position: relative;
	padding-left: 32px;
	width: 100%;
	display: block;
}
.mo-main .section .depth-wrap .depth-box .snb-wrap a.btn-snb span:before {
	content: '';
	width: 32px;
	height: 32px;
	background: url(/img/main/icon_circle_plus.svg) center no-repeat;
	background-size: cover;
	position: absolute;
	left: 0;
	top: 50%;
	transform: translateY(-50%);
}
.mo-main .section .depth-wrap .depth-box .snb-wrap a.btn-snb:first-child {
	margin-top: 0;
}

.mo-main .section .depth-wrap .sns-button-wrap {
	width: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
}
.mo-main .section .depth-wrap .sns-button-wrap a.btn-sns {
	width: calc((100% - 30px) / 4);
	max-width: 48px;
	aspect-ratio: 1/1;
	border-radius: 50%;
	background: rgba(0, 0, 0, 0.6);
	font-size: 0;
}
.mo-main .section .depth-wrap .sns-button-wrap a.btn-sns span {
	display: block;
	width: 100%;
	height: 100%;
	background-repeat: no-repeat;
	background-position: center;
}
.mo-main .section .depth-wrap .sns-button-wrap a.btn-sns.blog span {
	background-image: url(/img/main/icon_blog.svg);
	background-size: 46% auto;
}
.mo-main .section .depth-wrap .sns-button-wrap a.btn-sns.instagram span {
	background-image: url(/img/main/icon_instagram.svg);
	background-size: 50% auto;
}
.mo-main .section .depth-wrap .sns-button-wrap a.btn-sns.youtube span {
	background-image: url(/img/main/icon_youtube.svg);
	background-size: 52% auto;
}
.mo-main .section .depth-wrap .sns-button-wrap a.btn-sns.pinterest span {
	background-image: url(/img/main/icon_pinterest.svg);
	background-size: 46% auto;
}

@media screen and (max-width: 480px) {
	.mo-main .section .depth-wrap .depth-box .title {
		font-size: 32px;
	}
	.mo-main .section .depth-wrap .depth-box .snb-wrap {
		max-width: 180px;
	}
	.mo-main .section .depth-wrap .depth-box .snb-wrap a.btn-snb {
		height: 45px;
		font-size: 16px;
		padding: 0 5px;
		margin-top: 14px;
	}
	.mo-main .section .depth-wrap .depth-box .snb-wrap a.btn-snb span {
		padding-left: 28px;
	}
	.mo-main .section .depth-wrap .depth-box .snb-wrap a.btn-snb span:before {
		width: 28px;
		height: 28px;
	}
}

.mo-main .mo-depth-intro {
	visibility: hidden;
	opacity: 0;
	transition: 0.5s ease;
}
.mo-main .mo-depth-intro.active {
	visibility: visible;
	opacity: 1;
}
.mo-main .mo-depth-intro .depth-wrap .button-area {
	display: flex;
	flex-direction: column;
	gap: var(--gap-32);
}

.mo-main .mo-depth-intro .depth-wrap .button-wrap {
	width: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
}

.mo-main .mo-depth-intro .section-wrap {
	padding-top: var(--headerH);
	align-items: flex-start;
}

.notice-list .sec-2 {
	width: 100%;
	padding: calc(var(--gap-60) * 4) 0;
}
.notice-list .sec-2 > .wrap {
	width: 92%;
	max-width: 1520px;
	margin: 0 auto;
}

.notice-list .board-list-wrap {
	width: 100%;
}

.notice-list ul.list-tb {
	width: 100%;
	border-top: 1px solid #333;
}
.notice-list ul.list-tb li {
	width: 100%;
	height: 130px;
	position: relative;
	border-bottom: 1px solid #333;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 50px;
	text-align: center;
}
.notice-list ul.list-tb li .num {
	width: 100px;
	font-size: 20px;
	color: #ddd;
}
.notice-list ul.list-tb li .subject {
	width: calc(100% - 220px);
	font-size: 30px;
	color: #fff;
	text-align: left;
}
.notice-list ul.list-tb li .subject span {
	background-image: linear-gradient(var(--white), var(--white));
	background-repeat: no-repeat;
	background-position: left bottom;
	background-size: 0 1px;
	transition: background-size 0.3s ease;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	max-width: 100%;
}
.notice-list ul.list-tb li .date {
	width: 120px;
	font-size: 24px;
	color: #666;
}
.notice-list ul.list-tb li .label {
	width: fit-content;
	height: 48px;
	border-radius: 100px;
	background: #222;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 0 24px;
	margin: 0 auto;
}
.notice-list ul.list-tb li a {
	display: block;
	width: 100%;
	height: 100%;
	position: absolute;
	left: 0;
	top: 0;
}
.notice-list ul.list-tb li:hover .subject span {
	background-size: 100% 1px;
}

@media screen and (max-width: 1024px) {
	.notice-list ul.list-tb li {
		height: 100px;
		gap: 30px;
	}
	.notice-list ul.list-tb li .num {
		width: 90px;
		font-size: 16px;
	}
	.notice-list ul.list-tb li .subject {
		width: calc(100% - 190px);
		font-size: 25px;
	}
	.notice-list ul.list-tb li .date {
		width: 100px;
		font-size: 20px;
	}
	.notice-list ul.list-tb li .label {
		height: 42px;
		padding: 0 var(--gap-24);
	}
}

@media screen and (max-width: 768px) {
	.notice-list ul.list-tb li {
		height: 100%;
		padding: calc(var(--gap-32) + var(--n-50) + var(--gap-8)) 0
			var(--gap-40) 0;
		flex-wrap: wrap;
		justify-content: flex-start;
		gap: var(--gap-16);
	}
	.notice-list ul.list-tb li .subject {
		width: 100%;
		height: var(--n-50);
		display: flex;
		align-items: center;
		position: absolute;
		left: 0;
		top: var(--gap-32);
		font-size: var(--font-28);
	}
	.notice-list ul.list-tb li .num,
	.notice-list ul.list-tb li .date {
		width: fit-content;
		font-size: var(--font-20);
	}
	.notice-list ul.list-tb li .label {
		height: var(--n-40);
	}
}

@media screen and (max-width: 480px) {
	.notice-list ul.list-tb li .subject {
		font-size: var(--font-30);
	}
}

.notice-list .pagination {
	width: 92%;
	margin: 0 auto;
	margin-top: var(--gap-100);
	display: flex;
	align-items: center;
	justify-content: center;
	flex-wrap: wrap;
}
.notice-list .pagination a {
	min-width: 50px;
	height: 50px;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 20px;
	font-weight: 500;
	color: #999;
	position: relative;
}
.notice-list .pagination a:before {
	content: '';
	width: 100%;
	height: 100%;
	border-radius: 1000px;
	background: var(--white);
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	z-index: 0;
	display: none;
}
.notice-list .pagination a span {
	z-index: 1;
}
.notice-list .pagination a.on,
.notice-list .pagination a:not(.arrow):hover {
	color: var(--black);
}
.notice-list .pagination a.on:before,
.notice-list .pagination a:not(.arrow):hover:before {
	display: block;
}
.notice-list .pagination a.arrow {
	font-size: 0;
}
.notice-list .pagination a.arrow:after {
	content: '';
	width: 100%;
	height: 100%;
	background-repeat: no-repeat;
	background-position: center;
	background-size: auto 40%;
	position: absolute;
	left: 0;
	top: 0;
}
.notice-list .pagination a.begin:after,
.notice-list .pagination a.end:after {
	background-image: url(/img/conts/arrow_pg_left_double.svg);
}
.notice-list .pagination a.prev:after,
.notice-list .pagination a.next:after {
	background-image: url(/img/conts/arrow_pg_left.svg);
}
.notice-list .pagination a.end:after,
.notice-list .pagination a.next:after {
	transform: scaleX(-1);
}

@media screen and (max-width: 1024px) {
	.notice-list .pagination a {
		min-width: 40px;
		height: 40px;
		font-size: 16px;
	}
}

@media screen and (max-width: 648px) {
	.notice-list .pagination a {
		min-width: 36px;
		height: 36px;
		font-size: 13px;
	}
	.notice-list .pagination a.arrow:after {
		background-size: auto 38%;
	}
}

.notice-view {
	width: 100%;
	padding-top: var(--headerH);
}
.notice-view .sec-1 {
	width: 100%;
	padding: calc(var(--gap-30) * 5) 0;
}
.notice-view .sec-1 > .wrap {
	width: 92%;
	max-width: 1520px;
	margin: 0 auto;
}

.notice-view .board-view-wrap {
	width: 100%;
}

.notice-view .view-tb {
	width: 100%;
}
.notice-view .view-tb .head {
	width: 100%;
	padding: calc(var(--gap-40) * 1.25) 0;
	color: var(--white);
}
.notice-view .view-tb .head .subject {
	font-size: var(--font-40);
	font-weight: 700;
	line-height: 1.3;
}
.notice-view .view-tb .head .date {
	font-size: var(--font-20);
	margin-top: var(--gap-32);
}
.notice-view .view-tb .view-conts {
	width: 100%;
	border: solid #333;
	border-width: 1px 0;
	padding-bottom: calc(var(--gap-40) * 1.25);
}
.notice-view .view-tb .view-conts .conts-box {
	width: 95%;
	max-width: 1320px;
	margin: 0 auto;
	padding: var(--gap-100) 0;
	font-size: var(--font-24);
	color: #eee;
	line-height: 1.6;
}
.notice-view .view-tb .view-conts .conts-box img {
	display: block;
	margin: 0 auto;
	max-width: 100%;
}
.notice-view .view-tb .view-conts .attachment {
	width: 100%;
	padding: var(--gap-40) var(--gap-60);
	background: #191919;
	display: flex;
	gap: var(--gap-24) var(--gap-60);
	font-size: var(--font-24);
	color: var(--white);
}
.notice-view .view-tb .view-conts .attachment .tlt {
	width: 100px;
}
.notice-view .view-tb .view-conts .attachment .file-list {
	width: calc(100% - 100px - var(--gap-60));
	display: flex;
	flex-direction: column;
	gap: var(--gap-8);
}
.notice-view .view-tb .view-conts .attachment .file-list span {
	width: 100%;
	display: block;
}
.notice-view .view-tb .view-conts .attachment .file-list a {
	font-size: var(--font-24);
	color: #aaa;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

@media screen and (max-width: 1024px) {
	.notice-view .view-tb .head .subject {
		font-size: var(--font-32);
	}
	.notice-view .view-tb .head .date {
		font-size: var(--font-18);
		margin-top: var(--gap-24);
	}
	.notice-view .view-tb .view-conts .conts-box {
		font-size: var(--font-20);
	}
	.notice-view .view-tb .view-conts .attachment {
		padding: var(--gap-40) var(--gap-24);
		font-size: var(--font-20);
		gap: var(--gap-24) var(--gap-40);
	}
	.notice-view .view-tb .view-conts .attachment .tlt {
		width: 80px;
	}
	.notice-view .view-tb .view-conts .attachment .file-list {
		width: calc(100% - 80px - var(--gap-40));
	}
	.notice-view .view-tb .view-conts .attachment .file-list a {
		font-size: var(--font-20);
	}
}

@media screen and (max-width: 648px) {
	.notice-view .view-tb .view-conts .attachment {
		flex-direction: column;
	}
	.notice-view .view-tb .view-conts .attachment .tlt,
	.notice-view .view-tb .view-conts .attachment .file-list {
		width: 100%;
	}
}

.notice-view .board-view-wrap .button-wrap {
	width: 100%;
	margin-top: var(--gap-100);
	display: flex;
	align-items: center;
	justify-content: center;
}
.notice-view .board-view-wrap .button-wrap .button {
	width: fit-content;
	height: var(--n-80);
	border-radius: 100px;
	background: var(--white);
	padding: 0 var(--gap-40);
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: var(--font-30);
	font-weight: 500;
	color: var(--black);
}

@media screen and (max-width: 1024px) {
	.notice-view .board-view-wrap .button-wrap .button {
		height: var(--n-64);
		font-size: var(--font-24);
	}
}

@media screen and (max-width: 1024px) {
}
@media screen and (max-width: 768px) {
}
@media screen and (max-width: 480px) {
}

.pg-masterpiece.snap-section-2 header .logo,
.pg-masterpiece.snap-section-3 header .logo,
.pg-masterpiece.snap-section-4 header .logo,
.pg-masterpiece.snap-section-5 header .logo,
.pg-masterpiece.snap-section-6 header .logo {
	filter: invert(0);
}
.pg-masterpiece.snap-section-2 header .btn-sitemap,
.pg-masterpiece.snap-section-3 header .btn-sitemap,
.pg-masterpiece.snap-section-4 header .btn-sitemap,
.pg-masterpiece.snap-section-5 header .btn-sitemap,
.pg-masterpiece.snap-section-6 header .btn-sitemap {
	filter: invert(1);
}

.pg-general header .btn-sitemap {
	filter: invert(1);
}