@font-face {
  font-family: "Bebas";
  src: url("../font/BebasNeue-Regular.ttf");
}

body{margin: 0px auto;padding:0px;width:auto;background: #FFF;background-size: 100% 100%;background-position: center bottom;background-attachment: fixed;max-width: 2000px;}
ul,li{ padding:0px; margin:0px; list-style:none;}

ul{width:100%;margin:0 auto;}
li{ text-align:center;}

.featherlight .featherlight-close-icon{
    line-height: 50px;
    width: 50px;
    font-size: 21px;
    background: none;
}
.featherlight .featherlight-content{
    border-radius: 20px;
}
.featherlight .featherlight-content h2{
    margin: 10px 0 30px;
}
.floating img{width: 100%;}
@keyframes floatSlideUp {
  0% {
    transform: translateY(100%);
    opacity: 0;
  }
  100% {
    transform: translateY(0);
    opacity: 1;
  }
}
.end_box{
    position: relative;
    margin: 0 0 12%;
}
/* 通常状態 */
.floating {
  position: relative;
  transition: opacity 0.4s ease;
  z-index: 9999;
  opacity: 0;
  transform: none; /* ← 元位置ではズレを防ぐ */
}

/* フローティングとして出現時のみ transform を適用 */
.floating.is-fixed {
  position: fixed !important;
  bottom: 0;
  left: 0;
  right: 0;
  margin: 0 auto;
  animation: floatSlideUp 0.6s ease-out;
  transform: none; /* ← アニメ後はリセット（ズレ防止） */
  max-width: 425px;
  width: 100%;
  padding: 10px 40px;
  box-sizing: border-box;
  background-color: rgba(255, 255, 255, 0.2);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  border-radius: 20px 20px 0 0;
  border: 1px solid rgba(255, 255, 255, 0.2);
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
}

/* 表示制御 */
.floating.is-visible {
  opacity: 1;
}

.floating.is-hidden {
  opacity: 0;
  pointer-events: none;
}


.formtext {
    width: 90%;
    margin: 0 auto;
    padding: 3% 0;
}

.popup {
    display: none; /* 初期は非表示 */
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.7); /* 半透明の背景色 */
    z-index: 1000; /* 他の要素より手前に表示 */
    text-align: center; /* コンテンツを中央に配置 */
}

/* ポップアップのコンテンツ */
.popup-content {
    position: relative;
    top: 50%;
    transform: translateY(-50%); /* 垂直方向中央に配置 */
     /* ポップアップの背景色 */
    max-width: 28%; /* コンテンツの最大幅 */
    margin: 0 auto; /* 水平方向中央に配置 */
    padding: 20px;
    border-radius: 5px;
}
.close-popup-button{
    position: absolute;
    right: 0;
    top: 0;
    width: 3%;
    cursor: pointer;
}
.close-popup-button img{
    width: 100%;
}
.popupimg{
    width: 100%;
}


.content{
    width: 100%;
    max-width: 75.5%;
    margin-right: auto;
    margin-left: auto;
    position:relative;
    overflow:hidden;
    }
.content2{
    width: 100%;
    max-width: 100%;
    margin-right: auto;
    margin-left: auto;
    position:relative;
    overflow:hidden;
    }

.lightbox { display: none; }

	
.cl_box{
    background: url(../img/002.jpg) no-repeat;
    background-size: 100% auto;
    background-position: center top;
    padding: 3% 0;
    }
	
.cl_box a{ color:#FFF;}

.sp{ display:none;}

.scroll{ display:none;}
.mfrom {
    width: 100%;
    /* text-align: center; */
    outline: 0;
    border: #231815 2px solid;
    color: #a6a8a8;
    font-size: 1.4vw;
    margin: 0 auto 5% auto;
    padding: 1.5% 3%;
}

.pc{ display:block;}
.sp{ display:none;}
.floating_btn {
    position: fixed;
    bottom: 5%;
    right: 2%;
    z-index: 10;
    width: 14.78%;
}
.floating_btn a {
    display: block;
}
.floating_btn img{ width:100%;}


.p1{
	background: #fff;
	position: relative;
	height: auto;
	margin: 0 0 0 0;
	border-radius: 0;
	overflow: hidden;
	}
.p1:before{
    content: "";
    display: block;
    padding-top: 150%; /* 1:1 */
    }

.p1h{
    height:auto;
    padding: 0;
    position: absolute;
    top: 0;
    left: 0;
    right:0;
    width: 100%;
    height: 100%;
    margin:0 auto;
    }

.p2{position:relative;height: auto;margin: 0 0 0 0;background-color: #C80000;}
.p2:before{
    content: "";
    display: block;
     /* 1:1 */
    }
.p2h{
    }

.p3{
	position:
	relative;
	height: auto;
	margin: 0 0 0% 0;
	z-index: 0;
	}
.p3:before{
    content: "";
    display: block;
     /* 1:1 */
    }

.p3h{
    }

.p4{
	background: #C80000;
	position:relative;
	height: auto;
	margin: 0 0 0 0;
	z-index: 0;
	}
.p4:before{
    content: "";
    display: block;
    }

.p4h{
    height:auto;
    padding: 0;
    position: relative;
    top: 0;
    left: 0;
    right:0;
    width: 100%;
    height: 100%;
    margin:0 auto;
    }

    .p5{
        background: #FFF0EE;
        position:relative;
        height: auto;
        margin: 0 0 0 0;
        z-index: 0;
        }
    .p5:before{
        content: "";
        display: block;
        }
    .p5h{
        height:auto;
        padding: 0;
        position: relative;
        top: 0;
        left: 0;
        right:0;
        width: 100%;
        height: 100%;
        margin:0 auto;
        }

        .p6{
            background: #fff;
            position:
            relative;
            height: auto;
            margin: 0 0 0% 0;
            z-index: 0;
            }
        .p6:before{
            content: "";
            display: block;
            }
        .p6h{
            height:auto;
            padding: 0;
            position: relative;
            top: 0;
            left: 0;
            right:0;
            width: 100%;
            height: 100%;
            margin:0 auto;
            }
.p7{
	background: #C80000;
	position:relative;
	height: auto;
	margin: 0 0 0 0;
	z-index: 0;
	}
.p7:before{
    content: "";
    display: block;
    }

.p7h{
    height:auto;
    padding: 0;
    position: relative;
    top: 0;
    left: 0;
    right:0;
    width: 100%;
    height: 100%;
    margin:0 auto;
    }

.p8{
	background: #FFF0EE;
	position:relative;
	height: auto;
	margin: 0 0 0 0;
	z-index: 0;
	}
.p8:before{
    content: "";
    display: block;
    }

.p8h{
    height:auto;
    padding: 0;
    position: relative;
    top: 0;
    left: 0;
    right:0;
    width: 100%;
    height: 100%;
    margin:0 auto;
    }

.p9{
	background: #C80000;
	position:relative;
	height: auto;
	margin: 0 0 0 0;
	z-index: 0;
	}
.p9:before{
    content: "";
    display: block;
    }

.p9h{
    height:auto;
    padding: 0;
    position: relative;
    top: 0;
    left: 0;
    right:0;
    width: 100%;
    height: 100%;
    margin:0 auto;
    }

.p10{
	background: #fff;
	position:relative;
	height: auto;
	margin: 0 0 0 0;
	z-index: 0;
	}
.p10:before{
    content: "";
    display: block;
    }

.p10h{
    height:auto;
    padding: 0;
    position: relative;
    top: 0;
    left: 0;
    right:0;
    width: 100%;
    height: 100%;
    margin:0 auto;
    }

.p11{
	background: url(../img/p11_bg.png) no-repeat;
	background-size: 100% auto;
	background-position: center top;
	position:relative;
	height: auto;
	margin: -0.2% 0 0 0;
	z-index: 0;
	}
.p11:before{
    content: "";
    display: block;
    }

.p11h{
    height:auto;
    padding: 0;
    position: relative;
    top: 0;
    left: 0;
    right:0;
    width: 100%;
    height: 100%;
    margin:0 auto;
    }

.p12{
	background: #C80000;
	position:relative;
	height: auto;
	margin: 0 0 0 0;
	z-index: 0;
	}
.p12:before{
    content: "";
    display: block;
    }

.p12h{
    height:auto;
    padding: 0;
    position: relative;
    top: 0;
    left: 0;
    right:0;
    width: 100%;
    height: 100%;
    margin:0 auto;
    }

.p13{
	background: #fff;
	position:relative;
	height: auto;
	margin: 0 0 0 0;
	z-index: 0;
	}
.p13:before{
    content: "";
    display: block;
    }

.p13h{
    height:auto;
    padding: 0;
    position: relative;
    top: 0;
    left: 0;
    right:0;
    width: 100%;
    height: 100%;
    margin:0 auto;
    }

.p1 img,.p2 img,.p3 img,.p4 img,.p5 img,.p6 img,.p7 img,.p8 img,.p9 img,.p10 img,.p11 img,.p12 img,.p13 img,.p14 img,.p15 img,.p16 img,.p17 img,.p18 img,.p19 img,.p20 img,.p21 img,.p22 img,.p23 img,.t1 img,.w01 img,.t2 img,.t3 img,.t4 img,.t5 img,.t6 img,.t7 img,.t8 img,.p21 img,.p22 img,.p23 img,.p24 img,.p25 img,.p26 img{ width:100%;}
.addFriend input{ width:100%;}

.sp_box{
    max-width: 425px;
    margin: 0 auto;
    left: 0;
    position: relative;
    z-index: 10;
    background: #FFF;
    filter: drop-shadow(0px 0px 28px rgba(0,0,0,0.2));
}
.pc_logo{
    margin: 0 auto 20px;
    max-width: 300px;
}
.pc_line_btn{
    margin: 0 0 21% 0;
}
.pc_side{
    position: fixed;
    /* overflow-y: scroll; */
    bottom: 70px;
    right: calc((100% - 1210px) / 2);
    z-index: 999;
    height: max-content;
    max-height: 942px;
    width: 340px;
}
.pc_side img{ width: 100%;}
.pc_foot_bg{
    width: 100%;
    height: 10%;
    background: #C80000;
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    margin: 0 auto;
}
.pc_footer{
    position: fixed;
    bottom: 0;
    width: 593px;
    height: 10%;
    right: calc((100% - 1610px) / 2);
    display: flex;
    align-items: center;
    justify-content: flex-start;
}
.pc_footer img{ width: 100%;}
.pc_footer .pc_face{
    position: absolute;
    bottom: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    right: 0;
    width: 185px;
    margin: 0 auto;
}
.pc_footer .pc_cp{
    max-width: 250px;
    margin: 0 0 0 97px;
}
.pc_footer_txt{
    display: flex;
    height: auto;
    min-height: 100vh;
    position: fixed;
    width: 100%;
}
        #fixedImagesContainer {
            position: fixed;
            bottom: -2%;
            left: 0;
            width: 107%; /* 余白を含めて 200% + 5% + 5% */
            overflow: hidden;
            opacity: 0.3;
        }

        .scrolling-images {
            white-space: nowrap;
            animation: scrollImages 20s linear infinite; /* 20s はアニメーションの時間を示しており、必要に応じて変更してください */
        }

        .scrolling-images img {
            width: 45%; /* 幅を半分に設定 */
            height: auto;
            display: inline-block;
            margin-right: 2%; /* 右に5%の余白を設定 */
        }

        @keyframes scrollImages {
            0% {
                transform: translateX(0%);
            }
            100% {
                transform: translateX(-50%);
            }
        }

.short-move[data-aos="fade-up"] {
  transform: translateY(8px);
}
.short-move[data-aos="fade-up"].aos-animate {
  transform: translateY(0);
}
[data-aos="fade-up-small"] {
  opacity: 0;
  transform: translateY(30px); /* デフォルト50px → 控えめに12px */
  transition-property: transform, opacity;
}

[data-aos="fade-up-small"].aos-animate {
  opacity: 1;
  transform: translateY(0);
}

[data-aos="fade-up-ssmall"] {
  opacity: 0;
  transform: translateY(10px); /* デフォルト50px → 控えめに12px */
  transition-property: transform, opacity;
}

[data-aos="fade-up-ssmall"].aos-animate {
  opacity: 1;
  transform: translateY(0);
}

[data-aos="fade-down-small"] {
  opacity: 0;
  transform: translateY(-12px); /* 上から12pxだけ下がってくる */
  transition-property: transform, opacity;
}

[data-aos="fade-down-small"].aos-animate {
  opacity: 1;
  transform: translateY(0);
}
[data-aos="fade-right-small"] {
  opacity: 0;
  transform: translateX(-30px); /* 左から12pxだけスライド */
  transition-property: transform, opacity;
}

[data-aos="fade-right-small"].aos-animate {
  opacity: 1;
  transform: translateX(0);
}

[data-aos="fade-right-ssmall"] {
  opacity: 0;
  transform: translateX(-10px); /* 左から12pxだけスライド */
  transition-property: transform, opacity;
}

[data-aos="fade-right-ssmall"].aos-animate {
  opacity: 1;
  transform: translateX(0);
}


[data-aos="fade-left-small"] {
  opacity: 0;
  transform: translateX(30px); /* 右から12pxだけスライド */
  transition-property: transform, opacity;
}
[data-aos="fade-left-small"].aos-animate {
  opacity: 1;
  transform: translateX(0);
}

[data-aos="fade-left-ssmall"] {
  opacity: 0;
  transform: translateX(10px); /* 右から12pxだけスライド */
  transition-property: transform, opacity;
}

[data-aos="fade-left-ssmall"].aos-animate {
  opacity: 1;
  transform: translateX(0);
}

[data-aos="zoom-in-right-small"] {
  opacity: 0;
  transform: translateX(-20px) scale(0.65); /* 少し左＋少し縮小から始まる */
  transition-property: transform, opacity;
}

[data-aos="zoom-in-right-small"].marker-animate {
  opacity: 1;
  transform: translateX(0) scale(1);
}

[data-aos="zoom-out-right-small"] {
  opacity: 0;
  transform: translateX(-12px) scale(1.05); /* 少し左＋少し拡大からスタート */
  transition-property: transform, opacity;
}

[data-aos="zoom-out-right-small"].aos-animate {
  opacity: 1;
  transform: translateX(0) scale(1);
}

li.p2.hold-p2 [data-aos] {
  /* AOSがaos-animateを付けても、表示を固定して止める */
  opacity: 0 !important;
  transform: translate3d(0, 20px, 0) !important; /* fade-up想定の初期位置 */
  pointer-events: none;
}

/* （任意）AOSより先に初期化したいなら transition を明示 */
li.p2 [data-aos] {
  transition-property: opacity, transform;
  transition-duration: .8ss;
  transition-timing-function: ease-out;
}
.num {font-weight: 700;font-size: clamp(36px, 6vw, 53px);line-height: 1;text-align: left;color: #000000;margin: 0 0 0 5%;}
.unit { margin-left: .15em; font-weight: 700; }
.percent {font-weight: 700;font-size: 21px;line-height : 32.9px;color : #46C24E;margin-top: -4%;}
.percent_2{
    color: #B88E5A;
}
.b_01_bg{
    position: relative;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    overflow: hidden;
}
.b_01_bg img {
  width: 100%;
  height: auto;
  opacity: 1;
  transition: opacity 1.5s ease-in-out;
  position: absolute;
  top: 0;
  left: 0;
}
.box_01{
    position: absolute;
    top: 10%;
    left: 0;
    right: 0;
    margin: 0 auto;
    max-width: 297px;
}
.b_01_list{
    max-width: 290px;
    width: 98%;
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.b_02{
    position: absolute;
    bottom: 4.1%;
    left: 0;
    right: 0;
    margin: 0 auto;
    max-width: 288px;
}
.b_03{
    max-width: 372px;
    width: 88%;
    margin: 5.5% auto 2.5%;
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.b_03 div{width: 47.7%;}
.b_04{
    width: 91%;
    position: relative;
    margin: 0 auto 14%;
}
.b_04_list{
    position: absolute;
    top: 13%;
    left: 6%;
    width: 70%;
    z-index: 5;
}
.b_04_list_img{
    margin-bottom: 2.4%;
}
.button{}
.b_05{
    background: #FFFFFF;
    border-radius: 14px;
    width: 90.1%;
    margin: -7% auto 14%;
    position: relative;
    z-index: 10;
    padding: 12.0% 5% 10.7%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-flow: column;
    overflow: hidden;
}
.arrow{
    width: 9%;
    margin: 8.5% 0 0%;
}
.b_05_list{}
.b_05_list div{
}
.b_05_block{position: relative;}
.b_05_img{
    width: 96.5%;
}
.b_05_inner{
    background: #B88E5A;
    width: 112%;
}
.b_05_label{
    width: 96.5%;
}

.b_06{}
.b_06_list{
    position: relative;
    width: 90.2%;
    background: #FCF8E7;
    border-radius : 21px;
    margin: 0 auto 11.5%;
    padding: 7% 5.5% 8.75%;
}
.b_06_list_label{
    width: 30%;
    position: absolute;
    top: -0.5%;
}
.b_06_list_title{
    width: 100%;
}
.b_06_list_text{
    width: 99%;
    margin: 7% auto 0;
}
.b_07{}
.b_07_list{
    position: relative;
    width: 90.5%;
    background: #FFFFFF;
    border-radius : 21px;
    margin: 0 auto 11.5%;
    padding: 10% 4.8% 5.8%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-flow: column;
}
.b_07_label{
    width: 34%;
    margin: 0 auto;
    position: absolute;
    top: -2.5%;
    left: 0;
    right: 0;
}
.b_07_text{
    margin-top: 8%;
}
.b_08{}
.b_08_list{
    background: #FFFFFF;
    border-radius : 22px;
    width: 90.5%;
    margin: 0 auto 6.5%;
    padding: 5.2% 4.8% 6.7% 5.5%;
    display: flex;
    justify-content: center;
    flex-flow: column;
    position: relative;
}
.b_08_data{
    position: relative;
    width: 100%;
}
.b_08_data_02{
    position: relative;
    width: 100%;
}
.b_08_circle{width: 69.7%;margin: 9% auto 0;position:relative;}

.donut237{ width:100%; height:auto; transform:rotate(-90deg); }  /* 12時開始 */

.track,.progress{ fill:none; stroke-linecap:butt; stroke-width:36.46px; }
.track{   stroke:#c6c6c6; }
.progress{
  stroke:#46c24e;
  stroke-dasharray:100;     /* pathLength=100 → %管理 */
  stroke-dashoffset:100;    /* 初期は非表示 */
  transition:stroke-dashoffset 1.6s ease-out;
}
/* 色は変数から描画するように */
.track   { stroke: var(--track); }
.progress{ stroke: var(--ring);  }
.inner{ fill:#fff; }

/* ▼ 白い境界線：小さな白ダッシュを円周に配置して“線”に見せる */
.separator{
  fill:none;
  stroke:#fff;
  stroke-linecap:butt;
  stroke-width:36.46px;      /* ← リング幅と同じにして“内外端まで”届かせる */
  --sep: .6;                 /* ← 白線の長さ（%）。1.6〜2.2で微調整 */
  stroke-dasharray: var(--sep) calc(100 - var(--sep));
  stroke-dashoffset: 100;
  transition: stroke-dashoffset 1.6s ease-out;
}
.sep-start{ stroke-dashoffset: 0; transition: none; } /* 12時側は固定 */


.b_08_data_inner{
    position: absolute;
    width: 32.8%;
    margin: 0 auto;
    top: 47%;
    left: 0;
    right: 0;
}
.b_08_data_inner_2{
    width: 37.5%;
    top: 51%;
    left: 2%;
}
.b_08_data_item{position: relative;}
.b_08_data_02 .b_08_data_item{
    position: absolute;
    top: 4%;
    left: 14.5%;
    width: 26.8%;
}

.b_08 .b_08_list:nth-child(odd) .b_08_data .b_08_data_inner{
    top: 39%;
}

.b_08_data_item {
  position: relative;
  display: inline-block;
  width: fit-content;
  text-align: right;  /* 数字本体を右寄せ */
  left: -10%;
}

/* 数字本体 */
.num {
  margin: 0;
  line-height: 1;
  text-align: right;
}

.countup {
  display: inline-block;
  text-align: right;
  font-variant-numeric: tabular-nums;
  font-feature-settings: "tnum" 1, "lnum" 1;
  min-width: 3ch;
}

/* 名画像を右端に固定する（数字の右側にピタッと来る） */
.e77 {
  position: absolute;
  top: 27%;      /* 元の指定維持 */
  right: 0;      /* 数字の右端に揃える */
  width: 40%;    /* 元の指定維持 */
  transform: translateX(100%); /* 数字の右横に配置 */
}

.e79, .e80, .e81,
.e89, .e90, .e91, .e92 {
  opacity: 0;
  transform: translateY(10px) scale(.96);
  transition: opacity .45s ease, transform .45s ease;
}

.e79.is-revealed, .e80.is-revealed, .e81.is-revealed,
.e89.is-revealed, .e90.is-revealed, .e91.is-revealed, .e92.is-revealed {
  opacity: 1;
  transform: none;
}

/* 棒（画像）が下から伸びる */
.e95 img, .e98 img, .e100 img {
  display: block;
  transform-origin: bottom center;
  transform: scaleY(0);
   transition: transform .8s cubic-bezier(.2,.8,.2,1);
  will-change: transform;
}

/* 伸びた状態 */
.e95.is-rise img,
.e98.is-rise img,
.e100.is-rise img {
  transform: scaleY(1);
}

/* 共通のラベルアニメーション */
.e96, .e99, .e101 {
  opacity: 0;
  transform: translateY(8px);
  transition: opacity .4s ease, transform .4s ease;
  will-change: opacity, transform;
}

/* 他ラベルは通常 */
.e96.is-revealed,.e99.is-revealed, .e101.is-revealed {
  opacity: 1;
  transform: none;
}
/* ベース：レイヤー化＆合成安定 */
.e96{
  transform-origin: center;
  opacity: 0;
  transform: scale(.82) translateZ(0); /* ← translate をやめ、Zだけ付けて合成安定 */
  will-change: transform, opacity;
  backface-visibility: hidden;
  transform-origin: 50% 52%;
}

/* 出現：1本の滑らかイージング。translateは使わない */
.e96.is-revealed{
  animation: popSmooth .9s cubic-bezier(.25,1,.3,1) both;
}

/* キーフレームは peak を1回だけ（中間保持なし） */
@keyframes popSmooth{
  0%   { opacity:0; transform: scale(.82); }
  50%  { opacity:1; transform: scale(1.055); } /* 小さめオーバーシュート（にゅっ） */
  100% { opacity:1; transform: scale(1); }
}

/* 念のため img 側もブロック化してガタつきを防止 */
.e96 img{
  display:block;
  transform: translateZ(0);
  backface-visibility: hidden;
}

/* 初期：少しだけ下に置いておく（ズームは無し） */
.e104_2{
  opacity: 0;
  transform: translateY(10px);
  will-change: transform, opacity;
}
.e104_2 img{ display:block; }

/* 発火：フェードアップ＋ほんの少しの加速感（ズームしない） */
.e104_2.is-pop{
  animation: fadeUpSlight .7s cubic-bezier(.22,1,.28,1) both var(--e104-delay, 0ms);
}

@keyframes fadeUpSlight{
  0%   { opacity: 0; transform: translateY(10px); }
  60%  { opacity: 1; transform: translateY(0); }   /* ここで着地 */
  100% { opacity: 1; transform: translateY(0); }   /* 余韻のみ */
}

/* 省エネ対応 */
@media (prefers-reduced-motion: reduce){
  .e104_2{ opacity:1 !important; transform:none !important; animation:none !important; }
}

.b_09{}
.b_09_list{
    position: relative;
    width: 90.5%;
    background: #FFFFFF;
    border-radius : 14px;
    margin: 0 auto 18.5%;
    padding: 18.5% 4% 9.5% 5.5%;
    display: flex;
    justify-content: center;
    flex-flow: column;
}
.b_09 .b_09_list:nth-child(6){
    margin: 0 auto 4.5%;
}
.b_09_icon{
    width: 31.5%;
    margin: 0 auto;
    position: absolute;
    top: -9%;
    left: 0;
    right: 0;
}
.b_09_name{
    width: 67.5%;
    margin: 0 auto 11.5%;
}
.b_09_date{
    position: relative;
}
.b_09_date_bg{
    position: relative;
    width: 94.5%;
    margin: 0 auto 5%;
}
.b_09_tag{
    width: 24%;
    position: absolute;
    bottom: 0;
    left: 19%;
}
.b_09_tag_02{
    width: 10.7%;
    /* height: 14.75px; */
    position: absolute;
    bottom: 0;
    right: 21%;
}
.b_09_chart{
    width: 31.9%;
    position: absolute;
    bottom: 13%;
    left: 16%;
}
.b_09_chart_02{
    width: 31.9%;
    position: absolute;
    bottom: 13%;
    left: 55%;
}
.b_09_chart_value{
    width: 20%;
    position: absolute;
    top: 35%;
    left: 22.5%;
}
.b_09_chart_value_02{
    width: 37%;
    position: absolute;
    top: -8%;
    right: 11%;
}
.b_09_arrow{
    width: 18%;
    position: absolute;
    top: 10%;
    left: 31%;
}
.b_09 .b_09_list:nth-child(3) .b_09_arrow{
    top: 19%;
}
.b_09 .b_09_list:nth-child(4) .b_09_arrow{
    top: 25%;
}
.b_09 .b_09_list:nth-child(5) .b_09_arrow{
    top: 1%;
    left: 27%;
}
.b_09 .b_09_list:nth-child(6) .b_09_arrow{
    top: 11%;
    left: 27%;
}
.b_09 .b_09_list:nth-child(7) .b_09_arrow{}

.b_09_badge{
    width: 25%;
    position: absolute;
    top: 35%;
    right: 1%;
}
.b_09_text{}
.b_09_text_02{
    width: 97%;
}
.b_09_description{
    margin: 8% auto;
    width: 97%;
}
.b_09_arrow_02{
    width: 8%;
    margin: 4% auto 0;
}

/* ▼ 棒：伸びアニメーション */
.b_09_chart img,
.b_09_chart_02 img {
  transform-origin: bottom center;
  transform: scaleY(0);
  transition: transform 0.8s cubic-bezier(0.25, 1, 0.5, 1);
   will-change: transform;
  backface-visibility: hidden;
}
.b_09_chart.is-rise img,
.b_09_chart_02.is-rise img {
  transform: scaleY(1);
}
/* 棒②を“ぐいん”と勢い強め */
.b_09_chart_02 img{
  transition-duration: var(--bar2-dur, 1000ms);
  transition-timing-function: cubic-bezier(.15,1.25,.25,1.05);
}

/* ▼ ラベルふわっと（共通） */
.b_09_chart_value,
.b_09_chart_value_02{
  opacity: 0;
  transform: translateY(8px);
  transition: opacity .45s ease, transform .45s ease;
}
.b_09_chart_value.is-revealed,
.b_09_chart_value_02.is-revealed{
  opacity: 1;
  transform: none;
}
/* ▼ ラベル②：バン！→やさしく着地（モバイル最適化） */
.b_09_chart_value_02.is-revealed{
  transition: none;                     /* animationと競合させない */
  transform-origin: center center;
  will-change: transform, opacity;
  backface-visibility: hidden;
  transform: translateZ(0);
  animation: b09PopSmooth .68s both;    /* 少し短め＆スムーズ */
}

/* キーフレーム：成長→オーバーシュート→微アンダー→最終着地 */
@keyframes b09PopSmooth{
  /* 0→40%：素早く持ち上げる（加速） */
  0%   { opacity:0; transform:translate3d(0,10px,0) scale3d(.92,.92,1); animation-timing-function: cubic-bezier(.2,.9,.2,1.15); }
  40%  { opacity:1; transform:translate3d(0,0,0)   scale3d(1.055,1.055,1); }

  /* 40→72%：やや緩やかに縮める（減速） */
  72%  {              transform:translate3d(0,0,0)   scale3d(.998,.998,1); animation-timing-function: cubic-bezier(.17,.84,.24,1); }

  /* 72→100%：ほんの少しだけ戻してピタッと止める（柔らかい着地） */
  100% {              transform:translate3d(0,0,0)   scale3d(1,1,1); }
}

/* 追加の安定化（任意だが効果大） */
.b_09_chart_value_02 img{
  display:block;
  backface-visibility:hidden;
  transform: translateZ(0);
}
/* ▼ 矢印：下から右上へぐいんと伸びる */
.b_09_arrow {
  display: block;
  transform-origin: left bottom; /* ★ 基点を左下に設定 */
  transform: scale(0) rotate(12deg); /* 初期：小さくて少し傾ける */
  transition: transform var(--arrow-dur, 600ms) cubic-bezier(.18,1.1,.25,1.05);
  will-change: transform;
}
.b_09_arrow.is-shoot {
  transform: scale(1) rotate(0deg); /* 右上方向に“ぐいん” */
}


/* ▼ バッジ：ラベル②と同時にズームアウト */
.b_09_badge{
  opacity:0;
  transform:translateY(8px) scale(.8);
  transition:opacity .5s ease, transform .6s cubic-bezier(.2,1.1,.2,1);
}
.b_09_badge.is-pop{
  opacity:1;
  transform:translateY(0) scale(1);
}


.b_09_chart img,
.b_09_chart_02 img { display:block; }

.b_09_chart_value,
.b_09_chart_value_02{
  will-change: opacity, transform;
  backface-visibility: hidden;
}

/* --- 強制アニメON（省エネ設定でも棒と矢印を動かす） --- */
.force-motion .b_09_chart img,
.force-motion .b_09_chart_02 img {
  transform-origin: bottom center !important;
  transform: scaleY(0) !important;
  transition: transform 0.8s cubic-bezier(0.25, 1, 0.5, 1) !important;
  display: block; /* 安定化 */
  backface-visibility: hidden;
  will-change: transform;
}
.force-motion .b_09_chart_02 img {
  transition-duration: var(--bar2-dur, 1000ms) !important;
  transition-timing-function: cubic-bezier(.15,1.25,.25,1.05) !important;
}
.force-motion .b_09_chart.is-rise img,
.force-motion .b_09_chart_02.is-rise img {
  transform: scaleY(1) !important;
}

/* 矢印も省エネ時に止まらないように（必要なら） */
.force-motion .b_09_arrow {
  transform-origin: left bottom !important;
  transition: transform var(--arrow-dur, 600ms) cubic-bezier(.18,1.1,.25,1.05) !important;
}
.force-motion .b_09_arrow.is-shoot { transform: scale(1) rotate(0deg) !important; }
.gold_back{
    position: relative;
    width: 100%;
}

.s1{
    width: 60.8%;
    margin: 4% auto 6%;
}
.s2{
    width: 66%;
    margin: 5.5% auto 3.7%;
}
.s3{}
.s4{
    width: 95%;
    margin: 6% 0 15%;
}
.s5{}

.e1{
    width: 99.5%;
}
.e2{
    width: 100%;
    margin: 3% auto 3.5%;
}
.e3{
    max-width: 123px;
    width: 42.5%;
}
.e4{
    max-width: 152px;
    width: 52.5%;
}
.e5{
    width: 100%;
    margin: 0 auto 3.4%;
}
.e6{
    width: 100%;
}
.e7{}
.e8{}
.e9{
    width: 66.4%;
    margin: 0 auto;
}
.e10{
    margin: 13% auto 7%;
    width: 58.5%;
}
.e11{
    position: relative;
    width: 100%;
    margin: 0 auto;
}
.e12{
    width: 35.7%;
    position: absolute;
    top: -11%;
    right: 1%;
    z-index: 10;
}
.e13{
    width: 6%;
    position: absolute;
    top: -14%;
    right: 5%;
}
.e14{}
.e15{}
.e16{}
.e17{}
.e18{}
.e19{
    width: 31%;
    margin: 6% auto 2.5%;
}
.e20{
    width: 69%;
    margin: 0 auto 4.3%;
}
.e21{
    width: 54%;
    margin: 8% auto 0;
}
.e22{
    width: 70%;
    margin: 3.5% auto 5%;
}
.e23{
    width: 42%;
    margin: 0 auto;
}
.e24{
    position: relative;
    width: 42.5%;
    margin: 0% auto 0;
}
.e24_left{
    position: absolute;
    top: 8.4%;
    left: 4%;
    width: 32%;
}
.e24_right{position: absolute;top: 8.8%;right: 5%;width: 32%;}
.e25{
    width: 93.5%;
}
.e26{
    width: 89.75%;
}
.e27{}
.e28{}
.e29{
    width: 96.5%;
    margin: 16% 0 9%;
}
.e30{
    width: 92.5%;
    margin: 6% 0 9%;
}
.e31{
    margin: 0 0 10%;
}
.e32{
    width: 78%;
    margin: 0 auto 3%;
}
.e33{
    width: 23%;
    margin: 13% auto 0;
}
.e34{
    width: 47%;
    margin: 2% auto 8%;
}
.e35{
    top: -4.5%;
}
.e36{}
.e37{
    position: absolute;
    top: -4.5%;
    right: 5%;
    width: 24%;
}
.e38{}
.e39{
    left: 41%;
    top: -3.5%;
}
.e40{}
.e41{
    width: 41%;
    position: absolute;
    top: 0%;
    left: -3%;
}
.e42{
    width: 6.6%;
    position: absolute;
    top: 0;
    left: 7%;
}
.e43{
    width: 3%;
    position: absolute;
    top: 11%;
    left: 13%;
}
.e44{
    width: 3%;
    position: absolute;
    top: 1%;
    left: 27%;
}
.e45{}
.e46{
    top: -3.5%;
}
.e47{}
.e48{
    width: 33%;
    position: absolute;
    top: -5.2%;
    right: 8.2%;
}
.e49{
    width: 1.5%;
    position: absolute;
    top: -1.7%;
    right: 18.2%;
}
.e50{
    width: 27%;
    position: absolute;
    top: -3%;
    right: 7.5%;
}
.e51{}
.e52{
    width: 69%;
    margin: 0 auto 6%;
}
.e53_wrap{
    width: 77.5%;
    position: relative;
    margin: 0 auto;
}
.e53_box{
    width: 100%;
    mix-blend-mode: multiply;
    margin: 14% auto 12%;
    position: relative;
    z-index: 15;
}
.e53{
    width: 80%;
    position: absolute;
    top: 21%;
    left: 0;
    right: 0;
    margin: auto;
    z-index: 20;
}
.e53_2{
    width: 71.5%;
    margin: 0 auto 13%;
}
.e54{}
.e55{
    position: relative;
    width: 69%;
}
.e55_2{

width: 12.5%;

position: absolute;

top: 7%;

right: 11%;
}
.e56{
    width: 93%;
    margin: 7.5% 0;
}
.e57{
    width: 79%;
}
.e58{}
.e59{}
.e60_wrap{
    width: 96%;
    position: relative;
    margin: 0 auto;
}
.e60{
    width: 88.5%;
    margin: 0 auto;
}
.e60_2{
    position: absolute;
    width: 24.8%;
    top: -4%;
    left: 10%;
}
.e60_3{
    position: absolute;
    width: 19.5%;
    top: 51%;
    right: 2%;
}
.e60_4{
    position: absolute;
    width: 18.5%;
    top: 3%;
    right: -1%;
}
.e60_5{
    position: absolute;
    top: 53%;
    left: -4%;
    width: 17.9%;
}

/* 上下ふわふわアニメーション */
@keyframes fluffy1 {
  0%   { transform: translateY(0); }
  50%  { transform: translateY(7px); }
  100% { transform: translateY(0); }
}

@keyframes fluffy2 {
  0%   { transform: translateY(0); }
  50%  { transform: translateY(-5px); }
  100% { transform: translateY(0); }
}

@keyframes fluffy3 {
  0%   { transform: translateY(0); }
  50%  { transform: translateY(8px); }
  100% { transform: translateY(0); }
}

/* ふわふわ設定：それぞれ少しずつズラす */
.e60 img {
  animation: fluffy1 3s ease-in-out .2s infinite alternate;
}

.e60_2 img {
  animation: fluffy2 3.4s ease-in-out .5s infinite alternate;
}

.e60_3 img {
  animation: fluffy3 3.8s ease-in-out .9s infinite alternate;
}

.e61{
    width: 75%;
    margin: 8% 0 7%;
}
.e62{
    width: 78%;
}
.e63{}
.e64{}
.e65{
    width: 64.5%;
    position: relative;
    left: -12%;
}
.e65_2{
    width: 22.5%;
    position: absolute;
    top: 7%;
    right: 7%;
}
.e65_3{
    width: 18%;
    position: absolute;
    top: 22%;
    right: 10%;
}
.e66{
    width: 76%;
    margin: 8% 0 7%;
}
.e67{
    width: 80.5%;
}
.e68{}
.e69{
    width: 68.5%;
    margin: 15% auto 7.5%;
}
.e70{
    width: 65.5%;
    margin: 0 auto 15%;
}
.e71{
    width: 64%;
    margin: 14% auto 10%;
}
.e72{}
.e73{}
.e74{
    position: absolute;
    top: 27%;
    left: 10%;
    width: 36%;
}
.e75{
    width: 78%;
    margin: 0 auto;
}
.e76{}
.e77{
}
.e78{
    width: 68%;
    margin: -3% auto 0;
}
.e79{
    width: 21%;
    position: absolute;
    top: 28%;
    right: 4%;
}
.e80{
    width: 16%;
    top: 70%;
    left: 4.5%;
    position: absolute;
}
.e81{
    width: 18.5%;
    position: absolute;
    right: 3.8%;
    top: 76%;
}
.e82{
    width: 63%;
    position: relative;
    left: 0;
}
.e83{}
.e84{
    width: 39%;
    position: absolute;
    top: 27.5%;
    left: 8%;
}
.e85{
    width: 58%;
    margin: 0 auto;
}
.e86{}
.e87{
    margin-top: 13%;
}
.e88{
    width: 68%;
    margin: -3% auto 0;
}
.e89{
    width: 17%;
    position: absolute;
    top: 22%;
    right: 12%;
}
.e90{
    width: 27%;
    position: absolute;
    top: 7%;
    right: 6%;
}
.e91{
    width: 17%;
    position: absolute;
    bottom: 11%;
    right: 4%;
}
.e92{
    width: 14%;
    position: absolute;
    left: 7.5%;
    bottom: 9%;
}
.e93{
    width: 81%;
}
.e94{
    width: 98.5%;
    margin: 8% auto 11%;
    position: relative;
}
.e95{width: 23.2%;position: absolute;bottom: 16%;left: 15.7%;}
.e96{}
.e97{
    margin-top: 12%;
}
.e98{
    width: 23.2%;
    position: absolute;
    bottom: 16%;
    left: 44%;
}
.e99{
    width: 16%;
    position: absolute;
    top: 64%;
    left: 48.4%;
}
.e100{
    width: 23.2%;
    position: absolute;
    bottom: 16%;
    right: 5%;
}
.e101{
    width: 11%;
    position: absolute;
    top: 68%;
    right: 10%;
}
.e102{
    position: absolute;
    width: 16%;
    bottom: 0;
    left: 19%;
}
.e103{
    width: 21.5%;
    position: absolute;
    bottom: 0;
    left: 45%;
}
.e104{
    width: 15%;
    position: absolute;
    bottom: 0;
    right: 9%;
}
.e104_2{
    width: 54%;
    position: absolute;
    top: 4%;
    right: 0;
}
.e105{
    width: 71%;
    position: relative;
    left: 5.5%;
}

.e106_wrap {
  position: relative;
  width: 100%;
}
.e106 {
  position: relative;
  width: 90%;
  margin: 6.5% auto 12%;
}
.e106_2 img{position: relative; z-index: 100;}
.e106_2 {
  width: 27.5%;
  position: absolute;
  top: 64%;
  left: 51%;
}

/* マーカー */
.e106_2::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 10px;
  background: #FFD300;
  border-radius: 3px;
  transform-origin: left center;
  transform: scaleX(0);
  transition: transform 1.6s cubic-bezier(.22,1,.36,1);
  z-index: 2;
}

.e106_2.active::after {
  transform: scaleX(1);
}


.e107{
    width: 34.5%;
    margin: 8.4% auto 19%;
}
.e108{}
.e109{}
.e110{}
.e111{}
.e112{}
.e113{}
.e114{}
.e115{}
.e116{
    width: 14.72%;
}
.e117{}
.e118{}
.e119{}
.e120{}
.e121{}
.e122{}
.e123{
    width: 79%;
}
.e124{}
.e125{}
.e126{}
.e127{
    top: 44%;
}
.e128{
    width: 15%;
}
.e129{}
.e130{
    width: 35%;
    top: -17%;
}
.e131{}
.e132{}
.e133{}
.e134{}
.e135{}
.e136{
    width: 79%;
    margin: 0 auto 12.0%;
}
.e137{}
.e138{}
.e139{
    width: 24.5%;
    top: 49%;
    left: 21%;
}
.e140{
    width: 14.52%;
}
.e141{}
.e142{
    width: 46%;
    top: -12%;
    right: 6.5%;
}
.e143{}
.e144{}
.e145{}
.e146{}
.e147{}
.e148{
    width: 91%;
}
.e149{}
.e150{}
.e151{
    width: 24.5%;
    top: 24%;
    left: 20%;
}
.e152{
    width: 15.15%;
}
.e153{}
.e154{
    width: 44.2%;
    top: -12%;
    right: 6%;
}
.e155{}
.e156{}
.e157{}
.e158{}
.e159{}
.e160{
    width: 91.3%;
}
.e161{}
.e162{}
.e163{
    width: 29%;
    left: 18%;
    top: 36%;
}
.e164{
    width: 11.43%;
}
.e165{}
.e166{
    width: 43%;
    right: 7%;
}
.e167{}
.e168{}
.e169{}
.e170{}
.e171{
    margin-bottom: 15%;
    width: 77%;
    position: relative;
    left: 6%;
}
.e172{
    position: absolute;
    width: 78%;
    top: 7%;
    left: 0;
    right: 0;
    margin: 0 auto;
}
.e173{
    width: 93%;
    margin: 2.5% auto 3%;
}
.e174{
    width: 61%;
    margin: 6% auto 3.5%;
}
.e175{
    width: 69%;
    margin: 0 auto 6%;
}
.e176{
    margin: 12.5% 0 8%;
}
.e177{width: 61%;}
.e178{
    margin: 6% 0 5.5%;
    width: 85%;
}
.e179{
    width: 76%;
}
.e180{
    margin-top: 8%;
    width: 56.5%;
    position: relative;
    left: 2%;
}
.e181{
    position: absolute;
    top: 0;
    right: -6%;
    width: 47%;
}
.e182{
    width: 82%;
    margin: 7% auto 15%;
}
.e183{}
.e184{
    width: 96%;
    margin: 5% auto 19.5%;
    position: relative;
}
.e184_2{
    width: 9%;
    margin: 0;
    position: absolute;
    top: 25.2%;
    left: 5.0%;
}
.e185{
    width: 30.5%;
    position: absolute;
    bottom: -1%;
    right: 7.5%;
}

.cl{background: #C80000;color: #fff;padding: 7.7485% 0;}
.f_menu{}
.f_Copyright{
            text-align: center;
            margin: 0 auto;
            letter-spacing: 0.1em;
            font-size: 10px;
}
.footer{
    padding: 0% 0 0%;
}
.foot_menu{
    margin: 0 0 3% 0;
}
.foot_menu ul{
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    text-align: center;
}
.foot_menu li{
    margin: 0 2% 0 0;
}
.foot_menu li:not(:last-child)::after {
  content: "|";
  color: #fff;
  opacity: 0.8;
  font-size: 14px;
  margin-left: 8px;
}
.foot_menu a{
    color: #fff;
    font-size: 11px;
    text-decoration: none;
}
.copy{
    color: rgb(255, 255, 255);
    opacity: 0.4;
    font-size: 12px;
}

.kiyaku_all{ padding: 20px 0;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    max-width: 480px;
    margin: 0 auto;}

.kiyaku_all a{ color:#FFF;}

.addFriend{
    width: 68%;
    margin: -1% auto 10% auto;
}

.info_send .addFriend { margin: 5% auto 5% auto;     width: 31.2%;}
input{ width:100%;}
.line_btn a{ display:block;}
.line_btn img,.line_btn input,.buy_btn img
	{
		animation:
			bounce 2s ease infinite normal 0s none running
		;
		-webkit-animation:
			bounce 2s ease infinite normal 0s none running
		;
		-ms-animation:
			bounce 2s ease infinite normal 0s none running
		;
	}
	@keyframes bounce {
		0%, 100%, 20%, 50%, 80% {
		    transform: scale(1.0);
		}
		40% {
		    transform: scale(1.2);
		}
		60% {
		    transform: scale(1.1);
		}
		
	}
	@-webkit-keyframes bounce {
		0%, 100%, 20%, 50%, 80% {
		    transform: scale(1.0);
		}
		40% {
		    transform: scale(1.2);
		}
		60% {
		    transform: scale(1.1);
		}
	}


.reflection.go {
  height: 100%;
  width: 8%;
  position: absolute;
  top: -56%;
  left: -3%;
  background-color: #fff;
  opacity     :0;
  transform: rotate(45deg);
  animation: reflection 2s ease-in-out ;
  -webkit-transform: rotate(45deg);
  -webkit-animation: reflection 2s ease-in-out ;
  -moz-transform: rotate(45deg);
  -moz-animation: reflection 2s ease-in-out ;
  -ms-transform: rotate(45deg);
  -ms-animation: reflection 2s ease-in-out ;
  -o-transform: rotate(45deg);
  -o-animation: reflection 2s ease-in-out ;
}


@keyframes reflection {
  0% { transform: scale(0) rotate(45deg); opacity: 0; }
  80% { transform: scale(0) rotate(45deg); opacity: 0.5; }
  81% { transform: scale(4) rotate(45deg); opacity: 1; }
  100% { transform: scale(50) rotate(45deg); opacity: 0; }
}
@-webkit-keyframes reflection {
  0% { -webkit-transform: scale(0) rotate(45deg); opacity: 0; }
  80% { -webkit-transform: scale(0) rotate(45deg); opacity: 0.5; }
  81% { -webkit-transform: scale(4) rotate(45deg); opacity: 1; }
  100% { -webkit-transform: scale(50) rotate(45deg); opacity: 0; }
}
@-moz-keyframes reflection {
  0% { -moz-transform: scale(0) rotate(45deg); opacity: 0; }
  80% { -moz-transform: scale(0) rotate(45deg); opacity: 0.5; }
  81% { -moz-transform: scale(4) rotate(45deg); opacity: 1; }
  100% { -moz-transform: scale(50) rotate(45deg); opacity: 0; }
}
@-ms-keyframes reflection {
  0% { -ms-transform: scale(0) rotate(45deg); opacity: 0; }
  80% { -ms-transform: scale(0) rotate(45deg); opacity: 0.5; }
  81% { -ms-transform: scale(4) rotate(45deg); opacity: 1; }
  100% { -ms-transform: scale(50) rotate(45deg); opacity: 0; }
}
@-o-keyframes reflection {
  0% { -o-transform: scale(0) rotate(45deg); opacity: 0; }
  80% { -o-transform: scale(0) rotate(45deg); opacity: 0.5; }
  81% { -o-transform: scale(4) rotate(45deg); opacity: 1; }
  100% { -o-transform: scale(50) rotate(45deg); opacity: 0; }
}


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



}


@media screen and ( max-width:768px )
{
	html{ overflow:auto;}
	body{ margin:0px; padding:0px; width:auto; background:none; overflow:hidden;}
.content{
max-width: 100%;
    }
	



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

.p1{
	background: #fff;
	position: relative;
	height: auto;
	margin: 0 0 0 0;
	border-radius: 0;
	overflow: hidden;
	}
.p1:before{
    content: "";
    display: block;
    padding-top: 150%; /* 1:1 */
    }

.p1h{
    height:auto;
    padding: 0;
    position: absolute;
    top: 0;
    left: 0;
    right:0;
    width: 100%;
    height: 100%;
    margin:0 auto;
    }

.p2{position:relative;height: auto;margin: 0 0 0 0;background-color: #C80000;}
.p2:before{
    content: "";
    display: block;
     /* 1:1 */
    }
.p2h{
    }

.p3{
	position:
	relative;
	height: auto;
	margin: 0 0 0% 0;
	z-index: 0;
	}
.p3:before{
    content: "";
    display: block;
     /* 1:1 */
    }

.p3h{
    }

.p4{
	background: #C80000;
	position:relative;
	height: auto;
	margin: 0 0 0 0;
	z-index: 0;
	}
.p4:before{
    content: "";
    display: block;
    }

.p4h{
    height:auto;
    padding: 0;
    position: relative;
    top: 0;
    left: 0;
    right:0;
    width: 100%;
    height: 100%;
    margin:0 auto;
    }

    .p5{
        background: #FFF0EE;
        position:relative;
        height: auto;
        margin: 0 0 0 0;
        z-index: 0;
        }
    .p5:before{
        content: "";
        display: block;
        }
    .p5h{
        height:auto;
        padding: 0;
        position: relative;
        top: 0;
        left: 0;
        right:0;
        width: 100%;
        height: 100%;
        margin:0 auto;
        }

        .p6{
            background: #fff;
            position:
            relative;
            height: auto;
            margin: 0 0 0% 0;
            z-index: 0;
            }
        .p6:before{
            content: "";
            display: block;
            }
        .p6h{
            height:auto;
            padding: 0;
            position: relative;
            top: 0;
            left: 0;
            right:0;
            width: 100%;
            height: 100%;
            margin:0 auto;
            }
.p7{
	background: #C80000;
	position:relative;
	height: auto;
	margin: 0 0 0 0;
	z-index: 0;
	}
.p7:before{
    content: "";
    display: block;
    }

.p7h{
    height:auto;
    padding: 0;
    position: relative;
    top: 0;
    left: 0;
    right:0;
    width: 100%;
    height: 100%;
    margin:0 auto;
    }

.p8{
	background: #FFF0EE;
	position:relative;
	height: auto;
	margin: 0 0 0 0;
	z-index: 0;
	}
.p8:before{
    content: "";
    display: block;
    }

.p8h{
    height:auto;
    padding: 0;
    position: relative;
    top: 0;
    left: 0;
    right:0;
    width: 100%;
    height: 100%;
    margin:0 auto;
    }

.p9{
	background: #C80000;
	position:relative;
	height: auto;
	margin: 0 0 0 0;
	z-index: 0;
	}
.p9:before{
    content: "";
    display: block;
    }

.p9h{
    height:auto;
    padding: 0;
    position: relative;
    top: 0;
    left: 0;
    right:0;
    width: 100%;
    height: 100%;
    margin:0 auto;
    }

.p10{
	background: #fff;
	position:relative;
	height: auto;
	margin: 0 0 0 0;
	z-index: 0;
	}
.p10:before{
    content: "";
    display: block;
    }

.p10h{
    height:auto;
    padding: 0;
    position: relative;
    top: 0;
    left: 0;
    right:0;
    width: 100%;
    height: 100%;
    margin:0 auto;
    }

.p11{
	background: url(../img/p11_bg.png) no-repeat;
	background-size: 100% auto;
	background-position: center top;
	position:relative;
	height: auto;
	margin: -0.2% 0 0 0;
	z-index: 0;
	}
.p11:before{
    content: "";
    display: block;
    }

.p11h{
    height:auto;
    padding: 0;
    position: relative;
    top: 0;
    left: 0;
    right:0;
    width: 100%;
    height: 100%;
    margin:0 auto;
    }

.p12{
	background: #C80000;
	position:relative;
	height: auto;
	margin: 0 0 0 0;
	z-index: 0;
	}
.p12:before{
    content: "";
    display: block;
    }

.p12h{
    height:auto;
    padding: 0;
    position: relative;
    top: 0;
    left: 0;
    right:0;
    width: 100%;
    height: 100%;
    margin:0 auto;
    }

.p13{
	background: #fff;
	position:relative;
	height: auto;
	margin: 0 0 0 0;
	z-index: 0;
	}
.p13:before{
    content: "";
    display: block;
    }

.p13h{
    height:auto;
    padding: 0;
    position: relative;
    top: 0;
    left: 0;
    right:0;
    width: 100%;
    height: 100%;
    margin:0 auto;
    }



.short-move[data-aos="fade-up"] {
  transform: translateY(8px);
}
.short-move[data-aos="fade-up"].aos-animate {
  transform: translateY(0);
}
[data-aos="fade-up-small"] {
  opacity: 0;
  transform: translateY(30px); /* デフォルト50px → 控えめに12px */
  transition-property: transform, opacity;
}

[data-aos="fade-up-small"].aos-animate {
  opacity: 1;
  transform: translateY(0);
}

[data-aos="fade-up-ssmall"] {
  opacity: 0;
  transform: translateY(10px); /* デフォルト50px → 控えめに12px */
  transition-property: transform, opacity;
}

[data-aos="fade-up-ssmall"].aos-animate {
  opacity: 1;
  transform: translateY(0);
}

[data-aos="fade-down-small"] {
  opacity: 0;
  transform: translateY(-12px); /* 上から12pxだけ下がってくる */
  transition-property: transform, opacity;
}

[data-aos="fade-down-small"].aos-animate {
  opacity: 1;
  transform: translateY(0);
}
[data-aos="fade-right-small"] {
  opacity: 0;
  transform: translateX(-30px); /* 左から12pxだけスライド */
  transition-property: transform, opacity;
}

[data-aos="fade-right-small"].aos-animate {
  opacity: 1;
  transform: translateX(0);
}

[data-aos="fade-right-ssmall"] {
  opacity: 0;
  transform: translateX(-10px); /* 左から12pxだけスライド */
  transition-property: transform, opacity;
}

[data-aos="fade-right-ssmall"].aos-animate {
  opacity: 1;
  transform: translateX(0);
}


[data-aos="fade-left-small"] {
  opacity: 0;
  transform: translateX(30px); /* 右から12pxだけスライド */
  transition-property: transform, opacity;
}
[data-aos="fade-left-small"].aos-animate {
  opacity: 1;
  transform: translateX(0);
}

[data-aos="fade-left-ssmall"] {
  opacity: 0;
  transform: translateX(10px); /* 右から12pxだけスライド */
  transition-property: transform, opacity;
}

[data-aos="fade-left-ssmall"].aos-animate {
  opacity: 1;
  transform: translateX(0);
}

[data-aos="zoom-in-right-small"] {
  opacity: 0;
  transform: translateX(-20px) scale(0.65); /* 少し左＋少し縮小から始まる */
  transition-property: transform, opacity;
}

[data-aos="zoom-in-right-small"].marker-animate {
  opacity: 1;
  transform: translateX(0) scale(1);
}

[data-aos="zoom-out-right-small"] {
  opacity: 0;
  transform: translateX(-12px) scale(1.05); /* 少し左＋少し拡大からスタート */
  transition-property: transform, opacity;
}

[data-aos="zoom-out-right-small"].aos-animate {
  opacity: 1;
  transform: translateX(0) scale(1);
}

li.p2.hold-p2 [data-aos] {
  /* AOSがaos-animateを付けても、表示を固定して止める */
  opacity: 0 !important;
  transform: translate3d(0, 20px, 0) !important; /* fade-up想定の初期位置 */
  pointer-events: none;
}

/* （任意）AOSより先に初期化したいなら transition を明示 */
li.p2 [data-aos] {
  transition-property: opacity, transform;
  transition-duration: .8ss;
  transition-timing-function: ease-out;
}
.num {font-weight: 700;font-size: clamp(36px, 6vw, 53px);line-height: 1;text-align: left;color: #000000;margin: 0 0 0 5%;}
.unit { margin-left: .15em; font-weight: 700; }
.percent {font-weight: 700;font-size: 21px;line-height : 32.9px;color : #46C24E;margin-top: -4%;}
.percent_2{
    color: #B88E5A;
}
.b_01_bg{
    position: relative;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    overflow: hidden;
}
.b_01_bg img {
  width: 100%;
  height: auto;
  opacity: 1;
  transition: opacity 1.5s ease-in-out;
  position: absolute;
  top: 0;
  left: 0;
}
.box_01{
    position: absolute;
    top: 10%;
    left: 0;
    right: 0;
    margin: 0 auto;
    max-width: 297px;
}
.b_01_list{
    max-width: 290px;
    width: 98%;
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.b_02{
    position: absolute;
    bottom: 4.1%;
    left: 0;
    right: 0;
    margin: 0 auto;
    max-width: 288px;
}
.b_03{
    max-width: 372px;
    width: 88%;
    margin: 5.5% auto 2.5%;
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.b_03 div{width: 47.7%;}
.b_04{
    width: 91%;
    position: relative;
    margin: 0 auto 14%;
}
.b_04_list{
    position: absolute;
    top: 13%;
    left: 6%;
    width: 70%;
    z-index: 5;
}
.b_04_list_img{
    margin-bottom: 2.4%;
}
.button{}
.b_05{
    background: #FFFFFF;
    border-radius: 14px;
    width: 90.1%;
    margin: -7% auto 14%;
    position: relative;
    z-index: 10;
    padding: 12.0% 5% 10.7%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-flow: column;
    overflow: hidden;
}
.arrow{
    width: 9%;
    margin: 8.5% 0 0%;
}
.b_05_list{}
.b_05_list div{
}
.b_05_block{position: relative;}
.b_05_img{
    width: 96.5%;
}
.b_05_inner{
    background: #B88E5A;
    width: 112%;
}
.b_05_label{
    width: 96.5%;
}

.b_06{}
.b_06_list{
    position: relative;
    width: 90.2%;
    background: #FCF8E7;
    border-radius : 21px;
    margin: 0 auto 11.5%;
    padding: 7% 5.5% 8.75%;
}
.b_06_list_label{
    width: 30%;
    position: absolute;
    top: -0.5%;
}
.b_06_list_title{
    width: 100%;
}
.b_06_list_text{
    width: 99%;
    margin: 7% auto 0;
}
.b_07{}
.b_07_list{
    position: relative;
    width: 90.5%;
    background: #FFFFFF;
    border-radius : 21px;
    margin: 0 auto 11.5%;
    padding: 10% 4.8% 5.8%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-flow: column;
}
.b_07_label{
    width: 34%;
    margin: 0 auto;
    position: absolute;
    top: -2.5%;
    left: 0;
    right: 0;
}
.b_07_text{
    margin-top: 8%;
}
.b_08{}
.b_08_list{
    background: #FFFFFF;
    border-radius : 22px;
    width: 90.5%;
    margin: 0 auto 6.5%;
    padding: 5.2% 4.8% 6.7% 5.5%;
    display: flex;
    justify-content: center;
    flex-flow: column;
    position: relative;
}
.b_08_data{
    position: relative;
    width: 100%;
}
.b_08_data_02{
    position: relative;
    width: 100%;
}
.b_08_circle{width: 69.7%;margin: 9% auto 0;position:relative;}

.donut237{ width:100%; height:auto; transform:rotate(-90deg); }  /* 12時開始 */

.track,.progress{ fill:none; stroke-linecap:butt; stroke-width:36.46px; }
.track{   stroke:#c6c6c6; }
.progress{
  stroke:#46c24e;
  stroke-dasharray:100;     /* pathLength=100 → %管理 */
  stroke-dashoffset:100;    /* 初期は非表示 */
  transition:stroke-dashoffset 1.6s ease-out;
}
/* 色は変数から描画するように */
.track   { stroke: var(--track); }
.progress{ stroke: var(--ring);  }
.inner{ fill:#fff; }

/* ▼ 白い境界線：小さな白ダッシュを円周に配置して“線”に見せる */
.separator{
  fill:none;
  stroke:#fff;
  stroke-linecap:butt;
  stroke-width:36.46px;      /* ← リング幅と同じにして“内外端まで”届かせる */
  --sep: .6;                 /* ← 白線の長さ（%）。1.6〜2.2で微調整 */
  stroke-dasharray: var(--sep) calc(100 - var(--sep));
  stroke-dashoffset: 100;
  transition: stroke-dashoffset 1.6s ease-out;
}
.sep-start{ stroke-dashoffset: 0; transition: none; } /* 12時側は固定 */


.b_08_data_inner{
    position: absolute;
    width: 32.8%;
    margin: 0 auto;
    top: 47%;
    left: 0;
    right: 0;
}
.b_08_data_inner_2{
    width: 37.5%;
    top: 51%;
    left: 2%;
}
.b_08_data_item{position: relative;}
.b_08_data_02 .b_08_data_item{
    position: absolute;
    top: 4%;
    left: 14.5%;
    width: 26.8%;
}

.b_08 .b_08_list:nth-child(odd) .b_08_data .b_08_data_inner{
    top: 39%;
}

.b_08_data_item {
  position: relative;
  display: inline-block;
  width: fit-content;
  text-align: right;  /* 数字本体を右寄せ */
  left: -10%;
}

/* 数字本体 */
.num {
  margin: 0;
  line-height: 1;
  text-align: right;
}

.countup {
  display: inline-block;
  text-align: right;
  font-variant-numeric: tabular-nums;
  font-feature-settings: "tnum" 1, "lnum" 1;
  min-width: 3ch;
}

/* 名画像を右端に固定する（数字の右側にピタッと来る） */
.e77 {
  position: absolute;
  top: 27%;      /* 元の指定維持 */
  right: 0;      /* 数字の右端に揃える */
  width: 40%;    /* 元の指定維持 */
  transform: translateX(100%); /* 数字の右横に配置 */
}

.e79, .e80, .e81,
.e89, .e90, .e91, .e92 {
  opacity: 0;
  transform: translateY(10px) scale(.96);
  transition: opacity .45s ease, transform .45s ease;
}

.e79.is-revealed, .e80.is-revealed, .e81.is-revealed,
.e89.is-revealed, .e90.is-revealed, .e91.is-revealed, .e92.is-revealed {
  opacity: 1;
  transform: none;
}

/* 棒（画像）が下から伸びる */
.e95 img, .e98 img, .e100 img {
  display: block;
  transform-origin: bottom center;
  transform: scaleY(0);
   transition: transform .8s cubic-bezier(.2,.8,.2,1);
  will-change: transform;
}

/* 伸びた状態 */
.e95.is-rise img,
.e98.is-rise img,
.e100.is-rise img {
  transform: scaleY(1);
}

/* 共通のラベルアニメーション */
.e96, .e99, .e101 {
  opacity: 0;
  transform: translateY(8px);
  transition: opacity .4s ease, transform .4s ease;
  will-change: opacity, transform;
}

/* 他ラベルは通常 */
.e96.is-revealed,.e99.is-revealed, .e101.is-revealed {
  opacity: 1;
  transform: none;
}
/* ベース：レイヤー化＆合成安定 */
.e96{
  transform-origin: center;
  opacity: 0;
  transform: scale(.82) translateZ(0); /* ← translate をやめ、Zだけ付けて合成安定 */
  will-change: transform, opacity;
  backface-visibility: hidden;
  transform-origin: 50% 52%;
}

/* 出現：1本の滑らかイージング。translateは使わない */
.e96.is-revealed{
  animation: popSmooth .9s cubic-bezier(.25,1,.3,1) both;
}

/* キーフレームは peak を1回だけ（中間保持なし） */
@keyframes popSmooth{
  0%   { opacity:0; transform: scale(.82); }
  50%  { opacity:1; transform: scale(1.055); } /* 小さめオーバーシュート（にゅっ） */
  100% { opacity:1; transform: scale(1); }
}

/* 念のため img 側もブロック化してガタつきを防止 */
.e96 img{
  display:block;
  transform: translateZ(0);
  backface-visibility: hidden;
}

/* 初期：少しだけ下に置いておく（ズームは無し） */
.e104_2{
  opacity: 0;
  transform: translateY(10px);
  will-change: transform, opacity;
}
.e104_2 img{ display:block; }

/* 発火：フェードアップ＋ほんの少しの加速感（ズームしない） */
.e104_2.is-pop{
  animation: fadeUpSlight .7s cubic-bezier(.22,1,.28,1) both var(--e104-delay, 0ms);
}

@keyframes fadeUpSlight{
  0%   { opacity: 0; transform: translateY(10px); }
  60%  { opacity: 1; transform: translateY(0); }   /* ここで着地 */
  100% { opacity: 1; transform: translateY(0); }   /* 余韻のみ */
}

/* 省エネ対応 */
@media (prefers-reduced-motion: reduce){
  .e104_2{ opacity:1 !important; transform:none !important; animation:none !important; }
}

.b_09{}
.b_09_list{
    position: relative;
    width: 90.5%;
    background: #FFFFFF;
    border-radius : 14px;
    margin: 0 auto 18.5%;
    padding: 18.5% 4% 9.5% 5.5%;
    display: flex;
    justify-content: center;
    flex-flow: column;
}
.b_09 .b_09_list:nth-child(6){
    margin: 0 auto 4.5%;
}
.b_09_icon{
    width: 31.5%;
    margin: 0 auto;
    position: absolute;
    top: -9%;
    left: 0;
    right: 0;
}
.b_09_name{
    width: 67.5%;
    margin: 0 auto 11.5%;
}
.b_09_date{
    position: relative;
}
.b_09_date_bg{
    position: relative;
    width: 94.5%;
    margin: 0 auto 5%;
}
.b_09_tag{
    width: 24%;
    position: absolute;
    bottom: 0;
    left: 19%;
}
.b_09_tag_02{
    width: 15.7%;
    position: absolute;
    bottom: 0;
    right: 21%;
}
.b_09_chart{
    width: 31.9%;
    position: absolute;
    bottom: 13%;
    left: 16%;
}
.b_09_chart_02{
    width: 31.9%;
    position: absolute;
    bottom: 13%;
    left: 55%;
}
.b_09_chart_value{
    width: 20%;
    position: absolute;
    top: 35%;
    left: 22.5%;
}
.b_09_chart_value_02{
    width: 37%;
    position: absolute;
    top: -8%;
    right: 11%;
}
.b_09_arrow{
    width: 18%;
    position: absolute;
    top: 10%;
    left: 31%;
}
.b_09 .b_09_list:nth-child(3) .b_09_arrow{
    top: 19%;
}
.b_09 .b_09_list:nth-child(4) .b_09_arrow{
    top: 25%;
}
.b_09 .b_09_list:nth-child(5) .b_09_arrow{
    top: 1%;
    left: 27%;
}
.b_09 .b_09_list:nth-child(6) .b_09_arrow{
    top: 11%;
    left: 27%;
}
.b_09 .b_09_list:nth-child(7) .b_09_arrow{}

.b_09_badge{
    width: 25%;
    position: absolute;
    top: 35%;
    right: 1%;
}
.b_09_text{}
.b_09_text_02{
    width: 97%;
}
.b_09_description{
    margin: 8% auto;
    width: 97%;
}
.b_09_arrow_02{
    width: 8%;
    margin: 4% auto 0;
}

/* ▼ 棒：伸びアニメーション */
.b_09_chart img,
.b_09_chart_02 img {
  transform-origin: bottom center;
  transform: scaleY(0);
  transition: transform 0.8s cubic-bezier(0.25, 1, 0.5, 1);
   will-change: transform;
  backface-visibility: hidden;
}
.b_09_chart.is-rise img,
.b_09_chart_02.is-rise img {
  transform: scaleY(1);
}
/* 棒②を“ぐいん”と勢い強め */
.b_09_chart_02 img{
  transition-duration: var(--bar2-dur, 1000ms);
  transition-timing-function: cubic-bezier(.15,1.25,.25,1.05);
}

/* ▼ ラベルふわっと（共通） */
.b_09_chart_value,
.b_09_chart_value_02{
  opacity: 0;
  transform: translateY(8px);
  transition: opacity .45s ease, transform .45s ease;
}
.b_09_chart_value.is-revealed,
.b_09_chart_value_02.is-revealed{
  opacity: 1;
  transform: none;
}
/* ▼ ラベル②：バン！→やさしく着地（モバイル最適化） */
.b_09_chart_value_02.is-revealed{
  transition: none;                     /* animationと競合させない */
  transform-origin: center center;
  will-change: transform, opacity;
  backface-visibility: hidden;
  transform: translateZ(0);
  animation: b09PopSmooth .68s both;    /* 少し短め＆スムーズ */
}

/* キーフレーム：成長→オーバーシュート→微アンダー→最終着地 */
@keyframes b09PopSmooth{
  /* 0→40%：素早く持ち上げる（加速） */
  0%   { opacity:0; transform:translate3d(0,10px,0) scale3d(.92,.92,1); animation-timing-function: cubic-bezier(.2,.9,.2,1.15); }
  40%  { opacity:1; transform:translate3d(0,0,0)   scale3d(1.055,1.055,1); }

  /* 40→72%：やや緩やかに縮める（減速） */
  72%  {              transform:translate3d(0,0,0)   scale3d(.998,.998,1); animation-timing-function: cubic-bezier(.17,.84,.24,1); }

  /* 72→100%：ほんの少しだけ戻してピタッと止める（柔らかい着地） */
  100% {              transform:translate3d(0,0,0)   scale3d(1,1,1); }
}

/* 追加の安定化（任意だが効果大） */
.b_09_chart_value_02 img{
  display:block;
  backface-visibility:hidden;
  transform: translateZ(0);
}
/* ▼ 矢印：下から右上へぐいんと伸びる */
.b_09_arrow {
  display: block;
  transform-origin: left bottom; /* ★ 基点を左下に設定 */
  transform: scale(0) rotate(12deg); /* 初期：小さくて少し傾ける */
  transition: transform var(--arrow-dur, 600ms) cubic-bezier(.18,1.1,.25,1.05);
  will-change: transform;
}
.b_09_arrow.is-shoot {
  transform: scale(1) rotate(0deg); /* 右上方向に“ぐいん” */
}


/* ▼ バッジ：ラベル②と同時にズームアウト */
.b_09_badge{
  opacity:0;
  transform:translateY(8px) scale(.8);
  transition:opacity .5s ease, transform .6s cubic-bezier(.2,1.1,.2,1);
}
.b_09_badge.is-pop{
  opacity:1;
  transform:translateY(0) scale(1);
}


.b_09_chart img,
.b_09_chart_02 img { display:block; }

.b_09_chart_value,
.b_09_chart_value_02{
  will-change: opacity, transform;
  backface-visibility: hidden;
}

/* --- 強制アニメON（省エネ設定でも棒と矢印を動かす） --- */
.force-motion .b_09_chart img,
.force-motion .b_09_chart_02 img {
  transform-origin: bottom center !important;
  transform: scaleY(0) !important;
  transition: transform 0.8s cubic-bezier(0.25, 1, 0.5, 1) !important;
  display: block; /* 安定化 */
  backface-visibility: hidden;
  will-change: transform;
}
.force-motion .b_09_chart_02 img {
  transition-duration: var(--bar2-dur, 1000ms) !important;
  transition-timing-function: cubic-bezier(.15,1.25,.25,1.05) !important;
}
.force-motion .b_09_chart.is-rise img,
.force-motion .b_09_chart_02.is-rise img {
  transform: scaleY(1) !important;
}

/* 矢印も省エネ時に止まらないように（必要なら） */
.force-motion .b_09_arrow {
  transform-origin: left bottom !important;
  transition: transform var(--arrow-dur, 600ms) cubic-bezier(.18,1.1,.25,1.05) !important;
}
.force-motion .b_09_arrow.is-shoot { transform: scale(1) rotate(0deg) !important; }
.gold_back{
    position: relative;
    width: 100%;
}

.s1{
    width: 60.8%;
    margin: 4% auto 6%;
}
.s2{
    width: 66%;
    margin: 5.5% auto 3.7%;
}
.s3{}
.s4{
    width: 95%;
    margin: 6% 0 15%;
}
.s5{}

.e1{
    width: 99.5%;
}
.e2{
    width: 100%;
    margin: 3% auto 3.5%;
}
.e3{
    max-width: 123px;
    width: 42.5%;
}
.e4{
    max-width: 152px;
    width: 52.5%;
}
.e5{
    width: 100%;
    margin: 0 auto 3.4%;
}
.e6{
    width: 100%;
}
.e7{}
.e8{}
.e9{
    width: 66.4%;
    margin: 0 auto;
}
.e10{
    margin: 13% auto 7%;
    width: 58.5%;
}
.e11{
    position: relative;
    width: 100%;
    margin: 0 auto;
}
.e12{
    width: 35.7%;
    position: absolute;
    top: -11%;
    right: 1%;
    z-index: 10;
}
.e13{
    width: 6%;
    position: absolute;
    top: -14%;
    right: 5%;
}
.e14{}
.e15{}
.e16{}
.e17{}
.e18{}
.e19{
    width: 31%;
    margin: 6% auto 2.5%;
}
.e20{
    width: 69%;
    margin: 0 auto 4.3%;
}
.e21{
    width: 54%;
    margin: 8% auto 0;
}
.e22{
    width: 70%;
    margin: 3.5% auto 5%;
}
.e23{
    width: 42%;
    margin: 0 auto;
}
.e24{
    position: relative;
    width: 42.5%;
    margin: 0% auto 0;
}
.e24_left{
    position: absolute;
    top: 8.4%;
    left: 4%;
    width: 32%;
}
.e24_right{position: absolute;top: 8.8%;right: 5%;width: 32%;}
.e25{
    width: 93.5%;
}
.e26{
    width: 89.75%;
}
.e27{}
.e28{}
.e29{
    width: 96.5%;
    margin: 16% 0 9%;
}
.e30{
    width: 92.5%;
    margin: 6% 0 9%;
}
.e31{
    margin: 0 0 10%;
}
.e32{
    width: 78%;
    margin: 0 auto 3%;
}
.e33{
    width: 23%;
    margin: 13% auto 0;
}
.e34{
    width: 47%;
    margin: 2% auto 8%;
}
.e35{
    top: -4.5%;
}
.e36{}
.e37{
    position: absolute;
    top: -4.5%;
    right: 5%;
    width: 24%;
}
.e38{}
.e39{
    left: 41%;
    top: -3.5%;
}
.e40{}
.e41{
    width: 41%;
    position: absolute;
    top: 0%;
    left: -3%;
}
.e42{
    width: 6.6%;
    position: absolute;
    top: 0;
    left: 7%;
}
.e43{
    width: 3%;
    position: absolute;
    top: 11%;
    left: 13%;
}
.e44{
    width: 3%;
    position: absolute;
    top: 1%;
    left: 27%;
}
.e45{}
.e46{
    top: -3.5%;
}
.e47{}
.e48{
    width: 33%;
    position: absolute;
    top: -5.2%;
    right: 8.2%;
}
.e49{
    width: 1.5%;
    position: absolute;
    top: -1.7%;
    right: 18.2%;
}
.e50{
    width: 27%;
    position: absolute;
    top: -3%;
    right: 7.5%;
}
.e51{}
.e52{
    width: 69%;
    margin: 0 auto 6%;
}
.e53_wrap{
    width: 77.5%;
    position: relative;
    margin: 0 auto;
}
.e53_box{
    width: 100%;
    mix-blend-mode: multiply;
    margin: 14% auto 12%;
    position: relative;
    z-index: 15;
}
.e53{
    width: 80%;
    position: absolute;
    top: 21%;
    left: 0;
    right: 0;
    margin: auto;
    z-index: 20;
}
.e53_2{
    width: 71.5%;
    margin: 0 auto 13%;
}
.e54{}
.e55{
    position: relative;
    width: 69%;
}
.e55_2{

width: 12.5%;

position: absolute;

top: 7%;

right: 11%;
}
.e56{
    width: 93%;
    margin: 7.5% 0;
}
.e57{
    width: 79%;
}
.e58{}
.e59{}
.e60_wrap{
    width: 96%;
    position: relative;
    margin: 0 auto;
}
.e60{
    width: 88.5%;
    margin: 0 auto;
}
.e60_2{
    position: absolute;
    width: 24.8%;
    top: -4%;
    left: 10%;
}
.e60_3{
    position: absolute;
    width: 19.5%;
    top: 51%;
    right: 2%;
}
.e60_4{
    position: absolute;
    width: 18.5%;
    top: 3%;
    right: -1%;
}
.e60_5{
    position: absolute;
    top: 53%;
    left: -4%;
    width: 17.9%;
}

/* 上下ふわふわアニメーション */
@keyframes fluffy1 {
  0%   { transform: translateY(0); }
  50%  { transform: translateY(7px); }
  100% { transform: translateY(0); }
}

@keyframes fluffy2 {
  0%   { transform: translateY(0); }
  50%  { transform: translateY(-5px); }
  100% { transform: translateY(0); }
}

@keyframes fluffy3 {
  0%   { transform: translateY(0); }
  50%  { transform: translateY(8px); }
  100% { transform: translateY(0); }
}

/* ふわふわ設定：それぞれ少しずつズラす */
.e60 img {
  animation: fluffy1 3s ease-in-out .2s infinite alternate;
}

.e60_2 img {
  animation: fluffy2 3.4s ease-in-out .5s infinite alternate;
}

.e60_3 img {
  animation: fluffy3 3.8s ease-in-out .9s infinite alternate;
}

.e61{
    width: 75%;
    margin: 8% 0 7%;
}
.e62{
    width: 78%;
}
.e63{}
.e64{}
.e65{
    width: 64.5%;
    position: relative;
    left: -12%;
}
.e65_2{
    width: 22.5%;
    position: absolute;
    top: 7%;
    right: 7%;
}
.e65_3{
    width: 18%;
    position: absolute;
    top: 22%;
    right: 10%;
}
.e66{
    width: 76%;
    margin: 8% 0 7%;
}
.e67{
    width: 80.5%;
}
.e68{}
.e69{
    width: 68.5%;
    margin: 15% auto 7.5%;
}
.e70{
    width: 65.5%;
    margin: 0 auto 15%;
}
.e71{
    width: 64%;
    margin: 14% auto 10%;
}
.e72{}
.e73{}
.e74{
    position: absolute;
    top: 27%;
    left: 10%;
    width: 36%;
}
.e75{
    width: 78%;
    margin: 0 auto;
}
.e76{}
.e77{
}
.e78{
    width: 68%;
    margin: -3% auto 0;
}
.e79{
    width: 21%;
    position: absolute;
    top: 28%;
    right: 4%;
}
.e80{
    width: 16%;
    top: 70%;
    left: 4.5%;
    position: absolute;
}
.e81{
    width: 18.5%;
    position: absolute;
    right: 3.8%;
    top: 76%;
}
.e82{
    width: 63%;
    position: relative;
    left: 0;
}
.e83{}
.e84{
    width: 39%;
    position: absolute;
    top: 27.5%;
    left: 8%;
}
.e85{
    width: 58%;
    margin: 0 auto;
}
.e86{}
.e87{
    margin-top: 13%;
}
.e88{
    width: 68%;
    margin: -3% auto 0;
}
.e89{
    width: 17%;
    position: absolute;
    top: 22%;
    right: 12%;
}
.e90{
    width: 27%;
    position: absolute;
    top: 7%;
    right: 6%;
}
.e91{
    width: 17%;
    position: absolute;
    bottom: 11%;
    right: 4%;
}
.e92{
    width: 14%;
    position: absolute;
    left: 7.5%;
    bottom: 9%;
}
.e93{
    width: 81%;
}
.e94{
    width: 98.5%;
    margin: 8% auto 11%;
    position: relative;
}
.e95{width: 23.2%;position: absolute;bottom: 16%;left: 15.7%;}
.e96{}
.e97{
    margin-top: 12%;
}
.e98{
    width: 23.2%;
    position: absolute;
    bottom: 16%;
    left: 44%;
}
.e99{
    width: 16%;
    position: absolute;
    top: 64%;
    left: 48.4%;
}
.e100{
    width: 23.2%;
    position: absolute;
    bottom: 16%;
    right: 5%;
}
.e101{
    width: 11%;
    position: absolute;
    top: 68%;
    right: 10%;
}
.e102{
    position: absolute;
    width: 16%;
    bottom: 0;
    left: 19%;
}
.e103{
    width: 21.5%;
    position: absolute;
    bottom: 0;
    left: 45%;
}
.e104{
    width: 15%;
    position: absolute;
    bottom: 0;
    right: 9%;
}
.e104_2{
    width: 54%;
    position: absolute;
    top: 4%;
    right: 0;
}
.e105{
    width: 71%;
    position: relative;
    left: 5.5%;
}
.e106_wrap {
  position: relative;
  width: 100%;
}
.e106 {
  position: relative;
  width: 90%;
  margin: 6.5% auto 12%;
}
.e106_2 img{position: relative; z-index: 100;}
.e106_2 {
  width: 27.5%;
  position: absolute;
  top: 64%;
  left: 51%;
}

/* マーカー */
.e106_2::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 10px;
  background: #FFD300;
  border-radius: 3px;
  transform-origin: left center;
  transform: scaleX(0);
  transition: transform 1.6s cubic-bezier(.22,1,.36,1);
  z-index: 2;
}

.e106_2.active::after {
  transform: scaleX(1);
}


.e107{
    width: 34.5%;
    margin: 8.4% auto 19%;
}
.e108{}
.e109{}
.e110{}
.e111{}
.e112{}
.e113{}
.e114{}
.e115{}
.e116{
    width: 14.72%;
}
.e117{}
.e118{}
.e119{}
.e120{}
.e121{}
.e122{}
.e123{
    width: 79%;
}
.e124{}
.e125{}
.e126{}
.e127{
    top: 44%;
}
.e128{
    width: 15%;
}
.e129{}
.e130{
    width: 35%;
    top: -17%;
}
.e131{}
.e132{}
.e133{}
.e134{}
.e135{}
.e136{
    width: 79%;
    margin: 0 auto 12.0%;
}
.e137{}
.e138{}
.e139{
    width: 24.5%;
    top: 49%;
    left: 21%;
}
.e140{
    width: 14.52%;
}
.e141{}
.e142{
    width: 46%;
    top: -12%;
    right: 6.5%;
}
.e143{}
.e144{}
.e145{}
.e146{}
.e147{}
.e148{
    width: 91%;
}
.e149{}
.e150{}
.e151{
    width: 24.5%;
    top: 24%;
    left: 20%;
}
.e152{
    width: 15.15%;
}
.e153{}
.e154{
    width: 44.2%;
    top: -12%;
    right: 6%;
}
.e155{}
.e156{}
.e157{}
.e158{}
.e159{}
.e160{
    width: 91.3%;
}
.e161{}
.e162{}
.e163{
    width: 29%;
    left: 18%;
    top: 36%;
}
.e164{
    width: 11.43%;
}
.e165{}
.e166{
    width: 43%;
    right: 7%;
}
.e167{}
.e168{}
.e169{}
.e170{}
.e171{
    margin-bottom: 15%;
    width: 77%;
    position: relative;
    left: 6%;
}
.e172{
    position: absolute;
    width: 78%;
    top: 7%;
    left: 0;
    right: 0;
    margin: 0 auto;
}
.e173{
    width: 93%;
    margin: 2.5% auto 3%;
}
.e174{
    width: 61%;
    margin: 6% auto 3.5%;
}
.e175{
    width: 69%;
    margin: 0 auto 6%;
}
.e176{
    margin: 12.5% 0 8%;
}
.e177{width: 61%;}
.e178{
    margin: 6% 0 5.5%;
    width: 85%;
}
.e179{
    width: 76%;
}
.e180{
    margin-top: 8%;
    width: 56.5%;
    position: relative;
    left: 2%;
}
.e181{
    position: absolute;
    top: 0;
    right: -6%;
    width: 47%;
}
.e182{
    width: 82%;
    margin: 7% auto 15%;
}
.e183{}
.e184{
    width: 96%;
    margin: 5% auto 19.5%;
    position: relative;
}
.e184_2{
    width: 9%;
    margin: 0;
    position: absolute;
    top: 25.2%;
    left: 5.0%;
}
.e185{
    width: 30.5%;
    position: absolute;
    bottom: -1%;
    right: 7.5%;
}

.cl{background: #C80000;color: #fff;padding: 8% 0 8%;}
.f_menu{}
.f_Copyright{
            text-align: center;
            margin: 0 auto;
            letter-spacing: 0.1em;
            font-size: 10px;
}
.footer{
    padding: 0% 0 0%;
}
.foot_menu{
    margin: 0 0 3% 0;
}
.foot_menu ul{
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    text-align: center;
}
.foot_menu li{
    margin: 0 2% 0 0;
}
.foot_menu li:not(:last-child)::after {
  content: "|";
  color: #fff;
  opacity: 0.8;
  font-size: 14px;
  margin-left: 8px;
}
.foot_menu a{
    color: #fff;
    font-size: 11px;
    text-decoration: none;
}
.copy{
    color: rgb(255, 255, 255);
    opacity: 0.4;
    font-size: 12px;
}

.kiyaku_all{ padding: 20px 0;
display: flex;
justify-content: space-between;
flex-wrap: wrap;
max-width: 480px;
margin: 0 auto;}

.kiyaku_all a{ color:#FFF;}


/* 通常状態 */
.floating {
  position: relative;
  transition: opacity 0.4s ease;
  z-index: 9999;
  opacity: 0;
  transform: none; /* ← 元位置ではズレを防ぐ */
}

/* フローティングとして出現時のみ transform を適用 */
.floating.is-fixed {
  position: fixed !important;
  bottom: 0;
  left: 0;
  right: 0;
  margin: 0 auto;
  animation: floatSlideUp 0.6s ease-out;
  transform: none; /* ← アニメ後はリセット（ズレ防止） */
  max-width: 425px;
  width: 100%;
  padding: 3% 10%;
  box-sizing: border-box;
  background-color: rgba(255, 255, 255, 0.2);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  border-radius: 20px 20px 0 0;
  border: 1px solid rgba(255, 255, 255, 0.2);
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
}

/* 表示制御 */
.floating.is-visible {
  opacity: 1;
}

.floating.is-hidden {
  opacity: 0;
  pointer-events: none;
}
.featherlight .featherlight-close-icon{
    line-height: 50px;
    width: 50px;
    font-size: 21px;
    background: none;
}
.featherlight .featherlight-content{
    border-radius: 20px;
    padding: 5%;
    max-width: 90%;
    max-height: 90%;
}
.featherlight .featherlight-content h2{
    margin: 30px 0 30px;
    font-size: 24px;
}
}

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


}

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

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


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


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

}

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

}

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

}
@media screen and ( min-width:2000px )
{

.t01{
    position: relative;
    left: 0;
    right: 0;
    top: 0;
    width: 33.65%;
    margin: 0 auto;
    z-index: 5;
    font-size: min(2.35vw,47px);
    color: #ff6633;
    font-weight: bold;
}
.t01:before{content:'';display: inline-block;position: absolute;width: 2.4rem;height: 5rem;margin: 0 0 0 0;background: url(../img/yay.svg) no-repeat;background-size: contain;vertical-align: middle;top: 10%;left: 0;}
.t01:after{content:'';display: inline-block;position: absolute;width: 2.4rem;height: 5rem;margin: 0 0 0 0;top: 10%;right: 0;background: url(../img/yay.svg) no-repeat;background-size: contain;vertical-align: middle;transform: scale(-1, 1);}


.t02{
    position: relative;
    left: 0;
    right: 0;
    top: 0;
    width: 26.5%;
    margin: 0 auto;
    z-index: 5;
    font-size: 32px;
}
.t02:before{ content:'';display: inline-block;position: absolute;width: 2.4rem;height: 4rem;margin: 0 0 0 0;background: url(../img/yay.svg) no-repeat;background-size: contain;vertical-align: middle;top: 10%;left: 0;}
.t02:after{ content:'';display: inline-block;position: absolute;width: 2.4rem;height: 12rem;margin: 0 0 0 0;top: 10%;right: 0;background: url(../img/yay.svg) no-repeat;background-size: contain;vertical-align: middle;transform: scale(-1, 1);}



.rand_num1{
    font-size: min(2.35vw,47px);
}


}

/* =========================================
   メールアドレス登録フォーム用スタイル
========================================= */
.c-form-area {
    text-align: center;
    margin-top: 30px;
    padding-bottom: 40px;
    width: 100%;
}

.c-form-area .e32 {
    width: 78%;
    margin: 0 auto 3%;
}

.c-form {
    margin-top: 20px;
    width: 100%;
}

.c-form__input {
    margin-bottom: 25px; /* ここを大きくして余白を作ります */
    text-align: center;
}

/* メールアドレス入力欄のデザイン */
.c-form__input input[type="email"] {
    width: 90%;
    max-width: 500px;
    padding: 18px;
    font-size: 16px;
    border: 2px solid #ccc;
    border-radius: 8px;
    text-align: center;
    box-sizing: border-box;
    background-color: #fff;
    color: #333;
    outline: none;
    transition: border-color 0.3s ease;
    -webkit-appearance: none; /* iOS Safariのデフォルトスタイルをリセット */
}

/* 入力中に枠線を緑色（ボタンと同系色）に光らせる */
.c-form__input input[type="email"]:focus {
    border-color: #46c24e;
}

/* 送信ボタンのラッパー */
.c-form__btn {
    background: none;
    border: none;
    padding: 0;
    cursor: pointer;
    width: 90%;
    max-width: 600px;
    transition: opacity 0.3s;
    display: inline-block;
    outline: none;
    -webkit-tap-highlight-color: transparent;
}

/* 送信ボタンの画像 */
.c-form__btn img {
    width: 100%;
    height: auto;
    display: block;
    /* 元のLINEボタンと同じバウンドアニメーションを適用 */
    animation: bounce 2s ease infinite normal 0s none running;
    -webkit-animation: bounce 2s ease infinite normal 0s none running;
    border: none;
    outline: none;
}

/* マウスオーバー時（PC）に少し透過させる */
.c-form__btn:hover {
    opacity: 0.8;
}