/* =================================================
   unique layout
================================================= */
#container.page {
  /* -------------------------------------
     article
  ------------------------------------- */
}
#container.page #main {
  padding: 0;
}
#container.page .title_page.imagefull {
  margin: 0;
  background: hsl(0, 0%, 95%);
}
#container.page .title_page.imagefull h2.page_title span.txt_2 {
  writing-mode: tb-rl;
  text-align: left;
  font-size: 1.8rem;
  width: 73.3333333333vw;
}
#container.page .title_page.imagefull .nav_txt {
  margin: 0;
}
#container.page #article section.message {
  padding: 8vw 0 10.6666666667vw;
  background: hsl(0, 0%, 95%);
}
#container.page #article section.message .inner.section_inner .content figure {
  width: 72vw;
  margin: 0 auto;
}
#container.page #article section.message .inner.section_inner .content h3 {
  text-align: center;
  font-size: 1rem;
  margin-top: 1.5em;
}
#container.page #article section.message .inner.section_inner .content h3 span.txt_2 {
  font-size: 1.6rem;
}
#container.page #article section.message .inner.section_inner .content .text {
  margin-bottom: 1.5em;
}
#container.page #article section.message .inner.section_inner .content .item {
  width: 89.3333333333vw;
}
#container.page #article section.phylosophy .inner.section_inner .content h2.content_title {
  display: grid;
  grid-template-columns: repeat(2, max-content) 1fr;
  row-gap: 1.25em;
  column-gap: 1em;
  align-items: center;
  width: 100%;
}
#container.page #article section.phylosophy .inner.section_inner .content h2.content_title::before, #container.page #article section.phylosophy .inner.section_inner .content h2.content_title::after {
  content: "";
  display: block;
  width: 100%;
  border-bottom: 1px solid #7D7F80;
}
#container.page #article section.phylosophy .inner.section_inner .content h2.content_title::before {
  grid-row: 1;
  grid-column: 3;
}
#container.page #article section.phylosophy .inner.section_inner .content h2.content_title::after {
  grid-row: 3;
  grid-column: 1/-1;
}
#container.page #article section.phylosophy .inner.section_inner .content h2.content_title span {
  line-height: 1;
}
#container.page #article section.phylosophy .inner.section_inner .content h2.content_title span.en {
  grid-row: 1;
  grid-column: 1;
  color: #7D7F80;
  font-size: 1.2rem;
}
#container.page #article section.phylosophy .inner.section_inner .content h2.content_title span.en i {
  font-size: 2.4rem;
}
#container.page #article section.phylosophy .inner.section_inner .content h2.content_title span.txt {
  grid-row: 1;
  grid-column: 2;
  color: hsl(0, 0%, 100%);
  font-size: 1rem;
  height: max-content;
  padding: 0.5em 1em;
  margin: 0;
  background: hsl(0, 0%, 95%);
}
#container.page #article section.phylosophy .inner.section_inner .content h2.content_title span.txt_2 {
  grid-row: 2;
  grid-column: 1/-1;
  white-space: nowrap;
  font-size: 2.1rem;
  line-height: 1.75;
}
#container.page #article section.phylosophy .inner.section_inner .content h3 {
  text-align: center;
  font-size: 1.6rem;
  margin-bottom: 0.75em;
}
#container.page #article section.phylosophy .inner.section_inner .content p {
  font-size: 1.4rem;
}
#container.page #article section.phylosophy .inner.section_inner .content ul.nostyle li {
  margin-bottom: 5.3333333333vw;
}
#container.page #article section.phylosophy .inner.section_inner .content ul.nostyle li.first figure {
  width: 100%;
}
#container.page #article section.phylosophy .inner.section_inner .content .link {
  margin-top: 8vw;
}
#container.page #article section.phylosophy .inner.section_inner .content .link span:before {
  display: none;
}
#container.page #article section.phylosophy .inner.section_inner .content .link span::after {
  width: 2.1333333333vw;
  height: 2.1333333333vw;
  right: 3.3333333333vw;
  border-right: 1px solid #898989;
  transform-origin: center;
  transform: translateY(-53%) rotate(135deg);
}
#container.page #article section.phylosophy .inner.section_inner .content .link.js-link-content span {
  color: #898989;
  background: hsl(0, 0%, 100%);
}
#container.page #article section.phylosophy .inner.section_inner .content .link.js-link-content span:after {
  border-top: 1px solid #898989;
  border-right: 1px solid #898989;
}
#container.page #article section.phylosophy .inner.section_inner .content .link.js-link-content:hover span {
  color: hsl(0, 0%, 100%);
  background: #898989;
}
#container.page #article section.phylosophy .inner.section_inner .content .link.js-link-content:hover span:after {
  border-top: 1px solid hsl(0, 0%, 100%);
  border-right: 1px solid hsl(0, 0%, 100%);
}
#container.page #article section.phylosophy .inner.section_inner .content .item {
  padding-bottom: 10.6666666667vw;
}
#container.page #article section.phylosophy .inner.section_inner .content .item:nth-of-type(even) {
  background: hsl(0, 0%, 95%);
}
#container.page #article section.phylosophy .inner.section_inner .content .item .float_r {
  width: 89.3333333333vw;
  padding-top: 8vw;
  margin: 0 auto;
}
#container.page #article section.phylosophy .inner.section_inner .content .item .float_c {
  width: 89.3333333333vw;
  padding-top: 8vw;
  margin: 0 auto;
}
#container.page #article section.phylosophy .inner.section_inner .content .item .float_c figure {
  width: 72vw;
  margin: 0 auto 1.25em;
}
#container.page #article section.phylosophy .inner.section_inner .content .item details[open] .link span::after {
  transform: translateY(0) rotate(-45deg);
}
#container.page #article section.about {
  background: hsl(0, 0%, 95%);
}
#container.page #article section.about .inner.section_inner .content h2.h2_1 {
  margin-bottom: 1em;
}
#container.page #article section.about .inner.section_inner .content p {
  font-size: 1.4rem;
}
#container.page #article section.about .inner.section_inner .content .item {
  width: 89.3333333333vw;
  padding: 8vw 0 10.6666666667vw;
  margin: 0 auto;
}

@media screen and (min-width: 768px) {
  /* =================================================
     unique layout
  ================================================= */
  #container.page {
    /* -------------------------------------
       article
    ------------------------------------- */
  }
  #container.page .title_page.imagefull h2.page_title span.txt_2 {
    letter-spacing: 0.2em;
    font-size: 3.2rem;
  }
  #container.page #article {
    /* -------------------------------------
       section
    ------------------------------------- */
  }
  #container.page #article section.message {
    padding: 48px 48px 80px;
    margin: 0;
  }
  #container.page #article section.message .inner.section_inner .content {
    max-width: 1056px;
    margin: 0 auto;
  }
  #container.page #article section.message .inner.section_inner .content figure {
    grid-row: 1/3;
    grid-column: 2;
    width: 100%;
    height: 100%;
    margin: 0;
  }
  #container.page #article section.message .inner.section_inner .content h2.content_title {
    grid-row: 1;
    grid-column: 1;
  }
  #container.page #article section.message .inner.section_inner .content h3 {
    grid-row: 3;
    grid-column: 2;
    justify-self: center;
    display: grid;
    grid-template-columns: repeat(2, max-content);
    column-gap: 1em;
    align-items: center;
    font-size: 1.4rem;
  }
  #container.page #article section.message .inner.section_inner .content h3 span.txt_2 {
    font-size: 2.1rem;
  }
  #container.page #article section.message .inner.section_inner .content .text {
    grid-row: 2/-1;
    grid-column: 1;
    margin-bottom: 1.5em;
  }
  #container.page #article section.message .inner.section_inner .content .text p {
    font-size: 1.6rem;
    margin: 0 0 1em;
  }
  #container.page #article section.message .inner.section_inner .content .item {
    display: grid;
    grid-template-rows: repeat(2, max-content) 1fr;
    grid-template-columns: 1fr 300px;
    column-gap: 32px;
    width: 100%;
  }
  #container.page #article section.phylosophy {
    padding: 0;
  }
  #container.page #article section.phylosophy .inner.section_inner .content {
    max-width: 100%;
  }
  #container.page #article section.phylosophy .inner.section_inner .content h2.content_title {
    row-gap: 1.25em;
    column-gap: 1em;
  }
  #container.page #article section.phylosophy .inner.section_inner .content h2.content_title span.en {
    font-size: 1.6rem;
  }
  #container.page #article section.phylosophy .inner.section_inner .content h2.content_title span.en i {
    font-size: 3.2rem;
  }
  #container.page #article section.phylosophy .inner.section_inner .content h2.content_title span.txt {
    font-size: 1.2rem;
  }
  #container.page #article section.phylosophy .inner.section_inner .content h2.content_title span.txt_2 {
    white-space: wrap;
    font-size: 2.8rem;
  }
  #container.page #article section.phylosophy .inner.section_inner .content h3 {
    font-size: 1.8rem;
  }
  #container.page #article section.phylosophy .inner.section_inner .content p {
    font-size: 1.2rem;
  }
  #container.page #article section.phylosophy .inner.section_inner .content ul.nostyle {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    row-gap: 48px;
    column-gap: 48px;
  }
  #container.page #article section.phylosophy .inner.section_inner .content ul.nostyle li {
    margin-bottom: 0;
  }
  #container.page #article section.phylosophy .inner.section_inner .content .link {
    grid-column: 1/-1;
    margin-top: 32px;
  }
  #container.page #article section.phylosophy .inner.section_inner .content .link span {
    width: 300px;
    height: 40px;
  }
  #container.page #article section.phylosophy .inner.section_inner .content .link span::after {
    width: 12px;
    height: 12px;
    right: 25px;
  }
  #container.page #article section.phylosophy .inner.section_inner .content .item {
    padding-bottom: 0;
  }
  #container.page #article section.phylosophy .inner.section_inner .content .item summary {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    column-gap: 48px;
    align-items: stretch;
    padding-left: 32px;
    box-sizing: border-box;
    cursor: pointer;
  }
  #container.page #article section.phylosophy .inner.section_inner .content .item .float_l {
    grid-column: 2;
  }
  #container.page #article section.phylosophy .inner.section_inner .content .item .float_l figure {
    height: 100%;
    max-height: 600px;
  }
  #container.page #article section.phylosophy .inner.section_inner .content .item .float_r {
    grid-row: 1;
    grid-column: 1;
    align-self: center;
    justify-self: end;
    width: 100%;
    max-width: 480px;
    padding: 48px 0;
    margin: 0;
  }
  #container.page #article section.phylosophy .inner.section_inner .content .item .float_c {
    width: 100%;
    max-width: 1056px;
    padding: 64px 48px;
    box-sizing: border-box;
  }
  #container.page #article section.phylosophy .inner.section_inner .content .item .float_c p {
    font-size: 1.4rem;
  }
  #container.page #article section.phylosophy .inner.section_inner .content .item .float_c figure {
    width: 100%;
    margin: 0 0 1.5rem;
  }
  #container.page #article section.about {
    padding: 0;
  }
  #container.page #article section.about .inner.section_inner {
    display: block;
  }
  #container.page #article section.about .inner.section_inner .content {
    display: grid;
    grid-template-rows: 7fr 3fr;
    grid-template-columns: 4.4fr 5.6fr;
    max-width: 100%;
  }
  #container.page #article section.about .inner.section_inner .content figure {
    width: 100%;
    height: 100%;
    position: absolute;
    z-index: -1;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
  }
  #container.page #article section.about .inner.section_inner .content h2.h2_1 {
    grid-column: 2;
    line-height: 2;
    margin-bottom: 1.5em;
  }
  #container.page #article section.about .inner.section_inner .content p {
    grid-column: 2;
    line-height: 2;
  }
  #container.page #article section.about .inner.section_inner .content .item {
    grid-row: 1;
    grid-column: 1;
    display: grid;
    grid-template-columns: minmax(80px, 1fr) 520px;
    width: 100%;
    padding: 64px 0;
    margin: 0;
    background: rgba(255, 255, 255, 0.85);
  }
}/*# sourceMappingURL=concept.css.map */