@charset "UTF-8";
/* @use 'variables' as *; */
/*----------------------------------------
	base
------------------------------------------*/
html.html_reset {margin: 0 !important;padding: 0 !important;}
body {
  position: relative;
  height: 100%;
  background-color: var(--c_bg_color);
  color: var(--c_font_color);
  font-family: var(--font_base_setting);
  font-size: var(--base_font_size);
  font-optical-sizing: auto;
  font-weight: 400;
  line-height: var(--base_line_height);
  word-break: break-all;
  background-colo: #000;

}

.wallpaper{
  position: fixed;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background-image:  url(../img/webp/bg.webp);
  background-repeat: no-repeat;
  background-position: center top;
  background-size: cover;
  /* モバイルのアドレスバー伸縮でのチラつき対策 */
  height: 100dvh; /* 対応ブラウザで動的ビューポート */
}


main {position: relative;overflow: clip;}
a {color: var(--c_link_color);}
img {max-width: 100%;height: auto;}
@media only screen and (max-width: 835px) {
  body {overflow: hidden;min-height: 100%;}
  body.scroll_on {overflow-y: scroll;overflow-x: hidden;pointer-events: auto;}
}
/*----------------------------------------
	module
------------------------------------------*/
.pc_only {display: initial;}
.sp_only {display: none !important;}
.tb_only {display: none !important;}
@media only screen and (max-width: 835px) {
  .pc_only {display: none !important;}
  .sp_only {display: initial !important;}
}


@media screen and (min-width: 835px) and (max-width: 1239.98px) {
  .tb_only {display: initial !important;}
}

.mod_mb_0p5distance {margin-bottom: calc(var(--base_distance) * 0.5) !important;}
.mod_mb_1p0distance {margin-bottom: calc(var(--base_distance) * 1) !important;}
.mod_mb_1p5distance {margin-bottom: calc(var(--base_distance) * 1.5) !important;}
.mod_mb_2p0distance {margin-bottom: calc(var(--base_distance) * 2) !important;}
.mod_mb_0p5gap {margin-bottom: calc(var(--base_gap) * 0.5) !important;}
.mod_mb_1p0gap {margin-bottom: calc(var(--base_gap) * 1) !important;}
.mod_mb_1p5gap {margin-bottom: calc(var(--base_gap) * 1.5) !important;}
.mod_mb_2p0gap {margin-bottom: calc(var(--base_gap) * 2) !important;}
.mod_text_bold {font-weight: bold;}
.mod_text_center {text-align: center;}
.mod_text_left {text-align: left;}
.mod_text_right {text-align: right;}
.mod_text_base {font-size: var(--base_font_size);line-height: var(--base_line_height);}
.mod_text_small {font-size: 0.6em;line-height: 1em;}
.mod_mb_0p5em {margin-bottom: 0.5em !important;}
.mod_mb_1p0em {margin-bottom: 1em !important;}
.mod_mb_1p5em {margin-bottom: 1.5em !important;}
.mod_mb_2p0em {margin-bottom: 2em !important;}
.mod_text_underline {text-decoration: underline;}
.mod_flex_box_01, .mod_flex_box_02, .mod_flex_box_03, .mod_flex_box_04 {display: flex;flex-wrap: wrap;gap: var(--base_gap);justify-content: space-between;}
.mod_flex_box_01.jst_center, .mod_flex_box_02.jst_center, .mod_flex_box_03.jst_center, .mod_flex_box_04.jst_center {justify-content: center;}
.mod_flex_box_01.ali_center, .mod_flex_box_02.ali_center, .mod_flex_box_03.ali_center, .mod_flex_box_04.ali_center {align-items: center;}
.mod_flex_box_01 > div, .mod_flex_box_01 > li {width: 100%;}
.mod_flex_box_02 > div, .mod_flex_box_02 > li {width: calc((100% - var(--base_gap) * 1) / 2);}
.mod_flex_box_03 > div, .mod_flex_box_03 > li {width: calc((100% - var(--base_gap) * 2) / 3);}
.mod_flex_box_04 > div, .mod_flex_box_04 > li {width: calc((100% - var(--base_gap) * 3) / 4);}
.mod_flex_box_02 .full {width: 100%;}

@media only screen and (max-width: 835px) {
  .mod_flex_box_01>div, .mod_flex_box_01>li, .mod_flex_box_02>div, .mod_flex_box_02>li {
    width: 100%;
  }
  .mod_flex_box_03>div, .mod_flex_box_03>li, .mod_flex_box_04>div, .mod_flex_box_04>li {
    width: calc((100% - var(--base_gap) * 1) / 2);
  }
}

.mod_text_slide_anim_box {display: flex;height: 100px;}
.mod_text_slide_anim_box img {display: block;width: auto;max-width: initial;height: 100%;-webkit-animation: hor_move_l 40s linear infinite;        animation: hor_move_l 40s linear infinite;}
.mod_text_slide_anim_box.reverse {-webkit-animation: hor_move_r 40s linear infinite;        animation: hor_move_r 40s linear infinite;}
.mod_youtube_iframe_size {position: relative;display: block;width: 100%;height: auto;aspect-ratio: 16/9;}
.mod_disactive {pointer-events: none;}
.mod_scroll_bar_delete {-ms-overflow-style: none;scrollbar-width: none;}
.mod_scroll_bar_delete::-webkit-scrollbar {display: none;}

/* wrap settings
-------------------------------*/
.wrap_100px {position: relative;margin: 0 auto;width: var(--base_wrap_width);max-width: 100px;}
.wrap_200px {position: relative;margin: 0 auto;width: var(--base_wrap_width);max-width: 200px;}
.wrap_300px {position: relative;margin: 0 auto;width: var(--base_wrap_width);max-width: 300px;}
.wrap_400px {position: relative;margin: 0 auto;width: var(--base_wrap_width);max-width: 400px;}
.wrap_500px {position: relative;margin: 0 auto;width: var(--base_wrap_width);max-width: 500px;}
.wrap_600px {position: relative;margin: 0 auto;width: var(--base_wrap_width);max-width: 600px;}
.wrap_700px {position: relative;margin: 0 auto;width: var(--base_wrap_width);max-width: 700px;}
.wrap_800px {position: relative;margin: 0 auto;width: var(--base_wrap_width);max-width: 800px;}
.wrap_900px {position: relative;margin: 0 auto;width: var(--base_wrap_width);max-width: 900px;}
.wrap_1000px {position: relative;margin: 0 auto;width: var(--base_wrap_width);max-width: 1000px;}
.wrap_1100px {position: relative;margin: 0 auto;width: var(--base_wrap_width);max-width: 1100px;}
.wrap_1200px {position: relative;margin: 0 auto;width: var(--base_wrap_width);max-width: 1200px;}
.wrap_1300px {position: relative;margin: 0 auto;width: var(--base_wrap_width);max-width: 1300px;}
.wrap_1400px {position: relative;margin: 0 auto;width: var(--base_wrap_width);max-width: 1400px;}
.wrap_1500px {position: relative;margin: 0 auto;width: var(--base_wrap_width);max-width: 1500px;}
.wrap_1600px {position: relative;margin: 0 auto;width: var(--base_wrap_width);max-width: 1600px;}
.wrap_1700px {position: relative;margin: 0 auto;width: var(--base_wrap_width);max-width: 1700px;}
.wrap_1800px {position: relative;margin: 0 auto;width: var(--base_wrap_width);max-width: 1800px;}
.wrap_1900px {position: relative;margin: 0 auto;width: var(--base_wrap_width);max-width: 1900px;}
.wrap_100px.w_100, .wrap_200px.w_100, .wrap_300px.w_100, .wrap_400px.w_100, .wrap_500px.w_100, .wrap_600px.w_100, .wrap_700px.w_100, .wrap_800px.w_100, .wrap_900px.w_100, .wrap_1000px.w_100, .wrap_1100px.w_100, .wrap_1200px.w_100, .wrap_1300px.w_100, .wrap_1400px.w_100, .wrap_1500px.w_100, .wrap_1600px.w_100, .wrap_1700px.w_100, .wrap_1800px.w_100, .wrap_1900px.w_100 {width: 100%;}
/*----------------------------------------
	loading / opening animation
------------------------------------------*/
#loading {position: fixed;top: 0;left: 0;display: block;width: 100%;height: 100vh;height: 100svh;background-color: var(--c_bg_color);z-index: var(--z_loading);}
#loading.is_loaded {display: none;}
#loading.load_open {-webkit-animation: fade_out 1.4s forwards;        animation: fade_out 1.4s forwards;pointer-events: none;}
#loading .logo {position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);width: min(300px, 50%);}
#loading .logo img {width: 100%;}

/*----------------------------------------
	common class
------------------------------------------*/
/* common parts
-------------------------------*/
.cmn_section {position: relative;display: block;width: 100%;height: auto;margin: 0 auto;padding: calc(var(--base_distance) * 1) 0;}

.cmn_in_page_main {position: relative;display: block;width: 100%;height: auto;margin: 0 auto;padding: calc(var(--base_distance) * 1) 0;}

.cmn_link_btn_a {
  position: relative;
  display: inline-block;
  margin: 0 auto;
  font-weight: 500;
  padding: 1.3em 1.5em;
  text-align: center;
  height: auto;
  width: auto;
  /* min-width: min(340px, 100%); */
  background-color: var(--c_yellow);
  line-height: 1.4em;
  color: #fff;
  font-size: clamp(16px, 4.5vw, 20px);
  text-decoration: initial !important;
  transition: 0.2s;
  width: 100%;
  cursor: pointer;
  transition: 0.4s;
  opacity: 1;
}
.cmn_link_btn_a img {position: relative;height: 1.4em;width: auto;}
.cmn_link_btn_a span {position: relative;}
.cmn_link_btn_a::before {
  position: absolute;
  display: block;
  content: "";
  border-top: 2px solid #fff;
  border-right: 2px solid #fff;
  width: 10px;
  height: 10px;
  right: 30px;
  top: 50%;
  transform: translateY(-50%) rotate(45deg);
  transition: transform 0.4s;
}
.cmn_link_btn_a.w_100 {width: 100%;}
.cmn_link_btn_a.ghost {background: transparent;border: 1px solid #fff;color: #fff;}
.cmn_link_btn_a.ghost:before {border-color: #fff;}
.cmn_link_btn_a.disactive {pointer-events: none;filter: grayscale(1);opacity: 0.3;}
.cmn_link_btn_a.disactive:before {display: none;}
.cmn_link_btn_a:hover{
  transition: 0.4s;
  background: #de0515;
  //opacity: 0.8;
}

/* .cmn_link_btn_a.officiallink{ font-size: 16px;} */

.btn_outer {margin: 0 auto;}

.cmn_coming_soon_img {position: relative;background: var(--c_gray);aspect-ratio: 16/9;display: flex;justify-content: center;align-items: center;}
.cmn_coming_soon_img::before {content: "COMING SOON";position: absolute;color: var(--c_white_l);font-size: 2em;}


@media only screen and (max-width: 835px) {
  .cmn_link_btn_a {
    font-size: 3.33vw;
    padding: 1em 0;
  }
	.cmn_link_btn_a.officiallink{
    font-size: 3.33vw;
  }
  .cmn_link_btn_a::before {
    right: 5vw;
  }
}

/* accordion
-------------------------------*/
.cmn_accordion_box .cmn_accordion_trigger {}
.cmn_accordion_box .cmn_accordion_content {overflow: hidden;height: 0;transition: 0.4s ease;}
.cmn_accordion_box .cmn_accordion_content.accordion_open {height: auto;}

@media only screen and (max-width: 835px) {
	.cmn_accordion_box .cmn_accordion_trigger {cursor: pointer;}
}

/* write box
-------------------------------*/
.cmn_write_box_outer {position: relative;display: block;padding: calc(var(--base_gap) * 2);margin-bottom: calc(var(--base_gap) * 2);}

@media only screen and (max-width: 835px) {
  .cmn_write_box_outer {padding: calc(var(--base_gap) * 2.5) calc(var(--base_gap) * 1.5);}
}
:root {--cmn_write_box_theme_color: var(--c_theme_color);}

.cmn_write_box {position: relative;text-align: left;font-size: clamp(13px, 2vw, 16px);line-height: 1.5em;width: 100%;}
.cmn_write_box .title_box {position: relative;display: block;padding-bottom: calc(clamp(17px, 2vw, 24px) * 0.8);margin-bottom: 2em;border-bottom: 4px double var(--cmn_write_box_theme_color);}
.cmn_write_box .date {font-size: clamp(12px, 2vw, 14px);line-height: 1.4em;font-weight: bold;margin-bottom: 0.7em;letter-spacing: 0.1em;}
.cmn_write_box .box_title {position: relative;display: block;width: 100%;font-size: clamp(19px, 2vw, 24px);line-height: 1.4em;font-weight: bold;}
.cmn_write_box .border_box {position: relative;display: block;width: 100%;height: auto;background-color: var(--c_black_d);border: 1px solid var(--cmn_write_box_theme_color);padding: min(var(--base_gap) * 2, 5vw) min(var(--base_gap) * 2, 4vw);margin-bottom: 1.5em;}
.cmn_write_box iframe {width: 100%;}
.cmn_write_box figure {margin-bottom: 1.5em;}
.cmn_write_box img {display: block;max-width: 100%;height: auto;margin: 0 auto;margin-bottom: 1.5em;}
.cmn_write_box img.app_badge {width: 170px !important;padding-top: 5px;}
.cmn_write_box p {line-height: 1.7em;}
.cmn_write_box a {overflow-wrap: break-word;text-decoration: underline;font-weight: bold;}
.cmn_write_box ul {margin-bottom: 1em;}
.cmn_write_box ul li {position: relative;display: block;margin-bottom: 0.5em;padding-left: 1.2em;}
.cmn_write_box ul li::before {position: absolute;display: block;content: "";top: 0;left: 0;width: 1em;height: 1em;transform: translateY(0.3em) scale(0.4);background-color: var(--cmn_list_color);border-radius: 9999px;}
.cmn_write_box ul li:last-of-type {margin-bottom: 0;}
.cmn_write_box blockquote {padding: 24px;background: rgba(0, 0, 0, 0.04);margin: 20px 0;}
.cmn_write_box blockquote p:last-of-type {margin-bottom: 0;}
.cmn_write_box hr {border-top: 1px solid var(--cmn_write_box_theme_color);border-right: none;border-bottom: none;border-left: none;margin-bottom: 3em;margin-top: 3em;}
.cmn_write_box strong {font-weight: 900;color: var(--cmn_write_box_theme_color);}
.cmn_write_box.single h2, .cmn_write_box.in_page h3 {position: relative;display: block;padding-bottom: 0.4em;padding-left: 1.1em;font-size: clamp(17px, 2vw, 19px);font-weight: bold;margin-bottom: 0.7em;margin-top: 3em;line-height: 1.4em;border-bottom: 1px solid var(--cmn_write_box_theme_color);border-style: dashed;border-top: none;border-left: none;border-right: none;color: var(--c_font_color);}
.cmn_write_box.single h2::before, .cmn_write_box.in_page h3::before {position: absolute;display: block;content: "";left: 0;top: 0.4em;width: 0.6em;height: 0.6em;background-color: var(--cmn_write_box_theme_color);transform: rotateZ(45deg);}
.cmn_write_box.single h3, .cmn_write_box.in_page h4 {position: relative;display: inline-block;font-size: clamp(15px, 2vw, 17px);font-weight: bold;margin-bottom: 0.7em;margin-top: 1em;line-height: 1.4em;padding: 0.1em 0.7em 0.2em;border: 1px solid var(--cmn_write_box_theme_color);color: var(--cmn_write_box_theme_color);}
.cmn_write_box.single h4, .cmn_write_box.in_page h5 {position: relative;display: block;margin-top: 1.2em;margin-bottom: 0.2em;font-size: 1.05em;line-height: 1.4em;font-weight: bold;color: var(--cmn_write_box_theme_color);padding-left: 0.7em;}
.cmn_write_box.single h4::before, .cmn_write_box.in_page h5::before {position: absolute;display: block;content: "";top: 0.75em;left: 0;width: 0.3em;height: 0.6em;background-color: var(--cmn_write_box_theme_color);transform: translateY(-50%);-webkit-clip-path: polygon(0 0, 0% 100%, 100% 50%);        clip-path: polygon(0 0, 0% 100%, 100% 50%);}

/*-- list style --*/
:root {--cmn_list_color: #fff;}

ul.cmn_list_circle li, ul.cmn_list_kome li, ul.cmn_list_asterisk li {position: relative;display: block;margin-bottom: 0.5em;padding-left: 1.2em;}
ul.cmn_list_circle li:last-of-type, ul.cmn_list_kome li:last-of-type, ul.cmn_list_asterisk li:last-of-type {margin-bottom: 0;}
ul.cmn_list_circle li::before {position: absolute;display: block;content: "";top: 0;left: 0;width: 1em;height: 1em;transform: translateY(0.3em) scale(0.4);background-color: var(--cmn_list_color);border-radius: 9999px;}
ul.cmn_list_kome li {padding-left: 1.2em;font-size: 0.95em;line-height: 1.4em;}
ul.cmn_list_kome li::before {position: absolute;display: block;content: "";content: "※";top: 0;left: 0;width: 1em;height: 1em;transform: translateY(0em);color: var(--cmn_list_color);background: initial;}
ul.cmn_list_asterisk li {padding-left: 0.8em;font-size: 0.95em;line-height: 1.4em;}
ul.cmn_list_asterisk li::before {position: absolute;display: block;content: "";content: "*";top: 0;left: 0;width: 1em;height: 1em;transform: translateY(0em);color: var(--cmn_list_color);background: initial;}
ul.cmn_list_underline li {line-height: 1.4em;border-bottom: 1px solid var(--cmn_list_color);padding-top: 0.8em;padding-bottom: 0.8em;margin-bottom: 0;}
ul.cmn_list_underline li::before {position: absolute;display: block;content: "";top: 0;left: 0;width: 1em;height: 1em;transform: translateY(1.1em) scale(0.4);background-color: var(--cmn_list_color);border-radius: 9999px;}

/*-- list style --*/
/*----------------------------------------
	header
------------------------------------------*/
header .header_logo {position: fixed;top: 0;left: 0;width: min(120px, 16vw);height: auto;z-index: var(--z_nav);transform: translate(15%, 30%);transition: 0.2s;}
header .header_logo img {display: block;width: 100%;height: auto;}
header .header_logo:hover {opacity: 0.7;}


/*----------------------------------------
	footer
------------------------------------------*/
footer {
  padding: 120px 0 50px;
  text-align: center;
}

@media only screen and (max-width: 835px) {
  footer {
    padding: 15vw 0 5.6vw;
  }
}
/*----------------------------------------
	bg
------------------------------------------*/
/*----------------------------------------
	modal
------------------------------------------*/
.cmn_modal_layer {--modal_btn_size: clamp(50px , 5vw , 70px);position: fixed;top: 0px;left: 0;right: 0;bottom: 0;width: 100%;height: 100%;z-index: var(--z_modal);opacity: 0;visibility: hidden;pointer-events: none;}
.cmn_modal_layer .modal_bg {position: fixed;top: 0px;left: 0;right: 0;bottom: 0;width: 100%;height: 100%;background-color: rgba(0, 0, 0, 0.6);opacity: 0;transition: 0.6s;}
.cmn_modal_layer .modal_inner {position: absolute;width: auto;height: auto;top: 50%;left: 50%;transform: translateX(-50%) translateY(-50%);text-align: left;opacity: 0;transition: 0.6s;}
.cmn_modal_layer .modal_inner img {width: auto;height: auto;max-width: min(1400px, 94vw);max-height: 75vh;cursor: initial;}
.cmn_modal_layer .modal_inner img.img_mono_modal_content {width: auto !important;height: auto !important;cursor: initial !important;}
.cmn_modal_layer .modal_inner .modal_youtube_video_box {width: min(1200px, 94vw);padding-top: min(90vh, 56.25%);}
.cmn_modal_layer .modal_inner .modal_youtube_video_box iframe {position: absolute;top: 0;left: 0;width: 100%;height: 100%;}
.cmn_modal_layer .modal_inner .modal_youtube_video_box img {position: absolute;top: 0;left: 0;width: 100%;height: 100%;-o-object-fit: contain;   object-fit: contain;}
.cmn_modal_layer .modal_inner .modal_textbox {width: min(1000px, 94vw);height: 75vh;background-color: var(--c_white_l);color: var(--c_black_d);padding: clamp(12px, 4vw, 50px);text-align: left;overflow: hidden;font-size: clamp(13px, 2vw, 16px);}
.cmn_modal_layer .modal_inner .modal_textbox.scrollable {overflow-x: hidden;overflow-y: scroll;overscroll-behavior: contain;}
.cmn_modal_layer .modal_close_btn {position: absolute;top: -26px;right: -26px;width: var(--modal_btn_size);height: var(--modal_btn_size);background: no-repeat center url("../img/svg/modal_close.svg");background-size: contain;cursor: pointer;}
.cmn_modal_layer.visible {opacity: 1;visibility: visible;pointer-events: auto;}
.cmn_modal_layer.visible .modal_bg {opacity: 1;}
.cmn_modal_layer.visible .modal_inner {opacity: 1;}

.cmn_slide_modal_layer .modal_inner.slide_modal_content_box .slide_modal_content {position: absolute;width: auto;height: auto;top: 50%;left: 50%;transform: translateX(-50%) translateY(-50%);opacity: 0;visibility: hidden;transition: 0.2s;pointer-events: none;}
.cmn_slide_modal_layer .modal_inner.slide_modal_content_box .slide_modal_content.slide_visible {opacity: 1;visibility: visible;pointer-events: initial;}
.cmn_slide_modal_layer .modal_prev_btn, .cmn_slide_modal_layer .modal_next_btn {position: absolute;top: 50%;transform: translateY(-50%);height: min(270px, 25vh);width: min(80px, 10vw);background-color: var(--c_black);cursor: pointer;transition: 0.2s;-webkit-tap-highlight-color: rgba(0, 0, 0, 0);}
.cmn_slide_modal_layer .modal_prev_btn::before, .cmn_slide_modal_layer .modal_next_btn::before {position: absolute;display: block;content: "";top: 50%;left: 50%;transform: translate(-50%, -50%);width: 40%;height: 100%;background: no-repeat center url(../images/template_parts/icon_arrow_slidemodal_02.svg);background-size: contain;}
.cmn_slide_modal_layer .modal_prev_btn.disactive, .cmn_slide_modal_layer .modal_next_btn.disactive {opacity: 0.2;pointer-events: none;}
.cmn_slide_modal_layer .modal_prev_btn:focus, .cmn_slide_modal_layer .modal_next_btn:focus {outline: none;}
.cmn_slide_modal_layer .modal_prev_btn {left: 0;border-top-right-radius: 10px;border-bottom-right-radius: 10px;}
.cmn_slide_modal_layer .modal_prev_btn::before {transform: translate(-50%, -50%) scale(-1, 1);}
.cmn_slide_modal_layer .modal_prev_btn:hover {transform: translateY(-50%) translateX(-4px);}
.cmn_slide_modal_layer .modal_next_btn {right: 0;border-top-left-radius: 10px;border-bottom-left-radius: 10px;}
.cmn_slide_modal_layer .modal_next_btn:hover {transform: translateY(-50%) translateX(4px);}

@media only screen and (max-width: 835px) {
  .slide_modal .modal_prev_btn, .slide_modal .modal_next_btn {width: 12%;height: 20vh;background-size: 30% auto;}
  .slide_modal .modal_prev_btn {left: 0;}
  .slide_modal .modal_next_btn {right: 0;}
  .cmn_modal_layer .modal_close_btn {right: 0;}
}
.cmn_img_mono_modal_trigger {
  cursor: pointer;
}
