/*
 * Copyright inpleworks, Co.
*/


/* ------------------------------------------------------------------------------------------------------------------ */
/* CUSTOM RESPONSIVE
/* ------------------------------------------------------------------------------------------------------------------ */
/* Extra small devices  (Phones 319px 이하)
---------------------------------------------------------------------------- */
@media (max-width: 319px) {
	.col-xs-1, .col-xs-2, .col-xs-3, .col-xs-4, .col-xs-5, .col-xs-6, .col-xs-7, .col-xs-8, .col-xs-9, .col-xs-10, .col-xs-11, .col-xs-12 {
	  width: 100%;
	}
}

/* Extra small devices  (Phones 768px 이하)
---------------------------------------------------------------------------- */
@media (max-width: 767px) {
	h1,.h1 {
	  	font-size: 28px;
	}
	h2,.h2 {
	  	font-size: 24px;
	}
	h3,.h3 {
	  	font-size: 20px;
	}
	h4,.h4 {
	  	font-size: 18px;
	}
	h5,.h5 {
	  	font-size: 16px;
	}
	h6,.h6 {
	  	font-size: 14px;
	}

	.xet-feature-list > li {
		border-right: none;
	}

}

/* Small devices (tablets, 768px 이상)
---------------------------------------------------------------------------- */
@media (min-width: 768px) {
	/* Header
	-------------------------------------- */
	#xet-header {
		height: 60px;
	}
	.xet-logo {
		left: 30px;
	}

	/* NAV */
	#xet-nav-icon {
		right: 30px;
	}
	.xet-nav-container {
		width: 50%;
	}
	.xet-nav-container header {
		height: 60px;
		line-height: 60px;
		padding: 0 20px;
	}
	.xet-close-nav {
		right: 15px;
		top: 30px;
	}
	.xet-nav-list > li ul {
		margin-bottom: 20px;
	}

	/* Section
	-------------------------------------- */
	.xet-section {
		margin-bottom: 0;
		padding: 0;
	}
	.xet-section .fp-tableCell {
		border-width: 30px 30px 0px;
	}

	/* Section About
	-------------------------------------- */
	.xet-about-list > li {
		height: calc((100vh));
	}
	.xet-about-list > li:nth-of-type(2n) {
	  	border-right-width: 0;
	}
	/* Section Feature
	-------------------------------------- */
	.xet-feature-list > li {
		height: calc((100vh - 125px)/3);
	}
	.xet-feature-list > li:nth-of-type(3),
	.xet-feature-list > li:nth-of-type(5),
	.xet-feature-list > li:nth-of-type(6),
	.xet-feature-list > li:nth-of-type(8),
	.xet-feature-list > li:nth-of-type(10)  {
	  	border-right-width: 0;
	}
	.xet-feature-list > li.col-title {
		height: auto;
	}
	.xet-feature-list > li [class*="icon-"],
	.xet-feature-list > li [class*="fa"] {
		font-size: 48px;
	}
	/* Section Video
	-------------------------------------- */
	.xet-video .xet-video-overlay {
		top: 30px;
		left: 30px;
		right: 30px;
		bottom: 0px;
	}

	/* Section Skill
	-------------------------------------- */

	/* Section Team
	-------------------------------------- */
	.xet-team-list > li {
		height: calc((100vh - 125px)/3);
	}
	.xet-team-list > li.col-title {
		height: auto;
	}
	/* Section Skill
	-------------------------------------- */


	/* Btn More
	-------------------------------------- */
	.xet-more-btn {
		font-size: 14px;
		padding: 8px 30px;
	}
	.xet-more-btn.round {
		width: 60px;
		height: 60px;
		line-height: 60px;
		font-size: 24px;
	}

	.xet-content {
		margin: 0 15px;
	}

	/* Footer
	-------------------------------------- */
	#xet-footer {
		padding: 20px 30px;
	}
	.xet-sns-icon a {
		margin-left: 10px;
	}
}

/* Medium devices (desktops, 992px 이상)
---------------------------------------------------------------------------- */
@media (min-width: 992px) {

	/* Header
	-------------------------------------- */
	#xet-header {
		height: 80px;
	}
	.xet-logo {
		left: 45px;
		bottom: 15px;
		width: 240px;
	}
	.xet-logo a {
		height: 45px;
		line-height: 45px;
	}
	.xet-nav-container {
		width: 480px;
	}
	.xet-nav-container header {
		height: 80px;
		line-height: 80px;
		padding: 0 20px;
	}
	/* NAV */
	#xet-nav-icon {
		right: 45px;
		bottom: 23px;
	}
	.xet-nav-trigger {
		height: 43px;
		width: 43px;
	}
	.xet-close-nav {
		right: 15px;
		top: 45px;
	}
	.xet-nav-list {
		padding-top: 80px;
	}
	.xet-nav-list > li em {
		font-size: 18px;
	}

	/* Section
	-------------------------------------- */
	.xet-section .fp-tableCell {
		border-width: 80px 45px 45px;
	}
	.xet-section-title {
		display: block;
	}
	#fp-nav {
		display: block;
	}
	/* Scroll Down Btn */
	.xet-down-btn {
		bottom: 45px;
	}
	/* Slider Button next, prev */
	.xet-slider-btn {
		bottom: 45px;
	}
	/* Section About
	-------------------------------------- */
	.xet-about-list > li {
		height: calc((100vh - 135px));
	}

	/* Section Feature
	-------------------------------------- */
	.xet-feature-list > li {
		height: calc((100vh - 80px)/3);
	}
	.xet-feature-list > li:nth-of-type(3),
	.xet-feature-list > li:nth-of-type(5),
	.xet-feature-list > li:nth-of-type(6),
	.xet-feature-list > li:nth-of-type(8) {
		border-right-width: 1px;
	}
	.xet-feature-list > li:nth-of-type(4),
	.xet-feature-list > li:nth-of-type(7),
	.xet-feature-list > li:nth-of-type(10)  {
		border-right-width: 0;
	}
	.xet-feature-list > li.col-title {
		height: calc((100vh - 80px)/3);
	}
	/* Section Video
	-------------------------------------- */
	.xet-video .xet-video-overlay {
		top: 80px;
		left: 45px;
		right: 45px;
		bottom: 45px;
	}
	/* Section Team
	-------------------------------------- */
	.xet-team-list > li {
		height: calc((100vh - 80px)/3);
	}
	.xet-team-list > li.col-title {
		height: calc((100vh - 80px)/3);
	}
	/* Section Work
	-------------------------------------- */
	.xet-work .col-title .item {
		background-color: #222;
		color: #fff;
	}

	.xet-content {
		margin: 0 30px;
	}

	/* Footer
	-------------------------------------- */
	#xet-footer {
		position: fixed;
		height: 45px;
		line-height: 45px;
		padding: 0 45px;
	}
	.xet-sns-icon a:hover {
		opacity: .6;
	}

	.xet-btn:hover {
		border-color: #d4a300 !important;
		background-color: #d4a300 !important;
		color: #fff !important;
	}



	/**
	* Section appearing animation
	*/
	@-webkit-keyframes animate--fadeIn {
		0% {
			opacity: 0;
		}
		100% {
			opacity: 1;
		}
	}
	@keyframes animate--fadeIn {
		0% {
			opacity: 0;
		}
		100% {
			opacity: 1;
		}
	}
	@-webkit-keyframes animate--slideInUp {
		0% {
			transform: translateY(100%);
		}
	}
	@keyframes animate--slideInUp {
		0% {
			transform: translateY(100%);
		}
	}
	@-webkit-keyframes animate--slideInRight {
		0% {
			transform: translateX(-100%);
		}
	}
	@keyframes animate--slideInRight {
		0% {
			transform: translateX(-100%);
		}
	}
	@-webkit-keyframes animate--slideInDown {
		0% {
			transform: translateY(-100%);
		}
	}
	@keyframes animate--slideInDown {
		0% {
			transform: translateY(-100%);
		}
	}
	@-webkit-keyframes animate--slideInLeft {
		0% {
			transform: translateX(100%);
		}
	}
	@keyframes animate--slideInLeft {
		0% {
			transform: translateX(100%);
		}
	}
	.fp-section.active .ani-fadeIn,
	.fp-section.active .ani-fadeSlideInUp,
	.fp-section.active .ani-fadeSlideInRight,
	.fp-section.active .ani-fadeSlideInDown,
	.fp-section.active .ani-fadeSlideInLeft {
		-webkit-animation-duration: 1s;
				animation-duration: 1s;
		-webkit-animation-delay: 0.5s;
				animation-delay: 0.5s;
		-webkit-animation-fill-mode: both;
				animation-fill-mode: both;
	}
	.fp-section.active .ani-fadeIn {
		-webkit-animation-name: animate--fadeIn;
		animation-name: animate--fadeIn;
	}
	.fp-section.active .ani-fadeSlideInUp {
		-webkit-animation-name: animate--fadeIn, animate--slideInUp;
				animation-name: animate--fadeIn, animate--slideInUp;
	}
	.fp-section.active .ani-fadeSlideInRight {
		-webkit-animation-name: animate--fadeIn, animate--slideInRight;
				animation-name: animate--fadeIn, animate--slideInRight;
	}
	.fp-section.active .ani-fadeSlideInDown {
		-webkit-animation-name: animate--fadeIn, animate--slideInDown;
				animation-name: animate--fadeIn, animate--slideInDown;
	}
	.fp-section.active .ani-fadeSlideInLeft {
		-webkit-animation-name: animate--fadeIn, animate--slideInLeft;
				animation-name: animate--fadeIn, animate--slideInLeft;
	}
}

/* Large devices (large desktops, 1200px 이상)
---------------------------------------------------------------------------- */
@media (min-width: 1200px) {}