
/*===========================
defalut css
자주쓰는 css
============================*/
.flex {display:flex; flex-wrap:Wrap;}
.flex1 {flex:1;}

body {
--radius01:16px;
--radius02:10px;
--radius03:8px;
--radius04:999px;
--radius05:4px;
--radius06:6px;
--radius07:20px;
--radius08:2px; /*새로추가*/

--black01:#1b1b1b;
--black02:#4E4E4E;
--black03:#686868;
--black04:#7E7E7E;
--black05:#000;

--border01:#DEDEDE;
--border02:#D9D9D9;
--border03:#C9C9C9;
--border04:#F6F6F6;
--white01:#FAFAFA;
--white02:#F6F6F6;
--green01:#00C932;
--green02:#25A344;


--red01:#FF2516;
--yellow01:#ffea73;/*새로추가*/
--blue01:#48c0d8;/*새로추가*/
--blue02:#44b3f1;/*새로추가*/



}
.bg_grey01 {background-color:#f6f6f6}

.sr-only{
  position:absolute; width:1px; height:1px; padding:0; margin:-1px;
  overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0;
}


.wd10per {width:10% !important}
.wd15per {width:15% !important}
.wd20per {width:20% !important}
.wd25per {width:25% !important}
.wd30per {width:30% !important}

.ingap_margin {margin-top:32px;}
/*===========================
프로그램 요청 표시 (협업용)
===========================*/

.prog_ness {
  position: relative;
  border: 1px solid #ff4d4d;    
  border-radius: 6px;
  background: rgba(255, 77, 77, 0.08); 
  padding-top:20px;

}

/* 자동 텍스트 삽입 */
.prog_ness::before { display:none;
  content: '프로그램 요청';
  z-index:2;
color:#fff;
font-size: 12px;
 position:absolute; top:0px;left:0;
  line-height: 1.2;
  background: rgba(255, 77, 77, 1); 
  padding:2px 10px;
  font-weight: 600;
}



/* 기본 배지 스타일: 숨김(온/오프는 CSS 변수로 제어) */
.procheck{
  --prog-badge-display: none; /* off */

}

.contents-mypage {
  --prog-badge-display: none; /* off */
  --prog-border: none;
  --prog-radius: 0;
  --prog-bg: none;
  --prog-padding-top: 0;

}

/* 토글 스위치가 체크되면 on */
.procheck:has(.prog-switch input:checked),
.contents-mypage:has(.prog-switch input:checked) {
  --prog-badge-display: inline-flex;
  --prog-border: 1px solid #ff4d4d;
  --prog-radius: 6px;
  --prog-bg: rgba(255, 77, 77, 0.08);
  --prog-padding-top: 20px;
}

/* 기존 박스 */
.prog_ness {
  position: relative;
  border: var(--prog-border);
  border-radius: var(--prog-radius);
  background: var(--prog-bg);
  padding-top: var(--prog-padding-top);
}

/* 자동 텍스트 배지 */
.prog_ness::before {
  content: '프로그램 요청';
  display: var(--prog-badge-display); 
  position: absolute;
  top: 0; left: 0;
  z-index: 2;
  padding: 2px 10px;
  font-size: 12px;
  font-weight: 600;
  line-height: 1.2;
  color: #fff;
  background: rgba(255, 77, 77, 1);
  border-top-left-radius: 6px;
  border-bottom-right-radius: 6px;
}

/* 화면 고정 토글 스위치 */
.prog-switch { 
  position: fixed; z-index:99999;
 bottom: 30px; right:20px; color:#fff; font-size:20px;
  display: inline-flex; gap: 8px; align-items: center;
  padding: 14px 20px;
  background: var(--red01);
  color: #fff;  border-radius: var(--radius04);
  backdrop-filter: saturate(1.2) blur(4px);
  user-select: none;
}
.prog-switch input { width: 16px; height: 16px; }
.prog-switch label { cursor: pointer; color:#fff; font-weight:700;}




/*===========================
mypage wrap (defalut wrap)
마이페이지 공통 레이아웃 구축
============================*/
.contents-mypage {gap:0px 32px; padding-top:55px; padding-bottom:100px;
 justify-content: space-between;  color:var(--black01);}
.contents-mypage a {color:var(--black01);}
.contents-mypage * {box-sizing:border-box; color:var(--black01);}

/*-- detail --------------------*/

.left_lnb_scroll {width:auto;}
.mypage_common_box {
	border:none !important; overflow:hidden;
	padding:0px 0px 16px 0px;
	 border-radius:var(--radius01);
	width:344px; 
	box-sizing:border-box;
	}

.mypage_left_box,
.mypage_right_box {width:auto !important;}


.mypage_right_box {background:#fff; box-sizing:border-box; /* padding:32px;  */ overflow:hidden;
flex:1; /* border-radius:var(--radius01);	 */}
.mypage_right_box a:hover {color:inherit !important}
.mypage_right_box.nobg {background:none}


.mypage_right_box  .mypage_inwrap { box-sizing:Border-box; background:#fff; border-radius:var(--radius01);
padding:32px;}





/*===========================
snb
마이페이지 왼쪽 메뉴부분
============================*/


/*-- side_tit  헤더 --------------------*/
h2.side_tit{background:var(--black02); color:#fff; padding:30px 0px;  text-align:Center;font-weight:700; font-size:32px; line-height:1;}

/*--mypage_left_inner  패딩부분 --------------------*/
.mypage_left_inner {box-sizing:Border-box; padding:16px 32px;}


/*-- top_my_page_summary 아이콘메뉴 --------------------*/

.top_my_page_summary { gap:12px 0px; padding-top:24px;}
.top_my_page_summary  dl {display:flex; width:100%;}
	.top_my_page_summary  dl dt{flex:1;  position:relative; padding-left:32px; font-weight:600;}
	.top_my_page_summary  dl dt svg {position:absolute; top:0; left:0;}
	.top_my_page_summary  dl dd{text-align:left; font-weight:500; color:var(--black03);}
		.top_my_page_summary  dl dd span {font-weight:600;}
	.top_my_page_summary  dl a,
	.top_my_page_summary  dl dt,
	.top_my_page_summary  dl dd {font-size:18px; line-height:24px;}



/*-- mypage_inner_menu 메뉴 --------------------*/
.mypage_inner_menu {gap:32px 0px; flex-direction: column; padding-top:50px;}
	.mypage_inner_menu  dl {flex-direction: column; display:flex; flex-wrap:wrap; gap: 12px;}
	.mypage_inner_menu  dl dt{font-size:20px; line-height:26px; font-weight:700;}
	.mypage_inner_menu  dl dd a{font-size:18px; line-height:24px;  color:var(--black02);}
	.mypage_inner_menu  dl dd a.on {font-weight:700; color:#25A344}


/*===========================
mypage main home
마이페이지 메인 화면
============================*/

.mypage_main_home {gap:32px 32px;}
.list_comst01 {background:#fff;display:flex; flex-basis:column; flex-wrap:wrap;
gap:24px 0px; border-radius:var(--radius01);	 padding:32px;  align-items: flex-start; }


 .list_comst01.inner_zzim {padding:0;}





/*-- wrapin 섹션별 크기조정 --------------------*/
.mypage_main_home .mytop_wrapin {width:100%;}
.mypage_main_home .recent_wrapin  {width:calc(50% - 16px) }
.mypage_main_home .fav_wrapin  {width:calc(50% - 16px) }
.mypage_main_home .notice_wrapin  {width:100%;}

/*-- list_comst01 공통부분--------------------*/

/*list_comst01 제목*/
.list_comst01 .intit {display:flex; justify-content: space-between; width:100%;}
	.list_comst01 .intit  h2 {font-size:24px; line-height:32px; font-weight:700;}
	.list_comst01 .intit  a.detail_more{ width:32px; height:32px;
	background-image: url("data:image/svg+xml,%3Csvg%20width%3D'32'%20height%3D'32'%20viewBox%3D'0%200%2032%2032'%20fill%3D'none'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%3Cpath%20d%3D'M9.24414%206.85254C9.24414%206.37321%209.56915%205.94128%2010.0674%205.75781C10.5656%205.57435%2011.1392%205.67571%2011.5205%206.01465L22.1865%2015.4961C22.7072%2015.9589%2022.7072%2016.7091%2022.1865%2017.1719L11.5205%2026.6533C11.1392%2026.9922%2010.5656%2027.0935%2010.0674%2026.9102C9.56922%2026.7267%209.24424%2026.2947%209.24414%2025.8154L9.24414%206.85254Z'%20fill%3D'%23686868'%2F%3E%3C%2Fsvg%3E");
	background-size: auto 32px;
	background-repeat: no-repeat;
	background-position: right 0px center;
	}



/*list_comst01 list*/





.list_comst01 .list {display:flex; flex-wrap:wrap;width:100%;  flex-direction:column; gap:16px; }

  .list_comst01 .list.listst02 { gap:16px 16px; flex-direction:row;} 


	.list_comst01 .list .recent_list_inner {border-radius:var(--radius01); cursor:pointer;
	padding:24px 42px 24px 16px; gap:16px; width:100%; height:110px;
	border:1px solid var(--border01); display:flex; justify-content: space-between;  align-items: center; flex-wrap:nowrap;
	background-image: url("data:image/svg+xml,%3Csvg%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%20fill%3D'none'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%3Cpath%20d%3D'M8.3866%204.38619L16.0001%2011.9997L8.3866%2019.6133'%20stroke%3D'%237E7E7E'%20stroke-width%3D'2'%20stroke-linecap%3D'round'%20stroke-linejoin%3D'round'%2F%3E%3C%2Fsvg%3E");
	background-size: auto 24px;
	background-repeat: no-repeat;
	background-position: right 16px center;

	}

  .list_comst01 .list.listst02 .recent_list_inner {width:calc(50% - 10px);}






/*-- mytop_wrapin 레이아웃 --------------------*/
.mypage_main_home .mytop_wrapin {display:flex; flex-wrap:wrap;gap:32px 0px;}
	.mypage_main_home .mytop_wrapin .section_wrain01 {width:100%; display:flex; gap:0px 32px;}
		.mypage_main_home .mytop_wrapin .section_wrain01 div.inleft {flex:1;}
		.mypage_main_home .mytop_wrapin .section_wrain01 div.inright { width:432px;}

/*  .mypage_name_con */
.mypage_main_home .mytop_wrapin  .mypage_name_con{display:flex; flex-wrap:wrap;width:100%; gap:8px 0px; flex-direction:column;}
	.mypage_main_home .mytop_wrapin  .mypage_name_con h2 {font-weight: 700;  
	font-size: 24px; line-height: 32px; }
	.mypage_main_home .mytop_wrapin  .mypage_name_con h3 {color:var(--black04); 
	border-top: 1px solid var(--border01); padding-top:8px;
	font-weight: 500; line-height: 24px; letter-spacing: -2%;}

.mypage_main_home .mytop_wrapin .my_icon_list{ gap:16px;  display:flex; flex-wrap:wrap; justify-content: right;}
.mypage_main_home .mytop_wrapin .my_icon_list dl {width:94px; background:#F6F6F6; position:relative;
height:94px; padding:17px 0px; text-align:Center; cursor:pointer;  display:flex; flex-wrap:wrap; 
 gap:10px 0px;}
.mypage_main_home .mytop_wrapin .my_icon_list dl dt {height:25px; width:100%;}
.mypage_main_home .mytop_wrapin .my_icon_list dl dd{width:100%;  color:var(--black04);
font-weight:500; font-size: 16px; line-height: 22px; letter-spacing: -0.02px; }

.mypage_main_home .mytop_wrapin .my_icon_list dl.on{background:#E6FFEC}
.mypage_main_home .mytop_wrapin .my_icon_list dl.on dd {color:#25A344; }
.mypage_main_home .mytop_wrapin .my_icon_list dl svg {stroke:#7E7E7E}

.mypage_main_home .mytop_wrapin .my_icon_list dl.on svg {stroke:#25A344}


.mypage_main_home .mytop_wrapin .my_icon_list dl dd.casenum {
background:#FF2516; position:absolute ; top:-3px; right:-3px;
font-weight: 700; line-height:24px;
font-size: 15px; color:#fff;
width:24px; height:24px; border-radius:50%;
text-align: center;
}



/*  .cal_tit */
.mypage_main_home .mytop_wrapin .cal_tit {}
	.mypage_main_home .mytop_wrapin .cal_tit dt {font-weight: 700;font-size: 16px; line-height: 24px;}
	.mypage_main_home .mytop_wrapin .cal_tit dt  svg {margin-right:4px;}
	.mypage_main_home .mytop_wrapin .cal_tit dd  {color:var(--black04); padding-top:4px;
	font-weight: 500; font-size: 12px; line-height: 16px; letter-spacing: -0.02px; }




/*  .atted_table_wrapin - 달력 */
.atted_table_wrapin {position:relative; }
.atted_table_wrapin .tbl {gap: 0px 20px; justify-content: center;
  align-items: center;padding:18px 0px;}
.atted_table_wrapin .tbl  h2 {font-size:20px; padding:0 30px;}
.atted_table_wrapin .tbl  img {width:25px;}
.atted_table_wrapin  .week .red02 {color:#f7716e}
.atted_table_wrapin  .week .blue02 {color:#71a2e3}
.atted_table_wrapin table {position:relative;}
.atted_table_wrapin table:before {left:0}
.atted_table_wrapin table:after {right:0}

.atted_table_wrapin table:before,
.atted_table_wrapin table:after {content:''; position:absolute; width:1px;background:#fff; top:0; height:100%;}
.atted_table_wrapin table .dayinner{  color: initial;  font-size:11px;}
.atted_table_wrapin #mCSB_1_container  font { color: initial; font-size:11px;}





/*  .conditoin_check_area */
.mypage_main_home .conditoin_check_area   {display:flex; flex-wrap:wrap;  gap:12px 0px; position:relative;}
.mypage_main_home .conditoin_check_area   dl{cursor:pointer; gap:12px 0px; position:relative;display:flex; flex-wrap:wrap;
border:1px solid var(--border01);  border-radius:16px; width:100%;padding:24px 20px; }  
	.mypage_main_home .conditoin_check_area   dl dt {width:100%; font-weight: 600; font-size: 16px; line-height: 24px; }
	.mypage_main_home .conditoin_check_area   dl  dt svg {margin-right:8px;}
	.mypage_main_home .conditoin_check_area   dl  p.edit_pen {position:absolute; top:20px; right:20px;}

	.mypage_main_home .conditoin_check_area   dl dd {width:100%;text-align:right; font-weight: 400;
font-size: 18px;
line-height: 24px;}

				.mypage_main_home .conditoin_check_area   dl  dd strong,
				.mypage_main_home .conditoin_check_area   dl  dd input { 	font-weight: 700; text-align:right;
			font-size: 20px; line-height: 26px; }



				.mypage_main_home .conditoin_check_area   dl.attend {padding-right:100px;} 
				.mypage_main_home .conditoin_check_area   dl.attend dd:last-child {position:absolute; bottom:20px; width:60px; right:17px;}
								.mypage_main_home .conditoin_check_area   dl.attend dd {font-weight: 400; font-size: 15px; line-height: 22px; letter-spacing: -0.02px; }
				
				.mypage_main_home .conditoin_check_area   dl.attend dd strong {font-weight: 700; font-size: 18px; line-height: 24px; }
				.mypage_main_home .conditoin_check_area   dl.attend dd p.nowday {}
				.mypage_main_home .conditoin_check_area   dl.attend dd p.allday,
				.mypage_main_home .conditoin_check_area   dl.attend dd p.allday strong  {color:var(--black04)}
				.mypage_main_home .conditoin_check_area   dl.attend dd p {display:inline-block;padding:0px 3px}



			/* 버튼 리셋 */
			.mypage_main_home .conditoin_check_area   dl.editable-dl dt {position:relative;}
			.edit_pen{position:absolute; top:0; right:0; border:0; background:transparent; padding:4px; border-radius:8px; cursor:pointer;}
			.edit_pen:hover{background:#f5f5f5;}
				.goal_input {
				  width: 100%;
				  border: none;
				  outline: none;
				  background: transparent;
				  font-size: 18px;
				  font-weight: 700;
				  color: #111;
				  margin-top: 8px;
				  padding: 4px 0;
				  border-bottom: 1px solid transparent;
				  transition: border-color 0.2s;
				}
				.goal_input.editing {
				  background: #fff;
				  border-bottom: 1px solid #25a344;
				}


/*-- recent_list_inner 최근수강강의 --------------------*/




.pass_detail_box .progress   {
    position: relative; 
    width: 68px;
    height: 68px;
  }


  .mypage_right_box .progress {
    position: relative; 
    width: 60px;
    height: 60px;
  }


  /* 배경 원 */
  .pass_detail_box .progress svg circle,
   .mypage_right_box .progress svg circle {
    fill: none;
    stroke-width: 7; /*테두리넓이*/
    stroke-linecap: round;
    transform: rotate(-90deg);
    transform-origin: 50% 50%;
  }

  /* 배경원형 */
    .pass_detail_box .progress svg circle.bg {
	stroke: #b2f6c5;
	}

    .mypage_right_box .progress svg circle.bg {
    stroke: #b2f6c5;
  }

  /* 퍼센트 색상 */
    .pass_detail_box  .progress circle.fg,
   .mypage_right_box  .progress svg circle.fg {
    /*stroke: url(#grad);*/
    stroke-dasharray: 283;
    stroke-dashoffset: 283;
    transition: stroke-dashoffset 1s ease;
    stroke: #25A344;
  }

  /* 중앙 숫자 */

    .pass_detail_box .progress .percent,
   .mypage_right_box  .progress .percent {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-weight: 700;
    font-size: 17px;
    color: #25A344;
  }

    .pass_detail_box .progress .percent{
	    color: #25A344;
		}



/*list_comst01 list 텍스트와 제목*/
   .recent_list_inner .lec_inner_tit {flex:1;   max-width:270px;  gap:4px 0px; display:flex; flex-direction:column; overflow:hidden; }
   .recent_list_inner.fav_list_inner .lec_inner_tit {max-width:400px;}
.inner_zzim .recent_list_inner.fav_list_inner .lec_inner_tit {max-width:90%;}



	   .recent_list_inner .lec_inner_tit  dt {font-size:12px; line-height:16px; color:var(--black04);  letter-spacing:-0.02px;}



	   .recent_list_inner .lec_inner_tit  dd {font-size:16px; line-height:22px; color:var(--black01); font-weight:600; letter-spacing:-0.02px;}
		.recent_list_inner .lec_inner_tit  dt,
		.recent_list_inner .lec_inner_tit  dd { display: inline-block;   width: 100%;          white-space: nowrap;      
  overflow: hidden; text-overflow: ellipsis; }
		.recent_list_inner .lec_inner_tit  dd.detail  {font-size:14px;  line-height:20px; letter-spacing:-0.02px;}

   .recent_list_inner .lec_inner_time{ text-align:center; width:90px; display:flex; flex-direction:column;  gap:4px 0px; }
	   .recent_list_inner .lec_inner_time dt {font-size:12px; line-height:16px; color:var(--black04); font-weight:500; letter-spacing:-0.02px;}
	   .recent_list_inner .lec_inner_time dd{font-size:14px; line-height:20px;   letter-spacing:-0.02px;}




/*-- fav_list_inner  즐겨찾기 강의 --------------------*/
.recent_list_inner.fav_list_inner  {position:relative; padding-left:60px !important;}
.recent_list_inner.fav_list_inner:before {content:'';  width:32px; height:32px;
position:absolute; left:16px; top:50%; transform:translateY(-50%);
background-image: url("data:image/svg+xml,%3Csvg%20width%3D'32'%20height%3D'32'%20viewBox%3D'0%200%2032%2032'%20fill%3D'none'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%3Cpath%20d%3D'M2.31241%2013.7825C1.70293%2013.198%202.03651%2012.1606%202.86964%2012.0494L10.8573%2010.9857C11.1926%2010.9411%2011.4825%2010.7282%2011.6282%2010.4199L15.0985%203.07445C15.4606%202.30856%2016.5399%202.30847%2016.9019%203.07445L20.3712%2010.4199C20.5168%2010.7283%2020.8077%2010.9411%2021.1431%2010.9857L29.1297%2012.0494C29.9629%2012.1604%2030.2972%2013.1979%2029.6879%2013.7825L23.8443%2019.386C23.5991%2019.6213%2023.488%2019.9659%2023.5496%2020.3018L25.0164%2028.3038C25.1694%2029.1387%2024.2962%2029.7804%2023.5574%2029.3754L16.4764%2025.4932C16.1791%2025.3303%2015.8202%2025.3302%2015.523%2025.4932L8.44292%2029.3754C7.70418%2029.7804%206.82995%2029.1387%206.98299%2028.3038L8.44975%2020.3018C8.51131%2019.966%208.40107%2019.6212%208.15601%2019.386L2.31241%2013.7825Z'%20fill%3D'%23FFEA73'%2F%3E%3C%2Fsvg%3E");
background-size: auto 32px;
background-repeat: no-repeat;
background-position: center center;
}








/*-- 전체공지 --------------------*/

.notice_wrapin .list {gap:0 !important;}
	.notice_wrapin .list dl{cursor:pointer; position:relative; border-top:1px solid var(--border01); padding:12px; display:flex; flex-wrap:nowrap;   justify-content: space-between;}
	.notice_wrapin .list{border-bottom:1px solid var(--border01); }
	.notice_wrapin .list dl dt,
	.notice_wrapin .list dl dd {font-size:15px; line-height:22px;}
	.notice_wrapin .list dl dd {color:var(--black04)}
	.notice_wrapin .list dl dt {flex:1;}
	.notice_wrapin .list dl.important{background:#FDFFFB; }
	.notice_wrapin .list dl.important.open_lec {background:#FFFAFA}

	.notice_wrapin .list dl.important:before {content:'중요'; font-size:14px; line-height:16px; background:#25A344;font-weight:600; border-radius:var(--radius04); padding:4px 12px; color:#fff; margin-right:10px;}
	.notice_wrapin .list dl.important.open_lec:before {content:'개강'; background:#FF2516;}






/*===========================
강의실 홈-happy_member.php
============================*/


/*-- 탭스타일 --------------------*/

.tab_comst01 {display:flex; flex-wrap:wrap;gap:8px; margin-bottom:30px;}
	.tab_comst01  a {background:#F6F6F6;
	font-weight: 500; color:var(--black02);
	font-size: 18px;
	line-height:1;
	letter-spacing: -2%;
	border-radius: 50px;
	line-height:52px;
	padding: 0px 24px;
	}
	.tab_comst01  a.on {color:var(--black01);background:#FFEA73;}

/*-- 서치스타일 --------------------*/
.lecture_searchwrain_form  form {display:flex;  justify-content: right; gap:0px 9px;}

.lecture_searchwrain_form input {width:300px; box-sizing:border-box;
padding:0px 16px;
font-weight: 400;
border:1px solid var(--border02)}
.lecture_searchwrain_form input::placeholder,
.lecture_searchwrain_form input::-webkit-input-placeholder,
.lecture_searchwrain_form input:-ms-input-placeholder,
.lecture_searchwrain_form input::-ms-input-placeholder {
color:var(--black04);
}
.lecture_searchwrain_form input,
.lecture_searchwrain_form button {letter-spacing: -2%; border-radius:var(--radius02); 
 font-size: 16px; line-height:52px; }
.lecture_searchwrain_form button { color:#fff;
background:var(--green01); 
font-weight: 700; width:98px; text-align:Center;}



/*-- 리스트 --------------------*/

.list_comst01.lec_detail_list {padding:30px 0px;}
.list_comst01.lec_detail_list .list .recent_list_inner {border-radius:var(--radius03); height:134px;
padding: 16px 62px 16px 16px;}
	.list_comst01.lec_detail_list .list .recent_list_inner .img {width:160px;  aspect-ratio: 160 / 102; 
		background:#fff;}
	.list_comst01.lec_detail_list .list .recent_list_inner .img img { border-radius:6px; object-fit: cover; 
	 width: 100%; height: 100%;}
	.list_comst01.lec_detail_list .list .recent_list_inner .img.greyimg img{opacity:0.7;}
		.list_comst01.lec_detail_list .recent_list_inner .lec_inner_tit  {max-width:550px; }
	.list_comst01.lec_detail_list .recent_list_inner .lec_inner_tit dd {font-size: 18px;line-height: 24px;}
		.list_comst01.lec_detail_list .recent_list_inner .lec_inner_tit dd.detail { color:var(--black03); }
       	.list_comst01.lec_detail_list .recent_list_inner .lec_inner_time {max-width:100px; width:auto;}
		.list_comst01.lec_detail_list .recent_list_inner .lec_inner_tit dd.detail,
		.list_comst01.lec_detail_list .recent_list_inner .lec_inner_tit dd.detail strong  {
			letter-spacing: -0.02px; font-weight: 600; font-size: 12px; line-height: 16px;}

		.list_comst01.lec_detail_list .recent_list_inner .lec_inner_tit dd.detail  strong {margin-right:4px;}
		.list_comst01.lec_detail_list .recent_list_inner .lec_inner_tit dd.detail  strong.icon.color01 {color:#25A344}
		.list_comst01.lec_detail_list .recent_list_inner .lec_inner_tit dd.detail  strong.icon.color02 {color:var(--black03)}
		.list_comst01.lec_detail_list .recent_list_inner .lec_inner_tit dd.detail  strong.icon.color03 {color:var(--red01)}



		.list_comst01.lec_detail_list .progress {width: 64px; height: 64px;}
		.list_comst01.lec_detail_list .progress .percent {font-size: 19px !important;}


/*-- 리스트  페이징--------------------*/
.page {   padding:20px 0px !important; width:100%; text-align:Center;}
.page a {line-height:35px !important; width:35px; color:var(--black04); border-radius:5px; margin:0px 2px;
font-weight: 400;font-size: 18px; line-height: 1; letter-spacing: -2%;  background:var(--white01); display:inline-block;
}
.page a.on {background:var(--green01); color:#fff; font-weight: 700;}

.page a.pagebtn{border:1px solid var(--border01); background:#fff;}




/*===========================
수강내역-happy_member.php
============================*/

/*-- 제목  comtit--------------------*/
h3.comtit{font-weight: 700;font-size: 24px;line-height: 32px; margin-bottom:20px;
}


/*-- 리스트select sort--------------------*/

.sort_search_top {
  position: relative; display:flex;   justify-content: right
}

/* 셀렉트 기본 스타일 제거 & 커스텀 디자인 */

.lecture_searchwrain_form select,
.sort_search_top select { width:150px; line-height:57px;
color:var(--black02);
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  padding: 0px 34px 0px 16px;
  border: 1px solid var(--border01);
  border-radius: var(--radius02);
  background-color: #fff;
  color: #333;
  font-size: 15px;
  font-weight: 500;
	letter-spacing: -2%;
  cursor: pointer;
  transition: all 0.2s ease;
font-weight: 400;
font-size: 18px;
letter-spacing: -2%;
}

/* hover / focus 효과 */
.sort_search_top select:hover {
}
.sort_search_top select:focus {
  outline: none;
}

/* 커스텀 화살표 */

.sort_search_top::after {content:'';
  position: absolute;
  top: 50%;
background-size: auto 100%;
background-position: center center;
transform:translateY(-50%);
  right: 14px; width:10px; height:18px; 
  pointer-events: none;
  transition: transform 0.2s ease;
}
.sort_search_top::after,
.lecture_searchwrain_form select{
background-image: url("data:image/svg+xml,%3Csvg%20width%3D'20'%20height%3D'20'%20viewBox%3D'0%200%2020%2020'%20fill%3D'none'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%3Cpath%20d%3D'M12.3233%201.42578L16.3177%208.34433H8.32888L12.3233%201.42578Z'%20fill%3D'%237E7E7E'%2F%3E%3Cpath%20d%3D'M12.3251%2018.5742L8.33071%2011.6557L16.3196%2011.6557L12.3251%2018.5742Z'%20fill%3D'%237E7E7E'%2F%3E%3C%2Fsvg%3E");
background-repeat: no-repeat;
}

.lecture_searchwrain_form select{
background-size: auto 18px;
background-position:center right 14px;
}

.mypage_select_search {padding-bottom:20px; justify-content: right; display:flex; gap:0px 20px;}

.mypage_select_search .width_type01 {display:flex;gap:8px;}
.mypage_select_search .width_type01 select {width:160px; }
.mypage_select_search .inputtxt  {gap:8px;}

.mypage_select_search .inputtxt input {width:250px;}
.mypage_select_search .inputtxt button {width:85px;}
.mypage_select_search .width_type01 select,
.mypage_select_search .inputtxt input,
.mypage_select_search .inputtxt button{line-height:42px; font-size: 14px; letter-spacing: -2%;}

.mypage_select_search.my_zzim_search{gap:0px 10px;}
.mypage_select_search.my_zzim_search .width_type01 select,
.mypage_select_search.my_zzim_search .inputtxt input,
.mypage_select_search.my_zzim_search .inputtxt button{line-height:57px; font-size: 16px; }





/*  오버기능 원할 시 넣기
.sort_search_top select:focus + .sort_search_top::after,
.sort_search_top select:active + .sort_search_top::after {
  transform: translateY(-50%) rotate(180deg);
}

 */




/*-- 리스트select sort--------------------*/

.lecture_subclass_area .list_comst01 {padding:0;}
.lecture_subclass_area .list_comst01 .list .recent_list_inner {padding-right:16px; background:none;}
	.lecture_subclass_area .list_comst01 .list .recent_list_inner dd {font-size:15px !important; line-height:22px;}
.lecture_subclass_area .recent_list_inner .lec_inner_tit {max-width:calc(100% - 270px); }





/*===========================
학습QnA-happy_inquiry_list.php
============================*/

/*-- 학습QnA list--------------------*/
.my_page_qna_wrapin { border-bottom:1px solid var(--border01);}


.my_page_qna_wrapin .list { border-top:1px solid var(--border01); width:100%;
padding:28px 12px; display:flex; flex-wrap:wrap; cursor:pointer; align-items: center;
gap: 0px; justify-content: space-between;
}
.my_page_qna_wrapin .list .icon {
font-weight: 600;
font-size: 14px;
line-height: 16px;
letter-spacing: -2%;
padding:4px 12px;
border-radius:var(--radius04);
}

.my_page_qna_wrapin .list .icon.iconst01 {color:#fff; background:var(--black01)}
.my_page_qna_wrapin .list .icon.iconst02 {color:var(--black04); background:var(--border01)}

.my_page_qna_wrapin .list .cal_date {
font-weight: 400;
font-size: 15px;
line-height: 22px;
letter-spacing: -0.02px; width:100px; color:var(--black04);
}

.my_page_qna_wrapin .list  .ntit { flex:1; max-width:80%;}

.ell,
.my_page_qna_wrapin .list  .ntit   dt,
.my_page_qna_wrapin .list  .ntit  dd { padding:2px 0px; display: inline-block;  width:100%; white-space: nowrap;      
  overflow: hidden; text-overflow: ellipsis; }


.my_page_qna_wrapin .list  .ntit   dt{
font-weight: 500; color:var(--black04);
font-size: 14px;
line-height: 16px;
letter-spacing: -0.02px;
}
.my_page_qna_wrapin .list  .ntit   dd{
font-weight: 600;
font-size: 16px;
line-height: 24px;
}


/*-- 하단 주의사항 list--------------------*/
.inbottom_info{margin-top:32px;} 
.comli_st01 {display:flex; flex-wrap:wrap; gap:3px 0px; flex-direction:column}
.comli_st01 li {position:relative;
	font-weight: 400;
	font-size: 15px;
	line-height: 26px;
	letter-spacing: -0.02px;
	color:var(--black03); padding-left:15px;
}
.comli_st01 li:before{content:''; position:absolute; 
top:12px; left:0px;
background:var(--black03);
border-radius:50%; width:3px;height:3px;
}







/*===========================
장바구니
============================*/

/*-- 장바구니에 담긴 상품 없습니다. happy_cart.php?action=no_cart--------------------*/
article.no_cart {text-align:Center; padding:30px 0px;}
article.no_cart h4 {
font-weight: 700;
padding:16px 0px;
font-size: 18px;
line-height: 24px;
}





.cominner_icon {display:flex; flex-wrap:wrap;gap:10px; width:100%; justify-content: center;}
.cominner_icon a{ width:160px; line-height:56px; gap:10px; border-radius:var(--radius03);
border:1px solid var(--green02);
font-weight: 500;
font-size: 18px;
color:var(--green02)}

.cominner_icon a:hover {color:var(--green02) !important;}






/*===========================
장바구니 - 담겨있을시
===========================*/



/*-- 전체선택영역  상단--------------------*/

.cart_inner_wrap .cart_header{padding-bottom:20px; display:flex;justify-content:space-between;align-items:center;}
.cart_inner_wrap .check_all{display:flex;align-items:center;gap:10px;cursor:pointer;user-select:none;font-weight:700;
font-weight: 700;
font-size: 20px;
line-height: 26px;
}


.cart_inner_wrap .check_all input{display:none;}
.rep_check  input {display:none;}


 .cart_inner_wrap .custom_cb{
  width:24px;height:24px;border-radius:var(--radius05) ;border:1px solid var(--border01);
  display:inline-flex;align-items:center;justify-content:center;
  background:#fff; position:relative; transition:.15s;
}

.rep_check .custom_cb{
  width:24px;height:24px;border-radius:var(--radius05) ;border:1px solid var(--black02);
align-items:center;justify-content:center;
  background:#fff; position:relative; transition:.15s; text-align:center;
width:20px; height:20px; display:inline-block; vertical-align:middle; margin-right:6px;}



/*체크박스디자인*/
.rep_check .item_left input:checked + .custom_cb,
.rep_check .check_all input:checked + .custom_cb,
.cart_inner_wrap .item_left input:checked + .custom_cb,
.cart_inner_wrap .check_all input:checked + .custom_cb{
font-weight:600;
  background:var(--green02);  color:#fff; border:1px solid var(--green02)
}



.rep_check .item_left input:checked + .custom_cb::after,
.rep_check .check_all input:checked + .custom_cb::after,
.cart_inner_wrap .item_left input:checked + .custom_cb::after,
.cart_inner_wrap .check_all input:checked + .custom_cb::after{
  content:"✓"; font-size:19px; line-height:1; transform:translateY(-1px);
}

.rep_check .item_left input:checked + .custom_cb::after,
.rep_check .check_all input:checked + .custom_cb::after{
  font-size:16px;
}



 .cart_inner_wrap .check_all .label_txt em{color:var(--green02);font-weight:700;margin-left:8px;}

 .cart_inner_wrap .btn_del{
 line-height:30px;  border-radius:(--radius05);
  background:#fff;border:1px solid var(--black04);border-radius:8px;padding:2px 16px;
cursor:pointer;transition:.15s;
color:1px solid var(--black04);
font-weight: 400;
font-size: 14px;
letter-spacing: -2%;
}


.cart_inner_wrap .cart_list{display:flex;flex-direction:column; border-top:1px solid var(--black04)}
.cart_inner_wrap .cart_list  .cart_item{display:flex; padding:28px 0px; gap:0px 30px;
justify-content:space-between;
align-items:center;  border-bottom:1px solid var(--border01)
}

.cart_inner_wrap .item_left{display:flex;align-items:center;gap:0px 20px;cursor:pointer;flex:1;  overflow:hidden;}
.cart_inner_wrap .item_left input{display:none;}

.cart_inner_wrap .item_left input:checked + .custom_cb{background:var(--green02);color:#fff; border:1px solid var(--green02)}

.cart_inner_wrap .title{ 
font-weight: 500;
font-size: 18px;
line-height: 24px;
}

.cart_inner_wrap  .tag{display:inline-flex;align-items:center; border-radius:var(--radius04);
  color:#fff; text-align:Center; justify-content: center;
background:var(--black01);
text-align:center;
width:64px;
line-height:30px;
font-weight: 600;
font-size: 14px;
  }


.cart_inner_wrap .item_right{display:flex;align-items:center;gap:20px; }
.cart_inner_wrap .qty_ctrl{display:inline-flex;align-items:center;border:1px solid var(--border01); border-radius:var(--radius05);overflow:hidden;}

.cart_inner_wrap .btn_qty{
  width:32px;height:32px;display:inline-flex;align-items:center;justify-content:center;
  background:#fff;border:0;cursor:pointer;font-size:18px;color:var(--black04);
}
.cart_inner_wrap .btn_qty:disabled{opacity:.4;cursor:not-allowed;}
.cart_inner_wrap .qty_input{
  width:38px;height:32px;border:0 ;border-left:1px solid var(--border01); border-right:1px solid var(--border01);
  text-align:center;font-weight:600; color:var(--black04);
}
.cart_inner_wrap .qty_input:focus{outline:none;}
.cart_inner_wrap .price{min-width:130px;text-align:right;
font-weight: 400;
font-size: 20px;
line-height: 26px;
}
.cart_inner_wrap .price .num{
font-weight: 700;
}

.cart_inner_wrap .btn_trash{
background:var(--white02); 
  width:32px;height:32px;border-radius:var(--radius01);display:inline-flex;align-items:center;justify-content:center;
  cursor:pointer;transition:.15s;
}


/*-- 합산영역 --------------------*/

.cart_inner_wrap .cart_sum{ text-align:center;
  display:flex;align-items:center; justify-content:center; gap:8px 0px; padding:35px 0px;
}
	.cart_inner_wrap .cart_sum  dl {text-align:center; flex:1;}
	.cart_inner_wrap .cart_sum dt{font-size:14px; margin-bottom:4px;
	color:var(--black03);
	font-weight: 400;
	font-size: 20px;
	line-height: 26px;
	text-align: center;
	}

	.cart_inner_wrap  .cart_sum dd{color:var(--black03); font-size:20px; line-height:26px; font-weight:600;}
	.cart_inner_wrap  .cart_sum .inicon{color:var(--border03);font-size:24px; }
	.cart_inner_wrap  .cart_sum .alltotal  {display:flex; flex-wrap:wrap; gap:0px 24px; justify-content: center; }

		.cart_inner_wrap  .cart_sum .alltotal dt,
		.cart_inner_wrap  .cart_sum .alltotal dd { font-weight: 700; font-size: 24px; line-height: 32px;
		}

		.cart_inner_wrap  .cart_sum .alltotal dt{color:var(--black01);}
		.cart_inner_wrap  .cart_sum .alltotal dd{color:var(--green02);}



/*-- 버튼영역 --------------------*/

.cart_inner_wrap .cart_cta{display:flex;align-items:center; padding-top:18px; justify-content: space-between;}
	.cart_inner_wrap .cart_cta  > div {display:flex; gap:0px 16px}
	.combtnwrap button{
	line-height: 56px;
	padding: 0px 32px; border-radius:var(--radius03);
	font-weight: 600; font-size: 18px; border:0;
	}

	.combtnwrap.bottom_board_btn{justify-content:right;}
	.combtnwrap.bottom_board_btn div {display:flex; gap:0px 6px;}


	.combtnwrap button{
	border:1px solid var(--border03); color:var(--black04);
	}

	.combtnwrap.bottom_board_btn button{width:140px; padding:0px; text-align:Center;}
	.combtnwrap.bottom_board_btn button svg {margin-right:10px}

	.combtnwrap button.colorst02{
	background:var(--black03); color:#fff; border:0; font-weight:700;
	}
	.combtnwrap button.colorst02{
	  background:var(--green02);color:#fff;border:0;font-weight:700;
	}


	.combtnwrap button.colorst03{
	  background:var(--green01);color:#fff;border:0;font-weight:700;
	}
	.combtnwrap button.colorst04{
	color:var(--black01); font-weight:700;
	}

/*===========================
주문배송조회
===========================*/



/*-- step 영역--------------------*/

.order_step_wrap {gap:8px;}
	.order_step_wrap dl {flex:1; text-align:Center; display:flex; border-radius:var(--radius03);  
	height:110px; border:1px solid var(--border01); flex-direction:column;  justify-content: center; 
  align-items: center;     }
	.order_step_wrap dl.total {flex:2.5; background: var(--white02)}
.order_step_wrap dt {
font-weight: 500;
font-size: 16px;
}
.order_step_wrap dd {
font-family: Pretendard;
font-weight: 500;
font-size: 32px;
letter-spacing: -2%;
color:var(--green02);
}

.order_step_wrap dd span {
font-weight: 500;
font-size: 16px;
line-height: 24px;
letter-spacing: 0px;
color:var(--black01)
}

/*-- notice_alert_txt 영역--------------------*/

.notice_alert_txt {padding:20px 0px; text-align:right; font-size:15px; line-height:22px;}



/*-- 주문배송조회 기간설정 영역 order_search_wrap --------------------*/

.order_search_wrap form {justify-content: space-between; gap:0px 30px; padding:20px 0px; }
	.comsearch_form {}
	.order_search_wrap .calen_section {display:flex; flex:1; gap:0px 10px; align-items: center; }
		.order_search_wrap .calen_section h4 {color:var(--black04);
	font-weight: 400;  font-size: 15px; width:70px; line-height: 22px; letter-spacing: -0.02px;}
		.order_search_wrap .calen_section  .cal_inner {flex:1; display:flex; align-items: center; gap:0px 0px; color:var(--black04);}
		.order_search_wrap .calen_section input {  line-height:42px; width:calc(50% - 15px);
			border:1px solid var(--border01); border-radius:var(--radius02);
			padding-left:10px; padding-right:30px;
			background-image: url("data:image/svg+xml,%3Csvg%20width%3D'16'%20height%3D'16'%20viewBox%3D'0%200%2016%2016'%20fill%3D'none'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%3Cg%20clip-path%3D'url(%23clip0_973_2263)'%3E%3Crect%20x%3D'1.76953'%20y%3D'2.54492'%20width%3D'12.4601'%20height%3D'11.6845'%20rx%3D'1.41'%20stroke%3D'%237E7E7E'%20stroke-width%3D'1.5'%2F%3E%3Cpath%20d%3D'M4.89648%201.01953V3.73399M11.101%201.01953V3.73399'%20stroke%3D'%237E7E7E'%20stroke-width%3D'1.5'%20stroke-linecap%3D'round'%2F%3E%3Cline%20x1%3D'1.99609'%20y1%3D'6.4707'%20x2%3D'14.9802'%20y2%3D'6.4707'%20stroke%3D'%237E7E7E'%20stroke-width%3D'1.5'%2F%3E%3C%2Fg%3E%3Cdefs%3E%3CclipPath%20id%3D'clip0_973_2263'%3E%3Crect%20width%3D'16'%20height%3D'16'%20fill%3D'white'%2F%3E%3C%2FclipPath%3E%3C%2Fdefs%3E%3C%2Fsvg%3E");
			background-size: auto 16px;
			background-repeat: no-repeat;
			background-position: right 16px center;
			}
		.order_search_wrap .calen_section span {width:30px; text-align:Center;}

	.order_search_wrap .quick-range {  width:400px;
	  display:flex; border:1px solid var(--border01); border-radius:var(--radius02); overflow:hidden;
	}
	.order_search_wrap .quick-range .qr {
	  appearance:none; border:0; background:#fff; 
	  border-right:1px solid var(--border01); cursor:pointer; transition:background .15s ease, color .15s ease;
	font-weight: 400; text-align:Center; flex:1; color:var(--black04);
	font-size: 15px; line-height:42px;
	letter-spacing: -0.02px;
	}
	.order_search_wrap .quick-range .qr:last-child { border-right:0; }
	.order_search_wrap .quick-range .qr:hover { background:#f8fafc; color:#374151; }
	.order_search_wrap .quick-range .qr.select { background:var(--green02); color:#fff;  }






/*-- 주문배송조회 기간설정 영역 테이블화 mypage_inner_table --------------------*/

.mypage_inner_table {margin-top:20px;}
	.mypage_inner_table .thead_area {width:100%;  justify-content: space-between; border-bottom:1px solid var(--black04);gap:0;}
	.mypage_inner_table .thead_area p { padding-bottom:20px;font-weight: 600; font-size: 15px;  
	line-height: 22px; letter-spacing: -0.02px;text-align: center; color:var(--black02);}


.mypage_inner_table .tbody_area .tr_area   {width:100%; justify-content: space-between; border-bottom:1px solid var(--border01);
padding:24px 0px; align-items: center; transition:background .15s ease, color .15s ease;}


.mypage_inner_table .tbody_area .tr_area  .wd20per {min-width:230px;}


.mypage_inner_table .tbody_area .tr_area:hover {background:var(--white01)}

.mypage_inner_table .tbody_area .tr_area  p {text-align: center;}
.mypage_inner_table .tbody_area .tr_area .order_list dl{margin:2px 0px; display:flex; gap:0px 8px; font-size: 15px;
line-height: 22px;
letter-spacing: -0.02px;}
.mypage_inner_table .tbody_area .tr_area .order_list dl dt{ text-align:right; width:100px; color:var(--black03)}
.mypage_inner_table .tbody_area .tr_area .order_list dl dd.order_num{color:var(--green02)}
.mypage_inner_table .tbody_area .tr_area .order_list dl dd.cancel_num{color:var(--red01)}

.can_color01{color:var(--green01)}
.mypage_inner_table .tbody_area .tr_area  .intit {text-align:left;}
.mypage_inner_table .tbody_area .tr_area  .intit p { background:var(--black01);
font-weight: 600; font-size: 14px; width:fit-content;
line-height: 24px; padding:0px 16px; letter-spacing: -2%; color:#fff; border-radius:var(--radius06)
}
.mypage_inner_table .tbody_area .tr_area  .intit.coupon {display:flex; flex-wrap:nowrap; gap:0px 10px; align-items: flex-start; }
.mypage_inner_table .tbody_area .tr_area  .intit.coupon p {border-radius:var(--radius05); min-width:fit-content;}



.mypage_inner_table .tbody_area .tr_area  .intit,
.mypage_inner_table .tbody_area .tr_area  p{ font-size: 16px; line-height: 24px;}





/*===========================
취소/환불/교환
===========================*/

.tab_section {
  display:flex; margin-bottom:20px;  border:1px solid var(--border03); overflow:hidden;
}
.tab_section a {
  flex:1; text-align:center;
  color:var(--black04);
  border-right:1px solid var(--border03);  
  transition:0.2s; font-weight: 600; font-size: 16px; line-height: 24px;padding:16px 0px;
}

.tab_section a:last-child {border-right:none;}
.tab_section a.on {  color:var(--green02);  z-index:3; position:relative;}
.tab_section a.on:before {content:''; position:absolute; top:0px; left:0px; z-index:2; 
border:1px solid var(--green02); width:100%; height:100%; }
.tab_section a.on:hover {  color:var(--green02) !important;}


.tabwrap .panel {
  display:none;
}
.tabwrap .panel.active {
  display:block;
}









/*===========================
회원정보관리
===========================*/


/*-- 재인증 pass_secure_box_wrap_new --------------------*/
.pass_secure_box_wrap_new {border-radius:var(--radius02); border:1px solid var(--border01); padding:60px 0px;}
.pass_secure_box_wrap_new .tit {flex-direction:column; width:100%; gap:20px 0px; text-align:Center;}
	.pass_secure_box_wrap_new .tit svg {width:96px; height:auto; margin:0 auto;}
	.pass_secure_box_wrap_new .tit  h4 {font-weight: 700; font-size: 24px; line-height: 32px; }
		.pass_secure_box_wrap_new .tit h5 {color:var(--black04); font-weight: 500; font-size: 14px; line-height: 20px;}
/*1120 추가*/
	.pass_secure_box_wrap_new .pass_input_st {text-align:Center;  padding-top:40px;}
	.pass_secure_box_wrap_new .pass_input_st .pw-box,
	.pass_secure_box_wrap_new .pass_input_st input {line-height:50px; width:90%; max-width:315px; border-radius:var(--radius06);
	border:1px solid var(--border01); padding:0px 10px;}
	.pass_secure_box_wrap_new .pass_input_st .pw-box{padding-left:0;}
	.pass_secure_box_wrap_new .pass_input_st  dd{ padding:10px 0px;
		font-weight: 500; font-size: 12px; line-height: 20px; text-align: center; 	color:var(--red01);}
		.pass_secure_box_wrap_new .pass_input_st.pass_change dt {margin-bottom:12px;}

		.pass_secure_box_wrap_new .pass_input_st.pass_change input::placeholder {
			font-size: 14px;
		}

		.pass_secure_box_wrap_new .pass_input_st.pass_change input::-webkit-input-placeholder {
			font-size: 14px;
		}

		.pass_secure_box_wrap_new .pass_input_st.pass_change input::-moz-placeholder {
			font-size: 14px;
		}

		.pass_secure_box_wrap_new .pass_input_st.pass_change input:-ms-input-placeholder {
			font-size: 14px;
		}



	.pass_secure_box_wrap_new .pass_input_st .pw-box{
  display:flex;
  align-items:center;
  overflow:hidden;        
  margin: 0 auto;
}

	.pass_secure_box_wrap_new .pass_input_st .pw-box input{
  flex:1;  border:0; background:#fff !important;  outline:none;
}

.pass_secure_box_wrap_new .pass_input_st .pw-box button{
  border:0;
  width:40px;
  border-radius:var(--radius05);
  height:100%;
  color:#fff;
  font-size:14px;
  font-weight:600;
  cursor:pointer;
  line-height:1.5;
}


.pass_secure_box_wrap_new .pass_input_st .pw-box .pw-danger {
background:var(--red01)
}

.pass_secure_box_wrap_new .pass_input_st .pw-box .pw-good {
background:var(--green01)
}






/*-- 공통버튼영역 btnarea --------------------*/
.btnarea {display:flex; flex-wrap:wrap; gap:0px 10px; padding:10px 0px;justify-content: center; }
.btnarea.lr_align {justify-content:space-between;   width:100%}
.btnarea.lr_align  div {display:flex;gap:0px 10px;}
	.btnarea a,
	.btnarea input,
	.btnarea button {width:180px;line-height:56px; border:1px solid var(--border03);  color:var(--black04); 
	text-align:center; padding:0 !important; text-align:Center;
	font-weight: 600; font-size: 18px; border-radius:var(--radius02); display:inline-block;}	
	.btnarea .combtn{}

	.btnarea .st01{color:#fff; background:var(--green01);  font-weight: 700;  border:none }
	.btnarea .st02{color:#fff; background:var(--black02);  font-weight: 700;  border:none}



/*===========================
회원정보관리 - 수정페이지
===========================*/

	.mypage_table_innerwrapin02{margin-bottom:20px;}
	.mypage_table_innerwrapin02 dl { display:flex; gap:0px 20px;
	align-items: center;
	padding:12px 12px; border-bottom:1px solid var(--border01) }
		.mypage_table_innerwrapin02 dl dt {max-width:160px;  text-align:Center;width:30%; color:var(--black03)}
		.mypage_table_innerwrapin02 dl dd {flex:1; color:var(--black06)}

			.mypage_table_innerwrapin02 dl dd p.memo ,
			.mypage_table_innerwrapin02 dl dd select,
			.mypage_table_innerwrapin02 dl dd input[type='password'],
			.mypage_table_innerwrapin02 dl dd input[type='text'],
		.mypage_table_innerwrapin02 dl dt,
		.mypage_table_innerwrapin02 dl dd {font-size: 16px;line-height: 24px; letter-spacing: 0px;}
		.mypage_table_innerwrapin02 dl dt{font-weight:600}

			.mypage_table_innerwrapin02 dl dd textarea {border-radius:var(--radius05);  border:1px solid var(--border01);}

			.mypage_table_innerwrapin02 dl dd input.tel {max-width:130px; width:27%;}
			.mypage_table_innerwrapin02 dl dd p.memo {width:100%; min-height:80px; padding:12px 8px;
			background:var(--white01);
			border-radius:var(--radius05);  }


			.mypage_table_innerwrapin02 dl dd select,
			.mypage_table_innerwrapin02 dl dd input[type='password'],
			.mypage_table_innerwrapin02 dl dd input[type='text']{line-height:36px; height:36px; border:1px solid var(--border01);
			border-radius:var(--radius05); padding:0px 10px; color:var(--black03);margin-right:2px; }
			.mypage_table_innerwrapin02 dl dd select { 
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
}
			.mypage_table_innerwrapin02 dl dd  a.h_btn_st2 {   padding:0px 10px; display:inline-block; vertical-align:middle;
			background:var(--black03); 
			border-radius:var(--radius05);  color:#fff; line-height:36px; height:36px;}


.mypage_table_innerwrapin02 dl dd select{
background-color:none !important;
background-image: url("data:image/svg+xml,%3Csvg%20width%3D'20'%20height%3D'20'%20viewBox%3D'0%200%2020%2020'%20fill%3D'none'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%3Cpath%20d%3D'M12.3233%201.42578L16.3177%208.34433H8.32888L12.3233%201.42578Z'%20fill%3D'%237E7E7E'%2F%3E%3Cpath%20d%3D'M12.3251%2018.5742L8.33071%2011.6557L16.3196%2011.6557L12.3251%2018.5742Z'%20fill%3D'%237E7E7E'%2F%3E%3C%2Fsvg%3E");
background-repeat: no-repeat;
background-size: auto 18px;
background-position:center right 14px;
}

/* 체크박스 기본 스타일 */
.mypage_table_innerwrapin02 dl dd input[type='checkbox'] {
  width:24px;
  height:24px; margin-right:3px;
  border-radius:var(--radius05);
  border:1px solid var(--border01);
  display:inline-flex;
  align-items:center;
  justify-content:center;
  background:#fff;
  position:relative;
  transition:.15s;
  appearance:none; /* 기본 체크박스 숨김 */
  cursor:pointer;
}

/* 체크 상태일 때 */
.mypage_table_innerwrapin02 dl dd input[type='checkbox']:checked {
  background:var(--green02);
  border:1px solid var(--green02);
  color:#fff;
  font-weight:600;
}

/* 체크 표시(✓) 추가 */
.mypage_table_innerwrapin02 dl dd input[type='checkbox']:checked::after {
  content:"✓";
  line-height:24px;
  font-size:19px;
  color:#fff;
  transform:translateY(-1px);
}



/*===========================
배송지 관리
===========================*/

.address-list{display:flex;  flex-wrap:wrap;gap:20px; overflow:hidden; justify-content: space-between; width:100%; }
.address-list .addr-item{ position:relative; width:calc(50% - 10px);  }

/* 라디오 숨기기 DOM에만 두기 */
.address-list .addr-radio{  position:absolute;  opacity:0;  pointer-events:none;}

.address-list .addr-card{ overflow:hidden;
  border:1px solid var(--border03);
  border-radius:var(--radius03);
  background:#fff;
  transition: border-color .15s, box-shadow .15s, background .15s;
}


/* .addr-card:hover,
.addr-card:focus-visible{ 추수에 요청시} */

/* 헤더영역 */
.address-list .addr-top{
  display:flex; align-items:center; gap:10px;
  padding:14px 16px;
  background:var(--white02);
  position:relative;
 border-top-left-radius:inherit;   
  border-top-right-radius:inherit;

}
.address-list .addr-card .addr-name{ font-weight: 600;font-size: 16px;line-height: 24px; }

/* 삭제 버튼 */
.address-list .addr-card .btn-del{
  margin-left:auto;
  border-radius:var(--radius05);
  background:var(--black04);
  color:#fff;
  font-size:13px; line-height:32px; padding:0px 16px;
  cursor:pointer;
}
.address-list .addr-card .btn-del:hover{ filter:brightness(0.95); }

/* 본문 */
.address-list  .addr-body{
  padding:10px 24px;
font-size: 14px;
line-height: 20px;
letter-spacing: -2%;

}
.address-list  .addr-body div{ color:#4a4f55; }
.address-list  .addr-body div + div{ margin-top:6px; }

/* 커스텀 라디오 모양 */
 .address-list  .fake-radio{
  width:22px; height:22px; border-radius:50%;
  border:2px solid #c6ccd2;
  display:inline-block;
  position:relative;
}
 .address-list .fake-radio::after{
  content:""; position:absolute; inset:2px;
  border-radius:50%; background:transparent;
  transition: background .15s;
}

/* 선택 상태 */
 .address-list .addr-item .addr-radio:checked + .addr-card{
  border-color:var(--green02);

}
 .address-list .addr-item .addr-radio:checked + .addr-card .addr-top{
/*   background:#eef6ff; */
}
 .address-list .addr-item .addr-radio:checked + .addr-card .fake-radio{
  border-color:var(--green02);
}
 .address-list .addr-item .addr-radio:checked + .addr-card .fake-radio::after{
  background:var(--green02);
}



/*===========================
아이디 / 비밀번호찾기 공통 스타일
===========================*/

/*공통틀*/
.login_inner_com_wrap{margin-left:auto; margin-right:auto;  margin-top:90px; margin-bottom:90px;
max-width:480px; width:90%; }

.login-wrap-new h2,
.login_inner_com_wrap h2 {
color:var(--black01);
text-align:Center; 
font-weight: 700;
font-size: 24px;
line-height: 46px;
letter-spacing: 0%; width:fit-content;
text-align: center;
background:url('/skin/schoolc/upload/happy_config/info_logo.png') no-repeat left center;
padding-left:60px;
background-size:auto 46px;
margin-bottom:32px;
margin-left:auto; margin-right:auto; 
}

/* top_link */
.login_inner_com_wrap .top_link {width:100%; margin-bottom:32px; }
	.login_inner_com_wrap .top_link a{ flex:1; 
	font-weight: 700; color:var(--black03); text-align:center; line-height:64px;
	font-size: 18px;
	border-bottom:2px solid var(--border02);
	}
	.login_inner_com_wrap .top_link a.on {color:var(--green02); border-color:var(--green02)}

/* input_form_wrapin */

.btn-login-com,
.input_form_wrapin {flex-direction:column; gap:10px 0px;}

	.input_form_wrapin .withbtn2,
	.btn-login-com select,
	.btn-login-com input,
	.btn-login-com a,
	.btn-login-com button,
	.input_form_wrapin input,
	.input_form_wrapin a,
	.input_form_wrapin button {line-height:50px !important;  font-size:18px;  
	padding:0px 20px; border-radius:var(--radius02); border:1px solid var(--border01)}

	.btn-login-com dd a {display:inline-block;}
	.input_form_wrapin .withbtn2 {align-items: center;}

		.btn-login-com select{height:50px;}
	.input_form_wrapin input {width:100%;}
	.input_form_wrapin  input:focus {border:1px solid  var(--black01);    outline: none;  box-shadow: none;  }
.input_form_wrapin.login {display:flex; flex-direction:column; gap:10px 0px;}


.input_form_wrapin .withbtn {gap:0px 8px; width:100%;}
.btn-login-com .st01,
.input_form_wrapin .btn-login, 
	.input_form_wrapin .withbtn  a { background:var(--green02); color:#fff; border-color:transparent;}
	.input_form_wrapin .withbtn  a.st02 { background:var(--black04); }


	.input_form_wrapin .withbtn  a {width:100px; }
	.input_form_wrapin .withbtn input {flex:1}

	.input_form_wrapin .withbtn2 input {border:none;}
	.input_form_wrapin .withbtn2  a { line-height:24px !important;  font-size: 14px;  border-radius:var(--radius04);
	color:#fff; background:var(--border03); padding:0px 15px; }
	.input_form_wrapin .withbtn2 input {flex:1}
	.input_form_wrapin .withbtn2 .navertxt {background:url('/skin/schoolc/img/sns_icon/sns02.gif') no-repeat center left;
	background-size:auto 24px; padding-left:30px; flex:1;
	}


.input_form_wrapin .btn_under {margin-top:20px; padding-top:20px; flex-direction:column;display:flex; width:100%}

.input_form_wrapin .disabled { opacity: 0.5;   pointer-events: none;}
	.input_form_wrapin .disabled button,
	.input_form_wrapin .disabled  a {background:var(--border01)}






/* input_form_btn */
.input_form_btn {flex-direction:column; gap:8px 0px; margin-top:32px;}
	.input_form_btn button,
	.input_form_btn a{border-radius:var(--radius02); line-height:56px; color:#fff; background:var(--black02);
font-weight: 700;font-size: 18px; display:flex; justify-content: center;}

	.input_form_btn .st01{ background:var(--green02);}
	.alert_meg {color:var(--red01);font-size: 16px; line-height: 24px;}



/*===========================
로그인
===========================*/

.login-wrap-new {
  display: flex;
  align-items: center;
  justify-content: center;
  position:relative; z-index:1;
  flex-direction:column;
  gap:20px 0px;
}



.bgsection {  position: fixed;
  background:rgba(0,0,0,0.3);
  z-index:99999; top:0; left:0;
  width: 100%;
  height: 100vh;}






/* 로그인 박스 */

.login-box {
  position: relative; z-index: 10;
  width: 90%; max-width: 500px; box-sizing:border-box;
  background: #fff;
  border-radius: 16px;
  text-align: center;
padding:90px 90px;
border-radius:var(--radius07);
}

 .login-box.widthst02 {max-width:540px;padding-left:0; padding-right:0}


/* SNS 로그인 */
.sns-login { width:80%; overflow:hidden; z-index:2; margin-left:auto; margin-right:auto;
padding:30px 0px; }
	.sns-login h3 { position:relative; overflow:hidden; }
		.sns-login h3:after{ content: ''; width:100%; height:1px; 
position: absolute; top: 50%; left: 0; width: 100%; background:var(--border03); transform: translateY(-50%); z-index: 2;}
		.sns-login h3  p {color:var(--border03); background:#fff; padding:0px 20px; font-weight: 600;  margin-left:auto; margin-right:auto;
		font-size: 16px;line-height: 24px; z-index:3; position:relative; width:fit-content;}
	.sns-btns { 
	  display: flex;  justify-content: center;  gap: 24px; padding-top:20px;
	}

/* 하단 링크 */
.login-links {display: flex;  justify-content: center; gap:0px 32px;  }
	.login-links a { font-weight: 700; font-size: 18px; line-height: 24px; color:var(--black04)}
	.login-links a.line {text-decoration:underline}



/*===========================
로그인
===========================*/

/* 로그인 박스 */
.join_sort {gap:16px; }
.join_sort div { flex:1; cursor:pointer; color:var(--black01);
font-weight: 500; height:160px; font-size: 16px; line-height: 24px; letter-spacing: 0px;
text-align:left; border-radius:var(--radius01); padding:20px; border:2px solid var(--black01);}
.join_sort div p { padding-bottom:10px; font-weight: 600;  color:var(--black01);
font-size: 24px; line-height: 32px;
}

.join_sort div.on {background:var(--green01); border-color:transparent; }
.join_sort div.on,
.join_sort div.on * {color:#fff;}





/*===========================
회원가입
===========================*/


.agree-list {  display: flex; gap: 20px 0px; flex-wrap:wrap;
 border-top:1px solid var(--border01); padding:32px 0px;
 border-bottom:1px solid var(--border01)
}

.agree-list, .agree-list .all_select { border-top:1px solid var(--border01);}
	.agree-list  .agree-item { display: flex; gap:16px 0px; width:100%;  justify-content: space-between; align-items: center;}
	.agree-list, .agree-list .all_select {text-align:Center; padding:20px 0px; justify-content: center;}

/* 라벨 */
.agree-list  .checkbox-wrap {
  display: flex;
  align-items: center;
  cursor: pointer;
  position: relative;
  font-size: 15px;
  color: var(--black05);
font-size: 20px;
line-height: 26px;
}

.agree-list  .checkbox-wrap em {padding-right:5px; color:var(--black03);}
.agree-list  .checkbox-wrap em.ness { color:var(--green02);}

/* 기본 체크박스 숨김 */
.checkbox-wrap input[type="checkbox"] {
  opacity: 0;
  position: absolute;
  cursor: pointer;
}

/* 커스텀 체크박스 */
.checkmark {
  width: 32px;
  height: 32px;
  border-radius:var(--radius04);
  display: inline-block;
  margin-right: 16px;
  background-color:var(--border03);
  position: relative;
  transition: all 0.2s ease;
  color:#fff;
background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%20fill%3D'none'%20stroke%3D'%23fff'%20stroke-width%3D'3'%20stroke-linecap%3D'round'%20stroke-linejoin%3D'round'%20class%3D'icon%20icon-tabler%20icons-tabler-outline%20icon-tabler-check'%3E%3Cpath%20stroke%3D'none'%20d%3D'M0%200h24v24H0z'%20fill%3D'none'%2F%3E%3Cpath%20d%3D'M5%2012l5%205l10%20-10'%20%2F%3E%3C%2Fsvg%3E");
background-size: auto 18px;
background-repeat: no-repeat;
background-position:center center;

}

/* 체크 시 초록색 */
.checkbox-wrap input[type="checkbox"]:checked + .checkmark {
  background-color:var(--green02);
}



/* 보기 버튼 */
.agree-item button {
  background: none;
  border: none;
font-size: 20px;
line-height: 26px;
  color:var(--black04);
  text-decoration:underline;
  cursor: pointer;
  transition: color 0.2s ease;
}

.agree-item button:hover {
  opacity:0.7;
}


/* 모달 공통 */
.modal-new { position: fixed; inset: 0; display:none; z-index:1000; }
.modal-new.active { display:block; }
.modal-new .overlay { position:absolute; inset:0; background:rgba(0,0,0,.6); z-index:0; }
.modal-new .modal-box, .modal .modal__dialog { position:relative; z-index:1; }


/* 모달 박스 */
.modal-new  .modal-box {
  position: absolute;
  top:50%; left:50%; transform:translate(-50%, -50%);
  max-width: 600px; padding:40px 30px;
  width: 90%; background: #fff;
  overflow: hidden;  animation: fadeIn-new 0.25s ease;
}

/* 닫기 버튼 */
.modal-new  .modal-box .close {
  position: absolute;
  right: 20px;
  top: 15px;
  background: none;
  border: none;
  font-size: 24px;
  color: #666;
  cursor: pointer;
}

/* 모달 내용 */
.modal-new  .modal-box h2 {
  font-size: 20px;
  font-weight: 600;
  line-height:1.5; 
  padding-bottom:10px; margin-bottom:20px;
  border-bottom: 1px solid var(--border02);
}

.modal-new  .modal-content {
  max-height: 60vh;
  font-weight:400;
    border: 1px solid var(--border02);
  overflow-y: auto;
  padding: 20px;
  font-size: 12px;
  line-height: 1.5;

}

/* 애니메이션 */
@keyframes fadeIn-new {
  from { opacity: 0;  }
  to { opacity: 1;  }
}


/*===========================
회원가입 - 마지막단계
===========================*/

.row_table {display:flex; flex-wrap:wrap; gap:15px 0px; flex-basis:column;  border-top: 1px solid var(--border01); padding:30px 0px;  border-bottom: 1px solid var(--border01);}
.row_table dl { text-align:left; display:flex; flex-wrap:wrap; gap:6px 0px;flex-basis:column;}

	.row_table dl dt { font-weight: 700; font-size: 16px; line-height: 24px; color:var(--black02); width:100%;}
	.mypage_table_innerwrapin02 dl dt:has(img)::after,
	.row_table dl dt:has(img)::after { content: '*'; color: var(--red01); padding-left:5px;}
	.row_table dl dd {width:100%;}
	.mypage_table_innerwrapin02 dl dt img,
	.row_table dl dt img {display:none}


/*===========================
마이페이지 - 강의상세페이지
===========================*/

.topbg07{ background:url('/skin/schoolc/html/img/sub_bg07.png') center repeat !important;  background-size:cover;}
.mypage_side  .tab_inner {display:none; padding-bottom:120px;}
.mypage_side  .btnright {display:flex; justify-content: right; width:100%; }
.mypage_side  .boardw {flex-direction: column; margin-left:auto; margin-right:auto;}


.inpass_tit {justify-content: space-between; gap:0px 10px;}
.inpass_tit .int {flex:1; }


/*공통스타일이지만 시안에서 크기가 다르거나 아이콘방향, 인풋크기가 달라 상세조정*/
.mypage_side .boardw,
.mypage_side .tab_comst01,
.mypage_side .pass_detail_con,
.mypage_side .pass_detail_top  {width:90%; max-width:1400px;}
  
.mypage_side .tab_comst01 { margin:0 auto;  padding-bottom:0px;
padding-top:40px; }
.mypage_side .tab_comst01 a { padding:0px 30px;
font-size: 22px; line-height:65px;
letter-spacing: -2%;
}
.mypage_side  .boardw {margin-top:40px;}
.mypage_side  .boardw,
.mypage_side .pass_detail_conl {border-top:1px solid var(--border03); padding-top:30px;}
.mypage_side .pass_detail_con {padding-top:40px;}


.mypage_side .pass_detail_box dl {margin-bottom:0px;}
.mypage_side .pass_detail_btn {margin-top:30px;}
.mypage_side .pass_detail_btn_w div {flex:1;}

.mypage_side .pass_detail_btn_w div  svg {width:20px; margin-bottom:5px;}

.mypage_side #toggleAllBtn.active::before{ transform: rotate(180deg);}
.mypage_side #toggleAllBtn::before{ transform:rotate(90deg);}
.mypage_side .header1 {padding-top:30px; padding-bottom:30px;}
.mypage_side .header1.active::before { transform: rotate(180deg);}
.mypage_side .header1::before { transform: rotate(90deg); opacity:0.5;}
.mypage_side .content ul li {padding-top:6px; padding-bottom:6px; padding-right:50px;
background-image: url("data:image/svg+xml,%3Csvg%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%20fill%3D'none'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%3Cg%20clip-path%3D'url(%23clip0_946_3084)'%3E%3Cpath%20d%3D'M19.6916%2010.2476C21.0747%2011.0071%2021.0747%2012.9941%2019.6916%2013.7537L8.68366%2019.7989C7.35078%2020.5309%205.72095%2019.5665%205.72095%2018.0458L5.72095%205.95537C5.72095%204.43473%207.35079%203.47035%208.68367%204.20233L19.6916%2010.2476Z'%20fill%3D'%234E4E4E'%2F%3E%3C%2Fg%3E%3Cdefs%3E%3CclipPath%20id%3D'clip0_946_3084'%3E%3Crect%20width%3D'24'%20height%3D'24'%20fill%3D'white'%20transform%3D'matrix(0%20-1%201%200%200%2024)'%2F%3E%3C%2FclipPath%3E%3C%2Fdefs%3E%3C%2Fsvg%3E");
background-size: auto 24px;
background-repeat: no-repeat;
background-position: center right 30px ;
}

.mypage_side .mypage_select_search {gap:0px 10px;}
	.mypage_side .mypage_select_search .width_type01 select,
	.mypage_side .mypage_select_search .inputtxt input, 
	.mypage_side .mypage_select_search .inputtxt button {height:57px; line-height:47px; font-size:16px}
	.mypage_side .mypage_select_search .width_type01 select{font-size:18px;}

.mypage_side .list_comst01 {padding:15px 0px;}
 .mypage_side  .notice_wrapin .list dl dt, .mypage_side  .notice_wrapin .list dl dd{
font-size: 18px;
line-height: 24px;
}
 .mypage_side  .notice_wrapin .list dl {padding:20px 12px;}



/*===========================
결제 - 바로구매하기
===========================*/


.order_new_wrap {display:flex; gap:0px 32px; border-top:none !important; padding-top:0px; flex-wrap:wrap; justify-content: space-between;}
	.order_new_wrap h3.comtit {color:var(--black01)}

	.order_new_wrap .inbottom_info {margin-top:0}
.order_new_wrap .pass_detail_conr{  flex:0 0 400px;  padding:0; box-sizing:border-box;}
	.order_new_wrap .pass_detail_conr .pass_detail_box {  padding-top:48px ;
	padding-bottom:48px; box-shadow:none; width:100%; }

.order_new_wrap .pass_detail_conl{overflow:hidden; flex:1;  padding-bottom:70px; padding-top:0; border-top:0;}
	.order_new_wrap .pass_detail_conl .mypage_right_box {display:flex; flex-direction:column; gap:32px 0px; box-sizing:border-box;
	overflow:hidden;  width:100% !important;}

.order_new_wrap .mypage_right_box {background:none; }
	.order_new_wrap .mypage_right_box .mypage_inwrap {background:#fff; border-radius:}

/*주문정보*/
.order-cart .mypage_inner_table {margin-top:22px;}

.order-cart .cart_inner_wrap .tag {width:auto;}
.order-cart .cart_inner_wrap .title  { font-weight:500; color:var(--black05) ;padding:0px 20px; box-sizing:border-box; width:auto !important; flex:1;}
.order-cart .cart_inner_wrap li .center {text-align:Center;}
.order-cart .cart_inner_wrap .cart_item {gap:0px;}
.order-cart .cart_inner_wrap span {color:var(--black05);}
.order-cart .cart_inner_wrap span.tag {color:#fff;}

/*배송정보 입력*/
.order_new_wrap .tab_section a {background:var(--white01)}
	.order_new_wrap .tab_section a.on {background:#fff}


/*할인쿠폰 + 포인트*/
.order_new_wrap .order-coupon-area { display:flex;  justify-content: space-between; align-items: center; gap:0px 32px; border-top:1px solid var(--black04); padding-top:24px; width:100%; overflow:hidden;}
	.order_new_wrap .order-coupon-area  dl {flex:1; padding-left:20px;  gap:0px 40px; display:flex; align-items: center;}
	.order_new_wrap .order-coupon-area .inputarea {flex:1; display:flex; gap:0px 20px; flex-wrap:nowrap;}
	.order_new_wrap .order-coupon-area .inputarea  dl {display:flex; gap:0px 40px; width:fit-content;}
	.order_new_wrap .order-coupon-area .inputarea .mypoint input,
		.order_new_wrap .order-coupon-area .inputarea dd { font-size: 16px;line-height: 24px;}
	.order_new_wrap .order-coupon-area .inputarea .mypoint input {border:none; width:fit-content;}
	.order_new_wrap .order-coupon-area  dl dt { font-weight: 600; color:var(--black01); font-size: 16px; line-height: 24px;}
	.order_new_wrap .order-coupon-area  dl dd  {flex:1;}
	.order_new_wrap .order-coupon-area .inputarea .mypoint dd {flex-basis:auto; width:fit-content;}
	.order_new_wrap .order-coupon-area .inputarea dl {flex-basis:auto;}
	.order_new_wrap .order-coupon-area .inputarea dd input {width:200px;}
	.order_new_wrap .order-coupon-area .inputarea dd  {flex-basis: auto;}
	.order_new_wrap .order-coupon-area  dl dd select,
		.order_new_wrap .order-coupon-area  dl dd input {height:40px; line-height:40px;   border:1px solid var(--border03);
  border-radius:var(--radius05);}

	.order_new_wrap .order-coupon-area  dl dd select { text-align:Center; width:100%;
	 appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;

  background: url("data:image/svg+xml,%3Csvg%20width='16'%20height='10'%20viewBox='0%200%2016%2010'%20fill='none'%20xmlns='http://www.w3.org/2000/svg'%3E%3Cpath%20d='M15.4734%201.32L8.39342%209.168C8.10542%209.504%207.57742%209.504%207.28942%209.168L0.20942%201.32C-0.24658%200.816%200.08942%200%200.76142%200H14.9214C15.5934%200%2015.9294%200.816%2015.4734%201.32Z'%20fill='%237E7E7E'/%3E%3C/svg%3E")
    no-repeat right 20px center;
  padding-right: 28px; /* 아이콘 공간 확보 */
  background-size: 16px auto; 
	
	}

.order_new_wrap  .btnarea-inner {gap:0px 8px; flex-wrap:nowrap;}
	.order_new_wrap  .btnarea-inner a {line-height:40px; width:100px;
	font-weight: 500; color:var(--green02); border:1px solid var(--green02); 
	font-size: 16px; text-align:Center; border-radius:var(--radius05);
	}

.order_new_wrap  .btnarea-inner a.on {background:var(--green02); color:#fff; }

/*제목 옆 주소록선택부분*/
.order_new_wrap .order_tit_list {justify-content: space-between; align-items: center; padding-bottom:22px;}
	.order_new_wrap .order_tit_list button,
	.order_new_wrap .order_tit_list a {border-radius:var(--radius05); font-size:14px;  border:1px solid var(--black04);
	color:var(--black04); padding:0px 16px; line-height: 40px; letter-spacing: -0.02px;}

/*주의사항*/
.desc-dept01  {margin-top:25px;}
	.desc-dept01 li {position:relative; margin-top:3px; padding-left:30px;
	font-weight: 600; color:var(--black04); position:relative;
	font-size: 15px; line-height: 22px; letter-spacing: -0.02px;
	}
	.desc-dept01 li:before{content:''; position:absolute; top:9px; left:20px; border-radius:var(--radius04); height:3px; width:3px; background:var(--black04); }


/*결제수단*/
.pay_sort {gap:7px; }
	.pay_sort a{flex:1; background-size:auto 50px ;  border-radius:var(--radius05); 
	border-style:solid; border-width:2px;  height:140px; border-color:var(--border01); text-align:Center;
	padding-top:90px; transition:all 1s; font-weight:700; font-size:16px;
	background-repeat:no-repeat; background-position:top 30px center;}
	.pay_sort a.pay01 {background-image:url('/img/order_sort01.png')}
	.pay_sort a.pay02 {background-image:url('img/order_sort02.png')}
	.pay_sort a.pay03{background-image:url('/img/order_sort03.png')}
	.pay_sort a.pay04 {background-image:url('/img/order_sort04.png')}
	.pay_sort a.pay05 {background-image:url('/img/order_sort05.png')}
	.pay_sort a.pay06{background-image:url('/img/order_sort06.png')}
	.pay_sort a:hover, .pay_sort a.on {border-color:var(--black01); color:var(--black01) }
	.pay_sort a.pay01.on, 
	.pay_sort a.pay01:hover{background-image:url('/img/order_sort01_on.png'); border-color:var(--green01) ; 
	color:var(--green01) !important;}
	.pay_sort a.pay02.on, 
	.pay_sort a.pay02:hover {background-image:url('/img/order_sort02_on.png'); color:#f2ce00 !important ; border-color:#f2ce00 !important;}
	.pay_sort a.pay03.on, 
	.pay_sort a.pay03:hover {background-image:url('/img/order_sort03_on.png'); }
	.pay_sort a.pay04.on, 
	.pay_sort a.pay04:hover  {background-image:url('/img/order_sort04_on.png')}
	.pay_sort a.pay05.on, 
	.pay_sort a.pay05:hover  {background-image:url('/img/order_sort05_on.png')}
	.pay_sort a.pay06.on, 
	.pay_sort a.pay06:hover{background-image:url('/img/order_sort06_on.png')}


/*총액 바로구매하기 영역*/
.order-price-inner-wrap {overflow:hidden; display:flex; flex-wrap:wrap; gap:12px 0px;}
.order-price-inner-wrap dl {width:100%; margin:0;}
.order-price-inner-wrap  dl {display:flex; flex-wrap:wrap; width:100%; justify-content:space-between;}
	.order-price-inner-wrap  dl  dt {font-weight: 600; color:var(--black05); }
	.order-price-inner-wrap  dl  dt,
	.order-price-inner-wrap  dl  dd {letter-spacing: -2%; font-size: 16px; width:auto;}
	.order-price-inner-wrap  dl  dd  { color:var(--black05); text-align:right;}
	.order-price-inner-wrap  dl dd strong {color:var(--green02); font-weight:400; padding-right:3px;}
	.order-price-inner-wrap  .detail_order {width:100%; display:flex; flex-wrap:wrap; gap:3px 0px; box-sizing:border-box; padding-left:20px;}
	.order-price-inner-wrap  .detail_order dt,
	.order-price-inner-wrap  .detail_order dd {color:var(--black04); font-weight:400; }

	.order_new_wrap .all_price_wrap { overflow:hidden; display:flex; flex-wrap:wrap; width:100%; justify-content:space-between;
	padding:30px 0px !important; border-top:1px solid var(--border04)}

		.order_new_wrap .all_price_wrap  dd {text-align:right; color:var(--green01)}
				.order_new_wrap .all_price_wrap dt,
				.order_new_wrap .all_price_wrap dd {font-size:28px; line-height:1.5; font-weight:600;}
				.order_new_wrap .pass_detail_btn {overflow:hidden;}
					.order_new_wrap .pass_detail_btn a{font-size: 18px;}

	.order_new_wrap .sort_rep { overflow:hidden; display:flex; flex-wrap:wrap; flex-basis:column; width:100%; justify-content:space-between; margin-top:30px; gap:30px 0px;
	padding-top:30px !important; border-top:1px solid var(--border04)}

	.order_new_wrap .sort_rep .rep_check {display:flex; flex-wrap:wrap; gap:10px 0px; flex-basis:column; width:100%; }
	.order_new_wrap .sort_rep .rep_check label {width:100%;font-weight: 500; font-size: 16px;letter-spacing: -2%; color:var(--black01)}

	.desc-dept02 li {position:relative; margin-top:3px; padding-left:10px;  color:var(--black03); position:relative;
	font-size: 14px; line-height: 22px; letter-spacing: -0.02px;
	}
	.desc-dept02 li:before{content:''; position:absolute; top:9px; left:0px; border-radius:var(--radius03); height:3px; width:3px; background:var(--black03); }



/*===========================
로그인 닫기버튼 추가-새로추가
===========================*/

/* 닫기버튼 */
a.modalx { background: transparent; display:block; width: 90%; max-width: 500px; text-align:right;}
a.modalx svg {color:#fff; width:clamp(50px, 2.5vw, 80px); height:clamp(50px, 2.5vw, 80px)}



/*===========================
주문배송조회 모달팝업  - 새로추가
===========================*/



.js-open-modal {cursor:pointer;}

.new_modal {
  position: fixed;
  inset: 0;
  display: none;
  justify-content: center;
  align-items: center;
  z-index: 9999;
}
.new_modal.is-open {
  display: flex;
}

.new_modal .new_modal__overlay {
  position: absolute;
  inset: 0;
  background: rgba(0,0,0,0.5);
}

.new_modal__content {
  position: relative;
  background: #fff;
  max-height: 90vh;
  overflow-y: auto;
  max-width: 745px;
  width:90%;  
}

.new_modal .intop {background:var(--black02); padding:15px 15px;
  justify-content: space-between; align-items: center;}
	.new_modal .intop h2{color:#fff;  font-size:20px; line-height:1.6; font-weight:700;}
	.new_modal .intop svg {color:#fff; stroke: #fff; width:30px; height:30px; }


.new_modal .inner_wrap {padding:15px;}

.new_modal .intop2 { padding:15px 0px;
  justify-content: space-between; align-items: center;}
	.new_modal .intop2 h2{ font-size:23px; line-height:1.6; font-weight:600;}
	.new_modal .intop2 button {color:var(--black03); stroke: #fff; padding:6px 30px 6px 10px;
	font-size:13px; line-height:1.5; 
	border-radius:var(--radius02);
	background-color:var(--white02);
	background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20fill%3D'none'%20viewBox%3D'0%200%2024%2024'%20stroke-width%3D'1.5'%20stroke%3D'currentColor'%20class%3D'size-6'%3E%3Cpath%20stroke-linecap%3D'round'%20stroke-linejoin%3D'round'%20d%3D'm8.25%204.5%207.5%207.5-7.5%207.5'%20%2F%3E%3C%2Fsvg%3E");
background-size: auto 13px;
background-repeat: no-repeat;
background-position: right 7px center;
	
	
	}


.new_modal .inner_table_section {border:1px solid var(--border01); border-top:2px solid var(--black05)}
	.new_modal .inner_table_section h3 {padding:10px 15px; font-size:18px; font-weight:600; line-height:1.5; background:var(--white02);
	color:var(--black03); border-top:1px solid var(--border01);  border-bottom:1px solid var(--border01); }

.new_modal .inner_table_section ul {padding-left:15px; padding-right:15px;}

.modal-section li {
  display: flex; width:100%; padding:10px 10px;   
  border-bottom: 1px solid var(--border01); font-size:15px;
}
.modal-section li span { color:var(--black03);  }
.modal-section li span:first-child {
width:150px;
}
.modal-section li span:last-child {flex:1}

.new_modal .inner_table_section ul li:last-child {border:none;}
.new_modal .inner_table_section ul li span.date-blue {
  color:var(--blue01);
}     



.new_modal .inner_table_section ul li  .state1 {
  background:var(--green02); font-size:12px; font-weight:500;
  color: #fff;
  padding: 3px 11px;
  border-radius: var(--radius08);
}


.new_modal .inner_table_section ul li  .state2 {
  background:var(--red01); font-size:12px; font-weight:500;
  color: #fff;
  padding: 3px 11px;
  border-radius: var(--radius08);
}

.new_modal .inner_table_section ul li  .state3 {
  background:var(--black03); font-size:12px; font-weight:500;
  color: #fff;
  padding: 3px 11px;
  border-radius: var(--radius08);
}

.new_modal .inner_table_section ul li  .state4 {
  background:var(--green01); font-size:12px; font-weight:500;
  color: #fff;
  padding: 3px 11px;
  border-radius: var(--radius08);
}

.new_modal .inner_table_section ul li  .state5 {
  background:var(--yellow01); font-size:12px; font-weight:600;
  color: #000;
  padding: 3px 11px; 
  border-radius: var(--radius08);
}






.new_modal  .modal-footer {
  display: flex;
  justify-content: space-between;
  margin-top: 30px;
}

.new_modal  .modal-footer  .modal-btn {
width:170px; text-align:Center;
line-height:50px;
display:block;
 border-radius:var(--radius06);
  font-size: 17px;
  border: none;
  cursor: pointer;
  font-weight: 800;
}

.new_modal  .modal-footer  .modal-btn.gray {
  color:var(--black04); border:2px solid var(--border03)
}

.new_modal  .modal-footer  .modal-btn.yellow {
  color:var(--black01);
  background:var(--yellow01);
}





/*====================
강좌신청완료-마지막페이지 -새로추가
===========================*/

.order_new_wrap .mypage_right_box .mypage_inwrap.order-card-last-page { text-align:Center;
background-image:url('/img/circlebg_01.gif');
background-repeat:no-repeat;
background-position:top 20px right 20px;
padding:80px 8%;}
.order_new_wrap .mypage_right_box .mypage_inwrap.order-card-last-page  h3 { color:var(--blue01); letter-spacing:-1px;
font-size:clamp(25px, 2.5vw, 40px); line-height:2; width:100%;
background:url('/img/ordericon.gif') no-repeat top 20px left 0px;}
.order_new_wrap .mypage_right_box .mypage_inwrap.order-card-last-page  h4 {text-align:left; border-bottom:1px solid var(--border01);
padding-top:20px; padding-bottom:30px; letter-spacing:-1px; line-height:1.5;}

.order_new_wrap .mypage_right_box .mypage_inwrap.order-card-last-page .order-detail-section {padding:40px 0px;  display:flex;
flex-wrap:wrap; gap:20px 0px;}

.order_new_wrap .mypage_right_box .mypage_inwrap.order-card-last-page .order-detail-section dl {display:flex; flex-wrap:nowrap; width:100%; gap:10px; text-align:left; font-size:22px; line-height:1.4;}
.order_new_wrap .mypage_right_box .mypage_inwrap.order-card-last-page .order-detail-section dl  dt {font-weight:600;max-width:200px; width:20%;  color:var(--black01)}
.order_new_wrap .mypage_right_box .mypage_inwrap.order-card-last-page .order-detail-section dl  dd { color:var(--black01); flex:1;}
.order_new_wrap .mypage_right_box .myp       age_inwrap.order-card-last-page .order-detail-section dl .copy-target {color:var(--blue01);font-weight:800;}
.order_new_wrap .mypage_right_box .mypage_inwrap.order-card-last-page .order-detail-section dl .copy-btn svg{width:18px; height:18px;}

.inner-bottom-line {display:flex; flex-wrap:wrap;gap:10px; justify-content: center; align-items: center;}
.inner-bottom-line  a {font-size:17px; line-height:50px; width:45%;max-width:160px; border-radius:var(--radius02); text-align:Center; border:1px solid var(--border01); font-weight:600;}
.inner-bottom-line  a svg {margin-right:5px; width:20px; height:20px;}
.inner-bottom-line  a.importantbtn {border:1px solid var(--green01); color:#fff; background:var(--green01)}

.order_new_wrap .pass_detail_conr .pass_detail_box h3.intit_tit {font-size:24px; margin-bottom:10px; font-weight:600;
color:var(--black03);
border-bottom:1px solid var(--border03); line-height:2.5;}
.order_new_wrap .pass_detail_conr .pass_detail_box .lec_order_thm {display:flex; flex-wrap:wrap; gap:20px;
border-bottom:1px solid var(--border01);  padding:15px 0px;
}
	.order_new_wrap .pass_detail_conr .pass_detail_box .lec_order_thm .img {width:95px;}
	.order_new_wrap .pass_detail_conr .pass_detail_box .lec_order_thm .img img {width:100%;}
	.order_new_wrap .pass_detail_conr .pass_detail_box .lec_order_thm .intxt {flex:1; display:flex; margin:0;  gap:5px 0px;flex-wrap:wrap; flex-direction:column;}
	.order_new_wrap .pass_detail_conr .pass_detail_box .lec_order_thm .intxt  dt {color:Var(--blue01); font-size:12px; line-height:1.3;}
	.order_new_wrap .pass_detail_conr .pass_detail_box .lec_order_thm .intxt  dd.int{font-size:16px; font-weight:600;}
	.order_new_wrap .pass_detail_conr .pass_detail_box .lec_order_thm .intxt  dt.total{color:var(--black01); font-size:16px; font-weight:800;}
     .order-price-inner-wrap.order-list-price-inner-wrap {padding:20px 0px; border-bottom:1px solid var(--black03)}


/*====================
새로추가  - 탭 보이는 영역
===========================*/

.tab_cont {
  display: none;
}
.tab_cont.on {
  display: block;
}

.tab_comst01 a.on {
  font-weight: 700;
}


.rightbtn{background: var(--white02);
    width: 32px;
    height: 32px;
    border-radius: var(--radius01);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: .15s;
 }