body {
	font: 16px;
	color: #000;
	@media (max-width: 768px) {
	}
}
.d-flex {
	display: flex;
}
.flex-column {
	flex-direction: column;
}
.al-c {
	align-items: center;
}

.al-b {
	align-items: baseline;
}

.al-fs {
	align-items: flex-start;
}

.al-fe {
	align-items: flex-end;
}

.al-s {
	align-items: stretch;
}

.jc-c {
	justify-content: center;
}

.jc-s {
	justify-content: space-between;
}

.jc-sa {
	justify-content: space-around;
}

.jc-se {
	justify-content: space-evenly;
}

.jc-fs {
	justify-content: flex-start;
}

.jc-fe {
	justify-content: flex-end;
}
.flex-center {
	display: flex;
	align-items: center;
	justify-content: center;
}
.flex-column-center {
	display: flex;
	align-items: center;
	justify-content: center;
	flex-direction: column;
}
.d-grid {
	display: grid;
}

.grid1 {
	grid-template-columns: repeat(1, 1fr);
}

.grid2 {
	grid-template-columns: repeat(2, 1fr);
}

.grid3 {
	grid-template-columns: repeat(3, 1fr);
}

.grid4 {
	grid-template-columns: repeat(4, 1fr);
}

.grid5 {
	grid-template-columns: repeat(5, 1fr);
}

.grid6 {
	grid-template-columns: repeat(6, 1fr);
}

.grid7 {
	grid-template-columns: repeat(7, 1fr);
}

.grid8 {
	grid-template-columns: repeat(8, 1fr);
}

.grid9 {
	grid-template-columns: repeat(9, 1fr);
}

.grid10 {
	grid-template-columns: repeat(10, 1fr);
}
.bannerSwiper {
	.swiper-pagination-bullet {
		width: 44px;
		height: 6px;
		opacity: 1;
		border-radius: 6.5px;
		background: rgba(255, 255, 255, 1);
	}
	.swiper-pagination-bullet-active {
		background-color: var(--ftc);
	}
}
footer {
    padding: var(--p60);
    padding-bottom: 0px;
    background-color: #191919;
    color: #fff;

    .footer1 {
        .d-flex;
        .al-fs;
        .jc-s;
        gap: var(--p40);
    }

    h2 {
        margin: var(--p20) 0;
        font-size: var(--ft30);
        color: var(--ftc);
    }

    h3 {
        /*margin: var(--p20) 0;*/
        font-size: var(--ft16);
        color: var(--ftc);
    }

    ul {
        display: flex;
        align-items: center;
        gap: var(--p10);

        li {
            .flex-column-center;
            gap: var(--p10);

            a:hover {
                color: var(--ftc);
            }
        }
    }

    .Logo {
        .d-flex;
        .al-c;
        gap: var(--p20);
        margin-bottom: var(--p40);
    }

    p {
        margin: var(--p20) 0;
    }

    .copy {
        line-height: 45px;
        background: #191919;
        text-align: center;
        color: #999;
        padding:20px;
    }
    /*footer导航*/
    .footerNav {
        div a {
            display: block;
            color: #999;
            text-decoration: none;
            white-space: nowrap;
            overflow: hidden;
            text-overflow: ellipsis;
            padding: 4px 0;
            transition: color 0.3s;
        }

        div a:hover {
            color: var(--ftc);
        }
    }
}
header {
  position: sticky !important;
  top: 0;
  background: #fff;
	padding: var(--p10) 0;
	.layui-main {
		.d-flex;
		.al-c;
		.jc-s;
		gap: var(--p80);
		.layui-nav {
			flex: 1;
			gap: var(--p80);
			.d-flex;
		}
		.layui-nav .layui-nav-item > a {
			color: #000;
			white-space: nowrap;
			padding: 0;
		}
		.layui-nav .layui-this a,
		.layui-nav .layui-nav-item a:hover {
			color: var(--ftc);
		}
	}
}
.loginPage {
	background-image: url(../images/login.png);
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center center;

	.layui-main {
		.d-flex;
		.jc-fe;
	}
	.loginBox {
	    min-height:510px;
		border-radius: 4px;
		background: rgba(255, 255, 255, 1);
		box-shadow: 0px 2px 10px rgba(0, 0, 0, 0.19);

		width: 412px;
		max-width: 100%;
		position: relative;
		.d-flex;
		.flex-column;
		form {
		}
		.layui-tab .layui-tab-title:after {
			display: none;
		}
		.layui-tab {
			padding: var(--p50);
			padding-bottom: 0;
			flex: 1;
		}
		.Text {
			box-shadow: 0px -1px 0px rgba(0, 0, 0, 0.07);
			padding: var(--p30) var(--p10);
			text-align: center;
			font-size: 14px;
			color: #8b8b8b;
		}
		.tabImg {
			position: absolute;
			right: 0;
			top: 0;
		}
		.signup {
			display: block;
			text-align: center;
			color: var(--ftc);
			font-size: var(--ft18);
		}

		.code_btn {
			--btn: 50px;
			background: #fff;
			padding: 0 10px;
		}
		.layui-tab .layui-tab-title li {
			padding: 0;
			margin-right: 20px;
		}
	}
	.registerBox{
	    min-height:585px;
	}
}
.AboutPage {
	padding: var(--p20) 0;
	ul {
		.d-grid;
		.grid4;
		gap: var(--p30);
		li {
			padding: var(--p30);
			border-radius: 20px 0px 20px 0px;
			color: #fff;

			font-size: var(--ft18);
			text-align: center;
			background: linear-gradient(
					0deg,
					rgba(32, 180, 147, 1),
					rgba(32, 180, 147, 1)
				),
				linear-gradient(
					0deg,
					rgba(57, 205, 65, 1),
					rgba(57, 205, 65, 1)
				),
				#16baaa;
			div {
				.d-flex;
				.al-fs;
				.jc-c;
				margin-top: 10px;
				font-weight: bold;
				font-size: var(--ft20);
				margin-bottom: var(--p20);
			}
			.slowNumber {
				font-size: var(--ft30);
			}
		}
	}
}
.searchForm {
	display: flex;
	width: 920px;
	max-width: 100%;
	margin: 0 auto var(--p40);
	border-radius: 10px;
	overflow: hidden;
	--btn: 50px;

	.layui-input {
		border-radius: 10px 0 0 10px;
	}
	.layui-input-wrap {
		flex: 1;
	}
	.layui-btn {
		border-radius: 0 10px 10px 0;
	}
}
iframe{
    width: 100%;
    height: 60vh;
}
.productPage {
    background: linear-gradient( 0deg, rgba(249, 250, 252, 1), rgba(249, 250, 252, 1) ), #f6f8fa;

    .tabTitle {
        background: #fff;
        display: grid;
        grid-template-columns: repeat(10,1fr);

        @media (max-width: 768px) {
            grid-template-columns: repeat(5,1fr);
        }

        .item {
            border: 0.5px solid #e9e9e9;

            &.layui-this {
                color: var(--ftc);
                background: #d0f4ec;
            }

            @media (max-width: 768px) {
                padding: 0;
                min-width: auto;
            }
        }

        margin-bottom: var(--p40);
    }

    .layui-tab-title .layui-this:after {
        display: none;
    }

    .layui-tab-bar {
        display: none;
    }
    
   
}
.btnmore {
    margin-top: var(--p60);
    .flex-center;

    .layui-btn {
        --btn: 50px;
        width: 270px;
    }
}
.productList {
    .d-grid;
    .grid4;
    gap: var(--p30);

    .item {
        border-radius: 8px;
        background: #ffffff;
        box-shadow: 0px 2px 10px rgba(0, 0, 0, 0.1);
        transition: all 0.5s;
        overflow: hidden;
        position: relative;
        display: block;

        * {
            transition: all 0.5s;
        }

        .img {
            position: relative;
            aspect-ratio: 280/194;
        }

        .content {
            padding: 10px 8px;
            .d-grid;
            gap: var(--p10);

            h1 {
                font-weight: normal;
            }

            .btn {
                .d-flex;
                .al-c;
                .jc-s;
                --btn: 30px;

                .layui-btn {
                    background: #fff;
                    color: var(--ftc);
                    font-size: 14px;
                    padding: 0 12px;
                    border: 1px solid var(--ftc);
                }
            }

            .desc {
                color: #999999;
                font-size: 12px;
            }

            .tnum {
                color: #ff5722;
                padding: 5px;
            }
        }

        .block {
            overflow:hidden;
            position: absolute;
            top: 100%;
            bottom: 0;
            left: 0;
            right: 0;
            line-height: 1.7em;
            padding: var(--p10);
            .flex-center;
            background: rgba(0, 0, 0, 0.4);
            color: #fff;
            z-index: 5;
            font-size:13px;
        }

        &.free::before {
            z-index: 5;
            display: block;
            content: '';
            position: absolute;
            right: -20px;
            top: -20px;
            width: 91px;
            aspect-ratio: 1 / 1;
            background: url(../images/free.png) no-repeat;
            background-size: auto;
            background-position: top;
        }

        &:hover {
            .block {
                top: 0;
            }
        }
    }
}
.pageNum {
	margin-top: var(--p60);
	text-align: center;
}
.detailsPage {
	padding: var(--p40) 0;
	.d-grid;
	grid-template-columns: 1fr 370px;
	gap: var(--p40);
	@media (max-width: 768px) {
		grid-template-columns: 1fr;
	}
}
.bg_gary {
	background: #f5f5f5;
}
.hotPage {
    .d-flex;
    .flex-column;
    @color: #20b493;

    .Card {
        margin-bottom: var(--p40);
        --color: #20b493;
        border-top: 1px solid var(--color);
        padding: var(--p20) 12px;
        border-radius: 2px;
        background: #ffffff;
        box-shadow: 0px 2px 5px rgba(194, 194, 194, 0.5);

        .Text {
            .d-flex;
            .al-c;
            .jc-s;
            border-bottom: 1px solid #e0e0e0;
            padding-bottom: 15px;
            margin-bottom: 15px;

            h1 {
                color: var(--color);
                font-size: var(--ft30);
            }

            .layui-btn {
                font-size: 12px;
                --btn: 20px;
                border-radius: 0;
                padding-right: 0;
                padding-left: 10px;
                background-color: var(--color);
            }
        }

        ul {
            .d-grid;
            gap: 15px;

            .item {
                .d-flex;
                .al-c;
                gap: var(--p10);

                .title {
                    flex: 1;
                    flex-shrink: 0;
                    text-overflow: ellipsis;
                    overflow: hidden;
                    white-space: nowrap;
                }

                .number {
                    color: #999999;
                    font-size: 14px;
                }
            }

            .item:hover {
                color: #31bdec; /* 悬停时的颜色 */
            }
        }
    }

    .Hot {
        --color: #f2ad30;
        @color: #f2ad30;
    }

    .Fist {
        --color: #076baf;
    }

    .green {
        color: #16b777
    }
}
.ComCard {
	background: #fff;
	border-radius: 20px;
	box-shadow: 0px 2px 5px rgba(194, 194, 194, 0.5);
}
.red {
	color: #b80000;
}
.detailsContent {
    .Info {
        padding: var(--p50);

        h1 {
            text-align: center;
            font-size: var(--ft26);
            margin-bottom: var(--p40);
            font-weight:bold;
        }

        .desc {
            color: #999;
            margin: var(--p20) 0;
        }

        .btn {
            .d-flex;
            .al-c;
            .jc-s;
            font-size: var(--ft18);
            white-space: nowrap;
            flex-wrap: wrap;

            .layui-btn {
                width: 270px;
            }

            .tnum {
                padding: 5px;
            }
        }

        ul {
            margin-top: var(--p30);
            .d-flex;
            .al-c;
            .jc-s;
            gap: var(--p20);
            white-space: nowrap;
            flex-wrap: wrap;

            li {
                .d-flex;
                .al-c;
                gap: 2px;

                span {
                    .red;
                    font-size: var(--ft24);
                }
            }

            a {
                .d-flex;
                .al-c;
                gap: 5px;
                color: var(--ftc);
            }
        }
    }

    .wanCheng {
        margin-top: var(--p60);
        padding: var(--p30) var(--p90);

        h1 {
            font-weight: normal;
            text-align: center;
            font-size: var(--ft30);
            background: url(../images/detailstTitle.png) no-repeat;
            background-position: center;
            background-size: 100% 100%;
            display: table;
            margin: 0 auto;
            padding: 0 var(--p50) 10px;
            color: #3887ee;
        }

        ul {
            .d-grid;
            margin-top: var(--p40);
            gap: var(--p10);
            margin-bottom: var(--p60);

            .item {
                font-size: var(--ft18);
                .d-flex;
                gap: var(--p10);
                position: relative;
                padding-top: var(--p20);
                position: relative;
                .al-c;

                i {
                    position: absolute;
                    top: 0;
                    width: var(--p50);
                    height: var(--p50);
                    .flex-center;
                    border-radius: 50%;
                    color: #fff;
                    opacity: 1;
                    background: linear-gradient( 0deg, rgba(56, 135, 238, 1), rgba(56, 135, 238, 1) ), #d8d8d8;
                }

                span {
                    margin-left: var(--p30);
                    padding: var(--p20);
                    border-radius: 20px;
                    background: #e5eaf6;
                    display: inline-block;
                    width: 513.48px;
                    max-width: 100%;
                }

                &:nth-child(even) {
                    i {
                        right: 0;
                    }

                    .jc-fe;

                    span {
                        margin-right: var(--p30);
                    }
                }
            }
        }
    }

    .xuZhi {
        margin-top: var(--p30);
        padding: var(--p30) var(--p90);

        h1 {
            font-weight: normal;
            text-align: center;
            font-size: var(--ft30);
            position: relative;

            span {
                position: relative;
                z-index: 2;
            }

            img {
                position: absolute;
                left: 50%;
                transform: translateX(-50%);
                bottom: 0;
                z-index: 0;
            }
        }

        h2 {
            margin-top: var(--p10);
            font-weight: normal;
            text-align: center;
        }

        ul {
            .d-grid;
            margin-top: var(--p40);
            gap: var(--p10);
            margin-bottom: var(--p60);

            .item {
                font-size: var(--ft18);
                border-radius: 20px;
                background: #e5eaf6;
                padding: var(--p20);
                .d-flex;
                gap: var(--p10);
                .al-c;

                i {
                    display: inline-block;
                    width: 6px;
                    height: 100%;
                    background: #076baf;
                }
            }
        }
    }

    .shuoMing {
        margin-top: var(--p30);
        padding: var(--p50) var(--p90);

        .content {
            margin-top: var(--p60);
            font-size: var(--ft18);
            line-height: 1.7em;

            .red {
                color: #b50000;
            }
        }

        h1 {
            font-weight: normal;
            text-align: center;
            font-size: var(--ft30);
        }

        h2 {
            margin-top: var(--p10);
            font-weight: normal;
            text-align: center;
        }
    }
}
.question {
	padding: 0;
}
.questionDetail {
	h1 {
		text-align: center;
		font-size: var(--ft36);
		font-weight: normal;
		height: 146px;
		.flex-center;
	}
	.progress {
		position: relative;
	}
	.layui-progress {
		width: 480px;
		max-width: 60%;
	}
	.layui-bg-orange {
		background-color: #ed7b2f !important;
	}
	.Card {
		border-radius: 30px;
		background: #ffffff;
		.Text {
			white-space: nowrap;
			font-size: var(--ft18);
			border-bottom: 1px solid #e3e3e3;
			.number {
				color: #ed7b2f;
				font-size: var(--ft24);
			}
			padding: var(--p20) var(--p30);
			.d-flex;
			.al-c;
			.jc-s;
			.time {
				.d-flex;
				.al-c;
				i {
					font-size: var(--ft20);
				}
				gap: 3px;
				color: #ed7b2f;
				font-size: var(--ft18);
			}
		}
		.Content {
			padding: var(--p40) var(--p100);
			min-height: 400px;
			.title {
				font-size: var(--ft18);
				padding: var(--p20) 0;
				input{
			         border: none;
				    border-bottom: 1px solid #000;
				}
			}
		
			ul {
				.d-grid;
				margin-top: var(--p30);
				gap: var(--p40);
				.item {
					cursor: pointer;
					display: block;
					padding: 18px;
					border-radius: 4px;
					background: #fbfcfe;
					border: 1px solid #eef4ff;
					.num {
						color: #ed7b2f;
					}
					&.active {
						background-color: rgba(240, 151, 101, 0.1);
					}
				}
			}
			
		}
		.btn {
				padding:  var(--p80) 0;
				.flex-center;
				gap: var(--p30);
				--btn: 50px;

				.layui-btn {
					width: 180px;
					background: #f09765;
					border-radius: 0;
				}
				.disbalse{
				    
					background: #cdcdcd;
				}
			}
	}
}
.comTiele {
	text-align: center;
	position: relative;
	font-size: var(--ft48);
	margin-bottom: var(--p30);
	h4 {
		position: relative;
		z-index: 1;
	}
	h5 {
		top: -10px;
		width: 100%;
		opacity: 0.2;
		text-align: center;
		position: absolute;
		color: #bfbfbf;
	}
	hr {
		width: 64px;
		height: 6px;
		opacity: 1;
		border-radius: 1px;
		background: linear-gradient(
				0deg,
				rgba(32, 180, 147, 1),
				rgba(32, 180, 147, 1)
			),
			linear-gradient(0deg, rgba(57, 205, 65, 1), rgba(57, 205, 65, 1)),
			#16baaa;
		margin: 0 auto;
	}
}
.yuyuePage {
	background-color: #f9fafc;
	ul {
		.d-grid;
		.grid4;
		gap: var(--p40);
		.item {
			border-radius: 10px;
			background: #ffffff;

			border: 1px solid #b1b1b1;
			padding: var(--p30) var(--p10);
			.d-flex;
			flex-direction: column;
			.al-c;
			.jc-c;
			gap: var(--p20);
			.img {
				width: 80px;
			}
			.name {
				text-align: center;
				font-size: var(--ft20);
			}
			.sub {
				text-align: center;
			}
			.desc {
				color: #999;
			}
			.layui-btn {
				border: 1px solid var(--ftc);
				background: #fff;
				color: var(--ftc);
			}
		}
	}
	.btn {
		margin-top: var(--p60);
		.flex-center;
		.layui-btn {
			--btn: 50px;
			width: 270px;
		}
	}
}
.yewuePage {
	ul {
		.d-grid;
		gap: var(--p100);
		li {
			.d-flex;
			.al-c;
			gap: var(--p50);
			.img_box {
				max-width: 50%;
				flex-shrink: 0;
			}
			.Text {
				.d-flex;
				.flex-column;
				.al-fs;
				position: relative;
				padding-top: var(--p40);
				> * {
					position: relative;
					z-index: 2;
				}
				h1 {
					color: var(--ftc);
					font-size: var(--ft48);
				}
				h2 {
					margin-top: var(--p10);
					font-size: var(--ft36);
				}
				.content {
					line-height: 1.7em;
					font-size: var(--ft24);
					margin-top: var(--p40);
				}
				.layui-btn {
					margin-top: var(--p40);
				}
				&::before {
					display: block;
					content: '';
					position: absolute;
					z-index: 0;
					width: 155px;
					height: 108px;
					background: url(../images/yinhao.png) no-repeat;
					right: 0;
					top: -10px;
				}
			}
			&:nth-child(even) {
				flex-direction: row-reverse;
			}
		}
	}
}
.userPage {
    display: grid;
    grid-template-columns: 220px 1fr;
    gap: 10px;

    .userNav {
        .user {
            .flex-column-center;
            font-size: var(--ft18);
            gap: 10px;
            padding: var(--p20) 0;

            .user_img {
                width: 50px;
            }
        }

        .user {
            background: #fff;
        }

        nav {
            box-shadow: 0 5px 12px rgba(32, 180, 147, 0.1);
            background: #fff;
            display: grid;
            gap: 10px;

            .item {
                .d-flex;
                .al-c;
                gap: var(--p10);
                padding: var(--p10) var(--p40);
                font-size: var(--ft14);
            }

            .top {
                color: var(--ftc);
                background: rgba(238, 242, 246, 1);
            }

            .active {
                color: #fff;
                background-color: var(--ftc);
            }

            .item:hover {
                /*color: #31bdec;  悬停时的颜色 */
                color: #fff;
                background-color: var(--ftc);
            }
        }
    }
}
.mainAboutPage {
    display: flex;
    gap: 30px; /* 两栏间距 */
    padding: 20px;
    max-width: 1400px;
    margin: 0 auto;

    .ab_l {
        flex: 0 0 210px; /* 固定左侧宽度 */
        background: #f8f9fa;
        border-radius: 8px;

        .s_name {
            height: 50px;
            line-height: 50px;
            background: var(--ftc);
            position: relative;
            text-indent: 12px;
            font-size: 18px;
            color: #fff;
            width: 100%;
        }

        .s_nav {
            background: #f0f0f0;
            margin-bottom: 20px;
            width: 100%;
            font-size: 16px;

            li {
                margin: 0px 15px;
                /* width: 100%;  */
                height: 45px;
                line-height: 45px;
                border-bottom: 1px solid #ddd;
            }
        }

        .active, .item1:hover {
            color: var(--ftc);
        }
    }

    .ab_r {
        flex: 1; /* 右侧自适应 */
        min-width: 0; /* 防止内容溢出 */
        .r_name {
            width: 100%;
            height: 40px;
            border-bottom: 1px solid #ddd;
            position: relative;

            span {
                display: inline-block;
                zoom: 1;
                height: 40px;
                line-height: 40px;
                font-size: 18px;
                color: var(--ftc);
                border-bottom: 1px solid var(--ftc);
            }
        }

        .about {
            width: 100%;
            padding: 30px 0;
            font-size: 16px;
            color: #555555;
            line-height: 255%;
            text-align: left;

            p {
                text-indent: 2em; /* 或 14px、30px等单位 */
            }

            .ftc {
                color: var(--ftc);
            }
        }
    }

   
}

    .userContent {
        --btn: 32px;
        --input: 32px;
        background: #fff;
        box-shadow: 0 5px 12px rgba(32, 180, 147, 0.1);
        padding: var(--p40);

        .layui-btn {
            border-radius: 0;
        }

        .search {
            display: flex;
            align-items: center;
            gap: var(--p20);

            .layui-input {
                width: 300px;
                max-width: 100%;
            }
        }

        table {
            margin-top: var(--p20);
        }

        .submitForm {
            margin-top: var(--p60);
            width: 300px;
            max-width: 100%;
            .d-grid;
            gap: var(--p10);

            .layui-btn {
                margin-top: var(--p30);
            }
        }
    }

    @media only screen and (max-width: 1400px) {
 
    }
    @media  (min-width: 1200px) {
        .hidxs {
            display: none !important;
        }
    }
@media (min-width: 992px) and (max-width: 1199px)
{
    .hidxs {
        display: none !important;
    }
}
/* 平板端适配 */
@media only screen and (max-width: 990px) {
    .layui-main.mainAboutPage {
        flex-direction: column;
        gap: 20px;
    }

    .ab_l {
        flex: none;
        width: 100%;
    }

    .s_nav {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 10px;
    }

    .s_nav li {
        margin: 0;
        /*text-align: center;*/
    }
}
/* 手机端适配 */
    @media only screen and (max-width: 768px) {
        .yewuePage ul li {
            flex-direction: column !important;
        }

        .yewuePage ul li .img_box {
            max-width: 100%;
        }

        .userPage {
            .grid1;
        }

        .yuyuePage ul,
        .productList,
        .AboutPage ul {
            .grid2;
        }

        footer {
            background-color: #191919;
            color: #fff;

            .footer1 {
                .d-grid;
                .grid-xs1;
            }
        }

        .grid-xs1 {
            grid-template-columns: repeat(1, 1fr);
        }

        .grid-xs2 {
            grid-template-columns: repeat(2, 1fr);
        }

        .grid-xs3 {
            grid-template-columns: repeat(3, 1fr);
        }

        .grid-xs4 {
            grid-template-columns: repeat(4, 1fr);
        }

        .grid-xs5 {
            grid-template-columns: repeat(5, 1fr);
        }

        .grid-xs6 {
            grid-template-columns: repeat(6, 1fr);
        }

        .grid-xs7 {
            grid-template-columns: repeat(7, 1fr);
        }

        .grid-xs8 {
            grid-template-columns: repeat(8, 1fr);
        }

        .grid-xs9 {
            grid-template-columns: repeat(9, 1fr);
        }

        .grid-xs10 {
            grid-template-columns: repeat(10, 1fr);
        }

        .flex-column-xs {
            flex-direction: column;
        }


        .layui-main.mainAboutPage {
            padding: 15px;
        }
        .mainAboutPage .ab_l, .mainAboutPage .ab_r {
            width: 100%;
        }
        .s_name {
            font-size: 20px;
            padding-bottom: 10px;
            width: 100%;
        }

        .s_nav {
            grid-template-columns: repeat(1, 1fr);           
        }

        .s_nav li {
            padding: 10px;
            font-size: 14px;           
        }
       
        .ab_r {
            font-size: 14px;
            line-height: 1.6;            
        }

        .hidlg {
            display: none !important;
        }
        .hidxs {
            display: block !important;
        }
    }

    @media only screen and (min-width: 751px) and (max-width: 1200px) {
       
    }

    @media only screen and (min-width: 751px) {
    }