﻿html,
body,
div,
span,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
abbr,
address,
cite,
code,
del,
dfn,
em,
img,
ins,
kbd,
q,
samp,
small,
strong,
sub,
sup,
var,
b,
i,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
article,
aside,
canvas,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section,
summary,
time,
mark,
audio,
video {
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
    font-size: 100%;
    vertical-align: baseline;
    background: rgba(0, 0, 0, 0);
    box-sizing: border-box
}

input,
textarea {
    box-sizing: border-box
}

body {
    line-height: 1
}

article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section {
    display: block
}

nav ul {
    list-style: none
}

blockquote,
q {
    quotes: none
}

blockquote:before,
blockquote:after,
q:before,
q:after {
    content: "";
    content: none
}

a {
    margin: 0;
    padding: 0;
    font-size: 100%;
    vertical-align: baseline;
    background: rgba(0, 0, 0, 0)
}

ins {
    background-color: #ff9;
    color: #000;
    text-decoration: none
}

mark {
    background-color: #ff9;
    color: #000;
    font-style: italic;
    font-weight: bold
}

del {
    text-decoration: line-through
}

abbr[title],
dfn[title] {
    border-bottom: 1px dotted;
    cursor: help
}

table {
    border-collapse: collapse;
    border-spacing: 0
}

hr {
    display: block;
    height: 1px;
    border: 0;
    border-top: 1px solid #ccc;
    margin: 1em 0;
    padding: 0
}

input,
select {
    vertical-align: middle
}

button {
    background-color: rgba(0, 0, 0, 0);
    border: none;
    cursor: pointer;
    outline: none;
    padding: 0;
    appearance: none
}

@keyframes in-right_anime {
    0% {
        transform: translateX(100%)
    }

    100% {
        transform: translateX(0)
    }
}

@keyframes in-left_anime {
    0% {
        opacity: 0;
        transform: translateX(-100%)
    }

    100% {
        opacity: 1;
        transform: translateX(0)
    }
}

@keyframes fade-up_anime {
    0% {
        opacity: 0;
        transform: translateY(50px)
    }

    100% {
        opacity: 1;
        transform: translateY(0)
    }
}

@keyframes mission_object_bg-anime {
    0% {
        transform: rotate(0deg);
        background-position: 0%
    }

    50% {
        transform: rotate(-180deg);
        background-position: 100%
    }

    100% {
        transform: rotate(-360deg);
        background-position: 0%
    }
}

@keyframes logo_scale_anime {
    0% {
        opacity: 0;
        transform: scale(0.6)
    }

    100% {
        opacity: 1;
        transform: scale(1)
    }
}

@keyframes shooting-star {
    0% {
        height: 0;
        opacity: .5
    }

    50% {
        height: 200px;
        opacity: 1
    }

    100% {
        opacity: 0;
        height: 260px
    }
}

@keyframes twinkle-stars {
    0% {
        opacity: 0
    }

    50% {
        transform: scale(1.1);
        opacity: 1
    }

    100% {
        opacity: 0;
        transform: scale(1)
    }
}

@keyframes marker_anime {
    0% {
        background-size: 0 30%
    }

    100% {
        background-size: 100% 30%
    }
}

@keyframes fixed-notice_anime_pc {
    0% {
        bottom: -50%
    }

    100% {
        bottom: 0
    }
}

@keyframes no1_anime {
    0% {
        transform: scale(1, 1) translate(0%, 0%)
    }

    15% {
        transform: scale(0.5, 0.5) translate(0%, 20%)
    }

    30% {
        transform: scale(1.8, 0.2) translate(0%, 40%)
    }

    50% {
        transform: scale(0.5, 1.5) translate(0%, -40%)
    }

    70% {
        transform: scale(2, 0.6) translate(0%, 20%)
    }

    100% {
        transform: scale(1, 1) translate(0%, 0%)
    }
}

@keyframes no1_anime {
    0% {
        transform: scale(1, 1)
    }

    40% {
        transform: scale(5, 5)
    }

    80% {
        transform: scale(0.5, 0.5)
    }

    100% {
        transform: scale(1, 1)
    }
}

body {
    line-height: 1.4;
    font-family: "Yu Gothic Medium", "游ゴシック Medium", YuGothic, "游ゴシック体", sans-serif
}

.all-wrapper {
    width: 100%
}

@media screen and (min-width: 768px) {

    #top,
    #oc,
    #not-found {
        width: 100%
    }
}

a {
    text-decoration: none
}

a:hover {
    text-decoration: none
}

p {
    font-size: 16px;
    line-height: 1.6
}

.header {
    width: 100%;
    height: 65px;
    padding: 10px 55px 10px 16px;
    background: #ffffffc8;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 15px;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 10;
    transition: background-color .5s
}

@media screen and (min-width: 768px) {
    .header {
        padding: 10px 90px 10px 16px;
        height: 80px
    }
}

@media screen and (min-width: 1025px) {
    .header {
        padding: 20px 110px 20px 40px;
        transition: .6s
    }
}

.header_logo {
    margin-right: auto;
    width: 150px
}

@media screen and (min-width: 768px) {
    .header_logo {
        width: 170px
    }
}

.header_logo a {
    display: block
}

.header_logo_svg {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain
}

.header_logo-white_svg {
    display: none
}

.header_drawer-btn_wrap {
    width: 26px;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: space-between;
    position: fixed;
    top: 15px;
    right: 20px;
    z-index: 2
}

@media screen and (min-width: 768px) {
    .header_drawer-btn_wrap {
        width: 56px;
        top: 5px
    }
}

/* @media screen and (min-width: 1024px) {
    .header_drawer-btn_wrap {
        top: 90px;
        right: 30px
    }
} */

.header_drawer-btn {
    width: 26px;
    height: 26px;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    cursor: pointer;
    transition: 0.6s;
    border-radius: 50%
}

@media screen and (min-width: 768px) {
    .header_drawer-btn {
        width: 50px;
        height: 50px
    }
}

.header_drawer-btn_text {
    font-size: 12px;
    font-family: "rig-shaded-Medium-Face", sans-serif;
    transition: .3s;
    color: #7c7c7c;
}

@media screen and (min-width: 768px) {
    .header_drawer-btn_text {
        margin-top: -10px
    }
}

@media screen and (min-width: 1024px) {
    /* .header_drawer-btn_text {
        color: #fff
    } */
}

.btnActive {
    justify-content: center;
    background: #000;
    top: 15px
}

.btn_wrapActive {
    align-items: center
}

@media screen and (min-width: 1024px) {
    .btn_wrapActive {
        top: 10px
    }
}

@media screen and (min-width: 768px) {
    .btn_wrapActive .header_drawer-btn_text {
        margin-top: 0
    }
}

@media screen and (min-width: 1024px) {
    .btn_wrapActive .header_drawer-btn_text {
        color: #7c7c7c
    }
}

/* @media screen and (min-width: 1025px) {
    .header_front-page {
        transform: translateY(-80px)
    }
} */

.header_front-pageActive {
    transform: translateY(0)
}

/* @media screen and (min-width: 1024px) {
    .header_front-pageActive .header_drawer-btn_wrap {
        top: 10px
    }
} */

@media screen and (min-width: 1024px) {
    .header_front-pageActive .header_drawer-btn_text {
        color: #7c7c7c
    }
}

body.drawer-open .header_front-page {
    opacity: 1;
    transform: translateY(0)
}

@media screen and (min-width: 1024px) {
    #top .header_drawer-btn_wrap {
        /* opacity: 0; */
        /* transition: opacity 0.1s ease-in */
    }
}

@media screen and (min-width: 1024px) {
    .sub-pages_header .header_drawer-btn_wrap {
        top: 10px
    }
}

.sub-pages_header.sub-pages_header-default .header_drawer-btn_text {
    color: #fff
}

.sub-pages_header .header_drawer-btn_text {
    color: #7c7c7c
}

.sub-pages_header .btn_wrapActive .header_drawer-btn_text {
    color: #7c7c7c
}

.gnav-sp {
    width: 100%;
    height: calc(100vh - 65px);
    height: calc(100svh - 65px);
    background: #fff;
    overflow-y: scroll;
    position: fixed;
    top: 65px;
    left: 0;
    z-index: 1;
    opacity: 0;
    pointer-events: none;
    transition: .3s
}

@media screen and (min-width: 768px) {
    .gnav-sp {
        top: 80px
    }
}

@media screen and (min-width: 1025px) {
    .gnav-sp {
        display: none
    }
}

.gnav-spActive {
    opacity: 1;
    pointer-events: auto
}

.gnav-sp_top-box {
    padding: 20px 0;
    background: url(../images/common/bg-star.jpg) center center/cover fixed
}

.gnav-sp_top-nav_item {
    position: relative;
    background: rgba(0, 0, 0, .2)
}

.gnav-sp_top-nav_item:not(:last-child) {
    margin-bottom: 2px
}

.gnav-sp_top-nav_item:before {
    content: "";
    display: block;
    width: 4px;
    height: 4px;
    background: #fff;
    position: absolute;
    top: 50%;
    left: 8px;
    transform: translateY(-50%)
}

.gnav-sp_top-nav_item a {
    display: block;
    padding-left: 20px;
    font-size: 21px;
    font-weight: 700;
    color: #fff;
    line-height: 56px;
    position: relative
}

.gnav-sp_middle-nav_item {
    border-bottom: 4px solid #f5eff4
}

.gnav-sp_middle-nav_heading {
    font-size: 18px;
    font-weight: 700;
    color: #916195;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 10px
}

.gnav-sp_middle-nav_heading_txt {
    line-height: 56px
}

.gnav-sp_middle-nav_heading_icon {
    margin-left: auto;
    height: 56px;
    width: 56px;
    transition: .3s;
    display: flex;
    align-items: center;
    justify-content: center
}

.gnav-sp_middle-nav_heading_icon svg {
    width: 16px;
    height: 16px;
    stroke: #916195;
    transition: .3s
}

.gnav-sp_middle-nav_heading::before {
    margin-left: 17px;
    content: "◆";
    font-size: 14px
}

.gnav-sp_middle-nav_drawer_list {
    display: none;
    padding: 15px 0;
    background: #f5eff4
}

.gnav-sp_middle-nav_drawer_list a {
    display: block;
    padding: 6px 40px;
    color: #000
}

.gnav-sp_middle-nav_drawer_item:not(:last-child) {
    margin-bottom: 10px
}

.gnav-sp_middle-nav_drawer_item a {
    position: relative;
    display: flex;
    align-items: flex-start;
    justify-content: flex-start
}

.gnav-sp_middle-nav_drawer_item a::before {
    content: "・";
    display: block;
    color: #916195
}

.gnav-sp_middle-nav_drawer_item object {
    margin-left: 10px
}

.close .gnav-sp_middle-nav_heading_icon {
    background: #916195
}

.close .gnav-sp_middle-nav_heading_icon svg {
    transform: rotate(180deg);
    stroke: #fff
}

.close .gnav-sp_middle-nav_heading_icon .plus-line_none {
    display: none
}

.gnav-sp_bottom-box {
    padding: 4.6vw
}

.gnav-sp_bottom-nav_link-btn {
    margin-bottom: 20px
}

@media screen and (min-width: 768px) {
    .gnav-sp_bottom-nav_link-btn {
        width: 350px
    }
}

.gnav-sp_bottom-nav_link-btn a {
    padding: 10px;
    display: flex;
    background: #222a6c;
    align-items: center;
    justify-content: center;
    gap: 6px;
    transition: .3s
}

.gnav-sp_bottom-nav_link-btn p {
    color: #fff;
    font-size: 18px;
    font-weight: 700
}

.gnav-sp_bottom-nav_logo-mark {
    width: 20px;
    height: 20px
}

.gnav-sp_bottom-nav_info_wrap {
    margin-bottom: 20px
}

.gnav-sp_bottom-nav_address_wrap {
    font-size: 15px;
    color: #7c7c7c
}

.gnav-sp_bottom-nav_address_wrap p:first-of-type {
    margin-bottom: 15px
}

.gnav-sp_bottom-nav_site-map {
    width: fit-content;
    border-bottom: 1px solid #7c7c7c
}

.gnav-sp_bottom-nav_site-map a {
    padding-bottom: 5px;
    color: #7c7c7c;
    transition: .3s
}

.gnav-sp_bottom-nav_copy-rights_pc {
    display: none
}

.gnav-sp_bottom-nav_copy-rights_sp {
    font-size: 15px;
    color: #7c7c7c
}

.gnav-pc {
    display: none
}

@media screen and (min-width: 1025px) {
    .gnav-pc {
        display: block;
        background: #fff;
        overflow: scroll;
        width: 100%;
        height: 100vh;
        position: fixed;
        top: 0;
        left: 0;
        z-index: 1;
        display: flex;
        align-items: flex-start;
        align-items: stretch;
        justify-content: space-between;
        background: url(../images/common/bg-star.jpg) center center/cover fixed;
        opacity: 0;
        pointer-events: none;
        transition: .3s
    }
}

.gnav-pc_left-box {
    padding-top: 5vh;
    width: 24.5vw;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start
}

.gnav-pc_logo01 {
    margin: 0 auto 5vh;
    width: 15.6vw;
    max-width: 300px
}

.gnav-pc_logo01 a {
    display: block
}

.gnav-pc_logo01 img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain
}

.gnav-pc_logo02 {
    margin-top: auto;
    width: 100%
}

.gnav-pc_logo02 a {
    display: block;
    padding: 5vh 10px 5vh 0;
    transition: .3s
}

.gnav-pc_logo02 a:hover {
    background: rgba(0, 0, 0, .2)
}

.gnav-pc_logo02 img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain
}

.gnav-pc_logo02 p {
    margin: 0 auto;
    width: 13.9vw;
    max-width: 270px
}

.gnav-pc_left-nav {
    width: 100%
}

.gnav-pc_left-nav_item {
    overflow: hidden
}

.gnav-pc_left-nav_item a {
    padding-left: 20px;
    padding: 11px 0 11px 20px;
    color: #fff;
    font-size: min(1.4vw, 26px);
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 20px;
    position: relative;
    z-index: 1
}

.gnav-pc_left-nav_item a:hover::before {
    background: #fff
}

.gnav-pc_left-nav_item a:hover::after {
    transform: translateX(0)
}

.gnav-pc_left-nav_item a::before {
    content: "";
    display: block;
    width: 6px;
    height: 6px;
    background: rgba(255, 255, 255, .2);
    transition: .4
}

.gnav-pc_left-nav_item a::after {
    content: "";
    display: inline-block;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, .2);
    transform: translateX(-100%);
    transition: transform .4s;
    z-index: -1
}

.gnav-pc_right-box {
    background: #fff;
    width: 75.5vw;
    padding: 3vw 3vw 20px;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start
}

.gnav-pc_right-box_nav-wrap {
    margin-top: 12vh;
    display: flex;
    align-items: flex-start;
    justify-content: center;
    flex-wrap: wrap;
    gap: 3.6vw 2.6vw
}

.gnav-pc_right-box_info-wrap {
    width: 100%;
    margin-top: auto;
    display: flex;
    align-items: flex-start;
    justify-content: flex-start
}

@media screen and (min-width: 1750px) {
    .gnav-pc_right-box_info-wrap {
        align-items: center
    }
}

.gnav-pc_right-box_info-wrap p {
    font-size: clamp(14px, 1vw, 16px);
    color: #7c7c7c
}

@media screen and (min-width: 1750px) {
    .gnav-pc_right-box_info-wrap br {
        display: none
    }
}

.gnav-pc_right-nav_container {
    width: calc(33% - 1.7vw)
}

.gnav-pc_right-nav_title {
    margin-bottom: 2%;
    font-size: min(1.6vw, 30px);
    font-weight: 700;
    color: #916195;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    position: relative
}

.gnav-pc_right-nav_title::before {
    margin-right: 8px;
    content: "◆";
    font-size: 12px
}

.gnav-pc_right-nav_title::after {
    content: attr(data-english);
    font-size: clamp(14px, 1vw, 16px);
    font-weight: 400;
    position: absolute;
    top: -22px;
    left: 20px
}

.gnav-pc_right-nav_item {
    overflow: hidden
}

.gnav-pc_right-nav_item a {
    display: block;
    padding: 5px 0 5px 15px;
    border-left: 3px solid #f5eff4;
    color: #000;
    font-size: clamp(16px, 1vw, 18px);
    position: relative;
    z-index: 1;
    transition: .4s
}

.gnav-pc_right-nav_item a:hover {
    border-left-color: #916195
}

.gnav-pc_right-nav_item a:hover::after {
    width: 100%
}

.gnav-pc_right-nav_item a::after {
    content: "";
    display: inline-block;
    position: absolute;
    top: 0;
    left: 0;
    width: 0%;
    height: 100%;
    background: #f5eff4;
    transition: transform .4s;
    z-index: -1;
    transition: .4s
}

.gnav-pc_right-nav_item a object {
    margin-left: 10px
}

.gnav-pcActive {
    opacity: 1;
    pointer-events: auto
}

.footer {
    padding-top: 20px;
    border-top: 1px solid #e5e5e5;
    background: #fff
}

@media screen and (min-width: 1025px) {
    .footer {
        padding: 20px 4vw;
        display: flex;
        align-items: center;
        justify-content: flex-start;
        gap: 4vw
    }
}

@media screen and (min-width: 1025px) {
    .footer_content-wrap {
        width: 72vw;
        position: relative
    }
}

.footer_logo-img {
    margin: 0 auto 40px;
    width: 60vw;
    max-width: 400px
}

@media screen and (min-width: 768px) {
    .footer_logo-img {
        margin: 0 auto 40px 36px
    }
}

@media screen and (min-width: 1025px) {
    .footer_logo-img {
        margin: 0 auto;
        max-width: none;
        width: 20vw
    }
}

.footer_logo-img img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: contain
}

.footer_link-btn {
    margin-bottom: 20px;
    padding: 0 4.6vw 0
}

@media screen and (min-width: 768px) {
    .footer_link-btn {
        padding: 0;
        margin-left: 36px
    }
}

@media screen and (min-width: 1025px) {
    .footer_link-btn {
        margin-left: 0;
        padding: 0;
        align-self: center
    }
}

.footer_link-btn a {
    padding: 10px;
    display: flex;
    background: #222a6c;
    align-items: center;
    justify-content: center;
    gap: 6px;
    transition: .3s
}

@media screen and (min-width: 768px) {
    .footer_link-btn a {
        width: 350px
    }
}

@media screen and (min-width: 1025px) {
    .footer_link-btn a {
        width: 550px
    }

    .footer_link-btn a:hover {
        opacity: .6
    }
}

.footer_link-btn p {
    color: #fff;
    font-size: 18px;
    font-weight: 700
}

.footer_logo-mark {
    width: 20px;
    height: 20px
}

.footer_info_wrap {
    margin-bottom: 20px;
    padding: 0 4.6vw
}

@media screen and (min-width: 768px) {
    .footer_info_wrap {
        margin-left: 36px;
        padding: 0
    }
}

@media screen and (min-width: 1025px) {
    .footer_info_wrap {
        margin-left: 0
    }
}

.footer_address_wrap {
    font-size: 15px;
    color: #7c7c7c
}

@media screen and (min-width: 1280px) {
    .footer_address_wrap {
        display: flex;
        align-items: flex-start;
        justify-content: flex-start;
        gap: 20px
    }
}

.footer_address_wrap p:first-of-type {
    margin-bottom: 15px
}

@media screen and (min-width: 1025px) {
    .footer_address_wrap p:first-of-type {
        margin-bottom: 0
    }
}

@media screen and (min-width: 1025px) {
    .footer_address_wrap p:first-of-type>span {
        margin-right: 1em
    }
}

@media screen and (min-width: 1025px) {
    .footer_address_wrap p:first-of-type>br {
        display: none
    }
}

.footer_site-map {
    width: fit-content;
    border-bottom: 1px solid #7c7c7c
}

.footer_site-map a {
    padding-bottom: 5px;
    color: #7c7c7c;
    transition: .3s
}

@media screen and (min-width: 1025px) {
    .footer_site-map a:hover {
        opacity: .6
    }
}

.footer_sns_wrap {
    padding: 0 4.6vw;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 10px
}

@media screen and (min-width: 768px) {
    .footer_sns_wrap {
        margin-left: 36px;
        padding: 0
    }
}

@media screen and (min-width: 1025px) {
    .footer_sns_wrap {
        margin-left: 0;
        position: absolute;
        bottom: 20px;
        right: 0
    }
}

.footer_sns_wrap p {
    width: 26px;
    height: 26px
}

@media screen and (min-width: 1025px) {
    .footer_sns_wrap p {
        width: 32px;
        height: 32px;
        transition: .3s
    }

    .footer_sns_wrap p:hover {
        opacity: .6
    }
}

.footer_copy-rights_pc {
    display: none
}

@media screen and (min-width: 1025px) {
    .footer_copy-rights_pc {
        display: block;
        margin-top: 5px;
        font-size: 16px;
        color: #7c7c7c
    }
}

.footer_copy-rights_sp {
    padding: 20px;
    font-size: 15px;
    color: #7c7c7c
}

@media screen and (min-width: 768px) {
    .footer_copy-rights_sp {
        padding: 20px 20px 20px 36px
    }
}

@media screen and (min-width: 1025px) {
    .footer_copy-rights_sp {
        display: none
    }
}

@media screen and (min-width: 1025px) {
    #top .footer {
        display: block;
        padding: 20px 0 0
    }
}

@media screen and (min-width: 1025px) {
    #top .footer_content-wrap {
        width: 100%;
        display: flex;
        align-items: flex-start;
        justify-content: space-between;
        gap: 3.6vw
    }
}

@media screen and (min-width: 1025px) {
    #top .footer_link-btn {
        margin-left: 3.6vw;
        margin-bottom: 0
    }

    #top .footer_link-btn a {
        width: 28.6vw
    }
}

@media screen and (min-width: 1025px) {
    #top .footer_address_wrap p:first-of-type>br {
        display: block
    }
}

@media screen and (min-width: 1536px) {
    #top .footer_address_wrap p:first-of-type>br {
        display: none
    }
}

@media screen and (min-width: 1025px) {
    #top .footer_sns_wrap {
        position: static;
        padding-right: 3.6vw;
        padding-bottom: 10px;
        align-self: center
    }
}

#top .top-none {
    display: none
}

.not-found_wrap {
    height: 80vh;
    background: url(../images/common/bg-star.jpg) center center/cover;
    display: flex;
    align-items: center;
    justify-content: center
}

@media screen and (min-width: 1025px) {
    .not-found_wrap {
        height: 90vh
    }
}

.not-found_txt-wrap {
    margin: 0 auto;
    width: 80%
}

@media screen and (min-width: 768px) {
    .not-found_txt-wrap {
        width: 450px
    }
}

.not-found_title {
    margin-bottom: 20px;
    font-size: min(8vw, 46px);
    color: #fff;
    font-family: "rig-shaded-Medium-Face", sans-serif
}

@media screen and (min-width: 1025px) {
    .not-found_title {
        margin-bottom: 40px
    }
}

.not-found_title img {
    margin-inline: .05em;
    width: min(5vw, 30px);
    vertical-align: -0.01em;
    animation-name: not-found-txt_anime;
    animation-duration: 5s;
    animation-iteration-count: infinite
}

.not-found_txt {
    font-size: min(4vw, 20px);
    color: #fff
}

.not-found_txt:nth-of-type(2) {
    margin-bottom: 30px
}

@media screen and (min-width: 1025px) {
    .not-found_txt:nth-of-type(2) {
        margin-bottom: 60px
    }
}

.not-found_btn {
    margin: 0 auto 0;
    width: fit-content;
    width: 100%;
    max-width: 450px
}

.not-found_btn a {
    display: block;
    font-size: min(4.6vw, 20px);
    line-height: 50px;
    color: #fff;
    text-align: center;
    border: 1px solid #fff;
    border-radius: 8px;
    transition: .3s
}

@media screen and (min-width: 1025px) {
    .not-found_btn a:hover {
        background: #916195;
        border: 1px solid #916195
    }
}

.not-found_wrap .seach-box {
    margin: 20px auto 60px;
    width: 100%;
    max-width: 450px;
    height: 50px
}

@keyframes not-found-txt_anime {
    0% {
        transform: rotate(0deg)
    }

    80% {
        transform: rotate(360deg)
    }

    100% {
        transform: rotate(360deg)
    }
}

@media screen and (min-width: 768px) {
    a[href*="tel:"] {
        pointer-events: none;
        cursor: default;
        text-decoration: none
    }
}

.switch {
    animation-play-state: paused;
    animation-fill-mode: both
}

[data-emergence=visible] .switch {
    animation-play-state: running
}

/* .in-right {
    animation-name: in-right_anime;
    animation-duration: .8s
} */

/* .in-left {
    animation-name: in-right_anime;
    animation-duration: .8s
} */

/* @media screen and (min-width: 1025px) {
    .in-left {
        animation-name: in-left_anime
    }
} */

.in-left_tab {
    animation-name: in-right_anime;
    animation-duration: .8s
}

@media screen and (min-width: 768px) {
    .in-left_tab {
        animation-name: in-left_anime
    }
}

.in-right_tab {
    animation-name: in-right_anime;
    animation-duration: .8s
}

@media screen and (min-width: 768px) {
    .in-right_tab {
        animation-name: in-left_anime
    }
}

@media screen and (min-width: 1025px) {
    .in-right_tab {
        animation-name: in-right_anime
    }
}

.in-up {
    /* animation-name: fade-up_anime;
    animation-duration: .8s */
    opacity: 1;
    transform: translateY(0);
}

.no-1 {
    /* display: inline-block;
    animation-name: no1_anime;
    animation-duration: 2s;
    animation-timing-function: ease-in-out */
}

.delay400 {
    animation-delay: .4s
}

.delay500 {
    animation-delay: .5s
}

.delay600 {
    animation-delay: .6s
}

.delay700 {
    animation-delay: .7s
}

.delay800 {
    animation-delay: .8s
}

.delay900 {
    animation-delay: .9s
}

.delay1000 {
    animation-delay: 1s
}

.delay1100 {
    animation-delay: 1.1s
}

.delay1200 {
    animation-delay: 1.2s
}

.delay1300 {
    animation-delay: 1.3s
}

.delay1400 {
    animation-delay: 1.4s
}

.delay1500 {
    animation-delay: 1.5s
}

.delay1600 {
    animation-delay: 1.6s
}

.delay1700 {
    animation-delay: 1.7s
}

.delay1800 {
    animation-delay: 1.8s
}

.delay1900 {
    animation-delay: 1.9s
}

.delay2000 {
    animation-delay: 2s
}

@media screen and (min-width: 768px) {
    .display-none_tab {
        display: none
    }
}

@media screen and (min-width: 1025px) {
    .display-none_pc {
        display: none
    }
}

.display-none_sp {
    display: none
}

@media screen and (min-width: 768px) {
    .display-none_sp {
        display: block
    }
}

.link_blank::after {
    margin-left: 5px;
    content: "";
    display: inline-block;
    width: 16px;
    height: 16px;
    background: url(../images/icon/link-icon_green.svg) center center/contain no-repeat
}

.link-anchor {
    display: block;
    padding-top: 80px;
    margin-top: -80px
}

.application-oc .application-icon_bg {
    fill: #82429a
}

.application-oc .application-icon_line {
    stroke: #82429a
}

.application-entry .application-icon_bg {
    fill: #3b6a9a
}

.application-entry .application-icon_line {
    stroke: #3b6a9a
}

@media screen and (min-width: 768px) {
    .application-wrap_sp {
        display: none
    }
}

.application-wrap_pc {
    display: none
}

@media screen and (min-width: 768px) {
    .application-wrap_pc {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 25px
    }
}

.application-wrap_pc svg {
    width: 100%;
    height: 100%;
    object-fit: contain;
    display: block
}

@media screen and (min-width: 1025px) {

    .application-oc,
    .application-entry {
        display: flex;
        align-items: flex-start;
        justify-content: center;
        gap: 3px;
        transition: .3s
    }

    .application-oc:hover,
    .application-entry:hover {
        opacity: .6
    }
}

.application-oc .application_txt,
.application-entry .application_txt {
    font-size: 12px;
    font-weight: 700;
    position: relative
}

@media screen and (min-width: 390px) {

    .application-oc .application_txt,
    .application-entry .application_txt {
        padding-left: 20px
    }
}

@media screen and (min-width: 1025px) {

    .application-oc .application_txt,
    .application-entry .application_txt {
        margin-top: auto;
        padding-left: 0;
        font-size: 16px
    }
}

.application-oc .application_pic {
    width: 105px
}

@media screen and (min-width: 1025px) {
    .application-oc .application_pic {
        padding-bottom: 10px;
        width: 170px
    }
}

.application-oc .application_txt {
    color: #916195
}

@media screen and (min-width: 1025px) {
    .application-oc .application_txt::before {
        content: attr(data-application-en);
        position: absolute;
        top: -85%;
        left: 8px
    }
}

.application-entry .application_pic {
    width: 78px
}

@media screen and (min-width: 1025px) {
    .application-entry .application_pic {
        padding-bottom: 10px;
        width: 125px
    }
}

.application-entry .application_txt {
    color: #3b6a9a
}

@media screen and (min-width: 1025px) {
    .application-entry .application_txt::before {
        content: attr(data-application-en);
        position: absolute;
        top: -85%;
        left: 8px
    }
}

.fixed-menu {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 2px;
    position: fixed;
    bottom: 20px;
    right: 10px;
    z-index: 5;
    transition: transform .3s, opacity .3s;
    /* transform: translateY(50px); */
    /* opacity: 0; */
    /* pointer-events: none */
}

@media screen and (min-width: 375px) {
    .fixed-menu {
        gap: 10px
    }
}

@media screen and (min-width: 390px) {
    .fixed-menu {
        right: 20px
    }
}

@media screen and (min-width: 1025px) {
    .fixed-menu {
        gap: 20px;
        bottom: 40px;
        right: 70px
    }
}

.pamphlet-btn a {
    padding: 5px 12px;
    background: rgba(39, 122, 152, .8);
    border-radius: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    transition: .3s
}

@media screen and (min-width: 1025px) {
    .pamphlet-btn a {
        padding: 6px 22px;
        border: 2px solid rgba(0, 0, 0, 0)
    }

    .pamphlet-btn a:hover {
        border: 2px solid #fff
    }
}

.pamphlet-btn p:first-of-type {
    width: 13px;
    height: 16px
}

@media screen and (min-width: 390px) {
    .pamphlet-btn p:first-of-type {
        width: 17px;
        height: 19px
    }
}

.pamphlet-btn p {
    color: #fff;
    font-size: 13px
}

@media screen and (min-width: 375px) {
    .pamphlet-btn p {
        font-size: 15px
    }
}

@media screen and (min-width: 1025px) {
    .pamphlet-btn p {
        font-size: 20px
    }
}

.pamphlet-btn p img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain
}

.request-btn a {
    padding: 5px 12px;
    background: rgba(44, 29, 85, .8);
    border-radius: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    transition: .3s
}

@media screen and (min-width: 1025px) {
    .request-btn a {
        padding: 6px 22px;
        border: 2px solid rgba(0, 0, 0, 0)
    }

    .request-btn a:hover {
        border: 2px solid #fff
    }
}

.request-btn p:first-of-type {
    width: 13px;
    height: 16px
}

@media screen and (min-width: 390px) {
    .request-btn p:first-of-type {
        width: 17px;
        height: 19px
    }
}

.request-btn p {
    color: #fff;
    font-size: 13px
}

@media screen and (min-width: 375px) {
    .request-btn p {
        font-size: 15px
    }
}

@media screen and (min-width: 1025px) {
    .request-btn p {
        font-size: 20px
    }
}

.request-btn p img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain
}

.top-btn {
    width: fit-content
}

.top-btn a {
    display: block;
    padding: 10px 10px 11px;
    background: rgba(0, 0, 0, .9);
    border-radius: 50%;
    transition: background-color .3s
}

@media screen and (min-width: 1025px) {
    .top-btn a:hover {
        background: rgba(0, 0, 0, .6)
    }
}

.top-btn p {
    width: 10px;
    height: 10px
}

.top-btn p img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain
}

.fixed-menuActive {
    transform: none;
    opacity: 1;
    pointer-events: auto
}

.markerActive {
    background-image: linear-gradient(90deg, #F7F0D2, #F7F0D2);
    background-repeat: no-repeat;
    background-position: bottom left;
    background-size: 100% 30%;
    /* animation: marker_anime 1.5s ease-in-out forwards; */
}

.drawer-btn_top,
.drawer-btn_middle,
.drawer-btn_bottom {
    display: block;
    height: 1.5px;
    background: #7c7c7c;
    position: absolute;
    transition: .6s
}

@media screen and (min-width: 1024px) {

    /* .drawer-btn_top,
    .drawer-btn_middle,
    .drawer-btn_bottom {
        background: #fff
    } */
}

.drawer-btn_top {
    width: 100%;
    transform: translateY(-8px)
}

.drawer-btn_middle {
    width: 75%
}

.drawer-btn_bottom {
    width: 50%;
    transform: translateY(8px)
}

.topActive {
    width: 70%;
    background: #fff;
    transform: translateY(0) rotate(45deg)
}

.middleActive {
    opacity: 0
}

.bottomActive {
    width: 70%;
    background: #fff;
    transform: translateY(0) rotate(-45deg)
}

@media screen and (min-width: 1024px) {

    .header_front-pageActive .drawer-btn_top,
    .header_front-pageActive .drawer-btn_middle,
    .header_front-pageActive .drawer-btn_bottom {
        background: #7c7c7c
    }
}

@media screen and (min-width: 1024px) {

    .sub-pages_header.sub-pages_header-default .drawer-btn_top,
    .sub-pages_header.sub-pages_header-default .drawer-btn_middle,
    .sub-pages_header.sub-pages_header-default .drawer-btn_bottom {
        background: #fff
    }
}

@media screen and (min-width: 1024px) {

    .sub-pages_header .drawer-btn_top,
    .sub-pages_header .drawer-btn_middle,
    .sub-pages_header .drawer-btn_bottom {
        background: #7c7c7c
    }
}

.seach-box {
    margin: 0 20px 20px;
    padding: 0 10px;
    border: 1px solid #fff;
    border-radius: 7px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px
}

@media screen and (min-width: 1025px) {
    .seach-box {
        margin: 0 auto 1vh;
        width: 20vw
    }
}

.seach-box_seach {
    height: 50px;
    width: 90%
}

@media screen and (min-width: 1025px) {
    .seach-box_seach {
        height: 5vh;
        max-height: 50px
    }
}

.seach-box_seach input {
    background: none;
    border: none;
    outline: none;
    height: 100%;
    width: 100%;
    color: #fff;
    font-size: clamp(16px, 1vw, 18px)
}

.seach-box_seach-icon {
    width: 10%;
    height: 50px;
    display: flex;
    align-items: center;
    justify-content: center
}

@media screen and (min-width: 1025px) {
    .seach-box_seach-icon {
        height: 5vh;
        max-height: 50px
    }
}

.seach-box_seach-icon input {
    width: 20px;
    height: 20px;
    background: url(../images/icon/seach-icon.svg) center center/contain no-repeat
}

@media screen and (min-width: 1025px) {
    .seach-box_seach-icon input {
        width: 24px;
        height: 24px
    }
}

.sns-wrap {
    margin-bottom: 25px;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 10px
}

.sns-wrap p {
    width: 26px;
    height: 26px
}

@media screen and (min-width: 1025px) {
    .sns-wrap p {
        width: 32px;
        height: 32px;
        transition: .3s
    }

    .sns-wrap p:hover {
        opacity: .6
    }
}

.sns-wrap p img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain
}

@media screen and (min-width: 1025px) {
    .gnav-pc .sns-wrap {
        margin-bottom: 0;
        margin-left: auto
    }
}

.new-topicpath {
    padding: 10px;
    background: #ededed
}

@media screen and (min-width: 768px) {
    .new-topicpath {
        margin-bottom: 30px;
        padding-left: 8vw
    }
}

.new-topicpath span {
    color: #7c7c7c
}

.new-topicpath ul {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 10px
}

.new-topicpath li {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 10px
}

.new-topicpath li:not(:last-of-type)::after {
    content: ">";
    color: #7c7c7c
}

.oc .new-topicpath {
    margin-bottom: 25px
}

@media screen and (min-width: 768px) {
    .oc .new-topicpath {
        margin-bottom: 50px
    }
}

.line-btn {
    margin: 0 auto 40px;
    max-width: 550px
}

@media screen and (min-width: 768px) {
    .line-btn {
        margin-bottom: 60px
    }
}

.line-btn a {
    display: block;
    font-size: 21px;
    font-weight: 700;
    color: #fff;
    line-height: 60px;
    text-align: center;
    background: #3f7e23;
    border-radius: 8px;
    transition: .3s
}

@media screen and (min-width: 768px) {
    .line-btn a {
        font-size: 24px
    }
}

@media screen and (min-width: 1025px) {
    .line-btn a:hover {
        opacity: .6
    }
}

.oc-yet .line-btn {
    margin-bottom: 0;
    max-width: 210px
}

@media screen and (min-width: 768px) {
    .oc-yet .line-btn a {
        line-height: 37px;
        font-size: 21px
    }
}

.pdf-btn {
    margin-left: auto;
    width: fit-content
}

.pdf-btn a {
    padding: 8px 16px;
    color: #fff;
    background: #7f9eaa;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    transition: .3s
}

@media screen and (min-width: 1025px) {
    .pdf-btn a:hover {
        opacity: .6
    }
}

.purple-link-btn {
    margin-left: auto;
    width: fit-content
}

.purple-link-btn-flex {
    display: flex;
    flex-direction: column-reverse;
    gap: 20px;
}


@media screen and (min-width: 1025px) {
    .purple-link-btn {
        margin: 0 auto;
        position: relative
    }

    .purple-link-btn:hover a {
        opacity: .6
    }

    .purple-link-btn:hover svg {
        right: -50px
    }

    .purple-link-btn-flex {
        flex-direction: row;
        align-items: center;
        justify-content: center;
        gap: min(16%, 100px);
    }

    .purple-link-btn-flex .purple-link-btn {
        margin: 0;
    }
}

@media screen and (min-width: 1025px)and (min-width: 1280px) {
    .purple-link-btn:hover svg {
        right: -100px
    }
}

.purple-link-btn a {
    padding: 7px 26px 7px 12px;
    color: #fff;
    background: #916195;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    transition: .3s
}

@media screen and (min-width: 1025px) {
    .purple-link-btn a {
        padding: 12px 24px
    }
}

@media screen and (min-width: 768px) {
    .purple-link-btn p {
        font-size: 21px
    }
}

@media screen and (min-width: 1025px) {
    .purple-link-btn-arrow_sp {
        display: none
    }
}

.purple-link-btn-arrow_sp svg {
    stroke: #fff;
    stroke-width: 4px;
    width: 14px
}

@media screen and (min-width: 768px) {
    .purple-link-btn-arrow_sp svg {
        width: 20px
    }
}

.purple-link-btn-arrow_pc {
    display: none
}

@media screen and (min-width: 1025px) {
    .purple-link-btn-arrow_pc {
        display: block
    }
}

@media screen and (min-width: 1025px) {
    .purple-link-btn-arrow_pc svg {
        width: 32px;
        position: absolute;
        top: 20%;
        right: -40px;
        stroke: #916195;
        stroke-width: 2px;
        transition: .3s
    }
}

@media screen and (min-width: 1280px) {
    .purple-link-btn-arrow_pc svg {
        width: 64px;
        right: -80px
    }
}

@media screen and (min-width: 768px) {
    .oc-bottom .purple-link-btn p {
        font-size: 16px
    }
}

@media screen and (min-width: 1025px) {
    .oc-bottom .purple-link-btn p {
        font-size: 21px
    }
}

.oc-bottom .purple-link-btn a {
    padding: 7px 16px
}

@media screen and (min-width: 1025px) {
    .oc-access .purple-link-btn {
        margin-left: 5vw
    }
}

@media screen and (min-width: 1536px) {
    .oc-access .purple-link-btn {
        margin-left: calc(8vw - 64px + 80px)
    }
}

@media screen and (min-width: 1025px) {
    .oc-report .purple-link-btn {
        margin-right: calc(8vw + 32px)
    }
}

@media screen and (min-width: 1536px) {
    .oc-report .purple-link-btn {
        margin-right: calc(8vw + 64px)
    }
}

.information-btn_list {
    margin-left: 36px
}

@media screen and (min-width: 768px) {
    .information-btn_list {
        margin-right: auto;
        max-width: 400px
    }
}

@media screen and (min-width: 1025px) {
    .information-btn_list {
        margin: 0;
        padding: 0 6vw;
        max-width: none;
        display: flex;
        align-items: flex-start;
        justify-content: center;
        gap: 1.6vw
    }
}

@media screen and (min-width: 1280px) {
    .information-btn_list {
        padding: 36px;
        gap: 0
    }
}

@media screen and (min-width: 1025px) {
    .information-btn_list li {
        transition: .3s
    }

    .information-btn_list li:hover {
        background: rgba(231, 234, 248, .5)
    }
}

@media screen and (min-width: 1025px) {
    .information-btn_list li {
        width: calc(33.3% - 1.7vw);
        width: 33.3%;
        max-width: 280px
    }
}

.information-btn_list li:not(:last-of-type) {
    margin-bottom: 10px
}

@media screen and (min-width: 1025px) {
    .information-btn_list li a {
        padding: 1vw;
        display: flex;
        flex-direction: column-reverse;
        align-items: stretch;
        justify-content: center
    }
}

.information-btn_list_ja-wrap {
    margin-bottom: 5px;
    padding: 3px 20px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: #916195
}

@media screen and (min-width: 1280px) {
    .information-btn_list_ja-wrap {
        display: block;
        padding: 3px 5px
    }
}

.information-btn_list_arrow {
    margin-top: -10px;
    width: 15px
}

@media screen and (min-width: 1025px) {
    .information-btn_list_arrow {
        display: none
    }
}

.information-btn_list_arrow svg {
    width: 100%;
    height: 100%;
    object-fit: contain
}

.information-btn_list_ja {
    color: #fff;
    font-weight: 700
}

@media screen and (min-width: 1025px) {
    .information-btn_list_ja {
        margin: 0 auto;
        width: fit-content;
        font-size: min(1.8vw, 21px)
    }
}

@media screen and (min-width: 1280px) {
    .information-btn_list_ja {
        font-size: min(1.1vw, 21px)
    }
}

.information-btn_list_en {
    color: #916195;
    font-size: 37px;
    font-family: "rig-shaded-Medium-Face", sans-serif;
    line-height: 1;
    height: 2em
}

@media screen and (min-width: 1280px) {
    .information-btn_list_en {
        font-size: 27px
    }
}

@media screen and (min-width: 1700px) {
    .information-btn_list_en {
        font-size: 37px
    }
}

@media screen and (min-width: 1025px) {
    .footer .information-btn_list {
        padding: 0;
        margin-left: -1vw;
        justify-content: flex-start
    }
}

@media screen and (min-width: 1025px) {
    .footer .information-btn_list li {
        max-width: none
    }
}

@media screen and (min-width: 1025px) {
    .footer .information-btn_list li a {
        flex-direction: column
    }
}

@media screen and (min-width: 1025px) {
    .footer .information-btn_list_ja {
        font-size: min(1.6vw, 21px);
        margin: 0;
        padding-left: .5em
    }
}

.section-title-wrap {
    margin-bottom: 40px;
    padding-left: 36px;
    padding-right: 20px;
    position: relative;
    z-index: 1
}

@media screen and (min-width: 768px) {
    .section-title-wrap {
        padding-left: 8vw
    }
}

@media screen and (min-width: 1025px) {
    .section-title-wrap {
        padding-left: 14vw;
        padding-right: 0
    }
}

#top .section-title-wrap {
    max-width: calc(668px + 14vw)
}

@media screen and (min-width: 768px) {
    .specialty .section-title-wrap {
        margin-bottom: 100px
    }
}

@media screen and (min-width: 1025px) {
    .specialty .section-title-wrap {
        margin-right: 6vw
    }
}

@media screen and (min-width: 1025px) {
    .about .section-title-wrap {
        margin-bottom: 100px;
        padding-left: 7vw
    }
}

.global .section-title-wrap {
    margin-bottom: 30px;
    z-index: 2
}

@media screen and (min-width: 1025px) {
    .global .section-title-wrap {
        padding-left: 7vw
    }
}

@media screen and (min-width: 1025px) {
    .career .section-title-wrap {
        margin-bottom: 130px;
        padding-left: 7vw
    }
}

.oc-experience .section-title-wrap {
    margin-bottom: 20px
}

@media screen and (min-width: 1025px) {
    .oc-experience .section-title-wrap {
        margin-bottom: 100px;
        padding-left: 6vw
    }
}

@media screen and (min-width: 768px) {
    .oc-program .section-title-wrap {
        margin-bottom: 0;
        z-index: 2
    }
}

@media screen and (min-width: 1025px) {
    .oc-program .section-title-wrap {
        margin-bottom: 60px
    }
}

.section-title {
    margin-bottom: 10px;
    width: fit-content;
    font-size: 23px;
    font-family: "Yu Gothic Medium", "游ゴシック Medium", YuGothic, "游ゴシック体", sans-serif;
    color: #916195;
    line-height: 1.2;
    position: relative
}

@media screen and (min-width: 375px) {
    .section-title {
        font-size: 28px
    }
}

@media screen and (min-width: 768px) {
    .section-title {
        font-size: 56px
    }
}

.section-title::before {
    content: "";
    width: 600px;
    height: 12px;
    background: url(../images/common/section-title-deco_white_sp.svg) center center/contain no-repeat;
    position: absolute;
    top: 37%;
    left: -590px
}

@media screen and (min-width: 768px) {
    .section-title::before {
        width: 2000px;
        height: 16px;
        background: url(../images/common/section-title-deco_white.svg) center center/contain no-repeat;
        top: 40%;
        left: -1820px
    }
}

.title-addition {
    font-size: 18px;
    font-weight: 700;
    font-family: "rig-shaded-Medium-Face", sans-serif
}

@media screen and (min-width: 768px) {
    .title-addition {
        font-size: 20px
    }
}

@media screen and (min-width: 1025px) {
    .title-addition {
        font-size: 24px
    }
}

#top .section-title {
    margin-bottom: 0;
    font-family: "rig-shaded-Medium-Face", sans-serif;
    font-size: 33px
}

@media screen and (min-width: 375px) {
    #top .section-title {
        font-size: 40px
    }
}

@media screen and (min-width: 768px) {
    #top .section-title {
        font-size: 70px
    }
}

#top .section-title::before {
    background: url(../images/common/section-title-deco_purple_sp.svg) center center/contain no-repeat;
    top: 26%
}

@media screen and (min-width: 768px) {
    #top .section-title::before {
        background: url(../images/common/section-title-deco_purple.svg) center center/contain no-repeat;
        top: 32%
    }
}

#top .title-addition {
    font-family: "Yu Gothic Medium", "游ゴシック Medium", YuGothic, "游ゴシック体", sans-serif
}

#top .about .title-addition span {
    font-size: 14px;
    font-weight: 400
}

.oc-experience .section-title::before,
.oc-program .section-title::before {
    background: url(../images/common/section-title-deco_purple_sp.svg) center center/contain no-repeat
}

@media screen and (min-width: 768px) {

    .oc-experience .section-title::before,
    .oc-program .section-title::before {
        background: url(../images/common/section-title-deco_purple.svg) center center/contain no-repeat
    }
}

_::-webkit-full-page-media,
_:future,
:root .title-addition {
    font-weight: 500
}

@media screen and (min-width: 1025px) {

    _::-webkit-full-page-media,
    _:future,
    :root .title-addition {
        font-weight: 700;
        font-size: 22px
    }
}

.youtube .title-addition {
    width: fit-content;
    padding: 2px 4px;
    color: #64519a;
    background: #fff
}

@media screen and (min-width: 1025px) {
    .youtube .title-addition {
        padding: 4px 7px
    }
}

.oc .title-addition {
    font-weight: 400
}

.oc .title-addition span {
    font-size: 14px;
    font-weight: 400;
    display: block;
}

@media screen and (min-width: 1025px) {
    .oc .title-addition {
        font-size: clamp(24px, 2.3vw, 44px)
    }
}

.fixed-notice {
    padding: 35px;
    width: 80%;
    background: #fff;
    border: 4px solid rgba(145, 97, 149, .7);
    border-radius: 14px;
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 5;
    transition: .5s
}

@media screen and (min-width: 768px) {
    .fixed-notice {
        width: 60%
    }
}

@media screen and (min-width: 1280px) {
    .fixed-notice {
        padding: 1.5% 3%;
        width: 70%;
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 40px;
        top: auto;
        bottom: -50%;
        animation: fixed-notice_anime_pc 1.5s 2s ease-in-out forwards
    }
}

.fixed-notice_title {
    margin-bottom: 25px;
    text-align: center;
    font-size: clamp(25px, 7vw, 30px);
    font-weight: 700;
    color: #916195
}

@media screen and (min-width: 1280px) {
    .fixed-notice_title {
        margin-bottom: 0;
        width: 260px;
        font-size: clamp(25px, 1.8vw, 36px)
    }
}

.fixed-notice_date {
    margin-bottom: 10px;
    font-size: 18px;
    font-weight: 700;
    color: #916195
}

@media screen and (min-width: 1280px) {
    .fixed-notice_date {
        font-size: clamp(18px, 1.1vw, 21px)
    }
}

.fixed-notice_txt-wrap {
    margin-bottom: 30px
}

@media screen and (min-width: 1280px) {
    .fixed-notice_txt-wrap {
        margin-bottom: 0;
        width: calc(100% - 590px);
        position: relative
    }

    .fixed-notice_txt-wrap::after {
        content: "";
        display: block;
        width: 1px;
        height: 100%;
        background: #7c7c7c;
        position: absolute;
        top: 50%;
        left: -40px;
        transform: translateY(-50%)
    }
}

@media screen and (min-width: 1280px) {
    .fixed-notice_txt {
        font-size: clamp(16px, 1vw, 18px)
    }
}

.fixed-notice_btn {
    font-size: clamp(16px, 4vw, 18px);
    font-weight: 700
}

.fixed-notice_btn-wrap {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 15px
}

@media screen and (min-width: 1280px) {
    .fixed-notice_btn-wrap {
        display: block
    }
}

@media screen and (min-width: 1280px) {
    .fixed-notice_btn:first-of-type {
        margin-bottom: 20px
    }
}

.fixed-notice_btn a {
    width: 28vw;
    max-width: 120px;
    height: 44px;
    color: #fff;
    background: #916195;
    border-radius: 9px;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: .3s
}

@media screen and (min-width: 1025px) {
    .fixed-notice_btn a:hover {
        background: rgba(145, 97, 149, .8)
    }
}

@media screen and (min-width: 1280px) {
    .fixed-notice_btn a {
        width: 180px;
        height: 44px
    }
}

.fixed-notice_btn_close {
    width: 28vw;
    max-width: 120px;
    height: 44px;
    color: #000;
    background: #dbdbdb;
    border-radius: 9px;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: .3s
}

@media screen and (min-width: 1025px) {
    .fixed-notice_btn_close {
        cursor: pointer
    }

    .fixed-notice_btn_close:hover {
        background: #c3c3c3
    }
}

@media screen and (min-width: 1280px) {
    .fixed-notice_btn_close {
        width: 180px;
        height: 44px
    }
}

_::-webkit-full-page-media,
_:future,
:root .fixed-notice_btn {
    font-weight: 400
}

.open-campus_sub-title {
    margin-bottom: 30px;
    padding: 0 10px;
    width: fit-content;
    font-size: 17px;
    font-weight: 700;
    color: #64519a
}

@media screen and (min-width: 375px) {
    .open-campus_sub-title {
        font-size: 21px
    }
}

@media screen and (min-width: 1025px) {
    .open-campus_sub-title {
        margin-bottom: 50px;
        margin-left: 3vw;
        font-size: 42px
    }
}

.open-campus_sub-title_exclamation {
    display: none
}

@media screen and (min-width: 1025px) {
    .open-campus_sub-title_exclamation {
        display: inline-block
    }
}

.open-campus_sub-title_num {
    padding: 0 5px;
    color: #916195;
    font-size: 36px;
    font-weight: 700;
    vertical-align: -5px
}

@media screen and (min-width: 768px) {
    .open-campus_sub-title_num {
        font-size: 56px
    }
}

@media screen and (min-width: 1025px) {
    .open-campus_sub-title_num {
        font-size: 76px
    }
}

@media screen and (min-width: 768px) {
    .oc .open-campus_sub-title {
        font-size: 32px
    }
}

@media screen and (min-width: 1025px) {
    .oc .open-campus_sub-title {
        font-size: 44px;
        position: relative
    }

    .oc .open-campus_sub-title::before,
    .oc .open-campus_sub-title::after {
        content: "";
        display: block;
        width: 60px;
        height: 60px;
        position: absolute;
        top: 30%
    }

    .oc .open-campus_sub-title::before {
        background: url(../images/icon/oc-title-line_l.svg) center center/contain no-repeat;
        left: -70px
    }

    .oc .open-campus_sub-title::after {
        background: url(../images/icon/oc-title-line_r.svg) center center/contain no-repeat;
        right: -70px
    }
}

.oc-end {
    background: rgba(17, 12, 31, .6);
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    top: 0;
    left: 0
}

.oc-end p {
    padding: 5px 10px;
    font-family: "Roboto", sans-serif;
    font-weight: 700;
    color: #fff;
    background: rgba(17, 12, 31, .6)
}

.oc-end_txt {
    padding: 14px;
    background: #fff;
    box-shadow: 6px 6px 0 rgba(0, 0, 0, .07);
    position: relative;
    z-index: 1
}

@media screen and (min-width: 768px) {
    .oc-end_txt {
        text-align: center
    }
}

@media screen and (min-width: 1025px) {
    .oc-end_txt {
        box-shadow: 12px 12px 0 rgba(0, 0, 0, .07)
    }
}

.oc .oc-end p {
    font-size: 36px
}

@media screen and (min-width: 1025px) {
    .oc .oc-end p {
        font-size: 44px
    }
}

.open-campus_list .oc-end p {
    font-size: 36px
}

@media screen and (min-width: 1025px) {
    .open-campus_list .oc-end p {
        font-size: 44px
    }
}

.open-day_schedule_list .oc-end {
    border-radius: 8px
}

.open-day_schedule_list .oc-end p {
    font-size: 21px
}

@media screen and (min-width: 1025px) {
    .open-day_schedule_list .oc-end p {
        font-size: 28px
    }
}

.other-events_list .oc-end p {
    font-size: 21px
}

@media screen and (min-width: 1025px) {
    .other-events_list .oc-end p {
        font-size: 28px
    }
}

.oc-yet {
    margin: -10px;
    padding: 14px 14px 20px;
    background: #efefef
}

@media screen and (min-width: 1025px) {
    .oc-yet {
        margin: 0 -5vw -3.6vw;
        padding: 20px
    }
}

.oc-yet p {
    margin-bottom: 20px
}

@media screen and (min-width: 768px) {
    .oc-yet p {
        text-align: center
    }
}

@media screen and (min-width: 1025px) {
    .oc-yet p {
        margin-bottom: 10px;
        font-size: clamp(16px, 11vw, 21px)
    }
}

.stars {
    position: absolute;
    display: block;
    background-color: #fff;
    border-radius: 50%;
    box-shadow: 0 0 4px 2px rgba(255, 255, 255, .2);
    opacity: 0;
    animation: twinkle-stars 5s infinite
}

#top .stars {
    background-color: #c8cdd1;
    box-shadow: 0 0 4px 2px rgba(200, 205, 209, .2)
}

@media screen and (min-width: 1025px) {
    #top .stars {
        background-color: #fff;
        box-shadow: 0 0 4px 2px rgba(255, 255, 255, .2);
        position: fixed
    }
}