/* BASE */
	
/* colors */
:root {
	--opal-green: #00665E;
	--soft-olive: #e1f1f0;
	--mid-olive: #EEF0F0;
	--sec-olive: #30524d;
	--alt-olive: #67b8af;
	--jet-black: #121212;
	--grey-white: #EFEDE9;
	--neutral-grey: #C5C9C9;
	--ocean-blue: #004F59;
	--neutral-100: #121212;
	--neutral-90: #252525;
	--neutral-60: #656666;
	--neutral-50: #7D7E7E;
	--neutral-40: #949696;
	--neutral-30: #ADAFAF;
	--neutral-20: #C5C9C9;
	--neutral-10: #E2E4E4;
	--neutral-0: #F8F7F4;
	--opts: #EDEDED;
	--cream: #F7F8F4;
	--soft-bkg: #F4F4F2;
	--dark: #655E5A;
	
	--white: #FFFFFF;
	--white-25: rgba(255,255,255,0.25);
	--white-50: rgba(255,255,255,0.5);
	--white-70: rgba(255,255,255,0.7);
	--black: #000000;
}

.img-cont {
	width: auto;
	max-width: none;
	position: relative;
	
	overflow: hidden;
	
	img {
		position: absolute;
		width: 100%;
		height: 100%;
		object-fit: cover;
		object-position: 50% 50%;
	}
	
	&:after {
		content: "";
		padding-bottom: 100%;
		display: block;
	}
}

.text p:last-child {
	margin-bottom: 0;
}

.cta {
	appearance: none;
	border: 0;
	border-radius: 0;
	background-color: var(--white);
	cursor: pointer;
	font-family: 'AM-Sans', sans-serif;
	font-weight: 400;
	
	font-size: 16px;
	line-height: 24px;
	text-align: center;
	color: var(--opal-green) !important;
	
	display: inline-flex;
	justify-content: center;
	
	/* Mobile */
	@media screen and (max-width : 1023px) {
		padding: 16px 32px;
	}
	
	/* Desktop */
	@media screen and (min-width : 1024px) {
		padding: 16px 30px;
	}
	
	&.alt, &.dark {
		color: var(--white) !important;
	}
	
	&.alt {
		background-color: var(--opal-green);
	}
	
	&.soft {
		background-color: var(--mid-olive);
	}
	
	&.dark {
		background-color: var(--dark);	
	}
	
	&.sec {
		background-color: var(--sec-olive);
		background-repeat: no-repeat;
		background-position: right center;
		color: var(--neutral-0) !important;
		
		/* Mobile */
		@media screen and (max-width : 1023px) {
			background-image: none !important;
		}
		
		/* Desktop */
		@media screen and (min-width : 1024px) {
			background-position: right 20px center;
			padding: calc( var(--base) * 0.5 ) calc( var(--base) * 1.6875 ) calc( var(--base) * 0.5 ) calc( var(--base) * 0.9375 );
		}
	}
	
	&.next {
		background-color: var(--neutral-20);
		background-repeat: no-repeat;
		background-position: right center;
		background-size: 24px;
		color: var(--neutral-40);
		
		@media screen and (max-width : 1023px) {
			background-position: right 24px center;
			padding-right: 52px;
		}
		
		@media screen and (min-width : 1024px) {
			background-position: right 24px center;
			padding-right: 52px;
		}
	}
}

.cta:hover {
	background-color: var(--soft-olive);
}

.cta.alt:hover {
	color: var(--opal-green) !important;
}

.cta.dark:hover {
	background-color: var(--opal-green);
}

.cta.sec:hover {
	background-color: var(--black);
}

.cta-text {
	background-repeat: no-repeat;
	background-position: right top;
	border-bottom: solid 1px var(--alt-olive);
	background-size: contain;
	padding: 2px 26px 2px 0;
	color: var(--opal-green);
	
	/* Desktop */
	@media screen and (min-width : 1024px) {
		font-size: 16px;
		line-height: 24px;
	}
}

.b {
	font-weight: 700;
}

header {
	background-color: var(--black);
	
	* {
		color: var(--white);
	}
	
	.only-at-gc {
		border-bottom: solid 1px var(--neutral-10);
		background-color: var(--neutral-10);
		/* Mobile */
		@media screen and (max-width : 1023px) {
			position: absolute;
			top: 0;
			right: 0;
			left: 0;
			
			display: -webkit-box;
			display: -ms-flexbox;
			display: -webkit-flex;
			display: flex;
			
			justify-content: flex-end;
			
			a {
				display: block;
				height: 27px;
			}
		}
		
		/* Desktop */
		@media screen and (min-width : 1024px) {
			width: 100%;
			height: 60px;
			padding: 0 1.9791%;
			
			display: -webkit-box;
			display: -ms-flexbox;
			display: -webkit-flex;
			display: flex;
			
			justify-content: flex-end;
			
			a {
				margin-right: 132px;
				height: 100%;
			}
		}
		
		a {
			img {
				width: auto;
				height: 100%;
			}
		}
	}
	
	.main-nav {
		li {}
	}
	
	.site-branding {
		a {
			display: block;
		}
	}
}

.related {
	img {
		width: 100%;
	}
}

.swiper {
	.swiper-pagination {
		.swiper-pagination-bullet {
			background-color: var(--neutral-50);
			border-radius: 1px;
			height: 2px;
			
			opacity: 1;
		}
		
		.swiper-pagination-bullet-active {
			background-color: var(--white);
		}
	}
	
	.button-prev,
	.button-next {
		background-repeat: no-repeat;
		background-size: contain;
		margin: auto;
		position: absolute;
		bottom: 0;
		
		z-index: 1;
		
		cursor: pointer;
	}
	
	.button-prev {
		background-position: left center;
		left: 0;
	}
	
	.button-next {
		background-position: right center;
		right: 0;
	}
}

.swiper.hero {
	.swiper-wrapper {
		.swiper-slide {
			position: relative;
			
			.img-cont {}
			
			.infobox {
				position: absolute;
				
				* {
					color: var(--white);
				}
			}
		}
	}
}

.block {
	.text {}
	
	&.dark {
		background-color: var(--neutral-100);
		
		.text {
			color: var(--white);
		}
	}
}

.model-range {
	.infobox {
		color: var(--white);
	}
	
	h1 {
		color: var(--white);
		text-align: center;
	}
}

.overlay-box {
	background-color: rgba(0,0,0,.5);
	backdrop-filter: blur(94px);
	width: 100%;
	height: 100%;
	
	position: fixed;
	top: 0;
	left: 0;
	z-index: 5;
	
	display: none;
	
	.close {
		appearance: none;
		background-color: transparent;
		background-repeat: no-repeat;
		border: 0;
		padding: 0;
		position: absolute;
		top: 0;
		left: 0;
	}
	
	.scroll.box {
		background-color: var(--white);
		height: 100%;
		
		overflow: scroll;
		
		position: relative;
		
		.headling {
			border-bottom: solid 1px var(--neutral-10);
			background-color: var(--white);
			
			position: fixed;
			top: 0;
			right: 0;
		}
	}
	
	&.enquire {
		.scroll.box {
			.info {
				background-color: var(--white);
				
				>div {
					>div {
						ul.options {
							li {
								border-radius: 4px;
								background-color: var(--opts);
								box-shadow: 0px 1px 3px 0px var(--neutral-30);
								
								height: 120px;
								margin-bottom: var(--base);

								position: relative;
								overflow: hidden;
								cursor: pointer;
								
								h4 {
									margin-left: var(--base);
									margin-right: var(--basem);
									font-size: 24px;
									line-height: 120px;
									
									position: relative;
									z-index: 1;
								}

                a {
                  display: block;
                  width: 100%;
                  height: 100%;
                  color: inherit;
                  text-decoration: none;

                  /* ensure nested h4 behaves the same */
                  h4 {
                    margin-left: var(--base);
                    margin-right: var(--basem);
                    font-size: 24px;
                    line-height: 120px;

                    position: relative;
                    z-index: 1;
                  }
                }

                a:hover {
                  text-decoration: none;
                }                
								
								&:before {
									font-family: 'AM-Flare';
									font-size: 96px;
									line-height: 120px;
									font-weight: 700;
									color: var(--neutral-10);
									
									position: absolute;
									top: 0;
									left: 70%;
									
									z-index: 0;
								}
								
								&:hover, &.selected {
									background-color: var(--opal-green);
									color: var(--white);
									
									&:before {
										color: var(--white-25);
									}
								}
								
								&:nth-child(1) {
									&:before {
										content: "Email";
									}
								}
								
								&:nth-child(2) {
									&:before {
										content: "WhatsApp";
									}
								}
							}
						}
						
						.warning {
							width: 100%;
							display: none;
							
							h4 {
								color: red;
							}
							
							&.showed {
								display: block;
							}
						}
					}
					
					&.step-2 {
						display: none;
						
						a {
							color: var(--opal-green);
							
							&:hover {
								text-decoration: underline;
							}
						}
						
						>div {
							span {
								font-weight: 700;
								display: block;
							}
							
							.data {
							}
						}
						
						address + a {
							&:hover {
								text-decoration: none;
							}
						}
						
						&.current {
							display: block;
						}
					}
													
					&.hide {
						display: none;
					}
				}
			}
			
			.deco {
				background-color: var(--neutral-10);
				
				>div {
					width: 100%;
				}
			}
		}
	}
}

section.locations {
	background-color: var(--soft-bkg);
	
	.infobox {
		>ul {
			>li {
				border-bottom: solid 1px var(--neutral-10);
				
				img {}
				
				span {
					display: block;
					
					p, li, a {
						color: var(--neutral-60);
					}
					
					a.sm:hover {
						text-decoration: underline;
					}
				}
				
				&:last-child {
					border-bottom: 0;
				}
			}
		}
	}
	
	.map {
		iframe {
			display: block;
			width: 100%;
			height: 100%;
			border: 0;
		}
	}
}

section.customer-reviews {
	background-color: var(--neutral-90);
	overflow: hidden;
	
	h2 {
		color: var(--white);
	}
	
	p {
		color: var(--neutral-10);
	}
	
	h6 {
		color: var(--neutral-40);
	}
	
	.swiper {
		overflow: visible;
	}
}

section.social-news {
	>div {
		h2 {
			a {
				color: var(--opal-green);
				
				/* Mobile */
				@media screen and (max-width : 1023px) {
					font-size: 30px;
					line-height: 40px;
				}
				/* Desktop */
				@media screen and (min-width : 1024px) {
					font-size: 48px;
					line-height: 60px;
				}
				
				&:visited {
					color: var(--opal-green);
				}
				
				&:hover {
					text-decoration: underline;
				}
			}
		}
	}
}

footer {
	background-color: var(--neutral-100);
	
	* {
		color: var(--neutral-50);
	}
	
	.d-full {
		>a {
			width: 130px;
			margin: 0 auto;
			display: block;
		}
		
		>div {
			border-top: solid 1px var(--neutral-50);
		}
	}

	&.grand-chelem {
		.legals {
			p {
				font-family: "DomaineSansText", sans-serif;
				font-size: 14px;
				line-height: 24px;
				color: #C5C5C5;
			}
		}

		.locations {
			ul {
				ul {
					li {
						font-family: "DomaineSansText", sans-serif;
						font-size: 14px;
						line-height: 24px;
					}

					li address,
					li address a {
						font-family: "DomaineSansText", sans-serif;
						font-size: 14px;
						line-height: 22px;
						color: #C5C5C5;
					}
				}
			}
		}
	}

}

/* Mobile */
@media screen and (max-width : 1023px) {
	body {
		padding-top: 92px;
	}
	
	.text h3 {
		margin-bottom: calc( var(--basem) * 1.5 );
	}
	
	.text p {
		margin-bottom: calc( var(--basem) * 1.5 );
	}
	
	header {
		width: 100%;
		height: 64px;
		padding-top: 28px;
		
		position: fixed;
		top: 0;
		left: 0;
		
		z-index: 5;
		
		.nav-trigger {
			width: 64px;
			height: calc(100% - 29px);
			padding-top: 29px;
			
			cursor: pointer;
			
			position: absolute;
			top: 0;
			left: 0;
			
			z-index: 2;
			
			div {
				background-position: center center;
				background-repeat: no-repeat;
				background-size: contain;
				width: 40px;
				height: 100%;
				margin: 0 auto;
				
				&:last-child {
					display: none;
				}
			}
		}
		
		.main-nav {
			background-color: rgba(18, 18, 18, .8);
			backdrop-filter: blur(35px);
			padding-bottom: 24px;
			width: 100%;
			height: calc(100% - 24px);
			
			overflow: scroll;
			
			position: fixed;
			left: 0;
			top: -100vh;
			bottom: 0;
			
			z-index: 1;
			
			transition: all 1s ease;
			
			li {
				border-bottom: 1px solid var(--neutral-40);
				padding: calc( var(--basem) * .75 ) 0;
				margin: 0 var(--sidem);
				
				&:first-child {
					margin-top: 90px;
				}
			}
		}
		
		.site-branding {
			width: 102px;
			padding: 10px 0 0 0;
			margin: 0 auto;
			
			position: relative;
			
			z-index: 2;
		}
		
		&.showMenu {
			.nav-trigger {
				div {
					&:first-child {
						display: none;
					}
					
					&:last-child {
						display: block;
					}
				}
			}
			
			.main-nav {
				top: 0;
			}
		}
	}
	
	.swiper {
		.swiper-pagination {
			top: auto;
			bottom: calc( var(--basem) * 1.6875 );
			
			.swiper-pagination-bullet {
				width: 30px;
			}
		}
		
		.button-prev,
		.button-next {
			width: 32px;
			height: 32px;	
		}
		
		&.model-range {
			.button-prev,
			.button-next {
				width: 51px;
				height: 18px;	
			}
		}
	}
	
	.hero-slider,
	.hero-banner {
		.swiper {
			.swiper-wrapper {
				.swiper-slide {
					.img-cont {
						height: 604px;
					}
					
					.infobox {
						bottom: calc( var(--basem) * 3.75 );
						left: var(--sidem);
						
						h4 {
							margin-bottom: calc( var(--basem) * .5 );
						}
						
						p {
							margin-top: calc( var(--basem) * .5 );
						}
						
						a {
							width: calc(100% - 64px);
							margin-top: calc( var(--basem) * 1.5 );
						}
					}
				}
			}
			
			.button-prev,
			.button-next {
				bottom: var(--basem);
			}
			
			.button-prev {
				left: var(--sidem);
			}
			
			.button-next {
				right: var(--sidem);
			}
		}
	}
	
	.blocks {
		.block {
			max-width: 600px;
			margin: 0 auto;
			
			>div {
				.text {
					margin-top: calc( var(--basem) * 1.5 );
				}
			}
			
			.flex {
				&.m-d-cr {
					.text {
						margin-bottom: calc( var(--basem) * 2 );
					}
				}
			}
		}
	}
	
	.block {
		padding-top: var(--basem);
		padding-bottom: calc( var(--basem) * 3);
		
		.related,
		.text {
			width: var(--colm-4);
			margin-left: var(--sidem);
		}
		
		.text {
			margin-top: calc( var(--basem) * 2 );
			max-width: 600px;
		}
		
		&.dark {
			padding-top: calc( var(--basem) * 3);
			
			.text {
				margin-right: auto;
				margin-left: auto;
			}
		}
	}
	
	.overlay-box {
		.close {
			width: 30px;
			height: 30px;
			margin: auto;
			
			top: var(--basem);
			right: 0;
			left: 0;
		}
		
		.scroll.box {
			height: calc( 100vh - 62px );
			top: 62px;
			
			.headling {
				height: 95px;
				
				top: 62px;
				left: 0;
				
				h2 {
					padding-top: calc( var(--basem) * 1.5 );
					padding-left: var(--sidem);
					font-size: 36px;
					line-height: 45px;
				}
			}
			
			div.specs {
				width: 100%;
				margin-top: 95px;
			}
		}
		
		&.enquire {
			.scroll.box {
				flex-direction: column;
				
				.headling {
					height: auto;
					padding: calc( var(--basem) * 1.5 ) var(--sidem);
					position: relative;
					top: auto;
					left: auto;
					order: 2;
				}
				
				.deco {
					width: 100%;
					order: 1;
					height: 72px;
					
					>div {
						width: 100%;
						height: 100%;
						justify-content: space-between;
						align-items: center;
						
						div {
							margin: 0 0 0 var(--sidem);
							
							h4 {
								font-size: 14px;
								line-height: 20px;
							}
							
							h1 {
								font-size: 30px;
								line-height: 40px;
							}
						}
						
						img {
							width: auto;
							height: 100%;
							margin-right: var(--basem);
						}
					}
				}
				
				.info {
					overflow: scroll;
					
					order: 3;
					
					>div {
						padding: calc( var(--basem) * 2 ) var(--sidem);
						
						>div {
							margin-top: calc( var(--basem) * 2 );
							
							h4 {
								margin-bottom: calc( var(--basem) * 1 );
							}
							
							ul.options {
								li {
									height: 80px;
									
									h4 {
										height: 80px;
										line-height: 80px;
									}
									
									&:before {
										height: 80px;
										font-size: 70px;
										line-height: 80px;
										
										left: 40%;
									}
								}
							}
						}
						
						.nav-options {
							.warning {
								margin-bottom: calc( var(--basem) * 1.25 );
								
								h4 {
									margin-bottom: 0;
								}
							}
						}
						
						&.step-2 {
							h5 {
								&.sub {
									border-top: solid 1px var(--black);
									padding-top: var(--basem);
									margin-bottom: calc( var(--basem) * 1.2 );
								}
							}
							
							>div {
								&:first-of-type {
									margin-bottom: calc( var(--basem) * 3 );
								}
							}
							
							address + a {
								margin-top: calc( var(--basem) * .25 );
								display: inline-block;
							}
							
							.data {
								margin-bottom: calc( var(--basem) * 1.25 );
							}
						}
					}
				}
			}
		}
	}
	
	section.locations {
		padding-top: calc( var(--basem) * 6 );
		position: relative;
		
		.infobox {
			h2 {
				position: absolute;
				top: calc( var(--basem) * 2.5 );
				left: var(--sidem);
			}
			
			>ul {
				max-width: 600px;
				margin: 0 auto var(--basem);
				
				>li {
					padding-top: calc( var(--basem) * 1.5 );
					padding-bottom: calc( var(--basem) * 1.5 );
					
					img {
						width: auto;
						height: 48px;
						margin-bottom: var(--basem);
					}
					
					span {
						max-width: 400px;
						
						h5 {
							margin-bottom: calc( var(--basem) * .75);
						}
						
						ul {
							margin-top: calc( var(--basem) * .5);
							margin-bottom: calc( var(--basem) * .5);
						}
						
						a {
							margin-top: calc( var(--basem) * 1.25);
						}
					}
					
					&:last-child {
						padding-bottom: calc( var(--basem) * 1.75 );
					}
				}
			}
		}
		
		.map {
			width: 100%;
			
			iframe {
				height: 316px;
			}
		}
	}
	
	section.customer-reviews {
		padding: calc( var(--basem) * 2.5) 0 0 0;
		
		h2 {
			margin-bottom: calc( var(--basem) * 4);
		}
		
		.swiper {
			padding-bottom: calc( var(--basem) * 8.4375);
			
			.swiper-wrapper {
				.swiper-slide {
					h6 {
						margin-top: calc( var(--basem) * 1.5);
					}
				}
			}
			
			.button-prev,
			.button-next {
				bottom: var(--basem);
			}
		}
	}
	
	section.social-news {
		padding: calc( var(--basem) * 2.5) 0 calc( var(--basem) * 2.5) 0;
		
		>div {
			h2 {
				margin-bottom: calc( var(--basem) * 1.5);
			}
		}
	}
	
	footer {
		padding-top: calc( var(--basem) * 3);
		padding-bottom: calc( var(--basem) * 1.5);
		
		.d-full {
			>a {
				margin-bottom: calc( var(--basem) * 2.5);
			}
			
			>div {
				padding-top: calc( var(--basem) * 1.5);
				
				>nav {
					li {
						margin-bottom: var(--basem);
					}
				}
				
				>div {
					padding-top: calc( var(--basem) * .5);
					
					nav {
						padding-bottom: calc( var(--basem) * 1.5);
					}
					
					nav >a,
					nav li {
						margin: 0 calc( var(--basem) * 1) 0 0;
					}
					
					.sns {
					}
				}
				
				>span {
				}
			}
		}
	}
}

/* Desktop */
@media screen and (min-width : 1024px) {
	.text h3 {
		margin-bottom: var(--base);
	}
	
	.text p {
		margin-bottom: calc( var(--base) * 0.9375 );
	}

	header {
		max-height: 140px;
		
		justify-content: space-between;
		align-items: center;
		
		.nav-trigger {
			display: none;
		}
		
		.main-nav {
			margin: 0 1.9791%;
			
			li {
				margin-right: var(--base);
				
				a {
					font-size: 16px;
					line-height: 24px;
					
					&:hover {}
				}
				
				&:last-child {
					margin-right: 0;
				}
			}
		}
		
		.site-branding {
			width: 122px;
			margin-top: 14px;
			margin-right: 1.9791%;
			margin-bottom: 12px;
		}
	}
	
	.swiper {
		.swiper-pagination {
			.swiper-pagination-bullet {
				width: 48px;
			}
		}
		
		.button-prev,
		.button-next {
			width: 64px;
			height: 64px;	
		}
	
		&.model-range {
			.button-prev,
			.button-next {
				height: 24px;	
			}
		}
	}
	
	.hero-slider,
	.hero-banner {
		.swiper {
			.swiper-wrapper {
				.swiper-slide {
					.img-cont {
						height: 920px;
					}
					
					.infobox {
						min-width: 800px;
						bottom: calc( var(--base) * 2.5 );
						left: var(--side);
						
						p {
							margin-top: calc( var(--base) * .5 );
						}
						
						a {
							margin-top: calc( var(--base) * .75 );
						}
					}
				}
			}
			
			.swiper-pagination {
				bottom: calc( var(--base) * 1.25 );
			}
			
			.button-prev,
			.button-next {
				top: 0;
			}
			
			.button-prev {
				left: 70px;
			}
			
			.button-next {
				right: 70px;
			}
		}
	}
	
	.blocks {
		.block {
			&:nth-child(odd) >div {
				flex-direction: row-reverse;
				
				.related {
					margin-right: var(--side);
					margin-left: 0;
					
					&.side {
						margin-right: 0;
					}
				}
				
				.text {
					margin-left: 0;
					margin-right: calc( var(--col) + var(--gut) );
				}
			}
		}
	}
	
	.block {
		padding: calc( var(--base) * 1.5 ) 0 calc( var(--base) * 3.25 );
			
		.related {
			margin-left: var(--side);
		}
		
		.text {
			min-width: 400px;
			margin-left: calc( var(--col) + var(--gut) );
		}
			
		&.dark {
			padding: calc( var(--base) * 3.25 ) 0;
			
			.related {
				margin-left: 0;
			}
			
			.d-d-rr {
				.related {
					margin-right: 0;
					margin-left: 0;
				}
				
				.text {
					margin-left: 0;
					margin-right: calc( var(--col) + var(--gut) );
				}
			}
		}
	}
	
	.overlay-box {
		.close {
			width: 60px;
			height: 60px;
			top: 54px;
			left: 54px;
		}
		
		.scroll.box {
			width: calc(100% - 168px);
			
			left: 168px;
			
			.headling {
				width: calc(100% - 168px);
				height: 183px;
				
				h2, h3 {
					margin: 0 3.7671%;
				}
			}
		}
		
		&.enquire {
			.scroll.box {
				align-items: center;
				flex-direction: row-reverse;
				
				.headling {
					height: 124px;
				}
				
				.info {
					width: 42%;
					margin-top: 124px;
					height: calc(100% - 124px);
					overflow: scroll;
					
					>div {
						padding: calc( var(--base) * 2.5 ) 11%;
						
						>div {
							margin-top: calc( var(--base) * 1.5 );
							
							h4 {
								margin-bottom: calc( var(--base) * .5 );
							}
						}
						
						.nav-options {
							.warning {
								margin-bottom: calc( var(--base) * .75 );
								
								h4 {
									margin-bottom: 0;
								}
							}
						}
						
						&.step-2 {
							h5 {
								padding-bottom: 6px;
								margin-bottom: calc( var(--base) * .5 );
							}
							
							>div {
								&:first-of-type {
									margin-bottom: calc( var(--base) * 2 );
								}
							}
							
							address + a {
								margin-top: calc( var(--base) * .25 );
								display: inline-block;
							}
							
							.data {
								margin-bottom: calc( var(--base) * .75 );
							}
						}
					}
				}
				
				.deco {
					width: 58%;
					margin-top: 124px;
					height: calc(100% - 124px);
					text-align: center;
					
					align-items: center;
					
					img {
						width: 73%;
						margin: calc( var(--base) * 2.875 ) auto 0;
					}
				}
			}
		}
	}
	
	section.locations {
		.infobox {
			padding: calc( var(--base) * 2 ) 0 calc( var(--base) * 1 );
			
			>ul {
				margin-top: calc( var(--base) * 2 );
				
				>li {
					padding: calc( var(--base) * 1.25 ) 0;
					
					img {
						width: 76px;
						padding-top: calc( var(--base) * .25 );
					}
					
					span {
						width: calc(100% - 108px);
						
						h5, ul {
							margin-bottom: calc( var(--base) * .125);
						}
						
						ul {
							margin-top: calc( var(--base) * .5);
						}
											
						a.cta {
							margin-top: calc( var(--base) * .5);	
						}
					}
					
					&:first-child {
						padding-top: calc( var(--base) * .75 );
					}
				}
			}
		}
		
		.map {
			width: 54%;
			
			iframe {
				height: 736px;
			}
		}
	}
	
	section.customer-reviews {
		padding: calc( var(--base) * 2.5) 0 calc( var(--base) * 1.25) 0;
		
		h2 {
			margin-bottom: calc( var(--base) * 3.5);
		}
		
		.swiper {
			padding-bottom: calc( var(--base) * 4.5);
			
			.swiper-wrapper {
				.swiper-slide {
					width: 564px;
					
					p, h6 {
						max-width: 565px;
					}
					
					h6 {
						margin-top: calc( var(--base) * .75);
					}
				}
			}
		}
	}
	
	section.social-news {
		>div {
			padding: calc( var(--base) * 2.5) 0 calc( var(--base) * 2.5) 0;
			
			h2 {
				margin-bottom: calc( var(--base) * 1.5);
			}
		}
	}
		
	footer {
		padding-top: calc( var(--base) * 1.5);
		padding-bottom: var(--base);
		
		.d-full {
			>div {
				padding-top: calc( var(--base) * 1.5);
				margin-top: var(--base);
				
				>nav {
					margin: 0 auto calc( var(--base) * 1.5);
					justify-content: center;
					
					order: 1;
					
					li {
						margin: 0 calc( var(--base) * .25);
					}
				}
				
				>div {
					order: 3;
					
					nav >a,
					nav li {
						margin: 0 calc( var(--base) * .25);
					}
					
					.sns {
						margin-bottom: calc( var(--base) * .75);
					}
				}
				
				>span {
					order: 2;
				}
			}
		}
	}
}

/* Mid */
@media screen and (min-width : 1024px) and (max-width : 1200px) {
	.blocks {
		.block {
			&:nth-child(odd) >div {
				.text {
					margin-left: 0;
					margin-right: calc( var(--gut) * 2 );
				}
			}
		}
	}
	
	.block {
		.text {
			min-width: 360px;
			margin-left: calc( var(--gut) * 2 );
		}
	}
}
