/* header */
.c-hdr {
  position: relative;
  z-index: 30;
  padding: 1.6em;
}

.c-hdr > .o-bgl {
  background-color: #222222;
  background-image: url("");
  opacity: 1;
}

/* content */
.c-blc {
  height: 99em;
}

/**/
/* o-bjects */
/* background layer */
.o-bgl {
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  color:green;
  z-index: 10;
}

/* avatar */
.o-avt {
  position: relative;
  z-index: 20;
  width: 3.2em;
  height: 3.2em;
  margin: 0 auto 1.6em;
  border-radius: 50%;
  background-color: #444444;
}

.o-avt__img {
  width: 100%;
  height: 100%;
}

/* image */
/* title */
.o-ttl--pag {
  position: relative;
  z-index: 120;
  line-height: 1;
  text-align: center;
  margin-bottom: 1.6em;
}

/* page title */
.o-nav--pri .o-ttl--pag {
  display: none;
}

.is_stuck .o-ttl--pag {
  display: block;
  position: fixed;
  top: 0.5em;
  left: 1.2em;
  margin: 0;
  padding: 0;
}

.o-ttl--pag .o-ttl__lnk {
  display: inline-block;
  color: #aaaaaa;
}

/* link */
.o-ttl--pag .o-ttl__lnk:hover {
  color: #ffffff;
}

.is_stuck .o-ttl--pag .o-ttl__lnk {
  margin: 0;
}

.o-ttl--pag .o-ttl__txt {
  font-size: 2.4em;
  font-weight: 300;
  line-height: 1;
  letter-spacing: 0.025em;
  text-align: center;
}

/* text */
.is_stuck .o-ttl--pag .o-ttl__txt {
  font-size: 1.6em;
  line-height: 1;
}

/* navigation */
.o-nav--pri {
  position: relative;
  z-index: 20;
  margin-left: -1.6em;
  margin-right: -1.6em;
  margin-bottom: -1.6em;
  text-align: center;
}

/* primary navigation */
.is_stuck.o-nav--pri {
  position: fixed;
  left: 0;
  right: 0;
  top: 0;
  margin: 0;
  text-align: right;
}

.o-nav--pri > .o-bgl {
  background-color: #222222;
  opacity: 0;
  transition: 225ms cubic-bezier(0.25, 0.46, 0.45, 0.94);
  transition-property: none;
}

.is_stuck.o-nav--pri > .o-bgl {
  opacity: 1;
}

.o-nav--pri > .o-fgl {
  z-index: 130;
  height: 0;
  background-color: #222222;
  transition: z-index 450ms, opacity 225ms;
}

.is_stuck.o-nav--pri > .o-fgl {
  z-index: 100;
  height: 100%;
  opacity: 0;
}

.o-nav--pri .o-nav__itm {
  display: inline-block;
  position: relative;
  z-index: 120;
  padding: 0 1.2em;
  transition: 225ms cubic-bezier(0.25, 0.46, 0.45, 0.94);
  transition-property: all;
}

/* item */
.o-nav--pri .o-nav__itm:hover {
  background-color: #ff0000;
}

.o-nav--pri .o-nav__lnk {
  display: inline-block;
  position: relative;
  padding: 0;
  padding: 1em 0;
  color: #b8b8b8;
}

/* link */
.is_stuck.o-nav--pri .o-nav__lnk {
  color: #b8b8b8;
}

.o-nav--pri .o-nav__itm:hover .o-nav__lnk {
  color: #dcdcdc;
}

.is_stuck.o-nav--pri .o-nav__itm:hover .o-nav__lnk {
  color: #dcdcdc;
}

.o-nav--pri .o-nav__txt {
  position: relative;
  top: 0;
  font-size: 0.8em;
  font-weight: 400;
  line-height: 1;
  letter-spacing: 0.075em;
  text-transform: uppercase;
  white-space: nowrap;
}

/* text */
/* scroll to top */
.o-top {
  position: absolute;
  top: 12em;
  width: 100%;
  height: 0;
  overflow: hidden;
}

.is_stuck.o-top {
  position: fixed;
  right: 0;
  top: auto;
  bottom: 0;
}

.o-top__tri {
  position: fixed;
  right: 0;
  bottom: -2em;
  border: 0 solid transparent;
  border-width: 2em;
  border-top-width: 0;
  border-bottom-color: #222222;
  transition: 450ms cubic-bezier(0.25, 0.46, 0.45, 0.94);
  transition-property: all;
}

.is_stuck .o-top__tri {
  bottom: 0;
}

.o-top:hover .o-top__tri {
  border-bottom-color: #dddddd;
}

.o-top__lnk {
  position: fixed;
  right: 1em;
  bottom: -2em;
  width: 2em;
  height: 2em;
  background-image: url("https://neuraldamage.com/img/icon/arrow-01-up-white.svg");
  background-size: 100%;
  background-repeat: no-repeat;
  background-position: center;
  transform: scale(0.8);
  transition: 450ms cubic-bezier(0.25, 0.46, 0.45, 0.94);
  transition-property: all;
}

/* link */
.is_stuck .o-top__lnk {
  bottom: 0;
}

.o-top__hov {
  position: absolute;
  right: 0;
  bottom: 0;
  width: 2em;
  height: 2em;
  background-image: url("https://neuraldamage.com/img/icon/arrow-01-up-black.svg");
  background-size: 100%;
  background-repeat: no-repeat;
  background-position: center;
  opacity: 0;
  transform: scale(1);
  transition: 450ms cubic-bezier(0.25, 0.46, 0.45, 0.94);
  transition-property: all;
}

/* hover */
.o-top:hover .o-top__hov {
  opacity: 1;
}

/**/