/*.content-all-windows{padding-top:15px;}*/
.Introduce-core{
	width: 100%;
	height: auto;
}
.In-core-head{
	color: var(--preset-f);
	width: 100%;
	height: auto;
}
.head-inside video{
	width: 100%;
	height: 100%;
	object-fit: cover;
	position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
	z-index: 1;
	border-radius: var(--radius);
}
.head-inside video#edge_fullscreen{
	height: auto;
	z-index: 0;
	filter: blur(15px);
	-webkit-filter: blur(15px);
}
.In-core-head .head-inside::before{
	content: '';
	width: 100%;
	height: 100%;
    background-size: 3px 3px!important;
    max-height: 100%;
	-webkit-background: linear-gradient(0deg,transparent 0%,rgba(0, 0, 0, 0.36) 50%);
	background: linear-gradient(0deg,transparent 0%,rgba(0, 0, 0, 0.36) 50%);
	/*background: rgba(0, 0, 0, 0.18);*/
	position: absolute;
	top: 0;
	left: 0;
	z-index: 2;
	border-radius:var(--radius);
}
.In-core-head .head-inside{
	width: 100%;
	height: auto;
	padding: 10% 0;
	position: relative;
	overflow: hidden;
	background-size: cover;
	border-radius:var(--radius);
}
.In-core-body{
	width: 100%;
	height: auto;
	margin: 25px auto;
}
.In-core-body .body-basically{
	width: 100%;
}
.In-core-body .body-basically .tables{
	margin: 35px auto;
	color: var(--preset-6);
}
.body-basically h1{
	font-weight: 300;
	margin: 5% auto;
	padding: 15px;
}
/*.body-basically h3,*/
.body-basically h2{
	color: inherit;
	text-align: left;
	margin: 3rem auto auto;
}

.body-basically table{
	width: 100%;
	border-collapse: collapse;
}
.body-basically table td{
	font-size: 14px;
	line-height: 23px;
	color: var(--preset-8);
}
.body-basically table lable{
	width: 50%;
	display: block;
	margin: 0 auto;
	text-align: left;
}
.body-basically table th{
	padding-top: 15px;
}
.body-basically table th i{
	font-size: 12px;
	font-style: normal;
	font-weight: normal;
}
.body-basically .Introduce{
	color:var(--preset-6);
	font-family: var(--font-serif);
	margin: 35px auto;
	text-align: left;
}
.body-basically .Introduce del{
	color: var(--preset-9);
}
/*.body-basically .Introduce img{*/
/*	border-radius:var(--radius);*/
/*}*/
.body-basically .Introduce p{
	text-align: left;
	line-height: 27px;
	font-size: var(--min-size-rem);
	font-size: calc(1.1px * var(--size,var(--min-size)));
}
.body-basically .Introduce p a:hover{ text-decoration: overline;}
.body-basically .Introduce p a{
	color: var(--theme-color);
}
.In-core-foot{
	color: var(--preset-4a);
	width: 100%;
	height: auto;
	border: 1px solid rgba(218, 218, 218, 0.52);
	box-sizing: border-box;
	border-radius:var(--radius);
}
.In-core-foot .foot-inside{
	background-color: var(--preset-f);
	width: 100%;
	height: 169px;
	padding: 50px 0;
}
.In-core-foot em{
	width: 230px;
	height: 93px;
	display: block;
	/*background: url('https://img.2broear.com/private/profileEnder.png') no-repeat;*/
	margin: 38px auto 0;
}
.In-core-foot img{
	display: block;
	width: 100%;
	height: 269px;
	border: 1px solid rgba(218, 218, 218, 0.52);
	box-sizing: border-box;
}
#end-introduce-all{
	letter-spacing: 12px;
}
#end-introduce{
	color:var(--theme-color);
	display:inline-block;
	height:auto;
	width:auto;
}
.inside_of_block .logo-area #desBside{
	display: none;
}
.inside_of_block .logo-area #desAside{
	display: none;
}
.inside_of_block .logo-area .HeaderLogo svg{
	/*background: url('https://img.2broear.com/svg/v2-115x41-XTY.svg');*/
}


.In-core-head .user_info.pause{
	top: 0;
	opacity: 1;
}
.In-core-head .user_info.playing{
	opacity: 0;
	top: 15px;
}
.In-core-head .user_info{
	opacity: 1;
	position: relative;
	top: 0;
	z-index: 999;
	transition: none;
    text-align: left;
    padding: 15px 25px;
    border-radius: inherit;
    background: -webkit-linear-gradient(180deg,rgba(255, 255, 255, 0) -10%,var(--preset-e) 100%);
    background: linear-gradient(-90deg,rgba(255, 255, 255, 0) -10%,var(--preset-e) 100%);
    /*border: 1px solid #fff;*/
    /*box-sizing: border-box;*/
    background: linear-gradient(90deg, var(--mirror) 50%, #fff);
}
.In-core-head span{
	display: block;
	position: relative;
	z-index: 3;
}
.In-core-head #head-photo:before{
    content: "";
	width: 100%;
	height: 100%;
	border-radius: inherit;
	background: rgb(0 0 0 / 10%);
	position: absolute;
	top: 0;
	left: 0;
	z-index: -1;
	animation: profileScale 1.8s ease infinite normal;
}
.In-core-head #head-photo{
	width: 66px;
	height: auto;
	max-width: 23%;
	border-radius: 50%;
	padding: 5px;
	margin: 0 auto;
	background: rgba(255,255,255,0.52);
	animation: profileLoop 1.8s ease infinite alternate;
}
.In-core-head #head-photo img{
    width: 100%;
    max-height: 100%;
    border-radius: inherit;
    display: block;
}
.In-core-head #head-photo em{
	width: 100%;
	height: 100%;
	border-radius: inherit;
	display: block;
	/*background: url('https://img.2broear.com/private/glitchProfile/profileGlitch1.gif?ver=glitch1');*/
	background-size: cover;
}
.In-core-head #head-nickname{
	/*margin: auto auto 10px ;*/
	font-size: 1.35rem;
	margin: auto auto 5px ;
	/*font-size: 1.75rem;*/
}
.In-core-head #head-sign{
	font-size: var(--min-size);
	letter-spacing: 3px;
	opacity: .75;
}
@keyframes profileLoop {
	0%{
		background-color: transparent
}
	100%{
		background-color: rgb(0 0 0 / 10%)
}
}
@keyframes profileScale {
	0%{
		transform: scale(0.8);
		opacity: 1;
	}
	100%{
		transform: scale(1.3);
		opacity: 0;
	}
}

.body-basically h1{
    margin: 3% auto auto;
}
.player{ box-shadow: none!important;}
.In-core-head .head-inside{
    min-height: 100px;
}
.In-core-head .head-inside .user_info{
    color: white;
}
.about_blocks{
    color: initial;
    padding: 25px;
    margin-top: 15px;
    background: var(--preset-fa);
    border-radius: var(--radius);
    background: linear-gradient(0deg, var(--mirror) 0, #fff);
    box-shadow: rgba(0,0,0,0.05) 0px 20px 20px;
    border: 2px solid #fff;
}
.about_blocks ul{
    padding: 0;
    margin: auto;
    /*display: flex;*/
    /*flex-flow: row nowrap;*/
    /*justify-content: space-between;*/
    /*align-items: center;*/
    border-radius: inherit;
}
.about_blocks li.video{
    width: 100%;
}
.about_blocks li.intro_left{
    width: 50%;
    /*width: 55%;*/
}
.about_blocks li{
    width: 47%;
    /*width: 42%;*/
    /*color: black;*/
    display: inline-block;
    border-radius: inherit;
    vertical-align: middle;
}

.In-core-head .profile{
    margin: auto auto 25px;
    /*background: var(--preset-e);*/
    border-radius: inherit;
}

.In-core-head #head-photo,
.In-core-head .intro_info{
    display: inline-block;
    vertical-align: middle;
}
.In-core-head .intro_info{
    max-width: 70%;
    text-align: left;
    margin-left: 10px;
    opacity: .75;
}

.about_blocks li.intro_right{
    /*background: var(--preset-fa);*/
    margin-left: 15px;
}
.about_blocks li.intro_right .mbit:before{
    /*color: #d6ece3;*/
    /*opacity: .5;*/
    content: attr(data-mbit);
    position: absolute;
    top: -7px;
    right: 8%;
    font-size: 3rem;
    opacity: 0.05;
    font-weight: bold;
    white-space: nowrap;
    z-index: 0;
}
.about_blocks li.intro_right .mbit{
    position: relative;
    padding: 15px 20px 15px;
    /*overflow: hidden;*/
}
.about_blocks li.intro_right .mbit ol{
    padding: 0;
    margin: auto;
}
.about_blocks li.intro_right .mbit .mbit_intro{
    text-align: left;
    position: relative;
    /*padding-left: 6%;*/
    margin-left: 25px;
}
.about_blocks li.intro_right .mbit .mbit_intro p{
    margin: auto;
    font-size: var(--min-size-rem);
    opacity: .5;
    /*text-align: center;*/
    font-weight: bold;
    /*letter-spacing: 3px;*/
}
.about_blocks li.intro_right .mbit .mbit_intro p sup{
    font-size: 12px;
    font-style: italic;
}
.about_blocks li.intro_right .mbit .mbit_intro a:hover{
    background: rgb(51 164 116 / 18%);
}
.about_blocks li.intro_right .mbit .mbit_intro a{
    display: inline-block;
    border-radius: var(--radius);
    padding: 5px 15px;
    /*background: var(--preset-e);*/
    /*background: transparent;*/
    box-shadow: 0px 0 0px 3px rgb(51 164 116 / 12%);
    background: rgb(51 164 116 / 6%);
    border-radius: 100px;
    margin: 15px auto 5px;
    border: 2px solid;
}
.about_blocks li.intro_right .mbit .mbit_intro a b{
    /*opacity: .5;*/
    font-size: 1rem;
}
.about_blocks li.intro_right .mbit .mbit_range li:last-child{
    margin: auto;
}
.about_blocks li.intro_right .mbit .mbit_range li{
    display: block;
    width: 100%;
    margin: 15px auto;
    padding: 5px 0;
}
/*.about_blocks li.intro_right .mbit .mbit_range li.before span#data-type:before,*/
/*.about_blocks li.intro_right .mbit .mbit_range li.after span#data-type:after,*/
.about_blocks li.intro_right .mbit .mbit_range li span:before,
.about_blocks li.intro_right .mbit .mbit_range li span:after{
    opacity: .5;
}
.about_blocks li.intro_right .mbit .mbit_range li span:before,
.about_blocks li.intro_right .mbit .mbit_range li span:after{
    content: attr(data-before);
    position: absolute;
    top: 0;
    left: 0;
}
.about_blocks li.intro_right .mbit .mbit_range li span:after{
    content: attr(data-after);
    left: auto;
    right: 0;
}
.about_blocks li.intro_right .mbit .mbit_range li span#data-range:before,
.about_blocks li.intro_right .mbit .mbit_range li span#data-range:after{
    top: -3px;
}
/*.about_blocks li.intro_right .mbit .mbit_range li.before span:before,*/
/*.about_blocks li.intro_right .mbit .mbit_range li.after span:after{*/
/*    opacity: 1!important;*/
/*}*/

/*.about_blocks li.intro_right .mbit .mbit_range li.before span#data-type:before,*/
/*.about_blocks li.intro_right .mbit .mbit_range li.after span#data-type:after,*/
/*.about_blocks li.intro_right .mbit .mbit_range li span#data-range:before,*/
/*.about_blocks li.intro_right .mbit .mbit_range li span#data-range:after,*/
.about_blocks li.intro_right .mbit .mbit_range li.before span::before,
.about_blocks li.intro_right .mbit .mbit_range li.after span::after{
    font-weight: bold;
    opacity: 1;
}
.about_blocks li.intro_right .mbit .mbit_range li span#data-range:before{
    content: attr(data-before)'%';
    left: -35px;
}
.about_blocks li.intro_right .mbit .mbit_range li span#data-range:after{
    content: attr(data-after)'%';
    right: -35px;
}
/*.about_blocks li.intro_right .mbit .mbit_range li span#data-type:before,*/
/*.about_blocks li.intro_right .mbit .mbit_range li span#data-type:after{*/
/*    opacity: .75;*/
/*}*/
.about_blocks li.intro_right .mbit .mbit_range li span{
    width: 88%;
    display: block;
    margin: 0 auto;
    background: var(--preset-e);
    border-radius: 50px;
    position: relative;
    /*opacity: .75;*/
    font-size: 12px;
    margin-top: 10px;
    /*font-size: var(--min-size-rem);*/
}
.about_blocks li.intro_right .mbit .mbit_range li.after span em{
    left: auto;
    right: 0;
}

.about_blocks li.intro_right .mbit .mbit_range li span em{
    display: block;
    /*width: 50%;*/
    height: 100%;
    /*background: var(--theme-color);*/
    border-radius: inherit;
    position: absolute;
    top: 0;
    left: 0;
    width: 0;
    transition: width 1s ease;
    overflow: hidden;
    /*will-change: width;*/
}
.about_blocks li.intro_right .mbit .mbit_range li #data-range{
    width: 88%;
    height: 10px;
    margin: 0 auto;
}
.about_blocks li.intro_right .mbit .mbit_extra{
    text-align: right;
    opacity: .35;
    font-size: smaller;
    margin-top: 35px;
    padding: 0 20px;
}
.about_blocks li.intro_right .mbit .mbit_extra p{
    margin: auto;
}
.about_blocks li.intro_right .mbit .mbit_extra a{
    color: inherit;
    opacity: .75;
    font-size: small;
    font-style: italic;
    text-decoration: underline;
}


.head-inside video{
    /*height: auto;*/
}
.about_blocks li.intro_right .mbit .mbit_intro{
    margin-left: 25px;
}
.about_blocks li.intro_right .mbit .mbit_intro a{
    box-shadow: 0px 0 0px 3px rgb(51 164 116 / 12%);
    background: rgb(51 164 116 / 6%);
}
@keyframes loader{
    0%{transform:translateX(-100%);}
    100%{transform:translateX(360%);}
}
@keyframes loader-reverse{
    0%{transform:translateX(100%);}
    100%{transform:translateX(-360%);}
}
@keyframes full-width{
    0%{width: 0;}
    100%{width: 100%;}
}


.cs-tree{
    margin: 35px auto auto;
    text-align: left;
}
.about_blocks li.intro_right .mbit .mbit_range li.active span em:after{
    width: 100%;
    transition: width 1s ease;
    /*animation: full-width ease 1s 1 forwards;*/
    /*-webkit-animation: full-width ease 1s 1 forwards;*/
}
.about_blocks li.intro_right .mbit .mbit_range li.after span em:after{
    left: auto;
    right: 0;
}
.about_blocks li.intro_right .mbit .mbit_range li span em:after{
    content: ''; /*attr(data-width)*/
    width: 0;
    height: 100%;
    display: block;
    position: inherit;
    left: 0;
    border-radius: inherit;
    z-index: -1;
}

.about_blocks li.intro_right .mbit .mbit_range li.after.active span em:before{
    background: linear-gradient(left,var(--preset-fa) 0%,transparent 100%);
    background: -webkit-linear-gradient(left,var(--preset-fa) 0%,rgba(255, 255, 255, 0) 100%);
    animation: loader-reverse ease-out 3.6s 1.2s infinite;
    -webkit-animation: loader-reverse ease-out 3.6s 1.2s infinite;
    left: auto;
    right: 0;
    transform: translateX(100%);
}
.about_blocks li.intro_right .mbit .mbit_range li.active span em:before{
    content: '';
    width: 66%;
    height: 100%;
    background-color: currentColor;
    position: absolute;
    top: 0;
    left: 0;
    transform: translateX(-100%);
    background: linear-gradient(left,transparent 0%,var(--preset-fa) 100%);
    background: -webkit-linear-gradient(left,rgba(255, 255, 255, 0) 0%,var(--preset-fa) 100%);
    animation: loader ease-out 3.6s 1.2s infinite;
    -webkit-animation: loader ease-out 3.6s 1.2s infinite;
    opacity: .75;
}



body.dark .about_blocks{
    color: white;
    background: var(--preset-3b);
}
body.dark .In-core-head .user_info{
    background: linear-gradient(90deg,var(--preset-3a) 0%,var(--preset-3b) 100%);
}
body.dark .about_blocks li.intro_right .mbit .mbit_range li span{
    background: var(--preset-3a);
}

@media screen and (max-width:960px){
    .In-core-head .user_info,
    .about_blocks{
        padding: 15px;
        margin: auto;
    }
    .about_blocks li{
        width: 100%!important;
    }
    .about_blocks li.intro_right{
        margin: 25px auto auto;
    }
    .scroll-inform{
        padding: 0 15px;
    }
}
