@import url('default.css');
@font-face {
    font-family: 'Gmarket Sans';
	font-style: normal;
	font-weight: 300;
    src: local('Gmarket Sans Light'), local('GmarketSans-Light'),
    url('/images/course/fonts/GmarketSansLight.woff2') format('woff2'),
    url('/images/course/fonts/GmarketSansLight.woff') format('woff'); 
}
@font-face {
    font-family: 'Gmarket Sans';
	font-style: normal;
	font-weight: 500;
    src: local('Gmarket Sans Medium'), local('GmarketSans-Medium'),
    url('/images/course/fonts/GmarketSansMedium.woff2') format('woff2'),
    url('/images/course/fonts/GmarketSansMedium.woff') format('woff'); 
}
@font-face {
    font-family: 'Gmarket Sans';
	font-style: normal;
	font-weight: 700;
    src: local('Gmarket Sans Bold'), local('GmarketSans-Bold'),
    url('/images/course/fonts/GmarketSansBold.woff2') format('woff2'),
    url('/images/course/fonts/GmarketSansBold.woff') format('woff'); 
}

html, body, xmp, pre {
    color: #3d3d3d;
    line-height: 1.5;
    font-family: 'Gmarket Sans', 'Pretendard', 'Noto Sans KR', 'NanumGothic', 'Malgun Gothic', 'Apple SD Gothic', 'Apple SD Gothic Neo', 'Dotum', sans-serif;
    font-size: 15px;
    font-weight: 500;
    /* letter-spacing: -0.05em; */
    word-break: keep-all;
	word-wrap: break-word;
}

#wrap { min-width:1200px; position:relative; }
.wrapper { width:1240px; padding:0 20px; margin:0 auto; }

@media screen and (max-width:640px){
	html, body, xmp, pre {
		font-size: 13px;
	}
	#wrap { min-width:100%; }
	.wrapper { width:auto; padding:0; margin:0 20px; }
}

header { position:relative; padding:117px 0 190px 0; background:url(../images/winterevent_2025/header_bg.png) no-repeat center top; color:#016e89; }
header::before { position:absolute; left:calc(50% + 350px); bottom:0; width:383px; height:471px; background:url(../images/winterevent_2025/panda.png) no-repeat center bottom / contain; content:"" }
header::after { position:absolute; left:calc(50% - 475px); bottom:-27px; width:217px; height:236px; background:url(../images/winterevent_2025/mark.png) no-repeat center bottom / contain; content:"" }
header .sub_tit { text-align:center; }
header .sub_tit strong { display:inline-block; padding:15px 50px 10px 50px; border:1px solid #016e89; border-radius:40px; font-size:35px; }
header h1 { text-align:center; margin:27px 0 0 0;}
header ul { position:relative; padding:0 0 0 150px; margin:60px 0 0 155px; font-size:30px; }
header ul li { position:relative; padding:0 0 35px 55px; }
header ul li::before { position:absolute; left:0; top:0; width:38px; height:38px; background:url(../images/winterevent_2025/snow.png) no-repeat left top; content:""; }
header ul li span { display:inline-block; border-bottom:1px solid rgba(1,110,137,0.2); }

@media screen and (max-width:640px){
	header { padding:50px 0 180px 0; text-align:center; background-size:cover; background-position:center bottom -46px; background-color:#9fd4dc; }
	header::before { left:calc(50% - 20px); width:150px; height:190px; }
	header::after { left:auto; right:50%; bottom:0; width:100px; height:110px; }
	header .sub_tit strong { padding:5px 20px 0 20px; font-size:15px; }
	header h1 { margin:15px 0 0 0; }
	header h1 img { width:100%; max-width:350px; }
	header ul { display:inline-block; padding:0; margin:20px 0 0 0; font-size:15px; }
	header ul::before { display:none; }
	header ul li { padding:0 0 15px 25px; text-align:left; }
	header ul li::before { background-size:20px auto; }
}

.container h2 { margin:70px 0 50px 0; }
.container h2 span { display:inline-block; position:relative;  }
.container h2 span::after { position:absolute; left:5px; top:5px; width:100%; height:100%; background:#016e89; content:""; }
.container h2 span strong { display:inline-block; position:relative; z-index:10; padding:10px 25px 3px 25px; color:#016e89; font-size:45px; font-weight:700; border:3px solid #016e89; background:#fff; content:""; }
.container .class2 h2 span::after { background:#104ab6 }
.container .class2 h2 span strong { color:#104ab6; border:3px solid #104ab6; }
.container .table_wrap { margin:0 0 70px 0; }
.container .table_wrap table { width:100%; }
.container .table_wrap table th, .container .table_wrap table td { border-style:solid; border-width:1px; border-color:#016e89; padding:10px 5px 5px 5px; text-align:center; }
.container .class2 .table_wrap table th, .container .class2 .table_wrap table td { border-color:#104ab6; }
.container .table_wrap table th:first-child, .container .table_wrap table td:first-child { border-left-width:0; }
.container .table_wrap table th:last-child, .container .table_wrap table td:last-child { border-right-width:0; }
.container .table_wrap table thead th { font-size:20px; font-weight:700; }
.class2 .list_wrap { display:none; }
.class1 .table_wrap table td {  }
.class1 .table_wrap table th, .class2 .table_wrap table th { background-color:rgba(1,110,137,0.1); color:#016e89; font-weight:700; }
.class2 .table_wrap table th { background-color:rgba(16,74,182,0.1); color:#104ab6; }
.class1 { border:1px solid #fff; }
@media screen and (max-width:640px){
	.container h2 { margin:30px 0 15px 0; }
	.container h2 span::after { left:3px; top:3px; }
	.container h2 span strong { padding:5px 15px 0 10px; font-size:20px; }
	
	.container .table_wrap { overflow-x: auto; }
	.container .table_wrap table { min-width:600px; }
	.container .table_wrap table .m_skip { display:none; }
	.container .table_wrap table thead th { font-size:15px; }
	.container .table_wrap table th:first-child, .container .table_wrap table td:first-child { border-left-width:1px; }
	.container .table_wrap table th:last-child, .container .table_wrap table td:last-child { border-right-width:1px; }
	.class1 .table_wrap table td { font-weight:400; }
	.class2 .table_wrap { display:none; }
	.class2 .list_wrap { display:block; }
	.class2 .list_wrap ul li { display:flex; padding:7px 0; border-bottom:1px solid rgba(1,110,137,0.1); }
	.class2 .list_wrap ul li strong { width:120px; color:#104ab6; font-weight:700; }
	.class2 .list_wrap ul li span, .container .list_wrap ul li ul { width:calc(100% - 80px); }
	.class2 .list_wrap ul li ul li + li { border-top:1px solid #104ab6; }
	.class2 h3 { margin:20px 0 0 0; padding:15px 0 10px 10px; color:#104ab6; font-size:17px; font-weight:700; border-bottom:1px solid #104ab6; background-color:rgba(16,74,182,0.1) }
}

footer { margin-top:150px; background:#104ab6; color:rgba(255,255,255,0.8); }
footer .wrapper { display:flex; }
footer .f_left { width:60%; border-width:0 1px 0 1px; border-style:solid; border-color:rgba(255,255,255,0.2); padding:70px 0 50px 40px; }
footer .f_left .btn_wrap { display:flex; }
footer .f_left .btn_wrap a { display:block; position:relative; padding:12px 55px 7px 28px; margin-right:10px; background:#fff; border-radius:30px; color:#104ab6; font-size:20px; font-weight:700; }
footer .f_left .btn_wrap a::after { position:absolute; right:25px; top:17px; width:9px; height:14px; background:url(../images/summerevent_2024/more.png) no-repeat center center; content:"" }
footer .f_left .btn_wrap a.yellow { background:#f5f45c; }
footer .f_left .txt { margin:40px 0 0 0; font-size:50px; font-weight:300; line-height:1.2; }
footer .f_left .txt strong { display:inline-block; position:relative; width:70px; color:transparent;}
footer .f_left .txt strong::before { position:absolute; left:0; top:-10px; width:70px; height:68px; background:url(../images/summerevent_2024/ddak.png) no-repeat center center; content:"" }
footer .f_right { position:relative; width:40%; border-width:0 1px 0 0; border-style:solid; border-color:rgba(255,255,255,0.2); text-align:right; padding:0 40px 50px 0; }
footer .f_right .mark { margin-top:-63px; }
footer .f_right .tel { margin:28px 0; }
footer .f_right .tel strong { display:block; color:#fff; font-size:40px; font-weight:700; line-height:1.2; }
footer .f_right .logo { margin:28px 0; }
@media screen and (max-width:640px){
	footer { margin-top:50px; }
	footer .wrapper { display:block; }
	footer .f_left { width:auto; border-width:0; padding:30px 0 20px 0; }
	footer .f_left .btn_wrap { display:block; }
	footer .f_left .btn_wrap a { margin-bottom:5px; }
	footer .f_left .txt { font-size:30px; }
	footer .f_left .txt strong { width:40px; }
	footer .f_left .txt strong::before { top:-5px; width:40px; height:40px; background-size:40px auto; }
	footer .f_right { width:auto; border-width:1px 0 0 0; text-align:center; padding:20px 0 20px 0; }
	footer .f_right .mark { margin-top:0 }
	footer .f_right .logo img { width:120px; }
}