/* @import url('https://fonts.googleapis.com/css2?family=Roboto:wght@700&display=swap'); */
/* 1336pxの場合　フォントサイズ以外
 min(1rem,calc(10vw/13.66)) */

/*                    header                */
header {
 position: fixed;
 top: 0;
 width: 100%;
 background-color: #016cb0;
 z-index: 999;
}
.hd_inner {
 box-sizing: border-box;
 display: flex;
 justify-content: flex-end;
 padding: min(2.5rem, calc(25vw / 13.66)) min(5.5rem, calc(55vw / 13.66));
}

.hd_logo {
 width: min(25.3rem, calc(253vw / 13.66));
 position: absolute;
 top: 0;
 left: min(3rem, calc(30vw / 13.66));
}
.hd_menu {
 width: min(83rem, calc(830vw / 13.66));
 display: flex;
 justify-content: space-between;
 align-items: center;
}
.hd_menu a {
 color: #fff;
 font-size: 1.4rem;
 font-weight: 500;
 letter-spacing: 0.16em;
}

.nav {
 display: none;
}

/*                    main                */
main {
 overflow: hidden;
}
.main_bg {
 position: fixed;
 top: 0;
 width: 100%;
 height: 100vh;
 height: 100dvh;
 z-index: -5;
}
.main_bg::before {
 content: "";
 width: 100%;
 height: 100%;
 background: url(../images/mv_bg.webp);
 background-size: contain;
 position: absolute;
 top: 0;
 left: 0;
 animation-name: bg_move;
 animation-timing-function: linear;
 animation-iteration-count: infinite;
 background-repeat: repeat;
 animation-duration: 10s;
 background-size: min(101.8rem, calc(1018vw / 13.66)) min(95rem, calc(950vw / 13.66));
}

@keyframes bg_move {
 0% {
  background-position: top left 0;
 }
 100% {
  background-position: top left max(-101.8rem, calc(-1018vw / 13.66));
 }
}

.section_content {
 padding-top: min(7.5rem, calc(75vw / 13.66));
 margin-top: max(-7.5rem, calc(-75vw / 13.66));
}
.section_inner {
 padding: min(13.5rem, calc(135vw / 13.66)) 0 min(13.5rem, calc(135vw / 13.66));
}

.section_ttl {
 width: min(56rem, calc(560vw / 13.66));
 margin: 0 auto;
 position: relative;
 z-index: 1;
}
.section_ttl::before {
 content: "";
 width: 100vw;
 height: min(0.6rem, calc(6vw / 13.66));
 background-color: #fff;
 position: absolute;
 top: 50%;
 transform: translate(-50%);
 left: 50%;
 z-index: -1;
}
/*                    mv                */
#mv {
 height: 100vh;
 position: relative;
}
.mv_ttl {
 position: absolute;
 top: 50%;
 transform: translateY(-50%);
 left: 0;
 right: 0;
 width: min(101.5rem, calc(1015vw / 13.66));
 margin: 0 auto;
 opacity: 0;
 filter: blur(20px);
 animation-name: show;
 animation-duration: 1s;
 animation-fill-mode: forwards;
 animation-timing-function: linear;
}


@keyframes show {
 0% {
  opacity: 0;
 filter: blur(20px);
 }
 100% {
  opacity: 1;
 filter: blur(0px);
 }
}

/*                    thoughts                */
.thoughts_inner {
 position: relative;
 background: url(../images/bg_img.webp);
 background-size: cover;
 overflow: hidden;
}

.thoughts_txt {
 font-size: 3.2rem;
 font-weight: 900;
 line-height: 2.1;
 letter-spacing: 0.16em;
 color: #fff;
 padding: min(8rem, calc(80vw / 13.66)) 0 min(2rem, calc(20vw / 13.66));
}
.thoughts_char_01 {
 width: min(85.6rem, calc(856vw / 13.66));
 margin: 0 auto;
}
.thoughts_item {
 width: min(114rem, calc(1140vw / 13.66));
 margin: 0 auto;
 position: relative;
 margin-bottom: min(16rem, calc(160vw / 13.66));
}
.thoughts_item:last-of-type {
 z-index: 5;
 margin-bottom: 0;
}
.thoughts_item::before {
 content: "";
 width: 100%;
 height: 100%;
 background-color: #b6c7d2;
 position: absolute;
 top: min(2.5rem, calc(25vw / 13.66));
 left: min(2.5rem, calc(25vw / 13.66));
 border-radius: min(10rem, calc(100vw / 13.66));
}
.thoughts_item_inner {
 background-color: #fff;
 box-sizing: border-box;
 border: min(0.8rem, calc(8vw / 13.66)) solid #fff;
 border-radius: min(10rem, calc(100vw / 13.66));
 overflow: hidden;
 width: 100%;
 position: relative;
 z-index: 1;
 padding-bottom: min(9rem, calc(90vw / 13.66));
}
.thoughts_item_inner::before {
 content: "";
 width: 100%;
 height: 100%;
 box-shadow: inset min(1.5rem, calc(15vw / 13.66)) min(1.5rem, calc(15vw / 13.66)) 0 #a6302a80;
 position: absolute;
 top: 0;
 left: 0;
 z-index: 1;
 border-radius: min(9rem, calc(90vw / 13.66));
}
.thoughts_item:last-of-type .thoughts_item_inner::before {
 box-shadow: inset min(1.5rem, calc(15vw / 13.66)) min(1.5rem, calc(15vw / 13.66)) 0 #15548080;
}
.thoughts_item_content {
 position: relative;
 z-index: 5;
}
.thoughts_item_ttl {
 font-size: 3.9rem;
 font-weight: 900;
 color: #fff;
 letter-spacing: 0.16em;
 background-color: #ff2e41;
 padding: min(1rem, calc(10vw / 13.66)) 0;
 box-shadow: inset min(1.5rem, calc(15vw / 13.66)) min(1.5rem, calc(15vw / 13.66)) 0 #a6302a80;
 border-radius: min(9rem, calc(90vw / 13.66)) min(9rem, calc(90vw / 13.66)) 0 0;
}
.thoughts_item:last-of-type .thoughts_item_ttl {
 box-shadow: inset min(1.5rem, calc(15vw / 13.66)) min(1.5rem, calc(15vw / 13.66)) 0 #15548080;
 background-color: #0076c5;
}
.thoughts_item_txt {
 font-size: 2.6rem;
 font-weight: 900;
 color: #ff2e41;
 line-height: 1.6;
 padding: min(3rem, calc(30vw / 13.66)) 0 min(4rem, calc(40vw / 13.66));
 letter-spacing: 0.16em;
}
.thoughts_item:last-of-type .thoughts_item_txt {
 color: #0076c5;
}
.thoughts_flex {
 width: min(93rem, calc(930vw / 13.66));
 margin: 0 auto;
 display: flex;
 justify-content: space-between;
 align-items: flex-start;
}
.thoughts_box {
 width: min(44rem, calc(440vw / 13.66));
 text-align: justify;
}
.thoughts_box_img {
 border-radius: min(1rem, calc(10vw / 13.66));
 overflow: hidden;
}
.thoughts_box_ttl {
 font-size: 2.2rem;
 font-weight: 900;
 letter-spacing: 0.16em;
 color: #ff2e41;
 line-height: 1.5;
 padding: min(1rem, calc(10vw / 13.66)) 0;
}
.thoughts_item:last-of-type .thoughts_box_ttl {
 color: #0076c5;
}
.thoughts_box_txt {
 font-size: 1.5rem;
 font-weight: 500;
 letter-spacing: 0.16em;
 line-height: 1.8;
}

.thoughts_char_02 {
 width: min(33.5rem, calc(335vw / 13.66));
 position: absolute;
 top: max(-25rem, calc(-250vw / 13.66));
 left: max(-7.5rem, calc(-75vw / 13.66));
}
.thoughts_char_03 {
 width: min(28.3rem, calc(283vw / 13.66));
 position: absolute;
 bottom: max(-24.5rem, calc(-245vw / 13.66));
 right: max(-10rem, calc(-100vw / 13.66));
 z-index: 5;
}

/*                   activity_history_item               */
.activity_item,
.history_item {
 position: relative;
 width: min(120rem, calc(1200vw / 13.66));
 margin: 0 auto;
 margin-top: min(15rem, calc(150vw / 13.66));
}
.activity_item::before,
.history_item::before {
 content: "";
 width: 100%;
 height: 100%;
 background-color: #b6c7d2;
 position: absolute;
 top: min(2.5rem, calc(25vw / 13.66));
 left: min(2.5rem, calc(25vw / 13.66));
 border-radius: min(10rem, calc(100vw / 13.66));
}

.draw_line {
 width: min(0.8rem, calc(8vw / 13.66));
 height: min(15rem, calc(150vw / 13.66));
 background-color: #fff;
 position: absolute;
 bottom: max(-15rem, calc(-150vw / 13.66));
 left: 0;
 right: 0;
 margin: 0 auto;
 transition: 0.4s;
 transform: scale(1, 0);
 transform-origin: top;
}
.draw_line.show {
 animation-name: draw;
 animation-duration: 0.4s;
 animation-timing-function: linear;
 animation-fill-mode: forwards;
}
@keyframes draw {
 0% {
  transform: scale(1, 0);
 }
 100% {
  transform: scale(1);
 }
}
.activity_item_inner,
.history_item_inner {
 box-sizing: border-box;
 border: min(0.8rem, calc(8vw / 13.66)) solid #fff;
 border-radius: min(10rem, calc(100vw / 13.66));
 width: 100%;
 position: relative;
 z-index: 1;
 padding: min(25rem, calc(250vw / 13.66)) min(8rem, calc(80vw / 13.66)) min(9rem, calc(90vw / 13.66));
 background-color: #e25353;
 background-image: radial-gradient(circle, #ffffff40 2px, transparent 2px), radial-gradient(circle, #ffffff40 2px, transparent 2px), radial-gradient(circle, #ffffff40 2px, transparent 2px), radial-gradient(circle, #ffffff40 2px, transparent 2px);
 background-position: 0 0, 12px 0, 6px 12px, 18px 12px;
 background-size: 24px 24px;
}
.history_item:nth-of-type(odd) .history_item_inner {
 background-color: #4182bc;
}
.activity_item_inner::before,
.history_item_inner::before {
 content: "";
 width: 100%;
 height: 100%;
 box-shadow: inset min(1.5rem, calc(15vw / 13.66)) min(1.5rem, calc(15vw / 13.66)) 0 #a6302a80;
 position: absolute;
 top: 0;
 left: 0;
 z-index: 1;
 border-radius: min(9rem, calc(90vw / 13.66));
}
.history_item:nth-of-type(odd) .history_item_inner::before {
 box-shadow: inset min(1.5rem, calc(15vw / 13.66)) min(1.5rem, calc(15vw / 13.66)) 0 #15548080;
}

.activity_item_content,
.history_item_content {
 position: relative;
 z-index: 5;
}
.activity_year,
.history_year {
 width: min(65rem, calc(650vw / 13.66));
 position: absolute;
 top: max(-5rem, calc(-50vw / 13.66));
 right: max(5rem, calc(0vw / 13.66));
 z-index: 2;
 opacity: 0;
 transition: 0.4s;
 transition-delay: 0.4s;
 transform: translateY(10%);
}
.scrollin .activity_year,
.scrollin .history_year {
 transform: translateY(0);
 opacity: 1;
}
.history_item:nth-of-type(odd) .history_year {
 right: auto;
 left: max(5rem, calc(50vw / 13.66));
}
.activity_flex,
.history_flex {
 display: flex;
 justify-content: space-between;
 align-items: center;
}
.activity_flex p,
.history_flex p {
 text-align: left;
 font-size: 1.6rem;
 font-weight: 500;
 color: #fff;
 letter-spacing: 0.2em;
}
.activity_img,
.history_img {
 width: min(34.5rem, calc(345vw / 13.66));
}
.activity_movie,
.history_movie {
 width: min(64rem, calc(640vw / 13.66));
}
.activity_movie button,
.history_movie button,
.activity_sns button {
 position: relative;
 overflow: hidden;
}
.activity_movie img,
.history_movie img,
.activity_sns img {
 transition: 0.4s;
}
.activity_movie button .slide_img::before,
.history_movie button .slide_img::before,
.activity_sns button .slide_img::before {
 content: "";
 width: min(8.4rem, calc(84vw / 13.66));
 height: min(8.4rem, calc(84vw / 13.66));
 background: url(../images/movie_icon.svg) no-repeat;
 background-size: cover;
 position: absolute;
 top: 50%;
 transform: translateY(-50%);
 left: 0;
 right: 0;
 margin: 0 auto;
 z-index: 5;
 opacity: 0;
 transition-delay: 0.5s;
}
.activity_movie button .slide_img.scrollin::before,
.history_movie button .slide_img.scrollin::before,
.activity_sns button .slide_img.scrollin::before {
 opacity: 1;
}

@media (hover: hover) and (pointer: fine) {
 .activity_movie button:where(:any-link, :enabled, summary):hover img,
 .history_movie button:where(:any-link, :enabled, summary):hover img,
 .activity_sns button:where(:any-link, :enabled, summary):hover img {
  transform: scale(1.1);
 }
}
.activity_detail,
.history_detail {
 text-align: justify;
 border-left: min(0.6rem, calc(6vw / 13.66)) solid #fff;
 padding-left: min(3rem, calc(30vw / 13.66));
 margin-top: min(11.5rem, calc(115vw / 13.66));
}

.activity_detail_date,
.history_detail_date {
 display: flex;
 align-items: baseline;
 font-family: "Roboto", sans-serif;
 font-weight: 700;
 font-size: 8.3rem;
 font-weight: 700;
 color: #fff;
 letter-spacing: 0.04em;
 line-height: 1;
}
.activity_detail_date span,
.history_detail_date span {
 font-size: 1.9rem;
}
.activity_detail_txt {
 font-size: 7.2rem;
 font-weight: 900;
 line-height: 1.6;
 letter-spacing: 0.1em;
 color: #e0042f;
}
.activity_detail .activity_detail_txt::before {
 -webkit-text-stroke: 10px #fff;
 text-stroke: 10px #fff;
}
.txt_stroke {
 position: relative;
}
.txt_stroke::before {
 content: attr(data-txt);
 position: absolute;
 top: 0;
 left: 0;
 color: #fff;
 z-index: -1;
 -webkit-text-stroke: 5px #fff;
 text-stroke: 5px #fff;
 paint-order: stroke;
}
.history_detail_img {
 position: relative;
}
.history_detail_img span {
 font-size: 1.6rem;
 color: #fff;
 position: absolute;
 bottom: min(1rem, calc(10vw / 13.66));
 right: min(2rem, calc(20vw / 13.66));
 text-shadow: 0 0 min(0.5rem, calc(5vw / 13.66)) #000;
 opacity: 0;
 transition-delay: .6s;
}
.history_detail_img span.block {
 color: #000;
 text-shadow: none;
}

.slide_img.scrollin span {
 opacity: 1;
}

.activity_char_01 {
 width: min(25.8rem, calc(258vw / 13.66));
 position: absolute;
 top: min(0.5rem, calc(5vw / 13.66));
 left: min(6rem, calc(60vw / 13.66));
 z-index: 2;
}
.activity_char_02 {
 width: min(22.2rem, calc(222vw / 13.66));
 position: absolute;
 top: min(11rem, calc(110vw / 13.66));
 right: max(-0.5rem, calc(-5vw / 13.66));
 z-index: 3;
}

.history_item:nth-of-type(1) .history_flex {
 width: min(72rem, calc(720vw / 13.66));
 margin: 0 auto;
}
.history_item:nth-of-type(2) .history_img {
 width: 100%;
}

.history_detail {
 display: flex;
 justify-content: space-between;
 border: none;
 padding: 0;
}
.history_detail_box {
 width: min(49rem, calc(490vw / 13.66));
 border-left: min(0.6rem, calc(6vw / 13.66)) solid #fff;
 padding-left: min(2rem, calc(20vw / 13.66));
 box-sizing: border-box;
}
.history_detail_date {
 margin-bottom: min(1.5rem, calc(15vw / 13.66));
}
.history_detail_ttl {
 font-size: 1.9rem;
 font-weight: 900;
 letter-spacing: 0.1em;
 margin: min(0.5rem, calc(5vw / 13.66)) 0;
 color: #ad2222;
}
.history_item:first-of-type .history_detail_ttl {
 min-height: min(7.5rem, calc(75vw / 13.66));
 display: flex;
 flex-direction: column;
 justify-content: center;
}
.history_item:nth-last-of-type(odd) .history_detail_ttl {
 color: #0042a9;
}
.history_detail_ttl span {
 display: block;
}
.history_detail_txt {
 font-size: 1.6rem;
 font-weight: 500;
 letter-spacing: 0.2em;
 line-height: 1.875;
 color: #fff;
}
.history_char_01 {
 width: min(34rem, calc(340vw / 13.66));
 position: absolute;
 top: min(60rem, calc(600vw / 13.66));
 right: max(-5.5rem, calc(-55vw / 13.66));
 z-index: 3;
}

.history_item:nth-of-type(2) .history_flex {
 width: min(34rem, calc(340vw / 13.66));
 justify-content: center;
 margin: 0 auto;
}
.history_detail.flex_end {
 align-items: flex-end;
}
.history_detail:not(:nth-of-type(2)) {
 margin-top: min(6rem, calc(60vw / 13.66));
}
.history_char_02 {
 width: min(29rem, calc(290vw / 13.66));
 position: absolute;
 top: min(39.5rem, calc(395vw / 13.66));
 left: min(6rem, calc(60vw / 13.66));
 z-index: 3;
}
.history_char_03 {
 width: min(38.5rem, calc(385vw / 13.66));
 position: absolute;
 bottom: min(12rem, calc(120vw / 13.66));
 right: min(10rem, calc(100vw / 13.66));
 z-index: 3;
}
.history_char_04 {
 width: min(25.5rem, calc(255vw / 13.66));
 position: absolute;
 bottom: min(15.5rem, calc(155vw / 13.66));
 right: min(17rem, calc(170vw / 13.66));
 z-index: 3;
}

/*                   message                   */
.message_inner {
 position: relative;
 background: url(../images/bg_img.webp);
 background-size: cover;
 padding-bottom: min(10rem, calc(100vw / 13.66));
}
.message_inner .section_ttl {
 width: min(101rem, calc(1010vw / 13.66));
}
.message_item {
 width: min(117rem, calc(1170vw / 13.66));
 margin: min(10rem, calc(100vw / 13.66)) auto 0;
}
.message_flex {
 display: flex;
 justify-content: space-between;
}
.message_box {
 width: min(57.5rem, calc(575vw / 13.66));
 position: relative;
}
.message_box_txt {
 width: min(44rem, calc(440vw / 13.66));
 background-color: #fff;
 box-sizing: border-box;
 border: min(0.5rem, calc(5vw / 13.66)) solid #000000;
 border-radius: min(2rem, calc(20vw / 13.66));
 padding: min(3.5rem, calc(115vw / 13.66)) min(3rem, calc(30vw / 13.66));
 text-align: justify;
 font-size: 1.9rem;
 font-weight: 600;
 letter-spacing: 0.1em;
 line-height: 1.8;
 box-shadow: min(1rem, calc(10vw / 13.66)) min(1rem, calc(10vw / 13.66)) 0 #000000;
}
.message_box_txt span {
 width: min(34.6rem, calc(346vw / 13.66));
 margin: 0 auto;
 display: block;
}
.message_box_img {
 width: min(50rem, calc(500vw / 13.66));
 position: absolute;
 top: min(24rem, calc(240vw / 13.66));
 right: 0;
 z-index: 1;
}

.message_btn {
 width: min(44rem, calc(440vw / 13.66));
 margin-top: min(16rem, calc(160vw / 13.66));
 position: relative;
 z-index: 2;
}
.message_btn a {
 background-color: #0076c5;
 font-size: 1.6rem;
 font-weight: 600;
 letter-spacing: 0.16em;
 color: #fff;
 display: block;
 width: 100%;
 box-sizing: border-box;
 border-radius: min(3.8rem, calc(38vw / 13.66));
 border: min(0.5rem, calc(5vw / 13.66)) solid #000000;
 padding: min(1.8rem, calc(18vw / 13.66)) 0;
 box-shadow: min(1rem, calc(10vw / 13.66)) min(1rem, calc(10vw / 13.66)) 0 #000000;
}
.message_btn a::before {
 content: "";
 width: 0;
 border-top: min(1.1rem, calc(11vw / 13.66)) solid transparent;
 border-bottom: min(1.1rem, calc(11vw / 13.66)) solid transparent;
 border-left: min(1.5rem, calc(15vw / 13.66)) solid #fff;
 margin-right: min(1.5rem, calc(15vw / 13.66));
 position: absolute;
 top: 50%;
 transform: translateY(-50%);
 left: min(3.5rem, calc(35vw / 13.66));
 transition: 0.4s;
}

.message_box:first-of-type .message_btn a {
 padding-left: min(2rem, calc(20vw / 13.66));
}
.message_box:last-of-type .message_btn a {
 background-color: #e0042f;
}

@media (hover: hover) and (pointer: fine) {
 .message_btn a:where(:any-link, :enabled, summary):hover {
  background-color: #fff;
  color: #0076c5;
 }
 .message_btn a:where(:any-link, :enabled, summary):hover::before {
  color: #0076c5;
  border-left: min(1.5rem, calc(15vw / 13.66)) solid #0076c5;
 }
 .message_box:last-of-type .message_btn a:where(:any-link, :enabled, summary):hover {
  background-color: #fff;
  color: #e0042f;
 }
 .message_box:last-of-type .message_btn a:where(:any-link, :enabled, summary):hover::before {
  color: #e0042f;
  border-left: min(1.5rem, calc(15vw / 13.66)) solid #e0042f;
 }
}

/*                   other                   */
.other_inner {
 position: relative;
 background: url(../images/bg_img_02.webp);
 background-size: cover;
 padding-bottom: min(16rem, calc(160vw / 13.66));
}

.other_item {
 position: relative;
 width: min(120rem, calc(1200vw / 13.66));
 margin: 0 auto;
}
.other_item::before {
 content: "";
 width: 100%;
 height: 100%;
 background-color: #b6c7d2;
 position: absolute;
 top: min(2.5rem, calc(25vw / 13.66));
 left: min(2.5rem, calc(25vw / 13.66));
 border-radius: min(10rem, calc(100vw / 13.66));
}
.other_item_inner {
 box-sizing: border-box;
 border: min(0.8rem, calc(8vw / 13.66)) solid #fff;
 border-radius: min(10rem, calc(100vw / 13.66));
 width: 100%;
 position: relative;
 z-index: 1;
 padding: min(10rem, calc(100vw / 13.66)) min(8rem, calc(80vw / 13.66)) min(8rem, calc(80vw / 13.66));
 background-color: #0076c5cc;
}
.other_item_inner::before {
 content: "";
 width: 100%;
 height: 100%;
 box-shadow: inset min(1.5rem, calc(15vw / 13.66)) min(1.5rem, calc(15vw / 13.66)) 0 #1b62a680;
 position: absolute;
 top: 0;
 left: 0;
 z-index: 1;
 border-radius: min(9rem, calc(90vw / 13.66));
}

.other_content {
 position: relative;
 z-index: 5;
}

.other_item_txt {
 font-size: 2rem;
 font-weight: 900;
 letter-spacing: 0.1em;
 line-height: 2.5;
 text-align: left;
 color: #fff;
}

.other_flex {
 width: min(72rem, calc(720vw / 13.66));
 display: flex;
 justify-content: space-between;
 align-items: center;
 margin: min(6.5rem, calc(65vw / 13.66)) auto min(6rem, calc(60vw / 13.66));
}
.other_btn {
 width: min(33.5rem, calc(335vw / 13.66));
}
.other_btn a {
 display: block;
 position: relative;
 width: 100%;
 background-color: #fff;
 border-radius: min(4rem, calc(40vw / 13.66));
 padding: min(1.9rem, calc(19vw / 13.66)) 0;
 box-sizing: border-box;
 transition: 0.4s;
}
.other_btn span {
 display: block;
 width: min(20.4rem, calc(204vw / 13.66));
 margin: 0 auto;
}
.other_btn a::before {
 content: "";
 width: 0;
 border-top: min(1.1rem, calc(11vw / 13.66)) solid transparent;
 border-bottom: min(1.1rem, calc(11vw / 13.66)) solid transparent;
 border-left: min(1.5rem, calc(15vw / 13.66)) solid #000000;
 margin-right: min(1.5rem, calc(15vw / 13.66));
 position: absolute;
 top: 50%;
 transform: translateY(-50%);
 left: min(3rem, calc(30vw / 13.66));
}

@media (hover: hover) and (pointer: fine) {
 .other_btn a:where(:any-link, :enabled, summary):hover {
  transform: scale(1.05);
 }
}
.other_sns p {
 font-size: 2.7rem;
 font-weight: 900;
 letter-spacing: 0.1em;
 color: #fff;
 position: relative;
 display: flex;
 justify-content: center;
 align-items: flex-end;
}
.other_sns span {
 display: inline-block;
 position: relative;
 line-height: 1;
 padding: 0 min(2rem, calc(20vw / 13.66)) min(0.5rem, calc(5vw / 13.66));
}
.other_sns p::before {
 content: "";
 width: min(0.2rem, calc(2vw / 13.66));
 height: min(3.5rem, calc(35vw / 13.66));
 background-color: #fff;
 transform: rotate(-35deg);
}
.other_sns p::after {
 content: "";
 width: min(0.2rem, calc(2vw / 13.66));
 height: min(3.5rem, calc(35vw / 13.66));
 background-color: #fff;
 transform: rotate(35deg);
}

.sns_icon {
 width: min(52rem, calc(520vw / 13.66));
 margin: min(4.5rem, calc(45vw / 13.66)) auto 0;
 display: flex;
 justify-content: space-between;
}
.sns_icon li {
 width: min(7.5rem, calc(75vw / 13.66));
}
.sns_icon li a {
 transition: 0.4s;
 display: block;
}

@media (hover: hover) and (pointer: fine) {
 .sns_icon li a:where(:any-link, :enabled, summary):hover {
  transform: scale(1.1);
 }
}

.other_img {
 width: min(44.2rem, calc(442vw / 13.66));
 position: absolute;
 top: max(-5rem, calc(-50vw / 13.66));
 right: max(-2rem, calc(-20vw / 13.66));
}

/*                   footer                   */
footer {
 background-color: #fff;
 padding: min(6rem, calc(60vw / 13.66)) 0;
}
.footer_logo {
 width: min(30.4rem, calc(304vw / 13.66));
 margin: 0 auto;
}
.copy {
 font-size: 1.2rem;
 letter-spacing: 0.1em;
 margin-top: min(3rem, calc(30vw / 13.66));
}

@media (hover: hover) and (pointer: fine) {
 .footer_logo a:where(:any-link, :enabled, summary):hover {
  opacity: 0.7;
 }
}

.popup {
 position: fixed;
 top: 0;
 left: 0;
 width: 100%;
 height: 100vh;
 height: 100dvh;
 background-color: rgba(0, 0, 0, 0.8);
 z-index: 999;
 display: none;
}
.popup_bg {
 position: fixed;
 top: 0;
 width: 100%;
 height: 100%;
}
.popup_inner {
 width: min(86rem, calc(860vw / 13.66));
 position: absolute;
 top: 50%;
 left: 0;
 right: 0;
 margin: 0 auto;
 transform: translateY(-50%);
 z-index: 5;
}
.close_btn {
 width: min(7rem, calc(70vw / 13.66));
 height: min(7rem, calc(70vw / 13.66));
 position: absolute;
 top: max(-7rem, calc(-70vw / 13.66));
 right: 0;
}

.close_btn::before {
 content: "";
 width: 100%;
 height: 0;
 border: min(0.1rem, calc(1vw / 13.66)) solid #fff;
 position: absolute;
 top: min(3.2rem, calc(32vw / 13.66));
 left: 0;
 right: 0;
 margin: 0 auto;
 transform: rotate(45deg);
 box-sizing: border-box;
}

.close_btn::after {
 content: "";
 width: 100%;
 height: 0;
 border: min(0.1rem, calc(1vw / 13.66)) solid #fff;
 position: absolute;
 bottom: min(3.6rem, calc(36vw / 13.66));
 left: 0;
 right: 0;
 margin: 0 auto;
 transform: rotate(-45deg);
 box-sizing: border-box;
}
.popup_movie {
 height: min(48.4rem, calc(484vw / 13.66));
}

@media screen and (max-width: 767px) {
 /*                    header                */
 .hd_inner {
  box-sizing: border-box;
  display: flex;
  justify-content: flex-end;
  padding:1.2rem 1.5rem .8rem;
  position: relative;
  z-index: 5;
 }

 .hd_logo {
  width: 12.7rem;
  left: 1.5rem;
 }
 .hd_menu {
  display: none;
 }
 .hd_menu a {
  color: #fff;
  font-size: 1.4rem;
  font-weight: 500;
  letter-spacing: 0.16em;
 }

 .nav_btn {
  width: 2.5rem;
  position: relative;
  padding: 0.6rem 0;
  margin: 0 auto;
 }
 .nav_btn::before,
 .nav_btn::after {
  content: "";
  width: 100%;
  box-sizing: border-box;
  border: 0.1rem solid #fff;
  position: absolute;
  top: 0;
  left: 0;
  transition: 0.4s;
 }
 .nav_btn::after {
  top: auto;
  bottom: 0;
 }
 .nav_btn span {
  display: block;
  box-sizing: border-box;
  width: 100%;
  border: 0.1rem solid #fff;
  transition: 0.4s;
 }
 .nav_btn.open span {
  opacity: 0;
 }

 .nav_btn.open::before {
  transform: rotate(40deg);
  top: 0.6rem;
 }
 .nav_btn.open::after {
  transform: rotate(-40deg);
  bottom: 0.6rem;
 }
 .nav_box p {
  width: 100%;
  color: #fff;
  font-size: 1rem;
  line-height: 1.5;
  letter-spacing: 0.05em;
  margin-top: .3rem;
 }

 .nav {
  width: 100%;
  height: 100vh;
  height: 100dvh;
  position: fixed;
  top: 0;
  left: 0;
  background-color: #016cb0;
  display: none;
  overflow: scroll;
 }
 .nav_bg {
  position: fixed;
  top: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
 }
 .nav_inner {
  position: relative;
  z-index: 3;
  width: 32.5rem;
  margin: 9.5rem auto 0;
  padding-bottom: 5rem;
 }
 .nav_menu {
  width: 31.5rem;
  margin: 0 auto;
 }
 .nav_menu li a {
  display: block;
  color: #fff;
  width: 100%;
  font-size: 2.1rem;
  letter-spacing: 0.1em;
  font-weight: 500;
  border-bottom: 0.1rem solid #fff;
  padding: 3.5rem 0;
  box-sizing: border-box;
  line-height: 1.6;
 }
 .nav_menu li:last-of-type a {
  border-bottom: none;
 }

 .nav_sns {
  width: 100%;
  background-color: #fff;
  border-radius: 5rem;
  padding: 3rem 0 4.5rem;
  margin-top: 2rem;
 }
 .nav_sns p {
  font-size: 1.3rem;
  font-weight: 900;
  line-height: 1.77;
  color: #3d6cac;
  letter-spacing: 0.16em;
 }
 .nav_sns ul {
  display: flex;
  justify-content: space-between;
  width: 26rem;
  margin: 3rem auto 0;
 }
 .nav_sns ul li {
  width: 3.7rem;
 }

 /*                    main                */

 .main_bg::before {
  background: url(../images/mv_bg_sp.webp);
  background-size: contain;
  position: absolute;
  top: 0;
  left: 0;
  animation-name: bg_move;
  animation-timing-function: linear;
  animation-iteration-count: infinite;
  background-repeat: repeat;
  animation-duration: 7s;
  background-size: 27.2rem 66.7rem;
 }

 @keyframes bg_move {
  0% {
   background-position: top left 0;
  }
  100% {
   background-position: top left -27.2rem;
  }
 }

 .section_content {
  padding-top: 3.8rem;
  margin-top: -3.8rem;
 }
 .section_inner {
  padding: 4rem 0 8.5rem;
 }

 .section_ttl {
  width: 30rem;
 }
 .section_ttl::before {
  height: 0.3rem;
 }
 /*                    mv                */
 #mv {
  padding: 9rem 0 4rem;
  height: auto;
 }
 .mv_inner {
  position: relative;
  margin: 0 auto;
 }
 .mv_ttl {
  position: static;
  transform: none;
  width: 26.5rem;
  margin-bottom: 2.5rem;
 }

 .mv_menu {
  width: 29rem;
  margin: 0 auto;
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
 }
 .mv_menu li {
  width: 14rem;
  margin-bottom: 1rem;
 }

 .mv_menu li a {
  width: 100%;
  display: block;
  font-size: 1.3rem;
  letter-spacing: 0.1em;
  color: #fff;
  line-height: 1.25;
  box-sizing: border-box;
  border: 0.2rem solid #fff;
  border-radius: 1rem;
  background-color: #00003b80;
  padding: 1rem 0 2rem;
  position: relative;
 }
 .mv_menu li a::before {
  content: "";
  width: calc(100% + 0.3rem);
  height: calc(100% + 0.3rem);
  background-color: #ffffff80;
  position: absolute;
  top: 0.2rem;
  left: 0.3rem;
  border-radius: 0.6rem;
  z-index: -1;
 }
 .mv_menu li a::after {
  content: "";
  width: 0.7rem;
  height: 0.7rem;
  border-top: 0.2rem solid #fff;
  border-right: 0.2rem solid #fff;
  position: absolute;
  bottom: 1rem;
  left: 0;
  right: 0;
  margin: 0 auto;
  transform: rotate(135deg);
 }

 .mv_menu li:last-of-type a {
  letter-spacing: 0.02em;
 }

 /*                    thoughts                */
 .thoughts_inner {
  background-size: contain;
 }

 .thoughts_txt {
  font-size: 1.6rem;
  padding: 4rem 0 1.5rem;
 }
 .thoughts_char_01 {
  width: 100%;
 }
 .thoughts_item {
  width: 32.5rem;
  margin-bottom: 10rem;
 }
 .thoughts_item::before {
  top: 1.2rem;
  left: 1.2rem;
  border-radius: 5rem;
 }
 .thoughts_item_inner {
  border: 0.4rem solid #fff;
  border-radius: 5rem;
  padding-bottom: 3rem;
 }
 .thoughts_item_inner::before {
  box-shadow: inset 0.7rem 0.7rem 0 #a6302a80;
  border-radius: 4rem;
 }
 .thoughts_item:last-of-type .thoughts_item_inner::before {
  box-shadow: inset 0.7rem 0.7rem 0 #15548080;
 }
 .thoughts_item_ttl {
  font-size: 1.9rem;
  line-height: 1.58;
  padding: 1.6rem 0;
  box-shadow: inset.7rem 0.7rem 0 #a6302a80;
  border-radius: 4rem 4rem 0 0;
 }
 .thoughts_item:last-of-type .thoughts_item_ttl {
  box-shadow: inset.7rem 0.7rem 0 #15548080;
 }
 .thoughts_item_txt {
  font-size: 1.5rem;
  line-height: 1.4;
  padding: 1.5rem 0 2rem;
 }
 .thoughts_flex {
  width: 26rem;
  margin: 0 auto;
  flex-direction: column;
 }
 .thoughts_box {
  width: 100%;
  text-align: justify;
 }
 .thoughts_box:first-of-type {
  margin-bottom: 4rem;
 }
 .thoughts_box_img {
  border-radius: 0.5rem;
 }
 .thoughts_box_ttl {
  font-size: 1.5rem;
  padding: 1rem 0 0.5rem;
 }
 .thoughts_item:last-of-type .thoughts_box_ttl {
  color: #2784be;
 }
 .thoughts_box_txt {
  font-size: 1.3rem;
  line-height: 1.6;
 }

 .thoughts_char_02 {
  width: 16.5rem;
  top: -13rem;
  left: -1rem;
 }
 .thoughts_char_03 {
  width: 14rem;
  bottom: -14rem;
  right: -1rem;
  z-index: 5;
 }

 /*                   activity_history_item               */
 .activity_item,
 .history_item {
  width: 32.5rem;
  margin-top: 6rem;
 }
 .activity_item::before,
 .history_item::before {
  top: 1rem;
  left: 1rem;
  border-radius: 5rem;
 }

 .draw_line {
  width: 0.4rem;
  height: 6rem;
  bottom: -6rem;
 }
 .activity_item_inner,
 .history_item_inner {
  border: 0.4rem solid #fff;
  border-radius: 5rem;
  padding: 11rem 2.5rem 4.5rem;
  background-image: radial-gradient(circle, #ffffff40 0.1rem, transparent 0.1rem), radial-gradient(circle, #ffffff40 0.1rem, transparent 0.1rem), radial-gradient(circle, #ffffff40 0.1rem, transparent 0.1rem),
   radial-gradient(circle, #ffffff40 0.1rem, transparent 0.1rem);
  background-position: 0 0, 0.6rem 0, 0.3rem 0.6rem, 0.9rem 0.6rem;
  background-size: 1.2rem 1.2rem;
 }

 .activity_item_inner::before,
 .history_item_inner::before {
  box-shadow: inset 0.7rem 0.7rem 0 #a6302a80;
  border-radius: 4.5rem;
 }
 .history_item:nth-of-type(odd) .history_item_inner::before {
  box-shadow: inset 0.7rem 0.7rem 0 #15548080;
 }

 .activity_year,
 .history_year {
  width: 21rem;
  top: -1.5rem;
  right: 0;
  left: 0;
  margin: 0 auto;
 }

 .history_item:nth-of-type(odd) .history_year {
  right: 0;
  left: 0;
 }
 .activity_flex,
 .history_flex {
  flex-direction: column;
 }
 .activity_flex p,
 .history_flex p {
  font-size: 1.2rem;
 }
 .activity_img,
 .history_img {
  width: 17.2rem;
 }
 .history_img:nth-of-type(2) {
  margin-top: 3rem;
 }
 .activity_movie,
 .history_movie {
  width: 23.8rem;
  margin-top: 3rem;
 }

 .activity_movie button .slide_img::before,
 .history_movie button .slide_img::before ,
 .activity_sns button .slide_img::before {
  width: 3.2rem;
  height: 3.2rem;
 }
 .activity_detail,
 .history_detail {
  border-left: 0.3rem solid #fff;
  padding-left: 1.5rem;
  margin-top: 3.5rem;
 }

 .activity_detail_date,
 .history_detail_date {
  font-size: 4.2rem;
  margin-bottom: 1rem;
 }
 .activity_detail_date span,
 .history_detail_date span {
  font-size: 1rem;
 }
 .activity_detail_txt {
  font-size: 2.2rem;
 }
 .activity_detail .activity_detail_txt::before {
  -webkit-text-stroke: 0.5rem #fff;
  text-stroke: 0.5rem #fff;
 }

 .txt_stroke::before {
  content: attr(data-txt-sp);
  -webkit-text-stroke: 0.3rem #fff;
  text-stroke: 0.3rem #fff;
  white-space: pre;
 }

 .history_detail_img span {
  font-size: 1rem;
  bottom: 0.2rem;
  right: 0.2rem;
  text-shadow: 0 0 0.2rem #000;
 }

 .activity_char_01 {
  width: 9.2rem;
  top: 9.5rem;
  left: -2.5rem;
 }
 .activity_char_02 {
  width: 7.8rem;
  top: 34rem;
  right: 0.5rem;
 }

 .history_item:nth-of-type(1) .history_flex {
  width: 100%;
 }
 .history_item:nth-of-type(2) .history_img {
  width: 100%;
 }

 .history_detail {
  border: none;
  padding: 0;
  flex-direction: column;
 }

 .history_item:nth-of-type(1) .history_detail:nth-of-type(2),
 .history_item:nth-of-type(2) .history_detail:nth-of-type(2) {
  margin-top: 11rem;
 }
 .history_detail_box {
  width: 26.5rem;
  border-left: 0.3rem solid #fff;
  padding-left: 1.5rem;
 }
 .history_detail_date {
  margin-bottom: 1rem;
 }
 .history_detail_ttl {
  font-size: 1.5rem;
  line-height: 1.4;
  margin: 1rem 0;
 }
 .history_item:first-of-type .history_detail_ttl {
  min-height: auto;
  display: block;
 }
 .history_detail_txt {
  font-size: 1.3rem;
  line-height: 1.6;
 }
 .history_char_01 {
  width: 12rem;
  top: 64.5rem;
  right: -2.3rem;
 }

 .history_item:nth-of-type(2) .history_flex {
  width: 17.2rem;
 }

 .history_detail:not(:nth-of-type(2)) {
  margin-top: 5rem;
 }
 .history_detail .history_detail_box:not(:first-of-type) {
  margin-top: 5rem;
 }
 .history_detail.flex_end .history_detail_box:nth-of-type(2) {
  padding-top: 4rem;
  margin: 0;
 }
 .history_detail.flex_end {
  align-items: flex-start;
 }
 .history_char_02 {
  width: 9.2rem;
  top: 37.2rem;
  left: auto;
  right: 1.2rem;
 }
 .history_char_03 {
  width: 19.3rem;
  position: relative;
  bottom: 0;
  right: 0;
  left: 0;
  margin: 0 auto;
  margin-top: 3rem;
 }
 .history_char_04 {
  width: 12.8rem;
  position: relative;
  bottom: 0;
  right: 0;
  left: 0;
  margin: 0 auto;
  margin-top: 3rem;
 }

 /*                   message                   */
 .message_inner {
  padding-bottom: 6.5rem;
 }
 .message_inner .section_ttl {
  width: 28rem;
 }
 .message_item {
  width: 31rem;
  margin: 3.2rem auto 0;
 }
 .message_flex {
  flex-direction: column;
 }
 .message_box {
  width: 100%;
 }
 .message_box:first-of-type {
  margin-bottom: 6rem;
 }
 .message_box_txt {
  width: 29.5rem;
  border: 0.3rem solid #000000;
  border-radius: 1.3rem;
  padding: 2rem 2rem;
  font-size: 1.4rem;
  line-height: 1.6;
  box-shadow: 0.5rem 0.5rem 0 #000000;
 }
 .message_box_txt span {
  width: 22.7rem;
  margin: 0 auto;
  display: block;
 }
 .message_box_img {
  width: 26.6rem;
  top: 17.5rem;
 }

 .message_btn {
  width: 29rem;
  margin-top: 10rem;
 }
 .message_btn a {
  font-size: 1.1rem;
  border-radius: 2.6rem;
  border: 0.3rem solid #000000;
  padding: 1.4rem 0;
  box-shadow: 0.7rem 0.7rem 0 #000000;
  letter-spacing: 0.1em;
 }
 .message_btn a::before {
  border-top: 0.7rem solid transparent;
  border-bottom: 0.7rem solid transparent;
  border-left: 1rem solid #fff;
  margin: 0;
  left: 2.3rem;
 }

 .message_box:first-of-type .message_btn a {
  padding-left: 1rem;
 }

 @media (hover: hover) and (pointer: fine) {
  .message_btn a:where(:any-link, :enabled, summary):hover::before {
   color: #4070b3;
   border-left: 1rem solid #4070b3;
  }

  .message_box:last-of-type .message_btn a:where(:any-link, :enabled, summary):hover::before {
   color: #ad2222;
   border-left: 1rem solid #ad2222;
  }
 }

 /*                   other                   */
 .other_inner {
  padding-bottom: 7rem;
 }

 .other_item {
  width: 32.5rem;
 }
 .other_item::before {
  top: 0.8rem;
  left: 0.8rem;
  border-radius: 5rem;
 }
 .other_item_inner {
  border: 0.4rem solid #fff;
  border-radius: 5rem;
  padding: 4.5rem 2.5rem 5.5rem;
 }
 .other_item_inner::before {
  box-shadow: inset 0.8rem 0.8rem 0 #15548080;
  border-radius: 4.5rem;
 }

 .other_item_txt {
  font-size: 1.1rem;
  line-height: 2.2;
  text-align: center;
 }

 .other_flex {
  width: 25rem;
  flex-direction: column;
  margin: 3rem auto 5rem;
 }
 .other_btn {
  width: 100%;
 }
 .other_btn:first-of-type {
  margin-bottom: 2.5rem;
 }
 .other_btn a {
  border-radius: 3.1rem;
  padding: 1.5rem 0;
 }
 .other_btn span {
  width: 15.2rem;
 }
 .other_btn a::before {
  border-top: 0.8rem solid transparent;
  border-bottom: 0.8rem solid transparent;
  border-left: 1.1rem solid #000000;
  margin-right: 0;
  left: 2.5rem;
 }

 .other_sns p {
  font-size: 1.3rem;
  display: flex;
  justify-content: center;
  align-items: flex-end;
 }
 .other_sns span {
  line-height: 1.77;
  padding: 0 1rem 0;
 }
 .other_sns p::before {
  width: 0.2rem;
  height: 3.2rem;
  transform: rotate(-20deg);
 }
 .other_sns p::after {
  width: 0.2rem;
  height: 3.2rem;
  transform: rotate(20deg);
 }

 .sns_icon {
  width: 26rem;
  margin: 3rem auto 0;
 }
 .sns_icon li {
  width: 3.7rem;
 }

 .other_img {
  width: 21.3rem;
  position: relative;
  top: 0;
  right: 0;
  left: 0;
  margin: 1.5rem auto 0;
 }

 /*                   footer                   */
 footer {
  padding: 2.3rem 0 3rem;
 }
 .footer_logo {
  width: 18.4rem;
 }
 .copy {
  font-size: 1rem;
  margin-top: 1.5rem;
 }

 /*                   popup                   */
 .popup .popup_inner {
  width: 100%;
 }
 .popup_movie {
  height: 21.1rem;
 }

 .close_btn {
  width: 2.5rem;
  height: 2.5rem;
  top: -2.8rem;
 }
 .close_btn::before {
  border: 0.1rem solid #fff;
  top: 1.2rem;
 }
 .close_btn::after {
  border: 0.1rem solid #fff;
  bottom: 1.1rem;
 }
}

.slide_img {
 position: relative;
}
.slide_img::after {
 content: "";
 position: absolute;
 top: 0;
 left: 0;
 width: 100%;
 height: 100%;
 background-color: #ad2222;
 transition: 0.4s;
 clip-path: inset(0 100% 0 0);
 z-index: 10;
}
.slide_img.blue::after {
 background-color: #0042a9;
}

.slide_img.scrollin::after {
 animation-name: slide;
 animation-duration: 0.8s;
 animation-delay: 0.2s;
 animation-fill-mode: forwards;
 animation-timing-function: ease;
}

@keyframes slide {
 0% {
  clip-path: inset(0 100% 0 0);
 }
 50% {
  clip-path: inset(0 0 0 0);
 }
 100% {
  clip-path: inset(0 0 0 100%);
 }
}

.slide_img img {
 clip-path: inset(0 100% 0 0);
}
.slide_img.scrollin img {
 animation-name: slide_show;
 animation-duration: 0.6s;
 animation-delay: 0.3s;
 animation-fill-mode: forwards;
 animation-timing-function: ease-in-out;
}
@keyframes slide_show {
 0% {
  clip-path: inset(0 100% 0 0);
 }
 100% {
  clip-path: inset(0 0 0 0);
 }
}

.char_anime {
 transition-duration: 0.4s;
 transition-delay: 0.8s;
}
.char_anime_bottom {
 transform: scale(0);
 transform-origin: bottom center;
}
.char_anime_left {
 opacity: 0;
 transform: translateX(-10%);
 transform-origin: left;
}
.char_anime_right {
 opacity: 0;
 transform: translateX(10%);
 transform-origin: right;
}
.scrollin.char_anime {
 opacity: 1;
 transform: scale(1) translate(0);
}


.thoughts_char_02 .char_anime {
 transition-delay: 1.5s;
}

.activity_sns {
 display: flex;
 flex-direction: column;
 align-items: center;
 margin-top: min(5rem, calc(50vw / 13.66));
}
.activity_sns .activity_btn {
 width: min(33.7rem, calc(337vw / 13.66));
 margin: 0 auto min(2.5rem, calc(25vw / 13.66));
}
.activity_sns_txt {
 text-align: center;
 font-size: 5rem;
 font-weight: 900;
 line-height: 1.6;
 letter-spacing: 0.1em;
 color: #e0042f;
 display: inline-block;
 white-space: inherit;
}
.activity_sns_txt::before {
 -webkit-text-stroke: 1rem #fff;
 text-stroke: 1rem #fff;
 white-space: break-spaces;
}

@media screen and (max-width: 767px) {
 .activity_sns {
  margin-top:3rem;
 }
 .activity_sns .activity_btn {
  width: 16.8rem;
  margin: 0 auto 1.5rem;
 }
 .activity_sns_txt {
  font-size: 1.7rem;
 }
 .activity_sns_txt::before {
  -webkit-text-stroke: .5rem #fff;
  text-stroke: .5rem #fff;
 }
}


.short .popup_inner {
 width:  min(35rem, calc(350vw / 13.66));
}
.short .popup_movie {
 height:  min(62.2rem, calc(622vw / 13.66));
}
@media screen and (max-width: 767px) {
 .short .popup_inner {
  width: 25rem;
 }
 .short .popup_movie {
  height: 44.4rem;
 }
}