.product-tab {
	padding-top: rem(30px);
	
	@include media-breakpoint-down(lg) {
		padding-top: 0;
	}
	
	& .nav.nav-tabs {
		background: none;
		border-bottom: 1px solid $gray-300;
		text-align: center;
		font-size: $font-size-lg;
		display: block;
		
		@include media-breakpoint-down(lg) {
			font-size: $font-size-base;
			display: block;
			white-space: nowrap;
			overflow: scroll;
		}
		
		& .nav-item {
			float: none;
			display: inline-block;
			
			& + .nav-item {
				margin-left: rem(5px);
			}
			& .nav-link {
				position: relative;
				color: lighten($black, 45%);
				border: 1px solid transparent;
				padding: rem(15px) rem(20px);
				font-weight: 600;
				
				@include media-breakpoint-down(lg) {
					padding: rem(10px) rem(15px);
				}
				
				&:hover,
				&:focus,
				&:active {
					border-bottom: 1px solid $gray-300;
					background: none;
				}
				&.active {
					background: none;
					border-color: transparent;
					border-bottom: 1px solid $dark;
					color: $dark;
				}
			}
		}
	}
	& .tab-content {
		padding: rem(30px);
		
		@include media-breakpoint-down(lg) {
			padding: rem(15px);
		}
	}
}