@media screen and (min-width: 768px) {
	html {
		font-size: 625%;
	}
	.container {
		width: 7.6rem;
		margin: 0 auto;
	}
	/* reset */
    /* layout */
    .layout{
        padding: 0.5rem 0;
    }
    /* layout */
    /* footer */
    .foot-top{
        display: grid;
        grid-template-columns: repeat(3,1fr);
        gap: 0.3rem;
    }
    /* footer */   
    /* rel  */
    .rel-ul{
        grid-template-columns: repeat(2,1fr);
    }
    /* rel */
}
@media screen and (min-width: 1200px) {
	.container {
		width: 11.7rem;
	}
	/* reset */
    /* header */
    .navbar{
        display: flex;
        align-items: center;
    }
    .nav-menu{
        display: flex;
    }
    .nav-menu-child-child{
        display: none;
        width: 100%;
        background: #f6f6f6;
        box-shadow: 0 0.05rem 0.05rem rgba(0, 0, 0, .1);
    }
    .nav-menu-child-child > li{
        display: block;
    }
    .nav-menu-child-child > li:nth-child(n+2){
        border-top: 0.01rem solid rgba(0, 0, 0, .1);
    }
    .nav-menu-child-child > li > a{
        display: block;
        width: 100%;
        text-align: center;
        padding: 0.05rem 0;
    }
    .nav-menu-child-child > li > a:hover{
        background: #0068AB;
        color: #fff;
    }
    .nav-menu > li{
        position: relative;
        display: inline-block;
    }
    .nav-menu > li > a{
        font-size: 0.16rem;
        font-weight: 500;
        display: block;
        padding: 0.15rem;
    }
    .nav-menu-child > li{
        position: relative;
    }
    .nav-menu-child > li:nth-child(n+2){
        border-top: 0.01rem solid rgba(0, 0, 0, .1);
    }
    .nav-menu-child > li:hover .nav-menu-child-child{
        display: block;
        position: absolute;
        z-index: 111;
        left: 100%;
        top: 0;
    }
    .nav-menu-child > li > a{
        display: block;
        text-align: center;
        padding: 0.1rem 0.05rem;
    }
    .nav-menu-child > li > a:hover{
        background: #0068AB;
        color: #fff;
    }
    .nav-menu > li:hover .nav-menu-child{
        display: block;
        position: absolute;
        z-index: 999;
        width: 200%;
        left: 0;
        background: #f6f6f6;
        box-shadow: 0 0.05rem 0.05rem rgba(0, 0, 0, .1);
    }
    /* header */
    /* layout */
    .page{
        display: flex;
        justify-content: space-between;
        flex-wrap: nowrap;
    }
    .content{
        box-sizing: border-box;
        width: 70%;
    }
    .sidebar{
        box-sizing: border-box;
        width: 27%;
    }
    /* layout */

}
@media screen and (min-width: 1400px){
	html {
		font-size: 625%;
	}
	.container {
		width: 13.7rem;
		margin: 0 auto;
	}
	/* reset */

}