/* global */
body { -moz-osx-font-smoothing: grayscale; -webkit-font-smoothing: antialiased; color: #3D3D3D; font-family: 'Noto Sans JP', sans-serif }
	body.no-scroll { overflow: hidden }
a { text-decoration: none !important }
#overlay-sidebar { background-color: rgba(0, 0, 0, 0.7); display: none; height: 100vh; opacity: 0; position: fixed; transition: all 0.5s ease-in-out; width: 100vw; z-index: 999 }
	#overlay-sidebar.open { display: block; opacity: 1 }
header { padding: 25px 0 }
	header #header-logo { color: #3D3D3D; font-size: 36px }
		header #header-logo img { margin-right: 10px }
	header #btn-sidebar { display: none }
	header #header-phone { color: #3D3D3D; font-size: 20px; font-weight: 700 }
		header #header-phone i { color: #4B85B7 }
	header #header-social { font-size: 20px; margin-left: 20px }
		header #header-social a { color: #898989; margin-left: 10px }
	header #header-nav { padding-top: 20px }
		header #header-nav .nav-item { border-right: 1px solid #4B85B7 }
		header #header-nav .nav-item:last-child { border-right: none }
			header #header-nav .nav-item .nav-link { color: #3D3D3D; font-size: 17px; font-weight: 300; padding: 0 15px; text-transform: uppercase }
			header #header-nav .nav-item:last-child .nav-link { padding-right: 0 }
			header #header-nav .nav-item .nav-link:hover, header #header-nav .nav-item .nav-link.active, header #header-nav .nav-item .nav-link.show { color: #4B85B7 }
		header #header-nav .dropdown-menu { -moz-border-radius: 0; -webkit-border-radius: 0; border: none; border-radius: 0 }
			header #header-nav .dropdown-menu .dropdown-item { font-size: 17px; font-weight: 300 }
			header #header-nav .dropdown-menu .dropdown-item:hover, header #header-nav .dropdown-menu .dropdown-item:active { background-color: #E9ECEF; color: #3D3D3D }
#logos { padding: 70px 0 }
	#logos h3 { color: #BEBEBE; font-size: 22px; font-weight: 300; letter-spacing: 5px; margin: 0; padding-bottom: 30px; text-align: center; text-transform: uppercase }
	#logos img { -moz-transition: 0.3s; -o-transition: 0.3s; -webkit-filter: grayscale(100%); -webkit-transition: 0.3s; filter: grayscale(100%); transition: 0.3s }
	#logos img:hover { -webkit-filter: grayscale(0%); filter: grayscale(0%) }
#get-in-touch { background-color: #4B85B7; color: #FFF; padding: 50px 0 }
	#get-in-touch h4 { font-size: 26px; font-weight: 300; margin: 0 }
		#get-in-touch h4 strong { font-weight: 700 }
	#get-in-touch a { -moz-transition: 0.3s; -o-transition: 0.3s; -webkit-transition: 0.3s; background-color: #FFF; color: #3D3D3D; font-size: 19px; font-weight: 300; margin-left: 50px; padding: 20px 30px; text-transform: uppercase; transition: 0.3s }
	#get-in-touch a:hover { background-color: #3D3D3D; color: #FFF }
footer { padding: 50px 0 }
	footer h5 { font-size: 18px; font-weight: 700; margin: 0; padding-bottom: 7px }
	footer address { font-size: 16px; font-weight: 300; margin: 0; padding-bottom: 7px }
	footer p { font-size: 16px; font-weight: 300; line-height: 20px; margin: 0 }
		footer p a { color: #3D3D3D; font-weight: 700 }
			footer p a.email-mask-text { color: #4B85B7 }
	footer #footer-contact { padding: 15px 0 0 15px }
	footer #footer-social { font-size: 30px; text-align: right }
		footer #footer-social a { color: #ffffff; margin-left: 10px }
	footer #footer-links { font-size: 16px; font-weight: 300; padding-top: 105px; text-transform: uppercase }
		footer #footer-links a { color: #3D3D3D }
#footer-bottom { background-color: #2D2D2E; color: #FFF; font-size: 14px; font-weight: 300; padding: 20px 0; text-transform: uppercase }
	#footer-bottom #footer-bottom-copyright br { display: none }
	#footer-bottom #footer-bottom-designed { text-align: right }
		#footer-bottom #footer-bottom-designed img { padding-left: 5px; position: relative; top: -1px; width: 220px }

/* page */
#page-banner { height: 250px }
	#page-banner.about-us { background: url('/img/banners/about-us.webp') no-repeat center; background-size: cover }
	#page-banner.careers { background: url('/img/banners/careers.webp') no-repeat center; background-size: cover }
	#page-banner.commercial { background: url('/img/banners/commercial.webp') no-repeat center; background-size: cover }
	#page-banner.contact-us { background: url('/img/banners/contact-us.webp') no-repeat center; background-size: cover }
	#page-banner.hotel-and-leisure { background: url('/img/banners/hotel-and-leisure.webp') no-repeat center; background-size: cover }
	#page-banner.local-authority { background: url('/img/banners/local-authority.webp') no-repeat center; background-size: cover }
	#page-banner.our-services { background: url('/img/banners/our-services.webp') no-repeat center; background-size: cover }
	#page-banner.residential { background: url('/img/banners/residential.webp') no-repeat center; background-size: cover }
	#page-banner.retail { background: url('/img/banners/retail.webp') no-repeat center; background-size: cover }
#page-content { padding: 70px 0 40px 0 }
	#page-content #page-text { padding-right: 24px }
	#page-content h1 { font-size: 47px; font-weight: 300; margin: 0; padding-bottom: 40px }
		#page-content h1 strong { font-weight: 700 }
	#page-content p { font-size: 18px; font-weight: 300; margin: 0; padding-bottom: 20px }
		#page-content p.lead { font-size: 21px }
		#page-content p a { color: #4B85B7 }
	#page-content ul { font-size: 18px; font-weight: 700; list-style: none; margin: 0 0 20px 20px; padding: 0 0 0 15px }
		#page-content ul li { padding-bottom: 5px; position: relative }
		#page-content ul li:before { color: #4B85B7; content: '\f0da'; font-family: 'Font Awesome 5 Pro'; font-size: 20px; font-weight: 700; left: -15px; position: absolute; top: 0 }

/* sidebar */
#sidebar { -moz-box-shadow: 2px 2px 6px rgba(0, 0, 0, 0.1); -moz-transition: 0.5s all ease; -o-transition: 0.5s all ease; -webkit-box-shadow: 2px 2px 6px rgba(0, 0, 0, 0.1); -webkit-transition: 0.5s all ease; background-color: #282F36; box-shadow: 2px 2px 6px rgba(0, 0, 0, 0.1); height: 100vh; left: -275px; overflow: auto; padding-bottom: 120px; position: fixed; top: 0; transition: 0.5s all ease; width: 275px; z-index: 1000; }
	#sidebar.open { left: 0 }
	#sidebar h6 { color: #FFF; font-size: 29px; font-weight: 300; margin: 18px 0 0 15px; text-transform: uppercase }
	#sidebar #btn-sidebar-close { -moz-transition: 0.3s; -o-transition: 0.3s; -webkit-transition: 0.3s; background-color: #FFF; border: none; color: #000; display: block; font-size: 29px; height: 45px; margin: 15px 15px 0 0; padding: 0 0 4px 0; transition: 0.3s; width: 45px !important }
	#sidebar #btn-sidebar-close:hover { background-color: #4B85B7; color: #FFF }
	#sidebar ul { font-size: 18px; list-style: none; margin: 25px 0 0 0; padding: 0 }
		#sidebar ul li a { -moz-transition: 0.3s; -o-transition: 0.3s; -webkit-transition: 0.3s; color: #FFF; display: block; font-weight: 300; padding: 5px 15px; position: relative; transition: 0.3s; }
		#sidebar ul li a:hover { background-color: #4B85B7; color: #FFF }
			#sidebar ul li a.collapse-trigger:after { content: '\f0d7'; font-family: 'Font Awesome 5 Pro'; font-weight: 700; position: absolute; right: 15px; top: 4px }
		#sidebar ul ul { margin: 0 }
			#sidebar ul ul li a { padding-left: 30px }

@media (max-width: 4200px) {
	/* global */
	.container { max-width: 1430px }
}

@media (max-width: 1459px) {
	/* global */
	.container { max-width: 1140px }
	header { padding: 20px 0 }
	header #header-logo { font-size: 28px; padding-top: 5px }
		header #header-logo img { width: 65px }
	header #header-phone { font-size: 18px }
	header #header-social { font-size: 18px }
	header #header-nav { padding-top: 15px }
		header #header-nav .nav-item .nav-link { font-size: 15px }
		header #header-nav .dropdown-menu .dropdown-item { font-size: 15px }
	#logos { padding: 60px 0 }
		#logos h3 { font-size: 20px }
	#get-in-touch { padding: 40px 0 }
		#get-in-touch h4 { font-size: 22px }
		#get-in-touch a { font-size: 17px; margin-left: 40px; padding: 15px 25px }
	#footer-bottom { font-size: 12px; padding: 18px 0 }
		#footer-bottom #footer-bottom-designed img { height: 12px; top: -2px; width: 180px }

	/* page */
	#page-banner { height: 200px }
	#page-content { padding: 60px 0 30px 0 }
		#page-content h1 { font-size: 40px; padding-bottom: 30px }
		#page-content p { font-size: 16px }
			#page-content p.lead { font-size: 19px }
		#page-content ul { font-size: 16px; padding: 0 0 0 13px }
			#page-content ul li:before { font-size: 18px; left: -13px; top: 0 }
}

@media (max-width: 1199px) {
	/* global */
	.container { max-width: 960px }
	header #header-logo { font-size: 22px; padding-top: 7px }
		header #header-logo img { width: 55px }
	header #header-phone { font-size: 16px }
	header #header-social { font-size: 16px; margin-left: 20px }
		header #header-social a { margin-left: 10px }
	header #header-nav { padding-top: 12px }
		header #header-nav .nav-item .nav-link { font-size: 14px; padding: 0 10px }
		header #header-nav .dropdown-menu .dropdown-item { font-size: 14px }
	#logos { padding: 50px 0 }
		#logos h3 { font-size: 18px }
	#get-in-touch { padding: 30px 0 }
		#get-in-touch h4 { font-size: 20px }
		#get-in-touch a { font-size: 15px; margin-left: 30px; padding: 10px 20px }
	#footer-bottom { font-size: 10px; padding: 15px 0 }
		#footer-bottom #footer-bottom-designed img { height: 11px; width: 160px }

	/* page */
	#page-banner { height: 175px }
	#page-content { padding: 50px 0 20px 0 }
		#page-content h1 { font-size: 32px; padding-bottom: 25px }
		#page-content p { font-size: 14px }
			#page-content p.lead { font-size: 17px }
		#page-content ul { font-size: 14px; padding: 0 0 0 10px }
			#page-content ul li:before { font-size: 16px; left: -10px; top: -1px }
}

@media (max-width: 991px) {
	/* global */
	.container { max-width: 720px }
	header { padding: 10px 0 15px 0 }
		header #header-contact { padding-top: 10px }
		header #btn-sidebar { background: none; border: none; display: block; font-size: 26px; padding: 0 40px 0 0 }
		header #header-social { margin-left: 10px }
		header #header-nav { display: none }
	#logos { padding: 40px 0 }
		#logos h3 { font-size: 16px; letter-spacing: 3px; padding-bottom: 25px }
	footer { padding: 30px 0 }
		footer #footer-social { padding-top: 30px; text-align: center }
			footer #footer-social a { color: #212322; margin: 0 5px }
		footer #footer-links { padding-top: 30px }
	#footer-bottom { font-size: 13px; padding: 12px 0 11px 0; text-align: center }
		#footer-bottom #footer-bottom-designed { padding-top: 5px; text-align: center }
			#footer-bottom #footer-bottom-designed img { height: 12px; width: 180px }

	/* page */
	#page-banner { height: 150px }
	#page-content #page-text { padding: 0 0 20px 0 }
}

@media (max-width: 767px) {
	/* global */
	.container { max-width: 540px }
	header { padding: 5px 0 10px 0 }
		header #header-contact { padding-top: 20px }
		header #header-social { display: none }
	#get-in-touch { text-align: center }
		#get-in-touch h4 { padding-bottom: 20px }
			#get-in-touch h4 strong { display: block }
		#get-in-touch a { display: inline-block; margin-left: 0 }

	/* page */
	#page-content h1 { font-size: 28px; padding-bottom: 20px }
}

@media (max-width: 575px) {
	/* global */
	.container { max-width: 100% }
	header #header-logo { font-size: 18px; padding-top: 7px }
		header #header-logo img { width: 45px }
	header #header-contact { padding-top: 10px }
	footer #footer-logo { display: block; margin: 0 auto; width: 192px }
	footer #footer-contact { padding-left: 0; text-align: center }
	#footer-bottom { font-size: 12px }
		#footer-bottom #footer-bottom-copyright span { display: none }
		#footer-bottom #footer-bottom-copyright br { display: inline }
		#footer-bottom #footer-bottom-designed { padding-top: 8px }
			#footer-bottom #footer-bottom-designed img { display: block; height: 11px; margin: 5px auto 0 auto; width: 160px }
}

@media (max-width: 374px) {
	/* global */

}