@charset "UTF-8";
/* CSS Document */


/* -----------------------------------------------------------------------
## Reset #################################################################
----------------------------------------------------------------------- */
html,body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,img,
pre,form,fieldset,input,textarea,p,blockquote,th,td {
  margin: 0px;
  padding: 0px;
}

body {
    -webkit-font-feature-settings: "palt";
    font-feature-settings: "palt";
    font-smoothing: antialiased;
    text-size-adjust: 100%;
    -webkit-font-smoothing: antialiased;
    -webkit-text-size-adjust: 100%;
    -moz-font-smoothing: antialiased;
    -moz-text-size-adjust: 100%;
    -ms-font-smoothing: antialiased;
    -ms-text-size-adjust: 100%;
    -o-font-smoothing: antialiased;
    -o-text-size-adjust: 100%;
    color: #222;
    font-style: normal;
    font-weight: 400;
    line-height: 1;
    font-family: "Noto Sans JP", sans-serif;
    letter-spacing: initial;
    overflow-wrap: break-word;
}


:root{
  --phone-width:480px;
}

@media (min-width:1280px){

:root{
    --phone-width:min(
        760px,
        calc(480px + (100vw - 1280px) * 0.5)
    );
}

}


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


fieldset,img {
  border: 0;
  vertical-align: bottom;
}

address,caption,cite,code,dfn,em,var {
  font-style: normal;
  font-weight: normal;
}
ul {
  list-style: none;
}
ol li {
	list-style-position: outside;
	list-style: decimal;
	margin-left: 25px;
	margin-bottom:5px;
}

caption,th {
  text-align: left;
  font-weight: normal;
}
h1,h2,h3,h4,h5,h6 {
  font-size: 100%;
  font-weight: normal;
}

h3 {
  width: 120%;
  letter-spacing: 0.1em;
}

a{
	color: #333333;
	text-decoration:none;
}
sup,sub {
    height: 0;
    line-height: 1;
    vertical-align: baseline;
    position: relative;
     
}
sup {
    bottom: 0.6ex;
}
sub {
    top: .5ex;
}
.alpha{
	display:block;
	text-decoration:none;
	opacity: 1;
	-webkit-transition: all 0.3s ease;
	-moz-transition: all 0.3s ease;
	-o-transition: all 0.3s ease;
	transition: all  0.3s ease;
}
.alpha:hover{
	opacity: 0.7;
}


.clearfix:after {
    content:" ";
    display:block;
    clear:both;
}

.ma_b5 {margin-bottom: 5px;}
.ma_b10 {margin-bottom: 10px;}
.ma_b15 {margin-bottom: 15px;}
.ma_b20 {margin-bottom: 20px;}
.ma_b21 {margin-bottom: 21px;}
.ma_b25 {margin-bottom: 25px;}
.ma_b30 {margin-bottom: 30px;}
table, tr, th, td {
    border-collapse: collapse;
	text-align:left;
	font-weight:normal;
	vertical-align:top;
}
.lett {letter-spacing: -0.1em;}

.pc {display:block!important;}
.sp {display:none!important;}

/*---- FOR SP ----*/
@media only screen and (max-width: 768px){
body {

}

.pc {display:none !important;}
.sp {display:block!important;}
.img100 {width:100%; height:auto;}
.img90 {width:90%; height:auto;}
.img80 {width:80%; height:auto;}
.img70 {width:70%; height:auto;}
}
.re { position:relative;}



a:hover {
	opacity: 0.6;
}


.right-step01 {
  width: 240px;
  height: 20%;
  background: #00aee1;           /* ここを #00aee1 や #fff に変更 */
  clip-path: polygon(
    0% 0%,           /* 左上 */
    90% 0%,         /* 右上 */
    90% 33%,        /* 1段目開始 */
    95% 33%,         /* 1段目折れ */
    95% 66%,
    100% 66%,         /* 2段目 */
    100% 100%,       /* 3段目 */
    0% 100%           /* 左下 */
  );
  color: #fff;                  /* #fff の背景を使う場合は color: #002c56; に変更 */
  padding: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-weight: bold;
  box-sizing: border-box;
  font-size: 1.02rem;
}


.both-step01 {
  width: 240px;
  height: 20%;
  background: #00aee1;
  clip-path: polygon(
    0% 10%,          /* 左側1段目 */
    12% 10%,
    12% 20%,
    24% 20%,
    24% 30%,
    36% 30%,         /* 左側3段目終わり */
    
    100% 30%,        /* 右下 */
    100% 20%,
    88% 20%,
    88% 10%,
    76% 10%,
    76% 0%,
    
    0% 0%            /* 左上に戻る */
  );
  color: #fff;                  /* #fff の背景を使う場合は color: #002c56; に変更 */
  padding: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-weight: bold;
  box-sizing: border-box;
  font-size: 1.02rem;
}


.right-step02 {
  width: 240px;
  height: 20%;
  background: #fff;           /* ここを #00aee1 や #fff に変更 */
  clip-path: polygon(
    0% 0%,           /* 左上 */
    90% 0%,         /* 右上 */
    90% 33%,        /* 1段目開始 */
    95% 33%,         /* 1段目折れ */
    95% 66%,
    100% 66%,         /* 2段目 */
    100% 100%,       /* 3段目 */
    0% 100%  
  );
  color: #00aee1;                  /* #fff の背景を使う場合は color: #002c56; に変更 */
  padding: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-weight: bold;
  box-sizing: border-box;
  font-size: 1.02rem;
}

.both-step02 {
  width: 240px;
  height: 20%;
  background: #fff;
  clip-path: polygon(
    0% 10%,          /* 左側1段目 */
    12% 10%,
    12% 20%,
    24% 20%,
    24% 30%,
    36% 30%,         /* 左側3段目終わり */
    
    100% 30%,        /* 右下 */
    100% 20%,
    88% 20%,
    88% 10%,
    76% 10%,
    76% 0%,
    
    0% 0%            /* 左上に戻る */
  );
  color: #00aee1;                  /* #fff の背景を使う場合は color: #002c56; に変更 */
  padding: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-weight: bold;
  box-sizing: border-box;
  font-size: 1.02rem;
}



.right-step03 {
  width: 240px;
  height: 20%;
  background: #002c56;           /* ここを #00aee1 や #fff に変更 */
  clip-path: polygon(
    0% 0%,           /* 左上 */
    90% 0%,         /* 右上 */
    90% 33%,        /* 1段目開始 */
    95% 33%,         /* 1段目折れ */
    95% 66%,
    100% 66%,         /* 2段目 */
    100% 100%,       /* 3段目 */
    0% 100%           /* 左下 */
  );
  color: #fff;                  /* #fff の背景を使う場合は color: #002c56; に変更 */
  padding: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-weight: bold;
  box-sizing: border-box;
  font-size: 1.02rem;
}

.both-step03 {
  width: 240px;
  height: 20%;
  background: #002c56;
  clip-path: polygon(
    0% 90%,          /* 左側1段目 */
    33% 90%,
    33% 95%,
    66% 95%,
    66% 100%,
    100% 100%,         /* 左側3段目終わり */
    
    100% 30%,        /* 右下 */
    100% 20%,
    88% 20%,
    88% 10%,
    76% 10%,
    76% 0%,
    
    0% 0%            /* 左上に戻る */
  );
  color: #fff;                  /* #fff の背景を使う場合は color: #002c56; に変更 */
  padding: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-weight: bold;
  box-sizing: border-box;
  font-size: 1.02rem;
}

.right-step04 {
  width: 240px;
  height: 20%;
  background: #fff;           /* ここを #00aee1 や #fff に変更 */
  clip-path: polygon(
    0% 0%,           /* 左上 */
    100% 0%,         /* 右上 */
    100% 10%,        /* 1段目開始 */
    88% 10%,         /* 1段目折れ */
    88% 20%,
    76% 20%,         /* 2段目 */
    76% 30%,
    64% 30%,         /* 3段目 */
    0% 30%           /* 左下 */
  );
  color: #002c56;                  /* #fff の背景を使う場合は color: #002c56; に変更 */
  padding: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-weight: bold;
  box-sizing: border-box;
  font-size: 1.02rem;
}

.both-step04 {
  width: 140px;
  height: 20%;
  background: #fff;
  clip-path: polygon(
   10% 0%,          /* 左側1段目 */
    10% 33%,
    5% 33%,
    5% 66%,
    0% 66%,
    0% 100%,         /* 左側3段目終わり */
    
    100% 100%,        /* 右下 */
    100% 66%,
    95% 66%,
    95% 33%,
    90% 33%,
    90% 0%,
    
    0% 0%            /* 左上に戻る */
  );
  color: #002c56;                  /* #fff の背景を使う場合は color: #002c56; に変更 */
  margin: auto;
  padding: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-weight: bold;
  box-sizing: border-box;
  font-size: 1.02rem;
}


@media only screen and (min-width: 1280px){
.right-step01,.both-step01,.both-step02,.right-step02,.right-step03,.both-step03,.right-step04,.both-step04 {
  font-size: 1.02vw;
  height: 1.8vw;
  width: 38%;
}
}


body{
  margin:0;
}

.pc-bg{
  position:fixed;
  inset:0;

  z-index:-1;

  background-image:url("../img/main_bg.png");
  background-repeat:no-repeat;
  background-position:center center;

  background-size:cover;
}

.pc-layout{
  width:100%;
  min-height:100vh;

  display:flex;
  justify-content:center;
  align-items:stretch;
}


/*左右カラム*/
.side{
  position:sticky;
  top:0;
  height:100vh;
  padding-top:8%;
  display:flex;
  justify-content:center;
  align-items:flex-start;
  
}

.side-inner{
  width:100%;
  max-width:400px;
}

@media (min-width:1280px) {
.side-inner{
  width:90%;
  max-width:100%;
}
}

.side-left{
  position:fixed;
  left:0;
  top:0;
  width:calc((100vw - var(--phone-width)) / 2);
  height:100vh;
}

@media (max-width:768px){
  .side-left{
  display: none;
}
}
.side-right{
  position:fixed;
  right:0;
  top:0;
  width:calc((100vw - var(--phone-width)) / 2);
  height:100vh;
}




/*左右ロゴ*/
.side-logo{
  width:100%;
  text-align:center;
  margin: auto;
  margin-bottom:50px;
}

.side-logo img{
  width:100%;
  max-width:280px;
  margin: auto;
  display:block;
}

.pc-menu{
  list-style:none;
  margin:30px 0 0;
  padding:30px 0 0;
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:20px;
}

.pc-menu a{
  display:flex;
  align-items:center;
  justify-content:center;

  padding: 8px;

  background:#fff;
  border-radius:8px;

  color:#003366;
  text-decoration:none;
  font-weight:700;

  transition:.3s;
}

.pc-menu a:hover{
  transform:translateY(-2px);
}




/******************************
wrapper
******************************/

.phone-frame{
  width:var(--phone-width);
    margin:0 auto;
}

.ly_wrapper{
    width:100%;
    min-height:380vh;
    box-shadow:0 0 30px rgba(0,0,0,.25);
    overflow:visible;
    position:relative;
}

@media (max-width:768px){

:root{
    --phone-width:100%;
}

.phone-frame{
    width:100%;
}

.ly_wrapper{
    width:100%;
}

header{
    width:100%;
}

}

@media (min-width:769px){

  .ly_wrapper{
    overflow:visible;
  }

}
@media (max-width:768px){

  .ly_wrapper{
    overflow-x:clip;
overflow-y:visible;
  }

}


/******************************
header
******************************/

header {
  position:fixed;
    top:0;
    left:50%;
    transform:translateX(-50%);
    width:var(--phone-width);
    margin:0 auto;
    z-index:9999;
}

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

/* ===========================
   スマホヘッダー
=========================== */

.sp-header{

    position:fixed;
    top:0;
    left:0;

    width:100%;
    height:70px;

    background:#002c56;

    z-index:9999;

    transition:transform .35s ease;

    transform:translateY(0);

}
@media (max-width:768px){

.sp-header{

    width:100%;

}

}

/* 隠す */

.sp-header.hide{

    transform:translateY(-100%);

}

/* 中身 */

.header_inner{
    position: relative;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: flex-end; /* ハンバーガーだけ右へ */
    padding: 0 20px;
}

.header__logo{
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    z-index: 1;
}

.header__logo img{
    display: block;
    height: 42px; /* お好みで調整 */
    width: auto;
}

.header__icons {
  display: flex;
  align-items: center;
  z-index: 10000; /* header__navより高い */
}





.header__hamburger{

    width:42px;
    height:42px;

    background:none;

    border:none;

    cursor:pointer;

    position: relative;

    z-index:10010;

}

.header__hamburger span{
    position:absolute;
    left:7px;
    width:32px;
    height:3px;
    background:#fff;
    transition:.35s;
}

.header__hamburger span:nth-child(1){

    top:11px;
    left: 16px;

}

.header__hamburger span:nth-child(2){

    top:19px;
    left: 12px;

}

.header__hamburger span:nth-child(3){

    top:27px;

}

.header__hamburger.active span:nth-child(1){
    top:19px;
    left: 8px;
    transform:rotate(45deg);

}

.header__hamburger.active span:nth-child(2){
    opacity:0;

}

.header__hamburger.active span:nth-child(3){

    top:19px;
    transform:rotate(-45deg);

}

.header__nav{
    position:absolute;
    top:70px;
    right:0;
    width:30%;
    height:calc(100vh - 70px);
    background:#002c56;
    transform:translateX(100%);
    transition:.35s;
    z-index:9998;
    overflow:auto;
}


.header__nav.active{

    transform:translateX(0);

}


.nav__items {
  margin: 20px 0 20px;
  padding: 0;
  width: 100%;
}

.nav-items__item {
  padding: 12px 10px 0;
}

.nav-items__item a {
  color: #fff;
  padding-right: 24px; /* 矢印分の余白 */
  display: block;
  text-align: left;
  font-size: 1.8rem;
  font-weight: 600;
  transform: scaleX(0.86);
  text-decoration: none;
}

.nav-items__item.txton a {
  color: #fff;
  display: block;
  text-align: left;
  font-size: 1.14rem;
  font-weight: 600;
  transform: scaleX(0.86);
  text-decoration: none;
}

.nav-items__item a::after{
    content: "";
    position: absolute;
    top: 50%;
    right: 0;
    width: 14px;   /* 画像サイズ */
    height: 14px;
    transform: translateY(-50%);
    background: url("../img/icon_arrow.png") no-repeat center center;
    background-size: contain;
    transition: transform .3s ease;
}

.nav-items__item a:hover::after{
    transform: translate(4px, -50%);
}

.header__nav .entry {
  width: 90%;
  padding-top: 10px;
  border-top: #00aee1 2px dotted;
}

.header__nav .entry h5 {
  width: 100%;
  font-size: 1.24rem;
  text-align: left;
}


@media (max-width:768px){
.header__nav{
    position:absolute;
    top:70px;
    right:0;
    width:56%;
    height:calc(80vh - 70px);
    background:#002c56;
    transform:translateX(100%);
    transition:.35s;
    z-index:9998;
    overflow:auto;
}
.nav-items__item {
  padding: 16px 10px 0;
}

.nav-items__item a::after{
    content: "";
    position: absolute;
    top: 50%;
    right: 0;
    width: 14px;   /* 画像サイズ */
    height: 14px;
    transform: translateY(-50%);
    background: url("../img/icon_arrow.png") no-repeat center center;
    background-size: contain;
    transition: transform .3s ease;
}

.nav-items__item.txton a {
  color: #fff;
  display: block;
  text-align: left;
  font-size: 1.00rem;
  font-weight: 600;
  letter-spacing: 0.1em;
  transform: scaleX(0.86);
  text-decoration: none;
}
}

@media (max-width:768px){
  .header__nav .entry h5 {
  width: 100%;
  margin: 10px 0 5px;
  font-size: 0.86rem;
  text-align: left;
}

.header__nav .entry ul {
  width: 90%;
}

.header__nav .entry ul li {
  margin: 12px 0;
}


.header__nav .btn_entry a{
    position:relative;
    display:flex;
    align-items:center;
    justify-content:center;
    width:100%;
    height:26px;
    padding: 2px;
    background:#fff;
    border-radius:999px;
    text-decoration:none;
    overflow:hidden;
    box-shadow:0 5px 5px rgba(0,128,172,.35);
    transition:.3s;
}

.header__nav .btn-arrow{
    position:absolute;
    right:10px;
    top:50%;
    width:14px;
    height:12px;
    transform:translateY(-50%);
}

.header__nav .btn-arrow img{
    position:absolute;
    inset:0;
    width:100%;
    transition:.25s;
}


}

.menu-visual{
    display:none;
}

@media (max-width:768px){

.menu-visual{
    position:absolute;
    top:70px;
    left:0;
    width:44%;
    height:calc(90vh - 70px);
    display:flex;
    align-items:flex-start;      /* 下に寄せる */
    justify-content:center;
    opacity:0;
    visibility:hidden;
    transition:.35s;
    z-index:9997;
    pointer-events:none;
    background-color: none;
    overflow:hidden;
}

.menu-visual.active{
    opacity:1;
    visibility:visible;

}

.menu-visual img{
    width:100%;
    height:auto;
    object-fit:cover;
}

}



.entry{
    margin:10px auto 60px;
    text-align:center;
}

.entry h5{
    margin:10px auto 24px;
    font-size:1.88rem;
    letter-spacing:.4em;
    font-weight:800;
    color:#fff;
    transform:scaleX(.8);
    display:inline-block;
}

.btn_entry{
    width:320px;
    margin:auto;
    padding:0;
    list-style:none;
}

@media (min-width:1280px) {
.btn_entry{
    width:70%;
    margin:auto;
    padding:0;
    list-style:none;
}
}


.btn_entry li{
    margin:18px 0;
}

/* ボタン */

.btn_entry a{

    position:relative;
    display:flex;
    align-items:center;
    justify-content:center;
    width:100%;
    height:49px;
    background:#fff;
    border-radius:999px;
    text-decoration:none;
    overflow:hidden;
    box-shadow:0 10px 10px rgba(0,128,172,.35);
    transition:.3s;
}
.btn_entry a:hover{
    transform:translateY(-3px);
    box-shadow:0 14px 20px rgba(0,128,172,.45);
}


@media (min-width:1280px){
  .btn_entry a{

    position:relative;
    display:flex;
    align-items:center;
    justify-content:center;
    width:100%;
    height:3.2vw;
    background:#fff;
    border-radius:999px;
    text-decoration:none;
    overflow:hidden;
    box-shadow:0 10px 10px rgba(0,128,172,.35);
    transition:.3s;
}
.btn_entry a:hover{
    transform:translateY(-3px);
    box-shadow:0 14px 20px rgba(0,128,172,.45);
}
  
}



/* ロゴ */

.btn-logo{
    display:flex;
    justify-content:center;
    align-items:center;
    width:100%;
    height:100%;
}

.btn-logo img{
    width:48%;
    max-width:100%;
    display:block;
}


/* 矢印 */

.btn-arrow{
    position:absolute;
    right:26px;
    top:50%;
    width:22px;
    height:20px;
    transform:translateY(-50%);
}

.btn-arrow img{
    position:absolute;
    inset:0;
    width:100%;
    transition:.25s;
}




/****************************************
MV
*****************************************/

#mv{

    position:relative;
    width:100%;
    overflow:visible;

}
@media (min-width:769px){

  #mv{
    overflow:visible;
  }

}
@media (max-width:768px){

  #mv{
    overflow:hidden;
  }

}

.mv_base{

    position:relative;
    width:100%;

}

.mv_inner{
    position:relative;
    width:100%;
    overflow:visible;
}

.human_wrap{
    position:absolute;
    inset:0;
    overflow:visible;    /* 人物だけはみ出せる */
    pointer-events:none;
}

.kv-tocho{

    position:relative;

    width:100%;

    padding-top:70px;

    opacity:0;

    animation:tochoFade 1.2s ease-out forwards;

}

.kv-tocho img{

    display:block;
    width:100%;
    height:auto;

}

.mv_overlay{

    position:absolute;

    inset:0;

    pointer-events:none;

}

@keyframes tochoFade{

  from{
    opacity:0;
    transform:
    translateY(40px);
  }

  to{
    opacity:1;
    transform:
    translateY(0);
  }
}


.title{
  position:absolute;
  left:50%;
  top:58%;
  width:96%;
  opacity:0;
  z-index:20;
  animation:
  titleImpact 1.3s cubic-bezier(.18,1.4,.3,1) .8s forwards;
}


@media (min-width:1280px) {
.title{
  position:absolute;
  left:50%;
  top:40%;
  width:96%;
  opacity:0;
  margin-top: 10vw;
  z-index:20;
  animation:
  titleImpact 1.3s cubic-bezier(.18,1.4,.3,1) .8s forwards;
}
}

@media (max-width:768px) {
  .title{
  position:absolute;
  left:50%;
  top:52%;
  width:96%;
  opacity:0;
  margin-top: 10vw;
  z-index:20;
  animation:
  titleImpact 1.3s cubic-bezier(.18,1.4,.3,1) .8s forwards;
}
}

.title img{
  width:100%;
  display:block;
}

@keyframes titleImpact{

  0%{
    opacity:0;

    transform:
    translateX(-50%)
    scale(.9);
  }

  30%{
    opacity:1;

    transform:
    translateX(-50%)
    scale(1.18);
  }

  100%{
    opacity:1;

    transform:
    translateX(-50%)
    scale(1);
  }
}


.human01,
.human02,
.human03{
  position:absolute;
  opacity:0;
  transform:
  translateY(60px)
  scale(.7);

}
.human01{
  z-index:10;
}

.human02,
.human03{
  z-index:30;
}

.title{
  z-index:40;
}

.human01 img,
.human02 img,
.human03 img{
  width:100%;
  display:block;
}

.human01{
  width:20%;
  left:43%;
  top:40%;
  animation:
humanPop 1.15s
cubic-bezier(.25,.8,.25,1)
1.9s forwards;
}

.human02{
  width:40%;
  left:-6%;
  top:16%;
  animation:
humanPop 1.15s
cubic-bezier(.25,.8,.25,1)
2.15s forwards;
}

.human03{
  width:26%;
  right:-3%;
  top:24%;
  animation:
humanPop 1.15s
cubic-bezier(.25,.8,.25,1)
2.4s forwards;
}

@media (min-width:1280px) {

  .human01{
  width:20%;
  left:56%;
  top:27%;
  margin-top: 7vw;
  margin-left:-12%;
  animation:
humanPop 1.15s
cubic-bezier(.25,.8,.25,1)
1.9s forwards;
}

.human02{
  width:40%;
  left:-5%;
  top:140px;
  animation:
humanPop 1.15s
cubic-bezier(.25,.8,.25,1)
2.15s forwards;
}

.human03{
  width:30%;
  right:-3%;
  top:190px;
  animation:
humanPop 1.15s
cubic-bezier(.25,.8,.25,1)
2.4s forwards;
}

}

@media (max-width:768px) {
  .human01{
  width:20%;
  left:43%;
  top:41%;
}

.human02{
  width:40%;
  left:-5%;
  top:18%;
}

.human03{
  width:30%;
  right:-3%;
  top:25%;
}
}

@keyframes humanPop{

  from{
    opacity:0;
    transform:
      translateY(40px)
      scale(.92);
  }

  to{
    opacity:1;
    transform:
      translateY(0)
      scale(1);
  }

}


/****************************************
entry
*****************************************/
/*
.entry {
  margin: 10px auto 60px;
  padding: 0;
  text-align: center;

}

.entry h5{
  margin: 10px auto 30px;
  padding-left: 10px;
  font-size: 1.88rem;
  letter-spacing: 0.4em;
  font-weight: 800;
  text-align: center;
  color: #fff;
  transform: scaleX(0.8); 
  display: inline-block; 
}

.entry-btn{
  display:block;
  margin-bottom:24px;
}

.entry-btn img{
  width:100%;
  display:block;
}


.entry ul {
 width: 320px;
 margin: auto;
   display: flex;
   flex-wrap: wrap;
  justify-content: center;
}

.entry ul li {
background-color: #fff;
width: 100%;
height: 50px;
border-radius: 32px;
 box-shadow: 0 10px 10px rgba(0, 128, 172, 0.6);
margin: 16px auto 8px;
padding: 0;
text-align: right;
}

.entry ul li img {
width: 60%;
}*/

/****************************************
TOKYO
****************************************/

#tokyo{
position:relative;
height:480dvh;

}

@media (max-width:768px){

#tokyo{
height:420dvh;

}

}

/****************************************
Sticky
****************************************/

.tokyo-sticky{

position:sticky;
top:0;

width:100%;
    height:100dvh;
    min-height:100dvh;
overflow:hidden;
z-index:20;
isolation:isolate;
}

/* 戻りスクロール時だけSticky解除 */
.tokyo-sticky.release{
    position:relative;
    top:auto;
}

/****************************************
背景
****************************************/

.sky-bg{

    position:absolute;

    top:0;
    right:0;
    bottom:0;
    left:0;

    background:
    url("../img/tokyo_bg.png")
    center bottom /
    cover
    no-repeat;

    transform-origin:center bottom;

    will-change:transform;

}



/****************************************
コンテンツ
****************************************/

.tokyo-content{

    position:absolute;
    left:50%;
    transform:translateX(-50%);

    width:min(92%,430px);
    height:100svh;

    display:grid;
    grid-template-rows:0.95fr auto;

    z-index:10;

}

/****************************************
中央コピー
****************************************/

.main-copy{

    display:flex;
    align-items:center;
    justify-content:center;

    width:100%;
    height:100%;

    opacity:0;
    transform:translate3d(0,40px,0);

    will-change:opacity,transform;
    pointer-events:none;

}

.main-copy img{

    display:block;

    width:3.0vh;
    height:auto;

    user-select:none;
    -webkit-user-drag:none;

}

/****************************************
下部情報
****************************************/

.bottom-info{

position:relative;

width:100%;

opacity:0;
transform:translate3d(0,35px,0);

will-change:
opacity,
transform;

pointer-events:auto;

}

.main-copy,
.bottom-info{

    transition:
        opacity .7s ease,
        transform .7s ease;

}

.main-copy.show,
.bottom-info.show{

    opacity:1;

    transform:
        translate3d(0,0,0)
        scale(1);

}

/****************************************
日付
****************************************/

#tokyo .date{
width:90%;
margin:0 auto;
padding:0 0 8%;
}


#tokyo .date img{

display:block;
width:100%;
height:auto;

}

/****************************************
PC
****************************************/

@media (min-width:769px){
.tokyo-content{
width:100%;
bottom:1vh;
}
}

@media (max-width:768px){

.main-copy img{
    width:6%;
}

}


/****************************************
エントリー
****************************************/

#tokyo .entry{
   width:100%;

margin:0 auto;
}

#tokyo .entry h5{
    margin:5px auto 4px;
    font-size:1.88rem;
    letter-spacing:.4em;
    font-weight:800;
    color:#fff;
    transform:scaleX(.8);
    display:inline-block;
}

#tokyo .btn_entry{
    width:70%;
    margin:auto;
    padding:0;
    list-style:none;
}

#tokyo .btn_entry li{
    margin:14px 0;
}

@media (max-width:768px){
#tokyo .btn_entry{
    width:320px;
    margin:auto;
    padding:0;
    list-style:none;
}

}


/****************************************
アクセシビリティ
****************************************/

@media (prefers-reduced-motion:reduce){

.sky-bg,
.main-copy,
.bottom-info{

transition:none!important;
animation:none!important;

}

}



/****************************************
outline
*****************************************/

#outline {
	background: url('../img/outline_bg.png');
  background-size:cover;
  background-position:center bottom;
  margin: 0 auto 0;
  padding-top: 30px;
  padding-bottom: 0;
  background-color: #fff;
}


#outline h2 {
	margin: auto;
	padding: 0 0 15px;
}


.outline {
    position:relative;
    width: 90%;
    margin: 20px auto 40px;
    overflow:hidden;
}

/* 背景 */

.outline_bg{
    position:absolute;
    inset:0;
    background: rgba(0, 174, 225, 0.82);
    z-index:0;
    mix-blend-mode: multiply;
}

.outline_inner{
    position:relative;
    z-index:2;
    padding:35px 10px 30px;
}

/* タイトル */

.outline_title{

    text-align:center;
    color:#fff;
    font-size:1.2rem;
    font-weight:500;
    margin-bottom:20px;
    letter-spacing:.2em;
    transform:scaleX(.88);
}
@media(min-width:1280px){
.outline_title{
  font-size:1.66vw;
}
}

.outline_title span{

    position:relative;
}

.outline_title span::before,
.outline_title span::after{

    content:"";

    position:absolute;
    top:50%;

    width:48px;
    height:1px;

    background:#fff;
}

.outline_title span::before{

    right:100%;
    margin-right:18px;
}

.outline_title span::after{

    left:100%;
    margin-left:18px;
}

/* リスト */

.outline_list{
  width: 94%;
  margin: auto;
    margin-bottom:2px;
}

.outline_list .row{
width: 120%;
    display:flex;
    align-items:flex-start;

    margin-bottom:4px;

    color:#fff;

    font-size:1.30rem;
    font-weight:500;
      transform:scaleX(.84);

   
    transform-origin:left;
}
@media(min-width:1280px){
.outline_list .row{
  font-size:1.66vw;
}
}
@media(max-width:769px){
.outline_list .row{
  font-size:4.2vw;
}
}
.outline_list dt{

    width:18%;
    letter-spacing:.20em;
    flex-shrink:0;
    line-height:1.35;
    text-align: justify;
    text-justify: inter-ideograph;
}


.outline_list dd{
  width:82%;
    flex:1;
    margin:0;
    line-height:1.35;
    letter-spacing:.060em;
}

/* 下テキスト */

.outline_event{

    width: 100%;
    margin: auto;
    color:#fff;
    padding:10px 0px;
    transform-origin:left;
}

.outline_event p {
  width: 110%;
    margin:auto;
    margin-left: -4.5%;
    font-size:1.20rem;
    letter-spacing: 0.08em;
    line-height: 1.3;
    font-weight: 600;
    transform: scaleX(0.86); /* 横幅を80%に縮小（長体） */
    
}
@media(min-width:1280px){
.outline_event p {
  font-size:1.54vw;
    
}
}
@media(max-width:769px){

.outline_event p {
    margin:0;
    margin-left: -4%;
    transform: scaleX(0.86); /* 横幅を80%に縮小（長体） */
    font-size: 3.85vw;
    line-height: 1.4;
    font-weight: 600;
}
}

/* 左カッコ */
/*
.outline_event::before{

    content:"";

    position:absolute;

    left:10px;
    top:0;

    width:12px;
    height:100%;

    border-left:1.5px solid #fff;

    border-top:1.5px solid #fff;

    border-bottom:1.5px solid #fff;
}
*/
/* 右カッコ */
/*
.outline_event::after{

    content:"";

    position:absolute;

    right:5px;
    top:0;

    width:12px;
    height:100%;

    border-right:1.5px solid #fff;

    border-top:1.5px solid #fff;

    border-bottom:1.5px solid #fff;
}
    */



/****************************************
youtube
*****************************************/


.youtube {
  width: 100%;
  max-width: 100%;
  aspect-ratio: 16 / 9;
  margin: 0;
  padding: 0;
  background-color: #000;
}
.youtube iframe {
  width: 100%;
  height: 100%;
  margin: 0;
  padding: 0;
  background-color: #000;
}


/****************************************
category
*****************************************/

#category {
	margin: auto;
  padding-top: 60px;
  padding-bottom: 60px;
  background-color: #fff;
}

#category h3 {
	margin: auto;
	padding: 4px 20px;
}

.category_wrap{

  width:90%;
  margin:30px auto;
}

.category_table{

    width:100%;
    border-collapse:collapse;
    table-layout:fixed;
    border:1px solid #00aee1;
    border-right: none;
}

.category_table thead th{
    background:#67bde5;
    color:#fff;
    font-size:1.0rem;
    padding:10px 5px;
    text-align: center;
    border:1px solid #00aee1;
    font-weight: 500;
}


.category_table thead th span{
    font-size:0.66rem;
    padding:10px 0px;
}


.category_table thead th:first-child{
    width:39%;
    font-weight:bold;
}

.category_table thead th:nth-child(2){
    width:47%;
    font-weight:bold;
}

.category_table thead th:last-child{
    width:24%;
    font-weight:bold;
}

.category_table tbody tr:nth-child(odd){

    background:#dff2fc;
}

.category_table tbody tr:nth-child(even){

    background:#fff;
}

.category_table td{
    padding:12px;
    color:#00aee1;
    font-size:0.92rem;
    line-height:1.2;
    vertical-align: middle;
    border-top:1px solid #00aee1;
    border-bottom:1px solid #00aee1;
    border-right:1px dashed #00aee1;
    font-weight: 400;
}

.category_table td p {
    padding-top: 4px;
    font-weight: 400;
}


.category_table td:last-child{
    width:34%;
    border-right:1px solid #00aee1;
    text-align:center;
    font-size:1.0rem;
    font-weight:bold;
}

.category_table td:first-child{
    font-size:0.92rem;
    font-weight:bold;
}

.category_table td:nth-child(2){
  padding: 12px 0;
   transform: scaleX(0.86); /* 横幅を80%に縮小（長体） */
   letter-spacing: 0.05em;
}

.category_table td strong {

    display:block;
    font-size:1.0rem;
    margin-bottom:6px;
}

.category_table td span{
    font-size:0.66rem;
    padding:2px 0px;
}

@media(min-width:1280px){
  .category_table thead th{
   font-size:1.0vw;
}
.category_table td{
    padding:12px 4px;
    color:#00aee1;
    font-size:1.1vw;
    line-height:1.6;
    vertical-align: middle;
    border-top:1px solid #00aee1;
    border-bottom:1px solid #00aee1;
    border-right:1px dashed #00aee1;
    font-weight: 400;
}

.category_table td:last-child{
    width:34%;
    border-right:1px solid #00aee1;
    text-align:center;
    font-size:1.1vw;
    font-weight:bold;
}

.category_table td:first-child{
    font-size:1.1vw;
    font-weight:bold;
}

}

@media(max-width:769px){

  .category_table thead th{
   font-size:3.2vw;
}

  .category_table thead th:first-child{
    width:36%;
    font-weight:bold;
}

.category_table thead th:nth-child(2){
    width:50%;
    font-weight:bold;
}

.category_table thead th:last-child{
    width:24%;
    font-weight:bold;
}

  .category_table td{
    padding:12px 4px;
    color:#00aee1;
    font-size:3.0vw;
    line-height:1.6;
    vertical-align: middle;
    border-top:1px solid #00aee1;
    border-bottom:1px solid #00aee1;
    border-right:1px dashed #00aee1;
    font-weight: 400;
}

.category_table td p {
    font-weight: 400;
}


.category_table td:last-child{
    width:34%;
    border-right:1px solid #00aee1;
    text-align:center;
    font-size:3.2vw;
    font-weight:bold;
}

.category_table td:first-child{
    font-size:3.2vw;
    font-weight:bold;
}

.category_table td:nth-child(2){
  padding: 12px 0;
   transform: scaleX(0.86); /* 横幅を80%に縮小（長体） */
   letter-spacing: 0.05em;
   font-size:3.3vw;
}

.category_table td strong {

    display:block;
    font-size:1.0rem;
    margin-bottom:6px;
}

.category_table td span{
    font-size:0.66rem;
    padding:2px 0px;
}
}

#category .cate_cotion {
  color: #00aee1;
  padding-left: 1em;
  padding-top: 10px;
  padding-bottom: 20px;
  text-indent: -1em;
  font-size: 1.12rem;
  font-weight: 600;
  line-height: 1.4;
  letter-spacing: 0.1em;
  transform: scale(0.86, 1);
  transform-origin: top left;
  width: 125%;
}

@media(max-width:769px){
#category .cate_cotion {
  font-size: 3.8vw;
}
}


.btn_jsa{
    width:200px;
    margin:auto;
    padding:0;
    list-style:none;
}

.btn_jsali{
    margin:18px 0;
}

/* ボタン */

.btn_jsa a {

    position:relative;
    display:flex;
    align-items:center;
    justify-content:center;
    width:100%;
    height:32px;
    background:#00aee1;
    border-radius:999px;
    text-decoration:none;
    overflow:hidden;
    box-shadow:0 10px 10px rgba(0,128,172,.35);
    transition:.3s;
}

.btn_jsa a:hover{
    transform:translateY(-3px);
    box-shadow:0 14px 20px rgba(0,128,172,.45);
}

/* ロゴ */
.btn-txt {
    display:flex;
    justify-content:center;
    align-items:center;
    width:100%;
    height:100%;
    color: #fff;
    padding-left: 10.2%;
    padding-bottom: 1.2%;
    font-size: 1.08rem;
    font-weight: 600;
    letter-spacing: 0.1em;
    transform: scale(0.86, 1);
    transform-origin: top left;
    width: 125%;
}

/* 矢印 */
.btn_jsa .btn-arrow{
    position:absolute;
    right:26px;
    top:50%;
    width:16px;
    height:14px;
    transform:translateY(-50%);
}

.btn_jsa .btn-arrow img{
    position:absolute;
    inset:0;
    width:100%;
    transition:.25s;
}

@media(min-width:1280px){

.btn_jsa{
    width:32%;
    margin:auto;
    padding:0;
    list-style:none;
}

.btn_jsali{
    margin:18px 0;
}

/* ボタン */

.btn_jsa a {
    position:relative;
    display:flex;
    align-items:center;
    justify-content:center;
    width:100%;
    height:1.8vw;
    background:#00aee1;
    border-radius:999px;
    text-decoration:none;
    overflow:hidden;
    box-shadow:0 10px 10px rgba(0,128,172,.35);
    transition:.3s;
}

.btn_jsa a:hover{
    transform:translateY(-3px);
    box-shadow:0 14px 20px rgba(0,128,172,.45);
}

/* ロゴ */
.btn-txt {
    display:flex;
    justify-content:center;
    align-items:center;
    width:100%;
    height:100%;
    color: #fff;
    padding-left: 10.2%;
    padding-bottom: 1.2%;
    font-size: 1.02vw;
    font-weight: 600;
    letter-spacing: 0.1em;
    transform: scale(0.86, 1);
    transform-origin: top left;
    width: 125%;
}

/* 矢印 */
.btn_jsa .btn-arrow{
    position:absolute;
    right:26px;
    top:50%;
    width:16px;
    height:14px;
    transform:translateY(-50%);
}

.btn_jsa .btn-arrow img{
    position:absolute;
    inset:0;
    width:100%;
    transition:.25s;
}
}


#category h5 {
  width: 100%;
  margin: auto;
  padding-top: 30px;
  padding-bottom: 16px;
  font-size: 1.66rem;
  color: #00aee1;
 }



#category .entry a {
    border: #00aee1 1px solid;
}

#category .btn_entry {
  width: 70%;
}
@media(max-width:769px){
#category .btn_entry {
  width: 320px;
}
}


/****************************************
schedule
*****************************************/

#schedule {
	margin: auto;
  padding-top: 60px;
  padding-bottom: 10px;
  background: none;
}

#schedule h3 {
	margin: auto;
	margin-bottom: 30px;
	padding: 4px 20px;
}

#schedule ul {
 width: 82%;
 margin: auto;
}

#schedule ul li {
 margin: 5px auto 40px;
}


.schedule_wrap{

  width:90%;
  margin:0 auto 0;
}


.schedule_table{
    width:100%;
    margin: 0 auto 5px;
    border-collapse:collapse;
    table-layout:fixed;
    color:#fff;
}

.schedule_table thead th{
    vertical-align: middle;
    text-align: center;
    padding:14px 2px;
    font-size:0.80rem;
    font-weight: 400;
    font-weight:bold;
    line-height:1.3;
    border-right:2px solid rgba(255,255,255,.4);
    transform: scaleX(0.86); /* 横幅を80%に縮小（長体） */
}



.schedule_table thead {
    margin-bottom: 10px;
    padding-bottom: 10px;
     background:#0b78c8;
}

.schedule_table thead th:first-child{
    border-right:1px solid rgba(255,255,255,.8);
    width: 34%;
}

.schedule_table thead th:nth-child(2){
    border-right:1px solid rgba(255,255,255,.8);
    width: 12%;
}
.schedule_table thead th:nth-child(3){
    border-right:1px solid rgba(255,255,255,.8);
    width: 12%;
}

.schedule_table thead th:nth-child(4){
    border-right:1px solid rgba(255,255,255,.8);
    width: 14%;
}
.schedule_table thead th:nth-child(5){
    border-right:1px solid rgba(255,255,255,.8);
    width: 14%;
}

.schedule_table thead th:last-child{
    border-right:none;
    width: 13%;
}


.schedule_table td{
    position:relative;
    background:transparent;
    overflow:hidden;
}

.schedule_table td::before{
    content:"";
    position:absolute;
    inset:0;
    z-index:0;
    mix-blend-mode:multiply;
    pointer-events:none;
}

.schedule_table tbody tr:nth-child(odd) td::before{
    background:rgba(35,187,242,.64);
}

.schedule_table tbody tr:nth-child(even) td::before{
    background:rgba(20,136,208,.64);
}

/* 文字を前面へ */
.schedule_table td > *{
    position:relative;
    z-index:1;
}



.schedule_table td:first-child{
    width: 33%;
    font-weight: 500;
}

.schedule_table td:nth-child(2){
    width: 12%;
}
.schedule_table td:nth-child(3){
    width: 12%;
}

.schedule_table td:nth-child(4){
    width: 14%;
}
.schedule_table td:nth-child(5){
    width: 14%;
}

.schedule_table td:last-child{
    border-right:none;
    width: 13%;
}

.schedule_table td {
    padding:22px 2px;
    vertical-align: middle;
    text-align:center;
    font-size:1.0rem;
    border-right:1px dashed rgba(255,255,255,.8);
}

.schedule_table td:first-child{
    text-align:left;
    padding-left: 8px;
    font-weight: 500;
}


.schedule_table td:last-child{
    border-right:none;
}

.schedule_table td p.sch_cate {
    margin-left: -8%;
    transform: scale(0.86);
    line-height: 1.3;
    width: 112%;
    font-size: 116%;
}

.schedule_table td span{
    font-size:0.72rem;
    padding:2px;
}

@media(min-width:1280px){
.schedule_table thead th{
   
    vertical-align: middle;
    text-align: center;
    padding:14px 2px;
    font-size:1.0vw;
    font-weight: 400;
    font-weight:bold;
    line-height:1.3;
    border-right:2px solid rgba(255,255,255,.4);
    transform: scaleX(0.86); /* 横幅を80%に縮小（長体） */
}
  .schedule_table td {
    padding:22px 2px;
    vertical-align: middle;
    text-align:center;
    font-size:1.2vw;
    border-right:1px dashed rgba(255,255,255,.8);
}
}



@media(max-width:769px){
  .schedule_table thead th{
   
    vertical-align: middle;
    text-align: center;
    padding:14px 2px;
    font-size:2.6vw;
    font-weight: 400;
    font-weight:bold;
    line-height:1.3;
    border-right:2px solid rgba(255,255,255,.4);
    transform: scaleX(0.86); /* 横幅を80%に縮小（長体） */
}
  .schedule_table td {
    padding:22px 2px;
    vertical-align: middle;
    text-align:center;
    font-size:3.3vw;
    border-right:1px dashed rgba(255,255,255,.8);
}
.schedule_table td:first-child{
    width: 34%;
    font-weight: 500;
}

.schedule_table td:nth-child(2){
    width: 12%;
}
.schedule_table td:nth-child(3){
    width: 12%;
}

.schedule_table td:nth-child(4){
    width: 14%;
}
.schedule_table td:nth-child(5){
    width: 14%;
}

.schedule_table td:last-child{
    border-right:none;
    width: 13%;
}
}


#schedule .sch_cotion {
  color: #fff;
  padding-left: 1em;
  text-indent: -1em;
  font-size: 1.16rem;
  font-weight: 500;
  line-height: 1.4;
  letter-spacing: 0.1em;
  transform: scale(0.86, 1);
  transform-origin: top left;
  width: 125%;
}

@media(max-width:769px){
  #schedule .sch_cotion {
  font-size: 3.8vw;
}
}


/****************************************
prize
*****************************************/

#prize {
	margin: auto;
  padding-top: 60px;
  padding-bottom: 80px;
  background: none;
}

#prize h3 {
	margin: auto;
	margin-bottom: 30px;
	padding: 4px 20px;
}


#prize .prize_prize {
  width: 88%;
  margin: auto;
	display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  text-align: left;
  color: #fff;
}
@media screen and (max-width: 768px) {
#prize .prize_prize {
  width: 90%;
  margin: auto;
	display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  text-align: left;
  color: #fff;
}
}

#prize h4 {
  width: 100%;
	margin: 0;
  margin-top: 15px;
	margin-bottom: 12px;
	padding: 12px 6px;
  font-size: 1.36rem;
  font-weight: 600;
  text-align: center;
  letter-spacing: 0.2em;
  transform: scaleX(0.86); /* 横幅を80%に縮小（長体） */
  border-top: #fff 1.5px solid;
  border-bottom: #fff 1.5px solid;
}
@media(min-width:1280px){
  #prize h4 {
  font-size: 1.66vw;
}
}


#prize ul.prize_list {
  color: #fff;
  margin: 10px 0 20px;
}


#prize ul.prize_list li {
  color: #fff;
  margin: 0;
  padding-left: 1em;
  text-indent: -1em;
  font-size: 1.16rem;
  font-weight: 500;
  line-height: 1.6;
  letter-spacing: 0.1em;
  transform: scale(0.86, 1);
  transform-origin: top left;
  width: 125%;
}


#prize p {
  width: 100%;
	margin: 0;
  padding-bottom: 5px;
  padding-left: 1em;
  text-indent: -1em;
  font-size: 0.96rem;
  font-weight: 400;
  text-align: left;
  line-height: 1.2;
  letter-spacing: 0.1em;
  transform: scaleX(0.86); /* 横幅を80%に縮小（長体） */
}

@media(min-width:1280px){
#prize ul.prize_list li {
  font-size: 1.48vw;
}
#prize p {
  font-size: 1.16vw;
}
}



/****************************************
course
*****************************************/

#course {
	margin-bottom: 0;
  padding-top: 60px;
  background: url('../img/course_bg.png');
  background-size:cover;
  background-position:center;
  letter-spacing:.08em;

}

#course h3 {
		margin: auto;
  margin-bottom: 30px;
	padding: 4px 20px;
}

#course h4 {
		margin: 0 auto 20px;
    text-align: center;
    color: #fff;
    font-size: 1.24rem;
    font-weight: 600;
}
#course h4 span {
		background-color: #002c56;
    padding: 0px 10px 2px;
}

#course dl.area {
 width: 98%;
 margin: auto;
 margin-bottom: 40px;
 display: flex;
 flex-wrap: wrap;
}

#course dl.area dt {
 width: 56%;
 margin: 0;
}
#course dl.area dd {
 width: 43%;
 margin: 0;
 padding-left: 1%;
}


#course dl.area dd dl.floor {
 width: 100%;
 margin: 30px 0 0;
 display: flex;
 flex-wrap: wrap;
 align-items: flex-start;
}

#course dl.area dd dl.floor dt {
 width: 16%;
 max-width: 42px;
 min-height: 1.0em;
 margin: 0 auto;
 padding: 8px 4px;
 display: flex;
 justify-content: center;
 align-items: center;
 text-align: center;
 background-color: #002c56;
}
#course dl.area dd dl.floor dt:first-child {
 width: 16%;
 max-width: 42px;
 min-height: 5.5em;
 margin: 0 auto 12px;
 padding: 4px 4px;
 display: flex;
 justify-content: center;
 align-items: center;
 text-align: center;
 background-color: #002c56;
}
#course dl.area dd dl.floor dt img {
 width: 80%;
}

@media screen and (max-width: 768px) {
  #course dl.area dd dl.floor dt:first-child {
 width: 16%;
 max-width: 42px;
 min-height: 4.5em;
 margin: 0 auto 10px;
 padding: 4px 4px;
 display: flex;
 justify-content: center;
 align-items: center;
 text-align: center;
 background-color: #002c56;
}
#course dl.area dd dl.floor dt img {
 width: 70%;
}
}

#course dl.area dd dl.floor dd {
 width: 76%;
 min-height: 1.4em;
 margin: auto;
 margin-left: -5%;
 margin-bottom: 6px;
 padding: 4px 0px;
 display: flex;
 flex-wrap: wrap;
 align-items: center;
 color: #002c56;
 font-size: 1.24rem;
 font-weight: 700;
 line-height: 1.1;
 letter-spacing: 0.1em;
 transform: scaleX(0.86);
}

@media(min-width:1280px){
#course dl.area dd dl.floor dd {

 font-size: 1.32vw;
}
}

@media screen and (max-width: 768px) {
#course dl.area dd dl.floor dd {
 width: 74%;
 min-height: 1.4em;
 margin: 0;
 margin-left: -2%;
 margin-bottom: 12px;
 padding: 4px 0px;
 display: flex;
 flex-wrap: wrap;
 align-items: flex-start;
 color: #002c56;
 font-size: 1.02em;
 font-weight: 700;
 line-height: 1.1;
 transform: scaleX(0.86);
}
}

#course dl.area dd dl.floor dd span {
  width: 40%;
}

#course dl dt .hiroba {
  width: 86%;
  max-width: 80%;
  min-height: 13em;
  margin: auto;
  margin-top: 30px;
  padding-bottom: 1em;
  text-align: center;
  display: flex;
  justify-content: center;
  align-items: center;
  color: #fff;
  font-weight: 600;
  background-color: #002c56;
  border-top-left-radius: 0px;/*要素の左上角にborder-radius30pxを指定*/
  border-top-right-radius: 0px;/*要素の右上角にborder-radius90pxを指定*/
  border-bottom-right-radius: 55%;/*要素の右下角にborder-radius30pxを指定*/
  border-bottom-left-radius: 55%;/*要素の左下角にborder-radius90pxを指定*/
}
@media screen and (max-width: 768px) {
  #course dl dt .hiroba {
  width: 80%;
  max-width: 100%;
  min-height: 11em;
  margin: auto;
  margin-top: 30px;
  padding-bottom: 1em;
  text-align: center;
  display: flex;
  justify-content: center;
  align-items: center;
  color: #fff;
  font-weight: 600;
  background-color: #002c56;
  border-top-left-radius: 0px;/*要素の左上角にborder-radius30pxを指定*/
  border-top-right-radius: 0px;/*要素の右上角にborder-radius90pxを指定*/
  border-bottom-right-radius: 55%;/*要素の右下角にborder-radius30pxを指定*/
  border-bottom-left-radius: 55%;/*要素の左下角にborder-radius90pxを指定*/
}
}

#course dl dd .booth {
  margin-top: 30px;
  margin-left: -8px;
  color: #002c56;
  font-size: 1.20rem;
  font-weight: 700;
  line-height: 1.4;
  letter-spacing: 0.1em;
  transform: scaleX(0.88); /* 横幅を80%に縮小（長体） */
}
@media(min-width:1280px){
#course dl dd .booth {
  font-size: 1.32vw;
}
}


@media screen and (max-width: 768px) {
#course dl dd .booth {
  color: #002c56;
  font-size: 1.02rem;
  font-weight: 700;
  line-height: 1.5;
  transform: scaleX(0.88); /* 横幅を80%に縮小（長体） */
}
}


/****************************************
guest
*****************************************/

#guest {
  margin: auto;
  padding-bottom: 80px;
  background-color: #fff;
  text-align: center;

}

#guest h3 {
  text-align: center;
		margin: auto;
  margin-bottom: 30px;
	padding: 4px 20px;
}

#guest .guest_guest {
   width: 100%;
 background-color: #002c56;
}

#guest ul {
 width: 90%;
 margin: auto;
 display: flex;
 flex-wrap: wrap;
 justify-content: space-between;

}

#guest ul li {
 width: 46%;
 margin: 10px 0 15px;
}

#guest ul li p {
  width: 118%;
  margin: 0;
  margin-left: -20px;
  padding: 10px 0 15px;
  color: #fff;
  text-align: left;
 font-size: 0.88rem;
 line-height: 1.5;
 transform: scaleX(0.86); /* 横幅を80%に縮小（長体） */
  display: inline-block;  /* transformを効かせるために必要 */
  letter-spacing: 0.05em;
  text-align: justify;
}

#guest ul li:first-child p {
  width: 118%;
  margin: 0;
  margin-left: -20px;
  padding: 10px 0 15px;
  color: #fff;
  text-align: left;
 font-size: 0.88rem;
 line-height: 1.5;
 transform: scaleX(0.86); /* 横幅を80%に縮小（長体） */
  display: inline-block;  /* transformを効かせるために必要 */
  letter-spacing: 0.15em;
  text-align: justify;
}

@media (min-width:1280px){

#guest ul li p {
 font-size: 1.02vw;
}

#guest ul li:first-child p {
   font-size: 1.02vw;
}
}



@media screen and (max-width: 768px) {
#guest ul li p {
  width: 120%;
  margin: 0;
  margin-left: -15px;
  padding: 10px 0 15px;
  color: #fff;
  text-align: left;
 font-size: 0.78rem;
 line-height: 1.5;
 transform: scaleX(0.86); /* 横幅を80%に縮小（長体） */
  display: inline-block;  /* transformを効かせるために必要 */
  letter-spacing: 0.05em;
  text-align: justify;
}
#guest ul li:first-child p {
  width: 120%;
  margin: 0;
  margin-left: -15px;
  padding: 10px 0 15px;
  color: #fff;
  text-align: left;
 font-size: 0.78rem;
 line-height: 1.5;
 transform: scaleX(0.86); /* 横幅を80%に縮小（長体） */
  display: inline-block;  /* transformを効かせるために必要 */
  letter-spacing: 0.09em;
  text-align: justify;
}
#guest ul li:nth-child(4) p {
  width: 120%;
  margin: 0;
  margin-left: -15px;
  padding: 10px 0 15px;
  color: #fff;
  text-align: left;
 font-size: 0.78rem;
 line-height: 1.5;
 transform: scaleX(0.86); /* 横幅を80%に縮小（長体） */
  display: inline-block;  /* transformを効かせるために必要 */
  letter-spacing: 0.02em;
  text-align: justify;
}

}

#guest ul.icon_sns {
 width: 100%;
 margin: auto;
 display: flex;
 flex-wrap: wrap;
 justify-content: flex-start;
}
#guest ul.icon_sns li {
 width: 20%;
 max-width: 40px;
 margin: 0px 10px 20px -2px;
}

#guest .andmore {
  width: 28%;
	margin: 0 auto 0;

	padding-left: 4%;
  text-align: center;
}

/****************************************
award
*****************************************/

#award {
	margin: auto;
  padding-bottom: 80px;
  background-color: #fff;
}

#award h3 {
		margin: auto;
  margin-bottom: 30px;
	padding: 4px 20px;
}

#award ul {
 width: 88%;
 margin: auto;
 display: flex;
 flex-wrap: wrap;
 justify-content: space-between;
}

#award ul li {
 width: 47%;
 margin: 10px 0 20px;
}

/*
#award ul li:last-child {
 width: 100%;
 margin: 10px 0 20px;
}
*/

#award ul li p {
  width: 115%;
  margin: 0;
  margin-left: -18px;
  padding: 10px 0 5px;
  color: #00aee1;
  text-align: left;
 font-size: 0.84rem;
 font-weight: 800;
 line-height: 1.2;
 transform: scaleX(0.84); /* 横幅を80%に縮小（長体） */
  display: inline-block;  /* transformを効かせるために必要 */
  letter-spacing: 0.2em;
}

@media (min-width:1280px){

#award ul li p {
 font-size: 1.02vw;
}

}




/****************************************
access
*****************************************/

#access {
	margin: auto;
  padding-bottom: 20px;
  background-color: #fff;
}

#access h3 {
	margin: auto;
  margin-bottom: 30px;
	padding: 4px 20px;
}



.map-container {
	width: 90%;
   margin: auto;
}


.map-container iframe[src*="www.google.com/maps/embed"] {
	aspect-ratio: 4 / 3;
	width: 100%;
	height: auto;
}

#access .station {
   width: 90%;
   margin: auto;
   padding: 5% 0;
  border-bottom: #002c56 1.5px solid;
}

#access h4 {
    display: flex;
    align-items: center;
    width: 115%;
    margin-left: -25px;
    padding-bottom: 10px;
    gap: 10px; /* タイトルと線の間隔 */
    color: #002c56;
    letter-spacing: 0.2rem;
    transform: scaleX(0.86); /* 横幅を80%に縮小（長体） */
    font-weight: 600;
}

@media screen and (min-width: 1280px) {
   #access h4 {
    font-size: 1.02vw;
    width: 110%;
}

}

#access h4::after {
    content: "";
    flex: 1;
    height:1.5px;          /* 線の太さ */
    background: #002c56;      /* 線の色 */
}

#access ul.root {
 width: 100%;
 margin: auto;
}

#access ul.root li {
 color: #002c56;
  width: 110%;
  margin: 0;
  margin-left: -25px;
  padding: 5% 0 0;
  padding-left: 1em;
  text-indent: -1em;
  text-align: left;
  font-size: 0.90rem;
  font-weight: 500;
  line-height: 1.4;
  transform: scaleX(0.84); /* 横幅を80%に縮小（長体） */
  display: inline-block;  /* transformを効かせるために必要 */
  letter-spacing: 0.05em;
}
@media screen and (min-width: 1280px) {
#access ul.root li {
 color: #002c56;
  width: 110%;
  margin: 0;
  margin-left: -25px;
  padding: 6px 0 0px;
  padding-left: 1em;
  text-indent: -1em;
  text-align: left;
  font-size: 1.24vw;
  font-weight: 500;
  line-height: 1.4;
  transform: scaleX(0.84); /* 横幅を80%に縮小（長体） */
  display: inline-block;  /* transformを効かせるために必要 */
  letter-spacing: 0.05em;
}
}

@media screen and (max-width: 768px) {
#access ul.root li {
 color: #002c56;
  width: 110%;
  margin: 0;
  margin-left: -25px;
  padding: 6px 0 0px;
  padding-left: 1em;
  text-indent: -1em;
  text-align: left;
  font-size: 0.90rem;
  font-weight: 500;
  line-height: 1.4;
  transform: scaleX(0.84); /* 横幅を80%に縮小（長体） */
  display: inline-block;  /* transformを効かせるために必要 */
  letter-spacing: 0.05em;
}

}

 #access .entry h5 {
  width: 100%;
  margin: auto;
  padding-top: 30px;
  padding-bottom: 10px;
  font-size: 1.66rem;
  color: #002c56;
 }
#access .btn_entry {
  width: 70%;
}
@media screen and (max-width: 768px) {
#access .btn_entry {
  width: 320px;
}
}

#access .btn_entry a{
    border:1px solid #002c56;
}

/****************************************
sponsor
*****************************************/

#sponsor {
  margin: auto;
  padding-bottom: 40px;
  background-color: #fff;
}

#sponsor h3 {
	margin: auto;
  margin-bottom: 30px;
	padding: 4px 20px;
}

.section_title {
    display:flex;
    align-items:center;
    justify-content:center;
    gap:10px;               /* 線と文字の間隔 */
    padding: 20px 0 10px;
    color:#00aee1;
    font-size: 0.8rem;
    font-weight: 500;
    letter-spacing: .12em;
    text-align:center;
}

@media screen and (min-width: 1280px) {
  .section_title {
    display:flex;
    align-items:center;
    justify-content:center;
    gap:10px;               /* 線と文字の間隔 */
    padding: 20px 0 10px;
    color:#00aee1;
    font-size: 0.8vw;
    font-weight: 500;
    letter-spacing: .12em;
    text-align:center;
}
}

.section_title::before,
.section_title::after{
    content:"";
    width:30px;             /* 横線の長さ */
    height:1px;
    background:#00aee1;
    flex-shrink:0;
}

#sponsor li a {
	margin: 5px auto;
	text-align: center;
	font-size: 0.86em;
	padding: 10px 0;
}

#sponsor ul {
  width: 90%;
	margin: auto;
	padding: 20px 0;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
  justify-content: space-around;
}

#sponsor .sponsor_list01 li {
	width: 42%;
	margin: 0 auto;
	padding: 0;
	text-align: center;
}



@media screen and (max-width: 768px) {
    
#sponsor .sponsor_list {
	margin: auto;
	padding: 0 10px 20px;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
}

#sponsor .sponsor_list li {
	width: 36%;
	margin: 0 auto;
	padding: 0 20px 40px;
	text-align: center;
}

#sponsor .sponsor_list li:nth-child(1) {
	width: 42%;
	padding: 0 10px 40px;
}
#sponsor .sponsor_list li:nth-child(2) {
	width: 42%;
	padding: 0 10px 40px;
}
#sponsor .sponsor_list li:nth-child(3) {
	width: 38%;
	padding: 0 10px 40px;
}
#sponsor .sponsor_list li:nth-child(4) {
	width: 38%;
	padding: 0 10px 40px;
	font-size: 3.6vw;
}
#sponsor .sponsor_list li:nth-child(5) {
	width: 38%;

}

#sponsor .sponsor_link {
	margin: auto;
	padding: 0 10px 0;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
}
#sponsor .sponsor_link li {
	width: 48%;
	margin: 0 auto;
	padding: 10px 2px 20px;
	font-size: 0.86em;
	font-weight: 600;
	text-align: center;
}
}

/****************************************
pagetop
*****************************************/


 #js-pagetop {
	width: 780px;
	max-width: 100%;
	margin: auto;
 }

 #js-pagetop .pagetop {
	width: 50px;
	height: 50px;
	margin-left: 240px;
	position: fixed;
	left: 50%;
	bottom: 160px;
	justify-content: center;
	align-items: center;
	z-index: 2;
	cursor: pointer;
  }
  @media only screen and (max-width: 768px) {
	#js-pagetop .pagetop {
		width: 40px;
		height: 40px;
		margin-left: 35%;
		position: fixed;
		left: 50%;
		bottom: 170px;
		justify-content: center;
		align-items: center;
		z-index: 2;
		cursor: pointer;
	  }
	}


/****************************************

footer

*****************************************/
footer {
	width: 100%;
	max-width: 100%;
  margin: auto;
  padding: 0px 0 40px;
  background-color: #fff;
}

footer a {color: #002c56;}

footer h3 {
	margin: auto;
	padding: 10px 20px 20px;
}

.footer_inner {
	width: 95%;
	max-width: 100%;
  margin: auto;
  padding: 40px 0 0;
  color: #002c56;
  border-top: #002c56 1px solid;
  background-color: #fff;
}

.footer {
  width: 70%;
	max-width: 100%;
	margin: auto;
	display: grid;
  grid-template-columns: 7em 1fr;     /* ← ここを調整 */
  row-gap: 6px;
  column-gap: 1px;
  align-items: baseline;
  font-weight: 500;
  font-size: 0.78em;
  line-height: 1.5;
  letter-spacing: 0.04em;
}


dl.footer dt {
    text-align: justify;              /* 左右両端揃え */
    text-align-last: justify;         /* 最後の行も両端揃え */
    padding-right: 0.8em;             /* 「：」との間隔 */
}

dl.footer dd {
    margin: 0;
}
dl.footer dd img {
    width: 28%;
    max-width: 64px;
}


/* 必要に応じて微調整 */
dl.footer dt::after {
    content: "：";
    margin-left: 0.4em;
}


@media screen and (min-width: 1280px) {
    .footer {
  font-size: 0.78vw;
}
dl.footer dd img {
    width: 20%;
    max-width: 100%;
}
}

@media screen and (max-width: 768px) {
	
.footer {
  width: 80%;
	max-width: 100%;
	margin: auto;
	display: grid;
  grid-template-columns: 7em 1fr;     /* ← ここを調整 */
  row-gap: 0px;
  column-gap: 1px;
  align-items: baseline;
  font-weight: 500;
  font-size: 0.78em;
  line-height: 1.0;
  letter-spacing: 0.04em;
}


dl.footer dt {
    text-align: justify;              /* 左右両端揃え */
    text-align-last: justify;         /* 最後の行も両端揃え */
        margin: 0 auto;
        padding: 0 0;
    padding-right: 0.8em;             /* 「：」との間隔 */

}

dl.footer dd {
    margin: 0;
        padding: 2px 0;
        height: 1.4em;
        vertical-align: middle;
        line-height: 1em;
}
dl.footer dd img {
    width: 32%;
    margin-top: 5px;
}


/* 必要に応じて微調整 */
dl.footer dt::after {
    content: "：";
    margin-left: 0.4em;
}
	}