@charset "UTF-8";


.Dday {
    position: absolute;
    width: 100%;
    background: rgba(0, 0, 0, .9);
    color: #fff;
    z-index: 100;
    padding: 13px 15px;
    display: flex;
}

.Dday p {
    display: inline-block;
    padding: 1px 10px;
    font-size: 14px;
    color: #fff;
    border: 1px solid #fff;
    border-radius: 30px;
}

.Dday dl {
    position: absolute;
    right: 46px;
    top: 4px;
}

.Dday dt:after {
    content: "일";
    vertical-align: 2px;
    color: #fff;
    font-size: 0.5em;
}

.Dday dt,
.Dday dd {
    display: inline-block;
}

.Dday dd li,
.Dday dt {
    display: inline-block;
    color: #fff;
    font-size: 1.7em;
    letter-spacing: -1px;
    font-weight: bold;
}

.Dday dd li:after {
    content: " : ";
    vertical-align: 4px;
}

.Dday dd li:last-child:after {
    content: "";
}



.sub_content {
    min-height: 340px;
    box-sizing: border-box;
    overflow: hidden;
}

.begin_Lectures_m {
    position: relative;
}

.topImg_m {
    background: #1677fa;
    height: 200vw;
    width: 100%;
    position: relative;
}

.topImg_m img {
    width: 100%;
    position: absolute;
    bottom: 0;
}

.topImg_m ul {
    position: relative;
    top: 34.66vw;
    text-align: center;
    
}

.topImg_m li:nth-child(1) {
    font-size: 8.61vw;
    color: #fff;
    font-weight: 900;
    padding: 2vw;
}

.topImg_m li:nth-child(2){
    font-size: 10vw;
    color: #ffe463;
    border: #ffe463 4px solid;
    border-radius: 16px;
    font-weight: 900;
    width: 90vw;
    margin: 0 auto;
    padding: 0.6vw;
    letter-spacing: -3px;
}

.topImg_m p {
    position: absolute;
    font-size: 5.83vw;
    top: 139.9vw;
    left: 36vw;
    line-height: 11vw;
    font-weight: 700;
    color: #fff;
}

.section01 {
    background: #0b1841;
    width: 100%;
    height: 115vw;
    text-align: center;
}

.section01 h2 {
    padding: 16.6vw 0 11.1vw 0;
}

.section01 iframe {
    width: 91.66vw;
    height: 51.52vw;
}

.section02 {
    position: relative;
    margin: 0 auto;
    width: 100%;
    text-align: center;
}

.section02 .lecture img {
    width: 91.66vw;
    margin: 20vw auto 0;
    text-align: center;
}

/* 탭 */

.section02 .bg-tab {
    background: #fff;
    padding-top: 50px;
}

.section02 .tab_wp {
    width: 100%;
    margin: auto;
    border-bottom: 3px solid #232227;
    box-shadow: 1.5px 2.6px 0 0 rgba(129, 129, 129, 0.25);

}

.section02 .tab_wp.fix {
    background: #fff;
    position: fixed;
    top: 0;
    z-index: 100;
    padding: 8px 0 0;
}

.section02 .conts_tab {
    margin: auto;
    overflow: hidden;
    text-align: center;
    display: table;
}

.section02 .conts_tab li {
    float: left;
    position: relative;
    margin-left: 2px;
}

.section02 .conts_tab li:first-child {
    margin-left: 0;
}

.section02 .conts_tab li a {
    background: #e2e1e6;
    color: #232227;
    display: inline-block;
    width: 17.77vw;
    height: 11.4vw;
    line-height: 5vw;
    font-size: 3.9vw;
    padding-top: 10px;
    border-radius: 10px 10px 0 0;
    text-align: center;
}

.section02 .conts_tab li.on a {
    color: #fff;
    background: #232227;
}


/* 버튼 */
.button {
    width: 90%;
    margin: 30px auto;
    display: block;
}

.btn_black {
    display: block;
    position: relative;
    height: 16vw;
    border-radius: 16px;
    background-color: #232227;
    margin-bottom: 1.6vw;
    cursor: pointer;
}

.btn_black p {
    color: #fff;
    font-size: 4.44vw;
    font-weight: 500;
    text-align: center;
    line-height: 16vw;
}

.btn_white {
    margin-top: 1.5vw;
    display: block;
    position: relative;
    height: 16vw;
    border-radius: 16px;
    border: solid 3px #232227;
    box-sizing: border-box;
    background-color: #fff;
    cursor: pointer;
}

.btn_white p {
    font-size: 4.44vw;
    font-weight: 500;
    text-align: center;
    color: #232227;
    padding-top: 1.7vw;
}

.btn_white span {
    font-size: 3.2vw;
}

.section03 {
    background: #efeff4 url(https://cdn.ibstudy.co.kr//mobile/event/2024/begin_Lectures_m_240624/imgs/img_03.png) no-repeat center;
    background-size: contain;
    height: 200vw;
    margin-top: 16.66vw;
    display: flex;
    align-items: flex-end;
    justify-content: center;
}

.section03 img {
    display: block;
}

/* popup */
.popup-wrapper{position: fixed; width: 100%; height: 100%; top: 0; left: 0; background: rgba(0,0,0,0.5); display: inline-flex; align-items: center; z-index: 3; word-spacing: 0; overflow-x: hidden;}  
.closeX{position: absolute; top: 0.3em; right: -0.2em; width: 1em; line-height: 0.8rem; font-size: 4em; text-align: center; cursor: pointer; color: #000; text-decoration: none;}
.pop_wrap{position: relative; background: #fff; width: 80%; margin: 0 auto; padding: 1em; border-radius: 0.3em; border: 0.15em solid #000;}

.pop_conts{overflow-y: auto; margin-bottom: 30%;}
.popup-wrapper .pop_tit{text-align: center; font-size: 0.9em;}
.popup-wrapper .tit{font-weight: 800; font-size: 1.5em; border-bottom: 0.01em solid #000; margin: 0 0 0.5em; padding-bottom: 0.2em; color: #000 !important}

.pop_conts table{table-layout: fixed; word-break: break-all; width: 92%; margin: 1em auto 0;}
.pop_conts table th,
.pop_conts table td{text-align: left; font-size: 1em; color: #555; font-weight: 500;}
.pop_conts table tr:nth-child(4) td{padding-top: 6%;}
.pop_conts table img{ width: 23px; vertical-align: middle;}
.pop_conts table span{margin:0 5px;}

.pop_wrap .btn{position: absolute; bottom: 0; left: 0; width: 100%; margin: 0 auto; background: #e41545; text-align: center; padding: 0.7em 0; color:#fff; font-weight: 900; font-size: 1.5em;}
.pop_conts a{color: #fff; text-decoration: none;}
.btn_view{background: #333; text-align: center; border-radius: 0.2em; padding: 0.8em 1.2em; font-size: 0.7em; position: absolute;}

.popup-wrapper input{width: 90%; border: 0; border-bottom: 0.1em solid #aaa; padding: 0; font-size: 1em; color: #000; font-weight: 600; height: 2.5em; border-radius: 0; margin-bottom: 0.5em;}    
.popup-wrapper select{font-size: 1em;}

.popup-wrapper input[type='text'].data{width:35%;}
.popup-wrapper select{padding: 1em; border:1px solid #ccc; }    
.popup-wrapper select option{font-size: 1em;}    
.popup-wrapper button{border:0; cursor: pointer; padding: 0; margin-right: 15px;} 

.popup-wrapper textarea, 
.popup-wrapper select{border-radius: 1em; width: 19em; padding: 0.7em; color: #000; font-size: 0.7em; height: 3em}
.popup-wrapper label{cursor: pointer; font-size: 1em; padding: 0; letter-spacing: -0.1em;}
.popup-wrapper input[type='checkbox']{width: 20px; height: 20px; vertical-align: middle; accent-color: #e41545; margin-right: 5px;}

.popup-wrapper button{background: none;}

.popup-wrapper input:focus,
.popup-wrapper textarea:focus, 
.popup-wrapper select:focus{outline: none;}
.popup-wrapper textarea::placeholder{font-size: 13px; color: #ccc;}