#preloader {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
	height: 100%;
	z-index: 99999; /* makes sure it stays on top */
    background: #2B2B2B;
}

#status {
	width: 123px;
	height: 55px;
	position: absolute;
	left: 0; /* centers the loading animation horizontally one the screen */
	right: 0;
	margin-left: auto;
	margin-right: auto;
	top: 50%; /* centers the loading animation vertically one the screen */
}


.page-template-page-vocoflex-eula #preloader,
.page-template-page-vocoflex #preloader{
    background: #26262C;
}











body {
    font-family: aktiv-grotesk-condensed, 游ゴシック体, YuGothic, 游ゴシック Medium, Yu Gothic Medium, 游ゴシック, Yu Gothic, sans-serif;
    letter-spacing: .05em
}

ul {
    padding: 0
}

li {
    list-style: none
}

a {
    text-decoration: none
}

*,
:after,
:before {
    box-sizing: border-box
}

ol,
ul {
    padding: 0
}

blockquote,
body,
dd,
dl,
figure,
h1,
h2,
h3,
h4,
ol,
p,
ul {
    margin: 0;
    z-index: 1;
}

body {
    font-family: 'aktiv-grotesk', 'Noto Sans JP', sans-serif;
    letter-spacing: 0;
    min-height: 100vh;
    scroll-behavior: smooth;
    text-rendering: optimizeSpeed;
    line-height: 1.5
}

ol,
ul {
    list-style: none
}

a:not([class]) {
    -webkit-text-decoration-skip: ink;
    text-decoration-skip-ink: auto
}

img {
    max-width: 100%;
    display: block
}

article>*+* {
    margin-top: 1em
}

button,
input,
select,
textarea {
    font: inherit
}

img:not([alt]) {
    filter: blur(10px)
}

@media(prefers-reduced-motion: reduce) {
    * {
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: .01ms !important;
        scroll-behavior: auto !important
    }
}

.header-lang ul li.zh-CN,
.header-lang ul li.zh-TW {
    display: none
}

.header-lang ul li.zh-CN {
    display: block
}

.header-navi {
    position: fixed;
    width: 100%;
    z-index: 9999;
}

.header-container {
    display: grid    ;
    grid-template-columns: 20% 60% 20%;
    justify-content: space-between;
    align-items: center;
    gap: 0px;
    padding: 20px 3.75vw;
    background: #1B1B1B;
    box-shadow: 0px 4px 12px 0px rgba(18, 18, 18, 0.80);
}

.header-menu{
    display: flex;    
    gap: 32px;
    justify-content: center;  
}

.synthesizer-header{
    box-shadow: 0px 4px 12px 0px rgba(18, 18, 18, 0.80);
    transition: .5s;
}

.synthesizer-header .header-container,
.synthesizer-header .header-container.second{
    box-shadow: none;
}

.synthesizer-header .header-container.second{
    border-top: 1px solid #454545;
    grid-template-columns: 15% 70% 15%;
    padding: 0 3.75vw;
}

.synthesizer-header .header-container.second .header-menu {
    position: relative;
    padding: 0;
    align-items: center;
    gap: 24px;
}

.synthesizer-header .header-container.second .header-menu li{
    height: 100%;
    position: relative;
    display: flex;
    align-items: center;
    padding: 20px 0;    
}

.synthesizer-header .header-container.second .header-menu li:hover:before,
.synthesizer-header .header-container.second .header-menu li.current-menu-item:after{
    content: '';
    width: 100%;
    height: 1px;
    background-color: #A3A3A3;
    position: absolute;
    bottom: 0;
    transition: .5s;
}

.synthesizer-header .header-container.second .header-menu li.current-menu-item:first-child:after,
.synthesizer-header .header-container.second .header-menu li.current-menu-item:nth-child(2):after,
.synthesizer-header .header-container.second .header-menu li.current-menu-item:nth-child(3):after,
.synthesizer-header .header-container.second .header-menu li.current-menu-item:nth-child(4):after,
.synthesizer-header .header-container.second .header-menu li.current-menu-item:nth-child(5):after{
    display: none;
}

.synthesizer-header .header-container.second .header-menu li.current-menu-item:first-child a,
.synthesizer-header .header-container.second .header-menu li.current-menu-item:nth-child(2) a,
.synthesizer-header .header-container.second .header-menu li.current-menu-item:nth-child(3) a,
.synthesizer-header .header-container.second .header-menu li.current-menu-item:nth-child(4) a,
.synthesizer-header .header-container.second .header-menu li.current-menu-item:nth-child(5) a{
    color: #A3A3A3;
}

.synthesizer-header .header-container.second .header-menu li.current-menu-item.active:after{
    display: block !important;
    content: '';
    width: 100%;
    height: 1px;
    background-color: #A3A3A3;
    position: absolute;
    bottom: 0;
    transition: .5s;
}

.synthesizer-header .header-container.second .header-menu li.current-menu-item.active a{
    color: #FFFFFF;
}

.last-part{
    display: flex;
    justify-content: flex-end;
    gap: 20px;
}

.last-part img{
    width: 16px;
    height: 16px;
    object-fit: contain;
}

.last-part .store,
.last-part .language{
    height: 16px;
}

.last-part .log-in img{
    width: 19px;
    height: 16px;
}

.last-part .store img,
.last-part .language img,
.last-part .store span,
.language li.header-lang span{
    transition: 0s;
}

.last-part .store:hover img,
.last-part .language:hover img{
    filter: brightness(1.5);
}

.last-part .store:hover span,
.last-part .language:hover li.header-lang span{
    color: #FFF;
}

.language,
.last-part .store,
.last-part a{
    display: flex;
    align-items: center;
    gap: 8px;
}

.language{
    cursor: pointer;
}

.language li.header-lang span,
.last-part .store span{
    color: #A3A3A3;
    font-size: 14px;
    font-weight: 400;
    line-height: 114.286%;
    cursor: pointer;
}

.last-part .store span{
    height: 11px;
}



.header-container.second .buttons{
    display: flex;
    justify-content: flex-end;
    gap: 20px;
}

.header-container.second .buttons .button-section a{
    display: flex;
    justify-content: center;
    align-items: center;
    height: 25px;
    padding: 8px 16px;
    border-radius: 12px;
    color: #1B1B1B !important;
    background: #79D825;
    transition: .3s;
    font-size: 12px;
    font-style: normal;
    font-weight: 500;
    line-height: 125%
}


.header-container h1 {
    width: 200px
}

.header-container h1 img {
    width: 100%
}

.header-container h1 a:hover img {
    opacity: .6;
    transition: .3s
}

.header-langs li,
.header-menu li {
    position: relative;
    float: left;
    text-align: center
}

.header-langs li{
    display: flex;
    height: 11px;
}

.header-langs li ul li{
    height: auto;
    background-color: #454545;
}

.header-langs li a,
.header-menu li a {
    color: #FFFFFF;
    font-size: 16px;
    font-weight: 300;
    line-height: 114.286%;
}

.header-menu li a {
    color: #A3A3A3;
    font-size: 14px;
    line-height: 114.286%;
}

.header-container .logo,
.header-container .logo img{
    width: 9.38vw;
    min-width: 135px;
    height: auto;
    object-fit: contain;
}

.header-container.second{
    font-size: 12px;
    line-height: 125%;
}

.header-container.second .logo,
.header-container.second .logo img{
    width: 10.42vw;
    min-width: 150px;
}


.header-langs li:hover a,
.header-menu li:hover a,
.header-menu li.current-menu-item a{
    color: #FFFFFF;
}

.header-menu li:hover a{
    color: #FFF !important;
}

.header-list:not(:last-child) {
    margin-right: 50px
}

.header-list:hover>a {
    color: #3391fd !important
}

.header-lang:hover,
.header-list:hover {
    overflow: visible
}

.header-lang ul,
.header-list ul {
    padding-top: 7px;
    position: absolute;
    top: 150%;
    right: 0;
    transition: all .3s;
    opacity: 0;
    width: 103px;
    display: flex;
    flex-direction: column;
    border-radius: 12px;
    z-index: 1;    
    overflow: hidden;
    visibility: hidden;
}


.language:hover ul.bogo-language-switcher.list-view{
    opacity: 1;
    top: 110%;
    visibility: visible;
}

.header-lang ul li,
.header-list ul li {
    color: #fff;
    transition: .5s;
}

.header-lang ul li span, 
.header-list ul li a {
    background-color: transparent;
    text-align: left;
    font-size: 16px;
    padding: 14px 10px;
    white-space: nowrap;
    display: block;
}

.header-lang ul li a,
.header-lang ul li span {
    text-transform: uppercase
}

.header-lang ul li a {
    padding: 0;
    font-size: 14px
}

.header-lang ul li:hover,
.header-list ul li:hover {
    background-color: #2B2B2B;
}

.header-lang:hover {

}

.header-lang ul li {
    text-align: left;
}

.header-lang ul li:first-child {
    margin-top: 0px;
    border-radius: 12px 12px 0 0;
}

.header-langsp,
.header-spMenu,
.header-tab-visible,
.sp-header-download {
    display: none
}




footer {
    background-color: #1B1B1B;
}

footer p,
footer a,
footer li{
    color: #B6B6B6;
    font-size: 14px;
    font-style: normal;
    font-weight: 300;
    line-height: 150%;
}

footer a:hover{
    color: white;
}


.footer-wrapper {
    position: relative
}

.footer-wrapper .section-width{
    width: 85.35vw;
    padding: 4.17vw 3.75vw 6.94vw;
    margin: 0 auto;
}

.footer-wrapper .logo-foot,
.footer-wrapper .logo-foot img{
    width: 11.18vw;
    height: auto;
    object-fit: contain;
}

.footer-wrapper .logo-foot{
    margin-bottom: 44px;
}

.footer-menus {
    padding-bottom: 32px;
    margin-bottom: 52px;
    border-bottom: 1px solid #A3A3A3;
    display: grid;
    grid-template-columns: auto 45.69vw;
}

.footer-menus .name{
    margin-bottom: 20px;
}

.footer-menus .col-right{
    display: flex;
    justify-content: space-between;
}

.footer-menus ul.footer-menu li{
    padding: 0 0 4px;
}

.footer-menus .menu.m3 ul.footer-menu li{
    padding: 0 0 20px;
}



.footer-credit {
    display: grid;
    align-items: center;
    grid-template-columns: auto 45.69vw;
}

footer .footer-credit p,
footer .footer-credit a,
footer .footer-credit li{
    font-size: 12px;
    line-height: 125%;
}

.footer-credit .col-right {
    display: flex;    
    justify-content: space-between;    
}

.social-media{
    display: flex;
    align-items: center;
    gap: 20px ;
}

.social-media .support-wrapper{
    display: flex;
    gap: 32px ;
}

.social-media a img{
    
    transition: .5s;
}

.social-media a:hover img{
    filter: brightness(1.5);
}


#barba-wrapper {
    background-color: #1B1B1B;
}



a {
    transition: all .3s
}

.more {
    display: inline-block;
    color: #3391fd;
    padding-bottom: 12px;
    position: relative
}

.more,
.more:after {
    transition: all .3s;
    width: 140px
}

.more:after {
    position: absolute;
    content: "";
    height: 1px;
    background: linear-gradient(90deg, #0bc1fd 0, #a20cff 51%, #0bc1fd);
    bottom: 0;
    left: 0;
    background-size: 200% auto
}

.more:hover:after {
    background-position: 100%
}

.sponly {
    display: none
}

.effect-fade {
    opacity: 0;
    transform: translateY(45px);
    transition: all .8s
}

.effect-fade.effect-scroll {
    opacity: 1;
    transform: translate(0)
}

#main,
.mv-wrapper {
    background-color: #333
}

.mv-wrapper {
    width: 100%;
    height: 100vh;
    position: relative;
    overflow: hidden
}

#mv-video {
    min-width: 100%;
    min-height: 100vh;
    z-index: 1;
    opacity: 0
}

.mv-mask {
    position: absolute;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, .6);
    z-index: 2;
    opacity: 0
}

.mv-lead {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 3
}

.mv-title {
    font-size: 118px
}

.mv-title1 {
    color: #fff;
    line-height: .5;
    display: flex;
    flex-direction: row-reverse;
    justify-content: flex-end
}

.mv-title1 span {
    opacity: 0;
    left: -50px;
    position: relative
}

.mv-title2 {
    color: #b1b1b1;
    margin-left: 185px;
    margin-bottom: 20px
}

.mv-title2 span {
    position: relative;
    right: -50px;
    opacity: 0
}

.mv-text {
    color: #fff;
    text-align: center;
    font-size: 15px;
    line-height: 1.7
}

.mv-text span {
    opacity: 0;
    position: relative;
    bottom: -50px
}

.mv-scroll {
    bottom: 90px;
    transform: translate(-50%);
    color: #fff;
    opacity: 0
}

.mv-scroll,
.mv-scroll:after {
    position: absolute;
    left: 50%;
    z-index: 3
}

.mv-scroll:after {
    content: "";
    top: 33px;
    width: 1px;
    height: 60px;
    background-color: rgba(255, 255, 255, .6);
    transform-origin: center top;
    animation: scrollbar 1.3s infinite
}

.news-wrapper {
    width: 950px;
    padding: 140px 0 170px;
    margin: 0 auto;
    max-width: calc(100% - 20px)
}

.news-contents {
    display: flex;
    justify-content: space-between
}

.news-contentLeft h2 {
    font-size: 100px;
    color: #fff;
    font-weight: 400
}

.news-contentLeft p {
    font-size: 14px;
    color: #999;
    margin-bottom: 75px;
    font-weight: 100
}

.news-contentRight {
    width: 55%;
    border-top: 1px solid #555;
    margin-top: 33px
}

.news-article {
    padding: 20px 0;
    border-bottom: 1px solid #555;
    display: flex;
    justify-content: space-between
}

.news-article:hover .news-menu,
.news-article:hover .news-thumbnail {
    opacity: .6
}

.news-thumbnail {
    display: inline-block;
    flex-basis: 20%;
    height: auto;
    vertical-align: top;
    transition: all .3s
}

.news-thumbnail img {
    width: 100%;
    height: 100%
}

.news-menu {
    display: inline-block;
    vertical-align: top;
    margin-top: -8px;
    flex-basis: 74%;
    transition: all .3s
}

.news-menu time {
    color: rgba(255, 255, 255, .6);
    margin-right: 15px;
    margin-bottom: 10px
}

.news-category,
.news-menu time {
    display: inline-block;
    font-size: 12px
}

.news-category {
    color: #3391fd
}

.news-title {
    display: block;
    width: 100%;
    color: #fff;
    font-size: 14px
}

.product-wrapper {
    background: url("../img/main-synbg.png") center top/contain no-repeat;
    padding-top: 23%;
    padding-bottom: 180px
}

.product-content {
    width: 1000px;
    max-width: calc(100% - 20px);
    margin: 0 auto
}

.product-content h2 {
    margin-bottom: 25px
}

.product-leading {
    padding-left: 32%
}

.product-title {
    font-size: 26px;
    color: #fff;
    margin-bottom: 10px
}

.product-annotation {
    font-size: 14px;
    color: #999;
    margin-bottom: 20px;
    font-weight: 100
}

.product-text {
    font-size: 14px;
    color: #fff;
    line-height: 1.7;
    margin-bottom: 50px
}

.about-wrapper {
    padding-left: 22%
}

.about-contents {
    display: flex;
    justify-content: space-between
}

.about-content {
    width: 40%;
    padding-top: 7%
}

.about-content img {
    width: 145px
}

.about-content h2 {
    font-size: 100px;
    color: #fff;
    font-weight: 400;
    white-space: nowrap
}

.about-annotation {
    font-size: 14px;
    color: #999;
    margin-bottom: 35px;
    font-weight: 100
}

.about-text {
    font-size: 14px;
    color: #fff;
    line-height: 1.8;
    margin-bottom: 45px
}

.about-bg {
    width: 53%
}

.about-bg img {
    width: 100%
}

.contact-wrapper {
    width: 380px;
    max-width: calc(100% - 50px);
    margin: 0 auto;
    padding-bottom: 180px
}

.contact-content h2 {
    font-size: 100px;
    color: #fff;
    font-weight: 400
}

.contact-annotation {
    font-size: 14px;
    color: #999;
    margin-bottom: 30px;
    font-weight: 100
}

.contact-text {
    font-size: 14px;
    color: #fff;
    margin-bottom: 45px
}

.single {
    background-color: #1B1B1B;
}

.single img{
    filter: none;
}

.single-wrapper {
    display: grid;
    grid-template-columns: 20.21vw auto;
    gap: 47px;
    justify-content: space-between;
}

.single-time time {
    color: #B6B6B6;
    font-size: 16px;
    font-weight: 200;
    line-height: 125%;
}

.single-time time,
.single-time ul {
    display: inline-block
}

.single-time ul li a {
    display: inline-block;
    color: #3391fd;
    font-size: 12px
}

.single-time ul li a:hover {
    opacity: .6
}

.single-content li {
    color: #fff;
    font-size: 14px;
    line-height: 2
}

.single-content table {
    color: #fff;
    font-size: 14px;
    margin-left: 1em;
    border-collapse: collapse
}

.single-content table tr td {
    padding: 6px 12px
}

.single-content table tr td:first-child {
    border-right: 1px solid #fff
}

#syn.new-concept .single-title h1 {
    color: #FFF;
    font-size: 40px;
    font-weight: 300;
    line-height: 110%;
    margin-bottom: 36px;
}

.single-thumbnail {
    margin-bottom: 80px;
}

.single-thumbnail img {
    width: 100%;
    height: 36.94vw;
    max-height: 532px;
    object-fit: cover;
    border-radius: 12px;
}

.single-content h2,
.single-content h3 {
    font-size: 24px;
    color: #fff;
    line-height: 2.5;
    padding-top: 2em
}

.single-content h4 {
    font-size: 20px;
    color: #fff;
    line-height: 2
}

.single-content h5 {
    font-size: 18px;
    color: #fff;
    line-height: 2
}

.single-content h6 {
    font-size: 16px;
    color: #fff;
    line-height: 2
}

.single-content p {
    font-size: 14px;
    color: #fff;
    line-height: 2
}

.single-content ul {
    padding-left: 2em
}

.single-content ul li::before {
    content: "•";
    color: #fff;
    font-weight: bold;
    display: inline-block;
    width: 1em;
    margin-left: -1em
}

.single-content img {
    height: auto
}

.single-content a {
    color: #3391fd
}

.single-content a:hover {
    opacity: .6
}

.single-footer-wrapper {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-top: 200px;
    padding-bottom: 70px;
    margin-bottom: 60px;
    border-bottom: 1px solid #707070
}

.single-share {
    display: flex;
    align-items: center;
    gap: 8px;
}

.single-share{
    cursor: pointer;
    margin-top: 25px;
    color: #A3A3A3 !important;
    font-size: 12px;
    font-weight: 400;
    line-height: 125%;
    opacity: .7;
    transition: .5s;
}

.single-share:hover{
    opacity: 1;
}

.single-share img{
    width: 17px;
    height: 17px;
}


.single-sns a,
.single-sns span {
    display: inline-block;
    vertical-align: middle
}

.single-sns a img {
    width: 100%
}

.single-sns-share {
    font-size: 18px;
    color: #fff;
    margin-right: 50px
}

.single-sns-facebook {
    margin-right: 35px
}

.single-sns-facebook,
.single-sns-twitter {
    width: 25px
}

.single-sns-facebook:hover img,
.single-sns-twitter:hover img {
    opacity: .6;
    transition: .3s
}

.single-tags {
    width: 30%;
    text-align: right
}

.single-tags a {
    display: inline-block;
    line-height: 1.7;
    color: rgba(255, 255, 255, .5);
    margin-right: 16px
}

.single-tags a:hover {
    opacity: .6
}

.single-navi {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-bottom: 195px
}

.single-navi span a {
    font-size: 18px;
    color: #fff
}

.single-navi span a:hover {
    opacity: .6
}

.single-navi-index a img {
    width: 14px;
    display: inline-block;
    margin-right: 15px
}

.single-navi-prev a {
    padding-left: 25px;
    position: relative
}

.single-navi-prev a:before {
    content: "";
    position: absolute;
    display: inline-block;
    width: 20px;
    height: 20px;
    top: 0;
    left: 0;
    border-color: rgba(0, 0, 0, 0) rgba(0, 0, 0, 0) #3391fd #3391fd;
    border-style: solid;
    border-width: 1px;
    transform: rotate(45deg)
}

.single-navi-next a {
    padding-right: 25px;
    position: relative
}

.single-navi-next a:before {
    content: "";
    position: absolute;
    display: inline-block;
    width: 20px;
    height: 20px;
    top: 0;
    right: 0;
    border-color: #3391fd #3391fd rgba(0, 0, 0, 0) rgba(0, 0, 0, 0);
    border-style: solid;
    border-width: 1px;
    transform: rotate(45deg)
}

.single-related {
    width: 900px;
    max-width: calc(100% - 25px);
    margin-left: 22%;
    padding-bottom: 200px
}

.related_post_title {
    font-size: 80px !important;
    color: #fff;
    font-weight: 300 !important;
    position: relative;
    text-align: center;
    margin-bottom: 100px !important
}

.related_post_title:after {
    content: "The latest information and company information of Synthesizer V.";
    position: absolute;
    font-size: 14px;
    color: #999;
    bottom: -15px;
    left: 50%;
    transform: translateX(-50%);
    white-space: nowrap
}

ul.related_post li {
    display: inline-block;
    width: 230px;
    vertical-align: top
}

ul.related_post li:not(:last-child) {
    margin-right: 100px
}

.wp_rp_thumbnail img {
    width: 100%;
    height: auto;
    margin-bottom: 15px
}

.wp_rp_thumbnail img:hover {
    opacity: .6
}

.wp_rp_publish_date {
    font-size: 12px;
    color: rgba(255, 255, 255, .6);
    display: inline-block;
    margin-right: 12px
}

.wp_rp_title {
    font-size: 14px;
    color: #fff;
    display: block;
    line-height: 1.6;
    font-weight: 300 !important
}

.wp_rp_title:hover {
    opacity: .6
}

.related_post .post-categories {
    display: inline-block
}

.related_post .post-categories li {
    width: auto
}

.related_post .post-categories a {
    font-size: 12px;
    color: #3391fd;
    font-weight: 300 !important
}

.related_post .post-categories a:hover {
    opacity: .6
}

.article {
    background-color: #333
}

.article-wrapper {
    width: 900px;
    max-width: calc(100% - 50px);
    margin: 0 auto;
    padding-top: 200px
}

.article-wrapper a:hover {
    opacity: .6
}

.article-title {
    margin-bottom: 90px
}

.article-title h2 {
    display: inline-block;
    font-size: 100px;
    font-weight: 400;
    color: #fff;
    margin-right: 45px
}

.article-title>div {
    display: inline-block;
    vertical-align: text-bottom;
    line-height: 3;
    font-size: 14px;
    font-weight: 300
}

.article-title>div p:first-child {
    color: #fff
}

.article-title>div p:last-child {
    color: #999;
    font-weight: 100
}

.article-title h2 a {
    font-size: 100px;
    color: #fff;
    pointer-events: none
}

.article-menus {
    display: flex;
    flex-wrap: wrap
}

.article-menus article {
    width: 240px;
    margin-bottom: 80px
}

.article-menus article:not(:nth-child(3n)) {
    margin-right: 90px
}

.article-thumbnail img {
    max-height: 150px;
    width: auto;
    margin: auto
}

.article-thumbnail img:hover {
    max-height: 150px;
    width: auto;
    margin: auto;
    opacity: .6;
    transition: all .3s
}

.article-menu ul {
    display: inline-block;
    margin-bottom: 10px
}

.article-menu time {
    display: inline-block;
    font-size: 12px;
    color: rgba(255, 255, 255, .6);
    margin-right: 15px
}

.article-menu ul li a {
    color: #3391fd;
    font-size: 12px
}

.article-menu>a {
    color: #fff;
    display: block;
    font-size: 14px
}

.wp-pagenavi {
    width: 100%;
    text-align: center;
    padding-top: 70px;
    padding-bottom: 160px
}

.wp-pagenavi .page {
    font-size: 14px;
    color: #fff;
    margin-right: 40px
}

.wp-pagenavi .current {
    color: #3391fd
}

.wp-pagenavi .current,
.wp-pagenavi .extend {
    margin-right: 40px;
    position: relative;
    top: 1px
}

.wp-pagenavi .extend {
    color: #fff
}

.nextpostslink,
.previouspostslink {
    color: #3391fd;
    position: relative;
    top: 1px
}

.previouspostslink {
    margin-right: 65px
}

.nextpostslink {
    margin-left: 25px
}

.article-none {
    color: #fff
}

#aboutmain {
    background-color: #333
}

.aboutmain-mv-img img {
    width: 100%
}

.aboutmain-mv-content {
    width: 900px;
    max-width: calc(100% - 50px);
    margin: -5.5% auto 200px;
    display: flex;
    justify-content: space-between
}

.aboutmain-mv-title {
    width: 49%
}

.aboutmain-mv-title h2 {
    font-size: 100px;
    color: #fff;
    font-weight: 400
}

.aboutmain-mv-title p {
    font-size: 13.5px;
    color: #999;
    margin-top: -10px;
    font-weight: 100
}

.aboutmain-mv-text {
    width: 50%
}

.aboutmain-mv-text p {
    font-size: 13.5px;
    color: #fff;
    margin-top: 35px;
    line-height: 1.85;
    letter-spacing: .107em
}

.aboutmain-message-wrapper {
    width: 900px;
    max-width: calc(100% - 50px);
    margin: 0 auto 200px
}

.aboutmain-message-wrapper h2 {
    font-size: 80px;
    text-align: center;
    color: #fff;
    margin-bottom: 40px;
    font-weight: 400
}

.aboutmain-message-contents {
    display: flex;
    justify-content: space-between
}

.aboutmain-message-img {
    width: 19%
}

.aboutmain-message-img img {
    width: 100%
}

.aboutmain-message-text {
    width: 75%;
    color: #fff
}

.aboutmain-message-text h3 {
    font-size: 25px;
    line-height: 1.7;
    margin-bottom: 20px
}

.aboutmain-message-text p {
    font-size: 14px;
    line-height: 1.77;
    letter-spacing: .06em
}

.aboutmain-message-text p:not(:last-child) {
    margin-bottom: 20px
}

.aboutmain-company-wrapper {
    max-width: calc(100% - 25px);
    display: flex;
    padding-bottom: 200px;
    width: 1200px
}

.aboutmain-company-content {
    margin-left: 120px;
    margin-top: -30px;
    width: 535px
}

.aboutmain-company-content h2 {
    font-size: 80px;
    color: #fff;
    font-weight: 400;
    margin-bottom: 8px
}

.aboutmain-company-content table {
    width: 100%;
    border-collapse: collapse
}

.aboutmain-company-content tr:not(:last-child) {
    border-bottom: 1px solid #555
}

.aboutmain-company-content tr td {
    color: #fff;
    font-size: 14px;
    padding-top: 26.5px;
    padding-bottom: 23.5px;
    line-height: 1.7;
    vertical-align: top
}

.aboutmain-company-content tr td a {
    color: #fff
}

.aboutmain-company-content tr td:first-child {
    width: 130px;
    padding-right: 65px
}

#contactmain {
    background-color: #333
}

.contactmain-wrapper {
    width: 900px;
    max-width: calc(100% - 50px);
    margin: 0 auto;
    padding-top: 260px;
    padding-bottom: 200px
}

.contactmain-content {
    display: flex;
    justify-content: space-between
}

.contactmain-title h2 {
    font-size: 80px;
    color: #fff;
    font-weight: 400
}

.contactmain-title p {
    font-size: 14px;
    color: #999;
    margin-top: -10px;
    font-weight: 100
}

.contactmain-text {
    margin-top: 26px
}

.contactmain-text p {
    font-size: 14px;
    color: #fff;
    line-height: 2.5
}

.contactmain-text a {
    color: #3391fd
}

.contactmain-text a:hover {
    opacity: .6
}

.contactmain-text a img {
    display: inline-block;
    width: 10px;
    margin: 0 3px
}

#error {
    background-color: #333
}

.error-wrapper {
    width: 900px;
    max-width: calc(100% - 50px);
    margin: 0 auto;
    padding-top: 260px;
    padding-bottom: 200px
}

.error-content {
    display: flex;
    justify-content: space-between
}

.error-title h2 {
    font-size: 80px;
    color: #fff;
    font-weight: 400
}

.error-text {
    margin-top: 26px
}

.error-text p {
    font-size: 14px;
    color: #fff;
    line-height: 2;
    margin-bottom: 40px
}

@keyframes slideshow {
    0% {
        opacity: 0
    }
    25% {
        opacity: 1
    }
    50% {
        opacity: 1
    }
    75% {
        opacity: 0
    }
}

@keyframes tabchange {
    0% {
        opacity: 0
    }
    to {
        opacity: 1
    }
}

@keyframes anim-rotate {
    0% {
        transform: rotate(-90deg)
    }
    to {
        transform: rotate(-450deg)
    }
}

@keyframes anim-rotate-out {
    0% {
        transform: rotate(-450deg)
    }
    to {
        transform: rotate(-90deg)
    }
}

#modal-content {
    width: 80%;
    margin: 0;
    padding: 0;
    background: #fff;
    position: fixed;
    display: none;
    z-index: 99999
}

#modal-content-close {
    position: absolute;
    content: "";
    top: -3px;
    right: -6%;
    display: flex;
    flex-direction: column;
    width: 50px;
    height: 50px;
    cursor: pointer
}

#modal-content-close span {
    width: 100%;
    height: 1px;
    background-color: rgba(255, 255, 255, .9);
    position: relative;
    top: 18px
}

#modal-content-close span:first-child {
    transform: rotate(-45deg)
}

#modal-content-close span:last-child {
    transform: rotate(45deg)
}

.modal-inner {
    position: relative;
    width: 100%;
    padding-top: 56.25%;
    overflow: hidden
}

.modal-inner #playerjp {
    position: absolute;
    top: 0;
    right: 0;
    width: 100%;
    height: 100%
}

#modal-overlay {
    z-index: 9999;
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 120%;
    background-color: rgba(0, 0, 0, .75)
}

.syn-heading {
    text-align: center
}

.syn-heading h2 {
    font-size: 100px;
    color: #fff;
    line-height: 1;
    font-weight: 400;
    margin-bottom: 20px
}

.syn-heading p {
    font-size: 14px;
    color: #999;
    font-weight: 100
}

.syn-mv-wrapper {
    padding-top: 180px
}

.syn-mv-heading {
    width: 1000px;
    max-width: calc(100% - 45px);
    margin: 0 auto -100px;
    position: relative;
    z-index: 1
}

.syn-mv-heading h2 {
    width: 100%;
    margin-bottom: 14.5px
}

.syn-mv-heading p {
    font-size: 17px;
    letter-spacing: .018em;
    padding-left: 40%;
    color: #ccc
}

.syn-mv-play {
    position: relative;
    display: block;
    opacity: 1;
    cursor: pointer
}

.syn-mv-play img {
    width: 100%
}

.syn-mv-play div {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    opacity: 1
}

.syn-mv-play div figure {
    display: inline-block;
    vertical-align: middle;
    margin-right: 19px;
    position: relative;
    width: 80px;
    height: 80px
}

.syn-mv-play div img {
    position: absolute;
    top: 50%;
    left: 55%;
    transform: translate(-50%, -50%)
}

.first-circle {
    position: absolute;
    top: 0;
    left: 0
}

.first-circle-rotate {
    animation: anim-rotate 1s ease-in-out forwards
}

.syn-mv-play:hover .first-circle-rotate {
    animation: anim-rotate-out 1s ease-in-out forwards
}

.syn-mv-play div img {
    width: 28px
}

.syn-mv-play div span {
    font-size: 47px;
    letter-spacing: .05em;
    color: #7b9f35;
    font-weight: 300;
    vertical-align: middle
}

.svg_circle {
    stroke: #30ab33;
    stroke-dasharray: 245;
    stroke-dashoffset: 245;
    stroke-width: 3;
    transition: all 1s cubic-bezier(0.19, 0.01, 0, 0.93)
}

.syn-mv-play:hover .svg_circle {
    stroke-dashoffset: 0
}

.syn-mv-text {
    width: 900px;
    max-width: calc(100% - 70px);
    margin: 0 auto;
    display: flex;
    justify-content: space-between;
    padding-top: 80px;
    padding-bottom: 196.5px
}

.syn-mv-text-left {
    width: 36.6%
}

.syn-mv-text-left h3 {
    font-size: 27.5px;
    letter-spacing: .1em;
    line-height: 1.6;
    white-space: nowrap;
    color: #fff;
    margin-top: -5px
}

.syn-mv-text-left p {
    font-size: 13px;
    font-weight: 100;
    letter-spacing: .02em;
    line-height: 1.8;
    color: #999
}

.syn-mv-text-right {
    width: 56.6%
}

.syn-mv-text-right p {
    font-size: 12px;
    color: #fff;
    letter-spacing: .06em;
    line-height: 1.9
}

.syn-mv-text-right p:first-child {
    margin-bottom: 32px
}

.syn-mv-play-sp {
    display: none
}

.syn-feature-wrapper {
    padding-bottom: 180px
}

.syn-feature-heading {
    margin-bottom: 123px
}

.syn-feature-content {
    display: flex;
    justify-content: space-between;
    margin-bottom: 137px
}

.syn-feature-content-1,
.syn-feature-content-3,
.syn-feature-content-5 {
    padding-left: 12.54%
}

.syn-feature-content-2,
.syn-feature-content-4 {
    padding-right: 12.54%
}

.syn-feature-content-5 {
    margin-bottom: 93px
}

.syn-feature-detail {
    width: 42.8%
}

.syn-feature-content-1 .syn-feature-detail {
    margin-top: 10px
}

.syn-feature-content-2 .syn-feature-detail {
    margin-top: 21px
}

.syn-feature-content-3 .syn-feature-detail {
    margin-top: 29px
}

.syn-feature-content-4 .syn-feature-detail {
    margin-top: 3px
}

.syn-feature-content-5 .syn-feature-detail {
    margin-top: 45px
}

.syn-feature-image {
    width: 50.6%;
    height: 100%;
    position: relative
}

.syn-feature-image video {
    width: 100%;
    cursor: pointer
}

.video-btn {
    cursor: pointer;
    display: inline-block;
    position: absolute;
    width: 80px;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%)
}

.syn-feature-image1 img {
    animation: slideshow 8s infinite;
    width: 100%;
    opacity: 0;
    position: absolute;
    top: 0;
    left: 0
}

.syn-feature-image1 img:first-child {
    position: relative
}

.syn-feature-image1 img:nth-child(2) {
    animation-delay: 0s
}

.syn-feature-image1 img:last-child {
    animation-delay: 4s
}

.syn-feature-image2:hover #video-btn1,
.syn-feature-image3:hover a img:last-child,
.syn-feature-image4:hover #video-btn2 {
    filter: brightness(140%);
    transition: filter .2s
}

.syn-feature-image3 a {
    display: block;
    width: 100%;
    height: 100%
}

.syn-feature-image3 a img:last-child {
    cursor: pointer;
    display: inline-block;
    position: absolute;
    width: 80px;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%)
}

.syn-feature-title {
    font-size: 70px;
    font-weight: 300;
    color: #fff;
    position: relative;
    line-height: 1;
    margin-bottom: 5px
}

.syn-feature-title:before {
    display: inline-block;
    position: absolute;
    font-size: 20px;
    color: #7b9f35;
    letter-spacing: .04em;
    top: 8px;
    left: -30px
}

.syn-feature-title1:before {
    content: "01"
}

.syn-feature-title2:before {
    content: "02"
}

.syn-feature-title3:before {
    content: "03"
}

.syn-feature-title4:before {
    content: "04"
}

.syn-feature-title5:before {
    content: "05"
}

.syn-feature-subtitle {
    font-size: 13px;
    letter-spacing: .075em;
    color: #999;
    margin-bottom: 41.5px
}

.syn-feature-text {
    font-size: 13px;
    color: #fff;
    letter-spacing: .075em;
    line-height: 1.8
}

.syn-feature-support {
    width: 900px;
    max-width: calc(100% - 70px);
    margin: 0 auto;
    padding: 43px 160px 43px 54px;
    background-color: #484848;
    display: flex;
    justify-content: space-between;
    align-items: center
}

.syn-feature-support h3 {
    font-size: 49px;
    font-weight: 300;
    letter-spacing: .03em;
    color: #fff
}

.syn-feature-support p {
    font-size: 11px;
    letter-spacing: .06em;
    line-height: 1.7;
    color: #fff;
    opacity: 1
}

.syn-lineup-wrapper {
    padding-bottom: 134px
}

.syn-lineup-heading {
    margin-bottom: 85px
}

.syn-lineup-contents {
    width: 900px;
    margin: 0 auto
}

.syn-lineup-content {
    display: inline-block;
    vertical-align: top;
    width: 147px;
    margin-bottom: 63px
}

.syn-lineup-content:not(:nth-child(5n)) {
    margin-right: 37px
}

.syn-lineup-img {
    position: relative;
    display: block;
    margin-bottom: 12.5px;
    width: 147px;
    height: 147px
}

.syn-lineup-img img:first-child {
    width: 100%;
    height: 100%
}

.syn-lineup-img img:last-child {
    position: absolute;
    width: 31px;
    bottom: 5px;
    right: 5px;
    transition: opacity .3s
}

.syn-lineup-img:hover img:last-child {
    opacity: .6
}

.syn-lineup-content h3 {
    font-size: 24px;
    font-weight: 300;
    line-height: 1;
    letter-spacing: .02em;
    color: #fff;
    margin-bottom: -5px
}

.syn-lineup-content span {
    font-size: 8px;
    color: rgba(255, 255, 255, .7);
    letter-spacing: .06em;
    display: inline-block;
    margin-bottom: 10px
}

.syn-lineup-content p {
    font-size: 11px;
    letter-spacing: .06em;
    line-height: 1.55;
    color: #fff
}

.syn-lineup-download {
    font-size: 13px;
    color: #7b9f35;
    display: inline-block
}

.syn-lineup-download:hover {
    opacity: .6
}

.syn-lineup-download img {
    width: 9px;
    display: inline-block;
    margin-left: 7.5px
}

.syn-gallery-heading {
    margin-bottom: 80px
}

.syn-gallery-slider {
    position: relative
}

.slick-dotted.slick-slider {
    margin-bottom: 190px
}

.slick-slide {
    transition: all .3s
}

.slick-slide>div {
    margin: 0 30px
}

.slider-item div {
    position: relative;
    width: 100%;
    padding-top: 55.78%;
    margin-bottom: 15px;
    overflow: auto;
    -webkit-overflow-scrolling: touch
}

.slider-item div iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%
}

.slider-item h3 {
    font-size: 16px;
    color: #fff;
    letter-spacing: .08em;
    margin-bottom: 5px
}

.slider-item p {
    font-size: 15px;
    color: #999;
    letter-spacing: .05em
}

.slick-dots li:nth-child(n+4) {
    display: none
}

.slick-slide {
    opacity: 1;
}

.slick-dots {
    bottom: -75px;
    left: -4px
}

.slick-next,
.slick-prev {
    width: 40px;
    height: 52px;
    top: auto;
    bottom: -122px;
    z-index: 90
}

.slick-prev {
    left: 33%
}

.slick-next {
    right: 33%
}

.slick-next:before,
.slick-prev:before {
    position: absolute;
    content: "";
    width: 24px;
    height: 24px;
    border-top: 1px solid #7b9f35;
    top: 14px
}

.slick-prev:before {
    border-left: 1px solid #7b9f35;
    transform: rotate(-45deg);
    right: 0
}

.slick-next:before {
    border-right: 1px solid #7b9f35;
    transform: rotate(45deg);
    left: 0
}

.slick-dots li {
    margin: 0 19px
}

.slick-dots li button {
    width: 30px;
    height: 30px
}

.slick-dots li button:before {
    content: "○";
    font-size: 10px;
    color: #7b9f35;
    opacity: 1;
    top: 5px;
    left: 5px
}

.slick-dots li.slick-active button:before {
    content: "●";
    color: #7b9f35
}

.syn-studio-wrapper {
    padding-bottom: 230px;
    padding-top: 110px
}

.syn-studio-heading {
    margin-bottom: 78px
}

.syn-studio-heading h2 {
    font-size: 80px
}

.syn-studio-tabs {
    width: 1160px;
    max-width: calc(100% - 70px);
    margin: 0 auto;
    text-align: center
}

.syn-studio-tabs input[name=tab_item] {
    display: none
}

.tab_item {
    display: inline-block;
    font-size: 21px;
    color: #666;
    letter-spacing: .04em;
    line-height: 1;
    font-weight: 300;
    cursor: pointer;
    transition: all .3s
}

.tab_item:hover {
    color: #7b9f35
}

.tab_item_basic {
    padding-right: 32px;
    border-right: 1px solid #999
}

.tab_item_pro {
    padding-left: 33px
}

.syn-studio-tab {
    width: 1160px;
    max-width: calc(100% - 70px);
    margin: 41px auto 0;
    background-color: #414141;
    color: #fff;
    opacity: 0;
    display: none;
    text-align: left;
    transition: all .3s
}

#basic:checked~#tab_basic,
#professional:checked~#tab_professional {
    display: block;
    animation: tabchange 1s forwards
}

.syn-studio-tabs input:checked+.tab_item {
    color: #7b9f35
}

.syn-studio-content {
    width: 900px;
    max-width: calc(100% - 50px);
    margin: 0 auto 58.5px;
    padding-top: 90px;
    display: flex;
    justify-content: space-between
}

.syn-studio-function {
    background-color: #535353;
    margin: 30px 0;
    padding: 22.5px 13px 19px 18px;
    font-size: 11px
}

.syn-studio-text {
    width: 50%;
    font-size: 13px;
    line-height: 1.8;
    letter-spacing: .075em
}

.syn-studio-text-pro p:first-child {
    margin-bottom: 37.5px
}

.syn-studio-environment {
    width: 40.61%
}

.syn-studio-environment h3 {
    font-size: 18px;
    margin-bottom: 15.7px
}

.syn-studio-environment table {
    width: 100%;
    border-collapse: collapse;
    margin-bottom: 24px
}

.syn-studio-environment tr {
    border-bottom: 1px solid #555
}

.syn-studio-environment tr:first-child {
    border-top: 1px solid #555
}

.syn-studio-environment tr td {
    color: #fff;
    font-size: 11px;
    padding-top: 20px;
    padding-bottom: 20px;
    letter-spacing: .095em;
    line-height: 1.6;
    vertical-align: top
}

.syn-studio-environment tr td:first-child {
    width: 114px;
    padding-right: 27px;
    font-weight: 600
}

.syn-studio-environment tr td:last-child {
    font-size: 10px
}

.syn-studio-install {
    text-align: right
}

.syn-studio-install a {
    font-size: 12px;
    color: #7b9f35;
    letter-spacing: .06em
}

.syn-studio-install a:hover {
    opacity: .6
}

.syn-studio-install a img {
    width: 9px;
    display: inline-block;
    margin-left: 7.5px
}

.syn-studio-bottom {
    padding-bottom: 100px;
    text-align: center
}

.syn-studio-bottom h3 {
    font-size: 35px;
    font-weight: 300;
    letter-spacing: .03em;
    margin-bottom: 29px
}

.syn-studio-bottom div {
    width: 900px;
    max-width: calc(100% - 50px);
    margin: 0 auto;
    display: flex;
    justify-content: space-between
}

.syn-studio-bottom div a {
    width: 31.7%;
    height: 99px;
    line-height: 99px;
    color: #7b9f35;
    border: 1px solid #7b9f35;
    position: relative
}

.syn-studio-bottom div a:hover {
    border: 1px solid rgba(0, 0, 0, 0)
}

.syn-studio-bottom div a img {
    display: inline-block;
    vertical-align: middle
}

.syn-studio-bottom div a:first-child img {
    width: 26.5px;
    margin-top: -4px;
    margin-right: 19.5px
}

.syn-studio-bottom div a:nth-child(2) img {
    width: 47.5px;
    margin-right: 6px
}

.syn-studio-bottom div a:last-child img {
    width: 34px;
    margin-top: -7px;
    margin-right: 12.5px
}

.syn-studio-bottom div a span {
    display: inline-block;
    width: 100%;
    height: 100%;
    position: absolute;
    z-index: -1;
    top: 0;
    left: 0;
    overflow: hidden
}

.syn-studio-bottom div a span:after,
.syn-studio-bottom div a span:before {
    position: absolute;
    content: "";
    background-color: #30ab33;
    transition: all .25s
}

.bottomRight:before,
.topLeft:before {
    width: 3px;
    height: 100%
}

.bottomRight:after,
.topLeft:after {
    width: 100%;
    height: 3px
}

.topLeft:before {
    bottom: -100%;
    left: 0
}

.topLeft:after {
    left: -100%;
    top: 0
}

.bottomRight:before {
    top: -100%;
    right: 0
}

.bottomRight:after {
    right: -100%;
    bottom: 0
}

.syn-studio-bottom div a:hover .topLeft:before {
    bottom: 0
}

.syn-studio-bottom div a:hover .topLeft:after {
    left: 0
}

.syn-studio-bottom div a:hover .bottomRight:before {
    top: 0
}

.syn-studio-bottom div a:hover .bottomRight:after {
    right: 0
}

.syn-studio-bottom-pro div {
    justify-content: center
}

.syn-studio-bottom-pro div a {
    margin-right: 11px;
    margin-left: 11px
}

.syn-studio-bottom-pro div a img {
    width: 14px !important;
    display: inline-block;
    margin-left: 7.5px;
    margin-right: 0 !important
}

.syn-studio-bottom-pro div a:last-child img {
    margin-top: -4px
}

h1 {
    font-weight: 600
}

body[class*=page-template-page-privacy-policy] .header-lang ul li.zh-CN {
    display: list-item;
    margin-top: 15px
}

#privacypolicymain {
    background-color: #333
}

#privacypolicymain-mv {
    background-color: #333
}

.privacypolicymain-mv-wrapper {
    width: 900px;
    max-width: calc(100% - 50px);
    margin: 0 auto;
    padding-top: 240px;
    padding-bottom: 120px
}

.privacypolicymain-mv-content {
    display: flex;
    justify-content: space-between
}

.privacypolicymain-mv-title h2 {
    font-size: 80px;
    color: #fff;
    font-weight: 400
}

.privacypolicymain-mv-title p {
    font-size: 14px;
    color: #999;
    margin-top: -10px;
    font-weight: 100
}

.privacypolicymain-mv-text {
    margin-top: 26px
}

.privacypolicymain-mv-text p {
    font-size: 14px;
    color: #fff;
    line-height: 2.5
}

.privacypolicymain-mv-text a {
    color: #3391fd
}

.privacypolicymain-mv-text a:hover {
    opacity: .6
}

.privacypolicymain-mv-text a img {
    display: inline-block;
    width: 10px;
    margin: 0 3px
}

.privacypolicymain-article-wrapper {
    width: 900px;
    max-width: calc(100% - 50px);
    padding-bottom: 200px;
    margin: 0 auto
}

.privacypolicymain-article-content {
    display: flex;
    justify-content: space-between
}

.privacypolicymain-article-text {
    padding: 28px 8% 28px;
    margin: 0 auto;
    transition: .3s;
    color: #fff;
    background-color: #414141
}

.privacypolicymain-article-text p {
    line-height: 1.77;
    margin: revert
}

.privacypolicymain-article-text ul {
    list-style-type: disc
}

.privacypolicymain-article-text ul,
.privacypolicymain-article-text ol {
    margin-left: 14px
}

.privacypolicymain-article-text ul[type="1"],
.privacypolicymain-article-text ol[type="1"] {
    list-style-type: demical
}

.privacypolicymain-article-text ul[type=a],
.privacypolicymain-article-text ol[type=a] {
    list-style-type: lower-latin
}

.privacypolicymain-article-text li {
    line-height: initial;
    list-style-type: unset
}

.privacypolicymain-article-text h1,
.privacypolicymain-article-text h2,
.privacypolicymain-article-text h3 {
    line-height: 1.77;
    font-size: initial;
    margin: initial
}

body[class*=page-template-page-vocoflex-eula] .header-lang ul li.zh-CN {
    display: list-item;
    margin-top: 15px
}

#vocoflexeulamain {
    background-color: #333
}

#vocoflexeulamain-mv {
    background-color: #333
}

.vocoflexeulamain-mv-wrapper {
    width: 900px;
    max-width: calc(100% - 50px);
    margin: 0 auto;
    padding-top: 240px;
    padding-bottom: 120px
}

.vocoflexeulamain-mv-content {
    display: flex;
    justify-content: space-between
}

.vocoflexeulamain-mv-title h2 {
    font-size: 80px;
    color: #fff;
    font-weight: 400
}

.vocoflexeulamain-mv-title p {
    font-size: 14px;
    color: #999;
    margin-top: -10px;
    font-weight: 100
}

.vocoflexeulamain-mv-text {
    margin-top: 26px
}

.vocoflexeulamain-mv-text p {
    font-size: 14px;
    color: #fff;
    line-height: 2.5
}

.vocoflexeulamain-mv-text a {
    color: #3391fd
}

.vocoflexeulamain-mv-text a:hover {
    opacity: .6
}

.vocoflexeulamain-mv-text a img {
    display: inline-block;
    width: 10px;
    margin: 0 3px
}

.vocoflexeulamain-article-wrapper {
    width: 900px;
    max-width: calc(100% - 50px);
    padding-bottom: 200px;
    margin: 0 auto
}

.vocoflexeulamain-article-content {
    display: flex;
    justify-content: space-between
}

.vocoflexeulamain-article-text {
    padding: 28px 8% 28px;
    margin: 0 auto;
    transition: .3s;
    color: #fff;
    background-color: #414141
}

.vocoflexeulamain-article-text p {
    line-height: 1.77;
    margin: revert
}

.vocoflexeulamain-article-text ul {
    list-style-type: disc
}

.vocoflexeulamain-article-text ol {
    list-style-type: decimal
}

.vocoflexeulamain-article-text ol li ol.brackets {
    padding: 0 0 0 2em;
    margin: 0
}

.vocoflexeulamain-article-text ol li ol.brackets li {
    list-style-type: none;
    list-style-position: inside;
    counter-increment: cnt
}

.vocoflexeulamain-article-text ol li ol.brackets li::before {
    display: marker;
    content: "(" counter(cnt) ") "
}

.vocoflexeulamain-article-text ul,
.vocoflexeulamain-article-text ol {
    margin-left: 14px
}

.vocoflexeulamain-article-text ul[type="1"],
.vocoflexeulamain-article-text ol[type="1"] {
    list-style-type: demical
}

.vocoflexeulamain-article-text ul[type=a],
.vocoflexeulamain-article-text ol[type=a] {
    list-style-type: lower-latin
}

.vocoflexeulamain-article-text li {
    margin-bottom: 10px;
    line-height: initial;
    list-style-type: unset
}

.vocoflexeulamain-article-text h1,
.vocoflexeulamain-article-text h2,
.vocoflexeulamain-article-text h3 {
    line-height: 1.77;
    font-size: initial;
    margin: initial
}

body[class*=page-template-page-terms] .header-lang ul li.zh-CN {
    display: list-item;
    margin-top: 15px
}

body[class*=page-template-page-download-free-trials] .header-lang ul li.zh-CN {
    display: list-item;
    margin-top: 15px
}

#termsmain {
    background-color: #333
}

#termsmain-mv {
    background-color: #333
}

.termsmain-mv-wrapper {
    width: 900px;
    max-width: calc(100% - 50px);
    margin: 0 auto;
    padding-top: 240px;
    padding-bottom: 120px
}

.termsmain-mv-body {
    color: #fff;
    margin-top: 60px;
    width: 100%
}

.termsmain-mv-body h3 {
    font-size: 24px;
    font-weight: 500;
    margin-bottom: 1em
}

.termsmain-mv-body p {
    font-weight: 100;
    font-size: 16px;
    margin-bottom: 40px;
    text-align: center
}

.termsmain-mv-content {
    display: flex;
    justify-content: space-between
}

.termsmain-mv-title h2 {
    font-size: 80px;
    color: #fff;
    font-weight: 400
}

.termsmain-mv-title p {
    font-size: 16px;
    color: #999;
    margin-top: -10px;
    font-weight: 100
}

.termsmain-mv-text {
    margin-top: 26px
}

.termsmain-mv-text p {
    font-size: 14px;
    color: #fff;
    line-height: 2.5
}

.termsmain-mv-text a {
    color: #3391fd
}

.termsmain-mv-text a:hover {
    opacity: .6
}

.termsmain-mv-text a img {
    display: inline-block;
    width: 10px;
    margin: 0 3px
}

.termsmain-glt-wrapper {
    width: 900px;
    max-width: calc(100% - 50px);
    margin: 0 auto 100px
}

.termsmain-glt-wrapper h2 {
    font-size: 70px;
    text-align: center;
    color: #fff;
    margin-bottom: 40px;
    font-weight: 400
}

.termsmain-glt-wrapper h4 {
    font-size: 14px;
    text-align: center;
    color: #fff;
    letter-spacing: .107em;
    font-weight: 300;
    transform: translateY(-40px);
    opacity: .9
}

.termsmain-glt-contents {
    display: flex;
    justify-content: space-between
}

.termsmain-glt-text {
    width: 80%;
    margin: 0 auto;
    color: #fff
}

.termsmain-glt-text h3 {
    font-size: 36px;
    line-height: 1.7;
    margin-top: -8px;
    margin-bottom: 30px
}

.termsmain-glt-text ul li {
    position: relative;
    margin-bottom: 50px;
    line-height: 1.6;
    font-size: 15px
}

.termsmain-glt-text ul li span:first-of-type {
    position: absolute;
    left: -30px;
    top: -3px;
    color: #fff;
    font-size: 18px;
    width: 24px;
    text-align: center;
    transform: translateX(4px)
}

.termsmain-glt-text p {
    margin-bottom: 20px
}

.termsmain-ut-wrapper {
    width: 900px;
    max-width: calc(100% - 50px);
    padding-bottom: 1px;
    margin: 0 auto 120px
}

.termsmain-ut-wrapper h2 {
    font-size: 80px;
    text-align: center;
    color: #fff;
    margin-bottom: 40px;
    font-weight: 400
}

.termsmain-ut-text {
    color: #fff
}

.termsmain-ut-text h3 {
    display: block;
    width: 100%;
    height: 96px;
    padding: 0 24px;
    margin-bottom: 20px;
    font-size: 36px;
    font-weight: 400;
    line-height: 96px;
    background-color: #414141;
    -moz-user-select: none;
    -webkit-user-select: none;
    user-select: none
}

.termsmain-ut-text ul {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-bottom: 24px
}

.termsmain-ut-text ul li {
    font-size: 15px;
    line-height: 1.77
}

.termsmain-ut-text ul li {
    display: block;
    position: relative;
    width: 292px;
    height: 270px;
    padding: 38px 25px;
    background-color: #414141
}

.termsmain-ut-text ul li span:first-of-type {
    position: absolute;
    top: -67px;
    font-size: 34px
}

.termsmain-ut-text ul li span:last-of-type {
    position: absolute;
    top: -37px;
    right: 20px;
    width: 74px;
    height: 74px;
    font-size: 34px;
    line-height: 74px;
    text-align: center;
    border-radius: 999px;
    background-color: #414141;
    opacity: 1
}

.termsmain-ut-text ul.youcannot li span {
    padding-left: 2px;
    font-size: 38px
}

.termsmain-ut-text ul.youcan li {
    border-top: 74px solid #7b9f35
}

.termsmain-ut-text ul.youcannot li {
    border-top: 74px solid #b73c3c
}

@media screen and (max-width: 950px) {
    .termsmain-ut-text ul li {
        width: 100%;
        height: 240px
    }
}

.termsmain-licenses-wrapper {
    width: 900px;
    max-width: calc(100% - 50px);
    padding-bottom: 200px;
    margin: 0 auto
}

.termsmain-licenses-wrapper h2 {
    font-size: 80px;
    text-align: center;
    color: #fff;
    margin-bottom: 40px;
    font-weight: 400
}

.termsmain-licenses-box {
    color: #fff
}

.termsmain-licenses-box {
    display: block;
    width: 100%;
    margin-bottom: 4px;
    font-size: 16px;
    line-height: 1;
    background-color: #414141
}

.termsmain-licenses-box>h3 span {
    position: absolute;
    top: auto;
    right: 25px;
    font-size: 20px;
    transition: .3s
}

.termsmain-licenses-box:not(.box-closed)>h3 span {
    transform: rotate(180deg);
    color: #7b9f35
}

.termsmain-licenses-box>h3 {
    position: relative;
    display: flex;
    align-items: center;
    z-index: 1;
    width: 100%;
    min-height: 70px;
    padding: 14px 52px 14px 24px;
    margin: 0px;
    font-size: 16px;
    line-height: 1.4;
    border: 1px solid #7b9f35;
    background-color: #414141;
    -moz-user-select: none;
    -webkit-user-select: none;
    user-select: none
}

.termsmain-licenses-box>h3.js-is-stuck {
    position: absolute;
    left: 0;
    top: 100%
}

.termsmain-licenses-box>h3.js-is-sticky::after,
.termsmain-licenses-box>h3.js-is-stuck::after {
    content: "";
    position: absolute;
    top: -301px;
    left: -1px;
    width: calc(100% + 2px);
    height: 300px;
    background-color: #333;
    transition: .3s
}

.termsmain-licenses-box.box-closed>h3 {
    border: 1px solid rgba(0, 0, 0, 0)
}

.termsmain-licenses-text {
    padding: 28px 8% 28px;
    margin: 0 auto;
    overflow-y: auto;
    height: 780px;
    transition: .3s
}

.termsmain-licenses-box.box-closed .termsmain-licenses-text {
    height: 0;
    padding-top: 0;
    padding-bottom: 0
}

.termsmain-licenses-text p {
    line-height: 1.77;
    margin: revert
}

.termsmain-licenses-text ul,
.termsmain-licenses-text ol {
    margin-left: 14px
}

.termsmain-licenses-text ul[type="1"],
.termsmain-licenses-text ol[type="1"] {
    list-style-type: demical
}

.termsmain-licenses-text ul[type=a],
.termsmain-licenses-text ol[type=a] {
    list-style-type: lower-latin
}

.termsmain-licenses-text li {
    line-height: initial;
    list-style-type: unset
}

.termsmain-licenses-text h1,
.termsmain-licenses-text h2,
.termsmain-licenses-text h3 {
    line-height: 1.77;
    font-size: initial;
    margin: initial
}

.download-buttons {
    display: flex;
    flex-direction: row;
    align-items: center;
    margin-top: 20px;
    width: 100%
}

.download-buttons .button {
    padding-left: 40px;
    padding-right: 40px;
    height: 48px;
    background: #349736;
    border-radius: 2px;
    margin-bottom: 8px;
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: "Noto Sans", "Noto Sans CJK JP", sans-serif;
    font-style: normal;
    font-weight: 700;
    font-size: 14px;
    line-height: 22px;
    margin: auto 10px;
    cursor: pointer
}

.download-buttons .button:hover {
    background: #014d01
}

.download-buttons input[type=text] {
    height: 48px
}



@keyframes slide-up {
    0.0% {
        top: 150%;
        opacity: 0
    }
    100% {
        top: 100%;
        opacity: 1
    }
}

/* Style for the custom menu tag */
.header-menu .menu-tag {
    display: inline-block;
    margin-left: 8px;
    padding: 2px 6px;
    font-size: 11px;
    font-weight: bold;
    color: #000;
    background-color: #79da25; 
    border-radius: 3px;
    vertical-align: middle;
    text-transform: uppercase;
}

/* Ensure the link handles the tag alignment */
.header-menu a {
    display: flex;
    align-items: center;
}