@charset 'UTF-8';
/* ==========================================================================
   toppage
========================================================================== */
/* p-instance
----------------------------------------------------------------- */
.p-instance__tab
{
    width: 19.2%;
}
@media screen and (max-width: 1024px)
{
    .p-instance__tab
    {
        width: 32.6666%;
    }
}
@media screen and (max-width: 767px)
{
    .p-instance__tab
    {
        width: 49.5%;
    }
}
.p-instance__list
{
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;

    margin-bottom: clamp(30px, 30px + .0892857143 * (100vw - 600px), 45px);

    -ms-flex-wrap: wrap;

        flex-wrap: wrap;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    grid-gap: clamp(36px, 36px + .0535714286 * (100vw - 600px), 45px) 6.0005%;
}
.p-instance__list__box
{
    width: 29.333%;
}
@media screen and (max-width: 1024px)
{
    .p-instance__list__box
    {
        width: 46.99975%;
    }
}
@media screen and (max-width: 767px)
{
    .p-instance__list__box
    {
        width: 100%;
    }
}
.p-instance__list__box__link
{
    display: block;

    width: 100%;
    height: 100%;
}
.p-instance__list__box__image
{
    margin-bottom: 30px;

    aspect-ratio: 4/3;
}
@media screen and (max-width: 1479px) and (min-width: 1280px)
{
    .p-instance__list__box__image
    {
        margin-bottom: 1.5697674419vw;
    }
}
@media screen and (max-width: 1279px) and (min-width: 1024px)
{
    .p-instance__list__box__image
    {
        margin-bottom: 1.6216216216vw;
    }
}
@media screen and (max-width: 1023px) and (min-width: 768px)
{
    .p-instance__list__box__image
    {
        margin-bottom: 3.22265625vw;
    }
}
@media screen and (max-width: 767px)
{
    .p-instance__list__box__image
    {
        margin-bottom: 4.296875vw;
    }
}
@media screen and (max-width: 600px)
{
    .p-instance__list__box__image
    {
        margin-bottom: 50px;
    }
}
@media screen and (max-width: 600px) and (max-width: 1479px) and (min-width: 1280px)
{
    .p-instance__list__box__image
    {
        margin-bottom: 2.6162790698vw;
    }
}
@media screen and (max-width: 600px) and (max-width: 1279px) and (min-width: 1024px)
{
    .p-instance__list__box__image
    {
        margin-bottom: 2.7027027027vw;
    }
}
@media screen and (max-width: 600px) and (max-width: 1023px) and (min-width: 768px)
{
    .p-instance__list__box__image
    {
        margin-bottom: 5.37109375vw;
    }
}
@media screen and (max-width: 600px) and (max-width: 767px)
{
    .p-instance__list__box__image
    {
        margin-bottom: 7.1614583333vw;
    }
}
.p-instance__list__box__image__inner
{
    position: relative;
    z-index: 1;

    display: block;

    width: 100%;
    height: 100%;
}
.p-instance__list__box__image__inner::after
{
    position: absolute;
    z-index: -1;
    top: clamp(17px, 17px + .0178571429 * (100vw - 600px), 20px);
    left: clamp(17px, 17px + .0178571429 * (100vw - 600px), 20px);

    display: inline-block;

    width: 102.2727%;
    height: 100%;

    content: '';

    opacity: .06;
    background-color: #060b96;
}
.p-instance__list__box__text
{
    font-size: clamp(17px, 17px + .0178571429 * (100vw - 600px), 20px);
    font-weight: 400;
}
.p-instance .c-button
{
    max-width: 540px;
    margin: 0 auto;
}
.p-instance .c-button__link
{
    padding: clamp(10px, 10px + .0357142857 * (100vw - 600px), 16px) 10px;
}

.p-instanceDetail__titleArea__category
{
    font-size: clamp(22px, 22px + .0238095238 * (100vw - 600px), 26px);
    font-weight: 400;

    display: -webkit-box;

    display: -ms-flexbox;

    display: flex;

    color: #060b96;

    -webkit-box-align: center;

        -ms-flex-align: center;

            align-items: center;
    -webkit-box-pack: start;
        -ms-flex-pack: start;
            justify-content: flex-start;
    grid-gap: clamp(8px, 8px + .0119047619 * (100vw - 600px), 10px);
}
.p-instanceDetail__titleArea__category::before,
.p-instanceDetail__titleArea__category::after
{
    font-size: clamp(18px, 18px + .0119047619 * (100vw - 600px), 20px);
    font-weight: 400;
    line-height: 1;

    display: inline-block;

    content: '／';
}
.p-instanceDetail__titleArea__title
{
    font-size: clamp(32px, 32px + .0178571429 * (100vw - 1024px), 48px);
    font-weight: 500;
    line-height: 1.25;

    margin-bottom: clamp(20px, 20px + .0297619048 * (100vw - 600px), 25px);

    color: #060b96;
}
@media screen and (max-width: 1024px)
{
    .p-instanceDetail__titleArea__title
    {
        font-size: clamp(28px, 28px + .0833333333 * (100vw - 600px), 42px);
    }
}
.p-instanceDetail__movieArea
{
    position: relative;
    z-index: 1;
}
.p-instanceDetail__movieArea::after
{
    position: absolute;
    z-index: -1;
    bottom: 0;
    left: 0;

    display: inline-block;

    width: 100%;
    height: calc(100% - min(90vw, 1000px) / 16 * 9 / 2);

    content: '';

    opacity: .06;
    background-color: #060b96;
}
.p-instanceDetail__movieArea__movie
{
    position: relative;
    z-index: 1;

    overflow: hidden;

    width: 100%;
    max-width: 1000px;
    margin: 0 auto;

    cursor: pointer;

    aspect-ratio: 16/9;
}
.p-instanceDetail__movieArea__movie::before
{
    position: absolute;
    z-index: 1;
    top: 50%;
    left: 50%;

    display: inline-block;

    width: 100px;

    content: '';
    -webkit-transform: translate(-50%, -50%);
            transform: translate(-50%, -50%);

    background: url(../image/common/icon_movie.svg) center/100% no-repeat;

    aspect-ratio: 1/1;
}
@media screen and (max-width: 1024px)
{
    .p-instanceDetail__movieArea__movie::before
    {
        width: clamp(40px, 40px + .1607142857 * (100vw - 600px), 67px);
    }
}
.p-instanceDetail__movieArea__text
{
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;

    max-width: 1000px;
    margin: .5em auto 0;

    grid-gap: .5rem;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
}
.p-instanceDetail__movieArea__text::before
{
    display: inline-block;

    width: clamp(17px, 17px + .0033482143 * (100vw - 1024px), 20px);

    content: '';

    border-radius: 100%;
    background-color: #060b96;

    aspect-ratio: 1/1;
}
.p-instanceDetail__movieArea__text .txt
{
    font-size: clamp(17px, 17px + .0033482143 * (100vw - 1024px), 20px);
    font-weight: 300;
}
@media screen and (max-width: 1024px)
{
    .p-instanceDetail__movieArea__text .txt
    {
        font-size: clamp(17px, 17px + .0178571429 * (100vw - 600px), 20px);
    }
}
.p-instanceDetail__box
{
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;

    -ms-flex-wrap: wrap;

        flex-wrap: wrap;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
    grid-gap: clamp(40px, 40px + .0595238095 * (100vw - 600px), 50px) 0;
}
@media screen and (min-width: 1025px)
{
    .p-instanceDetail__box:nth-of-type(odd)
    {
        -webkit-box-orient: horizontal;
        -webkit-box-direction: reverse;
            -ms-flex-direction: row-reverse;
                flex-direction: row-reverse;
    }
    .p-instanceDetail__box:nth-of-type(odd) .p-instanceDetail__box__image__inner::after
    {
        left: calc(clamp(17px, 17px + .0178571429 * (100vw - 600px), 20px) * -1);
    }
    .p-instanceDetail__box:nth-of-type(odd) .p-instanceDetail__box__textArea__title__text::after
    {
        left: -10%;
    }
    .p-instanceDetail__box:nth-of-type(even) .p-instanceDetail__box__textArea__title__text::after
    {
        right: -10%;
    }
}
.p-instanceDetail__box__textArea
{
    width: 46%;
}
@media screen and (max-width: 1024px)
{
    .p-instanceDetail__box__textArea
    {
        width: 100%;

        -webkit-box-ordinal-group: 3;

            -ms-flex-order: 2;

                order: 2;
    }
}
.p-instanceDetail__box__textArea__title
{
    margin-bottom: clamp(17px, 17px + .0178571429 * (100vw - 600px), 20px);
}
.p-instanceDetail__box__textArea__title__en
{
    font-size: clamp(22px, 22px + .0238095238 * (100vw - 600px), 26px);
    font-weight: 400;

    display: -webkit-box;

    display: -ms-flexbox;

    display: flex;

    color: #060b96;

    -webkit-box-align: center;

        -ms-flex-align: center;

            align-items: center;
    -webkit-box-pack: start;
        -ms-flex-pack: start;
            justify-content: flex-start;
    grid-gap: clamp(8px, 8px + .0119047619 * (100vw - 600px), 10px);
}
.p-instanceDetail__box__textArea__title__en::before,
.p-instanceDetail__box__textArea__title__en::after
{
    font-size: clamp(18px, 18px + .0119047619 * (100vw - 600px), 20px);
    font-weight: 400;
    line-height: 1;

    display: inline-block;

    content: '／';
}
.p-instanceDetail__box__textArea__title__text
{
    font-size: clamp(24px, 24px + .0100446429 * (100vw - 1024px), 33px);
    font-weight: 500;

    position: relative;
    z-index: 1;

    padding: .5em 0;

    color: #060b96;
}
@media screen and (max-width: 1024px)
{
    .p-instanceDetail__box__textArea__title__text
    {
        font-size: clamp(24px, 24px + .0535714286 * (100vw - 600px), 33px);
    }
}
.p-instanceDetail__box__textArea__title__text::after
{
    position: absolute;
    top: 0;

    display: inline-block;

    width: 100vw;
    height: 100%;

    content: '';

    opacity: .06;
    background-color: #060b96;
}
@media screen and (max-width: 1024px)
{
    .p-instanceDetail__box__textArea__title__text::after
    {
        left: 50%;

        width: 110vw;

        -webkit-transform: translateX(-50%);

                transform: translateX(-50%);
    }
}
.p-instanceDetail__box__catch
{
    font-size: clamp(22px, 22px + .0055803571 * (100vw - 1024px), 27px);
    font-weight: 500;

    display: -webkit-box;

    display: -ms-flexbox;

    display: flex;

    margin-bottom: clamp(17px, 17px + .0178571429 * (100vw - 600px), 20px);

    color: #060b96;

    -webkit-box-align: baseline;

        -ms-flex-align: baseline;

            align-items: baseline;
    grid-gap: 6px;
}
.p-instanceDetail__box__catch::before
{
    display: inline-block;

    width: 6px;
    height: clamp(22px, 22px + .0055803571 * (100vw - 1024px), 27px);

    content: '';
    -webkit-transform: translateY(2px);
            transform: translateY(2px);

    background-color: #060b96;
}
@media screen and (max-width: 1024px)
{
    .p-instanceDetail__box__catch
    {
        font-size: clamp(21px, 21px + .0357142857 * (100vw - 600px), 27px);
    }
}
.p-instanceDetail__box__text
{
    font-size: clamp(15px, 15px + .0022321429 * (100vw - 1024px), 17px);
}
@media screen and (max-width: 1024px)
{
    .p-instanceDetail__box__text
    {
        font-size: 17px;
    }
}
.p-instanceDetail__box__image
{
    width: 50%;

    aspect-ratio: 4/3;
}
@media screen and (max-width: 1024px)
{
    .p-instanceDetail__box__image
    {
        width: 100%;

        -webkit-box-ordinal-group: 2;

            -ms-flex-order: 1;

                order: 1;
    }
}
.p-instanceDetail__box__image__inner
{
    position: relative;
    z-index: 1;

    display: block;

    width: 100%;
    height: 100%;
}
.p-instanceDetail__box__image__inner::after
{
    position: absolute;
    z-index: -1;
    top: clamp(17px, 17px + .0178571429 * (100vw - 600px), 20px);
    left: clamp(17px, 17px + .0178571429 * (100vw - 600px), 20px);

    display: inline-block;

    width: 100%;
    height: 100%;

    content: '';

    opacity: .06;
    background-color: #060b96;
}