* {
    font-family: '고딕', sans-serif;
    margin: 0;
    padding: 0;
    color: #353535;
}

a {
    text-decoration: none;
}

html,
body {
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 0;
}


html {
    width: 100%;
    height: 100%;
}

ul,
ol,
li {
    list-style: none;
}


#wrap {
    width: 710px;
    height: 533px;
}

#wrap > #ot {
    width: 710px;
    height: 533px;
}

#wrap > #ot > #content_box {
    width: 710px;
    height: 533px;
}


#wrap > #ot > #content_box > ul > .visible {
    display: block;
}




/* 1 page (인트로) */


#wrap > #ot > #content_box > .content1 {
    width: 710px;
    height: 533px;
    position: absolute;
    left: 0;
    top: 0;
    background-image: url("../img/intro_bg.png");
    background-repeat: no-repeat;
}


#wrap > #ot > #content_box > .content1 > #year {
    width: 180px;
    height: 40px;
    font-size: 22px;
    font-weight: bold;
    background-color: darkgreen;
    text-align: center;
    color: #fff;
    border-radius: 25px;
    line-height: 36px;
    margin-top: 20px;
    margin-left: 20px;
}

#wrap > #ot > #content_box > .content1 > #right {
    position: absolute;
    right: 30px;
    width: 360px;
    margin-top: 20px;
}

#wrap > #ot > #content_box > .content1 > #right > #logo {
    margin-bottom: 20px;
}

#wrap > #ot > #content_box > .content1 > #right > #intro_txt {
    text-align: right;
    font-size: 20px;
    font-weight: bold;
    line-height: 30px;
}

#wrap > #ot > #content_box > .content1 > #right > #intro_txt > span {
    color: darkorange;
    font-size: 22px;
    line-height: 85px;
}

#wrap > #ot > #content_box > .content1 > #right > #start_btn {
    width: 150px;
    height: 45px;
    border: 3px solid #fff;
    /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#b4e391+0,61c419+50,b4e391+100;Green+3D */
    background: #b4e391;
    /* Old browsers */
    background: -moz-linear-gradient(top, #b4e391 0%, #61c419 50%, #b4e391 100%);
    /* FF3.6-15 */
    background: -webkit-linear-gradient(top, #b4e391 0%, #61c419 50%, #b4e391 100%);
    /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom, #b4e391 0%, #61c419 50%, #b4e391 100%);
    /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#b4e391', endColorstr='#b4e391', GradientType=0);
    /* IE6-9 */

    font-size: 28px;
    font-weight: bold;
    text-align: center;
    line-height: 42px;
    box-shadow: 1px 1px 5px 2px #a1a1a1;
    border-radius: 25px;
    position: absolute;
    right: 0;
    margin-top: 20px;
    cursor: pointer;
}

/* 1 page end */





/* 2 page (시작) */

#wrap > #ot > #content_box > ul > .content2 {
    width: 710px;
    height: 533px;
    position: absolute;
    left: 0;
    top: 0;
    background-image: url("../img/bg01.png");
    background-repeat: no-repeat;
}

#wrap > #ot > #content_box > ul > .content2 > #txt {
    position: absolute;
    z-index: 999;
    font-size: 22px;
    font-weight: bold;
    line-height: 38px;
    width: 410px;
    height: 180px;
    left: 50%;
    margin-left: -205px;
    top: 50%;
    margin-top: -120px;
    color: #009b4d;
}

#wrap > #ot > #content_box > ul > .content2 > #txt > span {
    color: #0060b9;
}


#wrap > #ot > #content_box > ul > .content2 > #sub_logo {
    position: absolute;
    z-index: 999;
    width: 210px;
    height: 45px;
    left: 50%;
    margin-left: -105px;
    top: 330px;
}

#wrap > #ot > #content_box > ul > .content2 > #txt_bg {
    position: absolute;
    left: 50%;
    margin-left: -292px;
    top: 50%;
    margin-top: -224px;
}


/* 2 page end */




/* 3 page (교육부 인가 안내) */

#wrap > #ot > #content_box > ul > .content3 {
    width: 710px;
    height: 533px;
    position: absolute;
    left: 0;
    top: 0;
    background-image: url("../img/bg02.png");
    background-repeat: no-repeat;
}


#wrap > #ot > #content_box > ul > .content3 > #cont3_bg {
    background-color: #f2de90;
    width: 580px;
    height: 260px;
    border-radius: 10px;
    border: 3px solid #fff;
    position: absolute;
    top: 50%;
    margin-top: -160px;
    left: 50%;
    margin-left: -290px;


}

#wrap > #ot > #content_box > ul > .content3 > #cont3_bg > #cont3_logo {
    width: 350px;
    height: 75px;
    margin: 0 auto;
    margin-top: 30px;
    margin-bottom: 22px;
}


#wrap > #ot > #content_box > ul > .content3 > #cont3_bg > #cont3_txt {
    font-size: 18px;
    font-weight: bold;
    line-height: 32px;
    width: 360px;
    margin: 0 auto;
}



#wrap > #ot > #content_box > ul > .content3 > #cont3_bg > #cont3_txt > span {
    font-size: 20px;
}


/* 3 page end */





/* 4 page (모임 안내) */

#wrap > #ot > #content_box > ul > .content4 {
    width: 710px;
    height: 533px;
    position: absolute;
    left: 0;
    top: 0;
    background-image: url("../img/bg02.png");
    background-repeat: no-repeat;
}



#wrap > #ot > #content_box > ul > .content4 > #cont4_img {
    width: 580px;
    height: 390px;
    margin: 0 auto;
    margin-top: 25px;
}

#wrap > #ot > #content_box > ul > .content4 > #cont4_txt {
    width: 580px;
    text-align: center;
    margin: 0 auto;
    font-size: 20px;
    font-weight: bold;
}



/* 4 page end */




/* 5 page (다음 내용 유의) */


#wrap > #ot > #content_box > ul > .content5 {
    width: 710px;
    height: 533px;
    position: absolute;
    left: 0;
    top: 0;
    background-image: url("../img/bg02.png");
    background-repeat: no-repeat;
}


#wrap > #ot > #content_box > ul > .content5 > #cont5_bg {
    width: 560px;
    height: 240px;
    background-color: #f2de90;
    border-radius: 10px;
    border: 3px solid #fff;
    position: absolute;
    top: 50%;
    margin-top: -160px;
    left: 50%;
    margin-left: -280px;
    font-size: 23px;
    font-weight: bold;
    line-height: 40px;
    text-align: left;
    box-shadow: 1px 1px 5px 2px #a1a1a1;

}


#wrap > #ot > #content_box > ul > .content5 > #cont5_bg > #cont5_txt {
    padding-top: 50px;
    padding-left: 90px;
}


/* 5 page end */




/* 6 page (학기구분 안내)*/


#wrap > #ot > #content_box > ul > .content6 {
    width: 710px;
    height: 533px;
    position: absolute;
    left: 0;
    top: 0;
    background-image: url("../img/bg03.png");
    background-repeat: no-repeat;
}


#wrap > #ot > #content_box > ul > .content6 > .cont6 {
    width: 580px;
    margin: 0 auto;
}


#wrap > #ot > #content_box > ul > .content6 > .cont6 > #table {
    margin-bottom: 10px;
}

#wrap > #ot > #content_box > ul > .content6 > .cont6 > #table > table {
    border-collapse: collapse;
    border: 1px solid #ccc;
    width: 580px;
    font-size: 18px;
}


#wrap > #ot > #content_box > ul > .content6 > .cont6 > #table > table th,
td {
    border: 1px solid #ccc;
    padding: 15px
}

#wrap > #ot > #content_box > ul > .content6 > .cont6 > #table > table td {
    padding: 25px 15px;
}

#wrap > #ot > #content_box > ul > .content6 > .cont6 > #table > table th {
    background-color: #6775d7;
    font-size: 20px;
    text-align: center;
    color: #fff;
}

#wrap > #ot > #content_box > ul > .content6 > .cont6 > #table > table .bg {
    background-color: #ffa02f;
    font-weight: bold;
    color: #fff;
}

#wrap > #ot > #content_box > ul > .content6 > .cont6 > #table > table .table_txt {
    color: #00552e;
    font-weight: bold;
    line-height: 30px;
    background-color: #fff;
}

#wrap > #ot > #content_box > ul > .content6 > .cont6 > #table > table .table_txt > span {
    color: #1775e9;
    padding-bottom: 2px;
    border-bottom: 1px solid;
}


#wrap > #ot > #content_box > ul > .content6 > .cont6 > #cont6_txt {
    width: 580px;
    text-align: center;
}

#wrap > #ot > #content_box > ul > .content6 > .cont6 > #cont6_txt > span {
    color: #ea533a;
    font-weight: bold;
    padding-bottom: 2px;
    border-bottom: 1px solid;
}



/* 6 page end */





/* 7 page (수업안내) */

#wrap > #ot > #content_box > ul > .content7 {
    width: 710px;
    height: 533px;
    position: absolute;
    left: 0;
    top: 0;
    background-image: url("../img/bg03.png");
    background-repeat: no-repeat;
}

#wrap > #ot > #content_box > ul > .content7 > .cont7 {
    width: 600px;
    margin: 0 auto;
}


#wrap > #ot > #content_box > ul > .content7 > .cont7 > #cont7_top {
    width: 588px;
    /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#fcfcfc+1,e0e0e0+100 */
    background: #fcfcfc;
    /* Old browsers */
    background: -moz-linear-gradient(top, #fcfcfc 1%, #e0e0e0 100%);
    /* FF3.6-15 */
    background: -webkit-linear-gradient(top, #fcfcfc 1%, #e0e0e0 100%);
    /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom, #fcfcfc 1%, #e0e0e0 100%);
    /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fcfcfc', endColorstr='#e0e0e0', GradientType=0);
    /* IE6-9 */
    padding: 6px;
    border-radius: 10px;
    border: 1px solid #c6c6c6;
    font-size: 15px;
    font-weight: bold;
    line-height: 23px;
}

#wrap > #ot > #content_box > ul > .content7 > .cont7 > #cont7_top > ul > li {
    margin-bottom: 5px;
    padding-left: 25px;
}

#wrap > #ot > #content_box > ul > .content7 > .cont7 > #cont7_top > ul > li > span {
    color: #1775e9;
}

#wrap > #ot > #content_box > ul > .content7 > .cont7 > #cont7_top > ul > li:last-child {
    margin-bottom: 0px;
}

#wrap > #ot > #content_box > ul > .content7 > .cont7 > #cont7_top > ul > li:last-child > span {
    color: #ea533a;
}

#wrap > #ot > #content_box > ul > .content7 > .cont7 > #cont7_middle {
    width: 600px;
    margin: 0 auto;
    margin-top: 12px;
}

#wrap > #ot > #content_box > ul > .content7 > .cont7 > #cont7_middle > #total {
    text-align: center;
    font-size: 20px;
    font-weight: bold;
    padding-bottom: 6px;
    border-bottom: 2px solid #ccc;
    margin-bottom: 10px;
}

#wrap > #ot > #content_box > ul > .content7 > .cont7 > #cont7_middle > #test {
    width: 580px;
    text-align: center;
    padding: 8px 10px;
    background-color: #d4ebdc;
    font-weight: bold;
    font-size: 16px;
    color: #1775e9;
}

#wrap > #ot > #content_box > ul > .content7 > .cont7 > #cont7_middle > #test > span {
    color: #008c59;
}

#wrap > #ot > #content_box > ul > .content7 > .cont7 > #cont7_bottom {
    width: 600px;
    height: 165px;
    margin: 0 auto;
    margin-top: 15px;
    background-color: #f1d895;
    border-radius: 15px;
}

#wrap > #ot > #content_box > ul > .content7 > .cont7 > #cont7_bottom > #cont7_li {
    padding: 10px;
    font-size: 15px;
    font-weight: bold;
    line-height: 23px;
}

#wrap > #ot > #content_box > ul > .content7 > .cont7 > #cont7_bottom > #cont7_li > ul {
    margin-top: 5px;
}

#wrap > #ot > #content_box > ul > .content7 > .cont7 > #cont7_bottom > #cont7_li > ul > li {
    color: #008c59;
    padding-left: 10px;
}

#wrap > #ot > #content_box > ul > .content7 > .cont7 > #cont7_bottom > #cont7_li .li_point {
    color: indianred;
    padding-right: 5px;
}

#wrap > #ot > #content_box > ul > .content7 > .cont7 > #cont7_bottom > #cont7_li .li_underline {
    font-size: 14px;
    color: #1775e9;
    padding-bottom: 3px;
    border-bottom: 1px solid;
}

#wrap > #ot > #content_box > ul > .content7 > .cont7 > #cont7_bottom > #cont7_point {

    width: 450px;
    margin: 0 auto;
    text-align: center;
    font-size: 20px;
    font-weight: bold;
    color: #ea533a;

}

/* 7 page end */


/* 8 page (수업안내2)  */


#wrap > #ot > #content_box > ul > .content8 {
    width: 710px;
    height: 533px;
    position: absolute;
    left: 0;
    top: 0;
    background-image: url("../img/bg03.png");
    background-repeat: no-repeat;
}

#wrap > #ot > #content_box > ul > .content8 > .cont8 {
    width: 600px;
    margin: 0 auto;
}


#wrap > #ot > #content_box > ul > .content8 > .cont8 > #cont8_top {
    width: 588px;
    /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#fcfcfc+1,e0e0e0+100 */
    background: #fcfcfc;
    /* Old browsers */
    background: -moz-linear-gradient(top, #fcfcfc 1%, #e0e0e0 100%);
    /* FF3.6-15 */
    background: -webkit-linear-gradient(top, #fcfcfc 1%, #e0e0e0 100%);
    /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom, #fcfcfc 1%, #e0e0e0 100%);
    /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fcfcfc', endColorstr='#e0e0e0', GradientType=0);
    /* IE6-9 */
    padding: 6px;
    border-radius: 10px;
    border: 1px solid #c6c6c6;
    font-size: 15px;
    font-weight: bold;
    line-height: 23px;
}

#wrap > #ot > #content_box > ul > .content8 > .cont8 > #cont8_top > ul > li {
    margin-bottom: 5px;
    padding-left: 25px;
}

#wrap > #ot > #content_box > ul > .content8 > .cont8 > #cont8_top > ul > li > span {
    color: #1775e9;
}

#wrap > #ot > #content_box > ul > .content8 > .cont8 > #cont8_top > ul > li:last-child {
    margin-bottom: 0px;
}

#wrap > #ot > #content_box > ul > .content8 > .cont8 > #cont8_top > ul > li:last-child > span {
    color: #ea533a;
}



#wrap > #ot > #content_box > ul > .content8 > .cont8 > #cont8_bottom {
    width: 600px;
    height: 270px;
    margin: 0 auto;
    margin-top: 15px;
    background-color: #f1d895;
    border-radius: 15px;
}

#wrap > #ot > #content_box > ul > .content8 > .cont8 > #cont8_bottom > #cont8_li {
    padding: 10px;
    font-size: 15px;
    font-weight: bold;
    line-height: 24px;
    padding-bottom: 0px;
}

#wrap > #ot > #content_box > ul > .content8 > .cont8 > #cont8_bottom > #cont8_li > ul {
    margin-top: 5px;
}

#wrap > #ot > #content_box > ul > .content8 > .cont8 > #cont8_bottom > #cont8_li > ul > li {
    color: #008c59;
    padding-left: 10px;
    margin-bottom: 15px;
}

#wrap > #ot > #content_box > ul > .content8 > .cont8 > #cont8_bottom > #cont8_li > ul > li:first-child > .li_underline {
    margin-left: 72px;
}


#wrap > #ot > #content_box > ul > .content8 > .cont8 > #cont8_bottom > #cont8_li .li_point {
    color: indianred;
    padding-right: 5px;
}

#wrap > #ot > #content_box > ul > .content8 > .cont8 > #cont8_bottom > #cont8_li .li_underline {
    font-size: 14px;
    color: #1775e9;
    padding-bottom: 3px;
    border-bottom: 1px solid;
}

#wrap > #ot > #content_box > ul > .content8 > .cont8 > #cont8_bottom > #cont8_point {

    width: 500px;
    margin: 0 auto;
    font-size: 18px;
    font-weight: bold;
    color: #ea533a;
    line-height: 28px;

}

/* 8 page end  */




/* 9 page (출석안내)  */


#wrap > #ot > #content_box > ul > .content9 {
    width: 710px;
    height: 533px;
    position: absolute;
    left: 0;
    top: 0;
    background-image: url("../img/bg03.png");
    background-repeat: no-repeat;
}

#wrap > #ot > #content_box > ul > .content9 > .cont9 {
    width: 600px;
    margin: 0 auto;
}

#wrap > #ot > #content_box > ul > .content9 > .cont9 > .cont9_top {
    margin-bottom: 10px;
}

#wrap > #ot > #content_box > ul > .content9 > .cont9 > .cont9_top > table {
    border-collapse: collapse;
    border: 1px solid #ccc;
    margin: 0 auto;
    width: 420px;
    font-size: 18px;
    text-align: center;
    font-weight: bold;
    background-color: #d4ebdc;

}

#wrap > #ot > #content_box > ul > .content9 > .cont9 > .cont9_top > table td {
    padding: 6px;
}



#wrap > #ot > #content_box > ul > .content9 > .cont9 > .cont9_bottom > table {
    display: block;
    float: left;
    width: 196px;
    margin-right: 6px;
    font-size: 13px;
    font-weight: bold;
    border-collapse: collapse;
    line-height: 16px;
}

#wrap > #ot > #content_box > ul > .content9 > .cont9 > .cont9_bottom > .last_table {
    margin-right: 0px;
}


#wrap > #ot > #content_box > ul > .content9 > .cont9 > .cont9_bottom > table td,
th {
    width: 65px;
    border: 1px solid #ccc;
    padding: 2px;
    text-align: center;
}

#wrap > #ot > #content_box > ul > .content9 > .cont9 > .cont9_bottom > table > tr > td {
    background-color: #fff;
}

#wrap > #ot > #content_box > ul > .content9 > .cont9 > .cont9_bottom > table th,
.bg_color {
    background-color: #6775d7;
    color: #fff;
}

#wrap > #ot > #content_box > ul > .content9 > .cont9 > .cont9_bottom > table .test {
    background-color: darkorange;
    color: #fff;
    padding: 18px;
}






/* 10 page (출석안내2) */


#wrap > #ot > #content_box > ul > .content10 {
    width: 710px;
    height: 533px;
    position: absolute;
    left: 0;
    top: 0;
    background-image: url("../img/bg03.png");
    background-repeat: no-repeat;
}

#wrap > #ot > #content_box > ul > .content10 > .cont10 {
    width: 600px;
    margin: 0 auto;
}

#wrap > #ot > #content_box > ul > .content10 > .cont10 > .cont10_top {
    margin-bottom: 10px;
}

#wrap > #ot > #content_box > ul > .content10 > .cont10 > .cont10_top > table {
    border-collapse: collapse;
    border: 1px solid #ccc;
    margin: 0 auto;
    width: 420px;
    font-size: 18px;
    text-align: center;
    font-weight: bold;
    background-color: #d4ebdc;

}

#wrap > #ot > #content_box > ul > .content10 > .cont10 > .cont10_top > table td {
    padding: 6px;
}

#wrap > #ot > #content_box > ul > .content10 > .cont10 > .cont10_bottom {
    width: 600px;
    height: 310px;
    margin: 0 auto;
    margin-top: 15px;
    background-color: #f1d895;
    border-radius: 15px;
}

#wrap > #ot > #content_box > ul > .content10 > .cont10 > .cont10_bottom > #cont10_li {
    padding: 10px;
    font-size: 16px;
    font-weight: bold;
    line-height: 28px;
}

#wrap > #ot > #content_box > ul > .content10 > .cont10 > .cont10_bottom > #cont10_li > ul {
    margin-top: 5px;
}

#wrap > #ot > #content_box > ul > .content10 > .cont10 > .cont10_bottom > #cont10_li > ul > li {
    color: #008c59;
    padding-left: 40px;
}

#wrap > #ot > #content_box > ul > .content10 > .cont10 > .cont10_bottom > #cont10_li .li_point {
    color: indianred;
    padding-right: 5px;
}

#wrap > #ot > #content_box > ul > .content10 > .cont10 > .cont10_bottom > #cont10_li .li_underline {
    font-size: 16px;
    color: #1775e9;
    padding-bottom: 2px;
    border-bottom: 1px solid;
}

#wrap > #ot > #content_box > ul > .content10 > .cont10 > .cont10_bottom > #cont10_point {

    width: 450px;
    margin: 0 auto;
    text-align: center;
    font-size: 20px;
    font-weight: bold;
    color: #ea533a;

}

/* 10 page end */



/* 11 page (출석안내2) */


#wrap > #ot > #content_box > ul > .content11 {
    width: 710px;
    height: 533px;
    position: absolute;
    left: 0;
    top: 0;
    background-image: url("../img/bg03.png");
    background-repeat: no-repeat;
}

#wrap > #ot > #content_box > ul > .content11 > .cont11_img {
    width: 600px;
    margin: 0 auto;
}

/* 11 page end */



/* 12 page (시험출제 및 방식) */



#wrap > #ot > #content_box > ul > .content12 {
    width: 710px;
    height: 533px;
    position: absolute;
    left: 0;
    top: 0;
    background-image: url("../img/bg03.png");
    background-repeat: no-repeat;
}

#wrap > #ot > #content_box > ul > .content12 > .cont12 {
    width: 580px;
    height: 300px;
    position: absolute;
    top: 130px;
    left: 50%;
    margin-left: -290px;
}

#wrap > #ot > #content_box > ul > .content12 > .cont12 > #cont12_li {
    padding: 10px;
    padding-bottom: 25px;
    padding-top: 25px;
    font-size: 18px;
    font-weight: bold;
    line-height: 32px;
    background-color: #f1d895;
    border-radius: 15px;
}

#wrap > #ot > #content_box > ul > .content12 > .cont12 > #cont12_li > ul {
    margin-top: 15px;
}

#wrap > #ot > #content_box > ul > .content12 > .cont12 > #cont12_li > ul > li {
    color: #008c59;
    padding-left: 40px;
    margin-bottom: 15px;

}

#wrap > #ot > #content_box > ul > .content12 > .cont12 > #cont12_li > ul > li .li_point {
    color: indianred;
    padding-right: 5px;
}


#wrap > #ot > #content_box > ul > .content12 > .cont12 > #cont12_li > ul > li .li_underline {
    font-size: 18px;
    color: #1775e9;
    padding-bottom: 2px;
    border-bottom: 1px solid;
}

/* 12 page end */






/* 13 page (과제) */



#wrap > #ot > #content_box > ul > .content13 {
    width: 710px;
    height: 533px;
    position: absolute;
    left: 0;
    top: 0;
    background-image: url("../img/bg03.png");
    background-repeat: no-repeat;
}



#wrap > #ot > #content_box > ul > .content13 > .content13_top {
    width: 440px;
    padding: 15px 10px;
    margin: 0 auto;
    border-radius: 15px;
    line-height: 30px;
    font-size: 18px;
    text-align: left;
    font-weight: bold;
    background-color: #d4ebdc;
    margin-bottom: 20px;
    box-shadow: 1px 1px 5px 2px #a1a1a1;

}



#wrap > #ot > #content_box > ul > .content13 > .content13_top > div {
    padding-left: 18px;
}

#wrap > #ot > #content_box > ul > .content13 > .content13_top > div > ul > li {
    color: #1775e9;
}

#wrap > #ot > #content_box > ul > .content13 > .content13_top > div > ul > li:first-child {
    color: #353535;
}

#wrap > #ot > #content_box > ul > .content13 > .content13_top > div > ul > li:last-child {
    color: #008c59;

}


#wrap > #ot > #content_box > ul > .content13 > .cont13_bottom {
    width: 600px;
    height: 240px;
    margin: 0 auto;
    margin-top: 15px;
    background-color: #f1d895;
    border-radius: 15px;
}

#wrap > #ot > #content_box > ul > .content13 > .cont13_bottom > #cont13_li {
    padding: 10px;
    font-size: 16px;
    font-weight: bold;
    line-height: 28px;
}

#wrap > #ot > #content_box > ul > .content13 > .cont13_bottom > #cont13_li > ul {
    margin-top: 5px;
}

#wrap > #ot > #content_box > ul > .content13 > .cont13_bottom > #cont13_li > ul > li {
    color: #008c59;
    padding-left: 40px;
    line-height: 32px;
}

#wrap > #ot > #content_box > ul > .content13 > .cont13_bottom > #cont13_li .li_point {
    color: indianred;
    padding-right: 5px;
}

#wrap > #ot > #content_box > ul > .content13 > .cont13_bottom > #cont13_li .li_underline {
    font-size: 16px;
    color: #1775e9;
    padding-bottom: 2px;
    border-bottom: 1px solid;
}

#wrap > #ot > #content_box > ul > .content13 > .cont13_bottom > #cont13_point {

    width: 450px;
    margin: 0 auto;
    text-align: center;
    font-size: 20px;
    font-weight: bold;
    color: #ea533a;

}


/* 13 page end */



/* 14 page (토론) */



#wrap > #ot > #content_box > ul > .content14 {
    width: 710px;
    height: 533px;
    position: absolute;
    left: 0;
    top: 0;
    background-image: url("../img/bg03.png");
    background-repeat: no-repeat;
}



#wrap > #ot > #content_box > ul > .content14 > .cont14_bottom {
    width: 600px;
    height: 360px;
    background-color: #f1d895;
    border-radius: 15px;
    position: absolute;
    top: 100px;
    left: 50%;
    margin-left: -300px;
}

#wrap > #ot > #content_box > ul > .content14 > .cont14_bottom > #cont14_li {
    padding: 10px;
    font-size: 18px;
    font-weight: bold;
}

#wrap > #ot > #content_box > ul > .content14 > .cont14_bottom > #cont14_li > ul {
    margin-top: 12px;
}

#wrap > #ot > #content_box > ul > .content14 > .cont14_bottom > #cont14_li > ul > li {
    color: #1775e9;
    padding-left: 40px;
    line-height: 48px;
}

#wrap > #ot > #content_box > ul > .content14 > .cont14_bottom > #cont14_li .li_point {
    color: #00488d;
    font-size: 26px;
    padding-right: 10px;
}

#wrap > #ot > #content_box > ul > .content14 > .cont14_bottom > #cont14_li .li_underline {
    color: #008c59;

}

#wrap > #ot > #content_box > ul > .content14 > .cont14_bottom > #cont14_point {

    width: 500px;
    margin: 0 auto;
    line-height: 32px;
    text-align: left;
    font-size: 18px;
    font-weight: bold;
    color: #ea533a;

}


#wrap > #ot > #content_box > ul > .content14 > .cont14_bottom > #cont14_li_bottom {
    width: 510px;
    margin: 0 auto;
    text-align: center;
    margin-top: 20px;
    padding-top: 18px;
    border-top: 2px solid #fff;
    font-size: 16px;
    font-weight: bold;
    color: #1775e9;
}



#wrap > #ot > #content_box > ul > .content14 > .cont14_bottom > #cont14_li_bottom > .li_cate {
    color: indianred;
    padding-right: 5px;
}


/* 14 page end */






/* 15 page (쪽지시험) */


#wrap > #ot > #content_box > ul > .content15 {
    width: 710px;
    height: 533px;
    position: absolute;
    left: 0;
    top: 0;
    background-image: url("../img/bg03.png");
    background-repeat: no-repeat;
}


#wrap > #ot > #content_box > ul > .content15 > .cont15 {
    width: 580px;
    height: 240px;
    position: absolute;
    top: 130px;
    left: 50%;
    margin-left: -290px;
    font-size: 21px;
    font-weight: bold;
    line-height: 38px;
    background-color: #f1d895;
    border-radius: 15px;
}


#wrap > #ot > #content_box > ul > .content15 > .cont15 > .cont15_txt1 {
    margin-top: 40px;
    text-align: center;
    color: #008c59;
}



#wrap > #ot > #content_box > ul > .content15 > .cont15 > .cont15_txt1 > .li_point {
    color: indianred;
    padding-right: 5px;
}


#wrap > #ot > #content_box > ul > .content15 > .cont15 > .cont15_txt1 > .li_underline {
    color: #1775e9;
    padding-bottom: 2px;
    border-bottom: 1px solid;
}


#wrap > #ot > #content_box > ul > .content15 > .cont15 > .cont15_txt2 {
    width: 340px;
    margin: 0 auto;
    text-align: center;
    margin-top: 20px;
    border-top: 2px solid #fff;
    padding-top: 10px;
    color: #ea533a;
}

/* 15 page end */




/* 16 page (쪽지시험) */


#wrap > #ot > #content_box > ul > .content16 {
    width: 710px;
    height: 533px;
    position: absolute;
    left: 0;
    top: 0;
    background-image: url("../img/bg03.png");
    background-repeat: no-repeat;
}


#wrap > #ot > #content_box > ul > .content16 > .cont16 {
    width: 600px;
    height: 310px;
    background-color: #f1d895;
    border-radius: 15px;
    position: absolute;
    top: 100px;
    left: 50%;
    margin-left: -300px;
}

#wrap > #ot > #content_box > ul > .content16 > .cont16 > #cont16_li {
    padding: 10px;
    font-size: 18px;
    font-weight: bold;
}

#wrap > #ot > #content_box > ul > .content16 > .cont16 > #cont16_li > ul {
    margin-top: 15px;
}

#wrap > #ot > #content_box > ul > .content16 > .cont16 > #cont16_li > ul > li {
    color: #008c59;
    width: 450px;
    margin: 0 auto;
    line-height: 32px;
    margin-bottom: 20px;
}

#wrap > #ot > #content_box > ul > .content16 > .cont16 > #cont16_li .li_point {
      color: indianred; 
    padding-right: 5px;
}

#wrap > #ot > #content_box > ul > .content16 > .cont16 > #cont16_li .li_underline {
    color: #1775e9;
    padding-bottom: 2px;
    border-bottom: 1px solid ;

}

#wrap > #ot > #content_box > ul > .content16 > .cont16 > #cont16_point {

    width: 500px;
    margin: 0 auto;
    line-height: 32px;
    text-align: left;
    font-size: 18px;
    font-weight: bold;
    color: #ea533a;
    padding-top: 15px;
    border-top: 2px solid #fff;

}

#wrap > #ot > #content_box > ul > .content16 > #cont16_img {
    position: absolute;
    bottom: 60px; right: 50px;
}











/* 공통 (하단 버튼, 타이틀) */


#wrap > #ot > #content_box .content > .title {
    width: 495px;
    text-align: center;
    margin: 0 auto;
    margin-top: 13px;
    margin-bottom: 40px;
}


#wrap > #ot > #content_box .content .left_btn {
    display: inline-block;
    font-size: 20px;
    font-weight: bold;
    width: 70px;
    height: 30px;
    text-align: center;
    line-height: 30px;
    border-radius: 15px;
    cursor: pointer;
    border: 2px solid #fff;
    box-shadow: 1px 1px 5px 2px #a1a1a1;
    position: absolute;
    left: 20px;
    bottom: 20px;


    /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#e4f5fc+0,bfe8f9+50,9fd8ef+51,2ab0ed+100;Blue+Gloss+%235 */
    background: #e4f5fc;
    /* Old browsers */
    background: -moz-linear-gradient(top, #e4f5fc 0%, #bfe8f9 50%, #9fd8ef 51%, #2ab0ed 100%);
    /* FF3.6-15 */
    background: -webkit-linear-gradient(top, #e4f5fc 0%, #bfe8f9 50%, #9fd8ef 51%, #2ab0ed 100%);
    /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom, #e4f5fc 0%, #bfe8f9 50%, #9fd8ef 51%, #2ab0ed 100%);
    /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#e4f5fc', endColorstr='#2ab0ed', GradientType=0);
    /* IE6-9 */
}


#wrap > #ot > #content_box .content .right_btn {
    display: inline-block;
    font-size: 20px;
    font-weight: bold;
    width: 70px;
    height: 30px;
    text-align: center;
    line-height: 30px;
    border-radius: 15px;
    cursor: pointer;
    border: 2px solid #fff;
    box-shadow: 1px 1px 5px 2px #a1a1a1;
    position: absolute;
    right: 20px;
    bottom: 20px;

    ;
    /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#fcedf0+1,ffaac4+50,fba6e1+50,ff8ca7+51,ff7ca8+100 */
    background: #fcedf0;
    /* Old browsers */
    background: -moz-linear-gradient(top, #fcedf0 1%, #ffaac4 50%, #fba6e1 50%, #ff8ca7 51%, #ff7ca8 100%);
    /* FF3.6-15 */
    background: -webkit-linear-gradient(top, #fcedf0 1%, #ffaac4 50%, #fba6e1 50%, #ff8ca7 51%, #ff7ca8 100%);
    /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom, #fcedf0 1%, #ffaac4 50%, #fba6e1 50%, #ff8ca7 51%, #ff7ca8 100%);
    /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fcedf0', endColorstr='#ff7ca8', GradientType=0);
    /* IE6-9 */
}