.slider-container { transition: all 1s ease 0s; overflow: hidden; }
.slider-container .bg-screen { width: 100%; height: 0%; background-color: #71756C; position: fixed; top: 50%; left: 0; transform: translateY(-50%); }

.slider-note { text-align: center; font-size: 1rem; }
.slider-note.posBL { position: absolute; bottom: 10px; left: 10px; }
.slider-note.posBR { position: absolute; bottom: 10px; right: 10px; }
.slider-note.txtW { color: #FFF; }

.splide { margin: 0 auto; }
.splide .splide-wrapper { margin-bottom: 3rem; }
.splide .splide__track .splide__list .splide__slide .splide__cell { position: relative; width: calc(80% - 200px); max-width: 800px; margin: 0 auto; display: flex; justify-content: space-between; align-items: center; cursor: pointer; }
.splide .splide__track .splide__list .splide__slide .splide__cell img { width: 100%; height: auto; }
.splide .splide__track .splide__list .splide__slide .splide__cell .slide-visual { width: calc(730 / 1164 * 100%); }
.splide .splide-wrapper { position: relative; }
.splide .splide__arrows .splide__arrow { width: 100px; height: 30px; border: none; border-radius: 5px; background-size: contain; background-position: center center; background-repeat: no-repeat; transition: 0.3s linear 0s background , 0.3s ease-out 0s left, 0.3s ease-out 0s right; position: absolute; top: 50%; transform: translateY(-50%); cursor: pointer; z-index: 100; }
.splide .splide__arrows .splide__arrow::after, .splide .splide__arrows .splide__arrow::before { content: ""; width: 80px; height: 80px; border-radius: 50%; border: 1px solid #fff; position: absolute; top: 50%; transform: translate(-50%, -50%); }
.splide .splide__arrows .splide__arrow::after { pointer-events: none; transition: scale 0.3s ease 0s; transform-origin: 0% 0%; }
.splide .splide__arrows .splide__arrow::before { border: none; opacity: 0; }
.splide .splide__arrows .splide__arrow.is-active::after, .splide .splide__arrows .splide__arrow:hover::after { scale: 1.3 1.3; }
.splide .splide__arrows .splide__arrow.splide__arrow--prev { left: 10%; transform: translateX(-50%); background-image: url("../js/splide/img/slide-arrow-prev.png"); }
.splide .splide__arrows .splide__arrow.splide__arrow--prev::after, .splide .splide__arrows .splide__arrow.splide__arrow--prev::before { left: 0%; }
.splide .splide__arrows .splide__arrow.splide__arrow--next { right: 10%; transform: translateX(50%); background-image: url("../js/splide/img/slide-arrow-next.png"); }
.splide .splide__arrows .splide__arrow.splide__arrow--next::after, .splide .splide__arrows .splide__arrow.splide__arrow--next::before { right: -75%; }
.splide .splide__pagination { padding: 0 2rem; width: 90%; max-width: 600px; margin: 0 auto; display: flex; justify-content: center; gap: 2%; align-items: flex-start; }
.splide .splide__pagination li { width: 14%; margin-bottom: 1rem; }
.splide .splide__pagination li button { width: 100%; border: none; overflow: hidden; transition: 0.3s ease 0s width; padding: 2px 0; vertical-align: top; position: relative; background-color: #000; }
.splide .splide__pagination li button::after { content: ""; display: block; width: 100%; padding-bottom: 50%; }
.splide .splide__pagination li button::before { content: ""; font-size: 12px; display: inline-block; color: #fff; word-wrap: normal; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-position: center center; background-size: cover; opacity: 0.3; transition: opacity 0.3s ease 0s; }
.splide .splide__pagination li button.is-active::before { opacity: 1; }
@media screen and (max-width: 1000px) { .splide .splide__arrows .splide__arrow { width: 70px; height: 30px; }
  .splide .splide__arrows .splide__arrow::after, .splide .splide__arrows .splide__arrow::before { width: 60px; height: 60px; }
  .splide .splide__arrows .splide__arrow.splide__arrow--prev { left: 15%; }
  .splide .splide__arrows .splide__arrow.splide__arrow--prev::after, .splide .splide__arrows .splide__arrow.splide__arrow--prev::before { left: 0%; }
  .splide .splide__arrows .splide__arrow.splide__arrow--next { right: 15%; }
  .splide .splide__arrows .splide__arrow.splide__arrow--next::after, .splide .splide__arrows .splide__arrow.splide__arrow--next::before { right: -85%; } }
@media screen and (max-width: 600px) { .splide .splide__track .splide__list .splide__slide .splide__cell { width: calc(100% - 140px); justify-content: center; flex-wrap: wrap; flex-direction: row; position: relative; }
  .splide .splide__track .splide__list .splide__slide .splide__cell .slide-txt { max-width: 400px; order: 2; margin: 0% auto; }
  .splide .splide__track .splide__list .splide__slide .splide__cell .slide-visual { width: 60%; max-width: 400px; order: 1; margin-bottom: 1rem; }
  .splide .splide__arrows .splide__arrow { width: 70px; height: 30px; }
  .splide .splide__arrows .splide__arrow::after, .splide .splide__arrows .splide__arrow::before { width: 60px; height: 60px; }
  .splide .splide__arrows .splide__arrow.splide__arrow--prev { left: 12%; }
  .splide .splide__arrows .splide__arrow.splide__arrow--prev::after, .splide .splide__arrows .splide__arrow.splide__arrow--prev::before { left: 0%; }
  .splide .splide__arrows .splide__arrow.splide__arrow--next { right: 12%; }
  .splide .splide__arrows .splide__arrow.splide__arrow--next::after, .splide .splide__arrows .splide__arrow.splide__arrow--next::before { right: -85%; } }

.slide-modal-close { position: fixed; z-index: 10001; top: 0; right: 0; width: 60px; pointer-events: none; cursor: pointer; transform: translateY(-100%); transition: transform 0.3s ease 0s; }
.slide-modal-close img { width: 100%; height: auto; }
.slide-modal-close.active { transform: translateY(0%); pointer-events: auto; transition-delay: 0.5s; }
@media screen and (max-width: 600px) { .slide-modal-close { width: 50px; } }

.modal-mode { z-index: 10000; position: fixed; top: 0; left: 0; width: 100%; height: 100%; }
.modal-mode .splide { margin: 0 auto; }
.modal-mode .splide .splide__track .splide__list .splide__slide .splide__cell { position: relative; width: calc(80% - 100px); max-width: none; min-height: 100vh; margin: 0 auto; cursor: auto; }
.modal-mode .splide .splide__track .splide__list .splide__slide .splide__cell .cell-more { display: none; }
.modal-mode .splide .splide__track .splide__list .splide__slide .splide__cell img { width: 100%; height: auto; }
.modal-mode .splide .splide__arrows .splide__arrow.splide__arrow--prev { left: 4%; }
.modal-mode .splide .splide__arrows .splide__arrow.splide__arrow--next { right: 4%; }
.modal-mode .splide .splide__pagination { position: fixed; bottom: 2rem; left: 50%; transform: translateX(-50%); width: 90%; }
@media screen and (max-width: 1300px) { .modal-mode .splide .splide__arrows .splide__arrow.splide__arrow--prev { left: 55px; }
  .modal-mode .splide .splide__arrows .splide__arrow.splide__arrow--next { right: 55px; } }
@media screen and (max-width: 600px) { .modal-mode .splide .splide__track .splide__list .splide__slide .splide__cell { width: 100%; }
  .modal-mode .splide .splide__track .splide__list .splide__slide .splide__cell .txt-area { width: calc(100% - 140px) !important; margin: 0 auto; }
  .modal-mode .splide .splide__track .splide__list .splide__slide .splide__cell .img-area { width: calc(100% - 100px) !important; margin: 0 auto; }
  .modal-mode .splide .splide__track .splide__list .splide__slide .splide__cell .slide-txt { width: 90%; margin: 0% auto; }
  .modal-mode .splide .splide__track .splide__list .splide__slide .splide__cell .slide-visual { width: 100%; }
  .modal-mode .splide { /*.splide__arrows{
	.splide__arrow{
		&.splide__arrow--prev{
			top:auto;
			bottom: 5rem;
		}
		&.splide__arrow--next{
			top:auto;
			bottom: 5rem;
		}
	}
}*/ }
  .modal-mode .splide .splide__track .splide__list .splide__slide .splide__cell { width: 100%; }
  .modal-mode .splide .splide__track .splide__list .splide__slide .splide__cell .slide-txt { width: 100%; margin: 0; }
  .modal-mode .splide .splide__track .splide__list .splide__slide .splide__cell .slide-visual { width: 90%; max-width: none; margin-bottom: 2vh; }
  .modal-mode .splide .splide__track .splide__list .splide__slide .splide__cell .slide-visual .img { height: 32vh; }
  .modal-mode .splide .splide__track .splide__list .splide__slide .splide__cell .slide-visual .img img { object-fit: cover; object-position: center center; width: 100%; height: 100%; } }

#splide01.splide .cell-01 .splide__cell .slide-visual img { object-position: center bottom; }
#splide01.splide .cell-03 .splide__cell .slide-visual img { object-position: center bottom; }
#splide01.splide .splide__pagination li:nth-child(1) button::before { background-image: url("../img/concept/comfort01.jpg"); }
#splide01.splide .splide__pagination li:nth-child(2) button::before { background-image: url("../img/concept/comfort02.jpg"); }
#splide01.splide .splide__pagination li:nth-child(3) button::before { background-image: url("../img/concept/comfort03.jpg"); }
#splide01.splide .splide__pagination li:nth-child(4) button::before { background-image: url("../img/concept/comfort04.jpg"); }
#splide01.splide .splide__pagination li:nth-child(5) button::before { background-image: url("../img/concept/comfort05.jpg"); }
#splide01.splide .splide__pagination li:nth-child(6) button::before { background-image: url("../img/concept/comfort06.jpg"); }

#splide02.splide .cell-01 .splide__cell .slide-visual img { object-position: center bottom; }
#splide02.splide .cell-03 .splide__cell .slide-visual img { object-position: center bottom; }
#splide02.splide .cell-05 .splide__cell .slide-visual img { object-position: center top; }
#splide02.splide .splide__pagination li:nth-child(1) button::before { background-image: url("../img/concept/open01.jpg"); }
#splide02.splide .splide__pagination li:nth-child(2) button::before { background-image: url("../img/concept/open02.jpg"); }
#splide02.splide .splide__pagination li:nth-child(3) button::before { background-image: url("../img/concept/open03.jpg"); }
#splide02.splide .splide__pagination li:nth-child(4) button::before { background-image: url("../img/concept/open04.jpg"); }
#splide02.splide .splide__pagination li:nth-child(5) button::before { background-image: url("../img/concept/open05.jpg"); }
#splide02.splide .splide__pagination li:nth-child(6) button::before { background-image: url("../img/concept/open06.jpg"); }

#splide03.splide .cell-01 .splide__cell .slide-visual img { object-position: center top; }
#splide03.splide .splide__pagination li:nth-child(1) button::before { background-image: url("../img/concept/smart01.jpg"); }
#splide03.splide .splide__pagination li:nth-child(2) button::before { background-image: url("../img/concept/smart02.jpg"); }
#splide03.splide .splide__pagination li:nth-child(3) button::before { background-image: url("../img/concept/smart03.jpg"); }
#splide03.splide .splide__pagination li:nth-child(4) button::before { background-image: url("../img/concept/smart04.jpg"); }
#splide03.splide .splide__pagination li:nth-child(5) button::before { background-image: url("../img/concept/smart05.jpg"); }
#splide03.splide .splide__pagination li:nth-child(6) button::before { background-image: url("../img/concept/smart06.jpg"); }