@charset "utf-8";
@import url(animation.css);
@import url(var.css);

a{
	text-decoration: none !important;
}
.pb-none {
    padding-bottom: 0px !important;
}
.pt-none {
    padding-top: 0px !important;
}
.mb-none {
    margin-bottom: 0px !important;
}
.hide {
    display: none !important;
}
@media (min-width:1470px){
    .container {
        width: 1470px;
    }
}
@media (min-width:1400px){
    .container.wide {
        width: calc(100% - 120px);
    }
}
@media (max-width:1370px){
    .hid-max {
        display: none;
    }
}
@media (max-width:501px){
    .only-pc {
        display: none !important;
    }
}
@media (min-width:500px){
    .only-mobile {
        display: none !important;
    }
}
/* placeholde */
input::placeholder {
    color: #b9c3d6 !important;
    opacity: 1;
}
input::-ms-input-placeholder {
    color: #b9c3d6 !important;
}
/* scrolling */
.no-scrolling-allowed {
    overflow: hidden !important;
}
/* header */
#header {
    /* position: fixed;
    left: 0;
    top: 0; */
    position: relative;
    width: 100%;
    padding: 0 25px;
    background: #fff;
    transition: all .3s linear;
    z-index: 100;
    color: #fff;
    height: auto;
    line-height: unset;

    -webkit-transition: all 0.4s ease-out;
    -moz-transition: all 0.4s ease-out;
    -ms-transition: all 0.4s ease-out;
    -o-transition: all 0.4s ease-out;
    transition: all 0.4s ease-out;
}
#header .mobile-nav-toggle,
#header .nav-dropdown-toggle {
    cursor: pointer;
}
#header .header-wrap {
    border-radius: 20px;
    padding: 14px 30px;
    border: 1px solid;
    border-image-source: radial-gradient(121.49% 277.08% at 0% 0%, rgba(255, 255, 255, .44) 0%, rgba(255, 255, 255, .05) 100%);
    -webkit-backdrop-filter: blur(21px);
    backdrop-filter: blur(21px);
}
#header .menu a {
    margin: 0 35px;
    padding: 10px 0;
    color: #414141;
    cursor: pointer;
    text-decoration: none;
    text-transform: uppercase;
    font-weight: 600;
    font-size: 20px;
}
#header .menu a.active, 
#header .menu a:hover {
    color: var(--color-primary);
}
#header .rt {
    gap: 20px;
}
#header .logBox {
    gap: 15px;
    font-size: 16px;
    line-height: 1em;
    font-weight: 500;
}
#header .logBox a {
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    gap: 5px;
}
#header .searchBox {
    display: inline-block;
    position: relative;
}
#header .searchBox .form-control,
#header .searchBox button {
    font-size: 16px;
}
#header .searchBox .form-control {
    background-color: #ebeef0;
    border-radius: 100px;
    height: 45px;
    padding: 10px 60px 10px 20px;
    border: 0px;
}
#header .searchBox .form-control:focus {
    color: #333;
}
#header .searchBox button {
    background-color: transparent;
    position: absolute;
    right: 20px;
    top: 50%;
    transform: translateY(-50%);
    color: #333;
    border: 0px;
}
@media (min-width: 1024px) {
    #header.mobile {
        display: none !important;
    }
}
@media (max-width: 1023px) {
    #header.desktop {
        display: none !important;
    }
}
@media (max-width: 992px) {
    #header .menu-overlay {
        display: none !important;
    }
    #header .menu-overlay.show {
        display: flex !important;
    }
}
@media (max-width: 768px) {
    #header {
        padding: 0;
		z-index: unset;
        position: relative;
    }
    #header > .header-wrap {
        position: fixed;
		z-index: 5;
        background: #fff;
        left: 0;
        top: 0;
    }
    #header .mobile-logo {
        width: 200px;
    }
    #header .header-wrap {
        border-radius: 0;
        padding: 8px 5px;
    }
}

/* #header .menu */
#header .menu .dropdown:hover .dropdown-menu {
    display: block;
}
#header .menu .dropdown .dropdown-menu {
    background-color: rgb(77, 160, 255);
    background-color: rgba(64, 153, 255, 0.9);
    padding: 20px 10px;
    text-align: center;
    border: 0px;
    border-radius: 10px;
    transform: translate3d(0px, 10px, 0px);
    max-height: auto;
}
#header .menu .dropdown .dropdown-menu li a {
    display: block;
    font-size: 17px;
    text-align: center;
    width: 100%;
    margin: 0;
    color: #fff;
    padding: 8px;
    background-color: transparent !important;
}
/*lines_bar*/
.mmenu-toggle-btn {
    display: inline-block;
    width: 25px;
    cursor: pointer;
    margin: 0;
    line-height: 35px;
    vertical-align: middle;
    cursor: pointer;
    position: relative;
    z-index: 5;
}
.lines_bar {
    display: inline-block;
    width: 25px;
    height: 2px;
    transition: 0.3s;
    position: relative;
    top: -4px;
    background-color: #333;
}
.lines_bar:before,
.lines_bar:after {
    display: inline-block;
    width: 25px;
    height: 2px;
    transition: 0.3s;
    position: absolute;
    background-color: #333;
    left: 0;
    content: '';
    -webkit-transform-origin: 0.26rem center;
    transform-origin: 0.26rem center;
}
.lines_bar:before {
    top: 8px;
}
.lines_bar:after {
    top: -8px;
}
.pop.lines_bar,
#header.act .lines_bar {
    background-color: transparent !important;
}
.pop.lines_bar:before,
.pop.lines_bar:after,
#header.act .lines_bar:before,
#header.act .lines_bar:after {
    -webkit-transform-origin: 50% 50%;
    transform-origin: 50% 50%;
    top: 0;
    width: 30px;
}
.pop.lines_bar:before,
#header.act .lines_bar:before {
    -webkit-transform: rotate3d(0, 0, 1, 45deg);
    transform: rotate3d(0, 0, 1, 45deg);
}
.pop.lines_bar:after,
#header.act .lines_bar:after {
    -webkit-transform: rotate3d(0, 0, 1, -45deg);
    transform: rotate3d(0, 0, 1, -45deg);
}
@media (max-width:768px) {
    .lines_bar,
    .lines_bar:before,
    .lines_bar:after {
        width: 25px;
        height: 2px;
    }
    .lines_bar:before {
        top: 9px;
    }
    .lines_bar:after {
        top: -9px;
    }
}
/*modal*/
body.modal-open,
.modal-open .modal {
    padding: 0px !important;
}
.priv {
    padding: 30px 0;
}
.priv .modal-header p {
    margin-top: 0px;
}
.priv .modal-body ol {
    font-size: 17px;
    line-height: 1.8em;
    color: #1e1e1e;
    font-weight: 300;
    letter-spacing: 0;
    list-style: none;
}
.priv .modal-body ol > li {
    position: relative;
    padding-left: 20px;
}
.priv .modal-body ol > li p {
    margin-top: 5px;
}
.priv .modal-body ol > li .hd {
    position: absolute;
    left: 0;
}
.priv .modal-body > ol > li {
    font-weight: 600;
}
.priv .modal-body > ol > li .weight-light {
    font-weight: 300;
}

/* Mobile Menu */
#header.mobile a {
    margin: 0 15px;
    padding: 10px 0;
    color: #414141;
    cursor: pointer;
    text-decoration: none;
    letter-spacing: .02em;
    text-transform: uppercase;
    font-weight: 600;
    font-size: 24px;
}
#header .menu-overlay {
    background: #fffc;
    position: fixed;
    width: 100%;
    height: calc(100vh - 60px);
    -webkit-backdrop-filter: blur(50px);
    backdrop-filter: blur(50px);
    top: 60px;
    left: 0;
    display: flex;
    justify-content: flex-end;
    z-index: -100;
    opacity: 0;
    
    transition: all 0.5s;
    -o-transition: all 0.5s;
    -moz-transition: all 0.5s;
    -webkit-transition: all 0.5s;
}
#header .menu-overlay.show {
    opacity: 1;
    z-index: 100;
}
#header .menu-overlay .sub-menu {
    width: 60%;
    min-width: 320px;
    max-width: 320px;
    height: 100%;
    background: linear-gradient(112.62deg, #a4cbc8b3 -10.65%, #a4cbc8 104.47%);
    background: #fcfcfc;
    border-image-source: radial-gradient(121.49% 277.08% at 0% 0%, rgba(255, 255, 255, .44) 0%, rgba(255, 255, 255, .05) 100%);
    padding: 20px;
    position: relative;
    transition: right .5s cubic-bezier(.075,.82,.165,1);
    right: -320px;
    transition-delay: .1s;
}
#header .menu-overlay .sub-menu.open {
    right: 0;
}
#header .menu-overlay .sub-menu a {
    width: 100%;
    margin-bottom: 20px;
    padding: 5px 10px;
    cursor: pointer;
    color: #414141;
    border-bottom: 1px solid white;
    text-decoration: none;
    letter-spacing: .02em;
    text-transform: uppercase;
    font-weight: 400;
}
#header .menu-overlay .sub-menu a.active, 
#header .menu-overlay .sub-menu a:hover {
    background: #fff;
    color: var(--color-primary);
}
#header .menu-overlay .sub-menu .language {
    width: 100% !important;
    padding: 10px;
    margin: 0;
    border: 1px solid white;
    border-radius: 0;
    text-decoration: none;
    letter-spacing: .02em;
    text-transform: uppercase;
    font-weight: 400;
}
/* mobile-side-menu */
.mobile-side-menu.sub-menu .dropdown {
    padding: 5px 0;
}
.mobile-side-menu.sub-menu .dropdown .mmenu-toggle {
    margin: 0px !important;
    padding: 8px 0;
    display: block;
    text-align: left !important;
    font-weight: 700 !important;
    background-color: transparent !important;
}
.mobile-side-menu.sub-menu .dropdown .dropdown-menu {
    position: relative;
    background-color: #fff;
    background-color: transparent;
    border: 0px;
    padding: 5px 0 15px;
    box-shadow: 0 0 0 !important;
}
.mobile-side-menu.sub-menu .dropdown .dropdown-menu li a {
    position: relative;
    background-color: transparent !important;
    border: 0px;
    margin: 0!important;
    font-size: 18px !important;
}

/* fbox */
.fbox {
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.fbox.v_t {
    align-items: flex-start;
    gap: 8px;
}
.fbox.v_bt {
    align-items: flex-end;
    gap: 8px;
}
.fbox.h_t {
    justify-content: flex-start;
}
.fbox.h_ct {
    justify-content: center;
}
.fbox.h_bt {
    justify-content: flex-end;
}
@media (min-width:768px) {
    .fbox.fx > div {
        width: 50%;
    }
    .fbox > .txt.lft {
        padding-right: 30px;
    }
    .fbox > .txt.rt {
        padding-left: 30px;
    }
    .fbox.short > .txt.lft {
        padding-right: 5px;
    }
    .fbox.short > .txt.rt {
        padding-left: 5px;
    }
    .fbox.long > .txt.lft {
        padding-right: 60px;
    }
    .fbox.long > .txt.rt {
        padding-left: 60px;
    }
}
@media (max-width:768px) {
    .fbox {
        flex-wrap: wrap;
    }
}

/* width */
.w1000 {
    max-width: 1000px;
    margin: 0 auto;
}
.w1200 {
    max-width: 1230px;
    margin: 0 auto;
    padding: 0 15px;
}
.w1400 {
    max-width: 1400px;
    margin: 0 auto;
}
/*conbox*/
.conbox {
    margin-top: 60px;
}
.conbox.conbox_lg {
    margin-top: 100px;
}
.conbox.conbox_xlg {
    margin-top: 150px;
}
.conbox.conbox_xxlg {
    margin-top: 200px;
}
.conbox.conbox_mini {
    margin-top: 40px;
}
.conbox.conbox_xs {
    margin-top: 30px;
}
.conbox.conbox_xxs {
    margin-top: 20px;
}
.conbox.conbox_xxxs {
    margin-top: 10px;
}
@media (max-width:1200px) and (min-width:992px){
    .conbox {
        margin-top: calc(100vw * (60 / 1200));
    }
    .conbox.conbox_lg {
        margin-top: calc(100vw * (100 / 1200));
    }
    .conbox.conbox_xlg {
        margin-top: calc(100vw * (150 / 1200));
    }
    .conbox.conbox_xxlg {
        margin-top: calc(100vw * (200 / 1200));
    }
    .conbox.conbox_mini {
        margin-top: calc(100vw * (40 / 1200));
    }
    .conbox.conbox_xs {
        margin-top: calc(100vw * (30 / 1200));
    }
    .conbox.conbox_xxs {
        margin-top: calc(100vw * (20 / 1200));
    }
    .conbox.conbox_xxxs {
        margin-top: calc(100vw * (10 / 1200));
    }
}
@media (max-width:991px) and (min-width:767px){
    .conbox {
        margin-top: calc(100vw * (60 / 992));
    }
    .conbox.conbox_lg {
        margin-top: calc(100vw * (100 / 992));
    }
    .conbox.conbox_xlg {
        margin-top: calc(100vw * (150 / 992));
    }
    .conbox.conbox_xxlg {
        margin-top: calc(100vw * (200 / 992));
    }
    .conbox.conbox_mini {
        margin-top: calc(100vw * (40 / 992));
    }
    .conbox.conbox_xs {
        margin-top: calc(100vw * (30 / 992));
    }
    .conbox.conbox_xxs {
        margin-top: calc(100vw * (20 / 992));
    }
    .conbox.conbox_xxxs {
        margin-top: calc(100vw * (10 / 992));
    }
}
@media (max-width:768px) and (min-width:450px){
    .conbox {
        margin-top: calc(100vw * (40 / 768));
    }
    .conbox.conbox_lg {
        margin-top: calc(100vw * (50 / 768));
    }
    .conbox.conbox_xlg {
        margin-top: calc(100vw * (70 / 768));
    }
    .conbox.conbox_xxlg {
        margin-top: calc(100vw * (100 / 768));
    }
    .conbox.conbox_mini {
        margin-top: calc(100vw * (30 / 768));
    }
    .conbox.conbox_xs {
        margin-top: calc(100vw * (20 / 768));
    }
    .conbox.conbox_xxs {
        margin-top: calc(100vw * (10 / 768));
    }
    .conbox.conbox_xxxs {
        margin-top: calc(100vw * (5 / 768));
    }
}
@media (max-width:501px){
    .conbox {
        margin-top: calc(100vw * (40 / 500));
    }
    .conbox.conbox_lg {
        margin-top: calc(100vw * (50 / 500));
    }
    .conbox.conbox_xlg {
        margin-top: calc(100vw * (70 / 500));
    }
    .conbox.conbox_xxlg {
        margin-top: calc(100vw * (100 / 500));
    }
    .conbox.conbox_mini {
        margin-top: calc(100vw * (40 / 500));
    }
    .conbox.conbox_xs {
        margin-top: calc(100vw * (20 / 500));
    }
    .conbox.conbox_xxs {
        margin-top: calc(100vw * (10 / 500));
    }
    .conbox.conbox_xxxs {
        margin-top: calc(100vw * (5 / 500));
    }
}
/*sec_dvd*/
.sec_dvd {
    padding: 13rem 0;
}
.sec_dvd.sec_dvd_lg {
    padding: 15rem 0;
}
.sec_dvd.sec_dvd_xlg {
    padding: 20rem 0;
}
.sec_dvd.sec_dvd_mini {
    padding: 8rem 0;
}
.sec_dvd.sec_dvd_xs {
    padding: 6rem 0;
}
.sec_dvd.sec_dvd_xxs {
    padding: 5rem 0;
}
.sec_dvd.sec_dvd_xxxs {
    padding: 4rem 0;
}
@media (max-width:1200px) and (min-width:992px){
    .sec_dvd {
        padding-top: calc(100vw * (50 / 1200));
        padding-bottom: calc(100vw * (50 / 1200));
    }
    .sec_dvd.sec_dvd_lg {
        padding-top: calc(100vw * (70 / 1200));
        padding-bottom: calc(100vw * (70 / 1200));
    }
    .sec_dvd.sec_dvd_xlg {
        padding-top: calc(100vw * (100 / 1200));
        padding-bottom: calc(100vw * (100 / 1200));
    }
    .sec_dvd.sec_dvd_mini {
        padding-top: calc(100vw * (60 / 1200));
        padding-bottom: calc(100vw * (60 / 1200));
    }
    .sec_dvd.sec_dvd_xs {
        padding-top: calc(100vw * (40 / 1200));
        padding-bottom: calc(100vw * (40 / 1200));
    }
    .sec_dvd.sec_dvd_xxs {
        padding-top: calc(100vw * (30 / 1200));
        padding-bottom: calc(100vw * (30 / 1200));
    }
    .sec_dvd.sec_dvd_xxxs {
        padding-top: calc(100vw * (20 / 1200));
        padding-bottom: calc(100vw * (20 / 1200));
    }
}
@media (max-width:991px) and (min-width:767px){
    .sec_dvd {
        padding-top: calc(100vw * (80 / 992));
        padding-bottom: calc(100vw * (80 / 992));
    }
    .sec_dvd.sec_dvd_lg {
        padding-top: calc(100vw * (100 / 992));
        padding-bottom: calc(100vw * (100 / 992));
    }
    .sec_dvd.sec_dvd_xlg {
        padding-top: calc(100vw * (130 / 992));
        padding-bottom: calc(100vw * (130 / 992));
    }
    .sec_dvd.sec_dvd_mini {
        padding-top: calc(100vw * (60 / 992));
        padding-bottom: calc(100vw * (60 / 992));
    }
    .sec_dvd.sec_dvd_xs {
        padding-top: calc(100vw * (40 / 992));
        padding-bottom: calc(100vw * (40 / 992));
    }
    .sec_dvd.sec_dvd_xxs {
        padding-top: calc(100vw * (30 / 992));
        padding-bottom: calc(100vw * (30 / 992));
    }
    .sec_dvd.sec_dvd_xxxs {
        padding-top: calc(100vw * (20 / 992));
        padding-bottom: calc(100vw * (20 / 992));
    }
}
@media (max-width:768px) and (min-width:500px){
    .sec_dvd {
        padding-top: calc(100vw * (80 / 768));
        padding-bottom: calc(100vw * (80 / 768));
    }
    .sec_dvd.sec_dvd_lg {
        padding-top: calc(100vw * (100 / 768));
        padding-bottom: calc(100vw * (100 / 768));
    }
    .sec_dvd.sec_dvd_xlg {
        padding-top: calc(100vw * (130 / 768));
        padding-bottom: calc(100vw * (130 / 768));
    }
    .sec_dvd.sec_dvd_mini {
        padding-top: calc(100vw * (60 / 768));
        padding-bottom: calc(100vw * (60 / 768));
    }
    .sec_dvd.sec_dvd_xs {
        padding-top: calc(100vw * (40 / 768));
        padding-bottom: calc(100vw * (40 / 768));
    }
    .sec_dvd.sec_dvd_xxs {
        padding-top: calc(100vw * (30 / 768));
        padding-bottom: calc(100vw * (30 / 768));
    }
    .sec_dvd.sec_dvd_xxxs {
        padding-top: calc(100vw * (20 / 768));
        padding-bottom: calc(100vw * (20 / 768));
    }
}
@media (max-width:501px){
    .sec_dvd {
        padding-top: calc(100vw * (80 / 500));
        padding-bottom: calc(100vw * (80 / 500));
    }
    .sec_dvd.sec_dvd_lg {
        padding-top: calc(100vw * (100 / 500));
        padding-bottom: calc(100vw * (100 / 500));
    }
    .sec_dvd.sec_dvd_xlg {
        padding-top: calc(100vw * (130 / 500));
        padding-bottom: calc(100vw * (130 / 500));
    }
    .sec_dvd.sec_dvd_mini {
        padding-top: calc(100vw * (60 / 500));
        padding-bottom: calc(100vw * (60 / 500));
    }
    .sec_dvd.sec_dvd_xs {
        padding-top: calc(100vw * (40 / 500));
        padding-bottom: calc(100vw * (40 / 500));
    }
    .sec_dvd.sec_dvd_xxs {
        padding-top: calc(100vw * (30 / 500));
        padding-bottom: calc(100vw * (30 / 500));
    }
    .sec_dvd.sec_dvd_xxxs {
        padding-top: calc(100vw * (20 / 500));
        padding-bottom: calc(100vw * (20 / 500));
    }
}
/* background */
.bg-gray {
    background-color: #f4f7ff;
}
/*visual*/
#visual_wrp {
    position: relative;
}
#visual_wrp .tcon {
    position: absolute;
    z-index: 10;
    width: 100%;
    bottom: 20%;
    left: 0;
}
#visual_wrp .tcon > div {
    max-width: 940px;
    margin: 0 auto;
    padding: 0 20px;
}
#visual {
    position: relative;
}
#visual .bg {
    height: 800px;
    position: relative;
    overflow: hidden;
}
#visual .bg:after {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.2);
    z-index: 3;
}
#visual .bg:before {
    content: "";
    z-index: 1;
    position: absolute;
    left: 0;
    top: 0;
    height: 100%;
    width: 100%;
    background-size: cover !important;
    transform: scale(1.2);
    transition: all 2s ease;
}
#visual .bg.bg1:before {
    background: url(../img/visual_bg1.jpg) center center no-repeat;
    background-size: cover;
}
#visual .bg.bg2:before {
    background: url(../img/visual_bg2.jpg) center center no-repeat;
    background-size: cover;
}
#visual .bg.bg3:before {
    background: url(../img/visual_bg3.jpg) center center no-repeat;
    background-size: cover;
}
#visual .bg.slick-current:before {
    transform: scale(1) !important;
}
@media (max-width:1200px){
    #visual .bg {
        height: 400px;
    }
}
@media (max-width:992px){
    #visual .bg {
        height: 300px;
    }
    #visual .tcon h1 {
        font-size: 40px;
    }
}
@media (max-width:767px){
    #visual .bg {
        height: 300px;
    }
    #visual .bg .tcon {
        margin: 0 auto;
        text-align: center;
    }
}
@media (max-width:500px){
    #visual .bg {
        height: 200px;
    }
    #visual .bg .tcon h1 {
        font-size: 24px;
    }
}

/* txt */
#visual .txt1,
#visual .txt2,
#visual .txt3,
#visual .txt4 {
    opacity: 0;
}
#visual.ply:not(.slickPause) .txt2 {
    -webkit-animation: fadeMove 6.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) infinite;
    -moz-animation: fadeMove 6.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) infinite;
    -ms-animation: fadeMove 6.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) infinite;
    -o-animation: fadeMove 6.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) infinite;
    animation: fadeMove 6.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) infinite;
}
#visual .slickPause .txt2 {
    -webkit-animation: fadeMove 6.5s cubic-bezier(0.250, 0.460, 0.450, 0.940);
    -moz-animation: fadeMove 6.5s cubic-bezier(0.250, 0.460, 0.450, 0.940);
    -ms-animation: fadeMove 6.5s cubic-bezier(0.250, 0.460, 0.450, 0.940);
    -o-animation: fadeMove 6.5s cubic-bezier(0.250, 0.460, 0.450, 0.940);
    animation: fadeMove 6.5s cubic-bezier(0.250, 0.460, 0.450, 0.940);
    animation-iteration-count: 1;
    animation-fill-mode : forwards;
}
@keyframes fadeMove {
    20% {
        transform: translate3d(0, 30px, 0);
        opacity: 0;
    }
    35% {
        transform: translate3d(0, 0, 0);
        opacity: 1;
    }
    100% {
        transform: translate3d(0, 0, 0);
        opacity: 1;
    }
}

#visual.ply:not(.slickPause) .txt3 {
    -webkit-animation: fadeMove2 6.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) infinite;
    -moz-animation: fadeMove2 6.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) infinite;
    -ms-animation: fadeMove2 6.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) infinite;
    -o-animation: fadeMove2 6.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) infinite;
    animation: fadeMove2 6.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) infinite;
}
#visual .slickPause .txt3 {
    -webkit-animation: fadeMove2 6.5s cubic-bezier(0.250, 0.460, 0.450, 0.940);
    -moz-animation: fadeMove2 6.5s cubic-bezier(0.250, 0.460, 0.450, 0.940);
    -ms-animation: fadeMove2 6.5s cubic-bezier(0.250, 0.460, 0.450, 0.940);
    -o-animation: fadeMove2 6.5s cubic-bezier(0.250, 0.460, 0.450, 0.940);
    animation: fadeMove2 6.5s cubic-bezier(0.250, 0.460, 0.450, 0.940);
    animation-iteration-count: 1;
    animation-fill-mode : forwards;
}
@keyframes fadeMove2 {
    30% {
        transform: translate3d(0, 30px, 0);
        opacity: 0;
    }
    45% {
        transform: translate3d(0, 0, 0);
        opacity: 1;
    }
    100% {
        transform: translate3d(0, 0, 0);
        opacity: 1;
    }
}

#visual.ply:not(.slickPause) .txt4 {
    -webkit-animation: fadeMove3 6.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) infinite;
    -moz-animation: fadeMove3 6.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) infinite;
    -ms-animation: fadeMove3 6.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) infinite;
    -o-animation: fadeMove3 6.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) infinite;
    animation: fadeMove3 6.5 cubic-bezier(0.250, 0.460, 0.450, 0.940) infinite;
}
#visual .slickPause .txt4 {
    -webkit-animation: fadeMove3 6.5s cubic-bezier(0.250, 0.460, 0.450, 0.940);
    -moz-animation: fadeMove3 6.5s cubic-bezier(0.250, 0.460, 0.450, 0.940);
    -ms-animation: fadeMove3 6.5s cubic-bezier(0.250, 0.460, 0.450, 0.940);
    -o-animation: fadeMove3 6.5s cubic-bezier(0.250, 0.460, 0.450, 0.940);
    animation: fadeMove3 6.5s cubic-bezier(0.250, 0.460, 0.450, 0.940);
    animation-iteration-count: 1;
    animation-fill-mode : forwards;
}
@keyframes fadeMove3 {
    40% {
        transform: translate3d(0, 30px, 0);
        opacity: 0;
    }
    55% {
        transform: translate3d(0, 0, 0);
        opacity: 1;
    }
    100% {
        transform: translate3d(0, 0, 0);
        opacity: 1;
    }
}
#visual.ply:not(.slickPause) .txt1 {
    -webkit-animation: fadeMove4 6.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) infinite;
    -moz-animation: fadeMove4 6.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) infinite;
    -ms-animation: fadeMove4 6.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) infinite;
    -o-animation: fadeMove4 6.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) infinite;
    animation: fadeMove4 6.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) infinite;
}
#visual .slickPause .txt1 {
    -webkit-animation: fadeMove4 6.5s cubic-bezier(0.250, 0.460, 0.450, 0.940);
    -moz-animation: fadeMove4 6.5s cubic-bezier(0.250, 0.460, 0.450, 0.940);
    -ms-animation: fadeMove4 6.5s cubic-bezier(0.250, 0.460, 0.450, 0.940);
    -o-animation: fadeMove4 6.5s cubic-bezier(0.250, 0.460, 0.450, 0.940);
    animation: fadeMove4 6.5s cubic-bezier(0.250, 0.460, 0.450, 0.940);
    animation-iteration-count: 1;
    animation-fill-mode : forwards;
}
@keyframes fadeMove4 {
    10% {
        transform: translate3d(0, 30px, 0);
        opacity: 0;
    }
    25% {
        transform: translate3d(0, 0, 0);
        opacity: 1;
    }
    100% {
        transform: translate3d(0, 0, 0);
        opacity: 1;
    }
}
/* moreItem */
.moreItemWrp {
    position: relative;
}
.moreItemWrp .moreItem {
    position: absolute;
    right: 0;
    top: 0;
    display: flex;
    align-items: center;
    justify-content: center;
}
.moreItemWrp .moreItem .more {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate3d(calc(-50% + 11px), calc(-50% - 11px), 0);
    width: 40px;
    height: 40px;
    background-color: #4099ff;
    border-radius: 50%;
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
}
.moreItemWrp .moreItem .more i {
    display: inline-block;

    -webkit-transition: all 0.4s ease-out;
    -moz-transition: all 0.4s ease-out;
    -ms-transition: all 0.4s ease-out;
    -o-transition: all 0.4s ease-out;
    transition: all 0.4s ease-out;
}
.moreItemWrp:hover .moreItem .more i {
    transform: rotate(180deg);
}
@media (max-width:768px){
    .moreItemWrp .moreItem .more {
        width: 30px;
        height: 30px;
    }
}

/* section */
.section {
    min-height: 100svh;
    display: flex;
    align-items: center;
    justify-content: center;
}
.logoCon {
    position: fixed;
    right: 0;
    top: 0;
    padding-top: 10svh;
    width: 100%;
    font-family: "Kanit", sans-serif;
    text-align: right;
    z-index: 100;
}
.logoCon h1 {
    font-size: 80px;
    line-height: 1em;
    font-weight: 800;
}
@media (max-width: 768px) {
    .section {
        height: 100svh;
        min-height: 600px !important;
    }
    .logoCon {
        padding-top: 20px;
    }
    .logoCon h1 {
        font-size: 8vw;
    }
}
/* ms1 */
#ms1 {
    background: url(../img/ms1_bg.jpg) center center no-repeat;
    background-size: cover !important;
    min-height: 100svh;
    overflow: hidden;
    position: relative;
}
#ms1 .mainTit {
    font-size: 90px;
    font-weight: 700px;
    line-height: 1em;
}
@media (min-width: 992px) {
    #ms1 {
        background-attachment: fixed;
    }
}
@media (max-width: 992px) {
    #ms1 .mainTit {
        font-size: 90px;
    }
}
@media (max-width: 768px) {
    #ms1 .mainTit {
        font-size: 15vw;
    }
}

/* scroll_ani */
.scroll_ani {
    position: absolute; 
    bottom: 0; 
    left: 50%; 
    transform: translateX(-50%); 
    color: #fff; 
    z-index: 13; 
    height: 150px;
}
.scroll_ani > span {
    display: block;
    font-size: 12px;
    letter-spacing: 2px;
    position: relative;
}
.scroll_ani > span:after {
    content: '';
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate3d(-50%, -50%, 0);
    width: 5px;
    height: 5px;
    border-radius: 50%;
    background-color: rgba(255,255,255,0.2);
    animation-name: zoominout;
    animation-iteration-count: infinite;
    animation-duration:2s;
    animation-timing-function:ease-in-out;
}
@keyframes zoominout { 
    0% {
        width: 5px;
        height: 5px;
        opacity: 1;
    } 
    100% {
        width: 100px;
        height: 100px;
        opacity: 0;
    } 
}
.scroll_ani > .back {
    position: relative; 
    height:100%; 
    width:1px; 
    margin: 30px auto 0; 
    background: rgba(255,255,255,0.2);
}
.scroll_ani > .back .animation {
    width: 100%; 
    background: rgba(255,255,255,1); 
    animation-name: updown;
    animation-iteration-count: infinite;
    animation-duration:2s;
    animation-timing-function:ease-in-out;
}
@keyframes updown { 
    0% {height:0%} 
    100% {height:100%} 
}

/* ms2 */
#ms2 {
    background-color: #101010;
}

/* btnWrp */
.btnWrp .btnItem {
    text-decoration: none;
    position: relative;
    display: inline-block;
    overflow: hidden;
    font-weight: 800;
    line-height: 60px;
    background-color: #fff;
    text-align: center;
    color: #101010;
    padding: 0 35px;
    border-radius: 8px;
}

/* ms3 */
#ms3 {
    background: url(../img/ms3_bg.jpg) center center no-repeat;
    background-size: cover !important;
    min-height: 100svh;
}
#ms3 {
    display: flex;
        align-items: flex-end;
}
#ms3 > div {
    width: 100%;
}
#ms3 .sc1_bt_Text {
    border-top: 1px solid rgba(255,255,255,0.15);
    background-color: rgba(0, 0, 0, 0.3);
    backdrop-filter: blur(10px);
    position: relative;
}
#ms3 .sc1_bt_Text ul {
    display: flex;
    align-items: stretch;
    justify-content: center;
}
#ms3 .sc1_bt_Text ul > li:not(:first-child) {
    border-left: 1px solid rgba(255,255,255,0.15);
}
#ms3 .sc1_bt_Text ul > li {
    flex-grow: 1;
    flex-basis: 100px;
    padding: 55px 35px 55px 0;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}
#ms3 .sc1_bt_Text .qrImg {
    display: inline-block;
    /* padding: 10px; */
    background-color: #fff;
}
@media (min-width: 992px) {
    #ms3 {
        background-attachment: fixed;
    }
    #ms3 .sc1_bt_Text ul > li:not(:first-child) {
        padding-left: 35px;
    }
    #ms3 .sc1_bt_Text .rt {
        align-items: flex-end;
    }
}
@media (max-width:1401px){
    #ms3 .sc1_bt_Text{
        border-bottom: 1px solid rgba(255,255,255,0.3);
    }
}
@media (max-width:992px){
    #ms3 .sc1_bt_Text .container {
        width: 100%;
    }
    #ms3 .sc1_bt_Text ul {
        flex-direction: column;
    }
    #ms3 .sc1_bt_Text ul > li:not(:first-child) {
        border-left: 0px;
        border-top: 1px solid rgba(255,255,255,0.15);
    }
    #ms3 .sc1_bt_Text ul > li {
        padding: 40px 35px;
        width: 100%;
    }
}
@media (max-width:768px){
    #ms3 .sc1_bt_Text ul > li {
        padding: 30px 15px;
    }
}
