@charset "UTF-8";
/* flex containers에 적용 */
/* flex items에 적용 */
/** 사용 예시
 	// 속성, 값, 최소값(기본값 0; 생략가능)
	* @include vw-convert-pc(margin, (20, auto, 40, auto), 10)
	* @include vw-convert-pc(width, 1200);
*/
@font-face {
  font-family: "Pretendard";
  font-weight: 400;
  src: url(/tftset17/font/Pretendard-Regular-76a1283c27610a9ad7d6940b9b174e46.woff2) format("woff2");
}
@font-face {
  font-family: "Pretendard";
  font-weight: 500;
  src: url(/tftset17/font/Pretendard-Medium-65d0a735617322a4fe0bcc5350642159.woff2) format("woff2");
}
@font-face {
  font-family: "Pretendard";
  font-weight: 600;
  src: url(/tftset17/font/Pretendard-SemiBold-d3b288a528801dae385d6f104693e022.woff2) format("woff2");
}
@font-face {
  font-family: "Pretendard";
  font-weight: 700;
  src: url(/tftset17/font/Pretendard-Bold-33860c9446a2671456e4619020774137.woff2) format("woff2");
}
@font-face {
  font-family: "Pretendard";
  font-weight: 800;
  src: url(/tftset17/font/Pretendard-ExtraBold-4e75935a8e92c6b078d8e1bafd81cb42.woff2) format("woff2");
}
@font-face {
  font-family: "Pretendard";
  font-weight: 900;
  src: url(/tftset17/font/Pretendard-Black-2af430c08505f68fe8ccbd974e4c85f1.woff2) format("woff2");
}
@font-face {
  font-family: "Sachsenwald";
  font-weight: 400;
  src: url(/tftset17/font/SachsenwaldRegular-1315492ba967ec6294d71908cc7ff89e.woff2) format("woff2");
}
@font-face {
  font-family: "Giovanni";
  font-weight: 400;
  src: url(/tftset17/font/ITCGiovanniBook-7a946a19886c1f6e997f675890f1d95f.woff2) format("woff2");
}
@font-face {
  font-family: "DNF Forged Blade";
  font-weight: 500;
  src: url(/tftset17/font/DNFForgedBlade-Medium-a7b1253b9f75b9172fe8cdeb4817ce06.woff2) format("woff2");
}
@font-face {
  font-family: "DNF Forged Blade";
  font-weight: 700;
  src: url(/tftset17/font/DNFForgedBlade-Bold-9a5151a5dc9550fda51c36817c569eea.woff2) format("woff2");
}
@font-face {
  font-family: "Inter";
  font-weight: 400;
  src: url(/tftset17/font/Inter-Regular-b6204e253064e05f23f58f46e9d32d8d.woff2) format("woff2");
}
@font-face {
  font-family: "Inter";
  font-weight: 500;
  src: url(/tftset17/font/Inter-Medium-f7656ebefaa01fb7d1f53e221d01ecc1.woff2) format("woff2");
}
@font-face {
  font-family: "Inter";
  font-weight: 600;
  src: url(/tftset17/font/Inter-SemiBold-728a6fb342d6756e4d46111039a4f201.woff2) format("woff2");
}
@font-face {
  font-family: "Inter";
  font-weight: 700;
  src: url(/tftset17/font/Inter-Bold-4c7e8c21fb1f01a74b10ccfc0c96ae96.woff2) format("woff2");
}
@font-face {
  font-family: "DNF Forged Blade";
  font-weight: 300;
  src: url(/tftset17/font/DNFForgedBlade-Light-93502f0d7eb48121fedc097c58b4deb6.woff2) format("woff2");
}
body,
div,
dl,
dt,
dd,
ul,
ol,
li,
h1,
h2,
h3,
h4,
h5,
h6,
p,
table,
th,
td,
form,
fieldset,
legend,
textarea,
input,
select,
textarea,
button,
article,
aside,
dialog,
footer,
header,
section,
footer,
nav,
figure,
main {
  margin: 0;
  padding: 0;
}

* {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

article,
aside,
dialog,
footer,
header,
section,
footer,
nav,
figure,
main {
  display: block;
}

html,
body {
  height: 100%;
  -webkit-text-size-adjust: none;
  -ms-text-size-adjust: none;
}

img,
form,
fieldset,
svg,
li {
  border: 0;
  vertical-align: top;
}

ul,
ol {
  list-style: none;
}

button {
  overflow: visible;
  border: 0;
  background-color: transparent;
  cursor: pointer;
}

button:disabled {
  cursor: default;
}

button::-moz-focus-inner {
  padding: 0;
  margin: -1px;
}

input,
button,
select {
  -webkit-border-radius: 0;
  border-radius: 0;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
}

address,
caption,
em {
  font-style: normal;
}

a,
a:focus,
a:active,
a:hover {
  text-decoration: none;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

body, input, select, textarea, button {
  font-family: "Pretendard";
  font-weight: 400;
  font-size: clamp(0px, 0.625vw, 16px);
  color: #000;
}

.blind,
caption span,
legend {
  overflow: hidden;
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  clip: rect(0, 0, 0, 0);
}

.skip {
  height: 0;
}

.skip a {
  display: block;
  position: absolute;
  left: 0;
  top: -100px;
  width: 100%;
  height: 25px;
  text-align: center;
}

.skip a:focus,
#skip a:active {
  position: absolute;
  top: 0;
  z-index: 100;
  padding: 10px 0;
  background: #000;
  font-weight: bold;
  color: #fff;
  font-size: 20px;
  text-decoration: none;
}

img {
  max-height: 100%;
  max-width: 100%;
  -o-object-fit: cover;
  object-fit: cover;
  display: block;
}

.section {
  position: relative;
  width: 100%;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

.btn {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
}

.character {
  position: absolute;
  pointer-events: none;
}
.character::before {
  display: inline-block;
  background-repeat: no-repeat;
  -webkit-background-size: cover;
  background-size: cover;
  background-position: center;
  content: "";
}

.section_head .subtitle {
  text-align: center;
  font-family: "Giovanni";
  font-size: clamp(0px, 0.78125vw, 20px);
  font-weight: 400;
  line-height: 1.4;
  color: #fcf8e0;
  letter-spacing: clamp(-1000px, 0.3125vw, 8px);
}
.section_head .title {
  margin-top: clamp(-1000px, 0.3125vw, 8px);
}
.section_head .title .img {
  margin: 0 auto;
}
.section_head .desc {
  margin-top: clamp(-1000px, 0.3515625vw, 9px);
  text-align: center;
  font-size: clamp(0px, 0.78125vw, 20px);
  font-weight: 400;
  line-height: 1.4;
  color: #fcf8e0;
}
@media screen and (max-width: 768px) {
  .section_head .subtitle {
    font-size: clamp(0px, 2.6041666667vw, 20px);
    font-weight: 400;
    line-height: 1.4;
    letter-spacing: clamp(0px, 1.0416666667vw, 8px);
  }
  .section_head .title {
    margin-top: clamp(0px, 1.0416666667vw, 8px);
  }
  .section_head .desc {
    margin-top: clamp(0px, 1.0416666667vw, 8px);
    font-size: clamp(0px, 2.8645833333vw, 22px);
    font-weight: 400;
    line-height: 1.27;
  }
}

.notice_list {
  margin-top: clamp(-1000px, 0.9375vw, 24px);
}
.notice_item {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  font-size: clamp(0px, 0.546875vw, 14px);
  font-weight: 400;
  line-height: 1.36;
  color: rgba(255, 255, 255, 0.5);
  word-break: keep-all;
}
.notice_item::before {
  margin-right: 4px;
  content: "※";
}
@media screen and (max-width: 768px) {
  .notice_item.only_mo {
    display: -webkit-box !important;
    display: -ms-flexbox !important;
    display: flex !important;
  }
}
@media screen and (max-width: 768px) {
  .notice_list {
    margin-top: clamp(0px, 4.4270833333vw, 34px);
  }
  .notice_item {
    font-size: clamp(0px, 2.34375vw, 18px);
    font-weight: 500;
    line-height: 1.4;
  }
}

.line_decor {
  position: absolute;
  top: 0;
  width: clamp(-1000px, 2.34375vw, 60px);
  height: 100%;
}
.line_decor_left {
  left: clamp(-1000px, 1.484375vw, 38px);
}
.line_decor_right {
  right: clamp(-1000px, 1.484375vw, 38px);
}
@media screen and (max-width: 768px) {
  .line_decor {
    display: none;
  }
}

.btn_check {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  gap: clamp(-1000px, 0.390625vw, 10px);
  width: clamp(-1000px, 17.1875vw, 440px);
  height: clamp(-1000px, 3.515625vw, 90px);
  margin-right: auto;
  margin-left: auto;
  background: url(/tftset17/img/btn_check-6be725b4efb7c58baa684161e8066c86.png) no-repeat center/100% 100%;
  font-size: clamp(0px, 1.015625vw, 26px);
  font-weight: 800;
  line-height: 1.84;
  -webkit-transition: color 0.3s linear, background 0.3s linear;
  transition: color 0.3s linear, background 0.3s linear;
  color: #453a17;
  -webkit-filter: drop-shadow(0px 6px 6px rgba(102, 75, 44, 0.2509803922));
  filter: drop-shadow(0px 6px 6px rgba(102, 75, 44, 0.2509803922));
}
@media screen and (max-width: 1920px) {
  .btn_check {
    -webkit-filter: drop-shadow(0 0.3125vw 0.3125vw rgba(102, 75, 44, 0.2509803922));
    filter: drop-shadow(0 0.3125vw 0.3125vw rgba(102, 75, 44, 0.2509803922));
  }
}
.btn_check:hover {
  background: url(/tftset17/img/btn_check_hover-99d8ab85e9ac8b02d141c4214d3a8c9f.png) no-repeat center/100% 100%;
  color: #a76700;
}
.btn_check:hover::before, .btn_check:hover::after {
  background: url(/tftset17/img/ic_btn_check_hover-fee5cba526894d7658ac67d83307a62f.png) no-repeat center/cover;
}
.btn_check.is_disabled {
  background: url(/tftset17/img/btn_check_disabled-9d01e191a72dfbed7efd264ba228309c.png) no-repeat center/100% 100%;
  color: #a19584;
  -webkit-filter: drop-shadow(0px 6px 6px 0px rgba(102, 75, 44, 0.2509803922));
  filter: drop-shadow(0px 6px 6px 0px rgba(102, 75, 44, 0.2509803922));
  pointer-events: none;
}
.btn_check.is_disabled::before, .btn_check.is_disabled::after {
  background: url(/tftset17/img/ic_btn_check_disabled-a89c5630cbdf9ebc89eb3fc8312049ac.png) no-repeat center/cover;
}
@media screen and (max-width: 768px) {
  .btn_check.is_disabled {
    background: url(/tftset17/img/btn_check_disabled_mo-cb11e917c6e51fcb78e939695f78adf4.png) no-repeat center/100% 100%;
  }
}
.btn_check::before, .btn_check::after {
  width: clamp(-1000px, 1.171875vw, 30px);
  height: clamp(-1000px, 1.6796875vw, 43px);
  background: url(/tftset17/img/ic_btn_check_default-ab6b3fbc800b33e0c68e82f4039cd777.png) no-repeat center/cover;
  -webkit-transition: background 0.3s linear;
  transition: background 0.3s linear;
  content: "";
}
.btn_check::after {
  -webkit-transform: rotateY(-180deg);
  transform: rotateY(-180deg);
}
@media screen and (max-width: 768px) {
  .btn_check {
    gap: clamp(0px, 1.0416666667vw, 8px);
    width: clamp(0px, 53.6458333333vw, 412px);
    height: clamp(0px, 13.0208333333vw, 100px);
    font-size: clamp(0px, 3.125vw, 24px);
    font-weight: 800;
    line-height: 1.75;
    -webkit-filter: drop-shadow(0px 1.0417vw 1.0417vw rgba(0, 0, 0, 0.3019607843));
    filter: drop-shadow(0px 1.0417vw 1.0417vw rgba(0, 0, 0, 0.3019607843));
  }
  .btn_check::before, .btn_check::after {
    width: clamp(0px, 4.6875vw, 36px);
    height: clamp(0px, 6.7708333333vw, 52px);
  }
}

.animate {
  opacity: 0.0001;
  -webkit-transform: translateY(50px);
  transform: translateY(50px);
  -webkit-transition-property: opacity, -webkit-transform;
  transition-property: opacity, -webkit-transform;
  transition-property: opacity, transform;
  transition-property: opacity, transform, -webkit-transform;
  -webkit-transition-duration: 0.5s;
  transition-duration: 0.5s;
  -webkit-transition-timing-function: cubic-bezier(0.39, 0.58, 0.57, 1);
  transition-timing-function: cubic-bezier(0.39, 0.58, 0.57, 1);
  -webkit-transition-delay: calc(var(--i) * 0.2s);
  transition-delay: calc(var(--i) * 0.2s);
}
.animate.is_show {
  opacity: 1;
  -webkit-transform: translateY(0);
  transform: translateY(0);
}
@media screen and (max-width: 768px) {
  .animate {
    -webkit-transform: translateY(6.5vw);
    transform: translateY(6.5vw);
  }
}

.animate_left {
  opacity: 0;
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%);
  -webkit-animation: 0.6s 0.4s ease-out forwards;
  animation: 0.6s 0.4s ease-out forwards;
}
.animate_left.is_show {
  -webkit-animation-name: slideLeft;
  animation-name: slideLeft;
  -webkit-animation-timing-function: cubic-bezier(0.76, 0, 0.24, 1);
  animation-timing-function: cubic-bezier(0.76, 0, 0.24, 1);
  -webkit-animation-duration: 0.8s;
  animation-duration: 0.8s;
  -webkit-animation-delay: calc(var(--i) * 0.2s);
  animation-delay: calc(var(--i) * 0.2s);
}
@media screen and (max-width: 768px) {
  .animate_left {
    -webkit-transform: translateX(0);
    transform: translateX(0);
    opacity: 1;
  }
}

.animate_right {
  opacity: 0;
  -webkit-transform: translateX(50%);
  transform: translateX(50%);
  -webkit-animation: 0.6s 0.4s ease-out forwards;
  animation: 0.6s 0.4s ease-out forwards;
}
.animate_right.is_show {
  -webkit-animation-name: slideRight;
  animation-name: slideRight;
  -webkit-animation-timing-function: cubic-bezier(0.76, 0, 0.24, 1);
  animation-timing-function: cubic-bezier(0.76, 0, 0.24, 1);
  -webkit-animation-duration: 0.8s;
  animation-duration: 0.8s;
  -webkit-animation-delay: calc(var(--i) * 0.2s);
  animation-delay: calc(var(--i) * 0.2s);
}
@media screen and (max-width: 768px) {
  .animate_right {
    opacity: 1;
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
}

.animate_top {
  opacity: 0;
  -webkit-transform: translateY(50%);
  transform: translateY(50%);
  -webkit-animation: 0.6s 0.4s ease-out forwards;
  animation: 0.6s 0.4s ease-out forwards;
  -webkit-animation-delay: calc(var(--i) * 0.2s);
  animation-delay: calc(var(--i) * 0.2s);
}
.animate_top.is_show {
  -webkit-animation-name: slideTop;
  animation-name: slideTop;
  -webkit-animation-timing-function: cubic-bezier(0.76, 0, 0.24, 1);
  animation-timing-function: cubic-bezier(0.76, 0, 0.24, 1);
  -webkit-animation-duration: 0.8s;
  animation-duration: 0.8s;
}
@media screen and (max-width: 768px) {
  .animate_top {
    opacity: 1;
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
}

.animate_zoom {
  opacity: 0;
}
.animate_zoom.is_show {
  -webkit-animation: zoom-fade 0.75s calc(var(--i) * 0.15s) forwards cubic-bezier(0.22, 0.61, 0.36, 1);
  animation: zoom-fade 0.75s calc(var(--i) * 0.15s) forwards cubic-bezier(0.22, 0.61, 0.36, 1);
}

.text_roll_wrap {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  position: relative;
  width: 100%;
  height: clamp(-1000px, 4.609375vw, 118px);
  background: linear-gradient(90.05deg, #89B8FF -10.81%, #FBC29E 29.84%, #C5FFEB 68.51%, #F5FFA9 103.27%);
  overflow: hidden;
  z-index: 1;
}
@media screen and (max-width: 768px) {
  .text_roll_wrap {
    height: clamp(0px, 15.3645833333vw, 118px);
  }
}
.text_roll_inner {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}
.text_roll_img {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  position: relative;
  width: clamp(-1000px, 143.4765625vw, 3673px);
  height: clamp(-1000px, 4.609375vw, 118px);
  -webkit-animation: text_roll 25s infinite linear;
  animation: text_roll 25s infinite linear;
  -webkit-animation-play-state: running;
  animation-play-state: running;
  background: url(/tftset17/img/bg_roll_1-e87b3975fce962a669b120f11699cbf0.png) no-repeat center/contain;
  z-index: 1;
}
@media screen and (max-width: 768px) {
  .text_roll_img {
    width: clamp(0px, 478.2552083333vw, 3673px);
    height: clamp(0px, 15.3645833333vw, 118px);
  }
}

@-webkit-keyframes rolling {
  0% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
  100% {
    -webkit-transform: translateY(calc(var(--translate)));
    transform: translateY(calc(var(--translate)));
  }
}

@keyframes rolling {
  0% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
  100% {
    -webkit-transform: translateY(calc(var(--translate)));
    transform: translateY(calc(var(--translate)));
  }
}
@-webkit-keyframes slideLeft {
  100% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
    opacity: 1;
  }
}
@keyframes slideLeft {
  100% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
    opacity: 1;
  }
}
@-webkit-keyframes slideRight {
  100% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
    opacity: 1;
  }
}
@keyframes slideRight {
  100% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
    opacity: 1;
  }
}
@-webkit-keyframes slideTop {
  100% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
    opacity: 1;
  }
}
@keyframes slideTop {
  100% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
    opacity: 1;
  }
}
@-webkit-keyframes bouncing {
  0% {
    -webkit-transform: translateY(0);
    -khtml-transform: translateY(0);
    -moz-transform: translateY(0);
    -ms-transform: translateY(0);
    -o-transform: translateY(0);
    transform: translateY(0);
  }
  100% {
    -webkit-transform: translateY(15px);
    -khtml-transform: translateY(15px);
    -moz-transform: translateY(15px);
    -ms-transform: translateY(15px);
    -o-transform: translateY(15px);
    transform: translateY(15px);
  }
}
@keyframes bouncing {
  0% {
    -webkit-transform: translateY(0);
    -khtml-transform: translateY(0);
    -moz-transform: translateY(0);
    -ms-transform: translateY(0);
    -o-transform: translateY(0);
    transform: translateY(0);
  }
  100% {
    -webkit-transform: translateY(15px);
    -khtml-transform: translateY(15px);
    -moz-transform: translateY(15px);
    -ms-transform: translateY(15px);
    -o-transform: translateY(15px);
    transform: translateY(15px);
  }
}
@-webkit-keyframes fadeInZoomIn {
  0% {
    -webkit-transform: scale(1.1);
    transform: scale(1.1);
    opacity: 0.2;
  }
  100% {
    -webkit-transform: scale(1);
    transform: scale(1);
    opacity: 1;
  }
}
@keyframes fadeInZoomIn {
  0% {
    -webkit-transform: scale(1.1);
    transform: scale(1.1);
    opacity: 0.2;
  }
  100% {
    -webkit-transform: scale(1);
    transform: scale(1);
    opacity: 1;
  }
}
@-webkit-keyframes fadeLeft {
  0% {
    -webkit-transform: translateX(-100%);
    transform: translateX(-100%);
    opacity: 0.2;
  }
  100% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
    opacity: 1;
  }
}
@keyframes fadeLeft {
  0% {
    -webkit-transform: translateX(-100%);
    transform: translateX(-100%);
    opacity: 0.2;
  }
  100% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
    opacity: 1;
  }
}
@-webkit-keyframes fadeRight {
  0% {
    -webkit-transform: translateX(100%);
    transform: translateX(100%);
    opacity: 0.2;
  }
  100% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
    opacity: 1;
  }
}
@keyframes fadeRight {
  0% {
    -webkit-transform: translateX(100%);
    transform: translateX(100%);
    opacity: 0.2;
  }
  100% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
    opacity: 1;
  }
}
@-webkit-keyframes zoom-fade {
  0% {
    -webkit-transform: scale(1.5);
    transform: scale(1.5);
    opacity: 0;
    -webkit-filter: blur(10px);
    filter: blur(10px);
  }
  100% {
    -webkit-transform: scale(1);
    transform: scale(1);
    opacity: 1;
    -webkit-filter: none;
    filter: none;
  }
}
@keyframes zoom-fade {
  0% {
    -webkit-transform: scale(1.5);
    transform: scale(1.5);
    opacity: 0;
    -webkit-filter: blur(10px);
    filter: blur(10px);
  }
  100% {
    -webkit-transform: scale(1);
    transform: scale(1);
    opacity: 1;
    -webkit-filter: none;
    filter: none;
  }
}
@-webkit-keyframes pulseBf {
  0%, 100% {
    -webkit-transform: scale(0.9) translateY(0);
    transform: scale(0.9) translateY(0);
  }
  50% {
    -webkit-transform: scale(1) translateY(-0.6vw);
    transform: scale(1) translateY(-0.6vw);
  }
}
@keyframes pulseBf {
  0%, 100% {
    -webkit-transform: scale(0.9) translateY(0);
    transform: scale(0.9) translateY(0);
  }
  50% {
    -webkit-transform: scale(1) translateY(-0.6vw);
    transform: scale(1) translateY(-0.6vw);
  }
}
@-webkit-keyframes text_roll {
  0% {
    -webkit-transform: translateX(0%);
    transform: translateX(0%);
  }
  100% {
    -webkit-transform: translateX(-100%);
    transform: translateX(-100%);
  }
}
@keyframes text_roll {
  0% {
    -webkit-transform: translateX(0%);
    transform: translateX(0%);
  }
  100% {
    -webkit-transform: translateX(-100%);
    transform: translateX(-100%);
  }
}
@-webkit-keyframes fadeIn {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@keyframes fadeIn {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@media screen and (max-width: 768px) {
  .only_pc {
    display: none !important;
  }
}

.only_mo {
  display: none;
}
@media screen and (max-width: 768px) {
  .only_mo {
    display: block;
  }
}

.riotbar-header-wrapper {
  -webkit-transition: 0.3s linear;
  transition: 0.3s linear;
}

.btn_play {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
}
.btn_play_green::before {
  background-image: url(/tftset17/img/btn_play_bg_green-bc1669a96b8ea814165b6fceb639cf4f.png);
}
.btn_play_green:hover::before {
  background: url(/tftset17/img/btn_play_bg_green_h-47de7c712d42e4722ec819d1998253c6.png) no-repeat center/cover;
  -webkit-transform: rotate(105deg);
  transform: rotate(105deg);
}
.btn_play_blue::before {
  background-image: url(/tftset17/img/btn_play_bg_blue-54b1d13ab969ce0319224711fcfd041c.png);
}
.btn_play_blue:hover::before {
  background: url(/tftset17/img/btn_play_bg_blue_h-9539260d93c20030c4eb7edca371380c.png) no-repeat center/cover;
  -webkit-transform: rotate(105deg);
  transform: rotate(105deg);
}
.btn_play_brown::before {
  background-image: url(/tftset17/img/btn_play_bg_brown-9a3ee2334b7f47fcd491d4aa5b180f9a.png);
}
.btn_play_brown:hover::before {
  background: url(/tftset17/img/btn_play_bg_brown_h-1228188e08defd53b5328ed3bb150a8b.png) no-repeat center/cover;
  -webkit-transform: rotate(105deg);
  transform: rotate(105deg);
}
.btn_play_pink::before {
  background-image: url(/tftset17/img/btn_play_bg_pink-561263dbad9a85b01fe10b0852192292.png);
}
.btn_play_pink:hover::before {
  background: url(/tftset17/img/btn_play_bg_pink_h-aaa6d40948950ecf47b6f43d68615b71.png) no-repeat center/cover;
  -webkit-transform: rotate(105deg);
  transform: rotate(105deg);
}
.btn_play_purple::before {
  background-image: url(/tftset17/img/btn_play_bg_purple-fc571e25d9f5fbd0ed03f5dd14c945b6.png);
}
.btn_play_purple:hover::before {
  background: url(/tftset17/img/btn_play_bg_purple_h-7561881f7d8730844a4a197e19728354.png) no-repeat center/cover;
  -webkit-transform: rotate(105deg);
  transform: rotate(105deg);
}
.btn_play::before {
  display: inline-block;
  width: clamp(-1000px, 4.6875vw, 120px);
  height: clamp(-1000px, 4.6875vw, 120px);
  background-repeat: no-repeat;
  background-position: center;
  -webkit-background-size: cover;
  background-size: cover;
  -webkit-transition: -webkit-transform 0.3s linear;
  transition: -webkit-transform 0.3s linear;
  transition: transform 0.3s linear;
  transition: transform 0.3s linear, -webkit-transform 0.3s linear;
  content: "";
}
.btn_play::after {
  position: absolute;
  top: 0;
  left: 0;
  display: inline-block;
  width: clamp(-1000px, 4.6875vw, 120px);
  height: clamp(-1000px, 4.6875vw, 120px);
  background: url(/tftset17/img/btn_play_arrow-0a357d5d08d6c59b3d9d9eb152d8c515.png) no-repeat center/cover;
  -webkit-transition: background 0.3s linear;
  transition: background 0.3s linear;
  content: "";
}
@media screen and (max-width: 768px) {
  .btn_play::before, .btn_play::after {
    width: clamp(0px, 15.625vw, 120px);
    height: clamp(0px, 15.625vw, 120px);
  }
}

.is_lock {
  position: fixed !important;
  left: 0;
  width: 100%;
  overscroll-behavior-y: none;
  overflow: hidden;
}

.button_group {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
.button_group.column_type {
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}
.button_group .button {
  position: relative;
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  width: clamp(-1000px, 10vw, 256px);
  height: clamp(-1000px, 2.265625vw, 58px);
  -webkit-transition: background 0.3s linear;
  transition: background 0.3s linear;
}
.button_group .button.large {
  width: clamp(-1000px, 15.234375vw, 390px);
  height: clamp(-1000px, 3.59375vw, 92px);
}
.button_group .button.large .text {
  height: clamp(-1000px, 1.328125vw, 34px);
}
.button_group .button.large .text > img {
  height: clamp(-1000px, 0.8984375vw, 23px);
}
.button_group .button.large.navy {
  background: url(/tftset17/img/button_bg_l_01-37cc8d68b2696d7357cbe4f333227473.png) no-repeat center/100% 100%;
}
.button_group .button.large.navy:hover {
  background: url(/tftset17/img/button_bg_l_01_h-add9e0b8aac1c3d460298b3b13d4de95.png) no-repeat center/100% 100%;
}
.button_group .button.large.purple {
  background: url(/tftset17/img/button_bg_l_02-a424eae66c93c6833e51a1c747e692b2.png) no-repeat center/100% 100%;
}
.button_group .button.large.purple:hover {
  background: url(/tftset17/img/button_bg_l_02_h-c6c592280184b49e46aa2bc8c380a484.png) no-repeat center/100% 100%;
}
.button_group .button.navy {
  background: url(/tftset17/img/button_bg_01-4dadf7bd08dcad3fc445cd5d6979201d.png) no-repeat center/100% 100%;
}
.button_group .button.navy:hover {
  background: url(/tftset17/img/button_bg_01_h-07ac5120e77d3d9d799b49f5326df60b.png) no-repeat center/100% 100%;
}
.button_group .button.purple {
  background: url(/tftset17/img/button_bg_02-85a6675662cabdd2249aaef702ff33b9.png) no-repeat center/100% 100%;
}
.button_group .button.purple:hover {
  background: url(/tftset17/img/button_bg_02_h-dd0ec5f52922c028f85b071d3de6fc22.png) no-repeat center/100% 100%;
}
.button_group .button.is_disabled {
  pointer-events: none;
}
.button_group .button .text {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  height: clamp(-1000px, 0.859375vw, 22px);
}
.button_group .button .text > img {
  height: clamp(-1000px, 0.5859375vw, 15px);
}
@media screen and (max-width: 768px) {
  .button_group {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
  }
  .button_group .button {
    width: clamp(0px, 53.3854166667vw, 410px);
    height: clamp(0px, 14.3229166667vw, 110px);
  }
  .button_group .button.navy, .button_group .button.purple {
    -webkit-background-size: 100% 100%;
    background-size: 100% 100%;
  }
  .button_group .button.large {
    width: clamp(0px, 53.3854166667vw, 410px);
    height: clamp(0px, 14.3229166667vw, 110px);
  }
  .button_group .button.large .text {
    height: clamp(0px, 4.6875vw, 36px);
  }
  .button_group .button.large .text > img {
    height: clamp(0px, 2.9947916667vw, 23px);
  }
  .button_group .button.is_disabled.navy::after, .button_group .button.is_disabled.purple::after {
    border-top-right-radius: clamp(0px, 3.90625vw, 30px);
    border-bottom-left-radius: clamp(0px, 3.90625vw, 30px);
  }
  .button_group .button .text {
    height: clamp(0px, 4.6875vw, 36px);
  }
  .button_group .button .text > img {
    height: clamp(0px, 2.9947916667vw, 23px);
  }
}

.layer {
  position: fixed;
  top: 0;
  bottom: 0;
  left: 0;
  z-index: 100;
  width: 100%;
  height: 100vh;
  display: none;
}

.dimmed {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 10;
  background-color: rgba(0, 0, 0, 0.7);
}

.pop {
  position: absolute;
  top: 50%;
  left: 50%;
  z-index: 20;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
}
.pop_item {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  position: relative;
  max-height: calc(100vh - 60px);
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
.pop_item.pop_video {
  position: relative;
}
@media screen and (max-width: 768px) {
  .pop_item.pop_video {
    padding-left: 0;
    padding-right: 0;
  }
}
.pop_item.pop_video .box_video {
  width: 54.68vw;
  height: 30.62vw;
  border-width: 3px;
  border-color: #6B56C7;
  border-style: solid;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
@media (min-width: 2561px) {
  .pop_item.pop_video .box_video {
    width: clamp(-1000px, 54.6875vw, 1400px);
    height: clamp(-1000px, 30.625vw, 784px);
  }
}
@media screen and (max-width: 768px) {
  .pop_item.pop_video .box_video {
    width: clamp(0px, 83.8541666667vw, 644px);
    height: clamp(0px, 47.3958333333vw, 364px);
    border-width: clamp(0px, 0.2604166667vw, 2px);
    padding-left: 0;
    padding-right: 0;
  }
}
.pop_item.pop_video .btn_close {
  position: absolute;
  top: 0;
  width: clamp(-1000px, 1.5625vw, 40px);
  height: clamp(-1000px, 1.5625vw, 40px);
  right: -4.5%;
  background: url(/tftset17/img/ic_close-5f694cdf68bf91e1bdc05c3c1c3ea09a.png) no-repeat center/100% 100%;
}
@media (min-width: 2561px) {
  .pop_item.pop_video .btn_close {
    width: clamp(-1000px, 1.5625vw, 40px);
    height: clamp(-1000px, 1.5625vw, 40px);
  }
}
@media screen and (max-width: 768px) {
  .pop_item.pop_video .btn_close {
    top: clamp(0px, 1.3020833333vw, 10px);
    width: clamp(0px, 5.2083333333vw, 40px);
    height: clamp(0px, 5.2083333333vw, 40px);
    margin-bottom: clamp(0px, 1.3020833333vw, 10px);
    top: auto;
    bottom: 100%;
    right: 50%;
    -webkit-transform: translateX(50%);
    transform: translateX(50%);
    background: url(/tftset17/img/ic_close-5f694cdf68bf91e1bdc05c3c1c3ea09a.png) no-repeat center/100% 100%;
  }
}
@media (min-width: 600) {
  .pop_item.pop_video {
    padding: clamp(0px, 1.3020833333vw, 10px) clamp(0px, 1.3020833333vw, 10px) clamp(0px, 1.3020833333vw, 10px) clamp(0px, 1.3020833333vw, 10px);
  }
}
.pop_item.pop_alert {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  width: clamp(-1000px, 22.265625vw, 570px);
  height: clamp(-1000px, 11.015625vw, 282px);
  padding: clamp(-1000px, 2.265625vw, 58px) clamp(-1000px, 0.390625vw, 10px) clamp(-1000px, 1.875vw, 48px);
  background: url(/tftset17/img/bg_pop_1-efb077f6471ff02f29878f3a066bab27.png) no-repeat center/cover;
}
@media screen and (max-width: 768px) {
  .pop_item.pop_alert {
    width: clamp(0px, 74.21875vw, 570px);
    height: clamp(0px, 36.71875vw, 282px);
    padding: clamp(0px, 7.5520833333vw, 58px) clamp(0px, 1.3020833333vw, 10px) clamp(0px, 6.25vw, 48px);
  }
}
.pop_item.pop_alert:not(:has(.pop_desc)) {
  padding-top: clamp(-1000px, 1.40625vw, 36px);
  padding-bottom: clamp(-1000px, 1.25vw, 32px);
}
@media screen and (max-width: 768px) {
  .pop_item.pop_alert:not(:has(.pop_desc)) {
    padding-top: clamp(0px, 4.6875vw, 36px);
    padding-bottom: clamp(0px, 4.1666666667vw, 32px);
  }
}
.pop_item.pop_alert:not(:has(.pop_desc)) .pop_title {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  min-height: clamp(-1000px, 3.046875vw, 78px);
}
.pop_item.pop_alert:not(:has(.pop_desc)) .pop_title + .pop_btn_area {
  margin-top: clamp(-1000px, 1.171875vw, 30px);
}
@media screen and (max-width: 768px) {
  .pop_item.pop_alert:not(:has(.pop_desc)) .pop_title {
    min-height: clamp(0px, 10.15625vw, 78px);
  }
}
.pop_item.pop_alert:not(:has(.pop_desc)) .pop_btn_area {
  margin-top: clamp(-1000px, 1.1328125vw, 29px);
}
@media screen and (max-width: 768px) {
  .pop_item.pop_alert:not(:has(.pop_desc)) .pop_btn_area {
    margin-top: clamp(0px, 3.7760416667vw, 29px);
  }
}
.pop_item.pop_alert .pop_notice {
  color: #9b9ac4;
}
.pop_item.pop_reward_situation td:first-child,
.pop_item.pop_reward_situation th:first-child {
  width: clamp(-1000px, 1.5625vw, 40px);
  padding-left: clamp(-1000px, 0.1171875vw, 3px);
  text-align: center;
}
@media screen and (max-width: 768px) {
  .pop_item.pop_reward_situation td:first-child,
  .pop_item.pop_reward_situation th:first-child {
    width: clamp(0px, 5.2083333333vw, 40px);
    padding-left: clamp(0px, 0.390625vw, 3px);
  }
}
.pop_item.pop_reward_situation td:nth-child(2),
.pop_item.pop_reward_situation th:nth-child(2) {
  width: clamp(-1000px, 8.59375vw, 220px);
  padding-left: clamp(-1000px, 0.78125vw, 20px);
  text-align: left;
}
@media screen and (max-width: 768px) {
  .pop_item.pop_reward_situation td:nth-child(2),
  .pop_item.pop_reward_situation th:nth-child(2) {
    width: clamp(0px, 28.6458333333vw, 220px);
    padding-left: clamp(0px, 2.6041666667vw, 20px);
  }
}
.pop_item.pop_reward_situation td:nth-child(3),
.pop_item.pop_reward_situation th:nth-child(3) {
  width: clamp(-1000px, 7.03125vw, 180px);
  padding-left: clamp(-1000px, 0.15625vw, 4px);
  text-align: center;
}
@media screen and (max-width: 768px) {
  .pop_item.pop_reward_situation td:nth-child(3),
  .pop_item.pop_reward_situation th:nth-child(3) {
    width: clamp(0px, 23.4375vw, 180px);
    padding-left: clamp(0px, 0.5208333333vw, 4px);
  }
}
.pop_item.pop_history_ticket td:first-child,
.pop_item.pop_history_ticket th:first-child {
  width: clamp(-1000px, 1.5625vw, 40px);
  padding-left: clamp(-1000px, 0.1171875vw, 3px);
  text-align: center;
}
@media screen and (max-width: 768px) {
  .pop_item.pop_history_ticket td:first-child,
  .pop_item.pop_history_ticket th:first-child {
    width: clamp(0px, 5.2083333333vw, 40px);
    padding-left: clamp(0px, 0.390625vw, 3px);
  }
}
.pop_item.pop_history_ticket td:nth-child(2),
.pop_item.pop_history_ticket th:nth-child(2) {
  width: clamp(-1000px, 3.0859375vw, 79px);
}
@media screen and (max-width: 768px) {
  .pop_item.pop_history_ticket td:nth-child(2),
  .pop_item.pop_history_ticket th:nth-child(2) {
    width: clamp(0px, 10.2864583333vw, 79px);
  }
}
.pop_item.pop_history_ticket td:nth-child(3),
.pop_item.pop_history_ticket th:nth-child(3) {
  width: clamp(-1000px, 6.5625vw, 168px);
  text-align: left;
}
@media screen and (max-width: 768px) {
  .pop_item.pop_history_ticket td:nth-child(3),
  .pop_item.pop_history_ticket th:nth-child(3) {
    width: clamp(0px, 21.875vw, 168px);
  }
}
.pop_item.pop_history_ticket td:nth-child(4),
.pop_item.pop_history_ticket th:nth-child(4) {
  width: clamp(-1000px, 2.03125vw, 52px);
  padding-left: clamp(-1000px, 0.15625vw, 4px);
  text-align: left;
}
@media screen and (max-width: 768px) {
  .pop_item.pop_history_ticket td:nth-child(4),
  .pop_item.pop_history_ticket th:nth-child(4) {
    width: clamp(0px, 6.7708333333vw, 52px);
    padding-left: clamp(0px, 0.5208333333vw, 4px);
  }
}
.pop_item.pop_history_ticket td:nth-child(5),
.pop_item.pop_history_ticket th:nth-child(5) {
  width: clamp(-1000px, 4.4921875vw, 115px);
  padding-right: clamp(-1000px, 0.15625vw, 4px);
  text-align: center;
}
@media screen and (max-width: 768px) {
  .pop_item.pop_history_ticket td:nth-child(5),
  .pop_item.pop_history_ticket th:nth-child(5) {
    width: clamp(0px, 14.9739583333vw, 115px);
    padding-right: clamp(0px, 0.5208333333vw, 4px);
  }
}
.pop_item.pop_history_ticket .is_deduction {
  background: rgba(199, 41, 136, 0.1019607843);
}
.pop_item.pop_history_ticket .is_deduction .badged {
  background-color: #c72988;
}
.pop_item.pop_history_ticket .badged {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  width: clamp(-1000px, 2.265625vw, 58px);
  height: clamp(-1000px, 1.015625vw, 26px);
  border-radius: 50px;
  font-size: clamp(0px, 0.76171875vw, 19.5px);
  font-weight: 600;
  line-height: 1;
  color: #fff;
  background-color: #313285;
}
@media screen and (max-width: 768px) {
  .pop_item.pop_history_ticket .badged {
    width: clamp(0px, 7.5520833333vw, 58px);
    height: clamp(0px, 3.3854166667vw, 26px);
    border-radius: clamp(0px, 6.5104166667vw, 50px);
    font-size: clamp(0px, 2.5390625vw, 19.5px);
    font-weight: 600;
    line-height: 1;
  }
}
.pop_item.pop_item_winner {
  width: clamp(-1000px, 22.265625vw, 570px);
  height: clamp(-1000px, 23.4375vw, 600px);
  padding: clamp(-1000px, 1.40625vw, 36px) clamp(-1000px, 1.5625vw, 40px) clamp(-1000px, 1.796875vw, 46px);
  background: url(/tftset17/img/bg_pop_3-b33a459dd481242d709261175ecfb5cd.png) no-repeat center/cover;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
@media screen and (max-width: 768px) {
  .pop_item.pop_item_winner {
    width: clamp(0px, 74.21875vw, 570px);
    height: clamp(0px, 78.125vw, 600px);
    padding: clamp(0px, 4.6875vw, 36px) clamp(0px, 5.2083333333vw, 40px) clamp(0px, 5.9895833333vw, 46px);
  }
}
.pop_item.pop_item_winner.is_confirm .pop_notice {
  color: #9b9ac4;
}
.pop_item.pop_item_winner .pop_img {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  -webkit-justify-content: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  -webkit-align-items: center;
  align-items: center;
  width: 100%;
  height: clamp(-1000px, 7.6171875vw, 195px);
  margin-top: clamp(-1000px, 0.2734375vw, 7px);
}
@media screen and (max-width: 768px) {
  .pop_item.pop_item_winner .pop_img {
    height: clamp(0px, 25.390625vw, 195px);
    margin-top: clamp(0px, 0.9114583333vw, 7px);
  }
}
.pop_item.pop_item_winner .pop_desc {
  margin-top: clamp(-1000px, 0.3515625vw, 9px);
}
@media screen and (max-width: 768px) {
  .pop_item.pop_item_winner .pop_desc {
    margin-top: clamp(0px, 1.171875vw, 9px);
  }
}
.pop_item.pop_item_winner .pop_desc .name {
  color: #313285;
}
.pop_item.pop_item_winner .pop_notice {
  margin-top: clamp(-1000px, 0.15625vw, 4px);
  font-size: clamp(0px, 0.8203125vw, 21px);
  font-weight: 500;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #489eff;
}
@media screen and (max-width: 768px) {
  .pop_item.pop_item_winner .pop_notice {
    margin-top: clamp(0px, 0.5208333333vw, 4px);
    font-size: clamp(0px, 2.734375vw, 21px);
    font-weight: 500;
    line-height: 1.3;
  }
}
.pop_item.pop_item_winner .pop_btn_area {
  margin-top: clamp(-1000px, 0.8984375vw, 23px);
}
@media screen and (max-width: 768px) {
  .pop_item.pop_item_winner .pop_btn_area {
    margin-top: clamp(0px, 2.9947916667vw, 23px);
  }
}
.pop_item.pop_voucher {
  width: clamp(-1000px, 22.265625vw, 570px);
  height: clamp(-1000px, 31.640625vw, 810px);
  padding: clamp(-1000px, 1.40625vw, 36px) clamp(-1000px, 2.03125vw, 52px) clamp(-1000px, 1.875vw, 48px);
  background: url(/tftset17/img/bg_pop_2-c45e07e676d5c2846fe7e8148f8b1d32.png) center/cover no-repeat;
}
.pop_item.pop_voucher .guide_inner {
  line-height: 1.8;
}
.pop_item.pop_voucher .guide_inner .guide_title:not(:first-of-type) {
  display: block;
  margin-top: clamp(-1000px, 0.625vw, 16px);
}
.pop_item.pop_voucher .guide_inner .guide_title + p.guide_desc {
  margin-top: clamp(-1000px, 0.15625vw, 4px);
}
.pop_item.pop_voucher .guide_inner .guide_title + ul {
  margin-top: clamp(-1000px, 0.390625vw, 10px);
}
.pop_item.pop_voucher .guide_inner .text_point {
  color: #489EFF;
}
@media screen and (max-width: 768px) {
  .pop_item.pop_voucher {
    width: clamp(0px, 74.21875vw, 570px);
    height: clamp(0px, 105.46875vw, 810px);
    padding: clamp(0px, 4.6875vw, 36px) clamp(0px, 6.7708333333vw, 52px) clamp(0px, 6.25vw, 48px);
  }
}
.pop_item.pop_voucher .pop_reward_img {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  -webkit-align-items: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  -webkit-justify-content: center;
  justify-content: center;
  width: 100%;
  height: clamp(-1000px, 7.6171875vw, 195px);
  margin-top: clamp(-1000px, 0.2734375vw, 7px);
}
@media screen and (max-width: 768px) {
  .pop_item.pop_voucher .pop_reward_img {
    height: clamp(0px, 25.390625vw, 195px);
    margin-top: clamp(0px, 0.9114583333vw, 7px);
  }
}
.pop_item.pop_voucher .tab_list {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
.pop_item.pop_voucher .tab_item {
  position: relative;
  width: 50%;
  height: 100%;
}
.pop_item.pop_voucher .tab_item .btn_tab {
  display: block;
  width: 100%;
  height: 100%;
}
.pop_item.pop_voucher .tab_panel {
  display: none;
}
.pop_item.pop_voucher .tab_panel[aria-hidden=false] {
  display: block;
  max-height: clamp(-1000px, 9.375vw, 240px);
}
@media screen and (max-width: 768px) {
  .pop_item.pop_voucher .tab_panel[aria-hidden=false] {
    max-height: clamp(0px, 31.25vw, 240px);
  }
}
.pop_item.pop_voucher .scroll-element.scroll-y {
  top: 0;
}
.pop_item.pop_notice .text_red {
  color: #CE5858;
}
.pop_item.pop_notice .text_yellow {
  color: #C5A162;
}
.pop_item.pop_notice .text_white {
  color: #fff;
  font-weight: 500;
}
.pop_item.pop_notice .pop_title {
  padding-bottom: clamp(-1000px, 1.40625vw, 36px);
}
@media screen and (max-width: 768px) {
  .pop_item.pop_notice .pop_title {
    padding-bottom: clamp(0px, 4.6875vw, 36px);
  }
}
.pop_item.pop_notice .pop_title strong {
  font-weight: 700;
}
.pop_item.pop_notice .scroll_box {
  width: 100%;
  max-height: clamp(-1000px, 12.34375vw, 316px);
  overflow-y: auto;
  overflow-x: hidden;
}
@media screen and (max-width: 768px) {
  .pop_item.pop_notice .scroll_box {
    max-height: clamp(0px, 41.1458333333vw, 316px);
  }
}
.pop_item.pop_notice .pop_desc {
  color: rgba(255, 255, 255, 0.5);
  font-weight: 400;
  letter-spacing: -0.02em;
}
.pop_item.pop_notice .notice_point_box {
  margin-top: clamp(-1000px, 1.40625vw, 36px);
  padding: clamp(-1000px, 1.25vw, 32px) clamp(-1000px, 0.9765625vw, 25px) clamp(-1000px, 1.40625vw, 36px);
  border-top: 1px solid rgba(255, 255, 255, 0.3);
  border-bottom: 1px solid rgba(255, 255, 255, 0.3);
  background-color: rgba(255, 255, 255, 0.05);
  text-align: center;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
@media screen and (max-width: 768px) {
  .pop_item.pop_notice .notice_point_box {
    margin-top: clamp(0px, 4.6875vw, 36px);
    padding: clamp(0px, 4.1666666667vw, 32px) clamp(0px, 3.2552083333vw, 25px) clamp(0px, 4.6875vw, 36px);
  }
}
.pop_item.pop_notice .notice_point_box .text_yellow {
  font-size: clamp(0px, 0.625vw, 16px);
  font-weight: 600;
  letter-spacing: -0.02em;
}
@media screen and (max-width: 768px) {
  .pop_item.pop_notice .notice_point_box .text_yellow {
    font-size: clamp(0px, 2.0833333333vw, 16px);
    font-weight: 600;
    line-height: 1.3;
  }
}
.pop_item.pop_notice .notice_point_box .text_yellow + .pop_desc {
  margin-top: clamp(-1000px, 0.390625vw, 10px);
}
@media screen and (max-width: 768px) {
  .pop_item.pop_notice .notice_point_box .text_yellow + .pop_desc {
    margin-top: clamp(0px, 1.3020833333vw, 10px);
  }
}
.pop_item.pop_notice .badged {
  display: inline-block;
  border-radius: 16px;
  padding: clamp(-1000px, 0.078125vw, 2px) clamp(-1000px, 0.3515625vw, 9px) clamp(-1000px, 0.0390625vw, 1px) clamp(-1000px, 0.3515625vw, 9px);
  font-size: clamp(0px, 0.625vw, 16px);
  font-weight: 500;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #08175E;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
@media screen and (max-width: 768px) {
  .pop_item.pop_notice .badged {
    padding: clamp(0px, 0.2604166667vw, 2px) clamp(0px, 1.171875vw, 9px) clamp(0px, 0.1302083333vw, 1px) clamp(0px, 1.171875vw, 9px);
    border-radius: clamp(0px, 2.0833333333vw, 16px);
    font-size: clamp(0px, 2.0833333333vw, 16px);
    font-weight: 500;
    line-height: 1.3;
  }
}
.pop_item.pop_notice .badged_box {
  margin: clamp(-1000px, 1.40625vw, 36px) clamp(-1000px, 0vw, 0px) clamp(-1000px, 0.625vw, 16px);
  text-align: center;
}
@media screen and (max-width: 768px) {
  .pop_item.pop_notice .badged_box {
    margin-top: clamp(0px, 4.6875vw, 36px);
    margin-bottom: clamp(0px, 2.0833333333vw, 16px);
  }
}
.pop_item.pop_notice .badged.badged_yellow {
  background-color: #C5A162;
}
.pop_item.pop_notice .badged.badged_red {
  background-color: #CE5858;
}
.pop_item.pop_notice .notice_tbl {
  width: 100%;
}
.pop_item.pop_notice .notice_tbl thead tr {
  background-color: rgba(255, 255, 255, 0.05);
  border-top: 1px solid rgba(255, 255, 255, 0.3);
  border-bottom: 1px solid rgba(255, 255, 255, 0.3);
}
.pop_item.pop_notice .notice_tbl thead th {
  letter-spacing: -0.02em;
  padding: clamp(-1000px, 0.390625vw, 10px) clamp(-1000px, 0vw, 0px) clamp(-1000px, 0.46875vw, 12px);
  font-size: clamp(0px, 0.546875vw, 14px);
  font-weight: 600;
  line-height: clamp(0px, 0.7421875vw, 19px);
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
@media screen and (max-width: 768px) {
  .pop_item.pop_notice .notice_tbl thead th {
    padding-top: clamp(0px, 1.3020833333vw, 10px);
    padding-bottom: clamp(0px, 1.5625vw, 12px);
    font-size: clamp(0px, 1.8229166667vw, 14px);
    font-weight: 600;
    line-height: 1.3;
  }
}
.pop_item.pop_notice .notice_tbl tbody tr {
  border-bottom: 1px solid rgba(255, 255, 255, 0.3);
  border-bottom-width: clamp(-1000px, 0.0390625vw, 1px);
}
.pop_item.pop_notice .notice_tbl tbody td {
  height: clamp(-1000px, 2.3828125vw, 61px);
  text-align: center;
  padding: clamp(-1000px, 0.390625vw, 10px) clamp(-1000px, 0vw, 0px) clamp(-1000px, 0.46875vw, 12px);
  font-size: clamp(0px, 0.546875vw, 14px);
  font-weight: 600;
  line-height: clamp(0px, 0.7421875vw, 19px);
  letter-spacing: -0.02em;
  color: rgba(255, 255, 255, 0.5);
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
@media screen and (max-width: 768px) {
  .pop_item.pop_notice .notice_tbl tbody td {
    font-size: clamp(0px, 1.8229166667vw, 14px);
    font-weight: 600;
    line-height: 19;
    height: clamp(0px, 7.9427083333vw, 61px);
  }
}
.pop_item.pop_notice .notice_tbl + .pop_desc {
  margin-top: clamp(-1000px, 1.40625vw, 36px);
}
@media screen and (max-width: 768px) {
  .pop_item.pop_notice .notice_tbl + .pop_desc {
    margin-top: clamp(0px, 4.6875vw, 36px);
  }
}
.pop_title {
  font-size: clamp(0px, 1.171875vw, 30px);
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #313285;
  text-align: center;
}
@media screen and (max-width: 768px) {
  .pop_title {
    font-size: clamp(0px, 3.90625vw, 30px);
    font-weight: 700;
    line-height: 1.3;
  }
}
.pop_sub_title {
  margin-top: clamp(-1000px, 0.1171875vw, 3px);
  font-size: clamp(0px, 1.0546875vw, 27px);
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #6364a6;
}
@media screen and (max-width: 768px) {
  .pop_sub_title {
    margin-top: clamp(0px, 0.390625vw, 3px);
    font-size: clamp(0px, 3.515625vw, 27px);
    font-weight: 700;
    line-height: 1.3;
  }
}
.pop_desc {
  margin-top: clamp(-1000px, 0.234375vw, 6px);
  font-size: clamp(0px, 0.9375vw, 24px);
  font-weight: 600;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #6364a5;
  text-align: center;
}
@media screen and (max-width: 768px) {
  .pop_desc {
    margin-top: clamp(0px, 0.78125vw, 6px);
    font-size: clamp(0px, 3.125vw, 24px);
    font-weight: 600;
    line-height: 1.3;
  }
}
.pop_btn {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  width: clamp(-1000px, 11.1328125vw, 285px);
  height: clamp(-1000px, 2.8125vw, 72px);
  font-size: clamp(0px, 1.0546875vw, 27px);
  font-weight: 600;
  line-height: 1.3;
  letter-spacing: -0.04em;
  color: #fff;
  background: url(/tftset17/img/bg_btn_pop_1-a732de95e4afd37f29f2353abfbf7d5b.png) no-repeat center/100% 100%;
  -webkit-transition: background 0.3s;
  transition: background 0.3s;
}
@media screen and (max-width: 768px) {
  .pop_btn {
    width: clamp(0px, 37.109375vw, 285px);
    height: clamp(0px, 9.375vw, 72px);
    font-size: clamp(0px, 3.515625vw, 27px);
    font-weight: 600;
    line-height: 1.3;
  }
}
.pop_btn_area {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  gap: clamp(-1000px, 0.5859375vw, 15px);
  margin-top: clamp(-1000px, 0.8203125vw, 21px);
}
@media screen and (max-width: 768px) {
  .pop_btn_area {
    gap: clamp(0px, 1.953125vw, 15px);
    margin-top: clamp(0px, 2.734375vw, 21px);
  }
}
.pop_btn_area.pop_btn_double .pop_btn {
  width: clamp(-1000px, 8.7890625vw, 225px);
  height: clamp(-1000px, 2.8125vw, 72px);
}
@media screen and (max-width: 768px) {
  .pop_btn_area.pop_btn_double .pop_btn {
    width: clamp(0px, 29.296875vw, 225px);
    height: clamp(0px, 9.375vw, 72px);
  }
}
.pop_btn:hover {
  background: url(/tftset17/img/bg_btn_pop_1_hover-cb10b7864513f4d56bddbb023674fecf.png) no-repeat center/100% 100%;
}
.pop_btn_box {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  gap: clamp(-1000px, 0.390625vw, 10px);
}
@media screen and (max-width: 768px) {
  .pop_btn_box {
    gap: clamp(0px, 1.3020833333vw, 10px);
  }
}
.pop_btn_close {
  position: absolute;
  top: clamp(-1000px, 0.78125vw, 20px);
  right: clamp(-1000px, 0.78125vw, 20px);
  width: clamp(-1000px, 0.9375vw, 24px);
  height: clamp(-1000px, 0.9375vw, 24px);
}
@media screen and (max-width: 768px) {
  .pop_btn_close {
    top: clamp(0px, 2.6041666667vw, 20px);
    right: clamp(0px, 2.6041666667vw, 20px);
    width: clamp(0px, 3.125vw, 24px);
    height: clamp(0px, 3.125vw, 24px);
  }
}
.pop_btn_close::before {
  content: "";
  display: block;
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  width: 100%;
  height: 100%;
  background: url(/tftset17/img/ic_close_pop-b5a9f076b331a11f89f58a63d56d4b09.png) no-repeat center/100% 100%;
}
.pop_voucher .pop_content {
  -webkit-box-flex: 1;
  -ms-flex: 1 1 auto;
  flex: 1 1 auto;
  width: 100%;
}
.pop_voucher .pop_btn_area {
  margin-top: auto;
}
.pop_voucher .tab_list {
  height: clamp(-1000px, 2.2265625vw, 57px);
}
@media screen and (max-width: 768px) {
  .pop_voucher .tab_list {
    height: clamp(0px, 7.421875vw, 57px);
  }
}
.pop_voucher .tab_item .btn_tab {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  width: 100%;
  border-bottom: 3px solid #9B9AC4;
  border-bottom-width: clamp(-1000px, 0.1171875vw, 3px);
  font-size: clamp(0px, 0.8203125vw, 21px);
  font-weight: 600;
  line-height: 1;
  color: #9B9AC4;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
.pop_voucher .tab_item .btn_tab[aria-selected=true] {
  color: #313285;
  border-color: #313285;
}
@media screen and (max-width: 768px) {
  .pop_voucher .tab_item .btn_tab {
    font-size: clamp(0px, 2.734375vw, 21px);
    font-weight: 600;
    line-height: 1;
  }
}
.pop_voucher .tab_item:nth-child(2) .btn_tab[aria-selected=true] {
  color: #313285;
}
.pop_voucher .voucher_code {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  position: relative;
  width: clamp(-1000px, 18.1640625vw, 465px);
  height: clamp(-1000px, 3.515625vw, 90px);
  margin-top: clamp(-1000px, 2.109375vw, 54px);
}
.pop_voucher .voucher_code + .pop_desc {
  margin-top: clamp(-1000px, 1.2890625vw, 33px);
}
@media screen and (max-width: 768px) {
  .pop_voucher .voucher_code {
    width: clamp(0px, 60.546875vw, 465px);
    height: clamp(0px, 11.71875vw, 90px);
    margin-top: clamp(0px, 7.03125vw, 54px);
  }
  .pop_voucher .voucher_code + .pop_desc {
    margin-top: clamp(0px, 4.296875vw, 33px);
  }
}
.pop_voucher .btn_voucher_code {
  position: absolute;
  z-index: 1;
  width: 100%;
  height: 100%;
}
.pop_voucher .code {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  border-radius: 50px;
  border-width: clamp(-1000px, 0.1171875vw, 3px);
  border-color: #313285;
  border-style: solid;
  background: #b7b6d6;
  outline: none;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
@media screen and (max-width: 768px) {
  .pop_voucher .code {
    border-radius: clamp(0px, 6.5104166667vw, 50px);
    border-width: clamp(0px, 0.390625vw, 3px);
  }
}
.pop_voucher .code_txt {
  font-size: clamp(0px, 1.171875vw, 30px);
  font-weight: 400;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #313285;
}
@media screen and (max-width: 768px) {
  .pop_voucher .code_txt {
    font-size: clamp(0px, 3.90625vw, 30px);
    font-weight: 400;
    line-height: 1.3;
  }
}
.pop_voucher .toast {
  position: absolute;
  top: 50%;
  left: 50%;
  opacity: 0;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  font-size: clamp(0px, 0.78125vw, 20px);
  font-weight: 600;
  line-height: 1.3;
  color: #313285;
}
@media screen and (max-width: 768px) {
  .pop_voucher .toast {
    font-size: clamp(0px, 2.6041666667vw, 20px);
    font-weight: 600;
    line-height: 1.3;
  }
}
.pop_voucher .btn_voucher_code.is_copied ~ .code .code_txt {
  opacity: 0;
}
.pop_voucher .btn_voucher_code.is_copied ~ .toast {
  opacity: 1;
}
.pop_voucher .pop_desc {
  margin-top: clamp(-1000px, 0.8984375vw, 23px);
}
@media screen and (max-width: 768px) {
  .pop_voucher .pop_desc {
    margin-top: clamp(0px, 2.9947916667vw, 23px);
  }
}
.pop_voucher .guide {
  overflow: hidden;
  width: 100%;
  height: clamp(-1000px, 8.7890625vw, 225px);
  padding-top: clamp(-1000px, 0.5859375vw, 15px);
  padding-right: clamp(-1000px, 0.8984375vw, 23px);
}
@media screen and (max-width: 768px) {
  .pop_voucher .guide {
    padding-top: clamp(0px, 1.953125vw, 15px);
    padding-right: clamp(0px, 2.9947916667vw, 23px);
    height: clamp(0px, 29.296875vw, 225px);
  }
}
.pop_voucher .guide_title {
  color: #6364A5;
  font-size: clamp(0px, 0.703125vw, 18px);
  font-weight: 700;
  line-height: 1.46;
  letter-spacing: -0.06px;
}
@media screen and (max-width: 768px) {
  .pop_voucher .guide_title {
    font-size: clamp(0px, 2.34375vw, 18px);
    font-weight: 700;
    line-height: 1.46;
  }
}
.pop_voucher .guide_title_desc {
  margin-top: clamp(-1000px, 0.859375vw, 22px);
  color: #6364A5;
  font-size: clamp(0px, 0.703125vw, 18px);
  font-weight: 400;
  line-height: 1.46;
  letter-spacing: -0.06px;
}
@media screen and (max-width: 768px) {
  .pop_voucher .guide_title_desc {
    margin-top: clamp(0px, 2.8645833333vw, 22px);
    font-size: clamp(0px, 2.34375vw, 18px);
    font-weight: 400;
    line-height: 1.46;
  }
}
.pop_voucher .guide_title_desc a {
  color: rgb(72, 158, 255);
  font-weight: 500;
}
.pop_voucher .guide_title_desc + ul {
  margin-top: clamp(-1000px, 0.859375vw, 22px);
}
@media screen and (max-width: 768px) {
  .pop_voucher .guide_title_desc + ul {
    margin-top: clamp(0px, 2.8645833333vw, 22px);
  }
}
.pop_voucher .guide_inner {
  overflow-y: auto;
  width: 100%;
  max-height: 100%;
}
.pop_voucher .guide_list {
  padding-left: clamp(-1000px, 0.7421875vw, 19px);
  width: 100%;
  -webkit-box-sizing: border-box !important;
  box-sizing: border-box !important;
}
@media screen and (max-width: 768px) {
  .pop_voucher .guide_list {
    padding-left: clamp(0px, 2.4739583333vw, 19px);
  }
}
.pop_voucher .guide_desc {
  position: relative;
  font-size: clamp(0px, 0.703125vw, 18px);
  font-weight: 400;
  line-height: 1.46;
  color: #6364A5;
}
@media screen and (max-width: 768px) {
  .pop_voucher .guide_desc {
    font-size: clamp(0px, 2.34375vw, 18px);
    font-weight: 400;
    line-height: 1.46;
  }
}
.pop_voucher .guide_desc::before {
  content: "";
  position: absolute;
  left: -0.3vw;
  top: clamp(-1000px, 0.390625vw, 10px);
  width: clamp(-1000px, 0.1171875vw, 3px);
  height: clamp(-1000px, 0.1171875vw, 3px);
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  background-color: #6364A5;
  border-radius: 50%;
}
@media screen and (max-width: 768px) {
  .pop_voucher .guide_desc::before {
    top: clamp(0px, 1.3020833333vw, 10px);
    width: clamp(0px, 0.390625vw, 3px);
    height: clamp(0px, 0.390625vw, 3px);
  }
}
.pop_voucher .pop_btn_area {
  padding-top: clamp(-1000px, 0.625vw, 16px);
}
@media screen and (max-width: 768px) {
  .pop_voucher .pop_btn_area {
    padding-top: clamp(0px, 2.0833333333vw, 16px);
  }
}
.pop_list {
  width: clamp(-1000px, 22.265625vw, 570px);
  height: clamp(-1000px, 31.640625vw, 810px);
  padding: clamp(-1000px, 2.2265625vw, 57px) clamp(-1000px, 2.03125vw, 52px) clamp(-1000px, 1.875vw, 48px);
  background: url(/tftset17/img/bg_pop_2-c45e07e676d5c2846fe7e8148f8b1d32.png) center/cover no-repeat;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
@media screen and (max-width: 768px) {
  .pop_list {
    width: clamp(0px, 74.21875vw, 570px);
    height: clamp(0px, 105.46875vw, 810px);
    padding: clamp(0px, 7.421875vw, 57px) clamp(0px, 6.7708333333vw, 52px) clamp(0px, 6.25vw, 48px);
  }
}
.pop_list .pop_bx {
  -webkit-box-flex: 1;
  -ms-flex: 1 1 auto;
  flex: 1 1 auto;
  margin-top: clamp(-1000px, 1.171875vw, 30px);
  width: 100%;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
@media screen and (max-width: 768px) {
  .pop_list .pop_bx {
    margin-top: clamp(0px, 3.90625vw, 30px);
  }
}
.pop_list .pop_btn_area {
  margin-top: clamp(-1000px, 0.9375vw, 24px);
}
@media screen and (max-width: 768px) {
  .pop_list .pop_btn_area {
    margin-top: clamp(0px, 3.125vw, 24px);
  }
}
.pop_list .tbl {
  display: block;
  width: 100%;
  height: 100%;
}
.pop_list .tbl_head {
  border-bottom: 1px solid #313285;
  border-bottom-width: clamp(-1000px, 0.0390625vw, 1px);
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
.pop_list .tbl_body {
  height: clamp(-1000px, 18.515625vw, 474px);
}
@media screen and (max-width: 768px) {
  .pop_list .tbl_body {
    height: clamp(0px, 61.71875vw, 474px);
  }
}
.pop_list .tbl_body tr {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  height: clamp(-1000px, 4.1015625vw, 105px);
  padding: clamp(-1000px, 0.546875vw, 14px) clamp(-1000px, 0vw, 0px) clamp(-1000px, 0.5078125vw, 13px);
  border-bottom: 1px solid #313285;
  border-bottom-width: clamp(-1000px, 0.0390625vw, 1px);
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
@media screen and (max-width: 768px) {
  .pop_list .tbl_body tr {
    height: clamp(0px, 13.671875vw, 105px);
    padding: clamp(0px, 1.8229166667vw, 14px) clamp(0px, 0vw, 0px) clamp(0px, 1.6927083333vw, 13px);
  }
}
.pop_list .time {
  display: block;
  font-size: clamp(0px, 0.8203125vw, 21px);
  font-weight: 600;
  line-height: 1;
  color: rgba(49, 50, 133, 0.5019607843);
}
@media screen and (max-width: 768px) {
  .pop_list .time {
    font-size: clamp(0px, 2.734375vw, 21px);
    font-weight: 600;
    line-height: 1;
  }
}
.pop_list .time + .btn_shipping_address {
  margin-top: clamp(-1000px, 0.234375vw, 6px);
}
@media screen and (max-width: 768px) {
  .pop_list .time + .btn_shipping_address {
    margin-top: clamp(0px, 0.78125vw, 6px);
  }
}
.pop_list .btn_shipping_address {
  font-size: clamp(0px, 0.8203125vw, 21px);
  font-weight: 600;
  line-height: 1;
  color: #313285;
  text-decoration: underline;
  text-underline-offset: 6px;
  text-underline-offset: clamp(-1000px, 0.234375vw, 6px);
}
@media screen and (max-width: 768px) {
  .pop_list .btn_shipping_address {
    font-size: clamp(0px, 2.734375vw, 21px);
    font-weight: 600;
    line-height: 1;
    text-underline-offset: clamp(0px, 0.78125vw, 6px);
  }
}
.pop .scroll-wrapper {
  overflow: visible !important;
}
.pop .scroll-content {
  overflow: hidden !important;
}
.pop .scroll-content::-webkit-scrollbar, .pop .scroll-content::-webkit-scrollbar-thumb {
  display: none;
}
.pop .scroll-bar {
  background: #313285 !important;
  opacity: 1 !important;
  border-radius: 50px !important;
}
.pop .scroll-element_outer {
  border-radius: 6px !important;
}
.pop .scroll-element_track {
  background-color: #9090b9 !important;
  opacity: 1 !important;
  border-radius: 50px !important;
}
.pop .scroll-element.scroll-y {
  width: clamp(-1000px, 0.15625vw, 4px);
  right: -4%;
  top: -1px;
}
@media screen and (max-width: 768px) {
  .pop .scroll-element.scroll-y {
    width: clamp(0px, 0.5208333333vw, 4px);
  }
}
.pop .scroll-wrapper,
.pop .scroll-content {
  -ms-scroll-chaining: none;
  overscroll-behavior: contain;
  /* 최신 브라우저 */
  -webkit-overflow-scrolling: auto;
}
.pop .tbl_head,
.pop .tbl_body {
  display: block;
  position: relative;
  width: 100%;
}
.pop .tbl_head {
  height: clamp(-1000px, 1.5625vw, 40px);
}
@media screen and (max-width: 768px) {
  .pop .tbl_head {
    height: clamp(0px, 5.2083333333vw, 40px);
  }
}
.pop .tbl_head th {
  font-size: clamp(0px, 0.8203125vw, 21px);
  font-weight: 600;
  line-height: 1;
  color: #313285;
}
@media screen and (max-width: 768px) {
  .pop .tbl_head th {
    font-size: clamp(0px, 2.734375vw, 21px);
    font-weight: 600;
    line-height: 1;
  }
}
.pop .tbl_body {
  display: block;
}
.pop .tbl_body td {
  font-size: clamp(0px, 0.8203125vw, 21px);
  font-weight: 600;
  line-height: 1;
  color: #6364a5;
}
@media screen and (max-width: 768px) {
  .pop .tbl_body td {
    font-size: clamp(0px, 2.734375vw, 21px);
    font-weight: 600;
    line-height: 1;
  }
}
.pop .tbl_body td:first-child {
  color: rgba(49, 50, 133, 0.5019607843);
}
.pop .tbl_body td:last-child {
  color: #313285;
}

.section {
  position: relative;
  background-repeat: no-repeat;
  -webkit-background-size: cover;
  background-size: cover;
  background-position: top center;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
.section_inner {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  position: relative;
  margin: 0 auto;
  width: 100%;
  padding: clamp(-1000px, 0vw, 0px) clamp(-1000px, 2.34375vw, 60px);
  text-align: center;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
.section_kv {
  position: relative;
  height: clamp(-1000px, 50.390625vw, 1290px);
}
@media screen and (max-width: 768px) {
  .section_kv {
    height: clamp(0px, 130.2083333333vw, 1000px);
  }
}
.section_kv .kv_character {
  position: absolute;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  height: clamp(-1000px, 50.390625vw, 1290px);
}
.section_kv .kv_character picture {
  display: block;
  height: 100%;
}
.section_kv .kv_character .image {
  display: block;
  width: 100%;
  height: 100%;
  -webkit-animation: fadeInZoomIn calc(var(--i) * 0.2s) 0.3s forwards;
  animation: fadeInZoomIn calc(var(--i) * 0.2s) 0.3s forwards;
}
@media screen and (min-width: 2561px) {
  .section_kv .kv_character {
    display: block;
    width: 100%;
    height: auto;
    left: 50%;
    -webkit-transform: translateX(-50%) !important;
    transform: translateX(-50%) !important;
  }
  .section_kv .kv_character picture {
    position: absolute;
    top: 0;
    height: auto;
  }
  .section_kv .kv_character picture:nth-child(1) {
    left: 0;
    width: 43vw;
  }
  .section_kv .kv_character picture:nth-child(2) {
    left: 50%;
    width: 16.6vw;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
  }
  .section_kv .kv_character picture:nth-child(3) {
    right: 0;
    width: 40vw;
  }
}
.section_kv .section_inner {
  height: 100%;
  padding-bottom: clamp(-1000px, 5.3125vw, 136px);
}
@media screen and (max-width: 768px) {
  .section_kv .section_inner {
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    max-width: 100%;
    padding-bottom: 0;
  }
}
.section_kv .logo {
  position: relative;
  margin-left: clamp(-1000px, 0.15625vw, 4px);
}
.section_kv .logo::before {
  position: absolute;
  top: clamp(-1000px, 0.546875vw, 14px);
  left: 0;
  z-index: -1;
  display: inline-block;
  width: clamp(-1000px, 35.5859375vw, 911px);
  height: clamp(-1000px, 14.7265625vw, 377px);
  background: url(/tftset17/img/img_ellipse-9117de7652c365a638e8b85b53908bcf.png) no-repeat center/100% 100%;
  content: "";
}
.section_kv .logo svg, .section_kv .logo image {
  width: clamp(-1000px, 34.3359375vw, 879px);
  height: clamp(-1000px, 13.4765625vw, 345px);
}
@media screen and (max-width: 768px) {
  .section_kv .logo {
    margin-left: clamp(0px, 0.5208333333vw, 4px);
  }
  .section_kv .logo svg, .section_kv .logo image {
    width: clamp(0px, 79.4270833333vw, 610px);
    height: clamp(0px, 31.25vw, 240px);
  }
}
.section_kv .kv_desc {
  margin: clamp(-1000px, -1.484375vw, -38px) clamp(-1000px, 0vw, 0px) clamp(-1000px, 0vw, 0px) clamp(-1000px, 0vw, 0px);
  height: clamp(-1000px, 2.734375vw, 70px);
  vertical-align: top;
}
@media screen and (max-width: 1600px) {
  .section_kv .kv_desc {
    margin: clamp(-1000px, -1.09375vw, -28px) clamp(-1000px, 0vw, 0px) clamp(-1000px, 0vw, 0px) clamp(-1000px, 0vw, 0px);
  }
}
@media screen and (max-width: 768px) {
  .section_kv .kv_desc {
    height: clamp(0px, 5.859375vw, 45px);
    margin-top: -5vw;
  }
}
.section_kv .kv_duration {
  margin-top: clamp(-1000px, 0.234375vw, 6px);
  text-align: left;
}
.section_kv .kv_duration .txt_duration {
  display: inline-block;
  position: relative;
  font-size: clamp(0px, 0.78125vw, 20px);
  font-weight: 600;
  line-height: 1.4;
  color: #fff;
  letter-spacing: 0;
}
@media screen and (max-width: 768px) {
  .section_kv .kv_duration {
    margin-top: clamp(0px, 0.6510416667vw, 5px);
  }
  .section_kv .kv_duration .txt_duration {
    font-size: clamp(0px, 3.125vw, 24px);
    font-weight: 700;
    line-height: 1.4;
  }
}
.section_kv .kv_banner {
  padding-top: clamp(-1000px, 3.828125vw, 98px);
  -webkit-transition: opacity 0.25s ease, visibility 0.25s ease, -webkit-filter 0.25s ease;
  transition: opacity 0.25s ease, visibility 0.25s ease, -webkit-filter 0.25s ease;
  transition: filter 0.25s ease, opacity 0.25s ease, visibility 0.25s ease;
  transition: filter 0.25s ease, opacity 0.25s ease, visibility 0.25s ease, -webkit-filter 0.25s ease;
}
.section_kv .kv_banner.is_fixed {
  position: fixed;
  left: clamp(-1000px, 20.703125vw, 530px);
  bottom: clamp(-1000px, 5.3125vw, 136px);
  padding-top: 0;
  z-index: 50;
}
.section_kv .kv_banner.is_hidden {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}
.section_kv .banner_wrap {
  position: relative;
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  padding-top: clamp(-1000px, 20.2734375vw, 519px);
}
@media screen and (max-width: 768px) {
  .section_kv .banner_wrap {
    padding-bottom: clamp(0px, 19.6614583333vw, 151px);
  }
}
.section_kv .banner_list {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  width: 100%;
}
.section_kv .banner_item {
  position: relative;
  width: clamp(-1000px, 11.71875vw, 300px);
  aspect-ratio: 300/146;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-transition: background 0.25s;
  transition: background 0.25s;
}
.section_kv .banner_item:not(.is_inactived):hover .info {
  display: none;
}
.section_kv .banner_item:not(.is_inactived):hover .banner_sub_text {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
.section_kv .banner_item.is_disabled .description, .section_kv .banner_item.is_inactived .description {
  color: #b1b1b1;
}
.section_kv .banner_item.is_disabled .info .title img, .section_kv .banner_item.is_inactived .info .title img {
  -webkit-filter: grayscale(1) brightness(0.78);
  filter: grayscale(1) brightness(0.78);
}
.section_kv .banner_item.is_disabled .status, .section_kv .banner_item.is_inactived .status {
  color: #fff;
}
.section_kv .banner_item.is_disabled {
  pointer-events: none;
}
.section_kv .banner_item:nth-child(1) {
  background: url("/tftset17/img/bg_banner_01-c77dff3e808eb8c6b96fc51e36c40442.png") no-repeat center/100% 100%;
}
.section_kv .banner_item:nth-child(1):not(.is_inactived):hover {
  background: url("/tftset17/img/bg_banner_01_h-edc51d6f7e6a3ed5f5c59c0a325f96ce.png") no-repeat center/100% 100%;
}
.section_kv .banner_item:nth-child(2) {
  background: url("/tftset17/img/bg_banner_02-c648c13f6310c57149618c96b3da44f5.png") no-repeat center/100% 100%;
}
.section_kv .banner_item:nth-child(2):not(.is_inactived):hover {
  background: url("/tftset17/img/bg_banner_02_h-ed0b3f95410af24286a80d25470dc0e9.png") no-repeat center/100% 100%;
}
.section_kv .banner_item:nth-child(2).is_disabled, .section_kv .banner_item:nth-child(2).is_inactived {
  background: url("/tftset17/img/bg_banner_02_d-2b6d4c85634ac5d4cf9c13cafd2720e5.png") no-repeat center/100% 100%;
}
.section_kv .banner_item:nth-child(3) {
  background: url("/tftset17/img/bg_banner_03-1af64f735ffee905cc903ed4a450315e.png") no-repeat center/100% 100%;
}
.section_kv .banner_item:nth-child(3):not(.is_inactived):hover {
  background: url("/tftset17/img/bg_banner_03_h-14d5b1e82c3593c1941e85f59b123501.png") no-repeat center/100% 100%;
}
.section_kv .banner_item:nth-child(3).is_disabled, .section_kv .banner_item:nth-child(3).is_inactived {
  background: url("/tftset17/img/bg_banner_03_d-068935237a5b484ab8a6302dfdfb2cf7.png") no-repeat center/100% 100%;
}
.section_kv .banner_item:nth-child(4) {
  background: url("/tftset17/img/bg_banner_04-ef2db13e90b51e43e78a630e79f483f5.png") no-repeat center/100% 100%;
}
.section_kv .banner_item:nth-child(4):not(.is_inactived):hover {
  background: url("/tftset17/img/bg_banner_04_h-76719e9f4dd41654d622a30934e590a3.png") no-repeat center/100% 100%;
}
.section_kv .banner_item:nth-child(4).is_disabled, .section_kv .banner_item:nth-child(4).is_inactived {
  background: url("/tftset17/img/bg_banner_04_d-bf8d1bd9a6595e13efde055bf24c2b17.png") no-repeat center/100% 100%;
}
.section_kv .banner_item:nth-child(5) {
  background: url("/tftset17/img/bg_banner_05-414e4348e00976b17cfd5139e23a6780.png") no-repeat center/100% 100%;
}
.section_kv .banner_item:nth-child(5):not(.is_inactived):hover {
  background: url("/tftset17/img/bg_banner_05_h-3554b4cc48f7690ee48b44dce729c2b6.png") no-repeat center/100% 100%;
}
.section_kv .banner_item:nth-child(5).is_disabled, .section_kv .banner_item:nth-child(5).is_inactived {
  background: url("/tftset17/img/bg_banner_05_d-bcb5e86d64c6288e940a11ee6da8ae48.png") no-repeat center/100% 100%;
}
.section_kv .banner_item:nth-child(5) .title img {
  height: clamp(-1000px, 2.421875vw, 62px);
}
.section_kv .banner_item:not(:first-of-type) .banner_link {
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
}
.section_kv .banner_item .description {
  font-size: clamp(0px, 0.546875vw, 14px);
  font-weight: 700;
  line-height: 1.4;
  color: #ffedcd;
}
.section_kv .banner_item .title {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: start;
  -ms-flex-align: start;
  align-items: flex-start;
  height: clamp(-1000px, 2.4609375vw, 63px);
  margin-top: clamp(-1000px, 0.0390625vw, 1px);
}
.section_kv .banner_item .status {
  padding-top: clamp(-1000px, 0.1953125vw, 5px);
  font-size: clamp(0px, 0.625vw, 16px);
  font-weight: 600;
  line-height: 1.4;
  color: #bebfd3;
}
.section_kv .banner_sub_text {
  display: none;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  width: clamp(-1000px, 6.4453125vw, 165px);
  height: clamp(-1000px, 2.1875vw, 56px);
}
.section_kv .banner_sub_text > img {
  width: clamp(-1000px, 6.2890625vw, 161px);
  height: clamp(-1000px, 1.5234375vw, 39px);
}
.section_kv .banner_link {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  width: 100%;
  height: 100%;
  padding: clamp(-1000px, 0.703125vw, 18px) clamp(-1000px, 0.78125vw, 20px) clamp(-1000px, 0.625vw, 16px) clamp(-1000px, 0.78125vw, 20px);
  text-align: left;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
@media screen and (max-width: 768px) {
  .section_kv .kv_image {
    position: absolute;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    width: 100%;
  }
  .section_kv .kv_image picture {
    display: block;
    width: 100%;
  }
  .section_kv .kv_image .image {
    display: block;
    width: 100%;
    height: 100%;
    -webkit-animation: fadeInZoomIn calc(var(--i) * 0.2s) 0.1s forwards;
    animation: fadeInZoomIn calc(var(--i) * 0.2s) 0.1s forwards;
  }
}

.notes {
  position: relative;
  z-index: 1;
}
.notes .btn_toggle {
  width: 100%;
  height: clamp(-1000px, 3.5546875vw, 91px);
  background: #000;
}
@media screen and (max-width: 768px) {
  .notes .btn_toggle {
    height: clamp(0px, 13.0208333333vw, 100px);
  }
}
.notes .btn_toggle.is_active + .precautions {
  display: block;
}
.notes .btn_toggle.is_active .notes_title::after {
  -webkit-transform: rotate(180deg);
  transform: rotate(180deg);
}
.notes_title {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  gap: clamp(-1000px, 0.859375vw, 22px);
  font-size: clamp(0px, 1.09375vw, 28px);
  font-weight: 700;
  line-height: 1;
  color: #fff;
}
.notes_title::after {
  display: block;
  width: clamp(-1000px, 1.015625vw, 26px);
  height: clamp(-1000px, 0.6640625vw, 17px);
  background: url(/tftset17/img/polygon-459d0148ab0e33cd3d43be7f29549de3.png) no-repeat center/100% 100%;
  content: "";
}
@media screen and (max-width: 768px) {
  .notes_title {
    gap: clamp(0px, 2.0833333333vw, 16px);
    font-size: clamp(0px, 3.6458333333vw, 28px);
    font-weight: 700;
    line-height: 1;
  }
  .notes_title::after {
    width: clamp(0px, 3.3854166667vw, 26px);
    height: clamp(0px, 2.2135416667vw, 17px);
  }
}
.notes .precautions {
  display: none;
  padding: clamp(-1000px, 4.453125vw, 114px) clamp(-1000px, 6.0546875vw, 155px) clamp(-1000px, 4.6875vw, 120px);
  font-weight: 400;
  font-size: 14px;
  line-height: 1.8;
  background-color: #242424;
  word-break: keep-all;
  overflow-wrap: break-word;
  color: #9c9c9c;
}
.notes .precautions h4 {
  font-weight: 600;
  color: #d7d7e2;
}
.notes .precautions h4 ~ h4 {
  margin-top: 25px;
}
@media screen and (max-width: 768px) {
  .notes .precautions h4 ~ h4 {
    margin-top: 15px;
  }
}
.notes .precautions .notes_list {
  padding-left: 10px;
}
.notes .precautions .notes_list > li .btn_link {
  color: #9c9c9c;
  text-decoration: underline;
  text-underline-offset: 2px;
}
.notes .precautions .notes_sublist {
  padding-left: 17px;
}
@media screen and (max-width: 768px) {
  .notes .precautions .notes_sublist {
    padding-left: clamp(10px, 2.2135416667vw, 17px);
  }
}
.notes .precautions .desc_item > li {
  padding-left: 17px;
}
.notes .precautions .list_bullet {
  padding-left: 17px;
  list-style: disc;
}
.notes .precautions .list_bullet > li {
  display: list-item;
  list-style: disc;
}
@media screen and (max-width: 768px) {
  .notes .precautions .list_bullet {
    padding-left: clamp(10px, 2.2135416667vw, 17px);
  }
}
.notes .precautions table,
.notes .precautions th,
.notes .precautions td {
  border: 1px solid #fff;
  border-collapse: collapse;
}
.notes .precautions table {
  margin: 15px 0;
}
.notes .precautions table th,
.notes .precautions table td {
  padding: 8px 12px;
  font-weight: 600;
  color: #fff;
  text-align: center;
}
.notes .precautions table td .list_bullet {
  padding-left: 17px;
  text-align: left;
}
.notes .precautions table td .list_bullet > li {
  text-align: left;
}
.notes .precautions .notes_table {
  margin: 15px 0;
}
.notes .precautions .notes_sublist > li > .notes_table {
  margin-left: 15px;
}
.notes .precautions .notes_sublist > li > .notes_table + .list_bullet,
.notes .precautions .notes_sublist > li > .notes_table + .notes_sublist.list_bullet {
  padding-left: 30px;
}
@media screen and (max-width: 768px) {
  .notes .precautions .notes_sublist > li > .notes_table {
    margin-left: clamp(0px, 1.953125vw, 15px);
  }
  .notes .precautions .notes_sublist > li > .notes_table + .list_bullet,
  .notes .precautions .notes_sublist > li > .notes_table + .notes_sublist.list_bullet {
    padding-left: clamp(0px, 3.90625vw, 30px);
  }
}
.notes .precautions .notes_sublist > li > .notes_sublist.list_bullet {
  padding-left: 30px;
}
@media screen and (max-width: 768px) {
  .notes .precautions .notes_sublist > li > .notes_sublist.list_bullet {
    padding-left: clamp(0px, 3.90625vw, 30px);
  }
}
@media screen and (max-width: 768px) {
  .notes .precautions {
    padding: clamp(0px, 10.4166666667vw, 80px) clamp(0px, 8.3333333333vw, 64px) clamp(0px, 11.71875vw, 90px);
    font-size: clamp(10px, 1.8229166667vw, 14px);
  }
}

.floating_menu {
  position: fixed;
  top: 29.2%;
  right: 0;
  z-index: 10;
  width: clamp(-1000px, 8.9453125vw, 229px);
  height: clamp(-1000px, 16.25vw, 416px);
  padding-top: clamp(-1000px, 3.203125vw, 82px);
  padding-bottom: clamp(-1000px, 3.671875vw, 94px);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  background: url(/tftset17/img/bg_floating_menu-0496909e1db11ad0407ffce4db36d840.png) no-repeat center/cover;
  -webkit-transition: 0.3s;
  transition: 0.3s;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
@media (min-width: 1921px) {
  .floating_menu {
    right: 6.4%;
  }
}
.floating_menu.is_show {
  opacity: 1;
  visibility: visible;
  pointer-events: all;
}
.floating_menu::before {
  top: clamp(-1000px, 1.40625vw, 36px);
}
.floating_menu::after {
  bottom: clamp(-1000px, 2.265625vw, 58px);
  -webkit-transform: translateX(-50%) rotate(180deg);
  transform: translateX(-50%) rotate(180deg);
}
.floating_menu .nav_menu {
  max-width: clamp(-1000px, 5.078125vw, 130px);
  margin: 0 auto;
  text-align: center;
}
.floating_menu .nav_menu_item:first-child .nav_menu_link {
  padding-top: 0;
}
.floating_menu .nav_menu_item:not(:last-child) .nav_menu_link {
  border-bottom: 1.1px solid #98855C;
}
.floating_menu .nav_menu_item.is_inactivation {
  pointer-events: none;
}
.floating_menu .nav_menu_link {
  display: block;
  padding-top: clamp(-1000px, 0.46875vw, 12px);
  padding-bottom: clamp(-1000px, 0.46875vw, 12px);
  font-size: clamp(0px, 0.625vw, 16px);
  font-weight: 700;
  line-height: 1.25;
  color: #87733c;
  -webkit-transition: color 0.3s;
  transition: color 0.3s;
}
.floating_menu .nav_menu_link.is_active {
  color: #112887;
}
.floating_menu .nav_menu_link:hover {
  color: #112887;
}

.floating_menu_mo {
  bottom: 0;
  left: 0;
  z-index: 50;
  width: 100%;
  height: clamp(0px, 23.6979166667vw, 182px);
}
.floating_menu_mo.is_fixed {
  position: fixed;
}
.floating_menu_mo .floating_slider {
  height: 100%;
  overflow: unset;
}
.floating_menu_mo .swiper-slide .image {
  opacity: 0;
  -webkit-transition: 0.3s;
  transition: 0.3s;
}
.floating_menu_mo .menu_item {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  height: 100%;
  background: url(/tftset17/img/bg_floating_menu_mo-c709bcc5a2d4e6e43cab6c717291bdff.jpg) no-repeat center/cover;
  text-align: center;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
.floating_menu_mo .menu_item.is_disabled {
  pointer-events: none;
}
.floating_menu_mo .menu_item.is_disabled .button_link .status {
  display: inline-block;
}
.floating_menu_mo .menu_item.is_inactived .button_link .status {
  display: inline-block;
}
.floating_menu_mo .menu_item.is_social {
  background: url(/tftset17/img/bg_floating_menu_mo_social-d195881376732b79754aaefd014b9a73.jpg) no-repeat center/cover;
}
.floating_menu_mo .menu_item.is_social.is_disabled, .floating_menu_mo .menu_item.is_social.is_inactived {
  background: url(/tftset17/img/bg_floating_menu_mo_social_d-96852975ecdc9c9f0e4b8a5e60363057.jpg) no-repeat center/cover;
}
.floating_menu_mo .menu_item.is_play {
  background: url(/tftset17/img/bg_floating_menu_mo_play-e4a57a3544432a21f4bdb355d356b3c5.jpg) no-repeat center/cover;
}
.floating_menu_mo .menu_item.is_play.is_disabled, .floating_menu_mo .menu_item.is_play.is_inactived {
  background: url(/tftset17/img/bg_floating_menu_mo_play_d-896ca7d442fa1e533602b1b906882099.jpg) no-repeat center/cover;
}
.floating_menu_mo .menu_item.is_ranking {
  background: url(/tftset17/img/bg_floating_menu_mo_ranking-ca221c501511c17c253f36a6df9c8b27.jpg) no-repeat center/cover;
}
.floating_menu_mo .menu_item.is_ranking.is_disabled, .floating_menu_mo .menu_item.is_ranking.is_inactived {
  background: url(/tftset17/img/bg_floating_menu_mo_ranking_d-fa8119905e3f4e7a7e97d6b854dd6054.jpg) no-repeat center/cover;
}
.floating_menu_mo .menu_item.is_tournament {
  background: url(/tftset17/img/bg_floating_menu_mo_tournament-08f315a5518c4c7a5100e3f296df8963.jpg) no-repeat center/cover;
}
.floating_menu_mo .menu_item.is_tournament.is_disabled, .floating_menu_mo .menu_item.is_tournament.is_inactived {
  background: url(/tftset17/img/bg_floating_menu_mo_tournament_d-07e89aa4676756421bd1067bbe21c1fe.jpg) no-repeat center/cover;
}
.floating_menu_mo .menu_item .button_link {
  position: relative;
  display: block;
  width: 100%;
  height: clamp(0px, 23.6979166667vw, 182px);
}
.floating_menu_mo .menu_item .button_link .status {
  display: none;
  position: absolute;
  bottom: clamp(0px, 2.6041666667vw, 20px);
  left: 50%;
  font-size: clamp(0px, 2.6041666667vw, 20px);
  font-weight: 600;
  line-height: 1.4;
  color: #fff;
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%);
}
.floating_menu_mo .image {
  position: absolute;
  bottom: 0;
  left: 0;
  width: clamp(0px, 32.5520833333vw, 250px);
  height: clamp(0px, 33.8541666667vw, 260px);
}
.floating_menu_mo .swiper-pagination {
  left: auto;
  right: clamp(0px, 3.125vw, 24px);
  bottom: clamp(0px, 2.6041666667vw, 20px);
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  width: clamp(0px, 15.625vw, 120px);
  height: clamp(0px, 6.5104166667vw, 50px);
  border-radius: clamp(0px, 13.0208333333vw, 100px);
  background: rgba(0, 0, 0, 0.4);
  color: #939393;
  font-size: clamp(0px, 3.6458333333vw, 28px);
  font-weight: 600;
  line-height: 1.4;
  letter-spacing: 0;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
.floating_menu_mo .swiper-pagination .swiper-pagination-current {
  color: #FDEDCB;
}
.floating_menu_mo .swiper-pagination .slash {
  margin: clamp(0px, 0vw, 0px) clamp(0px, 0.2604166667vw, 2px);
}

.section_videos {
  z-index: 1;
  padding: clamp(-1000px, 0vw, 0px) clamp(-1000px, 0vw, 0px) clamp(-1000px, 4.6875vw, 120px);
  scroll-margin-top: clamp(-1000px, 7.8125vw, 200px);
}
.section_videos .inner {
  max-width: clamp(-1000px, 54.6875vw, 1400px);
  margin: 0 auto;
}
@media screen and (max-width: 768px) {
  .section_videos .inner {
    max-width: clamp(0px, 83.3333333333vw, 640px);
  }
}
.section_videos .video_subtitle {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  height: clamp(-1000px, 1.7578125vw, 45px);
}
.section_videos .video_subtitle > img {
  height: clamp(-1000px, 1.2109375vw, 31px);
}
@media screen and (max-width: 768px) {
  .section_videos .video_subtitle {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
    height: clamp(0px, 5.078125vw, 39px);
    padding: clamp(0px, 0.6510416667vw, 5px) clamp(0px, 0vw, 0px) clamp(0px, 1.171875vw, 9px);
    margin: 0 auto;
  }
  .section_videos .video_subtitle > img {
    height: clamp(0px, 3.6458333333vw, 28px);
  }
}
.section_videos .video_title {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  gap: clamp(-1000px, 0.703125vw, 18px);
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  margin: clamp(-1000px, 0.3125vw, 8px) auto clamp(-1000px, 0vw, 0px) auto;
}
.section_videos .video_title svg, .section_videos .video_title image {
  width: clamp(-1000px, 52.578125vw, 1346px);
  height: clamp(-1000px, 3.046875vw, 78px);
}
@media screen and (max-width: 768px) {
  .section_videos .video_title svg, .section_videos .video_title image {
    width: clamp(0px, 73.828125vw, 567px);
    height: clamp(0px, 14.7135416667vw, 113px);
  }
}
.section_videos .video_box {
  margin-top: clamp(-1000px, 2.34375vw, 60px);
}
@media screen and (max-width: 768px) {
  .section_videos .video_box {
    margin-top: clamp(0px, 7.8125vw, 60px);
  }
}
.section_videos .video_item {
  overflow: hidden;
  position: relative;
  width: 100%;
  height: clamp(-1000px, 20.3125vw, 520px);
  -webkit-border-top-left-radius: 0;
  -webkit-border-top-right-radius: 1.49vw;
  -webkit-border-bottom-right-radius: 0;
  -webkit-border-bottom-left-radius: 0;
  border-top-left-radius: 0;
  border-top-right-radius: 1.49vw;
  border-bottom-right-radius: 0;
  border-bottom-left-radius: 0;
}
.section_videos .video_item + .video_item {
  margin-top: clamp(-1000px, 4.6875vw, 120px);
}
@media screen and (max-width: 768px) {
  .section_videos .video_item + .video_item {
    margin-top: 0;
  }
}
.section_videos .video_item::before {
  position: absolute;
  left: 50%;
  bottom: clamp(-1000px, 0vw, 0px);
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%);
  width: clamp(-1000px, 54.6875vw, 1400px);
  height: clamp(-1000px, 20.3125vw, 520px);
  pointer-events: none;
  content: "";
}
@media screen and (max-width: 768px) {
  .section_videos .video_item::before {
    bottom: clamp(0px, 10.0260416667vw, 77px);
    width: clamp(0px, 87.7604166667vw, 674px);
    height: clamp(0px, 38.0208333333vw, 292px);
  }
}
.section_videos .video_item .bg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 2;
  height: 100%;
  pointer-events: none;
}
.section_videos .video_item:nth-child(1) .bg {
  background: url(/tftset17/img/video_frame_only_1-7e3e4970dec68136d761afaa09041f28.png) no-repeat center/100% 100%;
}
@media screen and (max-width: 768px) {
  .section_videos .video_item:nth-child(1) .bg {
    background: url(/tftset17/img/video_frame_mo_1-0d7da3ddccc9046e32befd5b9fcb927c.png) no-repeat center/100% 100%;
  }
}
.section_videos .video_item:nth-child(1) .video_slider {
  border-left: 3px solid #AB669D;
}
@media screen and (max-width: 768px) {
  .section_videos .video_item:nth-child(1) .video_slider {
    border-left: none;
  }
}
.section_videos .video_item:nth-child(1) .swiper_button_controls {
  background: url(/tftset17/img/btn_controls_1-71116745f1291235c68441178fe00f4b.png) no-repeat center/100% 100%;
}
@media screen and (max-width: 768px) {
  .section_videos .video_item:nth-child(1) .swiper_button_controls {
    background: none;
  }
}
.section_videos .video_item:nth-child(2) .bg {
  background: url(/tftset17/img/video_frame_only_2-1d3f7b247d8ebcfc6b42d0985c2f8d63.png) no-repeat center/100% 100%;
}
@media screen and (max-width: 768px) {
  .section_videos .video_item:nth-child(2) .bg {
    background: url(/tftset17/img/video_frame_mo_2-d0983d937ef6f26306f3fe9f47e6d0f6.png) no-repeat center/100% 100%;
  }
}
.section_videos .video_item:nth-child(2) .video_slider {
  border-left: 3px solid #6667AB;
}
@media screen and (max-width: 768px) {
  .section_videos .video_item:nth-child(2) .video_slider {
    border-left: none;
  }
}
.section_videos .video_item:nth-child(2) .swiper_button_controls {
  background: url(/tftset17/img/btn_controls_2-dc87b27232193de3072026948c8587d1.png) no-repeat center/100% 100%;
}
@media screen and (max-width: 768px) {
  .section_videos .video_item:nth-child(2) .swiper_button_controls {
    background: none;
  }
}
.section_videos .video_item:nth-child(3) .bg {
  background: url(/tftset17/img/video_frame_only_3-36fb4f442dc1f2b621913531f569549c.png) no-repeat center/100% 100%;
}
@media screen and (max-width: 768px) {
  .section_videos .video_item:nth-child(3) .bg {
    background: url(/tftset17/img/video_frame_mo_3-9112261c425f56cdbdd8d7670a86a8b7.png) no-repeat center/100% 100%;
  }
}
.section_videos .video_item:nth-child(3) .video_slider {
  border-left: 3px solid #AB8866;
}
@media screen and (max-width: 768px) {
  .section_videos .video_item:nth-child(3) .video_slider {
    border-left: none;
  }
}
.section_videos .video_item:nth-child(3) .swiper_button_controls {
  background: url(/tftset17/img/btn_controls_3-14d8cf729e7e4002a518c4ee20ff5362.png) no-repeat center/100% 100%;
}
@media screen and (max-width: 768px) {
  .section_videos .video_item:nth-child(3) .swiper_button_controls {
    background: none;
  }
}
.section_videos .video_item:nth-child(4) .bg {
  background: url(/tftset17/img/video_frame_only_4-7583fcc2d4983e8af99972085fab50c3.png) no-repeat center/100% 100%;
}
@media screen and (max-width: 768px) {
  .section_videos .video_item:nth-child(4) .bg {
    background: url(/tftset17/img/video_frame_mo_4-410667d671392d8139758a5e74ce5f64.png) no-repeat center/100% 100%;
  }
}
.section_videos .video_item:nth-child(4) .video_slider {
  border-left: 3px solid #62A498;
}
@media screen and (max-width: 768px) {
  .section_videos .video_item:nth-child(4) .video_slider {
    border-left: none;
  }
}
.section_videos .video_item:nth-child(4) .swiper_button_controls {
  background: url(/tftset17/img/btn_controls_4-a2d83ef316f40c82b42362263506c8eb.png) no-repeat center/100% 100%;
}
@media screen and (max-width: 768px) {
  .section_videos .video_item:nth-child(4) .swiper_button_controls {
    background: none;
  }
}
.section_videos .video_item:nth-child(4) {
  display: none;
}
@media screen and (max-width: 768px) {
  .section_videos .video_item {
    height: clamp(0px, 83.3333333333vw, 640px);
  }
  .section_videos .video_item::before, .section_videos .video_item .video_slider {
    top: clamp(0px, 26.3020833333vw, 202px);
  }
  .section_videos .video_item:not(:last-child) {
    margin-bottom: clamp(0px, 10.4166666667vw, 80px);
  }
  .section_videos .video_item:not(:last-child).is_only {
    margin-bottom: clamp(0px, 13.0208333333vw, 100px);
  }
}
.section_videos .video_slider {
  position: absolute;
  right: clamp(-1000px, 0vw, 0px);
  bottom: clamp(-1000px, 0vw, 0px);
  width: clamp(-1000px, 36.09375vw, 924px);
  height: clamp(-1000px, 20.3125vw, 520px);
}
@media screen and (max-width: 768px) {
  .section_videos .video_slider {
    right: clamp(0px, 0.2604166667vw, 2px);
    bottom: clamp(0px, 10.6770833333vw, 82px);
    width: clamp(0px, 82.8125vw, 636px);
    height: clamp(0px, 46.3541666667vw, 356px);
  }
}
.section_videos .video_slider .img {
  width: 100%;
  height: 100%;
}
.section_videos .swiper_button_controls {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  gap: clamp(-1000px, 1.40625vw, 36px);
  position: absolute;
  bottom: clamp(-1000px, 0vw, 0px);
  right: clamp(-1000px, 0vw, 0px);
  z-index: 2;
  width: clamp(-1000px, 9.375vw, 240px);
  height: clamp(-1000px, 3.125vw, 80px);
}
.section_videos .swiper_button_controls .btn_prev, .section_videos .swiper_button_controls .btn_next {
  position: relative;
  top: clamp(-1000px, 0vw, 0px);
  width: clamp(-1000px, 0.9375vw, 24px);
  height: clamp(-1000px, 1.015625vw, 26px);
  background: url(/tftset17/img/ic_arrow_step-900f097d03ef7abf5e8fe2c9ae290b6c.png) no-repeat center/100% 100%;
  -webkit-transition: background 0.3s;
  transition: background 0.3s;
}
.section_videos .swiper_button_controls .btn_prev.swiper-button-disabled, .section_videos .swiper_button_controls .btn_next.swiper-button-disabled {
  background: url(/tftset17/img/ic_arrow_step_disabled-90cf932b33a44c9b0ecbd71963fc669f.png) no-repeat center/100% 100%;
}
.section_videos .swiper_button_controls .btn_next {
  -webkit-transform: rotateY(180deg);
  transform: rotateY(180deg);
}
@media screen and (max-width: 768px) {
  .section_videos .swiper_button_controls {
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    bottom: clamp(0px, 2.9947916667vw, 23px);
    left: clamp(0px, 31.25vw, 240px);
    gap: clamp(0px, 10.4166666667vw, 80px);
    width: clamp(0px, 20.8333333333vw, 160px);
    height: clamp(0px, 5.2083333333vw, 40px);
  }
  .section_videos .swiper_button_controls .btn_prev, .section_videos .swiper_button_controls .btn_next {
    width: clamp(0px, 5.2083333333vw, 40px);
    height: clamp(0px, 5.2083333333vw, 40px);
  }
}
.section_videos .pieces {
  position: absolute;
  z-index: 0;
  top: clamp(-1000px, 26.5625vw, 680px);
  right: 0;
  left: 0;
  height: clamp(-1000px, 42.1875vw, 1080px);
  background: url("/tftset17/img/pieces_video-8eb285d9ea2be1a7b6ffd92aa3858680.webp") no-repeat center/100% 100%;
}
@media screen and (min-width: 2561px) {
  .section_videos .pieces {
    width: 2560px;
    height: 1080px;
    left: 50%;
    -webkit-transform: translateX(-50%) !important;
    transform: translateX(-50%) !important;
  }
}
@media screen and (max-width: 768px) {
  .section_videos {
    padding: clamp(0px, 15.4947916667vw, 119px) clamp(0px, 0vw, 0px) clamp(0px, 20.3125vw, 156px);
    scroll-margin-top: clamp(0px, 0.6510416667vw, 5px);
  }
}

.section_video_guide {
  position: relative;
  background: linear-gradient(137.54deg, #F0EFED 30.23%, #EFE4F2 52.35%);
  padding: clamp(-1000px, 4.6875vw, 120px) clamp(-1000px, 0vw, 0px);
}
.section_video_guide::before, .section_video_guide::after {
  position: absolute;
  right: 0;
  left: 0;
  display: block;
  height: clamp(-1000px, 1.171875vw, 30px);
  content: "";
}
.section_video_guide::before {
  top: clamp(-1000px, 0.46875vw, 12px);
  background: url(/tftset17/img/deco_guide_top-8a360fc09760134c6792a86f02b836bb.png) no-repeat center/100% 100%;
}
.section_video_guide::after {
  bottom: clamp(-1000px, 0.46875vw, 12px);
  background: url(/tftset17/img/deco_guide_bottom-38f4b7f5440f8296a1e78a21ac73ec00.png) no-repeat center/100% 100%;
}
.section_video_guide .inner {
  position: relative;
  z-index: 1;
  max-width: clamp(-1000px, 54.6875vw, 1400px);
  margin: 0 auto;
}
@media screen and (max-width: 768px) {
  .section_video_guide .inner {
    max-width: clamp(0px, 83.3333333333vw, 640px);
  }
}
.section_video_guide .guide_title {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  margin: 0 auto;
}
.section_video_guide .guide_title svg, .section_video_guide .guide_title image {
  width: clamp(-1000px, 50.5078125vw, 1293px);
  height: clamp(-1000px, 3.828125vw, 98px);
}
@media screen and (max-width: 768px) {
  .section_video_guide .guide_title svg, .section_video_guide .guide_title image {
    width: clamp(0px, 73.828125vw, 567px);
    height: clamp(0px, 17.3177083333vw, 133px);
  }
}
.section_video_guide .guide_subtitle {
  margin-top: clamp(-1000px, 0.1171875vw, 3px);
  font-size: clamp(0px, 0.78125vw, 20px);
  font-weight: 500;
  line-height: 1.4;
  color: #5d156e;
  text-align: center;
}
@media screen and (max-width: 768px) {
  .section_video_guide .guide_subtitle {
    margin-top: clamp(0px, 0.78125vw, 6px);
    font-size: clamp(0px, 2.6041666667vw, 20px);
    font-weight: 500;
    line-height: 1.4;
  }
}
.section_video_guide .tab_list {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  gap: clamp(-1000px, 0.9375vw, 24px);
  margin-top: clamp(-1000px, 2.03125vw, 52px);
}
.section_video_guide .tab_btn {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  background: url(/tftset17/img/btn_tab_default-ef87cf1143989e768abcc3c526242107.png) no-repeat center/100% 100%;
  width: clamp(-1000px, 10.15625vw, 260px);
  height: clamp(-1000px, 3.125vw, 80px);
  font-size: clamp(0px, 0.9375vw, 24px);
  font-weight: 700;
  line-height: 1;
  color: #1a1c49;
}
.section_video_guide .tab_item.is_active .tab_btn, .section_video_guide .tab_item:hover .tab_btn {
  background: url(/tftset17/img/btn_tab_active-48c775dc6b30db3ce8516f03dcb4a3cc.png) no-repeat center/100% 100%;
  color: #fff;
}
.section_video_guide .tab_content {
  position: relative;
  margin-top: clamp(-1000px, 1.5625vw, 40px);
}
@media screen and (max-width: 768px) {
  .section_video_guide .tab_list {
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-column-gap: clamp(0px, 2.34375vw, 18px);
    -moz-column-gap: clamp(0px, 2.34375vw, 18px);
    column-gap: clamp(0px, 2.34375vw, 18px);
    row-gap: clamp(0px, 2.6041666667vw, 20px);
    margin-top: clamp(0px, 6.5104166667vw, 50px);
  }
  .section_video_guide .tab_btn {
    width: clamp(0px, 26.0416666667vw, 200px);
    height: clamp(0px, 11.4583333333vw, 88px);
    background: url(/tftset17/img/btn_tab_default_mo-27059bba1fe2f5c0950e664b8aa491e9.png) no-repeat center/100% 100%;
    font-size: clamp(0px, 3.6458333333vw, 28px);
    font-weight: 700;
    line-height: 1;
  }
  .section_video_guide .tab_item.is_active .tab_btn, .section_video_guide .tab_item:hover .tab_btn {
    background: url(/tftset17/img/btn_tab_active_mo-9b030ebda02b8ac20cef469bd79d468c.png) no-repeat center/100% 100%;
  }
  .section_video_guide .tab_content {
    margin-top: clamp(0px, 7.8125vw, 60px);
  }
}
.section_video_guide .video_guide_box {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  position: relative;
  width: clamp(-1000px, 54.6875vw, 1400px);
  height: clamp(-1000px, 20.3125vw, 520px);
  margin: 0 auto;
}
.section_video_guide .video_guide_box .image {
  width: 100%;
  height: 100%;
}
.section_video_guide .video_guide_box .user_info {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  position: relative;
  background: url(/tftset17/img/bg_video_guide_profile-f6804b49716a132ab2e6da1624b70de8.png) no-repeat center/100% 100%;
  width: clamp(-1000px, 17.8125vw, 456px);
  height: clamp(-1000px, 20.3125vw, 520px);
}
.section_video_guide .video_guide_box .user_info .text {
  position: relative;
  bottom: clamp(-1000px, 0.3515625vw, 9px);
  font-family: "DNF Forged Blade";
  font-size: clamp(0px, 1.25vw, 32px);
  font-weight: 500;
  line-height: 1.34;
  background: linear-gradient(91.67deg, #F4CD88 1.03%, #C5A162 109.1%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  color: transparent;
}
.section_video_guide .video_guide_box .user_profile {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  padding-top: clamp(-1000px, 2.890625vw, 74px);
}
.section_video_guide .video_guide_box .user_profile_name {
  font-size: clamp(0px, 1.71875vw, 44px);
  font-weight: 800;
  line-height: 1.4;
  color: #ddc8fd;
}
.section_video_guide .video_guide_box .video_box {
  position: relative;
  overflow: hidden;
  border: 3px solid #6B56C7;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  width: clamp(-1000px, 36.25vw, 928px);
  height: clamp(-1000px, 20.3125vw, 520px);
  -webkit-border-top-left-radius: 0;
  -webkit-border-top-right-radius: 1.12vw;
  -webkit-border-bottom-right-radius: 0;
  -webkit-border-bottom-left-radius: 1.12vw;
  border-top-left-radius: 0;
  border-top-right-radius: 1.12vw;
  border-bottom-right-radius: 0;
  border-bottom-left-radius: 1.12vw;
}
.section_video_guide .video_guide_box .video_thumbnail {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
  object-fit: cover;
}
@media screen and (max-width: 768px) {
  .section_video_guide .video_guide_box {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    width: 100%;
    height: clamp(0px, 87.2395833333vw, 670px);
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
  }
  .section_video_guide .video_guide_box .video_box {
    -webkit-box-ordinal-group: 3;
    -ms-flex-order: 2;
    order: 2;
    width: 100%;
    height: clamp(0px, 46.875vw, 360px);
    -webkit-border-top-left-radius: 0;
    -webkit-border-top-right-radius: 4.81vw;
    -webkit-border-bottom-right-radius: 0;
    -webkit-border-bottom-left-radius: 4.81vw;
    border-top-left-radius: 0;
    border-top-right-radius: 4.81vw;
    border-bottom-right-radius: 0;
    border-bottom-left-radius: 4.81vw;
  }
  .section_video_guide .video_guide_box .user_info {
    -webkit-box-ordinal-group: 2;
    -ms-flex-order: 1;
    order: 1;
    width: 100%;
    background: url(/tftset17/img/bg_video_guide_profile_mo-b36bb2ae4e60814d8c638114870b6263.png) no-repeat center/100% 100%;
    height: clamp(0px, 39.0625vw, 300px);
  }
  .section_video_guide .video_guide_box .user_info .text {
    font-size: clamp(0px, 3.90625vw, 30px);
    font-weight: 500;
    line-height: 1.34;
  }
  .section_video_guide .video_guide_box .user_profile {
    padding-top: clamp(0px, 4.9479166667vw, 38px);
  }
  .section_video_guide .video_guide_box .user_profile_name {
    font-size: clamp(0px, 7.8125vw, 60px);
    font-weight: 800;
    line-height: 1.4;
  }
}
.section_video_guide .keyword_list {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  gap: clamp(-1000px, 0.5078125vw, 13px);
  width: clamp(-1000px, 8.90625vw, 228px);
  padding-top: clamp(-1000px, 1.171875vw, 30px);
}
.section_video_guide .keyword_item {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  background-color: #373974;
  width: 100%;
  height: clamp(-1000px, 1.796875vw, 46px);
  border-radius: clamp(-1000px, 1.953125vw, 50px);
}
.section_video_guide .keyword_link {
  font-size: clamp(0px, 0.78125vw, 20px);
  font-weight: 600;
  color: #fff;
}
@media screen and (max-width: 768px) {
  .section_video_guide .keyword_list {
    -webkit-box-orient: initial;
    -webkit-box-direction: initial;
    -ms-flex-direction: initial;
    flex-direction: initial;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    gap: clamp(0px, 1.0416666667vw, 8px) clamp(0px, 0.9114583333vw, 7px);
    width: clamp(0px, 48.046875vw, 369px);
    height: auto;
    padding-top: clamp(0px, 2.4739583333vw, 19px);
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
  }
  .section_video_guide .keyword_item {
    max-width: clamp(0px, 23.5677083333vw, 181px);
    height: clamp(0px, 4.6875vw, 36px);
    border-radius: clamp(0px, 13.0208333333vw, 100px);
  }
  .section_video_guide .keyword_link {
    font-size: clamp(0px, 2.0833333333vw, 16px);
    font-weight: 600;
  }
}
.section_video_guide .video_list {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  width: clamp(-1000px, 54.6875vw, 1400px);
  -webkit-column-gap: clamp(-1000px, 0.625vw, 16px);
  -moz-column-gap: clamp(-1000px, 0.625vw, 16px);
  column-gap: clamp(-1000px, 0.625vw, 16px);
  row-gap: clamp(-1000px, 2.34375vw, 60px);
  margin-top: clamp(-1000px, 4.6875vw, 120px);
}
.section_video_guide .video_image {
  display: block;
  position: relative;
  width: clamp(-1000px, 17.8125vw, 456px);
  height: clamp(-1000px, 9.9609375vw, 255px);
  -webkit-border-top-left-radius: 0;
  -webkit-border-top-right-radius: 1.44vw;
  -webkit-border-bottom-right-radius: 0;
  -webkit-border-bottom-left-radius: 1.44vw;
  border-top-left-radius: 0;
  border-top-right-radius: 1.44vw;
  border-bottom-right-radius: 0;
  border-bottom-left-radius: 1.44vw;
  border: 3px solid #6B56C7;
  overflow: hidden;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
.section_video_guide .video_image .video {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
  object-fit: cover;
}
.section_video_guide .video_image .video_box {
  position: absolute;
  top: clamp(-1000px, 0vw, 0px);
  right: clamp(-1000px, 0vw, 0px);
  bottom: clamp(-1000px, 0vw, 0px);
  left: clamp(-1000px, 0vw, 0px);
  overflow: hidden;
  pointer-events: none;
}
.section_video_guide .video_image .video_box .video_thumbnail {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
  object-fit: cover;
}
.section_video_guide .video_image .name {
  position: absolute;
  bottom: clamp(-1000px, -0.1171875vw, -3px);
  left: 50%;
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%);
  width: clamp(-1000px, 17.8125vw, 456px);
  height: clamp(-1000px, 1.5625vw, 40px);
  padding: clamp(-1000px, 0.234375vw, 6px) clamp(-1000px, 0vw, 0px) clamp(-1000px, 0vw, 0px);
  font-size: clamp(0px, 0.703125vw, 18px);
  font-weight: 700;
  line-height: 1.55;
  background: rgba(107, 86, 199, 0.7);
  color: #fff;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  text-align: center;
}
.section_video_guide .video_image .name .text {
  display: block;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.section_video_guide .video_image .btn_play {
  width: clamp(-1000px, 3.515625vw, 90px);
  height: clamp(-1000px, 3.515625vw, 90px);
}
.section_video_guide .video_image .btn_play::before {
  width: clamp(-1000px, 3.515625vw, 90px);
  height: clamp(-1000px, 3.515625vw, 90px);
}
.section_video_guide .video_image .btn_play::after {
  width: clamp(-1000px, 3.515625vw, 90px);
  height: clamp(-1000px, 3.515625vw, 90px);
}
@media screen and (max-width: 768px) {
  .section_video_guide .video_image .btn_play {
    width: clamp(0px, 15.625vw, 120px);
    height: clamp(0px, 15.625vw, 120px);
  }
  .section_video_guide .video_image .btn_play::before {
    width: clamp(0px, 15.625vw, 120px);
    height: clamp(0px, 15.625vw, 120px);
  }
  .section_video_guide .video_image .btn_play::after {
    width: clamp(0px, 15.625vw, 120px);
    height: clamp(0px, 15.625vw, 120px);
  }
}
.section_video_guide .video_keyword {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  gap: clamp(-1000px, 0.3125vw, 8px);
  margin-top: clamp(-1000px, 0.78125vw, 20px);
}
.section_video_guide .video_keyword_link {
  display: inline-block;
  padding: clamp(-1000px, 0.15625vw, 4px) clamp(-1000px, 0.625vw, 16px);
  background: #373974;
  border-radius: clamp(-1000px, 1.953125vw, 50px);
  font-size: clamp(0px, 0.625vw, 16px);
  font-weight: 600;
  line-height: 1.75;
  color: #fff;
}
@media screen and (max-width: 768px) {
  .section_video_guide .video_list {
    grid-template-columns: repeat(1, 1fr);
    width: 100%;
    gap: clamp(0px, 6.5104166667vw, 50px);
    margin-top: clamp(0px, 10.4166666667vw, 80px);
  }
  .section_video_guide .video_list .btn_play {
    top: clamp(0px, 10.9375vw, 84px);
    -webkit-transform: translate(-50%, 0);
    transform: translate(-50%, 0);
  }
  .section_video_guide .video_image {
    width: 100%;
    height: clamp(0px, 46.875vw, 360px);
    -webkit-border-top-left-radius: 0;
    -webkit-border-top-right-radius: 4.81vw;
    -webkit-border-bottom-right-radius: 0;
    -webkit-border-bottom-left-radius: 4.81vw;
    border-top-left-radius: 0;
    border-top-right-radius: 4.81vw;
    border-bottom-right-radius: 0;
    border-bottom-left-radius: 4.81vw;
  }
  .section_video_guide .video_image .name {
    bottom: clamp(0px, 0vw, 0px);
    width: clamp(0px, 83.3333333333vw, 640px);
    height: clamp(0px, 8.59375vw, 66px);
    padding: clamp(0px, 1.8229166667vw, 14px) clamp(0px, 2.6041666667vw, 20px);
    font-size: clamp(0px, 3.6458333333vw, 28px);
    font-weight: 700;
    line-height: 1.42;
  }
  .section_video_guide .video_keyword {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    gap: clamp(0px, 1.3020833333vw, 10px) clamp(0px, 1.0416666667vw, 8px);
    margin-top: clamp(0px, 3.90625vw, 30px);
  }
  .section_video_guide .video_keyword_link {
    padding: clamp(0px, 0.78125vw, 6px) clamp(0px, 2.6041666667vw, 20px);
    border-radius: clamp(0px, 13.0208333333vw, 100px);
    font-size: clamp(0px, 2.6041666667vw, 20px);
    font-weight: 600;
    line-height: 1.4;
  }
}
.section_video_guide .btn_load_more {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  width: clamp(-1000px, 10vw, 256px);
  height: clamp(-1000px, 2.265625vw, 58px);
  margin: clamp(-1000px, 3.125vw, 80px) auto clamp(-1000px, 0vw, 0px) auto;
  background: url(/tftset17/img/btn_more-b19ba186e125e3bea397255c332c99de.png) no-repeat center/100% 100%;
  font-size: clamp(0px, 0.703125vw, 18px);
  font-weight: 700;
  line-height: 1;
  color: #fffbe3;
  -webkit-transition: background 0.3s, color 0.3s;
  transition: background 0.3s, color 0.3s;
}
.section_video_guide .btn_load_more:hover {
  background: url(/tftset17/img/btn_more_hover-eece5d8ee75a4fa215ff057578d2adcd.png) no-repeat center/100% 100%;
}
@media screen and (max-width: 768px) {
  .section_video_guide .btn_load_more {
    width: clamp(0px, 53.3854166667vw, 410px);
    height: clamp(0px, 14.3229166667vw, 110px);
    margin-top: clamp(0px, 7.8125vw, 60px);
    font-size: clamp(0px, 3.3854166667vw, 26px);
    font-weight: 700;
    line-height: 1;
    background: url(/tftset17/img/btn_more_mo-40e56bfdc47d0cb0a4f7904d2e68024d.png) no-repeat center/100% 100%;
  }
}
.section_video_guide .piece {
  position: absolute;
  z-index: 0;
}
.section_video_guide .piece_left {
  top: clamp(-1000px, 24.8828125vw, 637px);
  left: clamp(-1000px, 3.5546875vw, 91px);
  width: clamp(-1000px, 17.265625vw, 442px);
  height: clamp(-1000px, 39.0234375vw, 999px);
  background: url("/tftset17/img/guide_left-7f9bc70586373035654be28a9bf90c64.webp") no-repeat center/100% 100%;
}
.section_video_guide .piece_right {
  top: clamp(-1000px, 3.046875vw, 78px);
  right: -2.4vw;
  width: clamp(-1000px, 29.0625vw, 744px);
  height: clamp(-1000px, 43.515625vw, 1114px);
  background: url("/tftset17/img/guide_right-ee42a98ba44d22fd0c07f8d7b16b0f8c.webp") no-repeat center/100% 100%;
}
.section_video_guide .piece_first {
  top: -20vw;
  left: 0;
  width: clamp(0px, 20.3125vw, 156px);
  height: clamp(0px, 36.9791666667vw, 284px);
  background: url("/tftset17/img/piece_01-deb5b41c91c4f9b018ed0b050aed0960.webp") no-repeat center/100% 100%;
}
.section_video_guide .piece_second {
  top: clamp(0px, 22.3958333333vw, 172px);
  right: 0;
  width: clamp(0px, 14.453125vw, 111px);
  height: clamp(0px, 20.8333333333vw, 160px);
  background: url("/tftset17/img/piece_02-401c3471bda962673cfcb71714f5010a.webp") no-repeat center/100% 100%;
}
.section_video_guide .piece_third {
  top: clamp(0px, 186.1979166667vw, 1430px);
  left: 0;
  width: clamp(0px, 22.3958333333vw, 172px);
  height: clamp(0px, 29.9479166667vw, 230px);
  background: url("/tftset17/img/piece_03-0bd54c0e1c0bcfe3ffdb9d8431b4571a.webp") no-repeat center/100% 100%;
}
.section_video_guide .piece_fourth {
  top: clamp(0px, 233.0729166667vw, 1790px);
  right: 0;
  width: clamp(0px, 14.5833333333vw, 112px);
  height: clamp(0px, 20.8333333333vw, 160px);
  background: url("/tftset17/img/piece_04-90ec86dcd9f23b96ace2122f38791463.webp") no-repeat center/100% 100%;
}
.section_video_guide .piece_fifth {
  top: clamp(0px, 385.4166666667vw, 2960px);
  left: 0;
  width: clamp(0px, 18.2291666667vw, 140px);
  height: clamp(0px, 16.6666666667vw, 128px);
  background: url("/tftset17/img/piece_05-28284fdfd596eb22c4ee51f42b77055a.webp") no-repeat center/100% 100%;
}
.section_video_guide .piece_sixth {
  top: clamp(0px, 607.2916666667vw, 4664px);
  right: 0;
  width: clamp(0px, 11.0677083333vw, 85px);
  height: clamp(0px, 25.5208333333vw, 196px);
  background: url("/tftset17/img/piece_06-5dd47298d4ae98fa418a27df366f0d78.webp") no-repeat center/100% 100%;
}
.section_video_guide .piece_seventh {
  bottom: clamp(0px, 156.5104166667vw, 1202px);
  left: 0;
  width: clamp(0px, 8.3333333333vw, 64px);
  height: clamp(0px, 16.1458333333vw, 124px);
  background: url("/tftset17/img/piece_07-62e396a413bbf4b3ebd76d99e34650b8.webp") no-repeat center/100% 100%;
}
.section_video_guide .piece_eighth {
  bottom: clamp(0px, 34.8958333333vw, 268px);
  right: 0;
  width: clamp(0px, 20.0520833333vw, 154px);
  height: clamp(0px, 26.0416666667vw, 200px);
  background: url("/tftset17/img/piece_08-f0e4cdfe9bf283caf81980933c058cc7.webp") no-repeat center/100% 100%;
}
@media screen and (min-width: 2561px) {
  .section_video_guide .piece_left {
    top: 637px;
    left: calc(50% - 1200px);
    width: 442px;
    height: 999px;
  }
  .section_video_guide .piece_right {
    top: 78px;
    right: calc(50% - 1300px);
    width: 744px;
    height: 1114px;
    background: url("/tftset17/img/guide_right-ee42a98ba44d22fd0c07f8d7b16b0f8c.webp") no-repeat center/100% 100%;
  }
}
@media screen and (max-width: 768px) {
  .section_video_guide .piece_left {
    width: clamp(0px, 22.65625vw, 174px);
    height: clamp(0px, 29.5572916667vw, 227px);
    background: url("/tftset17/img/video_left-8a526c9e2afc52a819783bc958f06ff9.webp") no-repeat center/100% 100%;
  }
  .section_video_guide .piece_right {
    width: clamp(0px, 47.3958333333vw, 364px);
    height: clamp(0px, 34.5052083333vw, 265px);
    background: url("/tftset17/img/video_right-4a5a3813c890fef7145391cd6945d3f0.webp") no-repeat center/100% 100%;
  }
}
.section_video_guide .character_left {
  position: absolute;
  z-index: 1;
  bottom: 0;
  left: 0;
  width: clamp(-1000px, 22.5390625vw, 577px);
  height: clamp(-1000px, 29.609375vw, 758px);
  background: url("/tftset17/img/video_left-8a526c9e2afc52a819783bc958f06ff9.webp") no-repeat center/100% 100%;
}
.section_video_guide .character_right {
  position: absolute;
  z-index: 1;
  bottom: 0;
  right: 0;
  width: clamp(-1000px, 47.34375vw, 1212px);
  height: clamp(-1000px, 46.4453125vw, 1189px);
  background: url("/tftset17/img/video_right-4a5a3813c890fef7145391cd6945d3f0.webp") no-repeat center/100% 100%;
}
@media screen and (min-width: 2561px) {
  .section_video_guide .character_left {
    width: 577px;
    height: 758px;
  }
  .section_video_guide .character_right {
    width: 1212px;
    height: 1189px;
  }
}
@media screen and (max-width: 768px) {
  .section_video_guide .character_left {
    width: clamp(0px, 22.65625vw, 174px);
    height: clamp(0px, 29.5572916667vw, 227px);
    background: url("/tftset17/img/video_left-8a526c9e2afc52a819783bc958f06ff9.webp") no-repeat center/100% 100%;
  }
  .section_video_guide .character_right {
    width: clamp(0px, 47.3958333333vw, 364px);
    height: clamp(0px, 34.5052083333vw, 265px);
    background: url("/tftset17/img/video_right-4a5a3813c890fef7145391cd6945d3f0.webp") no-repeat center/100% 100%;
  }
}
@media screen and (max-width: 768px) {
  .section_video_guide {
    padding: clamp(0px, 13.5416666667vw, 104px) clamp(0px, 0vw, 0px) clamp(0px, 20.5729166667vw, 158px);
  }
  .section_video_guide::before, .section_video_guide::after {
    height: clamp(0px, 3.125vw, 24px);
  }
  .section_video_guide::before {
    top: clamp(0px, 1.8229166667vw, 14px);
    background: url(/tftset17/img/deco_guide_top_mo-a671b76db7ac3a6994ea967986342012.png) no-repeat center/100% 100%;
  }
  .section_video_guide::after {
    bottom: clamp(0px, 1.8229166667vw, 14px);
    background: url(/tftset17/img/deco_guide_bottom_mo-0e5fde7a879315f934926e529c52796d.png) no-repeat center/100% 100%;
  }
}

.guide_content {
  position: relative;
  overflow: hidden;
}
.guide_content .bg_area {
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  width: 100%;
}
.guide_content .bg_area img {
  width: 100%;
  -o-object-fit: contain;
  object-fit: contain;
}
@media screen and (max-width: 768px) {
  .guide_content .bg_area img {
    height: clamp(0px, 999.7395833333vw, 7678px);
  }
}

.section_event {
  height: clamp(-1000px, 32.3046875vw, 827px);
  padding-bottom: clamp(-1000px, 4.6875vw, 120px);
  scroll-margin-top: clamp(-1000px, 4.6875vw, 120px);
}
.section_event .inner {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  max-width: clamp(-1000px, 56.2109375vw, 1439px);
  margin: 0 auto;
}
.section_event .event_title svg, .section_event .event_title image {
  width: clamp(-1000px, 25.6640625vw, 657px);
  height: clamp(-1000px, 5.78125vw, 148px);
}
@media screen and (max-width: 768px) {
  .section_event .event_title svg,
  .section_event .event_title image {
    width: clamp(0px, 60.15625vw, 462px);
    height: clamp(0px, 14.453125vw, 111px);
  }
}
.section_event .event_time_box {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  width: 100%;
  margin-top: clamp(-1000px, 1.875vw, 48px);
}
@media screen and (max-width: 768px) {
  .section_event .event_time_box {
    margin-top: clamp(0px, 6.25vw, 48px);
  }
}
.section_event .event_time_title {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  height: clamp(-1000px, 1.40625vw, 36px);
  aspect-ratio: 473/36;
}
@media screen and (max-width: 768px) {
  .section_event .event_time_title {
    height: clamp(0px, 4.0364583333vw, 31px);
    aspect-ratio: 416/31;
  }
}
.section_event .event_time_list {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  gap: clamp(-1000px, 2.734375vw, 70px);
  width: clamp(-1000px, 54.6484375vw, 1399px);
  height: clamp(-1000px, 14.7265625vw, 377px);
  margin-top: clamp(-1000px, 1.328125vw, 34px);
  background: url(/tftset17/img/bg_time_event-2cb9dc181166f62ff13be294e82ff491.png) no-repeat top;
  -webkit-background-size: clamp(-1000px, 54.6484375vw, 1399px) clamp(-1000px, 11.7578125vw, 301px);
  background-size: clamp(-1000px, 54.6484375vw, 1399px) clamp(-1000px, 11.7578125vw, 301px);
}
@media screen and (max-width: 768px) {
  .section_event .event_time_list {
    -webkit-box-pack: unset;
    -ms-flex-pack: unset;
    justify-content: unset;
    gap: clamp(0px, 4.1666666667vw, 32px);
    width: clamp(0px, 83.3333333333vw, 640px);
    height: clamp(0px, 23.3072916667vw, 179px);
    margin-top: clamp(0px, 3.125vw, 24px);
    background: url(/tftset17/img/bg_time_event_mo-3f923d7e0b5812e072e2ddcb565bcf90.png) no-repeat center/100% 100%;
  }
}
.section_event .event_time_content {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  width: clamp(-1000px, 11.5625vw, 296px);
  height: clamp(-1000px, 11.7578125vw, 301px);
}
.section_event .event_time_content .value {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  font-size: clamp(0px, 5.625vw, 144px);
  font-weight: 800;
  line-height: 1.4;
  color: #2d2b75;
}
.section_event .event_time_content .value .text {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  width: clamp(-1000px, 5.7421875vw, 147px);
}
@media screen and (max-width: 768px) {
  .section_event .event_time_content {
    width: clamp(0px, 17.7083333333vw, 136px);
    height: clamp(0px, 17.7083333333vw, 136px);
  }
  .section_event .event_time_content .value {
    gap: clamp(0px, 2.6041666667vw, 20px);
    font-size: clamp(0px, 10.4166666667vw, 80px);
    font-weight: 800;
    line-height: 1.4;
  }
}
.section_event .event_time_item {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
}
.section_event .event_time_item .time_unit {
  padding-top: clamp(-1000px, 1.5625vw, 40px);
  font-size: clamp(0px, 1.015625vw, 26px);
  font-weight: 400;
  line-height: 1.38;
  color: #84229c;
  text-transform: uppercase;
}
@media screen and (max-width: 768px) {
  .section_event .event_time_item {
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
  }
  .section_event .event_time_item .time_unit {
    padding-top: clamp(0px, 2.34375vw, 18px);
    font-size: clamp(0px, 2.34375vw, 18px);
    font-weight: 500;
    line-height: 1.38;
  }
}
.section_event .event_desc {
  margin-top: clamp(-1000px, 0.390625vw, 10px);
  font-size: clamp(0px, 0.78125vw, 20px);
  font-weight: 400;
  line-height: 1.4;
  color: #84229c;
}
@media screen and (max-width: 768px) {
  .section_event .event_desc {
    margin-top: clamp(0px, 2.0833333333vw, 16px);
    font-size: clamp(0px, 2.6041666667vw, 20px);
    font-weight: 500;
    line-height: 1.4;
    text-align: center;
  }
}
.section_event .piece {
  position: absolute;
  top: clamp(-1000px, 9.6484375vw, 247px);
  left: 0;
  z-index: 0;
  width: clamp(-1000px, 13.671875vw, 350px);
  height: clamp(-1000px, 15.234375vw, 390px);
}
.section_event .piece::before {
  width: 100%;
  height: 100%;
  display: inline-block;
  background: url(/tftset17/img/event_peice-0a4102dc5b59abdce51d46c99d245679.webp) no-repeat center/100% 100%;
  content: "";
}
@media screen and (min-width: 2561px) {
  .section_event .piece {
    top: 247px;
    left: calc(50% - 1300px);
    width: 350px;
    height: 390px;
  }
}
@media screen and (max-width: 768px) {
  .section_event {
    height: clamp(0px, 91.9270833333vw, 706px);
    padding: clamp(0px, 15.625vw, 120px) clamp(0px, 0vw, 0px);
    scroll-margin-top: clamp(0px, 15.625vw, 120px);
  }
  .section_event .inner {
    max-width: clamp(0px, 83.4635416667vw, 641px);
  }
}

.section_information {
  height: clamp(-1000px, 43.8671875vw, 1123px);
  padding: clamp(-1000px, 0vw, 0px) clamp(-1000px, 0vw, 0px) clamp(-1000px, 4.6875vw, 120px);
}
@media screen and (max-width: 768px) {
  .section_information {
    height: clamp(0px, 146.875vw, 1128px);
    padding: clamp(0px, 0vw, 0px) clamp(0px, 0vw, 0px) clamp(0px, 15.625vw, 120px);
  }
}
.section_information .inner {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  max-width: clamp(-1000px, 56.5625vw, 1448px);
  margin: 0 auto;
}
@media screen and (max-width: 768px) {
  .section_information .inner {
    position: static;
    max-width: clamp(0px, 89.3229166667vw, 686px);
  }
}
.section_information .info_title svg, .section_information .info_title image {
  width: clamp(-1000px, 43.8671875vw, 1123px);
  height: clamp(-1000px, 6.796875vw, 174px);
}
@media screen and (max-width: 768px) {
  .section_information .info_title svg, .section_information .info_title image {
    width: clamp(0px, 70.703125vw, 543px);
    height: clamp(0px, 24.8697916667vw, 191px);
  }
}
.section_information .info_desc {
  margin-top: clamp(-1000px, 0.9375vw, 24px);
  text-align: center;
}
.section_information .info_desc .desc {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  gap: clamp(-1000px, 0.625vw, 16px);
  font-size: clamp(0px, 0.78125vw, 20px);
  font-weight: 600;
  line-height: 1.4;
  color: #1a1c49;
}
@media screen and (max-width: 768px) {
  .section_information .info_desc .desc {
    display: block;
  }
}
.section_information .info_desc .label {
  font-weight: 500;
}
@media screen and (max-width: 768px) {
  .section_information .info_desc .label {
    display: block;
  }
}
@media screen and (max-width: 768px) {
  .section_information .info_desc {
    margin-top: clamp(0px, 3.125vw, 24px);
  }
  .section_information .info_desc .desc {
    font-size: clamp(0px, 2.6041666667vw, 20px);
    font-weight: 600;
    line-height: 1.4;
  }
  .section_information .info_desc .desc + .desc {
    margin-top: clamp(0px, 1.953125vw, 15px);
  }
  .section_information .info_desc .label {
    font-size: clamp(0px, 2.6041666667vw, 20px);
    font-weight: 500;
    line-height: 1.4;
  }
}
.section_information .info_sub {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  margin-top: clamp(-1000px, 3.203125vw, 82px);
}
.section_information .info_sub .title {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  height: clamp(-1000px, 2.1875vw, 56px);
  aspect-ratio: 458/56;
}
.section_information .info_sub .title > img {
  height: clamp(-1000px, 1.328125vw, 34px);
  aspect-ratio: 454/34;
}
.section_information .info_sub .description {
  font-size: clamp(0px, 0.78125vw, 20px);
  font-weight: 500;
  line-height: 1.4;
  color: #5d156e;
}
.section_information .info_sub .description::before {
  margin-right: 4px;
  content: "※";
}
@media screen and (max-width: 768px) {
  .section_information .info_sub {
    margin-top: clamp(0px, 6.25vw, 48px);
  }
  .section_information .info_sub .title {
    height: clamp(0px, 5.859375vw, 45px);
    aspect-ratio: 366/45;
  }
  .section_information .info_sub .title > img {
    height: clamp(0px, 3.515625vw, 27px);
    aspect-ratio: 727/55;
  }
  .section_information .info_sub .description {
    font-size: clamp(0px, 2.6041666667vw, 20px);
    font-weight: 500;
    line-height: 1.4;
  }
}
.section_information .info_content {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  width: 100%;
  gap: clamp(-1000px, 1.25vw, 32px);
  margin-top: clamp(-1000px, 1.9921875vw, 51px);
}
@media screen and (max-width: 768px) {
  .section_information .info_content {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    gap: clamp(0px, 2.6041666667vw, 20px);
    max-width: clamp(0px, 83.3333333333vw, 640px);
    margin-top: clamp(0px, 4.1666666667vw, 32px);
  }
}
.section_information .info_item {
  width: clamp(-1000px, 19.53125vw, 500px);
  height: clamp(-1000px, 21.875vw, 560px);
  background: url(/tftset17/img/info_item_box-da11d78764da8facbd2ba992d93ddede.png) no-repeat center/100% 100%;
}
.section_information .info_item .item_box {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  width: 100%;
  height: 100%;
  padding: clamp(-1000px, 2.3828125vw, 61px) clamp(-1000px, 1.953125vw, 50px) clamp(-1000px, 1.796875vw, 46px);
}
.section_information .info_item .info_rank {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  width: clamp(-1000px, 12.5vw, 320px);
  height: clamp(-1000px, 2.5vw, 64px);
  border-radius: 99px;
  background-color: #373974;
}
.section_information .info_item .info_rank .text {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  height: clamp(-1000px, 1.640625vw, 42px);
}
.section_information .info_item .info_rank .text > img {
  height: clamp(-1000px, 1.09375vw, 28px);
}
.section_information .info_item .info_token {
  position: absolute;
  top: clamp(-1000px, 5.8203125vw, 149px);
  left: clamp(-1000px, 1.953125vw, 50px);
  width: clamp(-1000px, 15.078125vw, 386px);
  height: clamp(-1000px, 10.78125vw, 276px);
}
.section_information .info_item .line {
  width: 100%;
  height: clamp(-1000px, 0.0390625vw, 1px);
  margin-top: auto;
  background-color: #8183b3;
}
.section_information .info_item .info_description {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  padding-top: clamp(-1000px, 0.9765625vw, 25px);
}
.section_information .info_item .info_description .text {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  height: clamp(-1000px, 1.40625vw, 36px);
}
.section_information .info_item .info_description .text > img {
  height: clamp(-1000px, 1.015625vw, 26px);
}
@media screen and (max-width: 768px) {
  .section_information .info_item {
    width: 100%;
    height: clamp(0px, 36.4583333333vw, 280px);
    background: url(/tftset17/img/info_item_box_mo-f072ffbd911684e04ee3979b9d8ebb0f.png) no-repeat center/100% 100%;
  }
  .section_information .info_item:nth-child(2) .info_token {
    top: clamp(0px, 6.640625vw, 51px);
  }
  .section_information .info_item .item_box {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    padding: clamp(0px, 7.9427083333vw, 61px) clamp(0px, 6.3802083333vw, 49px) clamp(0px, 7.9427083333vw, 61px) clamp(0px, 43.0989583333vw, 331px);
  }
  .section_information .info_item .info_rank {
    width: clamp(0px, 33.8541666667vw, 260px);
    height: clamp(0px, 6.7708333333vw, 52px);
  }
  .section_information .info_item .info_rank .text {
    height: clamp(0px, 3.125vw, 24px);
  }
  .section_information .info_item .info_rank .text > img {
    height: clamp(0px, 2.9947916667vw, 23px);
  }
  .section_information .info_item .info_token {
    position: absolute;
    top: clamp(0px, 6.1197916667vw, 47px);
    left: clamp(0px, 4.6875vw, 36px);
    width: clamp(0px, 33.984375vw, 261px);
    height: clamp(0px, 24.3489583333vw, 187px);
  }
  .section_information .info_item .info_description {
    padding-top: clamp(0px, 2.0833333333vw, 16px);
  }
  .section_information .info_item .info_description .text {
    height: clamp(0px, 11.71875vw, 90px);
  }
  .section_information .info_item .info_description .text > img {
    height: clamp(0px, 9.8958333333vw, 76px);
  }
}

.section_participate {
  position: relative;
  z-index: 2;
  width: 100%;
  height: clamp(-1000px, 34.453125vw, 882px);
  background: url(/tftset17/img/base_participate-bdb4946fcde9118a8b198321bf07546a.webp) no-repeat center/cover;
}
.section_participate .inner {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  max-width: clamp(-1000px, 54.6875vw, 1400px);
  margin: 0 auto;
}
@media screen and (max-width: 768px) {
  .section_participate .inner {
    max-width: clamp(0px, 83.3333333333vw, 640px);
  }
}
.section_participate .participate_title {
  padding-top: clamp(-1000px, 4.6875vw, 120px);
}
.section_participate .participate_title svg, .section_participate .participate_title image {
  width: clamp(-1000px, 26.0546875vw, 667px);
  height: clamp(-1000px, 1.953125vw, 50px);
}
@media screen and (max-width: 768px) {
  .section_participate .participate_title {
    padding-top: clamp(0px, 12.5vw, 96px);
  }
  .section_participate .participate_title svg, .section_participate .participate_title image {
    width: clamp(0px, 79.8177083333vw, 613px);
    height: clamp(0px, 8.3333333333vw, 64px);
  }
}
.section_participate .participate_slider {
  width: 100%;
  margin-top: clamp(-1000px, 1.875vw, 48px);
}
.section_participate .participate_slider .participate_swiper {
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}
.section_participate .participate_slider .swiper-slide {
  width: auto;
}
.section_participate .participate_slider .swiper-slide:not(:last-child) {
  margin-right: clamp(-1000px, 3.6328125vw, 93px);
}
.section_participate .participate_slider .swiper-slide:last-child .participate_item::after {
  display: none;
}
@media screen and (max-width: 768px) {
  .section_participate .participate_slider {
    max-width: clamp(0px, 54.1666666667vw, 416px);
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 0;
    margin-top: clamp(0px, 6.1197916667vw, 47px);
  }
  .section_participate .participate_slider .participate_swiper {
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
  }
  .section_participate .participate_slider .swiper-slide:not(:last-child) {
    margin-right: clamp(0px, 10.4166666667vw, 80px);
  }
}
.section_participate .participate_item {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  width: clamp(-1000px, 10.9375vw, 280px);
  height: clamp(-1000px, 15.4296875vw, 395px);
  padding-top: clamp(-1000px, 0.78125vw, 20px);
  background: url(/tftset17/img/bg_participate_item-13360cee0f20968da45f3350c3711f5f.png) no-repeat center/100% 100%;
}
.section_participate .participate_item::after {
  position: absolute;
  top: 45.4%;
  left: clamp(-1000px, 12.4609375vw, 319px);
  width: clamp(-1000px, 0.859375vw, 22px);
  height: clamp(-1000px, 1.484375vw, 38px);
  background: url(/tftset17/img/ic_arrow_right-063fea1a77d618094b8bb308c1abb076.png) no-repeat center/cover;
  content: "";
}
.section_participate .participate_item.login .title {
  height: clamp(-1000px, 1.796875vw, 46px);
  aspect-ratio: 186/46;
}
.section_participate .participate_item.participate .title {
  height: clamp(-1000px, 0.9375vw, 24px);
}
.section_participate .participate_item.participate .text_note {
  margin-top: clamp(-1000px, 1.25vw, 32px);
}
.section_participate .participate_item.tier .title {
  height: clamp(-1000px, 1.796875vw, 46px);
  aspect-ratio: 200/46;
}
.section_participate .participate_item.rank .title {
  height: clamp(-1000px, 0.8984375vw, 23px);
  aspect-ratio: 156/23;
}
.section_participate .participate_item.rank .text_note {
  margin-top: clamp(-1000px, 0.703125vw, 18px);
}
.section_participate .participate_item .step {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  color: #84229c;
}
.section_participate .participate_item .step .label {
  font-size: clamp(0px, 0.625vw, 16px);
  font-weight: 600;
  line-height: 1.2;
}
.section_participate .participate_item .step .number {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  margin-top: clamp(-1000px, 0.3515625vw, 9px);
  height: clamp(-1000px, 0.703125vw, 18px);
}
.section_participate .participate_item .step .number > img {
  height: clamp(-1000px, 0.703125vw, 18px);
}
.section_participate .participate_item .image {
  width: clamp(-1000px, 4.6875vw, 120px);
  margin-top: clamp(-1000px, 2.3046875vw, 59px);
}
.section_participate .participate_item .title {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  margin-top: clamp(-1000px, 1.5625vw, 40px);
  height: -webkit-fit-content;
  height: -moz-fit-content;
  height: fit-content;
}
.section_participate .participate_item .text_note {
  font-size: clamp(0px, 0.546875vw, 14px);
  font-weight: 500;
  line-height: 1.6;
  color: #84229c;
  text-align: center;
}
@media screen and (max-width: 768px) {
  .section_participate .participate_item {
    width: clamp(0px, 58.59375vw, 450px);
    height: clamp(0px, 77.2135416667vw, 593px);
    padding-top: clamp(0px, 2.2135416667vw, 17px);
  }
  .section_participate .participate_item::after {
    left: clamp(0px, 62.7604166667vw, 482px);
    width: clamp(0px, 3.90625vw, 30px);
    height: clamp(0px, 7.421875vw, 57px);
  }
  .section_participate .participate_item.login .title {
    height: clamp(0px, 10.9375vw, 84px);
  }
  .section_participate .participate_item.participate .title {
    height: clamp(0px, 5.46875vw, 42px);
  }
  .section_participate .participate_item.participate .text_note {
    margin-top: clamp(0px, 5.46875vw, 42px);
  }
  .section_participate .participate_item.tier .title {
    height: clamp(0px, 10.9375vw, 84px);
  }
  .section_participate .participate_item.rank .title {
    height: clamp(0px, 5.46875vw, 42px);
  }
  .section_participate .participate_item.rank .text_note {
    margin-top: clamp(0px, 2.6041666667vw, 20px);
  }
  .section_participate .participate_item .step .label {
    font-size: clamp(0px, 3.125vw, 24px);
    font-weight: 600;
    line-height: 1.2;
  }
  .section_participate .participate_item .step .number {
    margin-top: clamp(0px, 1.171875vw, 9px);
    height: clamp(0px, 4.296875vw, 33px);
  }
  .section_participate .participate_item .step .number > img {
    height: clamp(0px, 4.296875vw, 33px);
  }
  .section_participate .participate_item .image {
    width: clamp(0px, 23.4375vw, 180px);
    margin-top: clamp(0px, 11.9791666667vw, 92px);
  }
  .section_participate .participate_item .title {
    margin-top: clamp(0px, 7.8125vw, 60px);
  }
  .section_participate .participate_item .text_note {
    font-size: clamp(0px, 2.734375vw, 21px);
    font-weight: 500;
    line-height: 1.6;
  }
}
.section_participate .notice_list {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  width: 100%;
  margin-top: clamp(-1000px, 1.875vw, 48px);
}
.section_participate .notice_list .notice_item {
  font-size: clamp(0px, 0.625vw, 16px);
  font-weight: 400;
  line-height: 1.36;
  color: #5b5d80;
}
@media screen and (max-width: 768px) {
  .section_participate .notice_list {
    -ms-flex-item-align: center;
    align-self: center;
    margin-top: clamp(0px, 7.8125vw, 60px);
  }
  .section_participate .notice_list .notice_item {
    font-size: clamp(0px, 2.34375vw, 18px);
    font-weight: 400;
    line-height: 1.4;
  }
}
.section_participate::before {
  position: absolute;
  bottom: -9vw;
  left: clamp(-1000px, 1.5234375vw, 39px);
  display: block;
  width: clamp(-1000px, 27.421875vw, 702px);
  height: clamp(-1000px, 27.421875vw, 702px);
  background: url(/tftset17/img/participate_character-eb88c8bdbeaa9c584e385aa8fdded02c.webp) no-repeat center/100% 100%;
  -webkit-animation: bouncing 1s infinite alternate;
  animation: bouncing 1s infinite alternate;
  content: "";
}
@media screen and (min-width: 2561px) {
  .section_participate::before {
    left: calc(50% - 1250px);
    width: 702px;
    height: 702px;
  }
}
@media screen and (max-width: 768px) {
  .section_participate {
    height: clamp(0px, 137.6302083333vw, 1057px);
    overflow: hidden;
    background: url(/tftset17/img/base_participate_mo-1e2bf58a775548ef4e29e5ef6364e755.webp) no-repeat center/100% 100%;
  }
  .section_participate::before {
    content: none;
  }
}

.section_ranking {
  padding: clamp(-1000px, 5.1171875vw, 131px) clamp(-1000px, 0vw, 0px) clamp(-1000px, 9.4921875vw, 243px);
  overflow: hidden;
}
@media screen and (max-width: 768px) {
  .section_ranking {
    padding: clamp(0px, 15.625vw, 120px) clamp(0px, 0vw, 0px) clamp(0px, 20.8333333333vw, 160px);
  }
}
.section_ranking .ranking_info_box.not_logged_in .ranking_title {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  padding-top: clamp(-1000px, 1.25vw, 32px);
  text-align: center;
}
.section_ranking .ranking_info_box.not_logged_in .ranking_title svg, .section_ranking .ranking_info_box.not_logged_in .ranking_title image {
  width: clamp(-1000px, 43.90625vw, 1124px);
  height: clamp(-1000px, 6.796875vw, 174px);
}
.section_ranking .ranking_info_box.not_logged_in .ranking_title .link_login {
  position: absolute;
  bottom: 0;
  left: clamp(-1000px, 7.03125vw, 180px);
  display: block;
  width: clamp(-1000px, 7.8125vw, 200px);
  height: clamp(-1000px, 3.515625vw, 90px);
}
@media screen and (max-width: 768px) {
  .section_ranking .ranking_info_box.not_logged_in .ranking_title svg, .section_ranking .ranking_info_box.not_logged_in .ranking_title image {
    width: clamp(0px, 75.5208333333vw, 580px);
    height: clamp(0px, 11.71875vw, 90px);
  }
  .section_ranking .ranking_info_box.not_logged_in .ranking_title .link_login {
    left: clamp(0px, 7.1614583333vw, 55px);
    width: clamp(0px, 13.0208333333vw, 100px);
    height: clamp(0px, 5.859375vw, 45px);
  }
}
.section_ranking .ranking_info_box.not_logged_in .notice_list {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  margin-top: clamp(-1000px, 2.03125vw, 52px);
}
@media screen and (max-width: 768px) {
  .section_ranking .ranking_info_box.not_logged_in .notice_list {
    margin-top: clamp(0px, 7.2916666667vw, 56px);
  }
}
.section_ranking .ranking_info_box.not_logged_in .notice_item {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  width: clamp(-1000px, 31.640625vw, 810px);
}
@media screen and (max-width: 768px) {
  .section_ranking .ranking_info_box.not_logged_in .notice_item {
    display: block;
    width: clamp(0px, 74.7395833333vw, 574px);
  }
}
.section_ranking .ranking_info_box.no_data .table_ranking {
  margin-top: clamp(-1000px, 4.140625vw, 106px);
}
.section_ranking .ranking_info_box.no_data .table_head {
  display: none;
}
.section_ranking .ranking_info_box.no_data .account_rank {
  width: 100%;
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}
.section_ranking .ranking_info_box.no_data .account_rank .label {
  margin-top: auto;
  font-weight: 600;
  margin-bottom: 3px;
}
.section_ranking .ranking_info_box.no_data .btn_update {
  display: none !important;
}
.section_ranking .ranking_info_box.no_data .btn_play_race {
  display: -webkit-box !important;
  display: -ms-flexbox !important;
  display: flex !important;
}
@media screen and (max-width: 768px) {
  .section_ranking .ranking_info_box.no_data .table_ranking {
    margin-top: clamp(0px, 10.4166666667vw, 80px);
  }
  .section_ranking .ranking_info_box.no_data .account_rank {
    width: clamp(0px, 26.8229166667vw, 206px);
  }
}
.section_ranking .inner {
  position: relative;
  z-index: 1;
  max-width: clamp(-1000px, 54.53125vw, 1396px);
  margin: 0 auto;
}
@media screen and (max-width: 768px) {
  .section_ranking .inner {
    max-width: clamp(0px, 83.3333333333vw, 640px);
  }
}
.section_ranking .ranking_time {
  padding-right: clamp(-1000px, 0.5078125vw, 13px);
  font-size: clamp(0px, 0.625vw, 16px);
  font-weight: 500;
  line-height: 1.36;
  color: #1a1d5d;
  text-align: right;
}
.section_ranking .ranking_time .type {
  padding-right: clamp(-1000px, 0.390625vw, 10px);
  color: #85229c;
}
@media screen and (max-width: 768px) {
  .section_ranking .ranking_time {
    padding-right: clamp(0px, 1.6927083333vw, 13px);
    font-size: clamp(0px, 2.0833333333vw, 16px);
    font-weight: 500;
    line-height: 1.36;
  }
  .section_ranking .ranking_time .type {
    padding-right: clamp(0px, 1.3020833333vw, 10px);
  }
}
.section_ranking .info_box {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: clamp(-1000px, 3.28125vw, 84px);
  width: clamp(-1000px, 54.296875vw, 1390px);
  height: clamp(-1000px, 9.2578125vw, 237px);
  margin: clamp(-1000px, 0.234375vw, 6px) auto clamp(-1000px, 0vw, 0px);
  padding: clamp(-1000px, 1.953125vw, 50px) clamp(-1000px, 2.96875vw, 76px) clamp(-1000px, 1.5625vw, 40px) clamp(-1000px, 3.3203125vw, 85px);
  background: url(/tftset17/img/bg_ranking_info-3d6bafd77976f4b6c44ac2a155a90b5b.webp) no-repeat center/100% 100%;
}
@media screen and (max-width: 768px) {
  .section_ranking .info_box {
    position: relative;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    gap: clamp(0px, 2.0833333333vw, 16px);
    width: 100%;
    height: clamp(0px, 30.46875vw, 234px);
    margin: 0;
    padding: clamp(0px, 7.2916666667vw, 56px) clamp(0px, 5.9895833333vw, 46px);
    background: url(/tftset17/img/bg_ranking_info_mo-f8598c01c125a757d1a1115f25a5e338.webp) no-repeat center/100% 100%;
  }
}
.section_ranking .info_account {
  width: clamp(-1000px, 11.5625vw, 296px);
  margin-top: clamp(-1000px, 0.7421875vw, 19px);
}
@media screen and (max-width: 768px) {
  .section_ranking .info_account {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    gap: clamp(0px, 2.6041666667vw, 20px);
    width: 100%;
    min-height: clamp(0px, 6.1197916667vw, 47px);
    margin-top: 0;
  }
}
.section_ranking .info_rank_detail {
  position: relative;
  -ms-flex-negative: 0;
  flex-shrink: 0;
  width: clamp(-1000px, 14.6875vw, 376px);
}
.section_ranking .info_rank_detail .item {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
}
@media screen and (max-width: 768px) {
  .section_ranking .info_rank_detail .item {
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    gap: clamp(0px, 2.6041666667vw, 20px);
  }
  .section_ranking .info_rank_detail .item:nth-child(2) {
    gap: clamp(0px, 2.9947916667vw, 23px);
  }
}
.section_ranking .info_rank_detail .item .label {
  font-size: clamp(0px, 0.859375vw, 22px);
  font-weight: 700;
  line-height: 1;
  color: #081f61;
}
@media screen and (max-width: 768px) {
  .section_ranking .info_rank_detail .item .label {
    font-size: clamp(0px, 2.8645833333vw, 22px);
    font-weight: 700;
    line-height: 1;
  }
}
.section_ranking .info_rank_detail .item .content {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  gap: clamp(-1000px, 0.46875vw, 12px);
  width: clamp(-1000px, 11.6015625vw, 297px);
  height: clamp(-1000px, 2.5390625vw, 65px);
  border-radius: clamp(-1000px, 2.34375vw, 60px);
  background: #D4D0E5;
}
.section_ranking .info_rank_detail .item .content .icon {
  width: clamp(-1000px, 1.71875vw, 44px);
}
.section_ranking .info_rank_detail .item .content .text {
  color: #09195F;
  font-size: clamp(0px, 0.859375vw, 22px);
  font-weight: 600;
  line-height: 1;
}
@media screen and (max-width: 768px) {
  .section_ranking .info_rank_detail .item .content {
    width: clamp(0px, 26.8229166667vw, 206px);
    height: clamp(0px, 6.5104166667vw, 50px);
    border-radius: clamp(0px, 7.8125vw, 60px);
    gap: clamp(0px, 0.6510416667vw, 5px);
  }
  .section_ranking .info_rank_detail .item .content .icon {
    width: clamp(0px, 5.7291666667vw, 44px);
    height: clamp(0px, 4.4270833333vw, 34px);
  }
  .section_ranking .info_rank_detail .item .content .icon img {
    width: 100%;
    height: 100%;
  }
  .section_ranking .info_rank_detail .item .content .text {
    font-size: clamp(0px, 2.8645833333vw, 22px);
    font-weight: 600;
    line-height: 1;
  }
}
.section_ranking .info_rank_detail .item + .item {
  margin-top: clamp(-1000px, 0.673828125vw, 17.25px);
}
@media screen and (max-width: 768px) {
  .section_ranking .info_rank_detail .item + .item {
    margin-top: 0;
  }
}
@media screen and (max-width: 768px) {
  .section_ranking .info_rank_detail {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    left: clamp(-1000px, 0vw, 0px);
    gap: clamp(0px, 3.515625vw, 27px);
    width: 100%;
  }
}
.section_ranking .account_name {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: end;
  -ms-flex-align: end;
  align-items: flex-end;
  width: 100%;
}
.section_ranking .account_name .name {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  font-size: clamp(0px, 1.09375vw, 28px);
  font-weight: 700;
  line-height: 1;
  letter-spacing: 0;
  color: #081f61;
}
@media screen and (max-width: 768px) {
  .section_ranking .account_name .name {
    margin: clamp(0px, 1.0416666667vw, 8px) clamp(0px, 0vw, 0px) clamp(0px, 0vw, 0px) clamp(0px, 0.5208333333vw, 4px);
    letter-spacing: clamp(0px, 0.1822916667vw, 1.4px);
  }
}
.section_ranking .account_name .label {
  -ms-flex-negative: 0;
  flex-shrink: 0;
  font-size: clamp(0px, 0.78125vw, 20px);
  font-weight: 600;
  line-height: 1;
  letter-spacing: 0;
  color: #081f61;
}
.section_ranking .account_rank {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: baseline;
  -ms-flex-align: baseline;
  align-items: baseline;
  gap: clamp(-1000px, 0.234375vw, 6px);
  margin-top: clamp(-1000px, 0.546875vw, 14px);
  color: #84229c;
}
.section_ranking .account_rank .number {
  font-size: clamp(0px, 2.03125vw, 52px);
  font-weight: 700;
  line-height: 1;
  letter-spacing: 0;
}
.section_ranking .account_rank .label {
  font-size: clamp(0px, 0.78125vw, 20px);
  font-weight: 600;
  line-height: 1;
  letter-spacing: 0;
}
@media screen and (max-width: 768px) {
  .section_ranking .account_rank {
    margin-top: 0;
  }
  .section_ranking .account_rank .number {
    letter-spacing: clamp(0px, 0.1822916667vw, 1.4px);
  }
}
@media screen and (max-width: 768px) {
  .section_ranking .account_name {
    width: clamp(0px, 34.2447916667vw, 263px);
  }
  .section_ranking .account_name .name {
    font-size: clamp(0px, 3.3854166667vw, 26px);
    font-weight: 700;
    line-height: 1;
  }
  .section_ranking .account_name .label {
    font-size: clamp(0px, 2.34375vw, 18px);
    font-weight: 600;
    line-height: 1;
  }
  .section_ranking .account_rank .number {
    font-size: clamp(0px, 6.1197916667vw, 47px);
    font-weight: 700;
    line-height: 1;
  }
  .section_ranking .account_rank .label {
    font-size: clamp(0px, 2.34375vw, 18px);
    font-weight: 600;
    line-height: 1;
  }
}
.section_ranking .btn_update {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  gap: clamp(-1000px, 0.46875vw, 12px);
  margin-top: clamp(-1000px, 1.07421875vw, 27.5px);
  background: url(../img/btn_update.png) no-repeat center/100% 100%;
  -webkit-transition: background 0.3s, color 0.3s;
  transition: background 0.3s, color 0.3s;
}
.section_ranking .btn_update::before {
  display: inline-block;
  -ms-flex-negative: 0;
  flex-shrink: 0;
  width: clamp(-1000px, 0.9375vw, 24px);
  height: clamp(-1000px, 0.9375vw, 24px);
  background: url(/tftset17/img/icon_refresh-e84c460b383dad68894f1f198bf39d55.png) no-repeat center/100%;
  content: "";
}
.section_ranking .btn_update .text {
  background: url("/tftset17/img/btn_tier_refresh-3a9e2d1a5faa67f3b72f10011db41fd7.png") no-repeat center;
  width: clamp(-1000px, 8.125vw, 208px);
  height: clamp(-1000px, 1.328125vw, 34px);
  -webkit-background-size: clamp(-1000px, 8.0078125vw, 205px) clamp(-1000px, 0.9375vw, 24px);
  background-size: clamp(-1000px, 8.0078125vw, 205px) clamp(-1000px, 0.9375vw, 24px);
}
@media screen and (max-width: 768px) {
  .section_ranking .btn_update {
    position: absolute;
    top: clamp(0px, 35.6770833333vw, 274px);
    left: 50%;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
    gap: clamp(0px, 1.5625vw, 12px);
    width: clamp(0px, 53.6458333333vw, 412px);
    height: clamp(0px, 13.0208333333vw, 100px);
    margin-top: 0;
  }
  .section_ranking .btn_update::after {
    width: clamp(0px, 3.3854166667vw, 26px);
    height: clamp(0px, 3.3854166667vw, 26px);
  }
  .section_ranking .btn_update::before {
    width: clamp(0px, 4.1666666667vw, 32px);
    height: clamp(0px, 4.1666666667vw, 32px);
  }
  .section_ranking .btn_update .text {
    background: url("/tftset17/img/btn_tier_refresh-3a9e2d1a5faa67f3b72f10011db41fd7.png") no-repeat center;
    width: clamp(0px, 29.4270833333vw, 226px);
    height: clamp(0px, 4.6875vw, 36px);
    -webkit-background-size: clamp(0px, 29.0364583333vw, 223px) clamp(0px, 3.3854166667vw, 26px);
    background-size: clamp(0px, 29.0364583333vw, 223px) clamp(0px, 3.3854166667vw, 26px);
  }
}
.section_ranking .btn_play_race {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  margin-top: clamp(-1000px, 1.07421875vw, 27.5px);
  -webkit-transition: background 0.3s, color 0.3s;
  transition: background 0.3s, color 0.3s;
}
.section_ranking .btn_play_race .text {
  width: clamp(-1000px, 6.875vw, 176px);
  height: clamp(-1000px, 1.328125vw, 34px);
  background: url(/tftset17/img/button_event-6bdb5d228958f11379aa3c905aba95bd.png) no-repeat center;
  -webkit-background-size: clamp(-1000px, 6.796875vw, 174px) clamp(-1000px, 0.9375vw, 24px);
  background-size: clamp(-1000px, 6.796875vw, 174px) clamp(-1000px, 0.9375vw, 24px);
}
@media screen and (max-width: 768px) {
  .section_ranking .btn_play_race {
    position: absolute;
    top: clamp(0px, 35.6770833333vw, 274px);
    left: 50%;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
    width: clamp(0px, 53.6458333333vw, 412px);
    height: clamp(0px, 13.0208333333vw, 100px);
    margin-top: 0;
    background: url(/tftset17/img/btn_race_play_mo-886c3a282a392b64bb4b60c439a3f700.png) no-repeat center/contain;
    font-size: clamp(0px, 3.6458333333vw, 28px);
    font-weight: 800;
    line-height: 1.5;
  }
  .section_ranking .btn_play_race .text {
    width: clamp(0px, 24.8697916667vw, 191px);
    height: clamp(0px, 4.6875vw, 36px);
    background: url(/tftset17/img/button_event-6bdb5d228958f11379aa3c905aba95bd.png) no-repeat center;
    -webkit-background-size: clamp(0px, 24.4791666667vw, 188px) clamp(0px, 3.3854166667vw, 26px);
    background-size: clamp(0px, 24.4791666667vw, 188px) clamp(0px, 3.3854166667vw, 26px);
  }
}
.section_ranking .notice_list {
  padding-left: clamp(-1000px, 0.1953125vw, 5px);
  margin-top: clamp(-1000px, 0.8203125vw, 21px);
}
@media screen and (max-width: 768px) {
  .section_ranking .notice_list {
    margin-top: clamp(0px, 24.7395833333vw, 190px);
  }
}
.section_ranking .notice_list .notice_item {
  font-size: clamp(0px, 0.625vw, 16px);
  font-weight: 500;
  line-height: 1.36;
  color: #5b5d7f;
}
.section_ranking .notice_list .notice_item:first-of-type {
  font-weight: 700;
  color: #85229c;
}
@media screen and (max-width: 768px) {
  .section_ranking .notice_list {
    padding-left: clamp(0px, 4.296875vw, 33px);
  }
  .section_ranking .notice_list .notice_item {
    position: relative;
    display: inline-block;
    padding-left: clamp(0px, 2.34375vw, 18px);
    font-size: clamp(0px, 2.34375vw, 18px);
    font-weight: 400;
    line-height: 1.36;
  }
  .section_ranking .notice_list .notice_item::before {
    position: absolute;
    top: 0;
    left: 0;
  }
}
.section_ranking .table_ranking {
  margin-top: clamp(-1000px, 5.8203125vw, 149px);
}
@media screen and (max-width: 768px) {
  .section_ranking .table_ranking {
    margin-top: clamp(0px, 13.9322916667vw, 107px);
  }
}
.section_ranking .table_ranking .table_layout_inner {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  min-width: 80%;
}
@media screen and (max-width: 768px) {
  .section_ranking .table_ranking .table_layout_inner {
    -webkit-transform: translateX(-32%);
    transform: translateX(-32%);
  }
}
.section_ranking .table_ranking .table_layout:nth-child(1) {
  width: clamp(-1000px, 10.5078125vw, 269px);
  text-align: center;
}
@media screen and (max-width: 768px) {
  .section_ranking .table_ranking .table_layout:nth-child(1) {
    width: clamp(0px, 13.4114583333vw, 103px);
  }
}
.section_ranking .table_ranking .table_layout:nth-child(2) {
  width: clamp(-1000px, 17.0703125vw, 437px);
  text-align: left;
}
@media screen and (max-width: 768px) {
  .section_ranking .table_ranking .table_layout:nth-child(2) {
    width: clamp(0px, 31.9010416667vw, 245px);
  }
}
.section_ranking .table_ranking .table_layout:nth-child(3) {
  width: clamp(-1000px, 15.9375vw, 408px);
  padding-left: clamp(-1000px, 7.03125vw, 180px);
}
@media screen and (max-width: 768px) {
  .section_ranking .table_ranking .table_layout:nth-child(3) {
    width: clamp(0px, 23.4375vw, 180px);
  }
}
.section_ranking .table_ranking .table_layout:nth-child(4) {
  -webkit-box-flex: 1;
  -ms-flex: 1;
  flex: 1;
  padding-left: clamp(-1000px, 4.453125vw, 114px);
}
.section_ranking .table_head {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  width: clamp(-1000px, 54.296875vw, 1390px);
  height: clamp(-1000px, 1.5625vw, 40px);
  margin: clamp(-1000px, 0vw, 0px) auto clamp(-1000px, 1.171875vw, 30px);
  background: url(/tftset17/img/bg_table_head-d4ff69b2446e75bc8bafbfd44d750e9b.png) no-repeat center/100% 100%;
}
.section_ranking .table_head .table_layout {
  position: relative;
  bottom: clamp(-1000px, 1.5625vw, 40px);
  font-size: clamp(0px, 1.015625vw, 26px);
  font-weight: 600;
  line-height: 1.2;
  color: #1a1c49;
}
.section_ranking .table_head .table_layout:nth-child(1) {
  width: clamp(-1000px, 10.5078125vw, 269px);
  text-align: center;
}
@media screen and (max-width: 768px) {
  .section_ranking .table_head .table_layout:nth-child(1) {
    width: clamp(0px, 13.4114583333vw, 103px);
  }
}
.section_ranking .table_head .table_layout:nth-child(2) {
  width: clamp(-1000px, 17.0703125vw, 437px);
  padding-left: clamp(-1000px, 4.453125vw, 114px);
}
@media screen and (max-width: 768px) {
  .section_ranking .table_head .table_layout:nth-child(2) {
    width: clamp(0px, 31.9010416667vw, 245px);
  }
}
.section_ranking .table_head .table_layout:nth-child(3) {
  width: clamp(-1000px, 15.9375vw, 408px);
  padding-left: clamp(-1000px, 9.1015625vw, 233px);
}
@media screen and (max-width: 768px) {
  .section_ranking .table_head .table_layout:nth-child(3) {
    width: clamp(0px, 23.4375vw, 180px);
  }
}
.section_ranking .table_head .table_layout:nth-child(4) {
  -webkit-box-flex: 1;
  -ms-flex: 1;
  flex: 1;
  padding-left: 0;
  text-align: center;
}
@media screen and (max-width: 768px) {
  .section_ranking .table_head {
    width: 100%;
    height: clamp(0px, 8.4635416667vw, 65px);
    margin: clamp(0px, 0vw, 0px) auto clamp(0px, 3.90625vw, 30px);
    background: url(/tftset17/img/bg_table_head_mo-1043a0f060ec7ae10be52c3e8cf63a64.png) no-repeat center/contain;
  }
  .section_ranking .table_head .table_layout {
    bottom: clamp(0px, 1.8229166667vw, 14px);
    font-size: clamp(0px, 3.3854166667vw, 26px);
    font-weight: 600;
    line-height: 1.2;
  }
  .section_ranking .table_head .table_layout:nth-child(1) {
    padding-left: clamp(0px, 2.34375vw, 18px);
  }
}
.section_ranking .table_body {
  margin-top: clamp(-1000px, 0.859375vw, 22px);
}
.section_ranking .table_body .table_layout:nth-child(3) {
  position: relative;
  right: clamp(-1000px, 0.390625vw, 10px);
}
@media screen and (max-width: 768px) {
  .section_ranking .table_body {
    margin-top: clamp(0px, 3.125vw, 24px);
  }
}
.section_ranking .table_body.empty_section {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  width: clamp(-1000px, 54.53125vw, 1396px);
  height: clamp(-1000px, 20.9375vw, 536px);
  background: url(/tftset17/img/bg_ranking_empty-8506a500de17d0d45e09609c6871bc48.png) no-repeat center/contain;
}
.section_ranking .table_body.empty_section .empty_area {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
}
.section_ranking .table_body.empty_section .no_data_img {
  width: clamp(-1000px, 8.59375vw, 220px);
  height: clamp(-1000px, 8.1640625vw, 209px);
}
.section_ranking .table_body.empty_section .empty_desc {
  margin-top: clamp(-1000px, 1.171875vw, 30px);
  width: clamp(-1000px, 41.6796875vw, 1067px);
  height: clamp(-1000px, 5.234375vw, 134px);
  background: url(/tftset17/img/empty_desc-7e93e0ca27122e1be9de536887d3a151.png) no-repeat center/100% 100%;
}
@media screen and (max-width: 768px) {
  .section_ranking .table_body.empty_section {
    width: clamp(0px, 83.3333333333vw, 640px);
    height: clamp(0px, 52.0833333333vw, 400px);
    background: url(/tftset17/img/bg_ranking_empty_mo-5b0190960e78046414f2d7588d092447.webp) no-repeat center/contain;
  }
  .section_ranking .table_body.empty_section .no_data_img {
    width: clamp(0px, 15.7552083333vw, 121px);
    height: clamp(0px, 15.1041666667vw, 116px);
  }
  .section_ranking .table_body.empty_section .empty_desc {
    margin-top: 0;
    width: clamp(0px, 56.1197916667vw, 431px);
    height: clamp(0px, 17.578125vw, 135px);
    background: url(/tftset17/img/empty_desc_mo-30959255483c2188ba0369aa8822f9c0.png) no-repeat center;
    -webkit-background-size: clamp(0px, 55.3385416667vw, 425px) clamp(0px, 15.7552083333vw, 121px);
    background-size: clamp(0px, 55.3385416667vw, 425px) clamp(0px, 15.7552083333vw, 121px);
  }
}
.section_ranking .table_item {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  height: clamp(-1000px, 4.765625vw, 122px);
  background: url(/tftset17/img/bg_table_item-72df42e1346d614cebd723eeda2f4698.webp) no-repeat center/100% 100%;
}
@media screen and (max-width: 768px) {
  .section_ranking .table_item {
    height: clamp(0px, 15.3645833333vw, 118px);
    background: url(/tftset17/img/bg_table_item_mo-2a83a367be537d4f113685f2d961718e.webp) no-repeat center/100% 100%;
  }
}
.section_ranking .table_item + .table_item {
  margin-top: clamp(-1000px, 0.78125vw, 20px);
}
@media screen and (max-width: 768px) {
  .section_ranking .table_item + .table_item {
    margin-top: clamp(0px, 2.6041666667vw, 20px);
  }
}
.section_ranking .table_item.rank_top {
  background: url(/tftset17/img/bg_table_item_top-e6f09d93ce3e7da2b10e9159535c01f0.webp) no-repeat center/100% 100%;
}
.section_ranking .table_item.rank_top .number {
  background: url(/tftset17/img/number_01-0dcd59826e66251e016001fa7c08704a.png) no-repeat center/contain;
  color: #fff;
}
.section_ranking .table_item.rank_top .text {
  color: #091B63;
}
@media screen and (max-width: 768px) {
  .section_ranking .table_item.rank_top {
    background: url(/tftset17/img/bg_table_item_top_mo-01f186bf2ae7c26edc2957eb7d3d7c4e.webp) no-repeat center/100% 100%;
  }
}
.section_ranking .table_item.rank_out .number {
  background: none;
  color: #8893c2;
}
.section_ranking .table_item.rank_out .text {
  color: #8893C2;
}
.section_ranking .table_item .number {
  position: relative;
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  left: clamp(-1000px, 0.078125vw, 2px);
  width: clamp(-1000px, 1.8359375vw, 47px);
  height: clamp(-1000px, 2.2265625vw, 57px);
  background: url(/tftset17/img/number_02-b493c5175fa9763d91a8daa13836395e.png) no-repeat center/contain;
  color: #fff;
  font-size: clamp(0px, 0.703125vw, 18px);
  font-weight: 900;
  line-height: 1.2;
}
@media screen and (max-width: 768px) {
  .section_ranking .table_item .number {
    left: clamp(0px, 1.3020833333vw, 10px);
    width: clamp(0px, 4.6875vw, 36px);
    height: clamp(0px, 5.7291666667vw, 44px);
    font-size: clamp(0px, 2.34375vw, 18px);
    font-weight: 900;
    line-height: 1.2;
  }
}
.section_ranking .table_item .table_layout {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  gap: clamp(-1000px, 0.3125vw, 8px);
}
.section_ranking .table_item .table_layout:first-child {
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
}
@media screen and (max-width: 768px) {
  .section_ranking .table_item .table_layout {
    gap: clamp(0px, 1.3020833333vw, 10px);
  }
}
.section_ranking .table_item .table_layout:has(.icon_influencer) {
  gap: clamp(-1000px, 0.390625vw, 10px);
}
@media screen and (max-width: 768px) {
  .section_ranking .table_item .table_layout:has(.icon_influencer) {
    gap: clamp(0px, 1.0416666667vw, 8px);
  }
}
.section_ranking .table_item .text {
  font-size: clamp(0px, 1.015625vw, 26px);
  font-weight: 600;
  line-height: 1.2;
  color: #8893C2;
}
@media screen and (max-width: 768px) {
  .section_ranking .table_item .text {
    font-size: clamp(0px, 3.125vw, 24px);
    font-weight: 600;
    line-height: 1.2;
  }
}
.section_ranking .table_item .name {
  display: inline-block;
  width: clamp(-1000px, 13.203125vw, 338px);
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  font-size: clamp(0px, 1.09375vw, 28px);
  font-weight: 600;
  line-height: 1.2;
}
@media screen and (max-width: 768px) {
  .section_ranking .table_item .name {
    width: clamp(0px, 22.265625vw, 171px);
    font-size: clamp(0px, 3.125vw, 24px);
    font-weight: 600;
    line-height: 1.2;
  }
}
.section_ranking .table_item .icon {
  width: clamp(-1000px, 2.1484375vw, 55px);
}
@media screen and (max-width: 768px) {
  .section_ranking .table_item .icon {
    width: clamp(0px, 7.1614583333vw, 55px);
  }
}
.section_ranking .table_item .icon_influencer {
  width: clamp(-1000px, 1.40625vw, 36px);
}
@media screen and (max-width: 768px) {
  .section_ranking .table_item .icon_influencer {
    width: clamp(0px, 3.7760416667vw, 29px);
  }
}
.section_ranking .pieces {
  position: absolute;
  top: 13vw;
  right: 0;
  z-index: 0;
  width: 100%;
  height: clamp(-1000px, 123.828125vw, 3170px);
}
.section_ranking .pieces::before {
  width: 100%;
  height: 100%;
  display: inline-block;
  background: url(/tftset17/img/rank_pieces-6963064b95ed23918b1d6bf9dc6b4829.png) no-repeat center/100% 100%;
  content: "";
}
.section_ranking .pieces_bottom {
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 0;
  width: 100%;
  height: clamp(-1000px, 150.546875vw, 3854px);
  background: url(/tftset17/img/rank_pieces_bottom-8f1861e0582ffc9b2b60c14b9fbb15ae.png) no-repeat center/100% 100%;
}
@media screen and (min-width: 2561px) {
  .section_ranking .pieces {
    width: 2560px;
    height: 3170px;
    right: 50%;
    -webkit-transform: translateX(50%) !important;
    transform: translateX(50%) !important;
  }
}
@media screen and (max-width: 768px) {
  .section_ranking .pieces {
    top: -20vw;
    left: -8vw;
    right: unset;
  }
  .section_ranking .pieces::before {
    width: clamp(0px, 108.0729166667vw, 830px);
    height: clamp(0px, 69.921875vw, 537px);
    background: url(/tftset17/img/rank_pieces_mo-b70ed77afee62aa3a04b160acf3bd6b4.png) no-repeat center/100% 100%;
  }
}

.ranking_wrap {
  position: relative;
  z-index: 1;
  background-color: #ccc;
}
.ranking_wrap * {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

.ranking_content {
  position: relative;
  overflow: hidden;
}
.ranking_content .bg_area {
  position: absolute;
  inset: 0;
  width: 100%;
}
.ranking_content .bg_area img {
  width: 100%;
  height: clamp(-1000px, 320.3125vw, 8200px);
}
@media screen and (max-width: 768px) {
  .ranking_content .bg_area img {
    height: clamp(0px, 1003.90625vw, 7710px);
  }
}

.pagination {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  gap: clamp(-1000px, 1.6015625vw, 41px);
  margin-top: clamp(-1000px, 4.4921875vw, 115px);
}
.pagination.only_mo {
  display: none;
}
.pagination_list {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: clamp(-1000px, 1.6015625vw, 41px);
}
.pagination_item {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  width: clamp(-1000px, 1.015625vw, 26px);
  height: clamp(-1000px, 1.015625vw, 26px);
}
.pagination_link {
  font-size: clamp(0px, 0.8203125vw, 21px);
  font-weight: 400;
  line-height: 1.2;
  color: #6D7BB5;
}
.pagination_link.is_current {
  font-weight: 500;
  color: #212156;
}
.pagination .btn_icon .ic_first, .pagination .btn_icon .ic_last {
  display: inline-block;
  width: clamp(-1000px, 1.09375vw, 28px);
  height: clamp(-1000px, 0.9375vw, 24px);
  background: url(/tftset17/img/icon_navi_02-0e6630872220f1bfc30fd789554bc4d5.png) no-repeat center/cover;
}
@media screen and (max-width: 768px) {
  .pagination .btn_icon .ic_first, .pagination .btn_icon .ic_last {
    width: clamp(0px, 3.3854166667vw, 26px);
    height: clamp(0px, 3.125vw, 24px);
  }
}
.pagination .btn_icon .ic_last, .pagination .btn_icon .ic_next {
  -webkit-transform: rotateY(-180deg);
  transform: rotateY(-180deg);
}
.pagination .btn_icon .ic_prev, .pagination .btn_icon .ic_next {
  display: inline-block;
  width: clamp(-1000px, 0.546875vw, 14px);
  height: clamp(-1000px, 0.9375vw, 24px);
  background: url(/tftset17/img/icon_navi_01-913e4aef87a49a8a423dc95321b26179.png) no-repeat center/cover;
}
@media screen and (max-width: 768px) {
  .pagination .btn_icon .ic_prev, .pagination .btn_icon .ic_next {
    width: clamp(0px, 2.34375vw, 18px);
    height: clamp(0px, 3.6458333333vw, 28px);
  }
}
@media screen and (max-width: 768px) {
  .pagination {
    gap: clamp(0px, 5.9895833333vw, 46px);
    margin-top: clamp(0px, 5.2083333333vw, 40px);
  }
  .pagination_list {
    gap: clamp(0px, 6.25vw, 48px);
  }
  .pagination_item {
    width: auto;
    height: clamp(0px, 3.7760416667vw, 29px);
  }
  .pagination_link {
    font-size: clamp(0px, 3.125vw, 24px);
    font-weight: 400;
    line-height: 1.2;
  }
  .pagination.only_mo {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
  }
  .pagination.only_pc {
    display: none;
  }
}

.section_application {
  position: relative;
  z-index: 1;
  height: clamp(-1000px, 45.1171875vw, 1155px);
  scroll-margin-top: clamp(-1000px, 4.6875vw, 120px);
}
@media screen and (max-width: 768px) {
  .section_application {
    height: clamp(0px, 303.3854166667vw, 2330px);
    scroll-margin-top: clamp(0px, 0.6510416667vw, 5px);
  }
}
.section_application .bg_area {
  overflow: hidden;
  position: absolute;
  top: clamp(-1000px, 6.640625vw, 170px);
  right: 0;
  width: 100%;
  height: 100%;
}
.section_application .bg_area .image {
  width: 100%;
  height: 100%;
  opacity: 0;
  -webkit-animation: fadeIn 0.5s 0.3s ease-out forwards;
  animation: fadeIn 0.5s 0.3s ease-out forwards;
}
@media screen and (max-width: 768px) {
  .section_application .bg_area {
    top: clamp(0px, 20.4427083333vw, 157px);
  }
  .section_application .bg_area .pieces {
    height: clamp(0px, 151.6927083333vw, 1165px);
  }
}
.section_application .inner {
  max-width: clamp(-1000px, 45.703125vw, 1170px);
  margin: 0 auto;
}
@media screen and (max-width: 768px) {
  .section_application .inner > .button_group {
    -webkit-box-ordinal-group: 4;
    -ms-flex-order: 3;
    order: 3;
  }
}
@media screen and (max-width: 768px) {
  .section_application .inner {
    max-width: clamp(0px, 83.3333333333vw, 640px);
    padding-top: clamp(0px, 17.4479166667vw, 134px);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
  }
}
.section_application .info_area {
  text-align: center;
}
.section_application .number_box {
  position: relative;
  padding: clamp(-1000px, 3.125vw, 80px) clamp(-1000px, 2.3828125vw, 61px) clamp(-1000px, 2.3828125vw, 61px) clamp(-1000px, 2.34375vw, 60px);
  width: clamp(-1000px, 14.765625vw, 378px);
  height: clamp(-1000px, 22.65625vw, 580px);
  background: url(/tftset17/img/bg_number_box-7090c00b145a186e1c1c97758bf0aaf7.png) no-repeat center/100% 100%;
}
.section_application .number_box .line {
  margin-top: clamp(-1000px, 0.9765625vw, 25px);
  margin-bottom: clamp(-1000px, 0.8984375vw, 23px);
  height: 1px;
  background-color: #ababbd;
}
.section_application .number_box .card_description {
  position: relative;
  margin-top: clamp(-1000px, 0.4296875vw, 11px);
  padding-left: clamp(-1000px, 1.0546875vw, 27px);
  font-size: clamp(0px, 0.625vw, 16px);
  font-weight: 600;
  line-height: 1.4;
  color: #5b5d80;
}
.section_application .number_box .card_description::before {
  position: absolute;
  top: 50%;
  left: 0;
  display: inline-block;
  width: clamp(-1000px, 0.625vw, 16px);
  height: clamp(-1000px, 0.703125vw, 18px);
  background: url("/tftset17/img/icon_info-33d60f3deb03c8c7c186435f6238a74e.png") no-repeat center/100%;
  vertical-align: top;
  -webkit-transform: translateY(-60%);
  transform: translateY(-60%);
  content: "";
}
.section_application .number_box .card_description em {
  font-weight: 700;
  color: #000;
}
@media screen and (max-width: 768px) {
  .section_application .number_box {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-ordinal-group: 5;
    -ms-flex-order: 4;
    order: 4;
    width: 100%;
    height: clamp(0px, 80.7291666667vw, 620px);
    margin-top: clamp(0px, 9.1145833333vw, 70px);
    padding: clamp(0px, 6.3802083333vw, 49px) clamp(0px, 7.5520833333vw, 58px) clamp(0px, 6.25vw, 48px);
    background: url(/tftset17/img/bg_number_box_mo-03c6b3a56a41d12b8c868a2c3f8a7c27.png) no-repeat center/contain;
  }
  .section_application .number_box .line {
    width: 100%;
    margin: 0 auto;
  }
  .section_application .number_box .card_description {
    -webkit-box-ordinal-group: 3;
    -ms-flex-order: 2;
    order: 2;
    margin-top: clamp(0px, 2.6041666667vw, 20px);
    margin-left: clamp(0px, 4.4270833333vw, 34px);
    padding-left: clamp(0px, 3.515625vw, 27px);
    font-size: clamp(0px, 2.8645833333vw, 22px);
    font-weight: 600;
    line-height: 1.4;
  }
  .section_application .number_box .card_description::before {
    width: clamp(0px, 2.734375vw, 21px);
    height: clamp(0px, 2.734375vw, 21px);
    background: url("/tftset17/img/icon_info-33d60f3deb03c8c7c186435f6238a74e.png") no-repeat center/100%;
  }
  .section_application .number_box .button_group {
    -webkit-box-ordinal-group: 2;
    -ms-flex-order: 1;
    order: 1;
  }
}
.section_application .number_box_title {
  max-width: clamp(-1000px, 8.7890625vw, 225px);
  font-size: clamp(0px, 1.171875vw, 30px);
  font-weight: 600;
  line-height: 1.4;
  color: #1a1c49;
  text-align: left;
}
.section_application .number_box_title .text {
  display: block;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
@media screen and (max-width: 768px) {
  .section_application .number_box_title {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    max-width: clamp(0px, 48.6979166667vw, 374px);
    margin: 0 auto;
    padding-bottom: clamp(0px, 2.734375vw, 21px);
    font-size: clamp(0px, 3.3854166667vw, 26px);
    font-weight: 600;
    line-height: 1.36;
  }
  .section_application .number_box_title .text {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    font-size: clamp(0px, 3.90625vw, 30px);
    font-weight: 700;
    line-height: 1.36;
  }
}
.section_application .number_group_title {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  aspect-ratio: 130/42;
  width: clamp(-1000px, 5.078125vw, 130px);
}
.section_application .number_group_title > img {
  width: clamp(-1000px, 5.0390625vw, 129px);
  height: clamp(-1000px, 1.1328125vw, 29px);
}
.section_application .number_group_content {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: end;
  -ms-flex-align: end;
  align-items: flex-end;
  width: 100%;
  gap: clamp(-1000px, 0.2734375vw, 7px);
  margin-top: clamp(-1000px, 0.078125vw, 2px);
}
@media screen and (max-width: 768px) {
  .section_application .number_group_content {
    margin-top: 0;
  }
}
@media screen and (max-width: 768px) {
  .section_application .number_group {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: clamp(0px, 2.0833333333vw, 16px);
    margin: clamp(0px, 4.4270833333vw, 34px) auto clamp(0px, 0vw, 0px);
    padding: 0;
  }
  .section_application .number_group_title {
    width: clamp(0px, 22.65625vw, 174px);
    height: clamp(0px, 7.2916666667vw, 56px);
    -ms-flex-negative: 0;
    flex-shrink: 0;
  }
  .section_application .number_group_title > img {
    width: clamp(0px, 22.3958333333vw, 172px);
    height: clamp(0px, 5.078125vw, 39px);
  }
  .section_application .number_group_content {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: clamp(0px, 3.3854166667vw, 26px);
  }
  .section_application .number_group_content .number_unit {
    font-size: clamp(0px, 4.4270833333vw, 34px);
    font-weight: 700;
    line-height: 1;
  }
}
.section_application .number_list {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  border: 2px solid #6265a4;
  background-color: #1a1c49;
}
.section_application .number_list.is_show .number_item .text::before {
  -webkit-animation: rolling 10s forwards;
  animation: rolling 10s forwards;
}
.section_application .number_list.is_show .number_item:nth-child(1) .text::before {
  -webkit-animation-duration: 1.2s;
  animation-duration: 1.2s;
}
.section_application .number_list.is_show .number_item:nth-child(2) .text::before {
  -webkit-animation-duration: 1.4s;
  animation-duration: 1.4s;
}
.section_application .number_list.is_show .number_item:nth-child(3) .text::before {
  -webkit-animation-duration: 1.6s;
  animation-duration: 1.6s;
}
.section_application .number_list.is_show .number_item:nth-child(4) .text::before {
  -webkit-animation-duration: 1.8s;
  animation-duration: 1.8s;
}
.section_application .number_item {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
}
.section_application .number_item:not(:last-child) {
  border-right: 1px solid #fff;
}
.section_application .number_item .text {
  position: relative;
  width: clamp(-1000px, 2.8125vw, 72px);
  height: clamp(-1000px, 3.203125vw, 82px);
  overflow: hidden;
  text-align: center;
  font-size: clamp(0px, 2.421875vw, 62px);
  font-weight: 900;
  line-height: 1.32;
  color: #fff;
}
.section_application .number_item .text::before {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  -webkit-transition: top 2s ease-in-out;
  transition: top 2s ease-in-out;
  font-size: clamp(0px, 2.421875vw, 62px);
  font-weight: 900;
  line-height: 1.32;
  line-height: calc(var(--lineheight));
  white-space: pre;
}
.section_application .number_item .text[data-value="-"]:before {
  content: "-\a 0\a 1\a 2\a 3\a 4\a 5\a 6\a 7\a 8\a 9\a 0\a 1\a 2\a 3\a 4\a 5\a 6\a 7\a 8\a 9\a 0\a 1\a 0";
}
.section_application .number_item .text[data-value="0"]:before {
  content: "0\a 0\a 1\a 2\a 3\a 4\a 5\a 6\a 7\a 8\a 9\a 0\a 1\a 2\a 3\a 4\a 5\a 6\a 7\a 8\a 9\a 0\a 1\a 0";
}
.section_application .number_item .text[data-value="1"]:before {
  content: "1\a 1\a 2\a 3\a 4\a 5\a 6\a 7\a 8\a 9\a 0\a 1\a 2\a 3\a 4\a 5\a 6\a 7\a 8\a 9\a 0\a 1\a 2\a 0";
}
.section_application .number_item .text[data-value="2"]:before {
  content: "2\a 2\a 3\a 4\a 5\a 6\a 7\a 8\a 9\a 0\a 1\a 2\a 3\a 4\a 5\a 6\a 7\a 8\a 9\a 0\a 1\a 2\a 3\a 0";
}
.section_application .number_item .text[data-value="3"]:before {
  content: "3\a 3\a 4\a 5\a 6\a 7\a 8\a 9\a 0\a 1\a 2\a 3\a 4\a 5\a 6\a 7\a 8\a 9\a 0\a 1\a 2\a 3\a 4\a 0";
}
.section_application .number_item .text[data-value="4"]:before {
  content: "4\a 4\a 5\a 6\a 7\a 8\a 9\a 0\a 1\a 2\a 3\a 4\a 5\a 6\a 7\a 8\a 9\a 0\a 1\a 2\a 3\a 4\a 5\a 0";
}
.section_application .number_item .text[data-value="5"]:before {
  content: "5\a 5\a 6\a 7\a 8\a 9\a 0\a 1\a 2\a 3\a 4\a 5\a 6\a 7\a 8\a 9\a 0\a 1\a 2\a 3\a 4\a 5\a 6\a 0";
}
.section_application .number_item .text[data-value="6"]:before {
  content: "6\a 0\a 1\a 2\a 3\a 4\a 5\a 6\a 7\a 8\a 9\a 0\a 1\a 2\a 3\a 4\a 5\a 6\a 7\a 8\a 9\a 0\a 1\a 0";
}
.section_application .number_item .text[data-value="7"]:before {
  content: "7\a 1\a 2\a 3\a 4\a 5\a 6\a 7\a 8\a 9\a 0\a 1\a 2\a 3\a 4\a 5\a 6\a 7\a 8\a 9\a 0\a 1\a 2\a 0";
}
.section_application .number_item .text[data-value="8"]:before {
  content: "8\a 2\a 3\a 4\a 5\a 6\a 7\a 8\a 9\a 0\a 1\a 2\a 3\a 4\a 5\a 6\a 7\a 8\a 9\a 0\a 1\a 2\a 3\a 0";
}
.section_application .number_item .text[data-value="9"]:before {
  content: "9\a 3\a 4\a 5\a 6\a 7\a 8\a 9\a 0\a 1\a 2\a 3\a 4\a 5\a 6\a 7\a 8\a 9\a 0\a 1\a 2\a 3\a 4\a 0";
}
@media screen and (max-width: 768px) {
  .section_application .number_item .text {
    width: clamp(0px, 10.6770833333vw, 82px);
    height: clamp(0px, 13.0208333333vw, 100px);
    font-size: clamp(0px, 8.0729166667vw, 62px);
    font-weight: 900;
    line-height: 1.4;
  }
  .section_application .number_item .text::before {
    font-size: clamp(0px, 8.0729166667vw, 62px);
    font-weight: 900;
    line-height: 1.4;
    line-height: calc(var(--lineheight));
  }
}
.section_application .number_unit {
  font-size: clamp(0px, 1.171875vw, 30px);
  font-weight: 700;
  line-height: 1.4;
  color: #1a1c49;
  position: relative;
  top: clamp(-1000px, 0.078125vw, 2px);
}
.section_application .button_group {
  padding-top: clamp(-1000px, 1.0546875vw, 27px);
}
.section_application .button_group .button {
  gap: clamp(-1000px, 0.46875vw, 12px);
}
.section_application .button_group .button .text {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}
@media screen and (max-width: 768px) {
  .section_application .button_group {
    padding-top: clamp(0px, 4.1666666667vw, 32px);
  }
  .section_application .button_group .button.button_reset {
    gap: clamp(0px, 1.8229166667vw, 14px);
  }
}
.section_application .button_reset::before {
  display: inline-block;
  -ms-flex-negative: 0;
  flex-shrink: 0;
  width: clamp(-1000px, 0.78125vw, 20px);
  height: clamp(-1000px, 0.78125vw, 20px);
  background: url("/tftset17/img/icon_refresh-e84c460b383dad68894f1f198bf39d55.png") no-repeat center/100%;
  content: "";
}
.section_application .button_reset .text {
  width: clamp(-1000px, 2.5vw, 64px);
}
.section_application .button_reset .text img {
  width: 100%;
}
@media screen and (max-width: 768px) {
  .section_application .button_reset::before {
    width: clamp(0px, 3.6458333333vw, 28px);
    height: clamp(0px, 3.6458333333vw, 28px);
  }
  .section_application .button_reset .text {
    width: clamp(0px, 13.5416666667vw, 104px);
  }
}
.section_application .button_link {
  margin-top: clamp(-1000px, 0.3125vw, 8px);
}
.section_application .button_link .text {
  width: clamp(-1000px, 8.359375vw, 214px);
}
.section_application .button_link .text img {
  height: clamp(-1000px, 0.625vw, 16px);
}
@media screen and (max-width: 768px) {
  .section_application .button_link {
    margin-top: clamp(0px, 1.5625vw, 12px);
  }
  .section_application .button_link .text {
    width: clamp(0px, 45.1822916667vw, 347px);
  }
  .section_application .button_link .text img {
    height: clamp(0px, 3.3854166667vw, 26px);
  }
}
.section_application .application_title {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  width: clamp(-1000px, 26.4453125vw, 677px);
  height: clamp(-1000px, 3.828125vw, 98px);
  margin: clamp(-1000px, 0.6640625vw, 17px) auto clamp(-1000px, 0vw, 0px);
}
.section_application .application_title svg,
.section_application .application_title image {
  width: clamp(-1000px, 26.3671875vw, 675px);
  height: clamp(-1000px, 2.578125vw, 66px);
}
@media screen and (max-width: 768px) {
  .section_application .application_title {
    position: relative;
    z-index: 1;
    margin-top: clamp(0px, 5.46875vw, 42px);
    width: clamp(0px, 65.4947916667vw, 503px);
    height: clamp(0px, 9.5052083333vw, 73px);
  }
  .section_application .application_title svg,
  .section_application .application_title image {
    width: clamp(0px, 65.4947916667vw, 503px);
    height: clamp(0px, 9.5052083333vw, 73px);
  }
}
.section_application .application_desc {
  position: relative;
  z-index: 1;
  font-size: clamp(0px, 0.78125vw, 20px);
  font-weight: 500;
  line-height: 1.4;
  color: #5d156e;
}
@media screen and (max-width: 768px) {
  .section_application .application_desc {
    margin-top: clamp(0px, -0.2604166667vw, -2px);
    font-size: clamp(0px, 2.8645833333vw, 22px);
    font-weight: 500;
    line-height: 1.4;
  }
}
.section_application .application_area {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  gap: clamp(-1000px, 0.859375vw, 22px);
  padding-top: clamp(-1000px, 1.1328125vw, 29px);
}
@media screen and (max-width: 768px) {
  .section_application .application_area {
    display: contents;
  }
}
.section_application .application_box {
  position: relative;
  width: clamp(-1000px, 29.921875vw, 766px);
  height: clamp(-1000px, 22.65625vw, 580px);
  border-radius: clamp(-1000px, 0.390625vw, 10px);
  overflow: hidden;
}
@media screen and (max-width: 768px) {
  .section_application .application_box {
    -webkit-box-ordinal-group: 3;
    -ms-flex-order: 2;
    order: 2;
    margin-top: clamp(0px, 1.8229166667vw, 14px);
    width: 100%;
    height: clamp(0px, 91.1458333333vw, 700px);
  }
}
.section_application .application_image {
  display: block;
  width: 100%;
  height: 100%;
}
@media screen and (max-width: 768px) {
  .section_application .application_image {
    width: clamp(0px, 83.3333333333vw, 640px);
    height: clamp(0px, 91.1458333333vw, 700px);
  }
}
.section_application .time_box {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  position: relative;
  z-index: 1;
  padding-top: clamp(-1000px, 0.703125vw, 18px);
}
.section_application .time_box .label {
  font-size: clamp(0px, 0.78125vw, 20px);
  font-weight: 500;
  line-height: 1.4;
  color: #1a1c49;
}
.section_application .time_box .period {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  margin-left: clamp(-1000px, 0.3125vw, 8px);
  font-size: clamp(0px, 0.78125vw, 20px);
  font-weight: 600;
  line-height: 1.4;
  color: #1a1c49;
}
@media screen and (max-width: 768px) {
  .section_application .time_box {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    padding-top: clamp(0px, 2.2135416667vw, 17px);
  }
  .section_application .time_box .label {
    font-size: clamp(0px, 2.6041666667vw, 20px);
    font-weight: 500;
    line-height: 1.4;
  }
  .section_application .time_box .period {
    margin-left: clamp(0px, 1.5625vw, 12px);
    font-size: clamp(0px, 2.8645833333vw, 22px);
    font-weight: 600;
    line-height: 1.4;
    letter-spacing: -0.034em;
  }
}
.section_application .notice_list + .button_group {
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  gap: clamp(-1000px, 0.9375vw, 24px);
  padding-top: clamp(-1000px, 1.6015625vw, 41px);
}
.section_application .notice_list + .button_group .button {
  -webkit-background-size: 100% 100%;
  background-size: 100% 100%;
}
.section_application .notice_list + .button_group .button_apply.is_disabled {
  background: url(/tftset17/img/button_navy_disabled-9c1f3f3548d29048bda1eb8e3c140dfe.png) no-repeat center/100% 100%;
}
.section_application .notice_list + .button_group .button .text > img {
  height: clamp(-1000px, 0.9375vw, 24px);
}
@media screen and (max-width: 768px) {
  .section_application .notice_list + .button_group .button .text > img {
    height: clamp(0px, 2.9947916667vw, 23px);
  }
}
@media screen and (max-width: 768px) {
  .section_application .notice_list + .button_group {
    gap: clamp(0px, 2.6041666667vw, 20px);
    padding-top: clamp(0px, 5.2083333333vw, 40px);
  }
}
.section_application .notice_list .notice_item {
  font-size: clamp(0px, 0.625vw, 16px);
  font-weight: 500;
  line-height: 1.4;
  color: #5b5d80;
}
@media screen and (max-width: 768px) {
  .section_application .notice_list {
    width: clamp(0px, 77.4739583333vw, 595px);
    -webkit-box-ordinal-group: 6;
    -ms-flex-order: 5;
    order: 5;
  }
  .section_application .notice_list .notice_item {
    font-size: clamp(0px, 2.34375vw, 18px);
    font-weight: 500;
    line-height: 1.4;
  }
}

.section_mission {
  height: clamp(-1000px, 30.46875vw, 780px);
}
@media screen and (max-width: 768px) {
  .section_mission {
    height: clamp(0px, 155.7291666667vw, 1196px);
    background: none;
  }
}
.section_mission .piece {
  overflow: hidden;
  position: absolute;
  top: -6vw;
  left: 0;
  z-index: 20;
  width: clamp(0px, 101.953125vw, 783px);
  height: clamp(0px, 67.578125vw, 519px);
  background: url("/tftset17/img/pieces_mission_mo-ca7903421622e6025ebe5e73b2b81c60.png") no-repeat center/100% 100%;
  opacity: 0;
}
.section_mission .inner {
  max-width: clamp(-1000px, 38.984375vw, 998px);
  margin: 0 auto;
}
@media screen and (max-width: 768px) {
  .section_mission .inner {
    max-width: 100%;
  }
}
.section_mission .mission_area {
  position: relative;
  height: 100%;
  background: url(/tftset17/img/bg_banner_guide-5c40ea0e23e54de916969b3a7c2b6f59.webp) no-repeat center/100% 100%;
}
@media screen and (max-width: 768px) {
  .section_mission .mission_area {
    background: url(/tftset17/img/bg_banner_guide_mo-cd4a7aa4526cfdaf5dc65503a00975f9.webp) no-repeat center/cover;
  }
}
.section_mission .title_box {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  padding-top: clamp(-1000px, 2.6171875vw, 67px);
}
.section_mission .title_box .subtitle {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -ms-flex-negative: 0;
  flex-shrink: 0;
  height: clamp(-1000px, 1.09375vw, 28px);
  aspect-ratio: 112/28;
}
.section_mission .title_box .subtitle > img {
  height: clamp(-1000px, 0.6640625vw, 17px);
  aspect-ratio: 212/34;
}
.section_mission .title_box .title {
  margin-top: clamp(-1000px, 0.390625vw, 10px);
}
.section_mission .title_box .title svg, .section_mission .title_box .title image {
  width: clamp(-1000px, 33.4765625vw, 857px);
  height: clamp(-1000px, 2.578125vw, 66px);
}
.section_mission .title_box .desc {
  margin-top: clamp(-1000px, 0.078125vw, 2px);
  font-size: clamp(0px, 0.78125vw, 20px);
  font-weight: 500;
  line-height: 1.4;
  color: #5d156e;
}
@media screen and (max-width: 768px) {
  .section_mission .title_box {
    padding-top: clamp(0px, 14.0625vw, 108px);
  }
  .section_mission .title_box .subtitle {
    height: clamp(0px, 3.6458333333vw, 28px);
  }
  .section_mission .title_box .subtitle > img {
    height: clamp(0px, 2.2135416667vw, 17px);
  }
  .section_mission .title_box .title {
    margin-top: clamp(0px, 1.8229166667vw, 14px);
  }
  .section_mission .title_box .title svg, .section_mission .title_box .title image {
    width: clamp(0px, 69.53125vw, 534px);
    height: clamp(0px, 17.3177083333vw, 133px);
  }
  .section_mission .title_box .desc {
    margin-top: clamp(0px, 0.5208333333vw, 4px);
    font-size: clamp(0px, 2.8645833333vw, 22px);
    font-weight: 500;
    line-height: 1.4;
    color: #5d156e;
  }
}
.section_mission .guide_box {
  margin-top: clamp(-1000px, 0.234375vw, 6px);
}
@media screen and (max-width: 768px) {
  .section_mission .guide_box {
    position: relative;
    margin-top: clamp(0px, 0vw, 0px);
  }
}
.section_mission .guide_inner {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  max-width: clamp(-1000px, 41.5234375vw, 1063px);
  gap: clamp(-1000px, 5.234375vw, 134px);
  margin: 0 auto;
}
@media screen and (max-width: 768px) {
  .section_mission .guide_inner {
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    max-width: clamp(0px, 83.3333333333vw, 640px);
  }
}
.section_mission .guide_text {
  margin: clamp(-1000px, 8.5546875vw, 219px) auto clamp(-1000px, 0vw, 0px);
}
@media screen and (max-width: 768px) {
  .section_mission .guide_text {
    width: 100%;
    margin-top: clamp(0px, 48.4375vw, 372px);
  }
}
.section_mission .guide_image {
  position: absolute;
  top: clamp(-1000px, 8.125vw, 208px);
  left: clamp(-1000px, 28.9453125vw, 741px);
  width: clamp(-1000px, 42.4609375vw, 1087px);
  height: clamp(-1000px, 16.2109375vw, 415px);
}
.section_mission .guide_image .image_character {
  position: absolute;
  top: -1px;
  left: clamp(-1000px, 10.0390625vw, 257px);
  z-index: 1;
  display: inline-block;
  width: clamp(-1000px, 18.4765625vw, 473px);
  height: clamp(-1000px, 16.2109375vw, 415px);
}
.section_mission .guide_image .image_character img {
  width: 100%;
  height: 100%;
  -o-object-fit: contain;
  object-fit: contain;
}
@media screen and (min-width: 2561px) {
  .section_mission .guide_image {
    left: 50%;
    -webkit-transform: translateX(-50%) !important;
    transform: translateX(-50%) !important;
  }
}
@media screen and (max-width: 768px) {
  .section_mission .guide_image {
    top: 0;
    left: 0;
    width: clamp(0px, 96.09375vw, 738px);
    height: clamp(0px, 71.6145833333vw, 550px);
    -webkit-transform: translateX(6.5vw);
    transform: translateX(6.5vw);
    opacity: 0;
    -webkit-animation-delay: 1s;
    animation-delay: 1s;
  }
  .section_mission .guide_image .image_character {
    top: 0;
    left: 0;
    width: clamp(0px, 64.7135416667vw, 497px);
    height: 100%;
  }
}
.section_mission .guide_dialog {
  position: absolute;
  z-index: 10;
  -webkit-animation: bouncing 1s infinite alternate;
  animation: bouncing 1s infinite alternate;
}
.section_mission .guide_dialog.left {
  top: clamp(-1000px, 0.5078125vw, 13px);
  left: clamp(-1000px, 0vw, 0px);
  width: clamp(-1000px, 14.921875vw, 382px);
  height: clamp(-1000px, 7.03125vw, 180px);
}
.section_mission .guide_dialog.right {
  top: clamp(-1000px, 0.2734375vw, 7px);
  right: clamp(-1000px, 0vw, 0px);
  width: clamp(-1000px, 14.7265625vw, 377px);
  height: clamp(-1000px, 7.03125vw, 180px);
  -webkit-animation-delay: 0.3s;
  animation-delay: 0.3s;
}
.section_mission .guide_dialog img {
  width: 100%;
  height: 100%;
  -o-object-fit: contain;
  object-fit: contain;
}
@media screen and (max-width: 768px) {
  .section_mission .guide_dialog.left, .section_mission .guide_dialog.right {
    right: 4%;
    left: unset;
    width: clamp(0px, 42.7083333333vw, 328px);
    height: clamp(0px, 19.53125vw, 150px);
  }
  .section_mission .guide_dialog.left {
    top: clamp(0px, 2.2135416667vw, 17px);
  }
  .section_mission .guide_dialog.right {
    top: clamp(0px, 21.7447916667vw, 167px);
  }
}
.section_mission .text_group {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  width: clamp(-1000px, 23.90625vw, 612px);
  height: clamp(-1000px, 7.65625vw, 196px);
  padding: clamp(-1000px, 0.7421875vw, 19px) clamp(-1000px, 3.3203125vw, 85px) clamp(-1000px, 0.15625vw, 4px) clamp(-1000px, 3.3203125vw, 85px);
  background: url(/tftset17/img/guide_frame-124d06d4e817257d3c46764737439b29.png) no-repeat center/100% 100%;
}
.section_mission .text_group .title {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  width: clamp(-1000px, 19.9609375vw, 511px);
  height: clamp(-1000px, 1.25vw, 32px);
}
.section_mission .text_group .card_info {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  gap: clamp(-1000px, 1.953125vw, 50px);
  margin-top: clamp(-1000px, 1.09375vw, 28px);
}
.section_mission .text_group .card_info .info {
  font-size: clamp(0px, 0.8984375vw, 23px);
  font-weight: 700;
  line-height: 1.4;
  letter-spacing: -3%;
  color: #474971;
  text-align: center;
}
.section_mission .text_group .subtitle {
  font-size: clamp(0px, 0.625vw, 16px);
  font-weight: 500;
  line-height: 1.36;
  color: rgba(185, 151, 91, 0.6980392157);
}
.section_mission .text_group .value {
  margin-top: clamp(-1000px, 0.1953125vw, 5px);
}
.section_mission .text_group .count {
  font-size: clamp(0px, 3.125vw, 80px);
  font-weight: 900;
  line-height: 1.4;
  color: #1a1c49;
}
.section_mission .text_group .unit {
  margin-left: clamp(-1000px, 0.2734375vw, 7px);
  font-size: clamp(0px, 1.015625vw, 26px);
  font-weight: 700;
  line-height: 1.4;
  color: #1a1c49;
}
@media screen and (max-width: 768px) {
  .section_mission .text_group {
    width: 100%;
    height: clamp(0px, 33.8541666667vw, 260px);
    padding: clamp(0px, 3.6458333333vw, 28px) clamp(0px, 6.640625vw, 51px) clamp(0px, 2.8645833333vw, 22px) clamp(0px, 6.9010416667vw, 53px);
  }
  .section_mission .text_group .title {
    width: clamp(0px, 75.1302083333vw, 577px);
    height: clamp(0px, 4.6875vw, 36px);
  }
  .section_mission .text_group .subtitle {
    margin-top: clamp(0px, 0.2604166667vw, 2px);
    font-size: clamp(0px, 2.34375vw, 18px);
    font-weight: 500;
    line-height: 1.36;
  }
  .section_mission .text_group .card_info {
    gap: clamp(0px, 6.7708333333vw, 52px);
    margin-top: clamp(0px, 6.3802083333vw, 49px);
  }
  .section_mission .text_group .card_info .info {
    font-size: clamp(0px, 3.90625vw, 30px);
    font-weight: 700;
    line-height: 1.2;
    color: #474971;
  }
  .section_mission .text_group .count {
    font-size: clamp(0px, 11.71875vw, 90px);
    font-weight: 900;
    line-height: 1.4;
  }
  .section_mission .text_group .unit {
    position: relative;
    top: clamp(-99px, -0.5208333333vw, -4px);
    margin-left: clamp(0px, 1.953125vw, 15px);
    font-size: clamp(0px, 5.2083333333vw, 40px);
    font-weight: 700;
    line-height: 1.4;
  }
}
.section_mission .notice_list {
  margin-top: clamp(-1000px, 0.5859375vw, 15px);
}
.section_mission .notice_list .notice_item {
  font-size: clamp(0px, 0.625vw, 16px);
  font-weight: 400;
  line-height: 1.4;
  color: #5b5d80;
}
@media screen and (max-width: 768px) {
  .section_mission .notice_list {
    margin-top: clamp(0px, 4.4270833333vw, 34px);
  }
  .section_mission .notice_list .notice_item {
    max-width: clamp(0px, 68.75vw, 528px);
    font-size: clamp(0px, 2.34375vw, 18px);
    font-weight: 400;
    line-height: 1.4;
  }
}

.section_invite {
  z-index: 1;
  height: clamp(-1000px, 45.15625vw, 1156px);
  padding-bottom: clamp(-1000px, 3.125vw, 80px);
}
@media screen and (max-width: 768px) {
  .section_invite {
    height: clamp(0px, 346.3541666667vw, 2660px);
    padding-top: clamp(0px, 10.15625vw, 78px);
  }
}
.section_invite .inner {
  position: relative;
  max-width: clamp(-1000px, 40.3125vw, 1032px);
  margin: 0 auto;
}
@media screen and (max-width: 768px) {
  .section_invite .inner {
    max-width: 100%;
  }
}
.section_invite .title_box {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  padding-top: clamp(-1000px, 3.28125vw, 84px);
}
.section_invite .title_box .subtitle {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -ms-flex-negative: 0;
  flex-shrink: 0;
  height: clamp(-1000px, 1.09375vw, 28px);
  aspect-ratio: 112/28;
}
.section_invite .title_box .subtitle > img {
  height: clamp(-1000px, 0.6640625vw, 17px);
  aspect-ratio: 219/34;
}
.section_invite .title_box .title {
  margin-top: clamp(-1000px, 0.390625vw, 10px);
}
.section_invite .title_box .title svg, .section_invite .title_box .title image {
  width: clamp(-1000px, 22.6171875vw, 579px);
  height: clamp(-1000px, 2.734375vw, 70px);
}
.section_invite .title_box .desc {
  margin-top: clamp(-1000px, 0.078125vw, 2px);
  font-size: clamp(0px, 0.78125vw, 20px);
  font-weight: 500;
  line-height: 1.4;
  color: #85229c;
  text-align: center;
}
@media screen and (max-width: 768px) {
  .section_invite .title_box {
    padding-top: 0;
  }
  .section_invite .title_box .subtitle {
    height: clamp(0px, 3.6458333333vw, 28px);
    aspect-ratio: 112/28;
  }
  .section_invite .title_box .subtitle > img {
    height: clamp(0px, 2.2135416667vw, 17px);
    aspect-ratio: 219/34;
  }
  .section_invite .title_box .title {
    margin-top: clamp(0px, 1.0416666667vw, 8px);
  }
  .section_invite .title_box .title svg,
  .section_invite .title_box .title image {
    width: clamp(0px, 75.390625vw, 579px);
    height: clamp(0px, 9.1145833333vw, 70px);
  }
  .section_invite .title_box .desc {
    margin-top: clamp(0px, 0.5208333333vw, 4px);
    font-size: clamp(0px, 2.8645833333vw, 22px);
    font-weight: 500;
    line-height: 1.4;
  }
}
.section_invite .invite_box {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  padding-top: clamp(-1000px, 2.3828125vw, 61px);
  gap: clamp(-1000px, 1.171875vw, 30px);
}
.section_invite .invite_box .info_text {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  height: clamp(-1000px, 1.40625vw, 36px);
}
.section_invite .invite_box .info_text > img {
  height: clamp(-1000px, 0.9765625vw, 25px);
}
@media screen and (max-width: 768px) {
  .section_invite .invite_box {
    gap: clamp(0px, 3.90625vw, 30px);
    max-width: clamp(0px, 83.3333333333vw, 640px);
    margin: 0 auto;
    padding-top: clamp(0px, 54.5572916667vw, 419px);
  }
  .section_invite .invite_box .info_text {
    height: clamp(0px, 7.2916666667vw, 56px);
  }
  .section_invite .invite_box .info_text > img {
    height: clamp(0px, 5.078125vw, 39px);
  }
}
.section_invite .invite_item {
  width: clamp(-1000px, 19.53125vw, 500px);
  height: clamp(-1000px, 29.1796875vw, 747px);
  padding: clamp(-1000px, 3.125vw, 80px) clamp(-1000px, 1.8359375vw, 47px) clamp(-1000px, 2.5vw, 64px);
  background: url(/tftset17/img/invite_frame-ddc5660c3021f7d2f108295402a76eca.png) no-repeat center/100% 100%;
}
.section_invite .invite_item:nth-child(1) .invite_title {
  width: clamp(-1000px, 6.640625vw, 170px);
}
@media screen and (max-width: 768px) {
  .section_invite .invite_item:nth-child(1) .invite_title {
    width: clamp(0px, 29.5572916667vw, 227px);
    height: clamp(0px, 7.2916666667vw, 56px);
  }
}
.section_invite .invite_item:nth-child(2) .invite_title {
  width: clamp(-1000px, 10.15625vw, 260px);
}
@media screen and (max-width: 768px) {
  .section_invite .invite_item:nth-child(2) {
    margin-top: clamp(-99px, -0.6510416667vw, -5px);
    padding-top: clamp(0px, 13.5416666667vw, 104px);
  }
  .section_invite .invite_item:nth-child(2) .invite_title {
    width: clamp(0px, 45.1822916667vw, 347px);
    height: clamp(0px, 14.5833333333vw, 112px);
  }
  .section_invite .invite_item:nth-child(2) .invite_code {
    margin-top: clamp(0px, 3.3854166667vw, 26px);
  }
  .section_invite .invite_item:nth-child(2) .info_text {
    width: clamp(0px, 52.0833333333vw, 400px);
    height: clamp(0px, 14.5833333333vw, 112px);
    margin: 0 auto;
  }
  .section_invite .invite_item:nth-child(2) .info_text > img {
    width: 100%;
    height: 100%;
    -o-object-fit: contain;
    object-fit: contain;
  }
}
@media screen and (max-width: 768px) {
  .section_invite .invite_item {
    width: 100%;
    height: clamp(0px, 126.953125vw, 975px);
    padding: clamp(0px, 13.0208333333vw, 100px) clamp(0px, 9.1145833333vw, 70px);
  }
}
.section_invite .invite_title {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  height: clamp(-1000px, 3.28125vw, 84px);
  margin: 0 auto;
}
.section_invite .invite_code {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  width: 100%;
  height: clamp(-1000px, 3.3984375vw, 87px);
  margin-top: clamp(-1000px, 0.703125vw, 18px);
  background-color: #1a1c49;
  border: 2px solid #fff;
  font-size: clamp(0px, 1.015625vw, 26px);
  font-weight: 600;
  line-height: 1.3;
  color: #ababbd;
  text-align: center;
  outline: none;
}
.section_invite .invite_code.is_disabled {
  background-color: #404266;
}
@media screen and (max-width: 768px) {
  .section_invite .invite_code {
    width: clamp(0px, 65.1041666667vw, 500px);
    height: clamp(0px, 13.0208333333vw, 100px);
    margin: clamp(0px, 5.2083333333vw, 40px) auto clamp(0px, 0vw, 0px) auto;
    font-size: clamp(0px, 4.4270833333vw, 34px);
    font-weight: 700;
    line-height: 1.4;
  }
}
.section_invite .button_group {
  height: clamp(-1000px, 6.6015625vw, 169px);
  margin-top: clamp(-1000px, 0.546875vw, 14px);
  padding-bottom: clamp(-1000px, 2.1875vw, 56px);
  border-bottom: 1px solid #ababbd;
  border-width: clamp(-1000px, 0.0390625vw, 1px);
}
@media screen and (max-width: 768px) {
  .section_invite .button_group {
    height: auto;
    margin-top: clamp(0px, 4.8177083333vw, 37px);
    padding-bottom: clamp(0px, 6.640625vw, 51px);
    border-width: clamp(0px, 0.1302083333vw, 1px);
  }
}
.section_invite .button_copy {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  gap: clamp(-1000px, 0.2734375vw, 7px);
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  margin-bottom: clamp(-1000px, 0.9375vw, 24px);
  padding-bottom: clamp(-1000px, 0.1953125vw, 5px);
  -webkit-transition: color 0.3s linear;
  transition: color 0.3s linear;
  font-size: clamp(0px, 0.703125vw, 18px);
  font-weight: 600;
  line-height: 1.4;
  color: #5b5d80;
}
.section_invite .button_copy::after {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: clamp(-1000px, 0.078125vw, 2px);
  background: currentColor;
  -webkit-transition: background 0.3s linear;
  transition: background 0.3s linear;
  content: "";
}
.section_invite .button_copy:hover:not(:disabled) {
  color: #5d156e;
}
.section_invite .button_copy:hover:not(:disabled) .ic_copy::before {
  background: url(/tftset17/img/ic_copy_h-2b5fdd02ec5ff3861bbe2036c50378c3.png) no-repeat center/cover;
}
.section_invite .button_copy .ic_copy::before {
  display: block;
  width: clamp(-1000px, 0.78125vw, 20px);
  height: clamp(-1000px, 0.78125vw, 20px);
  background: url(/tftset17/img/ic_copy-69c5204f89137462c89b81ab590a1008.png) no-repeat center/cover;
  -webkit-transition: background 0.3s linear;
  transition: background 0.3s linear;
  content: "";
}
@media screen and (max-width: 768px) {
  .section_invite .button_copy .ic_copy::before {
    width: clamp(0px, 3.90625vw, 30px);
    height: clamp(0px, 3.90625vw, 30px);
  }
}
@media screen and (max-width: 768px) {
  .section_invite .button_copy {
    gap: clamp(0px, 1.953125vw, 15px);
    width: clamp(0px, 32.03125vw, 246px);
    height: clamp(0px, 5.9895833333vw, 46px);
    margin: clamp(0px, 0vw, 0px) auto clamp(0px, 5.46875vw, 42px);
    padding-bottom: clamp(0px, 1.3020833333vw, 10px);
    font-size: clamp(0px, 3.3854166667vw, 26px);
    font-weight: 600;
    line-height: 1.3;
  }
}
.section_invite .button_share,
.section_invite .button_invite,
.section_invite .button_apply_done {
  -ms-flex-negative: 0;
  flex-shrink: 0;
  gap: clamp(-1000px, 0.3125vw, 8px);
  margin-top: auto;
}
.section_invite .button_share.is_disabled,
.section_invite .button_invite.is_disabled,
.section_invite .button_apply_done.is_disabled {
  background: url(/tftset17/img/button_purple_disabled-abe600961cf9585380088c661d88738b.png) no-repeat center/100% 100%;
}
.section_invite .button_share .text,
.section_invite .button_invite .text,
.section_invite .button_apply_done .text {
  height: clamp(-1000px, 1.09375vw, 28px);
}
.section_invite .button_share .text > img,
.section_invite .button_invite .text > img,
.section_invite .button_apply_done .text > img {
  height: clamp(-1000px, 0.7421875vw, 19px);
}
@media screen and (max-width: 768px) {
  .section_invite .button_share,
  .section_invite .button_invite,
  .section_invite .button_apply_done {
    gap: clamp(0px, 1.5625vw, 12px);
  }
  .section_invite .button_share .text,
  .section_invite .button_invite .text,
  .section_invite .button_apply_done .text {
    height: clamp(0px, 4.6875vw, 36px);
  }
  .section_invite .button_share .text > img,
  .section_invite .button_invite .text > img,
  .section_invite .button_apply_done .text > img {
    height: clamp(0px, 2.9947916667vw, 23px);
  }
}
.section_invite .button_share .text {
  width: clamp(-1000px, 6.5234375vw, 167px);
}
.section_invite .button_share .text img {
  width: clamp(-1000px, 6.4453125vw, 165px);
}
@media screen and (max-width: 768px) {
  .section_invite .button_share .text {
    width: clamp(0px, 28.2552083333vw, 217px);
  }
  .section_invite .button_share .text > img {
    width: clamp(0px, 27.9947916667vw, 215px);
  }
}
.section_invite .button_invite .text {
  width: clamp(-1000px, 6.796875vw, 174px);
}
.section_invite .button_invite .text img {
  width: clamp(-1000px, 6.6796875vw, 171px);
  height: clamp(-1000px, 0.78125vw, 20px);
}
@media screen and (max-width: 768px) {
  .section_invite .button_invite .text {
    width: clamp(0px, 29.4270833333vw, 226px);
  }
  .section_invite .button_invite .text > img {
    width: clamp(0px, 29.0364583333vw, 223px);
    height: clamp(0px, 3.2552083333vw, 25px);
  }
}
.section_invite .button_apply_done .text {
  width: clamp(-1000px, 3.3984375vw, 87px);
}
.section_invite .button_apply_done .text img {
  width: clamp(-1000px, 3.359375vw, 86px);
  height: clamp(-1000px, 0.78125vw, 20px);
}
@media screen and (max-width: 768px) {
  .section_invite .button_apply_done .text {
    width: clamp(0px, 14.7135416667vw, 113px);
  }
  .section_invite .button_apply_done .text > img {
    width: clamp(0px, 14.5833333333vw, 112px);
    height: clamp(0px, 3.2552083333vw, 25px);
  }
}
.section_invite .sns_list {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  gap: clamp(-1000px, 0.78125vw, 20px);
  padding-top: clamp(-1000px, 0.703125vw, 18px);
}
@media screen and (max-width: 768px) {
  .section_invite .sns_list {
    gap: clamp(0px, 3.2552083333vw, 25px);
    padding-top: clamp(0px, 2.6041666667vw, 20px);
  }
}
.section_invite .sns_item {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  width: clamp(-1000px, 3.125vw, 80px);
  height: clamp(-1000px, 3.828125vw, 98px);
  -webkit-transition: background 0.3s linear;
  transition: background 0.3s linear;
}
.section_invite .sns_item:nth-child(1) {
  background: url(/tftset17/img/img_share-528b617601251bf48380397d31d20735.png) no-repeat center/contain;
}
.section_invite .sns_item:nth-child(2) {
  background: url(/tftset17/img/img_x-fc28ef06b3c107d66e6fb7a31f54ff98.png) no-repeat center/contain;
}
.section_invite .sns_item:hover:nth-child(1) {
  background: url(/tftset17/img/img_share_h-503b90f9038dbc6950aa2d1c4aa06728.png) no-repeat center/contain;
}
.section_invite .sns_item:hover:nth-child(2) {
  background: url(/tftset17/img/img_x_h-58413a507e5357c526d1bdcf803f22f6.png) no-repeat center/contain;
}
@media screen and (max-width: 768px) {
  .section_invite .sns_item {
    width: clamp(0px, 15.625vw, 120px);
    height: clamp(0px, 19.140625vw, 147px);
  }
  .section_invite .sns_item .ic {
    width: clamp(0px, 9.1145833333vw, 70px);
    height: clamp(0px, 9.1145833333vw, 70px);
  }
}
.section_invite .info_group {
  padding-top: clamp(-1000px, 1.5234375vw, 39px);
}
.section_invite .info_group .count {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  gap: clamp(-1000px, 0.3515625vw, 9px);
  margin-top: clamp(-1000px, -0.2734375vw, -7px);
  margin-bottom: clamp(-1000px, -0.1171875vw, -3px);
  color: #1a1c49;
  text-align: center;
}
.section_invite .info_group .count .number {
  height: 100%;
  font-size: clamp(0px, 3.515625vw, 90px);
  font-weight: 900;
  line-height: 1.4;
  color: #1a1c49;
}
.section_invite .info_group .count .unit {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  width: clamp(-1000px, 1.015625vw, 26px);
  height: clamp(-1000px, 1.40625vw, 36px);
  margin-top: clamp(-1000px, 1.5625vw, 40px);
}
.section_invite .info_group .count .unit > img {
  height: clamp(-1000px, 0.9765625vw, 25px);
}
@media screen and (max-width: 768px) {
  .section_invite .info_group {
    padding-top: 0;
    margin-top: clamp(0px, 6.3802083333vw, 49px);
  }
  .section_invite .info_group .count {
    gap: clamp(0px, 1.3020833333vw, 10px);
    margin-top: clamp(-7px, -0.9114583333vw, -7px);
    margin-bottom: clamp(-5px, -0.6510416667vw, -5px);
  }
  .section_invite .info_group .count .number {
    font-size: clamp(0px, 14.3229166667vw, 110px);
    font-weight: 900;
    line-height: 1.4;
  }
  .section_invite .info_group .count .unit {
    width: clamp(0px, 5.2083333333vw, 40px);
    height: clamp(0px, 7.2916666667vw, 56px);
    margin-top: clamp(0px, 5.2083333333vw, 40px);
  }
  .section_invite .info_group .count .unit > img {
    height: clamp(0px, 4.9479166667vw, 38px);
  }
}
.section_invite .notice_list {
  margin-top: 0;
}
.section_invite .notice_list .notice_item {
  line-height: 1.4;
  font-weight: 400;
  color: #5b5d80;
}
@media screen and (max-width: 768px) {
  .section_invite .notice_list {
    margin: clamp(0px, 2.4739583333vw, 19px) auto clamp(0px, 0vw, 0px);
  }
}
.section_invite .character_img {
  top: 15.2%;
  left: 92.7%;
}
.section_invite .character_img::before {
  width: clamp(-1000px, 21.484375vw, 550px);
  height: clamp(-1000px, 24.375vw, 624px);
  background: url(/tftset17/img/character_04-5e4338a6cd1d136f6840195b6af6b0b7.webp) no-repeat center/cover;
  -webkit-animation: bouncing 1s infinite alternate;
  animation: bouncing 1s infinite alternate;
}
@media screen and (max-width: 768px) {
  .section_invite .character_img {
    top: clamp(0px, 22.1354166667vw, 170px);
    left: clamp(0px, 18.2291666667vw, 140px);
  }
  .section_invite .character_img::before {
    width: clamp(0px, 64.7135416667vw, 497px);
    height: clamp(0px, 64.7135416667vw, 497px);
    background: url(/tftset17/img/character_04_mo-6ee2d910aa043eb91d103ab1353a73e0.webp) no-repeat center/cover;
    -webkit-animation: none;
    animation: none;
  }
}
.section_invite .piece {
  overflow: hidden;
  position: absolute;
  top: -10vw;
  z-index: 20;
  left: clamp(-1000px, 6.40625vw, 164px);
  width: clamp(-1000px, 15.3515625vw, 393px);
  height: clamp(-1000px, 24.4921875vw, 627px);
  background: url("/tftset17/img/bg_piece-9c1ece76aec5958db79d9578f6d08d42.png") no-repeat center/100% 100%;
  -webkit-animation: fadeIn 0.5s 0.3s ease-out forwards;
  animation: fadeIn 0.5s 0.3s ease-out forwards;
  opacity: 0;
}
.section_invite .pieces {
  overflow: hidden;
  position: absolute;
  top: clamp(0px, 20.1822916667vw, 155px);
  right: 0;
  left: 0;
  height: clamp(0px, 52.0833333333vw, 400px);
  background: url("/tftset17/img/bg_pieces_02_mo-0410df24f80e243cf78215b32a528427.png") no-repeat center/100%;
  -webkit-animation: fadeIn 0.5s 0.3s ease-out forwards;
  animation: fadeIn 0.5s 0.3s ease-out forwards;
  opacity: 0;
}

.section_strategy {
  height: clamp(-1000px, 43.4765625vw, 1113px);
  padding-top: clamp(-1000px, 2.96875vw, 76px);
}
@media screen and (max-width: 768px) {
  .section_strategy {
    position: relative;
    height: clamp(0px, 118.4895833333vw, 910px);
    padding-top: clamp(0px, 14.453125vw, 111px);
    padding-bottom: clamp(0px, 13.0208333333vw, 100px);
  }
  .section_strategy::before {
    position: absolute;
    top: -9%;
    right: 0;
    left: 0;
    width: 100%;
    height: clamp(0px, 137.7604166667vw, 1058px);
    background: url(/tftset17/img/strategy_pieces-4c8f21a6dfe132d859f01059e1072fd1.png) no-repeat center/100% 100%;
    content: "";
  }
}
.section_strategy .inner {
  max-width: clamp(-1000px, 54.6875vw, 1400px);
  margin: 0 auto;
}
@media screen and (max-width: 768px) {
  .section_strategy .inner {
    max-width: 100%;
  }
}
.section_strategy .strategy_title {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  margin-right: auto;
  margin-left: auto;
}
.section_strategy .strategy_title svg, .section_strategy .strategy_title image {
  width: clamp(-1000px, 35.3125vw, 904px);
  height: clamp(-1000px, 2.734375vw, 70px);
}
@media screen and (max-width: 768px) {
  .section_strategy .strategy_title svg, .section_strategy .strategy_title image {
    width: clamp(0px, 78.125vw, 600px);
    height: clamp(0px, 17.7083333333vw, 136px);
  }
}
.section_strategy .strategy_desc {
  margin-top: clamp(-1000px, 0.1171875vw, 3px);
  font-size: clamp(0px, 0.78125vw, 20px);
  font-weight: 500;
  line-height: 1.4;
  color: #85229c;
  text-align: center;
}
@media screen and (max-width: 768px) {
  .section_strategy .strategy_desc {
    margin-top: clamp(0px, 0.9114583333vw, 7px);
    font-size: clamp(0px, 2.8645833333vw, 22px);
    font-weight: 400;
    line-height: 1.4;
  }
}
.section_strategy .frame_box {
  position: relative;
  width: clamp(-1000px, 54.6875vw, 1400px);
  height: clamp(-1000px, 32.109375vw, 822px);
  margin-top: clamp(-1000px, 0.4296875vw, 11px);
}
.section_strategy .frame_box .frame {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: url(/tftset17/img/strategy_box_frame-5aff7afd24baf89150141e0070d063b5.png) no-repeat center/100% 100%;
  z-index: 1;
  pointer-events: none;
}
.section_strategy .frame_box .image {
  overflow: hidden;
  position: absolute;
  top: 50%;
  left: 50%;
  width: clamp(-1000px, 51.875vw, 1328px);
  height: clamp(-1000px, 29.0625vw, 744px);
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
}
.section_strategy .frame_box .img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
  object-fit: cover;
}
@media screen and (max-width: 768px) {
  .section_strategy .frame_box {
    width: clamp(0px, 87.2395833333vw, 670px);
    height: clamp(0px, 52.0833333333vw, 400px);
    margin: clamp(0px, 6.5104166667vw, 50px) auto clamp(0px, 0vw, 0px) auto;
  }
  .section_strategy .frame_box .image {
    width: clamp(0px, 83.3333333333vw, 640px);
    height: clamp(0px, 46.875vw, 360px);
  }
}
.section_strategy .button_group {
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
}
.section_strategy .button_group .button.button_review:hover {
  background: url(/tftset17/img/button_bg_l_01-37cc8d68b2696d7357cbe4f333227473.png) no-repeat center/100% 100%;
}
@media screen and (max-width: 768px) {
  .section_strategy .button_group {
    margin-top: clamp(0px, 3.90625vw, 30px);
  }
}

.section_trailer {
  height: clamp(-1000px, 52.734375vw, 1350px);
  padding-top: clamp(-1000px, 5.546875vw, 142px);
  padding-bottom: clamp(-1000px, 6.8359375vw, 175px);
}
@media screen and (max-width: 768px) {
  .section_trailer {
    height: clamp(0px, 118.4895833333vw, 910px);
    padding: clamp(0px, 13.9322916667vw, 107px) clamp(0px, 0vw, 0px) clamp(0px, 14.0625vw, 108px);
  }
}
.section_trailer .inner {
  position: relative;
  z-index: 20;
  max-width: clamp(-1000px, 54.6875vw, 1400px);
  margin: 0 auto;
}
@media screen and (max-width: 768px) {
  .section_trailer .inner {
    max-width: clamp(0px, 83.3333333333vw, 640px);
  }
}
.section_trailer .trailer_title {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  margin-right: auto;
  margin-left: auto;
}
@media screen and (max-width: 768px) {
  .section_trailer .trailer_title {
    position: relative;
    z-index: 1;
  }
}
.section_trailer .trailer_title svg, .section_trailer .trailer_title image {
  width: clamp(-1000px, 19.53125vw, 500px);
  height: clamp(-1000px, 2.734375vw, 70px);
}
@media screen and (max-width: 768px) {
  .section_trailer .trailer_title svg, .section_trailer .trailer_title image {
    width: clamp(0px, 65.1041666667vw, 500px);
    height: clamp(0px, 9.1145833333vw, 70px);
  }
}
.section_trailer .trailer_desc {
  margin-top: clamp(-1000px, 0.1171875vw, 3px);
  font-size: clamp(0px, 0.78125vw, 20px);
  font-weight: 500;
  line-height: 1.4;
  color: #85229c;
  text-align: center;
}
@media screen and (max-width: 768px) {
  .section_trailer .trailer_desc {
    position: relative;
    z-index: 1;
    margin-top: clamp(0px, 0.5208333333vw, 4px);
    font-size: clamp(0px, 2.8645833333vw, 22px);
    font-weight: 400;
    line-height: 1.4;
  }
}
.section_trailer .frame_box {
  position: relative;
  width: clamp(-1000px, 54.6875vw, 1400px);
  height: clamp(-1000px, 31.9921875vw, 819px);
}
.section_trailer .frame_box .frame {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: url(/tftset17/img/trailer_box_frame-6c3dd33fb974f49671249db703a96bea.png) no-repeat center/100% 100%;
  z-index: 1;
  pointer-events: none;
}
.section_trailer .frame_box .video {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  width: clamp(-1000px, 51.875vw, 1328px);
  height: clamp(-1000px, 29.0234375vw, 743px);
  border-radius: clamp(-1000px, 0vw, 0px) clamp(-1000px, 1.09375vw, 28px) clamp(-1000px, 0vw, 0px) clamp(-1000px, 1.09375vw, 28px);
  border-width: clamp(-1000px, 0.078125vw, 2px);
  border: 1px solid #6b56c7;
  overflow: hidden;
  -o-object-fit: cover;
  object-fit: cover;
}
.section_trailer .frame_box .video::before {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0.8)), to(rgba(0, 0, 0, 0.8))), url(/tftset17/img/strategy_img-0dddbd0a165cdaa82761f2845e516040.webp) center center/cover no-repeat;
  background: linear-gradient(rgba(0, 0, 0, 0.8), rgba(0, 0, 0, 0.8)), url(/tftset17/img/strategy_img-0dddbd0a165cdaa82761f2845e516040.webp) center center/cover no-repeat;
  content: "";
}
.section_trailer .frame_box .video.is_play::before {
  opacity: 0;
  visibility: hidden;
}
.section_trailer .frame_box .video.is_play .button_play {
  display: none;
}
.section_trailer .frame_box .button_play {
  position: absolute;
  top: 50%;
  left: 50%;
  z-index: 10;
  width: clamp(-1000px, 4.6875vw, 120px);
  height: clamp(-1000px, 4.6875vw, 120px);
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  -webkit-transform-origin: 50% 50%;
  transform-origin: 50% 50%;
}
.section_trailer .frame_box .button_play::before {
  display: inline-block;
  width: 100%;
  height: 100%;
  background: url("/tftset17/img/btn_play-7561881f7d8730844a4a197e19728354.png") no-repeat center/100%;
  -webkit-transition: background 0.3s linear, -webkit-transform 0.3s linear;
  transition: background 0.3s linear, -webkit-transform 0.3s linear;
  transition: background 0.3s linear, transform 0.3s linear;
  transition: background 0.3s linear, transform 0.3s linear, -webkit-transform 0.3s linear;
  content: "";
}
.section_trailer .frame_box .button_play::after {
  position: absolute;
  top: 0;
  left: 0;
  display: inline-block;
  width: 100%;
  height: 100%;
  background: url(/tftset17/img/btn_play_arrow-0a357d5d08d6c59b3d9d9eb152d8c515.png) no-repeat center/cover;
  content: "";
}
.section_trailer .frame_box .button_play:hover::before {
  background: url("/tftset17/img/btn_play_h-0a9ad1a17584c9ec5b3cc0b65e3a2612.png") no-repeat center/100%;
  -webkit-transform: rotate(105deg);
  transform: rotate(105deg);
}
.section_trailer .frame_box .yt_player_iframe {
  width: 100%;
  height: 100%;
}
@media screen and (max-width: 768px) {
  .section_trailer .frame_box {
    width: clamp(0px, 87.2395833333vw, 670px);
    height: clamp(0px, 52.0833333333vw, 400px);
    margin-top: clamp(0px, 6.5104166667vw, 50px);
  }
  .section_trailer .frame_box .video {
    width: clamp(0px, 83.3333333333vw, 640px);
    height: clamp(0px, 46.875vw, 360px);
  }
  .section_trailer .frame_box .button_play {
    width: clamp(0px, 15.625vw, 120px);
    height: clamp(0px, 15.625vw, 120px);
  }
  .section_trailer .frame_box .button_play:hover {
    background: none;
  }
}
.section_trailer .button_group {
  position: relative;
  z-index: 10;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
}
.section_trailer .button_group .button.button_social:hover {
  background: url(/tftset17/img/button_bg_l_01-37cc8d68b2696d7357cbe4f333227473.png) no-repeat center/100% 100%;
}
@media screen and (max-width: 768px) {
  .section_trailer .button_group {
    margin-top: clamp(0px, 3.90625vw, 30px);
  }
}
.section_trailer .character_first {
  top: 0;
  left: -4.4%;
  margin-left: clamp(-1000px, 12.4609375vw, 319px);
}
.section_trailer .character_first::before {
  width: clamp(-1000px, 19.453125vw, 498px);
  height: clamp(-1000px, 17.34375vw, 444px);
  background: url(/tftset17/img/trailer_character-0db30de0a86da5f9b8177834652c63c7.png) no-repeat center/cover;
}
@media screen and (min-width: 2561px) {
  .section_trailer .character_first {
    left: calc(50% - 1380px);
  }
}
.section_trailer .piece {
  position: absolute;
  top: 0;
  right: 0;
  z-index: 0;
  width: clamp(-1000px, 22.421875vw, 574px);
  height: clamp(-1000px, 23.4765625vw, 601px);
  background: url("/tftset17/img/img_piece_02-46299ffac5b3f73acb08db06062d15f1.png") no-repeat center/100% 100%;
}
.section_trailer .piece_bottom {
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 0;
  height: clamp(-1000px, 14.765625vw, 378px);
  background: url("/tftset17/img/img_pieces_bottom-0d18b10c65e6f68f263d49c0032ccecf.png") no-repeat center/100% 100%;
}
@media screen and (min-width: 2561px) {
  .section_trailer .piece_bottom {
    height: auto;
    aspect-ratio: 2560/378;
  }
}

.mission_content {
  overflow: hidden;
}
.mission_content * {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
.mission_content .background {
  overflow: hidden;
  position: absolute;
  width: 100%;
  height: clamp(-1000px, 267.96875vw, 6860px);
}
.mission_content .background picture {
  display: block;
  height: 100%;
}
.mission_content .background img {
  display: block;
  width: 100%;
  height: 100%;
  opacity: 0;
  -webkit-animation: fadeIn 0.2s 0.1s ease-out forwards;
  animation: fadeIn 0.2s 0.1s ease-out forwards;
}
.mission_content .background_mo {
  overflow: hidden;
  position: absolute;
  width: 100%;
  height: clamp(0px, 1172.65625vw, 9006px);
}
.mission_content .background_mo picture {
  display: block;
  height: 100%;
}
.mission_content .background_mo img {
  display: block;
  width: 100%;
  height: 100%;
}

.error_page {
  position: relative;
  background-color: #000;
  margin-top: -80px;
  width: 100%;
  height: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  background: url(/tftset17/img/bg_etc-fb6d72491999f6c97100c8216be20d9e.webp) no-repeat center/cover;
}
.error_page::before {
  position: absolute;
  inset: 0;
  z-index: 0;
  background-color: rgba(0, 0, 0, 0.8509803922);
  content: "";
}
.error_page .error {
  position: relative;
  z-index: 10;
  width: clamp(-1000px, 44.921875vw, 1150px);
}
@media screen and (max-width: 768px) {
  .error_page .error {
    width: clamp(0px, 97.3958333333vw, 748px);
  }
}
.error_page .error_inner {
  width: 100%;
  text-align: center;
}
@media screen and (max-width: 768px) {
  .error_page .error_inner {
    width: 100%;
    text-align: center;
  }
}
.error_page .logo {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  width: clamp(-1000px, 43.5546875vw, 1115px);
  height: clamp(-1000px, 17.109375vw, 438px);
  max-width: 100%;
  margin: 0 auto;
  text-align: center;
}
.error_page .logo img {
  display: inline-block;
  vertical-align: top;
}
@media screen and (max-width: 768px) {
  .error_page .logo {
    width: clamp(0px, 145.1822916667vw, 1115px);
    height: clamp(0px, 57.03125vw, 438px);
  }
}
.error_page .error_title {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: start;
  -ms-flex-align: start;
  align-items: flex-start;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  width: clamp(-1000px, 15.5859375vw, 399px);
  height: clamp(-1000px, 2.1875vw, 56px);
  margin: -6% auto 0;
}
@media screen and (max-width: 768px) {
  .error_page .error_title {
    width: clamp(0px, 51.953125vw, 399px);
    height: clamp(0px, 7.2916666667vw, 56px);
    margin-top: -13%;
  }
}
.error_page .error_desc {
  margin-top: clamp(-1000px, 1.0546875vw, 27px);
  font-size: clamp(0px, 1.171875vw, 30px);
  font-weight: 600;
  line-height: 1.36;
  color: #fff;
}
@media screen and (max-width: 768px) {
  .error_page .error_desc {
    margin-top: clamp(0px, 3.515625vw, 27px);
    font-size: clamp(0px, 3.125vw, 24px);
    font-weight: 600;
    line-height: 1.5;
    color: #fff;
  }
}
.error_page .error_link {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  width: clamp(-1000px, 16.015625vw, 410px);
  height: clamp(-1000px, 4.296875vw, 110px);
  margin-top: clamp(-1000px, 1.71875vw, 44px);
  margin-right: auto;
  margin-left: auto;
  background: url(/tftset17/img/btn_share_frame-4319303d6567477872effa92ad994e81.png) no-repeat center/100% 100%;
  -webkit-transition: background 0.3s linear, color 0.3s linear;
  transition: background 0.3s linear, color 0.3s linear;
}
.error_page .error_link:hover {
  background: url(/tftset17/img/btn_share_hover-b489b608efe606a8fd7a41ed07e4024b.png) no-repeat center/100% 100%;
}
.error_page .error_link .text {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  width: clamp(-1000px, 3.046875vw, 78px);
  height: clamp(-1000px, 1.40625vw, 36px);
}
@media screen and (max-width: 768px) {
  .error_page .error_link {
    margin-right: auto;
    margin-left: auto;
    background: url(/tftset17/img/btn_share_frame-4319303d6567477872effa92ad994e81.png) no-repeat center/100% 100%;
    width: clamp(0px, 53.3854166667vw, 410px);
    height: clamp(0px, 14.3229166667vw, 110px);
    margin-top: clamp(0px, 5.7291666667vw, 44px);
  }
  .error_page .error_link:hover {
    background: url(/tftset17/img/btn_share_hover-b489b608efe606a8fd7a41ed07e4024b.png) no-repeat center/100% 100%;
  }
  .error_page .error_link .text {
    width: clamp(0px, 10.15625vw, 78px);
    height: clamp(0px, 4.6875vw, 36px);
  }
}
.error_page ~ .riotbar-footer {
  display: none;
}