/* ===================================
	General
====================================== */
.container {
	position: relative;
	box-sizing: inherit;
}
section {position: relative;}
@media screen and (min-width:1200px) {
	section {overflow-y: hidden;}
}

a:active, a:hover, a {text-decoration: none;}

.full-screen {height: 100vh;}

#pp-nav.right ul {list-style-type: none;}

#page-scroll .section{
	height: 100vh;
	background-color: #fff;
	overflow: hidden;
}



/* center-block */
.center-block {
	display: -webkit-box;
	display: -webkit-flex;
	display: -moz-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-pack: center;
	-webkit-justify-content: center;
	-moz-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	-webkit-flex-direction: column;
	-moz-box-orient: vertical;
	-moz-box-direction: normal;
	-ms-flex-direction: column;
	flex-direction: column;
	-webkit-box-align: center;
	-webkit-align-items: center;
	-moz-box-align: center;
	-ms-flex-align: center;
	align-items: center;
}

/* ===================================
	Header
====================================== */

.navbar-standard{
	position: absolute;
	top: 0;
	z-index: 99;
	padding: 33px 0 0 0;
	width: 100%;
}

.logo-dark {max-width: 100%;}

/* Side Menu */
.side-menu {
	width: 100%;
	opacity: 0;
	position: fixed;
	background: linear-gradient(to right, #212c2c -50%, #24c4f4 93%);
	z-index:0;
	height: 100%;
	-webkit-transition: all .5s ease;
	transition: all .5s ease;
	-o-transition: all .5s ease;
	visibility: hidden;
}

.whitecolor{
	color: #FFFFFF;
}

.side-menu.left {
	left: 0; right: auto;
	-webkit-transform: translate3d(-100%, 0, 0);
	transform: translate3d(-100%, 0, 0);
}

.side-menu.before-side {
	width: 280px;
}

.side-menu.side-menu-active,
.side-menu.before-side{
	-webkit-transition: all 0.5s ease-in-out;
	-moz-transition: all 0.5s ease-in-out;
	-ms-transition: all 0.5s ease-in-out;
	-o-transition: all 0.5s ease-in-out;
	transition: all 0.5s ease-in-out;
	z-index:9999;
	opacity: 0.9;
	visibility: visible;
}

.pul-menu .side-menu.side-menu-active {
	visibility: visible; opacity: 1;
}

.side-menu .navbar-brand {
	margin: 0 0 2.5rem 0;
}

/*Side overlay*/
#close_side_menu {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: #000;
	-webkit-transition: opacity 300ms cubic-bezier(0.895, 0.03, 0.685, 0.22);
	-o-transition: opacity 300ms cubic-bezier(0.895, 0.03, 0.685, 0.22);
	transition: opacity 300ms cubic-bezier(0.895, 0.03, 0.685, 0.22);
	display: none;
	z-index: 1031;
	opacity: 0.4;
}

/*side clode btn*/
.side-menu .btn-close {
	height: 33px;
	width: 33px;
	display: inline-block;
	text-align: center;
	position: absolute;
	top: 29px;
	right: 47px;
	cursor: pointer;
}

.side-menu.before-side .btn-close{
	display: none;
}

.just-sidemenu #sidemenu_toggle {
	position: fixed;
	z-index: 999;
	/*background: #fff;*/
	right: 0;
	top: 16px;
	-webkit-border-radius: 2px;
	border-radius: 2px;
	-webkit-box-shadow: 0 0 20px rgba(0, 0, 0, .15);
	box-shadow: 0 0 20px rgba(0, 0, 0, .15);
}

.side-menu .btn-close::before, .side-menu .btn-close::after {
	position: absolute;
	left: 16px;
	content: ' ';
	height: 24px;
	width: 2px;
	background: #fff;
	top: 5px;
}

.side-menu .btn-close:before {
	-webkit-transform: rotate(45deg);
	-ms-transform: rotate(45deg);
	-o-transform: rotate(45deg);
	transform: rotate(45deg);
}

.side-menu .btn-close:after {
	-webkit-transform: rotate(-45deg);
	-ms-transform: rotate(-45deg);
	-o-transform: rotate(-45deg);
	transform: rotate(-45deg);
}

.side-menu.right-btn .btn-close{
	right: 47px;
	left: auto;
}

.side-nav-btn{
	position: absolute;
	top: 37px;
	right: 22px;
	font-size: 18px;
	color: #FFFFFF;
	transform: rotate(180deg);
	transition: all 0.3s ease;
	width: 28px;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	border-radius: 4px;
	cursor: pointer;
	z-index: 99;
	-webkit-transition: all linear 300ms;
}

.side-nav-btn span {
	content: "";
	display: block;
	width: 100%;
	height: 2px;
	background: #ffffff;
	position: relative;
	top: 50%;
	margin-top: 6px;
	right: 0;
	-webkit-transition: all linear 300ms;
}

.side-nav-btn:hover span:nth-child(1),.side-nav-btn:hover span:nth-child(3){
	width: 60%;
	-webkit-transition: all linear 300ms;
}
.side-nav-btn.active{
	display: none;
}

.header-appear .side-nav-btn{
	left: 40px;
	top: 19px;
}

.header-appear .navbar-top-default {
	height: 80px;
	position: fixed;
	z-index: 9999;
	top: 0;
	background: #171717;
	-webkit-animation-name: animationFade;
	animation-name: animationFade;
	-webkit-animation-duration: 1s;
	animation-duration: 1s;
	-webkit-animation-fill-mode: both;
	animation-fill-mode: both;
	-webkit-box-shadow: 0 10px 10px -10px rgba(0, 0, 0, 0.35);
	box-shadow: 0 10px 10px -10px rgba(0, 0, 0, 0.35);
}

@-webkit-keyframes animationFade {
	from {
		opacity: 0;
		-webkit-transform: translate3d(0, -100%, 0);
		transform: translate3d(0, -100%, 0);
	}
	to {
		opacity: 1;
		-webkit-transform: none;
		transform: none;
	}
}

@keyframes animationFade {
	from {
		opacity: 0;
		-webkit-transform: translate3d(0, -100%, 0);
		transform: translate3d(0, -100%, 0);
	}
	to {
		opacity: 1;
		-webkit-transform: none;
		transform: none;
	}
}

.side-menu .inner-wrapper {
	padding: 3.5rem 5rem;
	height: 100%;
	position: relative;
	overflow: hidden;
	display: -webkit-box;
	display: -webkit-flex;
	display: -moz-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-webkit-align-items: center;
	-moz-box-align: center;
	-ms-flex-align: center;
	align-items: flex-end;
	text-align: left;
	-webkit-flex-wrap: wrap;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
}

.pul-menu.pushwrap .side-menu .inner-wrapper{
	padding: 3.5rem 2.5rem;
}

.inner-wrapper .navbar-nav{
	-ms-flex-direction: inherit;
	flex-direction:inherit;
}

.side-menu .side-nav {
	margin-bottom: 30px;
	display: block;
	width:100%
}

.side-nav .navbar-nav .nav-item{
	display: block;
	margin: 0 auto;
	padding: 0 !important;
	opacity: 0;
	-webkit-transition: all 0.8s ease 500ms;
	-o-transition: all 0.8s ease 500ms;
	transition: all 0.8s ease 500ms;

	-webkit-transform: translateY(30px);
	-ms-transform: translateY(30px);
	-o-transform: translateY(30px);
	transform: translateY(30px);
}

.side-nav .navbar-nav .nav-item:first-child {
	-webkit-transition-delay: .1s;
	-o-transition-delay: .1s;
	transition-delay: .1s;
}

.side-nav .navbar-nav .nav-item:nth-child(2){
	-webkit-transition-delay: .2s;
	-o-transition-delay: .2s;
	transition-delay: .2s;
}

.side-nav .navbar-nav .nav-item:nth-child(3) {
	-webkit-transition-delay: .3s;
	-o-transition-delay: .3s;
	transition-delay: .3s;
}

.side-nav .navbar-nav .nav-item:nth-child(4) {
	-webkit-transition-delay: .4s;
	-o-transition-delay: .4s;
	transition-delay: .4s;
}

.side-nav .navbar-nav .nav-item:nth-child(5) {
	-webkit-transition-delay: .5s;
	-o-transition-delay: .5s;
	transition-delay: .5s;
}

.side-nav .navbar-nav .nav-item:nth-child(6) {
	-webkit-transition-delay: .6s;
	-o-transition-delay: .6s;
	transition-delay: .6s;
}

.side-nav .navbar-nav .nav-item:nth-child(7) {
	-webkit-transition-delay: .7s;
	-o-transition-delay: .7s;
	transition-delay: .7s;
}

.side-nav .navbar-nav .nav-item:nth-child(8) {
	-webkit-transition-delay: .8s;
	-o-transition-delay: .8s;
	transition-delay: .8s;
}

.side-nav .navbar-nav .nav-item:nth-child(9) {
	-webkit-transition-delay: .9s;
	-o-transition-delay: .9s;
	transition-delay: .9s;
}

.side-menu.side-menu-active .side-nav .navbar-nav .nav-item {
	-webkit-transform: translateY(0);
	-ms-transform: translateY(0);
	-o-transform: translateY(0);
	transform: translateY(0);
	opacity: 1;
}

.nav-item a{
	transition: all .3s ease;
}

.top-center-logo .navbar-nav .text-black:hover,.top-fixed-nav .navbar-nav .whitecolor:hover,
.top-center-logo .navbar-nav .whitecolor:hover{
	color: #f5218a !important;
}

.side-nav .navbar-nav .nav-link {
	display: inline-table;
	color: #fff;
	padding: 2px 0 3px 0 !important;
	font-family: 'Montserrat' , sans-serif;
	font-size: 18px;
	font-weight: 500;
	line-height: normal;
	position: relative;
	-webkit-border-radius: 0;
	border-radius: 0;
}

.side-logo-nav .navbar-nav .nav-link{
	position: relative;
}

.side-logo-nav .navbar-nav .nav-link:hover,.side-logo-nav .navbar-nav .nav-link:focus{
	color: #FFFFFF;
}

.side-nav .navbar-nav .nav-link::after{
	content: "";
	position: absolute;
	background: #fff;
	display: inline-block;
	width: 0;
	height: 3px;
	bottom: 0; left: 0;
	overflow: hidden;
	-webkit-transition: all 0.5s cubic-bezier(0, 0, 0.2, 1);
	-o-transition: all 0.5s cubic-bezier(0, 0, 0.2, 1);
	transition: all 0.5s cubic-bezier(0, 0, 0.2, 1);
}

.side-nav .navbar-nav .nav-link:hover::after,
.side-nav .navbar-nav .nav-link.active::after {
	width: 100%;
}

.side-nav .navbar-nav .nav-link.active {
	background: transparent;
}

.side-menu p{
	font-size: 13px;
	margin-top: .5rem;
	margin-bottom: 0;
}

.side-footer{
	text-align: center;
}

.social-icons-simple{
	margin-bottom: 0;
	margin-left: -10px;
	padding: 0;
}

.social-icons-simple li{
	display: inline-block;
}

.social-icons-simple li a {
	display: block;
	font-size: 16px;
	color: #FFFFFF;
	height: 38px;
	line-height: 38px;
	border: 1px solid transparent;
	text-align: center;
	width: 38px;
	-webkit-border-radius: 50%;
	border-radius: 50%;
	position: relative;
	z-index: 1;
	overflow: hidden;
	-webkit-transition: all .5s ease;
	-o-transition: all .5s ease;
	transition: all .5s ease;
}

.social-icons-simple li a:hover{
	color: #FFFFFF;
	-webkit-transition: all .5s ease;
	-o-transition: all .5s ease;
	transition: all .5s ease;
}

/* ===================================
	Services Section
====================================== */

.bg-services {background: url(../images/main/white-bg.jpg); background-repeat: repeat;}

.services-item{
	max-width: 560px;
	margin: 0 auto;
	text-align: center;
}

.per-slide {
	opacity: 0;
	-webkit-transition: all .7s ease-in .3s;
	-o-transition: all .7s ease-in .3s;
	transition: all .7s ease-in .3s;
}

#services_slider .owl-item.active .services-item .per-slide{
	opacity: 1;
}

.services-item .services-icon{
	font-size: 2.5rem;
	color: #ffffff;
	width:45px;
	height:  45px;
	display: inline-block;
	-webkit-transition: all .7s ease-in .3s;
	-o-transition: all .7s ease-in .3s;
	transition: all .7s ease-in .3s;
	-webkit-transform-style: preserve-3d;
	transform-style: preserve-3d;
	margin-bottom: 2rem;
}

.services-item:hover .services-icon  {
	-webkit-transform: rotateY(180deg);
	-o-transform: rotateY(180deg);
	transform: rotateY(180deg);
}

#services_slider .owl-item.active .services-item .testimonial-line {
	width:140px;
	opacity: 1;
}

.services-item .testimonial-line{
	width: 5px;
	opacity: 0;
	height: 3px;
	left: 73%;
	position: relative;
	text-align: right;
	margin-bottom: 40px;
	background-color: #d00520;
}

.services-item .destination{
	font-size: 13px;
	font-weight: 400;
	color: #9c9c9c;
}

#services_slider .owl-dots{
	position: relative;
	bottom: 0;
	display: block;
	text-align: right;
	width: 100%;
}

/* owl carousel bullets */
#services_slider .owl-dots .owl-dot {
	height: 11px;
	width: 11px;
	margin: 2px 10px;
	position: relative;
	display: inline-block;
	-webkit-border-radius: 50%;
	border-radius: 50%;
	background: #e5e5e5 !important;
	cursor: pointer;
}

#services_slider .owl-dots .owl-dot.active span,.owl-dots .owl-dot:hover span {
	background:#e5e5e5;
}

#services_slider .owl-dots .owl-dot.active {
	background: #d00520 !important;
}

/* ===================================
	Team Section
====================================== */

.testimonial-line{
	width: 5px;
	height: 3px;
	opacity: 0;
	background-color: #d00520;
	transition: width .5s ease-in;
}

#testimonial-quote .owl-item.active .testimonial-line{
	opacity: 1;
	width: 140px;
}

.team-img {
	max-width:135px;
	min-height: 135px;
	transform: scale(.5);
	-webkit-border-radius: 50px;
	-moz-border-radius: 50px;
	border-radius: 70px;
	overflow: hidden;
	transition: all .5s ease-in;
}

#testimonial-quote .owl-item.active .team-img{
	transform: scale(1);
}



.testimonial-wrapp,
.testimonial-wrapp .testimonial-text,
.testimonial-wrapp .testimonial-photo,
.testimonial-wrapp .quoted, .testimonial-quote{
	position: relative;
	-webkit-transition: all .4s ease-in;
	-o-transition: all .4s ease-in;
	transition: all .4s ease-in;
}

.testimonial-wrapp,
.testimonial-wrapp .testimonial-text {
	text-align: center;
}

.testimonial-wrapp .quoted,
.testimonial-wrapp .testimonial-photo {
	display: inline-block;
}

.testimonial-wrapp .quoted {
	background: #643094;
	color: #fff;
	font-size: 20px;
	line-height: 50px;
	height: 50px;
	width: 50px;
	-webkit-border-radius: 50%;
	border-radius: 50%;
	-webkit-transform: translateY(50%);
	-ms-transform: translateY(50%);
	-o-transform: translateY(50%);
	transform: translateY(50%);
	z-index: 1;
}

.testimonial-wrapp .testimonial-text {
	background: #f6f6f6;
	padding: 4.25rem 2.5rem;
	-webkit-border-radius: 10px;
	border-radius: 10px;
	border: 1px solid #f1f1f1;
}

.testimonial-wrapp .testimonial-photo {
	height: 100px;
	width: 100px;
	margin-top: -50px;
}

.testimonial-wrapp .testimonial-photo,
.testimonial-wrapp .testimonial-photo > img{
	-webkit-border-radius: 50%;
	border-radius: 50%;
}

#testimonial-slider .owl-item:nth-child(2n) .testimonial-wrapp .quoted,
#testimonial-slider .owl-item:nth-child(2n) .testimonial-wrapp:hover .testimonial-text{
	background: #00bcd4;
}

.testimonial-wrapp:hover .testimonial-text{
	background: #643094;
	color: #fff;
}

.testimonial-quote,h1:active {opacity: 1;}

#owl-thumbs.owl-dots{
	text-align: left;
}

#owl-thumbs.owl-dots .owl-dot {
	background: transparent;
	height: 60px;
	margin: 0;
	padding: 0;
	position: relative;
	width: 60px;
	border: 5px solid rgba(255,255,255,.3);
	margin-left: -30px;
	border-radius: 50%;
	display: inline-block;
	opacity: .65;
	-webkit-transform: scale(.95);
	-ms-transform: scale(.95);
	-o-transform: scale(.95);
	transform: scale(.95);
}

.testimonial-bg-light #owl-thumbs.owl-dots .owl-dot {
	border: 5px solid rgba(0,0,0,.3);
}

#owl-thumbs.owl-dots .owl-dot > img {
	width: 100%;
	-webkit-border-radius: 50%;
	border-radius: 50%;
}

#owl-thumbs.owl-dots .owl-dot:first-child{
	margin-left: 0;
}

#owl-thumbs.owl-dots .owl-dot::after{
	display: none;
}

#owl-thumbs.owl-dots .owl-dot:hover,
#owl-thumbs.owl-dots .owl-dot.active{
	z-index: 5;
	opacity: 1;
	border: 5px solid rgba(255,255,255,.53);
	-webkit-transform: scale(1);
	-ms-transform: scale(1);
	-o-transform: scale(1);
	transform: scale(1);
}

.testimonial-bg-light #owl-thumbs.owl-dots .owl-dot.active {
	border: 5px solid rgba(0,0,0,.53);
}

/* ===================================
	Progress Bar
====================================== */

.team-progress{
	padding-bottom: 1rem;
}

.bg-skills {background: url(../images/main/skils-bg.jpg); background-size: cover; background-repeat: no-repeat;}

.team-progress .progress-item{
	margin-bottom: 2rem;
	list-style: none;
}

.progress-item {letter-spacing: 2px;}
.team-progress .progress{
	height: 12px;
	margin-top: 12px;
	overflow: hidden;
	-webkit-border-radius: 50px;
	-moz-border-radius: 50px;
	background-color: #eaeaea;
}

.team-progress .progress-item .count{
	font-weight: 500;
}

.team-progress .progress-bar{
	height: 100%;
	-webkit-border-radius: 50px;
	-moz-border-radius: 50px;
	border-radius: 50px;
	background: #21c2c2;
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#3264f5', endColorstr='#7202bb',GradientType=1 );
}

/* ===================================
	Portfolio
====================================== */

#content-scroll {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	overflow: visible;
	height: 100%;
	width: 100%;
}

#showcase-holder {
	width: 100%;
	height: 100vh;
	position: relative;
	perspective: 1000px;
}

#showcase-tilt-wrap {
	width: 100%;
	height: 100vh;
	position: absolute;
	perspective: 1000px;
	overflow: hidden;
}

#showcase-tilt {
	width: 100%;
	height: 100%;
	position: fixed;
	overflow: visible;
	transform-style: preserve-3d;
	-webkit-transform: scale(1.05);
	transform: scale(1.05);
}

#showcase-tilt.disabled {
	-webkit-transform: translate3d(0, 0, 0) scale(1.05) !important;
	transform: translate3d(0, 0, 0) scale(1.05) !important;
	-webkit-transition: 0.5s ease-in-out;
	transition: 0.5s ease-in-out;
}

#showcase-slider {
	height: 100%;
	width: 100%;
}

#main_visual .swiper-slide {
	width: 100%;
	/* height: 100%; */
	position: relative;
	overflow: hidden;
	-webkit-user-select: none;
	-webkit-touch-callout: none;
	user-select: none;
}

#main_visual .swiper-slide::after {
	content: "";
	display:block;
	position: absolute;
	bottom: 0;
	left: 0;
	top:0;
	right:0;
	pointer-events: none;
	/* background: -moz-linear-gradient(top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.5) 100%);
	background: -webkit-linear-gradient(top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.5) 100%);
	background: linear-gradient(to bottom, rgba(0, 0, 0, 0.6) 0%, rgba(0, 0, 0, 0) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fff00000', endColorstr='#a6000000', GradientType=0);
	background:rgba(0,0,0,0.3) url(../images/main/m_bg.png) no-repeat scroll center center;*/
	z-index:1;
}
.img-mask {
	width: 100%;
	height: 100%;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	margin: 0 auto;
	display: table;
	position: relative;
	box-sizing: border-box;
	-webkit-transition: 1.2s ease-in-out;
	transition: 1.2s ease-in-out;
}

.section-image {
	position: relative;
	width: 100%;
	height: 100vh;
	background-repeat: no-repeat;
	background-position: center center;
	background-size: cover;
	opacity: 1;
}

.swiper-pagination-bullet:first-child .title {
	opacity: 0;
	-webkit-transform: translateY(15vh) scale(1);
	transform: translateY(15vh) scale(1);
}

.subtitle {
	margin-bottom: 0;
	opacity: 1;
	line-height: 20px;
	position: relative;
	left: 0;
	display: block;
	font-size: 14px;
	font-weight: 600;
	font-family: 'Poppins', sans-serif;
	opacity: 0;
	-webkit-transform: translateX(20px) scale(1);
	transform: translateX(20px) scale(1);
}

.swiper-pagination-bullet:first-child .subtitle {
	opacity: 0;
	-webkit-transform: translateY(15vh) scale(1);
	transform: translateY(15vh) scale(1);
}

#showcase-holder .showcase-pagination-wrap {
	position: absolute;
	right: 0;
	left: 0;
	margin: 0 auto;
	top: -13%;
	box-sizing: border-box;
	width: 100%;
	z-index: 100;
	height: 100%;
	display: table;
	pointer-events: none;
	transform: translateY(-30vh);
	-webkit-transform: translateY(-30vh);
}

#showcase-holder .showcase-pagination {
	width: 100%;
	height: 100%;
	display: table-cell;
	vertical-align: bottom;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	position: relative;
	pointer-events: none;
}

#showcase-holder .swiper-pagination-bullet {
	position: absolute;
	width: 100%;
	height: auto;
	display: block;
	opacity: 0;
	border-radius: 0;
	background: transparent;
	box-sizing: border-box;
	text-align: center;
	bottom: 0;
	transition: opacity .3s ease-in-out;
}

#showcase-holder .swiper-pagination-bullet-active{
	transition: opacity .3s ease-in-out;
	opacity: 1;
}

#showcase-holder .swiper-pagination-bullet {
	color: #fff;
	text-align: center;
}

.light-content #showcase-holder .swiper-pagination-bullet {
	color: rgba(255, 255, 255, 1);
	text-align: center;
}

.showcase-counter {
	position: absolute;
	width: 100%;
	height: 100%;
	opacity: 0;
}

.counter-wrap {
	-webkit-transition: 0.2s ease-in-out;
	transition: 0.2s ease-in-out;
}

.counter {
	height: 20px;
	width: 50px;
	position: absolute;
	bottom: 38px;
	left: 230px;
	text-align: center;
	opacity: 0;
	font-size: 14px;
	font-weight: 500;
	color: #fff;
	line-height: 20px;
	-webkit-transform: translateY(20px) scale(1);
	transform: translateY(20px) scale(1);
}

.light-content .counter, .light-content .showcase-counter span::after {
	color: #fff;
}

.showcase-counter span{
	width: 20px;
	height: 20px;
	font-size: 14px;
	line-height: 20px;
	position: absolute;
	bottom: 38px;
	left: 300px;
	opacity: 1;
	font-weight: 500;
	color: #fff;
	-webkit-transition: 0.2s ease-in-out;
	transition: 0.2s ease-in-out;
}

.showcase-counter span::after {
	content: attr(data-total);
	position: relative;
}

.showcase-counter::before {
	content: '';
	width: 1px;
	height: 10px;
	position: absolute;
	bottom: 44px;
	left: 282px;
	background-color: rgb(255, 255, 255);
	-webkit-transition: 0.2s ease-in-out;
	transition: 0.2s ease-in-out;
}

.light-content .showcase-counter::before {
	background-color: rgb(255, 255, 255);
}

.scale-up .counter-wrap, .scale-up .showcase-counter::after, .scale-up .showcase-counter::before {
	opacity: 0 !important;
}

.swiper-pagination-bullet:first-child .counter {
	opacity: 0;
	-webkit-transform: translateY(0px) scale(1);
	transform: translateY(0px) scale(1);
}

.caption-border {
	height: 1px;
	background-color: rgba(255, 255, 255, 0.15);
	position: absolute;
	margin: 0 auto;
	bottom: 50px;
	transition: width 0.8s cubic-bezier(0.68, 0, 0.265, 1) 0.2s;
	-webkit-transition: width 0.8s cubic-bezier(0.68, 0, 0.265, 1) 0.2s;
}

.light-content .caption-border {
	background-color: rgba(255, 255, 255, 0.15);
}

.caption-border.left {
	left: 400px;
}

.caption-border.right {
	right: 400px;
}

.caption-border.left::before {
	content: '';
	width: 90px;
	height: 1px;
	position: fixed;
	left: 80px;
	bottom: 50px;
	background-color: rgba(255, 255, 255, 0.4);
}

.caption-border.right::after {
	content: '';
	width: 90px;
	height: 1px;
	position: fixed;
	right: 80px;
	bottom: 50px;
	background-color: rgba(255, 255, 255, 0.5);
}

.caption-border.left .btn-hold-progress-bar {
	right: 0;
}

.caption-border.right .btn-hold-progress-bar {
	left: 0;
}

.arrows-wrap {
	width: 160px;
	height: 80px;
	position: absolute;
	right: 200px;
	pointer-events: initial;
	bottom: 10px;
	opacity: 0;
}

.prev-wrap, .next-wrap {
	width: 80px;
	height: 80px;
	float: left;
	display: flex;
	position: relative;
	justify-content: center;
	align-items: center;
}

.arrows-wrap .swiper-button-next, .arrows-wrap .swiper-button-prev {
	position: relative;
	top: auto;
	width: 40px;
	height: 40px;
	margin-top: 0;
	z-index: 10;
	cursor: pointer;
	background-size: 11px 20px;
	background-position: center;
	background-repeat: no-repeat;
	left: auto;
	right: auto;
	background-image: none !important;
}

.arrows-wrap .swiper-button-prev::before {
	height: 40px;
	width: 40px;
	position: absolute;
	left: 0;
	font-size: 30px;
	line-height: 40px;
	text-align: center;
	font-family:LineIcons;
	content: "\EA44";

	color: #fff;
	-webkit-transition: 0.15s ease-in-out;
	transition: 0.15s ease-in-out;
}

.arrows-wrap .swiper-button-next::before {
	height: 40px;
	width: 40px;
	position: absolute;
	left: 0;
	font-size: 30px;
	line-height: 40px;
	text-align: center;
	font-family:LineIcons;
	content: "\EA46";
	color: #fff;
	-webkit-transition: 0.15s ease-in-out;
	transition: 0.15s ease-in-out;
}

.swiper-thumbnails {
	position: absolute;
	left: 29%;
	bottom: 10%;
	transform: translateX(50%);
}

.bullet {
	height: 50px;
	width: 50px;
	cursor: pointer;
	border-radius: 50%;
	padding: 0px;
	border: 2px solid white;
}

.swiper-thumbnails .bullet img {
	width:100%;
	border-radius: 50%;
}

.swiper-thumbnails .bullet {
	background: transparent;
	height: 60px;
	margin: 0;
	position: relative;
	width: 60px;
	outline: none;
	border: 5px solid rgba(255,255,255,.3);
	margin-left: -30px;
	opacity: .65;
	-webkit-transform: scale(.95);
	-ms-transform: scale(.95);
	-o-transform: scale(.95);
	transform: scale(.95);
}

.swiper-thumbnails .bullet.is-active{
	background: transparent;
	height: 60px;
	margin: 0;
	position: relative;
	width: 60px;
	z-index: 99;
	border: 5px solid rgba(255, 255, 255, 1);
	margin-left: -30px;
	opacity: 1;
	-webkit-transform: scale(.95);
	-ms-transform: scale(.95);
	-o-transform: scale(.95);
	transform: scale(.95);
}

.swiper-thumbnails .bullet:hover {
	opacity: 0.8;
	border: 5px solid rgba(255, 255, 255, 0.66);
	-webkit-transition: opacity 0.2s ease-in-out 0.5s;
	transition: opacity 0.2s ease-in-out 0.5s;
}

.swiper-thumbnails .bullet.is-active:hover {
	opacity: 1;
	border: 5px solid rgba(255, 255, 255, 1);
}

div[data-title="THE QUEEN"] {
	font-size: 20px;
}

/* ===================================
   Contact Section
====================================== */

.bg-contact {background: url(../images/main/white-bg.jpg); background-size: cover; background-repeat: no-repeat;}

.contact-body{width: 100%; height: 500px;}

.main-title {
	position: relative;
	margin-bottom: 4rem;
	text-align: center;
}

.main-title h5 {
	font-family: "Roboto", sans-serif;
	font-weight: 400;
	margin-bottom: 1.5rem;
	color: #24c1dd;
}

.main-title h2 {
	text-transform: uppercase;
	font-weight: 300;
	color: #ffffff;
	letter-spacing: 2px;
	line-height: 1.2;
	max-width: 650px;
	margin-bottom: 1.5rem;
	margin-left: auto;
	margin-right: auto;
}

.main-title p {
	max-width: 720px;
	margin: 0 auto;
}

.alert-danger {
	border-radius: 36px;
}

.contact-para-setting {
	max-width: 480px;
}

.contact-info .icon-box {
	display: table;
	padding-top: 1.5rem;
}

.contact-info .icon-box:last-child {
	padding-bottom: 0.5rem;
}

.contact-info h5 {
	margin-bottom: 2rem;
}

.contact-info i {
	display: table-cell;
	font-size: 30px;
	padding-right: 15px;
}

.contact-info p {
	transform: translateY(-10px);
}

.bg-contact .form-control {
	padding: 1.5rem .75rem;
}

.form-control.message {
	padding: 13px 10px 10px;
	height: 150px;
}

.contact-form-textfield input,
.contact-form-textfield textarea {
	font-size: 14px;
	border: 1px solid #dcdbdb;
	color: #535353 !important;
	border-radius: 30px;
	-webkit-transition: 300ms ease-in all;
	-o-transition: 300ms ease-in all;
	transition: 300ms ease-in all;
}

.contact-form-textfield input::-webkit-input-placeholder, .contact-form-textfield textarea::-webkit-input-placeholder,
.contact-form-textfield input:-moz-placeholder, .contact-form-textfield textarea:-moz-placeholder,
.contact-form-textfield input::-moz-placeholder, .contact-form-textfield textarea::-moz-placeholder,
.contact-form-textfield input:-ms-input-placeholder, .contact-form-textfield textarea:-ms-input-placeholder,
.contact-form-textfield input::placeholder, .contact-form-textfield textarea::placeholder{
	color: #ffffff !important;
}

.contact-form-textfield input:focus, .contact-form-textfield textarea:focus {
	border-color: #dcdbdb;
	-webkit-box-shadow: none;
	box-shadow: none;
	color: #333333;
}

.contact-form-textfield textarea {
	height: 120px;
	resize: none;
}

.form-control {
	box-shadow: none;
}

.contact-box-shadow {
	background: #ffffff;
	-webkit-box-shadow: 0px 0px 26px 16px rgba(0,0,0,0.02);
	box-shadow: 0px 0px 26px 16px rgba(0,0,0,0.02);
	padding: 30px 25px;
}


.company-contact-form .form-control, .company-contact-form .form-control:focus {
	background-color: transparent;
}

.contact-form-textfield input, .contact-form-textfield textarea {
	color: #7b7b7b !important;
	border-radius: 30px;
	border-color: #e3e3e3;
}

.company-contact-form .form-control::placeholder {color: #7b7b7b;}
.company-contact-form .form-control:-ms-input-placeholder {color: #7b7b7b;}
.company-contact-form .form-control:-ms-input-placeholder {color: #7b7b7b;}


/* ===================================
	Footer
====================================== */

footer.bg-black2 {
	background: #f8f9fa;
}

.footer-icons li {
	display: inline-block;
}

.footer-icons li a  {
	display: block;
	height: 55px;
	width: 55px;
	font-size: 18px;
	color: #676767;
	line-height: 60px;
	text-align: center;
	margin: 0 0.1rem;
	border-radius: 40px;
	background: transparent;
	-webkit-transition: all .3s ease !important; -o-transition: all .3s ease !important; transition: all .3s ease !important;
}

.copyrights, .copyrights a {
	font-size: 14px;
	color: #535353;
}

.copyrights a:hover, .copyrights a:focus {
	color: #24c1dd;
}
.footer-icons li a:hover, .footer-icons li a:focus {
	color: #ffffff;
}

.footer-icons li a.facebook:hover, .footer-icons li a.facebook:focus {
	-webkit-box-shadow: 0 0 15px 30px #4267B2 inset;
	box-shadow: 0 0 15px 30px #4267B2 inset;
}

.footer-icons li a.twitter:hover, .footer-icons li a.twitter:focus {
	-webkit-box-shadow: 0 0 15px 30px #1DA1F2 inset;
	box-shadow: 0 0 15px 30px #1DA1F2 inset;
}

.footer-icons li a.google:hover, .footer-icons li a.google:focus {
	-webkit-box-shadow: 0 0 15px 30px #DB4437 inset;
	box-shadow: 0 0 15px 30px #DB4437 inset;
}

.footer-icons li a.linkedin:hover, .footer-icons li a.linkedin:focus {
	-webkit-box-shadow: 0 0 15px 30px #0077B5 inset;
	box-shadow: 0 0 15px 30px #0077B5 inset;
}

.footer-icons li a.instagram:hover, .footer-icons li a.instagram:focus {
	-webkit-box-shadow: 0 0 15px 30px #C32AA3 inset;
	box-shadow: 0 0 15px 30px #C32AA3 inset;
}

.footer-icons li a.pinterest:hover, .footer-icons li a.pinterest:focus {
	-webkit-box-shadow: 0 0 15px 30px #BD081C inset;
	box-shadow: 0 0 15px 30px #BD081C inset;
}

.footer-icons li a i:hover {
	color: #ffffff;
	border-radius: 40px;
}

/* ===================================
	Cursor
====================================== */

#aimated-cursor {
	position: absolute;
	left: 0;
	display: inline-block;
	top: 0;
	width: 30px;
	height: 30px;
	pointer-events: none;
	z-index: 10000;
	-webkit-transition: opacity 0.2s ease-in-out 0.5s;
	transition: opacity 0.2s ease-in-out 0.5s;
}


#cursor {
	position: fixed;
	transform: translate(-50%, -50%);
	width: 30px;
	height: 30px;
	border: 2px solid rgb(255, 255, 255);
	border-radius: 50%;
	pointer-events: none;
	opacity: 1;
	box-sizing: border-box;
}

#cursor:before {
	font-family: FontAwesome;
	content: "\f053";
	font-size: 6px;
	width: 4px;
	height: 8px;
	line-height: 8px;
	text-align: center;
	position: absolute;
	left: -12px;
	top: 9px;
	color: #ffffff;
	opacity: 0;
	transition: all 0.1s cubic-bezier(0.215, 0.61, 0.355, 1) 0s;
}

#hold-event {
	width: 26px;
	height: 26px;
	position: absolute;
	top: 0px;
	left: 0px;
	border-radius: 100%;
	background: rgba(255,255,255,0);
}

#cursor-loader {
	width: 40px;
	height: 40px;
	position: absolute;
	background-color: transparent;
	border-right: 2px solid transparent;
	border-bottom: 2px solid #ffffff;
	border-left: 2px solid transparent;
	border-top: 2px solid transparent;
	border-radius: 50px;
	box-sizing: border-box;
	opacity: 0;
	transform: translate(-9px, -9px) rotate(0deg);
	-webkit-animation: rotating 0.8s ease-in-out infinite;
	animation: rotating 0.8s ease-in-out infinite;
	-webkit-transition: opacity 0s ease-in-out 0s;
	transition: opacity 0s ease-in-out 0s;
}

#cursor:after {
	font-family: FontAwesome;
	content: "\f054";
	font-size: 6px;
	width: 4px;
	height: 8px;
	line-height: 8px;
	text-align: center;
	position: absolute;
	right: -10px;
	top: 9px;
	color: #ffffff;
	opacity: 0;
	transition: all 0.2s cubic-bezier(0.215, 0.61, 0.355, 1) 0s;
}

@keyframes rotating {
	0% {
		-webkit-transform: translate(-7px, -7px) rotate(0deg);
		transform:  translate(-7px, -7px) rotate(0deg);
	}

	95% {
		-webkit-transform:  translate(-7px, -7px) rotate(350deg);
		transform:  translate(-7px, -7px) rotate(350deg);
	}

	100% {
		-webkit-transform:  translate(-7px, -7px) rotate(360deg);
		transform:  translate(-7px, -7px) rotate(360deg);
	}
}

/* ===================================
	Rev-Slider Before After
====================================== */

/* before-after background */
.rs-addon-beforeafter-before{
	background: rgba(38,38,38,0.5);
}

.rs-before-after-addon {
	overflow: hidden !important;
}

.rs-before-after-addon .tparrows {
	z-index: 1000 !important;
}

.rs-addon-beforeafter-btn {
	position: absolute;
	display: table;
	cursor: pointer;
	text-align: center;
	white-space: nowrap;
	z-index: 102;
}

.rs-addon-beforeafter-btn i {
	display: table-cell;
	vertical-align: middle;
	position: relative;
}

.rs-beforeafter-shift-arrows .rs-addon-beforeafter-btn i {
	-webkit-transform: translateX(0) !important;
	transform: translateX(0) !important;
}

.rs-addon-beforeafter-btn-vertical,
.rs-addon-beforeafter-btn-vertical i {
	display: block;
}

.rs-addon-beforeafter-line {
	display: block;
	position: absolute;
	z-index: 102;
}

.rs-addon-beforeafter-line.rs-beforeafter-horizontal {
	top: 0;
	height: 100%;
}

.rs-addon-beforeafter-line.rs-beforeafter-vertical {
	left: 0;
	width: 100%;
}

.rs-before-after-element {
	opacity: 0;
	visibility: hidden;
}

.rs-before-after-element,
.rs-before-after-element:before {
	-webkit-user-select: none;
	-moz-user-select: none;
	user-select: none;
}

.rs-addon-beforeafter-bg {
	opacity: 0;
	z-index: 999;
}

.rs-addon-beforeafter-bg,
.rs-addon-beforeafter-revealer,
.rs-addon-beforeafter-revealer .tp-loop-wrap {
	width: 100%;
	height: 100%;
}

.rs-addon-beforeafter-bg,
.rs-addon-beforeafter-revealer {
	position: absolute;
	overflow: hidden;
}

.rs-addon-beforeafter-before {
	top: 0;
	left: 0;
}

.rs-addon-beforeafter-horizontal .rs-addon-beforeafter-bg,
.rs-addon-beforeafter-horizontal .rs-addon-beforeafter-after {
	top: 0;
	right: 0;
}

.rs-addon-beforeafter-vertical .rs-addon-beforeafter-bg,
.rs-addon-beforeafter-vertical .rs-addon-beforeafter-after {
	bottom: 0;
	left: 0;
}

.rs-addon-beforeafter-bg,
.rs-addon-beforeafter-after {
	opacity: 0;
}

.rs-addon-beforeafter-inner,
.rs-addon-beforeafter-bg-inner  {
	position: absolute;
	width: 100%;
	height: 100%;
}

.rs-addon-beforeafter-horizontal .rs-addon-beforeafter-inner,
.rs-addon-beforeafter-horizontal .rs-addon-beforeafter-bg-inner {
	right: 0;
	top: 0;
}

.rs-addon-beforeafter-vertical .rs-addon-beforeafter-inner,
.rs-addon-beforeafter-vertical .rs-addon-beforeafter-bg-inner {
	left: 0;
	bottom: 0;
}

.rs-video-beforeafter,
.rs-video-beforeafter .tp-mask-wrap {
	width: 100% !important;
	height: 100% !important;
}

.rs-before-after-addon:not(.before-after-carousel).dragging,
.rs-before-after-addon:not(.before-after-carousel).dragging *,
.rs-before-after-addon:not(.before-after-carousel).dragging .rs-addon-beforeafter-btn i:before {
	-webkit-user-select: none !important;
	-moz-user-select: none !important;
	user-select: none !important;
}

.rs-beforeafter-pointers,
.rs-beforeafter-pointers .rs-addon-beforeafter-inner {
	pointer-events: none;
}

.rs-beforeafter-pointers *:not(.rs-addon-beforeafter-inner) {
	pointer-events: auto;
}

.rs-beforeafter-pointers .rs-video-beforeafter,
.rs-beforeafter-pointers .rs-video-beforeafter * {
	pointer-events: none;
}

.tparrows.tp-leftarrow:before {
	content: '\f104'!important;
	font-family: "Font Awesome 5 Free";
	font-weight: 600;
}

.tparrows.tp-rightarrow:before {
	content: '\f105'!important;
	font-family: "Font Awesome 5 Free";
	font-weight: 600;
}

/* ===================================
   Loader
====================================== */

.loader {
	background: #fff;
	text-align: center;
	height: 100vh;
	z-index: 999;
	position: fixed;
	width: 100%;
	display: flex;
	justify-content: center;
	align-items: center;
}

.linear-activity {
	overflow: hidden;
	width: 100%;
	height: 4px;
	background-color: transparent;
	margin: 20px auto;
}

.determinate {
	position: relative;
	max-width: 100%;
	height: 100%;
	-webkit-transition: width 500ms ease-out 1s;
	-moz-transition: width 500ms ease-out 1s;
	-o-transition: width 500ms ease-out 1s;
	transition: width 500ms ease-out 1s;
	background-color: #3a91dd;
}

.indeterminate {
	position: relative;
	width: 100%;
	height: 100%;
}

.indeterminate:before {
	content: '';
	position: absolute;
	height: 100%;
	background-color: #3a91dd;
	animation: indeterminate_first 1.5s infinite ease-out;
}

.indeterminate:after {
	content: '';
	position: absolute;
	height: 100%;
	background-color: #3a91dd;
	animation: indeterminate_second 1.5s infinite ease-in;
}

@keyframes indeterminate_first {
	0% {
		left: -100%;
		width: 100%;
	}
	100% {
		left: 100%;
		width: 10%;
	}
}

@keyframes indeterminate_second {
	0% {
		left: -150%;
		width: 100%;
	}
	100% {
		left: 100%;
		width: 10%;
	}
}

/* ===================================
   Media Queries
====================================== */

@media screen and (max-width:1199px) {
	.bg-services, .bg-team, .bg-skills, .portfolio-sec, .bg-contact {height: auto; padding: 6rem 0; text-align: center;}
	.bg-contact {padding:0 0 4rem 0; text-align: center;}

	.swiper-thumbnails { left: 24%;}
	.header-appear .side-nav-btn{left: 15px;}
	.side-logo-nav .social_icons{display: none}
	.top-fixed-nav .collapse .mr-0{margin-right: -30px !important;right: 0 !important;}
	.top-fixed-nav .side-nav-btn{left: 15px;}
	.slide-text{font-size:60px;font-weight: 700;}
	.side-logo-nav .side-nav-btn {
		position: inherit;
		top: 0;
		color: #000000;
		transition: all 0.3s ease;
		width: 28px;
		-webkit-border-radius: 4px;
		-moz-border-radius: 4px;
		cursor: pointer;
		z-index: 99;
		-webkit-transition: all linear 300ms;
		margin-bottom: 5px;
		margin-left: 10px;
	}
	#pp-nav {
		display: none!important;
	}
	.slider-social {
		display: none!important;
	}
}

@media screen and (max-width: 991px) and (min-width: 768px) {

	html {
		scroll-behavior: smooth;
	}
	#aimated-cursor {
		display: none;
	}
	.bg-services, .bg-team, .bg-skills, .portfolio-sec, .bg-contact {
		height: auto;
	}
	.slider{
		padding: 0;
	}
	.arrows-wrap {
		right: 38%;
		top: 100%;
	}
	#content-scroll {
		position: relative;
	}
}

@media screen and (max-width:991px) {

	.swiper-thumbnails { left: 12%;}
	.inner-wrapper .navbar-nav {-ms-flex-direction: column;flex-direction: column;}
	.side-nav .navbar-nav .nav-item{margin: 9px auto;}
	.side-menu.side-btn-style2 .btn-close{left: auto;right: 47px;}
	.top-fixed-nav a.logo{position: relative;top: 0;left: 0;transform: translateX(0);}
	.top-fixed-nav .side-nav-btn{position: relative;top: 0;left: 0;}
	header.header-appear .top-center-logo a.logo{top: 0;position: relative;left: 0;transform: translateX(0);}
	.header-appear .side-nav-btn {position: inherit;top: 45px;left: 0;}
	.header-appear .side-menu .btn-close{right:47px;left: auto;}

}


@media screen and (max-width: 767px) {
	html {scroll-behavior: smooth;}
	.portfolio-sec {padding: 0; text-align: center;}
	.swiper-thumbnails {display: none;}
	#services_slider h1{font-size: 1.75rem;}
	.logo-dark {margin-left: 20px;}


	.services-item .testimonial-line{
		width: 5px;
		opacity: 0;
		height: 3px;
		left: auto;
		position: relative;
		text-align: center;
		margin-bottom: 40px;
		background-color: #d00520;
	}
	#services_slider .owl-dots {
		position: relative;
		bottom: 0;
		display: block;
		text-align: center;
		width: 100%;
	}
	.testimonial-quote {
		text-align: center;
	}
	.testimonial-quote h1 {font-size: 1.75rem}
	.team-img {margin: 0 auto;}
	.testimonial-line {margin:  0 auto;}
	#owl-thumbs.owl-dots {
		text-align: center;}
	.caption-border.left::before {
		background-color: rgba(255, 255, 255, 0);
	}
	.caption-border.right::after {
		background-color: rgba(255, 255, 255, 0);
	}
	#content-scroll {
		position: relative;
	}
	.showcase-counter::after {
		display: none;
	}
	.showcase-counter::before {
		display: none;
	}
	.showcase-counter span {
		display: none;
	}
	.counter-wrap {
		display: none;
	}
	.arrows-wrap {
		right: 38%;
		top: 100%;
	}
	.tparrows {top: 95%!important;}

	#page-scroll .section{
		height: 100%;
	}
	#aimated-cursor {display: none;}

	.max-width {
		width:50%;
	}
	.main-title {
		margin-bottom: 2.5rem;}
	.form-control.message {
		height: 90px;
	}
	.side-nav-btn {top: 25px;}
	.navbar-standard {padding: 18px 0;}
	.title {font-size: 2rem;}
}

@media screen and (max-width:479px) {
	.side-nav-btn {
		left: auto;
		right: 0;
		margin-right: 20px;
	}
	.side-menu .btn-close{right:47px;left: auto;}
	.side-logo-nav .logo .logo-dark, .side-logo-nav .logo .logo-light.default{margin-left: 10px}
	.arrows-wrap {
		right: 27%;
		top: 100%;
	}
}

@media screen and (max-width:359px) {
	.team-progress .progress-item{
		margin-bottom: 1rem;
	}
	.counter,.showcase-counter span{
		pointer-events: initial;
	}
}





/* ------------------------------------------------------------------------ 추가 css ------------------------------------------------------------------------*/
/* ------------------------------------------------------------------
	메인비쥬얼
------------------------------------------------------------------ */

#main_visual{
	z-index:1;
	position:relative;
	height:100vh;
	overflow: hidden;
}
@keyframes progress {
	0% {width: 0;}
	to {width: 100%;}
}
@keyframes imgscale {
	0% {transform: scale(1.4,1.4);}
	to {transform: scale(1);}
}
.main_visual .item {position: relative}
.main_visual .img-bx {
	/* display:block; */
	position: relative;
	overflow: hidden;
}
.main_visual .img-bx:after {
	content: "";
	display: block;
	padding-bottom: 100vh;
}

.main_visual .img-bx iframe,.main_visual .img-bx video,.main_visual .img-bx>img {
	display: block;
	position: absolute;
	top: 50%;
	left: 50%;
	width: auto;
	height: auto;
	min-width: 1000%;
	min-height: 1000%;
	max-width: none;
	max-height: none;
	transform: translate(-50%,-50%) scale(0.1)
}

@media (min-width: 1200px){
	.container.container-m {
		width: 100% !important;
		max-width: 100% !important;
	}
}
@media (min-width: 1800px){
	.container.container-m {
		max-width: 1780px !important;
	}
	#main_visual video {
	  height: auto;
	  width:100%;
	 }
}
@media (max-width: 1199px){
	#main_visual {
		margin-top: 85px;
		height: 680px;
	}
	.main_visual .img-bx:after {padding-bottom:83vh;}
}
@media (max-width: 991px){
	#main_visual{		
		height: 500px;
	}
	.main_visual .img-bx:after {padding-bottom:60vh;}
}
@media (max-width: 768px){
	#main_visual{		
		height: 380px;
	}
	.main_visual .img-bx:after {
		padding-bottom:47vh
	}
}
@media (max-width: 500px){
	#main_visual{
		height: 300px;
	}

	.main_visual .img-bx:after {padding-bottom:58vh;}
	.main_visual .img-bx iframe,.main_visual .img-bx video,.main_visual .img-bx>img {
		top: 35%;
		left: 40%;
		min-width: 600%;
		min-height: 700%;
	}
}


/* 비주얼 텍스트 */
.main_visual .txt-bx {
	width: 100%;
	z-index: 10;
	position: absolute;
	top: 40%;
	left: 50%;
	transform: translate(-50%,-50%);
	font-family: 'Play' ,'SCDream';
	color: #fff;
	letter-spacing: 0em;
	/*text-shadow: 0 0 1em rgba(0,0,0,0.5);*/
}
.main_visual .txt-bx .s-tit {
	color:#5c96ff;
	margin: 0.9em 0 0em;
	font-size: 1.5em;
	font-weight: 600;
}
.main_visual .txt-bx .title {
	color:rgba(255,255,255,1);
	margin: 0.3em 0 0.5em;
	font-size: 2.8em;
	font-weight: 500;
	letter-spacing: -0.07em;
	line-height: 1.2;
}
.main_visual .txt-bx .text {
	color:rgba(255,255,255,0.7);
	letter-spacing:0em;
	line-height:130%;
	font-size: 1.2em;
	font-weight: 400;
}
/*
.main_visual .swiper-slide .txt-bx .text, .main_visual .swiper-slide .txt-bx .text02, .main_visual .swiper-slide .txt-bx .title {
	transform: translateY(50px);
	opacity: 0;
	transition: 1000ms opacity,1000ms transform;
}
.main_visual .swiper-slide-active .txt-bx .text, .main_visual .swiper-slide .txt-bx .text02, .main_visual .swiper-slide-active .txt-bx .title {
	transform: translateY(0);
	opacity: 1
}
.main_visual .swiper-slide-active .img-bx {
	animation-duration: 4s;
	animation-delay: 0.1s;
	animation-iteration-count: 1;
	animation-direction: normal;
	animation-fill-mode: both;
	animation-name: imgscale
}
*/


@media (max-width: 1199px){
	.main_visual .txt-bx .s-tit {font-size: 1.4rem;}
	.main_visual .txt-bx .title {font-size: 2.5rem;}
}
@media (max-width: 768px){
	.main_visual .txt-bx .title {font-size: 2rem;}
}
@media (max-width: 500px){
	.main_visual .txt-bx {
		top: 25%;
	}
	.main_visual .txt-bx .s-tit {font-size: 1.4rem;}
	.main_visual .txt-bx .title {font-size: 1.8rem;}
	.main_visual .txt-bx .text {display:none;}
}



/***********************************************
	swiper
************************************************/
.main_visual .swiper-play {
	display: block;
	padding-right: 8px;
	padding-left: 8px;
	cursor: pointer;
}
.main_visual .swiper-play .xi-pause {
	display: none;
}
.main_visual .swiper-play.on .xi-pause {
	display: inline-block
}
.main_visual .swiper-play.on .xi-play {
	display: none;
}
.main_visual .swiper-control.swiper-control--progress {
	position: absolute;
	bottom: 0;
	left: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	z-index: 3;
	width: 100%
}
.main_visual .swiper-control.swiper-control--progress .swiper-pagination {
	transform: none
}
.main_visual .swiper-control.swiper-control--progress .swiper-pagination-bullets {
	position: static;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%
}
/* bullet */
.main_visual .swiper-control.swiper-control--progress .swiper-pagination-bullet {
	position: relative;
	display: block;
	margin: 0;
	border-radius: 0;
	width: 100%;
	height: 5px;
	background: rgba(0,0,0,0.3);
	opacity: 1
}
.main_visual .swiper-control.swiper-control--progress .swiper-pagination-bullet:after {
	content: "";
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	width: 0;
	height: 100%;
	background-color:rgba(52,121,199,1);
}
.main_visual .swiper-control.swiper-control--progress .swiper-pagination-bullet.swiper-pagination-bullet-active:after {
	animation: progress 9s linear 0s 1;
	width: 100%
}


.main_visual .swiper-control.swiper-control--progress-no {
	position: absolute;
	left: 0;
	right: 0;
	bottom: 3.125rem;
	z-index: 10
}
.main_visual .swiper-control.swiper-control--progress-no .container {
	display: flex;
	align-items: center
}
.main_visual .swiper-control.swiper-control--progress-no .swiper-pagination {
	position: static;
	transform: none
}
.main_visual .swiper-control.swiper-control--progress-no .swiper-pagination-bullet {
	width: auto;
	height: auto;
	opacity: 1;
	background: none;
	color: #fff;
	font-weight: 700;
	margin-right: 1.875rem;
	padding-right: 0;
	position: relative
}
.main_visual .swiper-control.swiper-control--progress-no .swiper-pagination-bullet:before {
	content: "";
	display: none;
	position: absolute;
	left: 2.1875rem;
	top: 50%;
	transform: translateY(-50%);
	width: 7.5rem;
	height: 2px;
	background: rgba(255,255,255,1)
}
.main_visual .swiper-control.swiper-control--progress-no .swiper-pagination-bullet:after {
	content: "";
	display: none;
	position: absolute;
	left: 2.1875rem;
	top: 50%;
	transform: translateY(-50%);
	width: 0;
	height: 2px;
	background: #000
}
.main_visual .swiper-control.swiper-control--progress-no .swiper-pagination-bullet-active {
	color: #000;
	padding-right: 8.4375rem
}
.main_visual .swiper-control.swiper-control--progress-no .swiper-pagination-bullet-active:after,.main_visual .swiper-control.swiper-control--progress-no .swiper-pagination-bullet-active:before {
	display: block
}
.main_visual .swiper-control.swiper-control--progress-no .swiper-pagination-bullet-active:after {
	animation: progress 5.1s linear 0s 1
}


.main_visual .swiper-control--origin {
	position: absolute;
	bottom: 4rem;
	width: 100%
}


@media (max-width: 1199px) {
	.main_visual .swiper-control--origin {bottom:3rem;}
}

@media (max-width: 768px) {
	.main_visual .swiper-control--origin {bottom:2rem;}
}

@media (max-width: 500px) {

}


.main_visual .swiper-pagination-bullet {
	width: 10px;
	height: 10px;
	margin: 0 4px;
	border-radius: 5px;
	background: #fff;
	opacity:1;
}

.main_visual .swiper-pagination-bullet:first-child {margin-left: 0px;}

.main_visual .swiper-pagination-bullet-active {
	background: #5c96ff !important;
	width: 60px;
}

@media (max-width: 1024px) {
	.main_visual .swiper-pagination {bottom:1.25rem;}
}



/* ------------------------------------------------------------------
	Business
------------------------------------------------------------------ */

.m_business  {position:relative; z-index:0;}

@media (max-width:991px){
	.m_business{padding:6.5rem 0 0;}
}
@media (max-width:767px){
	.m_business{padding:5rem 0 0;}
}

/* 제목 */
.m_busi_titbox{
	color:#111;
	margin-bottom:2rem;
}
.m_busi_titbox .tit{
	font-size: 2.7rem;
    font-weight: 600;
    letter-spacing: -0.15rem;
}
.m_busi_titbox .txt{
	font-size:1.2rem;
	opacity:0.8;
}

/* 컨텐츠 */
.m_business  .m_busi_contents{}
.m_business .busi_contbox{position:relative;
}
	.m_business  .busi_contbox:after{
		position:absolute;
		display: block;
		content: '';
		right:0;
		left:0;
		top:0;
		bottom:0;
		background: rgba(0,0,0,0.3);
		z-index:0;
		transition: all 0.4s ease-out;
	}
	.m_business .busi_contbox:hover:after{
		background: rgba(0,0,0,0);
		transition: all 0.4s ease-out;
	}

.m_business .busi_contbox.left{background:url("../images/main/busi_img01.jpg") no-repeat  50% 0%;background-size:cover;}
.m_business .busi_contbox.right{background: rgba(0,0,0,1) url("../images/main/busi_img02.jpg") no-repeat  50% 0%;background-size:cover;}



/* text style */
.busi_contbox .text_st{
	position:relative;
	z-index:1;
	color:#fff;
}
.busi_contbox .busi_tit .tit_s{
	font-family: 'Play';
	letter-spacing:0;
	font-size:1rem;
}
.busi_contbox .busi_tit .tit{
	font-size:3.2rem;
	font-weight:600;
	margin-top: 10px;
}
.busi_contbox .busi_tit .txt{
	opacity:0.7;
	line-height: 1.4;
}

@media (max-width:1199px){
	.busi_contbox .busi_tit .tit{font-size:2.4rem;}

}



/* btn */
.busi_contbox .btn_box {
	position:relative;
	display:inline-block;
	margin-top:13rem;
}
.busi_contbox .btn_box .btn_more{
	color:#fff;
	font-family: 'Play';
	letter-spacing:0;
	padding:0.7rem 2rem;
	background:rgba(255,255,255,0.1);
	border:1px solid rgba(255,255,255,0.2);
	border-radius:2rem;
	display:block;
}
.busi_contbox .btn_box .btn_more:hover{
	color:#fff;
	background:#5c96ff !important;
	border:1px solid #5c96ff;
}
.busi_contbox .btn_box .btn_more .material-symbols-outlined {
	font-size: 2rem;
	font-variation-settings: 'FILL' 0.5, 'wght' 100, 'GRAD' 0;
}

@media (max-width:991px){
	.busi_contbox .btn_box {
		margin-top:7rem;
	}

}
@media (max-width:767px){
	.busi_contbox .btn_box {
		margin-top:3rem;
	}

}



/* ------------------------------------------------------------------
	INNOVATION TOPTECH(회사소개)
------------------------------------------------------------------ */
.m_about{
	background: url("../images/main/about_bg.jpg") no-repeat  50% 0%;
	background-size:cover;
}
@media (max-width:1199px){
	.m_about{padding:8rem 0;}
}
@media (max-width:991px){
	.m_about{padding:6.5rem 0;}
}
@media (max-width:767px){
	.m_about{padding:5rem 0;}
}

.m_about_title .tit{
	font-family:'Metropolis';
	font-weight:400;
	font-size:3.6rem;
	color:#111;
	line-height: 1.05;
}
.m_about_title .tit strong{font-weight:600; display:block;}
.m_about_title .txt{font-size:1.2rem; }

@media (max-width:991px){
	.m_about_title .tit{font-size:3rem;}
}
@media (max-width:511px){
	.m_about_title .tit{font-size:2.6rem;}
}


/* banner_style */
.m_about_contents .about_bn{
	position:relative;
	z-index:0;
	border-radius:1.5rem;
	overflow:hidden;
	text-align:center;
	color:#fff;

}
	.m_about_contents .about_bn:after{
		position:absolute;
		display: block;
		content: '';
		right:0;
		left:0;
		top:0;
		bottom:0;
		background: rgba(0,0,0,0);
		z-index:0;
		transition: all 0.4s ease-out;
	}
	.m_about_contents .about_bn:hover:after{
		background: rgba(0,0,0,0.6);
		transition: all 0.4s ease-out;
	}

.m_about_contents .about_bn.bn01{background:url("../images/main/about_img01.jpg") no-repeat  50% 50%; background-size:cover;}
.m_about_contents .about_bn.bn02{background:url("../images/main/about_img02.jpg") no-repeat  50% 50%; background-size:cover;}
.m_about_contents .about_bn.bn03{background:url("../images/main/about_img03.jpg") no-repeat  50% 50%; background-size:cover;}
.m_about_contents .about_bn.bn04{background:url("../images/main/about_img04.jpg") no-repeat  50% 50%; background-size:cover;}

@media (max-width:1199px){
	.m_about_contents .about_bn{text-align:left;}
}


/* text style*/
.m_about_contents .text_st{
	position:relative;
	z-index:1;
}
.m_about_contents .text_st .tit{
	font-size:1.8rem;
	font-weight:600;
}
.m_about_contents .text_st .txt{
	opacity:0.8;
}
.m_about_contents .text_st .btn_more{
	color:#fff;
	font-family: 'Play';
	background:rgba(255,255,255,0.1);
	border:1px solid rgba(255,255,255,0.2);
	border-radius:50%;
	width:100px;
	height:100px;
	margin:5rem auto 0;
	display: flex;
	justify-content: center;
	align-items: center;
}
@media (max-width:1200px){
	.m_about_contents .text_st{padding: 0 3rem;}
}
@media (max-width:767px){
	.m_about_contents .text_st .tit{font-size:2rem;}
	.m_about_contents .text_st .btn_more{
		position:absolute;
		right:3rem;
		top:-1em;
		margin:0;
	}
}

@media (max-width:511px){
	.m_about_contents .text_st .btn_more{
		position: relative;
		margin-top: 3rem;
		margin-left: 3rem;
		height: 30px;
		border-radius: 2rem;
	}
}


/* ------------------------------------------------------------------
	R&D센터
------------------------------------------------------------------ */
.m_rnd{
	background: url("../images/main/rnd_bg.jpg") no-repeat  50% 0%;
	background-size:cover;
}
@media (max-width:1199px){
	.m_rnd{padding:8rem 0;}
}
@media (max-width:991px){
	.m_rnd{padding:6.5rem 0;}
}
@media (max-width:767px){
	.m_rnd{padding:5rem 0;}
}

.m_rnd_title{color:#fff;}
.m_rnd_title .tit{
	font-weight:600;
	font-size:2.7rem;
}
.m_rnd_title .tit span{
	font-family:'Metropolis';
	font-size:3.6rem;
}
.m_rnd_title .txt{font-size:1.2rem; opacity:0.8;}



/* banner_style */
.m_rnd_contents .rnd_bn{
	text-align:center;
	color:#fff;
	width: 310px;
	height:310px;
	border-radius:10%;
	overflow:hidden;
	display:flex;
	align-items: center;
	justify-content: center;
	background:rgba(92, 150, 255, 0);
	position:relative;
	transition: all 0.4s ease-out;
}

.m_rnd_contents .rnd_bn i{
	margin-bottom:1rem;
	display: inline-block;
}



@media (max-width:1199px){
	.m_rnd_contents .rnd_bn{
		width: 260px;
		height:260px;

	}
}

@media (max-width:991px){
	.m_rnd_contents .rnd_bn{
		width: 200px;
		height:200px;
	}
}

@media (max-width:767px){
	.m_rnd_contents .rnd_bn{
		width: 165px;
		height:165px;
	}
	.m_rnd_contents .rnd_bn i{width: 60%;}
}
@media (max-width:575px){
	.m_rnd_contents .rnd_bn{
		width: 100%;
		height:auto;
		border:1px solid rgba(255, 255, 255, 0.3);
		border-radius:1.5rem;
		padding:2rem 2.5rem;
	}
	.m_rnd_contents .rnd_bn i{width: auto; margin-bottom: 0;}
	.m_rnd_contents .rnd_bn i img {height: 50px;}

}


.m_rnd_contents .text_st .tit{
	font-size:1.5rem;
	font-weight:500;
}
.m_rnd_contents .text_st .txt{
	font-family:'Play';
	letter-spacing:0;
	color:rgba(255, 255, 255, 0.7);
	display:none;
	transition: all 0.4s ease-out;
}
/*@media (max-width:1199px){
	.m_rnd_contents .text_st .tit{font-size:1.2rem;}
}
@media (max-width:991px){
	.m_rnd_contents .text_st .tit{font-size:1.1rem;}
	.m_rnd_contents .text_st .txt{font-size:0.9rem;}
}*/


/* 배너 마우스 오버시 */

.m_rnd_contents .rnd_bn:hover{
	background:rgba(92, 150, 255, 0.55);
	transition: all 0.4s ease-out;
}
.m_rnd_contents .rnd_bn:hover .text_st .txt{
	display:block;
	transition: all 0.4s ease-out;
}
@media (max-width:991px){
	.m_rnd_contents .rnd_bn:hover .text_st .txt{
		display:none;
	}
}




/* ------------------------------------------------------------------
	채용안내
------------------------------------------------------------------ */
.m_recruit{
	position:relative;
	z-index:1;
}
	.m_recruit::after{
		content:'TOPTECH';
		color:rgba(0,0,0,0.025);
		font-family:'Metropolis';
		font-size:13rem;
		font-weight:600;
		display:inline-block;
		position:absolute;
		left:0;
		bottom:13%;
		z-index:0;
	}
	.m_recruit::before{
		content:'';
		position:absolute;
		width:38%;
		height:100%;
		top:0;
		right:0;
		background:#f6f6f6;
		z-index:0;
	}
@media (max-width:1199px){
	.m_recruit{padding:8rem 0;}
	.m_recruit::after{
		left:auto;
		right:0;
		bottom:50%;
	}
}
@media (max-width:991px){
	.m_recruit{padding:6.5rem 0;}
	.m_recruit::after{
		font-size:10rem;
	}
}

@media (max-width:767px){
	.m_recruit{padding:6rem 0;}
	.m_recruit::after{display:none;}
	.m_recruit::before{display:none;}
}



.m_recruit .container{position:relative; z-index:3;}







/* 컨텐츠 */
.m_recruit .m_rec_contbox{position:relative; z-index:1;}
.m_recruit .m_rec_contbox .rec_bn{
	position:relative;
	display:block;
	padding:1rem 1.5rem;
	background:#fff;
	border:1px solid #e6e6e6;
	border-radius:0.5rem;
	color:#111;
	transition: all 0.4s ease-out;
}
.m_recruit .m_rec_contbox .rec_bn:hover{
	background:#5c96ff;
	border:1px solid #5c96ff;
	/*border-radius:2.5rem;*/
	color:#fff;
	font-weight:500;
	transition: all 0.4s ease-out;
}
.m_recruit .m_rec_contbox .material-symbols-outlined {
	position:absolute;
	right:1rem;
	top:50%;
	transform: translateY(-50%);
	font-size: 1.8rem;
	font-variation-settings: 'FILL' 0.5, 'wght' 100, 'GRAD' 0;
}

@media (max-width:991px){
	.m_rec_titbox .tit {
        font-size: 2.1rem;
    }
	
}

@media (max-width:767px){
	.m_recruit .m_rec_contbox .rec_bn {
		border-radius:0.8rem;
		padding: 1.5rem 1.5rem !important;
		font-size: 1.2rem;
	}
	.m_recruit .rec_img{display:none;}
}


/*.m_recruit .rec_img img{
	width:100%;
	border-radius:2rem;
}*/



@media (min-width: 1700px) {
	.m_recruit .rec_img {
		padding: 0 3rem;
	}
}


/* 제목 */
.m_rec_titbox .tit{
	color:#111;
	font-size:3rem;
	font-weight:400;
	letter-spacing:-0.07em;
}
.m_rec_titbox .tit strong{font-weight:600;}

@media (max-width:1500px){
	.m_rec_titbox .tit{font-size:2.6rem;}
}
@media (max-width:1300px){
	.m_rec_titbox .tit{font-size:2.4rem;}
}
@media (max-width:1199px){
	.m_rec_titbox .tit{font-size:2.2rem;}
}

@media (max-width:767px){
	.m_rec_titbox .tit{font-size:2.4rem;}
}