@charset "UTF-8";

/* ==== color ========================== */
:root {
  --color-black: #121212;
  --color-white: #ffffff;
  --color-yellow: #F6C93A;
  --color-t-yellow: #DDAD14;
  --color-bg: #F3F3F3;

  --noto: "Noto Sans JP", sans-serif;
  --roboto: "Roboto", sans-serif;



}


/*================================================
 *  一般・共通設定
 ================================================*/
html {
  font-size: clamp(6.6px, 0.8474vw, 10px);
  scroll-behavior: smooth;
}

body {
  font-family: "Noto Sans JP", sans-serif;
  font-weight: 400;
  font-size: 1.4rem;
  background: var(--color-bg);
  color: var(--color-black);
}

body * {
  letter-spacing: 0.03em;
}

a {
  text-decoration: none;
  transition: all .4s;
}

a:hover {
  opacity: 1;
}

img {
  max-width: 100%;
  display: inline-block;
}

strong {
  font-weight: bold;
}

small {
  font-size: smaller;
}

ul,
ol,
dl {
  margin: 0;
}

ul li {
  list-style: none;
}

ol li {
  list-style: decimal;
}

li {
  margin-left: 0;
}



@media screen and (max-width:767px) {
  html {
    font-size: 10px;
  }
}

/*================================================
 *  section btn
 ================================================*/
section {
  position: relative;
  background: var(--color-bg);
}



.c_wrap {
  width: 91.3%;
  margin-left: auto;
  margin-right: auto;
}

.ptb_md {
  padding-top: 12rem;
  padding-bottom: 12rem;
}

.pt_md {
  padding-top: 12rem;
}

.pt_lg {
  padding-top: 14rem;
}

.pb_md {
  padding-bottom: 12rem;
}

.pb_lg {
  padding-bottom: 14rem;
}

.c_hd {
  margin-bottom: 5rem;
}

.c_hd span {
  display: block;
}

.c_hd .en {
  color: var(--color-t-yellow);
  font-family: var(--roboto);
  font-size: 6rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0;
  margin-bottom: 1rem;
}

.c_hd .ja {
  font-size: 1.5rem;
  font-weight: 500;
}




.b-t {
  border-top: 1px solid var(--color-yellow);
}

.b-b {
  border-bottom: 1px solid var(--color-yellow);
}

.icon {
  background-size: contain;
  background-repeat: no-repeat;
  vertical-align: middle;
  display: inline-block;
}

.icon_arrow {
  background-image: url(../images/nav_arrow.svg);
  width: 3.6rem;
  height: 3.6rem;
}

.c_btn {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 18rem;
  color: var(--color-yellow);
  font-family: var(--roboto);
  background: var(--color-black);
  border-radius: 100px;
  height: 5rem;
  font-weight: 500;
  font-size: 1.6rem;
}


.c_btn i {
  width: 1.5rem;
  height: 1.5rem;
  background-image: url(../images/arrow_y.svg);
}

@media screen and (max-width:768px) {
  .c_wrap {
    width: 89.333%;
    margin-left: auto;
    margin-right: auto;
  }

  .c_hd {
    margin-bottom: 4rem;
  }

  .c_hd .en {
    font-size: 4.8rem;
  }

  .pt_lg,
  .pt_md {
    padding-top: 8rem;
  }

  .pb_md,
  .pb_lg {
    padding-bottom: 8rem;
  }

  .ptb_md {
    padding-top: 8rem;
    padding-bottom: 8rem;
  }
}

/*================================================
 *  header
 ================================================*/
header {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 100;
  border-bottom: 1px solid rgb(18 18 18 / 40%);
  height: 10rem;
  padding: 3rem 34.5% 0 4rem;
}


.nav_inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.nav_left a {
  display: flex;
  align-items: center;
  gap: 1.7rem;
}

.nav_left a span {
  line-height: 1.35;
  font-weight: 500;
  font-size: 1.3rem;
  letter-spacing: 0.05em;
}

.nav_left a img {
  width: 7.6rem;
}

.nav_right .nav_menu {
  display: flex;
  align-items: center;
  justify-content: end;
  gap: 3.6rem;
  font-size: 1.5rem;
  font-weight: 700;
}

.nav_right .nav_menu li a span {
  display: none;
}

.nav_right .nav_menu .contact {
  position: fixed;
  top: 0;
  right: 0;
}

.nav_right .nav_menu .contact a {
  background: var(--color-yellow);
  font-size: 1.7rem;
  font-weight: 700;
  padding: 4rem 4.2rem;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
}

.nav_right .nav_menu .contact a .icon_arrow {
  width: 1.5rem;
  height: 1.5rem;
}

#fix_btn {
  display: none;
}

@media screen and (max-width:1023px) {
  header {
    padding: 24px 0 0 20px;
    height: clamp(60px, 21.333vw, 80px);
  }

  .nav_left a {
    gap: 13px;
  }

  .nav_left a img {
    width: 60px;
  }

  .nav_left a span {
    font-size: 12px;
  }




  .nav_right .nav_menu {
    display: block;
  }

  .nav_right .nav_menu li {
    border-top: 1px solid rgb(18 18 18 / 40%);
  }

  .nav_right .nav_menu li a {
    padding: 28px 20px 24px;
    font-size: 24px;
    font-weight: 700;
    display: block;
  }

  .nav_right .nav_menu li a span {
    display: block;
    color: var(--color-yellow);
    font-family: var(--roboto);
    font-size: 16px;
    font-weight: 500;
    margin-top: 5px;
  }

  .nav_right .nav_menu .contact {
    position: static;
    padding-top: 24px;
  }

  .nav_right .nav_menu .contact a {
    width: calc(100% - 40px);
    margin: 0 auto;
    padding: 26px 0;
    font-size: 15px;
  }

  .nav_right .nav_menu .contact a .icon_arrow {
    width: 15px;
    height: 15px;
  }

  .nav_right .nav_menu .sp_logo {
    height: clamp(60px, 21.333vw, 80px);
    border-top: none;
    padding: 24px 0 0 20px;
  }

  .nav_right .nav_menu .sp_logo a {
    gap: 13px;
    display: flex;
    align-items: center;
    padding: 0;
  }

  .nav_right .nav_menu .sp_logo a img {
    width: 60px;
  }

  .nav_right .nav_menu .sp_logo a span {
    font-size: 12px;
    color: #121212;
    line-height: 1.35;
    font-weight: 500;
    letter-spacing: 0.05em;
    margin: 0;
  }

  .hamburger {
    position: fixed;
    right: 0;
    top: 0;

    width: clamp(60px, 21.333vw, 80px);
    height: clamp(60px, 21.333vw, 80px);



    background: var(--color-black);

    cursor: pointer;
    z-index: 300;
    transition: all .1s ease-out;
  }



  /* line open */
  .hamburger__line {
    position: absolute;
    left: 50%;
    width: 53.33%;
    height: 1px;
    background-color: var(--color-white);
    transition: all .4s ease-out;
    transform: translateX(-50%);
  }

  .hamburger__line--1 {
    top: calc(50% - 9px);
  }

  .hamburger__line--2 {
    top: 50%;
  }

  .hamburger__line--3 {
    top: calc(50% + 9px);
  }

  /* line close */
  .open_nav .hamburger__line--1 {
    transform: translateX(-50%) rotate(45deg);
    top: 50%;
  }

  .open_nav .hamburger__line--2 {
    width: 0;
    left: 50%;
  }

  .open_nav .hamburger__line--3 {
    transform: translateX(-50%) rotate(-45deg);
    top: 50%;
  }

  /* ハンバーガーメニュー内 */
  nav.global__nav {
    position: fixed;
    right: 0;
    top: 0;
    width: 100%;
    height: 100vh;
    background: var(--color-bg);
    transition: all .3s ease-out;
    z-index: 200;
    overflow-y: scroll;
    padding: 0 0 10rem 0;
    opacity: 0;
    pointer-events: none;
  }

  /* 表示 */
  .open_nav .global__nav {
    opacity: 1;
    pointer-events: fill;
  }



  #fix_btn {
    display: block;
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    z-index: 20;
    border-top: 1px solid var(--color-black);
  }

  #fix_btn a {
    background: var(--color-yellow);
    font-weight: 700;
    padding: 26px 0;
    font-size: 15px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
  }

  #fix_btn a .icon_arrow {
    width: 15px;
    height: 15px;
  }

}


/*================================================
* mainVisual
================================================*/

#main_bg {
  position: fixed;
  top: 0;
  left: 0;
  z-index: -1;
  display: block;
  width: 100vw;
  height: 100vh;
}


#mainVisual {
  height: 100vh;
  background: transparent;
}



.mainVisual_inner {
  position: relative;
  height: calc(100vh - 4.68vw);
}

.mainVisual_inner::before {
  position: absolute;
  content: "";
  width: 100%;
  height: 100%;
  background: rgb(255 255 255 / 25%);
  top: 0;
  left: 0;
  backdrop-filter: blur(20px);
  z-index: 2;
}



.loop_swiper-main .swiper-wrapper {
  transition-timing-function: linear;
}

.loop_swiper-main .swiper-slide {
  width: auto;
  height: 100vh;
}

.loop_swiper-main .swiper-slide img {
  overflow: hidden;
  object-fit: cover;
  height: 100%;
  width: auto;
  max-width: unset;
}

.mv_catch {
  position: absolute;
  top: 25%;
  left: 50%;
  transform: translate(-50%, 0);
  z-index: 3;
  width: 100%;
}


.mv_catch h2 img {
  height: 51.6vh;
}



.mv_date {
  position: absolute;
  bottom: 0;
  left: 50%;
  width: 100%;
  transform: translateX(-50%);
  z-index: 3;
  display: flex;
  align-items: center;
}

.mv_date div {
  height: 4.86vw;
}

.mv_date div img {
  height: 100%;
  max-width: unset;
}

#secondArea {
  height: 100vh;
}

@media screen and (max-width:1023px) {


  .mainVisual_inner {
    height: calc(100vh - 70px);
  }

  .mv_catch {
    min-width: unset;
    width: 96%;
    max-width: 500px;

  }

  .mv_catch h2 img {
    height: auto;
  }

  .mv_date {
    bottom: 70px;
  }

}

@media screen and (max-width: 600px) {
  #mainVisual {
    min-height: calc(480px + (44.533vw + 70px));
  }

  .mainVisual_inner {
    height: calc(100vh - (44.533vw + 70px));
    min-height: 480px;
  }

  .mv_catch {
    top: 52.8%;
    transform: translate(-50%, -50%);
    width: 96%;
  }



  .mv_date {
    flex-wrap: wrap;
  }

  .mv_date div {
    height: auto;
    width: 100%;
    position: relative;
  }



}



/*================================================
* 
================================================*/

.fix_side {
  position: sticky;
  top: 0;
  left: 0;
  width: 6rem;
  padding: 3.4rem 0;
  height: 100vh;
  border-right: 1px solid var(--color-yellow);


  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-direction: column;
}

.fix_ttl-inner {
  color: #E0B017;
  font-family: var(--roboto);
  font-weight: 700;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
}

.fix_ttl-inner span {
  display: block;
}

.fix_ttl-inner .num {
  font-size: 1.6rem;
  width: 3rem;
  text-align: center;
  padding-bottom: 3.1rem;
  margin-bottom: 2.7rem;
  border-bottom: 1px solid var(--color-yellow);
}

.fix_ttl-inner .ttl {
  -webkit-writing-mode: vertical-rl;
  -ms-writing-mode: tb-rl;
  writing-mode: vertical-rl;
  font-size: 1.5rem;
}

.fix_page {
  display: flex;
  align-items: center;
  justify-content: start;
  gap: 1.2rem;
  flex-direction: column;
}

.fix_page span {
  display: block;
  width: 6px;
  height: 6px;
  background: #E0E0E0;
}

.fix_page .active {
  background: var(--color-yellow);
}


.clm_cnt {
  width: calc(100% - 6rem);
  margin-left: auto;
}

.clm_inner {
  position: relative;
  display: flex;
  align-items: start;
}

@media screen and (max-width:767px) {
  .clm_inner {
    flex-wrap: wrap;
  }

  .fix_side {
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
    padding: 12px 20px;
    height: auto;
    border: 1px solid var(--color-yellow);
    background: var(--color-bg);
    z-index: 20;
  }

  .fix_ttl-inner {
    justify-content: start;
    flex-direction: unset;
    gap: 20px;
  }

  .fix_ttl-inner .num {
    font-size: 12px;
    width: auto;
    padding-bottom: 0;
    margin-bottom: 0;
    border-bottom: unset;
    border-right: 1px solid var(--color-yellow);
    padding: 4px 20px 2px 0;
  }

  .fix_ttl-inner .ttl {
    -webkit-writing-mode: unset;
    -ms-writing-mode: unset;
    writing-mode: unset;
    font-size: 12px;
  }

  .fix_page {
    display: none;
  }

  .clm_cnt {
    width: 100%;
  }
}

/*================================================
* outline
================================================*/


.outline_ttl {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  margin: 14rem auto;
  padding: 1.6rem 2.4rem;
  position: relative;
  background:
    /* 左上 */
    linear-gradient(#000 0 0) left top,
    linear-gradient(#000 0 0) left top,
    /* 右上 */
    linear-gradient(#000 0 0) right top,
    linear-gradient(#000 0 0) right top,
    /* 左下 */
    linear-gradient(#000 0 0) left bottom,
    linear-gradient(#000 0 0) left bottom,
    /* 右下 */
    linear-gradient(#000 0 0) right bottom,
    linear-gradient(#000 0 0) right bottom;
  background-size:
    1rem 1.5px, 1.5px 1rem;
  background-repeat: no-repeat;
}


.outline_ttl h2 div {
  font-size: 4.2rem;
  font-weight: 600;
  margin-bottom: 2rem;
  line-height: 1.3;
}

.outline_ttl h2 div:not(:last-of-type) {
  margin-bottom: 2rem;
}

.outline_ttl h2 div span {
  font-size: 5rem;
}

.outline_ttl h2 div span strong {
  font-size: 5.92rem;
  display: inline-block;
  font-weight: 600;
  background: var(--color-yellow);
  padding-bottom: 5px;
  line-height: 1;
}




.outline_list {
  display: grid;
  gap: 2.6rem;
  grid-template-columns: repeat(2, 1fr);
  position: relative;
  border-top: 1px solid var(--color-yellow);

  align-items: stretch;
}


.outline_box h3 {
  width: 100%;
  text-align: center;
  background: #F6C93A;
  text-transform: uppercase;
  font-size: 1.7rem;
  font-weight: 700;
  font-family: var(--roboto);
  line-height: 1;
  padding: 2rem 0;
}

.outline_box-inner {
  padding: 9.6rem 6rem;
}

.outline_box.left {
  border-right: 1px solid var(--color-yellow);
  position: relative;
}

.outline_box.left::before {
  position: absolute;
  content: "";

  width: 2.6rem;
  height: 100%;
  right: -2.6rem;
  top: 0;

  background-size: cover;
  background-repeat: no-repeat;
  vertical-align: middle;
  display: inline-block;
  background-image: url(../images/outline_line.webp);
}


.outline_box.left p {
  line-height: 2.2;
  font-size: 2rem;
  letter-spacing: 0.03em;
  font-weight: 700;
}

.outline_box.left p:not(:first-of-type) {
  margin-top: 6.4rem;
}


.outline_box.right {
  border-left: 1px solid var(--color-yellow);
}

.outline_box.right ul li {
  margin-bottom: 4.6rem;
  display: flex;
  align-items: start;
  justify-content: start;
  gap: 2.4rem;
}

.outline_meta {
  display: flex;
  align-items: center;
  justify-content: start;
  flex-wrap: wrap;
}

.outline_meta div {
  font-size: 5.2rem;
  font-weight: 500;
  margin-right: 1.2rem;
}

.outline_meta div span {
  font-family: var(--roboto);
  letter-spacing: -0.01em;
}

.outline_meta>span {
  font-size: 2.2rem;
  font-weight: 500;
  margin-top: 1.8rem;
}

.outline_meta>span:has(small) {
  margin-top: 0;
}

.outline_meta span small {
  font-size: 1.5rem;
  line-height: 1.4;
  display: inline-block;
}


.outline_box.right ul li i {
  margin-top: 1.2rem;
}

.outline_box.right ul li .icon_calendar {
  background-image: url(../images/icon_calendar.svg);
  min-width: 3.2rem;
  height: 3.7rem;
}

.outline_box.right ul li .icon_clock {
  background-image: url(../images/icon_clock.svg);
  min-width: 3.2rem;
  height: 3.7rem;
}

.icon_pin {
  background-image: url(../images/icon_pin.svg);
}

.outline_box.right ul li .icon_pin {
  min-width: 3.2rem;
  height: 3.8rem;
}


.outline_meta .btn {
  margin: 6px 0 0 2.4rem;
}

.outline_meta .btn a {
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.2rem;
  font-family: var(--roboto);
  font-weight: 500;
  gap: 2px;
  padding: 8px 10px;
  background: var(--color-black);
  border-radius: 100px;
  color: var(--color-yellow);
}

.outline_box.right ul li .outline_meta .btn a i {
  width: 1.5rem;
  height: 1.5rem;
  background-image: url(../images/arrow_y.svg);
  margin: 0;
}

.outline_meta p {
  width: 100%;
  margin-top: 1rem;
  font-size: 1.2rem;
  line-height: 1.3;
}


.outline_box.right dl {
  display: flex;
  align-items: stretch;
  justify-content: start;
  flex-wrap: wrap;
}

.outline_box.right dl dt {
  width: 12.4rem;
  font-size: 1.5rem;
  padding: 3.6rem 0;
  line-height: 1.7;
}

.outline_box.right dl dd {
  width: calc(100% - 12.4rem);
  font-size: 1.6rem;
  font-weight: 700;
  padding: 3.6rem 0;
  line-height: 1.7;
}

.outline_box.right dl dt:not(:last-of-type),
.outline_box.right dl dd:not(:last-of-type) {
  border-bottom: 1px solid var(--color-yellow);
}

.outline_box.right dl dd a {
  text-decoration: underline;
}

@media screen and (max-width:767px) {
  .outline_ttl {
    margin: 133px auto 110px;
    padding: 9px;
  }

  .outline_ttl h2 div {
    font-size: 23.66px;
  }

  .outline_ttl h2 div:not(:last-of-type) {
    margin-bottom: 16px;
  }

  .outline_ttl h2 div span {
    font-size: 28.39px;
  }

  .outline_ttl h2 div span strong {
    font-size: 33.13px;
  }

  .outline_list {
    gap: 1.5rem;
    grid-template-columns: repeat(1, 1fr);
    border-top: none;
    border-bottom: none;
  }

  .outline_box.left::before {
    width: 100vw;
    top: auto;
    bottom: -1.5rem;
    height: 1.5rem;
    left: 0;
    background-image: url(../images/outline_line_sp.webp);
  }

  .outline_box-inner {
    padding: 6.4rem 2rem;
  }

  .outline_box.left p {
    font-size: 1.6rem;
  }

  .outline_box.left {
    border-right: none;
  }

  .outline_box.right {
    border-left: none;
  }


  .outline_box.right dl {
    display: flex;
    align-items: stretch;
    justify-content: start;
    flex-wrap: wrap;
  }

  .outline_box.right dl dt {
    width: 100%;
    padding-top: 3.2rem;
    padding-bottom: 1.4rem;
    font-size: 1.3rem;
  }

  .outline_box.right dl dd {
    width: 100%;
    font-size: 1.4rem;
    padding-top: 0;
  }

  .outline_box.right dl dt:not(:last-of-type) {
    border-bottom: none;
  }

  .outline_meta div {
    font-size: 3.8rem;
    margin-right: 9px;
  }

  .outline_box.right ul {
    margin-bottom: 4.8rem;
  }

  .outline_box.right ul li {
    gap: 1.2rem;
    margin-bottom: 3rem;
  }

  .outline_meta>span {
    font-size: 1.7rem;
    margin-top: 1rem;
  }

  .outline_meta span small {
    font-size: 1.2rem;
    margin-top: 0.4rem;
  }

  .outline_box.right ul li .icon_calendar,
  .outline_box.right ul li .icon_clock,
  .outline_box.right ul li .icon_pin {
    min-width: 2.4rem;
    height: 2.8rem;
  }

  .outline_box.right ul li:nth-child(3) .outline_meta .btn {
    order: 4;
    margin-left: 0;
    margin-top: 1.2rem;
  }

  .outline_box.right ul li:nth-child(3) .outline_meta p {
    order: 3;
    letter-spacing: 0em;
  }

  .outline_meta p {
    font-size: 10px;
  }

  .outline_meta .btn a {
    font-size: 10px;
  }

  .outline_box.right ul li .outline_meta .btn a i {
    width: 10px;
    height: 10px;
  }
}

/*================================================
* cta
================================================*/
#cta {
  position: relative;
  padding: 12rem 0;
  z-index: 1;
}

#cta::before {
  position: absolute;
  content: "";
  width: 100%;
  height: 100%;
  background: rgb(255 255 255 / 25%);
  top: 0;
  left: 0;
  backdrop-filter: blur(20px);
  z-index: -1;
}


.cta_btn {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  width: 83.333%;
  margin: 0 auto;
  background: var(--color-yellow);
  padding: 4.1rem 0;
  position: relative;
}

.cta_btn ::before {
  position: absolute;
  content: "";
  background-size: contain;
  background-repeat: no-repeat;
  vertical-align: middle;
  display: inline-block;
  background-image: url(../images/nav_arrow.svg);
  width: 3.6rem;
  height: 3.6rem;
  top: 50%;
  right: 5.6rem;
  transform: translateY(-50%);
}

.cta_btn span {
  display: block;
  text-align: center;
  width: 100%;
}

.cta_btn .en {
  font-size: 4rem;
  font-weight: 500;
  font-family: var(--roboto);
}

.cta_btn .ja {
  font-size: 1.5rem;
  font-weight: 500;
  margin-top: 0.5rem;
}

@media screen and (max-width:767px) {
  #cta {
    padding: 8rem 0;
  }

  .cta_btn {
    width: 89.333%;
    padding: 3rem 0;
  }

  .cta_btn .en {
    font-size: 3.2rem;
  }

  .cta_btn .ja {
    font-size: 1.3rem;
  }

  .cta_btn ::before {
    position: absolute;
    content: "";
    background-size: contain;
    background-repeat: no-repeat;
    vertical-align: middle;
    display: inline-block;
    background-image: url(../images/nav_arrow.svg);
    width: 2.4rem;
    height: 2.4rem;
    top: 5px;
    right: 5px;
    transform: translateY(0);
  }
}

/*================================================
* projects
================================================*/
.projects_list {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
}

.projects_list li {
  background: var(--color-white);
  padding: 3.8rem 3.6rem 4.2rem;
  position: relative;
  z-index: 1;

  background-image: repeating-linear-gradient(90deg, #EAB712, #EAB712 2px, transparent 2px, transparent 5px);
  background-position: left bottom;
  background-repeat: repeat-x;
  background-size: 100% 1px;
}

.projects_list li:not(:nth-child(3n)) {
  background-image: repeating-linear-gradient(180deg, #EAB712, #EAB712 2px, transparent 2px, transparent 5px), repeating-linear-gradient(90deg, #EAB712, #EAB712 2px, transparent 2px, transparent 5px);
  background-position: right top, left bottom;
  background-repeat: repeat-y, repeat-x;
  background-size: 1px 100%, 100% 1px;
}

.projects_list li::before {
  position: absolute;
  content: "";
  width: 100%;
  height: 100%;
  background:

    linear-gradient(#EAB712 0 0) left top,
    linear-gradient(#EAB712 0 0) left top,

    linear-gradient(#EAB712 0 0) right top,
    linear-gradient(#EAB712 0 0) right top,

    linear-gradient(#EAB712 0 0) left bottom,
    linear-gradient(#EAB712 0 0) left bottom,

    linear-gradient(#EAB712 0 0) right bottom,
    linear-gradient(#EAB712 0 0) right bottom;

  background-size:
    1.2rem 1px, 1px 1.2rem;
  background-repeat: no-repeat;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: -1;
}

.projects_list li:not(:nth-child(3n-2))::before {
  background:

    linear-gradient(#EAB712 0 0) left top,


    linear-gradient(#EAB712 0 0) right top,
    linear-gradient(#EAB712 0 0) right top,


    linear-gradient(#EAB712 0 0) left bottom,

    linear-gradient(#EAB712 0 0) right bottom,
    linear-gradient(#EAB712 0 0) right bottom;

  background-size:
    1.2rem 1px,
    /* 横 */
    1.2rem 1px,
    1px 1.2rem,
    /* 縦 */
    1.2rem 1px,
    1.2rem 1px,
    1px 1.2rem;

  background-repeat: no-repeat;
}

.projects_list li .p_num {
  display: flex;
  align-items: start;
  justify-content: space-between;
}

.projects_list li .p_num span {
  color: var(--color-t-yellow);
  font-family: var(--roboto);
  font-size: 2.4rem;
  font-weight: 700;
  line-height: 1.5;
}

.projects_list li .p_num .p_img {
  height: 11rem;
}

.projects_list li:nth-child(2n) .p_num .p_img {
  height: 12.4rem;
}

.projects_list li .p_num .p_img img {
  width: auto;
  max-width: unset;
  height: 100%;
}

.projects_list li h3 {
  font-size: 2rem;
  font-weight: 700;
  line-height: 1.5;
  margin-top: 3.2rem;
  margin-bottom: 2rem;
}

.projects_list li p {
  font-size: 1.4rem;
  line-height: 1.7;
}

#slideArea {
  background: var(--color-bg);

}

.loop_swiper-slideArea .swiper-wrapper {
  transition-timing-function: linear;
}

.loop_swiper-slideArea .swiper-slide {
  width: 324rem;
  margin-left: 1rem;
}


@media screen and (max-width:767px) {
  .projects_list {
    grid-template-columns: repeat(1, 1fr);
  }

  .projects_list li {
    padding: 2.4rem 2rem 2.8rem;
  }

  .projects_list li .p_num span {
    font-size: 2rem;
  }

  .projects_list li .p_num .p_img {
    height: 7rem;
  }

  .projects_list li:nth-child(2n) .p_num .p_img {
    height: 7.9rem;
  }

  .projects_list li h3 {
    font-size: 1.8rem;
    margin-top: 1.5rem;
    margin-bottom: 1.5rem;
  }

  .projects_list li p {
    font-size: 1.3rem;
  }


  .projects_list li::before,
  .projects_list li:not(:nth-child(3n-2))::before {
    background:

      linear-gradient(#EAB712 0 0) left top,


      linear-gradient(#EAB712 0 0) right top,


      linear-gradient(#EAB712 0 0) left bottom,
      linear-gradient(#EAB712 0 0) left bottom,


      linear-gradient(#EAB712 0 0) right bottom,
      linear-gradient(#EAB712 0 0) right bottom;

    background-size:
      1px 1.2rem,
      /* 左上：縦 */
      1px 1.2rem,
      /* 右上：縦 */

      1.2rem 1px,
      /* 左下：横 */
      1px 1.2rem,
      /* 左下：縦 */

      1.2rem 1px,
      /* 右下：横 */
      1px 1.2rem;
    /* 右下：縦 */
    background-repeat: no-repeat;
  }

  .projects_list li:first-child::before {
    background:
      linear-gradient(#EAB712 0 0) left top,
      linear-gradient(#EAB712 0 0) left top,

      linear-gradient(#EAB712 0 0) right top,
      linear-gradient(#EAB712 0 0) right top,

      linear-gradient(#EAB712 0 0) left bottom,
      linear-gradient(#EAB712 0 0) left bottom,


      linear-gradient(#EAB712 0 0) right bottom,
      linear-gradient(#EAB712 0 0) right bottom;

    background-size:
      1.2rem 1px,
      1px 1.2rem,
      1.2rem 1px,
      1px 1.2rem,
      1.2rem 1px,
      1px 1.2rem,
      1.2rem 1px,
      1px 1.2rem;
    background-repeat: no-repeat;
  }




  .projects_list li,
  .projects_list li:not(:nth-child(3n)) {
    background-image: repeating-linear-gradient(90deg, #EAB712, #EAB712 2px, transparent 2px, transparent 5px);
    background-position: left bottom;
    background-repeat: repeat-x;
    background-size: 100% 1px;
  }

  .loop_swiper-slideArea .swiper-slide {
    width: 1800px;
    margin-left: 6px;
  }
}

/*================================================
* schedule
================================================*/

.schedule_wrap {
  width: 95.65%;
  margin-left: auto;
}

.schedule_clm {
  display: flex;
  align-items: stretch;
  justify-content: start;
}


.schedule_ttl {
  width: 185px;
  position: relative;
  z-index: 1;
  background: var(--color-white);
}

.schedule_ttl img {
  position: relative;
  z-index: 2;
}

.schedule_slide {
  width: calc(100% - 185px);
  position: relative;
}



.schedule_swiper .swiper-slide {
  overflow: hidden;
}

.schedule_swiper .img-wrap {
  width: 400%;
  background: var(--color-white);
  position: relative;
}

.schedule_ttl::before,
.schedule_swiper .img-wrap::before {
  position: absolute;
  content: "";
  width: 100%;
  height: 68px;
  background: var(--color-yellow);
  top: 0;
  left: 0;
}

.schedule_ttl::after,
.schedule_swiper .img-wrap::after {
  position: absolute;
  content: "";
  width: 100%;
  height: 1px;
  top: 278px;
  left: 0;
  background-image: repeating-linear-gradient(90deg, #eab712, #eab712 2px, transparent 2px, transparent 5px);
  background-position: left bottom;
  background-repeat: repeat-x;
  background-size: 100% 1px;
}

.schedule_swiper img {
  display: block;
  width: 100%;
  height: auto;
  position: relative;
  z-index: 2;
}


.schedule_clm-outer {
  position: relative;
}

.schedule_clm-outer .swiper-button-prev,
.schedule_clm-outer .swiper-button-next {
  top: auto;
  left: auto;
  bottom: -7.6rem;
  right: 6rem;
  width: 7.2rem;
  height: 4.4rem;
}

.schedule_clm-outer .swiper-button-prev {
  right: 14.6rem;
}

.schedule_clm-outer .swiper-button-prev::before,
.schedule_clm-outer .swiper-button-next::before {
  position: absolute;
  content: "";
  width: 100%;
  height: 100%;

  top: 0;
  left: 0;


  background-size: contain;
  background-repeat: no-repeat;
  vertical-align: middle;
  display: inline-block;
  background-image: url(../images/schedule_arrow.svg);
}

.schedule_clm-outer .swiper-button-prev::before {
  transform: rotate(180deg);
}

.schedule_clm-outer .swiper-button-prev::after,
.schedule_clm-outer .swiper-button-next::after {
  content: none;
}

.schedule_wrap .note {
  font-size: 1.4rem;
  line-height: 1.5;
  margin-top: 4rem;
  color: #666666;
}

/* schedule_under */
.schedule_under {
  margin-top: 10rem;
}

.schedule_under-clm {
  display: flex;
  align-items: stretch;
  gap: 1.6rem;
}

.schedule_under-ttl {
  width: 7.2rem;
  padding: 3rem 0;
  text-align: center;
  border: 1px solid var(--color-yellow);
  position: relative;

  display: flex;
  flex-wrap: wrap;
  flex-direction: column;
  justify-content: space-between;
}

.schedule_under-ttl::before {
  position: absolute;
  content: "";
  background-size: contain;
  background-repeat: no-repeat;
  vertical-align: middle;
  display: inline-block;
  background-image: url(../images/schedule_under-arrow.svg);
  width: 0.8rem;
  height: 9rem;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.schedule_under-ttl span {
  display: block;
  color: var(--color-t-yellow);
  font-weight: 700;
}



.schedule_under-list {
  width: calc(100% - 8.8rem);
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  background: var(--color-white);
}


.schedule_box-ttl {
  font-size: 1.6rem;
  font-weight: 700;
  text-align: center;
  padding: 2.2rem 0;
  background: var(--color-yellow);
}

.schedule_box:first-of-type .schedule_box-ttl {
  border-right: 1px solid #F3F3F3;
}

.schedule_box-txt {
  text-align: center;
  padding: 3.3rem 0;
  line-height: 1.7;
  font-size: 1.6rem;
}

.schedule_box:first-of-type .schedule_box-txt {
  border-right: 1px solid #F6C93A;
}

.schedule_box:nth-of-type(2) .schedule_box-txt {
  padding: 6rem 0 0;
}

.schedule_box-txt strong {
  font-size: 1.7rem;
}

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


  .schedule_ttl::before,
  .schedule_swiper .img-wrap::before {
    height: 4.6rem;
  }

  .schedule_ttl::after,
  .schedule_swiper .img-wrap::after {
    top: 206px;
  }



  .schedule_ttl {
    width: 90px;
    height: 366px;
  }

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

  .schedule_slide {
    width: calc(100% - 90px);
  }

  .schedule_wrap .note {
    font-size: 1.2rem;
    margin-top: 8.6rem;
    width: 94.36%;
  }

  .schedule_swiper .img-wrap {
    width: 3000px;
  }

  .schedule_swiper .img-wrap img {
    display: block;
    width: 100%;
    height: auto;
  }



  .schedule_clm-outer .swiper-button-prev,
  .schedule_clm-outer .swiper-button-next {
    left: 28%;
    bottom: -60px;
    right: auto;
    width: 60px;
    height: 36px;
  }

  .schedule_clm-outer .swiper-button-next {
    left: 49.29%;
  }



  .schedule_under-clm {
    flex-wrap: wrap;
    gap: 1rem;
  }

  .schedule_under-ttl {
    width: 100%;
    padding: 1.4rem 2rem;
    flex-wrap: nowrap;
    flex-direction: unset;
  }

  .schedule_under-ttl:first-of-type::before {

    background-image: url(../images/schedule_under-arrow_sp.svg);
    width: 55vw;
    height: 2.1875vw;

    max-width: 212px;
    max-height: 8px;

  }

  .schedule_under-ttl span {
    font-size: 1.4rem;
  }




  .schedule_under-list {
    width: 100%;
    grid-template-columns: repeat(1, 1fr);
  }


  .schedule_box-ttl {
    font-size: 1.4rem;
    padding: 1.8rem 0;
  }

  .schedule_box:first-of-type .schedule_box-ttl {
    border-right: none;
  }

  .schedule_box-txt {
    padding: 2.4rem 0;
    line-height: 1.7;
    font-size: 1.2rem;
  }

  .schedule_box:first-of-type .schedule_box-txt {
    border-right: none;
  }

  .schedule_box:nth-of-type(2) .schedule_box-txt {
    padding: 2.4rem 0;
  }

  .schedule_box-txt strong {
    font-size: 1.6rem;
  }

  .schedule_under {
    margin-top: 6.4rem;
  }
}








/*================================================
* access
================================================*/
.acc_clm {
  display: flex;
  align-items: end;
  justify-content: start;
  gap: 8.3rem;
  padding-bottom: 14rem;
}

.acc_map {
  width: 64rem;
}

.acc_map iframe {
  display: block;
  aspect-ratio: 641/428;
  width: 100%;
}

.acc_lead {
  font-size: 1.8rem;
  margin-bottom: 3.2rem;
}

.acc_ttl {
  display: flex;
  align-items: center;
  justify-content: start;
  gap: 1.6rem;
  font-size: 5.2rem;
  font-weight: 500;
}

.acc_ttl i {
  width: 3.2rem;
  height: 3.7rem;

}

.acc_address {
  font-size: 1.6rem;
  margin: 3.2rem 0;
}


.acc_tel p {
  line-height: 1.7;
  font-size: 2rem;
  font-weight: 500;
  display: flex;
  align-items: center;
  justify-content: start;

}

.acc_tel span {
  color: var(--color-t-yellow);
  margin-right: 9px;
  font-weight: 500;
  min-width: 4rem;
}

.acc_clm .c_btnArea {
  margin-top: 8rem;
}



@media screen and (max-width:767px) {
  .acc_clm {
    flex-wrap: wrap;
    gap: 3.2rem;
    padding-bottom: 10rem;
  }

  .acc_map {
    width: 100%;
  }

  .acc_map iframe {
    aspect-ratio: 335 / 224;
  }

  .acc_lead {
    font-size: 1.6rem;
    margin-bottom: 2.4rem;
  }

  .acc_address {
    font-size: 1.4rem;
    margin: 2.4rem 0;
  }

  .acc_clm .c_btnArea {
    margin-top: 2.8rem;
  }
}

/*================================================
*tab
================================================*/
.acc_tab h3 {
  color: var(--color-t-yellow);
  font-size: 4rem;
  font-weight: 700;
  margin-bottom: 5rem;
}

.tab-list {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  margin-bottom: 1.6rem;
}

.tab-list .tab-btn {
  padding: 2.3rem 0;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 1rem;
  border: 1px solid var(--color-yellow);
  cursor: pointer;
  font-size: 2rem;
  font-weight: 700;
}

.tab-list .tab-btn span {
  width: 2.2rem;
}

.tab-list .tab-btn:not(:first-of-type) {
  border-left: none;
}

.tab-list .tab-btn.is-active {
  background: var(--color-yellow);
}

.tab-panel {
  position: relative;
  transition: height .4s;
  overflow: clip;
}

.tab-cnt {
  opacity: 0;
  pointer-events: none;
  transition: .4s;
}

.tab-cnt.is-active {
  opacity: 1;
  pointer-events: all;
}

.tab-ex {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
}

.tab_inner {
  background: var(--color-white);
  padding: 10rem;
  line-height: 1.7;
}

.tab_inner p {
  font-size: 1.8rem;
}

.tab_inner .lead {
  font-weight: 700;
  font-size: 2.4rem;
  line-height: 1.5;
}

.tab_inner .lead span {
  color: var(--color-t-yellow);
}

.tab_inner .train_img {
  margin-top: 8rem;
}

.tab_inner .note {
  color: #E20000;
  font-size: 1.6rem;
  font-weight: 400;
  margin-top: 3.2rem;
}

.tab_inner p a {
  text-decoration: underline;
  font-weight: 700;
}

.tab_inner .c_btn {
  background: #F3F3F3;
  width: fit-content;
  color: var(--color-black);
  padding-left: 2.5rem;
  padding-right: 2.5rem;
  font-weight: 500;
}

.tab_inner .c_btn i {
  background-image: url(../images/nav_arrow.svg);
}


.tab_inner h4 {
  background: #F3F3F3;
  padding: 2rem 2rem 2rem 4rem;
  font-size: 2.2rem;
  font-weight: 700;
  position: relative;
  margin-bottom: 2.8rem;
}

.tab_inner h4:not(:first-of-type) {
  margin-top: 6.4rem;
}

.tab_inner h4::before {
  position: absolute;
  content: "";
  width: 0.8rem;
  height: 0.8rem;
  background: var(--color-yellow);
  top: 50%;
  transform: translateY(-50%);
  left: 2rem;
}

.tab_inner .dot_list li {
  position: relative;
  padding-left: 1.8rem;
  font-size: 1.8rem;
  margin-top: 3.2rem;
}



.tab_inner .dot_list li::before {
  position: absolute;
  content: "・";
  left: 0;
  top: 0;
}



/* bus */
.bus_list {
  margin-top: 4.8rem;
  border-top: 1px solid var(--color-yellow);
}

.bus_list li {
  display: flex;
  align-items: center;
  justify-content: start;
  padding: 3.2rem 0;
  gap: 3.2rem;
  font-size: 1.8rem;
  border-bottom: 1px solid var(--color-yellow);
}

.bus_list li span {
  display: flex;
  align-items: center;
  justify-content: center;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  padding: 0.5rem 1.6rem;
  background: var(--color-yellow);
  border-radius: 1000px;
  font-weight: 700;
}

.under_txt {
  margin-top: 8rem;
}

.under_txt p {
  margin-top: 4rem;
  margin-bottom: 1.6rem;
}

.under_txt .clm {
  display: flex;
  align-items: center;
  gap: 1.6rem;
  justify-content: start;
}

.plane_clm {
  display: grid;
  gap: 4rem;
  grid-template-columns: repeat(2, 1fr);
  margin-top: 3.2rem;
  margin-bottom: 6.4rem;
}

.plane_clm:last-of-type {
  margin-bottom: 0;
}

.plane_list li {
  font-size: 1.8rem;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 0.8rem 2.4rem 2.6rem;
  margin-top: 2.4rem;
  border-bottom: 1px solid var(--color-yellow);
}

.plane_list li::before {
  position: absolute;
  content: "・";
  left: 0.8rem;
  top: 0;
}

.plane_list li span {
  display: block;
}

.plane_list li span:first-of-type {
  font-weight: 700;
}

.p.plane_listli span:nth-of-type(2),
.plane_list li span:nth-of-type(3) {
  text-align: right;
}

.plane_list.plane li span:nth-of-type(2) {
  min-width: 8rem;
  width: 8rem;
  text-align: right;
}

@media screen and (max-width:767px) {
  .acc_tab h3 {
    font-size: 3.2rem;
    margin-bottom: 3.6rem;
  }

  .tab-list {
    grid-template-columns: repeat(2, 1fr);
    margin-bottom: 1.2rem;
  }

  .tab-list .tab-btn {
    padding: 1.5rem 0;
    gap: 6px;
    font-size: 1.6rem;
  }

  .tab-list .tab-btn span {
    width: 1.8rem;
  }

  .tab-list .tab-btn:not(:first-of-type) {
    border-left: 1px solid var(--color-yellow);
  }

  .tab-list .tab-btn:not(:first-of-type, :nth-of-type(3)) {
    border-left: none;
  }

  .tab-list .tab-btn:not(:first-of-type, :nth-of-type(2)) {
    border-top: none;
  }

  .tab_inner {
    padding: 4rem 2rem;
  }

  .tab_inner p {
    font-size: 1.6rem;
  }

  .tab_inner .lead {
    font-size: 2rem;
  }

  .tab_inner .train_img {
    margin-top: 3rem;
  }

  .tab_inner .note {
    font-size: 1.4rem;
    margin-top: 1.6rem;
  }


  .tab_inner .c_btn {
    width: 100%;
  }

  .tab_inner h4 {
    padding: 1.2rem 0.5rem 1.2rem 3.5rem;
    font-size: 1.8rem;
    margin-bottom: 2.4rem;
  }

  .tab_inner h4:not(:first-of-type) {
    margin-top: 5rem;
  }

  .tab_inner h4::before {
    left: 1.5rem;
  }

  .tab_inner .dot_list li {
    padding-left: 1.4rem;
    font-size: 1.4rem;
    margin-top: 2.4rem;
  }

  .tab_inner .dot_list li p {
    font-size: 1.4rem;
  }

  .tab_inner .dot_list li strong {
    font-size: 1.6rem;
  }

  /* bus */
  .bus_list {
    margin-top: 2.8rem;
  }

  .bus_list li {
    flex-wrap: wrap;
    align-items: start;
    flex-direction: column;
    padding: 1.6rem 0;
    gap: 1.5rem;
    font-size: 1.4rem;
    border-bottom: 1px solid var(--color-yellow);
  }

  .bus_list li span {
    padding: 0.5rem 1.2rem;
    font-size: 1.6rem;
  }

  .under_txt {
    margin-top: 5rem;
  }

  .under_txt p {
    margin-top: 1.2rem;
    font-size: 1.4rem;
  }

  .under_txt .clm {
    flex-wrap: wrap;
    gap: 1.2rem;
  }

  .plane_clm {
    gap: 0;
    grid-template-columns: repeat(1, 1fr);
    margin-top: 2.4rem;
    margin-bottom: 5rem;
  }

  .plane_list li {
    font-size: 1.4rem;
    padding: 0 0 1.2rem 1.4rem;
    margin-top: 1.2rem;
  }

  .plane_list li::before {
    left: 0;
  }


  .plane_list.plane li span:nth-of-type(2) {
    min-width: 7rem;
    width: 7rem;
  }
}


/*================================================
 *  footer
 ================================================*/
footer {
  position: relative;
  padding: 25rem 0 0 0;
}

footer::before {
  position: absolute;
  content: "";
  width: 100%;
  height: 100%;
  background: rgb(18 18 18 / 90%);
  top: 0;
  left: 0;

  backdrop-filter: blur(20px);
  z-index: -1;
}

.ft_inner {
  width: 83.33%;
  margin: 0 auto;

  position: relative;
  z-index: 1;
}

.ft_clm {
  display: flex;
  align-items: center;
  justify-content: start;
  gap: 8rem;
}

.ft_catch {
  width: 49%;
}

.ft_list {
  color: var(--color-white);
}

.ft_list li {
  margin-bottom: 4.6rem;
  display: flex;
  align-items: start;
  justify-content: start;
  gap: 2.4rem;
}

.ft_list li:last-child {
  margin-bottom: 0;
}

.ft_list li i {
  margin-top: 1.2rem;
}

.ft_list li .icon_calendar {
  background-image: url(../images/icon_calendar_w.svg);
  min-width: 3.2rem;
  height: 3.7rem;
}

.ft_list li .icon_clock {
  background-image: url(../images/icon_clock_w.svg);
  min-width: 3.2rem;
  height: 3.7rem;
}

.ft_list .icon_pin {
  background-image: url(../images/icon_pin_w.svg);
  min-width: 3.2rem;
  height: 3.8rem;
}


.ft_copy {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 3.2rem 6rem;
  border-top: 1px solid #666666;
  font-size: 1.3rem;
  color: #898989;
  margin-top: 16rem;
}

.ft_copy .pageTop {
  display: flex;
  align-items: center;
  justify-content: end;
  gap: 1.2rem;
}

.ft_copy .pageTop img {
  width: 0.9rem;
}

@media screen and (max-width:767px) {
  footer {
    padding: 10rem 0 14rem;
  }

  .ft_inner {
    width: 94.66%;
  }

  .ft_clm {
    flex-wrap: wrap;
    gap: 5rem;
  }


  .ft_catch {
    width: 100%;
  }

  .ft_list {
    margin: 0 auto;
    width: 94%;
  }

  .ft_list li {
    margin-bottom: 2rem;
    gap: 1rem;
  }

  .ft_list .icon_pin,
  .ft_list li .icon_clock,
  .ft_list li .icon_calendar {
    min-width: 2.4rem;
    height: 2.8rem;
  }

  .ft_copy {
    padding: 0;
    justify-content: center;
    flex-wrap: wrap;
    border-top: none;
    margin-top: 10rem;
  }

  .ft_copy p {
    width: 100%;
    order: 2;
    border-top: 1px solid #666666;
    text-align: center;
    font-size: 10px;
    padding-top: 2.6rem;
    margin-top: 2.6rem;
  }

  .ft_copy .pageTop {
    order: 1;
  }
}