@charset "UTF-8";
/**
 * メディアクエリ
 * @param {string} $mode - max または min
 * @param {number} $width - 設定値
 */
/**
 * メディアクエリ PC
 * @param {number} [$width:$breakpoin] - 設定値
 */
/**
 * メディアクエリ SP
 * @param {number} [$width:$breakpoin] - 設定値
 */
/**
 * メディアクエリによるIE11ハック
 */
/**
 * VW計算
 * @param {string} $property  - プロパティ
 * @param {number} $value - 基準となる値
 * @param {number} $basewidth - 基準となるウィンドウ幅
 * @param {number} [$maxwidth:0] - 拡大を停止するウィンドウ幅
 * @param {number} [$minwidth:0] - 縮小を停止するウィンドウ幅
 */
#troyan {
  font-family: YakuHanMP, "Zen Old Mincho", serif !important;
  font-feature-settings: "palt";
  color: #280000;
  font-weight: 500;
  position: relative;
}
@media screen and (min-width: 768px) {
  #troyan {
    max-width: 1366px;
    margin-inline: auto;
  }
}
@media screen and (max-width: 767px) {
  #troyan {
    margin-top: 18.6666666667vw;
  }
}
#troyan * {
  font: inherit;
}
#troyan a {
  color: inherit;
  text-decoration: none;
}
@media screen and (min-width: 768px) {
  #troyan a {
    transition: opacity 0.3s ease;
  }
  #troyan a:hover {
    opacity: 0.7;
  }
}
@media screen and (max-width: 767px) {
  #troyan .pc {
    display: none !important;
  }
}
@media screen and (min-width: 768px) {
  #troyan .sp {
    display: none !important;
  }
}
#troyan img {
  display: block;
  max-width: 100%;
}
@media screen and (max-width: 767px) {
  #troyan img {
    width: 100%;
  }
}
#troyan picture {
  display: block;
}
#troyan .noto {
  font-family: "Noto Sans JP", sans-serif;
  font-optical-sizing: auto;
}
@media screen and (min-width: 768px) {
  #troyan .splide {
    display: none;
  }
}
@media screen and (min-width: 768px) {
  #troyan .fixed-header {
    display: none;
  }
}
@media screen and (max-width: 767px) {
  #troyan .fixed-header {
    width: 100%;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 100;
    background-color: rgba(255, 255, 255, 0.7);
  }
  #troyan .fixed-header.is-fixed {
    top: 18.6666666667vw;
  }
}
@media screen and (max-width: 767px) {
  #troyan .fixed-header .fixed-header__inner {
    height: 12.6666666667vw;
    display: flex;
    align-items: center;
    padding-left: 4vw;
    padding-right: 4vw;
  }
}
@media screen and (max-width: 767px) {
  #troyan .fixed-header .fixed-header__logo {
    width: 10.1333333333vw;
  }
}
@media screen and (max-width: 767px) {
  #troyan .fixed-header .fixed-navigation {
    display: flex;
    align-items: center;
    gap: 1em;
    margin-left: auto;
  }
}
@media screen and (max-width: 767px) {
  #troyan .fixed-header .fixed-navigation__item--link {
    font-size: 2.6666666667vw;
  }
}
@media screen and (max-width: 767px) {
  #troyan .fixed-header .fixed-navigation__campaign {
    width: 23.3333333333vw;
    margin-left: 3.3333333333vw;
  }
}
#troyan .lp__header {
  width: 100%;
  position: absolute;
  left: 0;
}
@media screen and (min-width: 768px) {
  #troyan .lp__header {
    top: 35px;
    z-index: 100;
    height: 70px;
    display: flex;
    align-items: center;
  }
  #troyan .lp__header.is-fixed {
    position: fixed;
    top: 130px;
    background-color: rgba(255, 255, 255, 0.8);
  }
}
@media screen and (max-width: 767px) {
  #troyan .lp__header {
    top: 2.6666666667vw;
  }
}
#troyan .lp__header .lp__header--inner {
  display: flex;
  align-items: center;
}
@media screen and (min-width: 768px) {
  #troyan .lp__header .lp__header--inner {
    max-width: 900px;
    margin-inline: auto;
  }
}
@media screen and (max-width: 767px) {
  #troyan .lp__header .lp__header--inner {
    flex-direction: column;
    justify-content: center;
  }
}
@media screen and (min-width: 768px) {
  #troyan .lp__header .lp__header--logo {
    width: 292px;
  }
}
@media screen and (max-width: 767px) {
  #troyan .lp__header .lp__header--logo {
    width: 41.8666666667vw;
  }
}
#troyan .lp__header .navigation {
  display: flex;
  align-items: center;
}
@media screen and (min-width: 768px) {
  #troyan .lp__header .navigation {
    margin-left: 115px;
    gap: 28px;
  }
}
@media screen and (max-width: 767px) {
  #troyan .lp__header .navigation {
    justify-content: center;
    margin-top: 3.3333333333vw;
  }
}
@media screen and (max-width: 767px) {
  #troyan .lp__header .navigation__item:not(:first-of-type) {
    margin-left: 1em;
  }
}
#troyan .lp__header .navigation__item--link {
  font-weight: 500;
  line-height: 1;
}
@media screen and (min-width: 768px) {
  #troyan .lp__header .navigation__item--link {
    font-size: 16px;
  }
}
@media screen and (max-width: 767px) {
  #troyan .lp__header .navigation__item--link {
    font-size: 2.6666666667vw;
  }
}
@media screen and (min-width: 768px) {
  #troyan .lp__header .navigation__campaign {
    width: 141px;
  }
}
@media screen and (max-width: 767px) {
  #troyan .lp__header .navigation__campaign {
    width: 23.3333333333vw;
    margin-left: 3.3333333333vw;
  }
}
#troyan .mainVisual {
  width: 100%;
}
@media screen and (min-width: 768px) {
  #troyan .mainVisual {
    background: url(../images/mainVisual__bg.png) no-repeat center/cover;
    height: 820px;
  }
}
@media screen and (max-width: 767px) {
  #troyan .mainVisual {
    padding-top: 18.6666666667vw;
    padding-bottom: 2vw;
    background: url(../images/mainVisual__bg.sp.jpg) no-repeat center/cover;
  }
}
#troyan .mainVisual .mainVisual__image {
  margin-inline: auto;
  position: relative;
}
@media screen and (min-width: 768px) {
  #troyan .mainVisual .mainVisual__image {
    padding-top: 100px;
    width: 967px;
    right: -20px;
  }
}
@media screen and (max-width: 767px) {
  #troyan .mainVisual .mainVisual__image {
    right: -2.6666666667vw;
    width: 92.1333333333vw;
  }
}
#troyan .mainVisual .mainVisual__heading {
  text-align: center;
}
@media screen and (min-width: 768px) {
  #troyan .mainVisual .mainVisual__heading {
    font-size: 39px;
    line-height: 1.358974359;
    color: #42210b;
    letter-spacing: -0.04em;
    transform: translateY(-15%);
  }
}
@media screen and (max-width: 767px) {
  #troyan .mainVisual .mainVisual__heading {
    font-size: 4.5333333333vw;
    line-height: 1.4705882353;
    margin-top: 0.6666666667vw;
  }
}
#troyan .mainVisual .mainVisual__text {
  text-align: center;
}
@media screen and (min-width: 768px) {
  #troyan .mainVisual .mainVisual__text {
    line-height: 2.125;
    font-size: 16px;
    color: #42210b;
    letter-spacing: -0.07em;
  }
}
@media screen and (max-width: 767px) {
  #troyan .mainVisual .mainVisual__text {
    line-height: 2.1818181818;
    font-size: 2.9333333333vw;
    margin-top: 3.3333333333vw;
  }
}
#troyan .mainVisual .mainVisual__list {
  display: flex;
  justify-content: center;
}
@media screen and (min-width: 768px) {
  #troyan .mainVisual .mainVisual__list {
    margin-top: 20px;
    gap: 24px;
  }
}
@media screen and (max-width: 767px) {
  #troyan .mainVisual .mainVisual__list {
    flex-wrap: wrap;
    -moz-column-gap: 2vw;
    column-gap: 2vw;
    row-gap: 3.3333333333vw;
    margin-top: 4vw;
  }
}
@media screen and (min-width: 768px) {
  #troyan .mainVisual .mainVisual__item {
    width: 262px;
  }
}
@media screen and (max-width: 767px) {
  #troyan .mainVisual .mainVisual__item {
    width: 41.8666666667vw;
  }
}
@-webkit-keyframes floating {
  0% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(10px);
  }
  100% {
    transform: translateY(0);
  }
}
@keyframes floating {
  0% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(10px);
  }
  100% {
    transform: translateY(0);
  }
}
#troyan .mainVisual .mainVisual__scroll {
  -webkit-animation: floating 2s ease-in-out infinite;
  animation: floating 2s ease-in-out infinite;
}
@media screen and (min-width: 768px) {
  #troyan .mainVisual .mainVisual__scroll {
    display: flex;
    justify-content: center;
    margin-top: 20px;
  }
}
@media screen and (max-width: 767px) {
  #troyan .mainVisual .mainVisual__scroll {
    width: 2.8vw;
    margin-inline: auto;
    margin-top: 3.3333333333vw;
  }
}
@media screen and (min-width: 768px) {
  #troyan .mainVisual .mainVisual__scroll--image {
    width: 16px;
  }
}
#troyan .common__heading--wrapper {
  display: flex;
  justify-content: center;
}
#troyan .common__heading {
  writing-mode: vertical-rl;
  font-weight: 500;
  position: relative;
}
@media screen and (min-width: 768px) {
  #troyan .common__heading {
    font-size: 44px;
  }
}
#troyan .common__heading::after {
  content: "";
  display: block;
  position: absolute;
  bottom: 0;
}
@media screen and (min-width: 768px) {
  #troyan .common__heading::after {
    width: 84px;
    height: 74px;
    left: 15px;
    background: url(../images/comm__heading--figure.png) no-repeat center/cover;
  }
}
@media screen and (max-width: 767px) {
  #troyan .common__heading::after {
    width: 11.2vw;
    height: 9.8666666667vw;
    left: 2vw;
    background: url(../images/comm__heading--figure.sp.png) no-repeat center/cover;
  }
}
#troyan .feeling {
  position: relative;
}
@media screen and (min-width: 768px) {
  #troyan .feeling {
    margin-top: 100px;
  }
}
@media screen and (max-width: 767px) {
  #troyan .feeling {
    margin-top: 8vw;
  }
}
@media screen and (min-width: 768px) {
  #troyan .feeling .feeling__inner {
    max-width: 1366px;
    margin-inline: auto;
  }
}
@media screen and (min-width: 768px) {
  #troyan .feeling .feeling__heading {
    margin-bottom: 30px;
    padding-bottom: 90px;
  }
}
@media screen and (max-width: 767px) {
  #troyan .feeling .feeling__heading {
    font-size: 5.8666666667vw;
    padding-bottom: 10.6666666667vw;
    margin-bottom: 2.6666666667vw;
  }
}
@media screen and (min-width: 768px) {
  #troyan .feeling .feeling__column {
    display: flex;
    justify-content: flex-end;
  }
  #troyan .feeling .feeling__column.reverse {
    flex-direction: row-reverse;
  }
  #troyan .feeling .feeling__column.reverse .feeling__column--image {
    margin-left: 0;
    margin-right: 45px;
  }
  #troyan .feeling .feeling__column:not(:first-of-type) {
    margin-top: 20px;
  }
}
@media screen and (min-width: 768px) {
  #troyan .feeling .feeling__column--contents {
    max-width: 510px;
    padding-top: 50px;
  }
}
@media screen and (min-width: 768px) {
  #troyan .feeling .feeling__column--heading {
    font-size: 32px;
  }
  #troyan .feeling .feeling__column--heading span {
    font-size: 24px;
  }
  #troyan .feeling .feeling__column--heading span em {
    letter-spacing: -0.08em;
  }
}
@media screen and (max-width: 767px) {
  #troyan .feeling .feeling__column--heading {
    font-size: 4.5333333333vw;
    text-align: center;
    display: flex;
    align-items: center;
    flex-direction: column;
  }
  #troyan .feeling .feeling__column--heading span {
    display: inline-block;
    margin-top: 0.6666666667vw;
    font-size: 3.7333333333vw;
  }
  #troyan .feeling .feeling__column--heading em {
    letter-spacing: -0.18em;
  }
}
#troyan .feeling .feeling__column--text {
  letter-spacing: -0.04em;
}
@media screen and (min-width: 768px) {
  #troyan .feeling .feeling__column--text {
    font-size: 16px;
    line-height: 2.375;
    margin-top: 45px;
    font-weight: 700;
  }
}
@media screen and (max-width: 767px) {
  #troyan .feeling .feeling__column--text {
    padding-left: 9.3333333333vw;
    padding-right: 9.3333333333vw;
    font-size: 2.9333333333vw;
    line-height: 2.1818181818;
    letter-spacing: -0.03em;
    margin-top: 2.6666666667vw;
  }
}
@media screen and (min-width: 768px) {
  #troyan .feeling .feeling__column--image {
    width: 630px;
    flex-shrink: 0;
    margin-left: 75px;
  }
}
@media screen and (max-width: 767px) {
  #troyan .feeling .feeling__column--image01 {
    margin-top: 7.3333333333vw;
  }
}
@media screen and (max-width: 767px) {
  #troyan .feeling .feeling__column--second {
    margin-top: 6.6666666667vw;
  }
}
@media screen and (min-width: 768px) {
  #troyan .feeling .feeling__column--roots {
    width: 345px;
    margin-top: 30px;
  }
}
@media screen and (max-width: 767px) {
  #troyan .feeling .feeling__column--roots {
    margin-top: 7.3333333333vw;
    width: 64.2666666667vw;
    margin-inline: auto;
  }
}
@media screen and (max-width: 767px) {
  #troyan .feeling .feeling__column--image02 {
    margin-top: 7.3333333333vw;
  }
}
@media screen and (min-width: 768px) {
  #troyan .feeling .feeling__column--flex {
    display: flex;
    align-items: center;
    flex-direction: column;
  }
}
@media screen and (max-width: 767px) {
  #troyan .feeling .feeling__column--flex {
    padding-left: 9.3333333333vw;
    padding-top: 2vw;
  }
}
#troyan .feeling .feeling__column--caption01 {
  font-weight: bold;
}
@media screen and (min-width: 768px) {
  #troyan .feeling .feeling__column--caption01 {
    font-size: 16px;
    margin-top: 30px;
  }
}
@media screen and (max-width: 767px) {
  #troyan .feeling .feeling__column--caption01 {
    font-size: 2.9333333333vw;
  }
}
@media screen and (min-width: 768px) {
  #troyan .feeling .feeling__column--caption02 {
    font-weight: 500;
    font-size: 14px;
    margin-top: 15px;
    line-height: 1.9285714286;
  }
}
@media screen and (max-width: 767px) {
  #troyan .feeling .feeling__column--caption02 {
    font-size: 2.9333333333vw;
    line-height: 1.9090909091;
    margin-top: 2.6666666667vw;
  }
}
@media screen and (min-width: 768px) {
  #troyan .feeling .feeling__movie {
    padding-top: 100px;
  }
}
@media screen and (max-width: 767px) {
  #troyan .feeling .feeling__movie {
    margin-top: 6vw;
  }
}
#troyan .feeling .feeling__movie--heading {
  display: flex;
  flex-direction: column;
  align-items: center;
}
@media screen and (min-width: 768px) {
  #troyan .feeling .feeling__movie--heading {
    font-size: 32px;
    justify-content: center;
  }
  #troyan .feeling .feeling__movie--heading span {
    display: inline-block;
    width: 85px;
    margin-top: 15px;
  }
}
@media screen and (max-width: 767px) {
  #troyan .feeling .feeling__movie--heading {
    text-align: center;
    font-size: 4.5333333333vw;
  }
  #troyan .feeling .feeling__movie--heading span {
    display: block;
    margin-top: 2.6666666667vw;
    width: 13.4666666667vw;
  }
}
#troyan .feeling .feeling__movie--frame {
  margin-inline: auto;
  position: relative;
}
@media screen and (min-width: 768px) {
  #troyan .feeling .feeling__movie--frame {
    width: 825px;
    height: 470px;
    margin-top: 30px;
  }
}
@media screen and (max-width: 767px) {
  #troyan .feeling .feeling__movie--frame {
    margin-top: 4vw;
    width: 92vw;
    height: 52vw;
  }
}
#troyan .feeling .feeling__movie--frame iframe {
  position: absolute;
  width: 100%;
  height: 100%;
}
#troyan .feeling .feeling__movie--text {
  font-weight: bold;
  text-align: center;
}
@media screen and (min-width: 768px) {
  #troyan .feeling .feeling__movie--text {
    font-size: 16px;
    margin-top: 15px;
  }
}
@media screen and (max-width: 767px) {
  #troyan .feeling .feeling__movie--text {
    margin-top: 2vw;
    font-size: 2.9333333333vw;
  }
}
#troyan .creator {
  position: relative;
  font-weight: 500;
}
@media screen and (min-width: 768px) {
  #troyan .creator {
    margin-top: 120px;
  }
}
@media screen and (max-width: 767px) {
  #troyan .creator {
    margin-top: 8vw;
  }
}
@media screen and (min-width: 768px) {
  #troyan .creator .creator__heading {
    padding-bottom: 50px;
  }
}
@media screen and (max-width: 767px) {
  #troyan .creator .creator__heading {
    font-size: 5.8666666667vw;
    padding-bottom: 8.6666666667vw;
  }
}
#troyan .creator .creator__lead {
  text-align: center;
}
@media screen and (min-width: 768px) {
  #troyan .creator .creator__lead {
    margin-top: 30px;
    font-size: 32px;
  }
}
@media screen and (max-width: 767px) {
  #troyan .creator .creator__lead {
    font-size: 4.5333333333vw;
    margin-top: 4vw;
  }
}
#troyan .creator .creator__text {
  text-align: center;
}
@media screen and (min-width: 768px) {
  #troyan .creator .creator__text {
    font-size: 16px;
    margin-top: 20px;
  }
}
@media screen and (max-width: 767px) {
  #troyan .creator .creator__text {
    font-size: 2.9333333333vw;
    line-height: 2.1818181818;
    margin-top: 3.3333333333vw;
  }
}
@media screen and (min-width: 768px) {
  #troyan .creator .creator__list {
    display: flex;
    justify-content: center;
    gap: 20px;
    margin-top: 50px;
  }
}
@media screen and (max-width: 767px) {
  #troyan .creator .creator__list {
    margin-top: 6.6666666667vw;
  }
}
@media screen and (min-width: 768px) {
  #troyan .creator .creator__item {
    width: 490px;
    padding-bottom: 30px;
    display: flex;
    flex-direction: column;
    align-items: center;
  }
}
@media screen and (max-width: 767px) {
  #troyan .creator .creator__item {
    padding-bottom: 13.3333333333vw;
  }
}
#troyan .creator .creator__traditional {
  background-color: #efdcd1;
}
#troyan .creator .creator__innovation {
  background-color: #d0dee1;
}
@media screen and (min-width: 768px) {
  #troyan .creator .creator__item--title {
    width: 396px;
    margin-left: 75px;
  }
}
@media screen and (max-width: 767px) {
  #troyan .creator .creator__item--title {
    width: 82.4vw;
    margin-left: 10vw;
  }
}
#troyan .creator .creator__item--lead {
  text-align: center;
}
@media screen and (min-width: 768px) {
  #troyan .creator .creator__item--lead {
    margin-top: 15px;
    font-size: 16px;
  }
}
@media screen and (max-width: 767px) {
  #troyan .creator .creator__item--lead {
    margin-top: 2.6666666667vw;
    font-size: 2.9333333333vw;
  }
}
@media screen and (min-width: 768px) {
  #troyan .creator .creator__item--image {
    padding-left: 20px;
    padding-right: 20px;
    margin-top: 15px;
  }
}
@media screen and (max-width: 767px) {
  #troyan .creator .creator__item--image {
    width: 79.7333333333vw;
    margin-inline: auto;
    margin-top: 2.6666666667vw;
  }
}
@media screen and (min-width: 768px) {
  #troyan .creator .creator__item--text {
    font-size: 14px;
    line-height: 2.2857142857;
    padding-left: 40px;
    padding-right: 40px;
    margin-top: 25px;
    margin-bottom: 30px;
  }
}
@media screen and (max-width: 767px) {
  #troyan .creator .creator__item--text {
    font-size: 2.9333333333vw;
    padding-left: 14.6666666667vw;
    padding-right: 14.6666666667vw;
    line-height: 2.1818181818;
    margin-top: 4vw;
  }
}
#troyan .creator .creator__item--button {
  display: block;
  background-color: transparent;
  border: none;
  cursor: pointer;
  outline: none;
  padding: 0;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
}
@media screen and (min-width: 768px) {
  #troyan .creator .creator__item--button {
    width: 341px;
    margin-top: auto;
  }
}
@media screen and (max-width: 767px) {
  #troyan .creator .creator__item--button {
    width: 65.6vw;
    margin-inline: auto;
    margin-top: 6vw;
  }
}
#troyan .movie {
  position: relative;
}
@media screen and (min-width: 768px) {
  #troyan .movie {
    margin-top: 100px;
  }
}
@media screen and (max-width: 767px) {
  #troyan .movie {
    margin-top: 6.6666666667vw;
  }
}
#troyan .movie .movie__heading {
  text-align: center;
}
@media screen and (min-width: 768px) {
  #troyan .movie .movie__heading {
    font-size: 32px;
  }
}
@media screen and (max-width: 767px) {
  #troyan .movie .movie__heading {
    font-size: 4.5333333333vw;
  }
}
#troyan .movie .movie__lead {
  text-align: center;
}
@media screen and (min-width: 768px) {
  #troyan .movie .movie__lead {
    font-size: 16px;
    margin-top: 15px;
  }
}
@media screen and (max-width: 767px) {
  #troyan .movie .movie__lead {
    margin-top: 2vw;
    font-size: 2.9333333333vw;
  }
}
#troyan .movie .movie__lead--image {
  margin-inline: auto;
}
@media screen and (min-width: 768px) {
  #troyan .movie .movie__lead--image {
    width: 85px;
    margin-top: 25px;
  }
}
@media screen and (max-width: 767px) {
  #troyan .movie .movie__lead--image {
    width: 13.4666666667vw;
    margin-top: 3.3333333333vw;
  }
}
#troyan .movie .movie__tab {
  display: flex;
  justify-content: center;
}
@media screen and (min-width: 768px) {
  #troyan .movie .movie__tab {
    margin-top: 40px;
    gap: 10px;
  }
}
@media screen and (max-width: 767px) {
  #troyan .movie .movie__tab {
    margin-top: 8vw;
    gap: 1.3333333333vw;
  }
}
#troyan .movie .movie__tab--item {
  cursor: pointer;
  color: #fff;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  font-weight: bold;
  background-color: #808080;
}
@media screen and (min-width: 768px) {
  #troyan .movie .movie__tab--item {
    width: 235px;
    height: 80px;
    border-top-right-radius: 5px;
    border-top-left-radius: 5px;
    font-size: 24px;
  }
  #troyan .movie .movie__tab--item span {
    font-size: 16px;
  }
}
@media screen and (max-width: 767px) {
  #troyan .movie .movie__tab--item {
    width: 31.3333333333vw;
    height: 10.6666666667vw;
    border-top-right-radius: 1.3333333333vw;
    border-top-left-radius: 1.3333333333vw;
    font-size: 3.2vw;
  }
  #troyan .movie .movie__tab--item span {
    font-size: 2.1333333333vw;
  }
}
#troyan .movie .movie__tab--item.is-active[data-id=traditional] {
  background-color: #b80d23;
}
#troyan .movie .movie__tab--item.is-active[data-id=innovation] {
  background-color: #036eb8;
}
#troyan .traditional .story__movie--wrapper {
  position: relative;
}
#troyan .traditional .story__movie--wrapper::after {
  content: "";
  display: block;
  width: 100%;
  position: absolute;
  left: 0;
  bottom: 0;
  background-color: #efdcd1;
}
@media screen and (min-width: 768px) {
  #troyan .traditional .story__movie--wrapper::after {
    height: 55px;
  }
}
@media screen and (max-width: 767px) {
  #troyan .traditional .story__movie--wrapper::after {
    height: 9.3333333333vw;
  }
}
#troyan .traditional .story__bg {
  background-color: #efdcd1;
}
#troyan .traditional .story__contents--lead::before {
  content: "";
  display: block;
  background: url(../images/story__contents--lead01.png) no-repeat center/cover;
}
@media screen and (min-width: 768px) {
  #troyan .traditional .story__contents--lead::before {
    width: 26px;
    height: 20px;
    margin-right: 10px;
  }
}
@media screen and (max-width: 767px) {
  #troyan .traditional .story__contents--lead::before {
    width: 4.5333333333vw;
    height: 3.2vw;
    margin-right: 1.3333333333vw;
  }
}
#troyan .innovation .story__movie--wrapper {
  position: relative;
}
#troyan .innovation .story__movie--wrapper::after {
  content: "";
  display: block;
  width: 100%;
  position: absolute;
  left: 0;
  bottom: 0;
  background-color: #d0dee1;
}
@media screen and (min-width: 768px) {
  #troyan .innovation .story__movie--wrapper::after {
    height: 55px;
  }
}
@media screen and (max-width: 767px) {
  #troyan .innovation .story__movie--wrapper::after {
    height: 9.3333333333vw;
  }
}
#troyan .innovation .story__bg {
  background-color: #d0dee1;
}
#troyan .innovation .story__contents--lead::before {
  content: "";
  display: block;
}
@media screen and (min-width: 768px) {
  #troyan .innovation .story__contents--lead::before {
    width: 26px;
    height: 20px;
    margin-right: 10px;
    background: url(../images/story__contents--lead02.png) no-repeat center/cover;
  }
}
@media screen and (max-width: 767px) {
  #troyan .innovation .story__contents--lead::before {
    width: 4.5333333333vw;
    height: 3.2vw;
    margin-right: 1.3333333333vw;
    background: url(../images/story__contents--lead02.sp.png) no-repeat center/cover;
  }
}
#troyan .story {
  display: none;
}
#troyan .story.is-active {
  display: block;
}
#troyan .story .story__movie {
  position: relative;
  z-index: 2;
  margin-inline: auto;
  background-color: #000;
}
@media screen and (min-width: 768px) {
  #troyan .story .story__movie {
    width: 504px;
    height: 896px;
  }
}
@media screen and (max-width: 767px) {
  #troyan .story .story__movie {
    width: 67.2vw;
    height: 119.4666666667vw;
  }
}
#troyan .story .story__movie iframe {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  top: 0;
  width: auto;
  height: 100%;
}
@media screen and (min-width: 768px) {
  #troyan .story .story__movie iframe {
    aspect-ratio: 792/1408;
  }
}
@media screen and (max-width: 767px) {
  #troyan .story .story__movie iframe {
    aspect-ratio: 498/885;
  }
}
#troyan .story .story__lead {
  text-align: center;
  line-height: 1.8125;
}
@media screen and (min-width: 768px) {
  #troyan .story .story__lead {
    font-size: 16px;
    padding-top: 20px;
  }
}
@media screen and (max-width: 767px) {
  #troyan .story .story__lead {
    font-size: 2.9333333333vw;
    padding-top: 2.6666666667vw;
  }
}
@media screen and (min-width: 768px) {
  #troyan .story .story__flex {
    display: flex;
    justify-content: center;
    margin-top: 55px;
  }
}
@media screen and (min-width: 768px) {
  #troyan .story .story__image {
    flex-shrink: 0;
    width: 520px;
  }
}
@media screen and (max-width: 767px) {
  #troyan .story .story__image {
    display: none;
  }
}
@media screen and (min-width: 768px) {
  #troyan .story .story__contents {
    width: 550px;
  }
}
@media screen and (max-width: 767px) {
  #troyan .story .story__contents {
    margin-top: 6.6666666667vw;
    padding-bottom: 6.6666666667vw;
  }
}
@media screen and (min-width: 768px) {
  #troyan .story .story__contents--heading {
    width: 514px;
    margin-left: 23px;
  }
}
@media screen and (max-width: 767px) {
  #troyan .story .story__contents--heading {
    width: 82.8vw;
    margin-inline: auto;
  }
}
#troyan .story .story__contents--lead {
  font-weight: bold;
  display: flex;
  align-items: center;
}
@media screen and (min-width: 768px) {
  #troyan .story .story__contents--lead {
    font-size: 18px;
    margin-top: 35px;
    margin-bottom: 55px;
    margin-left: 40px;
  }
}
@media screen and (max-width: 767px) {
  #troyan .story .story__contents--lead {
    font-size: 3.2vw;
    margin-top: 4.6666666667vw;
    justify-content: center;
    margin-bottom: 6.6666666667vw;
  }
}
@media screen and (min-width: 768px) {
  #troyan .story .story__contents--block {
    margin-left: 35px;
  }
}
@media screen and (max-width: 767px) {
  #troyan .story .story__contents--block {
    padding-left: 9.3333333333vw;
    padding-right: 9.3333333333vw;
  }
}
@media screen and (min-width: 768px) {
  #troyan .story .story__contents--block:not(:first-of-type) {
    margin-top: 3em;
  }
}
@media screen and (max-width: 767px) {
  #troyan .story .story__contents--block:not(:first-of-type) {
    margin-top: 8vw;
  }
}
#troyan .story .story__contents--title {
  font-weight: bold;
}
@media screen and (min-width: 768px) {
  #troyan .story .story__contents--title {
    font-size: 16px;
  }
}
@media screen and (max-width: 767px) {
  #troyan .story .story__contents--title {
    font-size: 2.9333333333vw;
  }
}
#troyan .story .story__contents--text {
  line-height: 2.375;
  margin-top: 1em;
}
@media screen and (min-width: 768px) {
  #troyan .story .story__contents--text {
    font-size: 16px;
    letter-spacing: -0.08em;
  }
  #troyan .story .story__contents--text span {
    font-weight: bold;
    font-size: 18px;
  }
}
@media screen and (max-width: 767px) {
  #troyan .story .story__contents--text {
    font-size: 2.9333333333vw;
  }
  #troyan .story .story__contents--text span {
    font-weight: bold;
    font-size: 2.9333333333vw;
  }
}
#troyan .process {
  position: relative;
}
@media screen and (min-width: 768px) {
  #troyan .process {
    margin-top: 110px;
  }
}
@media screen and (max-width: 767px) {
  #troyan .process {
    margin-top: 8vw;
  }
}
@media screen and (min-width: 768px) {
  #troyan .process .process__heading {
    font-size: 44px;
    padding-bottom: 45px;
  }
}
@media screen and (max-width: 767px) {
  #troyan .process .process__heading {
    font-size: 5.8666666667vw;
    padding-bottom: 6.6666666667vw;
  }
}
#troyan .process .process__lead {
  text-align: center;
}
@media screen and (min-width: 768px) {
  #troyan .process .process__lead {
    font-size: 32px;
    margin-top: 30px;
  }
}
@media screen and (max-width: 767px) {
  #troyan .process .process__lead {
    font-size: 4.5333333333vw;
    margin-top: 4vw;
  }
}
#troyan .process .process__text {
  text-align: center;
}
@media screen and (min-width: 768px) {
  #troyan .process .process__text {
    font-size: 16px;
    margin-top: 20px;
  }
}
@media screen and (max-width: 767px) {
  #troyan .process .process__text {
    font-size: 2.9333333333vw;
    margin-top: 2.6666666667vw;
    line-height: 2;
  }
}
#troyan .process .process__list {
  display: flex;
  justify-content: center;
}
@media screen and (min-width: 768px) {
  #troyan .process .process__list {
    margin-top: 45px;
    gap: 15px;
  }
}
@media screen and (max-width: 767px) {
  #troyan .process .process__list {
    margin-top: 4vw;
    flex-wrap: wrap;
    gap: 4.9333333333vw;
  }
}
@media screen and (min-width: 768px) {
  #troyan .process .process__item {
    width: 231px;
  }
}
@media screen and (max-width: 767px) {
  #troyan .process .process__item {
    width: 43.6vw;
  }
}
@media screen and (min-width: 768px) {
  #troyan .process .process__item--title {
    font-size: 18px;
    margin-top: 15px;
  }
}
@media screen and (max-width: 767px) {
  #troyan .process .process__item--title {
    font-size: 3.4666666667vw;
    margin-top: 2.6666666667vw;
  }
}
@media screen and (min-width: 768px) {
  #troyan .process .process__item--text {
    font-size: 14px;
    line-height: 2.2857142857;
    margin-top: 7px;
    letter-spacing: -0.08em;
  }
}
@media screen and (max-width: 767px) {
  #troyan .process .process__item--text {
    font-size: 2.9333333333vw;
    margin-top: 2.6666666667vw;
    line-height: 2.1818181818;
  }
}
#troyan .process .process__image {
  position: relative;
}
@media screen and (min-width: 768px) {
  #troyan .process .process__image {
    margin-top: 110px;
  }
}
@media screen and (max-width: 767px) {
  #troyan .process .process__image {
    margin-top: 12vw;
  }
}
@media screen and (min-width: 768px) {
  #troyan .process .process__image--inner {
    position: absolute;
    width: 900px;
    height: 100%;
    left: 50%;
    top: 0;
    transform: translateX(-50%);
  }
}
#troyan .process .process__image--contents {
  position: absolute;
  left: 0;
  bottom: 0;
  background-color: rgba(255, 255, 255, 0.7);
}
@media screen and (min-width: 768px) {
  #troyan .process .process__image--contents {
    width: 490px;
    height: 105px;
    padding: 15px;
  }
}
@media screen and (max-width: 767px) {
  #troyan .process .process__image--contents {
    display: flex;
    flex-direction: column;
    justify-content: center;
    left: 6.6666666667vw;
    width: 66.6666666667vw;
    height: 25.3333333333vw;
    padding-left: 3.3333333333vw;
    padding-right: 3.3333333333vw;
  }
}
@media screen and (min-width: 768px) {
  #troyan .process .process__image--title {
    font-size: 18px;
  }
}
@media screen and (max-width: 767px) {
  #troyan .process .process__image--title {
    font-size: 3.6vw;
  }
}
#troyan .process .process__image--text {
  letter-spacing: -0.04em;
}
@media screen and (min-width: 768px) {
  #troyan .process .process__image--text {
    font-size: 14px;
    line-height: 1.7142857143;
    margin-top: 5px;
  }
}
@media screen and (max-width: 767px) {
  #troyan .process .process__image--text {
    font-size: 2.6666666667vw;
    line-height: 2.1;
  }
}
@media screen and (min-width: 768px) {
  #troyan .flow {
    margin-top: 145px;
  }
}
@media screen and (max-width: 767px) {
  #troyan .flow {
    margin-top: 9.3333333333vw;
  }
}
#troyan .flow .flow__heading {
  display: flex;
  justify-content: center;
}
#troyan .flow .flow__heading--inner {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}
#troyan .flow .flow__heading--inner::before {
  content: "";
  display: block;
  position: absolute;
}
@media screen and (min-width: 768px) {
  #troyan .flow .flow__heading--inner::before {
    width: 89px;
    height: 69px;
    left: -40px;
    top: -25px;
    background: url(../images/flow__heading01.png) no-repeat center/cover;
  }
}
@media screen and (max-width: 767px) {
  #troyan .flow .flow__heading--inner::before {
    width: 19.6vw;
    height: 15.0666666667vw;
    left: -12vw;
    top: -4.6666666667vw;
    background: url(../images/flow__heading01.sp.png) no-repeat center/cover;
  }
}
#troyan .flow .flow__heading--inner::after {
  content: "";
  display: block;
  position: absolute;
}
@media screen and (min-width: 768px) {
  #troyan .flow .flow__heading--inner::after {
    width: 83px;
    height: 73px;
    right: -70px;
    bottom: -35px;
    background: url(../images/flow__heading02.png) no-repeat center/cover;
  }
}
@media screen and (max-width: 767px) {
  #troyan .flow .flow__heading--inner::after {
    width: 18.1333333333vw;
    height: 16vw;
    right: -16vw;
    bottom: -1.3333333333vw;
    background: url(../images/flow__heading02.sp.png) no-repeat center/cover;
  }
}
#troyan .flow .flow__heading--lead {
  font-weight: bold;
}
@media screen and (min-width: 768px) {
  #troyan .flow .flow__heading--lead {
    font-size: 14px;
  }
}
@media screen and (max-width: 767px) {
  #troyan .flow .flow__heading--lead {
    text-align: center;
    font-size: 2.9333333333vw;
  }
}
@media screen and (min-width: 768px) {
  #troyan .flow .flow__heading--text {
    letter-spacing: -0.16em;
    font-size: 32px;
  }
}
@media screen and (max-width: 767px) {
  #troyan .flow .flow__heading--text {
    text-align: center;
    font-size: 4.5333333333vw;
    margin-top: 2vw;
  }
}
#troyan .flow .flow__list {
  display: flex;
  flex-direction: column;
  align-items: center;
}
@media screen and (min-width: 768px) {
  #troyan .flow .flow__list {
    gap: 45px;
    margin-top: 50px;
  }
}
@media screen and (max-width: 767px) {
  #troyan .flow .flow__list {
    margin-top: 5.3333333333vw;
    gap: 12vw;
  }
}
#troyan .flow .flow__item {
  position: relative;
}
@media screen and (min-width: 768px) {
  #troyan .flow .flow__item {
    display: flex;
    align-items: center;
  }
}
@media screen and (max-width: 767px) {
  #troyan .flow .flow__item {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
  }
}
#troyan .flow .flow__item:not(:first-of-type)::before {
  content: "";
  display: block;
  position: absolute;
  left: 50%;
  bottom: 100%;
}
@media screen and (min-width: 768px) {
  #troyan .flow .flow__item:not(:first-of-type)::before {
    width: 10px;
    height: 24px;
    transform: translate(-50%, -30%);
    background: url(../images/flow__arrow.png) no-repeat center/cover;
  }
}
@media screen and (max-width: 767px) {
  #troyan .flow .flow__item:not(:first-of-type)::before {
    width: 2.2666666667vw;
    height: 5.8666666667vw;
    transform: translate(50%, -60%);
    background: url(../images/flow__arrow.sp.png) no-repeat center/cover;
  }
}
@media screen and (min-width: 768px) {
  #troyan .flow .flow__item--image {
    width: 135px;
    display: flex;
    justify-content: center;
  }
}
@media screen and (min-width: 768px) {
  #troyan .flow .flow__item--text {
    width: 525px;
    font-size: 14px;
    line-height: 2.2857142857;
    margin-left: 30px;
  }
}
@media screen and (max-width: 767px) {
  #troyan .flow .flow__item--text {
    padding-left: 13.3333333333vw;
    padding-right: 13.3333333333vw;
    font-size: 2.9333333333vw;
    line-height: 2.1818181818;
    margin-top: 2.6666666667vw;
  }
}
@media screen and (min-width: 768px) {
  #troyan .flow .flow__item01 {
    width: 120px;
  }
}
@media screen and (max-width: 767px) {
  #troyan .flow .flow__item01 {
    width: 23.0666666667vw;
  }
}
@media screen and (min-width: 768px) {
  #troyan .flow .flow__item02 {
    width: 131px;
  }
}
@media screen and (max-width: 767px) {
  #troyan .flow .flow__item02 {
    width: 32.4vw;
  }
}
@media screen and (min-width: 768px) {
  #troyan .flow .flow__item03 {
    width: 103px;
  }
}
@media screen and (max-width: 767px) {
  #troyan .flow .flow__item03 {
    width: 20.1333333333vw;
  }
}
@media screen and (min-width: 768px) {
  #troyan .flow .flow__item04 {
    width: 135px;
  }
}
@media screen and (max-width: 767px) {
  #troyan .flow .flow__item04 {
    width: 24vw;
  }
}
@media screen and (min-width: 768px) {
  #troyan .flow .flow__item05 {
    width: 127px;
  }
}
@media screen and (max-width: 767px) {
  #troyan .flow .flow__item05 {
    width: 23.0666666667vw;
  }
}
@media screen and (min-width: 768px) {
  #troyan .flow .flow__image {
    margin-top: 120px;
  }
}
@media screen and (max-width: 767px) {
  #troyan .flow .flow__image {
    display: none;
  }
}
@media screen and (max-width: 767px) {
  #troyan .flow .flow__slider {
    margin-top: 8vw;
  }
}
#troyan .spec {
  position: relative;
}
@media screen and (min-width: 768px) {
  #troyan .spec {
    margin-top: 120px;
  }
}
@media screen and (max-width: 767px) {
  #troyan .spec {
    margin-top: 8vw;
  }
}
@media screen and (min-width: 768px) {
  #troyan .spec .spec__heading {
    font-size: 44px;
    padding-bottom: 45px;
  }
}
@media screen and (max-width: 767px) {
  #troyan .spec .spec__heading {
    font-size: 5.8666666667vw;
    padding-bottom: 8vw;
  }
}
#troyan .spec .spec__lead {
  text-align: center;
}
@media screen and (min-width: 768px) {
  #troyan .spec .spec__lead {
    font-size: 32px;
    margin-top: 50px;
  }
}
@media screen and (max-width: 767px) {
  #troyan .spec .spec__lead {
    margin-top: 4vw;
    font-size: 4.5333333333vw;
  }
}
#troyan .spec .spec__note {
  text-align: center;
}
@media screen and (min-width: 768px) {
  #troyan .spec .spec__note {
    font-size: 16px;
    margin-top: 10px;
  }
}
@media screen and (max-width: 767px) {
  #troyan .spec .spec__note {
    font-size: 2.9333333333vw;
    margin-top: 2vw;
  }
}
#troyan .spec .spec__list {
  display: flex;
  margin-inline: auto;
  border-bottom: 1px solid #280000;
}
@media screen and (min-width: 768px) {
  #troyan .spec .spec__list {
    width: 670px;
    padding-left: 90px;
    padding-top: 25px;
    padding-bottom: 25px;
  }
}
@media screen and (max-width: 767px) {
  #troyan .spec .spec__list {
    width: 89.3333333333vw;
    height: 9.3333333333vw;
    padding-left: 12vw;
    align-items: center;
  }
}
#troyan .spec .spec__list:first-of-type {
  border-top: 1px solid #280000;
}
@media screen and (min-width: 768px) {
  #troyan .spec .spec__list:first-of-type {
    margin-top: 30px;
  }
}
@media screen and (max-width: 767px) {
  #troyan .spec .spec__list:first-of-type {
    margin-top: 4vw;
  }
}
@media screen and (min-width: 768px) {
  #troyan .spec .spec__list dt {
    min-width: 90px;
    margin-right: 70px;
    font-size: 16px;
  }
}
@media screen and (max-width: 767px) {
  #troyan .spec .spec__list dt {
    width: 21.3333333333vw;
    font-size: 2.9333333333vw;
  }
}
#troyan .spec .spec__list dd {
  display: flex;
  align-items: center;
}
@media screen and (min-width: 768px) {
  #troyan .spec .spec__list dd {
    font-size: 16px;
  }
}
@media screen and (max-width: 767px) {
  #troyan .spec .spec__list dd {
    font-size: 2.9333333333vw;
  }
}
@media screen and (min-width: 768px) {
  #troyan .spec .spec__list .spec__check {
    width: 18px;
    margin-right: 10px;
  }
}
@media screen and (max-width: 767px) {
  #troyan .spec .spec__list .spec__check {
    width: 2.8vw;
    margin-right: 1.3333333333vw;
  }
}
@media screen and (min-width: 768px) {
  #troyan .spec .spec__list .spec__mark {
    width: 18px;
    margin-right: 10px;
  }
}
@media screen and (max-width: 767px) {
  #troyan .spec .spec__list .spec__mark {
    width: 2.8vw;
    margin-right: 1.3333333333vw;
  }
}
#troyan .spec .spec__info--title {
  display: flex;
  flex-direction: column;
  align-items: center;
}
@media screen and (min-width: 768px) {
  #troyan .spec .spec__info--title {
    font-size: 18px;
    margin-top: 30px;
  }
}
@media screen and (max-width: 767px) {
  #troyan .spec .spec__info--title {
    font-size: 3.4666666667vw;
    margin-top: 5.3333333333vw;
  }
}
@media screen and (min-width: 768px) {
  #troyan .spec .spec__info {
    width: 30px;
    margin-bottom: 10px;
  }
}
@media screen and (max-width: 767px) {
  #troyan .spec .spec__info {
    display: block;
    margin-bottom: 2vw;
    width: 6vw;
  }
}
@media screen and (min-width: 768px) {
  #troyan .spec .spec__info--text {
    width: 550px;
    font-size: 16px;
    line-height: 2.375;
    margin-top: 20px;
    margin-inline: auto;
  }
}
@media screen and (max-width: 767px) {
  #troyan .spec .spec__info--text {
    line-height: 2.1818181818;
    font-size: 2.9333333333vw;
    margin-top: 2.6666666667vw;
    padding-left: 14.6666666667vw;
    padding-right: 14.6666666667vw;
  }
}
@media screen and (min-width: 768px) {
  #troyan .idea {
    margin-top: 110px;
  }
}
@media screen and (max-width: 767px) {
  #troyan .idea {
    margin-top: 13.3333333333vw;
  }
}
#troyan .idea .idea__heading {
  text-align: center;
}
@media screen and (min-width: 768px) {
  #troyan .idea .idea__heading {
    font-size: 32px;
  }
}
@media screen and (max-width: 767px) {
  #troyan .idea .idea__heading {
    font-size: 4.5333333333vw;
  }
}
#troyan .idea .idea__lead {
  text-align: center;
}
@media screen and (min-width: 768px) {
  #troyan .idea .idea__lead {
    font-size: 16px;
    margin-top: 10px;
  }
}
@media screen and (max-width: 767px) {
  #troyan .idea .idea__lead {
    font-size: 2.9333333333vw;
    margin-top: 2vw;
  }
}
#troyan .idea .idea__list {
  display: flex;
  justify-content: center;
}
@media screen and (min-width: 768px) {
  #troyan .idea .idea__list {
    gap: 30px;
    margin-top: 30px;
  }
}
@media screen and (max-width: 767px) {
  #troyan .idea .idea__list {
    margin-top: 4.6666666667vw;
    flex-direction: column;
    align-items: center;
    gap: 6.6666666667vw;
  }
}
@media screen and (min-width: 768px) {
  #troyan .idea .idea__item {
    width: 310px;
  }
}
@media screen and (max-width: 767px) {
  #troyan .idea .idea__item {
    width: 67.3333333333vw;
  }
}
#troyan .idea .idea__item--en {
  font-weight: bold;
}
@media screen and (min-width: 768px) {
  #troyan .idea .idea__item--en {
    font-size: 14px;
    margin-top: 20px;
  }
}
@media screen and (max-width: 767px) {
  #troyan .idea .idea__item--en {
    font-size: 3.2vw;
    margin-top: 1.3333333333vw;
    letter-spacing: 0.18em;
  }
}
@media screen and (min-width: 768px) {
  #troyan .idea .ide__item--title {
    margin-top: 5px;
    font-size: 18px;
  }
}
@media screen and (max-width: 767px) {
  #troyan .idea .ide__item--title {
    margin-top: 2vw;
    font-size: 3.4666666667vw;
  }
}
@media screen and (min-width: 768px) {
  #troyan .idea .idea__item--text {
    font-size: 14px;
    line-height: 2;
    margin-top: 5px;
  }
}
@media screen and (max-width: 767px) {
  #troyan .idea .idea__item--text {
    font-size: 2.9333333333vw;
    margin-top: 2vw;
    line-height: 2.1818181818;
  }
}
@media screen and (min-width: 768px) {
  #troyan .campaign {
    margin-top: 110px;
  }
}
@media screen and (max-width: 767px) {
  #troyan .campaign {
    margin-top: 9.3333333333vw;
  }
}
#troyan .campaign .campaign__heading {
  text-align: center;
}
@media screen and (min-width: 768px) {
  #troyan .campaign .campaign__heading {
    font-size: 32px;
  }
}
@media screen and (max-width: 767px) {
  #troyan .campaign .campaign__heading {
    font-size: 4.5333333333vw;
  }
}
#troyan .campaign .campaign__text {
  text-align: center;
}
@media screen and (min-width: 768px) {
  #troyan .campaign .campaign__text {
    font-size: 16px;
    line-height: 2.375;
    margin-top: 30px;
    margin-bottom: 40px;
  }
}
@media screen and (max-width: 767px) {
  #troyan .campaign .campaign__text {
    font-size: 2.9333333333vw;
    line-height: 2.1818181818;
    margin-top: 4vw;
    margin-bottom: 7.3333333333vw;
  }
}
#troyan .campaign .campaign__title {
  text-align: center;
  font-weight: bold;
}
@media screen and (min-width: 768px) {
  #troyan .campaign .campaign__title {
    font-size: 16px;
    margin-top: 50px;
  }
}
@media screen and (max-width: 767px) {
  #troyan .campaign .campaign__title {
    letter-spacing: 0.18em;
    font-size: 3.2vw;
    margin-top: 8vw;
  }
}
#troyan .campaign .campaign__button {
  display: block;
  margin-inline: auto;
}
@media screen and (min-width: 768px) {
  #troyan .campaign .campaign__button {
    width: 621px;
    margin-top: 25px;
  }
}
@media screen and (max-width: 767px) {
  #troyan .campaign .campaign__button {
    width: 80.4vw;
    margin-top: 3.3333333333vw;
  }
}
#troyan .campaign .campaign__note {
  text-align: center;
}
@media screen and (min-width: 768px) {
  #troyan .campaign .campaign__note {
    font-size: 14px;
    margin-top: 15px;
  }
}
@media screen and (max-width: 767px) {
  #troyan .campaign .campaign__note {
    margin-top: 3.3333333333vw;
    font-size: 2.6666666667vw;
  }
}
#troyan .campaign .campaign__anchor {
  display: flex;
  justify-content: center;
}
@media screen and (min-width: 768px) {
  #troyan .campaign .campaign__anchor {
    margin-top: 40px;
    gap: 65px;
  }
}
@media screen and (max-width: 767px) {
  #troyan .campaign .campaign__anchor {
    margin-top: 7.3333333333vw;
    gap: 10.6666666667vw;
  }
}
@media screen and (min-width: 768px) {
  #troyan .campaign .campaign__anchor--item {
    width: 100px;
  }
}
@media screen and (max-width: 767px) {
  #troyan .campaign .campaign__anchor--item {
    width: 19.6vw;
  }
}
#troyan .campaign .campaign__anchor--link {
  display: flex;
  justify-content: center;
  width: 100%;
  border-bottom: 1px solid #280000;
  font-weight: 500;
}
@media screen and (min-width: 768px) {
  #troyan .campaign .campaign__anchor--link {
    padding-bottom: 10px;
    font-size: 14px;
  }
}
@media screen and (max-width: 767px) {
  #troyan .campaign .campaign__anchor--link {
    padding-bottom: 1.3333333333vw;
    font-size: 2.9333333333vw;
  }
}
#troyan .page__anchor {
  position: absolute;
  width: 100%;
  height: 1px;
}
@media screen and (min-width: 768px) {
  #troyan .page__anchor {
    top: -150px;
  }
}
@media screen and (max-width: 767px) {
  #troyan .page__anchor {
    top: -20vw;
  }
}
#troyan .pageTop__border {
  width: 100%;
}
@media screen and (min-width: 768px) {
  #troyan .pageTop__border {
    padding-bottom: 100px;
  }
}
@media screen and (max-width: 767px) {
  #troyan .pageTop__border {
    padding-bottom: 8vw;
  }
}
#troyan .pageTop {
  position: fixed;
}
#troyan .pageTop.is-stuck {
  position: absolute;
}
@media screen and (min-width: 768px) {
  #troyan .pageTop {
    right: 30px;
    bottom: 30px;
  }
}
@media screen and (max-width: 767px) {
  #troyan .pageTop {
    right: 2.6666666667vw;
    bottom: 4vw;
  }
}
#troyan .pageTop .pageTop__link {
  display: block;
}
@media screen and (min-width: 768px) {
  #troyan .pageTop .pageTop__link {
    width: 16px;
  }
}
@media screen and (max-width: 767px) {
  #troyan .pageTop .pageTop__link {
    width: 2.5333333333vw;
  }
}
@media screen and (max-width: 767px) {
  #troyan .splide__slide {
    width: 182vw;
  }
}