@charset "UTF-8";
/* ===============================================
#擬似要素中央配置 mixin
=============================================== */
/* ===============================================
# navigation
=============================================== */
:root {
    --header_bg_color: rgb(0, 0, 0,40%);
    --mobile_bg_color:#000;
    --bg_color: #000;
    --link_color: #fff;
    --txt_color: #fff;
    --txt_sub: #CCCCCC;
    --key_color: #F16C04;
    --key_color_dark: #E46603;
    --ac_color: #E10101;
    --ob_lighten: #aa866a;
    --ob_darken: #383635;
    --button-color:#000;
    --button-text-color:#fff;
    --flex-gap:30px;
    --font-noto:"YuGothic","Yu Gothic","Hiragino Sans", sans-serif;
    --font-serif:"Noto Serif JP", sans-serif;
    --main_padding:20px;
    --caution:#E10101;
}

/* ===============================================
# SNSカラー
=============================================== */
html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, dialog, figure, footer, header, hgroup, menu, nav, section, time, mark, audio, video {margin: 0;padding: 0;border: 0;outline: 0;font-size: 100%;vertical-align: baseline;background: transparent;}

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

ul li {list-style: none;}

input, select {vertical-align: middle;}

img {height: auto;width: 100%;line-height: 0;display: block;}

body {font-size: 16px;line-height: 1.6em;color: var(--txt_color);font-family: "Montserrat", "YuGothic", "Yu Gothic", "Hiragino Sans", sans-serif;position: relative;background: var(--bg_color);}
body.menu_open {overflow: hidden;}
body .container {overflow-x: hidden;}

* {box-sizing: border-box;}

a {color: #000000;text-decoration: none;}
a:hover {opacity: 0.8;}

/* ===============================================
# module
=============================================== */
.sp_only {display: none;}
@media screen and (max-width: 750px) {.sp_only {  display: block;}}

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

.anime, .anime-no-hidden {opacity: 0;visibility: hidden;}
.anime.js-play, .anime-no-hidden.js-play {opacity: 1;visibility: visible;}

.section_wrap:not(:last-of-type) {margin-bottom: 240px;}
@media screen and (max-width: 750px) {.section_wrap:not(:last-of-type) {  margin-bottom: 120px;}}

.anchor-clear {margin-top: -130px;padding-top: 130px;}

.sec-inner {max-width: 1100px;margin: 0 auto;width: 92%;}

.flex-box {display: flex;flex-wrap: wrap;gap: var(--flex-gap);}
.flex-box .box01 {width: 100%;}
.flex-box .box02 {width: calc((100% - var(--flex-gap)) / 2);}
.flex-box .box03 {width: calc((100% - var(--flex-gap) * 2) / 3);}
.flex-box .box04 {width: calc((100% - var(--flex-gap) * 3) / 4);}
@media screen and (max-width: 750px) {.flex-box .box04 {  width: calc(100% - var(--flex-gap) / 2);}}
.flex-box.center {justify-content: center;}

.bold {font-weight: bold;}

.text-center {text-align: center;}

.text-left {text-align: left;}

.text-right {text-align: right;}

.txt {font-size: 20px;line-height: 1.6em;}

.txt-s {font-size: 0.6em;line-height: 1em;}

.mb-05em {margin-bottom: 0.5em;}

.mb-1em {margin-bottom: 1em;}

.mb-2em {margin-bottom: 2em;}

/* textList(div等で囲む) */
p.text-list,
.text-list ul li {padding: 0 0 3px 1.1em;position: relative;}

p:not(:last-of-child).text-list {margin-bottom: 1em;}

.text-list ul li:not(:last-of-child) {margin-bottom: 5px;}

p.text-list::before,
.text-list ul li::before {content: "※";position: absolute;left: 0;}

p.text-list-dotted::before,
.text-list-dotted ul li::before {content: "・";}

p.text-list-circle::before,
.text-list-circle ul li::before {content: "●";}

p.text-list-square::before,
.text-list-square ul li::before {content: "■";}

p.text-list-counter,
.text-list-counter ul li {padding-left: 1.4em;}

p.text-list-counter::before,
.text-list-counter ul li::before {counter-increment: number 1;content: "" counter(number) "";}

.text-list-counter ol {list-style-type: decimal;padding-left: 1.2em;}

@media screen and (max-width: 768px) {.anchor-clear {  margin-top: -80px;  padding-top: 80px;}.section-wrap:not(:last-of-type) {  margin-bottom: 120px;}.flex-box .box01 {  width: 100%;}.flex-box .box02 {  width: 100%;}.text-list ul li {  font-size: 13px;  line-height: 1.7em;}}
/* ================================= ヘッダー =================================== */
.header {position: fixed;background: var(--header_bg_color);width: 100%;z-index: 1000;border-bottom: 1px solid #fff;}
@media screen and (max-width: 768px) {.header {  background: none;  pointer-events: none;  border: none;}.header:before {  content: "";  position: absolute;  background: none;  width: 100%;  height: 66px;  left: 50%;  transform: translateX(-50%);  top: 0;}}
.header__inner {display: flex;justify-content: space-between;width: 100%;}
@media screen and (max-width: 768px) {.header__inner {  pointer-events: none;}}
.header__title {font-size: 20px;width: min(20vw, 140px);}
.header__title a {display: block;padding: 20px min(1vw, 20px);}
@media screen and (max-width: 768px) {.header__title {  position: absolute;  top: 20px;  left: 20px;  pointer-events: all;  width: 100px;}.header__title a {  background: transparent;  padding: 0;}}

.nav {margin-left: auto;pointer-events: all;margin-right: 10px;}
.nav__lists {display: flex;}
.nav__list a {padding: 20px min(1.5vw, 20px);display: block;color: var(--link_color);font-weight: bold;transition: 0.2s;font-size: min(1.7vw, 18px);}
.nav__list a.off {pointer-events: none;opacity: 0.4;}
.nav__list a:hover {color: var(--key_color);transition: 0.2s;opacity: 1;}
.nav__bg {display: none;transition: 0.5s all;}
.nav__trigger {display: none;transition: 0.2s all;}
@media screen and (max-width: 768px) {.nav__trigger {  display: block;  position: absolute;  width: 35px;  top: 20px;  right: 20px;  pointer-events: all;}.nav__trigger span {  display: inline-block;  vertical-align: middle;  position: relative;  width: 100%;  height: 2px;  background-color: #fff;}.nav__trigger span::before {  content: "";  display: block;  width: 100%;  height: 2px;  position: absolute;  background: #fff;  transition: all 0.3s;  margin-top: -8px;}.nav__trigger span::after {  content: "";  display: block;  width: 100%;  height: 2px;  position: absolute;  background: #fff;  transition: all 0.3s;  margin-top: 8px;  width: 50%;  right: 0;}}
@media screen and (max-width: 768px) {.nav {  margin-left: inherit;  width: 100%;}.nav__lists {  display: block;  width: 100%;}.nav__list {  text-align: left;}.nav__list a {  padding: 14px 0 14px 30px;  font-size: 20px;  line-height: 1.7em;  border-bottom: 1px solid rgba(255, 255, 255, 0.1490196078);}.nav__list:first-of-type {  border-top: 1px solid rgba(255, 255, 255, 0.1490196078);}.nav__bg {  display: block;  opacity: 0;}.nav__active .nav__trigger span {  background: none;}.nav__active .nav__trigger span::before {  content: "";  display: block;  width: 100%;  height: 2px;  position: absolute;  background: #fff;  transition: all 0.3s;  margin-top: 0;  transform: rotate(15deg);}.nav__active .nav__trigger span::after {  content: "";  display: block;  width: 100%;  height: 2px;  position: absolute;  background: #fff;  transition: all 0.3s;  margin-top: 0;  transform: rotate(-15deg);}.nav__active .nav__bg {  width: 100%;  height: 100vh;  height: 100dvh;  background: #000;  opacity: 0.9;  position: absolute;  top: 0;  z-index: -1;}.nav__active .nav_wrap {  transition: 0.2s;  visibility: visible;  opacity: 1;  pointer-events: all;}}

.sns ul {display: flex;justify-content: center;margin-right: 20px;}
.sns ul li {margin: 0 5px;width: 28px;}

.nav_wrap {display: flex;align-items: center;}
.nav_wrap .nav {margin-bottom: 0px;}

@media screen and (max-width: 768px) {.nav_wrap {  display: block;  transition: 0.4s;  padding: 80px 0;  visibility: hidden;  opacity: 0;  pointer-events: none;  overflow-y: scroll;  height: 100vh;  width: 100%;}.nav_wrap .nav {  margin-bottom: 30px;}.nav_wrap::-webkit-scrollbar {  display: none;}.nav_wrap::-webkit-scrollbar-track {  display: none;}.sns ul {  justify-content: left;  margin-left: 20px;}.sns ul li {  width: 32px;  margin: 0 10px;}}
/* ================================= ヘッダー =================================== */
/* ================================= フッター =================================== */
.footer {text-align: center;padding: 80px 0;position: relative;z-index: 3;}
.footer .bnr_block {margin-bottom: 40px;}
.footer .bnr_block ul {display: flex;justify-content: center;}
.footer .bnr_block li {max-width: 340px;display: inline-block;}
.footer .icon_nav {margin-bottom: 40px;}
.footer .icon_nav .sns_tit {text-align: center;margin-bottom: 20px;font-size: 18px;}
.footer .icon_nav ul {display: flex;justify-content: center;align-items: center;}
.footer .icon_nav li {display: inline-block;margin: 0 14px;width: 32px;}
.footer .credit {font-size: 12px;font-family: var();}

@media screen and (max-width: 768px) {.footer {  padding: 40px 0;}.footer .bnr_block li {  max-width: 240px;}.footer .icon_nav li {  margin: 0 2%;}}
/* ================================= フッター =================================== */
/* ================================= ヘディング =================================== */
.heading {display: inline-block;position: relative;}

/* ================================= ヘディング =================================== */
/* ================================= ボタン周り =================================== */
.button {max-width: 500px;margin: 0 auto;padding: 4px;position: relative;}
.button a {display: block;width: 100%;background: #000;font-size: 16px;padding: 20px;color: var(--key_color);font-weight: bold;position: relative;z-index: 2;border: 1px solid var(--key_color);text-align: center;}
.button a:before {position: absolute;content: "";background: url(../images/icon_next.svg) no-repeat center;background-size: contain;width: 10px;height: 16px;top: 50%;transform: translateY(-50%);right: 20px;transition: 0.2s;}
.button a:hover {opacity: 1;background: var(--key_color_dark);color: #fff;}
.button a:hover:before {transition: 0.2s;right: 14px;}
.button:hover:after {width: calc(100% - 9px);height: calc(100% - 9px);transition: 0.2s;}
.button.bnr {padding: 0;}
.button.bnr a {padding: 2em 1.6em;font-size: 14px;transform: scale(1);transition: 0.2s;background: var(--ob_lighten);}
.button.bnr a:hover {opacity: 1;transform: scale(1.02);transition: 0.2s;}
.button.bnr a:hover:before {transition: 0.2s;right: 14px;}
.button.bnr:after {display: none;}
.button.bnr.purple a {background: var(--key_color);}
.button.arrow a:before {background: url(../images/icon_arrow.svg) no-repeat center;background-size: contain;}
.button.disactive a {background: #ccc;border: none;color: #fff;}
.button.disactive a:before {filter: grayscale(1);}
.button.disactive:after {border-color: #ccc;}

@media screen and (max-width: 768px) {.button a {  padding: 16px 30px;}.button a:before {  right: 12px;}.button.bnr a {  padding: 1.4em 40px 1.4em 1.8em;  font-size: 14px;  font-weight: normal;}}
/* ================================= ボタン周り =================================== */
/* ================================= youtube =================================== */
.youtube {position: relative;padding-top: 56.25%;background: #000;}
.youtube iframe {position: absolute;width: 100%;height: 100%;top: 50%;left: 50%;transform: translate(-50%, -50%);}

/* ================================= youtube =================================== */
/* ================================= カミスン =================================== */
.cs_img {position: relative;background: #ccc;aspect-ratio: 16/9;display: flex;justify-content: center;align-items: center;}
.cs_img::before {content: "COMING SOON";position: absolute;color: #fff;font-size: 2em;}

/* ================================= カミスン =================================== */
/******************************* error_404 *********************************/
#error_404 {text-align: center;width: 90%;max-width: 500px;margin: 0 auto;padding: 200px 0 200px;}

#error_404 .stit {font-size: 3em;line-height: 1.5em;margin-bottom: 0.5em;font-weight: bold;}

#error_404 .text {font-size: 1.2em;}

#error_404 .button-outer {margin-top: 3em;}

/******************************* error_404 *********************************/
/* ================================= モーダル =================================== */
.modal_trigger {cursor: pointer;}

.modal-box {position: fixed;width: 100%;height: 100vh;height: 100dvh;top: 0;right: 0;z-index: -1;transition: 0.5s ease;overflow: hidden;display: block;opacity: 0;visibility: hidden;background-position: center;}

.modal-box:before {content: "";position: fixed;background: #000;opacity: 0.9;background-size: cover;width: 100%;height: 100vh;height: 100dvh;top: 0;left: 0;z-index: -1;}

.modal-box .modal-inner {position: relative;width: 100%;height: 100%;display: flex;align-items: center;}

.modal-box .modal-inner .close {cursor: pointer;position: absolute;right: 20px;width: 50px;top: 20px;height: 40px;}

.modal-box .modal-inner .close span {position: relative;width: 100%;height: 100%;display: block;}

.modal-box .modal-inner .close span:before {content: "";position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%) rotate(45deg);background: #fff;width: 50px;height: 1px;}

.modal-box .modal-inner .close span:after {content: "";position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%) rotate(-45deg);background: #fff;width: 50px;height: 1px;}

.modal-box .modal-inner .modal-content {width: 92%;max-width: 1000px;margin: 0 auto;position: relative;padding: 50px;border: 1px solid #535353;text-align: left;background: #000;}

.modal-box .modal-inner .modal-content .inner-scroll {overflow-y: scroll;max-height: calc(80vh - 40px);padding: 0 30px;}

.modal-box .modal-inner .modal-content .inner-scroll::-webkit-scrollbar {display: none;}

.modal-box .modal-inner .modal-content .inner-scroll::-webkit-scrollbar-track {display: none;}

.modal-box.active {opacity: 1;visibility: visible;right: 0;z-index: 1000;}

.modal-box.active .modal-inner {pointer-events: all;}

.modal_img.modal_box .modal_inner .modal_content {width: 100%;}

@media screen and (max-width: 768px) {.modal-box .modal-inner .modal-content {  padding: 30px;}.modal-box .modal-inner .modal-content .inner-scroll {  padding: 0;}.modal-box .modal-inner .close {  right: 0px;  top: -50px;}.modal_img.modal_box .close {  top: 50%;  transform: translateY(-36vw);  right: 0;}}
/* ================================= モーダル =================================== */
.text-bg-slider {position: relative;display: flex;width: 100vw;padding: 0;transform-origin: center;pointer-events: none;opacity: 1;z-index: -1;bottom: 0px;}
.text-bg-slider .slide-inner {display: flex;}
.text-bg-slider .slide-inner span {color: #fff;display: block;}
.text-bg-slider .slide-inner .slide {display: block;-webkit-animation: slide_l1 50s linear infinite;        animation: slide_l1 50s linear infinite;line-height: 0;font-weight: bold;color: #000;margin-right: 20px;}
.text-bg-slider .slide-inner .slide img {height: min(10vw, 160px);width: auto;}
@media screen and (max-width: 768px) {.text-bg-slider .slide-inner .slide img {  height: min(30vw, 160px);}}

.slider-box {position: absolute;width: 100%;}
.slider-box:nth-of-type(1) {top: 0;}
.slider-box:nth-of-type(2) {bottom: 0;}
.slider-box:nth-of-type(2) .text-bg-slider .slide-inner .slide {-webkit-animation: slide_r1 50s linear infinite;        animation: slide_r1 50s linear infinite;}

@-webkit-keyframes slide_l1 {0% {  transform: translateX(-100%);}to {  transform: translateX(-200%);}}

@keyframes slide_l1 {0% {  transform: translateX(-100%);}to {  transform: translateX(-200%);}}
@-webkit-keyframes slide_r1 {0% {  transform: translateX(-100%);}to {  transform: translateX(0%);}}
@keyframes slide_r1 {0% {  transform: translateX(-100%);}to {  transform: translateX(0%);}}
/* ===============================================
# アニメーション
=============================================== */
@-webkit-keyframes play {from {  opacity: 0;}to {  opacity: 1;}}
@keyframes play {from {  opacity: 0;}to {  opacity: 1;}}
@-webkit-keyframes maskOut {from {  transform: translateY(0);}to {  transform: translateY(-131%);}}
@keyframes maskOut {from {  transform: translateY(0);}to {  transform: translateY(-131%);}}
@-webkit-keyframes slideInLeft {0% {  opacity: 0;  transform: translateX(10%);  filter: blur(10px);}100% {  opacity: 1;  transform: translateX(0);  filter: blur(0);}}
@keyframes slideInLeft {0% {  opacity: 0;  transform: translateX(10%);  filter: blur(10px);}100% {  opacity: 1;  transform: translateX(0);  filter: blur(0);}}
@-webkit-keyframes slideInRight {0% {  opacity: 0;  transform: translateX(-10%);  filter: blur(10px);}100% {  opacity: 1;  transform: translateX(0);  filter: blur(0);}}
@keyframes slideInRight {0% {  opacity: 0;  transform: translateX(-10%);  filter: blur(10px);}100% {  opacity: 1;  transform: translateX(0);  filter: blur(0);}}
@-webkit-keyframes slideInBottom {0% {  opacity: 0;  transform: translateY(10%);  filter: blur(10px);}100% {  opacity: 1;  transform: translateY(0);  filter: blur(0);}}
@keyframes slideInBottom {0% {  opacity: 0;  transform: translateY(10%);  filter: blur(10px);}100% {  opacity: 1;  transform: translateY(0);  filter: blur(0);}}
@-webkit-keyframes slideInTop {0% {  opacity: 0;  transform: translateY(-10%);  filter: blur(10px);}100% {  opacity: 1;  transform: translateY(0);  filter: blur(0);}}
@keyframes slideInTop {0% {  opacity: 0;  transform: translateY(-10%);  filter: blur(10px);}100% {  opacity: 1;  transform: translateY(0);  filter: blur(0);}}
@-webkit-keyframes stamp {0% {  opacity: 0;  transform: scale(6);  filter: blur(10px);}66% {  opacity: 0.3;  transform: scale(2.4);  filter: blur(10px);}90% {  opacity: 1;  transform: scale(1);  filter: blur(0);}91% {  opacity: 1;  transform: scale(1) translateX(-5%);  filter: blur(0);}92% {  opacity: 1;  transform: scale(1) translateX(5%);  filter: blur(0);}93% {  opacity: 1;  transform: scale(1) translateX(-4%);  filter: blur(0);}94% {  opacity: 1;  transform: scale(1) translateX(4%);  filter: blur(0);}96% {  opacity: 1;  transform: scale(1) translateX(-2%);  filter: blur(0);}97% {  opacity: 1;  transform: scale(1) translateX(2%);  filter: blur(0);}98% {  opacity: 1;  transform: scale(1) translateX(-1%);  filter: blur(0);}100% {  opacity: 1;  transform: scale(1) translateX(0);  filter: blur(0);}}
@keyframes stamp {0% {  opacity: 0;  transform: scale(6);  filter: blur(10px);}66% {  opacity: 0.3;  transform: scale(2.4);  filter: blur(10px);}90% {  opacity: 1;  transform: scale(1);  filter: blur(0);}91% {  opacity: 1;  transform: scale(1) translateX(-5%);  filter: blur(0);}92% {  opacity: 1;  transform: scale(1) translateX(5%);  filter: blur(0);}93% {  opacity: 1;  transform: scale(1) translateX(-4%);  filter: blur(0);}94% {  opacity: 1;  transform: scale(1) translateX(4%);  filter: blur(0);}96% {  opacity: 1;  transform: scale(1) translateX(-2%);  filter: blur(0);}97% {  opacity: 1;  transform: scale(1) translateX(2%);  filter: blur(0);}98% {  opacity: 1;  transform: scale(1) translateX(-1%);  filter: blur(0);}100% {  opacity: 1;  transform: scale(1) translateX(0);  filter: blur(0);}}
@-webkit-keyframes box-open_left {0% {  -webkit-clip-path: polygon(0 0, 0 0, 0 100%, 0% 100%);          clip-path: polygon(0 0, 0 0, 0 100%, 0% 100%);}100% {  -webkit-clip-path: polygon(0 0, 100% 0, 100% 100%, 0% 100%);          clip-path: polygon(0 0, 100% 0, 100% 100%, 0% 100%);}}
@keyframes box-open_left {0% {  -webkit-clip-path: polygon(0 0, 0 0, 0 100%, 0% 100%);          clip-path: polygon(0 0, 0 0, 0 100%, 0% 100%);}100% {  -webkit-clip-path: polygon(0 0, 100% 0, 100% 100%, 0% 100%);          clip-path: polygon(0 0, 100% 0, 100% 100%, 0% 100%);}}
@-webkit-keyframes box-open_right {0% {  -webkit-clip-path: polygon(100% 0, 100% 0, 100% 100%, 100% 100%);          clip-path: polygon(100% 0, 100% 0, 100% 100%, 100% 100%);}100% {  -webkit-clip-path: polygon(0 0, 100% 0, 100% 100%, 0% 100%);          clip-path: polygon(0 0, 100% 0, 100% 100%, 0% 100%);}}
@keyframes box-open_right {0% {  -webkit-clip-path: polygon(100% 0, 100% 0, 100% 100%, 100% 100%);          clip-path: polygon(100% 0, 100% 0, 100% 100%, 100% 100%);}100% {  -webkit-clip-path: polygon(0 0, 100% 0, 100% 100%, 0% 100%);          clip-path: polygon(0 0, 100% 0, 100% 100%, 0% 100%);}}
.anime {position: relative;overflow: hidden;opacity: 0;}

.anime-no-hidden {position: relative;opacity: 0;}

.stamp-f.isPlay {animation: stamp 0.4s both;-webkit-animation: stamp 0.4s both;}

.blkin.js-play {-webkit-animation-name: play;        animation-name: play;-webkit-animation-duration: 0.6s;        animation-duration: 0.6s;-webkit-animation-delay: 0.8s;        animation-delay: 0.8s;-webkit-animation-fill-mode: backwards;        animation-fill-mode: backwards;-webkit-animation-timing-function: cubic-bezier(0.8, 0, 0.5, 1);        animation-timing-function: cubic-bezier(0.8, 0, 0.5, 1);position: relative;}

.blkin.js-play:before {-webkit-animation-name: maskOut;        animation-name: maskOut;-webkit-animation-duration: 0.5s;        animation-duration: 0.5s;-webkit-animation-delay: 0.9s;        animation-delay: 0.9s;-webkit-animation-fill-mode: forwards;        animation-fill-mode: forwards;-webkit-animation-timing-function: cubic-bezier(0.8, 0, 0.5, 1);        animation-timing-function: cubic-bezier(0.8, 0, 0.5, 1);content: "";position: absolute;top: 0;left: 0;z-index: 1000;width: 100%;height: 100%;background: #B261D9;}
/*# sourceMappingURL=common.css.map */