:root{
	--primary: #b33424;
	--primary-rgb: 179, 52, 36;
	--primary-a6: hsla(7, 67%, 42%, 0.6);


  --tint-gray: #c9c9c9;


  --mico-image: url(../images/common/mico.png);
  --mico-bgsize: 1em auto;
  --mico-size: 0.4rem;
  --root-font-size: 13.33333vmin;
  --font-serail: "AlimamaShuHeiTi-Bold", Alibaba Sans,PingFang SC,-apple-system,BlinkMacSystemFont,Segoe UI,Microsoft YaHei,Hiragino Sans GB,Helvetica Neue,Helvetica,Arial,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol;


	--white: #fff;
	--white-active: hsla(0,0%,100%,0.6);
	--white-0: rgba(255,255,255,0);
  --c0: hsla(0,0%,0%,1);
	--c0-active: hsla(0,0%,0%,0.6);
	--c3: hsla(0,0%,20%,1);
	--c3-active: hsla(0,0%,20%,0.6);
	--c6: hsla(0,0%,40%,1);
	--c6-active: hsla(0,0%,40%,0.6);
	--c8: hsla(0,0%,53%,1);
	--c8-active: hsla(0,0%,53%,0.6);
	--c9: hsla(0,0%,60%,1);
	--c9-active: hsla(0,0%,60%,0.6);
	--bg-active: rgba(0,0,0,0.05);
	--bd: 0.7px solid #eee;
}
/*加载字体*/
@font-face {
  font-family: "AlimamaShuHeiTi-Bold";
  font-weight: normal;
  src: local("AlimamaShuHeiTi-Bold"), url("../fonts/AlimamaShuHeiTi-Bold.woff2") format("woff2");
}
.ab-font{font-family: "AlimamaShuHeiTi-Bold";}

*{margin:0; padding:0; -webkit-box-sizing: border-box; box-sizing: border-box; -webkit-tap-highlight-color: rgba(0,0,0,0);}
html{font-size: var(--root-font-size); font-family: var(--font-serail);}
body{margin: 0 auto; min-width:320px; line-height: 1.5; font-size: 0.24em; color:#666; overflow-x: hidden; -webkit-overflow-scrolling: touch; -webkit-text-size-adjust: 100%!important; -ms-text-size-adjust: 100%!important; text-size-adjust: 100%!important;
}
html, body{scroll-behavior: smooth;}
article, aside, details, figcaption, figure, footer, header, hgroup, main, nav, section, summary{display: block;}
audio, canvas, progress, video{display: inline-block; vertical-align: baseline;}
audio:not([controls]){display: none; height: 0;}
[hidden], template{display: none;}
svg:not(:root){overflow: hidden;}
mark{background: #ff0; color: #000;}
small{font-size: 80%;}
sub, sup{font-size: 75%; line-height: 0; position: relative; vertical-align: baseline;}
sup{top: -0.5em;}
sub{bottom: -0.25em;}

table{border-collapse:collapse;}
ul{ list-style:none;}
img{border: 0; max-width: 100%;}
a img{vertical-align: bottom;}
a{text-decoration: none; color:#666; background-color: transparent; -webkit-tap-highlight-color: transparent;}
a:focus{outline:thin dotted}
a:active,a:hover{outline:0; text-decoration:none;}
h1,h2,h3,h4,h5{font-weight: normal; font-size: 1.2em;}
[v-cloak]{display: none;}

::-webkit-scrollbar{display: none;}

.fl{float: left}
.fr{float: right}
.al{text-align: left;}
.ac{text-align: center;}
.ar{text-align: right;}
.hide{display: none}
.overhide{overflow: hidden;}
.t-hide{-webkit-transform: translate3d(0,0,0); transform: translate3d(0,0,0); overflow: hidden;}

.clear, .clr{display: block; clear: both; height: 0; line-height: 0; font-size: 0; overflow: hidden;}
.clearfix2::before,.clearfix2::after{content:""; display: table;}
.clearfix2::after{clear: both;}
.clearfix2, .clearfix{*zoom:1;}
.clearfix:after{display: block; content: ""; clear: both; height: 0; visibility: hidden;}


.white-bg{background-color: var(--white);}

.mask{position: fixed; top: 0; bottom: 0; left: 0; right: 0; background-color: rgba(0,0,0,.5); opacity: 0; visibility: hidden; -webkit-transition-duration: 0.3s; transition-duration: 0.3s;}

.block-img{display: block; width: 100%;}
.pos-r-cover-image,
.pos-a-cover-image{display: block; width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover;}
.pos-r-cover-image{position: relative;}
.pos-a-cover-image{position: absolute; top: 0; left: 0;}
.text-hide{white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
.hide-el,
.hide-el--input{position: absolute; z-index: 5; top: 0; bottom: 0; right: 0; width: 100%; height: 100%; opacity: 0;}
.hide-el--input::-webkit-calendar-picker-indicator,
.hide-el--input::-webkit-file-upload-button,
.hide-el--input::file-selector-button{width: 100%; height: 100%;}
.nodata{display: block; text-align: center; padding: 0 0.24rem; font-size: 0.13rem; color: #ccc;}

.wbox, .wpbox{margin-bottom: 0.16rem; background-color: #fff; overflow: hidden;}
.wpbox{padding: 0 0.24rem;}

.d-flex, .wb, .flex-row{display: -webkit-box; display: flex;}
.wbc{display: -webkit-box; display: flex; -webkit-box-align: center; align-items: center;}
.align-center{-webkit-box-align: center; align-items: center;}
.flex-1, .wbw, .flex-main{-webkit-box-flex: 1; flex: 1; min-width: 0;}
.flex-side{margin-left: 0.2rem; position: relative; display: block; -webkit-box-flex: 1; flex: 1; min-width: 0; text-align: right;}
.self-top{-webkit-align-self: flex-start; align-self: flex-start;}
.self-center{-webkit-align-self: center; align-self: center;}
.self-end{-webkit-align-self: flex-end; align-self: flex-end;}


ins, .ins{text-decoration: none;}
ins + del{margin-left: 0.1rem;}

input, textarea, select, button{font-family: "DingTalkJinBuTi-Regular";}

::-webkit-input-placeholder{color: var(--tint-gray);}
:focus::-webkit-input-placeholder{color: #999;}
::-moz-placeholder{color: var(--tint-gray);}
:-ms-input-placeholder{color: var(--tint-gray);}
input::-webkit-outer-spin-button, input::-webkit-inner-spin-button{-webkit-appearance: none!important; margin: 0;}
input[type="search"]::-webkit-search-cancel-button, input[type="search"]::-webkit-search-decoration{-webkit-appearance: none;}
input[type="number"]{appearance: none; -moz-appearance: none; -webkit-appearance: none;}

.t1-placeholder{color: var(--tint-gray);}
.t1-input,
.t1-textarea{display: block; width: 100%; line-height: 0.4rem; font-size: 0.26rem; color: var(--c0); background-color: var(--white-0); border: none; border-radius: 0; outline: 0; box-shadow: none; -webkit-appearance: none; appearance: none;}
.t1-input{height: 0.4rem; white-space: nowrap; text-overflow: ellipsis; overflow: hidden;}


/*距离*/
.mt0, .my0, .m0{margin-top: 0!important;}.m0,.mb0,.my0{margin-bottom:0!important}.m0,.mx0,.ml0{margin-left:0!important}.m0,.mx0,.mr0{margin-right:0!important}.m10,.mt10,.my10{margin-top:0.1rem!important}.m10,.mb10,.my10{margin-bottom:0.1rem!important}.m10,.mx10,.ml10{margin-left:0.1rem!important}.m10,.mx10,.mr10{margin-right:0.1rem!important}.m20,.mt20,.my20{margin-top:0.2rem!important}.m20,.mb20,.my20{margin-bottom:0.2rem!important}.m20,.mx20,.ml20{margin-left:0.2rem!important}.m20,.mx20,.mr20{margin-right:0.2rem!important}.m30,.mt30,.my30{margin-top:0.3rem!important}.m30,.mb30,.my30{margin-bottom:0.3rem!important}.m30,.mx30,.ml30{margin-left:0.3rem!important}.m30,.mx30,.mr30{margin-right:0.3rem!important}.m40,.mt40,.my40{margin-top:0.4rem!important}.m40,.mb40,.my40{margin-bottom:0.4rem!important}.m40,.mx40,.ml40{margin-left:0.4rem!important}.m40,.mx40,.mr40{margin-right:0.4rem!important}.p0,.pt0,.py0{padding-top:0!important}.p0,.pb0,.py0{padding-bottom:0!important}.p0,.px0,.pl0{padding-left:0!important}.p0,.px0,.pr0{padding-right:0!important}.p10,.pt10,.py10{padding-top:0.1rem!important}.p10,.pb10,.py10{padding-bottom:0.1rem!important}.p10,.px10,.pl10{padding-left:0.1rem!important}.p10,.px10,.pr10{padding-right:0.1rem!important}.p20,.pt20,.py20{padding-top:0.2rem!important}.p20,.pb20,.py20{padding-bottom:0.2rem!important}.p20,.px20,.pl20{padding-left:0.2rem!important}.p20,.px20,.pr20{padding-right:0.2rem!important}.p30,.pt30,.py30{padding-top:0.3rem!important}.p30,.pb30,.py30{padding-bottom:0.3rem!important}.p30,.px30,.pl30{padding-left:0.3rem!important}.p30,.px30,.pr30{padding-right:0.3rem!important}.p40,.pt40,.py40{padding-top:0.4rem!important}.p40,.pb40,.py40{padding-bottom:0.4rem!important}.p40,.px40,.pl40{padding-left:0.4rem!important}.p40,.px40,.pr40{padding-right:0.4rem!important}.m25,.mt25,.my25{margin-top:0.25rem!important}.m25,.mb25,.my25{margin-bottom:0.25rem!important}.m25,.mx25,.ml25{margin-left:0.25rem!important}.m25,.mx25,.mr25{margin-right:0.25rem!important}.p25,.pt25,.py25{padding-top:0.25rem!important}.p25,.pb25,.py25{padding-bottom:0.25rem!important}.p25,.px25,.pl25{padding-left:0.25rem!important}.p25,.px25,.pr25{padding-right:0.25rem!important}

/*-------------------------结束公用样式--------------------------*/


[class*="btn"]:not(:disabled):not(.disabled):active [class*="ico"],
[class*="button"]:not(:disabled):not(.disabled):active [class*="ico"],
[class*="btn"]:not(:disabled):not(.disabled):active [class*="caret"],
[class*="button"]:not(:disabled):not(.disabled):active [class*="caret"]{opacity: 0.6;}






.mico{display: inline-block; width: 1em; height: 1em; background-repeat: no-repeat; background-position-x: 0; vertical-align: -0.15em;}

.mico{margin-right: 0.1rem; font-size: var(--mico-size); background-image: var(--mico-image); background-size: var(--mico-bgsize);}
.music.mico{background-position-y: 0;}
.down.mico{background-position-y: -1em;}


/*--main--*/


.film-app{position: relative; height: 100vh; background-color: var(--c3);}
.fullpage-notice{position: fixed; z-index: -1; top: 0; bottom: 0; left: 0; right: 0; display: -webkit-box; display: flex; -webkit-box-orient: vertical; flex-direction: column; -webkit-box-align: center; align-items: center; -webkit-justify-content: center; justify-content: center; text-align: center; font-size: 0.24rem; color: var(--wh); background-color: rgba(51,51,51,0); -webkit-transition: 0.3s; transition: 0.3s; opacity: 0; visibility: hidden; overflow: hidden;}
.show.fullpage-notice{background-color: var(--c3); z-index: 101; opacity: 1; visibility: visible;}
@media all and (orientation : landscape) {
	.landscape.fullpage-notice{background-color: var(--c3); z-index: 101; opacity: 1; visibility: visible;}
}

.stage{position: relative; width: 100%; height: 100%; -webkit-user-select: none; user-select: none; overflow: hidden;}
.scene{width: 100%; height: 100%; font-size: 0.3rem; color: var(--white); overflow: hidden;}
.scene-container{position: absolute; top: 0; left: 0; padding-top: 0.1px; padding-bottom: 0.1px; padding-bottom: calc(0.1px + constant(safe-area-inset-bottom)); padding-bottom: calc(0.1px + env(safe-area-inset-bottom)); width: 100%; height: 100%; background-size: cover; -webkit-transform: translate3d(0,0,0); transform: translate3d(0,0,0); overflow: hidden;}
.scene-card{position: absolute; top: 0; left: 0; -webkit-perspective: 20rem; perspective: 20rem; -webkit-transform: translate3d(0,0,0); transform: translate3d(0,0,0);}
.scene-card .scene-container{opacity: 1; -webkit-transition: 0.3s; transition: 0.3s; -webkit-backface-visibility: hidden; backface-visibility: hidden; -webkit-transform-style: preserve-3d; transform-style: preserve-3d;}
.scene-slip{position: relative;}
.scene-slip .scene-container{z-index: 1;}


.scene-container{-webkit-transform-origin: 50% 0;transform-origin: 50% 0;-webkit-animation: rotateBottomSideOut .8s forwards ease-in; animation: rotateBottomSideOut .8s forwards ease-in;}
.show.scene{z-index:5;}
.show.scene .scene-container{opacity:1!important;-webkit-animation:slideInFromBottomDelayed .8s forwards;animation:slideInFromBottomDelayed .8s forwards}
.scene-back .scene{opacity:1!important;-webkit-animation:slideOutToBottom .8s forwards;animation:slideOutToBottom .8s forwards}
.scene-back .show.scene{-webkit-transform-origin:50% 0;transform-origin:50% 0;-webkit-animation:rotateBottomSideIn .8s .1s forwards ease-in;animation:rotateBottomSideIn .8s .1s forwards ease-in}
@-webkit-keyframes rotateBottomSideOut{40%{-webkit-transform:rotateX(-15deg);-webkit-animation-timing-function:ease-out}100%{opacity:0;-webkit-transform:scale(.8) translateZ(-200px)}}@keyframes rotateBottomSideOut{40%{-webkit-transform:rotateX(-15deg);transform:rotateX(-15deg);-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}100%{opacity:0;-webkit-transform:scale(.8) translateZ(-200px);transform:scale(.8) translateZ(-200px)}}
@-webkit-keyframes slideInFromBottomDelayed{0%,30%{-webkit-transform:translateY(100%)}100%{-webkit-transform:translateY(0)}}
@keyframes slideInFromBottomDelayed{0%,30%{-webkit-transform:translateY(100%);transform:translateY(100%)}100%{-webkit-transform:translateY(0);transform:translateY(0)}}
@-webkit-keyframes slideOutToBottom{to{-webkit-transform:translateY(100%)}}
@keyframes slideOutToBottom{to{-webkit-transform:translateY(100%);transform:translateY(100%)}}
@-webkit-keyframes rotateBottomSideIn{0%{opacity:0;-webkit-transform:scale(.8) translateZ(-200px)}60%{-webkit-transform:scale(1) translateZ(0) rotateX(-15deg);-webkit-animation-timing-function:ease-out}100%{opacity:1;-webkit-transform:scale(1) translateZ(0) rotateX(0)}}
@keyframes rotateBottomSideIn{0%{opacity:0;-webkit-transform:scale(.8) translateZ(-200px);transform:scale(.8) translateZ(-200px)}60%{-webkit-transform:scale(1) translateZ(0) rotateX(-15deg);transform:scale(1) translateZ(0) rotateX(-15deg);-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}100%{opacity:1;-webkit-transform:scale(1) translateZ(0) rotateX(0);transform:scale(1) translateZ(0) rotateX(0)}}




.scene-music,
.scene-prev,
.scene-next{position: absolute; z-index: 6; right: 0.1rem; display: -webkit-box; display: flex; -webkit-box-orient: vertical; flex-direction: column; -webkit-justify-content: center; justify-content: center; -webkit-box-align: center; align-items: center; width: 0.46rem; height: 0.46rem; font-size: 0; border: 0.03rem solid var(--white); border-radius: 50%;}
.scene-music{top: 0.14rem; overflow: hidden;}
.scene-prev,
.scene-next{bottom: 0.25rem;}
.scene-prev{left: 0.7rem;}
.scene-next{opacity: 1; -webkit-transition: opacity 0.1s 0.2s, -webkit-transform 0.3s; transition: opacity 0.1s 0.2s, transform 0.3s;}
.scene-prev .next.mico{-webkit-transform: rotate(180deg); transform: rotate(180deg);}
.hide.scene-next{opacity: 0; -webkit-transform: translateX(1.4rem); transform: translateX(1.4rem); -webkit-transition: opacity 0.1s 0s, -webkit-transform 0.3s; transition: opacity 0.1s 0s, transform 0.3s;}
.scene-music::before{position: absolute; top: 0; left: 0; display: block; content: ""; width: 0; height: 140%; border-top: 0.03rem solid var(--white); -webkit-transform-origin: 0 0; transform-origin: 0 0; -webkit-transform: rotate(45deg); transform: rotate(45deg); -webkit-transition: 0.3s; transition: 0.3s;}
.paused.scene-music::before{width: 140%;}
.scene-music-ico-wrap{-webkit-animation: bgMusicRotating 2.4s linear infinite; animation: bgMusicRotating 2.4s linear infinite;}
.paused.scene-music .scene-music-ico-wrap{-webkit-animation-play-state: paused; animation-play-state: paused;}
@-webkit-keyframes bgMusicRotating {
	from{-webkit-transform: rotate(0deg); transform: rotate(0deg);}
	to{-webkit-transform: rotate(360deg); transform: rotate(360deg);}
}
@keyframes bgMusicRotating {
  from{transform: rotate(0deg);}
  to{transform: rotate(360deg);}
}

.animated{-webkit-animation-duration:1s;animation-duration:1s;-webkit-animation-fill-mode:both;animation-fill-mode:both}

.scene-column{display: -webkit-box; display: flex; -webkit-box-orient: vertical; flex-direction: column; -webkit-justify-content: center; justify-content: center; text-align: center;}


.t1-logo,
.t2-logo{display: block; background-size: cover;}
.t1-logo{padding-bottom: 25.333333%; background-image: url(../images/scene-1/logo.png);}
.t2-logo{margin-bottom: 0.5rem; padding-bottom: 29.239766%; background-image: url(../images/common/logo.png);}
@media (min-aspect-ratio: 1/2) {
  .t2-logo{margin-bottom: 0.3rem;}
}

.t1-scene{padding: 0.35rem 0.35rem calc(0.1px + constant(safe-area-inset-bottom)); padding: 0.35rem 0.35rem calc(0.1px + env(safe-area-inset-bottom)); background-color: var(--primary);}

.t1-frame{margin-bottom: 0.4rem; position: relative; display: -webkit-box; display: flex; -webkit-box-orient: vertical; flex-direction: column; -webkit-box-flex: 1; flex: 1; min-width: 0; min-height: 0; padding-left: 0.55rem; padding-right: 0.55rem; background-color: var(--white);}
.t1-frame-border,
.t1-frame-border::before,
.t1-frame-border::after{position: absolute; display: block; background-size: 6em auto;}
.t1-frame-border{
  --image: url(../images/common/frame-border.png);
  position: absolute; top: 0.25rem; bottom: 0.25rem;  width: 1em; font-size: 0.2rem; background-image: var(--image), var(--image), var(--image); background-repeat: no-repeat; background-position: -2em 0, 0 50%, -4em 100%;}
.t1-frame-border::before,
.t1-frame-border::after{left: 0; content: ""; width: 100%; background-image: var(--image); background-repeat: repeat-y; background-position: -5em 0;}
.left.t1-frame-border{left: 0.17rem;}
.right.t1-frame-border{right: 0.17rem;}
.t1-frame-border::before{top: 1.48rem; bottom: calc(50% + 1.48rem);}
.t1-frame-border::after{bottom: 1.48rem; top: calc(50% + 1.48rem);}

.t1-frame--container{-webkit-box-flex: 1; flex: 1; min-width: 0; min-height: 0; overflow-x: hidden; overflow-y: auto; -webkit-overflow-scrolling: touch; overscroll-behavior: contain; padding-top: 0.2rem; color: var(--primary);}




.x1-spactor,
.x1-spactor::before,
.x1-spactor::after{background-size: auto 6em;}
.x1-spactor{
  --image: url(../images/common/x1-spactor.png);
  position: relative; display: block; height: 1em; font-size: 0.12rem; background-image: var(--image), var(--image), var(--image); background-repeat: no-repeat; background-position: 50% 0, 0 -2em, 100% -4em;}
.x1-spactor::before,
.x1-spactor::after{position: absolute; left: 0; display: block; content: ""; height: 100%; background-image: var(--image); background-repeat: repeat-x; background-position: 0 -5em;}
.x1-spactor::before{left: 1.4rem; right: calc(50% + 0.7rem);}
.x1-spactor::after{right: 1.4rem; left: calc(50% + 0.7rem);}

.d1-title{
  --image: url(../images/common/d1-title.png);
  display: -webkit-box; display: flex; height: var(--size);}
.d1-title::before,
.d1-title::after{position: relative; -webkit-box-flex: 1; flex: 1; min-width: 0; display: block; content: ""; background-image: var(--image), -webkit-radial-gradient(circle closest-side, var(--primary) 86%, rgba(255,255,255,0)), -webkit-linear-gradient(0deg, var(--primary), var(--primary)); background-image: var(--image), radial-gradient(circle closest-side, var(--primary) 86%, rgba(255,255,255,0)), linear-gradient(90deg, var(--primary), var(--primary)); background-repeat: no-repeat; background-position: var(--bg-pos); background-size: auto 200%, var(--circle-size) var(--circle-size), calc(100% - var(--circle-size)/2) var(--line-size); -webkit-transform: translateX(var(--fixed-pos-x)); transform: translateX(var(--fixed-pos-x));}
.d1-title::before{
  --fixed-pos-x: 1px;
  --bg-pos: 100% 0, 0 50%, 100% 50%;
}
.d1-title::after{
  --fixed-pos-x: -1px;
  --bg-pos: 0 100%, 100% 50%, 0 50%;
}
.s1.d1-title{
  --size: 1rem;
  --text-gap-x: 0.15rem;
  --text-fz: 0.72rem;
  --circle-size: 0.2rem;
  --line-size: 0.06rem;
}
.s2.d1-title{
  --size: 0.5rem;
  --text-gap-x: 0.05rem;
  --text-fz: 0.4rem;
  --circle-size: 0.1rem;
  --line-size: 0.03rem;
}
.d1-title--text{display: block; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; padding: 0 var(--text-gap-x); line-height: var(--size); font-size: var(--text-fz); color: var(--white); background-color: var(--primary);}


.scene-1--next-button{position: absolute; z-index: 4; bottom: 0; left: 0; right: 0;}

.t1-join--title{margin: 0 auto 0.2rem; display: block; width: 4.9rem; height: 1.9rem; line-height: 0; font-size: 0; background-image: url(../images/common/join.png); background-size: cover;}

.t1-notice{margin-top: 0.4rem; margin-bottom: 0.4rem; text-align: center; line-height: 1.2; font-size: 0.28rem;}
.t2-notice{margin-top: 0.1rem; margin-bottom: 0.1rem; text-align: center; line-height: 1.2; font-size: 0.22rem; color: var(--primary);}


/* scene-1 */
.scene-container--1{background-color: var(--primary);}
.t1-letter{margin-bottom: 0.4rem; position: relative; -webkit-box-flex: 1; flex: 1; min-width: 0; min-height: 0; color: var(--primary); background-color: var(--white);}
.t1-letter::before{position: absolute; top: 0.5rem; bottom: 0.5rem; left: 0.3rem; right: 0.3rem; display: block; content: ""; border: 0.8rem solid #ccc; border-image: url(../images/scene-1/letter-border.png) 80 round;}
.t1-letter--badge{position: absolute; z-index: 3; right: 0.1rem; bottom: -0.3rem; display: block; width: 2.3rem; height: 2.3rem; background-image: url(../images/scene-1/badge.png); background-size: cover;}
.t1-letter--content{position: relative; z-index: 2; padding: 0.2rem 0.8rem 1.2rem;}
.t1-letter--title{margin: 0 auto; padding-left: 0.4rem; padding-right: 0.4rem; width: fit-content; height: 1rem; line-height: 1rem; font-size: 0.9rem; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; background-color: var(--white);}
.t1-letter--name{font-size: 0.54rem;}
.t1-letter--context{margin-top: 0.2rem; margin-bottom: 0.2rem; text-align: left; font-size: 0.44rem;}
.t1-letter--wel{text-align: center;}
.t1-letter--p{text-indent: 1.4em;}
.t1-letter--info-list{margin-left: -0.25rem; margin-top: -0.3rem; display: -webkit-box; display: flex; -webkit-flex-wrap: wrap; flex-wrap: wrap;}
.t1-letter--info-item{margin-top: 0.3rem; padding-left: 0.25rem; width: 50%;}
.full.t1-letter--info-item{width: 100%;}
.t1-letter--info-title{margin-bottom: 0.2rem;}
.t1-letter--info-title::before,
.t1-letter--info-title::after{width: 0.45rem; -webkit-box-flex: none; flex: none;}
.t1-letter--info-title-text{-webkit-box-flex: 1; flex: 1; min-width: 0;}
.t1-letter--info-dd{display: block; padding: 0.06rem; line-height: 0.4rem; font-size: 0.36rem; color: #231815; border: 0.02rem solid var(--primary);}

@media (min-aspect-ratio: 1/2) {
  .t1-letter--context{font-size: 0.36rem;}
}


/* scene-2 */
.scene-2--map{margin: 0 auto 0.2rem; position: relative; display: block; width: 4.74rem; height: 2.61rem; border: 0.03rem solid var(--primary); -webkit-transform: translate3d(0,0,0); transform: translate3d(0,0,0); overflow: hidden;}
.t1-section{margin-bottom: 0.5rem; text-align: center;}
.t1-section--title{margin: 0 auto 0.15rem; display: block; text-align: center; padding: 0.04rem 0.1rem; min-width: 2.4rem; max-width: 100%; width: fit-content; height: 0.68rem; line-height: 0.6rem; font-size: 0.51rem; color: var(--white); background-color: var(--primary); white-space: nowrap; text-overflow: ellipsis; overflow: hidden;}
.t1-section--text-1,
.t1-section--text-2{line-height: 1.2;}
.t1-section--text-1{font-size: 0.38rem;}
.t1-section--text-2{font-size: 0.32rem;}
.x1-schedule{display: -webkit-box; display: flex; -webkit-flex-wrap: wrap; flex-wrap: wrap; -webkit-justify-content: space-around; justify-content: space-around;}
.x1-schedule--item{text-align: center; min-width: 35%; line-height: 1.2;}
.x1-schedule--dt{margin-bottom: 0.1rem; display: -webkit-box; display: flex; -webkit-box-orient: vertical; flex-direction: column; -webkit-box-align: center; align-items: center; -webkit-justify-content: center; justify-content: center; height: 0.7rem; font-size: 0.34rem; border-bottom: 0.03rem solid var(--primary);}
.small.x1-schedule--dt{font-size: 0.28rem;}
.x1-schedule--dt-desc{font-size: 0.16rem;}
.x1-schedule--dd{font-size: 0.28rem;}




/* scene-3 */
.l1-film--item{
  --border: 0.04rem solid var(--primary);
  margin-bottom: 0.3rem; position: relative; display: block; padding: 0.2rem; border: var(--border);
}
.l1-film--poster{position: relative; display: block; padding-bottom: 94%; -webkit-transform: translate3d(0,0,0); transform: translate3d(0,0,0); overflow: hidden;}
.l1-film--check{position: absolute; right: 0.2rem; bottom: 0.3rem; width: 0.44rem; height: 0.44rem; -webkit-transform-origin: 0 100%; transform-origin: 0 100%; border: var(--border); border-radius: 0.06rem;}
.l1-film--check::before{position: absolute; bottom: 0; left: -0.05rem; display: block; content: ""; width: 0.5rem; height: 0.5rem; background-image: url(../images/common/checked.png); background-size: cover; opacity: 0; visibility: hidden;}
.checked.l1-film--check::before{opacity: 1; visibility: visible;}




/* scene-4 */
.t1-setting--item{margin-top: 0.25rem; margin-bottom: 0.25rem; padding: 0.1px 0.2rem; line-height: 0.4rem; font-size: 0.26rem; color: var(--c0); background-color: #f8f8f8; border-radius: 0.2rem;}
.t1-setting--group{margin-top: 0.16rem; margin-bottom: 0.16rem; position: relative; display: -webkit-box; display: flex; min-height: 0.4rem; overflow: hidden;}
.t1-setting--group-dt{margin-right: 0.2rem; font-size: 0.32rem;}
.t1-setting--group-dd{-webkit-box-flex: 1; flex: 1; min-width: 0; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; text-align: right;}
.t1-caretdown{display: -webkit-box; display: flex; -webkit-box-align: center; align-items: center; -webkit-justify-content: center; justify-content: center; width: 0.4rem; height: 0.4rem;}
.t1-caretdown::before{display: block; content: ""; border-top: 0.16rem solid var(--tint-gray); border-left: 0.16rem solid var(--white-0); border-right: 0.16rem solid var(--white-0); -webkit-transform: scaleX(0.6); transform: scaleX(0.6);}
.t1-setting--head{margin-top: 0.16rem; margin-bottom: 0.16rem; display: -webkit-box; display: flex; line-height: 0.4rem;}
.t1-setting--head-title{font-size: 0.32rem;}
.t1-setting--head-note{font-size: 0.2rem; color: var(--tint-gray);}
.x2-picker{margin-top: 0.2rem; margin-bottom: 0.3rem; display: -webkit-box; display: flex; -webkit-flex-wrap: wrap; flex-wrap: wrap; text-align: left;}
.x2-picker--item{margin-top: 0.2rem; position: relative; padding-left: 0.44rem; width: 50%; line-height: 0.4rem; font-size: 0.32rem;}
.x2-picker--item:nth-of-type(1),
.x2-picker--item:nth-of-type(2){margin-top: 0;}
.x2-picker--item::before{position: absolute; left: 0; top: 0.05rem; display: block; content: ""; padding: 0.1rem; width: 0.3rem; height: 0.3rem; -webkit-box-sizing: border-box; box-sizing: border-box; background-clip: content-box; border: 0.03rem solid var(--tint-gray); -webkit-transition: 0.3s; transition: 0.3s;}
.checked.x2-picker--item::before{padding: 0.04rem; background-color: var(--primary);}
.x2-picker--note{font-size: 0.2rem;}
.t1-note{margin-top: 0.25rem; margin-bottom: 0.25rem; text-align: center; padding-left: 0.25rem; padding-right: 0.25rem; font-size: 0.2rem; color: var(--tint-gray);}
.scene-4--submit-row{margin-bottom: 0.5rem;}




/* scene-5 */
.t1-frame--container__5{padding-top: 0.6rem;}
.t1-result{margin-top: 0.25rem; margin-bottom: 0.4rem; display: block; padding: 0.1rem 0.25rem 0.2rem; background-color: rgba(var(--primary-rgb),0.2); border-radius: 0.1rem; box-shadow: 0 0.05rem 0.1rem rgba(129,6,16,0.2);}
.t1-result--title{margin-top: 0.2rem; margin-bottom: 0.2rem; line-height: 1.1; font-size: 0.64rem;}
.t1-result--text{margin-top: 0.2rem; margin-bottom: 0.2rem; line-height: 1.2; font-size: 0.27rem;}
.scene-5--section{margin-top: 0.4rem; margin-bottom: 0.4rem;}
.t1-result--qrcode{margin: 0.5rem auto 0.4rem; position: relative; display: block; width: 3.5rem; height: 3.5rem; -webkit-transform: translate3d(0,0,0); transform: translate3d(0,0,0); overflow: hidden;}

.t3-section{margin-top: 0.3rem; margin-bottom: 0.3rem; text-align: center;}
.t3-section--title{margin-bottom: 0.15rem; line-height: 1.1; font-size: 0.6rem; color: var(--primary);}

.loading-dot{display: inline-block; text-align: left; height: 1em; line-height: 1; vertical-align: -0.25em;overflow: hidden;}
.loading-dot::before{display: block; content: '...\A..\A.'; white-space: pre-wrap; -webkit-animation: dot 3s infinite step-start both; animation: dot 3s infinite step-start both; letter-spacing: 0;}
@-webkit-keyframes dot{
  33%{-webkit-transform: translateY(-2em); transform: translateY(-2em);}
  66%{-webkit-transform: translateY(-1em); transform: translateY(-1em);}
}
@keyframes dot{
  33%{transform: translateY(-2em);}
  66%{transform: translateY(-1em);}
}





/*cpop*/
.c1-notice{position: fixed; left: 0; right: 0; top: 0; bottom: 0; width: auto; height: auto; display: none;}
.show.c1-notice{display: block; z-index: 100;}
.c1-notice--content{position: absolute; top: 50%; left: 50%; -webkit-transform: translate3d(-50%, -50%, 0); transform: translate3d(-50%, -50%, 0); z-index: 5; display: block; text-align: center; padding: 0.15rem 0.4rem; max-width: 90%; font-size: 0.26rem; color: var(--white); background-color: rgba(0,0,0,0.8); -webkit-animation: cpopSlideDown ease .3s forwards; animation: cpopSlideDown ease .3s forwards;}
.show.c1-notice .c1-notice--content{z-index: 2; -webkit-animation: cpopSlideUp ease 0.3s forwards; animation: cpopSlideUp ease 0.3s forwards;}

@-webkit-keyframes cpopSlideUp{
  from{-webkit-transform:translate3d(-50%, 100%, 0); transform:translate3d(-50%, 100%, 0);}
  to{-webkit-transform:translate3d(-50%, -50%, 0); transform:translate3d(-50%, -50%, 0);}
}
@keyframes cpopSlideUp{
  from{-webkit-transform:translate3d(-50%, 100%, 0); transform:translate3d(-50%, 100%, 0);}
  to{-webkit-transform:translate3d(-50%, -50%, 0); transform:translate3d(-50%, -50%, 0);}
}
@-webkit-keyframes cpopSlideDown{
  from{-webkit-transform:translate3d(-50%, 0, 0);transform:translate3d(-50%, 0, 0);}
  to{-webkit-transform:translate3d(-50%, 100%, 0);transform:translate3d(-50%, 100%, 0);}
}
@keyframes cpopSlideDown{
  from{-webkit-transform:translate3d(-50%, 0, 0);transform:translate3d(-50%, 0, 0);}
  to{-webkit-transform:translate3d(-50%, 100%, 0);transform:translate3d(-50%, 100%, 0);}
}
/*end cpop*/





/*btn*/

.large-button,
.middle-button{-webkit-align-items: center; align-items: center; -webkit-justify-content: center; justify-content: center; text-align: center; line-height: 1.1; border-radius: 0.18rem; border: none; outline: 0; -webkit-appearance: none; appearance: none; cursor: pointer; -webkit-transition: 0.3s; transition: 0.3s;}

.large-button{display: -webkit-box; display: flex;}
.middle-button{display: -webkit-inline-flex; display: inline-flex;}

.large-button{padding: 1px 0.1rem; width: 100%; height: 0.72rem; font-size: 0.36rem;}
.radius.large-button{padding-left: 0.5rem; padding-right: 0.5rem; border-radius: 0.45rem;}
.middle-button{padding: 1px 0.2rem; height: 0.6rem; font-size: 0.26rem;}
.radius.middle-button{border-radius: 0.3rem;}


.primary-button:not(.plain){color: var(--white); background-color: var(--primary);}
.primary-button:not(.plain):visited{color: var(--white);}
.primary-button:not(.plain):not(:disabled):active{color: var(--white-active); background-color: var(--primary-active);}


.fade-button{position: relative; overflow: hidden;}
.fade-button--circle{position: absolute; top: 50%; left: 50%; -webkit-transform: translateX(-50%) translateY(-50%); transform: translateX(-50%) translateY(-50%);}
.fade-button__hover .fade-button--circle{-webkit-animation: button-fade-circle 0.75s; animation: button-fade-circle 0.75s;}
.fade-button--circle::before{margin-top: 100%; position: relative; display: block; content: "";}
.fade-button--circle::after{position: absolute; top: 0; bottom: 0; left: 0; right: 0; content: ""; border-radius: 50%;}
.fade-button__hover .fade-button--circle::after{-webkit-animation: button-fade-circle-pseudo 0.75s; animation: button-fade-circle-pseudo 0.75s;}
@-webkit-keyframes button-fade-circle{0%{width:0}100%{width:100%}}
@keyframes button-fade-circle{0%{width:0}100%{width:100%}}
@-webkit-keyframes button-fade-circle-pseudo{0%{background:rgba(0,0,0,0.5)}100%{background:transparent}}
@keyframes button-fade-circle-pseudo{0%{background:rgba(0,0,0,0.5)}100%{background:transparent}}



:disabled.primary-button{color: var(--white); background: #dbdce0!important; cursor: not-allowed;}


/* maring\padding */
.padding-bottom-safe-area{padding-bottom: calc(0px + constant(safe-area-inset-bottom)); padding-bottom: calc(0px + env(safe-area-inset-bottom));}
.padding-bottom-safe-area-1{padding-bottom: calc(0.1px + constant(safe-area-inset-bottom)); padding-bottom: calc(0.1px + env(safe-area-inset-bottom));}

.mb15{margin-bottom: 0.15rem;}

.my50, .mt50{margin-top: 0.5rem;}
.my50, .mb50{margin-bottom: 0.5rem;}


/*font*/
.fz24{font-size: 0.24rem;}


/* color */
.primary-color, .primary-color:visited{color: var(--primary);}
.primary-color__active:active{color: var(--primary-a6);}
.tint-gray-color{color: #c1c1c1;}