@charset "UTF-8";
*:focus {
  outline: none;
}

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: inherit;
  font-size: 100%;
  vertical-align: baseline;
  box-sizing: border-box;
}

html {
  /* line-height: 1.8; */
  -webkit-text-size-adjust: 100%;
  -ms-text-size-adjust: 100%;
  -webkit-overflow-scrolling: touch;
}

img {
  line-height: 0;
  max-width: 100%;
}

ol, ul {
  list-style: none !important;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

caption, th, td {
  text-align: left;
  font-weight: normal;
  vertical-align: middle;
}

q, blockquote {
  quotes: none;
}

q:before, q:after {
  content: "";
  content: none;
}

blockquote:before, blockquote:after {
  content: "";
  content: none;
}

a {
  text-decoration: none;
  color: #333;
  -webkit-tap-highlight-color: transparent;
  transition: all ease 0.3s;
}

a:hover {
  text-decoration: none;
}

a img {
  border: none;
}

article, aside, details, figcaption, figure, footer, header, hgroup, main, menu, nav, section, summary {
  display: block;
}

input[type=button], input[type=submit] {
  -webkit-appearance: none;
}

label {
  -webkit-tap-highlight-color: transparent;
}

body {
  color: #323232;
	font-family: "Noto Sans JP","ヒラギノ角ゴ ProN W3","Hiragino Kaku Gothic ProN","メイリオ",Meiryo,sans-serif;
  line-height: 1.8;
  line-break: strict;
  word-wrap: break-word;
  overflow-wrap: break-word;
  word-break: break-all;
  /*-webkit-font-feature-settings: "palt" 1;
          font-feature-settings: "palt" 1;*/
}

h1, h2, h3, h4, h5, h6 {
  letter-spacing: normal;
}

button {
  border: none;
  background: none;
}


/*
  ここまでcommon
--------------------------------------------- */
.pc {
  display: none;
}

.sp {
  display: inherit;
}

.palt {
  font-feature-settings: "palt" 1;
}

a:hover {
  opacity: 0.8;
}

.mb0 {
  margin-bottom: 0 !important;
}

/* /////////////////// ここから /////////////////// */

header {
  width: 100%;
  background: #fff;
}

.head {
  width: 100%;
  height: calc(60vw / 5);
  display: flex;
  justify-content: flex-start;
  align-items: center;
  background-color: #fff;
  /* position: fixed;
  top: 0;
  left: 0;
  z-index: 10; */
}
.head a {
  display: block;
  margin-left: calc(14vw / 5);
  width: calc(75vw / 5);
  line-height: 0;
}

section {
  text-align: center;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  position: relative;
  width: 100%;
}

.cont {
  display: block;
  padding-right: calc(50vw / 5);
  padding-left: calc(50vw / 5);
}
p {
  font-size: clamp(10px, calc(18vw / 5), 18px);
  margin-top: calc(55vw / 5);
  margin-bottom: calc(55vw / 5);
}
.em {
  color: #d1201a;
}
.notes {
  font-size: clamp(10px, calc(12vw / 5), 12px);
  margin-top: unset;
}
.notes_list {
  text-align: left;
  font-size: clamp(12px, calc(18vw / 5), 12px);
  margin-top: unset;
}
.notes_list li {
  text-indent: -1em;
  padding-left: 1em;
}
p + .notes_list,
p + .notes {
  margin-top: unset!important;
}
.btn {
  display: block;
  width: calc(400vw / 5);
  margin-left: auto;
  margin-right: auto;
  margin-bottom: calc(36vw / 5);
}
.btn.pc {
  display: none;
}
img.pc {
  display: none;
}

.style_ttl {
  margin-bottom: calc(45vw / 5);
}
.style_txt {
  font-size: clamp(10px , calc(18vw / 5), 18px);
}
.first {
  /* position: fixed; */
  top: 0;
  left: 0;
  width: 100%;
  z-index: 99;
}

.btn_video {
  display: block;
  width: calc(250vw / 5);
  margin-bottom: calc(45vw / 5);
}
.wrap {
  position: relative;
  /* z-index: 100; */
}
.kv {
  max-width: 100%;
  height: 100vh;
  padding-top: calc(630 / 500 * 100%);
  background-image: url(../images/kvimg_sp.webp),linear-gradient(-148deg,rgba(209, 32, 26, 1) 0%, rgba(93, 20, 0, 1) 100%);
  background-repeat: no-repeat;
  background-position: 50% 0;
  background-size: 100%;
  /* transition: opacity 0.8 linear,z-index 0.8 linear; */
  position: absolute;
  top: calc(60vw / 5);
  left: 0;
  right: 0;
  margin: auto;
  z-index: 5;
  opacity: 0;
}
.kv h1 {
  max-width: 100%;
  height: calc(354vw / 5);
  display: flex;
  justify-content: center;
  align-items: center;
  margin-top: calc(-33vw / 5);
}
.kv h1 img {
  width: calc(450vw / 5);
  margin-left: auto;
  margin-right: auto;
}
.sec01 {
  /* padding-top: 103vh; */
  /* margin-top: calc(78vw / 5); */
  padding-bottom: calc(525vw / 5);
  background: url(../images/sec01_03_sp.jpg) no-repeat 0 100% #fff;
  background-size: contain;
  margin-bottom: calc(55vw / 5);
}
.sec01_01 {
  margin-bottom: calc(42vw / 5);
}
.sec01_txt {
  margin-top: 0;
  font-size: clamp(10px, calc(18vw / 5) ,18px);
}
.sec02_cp {
  margin-bottom: calc(40vw / 5);
}
.sec02_oc {
  margin-bottom: calc(40vw / 5);
}
.sec02 .notes_list {
  margin-bottom: calc(77vw / 5);
}
.sec03,.sec04 {
  margin-top: calc(78vw / 5);
  padding-bottom: calc(50vw / 5);
}
.sec03 p,.sec04 p {
  margin-top: calc(45vw / 5);
}
.sec03_hr {
  width: calc(400vw / 5 );
  margin: calc(65vw / 5) 0;
  margin-left: auto;
  margin-right: auto;
  border: none;
  border-top: 1px solid #b39239;
  border-width: 1px;
}
.sec034_bg {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  background: url(../images/bg_tone.png) no-repeat 50% 0 #f7f3e9;
  background-size: contain;
  padding-top: calc(130vw / 5);
}
.sec034_ttl {
  margin-bottom: calc(40vw / 5);
}
.sec03_bnr {
  display: block;
  width: calc(400vw / 5);
  line-height: 0;
}
.sec034_bg p {
  text-align: left;
}
.sec04_txt {
  margin-bottom: calc(40vw / 5);
}
.sec04_ptc {
  margin-bottom: calc(45vw / 5);
}
.sec04_box {
  position: relative;
  line-height: 0;
}
.btn_detail_s {
  margin-bottom: 0;
  position: absolute;
  width: calc(165vw / 5);
  border-radius: calc(35vw / 5);
  background: url(../images/btn_dets_arrow.png) no-repeat calc(144vw / 5) 50% #fff;
  background-size: calc(5vw / 5);
  right: calc(20vw / 5);
  bottom: calc(23vw / 5);
  font-weight: 500;
  line-height: 2;
}

.sec05_bg {
  padding-top: calc(45vw / 5);
  background-color: #f7f4eb;
}
.sec05_box {
  background: url(../images/bg_naname.png) no-repeat 0 0;
  background-size: contain;
}
.sec05_box img + p {
  margin: calc(30vw / 5) 0 calc(50vw / 5);
  text-align: left;
}
.sec05_box img + p.sec05_txtpair {
  margin-bottom: calc(30vw / 5);
}
.sec05_box img + p.sec05_txtpair + p {
  margin-bottom: calc(30vw / 5);
}
.sec05_bg_last {
  padding-top: unset;
  padding-bottom: calc(73vw / 5);
}
.sec05_webnyukai {
  position: relative;
}
.sec05_webnyukai .btn_nyukai {
  position: absolute;
  right: 0;
  bottom: calc(55vw / 5);
  left: 0;
  margin: auto;
}
.sec06_01 {
  padding-top: calc(90vw / 5);
}
.sec06_01 img {
  margin-bottom: calc(42vw / 5);
}
.sec06_01 a {
  margin-bottom: calc();
}
.sec06_01 a img {
  margin-bottom: unset;
}
.sec06_02 {
  padding-bottom: calc(68vw / 5);
  background: url(../images/sec06_03_sp.jpg) no-repeat 0 calc(390vw / 5);
  background-size: contain;
}
.sec06_bb {
  margin-bottom: calc(570vw / 5);
}
footer {
  padding: calc(35vw / 5);
}
.footer_logo {
  display: block;
  width: calc(180vw / 5);
  margin-left: auto;
  margin-right: auto;
}
.first.zno {
  z-index: -1;
  /* position: relative; */
}


/* ナビゲーション */

.fixbtns .all-btn{
  text-align: center;
}
.fixbtns .all-btn a{
  color: #001527;
  font-size: calc(30vw / 7.68);
}


.all-btn {
  margin: auto;
}
.all-btn a{
  display: block;
  width: 100%;
  height: 100%;
  line-height: calc(81vw / 7.68);
  font-weight: 900;
  color: #fff;
  font-size: calc(40vw / 7.68);
  letter-spacing: 0.1em;
}

.fixbtns {
  position: fixed;
  inset: auto 0 0 0;
  opacity: 0;
  transform: translate(0, 110%);
  transition: opacity 100ms linear 0ms, transform 250ms ease-in 0ms;
  z-index: 100;
  padding:calc(20vw / 7.68) 0;
  background-color: #d1201a;
  /* background: linear-gradient(to right,#51c0e4 ,#3f227f); */
}

.fixbtns:not(.is-shown) {
  pointer-events: none;
}

.fixbtns.is-shown {
  opacity: 1;
  transform: translate(0, 0%);
}

.fixbtns_buttons {
  display: grid;
  justify-content: center;
  align-items: center;
}



.anm.ttlIn  {
  opacity: 0;
  transition: 1.5s all;
}
.anm.ttlIn.is_animated  {
  opacity: 1;
}

.fixbtns .all-btn.clubbtn2{
  height: calc(80vw / 7.68);
	background: none;
	width: calc(700vw / 7.68);
	display: flex;
	justify-content: space-between;
	gap:calc(10vw / 7.68) calc(20vw / 7.68);
}
.fixbtns .all-btn.clubbtn2 a{
	background: #fff;
  width: calc(300vw / 7.68);
  border-radius: calc(40vw / 7.68);
  position: relative;
  font-size: calc(30vw / 7.68);
  line-height: calc(77vw / 7.68);
}
.fixbtns .all-btn.clubbtn2 a.clubbtn {
  letter-spacing: 0;
  line-height: 1.2;
  font-size: calc(24vw / 7.68);
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  background-color: #fff;
  color: #d1201a;
}
.fixbtns .all-btn.clubbtn2 img{
	position: absolute;
	top:50%;
	transform: translateY(-50%);
	right:calc(16vw / 7.68);
	height: calc(22vw / 7.68);
	width: calc(12vw / 7.68);
}
.fixbtns_note{
  color: #FFFFFF;
	text-align: left;
	width: calc(648vw / 7.68);
	margin: auto;
	padding: .7em 0 0;
  
}
.fixbtns_note p {
  font-size: calc(20vw / 7.68);
  line-height: 1.2;
  font-weight: 500;
  margin: 0;
}

/* //////////////////////////////////////////////////////////////////////////////// PC //////////////////////////////////////////////////////////////////////////////// */
@media screen and (min-width: 501px) {
  aside {
    display: none;
  }
  .pc {
    display: inherit;
  }

  .sp {
    display: none;
  }
  header {
    position: relative;
  }
  .mv_wrap {
    width: 100%;
    /* max-width: 1280px; */
    margin-inline: auto;
    position: relative;
  }
  .head {
    width: 100%;
    height: 80px;
  }
  .head a {
    display: block;
    margin-left: 20px1.5625vw;
    width: 150px;
  }

  section {
    max-width: 500px;
    margin-left: auto;
    margin-right: auto;
    background-color: #fff;
  }

  .wrap {
    /* max-width: 1280px; */
    max-width: 100%;
    margin-left: auto;
    margin-right: auto;
    background: url(../images/bg_wrap.jpg) repeat-y 50% 0;
    background-size: contain;
    position: relative;
  }
  .cont {
    display: block;
    padding-right: 50px;
    padding-left: 50px;
  }
  p {
    font-size: 15px;
    margin-top: 55px;
    margin-bottom: 55px;
  }
  .em {
    color: #d1201a;
  }
  .notes {
    font-size: 12px;
    margin-top: unset;
    text-align: left;
  }
  .notes_list {
    text-align: left;
    font-size: 12px;
    margin-top: unset;
  }
  .notes_list li {
    text-indent: -1em;
    padding-left: 1em;
  }
  p + .notes_list,
  p + .notes {
    margin-top: unset!important;
  }
  .btn {
    display: block;
    width: 400px;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 36px;
  }
  .btn.sp {
    display: none;
  }
  img.sp {
    display: none;
  }
  .style_ttl {
    margin-bottom: 45px;
  }
  .btn_video {
    display: block;
    width: 250px;
    margin-bottom: 45px;
  }
  .first {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 99;
    opacity: 0;
    transition: opacity .4s ease 0s,z-index .5s ease 0.1s;
  }
  .kv {
    top: 80px;
  }
  .kv h1 {
    /* background-image: url(../images/kvimg02_pc.webp); */
    height: calc(180vw / 12.8);
    margin-top: calc(-67vw / 12.8);
  }
  .kv h1 img {
    width: calc(1050vw / 12.8);
  }
  .sec01 {
    /* padding-top: 70vh; */
    /* margin-top: 78px; */
    padding-bottom: 55px;
    background: unset;
    background-color: #fff;
    margin-bottom: unset;
  }
  .sec01_01 {
    margin-bottom: 42px;
  }
  .sec01_txt {
    margin-top: 0;
  }
  .sec02_cp {
    margin-bottom: 40px;
  }
  .sec02_oc {
    margin-bottom: 40px;
  }
  .sec02 .notes_list {
    margin-bottom: 77px;
  }
  .sec03,.sec04 {
    margin-top: unset;
    padding-top: 78px;
    padding-bottom: 50px;
  }
  .sec03 p,.sec04 p {
    margin-top: 45px;
  }
  .sec03_hr {
    width: 400px;
    margin: 65px 0;
    margin-left: auto;
    margin-right: auto;
    border: none;
    border-top: 1px solid #b39239;
    border-width: 1px;
  }
  .sec034_bg {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    background: url(../images/bg_tone.png) no-repeat 50% 0 #f7f3e9;
    background-size: contain;
    padding-top: 130px;
  }
  .sec034_ttl {
    margin-bottom: 40px;
  }
  .sec03_bnr {
    display: block;
    width: 400px;
    line-height: 0;
  }
  .sec034_bg p {
    text-align: left;
  }
  .sec04_txt {
    margin-bottom: 40px;
  }
  .sec04_ptc {
    margin-bottom: 45px;
  }
  .sec04_box {
    position: relative;
    line-height: 0;
  }
  .btn_detail_s {
    margin-bottom: 0;
    position: absolute;
    width: 165px;
    border-radius: 35px;
    background: url(../images/btn_dets_arrow.png) no-repeat 144px 50% #fff;
    background-size: 5px;
    right: 20px;
    bottom: 23px;
    font-weight: 500;
    line-height: 2;
  }

  .sec05_bg {
    padding-top: 45px;
    background-color: #f7f4eb;
  }
  .sec05_box {
    background: url(../images/bg_naname.png) no-repeat 0 0;
    background-size: contain;
  }
  .sec05_box img + p {
    margin: 30px 0 50px;
  }
  .sec05_box img + p.sec05_txtpair {
    margin-bottom: 30px;
  }
  .sec05_box img + p.sec05_txtpair + p {
    margin-bottom: 30px;
  }
  .sec05_bg_last {
    padding-top: unset;
    padding-bottom: 73px;
  }
  .sec05_webnyukai {
    position: relative;
  }
  .sec05_webnyukai .btn_nyukai {
    position: absolute;
    right: 0;
    bottom: 55px;
    left: 0;
    margin: auto;
  }
  .sec06_01 {
    padding-top: 90px;
  }
  .sec06_01 img {
    margin-bottom: 42px;
  }
  .sec06_01 a img {
    margin-bottom: unset;
  }
  .sec06_02 {
    padding-top: 660px;
    padding-bottom: 68px;
    background: url(../images/sec06_01_pc.jpg) no-repeat 50% 0;
    background-size: contain;
  }
  .sec06_bb.sp {
    display: none;
  }
  .sec06_bb {
    margin-bottom: unset;
  }
  .sec07_cont {
    /* padding-top: 178px;
    padding-bottom: 100px; */
    background-image: linear-gradient(145deg, rgba(209, 32, 26, 1), rgba(163, 26, 16, 1));
    height: 100vh;
    display: flex;
    justify-content: center;
    align-items: center;
  }
  /* .sec07_01 {
    margin-bottom: 156px;
  } */
  footer {
    position: relative;
    padding: unset;
  }
  .footer_inr {
    padding: 30px 0;
    width: 100%;
    background-color: #fff;
    position: absolute;
    z-index: 15;
    left: 0;
    /* bottom: 0; */
  }
  .footer_logo {
    display: block;
    margin-left: auto;
    margin-right: auto;
    width: 180px;
  }

  .right-box,.left-box {
    width: calc(50% - 250px);
    height: 100vh;
    position: fixed;
    top: 0;
    background-position: 0 0;
    background-size: cover;
    background-repeat: no-repeat;
    /* opacity: 0; */
  }
  .left-box {
    left: 0;
    background-image: url(../images/fixed_left.jpg);
    display: flex;
    justify-content: center;
    align-items: center;
  }
  .left-box img {
    width: calc(295vw / 12.8 );
  }
  .right-box {
    right: 0;
    background-image: url(../images/fixed_right.jpg);
  }

  .wrap_nav {
    position: relative;
  }
  .right-nav {
    position: fixed;
    width: calc(50% - 250px);
    height: 100vh;
    right: 0;
    top: 0;
  }
  .right-nav ul {
    padding-left: calc(30vw / 12.8);
    position: absolute;
    top: 50%;
    left: 50%;
    /* right: 0;
    bottom: 0; */
    width: 100%;
    transform: translate(-50%,-50%);
  }
  .right-nav ul li {
    font-size: clamp(10px, calc(18vw / 12.8),18px);
    padding-left: calc(15vw / 12.8);
    background: url(../images/nav_ic.png) no-repeat 0 50%;
    background-size: 8px;
  }
  .right-nav ul li a {
    color: #d1201a;
  }
  .right-nav ul li.nav_btn {
    background: unset;
    padding-left: unset;
    margin-bottom: calc(165vw / 12.8);
    line-height: 0;
  }
  .right-nav ul li.nav_btn a {
    display: block;
    width: calc(208vw / 12.8);
  }
  .right-nav ul li.nav_btn_taiken {
    margin-top: calc(40vw / 12.8 );
    margin-bottom: calc(30vw / 12.8);
  }
  .right-nav ul li.nav_logo {
    background: unset;
    padding-left: unset;
    margin-left: calc(40vw / 12.8);
  }
  .right-nav ul li.nav_logo a {
    display: block;
    width: calc(130vw / 12.8);
    position: absolute;
  }
  .left-nav {
    position: fixed;
    width: calc(50% - 250px);
    height: 100vh;
    left: 0;
    top: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    /* padding-right: calc(47vw / 12.8); */
  }
  .left-nav img {
    display: block;
    width: calc(295vw / 12.8 );
    /* padding-left: calc(47vw / 12.8); */
  }
  .wrap_last {
    position: relative;
    min-height: 200vh;
  }
  .sec06 {
    position: sticky;
    z-index: 10;
    top: calc(100vh - var(--sticky-h));
    --sticky-h: auto; /* 一旦 auto にして JS で上書き */
  }
  /* .sec06 {
  } */
  .sec07 {
    /* height: 100vh; */
    z-index: 11;
    --sticky-h: auto; /* 一旦 auto にして JS で上書き */
  }
  .sec07_left,.sec07_right {
    width: calc(50% - 250px);
    position: fixed;
    top: 0;
    height: 100vh;
    /* padding-top: calc(1440 / 780 * 100%); */
    background-repeat: no-repeat;
    background-position: 50% 0;
    background-size: cover;
    /* opacity: 0; */
  }
  /* .sec07_left img,.sec07_right img {
    object-fit: cover;
  } */
  .sec07_left {
    background-image: url(../images/fixed_left_sec07.jpg);
    left: 0;
  }
  .sec07_right {
    background-image: url(../images/fixed_right_sec07.jpg);
    right: 0;
  }
  .sec07 .btn_detail {
    position: absolute;
    bottom: 100px;
    left: 0;
    right: 0;
    margin: auto;
  }

}
@media (min-width: 500px) and (orientation: landscape) {
  /* 画面が横向き(横長)の場合 */
  img.sp {
    display: none;
  }
  img.pc {
    display: inherit;
  }
  .kv {
    max-width: 100%;
    padding-top: calc(527 / 1280 * 100%);
    background-image: url(../images/kvimg_pc.webp),linear-gradient(-148deg,rgba(209, 32, 26, 1) 0%, rgba(93, 20, 0, 1) 100%);
    background-size: contain;
    top: 80px;
    height: inherit;
    position: sticky;
  }
}
@media (min-width: 500px) and (orientation: portrait) {
  /* 画面が縦向き(縦長)の場合 */
  img.sp {
    display: inherit;
  }
  img.pc {
    display: none;
  }
  .first {
    position: relative;
    transition: opacity .8s ease .5s,z-index .8s ease .5s;
  }
  .kv {
    height: inherit;
  }
  .kv h1 img {
    width: calc(450vw / 5);
  }
  .kv h1 {
    height: calc(354vw / 5);
    margin-top: calc(-33vw / 5);
  }
}
@media (min-width: 1024px) and (orientation: portrait) {
  .first {
    transition: opacity 1.3s ease .2s,z-index 1.3s ease .5s;
  }
}

@media screen and (min-width: 1280px) {
  .kv h1 {
    height: 180px;
    margin-top: calc(-67vw / 12.8);
  }
  .kv h1 img {
    width: 1050px;
  }

  .right-nav ul {
    padding-left: 52px;
  }
  .right-nav ul li {
    padding-left: 15px;
  }
  .right-nav ul li.nav_btn {
    margin-bottom: 165px;
  }
  .right-nav ul li.nav_btn a {
    width: 287px;
  }
  .right-nav ul li.nav_btn_taiken {
    margin-top: 40px;
    margin-bottom: 30px;
  }
  .right-nav ul li.nav_logo {
    margin-left: 77px;
  }
  .right-nav ul li.nav_logo a {
    width: 130px;
  }
  /* .left-nav {
    padding-right: 47px;
  }
  .left-nav img {
    width: 295px;
    padding-left: 47px;
  } */
    /* .left-box img {
    width: 295px;
  } */

}