@charset "utf-8";


@media all and (min-width: 600px) {
	
	.width_std {
		width: 640px !important;
		height: auto !important;
	}
	.height_std {
		width: auto !important;
		height: 640px !important;
	}
    /*==================== desktop タブブロック ====================*/

    ._tabBlock_ {
        display: grid;
        grid-template-columns: repeat(4, 1fr);
    }

    .terms_and_policy._tabBlock_ {
        grid-template-columns: repeat(4, auto);
    }

    ._tabBlock_ > input[type="radio"] {
        display: none;
    }

    ._tabBlock_ .tab {
        cursor: pointer;
        color: #310000;
        grid-row: 1 / 2;
        margin: 0 .5rem;
    }

    ._tabBlock_ .tab:focus,
    ._tabBlock_ .tab:hover {
        color: #df6a07;
    }

    ._tabBlock_ .tab > .inner {
        margin: 0;
        padding: 1.5rem;
        border-radius: .8rem .8rem 0 0;
        border-style: solid;
        border-width: 1px 1px 0 1px;
        border-color: #948483;
    }

    ._tabBlock_ .tab:focus .inner,
    ._tabBlock_ .tab:hover .inner {
        background: #fff;
    }

    ._tabBlock_ .tab1 {
        grid-column: 1 / 2;
    }

    ._tabBlock_ .tab2 {
        grid-column: 2 / 3;
    }

    ._tabBlock_ .tab3 {
        grid-column: 3 / 4;
    }

    ._tabBlock_ .unit {
        grid-column: 1 / 5;
        grid-row: 2 / 3;
        border: solid 1px #948483;
        background: #fff;
    }

    ._tabBlock_ .unit > .inner {
        padding: 3rem;
    }

    ._tabBlock_ input:checked + .tab {
        background: #fff;
    }

    @keyframes TBfadeIn {
        0% {
            transform: translateY(-20px);
            display: block;
            opacity: 0;
        }
        100% {
            transform: translateY(0px);
            opacity: 1;
        }
    }

    @keyframes TBfadeOut {
        0% {
            transform: translateY(0px);
            opacity: 1;
        }
        75% {
            transform: translateY(-20px);
            opacity: 0;
            display: none;
        }
        100% {
            display: none;
        }
    }

    ._tabBlock_ input:checked + .tab + .unit {
        display: block;
        /* animation: TBfadeIn .4s ease-in 0s 1 forwards; */
    }

    ._tabBlock_ input:not(:checked) + .tab + .unit {
        display: none;
        /* animation: TBfadeOut .4s ease-out 0s 1 forwards; */
    }

	/*==================== desktop モーダル ====================*/

	@keyframes modalFadeIn {
		0% {
			opacity: 0;
		}
		100% {
			opacity: 1;
		}
	}

	#modal_test {
		display: none;
	}

	.modal_opener {
		cursor: pointer;
	}

	._modalLayer_ #modal_test {
		display: block;
		position: relative;
		margin: 0;
		padding: 5rem;
		background: #fff;
		width: 100%;
		height: 100%;
		box-sizing: border-box;
		overflow-y: scroll;
	}

	._modalLayer_ {
		position: fixed;
		z-index: 200;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		box-sizing: border-box;
		background: rgba(0, 0, 0, 0.7);
	}

	._modalLayer_ ._inner_ {
		width: 100%;
		height: 100%;
		box-sizing: border-box;
		padding: 5vw;
		display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: center;
	}

	._modalLayer_ > ._close_ {
		display: block;
		position: absolute;
		z-index: 2;
		right: 1rem;
		top: 1rem;
		width: 5rem;
		height: 5rem;
		border-radius: 50%;
		border: 1px solid #fff;
		background: #b5b5b5;
		transform: rotate(45deg);
		cursor: pointer;
	}

	._modalLayer_ > ._close_::before {
		content: "";
		display: block;
		position: absolute;
		z-index: 2;
		top: 50%;
		left: .5rem;
		width: 4rem;
		height: 1px;
		background-color: #fff;
	}

	._modalLayer_ > ._close_::after {
		content: "";
		display: block;
		position: absolute;
		z-index: 2;
		top: .5rem;
		left: 50%;
		width: 1px;
		height: 4rem;
		background-color: #fff;
	}

	._modalLayer_ img {
		max-width: 100%;
		max-height: 100%;
	}


	/*==================== desktop カルーセルスライダー2 ====================*/

	/* セクション末尾に カスタマイズ例 あり */

	._carouselSlider2_ {
		 /*--- border: dotted 1px palevioletred; --- border for debug ---*/
		--item-width: 50vw; /* スライド1つの幅 */
		--item-height: calc(var(--item-width) * 5 / 8); /* スライドの高さ */
		--slider-width: 100% ; /* スライダーの全体幅 */
		--nav_pos: 92%;
		position: relative;
		overflow: hidden;
		width: var(--slider-width);
		height: var(--item-height);
	}

	._carouselSlider2_ ._no_anime_ {
		transition: unset !important;
	}
	
	._carouselSlider2_ ._role_ {
		transition: margin-left .5s ease-in-out, transform .5s ease-in-out; /* スワイプのインタラクションに必須 */
		display: flex;
		position: absolute;
		z-index: 2;
		left: 0;
		top: 0;
		margin: 0;
		padding: 0;
		height: var(--item-height);
	}

	._carouselSlider2_ ._role_ > li {
		/*--- border: solid 1px aquamarine; --- border for debug ---*/
		/* transition: transform .5s ease-in-out; */
		flex-grow: 1;
		width: var(--item-width);
		list-style: none;
		margin: 0;
		height: 100%;
        display: flex;
        align-items: center;
        justify-content: center;
	}

	._carouselSlider2_ ._role_ > li._l_,
	._carouselSlider2_ ._role_ > li._r_ {
		cursor: pointer;
	}

	._carouselSlider2_ ._role_ li .inner {
		box-sizing: border-box;
		height: 100%;
		width: 100%;
	}

	._carouselSlider2_ ._role_ img {
		max-width: 100%;
		max-height: 100%;
	}

	._carouselSlider2_ ._dots_ {
		position: absolute;
		z-index: 3;
		display: flex;
		justify-content: space-around;
		column-gap: 1.5rem;
		bottom: 1rem;
		left: 50%;
		transform: translateX( -50% );
	}

	._carouselSlider2_ ._dots_ span {
		width: 0.8rem;
		height: 0.8rem;
		background: #fff;
		border-radius: 50%;
	}

	._carouselSlider2_ ._dots_ span._current_ {
		transform: scale(150%);
	}

	._carouselSlider2_ ._dots_ span:first-child {
		margin-left: 0;
	}

	._carouselSlider2_ nav {
		position: absolute;
		z-index: 3;
		width: 100%;
		/* border: solid 1px green; */ /*--- border for debug ---*/
	}

    ._carouselSlider2_.feature nav > span {
        overflow: visible;
    }

	._carouselSlider2_ nav ._prev_,
	._carouselSlider2_ nav ._next_ {
		display: block;
		overflow: hidden;
		position: absolute;
		z-index: 2;
		top: calc(var(--item-height) / 3);
		width: calc(var(--item-height) / 4);
		height: calc(var(--item-height) / 3);
		cursor: pointer;
		text-indent: -10em;
		color: transparent;
		/* border: solid 1px pink; */ /*--- border for debug ---*/
	}
	
	._carouselSlider2_ nav ._prev_ {
		right: var(--nav_pos);
		transform: translateX(50%);
	}

	._carouselSlider2_ nav ._next_ {
		left: var(--nav_pos);
		transform: translateX(-50%);
	}
	
	._carouselSlider2_ nav ._prev_::after,
	._carouselSlider2_ nav ._next_::after {
		transform-origin: 50% 50%;
		content: " ";
		display: block;
		position: absolute;
		z-index: 2;
		top: 50%;
		left: 50%;
		width: 6vw;
		height: 6vw;
		border-radius: 50%;
		background: #fff;
		box-shadow:
			0 7px 5px 0 rgba(0, 0, 0, .4),
			0 5px 3px 0 rgba(0, 0, 0, .2)
		;
	}

	._carouselSlider2_ nav ._prev_::after {
		transition: transform .2s ease-in-out;
		transform: translate(-50%, -50%) scale(1, 1);
		background: #000 url(./images/slider_larr.svg) center center / 4vw 4vw  no-repeat;
	}

	._carouselSlider2_ nav ._next_::after {
		transition: transform .2s ease-in-out;
		transform: translate(-50%, -50%) scale(1, 1);
		background: #000 url(./images/slider_rarr.svg) center center / 4vw 4vw no-repeat;
	}

	._carouselSlider2_ nav ._prev_:hover::after,
	._carouselSlider2_ nav ._next_:hover::after {
		transform: translate(-50%, -50%) scale(1.2, 1.2);
	}

	._carouselSlider2_ nav ._prev_:active::after,
	._carouselSlider2_ nav ._next_:active::after {
		opacity: 0.7;
	}

	/* ---------- home フィーチャーエリア用カスタマイズ ここから ---------- */

	._carouselSlider2_.feature {
		/* border-style: solid; */ /*--- border for debug ---*/
		--cover-item-width: 980px; /* スライド1つの幅 */
		--cover-item-height: 380px; /* スライドの高さ */
		--cover-slider-width: 100% ; /* スライダーの全体幅 */
        --cover-navui-pos-h: 1170px; /* ナビゲーションUIの親ブロック幅による位置決め */
        --cover-navout-wh: 80px; /* ナビゲーションUIの正方サイズ */
        --cover-navui-wh: 60px; /* ナビゲーションUIの正方サイズ */
        --cover-navico-wh: 40px; /* ナビゲーションicoの正方サイズ */
		width:  100%;
		height: var(--cover-item-height);
	}

	._carouselSlider2_.feature ._role_ {
		transition: margin-left 1s ease-in-out, transform 1s ease-in-out; /* スワイプのインタラクションに必須 */
		height: var(--cover-item-height);
	}

	._carouselSlider2_.feature ._role_ > li {
		width: 1080px;
	}

	._carouselSlider2_.feature ._role_ > li .inner {
		box-sizing: border-box;
		transition: unset;
        padding: 0 4rem;
	}

	._carouselSlider2_.feature ._role_ > li._l_{
		position: relative;
		z-index: 1;
	}

	._carouselSlider2_.feature ._role_ > li._r_{
		position: relative;
		z-index: 1;
	}

	._carouselSlider2_.feature ._role_ > li._current_{
		position: relative;
		z-index: 2;
	}

	._carouselSlider2_.feature .container {
        display: flex;
        width: var(--cover-item-width);
        height: 380px;
        border-radius: 15px;
        overflow: hidden;
        background: #fff;
        color: #310000;
	}

    ._carouselSlider2_.feature .col {
        width: 50%;
    }

    ._carouselSlider2_.feature .col:last-child {
        display: flex;
        justify-content: center;
        overflow: hidden;
        position: relative;
    }

	._carouselSlider2_.feature ._role_ img {
        transition: transform 1s cubic-bezier(0.19, 1, 0.22, 1); /* easeOutExpo */
        max-width: unset;
		width: auto;
		height: 100%;
	}

    ._carouselSlider2_.feature ._role_ a:focus img,
    ._carouselSlider2_.feature ._role_ a:hover img {
        transform: scale(1.1);
    }

    ._carouselSlider2_.feature nav {
        width: var(--cover-navui-pos-h);
        left: calc((100vw - var(--cover-navui-pos-h)) / 2);
    }

    ._carouselSlider2_.feature nav ._prev_,
    ._carouselSlider2_.feature nav ._next_ {
        top: calc(var(--cover-item-height) / 2 - var(--cover-navout-wh) / 2);
        width: var(--cover-navout-wh);
        height: var(--cover-navout-wh);
    }

	._carouselSlider2_.feature nav ._prev_::after {
		transition: transform .2s ease-in-out;
		transform: translate(unset, unset) scale(1, 1);
        width: var(--cover-navui-wh);
        height: var(--cover-navui-wh);
		background: #000 url(./images/slider_larr.svg) center center / var(--cover-navico-wh) var(--cover-navico-wh) no-repeat;
	}

	._carouselSlider2_.feature nav ._next_::after {
		transition: transform .2s ease-in-out;
		transform: translate(unset, unset) scale(1, 1);
        width: var(--cover-navui-wh);
        height: var(--cover-navui-wh);
		background: #000 url(./images/slider_rarr.svg) center center / var(--cover-navico-wh) var(--cover-navico-wh) no-repeat;
	}

	._carouselSlider2_.feature nav ._prev_:hover::after,
	._carouselSlider2_.feature nav ._next_:hover::after {
		transform: translate(unset, unset) scale(1.2, 1.2);
	}

	._carouselSlider2_.feature nav ._prev_:active::after,
	._carouselSlider2_.feature nav ._next_:active::after {
		opacity: 0.7;
	}

	/* ---------- ここまで home フィーチャーエリア用カスタマイズ ---------- */

  
	/*==================== desktop ボタン 横並び ====================*/

	ul.buttons_horizontal {
		--pad_v: 1rem;
		--pad_h: 2rem;
		--pad_v_nega: -1rem;
		--pad_h_nega: -2rem;
		list-style: none;
		overflow: hidden;
		padding: 0;
	}

	ul.buttons_horizontal li {
		white-space: nowrap;
		float: left;
		margin: 0;
		padding: var(--pad_v) var(--pad_h);
		border: 1px solid #dadada;
	}

	ul.buttons_horizontal li > a {
		display: block;
		margin: var(--pad_v_nega) var(--pad_h_nega);
		padding: var(--pad_v) var(--pad_h);
	}

	ul.buttons_horizontal li > a:focus,
	ul.buttons_horizontal li > a:hover,
	ul.buttons_horizontal li > a:active {
		background: #fff;
	}
  
	/*==================== desktop 戻るリンク ====================*/

	._history_back_ {
		cursor: pointer;
	}
	
	._history_back_.button {
		display: inline-block;
		padding: .25rem .5rem;
		background: #e5e5e5;
		border: 1px solid #b5b5b5;
		border-radius: .25rem;
		font-size: 1.3rem;
	}

	._history_back_.button:hover {
		background: #fff;
	}
  
	/*==================== desktop ページの先頭へボタン ====================*/
  
	#_scrollToTop_ {
	  transition: opacity .3s ease-out;
	  -ms-transition: opacity .3s ease-out;
	  position: fixed;
	  z-index: 100;
	  bottom: 0;
	  right: 0;
	}
  
	#_scrollToTop_._visible_ {
	  opacity: 1;
	}
  
	#_scrollToTop_._hidden_ {
	  opacity: 0;
	}
  
	#_scrollToTop_ + * {
	  margin-top: 0;
	}
  
	#_scrollToTop_ p {
	  display: block;
	  margin: 0;
	  padding: 0;
	  overflow: hidden;
	}
  
	#_scrollToTop_ a {
	  -webkit-tap-highlight-color: transparent;
	  display: block;
	  position: absolute;
	  z-index: 2;
	  right: 20px;
	  bottom: 20px;
	}
  
	#_scrollToTop_ img {
	  transition: transform .2s ease-out;
	  -ms-transition: transform .2s ease-out;
	  transform: scale(.75, .75);
	  width: 54px;
	  height: 54px;
	  vertical-align: bottom;
	  opacity: 0.5;
	}
  
	#_scrollToTop_ a:hover img {
	  opacity: 0.75;
	  transform: scale(1, 1);
	}

}


@media all and (max-width: 599px) {
  
	.width_std,
	.height_std {
		width: 80vw !important;
		height: auto !important;
	}

	/*==================== mobile タブブロック ====================*/

    ._tabBlock_ {
        display: grid;
        grid-template-columns: repeat(4, 1fr);
    }

    .terms_and_policy._tabBlock_ {
        grid-template-columns: repeat(2, auto);
    }

    ._tabBlock_ > input[type="radio"] {
        display: none;
    }

    ._tabBlock_ .tab {
        cursor: pointer;
        color: #310000;
        grid-row: 1 / 2;
        margin: 0 .5rem;
        text-align: center;
    }

    ._tabBlock_ .tab:focus,
    ._tabBlock_ .tab:hover {
        color: #df6a07;
    }

    ._tabBlock_ .tab > .inner {
        margin: 0;
        padding: 1.5rem;
        border-radius: .8rem .8rem 0 0;
        border-style: solid;
        border-width: 1px 1px 0 1px;
        border-color: #948483;
    }

    ._tabBlock_ .tab:focus .inner,
    ._tabBlock_ .tab:hover .inner {
        background: #fff;
    }

    ._tabBlock_ .tab1 {
        grid-column: 1 / 2;
    }

    ._tabBlock_ .tab2 {
        grid-column: 2 / 3;
    }

    ._tabBlock_ .unit {
        grid-column: 1 / 5;
        grid-row: 2 / 3;
        border: solid 1px #948483;
        background: #fff;
    }

    .terms_and_policy._tabBlock_ .unit {
        grid-column: 1 / 3;
    }

    ._tabBlock_ .unit > .inner {
        padding: 3rem;
    }

    ._tabBlock_ input:checked + .tab {
        background: #fff;
    }

    @keyframes TBfadeIn {
        0% {
            transform: translateY(-20px);
            display: block;
            opacity: 0;
        }
        100% {
            transform: translateY(0px);
            opacity: 1;
        }
    }

    @keyframes TBfadeOut {
        0% {
            transform: translateY(0px);
            opacity: 1;
        }
        75% {
            transform: translateY(-20px);
            opacity: 0;
            display: none;
        }
        100% {
            display: none;
        }
    }

    ._tabBlock_ input:checked + .tab + .unit {
        display: block;
        /* animation: TBfadeIn .4s ease-in 0s 1 forwards; */
    }

    ._tabBlock_ input:not(:checked) + .tab + .unit {
        display: none;
        /* animation: TBfadeOut .4s ease-out 0s 1 forwards; */
    }

	/*==================== mobile モーダル ====================*/

	#modal_test {
		display: none;
	}

	.modal_opener {
		cursor: pointer;
	}

	._modalLayer_ #modal_test {
		display: block;
		position: relative;
		margin: 0;
		padding: 5rem;
		background: #fff;
		width: 100%;
		height: 100%;
		box-sizing: border-box;
		overflow-y: scroll;
	}

	._modalLayer_ {
		position: fixed;
		z-index: 200;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		box-sizing: border-box;
		background: rgba(0, 0, 0, 0.7);
	}

	._modalLayer_ ._inner_ {
		width: 100%;
		height: 100%;
		box-sizing: border-box;
		padding: 5vw;
		display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: center;
	}

	._modalLayer_ > ._close_ {
		display: block;
		position: absolute;
		z-index: 2;
		right: 1rem;
		top: 1rem;
		width: 5rem;
		height: 5rem;
		border-radius: 50%;
		border: 1px solid #fff;
		background: #b5b5b5;
		transform: rotate(45deg);
		cursor: pointer;
	}

	._modalLayer_ > ._close_::before {
		content: "";
		display: block;
		position: absolute;
		z-index: 2;
		top: 50%;
		left: .5rem;
		width: 4rem;
		height: 1px;
		background-color: #fff;
	}

	._modalLayer_ > ._close_::after {
		content: "";
		display: block;
		position: absolute;
		z-index: 2;
		top: .5rem;
		left: 50%;
		width: 1px;
		height: 4rem;
		background-color: #fff;
	}

	._modalLayer_ img {
		max-width: 100%;
		max-height: 100%;
	}


	/*==================== mobile カルーセルスライダー2 ====================*/

	/* セクション末尾に カスタマイズ例 あり */

	._carouselSlider2_ {
		/*--- border: dotted 1px palevioletred; ---*/ /*--- border for debug ---*/
		--item-width: 70vw; /* スライド1つの幅 */
		--item-height: calc(var(--item-width) * 5 / 8); /* スライドの高さ */
		--slider-width: 100% ; /* スライダーの全体幅 */
		--nav_pos: 92%;
		position: relative;
		overflow: hidden;
		width: var(--slider-width);
		height: var(--item-height);
	}

	._carouselSlider2_ ._no_anime_ {
		transition: unset !important;
	}
	
	._carouselSlider2_ ._role_ {
		transition: margin-left .5s ease-in-out, transform .5s ease-in-out; /* スワイプのインタラクションに必須 */
		display: flex;
		position: absolute;
		z-index: 2;
		left: 0;
		top: 0;
		margin: 0;
		padding: 0;
		height: var(--item-height);
	}

	._carouselSlider2_ ._role_ > li {
		/*---border: solid 1px aquamarine; ---*/ /*--- border for debug ---*/
		/* transition: transform .5s ease-in-out; */
		flex-grow: 1;
		width: var(--item-width);
		list-style: none;
		margin: 0;
		height: 100%;
        display: flex;
        justify-content: center;
	}

	._carouselSlider2_ ._role_ > li._l_,
	._carouselSlider2_ ._role_ > li._r_ {
		cursor: pointer;
	}

	._carouselSlider2_ ._role_ li .inner {
		box-sizing: border-box;
		height: 100%;
		width: 100%;
	}

	._carouselSlider2_ ._role_ img {
	}

	._carouselSlider2_ ._dots_ {
		position: absolute;
		z-index: 3;
		display: flex;
		justify-content: space-around;
		column-gap: 2rem;
		bottom: 1rem;
		left: 50%;
		transform: translateX( -50% );
	}

	._carouselSlider2_ ._dots_ span {
		width: 1rem;
		height: 1rem;
		background: #fff;
		border-radius: 50%;
	}

	._carouselSlider2_ ._dots_ span._current_ {
		transform: scale(150%);
	}

	._carouselSlider2_ ._dots_ span:first-child {
		margin-left: 0;
	}

	._carouselSlider2_ nav {
		position: absolute;
		z-index: 3;
		width: 100%;
		/* border: solid 1px green; */ /*--- border for debug ---*/
	}

	._carouselSlider2_ nav ._prev_,
	._carouselSlider2_ nav ._next_ {
		display: block;
		overflow: hidden;
		position: absolute;
		z-index: 2;
		top: calc(var(--item-height) / 3);
		width: calc(var(--item-height) / 4);
		height: calc(var(--item-height) / 3);
		cursor: pointer;
		text-indent: -10em;
		color: transparent;
		/* border: solid 1px pink; */ /*--- border for debug ---*/
	}
	
	._carouselSlider2_ nav ._prev_ {
		right: var(--nav_pos);
		transform: translateX(50%);
	}

	._carouselSlider2_ nav ._next_ {
		left: var(--nav_pos);
		transform: translateX(-50%);
	}
	
	._carouselSlider2_ nav ._prev_::after,
	._carouselSlider2_ nav ._next_::after {
		transform-origin: 50% 50%;
		content: " ";
		display: block;
		position: absolute;
		z-index: 2;
		top: 50%;
		left: 50%;
		width: 6vw;
		height: 6vw;
		border-radius: 50%;
		background: #fff;
		box-shadow:
			0 7px 5px 0 rgba(0, 0, 0, .4),
			0 5px 3px 0 rgba(0, 0, 0, .2)
		;
	}

	._carouselSlider2_ nav ._prev_::after {
		transition: transform .2s ease-in-out;
		transform: translate(-50%, -50%) scale(1, 1);
		background: #000 url(./images/slider_larr.svg) center center / 4vw 4vw  no-repeat;
	}

	._carouselSlider2_ nav ._next_::after {
		transition: transform .2s ease-in-out;
		transform: translate(-50%, -50%) scale(1, 1);
		background: #000 url(./images/slider_rarr.svg) center center / 4vw 4vw no-repeat;
	}

	._carouselSlider2_ nav ._prev_:active::after,
	._carouselSlider2_ nav ._next_:active::after {
		opacity: 0.7;
		transform: translate(-50%, -50%) scale(1.2, 1.2);
	}

	/* ---------- home フィーチャーエリア用カスタマイズ ここから ---------- */

	._carouselSlider2_.feature {
		/* border-style: solid; */ /*--- border for debug ---*/
		--cover-item-width: 90vw; /* スライド1つの幅 */
		--cover-item-height: 72rem; /* スライドの高さ */
		--cover-slider-width: 100%; /* スライダーの全体幅 */
        --cover-navui-pos-h: 105vw; /* ナビゲーションUIの親ブロック幅による位置決め */
        --cover-navout-wh: 15vw; /* ナビゲーションUIの正方サイズ */
        --cover-navui-wh: 9vw; /* ナビゲーションUIの正方サイズ */
        --cover-navico-wh: 6vw; /* ナビゲーションicoの正方サイズ */
		width:  100%;
		height: var(--cover-item-height);
	}

	._carouselSlider2_.feature ._role_ {
		transition: margin-left 1s ease-in-out, transform 1s ease-in-out; /* スワイプのインタラクションに必須 */
		height: var(--cover-item-height);
	}

	._carouselSlider2_.feature ._role_ > li {
		width: 100vw;
        text-align: left;
	}

	._carouselSlider2_.feature ._role_ > li .inner {
		box-sizing: border-box;
		transition: unset;
        padding: 0 4rem;
	}

	._carouselSlider2_.feature ._role_ > li._l_{
		position: relative;
		z-index: 1;
	}

	._carouselSlider2_.feature ._role_ > li._r_{
		position: relative;
		z-index: 1;
	}

	._carouselSlider2_.feature ._role_ > li._current_{
		position: relative;
		z-index: 2;
	}

	._carouselSlider2_.feature .container {
        display: flex;
        flex-direction: column-reverse;
        width: var(--cover-item-width);
        height: var(--cover-item-height);
        border-radius: 15px;
        overflow: hidden;
        background: #fff;
        color: #310000;
	}

    ._carouselSlider2_.feature .col {
        width: 100%;
        overflow: hidden;
    }

    ._carouselSlider2_.feature .col:first-child {
        height: 60%;
    }

    ._carouselSlider2_.feature .col:last-child {
        height: 40%;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: flex-start;
        overflow: hidden;
        position: relative;
    }

	._carouselSlider2_.feature ._role_ img {
        max-height: unset;
		height: auto;
		width: 100%;
	}

    ._carouselSlider2_.feature nav {
        width: var(--cover-navui-pos-h);
        left: calc((100vw - var(--cover-navui-pos-h)) / 2);
    }

    ._carouselSlider2_.feature nav ._prev_,
    ._carouselSlider2_.feature nav ._next_ {
        top: calc(var(--cover-item-height) / 2 - var(--cover-navout-wh) / 2);
        width: var(--cover-navout-wh);
        height: var(--cover-navout-wh);
    }

	._carouselSlider2_.feature nav ._prev_::after {
		transition: transform .2s ease-in-out;
		transform: translate(unset, unset) scale(1, 1);
        width: var(--cover-navui-wh);
        height: var(--cover-navui-wh);
		background: #000 url(./images/slider_larr.svg) center center / var(--cover-navico-wh) var(--cover-navico-wh) no-repeat;
	}

	._carouselSlider2_.feature nav ._next_::after {
		transition: transform .2s ease-in-out;
		transform: translate(unset, unset) scale(1, 1);
        width: var(--cover-navui-wh);
        height: var(--cover-navui-wh);
		background: #000 url(./images/slider_rarr.svg) center center / var(--cover-navico-wh) var(--cover-navico-wh) no-repeat;
	}

	._carouselSlider2_.feature nav ._prev_:hover::after,
	._carouselSlider2_.feature nav ._next_:hover::after {
		transform: translate(unset, unset) scale(1.2, 1.2);
	}

	._carouselSlider2_.feature nav ._prev_:active::after,
	._carouselSlider2_.feature nav ._next_:active::after {
		opacity: 0.7;
	}

	/* ---------- ここまで home フィーチャーエリア用カスタマイズ ---------- */


	/* ---------- 動画プレビュー 用カスタマイズ（mobile） ここから ---------- */

	._carouselSlider2_.class_preview {
		/* border-style: solid; */ /*--- border for debug ---*/
		--cover-item-width: 70vw; /* スライド1つの幅 */
		--cover-item-gap: 75vw; /* ギャップ調整 */
		--cover-item-height: 42rem; /* スライドの高さ */
		--cover-slider-width: 100%; /* スライダーの全体幅 */
        --cover-navui-pos-h: 100vw; /* ナビゲーションUIの親ブロック幅による位置決め */
        --cover-navout-wh: 15vw; /* ナビゲーションUIの正方サイズ */
        --cover-navui-wh: 9vw; /* ナビゲーションUIの正方サイズ */
        --cover-navico-wh: 6vw; /* ナビゲーションicoの正方サイズ */
		width:  100%;
		height: var(--cover-item-height);
	}

	._carouselSlider2_.class_preview ._role_ {
		transition: margin-left 1s ease-in-out, transform 1s ease-in-out; /* スワイプのインタラクションに必須 */
		height: var(--cover-item-height);
	}

	._carouselSlider2_.class_preview ._role_ > li {
		width: var(--cover-item-gap);
        height: 80%;
        text-align: left;
        padding-top: 4rem;
	}

	._carouselSlider2_.class_preview ._role_ > li._l_{
		position: relative;
		z-index: 1;
	}

	._carouselSlider2_.class_preview ._role_ > li._r_{
		position: relative;
		z-index: 1;
	}

	._carouselSlider2_.class_preview ._role_ > li._current_{
		position: relative;
		z-index: 2;
	}

    ._carouselSlider2_.class_preview nav {
        width: var(--cover-navui-pos-h);
        left: calc((100vw - var(--cover-navui-pos-h)) / 2);
    }

    ._carouselSlider2_.class_preview nav ._prev_,
    ._carouselSlider2_.class_preview nav ._next_ {
        top: calc(var(--cover-item-height) / 3 - var(--cover-navout-wh) / 2);
        width: var(--cover-navout-wh);
        height: var(--cover-navout-wh);
    }

	._carouselSlider2_.class_preview nav ._prev_::after {
		transition: transform .2s ease-in-out;
		transform: translate(unset, unset) scale(1, 1);
        width: var(--cover-navui-wh);
        height: var(--cover-navui-wh);
		background: #000 url(./images/slider_larr.svg) center center / var(--cover-navico-wh) var(--cover-navico-wh) no-repeat;
	}

	._carouselSlider2_.class_preview nav ._next_::after {
		transition: transform .2s ease-in-out;
		transform: translate(unset, unset) scale(1, 1);
        width: var(--cover-navui-wh);
        height: var(--cover-navui-wh);
		background: #000 url(./images/slider_rarr.svg) center center / var(--cover-navico-wh) var(--cover-navico-wh) no-repeat;
	}

	._carouselSlider2_.class_preview nav ._prev_:hover::after,
	._carouselSlider2_.class_preview nav ._next_:hover::after {
		transform: translate(unset, unset) scale(1.2, 1.2);
	}

	._carouselSlider2_.class_preview nav ._prev_:active::after,
	._carouselSlider2_.class_preview nav ._next_:active::after {
		opacity: 0.7;
	}

	._carouselSlider2_.class_preview ._role_ > li > a {
		display: block;
        width: var(--cover-item-width);
        overflow: hidden;
	}

    ._carouselSlider2_.class_preview ._role_ .tn img {
        width: 100%;
    }

    ._carouselSlider2_.class_preview ._role_ .platform img {
        width: 70px;
    }

	/* ---------- ここまで 動画プレビュー 用カスタマイズ（mobile） ---------- */
    
  
	/*==================== mobile ボタン 横並び ====================*/

	ul.buttons_horizontal {
		--pad_v: 1rem;
		--pad_h: 2rem;
		--pad_v_nega: -1rem;
		--pad_h_nega: -2rem;
		list-style: none;
		overflow: hidden;
		padding: 0;
	}

	ul.buttons_horizontal li {
		white-space: nowrap;
		float: left;
		margin: 0;
		padding: var(--pad_v) var(--pad_h);
		border: 1px solid #dadada;
	}

	ul.buttons_horizontal li > a {
		display: block;
		margin: var(--pad_v_nega) var(--pad_h_nega);
		padding: var(--pad_v) var(--pad_h);
	}

	ul.buttons_horizontal li > a:focus,
	ul.buttons_horizontal li > a:focus,
	ul.buttons_horizontal li > a:hover,
	ul.buttons_horizontal li > a:active,
	ul.buttons_horizontal li > a:active {
		background: #fff;
	}
  
	/*==================== mobile 戻るリンク ====================*/

	._history_back_ {
		cursor: pointer;
	}
	
	._history_back_.button {
		display: inline-block;
		padding: .25rem .5rem;
		background: #e5e5e5;
		border: 1px solid #b5b5b5;
		border-radius: .25rem;
		font-size: 1.3rem;
	}

	._history_back_.button:hover {
		background: #fff;
	}
	
	/*====================  mobile ページの先頭へボタン ====================*/
	
	#_scrollToTop_ {
		opacity: 1;
		transition: opacity .3s ease-out;
		position: fixed;
		z-index: 100;
		bottom: 0;
		right: 0;
	  }
	
	  #_scrollToTop_._visible_ {
		visibility: visible;
		opacity: 1;
	  }
	
	  #_scrollToTop_._hidden_ {
		visibility: hidden;
		opacity: 0;
	  }
	
	  #_scrollToTop_ + * {
		margin-top: 0;
	  }
	
	  #_scrollToTop_ p {
		display: block;
		margin: 0;
		padding: 0;
		overflow: hidden;
	  }
	
	  #_scrollToTop_ a {
		-webkit-tap-highlight-color: transparent;
		display: block;
		position: absolute;
		z-index: 2;
		right: 20px;
		bottom: 20px;
	  }
	
	  #_scrollToTop_ img {
		width: 40px;
		height: 40px;
		vertical-align: bottom;
		opacity: 0.5;
	  }
	
	  #_scrollToTop_ a:hover img {
		opacity: 0.75;
	  }
  
	/*==================== mobile 表組関連 ====================*/
  
	._x_scroll_area {
	  position: relative;
	  width: 100%;
	  overflow-x: scroll;
	}
  
	._x_scroll_area th:first-child {
	  position: sticky;
	  left: 0;
	}
  
	._x_scroll_area caption {
	  text-align: left;
	}


}