@charset "utf-8";
* {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}
body, div, table, ul, li, dl, dt, dd, ol, p, span, address, h1, h2, h3, h4, h5, h6, img, a{padding:0; margin:0; font-family:'NotoLight','NanumGothic','Malgun Gothic','돋움',dotum,sans-serif;word-break: keep-all; word-wrap: break-word;}
input{font-family:'NanumGothic','Malgun Gothic','돋움',dotum,sans-serif;}
.skip{position:absolute; left:-999px; font-size:1px; width:0; height:0; line-height:0; overflow:hidden; visibility:hidden;}
a:link, a:visited, a:active, a:hover{color:#000; text-decoration:none !important;}
img, form{border:none;}
a img, p img, li img{vertical-align:top;}
img, select, input, button{vertical-align:middle;}
.none{background:none !important;border:0 !important;}
.clearboth{clear:both;}
.red{color:red;}
.blue{color:blue;}
.img100{width:100%}
.img100 img{width:100%;}
.wrap{max-width:1200px; margin:0 auto;position:relative;}
/*=============================================== login.html==============================================*/
/*PC */
@media screen and (min-width: 1025px) {
.login_txt{text-align:center; margin:20px 0 30px 0;}
.m_input{width:50%; padding:15px; margin-top:5px; }
.bt_log{width:50%; border:none; padding:15px 0; text-align:center; background-color:#1b8892; color:#fff; margin-top:15px; font-size:20px;font-family:'Montserrat'; }
.container{padding:0 1%;}
.pcOnly {}
.tbOnly {display: none !important;}
.mbOnly {display: none !important;}
}
/*Tablet */
@media screen and (min-width: 769px) and (max-width: 1024px) {
.login_txt{text-align:center; margin:20px 0 30px 0;}
.m_input{width:70%; padding:15px; margin-top:5px;}
.bt_log{width:70%; border:none; padding:15px 0; text-align:center; background-color:#1b8892; color:#fff; margin-top:15px; font-size:20px;font-family:'Montserrat'; }
.container{padding:0 2%;}
.pcOnly {display: none !important;}
.tbOnly {}
.mbOnly {display: none !important;}
}
/*Mobile */
@media screen and (max-width: 768px) {
.login_txt{text-align:center; margin:20px 0 30px 0;}
.m_input{width:100%; padding:15px; margin-top:5px; }
.bt_log{width:100%; border:none; padding:15px 0; text-align:center; background-color:#1b8892; color:#fff; margin-top:15px; font-size:20px;font-family:'Montserrat'; }
.container{padding:0 1%;}
.mbOnly {}
.tbOnly {display: none !important;}
.pcOnly {display: none !important;}

.tab{display: flex; background: linear-gradient(135deg, #1e293b 0%, #334155 100%); padding: 15px; border-radius: 10px; width: 100%; margin: 0 auto; align-items: center;}
.tab ul{display: flex; background: linear-gradient(135deg, #1e293b 0%, #334155 100%); padding: 0px; border-radius: 10px; width: 100%; margin: 0 auto;}
.tab li{list-style:none;}
.tab li a{padding: 8px 16px; border-radius: 8px; text-decoration: none; color: #fff; font-size: 14px; font-weight: 600; }
.tab li:nth-child(6) a{margin-right:0;}
.tab li span{font-size:14px;}
.tab li.over a{background: #fbbf24; color: #000;box-shadow: 0 2px 4px rgba(0,0,0,0.05);}
.tab .log{color: #fff;}
.tab .log strong{margin-right: 10px;}


}
/*===============================================END==============================================*/

/*=============================================== agree.html==============================================*/
/*PC */
@media screen and (min-width: 1025px) {
.NB_title{margin:50px auto 20px auto; width:30%;}
.NB_title img{width:100%;}
.NB_text{margin:20px auto 20px auto;background-color:#f0f0f0; width:60%; padding:30px;}
.NB_text ol{margin-left:50px;}
.agree{text-align:center; position:relative; margin:30px auto 30px auto;width:60%;}
.all_agree{width:130px; margin:0 auto; position:relative;}
.agree .all_agree:after {display:block; clear:both; content:"";}
.agree .all_agree input[type="checkbox"] {display: none;}
.agree .all_agree input[type="checkbox"] + label {display: inline-block; width:18px; height: 18px; background: #e74b3c; cursor: pointer; border-radius: 3px;float: left;}
.agree .all_agree input[type="checkbox"]:checked + label {background:url('/register/2020_08/images/check.png') #e74b3c no-repeat center/10px 10px; float: left;}
.agree .all_agree input[type="checkbox"] + label span {position: absolute; top: -4px; left:25px; display: block; font-weight: bold;}
.NB_agree{border:none; background-color:#e74b3c; color:#fff; font-family:'NotoRegular'; font-size:17px; padding:7px 0px; border-radius:10px; ; width:200px; display:block; margin:0 auto;}
}

/*===============================================END==============================================*/

/*=============================================== login.html==============================================*/
/*PC */
@media screen and (min-width: 200px) {
.tab{display: flex; background: linear-gradient(135deg, #1e293b 0%, #334155 100%); padding: 15px; border-radius: 10px; width: 100%; margin: 0 auto; align-items: center;}
.tab ul{display: flex; background: linear-gradient(135deg, #1e293b 0%, #334155 100%); padding: 0px; border-radius: 10px; width: 100%; margin: 0 auto;}
.tab li{list-style:none;}
.tab li a{padding: 8px 16px; border-radius: 8px; text-decoration: none; color: #fff; font-size: 14px; font-weight: 600; }
.tab li:nth-child(6) a{margin-right:0;}
.tab li span{font-size:14px;}
.tab li.over a{background: #fbbf24; color: #000;box-shadow: 0 2px 4px rgba(0,0,0,0.05);}
.tab .log{color: #fff;}
.tab .log strong{margin-right: 10px;}
.tab2{ margin:20px 0 10px 0; overflow:hidden;}
.tab2 li{list-style:none;}
.tab2 li a{display:block; float:left; width:49%; margin-right:1%; background-color:#999; color:#fff; text-align:center; padding:15px 0; border-radius:10px; font-family:'Score4';}
.tab2 li.over a{background-color:#e74636; color:#fff;}
.tab2 li:nth-child(1) a{background-color:#f6e113 ; color:#4b383f;}

.program{border-collapse:collapse;}
.program td{border:1px solid #ddd; padding:10px 20px;}
.program td strong {}
.program th{border:1px solid #ddd;padding:5px; background-color:#eee; color:#000;}
.en_btn{background-color:#2c4181; color:#fff !important; padding:6px 15px; border:none;}
.en_btn02{background-color:#804000; color:#fff !important; padding:6px 15px; border:none; }
}

/*===============================================END==============================================*/ 

/*=============================================== 설문 레이어 팝업 ==============================================*/
/*PC */
@media screen and (min-width: 768px) {
.devLayer {display:none; position:fixed; _position:absolute; top:0; left:0; width:100%; height:100%; z-index:100;}
.devLayer .devLayerBg {position:absolute; top:0; left:0; width:100%; height:100%; background:#000; opacity:.5; filter:alpha(opacity=50);}
#devLayer1 {display:none; position: absolute; top: 10%; left: 50%; width: 1000px; margin-left:-500px; height:auto;background-color:#fff; border: 2px solid #333; z-index: 10;}
.layer_cont{padding:50px;}
.vod_btn{display:block; background-color:#eb706c; color:#fff !important; text-align:center;border:none; width:100%; padding:3px 0; font-size:16px;}
.vod_btn1{display:block; background-color:#6868FF; color:#fff !important; text-align:center;border:none; width:100%; padding:3px 0; font-size:16px;}
.vod_btn2{display:block; background-color:#9a9a9a; color:#fff !important; text-align:center; border:none;width:100%; padding:3px 0; font-size:16px;}
.app_btn{display:block; background-color:#42a0c6; color:#fff !important; text-align:center; border:none; width:100%; padding:3px 0; font-size:14px;}
.app_btn2{display:block; background-color:#42a0c6; color:#fff !important; text-align:center; border:none; width:20%; padding:7px; font-size:16px;}
.app_close{position: absolute; right:0; top:0; border:none; background-color:#000; color:#fff; font-size:14px; padding:6px 15px;}
.btn_out{background-color:#fff; color:#000 !important; font-size:12px; font-family:'Dotum'; padding:4px 7px 2px 7px;}
}

/*===============================================END==============================================*/

/*=============================================== 스폰배너 ==============================================*/
/*PC */
@media screen and (min-width: 1025px) {
.spons{width:50%; margin:0 auto; margin-bottom:50px;}
.spons li{list-style:none; float:left; width:45%; margin-bottom:20px; border:1px solid #ddd; margin:0 5px; height:80px; text-align:center; padding:20px 0; font-size:20px;}
.spons li img{width:100%;}
}

/*===============================================END==============================================*/

/*=============================================== 스폰배너 ==============================================*/
/*PC */
@media screen and (min-width: 1025px) {
.atto_txt01{text-align:Center; font-size:26px; margin:20px 0;}
.atto_txt02{background-color:#f0f0f0; width:60%; margin: 0 auto; padding:20px; border:1px solid #ddd;}
.atto_form{text-align:center; margin:40px 0 0px 0;}
.bt_log2{border:none; background-color:#0074ad; color:#fff; font-size:18px; padding:10px 30px; margin-top:35px;}
.jender5_wrap{width:630px; margin:0 auto; overflow:hidden;}
.jender5{position:relative;z-index:10;display:block;float:left; width:200px; height:45px; margin-bottom:0px; float:left; margin-right:10px;}
.jender5 input{position:absolute;z-index:9;top:0;left:0;width:100%;height:2px;}
.jender5 label{line-height:45px;position:absolute;z-index:10;top:0;left:0;display:block;width:100%;height:45px;cursor:pointer;text-align:center;color:#8e8e8e;border:1px solid #a7a7a7; font-size:16px;}
.jender5 input:checked+label{z-index:100; color:#fff; background-color:#8fc321;}
}

/*===============================================END==============================================*/

.score{border-collapse:collapse;}
.score td{border:1px solid #ddd; padding:7px;}

.kakao_btn2 a{font-family:'Score5'; font-size:18px; background-color:#f6e113 ; text-align:Center; padding:10px 30px; color:#4b383f; border-radius:30px;}
.kakao_btn2{height:45px; text-align:center;}
.kakao_btn2 img{height:100%;}

/*===============================================영상화면 구성==============================================*/
/*PC */
@media screen and (min-width: 1025px) {
.media_wrap {position: relative;float:left;width: 765px;height: 0;overflow: hidden;padding-bottom: 39.3%; margin-right:10px;}
.media_wrap .media_content {position: absolute;top: 0;left: 0;width: 100%;height: 100%}

.chat_wrap{width:380px; float:right;position: relative;height: 0;overflow: hidden; padding-bottom: 39.3%;}
.chat_wrap .chat_content{position: absolute;top: 0;left: 0;width: 100%;height: 100%;}
.noti_btn a{font-family:'Score5'; font-size:16px; background-color:#714eac ; display:block; text-align:Center; padding:30px 0; color:#fff;}
.qna_btn a{font-family:'Score5'; font-size:16px; background-color:#f6e113 ; display:block; text-align:Center; padding:10px 0; color:#4b383; margin:10px 0;}
.error_btn a{font-family:'Score5'; font-size:16px; background-color:#333 ; display:block; text-align:Center; padding:20px 0; color:#fff; width:49%; float:left;}
.qna2_btn a{font-family:'Score5'; font-size:16px; background-color:#002352 ; display:block; text-align:Center; padding:10px 0; color:#fff; margin:10px 0;}
.qna3_btn a{font-family:'Score5'; font-size:16px; background-color:#002352 ; display:block; text-align:Center; padding:20px 0; color:#fff; width:48%; float:right;}
.chat_ul{margin-left:20px;}
.chat_ul li{margin-bottom:12px;}
.chat_txt{ font-size:1em; line-height:1.4em;}
.chat_ex{background-color:#fffde9;padding:5px; margin-top:7px; border:1px solid #f5f3d3;}
.check th{font-size:13px; padding:5px; color:#fff;font-weight:bold;}
.check td{font-size:13px; padding:5px; color:#000;font-weight:bold;}
.check strong{margin-left:30px;}
.check a{color:#fff;}
}
/*===============================================END==============================================*/

.program2{border-collapse:collapse;}
.program2 td{border:1px solid #ddd; padding:7px;}
.program2 th{border:1px solid #ddd;padding:7px; background-color:#f0f0f0;}
.view_btn{background-color:#444; font-size:12px; font-family:'Dotum'; color:#fff !important; padding:3px 4px;}

.program3{border-collapse:collapse;}
.program3 td{border:1px solid #ddd; padding:7px;font-family: 'NanumGothic'; font-size:13px; word-break: keep-all; word-wrap: break-word; line-height:22px;}
.program3 th{border:1px solid #ddd;padding:7px; background-color:#f0f0f0; font-family: 'Score3'; font-size:13px;}
.program3 .bd_bot{border-bottom:1px solid #a8a8a8;}
.view_btn{background-color:#444; font-size:11px; font-family:'Montserrat_Light'; color:#fff !important; padding:3px 4px;}

.btn_down{display:block; background:#e16253; padding:30px 20px; border-radius:5px; width:100%; text-align:center; margin-top:;color:#fff; border:0 none; font-size:16px; font-weight:bold; line-height:25px;}
.btn_down a{color:#fff; text-decoration:none; font-size:16px; font-weight:bold;}

.btn_check{font-size:14px; width:26%; background:#2a275e; color:#fff; border:0; border-radius:5px; padding:5px 0; margin-left:20px;}
.btn_check2{font-size:14px; width:25%; background:#F33; color:#fff; border:0; border-radius:5px; padding:7px 0; margin-left:20px;background:#5f5f5f; color:#fff;}
.btn_check:visited{background:#5f5f5f; color:#fff;}
.btn_end{font-size:14px; width:25%; background:#2a275e; color:#fff; border:0; border-radius:5px; padding:7px 0; margin-left:20px;}
.btn_end2{font-size:14px; width:25%; background:#2a275e; color:#fff; border:0; border-radius:5px; padding:7px 0; margin-left:20px; background:#5f5f5f; color:#fff;}

/*.play_tit{padding:20px 0; text-align:center; font-family:'Score4'; font-size:25px; border:3px solid #ccc; background-color:#fffdfa; margin-bottom:20px; margin-top:20px;}
.play_tit span{display:block;text-align:center; font-family:'Score4'; font-size:18px; margin-top:15px; color:#666;}*/

.play_tit{padding:10px 30px 10px 0; text-align:left; border:3px solid #ccc; background-color:#fffdfa; margin-bottom:20px; margin-top:20px; display:flex;}
.play_tit dl{overflow:hidden; margin:auto; margin-left:20px;}
.play_tit dt{float:left; width:110px; margin-right:30px;}
.play_tit dt img{width:100px;}
.play_tit dd{padding:15px 0 0 0; color:#666; font-weight:bold; margin-right:25px; line-height:35px; font-size:20px; width:895px;}
.play_tit dd strong{color:#000; color:#083f88; font-size:27px;} 
.play_tit dd span{padding-left:100px; line-height:22px;}
.play_btn{list-style:none;}
.play_btn li{padding:8px 20px; text-align:center; margin-bottom:5px; border-radius:20px;}
.play_btn li:nth-child(1){background:#5b9bd5;}
.play_btn li:nth-child(2){background:#1f4e79;}
.play_btn li:nth-child(3){background:#a9d18e;}
.play_btn li a{color:#fff;}
.list_back a{display:block; width:250px; margin:0 auto; background-color:#20277e; color:#fff; text-align:center; font-size:18px; padding:10px; border-radius:50px; margin-top:35px; height:50px;}

.flex{display:flex; justify-content:;}
.flex p{margin-right:10px; margin-top:-2px;}
.flex ul li{margin-bottom:5px;}


/* 로그인 페이지 */
        .main-card {
            max-width: 800px;
            margin: 10px auto;
            background: white;
            border-radius: 12px;
            /*box-shadow: 0 10px 30px rgba(0,0,0,0.15);*/
            border: 1px solid #ddd;
            overflow: hidden;
        }


        .content-body {
            padding: 30px;
        }

        /* 비공개 안내 박스 */
        .copyright-box {
            background: #fff9f0;
            border: 1px solid #c5a059;
            border-radius: 8px;
            padding: 20px;
            display: flex;
            align-items: center;
            gap: 20px;
            margin: 30px 0;
        }

        .icon-shield {
            font-size: 40px;
            color: #c5a059;
        }

        .copyright-text {
            list-style: none;
            padding: 0;
            margin: 0;
            font-weight: 600;
        }

        .copyright-text li { margin-bottom: 5px; }
        .red { color: #e74c3c); }

        /* 섹션 타이틀 스타일 */
        .section-title {
            display: flex;
            align-items: center;
            font-size: 1.1rem;
            color:  #1a5f63;
            font-weight: bold;
            margin: 25px 0 15px;
            border-bottom: 2px solid  #1a5f63;
            padding-bottom: 5px;
        }

        .info-list {
            padding-left: 20px;
            font-size: 0.95rem;
            color: #555;
        }

        .info-list li { margin-bottom: 8px; line-height: 1.4; }

        /* 평점 테이블 디자인 */
        .table-wrapper {
            background: #f4f7f6;
            border-radius: 8px;
            padding: 20px;
            margin-top: 15px;
        }

        .score-table {
            width: 100%;
            border-collapse: collapse;
            background: white;
        }

        .score-table th, .score-table td {
            border: 1px solid #ddd;
            padding: 12px;
            text-align: center;
        }

        .score-table th {
            background: #e9eeed;
            color: #0d3b3e;
        }

        .badge {
            background:  #1a5f63;
            color: white;
            padding: 3px 10px;
            border-radius: 20px;
            font-size: 0.85rem;
            display: inline-block;
        }

        /* 유의사항 섹션 */
        .warning-section {
            background: #fdf2f2;
            padding: 15px;
            border-radius: 8px;
            margin-top: 20px;
        }

        .warning-section p {
            margin: 5px 0;
            font-weight: bold;
            font-size: 0.9rem;
        }

        /* 로그인 영역 */
        .login-area {
            text-align: center;
            background: #f8f9fa;
            padding: 40px 30px;
            border-top: 1px solid #eee;
        }

        .agree-text {
            font-weight: bold;
            margin-bottom: 20px;
            color: #444;
        }

        .id-pw-hint {
            background: #c5a059;
            color: white;
            padding: 8px 20px;
            border-radius: 4px;
            display: inline-block;
            margin-bottom: 10px;
            font-weight: bold;
        }

        .input-form {
            max-width: 450px;
            margin: 20px auto 0;
        }

        .input-form input {
            width: 100%;
            padding: 15px;
            margin-bottom: 10px;
            border: 1px solid #ccd6d9;
            border-radius: 6px;
            background: #eef3f4;
            box-sizing: border-box;
            font-size: 1rem;
        }

        .btn-login {
            width: 100%;
            padding: 18px;
            background: #0d3b3e;
            color: white;
            border: none;
            border-radius: 6px;
            font-size: 1.2rem;
            font-weight: bold;
            cursor: pointer;
            transition: background 0.3s;
        }

        .btn-login:hover {
            background:  #1a5f63;
        }

        /* 반응형 모바일 */
        @media (max-width: 600px) {
            body { padding: 10px; }
            header h1 { font-size: 1.1rem; }
            .copyright-box { flex-direction: column; text-align: center; }
            .score-table { font-size: 0.8rem; }
        }

.modern-wrapper {
    max-width: 100%;
    margin: 20px auto;
    /*padding: 0 20px;*/
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
}

/* 상단 유저 정보 & 탭 */
.header-section {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 30px;
}
.user-profile { display: flex; align-items: center; gap: 10px; }
.avatar { width: 32px; height: 32px; background: #334155; color: #fff; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 12px; }
.logout-link { background: none; border: none; color: #94a3b8; font-size: 12px; cursor: pointer; text-decoration: underline; }

.nav-pills { display: flex; background: #f1f5f9; padding: 4px; border-radius: 10px; }
.pill { padding: 8px 16px; border-radius: 8px; text-decoration: none; color: #64748b; font-size: 14px; font-weight: 600; }
.pill.active { background: #fff; color: #0f172a; box-shadow: 0 2px 4px rgba(0,0,0,0.05); }

/* 상단 안내 배너 */
.guide-banner {
    background: #f1f5f9;
    color: #000;
    padding: 30px;
    border-radius: 20px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin:20px 0;
}
.guide-content h2 { margin: 0 0 5px 0; font-size: 1.5rem; }
.guide-content p { margin: 0; opacity: 0.8; font-size: 14px; }
.status-badge { background: #fbbf24; color: #78350f; padding: 6px 12px; border-radius: 20px; font-weight: bold; font-size: 12px; }

/* 리스트 스타일 */

.lecture-list{display: flex;flex-wrap: wrap;}
.lecture-row {
    display: flex;    
    align-items: center;
    padding: 25px 20px;
   /* border-bottom: 1px solid #e2e8f0;*/
    transition: all 0.2s;
    width: 49%;
    margin: 10px auto;
    border:1px solid #1a5f63;
    border-radius: 18px;
}
.lecture-row:hover { background-color: #f8fafc; padding-left: 40px; border-radius: 12px; }

.time-col { width: 60px; font-weight: bold; color: #64748b; font-size: 14px; }
.content-col { flex: 1; padding: 0 20px; }
.subject { margin: 0 0 4px 0; font-size: 1.1rem; color: #1e293b; line-height: 1.4; }
.doctor { margin: 0; color: #4F4F4F; font-size: 1rem; }
.doctor small { margin-left: 8px; opacity: 0.7; font-size: 0.9rem; }

.btn-col { text-align: center; }
.play-circle a{
    width: 45px;
    height: 45px;
    border-radius: 50%;
    border: none;
    background:#1e293b ;
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: 0.3s;
    margin: 5px auto;
}
.play-circle a:hover { background:#e74c3c ; color: #fff; transform: scale(1.1); }
.state-txt { font-size: 12px; color: #333; }

/* ★ 반응형 모바일 */
@media (max-width: 768px) {
    .header-section { flex-direction: column-reverse; gap: 20px; align-items: flex-start; }
    .guide-banner { flex-direction: column; align-items: flex-start; gap: 15px; font-size: .8rem; }
    .lecture-row { position: relative; padding-bottom: 20px; width: 100%;}
/*    .btn-col { position: absolute; bottom: 15px; left: 80px; display: flex; align-items: center; gap: 10px; }*/
    .play-circle { width: 35px; height: 35px; margin-bottom:5px; margin: 5px auto;}
    .btn_out{background-color:#fff; color:#000 !important; font-size:12px; font-family:'Dotum'; padding:4px 7px 2px 7px;}
}