@charset "UTF-8";
/* ========================= Breakpoints ========================= */
/* ========================= データ（各BPで上書き可能） - ベースに背景画像や共通プロパティ - sm/md/lg/xl/xxl キーの下に上書きしたい値だけ書く ========================= */
/* ========================= ヘルパー：マップから宣言だけを出力 - map値（=入れ子マップ: sm/md/…）はスキップ ========================= */
/* ========================= 出力：ベース + 各BPでの上書き ========================= */
.deco-chara01 { display: block; position: absolute; aspect-ratio: 1 / 1; background-repeat: no-repeat; background-position: center; background-size: contain; pointer-events: none; background-image: url("../images/chara-broken03.png"); width: 90px; top: -40px; left: 20%; }

@media (min-width: 576px) { .deco-chara01 { width: 110px; top: -36px; left: 18%; } }
@media (min-width: 768px) { .deco-chara01 { width: 130px; top: -40px; left: 120px; } }
@media (min-width: 992px) { .deco-chara01 { width: 150px; top: -50px; left: 220px; } }
@media (min-width: 1200px) { .deco-chara01 { width: 150px; top: -50px; left: 300px; } }
@media (min-width: 1400px) { .deco-chara01 { width: 160px; top: -50px; left: 375px; } }
@media (min-width: 1600px) { .deco-chara01 { width: 160px; top: -50px; left: 375px; } }
.deco-chara02 { display: block; position: absolute; aspect-ratio: 1 / 1; background-repeat: no-repeat; background-position: center; background-size: contain; pointer-events: none; background-image: url("../images/chara-broken02.png"); width: 130px; bottom: -15%; right: -12%; }

@media (min-width: 576px) { .deco-chara02 { width: 150px; bottom: -30px; right: -50px; } }
@media (min-width: 768px) { .deco-chara02 { width: 170px; top: 130px; bottom: auto; right: -8%; } }
@media (min-width: 992px) { .deco-chara02 { width: 220px; top: 220px; bottom: auto; right: 90px; } }
@media (min-width: 1200px) { .deco-chara02 { width: 250px; top: auto; bottom: -90px; right: 130px; } }
@media (min-width: 1400px) { .deco-chara02 { width: 270px; top: auto; bottom: -100px; right: 200px; } }
@media (min-width: 1600px) { .deco-chara02 { width: 270px; top: auto; bottom: -100px; right: 200px; } }
.deco-chara03 { display: block; position: absolute; aspect-ratio: 1 / 1; background-repeat: no-repeat; background-position: center; background-size: contain; pointer-events: none; background-image: url("../images/chara-broken04.png"); width: 180px; top: -70px; left: -10%; }

@media (min-width: 576px) { .deco-chara03 { width: 180px; top: -70px; left: -10%; } }
@media (min-width: 768px) { .deco-chara03 { width: 220px; top: -80px; left: -10%; } }
@media (min-width: 992px) { .deco-chara03 { width: 250px; top: -100px; left: -80px; } }
@media (min-width: 1200px) { .deco-chara03 { width: 300px; top: -120px; left: -110px; } }
@media (min-width: 1400px) { .deco-chara03 { width: 300px; top: -120px; left: -110px; } }
@media (min-width: 1600px) { .deco-chara03 { width: 300px; top: -120px; left: -110px; } }
.deco-chara04 { display: block; position: absolute; aspect-ratio: 1 / 1; background-repeat: no-repeat; background-position: center; background-size: contain; pointer-events: none; background-image: url("../images/chara-broken05.png"); width: 70px; top: 36px; left: auto; right: 11%; }

@media (min-width: 576px) { .deco-chara04 { width: 70px; top: 36px; right: 100px; } }
@media (min-width: 768px) { .deco-chara04 { width: 90px; top: 32px; left: 80px; right: auto; } }
@media (min-width: 992px) { .deco-chara04 { width: 90px; top: 40px; left: 85px; } }
@media (min-width: 1200px) { .deco-chara04 { width: 110px; top: 50px; left: 85px; } }
@media (min-width: 1400px) { .deco-chara04 { width: 110px; top: 50px; left: 90px; } }
@media (min-width: 1600px) { .deco-chara04 { width: 110px; top: 50px; left: 90px; } }
.deco-chara05 { display: block; position: absolute; aspect-ratio: 1 / 1; background-repeat: no-repeat; background-position: center; background-size: contain; pointer-events: none; background-image: url("../images/chara-broken08.png"); width: 100px; top: -46px; left: 5%; }

@media (min-width: 576px) { .deco-chara05 { width: 120px; top: -46px; left: 70px; } }
@media (min-width: 768px) { .deco-chara05 { width: 140px; top: -60px; left: 90px; } }
@media (min-width: 992px) { .deco-chara05 { width: 160px; top: -70px; left: 180px; } }
@media (min-width: 1200px) { .deco-chara05 { width: 180px; top: -70px; left: 220px; } }
@media (min-width: 1400px) { .deco-chara05 { width: 180px; top: -70px; left: 310px; } }
@media (min-width: 1600px) { .deco-chara05 { width: 180px; top: -70px; left: 310px; } }
.deco-chara06 { display: block; position: absolute; aspect-ratio: 1 / 1; background-repeat: no-repeat; background-position: center; background-size: contain; pointer-events: none; background-image: url("../images/chara-broken07.png"); width: 130px; top: 0; left: auto; right: -14%; }

@media (min-width: 576px) { .deco-chara06 { width: 150px; top: 0; right: -50px; } }
@media (min-width: 768px) { .deco-chara06 { width: 170px; top: 5px; right: -30px; } }
@media (min-width: 992px) { .deco-chara06 { width: 200px; top: -20px; right: -60px; } }
@media (min-width: 1200px) { .deco-chara06 { width: 230px; top: -20px; right: -60px; } }
@media (min-width: 1400px) { .deco-chara06 { width: 250px; top: -20px; right: 0; } }
@media (min-width: 1600px) { .deco-chara06 { width: 250px; top: -20px; right: 0; } }
.deco-chara07 { display: block; position: absolute; aspect-ratio: 1 / 1; background-repeat: no-repeat; background-position: center; background-size: contain; pointer-events: none; background-image: url("../images/chara-broken06.png"); width: 130px; top: -50px; left: 0; }

@media (min-width: 576px) { .deco-chara07 { width: 140px; top: -50px; left: 30px; } }
@media (min-width: 768px) { .deco-chara07 { width: 200px; top: -50px; left: 30px; } }
@media (min-width: 992px) { .deco-chara07 { width: 200px; top: -50px; left: calc(50% - 97px); } }
@media (min-width: 1200px) { .deco-chara07 { width: 260px; top: -30px; left: calc(50% - 20px); } }
@media (min-width: 1400px) { .deco-chara07 { width: 260px; top: -30px; left: calc(50% + 22px); } }
@media (min-width: 1600px) { .deco-chara07 { width: 260px; top: -30px; left: calc(50% + 22px); } }
.deco-chara08 { display: block; position: absolute; aspect-ratio: 1 / 1; background-repeat: no-repeat; background-position: center; background-size: contain; pointer-events: none; background-image: url("../images/chara-broken10.png"); width: 160px; top: -80px; right: 0; background-position: left 29px center; }

@media (min-width: 576px) { .deco-chara08 { width: 170px; top: -125px; right: 0; background-position: left 29px center; } }
@media (min-width: 768px) { .deco-chara08 { width: 200px; top: -140px; right: 0; background-position: left 34px center; } }
@media (min-width: 992px) { .deco-chara08 { width: 200px; top: -130px; right: 0; background-position: left 36px center; } }
@media (min-width: 1200px) { .deco-chara08 { width: 240px; top: -150px; right: 0; background-position: left 36px center; } }
@media (min-width: 1400px) { .deco-chara08 { width: 240px; top: -150px; right: 0; background-position: left 40px center; } }
@media (min-width: 1600px) { .deco-chara08 { width: 240px; top: -150px; right: 0; background-position: left 40px center; } }
.deco-chara09 { display: block; position: absolute; aspect-ratio: 1 / 1; background-repeat: no-repeat; background-position: center; background-size: contain; pointer-events: none; background-image: url("../images/chara-broken03.png"); width: 90px; top: -40px; left: calc(50% - 210px); }

@media (min-width: 576px) { .deco-chara09 { width: 110px; top: -36px; left: -17px; } }
@media (min-width: 768px) { .deco-chara09 { width: 130px; top: 20px; left: 43px; } }
@media (min-width: 992px) { .deco-chara09 { width: 150px; top: 0; left: 70px; } }
@media (min-width: 1200px) { .deco-chara09 { width: 150px; top: 0; left: 120px; } }
@media (min-width: 1400px) { .deco-chara09 { width: 160px; top: 0; left: 208px; } }
@media (min-width: 1600px) { .deco-chara09 { width: 160px; top: 0; left: 208px; } }
.deco-chara10 { display: block; position: absolute; aspect-ratio: 1 / 1; background-repeat: no-repeat; background-position: center; background-size: contain; pointer-events: none; background-image: url("../images/chara-broken02.png"); width: 130px; bottom: -26%; right: -7%; }

@media (min-width: 576px) { .deco-chara10 { width: 150px; bottom: -104px; right: 10px; } }
@media (min-width: 768px) { .deco-chara10 { width: 170px; top: 163px; bottom: auto; right: -1%; } }
@media (min-width: 992px) { .deco-chara10 { width: 220px; top: 190px; bottom: auto; right: -30px; } }
@media (min-width: 1200px) { .deco-chara10 { width: 250px; top: auto; bottom: 30px; right: -10px; } }
@media (min-width: 1400px) { .deco-chara10 { width: 270px; top: auto; bottom: 50px; right: 0; } }
@media (min-width: 1600px) { .deco-chara10 { width: 270px; top: auto; bottom: 50px; right: 0; } }
.deco-chara11 { display: block; position: absolute; aspect-ratio: 1 / 1; background-repeat: no-repeat; background-position: center; background-size: contain; pointer-events: none; background-image: url("../images/chara-broken01.png"); width: 130px; top: -10px; left: calc(50% + 96px); }

@media (min-width: 576px) { .deco-chara11 { width: 150px; top: -24px; left: calc(50% + 93px); } }
@media (min-width: 768px) { .deco-chara11 { width: 170px; top: -7px; left: calc(50% + 154px); } }
@media (min-width: 992px) { .deco-chara11 { width: 220px; top: 19px; left: calc(50% + 266px); } }
@media (min-width: 1200px) { .deco-chara11 { width: 240px; top: 20px; left: calc(50% + 307px); } }
@media (min-width: 1400px) { .deco-chara11 { width: 270px; top: 10px; left: calc(50% + 298px); } }
@media (min-width: 1600px) { .deco-chara11 { width: 270px; top: 10px; left: calc(50% + 298px); } }
.deco-chara12 { display: block; position: absolute; aspect-ratio: 1 / 1; background-repeat: no-repeat; background-position: center; background-size: contain; pointer-events: none; background-image: url("../images/chara-broken07.png"); width: 80px; top: 48px; left: calc(50% + 176px); }

@media (min-width: 576px) { .deco-chara12 { width: 135px; top: 213px; left: calc(50% - 286px); } }
@media (min-width: 768px) { .deco-chara12 { width: 150px; top: 231px; left: calc(50% - 297px); } }
@media (min-width: 992px) { .deco-chara12 { width: 200px; top: 407px; left: calc(50% - 443px); } }
@media (min-width: 1200px) { .deco-chara12 { width: 200px; top: 434px; left: calc(50% - 493px); } }
@media (min-width: 1400px) { .deco-chara12 { width: 200px; top: 434px; left: calc(50% - 493px); } }
@media (min-width: 1600px) { .deco-chara12 { width: 200px; top: 434px; left: calc(50% - 493px); } }
.deco-chara13 { display: block; position: absolute; aspect-ratio: 1 / 1; background-repeat: no-repeat; background-position: center; background-size: contain; pointer-events: none; background-image: url("../images/chara-broken08.png"); width: 110px; top: -39px; left: calc(50% - 207px); }

@media (min-width: 576px) { .deco-chara13 { width: 90px; top: 1px; left: calc(50% - 154px); } }
@media (min-width: 768px) { .deco-chara13 { width: 100px; top: 23px; left: calc(50% - 213px); } }
@media (min-width: 992px) { .deco-chara13 { width: 108px; top: 22px; left: calc(50% - 219px); } }
@media (min-width: 1200px) { .deco-chara13 { width: 150px; top: -100px; left: calc(50% - 417px); } }
@media (min-width: 1400px) { .deco-chara13 { width: 150px; top: -100px; left: calc(50% - 417px); } }
@media (min-width: 1600px) { .deco-chara13 { width: 150px; top: -100px; left: calc(50% - 417px); } }
.deco-chara14 { display: block; position: absolute; aspect-ratio: 1 / 1; background-repeat: no-repeat; background-position: center; background-size: contain; pointer-events: none; background-image: url("../images/chara-broken05.png"); width: 138px; top: 6px; left: calc(50% - 202px); }

@media (min-width: 576px) { .deco-chara14 { width: 140px; top: 0; left: calc(50% - 228px); } }
@media (min-width: 768px) { .deco-chara14 { width: 147px; top: 20px; left: calc(50% - 276px); } }
@media (min-width: 992px) { .deco-chara14 { width: 220px; top: 19px; left: calc(50% - 416px); } }
@media (min-width: 1200px) { .deco-chara14 { width: 240px; top: -8px; left: calc(50% - 537px); } }
@media (min-width: 1400px) { .deco-chara14 { width: 270px; top: -8px; left: calc(50% - 537px); } }
@media (min-width: 1600px) { .deco-chara14 { width: 270px; top: -8px; left: calc(50% - 537px); } }
.deco-chara15 { display: block; position: absolute; aspect-ratio: 1 / 1; background-repeat: no-repeat; background-position: center; background-size: contain; pointer-events: none; background-image: url("../images/chara-broken04.png"); width: 80px; top: -4px; left: calc(50% - 216px); }

@media (min-width: 576px) { .deco-chara15 { width: 90px; top: -18px; left: calc(50% - 247px); } }
@media (min-width: 768px) { .deco-chara15 { width: 90px; top: 18px; left: calc(50% - 308px); } }
@media (min-width: 992px) { .deco-chara15 { width: 110px; top: 21px; left: calc(50% - 436px); } }
@media (min-width: 1200px) { .deco-chara15 { width: 120px; top: -8px; left: calc(50% - 558px); } }
@media (min-width: 1400px) { .deco-chara15 { width: 130px; top: -3px; left: calc(50% - 558px); } }
@media (min-width: 1600px) { .deco-chara15 { width: 130px; top: -3px; left: calc(50% - 558px); } }
.deco-chara16 { display: block; position: absolute; aspect-ratio: 1 / 1; background-repeat: no-repeat; background-position: center; background-size: contain; pointer-events: none; background-image: url("../images/chara-broken02.png"); width: 90px; top: -50px; left: calc(50% + 66px); }

@media (min-width: 576px) { .deco-chara16 { width: 90px; top: -50px; left: calc(50% + 66px); } }
@media (min-width: 768px) { .deco-chara16 { width: 110px; top: -37px; left: calc(50% + 182px); } }
@media (min-width: 992px) { .deco-chara16 { width: 140px; top: -50px; left: calc(50% + 178px); } }
@media (min-width: 1200px) { .deco-chara16 { width: 160px; top: -56px; left: calc(50% + 208px); } }
@media (min-width: 1400px) { .deco-chara16 { width: 160px; top: -56px; left: calc(50% + 208px); } }
@media (min-width: 1600px) { .deco-chara16 { width: 160px; top: -56px; left: calc(50% + 208px); } }
.deco-chara17 { display: block; position: absolute; aspect-ratio: 1 / 1; background-repeat: no-repeat; background-position: center; background-size: contain; pointer-events: none; background-image: url("../images/chara-broken04.png"); width: 90px; top: -44px; left: calc(50% - 194px); }

@media (min-width: 576px) { .deco-chara17 { width: 90px; top: -44px; left: calc(50% - 194px); } }
@media (min-width: 768px) { .deco-chara17 { width: 110px; top: -48px; left: calc(50% - 333px); } }
@media (min-width: 992px) { .deco-chara17 { width: 140px; top: -71px; left: calc(50% - 354px); } }
@media (min-width: 1200px) { .deco-chara17 { width: 160px; top: -80px; left: calc(50% - 402px); } }
@media (min-width: 1400px) { .deco-chara17 { width: 160px; top: -80px; left: calc(50% - 402px); } }
@media (min-width: 1600px) { .deco-chara17 { width: 160px; top: -80px; left: calc(50% - 402px); } }
.deco-chara18 { display: block; position: absolute; aspect-ratio: 1 / 1; background-repeat: no-repeat; background-position: center; background-size: contain; pointer-events: none; background-image: url("../images/chara-broken07.png"); width: 93px; top: 17px; left: calc(50% + 35px); }

@media (min-width: 576px) { .deco-chara18 { width: 93px; top: 17px; left: calc(50% + 35px); } }
@media (min-width: 768px) { .deco-chara18 { width: 150px; top: 21px; left: calc(50% + 75px); } }
@media (min-width: 992px) { .deco-chara18 { width: 200px; top: 49px; left: calc(50% + 70px); } }
@media (min-width: 1200px) { .deco-chara18 { width: 240px; top: 46px; left: calc(50% + 77px); } }
@media (min-width: 1400px) { .deco-chara18 { width: 240px; top: 46px; left: calc(50% + 77px); } }
@media (min-width: 1600px) { .deco-chara18 { width: 240px; top: 46px; left: calc(50% + 77px); } }
.deco-chara19 { display: block; position: absolute; aspect-ratio: 1 / 1; background-repeat: no-repeat; background-position: center; background-size: contain; pointer-events: none; background-image: url("../images/chara-broken08.png"); width: 70px; top: 75px; left: calc(50% - 180px); }

@media (min-width: 576px) { .deco-chara19 { width: 70px; top: 75px; left: calc(50% - 180px); } }
@media (min-width: 768px) { .deco-chara19 { width: 120px; top: 77px; left: calc(50% - 322px); } }
@media (min-width: 992px) { .deco-chara19 { width: 160px; top: 150px; left: calc(50% - 366px); } }
@media (min-width: 1200px) { .deco-chara19 { width: 160px; top: 196px; left: calc(50% - 398px); } }
@media (min-width: 1400px) { .deco-chara19 { width: 160px; top: 196px; left: calc(50% - 398px); } }
@media (min-width: 1600px) { .deco-chara19 { width: 160px; top: 196px; left: calc(50% - 398px); } }
.deco-chara20 { display: block; position: absolute; aspect-ratio: 1 / 1; background-repeat: no-repeat; background-position: center; background-size: contain; pointer-events: none; background-image: url("../images/chara-broken02.png"); width: 110px; top: -58px; left: calc(50% + 27px); }

@media (min-width: 576px) { .deco-chara20 { width: 105px; top: -58px; left: calc(50% + 27px); } }
@media (min-width: 768px) { .deco-chara20 { width: 120px; top: -60px; left: calc(50% + 27px); } }
@media (min-width: 992px) { .deco-chara20 { width: 160px; top: -55px; left: calc(50% + 247px); } }
@media (min-width: 1200px) { .deco-chara20 { width: 160px; top: -55px; left: calc(50% + 278px); } }
@media (min-width: 1400px) { .deco-chara20 { width: 160px; top: -55px; left: calc(50% + 278px); } }
@media (min-width: 1600px) { .deco-chara20 { width: 160px; top: -55px; left: calc(50% + 278px); } }
.deco-chara21 { display: block; position: absolute; aspect-ratio: 1 / 1; background-repeat: no-repeat; background-position: center; background-size: contain; pointer-events: none; background-image: url("../images/chara-broken06.png"); display: none; }

@media (min-width: 576px) { .deco-chara21 { display: block; width: 140px; top: -20px; left: calc(50% + 171px); } }
@media (min-width: 768px) { .deco-chara21 { width: 160px; top: -18px; left: calc(50% + 257px); } }
@media (min-width: 992px) { .deco-chara21 { width: 200px; top: 149px; left: calc(50% - 327px); } }
@media (min-width: 1200px) { .deco-chara21 { width: 230px; top: 149px; left: calc(50% - 517px); } }
@media (min-width: 1400px) { .deco-chara21 { width: 230px; top: 140px; left: calc(50% - 707px); } }
@media (min-width: 1600px) { .deco-chara21 { width: 230px; top: 140px; left: calc(50% - 707px); } }
.deco-chara22 { display: block; position: absolute; aspect-ratio: 1 / 1; background-repeat: no-repeat; background-position: center; background-size: contain; pointer-events: none; background-image: url("../images/chara-broken04.png"); display: none; }

@media (min-width: 576px) { .deco-chara22 { display: block; width: 130px; top: 4px; left: calc(50% + 150px); } }
@media (min-width: 768px) { .deco-chara22 { width: 170px; top: -66px; left: calc(50% + 194px); } }
@media (min-width: 992px) { .deco-chara22 { width: 180px; top: -80px; left: calc(50% + 384px); } }
@media (min-width: 1200px) { .deco-chara22 { width: 180px; top: -75px; left: calc(50% + 448px); } }
@media (min-width: 1400px) { .deco-chara22 { width: 180px; top: -95px; left: calc(50% + 465px); } }
@media (min-width: 1600px) { .deco-chara22 { width: 180px; top: -95px; left: calc(50% + 465px); } }
.deco-chara23 { display: block; position: absolute; aspect-ratio: 1 / 1; background-repeat: no-repeat; background-position: center; background-size: contain; pointer-events: none; background-image: url("../images/chara-broken06.png"); width: 138px; top: 6px; left: calc(50% - 202px); }

@media (min-width: 576px) { .deco-chara23 { width: 138px; top: 6px; left: calc(50% - 202px); } }
@media (min-width: 768px) { .deco-chara23 { width: 147px; top: 23px; left: calc(50% - 236px); } }
@media (min-width: 992px) { .deco-chara23 { width: 220px; top: 49px; left: calc(50% - 336px); } }
@media (min-width: 1200px) { .deco-chara23 { width: 240px; top: 70px; left: calc(50% - 366px); } }
@media (min-width: 1400px) { .deco-chara23 { width: 240px; top: 70px; left: calc(50% - 366px); } }
@media (min-width: 1600px) { .deco-chara23 { width: 240px; top: 70px; left: calc(50% - 366px); } }
.deco-chara24 { display: block; position: absolute; aspect-ratio: 1 / 1; background-repeat: no-repeat; background-position: center; background-size: contain; pointer-events: none; background-image: url("../images/chara-broken02.png"); width: 80px; top: -38px; left: calc(50% + 97px); }

@media (min-width: 576px) { .deco-chara24 { width: 80px; top: -38px; left: calc(50% + 97px); } }
@media (min-width: 768px) { .deco-chara24 { width: 110px; top: -75px; left: calc(50% + 148px); } }
@media (min-width: 992px) { .deco-chara24 { width: 120px; top: -72px; left: calc(50% + 276px); } }
@media (min-width: 1200px) { .deco-chara24 { width: 150px; top: -68px; left: calc(50% + 318px); } }
@media (min-width: 1400px) { .deco-chara24 { width: 150px; top: -68px; left: calc(50% + 318px); } }
@media (min-width: 1600px) { .deco-chara24 { width: 150px; top: -68px; left: calc(50% + 318px); } }
.deco-chara25 { display: block; position: absolute; aspect-ratio: 1 / 1; background-repeat: no-repeat; background-position: center; background-size: contain; pointer-events: none; background-image: url("../images/chara-broken03.png"); display: none; }

@media (min-width: 576px) { .deco-chara25 { display: block; width: 110px; top: 332px; left: calc(50% + 181px); } }
@media (min-width: 768px) { .deco-chara25 { width: 110px; top: 327px; left: calc(50% + 68px); } }
@media (min-width: 992px) { .deco-chara25 { width: 120px; top: 517px; left: calc(50% + 266px); } }
@media (min-width: 1200px) { .deco-chara25 { width: 150px; top: 402px; left: calc(50% + 349px); } }
@media (min-width: 1400px) { .deco-chara25 { width: 150px; top: 542px; left: calc(50% + 338px); } }
@media (min-width: 1600px) { .deco-chara25 { width: 150px; top: 542px; left: calc(50% + 338px); } }
.deco-chara26 { display: block; position: absolute; aspect-ratio: 1 / 1; background-repeat: no-repeat; background-position: center; background-size: contain; pointer-events: none; background-image: url("../images/chara-broken09.png"); display: none; }

@media (min-width: 576px) { .deco-chara26 { display: block; width: 130px; top: -56px; left: calc(50% + 130px); } }
@media (min-width: 768px) { .deco-chara26 { width: 170px; top: -89px; left: calc(50% + 216px); } }
@media (min-width: 992px) { .deco-chara26 { width: 180px; top: 17px; left: calc(50% - 410px); } }
@media (min-width: 1200px) { .deco-chara26 { width: 180px; top: 25px; left: calc(50% - 448px); } }
@media (min-width: 1400px) { .deco-chara26 { width: 180px; top: 25px; left: calc(50% - 448px); } }
@media (min-width: 1600px) { .deco-chara26 { width: 180px; top: 25px; left: calc(50% - 448px); } }
.deco-chara27 { display: block; position: absolute; aspect-ratio: 1 / 1; background-repeat: no-repeat; background-position: center; background-size: contain; pointer-events: none; background-image: url("../images/chara-broken07.png"); width: 120px; top: 10px; left: calc(50% - 200px); }

@media (min-width: 576px) { .deco-chara27 { width: 150px; top: -4px; left: calc(50% - 228px); } }
@media (min-width: 768px) { .deco-chara27 { width: 170px; top: 18px; left: calc(50% - 304px); } }
@media (min-width: 992px) { .deco-chara27 { width: 220px; top: 19px; left: calc(50% - 446px); } }
@media (min-width: 1200px) { .deco-chara27 { width: 240px; top: 20px; left: calc(50% - 502px); } }
@media (min-width: 1400px) { .deco-chara27 { width: 270px; top: 20px; left: calc(50% - 522px); } }
@media (min-width: 1600px) { .deco-chara27 { width: 270px; top: 20px; left: calc(50% - 522px); } }
.deco-chara28 { display: block; position: absolute; aspect-ratio: 1 / 1; background-repeat: no-repeat; background-position: center; background-size: contain; pointer-events: none; background-image: url("../images/chara-broken06.png"); display: none; }

@media (min-width: 576px) { .deco-chara28 { display: block; width: 125px; top: 213px; left: calc(50% + 150px); } }
@media (min-width: 768px) { .deco-chara28 { width: 150px; top: 211px; left: calc(50% + 157px); } }
@media (min-width: 992px) { .deco-chara28 { width: 200px; top: 357px; left: calc(50% + 213px); } }
@media (min-width: 1200px) { .deco-chara28 { width: 200px; top: 414px; left: calc(50% + 233px); } }
@media (min-width: 1400px) { .deco-chara28 { width: 200px; top: 414px; left: calc(50% + 233px); } }
@media (min-width: 1600px) { .deco-chara28 { width: 200px; top: 414px; left: calc(50% + 233px); } }
.deco-chara29 { display: block; position: absolute; aspect-ratio: 1 / 1; background-repeat: no-repeat; background-position: center; background-size: contain; pointer-events: none; background-image: url("../images/chara-broken02.png"); width: 100px; top: -30px; left: calc(50% - 166px); }

@media (min-width: 576px) { .deco-chara29 { width: 100px; top: -30px; left: calc(50% - 166px); } }
@media (min-width: 768px) { .deco-chara29 { width: 110px; top: -20px; left: calc(50% - 247px); } }
@media (min-width: 992px) { .deco-chara29 { width: 140px; top: -39px; left: calc(50% - 276px); } }
@media (min-width: 1200px) { .deco-chara29 { width: 160px; top: -39px; left: calc(50% - 310px); } }
@media (min-width: 1400px) { .deco-chara29 { width: 160px; top: -39px; left: calc(50% - 310px); } }
@media (min-width: 1600px) { .deco-chara29 { width: 160px; top: -39px; left: calc(50% - 310px); } }
.deco-chara30 { display: block; position: absolute; aspect-ratio: 1 / 1; background-repeat: no-repeat; background-position: center; background-size: contain; pointer-events: none; background-image: url("../images/chara-broken05.png"); width: 100px; top: -32px; left: calc(50% + 97px); }

@media (min-width: 576px) { .deco-chara30 { width: 100px; top: -32px; left: calc(50% + 97px); } }
@media (min-width: 768px) { .deco-chara30 { width: 110px; top: -28px; left: calc(50% + 193px); } }
@media (min-width: 992px) { .deco-chara30 { width: 140px; top: -49px; left: calc(50% + 194px); } }
@media (min-width: 1200px) { .deco-chara30 { width: 160px; top: -49px; left: calc(50% + 221px); } }
@media (min-width: 1400px) { .deco-chara30 { width: 160px; top: -49px; left: calc(50% + 221px); } }
@media (min-width: 1600px) { .deco-chara30 { width: 160px; top: -49px; left: calc(50% + 221px); } }
.deco-chara31 { display: block; position: absolute; aspect-ratio: 1 / 1; background-repeat: no-repeat; background-position: center; background-size: contain; pointer-events: none; background-image: url("../images/chara-broken01.png"); width: 100px; top: -81px; left: calc(50% + 97px); }

@media (min-width: 576px) { .deco-chara31 { width: 100px; top: -44px; left: calc(50% + 171px); } }
@media (min-width: 768px) { .deco-chara31 { width: 140px; top: -83px; left: calc(50% + 270px); } }
@media (min-width: 992px) { .deco-chara31 { width: 140px; top: -49px; left: calc(50% + 284px); } }
@media (min-width: 1200px) { .deco-chara31 { width: 160px; top: -49px; left: calc(50% + 324px); } }
@media (min-width: 1400px) { .deco-chara31 { width: 160px; top: -79px; left: calc(50% + 324px); } }
@media (min-width: 1600px) { .deco-chara31 { width: 160px; top: -79px; left: calc(50% + 324px); } }
.deco-chara32 { display: block; position: absolute; aspect-ratio: 1 / 1; background-repeat: no-repeat; background-position: center; background-size: contain; pointer-events: none; background-image: url("../images/chara-broken02.png"); width: 130px; top: -23px; left: calc(50% + 83px); }

@media (min-width: 576px) { .deco-chara32 { width: 150px; top: -30px; left: calc(50% + 78px); } }
@media (min-width: 768px) { .deco-chara32 { width: 170px; top: -27px; left: calc(50% + 132px); } }
@media (min-width: 992px) { .deco-chara32 { width: 220px; top: -21px; left: calc(50% + 236px); } }
@media (min-width: 1200px) { .deco-chara32 { width: 240px; top: -20px; left: calc(50% + 277px); } }
@media (min-width: 1400px) { .deco-chara32 { width: 240px; top: -20px; left: calc(50% + 277px); } }
@media (min-width: 1600px) { .deco-chara32 { width: 240px; top: -20px; left: calc(50% + 277px); } }
.deco-chara33 { display: block; position: absolute; aspect-ratio: 1 / 1; background-repeat: no-repeat; background-position: center; background-size: contain; pointer-events: none; background-image: url("../images/chara-broken09.png"); width: 80px; top: 147px; left: calc(50% - 133px); }

@media (min-width: 576px) { .deco-chara33 { width: 135px; top: 140px; left: calc(50% - 176px); } }
@media (min-width: 768px) { .deco-chara33 { width: 150px; top: 164px; left: calc(50% - 297px); } }
@media (min-width: 992px) { .deco-chara33 { width: 200px; top: 294px; left: calc(50% - 443px); } }
@media (min-width: 1200px) { .deco-chara33 { width: 200px; top: 344px; left: calc(50% - 493px); } }
@media (min-width: 1400px) { .deco-chara33 { width: 200px; top: 344px; left: calc(50% - 493px); } }
@media (min-width: 1600px) { .deco-chara33 { width: 200px; top: 344px; left: calc(50% - 493px); } }
.deco-chara34 { display: block; position: absolute; aspect-ratio: 1 / 1; background-repeat: no-repeat; background-position: center; background-size: contain; pointer-events: none; background-image: url("../images/chara-broken09.png"); width: 130px; top: -37px; left: calc(50% - 190px); }

@media (min-width: 576px) { .deco-chara34 { width: 150px; top: -52px; left: calc(50% - 203px); } }
@media (min-width: 768px) { .deco-chara34 { width: 170px; top: -47px; left: calc(50% - 262px); } }
@media (min-width: 992px) { .deco-chara34 { width: 220px; top: 19px; left: calc(50% - 374px); } }
@media (min-width: 1200px) { .deco-chara34 { width: 240px; top: 20px; left: calc(50% - 419px); } }
@media (min-width: 1400px) { .deco-chara34 { width: 270px; top: 10px; left: calc(50% - 440px); } }
@media (min-width: 1600px) { .deco-chara34 { width: 270px; top: 10px; left: calc(50% - 440px); } }
.deco-chara35 { display: block; position: absolute; aspect-ratio: 1 / 1; background-repeat: no-repeat; background-position: center; background-size: contain; pointer-events: none; background-image: url("../images/chara-broken01.png"); width: 80px; top: 30px; left: calc(50% + 105px); }

@media (min-width: 576px) { .deco-chara35 { width: 135px; top: 164px; left: calc(50% + 146px); } }
@media (min-width: 768px) { .deco-chara35 { width: 150px; top: 214px; left: calc(50% + 227px); } }
@media (min-width: 992px) { .deco-chara35 { width: 200px; top: 379px; left: calc(50% + 243px); } }
@media (min-width: 1200px) { .deco-chara35 { width: 200px; top: 374px; left: calc(50% + 303px); } }
@media (min-width: 1400px) { .deco-chara35 { width: 200px; top: 364px; left: calc(50% + 313px); } }
@media (min-width: 1600px) { .deco-chara35 { width: 200px; top: 364px; left: calc(50% + 313px); } }
.deco-chara36 { display: block; position: absolute; aspect-ratio: 1 / 1; background-repeat: no-repeat; background-position: center; background-size: contain; pointer-events: none; background-image: url("../images/chara-broken09.png"); width: 120px; top: -12px; left: calc(50% + 83px); }

@media (min-width: 576px) { .deco-chara36 { width: 130px; top: -17px; left: calc(50% + 87px); } }
@media (min-width: 768px) { .deco-chara36 { width: 170px; top: -27px; left: calc(50% + 132px); } }
@media (min-width: 992px) { .deco-chara36 { width: 220px; top: -21px; left: calc(50% + 236px); } }
@media (min-width: 1200px) { .deco-chara36 { width: 240px; top: -20px; left: calc(50% + 277px); } }
@media (min-width: 1400px) { .deco-chara36 { width: 240px; top: -20px; left: calc(50% + 277px); } }
@media (min-width: 1600px) { .deco-chara36 { width: 240px; top: -20px; left: calc(50% + 277px); } }
.deco-chara37 { display: block; position: absolute; aspect-ratio: 1 / 1; background-repeat: no-repeat; background-position: center; background-size: contain; pointer-events: none; background-image: url("../images/chara-broken01.png"); width: 80px; top: 65px; left: calc(50% - 179px); }

@media (min-width: 576px) { .deco-chara37 { width: 100px; top: 51px; left: calc(50% - 193px); } }
@media (min-width: 768px) { .deco-chara37 { width: 150px; top: 164px; left: calc(50% - 297px); } }
@media (min-width: 992px) { .deco-chara37 { width: 200px; top: 294px; left: calc(50% - 443px); } }
@media (min-width: 1200px) { .deco-chara37 { width: 200px; top: 344px; left: calc(50% - 493px); } }
@media (min-width: 1400px) { .deco-chara37 { width: 200px; top: 344px; left: calc(50% - 493px); } }
@media (min-width: 1600px) { .deco-chara37 { width: 200px; top: 344px; left: calc(50% - 493px); } }
.deco-chara38 { display: block; position: absolute; aspect-ratio: 1 / 1; background-repeat: no-repeat; background-position: center; background-size: contain; pointer-events: none; background-image: url("../images/chara-broken06.png"); width: 120px; top: -12px; left: calc(50% - 206px); }

@media (min-width: 576px) { .deco-chara38 { width: 130px; top: -27px; left: calc(50% - 231px); } }
@media (min-width: 768px) { .deco-chara38 { width: 170px; top: -44px; left: calc(50% - 327px); } }
@media (min-width: 992px) { .deco-chara38 { width: 220px; top: -34px; left: calc(50% - 456px); } }
@media (min-width: 1200px) { .deco-chara38 { width: 240px; top: -41px; left: calc(50% - 527px); } }
@media (min-width: 1400px) { .deco-chara38 { width: 240px; top: -41px; left: calc(50% - 527px); } }
@media (min-width: 1600px) { .deco-chara38 { width: 240px; top: -41px; left: calc(50% - 527px); } }
.deco-chara39 { display: block; position: absolute; aspect-ratio: 1 / 1; background-repeat: no-repeat; background-position: center; background-size: contain; pointer-events: none; background-image: url("../images/chara-broken01.png"); width: 90px; top: 77px; left: calc(50% + 109px); }

@media (min-width: 576px) { .deco-chara39 { width: 100px; top: 77px; left: calc(50% + 109px); } }
@media (min-width: 768px) { .deco-chara39 { width: 150px; top: 24px; left: calc(50% + 112px); } }
@media (min-width: 992px) { .deco-chara39 { width: 180px; top: 135px; left: calc(50% + 203px); } }
@media (min-width: 1200px) { .deco-chara39 { width: 200px; top: 164px; left: calc(50% + 243px); } }
@media (min-width: 1400px) { .deco-chara39 { width: 200px; top: 164px; left: calc(50% + 243px); } }
@media (min-width: 1600px) { .deco-chara39 { width: 200px; top: 164px; left: calc(50% + 243px); } }
.deco-chara40 { display: block; position: absolute; aspect-ratio: 1 / 1; background-repeat: no-repeat; background-position: center; background-size: contain; pointer-events: none; background-image: url("../images/chara-broken03.png"); width: 120px; top: 21px; left: calc(50% + 59px); }

@media (min-width: 576px) { .deco-chara40 { width: 135px; top: 12px; left: calc(50% + 62px); } }
@media (min-width: 768px) { .deco-chara40 { width: 150px; top: 22px; left: calc(50% + 72px); } }
@media (min-width: 992px) { .deco-chara40 { width: 220px; top: 49px; left: calc(50% + 116px); } }
@media (min-width: 1200px) { .deco-chara40 { width: 240px; top: 70px; left: calc(50% + 128px); } }
@media (min-width: 1400px) { .deco-chara40 { width: 240px; top: 70px; left: calc(50% + 128px); } }
@media (min-width: 1600px) { .deco-chara40 { width: 240px; top: 70px; left: calc(50% + 128px); } }
.deco-chara41 { display: block; position: absolute; aspect-ratio: 1 / 1; background-repeat: no-repeat; background-position: center; background-size: contain; pointer-events: none; background-image: url("../images/chara-broken07.png"); width: 80px; top: 12px; left: calc(50% - 171px); }

@media (min-width: 576px) { .deco-chara41 { width: 100px; top: 1px; left: calc(50% - 191px); } }
@media (min-width: 768px) { .deco-chara41 { width: 150px; top: -51px; left: calc(50% - 295px); } }
@media (min-width: 992px) { .deco-chara41 { width: 180px; top: -62px; left: calc(50% - 430px); } }
@media (min-width: 1200px) { .deco-chara41 { width: 200px; top: -66px; left: calc(50% - 485px); } }
@media (min-width: 1400px) { .deco-chara41 { width: 200px; top: -66px; left: calc(50% - 485px); } }
@media (min-width: 1600px) { .deco-chara41 { width: 200px; top: -66px; left: calc(50% - 485px); } }
.deco-chara42 { display: block; position: absolute; aspect-ratio: 1 / 1; background-repeat: no-repeat; background-position: center; background-size: contain; pointer-events: none; background-image: url("../images/chara-broken05.png"); width: 80px; top: 65px; left: calc(50% - 169px); }

@media (min-width: 576px) { .deco-chara42 { width: 100px; top: 51px; left: calc(50% - 193px); } }
@media (min-width: 768px) { .deco-chara42 { width: 150px; top: 164px; left: calc(50% - 297px); } }
@media (min-width: 992px) { .deco-chara42 { width: 200px; top: 294px; left: calc(50% - 443px); } }
@media (min-width: 1200px) { .deco-chara42 { width: 200px; top: 344px; left: calc(50% - 493px); } }
@media (min-width: 1400px) { .deco-chara42 { width: 200px; top: 344px; left: calc(50% - 493px); } }
@media (min-width: 1600px) { .deco-chara42 { width: 200px; top: 344px; left: calc(50% - 493px); } }
.deco-chara43 { display: block; position: absolute; aspect-ratio: 1 / 1; background-repeat: no-repeat; background-position: center; background-size: contain; pointer-events: none; background-image: url("../images/chara-broken04.png"); width: 90px; top: 57px; left: calc(50% + 73px); }

@media (min-width: 576px) { .deco-chara43 { width: 110px; top: 39px; left: calc(50% + 66px); } }
@media (min-width: 768px) { .deco-chara43 { width: 140px; top: 141px; left: calc(50% + 260px); } }
@media (min-width: 992px) { .deco-chara43 { width: 180px; top: 129px; left: calc(50% + 133px); } }
@media (min-width: 1200px) { .deco-chara43 { width: 200px; top: 157px; left: calc(50% + 157px); } }
@media (min-width: 1400px) { .deco-chara43 { width: 200px; top: 157px; left: calc(50% + 157px); } }
@media (min-width: 1600px) { .deco-chara43 { width: 200px; top: 157px; left: calc(50% + 157px); } }
.deco-chara44 { display: block; position: absolute; aspect-ratio: 1 / 1; background-repeat: no-repeat; background-position: center; background-size: contain; pointer-events: none; background-image: url("../images/chara-broken02.png"); width: 120px; top: -4px; left: calc(50% + 59px); }

@media (min-width: 576px) { .deco-chara44 { width: 135px; top: -13px; left: calc(50% + 62px); } }
@media (min-width: 768px) { .deco-chara44 { width: 150px; top: 12px; left: calc(50% + 90px); } }
@media (min-width: 992px) { .deco-chara44 { width: 220px; top: 69px; left: calc(50% + 166px); } }
@media (min-width: 1200px) { .deco-chara44 { width: 240px; top: 100px; left: calc(50% + 188px); } }
@media (min-width: 1400px) { .deco-chara44 { width: 240px; top: 100px; left: calc(50% + 188px); } }
@media (min-width: 1600px) { .deco-chara44 { width: 240px; top: 100px; left: calc(50% + 188px); } }
.sm-chara01, .sm-chara02, .sm-chara03, .sm-chara04, .sm-chara05, .sm-chara06, .sm-chara07, .sm-chara08, .sm-chara09, .sm-chara10, .sm-chara11, .sm-chara12 { display: block; aspect-ratio: 1 / 1; width: 30%; position: absolute; top: 0; transform: translateY(-94%); pointer-events: none; }
.sm-chara01 .inner, .sm-chara02 .inner, .sm-chara03 .inner, .sm-chara04 .inner, .sm-chara05 .inner, .sm-chara06 .inner, .sm-chara07 .inner, .sm-chara08 .inner, .sm-chara09 .inner, .sm-chara10 .inner, .sm-chara11 .inner, .sm-chara12 .inner { display: block; width: 100%; height: 100%; background-repeat: no-repeat; background-size: contain; background-position: center bottom; }

.sm-chara01 { left: 18%; }
.sm-chara01 .inner { background-image: url("../images/sm-chara01.webp"); }

.sm-chara02 { left: 55%; }
.sm-chara02 .inner { background-image: url("../images/sm-chara04.webp"); }

.sm-chara03 { left: 7%; }
.sm-chara03 .inner { background-image: url("../images/sm-chara09.webp"); }

.sm-chara04 { left: 3%; }
.sm-chara04 .inner { background-image: url("../images/sm-chara03.webp"); }

.sm-chara05 { left: 18%; width: 20%; }
.sm-chara05 .inner { background-image: url("../images/sm-chara02.webp"); }

.sm-chara06 { left: 10%; width: 26%; }
.sm-chara06 .inner { background-image: url("../images/sm-chara07.webp"); }

.sm-chara07 { left: 55%; }
.sm-chara07 .inner { background-image: url("../images/sm-chara06.webp"); }

.sm-chara08 { left: 60%; }
.sm-chara08 .inner { background-image: url("../images/sm-chara09.webp"); }

.sm-chara09 { left: 77%; width: 25%; }
.sm-chara09 .inner { background-image: url("../images/sm-chara01.webp"); }

.sm-chara10 { left: 55%; width: 20%; }
.sm-chara10 .inner { background-image: url("../images/sm-chara04.webp"); }

.sm-chara11 { left: 55%; }
.sm-chara11 .inner { background-image: url("../images/sm-chara08.webp"); }

.sm-chara12 { left: 72%; width: 20%; }
.sm-chara12 .inner { background-image: url("../images/sm-chara04.webp"); }

.jd-field .heading .sm-chara01 { width: 12%; left: 70%; }
@media screen and (min-width: 576px) { .jd-field .heading .sm-chara01 { width: 8%; } }
.jd-field .heading .sm-chara04 { width: 12%; left: 10%; }
@media screen and (min-width: 576px) { .jd-field .heading .sm-chara04 { width: 8%; } }
.jd-field .heading .sm-chara05 { width: 10%; left: 18%; }
@media screen and (min-width: 576px) { .jd-field .heading .sm-chara05 { width: 6%; } }
@media screen and (min-width: 576px) { .jd-field .heading .sm-chara05 { left: 15%; } }
.jd-field .heading .sm-chara06 { width: 10%; left: 64%; }
@media screen and (min-width: 576px) { .jd-field .heading .sm-chara06 { width: 8%; } }
@media screen and (min-width: 576px) { .jd-field .heading .sm-chara06 { left: 52%; } }
.jd-field .heading .sm-chara08 { width: 12%; left: 20%; }
@media screen and (min-width: 576px) { .jd-field .heading .sm-chara08 { width: 8%; } }
.jd-field .heading .sm-chara09 { width: 10%; left: 28%; }
@media screen and (min-width: 576px) { .jd-field .heading .sm-chara09 { width: 6%; } }
@media screen and (min-width: 576px) { .jd-field .heading .sm-chara09 { left: 25%; } }
.jd-field .heading .sm-chara11 { width: 12%; left: 80%; }
@media screen and (min-width: 576px) { .jd-field .heading .sm-chara11 { width: 8%; } }
.jd-field .heading .sm-chara12 { width: 10%; left: 88%; }
@media screen and (min-width: 576px) { .jd-field .heading .sm-chara12 { width: 6%; } }
@media screen and (min-width: 576px) { .jd-field .heading .sm-chara12 { left: 85%; } }

#members-personal-article .chara-broken { display: block; aspect-ratio: 1 / 1; position: absolute; background-repeat: no-repeat; background-position: center; background-size: contain; pointer-events: none; }
#members-personal-article #modal-member-1 .chara-broken { background-image: url("../images/chara-broken01.png"); width: 150px; left: 210px; top: -26px; }
@media screen and (min-width: 576px) { #members-personal-article #modal-member-1 .chara-broken { width: 180px; left: 337px; top: -70px; } }
@media screen and (min-width: 768px) { #members-personal-article #modal-member-1 .chara-broken { width: 180px; left: 202px; top: -34px; } }
@media screen and (min-width: 992px) { #members-personal-article #modal-member-1 .chara-broken { width: 180px; left: 202px; top: -34px; } }
@media screen and (min-width: 1200px) { #members-personal-article #modal-member-1 .chara-broken { width: 180px; left: 242px; top: -30px; } }
#members-personal-article #modal-member-2 .chara-broken { background-image: url("../images/chara-broken02.png"); width: 150px; left: 170px; top: -18px; }
@media screen and (min-width: 576px) { #members-personal-article #modal-member-2 .chara-broken { width: 180px; left: 170px; top: -36px; } }
@media screen and (min-width: 768px) { #members-personal-article #modal-member-2 .chara-broken { width: 180px; left: 220px; top: -28px; } }
@media screen and (min-width: 992px) { #members-personal-article #modal-member-2 .chara-broken { width: 180px; left: 180px; top: -33px; } }
@media screen and (min-width: 1200px) { #members-personal-article #modal-member-2 .chara-broken { width: 180px; left: 200px; top: -18px; } }
#members-personal-article #modal-member-3 .chara-broken { background-image: url("../images/chara-broken03.png"); width: 150px; left: -55px; top: -112px; }
@media screen and (min-width: 576px) { #members-personal-article #modal-member-3 .chara-broken { width: 180px; left: -85px; top: -140px; } }
@media screen and (min-width: 768px) { #members-personal-article #modal-member-3 .chara-broken { width: 180px; left: -355px; top: 154px; } }
@media screen and (min-width: 992px) { #members-personal-article #modal-member-3 .chara-broken { width: 180px; left: -425px; top: 190px; } }
@media screen and (min-width: 1200px) { #members-personal-article #modal-member-3 .chara-broken { width: 180px; left: -425px; top: 190px; } }
#members-personal-article #modal-member-4 .chara-broken { background-image: url("../images/chara-broken04.png"); width: 150px; right: -58px; left: auto; top: -122px; }
@media screen and (min-width: 576px) { #members-personal-article #modal-member-4 .chara-broken { width: 150px; right: -58px; left: auto; top: -122px; } }
@media screen and (min-width: 768px) { #members-personal-article #modal-member-4 .chara-broken { width: 180px; right: auto; left: -164px; top: 154px; } }
@media screen and (min-width: 992px) { #members-personal-article #modal-member-4 .chara-broken { width: 180px; right: auto; left: -164px; top: 194px; } }
@media screen and (min-width: 1200px) { #members-personal-article #modal-member-4 .chara-broken { width: 180px; right: auto; left: -164px; top: 194px; } }
#members-personal-article #modal-member-5 .chara-broken { background-image: url("../images/chara-broken05.png"); width: 150px; left: 210px; top: -26px; }
@media screen and (min-width: 576px) { #members-personal-article #modal-member-5 .chara-broken { width: 180px; left: 337px; top: -70px; } }
@media screen and (min-width: 768px) { #members-personal-article #modal-member-5 .chara-broken { width: 180px; left: 202px; top: -34px; } }
@media screen and (min-width: 992px) { #members-personal-article #modal-member-5 .chara-broken { width: 180px; left: 202px; top: -34px; } }
@media screen and (min-width: 1200px) { #members-personal-article #modal-member-5 .chara-broken { width: 180px; left: 242px; top: -30px; } }
#members-personal-article #modal-member-6 .chara-broken { background-image: url("../images/chara-broken06.png"); width: 150px; left: 220px; top: -18px; }
@media screen and (min-width: 576px) { #members-personal-article #modal-member-6 .chara-broken { width: 180px; left: 220px; top: -36px; } }
@media screen and (min-width: 768px) { #members-personal-article #modal-member-6 .chara-broken { width: 180px; left: 220px; top: -28px; } }
@media screen and (min-width: 992px) { #members-personal-article #modal-member-6 .chara-broken { width: 180px; left: 220px; top: -33px; } }
@media screen and (min-width: 1200px) { #members-personal-article #modal-member-6 .chara-broken { width: 180px; left: 250px; top: -18px; } }
#members-personal-article #modal-member-7 .chara-broken { background-image: url("../images/chara-broken07.png"); width: 150px; left: -55px; top: -133px; }
@media screen and (min-width: 576px) { #members-personal-article #modal-member-7 .chara-broken { width: 180px; left: -85px; top: -159px; } }
@media screen and (min-width: 768px) { #members-personal-article #modal-member-7 .chara-broken { width: 180px; left: -355px; top: 147px; } }
@media screen and (min-width: 992px) { #members-personal-article #modal-member-7 .chara-broken { width: 180px; left: -425px; top: 183px; } }
@media screen and (min-width: 1200px) { #members-personal-article #modal-member-7 .chara-broken { width: 180px; left: -425px; top: 190px; } }
#members-personal-article #modal-member-8 .chara-broken { background-image: url("../images/chara-broken08.png"); width: 150px; left: -55px; top: -124px; }
@media screen and (min-width: 576px) { #members-personal-article #modal-member-8 .chara-broken { width: 180px; left: -85px; top: -150px; } }
@media screen and (min-width: 768px) { #members-personal-article #modal-member-8 .chara-broken { width: 180px; left: -355px; top: 154px; } }
@media screen and (min-width: 992px) { #members-personal-article #modal-member-8 .chara-broken { width: 180px; left: -425px; top: 190px; } }
@media screen and (min-width: 1200px) { #members-personal-article #modal-member-8 .chara-broken { width: 180px; left: -425px; top: 190px; } }
#members-personal-article #modal-member-9 .chara-broken { background-image: url("../images/chara-broken09.png"); width: 150px; right: -58px; left: auto; top: -122px; }
@media screen and (min-width: 576px) { #members-personal-article #modal-member-9 .chara-broken { width: 150px; right: -58px; left: auto; top: -122px; } }
@media screen and (min-width: 768px) { #members-personal-article #modal-member-9 .chara-broken { width: 180px; right: auto; left: -164px; top: 154px; } }
@media screen and (min-width: 992px) { #members-personal-article #modal-member-9 .chara-broken { width: 180px; right: auto; left: -164px; top: 194px; } }
@media screen and (min-width: 1200px) { #members-personal-article #modal-member-9 .chara-broken { width: 180px; right: auto; left: -164px; top: 194px; } }
#members-personal-article #modal-member-10 .chara-broken { background-image: url("../images/chara-broken10.png"); width: 150px; left: 210px; top: -26px; }
@media screen and (min-width: 576px) { #members-personal-article #modal-member-10 .chara-broken { width: 180px; left: 337px; top: -70px; } }
@media screen and (min-width: 768px) { #members-personal-article #modal-member-10 .chara-broken { width: 180px; left: 202px; top: -34px; } }
@media screen and (min-width: 992px) { #members-personal-article #modal-member-10 .chara-broken { width: 180px; left: 202px; top: -34px; } }
@media screen and (min-width: 1200px) { #members-personal-article #modal-member-10 .chara-broken { width: 180px; left: 242px; top: -30px; } }
#members-personal-article #modal-member-11 .chara-broken { background-image: url("../images/chara-broken11.png"); width: 150px; left: 220px; top: -18px; }
@media screen and (min-width: 576px) { #members-personal-article #modal-member-11 .chara-broken { width: 180px; left: 220px; top: -36px; } }
@media screen and (min-width: 768px) { #members-personal-article #modal-member-11 .chara-broken { width: 180px; left: 220px; top: -28px; } }
@media screen and (min-width: 992px) { #members-personal-article #modal-member-11 .chara-broken { width: 180px; left: 220px; top: -33px; } }
@media screen and (min-width: 1200px) { #members-personal-article #modal-member-11 .chara-broken { width: 180px; left: 250px; top: -18px; } }
#members-personal-article #modal-member-12 .chara-broken { background-image: url("../images/chara-broken12.png"); width: 150px; left: -55px; top: -133px; }
@media screen and (min-width: 576px) { #members-personal-article #modal-member-12 .chara-broken { width: 180px; left: -85px; top: -159px; } }
@media screen and (min-width: 768px) { #members-personal-article #modal-member-12 .chara-broken { width: 180px; left: -355px; top: 147px; } }
@media screen and (min-width: 992px) { #members-personal-article #modal-member-12 .chara-broken { width: 180px; left: -425px; top: 183px; } }
@media screen and (min-width: 1200px) { #members-personal-article #modal-member-12 .chara-broken { width: 180px; left: -425px; top: 190px; } }

.content-about-us-details .heading header .inner .chara { display: block; aspect-ratio: 1 / 1; position: absolute; pointer-events: none; background-repeat: no-repeat; background-position: center; background-size: contain; width: 15%; top: 0; transform: translateY(-80%); }
@media screen and (min-width: 992px) { .content-about-us-details .heading header .inner .chara { width: 30%; transform: translateY(0); } }
.content-about-us-details .heading header .inner .chara.chara01 { background-image: url("../images/sm-chara01.webp"); left: 3%; }
@media screen and (min-width: 992px) { .content-about-us-details .heading header .inner .chara.chara01 { top: -10%; left: -10%; transform: rotate(-45deg); } }
.content-about-us-details .heading header .inner .chara.chara02 { background-image: url("../images/sm-chara02.webp"); left: 11%; }
@media screen and (min-width: 992px) { .content-about-us-details .heading header .inner .chara.chara02 { top: 2%; left: -19%; transform: rotate(-52deg); } }
.content-about-us-details .heading header .inner .chara.chara03 { background-image: url("../images/sm-chara03.webp"); display: none; }
@media screen and (min-width: 992px) { .content-about-us-details .heading header .inner .chara.chara03 { display: block; top: -10%; left: 79%; transform: rotate(45deg); } }
.content-about-us-details .heading header .inner .chara.chara04 { background-image: url("../images/sm-chara04.webp"); left: 72%; }
@media screen and (min-width: 992px) { .content-about-us-details .heading header .inner .chara.chara04 { top: 80%; left: -10%; transform: rotate(-135deg); } }
.content-about-us-details .heading header .inner .chara.chara05 { background-image: url("../images/sm-chara05.webp"); left: 80%; }
@media screen and (min-width: 992px) { .content-about-us-details .heading header .inner .chara.chara05 { top: 81%; left: 79%; transform: rotate(135deg); } }
.content-about-us-details .heading header .inner .chara.chara06 { background-image: url("../images/sm-chara06.webp"); display: none; }
@media screen and (min-width: 992px) { .content-about-us-details .heading header .inner .chara.chara06 { display: block; top: 68%; left: 88%; transform: rotate(135deg); } }

.hc-card .sm-chara-area { display: block; width: 100%; padding-top: 30%; position: absolute; top: 0; left: 0; transform: translateY(-100%); overflow: hidden; pointer-events: none; }
.hc-card .sm-chara-area .sm-chara { display: block; width: 100px; height: 100%; position: absolute; bottom: -16%; background-repeat: no-repeat; background-position: center bottom; background-size: contain; }
.hc-card .sm-chara-area .sm-chara.chara01 { background-image: url("../images/sm-chara09.webp"); left: 20%; }
.hc-card .sm-chara-area .sm-chara.chara02 { background-image: url("../images/sm-chara06.webp"); left: 55%; }
.hc-card .sm-chara-area .sm-chara.chara03 { background-image: url("../images/sm-chara03.webp"); left: 67%; }
.hc-card .sm-chara-area .sm-chara.chara04 { background-image: url("../images/sm-chara08.webp"); left: 57%; }
.hc-card .sm-chara-area .sm-chara.chara05 { background-image: url("../images/sm-chara01.webp"); left: 45%; }
.hc-card .sm-chara-area .sm-chara.chara06 { background-image: url("../images/sm-chara05.webp"); left: 57%; }