@charset "UTF-8";
/* @font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 400;
    src: url(../font/Roboto-Footlong.eot);
    src: url(../font/Roboto-Footlong.eot?#iefix) format('embedded-opentype'),
         url(../font/Roboto-Footlong.woff) format('woff'),
         url(../font/Roboto-Footlong.ttf) format('truetype');
} */
@font-face {
    font-family: 'yg-jalnan';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_four@1.2/JalnanOTF00.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, address, code, em, img, strong, sub, sup, b, u, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, figure, figcaption, footer, header, hgroup, menu, nav, section, main, audio, video { margin: 0; padding: 0; }

/* html의 모든 요소와 가상요소선택자에 border-box사용하여 padding, border사용시
늘어나지않게함 */
*, :before, :after {box-sizing: border-box;}

/*html5추가 시멘틱엘리먼트를 익스하위버전에서 블럭으로 인식되도록함*/
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section, main { display: block }

/* button태그에 손모양 커서 */
button { cursor: pointer }

/* 반응형에서 이미지 원본크기보다 커지지않고 줄어들수는 있게함 */
img {max-width: 100%;}

/* 익스하위버전에서 이미지 선없애기 */
fieldset, img { border: 0; vertical-align: top }

/* 리스트 기호 빼기 */
ol, ul { list-style: none }

/* 태그 기본 기울임꼴 제거 */
address, em { font-style: normal }

/* 페이지안에서 가장 많은 링크색 지정 */
a { text-decoration: none; color: #666;  font-weight:400;}

/* iframe으로 외부컨텐츠를 연결했을때
외부컨텐츠안쪽내용이 우리페이지에 영향을 주지못하도록 가려줌
iframe아래쪽 간격없애기*/
iframe { overflow: hidden; border: 0; vertical-align: top; }

/* 칸의 선을 합치기, 칸의 간격없애기, 가로를 늘려줌 */
table { border-collapse: collapse; border-spacing: 0; width: 100%; table-layout: fixed; }

/* 굵기 빼고 헤딩태그 폰트크기를 body에 선언한 크기와 일치시킴 */
h1, h2, h3, h4, h5, h6 { font-weight: normal; font-size: 100% }

/* 폼요소의 높이가 다를때 요소끼리 세로정렬시킴 */
input, select, textarea, button { vertical-align: middle; margin: 0; padding: 0 }

/* ios,safari input 초기화 */
input {
    appearance:none;
    border-radius:0;
    -moz-appearance:none;
    -webkit-appearance:none;
    -webkit-border-radius:0;
    -moz-border-radius:0;
}
input[type='radio'] {
    appearance:auto;
    display:none;
}
input[type='radio'] + label {
    display:inline-block;
    margin:0 auto;
    position:relative;
    width:24px;
    height:22px;
    border:none;
    transition:all .2s;
    cursor:pointer;
}
input[type='radio'] + label:after {
    content:'';
    position:absolute;
    top:-12px;
    right:-11px;
    background:url(../images/answer_check2.svg) center center no-repeat;
    background-size:100%;
    width:0;
    height:0;
    transition:all .2s;
}
input[type='radio']:checked + label:after {
    content:'';
    width:30px;
    height:30px;
    transition:all .2s;
}

/* textarea 리사이즈기능 빼기 */
textarea { resize: none }

/* 페이지안의 모든 폰트의 줄간격을 1.5로 통일시킴
모바일 크롬, 모바일 사파리 브라우져의 텍스트 자동확대 방지
*/
/* body { line-height: 1.5; -webkit-text-size-adjust: none } */
/* 지금 작업하는 페이지는 line-height:1.5를 제외하고 작업함 */
body {-webkit-text-size-adjust: none}

/* 선택영역 */
::-moz-selection {background: #e91e63; color:#fff;}
::selection {background: #e91e63; color:#fff;}

/* legend,caption,메뉴제목,섹션제목 블라인드 */
legend, caption, .blind { position: absolute; overflow: hidden; clip: rect(0 0 0 0); margin: -1px; width: 1px; height: 1px }

/* 공통스타일 */
/* skip Navgation */
#skipNavi a {display:block; position: absolute; left: 0; top: -999px; transition:all 0.5s; width: 100%; padding:10px 0; background:#fff; color: #000; z-index: 99999; text-align: center; transform: translateY(-100%); }

#skipNavi a:focus, #skipNavi a:hover, #skipNavi a:active { transform: translateY(0); }

body, input, select, textarea, button, table { font-family: 'noto sans KR'; font-size: 16px; color: #222; letter-spacing: -0.025em; font-weight:400;}


/* placeholder공통 */
:-ms-input-placeholder { /* Internet Explorer 10-11 */ color: #999; }
::-ms-input-placeholder { /* Microsoft Edge */ color: #999; }
::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */ color: #999; opacity: 1; /* Firefox */ }

/* 테이블 공통스타일 */
/*테이블 제목 공통*/
table thead th { border: 1px solid #d9d9d9; border-top: 2px solid #333; border-bottom: none; height: 70px; background: #f7f7f7; font-size: 18px; font-weight: bold; color: #333; }

table tbody th,
table tbody td { border: 1px solid #d9d9d9; height: 60px; text-align: center; font-size: 16px; font-weight: normal; }

table td.left_td { text-align: left; }
table td.left_td a:hover { text-decoration: underline; }



/* 폼요소 공통스타일 */

/* input[type="checkbox"] + label {
    cursor:pointer;
    position:relative;
    padding-left:40px;
    color:#292929;
    line-height:30px;
    display:inline-block;
} */
/* 태그에서 + 는 인접형제선택자 라는 역활을 하는데 바로밑에있는 형제만 선택한다. 그밑에있는 형제는 선택안됨 */
/* input[type="checkbox"] + label:before {
    content:'';
    position:absolute;
    left:0;
    top:7px;
    width:23px;
    height:23px;
    background:url(../images/_check01.png) no-repeat;
} */

/* input[type="checkbox"] + label em {
    color:#009223;
} */
/* input[type="checkbox"]:checked + label:before {
    background: url(../images/icon_checkbox.png) no-repeat 50% 50%;
    background-size:50%;
} */

/* input[type="checkbox"] + label:after {
    content:'';
    position:absolute;
    top:10px;
    left:6px;
    width:0;
    height:20px;
    background:url(../images/_check01.png) no-repeat;
    transition: all 0.5s;
}
input[type="checkbox"]:checked + label:after {
    width:24px;
} */
/* swal custom */
.error_popup {
    padding:2% 0;
    width:25%;
}
.error_popup p {
    font-size:1.3rem;
    font-weight:600;
}
.error_popup .swal2-actions {
    width:55%;
}
.error_popup .swal2-confirm {
    background-color:#6ab848;
    width:40%
}
.error_popup .swal2-cancel {
    background-color:#FB706F;
    width:40%
}


/* ar_wrap */
.ar_box {
    margin-top:5%;
    height:50%;
    display:flex;
    justify-content:center;
    align-items:center;
}
.ar_box img {
    width:60%;
}

/* chatbot  */
.chatbot_wrap,
.ar_wrap {
    position:fixed;
    bottom:1%;
    right:1%;
    z-index:9999;
    width:1px;
    height:1px;
    transition:all .3s;
}
.chatbot_wrap.on,
.ar_wrap.on {
    width:29%;
    height:90%;
    border-radius:20px;
    overflow:hidden;
    box-shadow:0px 0px 15px rgba(0,0,0,.4);
}
.chatbot_wrap .icon_wrap {
    position:absolute;
    bottom:0;
    right:0;
    width:160px;
    height:80px;
    border-radius:50%;
    display:flex;
    align-items:center;
    justify-content:flex-end;
}
.chatbot_wrap.on .icon_wrap {
    z-index:-1;
}
.chatbot_wrap .icon_wrap a {
    display:flex;
    justify-content:center;
    align-items:center;
    width:50%;
    height:100%;
}

.chatbot_box {
    width:100%;
    height:100%;
    display:flex;
    justify-content:flex-end;
}
.chatbot_box .chatbot_inner,
.ar_wrap .ar_inner {
    width:100%;
    height:100%;
    background-color:#fff;
    position:relative;
    display:none;
}
.chatbot_wrap .close_btn,
.ar_wrap .close_btn {
    position:absolute;
    top:2%;
    right:4%;
    width:20px;
}
.chatbot_wrap.on .chatbot_box .chatbot_inner,
.ar_wrap.on .ar_inner {
    display:block;
}
.chatbot_box .chatbot_inner .chatbot_top,
.ar_wrap .ar_top {
    width:100%;
    display:flex;
    justify-content:space-between;
    align-items:center;
    flex-direction:column;
    height:13%;
    background-color:#f3fcfe;
}
.chatbot_box .chatbot_inner .chatbot_top div,
.ar_wrap .ar_top div {
    width:100%;
    display:flex;
    justify-content:center;
    align-items:center;
    height:65%;
}
.chatbot_box .chatbot_inner .chatbot_top p,
.ar_wrap .ar_top p {
    font-size:1.3rem;
    font-weight:600;
    display:flex;
    align-items:center;
}
.chatbot_box .chatbot_inner .chatbot_top p img {
    width:22px;
    margin:0 7px -4px 0;
}
.chatbot_box .chatbot_inner .chatbot_tab {
    width:50%;
    height:35%;
    padding:0;
    margin:0 auto;
    display:flex;
    justify-content:center;
    align-items:center;
    background-color:#fff;
    border-top-left-radius:15px;
    border-top-right-radius:15px;
    overflow-y:hidden;
}
.chatbot_box .chatbot_inner .chatbot_tab li {
    width:50%;
    height:100%;
    margin-bottom:0;
    justify-content:center;
}
.chatbot_box .chatbot_inner .chatbot_tab li a {
    display:flex;
    justify-content:center;
    align-items:center;
    width:auto;
    height:100%;
    color:#000;
    position:relative;
}
.chatbot_box .chatbot_inner .chatbot_tab li a:after {
    content:'';
    position:absolute;
    bottom:-2px;
    left:50%;
    transform:translateX(-50%);
    width:0%;
    height:3px;
    background-color:#15b0ff;
    transition:all .3s;
}
.chatbot_box .chatbot_inner .chatbot_tab li a.on:after {
    width:100%;
}



.ar_wrap .ar_top .logo {
    width:15%;
}
.chatbot_box .chatbot_inner section {
    display:none;
    height:87%;
}
.chatbot_box .chatbot_inner section.on {
    display:block;
}
.chatbot_box .chatbot_inner ul {
    height:85%;
    padding:5% 4% 2%;
    overflow-y:auto;
}
.chatbot_box .chatbot_inner ul#qna_list {
    overflow:hidden auto;
    height:100%;
}
.chatbot_box .chatbot_inner ul#qna_list::-webkit-scrollbar {width:8px; background-color:#d9d9d9;}
.chatbot_box .chatbot_inner ul#qna_list::-webkit-scrollbar-thumb {background-color:#767676; border-radius:10px;}
.chatbot_box .chatbot_inner ul li {
    max-width:90%;
    height:auto;
    display:flex;
    align-items:center;
    position:relative;
    margin-bottom:7%;
}
.chatbot_wrap .chatbot_box .chatbot_inner ul li  {
    animation:slide .5s 1;
}
@keyframes slide {
    0% {margin-top:10%; opacity:0;};
    20% {margin-top:7%; opacity:0;}
    70% {margin-top:5%; opacity:0;};
    100% {margin-top:0; opacity:1;};
}
.chatbot_box .chatbot_inner ul li.s_talk {
    flex-direction:row-reverse;
}
.chatbot_box .chatbot_inner ul li img {
    width:12%;
    position:absolute;
    bottom:-12px;
    left:0;

}
.chatbot_box .chatbot_inner .chatbot_question ul li p {
    background-color:#f3fcfe;
    width:auto;
    padding:7%;
    margin-left:15px;
    display:flex;
    align-items:center;
    border-radius:10px;
    word-break:keep-all;
    box-shadow:1px 2px 5px rgba(0,0,0,.1);
}
.chatbot_box .chatbot_inner .chatbot_question ul li.s_talk p {
    background-color:#d1eefd;
    border-bottom-right-radius:0;
}
/* qna custom */
.chatbot_box .chatbot_inner ul .qna_items {
    width:90%;
    height:auto;
    flex-direction:column;
    justify-content:space-between;
    border-radius:10px;
    padding:0;
    position:relative;
    margin:0 auto 4%;
    overflow:hidden;
    padding-bottom:25px;
    cursor:pointer;
    transition:all .3s;
}
.chatbot_box .chatbot_inner ul .qna_items:before {
    content:'';
    position:absolute;
    bottom:17px;
    left:10%;
    width:40px;
    height:40px;
    background:url(../images/answer_arrow.png) center center no-repeat;
    background-size:60%;
    transition:all .3s;
    z-index:9;
    transition:all .3s;
}
/* active 걸었을때 */
.chatbot_box .chatbot_inner ul .qna_items .item_box .question_charsi .qna_content {
    display:none
}
.chatbot_box .chatbot_inner ul .qna_items.active .item_box .question_charsi .qna_content {
    display:block;
}
.chatbot_box .chatbot_inner #qna_list .qna_items.active .answer_box {
    display:flex;
}
.chatbot_box .chatbot_inner ul .qna_items.active:before {
    transform:translateX(-50%) rotate(180deg);
    bottom:-13px;
    left:50%;
}
.chatbot_box .chatbot_inner ul .qna_items:after {
    content:'';
    position:absolute;
    bottom:2px;
    left:50%;
    transform:translateX(-50%);
    width:80%;
    height:1px;
    background-color:#aaa;
    transition:all .3s;
    opacity:0;
}
.chatbot_box .chatbot_inner ul .qna_items.active:after {
    opacity:1;
}
/* //active 걸었을때 */
.chatbot_box .chatbot_inner ul .qna_items .answer_or_not {
    width:100%;
    display:flex;
    justify-content:flex-end;
}
.chatbot_box .chatbot_inner ul .qna_items.answer .answer_check,
.chatbot_box .chatbot_inner ul .qna_items.unanswer .answer_check {
    width:27%;
    background-color:#777777;
    color:#fff;
    font-size:.9rem;
    text-align:center;
    padding:1%;
    border-top-left-radius:10px;
    border-top-right-radius:10px;
}
.chatbot_box .chatbot_inner ul .qna_items.answer .answer_check {
    background-color:#6ab847;
}
.chatbot_box .chatbot_inner ul .qna_items.answer .answer_check:before {
    content:'답변완료';
}
.chatbot_box .chatbot_inner ul .qna_items.unanswer .answer_check:before {
    content:'답변대기';
}
.chatbot_box .chatbot_inner ul .qna_items .item_box {
    height:50%;
    width:100%;
    padding:0%;
    display:flex;
    align-items:center;
    flex-direction:column;
}
.chatbot_box .chatbot_inner ul .qna_items .item_box .question_charsi {
    background-color:#d1eefd;
    flex-direction:column;
    border-radius:10px;
    border-top-right-radius:0;
    padding:4%;
}
.chatbot_box .chatbot_inner ul .qna_items .item_box p {
    padding:2%;
}
.chatbot_box .chatbot_inner ul .qna_items .item_box .step_name {
    background-color:#fff;
    border-radius:15px;
    padding:.5% 3%;
    word-break:keep-all;
}
.chatbot_box .chatbot_inner ul .qna_items .item_box .charsi_name {
    width:70%;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    font-weight:600;
}
.chatbot_box .chatbot_inner ul .qna_items .item_box .question_time,
.chatbot_box .chatbot_inner ul .qna_items .item_box .answer_time {
    color:#858585;
    font-size:.9rem;
    padding:1%;
}
.chatbot_box .chatbot_inner ul .qna_items .answer_box {
    justify-content:space-between;
    margin-top:2%;
    display:none;
}
.chatbot_box .chatbot_inner ul .qna_items.unanswer .answer_box {display:none;}
.chatbot_box .chatbot_inner ul .qna_items .answer_box p.qna_content {
    border:solid 2px #6ab847;
    border-radius:15px;
    background-color:#f3fcfe;
    padding:5%;
}
.chatbot_box .chatbot_inner ul .qna_items .item_box div {
    display:flex;
    align-items:center;
    justify-content:space-between;
    width:100%;
    position:relative;
}
.chatbot_box .chatbot_inner ul .qna_items .item_box .qna_content {
    width:100%;
    margin-top:1%;

}

.chatbot_box .chatbot_inner .chatbot_answer {
    width:100%;
    height:15%;
    padding:4%;
    display:flex;
    justify-content:space-between;
    align-items:center;
    background-color:#f6fbfc;
    position:relative;
}
.chatbot_box .chatbot_inner .chatbot_answer div {
    width:85%;
    height:65%;
    position:relative;
    margin:0 auto;
}
.chatbot_box .chatbot_inner .chatbot_answer input {
    width:100%;
    border:none;
    background-color:#d1eefd;
    height:100%;
    border-radius:30px;
    padding:2% 12% 2% 6%;
}
.chatbot_box .chatbot_inner .chatbot_answer a {
    position:absolute;
    top:50%;
    right:2%;
    transform:translateY(-50%);
    display:flex;
    justify-content:center;
    align-items:center;
    width:12%;
    height:100%;
    color:#fff;
}


/* //chatbot */

/* input checkbox custom */
input[type="checkbox"] {display:none;}
input[type="checkbox"] + label {display:inline-block; position:relative; padding-left:25px; cursor:pointer;}
input[type="checkbox"] + label:before {content:''; position:absolute; top:0; left:0; background:url(../images/_check01.png) no-repeat; width:23px; height:23px; transition:all 2s;}
input[type="checkbox"]:checked + label:after {content:''; position:absolute; top:0; left:0; width:23px; height:23px; background:url(../images/_check01.png) no-repeat; background-position-y:-23px; transition:all 2s;}
/* //input checkbox custom */ 

/* input number 화살표 없애기 */
input[type="number"]::-webkit-outer-spin-button,
input[type="number"]::-webkit-inner-spin-button {-webkit-appearance: none; margin: 0;}

body.on {overflow:hidden;}
/* 레이아웃 크기 입력하여 줄어들지않게함 */
#wrap {min-width: 360px; position:fixed; overflow:hidden;  width:100%; height:100%;}

/* login_page */
.login_wrap {position:fixed; top:0; left:0; width:100%; height:100%; background-color:#f7f9f6; background-size:100% 100%; }
.login_box {width:870px; height:750px; position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); background-color:#fff; box-shadow:0 0 26px rgba(0,0,0,.3); border-radius:10px;}
.login_form {position:absolute; top:0; right:0; width:100%; height:100%; }
.login_form .login_inner {position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); width:55%; text-align:center;}
.login_form .login_inner h2 {text-align:center;}
.login_form .login_inner h2 a img {width:40%;}
.login_form .login_inner input {margin-top:6%; width:100%; padding:2.5%; border:none; border-bottom:solid 1px #666; font-size:0.9rem;}
.login_form .login_inner input:nth-child(2) {margin-top:17%;}
.login_form .login_inner .id_checkbox {margin-top:6%; text-align:left;}
.login_form .login_inner .id_checkbox input[type="checkbox"] + label {font-size:0.9rem; color:#c4c4c4}
.login_form .login_inner .id_checkbox input[type="checkbox"] + label:before {background:none; border:solid 2px #C4C4C4;}
.login_form .login_inner .id_checkbox input[type="checkbox"]:checked + label:after {background:#FFDA55 center center; width:13px; height:13px; top:55%; transform:translateY(-50%); left:5px;}
.login_form .login_inner .login_btn_wrap {margin-top:18%;}
.login_form .login_inner .login_btn_wrap a {display:block; background-color:#6ab848; border-radius:5px; padding:3%; margin-bottom:6%; color:#fff;}
.login_form .login_inner .membership_table {margin-top:12%; border:none;}
.login_form .login_inner .membership_table table tr,
.login_form .login_inner .membership_table table td {border:none; position:relative;}
.login_form .login_inner .membership_table table tr { border-bottom:solid 1px #C4C4C4;}
.login_form .login_inner .membership_table table .cols_wrap {width:30%;}
.login_form .login_inner .membership_table table input {margin-top:0; border:none; height:80%;}
.login_form .login_inner .membership_table table input:hover {border:solid 2px #222; border-radius:5px;}
.login_form .login_inner .membership_table table td p {color:#C4C4C4; text-align:left; font-size:0.9rem;}
.login_form .login_inner .membership_table table td .input_check {position:absolute; top:50%; right:1%; padding:1% 6%; text-align:center; color:#fff; background-color:#6ab848; border-radius:40px; transform:translateY(-50%); font-size:0.8rem;}
.login_form .login_inner .membership_table table td input.id_check {padding-right:30%;}
.login_form .login_inner .join_btn {margin-top:10%; width:100%; background-color:#6ab848; padding:4% 2%; border:none; border-radius:10px; color:#fff;}
.login_popup {
    width:25%;
    height:20%;
    background-color:#fff;
    border-radius:10px;
    position:absolute;
    top:50%;
    left:50%;
    transform:translate(-50%,-50%);
    display:flex;
    justify-content:center;
    align-items:center;
    flex-direction:column;
    box-shadow:0px 0px 7px rgba(0,0,0,.3);
    display:none;
}
.login_popup p {
    font-size:1.2rem;
    font-weight:500;
}
.login_popup a {
    display:flex;
    justify-content:center;
    align-items:center;
    width:25%;
    padding:2% 0;
    background-color:#6ab847;
    border-radius:10px;
    color:#fff;
    margin-top:5%;
}
.login_form .login_inner03 {width:70%;}
.login_form .login_inner03 h2 a img {width:25%;}
.login_inner03 .swiper_wrap {height:100%; margin-top:7%;}
.login_inner03 .swiper_wrap .swiper_inner {width:90%; margin:1% auto 0; height:100%; position:relative;}
.login_inner03 .swiper_wrap .swiper_inner .main_swiper {height:100%; display:flex; align-items:center; position:relative; overflow:hidden;}
.login_inner03 .swiper_wrap .swiper_inner .swiper-wrapper {height:auto;}
.login_inner03 .swiper_wrap .swiper_inner .swiper-slide {border-radius:10px;}
.login_inner03 .swiper_wrap .swiper_inner .swiper-slide .card {display:flex; justify-content:center; align-items:center; flex-direction:column; background-color:#fff; padding:5% 3%; border-top-left-radius:10px; border-top-right-radius:10px; text-align:center; overflow:hidden;}
.login_inner03 .swiper_wrap .swiper_inner .swiper-slide .card-body {width:100%; padding:1%; margin-top:2%;}
.login_inner03 .swiper_wrap .swiper_inner .swiper-slide .card-body h5 {font-weight:600; font-size:1.15rem;}
.login_inner03 .swiper_wrap .swiper_inner .swiper-slide a {padding:4% 3%; background-color:#80a8c3; color:#fff; font-size:1.1rem; display:flex; width:80%; margin:0 auto; justify-content:center; align-items:center;}
.login_inner03 .swiper_wrap .swiper_inner .swiper-button-prev,
.login_inner03 .swiper_wrap .swiper_inner .swiper-button-next {width:35px; height:35px; left:-50px; background:url(../images/swiper_prev_btn.png) center center no-repeat; background-size:100%; transition:all .5s; border-radius:100%; background-color:rgba(0,0,0,.2);}
.login_inner03 .swiper_wrap .swiper_inner .swiper-button-prev:hover,
.login_inner03 .swiper_wrap .swiper_inner .swiper-button-next:hover {background-color:rgba(0,0,0,.6); }
.login_inner03 .swiper_wrap .swiper_inner .swiper-button-prev:before,
.login_inner03 .swiper_wrap .swiper_inner .swiper-button-next:before {content:'';}
.login_inner03 .swiper_wrap .swiper_inner .swiper-button-next {left:auto; right:-50px; background:url(../images/swiper_next_btn.png) center center no-repeat; background-size:100%; background-color:rgba(0,0,0,.2);}
.login_box.show_content {
    width:1400px;
    height:880px;
}
.login_box.show_content h2 {
    width:100%;
    height:8%;
    padding-left:2%;
    display:flex;
    align-items:center;
}
.login_box.show_content h2 img {
    width:30%;
}
.login_box.show_content .show_box {
    display:flex;
    /* justify-content:space-between; */
    align-items:center;
    align-content:flex-start;
    flex-wrap:wrap;
    width:100%;
    height:90%;
    padding:4%;
    overflow-y:auto;
}
.login_box.show_content .show_box a {
    width:30.333%;
    text-align:center;
    color:#000;
    margin-top:2%;
    text-decoration: none;
    border-radius:10px;
    margin: 0 3% 4% 0;
    box-shadow: 3px 3px 15px rgb(0 0 0 / 20%);
    overflow:hidden;
}
.login_box.show_content .show_box a:nth-child(3n) {
    margin-right:0;
}
.login_box.show_content .show_box a img {
    width:100%;
}
.login_box.show_content .show_box a p {
    padding: 4% 4%;
    display: flex;
    align-items: center;
    background-color: #80a8c3;
    color: #fff;
    border-bottom-left-radius: 7px;
    border-bottom-right-radius: 7px;
    word-break: keep-all;
    margin:0;
}


/* content_select page */
.content_wrap {background-color:#f0f4f5; background-size:100% 100%; width:100%;  height:100%; position:fixed; top:0; left:0;}
.content_wrap .content_inner {position:absolute; bottom:1%; left:50%; transform:translateX(-50%); width:1400px; height:94%; background-color:#f7f9f6; border-radius:10px; box-shadow:0 0 26px rgba(0,0,0,.15);}
.content_wrap .content_inner .content_top {display:flex; justify-content:space-between; height:90px; width:69%; margin:0 auto; align-items:center;}
.content_wrap .content_inner .content_top .notice_wrap {height:100%; display:flex; align-items:flex-end; width:29%; order:2; justify-content:flex-end;}
.content_wrap .content_inner .content_top .notice_wrap ul {display:flex; height:50%; width:270px; background-color:#80a8c3; border-top-left-radius:10px; border-top-right-radius:10px; justify-content:center;}
.content_wrap .content_inner .content_top .notice_wrap ul li {height:100%; border-top-left-radius:10px; border-top-right-radius:10px;}
.content_wrap .content_inner .content_top .notice_wrap ul li.on {background-color:rgba(255,255,255);}
.content_wrap .content_inner .content_top .notice_wrap ul li.on a p {color:#000;}
.content_wrap .content_inner .content_top .notice_wrap ul li a {display:block; height:100%; width:120px; padding:5%;}
.content_wrap .content_inner .content_top .notice_wrap ul li a p {color:#fff; font-size:1.2rem; text-align:center; font-weight:600;}
.content_wrap .content_inner .content_top .sub_tit {font-size:1.7rem; margin-left:5%; color:#fff; font-weight:500; padding-bottom:1%; order:1;}
.content_wrap .content_inner .content_top h2 {text-align:left; order:0; width:15%;}
.content_wrap .content_inner .content_top h2 img {width:85%;}
.content_wrap .content_inner .content_middle {height:380px; background-color:#fff;}
.content_wrap .content_inner .content_middle .diary_wrap,
.content_wrap .content_inner .content_middle .reference_wrap {width:70%; height:100%; margin:0 auto; padding:2% 0; display:none;}
.content_wrap .content_inner .content_middle .diary_wrap.on,
.content_wrap .content_inner .content_middle .reference_wrap.on {display:block;}
.content_wrap .content_inner .content_middle ul {height:100%; overflow-y:auto;}
.content_wrap .content_inner .content_middle ul::-webkit-scrollbar {width:8px; background-color:#d9d9d9;}
.content_wrap .content_inner .content_middle ul::-webkit-scrollbar-thumb {background-color:#767676; border-radius:10px;}
.content_wrap .content_inner .content_middle ul li {display:flex; justify-content:space-between; padding:2%; border-bottom:solid 1px #c4c4c4;}
.content_wrap .content_inner .content_middle ul li a {display:block; font-size:1.1rem; width:85%; cursor:pointer;}
.content_wrap .content_inner .content_middle ul li a img {width:33px; vertical-align:middle;}
.content_wrap .content_inner .content_middle ul li span {font-size:0.9rem; color:#c4c4c4; width:10%;}
.content_wrap .content_inner .content_bottom {height:calc(100% - 500px);}
.content_wrap .content_inner .content_bottom .swiper_wrap {height:100%;}
.content_wrap .content_inner .content_bottom .swiper_wrap .swiper_inner {width:80%; margin:1% auto 0; height:100%; position:relative;}
.content_wrap .content_inner .content_bottom .swiper_wrap .swiper_inner .main_swiper {height:100%; display:flex; align-items:center; position:relative; overflow:hidden; padding:0 2%;}
.content_wrap .content_inner .content_bottom .swiper_wrap .swiper_inner .swiper-wrapper {justify-content:center; height:auto;}
.content_wrap .content_inner .content_bottom .swiper_wrap .swiper_inner .swiper-slide {border-radius:10px; box-shadow:3px 3px 15px rgb(0 0 0 / 20%);}
.content_wrap .content_inner .content_bottom .swiper_wrap .swiper_inner .swiper-slide:nth-child(3n) {margin-right:0;}
.content_wrap .content_inner .content_bottom .swiper_wrap .swiper_inner .swiper-slide.disabled,
.chapter_wrap .chapter_inner .list_box.disabled {pointer-events: none; position:relative;}
.content_wrap .content_inner .content_bottom .swiper_wrap .swiper_inner .swiper-slide.disabled:after,
.chapter_wrap .chapter_inner .list_box.disabled:after {
    content:'';
    position:absolute;
    top:0;
    left:0;
    width:100%;
    height:100%;
    background-color:rgba(0,0,0,.4);
    border-radius:10px;
}
.content_wrap .content_inner .content_bottom .swiper_wrap .swiper_inner .swiper-slide.use_possible,
.chapter_wrap .chapter_inner .list_box.use_possible {
    overflow:visible;
}
.content_wrap .content_inner .content_bottom .swiper_wrap .swiper_inner .swiper-slide.use_possible:after,
.chapter_wrap .chapter_inner .list_box.use_possible:before {
    content:'체험 가능';
    position:absolute;
    top:-6%;
    left:-3%;
    background-color:#6ab848;
    border-radius:5rem;
    color:#fff;
    padding:3% 5%;
    font-size:1.1rem;
    font-weight:500;
}
.content_wrap .content_inner .content_bottom .swiper_wrap .swiper_inner .swiper-slide
.content_wrap .content_inner .content_bottom .swiper_wrap .swiper_inner .swiper-slide a {display:flex; justify-content:center; align-items:center; background-color:#fff; height:200px; padding:5% 3%; border-top-left-radius:10px; border-top-right-radius:10px; text-align:center; overflow:hidden;}
.content_wrap .content_inner .content_bottom .swiper_wrap .swiper_inner .swiper-slide a img {width:100%;}
.content_wrap .content_inner .content_bottom .swiper_wrap .swiper_inner .swiper-slide p {padding:4% 3%; background-color:#80a8c3; color:#fff; border-bottom-left-radius:10px; border-bottom-right-radius:10px; font-size:1.2rem; height:85px; display:flex; align-items:center; word-break:keep-all;}
.content_wrap .content_inner .content_bottom .swiper_wrap .swiper_inner .swiper-button-prev,
.content_wrap .content_inner .content_bottom .swiper_wrap .swiper_inner .swiper-button-next {width:40px; height:40px; left:-50px; background:url(../images/swiper_prev_btn.png) center center no-repeat; background-size:100%; transition:all .5s; border-radius:100%; background-color:rgba(0,0,0,.2);}
.content_wrap .content_inner .content_bottom .swiper_wrap .swiper_inner .swiper-button-prev:hover,
.content_wrap .content_inner .content_bottom .swiper_wrap .swiper_inner .swiper-button-next:hover {background-color:rgba(0,0,0,.6); }
.content_wrap .content_inner .content_bottom .swiper_wrap .swiper_inner .swiper-button-prev:before,
.content_wrap .content_inner .content_bottom .swiper_wrap .swiper_inner .swiper-button-next:before {content:'';}
.content_wrap .content_inner .content_bottom .swiper_wrap .swiper_inner .swiper-button-next {left:auto; right:-50px; background:url(../images/swiper_next_btn.png) center center no-repeat; background-size:100%; background-color:rgba(0,0,0,.2);}

/* content_bottom2 */
.content_wrap .content_inner .content_bottom.content_NB {
    height:calc(100% - 600px);
}
.content_bottom2 {
    border-top:solid 1px #e9e7e7;
    width:80%;
    margin:0 auto;
    padding:.5% 0;
    margin-top:3%;
}
.content_bottom2 .plus_tit {
    display:flex;
    justify-content:center;
    align-items:center;
    width:20%;
    background-color:#fff;
    border-radius:4rem;
    font-size:1.5rem;
    font-weight:600;
    margin-top:2%;
    padding:.3% 0;
    position:relative;
}
.content_bottom2 .plus_tit i {
    display:flex;
    justify-content:center;
    align-items:center;
    width:2.3vw;
    height:2.3vw;
    border-radius:50%;
    background-color:#2FC8BF;
    position:absolute;
    top:50%;
    left:-3%;
    transform:translateY(-50%);
}
.content_bottom2 .plus_tit i img {
    width:50%;
}
.content_bottom2 ul {
    display:flex;
    justify-content:space-between;
    align-items:center;
    width:100%;
    margin-top:3%;
}
.content_bottom2 ul li {
    width:30%;
}
.content_bottom2 ul li a {
    display:flex;
    flex-direction:column;
    width:100%;
    height:100%;
}
.content_bottom2 ul li a img {
    width:100%;
    box-shadow:0px 4px 4px rgba(0,0,0,.25);
    border-radius:1.2rem;
}
.content_bottom2 ul li a p {
    font-size:1.3rem;
    font-weight:600;
    width:100%;
    color:#272727;
    background-color:#B3F1ED;
    text-align:center;
    padding:3% 0%;
    border-radius:2rem;
}


/* content_list */
.content_top .main_content_tit {font-size:1.3rem; font-weight:600; border-bottom:solid 1px #333; padding-bottom:1%;}
.list_wrap {height:calc(100% - 90px); padding:2% 0;}
.list_inner {width:85%; height:100%; margin:0 auto; display:flex; flex-wrap:wrap; overflow-y:auto; padding:1%;}
.list_box {width:30%; height:36%; border-radius:10px; box-shadow:3px 3px 15px rgb(0 0 0 / 20%); margin:0 3% 0% 0; overflow:hidden;}
.list_box:nth-child(3n) {margin-right:0;}
.list_box a {display:flex; flex-direction:column; height:70%; justify-content:center; align-items:center;}
.list_box a img {width:100%;}
.list_box p {padding:0 4%; height:31%; display:flex; align-items:center; background-color:#80a8c3; color:#fff; border-bottom-left-radius:7px; border-bottom-right-radius:7px; word-break:keep-all;}

/* main page */
/* .content_wrap .content_inner02 {background-color:#fff;} */
.content_wrap .content_inner02:after {content:''; position:absolute; bottom:0; left:0; width:100%; height:95%;  background-color:#fff; z-index:-1; border-bottom-left-radius:10px; border-bottom-right-radius:10px;}
#header {height:11%; background-color:#f7f9f6; border-top-left-radius:10px; border-top-right-radius:10px;}
#header .header_inner {width:90%; margin:0 auto; display:flex; position:relative; height:100%; flex-direction:row-reverse; align-items:center;}
#header .header_inner div {width:15%;}
#header .header_inner .user_box {border-radius:10px; padding:5px 7px; width:8%; display:flex; align-items:center; position:relative; z-index:99;}
#header .header_inner .user_box>a {display:flex; justify-content:flex-end; align-items:center; width:90%;}
#header .header_inner .user_box img {width:60%; height:60%;}
#header .header_inner .user_box .user_menu {position:absolute; top:50%; right:0; width:160%; height:auto; box-shadow:0 0 26px rgba(0,0,0,.2); z-index:-1; border-radius:10px; overflow:hidden; background-color:rgba(255,255,255,.85); display:none;}
/* #header .header_inner .user_box .user_menu.on {width:10vw; height:23vh; transition:height .3s;} */

#header .header_inner .user_box .user_menu .user_info {width:100%; height:auto; background-color:#6ab848; padding:10%; border-radius:10px;}
#header .header_inner .user_box .user_menu .user_info p {color:#fff;}
#header .header_inner .user_box .user_menu .user_info .user_name {letter-spacing:.04rem; display:flex; align-items:center; width:100%;}
#header .header_inner .user_box .user_menu .user_info .user_name img {width:4%; margin-left:2%;}
#header .header_inner .user_box .user_menu ul {padding:10%;}
#header .header_inner .user_box .user_menu ul li {padding:10% 0;}
#header .header_inner .user_box .user_menu ul li.boundary {border-top:solid 2px #6ab848;}
#header .header_inner .user_box .user_menu ul li a {color:#000; display:block; transition:all .3s;}
#header .header_inner .user_box .user_menu ul li a:hover {color:#6ab848;}
/* user_box2 */
.user_box2 {border-radius:10px; padding:5px 7px; width:8%; display:flex; align-items:center; position:absolute; z-index:99; top:2%; right:1%;}
.login_form .user_box2 {width:12%;}
.user_box2>a {display:flex; justify-content:flex-end; align-items:center; width:90%;}
.user_box2 img {width:60%; height:60%;}
.user_box2 .user_menu {position:absolute; top:50%; right:0; width:160%; height:auto; box-shadow:0 0 26px rgba(0,0,0,.2); z-index:-1; border-radius:10px; overflow:hidden; background-color:rgba(255,255,255,.85); display:none;}
.user_box2 .user_menu .user_info {width:100%; height:auto; background-color:#6ab848; padding:10%; border-radius:10px;}
.user_box2 .user_menu .user_info p {color:#fff;}
.user_box2 .user_menu .user_info .user_name {letter-spacing:.04rem; display:flex; align-items:center; width:100%;}
.user_box2 .user_menu .user_info .user_name img {width:4%; margin-left:2%;}
.user_box2 .user_menu ul {padding:10%;}
.user_box2 .user_menu ul li {padding:3% 0;}
.user_box2 .user_menu ul li.boundary {border-top:solid 2px #6ab848;}
.user_box2 .user_menu ul li a {color:#000; display:block; transition:all .3s; text-decoration:none;}
.user_box2 .user_menu ul li a:hover {color:#6ab848;}
/* //user_box2 */
#header .header_inner .menu_wrap {width:77%; padding:1%;}
#header .header_inner .menu_wrap ul {display:flex; border-radius:40px;}
#header .header_inner .menu_wrap ul li {width:15%; text-align:center; margin-right:1%;}
#header .header_inner .menu_wrap ul li:last-child {margin-right:0;}
#header .header_inner .menu_wrap ul li a {display:flex; justify-content:center; align-items:center; padding:6% 2.5%;color:#000; font-size:1.2rem; transition:all .5s; position:relative;}
#header .header_inner .menu_wrap ul li a:hover {background-color:#ededed; border-radius:40px; color:#6ab848;}
#header .header_inner .menu_wrap ul li a.on {color:#6ab848; border-radius:40px;}
#header .header_inner .menu_wrap ul li a span {display:flex; justify-content:center; align-items:center; width:15px; height:15px; font-size:.9rem; color:#fff; border-radius:50%; margin-right:5px; background:url(../images/complete_gray.png) no-repeat; background-size:100%;}
#header .header_inner .menu_wrap ul li a.clear span {background:url(../images/complete_green.png) no-repeat; background-size:100%;}
#header .header_inner .logo {text-align: center;}
#header .header_inner .logo img {width:66%;}
#main {margin:1% 0 0; height:88.3%;}
#main.main_notice {height:calc(100% - 169px);}
#main .content_tit {width:90%; margin:0 auto; height:6%; display:flex; justify-content:space-between; position:relative;}
#main .content_tit .tit_left {width:70%; position:relative; display:flex;}
#main .content_tit .tit_left .progress_wrap {position:relative; width:21%; height:100%; display:none;}
#main .content_tit .tit_left .progress {display:flex; background-color:#6ab848; padding:0 9%; align-items:center; position:relative; height:100%;}
#main .content_tit .tit_left .progress h4 {font-size:1.3rem; color:#fff;}
#main .content_tit .tit_left .progress img {width:8%; height:22%; margin-left:5%; transition:all .5s;}
#main .content_tit .content_list {width:70%; padding-left:3%; display:flex; align-items:center; height:100%; position:relative;}
#main .content_tit .content_list.step_nav {width:20%; padding-left:1%;}
#main .content_tit .content_list p {font-size:1.2rem; font-weight:500; color:#000; vertical-align:middle; width:90%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
#main .content_tit .content_list a {display:flex; justify-content:space-between; align-items:center; width:100%; height:auto; cursor:inherit;}
#main .content_tit .content_list a img {width:2.7%; margin-right:3%; transition:all .5s; display:none;}
#main .content_tit .nav_top {background-color:#fff; height:300px; border:solid 2px #6ab848; border-top:solid 1px #6ab848; display:none; width:400px; border-bottom-right-radius:10px; position:absolute; top:100%; left:0; z-index:9; overflow-y:auto;}

/* content_list header */
#main .content_tit .menu_wrap {width:90%; background-color:#fff; border-left:solid 1px #6ab848; border-top-right-radius:10px; border-bottom-right-radius:10px;}
#main .content_tit .menu_wrap ul {display:flex; border-radius:40px; height:100%;}
#main .content_tit .menu_wrap ul li {width:15%; text-align:center; margin-right:1%;}
#main .content_tit .menu_wrap ul li:last-child {margin-right:0;}
#main .content_tit .menu_wrap ul li a {display:flex; justify-content:center; align-items:center; padding:6% 2.5%;color:#000; font-size:1.2rem; transition:all .5s; position:relative; height:100%;}
#main .content_tit .menu_wrap ul li a:hover {background-color:#ededed; border-radius:40px; color:#6ab848;}
#main .content_tit .menu_wrap ul li a.on {color:#6ab848; border-radius:40px;}
#main .content_tit .menu_wrap ul li a span {display:flex; justify-content:center; align-items:center; width:15px; height:15px; font-size:.9rem; color:#fff; border-radius:50%; margin-right:5px; background:url(../images/complete_gray.png) no-repeat; background-size:100%;}
#main .content_tit .menu_wrap ul li a.clear span {background:url(../images/complete_green.png) no-repeat; background-size:100%;}
#main.step_main .content_tit .nav_bottom {left:0 !important; width:140% !important;}

#main .content_tit .nav_top .nav_tit {padding:3% 6%; display:flex; justify-content:space-around; align-items:center;}
#main .content_tit .nav_top .nav_tit h5 {font-size:1.1rem; font-weight:600;}
#main .content_tit .nav_top .nav_tit img {width:20%;}
#main .content_tit .nav_top ul {padding:0 6%;}
#main .content_tit .nav_top ul li {display:flex; align-items:center; justify-content:space-between; padding-bottom:2.5%;}
#main .content_tit .nav_top ul li a {display:block; width:22%}
#main .content_tit .nav_top ul li a p {width:100%; color:#000;}
#main .content_tit .nav_top ul li img {height:1px;}
#main .content_tit .nav_top ul li p {width:22%; font-size:0.9rem;}
#main .content_tit .nav_top ul li p.work_complete {color:#ffb0b0;}
#main .content_tit .nav_top ul li p.working {color:#4578c4;}
#main .content_tit .nav_bottom {border:solid 2px #6ab848; border-top:solid 1px #6ab848; background-color:#fff; position:absolute; top:100%; right:-2px; width:100%; display:none; border-bottom-left-radius:10px; z-index:9;}
#main .content_tit .nav_bottom .bottom_tit {border-bottom:solid 1px #6ab848; padding:2% 6%; background-color:#6ab848; display:flex; justify-content:space-between;}
#main .content_tit .nav_bottom .bottom_tit h5 {font-weight:600; color:#fff;}
#main .content_tit .nav_bottom .bottom_tit a {background-color:#fff; border-radius:100%; width:20px; height:20px; display:flex; justify-content:center; align-items:center;}
#main .content_tit .nav_bottom .bottom_tit a img {width:60%;}
#main .content_tit .nav_bottom .bottom_list {border-bottom-left-radius:14px;}
#main .content_tit .nav_bottom ul {padding-top:2%; height:330px; overflow-y:auto;}
#main .content_tit .nav_bottom ul::-webkit-scrollbar {width:7px;}
#main .content_tit .nav_bottom ul::-webkit-scrollbar-thumb {background-color:#dcdbdb; border-radius:10px;}
#main .content_tit .nav_bottom ul li {padding:3% 0; margin-bottom:2%; width:85%;}
#main .content_tit .nav_bottom ul li a {display:block; padding-left:5%; color:#000; font-size:0.9rem;}
#main .content_tit .nav_bottom ul li a span {color:#95DAFF; font-weight:600; margin-right:5px;}
#main .content_tit .nav_bottom ul li.on {color:#6ab848; border-top-right-radius:14px; border-bottom-right-radius:14px;}
#main .content_tit .nav_bottom ul li.on a {color:#6ab848;}
#main .content_tit .nav_bottom ul li:hover {border-top-right-radius:14px; border-bottom-right-radius:14px;}
#main .content_tit .nav_bottom ul li:hover a {color:#6ab848;}

/* nav_bottom top_btn */
#main .content_tit .nav_bottom a.top_btn {position:absolute; bottom:2%; right:2%; width:30px; height:30px; display:none; justify-content:center; align-items:center; background-color:#6ab848; border-radius:50%;}
#main .content_tit .content_list .nav_bottom a.top_btn img {transform:rotate(-90deg); transition:all .3s; width:auto; margin-right:0;}
#main .content_tit .nav_bottom a.top_btn img.active {transform:rotate(90deg);}

/* /nav_bottom btn */
#main .content_tit .tit_right {width:10%; height:100%;}
#main .content_tit .tit_right a {display:flex; justify-content:right; align-items:center; width:100%; height:100%;}
#main .content_tit .tit_right .menual_btn {display:none;}
#main .content_tit .tit_right a img {width:23%; margin-right:2%;}
#main .content_tit .tit_right a p {display:inline-block; color:#6ab848; font-weight:600;}
#main .content_tit .tit_right .t_box {justify-content:flex-end;}
#main .main_inner {width:90%; margin:0 auto; height:91%;  position:relative; border:solid 2px #6ab848;}
#main .main_inner.main_inner02 {height:97%;}
#main .main_inner .main_top {background-color:#6ab848; height:7%; display:flex; justify-content:right; display:none;}

#main .main_inner .main_top ul {width:55%; height:100%; display:flex;}
#main .main_inner .main_top ul li {width:25%; text-align:center; position:relative; display:flex; justify-content:center; align-items:center;}
#main .main_inner .main_top ul li:after {content:''; position:absolute; top:50%; right:0; width:1px; height:70%; background-color:#fff; transform:translateY(-50%);}
#main .main_inner .main_top ul li:last-child:after {display:none;}
#main .main_inner .main_top ul li a {display:block; padding:5% 2%; color:#fff; font-size:1.1rem;}
#main .main_inner .main_content {position:relative; height:100%;}
/* think slide custom */
#main .main_inner .main_content.think_slide {display:flex; flex-direction:column; justify-content:space-between; align-items:center;}
#main .main_inner .main_content.think_slide .stage_content {height:85%;}
#main .main_inner .main_content.think_slide .stage_content img {width:69%;}

#main .main_inner .main_content .think_sub_tit {width:70%; height:auto; padding:1.5% 2%; margin:1% auto 0; color:#000; background-color:#e8f9de; display:flex; justify-content:center; align-items:center; font-size:1.1rem; border-radius:50px; text-align:center; font-weight:600;}
#main .main_inner .main_content .stage_content {display:flex; justify-content:center; align-items:center; height:100%; width:100%;}
#main .main_inner .main_content .stage_content img {width:80%; margin:0 auto;  height:auto;}
#main .main_inner .main_content .stage_content iframe {width:100%; height:100%;}
#main .main_inner .main_content .stage_content .swiper_wrap {width:100%; height:100%;}
#main .main_inner .main_content .stage_content .swiper_wrap .swiper_inner {width:100%; height:100%;}
#main .main_inner .main_content .stage_content .swiper_wrap .swiper_inner .think_swiper {width:100%; height:100%; display:flex; align-items:center; margin-bottom:0; overflow:hidden;}
#main .main_inner .main_content .stage_content .swiper_wrap .swiper_inner .think_swiper .swiper-slide {display:flex; align-items:center;}
#main .main_inner .main_content .stage_content .swiper_wrap .swiper_inner .think_swiper .swiper-button-prev,
#main .main_inner .main_content .stage_content .swiper_wrap .swiper_inner .think_swiper .swiper-button-next {width:40px; height:40px; left:-55px; background:url(../images/swiper_prev_btn.png) center center no-repeat; background-size:100%; transition:all .5s; border-radius:100%; z-index:9; background-color:#6ab848;}
#main .main_inner .main_content .stage_content .swiper_wrap .swiper_inner .think_swiper .swiper-button-prev:hover,
#main .main_inner .main_content .stage_content .swiper_wrap .swiper_inner .think_swiper .swiper-button-next:hover {}
#main .main_inner .main_content .stage_content .swiper_wrap .swiper_inner .think_swiper .swiper-button-prev:before,
#main .main_inner .main_content .stage_content .swiper_wrap .swiper_inner .think_swiper .swiper-button-next:before {content:'';}
#main .main_inner .main_content .stage_content .swiper_wrap .swiper_inner .think_swiper .swiper-button-next {left:auto; right:-55px; background:url(../images/swiper_next_btn.png) center center no-repeat; background-size:100%; background-color:#6ab848;}
#main .main_inner .main_content .stage_content .swiper_wrap .swiper-pagination {width:15px; left:auto; right:-15px; display:none;}
#main .main_inner .main_content .stage_content .swiper_wrap .swiper-pagination .swiper-pagination-bullet {transition:all .5s;}
#main .main_inner .main_content .stage_content .swiper_wrap .swiper-pagination .swiper-pagination-bullet-active {background-color:#6ab848; width:12px; height:12px;}

#main .content_tit .content_list a img.on,
#main .content_tit .tit_left .progress img.on {transform:rotate(180deg);}
.chapter_btn {position:absolute; top:-1px; left:-100px; width:100px; height:100px; background:url(../images/char_bg.png) no-repeat; background-size:100%;}
.chapter_btn a {display:flex; justify-content:flex-end; align-items:center; font-size:.9rem; color:#fff; width:100%; height:100%;}
.chapter_btn a img {margin:-3px 4px 0 0; width:88%; transition:all .3s;}
.chapter_btn a img.on {transform:rotateY(360deg);}
.chapter_wrap {width:100%; height:0%; overflow:hidden; position:absolute; top:0; left:0; transition:height .5s; z-index:11;}
.chapter_wrap.on {height:100%;}
.chapter_wrap .chapter_inner {width:100%; height:100%; background-color:rgba(255,255,255,.92); padding:3%; display:flex; align-items:center; flex-wrap:wrap; overflow-y:auto; overflow-x:hidden; align-content:flex-start;}
.chapter_wrap .chapter_inner::-webkit-scrollbar {width:7px; background-color:#d9d9d9; height:12px;}
.chapter_wrap .chapter_inner::-webkit-scrollbar-thumb {background-color:#767676; border-radius:5px;}
.chapter_wrap .chapter_inner .list_box {
    margin-bottom:3%;
}
.chapter_inner .list_box {width:22.75%; height:31.5%; position:relative; cursor:pointer;}
.chapter_inner.chapter_inner2 .list_box {height:26.8%;}
.chapter_inner .list_box.complete:after {content:''; width:100%; height:100%;position:absolute; top:0; left:0; z-index:99; border-radius:10px;}
.chapter_inner .list_box:nth-child(3n) {margin-right:3%;}
.chapter_inner .list_box:nth-child(4n) {margin-right:0;}
.chapter_inner .list_box a {background-color:#fff; border-top-left-radius:7px; border-top-right-radius:7px;}
.chapter_inner .list_box .complete_img {position:absolute; bottom:11%; right:-5%; width:50%; display:none;}
.chapter_inner .list_box.complete .complete_img {display:block; z-index:999;}
/* chapter_wrap animation */
@keyframes fadeInOut {
    0% {opacity:0; animation-timing-function:ease-in; transform:perspective(400px) rotateX(90deg);}
    40% {animation-timing-function:ease-in; transform:perspective(400px) rotateX(-20deg);}
    60% {transform:perspective(400px) rotateX(10deg);}
    80% {transform:perspective(400px) rotateX(-5deg);}
    100% {transform:perspective(400px);}
}
@keyframes fadeOut {
    0% {transform:perspective(400px);}
    30% {opacity:1; transform:perspective(400px) rotateX(-20deg);}
    100% {opacity:0; transform:perspective(400px) rotateX(90deg);}
}

/* notification page */
#main .diary_list,
#main .reference_list {display:flex; justify-content:center; align-items:center; padding:4% 4%; width:100%; height:100%;}
#main .diary_list ul,
#main .reference_list ul {width:100%; height:100%; overflow-y:auto;}
#main .diary_list ul li,
#main .reference_list ul li {padding:1% 1% 1% 0; border-bottom:solid 1px #c4c4c4; display:flex; justify-content:space-between; align-items:center; cursor:pointer;}
#main .diary_list ul li a,
#main .reference_list ul li a {width:80%;}
#main .diary_list ul li a .diary_txt,
#main .reference_list ul li a .diary_txt {color:#000;}
#main .diary_list ul li a img,
#main .reference_list ul li a img {width:4%; vertical-align:middle; margin-left:.5%;}

/* notification_inner page */
#main .notification_content {padding:2% 4%; height:100%;}
#main .notification_top,
#main .reference_top {padding:0 0 1.5%; border-bottom:solid 1px #c4c4c4; display:flex; justify-content:space-between;}
#main .notification_top h4,
#main .reference_top h4 {font-size:1.2rem;}
#main .notification_top h4 img {width:15%; vertical-align:middle; margin-left:2%;}
#main .notification_top p,
#main .reference_top p {font-size:0.9rem; color:#666; position:relative; width:10%; text-align:right;}
#main .notification_top p span,
#main .reference_top p span {position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); width:100%;}
#main .notification_body {display:flex; height:86%; border:solid 1px #c4c4c4; margin-top:2%;}
#main .notification_body .content_left {width:100%; display:flex; flex-direction:column; justify-content:space-between;}
#main .notification_body .content_left p {padding:3%;}
#main .notification_body .content_left .file_wrap {height:15%;}
#main .notification_body .content_left .file_wrap .reference_dl {margin-top:0; height:100%;}
#main .notification_body .content_right {border-right:none;}
#main .messenger {height:100%;}
#main .messenger .messenger_top,
#main .reference_info {display:flex; background-color:#EFEFEF; height:11%;}
#main .messenger .messenger_top .profile_img,
#main .reference_info .profile_img {width:11%; display:flex; justify-content:center; align-items:center;}
#main .messenger .messenger_top .profile_img a,
#main .reference_info .profile_img a { display:block;}
#main .messenger .messenger_top .profile_img a i,
#main .reference_info .profile_img a i {width:45px; height:45px; border-radius:50%; background-color:#fff; display:block;}
#main .messenger .messenger_top .profile_name,
#main .reference_info .profile_name {width:16%; display:flex; flex-direction:column; justify-content:center; align-items:center;}
#main .messenger .messenger_top .profile_name p,
#main .reference_info .profile_name p {font-size:15px; font-weight:500; padding:6% 1% 0;}
#main .messenger .messenger_top .profile_name .writing_date,
#main .reference_info .profile_name .writing_date {font-size:10px; color:#666; padding:0 1%;}
#main .messenger .messenger_top .profile_like,
#main .reference_info .profile_like {display:flex; justify-content:center; align-items: center; width:17%;}
#main .messenger .messenger_top .profile_like img,
#main .reference_info .profile_like img {width:15%; margin-right:5%;}
#main .messenger .messenger_top .profile_percent,
#main .reference_info .profile_percent {width:56%; padding:2% 1%; display:flex; justify-content:center; align-items:center;}
#main .messenger .messenger_top .profile_percent p,
#main .reference_info .profile_percent p {background-color:#fff; border-radius:40px; position:relative; padding:2% 7%; color:#fff; width:100%; z-index:1; height:100%; font-size:0.8rem; display:flex; align-items:center;}
#main .messenger .messenger_top .profile_percent p:before,
#main .reference_info .profile_percent p:before {content:''; position:absolute; top:0; left:0; background-color:#6ab848; width:68%; height:100%; border-radius:40px; z-index:-1;}
#main .messenger .messenger_middle {height:78%; background-color:#fff; overflow-y:auto; padding:5%;}
#main .messenger .messenger_middle .talk_box {height:100%; padding:2% 0;}
#main .messenger .messenger_middle .talk_box p {padding:0;}
#main .messenger .messenger_middle .talk_box .student_box {text-align:right; margin-bottom:2%;}
/* #main .messenger .messenger_middle .talk_box .student_box img {width:80%;} */
#main .messenger .messenger_middle .talk_box .student_box span,
#main .messenger .messenger_middle .talk_box .teacher_box span {font-size:10px;}
#main .messenger .messenger_middle .talk_box .student_box p {display:inline-block; max-width:80%; background-color:#fff; border:solid 1px #6ab848; padding:2% 3%; margin-left:2%; vertical-align:bottom; border-radius:10px; border-top-right-radius:0;}
#main .messenger .messenger_middle .talk_box .teacher_box {text-align:left; margin-bottom:2%;}
#main .messenger .messenger_middle .talk_box .teacher_box p {display:inline-block; max-width:80%; margin-right:2%; background-color:#6ab848; color:#fff; border-radius:10px; border-top-left-radius:0; padding:2% 3%; vertical-align:bottom;}
/* #main .messenger .messenger_middle .talk_box .box_img02 img {width:50%;} */
#main .messenger .messenger_middle::-webkit-scrollbar {background-color:rgba(255,255,255,.7); width:12px;}
#main .messenger .messenger_middle::-webkit-scrollbar-thumb {background-color:#6ab848; border-radius:10px;}
#main .messenger .messenger_bottom {height:11%; background-color:#6ab848; display:flex; justify-content: center; padding:1.5% 1%;}
#main .messenger .messenger_bottom a {display:flex; width:9%; justify-content:center; align-items:center;}
#main .messenger .messenger_bottom a img {width:70%;}
#main .messenger .messenger_bottom input {width:82%; border:none; border-radius:40px; padding:0 3%;}

/* reference_inner page */
#main h4.reference_tit img {width:10%; vertical-align:middle;}
#main .reference_body {padding:2% 0; height:91%;}
#main .reference_txt {height:70%; overflow-y:auto; overflow-x:hidden;}
#main .reference_txt p {height:100%;}
#main .reference_dl {height:20%; margin-top:2%; border:solid 1px #b1b1b1; display:flex; padding:1% 2%;}
#main .reference_dl .content_download {display:flex; width:100%; flex-wrap:nowrap; overflow-x:auto;}
#main .reference_dl .content_download a {display:flex; margin-right:3%; width:auto; flex:0 0 auto; align-items:center;}
#main .reference_dl .content_download a img {margin-right:7px; vertical-align:middle; width:20px;}
#main .reference_dl .content_download a p {max-width:80%; vertical-align:middle; white-space:nowrap; margin-right:1%; padding:1% 0;}

/* evaluation page */
#main .eval_top {display:flex; height:8%; border-bottom:solid 1px #6ab848;}
#main .eval_top h4 {width:calc(100% - 370px); font-size:1.2rem; display:flex; align-items:center; position:relative;}
#main .eval_top h4:after {content:''; position:absolute; top:0; left:0; width:21%; height:100%; background-color:#6ab848;}
#main .eval_top h4 span {display:inline-block; width:20%; text-align:center; color:#fff;  margin-right:3%; position:relative; z-index:1;}
#main .eval_top p {background-color:#6ab848; color:#fff; width:370px; text-align:center; display:flex; align-items:center; justify-content:center; font-size:1.2rem;}
#main .eval_body {display:flex; height:92%;}
#main .eval_body .eval_left {padding:5% 2%; width:calc(100% - 370px); height:100%; overflow-y:auto;}
#main .eval_body .eval_left .question {margin-bottom:9%;}
#main .eval_body .eval_left .question:last-child {margin-bottom:0;}
#main .eval_body .eval_left .question_select {display:flex; justify-content:space-between; padding:3% 5%;}
#main .eval_body .eval_left .question_select .num_icon {width:20px; vertical-align:sub; margin-right:5px;}
#main .eval_body .eval_right {background-color:#f0f4f5; width:370px;}
#main .eval_body .eval_right .answer {padding:16% 0 16% 6%; height:80%; display:flex; flex-direction:column; overflow-y:auto;}
#main .eval_body .eval_right .answer .answer_box {margin-bottom:13%;}
#main .eval_body .eval_right .answer .answer_box:last-child {margin-bottom:0;}
#main .eval_body .eval_right .answer .answer_box p {display:inline-block; font-weight:600; }
#main .eval_body .eval_right .answer .answer_box img {width:24px;}
#main .eval_body .eval_right .answer .answer label {font-size:1.1rem;}

/* input radio custom */
#main .eval_body .eval_right input {width:10px;}
#main .eval_body .eval_right input[type="radio"] {display:none;}
#main .eval_body .eval_right input[type="radio"] + label {position:relative; margin-left:25px;}
#main .eval_body .eval_right input[type="radio"] + label:after {content:''; position:absolute; top:-13px; left:6px; width:0; height:24px; background:url(../images/answer_check2.svg) no-repeat; transition:width 0.3s;}
#main .eval_body .eval_right input[type="radio"]:checked + label:after {width:35px;}
#main .eval_body .eval_right label {cursor: pointer;}
/* //input radio custom */

/* input checkbox custom */
#main .eval_body .eval_right input {width:10px;}
#main .eval_body .eval_right input[type="checkbox"] {display:none;}
#main .eval_body .eval_right input[type="checkbox"] + label {position:relative;}
#main .eval_body .eval_right input[type="checkbox"] + label:after {content:''; position:absolute; top:-13px; left:27px; width:35px; height:0px; background:url(../images/answer_check2.svg) no-repeat; transition: height 0.3s;}
#main .eval_body .eval_right input[type="checkbox"]:checked + label:after {height:24px;}
#main .eval_body .eval_right input[type="checkbox"] + label span {content:''; display:inline-block;  width:23px; height:23px; background:url(../images/checknum1.png) left top no-repeat; cursor: pointer; margin-left:20px; margin-right:10px; vertical-align:-6px; margin-top:5px; position:relative; background-size:23px 23px;}
#main .eval_body .eval_right input[type="checkbox"] + label:before {display:none;}
/* //input checkbox custom */
/* input text custom */
#main .eval_body .eval_right input[type="text"] {width:50%; vertical-align:baseline; margin-left:25px; border:solid 2px #6ab848; border-radius:4px; padding-left:2%; font-size:1.1rem;}

/* //input text custom */

#main .eval_body .eval_right .sub_btn {text-align:center; margin-top:5%;}
#main .eval_body .eval_right .sub_btn button {width:50%; padding:2%; color:#fff; border:none; background-color:#6ab848; border-radius:10px;}

/* exam page */
#exam_complete {
    width:100%;
    height:100%;
    display:flex;
    justify-content:center;
    align-items:center;
    flex-direction:column;
}
#exam_complete img {
    width:500px;
}
#exam_complete p {
    margin-top:2%;
    font-size:1.1rem;
}
#exam_complete .score {
    font-size:2.4rem;
    font-weight:500;
    margin-top:0;
    color:#6ab847;
}
#exam_complete .re_exam {
    margin-top:2%;
    padding:1%;
    width:15%;
    text-align:center;
    background-color:#6ab847;
    color:#fff;
    border-radius:30px;
    border:none;
}


/* day_check page */
#main .day_body {height:92%; padding:4%; overflow-y:auto;}
#main .day_body .day_txt {margin-top:3%;}
#main .day_body .day_txt:first-child {margin-top:0;}
#main .day_body .radio_box table {margin-top:2%;}
#main .day_body .radio_box table tr:first-child {background-color:#fcffef; border-top:solid 4px #6ab848;}
#main .day_body .radio_box table tr td {border:none; border-right:solid 1px #c4c4c4; border-bottom:solid 1px #c4c4c4;}
#main .day_body .radio_box table tr td:last-child {border-right:none;}
#main .day_body .radio_box table tr td input {width:40%; height:40%; cursor:pointer; margin:0 auto;}
#main .day_body .radio_box table tr td input + label {border:solid 1px #bbb; vertical-align:middle;}
#main .day_body .day_submit {text-align:center; margin-top:3%;}
#main .day_body .day_submit button {width:30%; padding:1%; border:none; color:#fff; background-color:transparent; border-radius:10px;}
.dimm {position:fixed; width:100%; height:100%; top:50%; left:50%; transform:translate(-50%,-50%); background-color:rgba(0,0,0,.7); display:none;}
.dimm_complete {position:fixed; width:100%; height:100%; top:50%; left:50%; transform:translate(-50%,-50%); background-color:rgba(0,0,0,.4); display:none;}
.day_complete,
.notice_popup {position:absolute; top:50%; left:50%; width:440px; height:330px; transform:translate(-50%,-50%); border-radius:8px; background-color:#fff; display:none; text-align:center; box-shadow:0px -2px 25px -2px rgba(0,0,0,.5);}
.day_complete img,
.notice_popup img {width:70%; margin-top:-30%;}
.day_complete .txt_center,
.notice_popup .txt_center {text-align:center; font-size:1.5rem; font-weight:700; margin-top:1%;}
.day_complete a,
.notice_popup a {display:inline-block; width:40%; margin:23px auto 15px;}
.day_complete a.next_chap p {background-color:#FB706F}
.day_complete p:last-child,
.notice_popup p:last-child { background-color:#6ab848; color:#fff; width:100%; text-align:center; padding:2% 1%; border-radius:10px;}

.day_complete_02 {position:absolute; top:50%; left:50%; width:20%; height:45%; transform:translate(-50%,-50%); background-color:#fff; text-align:right; border-top:solid 10px #6ab848; animation: rotate-vert-center .5s cubic-bezier(0.455, 0.03, 0.515, 0.955) both; border-radius: 7px; display:none;}
.day_complete_02 .cancle_btn {display:inline-block; width:20%; margin:4% 4% 1%;}
.day_complete_02 .cancle_btn img {width:22%;}
.day_complete_02 div {text-align:center;}
.day_complete_02 p {text-align:center; margin-top:7%; font-weight:600;}
.day_complete_02 .head_txt {height:25%; background:url(../images/popup_img07.png) center no-repeat; background-size:80%;}
.day_complete_02 .head_txt p {font-size:1.3rem; font-weight:600; padding:5%; color:#666; margin-top:1%;}
.day_complete_02 .body_img {height:33%; display:flex; justify-content:center; align-items:center; position:relative;}
.day_complete_02 .body_img img {width:50%;}
.day_complete_02 .body_img .left_img {position:absolute; top:25%; left:20%; width:8%;}
.day_complete_02 .body_img .right_img {position:absolute; bottom:10%; right:15%; width:14%;}

@keyframes rotate-vert-center {
    0% {transform: translate(-50%,-50%) rotateY(0);}
    50% {}
    100% {transform: translate(-50%,-50%) rotateY(360deg);}
}
.water_drop {width:16px; height:16px; display:inline-block; border-radius:0 100% 36% 64% / 0 62% 37% 100%; transform:rotate(45deg); background-color:#BFE6FA;}

.day_complete_03 {position:absolute; top:50%; left:50%; width:28%; height:30%; transform:translate(-50%,-50%); background-color:#fff; border-radius: 7px; display:block; text-align:right; border:solid 1px #FF5454; overflow:hidden; display:none;}
.day_complete_03 .cancle_btn {width:18%; position:absolute; top:5%; right:3%;}
.day_complete_03 .cancle_btn img {width:20%;}
.day_complete_03 div {text-align:center;}
.day_complete_03 .head_txt {height:25%; background-size:80%; margin-top:7%}
.day_complete_03 .head_txt p {font-size:1.3rem; font-weight:600; padding:0%; color:#666; margin-top:1%;}
.day_complete_03 .body_img {height:33%; display:flex; justify-content:center; align-items:center; position:relative; background:url(../images/bg_circle.png) 52% center no-repeat; background-size:16%;}
.day_complete_03 .body_img img {width:15%;}
.day_complete_03 .bottom_btn {position:absolute; bottom:0; left:0; width:100%; height:13%; background-color:#FF5454; z-index:5;}
.day_complete_03 .bottom_btn a {display:flex; width:100%; justify-content:center; align-items:center; height:100%; color:#fff;}
.day_complete_03 .water_drop {position:absolute; top:2%; left:22%; animation:waterDrop 3s infinite; opacity: 0; z-index:-1;}
.day_complete_03 .water_drop02 {position:absolute; top: 1%; left:50%; animation-delay:1s;}
.day_complete_03 .water_drop03 {position:absolute; top:3%; left:90%; animation-delay:2s;}
.day_complete_03 .water_drop04 {position:absolute; top:1%; left:70%; animation-delay:4s;}
.day_complete_03 .water_drop05 {position:absolute; top:5%; left:20%; animation-delay:5s;}
.day_complete_03 .water_drop06 {position:absolute; top:5%; left:10%; animation-delay:1s;}
.day_complete_03 .water_drop07 {position:absolute; top:5%; left:81%; animation-delay:3s;}

@keyframes waterDrop {
    0% {opacity:0;}
    50% {opacity:1;}
    100% {top:100%; opacity:.7;}
}

.popup {width:300px; height:300px; position:absolute; top:13%; left:13%; border-radius:10px; background-color:#fff; border:solid 2px #b01116; opacity:0; z-index:-9;}
.popup.on {animation:vanishIn 1s; z-index:9; opacity:1;}
.popup.order {animation:vanishOut 1s; opacity: 0;}
.popup a {display:flex; justify-content:center; align-items:center; flex-direction:column; height:100%; text-align:center;}
.popup img {width:74%;}
.popup p {font-size:1.3rem; font-weight:600; color:#b01116;}

.warning02 {top:35%; left:40%; width:250px; height:250px;}
.warning02 img {width:80%;}
.warning02 p {margin-top:10%;}
.warning03 {top:10%; left:10%;}
.warning04 {top:10%; right:10%; left:auto; width:300px; height:500px;}
.warning04 img {width:60%;}
.warning05 {top:15%; left:25%; background-color:#666; border:none;}
.warning06 {top:20%; left:30%; background-color:#666; border:none; border:solid 2px #000;}

@keyframes vanishIn {
    0% {opacity:0; transform-origin:50% 50%; transform:scale(2,2); filter:blur(90px);}
    100% {opacity:1; transform-origin:50% 50%; transform:scale(1,1); filter:blur(0px);}
}

@keyframes vanishOut {
    0% {opacity:1; transform-origin:50% 50%; transform:scale(1,1); filter:blur(0px);}
    100% {opacity:0; transform-origin:50% 50%; transform:scale(2,2); filter:blur(90px);}
}
.cheer_up {top:auto; bottom:5%; left:10%; width:300px; height:300px; padding-top:1%; border-color:#c3b11d;}
.cheer_up p {margin-top:5%; color:#94c62f;}
.cheer_up02 {left:40%; top:auto; bottom:5%;}
.cheer_up02 img {width:65%;}
.cheer_up02 p {margin-top:5%;}
.cheer_up03 {top:auto; bottom:7%; left:65%; width:250px; height:250px; border-radius:50%; border:solid 10px #4e88dd; }
.cheer_up03 img {width:35%; margin-top:-3%;}
.cheer_up03 p {font-size:1rem; color:#000; margin-top:6%; font-family:'yg-jalnan'; line-height:1;}
.cheer_up03 p:last-child {margin-top:0;}
.cheer_up04 {top:auto; bottom:40%; left:auto; right:5%; width:450px; height:200px; border-radius:0; border-color:#000;}
.cheer_up04 p {width:100%; text-align:left; color:#000; padding-left:15%; margin-bottom:3%;}
.cheer_up04 p:first-child {margin-bottom:0;}

.insect_repellent {top:10%; left:40%; width:450px; height:200px; border-radius:0; border-width:5px;}
.insect_repellent a {flex-direction:row; padding:3% 4%;}
.insect_repellent a img {width:20%;}
.insect_repellent a p {text-align:left; margin-left:7%; color:#000; font-family: 'yg-jalnan';}
.insect_repellent02 {top:15%; left:50%; width:450px; height:200px; border-radius:0; border:solid 4px #000;}
.insect_repellent02 a {flex-direction:row; padding:3% 4%;}
.insect_repellent02 a img {width:30%;}
.insect_repellent02 a p {color:#000; margin-left:7%; text-align:left;}
.insect_repellent03 {top:30%; left:50%; width:450px; height:200px; border-radius:0; border:none; background-color:#f5ede6;}
.insect_repellent03 a {flex-direction:row; padding:3% 4%;}
.insect_repellent03 a img {width:20%;}
.insect_repellent03 a p {text-align:left; margin-left:7%; color:#000; font-family: 'yg-jalnan';}

/* info_correction page */
#main .info_modify {display:flex; justify-content:center; align-items:center; width:100%; height:100%; position:relative;}
#main .info_modify .modify_inner {width:40%; height:80%; border:solid 1px #6ab848; border-radius:10px; padding:6% 3% 2%;}
#main .info_modify .modify_inner .modify_title {border-bottom:solid 1px #6ab847; padding-bottom:3%; text-align:center; font-size:1.2rem; font-weight:500;}
#main .info_modify .modify_inner table .modify_tr {width:30%;}
#main .info_modify .modify_inner table tr td {border:none;}
#main .info_modify .modify_inner table tr td:first-child {text-align:left;}
#main .info_modify .modify_inner table tr td input {width:100%; padding:2.5%; border:none; height:80%; background-color:transparent;}
/* #main .info_modify .modify_inner table tr.modify_positive {border-bottom:solid 1px #666;} */
#main .info_modify .modify_inner table tr.modify_positive td input {background-color:#f4f4f4;}
#main .info_modify .modify_submit {text-align:center; margin-top:5%;}
#main .info_modify .modify_submit button {text-align:center; width:100%; padding:2%; border:none; background-color:#6ab848; color:#fff; border-radius:7px;}

#main .info_modify .profile_modify {position:absolute; width:120px; height:120px; border-radius:100%; top:0; left:50%; transform:translateX(-50%);}
#main .info_modify .profile_modify img {width:100%;}
#main .info_modify .profile_modify .modify_btn {position:absolute; bottom:0; right:-10px; width:35%;}

/* step page */
.content_wrap .step_content {width:100%; height:100%; bottom:0;}
.content_wrap .step_content:after {height:100%; border-bottom-left-radius:0; border-bottom-right-radius:0;}
#main.step_main {margin-top:0; height:100%;}
#main.step_main .content_tit {width:100%; height:7%; background-color:#6ab848; padding:.5% 1%;}
#main.step_main .tit_left {width:85%;}
#main.step_main .tit_left .step_logo {display:block; width:7%;}
#main.step_main .tit_left .step_logo a {display:block; height:100%; position:relative;}
#main.step_main .tit_left .step_logo a img {width:80%; vertical-align:middle; position:absolute; top:50%; left:50%; transform:translate(-50%,-50%);}
#main.step_main .tit_left .step_tit {width:100%; display:flex; align-items:center;}
#main.step_main .content_tit .tit_left .progress {bordeR:solid 1px #fff; width:100%; height:100%; padding:0 6%; justify-content:space-between;}
#main.step_main .content_tit .tit_left .progress h4 {font-size:1.2rem;}
#main.step_main .content_tit .content_list {background-color:#fff; border:solid 1px #fff; border-top-left-radius:10px; border-bottom-left-radius:10px;}
#main.step_main .tit_right .homebtn {display:none;}
#main.step_main .content_tit .tit_right {width:15%;}
#main.step_main .content_tit .tit_right .t_box {display:flex; height:100%; justify-content:flex-end;}
#main.step_main .content_tit .tit_right .t_box a,
#main.step_main .content_tit .tit_right .t_box .download_list {width:33.333%; position:relative; display:flex; justify-content:center; align-items:center; color:#fff; font-weight:500; font-size:1.1rem;}
#main.step_main .content_tit .tit_right .t_box .download_list a {width:100%; text-align:center;}
#main.step_main .content_tit .tit_right .t_box .download_list span {display:block; width:100%; text-align:center;}
#main.step_main .content_tit .tit_right .t_box .download_list ul {position:absolute; top:100%; left:50%; height:0; overflow:hidden; transform:translateX(-50%); z-index:99; width:130px; background-color:#fff; box-shadow:0px 0px 7px rgba(0,0,0,.2); border-radius:5px; transition:all .3s;}
#main.step_main .content_tit .tit_right .t_box .download_list ul.on {height:108px;}
#main.step_main .content_tit .tit_right .t_box .download_list ul li {width:100%;}
#main.step_main .content_tit .tit_right .t_box .download_list ul li a {width:75%; color:#000; font-weight:400; padding:13px 0; margin:0 auto; word-break:keep-all;}
#main.step_main .content_tit .tit_right .t_box .download_list ul li a {border-bottom:solid 1px #d7d7d7; }
#main.step_main .content_tit .tit_right .t_box .download_list ul li p {color:#000;}
/* #main.step_main .content_tit .tit_right .t_box a:first-child {} */
/* #main.step_main .content_tit .tit_right .t_box a:nth-child(3) {justify-content:center; color:#fff; font-weight:500; font-size:1.1rem;} */
#main.step_main .content_tit .tit_right a p {color:#fff;}
#main.step_main .content_tit .nav_bottom {left:auto;}
.t_menu_wrap {position: absolute; top:8%; right:-100%; width:16%; height:60%; border:solid 1px #6ab848; background-color:rgba(255,255,255,.99); display:block; transition:all .5s; z-index:99; overflow-y:auto; border-bottom-left-radius:10px; box-shadow:0 0 26px rgb(0 0 0 / 20%);}
.t_menu_wrap::-webkit-scrollbar {width:8px; background-color:#d9d9d9;}
.t_menu_wrap::-webkit-scrollbar-thumb {background-color:#767676; border-radius:10px;}
.t_menu_wrap02 {top:7%;}
.t_menu_wrap.on {right:0;}
.t_menu_wrap .t_top {width:100%; margin:0 auto; padding:5%; position:relative; background-color:#6ab848;}
.t_menu_wrap .t_top p {color:#fff; display:flex; align-items:center; width:100%; letter-spacing:.03rem; font-size:1.1rem;}
.t_menu_wrap .t_top p img {width:4%; margin-left:2%;}
.t_menu_wrap .t_top .t_menu_close {position:absolute; top:25%; right:1%; width:10%;}
.t_menu_wrap .t_top .t_menu_close img {width:100%;}
.t_menu_wrap .t_middle {padding:5% 0 0 10%; }
.t_menu_wrap .t_middle ul {}
.t_menu_wrap .t_middle ul li {margin:3% 0; padding:1% 0; position:relative; z-index:1;}
.t_menu_wrap .t_middle ul li.boundary {border-top:solid 2px #6ab848;}
.t_menu_wrap .t_middle ul li a {font-size:1.1rem; position:relative; display:flex; align-items:center;}
.t_menu_wrap .t_middle ul li.on a {color:#fff;}
.t_menu_wrap .t_middle ul li a:last-child {margin-left:.5%;}
.t_menu_wrap .t_middle ul li a span {display:flex; justify-content:center; align-items:center; width:14px; height:14px; border-radius:50%; background:url(../images/complete_gray.png) no-repeat; background-size:100%; margin:2px 5px 0 0px;}
.t_menu_wrap .t_middle ul li a.clear span {background:url(../images/complete_green.png) no-repeat; background-size:100%;}
.t_menu_wrap .t_bottom {padding:5% 0;}
.t_menu_wrap .t_bottom a {display:block; width:90%; margin:0 auto; padding:3% 0; color:#fff; background-color:#6ab848;  text-align:center; border-radius:10px; font-size:1.1rem;}
.step_content .menual_popup {position:absolute; top:-20%; right:0%; width:35%; height:0; border-right:solid 1px #6ab848; transition:all .5s; background-color:#fff; box-shadow:0 0 26px rgb(0 0 0 / 20%);}
.step_content .menual_popup.on {height:93%; top:7%;}
.step_content .menual_popup.active {width:50%;}
.step_content .menual_popup .menual_tit {height:7%; border-bottom:solid 1px #6ab848; display:flex; align-items:center; padding-left:4%; justify-content:space-between;}
.step_content .menual_popup .menual_tit h4 {font-size:1.2rem; font-weight:600;}
.step_content .menual_popup .menual_tit .btn_wrap {width:50%; display:flex; height:100%; justify-content:flex-end;}
.step_content .menual_popup .menual_tit .btn_wrap a {display:flex; width:20%; align-items:center; padding:0 2%; justify-content:center;}
.step_content .menual_popup .menual_tit .btn_wrap a img {width:65%;}
.step_content .menual_popup .menual_tit .btn_wrap .video_box img {width:33px;}
.step_content .menual_popup .menual_tit .btn_wrap .example_btn img {width:23px;}
.step_content .menual_popup .menual_tit .btn_wrap .bt_download_e img {width:26px;}
.step_content .menual_popup .menual_tit .btn_wrap .click_wide img {width:27px;}
.step_content .menual_popup .menual_tit .btn_wrap .close img {width:23px;}

.step_content .menual_popup .menual_content {height:93%; overflow-y:auto;}
.step_content .menual_popup .menual_content.active {height:48%;}
.step_content .menual_popup .menual_content::-webkit-scrollbar {width:8px; background-color:#d9d9d9;}
.step_content .menual_popup .menual_content::-webkit-scrollbar-thumb {background-color:#767676; border-radius:10px;}
.step_content .menual_popup .video_wrap {width:100%; height:0; transition:all .5s}
.step_content .menual_popup .video_wrap.active {height:45%;}
.step_content .menual_popup .video_wrap .video_body {height:100%;}
.step_content .menual_popup .video_wrap .video_body .video-container {height:100%;}
.step_content .menual_popup .video_wrap .video_body .video-container iframe {height:100%;}
#main.step_main .scrach_wrap {width:100%; height:93%;}
#canvas {z-index:999; pointer-events:none; position:fixed; top:0; left:0; transform:scale(1.1); display:none;}
.step_content #main .content_tit .tit_right a img {width:30%;}

.learning_page {
    width:100%;
    height:93%;
    background-color:#f1f6ef;
    display:flex;
}
.learning_left {
    width:65%;
    height:100%;
    display:flex;
    justify-content:center;
    align-items:center;
    flex-direction:column;
}
.learning_left .video_wrap {
    width:100%;
    height:70%;
}
.learning_left .video_wrap iframe {
    width:100%;
    height:100%;
}
.learning_left .entry_btn {
    display:flex;
    justify-content:space-between;
    align-items:center;
    width:50%;
    margin-top:4%;
}
.learning_right .entry_btn {
    position:absolute;
    top:2%;
    right:-35%;
    width:30%;
}
.learning_left .entry_btn a,
.learning_right .entry_btn a {
    display:flex;
    justify-content:center;
    align-items:center;
    width:45%;
    background-color:#fff;
    border-radius:2rem;
    box-shadow:0px 0px 5px rgba(0,0,0,.2);
    padding:2% 0;
    font-weight:600;
}
.learning_right .entry_btn a {
    width:100%;
    padding:5% 0;
    margin-top:10%;
}
.learning_right .entry_btn a:first-child {
    margin-top:0;
}
.learning_left .entry_btn a img,
.learning_right .entry_btn a img {
    width:30px;
    margin-right:3%;
}
.learning_right {
    width:50%;
    height:100%;
    background-color:#fff;
    display:flex;
    justify-content:center;
    align-items:center;
    position:relative;
    margin:0 auto;
}

.learning_right .swiper {
    overflow:hidden;
    overflow-y:auto;
    width:100%;
    height:100%;
}
.learning_right .swiper .swiper-wrapper {
    height:85% !important;
    margin-top:5%;
}
.learning_right .swiper .swiper-slide {
    text-align:center;
}
.learning_right .swiper .swiper-slide img {
    width:55%;
    transition:all .3s;
}
.learning_right.active .swiper .swiper-slide img {
    width:95%;
}
.learning_right .swiper .bottom_slide_info {
    position:absolute;
    bottom:2%;
    right:-30%;
    width:165px;
    height:5%;
    margin:7% auto 0;
    background-color:#6ab848;
    border-radius:10px;
    display:flex;
    justify-content:center;
    align-items:center;
    z-index:9;
}
.learning_right .swiper .bottom_slide_info2 {
    margin:7.5% 17% 0 auto;
}
.learning_right .swiper .bottom_slide_info .swiper-pagination {
    color:#fff;
    font-size:.9rem;
    position:static;
    width:45%;
    line-height:1;
}
.learning_right .swiper .bottom_slide_info .swiper-button-prev,
.learning_right .swiper .bottom_slide_info .swiper-button-next {
    width:13px;
    height:25px;
    position:static;
    margin-top:0;
    background:url(../images/left_arrow.png) center center no-repeat;
    background-size:100%;
}
.learning_right .swiper .bottom_slide_info .swiper-button-next {
    transform:rotate(180deg);
}
/* hint_popup */
.hint_popup {
    width:40%;
    height:55vh;
    padding-bottom:0;
    display:flex !important;
    flex-direction:column;
    overflow:hidden;
}
.hint_popup .swal2-html-container {
    margin:0;
    width:100%;
    height:90%;
}
.hint_popup iframe {
    width:100%;
    height:100%;
}
.hint_popup .swal2-actions {
    width:100%;
    height:10%;
}
.hint_popup .swal2-actions button {
    margin:0;
    width:15%;
    background-color:#6ab848;
}
.hint_popup2 {
    width:45%;
    height:70vh;
}
.hint_popup2 .int_popup_inner div {
    width:65%;
    margin:2% auto 0;
    display:flex;
    justify-content:space-between;
    align-items:center;
}
.hint_popup2 .int_popup_inner div a {
    display:flex;
    justify-content:center;
    align-items:center;
    width:28%;
    padding:2.5% 0;
    background-color:#eee;
    border-radius:3rem;
    color:#1b1b1b;
    font-weight:500;
    font-size:1.2rem;
}
.hint_popup2 .int_popup_inner div a.active {
    background-color:#6ab847;
    color:#fff;
}
.hint_popup2 .int_popup_inner p {
    font-size:1.5rem;
    font-weight:600;
    color:#1b1b1b;
}
.hint_popup2 iframe {
    height:90%;
}


/* submit_popup */
.dimm02 {position:fixed; top:50%; left:50%; width:100%; height:100%; background-color:rgba(0,0,0,.6); transform:translate(-50%,-50%); display:none;}
.submit_popup {position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); width:40%; height:40%; background-color:#fff; border-radius:15px; display:none;}
.submit_popup .close_btn {position:absolute; top:1%; right:2%; width:4%; z-index:99;}
.submit_popup .popup_inner {width:100%; height:100%; position:relative; padding:4%;}
.submit_popup .popup_inner .popup_head {position:relative; height:14%;}
.submit_popup .content_nav {width:100%; position:absolute; top:100%; left:5%; z-index:99;}
.submit_popup .content_nav .nav_top {background-color:#fff; height:300px; border:solid 2px #6ab848; border-top:solid 1px #6ab848; display:none; width:400px; border-bottom-right-radius:10px;}
.submit_popup .nav_top .nav_tit {padding:3% 6%; display:flex; justify-content:flex-end; align-items:center;}
.submit_popup .nav_top .nav_tit h5 {font-size:1.1rem; font-weight:600;}
.submit_popup .nav_top .nav_tit img {width:12%; margin-right:8%;}
.submit_popup .nav_top ul {padding:0 6%; margin-top:10%;}
.submit_popup .nav_top ul li {display:flex; align-items:center; justify-content:space-between; padding-bottom:2.5%;}
.submit_popup .nav_top ul li a {display:block; width:22%}
.submit_popup .nav_top ul li a p {width:100%; color:#000;}
.submit_popup .nav_top ul li img {height:1px;}
.submit_popup .nav_top ul li p {width:22%; font-size:0.9rem;}
.submit_popup .nav_top ul li p.work_complete {color:#ffb0b0;}
.submit_popup .nav_top ul li p.working {color:#4578c4;}
.submit_popup .nav_bottom {border:solid 2px #6ab848; border-top:solid 1px #6ab848; background-color:#fff; position:absolute; top:0; right:10%; width:70%; display:none; border-bottom-left-radius:10px;}
.submit_popup .nav_bottom .bottom_tit {border-bottom:solid 1px #6ab848; padding:3% 6%; background-color:#6ab848; display:flex; justify-content:space-between;}
.submit_popup .nav_bottom .bottom_tit h5 {font-weight:600; color:#fff;}
.submit_popup .nav_bottom .bottom_tit a {background-color:#fff; border-radius:100%; width:20px; height:20px; display:flex; justify-content:center; align-items:center;}
.submit_popup .nav_bottom .bottom_tit a img {width:60%;}
.submit_popup .nav_bottom .bottom_list {border-bottom-left-radius:14px;}
.submit_popup .nav_bottom ul {padding-top:4%; height:330px; overflow-y:auto;}
.submit_popup .nav_bottom ul::-webkit-scrollbar {width:10px; background-color:rgba(0,0,0,.2);}
.submit_popup .nav_bottom ul::-webkit-scrollbar-thumb {background-color:#8d8d8d; border-radius:10px;}
.submit_popup .nav_bottom ul li {padding:3% 0; margin-bottom:2%; width:85%;}
.submit_popup .nav_bottom ul li a {display:block; padding-left:5%; color:#000; font-size:0.9rem;}
.submit_popup .nav_bottom ul li a span {color:#95DAFF; font-weight:600; margin-right:5px;}
.submit_popup .nav_bottom ul li.on {background-color:#6ab848; border-top-right-radius:14px; border-bottom-right-radius:14px;}
.submit_popup .nav_bottom ul li.on a {color:#fff;}
.submit_popup .nav_bottom ul li:hover {background-color:#6ab848; border-top-right-radius:14px; border-bottom-right-radius:14px;}
.submit_popup .nav_bottom ul li:hover a {color:#fff;}

.submit_popup .select_list {width:90%; margin:0 auto; display:flex; justify-content:center; height:100%; border:solid 1px #6ab848;}
.submit_popup .select_list .select_left {width:30%; background-color:#6ab848;}
.submit_popup .select_list .select_left a {display:flex; justify-content:space-between; align-items:center; height:100%; padding:0 2%;}
.submit_popup .select_list .select_left a h4 {color:#fff; font-size:1.1rem;}
.submit_popup .select_list .select_left a img {width:7%;}
.submit_popup .select_list .select_right {width:70%;}
.submit_popup .select_list .select_right a {display:flex; justify-content:space-between; align-items:center; height:100%; padding:0 2%;}
.submit_popup .select_list .select_right a h4 {color:#000; font-size:1.1rem;}
.submit_popup .select_list .select_right a img {width:4%;}
.submit_popup .popup_body {width:90%; margin:4% auto 0; background-color:rgba(0,0,0,.2); height:60%; display:flex; justify-content:center; align-items:center; padding:2%;}
.submit_popup .upload-name {
    display: inline-block;
    height: 40px;
    padding: 0 10px;
    vertical-align: middle;
    border: 1px solid #dddddd;
    width: 78%;
    color: #999999;
}
.submit_popup label {
    display: inline-block;
    padding: 10px 20px;
    color: #fff;
    vertical-align: middle;
    background-color: #999999;
    cursor: pointer;
    height: 40px;
    margin-left: 10px;
}
.submit_popup input[type="file"] {
    position: absolute;
    width: 0;
    height: 0;
    padding: 0;
    overflow: hidden;
    border: 0;
}
.submit_popup .submit_btn {width:90%; margin:3% auto 0; text-align:center;}
.submit_popup .submit_btn button {border:0; background-color:#6ab848; padding:2% 10%; color:#fff; border-radius:10px; font-size:1.1rem;}

/* think02 page */
.content_wrap .content_inner.think_inner {width:100%; height:100%; bottom:0; border-radius:0;}
.content_wrap .content_inner.think_inner:after {height:100%; border-bottom-left-radius:0px; border-bottom-right-radius:0px;}
.think_inner #main {height:100%; margin:0;}
.think_inner #main .think_tit {background-color:#6ab848; width:100%; padding:.5% 1%; height:7%;}
.think_inner #main .think_tit .tit_left h2 {display:flex; width:11%; justify-content:center; align-items:center; margin:3.5% 2% 0 0;}
.think_inner #main .main_inner {width:100%; height:90%;}
.think_inner #main .content_tit .tit_left .progress {border:solid 1px #fff;}
.think_inner #main .content_tit .tit_left .content_list {background-color:#fff; border:none;}
.think_inner #main .content_tit .tit_right .homebtn {display:none;}
.think_inner #main .content_tit .tit_right .t_box {display:flex; width:100%; height:100%; align-items:center;}
.think_inner #main .content_tit .tit_right .t_box p {color:#fff;}
.think_inner #main .content_tit .tit_right a img {width:40%;}
.think_inner #main .main_inner .main_top {height:5%;}
.think_inner #main .main_inner .main_content {height:calc(100% - 5%); }
.think_inner #main .main_inner .main_content .think_box {width:100%; height:100%;}

.think_inner .t_menu_wrap {position: absolute; bottom:0; right:-100%; width:23%; height:93%; border-left:solid 1px #6ab848; background-color:rgba(255,255,255,.9); display:block; transition:all 1s; z-index:99;}
.think_inner .t_menu_wrap.on {right:0;}
.think_inner .t_menu_wrap .t_top {text-align:center; border-bottom:solid 1px #666; width:80%; margin:4% auto; padding-bottom:4%; position:relative;}
.think_inner .t_menu_wrap .t_top img {width:40%;}
.think_inner .t_menu_wrap .t_top .t_franchise {}
.think_inner .t_menu_wrap .t_middle {text-align:center;}
.think_inner .t_menu_wrap .t_middle ul {padding-top:2%;}
.think_inner .t_menu_wrap .t_middle ul li {margin:5% 0; padding:3% 0; position:relative; z-index:1;}
.think_inner .t_menu_wrap .t_middle ul li.on:after {content:''; width:90%; height:100%; background-color:#6ab848; position:absolute; right:0; top:0; z-index:-1; border-top-left-radius:30px; border-bottom-left-radius:30px;}
.think_inner .t_menu_wrap .t_middle ul li a {font-size:1.2rem;}
.think_inner .t_menu_wrap .t_middle ul li.on a {color:#fff;}
.think_inner .t_menu_wrap .t_bottom {padding-top:4%;}
.think_inner .t_menu_wrap .t_bottom a {display:block; width:60%; margin:0 auto; padding:3% 0; color:#fff; background-color:#6ab848;  text-align:center; border-radius:10px; font-size:1.1rem;}


/* 색상커스텀 page */

/* 녹색 연노랑색 */
.think_wrap {background-color:#f2f2f2;}
.think_wrap #header {background-color:#fff;}
.think_wrap #header .header_inner .user_box {background-color:#fff0af;}
.think_wrap #header .header_inner .menu_wrap ul li a.on {background-color:#7bc556;}
.think_wrap #main .content_tit .tit_left .progress {background-color:#7bc556;}
.think_wrap #main .content_tit .content_list {border-color:#7bc556;}
.think_wrap05 #main .content_tit .nav_bottom {border-color:#7bc556; border-top:none;}
.think_wrap05 #main .content_tit .nav_bottom .bottom_tit {border-color:#7bc556; background-color:#7bc556;}
.think_wrap #main .main_inner {border-color:#7bc556;}
.think_wrap #main .main_inner .main_top {background-color:#7bc556;}
.think_wrap #header .header_inner .user_info .logout_btn {background-color:#7bc556;}
.think_wrap #main .content_tit .tit_right a p {color:#7bc556;}
.think_wrap #main .eval_top {border-bottom-color:#7bc556;}
.think_wrap #main .eval_top h4:after {background-color:#7bc556;}
.think_wrap #main .eval_top p {background-color:#7bc556; width:320px;}
.think_wrap #main .eval_body .eval_right {background-color:#fff0af;}
.think_wrap #main .eval_body .eval_right .sub_btn button {background-color:#7bc556;}

/* 노랑색 */
.think_wrap02 {background-color:#f2f2f2;}
.think_wrap02 #header {background-color:#fff;}
.think_wrap02 #header .header_inner .user_box {background-color:#1b3276;}
.think_wrap02 #header .header_inner .menu_wrap ul li a.on {background-color:#f6d635;}
.think_wrap02 #main .content_tit .tit_left .progress {background-color:#f6d635;}
.think_wrap02 #main .content_tit .content_list {border-color:#f6d635;}
.think_wrap05 #main .content_tit .nav_bottom {border-color:#f6d635; border-top:none;}
.think_wrap05 #main .content_tit .nav_bottom .bottom_tit {border-color:#f6d635; background-color:#f6d635;}
.think_wrap02 #main .main_inner {border-color:#f6d635;}
.think_wrap02 #main .main_inner .main_top {background-color:#f6d635;}
.think_wrap02 #header .header_inner .user_info .logout_btn {background-color:#f6d635;}
.think_wrap02 #main .content_tit .tit_right a p {color:#f6d635;}
.think_wrap02 #main .eval_top {border-bottom-color:#f6d635;}
.think_wrap02 #main .eval_top h4:after {background-color:#f6d635;}
.think_wrap02 #main .eval_top p {background-color:#f6d635;}
.think_wrap02 #main .eval_body .eval_right {background-color:#fff0af;}
.think_wrap02 #main .eval_body .eval_right .sub_btn button {background-color:#f6d635;}

/* 아이보리,연블루 */
.think_wrap03 {background-color:#f2efdc;}
.think_wrap03 #header {background-color:#f2efdc;}
.think_wrap03 #header .header_inner .user_box {background-color:#f2efdc;}
.think_wrap03 #header .header_inner .menu_wrap ul li a.on {background-color:#55b3d9;}
.think_wrap03 #main .content_tit .tit_left .progress {background-color:#55b3d9;}
.think_wrap03 #main .content_tit .content_list {border-color:#55b3d9;}
.think_wrap05 #main .content_tit .nav_bottom {border-color:#55b3d9; border-top:none;}
.think_wrap05 #main .content_tit .nav_bottom .bottom_tit {border-color:#55b3d9; background-color:#55b3d9;}
.think_wrap03 #main .main_inner {border-color:#55b3d9;}
.think_wrap03 #main .main_inner .main_top {background-color:#55b3d9;}
.think_wrap03 #header .header_inner .user_info .logout_btn {background-color:#55b3d9;}
.think_wrap03 #main .content_tit .tit_right a p {color:#55b3d9;}
.think_wrap03 #main .eval_top {border-bottom-color:#55b3d9;}
.think_wrap03 #main .eval_top h4:after {background-color:#55b3d9;}
.think_wrap03 #main .eval_top p {background-color:#55b3d9;}
.think_wrap03 #main .eval_body .eval_right {background-color:#fff0af;}
.think_wrap03 #main .eval_body .eval_right .sub_btn button {background-color:#55b3d9;}

/* 연분홍,연노랑 */
.think_wrap04 {background-color:#f8f8e6;}
.think_wrap04 #header {background-color:#f2efdc;}
.think_wrap04 #header .header_inner .user_box {background-color:#f2efdc;}
.think_wrap04 #header .header_inner .menu_wrap ul li a.on {background-color:#F0B4C1;}
.think_wrap04 #main .content_tit .tit_left .progress {background-color:#F0B4C1;}
.think_wrap04 #main .content_tit .content_list {border-color:#F0B4C1;}
.think_wrap05 #main .content_tit .nav_bottom {border-color:#F0B4C1; border-top:none;}
.think_wrap05 #main .content_tit .nav_bottom .bottom_tit {border-color:#F0B4C1; background-color:#F0B4C1;}
.think_wrap04 #main .main_inner {border-color:#F0B4C1;}
.think_wrap04 #main .main_inner .main_top {background-color:#F0B4C1;}
.think_wrap04 #header .header_inner .user_info .logout_btn {background-color:#F0B4C1;}
.think_wrap04 #main .content_tit .tit_right a p {color:#F0B4C1;}
.think_wrap04 #main .eval_top {border-bottom-color:#F0B4C1;}
.think_wrap04 #main .eval_top h4:after {background-color:#F0B4C1;}
.think_wrap04 #main .eval_top p {background-color:#F0B4C1;}
.think_wrap04 #main .eval_body .eval_right {background-color:#fffcec;}
.think_wrap04 #main .eval_body .eval_right .sub_btn button {background-color:#F0B4C1;}

/* 피스타치오,연노랑 */
.think_wrap05 {background-color:#f2f2f2;}
.think_wrap05 #header {background-color:#f2efdc;}
.think_wrap05 #header .header_inner .user_box {background-color:#f2efdc;}
.think_wrap05 #header .header_inner .menu_wrap ul li a.on {background-color:#8fc7c7;}
.think_wrap05 #main .content_tit .tit_left .progress {background-color:#8fc7c7;}
.think_wrap05 #main .content_tit .content_list {border-color:#8fc7c7;}
.think_wrap05 #main .content_tit .nav_bottom {border-color:#8fc7c7; border-top:none;}
.think_wrap05 #main .content_tit .nav_bottom .bottom_tit {border-color:#8fc7c7; background-color:#8fc7c7;}
.think_wrap05 #main .main_inner {border-color:#8fc7c7;}
.think_wrap05 #main .main_inner .main_top {background-color:#8fc7c7;}
.think_wrap05 #header .header_inner .user_info .logout_btn {background-color:#8fc7c7;}
.think_wrap05 #main .content_tit .tit_right a p {color:#8fc7c7;}
.think_wrap05 #main .eval_top {border-bottom-color:#8fc7c7;}
.think_wrap05 #main .eval_top h4:after {background-color:#8fc7c7;}
.think_wrap05 #main .eval_top p {background-color:#8fc7c7;}
.think_wrap05 #main .eval_body .eval_right {background-color:#fffcec;}
.think_wrap05 #main .eval_body .eval_right .sub_btn button {background-color:#8fc7c7;}


/* 웹에서 보이지말아야할 것 숨김 */
.m-br {display:none;}
#main .tit_left h2 {display:none;}
#main .content_tit .tit_right .t_box {display:none;}
#main .content_tit02 {display:none;}
.m_answer_box {display:none;}
.m_submit_btn {display:none;}

/* //웹에서 보이지말아야할 것 숨김 */

/* 일정이상의 높이에서 css 수정 */
@media screen and (max-width:1450px) {
    .content_wrap .content_inner {
        width:1250px;
    }
    .content_wrap .content_inner.step_content {
        width:100%;
    }
}
@media screen and (min-height:1125px) {
    .chapter_inner .list_box {height:24%;}
    .chapter_inner.chapter_inner2 .list_box {height:22.8%;}
}


@media screen and (max-width:1380px) {
    /* 가려야할것 */
    #header {display:none;}
    #main .content_tit .tit_right .homebtn {display:none;}
    #main .main_inner .main_content .stage_content .swiper_wrap .swiper_inner .think_swiper .swiper-button-prev, #main .main_inner .main_content .stage_content .swiper_wrap .swiper_inner .think_swiper .swiper-button-next {display:none;}
    .main_content .chapter_btn {display:none;}
    #main .content_tit .menu_wrap {display:none;}
    /* //가려야할것 */

    .m-br {display:block;}
    #main .content_tit .content_list a img {display:block;}
    .content_wrap .content_inner {height:100%; width:100%; border-top-left-radius: 0; border-top-right-radius: 0; bottom:0;}
    .content_wrap .content_inner:after {height:100%; border-bottom-left-radius:0; border-bottom-right-radius:0; }
    #main {height:100%; margin:0;}
    #main .content_tit .content_list {width:65%;}
    /* #main .content_tit .tit_left .progress {width:25%;} */
    #main .content_tit .nav_top {width:340px; height:260px; top:101%; left:-1px;}
    #main .content_tit .nav_top .nav_tit h5 {font-size:1rem;}
    /* #main .eval_body .eval_left {height:460px;} */
    #main .eval_top h4 {line-height:48px;}
    #main .content_tit02 {display:flex;}
    #main .main_inner .main_content .stage_content .swiper_wrap .swiper-pagination {display:block;}

    /* content_select page */
    .content_wrap .content_inner .content_middle {height:270px;}
    .content_wrap .content_inner .content_bottom .slick_wrap .slick_inner .center {height:auto;}

    /* main page */
    #main .main_inner .main_content .think_sub_tit {font-size:1rem; height:10vh; width:80%;}
    #main .main_inner .main_content .stage_content img {height:100%;}
    #main .main_inner .main_content.think_slide .stage_content img {height:auto; width:77%;}
    #main .tit_left h2 {width:12%; display:flex; justify-content:center; align-items:center;}
    #main .tit_left h2 img {width:90%;}
    #main .content_tit {width:100%; background-color:#6ab848; padding:0 5%; height:8%;}
    #main .content_tit .tit_left {padding:.5% 0 0.5%;}
    #main .content_tit .tit_left .progress {border:solid 1px #fff;}
    #main .content_tit .content_list {background-color:#fff; border:solid 1px #fff;}
    #main .main_inner {height:89%; margin-top:1%;}
    #main .content_tit .content_list.step_nav {width:50%; border-top-right-radius:10px; border-bottom-right-radius:10px;}
    #main .content_tit .tit_left .progress h4 {font-size:1.2rem;}
    #main .content_tit .content_list p {font-size:1rem; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
    #main .content_tit .tit_right {width:15%;}
    #main.step_main .content_tit {padding:0 5%;}
    #main.step_main .content_tit .tit_right {width:20%;}
    #main .content_tit .tit_right .t_box {display:flex; width:100%; height:100%; align-items:center;}
    #main .content_tit .tit_right a .t_txt {color:#fff;}
    #main .content_tit .tit_right .t_box .t_homebtn {width:70%; height:auto;}
    #main .content_tit .tit_right .t_box .t_homebtn img {width:20%; vertical-align:middle;}
    #main .content_tit .tit_right .t_box .t_menu {width:30%;}
    #main .content_tit .tit_right .t_box .t_menu img {width:50%; vertical-align:middle;}
    .step_content #main .content_tit .tit_right .t_box a.t_menu img {width:32%;}
    #main .content_tit .tit_right a.t_menu {margin-left:1%;}
    #main .main_inner .main_content .stage_content .slick_wrap .slick_inner .single-item .slick-prev,
    #main .main_inner .main_content .stage_content .slick_wrap .slick_inner .single-item .slick-next {width:30px; height:30px; left:-40px;}
    #main .main_inner .main_content .stage_content .slick_wrap .slick_inner .single-item .slick-next {left:auto; right:-40px;}
    .t_menu_wrap {width:23%; height:80%;}
    .t_menu_wrap .t_top p {font-size:1.3rem;}
    .t_menu_wrap .t_top p img {width:3.5%;}
    .t_menu_wrap .t_top .user_school {font-size:1.1rem;}
    .t_menu_wrap .t_middle ul {padding-top:2%;}
    .t_menu_wrap .t_middle ul li {margin:5% 0; padding:3% 0; position:relative; z-index:1;}
    .t_menu_wrap .t_middle ul li a {font-size:1rem;}
    .t_menu_wrap .t_middle ul li.on a {color:#fff;}
    .t_menu_wrap .t_bottom {padding-top:4%;}
    .t_menu_wrap .t_bottom a {font-size:1rem; width:80%;}
    .content_wrap .content_inner .content_middle ul li span {width:13%;}

    /* evalution page */
    #main .eval_body .eval_left .question_select {flex-wrap:wrap;}

    /* think02 page */
    .think_inner #main .main_inner {height:91.4%;}
    .think_inner #main .think_tit .tit_left h2 {margin:2% 2% 0 0; width:14%;}
    .think_inner #main .think_tit .tit_left {padding:0;}
    .think_inner #main .content_tit .tit_right .t_box .t_homebtn {justify-content:flex-start;}

    /* reference_inner */
    #main .reference_dl .content_download a img {width:25px;}
    
}

@media screen and (max-width:960px) {
    
    /* content_select page */
    .content_wrap .content_inner .content_top {height:60px;}
    .content_wrap .content_inner .content_top .notice_wrap ul {height:60%;}
    .content_wrap .content_inner .content_top .notice_wrap ul li a p {font-size:1.1rem;}
    .content_wrap .content_inner .content_top h2 {line-height:60px;}
    .content_wrap .content_inner .content_top h2 img {width:26%;}
    .content_wrap .content_inner .content_middle {height:140px;}
    .content_wrap .content_inner .content_middle ul li a {font-size:1rem; width:77%;}
    .content_wrap .content_inner .content_middle ul li span {width:17%;}
    .content_wrap .content_inner .content_bottom .swiper_wrap .swiper_inner .swiper-prev,
    .content_wrap .content_inner .content_bottom .swiper_wrap .swiper_inner .swiper-next {width:30px; height:30px; left:-40px;}
    .content_wrap .content_inner .content_bottom .swiper_wrap .swiper_inner .swiper-next {left:auto; right:-40px;}

    /* main page */
    #header .header_inner .menu_wrap ul li a {font-size:1rem;}   
    #header .header_inner .user_info .user_name {font-size:1rem;}
    #header .header_inner .user_info .info_top a {font-size:0.7rem;}
    #header .header_inner .user_info .user_school {font-size:0.8rem;}
    #header .header_inner .user_info .logout_btn {font-size:.8rem;}
    #main .content_tit {height:10%;}
    #main .tit_left h2 img {width:85%;}
    #main .content_tit .tit_left .progress h4 {font-size:1rem;}
    #main .content_tit .tit_right a img {width:35%;}
    #main .content_tit .content_list p {font-size:.9rem;}
    #main .main_inner {height:86%;}
    #main .main_inner .main_top ul li a {font-size:.9rem; padding:2%;}
    /* #main .main_inner .main_content .stage_content img {width:80%;} */
    #main .content_tit .nav_top {top:102%;}
    #main .content_tit .nav_top .nav_tit h5 {font-size:.9rem;}
    #main .content_tit .nav_bottom {width:311px;}
    .t_menu_wrap .t_top .t_franchise {font-size:.9rem;}
    .t_menu_wrap .t_middle ul {padding-top:0;}
    .t_menu_wrap .t_middle ul li a {font-size:1rem;}
    .t_menu_wrap .t_middle ul li {margin:3% 0; padding:2.2% 0;}
    .t_menu_wrap .t_bottom a {font-size:.9rem; padding:2% 0;}
    #main .content_tit .tit_right a .t_txt {font-size:.9rem;}

    /* evaluation page */
    #main .eval_top h4 {font-size:1rem; width:calc(100% - 320px);}
    #main .eval_top p {font-size:1rem; width:320px;}
    #main .eval_body .eval_left .question p {font-size:.9rem;}
    #main .eval_body .eval_left {width:calc(100% - 320px);}
    #main .eval_body .eval_left .question_select span {font-size:.8rem;}
    #main .eval_body .eval_right {width:320px;}
    #main .eval_body .eval_right .answer {padding:12% 0 12% 6%;}
    #main .eval_body .eval_right .answer .answer_box img {width:20px; vertical-align:middle;}
    #main .eval_body .eval_right .answer .answer_box p {font-size:.9rem;}

    /* reference_inner page */
    #main .reference_dl {height:18%; overflow-x:auto;}

    /* notification_inner page */
    #main .messenger .messenger_top .profile_img a i, #main .reference_info .profile_img a i {width:20px; height:20px;}
    #main .messenger .messenger_top .profile_name p, #main .reference_info .profile_name p {font-size:12px; padding-top:0;}
    #main .messenger .messenger_top .profile_like, #main .reference_info .profile_like {font-size:12px;}
    #main .messenger .messenger_top .profile_percent p, #main .reference_info .profile_percent p {padding:0 7%;}
    #main .notification_top h4, #main .reference_top h4 {font-size:1.2rem;}
    #main .notification_top p, #main .reference_top p {width:15%;}
    #main .notification_body .content_left p {font-size:.9rem;}

    /* app page */
    .step_content .menual_popup .menual_tit h4 {font-size:1rem;}
}

/* 노트북 높이 반응형 */
@media screen and (max-height:820px) {
    .login_box {width:650px; height:570px;}
    .content_wrap .content_inner .content_top {height:80px;}
    .content_wrap .content_inner .content_top .notice_wrap ul li a p {font-size:1rem;}
    .content_wrap .content_inner .content_top h2 img {vertical-align:middle; width:80%;}
    .content_wrap .content_inner .content_middle {height:270px;}
    .content_wrap .content_inner .content_bottom {height:calc(100% - 365px);}
    .content_wrap .content_inner .content_bottom.content_NB {height:calc(100% - 455px);}
    .content_wrap .content_inner .content_bottom .swiper_wrap .swiper_inner {margin-top:0;}
    .content_wrap .content_inner .content_bottom .swiper_wrap .swiper_inner .swiper-slide {transform:scale(.8);}
    .content_bottom2 .plus_tit {font-size:1.3rem;}

    /* main */
    #header .header_inner {margin-top:1%;}
    /* #main .content_tit .tit_left .progress h4 {font-size:1.2rem;} */
    /* #main .content_tit .content_list p {font-size:1rem;} */
    #main .content_tit .nav_bottom {width:100%; top:102%;}
    #main .main_inner .main_top ul li a {font-size:1rem; padding:1% 2%;}

    /* notification */
    

    /* notification_inner */
    #main .messenger .messenger_top .profile_img a i, 
    #main .reference_info .profile_img a i {width:30px; height:30px;}
    #main .messenger .messenger_top .profile_percent, 
    #main .reference_info .profile_percent {padding:1%;}
    #main .messenger .messenger_top, 
    #main .reference_info {height:13%;}
    #main .messenger .messenger_middle {height:76%;}
    #main .messenger .messenger_bottom a img {width:56%;}

    /* evaluation */
    #main .eval_body .eval_left .question {margin-bottom:11%;}

    /* reference_inner */
    #main .reference_dl {height:28%;}
    #main .reference_dl .content_download a p {font-size:.9rem; padding:2% 0;}

    /* info_correction page */
    #main .info_modify {height:90%;}
    #main .info_modify .modify_inner {height:95%; padding-top:2%;}
    #main .info_modify .modify_inner table tr td {height:50px;}
    #main .info_modify .profile_modify {width:80px; height:80px; top:3%; left:28%;}
    
    /* step */
    .content_wrap .content_inner.step_content {height:100%;}
    .step_content .t_menu_wrap .t_middle ul li {margin:3% 0;}

    /* day_check */
    .encourage {width:230px; height:230px;}
    .encourage p {font-size:1.1rem;}
    .encourage img {width:70%;}
}



/* mobile */
@media screen and (max-width:550px) {
    /* 모바일 가리기 */
    .m_none {display:none;}
    .content_wrap .content_inner .content_bottom .swiper_wrap .swiper_inner .swiper-button-next,
    .content_wrap .content_inner .content_bottom .swiper_wrap .swiper_inner .swiper-button-prev {display:none;}
    #main .eval_body .eval_right {display:none;}
    #main .eval_top p {display:none;}
    #main .eval_body .eval_left .question_select {display:none;}
    #main .content_tit .tit_left .progress_wrap {display:none;}
    .main_content .chapter_wrap {display:none;}
    #main .main_inner .main_content .think_sub_tit {height:auto; word-break:keep-all;}

    /* commmon */
    .login_box {width:350px; height:440px;}
    .login_form .login_inner {width:80%;}
    #main .content_tit .tit_left .progress h4 {font-size:.8rem;}
    #main .content_tit .content_list {width:75%; background-color:transparent; border:none;}
    #main .content_tit .content_list a {position:relative;}
    #main .content_tit .content_list a.on:before {transform:rotate(-180deg); transition:all .3s;}
    #main .content_tit .content_list a:before {content:''; background:url(../images/nav_btn_white.png) right center no-repeat; background-size:100%; position:absolute; top:0; right:0; width:6%; height:100%; transition:all .3s;}
    #main .content_tit .content_list a img {display:none;}
    #main .content_tit .content_list p {font-size:.9rem; color:#fff; padding-right:6%;}
    #main .tit_left h2 {width:18%;}
    #main .content_tit .tit_right {width:20%;}
    #main .notification_top h4, #main .reference_top h4 {font-size:1.1rem;}
    #main .notification_top p, #main .reference_top p {width:30%; font-size:.7rem;}
    #main .notification_body .content_right02 {width:100%;}
    #main .messenger .messenger_top .profile_percent p {display:flex; padding:0 5%; align-items:center;}
    #main .messenger .messenger_middle .talk_box .student_box.box_img p {width:70%;}
    #main .messenger .messenger_middle .talk_box .student_box img {width:75%;}
    #main.main_notice {height:100%;}

    /* content_select */
    .content_wrap .content_inner .content_top {height:50px; width:85%;}
    .content_wrap .content_inner .content_top .notice_wrap {width:50%;}
    .content_wrap .content_inner .content_top .notice_wrap ul {width:100%;}
    .content_wrap .content_inner .content_top .notice_wrap ul li {width:50%;}
    .content_wrap .content_inner .content_top .notice_wrap ul li a {width:100%; padding:0; display:flex; justify-content:center; align-items:center;}
    .content_wrap .content_inner .content_top .notice_wrap ul li a p {font-size:.9rem;}
    .content_wrap .content_inner .content_top h2 {width:25%;}
    .content_wrap .content_inner .content_middle .diary_wrap, .content_wrap .content_inner .content_middle .reference_wrap {width:85%;}
    .content_wrap .content_inner .content_middle {height:240px;}
    .content_wrap .content_inner .content_middle ul li a {font-size:.9rem;}
    .content_wrap .content_inner .content_middle ul li span {font-size:.8rem;}
    .content_wrap .content_inner .content_bottom {height:calc(100% - 295px);}
    .content_wrap .content_inner .content_bottom .swiper_wrap .swiper_inner .swiper-slide a {height:140px;}
    .content_wrap .content_inner .content_bottom .swiper_wrap .swiper_inner .swiper-slide p {font-size:1rem;}

    /* think */
    #main .main_inner {height:90%;}
    #main .content_tit {height:8%;}
    #main .content_tit .tit_left {width:83%; justify-content:space-between; position:static;}
    /* #main .content_tit .tit_left .progress {width:27%;} */
    #main .content_tit .tit_left .progress img {width:14%; height:18%;}
    #main .content_tit .tit_right {width:13%;}
    #main .content_tit .tit_right .t_box .t_menu {width:80%;}
    #main .content_tit .nav_bottom {right:auto; left:47%; transform:translateX(-50%); width:100vw; border-bottom-left-radius:0; border-top:solid 1px #fff;}
    #main .content_tit .nav_bottom .bottom_tit h5 {font-size:.8rem;}
    #main .content_tit .nav_bottom ul {height:290px;}
    #main .content_tit .nav_bottom ul li a {font-size:.8rem;}
    #main .content_tit .content_list .nav_bottom a.top_btn img {display:block;}
    #main .content_tit .content_list .nav_bottom a:before {display:none;}
    #main .main_inner .main_content .stage_content img {height:auto;}
    .t_menu_wrap {width:50%;}
    .t_menu_wrap .t_top p {font-size:1rem;}
    .t_menu_wrap .t_top .user_school {font-size:.9rem;}

    /* today */
    #main .eval_top h4 {width:100%; font-size:.9rem;}
    #main .eval_top h4:after {width:30%;}
    #main .eval_top h4 span {width:30%;}
    #main .day_body .day_txt {font-size:.9rem;}
    #main .day_body .radio_box table tr td {font-size:.9rem; word-break:keep-all;}
    #main .day_body .radio_box table tr td input {width:33%; height:33%;}
    #main .day_body .day_submit {margin-top:10%;}
    #main .day_body .day_submit button {width:55%;}
    #main .eval_body .eval_left .question p {font-size:.8rem;}

    /* notification */
    #main .diary_list ul li span,
    #main .reference_list ul li span {font-size:.7rem;}
    #main .diary_list ul li a, #main .reference_list ul li a {width:75%;}
    #main .diary_list ul li a span,
    #main .reference_list ul li a span {font-size:.9rem;}

    /* notification_inner */
    #main .notification_body {flex-direction:column;}
    #main .notification_body .content_left {width:100%; overflow-y:auto;}
    #main .notification_body .content_right {border-top:solid 1px #c4c4c4; height:60%;}
    #main .notification_top h4, #main .reference_top h4 {font-size:1.1rem;}
    #main .messenger .messenger_top .profile_img a i, #main .reference_info .profile_img a i {width:20px; height:20px;}
    #main .messenger .messenger_top .profile_like, #main .reference_info .profile_like {font-size:10px;}
    #main .messenger .messenger_top, #main .reference_info {height:13%;}
    #main .messenger .messenger_middle {height:76%;}

    /* exam */
    .m_answer_box {display:block; margin-top:4%;}
    #main .eval_body .eval_left {width:100%;}
    #main .eval_body .eval_left .question {margin-bottom:6%;}
    #exam_complete .re_exam {width:45%; margin-top:6%; padding:2%;}

    /* input radio custom */
    #main .eval_body .eval_left input {width:10px;}
    #main .eval_body .eval_left input[type="radio"] {display:none;}
    #main .eval_body .eval_left input[type="radio"] + label {position:relative; margin:0 0 10px 25px; display:inline-block;}
    #main .eval_body .eval_left input[type="radio"] + label:after {content:''; position:absolute; top:-13px; left:6px; width:0; height:24px; background:url(../images/answer_check2.svg) no-repeat; transition:width 0.3s;}
    #main .eval_body .eval_left input[type="radio"]:checked + label:after {width:35px;}
    #main .eval_body .eval_left input[type="radio"] + label span {margin-left:5px; font-size:.8rem;}
    #main .eval_body .eval_left label {cursor: pointer;}
    /* //input radio custom */

    /* input checkbox custom */
    #main .eval_body .eval_left input[type="checkbox"] {display:none;}
    #main .eval_body .eval_left input[type="checkbox"] + label {position:relative; margin-bottom:10px;}
    #main .eval_body .eval_left input[type="checkbox"] + label:after {content:''; position:absolute; top:-13px; left:27px; width:35px; height:0px; background:url(../images/answer_check2.svg) no-repeat; transition: height 0.3s;}
    #main .eval_body .eval_left input[type="checkbox"]:checked + label:after {height:24px;}
    #main .eval_body .eval_left input[type="checkbox"] + label span {margin-left:5px; font-size:.8rem;}
    #main .eval_body .eval_left input[type="checkbox"] + label:before {display:none;}
    /* //input checkbox custom */
    #main .eval_body .eval_left .m_answer_box img {width:20px; vertical-align:bottom;}
    #main .eval_body .eval_left .m_submit_btn {display:block; margin-top:7%;}
    #main .eval_body .eval_left .m_submit_btn input {display:block; width:50%; margin:0 auto; padding:2%; color:#fff; background-color:#6ab848; border-radius:10px; border:none; box-shadow:3px 2px 5px rgba(0,0,0,.2);}

    /* info_correction */
    #main .info_modify .modify_inner {width:95%; height:78%;}
    #main .info_modify .profile_modify {width:50px; height:50px; left:50%; transform:translateX(-50%);}

    /* today */
    .day_complete,
    .notice_popup {width:80%; height:240px;}
    .day_complete .txt_center,
    .notice_popup .txt_center {font-size:1rem;}
    .day_complete img,
    .notice_popup img {width:70%;}
}

/*  디클탭 웹 높이 반응형 */
@media screen and (max-height:450px) {
    /* 공통부분 */
    .content_wrap .content_inner {height:100%; border-radius:0px; bottom:0;}
    #main .content_tit .nav_bottom ul {height:290px;}
    .content_wrap .content_inner02:after {border-radius:0px;}

    /* 로그인 페이지 */
    .login_box {width:520px; height:440px;}

    /* content_select */
    .content_wrap .content_inner .content_top {height:60px;}
    .content_wrap .content_inner .content_top .notice_wrap ul {height:60%;}
    .content_wrap .content_inner .content_middle {height:125px;}
    .content_wrap .content_inner .content_middle ul li a {font-size:1rem;}
    .content_wrap .content_inner .content_bottom {height:calc(100% - 185px);}

    /* main */
    #main .main_inner .main_top ul li a {font-size:.9rem;}
    .chapter_inner .list_box {height:50%;}
    .main_content .chapter_btn {height:80px;}
    .main_content .chapter_btn a {font-size:.8rem;}
    .main_content .chapter_btn a img {width:7px;}
    .list_box a {height:75%;}
    .list_box p {height:25%; font-size:.8rem; word-break:keep-all;}

    /* exam */
    #main .eval_top h4 {font-size:.9rem;}

    /* notification_inner */
    #main .content_tit .tit_left .progress h4 {font-size:1rem;}
    #main .content_tit .content_list p {font-size:.9rem;}

    /* today */
    #main .day_body .radio_box table tr td {height:50px; font-size:.9rem;}
    #main .day_body .day_submit button {font-size:.9rem;}
    .day_complete, .notice_popup {width:300px; height:200px; }
    .day_complete .txt_center,
    .notice_popup .txt_center {font-size:.9rem;}
    .day_complete p:last-child,
    .notice_popup p:last-child {font-size:.9rem;}
    .day_complete img,
    .notice_popup img {width:60%;}
    .day_complete a, .notice_popup a {}

    /* step */
    #main.step_main .content_tit .tit_right .t_box a:first-child {font-size:1rem;}
    .step_content #main.step_main .content_tit {padding:.2% 5%;}
    .step_content #main .content_tit .tit_left {padding:.2% 0 0 .2%;}
    .step_content #main.step_main .content_tit .tit_left .progress h4 {font-size:1rem;}
    .step_content .menual_popup .menual_tit .btn_wrap .video_box img {width:22px;}
    .step_content .menual_popup .menual_tit .btn_wrap .example_btn img {width:15px;}
    .step_content .menual_popup .menual_tit .btn_wrap .bt_download_e img {width:18px;}
    .step_content .menual_popup .menual_tit .btn_wrap .click_wide img {width:19px;}
    .step_content .menual_popup .menual_tit .btn_wrap .close img {width:19px;}
    
    /* t_menu */
    .t_menu_wrap {width:22%;}
    .t_menu_wrap .t_top p {font-size:1rem;}
    .t_menu_wrap .t_top .user_school {font-size:.9rem;}
    .t_menu_wrap .t_middle ul li a span {width:13px; height:13px; margin-top:3px;}
    #main.step_main .content_tit .tit_right .t_box a {width:36.3333%;}
    #main.step_main .content_tit .tit_right .t_box .t_menu {width:25%;}
    
}