/* mv */
.mv {
  position: relative;
  width: 100%;
  padding-top: calc(360 / var(--full-width) * 100vw);
  padding-bottom: calc(30 / var(--full-width) * 100vw);
  background-image: url(../img/mv-bg.jpg);
  background-position: 100% 20vw;
  background-repeat: no-repeat;
  background-size: 100% 50vw;
}
.s .mv {
  padding: 0 0 calc(40 / var(--sp-full-width) * 100vw);
  background-position: 100%;
  background-size: cover;
}

.mv .c-title {
  position: absolute;
  top: 9%;
  left: 12%;
}

.mv h1 {
  max-width: calc(1025 / var(--full-width) * 100vw);
  width: fit-content;
  margin-top: calc(8 / var(--full-width) * 100vw);
  padding: calc(19 / var(--full-width) * 100vw) calc(25 / var(--full-width) * 100vw);
  font-size: calc(46 / var(--full-width) * 100vw);
  font-weight: 500;
  color: #fff;
  background-color: #000;
  line-height: 1.1;
}
.s .mv h1 {
  max-width: unset;
  margin-top: calc(27 / var(--sp-full-width) * 100vw);
  padding: calc(19 / var(--sp-full-width) * 100vw) calc(22 / var(--sp-full-width) * 100vw);
  font-size: calc(50 / var(--sp-full-width) * 100vw);
  color: #fff;
  line-height: 1.2;
}

.mv-img {
  width: calc(962 / var(--full-width) * 100vw);
  height: calc(460 / var(--full-width) * 100vw);
  position: absolute;
  top: 0%;
  left: 64%;
  transform: translateX(-50%);
}
.s .mv-img {
  width: 100%;
  height: auto;
  position: relative;
  top: 0;
  left: 0%;
  transform: translateX(0%);
}

.mv-img img {
  height: 100%;
  object-fit: cover;
}
.s .mv-img img {
  height: auto;
}

.mv-ttl {
  position: relative;
  z-index: 1;
  margin-left: calc(170 / var(--full-width) * 100vw);
  margin-right: 20px;
}
.s .mv-ttl {
  max-width: calc(670 / var(--sp-full-width) * 100vw);
  width: 100%;
  margin-left: 0;
  margin: 0 auto;
}

.mv-label {
  width: fit-content;
  border-radius: calc(4 / var(--full-width) * 100vw);
  padding: calc(4 / var(--full-width) * 100vw) calc(5 / var(--sp-full-width) * 100vw)
    calc(3 / var(--full-width) * 100vw);
  text-align: center;
  font-size: calc(18 / var(--full-width) * 100vw);
  color: #fff;
}
.s .mv-label {
  position: absolute;
  top: -15px;
  border-radius: calc(4 / var(--sp-full-width) * 100vw);
  padding: calc(10 / var(--sp-full-width) * 100vw);
  font-size: calc(28 / var(--sp-full-width) * 100vw);
}

.mv-date {
  padding-top: calc(4 / var(--full-width) * 100vw);
  font-size: calc(18 / var(--full-width) * 100vw);
}
.s .mv-date {
  padding-top: calc(45 / var(--sp-full-width) * 100vw);
  font-size: calc(28 / var(--sp-full-width) * 100vw);
}

.mv-tagList {
  padding-top: calc(12 / var(--full-width) * 100vw);
  font-size: calc(18 / var(--full-width) * 100vw);
  color: #fff;
  display: flex;
  column-gap: calc(15 / var(--full-width) * 100vw);
  flex-wrap: wrap;
}
.s .mv-tagList {
  padding-top: calc(17 / var(--sp-full-width) * 100vw);
  font-size: calc(24 / var(--sp-full-width) * 100vw);
  flex-direction: column;
}

/* news */
.news-wrapper {
  position: relative;
}

/* news-list */
.news-list {
  width: calc(230 / var(--full-width) * 100vw);
  border: 1px solid #000;
  border-radius: calc(10 / var(--full-width) * 100vw);
  padding: calc(22 / var(--full-width) * 100vw) calc(25 / var(--full-width) * 100vw)
    calc(22 / var(--full-width) * 100vw) calc(25 / var(--full-width) * 100vw);
  position: absolute;
  top: calc(100 / var(--full-width) * 100vw);
  left: 4%;
}
.s .news-list {
  width: calc(670 / var(--sp-full-width) * 100vw);
  margin: calc(47 / var(--sp-full-width) * 100vw) auto 0;
  border-radius: calc(10 / var(--sp-full-width) * 100vw);
  padding: calc(25 / var(--sp-full-width) * 100vw) calc(32 / var(--sp-full-width) * 100vw);
  position: unset;
  transform: unset;
}

.news-list .__fontEn {
  font-size: calc(20 / var(--full-width) * 100vw);
}
.s .news-list .__fontEn {
  font-size: calc(36 / var(--sp-full-width) * 100vw);
}

.news-list a {
  display: flex;
  align-items: baseline;
  gap: calc(8 / var(--full-width) * 100vw);
  padding-top: calc(15 / var(--full-width) * 100vw);
  font-size: calc(16 / var(--full-width) * 100vw);
  line-height: 1.6;
  letter-spacing: -0.06vw;
}
.s .news-list a {
  gap: calc(13 / var(--sp-full-width) * 100vw);
  padding-top: calc(22 / var(--sp-full-width) * 100vw);
  font-size: calc(24 / var(--sp-full-width) * 100vw);
}

.news-list a::before {
  content: '';
  width: calc(12.8 / var(--full-width) * 100vw);
  height: calc(12.8 / var(--full-width) * 100vw);
  flex-shrink: 0;
  display: inline-block;
  background-image: url('../img/icon-headline.png');
  background-position: center;
  background-size: contain;
  background-repeat: no-repeat;
}
.s .news-list a::before {
  content: '';
  width: calc(20 / var(--sp-full-width) * 100vw);
  height: calc(20 / var(--sp-full-width) * 100vw);
}

/* 記事 */
.news-content {
  display: flex;
  justify-content: center;
  flex-direction: column;
  gap: calc(120 / var(--full-width) * 100vw);
  width: calc(740 / var(--full-width) * 100vw);
  min-height: calc(350 / var(--full-width) * 100vw);
  margin: 0 auto;
  padding: calc(100 / var(--full-width) * 100vw) 0 calc(100 / var(--full-width) * 100vw);
}
.s .news-content {
  gap: calc(40 / var(--sp-full-width) * 100vw);
  width: 100%;
  min-height: 0;
  padding: calc(80 / var(--sp-full-width) * 100vw) calc(40 / var(--sp-full-width) * 100vw)
    calc(65 / var(--sp-full-width) * 100vw);
}

/* 見出し */
.news-content h2 {
  display: flex;
  align-items: center;
  column-gap: calc(30 / var(--full-width) * 100vw);
  padding: calc(35 / var(--full-width) * 100vw) 0;
  border-top: 1px solid #000;
  border-bottom: 1px solid #000;
  font-size: calc(32 / var(--full-width) * 100vw);
  line-height: 1.3;
  font-weight: 400;
}
.s .news-content h2 {
  column-gap: calc(25 / var(--sp-full-width) * 100vw);
  padding: calc(35 / var(--sp-full-width) * 100vw) 0;
  font-size: calc(33 / var(--sp-full-width) * 100vw);
  font-weight: 600;
}

.news-content h2 p {
  font-size: calc(40 / var(--full-width) * 100vw);
}
.s .news-content h2 p {
  font-size: calc(40 / var(--sp-full-width) * 100vw);
}

.news-content h2 span {
  width: calc(1 / var(--full-width) * 100vw);
  height: calc(42 / var(--full-width) * 100vw);
  background-color: #000;
}
.s .news-content h2 span {
  width: calc(1 / var(--sp-full-width) * 100vw);
  height: calc(42 / var(--sp-full-width) * 100vw);
}

/* テキスト */
.news-content p {
  font-size: calc(16 / var(--full-width) * 100vw);
  letter-spacing: -0.02vw;
  margin-top: calc(60 / var(--full-width) * 100vw);
}
.s .news-content p {
  font-size: calc(28 / var(--sp-full-width) * 100vw);
  margin-top: calc(45 / var(--sp-full-width) * 100vw);
}
.news-content p:first-child {
  margin-top: 0;
}

/* 登場人物紹介 */
.news-member {
  margin-top: calc(40 / var(--full-width) * 100vw);
}
.s .news-member {
  margin-top: calc(50 / var(--sp-full-width) * 100vw);
}

/* 会話 */
.news-talk {
  margin-top: calc(40 / var(--full-width) * 100vw);
  display: flex;
  flex-direction: column;
  row-gap: calc(30 / var(--full-width) * 100vw);
}
.s .news-talk {
  margin-top: calc(50 / var(--sp-full-width) * 100vw);
  row-gap: calc(50 / var(--sp-full-width) * 100vw);
}

.news-talk-container {
  display: flex;
  align-items: flex-start;
  column-gap: calc(30 / var(--full-width) * 100vw);
}
.s .news-talk-container {
  column-gap: calc(15 / var(--sp-full-width) * 100vw);
}

.news-talk-person {
  width: calc(70 / var(--full-width) * 100vw);
  flex-shrink: 0;
  padding-top: calc(15 / var(--full-width) * 100vw);
}
.s .news-talk-person {
  width: calc(85 / var(--sp-full-width) * 100vw);
  padding-top: calc(20 / var(--sp-full-width) * 100vw);
}

/* 吹き出し */
.news-talk-text {
  padding: calc(32 / var(--full-width) * 100vw);
  border-radius: 8px;
  position: relative;
}
.s .news-talk-text {
  padding: calc(28 / var(--sp-full-width) * 100vw);
}
.news-talk-text p {
  letter-spacing: -0.05vw;
}

/* 左 */
.news-talk-text._left {
  border: 1px solid #000;
  background-color: #fff;
  margin-right: calc(32 / var(--full-width) * 100vw);
}

.news-talk-text._left:before {
  content: '';
  position: absolute;
  top: calc(25 / var(--full-width) * 100vw);
  left: calc(-28.5 / var(--full-width) * 100vw);
  border: calc(20 / var(--full-width) * 100vw) solid transparent;
  border-right: calc(25 / var(--full-width) * 100vw) solid #fff;
  z-index: 2;
}
.news-talk-text._left:after {
  content: '';
  position: absolute;
  top: calc(25 / var(--full-width) * 100vw);
  left: calc(-30 / var(--full-width) * 100vw);
  border: calc(20 / var(--full-width) * 100vw) solid transparent;
  border-right: calc(25 / var(--full-width) * 100vw) solid #000;
  z-index: -1;
}
.s .news-talk-text._left:before {
  top: calc(40 / var(--sp-full-width) * 100vw);
  left: calc(-27 / var(--sp-full-width) * 100vw);
  border: calc(20 / var(--sp-full-width) * 100vw) solid transparent;
  border-right: calc(25 / var(--sp-full-width) * 100vw) solid #fff;
}
.s .news-talk-text._left:after {
  top: calc(40 / var(--sp-full-width) * 100vw);
  left: calc(-30 / var(--sp-full-width) * 100vw);
  border: calc(20 / var(--sp-full-width) * 100vw) solid transparent;
  border-right: calc(25 / var(--sp-full-width) * 100vw) solid #000;
}

/* 右 */
.news-talk-text._right {
  background-color: #ef7b0c;
  margin-left: calc(32 / var(--full-width) * 100vw);
}

.news-talk-text._right:before {
  content: '';
  position: absolute;
  top: calc(42 / var(--full-width) * 100vw);
  left: 100%;
  border: calc(8 / var(--full-width) * 100vw) solid transparent;
  border-left: calc(10 / var(--full-width) * 100vw) solid #ef7b0c;
}
.s .news-talk-text._right:before {
  top: calc(55 / var(--sp-full-width) * 100vw);
  border: calc(8 / var(--sp-full-width) * 100vw) solid transparent;
  border-left: calc(10 / var(--sp-full-width) * 100vw) solid #ef7b0c;
}

.news-talk-text._right p {
  color: #fff;
}

/* ピックアップ */
.news-pickup {
  position: relative;
  margin-top: calc(215 / var(--full-width) * 100vw);
  border-radius: 8px;
  background-color: #1f1f1f;
  padding: calc(220 / var(--full-width) * 100vw) calc(40 / var(--full-width) * 100vw)
    calc(35 / var(--full-width) * 100vw);
}
.s .news-pickup {
  margin-top: calc(220 / var(--sp-full-width) * 100vw);
  padding: calc(220 / var(--sp-full-width) * 100vw) calc(40 / var(--sp-full-width) * 100vw)
    calc(40 / var(--sp-full-width) * 100vw);
}

.news-pickup-img {
  aspect-ratio: 600 / 320;
  position: absolute;
  top: calc(-160 / var(--full-width) * 100vw);
  left: 50%;
  transform: translateX(-50%);
  width: calc(600 / var(--full-width) * 100vw);
}
.s .news-pickup-img {
  top: calc(-150 / var(--sp-full-width) * 100vw);
  width: calc(560 / var(--sp-full-width) * 100vw);
}
.news-pickup-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.news-pickup h3 {
  position: absolute;
  top: calc(143 / var(--full-width) * 100vw);
  left: calc(40 / var(--full-width) * 100vw);
  width: fit-content;
  border-radius: calc(4 / var(--full-width) * 100vw);
  padding: calc(10 / var(--full-width) * 100vw) calc(18 / var(--full-width) * 100vw)
    calc(5 / var(--full-width) * 100vw);
  text-align: center;
  font-size: calc(32 / var(--full-width) * 100vw);
  color: #fff;
}
.s .news-pickup h3 {
  top: calc(110 / var(--sp-full-width) * 100vw);
  left: calc(40 / var(--sp-full-width) * 100vw);
  border-radius: calc(4 / var(--sp-full-width) * 100vw);
  padding: calc(10 / var(--sp-full-width) * 100vw) calc(18 / var(--sp-full-width) * 100vw)
    calc(5 / var(--sp-full-width) * 100vw);
  font-size: calc(32 / var(--sp-full-width) * 100vw);
}

.news-pickup p {
  color: #fff;
  margin: 0;
}
.s .news-pickup p {
  margin: 0;
}

.news-pickup-note {
  font-size: calc(12 / var(--full-width) * 100vw) !important;
}
.s .news-pickup-note {
  font-size: calc(18 / var(--sp-full-width) * 100vw) !important;
}

.news-pickup p + .news-pickup-note {
  margin-top: calc(15 / var(--full-width) * 100vw);
}
.s .news-pickup p + .news-pickup-note {
  margin-top: calc(45 / var(--sp-full-width) * 100vw);
}

/* 食事例 */
.news-case {
  margin-top: calc(60 / var(--full-width) * 100vw);
  display: flex;
  flex-direction: column;
  row-gap: calc(32 / var(--full-width) * 100vw);
}
.s .news-case {
  margin-top: calc(50 / var(--sp-full-width) * 100vw);
  row-gap: calc(32 / var(--sp-full-width) * 100vw);
}

.news-case-text {
  margin-top: calc(8 / var(--full-width) * 100vw) !important;
  font-size: calc(12 / var(--full-width) * 100vw) !important;
}
.s .news-case-text {
  margin-top: calc(8 / var(--sp-full-width) * 100vw) !important;
  font-size: calc(20 / var(--sp-full-width) * 100vw) !important;
}

.news-case-container .news-case-text:nth-of-type(2) {
  font-size: calc(16 / var(--full-width) * 100vw) !important;
}
.s .news-case-container .news-case-text:nth-of-type(2) {
  font-size: calc(28 / var(--sp-full-width) * 100vw) !important;
}

.news-content a {
  text-decoration: underline;
}