@charset "UTF-8";

/*--------------------------------------------------------------------------------
  reset
--------------------------------------------------------------------------------*/
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  font-weight: normal;
  vertical-align: baseline;
	box-sizing: border-box;
}
body {
  line-height:1;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
  display: block;
}
ol, ul {
  list-style: none;
}
blockquote, q {
  quotes: none;
}
blockquote:before, blockquote:after, q:before, q:after {
  content: '';
  content: none;
}
table {
  border-collapse: collapse;
  border-spacing: 0;
}
table, tr, th, td, caption {
  vertical-align: middle;
  text-align:left;
}
img {
  vertical-align: top;
  font-size:0;
  line-height: 0;
	width: 100%;
}
textarea{
	vertical-align: top;
}


/*--------------------------------------------------------------------------------
  body
--------------------------------------------------------------------------------*/
html {
  font-size: 62.5%;
  -webkit-text-size-adjust: 100%;
}

body {
  color: #000;
  font-size: 15px;
	font-family: "Zen Kaku Gothic New", sans-serif;
	-webkit-text-size-adjust: none;
	word-break: break-word;
	word-wrap: break-word;
	overflow-wrap: break-word;
  overflow-x: hidden;
}

a {
	display: block;
	color: #000;
  text-decoration: none;
	transition: all 0.3s ease;
	cursor: pointer;
}

a:hover {
  opacity: 0.6;
  filter: alpha(opacity=60);
  -ms-filter: "alpha(opacity=60)";
}

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

body, html {
	height: 100%;
}

.sp-br {
	display: none;
}
.pc-br {
	display: block;
}

.sp-only {
  display: none;
}
.pc-only {
  display: block;
}

.dela {
  font-family: "Dela Gothic One", sans-serif;
  font-weight: 400;
}

.cl-wh {
  color: #fff;
}
.cl-yl {
  color: #fff000;
}
.cl-rd {
  color: #da3a1d;
}

.txt-link {
  display: inline-block;
  text-decoration: underline;
}

@media screen and (max-width: 768px) {
	body {
		font-size: 14px;
	}
	
	.sp-br {
		display: block;
	}
	.pc-br {
		display: none;
	}

	.sp-only {
		display: block;
	}
	.pc-only {
		display: none;
	}
}





/*--------------------------------------------------
　header
--------------------------------------------------*/
header {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  padding: 20px 30px;
  z-index: 111;
}

.header-logo {
  width: 238px;
}
.header-logo a {
  display: block;
}

@media screen and (max-width: 1280px) {
  header {
    padding: 1.5vw 2.3vw;
  }

  .header-logo {
    width: 18.5vw;
  }
}

@media screen and (max-width: 768px) {
  header {
    padding: 10px 10px;
  }

  .header-logo {
    width: 32%;
  }
}


/*--------------------------------------------------
　footer
--------------------------------------------------*/
footer {
  background: #d9391c;
  padding: 30px 0;
  text-align: center;
}

.footer-inner {
  max-width: 1200px;
  margin: auto;
}

.footer-copy {
  color: #fff;
  font-size: 20px;
}

@media screen and (max-width: 1280px) {
  footer {
    padding: 2.3vw 0;
  }

  .footer-inner {
    max-width: 93.7vw;
  }

  .footer-copy {
    font-size: 1.5vw;
  }
}

@media screen and (max-width: 768px) {
  footer {
    padding: 20px 0;
  }

  .footer-inner {
    max-width: 100%;
  }

  .footer-copy {
    font-size: 3.1vw;
  }
}


/*--------------------------------------------------
　animation
--------------------------------------------------*/
@keyframes starTwinkle {
  0%,
  100% {
    opacity: 0;
    filter: brightness(1);
  }

  40% {
    opacity: 0.5;
    filter: brightness(1.5);
  }

  50% {
    opacity: 1;
    filter: brightness(2.5);
  }

  60% {
    opacity: 0.5;
    filter: brightness(1.5);
  }
}


.popAnime {
  opacity: 0;
}
.popAnime.isActive {
  animation: popAnime 0.6s ease-out both;
  animation-delay: 0.2s;
}

@keyframes popAnime {
  0% {
    opacity: 0;
    transform: scale(0);
  }
  60% {
    opacity: 1;
    transform: scale(1.2);
  }
  80% {
    transform: scale(0.95);
  }
  100% {
    opacity: 1;
    transform: scale(1);
  }
}


.fadeInUp {
  opacity: 0;
}
.fadeInUp.isActive {
  animation: fadeInUp 0.6s ease-in-out forwards;
  animation-delay: 0.3s;
}

@keyframes fadeInUp {
  0% {
    opacity: 0;
    transform: translate3d(0, 30px, 0);
  }
  100% {
    opacity: 1;
    transform: translate3d(0, 0, 0);
  }
}


.shakeAnime.isActive {
  animation: shakeAnime 2s ease-in-out infinite;
  animation-delay: 0.3s;
}

@keyframes shakeAnime {
  0%, 16.67%, 100% {
    transform: translateX(0);
  }
  1.67%, 5%, 8.33%, 11.67%, 15% {
    transform: translateX(-5px);
  }
  3.33%, 6.67%, 10%, 13.33% {
    transform: translateX(5px);
  }
}


.scaleAnime.isActive {
  animation: scaleAnime 1.5s ease-in-out infinite;
  animation-delay: 0.3s;
}

@keyframes scaleAnime {
  0%, 100% {
    transform: scale(1);
  }
  50% {
    transform: scale(1.12);
  }
}


.delay-01.isActive {
  animation-delay: 0.1s;
}
.delay-02.isActive {
  animation-delay: 0.2s;
}
.delay-03.isActive {
  animation-delay: 0.3s;
}
.delay-04.isActive{
  animation-delay: 0.4s;
}

/*--------------------------------------------------
　mv
--------------------------------------------------*/
.mv {
  background: url("../img/mv-bg01.jpg") center center no-repeat;
  background-size: cover;
  position: relative;
  overflow: hidden;
  z-index: 2;
}

.mv-bg,
.mv-bg-sp {
  pointer-events: none;
}
.mv-star__bg {
  position: absolute;
  inset: 0;
  pointer-events: none;
}
.mv-star {
  position: absolute;
  inset: 0;
  background-image: var(--star-image);
  background-position: center;
  background-size: 100% 100%;
  background-repeat: no-repeat;
  clip-path: circle(var(--size) at var(--x) var(--y));
  animation: starTwinkle var(--duration) ease-in-out infinite;
  animation-delay: var(--delay);
}

.mv-bg {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 98%;
  aspect-ratio: 1879 / 1021;
  background: url("../img/mv-bg02.png") center / 100% 100% no-repeat;
  --star-image: url("../img/mv-bg02.png");
}

.mv-bg-sp {
  display: none;
}

.mv-inner {
  padding: 60px 60px 140px;
  margin: auto;
  position: relative;
  z-index: 1;
}

.mv-ttl {
  max-width: 58%;
  position: relative;
  z-index: 1;
}

.mv-img01 {
  position: absolute;
  top: 40px;
  right: 80px;
  max-width: 43%;
}

.mv-img02 {
  position: absolute;
  bottom: 30px;
  right: 70px;
  max-width: 65%;
}

@media screen and (max-width: 1280px) {
  .mv-inner {
    padding: 4.6vw 4.6vw 10.9vw;
  }

  .mv-img01 {
    top: 3.1vw;
    right: 6.2vw;
  }

  .mv-img02 {
    bottom: 2.3vw;
    right: 5.4vw;
  }
}

@media screen and (max-width: 768px) {
  .mv {
    background: url("../img/mv-bg01-sp.jpg") center center no-repeat;
    background-size: cover;
  }

  .mv-bg {
    display: none!important;
  }
  .mv-bg-sp {
    display: block;
    position: absolute;
    pointer-events: none;
  }
  .mv-bg-sp {
    display: block;
    position: absolute;
    width: 100%;
    pointer-events: none;
  }
  .mv-bg-sp01 {
    top: 0;
    right: 0;
    width: 60%;
    aspect-ratio: 440 / 220;
    background: url("../img/mv-bg02-sp01.png") center / 100% 100% no-repeat;
    --star-image: url("../img/mv-bg02-sp01.png");
  }
  .mv-bg-sp02 {
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 95%;
    aspect-ratio: 700 / 125;
    background: url("../img/mv-bg02-sp02.png") center / 100% 100% no-repeat;
    --star-image: url("../img/mv-bg02-sp02.png");
  }

  .mv-inner {
    padding: 40px 0 20px;
  }

  .mv-ttl {
    width: 95%;
    max-width: 95%;
    margin: auto;
  }

  .mv-img01 {
    position: relative;
    top: 0;
    right: 0;
    width: calc(100% + 10px);
    max-width: calc(100% + 10px);
    margin: -20px 0 0 -10px;
  }

  .mv-img02 {
    display: none;
  }
}


/*--------------------------------------------------
　contents
--------------------------------------------------*/
.contents-wrap {
  overflow: hidden;
}

.contents {
  position: relative;
  z-index: 1;
}

.sec-inner {
  max-width: 1200px;
  margin: auto;
}

.contents .txt {
  font-size: 24px;
  font-weight: 500;
  line-height: 1.6;
}

.contents .lead {
  margin-top: 40px;
  font-size: 42px;
  text-align: center;
  line-height: 1.3;
}

@media screen and (max-width: 1280px) {
  .sec-inner {
    max-width: 93.7vw;
  }

  .contents .txt {
    font-size: 1.8vw;
  }

  .contents .lead {
    margin-top: 3.1vw;
    font-size: 3.2vw;
  }
}

@media screen and (max-width: 768px) {
  .sec-inner {
    max-width: 100%;
  }

  .contents .txt {
    font-size: 3.6vw;
    line-height: 1.8;
  }

  .contents .lead {
    margin-top: 20px;
    font-size: 4.4vw;
  }
}


/*--------------------------------------------------
　Title
--------------------------------------------------*/
.com-ttlWrap {
  text-align: center;
}

.com-ttl {
  display: inline-block;
  padding: 10px 10px;
  font-size: 72px;
  border-radius: 100px;
}
.com-ttl.cl-yl {
  border: 6px solid #fff000;
}
.com-ttl.cl-rd {
  border: 6px solid #da3a1d;
}

.com-ttl span {
  display: inline-block;
  padding: 20px 80px;
  border-radius: 100px;
}
.com-ttl.cl-yl span {
  border: 6px solid #fff000;
}
.com-ttl.cl-rd span {
  border: 6px solid #da3a1d;
}

@media screen and (max-width: 1280px) {
  .com-ttl {
    padding: 0.7vw 0.7vw;
    font-size: 5.6vw;
  }

  .com-ttl span {
    padding: 1.5vw 6.2vw;
  }
}

@media screen and (max-width: 768px) {
  .com-ttl {
    padding: 5px 5px;
    font-size: 6.5vw;
  }
  .com-ttl.cl-yl {
    border: 3px solid #fff000;
  }
  .com-ttl.cl-rd {
    border: 3px solid #da3a1d;
  }

  .com-ttl span {
    padding: 3.9vw 10vw;
  }
  .com-ttl.cl-yl span {
    border: 3px solid #fff000;
  }
  .com-ttl.cl-rd span {
    border: 3px solid #da3a1d;
  }
}


/*--------------------------------------------------
　anchor-link
--------------------------------------------------*/
.anchor-link {
  background: #12a042;
  padding: 50px 40px 50px;
  position: relative;
  z-index: 1;
}

.anchor-link__inner {
  max-width: 1200px;
  margin: auto;
}

.anchor-link__list {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 30px 50px;
}
.anchor-link__list li {
  width: 300px;
  height: 110px;
}
.anchor-link__list li a {
  display: flex;
  justify-content: center;
  align-items: center;
  background: url("../img/anchor-link-bg.png") left top no-repeat;
  background-size: contain;
  width: 100%;
  height: 100%;
  text-align: center;
  position: relative;
}
.anchor-link__list li span {
  color: #d9391c;
  font-size: 34px;
}

@media screen and (max-width: 1280px) {
  .anchor-link {
    padding: 3.9vw 3.1vw 3.9vw;
  }

  .anchor-link__inner {
    max-width: 93.7vw;
  }

  .anchor-link__list {
    gap: 2.3vw 3.9vw;
  }
  .anchor-link__list li {
    width: 23.4vw;
    height: 8.5vw;
  }
  .anchor-link__list li span {
    font-size: 2.6vw;
  }
}

@media screen and (max-width: 768px) {
  .anchor-link {
    padding: 20px 20px 20px;
  }

  .anchor-link__inner {
    max-width: 100%;
  }

  .anchor-link__list {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 10px 10px;
  }
  .anchor-link__list li {
    width: calc((100% - 10px) / 2);
    height: auto;
  }
  .anchor-link__list li a {
    background: url("../img/anchor-link-bg-sp.png") left top no-repeat;
    background-size: contain;
    width:100%;
    height: 0;
    padding-top: calc(100%*161/320);
    position: relative;
  }
  .anchor-link__list li span {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    width: 100%;
    font-size: 5vw;
  }
}


/*--------------------------------------------------
　sec-overview
--------------------------------------------------*/
.sec-overview {
  background: #000 url("../img/flame-bg.png") center bottom -2px repeat-x;
  background-size: 1920px auto;
  padding: 120px 40px 220px;
  position: relative;
}

.star-bg01 {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 100%;
  aspect-ratio: 1777 / 1397;
  background: url("../img/star-bg01.png") center / 100% 100% no-repeat;
  pointer-events: none;
}
.star-bg01__layer {
  position: absolute;
  inset: 0;
}
.star01 {
  position: absolute;
  inset: 0;
  background: url("../img/star-bg01.png") center / 100% 100% no-repeat;
  clip-path: circle(var(--size) at var(--x) var(--y));
  animation: starTwinkle var(--duration) ease-in-out infinite;
  animation-delay: var(--delay);
}

.sec-overview > *:not(.star-bg01) {
  position: relative;
  z-index: 1;
}

.sec-overview__upper {
  padding: 80px 0;
  position: relative;
}
.sec-overview__upper::before,
.sec-overview__upper::after {
  content: "";
  position: absolute;
  left: 50%;
  transform: translate(-50%,0);
  background: url("../img/deco01.png") left top no-repeat;
  background-size: contain;
  width: 1120px;
  height: 112px;
  box-sizing: border-box;
}
.sec-overview__upper::before {
  top: 0;
}
.sec-overview__upper::after {
  bottom: 0;
  transform: translate(-50%,0) scale(1, -1);
}

.sec-overview__ttl {
  max-width: 870px;
  margin: auto;
}

.sec-overview__lead {
  font-weight: 900;
  text-align: center;
  line-height: 1.8;
  text-shadow: 
	  4px 4px 8px #12a042,
	  -4px 4px 8px #12a042,
	  4px -4px 8px #12a042,
	  -4px -4px 8px #12a042;
}
.sec-overview__lead span {
  font-weight: 900;
}
.sec-overview__lead01 {
  font-size: 33px;
}
.sec-overview__lead02 {
  font-size: 40px;
}
.sec-overview__lead02 .large {
  font-size: 50px;
}

.sec-overview__bottom {
  display: flex;
  justify-content: space-between;
  gap: 0 90px;
  margin-top: 90px;
}

.sec-overview__bottom__item {
  width: calc(100% / 2);
  position: relative;
}

.sec-overview__bottom__txtBox {
  width: 526px;
  height: 526px;
  padding-top: 50px;
  position: relative;
}
.sec-overview__bottom__item01 .sec-overview__bottom__txtBox {
  background: url("../img/sec-overview-bottom-bg01.png") left top no-repeat;
  background-size: contain;
}
.sec-overview__bottom__item02 .sec-overview__bottom__txtBox {
  background: url("../img/sec-overview-bottom-bg02.png") left top no-repeat;
  background-size: contain;
}

.sec-overview__bottom__txtBoxInner {
  width: 65%;
  margin: auto;
}

.sec-overview__bottom__eng {
  width: 150px;
  margin: auto;
}

.sec-overview__bottom__ttl {
  margin-top: 15px;
  font-size: 44px;
  text-align: center;
}

.sec-overview__bottom .txt {
  margin-top: 15px;
  font-size: 22px;
}

.sec-overview__bottom__item01 .sec-overview__bottom__img {
  width: 267px;
  margin: -200px auto 0;
  position: relative;
}
.sec-overview__bottom__item02 .sec-overview__bottom__img {
  width: 618px;
  margin: -150px auto 0;
  position: relative;
}

.overview-star {
  display: none;
}

@media screen and (max-width: 1280px) {
  .sec-overview {
    background: #000 url("../img/flame-bg.png") center bottom -2px repeat-x;
    background-size: 150vw auto;
    padding: 9.3vw 3.1vw 17.1vw;
  }

  .sec-overview__upper {
    padding: 6.2vw 0;
  }
  .sec-overview__upper::before,
  .sec-overview__upper::after {
    width: 87.5vw;
    height: 8.7vw;
  }

  .sec-overview__ttl {
    max-width: 67.9vw;
  }

  .sec-overview__lead01 {
    font-size: 2.5vw;
  }
  .sec-overview__lead02 {
    font-size: 3.1vw;
  }
  .sec-overview__lead02 .large {
    font-size: 3.9vw;
  }

  .sec-overview__bottom {
    gap: 0 7vw;
    margin-top: 7vw;
  }

  .sec-overview__bottom__txtBox {
    width: 41vw;
    height: 41vw;
    padding-top: 3.9vw;
  }

  .sec-overview__bottom__eng {
    width: 11.7vw;
  }

  .sec-overview__bottom__ttl {
    margin-top: 1.1vw;
    font-size: 3.4vw;
  }

  .sec-overview__bottom .txt {
    margin-top: 1.1vw;
    font-size: 1.7vw;
  }

  .sec-overview__bottom__item01 .sec-overview__bottom__img {
    width: 20.8vw;
    margin: -15.6vw auto 0;
  }
  .sec-overview__bottom__item02 .sec-overview__bottom__img {
    width: 48.2vw;
    margin: -11.7vw auto 0;
  }
}

@media screen and (max-width: 768px) {
  .sec-overview {
    background: #000 url("../img/flame-bg-sp.png") center bottom -2px no-repeat;
    background-size: 100% auto;
    padding: 40px 20px 80px;
  }

  .star-bg01 {
    display: none;
  }
  
  .sec-overview__upper {
    padding: 40px 0;
  }
  .sec-overview__upper::before,
  .sec-overview__upper::after {
    background: url("../img/deco01-sp.png") left top no-repeat;
    background-size: contain;
    width: 100%;
    height: 0;
    padding-top: calc(100%*95/679);
  }

  .sec-overview__ttl {
    max-width: 85%;
  }

  .sec-overview__lead {
    line-height: 2;
    text-shadow: 
      2px 2px 6px #12a042,
      -2px 2px 6px #12a042,
      2px -2px 6px #12a042,
      -2px -2px 6px #12a042;
  }
  .sec-overview__lead01 {
    font-size: 4.1vw;
  }
  .sec-overview__lead02 {
    margin-top: 5px;
    font-size: 5.2vw;
    line-height: 1.5;
  }
  .sec-overview__lead02 .large {
    font-size: 6.2vw;
  }
  
  .sec-overview__bottom {
    display: block;
    margin-top: 20px;
    position: relative;
  }

  .sec-overview__bottom__item {
    width: 100%;
  }
  .sec-overview__bottom__item01 {
    margin-top: -60px;
    margin-bottom: -90px;
  }
  .sec-overview__bottom__item02 {
    margin-top: -40px;
    margin-bottom: -40px;
  }

  .sec-overview__bottom__txtBox {
    width: 78.6vw;
    height: 78.6vw;
    margin: auto;
    padding-top: 9vw;
  }

  .sec-overview__bottom__txtBoxInner {
    width: 65%;
  }

  .sec-overview__bottom__eng {
    width: 50%;
  }

  .sec-overview__bottom__ttl {
    margin-top: 5px;
    font-size: 6.7vw;
  }

  .sec-overview__bottom .txt {
    margin-top: 10px;
    font-size: 3.6vw;
  }

  .sec-overview__bottom__item01 .sec-overview__bottom__img {
    width: 40%;
    margin: -22vw auto 0;
  }
  .sec-overview__bottom__item02 .sec-overview__bottom__img {
    width: 90%;
    margin: -12vw auto 0;
  }
  
  
  .overview-star {
    display: block;
    position: relative;
    width: 100%;
    pointer-events: none;
  }
  .overview-star__layer {
    position: absolute;
    inset: 0;
  }
  .overview-star__item {
    position: absolute;
    inset: 0;
    background-image: var(--star-image);
    background-position: center;
    background-size: 100% 100%;
    background-repeat: no-repeat;
    clip-path: circle(var(--size) at var(--x) var(--y));
    animation: starTwinkle var(--duration) ease-in-out infinite;
    animation-delay: var(--delay);
  }
  .overview-star01 {
    width: 105%;
    aspect-ratio: 718 / 184;
    background: url("../img/star-bg-sp01.png") center / 100% 100% no-repeat;
    --star-image: url("../img/star-bg-sp01.png");
  }
  .overview-star02 {
    width: 105%;
    aspect-ratio: 698 / 314;
    background: url("../img/star-bg-sp02.png") center / 100% 100% no-repeat;
    --star-image: url("../img/star-bg-sp02.png");
  }
  .overview-star03 {
    aspect-ratio: 687 / 174;
    background: url("../img/star-bg-sp03.png") center / 100% 100% no-repeat;
    --star-image: url("../img/star-bg-sp03.png");
  }
}


/*--------------------------------------------------
　sec-menu
--------------------------------------------------*/
.sec-menu {
  background: #d9391c;
  padding: 130px 40px 160px;
  position: relative;
}

.sec-menu .lead {
  position: relative;
  z-index: 1;
}

.sec-menu .sec-inner {
  position: relative;
}
.sec-menu .sec-inner::after {
  content: "";
  position: absolute;
  top: 100px;
  right: -50px;
  background: url("../img/illust01.png") left top no-repeat;
  background-size: contain;
  width: 306px;
  height: 361px;
  box-sizing: border-box;
}

.sec-menu__block {
  margin-top: 150px;
}

.sec-menu__item {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 0 20px;
  margin-bottom: 250px;
  position: relative;
}
.sec-menu__item:last-child {
  margin-bottom: 0;
}
.sec-menu__item::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%,-50%);
  background: url("../img/sec-menu-bg.png") left bottom repeat-x;
  background-size: contain;
  width: 1147px;
  height: 794px;
  margin: auto;
  box-sizing: border-box;
  z-index: -1;
}
.sec-menu__item:nth-child(2)::after {
  transform: translate(-50%,-50%) scale(-1, 1);
}

.sec-menu__imgBox {
  width: 680px;
  margin-top: -80px;
}
.sec-menu__item:nth-child(2) .sec-menu__imgBox {
  order: 2;
}
.sec-menu__item:nth-child(3) .sec-menu__imgBox {
  width: 945px;
  margin-top: -100px;
  margin-right: -140px;
}

.sec-menu__txtBox {
  flex: 1;
  padding-top: 60px;
}
.sec-menu__item:nth-child(2) .sec-menu__txtBox {
  order: 1;
}
.sec-menu__item:nth-child(3) .sec-menu__txtBox {
  padding-top: 250px;
}

.sec-menu__ttl {
  width: 516px;
}
.sec-menu__item:nth-child(3) .sec-menu__ttl {
  width: 364px;
}

.sec-menu .txt {
  margin-top: 20px;
}

@media screen and (max-width: 1280px) {
  .sec-menu {
    padding: 10.1vw 3.1vw 12.5vw;
  }

  .sec-menu .sec-inner::after {
    top: 7.8vw;
    right: -3.9vw;
    width: 23.9vw;
    height: 28.2vw;
  }

  .sec-menu__block {
    margin-top: 11.7vw;
  }

  .sec-menu__item {
    gap: 0 1.5vw;
    margin-bottom: 19.5vw;
  }
  .sec-menu__item::after {
    width: 89.6vw;
    height: 62vw;
  }

  .sec-menu__imgBox {
    width: 53.1vw;
    margin-top: -6.2vw;
  }
  .sec-menu__item:nth-child(3) .sec-menu__imgBox {
    width: 73.8vw;
    margin-top: -7.8vw;
    margin-right: -10.9vw;
  }

  .sec-menu__txtBox {
    padding-top: 4.6vw;
  }
  .sec-menu__item:nth-child(3) .sec-menu__txtBox {
    padding-top: 19.5vw;
  }

  .sec-menu__ttl {
    width: 40.3vw;
  }
  .sec-menu__item:nth-child(3) .sec-menu__ttl {
    width: 28.4vw;
  }

  .sec-menu .txt {
    margin-top: 1.5vw;
  }
}

@media screen and (max-width: 768px) {
  .sec-menu {
    padding: 50px 20px 50px;
  }

  .sec-menu .sec-inner::after {
    display: none;
  }

  .sec-menu__block {
    margin-top: 20px;
  }

  .sec-menu__item {
    display: block;
    margin-bottom: 40px;
  }
  .sec-menu__item::after {
    display: none;
  }

  .sec-menu__imgBox {
    width: calc(100% + 100px);
    margin: 0 50px 0 -50px;
    margin-top: 0;
  }
  .sec-menu__item:nth-child(3) .sec-menu__imgBox {
    width: calc(100% + 100px);
    margin-top: 0;
    margin-right: 0;
    margin: 0 50px 0 -50px;
  }
  
  .sec-menu__txtBox {
    padding-top: 0;
  }
  .sec-menu__item:nth-child(3) .sec-menu__txtBox {
    padding-top: 0;
  }

  .sec-menu__ttl {
    width: 85%;
    margin: -30px auto 0;
  }
  .sec-menu__item:nth-child(3) .sec-menu__ttl {
    width: 100%;
  }
  
  .sec-menu .txt {
    margin-top: 15px;
    padding: 0 10px;
  }
}


/*--------------------------------------------------
　sec-novelty
--------------------------------------------------*/
.sec-novelty {
  background: #12a042;
  padding: 120px 40px 120px;
  position: relative;
  z-index: 1;
}

.sec-novelty__block {
  margin-top: 60px;
}

.sec-novelty__item {
  margin-bottom: 50px;
  padding: 20px 0;
  position: relative;
}
.sec-novelty__item:last-child {
  margin-bottom: 0;
}
.sec-novelty__item::before,
.sec-novelty__item::after {
  content: "";
  position: absolute;
  left: 50%;
  transform: translate(-50%,0);
  background: url("../img/deco02.png") left top no-repeat;
  background-size: 100% 100%;
  width: 100%;
  height: 50px;
  pointer-events: none;
}
.sec-novelty__item::before {
  top: 0;
}
.sec-novelty__item::after {
  bottom: 0;
  transform: translate(-50%,0) scale(1, -1);
}

.sec-novelty__itemInner {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 0 40px;
  padding: 40px 60px;
  border-left: 10px solid #fff;
  border-right: 10px solid #fff;
  position: relative;
}

.sec-novelty__imgBox {
  flex-shrink: 0;
}
.sec-novelty__item:nth-child(1) .sec-novelty__imgBox {
  width: 384px;
}
.sec-novelty__item:nth-child(2) .sec-novelty__imgBox {
  width: 638px;
  margin-top: -75px;
  order: 2;
} 

.sec-novelty__txtBox {
  flex: 0 1 400px;
}
.sec-novelty__item:nth-child(2) .sec-novelty__txtBox {
  order: 1;
} 

.sec-novelty__item:nth-child(1) .sec-novelty__ttl {
  width: 268px;
}
.sec-novelty__item:nth-child(2) .sec-novelty__ttl {
  width: 368px;
} 

.sec-novelty .txt {
  margin-top: 20px;
}

.sec-novelty .note {
  margin-top: 25px;
  font-size: 20px;
  font-weight: 500;
  text-align: right;
  line-height: 1.5;
}

@media screen and (max-width: 1280px) {
  .sec-novelty {
    padding: 9.3vw 3.1vw 9.3vw;
  }

  .sec-novelty__block {
    margin-top: 4.6vw;
  }

  .sec-novelty__item {
    margin-bottom: 3.9vw;
    padding: 1.5vw 0;
  }
  .sec-novelty__item::before,
  .sec-novelty__item::after {
    height: 3.9vw;
  }

  .sec-novelty__itemInner {
    gap: 0 3.1vw;
    padding: 3.1vw 4.6vw;
    border-left: 0.7vw solid #fff;
    border-right: 0.7vw solid #fff;
  }

  .sec-novelty__item:nth-child(1) .sec-novelty__imgBox {
    width: 30vw;
  }
  .sec-novelty__item:nth-child(2) .sec-novelty__imgBox {
    width: 49.8vw;
    margin-top: -5.8vw;
  } 

  .sec-novelty__txtBox {
    flex: 0 1 31.2vw;
  }

  .sec-novelty__item:nth-child(1) .sec-novelty__ttl {
    width: 20.9vw;
  }
  .sec-novelty__item:nth-child(2) .sec-novelty__ttl {
    width: 28.7vw;
  } 

  .sec-novelty .txt {
    margin-top: 1.5vw;
  }

  .sec-novelty .note {
    margin-top: 1.9vw;
    font-size: 1.5vw;
  }
}

@media screen and (max-width: 768px) {
  .sec-novelty {
    padding: 50px 20px 50px;
  }

  .sec-novelty__block {
    margin-top: 30px;
  }

  .sec-novelty__item {
    margin-bottom: 20px;
    padding: 20px 0;
  }
  .sec-novelty__item::before,
  .sec-novelty__item::after {
    background: url("../img/deco02-sp.png") left top no-repeat;
    background-size: 100% auto;
    width: 100%;
    height: 46px;
  }

  .sec-novelty__itemInner {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
    gap: 0 0;
    padding: 10px 20px;
    border-left: 4px solid #fff;
    border-right: 4px solid #fff;
  }

  .sec-novelty__imgBox {
    order: 2;
  }
  .sec-novelty__item:nth-child(1) .sec-novelty__imgBox {
    width: 80%;
    margin: 15px auto 0;
  }
  .sec-novelty__item:nth-child(2) .sec-novelty__imgBox {
    width: 100%;
    margin-top: 15px;
  } 

  .sec-novelty__txtBox {
    flex: inherit;
    order: 1;
  }

  .sec-novelty__item:nth-child(1) .sec-novelty__ttl {
    width: 100%;
  }
  .sec-novelty__item:nth-child(2) .sec-novelty__ttl {
    width: 100%;
  } 

  .sec-novelty .txt {
    margin-top: 10px;
  }

  .sec-novelty .note {
    margin-top: 15px;
    font-size: 3.1vw;
    text-align: left;
  }
}


/*--------------------------------------------------
　bg-wrap
--------------------------------------------------*/
.bg-wrap {
  background: #000;
  padding: 0 40px;
  padding-bottom: 240px;
  overflow: hidden;
  position: relative;
}
.bg-wrap::after {
  content: "";
  position: absolute;
  bottom: -2px;
  left: 50%;
  transform: translate(-50%,0);
  background: url("../img/flame-bg.png") left bottom repeat-x;
  background-size: 100% auto;
  width: 1920px;
  height: 133px;
  box-sizing: border-box;
}

.star-bg02 {
  position: absolute;
  inset: 0;
  top: 140px;
  width: 100%;
  background: url("../img/star-bg02.png") center top / 100% auto repeat-y;
  pointer-events: none;
}
.star-bg02__layer {
  position: absolute;
  inset: 0;
}
.star02 {
  position: absolute;
  background: url("../img/star-bg02.png") center top / 100% 100% no-repeat;
  clip-path: circle(var(--size) at var(--x) var(--y));
  animation: starTwinkle var(--duration) ease-in-out infinite;
  animation-delay: var(--delay);
}

.bg-wrap > *:not(.star-bg02) {
  position: relative;
  z-index: 1;
}

@media screen and (max-width: 1280px) {
  .bg-wrap {
    padding: 0 3.1vw;
    padding-bottom: 18.7vw;
  }
  .bg-wrap::after {
    bottom: -0.1vw;
    width: 150vw;
    height: 10.3vw;
  }  

  .star-bg02 {
    top: 10.9vw;
  }
}

@media screen and (max-width: 768px) {
  .bg-wrap {
    padding: 0 20px;
    padding-bottom: 80px;
  }
  .bg-wrap::after {
    background: url("../img/flame-bg-sp.png") left bottom repeat-x;
    background-size: 100% auto;
    width: 100%;
    height: 0;
    padding-top: calc(100%*104/750);
  }  

  .star-bg02 {
    display: none;
  }
}


/*--------------------------------------------------
　sec-campaign
--------------------------------------------------*/
.sec-campaign {
  padding: 140px 0 0;
}

.sec-campaign .sec-inner {
  background: #fff;
  position: relative;
}

.sec-campaign .sec-inner::before,
.sec-campaign .sec-inner::after {
  content: "";
  position: absolute;
  left: 50%;
  transform: translate(-50%,0);
  width: 100%;
  height: 40px;
  box-sizing: border-box;
}
.sec-campaign .sec-inner::before {
  top: 0;
  background: url("../img/deco03.jpg") left top no-repeat;
  background-size: 100% auto;
}
.sec-campaign .sec-inner::after {
  bottom: 0;
  background: url("../img/deco03.jpg") left bottom no-repeat;
  background-size: 100% auto;
}

.sec-campaign__inner {
  padding: 120px 0;
  position: relative;
}

.sec-campaign__inner::before,
.sec-campaign__inner::after {
  content: "";
  position: absolute;
  top: 40px;
  background: url("../img/deco04.jpg") left top repeat-y;
  background-size: 100% auto;
  width: 40px;
  height: calc(100% - 40px);
  box-sizing: border-box;
  z-index: 1;
}
.sec-campaign__inner::before {
  left: 0;
}
.sec-campaign__inner::after {
  right: 0;
}

.sec-campaign__img {
  max-width: 922px;
  margin: 50px auto 0;
  position: relative;
}
.sec-campaign__img::after {
  content: "";
  position: absolute;
  top: calc(100% - 160px);
  left: calc(100% - 170px);
  background: url("../img/illust02.png") left top no-repeat;
  background-size: contain;
  width: 232px;
  height: 290px;
  box-sizing: border-box;
}


.sec-campaign__apply {
  margin-top: 70px;
}

.sec-campaign__apply__ttl {
  font-size: 50px;
  text-align: center;
}

.sec-campaign__apply__block {
  display: flex;
  justify-content: center;
  gap: 0 55px;
  margin-top: 20px;
}

.sec-campaign__apply__item {
  width: 436px;
  position: relative;
}
.sec-campaign__apply__item::after {
  content: "";
  position: absolute;
  top: 50%;
  left: calc(100% - 8px);
  transform: translate(0,-50%);
  background: url("../img/arrow.png") left top no-repeat;
  background-size: contain;
  width: 73px;
  height: 42px;
  box-sizing: border-box;
  z-index: 1;
}
.sec-campaign__apply__item:last-child::after {
  display: none;
}

.sec-campaign__apply__sb {
  max-width: 996px;
  margin: 20px auto 0;
  position: relative;
  left: -20px;
  z-index: 2;
}

.sec-campaign__apply__btn {
  max-width: 600px;
  margin: 50px auto 0;
}

@media screen and (max-width: 1280px) {
  .sec-campaign {
    padding: 10.9vw 0 0;
  }

  .sec-campaign .sec-inner::before,
  .sec-campaign .sec-inner::after {
    height: 3.1vw;
  }

  .sec-campaign__inner {
    padding: 9.3vw 0;
  }

  .sec-campaign__inner::before,
  .sec-campaign__inner::after {
    top: 3.1vw;
    width: 3.1vw;
    height: calc(100% - 3.1vw);
  }

  .sec-campaign__img {
    max-width: 72vw;
    margin: 3.9vw auto 0;
  }
  .sec-campaign__img::after {
    top: calc(100% - 12.5vw);
    left: calc(100% - 13.2vw);
    width: 18.1vw;
    height: 22.6vw;
  }


  .sec-campaign__apply {
    margin-top: 5.4vw;
  }

  .sec-campaign__apply__ttl {
    font-size: 3.9vw;
  }

  .sec-campaign__apply__block {
    gap: 0 4.2vw;
    margin-top: 1.5vw;
  }

  .sec-campaign__apply__item {
    width: 34vw;
  }
  .sec-campaign__apply__item::after {
    left: calc(100% - 0.6vw);
    width: 5.7vw;
    height: 3.2vw;
  }

  .sec-campaign__apply__sb {
    max-width: 77.8vw;
    margin: 1.5vw auto 0;
    left: -1.5vw;
  }

  .sec-campaign__apply__btn {
    max-width: 46.8vw;
    margin: 3.9vw auto 0;
  }
}

@media screen and (max-width: 768px) {
  .sec-campaign {
    padding: 40px 0 0;
  }

  .sec-campaign .sec-inner::before,
  .sec-campaign .sec-inner::after {
    width: 100%;
    height: 20px;
  }

  .sec-campaign__inner {
    padding: 40px 30px;
  }

  .sec-campaign__inner::before,
  .sec-campaign__inner::after {
    top: 10px;
    background: url("../img/deco04.jpg") left top repeat-y;
    background-size: 100% auto;
    width: 12px;
    height: calc(100% - 10px);
  }

  .sec-campaign .com-ttl {
    display: block;
  }
  .sec-campaign .com-ttl span {
    display: block;
    padding: 3.9vw 3vw;
  }
  
  .sec-campaign__img {
    max-width: 100%;
    margin: 15px auto 0;
    position: relative;
  }
  .sec-campaign__img::after {
    top: calc(100% - 70px);
    left: inherit;
    right: -10px;
    width: 35%;
    height: 0;
    padding-top: calc(35%*290/232);
  }


  .sec-campaign__apply {
    margin-top: 40px;
  }

  .sec-campaign__apply__ttl {
    font-size: 6.5vw;
  }

  .sec-campaign__apply__block {
    display: block;
    margin-top: 20px;
  }

  .sec-campaign__apply__item {
    width: 100%;
    margin-bottom: 25px;
  }
  .sec-campaign__apply__item:last-child {
    margin-bottom: 0;
  }
  .sec-campaign__apply__item::after {
    top: calc(100% - 10px);
    left: 50%;
    transform: translate(-50%,0);
    background: url("../img/arrow-sp.png") left top no-repeat;
    background-size: contain;
    width: 10%;
    height: 0;
    padding-top: calc(10%*72/52);
  }

  .sec-campaign__apply__sb {
    width: calc(100% + 10px);
    max-width: calc(100% + 10px);
    margin: 10px auto 0;
    left: -10px;
  }

  .sec-campaign__apply__btn {
    max-width: 100%;
    margin: 20px auto 0;
  }
}


/*--------------------------------------------------
　sec-store
--------------------------------------------------*/
.sec-store {
  padding: 120px 0 120px;
}

.sec-store .com-ttlWrap {
  position: relative;
  z-index: 222;
}
.sec-store .com-ttl span {
  padding: 20px 180px;
}

.sec-store__block {
  margin-top: 60px;
}

.sec-store__item {
  display: flex;
  justify-content: space-between;
  gap: 0 50px;
  padding: 55px 0 75px;
  position: relative;
}
.sec-store__item:first-child {
  padding: 75px 0 75px;
}
.sec-store__item::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  background: url("../img/deco05.png") left top no-repeat;
  background-size: contain;
  width: 100%;
  height: 20px;
  box-sizing: border-box;
}
.sec-store__item:first-child::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  background: url("../img/deco05.png") left top no-repeat;
  background-size: contain;
  width: 100%;
  height: 20px;
  box-sizing: border-box;
}

.sec-store__imgBox {
  width: 450px;
}

.sec-store__txtBox {
  flex: 1;
}

.sec-store__ttl {
  font-size: 40px;
}

.sec-store__list {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  flex-wrap: wrap;
  margin-top: 20px;
}
.sec-store__list dt {
  width: 20%;
  margin-bottom: 10px;
  font-size: 25px;
  font-weight: 700;
  line-height: 1.3;
}
.sec-store__list dt:last-of-type {
  margin-bottom: 0;
}
.sec-store__list dd {
  width: 75%;
  margin-bottom: 10px;
  font-size: 25px;
  font-weight: 700;
  line-height: 1.3;
}
.sec-store__list dd:last-of-type {
  margin-bottom: 0;
}
.sec-store__list dd a {
  font-weight: 700;
}

.store-star {
  display: none;
}

@media screen and (max-width: 1280px) {
  .sec-store {
    padding: 9.3vw 0 9.3vw;
  }

  .sec-store .com-ttl span {
    padding: 1.5vw 14vw;
  }

  .sec-store__block {
    margin-top: 4.6vw;
  }

  .sec-store__item {
    gap: 0 3.9vw;
    padding: 4.2vw 0 5.8vw;
  }
  .sec-store__item:first-child {
    padding: 5.8vw 0 5.8vw;
  }
  .sec-store__item::after {
    height: 1.5vw;
  }
  .sec-store__item:first-child::before {
    height: 1.5vw;
  }

  .sec-store__imgBox {
    width: 35.1vw;
  }

  .sec-store__ttl {
    font-size: 3.1vw;
  }

  .sec-store__list {
    margin-top: 1.5vw;
  }
  .sec-store__list dt {
    margin-bottom: 0.7vw;
    font-size: 1.9vw;
  }
  .sec-store__list dd {
    margin-bottom: 0.7vw;
    font-size: 1.9vw;
  }
}

@media screen and (max-width: 768px) {
  .sec-store {
    padding: 40px 0 40px;
  }

  .sec-store .com-ttl span {
    padding: 3.9vw 20vw;
  }

  .sec-store__block {
    margin-top: 30px;
  }

  .sec-store__item {
    display: block;
    padding: 30px 0 35px;
  }
  .sec-store__item:first-child {
    padding: 35px 0 35px;
  }
  .sec-store__item::after {
    background: url("../img/deco05-sp.png") left top no-repeat;
    background-size: contain;
    width: 100%;
    height: 0;
    padding-top: calc(100%*18/671);
  }
  .sec-store__item:first-child::before {
    background: url("../img/deco05-sp.png") left top no-repeat;
    background-size: contain;
    width: 100%;
    height: 0;
    padding-top: calc(100%*18/671);
  }

  .sec-store__imgBox {
    width: 100%;
  }

  .sec-store__ttl {
    margin-top: 20px;
    font-size: 6.5vw;
  }

  .sec-store__list {
    margin-top: 15px;
  }
  .sec-store__list dt {
    width: 25%;
    margin-bottom: 10px;
    font-size: 3.6vw;
  }
  .sec-store__list dd {
    width: 70%;
    margin-bottom: 10px;
    font-size: 3.6vw;
  }

  
  .twinkle-wrap-sp {
    display: block;
    position: relative;
    text-align: center;
  }
  .store-star {
    display: block;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 105%;
    aspect-ratio: 674 / 234;
    background: url("../img/star-bg-sp04.png") center / 100% 100% no-repeat;
    pointer-events: none;
    --star-image: url("../img/star-bg-sp04.png");
  }
  .store-star__layer {
    position: absolute;
    inset: 0;
  }
  .store-star__item {
    position: absolute;
    inset: 0;
    background-image: var(--star-image);
    background-position: center;
    background-size: 100% 100%;
    background-repeat: no-repeat;
    clip-path: circle(var(--size) at var(--x) var(--y));
    animation: starTwinkle var(--duration) ease-in-out infinite;
    animation-delay: var(--delay);
  }  
}


/*--------------------------------------------------
　sec-map
--------------------------------------------------*/
.sec-map .sec-inner {
  background: #12a042;
  padding: 120px 100px 120px;
  position: relative;
}
.sec-map .sec-inner::before,
.sec-map .sec-inner::after {
  content: "";
  position: absolute;
  left: 50%;
  transform: translate(-50%,0);
  background: url("../img/deco06.png") left top no-repeat;
  background-size: contain;
  width: 100%;
  height: 40px;
  box-sizing: border-box;
}
.sec-map .sec-inner::before {
  top: 0;
}
.sec-map .sec-inner::after {
  bottom: 0;
  transform: translate(-50%,0) scale(1, -1);
}

.sec-map__list {
  margin-top: 60px;
  position: relative;
}
.sec-map__list::after {
  content: "";
  position: absolute;
  right: 10px;
  bottom: -40px;
  background: url("../img/illust03.png") left top no-repeat;
  background-size: contain;
  width: 186px;
  height: 310px;
  box-sizing: border-box;
}
.sec-map__list li {
  padding: 20px 0 20px 70px;
  font-size: 43px;
  border-bottom: 3px solid #fff;
  position: relative;
}
.sec-map__list li:first-child {
  border-top: 3px solid #fff;
}
.sec-map__list li::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 15px;
  transform: translate(0,-50%) rotate(45deg);
  background: #fff000;
  width: 28px;
  height: 28px;
  box-sizing: border-box; 
}

.sec-map__sb {
  max-width: 1000px;
  margin: 40px auto 0;
}

.sec-map__recommend {
  margin-top: 80px;
  padding: 20px 0;
  position: relative;
}
.sec-map__recommend::before,
.sec-map__recommend::after {
  content: "";
  position: absolute;
  left: 50%;
  transform: translate(-50%,0);
  background: url("../img/deco07.png") left top no-repeat;
  background-size: 100% 100%;
  width: 100%;
  height: 45px;
  pointer-events: none;
}
.sec-map__recommend::before {
  top: 0;
}
.sec-map__recommend::after {
  bottom: 0;
  transform: translate(-50%,0) scale(1, -1);
}

.sec-map__recommend__inner {
  padding: 60px 60px 80px;
  border-left: 9px solid #fff;
  border-right: 9px solid #fff;
}

.sec-map__recommend__ttl01 {
  padding-bottom: 30px;
  font-size: 50px;
  text-align: center;
  border-bottom: 6px solid #fff;
}

.sec-map__recommend__block {
  margin-top: 80px;
}

.sec-map__recommend__item {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 0 20px;
}

.sec-map__recommend__imgBox {
  width: 450px;
}
.sec-map__recommend__item:nth-child(2) .sec-map__recommend__imgBox {
  order: 2;
}

.sec-map__recommend__txtBox {
  flex: 1;
}
.sec-map__recommend__item:nth-child(2) .sec-map__recommend__txtBox {
  order: 1;
}

.sec-map__recommend__ttl02 {
  font-size: 40px;
}

.sec-map__recommend__eng {
  width: 194px;
  margin-top: 30px;
}

.sec-map__recommend .txt {
  margin-top: 20px;
}

.sec-map .note {
  margin-top: 35px;
  font-size: 20px;
  font-weight: 500;
  line-height: 1.5;
}

@media screen and (max-width: 1280px) {
  .sec-map .sec-inner {
    padding: 9.3vw 7.8vw 9.3vw;
  }
  .sec-map .sec-inner::before,
  .sec-map .sec-inner::after {
    height: 3.1vw;
  }

  .sec-map__list {
    margin-top: 4.6vw;
  }
  .sec-map__list::after {
    right: 0.7vw;
    bottom: -3.1vw;
    width: 14.5vw;
    height: 24.2vw;
  }
  .sec-map__list li {
    padding: 1.5vw 0 1.5vw 5.4vw;
    font-size: 3.3vw;
  }
  .sec-map__list li::before {
    left: 1.1vw;
    width: 2.1vw;
    height: 2.1vw;
  }

  .sec-map__sb {
    max-width: 78.1vw;
    margin: 3.1vw auto 0;
  }

  .sec-map__recommend {
    margin-top: 6.2vw;
    padding: 1.5vw 0;
  }
  .sec-map__recommend::before,
  .sec-map__recommend::after {
    height: 3.5vw;
  }

  .sec-map__recommend__inner {
    padding: 4.6vw 4.6vw 6.2vw;
  }

  .sec-map__recommend__ttl01 {
    padding-bottom: 2.3vw;
    font-size: 3.9vw;
  }

  .sec-map__recommend__block {
    margin-top: 6.2vw;
  }

  .sec-map__recommend__item {
    gap: 0 1.5vw;
  }

  .sec-map__recommend__imgBox {
    width: 35.1vw;
  }

  .sec-map__recommend__ttl02 {
    font-size: 3.1vw;
  }

  .sec-map__recommend__eng {
    width: 15.1vw;
    margin-top: 2.3vw;
  }

  .sec-map__recommend .txt {
    margin-top: 1.5vw;
  }

  .sec-map .note {
    margin-top: 2.7vw;
    font-size: 1.5vw;
  }
}

@media screen and (max-width: 768px) {
  .sec-map .sec-inner {
    padding: 30px 20px 30px;
  }

  .sec-map .com-ttl {
    display: block;
  }
  .sec-map .com-ttl span {
    display: block;
    padding: 3.9vw 3vw;
  }
  
  .sec-map__list {
    margin-top: 30px;
  }
  .sec-map__list::after {
    display: none;
  }
  .sec-map__list li {
    padding: 12px 0 12px 7.2vw;
    font-size: 4.1vw;
    border-bottom: 2px solid #fff;
  }
  .sec-map__list li:first-child {
    border-top: 2px solid #fff;
  }
  .sec-map__list li::before {
    left: 5px;
    width: 12px;
    height: 12px;
  }

  .sec-map__sb {
    max-width: 100%;
    margin: 10px auto 0;
  }

  .sec-map__recommend {
    margin-top: 25px;
    padding: 20px 0;
    position: relative;
  }
  .sec-map__recommend::before,
  .sec-map__recommend::after {
    background: url("../img/deco07-sp.png") left top no-repeat;
    background-size: 100% auto;
    width: 100%;
    height: 45px;
  }

  .sec-map__recommend__inner {
    padding: 10px 20px 20px;
    border-left: 4px solid #fff;
    border-right: 4px solid #fff;
  }

  .sec-map__recommend__ttl01 {
    padding-bottom: 15px;
    font-size: 5.2vw;
    border-bottom: 3px solid #fff;
  }

  .sec-map__recommend__block {
    margin-top: 30px;
  }

  .sec-map__recommend__item {
    display: block;
    margin-bottom: 30px;
  }
  .sec-map__recommend__item:last-child {
    margin-bottom: 0;
  }

  .sec-map__recommend__imgBox {
    width: 80%;
    margin: auto;
  }

  .sec-map__recommend__ttl02 {
    margin-top: 20px;
    font-size: 5.2vw;
    text-align: center;
  }

  .sec-map__recommend__eng {
    width: 45%;
    margin: auto;
    margin-top: 15px;
  }

  .sec-map__recommend .txt {
    margin-top: 10px;
  }

  .sec-map .note {
    margin-top: 15px;
    font-size: 3.1vw;
  }
}