@charset 'UTF-8';
/*
	HTML5 Reset :: style.css
	----------------------------------------------------------
	We have learned much from/been inspired by/taken code where offered from:
	Eric Meyer					:: http://meyerweb.com
	HTML5 Doctor				:: http://html5doctor.com
	and the HTML5 Boilerplate	:: http://html5boilerplate.com
-------------------------------------------------------------------------------*/
/* Let's default this puppy out
-------------------------------------------------------------------------------*/
html,
body,
body div,
span,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
abbr,
address,
cite,
code,
del,
dfn,
em,
img,
ins,
kbd,
q,
samp,
small,
strong,
sub,
sup,
var,
b,
i,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
article,
aside,
figure,
footer,
header,
menu,
nav,
section,
time,
mark,
audio,
video,
details,
summary {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font-weight: normal;
  vertical-align: baseline;
  background: transparent;
}
main,
article,
aside,
figure,
footer,
header,
nav,
section,
details,
summary {
  display: block;
}
/* Handle box-sizing while better addressing child elements:
   http://css-tricks.com/inheriting-box-sizing-probably-slightly-better-best-practice/ */
html {
  box-sizing: border-box;
  -webkit-font-smoothing: antialiased;
}
*,
*:before,
*:after {
  box-sizing: inherit;
}
/* consider resetting the default cursor: https://gist.github.com/murtaugh/5247154 */
/* Responsive images and other embedded objects */
/* if you don't have full control over `img` tags (if you have to overcome attributes), consider adding height: auto */
img,
object,
embed {
  max-width: 100%;
}
/*
   Note: keeping IMG here will cause problems if you're using foreground images as sprites.
	In fact, it *will* cause problems with Google Maps' controls at small size.
	If this is the case for you, try uncommenting the following:
#map img {
		max-width: none;
}
*/
/* we use a lot of ULs that aren't bulleted.
	you'll have to restore the bullets within content,
	which is fine because they're probably customized anyway */
ul {
  list-style: none;
  list-style-type: none;
  padding-left: 0;
}
blockquote,
q {
  quotes: none;
}
blockquote:before,
blockquote:after,
q:before,
q:after {
  content: '';
  content: none;
}
a {
  text-decoration: none;
  padding: 0;
  font-size: 100%;
  vertical-align: baseline;
  background: transparent;
}
del {
  text-decoration: line-through;
}
abbr[title],
dfn[title] {
  border-bottom: 1px dotted #000;
  cursor: help;
}
/* tables still need cellspacing="0" in the markup */
table {
  border-collapse: separate;
  border-spacing: 0;
}
th {
  font-weight: bold;
  vertical-align: bottom;
}
td {
  font-weight: normal;
  vertical-align: top;
}
hr {
  display: block;
  height: 1px;
  border: 0;
  border-top: 1px solid #ccc;
  margin: 1em 0;
  padding: 0;
}
input,
select {
  vertical-align: middle;
}
pre {
  white-space: pre;
  /* CSS2 */
  white-space: pre-wrap;
  /* CSS 2.1 */
  white-space: pre-line;
  /* CSS 3 (and 2.1 as well, actually) */
  word-wrap: break-word;
  /* IE */
}
input[type="radio"] {
  vertical-align: text-bottom;
}
input[type="checkbox"] {
  vertical-align: bottom;
}
.ie7 input[type="checkbox"] {
  vertical-align: baseline;
}
.ie6 input {
  vertical-align: text-bottom;
}
input[type="color"] {
  -webkit-appearance: none;
  border: none;
}
input[type="color"]::-webkit-color-swatch-wrapper {
  padding: 0;
}
input[type="color"]::-webkit-color-swatch {
  border: none;
}
select,
input,
textarea {
  font: 99% sans-serif;
  outline: none;
}
table {
  font-size: inherit;
  font: 100%;
}
small {
  font-size: 85%;
}
strong {
  font-weight: bold;
}
td,
td img {
  vertical-align: top;
}
/* Make sure sup and sub don't mess with your line-heights http://gist.github.com/413930 */
sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
}
sup {
  top: -0.5em;
}
sub {
  bottom: -0.25em;
}
/* standardize any monospaced elements */
pre,
code,
kbd,
samp {
  font-family: monospace, sans-serif;
}
/* hand cursor on clickable elements */
.clickable,
label,
input[type=button],
input[type=submit],
input[type=file],
button {
  cursor: pointer;
}
/* Webkit browsers add a 2px margin outside the chrome of form elements */
button,
input,
select,
textarea {
  margin: 0;
  padding: 0;
}
/* make buttons play nice in IE */
button,
input[type=button] {
  width: auto;
  overflow: visible;
}
/* cancel default button style */
button {
  display: inline-block;
  border: none;
  background: none;
  margin: 0;
  text-decoration: none;
  font-family: sans-serif;
  font-size: 1rem;
  cursor: pointer;
  text-align: center;
  -webkit-appearance: none;
  -moz-appearance: none;
}
button:focus {
  outline: none;
}
/* scale images in IE7 more attractively */
.ie7 img {
  -ms-interpolation-mode: bicubic;
}
/* prevent BG image flicker upon hover
   (commented out as usage is rare, and the filter syntax messes with some pre-processors)
.ie6 html {filter: expression(document.execCommand("BackgroundImageCache", false, true));}
*/
/* let's clear some floats */
.clearfix:after {
  content: " ";
  display: block;
  clear: both;
}
section.notfound {
  padding: 100px;
  background: #000;
  height: 100vh;
}
section.notfound div.code {
  font-size: 2em;
  color: #fff;
}
section.notfound div.message {
  color: #fff;
}
section.internalerror {
  padding: 100px;
  background: #000;
  height: 100vh;
}
section.internalerror div.message {
  color: #fff;
}
div.lang-selector {
  display: flex;
  align-items: center;
  cursor: pointer;
  position: relative;
}
div.lang-selector div.lang-selector-button {
  display: flex;
  flex-direction: row;
  align-items: center;
  position: relative;
}
div.lang-selector div.lang-selector-button img.locale-icon {
  width: 14px;
}
div.lang-selector div.lang-selector-button span.current-lang {
  display: none;
}
div.lang-selector div.lang-selector-button img.arrow-icon {
  width: 10px;
  margin-left: 5px;
  transition: transform 0.3s cubic-bezier(0.65, 0, 0.34, 1);
}
div.lang-selector ul.lang-options {
  display: none;
  position: absolute;
  top: 100%;
  /* Position directly below the button */
  left: -56px;
  background-color: white;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
  width: max-content;
  padding: 9px 6px;
  transition: transform 0.3s cubic-bezier(0.65, 0, 0.34, 1), opacity 0.3s cubic-bezier(0.65, 0, 0.34, 1);
  transform-origin: top;
  transform: scaleY(0);
  opacity: 0;
}
div.lang-selector ul.lang-options li.select {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 5px 0px;
  font-size: 12px;
  cursor: pointer;
  transition: background-color 0.3s cubic-bezier(0.65, 0, 0.34, 1);
  color: #525252;
  transition: color 0.3s cubic-bezier(0.65, 0, 0.34, 1);
}
div.lang-selector ul.lang-options li.select:hover {
  color: #000;
}
div.lang-selector.show div.lang-selector-button img.arrow-icon {
  transform: rotate(180deg);
}
@keyframes expandDown {
  from {
    transform: scaleY(0);
    opacity: 0;
  }
  to {
    transform: scaleY(1);
    opacity: 1;
  }
}
div.lang-selector.show ul.lang-options {
  display: block;
  animation: expandDown 0.3s cubic-bezier(0.65, 0, 0.34, 1) forwards;
}
form.inquiry-form {
  display: flex;
  flex-direction: column;
  align-items: center;
}
form.inquiry-form div.input-fields {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  width: 600px;
}
form.inquiry-form div.input-fields input,
form.inquiry-form div.input-fields textarea {
  width: 100%;
  margin-bottom: 10px;
  padding: 14px 11px;
  border: 1px solid #dddddd;
  border-radius: 4px;
}
form.inquiry-form div.input-fields textarea {
  height: 160px;
}
form.inquiry-form div.submit input[type=submit] {
  cursor: pointer;
  width: 120px;
  padding: 11px 0;
  color: #fff;
  background-color: #3c3c3c;
  border: none;
  border-radius: 3px;
  transition: all 0.4s cubic-bezier(0.65, 0, 0.34, 1);
}
form.inquiry-form div.submit input[type=submit]:hover {
  background-color: #000;
}
form.inquiry-form p.message.error {
  color: #8f2a2a;
}
form.inquiry-form p.message.success {
  color: #2a5e78;
}
@media (max-width: 768px) {
  form.inquiry-form div.input-fields {
    width: 81vw;
  }
}
body #main-header div.header-left div.company-logo #header-logo-name {
  opacity: 0;
  transform: translateY(0%);
  transition: opacity 0.4s cubic-bezier(0.65, 0, 0.34, 1) 0.3s, transform 0.4s cubic-bezier(0.65, 0, 0.34, 1) 0.2s;
}
body #main-header div.header-left div.company-logo #header-logo-icon {
  opacity: 0;
  transform: translateY(-40%);
  transition: opacity 0.5s cubic-bezier(0.65, 0, 0.34, 1) 0s, transform 0.4s ease-in 0.1s;
}
body #main-header div.header-right div.header-menu-mobile {
  opacity: 0;
  transform: translateY(-30%);
  transition: opacity 0.4s cubic-bezier(0.65, 0, 0.34, 1) 0.2s, transform 0.4s cubic-bezier(0.65, 0, 0.34, 1) 0.2s;
}
body #main-header div.header-right div.header-menu-content {
  opacity: 0;
  transform: translateY(-30%);
  transition: opacity 0.4s cubic-bezier(0.65, 0, 0.34, 1) 0.2s, transform 0.4s cubic-bezier(0.65, 0, 0.34, 1) 0.2s;
}
body #main-header div.header-right div.header-locale {
  opacity: 0;
  transform: translateY(-30%);
  transition: opacity 0.4s cubic-bezier(0.65, 0, 0.34, 1) 0.3s, transform 0.4s cubic-bezier(0.65, 0, 0.34, 1) 0.3s;
}
body.show #main-header div.header-left div.company-logo #header-logo-name {
  opacity: 1;
  transform: translateX(0%);
  transform: translateY(0%);
}
body.show #main-header div.header-left div.company-logo #header-logo-icon {
  opacity: 1;
  transform: translateX(0%);
  transform: translateY(0%);
}
body.show #main-header div.header-right div.header-menu-mobile {
  opacity: 1;
  transform: translateY(0%);
}
body.show #main-header div.header-right div.header-menu-content {
  opacity: 1;
  transform: translateY(0%);
}
body.show #main-header div.header-right div.header-locale {
  opacity: 1;
  transform: translateY(0%);
}
#main-header {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  background-color: #fff;
  position: relative;
  z-index: 100;
}
#main-header div.main-header-container {
  position: fixed;
  top: 0;
  display: flex;
  justify-content: space-between;
  flex-direction: row;
  align-items: center;
  width: 100%;
  padding: 10px 20px;
}
#main-header div.main-header-container div.header-left {
  display: flex;
}
#main-header div.main-header-container div.header-left div.company-logo {
  display: flex;
  align-items: center;
}
#main-header div.main-header-container div.header-left div.company-logo a {
  display: flex;
  align-items: center;
  text-decoration: none;
}
#main-header div.main-header-container div.header-left div.company-logo a img#header-logo-name {
  width: 81px;
  margin-right: 10px;
}
#main-header div.main-header-container div.header-left div.company-logo a img#header-logo-icon {
  width: 60px;
}
#main-header div.main-header-container div.header-right {
  display: flex;
  align-items: center;
}
#main-header div.main-header-container div.header-right div.header-menu-mobile {
  display: none;
}
#main-header div.main-header-container div.header-right div.header-menu {
  display: flex;
  flex-direction: row;
  align-items: center;
}
#main-header div.main-header-container div.header-right div.header-menu img#header-menu-icon {
  display: none;
}
#main-header div.main-header-container div.header-right div.header-menu img#header-menu-arrow {
  display: none;
}
#main-header div.main-header-container div.header-right div.header-menu-content ul.header-menu-list {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: flex-start;
}
#main-header div.main-header-container div.header-right div.header-menu-content ul.header-menu-list li.menu-content {
  margin-right: 30px;
  position: relative;
  cursor: pointer;
}
#main-header div.main-header-container div.header-right div.header-menu-content ul.header-menu-list li.menu-content div.title-container {
  display: flex;
  flex-direction: row;
  position: relative;
  align-items: center;
}
#main-header div.main-header-container div.header-right div.header-menu-content ul.header-menu-list li.menu-content div.title-container h4.title {
  color: #333;
  margin-right: 5px;
  transition: color 0.3s cubic-bezier(0.65, 0, 0.34, 1);
}
#main-header div.main-header-container div.header-right div.header-menu-content ul.header-menu-list li.menu-content div.title-container img.arrow-icon {
  width: 10px;
  transition: transform 0.3s cubic-bezier(0.65, 0, 0.34, 1);
}
#main-header div.main-header-container div.header-right div.header-menu-content ul.header-menu-list li.menu-content ul.list {
  display: none;
  top: 20px;
  position: absolute;
  background-color: #FFF;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
  left: -10%;
  width: max-content;
  min-width: 120px;
  padding: 9px 0;
}
#main-header div.main-header-container div.header-right div.header-menu-content ul.header-menu-list li.menu-content ul.list li.sub-menu-content {
  display: flex;
  align-items: center;
  padding: 2px 12px;
  font-size: 14px;
  transition: background-color 0.3s cubic-bezier(0.65, 0, 0.34, 1);
}
#main-header div.main-header-container div.header-right div.header-menu-content ul.header-menu-list li.menu-content ul.list li.sub-menu-content a {
  transition: color 0.3s cubic-bezier(0.65, 0, 0.34, 1);
  color: #525252;
}
#main-header div.main-header-container div.header-right div.header-menu-content ul.header-menu-list li.menu-content ul.list li.sub-menu-content:hover a {
  color: #000;
}
@media (min-width: 768px) {
  #main-header div.main-header-container div.header-right div.header-menu-content ul.header-menu-list li.menu-content:hover div.title-container h4.title {
    color: #000;
  }
  #main-header div.main-header-container div.header-right div.header-menu-content ul.header-menu-list li.menu-content:hover div.title-container img.arrow-icon {
    transform: rotate(180deg);
  }
  @keyframes expandDown {
    from {
      transform: translateY(0);
      transform-origin: top;
      opacity: 0;
    }
    to {
      transform: translateY(10px);
      transform-origin: top;
      opacity: 1;
    }
  }
  #main-header div.main-header-container div.header-right div.header-menu-content ul.header-menu-list li.menu-content:hover ul.list {
    display: block;
    animation: expandDown 0.3s cubic-bezier(0.65, 0, 0.34, 1) forwards;
  }
}
#main-header div.main-header-container div.header-right div.header-locale {
  display: flex;
  align-items: center;
  margin-left: 20px;
}
#main-header div.main-header-container div.header-right div.header-locale img#header-locale-icon {
  width: 14px;
}
#main-header div.main-header-container div.header-right div.header-locale img#header-locale-arrow {
  width: 10px;
  margin-left: 5px;
  transition: transform 0.3s cubic-bezier(0.65, 0, 0.34, 1);
}
#main-header div.main-header-container div.header-right div.header-locale.open img#header-locale-arrow {
  transform: rotate(180deg);
}
@media (max-width: 1014px) {
  #main-header div.main-header-container div.header-right {
    position: relative;
  }
  #main-header div.main-header-container div.header-right div.header-menu-mobile {
    display: flex;
    align-items: center;
  }
  #main-header div.main-header-container div.header-right div.header-menu-mobile img#header-menu-icon {
    display: block;
    width: 14px;
    margin-right: 4px;
  }
  #main-header div.main-header-container div.header-right div.header-menu-mobile img#header-menu-arrow {
    display: block;
    width: 10px;
    transition: transform 0.3s cubic-bezier(0.65, 0, 0.34, 1);
  }
  #main-header div.main-header-container div.header-right div.header-menu-mobile.open img#header-menu-arrow {
    transform: rotate(180deg);
  }
  @keyframes expandDown {
    from {
      transform: translateY(0);
      transform-origin: top;
      opacity: 0;
    }
    to {
      transform: translateY(10px);
      transform-origin: top;
      opacity: 1;
    }
  }
  #main-header div.main-header-container div.header-right div.header-menu-content {
    display: none;
    position: absolute;
    top: 100%;
    /* Position directly below the button */
    padding: 14px 18px;
    left: -181px;
    background-color: white;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
    max-width: 274px;
    width: max-content;
    padding: 9px 6px;
    transition: transform 0.3s cubic-bezier(0.65, 0, 0.34, 1), opacity 0.3s cubic-bezier(0.65, 0, 0.34, 1);
    transform-origin: top;
    transform: scaleY(0);
    opacity: 0;
  }
  #main-header div.main-header-container div.header-right div.header-menu-content ul.header-menu-list {
    flex-direction: column;
    align-items: flex-start;
  }
  #main-header div.main-header-container div.header-right div.header-menu-content ul.header-menu-list li.menu-content {
    margin-bottom: 0px;
  }
  #main-header div.main-header-container div.header-right div.header-menu-content ul.header-menu-list li.menu-content div.title-container h4.title {
    font-size: 15px;
  }
  #main-header div.main-header-container div.header-right div.header-menu-content ul.header-menu-list li.menu-content ul.list {
    display: block;
    position: relative;
    top: auto;
    left: auto;
    box-shadow: none;
    padding: 2px 0 5px 14px;
  }
  #main-header div.main-header-container div.header-right div.header-menu-content ul.header-menu-list li.menu-content ul.list li.sub-menu-content {
    padding: 0px 12px;
  }
  #main-header div.main-header-container div.header-right div.header-menu-content.open {
    display: block;
    animation: expandDown 0.3s cubic-bezier(0.65, 0, 0.34, 1) forwards;
  }
}
footer {
  font-size: 1em;
  background-color: #fafafa;
  font-weight: 700;
  vertical-align: bottom;
  padding: 80px 80px 0 80px;
  color: #2a2a2a;
}
footer div.footer-container {
  display: flex;
  flex-direction: column;
}
footer div.footer-container div.footer-contents-top {
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  justify-content: space-between;
  margin-bottom: 86px;
}
footer div.footer-container div.footer-contents-top div.top-left {
  margin-right: 33px;
}
footer div.footer-container div.footer-contents-top div.top-left div.basic a.footer-company-logo img {
  width: 216px;
}
footer div.footer-container div.footer-contents-top div.top-left div.basic p.caption {
  margin-top: 28px;
  font-size: 0.8em;
  padding-left: 4px;
}
footer div.footer-container div.footer-contents-top div.top-right {
  display: flex;
  flex-direction: row;
  justify-content: flex-end;
}
footer div.footer-container div.footer-contents-top div.top-right ul.contents-list {
  margin-right: 40px;
}
footer div.footer-container div.footer-contents-top div.top-right ul.contents-list h4 {
  margin-bottom: 16px;
}
footer div.footer-container div.footer-contents-top div.top-right ul.contents-list li sup {
  top: -0.5em;
  padding: 0 0px 0 2px;
}
footer div.footer-container div.footer-contents-top div.top-right ul.contents-list li a {
  font-size: 12px;
  text-decoration: none;
  color: #717171;
  display: block;
  margin-bottom: 10px;
  cursor: pointer;
  -webkit-transition: color 0.5s cubic-bezier(0.24, 0.8, 0.55, 0.94) 0s;
  -moz-transition: color 0.5s cubic-bezier(0.24, 0.8, 0.55, 0.94) 0s;
  -o-transitino: color 0.5s cubic-bezier(0.24, 0.8, 0.55, 0.94) 0s;
  transition: color 0.5s cubic-bezier(0.24, 0.8, 0.55, 0.94) 0s;
}
footer div.footer-container div.footer-contents-top div.top-right ul.contents-list li a:hover {
  color: #000;
}
footer div.footer-container div.footer-contents-middle {
  border-bottom: 1px solid #fefefe;
  display: flex;
  flex-direction: column;
  align-items: end;
}
footer div.footer-container div.footer-contents-middle div.mailnews {
  width: 661px;
}
footer div.footer-container div.footer-contents-middle div.mailnews p.mailnews-caption {
  font-size: 0.8em;
  margin-bottom: 15px;
}
footer div.footer-container div.footer-contents-middle div.mailnews form input[name="emailletter"] {
  border: 1px solid #FFF;
  background-color: #fff;
  font-size: 0.8em;
  padding: 7px 14px 8px 8px;
  width: 300px;
  color: #5d5d5d;
  border-radius: 0;
}
footer div.footer-container div.footer-contents-bottom {
  padding: 60px 0 15px 0;
  text-align: right;
}
footer div.footer-container div.footer-contents-bottom p.copyright {
  font-size: 0.8em;
}
@media (max-width: 768px) {
  footer {
    padding: 93px 26px;
  }
  footer div.footer-container div.footer-contents-top div.top-left {
    width: 58%;
  }
  footer div.footer-container div.footer-contents-top div.top-right {
    flex-direction: column;
    width: 42%;
  }
  footer div.footer-container div.footer-contents-top div.top-right ul.contents-list {
    margin-right: 0;
    margin-bottom: 14px;
  }
  footer div.footer-container div.footer-contents-top div.top-right ul.contents-list h4 {
    margin-bottom: 12px;
  }
  footer div.footer-container div.footer-contents-middle div.mailnews {
    max-width: 100%;
  }
}
body div#top.main-container img.top-view-arrow {
  display: none;
  opacity: 0;
  transition: opacity 3s cubic-bezier(0.65, 0, 0.34, 1) 0.8s, transform 1s cubic-bezier(0.65, 0, 0.34, 1) 0.2s;
}
body div#top.main-container section.top-view div.top-view-message img.logo {
  display: none;
  opacity: 0;
  transform: scale(140%);
  filter: blur(5px);
  transition: opacity 3s cubic-bezier(0.65, 0, 0.34, 1) 0.3s, transform 1s cubic-bezier(0.65, 0, 0.34, 1) 0.2s, filter 3s cubic-bezier(0.65, 0, 0.34, 1) 0.2s;
}
body div#top.main-container section.top-view div.top-view-message div.message-container div.message {
  opacity: 0;
  transition: opacity 1s cubic-bezier(0.65, 0, 0.34, 1) 0.5s, filter 2s cubic-bezier(0.65, 0, 0.34, 1) 0.2s, transform 1s cubic-bezier(0.65, 0, 0.34, 1) 0.2s;
}
body div#top.main-container section.top-view div.top-view-message div.message-container p.sub-message {
  opacity: 0;
  transition: opacity 1s cubic-bezier(0.65, 0, 0.34, 1) 0.7s, filter 2s cubic-bezier(0.65, 0, 0.34, 1) 0.2s, transform 1s cubic-bezier(0.65, 0, 0.34, 1) 0.3s;
}
body div#top.main-container section.top-view div.top-view-message div.message-container a.latest {
  padding-top: 10px;
  opacity: 0;
  transition: opacity 1s cubic-bezier(0.65, 0, 0.34, 1) 0.7s, filter 2s cubic-bezier(0.65, 0, 0.34, 1) 0.2s, transform 1s cubic-bezier(0.65, 0, 0.34, 1) 0.3s;
}
body.show div#top.main-container img.top-view-arrow {
  opacity: 1;
}
body.show div#top.main-container section.top-view div.top-view-message img.logo {
  opacity: 1;
  transform: translateX(0px);
  transform: scale(100%);
  filter: blur(0px);
}
body.show div#top.main-container section.top-view div.top-view-message div.message-container {
  max-width: 800px;
}
body.show div#top.main-container section.top-view div.top-view-message div.message-container div.message {
  opacity: 1;
  transform: scale(100%);
  filter: blur(0px);
}
body.show div#top.main-container section.top-view div.top-view-message div.message-container p.sub-message {
  opacity: 1;
  transform: scale(100%);
  filter: blur(0px);
}
body.show div#top.main-container section.top-view div.top-view-message div.message-container a.latest {
  opacity: 1;
  transform: scale(100%);
  filter: blur(0px);
}
div#top.main-container {
  display: flex;
  flex-direction: column;
}
div#top.main-container div.main-content {
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  position: relative;
}
div#top.main-container div.main-content img.top-view-arrow {
  position: absolute;
  top: 74vh;
  width: 82px;
  height: auto;
  cursor: pointer;
  animation: bounce 7s infinite;
}
@keyframes bounce {
  0%,
  20%,
  50%,
  80%,
  100% {
    transform: translateY(0);
  }
  40% {
    transform: translateY(-30px);
  }
  60% {
    transform: translateY(-15px);
  }
}
div#top section.top-view {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  height: 100vh;
  text-align: center;
}
div#top section.top-view div.top-view-message {
  position: relative;
  display: flex;
  flex-direction: row;
  align-items: center;
}
div#top section.top-view div.top-view-message img.logo {
  position: absolute;
  left: -292px;
  width: 172px;
  height: auto;
}
div#top section.top-view div.top-view-message div.message-container {
  display: flex;
  flex-direction: column;
  text-align: left;
}
div#top section.top-view div.top-view-message div.message-container div.message {
  font-family: 'GeosansLight', "yu-gothic-pr6n", sans-serif;
  font-size: 56px;
  font-weight: 100;
  color: #5a5a5a;
}
div#top section.top-view div.top-view-message div.message-container p.sub-message {
  font-size: 16px;
  font-weight: 100;
  color: #5a5a5a;
}
div#top.main-container section.vision-section {
  position: relative;
  width: 100%;
  height: 100vh;
  display: flex;
  align-items: center;
  overflow: hidden;
}
div#top.main-container section.vision-section video.vision-section-video {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  z-index: -1;
}
div#top.main-container section.vision-section div.vision-section-content {
  max-width: 800px;
  box-sizing: border-box;
  padding-left: 72px;
}
div#top.main-container section.vision-section div.vision-section-content h2.vision-section-title {
  font-size: 46px;
  font-weight: bold;
  margin-bottom: 20px;
  color: #fff;
  line-height: 1.1em;
}
div#top.main-container section.vision-section div.vision-section-content p.vision-section-description {
  font-size: 18px;
  line-height: 1.6em;
  font-weight: bold;
  margin-bottom: 20px;
  color: #fff;
}
div#top.main-container section.vision-section div.vision-section-content button.vision-section-learn-more {
  position: relative;
  overflow: hidden;
  background: rgba(255, 255, 255, 0.4);
  backdrop-filter: blur(10px);
  border: none;
  font-size: 13px;
  padding: 17px 34px;
  cursor: pointer;
  transition: opacity 0.3s cubic-bezier(0.65, 0, 0.34, 1);
  color: #fff;
}
div#top.main-container section.vision-section div.vision-section-content button.vision-section-learn-more span {
  transition: all 0.3s cubic-bezier(0.65, 0, 0.34, 1);
}
div#top.main-container section.vision-section div.vision-section-content button.vision-section-learn-more:hover {
  opacity: 0.9;
}
div#top.main-container section.vision-section div.vision-section-content button.vision-section-learn-more:hover span {
  color: #000;
}
div#top section.main-message {
  width: 100%;
  height: 100vh;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}
div#top section.main-message h4 {
  font-size: 27px;
}
div#top section.products-section {
  width: 100%;
  padding: 0px 0px 0px 0px;
  position: relative;
  background: #fafafa;
}
div#top section.products-section ul.products {
  background-color: #fafafa;
}
div#top section.products-section ul.products li.product {
  display: flex;
  flex-direction: row;
  transition: background-color 1s cubic-bezier(0.65, 0, 0.34, 1) 0s, padding-top 1s cubic-bezier(0.65, 0, 0.34, 1) 0s, padding-bottom 1s cubic-bezier(0.65, 0, 0.34, 1) 0s;
  position: relative;
  overflow: hidden;
  padding-left: 50px;
  padding-right: 50px;
  padding-top: 12px;
  padding-bottom: 62px;
}
div#top section.products-section ul.products li.product:first-child {
  padding-top: 300px;
}
div#top section.products-section ul.products li.product div.text {
  max-width: 42%;
  margin-right: 30px;
  transition: color 1s cubic-bezier(0.65, 0, 0.34, 1) 0s, transform 1s cubic-bezier(0.65, 0, 0.34, 1) 0s;
}
div#top section.products-section ul.products li.product div.text h2.name {
  font-size: 30px;
}
div#top section.products-section ul.products li.product div.text div.wrapper {
  display: flex;
  flex-direction: row;
  align-items: center;
}
div#top section.products-section ul.products li.product div.text div.wrapper h2.name {
  margin-right: 20px;
}
div#top section.products-section ul.products li.product div.text div.wrapper span.version2 {
  opacity: 0;
  font-size: 10px;
  padding: 0px 4px;
  border: 1px solid #486d77;
  border-radius: 3px;
  height: max-content;
  color: #486d77;
  transition: opacity 0.4s cubic-bezier(0.65, 0, 0.34, 1);
}
div#top section.products-section ul.products li.product div.text h3.copy {
  margin-bottom: 14px;
  color: #777777;
}
div#top section.products-section ul.products li.product div.text small.annotation {
  color: #9a9a9a;
  font-size: 10px;
  display: block;
  margin-top: 10px;
}
div#top section.products-section ul.products li.product div.text button.more,
div#top section.products-section ul.products li.product div.text button.paper {
  opacity: 0;
  transition: color 0.3s cubic-bezier(0.65, 0, 0.34, 1), opacity 1s cubic-bezier(0.65, 0, 0.34, 1);
  color: #8CB7C3;
  margin-top: 12px;
  font-size: 15px;
}
div#top section.products-section ul.products li.product div.text button.more:hover,
div#top section.products-section ul.products li.product div.text button.paper:hover {
  color: #6e939d;
}
div#top section.products-section ul.products li.product div.text button.paper {
  margin-left: 15px;
}
div#top section.products-section ul.products li.product div.video-container {
  opacity: 0;
  width: 1215px;
  height: 0;
  transition: all 1s cubic-bezier(0.65, 0, 0.34, 1) 0s;
}
div#top section.products-section ul.products li.product div.video-container video {
  width: 100%;
  /* Ensure video covers entire element */
  height: 100%;
  top: 0;
  left: 0;
  object-fit: cover;
  /* Maintain aspect ratio while covering entire area */
  z-index: -1;
  /* Keep the video behind the text */
}
div#top section.products-section ul.products li.product div.video-container.middle {
  width: 615px;
}
div#top section.products-section ul.products li.product div.image-container {
  opacity: 0;
  height: 350px;
  transition: all 1s cubic-bezier(0.65, 0, 0.34, 1) 0s;
}
div#top section.products-section ul.products li.product div.image-container img {
  width: 100%;
  /* Ensure video covers entire element */
  height: 100%;
  object-fit: cover;
  /* Maintain aspect ratio while covering entire area */
  z-index: -1;
  /* Keep the video behind the text */
}
div#top section.products-section ul.products li.product div.image-container.active {
  opacity: 1;
  height: 400px;
}
div#top section.products-section ul.products.featured-products li.product.active {
  background: #335679;
}
div#top section.products-section ul.products.featured-products li.product.quantz.active {
  background: #335679;
}
div#top section.products-section ul.products.featured-products li.product.voiceOS.active {
  background: #000;
}
div#top section.products-section ul.products.reserves li.product.active {
  background: #929292;
}
div#top section.products-section ul.products.technology li.product.active {
  background: #000;
}
div#top section.products-section ul.products li.product.active {
  padding-top: 300px;
  padding-bottom: 400px;
}
div#top section.products-section ul.products li.product.active div.text {
  color: #fff;
}
div#top section.products-section ul.products li.product.active div.video-container {
  height: 410px;
  opacity: 1;
  transform: translateX(0px);
}
div#top section.products-section ul.products li.product.active div.video-container.middle {
  height: 322px;
}
div#top section.products-section ul.products li.product.active div.text div.wrapper span.version2 {
  opacity: 1;
}
div#top section.products-section ul.products li.product.active div.text h3.copy {
  color: #d9d9d9;
}
div#top section.products-section ul.products li.product.active div.text button.more {
  opacity: 1;
}
div#top section.products-section ul.products li.product.voiceOS {
  display: flex;
  flex-direction: column;
  padding-bottom: 200px;
}
div#top section.products-section ul.products li.product.voiceOS div.main-container {
  display: flex;
  flex-direction: row;
}
div#top section.products-section ul.products li.product.voiceOS div.sub-container div.images-container {
  position: relative;
  width: 100%;
  /* or a narrower max-width if desired */
  margin: 40px auto;
}
div#top section.products-section ul.products li.product.voiceOS div.sub-container div.images-container img {
  display: block;
  width: 70%;
  /* adjust to your preference */
  margin: 80px auto;
  /* top/bottom spacing between images */
  opacity: 0;
  transform: translateY(-50px);
  transition: opacity 0.8s cubic-bezier(0.65, 0, 0.34, 1), transform 0.8s cubic-bezier(0.65, 0, 0.34, 1);
}
div#top section.products-section ul.products li.product.voiceOS div.sub-container div.images-container img.visible {
  opacity: 1;
  transform: translateX(0);
}
div#top section.message-section {
  padding: 480px 0px 80px 0px;
  display: flex;
  flex-direction: column;
  align-items: center;
}
div#top section.message-section h2.title {
  font-family: "GeosansLight", "yu-gothic-pr6n", sans-serif;
  font-size: 54px;
  text-align: center;
  margin-bottom: 12px;
  font-weight: 100;
  color: #757575;
}
div#top section.message-section h3.subtitle {
  font-family: "GeosansLight", "yu-gothic-pr6n", sans-serif;
  font-size: 22px;
  text-align: center;
  margin-bottom: 50px;
  font-weight: 100;
  color: #040404;
  max-width: 800px;
}
div#top section.message-section article.message-article {
  font-size: 19px;
  white-space: pre-wrap;
  margin-bottom: 200px;
  max-width: 800px;
}
div#top section.message-section article.message-article:first-child {
  margin-bottom: 200px;
}
@media (max-width: 768px) {
  div#top section.top-view {
    padding: 0 40px;
  }
  div#top section.top-view div.top-view-message img.logo {
    display: none;
  }
  div#top.main-container section.vision-section div.vision-section-content {
    padding-left: 20px;
    padding-right: 20px;
    max-width: 100%;
  }
  div#top.main-container section.vision-section div.vision-section-content h2.vision-section-title {
    font-size: 34px;
  }
  div#top section.products-section ul.products li.product {
    flex-direction: column;
    padding-left: 22px;
    padding-right: 22px;
  }
  div#top section.products-section ul.products li.product div.text {
    max-width: 100%;
    margin-bottom: 54px;
  }
  div#top section.products-section ul.products li.product div.video-container,
  div#top section.products-section ul.products li.product div.video-container.middle,
  div#top section.products-section ul.products li.product div.image-container,
  div#top section.products-section ul.products li.product div.image-container.middle {
    width: 100%;
  }
  div#top section.products-section ul.products.featured-products li.product.active {
    background: #335679;
  }
  div#top section.products-section ul.products.featured-products li.product.quantz.active {
    background: #335679;
  }
  div#top section.products-section ul.products.featured-products li.product.voiceOS.active {
    background: #000;
  }
  div#top section.products-section ul.products.reserves li.product.active {
    background: #929292;
  }
  div#top section.products-section ul.products.technology li.product.active {
    background: #000;
  }
  div#top section.products-section ul.products li.product.active div.video-container {
    height: 280px;
  }
  div#top section.products-section ul.products li.product.active div.video-container.middle {
    height: 280px;
  }
  div#top section.products-section ul.products li.product.voiceOS div.main-container {
    flex-direction: column;
  }
  div#top section.products-section ul.products li.product.voiceOS div.sub-container div.images-container img {
    width: 100%;
    margin: 0;
  }
  div#top section.products-section ul.products li.product.voiceOS.active {
    background: #000;
  }
  div#top section.message-section {
    padding: 480px 30px 80px 30px;
  }
}
div.product-page div.content-wrapper {
  padding: 50px 0 100px 0;
}
div.product-page div.content-wrapper div.header {
  height: 20vh;
  margin-top: 60px;
  background-color: #fff;
}
div.product-page div.content-wrapper div.header h1.title,
div.product-page div.content-wrapper div.header h3.subtitle {
  text-align: center;
}
div.product-page div.content-wrapper div.header h1.title {
  font-size: 39px;
  font-weight: 600;
  color: #000;
}
div.product-page div.content-wrapper div.header h3.subtitle {
  font-size: 22px;
  font-weight: 300;
  color: #000;
}
div.product-page div.content-wrapper div.header img.main-image {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: auto;
  z-index: -1;
}
div.product-page div.content-wrapper div.main-content section {
  display: flex;
  flex-direction: row;
  padding: 50px 0;
}
div.product-page div.content-wrapper div.main-content section div.section-image-container {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  flex: 1.3;
  width: 50vw;
}
div.product-page div.content-wrapper div.main-content section div.section-image-container img {
  width: 100%;
  display: block;
}
div.product-page div.content-wrapper div.main-content section div.section-image-container small.annotation {
  padding: 12px 18px;
  font-size: 12px;
}
div.product-page div.content-wrapper div.main-content section div.section-text-container {
  flex: 1;
  padding: 0px 81px;
}
div.product-page div.content-wrapper div.main-content section div.section-text-container h2 {
  font-size: 22px;
  font-weight: 800;
  padding: 0px 0;
}
div.product-page div.content-wrapper div.main-content section div.section-text-container article {
  white-space: pre-wrap;
  font-size: 15px;
  color: #333333;
  margin-bottom: 10px;
}
div.product-page div.content-wrapper div.main-content section:nth-child(odd) .section-image-container {
  order: 1;
}
div.product-page div.content-wrapper div.main-content section:nth-child(odd) .section-text-container {
  order: 2;
}
div.product-page div.content-wrapper div.main-content section:nth-child(even) .section-image-container {
  order: 2;
}
div.product-page div.content-wrapper div.main-content section:nth-child(even) .section-text-container {
  order: 1;
}
div.product-page div.content-wrapper div.main-content section:nth-child(3n+1) div.section-text-container {
  background-color: #fff;
}
div.product-page div.content-wrapper div.main-content section:nth-child(3n+1) div.section-text-container h2 {
  color: #000;
}
div.product-page div.content-wrapper div.main-content section:nth-child(3n+1) div.section-text-container article {
  color: #000;
}
div.product-page div.content-wrapper div.main-content section:nth-child(3n+2) div.section-text-container {
  background-color: #fff;
}
div.product-page div.content-wrapper div.main-content section:nth-child(3n+2) div.section-text-container h2 {
  color: #000;
}
div.product-page div.content-wrapper div.main-content section:nth-child(3n+2) div.section-text-container article {
  color: #000;
}
div.product-page div.content-wrapper div.main-content section:nth-child(3n+3) div.section-text-container {
  background-color: #fff;
}
div.product-page div.content-wrapper div.main-content section:nth-child(3n+3) div.section-text-container h2 {
  color: #000;
}
div.product-page div.content-wrapper div.main-content section:nth-child(3n+3) div.section-text-container article {
  color: #000;
}
div.product-page div.content-wrapper div.main-content section:last-child {
  margin-bottom: 100px;
}
div.product-page div.content-wrapper div.main-content div.inquiry-section {
  margin-top: 100px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 30px 0;
}
div.product-page div.content-wrapper div.main-content div.inquiry-section button.inquiry-button {
  background-color: #000;
  color: #fff;
  padding: 22px 20px;
  border-radius: 37px;
  font-size: 15px;
  transition: box-shadow 0.3s cubic-bezier(0.65, 0, 0.34, 1) 0s, background-color 0.3s cubic-bezier(0.65, 0, 0.34, 1) 0s, color 0.3s cubic-bezier(0.65, 0, 0.34, 1) 0s;
}
div.product-page div.content-wrapper div.main-content div.inquiry-section button.inquiry-button:hover {
  background-color: #343434;
  color: #fafafa;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}
@media (max-width: 768px) {
  div.product-page div.content-wrapper {
    padding: 50px 25px 100px 25px;
  }
  div.product-page div.content-wrapper div.header {
    height: max-content;
  }
  div.product-page div.content-wrapper div.main-content section {
    flex-direction: column;
    align-items: center;
    padding: 50px 0px;
  }
  div.product-page div.content-wrapper div.main-content section div.section-image-container {
    width: 100%;
  }
  div.product-page div.content-wrapper div.main-content section div.section-image-container small.annotation {
    padding: 12px 0px;
  }
  div.product-page div.content-wrapper div.main-content section div.section-text-container {
    padding: 0px 0px;
  }
  div.product-page div.content-wrapper div.main-content section:nth-child(odd) .section-image-container {
    order: 2;
  }
  div.product-page div.content-wrapper div.main-content section:nth-child(odd) .section-text-container {
    order: 1;
  }
  div.product-page div.content-wrapper div.main-content section:nth-child(even) .section-image-container {
    order: 2;
  }
  div.product-page div.content-wrapper div.main-content section:nth-child(even) .section-text-container {
    order: 1;
  }
}
div.article-page {
  padding: 200px 0px 100px 0px;
  display: flex;
  flex-direction: column;
  align-items: center;
}
div.article-page h2.title {
  font-family: "GeosansLight";
  font-size: 27px;
  text-align: center;
  margin-bottom: 50px;
  color: #757575;
}
div.article-page article {
  font-size: 19px;
  white-space: pre-wrap;
  max-width: 800px;
}
@media (max-width: 768px) {
  div.article-page {
    padding: 200px 42px 100px 42px;
  }
}
div.apply-page {
  padding: 180px 0px 100px 0px;
  display: flex;
  flex-direction: column;
  align-items: center;
}
div.apply-page h2.title {
  font-family: "GeosansLight";
  font-size: 27px;
  text-align: center;
  margin-bottom: 50px;
  color: #757575;
}
div.apply-page article.main-text {
  font-size: 19px;
  white-space: pre-wrap;
  max-width: 800px;
  margin-bottom: 100px;
}
div.about-page {
  display: flex;
  flex-direction: column;
  padding: 200px 100px 100px 100px;
}
div.about-page article {
  display: flex;
  padding: 0 0 100px 0;
}
div.about-page article ul.info-list {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}
div.about-page article ul.info-list li {
  display: flex;
  align-items: flex-start;
  margin-bottom: 10px;
  /* Space between items */
}
div.about-page article ul.info-list li label {
  width: 132px;
  white-space: nowrap;
  flex-shrink: 0;
  text-wrap: wrap;
}
div.about-page article ul.info-list li p {
  text-align: left;
  margin: 0;
}
@media (max-width: 768px) {
  div.article-page.about-page {
    padding: 120px 60px 62px 60px;
  }
  div.article-page.about-page article ul.info-list li {
    display: flex;
    align-items: flex-start;
    text-align: left;
  }
  div.article-page.about-page article ul.info-list li label {
    width: 97px;
    margin-right: 10px;
    text-align: left;
    flex-shrink: 0;
    text-wrap: wrap;
    font-size: 15px;
  }
  div.article-page.about-page article ul.info-list li p {
    width: 100%;
    text-align: left;
  }
}
div.ir-page {
  padding: 180px 0px 100px 0px;
  display: flex;
  flex-direction: column;
  align-items: center;
}
div.ir-page h2.title {
  font-family: "GeosansLight";
  font-size: 27px;
  text-align: center;
  margin-bottom: 50px;
  color: #757575;
}
div.ir-page article.main-text {
  font-size: 19px;
  white-space: pre-wrap;
  max-width: 800px;
  margin-bottom: 40px;
}
div#blognews.main-container div.main-content {
  display: flex;
  flex-direction: column;
  align-items: center;
  background-color: #FFF;
  padding: 130px 0px 70px 0px;
}
div#blognews.main-container div.main-content ul.newslist {
  width: 68vw;
  margin-bottom: 49px;
}
div#blognews.main-container div.main-content ul.newslist li.news {
  padding-bottom: 0px;
  padding-top: 20px;
  border-bottom: 1px solid #ebebeb;
}
div#blognews.main-container div.main-content ul.newslist li.news div.container {
  padding: 0 20px 0 20px;
  margin-bottom: 20px;
  max-width: 1040px;
}
div#blognews.main-container div.main-content ul.newslist li.news div.container p.date {
  font-size: 1em;
  font-weight: 600;
  padding: 5px 0 5px 0;
}
div#blognews.main-container div.main-content ul.newslist li.news div.container h2.title {
  font-size: 1.4em;
  font-weight: 500;
}
div#blognews.main-container div.main-content ul.newslist li.news div.container p.content {
  padding: 21px 5px 10px 1px;
  color: #454545;
  font-size: 0.9em;
}
div#blognews.main-container div.main-content ul.newslist li.news div.container div.news-image-container figure.news-id-2023-5-26 {
  display: inline-block;
  background: url('/img/blog/neuravoice/NV_PV_v2_Title-4K.png') no-repeat center / contain;
  vertical-align: middle;
}
@media screen and (min-width: 600px) {
  div#blognews.main-container div.main-content ul.newslist li.news div.container div.news-image-container figure.news-id-2023-5-26 {
    width: 600px;
    height: 348px;
  }
}
div#blognews.main-container div.main-content ul.newslist li.news div.container div.news-image-container figure.news-id-2021-8-13 {
  display: inline-block;
  background: url('/img/blog/NeuraVoiceDiagram.png') no-repeat;
  background-image: url("/img/blog/NeuraVoiceDiagram.png");
  background-repeat: no-repeat;
  background-size: contain;
  vertical-align: middle;
}
@media screen and (min-width: 600px) {
  div#blognews.main-container div.main-content ul.newslist li.news div.container div.news-image-container figure.news-id-2021-8-13 {
    width: 600px;
    height: 348px;
  }
}
@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) {
  div#blognews.main-container div.main-content ul.newslist li.news div.container div.news-image-container figure.news-id-2021-8-13 {
    background-image: url("/img/blog/NeuraVoiceDiagram.png");
  }
}
div#blognews.main-container div.main-content ul.newslist li.news div.container div.news-image-container figure.news-id-2021-3-7 {
  display: inline-block;
  background: url('/img/blog/tomii_nagasaki.png') no-repeat;
  background-image: url("/img/blog/tomii_nagasaki.png");
  background-repeat: no-repeat;
  background-size: contain;
  vertical-align: middle;
}
@media screen and (min-width: 600px) {
  div#blognews.main-container div.main-content ul.newslist li.news div.container div.news-image-container figure.news-id-2021-3-7 {
    width: 600px;
    height: 348px;
  }
}
@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) {
  div#blognews.main-container div.main-content ul.newslist li.news div.container div.news-image-container figure.news-id-2021-3-7 {
    background-image: url("/img/blog/tomii_nagasaki.png");
  }
}
div#blognews.main-container div.main-content ul.newslist li.news div.container div.news-image-container figure.news-id-2021-2-20 {
  display: inline-block;
  background: url('/img/blog/ktn_news.png') no-repeat;
  background-image: url("/img/blog/ktn_news.png");
  background-repeat: no-repeat;
  background-size: contain;
  vertical-align: middle;
}
@media screen and (min-width: 600px) {
  div#blognews.main-container div.main-content ul.newslist li.news div.container div.news-image-container figure.news-id-2021-2-20 {
    width: 600px;
    height: 348px;
  }
}
@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) {
  div#blognews.main-container div.main-content ul.newslist li.news div.container div.news-image-container figure.news-id-2021-2-20 {
    background-image: url("/img/blog/ktn_news.png");
  }
}
div#blognews.main-container div.main-content ul.newslist li.news div.container div.news-image-container figure.news-id-2021-2-24 {
  display: inline-block;
  background: url('/img/blog/citywalk_expo.png') no-repeat;
  background-image: url("/img/blog/citywalk_expo.png");
  background-repeat: no-repeat;
  background-size: contain;
  vertical-align: middle;
}
@media screen and (min-width: 600px) {
  div#blognews.main-container div.main-content ul.newslist li.news div.container div.news-image-container figure.news-id-2021-2-24 {
    width: 600px;
    height: 348px;
  }
}
@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) {
  div#blognews.main-container div.main-content ul.newslist li.news div.container div.news-image-container figure.news-id-2021-2-24 {
    background-image: url("/img/blog/citywalk_expo.png");
  }
}
div#blognews.main-container div.main-content ul.newslist li.news div.container div.news-image-container figure.news-id-2021-2-14 {
  display: inline-block;
  background: url('/img/blog/dejima_panel.png') no-repeat;
  background-image: url("/img/blog/dejima_panel.png");
  background-repeat: no-repeat;
  background-size: contain;
  vertical-align: middle;
}
@media screen and (min-width: 600px) {
  div#blognews.main-container div.main-content ul.newslist li.news div.container div.news-image-container figure.news-id-2021-2-14 {
    width: 600px;
    height: 348px;
  }
}
@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) {
  div#blognews.main-container div.main-content ul.newslist li.news div.container div.news-image-container figure.news-id-2021-2-14 {
    background-image: url("/img/blog/dejima_panel.png");
  }
}
div#blognews.main-container div.main-content ul.newslist li.news div.container div.news-image-container figure.news-id-2020-11-10 {
  display: inline-block;
  background: url('/img/blog/citywalk_nagasaki.png') no-repeat;
  background-image: url("/img/blog/citywalk_nagasaki.png");
  background-repeat: no-repeat;
  background-size: contain;
  vertical-align: middle;
}
@media screen and (min-width: 600px) {
  div#blognews.main-container div.main-content ul.newslist li.news div.container div.news-image-container figure.news-id-2020-11-10 {
    width: 600px;
    height: 348px;
  }
}
@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) {
  div#blognews.main-container div.main-content ul.newslist li.news div.container div.news-image-container figure.news-id-2020-11-10 {
    background-image: url("/img/blog/citywalk_nagasaki.png");
  }
}
div#blognews.main-container div.main-content ul.newslist li.news div.container div.news-image-container figure.news-id-2020-03-04 {
  display: inline-block;
  background: url('/img/blog/ciphernet-image.png') no-repeat;
  background-image: url("/img/blog/ciphernet-image.png");
  background-repeat: no-repeat;
  background-size: contain;
  vertical-align: middle;
}
@media screen and (min-width: 600px) {
  div#blognews.main-container div.main-content ul.newslist li.news div.container div.news-image-container figure.news-id-2020-03-04 {
    width: 600px;
    height: 348px;
  }
}
@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) {
  div#blognews.main-container div.main-content ul.newslist li.news div.container div.news-image-container figure.news-id-2020-03-04 {
    background-image: url("/img/blog/ciphernet-image.png");
  }
}
div#blognews.main-container div.main-content ul.newslist li.news div.container div.news-image-container figure.news-id-2020-02-07 {
  display: inline-block;
  background: url('/img/blog/expo.jpg') no-repeat;
  background-image: url("/img/blog/expo.jpg");
  background-repeat: no-repeat;
  background-size: contain;
  vertical-align: middle;
}
@media screen and (min-width: 600px) {
  div#blognews.main-container div.main-content ul.newslist li.news div.container div.news-image-container figure.news-id-2020-02-07 {
    width: 600px;
    height: 348px;
  }
}
@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) {
  div#blognews.main-container div.main-content ul.newslist li.news div.container div.news-image-container figure.news-id-2020-02-07 {
    background-image: url("/img/blog/expo.jpg");
  }
}
div#blognews.main-container div.main-content ul.newslist li.news div.container div.news-image-container figure.news-id-2020-01-20 {
  display: inline-block;
  background: url('/img/blog/citywalkbrochure.png') no-repeat;
  background-image: url("/img/blog/citywalkbrochure.png");
  background-repeat: no-repeat;
  background-size: contain;
  vertical-align: middle;
}
@media screen and (min-width: 600px) {
  div#blognews.main-container div.main-content ul.newslist li.news div.container div.news-image-container figure.news-id-2020-01-20 {
    width: 600px;
    height: 348px;
  }
}
@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) {
  div#blognews.main-container div.main-content ul.newslist li.news div.container div.news-image-container figure.news-id-2020-01-20 {
    background-image: url("/img/blog/citywalkbrochure.png");
  }
}
div#blognews.main-container div.main-content ul.newslist li.news div.container div.readmore-container {
  padding: 0px 0px 16px 0px;
}
div#blognews.main-container div.main-content ul.newslist li.news div.container div.readmore-container span.readmore {
  float: right;
  font-size: 0.9em;
}
div#blognews.main-container div.main-content ul.newslist li.news div.container div.readmore-container span.readmore a {
  text-decoration: none;
  color: #326894;
  -webkit-transition: color 0.5s cubic-bezier(0.24, 0.8, 0.55, 0.94) 0s;
  -moz-transition: color 0.5s cubic-bezier(0.24, 0.8, 0.55, 0.94) 0s;
  -o-transitino: color 0.5s cubic-bezier(0.24, 0.8, 0.55, 0.94) 0s;
  transition: color 0.5s cubic-bezier(0.24, 0.8, 0.55, 0.94) 0s;
}
div#blognews.main-container div.main-content ul.newslist li.news div.container div.readmore-container span.readmore a:hover {
  color: #aaa;
}
div#blognews.main-container div.main-content div.pagination a {
  padding: 10px 20px;
  border: 1px solid;
  transition: all 0.4s cubic-bezier(0.65, 0, 0.34, 1);
}
div#blognews.main-container div.main-content div.pagination a:hover {
  color: #326894;
  background-color: #bddaf4;
  border: 1px solid #326894;
}
div#blognews.main-container div.main-content div.pagination a.disabled {
  display: none;
  cursor: not-allowed;
  color: #aaa;
}
div#blognews.main-container div.main-content div.pagination a:not(last-child) {
  margin-right: 28px;
}
@media (max-width: 768px) {
  div#blognews.main-container div.main-content {
    padding: 100px 30px 30px 30px;
  }
  div#blognews.main-container div.main-content ul.newslist {
    width: auto;
  }
}
div.blog-news-article a {
  color: #326894;
}
div.blog-news-article div.main-content {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 130px 0 130px 0;
}
div.blog-news-article div.main-content article.article {
  padding-bottom: 10px;
  padding-top: 20px;
  border-bottom: 1px solid #b8b8b8;
  max-width: 800px;
}
div.blog-news-article div.main-content article.article div.container {
  padding: 0 20px 0 20px;
  margin-bottom: 20px;
}
div.blog-news-article div.main-content article.article div.container span.back a {
  text-decoration: none;
}
div.blog-news-article div.main-content article.article div.container p.date {
  font-size: 1.1em;
  font-weight: 500;
  padding: 5px 0 5px 0;
}
div.blog-news-article div.main-content article.article div.container h2.title {
  margin: 0px 0px 10px 0px;
  font-size: 32px;
  font-weight: 1000;
}
div.blog-news-article div.main-content article.article div.container h3 {
  font-weight: bold;
}
div.blog-news-article div.main-content article.article div.container div.main-text {
  padding: 21px 5px 10px 1px;
  color: #000;
}
div.blog-news-article div.main-content article.article div.container div.main-text ul li {
  font-weight: 600;
}
div.blog-news-article div.main-content article.article div.container video.news-video {
  display: block;
  margin: 0 auto;
  width: 560px;
  max-width: 100%;
}
div.blog-news-article div.main-content article.article div.container span.contact-mail {
  font-weight: 600;
}
div.blog-news-article div.main-content article.article div.container div.back-container {
  padding: 0px 0px 16px 0px;
}
div.blog-news-article div.main-content article.article div.container div.back-container span.back {
  float: right;
  font-size: 0.9em;
}
div.blog-news-article div.main-content article.article div.container div.back-container span.back a {
  text-decoration: none;
  color: #326894;
  -webkit-transition: color 0.5s cubic-bezier(0.24, 0.8, 0.55, 0.94) 0s;
  -moz-transition: color 0.5s cubic-bezier(0.24, 0.8, 0.55, 0.94) 0s;
  -o-transitino: color 0.5s cubic-bezier(0.24, 0.8, 0.55, 0.94) 0s;
  transition: color 0.5s cubic-bezier(0.24, 0.8, 0.55, 0.94) 0s;
}
div.blog-news-article div.main-content article.article div.container div.back-container span.back a:hover {
  color: #aaa;
}
div.blog-news-article.talk div.main-content article.article div.container h4.guest {
  font-weight: 600;
  font-size: 18px;
}
div.blog-news-article.talk div.main-content article.article div.container div.main-text {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-start;
}
div.blog-news-article.talk div.main-content article.article div.container div.main-text span.intro {
  font-size: 18px;
  padding: 23px 0px 42px 0px;
}
div.blog-news-article.talk div.main-content article.article div.container div.main-text div.conversation-block div.conversation-line {
  margin-bottom: 22px;
  font-size: 18px;
}
div.blog-news-article.talk div.main-content article.article div.container div.main-text div.conversation-block div.conversation-line.head {
  margin-top: 38px;
  margin-bottom: 41px;
}
div.blog-news-article.talk div.main-content article.article div.container div.main-text div.conversation-block div.conversation-line.footnote {
  margin-top: 42px;
}
div.blog-news-article.talk div.main-content article.article div.container div.main-text div.conversation-block div.conversation-line h5.head {
  font-size: 35px;
  color: #000000;
  margin: 35px 0 15px 0;
  font-weight: 700;
  padding: 8px 0 8px 0px;
  clear: both;
  line-height: 1.5;
}
div.blog-news-article.talk div.main-content article.article div.container div.main-text div.conversation-block div.conversation-line span.conversation-speaker {
  font-weight: 600;
  margin-right: 18px;
}
div.blog-news-article.talk div.main-content article.article div.container div.main-text div.conversation-block div.conversation-line div.footnote-block {
  font-size: 14px;
}
div.blog-news-article.talk div.main-content article.article div.container div.main-text div.conversation-block div.conversation-line div.image-container p.caption {
  font-size: 12px;
}
div.blog-news-article.talk div.main-content article.article div.container div.main-text div.profile {
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  padding: 44px 0 0 0;
}
div.blog-news-article.talk div.main-content article.article div.container div.main-text div.profile img {
  width: 107px;
  margin-right: 28px;
}
article[data-news-id="2020-03-04"] figure.news-id-2020-03-04 {
  display: inline-block;
}
article[data-news-id="2020-02-07"] figure.news-id-2020-02-07 {
  display: inline-block;
}
article[data-news-id="2020-02-07"] button.download-button {
  border: none;
  display: inline-block;
  padding: 8px 16px;
  border-radius: 5px;
  vertical-align: middle;
  overflow: hidden;
  text-decoration: none;
  text-align: center;
  cursor: pointer;
  white-space: nowrap;
  background-color: #326894;
}
article[data-news-id="2020-02-07"] button.download-button a.download-link {
  font-size: 1.2em;
  font-weight: 500;
  color: #FFF;
  text-decoration: none;
}
article[data-news-id="2020-02-07"] button:hover {
  background-color: #000;
  -webkit-transition: color 0.5s cubic-bezier(0.24, 0.8, 0.55, 0.94) 0s;
  -moz-transition: color 0.5s cubic-bezier(0.24, 0.8, 0.55, 0.94) 0s;
  -o-transitino: color 0.5s cubic-bezier(0.24, 0.8, 0.55, 0.94) 0s;
  transition: color 0.5s cubic-bezier(0.24, 0.8, 0.55, 0.94) 0s;
}
article[data-news-id="2020-01-20"] figure.news-id-2020-01-20 {
  display: inline-block;
}
@media screen and (max-width: 1176px) {
  section.main-content:has(> article[data-news-id="2023-05-26"]) {
    padding: 1em;
  }
}
@media screen and (max-width: 1175px) {
  article[data-news-id="2023-05-26"] div.container {
    max-width: 900px;
    margin: auto;
    padding: 0 !important;
  }
}
article[data-news-id="2023-05-26"] div.container h3.title {
  font-size: 1.5em;
  font-weight: 400 !important;
  margin: 2em 0 1em 0;
}
article[data-news-id="2023-05-26"] div.container p.description {
  margin-bottom: 1.6rem;
}
article[data-news-id="2023-05-26"] div.container section.availability p {
  font-size: 1.1em;
}
article[data-news-id="2023-05-26"] div.container section.availability p sup.annotation-ref {
  font-size: 0.6em;
}
article[data-news-id="2023-05-26"] div.container section.availability p.description {
  margin-bottom: 1.6rem;
}
article[data-news-id="2023-05-26"] div.container section.availability ul.logos {
  display: flex;
  justify-content: left;
  align-items: center;
}
article[data-news-id="2023-05-26"] div.container section.availability ul.logos li.logo.mac img {
  width: 7em;
}
article[data-news-id="2023-05-26"] div.container section.availability ul.logos li.logo.linux {
  margin-left: 4em;
}
article[data-news-id="2023-05-26"] div.container section.availability ul.logos li.logo.linux img.linux {
  width: 10em;
}
article[data-news-id="2023-05-26"] div.container section.availability ul.logos li.logo.android {
  margin-left: 2em;
}
article[data-news-id="2023-05-26"] div.container section.availability ul.logos li.logo.android img.android {
  width: 3.5em;
}
article[data-news-id="2023-05-26"] div.container section.availability p.annotation {
  text-align: right;
  font-size: 0.8em;
  color: #aaa;
  margin: 1em 0 1em 0;
}
article[data-news-id="2023-05-26"] div.container section.price div.button-panel {
  display: none;
}
article[data-news-id="2023-05-26"] div.container section.price div.price-table {
  display: flex;
  flex-direction: row;
}
article[data-news-id="2023-05-26"] div.container section.price div.price-table div.plan-column {
  flex: 1;
  border-left: 1px solid #FFF;
  display: flex;
  flex-direction: column;
}
article[data-news-id="2023-05-26"] div.container section.price div.price-table div.plan-column div.pile {
  min-height: 40px;
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center;
}
article[data-news-id="2023-05-26"] div.container section.price div.price-table div.plan-column div.pile img.check {
  width: 15px;
}
article[data-news-id="2023-05-26"] div.container section.price div.price-table div.plan-column div.pile:nth-child(odd):not(.plan-name) {
  background-color: #FFF;
}
article[data-news-id="2023-05-26"] div.container section.price div.price-table div.plan-column div.pile:nth-child(even):not(.plan-name) {
  background-color: #f1f6f8;
}
article[data-news-id="2023-05-26"] div.container section.price div.price-table div.plan-column div.pile.plan-name {
  font-weight: bold;
}
article[data-news-id="2023-05-26"] div.container section.price div.price-table div.plan-column div.pile.price {
  min-height: 160px;
}
article[data-news-id="2023-05-26"] div.container section.price div.price-table div.plan-column div.pile.features {
  min-height: 50px;
}
article[data-news-id="2023-05-26"] div.container section.price div.price-table div.plan-column div.pile.features ul li.feature {
  font-weight: normal;
}
article[data-news-id="2023-05-26"] div.container section.price div.price-table div.plan-column.label div.pile:not(:first-child) {
  border-left: 1px solid #f1f6f8;
  border-bottom: 1px solid #f1f6f8;
}
article[data-news-id="2023-05-26"] div.container section.price div.price-table div.plan-column.single,
article[data-news-id="2023-05-26"] div.container section.price div.price-table div.plan-column.small-business,
article[data-news-id="2023-05-26"] div.container section.price div.price-table div.plan-column.enterprise {
  margin-left: 1px;
  border-left: 1px solid #f1f6f8;
  border-bottom: 1px solid #f1f6f8;
}
article[data-news-id="2023-05-26"] div.container section.price div.price-table div.plan-column.single div.pile.price,
article[data-news-id="2023-05-26"] div.container section.price div.price-table div.plan-column.small-business div.pile.price,
article[data-news-id="2023-05-26"] div.container section.price div.price-table div.plan-column.enterprise div.pile.price {
  display: flex;
  flex-direction: column;
  padding: 0.1em 0;
  padding-top: 1em;
}
article[data-news-id="2023-05-26"] div.container section.price div.price-table div.plan-column.single div.pile.price div.price-container span.value,
article[data-news-id="2023-05-26"] div.container section.price div.price-table div.plan-column.small-business div.pile.price div.price-container span.value,
article[data-news-id="2023-05-26"] div.container section.price div.price-table div.plan-column.enterprise div.pile.price div.price-container span.value {
  font-size: 1.4em;
  font-weight: bold;
}
article[data-news-id="2023-05-26"] div.container section.price div.price-table div.plan-column.single div.pile.price div.price-container span.unit,
article[data-news-id="2023-05-26"] div.container section.price div.price-table div.plan-column.small-business div.pile.price div.price-container span.unit,
article[data-news-id="2023-05-26"] div.container section.price div.price-table div.plan-column.enterprise div.pile.price div.price-container span.unit {
  font-size: 0.7em;
  font-weight: bold;
}
article[data-news-id="2023-05-26"] div.container section.price div.price-table div.plan-column.single div.pile.price span.annotation,
article[data-news-id="2023-05-26"] div.container section.price div.price-table div.plan-column.small-business div.pile.price span.annotation,
article[data-news-id="2023-05-26"] div.container section.price div.price-table div.plan-column.enterprise div.pile.price span.annotation {
  font-size: 0.7em;
  max-width: 56%;
  margin-top: 0.2em;
}
article[data-news-id="2023-05-26"] div.container section.price div.price-table div.plan-column.single div.pile.price div.cta,
article[data-news-id="2023-05-26"] div.container section.price div.price-table div.plan-column.small-business div.pile.price div.cta,
article[data-news-id="2023-05-26"] div.container section.price div.price-table div.plan-column.enterprise div.pile.price div.cta {
  display: inline-block;
  margin-top: auto;
}
article[data-news-id="2023-05-26"] div.container section.price div.price-table div.plan-column.single div.pile.price div.cta a.button,
article[data-news-id="2023-05-26"] div.container section.price div.price-table div.plan-column.small-business div.pile.price div.cta a.button,
article[data-news-id="2023-05-26"] div.container section.price div.price-table div.plan-column.enterprise div.pile.price div.cta a.button {
  display: inline-block;
  color: #000;
  text-decoration: none;
  margin: 1em;
  padding: 0.9em 2em;
  font-size: 0.8em;
  border: 1px solid #c7d9e2;
  border-radius: 2px;
}
article[data-news-id="2023-05-26"] div.container section.price div.price-table div.plan-column.single div.pile.minimum-accounts,
article[data-news-id="2023-05-26"] div.container section.price div.price-table div.plan-column.small-business div.pile.minimum-accounts,
article[data-news-id="2023-05-26"] div.container section.price div.price-table div.plan-column.enterprise div.pile.minimum-accounts {
  font-size: 1.2em;
}
article[data-news-id="2023-05-26"] div.container section.price div.price-table div.plan-column.single div.pile.features,
article[data-news-id="2023-05-26"] div.container section.price div.price-table div.plan-column.small-business div.pile.features,
article[data-news-id="2023-05-26"] div.container section.price div.price-table div.plan-column.enterprise div.pile.features {
  text-align: left;
  align-items: flex-start;
  padding: 0.3em;
}
article[data-news-id="2023-05-26"] div.container section.price div.price-table div.plan-column.single div.plan-name {
  background-color: #e1eaed;
}
article[data-news-id="2023-05-26"] div.container section.price div.price-table div.plan-column.small-business div.plan-name {
  background-color: #d5e0e4;
}
article[data-news-id="2023-05-26"] div.container section.price div.price-table div.plan-column.enterprise div.plan-name {
  background-color: #c6d9e2;
}
article[data-news-id="2023-05-26"] div.container section.price div.price-table div.plan-column.enterprise div.pile.price span.annotation {
  padding: 1.5em 0 1em 0;
}
@media (max-width: 768px) {
  article[data-news-id="2023-05-26"] div.container section.price div.button-panel {
    display: flex;
    justify-content: space-between;
    margin-bottom: 1em;
  }
  article[data-news-id="2023-05-26"] div.container section.price div.button-panel .plan-button {
    border: 1px solid #333;
    border-radius: 3px;
    padding: 0.5em;
    cursor: pointer;
    color: #333;
    text-align: center;
    margin: 0 0.5em;
    flex: 1;
    display: flex;
    justify-content: center;
    align-items: center;
  }
  article[data-news-id="2023-05-26"] div.container section.price div.button-panel .plan-button.selected {
    color: blue;
    border-color: blue;
  }
  article[data-news-id="2023-05-26"] div.container section.price div.price-table div.plan-column.label div.pile {
    font-size: 0.7em;
  }
  article[data-news-id="2023-05-26"] div.container section.price div.price-table div.plan-column.label div.pile.dedicated {
    font-size: 0.7em;
  }
  article[data-news-id="2023-05-26"] div.container section.price div.price-table div.plan-column.label div.pile.customize-ui {
    font-size: 0.7em;
  }
  article[data-news-id="2023-05-26"] div.container section.price div.price-table div.plan-column:not(.label) {
    display: none;
    min-width: 70%;
    width: 100%;
    max-width: 100%;
  }
  article[data-news-id="2023-05-26"] div.container section.price div.price-table div.plan-column.show:not(.label) {
    display: flex;
  }
}
@media screen and (min-width: 400px) and (max-width: 750px) {
  body section.main-content {
    padding: 28px 30px 30px 30px;
  }
  body footer section.footer-contents div.footer-contents-top div.top-right ul.contents-list {
    margin-right: 20px;
  }
}
@media screen and (max-width: 400px) {
  body section.main-content {
    padding: 28px 30px 30px 30px;
  }
  body footer section.footer-contents div.footer-contents-top div.top-right ul.contents-list {
    margin-right: 20px;
  }
}
/* Example transition variable */
/* Container for the entire page */
div#NNTM_top {
  /* =======================
       HEADER
    ======================= */
  font-family: 'Roboto', sans-serif;
  /* =======================
       EFFECTS
    ======================= */
  /* =======================
       INTRO
    ======================= */
  /* =======================
       DESIGN
    ======================= */
  /* =======================
       HIGH FIDELITY
    ======================= */
  /* =======================
       DOWNLOAD
    ======================= */
  /* =======================
       FAQ
    ======================= */
}
div#NNTM_top h3.section_copy {
  font-size: 42px;
  font-weight: 900;
}
div#NNTM_top .description_text {
  font-family: Arial, sans-serif;
}
div#NNTM_top div.section {
  padding: 120px 60px;
  /* Double the previous 60px => 120px top/bottom */
}
div#NNTM_top div.header {
  height: 80vh;
  position: relative;
  background: url('/img/NNTM/top/main_noedit2600.jpg') center center / cover no-repeat;
  color: #fff;
  overflow: hidden;
  /* Black translucent overlay behind the content */
  /* Make sure content is on top of overlay */
  /* Header head: Olivewreath & Logo side by side, right-aligned */
  /* Main content within the header */
}
div#NNTM_top div.header div.header_overlay {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(0, 0, 0, 0.5);
  z-index: 1;
  /* Ensure overlay is behind text/content */
  pointer-events: none;
}
div#NNTM_top div.header > * {
  position: relative;
  z-index: 2;
}
div#NNTM_top div.header div.header_head {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  padding: 20px;
  z-index: 100;
  /* Olive wreath & logo images */
}
div#NNTM_top div.header div.header_head div.lang-selector {
  margin-right: 27px;
  font-family: Arial, sans-serif;
}
div#NNTM_top div.header div.header_head img.header_olivewreath,
div#NNTM_top div.header div.header_head img.header_logo {
  height: 60px;
  margin-left: 20px;
}
div#NNTM_top div.header div.header_main {
  /* Switch to a row to align main_left and main_right horizontally */
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: flex-start;
  padding: 40px 60px;
  min-height: 35vh;
  /* Left column */
  /* Right column */
  /* Bottom area (trademark text) */
}
div#NNTM_top div.header div.header_main div.main_left {
  display: flex;
  flex-direction: column;
  width: 50%;
  /* Adjust as needed */
  min-height: 40vh;
  justify-content: center;
  height: 100%;
}
div#NNTM_top div.header div.header_main div.main_left div.container {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  /* Learn More button: fixed width & reduced height */
}
div#NNTM_top div.header div.header_main div.main_left div.container h1.header_copy_sub {
  font-size: 22px;
  font-weight: 1000;
  margin: 0 0 38px;
}
div#NNTM_top div.header div.header_main div.main_left div.container img.main_logo {
  width: 278px;
  max-width: 100%;
  margin-bottom: 40px;
}
div#NNTM_top div.header div.header_main div.main_left div.container button.learn-more {
  position: relative;
  overflow: hidden;
  width: 175px;
  height: 47px;
  /* About half of original vertical space */
  background: rgba(255, 255, 255, 0.2);
  backdrop-filter: blur(2px);
  border: none;
  font-size: 14px;
  /* px-based */
  color: #fff;
  cursor: pointer;
  transition: opacity 0.3s cubic-bezier(0.65, 0, 0.34, 1);
  text-align: center;
  /* Center the text vertically */
  line-height: 40px;
}
div#NNTM_top div.header div.header_main div.main_left div.container button.learn-more span.button_text {
  transition: all 0.3s cubic-bezier(0.65, 0, 0.34, 1);
  /* No extra margin needed if line-height is used */
}
div#NNTM_top div.header div.header_main div.main_left div.container button.learn-more:hover {
  opacity: 0.9;
}
div#NNTM_top div.header div.header_main div.main_right {
  display: flex;
  align-items: center;
  width: 45%;
  /* Adjust as needed */
  min-height: 40vh;
}
div#NNTM_top div.header div.header_main div.main_right h2.header_copy_main {
  font-size: 41px;
  font-weight: 800;
  margin: 0;
}
div#NNTM_top div.header div.header_main div.header_bottom {
  /* If needed, position it differently or keep it hidden/commented out */
  margin-top: 20px;
}
div#NNTM_top div.effects {
  background: #bfbfba;
}
div#NNTM_top div.effects div.effects_content {
  max-width: 1200px;
  margin: 0 auto;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  gap: 20px;
  padding: 24px 40px;
  /* Individual block */
}
div#NNTM_top div.effects div.effects_content div.effect_block {
  display: flex;
  flex-direction: column;
  width: 26%;
}
div#NNTM_top div.effects div.effects_content div.effect_block div.effect_main_text {
  display: flex;
  color: #30302d;
  font-size: 19px;
  font-weight: 1000;
  line-height: 1.2;
  min-height: 52px;
  overflow: hidden;
  align-items: center;
  margin-bottom: 6px;
}
div#NNTM_top div.effects div.effects_content div.effect_block div.effect_image_wrapper {
  position: relative;
  /* Make the image smaller than 100% */
  width: 100%;
}
div#NNTM_top div.effects div.effects_content div.effect_block div.effect_image_wrapper .effect_image {
  margin: 0 auto;
  display: block;
}
div#NNTM_top div.effects div.effects_content div.effect_block div.effect_image_wrapper .effect_overlay {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(0, 0, 0, 0.3);
  /* More transparent black */
  /* If subtext is at bottom, place it accordingly */
  display: flex;
  align-items: flex-end;
  justify-content: left;
  padding: 15px;
}
div#NNTM_top div.effects div.effects_content div.effect_block div.effect_image_wrapper .effect_overlay .effect_sub_text {
  color: #fff;
  font-weight: bold;
  margin: 0;
  font-size: 19px;
  line-height: 1.3em;
  min-height: 41px;
}
div#NNTM_top div.intro {
  position: relative;
  background: url('/img/NNTM/top/introbg.png') center center / cover no-repeat;
  color: #fff;
  overflow: hidden;
}
div#NNTM_top div.intro div.intro_overlay {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(0, 0, 0, 0.5);
  pointer-events: none;
  z-index: 1;
}
div#NNTM_top div.intro > * {
  position: relative;
  z-index: 2;
}
div#NNTM_top div.intro h3.intro_copy {
  margin-bottom: 60px;
}
div#NNTM_top div.intro p.intro_story {
  font-size: 18px;
  /* Larger */
  margin: 0;
  max-width: 800px;
}
div#NNTM_top div.design {
  background: #000;
  color: #fff;
}
div#NNTM_top div.design h3.design_copy {
  margin-bottom: 20px;
}
div#NNTM_top div.design p.design_description {
  font-size: 18px;
  /* Bigger */
  line-height: 1.6;
  margin-bottom: 50px;
}
div#NNTM_top div.design div.compare_stack {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: flex-start;
}
div#NNTM_top div.design div.compare_stack img.design_compare {
  display: block;
  width: 100%;
  /* A bit bigger than 70% */
  max-width: 50%;
  /* Adjust as needed */
  margin: 0 auto;
}
div#NNTM_top div.high_fidelity {
  position: relative;
  background: url('/img/NNTM/top/highfidelitybg2600.jpg') center center / cover no-repeat;
  color: #fff;
  overflow: hidden;
}
div#NNTM_top div.high_fidelity div.high_fidelity_overlay {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(0, 0, 0, 0.5);
  pointer-events: none;
  z-index: 1;
}
div#NNTM_top div.high_fidelity > * {
  position: relative;
  z-index: 2;
}
div#NNTM_top div.high_fidelity h3.high_fidelity_title {
  margin-bottom: 60px;
}
div#NNTM_top div.high_fidelity div.high_fidelity_content {
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  gap: 30px;
  margin-bottom: 58px;
}
div#NNTM_top div.high_fidelity div.high_fidelity_content div.high_fidelity_description {
  width: 50%;
  font-size: 18px;
  /* Bigger */
  line-height: 1.3;
}
div#NNTM_top div.high_fidelity div.high_fidelity_content img.high_fidelity_image {
  width: 40%;
  /* Reduced (was ~40% flex, can also do a smaller % if needed) */
  max-width: 400px;
  /* Or any fixed max to keep it from growing too large */
  display: block;
}
div#NNTM_top div.high_fidelity p.high_fidelity_caption {
  margin-top: 20px;
  color: #dfdfdf;
  text-align: left;
  font-size: 14px;
  /* Convert to px if you wish, e.g. 14px */
}
div#NNTM_top div.download {
  background: #fff;
  color: #000;
}
div#NNTM_top div.download h3.download_title {
  margin-bottom: 100px;
}
div#NNTM_top div.faq {
  background: #fff;
  color: #000;
  margin-bottom: 400px;
}
div#NNTM_top div.faq h3.faq_title {
  margin-bottom: 60px;
  text-align: center;
}
div#NNTM_top div.faq div.faq_content {
  max-width: 800px;
  margin: 0 auto;
}
div#NNTM_top div.faq div.faq_content div.faq_item {
  margin-bottom: 59px;
}
div#NNTM_top div.faq div.faq_content div.faq_item h4.faq_question {
  font-size: 22px;
  font-weight: 700;
  margin-bottom: 15px;
  color: #30302d;
}
div#NNTM_top div.faq div.faq_content div.faq_item p.faq_answer {
  font-size: 19px;
  line-height: 1.8;
  color: #494949;
  margin: 0;
}
div#NNTM_top div.faq div.faq_content div.faq_item a.faq_related_article {
  font-size: 19px;
  font-weight: 600;
  margin-top: 20px;
  display: block;
}
footer#NNTM_footer {
  font-size: 12px;
}
footer#NNTM_footer .footer-contents-bottom {
  padding: 60px 0 15px 0;
  text-align: right;
}
@media (max-width: 768px) {
  div#NNTM_top {
    font-family: 'Roboto', sans-serif;
  }
  div#NNTM_top h3.section_copy {
    font-size: 33px;
  }
  div#NNTM_top .description_text {
    font-family: 'Arial', sans-serif;
  }
  div#NNTM_top div.section {
    padding: 120px 40px;
  }
  div#NNTM_top div.header {
    height: 90vh;
  }
  div#NNTM_top div.header div.header_main {
    padding: 40px 15px;
  }
  div#NNTM_top div.header div.header_main div.main_left {
    width: 46%;
  }
  div#NNTM_top div.header div.header_main div.main_left h1.header_copy_sub {
    font-size: 15px;
  }
  div#NNTM_top div.header div.header_main div.main_left img.main_logo {
    margin-bottom: 41px;
  }
  div#NNTM_top div.header div.header_main div.main_left button.learn-more {
    width: 141px;
  }
  div#NNTM_top div.header div.header_main div.main_right h2.header_copy_main {
    text-align: right;
    font-size: 34px;
  }
  div#NNTM_top div.effects div.effects_content {
    padding: 24px 29px;
    flex-direction: column;
    justify-content: center;
  }
  div#NNTM_top div.effects div.effects_content div.effect_block {
    width: 100%;
    margin-bottom: 47px;
  }
  div#NNTM_top div.effects div.effects_content div.effect_block div.effect_main_text {
    font-size: 22px;
  }
  div#NNTM_top div.effects div.effects_content div.effect_block div.effect_image_wrapper .effect_overlay .effect_sub_text {
    font-size: 22px;
  }
  div#NNTM_top div.design div.compare_stack {
    flex-direction: column;
  }
  div#NNTM_top div.design div.compare_stack img.design_compare {
    max-width: 100%;
  }
  div#NNTM_top div.design div.compare_stack img.design_compare:not(:last-child) {
    margin-bottom: 43px;
  }
  div#NNTM_top div.high_fidelity div.high_fidelity_content {
    flex-direction: column;
  }
  div#NNTM_top div.high_fidelity div.high_fidelity_content div.high_fidelity_description {
    width: 100%;
  }
  div#NNTM_top div.high_fidelity div.high_fidelity_content img.high_fidelity_image {
    width: 100%;
  }
  div#NNTM_top div.download div.app_banner {
    margin-bottom: 120px;
    padding: 60px 20px;
  }
  div#NNTM_top div.download div.app_banner div.app_banner_wrapper {
    flex-direction: column;
    align-items: center;
  }
  div#NNTM_top div.download div.app_banner div.app_banner_wrapper img.appicon {
    max-width: 213px;
    max-height: 213px;
  }
  div#NNTM_top div.download div.app_banner div.app_banner_wrapper div.app_info {
    margin-top: 0;
  }
  div#NNTM_top div.download div.app_banner div.app_banner_wrapper div.app_info h2.app_name {
    font-size: 33px;
  }
  div#NNTM_top div.download div.app_banner div.app_banner_wrapper div.app_info a.app_install_button {
    margin-top: 14px;
    width: 80px;
  }
  div#NNTM_top div.download div.app_banner div.app_banner_wrapper div.appstore img.appstore_img {
    width: 154px;
  }
  div#NNTM_top div.download div.appdevice img.appdevice_img {
    max-width: 380px;
  }
}
div.app_banner {
  border-radius: 3px;
  background: #e5e5e5;
  /* New background color */
  padding: 40px;
  margin-bottom: 120px;
}
div.app_banner div.app_banner_wrapper {
  display: flex;
  flex-direction: row;
  align-items: center;
  min-height: 220px;
  align-items: stretch;
  gap: 30px;
  /* Left column: app icon */
  /* Center column: app info - left-aligned */
  /* Right column: appstore badge */
}
div.app_banner div.app_banner_wrapper img.appicon {
  width: 300px;
  /* Icon bigger */
  object-fit: cover;
}
div.app_banner div.app_banner_wrapper div.app_info {
  font-family: Arial, sans-serif;
  display: flex;
  flex-direction: column;
  height: 100%;
  align-items: flex-start;
  justify-content: flex-start;
  margin-top: 60px;
}
div.app_banner div.app_banner_wrapper div.app_info h2.app_name {
  font-size: 33px;
  /* Slightly bigger if desired */
  font-weight: 700;
  margin-bottom: 8px;
}
div.app_banner div.app_banner_wrapper div.app_info p.app_subtitle {
  color: #6b6b6b;
  margin: 0;
  font-size: 16px;
  line-height: 1.4;
}
div.app_banner div.app_banner_wrapper div.app_info a.app_install_button {
  display: inline-block;
  background: #007bff;
  color: #fff;
  padding: 6px 23px;
  border-radius: 25px;
  margin-top: 30px;
  text-decoration: none;
  font-size: 16px;
  font-weight: 600;
  transition: background 0.3s cubic-bezier(0.65, 0, 0.34, 1);
}
div.app_banner div.app_banner_wrapper div.app_info a.app_install_button span.install_button_text {
  display: block;
  text-align: center;
}
div.app_banner div.app_banner_wrapper div.app_info a.app_install_button:hover {
  background: #0056b3;
  /* Darker blue on hover */
  text-decoration: none;
}
div.app_banner div.app_banner_wrapper div.appstore {
  display: flex;
  justify-content: center;
  align-items: center;
  width: auto;
}
div.app_banner div.app_banner_wrapper div.appstore img.appstore_img {
  width: 203px;
  display: inline-block;
}
div.appdevice {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
}
div.appdevice img.appdevice_img {
  max-width: 400px;
}
@media (max-width: 768px) {
  div.app_banner {
    margin-bottom: 120px;
    padding: 60px 20px;
  }
  div.app_banner div.app_banner_wrapper {
    flex-direction: column;
    align-items: center;
  }
  div.app_banner div.app_banner_wrapper img.appicon {
    max-width: 213px;
    max-height: 213px;
  }
  div.app_banner div.app_banner_wrapper div.app_info {
    margin-top: 0;
  }
  div.app_banner div.app_banner_wrapper div.app_info h2.app_name {
    font-size: 33px;
  }
  div.app_banner div.app_banner_wrapper div.app_info a.app_install_button {
    margin-top: 14px;
    width: 80px;
  }
  div.app_banner div.app_banner_wrapper div.appstore img.appstore_img {
    width: 154px;
  }
  div.appdevice img.appdevice_img {
    max-width: 380px;
  }
}
div#NNTM_blog div.header {
  width: 100%;
  height: 300px;
  position: relative;
  background: url('/img/NNTM/top/highfidelitybg2600.jpg') center center / cover no-repeat;
  color: #fff;
  overflow: hidden;
  /* Ensure content sits above the overlay */
}
div#NNTM_blog div.header div.header_overlay {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(0, 0, 0, 0.5);
  z-index: 1;
  pointer-events: none;
}
div#NNTM_blog div.header > * {
  position: relative;
  z-index: 2;
}
div#NNTM_blog div.header div.header_head {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  padding: 20px;
  z-index: 100;
  /* Language selector, if needed */
  /* Right-aligned images */
}
div#NNTM_blog div.header div.header_head div.lang-selector {
  margin-right: 27px;
  font-family: Arial, sans-serif;
}
div#NNTM_blog div.header div.header_head img.header_olivewreath,
div#NNTM_blog div.header div.header_head img.header_logo {
  height: 60px;
  margin-left: 20px;
}
div#NNTM_blog div.header div.header_main {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: flex-start;
  padding: 40px 10px;
  min-height: 25vh;
}
div#NNTM_blog div.header div.header_main div.main_left {
  width: 50%;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
div#NNTM_blog div.header div.header_main div.main_left div.container h1.header_copy_sub {
  font-size: 30px;
  font-weight: 800;
  margin: 0 0 28px;
  color: #fff;
}
div#NNTM_blog div.header div.header_main div.main_right {
  width: 40%;
  display: flex;
  align-items: center;
}
div#NNTM_blog div.header div.header_main div.main_right div.header_copy_main {
  font-size: 28px;
  font-weight: 600;
  margin: 0;
  color: #f1f1f1;
}
div#NNTM_blog div.header div.header_main div.header_bottom {
  margin-top: 10px;
}
div#NNTM_blog {
  font-family: "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Geneva, Arial, sans-serif;
  display: flex;
  flex-direction: column;
  align-items: center;
}
div#NNTM_blog div.blog_content article.article {
  text-align: left;
  font-size: 19px;
  max-width: 800px;
  padding: 58px 0;
}
div#NNTM_blog div.blog_content article.article p.article_text {
  margin-bottom: 60px;
  font-weight: 400;
  font-style: normal;
  font-size: 21px;
  line-height: 2;
  letter-spacing: -0.003em;
}
div#NNTM_blog div.blog_content article.article h5.head {
  font-size: 22px;
  font-weight: 700;
  margin-bottom: 11px;
}
div#NNTM_blog div.blog_content article.article div.image-container {
  margin-bottom: 60px;
}
div#NNTM_blog div.blog_content article.article div.image-container p.caption {
  font-size: 16px;
  text-align: center;
}
div#NNTM_blog div.ad_section {
  padding-bottom: 200px;
}
div#NNTM_blog footer {
  width: 100%;
}
@media (max-width: 768px) {
  div#NNTM_blog div.header {
    min-height: 510px;
  }
  div#NNTM_blog div.blog_content article.article {
    padding: 58px 24px;
  }
  div#NNTM_blog footer {
    max-width: 100%;
  }
}
/* privacy_policy.less */
/* Example transition */
/* Container for the entire Privacy Policy page */
div#NNTM_privacy {
  font-family: 'Roboto', sans-serif;
  /* =======================
       HEADER
    ======================= */
  /* =======================
       PRIVACY CONTENT
    ======================= */
}
div#NNTM_privacy .header {
  height: 50vh;
  position: relative;
  background: url('/img/NNTM/top/main_noedit2600.jpg') center center / cover no-repeat;
  color: #fff;
  overflow: hidden;
  /* Ensure content sits above the overlay */
}
div#NNTM_privacy .header .header_overlay {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(0, 0, 0, 0.5);
  z-index: 1;
  pointer-events: none;
}
div#NNTM_privacy .header > * {
  position: relative;
  z-index: 2;
}
div#NNTM_privacy .header .header_head {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  padding: 20px;
  z-index: 100;
  /* Language selector, if needed */
  /* Right-aligned images */
}
div#NNTM_privacy .header .header_head div.lang-selector {
  margin-right: 27px;
  font-family: Arial, sans-serif;
}
div#NNTM_privacy .header .header_head .header_olivewreath,
div#NNTM_privacy .header .header_head .header_logo {
  height: 60px;
  margin-left: 20px;
}
div#NNTM_privacy .header .header_main {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: flex-start;
  padding: 40px 60px;
  min-height: 25vh;
}
div#NNTM_privacy .header .header_main .main_left {
  width: 50%;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
div#NNTM_privacy .header .header_main .main_left .container .header_copy_sub {
  font-size: 24px;
  font-weight: 800;
  margin: 0 0 28px;
  color: #fff;
}
div#NNTM_privacy .header .header_main .main_right {
  width: 40%;
  display: flex;
  align-items: center;
}
div#NNTM_privacy .header .header_main .main_right .header_copy_main {
  font-size: 28px;
  font-weight: 600;
  margin: 0;
  color: #f1f1f1;
}
div#NNTM_privacy .header .header_main .header_bottom {
  margin-top: 10px;
}
div#NNTM_privacy .privacy_content.section {
  background: #fff;
  color: #000;
  padding: 60px;
}
div#NNTM_privacy .privacy_content.section .description_text {
  font-family: Arial, sans-serif;
  font-size: 16px;
  line-height: 1.6;
  color: #333;
}
div#NNTM_privacy .privacy_content.section .description_text .privacy_last_updated {
  font-style: italic;
  margin-bottom: 20px;
  color: #666;
}
div#NNTM_privacy .privacy_content.section .description_text .privacy_intro {
  margin-bottom: 40px;
}
div#NNTM_privacy .privacy_content.section .description_text .privacy_section_title {
  font-size: 22px;
  font-weight: bold;
  margin-top: 40px;
  margin-bottom: 10px;
  color: #30302d;
}
div#NNTM_privacy .privacy_content.section .description_text .privacy_section_body {
  margin-bottom: 20px;
}
/* =======================
   FOOTER
======================= */
footer#NNTM_footer {
  font-size: 12px;
}
footer#NNTM_footer .footer-contents-bottom {
  padding: 40px 0 15px 0;
  text-align: right;
}
/* =======================
   RESPONSIVE (Smartphone)
======================= */
@media (max-width: 768px) {
  div#NNTM_privacy .header {
    height: 60vh;
  }
  div#NNTM_privacy .header .header_main {
    flex-direction: column;
    align-items: flex-start;
    padding: 20px;
  }
  div#NNTM_privacy .header .header_main .main_left {
    width: 100%;
  }
  div#NNTM_privacy .header .header_main .main_left .container .header_copy_sub {
    font-size: 18px;
  }
  div#NNTM_privacy .header .header_main .main_right {
    width: 100%;
    margin-top: 20px;
  }
  div#NNTM_privacy .header .header_main .main_right .header_copy_main {
    font-size: 22px;
    text-align: left;
  }
  div#NNTM_privacy .privacy_content.section {
    padding: 40px 20px;
  }
  div#NNTM_privacy .privacy_content.section .description_text {
    font-size: 15px;
  }
  div#NNTM_privacy .privacy_content.section .description_text .privacy_section_title {
    font-size: 18px;
  }
}
/* Example transition variable */
/* Container for the entire page */
div#truetech-top {
  font-family: 'Roboto', sans-serif;
}
/* ===== TOP MAIN ===== */
div#truetech-top section.top-main {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  height: 68vh;
  padding: 0 50px;
  background: url('/img/truetechjapan/top/topbg.svg') center / cover no-repeat;
}
div#truetech-top section.top-main img.top-logo {
  width: 550px;
  height: auto;
  margin-bottom: 20px;
}
div#truetech-top section.top-main h1.top-main-copy {
  max-width: 820px;
  text-align: center;
  font-size: 30px;
  font-weight: 700;
}
div#truetech-top div.content-wrapper {
  padding: 80px 11%;
}
div#truetech-top div.content-wrapper section.mission,
div#truetech-top div.content-wrapper section.concept,
div#truetech-top div.content-wrapper section.criteria,
div#truetech-top div.content-wrapper section.philosophy,
div#truetech-top div.content-wrapper section.entry {
  margin-bottom: 160px;
}
/* ===== TWO‑COLUMN (Mission / Concept) ===== */
div#truetech-top div.content-wrapper section.mission,
div#truetech-top div.content-wrapper section.concept {
  display: flex;
  justify-content: space-between;
  align-items: stretch;
  gap: 5%;
  /* shared left column */
  /* shared right column (image) */
}
div#truetech-top div.content-wrapper section.mission div.mission-left,
div#truetech-top div.content-wrapper section.concept div.mission-left,
div#truetech-top div.content-wrapper section.mission div.concept-left,
div#truetech-top div.content-wrapper section.concept div.concept-left {
  flex: 1 1 55%;
  display: flex;
  flex-direction: column;
}
div#truetech-top div.content-wrapper section.mission h2.mission-title,
div#truetech-top div.content-wrapper section.concept h2.mission-title,
div#truetech-top div.content-wrapper section.mission h2.concept-title,
div#truetech-top div.content-wrapper section.concept h2.concept-title {
  font-size: 28px;
  margin-bottom: 24px;
  font-weight: 700;
}
div#truetech-top div.content-wrapper section.mission p.mission-description,
div#truetech-top div.content-wrapper section.concept p.mission-description,
div#truetech-top div.content-wrapper section.mission p.concept-description,
div#truetech-top div.content-wrapper section.concept p.concept-description {
  color: #363636;
}
div#truetech-top div.content-wrapper section.mission div.mission-right,
div#truetech-top div.content-wrapper section.concept div.mission-right,
div#truetech-top div.content-wrapper section.mission div.concept-right,
div#truetech-top div.content-wrapper section.concept div.concept-right {
  flex: 0 0 40%;
  display: flex;
  align-items: center;
}
div#truetech-top div.content-wrapper section.mission section.mission img.mission-map,
div#truetech-top div.content-wrapper section.concept section.mission img.mission-map {
  width: 100%;
  height: auto;
}
div#truetech-top div.content-wrapper section.mission div.concept-right div.image-wrapper,
div#truetech-top div.content-wrapper section.concept div.concept-right div.image-wrapper {
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
}
div#truetech-top div.content-wrapper section.mission div.concept-right div.image-wrapper img.concept-image,
div#truetech-top div.content-wrapper section.concept div.concept-right div.image-wrapper img.concept-image {
  width: 167px;
  height: auto;
}
/* ===== CRITERIA ===== */
div#truetech-top div.content-wrapper section.criteria {
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
}
div#truetech-top div.content-wrapper section.criteria h2.criteria-title {
  font-size: 28px;
  margin-bottom: 40px;
  font-weight: 700;
}
div#truetech-top div.content-wrapper section.criteria ul.criteria-list {
  list-style: none;
  padding: 0;
  max-width: 696px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  /* marker line (initially hidden) */
  /* when IntersectionObserver adds .show */
}
div#truetech-top div.content-wrapper section.criteria ul.criteria-list li.criteria-item {
  position: relative;
  margin-bottom: 22px;
  font-size: 22px;
}
div#truetech-top div.content-wrapper section.criteria ul.criteria-list li.criteria-item::after {
  content: "";
  position: absolute;
  left: 23px;
  bottom: 2px;
  width: 0px;
  height: 0.6em;
  background: rgba(234, 212, 119, 0.69);
  z-index: -1;
  transition: width 0.8s cubic-bezier(0.65, 0, 0.34, 1);
}
div#truetech-top div.content-wrapper section.criteria ul.criteria-list li.criteria-item:nth-child(1).show::after {
  width: 500px;
}
div#truetech-top div.content-wrapper section.criteria ul.criteria-list li.criteria-item:nth-child(2).show::after {
  width: 530px;
}
/* ===== ENTRY ===== */
div#truetech-top div.content-wrapper section.entry h2.entry-title {
  text-align: center;
  font-size: 28px;
  margin-bottom: 46px;
  font-weight: 700;
}
div#truetech-top div.content-wrapper section.entry div.entry-main {
  display: flex;
  flex-direction: column;
  align-items: center;
}
div#truetech-top div.content-wrapper section.entry div.entry-main ul.entry-list {
  display: flex;
  flex-direction: column;
  justify-content: center;
  list-style: none;
  margin-bottom: 83px;
  padding: 0;
  gap: 15px;
}
div#truetech-top div.content-wrapper section.entry div.entry-main ul.entry-list li.entry-item {
  display: flex;
  align-items: center;
  gap: 12px;
}
div#truetech-top div.content-wrapper section.entry div.entry-main ul.entry-list li.entry-item img {
  width: 31px;
  height: auto;
}
div#truetech-top div.content-wrapper section.entry div.entry-main ul.entry-list li.entry-item div.entry-text {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 29px;
}
div#truetech-top div.content-wrapper section.entry div.entry-main ul.entry-list li.entry-item div.entry-text h3.entry-item-title {
  font-size: 26px;
  font-weight: 400;
  margin-bottom: 4px;
}
div#truetech-top div.content-wrapper section.entry div.entry-main ul.entry-list li.entry-item div.entry-text p.entry-item-desc {
  font-size: 15px;
  margin: 0;
  color: #363636;
}
div#truetech-top div.content-wrapper section.entry div.entry-main a.entry-button {
  background: #E41E00;
  color: #fff;
  padding: 17px 53px;
  font-size: 14px;
  font-weight: 600;
  border-radius: 2px;
  text-decoration: none;
  transition: opacity 0.3s;
}
div#truetech-top div.content-wrapper section.entry div.entry-main a.entry-button:hover {
  opacity: 0.8;
}
/* ===== PHILOSOPHY ===== */
div#truetech-top div.content-wrapper section.philosophy h2.philosophy-title {
  text-align: center;
  font-size: 28px;
  font-weight: 700;
  margin-bottom: 88px;
}
div#truetech-top div.content-wrapper section.philosophy ul.panels-wrapper {
  display: flex;
  justify-content: center;
  gap: 3%;
  list-style: none;
  padding: 0;
  margin: 0;
}
div#truetech-top div.content-wrapper section.philosophy ul.panels-wrapper li.panel {
  flex: 1 1 0;
  min-width: 180px;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
}
div#truetech-top div.content-wrapper section.philosophy ul.panels-wrapper li.panel img {
  height: 90px;
  margin-bottom: 22px;
}
div#truetech-top div.content-wrapper section.philosophy ul.panels-wrapper li.panel h4 {
  font-size: 17px;
  font-weight: 500;
  max-width: 171px;
}
@media (max-width: 768px) {
  div#truetech-top section.top-main {
    height: 60vh;
  }
  div#truetech-top div.content-wrapper {
    padding: 80px 7%;
  }
  div#truetech-top div.content-wrapper section.mission,
  div#truetech-top div.content-wrapper section.concept,
  div#truetech-top div.content-wrapper section.criteria,
  div#truetech-top div.content-wrapper section.philosophy,
  div#truetech-top div.content-wrapper section.entry {
    margin-bottom: 100px;
  }
  div#truetech-top div.content-wrapper section.mission,
  div#truetech-top div.content-wrapper section.concept {
    flex-direction: column;
  }
  div#truetech-top div.content-wrapper section.mission div.mission-right,
  div#truetech-top div.content-wrapper section.concept div.mission-right,
  div#truetech-top div.content-wrapper section.mission div.concept-right,
  div#truetech-top div.content-wrapper section.concept div.concept-right {
    margin-top: 32px;
  }
  div#truetech-top div.content-wrapper section.criteria ul.criteria-list li.criteria-item::after {
    bottom: 36px;
  }
  div#truetech-top div.content-wrapper section.criteria ul.criteria-list li.criteria-item:nth-child(1).show::after {
    width: 266px;
  }
  div#truetech-top div.content-wrapper section.criteria ul.criteria-list li.criteria-item:nth-child(2).show::after {
    width: 242px;
  }
  div#truetech-top div.content-wrapper section.entry div.entry-main ul.entry-list {
    gap: 30px;
  }
  div#truetech-top div.content-wrapper section.entry div.entry-main ul.entry-list li.entry-item div.entry-text h3.entry-item-title {
    font-size: 19px;
    width: 55px;
  }
  div#truetech-top div.content-wrapper section.philosophy h2.philosophy-title {
    margin-bottom: 61px;
  }
  div#truetech-top div.content-wrapper section.philosophy ul.panels-wrapper {
    flex-direction: column;
    gap: 40px;
  }
  div#truetech-top div.content-wrapper section.philosophy ul.panels-wrapper li.panel {
    margin-bottom: 43px;
  }
}
/* ------------------------------------------------------------------
   about.less – Truetech Japan
------------------------------------------------------------------- */
div#truetech-about,
div#truetech-philosophy {
  /* Full‑height visual with site‑wide background image */
  min-height: 100vh;
  background: url('/img/truetechjapan/top/topbg.svg') center top / cover no-repeat;
  display: flex;
  flex-direction: column;
  align-items: center;
  /* ----------------------------------------------------
       Main textual block
       ---------------------------------------------------- */
}
div#truetech-about div.about-page.main-content,
div#truetech-philosophy div.about-page.main-content {
  width: 100%;
  max-width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 120px 0 200px;
  /* large vertical rhythm */
  /* -------- Title -------- */
  /* -------- Main text -------- */
}
div#truetech-about div.about-page.main-content h2.title,
div#truetech-philosophy div.about-page.main-content h2.title {
  font-family: sans-serif;
  font-size: 24px;
  font-weight: 100;
  margin: 0 0 40px;
  text-align: center;
  color: #757575;
  line-height: 1.15;
}
div#truetech-about div.about-page.main-content article.main-text,
div#truetech-philosophy div.about-page.main-content article.main-text {
  font-family: "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Geneva, Arial, sans-serif;
  font-size: 21px;
  line-height: 2;
  letter-spacing: -0.003em;
  font-weight: 400;
  text-align: left;
  max-width: 800px;
  white-space: pre-wrap;
  /* keep paragraph breaks */
  color: #333;
}
/* ---------------------- Responsive tweaks ---------------------- */
@media (max-width: 768px) {
  div#truetech-about div.about-page.main-content,
  div#truetech-philosophy div.about-page.main-content {
    padding: 100px 24px 160px;
  }
  div#truetech-about div.about-page.main-content h2.title,
  div#truetech-philosophy div.about-page.main-content h2.title {
    font-size: 44px;
  }
  div#truetech-about div.about-page.main-content article.main-text,
  div#truetech-philosophy div.about-page.main-content article.main-text {
    font-size: 19px;
  }
}
@media (max-width: 768px) {
  div#truetech-about div.about-page.main-content,
  div#truetech-philosophy div.about-page.main-content {
    padding: 90px 40px 140px 40px;
  }
  div#truetech-about div.about-page.main-content h2.title,
  div#truetech-philosophy div.about-page.main-content h2.title {
    font-size: 25px;
  }
  div#truetech-about div.about-page.main-content article.main-text,
  div#truetech-philosophy div.about-page.main-content article.main-text {
    font-size: 16px;
  }
}
/* static/truetechjapan/less/privacy.less */
/* ---------- Variables ---------- */
/* ---------- Container ---------- */
div#truetech-privacy {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  /* =====  PRIVACY CONTENT  ===== */
}
div#truetech-privacy div.privacy_content.section {
  background: #fff;
  color: #000;
  padding: 70px 60px;
  max-width: 800px;
}
div#truetech-privacy div.privacy_content.section div.description_text {
  font-family: sans-serif;
  font-size: 16px;
  line-height: 1.65;
  color: #333;
}
div#truetech-privacy div.privacy_content.section div.description_text p {
  font-size: 14px;
}
div#truetech-privacy div.privacy_content.section div.description_text p.privacy_last_updated {
  margin-bottom: 37px;
  color: #666;
  font-size: 12px;
}
div#truetech-privacy div.privacy_content.section div.description_text p.privacy_intro {
  margin-bottom: 12px;
}
div#truetech-privacy div.privacy_content.section div.description_text h3.privacy_section_title {
  font-size: 15px;
  font-weight: 600;
  margin-bottom: 13px;
  color: #262626;
}
div#truetech-privacy div.privacy_content.section div.description_text p.privacy_section_body {
  margin-bottom: 22px;
}
/* ---------- Responsive (≤ smartphone) ---------- */
@media (max-width: 768px) {
  div#truetech-privacy div.privacy_content.section {
    padding: 50px 20px;
  }
  div#truetech-privacy div.privacy_content.section div.description_text {
    font-size: 15px;
  }
  div#truetech-privacy div.privacy_content.section div.description_text h3.privacy_section_title {
    font-size: 19px;
  }
}
header#truetech-header {
  background: #fff;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.06);
}
header#truetech-header div.main-header-container {
  padding: 0 24px;
  height: 66px;
  /* logo height */
  display: flex;
  align-items: center;
  justify-content: space-between;
  /* ——— Left (logo) ——— */
  /* ——— Right side ——— */
  /* ——— Right side ——— */
  /* ——— Mobile hamburger (initially hidden) ——— */
}
header#truetech-header div.main-header-container div.company-logo a {
  display: flex;
  align-items: center;
}
header#truetech-header div.main-header-container div.company-logo a picture {
  display: inline-flex;
}
header#truetech-header div.main-header-container div.company-logo a picture img.header-logo {
  height: 51px;
  width: auto;
}
header#truetech-header div.main-header-container div.header-menu {
  display: flex;
  align-items: center;
  gap: 28px;
  /* menu list */
}
header#truetech-header div.main-header-container div.header-menu div.header-menu-content {
  top: 65px;
  right: 75px;
}
header#truetech-header div.main-header-container div.header-menu div.header-menu-content.open {
  display: block;
}
header#truetech-header div.main-header-container div.header-menu div.header-menu-content ul.header-menu-list {
  display: flex;
  gap: 26px;
}
header#truetech-header div.main-header-container div.header-menu div.header-menu-content ul.header-menu-list li.menu-content a {
  font-size: 10px;
  text-decoration: none;
  color: #444;
  transition: color 0.3s;
}
header#truetech-header div.main-header-container div.header-menu div.header-menu-content ul.header-menu-list li.menu-content a:hover {
  color: #000;
}
header#truetech-header div.main-header-container div.header-right {
  display: flex;
  flex-direction: row;
  align-items: center;
  min-width: 187px;
  gap: 27px;
  /* entry button */
}
header#truetech-header div.main-header-container div.header-right a.entry-button,
header#truetech-header div.main-header-container div.header-right button.entry-button {
  background: #E41E00;
  color: #fff;
  padding: 10px 30px;
  font-size: 10px;
  font-weight: 600;
  border: none;
  border-radius: 2px;
  text-decoration: none;
  cursor: pointer;
  transition: opacity 0.3s;
}
header#truetech-header div.main-header-container div.header-right a.entry-button:hover,
header#truetech-header div.main-header-container div.header-right button.entry-button:hover {
  opacity: 0.85;
}
header#truetech-header div.main-header-container div.header-right div.header-locale {
  font-size: 10px;
}
header#truetech-header div.main-header-container div.header-right div.header-locale ul.lang-options {
  left: -21px;
  padding: 10px 12px;
}
header#truetech-header div.main-header-container div.header-menu-mobile {
  display: none;
}
div#truetech-footer {
  background: #F6F6F6;
  padding: 24px 2%;
  font-size: 12px;
}
div#truetech-footer div.footer-content {
  max-width: 1200px;
  margin: 0 auto;
  display: flex;
  justify-content: space-between;
  align-items: center;
  /* menu links */
  /* copyright */
}
div#truetech-footer div.footer-content ul.footer-menu-list {
  display: flex;
  gap: 18px;
  list-style: none;
  margin: 0;
  padding: 0;
}
div#truetech-footer div.footer-content ul.footer-menu-list li.menu-content a {
  text-decoration: none;
  color: #5b5b5b;
  transition: color 0.3s;
}
div#truetech-footer div.footer-content ul.footer-menu-list li.menu-content a:hover {
  color: #000;
}
div#truetech-footer div.footer-content div.footer-rights {
  color: #717171;
  white-space: nowrap;
}
/* ───── Tablet & below ───── */
@media (max-width: 1024px) {
  header#truetech-header div.main-header-container {
    /* shrink gap a bit */
  }
  header#truetech-header div.main-header-container div.header-menu-content {
    padding: 0 19px;
  }
  header#truetech-header div.main-header-container div.header-right {
    gap: 18px;
  }
  header#truetech-header div.main-header-container div.header-right {
    gap: 15px;
    min-width: 157px;
  }
  header#truetech-header div.main-header-container div.header-right a.entry-button {
    padding: 10px 20px;
  }
}
/* ───── Smartphone ───── */
@media (max-width: 710px) {
  /* hide full menu, show hamburger */
  header#truetech-header div.main-header-container {
    /* dropdown */
  }
  header#truetech-header div.main-header-container ul.header-menu-list {
    display: none;
  }
  header#truetech-header div.main-header-container div.header-menu-mobile {
    display: flex;
    align-items: center;
    cursor: pointer;
  }
  header#truetech-header div.main-header-container div.header-menu-mobile img.men-icon {
    width: 18px;
    height: auto;
  }
  header#truetech-header div.main-header-container div.header-menu-mobile img.arrow-icon {
    width: 10px;
    margin-left: 4px;
    transition: transform 0.3s;
  }
  header#truetech-header div.main-header-container div.header-menu-mobile.open img.arrow-icon {
    transform: rotate(180deg);
  }
  header#truetech-header div.main-header-container div.header-menu-content {
    position: absolute;
    top: 59px;
    right: 0;
    width: 220px;
    background: #fff;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
    padding: 20px;
    display: none;
  }
  header#truetech-header div.main-header-container div.header-menu-content ul.header-menu-list {
    flex-direction: column;
    gap: 14px;
  }
  header#truetech-header div.main-header-container {
    padding: 0 16px;
  }
  header#truetech-header div.main-header-container img.header-logo {
    height: 72px;
  }
  header#truetech-header div.main-header-container div.header-left div.company-logo a img.header-logo {
    height: 46px;
  }
  header#truetech-header div.main-header-container div.header-right {
    gap: 14px;
    min-width: 146px;
  }
  header#truetech-header div.main-header-container div.header-right a.entry-button {
    padding: 10px 14px;
  }
  div#truetech-footer div.footer-content {
    flex-direction: column;
    gap: 18px;
  }
  div#truetech-footer div.footer-content ul.footer-menu-list {
    flex-wrap: wrap;
    justify-content: center;
    gap: 18px;
  }
}
html {
  background-color: #FFF;
  font-family: "yu-gothic-pr6n", sans-serif;
}
body {
  margin: 0;
  opacity: 0;
  font-weight: 400;
  font-style: normal;
}
body.show {
  opacity: 1;
  -webkit-transition: opacity 0.2s cubic-bezier(0.24, 0.8, 0.55, 0.94) 0s;
  -moz-transition: opacity 0.2s cubic-bezier(0.24, 0.8, 0.55, 0.94) 0s;
  -o-transitino: opacity 0.2s cubic-bezier(0.24, 0.8, 0.55, 0.94) 0s;
  transition: opacity 0.2s cubic-bezier(0.24, 0.8, 0.55, 0.94) 0s;
}
body.standby {
  opacity: 0;
}