/*  charset ==================================================== */
@charset "utf-8";

/* =========================================================
  common
========================================================== */
body#lp_gold {
  font-family: "Ryumin Bold KL", "リュウミン B-KL", "Times New Roman", "游明朝", YuMincho, "ヒラギノ明朝 Pro W6","Hiragino Mincho Pro","HGS明朝B", serif;
  font-size: 1.8rem;
  font-size: 18px;
  line-height: 2;
  overflow: hidden;
}
.rela {
  position: relative;
}
.contents {
  max-width: 1280px;
  margin: 0 auto;
}
.midashi {
  font-size: 3.0rem;
  text-align: center;
  padding-bottom: 16px;
}
.midashi_s {
  font-size: 2.4rem;
  text-align: center;
  padding-bottom: 16px;
}
/*obi*/
.obi{
	width: 100%;
	text-align: center;
	background: url(../images/obi-bg_.png) no-repeat center bottom / auto;
}
/*
@media screen and (max-width: 960px) {
	.obi{
		background-size: auto 100%;
	}
}*/

.obi.noImage{
	position: relative;
}

.obiImage{
	position: relative;
	text-align: center;
	z-index: 1;
}
.obiImage.hukidashi::after{
	position: absolute;
	left: 0;
	right: 0;
	margin: 0 auto;
	display: block;
	background: url(../images/obi-bg_.png) no-repeat center bottom / auto;
	clip-path: polygon(0 0, 100% 0%, 50% 100%);
	content: "";
}
@media screen and (min-width: 961px) {
	.obiImage.hukidashi::after{
		bottom: calc(-36px + 1px);
		width: 36px;
		height: 36px;
	}
}
@media screen and (max-width: 960px) {
	.obiImage.hukidashi::after{
		bottom: calc(-4vw + 1px);
		width: 4vw;
		height: 4vw;
	}
}
.obiImage img{
	position: relative;
	z-index: 2;
}
.obiImage .obi {
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
	display: block;
	margin: 0 auto;
	width: 100%;
	content: "";
}
@media screen and (min-width: 961px) {
	.obiImage .obi {
		height: 183px;
	}
}
@media screen and (max-width: 960px) {
	.obiImage .obi {
		height: 65%;
	}
}
.obi.noImage::before,
.obi.noImage::after,
.obiImage .obi::before,
.obiImage .obi::after{
	position: absolute;
	bottom: 0;
	display: block;
	width: calc(50% - 625px);
	height: 100%;
	content: "";
}
.obi.noImage::before,
.obiImage .obi::before{
	left: 0;
	background: url(../images/obi-bg-pattern-left.png) repeat-x right bottom / auto;
}
.obi.noImage::after,
.obiImage .obi::after{
	right: 0;
	background: url(../images/obi-bg-pattern-right.png) repeat-x left bottom / auto;
}
/*obi_s*/
.obi_s{
	text-align: center;
}
@media screen and (min-width:571px) {
	.obi_s{
		background: url(../images/obi_gold.png) center top repeat-x;
	}
	.gothic {
	  font-family: var(--gothic);
	}
	.white {
	  color: #FFF;
	}
	.red {
	  color: #9D1D22;
	}
	.kai {
	  display: none;
	}
}
@media screen and (max-width:430px) {
  body#lp_gold {
    font-size: 3.6vw;
  }
  .midashi {
    font-size: 4.4vw;
    padding-bottom: 16px;
  }
  .midashi_s {
    font-size: 4vw;
    padding-bottom: 16px;
  }
}

/*cv*/
#cv,#cv2,#cv3 {
	padding: 2em 0 3em;
	background: #fff;
	text-align: center;
}
@media screen and (max-width:960px) {
	#cv,#cv2,#cv3 {
		padding: 2rem 4% 3rem;
	}
}
#cv a,#cv2 a,#cv3 a,
#cv form input,#cv2 form input,#cv3 form input{
	display: block;
	margin: 0 auto;
	/* width: 690px; */
	width: fit-content;
	max-width: 100%;
}

/* =========================================================
  main
========================================================== */
/*ロゴ*/
.mv-ribbon{
	position: absolute;
	top: 0;
	left: 0;
	z-index: 1;
}
.mv-ribbon a{
	display: block;
	width: fit-content;
}
@media screen and (min-width:1251px) {
	.mv-ribbon{
		padding: 10px 3%;
	}
}
@media screen and (max-width:1250px) {
	.mv-ribbon{
		right: 0;
		margin: 0 auto;
		padding: 10px;
	}
	.mv-ribbon a{
		margin: 0 auto;
	}
	@media screen and (max-width:768px) {
		.mv-ribbon a img{
			width: 22.396vw;
		}
	}
}

/*メインビジュアル*/
#mv {
	position: relative;

}
@media screen and (min-width:1251px) {
	#mv {
		height: 400px;
	}
}
/*mv-main*/
.mv-main{
	position: relative;
	display: grid;
	align-items: flex-end;
	background-position: center center;
	background-size: cover;
}
@media screen and (min-width:1251px) {
	.mv-main{
		margin: 0 auto;
		width: 1251px;
		height: 100%;
		background-image: url(../images/mv/mv-bg.png);

	}
}
@media screen and (max-width:1250px) {
	.mv-main{
		justify-content: center;
		background-image: url(../images/mv/SP_top_bg.png);
	}
}

@media screen and (max-width: 560px) {
	#mv-main source img{
		width: 96%;
		padding-left: 2%;
	}
}


.mv-main::before,
.mv-main::after{
	position: absolute;
	top: 0;
	display: block;
	width: calc((100vw - 1251px)/2);
	height: 100%;
	content: "";
}
.mv-main::before{
	left: calc(((100vw - 1251px)/2)* -1);
	background-color: #E1AC26;
}
.mv-main::after{
	right: calc(((100vw - 1251px)/2)* -1);
	background-color: #C59624;
}



/*picture*/
#mv picture[data-count="1"]{
	margin: 0 auto;
	width: fit-content;
}
@media screen and (min-width:1251px) {
	#mv picture[data-count="1"]{
		position: absolute;
		top: 0;
		left: 0;
		right: -5%;
		height: 400px;
		object-fit: contain;
	}
	#mv picture[data-count="1"] img{
		height: 100%;
	}
}
@media screen and (max-width:1250px) {
	#mv picture[data-count="1"]{
		padding-top: 6%;
        width: 90%;
        margin-right: 1%;
		margin-top: 3%;
	}
}	
	@media screen and (min-width:769px) {
		#mv picture[data-count="1"]{
			text-align: center;
		}
	}
	@media screen and (max-width:768px) {
		#mv picture[data-count="1"]{
			padding-top: 10%;
			width: 100%;
		}
	}

/*商品画像*/
#mv picture[data-count="2"]{
	position: relative;
}
@media screen and (min-width:1251px) {
	#mv picture[data-count="2"]{
		position: absolute;
		bottom: 0;
		left: 0;
		max-width: fit-content;
		height: 82%;
		z-index: 1;
	}
	#mv picture[data-count="2"] img{
		height: 100%;
	}
}
@media screen and (max-width: 1250px) {
	#mv picture[data-count="2"]{
		margin-top: -3%;
		padding: 0px 5% 5%;
		text-align: center;
	}
}

/*point*/
#point {
	position: relative;
	text-align: center;
}
@media screen and (min-width:961px) {
	#point{
		padding: 3em 0 7em;
	}
}
@media screen and (max-width:960px) {
	#point{
		padding: 6rem 4% 0;
	}
}
/*h1*/
@media screen and (min-width:961px) {
	#point h1{
		margin-bottom: -2em;
	}
}
#point h1 img{
	width: 300px;
}
/*pointList*/
#point ul {
	margin: 0 auto;
}
@media screen and (min-width:961px) {
	#point ul{
		display: flex;
		justify-content: center;
		max-width: 1280px;
	}
	#point ul li:nth-child(2){
		margin-right: 20%;
	}
}
@media screen and (max-width:960px) {
	#point ul{
		display: grid;
		grid-template-columns: repeat(2, 1fr);
		justify-content: center;
	}
	#point ul li img{
		width: 100%;
	}
}
/*osusume*/
#point #osusume{
	margin: 0 auto;
}
@media screen and (min-width:961px) {
	#point #osusume{
		position: absolute;
		bottom: 0;
		left: 0;
		right: 0;
	}
}
@media screen and (max-width:1280px) {
	@media screen and (max-width:960px) {
		#point #osusume{
			margin-top: -3rem;
		}
	}
}
#point #osusume img{
	width: 400px;
}


/* =========================================================
  performance
========================================================== */
#performance {
	text-align: center;
}
@media screen and (min-width:769px) {
	#performance {
		padding-top: 5em;
	}
}
@media screen and (max-width:768px) {
	#performance {
		padding-top: 5rem;
	}
}
/*inner*/
@media screen and (max-width:960px) {
	#performance .inner{
		padding: 0 5%;
	}
}
/*photoList*/
.photoList{
	display: flex;
	align-items: center;
	justify-content: center;
}
/*txt*/
@media screen and (min-width:769px) {
	#performance .txt[data-count="1"]{
		margin-bottom: max(-3em, -5em);
	}
	#performance .txt[data-count="2"]{
		margin: 2em 0;
	}
}
@media screen and (max-width:768px) {
	#performance .txt[data-count="1"]{
		margin-bottom: max(0, -5rem);
	}
	#performance .txt[data-count="2"]{
		margin: 2rem 0;
	}
}
/*caption*/
#performance .captionL {
	margin: 0 auto;
	font-weight: 700;
}
@media screen and (min-width:769px) {
	#performance .captionL {
		margin-top: 3em;
	}
}
@media screen and (max-width:768px) {
	#performance .captionL {
		margin-top: 3rem;
	}
}
/*obi*/
@media screen and (min-width:769px) {
	#performance .obiImage {
		margin-top: 3em;
	  }
}
@media screen and (max-width:768px) {
	#performance .obiImage {
		margin-top: 3rem;
	  }
}
/*midashi*/
@media screen and (max-width:768px) {
	#performance .midashi {
		font-size: 2.4rem;
	}
}
@media screen and (max-width:430px) {
	#performance .midashi {
		font-size: 4.4vw;
	}
}
/*成分表*/
#performance .ingredientList{

}
/*no1*/
@media screen and (min-width:961px) {
	#performance .no1{
		margin-top: 3em;
	}
	#performance .no1 [data-count="1"]{
		margin: 0 auto -1em;
		max-width: 50%;
	}
}
@media screen and (max-width:960px) {
	#performance .no1{
		margin-top: 5rem;
	}
	#performance .no1 [data-count="1"]{
		margin: 0 auto -1rem;
		max-width: 60%;
	}
}


/* =========================================================
  balance
========================================================== */
#balance{
	background: #3A2606 url(../images/balance_bg.png) no-repeat center top / contain;
}
#balance .obi_s{
	margin-bottom: 2em;
}
@media screen and (max-width:1400px) {
	#balance{background-size: cover;}
}
#balance .midashi {
    margin-bottom: 1em;
    font-weight: 700;
    line-height: 1.5;
}
@media screen and (min-width:769px) {
	#balance .midashi {
		font-size: 4rem;
	}
}
@media screen and (max-width:768px) {
	#balance .midashi {
		font-size: max(16px, 5.208vw);
	}
}
#balance .img {
  margin: 0 auto;
  width: fit-content;
}
@media screen and (max-width: 604px) {
	#balance .img {
		padding: 0 4%;
	}
}
@media screen and (min-width:769px) {
	#balance .obiImage{
		margin-top: 3em;
	}
}
@media screen and (max-width:768px) {
	#balance .obiImage{
		margin-top: 3rem;
	}
	#balance .obiImage img{
		width: 80%;
	}
}
@media screen and (max-width:430px) {
}



/* =========================================================
  sozai
========================================================== */
#sozai .obi_s{
	position: relative;
	z-index: 1;
}
@media screen and (min-width:571px) {
	#sozai .obi_s{
		margin-bottom: -21px;
	}
}
@media screen and (max-width:570px) {
	#sozai .obi_s{
		margin-bottom: -3.75%;
	}
}
#sozai #sozai01 {
  background: #E0DBC5;
}
#sozai #sozai02 {
  background: #F4EDDE;
}
#sozai #sozai03 {
  background: #F5ECDE;
}

#sozai #sozai04 {
  background: #F5ECDE;
}
#sozai #sozai01 ul {
  background: url(../images/balance_01_photo.png) right center no-repeat;
}
#sozai #sozai02 ul {
  background: url(../images/balance_02_photo.png) left center no-repeat;
}
#sozai #sozai03 ul {
  background: url(../images/balance_03_photo.png) right center no-repeat;
}

/*
#sozai #sozai04 ul {
  background: url(../images/balance_04_photo.png) right center no-repeat;
}*/
#sozai #sozai04 .midashi{
	border-bottom: none;
	text-align: center
}
#sozai ul {
  max-width: 1280px;
  margin: 0 auto;
  overflow: hidden;
  box-sizing: border-box;
}
@media screen and (min-width:961px) {
	#sozai ul {
		padding-bottom: 32px;
	}
}
#sozai ul li {
  float: left;
}
#sozai ul li.txt {
  font-weight: 700;
}
@media screen and (min-width:961px) {
	#sozai ul li.txt {
		padding-top: 80px;
		width: 44%;
	}
}
@media screen and (max-width:960px) {
	#sozai ul li.txt {
		/*padding: min(20px, 4%) 5% min(50px, 10%);*/
		padding: min(20px, 6%) 5% min(50px, 6%);
	}
}
#sozai .midashi {
  margin-bottom: 12px;
  border-bottom: 1px solid #111;
  text-align: left;
}
@media screen and (min-width:961px) {
	#sozai .midashi {
		margin-bottom: 12px;
	}
	@media screen and (min-width:1281px) {
		#sozai .midashi img{
			max-width: fit-content;
		}
	}
}
@media screen and (max-width:960px) {
	#sozai .midashi {
		padding-bottom: min(20px, 4%);
		margin-top: 5%;
		text-align: center;
	}
}
#sozai #sozai01 ul .photo,
#sozai #sozai03 ul .photo{
  float: right;
  padding-top: 32px;
  padding-right: 9%;
}
#sozai #sozai02 ul .photo {
  padding-left: 9%;
}
#sozai #sozai01 ul .txt,
#sozai #sozai03 ul .txt{
  padding-left: 4%;
}
#sozai #sozai02 ul .txt {
  float: right;
  padding-right: 4%;
}
#sozai #sozai03 .captionL {
  position: absolute;
  max-width: 1280px;
  padding: 0 4%;
  text-align: left;
  bottom: 3%;
  left: 0;
  right: 0;
  margin: auto;
  box-sizing: border-box;
  z-index: 10;
}
@media screen and (max-width:1280px) {
  #sozai #sozai01 ul {
    background-position: 120% center;
  }
  #sozai #sozai02 ul {
    background-position: -20% center;
  }
  #sozai #sozai03 ul {
    background-position: 120% center;
  }
}
@media screen and (max-width:960px) {
  #sozai .kai {
    display: block;
  }
  #sozai #sozai01 ul,
  #sozai #sozai02 ul,
  #sozai #sozai03 ul {
    background-image: none ;
  }
  #sozai #sozai01 ul .photo,
  #sozai #sozai03 ul .photo{
    float: none;
    padding-top: 0;
    padding-right: 0;
  }
  #sozai #sozai02 ul .photo {
    float: none;
    padding-left: 0;
  }
  #sozai .title {
    display: none;
  }
}
@media screen and (max-width:768px) {
  #sozai .sozai01 .midashi,
  #sozai .sozai02 .midashi,
  #sozai .sozai03 .midashi {
    padding-right: 0;
  }
}
@media screen and (max-width:430px) {
}

/* =========================================================
  series
========================================================== */
:root{
	--series-bg: radial-gradient(ellipse at center, rgba(237,179,175,1) 0%,rgba(202,75,96,1) 30%,rgba(59,0,0,1) 100%);
}
#series ul li{
	display: grid;
	place-items: center;
}
@media screen and (min-width:769px) {
	#series ul{
		display: grid;
		grid-template-columns: repeat(2, 1fr);
	}
	#series ul li:nth-child(1),
	#series ul li:nth-child(3){
		background-color: #3b0000;
	}
	#series ul li:nth-child(1) img,
	#series ul li:nth-child(3) img{
		background: var(--series-bg);
	}
	#series ul li:nth-child(2),
	#series ul li:nth-child(4){
		background-color: #fff;
	}
	#series ul li:nth-child(3){
		grid-column: 2;
		grid-row: 2;
	}
	#series ul li:nth-child(4){
		grid-column: 1;
		grid-row: 2;
	}
}
@media screen and (max-width:768px) {
	#series ul{
		text-align: center;
	}
	#series ul li:nth-child(odd){
		background-color: #3b0000;
	}
	#series ul li:nth-child(odd) img{
		background: var(--series-bg);
	}
	#series ul li:nth-child(even){
		background-color: #fff;
	}
}

/* =========================================================
  voice
========================================================== */
#voice {
  padding-top: 4%;
  box-sizing: border-box;
}
@media screen and (max-width:960px) {
	#voice{
		padding: 4% 4% 0;
	}
}
/*imageWrap*/
#voice .imageWrap{
	position: relative;
	text-align: center;
}
#voice .imageWrap img{
	width: 500px;
}
@media screen and (min-width:961px) {
	#voice .imageWrap[data-count="1"]{
		margin-top: -11.5em;
	}
	#voice .imageWrap[data-count="2"]{
		margin-top: 2em;
	}
}
@media screen and (max-width:960px) {
	#voice .imageWrap[data-count="1"]{
		margin-top: -18%;
	}
	#voice .imageWrap[data-count="2"]{
		margin-top: 2rem;
	}
}
/*inner*/
#voice .inner{
	max-width: 870px;
	margin: 0 auto;
}
#voice .inner:not(.caption) {
	border-radius: 5px;
	background-color: #fff;
	box-sizing: border-box;
}
@media screen and (min-width:769px) {
	#voice .inner:not(.caption) {
		padding: 2em 3em 0;
	}
}
@media screen and (max-width:768px) {
	#voice .inner:not(.caption) {
		padding: 4rem 3rem 0;
	}
}
#voice .inner.caption {
	margin-top: 1em;
	font-weight: 700;
	line-height: 1.7;
}
#voice ul {
	display: grid;
	justify-content: center;
}
@media screen and (min-width:769px) {
	#voice ul {
		grid-template-columns: repeat(2, 1fr);
		align-items: flex-end;
		gap: 4em;
	}
}
@media screen and (max-width:768px) {
	#voice ul {
		gap: 5rem;
	}
}
#voice ul li {
  box-sizing: border-box;
  font-family: "Kyoukasho ICA Medium", "教科書ICA M", "Times New Roman", "游明朝", YuMincho, "ヒラギノ明朝 Pro W6","Hiragino Mincho Pro","HGS明朝B", serif;
  font-size: 2.3rem;
  letter-spacing: 0.08em;
}
#voice ul li font {
  background: linear-gradient(transparent 50%, #EFEA3A 50%);
}
@media screen and (min-width:769px) {
	#voice .kaito {
		margin-bottom: 2em;
	}
}
@media screen and (max-width:768px) {
	#voice .kaito {
		margin-bottom: 3rem;
	}
}
#voice .captionL{
	line-height: 1.8;
}
@media screen and (max-width:1280px) {
}
@media screen and (max-width:960px) {
}
@media screen and (max-width:768px) {

}
@media screen and (max-width:430px) {

}



/* =========================================================
  quality
========================================================== */
@media screen and (min-width:769px) {
	#quality {
		padding-top: 3em;
	}
}
@media screen and (max-width:768px) {
	#quality {
		padding-top: 3rem;
	}
}
#quality .inner{
	max-width: 1280px;
}
@media screen and (max-width:1280px) {
	#quality .inner{
		padding: 0 4%;
	}
}
/*title*/
#quality .titleWrap .title{
	margin-bottom: 1rem;
	text-align: center;
	line-height: 1.3;
}
#quality .titleWrap p{
	margin-bottom: 1em;
	text-align: center;
    line-height: 1.3;
}
@media screen and (min-width:961px) {
	#quality .titleWrap .title{
		font-size: 3.5em;
	}
	#quality .titleWrap p{
		font-size: 1.8em;
	}
}
@media screen and (max-width:960px) {
	#quality .titleWrap .title{
		font-size: 6vw;
	}
	#quality .titleWrap p{
		font-size: 3.4vw;
	}
}
#quality ul{
	display: grid;
}
@media screen and (min-width:961px) {
	#quality ul{
		grid-template-columns: repeat(2, auto);
		gap: 2.5em;
		margin: 0 auto;
	}
}
@media screen and (max-width:960px) {
	#quality ul{
		gap: 3rem;
	}
}
#quality ul li {
  background: #FFF;
}
@media screen and (min-width:769px) {
	#quality ul li {
		padding: 50px;
	}
}
@media screen and (max-width:768px) {
	#quality ul li {
		padding: 8%;
	}
}
#quality ul li .title{
  margin-bottom: 5%;
  text-align: center;
}
#quality ul li p {
	margin-bottom: 5%;
	font-size: 1.3em;
	font-weight: 700;
	line-height: 1.3;
}
#quality ul li .photo{
	text-align: center;
}
@media screen and (min-width:769px) {
	#quality .obiImage{
		margin-top: 3em;
	}
}
@media screen and (max-width:768px) {
	#quality .obiImage{
		margin-top: 3rem;
	}
}



/* =========================================================
  package
========================================================== */
#package {
	position: relative;
	background: linear-gradient(to bottom, rgb(78 50 50 / 80%) 0%,rgba(255,255,255,0.5) 100%), var(--pattern01) repeat top left / auto;
	background-blend-mode : hard-light;
	text-align: center;
	overflow: hidden;
}
@media screen and (min-width:1201px) {
	#package{
		padding: 5em 0 10em;
	}
}
@media screen and (max-width:1200px) {
	#package{
		padding: 5em 0 0;
	}
}
@media screen and (max-width:768px) {
	#package{
		padding: 5rem 0 0;
	}
}
#package .inner {
	padding: 0 15% 7%;
	border-radius: 15px;
	text-align: center;
	box-sizing: border-box;
}

#package .inner ul{
	display: flex;
}
#package .inner li{
    flex: auto;
}

@media screen and (min-width:1201px) {
	#package .inner {
		background: url(../images/package/kin-lineup-bg.png) no-repeat bottom center / auto;
	}
}
@media screen and (max-width:1200px) {
	#package .inner {
		max-width: 80%;
		background: url(../images/package/SP_series2_bg.png) no-repeat bottom center / min(780px, 100%);
	}
}
	@media screen and (max-width:960px) {
		
	}
	@media screen and (max-width:768px) {
		#package .inner {
		  padding: 6% 18% 12%;
		  max-width: 100%;
		}
	  }
		
	/*#package .inner [data-count="1"]{
		  width: max(200px, 40%);
		}*/



/*人物*/
#package .imageWrap{
    margin: 0 auto;
    max-width: 960px;
}
@media screen and (min-width:1201px) {
	#package .imageWrap{
		position: absolute;
		bottom: -10%;
		left: -30%;
		right: 0;
		text-align: left;
	}
}
@media screen and (max-width:1200px) {
	#package .imageWrap{
		margin-top: -10%;
		text-align: center;
	}
	@media screen and (max-width:768px) {
		#package .imageWrap img{
			width: 50%;
		}
	}
}



/* =========================================================
  lineup
========================================================== */
@media screen and (min-width:769px) {
	#lineup {
		padding: 5em 0 2em;
	}
}
@media screen and (max-width:768px) {
    #lineup {
        padding: 3rem 4%;
        margin-bottom: 4rem;
    }
}
#lineup .imageWrap{
	text-align: center;
}
@media screen and (max-width:768px) {
	#lineup .imageWrap img{
		width: 50%;
	}
}
#lineup .inner{
	max-width: calc(960px + calc(3em * 2));
}
/*lineupList*/
#lineup .lineupList{
	background:#FFF;
	border-radius: 0 0 6px 6px;
}

#lineup .lineupList li{
	text-align: center;
}
#lineup .lineupList li:hover{
	opacity: 0.8;
	transition: 0.3s ease-in-out;
}
#lineup .lineupList li a img,
#lineup .lineupList li form input{
	width: fit-content;
	max-width: 100%;
}
@media screen and (min-width:769px) {
	#lineup .lineupList{
		display: grid;
		grid-template-columns: repeat(3, 1fr);
		padding: 2em 3em;
	}
	#lineup .lineupList li:not(:nth-child(7)):not(:nth-child(8)):not(:nth-child(9)){
		border-bottom: 1px solid #000;
	}
	#lineup .lineupList li a,
	#lineup .lineupList li form{
		display: block;
		margin: 0 auto;
		padding: 3em 0;
		width: fit-content;
	}
}
@media screen and (max-width:960px) {
	#lineup .lineupList{
		padding: 2em 0;
	}
	@media screen and (max-width:768px) {
		#lineup .lineupList{
			display: flex;
			flex-wrap: wrap;
			gap: 2em 0;
			justify-content: center;
		}
		#lineup .lineupList li{
			justify-content: center;
			width: calc(100% / 2 - calc(2em / 2));
		}
	}
	@media screen and (max-width:430px) {
		#lineup .lineupList{
			gap: 4em;
			padding: 2em 0 4em;
		}
		#lineup .lineupList li{
			width: 100%;
		}
		#lineup .lineupList li:nth-child(2){
			order: -1;
		}
	}
}

#lineup .txt{
	margin-top: 3em;
	font-family: var(--gothic);
	text-align: center;
	line-height: 1.5;
	font-size: 0.8em;
}

.txt{
font-size: 1.15em;
}


/* =========================================================
  btns
========================================================== */
footer {
  max-width: 960px;
  margin:0 auto;
}
.centerList {
  text-align: center;
  padding: 10px 0 0;
  border-bottom: 1px solid #CCC;
}
footer ul {
  display: inline-block;
  overflow: hidden;
}
footer ul li {
  float: left;
  width:50px;
  text-align: center;
  box-sizing: border-box;
    margin: 0 10px 0!important;
}
footer a#pagetop {
  position: absolute;
  right: 0;
  top: 7px;
  z-index: 10;
}
@media screen and (max-width:1280px) {
}
@media screen and (max-width:960px) {
}
@media screen and (max-width:768px) {
}
@media screen and (max-width:430px) {

}

/*-----ページトップ----*/
#page_top {
  width: 90px;
  height: 90px;
  position: fixed;
  right: 0;
  bottom: 0;
  opacity: 0.8;
}
#page_top a {
  position: relative;
  display: block;
  width: 90px;
  height: 90px;
  text-decoration: none;
}
#page_top a::before {
  font-family: 'Font Awesome 5 Free';
  font-weight: 900;
  content: '\f102';
  font-size: 25px;
  color: #d82314;
  position: absolute;
  width: 25px;
  height: 25px;
  top: -40px;
  bottom: 0;
  right: 0;
  left: 0;
  margin: auto;
  text-align: center;
}
#page_top a::after {
  content: 'PAGE TOP';
  font-size: 13px;
  /*color: #fff;*/
  position: absolute;
  top: 45px;
  bottom: 0;
  right: 0;
  left: 0;
  margin: auto;
  text-align: center;
  color: #d82314;
}

/* =======================================
floating-banner
========================================== */
.floating-banner {
    position: fixed;/* 追従 */
    z-index: 99999;/* 他の要素の下に隠れないように */
    bottom: 0;/* バナーの上下の位置 */
    text-align: center;
	width: 100%;
}
.floating-banner:hover {
    opacity: .9;/* ホバーで少し透過 */
}
.pc-f {
    width: 100px;
    margin: 12px;
	position: fixed;
    bottom: 10px;
    right: 10px;
}
@media screen and (max-width: 990px) {/* タブレット用のブレイクポイントを指定 */
    .pc-f {
        display: none;/* タブレットサイズ以下でPC用のバナーを非表示に */
    }
}
@media screen and (min-width: 561px) {
	.sp-f {
		display: none;/* PCではスマホ用のバナーは非表示に */
	}
}
@media screen and (max-width: 560px) {/* スマホ用のブレイクポイントを指定 */
    .sp-f {
        max-width: 100%;
    }
}
#performance iframe {
	width: 70%;
	height: revert-layer;
    margin-bottom: 70px;
}


.graph{
	width: auto;
    display: block;
    padding: 10% 2% 2%;
}
@media screen and (max-width: 990px) {
	.graph{
		width: 90%;
        padding: 0 5% 5%;
	}
	#sozai ul li.graphtex li{
	
	}
}
@media screen and (min-width:991px) {
	.graph {
		padding-top: 0;
		width: 50%;
	}
	#sozai ul li.graphtex{
		width: 90%;
    	padding: 5% 5% 0;
	}
	.graph {
        padding-top: 0;
        width: 50%;
		margin: auto;
    }
}