@import url('https://fonts.googleapis.com/css?family=Montserrat:300');

@charset 'UTF-8';
.m-box-mv
{
    position: relative;

    width: 100%;
    margin: 0 auto;
    margin-bottom: 60px;

    background: #000;
}
@media screen and (min-width: 0) and (max-width: 568px)
{
    .m-box-mv
    {
        margin-bottom: 30px;
    }
}
.m-box-mv .mv-inner
{
    position: relative;

    width: 100%;
    padding-top: 48%;
}
@media screen and (min-width: 0) and (max-width: 568px)
{
    .m-box-mv .mv-inner
    {
        padding-top: 53.125%;
    }
}
.m-box-mv .mv-inner .mv-bg
{
    position: absolute;
    top: 0;
    left: 0;

    width: 100%;
    height: 100%;

    background-repeat: no-repeat; 
    background-position: center;
    background-size: cover;
}
.m-box-mv .mv-inner .mv-awards
{
    position: absolute;
    right: 20px;
    bottom: 100px;
}
@media screen and (min-width: 0) and (max-width: 568px)
{
    .m-box-mv .mv-inner .mv-awards
    {
        right: 10px;
        bottom: 10px;
    }
    .m-box-mv .mv-inner .mv-awards img
    {
        width: 31px;
    }
}
.m-box-mv .m-btn-video
{
    position: absolute;
    z-index: 1;
    bottom: -80px;
    left: 50%;

    height: 160px;

    -webkit-transition: all .5s ease .7s;
            transition: all .5s ease .7s; 
    -webkit-transform: translateX(-50%);
        -ms-transform: translateX(-50%);
            transform: translateX(-50%);
}
@media screen and (min-width: 0) and (max-width: 568px)
{
    .m-box-mv .m-btn-video
    {
        bottom: -60px; 

        height: 60px;
    }
}
.m-box-mv .m-btn-video.is-ready
{
    bottom: 0;

    height: 0;

    -webkit-transition: all 0s ease;
            transition: all 0s ease;
}
.m-box-mv .m-btn-video.is-hidden
{
    bottom: 0;

    height: 0;

    -webkit-transition: all .8s ease;
            transition: all .8s ease;
}
@media screen and (min-width: 0) and (max-width: 568px)
{
    .m-box-mv.mv-video
    {
        margin-bottom: 90px;
    }
}

.m-box-border
{
    -webkit-box-sizing: border-box;
            box-sizing: border-box; 
    margin-top: 80px;
    padding: 35px;

    border: 1px solid #a0a0a0;
}
@media screen and (min-width: 0) and (max-width: 568px)
{
    .m-box-border
    {
        margin-top: 40px; 
        padding: 20px 15px;
    }
}
.m-box-border .border-ttl
{
    font-size: 24px;
    font-size: 2.4rem; 
    line-height: 1;

    margin-bottom: 10px;
}
@media screen and (min-width: 0) and (max-width: 568px)
{
    .m-box-border .border-ttl
    {
        font-size: 1.8rem;
    }
}
@media screen and (min-width: 0) and (max-width: 568px)
{
    .m-box-border .border-desc
    {
        font-size: 1.4rem;
    }
}

.m-box-conv
{
    position: fixed;
    z-index: 999;
    top: 240px;
    right: 0;

    -webkit-transition: right .8s cubic-bezier(.47, .12, .11, .99) .7s;
            transition: right .8s cubic-bezier(.47, .12, .11, .99) .7s;
}
@media screen and (min-width: 0) and (max-width: 568px)
{
    .m-box-conv
    {
        top: auto;
        bottom: 0;

        -webkit-transition: bottom .8s cubic-bezier(.47, .12, .11, .99) .7s;
                transition: bottom .8s cubic-bezier(.47, .12, .11, .99) .7s;
    }
}
.m-box-conv.is-ready
{
    right: -120px;

    -webkit-transition: right 0s ease;
            transition: right 0s ease;
}
@media screen and (min-width: 0) and (max-width: 568px)
{
    .m-box-conv.is-ready
    {
        right: 0;
        bottom: -50px;

        -webkit-transition: bottom 0s ease;
                transition: bottom 0s ease;
    }
}
.m-box-conv.is-hidden
{
    right: -120px;

    -webkit-transition: right .8s cubic-bezier(.47, .12, .11, .99);
            transition: right .8s cubic-bezier(.47, .12, .11, .99);
}
@media screen and (min-width: 0) and (max-width: 568px)
{
    .m-box-conv.is-hidden
    {
        right: 0;
        bottom: -50px;

        -webkit-transition: bottom .8s cubic-bezier(.47, .12, .11, .99);
                transition: bottom .8s cubic-bezier(.47, .12, .11, .99);
    }
}
@media screen and (min-width: 0) and (max-width: 568px)
{
    .m-box-conv
    {
        top: auto;
        bottom: 0;

        width: 100%;
    }
}
.m-box-conv .conv-head
{
    font-size: 14px;
    font-size: 1.4rem;

    position: relative;

    display: block;

    width: 120px;

    cursor: pointer;
    -webkit-transition: all .3s ease;
            transition: all .3s ease; 
    text-align: center;
    letter-spacing: .05em;

    color: #fff;
    background: #626262;
}
@media screen and (min-width: 0) and (max-width: 568px)
{
    .m-box-conv .conv-head
    {
        display: none;
    }
}
.m-box-conv .conv-head .head-txt
{
    line-height: 1; 

    display: block;

    padding: 16px 0;
}
.m-box-conv .conv-head .head-txt .head-icon
{
    position: relative;

    display: inline-block;

    width: 17px;
    height: 17px;
    margin-top: -1px;
    margin-left: 10px;

    vertical-align: middle;

    border: 1px solid #fff;
    border-radius: 50%;
}
.m-box-conv .conv-head .head-txt .head-icon:before
{
    position: absolute;
    top: 50%;
    left: 50%;

    width: 7px;
    height: 1px;

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

    background: #fff;
}
.m-box-conv .conv-head .head-txt .head-icon:after
{
    position: absolute;
    top: 50%;
    left: 50%;

    width: 1px;
    height: 7px;

    content: '';
    -webkit-transition: all .3s ease;
            transition: all .3s ease; 
    -webkit-transform: translate(-50%, -50%) rotate(90deg);
        -ms-transform: translate(-50%, -50%) rotate(90deg);
            transform: translate(-50%, -50%) rotate(90deg);

    background: #fff;
}
.m-box-conv .conv-head:hover
{
    background: #444;
}
.m-box-conv .conv-head.is-active .head-icon:after
{
    -webkit-transform: translate(-50%, -50%) rotate(0deg);
        -ms-transform: translate(-50%, -50%) rotate(0deg);
            transform: translate(-50%, -50%) rotate(0deg);
}
.m-box-conv .conv-list
{
    width: 120px;
}
@media screen and (min-width: 0) and (max-width: 568px)
{
    .m-box-conv .conv-list
    {
        width: auto; 

        *zoom: 1;
    }
    .m-box-conv .conv-list:after
    {
        display: table;
        clear: both; 

        content: ' ';
    }
}
.m-box-conv .conv-list > li
{
    margin-top: 2px;
}
@media screen and (min-width: 0) and (max-width: 568px)
{
    .m-box-conv .conv-list > li
    {
        float: left; 

        width: 50%;
    }
    .m-box-conv .conv-list > li:first-child
    {
        border-right: 1px solid #fff;
    }
}
.m-box-conv .conv-list > li a
{
    font-size: 14px;
    font-size: 1.4rem;
    line-height: 1.5;

    position: relative;

    display: block;

    width: 120px;
    padding: 12px 0;

    cursor: pointer; 
    text-align: center;
    letter-spacing: .05em;

    color: #fff;
    background: #626262;
}
@media screen and (min-width: 0) and (max-width: 568px)
{
    .m-box-conv .conv-list > li a
    {
        font-size: 1.1rem; 
        line-height: 1.2;

        width: auto;
        height: 50px;
        padding: 8px 0;
    }
}
.m-box-conv .conv-list > li a span
{
    display: block;
}
@media screen and (min-width: 0) and (max-width: 568px)
{
    .m-box-conv .conv-list > li a span.list-ttl
    {
        line-height: 1;

        position: absolute;
        top: 50%;
        left: 50%;

        width: 100%;

        -webkit-transform: translate(-50%, -50%);
            -ms-transform: translate(-50%, -50%);
                transform: translate(-50%, -50%);
    }
}
.m-box-conv .conv-list > li a span.list-btn
{
    font-size: 12px;
    font-size: 1.2rem;
    line-height: 1;

    position: relative;
    z-index: 1;

    width: 80px;
    margin: 0 auto;
    margin-top: 10px;
    padding: 7px 0 7px 10px;

    -webkit-transition: all .3s ease;
            transition: all .3s ease; 
    text-align: left;

    border: 1px solid #fff;
}
@media screen and (min-width: 0) and (max-width: 568px)
{
    .m-box-conv .conv-list > li a span.list-btn
    {
        font-size: 1.0rem;

        width: 100%;
        margin-top: 5px;
        padding: 5px 0 5px 10px;

        text-indent: -999px; 

        border: none;
    }
}
.m-box-conv .conv-list > li a span.list-btn:before
{
    position: absolute;
    z-index: -1;
    top: 0;
    left: 0;

    width: 0;
    height: 100%;

    content: '';
    -webkit-transition: all .4s cubic-bezier(.47, .12, .11, .99);
            transition: all .4s cubic-bezier(.47, .12, .11, .99); 

    background: #fff;
}
.m-box-conv .conv-list > li a span.list-btn:after
{
    position: absolute;
    z-index: 1; 
    top: 50%;
    right: 10px;

    width: 5px;
    height: 5px;

    content: '';
    -webkit-transition: all .3s ease;
            transition: all .3s ease;
    -webkit-transform: translateY(-50%) rotate(45deg);
        -ms-transform: translateY(-50%) rotate(45deg);
            transform: translateY(-50%) rotate(45deg);

    border-top: 2px solid #fff;
    border-right: 2px solid #fff;
}
@media screen and (min-width: 0) and (max-width: 568px)
{
    .m-box-conv .conv-list > li a span.list-btn:after
    {
        right: 15px;

        margin-top: 2px;
    }
}
.m-box-conv .conv-list > li a:hover
{
    text-decoration: none;
}
@media screen and (min-width: 1024px)
{
    .m-box-conv .conv-list > li a:hover > span.list-btn
    {
        color: #292929;
    }
    .m-box-conv .conv-list > li a:hover > span.list-btn:before
    {
        width: 100%;
    }
    .m-box-conv .conv-list > li a:hover > span.list-btn:after
    {
        border-color: #262626;
    }
}
@media screen and (min-width: 0) and (max-width: 568px)
{
    .m-box-conv .conv-list.list-col1 > li
    {
        width: 100%;

        border-right: none;
    }
}

/*
	module:　m-table-common
	- テーブルの基本スタイル
-----------------------------------------------------------------*/
.m-table-common
{
    width: 100%;

    vertical-align: middle;
}
.m-table-common caption
{
    font-weight: bold;

    padding-bottom: 5px;
}
.m-table-common thead th
{
    font-size: fz(14, 16);
    font-weight: bold;
    line-height: 1.4;

    padding: 10px;

    text-align: center;
    vertical-align: middle; 

    border: 1px solid #ccc;
    background: #ffc99d;
}
.m-table-common thead th:first-child
{
    background: #eebc93;
}
.m-table-common tbody th,
.m-table-common tbody td
{
    line-height: 1.4; 

    padding: 10px;

    vertical-align: middle;

    border: 1px solid #ccc;
}
.m-table-common tbody th
{
    font-size: fz(14, 16);
    font-weight: bold;

    width: 20%;

    text-align: left;
    vertical-align: middle; 

    background: #eee;
}
.m-table-common tbody td
{
    vertical-align: middle;
}

.m-txt-ttl
{
    position: absolute;
    top: 45%;
    left: 50%;

    margin-left: -512px;

    -webkit-transform: translateY(-50%);
        -ms-transform: translateY(-50%);
            transform: translateY(-50%);

    color: #fff;
    text-shadow: 0 0 8px #000;
}
@media screen and (min-width: 0) and (max-width: 568px)
{
    .m-txt-ttl
    {
        top: 55%;
        left: 20px;

        margin-left: 0;
    }
}
.m-txt-ttl .ttl-main
{
    font-size: 44px;
    font-size: 4.4rem; 
    line-height: 1.8;

    overflow: hidden;
}
@media screen and (min-width: 0) and (max-width: 568px)
{
    .m-txt-ttl .ttl-main
    {
        font-size: 2.8rem; 
        line-height: 1.5;
    }
}
.m-txt-ttl .ttl-main span
{
    display: block;

    -webkit-transition: -webkit-transform 1s cubic-bezier(.47, .12, .11, .99) .4s;
            transition: -webkit-transform 1s cubic-bezier(.47, .12, .11, .99) .4s;
            transition:         transform 1s cubic-bezier(.47, .12, .11, .99) .4s;
            transition:         transform 1s cubic-bezier(.47, .12, .11, .99) .4s, -webkit-transform 1s cubic-bezier(.47, .12, .11, .99) .4s; 
    -webkit-transform: translate3d(0, 0, 0);
            transform: translate3d(0, 0, 0);
}
.m-txt-ttl .ttl-main span img
{
    display: inline-block;

    width: auto;
    height: 71.5px;
    margin-left: -13px;

    -webkit-backface-visibility: hidden;
            backface-visibility: hidden;
}
@media screen and (min-width: 0) and (max-width: 568px)
{
    .m-txt-ttl .ttl-main span img
    {
        height: 35.5px;
        margin-left: -5px;
    }
}
.m-txt-ttl .ttl-main span img.main-line2
{
    height: 152.5px;
}
@media screen and (min-width: 0) and (max-width: 568px)
{
    .m-txt-ttl .ttl-main span img.main-line2
    {
        height: 76px;
    }
}
.m-txt-ttl .ttl-sub
{
    font-size: 30px;
    font-size: 3.0rem;
    line-height: 1.5;

    overflow: hidden;

    margin-top: 15px;
}
@media screen and (min-width: 0) and (max-width: 568px)
{
    .m-txt-ttl .ttl-sub
    {
        font-size: 1.4rem; 

        margin-top: 5px;
    }
}
.m-txt-ttl .ttl-sub span
{
    display: block;

    -webkit-transition: -webkit-transform 1s cubic-bezier(.47, .12, .11, .99) .5s;
            transition: -webkit-transform 1s cubic-bezier(.47, .12, .11, .99) .5s;
            transition:         transform 1s cubic-bezier(.47, .12, .11, .99) .5s;
            transition:         transform 1s cubic-bezier(.47, .12, .11, .99) .5s, -webkit-transform 1s cubic-bezier(.47, .12, .11, .99) .5s; 
    -webkit-transform: translate3d(0, 0, 0);
            transform: translate3d(0, 0, 0);
}
.m-txt-ttl.is-ready .ttl-main span,
.m-txt-ttl.is-ready .ttl-sub span
{
    -webkit-transition: -webkit-transform 0s linear 0s;
            transition: -webkit-transform 0s linear 0s;
            transition:         transform 0s linear 0s;
            transition:         transform 0s linear 0s, -webkit-transform 0s linear 0s; 
    -webkit-transform: translate3d(0, 100%, 0);
            transform: translate3d(0, 100%, 0);
}
.m-txt-ttl.is-hidden .ttl-main span,
.m-txt-ttl.is-hidden .ttl-sub span
{
    -webkit-transition: -webkit-transform 1s ease 0s;
            transition: -webkit-transform 1s ease 0s;
            transition:         transform 1s ease 0s;
            transition:         transform 1s ease 0s, -webkit-transform 1s ease 0s; 
    -webkit-transform: translate3d(0, 100%, 0);
            transform: translate3d(0, 100%, 0);
}

.m-txt-ttl4
{
    font-size: 18px;
    font-size: 1.8rem;
    font-weight: bold; 

    margin-top: 60px;
}
@media screen and (min-width: 0) and (max-width: 568px)
{
    .m-txt-ttl4
    {
        font-size: 1.4rem;

        margin-top: 30px;
    }
}

.m-btn-video
{
    overflow: hidden;

    width: 1024px;
    height: auto;
    margin: 0 auto;
}
@media screen and (min-width: 0) and (max-width: 568px)
{
    .m-btn-video
    {
        width: 100%;
    }
}
.m-btn-video a
{
    font-size: 24px;
    font-size: 2.4rem;
    font-weight: bold;
    line-height: 30px;

    position: relative;

    display: block;

    padding: 65px 15px;

    cursor: pointer; 
    -webkit-transition: all .5s ease;
            transition: all .5s ease;
    text-align: center;
    letter-spacing: .05em;

    color: #fff;
    background: rgba(98, 98, 98, .75);
}
@media screen and (min-width: 0) and (max-width: 568px)
{
    .m-btn-video a
    {
        font-size: 1.6rem;
        line-height: 20px;

        padding: 20px;

        background: #626262;
    }
}
.m-btn-video a:before
{
    position: absolute;
    top: 5px;
    left: 5px;

    width: calc(100% - 10px);
    height: calc(100% - 10px);

    content: '';
    -webkit-transition: all .4s cubic-bezier(.47, .12, .11, .99);
            transition: all .4s cubic-bezier(.47, .12, .11, .99); 

    background: #626262;
}
@media screen and (min-width: 0) and (max-width: 568px)
{
    .m-btn-video a:before
    {
        display: none;
    }
}
.m-btn-video a span
{
    position: relative;

    display: inline-block;
}
.m-btn-video a span:after
{
    display: inline-block;

    width: 40px;
    height: 40px;
    margin-top: -6px;
    margin-left: 20px;

    content: '';
    vertical-align: top;

    background: url('../../images/i_play.svg') no-repeat;
    background-size: auto 100%;
}
@media screen and (min-width: 0) and (max-width: 568px)
{
    .m-btn-video a span:after
    {
        width: 20px;
        height: 20px;
        margin-top: 0;
        margin-left: 10px;

        background-size: 100% auto;
    }
}
.m-btn-video a:hover
{
    text-decoration: none;
}
@media screen and (min-width: 1024px)
{
    .m-btn-video a:hover:before
    {
        top: 20px;
        left: 20px;

        width: calc(100% - 40px);
        height: calc(100% - 40px);
    }
}

.m-btn-common
{
    margin-top: 35px;

    text-align: center;
}
.m-btn-common a
{
    font-size: 14px;
    font-size: 1.4rem;
    font-weight: bold;
    line-height: 1;

    position: relative;
    z-index: 1; 

    display: inline-block;

    padding: 12px 67px 12px 14px;

    letter-spacing: +2px;

    border: 1px solid #a0a0a0;
}
@media screen and (min-width: 0) and (max-width: 568px)
{
    .m-btn-common a
    {
        display: block;

        text-align: left;
    }
}
.m-btn-common a:before
{
    position: absolute;
    z-index: -1; 
    top: 0;
    left: 0;

    width: 0;
    height: 100%;

    content: '';
    -webkit-transition: width .4s cubic-bezier(.47, .12, .11, .99);
            transition: width .4s cubic-bezier(.47, .12, .11, .99);

    background: #626262;
}
.m-btn-common a:after
{
    position: absolute;
    z-index: 1; 
    top: 50%;
    right: 15px;

    width: 30px;
    height: 9px;

    content: '';
    -webkit-transition: right .5s cubic-bezier(.47, .12, .11, .99);
            transition: right .5s cubic-bezier(.47, .12, .11, .99);
    -webkit-transform: translateY(-50%);
        -ms-transform: translateY(-50%);
            transform: translateY(-50%);

    background: url('../../../images/i_ar.svg') no-repeat center right;
    background-size: 100% auto;
}
@media screen and (min-width: 1024px)
{
    .m-btn-common a:hover
    {
        text-decoration: none;

        color: #fff;
    }
    .m-btn-common a:hover:after
    {
        right: 10px;

        background: url('../../../images/i_ar_btn_bk_on.svg') no-repeat right center;
        background-size: auto 100%;
    }
    .m-btn-common a:hover:before
    {
        width: 100%;
    }
}
@media screen and (min-width: 0) and (max-width: 568px)
{
    .m-btn-common
    {
        margin-top: 15px;
    }
}
.m-btn-common a:after
{
    background-image: url('../../images/i_ar.svg');
}
@media screen and (min-width: 1024px)
{
    .m-btn-common a:hover:after
    {
        background-image: url('../../images/i_ar_btn_bk_on.svg');
    }
}

.m-btn-pdf
{
    text-align: center;
}
.m-btn-pdf a
{
    font-size: 18px;
    font-size: 1.8rem;
    font-weight: bold;
    font-weight: bold; 
    line-height: 80px;

    position: relative;

    display: inline-block;

    width: 400px;
    height: 80px;
    padding: 0 15px;

    -webkit-transition: all .3s ease;
            transition: all .3s ease;
    text-align: center;
    vertical-align: middle;
    letter-spacing: .05em;

    color: #fff;
    background: #fff;
    background: #626262;
}
@media screen and (min-width: 0) and (max-width: 568px)
{
    .m-btn-pdf a
    {
        font-size: 1.4rem; 
        line-height: 50px;

        width: 300px;
        height: 50px;
    }
}
.m-btn-pdf a:after
{
    position: absolute;
    top: 50%;
    right: 30px;

    width: 24px;
    height: 30px;

    content: '';
    -webkit-transition: all .5s ease;
            transition: all .5s ease; 
    -webkit-transform: translateY(-50%);
        -ms-transform: translateY(-50%);
            transform: translateY(-50%);

    background: url('../../images/i_pdf.svg') no-repeat;
}
@media screen and (min-width: 0) and (max-width: 568px)
{
    .m-btn-pdf a:after
    {
        width: 20px;
        height: 26px;

        background-size: 100% auto;
    }
}
@media screen and (min-width: 1024px)
{
    .m-btn-pdf a:hover
    {
        text-decoration: none;

        color: #fff;
        background: #444;
    }
}

.m-btn-wtb
{
    display: none;
}
.m-btn-wtb a
{
    font-size: 24px;
    font-size: 2.4rem;
    font-weight: bold;

    position: relative;

    display: block;

    padding: 25px 0; 

    text-align: center;
    letter-spacing: +2px;

    color: #fff;
    background: #626262;
}
@media screen and (min-width: 0) and (max-width: 568px)
{
    .m-btn-wtb a
    {
        font-size: 1.4rem;

        padding: 13px 30px 14px;
    }
}
.m-btn-wtb a:after
{
    position: absolute;
    top: 50%;
    right: 50%;

    width: 12px;
    height: 12px;
    margin-top: 1px;
    margin-right: -512px;

    content: '';
    -webkit-transition: all .3s ease;
            transition: all .3s ease; 
    -webkit-transform: translate(-50%, -50%) rotate(45deg);
        -ms-transform: translate(-50%, -50%) rotate(45deg);
            transform: translate(-50%, -50%) rotate(45deg);

    border-top: 3px solid #fff;
    border-right: 3px solid #fff;
}
@media screen and (min-width: 0) and (max-width: 568px)
{
    .m-btn-wtb a:after
    {
        position: absolute;
        top: 50%;
        right: 20px; 

        width: 8px;
        height: 8px;
        margin-top: -5px;
        margin-left: 0;

        opacity: 1;
        border-top: 2px solid #fff;
        border-right: 2px solid #fff;

        -ms-filter: 'progid:DXImageTransform.Microsoft.Alpha(Opacity=100)';
    }
}
.m-btn-wtb a:hover
{
    text-decoration: none;
}
.m-btn-wtb a:hover:after
{
    margin-right: -522px;
}

#loading
{
    position: fixed;
    z-index: 0;
    z-index: 999;
    top: 0;
    left: 0;

    width: 100%;
    height: 100%;

    pointer-events: none;

    opacity: 1;
    background: #f0f0f0;

    -ms-filter: 'progid:DXImageTransform.Microsoft.Alpha(Opacity=100)';
    /* Luminous Circles */
}
#loading.is-load
{
    opacity: 1;

    -ms-filter: 'progid:DXImageTransform.Microsoft.Alpha(Opacity=100)';
}
#loading.is-ready
{
    -webkit-transition: opacity 1s ease;
            transition: opacity 1s ease; 

    opacity: 0 !important;

    -ms-filter: 'progid:DXImageTransform.Microsoft.Alpha(Opacity=0)';
}
#loading .pl-circles
{
    position: absolute;
    top: 0;
    left: 0;

    width: 100vw;
    height: 100vh;

    text-align: center;
}
#loading .pl-circles .loader
{
    position: absolute;
    top: 45%;
    left: 50%;

    width: 100px;
    height: 60px; 

    -webkit-transform: translate(-50%, -50%);
        -ms-transform: translate(-50%, -50%);
            transform: translate(-50%, -50%);
}
#loading .pl-circles .loader span,
#loading .pl-circles .loader:before,
#loading .pl-circles .loader:after
{
    position: absolute;

    display: block;

    width: 15px;
    height: 15px;

    opacity: .2;
    border-radius: 50%;
    background: #a0a0a0; 

    -ms-filter: 'progid:DXImageTransform.Microsoft.Alpha(Opacity=20)';
}
#loading .pl-circles .loader span
{
    top: 50%;
    left: 50%;

    -webkit-transform: translate(-50%, -50%);
        -ms-transform: translate(-50%, -50%);
            transform: translate(-50%, -50%);
    -webkit-animation: lightUp 1.5s linear infinite .5s;
            animation: lightUp 1.5s linear infinite .5s;
}
#loading .pl-circles .loader:before,
#loading .pl-circles .loader:after
{
    content: '';
}
#loading .pl-circles .loader:before
{
    top: 50%;
    left: 0;

    -webkit-transform: translate(0, -50%);
        -ms-transform: translate(0, -50%);
            transform: translate(0, -50%);
    -webkit-animation: lightUp 1.5s linear infinite;
            animation: lightUp 1.5s linear infinite;
}
#loading .pl-circles .loader:after
{
    top: 50%;
    right: 0;

    -webkit-transform: translate(0, -50%);
        -ms-transform: translate(0, -50%);
            transform: translate(0, -50%);
    -webkit-animation: lightUp 1.5s linear infinite 1s;
            animation: lightUp 1.5s linear infinite 1s;
}

@-webkit-keyframes lightUp
{
    0%
    {
        opacity: .2;

        -ms-filter: 'progid:DXImageTransform.Microsoft.Alpha(Opacity=20)';
    }
    40%
    {
        opacity: 1;

        -ms-filter: 'progid:DXImageTransform.Microsoft.Alpha(Opacity=100)';
    }
    60%
    {
        opacity: .2;

        -ms-filter: 'progid:DXImageTransform.Microsoft.Alpha(Opacity=20)';
    }
    100%
    {
        opacity: .2;

        -ms-filter: 'progid:DXImageTransform.Microsoft.Alpha(Opacity=20)';
    }
}

/* Slider */
.slick-slider
{
    position: relative;

    display: block;

    -webkit-box-sizing: border-box;
            box-sizing: border-box;

    -webkit-user-select: none;
       -moz-user-select: none;
        -ms-user-select: none;
            user-select: none;

    -webkit-touch-callout: none;
    -ms-touch-action: pan-y;
        touch-action: pan-y;
    -webkit-tap-highlight-color: transparent;
}

.slick-list
{
    position: relative;

    display: block;
    overflow: hidden;

    margin: 0;
    padding: 0;
}
.slick-list:focus
{
    outline: none;
}
.slick-list.dragging
{
    cursor: pointer;
    cursor: hand;
}

.slick-slider .slick-track,
.slick-slider .slick-list
{
    -webkit-transform: translate3d(0, 0, 0);
        -ms-transform: translate3d(0, 0, 0);
            transform: translate3d(0, 0, 0);
}

.slick-track
{
    position: relative;
    top: 0;
    left: 0;

    display: block;

    margin-right: auto; 
    margin-left: auto;
}
.slick-track:before,
.slick-track:after
{
    display: table; 

    content: '';
}
.slick-track:after
{
    clear: both;
}
.slick-loading .slick-track
{
    visibility: hidden;
}

.slick-slide
{
    display: none; 
    float: left;

    height: 100%;
    min-height: 1px;
}
[dir='rtl'] .slick-slide
{
    float: right;
}
.slick-slide img
{
    display: block;
}
.slick-slide.slick-loading img
{
    display: none;
}
.slick-slide.dragging img
{
    pointer-events: none;
}
.slick-initialized .slick-slide
{
    display: block;
}
.slick-loading .slick-slide
{
    visibility: hidden;
}
.slick-vertical .slick-slide
{
    display: block;

    height: auto;

    border: 1px solid transparent;
}

.slick-arrow.slick-hidden
{
    display: none;
}

body
{
    position: relative;
}
body.is-loading
{
    position: fixed;

    overflow: hidden;

    width: 100%;
    height: 100%;
}
body.is-fixed
{
    position: fixed;

    width: 100%;
    height: 100%;
}

html
{
    font-size: 62.5%; 
    font-weight: 500;
}

body
{
    font-size: 16px;
    font-size: 1.6rem;
    line-height: 1.75;

    color: #262626;
    background: #f6f6f6;
}
@media screen and (min-width: 0) and (max-width: 568px)
{
    body
    {
        font-size: 1.4rem;
    }
}

header,
footer
{
    font: 13px/1.7 'Noto Sans Japanese', 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', 'モリサワ 新ゴ R', 'Droid Sans', メイリオ, sans-serif;
}

#Gnav
{
    height: auto !important;
}
@media screen and (min-width: 0) and (max-width: 568px)
{
    #Gnav
    {
        display: none;
    }
}

#body_inner
{
    position: relative;

    width: 100%;
}
#body_inner.is-fixed
{
    position: fixed !important;

    width: 100%;
}
#body_inner .pj-container
{
    position: absolute;
    top: 0;
    left: 0;

    overflow: hidden; 

    width: 100%;
}
#body_inner .pj-container:before
{
    position: fixed;
    z-index: -999999; 
    top: 0;
    left: 0;

    width: 100%;
    height: 100%;

    content: '';
}
#body_inner .pj-container.is-change:before
{
    z-index: 999999;
}
#body_inner .pj-container .container-curtain
{
    position: fixed;
    z-index: 999; 
    top: 0;
    left: 0;

    width: 100%;
    height: 100%;

    opacity: 0;
    background: #f6f6f6;

    -ms-filter: 'progid:DXImageTransform.Microsoft.Alpha(Opacity=0)';
}
#body_inner .pj-container.is-stop
{
    position: fixed;
    top: 0 !important;

    -webkit-transition: none !important;
            transition: none !important;
    -webkit-transform: translate3d(0px, 0px, 0px) !important;
            transform: translate3d(0px, 0px, 0px) !important;
}

#container .detail-content .content-read
{
    margin-bottom: 100px;

    text-align: center;
}
@media screen and (min-width: 0) and (max-width: 568px)
{
    #container .detail-content .content-read
    {
        margin: 50px 0;
    }
}

#container .container-head
{
    position: fixed;
    z-index: 999; 
    top: 0;
    left: 0;

    width: 100%;
    height: 60px;

    background: rgba(0, 0, 0, .75);
}
@media screen and (min-width: 0) and (max-width: 568px)
{
    #container .container-head
    {
        height: 40px;
    }
}
#container .container-head .head-index a
{
    position: absolute;
    top: 0;
    left: 0;

    display: block;

    width: 80px; 
    height: 60px;
}
@media screen and (min-width: 0) and (max-width: 568px)
{
    #container .container-head .head-index a
    {
        width: 50px; 
        height: 40px;
    }
}
#container .container-head .head-index a:before
{
    position: absolute;
    top: 50%;
    left: 50%;

    display: inline-block;

    width: 13px;
    height: 13px;

    content: '';
    -webkit-transition: all .3s ease;
            transition: all .3s ease; 
    -webkit-transform: translate(-50%, -50%) rotate(-135deg);
        -ms-transform: translate(-50%, -50%) rotate(-135deg);
            transform: translate(-50%, -50%) rotate(-135deg);

    border-top: 4px solid #fff;
    border-right: 4px solid #fff;
}
@media screen and (min-width: 0) and (max-width: 568px)
{
    #container .container-head .head-index a:before
    {
        width: 8px;
        height: 8px;

        border-top: 2px solid #fff;
        border-right: 2px solid #fff;
    }
}
#container .container-head .head-index a:hover:before
{
    left: 40%;
}
#container .container-head .head-list
{
    font-size: 0;

    display: block;

    text-align: center;

    *zoom: 1;
}
#container .container-head .head-list:after
{
    display: table;
    clear: both; 

    content: ' ';
}
@media screen and (min-width: 0) and (max-width: 568px)
{
    #container .container-head .head-list
    {
        display: none;

        margin-top: 40px;
        padding-bottom: 20px;

        text-align: left;

        background: rgba(0, 0, 0, .75);
    }
}
#container .container-head .head-list > li
{
    font-size: 16px;
    font-size: 1.6rem;

    display: inline-block;

    padding: 0 50px;
}
@media screen and (min-width: 0) and (max-width: 568px)
{
    #container .container-head .head-list > li
    {
        margin-top: 10px;
        padding: 0 45px;
    }
    #container .container-head .head-list > li:first-child
    {
        margin-top: 0;
    }
}
#container .container-head .head-list > li a
{
    font-family: 'Montserrat', sans-serif; 
    line-height: 60px;

    position: relative;

    display: block;

    color: #fff;
}
@media screen and (min-width: 0) and (max-width: 568px)
{
    #container .container-head .head-list > li a
    {
        font-size: 1.4rem;
        line-height: 1;

        padding: 10px 0;

        -webkit-transition: opacity .3s ease;
                transition: opacity .3s ease; 

        opacity: 0;

        -ms-filter: 'progid:DXImageTransform.Microsoft.Alpha(Opacity=0)';
    }
}
#container .container-head .head-list > li a:after
{
    position: absolute;
    bottom: 0;
    left: 50%;

    width: 0;
    height: 2px;

    content: '';
    -webkit-transition: all .3s ease;
            transition: all .3s ease; 

    background: #fff;
}
@media screen and (min-width: 0) and (max-width: 568px)
{
    #container .container-head .head-list > li a:after
    {
        bottom: 50%;
        left: -45px;

        height: 1px;

        -webkit-transform: translateY(-50%);
            -ms-transform: translateY(-50%);
                transform: translateY(-50%);
    }
}
@media screen and (min-width: 1024px)
{
    #container .container-head .head-list > li a:hover,
    #container .container-head .head-list > li a.is-active
    {
        text-decoration: none;
    }
    #container .container-head .head-list > li a:hover:after,
    #container .container-head .head-list > li a.is-active:after
    {
        left: 0;

        width: 100%;
    }
}
#container .container-head .head-list > li a.is-active
{
    text-decoration: none;
}
#container .container-head .head-list > li a.is-active:after
{
    left: 0;

    width: 100%;
}
@media screen and (min-width: 0) and (max-width: 568px)
{
    #container .container-head .head-list > li a.is-active:after
    {
        left: -45px;

        width: 25px;
    }
}
#container .container-head .head-list > li a span
{
    line-height: 1.5; 

    display: block;

    padding: 21px 0;
}
@media screen and (min-width: 0) and (max-width: 568px)
{
    #container .container-head .head-list > li a span
    {
        padding: 0;
    }
}
#container .container-head .head-burger
{
    position: absolute;
    top: 0;
    right: 0;

    display: none;

    width: 60px;
    height: 40px;

    cursor: pointer;
    -webkit-transition: all .3s ease-in-out;
            transition: all .3s ease-in-out;
}
@media screen and (min-width: 0) and (max-width: 568px)
{
    #container .container-head .head-burger
    {
        display: block;
    }
}
#container .container-head .head-burger > span
{
    position: absolute;
    top: 50%;
    left: 50%;

    display: inline-block;

    width: 14px;
    height: 2px;
    margin-left: -7px;

    -webkit-transition: all .3s ease-in-out;
            transition: all .3s ease-in-out; 

    background-color: #fff;
}
#container .container-head .head-burger > span:nth-of-type(1)
{
    margin-top: -7px;
}
#container .container-head .head-burger > span:nth-of-type(2)
{
    margin-top: -1px;
}
#container .container-head .head-burger > span:nth-of-type(3)
{
    margin-top: 5px;
}
#container .container-head .head-burger.is-active > span:nth-of-type(1)
{
    margin-top: 0 !important;

    transition: margin .2s cubic-bezier(.36, 0, .59, .99) .1s, -webkit-transform .25s ease .36s; 
    -webkit-transform: rotateZ(45deg);
        -ms-transform: rotate(45deg);
            transform: rotateZ(45deg);
}
#container .container-head .head-burger.is-active > span:nth-of-type(2)
{
    -webkit-transition: .2s ease .1s;
            transition: .2s ease .1s;

    opacity: 0;

    -ms-filter: 'progid:DXImageTransform.Microsoft.Alpha(Opacity=0)';
}
#container .container-head .head-burger.is-active > span:nth-of-type(3)
{
    margin-top: 0 !important;

    -webkit-transition: margin .2s cubic-bezier(.36, 0, .59, .99) .1s, -webkit-transform .25s ease .36s;
            transition: margin .2s cubic-bezier(.36, 0, .59, .99) .1s, -webkit-transform .25s ease .36s;
            transition: margin .2s cubic-bezier(.36, 0, .59, .99) .1s, transform .25s ease .36s;
            transition: margin .2s cubic-bezier(.36, 0, .59, .99) .1s, transform .25s ease .36s, -webkit-transform .25s ease .36s; 
    -webkit-transform: rotateZ(-45deg);
        -ms-transform: rotate(-45deg);
            transform: rotateZ(-45deg);
}
#container .container-head.head-l
{
    height: 90px;
}
@media screen and (min-width: 0) and (max-width: 568px)
{
    #container .container-head.head-l
    {
        height: 40px;
    }
}
#container .container-head.head-l .head-index a
{
    height: 90px;
}
@media screen and (min-width: 0) and (max-width: 568px)
{
    #container .container-head.head-l .head-index a
    {
        height: 40px;
    }
}

.modal
{
    position: fixed;
    z-index: 99999;
    top: 0;
    left: 0;

    display: none; 

    width: 100%;
    height: 100%;
}
.modal .modal-bg
{
    position: absolute;
    top: 0;
    left: 0;

    width: 100%;
    height: 100%;

    opacity: .8;
    background: #000;

    -ms-filter: 'progid:DXImageTransform.Microsoft.Alpha(Opacity=80)';
}
.modal .modal-inner
{
    position: absolute;
    z-index: 1; 
    top: 50%;
    left: 50%;

    width: 100%;
    max-width: 1024px;
    height: 100%;

    -webkit-transform: translate(-50%, -50%);
        -ms-transform: translate(-50%, -50%);
            transform: translate(-50%, -50%);
}
@media screen and (min-width: 0) and (max-width: 568px)
{
    .modal .modal-inner
    {
        width: 90%;
    }
}
.modal #player
{
    position: absolute;
    top: 50%;
    left: 50%;

    width: 90%;
    padding-top: 50%;

    -webkit-transform: translate(-50%, -50%);
        -ms-transform: translate(-50%, -50%);
            transform: translate(-50%, -50%);
}
@media screen and (min-width: 0) and (max-width: 568px)
{
    .modal #player
    {
        min-width: 0;
        padding-top: 50%;
    }
}
.modal #player .video-js
{
    position: absolute;
    top: 0;
    right: 0;

    width: 100% !important;
    height: 100% !important;
}
.modal #player video
{
    position: absolute;
    top: 0;
    right: 0;

    width: 100% !important;
    height: 100% !important;
}
.modal .modal-close
{
    position: absolute;
    z-index: 10;
    top: -70px;
    right: 0;

    width: 50px;
    height: 50px;

    cursor: pointer;
    -webkit-transition: all .5s ease;
            transition: all .5s ease; 
    -webkit-transform: rotate(45deg);
        -ms-transform: rotate(45deg);
            transform: rotate(45deg);
}
@media screen and (min-width: 0) and (max-width: 568px)
{
    .modal .modal-close
    {
        top: -50px;
        right: 0;

        width: 40px;
        height: 40px;
    }
}
.modal .modal-close:hover
{
    -webkit-transform: rotate(135deg);
        -ms-transform: rotate(135deg);
            transform: rotate(135deg);
}
.modal .modal-close:before
{
    position: absolute;
    top: 25px;
    right: 0;

    width: 100%;
    height: 2px;

    content: '';

    background: #fff;
}
@media screen and (min-width: 0) and (max-width: 568px)
{
    .modal .modal-close:before
    {
        top: 20px;
    }
}
.modal .modal-close:after
{
    position: absolute;
    top: 0;
    left: 25px;

    width: 2px;
    height: 100%;

    content: '';

    background: #fff;
}
@media screen and (min-width: 0) and (max-width: 568px)
{
    .modal .modal-close:after
    {
        left: 20px;
    }
}

.mat-s
{
    margin-top: 30px !important;
}
@media screen and (min-width: 0) and (max-width: 568px)
{
    .mat-s
    {
        margin-top: 15px !important;
    }
}

.mat-m
{
    margin-top: 40px !important;
}
@media screen and (min-width: 0) and (max-width: 568px)
{
    .mat-m
    {
        margin-top: 20px !important;
    }
}

@media screen and (min-width: 0) and (max-width: 568px)
{
    .mat-l-sp
    {
        margin-top: 50px !important;
    }
}

[data-js-fixed].is-stop
{
    position: fixed;
    top: 0 !important;

    -webkit-transition: none !important;
            transition: none !important;
    -webkit-transform: translate3d(0px, 0px, 0px) !important;
            transform: translate3d(0px, 0px, 0px) !important;
}

[data-src]
{
    background-color: #f0f0f0; 
    background-repeat: no-repeat;
    background-size: 100% auto;

    -webkit-backface-visibility: hidden;
            backface-visibility: hidden;
}

[data-pj-mv]
{
    position: relative;
    z-index: 99999;
}

@media screen and (min-width: 0) and (max-width: 568px)
{
    .view-pc
    {
        display: none !important;
    }
}

.view-sp
{
    display: none !important;
}
@media screen and (min-width: 0) and (max-width: 568px)
{
    .view-sp
    {
        display: block !important;
    }
}