@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;
}

input, button {
	font:inherit;
}

.nowrap {
	white-space: nowrap;
	overflow: hidden;
}



h1{
	
	font-size: 2.875rem;
	font-style: normal;
	font-weight: 800;
	line-height: 4.0625rem; /* 141.304% */
	margin-top:3rem;
	margin-bottom: 1.8rem;
	
}

:root {
	--hanmi-gra: linear-gradient(90deg, #E75480 0%, #984ABD 100%);
	--hanmi-border:  linear-gradient(180deg,#F467AB 0%, #B667F4BD 100%);
	--hanmi_gra1: linear-gradient(90deg, #1DAA99 0%, #2F9953 55.71%, #3F8B59 103.85%);
	--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-pink:#FFF3F3;
	--hanmi-pink:#C1174A;
  }


h1, .bg-red {
  background: var(--hanmi-gra);
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  

}

.h1-op {
  color: rgba(0, 0, 0, 0.0);

}

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

.h1-white {
	color: #fff;
	font-size: 2.4rem;
	line-height: 2.6rem;
}

.h1-black {
	color: #000;
	font-size: 2.4rem;
	line-height: 2.6rem;
}

.title-schedule {
	color: #000;
	font-size: 2.4rem;
	line-height: 2.6rem;
	font-weight: 700;
	margin-bottom: 1.6rem;
	margin-top: 2rem;
	text-align: center;
}


/*소제목*/
h2{
	color: #383838;
	font-size: 2rem;
	font-style: normal;
	font-weight: 700;
	line-height: 2.5625rem; /* 136.667% */	
	word-break: keep-all;
	margin-top: 1.8rem;
}

.h1-intro-black {
	color: #000;
	font-size: 4.375rem;
	font-style: normal;
	font-weight: 700;
	line-height: normal;
}

.h1-intro-white {
	color: #FFF;
	font-size: 4.375rem;
	font-style: normal;
	font-weight: 700;
	line-height: normal;
}

h4{
	color: #000;
	font-size: 1.8em;
	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-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;
}



.h1sub_heading {
	color: #383838;
	font-size: 2.375rem;
	font-style: normal;
	font-weight: 700;
	line-height: 2.8125rem;
}

.h1sub_heading_pink{
	color: #EB4C7C;
	font-size: 2.375rem;
	font-style: normal;
	font-weight: 800;
	line-height: 2.8125rem; /* 118.421% */
}

.h1sub_heading_white {
	color: #FFF;
	font-family: Pretendard;
	font-size: 3.125rem;
	font-style: normal;
	font-weight: 700;
	line-height: normal;

}
.pink-heading{
	color: #D13A67;
	text-align: center;
	font-size: 2rem;
	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;

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

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

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

}


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




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

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

.button-orange-textbook {
	border-radius: 2.6875rem;
	background: #E26509;
	color: #FFF;
	font-family: Pretendard;
	font-size: 1.5625rem;
	font-style: normal;
	font-weight: 700;
	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: #9E64CA;
	color: #FFF;
	font-family: Pretendard;
	font-size: 1.5625rem;
	font-style: normal;
	font-weight: 700;
	line-height: 2.375rem; /* 152% */
	text-align: center;
	padding-left: 1.2rem;
	padding-right: 1.2rem;
	margin: 2rem ;
}

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


.item {
	color: rgba(0, 0, 0, 0.80);
	font-size: 1.5625rem;
	font-style: normal;
	font-weight: 500;
	line-height: 2.25rem; /* 144% */
}

.itemhead{
	color: #383838;
	font-size: 1.875rem;
	font-style: normal;
	font-weight: 700;
	line-height: 2rem; /* 136.667% */
	margin-bottom: 1.8rem;
	
}
.itemheadnumber{
	color: #EB4C7C;
	font-size: 1.75rem;
	font-style: normal;
	font-weight: 800;
	line-height: normal;
}

.itembody{
	color: rgba(0, 0, 0, 0.70);
	font-size: 1.75rem;
	font-style: normal;
	font-weight: 500;
	line-height: normal;
	margin-top:0.48rem ;
	padding-bottom: 2rem;
 }

.itemwhite_title {
	color: #FFF;
	font-size: 1.8rem;
	font-style: normal;
	font-weight: 800;
	line-height: normal;
	padding-bottom: 1.4rem;
	
}

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

.itemwhite_bg_green {
	border-radius: 0.9375rem;
	background: linear-gradient(180deg, #5BDBC4 0%, #3DB2AB 100%);
	box-shadow: 0px 8px 24px 0px rgba(0, 0, 0, 0.07);
	padding:2.65rem;
	margin-bottom: 5rem;
	height: 22rem;
}

.itemwhite_bg_orange {
	border-radius: 0.9375rem;
	background: linear-gradient(180deg, #FF7E96 0%, #DF5317 100%);
	box-shadow: 0px 8px 24px 0px rgba(0, 0, 0, 0.07);
	padding:2.65rem;
	margin-bottom: 5rem;
	height: 22rem;
}
.itemwhite_bg_purple {
	border-radius: 0.9375rem;
	background: linear-gradient(180deg, #A94BD6 0%, #AD1695 100%);
	box-shadow: 0px 8px 24px 0px rgba(0, 0, 0, 0.07);
	padding:2.65rem;
	margin-bottom: 5rem;
	height: 22rem;
}

.itemhead_only {
	color: #000;
	font-size: 1.8125rem;
	font-style: normal;
	font-weight: 500;
	line-height: 2.1875rem; /* 120.69% */
}	

.dotted-list{
	color: rgba(0, 0, 0, 0.80);
	font-size: 1.5625rem;
	font-style: normal;
	font-weight: 500;
	line-height: 2.25rem; /* 144% */
	padding-left: 2rem;
}

.dotted-list li {
	list-style-image: url("Frame.svg");
	font-size: 1.5625rem;	 
}

p{
	color: rgba(0, 0, 0, 0.80);
	font-size: 1.75rem;
	font-style: normal;
	font-weight: 500;
	line-height: 2.5rem; /* 142.857% */
}

.buttontitle{
	border-radius: 1.875rem;
	background: -webkit-linear-gradient(#E374F5 0%, #814CF1 100%);
	background: -o-linear-gradient(#E374F5 0%, #814CF1 100%);
	background: linear-gradient(#E374F5 0%, #814CF1 100%);
	color: #FFF;
	font-size: 1.6875rem;
	font-style: normal;
	font-weight: 800;
	line-height: normal;
	align-content: center;
	margin-bottom: 2.1rem;
	margin-top: 2.1rem;
	padding-left: 1.5rem;
	padding-right: 1.5rem;
	padding-top: 0.4rem;
	padding-bottom: 0.4rem;
	display: inline-block;
	text-align: center;
}
.smallbody{
	color: #383838;
	font-size: 1.625rem;
	font-style: normal;
	font-weight: 500;
	line-height: 2.5625rem; /* 146.154% */
	word-break: keep-all;
}
.pstrong{
	color: #383838;
	font-size: 1.75rem;
	font-style: normal;
	font-weight: 700;
	line-height: 2.8125rem; /* 160.714% */
}

.dotted-list li {
  position: relative;
  padding: 8px 0;
}

/* Pseudo-element to add the dotted border after each list item except the last one */
.dotted-list li:not(:last-child)::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 1px;
  background-image: linear-gradient(to right, black 33%, transparent 0%);
  background-position: 0 50%;
  background-size: 6px 1px;
  background-repeat: repeat-x;
}

.summary_text {
	color: rgba(0, 0, 0, 0.80);
	font-size: 1.75rem;
	font-style: normal;
	font-weight: 500;
	line-height: 2.5rem; /* 142.857% */
	margin-top: 3.6rem;
	
}
.summary_text_strong {
	color: #383838;
font-size: 1.75rem;
font-style: normal;
font-weight: 700;
line-height: 2.8125rem; /* 160.714% */
margin-top: 2.2rem;
margin-bottom: 2.2rem;
 }

.description_text {
	color: rgba(0, 0, 0, 0.80);
	font-size: 1.75rem;
	font-style: normal;
	font-weight: 500;
	line-height: 2.5rem; /* 142.857% */
}


/*///////////스타일 ///////////////////////////*/


section {
	padding-top: 5rem;
	padding-bottom: 5rem;
}


.intro-container {
	position:relative;
	margin:0;
	align-items: start;
	background-image: url(../images/junior_hanmi_student.png);
	background-repeat: no-repeat;
	background-position: left; 
	background-size: cover;
	padding-top:0.2rem;
	padding-right:0.6rem;
	padding-left:0.6rem;
	padding-bottom:2rem;
	text-align: center;
	width: 100%;
}

.intro-container-curri {
	position:relative;
	margin:0;
	align-items: start;
	background-image: url(../images/junior_curri_intro.png);
	background-repeat: no-repeat;
	background-position: top; 
	background-size: cover;
	padding-top:0.2rem;
	padding-right:0.6rem;
	padding-left:0.6rem;
	padding-bottom:25rem;
	text-align: center;
	max-width: 96rem;
	border-bottom: #D31359 solid 1.437rem;
}

.intro-container-toeflprep {
	position:relative;
	margin:0;
	align-items:start;
	background-image: url(../images/adult_hanmi_student01.png);
	background-repeat: no-repeat;
	background-position: left; 
	background-size: cover;
	padding-top:0.2rem;
	padding-right:0.6rem;
	padding-left:0.6rem;
	padding-bottom:2rem;
	text-align: center;
	width: 100%;
	border-bottom: #D31359 solid 1.437rem;
}



.intro-container-adult-speaking {
	position:relative;
	margin:0;
	align-items:start;
	background-image: url(../images/adult_hanmi_student01.png);
	background-repeat: no-repeat;
	background-position: left; 
	background-size: cover;
	padding-top:0.2rem;
	padding-right:0.6rem;
	padding-left:0.6rem;
	padding-bottom:2rem;
	text-align: center;
	width: 100%;
	border-bottom: #D31359 solid 1.437rem;
}


.intro-container-inter-ele {
	position:relative;
	margin:0;
	align-items:start;
	background-image: url(../images/inter_el_web01.png);
	background-repeat: no-repeat;
	background-position: left; 
	background-size: cover;
	padding-top:0.2rem;
	padding-right:0.6rem;
	padding-left:0.6rem;
	padding-bottom:2rem;
	text-align: center;
	width: 100%;
	border-bottom: #D31359 solid 1.437rem;
}

.intro-container-inter-midle {
	position:relative;
	margin:0;
	align-items:start;
	background-image: url(../images/inter_midle_web01.png);
	background-repeat: no-repeat;
	background-position: left; 
	background-size: cover;
	padding-top:0.2rem;
	padding-right:0.6rem;
	padding-left:0.6rem;
	padding-bottom:2rem;
	text-align: center;
	width: 100%;
	border-bottom: #D31359 solid 1.437rem;
}

.intro-container-inter-high {
	position:relative;
	margin:0;
	align-items:start;
	background-image: url(../images/inter_high01.png);
	background-repeat: no-repeat;
	background-position: left; 
	background-size: cover;
	padding-top:0.2rem;
	padding-right:0.6rem;
	padding-left:0.6rem;
	padding-bottom:2rem;
	text-align: center;
	width: 100%;
	border-bottom: #D31359 solid 1.437rem;
}

.intro-container-adult-bz {
	position:relative;
	margin:0;
	align-items:start;
	background-image: url(../images/adult_bz.png);
	background-repeat: no-repeat;
	background-position: left; 
	background-size: cover;
	padding-top:0.2rem;
	padding-right:0.6rem;
	padding-left:0.6rem;
	padding-bottom:2rem;
	text-align: center;
	width: 100%;
	border-bottom: #D31359 solid 1.437rem;
}

.intro-container-kinder-prep {
	position:relative;
	margin:0;
	align-items:start;
	background-image: url(../images/kinder_prep_web01.png);
	background-repeat: no-repeat;
	background-position: left; 
	background-size: cover;
	padding-top:0.6rem;
	padding-right:0.6rem;
	padding-left:0.6rem;
	padding-bottom:2rem;
	text-align: center;
	width: 100%;
	min-height: 50rem ;
	border-bottom: #D31359 solid 1.437rem;
}

.intro-container-kinder-kinder {
	position:relative;
	margin:0;
	align-items:start;
	background-image: url(../images/kinder_kiner_web01.png);
	background-repeat: no-repeat;
	background-position: left; 
	background-size: cover;
	padding-top:0.2rem;
	padding-right:0.6rem;
	padding-left:0.6rem;
	padding-bottom:2rem;
	text-align: center;
	width: 100%;
	border-bottom: #D31359 solid 1.437rem;
}


.container {
	position:relative;
	max-width: 80rem;
	margin:0 auto;
	padding: 1.25rem;
}


.container-center {
	position:relative;
	width: 100%;
	margin:0 auto;
	padding: 1.25rem;
	text-align: center;
}

.container-center h1 {
	text-align: center;
}


.intro-container-textbox {
	width: 38rem;
	height: 23.68rem;
	flex-shrink: 0;
	text-align: left;
	margin-top: 10.25rem;
	margin-right:49.5rem;
	margin-left: 7.12rem;
	margin-bottom: 4.25rem;
}

.introduction {
	margin:0 5.58rem;
	padding-top: 5.58rem;
	/* padding-left:5.6rem; */
	padding-bottom:4.8rem;
	position:relative;
}

.introduction-title {
	margin:0 auto;
	padding:0;
}
.introduction-contents {
	display:inline-block;
	column-count: 2;
	column-gap: 6rem;
	padding-top: 4rem;
	
}
.container-speaking {
	display:inline-block;
	column-count: 3;
	column-gap: 2.8rem;
	padding-top: 4rem;
	
}

.container_whitetext {
	text-align: left;
	font-size: 1.8rem;
	font-weight: 300;
	line-height: 2.8rem;
	color: #fff;
	padding: 3rem 2.2rem;
}


.container-rectangular {
	background: #fff;
	display:flex;
	max-width: 100%;
	overflow: hidden;
	width: 68.625rem;
	background-color: #fff;
	box-shadow: 0px 8px 24px 0px rgba(0, 0, 0, 0.07);	
	border-radius: 0.94rem;
	margin-bottom: 2rem;

}

.frame {
	width: 25rem;
	height: 28rem;
	overflow: hidden;
	border-radius: 0.94rem;
}
.frame img {
	width:100%;
	height:auto;
	display: block;
	padding-top: 1.2rem;
	padding-bottom: 0;
	align-items: start;
}

.achieve_container {
	
	padding-top: 5.58rem;
	/* padding-left:5.6rem; */
	padding-bottom:4.8rem;
	position:relative;
	margin-left: 5.6rem;
}
.achieve-title {
	margin:0 auto;
	padding:0;
}
.acheive img {
	padding: 2.5rem 0;
	margin-top: 2.5rem;
	margin-bottom: 2rem;
	
}

.wrapper900 {
	margin: 0 auto;
	width: 90%;
	margin-top: 2.6rem;
	margin-bottom: 2rem;
	text-align: center;
}
.wrapper20 {
	padding: 2.5rem;
	position: relative;
	width:25rem;
	
}

.wrapper20-text {
	position: relative;
	width: 100%;
	padding:2.6rem;
	text-align: left;	
}

.wrapper20-text ul li {
	color: rgba(0, 0, 0, 0.80);
	font-size: 1.75rem;
	font-style: normal;
	font-weight: 500;
	line-height: 2.5rem; /* 142.857% */
	margin-top: 0;
}

.wrapper60 {
	padding: 2.5rem;
	position: relative;
	width:50rem;
	
}

.wrapper500 {
	margin: 0 auto;
	width: 50%;
	align-content: center;
	text-align: center;
}

.wrapper700 {
	margin: 0 auto;
	width: 70%;
	align-content: center;
	text-align: center;
}

.wrapper_pink_bg{
	border-radius: 0.94rem;
	background: linear-gradient(180deg, #FFFBF8 0%, #FFFBFA 37.50%, #FFF3F0 100%);
	box-shadow: 0px 8px 24px 0px rgba(0, 0, 0, 0.07);
	column-count: 2;
	column-gap: 6rem;
	padding: 4rem;
}

.wrapper_rectangle {
	height: auto;
	vertical-align: top;
	position:relative;
}

.wrapper-625 {
	margin:0 6.25rem;
}

.curriculum_container {
	position:relative;
	margin:0 auto;
	background: #F8FBFE;
 	padding-top:6rem;
	padding-left:5.6rem;
padding-bottom:9rem;
}

/* 스피킹 칼라박스 */
.container-speaking {
	position: relative;
	padding-top: 3rem;
}

/* 짧은 카드 아이템 */
.card-main-contatiner {
	position:relative;
	margin:0;
	padding-top:5.2rem;
	padding-right:5.6rem;
	padding-left:5.6rem;
	padding-bottom:6.8rem;
	background: #FEFDF7;
	display: flex;
	min-height: 56rem;

}
.card-main-container .card-container {
	position: relative;
}


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

.card-container .card-16 {
	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: 10rem;
	margin-top: 2.4rem;
	position:relative;
}


.card-container .card {
	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,
.card-content-12 {
	padding:2.19rem;
	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,
.card-content-6 {
	padding:2.19rem;
	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,
.card-content-16 {
	padding:2.19rem;
	flex-direction:column;
	align-items:baseline;
	background-color: #fff;
	height: 12rem;
	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 {
	position: relative;
	width: 32em;
	height: 16rem;
	flex-shrink: 0;
	padding:0;

	
}

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


/* 긴내용 카드 아이템  끝 */



.leveltest-container{
	text-align: center;
	position:relative;
	margin-left: 5.6rem;
	
}


/* 위에 캡션있는 카드*/

/* 짧은 카드 아이템 */
.card-main-contatiner-up {
	position:relative;
	margin:0;
	padding-top:5.2rem;
	padding-right:5.6rem;
	padding-left:5.6rem;
	padding-bottom:6.8rem;
	background: #FEFDF7;
	text-align: center;


}
.card-main-container-up .card-container {
	position: relative;
}


.card-main-wrapper-up {
	position:relative;
	margin-bottom: 2.6rem;
	border:2px #814CF1;
}
.card-container-body-up {
	min-height: 80vh;
	display: flex;
	align-items: center;
	justify-content: center;
	background-color: #fff;
	position:relative;
	
}
 
.card-container-up {
	margin-bottom: 1rem;
	min-height: 22rem;
	display: flex;
	position:relative;
	
	
}

.card-container-up .card-16-up {
	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: 10rem;
	margin-top: 2.4rem;
	position:relative;
	
}


.card-container-up .card-up {
	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-up,
.card-content-12-up {
	padding:3rem;
	flex-direction:column;
	align-items:baseline;
	background-color: #fff;
	height: 12rem;
	border-radius: 0.94rem;
	overflow: hidden;
	flex-wrap: wrap;
	margin-bottom: 1.6rem;	
	text-align: left;
}

.image-content-up,
.card-content-6-up {
	padding:2.19rem;
	flex-direction:column;
	align-items:baseline;
	background-color: #fff;
	height: 6rem;
	border-radius: 0.94rem;
	overflow: hidden;
	flex-wrap: wrap;
	margin-bottom: 1.6rem;	
}

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

.card-image-up {
	position: relative;
	width: 32em;
	height: 16rem;
	flex-shrink: 0;
	padding:0;
	box-shadow: 0px 8px 24px 0px rgba(0, 0, 0, 0.07);	
	

	
}

.card-image-up .card-img-up {
	height: 100%;
	width: 100%;
	object-fit: cover;
	border-bottom-left-radius: 0.94rem;
	border-bottom-right-radius: 0.94rem;
	box-shadow: 0px 8px 24px 0px rgba(0, 0, 0, 0.07);	
}

/*위에 캡션있는 카드 끝*/






/*   rectangle-white */
.rectangle-main-contatiner {
	position:relative;
	margin:0;
	padding-top: 6.8rem;
	padding-right:5.6rem;
	padding-left:5.6rem;
	padding-bottom:4.8rem;
	background: #FEFDF7;
}
.rectangle-main-wrapper{
	position:relative;
	margin-top: 1.8rem;
	margin-bottom: 2.8rem;
	
}
.rectangle-container-body {
	min-height: 13rem;
	display: flex;
	align-items: center;
	justify-content: center;
	background-color: #fff;
	position:relative;
}
.rectangle {
	background-color: #fff;
	box-shadow: 0px 8px 24px 0px rgba(0, 0, 0, 0.07);	
	border-radius: 0.94rem;
	position:relative;
	max-width: 700px;
	
}



.rectangle-container {
	margin:1.2rem auto;
	min-height: 12rem;
	display: flex;
	position:relative;
	gap:2.8rem ;
	
}

.rectangle-content,
.rectangle-content {
	padding:2.19rem;
	display: inline-block;
	flex-direction:row;
	align-items:baseline;
	background-color: #fff;
	height: 18rem;
	border-radius: 0.94rem;
	overflow: hidden;
	position: relative;
	width: 35.4rem;
	flex-wrap: wrap;
	text-align: left;
}

.rectangle-image {
	float: left;
	padding:1rem;
	margin-bottom: 3rem;
	margin-right: 2rem;
	
}


.card-image .card-img {
	height: 100%;
	width: 100%;
	object-fit: cover;
	border-top-left-radius: 0.94rem;
	border-top-right-radius: 0.94rem;
}
/*   rectangle-white end */

/*   rectangle-wide */
.recommand-container {
background-color: #FCFBFB;;
background-image: url(images/bg_cross.png);
background-repeat: repeat;

}
.rectangle-wide {
	border-radius: 0.9375rem;
	background: #FFF;
	box-shadow: 0px 8px 24px 0px rgba(0, 0, 0, 0.07);
	position: relative;
	width: 36rem;
	height: 16.8rem;
	padding:1rem;
	margin-right:1.8rem ;
}
.rectangle-wide-wrap {
	display: flex;
}
.rectangle-wide .rectangle_content {
	text-align: left;
	padding-left: 2.4rem ;
	padding-top: 1.6rem;
	width: 15rem;
	padding-bottom: 1.6rem;
	padding-right: 1.6rem;
	margin-right: 0.4rem;
	margin-bottom: 0.4rem;
}


.rectangle-wide .rectangle-wide-image {
	width: 21rem;
	height: 15rem;
	flex-shrink: 0;
	text-align: right;

}

.rectangle-wide-image img {
	width:100%;
	height: 100%;
	border-radius: 0.625rem;
}


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


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





.container-center {
	position:relative;
	display: block;
	text-align: center;
	margin:0;
}

/*   rectangle-wide end*/

/*   luxury backgroud */

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

}

.luxury-container-center-black {
	position:relative;
	display: block;
	background: linear-gradient(180deg, #1F1D1D 0%, #151313 100%);
	text-align: center;
	margin:0;
	border-top: solid  #D31359 1.5rem;

}

.luxury-container-textbox  {
	display: inline-flex;
	padding-top: 5.19rem;
	margin-left: 1.26rem;
	margin-right: 6.26rem ;
	padding-bottom: 4.25rem;
	justify-content: center;
	align-items: flex-start;
	gap: 2.75rem;
	position: relative;
}


/*   luxury backgroud end*/


.clear {
	clear: both;
}
/*   speaking level backgroud*/

.speaking-level-container-beginner {
	background: linear-gradient(180deg, #EEFEEE 0%, #EDFFED 100%);
	position:relative;
	display: block;
	border-top: solid  #525252 0.4rem;
	padding: 4rem 0 4rem 0;
}

.speaking-level-container-inter {
	background: linear-gradient(180deg, #E3F9F9 0%, #D4F5F5 100%);
	position:relative;
	display: block;
	border-top: solid  #525252 0.4rem;
	padding: 4rem 0 4rem 0;
}

.speaking-level-container-highinter {
	background: linear-gradient(180deg, #FDF9E4 0%, #FFF4CC 100%);
	position:relative;
	display: block;
	border-top: solid  #525252 0.4rem;
	padding: 4rem 0 4rem 0;
}

.speaking-level-container-advanced {
	background: linear-gradient(180deg, #FAF3FF 0%, #F6EBFF 100%);
	position:relative;
	display: block;
	border-top: solid  #525252 0.4rem;
	padding: 4rem 0 4rem 0;
}

.beginner-hr {
	width: 70.1875rem;
	height: 0.3125rem;
	border:0;
	border-top: 5px dotted #7BB47B;
	margin: 3.12rem auto;
}

.inter-hr {
	width: 70.1875rem;
	height: 0.3125rem;
	border:0;
	border-top: 5px dotted #209999;
	margin: 3.12rem auto;
}

.highinter-hr {
	width: 70.1875rem;
	height: 0.3125rem;
	border:0;
	border-top: 5px dotted #FEB784;
	margin: 3.12rem auto;
}

.advanced-hr {
	width: 70.1875rem;
	height: 0.3125rem;
	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: 3.12rem auto;
}
/*   speaking level backgroud end*/





/*   table schedule */


.hm-schedule-table {
	margin: 5rem 0;
	background-color:rgba(250, 250, 250, 0.898);
	width:100%;	
	font-size: 1.6rem;
}

.container-class-2days {
    font-size: 36px;
    width: 70rem;
    margin: 3rem auto;
	text-align: center;
  
}

.container-class-3days {
    font-size: 2.6rem;
    width: 70rem;
    margin: 3rem auto;
  
}




.time {
    width: 15%;
    align-items: center;
    text-align: center;
    padding: 1rem;
    border-left: 0px;
    border-bottom: 0px;
   color: #fff;
  
}

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

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

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

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

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

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

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


.date-3days {
    width: 25%;
    padding: 2rem;
}

.cell-td {
	padding: 1rem;
	border-bottom: 1px #ddd solid; 
	text-align:center;
}

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


th{
    border-top: 1.5px solid #666;
    border-bottom: 0.8px solid #666;
    border-left: 0.8px solid #666; ;
}

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

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

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

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

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

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

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

  .sugang-info-table {
	margin: 2.6rem 5rem;
	width: 80%; 
	text-align: center;
	background-color:#ffffff53;
	padding: 10px;
	position:relative;
}

.sugang-info-table tr{
	border-top: #fff solid 3px;
}

.sugang-info-table td {
text-align: left;
padding: 14px 20px;
border: 0px;
font-size: 1.6rem;
font-weight: 500;
}

.button-sugang {
	border-radius: 2.6875rem;
	background: #43A2AD;
	color: #FFF;
	font-family: Pretendard;
	font-size: 1.6rem;
	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: 1.6rem;
	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;
}