@charset 'UTF-8';


.page-feature
{
    font-family: sans-serif;
    width: 100%;
    height: auto;
    min-height: 100vh;
    background: url(../img/bg_back.png) no-repeat top/100% auto;
    background-position: 0 0;
    background-size: 100% auto;
    background-repeat: repeat-x;
    --base-font-size: 100px;
}

.page-feature .template
{
    position: relative;
}

.page-feature .feature-header
{
    height: 100%;
    width: 100%;
    position: relative;
}

.page-feature .feature-header .title-character
{
    height: 100%;
    width: 100%;
    position: relative;
    z-index: -5;
}

.page-feature .feature-header .titlechara-movie
{
    height: 100%;
    width: 100%;
}

.page-feature .feature-header .logo
{
    height: 30%;
    width: 25%;
    position: absolute;
    inset: 0;
}

.page-feature .feature-header .titlelogo-img
{
    height: 100%;
    width: 100%;
}



.page-feature .feature-header .downloadframe-img
{
    height: 80%;
    width: 100%;
}

.page-feature .feature-header .download-info
{
    height: 100%;
    width: 100%;
    position: absolute;
    margin: 0 auto;
    border: 0;
    padding: 0;
    inset: 0;
}

.page-feature .btn-regist-area
{
    height: 100%;
    width: 100%;
    position: relative;
    padding: 0 0 5% 0;
    z-index: 30;
}

.page-feature .btn-regist-btn
{
    height: 100%;
    display: flex;


}

.page-feature .feature-header .txt-img
{
    position: relative;
}

.page-feature .ntg-btn-registration
{
    height: 30%;
    width: 40%;
    background-color: #d8d8d800;
    margin: 0;
    border: 0;
    padding: 0;
    position: relative;
    cursor : pointer;
}

.page-feature .ntg-btn-registration2
{
    height: 30%;
    width: 35%;
    background-color: #d8d8d800;
    margin: 0;
    border: 0;
    padding: 0;
    position: relative;
    cursor : pointer;
}
.page-feature .ntg-btn
{
    height: 100%;
    width: 100%;
    position: relative;
}

.page-feature .ntg-btn-img
{
    height: 100%;
    width: 100%;
    background-color: #d8d8d800;
}

.page-feature .feature-contents
{
    height: auto;
    width: 100%;
    position: relative;
}

.page-feature .feature-contents .slide-2
{
    height: auto;
    width: 100%;
    position: relative;
    overflow: visible;
}

.page-feature .feature-contents .slide-2 .slide-title
{
    height: 40%;
    width: 40%;
    position: relative;
    margin: 2% auto;
    border: 0;
    padding: 0;
    justify-content: center;
}

.page-feature .feature-contents .slide-2 .pretitle-img
{
    height: 100%;
    width: 100%;
}

.page-feature .feature-contents .slide-2 .slide-2-content
{
    width: 100%;
    position: relative;
    margin: 0 auto;
    margin: -18% 0 0 0;
}

.page-feature .feature-contents .slide-2 .frame
{
    height: 75%;
    width: 75%;
    position: relative;
    margin: 0 auto;
    border: 0;
    padding: 0;
    background-position: center center;
    background-repeat: no-repeat;
    display: flex;
    justify-content: center;
}

.page-feature .feature-header .download-container
{
    height: 35%;
    width: 40%;
    position: absolute;
    margin: 0 auto;
    border: 0;
    padding: 0;
    inset: 60% 0 0 0;
}

.page-feature .feature-footer .download-container
{
    height: 35%;
    width: 40%;
    position: relative;
    margin: 0 auto;
    border: 0;
    padding-top: 10%;
    inset: 60% 0 0 0;
}

.page-feature .feature-contents .slide-2 .stair-container
{
    height: 100%;
    width: 100%;
    
    position: absolute;
    inset: 0;
}

.page-feature .feature-contents .slide-2 .stair-list
{
    height: 35%;
    width: 21%;
    position: absolute;
    flex-direction: column;
    display: flex;
    margin: 26% 37%;
}

.page-feature .feature-contents .slide-2 .stair1
{
    margin: 0 0%;
    height: 100%;
    width: 100%;
}

.page-feature .feature-contents .slide-2 .stair2
{
    margin: 0 8%;
    height: 100%;
    width: 100%;
}

.page-feature .feature-contents .slide-2 .stair3
{
    margin: 0 16%;
    height: 100%;
    width: 100%;
}

.page-feature .feature-contents .slide-2 .stair4
{
    margin: 0 24%;
    height: 160%;
    width: 160%;
}

.page-feature .feature-contents .slide-2 .pre-img
{
    height: 37%;
    width: 30%;
    position: absolute;
    margin: 25% 58%;
}

.page-feature .feature-contents .slide-3
{
    width: 100%;
    height: auto;
    position: relative;
    overflow: visible;
}

.page-feature .feature-contents .slide-3 .hero-container
{
    height: 100%;
    width: 100%;
    position: relative;
}

.page-feature .feature-contents .slide-3 .slide-title
{
    height: 35%;
    width: 35%;
    position: relative;
    margin: 0 auto;
    border: 0;
    padding: 0;
    background-position: center center;
    background-repeat: no-repeat;
    display: flex;
    justify-content: center;
    align-items: center;
}

.page-feature .feature-contents .slide-3 .herotitle-img
{
    height: 100%;
    width: 100%;
}

.page-feature .feature-contents .slide-3 .hero-info
{
    height: 100%;
    width: 100%;
    position: relative;
    margin: 0 auto;
    border: 0;
    padding: 0;
}

.page-feature .feature-contents .slide-3 .hero-frame
{
    height: 40%;
    width: 40%;
    position: relative;
    margin: 0 auto;
    border: 0;
    padding: 0;
    background-position: center center;
    background-repeat: no-repeat;
    display: flex;
    justify-content: center;
    align-items: center;
}

.page-feature .feature-contents .slide-3 .heroframe-img
{
    height: 100%;
    width: 100%;
}

.page-feature .feature-contents .slide-3 .bx-pager
{
    position: absolute;
    height: 90%;
    width: 100%;
    margin: 1.2% 0 0 0.5%;
    display: flex;
    justify-content: space-around;
    align-items: center;
}

.page-feature .feature-contents .slide-3 a
{
    height: 100%;
    width: 100%;
    z-index: 3;
}

.page-feature .feature-contents .slide-3 .heroicon1
{
    position: relative;
    height: 90%;
    width: 90%;
}

.page-feature .feature-contents .slide-3 .heroiconimg1
{
    position: relative;
    height: 100%;
    width: 100%;
}

.page-feature .feature-contents .slide-3 .icon-effect1
{
    position: absolute;
    height: 140%;
    width: 140%;
    margin: -22% -119%;
    z-index: 1;
}

.page-feature .feature-contents .slide-3 .heroicon2
{
    position: relative;
    height: 90%;
    width: 90%;
}

.page-feature .feature-contents .slide-3 .heroiconimg2
{
    position: relative;
    height: 100%;
    width: 100%;
}

.page-feature .feature-contents .slide-3 .icon-effect2
{
    position: absolute;
    height: 140%;
    width: 140%;
    margin: -22% -119%;
    z-index: 1;
}

.page-feature .feature-contents .slide-3 .heroicon3
{
    position: relative;
    height: 90%;
    width: 90%;
}

.page-feature .feature-contents .slide-3 .heroiconimg3
{
    position: relative;
    height: 100%;
    width: 100%;
}

.page-feature .feature-contents .slide-3 .icon-effect3
{
    position: absolute;
    height: 140%;
    width: 140%;
    margin: -22% -119%;
    z-index: 1;
}

.page-feature .feature-contents .slide-3 .heroicon4
{
    position: relative;
    height: 90%;
    width: 90%;
}

.page-feature .feature-contents .slide-3 .heroiconimg4
{
    position: relative;
    height: 100%;
    width: 100%;
}

.page-feature .feature-contents .slide-3 .icon-effect4
{
    position: absolute;
    height: 140%;
    width: 140%;
    margin: -22% -119%;
    z-index: 1;
}

.page-feature .feature-contents .slide-3 .heroicon5
{
    position: relative;
    height: 90%;
    width: 90%;
}

.page-feature .feature-contents .slide-3 .heroiconimg5
{
    position: relative;
    height: 100%;
    width: 100%;
}

.page-feature .feature-contents .slide-3 .icon-effect5
{
    position: absolute;
    height: 140%;
    width: 140%;
    margin: -22% -119%;
    z-index: 1;
}

.page-feature .feature-contents .slide-3 .heroicon6
{
    position: relative;
    height: 90%;
    width: 90%;
}

.page-feature .feature-contents .slide-3 .heroiconimg6
{
    position: relative;
    height: 100%;
    width: 100%;
}

.page-feature .feature-contents .slide-3 .icon-effect6
{
    position: absolute;
    height: 140%;
    width: 140%;
    margin: -22% -119%;
    z-index: 1;
}

.page-feature .feature-contents .slide-3 .heroicon7
{
    position: relative;
    height: 90%;
    width: 90%;
}

.page-feature .feature-contents .slide-3 .heroiconimg7
{
    position: relative;
    height: 100%;
    width: 100%;
}

.page-feature .feature-contents .slide-3 .icon-effect7
{
    position: absolute;
    height: 140%;
    width: 140%;
    margin: -22% -119%;
    z-index: 1;
}

.page-feature .feature-contents .slide-3 .heroicon8
{
    position: relative;
    height: 90%;
    width: 90%;
}

.page-feature .feature-contents .slide-3 .heroiconimg8
{
    position: relative;
    height: 100%;
    width: 100%;
}

.page-feature .feature-contents .slide-3 .icon-effect8
{
    position: absolute;
    height: 140%;
    width: 140%;
    margin: -22% -119%;
    z-index: 1;
}

.page-feature .feature-contents .slide-3 .heroicon9
{
    position: relative;
    height: 90%;
    width: 90%;
}

.page-feature .feature-contents .slide-3 .heroiconimg9
{
    position: relative;
    height: 100%;
    width: 100%;
}

.page-feature .feature-contents .slide-3 .icon-effect9
{
    position: absolute;
    height: 140%;
    width: 140%;
    margin: -22% -119%;
    z-index: 1;
}

.page-feature .feature-contents .slide-3 .herocover1
{
    height: 35%;
    width: 35%;
    position: relative;
    inset: 0;
    margin: 0;
    border: 0;
    padding: 0;
    visibility: hidden;
}

.page-feature .feature-contents .slide-3 .bx-wrapper
{
    height: 100%;
    width: 100%;
    position: absolute;
    inset: 0;
    margin: 0;
    border: 0;
    padding: 0;
    z-index: 0;
}

.page-feature .feature-contents .slide-3 .bx-viewport
{
    height: 100%;
    width: 100%;
    background-color: #d8d8d800;
    position: relative;
    margin: 0;
    border: 0;
    padding: 0;
    box-shadow: none;
}

.page-feature .feature-contents .slide-3 .bx-loading
{
    height: 0;
    width: 0;
}

.page-feature .feature-contents .slide-3 .bxslider
{
    height: 100%;
    width: 100%;
    position: relative;
    margin: 0;
    border: 0;
    padding: 0;
}

.page-feature .feature-contents .slide-3 .hero1
{
    height: 100%;
    position: absolute;
    inset: 0 20%;
}

.page-feature .feature-contents .slide-3 .hero1 .frame
{
    height: 100%;
    width: auto;
    inset: 0;
    margin: 0;
    border: 0;
    padding: 0;
    position: relative;
}

.page-feature .feature-contents .slide-3 .hero1 .name-frame
{
    height: 40%;
    width: auto;
    inset: 0;
    margin: 0;
    border: 0;
    padding: 0;
    position: absolute;
}

.page-feature .feature-contents .slide-3 .hero1 .name-img
{
    height: 40%;
    width: auto;
    inset: 0;
    margin: 0;
    border: 0;
    padding: 0;
    position: absolute;
    z-index: 8;
}

.page-feature .feature-contents .slide-3 .hero1 .type
{
    height: 40%;
    width: auto;
    inset: 0;
    margin: 0;
    border: 0;
    padding: 0;
    position: absolute;
}

.page-feature .feature-contents .slide-3 .hero1 .herodesc-img
{
    height: 80%;
    width: auto;
    inset: 0;
    margin: 0;
    border: 0;
    padding: 0;
    position: absolute;
}

.page-feature .feature-contents .slide-3 .hero1 .herocover
{
    height: 105%;
    width: auto;
    max-width: none;
    inset: 0;
    margin: 0;
    border: 0;
    padding: 0;
    position: absolute;
}

.page-feature .feature-contents .slide-3 .hero2
{
    height: 100%;
    position: absolute;
    inset: 0 20%;
}

.page-feature .feature-contents .slide-3 .hero2 .frame
{
    height: 100%;
    width: auto;
    inset: 0;
    margin: 0;
    border: 0;
    padding: 0;
    position: relative;
}

.page-feature .feature-contents .slide-3 .hero2 .name-frame
{
    height: 40%;
    width: auto;
    inset: 0;
    margin: 0;
    border: 0;
    padding: 0;
    position: absolute;
}

.page-feature .feature-contents .slide-3 .hero2 .name-img
{
    height: 40%;
    width: auto;
    inset: 0;
    margin: 0;
    border: 0;
    padding: 0;
    position: absolute;
    z-index: 8;
}

.page-feature .feature-contents .slide-3 .hero2 .type
{
    height: 40%;
    width: auto;
    inset: 0;
    margin: 0;
    border: 0;
    padding: 0;
    position: absolute;
}

.page-feature .feature-contents .slide-3 .hero2 .herodesc-img
{
    height: 72%;
    width: auto;
    inset: 0;
    margin: 0;
    border: 0;
    padding: 0;
    position: absolute;
}

.page-feature .feature-contents .slide-3 .hero2 .herocover
{
    height: 103%;
    width: auto;
    max-width: none;
    inset: 0;
    margin: 0;
    border: 0;
    padding: 0;
    position: absolute;
}

.page-feature .feature-contents .slide-3 .hero3
{
    height: 100%;
    position: absolute;
    inset: 0 20%;
}

.page-feature .feature-contents .slide-3 .hero3 .frame
{
    height: 100%;
    width: auto;
    inset: 0;
    margin: 0;
    border: 0;
    padding: 0;
    position: relative;
}

.page-feature .feature-contents .slide-3 .hero3 .name-frame
{
    height: 40%;
    width: auto;
    inset: 0;
    margin: 0;
    border: 0;
    padding: 0;
    position: absolute;
}

.page-feature .feature-contents .slide-3 .hero3 .name-img
{
    height: 40%;
    width: auto;
    inset: 0;
    margin: 0;
    border: 0;
    padding: 0;
    position: absolute;
    z-index: 8;
}

.page-feature .feature-contents .slide-3 .hero3 .type
{
    height: 40%;
    width: auto;
    inset: 0;
    margin: 0;
    border: 0;
    padding: 0;
    position: absolute;
}

.page-feature .feature-contents .slide-3 .hero3 .herodesc-img
{
    height: 76%;
    width: auto;
    inset: 0;
    margin: 0;
    border: 0;
    padding: 0;
    position: absolute;
}

.page-feature .feature-contents .slide-3 .hero3 .herocover
{
    height: 100%;
    width: auto;
    max-width: none;
    inset: 0;
    margin: 0;
    border: 0;
    padding: 0;
    position: absolute;
}

.page-feature .feature-contents .slide-3 .hero4
{
    height: 100%;
    position: absolute;
    inset: 0 20%;
}

.page-feature .feature-contents .slide-3 .hero4 .frame
{
    height: 100%;
    width: auto;
    inset: 0;
    margin: 0;
    border: 0;
    padding: 0;
    position: relative;
}

.page-feature .feature-contents .slide-3 .hero4 .name-frame
{
    height: 40%;
    width: auto;
    inset: 0;
    margin: 0;
    border: 0;
    padding: 0;
    position: absolute;
}

.page-feature .feature-contents .slide-3 .hero4 .name-img
{
    height: 40%;
    width: auto;
    inset: 0;
    margin: 0;
    border: 0;
    padding: 0;
    position: absolute;
    z-index: 8;
}

.page-feature .feature-contents .slide-3 .hero4 .type
{
    height: 40%;
    width: auto;
    inset: 0;
    margin: 0;
    border: 0;
    padding: 0;
    position: absolute;
}

.page-feature .feature-contents .slide-3 .hero4 .herodesc-img
{
    height: 68%;
    width: auto;
    inset: 0;
    margin: 0;
    border: 0;
    padding: 0;
    position: absolute;
}

.page-feature .feature-contents .slide-3 .hero4 .herocover
{
    height: 103%;
    width: auto;
    max-width: none;
    inset: 0;
    margin: 0;
    border: 0;
    padding: 0;
    position: absolute;
}

.page-feature .feature-contents .slide-3 .hero5
{
    height: 100%;
    position: absolute;
    inset: 0 20%;
}

.page-feature .feature-contents .slide-3 .hero5 .frame
{
    height: 100%;
    width: auto;
    inset: 0;
    margin: 0;
    border: 0;
    padding: 0;
    position: relative;
}

.page-feature .feature-contents .slide-3 .hero5 .name-frame
{
    height: 40%;
    width: auto;
    inset: 0;
    margin: 0;
    border: 0;
    padding: 0;
    position: absolute;
}

.page-feature .feature-contents .slide-3 .hero5 .name-img
{
    height: 40%;
    width: auto;
    inset: 0;
    margin: 0;
    border: 0;
    padding: 0;
    position: absolute;
    z-index: 8;
}

.page-feature .feature-contents .slide-3 .hero5 .type
{
    height: 40%;
    width: auto;
    inset: 0;
    margin: 0;
    border: 0;
    padding: 0;
    position: absolute;
}

.page-feature .feature-contents .slide-3 .hero5 .herodesc-img
{
    height: 80%;
    width: auto;
    inset: 0;
    margin: 0;
    border: 0;
    padding: 0;
    position: absolute;
}

.page-feature .feature-contents .slide-3 .hero5 .herocover
{
    height: 103%;
    width: auto;
    max-width: none;
    inset: 0;
    margin: 0;
    border: 0;
    padding: 0;
    position: absolute;
}

.page-feature .feature-contents .slide-3 .hero6
{
    height: 100%;
    position: absolute;
    inset: 0 20%;
}

.page-feature .feature-contents .slide-3 .hero6 .frame
{
    height: 100%;
    width: auto;
    inset: 0;
    margin: 0;
    border: 0;
    padding: 0;
    position: relative;
}

.page-feature .feature-contents .slide-3 .hero6 .name-frame
{
    height: 40%;
    width: auto;
    inset: 0;
    margin: 0;
    border: 0;
    padding: 0;
    position: absolute;
}

.page-feature .feature-contents .slide-3 .hero6 .name-img
{
    height: 40%;
    width: auto;
    inset: 0;
    margin: 0;
    border: 0;
    padding: 0;
    position: absolute;
    z-index: 8;
}

.page-feature .feature-contents .slide-3 .hero6 .type
{
    height: 40%;
    width: auto;
    inset: 0;
    margin: 0;
    border: 0;
    padding: 0;
    position: absolute;
}

.page-feature .feature-contents .slide-3 .hero6 .herodesc-img
{
    height: 76%;
    width: auto;
    inset: 0;
    margin: 0;
    border: 0;
    padding: 0;
    position: absolute;
}

.page-feature .feature-contents .slide-3 .hero6 .herocover
{
    height: 100%;
    width: auto;
    max-width: none;
    inset: 0;
    margin: 0;
    border: 0;
    padding: 0;
    position: absolute;
}

.page-feature .feature-contents .slide-3 .hero7
{
    height: 100%;
    position: absolute;
    inset: 0 20%;
}

.page-feature .feature-contents .slide-3 .hero7 .frame
{
    height: 100%;
    width: auto;
    inset: 0;
    margin: 0;
    border: 0;
    padding: 0;
    position: relative;
}

.page-feature .feature-contents .slide-3 .hero7 .name-frame
{
    height: 40%;
    width: auto;
    inset: 0;
    margin: 0;
    border: 0;
    padding: 0;
    position: absolute;
}

.page-feature .feature-contents .slide-3 .hero7 .name-img
{
    height: 40%;
    width: auto;
    inset: 0;
    margin: 0;
    border: 0;
    padding: 0;
    position: absolute;
    z-index: 8;
}

.page-feature .feature-contents .slide-3 .hero7 .type
{
    height: 40%;
    width: auto;
    inset: 0;
    margin: 0;
    border: 0;
    padding: 0;
    position: absolute;
}
.page-feature .feature-contents .slide-3 .hero7 .herodesc-img
{
    height: 76%;
    width: auto;
    inset: 0;
    margin: 0;
    border: 0;
    padding: 0;
    position: absolute;
}

.page-feature .feature-contents .slide-3 .hero7 .herocover
{
    height: 103%;
    width: auto;
    max-width: none;
    inset: 0;
    margin: 0;
    border: 0;
    padding: 0;
    position: absolute;
}

.page-feature .feature-contents .slide-3 .hero8
{
    height: 100%;
    position: absolute;
    inset: 0 20%;
}

.page-feature .feature-contents .slide-3 .hero8 .frame
{
    height: 100%;
    width: auto;
    inset: 0;
    margin: 0;
    border: 0;
    padding: 0;
    position: relative;
}

.page-feature .feature-contents .slide-3 .hero8 .name-frame
{
    height: 40%;
    width: auto;
    inset: 0;
    margin: 0;
    border: 0;
    padding: 0;
    position: absolute;
}

.page-feature .feature-contents .slide-3 .hero8 .name-img
{
    height: 40%;
    width: auto;
    inset: 0;
    margin: 0;
    border: 0;
    padding: 0;
    position: absolute;
    z-index: 8;
}

.page-feature .feature-contents .slide-3 .hero8 .type
{
    height: 40%;
    width: auto;
    inset: 0;
    margin: 0;
    border: 0;
    padding: 0;
    position: absolute;
}

.page-feature .feature-contents .slide-3 .hero8 .herodesc-img
{
    height: 63%;
    width: auto;
    inset: 0;
    margin: 0;
    border: 0;
    padding: 0;
    position: absolute;
}

.page-feature .feature-contents .slide-3 .hero8 .herocover
{
    height: 103%;
    width: auto;
    max-width: none;
    inset: 0;
    margin: 0;
    border: 0;
    padding: 0;
    position: absolute;
}

.page-feature .feature-contents .slide-3 .hero9
{
    height: 100%;
    position: absolute;
    inset: 0 20%;
}

.page-feature .feature-contents .slide-3 .hero9 .frame
{
    height: 100%;
    width: auto;
    inset: 0;
    margin: 0;
    border: 0;
    padding: 0;
    position: relative;
}

.page-feature .feature-contents .slide-3 .hero9 .name-frame
{
    height: 40%;
    width: auto;
    inset: 0;
    margin: 0;
    border: 0;
    padding: 0;
    position: absolute;
}

.page-feature .feature-contents .slide-3 .hero9 .name-img
{
    height: 40%;
    width: auto;
    inset: 0;
    margin: 0;
    border: 0;
    padding: 0;
    position: absolute;
    z-index: 8;
}

.page-feature .feature-contents .slide-3 .hero9 .type
{
    height: 40%;
    width: auto;
    inset: 0;
    margin: 0;
    border: 0;
    padding: 0;
    position: absolute;
}

.page-feature .feature-contents .slide-3 .hero9 .herodesc-img
{
    height: 76%;
    width: auto;
    inset: 0;
    margin: 0;
    border: 0;
    padding: 0;
    position: absolute;
}

.page-feature .feature-contents .slide-3 .hero9 .herocover
{
    height: 103%;
    width: auto;
    max-width: none;
    inset: 0;
    margin: 0;
    border: 0;
    padding: 0;
    position: absolute;
}

.page-feature .feature-contents .slide-4
{
    width: auto;
    height: auto;
    position: relative;
    overflow: visible;
}

.page-feature .feature-contents .slide-4 .slide-title
{
    position: relative;
    height: auto;
    width: 20%;
    margin: 8% auto auto auto;
    border: 0;
    padding: 0;
}

.page-feature .feature-contents .slide-4 .slide-title-img
{
    height: 100%;
    width: 100%;
}

.page-feature .feature-contents .slide-4 .description
{
    position: relative;
    height: auto;
    width: 85%;
    margin: -7% auto;
    border: 0;
    padding: 0;
}

.page-feature .feature-contents .slide-4 .description-img
{
    height: 100%;
    width: 100%;
}

.page-feature .feature-contents .slide-5
{
    width: auto;
    height: auto;
    position: relative;
    overflow: visible;
}

.page-feature .feature-contents .slide-5 .slide-title
{
    position: relative;
    height: auto;
    width: 20%;
    margin: 10% auto 0 auto;
    border: 0;
    padding: 0;
}

.page-feature .feature-contents .slide-5 .slide-title-img
{
    height: 100%;
    width: 100%;
}

.page-feature .feature-contents .slide-5 .swiper
{
    position: relative;
    height: 75%;
    width: 75%;
    margin: 1% auto;
    border: 0;
    padding: 0;
    position: relative;
}

.page-feature .feature-contents .slide-5 .slide-img1
{
    height: 20%;
    width: 20%;
    visibility: hidden;
}

.page-feature .feature-contents .slide-5 .swiper-wrapper
{
    height: 100%;
    width: 100%;
    inset: 0;
    margin: 0;
    border: 0;
    padding: 0;
    display:flex;
    justify-content: space-between;
    align-items: center;
    position: absolute;
}

.page-feature .feature-contents .slide-5 .slick-custom-arrow-prev
{
    position: relative;
    height: 25%;
    width: 8%;
    margin: 0 auto;
    border: 0;
    padding: 0;
    background-color: #d8000000;
    cursor : pointer;
    z-index: 1;
}

.page-feature .feature-contents .slide-5 .slick-custom-arrow-prev img
{
    height: 100%;
    width: 100%;
}

.page-feature .feature-contents .slide-5 .slick-list
{
    height: 100%;
    width: 100%;
    margin: 0;
    border: 0;
    padding: 0;
    position: relative;
}

.page-feature .feature-contents .slide-5 .slick-track
{
    height: 100%;
    width: 100%;
    margin: 0 auto;
    position: relative;
}

.page-feature .feature-contents .slide-5 .slide-img
{
    height: 100%;
    width: 100%;
    cursor : pointer;
}

.page-feature .feature-contents .slide-5 .slick-custom-arrow-next
{
    position: relative;
    height: 25%;
    width: 8%;
    margin: 0 auto;
    border: 0;
    padding: 0;
    background-color: #d8000000;
    cursor : pointer;
    z-index: 1;
}

.page-feature .feature-contents .slide-5 .slick-custom-arrow-next img
{
    height: 100%;
    width: 100%;
}

.page-feature .feature-contents .slide-5 .swiper-pagination
{
    width: 100%;
    height: 100%;
    margin: 1% auto 0 auto;
    position: absolute;
}

.page-feature .feature-contents .slide-5 .slick-dots
{
    width: 30%;
    margin: 0 auto;
    display: flex;
    justify-content: space-around;
}

.page-feature .feature-contents .slide-5 .slick-dots button
{
    display: block;
    width: 15px;
    height: 15px;
    font-size: 0;
    margin: 0;
    padding: 0;
    border: 0;
    outline: none;
    cursor: pointer;
    background: #00000055;
    border-radius: 50%;
}

.page-feature .feature-contents .slide-5 .slick-dots .slick-active button
{
    background: #ffffffff;
}

.page-feature .feature-contents .slide-5 .slick-slide
{
    transition: 0.3s ease-in-out;
    transform: scale( .9 );
}

.page-feature .feature-contents .slide-5 .is--active
{
    transform: scale( 1 );
}

.page-feature .feature-contents .slide-5 .slick-custom-arrow
{
    border:0;
    background-color: #d8d8d800;
}

.page-feature .feature-contents .slide-5 .swiper-pagination-bullet
{
    width: 12px !important;
    height: 12px !important;
    margin: 0 0 0 10px !important;
    background: #333 !important;
}

.page-feature .feature-contents .slide-5 .swiper-pagination-bullet:first-child
{
    margin: 0 !important;
}

.page-feature .feature-contents .slide-6
{
    width: auto;
    height: auto;
    position: relative;
    overflow: visible;
    padding-bottom : 15%;

}

.page-feature .feature-contents .slide-6 .slide-title
{
    position: relative;
    height: auto;
    width: 15%;
    margin: 3% 60% 0 40%;
    border: 0;
    padding: 0;
}

.page-feature .feature-contents .slide-6 .slide-title-img
{
    height: 100%;
    width: 100%;
}

.page-feature .feature-contents .slide-6 .promotion-video
{
    position: relative;
    margin: 1% 0 0 0;
}

.page-feature .feature-contents .slide-6 .youtube-16-9
{
    height: auto;
    width: 50%;
    aspect-ratio: 16 / 9;
    display: block;
    margin: 0 0 0 14%;
}

.page-feature .feature-contents .slide-6 .twitter-timeline
{
    height: 100%;
    width: 23%;
    inset: 0 0 0 70%;
    margin: 0;
    border: 0;
    padding: 0;
    position: absolute;
    overflow-y: scroll;
}

.page-feature .feature-footer
{
    height: 100%;
    width: 100%;
    position: relative;
}

/* .page-feature .feature-footer .btn-regist-area
{
    height: 80%;
    width: 80%;
    margin: 8% auto 0 auto;
}

.page-feature .feature-footer .ntg-btn-registration
{
    position: relative;
    height: 30%;
    width: 30%;
    border: 0;
    background-color: #d8d8d800;
    align-items: center;
    cursor : pointer;
} */

/* .page-feature .feature-footer .ntg-btn-img
{
    height: 100%;
    width: 100%;
} */

.page-feature .feature-footer .support-area
{
    height: 30%;
    width: 30%;
    position: relative;
    display: block;
    margin: 0 auto;
}

.page-feature .feature-footer .btn-support
{
    height: 100%;
    width: 100%;
    position: relative;
}

.page-feature .feature-footer .support-button
{
    height: 100%;
    width: 100%;
    border: 0;
    background-color: #d8d8d800;
}

.page-feature .feature-footer .support-img
{
    height: 100%;
    width: 100%;
}

.page-feature .feature-footer .support-img
{
    height: 100%;
    width: 100%;
    cursor : pointer;
}

.page-feature .feature-footer .operating-list
{
    height: 100%;
    width: 100%;
    display: block;
}

.page-feature .feature-footer .operating-list .titlelogo-img
{
    height: 100%;
    width: 100%;
}

.page-feature .feature-footer .Terms
{
    height: 100%;
    width: 100%;
    display: block;
    margin: 10% auto 5% auto;
    justify-content: space-around;
}

.page-feature .feature-footer .Terms .term1
{
    text-decoration:underline;
}

.page-feature .feature-footer .Terms .open
{
    text-decoration:underline;
    cursor : pointer;
}

.page-feature .feature-footer .Terms .term3
{
    text-decoration:underline;
}

.page-feature .feature-footer .Terms .term4
{
    text-decoration:underline;
}

.page-feature .feature-footer .Terms .open
{
    cursor:pointer;
}

.page-feature .feature-footer .Terms #pop-up
{
    display: none;
}

.page-feature .feature-footer .Terms .overlay
{
    display: none;
}

.page-feature .feature-footer .Terms #pop-up:checked + .overlay
{
    display: block;
    position: fixed;
    width: 100%;
    height: 100vh;
    top: 0;
    left: 0;
    z-index: 9999;
    background: rgba(0, 0, 0, 0.6);
}

.page-feature .feature-footer .Terms .window
{
    position: fixed;
    top: 50%;
    left: 50%;
    width: 70vw;
    max-width: 1280px;
    padding: 20px;
    height: 70vh;
    max-height: 720px;
    background-color: #fff;
    border-radius: 4px;
    align-items: center;
    transform: translate(-50%, -50%);
    overflow-y: scroll;
}

.page-feature .feature-footer .Terms .close
{
position: absolute;
top: 4px;
right: 4px;
cursor:pointer;
}

.page-feature .feature-footer .Terms .close2
{
position: absolute;
width: 100vw;
height: 100vh;
}

.page-feature .btn-regist-area {
    text-align: center !important;
}
.page-feature .btn-regist-area .ntg-btn-registration {
    display: block !important;
    margin: 0 auto !important;
}

.page-feature .btn-regist-area .ntg-btn-registration2 {
    display: block !important;
    margin: 0 auto !important;
}

/* * CSSの記述ここまで *************************************** */