.itemBrandPage {
  .l-wrapper {
    background-color: #fff;
    color:#000;
    &::before {
      content: '';
      position: fixed;
      inset: 0;
      background: #000 url(/assets/item_brand/chogokin_series/img/bg_main.jpg) repeat-y center top / 100%;
      z-index: 0;
      @media only screen and (max-width: 767px) {
        background-image: url(/assets/item_brand/chogokin_series/img/bg_main_sp.jpg);
      }
    }
    .footerPageTop a {
      --btnColor: #fff;
      --btnBgColor: #000;
    }
	}
  .pageHeading {
	@media only screen and (max-width: 767px) {
		margin-bottom: calc(60em / 26);
	}
  }
  .pageHeading__inner {
	.pageHeading__title {
		background: #f8c34e url(/assets/item_brand/chogokin_series/img/bg_title.jpg) no-repeat 50% / cover;
		box-sizing: border-box;
		width: fit-content;
		min-width: calc(420em / 48);
		padding: .05em .5em .1em;
		text-shadow: #fff -1px 0 1px;
		font-size: calc(48em / 16);
		letter-spacing: .05em;
		color: #000;
		margin-inline:auto;
		filter: none;
		font-weight: 800;
		@media only screen and (max-width: 767px) {
			font-size: calc(60em / 26);
		}
	}
  }

  .kv {
		padding-bottom: min(10px, calc(10% / 12));
    margin-bottom: 0;
		@media only screen and (max-width: 767px) {
			padding-bottom: calc(20% / 7.5);
		}
  }
  .kvSlide__pagination {
		.swiper-pagination-bullet {
			&::before {
				background-color: var(--colorGray5);

			}
		}
		.swiper-pagination-bullet-active {
			&::before {
				background-color: var(--colorRed);
			}
		}
	}

  .itemSlide .itemList__item__inner:not(:has(> a)), .itemSlide .itemList__item__inner a {
    background: #fff;
    color: #000;
    border-radius: 0;
    .itemList__thumb {
      border-radius: 0;
    }
  }
  .mainContents {
    padding-bottom: 0;
    position: relative;

  }
  .seriesSection:not(.seriesSection2) {
    .seriesInfoWrapper {
      padding-top: calc(100% / 11.2);
      padding-bottom: 1px;
       margin-bottom: 0;
      border-bottom-width: 0;
      position: relative;
      @media only screen and (max-width: 767px) {
        padding-top: calc(100% / 6.9);
      }
    }
  }
  .cgkLpSection__logo {
		width:calc(440% / 11.2);
		margin: 0 auto calc(50% / 11.2);
		@media only screen and (max-width: 767px) {
			width:calc(470% / 6.9);
			margin-bottom: calc(40% / 6.9);
		}
	}
  .cgkLpSection__title {
	text-align: center;
	font-weight: bold;
	font-size: calc(36em / 18);
	margin-bottom: calc(30em / 36);
	text-shadow:
		0 0 calc(10em / 36) rgba(0, 0, 0, 0.9),
		0 0 calc(10em / 36) rgba(0, 0, 0, 0.9);

	@media only screen and (max-width: 767px) {
		font-size: calc(36em / 28);
		margin-bottom: calc(40em / 36);
	}
}

.cgkLpSection__txtBox {
	width: calc(820% / 10);
	margin: 0 auto;
	text-align: center;
	@media only screen and (max-width: 767px) {
		width: auto;
		text-align: left;
	}
	&.is-show {
		.cgkLpSection__txtBox__inner {
			max-height: 1000px;
			mask-image: none;
			-webkit-mask-image: none;
			transition-duration: .4s;
			transition-property: max-height;
		}
		.cgkLpSection__readMore {
			display: none;
		}
	}
}

.cgkLpSection__txtBox__inner {
	overflow: hidden;
	max-height: calc(90em / 16);
	mask-image: linear-gradient(to bottom, black 0%, black 60%, transparent 100%);
	-webkit-mask-image: linear-gradient(to bottom, black 0%, black 60%, transparent 100%);
}

.cgkLpSection__txt {
  font-size: calc(18em / 16);
	text-shadow:
		0 0 calc(4em / 18) rgba(0, 0, 0, 1),
		0 0 calc(8em / 18) rgba(0, 0, 0, 1),
		0 0 calc(8em / 18) rgba(0, 0, 0, 0.9);
	margin-bottom: 1.5em;
  @media only screen and (max-width: 767px) {
    font-size: calc(28em / 26);
  }
	&:last-child {
		margin-bottom: 0;
	}
}

.cgkLpSection__readMore {
  font-size: calc(18em / 16);
	@media only screen and (max-width: 767px) {
		text-align: center;
		font-size: calc(20em / 26);
	}
	button {
		font-family: inherit;
		background-color: #000;
		color: #fff;
		min-width: calc(200em / 18);
		box-sizing: border-box;
		padding: .4em 2em .4em 1.5em;
		position: relative;
		transition-duration: .2s;
		transition-property: opacity, transform, filter;
		&::before {
			content: "";
			width: 0;
			height: 0;
			border-style: solid;
			border-right: calc(5em / 18) solid transparent;
			border-left: calc(5em / 18) solid transparent;
			border-top: calc(8em / 18) solid #eb9b0e;
      border-bottom: none;
			position: absolute;
			top: 0;
			bottom: 0;
			right: calc(15em / 18);
			margin: auto;
			transition-duration: .2s;
			transition-property: opacity, transform, filter;
		}

		&:hover {
			opacity: .8;
			&::before {
				transform: translateY(25%);
			}
		}
	}
}
.bChartSection {
	padding-top: calc(100% / 11.2);
	padding-bottom: calc(100% / 11.2);
	color: #000;
  position: relative;
  z-index: 1;
  &::before {
    content: '';
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 100vw;
    height: 100%;
    background: #f8c34e url(/assets/item_brand/chogokin_series/img/bg_gold.jpg) no-repeat center center / cover;
    z-index: -1;
  }
	@media only screen and (max-width: 767px) {
		padding-top: calc(100% / 6.9);
		padding-bottom: calc(100% / 6.9);
	}
}

.bChartSection__title {
	text-align: center;
	font-size: calc(50em / 18);
	font-weight: bold;
	margin-bottom: calc(30em / 50);
	color: #000;
	@media only screen and (max-width: 767px) {
		font-size: calc(58em / 28);
		margin-bottom: calc(30em / 58);
	}
}

.bChartSection__lead {
	text-align: center;
	margin-bottom: calc(24em / 18);

	@media only screen and (max-width: 767px) {
		text-align: left;
		font-size: calc(28em / 28);
	}
}

.bChartImg {
	width: calc(750% / 10);
	margin: 0 auto;
	position: relative;

	@media only screen and (max-width: 767px) {
		width: auto;
		margin: 0 calc(-30% / 6.9);
	}
  img {
    width: 100%;
    height: auto;
    display: block;
  }
	a {
		display: block;
		position: relative;

		&:hover {
			.bChartImg__btn {
				opacity: .8;

				& > span::before {
					transform: translateY(-50%) scale(1.1);
				}
			}
		}
	}
}

.bChartImg__btn {
  color: #fff;
	font-size: calc(24em / 18);
	position: absolute;
	top: 50%;
	right: calc(40% / 7.5);
	border: solid 1px #fff;
	background-color: #000;
	border-radius: 5em;
	line-height: 1.5;
	padding: .2em 1em .2em 1em;
	transform: translateY(-50%);
	transition-duration: .2s;
	transition-property: opacity, transform, filter;

	@media only screen and (max-width: 767px) {
		font-size: calc(30em / 28);
	}

	& > span {
		position: relative;
		padding-right: calc(40em / 24);
    display: inline-block;
		&::before {
			content: "";
			position: absolute;
			top: 50%;
			right: 0;
			width: calc(22em / 24);
			height: calc(22em / 24);
			background: url(/assets/item_brand/chogokin_series/img/icon_expansion.png) no-repeat center center / cover;
			transform: translateY(-50%);
			transition-duration: .2s;
			transition-property: opacity, transform, filter;
		}
	}
}

.modalChart {
  .modal__closeSticky {
    margin-inline:0 ;
  }
}
.modalChart__content {
  background-color: transparent;
  max-width: 980px;
}
.modalChart__inner {
  padding-inline: 0;
  padding-bottom: 0;
  background-color: transparent;
}
.modalChartContent img {
    border: 2px solid #695c3c;
    box-sizing: border-box;
}
  .seriesInfo__header {
    margin-bottom: calc(50em / 16);
    .seriesInfo__title {
      background: #f8c34e url(/assets/item_brand/chogokin_series/img/bg_title.jpg) no-repeat 50% / cover;
      box-sizing: border-box;
      width: fit-content;
      min-width: calc(390em / 48);
      padding: .05em .5em .1em;
      text-shadow: #fff -1px 0 1px;
      font-size: calc(42em / 16);
      color: #000;
      margin-inline:auto;
      filter: none;
      @media only screen and (max-width: 767px) {
        font-size: calc(56em / 26);
      }
    }
  }
  .cgkPickupSec {
    position: relative;
    padding-top: calc(100% / 11.2);
	  padding-bottom: calc(100% / 11.2);
    color: #000;
    position: relative;
    z-index: 1;
    @media only screen and (max-width: 767px) {
      padding-top: calc(100% / 6.9);
      padding-bottom: calc(100% / 6.9);
    }
    &::before {
      content: '';
      position: absolute;
      top: 0;
      left: 50%;
      transform: translateX(-50%);
      width: 100vw;
      height: 100%;
      background: #000000;
      z-index: -1;
    }
  }
  .gkPickupSec__mainImg {
    margin-bottom: calc(40% / 10);
		position: relative;
    @media only screen and (min-width: 768px) {
      width: calc(1000% / 11.2);
      margin-inline: auto;
    }
		@media only screen and (max-width: 767px) {
			margin-bottom: calc(40% / 6.9);
		}
    &:last-child {
      margin-bottom: 0;
    }
		img {
			width: 100%;
			height: auto;
		}
  }
  .cgkBrandSec {
    position: relative;
    padding-top: calc(100% / 11.2);
	  padding-bottom: calc(100% / 11.2);
    position: relative;
    z-index: 1;
    @media only screen and (max-width: 767px) {
      padding-top: calc(100% / 6.9);
      padding-bottom: calc(100% / 6.9);
    }
  }
  .brandExpList {
    width: calc(1000% / 11.2);
    margin-inline: auto;
  }
  .brandExpList__items {
		display: flex;
		justify-content: space-between;
		flex-wrap: wrap;
		@media only screen and (max-width: 767px) {
			margin-bottom: calc(-25% / 6.9);
		}
		&::before, &:after {
			content:"";
			width: calc(232% / 10);
			order:1;
		}
	}
	.brandExpList__item {
		width: calc(232% / 10);
		background-color: #fff;
		color: #000;
		box-sizing: border-box;
		padding: calc(8% / 10);
		margin-bottom: calc(20% / 10);
		display: flex;
		flex-direction: column;
		box-shadow: 0px 0px calc(18em / 16) calc(8em / 16) rgba(8, 11, 21, .6);
		@media only screen and (max-width: 767px) {
			width: calc(330% / 6.9);
			padding: calc(12% / 6.9);
			margin-bottom: calc(25% / 6.9);
		}
	}

	.brandExpList__logo {
		width: calc(190% / 2.16);
		margin: calc(4% / 2.16) auto calc(10% / 2.16);
	}
	.brandExpList__txtBox {
		padding: 0 calc(8% / 2.16) calc(12% / 2.16);
		padding-bottom: calc(20% / 3.06);
	}
	.brandExpList__txt {
		font-size: calc(14em / 16);
		line-height: 1.5;
		@media only screen and (max-width: 767px) {
			font-size: calc(20em / 26);
		}
	}
	.brandExpList__link {
		text-align: center;
		margin-top: auto;
		@media only screen and (max-width: 767px) {
			font-size: calc(25em / 26);
		}
		a {
			background-color: #b41015;
      color: #fff;
			text-decoration: none;
			display: block;
			padding: .5em .2em;
			transition-duration: .2s;
			transition-property: opacity, transform, filter;
			&:hover {
				filter: brightness(120%);
			}
		}
	}
  .seriesSection2 {
    padding-top: min(100px, calc(100% / 12));
    background-color: #fff;
    color: #000;
    position: relative;
    margin-bottom: calc(-1 * (min(20px, (20vw / 12)) + calc(70em / 16)));
    padding-bottom: min(100px, (100% / 12));
    @media only screen and (max-width: 767px) {
      padding-top: calc(100% / 7.5);
      margin-bottom: calc(-1 * ((20vw / 7.5) + calc(100em / 26)));
      padding-bottom: calc(140% / 7.5);
    }
    .seriesSection__backLink {
      a, button {
          --btnBgColor: #000;
          --btnColor: #fff;
        }
    }
    .pageCopyright {
      text-shadow: none;
    }
  }

  .seriesInfoWrapper:not(:has([data-txt="関連作品ページ"], [data-txt="関連ブランドページ"])){
    .seriesInfo:has(.seriesInfo__title[data-txt="ITEMS"]) {
      margin-bottom: 0;
    }
  }
  .seriesInfo:has(.seriesInfo__title[data-txt="ITEMS"])  {
    padding-top: calc(100% / 11.2);
    padding-bottom: calc(100% / 11.2);
    position: relative;
    z-index: 1;
    color: #fff;
    @media only screen and (max-width: 767px) {
      padding-top: calc(100% / 6.9);
      padding-bottom: calc(100% / 6.9);
    }
    &::before {
      content:"";
      position: absolute;
      top:0;
      bottom: 0;
      width: 100dvw;
      left:50%;
      transform: translateX(-50%);
      background: #000;
      z-index: -1;
    }
  }

  .salesCateInfo {
    .salesCateInfo__title {
      text-shadow: none;
    }
    .salesCateInfo__note {
      text-shadow: none;
      a {
        color: var(--colorRed);
      }
    }
  }

}
