@charset "UTF-8";

body {
	-ms-overflow-style: none;
}

::-webkit-scrollbar {
	display: none;
}

.slide {
	height: 100%;
}

.page-scroll {
	position: absolute;
	left: 223px;
	bottom: 185px;
	font-weight: 600;
	font-size: 14px;
	color: #343538;
	padding: 4px;
	z-index: 4;
}

#service {
	padding-top: 85px;
	background-color: white;
}

#service-2 {
/* 	margin-top: 85px; */
	background-color: white;
}

#recruit {
	background-color: white;
}

#contact {
	padding-top: 85px;
	background-color: white;
}

#intro, #service, #service-2 {
	position: relative;
	height: 100%;
}

#intro {
	background-color: #FAFAFA;
}

.main-back {
	width: 100%;
	height: 100%;
}

/* slide 1 */
.text-zone {
	position: absolute;
	text-align: left;
	left: 223px;
	top: 212px;
}

@media ( min-width : 1360px) and (max-width: 1900px) {
	.text-zone {
		background-position: calc(100% + 500px) center;
		background-size: cover;
	}
}

.main-txt {
	font-family: 'NotoSansKR', sans-serif;
	font-size: 84px;
	font-weight: 700;
	color: black;
	line-height: 90px;
}

.middle-txt {
	font-family: 'NotoSansKR', sans-serif;
	font-weight: 300;
	color: black;
	font-size: 36px;
}

.middle-boldtxt {
	font-family: 'NotoSansKR', sans-serif;
	font-weight: 600;
	font-size: 36px;
	color: black;
}

.main-slide-1 {
	line-height: 30px;
	padding-left: 3px;
}

.main-slide-1-bottom {
	padding-left: 3px;
}

/* slide 2*/
.text-zone2 {
	position: absolute;
	text-align: left;
	left: 223px;
	top: 212px;
}

.main-txt2 {
	font-family: 'NotoSansKR', sans-serif;
	font-weight: 700;
	font-size: 72px;
	color: black;
	line-height: 90px;
}

.middle-txt-2 {
	font-family: 'NotoSansKR', sans-serif;
	font-weight: 300;
	font-size: 20px;
	color: black;
}

.middle-boldtxt-2 {
	font-family: 'NotoSansKR', sans-serif;
	font-weight: 600;
	font-size: 20px;
	color: black;
}


/* slide 3*/
.text-zone3 {
	position: absolute;
	text-align: left;
	left: 223px;
	top: 212px;
}

.main-txt3-t {
	font-family: 'NotoSansKR', sans-serif;
	font-weight: 700;
	font-size: 72px;
	color: #034588;
}

.main-txt3-u {
	font-family: 'NotoSansKR', sans-serif;
	font-weight: 700;
	font-size: 72px;
	color: #00517F;
}

.main-txt3-r {
	font-family: 'NotoSansKR', sans-serif;
	font-weight: 700;
	font-size: 72px;
	color: #00748B;
}

.main-txt3-b {
	font-family: 'NotoSansKR', sans-serif;
	font-weight: 700;
	font-size: 72px;
	color: #008992;
}

.main-txt3-o {
	font-family: 'NotoSansKR', sans-serif;
	font-weight: 700;
	font-size: 72px;
	color: #009B98;
}

.main-txt3 {
	font-family: 'NotoSansKR', sans-serif;
	font-weight: 700;
	color: #000000;
	font-size: 72px;
}

.main-slide-3 {
	line-height: 60px;
}

.intro1 {
	background-image: url('../../images/main/main_bg1.png');
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
	height: 100%;
	animation: shrink 10s infinite alternate;
}

@keyframes shrink { 
	0% {
		background-size: 100% 100%;
	}

	100% {
		background-size:110% 110%;
	}
}

.intro2 {
	background-image: url('../../images/main/main_bg2.png');
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
	height: 100%;
	animation: shrink2 10s infinite alternate;
}

@keyframes shrink2 { 
	0% {
		background-size: 100% 100%;
	}

	100% {
		background-size:110% 110%;
	}
}

.intro3 {
	background-image: url('../../images/main/main_bg3.png');
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
	height: 100%;
}

.intro4 {
	width: 100%;
	height: 100%;
	padding-top: 146px;
	background-color: #FAFAFA;
}

.intro-middle-text {
	font-family: 'NotoSansKR', sans-serif;
	font-weight: 300;
	font-size: 24px;
}

.intro-middle {
	margin-top: 26px;
}

.ballon-wrapper {
	background-image: url('../../images/main/ballon.png');
	background-size: 100% 100%;
	background-repeat: no-repeat;
	display: flex;
	justify-content: center;
	align-items: center;
	padding-bottom: 2rem;
	text-align: center;
}

.perfect-div {
	position: absolute;
}

.perfect-span {
	font-family: 'NotoSansKR', sans-serif;
	font-weight: 500;
	font-size: 32px;
	color: #008992;
}

.professional-div {
	position: absolute;
}

.professional-span {
	font-family: 'NotoSansKR', sans-serif;
	font-weight: 500;
	font-size: 32px;
	color: #034588;
}

.ballon-logo {
	position: absolute;
	width: 885px;
	height: 147px;
	z-index: 3;
}

.ballon-logo-shadow {
	position: absolute;
	width: 885px;
	height: 147px;
}

.value-div {
	position: absolute;
}

.value-span {
	font-family: 'NotoSansKR', sans-serif;
	font-weight: 500;
	font-size: 32px;
	color: #00517F;
}

.trust-div {
	position: absolute;
}

.trust-span {
	font-family: 'NotoSansKR', sans-serif;
	font-weight: 500;
	font-size: 32px;
	color: #00748B;
}

.pride-div {
	position: absolute;
}

.pride-span {
	font-family: 'NotoSansKR', sans-serif;
	font-weight: 500;
	font-size: 32px;
	color: #009B98;
}

.intro-bottom {
	margin-top: 13px;
}

.bottom-txt {
	font-family: 'NotoSansKR', sans-serif;
	font-weight: 300;
	font-size: 20px;
	color: black;
}


/* slide 4 */
.titel-name {
	font-family: 'NotoSansKR', sans-serif;
	font-weight: 600;
	font-size: 36px;
}

.left-top {
	position: absolute;
	left: 223px;
	top: 173px;
}

.left-bottom {
	position: absolute;
	left: 223px;
	top: 506px
}

.grid-wrapper { 
	--auto-grid-min-size: 16rem;
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	margin: 0;
	padding: 0;
	box-sizing: border-box;
}

.grid-wrapper li {
	background-color: #fafafa;
	color: black;
	font-size: 24px;
	list-style-type: none;
	text-align: center;
	text-transform: capitalize;
	font-weight: 600;
}

.main-container {
	/* 	margin: 0px 0px 0px 648px; */
	margin: 0px 0px 0px 550px;
	max-width: 1170px;
	padding: 2rem 1rem;
}

.words {
	margin-top: 13px;
}

.slide4-img {
	width: 4.1vw;
}

.slide4-perfect {
	width: 8.03vw;
	height: 8.03vw;
	background-image: url('../../images/main/preferction_img.png');
	background-repeat: no-repeat;
	background-position: center; 
}

.slide4-innovation {
	width: 8.03vw;
	height: 8.03vw;
	background-image: url('../../images/main/innovation_img.png');
	background-repeat: no-repeat;
	background-position: center; 
}

.slide4-trustability {
	width: 8.03vw;
	height: 8.03vw;
	background-image: url('../../images/main/trustability_img.png');
	background-repeat: no-repeat;
	background-position: center; 
}

.slide4-scalability {
	width: 8.03vw;
	height: 8.03vw;
	background-image: url('../../images/main/scalability_img.png');
	background-repeat: no-repeat;
	background-position: center; 
}

.slide4-global-network {
	width: 8.03vw;
	height: 8.03vw;
	background-image: url('../../images/main/global-network.png');
	background-repeat: no-repeat;
	background-position: center; 
}

.slide4-medical {
	width: 8.03vw;
	height: 8.03vw;
	background-image: url('../../images/main/medical.png');
	background-repeat: no-repeat;
	background-position: center;
}

.slide4-cowork {
	width: 8.03vw;
	height: 8.03vw;
	background-image: url('../../images/main/cowork_img.png');
	background-repeat: no-repeat;
	background-position: center;
}

.slide4-resource-share {
	width: 8.03vw;
	height: 8.03vw;
	background-image: url('../../images/main/resource_share_img.png');
	background-repeat: no-repeat;
	background-position: center;
}

.perfection, .innovation, .trustability, .scalability, .global-network,
	.medical, .cowork, .resource-share {
	width: 154px;
	height: 154px;
	background-color: white;
	border-radius: 50%;
	background-repeat: no-repeat;
	margin: 0 auto;
	background-position: center;
	align-items: center;
	display: inline-flex;
	justify-content: center;
}

.word-ko {
	font-family: 'NotoSansKR', sans-serif;
	font-weight: 500;
	font-size: 24px;
}

.word-en {
	margin-top: 14px;
	font-weight: 400;
	font-size: 20px;
}

/* -------------------------------------- */
.swiper {
	width: 100%;
	height: 100%;
}

/* animation effect */
.ballon-wrapper.professional-div {
	animation: 4s anim-lineUp-professional ease-out infinite;
	animation-delay: 1s;
}
@keyframes anim-lineUp-professional {
  0% {
    opacity: 0;
/*     transform: translateY(80%); */
	transform: translate3d(0, 25%, 0);
  }
  20% {
    opacity: 0;
    transform: translateZ(0);
  }
  50% {
    opacity: 1;
	transform: translate3d(0, -30%, 0);
  }
  100% {
    opacity: 0;
    transform: translate3d(0, -25%, 0);
  }
}

.ballon-wrapper.pride-div {
	animation: 5s anim-lineUp-pride ease-out infinite;
	animation-delay: 1s;
}
@keyframes anim-lineUp-pride {
  0% {
    opacity: 0;
/*     transform: translateY(80%); */
	transform: translate3d(0, 25%, 0);
  }
  20% {
    opacity: 0;
    transform: translateZ(0);
  }
  50% {
    opacity: 1;
	transform: translate3d(0, -30%, 0);
  }
  100% {
    opacity: 0;
    transform: translate3d(0, -25%, 0);
  }
}

.ballon-wrapper.trust-div {
	animation: 6s anim-lineUp-trust ease-out infinite;
	animation-delay: 1s;
}
@keyframes anim-lineUp-trust {
  0% {
    opacity: 0;
/*     transform: translateY(80%); */
	transform: translate3d(0, 25%, 0);
  }
  20% {
    opacity: 0;
    transform: translateZ(0);
  }
  50% {
    opacity: 1;
	transform: translate3d(0, -30%, 0);
  }
  100% {
    opacity: 0;
    transform: translate3d(0, -25%, 0);
  }
}

.ballon-wrapper.value-div {
	animation: 7s anim-lineUp-value ease-out infinite;
	animation-delay: 1s;
}
@keyframes anim-lineUp-value {
  0% {
    opacity: 0;
/*     transform: translateY(80%); */
	transform: translate3d(0, 25%, 0);
  }
  20% {
    opacity: 0;
    transform: translateZ(0);
  }
  50% {
    opacity: 1;
	transform: translate3d(0, -30%, 0);
  }
  100% {
    opacity: 0;
    transform: translate3d(0, -25%, 0);
  }
}

.ballon-wrapper.perfect-div {
	animation: 8s anim-lineUp-perfect ease-out infinite;
	animation-delay: 1s;
}
@keyframes anim-lineUp-perfect {
  0% {
    opacity: 0;
	transform: translate3d(0, 25%, 0);
  }
  20% {
    opacity: 0;
    transform: translateZ(0);
  }
  50% {
    opacity: 1;
	transform: translate3d(0, -30%, 0);
  }
  100% {
    opacity: 0;
    transform: translate3d(0, -25%, 0);
  }
}

/* 퀵 메뉴 */
.quick-menu-wrapper {
	position: fixed;
	z-index: 4;
}

.quick-menu-list li {
	display: flex;
	align-items: center;
}

.quick-menu-list li:hover > a {
	font-weight: 700;
	color: #034588;
}

.quick-menu-list li a {
	font-family: 'NotoSansKR', sans-serif;
	font-weight: 500;
	color: #707070;	
}

.quick-menu-list li::before {
	display: inline-block;
	content:"";
	border-radius: 50px;
	background-color: #034588;
}

/* .quick-menu-list li:hover:before { */
/* 	border-radius: 0; */
/* } */

.quick-menu-list li.quick-li-active a {
	font-weight: 700;
	color: #034588;
}

/* .quick-menu-list li.quick-li-active:before { */
/* 	border-radius: 0; */
/* } */