@charset "UTF-8";
@import url('https://fonts.googleapis.com/css?family=Noto+Sans+KR:100,300,400,500,700,900');
/*reset*/
/* 여백 초기화 */
body, div, ul, li, dl, dt, ol, h1, h2, h3, h4, h5, h6, input, fieldset, legend, p, select, table, th, td, tr,
textarea, button, form {margin: 0; padding: 0;box-sizing: border-box;}

/* a 링크 초기화 */
a {color: #222; text-decoration: none; box-sizing:border-box;}
a:active,a:focus {color: #fff; }

/* 폰트 초기화 */
body, input, textarea, select, button, table {font-family: 'Noto Sans KR', sans-serif; color: #222; font-size: 13px;
line-height: 1.5;letter-spacing: -0.03em;}
a {font-family: 'Noto Sans KR'}
/* 폰트 스타일 초기화 */
em, address {font-style: normal;}

/* 블릿기호 초기화 */
dl, ul, li, ol, menu {list-style: none;}

/* 제목 태그 초기화 */
h1, h2, h3, h4, h5, h6 {font-size: 17px; color:#222; font-weight: bold;}

/* 테두리 초기화 */
img, fieldset {border: 0 none;}

/* 버튼 초기화 */
button {border: 0;}
/* 테이블 초기화 */
table, caption, tbody, tfoot, thead, tr, th, td { margin: 0; padding: 0; border: 0; font-size: 100%; font: inherit; vertical-align: baseline; }
table { /* border-collapse: collapse; */ border-spacing: 0; }

input,
select {padding:0 5px; margin:0; height:22px; border:1px solid #0D3388; vertical-align: middle;box-sizing:border-box;}
input + input {margin: 0;}
textarea {padding:0 5px; margin:0 3px; border:1px solid #0D3388; resize: none;}
table caption {overflow: hidden; width: 1px; height: 1px; text-indent: -9999px;}
body {font-size: 0.938rem;}

/* 공통 */
.tc {text-align: center;}
.tl {text-align: left;}
.wrap {min-height: 950px; width: 1000px; margin: 0 auto 30px; text-align: center;font-family: 'Noto Sans Kr';}
.wrap h1 {margin: 30px 0 15px;color:#0D3388;font-size: 1.45rem;font-weight: 600;}
.desc {font-size: 0.975rem;margin-left: 10px;}
.desc +.desc{margin-top: 10px;}
[class$="-box"] {margin: 10px 0;}
[class$="-box"] + [class$="-box"]{margin-top: 20px}


/* 버튼 */
    .button-box {margin: 30px 0;}
    .button {display: inline-block;padding: 1rem 2.4rem;color: #0D3388;font-size: 1rem;text-align: center;cursor: pointer;font-weight: 500;transition: all .3s;}
    .button:visited,
    .button:active,
    .button:focus,
    .button:link {color: #0D3388;}
    .button:hover {color: #fff;}
    .button__default {background-color: #fff;border: 2px solid #0D3388;}
    .button__default:hover {background-color: #0D3388;color: #fff;}
    .button__disable {background-color: #767171;color: #fff;border: 2px solid #fff;}
    .button__disable:hover {background-color: #fff;color: #767171;border-color: #767171;}
    .button__large {padding: 1.5rem 4rem;font-size: 1.6rem;}
    .button__medium {padding: 1.5rem 4rem;font-size: 1.3rem;}
    .button__small {padding: 0.3rem 1rem;line-height:30px;}
    .button__down {padding: 0.3rem 1rem; line-height:20px; border: solid 3px; color:#f08e69; border-color: #f08e69; font-weight: bold; }
    .button__down:visited,
    .button__down:active,
    .button__down:focus,
    .button__down:link {color: #f08e69;}
    .button__down:hover {background-color: #f08e69;color: #fff;}


/* poster */
.poster-box {margin: 0;}
    .poster {position: relative;margin: 0 auto;width: 1300px;text-align: center;}
    .button-wrap {position: absolute;bottom: 10%;left: 8%;box-shadow: 0px 0px 5px 0px #454545;}
    .poster img {max-width: 100%;}
/* join */ 
    .login-box{width: 600px; margin: 0 auto;text-align: center;}
    .form {margin: 0 auto;padding: 2.5em 2.5em;width: 600px;border: 2px solid #2F528F; background-color: #f1f7ff;text-align: center;}
    .form__item {margin-bottom: 10px;display: flex;align-items: center;justify-content: flex-start;}
    .form__item label{display: inline-block;margin-right: 25px;width: 20%;font-size: 1rem;text-align: left;}
    .form__item input{padding: 10px;width: 120px;height: 35px;}
    .form__item:last-of-type input:nth-of-type(1) {margin-right: 5px;}
    .form__item:last-of-type input:nth-of-type(2) {margin-left: 5px;}
    .form__item select{padding: 5px 3px;width: 100%;height: 35px;margin-left: 5px;}
    .email_in {display: flex;align-items: center;}
    .form__title {padding-top: 15px;}
    .title {margin: 40px 0 15px;}
    /* 20240612수정 */
    .info-box .info {padding: 10px;border: 1px solid #222;word-break: keep-all;}
    .info-box .info ul{margin:15px 0}
    .info-box .info ul > li {position: relative;padding: 0 16px;text-align: left;line-height: 1.5;}
    .info-box .info ul > li::before {content:"";position: absolute;top: 2px;left: 0;width: 0;height: 0;border-left: #000000 10px solid;border-top: transparent 6px solid;border-bottom: transparent 6px solid;border-top: transparent 6px solid;}
     /* //20240612수정 */
    .info-bottom { padding: 10px 0;}
    .info-bottom p{ padding: 5px 0 ;font-size: 16px;font-weight: 600;}

    /* list */
    .list-box {padding: 10px;}
    .table-box {margin: 10px 0;}
    .table {width: 100%;}
    .table thead th{padding: 1rem 0.5rem;color: #fff;;font-weight: bold;}
    .table tbody td{padding: 0.4rem 0.5rem;color: #252525;vertical-align: middle;}

    .time__table tbody tr:nth-child(2n-1) {background-color: #d5e6fa;}
    .time__table tbody tr:nth-child(2n) {background-color: #f1f7ff;}
    .time__table thead tr th {background-color: #0D3388;border-right:1px solid #fff;word-break: keep-all;}
    .time__table tbody tr td {border-left: 1px solid #fff;border-top: 1px solid #fff;word-break: keep-all;}

    .quiz__table tbody tr:nth-child(2n-1) {background-color: #CFD5EA;}
    .quiz__table tbody tr:nth-child(2n) {background-color: #E9EBF5;}
    .quiz__table thead tr th {background-color: #4472C4;border-right:1px solid #fff;}
    .quiz__table tbody tr td {border-left: 1px solid #fff;border-top: 1px solid #fff;text-align: left;}
    .quiz__table tbody tr td input {width: 100%;}

    .state {display: block;font-weight: bold;}
    .state__success {color: #0070C0;}
    .state__primary{color : #E90000;}
    .state__default{color : #252525;}

/* view */    
    .text-box {margin: 15px 0;padding: 10px;}
    .bg__green {background-color: #edf4fc;text-align: left;}
    .bg__green2 {margin: 30px 0 10px;background-color: #DAF7F6;text-align: center;}
    
    .list-dot li {margin: 0 0 0 10px;list-style: disc;list-style-position: inside;font-size: 1rem;line-height: 26px;}

    .video-box video{width: 100%;}

    @media (max-width: 1300px) {
        .poster {width: auto;}
        .poster img {width: 100%;}
        .button__large {padding: 1.5rem 5rem;font-size: 1.5rem;}
    }
    @media (max-width: 720px) {
        .poster {width: auto;}
        .poster img {width: 100%;}
        .button__large {padding: 1rem 1rem;font-size: 1rem;}
    }
    @media (max-width: 468px) {
        [class$="-box"] {padding: 10px;}
        .button-wrap {top:initial; bottom: 12%;}
        /* .button__large {padding:1rem 0.5rem;font-size: 1rem;} */
        .button__medium {padding: 1.5rem 3rem;font-size: 1rem;}
        .button__text {font-size: 0.875rem; word-break: keep-all;}
        .desc {font-size: 0.875rem;}

        .wrap {width: 100%;}
        .wrap img {width: 100%;}
        .wrap h1 {font-size: 1rem;}
        .poster-box img {width: 100%;}
        .login-box {width: 100%;}
        .form {width: 100%;padding:1em 1em}
        .form__item label {font-size: 0.875rem;min-width: 25%;text-align: left;margin-right: 0;}
        .form__item input {width: 100%;}
        .form__item .email_in {flex-wrap: wrap;}
        .form__item .email_in input {width: calc(50% - 8px);}
        .form__item .email_in select {width:100%;margin-top: 5px;margin-left: 0;}
        .form__item__email label {width: 50%;}
        .form__item__email input {width: 40%;}
        .form__item__email select  {width: 100%;}
        .table-box {overflow-x: auto;}
        .time__table {font-size: 0.875rem;}

        
    }