@charset 'UTF-8';
#Head
{
    opacity: 0;

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

.mean-bar
{
    margin-top: -72px;
}

body
{
    min-width: 1024px;
}
@media screen and (min-width: 0) and (max-width: 568px)
{
    body
    {
        min-width: 0;
    }
}

@media screen and (min-width: 0) and (max-width: 568px)
{
    #headLogo
    {
        opacity: 0 !important;

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

@media screen and (min-width: 1024px)
{
    .m-box-mv .mv-inner
    {
        padding-top: 53.5%;
    }
}

.m-txt-ttl .ttl-main span
{
    -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;
}

.m-txt-ttl .ttl-sub span
{
    -webkit-transition: -webkit-transform 1s cubic-bezier(.47, .12, .11, .99) .6s;
            transition: -webkit-transform 1s cubic-bezier(.47, .12, .11, .99) .6s;
            transition:         transform 1s cubic-bezier(.47, .12, .11, .99) .6s;
            transition:         transform 1s cubic-bezier(.47, .12, .11, .99) .6s, -webkit-transform 1s cubic-bezier(.47, .12, .11, .99) .6s;
}

.u-showcase-block
{
    position: relative;

    width: 1024px;
    margin: 80px auto 0;
    padding: 40px 0 80px;
}
.u-showcase-block:before
{
    position: absolute;
    z-index: -1; 
    top: 0;
    left: 0;

    width: 1224px;
    height: 100%;
    margin-left: -100px;

    content: '';

    background: #fff;
}
@media screen and (min-width: 0) and (max-width: 568px)
{
    .u-showcase-block:before
    {
        display: none;
    }
}
@media screen and (min-width: 0) and (max-width: 568px)
{
    .u-showcase-block
    {
        width: auto;
        margin: 0;
        padding: 0 0 40px;

        background: #fff;
    }
}
@media screen and (min-width: 0) and (max-width: 568px)
{
    .u-showcase-block + .u-concept-block
    {
        margin-top: 70px;
    }
}
.u-showcase-block.more:after
{
    position: absolute;
    z-index: 1; 
    top: 0;
    left: -100px;

    width: 1224px;
    height: 4px;

    content: '';

    background: #000;
}
@media screen and (min-width: 0) and (max-width: 568px)
{
    .u-showcase-block.more:after
    {
        height: 2px;
    }
}
.u-showcase-block.has-btn
{
    padding-bottom: 120px;
}
@media screen and (min-width: 0) and (max-width: 568px)
{
    .u-showcase-block.has-btn
    {
        padding-bottom: 65px;
    }
}
.u-showcase-block.has-btn + .u-concept-block
{
    margin-top: 100px;
}
@media screen and (min-width: 0) and (max-width: 568px)
{
    .u-showcase-block.has-btn + .u-concept-block
    {
        margin-top: 96px;
    }
}
.u-showcase-block.block-matl
{
    margin-top: 140px;
}
@media screen and (min-width: 0) and (max-width: 568px)
{
    .u-showcase-block.block-matl
    {
        margin-top: 0;
    }
}
.u-showcase-block .block-ttl
{
    display: table;

    width: 1144px;
    height: 360px;
    margin: 0 auto;
    margin-left: -60px;
}
@media screen and (min-width: 0) and (max-width: 568px)
{
    .u-showcase-block .block-ttl
    {
        width: 100%;
        height: 240px; 
        margin-left: 0;
    }
}
.u-showcase-block .block-ttl .ttl-area
{
    display: table-cell;

    padding: 0 60px; 

    vertical-align: middle;
}
@media screen and (min-width: 0) and (max-width: 568px)
{
    .u-showcase-block .block-ttl .ttl-area
    {
        padding: 0 20px;
    }
}
.u-showcase-block .block-ttl h2
{
    font-family: 'Montserrat', sans-serif; 
    font-size: 76.8px;
    font-size: 4.8rem;
    font-weight: normal;
    line-height: 1.6;

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

    color: #fff;
}
@media screen and (min-width: 0) and (max-width: 568px)
{
    .u-showcase-block .block-ttl h2
    {
        font-size: 2.4rem;
    }
}
.u-showcase-block .block-ttl h2 .ttl-mark
{
    font-size: 24px;
    font-size: 1.5rem;

    letter-spacing: +2px;
}
.u-showcase-block .block-ttl h2 img
{
    width: 60px;
    margin-top: 22px;
    margin-right: 20px;

    vertical-align: top;
}
@media screen and (min-width: 0) and (max-width: 568px)
{
    .u-showcase-block .block-ttl h2 img
    {
        width: 20px;
        margin-right: 10px;
    }
}
.u-showcase-block .block-ttl h3
{
    font-size: 48px;
    font-size: 3.0rem;
    line-height: 1.5;

    margin-top: 15px; 

    text-align: center;

    color: #fff;
}
@media screen and (min-width: 0) and (max-width: 568px)
{
    .u-showcase-block .block-ttl h3
    {
        font-size: 1.5rem; 

        margin-top: 5px;
    }
}
.u-showcase-block .block-ttl ul
{
    margin-bottom: 20px; 

    text-align: center;
    letter-spacing: -.4em;
}
@media screen and (min-width: 0) and (max-width: 568px)
{
    .u-showcase-block .block-ttl ul
    {
        margin-bottom: 10px;
    }
}
.u-showcase-block .block-ttl ul li
{
    display: inline-block; 

    letter-spacing: normal;
}
@media screen and (min-width: 0) and (max-width: 568px)
{
    .u-showcase-block .block-ttl ul li
    {
        width: 25px;
    }
}
.u-showcase-block .block-ttl ul li img
{
    width: 60px;
    height: auto;
}
@media screen and (min-width: 0) and (max-width: 568px)
{
    .u-showcase-block .block-ttl ul li img
    {
        width: 30px;
    }
}
.u-showcase-block .block-ttl ul li + li
{
    margin-left: 30px;
}
@media screen and (min-width: 0) and (max-width: 568px)
{
    .u-showcase-block .block-ttl ul li + li
    {
        margin-left: 15px;
    }
}
.u-showcase-block .block-ttl img
{
    max-width: 100%;
}
.u-showcase-block .block-content
{
    font-size: 28.8px;
    font-size: 1.8rem; 

    position: relative;

    width: 1024px;
    margin: 20px auto 0;
}
@media screen and (min-width: 0) and (max-width: 568px)
{
    .u-showcase-block .block-content
    {
        font-size: 1.4rem; 

        width: auto;
        margin: 20px 20px 0;
    }
}
.u-showcase-block .block-content h3
{
    font-size: 57.6px;
    font-size: 3.6rem; 

    text-align: center;
}
@media screen and (min-width: 0) and (max-width: 568px)
{
    .u-showcase-block .block-content h3
    {
        font-size: 1.8rem;
    }
}
.u-showcase-block .block-content h3.mt-l
{
    margin-top: 60px;
}
@media screen and (min-width: 0) and (max-width: 568px)
{
    .u-showcase-block .block-content h3.mt-l
    {
        margin-top: 30px;
    }
}
.u-showcase-block .block-content .content-copy
{
    margin-top: 30px;
}
@media screen and (min-width: 0) and (max-width: 568px)
{
    .u-showcase-block .block-content .content-copy
    {
        margin-top: 7px;
    }
}
.u-showcase-block .block-content .content-copy img
{
    max-width: 100%;
}
.u-showcase-block .block-content .content-copy-img
{
    margin-top: 70px;
}
@media screen and (min-width: 0) and (max-width: 568px)
{
    .u-showcase-block .block-content .content-copy-img
    {
        margin-top: 35px;
    }
}
.u-showcase-block .block-content .content-copy-img img
{
    max-width: 100%;
}
.u-showcase-block .block-content .content-txt
{
    margin-top: 25px;
}
@media screen and (min-width: 0) and (max-width: 568px)
{
    .u-showcase-block .block-content .content-txt
    {
        font-size: 1.4rem;
    }
}
.u-showcase-block .block-content .content-ttl4
{
    font-size: 28.8px;
    font-size: 1.8rem; 
    font-weight: bold;

    margin-top: 15px;
}
@media screen and (min-width: 0) and (max-width: 568px)
{
    .u-showcase-block .block-content .content-ttl4
    {
        font-size: 1.4rem;
    }
}
.u-showcase-block .block-content [data-drawer-item]
{
    display: none;
}
.u-showcase-block .block-content .content-items
{
    letter-spacing: -.4em;
}
.u-showcase-block .block-content .content-items li
{
    display: inline-block;

    width: 318px;
    margin: 70px 35px 0 0;

    vertical-align: top; 
    letter-spacing: normal;
}
@media screen and (min-width: 0) and (max-width: 568px)
{
    .u-showcase-block .block-content .content-items li
    {
        display: block;

        width: auto;
        margin: 40px 0 0;
    }
}
.u-showcase-block .block-content .content-items li:nth-child(3n)
{
    margin-right: 0;
}
.u-showcase-block .block-content .content-items li:nth-child(n+4)
{
    margin-top: 80px;
}
@media screen and (min-width: 0) and (max-width: 568px)
{
    .u-showcase-block .block-content .content-items li:nth-child(n+4)
    {
        margin-top: 40px;
    }
}
.u-showcase-block .block-content .content-items li h4
{
    font-size: 32px;
    font-size: 2.0rem; 

    min-height: 39px;

    text-align: center;
}
@media screen and (min-width: 0) and (max-width: 568px)
{
    .u-showcase-block .block-content .content-items li h4
    {
        font-size: 1.8rem; 

        min-height: 0;
    }
}
.u-showcase-block .block-content .content-items li h4 img
{
    margin-right: 15px; 

    vertical-align: middle;
}
@media screen and (min-width: 0) and (max-width: 568px)
{
    .u-showcase-block .block-content .content-items li h4 img
    {
        width: 25px;
        margin-right: 10px;
    }
}
.u-showcase-block .block-content .content-items li h4 + .item-img
{
    margin-top: 30px;
}
.u-showcase-block .block-content .content-items li .item-img img
{
    width: 100%;
}
.u-showcase-block .block-content .content-items li .item-img + .item-desc
{
    font-size: 25.6px;
    font-size: 1.6rem; 

    margin-top: 15px;
}
@media screen and (min-width: 0) and (max-width: 568px)
{
    .u-showcase-block .block-content .content-items li .item-img + .item-desc
    {
        font-size: 1.2rem;
    }
}
.u-showcase-block .block-content .content-items li .item-img-desc
{
    font-size: 25.6px;
    font-size: 1.6rem;

    text-align: right;
}
@media screen and (min-width: 0) and (max-width: 568px)
{
    .u-showcase-block .block-content .content-items li .item-img-desc
    {
        font-size: 1.2rem;

        margin-top: 5px !important;
    }
}
.u-showcase-block .block-content .content-items li .item-desc
{
    margin-top: 25px;
}
.u-showcase-block .block-content .content-items li .item-desc:first-child
{
    margin-top: 0;
}
.u-showcase-block .block-content .content-items li .item-desc.desc-normal
{
    font-weight: normal;
}
@media screen and (min-width: 0) and (max-width: 568px)
{
    .u-showcase-block .block-content .content-items li .item-desc
    {
        font-size: 1.4rem;
    }
}
.u-showcase-block .block-content .content-items li .item-btn
{
    margin-top: 25px;

    text-align: center;
}
.u-showcase-block .block-content .content-items li .item-btn a
{
    font-size: 22.4px;
    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)
{
    .u-showcase-block .block-content .content-items li .item-btn a
    {
        display: block;

        text-align: left;
    }
}
.u-showcase-block .block-content .content-items li .item-btn 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;
}
.u-showcase-block .block-content .content-items li .item-btn 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)
{
    .u-showcase-block .block-content .content-items li .item-btn a:hover
    {
        text-decoration: none;

        color: #fff;
    }
    .u-showcase-block .block-content .content-items li .item-btn a:hover:after
    {
        right: 10px;

        background: url('../../../images/i_ar_btn_bk_on.svg') no-repeat right center;
        background-size: auto 100%;
    }
    .u-showcase-block .block-content .content-items li .item-btn a:hover:before
    {
        width: 100%;
    }
}
.u-showcase-block .block-content .content-items.col2 li
{
    width: 492px;
    margin: 70px 40px 0 0;

    vertical-align: top;
}
@media screen and (min-width: 0) and (max-width: 568px)
{
    .u-showcase-block .block-content .content-items.col2 li
    {
        display: block;

        width: auto;
        margin: 40px 0 0;
    }
}
.u-showcase-block .block-content .content-items.col2 li:nth-child(even)
{
    margin-right: 0;
}
.u-showcase-block .block-content .content-items.col2 li:nth-child(n+3)
{
    margin-top: 80px;
}
@media screen and (min-width: 0) and (max-width: 568px)
{
    .u-showcase-block .block-content .content-items.col2 li:nth-child(n+3)
    {
        margin-top: 40px;
    }
}
.u-showcase-block .block-content .content-items.col2 li > *:first-child
{
    margin-top: 0;
}
.u-showcase-block .block-content .content-items.col2 li .item-desc
{
    font-size: 28.8px;
    font-size: 1.8rem;
}
@media screen and (min-width: 0) and (max-width: 568px)
{
    .u-showcase-block .block-content .content-items.col2 li .item-desc
    {
        font-size: 1.4rem;
    }
}
@media screen and (min-width: 0) and (max-width: 568px)
{
    .u-showcase-block .block-content .content-items.sp-group > li:last-child
    {
        margin-top: 15px !important;
    }
}
@media screen and (min-width: 0) and (max-width: 568px)
{
    .u-showcase-block .block-content .content-items.sp-change
    {
        display: table;

        width: 100%;
    }
    .u-showcase-block .block-content .content-items.sp-change > li:first-child
    {
        display: table-footer-group;
    }
    .u-showcase-block .block-content .content-items.sp-change > li:first-child > *
    {
        margin-top: 15px;
    }
    .u-showcase-block .block-content .content-items.sp-change > li:last-child
    {
        display: table-header-group;
    }
    .u-showcase-block .block-content .content-items.sp-change > li:last-child > *
    {
        margin-top: 30px;
    }
}
.u-showcase-block .block-content .content-btn
{
    font-weight: bold;

    position: absolute;
    right: 0;
    bottom: -170px;
    left: 0;

    cursor: pointer;
    -webkit-transition: all .3s ease;
            transition: all .3s ease; 
    text-align: center;
    letter-spacing: +2px;

    color: #fff;
    border: 1px solid #a0a0a0;
    background: #626262;
}
@media screen and (min-width: 0) and (max-width: 568px)
{
    .u-showcase-block .block-content .content-btn
    {
        bottom: -90px;
    }
}
.u-showcase-block .block-content .content-btn .btn-detail
{
    font-size: 38.4px;
    font-size: 2.4rem; 

    position: relative;
    z-index: 1;

    display: block;

    padding: 30px 15px 42px 15px;

    -webkit-transition: all .5s ease;
            transition: all .5s ease;
}
@media screen and (min-width: 0) and (max-width: 568px)
{
    .u-showcase-block .block-content .content-btn .btn-detail
    {
        font-size: 1.4rem; 

        padding: 6px 50px 16px 50px;
    }
}
.u-showcase-block .block-content .content-btn .btn-detail:after
{
    position: absolute;
    top: 50%;
    left: 50%;

    display: block;

    width: 11px;
    height: 11px;
    margin-top: 18px;

    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: 2px solid #fff;
    border-right: 2px solid #fff;
}
@media screen and (min-width: 0) and (max-width: 568px)
{
    .u-showcase-block .block-content .content-btn .btn-detail:after
    {
        width: 7px;
        height: 7px;
        margin-top: 10px;
    }
}
@media screen and (min-width: 1024px)
{
    .u-showcase-block .block-content .content-btn .btn-detail:hover
    {
        background: #444;
    }
    .u-showcase-block .block-content .content-btn .btn-detail:hover:after
    {
        margin-top: 25px;
    }
}
.u-showcase-block .block-content .content-btn .btn-close
{
    font-size: 38.4px;
    font-size: 2.4rem; 

    position: relative;

    display: none;

    padding: 42px 15px 30px 15px;

    -webkit-transition: all .3s ease;
            transition: all .3s ease;
}
@media screen and (min-width: 0) and (max-width: 568px)
{
    .u-showcase-block .block-content .content-btn .btn-close
    {
        font-size: 1.4rem; 

        padding: 16px 50px 6px 50px;
    }
}
.u-showcase-block .block-content .content-btn .btn-close:after
{
    position: absolute;
    z-index: 1; 
    top: 50%;
    left: 50%;

    display: block;

    width: 11px;
    height: 11px;
    margin-top: -18px;

    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: 2px solid #fff;
    border-right: 2px solid #fff;
}
@media screen and (min-width: 0) and (max-width: 568px)
{
    .u-showcase-block .block-content .content-btn .btn-close:after
    {
        width: 7px;
        height: 7px;
        margin-top: -10px;
    }
}
@media screen and (min-width: 1024px)
{
    .u-showcase-block .block-content .content-btn .btn-close:hover
    {
        background: #444;
    }
    .u-showcase-block .block-content .content-btn .btn-close:hover:after
    {
        margin-top: -25px;
    }
}
@media screen and (min-width: 1024px)
{
    .u-showcase-block .block-content .content-btn:hover:before
    {
        height: 0;
    }
}
.u-showcase-block .block-content .content-btn.is-open:before
{
    height: 0;
}
@media screen and (min-width: 1024px)
{
    .u-showcase-block .block-content .content-btn.is-open:hover:before
    {
        height: 100%;
    }
}
.u-showcase-block .block-content .content-btn.is-open .btn-detail
{
    display: none;
}
.u-showcase-block .block-content .content-btn.is-open .btn-close
{
    display: block;
}
.u-showcase-block .block-content .content-ttlmore
{
    font-size: 57.6px;
    font-size: 3.6rem;
    line-height: 1;

    margin-top: 0 !important;

    text-align: center;
}
@media screen and (min-width: 0) and (max-width: 568px)
{
    .u-showcase-block .block-content .content-ttlmore
    {
        font-size: 2.0rem;
        line-height: 1.125;

        padding-top: 30px;

        letter-spacing: +2px;
    }
}
.u-showcase-block .block-content .content-ttlmore + .content-copy
{
    text-align: center;
}
.u-showcase-block .block-content .content-ttllead
{
    font-size: 57.6px;
    font-size: 3.6rem;

    margin-top: 3px; 

    text-align: center;
}
@media screen and (min-width: 0) and (max-width: 568px)
{
    .u-showcase-block .block-content .content-ttllead
    {
        font-size: 1.8rem; 

        padding-top: 30px;
    }
}
.u-showcase-block .block-content .item-btn-l
{
    margin-top: 35px;

    text-align: center;
}
.u-showcase-block .block-content .item-btn-l a
{
    font-weight: bold;
    line-height: 1;

    position: relative;
    z-index: 0; 

    display: inline-block;

    padding: 20px 70px 20px 20px;

    letter-spacing: +2px;

    border: 1px solid #a0a0a0;
}
@media screen and (min-width: 0) and (max-width: 568px)
{
    .u-showcase-block .block-content .item-btn-l a
    {
        font-size: 1.2rem;

        display: block;

        padding: 15px 70px 15px 20px; 

        text-align: left;
    }
}
.u-showcase-block .block-content .item-btn-l 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;
}
.u-showcase-block .block-content .item-btn-l 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)
{
    .u-showcase-block .block-content .item-btn-l a:hover
    {
        text-decoration: none;

        color: #fff;
    }
    .u-showcase-block .block-content .item-btn-l a:hover:after
    {
        right: 10px;

        background: url('../../../images/i_ar_btn_bk_on.svg') no-repeat right center;
        background-size: auto 100%;
    }
    .u-showcase-block .block-content .item-btn-l a:hover:before
    {
        width: 100%;
    }
}
.u-showcase-block .block-content img
{
    max-width: 100%;
}
@media screen and (min-width: 1024px)
{
    .u-showcase-block .block-content > .content-items:first-child > li:nth-child(1),
    .u-showcase-block .block-content > .content-items:first-child > li:nth-child(2),
    .u-showcase-block .block-content > .content-items:first-child > li:nth-child(3)
    {
        margin-top: 0;
    }
}
.u-showcase-block .block-content > *:first-child
{
    margin-top: 60px !important;
}
@media screen and (min-width: 0) and (max-width: 568px)
{
    .u-showcase-block .block-content > *:first-child
    {
        margin-top: 30px !important;
    }
}
.u-showcase-block > .block-content:first-child
{
    margin-top: 33px;
}
.u-showcase-block .block-ttl
{
    height: 600px;
}
@media screen and (min-width: 0) and (max-width: 568px)
{
    .u-showcase-block .block-ttl
    {
        height: 180px;

        background-size: cover;
    }
}
.u-showcase-block .block-ttl.ttl-sc01
{
    background: url(../../../showcase/plan01/images/p_label01_pc.jpg) top center no-repeat;
    background-size: cover;
}
@media screen and (min-width: 0) and (max-width: 568px)
{
    .u-showcase-block .block-ttl.ttl-sc01
    {
        background: url(../../../showcase/plan01/images/p_label01_sp.jpg) top center no-repeat;
        background-size: cover;
    }
}
.u-showcase-block .block-info
{
    position: relative;
    z-index: 10; 

    width: 1024px;
    margin: 0 auto;

    *zoom: 1;
}
.u-showcase-block .block-info:after
{
    display: table;
    clear: both; 

    content: ' ';
}
@media screen and (min-width: 0) and (max-width: 568px)
{
    .u-showcase-block .block-info
    {
        width: auto;
    }
}
.u-showcase-block .block-info .info-left
{
    float: left;

    width: 50%;
    padding-right: 20px;
}
@media screen and (min-width: 0) and (max-width: 568px)
{
    .u-showcase-block .block-info .info-left
    {
        float: none;

        width: auto;
        padding: 0;
    }
}
.u-showcase-block .block-info .info-right
{
    float: right;

    width: 50%;
    padding-left: 20px;
}
@media screen and (min-width: 0) and (max-width: 568px)
{
    .u-showcase-block .block-info .info-right
    {
        float: none;

        width: auto;
        margin-top: 30px; 
        padding: 0;
    }
}
.u-showcase-block .block-info .info-txt
{
    margin-top: 75px;
}
@media screen and (min-width: 0) and (max-width: 568px)
{
    .u-showcase-block .block-info .info-txt
    {
        margin: 0 15px;
        margin-top: 30px;
    }
}
.u-showcase-block .block-info .info-txt .txt-ttl
{
    font-size: 57.6px;
    font-size: 3.6rem; 
    line-height: 1.5;

    margin-bottom: 30px;
}
@media screen and (min-width: 0) and (max-width: 568px)
{
    .u-showcase-block .block-info .info-txt .txt-ttl
    {
        font-size: 2.0rem; 

        margin-top: 30px;
        margin-bottom: 20px;
    }
}
.u-showcase-block .block-info .info-txt .text-read
{
    font-size: 28.8px;
    font-size: 1.8rem; 
    font-weight: bold;
}
@media screen and (min-width: 0) and (max-width: 568px)
{
    .u-showcase-block .block-info .info-txt .text-read
    {
        font-size: 1.4rem;
    }
}
.u-showcase-block .block-info .info-txt .txt-desc
{
    font-size: 28.8px;
    font-size: 1.8rem; 
    line-height: 2;

    margin-top: 40px;
}
@media screen and (min-width: 0) and (max-width: 568px)
{
    .u-showcase-block .block-info .info-txt .txt-desc
    {
        font-size: 1.4rem; 

        margin-top: 15px;
    }
}
.u-showcase-block .block-info .info-txt > *:first-child
{
    margin-top: 0;
}
@media screen and (min-width: 0) and (max-width: 568px)
{
    .u-showcase-block .block-info .info-img
    {
        margin: 0 15px;
        margin-top: 15px;
    }
}
.u-showcase-block .block-info .info-img img
{
    max-width: 100%;
    height: auto;
}
.u-showcase-block .block-info .info-img .img-first
{
    margin-top: -40px;
}
@media screen and (min-width: 0) and (max-width: 568px)
{
    .u-showcase-block .block-info .info-img .img-first
    {
        margin-top: 0;
    }
}
.u-showcase-block .block-info .info-img .img-second
{
    margin-top: 80px;
    margin-left: 60px;
}
@media screen and (min-width: 0) and (max-width: 568px)
{
    .u-showcase-block .block-info .info-img .img-second
    {
        margin-top: 10px;
        margin-left: 0;
    }
}
@media screen and (min-width: 0) and (max-width: 568px)
{
    .u-showcase-block .block-info .info-img.img-showcase01
    {
        margin-top: 20px;
    }
}
.u-showcase-block .block-info .info-img.img-showcase01 .img-first
{
    position: relative;
    z-index: 1;

    margin-top: 0;
}
@media screen and (min-width: 0) and (max-width: 568px)
{
    .u-showcase-block .block-info .info-img.img-showcase01 .img-first img
    {
        width: 60%;
        height: auto;
    }
}
.u-showcase-block .block-info .info-img.img-showcase01 .img-second
{
    position: relative;
    z-index: 0; 

    width: 300px;
    margin-top: -420px;
    margin-left: 250px;
}
@media screen and (min-width: 0) and (max-width: 568px)
{
    .u-showcase-block .block-info .info-img.img-showcase01 .img-second
    {
        width: auto;
        margin-top: -75%;
        margin-left: 45%;
    }
}
.u-showcase-block .block-info .info-img.img-showcase01-02
{
    margin-left: -60px;
}
@media screen and (min-width: 0) and (max-width: 568px)
{
    .u-showcase-block .block-info .info-img.img-showcase01-02
    {
        margin: 0 15px;
        margin-bottom: 30%;
    }
}
.u-showcase-block .block-info .info-img.img-showcase01-02 .img-first
{
    position: relative;
    z-index: 1; 

    margin-top: 0;
}
@media screen and (min-width: 0) and (max-width: 568px)
{
    .u-showcase-block .block-info .info-img.img-showcase01-02 .img-first
    {
        margin-top: 30px;
    }
    .u-showcase-block .block-info .info-img.img-showcase01-02 .img-first img
    {
        width: 60%;
        height: auto;
    }
}
.u-showcase-block .block-info .info-img.img-showcase01-02 .img-second
{
    position: relative;
    z-index: 0; 

    width: 300px;
    margin-top: -370px;
    margin-left: 250px;
}
@media screen and (min-width: 0) and (max-width: 568px)
{
    .u-showcase-block .block-info .info-img.img-showcase01-02 .img-second
    {
        width: auto;
        margin-top: -106%;
        margin-left: 46%;
    }
}
.u-showcase-block .block-info + .block-ttl
{
    margin-top: 80px;
}
@media screen and (min-width: 0) and (max-width: 568px)
{
    .u-showcase-block .block-info + .block-ttl
    {
        margin-top: 40px;
    }
}
.u-showcase-block .block-floor .floor-note
{
    margin-bottom: 40px;

    text-align: left;
}
@media screen and (min-width: 0) and (max-width: 568px)
{
    .u-showcase-block .block-floor .floor-note
    {
        font-size: 1.4rem;
    }
}
.u-showcase-block .block-floor .floor-note .note-glay
{
    color: #a0a0a0;
}
.u-showcase-block .block-floor
{
    width: 1024px;
    margin: 0 auto;
    margin-top: 70px;

    text-align: center;
}
@media screen and (min-width: 0) and (max-width: 568px)
{
    .u-showcase-block .block-floor
    {
        width: auto;
        margin-top: 40px; 
        margin-right: 15px;
        margin-left: 15px;
    }
}
.u-showcase-block .block-floor .floor-content
{
    position: relative;

    display: inline-block;

    margin: 0 auto;

    text-align: center;
}
.u-showcase-block .block-floor .floor-content .content-bg img
{
    max-width: 100%;
    height: auto;
}
.u-showcase-block .block-floor .floor-content .content-list .list-item
{
    position: absolute;
    top: 50%;
    left: 50%;

    margin-top: 20px;
    margin-left: 20px;
}
@media screen and (min-width: 0) and (max-width: 568px)
{
    .u-showcase-block .block-floor .floor-content .content-list .list-item
    {
        margin-top: 15px;
        margin-left: 15px;
    }
}
.u-showcase-block .block-floor .floor-content .content-list .list-item .item-num
{
    font-family: 'Montserrat', sans-serif; 
    line-height: 40px;

    z-index: 1;

    display: block;

    width: 40px;
    height: 40px;

    -webkit-transform: translate(-50%, -50%);
        -ms-transform: translate(-50%, -50%);
            transform: translate(-50%, -50%);
    text-align: center;
    vertical-align: middle;

    color: #fff;
}
@media screen and (min-width: 0) and (max-width: 568px)
{
    .u-showcase-block .block-floor .floor-content .content-list .list-item .item-num
    {
        line-height: 30px; 

        width: 30px;
        height: 30px;
    }
}
.u-showcase-block .block-floor .floor-content .content-list .list-item .item-num:before
{
    line-height: 40px;

    position: absolute;
    z-index: -1;
    top: 50%;
    left: 50%;

    width: 40px;
    height: 40px;

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

    border-radius: 50%;
    background: #626262;

    -webkit-backface-visibility: hidden;
            backface-visibility: hidden;
}
@media screen and (min-width: 0) and (max-width: 568px)
{
    .u-showcase-block .block-floor .floor-content .content-list .list-item .item-num:before
    {
        line-height: 30px; 

        width: 30px;
        height: 30px;
    }
}
.u-showcase-block .block-floor .floor-content .content-list .list-item .item-num[data-js-popup]
{
    cursor: pointer;
}
.u-showcase-block .block-floor .floor-content .content-list .list-item .item-num[data-js-popup]:before
{
    background: #0d3275;
}
.u-showcase-block .block-floor .floor-content .content-list .list-item .item-num[data-js-popup]:after
{
    position: absolute;
    z-index: -1;
    top: 50%;
    left: 50%;

    width: 40px;
    height: 40px;

    content: '';
    -webkit-transition: all .3s ease;
            transition: all .3s ease;
    -webkit-transform: translate(-50%, -50%);
        -ms-transform: translate(-50%, -50%);
            transform: translate(-50%, -50%);
    -webkit-animation: pulsate 1s ease-out;
            animation: pulsate 1s ease-out;
    /* スピードなど */
    -webkit-animation-iteration-count: infinite;
            animation-iteration-count: infinite; 

    border-radius: 50%;
    background: #0d3275;

    -webkit-backface-visibility: hidden;
            backface-visibility: hidden;
}
@media screen and (min-width: 0) and (max-width: 568px)
{
    .u-showcase-block .block-floor .floor-content .content-list .list-item .item-num[data-js-popup]:after
    {
        width: 30px;
        height: 30px;

        -webkit-animation: pulsate-sp 1s ease-out;
                animation: pulsate-sp 1s ease-out;
        /* スピードなど */
        -webkit-animation-iteration-count: infinite;
                animation-iteration-count: infinite;

        opacity: 0;

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

@-webkit-keyframes pulsate
{
    0%
    {
        width: 40px;
        height: 40px;

        opacity: .0;

        -ms-filter: 'progid:DXImageTransform.Microsoft.Alpha(Opacity=0)';
    }
    10%
    {
        width: 40px;
        height: 40px;

        opacity: 1;

        -ms-filter: 'progid:DXImageTransform.Microsoft.Alpha(Opacity=100)';
    }
    90%
    {
        width: 60px;
        height: 60px;

        opacity: .0;

        -ms-filter: 'progid:DXImageTransform.Microsoft.Alpha(Opacity=0)';
    }
    100%
    {
        width: 40px;
        height: 40px;

        opacity: .0;

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

@keyframes pulsate
{
    0%
    {
        width: 40px;
        height: 40px;

        opacity: .0;

        -ms-filter: 'progid:DXImageTransform.Microsoft.Alpha(Opacity=0)';
    }
    10%
    {
        width: 40px;
        height: 40px;

        opacity: 1;

        -ms-filter: 'progid:DXImageTransform.Microsoft.Alpha(Opacity=100)';
    }
    90%
    {
        width: 60px;
        height: 60px;

        opacity: .0;

        -ms-filter: 'progid:DXImageTransform.Microsoft.Alpha(Opacity=0)';
    }
    100%
    {
        width: 40px;
        height: 40px;

        opacity: .0;

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

@-webkit-keyframes pulsate-sp
{
    0%
    {
        width: 30px;
        height: 30px;

        opacity: .0;

        -ms-filter: 'progid:DXImageTransform.Microsoft.Alpha(Opacity=0)';
    }
    10%
    {
        width: 30px;
        height: 30px;

        opacity: 1;

        -ms-filter: 'progid:DXImageTransform.Microsoft.Alpha(Opacity=100)';
    }
    90%
    {
        width: 45px;
        height: 45px;

        opacity: .0;

        -ms-filter: 'progid:DXImageTransform.Microsoft.Alpha(Opacity=0)';
    }
    100%
    {
        width: 30px;
        height: 30px;

        opacity: .0;

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

@keyframes pulsate-sp
{
    0%
    {
        width: 30px;
        height: 30px;

        opacity: .0;

        -ms-filter: 'progid:DXImageTransform.Microsoft.Alpha(Opacity=0)';
    }
    10%
    {
        width: 30px;
        height: 30px;

        opacity: 1;

        -ms-filter: 'progid:DXImageTransform.Microsoft.Alpha(Opacity=100)';
    }
    90%
    {
        width: 45px;
        height: 45px;

        opacity: .0;

        -ms-filter: 'progid:DXImageTransform.Microsoft.Alpha(Opacity=0)';
    }
    100%
    {
        width: 30px;
        height: 30px;

        opacity: .0;

        -ms-filter: 'progid:DXImageTransform.Microsoft.Alpha(Opacity=0)';
    }
}
@media screen and (min-width: 1024px)
{
    .u-showcase-block .block-floor .floor-content .content-list .list-item .item-num[data-js-popup]:hover:before,
    .u-showcase-block .block-floor .floor-content .content-list .list-item .item-num[data-js-popup].is-active:before
    {
        width: 50px;
        height: 50px;
    }
    .u-showcase-block .block-floor .floor-content .content-list .list-item .item-num[data-js-popup]:hover:after,
    .u-showcase-block .block-floor .floor-content .content-list .list-item .item-num[data-js-popup].is-active:after
    {
        -webkit-animation: none;
                animation: none;
    }
}
.u-showcase-block .block-floor .floor-content .content-list.list-plan1 > .list-item.item-1
{
    top: 51%;
    left: 89.3%;
}
.u-showcase-block .block-floor .floor-content .content-list.list-plan1 > .list-item.item-2
{
    top: 62%;
    left: 80%;
}
.u-showcase-block .block-floor .floor-content .content-list.list-plan1 > .list-item.item-3
{
    top: 45%;
    left: 76%;
}
.u-showcase-block .block-floor .floor-content .content-list.list-plan1 > .list-item.item-4
{
    top: 24%;
    left: 25%;
}
.u-showcase-block .block-floor .floor-content .content-list.list-plan1 > .list-item.item-5
{
    top: 16%;
    left: 16%;
}
.u-showcase-block .block-floor .floor-content .content-list.list-plan2 > .list-item.item-1
{
    top: 76%;
    left: 43%;
}
@media screen and (min-width: 0) and (max-width: 568px)
{
    .u-showcase-block .block-floor .floor-content .content-list.list-plan2 > .list-item.item-1
    {
        top: 75%;
        left: 41%;
    }
}
.u-showcase-block .block-floor .floor-content .content-list.list-plan2 > .list-item.item-2
{
    top: 57%;
    left: 81%;
}
@media screen and (min-width: 0) and (max-width: 568px)
{
    .u-showcase-block .block-floor .floor-content .content-list.list-plan2 > .list-item.item-2
    {
        top: 55%;
        left: 80%;
    }
}
.u-showcase-block .block-floor .floor-content .content-list.list-plan2 > .list-item.item-3
{
    top: 33%;
    left: 51%;
}
@media screen and (min-width: 0) and (max-width: 568px)
{
    .u-showcase-block .block-floor .floor-content .content-list.list-plan2 > .list-item.item-3
    {
        top: 32%;
        left: 50%;
    }
}
.u-showcase-block .block-floor .floor-content .content-list.list-plan2 > .list-item.item-4
{
    top: 78%;
    left: 74%;
}
@media screen and (min-width: 0) and (max-width: 568px)
{
    .u-showcase-block .block-floor .floor-content .content-list.list-plan2 > .list-item.item-4
    {
        top: 76%;
        left: 70%;
    }
}
.u-showcase-block .block-floor .floor-content .content-list.list-plan3 > .list-item.item-1
{
    top: 72%;
    left: 41%;
}
@media screen and (min-width: 0) and (max-width: 568px)
{
    .u-showcase-block .block-floor .floor-content .content-list.list-plan3 > .list-item.item-1
    {
        top: 69%;
        left: 39%;
    }
}
.u-showcase-block .block-floor .floor-content .content-list.list-plan3 > .list-item.item-2
{
    top: 57%;
    left: 64%;
}
@media screen and (min-width: 0) and (max-width: 568px)
{
    .u-showcase-block .block-floor .floor-content .content-list.list-plan3 > .list-item.item-2
    {
        top: 55%;
    }
}
.u-showcase-block .block-floor .floor-content .content-list.list-plan3 > .list-item.item-3
{
    top: 15%;
    left: 69%;
}
@media screen and (min-width: 0) and (max-width: 568px)
{
    .u-showcase-block .block-floor .floor-content .content-list.list-plan3 > .list-item.item-3
    {
        top: 10%;
    }
}
.u-showcase-block .block-floor .floor-content .content-list.list-plan3 > .list-item.item-4
{
    top: 80%;
    left: 84%;
}
@media screen and (min-width: 0) and (max-width: 568px)
{
    .u-showcase-block .block-floor .floor-content .content-list.list-plan3 > .list-item.item-4
    {
        top: 77%;
        left: 82%;
    }
}
.u-showcase-block .block-floor .floor-content .content-list.list-plan4 > .list-item.item-1
{
    top: 31%;
    left: 37%;
}
@media screen and (min-width: 0) and (max-width: 568px)
{
    .u-showcase-block .block-floor .floor-content .content-list.list-plan4 > .list-item.item-1
    {
        top: 30%;
    }
}
.u-showcase-block .block-floor .floor-content .content-list.list-plan4 > .list-item.item-2
{
    top: 56%;
    left: 42%;
}
@media screen and (min-width: 0) and (max-width: 568px)
{
    .u-showcase-block .block-floor .floor-content .content-list.list-plan4 > .list-item.item-2
    {
        top: 53%;
        left: 41%;
    }
}
.u-showcase-block .block-floor .floor-content .content-list.list-plan4 > .list-item.item-3
{
    top: 31.5%;
    left: 68%;
}
@media screen and (min-width: 0) and (max-width: 568px)
{
    .u-showcase-block .block-floor .floor-content .content-list.list-plan4 > .list-item.item-3
    {
        top: 29%;
    }
}
.u-showcase-block .block-floor .floor-content .content-list.list-plan4 > .list-item.item-4
{
    top: 49%;
    left: 66%;
}
@media screen and (min-width: 0) and (max-width: 568px)
{
    .u-showcase-block .block-floor .floor-content .content-list.list-plan4 > .list-item.item-4
    {
        top: 47%;
    }
}

.u-shoecase-list
{
    position: relative;

    background: #000; 

    *zoom: 1;
}
.u-shoecase-list:after
{
    display: table;
    clear: both; 

    content: ' ';
}
.u-shoecase-list:before
{
    position: absolute;
    z-index: 2;
    top: 0;
    left: 0;

    width: 100%;
    height: 100%;

    content: '';
    -webkit-transition: opacity .5s ease;
            transition: opacity .5s ease; 

    opacity: .5;
    background: #000;

    -ms-filter: 'progid:DXImageTransform.Microsoft.Alpha(Opacity=50)';
}
.u-shoecase-list .list-bg
{
    position: absolute;
    z-index: 1;
    top: 0;
    left: 0;

    width: 100%;
    height: 100%;

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

    opacity: 0;
    background-position: center;
    background-size: cover;

    -ms-filter: 'progid:DXImageTransform.Microsoft.Alpha(Opacity=0)';
}
.u-shoecase-list .list-line
{
    position: absolute;
    z-index: 3;
    top: 0;
    left: 0;

    width: 100%;
    height: 100%;

    -webkit-transition: opacity .3s ease;
            transition: opacity .3s ease; 
    pointer-events: none;
}
.u-shoecase-list .list-line:before,
.u-shoecase-list .list-line:after
{
    position: absolute;
    top: 0;

    width: 1px;
    height: 100%;

    content: '';

    background: #a0a0a0;
}
@media screen and (min-width: 0) and (max-width: 568px)
{
    .u-shoecase-list .list-line:before,
    .u-shoecase-list .list-line:after
    {
        width: 100%;
        height: 1px;
    }
}
.u-shoecase-list .list-line:before
{
    left: 33.333%;
}
@media screen and (min-width: 0) and (max-width: 568px)
{
    .u-shoecase-list .list-line:before
    {
        top: 33.333%;
        left: 0;
    }
}
.u-shoecase-list .list-line:after
{
    left: 66.666%;
}
@media screen and (min-width: 0) and (max-width: 568px)
{
    .u-shoecase-list .list-line:after
    {
        top: 66.666%;
        left: 0;
    }
}
.u-shoecase-list > .list-item
{
    position: relative;

    float: left;

    width: 33.333%;
    height: 365px;

    background-position: center; 
    background-size: cover;
}
@media screen and (min-width: 0) and (max-width: 568px)
{
    .u-shoecase-list > .list-item
    {
        float: none;

        width: 100%;
        height: 120px;
    }
}
.u-shoecase-list > .list-item a
{
    font-size: 70.4px;
    font-size: 4.4rem;
    line-height: 1.56;

    position: absolute;
    z-index: 3; 
    top: 0;
    left: 0;

    display: block;

    width: 100%;
    height: 100%;

    text-align: center;

    color: #fff;
}
@media screen and (min-width: 0) and (max-width: 568px)
{
    .u-shoecase-list > .list-item a
    {
        font-size: 2.6rem;
    }
}
.u-shoecase-list > .list-item a span
{
    position: absolute;
    z-index: 3;
    top: 50%;
    left: 50%;

    width: 90%;

    -webkit-transition: all .5s ease;
            transition: all .5s ease; 
    -webkit-transform: translate(-50%, -50%);
        -ms-transform: translate(-50%, -50%);
            transform: translate(-50%, -50%);
    text-align: center;
}
.u-shoecase-list > .list-item a.is-hidden span
{
    opacity: .5;

    -ms-filter: 'progid:DXImageTransform.Microsoft.Alpha(Opacity=50)';
}
.u-shoecase-list.is-hover:before
{
    opacity: 0;

    -ms-filter: 'progid:DXImageTransform.Microsoft.Alpha(Opacity=0)';
}
.u-shoecase-list.is-hover .list-bg
{
    opacity: 1;

    -ms-filter: 'progid:DXImageTransform.Microsoft.Alpha(Opacity=100)';
}
.u-shoecase-list.is-active > .list-line
{
    opacity: 0;

    -ms-filter: 'progid:DXImageTransform.Microsoft.Alpha(Opacity=0)';
}
.u-shoecase-list.is-active > .list-item a
{
    -webkit-transition: opacity .5s ease;
            transition: opacity .5s ease; 

    opacity: 0;

    -ms-filter: 'progid:DXImageTransform.Microsoft.Alpha(Opacity=0)';
}
@media screen and (min-width: 0) and (max-width: 568px)
{
    .u-shoecase-list.is-active
    {
        background: none;
    }
    .u-shoecase-list.is-active:before
    {
        opacity: 0;

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

.u-popup
{
    position: fixed;
    z-index: 9999; 
    top: 0;
    left: 0;

    display: none;

    width: 100%;
    height: 100%;
}
.u-popup .popup-bg
{
    position: fixed;
    top: 0;
    left: 0;

    width: 100%;
    height: 100%;

    opacity: .5;
    background: #000;

    -ms-filter: 'progid:DXImageTransform.Microsoft.Alpha(Opacity=50)';
}
.u-popup .popup-box
{
    position: absolute;
    top: 50%;
    left: 50%;

    display: none;

    width: 1024px;

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

    background: #fff;
}
@media screen and (min-width: 0) and (max-width: 568px)
{
    .u-popup .popup-box
    {
        width: 90%;
    }
}
.u-popup .popup-box .box-head
{
    position: relative;

    background: #0d3275;
}
.u-popup .popup-box .box-head .head-ttl
{
    font-size: 38.4px;
    font-size: 2.4rem;
    font-weight: bold;

    width: 943px;
    padding: 9px;

    text-align: center; 

    color: #fff;
}
@media screen and (min-width: 0) and (max-width: 568px)
{
    .u-popup .popup-box .box-head .head-ttl
    {
        font-size: 1.8rem;

        width: calc( 100% - 60px);
    }
}
.u-popup .popup-box .box-head .head-ttl span
{
    font-family: 'Montserrat', sans-serif;
    font-size: 57.6px;
    font-size: 3.6rem; 
    font-weight: normal;
}
@media screen and (min-width: 0) and (max-width: 568px)
{
    .u-popup .popup-box .box-head .head-ttl span
    {
        font-size: 2.4rem;
    }
}
.u-popup .popup-box .box-head .head-close
{
    position: absolute;
    top: 0;
    right: 0;

    width: 81px;
    height: 100%;

    cursor: pointer;
    -webkit-transition: all .3s ease;
            transition: all .3s ease; 

    border-left: 1px solid #fff;
    background: #0d3275;
}
@media screen and (min-width: 0) and (max-width: 568px)
{
    .u-popup .popup-box .box-head .head-close
    {
        width: 60px;
    }
}
.u-popup .popup-box .box-head .head-close:hover
{
    background: #072252;
}
.u-popup .popup-box .box-head .head-close img
{
    position: absolute;
    top: 50%;
    left: 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)
{
    .u-popup .popup-box .box-head .head-close img
    {
        width: 18px;
        height: auto;
    }
}
.u-popup .popup-box .box-content
{
    position: relative;

    overflow: hidden;

    max-height: 70vh;
    padding: 40px; 

    *zoom: 1;
}
.u-popup .popup-box .box-content:after
{
    display: table;
    clear: both; 

    content: ' ';
}
@media screen and (min-width: 0) and (max-width: 568px)
{
    .u-popup .popup-box .box-content
    {
        overflow: auto; 

        padding: 30px 15px;
    }
}
.u-popup .popup-box .box-content .content-img
{
    position: absolute;
    top: 50%;
    left: 40px;

    width: 356px;

    -webkit-transform: translateY(-50%);
        -ms-transform: translateY(-50%);
            transform: translateY(-50%);
}
@media screen and (min-width: 0) and (max-width: 568px)
{
    .u-popup .popup-box .box-content .content-img
    {
        display: none;
    }
}
.u-popup .popup-box .box-content .content-img img
{
    width: 100%;
    height: auto;
}
.u-popup .popup-box .box-content .content-right
{
    float: right;
    overflow: auto; 

    width: 555px;
    max-height: calc( 70vh - 80px);
}
@media screen and (min-width: 0) and (max-width: 568px)
{
    .u-popup .popup-box .box-content .content-right
    {
        float: none; 

        width: auto;
        max-height: 100%;
    }
}
.u-popup .popup-box .box-content .content-list
{
    padding-bottom: 20px;
}
@media screen and (min-width: 0) and (max-width: 568px)
{
    .u-popup .popup-box .box-content .content-list
    {
        float: none;

        width: auto;
        padding-bottom: 0; 
        padding-left: 0;
    }
}
.u-popup .popup-box .box-content .content-list > li
{
    margin-top: 80px; 

    *zoom: 1;
}
.u-popup .popup-box .box-content .content-list > li:after
{
    display: table;
    clear: both; 

    content: ' ';
}
@media screen and (min-width: 0) and (max-width: 568px)
{
    .u-popup .popup-box .box-content .content-list > li
    {
        margin-top: 40px;
    }
}
.u-popup .popup-box .box-content .content-list > li:first-child
{
    margin-top: 0;
}
.u-popup .popup-box .box-content .content-list > li .list-img
{
    float: left;

    width: 288px;
}
@media screen and (min-width: 0) and (max-width: 568px)
{
    .u-popup .popup-box .box-content .content-list > li .list-img
    {
        float: none;

        width: auto;
    }
}
.u-popup .popup-box .box-content .content-list > li .list-img img
{
    width: 100%;
    height: auto;
}
.u-popup .popup-box .box-content .content-list > li .list-info
{
    float: left;

    width: 248px;
    padding-left: 25px;
}
@media screen and (min-width: 0) and (max-width: 568px)
{
    .u-popup .popup-box .box-content .content-list > li .list-info
    {
        float: none;

        width: auto;
        margin-top: 15px;
        padding-left: 0;
    }
}
.u-popup .popup-box .box-content .content-list > li .list-info .info-cat
{
    font-size: 28.8px;
    font-size: 1.8rem;
}
@media screen and (min-width: 0) and (max-width: 568px)
{
    .u-popup .popup-box .box-content .content-list > li .list-info .info-cat
    {
        font-size: 1.4rem;
    }
}
.u-popup .popup-box .box-content .content-list > li .list-info .info-ttl
{
    font-size: 28.8px;
    font-size: 1.8rem;
}
@media screen and (min-width: 0) and (max-width: 568px)
{
    .u-popup .popup-box .box-content .content-list > li .list-info .info-ttl
    {
        font-size: 1.4rem;
    }
}
.u-popup .popup-box .box-content .content-list > li .list-info .m-btn-common
{
    font-size: 25.6px;
    font-size: 1.6rem; 

    text-align: left;
}
@media screen and (min-width: 0) and (max-width: 568px)
{
    .u-popup .popup-box .box-content .content-list > li .list-info .m-btn-common
    {
        font-size: 1.2rem;
    }
}
.u-popup .popup-box .box-content .content-list > li .list-info .m-btn-common a
{
    width: 200px;
}
@media screen and (min-width: 0) and (max-width: 568px)
{
    .u-popup .popup-box .box-content .content-list > li .list-info .m-btn-common a
    {
        width: 100%;
    }
}