/*配置body的样式*/
body {
    margin: 0;
    padding: 0;
    /*max-width: 1600px;*/
    min-width: 1000px;
    background: #f7f8f3;
}

/*****************************************公共样式**************************************************************/
/*配置弹性布局公共样式*/
/*上下分布*/
.top_bottom {
    display: flex;
    flex-direction: column;
}

/*左右分布*/
.left_right {
    display: flex;
    flex-wrap: wrap;
}

/*均匀填充*/
.center_uniform {
    align-items: center;
    justify-content: space-around;
}

/*模块标题*/
.module_title {
    width: 100%;
    height: 60px;
    text-align: center;
    line-height: 50px;
    font-weight: bold;
    font-size: 25px;
    margin-top: 10px;
}

/***********************************************头部**********************************************************/
/*头部外框*/
.header {
    width: 100%;
    height: 60px;
    background: #ffffff;
}

/*logo和标题外框*/
.title {
    width: 70%;
    height: 30px;
}

/*标题*/
.title > span {
    display: inline-block;
    line-height: 25px;
    padding-left: 10px;
    color: #1d749d;
    font-weight: bold;
}

/*logo*/
.logo {
    height: 100%;
}

/***************************************************主页面，包含多个模块******************************************/
/*主页面外框*/
.main {
    width: 100%;
    height: auto;
    align-items: center;
}

/***************************************************模块1*****************************************************/
.module_one {
    width: 100%;
    height: 140px;
    background: #404040;
}

/*模块1左侧*/
.one_left {
    width: auto;
    height: 100%;
}

/*模块1标题外框*/
.one_title_box {
    width: 100%;
}

/*模块1左侧和右侧的线*/
.one_line {
    width: 25%;
    height: 0;
    border: 1px solid #b3b3b3;
}

/*模块1标题*/
.one_title {
    font-size: 20px;
    font-weight: bold;
    color: #c77d2f;
    letter-spacing: .2em;
}

/*模块1副标题*/
.module_one_sub_title {
    font-size: 16px;
    color: #c77d2f;
    margin-bottom: 20px;
}

/*模块1登录*/
.login {
    width: 200px;
    height: 80%;
    background: #ffffff;
    border-radius: 10px;
}

/*登录模块标题外框*/
.login_title_box {
    width: 70%;
}

/*登录模块logo*/
.login_title_logo {
    width: 30px;
    height: 30px;
    padding: 2px;
    box-shadow: 0 0 10px #ccc;
    border-radius: 15px;
}

/*登录模块logo图片*/
.login_title_logo > img {
    width: 100%;
    height: 100%;
}

/*点击登录文字*/
.click_login {
    font-size: 14px;
    font-weight: bold;
    color: #747476;
}

/*登录按钮*/
.login_btn {
    display: block;
    margin-top: 20px;
    width: 160px;
    height: 30px;
    border: 0;
    background: #f8bc6c;
    color: #fcf02f;
    font-size: 14px;
    font-weight: bold;
    line-height: 20px;
    border-radius: 10px;
}

/*登录提示*/
.login_tip {
    font-size: 12px;
    font-weight: bold;
    color: #747476;
    margin-bottom: 10px;
}

/*******************************************************模块2*********************************************/
.module_two {
    width: 80%;
    margin: 0 auto;
}

/*模块2表格外框*/
.table_box {
    width: 100%;
    height: auto;
}

/*模块2表格*/
.table_box > table {
    width: 100%;
    text-align: center;
    line-height: 40px;
    border-collapse: collapse;
}

/*模块2表格的单元格*/
.table_box > table th, .table_box > table td {
    border: 3px solid rgba(0, 0, 0, .1);
    width: 33%;
    background: #ffffff;
}

/*模块2表格头部*/
.table_box > table tr th {
    text-align: center;
    color: #dc9e4a;
}

/*模块2表格内容单元格*/
.table_box > table td {
    position: relative;
    border: 3px solid rgba(0, 0, 0, .1);
    width: 33%;
    background: #ffffff;
}

/*模块2表格鼠标放上加边框*/
.table_box > table td:hover::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    border: 2px solid #62635e;
}

/****************************************************模块3*************************************************/
/*模块3外框*/
.module_three {
    width: 100%;
    height: auto;
    background: #ffffff;
}

/*课程列表*/
.course_list {
    width: 80%;
    height: auto;
    margin: 0 auto;
}

/*课程条目*/
.course_item {
    width: 27%;
    height: 150px;
    margin: 10px;
    box-sizing: border-box;
}

/*鼠标放到课程条目上*/
.course_item:hover {
    border: 1px solid #000;
}

/*课程图片*/
.course_item > img {
    width: 210px;
    height: 100px;
    border-radius: 10px;
}

/*课程价格外框*/
.price_box {
    width: 70%;
    height: auto;
}

/*会员价格*/
.member {
    color: #c80000;
    font-size: 14px;
    font-weight: bold;
}

/*普通价格*/
.price {
    text-decoration: line-through;
}

/*****************************************************模块4********************************************/
/*模块4外框*/
.module_four {
    width: 80%;
    margin: 0 auto;
}

/*兼职列表*/
.part-time_job_list {
    width: 100%;
    height: auto;
    margin: 10px auto;
}

/*兼职条目*/
.part-time_job_item {
    width: 27%;
    height: 150px;
    box-sizing: border-box;
}

/*鼠标放到兼职条目上*/
.part-time_job_item:hover {
    border: 1px solid #000;
}

/*兼职图片*/
.part-time_job_item > img {
    width: 210px;
    height: 100px;
    border-radius: 10px;
}

/*****************************************************模块5**********************************************/
/*模块5外框*/
.module_five {
    width: 80%;
    height: auto;
    margin: 0 auto;
}

/*购买方法*/
.pay_methods {
    width: 50%;
    height: 60px;
    margin: 0 auto;
}

/*购买按钮外框公共样式*/
.pay_one, .pay_two {
    width: auto;
    height: 100%;
    font-weight: bold;
}

/*购买按钮公共样式*/
.pay_one_btn, .pay_two_btn {
    background: #fea036;
    height: 40px;
    margin: 0 10px;
    border: 0;
    border-radius: 7px;
    box-shadow: 0 5px 5px #aaa;
    color: #fff;
    text-decoration: none;
}

/*购买按钮1*/
.pay_one_btn {
    font-size: 20px;
    padding: 0 10px;
}

/*购买按钮1内部竖线*/
.pay_one_btn_line {
    font-size: 12px;
    margin: 0 7px;
}

/*购买按钮1内部竖线*/
.pay_one_btn_line > span {
    margin: 2px auto;
}

/*购买按钮2*/
.pay_two_btn {
    font-size: 12px;
    font-weight: bold;
    padding: 0 10px;
}

/*购买按钮2内部图片*/
.pay_two_btn img {
    width: 20px;
    height: 20px;
    margin: 0 5px;
}

/*购买提示*/
.pay_tip {
    font-size: 13px;
    margin: 10px auto;
}

/*********************************************************模块6******************************************/
/*模块6外框*/
.module_six {
    width: 100%;
    height: auto;
    background: #fff;
}

/*问题列表*/
.question_list {
    width: 80%;
    height: auto;
}

/*问题条目*/
.question_item {
    width: 45%;
    align-items: flex-start;
}

/*问题条目数据*/
.question_item > span {
    margin: 5px 0;
}

/*问题*/
.question {
    font-size: 14px;
    font-weight: bold;
}

/*答案*/
.answer {
    font-size: 14px;
    color: #303030;
}

/*********************************************************底部************************************************/
/*底部外框*/
.footer {
    width: 100%;
    height: 80px;
}

/***************************************************底部模块1******************************************************/
/*底部模块11外框*/
.footer_one {
    width: 100%;
    height: 80px;
    background: #333333;
    position: fixed;
    bottom: 0;
    left: 0;
}

.footer_one span {
    line-height: 75px;
}

/*底部第1个模块标题外框*/
.footer_one_title_box {
    width: 80%;
    font-weight: bold;
    color: #d98b33;
    margin: 0 auto;
}

/*底部第1个模块标题*/
.footer_one_title {
    font-size: 30px;
    margin-right: 20px;
}

/*底部第1个模块副标题*/
.footer_one_sub_title {
    font-size: 20px;
}

/*底部丝带*/
.footer_silk_ribbon {
    width: 150px;
    height: 95px;
    position: absolute;
    top: -15px;
    right: 60px;
    background: #fb9e36;
    border-top-right-radius: 40px;
    line-height: 90px;
    text-align: center;
    font-size: 25px;
    font-weight: bold;
    color: #fff137;
}

/*底部丝带左侧小三角*/
.footer_silk_ribbon:after {
    content: "";
    width: 0;
    height: 0;
    border: 11px solid transparent;
    border-left: 11px solid #fb9e36;
    position: absolute;
    left: -10px;
    top: 4.5px;
    transform: rotate(45deg);
}