@charset "utf-8";
 *{
	 margin:0px;
	 padding:0px;
	 box-sizing:border-box
 }
 
 a
 {
	 color:inherit;
	 text-decoration:none;
 }
  
 	html{scroll-behavior:smooth}
	body{
		margin:0;
		background:#11131a;
		color:#252733;
		font-family:"Noto Sans KR","Malgun Gothic",Arial,sans-serif;
	}
	a
	{
		color:inherit;
		text-decoration:none
	}
	
	p
	{
		padding:10px 0px;
	}
	.manual{
position: relative;
        margin: 0 auto;
        background: #f5f2ea;
	}
	.hero{
padding: 80px 30px 70px;
        background: linear-gradient(135deg, #171b2c, #29233b);
        color: #fff;
        text-align: center;
        word-break: keep-all;
        line-height: 2;
	}
	.hero .eyebrow{
		letter-spacing:.18em;
		font-size:13px;
		opacity:.72;
		margin-bottom:18px;
	}
	.hero h1{
		margin:0;
		font-size:clamp(34px,6vw,64px);
		line-height:1.2;
		font-weight:800;
	}
	.hero p{
		max-width:720px;
		margin:24px auto 0;
		color:#d8d9e4;
		font-size:16px;
	}
	.toc{
position: sticky;
        top: 0;
        z-index: 20;
        background: rgba(245, 242, 234, .96);
        border-bottom: 1px solid #ddd8ca;
        padding: 5px 5px;
	}
	.quick_btn
	{
		display: flex;
		gap: 8px;
		position: relative;
		scrollbar-width: none;
		flex-wrap: wrap;
	}
	.quick_btn::-webkit-scrollbar{display:none}
	.toc a{
		flex:0 0 auto;
		padding:8px 13px;
		border:1px solid #d5d0c2;
		border-radius:999px;
		font-size:13px;
		color:#4d5060;
		background:#fffdf8;
	}
	.toc a:hover{background:#e9e3d5}
	.content
	{
padding: 55px 15px 90px;
        position: relative;
	}
	.section
	{
	position:relative;
	padding: 200px 0px 5px 0;
    border-bottom: 1px solid #ddd8ca;
	}
	.section:first-child{padding-top:250px}
	.section:last-child{border-bottom:0}
	.section_numbering{
		font-size:12px;
		letter-spacing:.16em;
		color:#746a57;
		font-weight:700;
	}
	h2
	{
		padding:8px 0 24px;
		font-size:2.1rem;
		line-height:1.3;
	}
	h3
	{
		padding: 30px 0 15px;
		font-size: 1.7rem;
	}

	h4
	{
		padding: 20px 0 10px;
		font-size: 1.18rem;
	}	
	.lead{
		font-size:18px;
		color:#555866;
	}
	.overview_card_box
	{
        display: flex;
        position: relative;
        padding: 20px 0px;
        flex-direction: column;
        justify-content: flex-start;
	}

	.card_box_three
	{
        background: #fffdf8;
        border: 1px solid #ddd8ca;
        border-radius: 16px;
        padding: 10px;
        position: relative;
	}
	
	.card_box_two
	{
	background: #fffdf8;
    border: 1px solid #ddd8ca;
    border-radius: 16px;
    padding: 10px;
	position:relative;
	}	
	
	.card_box_oneline
	{
	background: #fffdf8;
    border: 1px solid #ddd8ca;
    border-radius: 16px;
    padding: 24px;
    width: 100%;
	position:relative;
	}	
	
	.card_box_title
	{
    background: #272b3b;
    color: #fff;
    padding: 15px 30px;
    border-radius: 12px;
    font-weight: 700;
    display: block;
    text-align: center;
	}
	
	.card_box_curri_set
	{
    position: relative;
    padding: 10px 0px;
    height: 100px;
    border: 1px solid;
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    flex-direction: column;
	}
	
	.card_box_curri_set span
	{
	color:red;
	}
	
	.card_box_magicschool
	{
    position: relative;
    padding: 10px 5px;
    border: 1px dashed;
    height: 250px;
	}
	
	.card_box_magicshop
	{
    position: relative;
    padding: 10px 5px;
    border: 1px dashed;
    height: 220px;
	}	
	
	.card_box_sclactivity
	{
    position: relative;
    padding: 10px 5px;
    border: 1px dashed;
    height: 250px;
	}		
	
	.card_box_three strong, .card_box_two strong, .card_box_oneline strong
	{
	display:block;
	font-size:18px;
	margin-bottom:8px
	}
	
	.card_box_curriculum img
	{
		width:100%;
	}
	
	

	.each_notice_area
	{
		position:relative;
		padding:20px;
		border-left:4px solid #6f5b3e;
		background:#ebe5d8;
		line-height:2;
	}
	
	.each_notice_detailbox
	{
	    position: relative;
    padding: 20px 22px;
    list-style-type: none;
    background: #ebe5d8;
	}
	
	.card_flow_planner
	{
    position: relative;
    padding: 20px;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    gap: 10px;
    background-color: #ebe5d8;
    border-left: 4px solid #6f5b3e;
	}
	
	
	.owl_explain_box
	{
		position:relative;
		padding:20px;
		border-left:4px solid #6f5b3e;
		background:#ebe5d8;
	}
	
	.rule_view
	{
        position: relative;
        text-align: center;
        padding: 25px 10px;
        background: #252938;
        color: #fff;
        border-radius: 16px;
        word-break: keep-all;
        line-height: 2;
        font-size: 1.2rem;
	}
	
	.rule_view img
	{
		max-width:100%;
	}
	
	
	.rule_view .formula{
		margin-top:14px;
		padding:16px;
		background:#171a24;
		border-radius:10px;
		font-family:Georgia,serif;
		font-size:18px;
	}
	ul,ol{padding-left:24px}
	table{
		width:100%;
		border-collapse:collapse;
		margin:25px 0;
		background:#fffdf8;
	}
	th,td{
		border:1px solid #d9d3c5;
		padding:13px 15px;
		text-align:left;
		vertical-align:top;
	}
	th{background:#e9e3d5}
	.footer{
		padding:50px 30px;
		text-align:center;
		background:#171b2c;
		color:#cfd1dc;
	}