@charset "UTF-8";
#top_content {
  width: 100%;
  height: calc(100dvh - var(--header-height));
  position: relative;
}
#top_content .c-list_items {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0px;
  left: 0px;
  overflow-y: auto;
  scroll-snap-type: y mandatory;
  scroll-behavior: smooth;
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
}
#top_content .c-list_items ul {
  width: 100%;
  height: 100%;
  position: relative;
}
#top_content .c-list_items ul li {
  width: 100%;
  height: 100%;
  scroll-snap-align: start;
  scroll-snap-stop: always;
  position: relative;
}
#top_content .c-list_items ul li .img_kv {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0px;
  left: 0px;
}
#top_content .c-list_items ul li figure {
  width: 100%;
  height: 100%;
}
#top_content .c-list_items ul li figure img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}
#top_content .c-list_items ul li .item_ttl {
  position: absolute;
  top: 0px;
  left: 0px;
}
#top_content .c-list_items ul li .item_ttl h3 {
  color: var(--color-white);
  font-size: var(--fs-30-60);
  display: flex;
}
#top_content .c-list_items ul li .item_ttl h3 span.wrap {
  width: 0;
  overflow: hidden;
  display: block;
}
#top_content .c-list_items ul li .item_ttl h3 span.wrap span {
  white-space: nowrap;
}

#MainContent:has([data-page]) #top_content {
  width: calc(100% - var(--log-width));
  left: var(--log-width);
}

@media all and (min-width: 960px) {
  #top_content {
    width: 100%;
    height: auto;
    position: relative;
    min-height: calc(100vh - var(--header-height));
  }
  #top_content .c-list_items {
    width: 100%;
    height: auto;
    min-height: 100%;
    position: relative;
    overflow-y: visible;
    scroll-snap-type: revert;
    scroll-behavior: revert;
    overscroll-behavior: revert;
    -webkit-overflow-scrolling: revert;
  }
  #top_content .c-list_items ul {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, var(--cell)));
    /* ここが肝：1行目だけ明示、以降は auto-rows を使う */
    grid-template-rows: minmax(0, calc(100dvh - var(--header-height)));
    grid-auto-rows: var(--row);
    gap: var(--gap);
    grid-auto-flow: dense;
    justify-content: center;
    padding-inline: var(--side);
    margin: 0;
  }
  #top_content .c-list_items ul li {
    scroll-snap-align: revert;
    scroll-snap-stop: revert;
    position: relative;
    grid-column: span 1;
    grid-row: span 1;
    overflow: clip;
  }
  #top_content .c-list_items ul li.i-kv {
    grid-column: 1/-1; /* 全列をまたぐ */
    grid-row: 1; /* 1行目を使う */
  }
  #top_content .c-list_items ul li.i0 {
    grid-column: span 2;
    grid-row: span 4;
  }
  #top_content .c-list_items ul li.i1 {
    grid-column: span 1;
    grid-row: span 2;
  }
  #top_content .c-list_items ul li.i2 {
    grid-column: span 1;
    grid-row: span 1;
  }
  #top_content .c-list_items ul li.i3 {
    grid-column: span 1;
    grid-row: span 1;
  }
  #top_content .c-list_items ul li.i4 {
    grid-column: span 2;
    grid-row: span 2;
  }
  #top_content .c-list_items ul li.i5 {
    grid-column: span 1;
    grid-row: span 2;
  }
  #top_content .c-list_items ul li.i6 {
    grid-column: span 2;
    grid-row: span 2;
  }
  #top_content .c-list_items ul li.i7 {
    grid-column: span 1;
    grid-row: span 2;
  }
  #top_content .c-list_items ul li.i8 {
    grid-column: span 1;
    grid-row: span 2;
  }
  #top_content .c-list_items ul li.i9 {
    grid-column: span 1;
    grid-row: span 1;
  }
  #top_content .c-list_items ul li.i10 {
    grid-column: span 1;
    grid-row: span 2;
  }
  #top_content .c-list_items ul li.i11 {
    grid-column: span 1;
    grid-row: span 1;
  }
  #top_content .c-list_items ul li.i12 {
    grid-column: span 1;
    grid-row: span 1;
  }
  #top_content .c-list_items ul li.i13 {
    grid-column: span 1;
    grid-row: span 1;
  }
  #top_content .c-list_items ul li.i14 {
    grid-column: span 2;
    grid-row: span 3;
  }
  #top_content .c-list_items ul li.i15 {
    grid-column: span 2;
    grid-row: span 1;
  }
  #top_content .c-list_items ul li.i16 {
    grid-column: span 2;
    grid-row: span 3;
  }
  #top_content .c-list_items ul li.i17 {
    grid-column: span 1;
    grid-row: span 1;
  }
  #top_content .c-list_items ul li.i18 {
    grid-column: span 1;
    grid-row: span 1;
  }
}
.list_news ul li figure {
  width: 100%;
  aspect-ratio: 343/363;
}
.list_news ul li figure img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

.c-nav_filter {
  padding: 0 0 20px 0;
}
.c-nav_filter dl {
  display: flex;
  column-gap: 20px;
}
.c-nav_filter dl dt {
  vertical-align: super;
  font-size: var(--fs-15-20);
}
.c-nav_filter dl dd {
  font-size: var(--fs-20-30);
}
.c-nav_filter dl a.active {
  color: var(--color-green);
}

.product_detail .hidden {
  display: none;
}
.product_detail .loading__spinner {
  width: 40px;
  height: 40px;
  position: relative;
  aspect-ratio: 1/1;
}
.product_detail .loading__spinner svg {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0px;
  left: 0px;
}
.product_detail .visually-hidden {
  width: 1px;
  height: 1px;
  clip: rect(0px, 0px, 0px, 0px);
  position: absolute !important;
  overflow-wrap: normal !important;
  overflow: hidden;
  margin: -1px;
  padding: 0px;
  border-width: 0px;
  border-style: initial;
  border-color: initial;
  border-image: initial;
}
.product_detail .product__title {
  width: calc(100% - 10px);
  margin-inline: auto;
  position: relative;
  padding-bottom: 24px;
}
.product_detail .product__title h2.c-ttl_type {
  width: calc(100% - 114px);
  line-height: 1;
  padding: 5px 0 0 0;
}
.product_detail .product__title h2.c-ttl_type span {
  font-size: var(--ttl-product-type);
}
.product_detail .product__title .cols {
  display: flex;
  justify-content: space-between;
}
.product_detail .product__title .c-name h3 span {
  display: block;
  line-height: 1;
}
.product_detail .product__title .c-name h3 span.ja {
  font-size: var(--name-product-ja);
}
.product_detail .product__title .c-name h3 span.en {
  font-size: var(--name-product-en);
}
.product_detail .product__title .c-wrap_btn {
  position: absolute;
  bottom: 10px;
  right: 0px;
}
.product_detail .product__title button[data-toggle-info] {
  width: 100px;
}
.product_detail .product.cols {
  position: relative;
}
.product_detail .product_description {
  padding: 20px 10px;
}
.product_detail .product_description .ja {
  font-size: var(--fs-15-15);
  line-height: 1.66;
}
.product_detail .product_description .en {
  font-size: var(--fs-15-15);
  line-height: 1.66;
  margin-top: 1em;
}
.product_detail .product_description a {
  color: var(--color-green);
  text-decoration: underline;
}
.product_detail .b-product_info {
  width: calc(100% - 30px);
  position: absolute;
  top: 0px;
  right: 0px;
  background: rgba(255, 255, 255, 0.95);
}
.product_detail .b-product_info .product_info_inner {
  overflow: hidden;
  width: 100%;
  height: 0px;
}
.product_detail .b-product_info .product_info_content {
  padding: 10px;
}
.product_detail .b-product_info .txt_info dl {
  display: flex;
  align-items: center;
}
.product_detail .b-product_info .txt_info dl dt {
  font-size: var(--fs-12-12);
}
.product_detail .b-product_info .txt_info dl dd {
  font-size: var(--fs-14-14);
}
.product_detail .product-form__quantity span.visually-hidden {
  display: none;
}
.product_detail .cols_buy,
.product_detail .c-selector {
  width: calc(100% - 20px);
  margin-inline: auto;
}
.product_detail .c-selector {
  border-top: 1px solid var(--color-bdr-gray);
  padding: 15px 0;
}
.product_detail .c-selector fieldset legend {
  display: block;
}
.product_detail .c-selector fieldset {
  display: flex;
  flex-wrap: wrap;
  row-gap: 10px;
}
.product_detail .c-selector fieldset label {
  font-size: var(--fs-select-size);
  line-height: 1.5;
  display: block;
  width: 33.3333333333%;
  text-align: center;
  color: #969696;
  cursor: pointer;
}
.product_detail .c-selector fieldset input[type=radio]:checked + label {
  color: var(--color-green);
}
.product_detail .c-selector :has(fieldset:nth-of-type(2)) fieldset:nth-of-type(1) {
  justify-content: center;
}
.product_detail .c-select_color {
  padding: 0 0 15px 0;
}
.product_detail .c-select_color h4 {
  margin-bottom: 10px;
}
.product_detail .c-select_color h4 span.ja {
  font-size: var(--fs-12-12);
}
.product_detail .c-select_color h4 span.en {
  font-size: var(--fs-14-14);
}
.product_detail .form__label {
  margin-bottom: 10px;
}
.product_detail .form__label span.ja {
  font-size: var(--fs-12-12);
}
.product_detail .form__label span.en {
  font-size: var(--fs-14-14);
}
.product_detail .cols_buy {
  display: flex;
  align-items: center;
  column-gap: 20px;
  border-top: 1px solid var(--color-black);
  border-bottom: 1px solid var(--color-black);
  padding: 15px 0;
}
.product_detail .cols_buy .c-select_quantity {
  width: 60px;
  height: 30px;
  border: 1px solid rgb(150, 150, 150);
  position: relative;
}
.product_detail .cols_buy .c-select_quantity:after {
  content: "";
  width: 16px;
  height: 8px;
  display: block;
  position: absolute;
  right: 6px;
  top: 50%;
  margin-top: -4px;
  background: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTgiIGhlaWdodD0iMTAiIHZpZXdCb3g9IjAgMCAxOCAxMCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48cGF0aCBkPSJNMSAxTDkgOUwxNyAxIiBzdHJva2U9ImJsYWNrIi8+PC9zdmc+");
  background-size: cover;
  background-repeat: no-repeat;
}
.product_detail .cols_buy .c-select_quantity select {
  height: 30px;
  width: 100%;
  line-height: 30px;
  text-indent: 1em;
}
.product_detail .cols_buy .product-form_r {
  width: calc(100% - 80px);
}
.product_detail .cols_buy .product-form_r button {
  width: 100%;
}
.product_detail .cols_buy .product-form_r button[disabled] {
  background: var(--color-bdr-gray);
  pointer-events: none;
}
.product_detail .howto_pick_size {
  padding: 15px 20px;
}
.product_detail .howto_pick_size h4 {
  text-align: center;
  font-size: var(--fs-16-16);
  line-height: 1.785;
  margin-bottom: 10px;
}
.product_detail .howto_pick_size p {
  font-size: var(--fs-12-12);
  line-height: 2;
}
.product_detail .howto_pick_size .c-chart_size {
  border-top: 1px solid var(--color-bdr-gray);
  border-left: 1px solid var(--color-bdr-gray);
  margin: 0.5em 0;
}
.product_detail .howto_pick_size .c-chart_size dl {
  display: flex;
}
.product_detail .howto_pick_size .c-chart_size dt, .product_detail .howto_pick_size .c-chart_size dd {
  font-size: var(--fs-12-12);
  line-height: 1;
  width: 50%;
  border-right: 1px solid var(--color-bdr-gray);
  border-bottom: 1px solid var(--color-bdr-gray);
  text-align: center;
  padding: 8px 0 4px 0;
}
.product_detail .howto_pick_size .notes {
  margin-top: 1.5em;
}
.product_detail .howto_pick_size .notes ul li {
  font-size: var(--fs-12-12);
  line-height: 2;
}
.product_detail .howto_pick_size dl.c-example {
  margin-top: 1.5em;
}
.product_detail .howto_pick_size dl.c-example dt, .product_detail .howto_pick_size dl.c-example dd {
  font-size: var(--fs-12-12);
  line-height: 2;
}

[data-template=article] article.news_detail .img_main {
  margin-bottom: min(5.13vw,20px);
}
[data-template=article] article.news_detail h3 {
  padding: 0 10px;
  font-size: var(--fs-12-15);
  font-weight: 700;
  margin-bottom: 1.5em;
  text-decoration: underline;
  text-underline-offset: 2px;
}
[data-template=article] article.news_detail p:has(img) {
  line-break: 1;
  margin-top: min(5.13vw,20px);
  width: 100%;
  padding: 0;
}
[data-template=article] article.news_detail p:has(img) + p {
  margin-top: 1.5em;
}
[data-template=article] article.news_detail p {
  font-size: var(--fs-12-15);
  line-height: 2;
  padding: 0 10px;
}
[data-template=article] article .article-template__content {
  padding-bottom: min(5.13vw,20px);
}

@media all and (min-width: 960px) {
  .c-nav_filter {
    padding: 0 0 20px 40px;
  }
  .c-nav_filter dl {
    column-gap: 20px;
  }
  .c-nav_filter dl dt {
    vertical-align: super;
    font-size: var(--fs-15-20);
  }
  .c-nav_filter dl dd {
    font-size: var(--fs-20-30);
  }
  .c-nav_filter dl a.active {
    color: var(--color-green);
  }
  .product_detail .product.cols {
    display: flex;
    width: 100%;
  }
  .product_detail .product__media-wrapper {
    width: calc(100% - var(--product-info-width));
  }
  .product_detail .product__info-wrapper {
    width: var(--product-info-width);
  }
  .product_detail .product__title {
    width: calc(100% - 10px);
    margin-inline: auto;
    position: relative;
    padding-bottom: 0px;
  }
  .product_detail .product__title h2.c-ttl_type {
    width: calc(100% - 114px);
    line-height: 1;
    padding: 5px 0 0 0;
  }
  .product_detail .product__title h2.c-ttl_type span {
    font-size: var(--ttl-product-type);
  }
  .product_detail .product__title .cols {
    display: block;
    justify-content: revert;
    position: absolute;
    right: var(--product-info-width);
    top: 5px;
  }
  .product_detail .product__title .c-name h3 span {
    display: block;
    line-height: 1;
  }
  .product_detail .product__title .c-name h3 span.ja {
    font-size: var(--name-product-ja);
  }
  .product_detail .product__title .c-name h3 span.en {
    font-size: var(--name-product-en);
  }
  .product_detail .product__title .c-wrap_btn {
    display: none;
  }
  .product_detail .product__title button[data-toggle-info] {
    width: 100px;
  }
  .product_detail .b-product_info {
    width: 100%;
    position: relative;
    top: auto;
    right: auto;
    background: none;
  }
  .product_detail .b-product_info .product_info_inner {
    overflow: visible;
    width: 100%;
    height: auto;
  }
  .product_detail .b-product_info .c-selector,
  .product_detail .b-product_info .cols_buy {
    width: 100%;
  }
  .product_detail .product_description {
    padding: 0 26px 30px 26px;
  }
  .product_detail .howto_pick_size {
    padding: 15px 8px;
  }
  [data-template=article] article.news_detail .img_main {
    margin-bottom: min(5.13vw,20px);
  }
  [data-template=article] article.news_detail h3 {
    padding: 0 10px;
    font-size: var(--fs-12-15);
    font-weight: 700;
    margin-bottom: 1.5em;
  }
  [data-template=article] article.news_detail p:has(img) {
    line-break: 1;
    margin-top: min(5.13vw,20px);
    width: 100%;
    padding: 0;
    max-width: 100%;
  }
  [data-template=article] article.news_detail p:has(img) + p {
    margin-top: 1.5em;
  }
  [data-template=article] article.news_detail p {
    font-size: var(--fs-12-15);
    line-height: 2;
  }
  [data-template=article] article.news_detail h3, [data-template=article] article.news_detail p {
    width: 82.22%;
    max-width: 925px;
    margin-inline: auto;
    padding: 0;
  }
}
@media (any-hover: hover) {
  .product_detail .c-select_size fieldset label:hover {
    color: var(--color-green);
  }
}
#top_content {
  background: #666;
}

[data-page=contact] .page_contact {
  width: calc(100% - 30px);
}

#page_content .page_contact form dl {
  margin-bottom: 40px;
}
#page_content .page_contact form dl:nth-last-of-type(1) dt {
  margin-bottom: 50px;
}
#page_content .page_contact form dl dt {
  text-align: center;
}
#page_content .page_contact form dl dt span.ja {
  font-size: var(--fs-news-title);
}
#page_content .page_contact form dl dt span.en {
  font-size: var(--fs-news-title-en);
}
#page_content .page_contact form dl input {
  border-bottom: 1px solid var(--color-black);
  width: 100%;
  height: 50px;
}
#page_content .page_contact form dl textarea {
  border: 1px solid var(--color-black);
  width: 100%;
  min-height: 15em;
  padding: 1em;
}
#page_content .page_contact .c-note p {
  font-size: var(--fs-12-12);
}
#page_content .page_contact .contact__button {
  margin-top: 40px;
  padding-bottom: 70px;
}
#page_content .page_contact .contact__button button {
  width: 264px;
  margin-inline: auto;
}

.loading .page_dictionary header {
  position: relative;
  top: 0px;
}

.page_dictionary {
  position: relative;
}
.page_dictionary header {
  position: sticky;
  top: var(--header-height);
  width: 100%;
  left: 0px;
}
.page_dictionary header .c-ttl_news h2 span {
  display: block;
}
.page_dictionary header .c-ttl_news h2 span.en {
  font-size: var(--fs-dictionary-title-en);
}
.page_dictionary header .c-ttl_news h2 span.ja {
  width: 100%;
  text-align: right;
  font-size: var(--fs-news-title-en);
}
.page_dictionary article .txt {
  padding: min(5.13vw,20px) min(2.56vw,10px);
}
.page_dictionary article .txt h3 {
  text-decoration: underline;
  text-underline-offset: 2px;
  font-weight: 700;
  margin-bottom: 1em;
  font-size: var(--fs-12-15);
}
.page_dictionary article .txt .ja {
  margin-bottom: 1.5em;
}
.page_dictionary article .txt .ja p {
  font-size: var(--fs-12-15);
  line-height: 2;
}
.page_dictionary article .txt .en p {
  font-size: var(--fs-15-15);
  line-height: 1.667;
}
.page_dictionary article .txt a {
  color: var(--color-green);
  text-decoration: underline;
}

@media all and (min-width: 960px) {
  .page_dictionary header .c-ttl_news h2 {
    display: flex;
    flex-direction: column-reverse;
  }
  .page_dictionary header .c-ttl_news h2 span {
    width: 100%;
  }
  .page_dictionary header .c-ttl_news h2 span.ja {
    width: 100%;
    text-align: left;
  }
  .page_dictionary article .dictionary_cols {
    width: calc(100% - 30px);
    display: flex;
    justify-content: space-between;
  }
  .page_dictionary article .txt {
    width: 276px;
    padding: 0;
  }
  .page_dictionary article .imgs {
    width: calc(100% - 300px);
  }
  .page_dictionary article .imgs .img {
    width: 100%;
  }
  .page_dictionary article .imgs.img3 {
    display: flex;
    gap: 20px;
  }
  .page_dictionary article .imgs.img3 .imgs_l {
    width: calc(100% - 10px);
  }
  .page_dictionary article .imgs.img3 .imgs_r {
    width: calc(100% - 10px);
    display: flex;
    gap: 20px;
    flex-direction: column;
  }
}
.c-list_index {
  text-align: right;
  padding: 6em 0 0 0;
}
.c-list_index .list_index {
  display: flex;
  flex-wrap: wrap;
  width: 100%;
  gap: calc(12px + 3em) 1.3em;
  align-items: flex-start;
  flex-direction: row-reverse;
}
.c-list_index a {
  display: block;
  writing-mode: vertical-rl;
  position: relative;
  padding-top: 2em;
}
.c-list_index a:before {
  content: attr(data-initial);
  text-orientation: upright;
  display: block;
  opacity: 0;
  font-size: var(--fs-36-60);
  line-height: 1;
  position: absolute;
  top: 0;
  left: -0.15em;
}
.c-list_index a.initial0:before {
  opacity: 1;
}
.c-list_index a span {
  line-height: 1;
}
.c-list_index a span.ja {
  font-size: var(--fs-12-20);
}
.c-list_index a span.en {
  padding-top: 0.5em;
  font-size: var(--fs-14-24);
}

@media all and (min-width: 960px) {
  .c-list_index {
    padding: 6em 0 0 0;
  }
  .c-list_index .list_index {
    width: 100%;
    gap: calc(12px + 3.5em) 1.72em;
  }
  .c-list_index a {
    padding-top: 5em;
  }
  .c-list_index a:before {
    top: 0;
    left: -0.45em;
  }
}
/*
TODO
- １つ目のブロックが固定されたときに幅が変わるので、ガタつかないようにする
- 同ページはクリックできないようにする
- 
*/
#page_content .page_content_inner.loading {
  overflow-x: hidden;
}
#page_content .page_content_inner.back {
  overflow-x: hidden;
}
#page_content .page_content_inner.back [data-page] {
  transition: transform 0.4s ease;
}
#page_content [data-page] {
  filter: drop-shadow(-1px 0 5px rgba(0, 0, 0, 0.1));
}
#page_content [data-page]:nth-of-type(1) {
  z-index: 1;
}
#page_content [data-page]:nth-of-type(2) {
  z-index: 2;
}
#page_content [data-page]:nth-of-type(3) {
  z-index: 3;
}
#page_content [data-page].full-width {
  width: calc(100vw - var(--log-width) - var(--scrollbar));
  z-index: 6;
  margin-left: -30px;
}
#page_content [data-page].full-width.delete {
  transition: transform 0.4s ease;
}

[data-block-num="1"] [data-page]:nth-of-type(1) {
  position: relative;
  width: 100%;
  margin-left: 0px;
  transform: translate3d(100%, 0, 0);
}
[data-block-num="1"] [data-page]:nth-of-type(1).active {
  transform: translate3d(0, 0, 0);
  transition: transform 0.4s ease-out;
}

[data-block-num="2"] [data-page]:nth-of-type(1) {
  position: fixed;
  top: var(--header-height);
  width: var(--layer1-width);
}
[data-block-num="2"] [data-page]:nth-of-type(1) .c-content {
  width: calc(100% - var(--scrollbar) - 30px);
}
[data-block-num="2"] [data-page]:nth-of-type(2) {
  position: relative;
  width: calc(100% - 30px);
  margin-left: 30px;
  transform: translate3d(100%, 0, 0);
}
[data-block-num="2"] [data-page]:nth-of-type(2).active {
  transform: translate3d(0, 0, 0);
  transition: transform 0.4s ease-out;
}

[data-block-num="3"] [data-page]:nth-of-type(1) {
  position: fixed;
  top: var(--header-height);
  margin-left: 0px;
  transition: margin 0.3s ease;
}
[data-block-num="3"] [data-page]:nth-of-type(2) {
  position: fixed;
  width: calc(100% - 30px);
  margin-left: 30px;
  transform: translate3d(100%, 0, 0);
}
[data-block-num="3"] [data-page]:nth-of-type(2).active {
  transform: translate3d(0, 0, 0);
  transition: margin 0.4s ease;
}
[data-block-num="3"] [data-page]:nth-of-type(3) {
  position: relative;
  width: calc(100% - 60px);
  margin-left: 60px;
  transform: translate3d(100%, 0, 0);
}
[data-block-num="3"] [data-page]:nth-of-type(3).active {
  transform: translate3d(0, 0, 0);
  transition: transform 0.4s ease-out;
}

[data-block-num="1"] .back [data-page]:nth-of-type(1) {
  transition: transform 0.4s ease-out;
  transform: translate3d(100%, 0, 0);
}
[data-block-num="1"] .back [data-page]:nth-of-type(1).active {
  transform: translate3d(0%, 0, 0);
}

[data-block-num="2"] .back [data-page]:nth-of-type(1) {
  transition: transform 0.4s ease-out;
  transform: translate3d(100%, 0, 0);
}
[data-block-num="2"] .back [data-page]:nth-of-type(1).active {
  transform: translate3d(0%, 0, 0);
}
[data-block-num="2"] .back [data-page]:nth-of-type(2) {
  transition: transform 0.4s ease-out;
  transform: translate3d(100%, 0, 0);
}
[data-block-num="2"] .back [data-page]:nth-of-type(2).active {
  transform: translate3d(0%, 0, 0);
}

[data-block-num="3"] .back [data-page]:nth-of-type(1) {
  transition: transform 0.4s ease-out;
  transform: translate3d(100%, 0, 0);
}
[data-block-num="3"] .back [data-page]:nth-of-type(1).active {
  transform: translate3d(0%, 0, 0);
}
[data-block-num="3"] .back [data-page]:nth-of-type(2) {
  transition: transform 0.4s ease-out;
  transform: translate3d(100%, 0, 0);
}
[data-block-num="3"] .back [data-page]:nth-of-type(2).active {
  transform: translate3d(0%, 0, 0);
}
[data-block-num="3"] .back [data-page]:nth-of-type(3) {
  transition: transform 0.4s ease-out;
  transform: translate3d(100%, 0, 0);
}
[data-block-num="3"] .back [data-page]:nth-of-type(3).active {
  transform: translate3d(0%, 0, 0);
}

@media all and (min-width: 960px) {
  [data-block-num="3"] [data-page]:nth-of-type(1) {
    width: calc(100% - var(--log-width) - 30px - var(--scrollbar));
  }
  [data-block-num="3"] [data-page]:nth-of-type(2) { /*width: calc(100% - var(--log-width) - 30px - 30px - var(--scrollbar));*/
    width: calc(100% - var(--log-width) - 30px - 30px);
  }
  [data-block-num="3"] [data-page]:nth-of-type(3) {
    position: relative;
    width: calc(100% - 60px);
    margin-left: 60px;
    transform: translate3d(100%, 0, 0);
  }
  [data-block-num="3"] [data-page]:nth-of-type(3).active {
    transform: translate3d(0, 0, 0);
    transition: transform 0.4s ease-out;
  }
}

/*# sourceMappingURL=style.css.map */