@charset "utf-8";

/* common */
@media screen and (max-width: 1200px) {
	body {
		width: 1200px;
		margin: 0 auto;
	}
}
.main-inner {
	position: relative;
	z-index: 4000;
	max-width: 1920px;
	margin: 0 auto;
}
.main-inner img {
	line-height: 0.1;
	-webkit-backface-visibility: hidden;
	image-rendering: -webkit-optimize-contrast;
}
.cnt__inner {
	max-width: 1500px;
  width: calc( 1500 / 1920 * 100% );
	margin: 0 auto;
	position: relative;
}
.ani-rotateIn,
.ani-fadeInDown,
.ani-fadeInUp,
.ani-fadeInLeft,
.ani-fadeInRight,
.ani-fadeIn {
	opacity: 0;
}
.onlySp {
  display: none;
}

/* a.btnOver */
a.btnOver {
	display: inline-block;
}
a.btnOver img {
	transition: all .3s ease;
}
a.btnOver:hover img {
	opacity: .0;
}

@media screen and (min-width: 1500px) {

	/* common */
	body {
		overflow-x: hidden;
	}
	.main-inner {
		position: relative;
		left: 50%;
		margin-left: -960px;
		width: 1920px;
	}
	.cnt__inner {
		margin: 0 auto;
		position: relative;
	}
}

/* .mv */
.mv .cnt__inner {
	max-width: none;
  width: 100%;
}
.mv h2 {
  display: flex;
  width: 100%;
  overflow: hidden;
  margin: calc( 60 / 1920 * 100vw ) 0;
}
.mv h2 img {
  max-width: 4560px;
  width: auto;
  height: calc( 490 / 1920 * 100vw );
  aspect-ratio: 4560 / 490;
}
.mv h2 img:first-child {
    animation: loop1 130s -65s linear infinite
}
.mv h2 img:last-child {
    animation: loop2 130s linear infinite
}
@keyframes loop1 {
    0% {
        transform: translate(100%)
    }
    to {
        transform: translate(-100%)
    }
}
@keyframes loop2 {
    0% {
        transform: translate(0)
    }
    to {
        transform: translate(-200%)
    }
}

/* .menu */
.menu {
}
.menu .popup__cover {
  display: none;
}
.menu.fixed {
}
.menu.fixed .cnt__inner {
	position: fixed;
	bottom: 0;
	width: 100%;
	z-index: 9999;
  animation: fade .5s linear;
}
@keyframes fade {
    0% {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}
.menu .cnt__inner {
	background: url("../images/bg-menu-01.png") center center no-repeat;
	max-width: 688px;
  aspect-ratio: 688 / 170;
  position: relative;
  left: 50%;
  margin-left: -344px;
}
.menu p.menu__acc {
	display: none;
}
.menu ul {
	width: 100%;
	margin: 0 auto;
  padding: 73px 0 0 90px;
  box-sizing: border-box;
	display: flex;
	justify-content: center;
	align-items: center;
	position: relative;
}
.menu ul li + li {
	margin-left: 80px;
}
.menu ul li:nth-child(1) a {
	background: url("../images/btn-menu-01_on.png") left center / 100% auto no-repeat;
}
.menu ul li:nth-child(2) a {
	background: url("../images/btn-menu-02_on.png") left center / 100% auto no-repeat;
}
.menu ul li:nth-child(3) a {
	background: url("../images/btn-menu-03_on.png") left center / 100% auto no-repeat;
}

/* .movie */
.movie {
	background: url("../images/bg-movie-01.jpg") center top / cover no-repeat;
  aspect-ratio: 1920 / 1176;
}
.movie .cnt__inner {
	text-align: center;
	padding: calc( 159 / 1920 * 100% ) 0 0;
	font-size: 0;
	box-sizing: border-box;
}
.movie h2 {
	width: calc( 453/ 1500 * 100% );
	box-sizing: border-box;
	margin: 0 0 calc( 57 / 1500 * 100% ) calc( 210 / 1500 * 100% );
	line-height: 0.1
}
.movie iframe {
	width: 100%;
	height: auto;
	aspect-ratio: 16 / 9;
}
.movie ul {
  width: calc( 1120 / 1500 * 100% );
  margin: 0 auto calc( 171 / 1500 * 100% );
}
.movie ul li {
	display: inline-block;
	width: calc( 520 / 1120 * 100% );
  margin: 0 calc( 20 / 1120 * 100% );
}
.movie ul li a {
	display: block;
}
.movie ul li p {
  width: calc( 456 / 520 * 100% );
	margin: calc( 39 / 520 * 100% ) auto 0 0;
}
.movie .movie__mv01 a {
	background: url("../images/btn-movie-01_on.jpg") center top / 100% auto no-repeat;
}
.movie .movie__mv02 a {
	background: url("../images/btn-movie-01_on.jpg") center top / 100% auto no-repeat;
}
.movie .movie__mv03 a {
	background: url("../images/btn-movie-03_on.jpg") center top / 100% auto no-repeat;
}
.movie .movie__mv04 a {
	background: url("../images/btn-movie-04_on.jpg") center top / 100% auto no-repeat;
}
.movie .movie__mv05 a {
	background: url("../images/btn-movie-05_on.jpg") center top / 100% auto no-repeat;
}
.movie .movie__mv06 a {
	background: url("../images/btn-movie-06_on.jpg") center top / 100% auto no-repeat;
}
.movie .movie__mv07 a {
	background: url("../images/btn-movie-07_on.jpg") center top / 100% auto no-repeat;
}
.movie .slide {
  box-sizing: border-box;
  overflow: hidden;
}
.movie .slide .swiper {
  overflow: visible;
  width: calc( 1120 / 1500 * 100% );
  margin: 0 auto;
  padding-bottom: calc( 69 / 1500 * 100% );
}
.movie .slide .swiper {
  padding-bottom: calc( 60 / 1172 * 100% );
}
.movie .swiper-slide {
  width: calc( 370 / 1120 * 100% );
  padding: 0 calc( 20 / 1120 * 100% ) 0;
  box-sizing: border-box;
  margin-right: 0;
  position: relative;
}
.movie .swiper-slide a {
  display: block;
  margin-bottom: calc( 38 / 370 * 100% );
}
.movie .slide .swiper-pagination {
  display: none;
}
.movie .slide .swiper-wrapper {
  display: flex;
}
.movie .swiper-horizontal>.swiper-scrollbar {
  position: absolute;
  left: calc( 330 / 1120 * 100% );
  bottom: 0;
  z-index: 50;
  height: 5px;
  width: calc( 420 / 1120 * 100% );
  border-radius: 10px;
  background: #015541;
  margin: calc( 63 / 1120 * 100% ) auto 0;
}
.movie .swiper-scrollbar-drag {
  height: 100%;
  width: 100%;
  position: relative;
  background: #d6c083;
  border-radius: 10px;
  left: 0;
  top: 0;
}

/* .product */
.product {
	background: url("../images/bg-product-01.jpg") center top / 100% auto no-repeat;
  aspect-ratio: 1920 / 1684;
}
.product .cnt__inner {
	padding:  calc( 133 / 1920 * 100% ) 0;
  text-align: left;
}
.product h2 {
	width: calc( 408 / 1500 * 100% );
	margin: 0 auto calc( 110 / 1500 * 100% ) calc( 210 / 1500 * 100% );
}
.product .product__list {
  display: flex;
  justify-content: center;
}
.product .product__list dl {
	width: calc( 447 / 1500 * 100% );
  aspect-ratio: 447 / 600;
	position: relative;
  margin-left: calc( -220 / 1500 * 100% );
  z-index: 100;
}
.product .product__list dl + dl {
  margin-left: calc( -93 / 1500 * 100% );
  z-index: 99;
}
.product .product__list dl dt {
	width: calc( 154 / 447 * 100% );
  margin: calc( -35 / 600 * 100% ) 0 calc( 30 / 600 * 100% ) calc( 271 / 447 * 100% );
}
.product .product__list dl + dl dt {
	width: calc( 157 / 447 * 100% );
  margin: calc( -35 / 600 * 100% ) 0 calc( 30 / 600 * 100% ) calc( 265 / 447 * 100% );
}
.product .product__list dl dt + dd {
	width: calc( 160 / 447 * 100% );
  margin: 0 0 0 calc( 268 / 447 * 100% );
}
.product .product__list dl dt + dd a {
  background: url("../images/btn-product-01_on.png") center top / 100% auto no-repeat;
}
.product dl.premium {
  width: calc( 1200 / 1500 * 100% );
  margin: 0 auto;
  position: relative;
}
.product dl dd.product__list-img01 {
	width: calc( 162 / 1200 * 100% );
	position: absolute;
	left: calc( 260 / 1200 * 100% );
	top: calc( 87 / 700 * 100% );
}
.product dl dd.product__list-btn01 {
	width: calc( 368 / 1200 * 100% );
	position: absolute;
	left: calc( 515 / 1200 * 100% );
	bottom: calc( 78 / 700 * 100% );
}
.product dl dd.product__list-btn01 a {
	display: block;
	background: url("../images/btn-product-02_on.png") center top / 100% auto no-repeat;
}

/* .reason */
.reason {
	background: url("../images/bg-reason-01.jpg") center top / 100% auto no-repeat;
  aspect-ratio: 1920 / 2360;
}
.reason .cnt__inner {
	text-align: center;
	padding: calc( 154 / 1920 * 100% ) 0 calc( 57 / 1920 * 100% );
	box-sizing: border-box;
}
.reason .slide + .cnt__inner {
  padding: calc( 174 / 1920 * 100% ) 0 0;
}
.reason h2 {
	width: calc( 470 / 1500 * 100% );
	margin: 0 auto 0 calc( 270 / 1500 * 100% );
}
.reason .slide {
  width: 100%;
  margin: 0 auto;
  box-sizing: border-box;
  overflow: hidden;
}
.reason .slide .swiper {
  overflow: visible;
  width: calc( 1500 / 1920 * 100% );
  margin: 0 auto;
  padding-bottom: calc( 63 / 1500 * 100% );
}
.reason .swiper-slide {
  width: calc( 1000 / 1500 * 100% );
  padding: 0 calc( 20 / 1500 * 100% ) 0;
  box-sizing: border-box;
  margin-right: 0;
  position: relative;
}
.reason .slide .swiper-pagination {
  display: none;
}
.reason .slide .swiper-wrapper {
  display: flex;
}
.reason .swiper-horizontal>.swiper-scrollbar {
  position: absolute;
  left: 50%;
  bottom: 0;
  z-index: 50;
  height: 5px;
  width: calc( 180 / 1500 * 100% );
  border-radius: 10px;
  background: #015541;
  margin: calc( 63 / 1500 * 100% ) auto 0 calc( -180 / 2 / 1500 * 100% );
}
.reason .swiper-scrollbar-drag {
  height: 100%;
  width: 100%;
  position: relative;
  background: #d6c083;
  border-radius: 10px;
  left: 0;
  top: 0;
}
.reason h3 {
  width: calc( 944 / 1500 * 100% );
  margin: 0 0 calc( 93 / 1500 * 100% ) calc( 251 / 1500 * 100% );
}
.reason p.reason__about {
	width: calc( 1080 / 1500 * 100% );
  margin: 0 auto;
}

/* .ambition */
.ambition {
	background: url("../images/bg-ambition-01.jpg") center top / 100% auto no-repeat;
  aspect-ratio: 1920 / 857;
  margin-bottom: 50px;
}
.ambition .cnt__inner {
	text-align: center;
	padding: calc( 73 / 1920 * 100% ) 0 0;
	box-sizing: border-box;
}
.ambition h2 {
	width: calc( 390 / 1500 * 100% );
	margin: 0 0 calc( 58 / 1500 * 100% ) calc( 210 / 1500 * 100% );
}
.ambition p {
	width: calc( 1082 / 1500 * 100% );
  margin: 0 auto;
}


/* .fixedBtn */
.fixedBtn {
  display: none;
	position: fixed;
	right: 0;
	bottom: 0;
	width: calc( 320 / 1500 * 100% );
	max-width: 320px;
	z-index: 10000;
}
.fixedBtn a {
	background: url("../images/btn-fixed-01_on.png") left top / 100% auto no-repeat;
}
@media screen and (min-width: 1500px) {
	.fixedBtn {
		width: 482px;
	}
}

/* .popup */
.popup {
	height: 100vh;
	width: 100%;
	position: fixed;
	left: 0;
	top: 0;
	z-index: 20000;
	display: none;
}
.popup .popup__cover {
	background-color: rgba(0, 0, 0, 0.8);
	height: 100vh;
	width: 100%;
	position: fixed;
	left: 0;
	top: 0;
	z-index: 21000;
	cursor: pointer;
}
.popup .popup__wrap {
	display: flex;
	justify-content: center;
	align-items: center;
	height: 100vh;
	width: 100%;
}
.popup .popup__inner {
	width: calc( 820 / 960 * 100% );
	max-width: 820px;
	box-sizing: border-box;
	margin: auto;
	max-height: 90vh;
	z-index: 22000;
	position: relative;
}
.popup.cm .popup__inner {
	width: calc( 720 / 960 * 100% );
	max-width: 1280px;
}
.popup.short .popup__inner {
	width: auto;
  height: 80vh;
  aspect-ratio: 9 /16;
}
.popup iframe {
	width: 100%;
	height: auto;
	aspect-ratio: 16 / 9;
}
.popup.short iframe {
	aspect-ratio: 9 / 16;
}
.popup .popup__close {
	position: absolute;
	right: -20px;
	top: -16px;
	cursor: pointer;
	width: 46px;
	height: 46px;
}
