@charset "utf-8";

.h_bar, 
#beltbnr {
	display: none;
}

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

/*--フォント--*/
#specialty h1, #specialty h2, #specialty h3, #specialty h4, #specialty h5, #specialty p, #specialty ul, #specialty li, #specialty a {
  font-family: "游明朝体 Pr6N R";
}

.ffKL {
  font-family: "霞白藤 L" !important;
}
.ffKR {
  font-family: "霞白藤 R" !important;
}
.ffKM {
  font-family: "霞白藤 M" !important;
}
.ffKB {
  font-family: "霞白藤 B" !important;
}

/*--SP--*/
@media only screen and (max-width: 767px) {
.sp {
  display: block;
}
.pc {
  display: none;
}
/* MAIN */
main {
  width: 100%;
  margin: 0 auto;
}

/* KV */
.kv {
  margin-bottom: 20px;
}

.kv .imgWrap {
  margin-bottom: 20px;
  display: flex;
  justify-content: center;
  align-items: center;
}
.kv .imgWrap .title {
  width: 14.67%;
  text-align: center;
}
.kv .imgWrap .title h1 {
  font-size: 2.6rem;
  -ms-writing-mode: tb-rl;
  writing-mode: vertical-rl;
  display: inline-block;
}
.kv .imgWrap .img {
  width: 85.33%;
}

.kv .txtWrap {
  width: calc(100% - 35px);
  margin: 0 auto;
}
.kv .txtWrap .issue {
  margin-bottom: 15px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  text-align: left;
}
.kv .txtWrap .issue .number {
  font-size: 1.8rem;
  font-style: italic;
  line-height: 1;
  text-decoration-line: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
}
.kv .txtWrap .issue .date {
  font-size: 1.2rem;
  line-height: 1.2;
  text-align: right;
}
.kv .txtWrap .title {
  text-align: center;
}
.kv .txtWrap .title .line {
  padding: 10px;
	position: relative;
}
.kv .txtWrap .title .line::before, 
.kv .txtWrap .title .line::after {
  position: absolute;
  content: "";
  width: 0;
  height: 1px;
  background: #000000;
}
.kv .txtWrap .title .line2::before, 
.kv .txtWrap .title .line2::after {
  position: absolute;
  content: "";
  width: 1px;
  height: 0;
  background: #000000;
}
/*上*/
.kv .txtWrap .title .line::before {
  top: 0;
  left: 0;
  animation: lineAnime .5s linear 1.5s forwards;
}
/*右*/
.kv .txtWrap .title .line2::before { 
  top: 55%;
  right: 0;
  animation: lineAnime2 .5s linear 1s forwards;
}
/*下*/
.kv .txtWrap .title .line::after { 
  bottom: 0;
  right: 0;
  animation: lineAnime .5s linear 1.5s forwards;
}
/*左*/
.kv .txtWrap .title .line2::after { 
  bottom: 55%;
  left: 0;
  animation: lineAnime2 .5s linear 1s forwards;
}
@keyframes lineAnime {
  0% {width: 0%;}
  100% {width: 15%;}
}
@keyframes lineAnime2 {
  0% {height: 0%;}
  100% {height: 45%;}
}
.kv .txtWrap .title h2 {
  font-size: 2.6rem;
  line-height: 1.6;
}
.kv .txtWrap .title h2 span.sp {
  font-size: 1rem;
}

/* SECTION 1 */
.section01 {
  width: calc(100% - 70px);
  margin: 0 auto 25px;
}

.section01 .line {
  display: none;
}

.section01 .inner .txtWrap p {
  font-size: 1.2rem;
  line-height: 2;
  text-align: center;
}
.section01 .inner .imgWrap {
  margin-bottom: 15px;
}

/* SECTION 2 */
.section02 {
  position: relative;
  margin-bottom: 50px;
}

.section02 .box {
  position: absolute;
  width: 100%;
  height: 88%;
  background-color: #e4e2d9;
}

.section02 .inner {
  position: relative;
}
.section02 .inner .txtWrap {
  padding-top: 30px;
}
.section02 .inner .txtWrap h3 {
  position: absolute;
  padding-left: 10px;
  font-size: 2.4rem;
  line-height: 1.2;
  color: #000000;
  -ms-writing-mode: tb-rl;
  writing-mode: vertical-rl;
  text-orientation: upright;
  text-align: left;
  z-index: 2;
}
.section02 .inner .txtWrap .img {
  margin-top: 30px;
}
.section02 .inner .txtWrap .txt p {
  width: calc(100% - 70px);
  margin: 30px auto 0;
  font-size: 1.2rem;
  line-height: 2.4;
  text-align: left;
}
.section02 .inner .creditWrap .credit {
  width: calc(100% - 70px);
  margin: 0 auto;
  padding: 30px 0;
}
.section02 .inner .creditWrap .credit ul {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
}
.section02 .inner .creditWrap .credit li {
  margin-bottom: 10px;
  text-align: left;
}
.section02 .inner .creditWrap .credit li a {
  text-decoration: underline;
}
.section02 .inner .creditWrap .img div:nth-of-type(1) {
  width: calc(100% - 100px);
  margin: 0 100px 0 0;
}
.section02 .inner .creditWrap .img div:nth-of-type(2) {
  width: calc(100% - 100px);
  margin: -30px 0 0 100px;
}

/* SECTION 3 */
.section03 {
  width: calc(100% - 60px);
  margin: 0 auto 75px;
}

.section03 .line {
	position: relative;
}
.section03 .line::before, 
.section03 .line::after {
  position: absolute;
  content: "";
  width: 0;
  height: 1px;
  background: #000000;
}
.section03 .line2::before, 
.section03 .line2::after {
  position: absolute;
  content: "";
  width: 1px;
  height: 0;
  background: #000000;
}
/*上*/
.section03 .line.active::before {
  top: 20px;
  left: 56%;
  animation: lineAnime3 .5s linear 1s forwards;
}
/*右*/
.section03 .line2.active::before { 
  top: 20px;
  right: 0;
  animation: lineAnime4 .5s linear 1.5s forwards;
}
/*下*/
.section03 .line.active::after { 
  bottom: 0;
  right: 56%;
  animation: lineAnime3 .5s linear 1s forwards;
}
/*左*/
.section03 .line2.active::after { 
  bottom: 0;
  left: 0;
  animation: lineAnime4 .5s linear 1.5s forwards;
}
@keyframes lineAnime3 {
  0% {width: 0%;}
  100% {width: 44%;}
}
@keyframes lineAnime4 {
  0% {height: 0%;}
  100% {height: 195px;}
}

.section03 .ttlWrap p {
  margin-bottom: 40px;
  font-size: 2.8rem;
  line-height: 1;
  text-transform: uppercase;
  text-align: left;
}
.section03 .ttlWrap .txt {
  display: flex;
  justify-content: flex-start;
  align-items: flex-end;
  gap: 30px;
  padding: 0 30px;
}
.section03 .ttlWrap .txt h4 {
  font-size: 1.6rem;
  line-height: 1.6;
  -ms-writing-mode: tb-rl;
  writing-mode: vertical-rl;
  text-align: left;
}
.section03 .ttlWrap .txt h4 span {
  -webkit-text-combine: horizontal;
  -ms-text-combine-horizontal: all;
  text-combine-upright: all;
}
.section03 .ttlWrap .txt .img {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  /*gap: 5px;*/
}
.section03 .ttlWrap .txt .img div {
  width: 47%;
}
.section03 .ttlWrap .txt .img div:nth-of-type(1) {
  margin-left: 53%;
  margin-bottom: 6%;
}

.section03 .txtWrap {
  padding: 35px 30px 45px;
}
.section03 .txtWrap p {
  margin-bottom: 20px;
  font-size: 1.2rem;
  line-height: 2.2;
  text-align: left;
}
.section03 .txtWrap .credit {
  font-size: 1.4rem;
  line-height: 1.6;
  text-align: left;
  position: relative;
  z-index: 10;
}
.section03 .txtWrap .credit ul {
  margin-bottom: 10px;
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
}
.section03 .txtWrap .credit li:first-child {
  width: 60%;
  text-align: left;
}
.section03 .txtWrap .credit li:last-child {
  width: 40%;
  text-align: right;
}
/*
.section03 .txtWrap .credit li br {
  display: none;
}
*/
.section03 .txtWrap .credit li a {
  text-decoration: underline;
}

/* ARCHIVE */
.archive {
  width: 100%;
  height: auto;
  padding: 50px 0 0 0;
  background-color: #e4e2d9;
  text-align: center;
}

.archive h5 {
  margin-bottom: 35px;
  font-size: 3rem;
  line-height: 1;
}

.archive .scroll-container {
  overflow-x: scroll;
}

.archive .book {
  height: 370px;
  display: flex;
  justify-content: flex-end;
  align-items: flex-end;
  font-size: 1.8rem;
  line-height: 1.2;
}
.archive .book .stand {
  width: 60px;
  height: 290px;
  padding-top: 30px;
  background-color: #e4e2d9;
  border: solid 1px #000000;
  border-radius: 10px;
  text-align: center;
  flex-shrink: 0;
}
.archive .book .stand p {
  -ms-writing-mode: tb-rl;
  writing-mode: vertical-rl;
  text-align: left;
  display: inline-block;
}
.archive .book div {
  width: 60px;
  height: 340px;
  padding-top: 30px;
  background-color: #ffffff;
  border: solid 1px #000000;
  border-radius: 10px;
  text-align: center;
  flex-shrink: 0;
}
.archive .book div p {
  -ms-writing-mode: tb-rl;
  writing-mode: vertical-rl;
  text-align: left;
  display: inline-block;
}
.archive .book div p span {
  font-style: italic;
  text-decoration: underline;
  text-underline-position: left;
  padding-bottom: 20px;
}
.archive .book a {
  text-decoration: none;
}
.archive .book .rotate {
  margin: 0 15px 3px 0;
  transform: rotate(5deg);
}
.archive .book .updown {
  animation-name: UpDown;
  animation-duration: 1.5s;
  animation-iteration-count: infinite;
  animation-timing-function: ease-in-out;
  animation-direction: alternate;
}
@keyframes UpDown {
  0%{
  transform: translateY(0);
  }
  100%{
  transform: translateY(-20px);
  }
}

/* FOOTER */
.footer {
  width: 100%;
  height: auto;
  padding: 75px 0 70px 0;
  background-color: #231815;
  color: #ffffff;
  text-align: center;
}

.footer h5 {
  margin-bottom: 15px;
  font-size: 1.4rem;
  line-height: 1;
}

.footer p {
  font-size: 1.4rem;
  line-height: 2;
}
.footer .copy {
  margin-top: 35px;
  font-size: 1.6rem;
  line-height: 1;
}

}


/*--PC--*/
@media only screen and (min-width: 768px) {
.sp {
  display: none;
}
.pc {
  display: block;
}

/* MAIN */
main {
  width: 1120px;
  margin: 0 auto;
}

/* KV */
.kv {
  margin-bottom: 135px;
}

.kv .imgWrap {
  margin-bottom: 40px;
  display: flex;
  justify-content: center;
  align-items: center;
}
.kv .imgWrap .title {
  width: 230px;
  text-align: center;
}
.kv .imgWrap .title h1 {
  font-size: 4.6rem;
  -ms-writing-mode: tb-rl;
  writing-mode: vertical-rl;
  display: inline-block;
}
.kv .imgWrap .img {
  width: 890px;
}

.kv .txtWrap {
  display: flex;
  justify-content: center;
  align-items: center;
}
.kv .txtWrap .issue {
  width: 410px;
  text-align: left;
  padding-left: 100px;
}
.kv .txtWrap .issue .number {
  margin-bottom: 15px;
  font-size: 2rem;
  font-style: italic;
  line-height: 1;
  text-decoration-line: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
}
.kv .txtWrap .issue .date {
  font-size: 1.2rem;
  line-height: 1.2;
}
.kv .txtWrap .title {
  width: 710px;
}
.kv .txtWrap .title .line {
  width: 530px;
  padding: 60px 0 30px 0;
	position: relative;
}
.kv .txtWrap .title .line::before, 
.kv .txtWrap .title .line::after {
  position: absolute;
  content: "";
  width: 0;
  height: 1px;
  background: #000000;
}
.kv .txtWrap .title .line2::before, 
.kv .txtWrap .title .line2::after {
  position: absolute;
  content: "";
  width: 1px;
  height: 0;
  background: #000000;
}
/*上*/
.kv .txtWrap .title .line::before {
  top: 0;
  left: 0;
  animation: lineAnime .5s linear 1.5s forwards;
}
/*右*/
.kv .txtWrap .title .line2::before { 
  top: 55%;
  right: 0;
  animation: lineAnime2 .5s linear 1s forwards;
}
/*下*/
.kv .txtWrap .title .line::after { 
  bottom: 0;
  right: 0;
  animation: lineAnime .5s linear 1.5s forwards;
}
/*左*/
.kv .txtWrap .title .line2::after { 
  bottom: 55%;
  left: 0;
  animation: lineAnime2 .5s linear 1s forwards;
}
@keyframes lineAnime {
  0% {width: 0%;}
  100% {width: 15%;}
}
@keyframes lineAnime2 {
  0% {height: 0%;}
  100% {height: 45%;}
}
.kv .txtWrap .title h2 {
  font-size: 4rem;
  line-height: 1.6;
  margin: -1.2em 0;
}

/* SECTION 1 */
.section01 {
  width: 890px;
  height: 490px;
  margin: 0 auto 130px;
  position: relative;
}

.section01 .line {
  position: relative;
  top: 50%;
}
.section01 .line::before {
  position: absolute;
  content: "";
  width: 0;
  height: 1px;
  background: #000000;
}
.section01 .line::before {
  top: 0;
  left: 0;
}
.section01 .line.active::before {
  animation: lineLR .5s linear forwards;
}
@keyframes lineLR {
  0% {width: 0%;}
  100% {width: 100%;}
}

.section01 .inner {
  position: absolute;
  top: 0;
  display: flex;
  justify-content: center;
  align-items: center;
}
.section01 .inner .txtWrap {
  width: 480px;
  text-align: center;
}
.section01 .inner .txtWrap h2 {
  margin: 40px 0 120px 0;
  font-size: 1.4rem;
  -ms-writing-mode: tb-rl;
  writing-mode: vertical-rl;
  text-orientation: upright;
  display: inline-block;
}
.section01 .inner .txtWrap p {
  font-size: 1.2rem;
  line-height: 2;
}
.section01 .inner .imgWrap {
  width: 365px;
  order: 1;
}

/* SECTION 2 */
.section02 {
  width: 890px;
  height: 1350px;
  margin: 0 auto 70px;
  position: relative;
}

.section02 .box {
  width: 890px;
  height: 1000px;
  position: absolute;
  top: 120px;
  background-color: #e4e2d9;
}

.section02 .inner {
  width: 890px;
  position: absolute;
  top: 0;
}
.section02 .inner .txtWrap {
  display: flex;
  justify-content: center;
  align-items: flex-start;
  gap: 55px;
}
.section02 .inner .txtWrap .img {
  width: 450px;
  padding-left: 40px;
}
.section02 .inner .txtWrap .txt {
  width: 440px;
  margin-top: 20px;
  display: flex;
  justify-content: flex-start;
  align-items: flex-end;
}
.section02 .inner .txtWrap .txt h3 {
  font-size: 2.4rem;
  -ms-writing-mode: tb-rl;
  writing-mode: vertical-rl;
  text-orientation: upright;
  text-align: left;
}
.section02 .inner .txtWrap .txt p {
  width: 270px;
  margin-bottom: -50px;
  padding: 0 0 0 40px;
  font-size: 1.2rem;
  line-height: 2.4;
  text-align: left;
}
.section02 .inner .creditWrap {
  display: flex;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 55px;
}
.section02 .inner .creditWrap .credit {
  width: 450px;
  margin-top: 60px;
  padding: 0 20px 0 60px;
  text-align: left;
}
.section02 .inner .creditWrap .credit ul {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
}
.section02 .inner .creditWrap .credit li {
  margin-bottom: 10px;
}
.section02 .inner .creditWrap .credit li a {
  text-decoration: underline;
}
.section02 .inner .creditWrap .img {
  width: 440px;
  margin-top: 20px;
  text-align: left;
}
.section02 .inner .creditWrap .img img {
  width: 345px;
}
.section02 .inner .creditWrap .img div:nth-of-type(2) {
  margin: -150px 0 0 -320px;
}

/* SECTION 3 */
.section03 {
  width: 870px;
  margin: 0 auto 75px;
}

.section03 .line {
	position: relative;
}
.section03 .line2 {
  display: flex;
  justify-content: flex-start;
  align-items: flex-start;
}
.section03 .line::before, 
.section03 .line::after {
  position: absolute;
  content: "";
  width: 0;
  height: 1px;
  background: #000000;
}
.section03 .line2::before, 
.section03 .line2::after {
  position: absolute;
  content: "";
  width: 1px;
  height: 0;
  background: #000000;
}
/*上*/
.section03 .line.active::before {
  top: 0;
  left: 28%;
  animation: lineAnime3 .5s linear 1s forwards;
}
/*右*/
.section03 .line2.active::before { 
  top: 0;
  right: 0;
  animation: lineAnime4 .5s linear 1.5s forwards;
}
/*下*/
.section03 .line.active::after { 
  bottom: 0;
  right: 28%;
  animation: lineAnime3 .5s linear 1s forwards;
}
/*左*/
.section03 .line2.active::after { 
  bottom: 0;
  left: 0;
  animation: lineAnime5 .5s linear 1.5s forwards;
}
@keyframes lineAnime3 {
  0% {width: 0%;}
  100% {width: 72%;}
}
@keyframes lineAnime4 {
  0% {height: 0%;}
  100% {height: 40%;}
}
@keyframes lineAnime5 {
  0% {height: 0%;}
  100% {height: 20%;}
}

.section03 .ttlWrap {
	width: 240px;
  margin-top: -20px;
}
.section03 .ttlWrap p {
  margin-bottom: 40px;
  font-size: 3.2rem;
  line-height: 1;
  text-transform: uppercase;
  text-align: left;
}
.section03 .ttlWrap .txt {
  display: flex;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 30px;
}
.section03 .ttlWrap .txt h4 {
  font-size: 2.4rem;
  line-height: 1.2;
  -ms-writing-mode: tb-rl;
  writing-mode: vertical-rl;
  text-align: left;
}
.section03 .ttlWrap .txt h4 span {
  -webkit-text-combine: horizontal;
  -ms-text-combine-horizontal: all;
  text-combine-upright: all;
}
.section03 .ttlWrap .txt .img div {
  margin-bottom: 20px;
}

.section03 .txtWrap {
	width: 630px;
  margin: 115px 0 70px 0;
  padding: 0 70px 0 40px;
}
.section03 .txtWrap p {
  margin-bottom: 40px;
  font-size: 1.2rem;
  line-height: 2.2;
  text-align: left;
}
.section03 .txtWrap .credit {
  font-size: 1.4rem;
  line-height: 1.6;
  text-align: left;
  position: relative;
  z-index: 10;
}
.section03 .txtWrap .credit ul {
  margin-bottom: 10px;
  display: flex;
  justify-content: flex-start;
  align-items: center;
  gap: 35px;
}
.section03 .txtWrap .credit li a {
  padding: 10px 20px;
  background-color: #000000;
  color: #ffffff;
  text-decoration: none;
}

/* ARCHIVE */
.archive {
  width: 100%;
  height: auto;
  padding: 50px 0 0 0;
  background-color: #e4e2d9;
  text-align: center;
}

.archive h5 {
  margin-bottom: 35px;
  font-size: 3rem;
  line-height: 1;
}

.archive .book {
  display: flex;
  justify-content: center;
  align-items: flex-end;
  font-size: 2rem;
  line-height: 1.2;
}
.archive .book .stand {
  width: 90px;
  height: 350px;
  padding-top: 45px;
  background-color: #e4e2d9;
  border: solid 1px #000000;
  border-radius: 10px;
  text-align: center;
}
.archive .book .stand p {
  -ms-writing-mode: tb-rl;
  writing-mode: vertical-rl;
  text-align: left;
  display: inline-block;
}
.archive .book div {
  width: 90px;
  height: 400px;
  padding-top: 45px;
  background-color: #ffffff;
  border: solid 1px #000000;
  border-radius: 10px;
  text-align: center;
}
.archive .book div p {
  -ms-writing-mode: tb-rl;
  writing-mode: vertical-rl;
  text-align: left;
  display: inline-block;
}
.archive .book div p span {
  font-style: italic;
  text-decoration: underline;
  text-underline-position: left;
  padding-bottom: 40px;
}
.archive .book a {
  text-decoration: none;
}
.archive .book .rotate {
  margin: 0 15px 3px 0;
  transform: rotate(5deg);
}
.archive .book .active:hover {
  animation-name: active;
  animation-duration: 1s;
  animation-direction: alternate;
  animation-fill-mode: forwards;
}
@keyframes active {
  0%{
  transform: translateY(0);
  }
  100%{
  transform: translateY(-20px);
  }
}

/* FOOTER */
.footer {
  width: 100%;
  height: auto;
  padding: 75px 0 70px 0;
  background-color: #231815;
  color: #ffffff;
  text-align: center;
}

.footer h5 {
  margin-bottom: 15px;
  font-size: 1.4rem;
  line-height: 1;
}

.footer p {
  font-size: 1.4rem;
  line-height: 2;
}
.footer .copy {
  margin-top: 35px;
  font-size: 1.6rem;
  line-height: 1;
}

}


/*--SP/PC共通アニメーション--*/
/* 画像左から右表示 */
.kv .imgWrap .img {
  overflow: hidden;
  position: relative;
}
.kv .imgWrap .img::before {
  animation: imgLR 2.5s cubic-bezier(0.4, 0, 0.2, 1) forwards;
  background: #fff;
  content: '';
  inset: 0;
  pointer-events: none;
  position: absolute;
  z-index: 1;
}
@keyframes imgLR {
  100% {
    transform: translateX(100%);
  }
}

/* テキスト左から右表示 */
.slideIn.active {
  overflow: hidden;
  display: inline-block;
  animation-name: txtLR;
  animation-delay: .5s;
  animation-duration: 1s;
  animation-fill-mode: forwards;
  opacity: 0;
}
@keyframes txtLR {
  from {
    transform: translateX(-100%);
    opacity: 0;
  }
  to {
    transform: translateX(0);
    opacity: 1;
  }
}
.slideInInner.active {
  display: inline-block;
  animation-name: txtRL;
  animation-delay: .5s;
  animation-duration: 1s;
  animation-fill-mode: forwards;
  opacity: 0;
}
@keyframes txtRL {
  from {
    transform: translateX(100%);
    opacity: 0;
  }
  to {
    transform: translateX(0);
    opacity: 1;
  }
}

/* フェードイン */
.fadeIn.active {
  animation-name: fadeIn;
}
.fadeIn {
  animation-duration: 2s;
  animation-fill-mode: forwards;
  opacity: 0;
}
@keyframes fadeIn {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

.fadeIn5ms.active {
  animation-name: fadeIn5ms;
}
.fadeIn5ms {
  animation-delay: .5s;
  animation-duration: 2s;
  animation-fill-mode: forwards;
  opacity: 0;
}
@keyframes fadeIn5ms {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

.fadeIn1s.active {
  animation-name: fadeIn1s;
}
.fadeIn1s {
  animation-delay: 1s;
  animation-duration: 2s;
  animation-fill-mode: forwards;
  opacity: 0;
}
@keyframes fadeIn1s {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

.fadeIn2s.active {
  animation-name: fadeIn2s;
}
.fadeIn2s {
  animation-delay: 1.5s;
  animation-duration: 2s;
  animation-fill-mode: forwards;
  opacity: 0;
}
@keyframes fadeIn2s {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

.fadeIn3s.active {
  animation-name: fadeIn3s;
}
.fadeIn3s {
  animation-delay: 2s;
  animation-duration: 2s;
  animation-fill-mode: forwards;
  opacity: 0;
}
@keyframes fadeIn3s {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}


/*PC*/
.fs span:nth-of-type(1) {
  margin-bottom: -10px;
  font-family: "霞白藤 B" !important;
}
.fs span:nth-of-type(2) {
  margin-bottom: -10px;
  font-family: "霞白藤 B" !important;
}
/*iPhone*/
.iphone .fs span:nth-of-type(1) {
  margin-bottom: -20px;
  font-family: "霞白藤 B" !important;
}
.iphone .fs span:nth-of-type(2) {
  margin-bottom: -10px;
  font-family: "霞白藤 B" !important;
}
/*Android*/
.android .fs span:nth-of-type(1) {
  margin-bottom: -10px;
  font-family: "霞白藤 B" !important;
}
.android .fs span:nth-of-type(2) {
  margin-bottom: -10px;
  font-family: "霞白藤 B" !important;
}