@charset "UTF-8";

/*--------------
テンプレート修正
--------------*/
.g-container:not(:has(.p-footerLocalNav)):not(:has(.footer-bottom-less)) {
  padding-bottom: 0px;
}

/*--------------
初期設定
--------------*/

#yakioni {
  position: relative;
  /* padding-bottom: 120px; */
  width: 100vw;
  margin-left: calc(50% - 50vw) !important;
  font-family: YakuHanJPs, "Noto Sans JP", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro","メイリオ", Meiryo, osaka, sans-serif;
  font-weight: 400;
  line-height: 1.6;
  color: #1C1C1C;
  overflow: hidden;
}

#yakioni * {
  box-sizing: border-box;
}

#yakioni img {
  display: block;
  width: 100%;
  max-width: 100%;
  height: auto;
}

.pc {
  display:block !important;
}

.sp {
  display: none !important;
}


@media screen and (max-width: 767px) {
  .pc {
    display: none !important;
  }

  .sp {
    display: block !important;
  }
}

.area_fade {
  opacity: 0;
  transform: translateY(50px);
  transition: ease-in-out .4s;
}

.area_fade.active {
  opacity: 1;
  transform: translateY(0);
  animation: fadeup 1s cubic-bezier(0.33, 1, 0.68, 1) 1 forwards;
}

#yakioni ul, #yakioni li {
  list-style: none;
}

#yakioni h1 {margin:0;padding: 0;}


/*--------------
レイアウト
--------------*/

#yakioni .l_container {
  max-width: 1280px;
  margin: 0 auto;
}

#yakioni .l_inner {
  max-width: 1044px;/*1024px*/
  margin: 0 auto;
  padding: 0 calc(20/1044*100%);
}

#yakioni .l_inner02 {
  max-width: 1024px;/*1024px*/
  margin: 0 auto;
}

@media screen and (max-width: 767px) {
  #yakioni .l_inner {
    padding: 0 calc(30/375*100%);
  }
}

/*--------------
メソッド
--------------*/

:root {
  --color_red: #dc0816;
  --color_white: #fff;
  --color_character_text: #42250f;
  --color_history_text: #6a3d15;
  --color_history_text02: #f9e9cc;
  --font_montserrat:"Montserrat", sans-serif;
  --font_murecho:"Murecho", sans-serif;
}

.ttl_25 {
  font-size: 25px;
  color: var(--color_red);
  font-weight: 700;
  text-align: center;
}

@media screen and (max-width: 767px) {
  .ttl_25 {
    font-size: 18px;
    font-size: 4.8vw;
  }
}

.ttl_30, .ttl_30w {
  font-size: 30px;
  font-weight: 700;
  text-align: center;
}

@media screen and (max-width: 767px) {
  .ttl_30, .ttl_30w {
    font-size: 18px;
    font-size: 4.8vw;
  }
}

.ttl_30 {color: var(--color_red);}
.ttl_30w {color: var(--color_white);}


.ttl_35 {
  font-size: 35px;
  color: var(--color_red);
  font-weight: 700;
  text-align: center;
}

@media screen and (max-width: 767px) {
  .ttl_35 {
    font-size: 18px;
    font-size: 4.8vw;
  }
}

.mt_2em {
  margin-top: 2em;
}

.mt_0-5em {
  margin-top: .5em;
}



/*--------------
キービジュアル
--------------*/

#yakioni .kv {
  width: 100%;
  margin: 0;
  padding: 0;
  background-color: #e73c35;
}

/*--------------
ページナビ
--------------*/

#yakioni .nav_container {
  background-color: var(--color_red);
}

#yakioni ul.nav_pc{
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: calc(40/1024*100%) 0 calc(40/1024*100%);
}

#yakioni ul.nav_pc li{
  font-size: 16px;
  font-weight: 500;
  line-height: 1.3;
  text-align: center;
  color: var(--color_white);
  display: block;
}

@media screen and (max-width: 959px) {
  #yakioni ul.nav_pc li{
    font-size: 16px;
    font-size: 1.6vw;
  }
}

#yakioni ul.nav_pc li.nav_sns_wrap{
  width: calc(88/1024*100%);
  display: flex;
  justify-content: space-between;
  align-items: center;
}

#yakioni ul.nav_pc li.nav_sns_wrap .btn_sns{
  width: calc(37/88*100%);
  display: block;
}

#yakioni ul.nav_pc a {
  color: var(--color_white);
  text-decoration: none;
  transition: ease-in-out .3s;
}

#yakioni ul.nav_pc a:hover {
  opacity: .5;
}

/* ▽ アコーディオン --------------*/

/* リセットCSS */
* {
  list-style: none;
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

/* アコーディオンメニュー全体のサイズ・位置 */
.ac {
  width: 100%;
  margin: 0 auto;
}

.ac.fixed {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  background: #fff; /* 固定時の背景色 */
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
  z-index: 1000;
}

/* クリック領域 */
.ac-parent {
	position: relative; 
	background-color: var(--color_red);
	color: var(--color_white);
	text-align: center;
	line-height: 50px;
	cursor: pointer;
  font-size: 15px;
  font-size: 4.4vw;
  font-weight: 700;
  padding:.3em 1em;
}

/* 擬似要素で下三角形を作成 */
.ac-parent:after {
	content: "";
	display: inline-block;
	position: absolute;
	top: 45%;
	right: 30px;
	width: 10px;
	height: 10px;
	border-right: 2px solid var(--color_white);
	border-bottom: 2px solid var(--color_white);
	transform: translateY(-50%) rotate(45deg);
	transition: .3s;
}

/* オープン時にopenクラスを付与 */
.ac-parent.open:after {
	transform: rotate(225deg);
}

/* クリックしたら表示される領域 */
.ac-child {
  display: none;
  padding: .5em 0 2em 0;
  background-color: var(--color_red);
  text-align: center;
}

.nav_wrap {
  display: flex;
  align-items: stretch;
  justify-content: center;
  flex-wrap: wrap;
  gap:2.5vw calc(12/315*100%); 
}

.nav_btn {
  width: calc(150/315*100%);
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: var(--color_white);
  color: var(--color_red);
  font-size: 13px;
  font-weight: 700;
  line-height: 1.1;
  border-radius: 8px;
  padding: 1em 1em;
  text-align: center;
}

.nav_btn:nth-of-type(n+3) {
  width: calc(150/315*100%);
  padding: .5em 1em;
}

.nav_btn a {
  text-decoration: none;
  color: var(--color_red);
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center; 
  width: 100%; 
  height: 100%;
}

.sns_wrap {
  margin: calc(12/315*100%) 0 0 0 ;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap:0 calc(12/315*100%); 
}

.sns_btn {
  width: calc(70/315*100%);
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 8px;
  padding: calc(12/315*100%) 0;
  border: 1px solid var(--color_white);
  padding: .5em 1em;
}

.sns_btn a {
  text-align: center;
  display: block;
  align-items: center;
  justify-content: center; 
  width: 100%; 
  height: 100%;
}


.sns_btn:nth-child(1) {
  background-color: #000;
}

.sns_btn:nth-child(2) {
  background: url(/img/instagram_bg.webp);
  background-size: cover;
}

.sns_btn:nth-child(3) {
  background: #0866ff;
}

.sns_btn:nth-child(4) {
  background: #FF0000; 
}

.sns_btn .sns{
  width: max(32px, calc(32/127*100%));
  flex-shrink: 0;
  
}



/*--------------
セクション01
--------------*/

#yakioni .sec01, #yakioni .sec03 {
  background-image: url(/img/sec01_bg_pc.png);
  background-repeat: repeat-y;
  background-position: center center;
  background-color: #fdf2f3;
}

@media screen and (max-width: 767px) {
  #yakioni .sec01, #yakioni .sec03 {
    background-image: url(/img/sec01_bg_sp.png);
    background-size: contain;
  }
}

#yakioni .sec01_container  {
  padding: calc(50/1024*100%) 0 calc(140/1024*100%);
}

@media screen and (max-width: 767px) {
  #yakioni .sec01_container  {
    padding: calc(25/375*100%) 0 calc(40/375*100%);
  }
}

/* ▽ トピックス --------------*/

#yakioni .l_inner_sec01 {
  max-width: 1044px;/*1024px*/
  margin: 0 auto;
  padding: 0 calc(20/1044*100%);
}

@media screen and (max-width: 767px) {
  #yakioni .l_inner_sec01 {
    margin: 0 auto;
    padding: 0;
  }
}

.topics_slider {
  margin: calc(20/1024*100%) auto calc(80/1024*100%);
  opacity: 0;
  transition: .3s;
  line-height: 0;
  width: calc(960/1024*100%);
}

@media screen and (max-width: 767px) {
  .topics_slider {
    margin: calc(10/375*100%) auto calc(50/375*100%);
    width: 100%;
  }
}

.slide {
  padding: 1vw;
}

.slide a img {
  display: block;
  transition: all .4s cubic-bezier(0.55, -1.30, 0.30, 2.80);
  border: 2px solid var(--color_red);
  border-radius: 20px;
  overflow: hidden;
}

.slide a:hover img {
  transform: scale(1.05);
  border: 3px solid var(--color_red);
  border-radius: 20px;
  overflow: hidden;
}

@media screen and (max-width: 767px) {
  .slide  {
    margin: 4vw;
  }

}

.topics_slider.slick-initialized {
  opacity: 1;
}

.topics_slider .slide-arrow {
  bottom: 0;
  margin: auto 0;
  position: absolute;
  top: 0;
  width: 0;
	z-index: 999;
	background: none;
	border: none;
  outline:none;
  cursor: pointer;
}

.topics_slider .prev-arrow{
  vertical-align: middle;
	background: url("/img/slide_arrow_l.svg") center top no-repeat;
	background-size:cover;
	width: 45px;
	height: 45px;
	left:-5%;
}

@media screen and (max-width: 767px) {
  .topics_slider .prev-arrow{
    width: 6.4vw;
    height: 6.4vw;
    left:6.8%;
  }
}

.topics_slider .next-arrow {
  vertical-align: middle;
	background: url("/img/slide_arrow_r.svg") center top no-repeat;
	background-size:cover;
	width: 45px;
	height: 45px;
	right:-5%;
}

@media screen and (max-width: 767px) {
  .topics_slider .next-arrow{
    width: 6.4vw;
    height: 6.4vw;
    right:6.8%;
  }
}

.topics_slider a {
  outline:none;
  cursor: pointer;
}

/* ▽ ニュース --------------*/

.sec01_news_container {
  max-width: 800px;
  border: solid 2px var(--color_red);
  border-radius: 30px;
  margin: 0 auto calc(75/1024*100%);
  padding: calc(30/1024*100%) calc(40/1024*100%) calc(45/1024*100%);
  background-color: var(--color_white);
}

@media screen and (max-width: 767px) {
  .sec01_news_container {
    border-radius: 20px;
    margin: 0 auto calc(40/375*100%); 
    padding: calc(30/375*100%) calc(10/375*100%) calc(40/375*100%);
  }
}

.sec01_news_wrap {
  background-color: #ffffff;
  height: 10em;
  padding: 1em 2em 0em 1em;
  margin: calc(30/1024*100%) auto 0;
  overflow-y: scroll;
  -ms-overflow-style: none;
  /* IE, Edge 対応 */
  scrollbar-width: none;
  /* Firefox 対応 */
}

@media screen and (max-width: 767px) {
  .sec01_news_wrap {
    height: 20em;
    padding: 1em 1em 0em 1em;
    margin: calc(15/375*100%) auto 0;
  }
}

.sec01_news_wrap::-webkit-scrollbar {
  /* Chrome, Safari 対応 */
  display: none;
}

.sec01_news_wrap .simplebar-scrollbar::before {
  bottom: 0;
  left: 0;
  width: 4px;
  border-radius: 1em;
  background: var(--color_red);
  opacity: 1;
}

@media screen and (max-width: 767px) {
  .sec01_news_wrap .simplebar-scrollbar::before {
    height: 40%;
  }
}

.sec01_news_wrap .simplebar-track {
  -webkit-transform: translateY(-50%);
  top: 50%;
  width: 4px !important;
  height: 100%;
  transform: translateY(-50%);
  border-radius: 1em;
  background: #e6e6e6;
}

.sec01_news_wrap-noscroll {
  background-color: #ffffff;
  padding: 1em 2em 0em 1em;
  margin: calc(30/1024*100%) auto 0;
}

@media screen and (max-width: 767px) {
  .sec01_news_wrap-noscroll {
    padding: 1em 1em 0em 1em;
    margin: calc(15/375*100%) auto 0;
  }
}

li.news_item {
  display: flex;
  align-items: flex-start;
  font-size: 12px;
  font-weight: 500;
  line-height: 1.6;
}

@media screen and (max-width: 767px) {
  li.news_item {
    display: flex;
    align-items: flex-start;
    flex-wrap: wrap;
    font-size: 12px;
    font-size: 3.0vw
  }
}

.news_day {
  color: var(--color_red);
  margin-right: 1em;
}

.news_category {
  min-width: 8em;
  background-color: var(--color_red);
  border-radius: 9999px;
  text-align: center;
  color: var(--color_white);
  margin-right: 1em;
  display: inline-block;
  padding-bottom: .2em;
}

@media screen and (max-width: 767px) {
  .news_category {
    margin-right: 0em;
    margin-bottom: .5em;
    display: inline-block;
    padding-bottom: 0em;
  }
}

.news_ttl {
  color: var(--color_red);
  margin-bottom: 2em;
}

.news_ttl .notes {
  font-size: 85%;
  text-indent: -1em;
  padding-left: 1em;
  margin-top: .5em;
}

.news_ttl_flex {
  display: flex;
  align-items: center;
  margin-bottom: 2em;
  min-height: 2em;
}

.news_ttl_flex img {
  width: 55% !important;
  display: inline-block;
}

@media screen and (max-width: 767px) {
  .news_ttl_flex img {
    width: 100% !important;
    display: inline-block;
  }
}

/* ▽ 結果発表 --------------*/

.sec01_result_container {
  max-width: 810px;
  margin: calc(90/1024*100%) auto 0;
  background: url(/img/sec_result_bg.jpg) repeat-y center top;
  padding: 5px;
}

@media screen and (max-width: 767px) {
  .sec01_result_container {
    margin: calc(50/315*100%) auto 0;
    background: url(/img/sec_result_bg_sp.jpg) repeat-y center top;
    padding: .8vw;
  }
}

h2 + .sec01_result_image {
  padding-top: 5px;
}

@media screen and (max-width: 767px) {
  h2 + .sec01_result_image {
    padding-top: .8vw;
  }
}

.sec01_result_wrap {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  gap: 5px;
  list-style: none;
  padding-top: 5px;
}

@media screen and (max-width: 767px) {
  .sec01_result_wrap {
    gap: .8vw;
    padding-top: .8vw;
  }
}

.sec01_result_wrap .sec01_result_image {
  width: calc(397/800*100%);
}

@media screen and (max-width: 767px) {
  .sec01_result_wrap .sec01_result_image {
    width: 100%;
  }
}

/* ▽ あったらうれしい --------------*/

.sec01_if_container {
  max-width: 810px;
  margin: 0 auto calc(90/1024*100%);
  background-color: var(--color_red);
  padding: calc(40/1024*100%) calc(70/1024*100%) calc(90/1024*100%);
}

@media screen and (max-width: 767px) {
  .sec01_if_container {
    margin: 0 auto calc(60/315*100%);
    padding: calc(25/315*100%) calc(15/315*100%) calc(35/315*100%);
  }
}

.sec01_if_ttl {
  width: calc(650/670*100%);
  margin: 0 auto;
}

@media screen and (max-width: 767px) {
  .sec01_if_ttl {
    width: 100%;
    margin: 0 auto;
  }
}

.sec01_if_ttl_lead {
  font-size: 14px;
  color: var(--color_white);
  line-height: 1.8;
  font-weight: 600;
  text-align: center;
  margin: calc(20/670*100%) auto 0;
}

@media screen and (max-width: 1000px) {
  .sec01_if_ttl_lead {
    font-size: 1.4vw;
  }
}

@media screen and (max-width: 767px) {
  .sec01_if_ttl_lead {
    font-size: 3.2vw;
    margin: calc(15/285*100%) auto 0;
  }
}

.sec01_if_wrap {
  width: 100%;
  margin: calc(40/670*100%) auto 0;
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 40px calc(40/670*100%);
  list-style: none;
}

@media screen and (max-width: 767px) {
  .sec01_if_wrap {
    width: calc(250/285*100%);
    margin: calc(25/285*100%) auto 0;
    flex-direction: column;
    gap: 8vw;
  }
}

.sec01_if_wrap .sec01_if_box {
  width: calc(295/670*100%);
  padding: calc(20/670*100%) calc(10/670*100%);
  background-color: var(--color_white);
  border-radius: 50px;
}

@media screen and (max-width: 767px) {
  .sec01_if_wrap .sec01_if_box {
    width: 100%;
    padding: calc(20/250*100%);
    border-radius: 9.3vw;
  }
}

.sec01_if_wrap .sec01_if_box img {
  width: calc(274/295*100%) !important;
  margin: 0 auto;
}

.sec01_if_wrap .sec01_if_box p {
  font-size: 13px;
  text-align: center;
  font-weight: 600;
  line-height: 1.5;
  margin: 1em auto 0;
}

@media screen and (max-width: 1000px) {
  .sec01_if_wrap .sec01_if_box p {
    font-size: 1.4vw;
  }
}

@media screen and (max-width: 767px) {
  .sec01_if_wrap .sec01_if_box p {
    font-size: 3.2vw;
  }
}



/* ▽ インフォメーション --------------*/

.sec01_info_container {
  max-width: 750px;
  background-image: url(/img/sec01_info_bg_pc.png);
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  padding: calc(50/1024*100%) calc(60/1024*100%) calc(40/1024*100%);
  margin: 0 auto;
  color: var(--color_white);
  font-weight: 700;
  line-height: 1.6;
}

@media screen and (max-width: 767px) {
  .sec01_info_container {
    width: 108%;
    background-image: url(/img/sec01_info_bg_sp.png);
    padding: calc(30/315*100%) calc(40/315*100%) calc(35/315*100%);
    margin: 0 0 0 -4%;
    color: var(--color_white);
    font-weight: 700;
    line-height: 1.6;
  }
}

.sec01_info_ttl_wrap {
  display: flex;
  justify-content: center;
  align-items: center;
  gap:0 1em;
  margin-bottom: calc(30/550*100%);
}

@media screen and (max-width: 767px) {
  .sec01_info_ttl_wrap {
    flex-direction: column;
    gap:.3em 0;
  }
}

.sec01_info_day {
  border-bottom: 1px solid var(--color_white);
  font-size: 17px;
  font-weight: 600;
  padding: 0 0 .2em 0;
}

@media screen and (max-width: 767px) {
  .sec01_info_day {
    font-size: 15px;
    font-size: 4vw;
  }
}

.sec01_info_ttl {
  font-size: 15px;
}

@media screen and (max-width: 767px) {
  .sec01_info_ttl {
    font-size: 15px;
    font-size: 4.4vw;
  }
}

.sec01_info_wrap {
  display: flex;
  align-items: center;
  justify-content: center;
  gap:0 1em;
  width: 70%;
  margin: 0 auto calc(30/550*100%);
}

@media screen and (max-width: 767px) {
  .sec01_info_wrap {
    display: flex;
    align-items: center;
    justify-content: center;
    gap:0 1em;
    width: 100%;
    margin: 0 auto calc(20/282*100%);
  }
}

.sec01_info {
  width: 54%;
  font-size: 16px;
}

@media screen and (max-width: 767px) {
  .sec01_info {
    width: 30%;
    font-size: 13px;
    font-size: 3.6vw;
    flex-shrink: 1;
  }
}

.sec01_info_notes {
  font-size: 75%;
  margin-top: 1em;
}

.sec01_info_notes02 {
  font-size: 65%;
  margin-top: .5em;
  text-indent: -1em;
  padding-left: 1em;
}

@media screen and (max-width: 767px) {
  .sec01_info_notes {
    font-size: 10px;
    font-size: 2.8vw;
    margin-top: .5em;
  }

  .sec01_info_notes {
    font-size: 2.8vw;
  }
}

.sec01_info_image {
  width: 42%;
  display: block;
}

@media screen and (max-width: 767px) {
  .sec01_info_image {
    width: 45%;
  }
}

.sec01_info_image_shadow {
  filter:drop-shadow(3px 3px 3px rgba(49, 0, 0, .5));
}


.sec01_info_youtube {
  width: 45%;
  margin: 0 auto;
}

@media screen and (max-width: 767px) {
  .sec01_info_youtube {
    width: 78%;
    margin: calc(20/282*100%) auto 0;
  }
}

.sec01_info_youtube_notes {
  font-size: 12px;
  font-weight: 500;
  text-align: center;
  margin-top: 1em;
}

.sec01_info_youtube_notes img {
  width: 40% !important;
  margin: 0 auto;
  transform: scale(1);
}

@media screen and (max-width: 767px) {
  .sec01_info_youtube_notes {
    font-size: 12px;
    font-size: 3.2vw;
  }
}

.sec01_info_youtube .select img {
  display: block;
  transition: all .4s cubic-bezier(0.55, -1.30, 0.30, 2.80);
}

.sec01_info_youtube .select:hover img {
  transform: scale(1.1);
}

.sec01_info .image_ttl {
  width: 85% !important;
}

@media screen and (max-width: 767px) {
  .sec01_info .image_ttl {
    width: 100% !important;
  }
}

.sec01_info_notes .image_text {
  width: 95% !important;
}

@media screen and (max-width: 767px) {
  .sec01_info_notes .image_text {
    width: 80% !important;
    margin: 0 auto;
  }
}


/*--------------
セクション02
--------------*/

#yakioni .sec02 {
  background-image: url(/img/sec02_image_pc.png), url(/img/sec02_bg.jpg) ;
  background-repeat: no-repeat, repeat;
  background-position: center bottom, center top;
  background-size: 100% auto, auto;
  padding-bottom: calc(600/1440*100%);
}


@media screen and (max-width: 767px) {
  #yakioni .sec02 {
    background-image: url(/img/sec02_image_sp.png), url(/img/sec02_bg.jpg);
    padding-bottom: calc(220/315*100%);
  }
}

#yakioni .sec02_container {
  padding: calc(120/1024*100%) 0 0;
  position: relative;
}


@media screen and (max-width: 767px) {
  #yakioni .sec02_container {
    padding: calc(70/315*100%) 0 0;
  }
}

#yakioni .sec02_cloud01 {
  width: calc(83/1024*100%);
  transform: rotate(-9deg);
  position: absolute;
  top:0;
  left:0;
  margin: calc(170/1024*100%) 0 0 calc(-120/1024*100%);
  animation:floating-y01 5s ease-in-out infinite alternate-reverse;
}

@keyframes floating-y01 {
  0%, 100% {
    transform: translateY(0);
  }
  25% {
    transform: translateY(-5px); 
  }
  75% {
    transform: translateY(5px); 
  }
}

@media screen and (max-width: 767px) {
  #yakioni .sec02_cloud01 {
    width: calc(36/315*100%);
    transform: rotate(-9deg);
    position: absolute;
    top:0;
    left:0;
    margin: calc(28/315*100%) 0 0 calc(48/318*100%);
  }
}

#yakioni .sec02_cloud02 {
  width: calc(75/1024*100%);
  transform: rotate(-350deg);
  position: absolute;
  top:0;
  left:0;
  margin: calc(287/1024*100%) calc(72/1024*100%) 0 0 ;
  animation: floating-y02 7s ease-in-out infinite alternate-reverse;
}

@keyframes floating-y02 {
  0%, 100% {
    transform: translateY(0); 
  }
  15% {
    transform: translateY(7px); 
  }
  50% {
    transform: translateY(-7px); 
  }
  75% {
    transform: translateY(3px); 
  }
}

@media screen and (max-width: 767px) {
  #yakioni .sec02_cloud02 {
    width: calc(33/315*100%);
    margin: calc(63/315*100%) 0 0 calc(-40/315*100%);
  }
}

#yakioni .sec02_cloud03 {
  width: calc(81/1024*100%);
  transform: rotate(-12deg);
  position: absolute;
  top:0;
  right:0;
  margin: calc(234/1024*100%) 0 0 calc(72/1024*100%) ;
  animation: floating-y03 5s ease-in-out infinite alternate-reverse;
}

@keyframes floating-y03 {
  0%, 100% {
    transform: translateY(0);
  }
  15% {
    transform: translateY(-10px); 
  }
  50% {
    transform: translateY(-5px); 
  }
  75% {
    transform: translateY(7px); 
  }
}

@media screen and (max-width: 767px) {
  #yakioni .sec02_cloud03 {
    width: calc(36/315*100%);
    margin: calc(70/315*100%) calc(-30/315*100%) 0 0 ;
  }
}

#yakioni .sec02_cloud04 {
  width: calc(76/1440*100%);
  transform: rotate(-347deg);
  position: absolute;
  top:0;
  right:0;
  margin: calc(103/1440*100%) calc(-113/1440*100%) 0 0;
  animation: floating-y04 4s ease-in-out infinite alternate-reverse;
}

@keyframes floating-y04 {
  0%, 100% {
    transform: translateY(0);
  }
  25% {
    transform: translateY(10px); 
  }
  75% {
    transform: translateY(-3px); 
  }
}

@media screen and (max-width: 767px) {
  #yakioni .sec02_cloud04 {
    width: calc(35/315*100%);
    margin: calc(20/315*100%) calc(62/315*100%) 0 0 ;
  }
}

#yakioni .sec02_ttl {
  width: calc(514/1024*100%);
  margin: 0 auto calc(60/1024*100%);
}

@media screen and (max-width: 767px) {
  #yakioni .sec02_ttl {
    width: calc(206/315*100%);
    margin: 0 auto calc(40/315*100%);
  }
}

#yakioni .sec02_lead {
  font-size: 20px;
  font-size: 18px;
  line-height: 1.8;
  font-weight: 700;
  text-align: center;
  color: var(--color_white);
}

@media screen and (max-width: 767px) {
  #yakioni .sec02_lead {
    font-size: 13px;
    font-size: 3.6vw;
    line-height: 2.0;
  }
}

#yakioni .sec02_lead span {
  font-size: 150%;
  line-height: 1.4;
}

@media screen and (max-width: 767px) {
  #yakioni .sec02_lead span {
    font-size: 170%;
  }
}

#yakioni .sec02_family {
  width: calc(490/1024*100%);
  margin: calc(55/1024*100%) auto calc(110/1024*100%);
}

@media screen and (max-width: 767px) {
  #yakioni .sec02_family {
    width: 100%;
    margin: calc(40/315*100%) auto calc(80/315*100%);
  }
}

#yakioni .sec02_kodawari_ttl {
  max-width: 840px;
  margin: 0 auto calc(70/1024*100%);
  align-items: center;
  display: flex;
  font-size: 35px;
  font-weight: 700;
  color: var(--color_white);
  line-height: 1;
}

@media screen and (max-width: 767px) {
  #yakioni .sec02_kodawari_ttl {
    margin: 0 auto calc(30/315*100%);
    font-size: 18px;
    font-size: 4.8vw;
  }
}

#yakioni .sec02_kodawari_ttl::before,
#yakioni .sec02_kodawari_ttl::after {
  content: "";
  flex-grow: 1;
  height: 5px;
  border-top: 5px dotted var(--color_white);
}

@media screen and (max-width: 767px) {
  #yakioni .sec02_kodawari_ttl::before,
  #yakioni .sec02_kodawari_ttl::after {
    content: "";
    flex-grow: 1;
    height: 3px;
    border-top: 3px dotted var(--color_white);
  }
}


#yakioni .sec02_kodawari_ttl::before {
  margin-right: .5em; /* 文字との余白 */
}
#yakioni .sec02_kodawari_ttl::after {
  margin-left: .5em /* 文字との余白 */
}

#yakioni .sec02_kodawari_container {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap:34px calc(36/1024*100%);
}

@media screen and (max-width: 767px) {
  #yakioni .sec02_kodawari_container {
    flex-direction: column;
    gap:1em;
  }
}

#yakioni .sec02_kodawari_wrap {
  width: calc(448/1024*100%);
  background-image: url(/img/sec02_kodawari_wrap_bg.png);
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center top;
  padding: calc(30/1024*100%) calc(40/1024*100%) calc(50/1024*100%);
  position: relative;
  display: flex;
  flex-direction: column;
}

@media screen and (max-width: 767px) {
  #yakioni .sec02_kodawari_wrap {
    width: 110%;
    margin: 0 0 0 -5% ;
    padding: calc(35/315*100%) calc(25/315*100%) calc(30/315*100%);
  }
}

#yakioni .sec02_kodawari_point {
  width: calc(76/448*100%);
  padding: 1em;
  background-image: url(/img/sec02_kodawari_point_bg.png);
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
  display: flex;
  flex-direction: column;
  align-items: center;
  color: var(--color_white);
  text-align: center;
  font-size: 14px;
  font-weight: 700;
  line-height: 1;
  position: absolute;
  top:0;
  left: 0;
  margin: 0 0 0 3%;
}

#yakioni .sec02_kodawari_point span {
  font-size: 250%;
}

@media screen and (max-width: 767px) {
  #yakioni .sec02_kodawari_point {
    width: calc(50/315*100%);
    padding: 1em;
    font-size: 10px;
    font-size: 2.8vw;
    margin: 0 0 0 7%;
  }
}

#yakioni .sec02_point_ttl {
  font-size: 20px;
  font-weight: 700;
  text-align: center;
  line-height: 1.2;
  color: var(--color_red);
  margin: 0;
  padding: 0;
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;
}

@media screen and (max-width: 767px) {
  #yakioni .sec02_point_ttl {
    font-size: 15px;
    font-size: 4.4vw;
  }
}

#yakioni .sec02_point_ttl span {
  display: block;
}

#yakioni .sec02_point_image {
  margin: .5em auto 1em;
  width: 80%;
}

#yakioni .sec02_point_text {
  font-size: 14px;
  text-align: center;
  line-height: 1.4;
  font-weight: 500;
}

@media screen and (max-width: 1000px) {
  #yakioni .sec02_point_text {
    font-size: 14px;
    font-size: 1.4vw;
  }
}

@media screen and (max-width: 767px) {
  #yakioni .sec02_point_text {
    font-size: 11px;
    font-size: 3.0vw;
  }
}

.sec02_intro_container {
  margin-top: calc(95/1024*100%);
}

@media screen and (max-width: 767px) {
  .sec02_intro_container {
    margin-top: calc(45/315*100%);
    padding-bottom: calc(40/315*100%);
  }
}

.sec02_intro_movie {
  width: calc(395/1024*100%);
  margin: calc(45/1024*100%) auto calc(20/1024*100%);
}

@media screen and (max-width: 767px) {
  .sec02_intro_movie {
    width: calc(246/315*100%);
    margin: calc(20/315*100%) auto calc(10/315*100%);
  }
}

.sec02_intro_movie img {
  display: block;
  transition: all .4s cubic-bezier(0.55, -1.30, 0.30, 2.80);
}

.sec02_intro_movie:hover img {
  transform: scale(1.1);
}

.sec02_intro_movie_ttl {
  font-size: 14px;
  font-weight: 500;
  color: var(--color_white);
  line-height: 1.5;
  text-align: center;
  margin-top: 1em;
}

@media screen and (max-width: 1000px) {
  .sec02_intro_movie_ttl {
    font-size: 1.4vw;
  }
}

@media screen and (max-width: 767px) {
  .sec02_intro_movie_ttl {
    font-size: 12px;
    font-size: 3.4vw;
    text-align: center;
    margin-top: .5em;
  }
}


/*--------------
セクション03
--------------*/

#yakioni .sec03_container {
  padding: calc(90/1024*100%) 0 calc(110/1024*100%);
}

@media screen and (max-width: 767px) {
  #yakioni .sec03_container  {
    padding: calc(40/315*100%) 0 calc(70/315*100%);
  }
}

#yakioni .sec03_lineup_container {
  max-width: 920px;
  margin: calc(25/1024*100%) auto 0;
  display: flex;
  justify-content: center;
  gap: 0 calc(25/1024*100%)
}

@media screen and (max-width: 767px) {
  #yakioni .sec03_lineup_container {
    margin: calc(40/315*100%) auto 0;
    flex-direction: column;
    gap: 10.6vw 0;
  }
}

#yakioni .sec03_lineup_wrap {
  display: flex;
  flex-direction: column;
  margin: 0 auto;
  position: relative;
  width: calc(290/920*100%);
}

@media screen and (max-width: 767px) {
  #yakioni .sec03_lineup_wrap {
    width: 100%;
  }
}

#yakioni .sec03_lineup_contents {
  background-color: var(--color_red);
  border-radius: 50%;
  color: var(--color_white);
  font-size: 11px;
  font-weight: 700;
  line-height: normal;
  text-align: center;
  display: block;
  position: absolute;
  top:0;
  right: 0;
  margin: 0 -2.5% 0 0;
  width: 65px;
  height: 65px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 0px; 
}

@media screen and (max-width: 767px) {
  #yakioni .sec03_lineup_contents {
    margin: 1.5% -3.5% 0 0;
  }
}

#yakioni .sec03_lineup_contents span {
  font-size: 220%;
  line-height: 1.2;
  padding: 0;
  margin: 0;
}

.sec03_lineup_new, .sec03_lineup_new_none {
  font-size: 25px;
  font-weight: 700;
  line-height: 1;
  color: var(--color_red);
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  margin-bottom: .5em;
}

.sec03_lineup_new_none {
  opacity: 0;
}

@media screen and (max-width: 1000px) {
  .sec03_lineup_new, .sec03_lineup_new_none {
    font-size: 2.5vw;
  }
}

@media screen and (max-width: 767px) {
  .sec03_lineup_new, .sec03_lineup_new_none {
    font-size: 4.8vw;
  }

  .sec03_lineup_new_none {
    display: none;
  }
}

.sec03_lineup_new::before,
.sec03_lineup_new::after {
  content: "";
  width: calc(14/290*100%);
  padding-top: calc(23/290*100%);
  background: url(/img/sec03_fukidashi_line.png) no-repeat center top / contain;
}

@media screen and (max-width: 767px) {
  .sec03_lineup_new::before,
  .sec03_lineup_new::after {
    width: calc(10/200*100%);
    padding-top: calc(17/200*100%);
  }
}

.sec03_lineup_new::before {
  margin-right: .5em;
}

.sec03_lineup_new::after {
  margin-left: .5em;
  transform: scale(-1, 1);
}

#yakioni .sec03_lineup_copy {
  font-size: 13px;
  font-weight: 700;
  line-height: 1.6;
  text-align: center;
  color: #231815;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: calc(10/290*100%) auto 0;
}

@media screen and (max-width: 1000px) {
  #yakioni .sec03_lineup_copy {
    font-size: 1.3vw;
  }
}

@media screen and (max-width: 767px) {
  #yakioni .sec03_lineup_copy {
    font-size: 12px;
    font-size: 3.2vw;
    margin: calc(5/315*100%) auto 0;
  }
}


#yakioni .sec03_lineup_image {
  width: calc(270/290*100%);
  margin: 0 auto;
}

@media screen and (max-width: 767px) {
  #yakioni .sec03_lineup_image {
    width: calc(180/315*100%);
    margin: 0 auto;
  }
}

#yakioni .sec03_lineup_ttl {
  font-size: 18px;
  font-weight: 700;
  text-align: center;
  margin-top: .5em;
}

@media screen and (max-width: 1000px) {
  #yakioni .sec03_lineup_ttl {
    font-size: 1.8vw;
  }
}

@media screen and (max-width: 767px) {
  #yakioni .sec03_lineup_ttl {
    font-size: 15px;
    font-size: 4.2vw;
  }
}

#yakioni .sec03_lineup_btn {
  width: calc(212/290*100%);
  margin: 1em auto 0;
  font-size: 18px;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--color_red);
  border-radius: 9999px;
  color: var(--color_red);
  font-weight: 500;
  line-height: 1;
  letter-spacing: .2em;
  padding: .7em .7em .9em ;
  text-decoration: none;
  position: relative;
  transition: .3s;
  background-color: var(--color_white);
}

@media screen and (max-width: 1000px) {
  #yakioni .sec03_lineup_btn {
    font-size: 1.8vw;
  }
  
}

@media screen and (max-width: 767px) {
  #yakioni .sec03_lineup_btn {
    width: calc(200/315*100%);
    margin: .7em auto 0;
    font-size: 15px;
    font-size: 4.4vw;
    padding: .7em ;
  }
  
}

#yakioni .sec03_lineup_btn::after {
  content: "";
  background-image: url(/img/arrow_r.svg);
  background-repeat: no-repeat;
  background-size: contain;
  width: 12px;
  height: 13px;
  top: 0;
  bottom: 0;
  right:0;
  margin: auto 7% auto 0 ;
  position: absolute;
}

#yakioni .sec03_lineup_btn:hover {
  color: var(--color_white);
  background-color: var(--color_red);
}

#yakioni .sec03_lineup_btn::after {
  content: "";
  background-image: url(/img/arrow_r.svg);
  background-repeat: no-repeat;
  background-size: contain;
  width: 12px;
  height: 13px;
  top: 0;
  bottom: 0;
  right:0;
  margin: auto 7% auto 0 ;
  position: absolute;
}

#yakioni .sec03_lineup_btn:hover::after {
  background-image: url(/img/arrow_w.svg);
}


/*--------------
セクション04
--------------*/

#yakioni .sec04 {
  background-image: url(/img/sec04_recipe_bg_pc.jpg);
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
}

@media screen and (max-width: 767px) {
  #yakioni .sec04 {
    background-image: url(/img/sec04_recipe_bg_sp.jpg);
  }
}

#yakioni .sec04_container {
  max-width: 800px;
  margin: 0 auto;
  padding: calc(60/1024*100%) 0 calc(90/1024*100%);
}

@media screen and (max-width: 767px) {
  #yakioni .sec04_container {
    margin: 0 auto;
    padding: calc(40/315*100%) 0 calc(40/315*100%);
  }
}

#yakioni .sec04_recipe_container {
  margin-top: calc(50/800*100%);
  display: flex;
  align-items: center;
  justify-content: center;
}

@media screen and (max-width: 767px) {
  #yakioni .sec04_recipe_container {
    margin-top: calc(30/315*100%);
    flex-direction: column;
  }
}

#yakioni .sec04_recipe_image {
  width: 50%;
}

@media screen and (max-width: 767px) {
  #yakioni .sec04_recipe_image {
    width: calc(210/315*100%);
    margin: 0 auto;
  }
}

#yakioni .sec04_recipe_contents {
  padding: 0 0 0 calc(30/800*100%);
}

@media screen and (max-width: 767px) {
  #yakioni .sec04_recipe_contents {
    padding: calc(15/315*100%) 0 0 0;
    width: 100%;
  }
}

#yakioni .sec04_recipe_text {
  font-size: 23px;
  font-weight: 700;
  line-height: 1.4;
  color: var(--color_white);
  margin-bottom: calc(50/400*100%);
}

@media screen and (max-width: 767px) {
  #yakioni .sec04_recipe_text {
    font-size: 15px;
    font-size: 4.4vw;
    line-height: 1.3;
    margin-bottom: calc(30/315*100%);
    text-align: center;
  }
}

#yakioni .sec04_recipe_text span {
  font-size: 120%;
}

#yakioni .sec04_recipe_btn {
  width: 100%;
  margin: 0 auto;
  font-size: 18px;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--color_red);
  border-radius: 9999px;
  color: var(--color_red);
  font-weight: 500;
  line-height: 1;
  padding: .5em .5em .7em ;
  text-decoration: none;
  position: relative;
  transition: .3s;
  background-color: var(--color_white);
}

@media screen and (max-width: 767px) {
  #yakioni .sec04_recipe_btn {
    width: calc(280/315*100%);
    width: 100%;
    font-size: 15px;
    font-size: 4.4vw;
    padding: .7em .7em .9em ;
  }
}

#yakioni .sec04_recipe_btn::after {
  content: "";
  background-image: url(/img/arrow_r.svg);
  background-repeat: no-repeat;
  background-size: contain;
  width: 12px;
  height: 13px;
  top: 0;
  bottom: 0;
  right:0;
  margin: auto 7% auto 0 ;
  position: absolute;
}

#yakioni .sec04_recipe_btn:hover {
  color: var(--color_white);
  background-color: var(--color_red);
}

#yakioni .sec04_recipe_btn::after {
  content: "";
  background-image: url(/img/arrow_r.svg);
  background-repeat: no-repeat;
  background-size: contain;
  width: 12px;
  height: 13px;
  top: 0;
  bottom: 0;
  right:0;
  margin: auto 7% auto 0 ;
  position: absolute;
}

#yakioni .sec04_recipe_btn:hover::after {
  background-image: url(/img/arrow_w.svg);
}

/*--------------
セクション05
--------------*/

#yakioni .sec05 {
  background-image: url(/img/sec02_bg.jpg) ;
  background-repeat: repeat;
  background-position: center top;
}

#yakioni .sec05_banner_container {
  margin: 0 auto;
  padding: calc(130/1024*100%) 0;
  display: flex;
  justify-content: space-around;
  align-items: center;
}

@media screen and (max-width: 767px) {
  #yakioni .sec05_banner_container {
    padding: calc(65/315*100%) calc(17/315*100%);
    flex-direction: column;
  }
}

#yakioni .sec05_banner {
  width: calc(410/1024*100%);
}

@media screen and (max-width: 767px) {
  #yakioni .sec05_banner {
    width: 100%;
  }

  #yakioni .sec05_banner:last-child {
    width: 100%;
    margin-top: calc(30/281*100%);
  }
}

#yakioni .sec05_banner a img {
  display: block;
  transition: all .4s cubic-bezier(0.55, -1.30, 0.30, 2.80);
  box-shadow: 5px 5px 3px rgba(136, 0, 0, 0.5);
}

#yakioni .sec05_banner a:hover img {
  transform: scale(1.05);
  box-shadow: 5px 5px 3px rgba(136, 0, 0, 0.5);
}

/* .sec05_banner_shadow {
  filter:drop-shadow(5px 5px 3px rgba(136, 0, 0, .5));
} */

.sec05_channel_container {
  max-width: 1280px;
  background-image: url(/img/sec05_channel_bg_pc.png);
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center top;
  margin: 0 auto;
  padding: 0 calc(128/1280*100%);
}

@media screen and (max-width: 767px) {
  .sec05_channel_container {
    background-image: url(/img/sec05_channel_bg_sp.png);
    background-size: contain;
    background-position: center top;
    padding: 0 calc(30/375*100%);
  }
}

.sec05_channel_flex {
  display: flex;
  margin: calc(30/1024*100%) auto 0;
  padding-bottom: calc(30/1024*100%);
  gap: 0 calc(24/1024*100%);
}

@media screen and (max-width: 767px) {
  .sec05_channel_flex {
    display: flex;
    flex-direction: column;
    margin: calc(15/315*100%) auto 0;
    padding: 0 calc(35/315*100%);
    gap: 20px 0;
  }
}

.sec05_channel {
  width: calc(325/1024*100);
  display: block;
}

.sec05_channel a img {
  display: block;
  transition: all .4s cubic-bezier(0.55, -1.30, 0.30, 2.80);
}

.sec05_channel a:hover img {
  transform: scale(1.05);
}

.sec05_channel {
  width: calc(325/1024*100);
  display: block;
}

.sec05_channel_ttl {
  font-size: 14px;
  font-weight: 700;
  color: var(--color_white);
  line-height: 1.5;
  text-align: center;
  margin-top: 1em;
}

@media screen and (max-width: 1000px) {
  .sec05_channel_ttl {
    font-size: 1.4vw;
  }
}

@media screen and (max-width: 767px) {
  .sec05_channel_ttl {
    font-size: 12px;
    font-size: 3.4vw;
    text-align: center;
    margin-top: .5em;
  }
}

.sec05_channel_ttl img {
  width: 57.6% !important;
  margin: .7em auto 0;
}

@media screen and (max-width: 767px) {
  .sec05_channel_ttl img {
    width: 60.6% !important;
    margin: .7em auto 0;
  }
}

#yakioni .sec05_youtube_btn {
  max-width: 410px;
  margin: calc(20/1024*100%) auto calc(60/1024*100%);
  font-size: 18px;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--color_white);
  border-radius: 9999px;
  color: var(--color_white);
  font-weight: 500;
  line-height: 1;
  padding: .5em .5em .7em ;
  text-decoration: none;
  position: relative;
  transition: .3s;
}


@media screen and (max-width: 767px) {
  #yakioni .sec05_youtube_btn {
    width: calc(280/315*100%);
    margin: calc(40/315*100%) auto calc(50/315*100%);
    font-size: 15px;
    font-size: 4.4vw;
    padding: .7em .7em .9em ;
  }
}

#yakioni .sec05_youtube_btn::after {
  content: "";
  background-image: url(/img/arrow_w.svg);
  background-repeat: no-repeat;
  background-size: contain;
  width: 12px;
  height: 13px;
  top: 0;
  bottom: 0;
  right:0;
  margin: auto 7% auto 0 ;
  position: absolute;
}

#yakioni .sec05_youtube_btn:hover {
  color: var(--color_red);
  background-color: var(--color_white);
}

#yakioni .sec05_youtube_btn::after {
  content: "";
  background-image: url(/img/arrow_w.svg);
  background-repeat: no-repeat;
  background-size: contain;
  width: 12px;
  height: 13px;
  top: 0;
  bottom: 0;
  right:0;
  margin: auto 7% auto 0 ;
  position: absolute;
}

#yakioni .sec05_youtube_btn:hover::after {
  background-image: url(/img/arrow_r.svg);
}

.sec05_factory_btn {
  width: calc(635/1024*100%);
  margin: calc(55/1024*100%) auto 0;
  padding-bottom: calc(75/1024*100%);
  display: block;
  transition: all .4s cubic-bezier(0.55, -1.30, 0.30, 2.80);
}

.sec05_factory_btn:hover{
  transform: scale(1.05);
}

@media screen and (max-width: 767px) {
  .sec05_factory_btn {
    width: calc(280/315*100%);
    margin: calc(50/315*100%) auto 0;
    padding-bottom: calc(50/315*100%);
    display: block;
    transition: all .4s cubic-bezier(0.55, -1.30, 0.30, 2.80);
  }
}


.sec05_foot_wrap {
  width: 100%;
  background-image: url(/img/sec02_bg.jpg);
  background-repeat: repeat;
  overflow: hidden;
  margin: 0 auto 5%;
  text-align: center;
}

.sec05_foot {
  background-color: var(--color_white);
  background-position: center top;
  border-top-left-radius: 100% 200%;
  border-top-right-radius: 100% 200%;
  padding-top: 15%;
  margin: 0 -5% 0;
  display: block;
}

@media screen and (max-width: 767px) {
  .sec05_foot_wrap {
    margin: 0 auto;
  }

  .sec05_foot {
    border-top-left-radius: 100% 200%;
    border-top-right-radius: 100% 200%;
    padding-top: 20%;
    display: block;
  }
}


/*--------------
セクション06
--------------*/

.sec06 {
  margin: -15% auto 0;
}

.sec06_container {
  margin: calc(60/1024*100%) auto 0;
}

.sec06_totop_container {
  margin: 0 auto;
  text-align: center;
}

.sec06_totop_btn {
  display: inline-block;
}

#yakioni a.sec06_totop_btn{
  text-decoration: none;
}

.sec06_totop_character {
  width: 76px;
  margin: 0 auto;
}

@media screen and (max-width: 767px) {
  .sec06_totop_character {
    width: calc(86/315*100);
    margin: 0 auto;
  }
}

.sec06_totop_text {
  font-family: var(--font_montserrat);
  color: var(--color_red);
  font-weight: 700;
  font-size: 12px;
  text-align: center;
  margin: 30px auto 1em;
  letter-spacing: .1em;
  line-height: 1;
}

@media screen and (max-width: 767px) {
  .sec06_totop_text {
    font-size: 17px;
    font-size: 4.6vw;
    text-align: center;
    margin: .5em auto .5em;
    letter-spacing: .1em;
  }
}

.sec06_totop_arrow {
  width: 12px;
  margin: 0 auto;
}

@media screen and (max-width: 767px) {
  .sec06_totop_arrow {
    width: 12px;
    margin: 0 auto;
  }
}

.sec06_sns_container {
  max-width: 570px;
  margin: calc(60/1024*100%) auto calc(80/1024*100%);
}

@media screen and (max-width: 767px) {
  .sec06_sns_container {
    width: 100%;
    margin: calc(30/315*100%) auto calc(50/315*100%);
    padding: 0 calc(17/315*100%);
  }
}

.sec06_sns_ttl {
  margin: calc(10/570*100%) 0 .2em;
  font-family: var(--font_montserrat);
  font-weight: 700;
  font-size: 12px;
}

@media screen and (max-width: 767px) {
  .sec06_sns_ttl {
    margin: calc(10/281*100%) 0 .2em;
    font-family: var(--font_montserrat);
    font-weight: 700;
    font-size: 10px;
  }
}

.sec06_sns_flex {
  display: flex;
  justify-content: center;
  align-items: center;
  gap:0 calc(20/570*100%);
}

@media screen and (max-width: 767px) {
  .sec06_sns_flex {
    flex-wrap: wrap;
    gap:9px calc(9/281*100%);
  }
}

.sec06_sns {
  width: calc(127/570*100%);
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 10px;
  padding: max(30px, calc(30/570*100%));
}

@media screen and (max-width: 767px) {
  .sec06_sns {
    width: calc(136/281*100%);
    padding: max(30px, calc(30/281*100%));
  }
}

.sec06_sns:nth-child(1) {
  background-color: #000;
}

.sec06_sns:nth-child(2) {
  background: url(/img/instagram_bg.webp);
  background-size: cover;
}

.sec06_sns:nth-child(3) {
  background: #0866ff;
}

.sec06_sns:nth-child(4) {
  background: #FF0000; 
}

.sns_logo {
  width: max(32px, calc(32/127*100%));
  
}

.sns_logo img {
  -webkit-transition: ease .2s;
  transition: ease .2s;
}

.sec06_sns:hover .sns_logo img  {
  transform: scale(1.2,1.2);
}

.sec06_online_container {
  margin: calc(75/1024*100%) auto calc(80/1024*100%);
}

@media screen and (max-width: 767px) {
  .sec06_online_container {
    margin: calc(40/315*100%) auto calc(50/315*100%);
  }
}

.sec06_online_flex {
  margin: calc(30/1024*100%) auto 0;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 0 calc(30/1024*100%);
}

@media screen and (max-width: 767px) {
  .sec06_online_flex {
    margin: calc(10/315*100%) auto 0;
    display: flex;
    flex-direction: column;
    gap: 20px 0;
    padding: 0 calc(17/315*100%);
  }
}

.sec06_online {
  width: calc(410/1024*100%);
  display: block;
}

@media screen and (max-width: 767px) {
  .sec06_online {
    width: 100%;
  }
}

#yakioni .sec06_online_btn {
  width: 100%;
  margin: 0 auto;
  font-size: 18px;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--color_red);
  border-radius: 9999px;
  color: var(--color_red);
  font-weight: 500;
  line-height: 1;
  padding: .7em .7em .9em ;
  text-decoration: none;
  position: relative;
  transition: .3s;
  background-color: var(--color_white);
}

@media screen and (max-width: 1000px) {
  #yakioni .sec06_online_btn {
    font-size: 1.8vw;
  }
}

@media screen and (max-width: 767px) {
  #yakioni .sec06_online_btn {
    width: calc(280/315*100%);
    width: 100%;
    font-size: 15px;
    font-size: 3.8vw;
    padding: .7em .7em .9em ;
  }
}

#yakioni .sec06_online_btn:hover {
  color: var(--color_white);
  background-color: var(--color_red);
}

#yakioni .sec06_online_btn::after {
  content: "";
  background-image: url(/img/arrow_r.svg);
  background-repeat: no-repeat;
  background-size: contain;
  width: 12px;
  height: 13px;
  top: 0;
  bottom: 0;
  right:0;
  margin: auto 7% auto 0 ;
  position: absolute;
}

@media screen and (max-width: 767px) {
  #yakioni .sec06_online_btn::after {
    content: "";
    width: 10px;
    height: 11px;
    margin: auto 4% auto 0 ;
  }
}

#yakioni .sec06_online_btn:hover::after {
  background-image: url(/img/arrow_w.svg);
}

/*----------------------------

▼中ページ共通

----------------------------*/

.btn_back {
  width: 50px;
  margin: 0 auto;
  padding: calc(80/1024*100%) 0;
  display: block;
  transition: .5s;
}

@media screen and (max-width: 767px) {
  .btn_back {
    width: calc(35/315*100%);
    padding: calc(30/315*100%) 0;
  }
}

.btn_back:hover {
  opacity: .5;
}


/*----------------------------

▼キャラクターページ

----------------------------*/

@keyframes infinity-scroll-left {
  from {
    transform: translateX(0);
  }
    to {
    transform: translateX(-100%);
  }
  }
  .scroll-infinity__wrap {
    display: flex;
    overflow: hidden;
  }
  .scroll-infinity__list {
    display: flex;
    list-style: none;
    padding: 0
  }
  .scroll-infinity__list--left {
    animation: infinity-scroll-left 80s infinite linear 0.5s both;
  }
  .scroll-infinity__item {
    width: calc(100vw / 7);
  }

  @media screen and (max-width: 767px) {
    .scroll-infinity__item {
      width: calc(100vw / 4);
    }
  }

  .scroll-infinity__item>img {
    width: 100%;
  }

/*--------------
セクション_おにぎり町のなかまたち
--------------*/
.sec_character {
  background-image: url(/character/img/character_nakama_bg.jpg);
  background-repeat: repeat;
  background-position: center;
}

@media screen and (max-width: 767px) {
  .sec_character {
    background-image: url(/character/img/character_nakama_bg.jpg);
    background-repeat: repeat;
    background-position: center;
  }
}

.sec_character_container {
  padding: calc(120/1024*100%) 0 ;
}

@media screen and (max-width: 767px) {
  .sec_character_container {
    padding: calc(50/315*100%) 0 calc(35/315*100%);
  }
}

.sec_character_wrap {
  max-width: 940px;
  margin: 0 auto;
  border: 2px solid var(--color_white);
  background-image: url(/character/img/character_nakama_image_bg_pc.jpg);
  background-repeat: repeat;
  background-size: cover;
  background-position: center;
  padding: calc(60/1024*100%) 0 calc(290/1024*100%);
  position: relative;
}

@media screen and (max-width: 767px) {
  .sec_character_wrap {
    margin: 0 auto;
    border: 1px solid var(--color_white);
    background-image: url(/character/img/character_nakama_image_bg_sp.jpg);
    background-size: cover;
    padding: calc(35/315*100%) 0 calc(107/315*100%);
  }
}

.sec_character_ttl {
  max-width: 14em;
  font-size: 30px;
  color: var(--color_character_text);
  font-weight: 900;
  background-color: var(--color_white);
  border-radius: 9999px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: .5em;
  position: absolute;
  top:0;
  left: 0;
  right: 0;
  margin: -4.2% auto 0;
}

@media screen and (max-width: 767px) {
  .sec_character_ttl {
    font-size: 18px;
    color: var(--color_character_text);
    padding: .3em;
    top:0;
    left: 0;
    right: 0;
    margin: -6.2% auto 0;
  }
}

.sec_character_ttl h1 {
  margin:0;
  padding: 0;
  font-weight: inherit;
  display: inline-block;
}

/*--------------
セクション_セクション_おにおの名曲たち
--------------*/

.sec_song {
  background-image: url(/character/img/character_song_bg.jpg);
  background-repeat: repeat;
  position: relative;
}

.sec_song::after {
  content: "";
  width: calc(300/1440*100%);
  padding-top: calc(305/1440*100%);
  background-image: url(/character/img/character_bg_record.png);
  background-repeat: no-repeat;
  background-size: contain;
  background-position: bottom right;
  position: absolute;
  bottom: 0;
  right: 0;
  display: block;
}

@media screen and (max-width: 767px) {
  .sec_song::after {
    width: calc(100/315*100%);
    padding-top: calc(103/315*100%);
  }
}

.sec_song_container {
  padding: calc(75/1024*100%) 0 calc(110/1024*100%);
  position: relative;
}

@media screen and (max-width: 767px) {
  .sec_song_container {
    padding: calc(50/315*100%) 0 calc(140/375*100%);
  }
}

.sec_song_onpu01 {
  width: calc(64/1024*100%);
  position: absolute;
  top:0;
  right: 0;
  margin: calc(92/1024*100%) calc(-52/1024*100%) 0 0 ;
}

@media screen and (max-width: 767px) {
  .sec_song_onpu01 {
    width: calc(42/315*100%);
    margin: calc(37/315*100%) calc(-10/315*100%) 0 0 ;
  }
}

.sec_song_onpu02 {
  width: calc(35/1024*100%);
  position: absolute;
  top:0;
  left: 0;
  margin: calc(455/1024*100%) 0 0 calc(-62/1024*100%);
}

@media screen and (max-width: 767px) {
  .sec_song_onpu02 {
    width: calc(20/315*100%);
    margin: calc(291/315*100%) 0 0 calc(-17/315*100%);
  }
}

.sec_song_onpu03  {
  width: calc(23/1024*100%);
  position: absolute;
  bottom:0;
  right: 0;
  margin: 0 calc(220/1024*100%) calc(32/1024*100%) 0;
  z-index: 1;
}

@media screen and (max-width: 767px) {
  .sec_song_onpu03  {
    width: calc(13/315*100%);
    bottom:auto;
    top:0;
    margin: calc(516/315*100%) calc(-14/315*100%) 0 0;
  }
}

.sec_song_onpu04 {
  display: none;
}

@media screen and (max-width: 767px) {
  .sec_song_onpu04 {
    display: block;
    width: calc(14/315*100%);
    position: absolute;
    bottom:0;
    left: 0;
    margin: 0 0 calc(350/315*100%) calc(5/315*100%) ;
  }
}

.sec_song_onpu05 {
  display: none;
}

@media screen and (max-width: 767px) {
  .sec_song_onpu05 {
    display: block;
    width: calc(24/315*100%);
    position: absolute;
    bottom:0;
    left: 0;
    margin: 0 0 calc(330/315*100%) calc(-20/315*100%) ;
    transform: rotate(-32deg);
  }
}

.sec_song_onpu06 {
  display: none;
}

@media screen and (max-width: 767px) {
  .sec_song_onpu06 {
    display: block;
    width: calc(22/315*100%);
    position: absolute;
    bottom:0;
    right: 0;
    margin: 0 calc(-15/315*100%) calc(213/315*100%) 0 ;
  }
}

.sec_song_onpu07 {
  display: none;
}

@media screen and (max-width: 767px) {
  .sec_song_onpu07 {
    display: block;
    width: calc(15/315*100%);
    position: absolute;
    bottom:0;
    left: 0;
    margin: 0 0 calc(40/315*100%) calc(115/315*100%) ;
    transform: rotate(-318deg);
  }
}

.sec_song_ttl {
  width: calc(378/1024*100%);
  margin: 0 auto calc(70/1024*100%);
  display: flex;
  align-items: center;
  justify-content: center;
  background-image: url(/character/img/character_song_ttl_bg.png);
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
  text-align: center;
  padding: .1em;
}

.sec_song_ttl h2 {
  font-size: 30px;
  font-weight: 900;
  color: var(--color_character_text);
  text-align: center;
}

@media screen and (max-width: 767px) {
  .sec_song_ttl {
    width: calc(200/315*100%);
    margin: 0 auto calc(30/315*100%);
  }

  .sec_song_ttl h2 {  
    font-size: 18px;
    font-size: 4.8vw;
  }
}

.sec_song_flex {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 40px calc(27/1024*100%);
}

@media screen and (max-width: 767px) {
  .sec_song_flex {
    flex-direction: column;
    gap: 30px 0;
    width: calc(246/315*100%);
    margin: 0 auto;
  }
}

.sec_song_youtube {
  width: calc(321/1024*100%);
}

@media screen and (max-width: 767px) {
  .sec_song_youtube {
    width: 100%;
  }
}

.sec_song_youtube a img {
  display: block;
  transition: all .4s cubic-bezier(0.55, -1.30, 0.30, 2.80);
}

.sec_song_youtube a:hover img {
  transform: scale(1.05);
}

.song_ttl {
  font-size: 14px;
  font-weight: 700;
  text-align: center;
  margin: .5em auto 0;
  color: var(--color_character_text);
}


@media screen and (max-width: 767px) {
  .song_ttl {
    font-size: 12px;
    font-size: 3.4vw;
  }
}

/*----------------------------

▼ヒストリーページ

----------------------------*/

.history {
  background-image: url(/history/img/history_bg_pc.jpg);
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center top;
}

@media screen and (max-width: 767px) {
  .history {
    background-image: url(/history/img/history_bg_sp.jpg);
  }
}

.history_ttl {
  width: calc(914/1024*100%);
  margin: 0 auto;
  padding-top: calc(85/1024*100%);
}

@media screen and (max-width: 767px) {
  .history_ttl {
    width: 100%;
    margin: 0 auto;
    padding-top: calc(20/315*100%);
  }
}

.history_family_lead {
  margin: calc(30/1024*100%) auto;
  font-size: 35px;
  font-weight: 700;
  text-align: center;
  line-height: 1.4;
  color: var(--color_red);
}

@media screen and (max-width: 767px) {
  .history_family_lead {
    margin: calc(30/315*100%) auto calc(30/315*100%);
    font-size: 22px;
    font-size: 5.6vw;
  }
}

.history_family_image {
  width: calc(490/1024*100%);
  margin: 0 auto;
  padding-bottom: calc(110/1024*100%);
}

@media screen and (max-width: 767px) {
  .history_family_image {
    width: 100%;
    margin: 0 auto;
    padding-bottom: calc(60/315*100%);
  }
}

/*--------------
ヒストリー メソッド
--------------*/

.history_sku_shadow {
  filter:drop-shadow(5px 5px 5px rgba(49, 0, 0, .5));
}

@media screen and (max-width: 767px) {
  .history_sku_shadow {
    filter:drop-shadow(3px 3px 3px rgba(49, 0, 0, .5));
  }
}

/*--------------
ヒストリーメイン
--------------*/

.history_image_wrap {
  max-width: 1024px;
  margin: calc(30/1024*100%) auto 0;
}

@media screen and (max-width: 767px) {
  .history_image_wrap {
    margin: 0 auto;
  }
}

.history_position {
  position: relative;
}

.history_btn {
  width: calc(219/1024*100%);
  position: absolute;
  bottom:0;
  left: 0;
  display: block;
  margin: 0 0 calc(45/1024*100%) calc(165/1024*100%);
}

@media screen and (max-width: 767px) {
  .history_btn {
    width: calc(398/638*100%);
    margin: 0 0 calc(24/638*100%) calc(123/638*100%);
  }
}

#yakioni .history_btn_character {
  width: 100%;
  margin: 0 auto;
  font-size: 14px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 9999px;
  color: var(--color_white);
  background-color: var(--color_red);
  font-weight: 500;
  line-height: 1;
  padding: .5em .5em .6em ;
  text-decoration: none;
  position: relative;
  transition: .3s;
  border: 1px solid var(--color_red);
}

@media screen and (max-width: 767px) {
  #yakioni .history_btn_character {
    font-size: 14px;
    font-size: 3.6vw;
    padding: .7em .7em .9em ;
  }
}

#yakioni .history_btn_character::after {
  content: "";
  background-image: url(/img/arrow_w.svg);
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
  width: calc(10/220*100%);
  padding-top: calc(10/220*100%);
  top: 0;
  bottom: 0;
  right:0;
  margin: auto 4.5% auto 0 ;
  position: absolute;
}

#yakioni .history_btn_character:hover {
  color: var(--color_red);
  background-color: var(--color_white);
}

#yakioni .history_btn_character:hover::after {
  background-image: url(/img/arrow_r.svg);
}

.history_2024_kyushu_wrap {
  width: calc(189/1024*100%);
  position: absolute;
  top: 0;
  left:0;
  margin: calc(21/1024*100%) 0 0 calc(268/1024*100%);
}

@media screen and (max-width: 767px) {
  .history_2024_kyushu_wrap {
    width: calc(172/319*100%);
    position: absolute;
    top: 0;
    left:auto;
    right:0;
    margin: calc(292/319*100%) 0 0 0;
  }
}

.history_2024_kyushu_wrap a img {
  display: block;
  transition: all .4s cubic-bezier(0.55, -1.30, 0.30, 2.80);
}

.history_2024_kyushu_wrap a:hover img {
  transform: scale(1.05);
}

.history_2024_limited_wrap {
  width: calc(189/1024*100%);
  position: absolute;
  top: 0;
  left:0;
  margin: calc(215/1024*100%) 0 0 calc(268/1024*100%);
}

@media screen and (max-width: 767px) {
  .history_2024_limited_wrap {
    width: calc(172/319*100%);
    position: absolute;
    top: 0;
    left:auto;
    right:0;
    margin: calc(474/319*100%) 0 0 0;
  }
}

.history_2024_limited_wrap a img {
  display: block;
  transition: all .4s cubic-bezier(0.55, -1.30, 0.30, 2.80);
}

.history_2024_limited_wrap a:hover img {
  transform: scale(1.05);
}

.history_2024_kansai_wrap {
  width: calc(189/1024*100%);
  position: absolute;
  top: 0;
  left:0;
  margin: calc(353/1024*100%) 0 0 calc(268/1024*100%);
}

@media screen and (max-width: 767px) {
  .history_2024_kansai_wrap {
    width: calc(172/319*100%);
    position: absolute;
    top: 0;
    left:auto;
    right:0;
    margin: calc(605/319*100%) 0 0 0;
  }
}

.history_2024_kansai_wrap a img {
  display: block;
  transition: all .4s cubic-bezier(0.55, -1.30, 0.30, 2.80);
}

.history_2024_kansai_wrap a:hover img {
  transform: scale(1.05);
}

.history_2024_nagoya_wrap {
  width: calc(189/1024*100%);
  position: absolute;
  top: 0;
  left:0;
  margin: calc(507/1024*100%) 0 0 calc(268/1024*100%);
}

@media screen and (max-width: 767px) {
  .history_2024_nagoya_wrap {
    width: calc(172/319*100%);
    position: absolute;
    top: auto;
    left:auto;
    right:0;
    bottom:0;
    margin: 0 0 calc(69/319*100%) 0;
  }
}

.history_2024_nagoya_wrap a img {
  display: block;
  transition: all .4s cubic-bezier(0.55, -1.30, 0.30, 2.80);
}

.history_2024_nagoya_wrap a:hover img {
  transform: scale(1.05);
}

.history_2025_hokkaido_wrap {
  width: calc(189/1024*100%);
  position: absolute;
  bottom: 0;
  right:0;
  margin:  0 calc(115/1024*100%) calc(557/1024*100%) 0;
}

@media screen and (max-width: 767px) {
  .history_2025_hokkaido_wrap {
    width: calc(172/319*100%);
    position: absolute;
    top: 0;
    left:auto;
    right:0;
    bottom:auto;
    margin: calc(69/319*100%) 0 0 0;
  }
}

.history_2025_hokkaido_wrap a img {
  display: block;
  transition: all .4s cubic-bezier(0.55, -1.30, 0.30, 2.80);
}

.history_2025_hokkaido_wrap a:hover img {
  transform: scale(1.05);
}

.history_2025_kansai_wrap {
  width: calc(189/1024*100%);
  position: absolute;
  bottom: 0;
  right:0;
  margin: 0 calc(115/1024*100%) calc(356/1024*100%) 0;
}

@media screen and (max-width: 767px) {
  .history_2025_kansai_wrap {
    width: calc(172/319*100%);
    position: absolute;
    top: 0;
    left:auto;
    right:0;
    bottom:auto;
    margin: calc(247/319*100%) 0 0 0;
  }
}

.history_2025_kansai_wrap a img {
  display: block;
  transition: all .4s cubic-bezier(0.55, -1.30, 0.30, 2.80);
}

.history_2025_kansai_wrap a:hover img {
  transform: scale(1.05);
}

.history_2025_sendai_wrap {
  width: calc(189/1024*100%);
  position: absolute;
  bottom: 0;
  left:0;
  margin: 0 0 calc(66/1024*100%) calc(268/1024*100%);
}

@media screen and (max-width: 767px) {
  .history_2025_sendai_wrap {
    width: calc(172/319*100%);
    position: absolute;
    left:auto;
    right:0;
    bottom:0;
    margin: 0 0 calc(522/319*100%) 0;
  }
}

.history_2025_sendai_wrap a img {
  display: block;
  transition: all .4s cubic-bezier(0.55, -1.30, 0.30, 2.80);
}

.history_2025_sendai_wrap a:hover img {
  transform: scale(1.05);
}

@media screen and (max-width: 767px) {
  .history_2025_kyusyu {
    width: calc(122/319*100%);
    position: absolute;
    left:auto;
    right:0;
    bottom:0;
    margin: 0 0 calc(374/319*100%) 0;
    box-shadow: 1.2vw 1.2vw 1.2vw rgba(49, 0, 0, 0.3);
  }
}

.history_2026_kyusyu_wrap {
  width: calc(189/1024*100%);
  position: absolute;
  bottom: 0;
  left:0;
  margin: 0 0 calc(63/1024*100%) calc(268/1024*100%);
}

@media screen and (max-width: 767px) {
  .history_2026_kyusyu_wrap {
    width: calc(172/319*100%);
    position: absolute;
    left:auto;
    right:0;
    bottom:0;
    margin: 0 0 calc(107/319*100%) 0;
  }
}

.history_2026_kyusyu_wrap a img {
  display: block;
  transition: all .4s cubic-bezier(0.55, -1.30, 0.30, 2.80);
}

.history_2026_kyusyu_wrap a:hover img {
  transform: scale(1.05);
}


.history_youtube_notes {
  font-family: var(--font_murecho);
  font-size: 10px;
  font-weight: 500;
  color: var(--color_history_text);
  text-align: center;
  margin-top: .5em;
}

@media screen and (max-width: 767px) {
  .history_youtube_notes {
    font-size: 10px;
    font-size: 2.8vw;
  }
}


/*--------------
ヒストリー1989
--------------*/

.history_1989 {
  width: calc(580/1024*100%);
  margin: calc(100/1024*100%) auto 0 ;
  padding: calc(50/1024*100%) calc(30/1024*100%);
  background-color: var(--color_red);
  border-radius: 9999px;
  position: relative;
  font-family: var(--font_murecho);
}

@media screen and (max-width: 767px) {
  .history_1989 {
    width: 100%;
    margin: calc(45/375*100%) auto 0 ;
    padding: calc(30/375*100%) 0;
  }
}

.history_year1989 {
  width: calc(172/580*100%);
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  margin: calc(-30/580*100%) auto 0;
}

@media screen and (max-width: 767px) {
  .history_year1989 {
    width: calc(89/315*100%);
    margin: calc(-16/315*100%) auto 0;
  }
}

.history_1989_wrap {
  display: flex;
  justify-content: center;
  align-items: center;
  gap:0 1em;
}

.history_1989_image {
  width: calc(240/540*100%);
  position: relative;
}

@media screen and (max-width: 767px) {
  .history_1989_image {
    width: calc(130/315*100%);
  }
}

.history_1989_image::before {
  content: "";
  background-image: url(/history/img/history_1989_point.png);
  background-repeat: no-repeat;
  background-size: contain;
  width: calc(90/240*100%);
  padding-top: calc(90/240*100%);
  position: absolute;
  top: 0;
  left: 0;
  margin: calc(-65/240*100%) 0 0 calc(-56/240*100%);
}

@media screen and (max-width: 767px) {
  .history_1989_image::before {
    width: calc(66/130*100%);
    padding-top: calc(66/130*100%);
    position: absolute;
    top: 0;
    left: 0;
    margin: calc(-54/130*100%) 0 0 calc(-27/130*100%);
  }
}

.history_1989_text {
  font-size: 20px;
  font-weight: 600;
  color: var(--color_history_text02);
  line-height: 1.4;
}

@media screen and (max-width: 767px) {
  .history_1989_text {
    font-size: 12px;
    font-size: 3.4vw;
    line-height: 1.3;
  }
}