/*------------------------------------------------------------------
 * 模块：index.css
 * 作者：Irene
 * 时间：2021-10-12 11:35
 * 修改：北冥 2021-10-15 20:12
 *----------------------------------------------------------------*/
/* ---------
 * ---Nav---
 * -------*/
.nav
{
    grid-template-columns: 1fr 3fr;
    justify-items: stretch;
    width:100%;
    height:5.5rem;
    background-color:var(--osky-white);
    background-color:rgb(255 255 255 / 98%);
    box-shadow: 0 8px 18px 8px rgb(30 32 34 / 12%);
    -webkit-box-shadow: 0 8px 18px -8px rgb(30 32 34 / 12%);
    padding:0rem 2rem;
}

/*NavLeft*/
.nav_left
{
    height:5.5rem;
}

.nav_left_logo
{
    width:10rem;
    height:5.5rem;
}

/*NavRight*/
.nav_right
{
    justify-content: flex-end;
    height:5.5rem;
    width:100%;
}

.nav_right a.btn
{
    height:5.5rem;
    color:var(--osky-primary);
    padding:0rem 2rem 0rem 0.25rem;
}

/* ----------
 * ---Main---
 * --------*/
.main
{
    height:calc( 100vh - 5.5rem );
}

/*MainBox*/
.main_box
{
    flex-direction: column;
    justify-content: flex-start;
    width:100%;
    height:100%;
}

.main_content
{
    width:40%;
}

.main_content h2.title
{
    font-weight:normal;
    padding:4rem 0rem 1rem 0rem;
}


.main_content div.form_box
{
    width:100%;
}

.main_content_form
{
    flex-direction: column;
    justify-content: start;
    align-items: start;
}

.main_content_form label.input_label
{
    font-size:1.125rem;
}

.main_content_form input.input_style
{
    width:100%;
    margin:0.5rem 0rem 2rem 0rem;
}

.main_content_form div label.label_text
{
    margin-left:0.5rem;
}

.main_content_form div label.label_text a.link
{
    font-size:1rem;
    text-decoration:underline;
    color:var(--osky-blue);
    padding:0rem 0.25rem;
}

.main_content_form input.input_submit
{
    width:100%;
    margin-top:1.5rem;
    margin-bottom:0.75rem;
}

/*FooterNotes*/
.footer_notes
{
    background-color:transparent;
}

.footer_notes h6
{
    color:var(--osky-grey);
}

.footer_notes h6 a
{
    color:var(--osky-grey);
}

/*==================================*/
/* ----------------------------------
/* ---超小型设备（电话，600px 及以下）---
 * --------------------------------*/
/*==================================*/
@media only screen and (max-width: 600px)
{
    /* ---------
     * ---Nav---
     * -------*/
    .nav
    {
        grid-template-columns: 1fr;
        justify-items: center;
        height:11rem;
    }
    
    /*NavRight*/
    .nav_right
    {
        justify-content: center;
        border-top:1px solid var(--osky-light);
    }
    
    .nav_right a.btn
    {
        padding-right:0rem;
    }
    
    /* ----------
     * ---Main---
     * --------*/
    .main
    {
        height:calc( 100vh - 11rem );
    }
    
    .main_content
    {
        width:90%;
    }
    
}

/*===============================================*/
/* -----------------------------------------------
/* ---小型设备（纵向平板电脑和大型手机，600 像素及以上）---
 * ----------------------------------------------*/
/*===============================================*/
@media only screen and (min-width: 600px)
{
    /* ---------
     * ---Nav---
     * -------*/
    .nav
    {
        grid-template-columns: 1fr;
        justify-items: center;
        height:11rem;
    }
    
    /*NavRight*/
    .nav_right
    {
        justify-content: center;
        border-top:1px solid var(--osky-light);
    }
    
    .nav_right a.btn
    {
        padding-right:0rem;
    }
    
    /* ----------
     * ---Main---
     * --------*/
    .main
    {
        height:calc( 100vh - 11rem );
    }
    
    .main_content
    {
        width:90%;
    }
    
}

/*========================================*/
/* ----------------------------------------
/* ---中型设备（横向平板电脑，720 像素及以上）----
 * ---------------------------------------*/
/*========================================*/
@media only screen and (min-width: 720px)
{
    /* ---------
     * ---Nav---
     * -------*/
    .nav
    {
        grid-template-columns: 1fr 3fr;
        justify-items: stretch;
        height:5.5rem;
    }
    
    /*NavRight*/
    .nav_right
    {
        justify-content: flex-end;
        border-top:none;
    }
    
    .nav_right a.btn
    {
        padding-right:2rem;
    }
    
    /* ----------
     * ---Main---
     * --------*/
    .main
    {
        height:calc( 100vh - 5.5rem );
    }
    
    .main_content
    {
        width:60%;
    }
}

/*============================================*/
/* --------------------------------------------
/* ---大型设备（笔记本电脑/台式机，990px 及以上）----
 * ------------------------------------------*/
/*============================================*/
@media only screen and (min-width: 990px)
{
    /* ---------
     * ---Nav---
     * -------*/
    .nav
    {
        grid-template-columns: 1fr 3fr;
        justify-items: stretch;
        height:5.5rem;
    }
    
    /*NavRight*/
    .nav_right
    {
        justify-content: flex-end;
        border-top:none;
    }
    
    .nav_right a.btn
    {
        padding-right:2rem;
    }
    
    /* ----------
     * ---Main---
     * --------*/
    .main
    {
        height:calc( 100vh - 5.5rem );
    }
    
    .main_content
    {
        width:40%;
    }
    
}

