.isPc {
 display: block;
}

@media screen and (max-width: 767px) {
 .isPc {
  display: none;
 }
}

.isSp {
 display: block;
}

@media screen and (min-width: 768px) {
 .isSp {
  display: none;
 }
}

@-webkit-keyframes glittering-btn {
 0% {
  left: -100%;
 }

 25% {
  left: 100%;
 }

 100% {
  left: 100%;
 }
}

.fs-20 {
 font-size: 20px !important;
}

.fs-19 {
 font-size: 19px !important;
}

.fs-18 {
 font-size: 18px !important;
}

.fs-17 {
 font-size: 17px !important;
}

.fs-16 {
 font-size: 16px !important;
}

.fs-15 {
 font-size: 15px !important;
}

.fs-14 {
 font-size: 14px !important;
}

.fs-13 {
 font-size: 13px !important;
}

.fs-12 {
 font-size: 12px !important;
}

@-webkit-keyframes glittering-btn {
 0% {
  left: -100%;
 }

 25% {
  left: 100%;
 }

 100% {
  left: 100%;
 }
}

@keyframes glittering-btn {
 0% {
  left: -100%;
 }

 25% {
  left: 100%;
 }

 100% {
  left: 100%;
 }
}

@media screen and (max-width: 767px) {
 .box-bottomshadow .box-header .latobold.f-center.t-13 {
  font-size: calc((13 / 375) * 100vw);
  letter-spacing: 0.01em;
  padding-left: 1em;
 }
}

.roulette_default_kv {
 width: 100%;
 height: 100%;
 aspect-ratio: 75/86;
 display: -webkit-box;
 display: -ms-flexbox;
 display: flex;
 -webkit-box-align: end;
 -ms-flex-align: end;
 align-items: flex-end;
 -webkit-box-pack: center;
 -ms-flex-pack: center;
 justify-content: center;
 position: relative;
}

@media screen and (min-width: 768px) {
 .roulette_default_kv {
  aspect-ratio: 384/325;
 }
}

@media screen and (min-width: 768px) {
 .roulette_default_kv .roulette_kv_img {
  width: 768px;
  height: 650px;
 }
}

.roulette_result_kv {
 width: 100%;
 height: 100%;
 aspect-ratio: 375/325;
 position: relative;
}

@media screen and (min-width: 768px) {
 .roulette_result_kv {
  aspect-ratio: 64/45;
 }
}

@media screen and (min-width: 768px) {
 .roulette_result_kv .roulette_kv_img {
  width: 768px;
  height: 540px;
 }
}

.roulette_kv_img {
 width: 100%;
 position: absolute;
 top: 0;
 left: 0;
}

.roulette_kv_button_unit {
 margin-bottom: calc((55 / 375) * 100vw);
 position: relative;
 z-index: 10;
}

@media screen and (min-width: 768px) {
 .roulette_kv_button_unit {
  margin-bottom: 80px;
 }
}

.roulette_kv_button_lead {
 margin-bottom: 0.5em;
 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: 0;
 font-size: 15px;
 font-weight: bold;
 color: #fff;
}

@media screen and (min-width: 768px) {
 .roulette_kv_button_lead {
  font-size: 17px;
 }
}

.roulette_kv_button_lead:before,
.roulette_kv_button_lead:after {
 content: "";
 display: block;
 width: 1em;
 height: 1px;
 background-color: #fff;
}

.roulette_kv_button_lead:before {
 -webkit-transform: rotate(45deg);
 transform: rotate(45deg);
}

.roulette_kv_button_lead:after {
 -webkit-transform: rotate(-45deg);
 transform: rotate(-45deg);
}

.roulette_kv_button_lead span {
 color: #ffff05;
}

.roulette_kv_button {
 width: 315px;
 height: 50px;
 margin: 0 auto;
 display: -ms-grid;
 display: grid;
 place-content: center;
 gap: 0.3em;
 background: #ffff05;
 -webkit-box-shadow: 3px 5px 0 #d0d000;
 box-shadow: 3px 5px 0 #d0d000;
 -webkit-transition: all 0.2s ease-out;
 transition: all 0.2s ease-out;
 border-radius: 25px;
 position: relative;
 overflow: hidden;
 text-align: center;
}

.roulette_kv_button:hover {
 opacity: 1;
 -webkit-transform: translateX(3px);
 transform: translateX(3px);
 -webkit-transform: translatey(5px);
 transform: translatey(5px);
 -webkit-box-shadow: none;
 box-shadow: none;
}

@media screen and (min-width: 768px) {
 .roulette_kv_button {
  width: 500px;
  height: 60px;
  border-radius: 30px;
 }
}

.roulette_kv_button.isResult {
 background: #ffff05;
 -webkit-box-shadow: 3px 5px 0 #d0d000;
 box-shadow: 3px 5px 0 #d0d000;
}

.roulette_kv_button.isResult:hover {
 opacity: 1;
 -webkit-transform: translateX(3px);
 transform: translateX(3px);
 -webkit-transform: translatey(5px);
 transform: translatey(5px);
 -webkit-box-shadow: none;
 box-shadow: none;
}

.roulette_kv_button.isDisable {
 pointer-events: none;
 color: #ccc;
 background: #787878;
 -webkit-box-shadow: unset;
 box-shadow: unset;
}

.roulette_kv_button:not(.isDisable):before {
 position: absolute;
 content: "";
 top: 0;
 left: -100%;
 width: 100%;
 height: 100%;
 background: -webkit-gradient(linear, left top, right top, from(rgba(255, 255, 255, 0)), color-stop(45%, rgba(255, 255, 255, 0.85)), to(rgba(255, 255, 255, 0)));
 background: linear-gradient(90deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.85) 45%, rgba(255, 255, 255, 0) 100%);
 -webkit-transform: skewX(-45deg);
 transform: skewX(-45deg);
 -webkit-animation: glittering-btn 4s cubic-bezier(0.55, 0.085, 0.68, 0.53) infinite;
 animation: glittering-btn 4s cubic-bezier(0.55, 0.085, 0.68, 0.53) infinite;
}

.roulette_kv_button:active {
 -webkit-transform: translateY(2px);
 transform: translateY(2px);
 -webkit-box-shadow: 0 2px 0 #d0d000;
 box-shadow: 0 2px 0 #d0d000;
}

.roulette_kv_button .sub {
 font-size: 12px;
 line-height: 1;
}

.roulette_kv_button .main {
 font-size: 20px;
 font-weight: bold;
 line-height: 1;
 letter-spacing: 0.1em;
}

@media screen and (min-width: 768px) {
 .roulette_kv_button .main {
  font-size: 22px;
 }
}

video#roulette_movie {
 width: 100%;
 max-width: 100%;
}

@media screen and (min-width: 768px) {
 video#roulette_movie {
  width: 60%;
  max-width: 600px;
 }
}

.roulette_prize_container {
 width: 100%;
 aspect-ratio: 256/65;
}

@media screen and (max-width: 767px) {
 .roulette_prize_container {
  aspect-ratio: 75/52;
 }
}

.roulette_prize_container img {
 width: 100%;
}

.roulette_prize_container h2.roulette_head_h2 {
 color: #fff;
 position: relative;
}

.roulette_prize_container h2.roulette_head_h2 .inr {
 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;
 -webkit-box-orient: vertical;
 -webkit-box-direction: normal;
 -ms-flex-direction: column;
 flex-direction: column;
}

@media screen and (min-width: 768px) {
 .roulette_prize_container h2.roulette_head_h2 .inr {
  display: block;
  text-align: center;
 }
}

.roulette_prize_container h2.roulette_head_h2 .main {
 font-size: 24px;
 font-weight: bold;
}

.roulette_prize_container h2.roulette_head_h2 .main span {
 font-size: 30px;
 color: #fbe949;
}

.roulette_prize_container h2.roulette_head_h2:before,
.roulette_prize_container h2.roulette_head_h2:after {
 content: "";
 display: block;
 background-repeat: no-repeat;
 background-size: cover;
 position: absolute;
 top: 40%;
 -webkit-transform: translateY(-60%);
 transform: translateY(-60%);
}

.roulette_prize_container h2.roulette_head_h2:before {
 width: 53px;
 aspect-ratio: 25/26;
 background-image: url("/img/usr/pages/roulette_202603/head_left.png");
 left: 0;
}

.roulette_prize_container h2.roulette_head_h2:after {
 width: 53px;
 aspect-ratio: 52/47;
 background-image: url("/img/usr/pages/roulette_202603/head_right.png");
 right: 0;
}

.roulette_prize {
 margin-top: 20px;
 padding: 20px;
 background: #fff;
 border-radius: 8px;
 position: relative;
}

.roulette_prize_head {
 width: 100%;
 display: -ms-grid;
 display: grid;
 -ms-grid-columns: 60px auto;
 grid-template-columns: 60px auto;
 gap: 1em;
}

@media screen and (min-width: 768px) {
 .roulette_prize_head {
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
 }
}

.roulette_prize_head_label {
 width: 60px;
 height: 60px;
 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: #fbe949;
 border-radius: 50%;
}

.roulette_prize_head_label .inr {
 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: 0.2em;
 line-height: 1.1;
 text-align: center;
 font-weight: bold;
 color: #021d40;
}

.roulette_prize_head_label .main {
 font-size: 26px;
}

.roulette_prize_head_label .sub {
 padding-top: 3px;
 font-size: 18px;
}

.roulette_prize_head_misc {
 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;
}

.roulette_prize_head_misc .main {
 font-size: 14px;
}

.roulette_prize_items {
 width: 100%;
 margin-top: 17px;
 display: -ms-grid;
 display: grid;
 -ms-grid-columns: 1fr 1fr 1fr 1fr;
 grid-template-columns: repeat(4, 1fr);
 gap: 10px;
}

@media screen and (min-width: 768px) {
 .roulette_prize_items {
  gap: 20px;
 }
}

.roulette_prize_item_img {
 width: 100%;
 aspect-ratio: 1/1;
 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;
}

.roulette_prize_item_img img {
 -ms-flex-negative: 0;
 flex-shrink: 0;
 text-align: center;
 max-height: 100%;
 max-width: 100%;
 width: auto;
 height: auto;
}

.roulette_prize_item_name {
 margin-top: 5px;
 font-size: 12px;
}

.roulette_prize_bottom {
 margin-top: 24px;
 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 (min-width: 768px) {
 .roulette_prize_bottom {
  -webkit-box-pack: space-evenly;
  -ms-flex-pack: space-evenly;
  justify-content: space-evenly;
 }
}

.roulette_prize_main {
 text-align: center;
}

.roulette_prize_main img {
 margin-top: 1em;
 aspect-ratio: 1/1;
}

.roulette_prize_main p {
 margin-top: 1em;
 font-size: 14px;
}

@media screen and (max-width: 767px) {
 .roulette_prize_main p {
  text-align: left;
 }
}

.roulette_prize_bottom_item {
 display: -webkit-box;
 display: -ms-flexbox;
 display: flex;
 -webkit-box-align: center;
 -ms-flex-align: center;
 align-items: center;
 gap: 0.5em;
}

.roulette_prize_bottom_item_label {
 width: 44px;
 height: 44px;
 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: #fbe949;
 border-radius: 50%;
}

.roulette_prize_bottom_item_label .inr {
 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: 0.125em;
 line-height: 1.1;
 text-align: center;
 font-weight: bold;
 color: #021d40;
}

.roulette_prize_bottom_item_label .main {
 font-size: 20px;
}

.roulette_prize_bottom_item_label .sub {
 padding-top: 3px;
 font-size: 13px;
}

.roulette_prize_bottom_item_prize {
 font-size: 20px;
 font-weight: bold;
 color: #fff;
}

.roulette_reslt_container {
 width: 100%;
 padding: 20px 15px;
 display: -ms-grid;
 display: grid;
 gap: 1em;
 background: #ecf5f2;
}

.roulette_reslt {
 width: 100%;
 padding: 0.5em 1em 1em;
 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;
 -webkit-box-orient: vertical;
 -webkit-box-direction: normal;
 -ms-flex-direction: column;
 flex-direction: column;
 gap: 0.5em;
 place-content: center;
 text-align: center;
 background: #fff;
 border-radius: 8px;
}

.roulette_reslt .main {
 width: 100%;
 display: -webkit-box;
 display: -ms-flexbox;
 display: flex;
 -webkit-box-align: end;
 -ms-flex-align: end;
 align-items: flex-end;
 -webkit-box-pack: center;
 -ms-flex-pack: center;
 justify-content: center;
 gap: 1em;
}

.roulette_reslt .main .lead {
 font-size: 18px;
 font-weight: bold;
 color: #333;
}

.roulette_reslt .main .point {
 font-size: 34px;
 font-weight: bold;
 color: #32b988;
}

.roulette_reslt .main .unit {
 padding-left: 0.2em;
 font-size: 14px;
 font-weight: normal;
 color: #32b988;
}

.roulette_reslt .main .inr {
 margin-bottom: -0.5em;
}

.roulette_reslt .sub {
 font-size: 14px;
 font-weight: normal;
 color: #333;
}

a.roulette_reslt_link {
 font-size: 14px;
 text-decoration: underline;
 text-align: right;
}

.roulette_movie_modal {
 width: 100%;
 height: 100%;
 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;
 visibility: hidden;
 -webkit-transition: all 0.5s ease-out;
 transition: all 0.5s ease-out;
 position: fixed;
 top: 0;
 left: 0;
 z-index: 1000;
 background: rgba(0, 0, 0, 0.7);
 opacity: 0;
 visibility: hidden;
 -webkit-transition: all 0.3s ease-out;
 transition: all 0.3s ease-out;
}

.roulette_movie_modal.isActive {
 opacity: 1;
 visibility: visible;
}

.roulette_movie_modal_inr {
 aspect-ratio: 375/427;
 max-height: 86vh;
 position: relative;
}

.roulette_movie_modal_inr:after {
 content: "";
 display: block;
 width: 100%;
 height: 30px;
 /*background-color: #fccc49;*/
}

.roulette_modal_button_unit {
 position: absolute;
 left: 50%;
 -webkit-transform: translateX(-50%);
 transform: translateX(-50%);
 bottom: 30px;
 z-index: 10;
}

@media screen and (max-width: 767px) {
 .roulette_modal_button_unit {
  bottom: 60px;
 }
}

.roulette_modal_button {
 width: 315px;
 height: 50px;
 margin: 0 auto;
 display: -ms-grid;
 display: grid;
 place-content: center;
 gap: 0.3em;
 background: #ffff05;
 -webkit-box-shadow: 3px 5px 0 #d0d000;
 box-shadow: 3px 5px 0 #d0d000;
 -webkit-transition: all 0.2s ease-out;
 transition: all 0.2s ease-out;
 border-radius: 25px;
 position: relative;
 overflow: hidden;
 text-align: center;
}

.roulette_modal_button:hover {
 opacity: 1;
 -webkit-transform: translateX(3px);
 transform: translateX(3px);
 -webkit-transform: translatey(5px);
 transform: translatey(5px);
 -webkit-box-shadow: none;
 box-shadow: none;
}

@media screen and (min-width: 768px) {
 .roulette_modal_button {
  width: 375px;
  height: 60px;
  border-radius: 30px;
 }
}

.roulette_modal_button.isResult {
 color: #fff;
 background: #333;
 -webkit-box-shadow: 3px 5px 0 #0a0a0a;
 box-shadow: 3px 5px 0 #0a0a0a;
}

.roulette_modal_button.isDisable {
 pointer-events: none;
 color: #ccc;
 background: #787878;
 -webkit-box-shadow: unset;
 box-shadow: unset;
}

.roulette_modal_button:not(.isDisable):before {
 position: absolute;
 content: "";
 top: 0;
 left: -100%;
 width: 100%;
 height: 100%;
 background: -webkit-gradient(linear, left top, right top, from(rgba(255, 255, 255, 0)), color-stop(45%, rgba(255, 255, 255, 0.85)), to(rgba(255, 255, 255, 0)));
 background: linear-gradient(90deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.85) 45%, rgba(255, 255, 255, 0) 100%);
 -webkit-transform: skewX(-45deg);
 transform: skewX(-45deg);
 -webkit-animation: glittering-btn 4s cubic-bezier(0.55, 0.085, 0.68, 0.53) infinite;
 animation: glittering-btn 4s cubic-bezier(0.55, 0.085, 0.68, 0.53) infinite;
}

.roulette_modal_button:active {
 -webkit-transform: translateY(2px);
 transform: translateY(2px);
 -webkit-box-shadow: 0 2px 0 #d0d000;
 box-shadow: 0 2px 0 #d0d000;
}

.roulette_modal_button .sub {
 font-size: 12px;
 line-height: 1;
}

.roulette_modal_button .main {
 font-size: 20px;
 font-weight: bold;
 line-height: 1;
 letter-spacing: 0.1em;
}

@media screen and (min-width: 768px) {
 .roulette_modal_button .main {
  font-size: 22px;
 }
}

main {
 overflow-x: clip;
}

main sup {
 vertical-align: text-top;
 font-size: 0.7em;
}

.fp_detail_container {
 margin-top: 40px;
}

.fp_detail_h2 {
 width: 100%;
 margin: 20px 0;
 padding: 0 15px;
 font-size: 24px;
 font-weight: bold;
 text-align: center;
}

.fp_detail_unit {
 width: 100%;
 margin: 1em 0;
 font-size: 14px;
 font-weight: bold;
}

.fp_detail_h3 {
 width: 100%;
 padding: 0.75em 15px;
 background: #f5f5f5;
 border-top: 1px solid #cecece;
 border-bottom: 1px solid #cecece;
}

.fp_detail {
 width: 100%;
 padding: 0.75em 15px;
 font-weight: normal;
}

.fp_detail p {
 font-size: 14px;
 font-weight: normal;
}

.fp_detail p a {
 text-decoration: underline;
 text-underline-offset: 2px;
}

.fp_detail ul li {
 text-indent: -1em;
 padding-left: 1em;
 margin: 0.5em 0;
}

.fp_detail ul li:before {
 content: '・';
}

.fp_detail ul a {
 text-decoration: underline;
 text-underline-offset: 2px;
}

.fp_detail img {
 border-radius: 10px;
}

@media screen and (min-width: 768px) {
 .fp_detail img {
  border-radius: 20px;
 }
}

.fp_buttton_container {
 width: 100%;
 margin: 40px 0;
 padding: 0 15px;
 display: -ms-grid;
 display: grid;
 place-content: center;
 gap: 1em;
}

.fp_buttton {
 width: 315px;
 height: 40px;
 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;
 font-size: 14px;
 font-weight: normal;
 border-radius: 20px;
 text-decoration: none;
 -webkit-transition: opacity 0.3s ease-out;
 transition: opacity 0.3s ease-out;
 color: #333;
 background: #fff;
 border: 1px solid #333;
}

.fp_buttton.type_green {
 color: #fff;
 background: #32b988;
 border: 1px solid #32b988;
}

.fp_buttton.type_white {
 color: #333;
 background: #fff;
 border: 1px solid #333;
}

.fp_buttton.type_white[target="_blank"] {
 position: relative;
}

.fp_buttton.type_white[target="_blank"]:after {
 background-image: url("/img/pages/icon_exlink__blk.svg");
}

.fp_buttton.type_darktan {
 color: #333;
 background: #fff;
 border: 1px solid #333;
}

.fp_buttton.type_mossgreen {
 color: #333;
 background: #fff;
 border: 1px solid #333;
}

.fp_buttton[target="_blank"] {
 position: relative;
}

.fp_buttton[target="_blank"]:after {
 content: "";
 display: inline-block;
 width: 11px;
 aspect-ratio: 1/1;
 background-image: url("/img/pages/icon_exlink.svg");
 background-repeat: no-repeat;
 background-size: contain;
 position: absolute;
 top: calc(50% - 5px);
 right: 1em;
}

a.fp_home_link {
 font-size: 14px;
 color: #333;
 text-decoration: underline;
 text-underline-offset: 2px;
}

.align_center {
 text-align: center;
}

.fp_amendment {
 padding: 0 15px;
 text-align: right;
}

.fp_amendment p {
 font-size: 14px;
 font-weight: normal;
}

.fp_amendment p a {
 text-decoration: underline;
 text-underline-offset: 2px;
}

.mt-5 {
 margin-top: 5px;
}

.mt-10 {
 margin-top: 10px;
}

.mt-15 {
 margin-top: 15px;
}

.mt-10 {
 margin-top: 20px;
}

.fp_pageIndexBtn {
 width: 48px;
 aspect-ratio: 1/1;
 border-radius: 24px;
 -webkit-box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.161);
 box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.161);
 position: fixed;
 right: calc(((100% - 768px) / 2) + 15px);
 bottom: 60px;
 opacity: 0;
 visibility: hidden;
 -webkit-transition: opacity 0.3s ease, visibility 0.3s ease;
 transition: opacity 0.3s ease, visibility 0.3s ease;
 z-index: 10000;
}

@media screen and (max-width: 767px) {
 .fp_pageIndexBtn {
  right: 15px;
 }
}

.fp_pageIndexBtn.is-visible {
 opacity: 1;
 visibility: visible;
}

.fp_pageIndexBtn img {
 width: 100%;
}