
/* dropdownmenu */
@media all and (min-width: 992px) {

}	
@media(max-width: 991px){
.navbar.fixed-top .navbar-collapse, .navbar.sticky-top .navbar-collapse{
overflow-y: auto;
max-height: 90vh;
margin-top:10px;
}
}

#food-wraper{
	position: relative;
	height: 100vh;
	padding: 30px;
	overflow: hidden;
} 
  
  
  
  
  :root {
	--text--text-light: #1e1919;
	--color--identity--yellow: #fad24b;
	--color--identity--on-yellow: #684505;
	--color--identity--on-blue: #283750;
	--color--identity--blue: #b4c8e1;
	--color--identity--red: #fa551e;
	--color--identity--on-red: #4e0119;
	--color--accent--tangerine: #ff8c19;
	--color--identity--on-orange: #6d2e09;
	--color--identity--cyan: #3dd3ee;
	--color--identity--on-cyan: #055463;
	--color--identity--purple: #c8aff0;
	--color--identity--on-purple: #682760;
	--color--identity--on-pink: #892055;
	--color--identity--pink: #ffafa5;
	--color--accent--lime: #b4dc19;
	--color--identity--on-green: #175641;
	--surface--background-dark: #1e1919;
	--white: white;
	--color--accent--line-solid: #5f9dff;
	--text--text-subtle-light: #736c64;
	--text--text-subtle-dark: #bbb5ae;
	--color--accent--line: #5f9dff66;
	--color--accent--gold: #9b6400;
	--color--accent--vivid-vargas: #fad24b;
	--color--accent--canopy: #0f503c;
	--color--accent--azalea: #cd2f7b;
	--accent--ui-accent: #0061fe;
	--text--text-dark: white;
	--color--accent--zen: #14c8eb;
	--color--accent--ocean: #007891;
	--text--base: #1a1918;
	--color--accent--orchid: #c8aff0;
	--color--accent--plum: #78286e;
	--color--accent--pink: #ffafa5;
	--color--accent--navy: #283750;
	--color--accent--cloud: #b4c8e1;
	--accent--tab: #0061fe;
	--gold--tab: #c6984d;
	--color--accent--rust: #be4b0a;
	--color--accent--coconut: #f7f5f2;
	--color--accent--sunset: #fa551e;
	--black: black;
	--surface--background-light: white;
	--annotation--annotation: #5f9dff;
	--surface--overlay-subtle: #f7f6f5;
	--color--accent--crimson: #9b0032;
	--annotation--hairline: #c5dbff;
	--button-size: 102px;
	--nav-tile-gap: 10px;
	--color--identity--orange: #f9a34b;
	--color--identity--green: #b4dc19;
	--accent--logo: white;
  }
  
  
  
  .menu-container {
	position: relative;
  }
  
  .nav-wrapper {
	z-index: 2;
	grid-column-gap: 10px;
	grid-row-gap: 10px;
	justify-content: flex-start;
	align-items: stretch;
	position: absolute;
	inset: 0%;
  }
  
  .nav-wrapper.nav-wrapper-gridlines {
	z-index: 1;
	opacity: .4;
  }
  
  .nav-tile-1 {
	height: calc(50% + var(--button-size) / 2);
	transform-origin: 100% 100%;
	width: 100%;
  }
  
  .nav-tile-2 {
	height: calc(50% - var(--button-size) / 2);
	transform-origin: 100% 0;
	width: 100%;
  }
  
  .nav-tile-7 {
	height: calc(50% - var(--button-size) / 2);
	transform-origin: 0 100%;
	width: 100%;
  }
  
  .nav-tile-8 {
	height: calc(50% + var(--button-size) / 2);
	transform-origin: 0 0;
	width: 100%;
  }
  
  .nav-tile-3 {
	width: calc(50% + var(--button-size) / 2);
	height: calc(50% - var(--button-size) / 2);
	transform-origin: 100% 100%;
  }
  
  .nav-tile-5 {
	width: calc(50% - var(--button-size) / 2);
	height: calc(50% + var(--button-size) / 2);
	transform-origin: 0 100%;
  }
  
  .nav-tile-6 {
	width: calc(50% + var(--button-size) / 2);
	height: calc(50% - var(--button-size) / 2);
	transform-origin: 0 0;
  }
  
  .nav-tile-4 {
	width: calc(50% - var(--button-size) / 2);
	height: calc(50% + var(--button-size) / 2);
	transform-origin: 100% 0;
  }
  
  .menu {
	z-index: 101;
	pointer-events: auto;
	width: var(--button-size);
	height: var(--button-size);
	justify-content: center;
	align-items: center;
	padding: 0;
	display: flex;
	/* position: fixed; */
	position: absolute;
  }
  
  .tile {
	grid-column-gap: 16px;
	grid-row-gap: 16px;
	color: var(--text--text-light);
	border-radius: 0;
	flex-flow: column;
	justify-content: space-between;
	align-items: stretch;
	width: 100%;
	height: 100%;
	/* padding: 23px; */
	text-decoration: none;
	transition: border-radius .35s, padding .35s, color .35s cubic-bezier(.4, 0, .2, 1), background-color .35s cubic-bezier(.4, 0, .2, 1);
	display: flex;
	overflow: hidden;
  }
  
  .tile.voice-tone {
	background-color: var(--color--identity--yellow);
	color: var(--color--identity--on-yellow);
  }
  
  .tile.strategy {
	grid-column-gap: 32px;
	grid-row-gap: 32px;
	background-color: var(--color--identity--on-blue);
	color: var(--color--identity--blue);
	border-top-left-radius: 8px;
  }
  
  .tile.typography {
	background-color: var(--color--identity--red);
	color: var(--color--identity--on-red);
	border-top-right-radius: 8px;
  }
  
  .tile.color {
	background-color: var(--color--accent--tangerine);
	color: var(--color--identity--on-orange);
  }
  
  .tile.logo {
	background-color:#12aa17;
	color: var(--color--identity--on-cyan);
  }
  
  .tile.motion {
	background-color:#000000;
	color: var(--color--identity--on-purple);
	border-bottom-right-radius: 8px;
  }
  
  .tile.imagery {
	background-color: var(--color--identity--on-pink);
	color: var(--color--identity--pink);
  }
  
  .tile.iconography {
	background-color: var(--color--accent--lime);
	color: var(--color--identity--on-green);
	border-bottom-left-radius: 8px;
  }
  
  
  
 
  .home {
	/* height: 300vh; */
  }
  
  .home-script {
	z-index: 1;
	position: relative;
  }
  
  .nav-tile {
	padding: 0;
	position: absolute;
  }
  
  .nav-tile.nav-tile-1 {
	height: calc(50% + var(--button-size) / 2 - var(--nav-tile-gap));
	left: var(--nav-tile-gap);
	top: var(--nav-tile-gap);
	width: calc(20% - var(--nav-tile-gap) * 2);
	transform-origin: 100% 100%;
  }
  
  .nav-tile.nav-tile-5 {
	height: calc(50% - var(--button-size) / 2 - var(--nav-tile-gap) * 2);
	left: var(--nav-tile-gap);
	bottom: var(--nav-tile-gap);
	width: calc(20% - var(--nav-tile-gap) * 2);
	transform-origin: 100% 0;
	border-bottom-left-radius: 8px;
	position: absolute;
  }
  
  .nav-tile.nav-tile-2 {
	height: calc(50% - var(--button-size) / 2 - var(--nav-tile-gap) * 2);
	width: calc(30% + var(--button-size) / 2);
	left: 20%;
	top: var(--nav-tile-gap);
	transform-origin: 100% 100%;
	position: absolute;
  }
  
  .nav-tile.nav-tile-6 {
	width: calc(30% - var(--button-size) / 2 - var(--nav-tile-gap));
	height: calc(50% + var(--button-size) / 2 - var(--nav-tile-gap));
	left: 20%;
	bottom: var(--nav-tile-gap);
	transform-origin: 100% 0;
  }
  
  .nav-tile.nav-tile-3 {
	width: calc(30% - var(--button-size) / 2 - var(--nav-tile-gap));
	height: calc(50% + var(--button-size) / 2 - var(--nav-tile-gap));
	top: var(--nav-tile-gap);
	transform-origin: 0 100%;
	right: 20%;
  }
  
  .nav-tile.nav-tile-7 {
	height: calc(50% - var(--button-size) / 2 - var(--nav-tile-gap) * 2);
	width: calc(30% + var(--button-size) / 2);
	right: 20%;
	bottom: var(--nav-tile-gap);
	transform-origin: 0 0;
  }
  
  .nav-tile.nav-tile-4 {
	height: calc(50% - var(--button-size) / 2 - var(--nav-tile-gap) * 2);
	top: var(--nav-tile-gap);
	right: var(--nav-tile-gap);
	width: calc(20% - var(--nav-tile-gap) * 2);
	transform-origin: 0 100%;
  }
  
  .nav-tile.nav-tile-8 {
	height: calc(50% + var(--button-size) / 2 - var(--nav-tile-gap));
	width: calc(20% - var(--nav-tile-gap) * 2);
	bottom: var(--nav-tile-gap);
	right: var(--nav-tile-gap);
	transform-origin: 0 0;
	border-bottom-right-radius: 8px;
  }
  
  .nav-button-content {
	pointer-events: none;
	flex-flow: column;
	justify-content: space-between;
	align-items: flex-start;
	width: min(500px, min(100vw, 100vh) - 64px);
	max-width: 500px;
	height: 100%;
	padding: 22px;
	display: flex;
	position: relative;
  }
  
 
  
  
  .tile-line {
	background-color: var(--color--accent--line-solid);
	pointer-events: none;
	position: absolute;
  }
  
  .tile-line.nav-l {
	transform-origin: 0%;
	width: 1px;
	height: 300vh;
	top: 50%;
	left: 0;
	transform: translate(0, -50%);
  }
  
  .tile-line.nav-r {
	transform-origin: 100%;
	width: 1px;
	height: 300vh;
	top: 50%;
	right: 0;
	transform: translate(0, -50%);
  }
  
  .tile-line.nav-t {
	transform-origin: 50% 0;
	width: 300vw;
	height: 1px;
	top: 0;
	right: 50%;
	transform: translate(50%);
  }
  
  .tile-line.nav-b {
	transform-origin: 50% 100%;
	width: 300vw;
	height: 1px;
	bottom: 0;
	right: 50%;
	transform: translate(50%);
  }
  


  
  .p {
	color: var(--text--text-subtle-light);
  }
  



  
  .type-card-3 {
	background-color: var(--color--accent--azalea);
	justify-content: center;
	align-items: center;
	display: flex;
	position: relative;
  }
  
  .tile-line-wrapper {
	width: 100%;
	height: 100%;
	position: relative;
  }
  
 

 
  .nav-button-title-container {
	flex: 1;
	align-self: stretch;
	position: relative;
  }
  
  .nav-button-title {
	transform-origin: 0 0;
	position: absolute;
	inset: 0% 0% auto;
  }
  
  .nav-button-title.nav-button-title-1 {
	opacity: 0;
	font-size: 36px;
  }
  
  .nav-button-title.nav-button-title-2 {
	opacity: 0;
	font-size: 29px;
  }
  


 


  
  .tile-title {
	transform-origin: 0%;
	letter-spacing: -.02em;
	font-family: Dbsharpgroteskvariable Vf, Arial, sans-serif;
	font-size: min(2.75vw - 6px, 1.375vw + 15px);
	font-weight: 500;
	line-height: .8em;
	position: relative;
	top: 0;
	left: 0;
	transform: translate(0);
  }
  
  

 
  
  .tile-menu-tile {
	color: var(--text--text-light);
	border-radius: 6px;
	justify-content: flex-start;
	align-items: flex-start;
	width: 100%;
	height: 100%;
	padding: 23px;
	text-decoration: none;
	transition: border-color .4s cubic-bezier(.4, 0, .2, 1), background-color .4s cubic-bezier(.4, 0, .2, 1);
	display: flex;
	overflow: hidden;
  }
  
  .tile-menu-tile.nav-button {
	z-index: 2;
	background-color: var(--accent--tab);
	color: var(--white);
	text-align: left;
	cursor: pointer;
	border-radius: 0;
	flex: none;
	justify-content: flex-start;
	align-items: flex-end;
	padding: 0;
	display: block;
	position: relative;
	border:0
  }
  
  .tile-menu-tile.nav-button:hover {
	border-color: #0000;
  }
  
  .tile-menu-tile.nav-button:focus-visible {
	outline-offset: 4px;
	outline-color: var(--accent--tab);
  }
  
  .tile-menu-tile.nav-button[data-wf-focus-visible] {
	outline-offset: 4px;
	outline-color: var(--accent--tab);
  }
  
  .tile-menu-tile.nav-button.nav-button-gridline {
	background-color: #0000;
	overflow: visible;
  }
  
  .voice-tone-visual-container {
	flex: 1;
	/* max-height: min(70%, 25vh); */
	position: relative;
  }
  
  

  
  .color-visual-container {
	flex-flow: column;
	flex: 1;
	justify-content: flex-end;
	align-items: stretch;
	position: relative;
  }
  
  .color-color-block {
	width: 50%;
	height: 50%;
	position: absolute;
  }
  
  .color-color-block.block-1 {
	background-color: var(--color--accent--rust);
	inset: 0% auto auto 0%;
  }
  
  .color-color-block.block-2 {
	background-color: var(--color--identity--on-orange);
	inset: auto 0% 0% auto;
  }
  
  .motion-visual-container {
	flex-flow: column;
	flex: 1;
	/* padding: 8px 14px; */
	position: relative;
  }
  
  .motion-bezier-container {
	flex: 1;
	width: calc(100% - 28px);
	height: calc(100% - 16px);
	position: absolute;
  }
  
  .strategy-visual-container {
	flex-flow: column;
	flex: 1;
	justify-content: flex-end;
	display: flex;
	position: relative;
  }
  
  .strategy-bezier-container {
	flex: 1;
	width: calc(100% - 20px);
	height: calc(100% - 16px);
	position: absolute;
  }
  
  .strategy-visual-square {
	aspect-ratio: 1;
	max-width: 100%;
	max-height: 100%;
	padding: 8px 10px;
	position: absolute;
	left: 0;
	right: 0;
  }
  
  .motion-bezier-container-embed {
	width: 100%;
	height: calc(200% - 7.5px);
	position: absolute;
	top: calc(4px - 50%);
  }
  
  .strategy-bezier-container-embed {
	width: 100%;
	height: calc(200% - 8px);
	position: absolute;
	top: calc(4px - 50%);
  }
  


  
  .color-visual-square {
	aspect-ratio: 1;
	justify-content: flex-end;
	align-items: stretch;
	width: 100%;
	max-width: 100%;
	max-height: min(100%, 20vh);
	display: flex;
	position: absolute;
	bottom: 0;
	right: 0;
  }
  
  .color-visual-square-square {
	aspect-ratio: 1;
	height: 100%;
	position: relative;
  }
  
 



  




  
  .iconography-visual-square {
	justify-content: flex-start;
	align-items: stretch;
	width: 100%;
	max-width: 100%;
	height: 100%;
	/* max-height: min(100%, 15vh); */
	display: flex;
	position: absolute;
	top: 0;
  }
  
  .iconography-visual-container {
	flex-flow: column;
	flex: 1;
	justify-content: flex-end;
	align-items: stretch;
	position: relative;
  }
  
  .iconography-visual-lock-embed {
	height: 100%;
  }
  
  .imagery-visual-container {
	flex-flow: column;
	flex: 1;
	justify-content: flex-end;
	align-items: stretch;
	position: relative;
  }
  
  .imagery-visual-square {
	aspect-ratio: 5 / 4;
	width: 100%;
	max-width: 100%;
	max-height: min(100%, 20vh);
	position: absolute;
	bottom: 0;
	right: 0;
  }
  
  .imagery-visual-picture {
	aspect-ratio: 5 / 4;
	max-height: 100%;
	margin-top: auto;
	margin-left: auto;
	position: relative;
  }
  
  
  
  .relative {
	position: relative;
  }
  

  
  .imagery-visual-picture-embed {
	width: 100%;
	height: 100%;
	position: relative;
	overflow: hidden;
  }
  
  .imagery-visual-picture-border {
	z-index: 2;
	border: 2px solid #fff;
	position: absolute;
	inset: 0%;
  }
  
  .typography-visual-type-embed {
	aspect-ratio: 196 / 110;
	justify-content: flex-end;
	align-items: flex-end;
	width: 100%;
	height: 100%;
	display: flex;
  }
  
  .typography-visual-container {
	flex-flow: column;
	flex: 1;
	justify-content: flex-end;
	align-items: flex-end;
	display: flex;
	position: relative;
  }
  
  .typography-visual-square {
	aspect-ratio: 0/ 0;
	justify-content: flex-end;
	align-items: stretch;
	width: 100%;
	max-width: 100%;
	/* max-height: min(100%, 12vh); */
	display: flex;
	position: absolute;
	top: 0;
  }
  
 
  


  
  .strategy-sketch-1-embed {
	width: calc(112% - 50px);
	height: calc(62% - 12px);
	position: absolute;
	top: -10%;
	left: calc(27px - 3%);
  }
  
  .strategy-sketch-2-embed {
	width: calc(111% - 40px);
	height: calc(62% - 30px);
	position: absolute;
	top: 43%;
	left: calc(18px - 9%);
  }
  
 
  
  .logo-visual-container {
	flex-flow: column;
	flex: 1;
	/* justify-content: flex-end; */
	/* justify-content:center; */
	align-items: stretch;
	position: relative;
	display: flex;
  }
  
  .logo-visual-square {
	width: 100%;
	max-width: 100%;
	/* height: min(100%, 35vh); */
	/* position: absolute; */
	top: 0;
	right: 0;
  }
  
  .nav-page-title {
	z-index: 99;
	color: var(--white);
	text-align: right;
	mix-blend-mode: difference;
	writing-mode: vertical-rl;
	text-orientation: mixed;
	position: fixed;
	top: 16px;
	left: 20px;
	transform: rotate(180deg);
  }
  
  .nav {
	z-index: 100;
	position: absolute;
	inset: 0%;
	overflow: hidden;
	/* height: 100vh; */
  }
  
  .partner-info-button {
	z-index: 99;
	grid-column-gap: 8px;
	grid-row-gap: 8px;
	opacity: 0;
	color: #3080ff;
	writing-mode: vertical-rl;
	text-orientation: mixed;
	flex-flow: row;
	justify-content: center;
	align-items: center;
	text-decoration: none;
	display: flex;
	position: fixed;
	bottom: 16px;
	left: 20px;
	transform: rotate(180deg);
  }
  
  .color-opening-6 {
	cursor: url("https://cdn.prod.website-files.com/66c503d081b2f012369fc5d2/6719573529609d134e2d2b88_gg_color-picker.svg") 0 24, auto;
	height: 85px;
	display: flex;
	position: absolute;
	bottom: calc(20% - 84px);
	right: 0;
  }
  
  
  
  
  

  
  


 
  
  .partner-info-icon-embed {
	transform: rotate(90deg);
  }
  
 

  
  

  

  

  
 
  

 

 
  

  
  .nav-border-line {
	z-index: 100;
	background-color: var(--color--accent--line);
	width: 1px;
	height: 300vh;
	position: fixed;
	top: 0%;
	bottom: 0%;
	left: 59px;
  }
  
  
 
  
  .outro-nav-background {
	z-index: 91;
	background-color: var(--white);
	opacity: 0;
	pointer-events: none;
	width: 100vw;
	height: 100vh;
	position: fixed;
  }
  
  
 
  
  
  
  


  

 
  
  .nav-enlarge-and-menu-icon-script, .opening-animation-script, .nav-background-script {
	display: none;
  }
  
  .nav-background {
	z-index: 85;
	width: 60px;
	height: 100vh;
	display: none;
	position: fixed;
	top: 0%;
	bottom: 0%;
	left: 0%;
	overflow: scroll;
  }
 
  
  

  
  
 
  
  .home-logo-container {
	width: 100%;
	height: 100%;
	position: absolute;
	bottom: 50%;
	left: 50%;
	transform: translate(-50%, 50%);
  }
  
 
  

  

  
 
  



  
 
  
  .logo-visual-lottie, .logo-visual-outline-lottie {
	aspect-ratio: 1;
	height: 100%;
	margin-left: auto;
	position: absolute;
	right: 0;
	transform: translate(30%, 30%);
  }
  
  

  
  .d {
	grid-row-gap: 48px;
	grid-template-rows: calc(50% - 24px) calc(50% - 24px);
	max-height: 900px;
	display: none;
  }
  



  
  .outro-mobile-close-button {
	opacity: 0;
	pointer-events: none;
	position: fixed;
  }
  
 
  
  .nav-button-highlight {
	opacity: 0;
	pointer-events: none;
	visibility: hidden;
	will-change: opacity;
	background-color: #fff;
	transition-property: all;
	transition-duration: .2s;
	transition-timing-function: ease;
	position: absolute;
	inset: 0%;
  }
  
 
 
  
  
  
 
 
  
 
  
  @media screen and (max-width: 991px) {
	.nav-tile-1 {
	  width: calc(50% - var(--button-size) / 2);
	  height: 100%;
	}
  
	.nav-tile-2 {
	  width: calc(50% + var(--button-size) / 2);
	  transform-origin: 0 100%;
	  height: 100%;
	  inset: 0 0 auto auto;
	}
  
	.nav-tile-7 {
	  width: calc(50% + var(--button-size) / 2);
	  transform-origin: 100% 0;
	  height: 100%;
	  inset: auto auto 0 0;
	}
  
	.nav-tile-8 {
	  width: calc(50% - var(--button-size) / 2);
	  height: 100%;
	}
  
	.tile.voice-tone {
	  border-top-right-radius: 4px;
	}
  
	.tile.strategy {
	  border-top-left-radius: 4px;
	}
  
	.tile.typography {
	  border-top-right-radius: 0;
	}
  
	.tile.motion {
	  border-bottom-right-radius: 4px;
	}
  
	.tile.imagery {
	  grid-column-gap: 48px;
	  grid-row-gap: 48px;
	  border-bottom-left-radius: 4px;
	}
  
	.tile.iconography {
	  border-bottom-left-radius: 0;
	}
  
	.nav-tile.nav-tile-1 {
	  height: calc(25% - var(--nav-tile-gap) * 2);
	  width: calc(50% - var(--button-size) / 2 - var(--nav-tile-gap) * 2);
	}
  
	.nav-tile.nav-tile-5 {
	  top: initial;
	  height: calc(25% + var(--button-size) / 2);
	  width: calc(50% - var(--button-size) / 2 - var(--nav-tile-gap) * 2);
	  transform-origin: 100% 0;
	  bottom: 25%;
	}
  
	.nav-tile.nav-tile-2 {
	  top: var(--nav-tile-gap);
	  left: initial;
	  width: calc(50% + var(--button-size) / 2 - var(--nav-tile-gap));
	  height: calc(25% - var(--nav-tile-gap) * 2);
	  right: var(--nav-tile-gap);
	  transform-origin: 0 100%;
	}
  
	.nav-tile.nav-tile-6 {
	  width: calc(50% + var(--button-size) / 2 - var(--nav-tile-gap));
	  left: initial;
	  right: var(--nav-tile-gap);
	  height: calc(25% - var(--button-size) / 2 - var(--nav-tile-gap));
	  transform-origin: 0 0;
	  bottom: 25%;
	}
  
	.nav-tile.nav-tile-3 {
	  height: calc(25% - var(--button-size) / 2 - var(--nav-tile-gap));
	  width: calc(50% + var(--button-size) / 2 - var(--nav-tile-gap));
	  top: 25%;
	  right: initial;
	  left: var(--nav-tile-gap);
	  transform-origin: 100% 100%;
	}
  
	.nav-tile.nav-tile-7 {
	  right: initial;
	  left: var(--nav-tile-gap);
	  height: calc(25% - var(--nav-tile-gap) * 2);
	  width: calc(50% + var(--button-size) / 2 - var(--nav-tile-gap));
	  transform-origin: 100% 0;
	  border-bottom-left-radius: 8px;
	}
  
	.nav-tile.nav-tile-4 {
	  left: initial;
	  height: calc(25% + var(--button-size) / 2);
	  width: calc(50% - var(--button-size) / 2 - var(--nav-tile-gap) * 2);
	  transform-origin: 0 100%;
	  top: 25%;
	}
  
	.nav-tile.nav-tile-8 {
	  height: calc(25% - var(--nav-tile-gap) * 2);
	  width: calc(50% - var(--button-size) / 2 - var(--nav-tile-gap) * 2);
	}
  
	.nav-button-content {
	  padding: 17.7px 14.5px 17.7px 17px;
	}
  

  
	.nav-button-svg.menu-logo {
	  width: 33px;
	  bottom: 16px;
	  left: 16px;
	}
  
	.nav-button-svg.menu-close, .nav-button-svg.menu-arrow, .nav-button-svg.menu-hamburger {
	  width: 48px;
	  bottom: 8px;
	  left: 8px;
	}
  
	
  
	.nav-button-title.nav-button-title-1 {
	  font-size: 24px;
	}
  
	.nav-button-title.nav-button-title-2 {
	  font-size: clamp(14px, 4.8vw, 24px);
	  line-height: 1.25em;
	}
  

	.nav-page-title {
	  writing-mode: initial;
	  text-orientation: initial;
	  inset: auto 16px 13px auto;
	  transform: none;
	}
  

  
	.nav-border-line {
	  width: 100vw;
	  height: 1px;
	  top: auto;
	  bottom: 47px;
	  left: 0;
	}
  
	.nav-background {
	  z-index: 93;
	  width: 100vw;
	  height: 48px;
	  display: block;
	  top: auto;
	}
  
	
  
	.logo-visual-lottie, .logo-visual-outline-lottie {
	  height: 150%;
	  left: 0;
	  right: auto;
	  transform: translate(-30%);
	}
  
  
  }
  

  
  @media screen and (max-width: 479px) {
	.tile {
	  padding: 0px;
	}
  
  
	.iconography-visual-square {
	  /* height: 84px; */
	}
  
	
	
	
  }
  
