/********** 초기화 **********/
body {font-family: 'Noto Sans KR'; letter-spacing: -0.01em; line-height: 1.4;}
textarea, select,button {font-family: 'Noto Sans KR';}

/********** 공통 **********/
/**** header ****/
.header {background-color: #fff;}
.top_wrap {
	height:61px; 
	padding: 15px 20px; position: relative;
	display: flex; align-items: center; justify-content: space-between;
}
.top_wrap .logoimg {
	margin:0px;
	position: absolute; top: 50%; left: 50%;
	transform: translate(-50%,-50%); -webkit-transform: translate(-50%,-50%); -moz-transform: translate(-50%,-50%); -ms-transform: translate(-50%,-50%); -o-transform: translate(-50%,-50%);
}
.top_wrap .top_log_btn {
    margin: 0; 
	font-size:8px;
	clear:both; top: 0;
}
.menu-icon {
	padding:1px 5px 12px;
	top:0px;right:0;
}
.menu {width: 30px;}
.menu.active {position: fixed; right: 20px; top: 7px;}
.bar {width: 19px; height: 2px;}

/**** hambuger fixed_menu ****/
.sitenavigation.is-tapped {position: fixed; top: 0; left: 0; right: 0; bottom: 0; z-index: 200; background-color: #f5f5f5;}
.sitenavigation.is-tapped .login {
	max-width:initial; 
	padding:0;
	position:relative; top:0; z-index:initial;
	box-shadow: 0 2px 10px 0 #E2E2E2;
}
.sitenavigation .login_top {
	padding: 15px 20px;
	border-bottom: 1px solid rgba(0,0,0,0.14);
	font-size: 12px; font-weight: 700; letter-spacing: -1px;
	display: flex; align-items: center; justify-content: space-between;
}
.sitenavigation .login_top .top_login_btn_wrap {
	margin-right: 35px;
	display: flex; align-items: center; justify-content: center; column-gap: 4px;
}
.top_login_btn {
	display: flex; align-items: center; justify-content: center; column-gap: 2px;
	padding:0px 7px; margin:0;
	border: 1px solid #211686; border-radius:100px; -webkit-border-radius:100px; -moz-border-radius:100px; -ms-border-radius:100px; -o-border-radius:100px;
	height:initial;
	line-height:27px; font-size:13px; color: #211686; letter-spacing: -0.02em;
	background-color: #fff;
}
.sitenavigation .login_bottom {background-color: #fff; padding: 14px 20px;}
.login_bottom .menu_top {
	margin:0 auto; 
	background:#000C8E; 
	padding:1.4vh 0; 
	border-radius:10px; -webkit-border-radius:10px; -moz-border-radius:10px; -ms-border-radius:10px; -o-border-radius:10px; 
}
.login_bottom .menu_top dl dd {color: #fff; font-size: 13px;}
.login_bottom .menu_top dl dd p {margin-top: 1.3vh;}

.sitenavigation.is-tapped > ul {
	top:190px;
	background:#fff;
	box-shadow: 0 2px 10px 0 #E2E2E2;
}
.sitenavigation.is-tapped .snb_list.active > span {color:#211686;}
.sitenavigation.is-tapped .snb_list.active > ul {display: block;}
.sitenavigation.is-tapped > ul > li > span {padding:2.5vh 20px; font-size: 16px;}
.sitenavigation.is-tapped > ul ul {
	border-left:1px solid #EAEAEA;
	margin:0px !important; 
}
.sitenavigation.is-tapped > ul ul .nav_title {
	margin-top: 10px;
	padding: 2.5vh 20px;
	font-size: 16px; font-weight: 700;
}
.sitenavigation.is-tapped > ul ul > li {border-bottom: 1px solid rgba(239, 239, 239, 0.6);}
.sitenavigation.is-tapped > ul ul > li:last-child,
.sitenavigation.is-tapped > ul ul > li:first-child {border-bottom: none;}
.sitenavigation.is-tapped > ul ul a {
	color:#333;
	padding:1.5vh 0px 1.5vh 38px; margin:0px auto;
	width:100%;
	border-bottom: none;}
.sitenavigation.is-tapped > ul ul a .edu_tag {
	float: initial;
	margin-left: 10px; padding: 2px 4px 3px;
	font-family: 'Noto Sans KR'; font-size: 13px; line-height: 2; text-align: center; color: #fff; font-weight: 400;
	background-color: #000C8E;
	border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; -ms-border-radius: 5px; -o-border-radius: 5px;
}

.sitenavigation.is-tapped .cs_tel {
	width:calc(100% - 168px); max-width:initial;
	display:block;
	position:absolute; bottom:20px; right:9px; z-index:200;
	background:#F5F5F5 !important; box-shadow:none;
	padding:11px;
	border: 1px solid #E8E8E8; border-radius: 5px;-webkit-border-radius: 5px; -moz-border-radius: 5px; -ms-border-radius: 5px; -o-border-radius: 5px;
	box-sizing:border-box;
}
.sitenavigation.is-tapped .cs_tel .cs_tel_info{margin-bottom: 1.5vh;}
.sitenavigation.is-tapped .cs_tel dl {display: block;}
.sitenavigation.is-tapped .cs_tel .cs_tel_info dt {color:#333; font-size: 1.2vh; font-weight: 400; letter-spacing: -1px; line-height: 2;}
.sitenavigation.is-tapped .cs_tel dd {font-size: 2.4vh; font-weight: 700; color:#000C8E; padding: 0; width: 100%;}
.sitenavigation.is-tapped .cs_tel .cs_time dd {color:#333; font-size: 10px; font-weight: 400; letter-spacing: -1px;}


/* footer */
footer {background: linear-gradient(#0D0741, #080520);}
.footer_menu {border: none;}
.footer_menu li {flex:1;flex-basis:auto;text-align:left;font-size:0.9286rem;letter-spacing:-1px; border-right: 0px; color: #888699; font-weight: 900;}
.footer_menu li:nth-child(2) {color: #ffffff}
.footer_wrap {padding-bottom:26vw;}
.footer_wrap p {display:block;font-size:0.7rem; word-break: auto-phrase; letter-spacing: -0.01em;}


/********** INDEX 화면 **********/
.main_wrap {background-color: #f5f5f5; padding: 15px 0;}
.main_img { top: 0px; border-radius:5px ; -webkit-border-radius:5px ; -moz-border-radius:5px ; -ms-border-radius:5px ; -o-border-radius:5px ; overflow: hidden;}

/*main section(공통)*/
.main_sec {
	position: relative;
	background-color: #fff; box-shadow: 0 2px 10px 0 #E2E2E2;
	border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; -ms-border-radius: 5px; -o-border-radius: 5px;
	padding: 33px 20px; margin-top: 15PX;
    letter-spacing: -0.01em;
}
.main_sec .sec_title {
	font-size: 20px; font-weight: 700; color: #121212; letter-spacing: -0.05em;
	margin-bottom: 28px;
}

/*slider*/
.bar_list {
	position: absolute; bottom: 5px; right: 5px; z-index: 10;
	background-color: rgba(0,0,0,0.5);
	border-radius: 50%; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%;
}
.bar_list .bar_wrap {position: relative; width: 72px; height: 72px;}
.bar_list .donut-progress {
	width: 50px; height: 50px;
	position: absolute; top: 50% ; left: 50%;
	transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%);
}
.donut-progress svg { 
    transform: rotate(-90deg) rotateX(-180deg); -webkit-transform: rotate(-90deg) rotateX(-180deg); -moz-transform: rotate(-90deg) rotateX(-180deg); -ms-transform: rotate(-90deg) rotateX(-180deg); -o-transform: rotate(-90deg) rotateX(-180deg); 
    --progress: 1; stroke-dashoffset: calc(200px * (1 - var(--progress))); stroke-dasharray: 200;
}
/* .donut-progress .bg { fill: none; stroke: transparent;} */
.donut-progress .progress { fill: none; stroke-linecap: round; transition: stroke-dashoffset 0.4s ease; -webkit-transition:stroke-dashoffset 0.4s ease;; -moz-transition:stroke-dashoffset 0.4s ease;; -ms-transition:stroke-dashoffset 0.4s ease;; -o-transition:stroke-dashoffset 0.4s ease;; }
.progress-text {
	position: absolute; top: 50%; left: 50%;
	transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%);
	color: rgba(255,255,255,0.59); font-size: 15px; font-weight: 700; font-family: 'GmarketSans'; letter-spacing: -2px;
}
.progress-text > b {font-size: 20px; color: #fff;}



/*개강정보*/
.semester_list > li { 
	display: flex; align-items: stretch; justify-content: space-between; column-gap: 3px; 
	font-size: 15px; font-weight: 900; line-height: 38px; text-align: center;  letter-spacing: -0.05em;
}
.semester_list .semester_name {
	width: calc(50% - 2px);
	padding: 0 9px;
	color: #fff; text-align: left;
	background: #015AA9;
	border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; -ms-border-radius: 5px; -o-border-radius: 5px;
}
.semester_list .semester_date {width: calc(25% - 4px);}
.semester_list .semester_dday {
	position: relative;
	width: calc(25% - 2px);
	background-color: #FF9500;
	color: #fff;
	border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; -ms-border-radius: 5px; -o-border-radius: 5px;
}
.deadline {
	background-color: #DE2525;
	border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; -ms-border-radius: 5px; -o-border-radius: 5px;
	color: #fff; font-size: 13px; font-weight: 700; text-align: center; line-height: 18px;	word-break: keep-all;
	padding: 0 5px;
	position: absolute; top: -25px; left: 50%;
	transform: translateX(-50%); -webkit-transform: translateX(-50%); -moz-transform: translateX(-50%); -ms-transform: translateX(-50%); -o-transform: translateX(-50%);
	animation: jump 3s linear 1s infinite running; -webkit-animation: jump 1s linear 2s infinite running;
}
.deadline::after {
	content: "";
	width: 0; height: 0;
	border-style: solid; border-width: 6.062px 3.5px 0px 3.5px; border-color: #de2525 transparent transparent transparent;
	position: absolute; bottom: -5px;	left: 50%;
	transform: translateX(-50%); -webkit-transform: translateX(-50%); -moz-transform: translateX(-50%); -ms-transform: translateX(-50%); -o-transform: translateX(-50%);	
}
@keyframes jump {
  0% {top: -25px}
  50% {top: -30px}
  100% {top : -25px}
}


.cs_list {
	margin: 10px 0 15px;
	display: flex; align-items:stretch; justify-content: space-between;
}
.cs_list > div {
	border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; -ms-border-radius: 5px; -o-border-radius: 5px;
	overflow: hidden;
	padding: 16px 8px; font-weight: 700; letter-spacing: -0.05em;
}
.cs_list .cs_num1 {
	width: calc(50% - 2px);
	border:1px solid #fbfbfb;
	background: linear-gradient(#1679d1, #00529b);
	color: #fff;
}
.cs_list .cs_num2 {
	width: calc(50% - 2px);
	border: 1px solid #EEEEEE;
	background: #FAFBFB;
	color: #015AA9;
}
.cs_list p {font-size: 16px; margin-bottom: 6px;}
.cs_list h3 {font-family: 'GmarketSans'; font-size: 27px;}
.cs_time {display: flex; align-items: center; justify-content: center; column-gap: 5vw;}
.cs_time li {position: relative; color: #666; font-size: 12px; font-weight: 400;}
.cs_time li:first-child::before {
	content: "";
	width: 1px; height: 21px;
	background-color: #666;
	position: absolute; top: 50%; right: -10px;
	transform: translateY(-50%); -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%);
}


/*브랜드배너*/
.brand_banner { 
	margin-top: 15px; 
	border-radius:3px ; -webkit-border-radius:3px ; -moz-border-radius:3px ; -ms-border-radius:3px ; -o-border-radius:3px ; 
	overflow: hidden;
}
.brand_banner > img {width:100% !important;margin:0px auto;display:block;}

/*교육과정 및 이벤트 배너*/
.edu_list {display: flex; align-items: center; justify-content: space-between; column-gap: 3px; margin-right: 20px;}
.edu_list > li {
	width: calc(25% - 3px);
	border: 1px solid #ebebeb; border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; -ms-border-radius:5px; -o-border-radius:5px;
	background-color: #FAFBFB; 
	color : #4F4F53; text-align: center; font-size: 12px; font-weight: 700;
	padding: 13px 0;  
}
.sub_banner_wrap {margin-top: 15px; }
.sub_banner_wrap .sub_banner { 
    border: 1px solid #ebebeb; border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; -ms-border-radius: 5px; -o-border-radius: 5px; 
	overflow: hidden;
}
.sub_banner_wrap .sub_banner img {width:100% !important;margin:0px auto;display:block;  object-fit: contain;}

/*공지사항*/
.more {
	float: right;
	font-size: 13px; font-weight: 500; color: #211686; line-height: 27px; letter-spacing: -0.02em;
	border: 1px solid #211686;
	border-radius: 28px; -webkit-border-radius: 28px; -moz-border-radius: 28px; -ms-border-radius: 28px; -o-border-radius: 28px;
	box-shadow: 2px 2px 6px 0 rgba(200, 200, 200, 0.1);
	padding: 0 20px;
}
.notice_list > li {
	padding : 15px 0; font-size: 14px; color: #666666;
	border-top: 1px solid #EAEAEA;
}
.notice_list > li:first-child {
	padding-top: 9px; border-top: none;
}
.notice_list .move {
	float: right;
	border-radius: 3px; -webkit-border-radius: 3px; -moz-border-radius: 3px; -ms-border-radius: 3px; -o-border-radius: 3px;
	font-family: 'GmarketSans'; color: #fff; line-height: 23px; font-size: 10px; font-weight: 700; text-align: center;
	background-color: #211686;
	width: 20px; height: 20px;
}


/**** 수강신청 ****/
/** 메뉴탭 **/
.menu_tab_wrap {padding: 23px 20px 15px; background-color: #f5f5f5;}
.menu_tap {
    width: 100%;
    margin: 0 auto; padding: 3px;
    background-color: #fff;
    border-radius: 100px; -webkit-border-radius: 100px; -moz-border-radius: 100px; -ms-border-radius: 100px; -o-border-radius: 100px;
    display: flex; align-items: center; justify-content: space-between;
    box-shadow: 0 2px 10px 0 rgba(226, 226, 226, 0.25);
    overflow: hidden;
}
.menu_tap > li {
    text-align: center; color: #000C8E; font-size: 16px; font-weight: 400; line-height: 140%; letter-spacing: -0.05em;
    background-color: inherit;
    padding: 4px 0 5px; margin: 0;
}
.menu_tap.menu_tap02 > li {width: 50%;}
.menu_tap.menu_tap03 > li {width: 33%;}
.menu_tap.menu_tap04 > li {width: 25%;}
.menu_tap .on {
    margin: 0;
    border: none; background-color: #000C8E; 
    font-weight: 700; color: #fff; 
    border-radius: 100px; -webkit-border-radius: 100px; -moz-border-radius: 100px; -ms-border-radius: 100px; -o-border-radius: 100px;
}

/** 단과수강신청 **/
/*(학기)*/
.sub_warp {padding: 0; background-color: #f5f5f5;}
.hakgi_wrap {
    padding: 32px 20px 27px;
    border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; -ms-border-radius: 5px; -o-border-radius: 5px;
    background-color: #fff;
    box-shadow:  0 2px 10px 0 #E2E2E2;
}
.sub_tit1 {
    font-size: 20px; line-height: 1.4; letter-spacing: -0.05em; color: #121212;
    padding: 0; margin-bottom: 27px;
}
.year_tap {display: grid;  grid-template-columns: 1fr 1fr; column-gap: 10px; row-gap: 10px; align-items: stretch; justify-items: stretch; margin-bottom: 0;}
.year_tap li {
    width: 100%;
    margin: 0; padding: 12px 15px 13px;
    border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; -ms-border-radius: 5px; -o-border-radius: 5px; border: 1px solid #E8E8E8;
    background-color: #F5F5F5;
    text-align: left; color: rgba(18, 18, 18, 0.6); font-size: 15px;
}
.year_tap li h5 {font-size: 16px; font-weight: 700; color: #121212}
.year_tap .course_on {border: 1px solid #000C8E; background-color: #000C8E;}
.year_tap .course_on h5 {color: #fff}
.year_tap .course_on {color: rgba(255, 255, 255, 0.6)}

/*(과목tab)*/
.class_tab_wrap {
    overflow: hidden; position: relative;
    padding: 15px 20px; 
    background: #f5f5f5;
    transition-duration: 0.5s;
    height: 70px;
}
.class_tap2 {
    display: flex; align-items: stretch; overflow-x: hidden; column-gap: 10px;
    width: max-content;
    border: none;
    margin: 0;
}
.class_tap2 li {
    width: auto;
    display: inline;
    padding: 8px 13px 9px;
    border-radius: 100px; -webkit-border-radius: 100px; -moz-border-radius: 100px; -ms-border-radius: 100px; -o-border-radius: 100px;
    background-color: #FFFFFF;
    border: 1px solid #d9d9d9;
    font-size: 15px; font-weight: 700; color: #686868; letter-spacing: -0.01em;
}
.class_tap2 li:nth-child(n+4) {display: none;}
.class_tap2 .check { background-color: #FF9500; border: 1px solid #FF9500;}
.open_tab {
    position: absolute; top: 20px; right: 18px;
    width: 35px; height: 35px;
    background-color: #FFFFFF;
    border-radius: 50%; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; border: 1px solid #bfbfbf;
    box-shadow: 0 0 50px 50px #f5f5f5;
}
.open_tab::before {
    content: "";
    background: url(/mobile/common/img/after_img/icon_down.png) center no-repeat;
    display: block;
    width: 100%; height: 100%;
    transition-duration: 0.5s;
}
.class_tab_wrap.on {height: auto;}
.class_tab_wrap.on .class_tap2 {
    width: 100%; flex-wrap: wrap;
    padding-right: 35px; row-gap: 9px;
}
.class_tab_wrap.on .open_tab {box-shadow: none;}
.class_tab_wrap.on .open_tab::before { rotate:180deg }
.on {margin: 0;}
.class_tab_wrap.on .class_tap2 li:nth-child(n+4) {display: block;}

.course_add {
    position: fixed; bottom: 14vh; left: 20px; z-index: 1;
    width: calc(100% - 40px);
    border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; -ms-border-radius: 5px; -o-border-radius: 5px; border: 1px solid #E8E8E8;
    margin: 0 auto; padding: 14px 20px 17px;
    background-color: rgba(245, 245, 245, 0.93);
    display: none;
}
.course_add .course_wrap { display: flex; align-items: flex-start; justify-content: space-between;}
.course_add div {
    display: block;
    padding: 0; margin: 0;
    background: initial;
    border-radius: 0 ; -webkit-border-radius: 0 ; -moz-border-radius: 0 ; -ms-border-radius: 0 ; -o-border-radius: 0 ; -moz-border-radius: 0 ;
} 
.course_add .add_left {width: 73%; position: relative;}
.course_add .course_count {font-size: 15px; color: #121212; margin-bottom: 5px;}
.course_add .no_subject {font-size: 13px; color: #888;  line-height: 1.4;}
.course_add .add_right {width: 25.2%;}
.course_add .course_add_btn {
    background: linear-gradient(#0D0741, #080622);
    width: initial; height: initial;
    font-size: 15px; line-height: 1.4;
    padding: 11px 0;
}
.course_add .subject {display: grid; grid-template-columns: 1fr 1fr; column-gap: 5px; row-gap: 5px;}
.subject img { margin-right: 5px;}
.subject div {
    font-size: 3.03vw; color: #888;
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.add_left .subject > div:nth-child(n+5) {display: none;}
.add_left.on .subject > div:nth-child(n+5) {display: block;}
.add_left .page_open {
    position: absolute; bottom: 1px; right: 11px;
    background: #F5F5F5;
    box-shadow: -20px 0 30px 13px rgba(245, 245, 245, 0.93);
    font-size: 3.03vw; color: #000; line-height: 1.4;
    display: none;
}
.add_left .page_open.on {position: relative; text-align: right; box-shadow: none;}


/*과목신청 리스트*/
.my_tbl01 {
    background-color: #fff;
    border: none;  border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; -ms-border-radius: 5px; -o-border-radius: 5px;
    box-shadow: 0 2px 10px 0 #E2E2E2;
}
.my_tbl01 td {
    border-bottom: 1px solid rgba(239, 239, 239, 0.6);
    padding: 20px 10px 22px;
    width: auto; height: auto;
}
.my_tbl01 td:first-child {padding-left: 20px;}
.my_tbl01 td:last-child {padding-right: 20px;}
.subject_check {display: none;}
.subject_check + label::before {
    content: "";
    width: 16px; height: 16px;
    background-color: #F5F5F5;
    border-radius: 3px; -webkit-border-radius: 3px; -moz-border-radius: 3px; -ms-border-radius: 3px; -o-border-radius: 3px; border: 1px solid #BABABA;
    display: block;
}
.my_tbl01 td:nth-child(2){padding: 20px 0 22px;}
.subject_check:checked + label::before{
    background: #000C8E url(/mobile/common/img/after_img/icon_cheked.png) center no-repeat;
    border: 1px solid #000C8E;
}
.btn_sample {
    font-size:15px; color: #000C8E; line-height: 1.4;
    border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; -ms-border-radius: 5px; -o-border-radius: 5px; border: 1px solid #000C8E;
    padding: 1px 11px 3px; margin-bottom: 10px;
}
.my_class {font-size:15px; margin-top: 1px;}
.my_money {font-size: 13px; color: #9C0000; line-height: 1.4;}
.my_small {font-size: 13px; color: #888; line-height: 1.4;}
.my_small span {
    line-height: 1.4; 
    border: none; 
    position: relative;
    margin-left: 6px; padding-left: 14px;
}
.my_small span::before {
    content: "";
    width: 1px; height: 15px;
    background-color: #888;
    display: block;
    position: absolute; top: 50%; left: 0;
    transform: translateY(-50%); -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%);
}
.my_small .my_small_tag > div {
    color: #fff;
    font-size: 10px;
    border-radius:2px ; -webkit-border-radius:2px ; -moz-border-radius:2px ; -ms-border-radius:2px ; -o-border-radius:2px ;
    padding: 0 4.5px;
}
.package_btn_class3 {background-color: #389DFD; color : #fff;} /*전필*/
.package_btn_class1 {background-color: #7338FD; color : #fff;} /*전공*/
.package_btn_class2 {background-color: #FD38C2; color : #fff;} /*교양*/
.btn_basket2, .btn_basket3, .btn_basket4, .btn_basket5 {
    height: 75px;
    background-color: #FF9500;
    font-size: 15px; line-height: 1.4;
    padding-top: 25px;
    border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; -ms-border-radius: 5px; -o-border-radius: 5px;
}
.btn_basket4 {background-color: #BABABA;}
.btn_basket3, .btn_basket5 {background-color: #434343;}
.btn_basket5 {
    text-align: center; font-weight: 500; color: #fff;
    border: none;
    display: block;
}

/*패키지과목*/
.sub_warp {background-color: #fff;}
/*(개강반)*/
.pack_tap2 {column-gap: 10px; row-gap: 10px; margin-bottom: 24px;}
.pack_tap2 li {
    border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; -ms-border-radius: 5px; -o-border-radius: 5px; border: 1px solid #E8E8E8;
    padding: 13px 15px 15px; margin: 0;
    text-align: initial;
    width: calc(50% - 5px);  
    background-color: #F5F5F5;
}

.pack_tap2 li .pakc_tit {font-size: 16px; line-height: 1.4; word-break: keep-all; }
.pack_tap2 li dt, .pack_tap2 li dd {margin: 0; color: rgba(18, 18, 18, 0.6);}
.pack_tap2 li .study_date dt, .pack_tap2 li .study_date dd {color: #121212; font-weight: 700;}

.pack_tap2 li.on .pakc_tit {color: #000C8E; }
.pack_tap2 li.on {background-color: #000C8E;}
.pack_tap2 li.on .pakc_tit {color: #fff; font-size: 16px;}
.pack_tap2 dl {
    text-align: left; font-size: 13px; font-weight: 500; line-height: 1.4; letter-spacing: -0.01em; color: rgba(255, 255, 255, 0.6);
    margin-top: 6px;
}
.pack_tap2 li.on dt, .pack_tap2 li.on dd {color: rgba(255, 255, 255, 0.6);}
.pack_tap2 li.on .study_date dt, .pack_tap2 li.on .study_date dd {color: #FFF600;}
.pack_tap2 li:hover {border: 1px solid #E8E8E8;}

/*(안내문)*/
.package_txt1 {
    width: 100%;
    border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; -ms-border-radius: 5px; -o-border-radius: 5px; border: 1px solid #E8E8E8;
    background-color: #F5F5F5;
    padding: 14px 15px;
    display: flex; flex-direction: column; row-gap: 10px;
}
.package_txt1 li {
    padding: 0 0 0 10px;
    background-color: initial;
    font-size: 12px; line-height: 1.3; letter-spacing: -0.04em; color: #121212; font-weight: 500; word-break: keep-all;
    position: relative;
}
.package_txt1 .ps_line {position: relative; padding-left: 10px;}
.package_txt1 .ps_line::before {
    content: "";
    width: 3px; height: 3px;
    border-radius: 50%; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%;
    background-color: #FF0000;
    position: absolute; top: 7px; left: 0;
}

.package_txt1 li::before {
    content: "";
    width: 3px; height: 3px;
    border-radius: 50%; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%;
    background-color: #121212;
    position: absolute; top: 7px; left: 0;
}
.package_txt1 li:first-child, .package_txt1 li:last-child {padding: 0 0 0 10px;}


/*(패키지 리스트)*/
.pack_tap {
    display: flex; align-items: stretch; justify-content: space-between;
    column-gap: 10px; row-gap: 10px;
}

.pack_tap > li {
    width: calc(50% - 5px);
    padding: 12px 15px 14px; margin: 0;
    border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; -ms-border-radius: 5px; -o-border-radius: 5px; 
    background-color: #F5F5F5;
    text-align: initial;
    
}
.pack_tap li h4 {font-size: 16px; line-height: 1.4; letter-spacing: -0.01em; word-break: keep-all;}
.pack_tap li p { 
    top: initial; transform:initial ; -webkit-transform:initial ; -moz-transform:initial ; -ms-transform:initial ; -o-transform:initial ; 
    font-size: 15px; line-height: 1.4; letter-spacing: -0.01em; text-align: initial; color: rgba(18, 18, 18, 0.6);
    margin-top: 2px;
}
.pack_tap li.on > h4 {color:#fff}
.pack_tap li.on > p {color: rgba(255, 255, 255, 0.6)}

.pack_tap .blue {background-color: #D5D7E9; border: 1px solid #D5D7E9;}
.pack_tap .blue > h4 {color: rgba(0, 12, 142, 0.7)}
.pack_tap .blue.on {background-color: #000C8E; border: 1px solid #000C8E;}
.pack_tap .pink {background-color: #F2DAEC; border: 1px solid #F2DAEC;}
.pack_tap .pink > h4 {color: rgba(179, 0, 134, 0.7)}
.pack_tap .pink.on {background-color: #B30086; border: 1px solid #B30086;}
.pack_tap .green {background-color: #D1F0E4; border: 1px solid #D1F0E4;}
.pack_tap .green > h4 {color: rgba(0, 156, 93, 0.7)}
.pack_tap .green.on {background-color: #009C5D; border: 1px solid #009C5D;}
.pack_tap .black {background-color: #CFCFCF; border: 1px solid #CFCFCF;}
.pack_tap .black > h4 {color: rgba(64, 64, 64, 0.7)}
.pack_tap .black.on {background-color: #404040; border: 1px solid #404040;}


/*(개강과목리스트)*/
.package_tbl01 { border-radius:5px ; -webkit-border-radius:5px ; -moz-border-radius:5px ; -ms-border-radius:5px ; -o-border-radius:5px ; overflow: hidden; border: 1px solid #E8E8E8; border-collapse: initial;}
.package_tbl01 thead tr {border: 1px solid #f5f5f5;}
.package_tbl01 th {
    overflow: hidden;
    background-color: #f5f5f5; 
    font-size: 11px; font-weight: 600; text-align: center; color: #515151; word-break: keep-all;
    border: none;
}
.package_tbl01 td {
    border-bottom: 1px solid rgba(239, 239, 239, 0.6);
    font-size: 10px !important; line-height: 1.4; color: #888;
}
.package_tbl01 tbody tr:last-child td {border-bottom: none}
.package_sample {background-color: #FDB138; padding: 0 4px; font-size: 10px;width: initial; }
.price {
    font-size: 18px; color: #333; line-height: 1.4; letter-spacing: -0.01em;
    margin-bottom: 20px;
}
.price > span {float: right; color: #FF0000}
.package_warning {
    width: 100%; height: 220px; overflow-y: scroll;
    border: 1px solid #E8E8E8; border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; -ms-border-radius: 5px; -o-border-radius: 5px;
    background: #f5f5f5;
    padding: 0 3px 0 15px; margin-bottom: 17px;
    color: #121212; font-size: 12px; letter-spacing: -0.03em; line-height: 1.3;
    white-space: pre-line;
}
.package_warning dt {font-weight: 500;}
.package_warning dd {color: #121212; font-size: 12px; letter-spacing: -0.03em; line-height: 1.3;}

.package_warning::-webkit-scrollbar {width: 27px; background-color: #F5F5F5;}
.package_warning::-webkit-scrollbar-thumb { 
    border: 12px solid #F5F5F5; border-radius: 100px; -webkit-border-radius: 100px; -moz-border-radius: 100px; -ms-border-radius: 100px; -o-border-radius: 100px; 
    background-color: rgba(92, 92, 92, 0.7);
}
.package_warning::-webkit-scrollbar-track { background-color: transparent; padding-right: 15px;}

.agree_check {font-size: 13px; font-weight: 400; line-height: 1.5; letter-spacing: -0.02em; color: #333333}
.package_check {display: none;}
.package_check_label {
    display: block;
    position: relative; padding-left: 20px;
}
.package_check + label::before {
    content: "";
    width: 13px; height: 13px;
    background-color: rgba(255, 255, 255, 0.3);
    border-radius: 3px; -webkit-border-radius: 3px; -moz-border-radius: 3px; -ms-border-radius: 3px; -o-border-radius: 3px; border: 1px solid #A6A6A6;
    position: absolute; top: 3px;left: 0;
}
.package_check:checked + label::before{
    background: #000C8E url(/mobile/common/img/after_img/icon_cheked.png) center no-repeat;
    border: 1px solid #000C8E;
}
.package_pay {
    margin: 17px auto 0; 
    width: 100%; max-width: initial; height: initial;
    background-color: #000C8E;
    font-size: 16px; line-height: 46px; letter-spacing: -0.02em; 
}

/** 강좌바구니 **/
#all_check {display: none;}
#all_check:checked + label {
    background-color: #404040;
    color:#fff;
}
#all_check:checked + label path {stroke: #fff;}

.cart_list_wrap {
    margin: 20px -20px;
    border-top: 1px solid rgba(239, 239, 239, 0.6);
}
.cart_list_wrap > li {
    border-bottom: 1px solid rgba(239, 239, 239, 0.6);;
    padding: 23px 20px 25px;
    position: relative;
}
.cart_list_wrap > li > * {display: flex; align-items: center;}
.cart_list_wrap > li > .subject_title {
    justify-content: space-between;
    font-size: 15px; font-weight: 700; line-height: 1.4; letter-spacing: -0.01em;
}
.cart_list_wrap > li > .subject_title .btn_my06 {
    color: #000C8E; font-weight: 500;
    background-color: initial;
    border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; -ms-border-radius: 5px; -o-border-radius: 5px; border: 1px solid #000C8E;
}
.cart_list_wrap > li > ul {align-items: center; justify-content: flex-start; column-gap: 30px;}
.cart_list_wrap > li > ul > li {position: relative; line-height: 1.4; letter-spacing: -0.01em; color: #888888}
.cart_list_wrap > li > ul > li::after {
    content: "";
    width: 1px; height: 11px;
    background-color: #888888;
    position: absolute; top: 50%; right: -15px;
    transform: translateY(-50%); -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%);
}
.cart_list_wrap > li > ul > li:last-child::after{ content: initial;} 
.cart_list_wrap > li .subject_info {font-size: 13px;  font-weight: 600;}
.cart_list_wrap > li .subject_price {margin-top: 5px; font-size: 12px;  column-gap: 20px;}
.cart_list_wrap > li .subject_price > li::after {right: -10px;}
.txt_dred {color: #9C0000}
.txt_dblue {color: #211686}
.year_new {
    display: flex; align-items: stretch; justify-content: space-between; column-gap: 10px;
    background-color: initial; 
    padding: 0; margin-top: 20px;
}
.year_new > li:nth-child(1) {width: calc(50% - 5px); font-weight: inherit;}
.year_new > li:nth-child(2) {width: calc(50% - 5px); padding: 14px 20px;}
.year_new > li {
    padding: 14px 20px;
    border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; -ms-border-radius: 5px; -o-border-radius: 5px; border: 1px solid #E8E8E8;
    background-color: rgba(245, 245, 245, 0.93);
    font-size: 13px; line-height: 1.4; letter-spacing: -0.01em; color: #888888;
}
.year_all > span,
.term_list >  li >span {margin-left: 4px;}
.year_new .term_list {
    padding: 0; margin: 13px 0 0 0; 
    border-bottom: none;
}
.year_new .term_list > li {
    width: 100%;
    font-size: 13px; line-height: 1.4; letter-spacing: -0.01em; color: #888888;
    padding: 0 0 0 14px; margin-bottom: 5px;
    position: relative;
    
}
.year_new .term_list > li::before {
    content: "";
    width: 3px; height: 3px;
    border-radius: 50%; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%;
    background-color: #211686;
    position: absolute; top: 50%; left: 5px;
    transform: translateY(-50%); -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%);
}
.price_info {
    padding: 20px 15px;
    border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; -ms-border-radius: 5px; -o-border-radius: 5px; border: 1px solid #E8E8E8;
    background-color: #F5F5F5;
    font-size: 15px; line-height: 1.4; letter-spacing: -0.01em; font-weight: 700; color: #333333;
    display: flex; align-items: center; justify-content: center; flex-direction: column; row-gap: 15px;
}
.price_info > li {
    width: 100%;
    display: flex; align-items: flex-start; justify-content: space-between;
}
.all_price {
    display: flex; align-items: center; justify-content: space-between;
    font-size: 18px; line-height: 1.4; letter-spacing: -0.01em; color: #333; font-weight: 700;
    margin: 40px 0 20px;
}



/************ LOGIN *****************/
.login_wrap {padding: 108px 20px 119px;}
.login_input_wrap {display: flex; flex-direction: column; align-items: stretch; justify-content: space-between; row-gap: 15px;}
.login_input_wrap input {
    background: initial;
    border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; -ms-border-radius: 5px; -o-border-radius: 5px; border: 1px solid #DADADA;
    padding: 20px 17px 22px; margin: 0;
    font-size: 15px; letter-spacing: -0.01em; line-height: 1.4;
    height: initial; 
}
.login_input_wrap > input::placeholder {font-weight: 600; color: rgba(0,0,0,0x.6)}
.login_input_wrap .find {
    display: flex; align-items: center; justify-content: center; column-gap: 48px;
    font-size: 13px; line-height: 1.4; letter-spacing: -0.01em; color : #888;
}
.login_input_wrap .find > li {position: relative;}
.login_input_wrap .find > li:first-child::after {
    content: "";
    width: 1px; height: 11px;
    background-color: #888;
    position: absolute; top: 50%; right: -24px;
    transform: translateY(-50%); -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%);
}
#ps_text {
    padding-left: 10px; 
    font-size: 13px; letter-spacing: -0.01em; line-height: 1.4; color: #FF0000; margin-top: 8px;
}
.certi_id:focus {outline: 2px solid red;} 
.main_btn {
    width: 100%;
    display: block;
    margin-top: 2px;
    background-color: #211686; 
    font-size: 16px; color: #fff; line-height: 46px; letter-spacing: -0.02em; text-align: center; font-weight: 700;
    border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; -ms-border-radius: 5px; -o-border-radius: 5px; border: 1px solid #DADADA;
}
.main_btn2 {
    width: 100%;
    display: block;
    margin-top: 2px;
    background-color: #1F62F1; 
    font-size: 16px; color: #fff; line-height: 46px; letter-spacing: -0.02em; text-align: center; font-weight: 700;
    border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; -ms-border-radius: 5px; -o-border-radius: 5px; border: 1px solid #DADADA;
}

.certi_list {display: flex; align-items: stretch; justify-content: space-between; flex-direction: column; row-gap: 10px; margin-bottom: 5px;}
.certi_list a {
    display: block;
    font-size: 16px; line-height: 46px; letter-spacing: -0.02em; color: #fff; font-weight: 700; text-align: center;
    border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; -ms-border-radius: 5px; -o-border-radius: 5px;

}
.certi_list a > span {position: relative; padding-left: 20px;}
.certi_list a.naver {background-color: #03C75A;}
.certi_list a.kakao {background-color: #FEE500; color: #121212}
.certi_list a.samsung {background-color: #1D4BC7;}
.certi_list a.pass {background-color: #FF3A4A;}

.certi_list a.naver > span::before {
    content: url(/mobile/common/img/after_img/naver.png);
    position: absolute; top: 42%; left: 3px;
    transform: translateY(-50%); -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%);
}
.certi_list a.kakao > span::before {
    content: url(/mobile/common/img/after_img/kakao.png);
    position: absolute; top: 50%; left: 0;
    transform: translateY(-50%); -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%);
}
.certi_list a.samsung > span::before,
.certi_list a.pass > span::before {
    content: url(/mobile/common/img/after_img/pass.png);
    position: absolute; top: 50%; left: 2px;
    transform: translateY(-50%); -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%);
}
#id.active:focus {outline: 2px solid #FF0000;}
#appCallPopup {z-index: 203;}



/************ JOIN *****************/
.join_main_wrap {padding: 24px 20px 50px;}
.join_per_wrap {top : 0}

/*본인인증*/
.img_box {margin: 83px auto}

/* 약관동의 */
.agreement_wrap {margin-top: 47px;}
.agreement_wrap > p {
    margin-top: 16px;
    font-size: 13px; line-height: 1.4; letter-spacing: -0.01em; font-weight: 700; color: #404040;
}
.agree_btn {
    display: block;
    background: #EAEAEA; 
    font-size: 16px; line-height: 46px; font-weight: 700; letter-spacing: -0.02em; text-align: center; color: #6C6C6C;
    position: relative;
    border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; -ms-border-radius: 5px; -o-border-radius: 5px;
}
.agree_btn .checked {
    position: absolute; top: 50%; left: 18px;
    transform:translateY(-50%) ; -webkit-transform:translateY(-50%) ; -moz-transform:translateY(-50%) ; -ms-transform:translateY(-50%) ; -o-transform:translateY(-50%) ;
}
.agree_btn .checked > path {stroke: #6c6c6c;}
.agree_btn.on {
    background: #404040;
    color :#FFFFFF;
}
.agree_btn.on .checked > path {stroke: #ffffff;}

.terms_wrap {margin-top: 22px;}
.terms_wrap > input[type=checkbox] {display: none;}
.terms_wrap > input[type=checkbox] + label {
    position: relative;
    padding-left: 25px; 
    font-size: 14px; line-height: 1.5; letter-spacing: -0.02em; font-weight: 500; color: #605353;
}
.terms_wrap > input[type=checkbox] + label::before {
    content: "";
    width: 13px; height: 13px;
    border-radius: 3px; -webkit-border-radius: 3px; -moz-border-radius: 3px; -ms-border-radius: 3px; -o-border-radius: 3px; border: 1px solid #CED4DA;
    display: block;
    position: absolute; top: 50%; left: 0;
    transform: translateY(-50%); -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%);
} 
.terms_wrap > input[type=checkbox]:checked + label::before {
    background: #000C8E url(/mobile/common/img/after_img/icon_cheked.png) center no-repeat;
    border: 1px solid #000C8E;
} 
.terms_wrap > input[type=checkbox] + label > span {color: #211686}
.terms_wrap .join_prov_warp {
    width: 100%; 
    padding: 13px 15px 14px; margin-top: 9px;
    border-radius: 10px; -webkit-border-radius: 10px; -moz-border-radius: 10px; -ms-border-radius: 10px; -o-border-radius: 10px; border: 1px solid #E8E8E8;
}
.terms_wrap .join_prov_warp .terms {
    height: 122px; overflow-y: scroll;
    padding-right: 15px;
}
.terms_wrap .join_prov_warp h6,
.join_prov_warp .terms > p,
.join_prov_warp .terms > ul li,
.join_prov_warp .terms li ol li,
.join_prov_warp .terms dt,
.join_prov_warp .terms dd
 {
    padding: 0; margin: 0;
    font-size: 3.6vw; line-height: 1.46; letter-spacing: -0.02em; font-weight: 400; color: #000;
}
.join_prov_warp .terms > table {
    margin-top: 10px;
    border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; -ms-border-radius: 5px; -o-border-radius: 5px; border: 1px solid #E5E5E5; border-collapse: initial;
    overflow: hidden;    
}
.join_prov_warp .terms > table th {
    background-color: #F5F5F5;
    border-right: 1px solid #E5E5E5; 
    font-size: 2.6vw !important; line-height: 1.4; letter-spacing: -0.01em; text-align: center; color: #676767;
    padding: 3.6vw 2.1vw;
}
.join_prov_warp .terms > table td {
    border-right: 1px solid #E5E5E5; border-bottom: 1px solid #E5E5E5;
    font-size: 2.6vw !important; line-height: 1.4; letter-spacing: -0.01em;color: #888888; vertical-align: top;
    padding: 2.1vw;
}
.join_prov_warp .terms > table td:first-child {vertical-align: middle; text-align: center;}
.join_prov_warp .terms > table th:last-child,
.join_prov_warp .terms > table td:last-child {border-right: none;}
.join_prov_warp .terms > table tr:last-child td {border-bottom: none;}

.terms::-webkit-scrollbar {width: 3px}
.terms::-webkit-scrollbar-thumb {
    border-radius: 100px; -webkit-border-radius: 100px; -moz-border-radius: 100px; -ms-border-radius: 100px; -o-border-radius: 100px;
    background-color: rgba(166, 166, 166, 0.7);
}
.terms::-webkit-scrollbar-track {
    background-color: transparent;
    padding-right: 15px;
}


/*가입정보*/
.custom-checkbox-wrapper2 {padding: 0;}
.custom-checkbox-wrapper2.checked path {stroke: #fff}
.custom-checkbox-wrapper2.checked span::after {opacity: 0;}

.join_form_wrap > ul {display: flex; align-items: stretch; justify-content: center; flex-direction: column;}
.join_form_wrap .main_info {row-gap: 15px;}
.join_form_wrap .input_box { 
    padding: 8px 17px 27px; 
    border-radius:10px; -webkit-border-radius:10px; -moz-border-radius:10px; -ms-border-radius:10px; -o-border-radius:10px; border: 1px solid #DADADA;
}
.join_form_wrap .input_box .join_form1,
.join_form_wrap .input_box .joCin_form2 {height: initial;}
.join_form_wrap .input_box > input:focus {outline: none; box-shadow: none;}
.join_form_wrap .input_box .input_name {
    display: block;
    margin-bottom: 13px;
    font-size: 13px; line-height: 1.4; letter-spacing: -0.01em; font-weight: 600; color: #888;
}
.join_form_wrap .join_txt2 {margin-top: 8px; padding-left: 10px;}
.input_box.on {border: 2px solid #FF0000;}
.join_form_wrap .sub_info {row-gap: 45px; margin-top: 45px;}
.join_form_wrap .sub_info > li {display: flex; flex-direction: column; align-items: stretch; justify-content: center; row-gap: 15px; position: relative;}
.join_form_wrap .sub_info li > ul {display: flex; align-items: center; justify-content: space-between;}
.join_form_wrap .sub_info > li .agree_rule {
    font-size: 13px; line-height: 1.4; letter-spacing: -0.01em; color: #7E7E7E;
    flex-direction: column; align-items: stretch;
}
.join_form_wrap .sub_info > li .agree_rule > li {padding-left: 15px; position: relative;}
.join_form_wrap .sub_info > li .agree_rule > li::before {
    content: "";
    width: 3px; height: 3px;
    border-radius:50%; -webkit-border-radius:50%; -moz-border-radius:50%; -ms-border-radius:50%; -o-border-radius:50%;
    background-color: #7e7e7e;
    position: absolute; top: 7px; left: 5px;
}
.join_form_wrap .sub_info h4 {font-size: 16px; line-height: 1.4; letter-spacing: -0.01em; color:#121212;}
.join_form3 {width: calc(100% - 25px);}
.join_form_wrap .sub_info input[type=text],
.join_form_wrap .sub_info select {
    width: 100%;
    border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; -ms-border-radius: 5px; -o-border-radius: 5px; border: 1px solid #DADADA;
    padding: 8px 10px 7px ;
    font-size: 16px; line-height: 1.4; letter-spacing: -0.01em;
    position: relative;
} 

.join_form_wrap .sub_info input[type=text]+label { font-size: 16px; line-height: 1.4; letter-spacing: -0.01em; font-weight: 700; color: #121212; margin-left: 8px;}
.join_btn_box1 .radio-btn {
    font-size: 16px; line-height: 46px; letter-spacing: -0.02em; font-weight: 700; color: #6C6C6C;
    padding: 0;
    border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; -ms-border-radius: 5px; -o-border-radius: 5px;
}
.join_form_wrap .sub_info .mem_birth {column-gap: 25px;}
.join_form_wrap .sub_info .mem_birth li {width: 25%;}
.join_form_wrap .sub_info .mem_birth li:first-child {width: 53%;}
.join_form_wrap .sub_info .mem_birth li input[type=text] { width: calc(100% - 25px); }
.join_form_wrap .sub_info .mem_email {row-gap: 8px;}
.join_form_wrap .sub_info .mem_email > li:first-child {width: 37.5%;}
.join_form_wrap .sub_info .mem_email > li:nth-child(2) {width: initial;}
.join_form_wrap .sub_info .mem_email > li:last-child {width: 53.5%;}
.join_form_wrap .sub_info .select_wrap {position: relative;}
.join_form_wrap .sub_info .select_wrap::after{
    content: "";
    width: 12px; height: 12px;
    position: absolute; right: 10px; top: 45%;
    transform: translate(-50%, -50%) rotate(45deg); -webkit-transform: translate(-50%, -50%) rotate(45deg); -moz-transform: translate(-50%, -50%) rotate(45deg); -ms-transform: translate(-50%, -50%) rotate(45deg); -o-transform: translate(-50%, -50%) rotate(45deg);
    border: solid rgba(38, 38, 38, 0.6); border-width: 0 3px 3px 0;
}
.mail_write {display: none;}
.join_form_wrap .sub_info .reference_box {row-gap: 0;}
.join_form_wrap .sub_info .reference_box > div {padding-bottom: 17px;}
.join_form_wrap .sub_info .reference_box input {     
    width: calc(100% - 70px); 
    border: 0px;
    padding: 0;
}
.btn_long {
    font-size: 15px; line-height: 39px; letter-spacing: -0.01em; text-align: center; color: #fff;
    width: 100%;
    border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; -ms-border-radius: 5px; -o-border-radius: 5px;
    background-color: #1F62F2;
    display: block;
}
.join_form_wrap .sub_info .address_box {row-gap: 13px;}
.join_form_wrap .sub_info .mem_address {column-gap: 5px;}
.join_form_wrap .sub_info .mem_address li:first-child {width: 32%;}
.join_form_wrap .sub_info .mem_address li:last-child {width: 68%;}
.join_form_wrap .input_box.input_select select {border: none; padding: 8px 0;}
.join_form_wrap .input_box.input_select select:focus {outline: 0;}
.join_form_wrap .input_box.input_select .select_wrap::after  {right: 0;}
.join_form_wrap .input_box.input_select  {padding: 8px 17px 9px ;}

/** ID / 비밀번호찾기 **/
.form_ps {font-size: 13px; line-height: 1.4; letter-spacing: -0.01em; font-weight: 600; color: #888888; word-break: keep-all; margin-bottom: 5px;}
#open_layout {
    display: none;
    padding: 15px;
    font-size: 13px; line-height: 1.4; letter-spacing: -0.01em; font-weight: 600; color: #888888; margin-bottom: 5px; text-align: center;
    border: 1px solid #e8e8e8; border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; -ms-border-radius: 5px; -o-border-radius: 5px;
    background-color: #F5F5F5;
}
#id_text {font-size: 16px; line-height: 1.5; letter-spacing: -0.02em; color:#211686; margin-top: 10px; }






/** 임시 **/
.sub_topmenu {top : 0}
.course_tap {margin: 10px auto 80px;}
.subtap_any {margin: 10px auto 20px;}
.sub_warp_landing {margin: 0;}
.pdlr20 {padding: 0 20px 0 20px;}
.pdlr15 {padding: 0 15px 0 15px;}
.mgt15 {margin-top: 15px;}
.mgt20 {margin-top: 20px;}
.mgt25 {margin-top: 25px;}
.year_tap li.check p {color: #fff;}
.class_jump {margin: 0 0 30px;}

@media (max-width: 376px){
	/*header*/
	.top_wrap {padding: 15px;}

	/*hambuger fixed_menu */
	.sitenavigation .login_top {font-size: 3.2vw;}
	.top_login_btn {font-size: 3.2vw;}

    /* INDEX 화면 */
	.semester_list > li {font-size: 3.8vw;}
	.cs_list h3 {font-size: 6.6vw;}	
	.cs_time {font-size: 3vw;}

    /*단과신청관리*/
    .sub_tit1 {font-size: 5.2vw; margin-bottom: 7vw; margin-bottom: 6.92vw;}
    .course_add {bottom : 18vh}
    .course_add .course_add_btn {font-size: 3.85vw;}
    .year_tap li {font-size: 3.85vw;}
    .year_tap li h5 {font-size: 4.1vw}
    .btn_sample, .my_class {font-size: 3.85vw;}
    .my_money, .my_small {font-size: 3.35vw}


    /*패키지 신청*/
    .pack_tap li h4 {font-size: 4.1vw;}
    .pack_tap li p {font-size: 3.84vw;} 
    .btn_basket2, .btn_basket3, .btn_basket4, .btn_basket5  {
        height: 19.3vw;
        font-size: 3.85vw;
        padding-top: 6.7vw;
    }  

    
    /*강좌 장바구니 */
   .cart_list_wrap > li > .subject_title,
   .cart_list_wrap > li > .subject_title .btn_my06 {font-size: 3.85vw;}
   .cart_list_wrap > li .subject_price {font-size: 3.1vw;}



    /*회원가입*/
    .join_form_wrap .main_info {row-gap: 3.85vw;}
    .join_form_wrap .input_box { padding: 2.1vw 4.4vw 6.9vw;}
    .join_form_wrap .input_box .input_name {font-size: 3.35vw;}
    .join_form_wrap .join_txt2 {font-size: 3.6vw;}
    .join_form_wrap .sub_info {row-gap: 11.5vw; margin-top: 11.5vw;}
    .join_form_wrap .sub_info > li {row-gap: 2.55vw ;}
    .join_form_wrap .sub_info > li .agree_rule {font-size: 3.35vw;}
    .join_form_wrap .sub_info h4 {font-size: 4.1vw;}
    .join_form_wrap .sub_info input[type=text],
    .join_form_wrap .sub_info select {
        padding: 2.05vw 2.55vw 1.8vw;
        font-size: 4.1vw;
    } 
    .join_form_wrap .sub_info input[type=text]+label {font-size: 4.1vw;}
    .join_form_wrap .sub_info .select_wrap::after{right: 2.25vw; }
    .join_form_wrap .input_box.input_select  {padding: 2.1vw 4.4vw 2.23vw;}
}