@charset utf-8;
/*
Theme Name: vt
*/

@font-face {
    font-family: "Roboto-Black";
    src: url("fonts/Roboto-Black.ttf") format("truetype"),
         url("fonts/Roboto-Black.woff2") format("woff2"),
         url("fonts/Roboto-Black.woff") format("woff"),
         url("fonts/Roboto-Black.eot") format("embedded-opentype"),
         url("fonts/Roboto-Black.svg") format("svg"); 
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: "Roboto-BlackItalic";
    src: url("fonts/Roboto-BlackItalic.ttf") format("truetype"),
         url("fonts/Roboto-BlackItalic.woff2") format("woff2"),
         url("fonts/Roboto-BlackItalic.woff") format("woff"),
         url("fonts/Roboto-BlackItalic.eot") format("embedded-opentype"),
         url("fonts/Roboto-BlackItalic.svg") format("svg"); 
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: "Roboto-Bold";
    src: url("fonts/Roboto-Bold.ttf") format("truetype"),
         url("fonts/Roboto-Bold.woff2") format("woff2"),
         url("fonts/Roboto-Bold.woff") format("woff"),
         url("fonts/Roboto-Bold.eot") format("embedded-opentype"),
         url("fonts/Roboto-Bold.svg") format("svg"); 
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: "Roboto-BoldItalic";
    src: url("fonts/Roboto-BoldItalic.ttf") format("truetype"),
         url("fonts/Roboto-BoldItalic.woff2") format("woff2"),
         url("fonts/Roboto-BoldItalic.woff") format("woff"),
         url("fonts/Roboto-BoldItalic.eot") format("embedded-opentype"),
         url("fonts/Roboto-BoldItalic.svg") format("svg"); 
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: "Roboto-Italic";
    src: url("fonts/Roboto-Italic.ttf") format("truetype"),
         url("fonts/Roboto-Italic.woff2") format("woff2"),
         url("fonts/Roboto-Italic.woff") format("woff"),
         url("fonts/Roboto-Italic.eot") format("embedded-opentype"),
         url("fonts/Roboto-Italic.svg") format("svg"); 
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: "Roboto-Light";
    src: url("fonts/Roboto-Light.ttf") format("truetype"),
         url("fonts/Roboto-Light.woff2") format("woff2"),
         url("fonts/Roboto-Light.woff") format("woff"),
         url("fonts/Roboto-Light.eot") format("embedded-opentype"),
         url("fonts/Roboto-Light.svg") format("svg"); 
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: "Roboto-LightItalic";
    src: url("fonts/Roboto-LightItalic.ttf") format("truetype"),
         url("fonts/Roboto-LightItalic.woff2") format("woff2"),
         url("fonts/Roboto-LightItalic.woff") format("woff"),
         url("fonts/Roboto-LightItalic.eot") format("embedded-opentype"),
         url("fonts/Roboto-LightItalic.svg") format("svg"); 
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: "Roboto-Medium";
    src: url("fonts/Roboto-Medium.ttf") format("truetype"),
         url("fonts/Roboto-Medium.woff2") format("woff2"),
         url("fonts/Roboto-Medium.woff") format("woff"),
         url("fonts/Roboto-Medium.eot") format("embedded-opentype"),
         url("fonts/Roboto-Medium.svg") format("svg"); 
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: "Roboto-MediumItalic";
    src: url("fonts/Roboto-MediumItalic.ttf") format("truetype"),
         url("fonts/Roboto-MediumItalic.woff2") format("woff2"),
         url("fonts/Roboto-MediumItalic.woff") format("woff"),
         url("fonts/Roboto-MediumItalic.eot") format("embedded-opentype"),
         url("fonts/Roboto-MediumItalic.svg") format("svg"); 
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: "Roboto-Regular";
    src: url("fonts/Roboto-Regular.ttf") format("truetype"),
         url("fonts/Roboto-Regular.woff2") format("woff2"),
         url("fonts/Roboto-Regular.woff") format("woff"),
         url("fonts/Roboto-Regular.eot") format("embedded-opentype"),
         url("fonts/Roboto-Regular.svg") format("svg"); 
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: "Roboto-Thin";
    src: url("fonts/Roboto-Thin.ttf") format("truetype"),
         url("fonts/Roboto-Thin.woff2") format("woff2"),
         url("fonts/Roboto-Thin.woff") format("woff"),
         url("fonts/Roboto-Thin.eot") format("embedded-opentype"),
         url("fonts/Roboto-Thin.svg") format("svg"); 
    font-weight: normal;
    font-style: normal;
}
:root {
    --font-size-mobileHeader:26px;
    --font-size-mobileBody:12px;
    --text-text-Primary-Blue-P100: #718ADF;
    --text-text-Neutral-N60: #B3B9C4;
}
*,
*:before,
*:after{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;}
html{background:none;-webkit-text-size-adjust:100%;height:100%;}
body{ background: #040406; font-size:var(--font-size-bodyLarge); color:var(--text-text-white-static); font-weight:normal;font-family: "Roboto-Regular";}
a{color:#031F45;text-decoration:none;outline-style:none;}
a:hover{color:#031F45;text-decoration:none;}
.a_other{color:#0A36C7;}
.a_other:hover{color:#0A36C7;}
p{line-height:var(--Body-Large-R);margin:0px 0px 23px;}
li{list-style:none outside none;}
strong,
b{font-weight:normal; font-family: "Roboto-Bold";}
em,
i{font-style:normal;}
strong em,
em strong{font-style:normal;font-weight:normal; font-family: "Roboto-Bold";}
h1,
h2,
h3,
h4,
h5,
h6{ font-weight:normal; margin-bottom:30px;font-family: "Roboto-Bold";}
h1{font-size:var(--font-size-displayLarge);line-height:var(--Display-Large-S);}
h2{font-size:var(--font-size-displayMedium);line-height:var(--Display-Medium-S);}
h3{font-size:var(--font-size-headlineLarge);line-height:var(--Headline-Large-S);}
h4{font-size:var(--font-size-headlineMedium);line-height:var(--Headline-Medium-S);}
h5{font-size:var(--font-size-headlineSmall);line-height:var(--Headline-Small-S);}
h6{font-size:var(--font-size-titleLarge);line-height:var(--Title-Large-S);}
img{max-width:100%;height:auto;vertical-align:middle;}
hr{clear:both;margin:40px 0;border:0;border-bottom:0;padding:0px;width:100%;background:#e1e0da;height:1px;}
pre{white-space:pre-wrap;white-space:-moz-pre-wrap;white-space:-pre-wrap;white-space:-o-pre-wrap;word-wrap:break-word;}
h1 i,
h2 i,
h3 i,
h4 i,
h5 i,
h6 i{color: #00F0FF;}

.public_wrapper{margin: 0 auto;}
.tableBox{padding: 40px 0 0; width:100%;height:100%;}
.table_cellBox{display:table-cell;vertical-align:middle;}
.inner{max-width:1160px;padding-left:20px;padding-right:20px;margin:0 auto;}
.flex{display: flex;justify-content: space-between;align-items: center;}
.title_merge{display: inline-block;}
.button{border: 1px solid var(--text-text-white-static);color: var(--text-text-white-static);position: relative;z-index: 1;overflow: hidden;background:transparent;border-radius:8px; padding:16px 40px; display:inline-block; color:#fff; font-size:var(--font-size-titleLarge);line-height:var(--Title-Large-S);text-decoration:none; font-family: "Roboto-Bold";-webkit-tap-highlight-color: transparent;transition: all .3s linear;width: 100%;max-width: -moz-max-content;max-width: -webkit-max-content;}
.button:hover{color: var(--text-text-white-static);border: 1px solid var(--functional-tints-blue);background: var(--functional-tints-primary-bg);}
.button:active{color: var(--text-text-white-static);border: 1px solid var(--functional-tints-blue);background: var(--functional-blue-2);}
.blue_border_button{border: 1px solid var(--functional-tints-blue);padding: 12px 24px;color: var(--text-text-primary);font-size: var(--font-size-titleMedium);line-height: var(--Title-Medium-S);text-decoration: none;font-family: "Roboto-Bold";-webkit-tap-highlight-color: transparent;transition: all .3s linear;width: 100%;max-width: -moz-max-content;max-width: -webkit-max-content;}
.blue_border_button:hover{border: 1px solid var(--functional-tints-blue);background: var(--functional-tints-primary-bg);}
.blue_border_button:active{border: 1px solid var(--functional-tints-blue);background: var(--functional-blue-2);}
.white_button{position: relative;z-index: 1;overflow: hidden;background: var(--text-text-primary); border-radius:8px; padding:16px 40px; display:inline-block; color:#000; font-size:var(--font-size-titleLarge);line-height:var(--Title-Large-S);text-decoration:none; font-family: "Roboto-Bold";-webkit-tap-highlight-color: transparent;transition: all .3s linear;width: 100%;max-width: -moz-max-content;max-width: -webkit-max-content;}
.white_button:hover{background: var(--functional-tints-blue);color: var(--text-text-white-static);}
.white_button:active{background: var(--functional-blue-5);color: var(--text-text-white-static);}
.blue_button{position: relative;z-index: 1;overflow: hidden;background:var(--functional-tints-blue); border-radius:8px; padding:16px 40px; display:inline-block; color:var(--text-text-primary); font-size:var(--font-size-titleLarge);line-height:var(--Title-Large-S);text-decoration:none; font-family: "Roboto-Bold";-webkit-tap-highlight-color: transparent;    transition: all .3s linear;width: 100%;max-width: -moz-max-content;max-width: -webkit-max-content;}
.blue_button:hover{background: var(--functional-tag-border-blue);color: var(--text-text-white-static);}
.blue_button:active{background: var(--functional-blue-5);color: var(--text-text-white-static);}

a .textindent{position: absolute;text-indent: -9999px;display: none;}

.post_list_turn_item{color:var(--text-text-tertiary);}
.post_list_turn_item ul{display: flex;align-items: center;justify-content: center;gap: 5px;}
.post_list_turn_item li.first a{border: none;}
.post_list_turn_item li .page-numbers{font-size: 13px;width: 32px;height: 32px;display: flex;align-items: center;justify-content: center;border-radius: 8px;border: 1px solid var(--fill-brand-bg);background: var(--fill-page-primary);}
.post_list_turn_item li .page-numbers.prev{border: none;}
.post_list_turn_item li .page-numbers.dots{border: none;}
.post_list_turn_item li .current{border: none;color: var(--text-text-special);background:var(--text-text-blue-cyan);}
.post_list_turn_item a{color: var(--text-text-tertiary);width: 32px;height: 32px;border-radius: 8px;display: flex;align-items: center;justify-content: center;}
.post_list_turn_item li.last a{border: 1px solid var(--fill-brand-bg);}

@media (max-width: 980px) {
    h1{font-size: var(--font-size-displayMedium);line-height: var(--Display-Medium-S);}
    h2{font-size:var(--font-size-headlineLarge);line-height:var(--Headline-Large-S);}
}
@media (max-width: 768px) {
    .button{padding: 12px 32px;font-size: var(--font-size-titleMedium);line-height: var(--Title-Medium-S);}
    .white_button{padding: 12px 32px;font-size: var(--font-size-titleMedium);line-height: var(--Title-Medium-S);}
    .blue_button{padding: 12px 32px;font-size: var(--font-size-titleMedium);line-height: var(--Title-Medium-S);}
}
@media (max-width: 500px) {
    h1{font-size: var(--font-size-headlineLarge);line-height: var(--Headline-Large-S);}
    h2{font-size: var(--font-size-headlineSmall);line-height: var(--Headline-Small-S);;}

    .button{padding: 8px 24px;font-size: var(--font-size-titleSmall);line-height: var(--Title-Small-S);border-radius: 4px;}
    .white_button{padding: 8px 24px;font-size: var(--font-size-titleSmall);line-height: var(--Title-Small-S);border-radius: 4px;}
    .blue_button{padding: 8px 24px;font-size: var(--font-size-titleSmall);line-height: var(--Title-Small-S);border-radius: 4px;}

}
/* hide input icon of safari  */
input::-webkit-credentials-auto-fill-button {
    display: none !important;
    visibility: hidden;
    pointer-events: none;
    position: absolute; 
    right: 0;
}
input,
button,
textarea{outline-style:none;}

/* new homepage using*/
.show_fade_in{opacity: 1 !important;}
.init_fade{opacity: 0;transition: all 2s;}


.grecaptcha-badge{
    display: none !important;
}

@-webkit-keyframes sdb {
	0% {
		-webkit-transform: translate(0, 0);
		opacity: 0;
	}
	50% {
		opacity: 1;
	}
	100% {
		-webkit-transform: translate(0, 10px);
		opacity: 0;
	}
}
@keyframes sdb {
	0% {
		transform: translate(0, 0);
		opacity: 0;
	}
	50% {
		opacity: 1;
	}
	100% {
		transform: translate(0, 10px);
		opacity: 0;
	}
}
.srcollBtn{position: absolute;bottom: 100px;left: 0;right: 0;text-align: center;z-index: 1;}
.srcollBtn a{-webkit-animation: sdb 1.5s infinite;animation: sdb 1.5s infinite;display: inline-block;}
@media (max-width: 768px) {
    .srcollBtn{bottom: 60px;}
    .srcollBtn a{max-width: 25px;}
}