@charset "utf-8";
/* CSS Document */

.HideSP {
display: block;
}
.ShowSP {
display: none;
}

body > #Contents *,
body > #Contents *::before,
body > #Contents *::after {
  box-sizing: border-box;
}

.GridSet {
width: 100%;
}

#Contents img {
	max-width: 100%;
	height: auto;
}

.l-contents {
	background: url('../image/elemen_mv_bg.png') no-repeat 50% 0, url('../image/bg_line.png') repeat 50% 0;
	background-size: 1200px auto, auto auto;
	background-color: #FFFFFF;
	overflow: hidden;
}

/* mainvisual */
.mainvisual {
	position: relative;
	max-width: 965px;
	min-height: 814px;
	margin: 0 auto;
	padding-bottom: 0;
}
.c-elemen-mv__logo {
	position: absolute;
	top: 15px;
	left: 0;
	padding: 0;
	margin: 0;
	background: none;
	max-width: 258px;
}
.c-elemen-mv__logo span {
	background-color: transparent;
	padding: 0;
}
.c-elemen-mv__title {
	position: absolute;
	max-width: 830px;
	width: clamp(490px, calc(490px + 340 * ((100vw - 768px) / 507)), 830px);;
	height: auto;
	margin: 0 auto;
	right: auto;
	left: 15px;
	bottom: 15px;
}
.c-elemen-mv__speechbubble{
	position: absolute;
	max-width: 466px;
	width: clamp(390px, calc(390px + 76 * ((100vw - 768px) / 507)), 466px);;
	height: auto;
	margin: 0 auto;
	right: 5px;
	bottom: 350px;
}

@media screen and (min-width: 2001px) {
	.l-contents {
		background: #fff url('../image/elemen_mv_bg.png') no-repeat 50% 0;
		background-size: 100% auto;
	}
}

@media screen and (max-width: 994px) {
	.l-contents {
		margin-left: -15px;
		margin-right: -15px;
		padding-left: 15px;
		padding-right: 15px;
	}
}



@media print {
	.l-contents {
		background: #fff url('../image/elemen_mv_bg.png') no-repeat 50% 0;
		background-size: 1200px auto;
		width: 100%;
		zoom: 0.8;
	}
}

.c-elemen-inner {
    max-width: 965px;
    margin: 0 auto;
}

/*group*/
.group01, .group02, .group03, .group04, .group05, .group06 {
	position: relative;
	padding: 0;
}

.group01 .c-elemen-inner {
	padding: 47px 0;
}
.c-elemen-group01__title {
	text-align: center;
	position: relative;
}
.c-elemen-group01__title::before{
display: block;
content: "";
width: 93px;
height: 90px;
background: url("../image/01_title_star.png") center top no-repeat;
background-size: contain;
position: absolute;
bottom: 0;
left: 33px;
}
.c-elemen-group01__movie {
	padding: 15px 15px 6px;
	background-color: #FFFFFF;
	box-shadow: 3px 3px 2px rgba(0 0 0 / 30%);
	max-width: 814px;
	margin: 0 auto 140px;
}
.c-elemen-group-movie__youtube {
	width: 100%;
  aspect-ratio: 16 / 9;
}
.c-elemen-group-movie__youtube iframe {
	width: 100%;
	height: 100%;
}


.group02 .c-elemen-inner,
.group06 .c-elemen-inner{
	padding: 0;
	max-width: 1200px;
}
.group03 .c-elemen-inner,
.group04 .c-elemen-inner,
.group05 .c-elemen-inner {
	padding: 40px 0;
}
.c-elemen-group02__title,
.c-elemen-group04__title,
.c-elemen-group06__title {
	margin: 0 0 0 -15px;
	max-width: 980px;
}
.c-elemen-group03__title{
max-width: 937px;
height: auto;
margin: 0 auto;
}
.c-elemen-group04__title2{
max-width: 646px;
height: auto;
margin: 0 auto 20px;
}
.c-elemen-group04__photo02{
max-width: 965px;
height: auto;
margin: 0 auto 80px;
}

.c-elemen-group05__title{
	margin: 0 0 0 -15px;
	max-width: 950px;
}

.group05 .c-elemen-inner {
	padding: 100px 0 40px;
}
.group05 {
	background: url("../image/05_bg_tile.png") left top repeat;
	padding-bottom: 120px;
}
.c-elemen-group05__photo01{
max-width: 880px;
height: auto;
margin: 0 auto 20px;
}
.c-elemen-group05__photo01 img{
margin-left: 36px;
}
.c-elemen-group05__textSet{
display: flex;
flex-direction: column;
gap: 32px;
max-width: 725px;
margin: 0 auto;
}
.c-elemen-group05__text{
max-width: 725px;
margin-left: 36px;
}
.group06 .c-elemen-inner{
position: relative;
}
.c-elemen-group06__title{
position: absolute;
bottom: 40px;
left: 50%;
transform: translateX(-50%);
max-width: 989px;
width: clamp(600px, calc(600px + 389 * ((100vw - 768px) / 507)), 989px);
}
.c-elemen-group06__photo02{
position: absolute;
top: clamp(-110px, calc(-73px + 37 * ((100vw - 768px) / 507)), -110px);;
left: 40px;
max-width: 482px;
width: clamp(210px, calc(210px + 272 * ((100vw - 768px) / 507)), 482px);
height: auto;
}



.c-elemen-photoset {
display: -webkit-box;
display: flex;
-webkit-box-align: center;
align-items: center;
}
.c-elemen-photoset .c-elemen-group__photo {
width: 55.2%;
aspect-ratio: 532 / 324;
}
.c-elemen-photoset .c-elemen-group__text {
width: 44.8%;
padding-left: 25px;
}

.c-elemen-group03__photo01 {
margin-bottom: 50px;
}
.c-elemen-group03__photo01_sp {
margin-bottom: 100px;
margin-left: -15px;
margin-right: -15px;
}
.c-elemen-group04__photo01{
background-color: #C9CACA;
margin: 0 calc(50% - 50vw) 50px;
padding: 30px calc(50vw - 50%);

}
.c-elemen-group04__photo01__inner{
position: relative;
}
.c-elemen-group04__photo01__title{
position: absolute;
left: 0;
top: 0;
z-index: 2;
max-width: 391px;
}

.c-elemen-group04__photo02{
display: flex;
flex-direction: row;
gap: 10px;
max-width: 964px;
}
.c-elemen-group04__photo02 img.HideSP{
width: calc((100% - 20px) / 3);
}

.c-elemen-group05__title,
.c-elemen-group06__title {
margin-bottom: 15px;
}

@media screen and (max-width: 994px) {
	.group01, .group02, .group03, .group04, .group05 {
		margin-left: -15px;
		margin-right: -15px;
		padding-left: 15px;
		padding-right: 15px;
	}
	.group06 {
		margin: -15px;
		padding: 0;
	}
}


@media screen and (max-width: 767px) {
.HideSP,
img.HideSP {
display: none;
}
.ShowSP {
display: block;
}
	.JS #Contents {
		padding: 0;
	}
	.JS .GridSet {
		margin: 0;
	}
	.JS .Grid4 {
		padding: 0;
	}
	.l-contents {
		margin-left: 0;
		margin-right: 0;
		background-size: 100% auto;
	}

	/* mainvisual */
	.mainvisual {
		min-height: 59vw;
		margin: 0 auto;
		padding-bottom: 0;
		height: 224px;
	}
	.JS h2.c-elemen-mv__logo {
		margin: 0;
		width: 25vw;
		top: 2vw;
	}
	.c-elemen-mv__title {
		width: 265px;
		bottom: 0.5vw;
right: auto;
		z-index: 1;
	}
.c-elemen-mv__speechbubble{
max-width: 142px;
bottom: 102px;
}

.l-contents {
background: url(../image/elemen_mv_bg_sp.png) no-repeat 50% 0, url(../image/bg_line.png) repeat 50% 0;
background-size: 100% auto, auto auto;
}

.group01 .c-elemen-inner,
.group02 .c-elemen-inner,
.group03 .c-elemen-inner,
.group04 .c-elemen-inner,
.group05 .c-elemen-inner{
padding: 20px 0;
}

.c-elemen-group01__title::before{
display: none;
}
.c-elemen-group01__title{
max-width: 330px;
margin: 0 auto 10px;
}
.c-elemen-group01__movie {
padding: 5px;
margin: 0 auto 40px;
}
.c-elemen-group-movie__youtube{
display:flex;
align-items: end;
list-style: 100%;
}

.c-elemen-group02_image{
margin-left: -15px;
margin-right: -15px;
}

.c-elemen-group03__photo01_sp {
margin: 0 -15px;
}

.c-elemen-group04__title{
margin-bottom: 20px;
}
.c-elemen-group04__photo02{
flex-direction: column;
gap: 32px;
}
.c-elemen-group04__photo01__title{
max-width: 240px;
top: -15px;
}


.group05 {
padding-bottom: 220px;
}
.c-elemen-group05__title {
margin: 0 0 25px;
}
.c-elemen-group05__photo01 img {
margin-left: 0;
}
.c-elemen-group05__textSet {
gap: 15px;
}
.c-elemen-group05__text {
margin-left: 0;
}

.group06{
background-color: #FFFFFF;
}
.group06 .c-elemen-inner {
padding: 0 0  500px;
width: 100%;
}
.c-elemen-group06__title {
position: absolute;
top: 80px;
left: 50%;
transform: translateX(-50%);
width: 100%;
margin: 0;
}
.c-elemen-group06__photo02 {
top: -160px;
left: 40px;
width: 270px;
height: 200px;
}
.c-elemen-group06__photo02 img{
width: 100%;
height: auto;
}

}
@media screen and (max-divice-width: 767px) {
.group06 .c-elemen-inner {
padding: 0 0 350px;
}
}