@import url('https://cdn.jsdelivr.net/gh/fonts-archive/Paperlogy/Paperlogy.css');
@import url(//spoqa.github.io/spoqa-han-sans/css/SpoqaHanSansNeo.css);
@import url('https://fonts.googleapis.com/css2?family=Noto+Serif:ital,wght@0,100..900;1,100..900&display=swap');

*, html {box-sizing: border-box; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; } 
*, *:before, *:after {box-sizing: border-box;-webkit-box-sizing: border-box; -moz-box-sizing: border-box;}

html, body, div, p, span, strong, b, em, iframe, pre, h1, h2, h3, h4, h5, h6, img, dl, dt, dd, fieldset, form, legend, label, table, caption, thead, tbody, tfoot, tr, th, td, ul, ol, li, a, input, select, textarea {margin: 0;padding: 0; border:none; }
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; padding:0;margin:0} 
body {font-family: 'Paperlogy','Spoqa Han Sans Neo','sans-serif';word-break:keep-all;font-size:18px; line-height:1.5} 

br{font-family:sans-serif}
ul,li,ol,dl,dd,dt{list-style:none;word-break:keep-all;}
em, address {font-style: normal;}
caption {overflow: hidden;width: 0;height: 0;font-size: 0; line-height: 0;}
table{margin:0px;border-collapse:collapse;border-spacing: 0;}
td,th{-ms-word-break:break-all;word-break:break-all;vertical-align: middle;}

img{border:0;line-height:0;max-width:100%}

a:link, a:visited{text-decoration:none;color:inherit}
a:active, a:hover{color:inherit;text-decoration:none;}
a img{border:none;}
strong{font-weight:600}

form{margin:0; padding:0}
input, textarea {border:1px solid #ddd;background:#fff;padding:1px;font-family: 'Spoqa Han Sans Neo', 'sans-serif';word-break:keep-all;}
input[type=button] {cursor: pointer;}
input:focus{outline:none;}

.overflow{overflow:hidden}
select { -moz-appearance:none; -webkit-appearance:none;appearance:none;}

/* 정렬 */
.float_l{float:left;}
.float_r{float:right;}
.clear{clear:both}

.align_l{text-align:left !important}
.align_c{text-align:center}
.align_r{text-align:right}

.txt-blue{color:#1562D4}
.txt-green{color:#11AD31}
.txt-red{color:#DE0B0E}

.mt-0{margin-top:0 !important}
.colo-o{color:#F14C22}
.colo-g{color:#00A750}
.colo-b{color:#0066B3}
.bgcolor-o{background:#F14C22}
.bgcolor-g{background:#00A750}
.bgcolor-b{background:#0066B3}
.bgcolor-gray{background:#B5BCC6}

:root {
  --primary: #38538C;
  --blue : #5a71ca;
  --gray : #6A6969;
  

  --radius : 50px;
  --radius-m : 20px;
  --radius-s : 10px;
  --round : 100%;

  --tit-xxl : 75px;
  --tit-xl : 60px;
  --tit-l : 40px;
  --tit-m : 35px;
  --tit-s : 24px;

  --txt-xxl : 35px;
  --txt-xl : 30px;
  --txt-l : 26px;
  --txt-m : 20px;
  --txt-s : 18px;
  --txt-xs : 16px;

  --con-w : 1700px;

  --con-space-l : 100px;
  --con-space-m : 80px;
  --con-space-s : 50px;
  --con-space-xs : 30px;  
 
}

.mt-l{margin-top:var(--con-space-m)}

.reveal{opacity:0;}
.reveal.scrolled{opacity:1;}
.fade-up.scrolled {animation:fade-up .8s ease-in-out both}
.fade-r.scrolled {animation:fade-r .8s ease-in-out both}
.fade-l.scrolled {animation:fade-l .8s ease-in-out both}

.delay2{animation-delay:.2s !important}
.delay4{animation-delay:.4s !important}


@keyframes fade-up{
    0%{opacity: 0; transform: translateY(50px);}
    100%{ opacity: 1; transform: translateY(0);}
}
@-webkit-keyframes fade-up{
    0%{opacity: 0; transform: translateY(50px);}
    100%{ opacity: 1; transform: translateY(0);}
}
@-moz-keyframes fade-up{
    0%{opacity: 0; transform: translateY(50px);}
    100%{ opacity: 1; transform: translateY(0);}
}
@-ms-keyframes fade-up{
    0%{opacity: 0; transform: translateY(50px);}
    100%{ opacity: 1; transform: translateY(0);}
}
@-o-keyframes fade-up{
    0%{opacity: 0; transform: translateY(50px);}
    100%{ opacity: 1; transform: translateY(0);}
}


@keyframes zoom-in{
    0%{opacity: 0; transform: scale(1.2);}
    100%{ opacity: 1; transform: scale(1);}
}
@-webkit-keyframes zoom-in{
     0%{opacity: 0; transform: scale(1.2);}
    100%{ opacity: 1; transform: scale(1);}
}
@-moz-keyframes zoom-in{
    0%{opacity: 0; transform: scale(1.2);}
    100%{ opacity: 1; transform: scale(1);}
}
@-ms-keyframes zoom-in{
    0%{opacity: 0; transform: scale(1.2);}
    100%{ opacity: 1; transform: scale(1);}
}
@-o-keyframes zoom-in{
    0%{opacity: 0; transform: scale(1.2);}
    100%{ opacity: 1; transform: scale(1);}
}


@keyframes fade-l{
    0%{opacity: 0; transform: translateX(-50px);}
    100%{ opacity: 1; transform: translateX(0);}
}
@-webkit-keyframes fade-l{
    0%{opacity: 0; transform: translateX(-50px);}
    100%{ opacity: 1; transform: translateX(0);}
}
@-moz-keyframes fade-l{
    0%{opacity: 0; transform: translateX(-50px);}
    100%{ opacity: 1; transform: translateX(0);}
}
@-ms-keyframes fade-l{
    0%{opacity: 0; transform: translateX(-50px);}
    100%{ opacity: 1; transform: translateX(0);}
}
@-o-keyframes fade-l{
    0%{opacity: 0; transform: translateX(-50px);}
    100%{ opacity: 1; transform: translateX(0);}
}


@keyframes fade-r{
    0%{opacity: 0; transform: translateX(50px);}
    100%{ opacity: 1; transform: translateX(0);}
}
@-webkit-keyframes fade-r{
    0%{opacity: 0; transform: translateX(50px);}
    100%{ opacity: 1; transform: translateX(0);}
}
@-moz-keyframes fade-r{
    0%{opacity: 0; transform: translateX(50px);}
    100%{ opacity: 1; transform: translateX(0);}
}
@-ms-keyframes fade-r{
    0%{opacity: 0; transform: translateX(50px);}
    100%{ opacity: 1; transform: translateX(0);}
}
@-o-keyframes fade-r{
    0%{opacity: 0; transform: translateX(50px);}
    100%{ opacity: 1; transform: translateX(0);}
}

.container-w{width:90%; max-width:1700px; margin:0 auto;}
.flex{display:flex; flex-wrap:wrap}
.jc-sp{justify-content:space-between}

@font-face {
    font-family: 'Yeongwol';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/2507-2@1.0/YeongwolTTF-Regular.woff2') format('woff2');
    font-weight: normal;
    font-display: swap;
}

@media(max-width:1700px){

	:root {

	  --tit-xxl : 55px;
	  --tit-xl : 50px;
	  --tit-l : 30px;
	  --tit-m : 24px;
	  --tit-s : 20px;

	  --txt-xxl : 30px;
	  --txt-xl : 26px;
	  --txt-l : 20px;
	  --txt-m : 18px;
	  --txt-s : 16px;
	  --txt-xs : 14px;

	  --con-space-l : 80px;
	  --con-space-m : 50px;
	  --con-space-s : 30px;
	  --con-space-xs : 20px;  
	 
	}
}


@media(max-width:1024px){

	:root {

	  --tit-xxl : 50px;
	  --tit-xl : 40px;
	  --tit-l : 25px;
	  --tit-m : 20px;
	  --tit-s : 18px;

	  --txt-xxl : 25px;
	  --txt-xl : 20px;
	  --txt-l : 18px;
	  --txt-m : 16px;
	  --txt-s : 14px;
	  --txt-xs : 13px;

	  --con-space-l : 60px;
	  --con-space-m : 40px;
	  --con-space-s : 20px;
	  --con-space-xs : 10px;  
	 
	}
}


@media(max-width:768px){

	:root {

	  --tit-xxl : 40px;
	  --tit-xl : 30px;
	  --tit-l : 22px;
	  --tit-m : 18px;
	  --tit-s : 16px;

	  --txt-xxl : 22px;
	  --txt-xl : 18px;
	  --txt-l : 17px;
	  --txt-m : 15px;
	  --txt-s : 13px;
	  --txt-xs : 12px;

	  --con-space-l : 50px;
	  --con-space-m : 30px;
	  --con-space-s : 15px;
	  --con-space-xs : 10px;  
	 
	}
}