* {
	margin: 0;
	padding: 0;
}


@font-face {
	font-family: 'bnp-sreg';
	src: url('https://hub.hcforklift.com/mstatic/font/Bebas-Neue-Pro-SemiExpanded-Regular.woff') format('woff');
	font-weight: normal;
	font-style: normal;		
}

@font-face {
	font-family: 'bnp-sbold';
	src: url('https://hub.hcforklift.com/mstatic/font/Bebas Neue Pro SemiExpanded Bold.woff') format('woff');
	font-weight: normal;
	font-style: normal;		
}

@font-face {
	font-family: 'bnp-sbook';
	src:url('https://hub.hcforklift.com/mstatic/font/Bebas Neue Pro SemiExpanded Book.woff') format('woff');
	font-weight: normal;
	font-style: normal;		
}

@font-face {
	font-family: 'bnp-smiddle';
	src:url('https://hub.hcforklift.com/mstatic/font/Bebas Neue Pro SemiExpanded Middle.woff') format('woff');
	font-weight: normal;
	font-style: normal;		
}
/*@font-face {*/
/*	font-family: "sy-ht-Light";*/
/*	src: url(/mstatic/font/SourceHanSansSC-Light.otf);*/
/*}*/

/*@font-face {*/
/*	font-family: "sy-ht-Medium";*/
/*	src: url(/mstatic/font/SourceHanSansSC-Medium.otf);*/
/*}*/

/*@font-face {*/
/*	font-family: "bnp-sbold";*/
/*	src: url(/mstatic/font/SourceHanSansSC-Bold.otf);*/
/*}*/

/*@font-face {*/
/*	font-family: "bnp-sreg";*/
/*	src: url(/mstatic/font/SourceHanSansSC-Regular.otf);*/
/*}*/

/*@font-face {*/
/*	font-family: "bnp-sreg";*/
/*	src: url(/mstatic/font/Demo_Fonts/Fontspring-DEMO-bebasneuepro-light.otf);*/
/*}*/

/*@font-face {*/
/*	font-family: "Bebas-Regular";*/
/*	src: url(/mstatic/font/Demo_Fonts/Fontspring-DEMO-bebasneuepro-regular.otf);*/
/*}*/


:root {
	--blue: #05164d;
	--black: #1a1a1a;
	--black-2: #242424;
	--ash-white: #fbfbfb;
	--ash-font: #a4a6a4;
	--deep-ash: #4d4d4d;
	--qulity-ash: #999999;
	--white: #ffffff;
}

.nothing {
    display: none!important;
}

body, button, input, select, textarea {
    font: 16px / 1 'bnp-sreg', Arial, "PingFangSC-Regular", "Microsoft Yahei" !important;
}
body {
	position: relative;
	/*font: 16px / 1 bnp-sreg, Arial, "PingFangSC-Regular", "Microsoft Yahei"!important;*/
	
}

body::-webkit-scrollbar {
	width: 5px;
}

body::-webkit-scrollbar-thumb {
	width: 5px;
	background-color: var(--blue);
}

.fs14 {
	font-size: 14px;
}

.fs16 {
	font-size: 16px;
}

.fs18 {
	font-size: 18px;
}

.fs20 {
	font-size: 20px;
}

.fs24 {
	font-size: 24px;
	/* font-size: 1.25vw; */
}

.fs100 {
	font-size: 4vw;
}

.w94p {
	width: 94%;
	margin-left: auto;
	margin-right: auto;
}

.login-page {
	width: 100%;
	height: 100vh;
	position: relative;
	justify-content: space-between;
	align-items: stretch;
	background-color: var(--ash-white);
	display: flex;
}

.login-page .left-part {
	width: 28.5%;
	height: 100%;
	background-color: var(--blue);
	padding: 70px 50px;
	box-sizing: border-box;
	display: flex;
	flex-direction: column;
}

.login-page .left-part .bg-title {
	font-family: "bnp-sreg";
	color: var(--white);
	line-height: 1;
}

.login-page .left-part .long-title {
	font-family: "bnp-sreg";
	color: var(--white);
	line-height: 1;
	margin-top: 20px;

}

.login-page .left-part .bottom-title {
	font-family: "bnp-sreg";
	color: var(--white);
	line-height: 1;
	margin-top: auto;

}


.login-page .right-part {
	width: 71.5%;
	height: 100%;
	padding: 70px 0 0;
	box-sizing: border-box;
	display: none;
	flex-direction: column;
	align-items: center;
	overflow: scroll;
}

.login-page .right-part::-webkit-scrollbar {
	width: 2px;
}

.login-page .right-part::-webkit-scrollbar-thumb {
	width: 2px;
	background-color: #2222ac;
}

.login-page .right-part.show {
	display: flex;
}

.login-page .right-part .login-trim-lnfo {
	margin-top: 5.21vw;
	font-family: "bnp-sreg";
	line-height: 1;
}

.login-page .right-part .login-form {
	width: 40%;
	margin-top: 2.1vw;
	display: flex;
	flex-direction: column;
}

.login-page .right-part .login-form .input-outside {
	width: 100%;
	display: flex;
	flex-direction: column;
	margin-bottom: 15px;
}

.login-page .right-part .login-form .input-outside .trim-text {
	font-family: "bnp-sbold";
	color: var(--black);
	line-height: 1;
	margin-bottom: 10px;
}

.login-page .right-part .login-form .input-outside input {
	width: 100%;
	height: 50px;
	border: 2px solid #f5f5f5;
	outline: 0px;
	border-radius: 10px;
	box-sizing: border-box;
	padding: 5% 2%;
	color: var(--ash-font);
}

.login-page .right-part .login-form .input-outside .short-input {
	width: 70%;
}

.login-page .right-part .login-form .icon-outside {
    position: relative;
}

.login-page .right-part .login-form .icon-outside .icon {
    width: 30px;
    height: 30px;
    object-fit: contain;
    position: absolute;
    top: 50%;
    right: 15px;
    transform: translate(-50%,-50%);
    cursor: pointer;
    
}

.login-page .right-part .login-form .remember-me {

	display: flex;
	align-items: center;
}

.login-page .right-part .login-form .remember-me input {
    width: 20px;
    height: 20px;
    border-radius: 0;
}

.login-page .right-part .login-form .remember-me span {
        color: #3c406b;
	line-height: 1;
	font-family: "bnp-sreg";
	font-weight: lighter;
	font-size: 14px;
}

.login-page .right-part .login-form .forgetPassword {
	color: #3c406b;
	line-height: 1;
	font-family: "bnp-sreg";
	font-weight: lighter;
	text-align: right;
	cursor: pointer;
}

.login-page .right-part .login-form .submit-button {
	width: 100%;
	height: 50px;
	border-radius: 10px;
	display: flex;
	justify-content: center;
	align-items: center;
	color: var(--deep-ash);
	font-size: 14px;
	background-color: #fbfbfb;
	margin-top: 30px;
	outline: 0;
	border: 0;
	box-shadow: 0px 3px 3px #d7d7d7;
	transition: all .3s;
	cursor: pointer;
}

.login-page .right-part .login-form .submit-button:hover {
	background-color: var(--blue);
	color: #ffffff;
}

.login-page .right-part .login-form .forgetPassword-2 {
	color: var(--blue);
	font-size: 14px;
	text-align: center;
	margin-top: 30px;
	font-family: "bnp-sreg";
	cursor: pointer;
}

.login-page .right-part .login-form .timeout {
	width: 40%;
	height: 100%;
	font-family: "bnp-sreg";
	background-color: #fff;
	display: flex;
	justify-content: center;
	align-items: center;
	border: 2px solid #f5f5f5;
    outline: 0px;
    border-radius: 10px;
    box-sizing: border-box;
    padding: 5% 2%;
    color: var(--ash-font);
	cursor: pointer;
	transition: all .3s;
}

.login-page .right-part .login-form .timeout.sp {
	width: 25%;
}

.login-page .right-part .bottom-trim {
	margin-top: 4.2vw;

}

.login-page .right-part .bottom-company-text {
	color: var(--blue);
	font-size: 16px;
	text-align: center;
	margin-top: 45px;
	font-family: "Bebas-Regular";
}

 .login-form {
	width: 40%;
	margin-top: 2.1vw;
	display: flex;
	flex-direction: column;
}

 .login-form .input-outside {
	width: 100%;
	display: flex;
	flex-direction: column;
	margin-bottom: 15px;
}

 .login-form .input-outside .trim-text {
	font-family: "bnp-sbold";
	color: var(--black);
	line-height: 1;
	margin-bottom: 10px;
}

 .login-form .input-outside input {
	width: 100%;
	height: 50px;
	border: 2px solid #f5f5f5;
	outline: 0px;
	border-radius: 10px;
	box-sizing: border-box;
	padding: 4% 2%;
	color: var(--ash-font);
}

 .login-form .input-outside .short-input {
	width: 75%;
    margin-right: 2%;
}

 .login-form .icon-outside {
    position: relative;
}

 .login-form .icon-outside .icon {
    width: 30px;
    height: 30px;
    object-fit: contain;
    position: absolute;
    top: 50%;
    right: 15px;
    transform: translate(-50%,-50%);
    cursor: pointer;
    
}

 .login-form .remember-me {

	display: flex;
	align-items: center;
}

 .login-form .remember-me input {
    width: 20px;
    height: 20px;
    border-radius: 0;
}

 .login-form .remember-me span {
        color: #3c406b;
	line-height: 1;
	font-family: "bnp-sreg";
	font-weight: lighter;
	font-size: 14px;
}

 .login-form .forgetPassword {
	color: #3c406b;
	line-height: 1;
	font-family: "bnp-sreg";
	font-weight: lighter;
	text-align: right;
	cursor: pointer;
}

 .login-form .submit-button {
	width: 100%;
	height: 50px;
	border-radius: 10px;
	display: flex;
	justify-content: center;
	align-items: center;
	color: var(--deep-ash);
	font-size: 14px;
	background-color: #fbfbfb;
	margin-top: 30px;
	outline: 0;
	border: 0;
	box-shadow: 0px 3px 3px #d7d7d7;
	transition: all .3s;
	cursor: pointer;
}

 .login-form .submit-button:hover {
	background-color: var(--blue);
	color: #ffffff;
}

 .login-form .forgetPassword-2 {
	color: var(--blue);
	font-size: 14px;
	text-align: center;
	margin-top: 30px;
	font-family: "bnp-sreg";
	cursor: pointer;
}

 .login-form .timeout {
	width: 40%;
	height: 100%;
	font-family: "bnp-sreg";
	background-color: #fff;
	display: flex;
	justify-content: center;
	align-items: center;
	border: 2px solid #f5f5f5;
    outline: 0px;
    border-radius: 10px;
    box-sizing: border-box;
    padding: 4% 2%;
    color: var(--ash-font);
	cursor: pointer;
	transition: all .3s;
}

 .login-form .timeout.sp {
	width: 25%;
}

.main-page {
	width: 100%;
	height: 100vh;
	position: relative;
	display: flex;
}

.header {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 70px;
	box-shadow: 0 2px 7px 0px #0000000C;
	background-color: #fff;
	z-index: 30;
}

.header .inside {
	height: 100%;
	display: flex;
	justify-content: space-between;
	align-items: center;
}

.header .inside .header-logo {
    display: block;
}

.header .inside .header-logo img {
    height: 45px;
}

.header .lang-user-choice {
	display: flex;
	justify-content: center;
	align-items: center;
}

.header .lang-user-choice .ai {
    color: var(--qulity-ash);
	line-height: 1;
	font-family: "bnp-sreg";
	width: 27px;
	height: 27px;
	/*border: 1px solid var(--qulity-ash);*/
	border-radius: 50%;
	display: flex;
	justify-content: center;
	align-items: center;
	cursor: pointer;
	margin-right: 10px;
}

.header .lang-user-choice .ai img {
    width: 100%;
    height: 100%;
}

.header .lang-user-choice .lang {
	color: var(--qulity-ash);
	line-height: 1;
	font-family: "bnp-sreg";
	width: 27px;
	height: 27px;
	border: 1px solid var(--qulity-ash);
	border-radius: 50%;
	display: flex;
	justify-content: center;
	align-items: center;
	cursor: pointer;
}

.header .lang-user-choice .user {
	color: var(--qulity-ash);
	line-height: 1;
	font-family: "bnp-sreg";
	margin-left: 15px;
	display: flex;
	align-items: center;
	cursor: pointer;
}

.header .lang-user-choice .user .more-list-icon {
    width: 15px;
    height: 15px;
    object-fit: contain;
}

.header .lang-user-choice .feedback-button {
    color: var(--qulity-ash);
	line-height: 1;
	font-family: "bnp-sreg";
	width: 27px;
	height: 27px;
	border: 1px solid var(--qulity-ash);
	border-radius: 50%;
	display: flex;
	justify-content: center;
	align-items: center;
	cursor: pointer;
	margin-left: 10px;
}

.header .lang-user-choice .feedback-button img {
    width: 65%;
    object-fit: contain;
}

.header-search {
	width: 52%;
	height: 42px;
	display: flex;
	border: 1px solid #f5f5f5;
	border-radius: 20px;
	position: relative;
}

.header .lang-user-choice .email {
	color: var(--qulity-ash);
	line-height: 1;
	font-family: "bnp-sreg";
	margin-left: 10px;
	width: 27px;
	height: 27px;
	border: 1px solid var(--qulity-ash);
	border-radius: 50%;
	display: flex;
	justify-content: center;
	align-items: center;
	cursor: pointer;
	position: relative;
}

.header .lang-user-choice .email .email-list {
	position: absolute;
	top: 130%;
	left: 0;
	transform: translate(-50%,0);
	border-radius: 10px;
	background-color: #fff;
	border: 1px solid #f5f5f5;
	width: 300px;
	min-height: 50px;
	display: none;
	flex-direction: column;
}


.header .lang-user-choice .email .email-list.show {
	display: flex;
}

.header .lang-user-choice .email .email-list .email-info-item {
	width: 100%;
	height: 50px;
	display: flex;
	align-items: center;
	color: #999999;
	font-family: "bnp-sreg";
	border-bottom: 1px solid #f5f5f5;
}

.header .lang-user-choice .email .email-list .email-info-item .time {
	border-right: 1px solid #f5f5f5;
	width: 30%;
	height: 100%;
	display: flex;
	justify-content: center;
	align-items: center;
}

.header .lang-user-choice .email .email-list .email-info-item .email-info-item-title {
	width: 70%;
	height: 100%;
	padding: 0.3em;
	box-sizing: border-box;
	display: flex;
	align-items: center;
}
.header .lang-user-choice .email img {
	width: 65%;
	object-fit: contain;
}

.header .lang-user-choice .email .info-number {
	position: absolute;
	width: 18px;
	height: 18px;
	font-size: 12px;
	color: #ff0000;
	border-radius: 50%;
	display: flex;
	justify-content: center;
	align-items: center;
	top: 0;
	right: 0;
	transform: translate(50%,-50%);
	background-color: #dbdbdb;
}

.header .lang-user-choice .exit {
	color: var(--qulity-ash);
	line-height: 1;
	font-family: "bnp-sreg";
	margin-left: 10px;
	cursor: pointer;
}

.email-info-show {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100vh;
	z-index: 999;
	background-color: #00000033;
	display: none;
	justify-content: center;
	align-items: center;
}

.email-info-show.show {
	display: flex;
}

.email-info-show .email-info-content {
	width: 80%;
	height: 75%;
	background-color: #fff;
	border-radius: 10px;
	border: 1px solid #f5f5f5;
	display: flex;
	/* padding: 3em; */
	box-sizing: border-box;
	position: relative;
}

.email-info-show .email-info-content .email-input{
    position: absolute;
    bottom: 20px;
    left: 20px;
    padding: 7px 25px;
    font-size: 16px;
    border-radius: 30px;
    color: #111111;
    border: 1px solid #f5f5f5;
    cursor: pointer;
    transition: all .3s;
    
}

.email-info-show .email-info-content .email-input:hover {
    background: #2222ac;
    outline: 0;
    color: #fff;
}

.email-info-show .email-info-content .email-left-list {
	width: 18vw;
	height: 100%;
	overflow: scroll;
	border-right: 3px solid #f5f5f5;
}

.email-info-show .email-info-content .email-left-list .email-left-bg-title {
	width: 100%;
	height: 80px;
	border-bottom: 1px solid #f5f5f5;
	color: #999999;
	padding: 0 1.2em;
	display: flex;
	align-items: center;
	box-sizing: border-box;
	font-family: "bnp-sreg";
}
.email-info-show .email-info-content .email-left-list .email-info-item {
	width: 100%;
	height: 50px;
	display: flex;
	align-items: center;
	color: #999999;
	font-family: "bnp-sreg";
	border-bottom: 1px solid #f5f5f5;
	cursor: pointer;
	flex-shrink: 0;
}

.email-info-show .email-info-content .email-left-list .email-info-item  .time {
	border-right: 1px solid #f5f5f5;
	width: 50%;
	height: 100%;
	display: flex;
	justify-content: center;
	align-items: center;
}

.email-info-show .email-info-content .email-left-list .email-info-item .email-info-item-title {
	width: 50%;
	height: 100%;
	padding: 0.3em;
	box-sizing: border-box;
	display: flex;
	align-items: center;
}

.email-info-show .email-info-content .email-right-show {
	width: calc(100% - 18vw);
	height: 100%;
	display: flex;
	flex-direction: column;
	padding: 3em;
}

/* .email-info-show .email-info-content .email-right-show .email-title .author {
	margin-bottom: 1.2em;
} */


.email-info-show .email-info-content .email-left-list::-webkit-scrollbar {
	width: 2px;
}

.email-info-show .email-info-content .email-left-list::-webkit-scrollbar-thumb {
	width: 2px;
	background-color: #a4a6a4;
}

.email-info-show .email-info-content .email-right-show {
	display: flex;
	flex-direction: column;
	padding: 3em;
	box-sizing: border-box;
	position: relative;
}

.email-info-show .email-info-content .email-right-show .feedback {
    width:100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    overflow: hidden;
    display: none;
    flex-direction: column;
    padding: 0 10%;
    background: #fff;
    box-sizing: border-box;
}

.email-info-show .email-info-content .email-right-show .feedback.show {
    display: flex;
}

.email-info-show .email-info-content .email-right-show .feedback .long-input {
    width: 100%;
    height: 8%;
    border: 1px solid #f5f5f5;
    box-sizing: border-box;
    padding: 1em;
    font-size: 16px;
}

.email-info-show .email-info-content .email-right-show .feedback .long-input.sp {
    height: 20%;
}

.email-info-show .email-info-content .email-right-show .feedback .input_title {
    font-size: 22px;
    line-height: 1;
    margin: 12px 0;
    color: #999999;
}

.email-info-show .email-info-content .email-right-show .feedback .input_title:first-of-type {
    margin-top: 5%;
}

.email-info-show .email-info-content .email-right-show .feedback .submit-button {
    width: 15%;
    margin: 35px auto;
    padding: 10px 25px;
    font-size: 16px;
    border-radius: 30px;
    color: #111111;
    border: 1px solid #f5f5f5;
    cursor: pointer;
    background: #fff;
    transition: all .3s;
    
}

.email-info-show .email-info-content .email-right-show .feedback .submit-button:hover {
    background: #2222ac;
    border: 1px solid #2222ac;
    color: #fff;
}

.email-info-show .email-info-content .email-exit {
	position: absolute;
	top: 0;
	right: 0;
	transform: translate(50%,-50%);
	border-radius: 50%;
	background-color: #fff;
	border: 1px solid #f5f5f5;
	/* background-color: #cccccc; */
	width: 42px;
	height: 42px;
	cursor: pointer;
	display: flex;
	justify-content: center;
	align-items: center;
}

.email-info-show .email-info-content .email-exit img {
	width: 65%;
	object-fit: contain;
}

.email-info-show .email-info-content .email-title {
	display: flex;
	flex-direction: column;
	color: #999999;
	margin-bottom: 1.5em;
	border-bottom: 1px solid #f5f5f5;
	font-family: "bnp-sreg";
}

.email-info-show .email-info-content .email-title .title {
	margin-bottom: .5em;
}

.email-info-show .email-info-content .email-main {
	padding-top: 1.5em;
	line-height: 1.3em;
	font-family: "bnp-sreg";
	color: #999999;
}

.ai-page {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100vh;
    z-index: 999;
    background-color: #00000033;
    display: none;
    justify-content: center;
    align-items: center;
}

.ai-page.show {
    display: flex;
}

.ai-page .ai-page-content {
    width: 80%;
    height: 75%;
    background-color: #fff;
    border-radius: 10px;
    border: 1px solid #f5f5f5;
    display: flex;
    /* padding: 3em; */
    box-sizing: border-box;
    position: relative;
}

.ai-page .ai-page-content .ai-page-exit {
    position: absolute;
    top: 0;
    right: 0;
    transform: translate(50%, -50%);
    border-radius: 50%;
    background-color: #fff;
    border: 1px solid #f5f5f5;
    /* background-color: #cccccc; */
    width: 42px;
    height: 42px;
    cursor: pointer;
    display: flex;
    justify-content: center;
    align-items: center;
}

.ai-page .ai-page-content .ai-page-exit img {
    width: 65%;
    object-fit: contain;
}

.ResetPassword-page {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100vh;
    z-index: 999;
    background-color: #00000033;
    display: none;
    justify-content: center;
    align-items: center;
}

.ResetPassword-page.show {
    display: flex;
}

.ResetPassword-page .ResetPassword-page-content {
    width: 55%;
    height: 75%;
    background-color: #fff;
    border-radius: 10px;
    border: 1px solid #f5f5f5;
    display: flex;
    /* padding: 3em; */
    box-sizing: border-box;
    position: relative;
}

.ResetPassword-page .ResetPassword-page-content .ResetPassword-page-exit {
    position: absolute;
    top: 0;
    right: 0;
    transform: translate(50%, -50%);
    border-radius: 50%;
    background-color: #fff;
    border: 1px solid #f5f5f5;
    /* background-color: #cccccc; */
    width: 42px;
    height: 42px;
    cursor: pointer;
    display: flex;
    justify-content: center;
    align-items: center;
}

.ResetPassword-page .ResetPassword-page-content .ResetPassword-page-exit img {
    width: 65%;
    object-fit: contResetPasswordn;
}

.ResetPassword-page .ResetPassword-page-content .input_title {
    font-size: 22px;
    line-height: 1;
    margin: 12px 0;
    color: #999999;
}

.ResetPassword-page .ResetPassword-page-content .ResetPassword-form {
    width: 100%;
    height: 100%;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    padding: 0 15%;
    background: #fff;
    box-sizing: border-box;
    justify-content: center;

}

.ResetPassword-page .ResetPassword-page-content .long-input
 {
    width: 100%;
    height: 65px;
    border: 1px solid #999999;
    box-sizing: border-box;
    padding: 0.5em;
    font-size: 16px;
}

.ResetPassword-page .ResetPassword-page-content .submit-button {
    width: 150px;
    color: #ffffff;
    background-color: #2222ac;
    padding: 10px 25px;
    font-size: 16px;
    color: #ffffff;
    cursor: pointer;
    transition: all .3s;
    border: 0;
    outline: 0;
    margin:50px auto 20px;
}

.feedback-page {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100vh;
    z-index: 999;
    background-color: #00000033;
    display: none;
    justify-content: center;
    align-items: center;
}

.feedback-page.show {
    display: flex;
}

.feedback-page .feedback-page-content {
    width: 80%;
    height: 95%;
    background-color: #fff;
    border-radius: 10px;
    border: 1px solid #f5f5f5;
    display: flex;
    /* padding: 3em; */
    box-sizing: border-box;
    position: relative;
}

.feedback-page .feedback-page-content .half-part {
    width: 48%;
    margin-left: 4%;
    display: flex;
    flex-direction: column;
}

.feedback-page .feedback-page-content .half-part:first-of-type {
    margin-left: 0;
}

.feedback-page .feedback-page-content .feedback-page-exit {
    position: absolute;
    top: 0;
    right: 0;
    transform: translate(50%, -50%);
    border-radius: 50%;
    background-color: #fff;
    border: 1px solid #f5f5f5;
    /* background-color: #cccccc; */
    width: 42px;
    height: 42px;
    cursor: pointer;
    display: flex;
    justify-content: center;
    align-items: center;
}

.feedback-page .feedback-page-content .feedback-page-exit img {
    width: 65%;
    object-fit: contain;
}

.feedback-page .feedback {
    width:100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    padding: 0 10%;
    background: #fff;
    box-sizing: border-box;
}
.feedback-page .feedback .long-input {
    width: 100%;
    height: 45px;
    border: 1px solid #f5f5f5;
    box-sizing: border-box;
    padding: 0.5em;
    font-size: 16px;
}

.feedback-page .feedback .long-input.sp {
    height: 15%;
}

.feedback-page .feedback .input_title {
    font-size: 22px;
    line-height: 1;
    margin: 12px 0;
    color: #999999;
}

.feedback-page .feedback .input_title:first-of-type {
    margin-top: 3%;
}

.feedback-page .feedback  .upload-file {
            width: 90px;
            height: 90px;
            border: 1px solid #f5f5f5;
            position: relative;
            cursor: pointer;
            margin-top: 15px;
}

.feedback-page .feedback  .upload-file::before {
            position: absolute;
            content: "";
            background-image: url(./more-iron.png);
            background-repeat: no-repeat;
            background-size: contain;
            width: 45%;
            height: 45%;
            top: 45%;
            left: 50%;
            transform: translate(-50%,-50%);
}

.feedback-page .feedback  .upload-file span {
    position: absolute;
    top: 67%;
    left: 0%;
    width: 100%;
    box-sizing: border-box;
    text-align: center;
    font-size: 11px;
    color: #999;
    margin: 0;
}

.feedback-page .feedback .form-bottom {
    display: flex;
    align-items: center;
    justify-content: space-between;
}


.feedback-page .feedback .form-bottom .upload-img-list {
    margin-top: 10px;
}
/*.feedback-page .feedback  .upload-file.sp:after {*/
    
/*}*/

.feedback-page .feedback .submit-button {
    width: 150px;
    color: #ffffff;
    background-color: #2222ac;
    padding: 10px 25px;
    font-size: 16px;
    color: #ffffff;
    cursor: pointer;
    transition: all .3s;
    border: 0;
    outline: 0;
    
}

.feedback-page .feedback .tips {
    font-size: 14px;
    color: #db1600;
    margin-top: 10px;
}


.fileTypeChoice {
	width: 10%;
	height: 100%;
	display: flex;
	justify-content: center;
	align-items: center;
	color: #666666;
	border-right: 1px solid #f5f5f5;
	position: relative;
	z-index: 10;
	cursor: pointer;
}

.fileTypeChoice-show.sp {
    
}

.fileTypeChoice-show {
	width: 240px;
	/* height: 6vw; */
	position: absolute;
	top: 120%;
	left: 50%;
	transform: translateX(-50%);
	border: 1px solid #f5f5f5;
	background-color: #ffffff;
	border-radius: 10px;
	display: none;
	justify-content: center;
	flex-wrap: wrap;
	align-items: center;
	padding: 20px 40px;
	box-sizing: border-box;
	transition: all .3s;
	z-index: 10;
}

.fileTypeChoice-show.show {
	display: flex;
}

.fileTypeChoice-show input {
	width: 50%;
	height: 15px;
	position: relative;
	-webkit-appearance: none;
	cursor: pointer;
	margin-bottom: 10px;
}

.fileTypeChoice-show input::after {
	content: attr(text-value);
	position: absolute;
	top: 50%;
	left: 25px;
	transform: translateY(-50%);
	line-height: 1;
	color: #666666;
	font-size: 16px;
	transition: all .3s;
}

.fileTypeChoice-show input:checked::after {
	color: #2222ac;
}

.fileTypeChoice-show input::before {
	display: block;
	width: 15px;
	height: 15px;
	content: "";
}

.fileTypeChoice-show .all::before {
	background-image: url(https://hub.hcforklift.com/mstatic/img/file-icon-uncheck-1.png);
	background-repeat: no-repeat;
	background-position: 50% 50%;
	background-size: contain;
}

.fileTypeChoice-show .video::before {
	background-image: url(https://hub.hcforklift.com/mstatic/img/file-icon-uncheck-2.png);
	background-repeat: no-repeat;
	background-position: 50% 50%;
	background-size: contain;
}

.fileTypeChoice-show .img::before {
	background-image: url(https://hub.hcforklift.com/mstatic/img/file-icon-uncheck-3.png);
	background-repeat: no-repeat;
	background-position: 50% 50%;
	background-size: contain;
}

.fileTypeChoice-show .audio::before {
	background-image: url(https://hub.hcforklift.com/mstatic/img/file-icon-uncheck-4.png);
	background-repeat: no-repeat;
	background-position: 50% 50%;
	background-size: contain;
}

.fileTypeChoice-show .txt::before {
	background-image: url(https://hub.hcforklift.com/mstatic/img/file-icon-uncheck-5.png);
	background-repeat: no-repeat;
	background-position: 50% 50%;
	background-size: contain;
}

.fileTypeChoice-show .other::before {
	background-image: url(https://hub.hcforklift.com/mstatic/img/file-icon-uncheck-6.png);
	background-repeat: no-repeat;
	background-position: 50% 50%;
	background-size: contain;
}

.fileTypeChoice-show .all:checked:before {
	background-image: url(https://hub.hcforklift.com/mstatic/img/file-icon-check-1.png);
	background-repeat: no-repeat;
	background-position: 50% 50%;
	background-size: contain;
}

.fileTypeChoice-show .video:checked:before {
	background-image: url(https://hub.hcforklift.com/mstatic/img/file-icon-check-2.png);
	background-repeat: no-repeat;
	background-position: 50% 50%;
	background-size: contain;
}

.fileTypeChoice-show .img:checked:before {
	background-image: url(https://hub.hcforklift.com/mstatic/img/file-icon-check-3.png);
	background-repeat: no-repeat;
	background-position: 50% 50%;
	background-size: contain;
}

.fileTypeChoice-show .audio:checked:before {
	background-image: url(https://hub.hcforklift.com/mstatic/img/file-icon-check-4.png);
	background-repeat: no-repeat;
	background-position: 50% 50%;
	background-size: contain;
}

.fileTypeChoice-show .txt:checked:before {
	background-image: url(https://hub.hcforklift.com/mstatic/img/file-icon-check-5.png);
	background-repeat: no-repeat;
	background-position: 50% 50%;
	background-size: contain;
}

.fileTypeChoice-show .other:checked:before {
	background-image: url(https://hub.hcforklift.com/mstatic/img/file-icon-check-6.png);
	background-repeat: no-repeat;
	background-position: 50% 50%;
	background-size: contain;
}

.fileTypeChoice img {
	margin-left: 15px;
}

.header-search .submit {
	width: 6%;
	height: 100%;
	background-image: url(https://hub.hcforklift.com/mstatic/img/submit-icon-1.png);
	background-position: 50% 50%;
	background-repeat: no-repeat;
	background-color: #2222ac;
	border: 0px;
	outline: 0px;
	border-top-right-radius: 20px;
	border-bottom-right-radius: 20px;
	overflow: hidden;
	cursor: pointer;
}

.header-search .input {
	width: calc(100% - 10% - 6%);
	height: 100%;
	border: 0px;
	outline: 0px;
	padding: 0 1.5em;
	box-sizing: border-box;
}


.mobile-not-show {
    display: flex;
}


.mobile-show {
    display: none;
}
.page-content {
	width: 100%;
	height: 100%;
	padding: 70px 0 0;
	box-sizing: border-box;
	display: flex;
	justify-content: space-between;
	align-items: center;
	background-color: #eef2f5;
	
}

.page-content .left-menu {
	width: 17.6%;
	height: 100%;
	display: flex;
	flex-direction: column;
	border-right: 1px solid #efefef;
	overflow-y: auto;
	transition: all;
	overflow-x: hidden;
	transition: all .3s;
	    background: #fff;
}

.page-content .left-menu.type-1 {
	width: 0px;
}

.page-content .left-menu::-webkit-scrollbar {
	width: 2px;
}

.page-content .left-menu::-webkit-scrollbar-thumb {
	width: 2px;
	background-color: #2222ac;
}


.page-content .left-menu .top-menu-1 {
	width: 100%;
	height: 70px;
	display: flex;
	justify-content: flex-end;
	align-items: center;
	padding: 0 1.56vw 0 2.84vw;
	box-sizing: border-box;
	border-bottom: 1px solid #efefef;
	background-color: #ffffff;
	flex-shrink: 0;
}

.page-content .button-type-1 {
	width: 38px;
	height: 38px;
	border-radius: 5px;
	display: flex;
	justify-content: center;
	align-items: center;
	box-shadow: 0 0 3px #cccccc;
	/* border: 1px solid #cccccc; */
	/*margin-left: 25px;*/
	position: relative;
	transition: all .3s;
	cursor: pointer;
}

.page-content .button-type-1.nowopen img {
	transform: rotate(180deg);
}

.page-content .button-type-1:hover {
	background-color: #eef2f5;
}

.page-content .button-type-1:hover img {
	opacity: 1;
}

.page-content .button-type-1 .file-sort-list {
	width: 200px;
	height: 210px;
	position: absolute;
	top: 120%;
	left: 50%;
	transform: translateX(-50%);
	display: none;
	flex-direction: column;
	z-index: 10;
	border: 1px solid #f5f5f5;
	background-color: #ffffff;
	border-radius: 10px;
	padding: 17px;
	box-sizing: border-box;
}

.page-content .button-type-1.show .file-sort-list {
	display: flex;
}

.page-content .button-type-1.show {
	background-color: #eef2f5;
}

.page-content .button-type-1.show img {
	opacity: 1;
}

.page-content .button-type-1 .file-sort-list .list-1 {
	padding-top: 7px;
	display: flex;
	flex-direction: column;
}

.page-content .button-type-1 .file-sort-list .list-2 {
	display: flex;
	flex-direction: column;
	border-top: 1px solid #efefef;
	padding-top: 17px;
}

.page-content .button-type-1 input {
	width: 100%;
	height: 1em;
	position: relative;
	-webkit-appearance: none;
	cursor: pointer;
	margin-bottom: 15px;
	font-size: 16px;
}

.page-content .button-type-1 input::after {
	content: attr(text-value);
	position: absolute;
	top: 50%;
	left: 25px;
	transform: translateY(-50%);
	line-height: 1;
	color: #666666;
	font-size: 16px;
	transition: all .3s;
	font-family: "bnp-sreg";
}

.page-content .button-type-1 input::before {
	display: block;
	width: 15px;
	height: 10px;
	content: "";
}

.page-content .button-type-1 input:checked::before {
	background-image: url("/mstatic/img/choice-iron-1.png");
	background-repeat: no-repeat;
	background-position: 50% 50%;
	background-size: contain;
}

.page-content .button-type-1 img {
	opacity: .3;
	transition: all .3s;
}

.page-content .left-menu .text-sort {
	width: 100%;
	height: 100px;
	padding: 0 1.56vw 0 2.84vw;
	box-sizing: border-box;
	background-color: #ffffff;
	display: flex;
	justify-content: center;
	align-items: center;
	flex-shrink: 0;
}

.page-content .left-menu .text-sort .main {
	width: 100%;
	height: 42px;
	background-color: #f8fafb;
	border-radius: 21px;
	position: relative;
	display: flex;
	justify-content: space-between;
	align-items: center;

}

.page-content .left-menu .text-sort .main .mask {
	width: 50%;
	height: 100%;
	border-radius: 21px;
	background-color: #eef2f5;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 1;
	transition: all .3s;
}

.page-content .left-menu .text-sort .main .mask.sp-2 {
	left: 50%;
}

.page-content .left-menu .text-sort .main .aToz {
	width: 50%;
	height: 100%;
	position: relative;
	z-index: 2;
	display: flex;
	justify-content: center;
	align-items: center;
	color: #999999;
	transition: all .3s;
	cursor: pointer;
}

.page-content .left-menu .text-sort .main .zToa {
	width: 50%;
	height: 100%;
	position: relative;
	z-index: 2;
	display: flex;
	justify-content: center;
	align-items: center;
	color: #999999;
	transition: all .3s;
	cursor: pointer;
}

.page-content .left-menu .text-sort .main .sp {
	color: #242424;
}

.page-content .left-menu .trim-part {
	width: 100%;
	height: 100px;
	padding: 0 1.56vw 0 2.84vw;
	box-sizing: border-box;
	background-color: #fff;
	display: flex;
	flex-direction: column;
	flex-shrink: 0;
}

.page-content .left-menu .trim-part .top-title {
	line-height: 1;
	font-family: "bnp-sbold";
	color: #242424;
	margin-bottom: 25px;
}

.page-content .left-menu .trim-part .bottom-info {
	line-height: 1;
	font-family: "bnp-sbold";
	color: #242424;
	display: flex;
	align-items: flex-end;
}

/*.page-content .left-menu .trim-part .bottom-info span {*/
/*	margin-left: 10px;*/
/*}*/

.page-content .left-menu .tree-menu {
	width: 100%;
	display: flex;
	flex-direction: column;
	background-color: #fff;
	padding: 1.56vw 1.56vw 0 1.54vw;
	box-sizing: border-box;
}

.page-content .left-menu .tree-menu .group {
	width: 100%;
	/* min-height: 57px; */
	display: flex;
	flex-direction: column;
	/*overflow: hidden;*/
	padding-left: 8px;
	box-sizing: border-box;
	/*transition: all .3s;*/
}

.page-content .left-menu .tree-menu .group.show {
	height: auto;
}

.page-content .left-menu .tree-menu .group.hide {
	height: 0;
	opacity: 0;
}

.page-content .left-menu .tree-menu .group.no-left {
    padding-left: 0;
}

.page-content .left-menu .tree-menu .node {
	position: relative;
	transition: all .3s;
	/* margin-left: 20px; */
	/* margin-bottom: 10px; */
}

/*.page-content .left-menu .tree-menu .node .inside:hover {*/
    
/*}*/
.page-content .left-menu .tree-menu .node .inside:hover:after {
    width: 200%;
    background-color: #eef2f5;
}

.page-content .left-menu .tree-menu .node .inside .icon {
	position: relative;
	z-index: 2;
	cursor: pointer;
	/*display: none;*/
}

.page-content .left-menu .tree-menu .node .inside span {
    width: 100%;
    height: 100%;
	position: relative;
	z-index: 2;
	cursor: pointer;
	margin: 0px 5px;
}

.page-content .left-menu .tree-menu .node .inside.this span {
    color: #ffffff;
}

.page-content .left-menu .tree-menu .node .inside .categories {
    display: flex;
    align-items: center;
    justify-content: flex-start;
}

/* .page-content .left-menu .tree-menu .node .inside::after {
	position: absolute;
	content: "";
	top: 0;
	right: 0;
	width: 0;
	height: 100%;
	border-top-left-radius: 30px;
	border-bottom-left-radius: 30px;
	background-color: #eef2f5;
}

.page-content .left-menu .tree-menu .node .inside:hover::after{
	width: 150%;
} */

.page-content .left-menu .tree-menu .show-title {
	height: 57px;
	display: flex;
	align-items: center;
}

.page-content .left-menu .tree-menu .inside {
    position: relative;
	display: flex;
	align-items: center;
	margin-bottom: 5px;
	font-family: "bnp-sreg";
	position: relative;
	min-height: 30px;
}

.page-content .left-menu .tree-menu .inside:after {
    position: absolute;
    content: "";
    height: 100%;
    width:0%;
    background: #2222ac;
    right: -50px;
    top: 0;
    /*transition: all .3s;*/
}

.page-content .left-menu .tree-menu .inside.this:after {
    width:200%;
    background: #2222ac!important;
    
    /*background-color: #eef2f5!important;*/
    
}

/*.page-content .left-menu .tree-menu .inside.this span {*/
/*    color: #333333!important;*/
/*}*/

/*.page-content .left-menu .tree-menu .inside.top:after {*/
/*    width:200%;*/
/*    background: #2222ac!important;*/
/*}*/

/*.page-content .left-menu .tree-menu .inside.top span {*/
/*    color: #fff;*/
/*}*/

/*.page-content .left-menu .tree-menu .inside.this {*/
/*    background: #2222ac;*/
/*}*/

.page-content .left-menu .tree-menu .inside .more-icon {
	position: absolute;
	right: 0;
	transition: all .3s;
	z-index: 2;
	cursor: pointer;
    width: 20px;
    height: 20px;
    box-sizing: border-box;
	
}

.page-content .left-menu .tree-menu .inside .more-icon.show {
    background-image: url(img/fileTypeChoice-icon-1.png);
    background-position: 50% 50%;
    background-repeat: no-repeat;
    background-size: auto;
}

.page-content .left-menu .tree-menu .inside .more-icon.hide {
    background-image: url(img/fileTypeChoice-icon-2.png);
    background-position: 50% 50%;
    background-repeat: no-repeat;
    background-size: auto;
}

.page-content .left-menu .tree-menu .icon {
	width: 20px;
	height: 20px;
	border: 1px solid #f5f5f5;
	transition: all .3s;
	position: relative;
	z-index: 2;
	/* background-color: #666666; */
}

.page-content .left-menu .tree-menu .icon.this {
	border: 0;
	background-color: #2222ac;
    background-image: url(/mstatic/img/ischoiced-icon-1.png);
    background-position: 50% 50%;
    background-size: auto;
    background-repeat: no-repeat;
	/* border-radius: 50%; */
}

.page-content .left-menu .first-menu {
	width: 100%;
    box-sizing: border-box;

}
.page-content .left-menu .first-menu .normal-show {
	width: 100%;
	height: 58px;
	padding: 0 1.56vw 0 3.64vw;
	box-sizing: border-box;
	display: flex;
	justify-content: space-between;
	align-items: center;
	color: #666666;
	font-family: "bnp-sreg";
	background-color: #fff;
}

.page-content .left-menu .first-menu .normal-show.next {
	border-top-right-radius: 10px;
	overflow: hidden;
}

.page-content .left-menu .first-menu .normal-show.prev {
	border-bottom-right-radius: 10px;
	overflow: hidden;
}

.page-content .left-menu .first-menu .normal-show .input-part {
	display: flex;
	align-items: center;
}

.page-content .left-menu .first-menu .normal-show span {
	margin-left: 15px;
}

.page-content .left-menu .first-menu .normal-show input[type="checkbox"] {
	width: 21px;
	height: 21px;
	-webkit-appearance: none;
	outline: 1px solid #efefef;
	transition: all .3s;
}

.page-content .left-menu .first-menu .normal-show input[type="checkbox"]:checked {
	outline: 0;
	background-color: #2222ac;
	background-image: url(/mstatic/img/ischoiced-icon-1.png);
	background-position: 50% 50%;
	background-size: auto;
	background-repeat: no-repeat;
}

.page-content .left-menu .first-menu .normal-show .more {
	transition: all .3s;
}

.page-content .left-menu .first-menu.show .normal-show .more {
	transform: rotate(180deg);
}

.page-content .left-menu .first-menu .second-menu {
	width: 100%;
	height: 0px;
	overflow: hidden;
	display: flex;
	flex-direction: column;
	transition: all .3s;
}


.page-content .left-menu .first-menu .second-menu .second-menu-item {
	position: relative;
	width: 100%;
	height: 57px;
	padding: 0 1.56vw 0 calc(3.64vw + 38px);
	box-sizing: border-box;
	display: flex;
	align-items: center;
	line-height: 1;
	color: #666666;
	font-family: "bnp-sreg";
	transition: all .3s;
	background-color: #fff;
}

.page-content .left-menu .first-menu .second-menu .second-menu-item span {
	position: relative;
	z-index: 3;
}

.page-content .left-menu .first-menu .second-menu .second-menu-item::before {
	position: absolute;
	content: "";
	top: 50%;
	left: calc(3.64vw + 5px);
	transform: translateY(-50%);
	width: 9px;
	height: 9px;
	background: url(/mstatic/img/more-icon-2.png);
	background-repeat: no-repeat;
	background-size: cover;
	background-position: 50% 50%;
	transition: all .3s;
	z-index: 2;
}

.page-content .left-menu .first-menu .second-menu .second-menu-item.sp::before {
	width: 9px;
	height: 2px;
	background: url(/mstatic/img/less-icon-1.png);
	background-repeat: no-repeat;
	background-size: cover;
	background-position: 50% 50%;
}

.page-content .left-menu .first-menu .second-menu .second-menu-item.sp {
	color: #2222ac;
}

.page-content .left-menu .first-menu .second-menu .second-menu-item::after {
	position: absolute;
	content: "";
	width: 0%;
	height: 100%;
	right: 0;
	top: 0;
	background-color: #eef2f5;
	transition: all .3s;
	border-top-left-radius: 35px;
	border-bottom-left-radius: 35px;
}

.page-content .left-menu .first-menu .second-menu .second-menu-item.sp::after {
	width: 85%;
}

.page-content .left-menu .first-menu .second-menu .second-menu-item.next {
	border-top-right-radius: 10px;
	overflow: hidden;
}

.page-content .left-menu .first-menu .second-menu .second-menu-item.prev {
	border-bottom-right-radius: 10px;
	overflow: hidden;
}

.page-content .right-file-filter {
    width: 0px;
    height: 100%;
    box-sizing: border-box;
    overflow: hidden;
    transition: all .3s;
    overflow: auto;
}

.page-content .right-file-filter::-webkit-scrollbar {
	width: 3px;
}

.page-content .right-file-filter::-webkit-scrollbar-thumb {
	width: 3px;
	background-color: #2222ac;
}



.page-content .right-file-filter.show {
    width: 400px;
    padding: 20px 30px;
}

.file-filter-list {
	min-height: 300px;
	padding: 0;
	display: none;
	flex-direction: column;
	border: 1px solid #efefef;
	border-radius: 5px;
	background-color: #ffffff;
	z-index: 10;
}

.file-filter-list {
	display: flex;
}

.file-filter-list .title {
	line-height: 1;
	color: #242424;
	font-family: "bnp-sreg";
	margin-bottom: 1em;
}

.file-filter-list .title.top-line {
    border-top: 1px solid #bbbbbb;
    padding-top: 15px;
}



.file-filter-list .select-type-1 {
	width: 100%;
	height: 33px;
	outline: 0px;
	color: #999999;
	padding: 0 18px;
	border-radius: 5px;
	font-size: 16px;
	font-family: "bnp-sreg";
	border: 1px solid #efefef;
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	position: relative;
	margin-bottom: 15px;
	flex-shrink: 0;

}


.file-filter-list .select-type-1::before {
	position: absolute;
	top: 50%;
	right: 15px;
	display: block;
	content: "123";
	width: 13px;
	height: 7px;
	background-image: url(/mstatic/img/more-icon-3.png);
	background-size: cover;
	background-repeat: no-repeat;
	background-position: 50% 50%;
}

.file-filter-list .check-box-list {
    width:100%;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    padding-bottom: 15px;
}

.file-filter-list .check-box-list .check-item {
    padding: 6px 12px;
    outline: 1px solid #cccccc;
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-radius: 20px;
    margin-right: 7px;
    margin-bottom: 7px;
    cursor: pointer;
}

.file-filter-list .check-box-list .check-item.check
 {
    background: #2222ac;
    outline: 0;
}

.file-filter-list .check-box-list .check-item input {
    pointer-events: none;
}

.file-filter-list .check-box-list .check-item input:checked + span {
    color: #ffffff;
}

/*.file-filter-list .check-box-list .check-item.check span {*/
    
/*}*/



.file-filter-list .range-container {
    width: 100%;
    height: 15px;
    position: relative;
    margin-bottom: 20px;
}
.file-filter-list input[type="range"] {
            width: 100%;
            height: 100%;
            -webkit-appearance: none;
            appearance: none;
            
        }

.file-filter-list input[type="range"]::-webkit-slider-runnable-track {
            height: 100%;
            /*background-color: #ddd;*/
            border: 1px solid #efefef;
            border-radius: 10px;
        }

.file-filter-list input[type="range"]::-moz-range-track {
            height: 100%;
            /*background-color: #ddd;*/
            border: 1px solid #efefef;
            border-radius: 10px;
        }

.file-filter-list input[type="range"]::-webkit-slider-thumb {
            -webkit-appearance: none;
            appearance: none;
            width: 15px;
            height: 15px;
            background-color: #2222ac;
            border-radius: 50%;
            cursor: pointer;
        }

.file-filter-list input[type="range"]::-moz-range-thumb {
            width: 15px;
            height: 15px;
            background-color: #2222ac;
            border-radius: 50%;
            cursor: pointer;
        }

.file-filter-list .range-value {
            position: absolute;
            top: -30px;
            left: 50%;
            transform: translateX(-50%);
            background-color: #333;
            color: #fff;
            padding: 5px;
            border-radius: 5px;
        }
.file-filter-list .lengTo {
	width: 100%;
	height: 33px;
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom: 15px;
}

.file-filter-list .lengTo input {
	width: 37%;
	height: 100%;
	border: 0px;
	border-radius: 5px;
	background-color: #fafafa;
	border: 1px solid #f3f3f3;
	outline: 0;
	padding: 0.5em 1em;
	font-size: 16px;
	box-sizing: border-box;
	font-family: "bnp-sreg";
	color: #999999;
}

.file-filter-list .lengTo .trim-line {
	width: 16%;
	height: 2px;
	background-color: #999999;
}

.file-filter-list .function-buttons {
	width: 100%;
	display: flex;
	align-items: center;
	justify-content: space-between;
}

.file-filter-list .function-buttons .button-type-1 {
	min-width: 38px;
	min-height: 38px;
	border-radius: 5px;
	display: flex;
	justify-content: center;
	align-items: center;
	/* box-shadow: 0 0 3px #cccccc; */
	border: 1px solid #efefef;
	position: relative;
	transition: all .3s;
	padding: 0 20px;
	box-sizing: border-box;
	font-size: 16px;
	cursor: pointer;
}

.file-filter-list .function-buttons .button-type-1.sp {
	border: 0;
	background-color: #2222ac;
	color: #ffffff;
}

.page-content .right-show {
	width: calc(100% - 17.6% - 1px);
	height: 100%;
	display: flex;
	flex-direction: column;
	position: relative;

}

.page-content .right-show .file-loading-put {
    position: absolute;
    width: 100%;
    height: 100%;
    z-index: 99;
    display: none;
    background: #00000026;

}

.page-content .right-show .file-loading-put.show {
    display: block;
}

.page-content .right-show .file-loading-put img {
    position: absolute;
    width: 50px;
    height: 50px;
    top: 90%;
    left: 50%;
    transform: translate(-50%,-50%);
}

.page-content .right-show.type-1 {
	width: 100%;
}

.page-content .right-show .top-menu-info {
	width: 100%;
	height: 70px;
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: 0 59px 0 34px;
	box-sizing: border-box;
	background-color: #ffffff;
	border-bottom: 1px solid #efefef;
	flex-shrink: 0;
}

.page-content .right-show .top-menu-info .openFileList {
	display: none;
}

.page-content .right-show .top-menu-info .openFileList.show {
	display: flex;
	/*opacity: .6;*/
	margin-right: 15px;
	cursor: pointer;
	transform: rotate(180deg);
}

.page-content .right-show .top-menu-info .file-position {
	display: flex;
	align-items: center;
}



.page-content .right-show .top-menu-info .file-position a,span {
	margin: 0px 7px;
	line-height: 1;
	color: var(--qulity-ash);
	font-family: "bnp-sreg";
}


.page-content .right-show .top-menu-info .file-position .sp {
	color: var(--black-2);
}

.page-content .right-show .top-menu-info .choice-buttons {
	display: flex;
	align-items: center;
}

.page-content .right-show .top-menu-info .choice-buttons .choice-button-item {
	min-width: 38px;
	height: 38px;
	border-radius: 5px;
	display: flex;
	justify-content: center;
	align-items: center;
	box-shadow: 0 0 3px #cccccc;
	margin-left: 15px;
	padding: 12px;
	box-sizing: border-box;
	position: relative;
	transition: all .3s;
	color: #999999;
}

.page-content .right-show .top-menu-info .choice-buttons .choice-button-item:hover {
	background-color: #eef2f5;
	color: #666666;
}


.page-content .right-show .top-menu-info .choice-buttons .choice-button-item:hover img {
	opacity: 1;
}

.page-content .right-show .top-menu-info .choice-buttons .choice-button-item.file-choice-124 {
	cursor: pointer;
}

.page-content .right-show .top-menu-info .choice-buttons .choice-button-item.view-choice {
	cursor: pointer;
}



.page-content .right-show .top-menu-info .choice-buttons .choice-button-item span {
	line-height: 1;
	font-family: "bnp-sreg";
	margin-right: 13px;
}

.page-content .right-show .top-menu-info .choice-buttons .choice-button-item img {
	opacity: .3;
	cursor: pointer;
	transition: all .3s;
}

.page-content .right-show .top-menu-info .choice-buttons .choice-button-item .trim-div-1 {
	width: 100%;
	height: 100%;
	position: absolute;
}

.page-content .right-show .top-menu-info .choice-buttons .choice-button-item .trim-div-1::before {
	position: absolute;
	content: "";
    width: 20px;
    height: 2px;
    border: 1px solid #999999;
    top: 8px;
    left: 8px;
	transition: all .3s
}

.page-content .right-show .top-menu-info .choice-buttons .choice-button-item .trim-div-1::after {
	position: absolute;
	content: "";
    width: 20px;
    height: 2px;
    border: 1px solid #999999;
    top: 14px;
    left: 8px;
	transition: all .3s
}

.page-content .right-show .top-menu-info .choice-buttons .choice-button-item .trim-div-2::before {
	position: absolute;
	content: "";
    width: 20px;
    height: 2px;
    border: 1px solid #999999;
    bottom: 14px;
    left: 8px;
	transition: all .3s
}

.page-content .right-show .top-menu-info .choice-buttons .choice-button-item .trim-div-2::after {
	position: absolute;
	content: "";
    width: 20px;
    height: 2px;
    border: 1px solid #999999;
    bottom: 8px;
    right: 8px;
	transition: all .3s
}

.page-content .right-show .top-menu-info .choice-buttons .choice-button-item.type-2 .trim-div-1::before {
	position: absolute;
	content: "";
	width: 8px;
	height: 3px;
	border: 1px solid #999999;
	top: 8px;
	left: 8px;
	transition: all .3s
}

.page-content .right-show .top-menu-info .choice-buttons .choice-button-item.type-2 .trim-div-1::after {
	position: absolute;
	content: "";
	width: 8px;
	height: 13px;
	border: 1px solid #999999;
	top: 8px;
	right: 8px;
	left: unset;
	transition: all .3s
}

.page-content .right-show .top-menu-info .choice-buttons .choice-button-item.type-2 .trim-div-2::before {
	position: absolute;
	content: "";
	width: 8px;
	height: 13px;
	border: 1px solid #999999;
	bottom: 8px;
	left: 8px;
	transition: all .3s
}

.page-content .right-show .top-menu-info .choice-buttons .choice-button-item.type-2 .trim-div-2::after {
	position: absolute;
	content: "";
	width: 8px;
	height: 3px;
	border: 1px solid #999999;
	bottom: 8px;
	right: 8px;
	transition: all .3s
}

.page-content .right-show .top-menu-info .choice-buttons .choice-button-item .trim-div-2 {
	width: 100%;
	height: 100%;
	position: absolute;
	z-index: 2;
}



.page-content .right-show .bottom-file-content {
	width: 100%;
	/* height: calc(100% - 70px -2px); */
	padding: 22px 34px;
	box-sizing: border-box;
	overflow: auto;
	display: flex;
	flex-wrap: wrap;
	/* justify-content: center; */

}

.page-content .right-show .bottom-file-content.info-type {
    flex-direction: column;
    flex-wrap: nowrap;
}

.page-content .right-show .bottom-file-content::-webkit-scrollbar {
	width: 6px;
}

.page-content .right-show .bottom-file-content::-webkit-scrollbar-thumb {
	width: 6px;
	background-color: #2222ac;
}

.page-content .right-show .bottom-file-content .file-item-mode-2 {
    width: 100%;
    height: 90px;
    border-bottom: #ddd 1px solid;
    margin: 0 20px;
    display: flex;
    justify-content: space-between;
    flex-wrap: nowrap;
    align-items: center;
}

.page-content .right-show .bottom-file-content .file-item-mode-2 .first-part{
    display: flex;
    align-items: center;
}
.page-content .right-show .bottom-file-content .file-item-mode-2 .img-show {
    width: 60px;
    height: 45px;
    position: relative;
    display: block;
    margin-right: 14px;
}

.page-content .right-show .bottom-file-content .file-item-mode-2 .file-check {
    width: 18px;
	height: 18px;
	-webkit-appearance: none;
	border-radius: 50%;
	border: 2px solid #999999;
	opacity: 1;
	margin: 0 15px;
	cursor: pointer;
	transition: all .3s;
}

/*.page-content .right-show .bottom-file-content .file-item-mode-2:hover .file-check {*/
/*    opacity: 0.7;*/
    
/*}*/

.page-content .right-show .bottom-file-content .file-item-mode-2 .file-check:checked {
        background-color: #999999;
    background-image: url(/mstatic/img/ischoiced-icon-1.png);
    background-position: 50% 50%;
    background-size: auto;
    background-repeat: no-repeat;
}

.page-content .right-show .bottom-file-content .file-item-mode-2 .img-show .file-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    position: relative;
    transition: all .3s;
    z-index: 1;
    cursor: pointer;
    border-radius: 5px;
    background-color: #ffffff;
}

.page-content .right-show .bottom-file-content .file-item-mode-2 .img-show .video-icon {
    width: 35px;
    height: 35px;
    object-fit: cover;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 2;
}

.page-content .right-show .bottom-file-content .file-item-mode-2 .file-mode-2-info {
    width: 42%;
    display: flex;
    align-items: center;
}

.page-content .right-show .bottom-file-content .file-item-mode-2 .file-mode-2-info .text {
    margin-left: 12px;
}

.page-content .right-show .bottom-file-content .file-item-mode-2 .file-mode-2-info .text span{
    color: #333333;
    font-size: 16px;
    font-weight: 600;
    margin: 0 3px;
    
}
.page-content .right-show .bottom-file-content .file-item.type-1 {
	width: 18%;
	aspect-ratio: 1;
	/* height: 12.5vw; */
	position: relative;
	overflow: hidden;
	border-radius: 30px;
	margin-right: auto;
	margin-bottom: 30px;
	box-shadow: 0 0 2px 0px #00000059;
	transition: all .3s;
}


.page-content .right-show .bottom-file-content .file-item.type-2 {
	width: 18%;
    height: 235px;
    position: relative;
    overflow: hidden;
    margin-right: auto;
    margin-bottom: 15px;
    transition: all .3s;
}

.page-content .right-show .bottom-file-content .file-item.unshow {
    box-shadow:unset;
    height: 0;
    margin-bottom: 0;
}

.page-content .right-show .bottom-file-content .file-item .img-put {
    width: 100%;
    height: 210px;
    position: relative;
    display: block;
    box-shadow: 0 0 2px 0px #00000059;
	border-radius: 15px;
	overflow: hidden;
}

.page-content .right-show .bottom-file-content .file-item .video-icon {
    width: 95px;
    height: 95px;
    object-fit: cover;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    z-index: 2;
}


.page-content .right-show .bottom-file-content .file-item .check-mask {
	width: 100%;
	height: 210px;
	position: absolute;
	top: 100%;
	left: 0;
	z-index: 4;
	background-color: #000000;
	opacity: .3;
	cursor: pointer;
	border-radius: 15px;
}

.page-content .right-show .bottom-file-content .file-item:hover .check-mask {
	top: 0;
	
}

.page-content .right-show .bottom-file-content .file-item.check .check-mask {
	top: 0;
}

.page-content .right-show .bottom-file-content .file-item .hover-button {
	display: none;
	justify-content: center;
	align-items: center;
	position: absolute;
	z-index: 4;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
}

.page-content .right-show .bottom-file-content .file-item .hover-button .button-item {

	width: 65px;
	height: 65px;
	display: flex;
	justify-content: center;
	align-items: center;
	background-color: #2222ac;
	border-radius: 50%;
	margin: 0 10px;
	cursor: pointer;
}

.page-content .right-show .bottom-file-content .file-item:hover .hover-button {
	display: none;
}

.page-content .right-show .bottom-file-content .file-item .file-img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	position: relative;
	transition: all .3s;
	z-index: 1;
	cursor: pointer;
	border-radius: 10px;
	background-color: #ffffff;
}

/*.page-content .right-show .bottom-file-content .file-item.type-1 .file-img {*/
/*    object-fit: contain;*/
/*}*/
/*.page-content .right-show .bottom-file-content .file-item.type-2 .file-img {*/
/*    object-fit: cover;*/
/*}*/

.page-content .right-show .bottom-file-content .second-title {
    color: #333333;
    text-align: center;
    font-size: 16px;
    margin-top: 5px;
    width: 100%;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.page-content .right-show .bottom-file-content .file-item .file-text {
    display: block;
    height: unset;
	position: absolute;
	bottom: 50px;
	left: 19px;
	z-index: 5;
	width: calc(100% - 38px);
	line-height: 1.3em;
	color: #fff;
	text-shadow: 0px 2px 1px #3d3d3d;
	opacity: 0;
	font-family: "bnp-sreg";
	word-wrap: break-word;
	white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
	/*text-shadow: 0px 0px 2px #000000ab;*/
	/*transition: all .3s;*/
}

.page-content .right-show .bottom-file-content .file-item:hover .file-text {
    white-space: wrap;
    overflow: hidden;
    text-overflow: ellipsis;
    opacity: 1;
}

.page-content .right-show .bottom-file-content .file-item.check .file-text {
    opacity: 1;
}
.page-content .right-show .bottom-file-content .file-item .file-check {
	position: absolute;
	z-index: 7;
	left: 5px;
	top: 20px;
    width: 18px;
    height: 18px;
    -webkit-appearance: none;
    border-radius: 50%;
    border: 3px solid #999999;
    opacity: 1;
    margin: 0 15px;
    transition: all .3s;
    cursor: pointer;
}

.page-content .right-show .bottom-file-content .file-item .file-check:checked {
    background-color: #999999;
    background-image: url(/mstatic/img/ischoiced-icon-1.png);
    background-position: 50% 50%;
    background-size: auto;
    background-repeat: no-repeat;
}

.info-detail {
	width: 100%;
	height: 100vh;
	padding: 70px 0 0;
	box-sizing: border-box;
	display: flex;
	justify-content: space-between;
	align-items: center;
	background-color: #eef2f5;
	position: absolute;
	z-index: 12;
	transition: all .3s;
}

.info-detail .left-file-info {
	width: 78%;
	height: 100%;
	position: relative;
	overflow: hidden;
	transition: all .1s;
}

.info-detail .left-file-info.sp {
    width: 100%;
}

.info-detail .left-file-info .Watermark {
    width: 120%;
    height: 120%;
    top: 50%;
    left: 50%;
    display: flex;
    flex-wrap: wrap;
    /*display: none;*/
    transform: translate(-50%, -50%) rotate(20deg) scale(1.2);
    position: absolute;
    z-index: 3;
    /*background-image: url(/mstatic/img/water_2.png);*/
    pointer-events:none;
}

.info-detail .left-file-info .Watermark.hide {
    display: none;
}

.info-detail .left-file-info .Watermark .watermark-text {
    width: 20%;
    height: 20%;
    text-align: center;
    color: #182e61;
    opacity: .2;
    font-size: 16px;
    display: flex;
    justify-content: center;
    align-items: center;
    box-sizing: border-box;
}
.info-detail .left-file-info .img-put {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: 70%;
	height: 80%;
	display: flex;
	justify-content: center;
	align-items: center;
	
}

.info-detail .left-file-info .img-put.sp {
    background: #3c3c3c;
    width: 100%;
    height: 100%;
}


.info-detail .left-file-info .img-put .left-button {
	width: 67px;
	height: 67px;
	border-radius: 50%;
	background-color: #2222ac;
	display: flex;
	justify-content: center;
	align-items: center;
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	left: -90px;
	cursor: pointer;
}

.info-detail .left-file-info .img-put .right-button {
	width: 67px;
	height: 67px;
	border-radius: 50%;
	background-color: #2222ac;
	display: flex;
	justify-content: center;
	align-items: center;
	position: absolute;
	top: 50%;
	transform: translateY(-50%) rotate(180deg);
	right: -90px;
	cursor: pointer;
}

.info-detail .left-file-info .img-put .show-img {
	width: 100%;
    height: 100%;
    object-fit: contain;
}

.info-detail .left-file-info .img-put .show-img.iframe-style {
    height: 100%;
    width: 100%;
    border: none;
}

.info-detail .right-file-info {
	width: 22%;
	height: 100%;
	display: flex;
	flex-direction: column;
	background-color: #fff;
	overflow: auto;
	position: relative;
	transition: all .3s;

}

.info-detail .right-file-info.sp {
    width: 0;
}

.info-detail .expand {
    width: 50px;
    height: 50px;
    position: absolute;
    z-index: 3;
    top: 90%;
    right: 0;
    transform: translate(-50%, -50%);
    border: 1px solid #111111;
    background-color: #ffffff;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: pointer;
    transition: all .3s;
    opacity: 0;
}

.info-detail .expand.sp {
    opacity: 1;
    transform: translate(-50%, -50%) rotate(180deg) ;
}

.info-detail .expand img {
    width: 40%;
    object-fit: contain;
}

.info-detail .right-file-info::-webkit-scrollbar {
	width: 3px;
}

.info-detail .right-file-info::-webkit-scrollbar-thumb {
	width: 3px;
	background-color: #2222ac;
}

.info-detail .right-file-info .part-0 {
    width: 100%;
	min-height: 70px;
	display: flex;
	justify-content: flex-start;
	align-items: center;
	padding: 0 70px 0 25px;
	box-sizing: border-box;
	border-bottom: 1px solid #efefef;
}

.info-detail .right-file-info .part-0 img {
    width: 38px;
    height: 38px;
    border-radius: 5px;
    display: flex;
    justify-content: center;
    align-items: center;
    box-shadow: 0 0 3px #cccccc;
    position: relative;
    transition: all .3s;
    cursor: pointer;
    padding: 8px;
    box-sizing: border-box;
}
.info-detail .right-file-info .part-1 {
	width: 100%;
	min-height: 70px;
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: 0 70px 0 25px;
	box-sizing: border-box;
	border-bottom: 1px solid #efefef;
}

.info-detail .right-file-info .part-1 .part-title {
	color: #242424;
	line-height: 1;
	font-family: "bnp-sbold";
}

.info-detail .right-file-info .part-1 .part-buttons {
	display: flex;
}

.info-detail .right-file-info .part-1 .part-buttons .button-type-1 {
	min-width: 38px;
	height: 38px;
	border-radius: 5px;
	display: flex;
	justify-content: center;
	align-items: center;
	margin-left: 25px;
	position: relative;
	transition: all .3s;
	padding: 12px;
	box-sizing: border-box;
	border: 1px solid #cccccc;
	cursor: pointer;
}

.info-detail .right-file-info .part-1 .part-buttons .button-type-1 img {
	opacity: 1;
}

.info-detail .right-file-info .part-1 .part-buttons .button-type-1 span {
	margin-left: 15px;
	color: #242424;
	line-height: 1;
	white-space: nowrap;
	font-family: "bnp-sreg";
}

.info-detail .right-file-info .part-1 .part-buttons #close-detail {
    display: none;
}

.info-detail .right-file-info .part-2 {
	width: 100%;
	min-height: 80px;
	/* line-height: 80px; */
	word-break: break-all;
	display: flex;
	justify-content: flex-start;
	align-items: center;
	padding: 10px 70px 10px 25px;
	box-sizing: border-box;
	border-bottom: 1px solid #efefef;
	color: #242424;
	line-height: 1.2em;
}

.info-detail .right-file-info .part-3 {
	width: 100%;
	display: flex;
	flex-direction: column;
	padding: 15px 70px 15px 25px;
	box-sizing: border-box;
	border-bottom: 1px solid #efefef;
	color: #666666;
	font-family: "bnp-sreg";
}

.info-detail .right-file-info .part-3 .summary-part {
	line-height: 1.6em;
	margin-top: 20px;
}

.info-detail .right-file-info .part-3 .tag-part {
	display: flex;
	margin-top: 20px;
	flex-wrap: wrap;
}

.info-detail .right-file-info .part-3 .tag-part .tag-button {
	min-width: 38px;
	min-height: 38px;
	border-radius: 5px;
	display: flex;
	justify-content: center;
	align-items: center;
	position: relative;
	transition: all .3s;
	padding: 0 12px;
	box-sizing: border-box;
	border: 1px solid #cccccc;
	margin-right: 15px;
	margin-bottom: 15px;
}

.info-detail .right-file-info .part-3 .other-infos {
	display: flex;
	flex-direction: column;
	margin-top: 20px;
}

.info-detail .right-file-info .part-3 .other-infos .other-info-item {
	line-height: 1.2em;
	color: #666666;
	font-family: "bnp-sreg";
	margin-bottom: 1em;
}

.downloadmenu {
	width: 100%;
	height: 70px;
	display: flex;
	align-items: center;
	position: absolute;
	top: 0px;
	left: 0;
	background-color: #fff;
	z-index: 3;
}

.downloadmenu .inside {
	display: flex;
	align-items: center;
}

.downloadmenu .inside .text-part {
	line-height: 1;
	color: #242424;
}

.downloadmenu .inside .button-list {
	display: flex;
	margin-left: 40px;
}

.downloadmenu .inside .button-list .button-item {
	min-width: 38px;
	min-height: 38px;
	border-radius: 5px;
	display: flex;
	justify-content: center;
	align-items: center;
	position: relative;
	transition: all .3s;
	padding: 0 12px;
	box-sizing: border-box;
	border: 1px solid #cccccc;
	margin-right: 15px;
	font-family: "bnp-sreg";
	color: #999999;
	cursor: pointer;

}

.downloadmenu .inside .button-list .button-item img {
    width: 20px;
	margin-left: 15px;
	opacity: .3;
	transition: all .3s;
}

.downloadmenu .inside .button-list .button-item:hover {
	background-color: #eef2f5;
}

.downloadmenu .inside .button-list .button-item:hover img {
	opacity: 1;
}


@media screen and (max-width:1450px){
	.info-detail .left-file-info {
		width: 68%;
	}
	.info-detail .right-file-info {
		width: 32%;
	}
	.page-content .right-show {
		width: 72%;
	}
	.page-content .left-menu {
		width: 28%;
	}
	/* .page-content .right-show .bottom-file-content .file-item.type-2 {
		width: 31%;
	} */
	.header .header-search {
		width: auto;
	}
	.fileTypeChoice {
		width: 120px;
	}
	.header .header-search .submit {
		width: 120px;
	}
	.page-content .right-show .bottom-file-content .file-item.type-1 {
	width: 23%;
	}
	.page-content .right-show .bottom-file-content .file-item.type-2 {
	width: 23%;
	}


}

@media screen and (max-width:1000px){
    .feedback-page .feedback .submit-button {
        width: 120px;
    }
	.fs20 {
		font-size: 18px;
	}
	/*.page-content .right-show .bottom-file-content .file-item.type-1 {*/
 /*       width: calc((100vw - 119px) / 4);*/
 /*       height:calc((100vw - 119px) / 4) ;*/
	/*}*/
	/* .page-content .right-show .bottom-file-content .file-item.type-2 {
		width: calc(50% - 10px);
		margin-right: 20px;
		margin-bottom: 20px;
	} */
	/* .page-content .right-show .bottom-file-content .file-item.type-2:nth-child(2n) {
		width: calc(50% - 10px);
		margin-right: 0px;
	} */
	.page-content .right-show .bottom-file-content .file-item.type-1 {
	width: 31%;
	}
	.page-content .right-show .bottom-file-content .file-item.type-2 {
	width: 31%;
	}
	.page-content .right-file-filter {
        position: absolute;
        right: 0;
        bottom: 0;
        z-index: 10;
        height: calc(100% - 158px);
        border: 0;
        border-radius: 0;
	}
	
	.email-info-show .email-info-content .email-left-list {
	    width: 26vw;
	}
	.email-info-show .email-info-content .email-right-show {
        width: calc(100% - 26vw);
	    
	}
}

@media screen and (max-width:880px){
    .header-search .submit {
        width: 20%;
    }
    .mobile-not-show {
        display: none;
    }
    .mobile-show {
        width: 90%;
        height: 150px;
        margin: 10px auto;
        display: flex;
    }
    .page-content .left-menu .tree-menu {
        padding: 8vw;
    }
    .page-content .button-type-1.click-1 {
        margin-right: 15px;
        margin-left: 0;
    }
	.fileTypeChoice {
		width: 100px;
	}
	.header .header-search .input {
		width: 150px;
	}
	.header .header-search .submit {
        width: 60px;
    }
	.page-content .left-menu {
		position: absolute;
		width: 60%;
        z-index: 100;
        top: 0;
	}
	.page-content .right-show {
        width: 100%;
    }
	.info-detail .right-file-info {
        width: 100%;

    }
	.info-detail {
		flex-direction: column;
		height: auto;
	}
	.page-content .right-show .top-menu-info {
		width: 100%;
		min-height: 100px;
		height: auto;
		flex-wrap: wrap;
	}
	.page-content .right-show .top-menu-info .choice-buttons .choice-button-item {
		margin-left: 0;
		margin-right: 15px;
	}
	.header .lang-user-choice .user {
		margin-right: 10px;
	}
	.header .lang-user-choice .user span {
		display: none;
	}
	.page-content .right-show .top-menu-info .choice-buttons .choice-button-item.file-filter .file-filter-list {
		transform: translateX(40%);
	}
	.fileTypeChoice-show {
		left: 100%;
	}
	.fileTypeChoice img {
        margin-left: 5px;
    }
	
	.fileTypeChoice-show.sp {
        left: 160%;
    }
	.info-detail .left-file-info {
        width: 100%;
        padding: 70px 0 120px;
		height: 40vh;
    }
	.info-detail .left-file-info .img-put .left-button {
		width: 55px;
		height: 55px;
		top: 115%;
		left: 30%;
	}
	.info-detail .left-file-info .img-put .right-button {
		width: 55px;
		height: 55px;
		top: 115%;
		transform: translateY(-50%) rotate(180deg);
		right: 30%;
	}
	.info-detail .left-file-info .img-put {
	    height: 90%;
		width: 80%;
	}
	.info-detail .left-file-info .img-put .show-img {
		width: auto;
		height: 100%;
		margin: 0 auto;
	}
	.page-content .left-menu .top-menu-1 .button-type-1 .file-sort-list {
		width: 210px;
		height: 200px;
		left: unset;
		right: 0;
		transform: translateX(0);
	}
	.page-content .right-show .bottom-file-content .file-item.type-1 {
	width: 42%;
	}
	.page-content .right-show .bottom-file-content .file-item.type-2 {
	width: 42%;
	}


 }

 /*@media screen and (max-width:780px) {*/
	/*.page-content .right-show .bottom-file-content .file-item.type-2 {*/
	/*	margin-right: 0;*/
	/*}*/
 /*}*/

 @media screen and (max-width:680px) {
    .page-content .right-show .bottom-file-content .file-item.type-1 {
    	width: 100%;
    	margin-right: auto;
    	margin-left: auto;
	}
	.page-content .right-show .bottom-file-content .file-item.type-2 {
	    width: 100%;
    	margin-right: auto;
    	margin-left: auto;
	}
 }

 @media screen and (max-width:520px){
	.fileTypeChoice {
        width: 80px;
    }
	.header .header-search .input {
        width: 100px;
    }
	.page-content .left-menu {
        position: absolute;
        width: 100%;
	}
	.page-content .left-menu .first-menu .second-menu .second-menu-item.sp::after {
		width: 100%;
	}
	.page-content .right-show .top-menu-info {
		padding: 10px 28px;
	}
	.page-content .right-show .bottom-file-content {
	    padding: 22px 28px;
	}


 }
 
 /* 浅色模式 */
/*@media (prefers-color-scheme: light) {*/
/*.iframe-use {*/
/*                    position: absolute;*/
/*                    content: "";*/
/*                    top: 0;*/
/*                    right: 0;*/
/*                    width: 100%;*/
/*                    height: 54px;*/
/*                    color: #fff;*/
/*                    display: flex;*/
/*                    background: #fff;*/
/*                    align-items: center;*/
/*                    padding-left: 20px;*/
/*                    box-sizing: border-box;*/
/*                    pointer-events: none;*/
                    /* user-select: all; */
/*                }*/
/*}*/

/* 深色模式 */
/*@media (prefers-color-scheme: dark) {*/
/*    .iframe-use {*/
/*                    position: absolute;*/
/*                    content: "";*/
/*                    top: 0;*/
/*                    right: 0;*/
/*                    width: 100%;*/
/*                    height: 54px;*/
/*                    color: #fff;*/
/*                    display: flex;*/
/*                    background: #3c3c3c;*/
/*                    align-items: center;*/
/*                    padding-left: 20px;*/
/*                    box-sizing: border-box;*/
/*                    pointer-events: none;*/
                    /* user-select: all; */
/*                }*/
/*}*/