@charset "UTF-8";

@import url('https://cdn.jsdelivr.net/gh/orioncactus/pretendard/dist/web/static/pretendard.css');

*{
	margin: 0;
	padding:0;
	box-sizing:border-box;
}

body {
    font-family: "Pretendard", sans-serif;
	word-break: keep-all;
    max-width: 740px;
    font-size: 17px;
}

input, button {
	font:inherit;
}


p {
    color: #383838;
    text-align: center;
    font-family: Pretendard;
    font-size: 1.15rem;
    font-style: normal;
    font-weight: 400;
    line-height: 1.8rem; /* 157.143% */

}

.wrapper-625 p {
    font-size: 18px;
    line-height:2rem ;
}

:root {
	--hanmi-gra: linear-gradient(90deg, #E75480 0%, #984ABD 100%);
	--hanmi-border:  linear-gradient(180deg,#F467AB 0%, #B667F4BD 100%);
	--hanmi-orange-1:  #E29C75;
	--hanmi-orange-2:   #D78558;
	--hanmi-orange-3:  #C26F40;
	--hanmi-orange-4:   #B05B2A;
	--hanmi-orange-5:  #9E440F;
	--hanmi-orange-6:  #883b0f;
	--hanmi-green-1:  #55B592;
	--hanmi-green-2:  #339C76;
	--hanmi-green-3:  #1B8A62;
	--hanmi-green-4:  #0E7751;
	--hanmi-green-5:  #0C5339;
	--hanmi-purple-1:  #B55C91;
	--hanmi-purple-2:  #A04A7E;
	--hanmi-purple-3:  #8E1E62;
	--hanmi-purple-4:  #7B0E4F;
	--hanmi-purple-5:  #64033D;
	--hanmi-bg-yellow:#FEFBF3;
	--hanmi-bg-green:#F8FCF2;
	--hanmi-bg-purple:#FEF3F7;
	--hanmi-bg-blue:#E4F4F4;
  }


.nowrap {
	white-space: nowrap;
}

h1 {
    text-align: center;
    font-family: Pretendard;
    font-size: 24px;
    font-style: normal;
    font-weight: 700;
    line-height: 32px; /* 125% */
    background: var(--hanmi-gra, linear-gradient(90deg, #E75480 0%, #984ABD 100%));
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
	margin-top:15px ;
}

.h1-blue {
	background: linear-gradient(90deg, #3DB3D8 0%, #8A5CED 100%);
	background-clip: text;
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
	margin-bottom: 1rem;
    font-size: 24px;
	margin-top: 4rem;
}



.h1-white {
	color: #fff;
	margin-bottom: 1rem;
    font-size: 32px;
	margin-top: 4rem;
	font-weight: 700;
	line-height: 2.6rem;
}

.button-schedule-h1 {
	border-radius: 20%;
	border: 8px solid;
	border-image: var(--hanmi-border);
	border-image-slice: 1; 
	text-align: center;
}

.button-schedule {
	font-size: 22px;
	background-color: #fff;
	border:6px solid transparent;
	border-radius: 10%;
	border-image: var(--hanmi-border);
	border-image-slice: 10;
	padding:8px;
	margin: 10px 15px;
	

}

.h1-yellow {
	background: linear-gradient(180deg, #FEFBF8 0%, #FBE3B5 33.33%, #FBE3B5 36.46%);
	background-clip: text;
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
	margin-bottom: 2rem;
	margin-top: 3rem;
    font-size: 28px;
}

h2 {
	font-size: 20px;
	font-weight: 700;
	line-height: 34px;
	color: #666;
}

h3 { 
    color: #000;
    font-size: 20px;
    font-style: normal;
    font-weight: 700;
    line-height: 2.1875rem; /* 120.69% */
}



h4{
	color: #000;
	font-size: 1.8rem;
	font-style: normal;
	font-weight: 700;
	line-height: 2.1875rem; /* 120.69% */	
}

.h4-yellow {
	background: var(--hanmi-gra-3, linear-gradient(180deg, #FEFBF8 0%, #FBE3B5 33.33%, #FBE3B5 36.46%));
	background-clip: text;
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
	font-size: 2rem;
	font-style: normal;
	font-weight: 700;
	line-height: 2.1875rem; /* 120.69% */
	text-align: center;
}

.h4_pink {
    color: #EB4C7C;
    font-family: Pretendard;
    font-size: 1.1rem;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
}

.itemwhite_text{
	color: #FFF;
	font-size: 26px;
	font-style: normal;
	font-weight: 500;
	line-height: 2.6875rem; /* 153.571% */
}

p .itemwhite_text-20{
	color: #FFF;
	font-size: 20px;
	font-style: normal;
	font-weight: 500;
	line-height: 2.6875rem; /* 153.571% */
	margin-top: 2.6rem;
}

.title-schedule {
  font-size: 22px;
  font-weight: 700;
  text-align: center;

}

.pink-heading {
	color: #D13A67;
	text-align: center;
	font-size: 22px;
	font-style: normal;
	font-weight: 500;
	line-height: normal;
}

.special-span {
	border-radius: 0.375rem;
	border: 3px solid #C0C0C0;
	background: #FFF;
	color: #D13A67;
	text-align: center;
	font-size: 22px;
	font-style: normal;
	font-weight: 500;
	line-height: normal;
	margin: 0 10px;
	padding: 2px;
}

.schedule_heading{
	font-size: 20px;
	font-weight: 500;
	text-align: center;
	margin-top: 10px;
	margin-bottom: 36px;

}

.th_gray {
  background-color: #ddd;
  border:solid 1px #ccc;
}

.td-gray {
	background-color: #eee;
	border:solid 1px #ccc;
	padding: 4px 0;
}

.th-heading{
	color: #407CD6;
	border:solid 1px #ddd;
	padding: 8px 0;
}

.banner-black-container {
    max-width: 740px;
    width: 100%;
    height: 260px;
    flex-shrink: 0;
    background: linear-gradient(180deg, #3E3D3D 0%, #2D2C2C 100%);
    position: relative;
    padding:28px;
    display: flex;
}

.banner-white-container {
    max-width: 740px;
    width: 100%;
    height: 260px;
    flex-shrink: 0;
	background: linear-gradient(180deg, #FFF 0%, #F2F2F2 100%);
    position: relative;
    padding:28px;
    display: flex;
}

.banner-black-container-content{
    position: relative;
}

.headline-white {
    color: #FFF;
    font-family: Pretendard;
    font-size: 16px;
    font-style: normal;
    font-weight: 600;
    line-height: 30px; /* 125% */
    text-align: left;
}

.headline-white-center {
    color: #FFF;
    font-family: Pretendard;
    font-size: 2.6rem;
    font-weight: 600;
    text-align: center;
	line-height: 2.6rem; 
	margin-top: 2.6rem;
}

.headline {

    font-family: Pretendard;
    font-size: 20px;
    font-style: normal;
    font-weight: 600;
    line-height: 30px; /* 125% */
    text-align: left;
}




.subtitle {
    color: rgba(255, 255, 255, 0.75);
    font-family: Pretendard;
    font-size: 16px;
    font-style: normal;
    font-weight: 600;
    line-height: 25px; /* 142.308% */
	text-align: left;
}

.subtitle-black {

    font-family: Pretendard;
    font-size: 16px;
    font-style: normal;
    font-weight: 600;
    line-height: 25px; /* 142.308% */
	text-align: left;
}

.button-white {
    width: 180px;
    flex-shrink: 0;
    text-align: center;
    border-radius:2rem;
    background-color: #fff;
    align-content: center;
    margin-top: 2rem;
    margin-right: 3rem;
    overflow: hidden;
    text-align: center;
}

.button-white-text {
    font-size: 14px;
    font-style: normal;
    font-weight: 800;
    line-height: normal;
    background: var(--hanmi-gra, linear-gradient(90deg, #E75480 0%, #984ABD 100%));
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    padding: 0.4rem;
 
}

.main-container-center {
    position: relative;
	margin:0 auto;
	padding-top: 2.8rem;
	padding-right:0.6rem;
	padding-left:0.6rem;
	padding-bottom:1.8rem;
    text-align: center;
    max-width: 700px;
}

.main-container-center-black {
    position: relative;
	padding-top: 1.8rem;
	padding-right:0.6rem;
	padding-left:0.6rem;
	padding-bottom:1.8rem;
    text-align: center;
    max-width: 700px;
	color: #fff;
	background-color:#242424; 
}

.main-container-center img {
    margin: 0 auto;
    position: relative;
    
}

.luxury-container-center {
	position: relative;
	background: linear-gradient(180deg, #231D1D 0%, #410202 100%);
	text-align: center;
	margin:0;
	
}

.wrapper {
    position: relative;
}

.wrapper-m-center {
    margin:0.8rem 0.3rem ;
    position: relative;
    text-align: center;
    padding:2rem;
}

.wrapper-m-left {
    margin:0.8rem 0.3rem ;
    position: relative;
    text-align: left;
    padding:2rem;
}

.subheadline {
    color: #383838;
    font-family: Pretendard;
    font-size: 18px;
    font-style: normal;
    font-weight: 500;
    line-height: 24px; /* 135.714% */
    margin:10px auto;

}

.school_list {
    color: #383838;
    text-align: center;
    font-family: Pretendard;
    font-size: 16px;
    font-style: normal;
    font-weight: 600;
    line-height: 28px; /* 150% */
    margin: 16px;
}

.white-text-subtitle { 
    color: #FFF;
    text-align: center;
    font-family: Pretendard;
    font-size: 18px;
    font-style: normal;
    font-weight: 500;
    line-height: 24px; /* 135.714% */
}

.luxury-board {
    max-width: 640px;
    height: 260px;
    border-radius: 15px;
    background: #391717;
    box-shadow: 0px 8px 24px 0px rgba(0, 0, 0, 0.07);
    margin:0 auto;
    position: relative;
    display: flex;
    padding:1.4rem;

}

.luxury-board-textbox {
    display: flex;
    padding: 4px 0px 4px 9px;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    margin-right: 30px;
}

.luxury-board-title h1 {
    background: linear-gradient(270deg, #F68D76 0%, #E79B70 100%);
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font-family: Pretendard;
    font-size: 20px;
    font-style: normal;
    font-weight: 800;
    line-height: 30px;
    text-align: left;
}

.luxury-board-img {
    width: 156px;
    height: 207px;
    flex-shrink: 0;
    flex-shrink: 0;
    border-radius: 6px;
  
}

/* mobile 짧은 카드 아이템 */
.card-main-contatiner-m {
	position:relative;
	margin:0 auto;
	padding-top:1.2rem;
	padding-right:1rem;
	padding-left:1rem;
	padding-bottom:1.8rem;
	background: #FEFDF7;
	display: flex;
   

}
.card-main-container-m .card-container-m {
	position: relative;
    margin:0 auto;
}


.card-main-wrapper-m {
	position:relative;
	margin-bottom: 2.6rem;
	border:2px #814CF1;
    margin:0 auto;
    
}
.card-container-body-m {
	min-height: 76vh;
	display: flex;
	align-items: center;
	justify-content: center;
	background-color: #fff;
	position:relative;
	
}
 
.card-container-m {
	margin-bottom: 4rem;
	min-height: 17rem;
	display: flex;
	position:relative;
   
	
}

.card-container-m .card-16-m {
	background-color: #fff;
	margin-right: 0.8rem;
	box-shadow: 0px 8px 24px 0px rgba(0, 0, 0, 0.07);	
	border-radius: 0.94rem;
	margin-bottom: 7rem;
	margin-top: 1.4rem;
	position:relative;
    text-align: left;
}


.card-container-m .card-m {
	background-color: #fff;
	margin-right: 2.47rem;
	box-shadow: 0px 8px 24px 0px rgba(0, 0, 0, 0.07);	
	border-radius: 0.94rem;
	margin-bottom: 1rem;
	margin-top: 2.4rem;
	position:relative;
}

.image-content-m,
.card-content-12-m {
	padding:0.46rem;
	flex-direction:column;
	align-items:baseline;
	background-color: #fff;
	height: 14rem;
	border-radius: 0.94rem;
	overflow: hidden;
	flex-wrap: wrap;
	box-shadow: 0px 8px 24px 0px rgba(0, 0, 0, 0.07);	
	margin-bottom: 1.6rem;	
}

.image-content-m,
.card-content-6-m {
	padding:0.46em;
	flex-direction:column;
	align-items:baseline;
	background-color: #fff;
	height: 6rem;
	border-radius: 0.94rem;
	overflow: hidden;
	flex-wrap: wrap;
	box-shadow: 0px 8px 24px 0px rgba(0, 0, 0, 0.07);	
	margin-bottom: 1.6rem;	
}

.image-content-m,
.card-content-16-m {
	padding:1.46rem;
	flex-direction:column;
	align-items:baseline;
	background-color: #fff;
	height: 10rem;
	border-radius: 0.94rem;
	overflow: hidden;
	flex-wrap: wrap;
	box-shadow: 0px 8px 24px 0px rgba(0, 0, 0, 0.07);	
	margin-bottom: 1.6rem;	
}

.card-image-m {
	position: relative;
	width: 340px;
	height:160px;
	flex-shrink: 0;
	padding:0;

	
}

.card-image-m .card-img-m {
	height: 100%;
	width: 100%;
	object-fit: cover;
	border-top-left-radius: 0.94rem;
	border-top-right-radius: 0.94rem;
}


.recommand-button-number-pink {
    color: #BE1451;
    font-size: 1.2rem;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
    border-radius: 1.4rem;
    background: #FFEAEA;
    width:3.6rem;
    text-align: center;
    padding: 0.4rem;
    margin-bottom: 0.4rem;
   
}

.itembody{
    color: #666;
    font-family: Pretendard;
    font-size: 26px;
    font-style: normal;
    font-weight: 500;
    line-height: 38px; /* 135.714% */    
}


.container-rectangular {
	background: #fff;
	display: block;
	overflow: hidden;
	background-color: #fff;
	box-shadow: 0px 8px 24px 0px rgba(0, 0, 0, 0.07);	
	border-radius: 0.94rem;
    position: relative;
    padding-left: 0.6rem;
    margin-top: 0;
	margin-bottom: 2rem;

}

.dotted-list{
	color: rgba(0, 0, 0, 0.80);
	font-style: normal;
	font-weight: 500;
    position: relative;
    text-align: left;
}

.dotted-list-white {

	color: #FFF;
	font-style: normal;
	font-weight: 500;
    position: relative;
    text-align: left;

}


.dotted-list li {
	list-style-image: url("Frame.svg");
	color: #000;
    font-size: 1.2rem;
    font-style: normal;
    font-weight: 500;
    line-height: 2rem; /* 142.857% */
    padding-top: 1.12rem;
   
}

.dotted-list-white li {
	list-style-image: url("Frame-yellow.png");
	color: #fff;
    font-size: 1.2rem;
    font-style: normal;
    font-weight: 500;
    line-height: 2rem; /* 142.857% */
    padding-top: 1.12rem; 
}

.dotted-list-blue {
	color: rgba(0, 0, 0, 0.80);
	font-style: normal;
	font-weight: 500;
    position: relative;
    text-align: left;
}

.dotted-list-blue li {
	list-style-image: url("Frame-blue.png");
	
	color: #000;
    font-size: 1.2rem;
    font-style: normal;
    font-weight: 500;
    line-height: 2rem; /* 142.857% */
    padding-top: 1.12rem; 
}

.dotted-list-blue li::marker {
	font-size: 0.6rem; /* You can use px, but I think rem is more respecful */
  }


.wrapper {
	margin: 0 auto;
	width: 90%;
	margin-top: 0.6rem;
	margin-bottom: 2rem;
    position: relative;
}


.intro-container {
	position:relative;
	margin-top:-1rem;
	align-items: start;
	background-image: url(../images/junior_hanmi_student.png);
	background-repeat: no-repeat;
	background-position: right; 
	background-size: cover;
	max-width: 740px;
    height: 300px;
	filter: brightness(120%);
    
}
.intro-container-curri {
	position:relative;
	margin-top:-1rem;
	align-items: start;
	background-image: url(../images/junior_curri_intro.png);
	background-repeat: no-repeat;
	background-position: center; 
	background-size: cover;
	max-width: 740px;
    height: 400px; 
}

.intro-container-adult-speaking-m {
	position:relative;
	margin-top:-1rem;
	align-items:start;
	background-image: url(../images/adult_hanmi_student01.png);
	background-repeat: no-repeat;
	background-position: center; 
	background-size: cover;
	max-width: 740px;
    height: 460px;
	border-bottom: #D31359 solid 1.437rem;
}

.intro-container-adult-bz-m {
	position:relative;
	margin-top:-1rem;
	align-items:start;
	background-image: url(../images/adult_bz.png);
	background-repeat: no-repeat;
	background-position: center; 
	background-size: cover;
	max-width: 740px;
    height: 460px;
	border-bottom: #D31359 solid 1.437rem;
}

.intro-container-kinder-prep-m {
	position:relative;
	margin-top:-1rem;
	align-items:start;
	background-image: url(../images/kinder_prep_web01.png);
	background-repeat: no-repeat;
	background-position:right; 
	background-size: cover;
	max-width: 740px;
    height: 480px;
	border-bottom: #D31359 solid 1.437rem;
}
.intro-container-kinder-toefl {
	position:relative;
	margin-top:-1rem;
	align-items:end;
	background-image: url(../images/kinder_toefl01.png);
	background-repeat: no-repeat;
	background-position:right; 
	background-size: cover;
	max-width: 740px;
    height: 280px;
	border-bottom: #D31359 solid 1rem;
}

.intro-container-textbox {
	position:relative;
    width: 35%;
    height: 10.68rem;
	flex-shrink: 0;
	text-align: left;
	margin-top: 0;
	margin-right:12.5rem;
	margin-left: 2.12rem;
	margin-bottom: 4.25rem;
    padding-top: 1.4rem;
    padding-bottom: 2.6rem;
}



.h1-intro-black {
	color: #000;
	font-size: 2rem;
	font-style: normal;
	font-weight: 700;
	line-height: 2.4rem;
    text-align: left;
    position:relative;
    margin-top:1.6rem ;
    min-width: 300px;
    
}

.h1-intro-white {
	color: #fff;
	font-size: 2rem;
	font-style: normal;
	font-weight: 700;
	line-height: 2.4rem;
    text-align: left;
    position:relative;
    margin-top:6.1rem ;
    min-width: 300px;
    
}

.h2-intro-black {
    color: #5a5959;
	font-size: 20px;
	font-style: normal;
	font-weight: 700;
	line-height: 2em;
    text-align: left;
    position:relative;
    margin-top:1.1rem ;
    min-width: 300px;

}




.button-pinck {
	flex-shrink: 0;
	border-radius: 2.6875rem;
	background: #D31359;
	color: #FFF;
	font-family: Pretendard;
	font-size: 1.175rem;
	font-style: normal;
	font-weight: 700;
	line-height: normal;
	padding-left: 1.2rem;
	padding-right: 1.2rem;
}


.luxury-container-center {
	position:relative;
	display: block;
	background: linear-gradient(180deg, #231D1D 0%, #410202 100%);
	text-align: center;
	margin:0;
	border-top: solid  #D31359 0.5rem;

}

.wrapper-625 {
	margin:0;
    padding: 1.6rem;
}

Section img {
    width: 100%;
    margin: 1.6rem 0;
}

.button-black {
	flex-shrink: 0;
	border-radius: 2.6875rem;
	background: rgba(0, 0, 0, 0.71);
	color: #FFF;
	font-family: Pretendard;
	font-size: 1.2rem;
	font-style: normal;
	font-weight: 700;
	line-height: 2.375rem; /* 152% */
	padding-left: 1.2rem;
	padding-right: 1.2rem;
}

.beginner-hr{
    margin: 1rem auto;
}

.inter-hr{
    margin: 1rem auto;
}

.highinter-hr{
    margin: 1rem auto;
}

.advanced-hr{
    margin: 1rem auto;
}

.button-sugang {
	border-radius: 2.6875rem;
	background: #43A2AD;
	color: #FFF;
	font-family: Pretendard;
	font-size: 1rem;
	font-style: normal;
	font-weight: 400;
	line-height: 3rem; /* 152% */
	text-align: left;
	padding-left: 1.2rem;
	padding-right: 1.2rem;	
	line-height: 1.2rem;
	margin-top:36px ;
	margin-bottom: 10px;
	overflow-wrap: anywhere;
	
}
.button-sugang-no {
	border-radius: 2.6875rem;
	background: #ccc;
	color: #FFF;
	font-family: Pretendard;
	font-size: 1rem;
	font-style: normal;
	font-weight: 400;
	line-height: 2.375rem; /* 152% */
	text-align: left;
	padding-left: 1.2rem;
	padding-right: 1.2rem;	
	line-height: 1.2rem;
	margin-top:36px ;
	margin-bottom: 10px;
}

.sugang-info-table {
	margin: 30px 16px;
	width: 94%; 
	text-align: center;
	background-color:#ffffff53;
	padding:2px;
	position:relative;
}

.sugang-info-table tr{
	border-top: #ddd solid 2px;
}

.sugang-info-table td {
text-align: left;
padding: 14px;
border: 0px;
}





.button-green-textbook {
	border-radius: 2.6875rem;
	background: #188818;
	color: #FFF;
	font-family: Pretendard;
	font-size: 1.2rem;
	font-style: normal;
	font-weight: 700;
	line-height: 2.375rem; /* 152% */
	text-align: center;
	padding-left: 1.2rem;
	padding-right: 1.2rem;	
	line-height: 1.2rem;
	margin-top:36px ;
	margin-bottom: 10px;

}

.button-blue-textbook {
	border-radius: 2.6875rem;
	background: #1D9F9F;
	color: #FFF;
	font-family: Pretendard;
	font-size: 1.2rem;
	font-style: normal;
	font-weight: 700;
	line-height: 2.375rem; /* 152% */
	text-align: center;
	padding-left: 1.2rem;
	padding-right: 1.2rem;
	margin: 1.2rem ;
	line-height: 1.2rem;
}

.button-orange-textbook {
	border-radius: 2.6875rem;
	background: #E26509;
	color: #FFF;
	font-family: Pretendard;
	font-size: 1.2rem;
	font-style: normal;
	font-weight: 700;
	line-height: 2.375rem; /* 152% */
	text-align: center;
	padding-left: 1.2rem;
	padding-right: 1.2rem;
	margin: 1.2rem ;
	line-height: 1.2rem;
}

.button-purple-textbook {
	border-radius: 2.6875rem;
	background: #9E64CA;
	color: #FFF;
	font-family: Pretendard;
	font-size: 1.2rem;
	font-style: normal;
	font-weight: 700;	
	text-align: center;
	padding-left: 1.2rem;
	padding-right: 1.2rem;
	margin: 1.2rem ;
	line-height: 1.2rem;
	
}

.button-yellow-textbook {	
	border-radius: 2.6875rem;
	background: linear-gradient(180deg, #FFF4E2 0%, #FBE3B5 33.33%, #FBE3B5 36.46%);
	color: #000;
	font-family: Pretendard;
	font-size: 1.2rem;
	font-style: normal;
	font-weight: 700;
	line-height: 2.375rem; /* 152% */
	text-align: center;
	padding-left: 1.2rem;
	padding-right: 1.2rem;
	margin: 2rem ;
}

.rectangle_gray {
	width: 100%;
	flex-shrink: 0;
	border-radius: 0.9375rem;
	background: #2C2C2C;
	display:block;
	position: relative;
	text-align: left;
	margin: 5rem auto;
	padding: 1.2rem;
}

.rectangle_gray .img-gray {
	text-align: center;
	position: relative;
	width: 200px;
	height: auto;
  }


  .container_whitetext {
	text-align: left;
	font-size: 2.6em;
	font-weight: 400;
	line-height: 3rem;
	color: #fff;
	padding: 3rem 1.2rem;
}


.beginner-hr {
	width: 20rem;
	height: 1em;
	border:0;
	border-top: 5px dotted #7BB47B;
	margin: 1.5rem auto;
}

.inter-hr {
	width: 20rem;
	height: 1em;
	border:0;
	border-top: 5px dotted #209999;
	margin: 1.5rem auto;
}

.highinter-hr {
	width: 20rem;
	height: 1em;
	border:0;
	border-top: 5px dotted #FEB784;
	margin: 1.5rem auto;
}

.advanced-hr {
	width: 20rem;
	height: 1em;
	border:0;
	border-top: 5px dotted #BD8EE0;
	margin: 3.12rem auto;
}

.gray-hr {
	width: 100%;
	height: 0.3125rem;
	flex-shrink: 0;
	border-top: 5px solid #525252;
	margin: 1.5rem auto;
}

.realclass{
    max-width:150px ;
}

.singlbook img {
    width: 150px;
    height: 200px;
}

.button-skyblue-textbook {
	border-radius: 2.6875rem;
	background: linear-gradient(180deg, #A0FFFF 0%, #79D3EF 100%);
	font-size: 1.2rem;
	font-style: normal;
	font-weight: 400;
	line-height: 2.375rem; /* 152% */
	text-align: center;
	padding-left: 1.2rem;
	padding-right: 1.2rem;
	margin: 2rem ;
}

.button-pink-textbook {
	border-radius: 2.6875rem;
	background: linear-gradient(180deg, #FFB6C7 0%, #FF92AB 100%);
	font-size: 1.2rem;
	font-style: normal;
	font-weight: 400;
	line-height: 2.375rem; /* 152% */
	text-align: center;
	padding-left: 1.2rem;
	padding-right: 1.2rem;
	margin: 2rem ;
}

.button-purple-textbook {
	border-radius: 2.6875rem;
	background: linear-gradient(180deg, #E2BCFF 0%, #BF6CFF 100%);
	font-size: 1.2rem;
	font-style: normal;
	font-weight: 400;
	line-height: 2.375rem; /* 152% */
	text-align: center;
	padding-left: 1.2rem;
	padding-right: 1.2rem;
	margin: 2rem ;
}

.h4-skyblue {
	background: linear-gradient(180deg, #A0FFFF 0%, #79D3EF 100%);
	background-clip: text;
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
	font-size: 2rem;
	font-style: normal;
	font-weight: 700;
	line-height: 2.1875rem; /* 120.69% */
	text-align: center;
}

.h4-pink {
	background: linear-gradient(180deg, #FFB6C7 0%, #FF92AB 100%);
	background-clip: text;
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
	font-size: 2rem;
	font-style: normal;
	font-weight: 700;
	line-height: 2.1875rem; /* 120.69% */
	text-align: center;
}

.h4-purple {
	background: linear-gradient(180deg, #E2BCFF 0%, #BF6CFF 100%);
	background-clip: text;
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
	font-size: 2rem;
	font-style: normal;
	font-weight: 700;
	line-height: 2.1875rem; /* 120.69% */
	text-align: center;
}
.container-class-2days{
	position: relative;
}
.schedule-table {
	margin: 10px 16px;
	width: 94%; 
	text-align: center;
	background-color: #fff;
	padding:2px;
	position:relative;
	
	
}

.tr-1-orange .time {
    width: 15%;
    align-items: center;
    text-align: center;
    padding: 0.2rem;
    background-color: var(--hanmi-orange-1);
}

.tr-2-orange .time {
    width: 15%;
    align-items: center;
    text-align: center;
	padding: 0.2rem;
    background-color: var(--hanmi-orange-2);
}

.tr-3-orange .time {
    width: 15%;
    align-items: center;
    text-align: center;
    padding: 0.2rem;
    background-color: var(--hanmi-orange-3);
}

.tr-4-orange .time {
    width: 15%;
    align-items: center;
    text-align: center;
	padding: 0.2rem;
    background-color: var(--hanmi-orange-4);
}

.tr-5-orange .time {
    width: 15%;
    align-items: center;
    text-align: center;
	padding: 0.2rem;
    background-color: var(--hanmi-orange-5);
}

.tr-6-orange .time {
    width: 15%;
    align-items: center;
    text-align: center;
	padding: 0.2rem;
    background-color: var(--hanmi-orange-6);
}

.date-2days {
    width: 42%;
    padding: 1rem;
}

.curri {
    width: 42%;
    text-align: center;
    padding: 0.2rem;
    border-bottom: 0.8px solid #666;
    border-left: 0.8px solid #666; 
	flex-wrap: nowrap;
}


.date-3days {
    width: 28%;
	padding: 1rem;
}

.date-4days {
    width: 22%;
    padding: 1rem;
}

.curri-3days {
    width: 25%;
    text-align: center;
    padding: 0.2rem;
    border-bottom: 0.8px solid #666;
    border-left: 0.8px solid #666; 
	overflow: hidden;
	
}



.tr-1-green .time {
    width: 15%;
    align-items: center;
    text-align: center;
	padding: 0.2rem;
    background-color: var(--hanmi-green-1);
}
.tr-2-green .time {
    width: 15%;
    align-items: center;
    text-align: center;
	padding: 0.2rem;
    background-color: var(--hanmi-green-2);
}
.tr-3-green .time {
    width: 15%;
    align-items: center;
    text-align: center;
    padding: 0.2rem;
    background-color: var(--hanmi-green-3);
}
.tr-4-green .time {
    width: 15%;
    align-items: center;
    text-align: center;
	padding: 0.2rem;
    background-color: var(--hanmi-green-4);
}
.tr-5-green .time {
    width: 15%;
    align-items: center;
    text-align: center;
	padding: 0.2rem;
    background-color: var(--hanmi-green-5);
}

.tr-1-purple .time {
    width: 15%;
    align-items: center;
    text-align: center;
    padding: 0.2rem;
    background-color: var(--hanmi-purple-1);
}

.tr-2-purple .time {
    width: 15%;
    align-items: center;
    text-align: center;
	padding: 0.2rem;
    background-color: var(--hanmi-purple-2);
}

.tr-3-purple .time {
    width: 15%;
    align-items: center;
    text-align: center;
	padding: 0.2rem;
    background-color: var(--hanmi-purple-3);
}

.tr-4-purple .time {
    width: 15%;
    align-items: center;
    text-align: center;
    padding: 0.2rem;
    background-color: var(--hanmi-purple-4);
}
.tr-5-purple .time {
    width: 15%;
    align-items: center;
    text-align: center;
	padding: 0.2rem;
    background-color: var(--hanmi-purple-5);
}

.time{
	background-color: #fff;
    border-left: #fff;
	color: #fff;

}

.time-2days, .date-2days, .date-3days, .date-4days {
  border-top: #000 solid;
  border-left:#aaa solid 1px;
  border-bottom:#999 solid 1px;
}