@charset "UTF-8";
*,*::before,*::after{box-sizing:border-box;}
*{margin:0;padding:0;}
:where([hidden]:not([hidden='until-found'])){display:none!important;}
html{font-size:62.5%;-webkit-text-size-adjust:100%;}
@supports not (min-block-size:100dvb){html{block-size:100%;}}
body{min-block-size:100vh;min-block-size:100dvb;font-size:1.4rem;font-family:source-han-sans-japanese,system-ui,"Hiragino Sans","Yu Gothic","メイリオ",Meiryo,sans-serif;font-style:normal;line-height:1.7;letter-spacing:0.05em;text-align:center;color:#fff;background:#0d0d0d;-webkit-font-smoothing:antialiased;}
:where(input,button,textarea,select){font:inherit;color:inherit;}
:where(textarea){resize:vertical;}
:where(button,label,select,summary,[role='button'],[role='option']){cursor:pointer;}
:where(:disabled){cursor:not-allowed;}
:where(button){border:0;background:none;}
:where(ul,ol){list-style:none;}
:where(a){color:inherit;text-decoration:none;text-underline-offset:.2ex;}
:where(img,svg,video,canvas,audio,iframe,embed,object){display:block;}
:where(img,picture,svg,video,canvas){max-inline-size:100%;block-size:auto;}
img{width:100%;max-width:100%;height:auto;}
img[src$=".svg"]{width:100%;}
:where(table){border-collapse:collapse;border-spacing:0;}
:where(p,h1,h2,h3,h4,h5,h6){overflow-wrap:break-word;}
:where(h1,h2,h3){line-height:1.2;}
:where(hr){border:none;border-block-start:1px solid currentColor;}
:where(:focus-visible){outline:2px solid var(--focus-color,Highlight);outline-offset:2px;}
:where(.visually-hidden:not(:focus,:active,:focus-within,.not-visually-hidden)){position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip-path:inset(50%)!important;white-space:nowrap!important;border:0!important;}

:root{--font-color:#fff;--accent-color:#ffb82c;--bg-color1:#880e0e;--bg-color2:#0d0d0d;--sec-space:40px 20px;}
@media only screen and (min-width:1200px) {
:root{--sec-padding:30px 0;}
}

html{scroll-behavior:smooth;}

.en{font-family: "acumin-pro-extra-condensed",source-han-sans-japanese, sans-serif;}

img{width:100%;height:auto;}
img[src$=".svg"]{width:100%;}

/*Layout*/
a{color:#140b0b; text-decoration:underline; opacity: 1; transition: 0.5s;}
a:hover{opacity:.7;}

br.pc{display:none;}
br.smp{display:block;}
br.tbl{display:block;}
@media only screen and (min-width:540px) {
br.smp{display:none;}
}
@media only screen and (min-width:840px) {
br.tbl{display:none;}
}
@media only screen and (min-width:740px) {
br.pc{display:block;}
}

h2{color:var(--font-color); font-size:1.6rem; text-align:left; line-height:1.5;}
h2.en{font-family: "acumin-pro-extra-condensed", sans-serif; font-weight: 700; font-style: normal; letter-spacing:.2em;font-size:2.8rem;text-align:center;}
@media only screen and (min-width:460px) {
h2{font-size:clamp(1.9rem,calc(1.42rem + 1.2vw),2.2rem);}
h2 span{display:block;}
h2.en{font-size:clamp(3rem,calc(1.15rem + 4.93vw),4.8rem);}
}



.box{max-width:760px; margin:0 auto;}
.mt20{margin-top:20px;}
.mt40{margin-top:40px;}
.mt60{margin-top:60px;}

body{}
header{position:relative;}
header .fvtitle{position:absolute; bottom:calc(100% / 16); left:0; right:0; width:80%; margin:0 auto; max-width:600px;}
header .fvtitle.birthday{bottom:50%;transform:translateY(50%);}

header .fvimage img{width:110%; object-fit:cover; object-position:bottom center; aspect-ratio:6 / 4.3;}
header .fvimage.birthday img{width:100%;object-fit:contain;}
header .slick-dots{display:flex; justify-content:center; gap:8px; margin:0 0 0; bottom:-12px; padding:0; list-style:none;}
header .slick-dots li{width:auto; height:auto; margin:0;}
header .slick-dots li button{display:block; width:20px; height:3px; padding:0; border:0; border-radius:0; background:#999; font-size:0; line-height:0; cursor:pointer; opacity:.4; transition:width .3s ease,opacity .3s ease,background .3s ease;}
header .slick-dots li button::before{display:none;}
header .slick-dots li.slick-active button{width:30px; background:rgba(4, 1, 1, 0.8); opacity:1;}

@media only screen and (min-width:760px) {
/* header .fvimage img{aspect-ratio:6 / 4; object-position:bottom center;} */
header .fvimage img{aspect-ratio:16 / 9; object-position:bottom center;}
header .fvtitle{position:absolute; bottom:calc(100% / 30); left:0; right:0; width:70%; margin:0 auto; max-width:900px;}
header .fvtitle.birthday{width:50%;bottom:50%;transform:translateY(50%);}
}
@media only screen and (min-width:1200px) {
header .fvimage img{object-position:bottom center; max-height:95vh;}
header .fvimage img
header .fvimage.birthday img{width:100%; max-height:initial;}
}

.mainnavi{position:fixed;top:0;left:0;width:100%;z-index:1200;pointer-events:none;}
.menu-toggle{position:fixed; top:0; right:0; z-index:1100; width:46px; height:46px; display:flex; flex-direction:column; justify-content:center; align-items:center; gap:6px; border:none; background:rgba(4, 1, 1, 0.8); pointer-events:auto; cursor:pointer; appearance:none; -webkit-appearance:none;}
.menu-toggle__line{display:block; width:24px; height:2px; background:#fff; transition:transform .3s ease,opacity .3s ease;}
.menu-toggle.is-open .menu-toggle__line:nth-child(1){transform:translateY(8px) rotate(45deg);}
.menu-toggle.is-open .menu-toggle__line:nth-child(2){opacity:0;}
.menu-toggle.is-open .menu-toggle__line:nth-child(3){transform:translateY(-8px) rotate(-45deg);}

.drawer{position:fixed;inset:0;z-index:1000;visibility:hidden;pointer-events:none;}
.drawer.is-open,.drawer.is-closing{visibility:visible;}
.drawer.is-open{pointer-events:auto;color:#fff;}
.drawer__overlay{position:absolute;inset:0;background:rgba(0,0,0,.4);opacity:0;transition:opacity .4s ease;}
.drawer.is-open .drawer__overlay{opacity:1;}
.drawer.is-closing .drawer__overlay{opacity:0;}
.drawer__panel{position:absolute;inset:0;background:#0d0d0d;clip-path:polygon(100% 0,100% 0,100% 100%,100% 100%);transition:clip-path .6s cubic-bezier(.77,0,.18,1);overflow:auto;}
.drawer.is-open .drawer__panel{clip-path:polygon(12% 0,100% 0,100% 100%,0 100%);}
.drawer.is-closing .drawer__panel{clip-path:polygon(100% 0,100% 0,100% 100%,100% 100%);}
.drawer__panel::before{content:"";position:absolute;inset:0;background:url("../lib/bg2.webp") center/cover no-repeat;pointer-events:none;}
.drawer__panel::after{content:"";position:absolute;inset:0;background:#cc0000;transform:translateX(110%) skewX(-8deg);z-index:1;pointer-events:none;opacity:0;}
.drawer.is-open .drawer__panel::after{opacity:1;animation:menu-red-slash .55s .05s both;}
.drawer.is-closing .drawer__panel::after{animation:none!important;opacity:0!important;transform:translateX(110%) skewX(-8deg)!important;}
.drawer__nav{padding:80px 20px 0 0;text-align:right;position:relative;z-index:2;color:#fff;font-family:"acumin-pro-extra-condensed",sans-serif;font-weight:700;font-style:normal;font-size:3.4rem;letter-spacing:.2rem;line-height:1.2;}
.drawer__nav li{margin-bottom:20px;}
.drawer__nav a{color:#fff;text-decoration:none;}
.drawer_link_ch a{color:#fff;}
.drawer__item{opacity:0;transform:translateX(35px);will-change:transform,opacity;}
.drawer__item{backface-visibility:hidden;-webkit-backface-visibility:hidden;}
.drawer__item{opacity:0;transform:translateX(35px);will-change:transform,opacity;}
.drawer__item{opacity:0;transform:translateX(35px);will-change:transform,opacity;}
.drawer.is-open .drawer__item{animation:menu-item-in .45s forwards;}
.drawer.is-open .drawer__item:nth-child(1){animation-delay:.32s;}
.drawer.is-open .drawer__item:nth-child(2){animation-delay:.39s;}
.drawer.is-open .drawer__item:nth-child(3){animation-delay:.46s;}
.drawer.is-open .drawer__item:nth-child(4){animation-delay:.54s;}
.drawer.is-open .drawer__item:nth-child(5){animation-delay:.62s;}
.drawer.is-closing .drawer__item{animation:menu-item-out .35s ease-in forwards;}
.drawer.is-closing .drawer__item:nth-child(1){animation-delay:0s;}
.drawer.is-closing .drawer__item:nth-child(2){animation-delay:.03s;}
.drawer.is-closing .drawer__item:nth-child(3){animation-delay:.06s;}
.drawer.is-closing .drawer__item:nth-child(4){animation-delay:.09s;}
.drawer.is-closing .drawer__item:nth-child(5){animation-delay:.12s;}

@media screen and (min-width:741px){
.drawer__close{top:24px;right:24px;}
.drawer__panel{left:auto;width:36%;min-width:400px;}
.drawer.is-open .drawer__panel{clip-path:polygon(12% 0,100% 0,100% 100%,0 100%);}
}

@keyframes menu-red-slash{0%{transform:translateX(110%) skewX(-8deg);}45%{transform:translateX(0) skewX(-8deg);}100%{transform:translateX(-110%) skewX(-8deg);}}
@keyframes menu-item-in{0%{opacity:0;transform:translateX(35px);}100%{opacity:1;transform:translateX(0);}}
@keyframes menu-item-out{0%{opacity:1;transform:translateX(0);}100%{opacity:0;transform:translateX(60px);}}

body.is-menu-open{overflow:hidden;}

@media screen and (min-width:741px){
.menu-toggle{top:24px; right:24px;}
}

@media (prefers-reduced-motion:reduce){
.menu-toggle__line{transition:none;}
}




#allimg{position:relative;isolation:isolate;}
#allimg::before{content:"";position:fixed;inset:0;background:url("../lib/bg3.webp") center center / cover no-repeat;pointer-events:none;z-index:2;}
#allimg section{position:relative;}
#allimg .red{padding:30px 20px;background:var(--bg-color1);}
#allimg .bk{padding:30px 20px;background:var(--bg-color2);}
#allimg section > *{position:relative;z-index:3;}

#fv{position:relative; z-index:8; background:#0d0d0d;}
#fv img{max-width:960px; margin:0 auto;}

#date{padding:30px 0;}
#date img{max-width:470px; margin:0 auto; width:80%;}

#eventinfo.red{padding-top:15px;}
#eventinfo .box{position:relative;}
#eventinfo h2{padding-top:35px; padding-bottom:8px; border-bottom:1px solid #fff;}
#eventinfo p{margin-top:16px; text-align:left;text-align:justify;text-justify:inter-character;line-break:strict;word-break:normal;overflow-wrap:break-word;font-feature-settings:"palt";}
#eventinfo .btn{position:absolute; top:0; right:0;}
#eventinfo .btn a{display:block; border:1px solid #fff; background:rgba(0, 0, 0, 0.3); color:#fff; padding:2px 16px; text-decoration:none; font-size:2rem; line-height:1;font-weight:600;}
@media screen and (min-width:741px){
#eventinfo h2{text-align:center;}
}

#ticket .type span{font-size:.8em;}
#ticket .section-title{width:100%;margin:20px auto 10px;padding:4px 0;background:#e60000;color:#fff;font-size:clamp(1.7rem,calc(1.51rem + .52vw),1.9rem);font-weight:700;line-height:1.2;text-align:center;clip-path:polygon(2.5% 0,100% 0,97.5% 100%,0 100%);}

#ticket p{text-align:left;}

#ticket .ordertitle{display:inline-block; padding:2px 8px; margin:6px auto; background:#ccc; font-weight:600;}
#ticket .orderdate{margin-bottom:4px; font-size:1.7rem; font-weight:700;}
#ticket .orderdate span,#ticket .orderdate2 span{font-size:.8em;}
#ticket .orderbtn span{font-size:.85em;}
#ticket .note ul{font-size:1.3rem;}
#ticket .note ul li{text-align:left; text-indent:-1.2rem; padding-left:1rem;}
#ticket .note ul li:before{content:"＊";}

#ticket .note.center ul li{text-align:center;}

#ticket .orderbtn a{display: block; position: relative; margin:16px auto; padding:10px 0 10px 0;  border-radius: 60px; text-decoration: none; transition: all 0.3s ease; line-height: 1.4; text-align:center; letter-spacing:0; background:#ffbd00; font-size:1.6rem; font-weight:700; max-width:280px; min-width:260px;}
#ticket .orderbtn a::after{content:"";position:absolute;top:26%;right:20px;width:24px;height:24px;background:url("../lib/btn-arrow.webp") center/contain no-repeat;}
#ticket .orderbtn.en a{font-size:2.1rem;}

#ticket .orderbtn2{display: block; position: relative; margin:16px auto; padding:10px 0 10px 0;  border-radius: 60px; text-decoration: none; transition: all 0.3s ease; line-height: 1.4; text-align:center; letter-spacing:0; background:#999; font-size:1.6rem; font-weight:700; max-width:280px; min-width:260px;color:#000;}
#ticket .orderbtn2::after{content:"";position:absolute;top:26%;right:20px;width:24px;height:24px;background:url("../lib/btn-arrow.webp") center/contain no-repeat;}


#ticket .contact{margin-top:60px;}
#ticket .contact a{color:#fff;}
#ticket .notetitle{margin-top:16px;text-align:left; font-weight:600;}
#ticket .notetitle:before{content:"<";}
#ticket .notetitle:after{content:">";}

#ticket .history{width:90%; margin:60px auto 0; font-size:1.3rem; text-align:left;}
#ticket .history .historytitle{font-weight:600; margin-bottom:8px; padding-bottom:8px; border-bottom:1px solid #fff;text-align:center;}
#ticket .history ul{width:fit-content; margin:0 auto; text-align:center;}
#ticket .history a{color:#fff; text-decoration:underline;}

@media screen and (min-width:741px){
#ticket p{text-align:center;}
#ticket .ticketinfo{display:flex; width:90%; margin:0 auto; gap:16px; justify-content:space-between; align-items:center;}
#ticket .ticketinfo{text-align:left;}
#ticket .note{width:90%; margin:0 auto;}
#ticket .orderbtn2{display:block;position:relative;margin:16px auto;padding:10px 0;border-radius:60px;text-decoration:none;transition:all 0.3s ease;line-height:1.4;text-align:center;letter-spacing:0;background:#999;font-size:1.6rem;font-weight:700;max-width:280px;min-width:260px;color:#000;}
#ticket .orderbtn2 span{display:inline-block; font-size:.9em;}
}
@media screen and (min-width:741px){
#ticket .btnbox2{display:flex;gap:16px;justify-content:center;margin:16px auto;}
#ticket .btnbox2 .orderbtn2{margin:0;}
}

#profile h3{text-align:left; margin-top:20px;}
#profile .profileimg{margin-top:10px;}
#profile p{margin-top:16px; text-align:left;text-align:justify;text-justify:inter-character;line-break:strict;word-break:normal;overflow-wrap:break-word;font-feature-settings:"palt";}

#profile #disc{max-width:700px; margin:40px auto 0;}
#profile #disc .discimg{max-width:260px; margin:0 auto 8px;}
#profile #disc .discinfo{font-size:1.7rem;color:#f6e1b9; line-height:1.5;}
#profile #disc .btn a{display: block; position: relative; margin:16px auto; padding:10px 0;  border-radius: 60px; text-decoration: none; transition: all 0.3s ease; line-height: 1; text-align:center; letter-spacing:0; background:rgba(0, 0, 0, 0.3); font-size:2rem; font-weight:700; max-width:280px; min-width:260px;border:1px solid #f6e1b9;color:#f6e1b9;}
#profile #disc .btn a::after{content:"";position:absolute;top:20%;right:20px;width:24px;height:24px;background:url("../lib/btn-arrow2.webp") center/contain no-repeat;}

@media screen and (min-width:741px){
#profile .profileimg{float:right;width:42%;max-width:460px;margin:0 0 20px 25px;}
#profile .profiletxt::after{content:"";display:block;clear:both;}

#profile #disc{max-width:550px; display:flex; gap:20px; justify-content:center; align-items:center;}
#profile #disc .discinfo{text-align:left;}

}

#fes{position:relative; z-index:4;background:rgba(11, 158, 120, 0.821);padding:30px 20px;}
#fes h2{padding-top:35px; padding-bottom:8px; border-bottom:1px solid #fff;text-align:center; font-weight:900;font-size:2.4rem;}
#fes .festitle{font-family: "acumin-pro-extra-condensed", sans-serif; font-weight: 700; font-style: normal; letter-spacing:.2em;font-size:2.8rem;text-align:center;letter-spacing:.1rem; line-height:1.2;}
#fes p{font-size:1.5rem;}
#fes .festitle span{display:block;font-size:.9em;}
#fes .fesdate{max-width:346px; width:70%; margin:20px auto 10px;}
#fes .fesdate span{font-size:.75em;}
#fes .venue{font-weight:700; font-size:1.9rem;margin-bottom:8px;}
#fes .btn a{display: block; position: relative; margin:16px auto; padding:15px 0 15px 0;  border-radius: 60px; text-decoration: none; transition: all 0.3s ease; line-height: 1.4; text-align:center; letter-spacing:0; background:#ffdf10; font-size:1.6rem; font-weight:700; max-width:300px; min-width:260px;}
#fes .btn a::after{content:"";position:absolute;top:26%;right:20px;width:24px;height:24px;background:url("../lib/btn-arrow.webp") center/contain no-repeat;}
#fes .act{margin:20px 0 8px; display:inline-block; background:#fff; color:rgba(11, 158, 120, 0.821);font-weight:700; width:40%;}
#fes ul li{display:inline-block;}
#fes ul li:after{content:" / ";}
#fes ul li:last-child:after{content:"";}

@media only screen and (min-width:460px) {
#fes .fesdate{font-size:clamp(3rem,calc(1.15rem + 4.93vw),4rem);}
#fes .festitle{font-size:clamp(3rem,calc(1.15rem + 4.93vw),4.8rem);}
#fes .festitle span{font-size:.8em;}
#fes .venue{font-weight:700; font-size:2.4rem;}
}

#links .btn a{display: block; position: relative; margin:16px auto; padding:10px 0;  border-radius: 60px; text-decoration: none; transition: all 0.3s ease; line-height: 1; text-align:center; letter-spacing:0; background:rgba(0, 0, 0, 0.3); font-size:2rem; font-weight:700; max-width:280px; min-width:260px;border:1px solid #f6e1b9;color:#f6e1b9;}
#links .btn a::after{content:"";position:absolute;top:20%;right:20px;width:24px;height:24px;background:url("../lib/btn-arrow2.webp") center/contain no-repeat;}
#links .sns ul{margin:20px auto; display:flex; gap:20px; justify-content:center;}
#links .sns ul li{width:34px;}
@media screen and (min-width:741px){
#links .box{display:flex; gap:16px; justify-content:center;}
}

#english .type span{font-size:.8em;}
#english .section-title{width:100%;margin:10px auto;padding:4px 0;background:#e60000;color:#fff;font-size:clamp(1.7rem,calc(1.51rem + .52vw),1.9rem);font-weight:700;line-height:1.2;text-align:center;clip-path:polygon(2.5% 0,100% 0,97.5% 100%,0 100%);}

#english .ordertitle{display:inline-block; padding:2px 8px; margin:6px auto; background:#ccc; font-weight:600;}
#english .orderdate{margin-bottom:4px; font-size:1.7rem; font-weight:700;}
#english .orderdate span,#english .orderdate2 span{font-size:.8em;}
#english .note ul{font-size:1.3rem;}
#english .note ul li{text-align:left; text-indent:-1.2rem; padding-left:1rem;}
#english .note ul li:before{content:"＊";}

#english .orderbtn a{display: block; position: relative; margin:16px auto; padding:15px 0 15px 0;  border-radius: 60px; text-decoration: none; transition: all 0.3s ease; line-height: 1.4; text-align:center; letter-spacing:0; background:#ffbd00; font-size:1.6rem; font-weight:700; max-width:280px; min-width:300px;}
#english .orderbtn a::after{content:"";position:absolute;top:26%;right:20px;width:24px;height:24px;background:url("../lib/btn-arrow.webp") center/contain no-repeat;}
#english .orderbtn span{font-size:.85em;}
#english .orderbtn.btn2 a{max-width:400px; min-width:300px; width:80%;}
#english .orderbtn.btn2 span{display:block; font-size:1.4rem; font-weight:400;}
#english .orderbtn.en a,#english .orderbtn2.en{font-size:2.1rem;}
#english .contact{margin-top:30px;}
#english .contact a{color:#fff;}
#english .notetitle{margin-top:16px;text-align:left; font-weight:600;}
#english .notetitle:before{content:"<";}
#english .notetitle:after{content:">";}


#english .history{width:90%; margin:60px auto 0; font-size:1.3rem; text-align:left;}
#english .history .historytitle{font-weight:600; margin-bottom:8px; padding-bottom:8px; border-bottom:1px solid #fff;text-align:center;}
#english .history ul{width:fit-content; margin:0 auto; text-align:center;}
#english .history a{color:#fff; text-decoration:underline;}

@media screen and (min-width:741px){
#english .ticketinfo{display:flex; width:90%; margin:0 auto; gap:16px; justify-content:space-between; align-items:center;}
#english .ticketinfo{text-align:left;}
#english .note{width:90%; margin:0 auto;}
}

#english .orderbtn2{display:block;position:relative;margin:16px auto;padding:10px 0;border-radius:60px;text-decoration:none;transition:all 0.3s ease;line-height:1.4;text-align:center;letter-spacing:0;background:#999;font-size:1.6rem;font-weight:700;max-width:280px;min-width:260px;color:#000;}
#english .orderbtn2 span{display:inline-block; font-size:.85em;}
@media screen and (min-width:741px){
#english .btnbox2{display:flex;gap:16px;justify-content:center;margin:16px auto;}
#english .btnbox2 .orderbtn2{margin:0;}
}


.information{padding:var(--sec-space);}
.information ul{margin-top:20px; padding:6px 20px 20px; text-align:left; overflow-y:scroll; height:360px;}
.information ul::-webkit-scrollbar {width:4px;}
.information ul::-webkit-scrollbar-track {background-color: #fff; border-radius: 100px;}
.information ul::-webkit-scrollbar-thumb {background-color: 
#7e7979; border-radius: 100px;}
.information ul li{margin-bottom:8px; padding-bottom:8px;}
.information ul li .date{display:block; letter-spacing:0; font-weight:500; font-size:clamp(1.4rem,calc(1.4rem + 0.2 * ((100vw - 375px) / 525)),1.6rem);}

.information ul li a{text-decoration:underline!important; font-weight:400; line-height:1.4;}
.information ul li a .en{display:block; font-size:1.46rem;}
.information ul li a:hover{opacity:.7;}
@media only screen and (min-width:760px) {
.information{margin:50px auto 0; max-width:760px; width:90%;}
.information ul{padding-bottom:0; height:205px;}
}
@media only screen and (min-width:1100px) {
.information{width:100%;}
}

#container{overflow-x:hidden;}

.movie{position:relative; aspect-ratio: 16 / 9; width: 100%; margin:0 auto; height: auto;}
.movie iframe {position: absolute; left: 0; top: 0; height: 100%; width: 100%;}

footer{position:relative;padding:40px 20px 30px; font-size:1.3rem; font-weight:400; text-align:left; font-weight:400;text-align:left; background:#231815; color:#fff; z-index:8;}
footer a{color:#fff;}
footer p{margin-bottom:4px;}
footer .copy{margin-top:30px; font-size:1.2rem; font-size:1.2rem; letter-spacing:0; text-align:center;}
@media only screen and (min-width:760px) {
footer{font-size:1.4rem; text-align:left;}
footer p{margin-bottom:4px;}
}

/*fadein*/
.fadein{opacity:0;transform:translateY(5px);transition:opacity .7s ease,transform .7s ease;animation-duration:1.5s; animation-fill-mode:forwards;}
.fadein.is-show{opacity:1;transform:translateY(0);}

/*TOP PAGE*/
.pagetop{position:fixed;right:15px;bottom:15px;z-index:900;width:44px;height:44px;background:rgba(0,0,0,.8);border:1px solid rgba(255,255,255,.5);transition:background .3s ease,transform .3s ease;}
.pagetop::before{content:"";position:absolute;top:17px;left:50%;width:10px;height:10px;border-top:2px solid #fff;border-left:2px solid #fff;transform:translateX(-50%) rotate(45deg);}
.pagetop:hover{background:#cc0000;transform:translateY(-3px);}