@charset "euc-kr";

/********************************************************************************************************************************
* °øÅë
********************************************************************************************************************************/
.comm-grobal-wrap {clear: both; position: relative; background-color: #fff;}
.comm-frame {
	clear: both;
	position: relative;
	min-width: 1300px;
	padding: 90px 0 110px 0;
/*	border-bottom: 1px solid #eee;	*/
	overflow: hidden;
	}
.comm-frame.bg {background-color: #efeff2;}


/*----- title --------------------------------------------------*/
.comm-frame .title {
	position: relative;
	margin: 0 0 25px 0; padding: 0;
	text-align: center;
	z-index: 1;
	}
.comm-frame .title .icon {
	display: block;
	margin: -35px auto -5px auto;
	width: 43px; height: 43px;
	font-size: 1px; color: transparent; line-height: 1px;
	background: url('../../images/tit_ic3.png') no-repeat 0 0;
	}
.comm-frame .title.white .icon	{background-image: url('../../images/tit_ic3.png');}

.comm-frame .title h3 {
	display: inline-block;
	position: relative;
	margin: 0 0 5px 0;
	/* font-family: 'Noto Sans KR', 'Noto Sans', '¸¼Àº °íµñ', 'Malgun Gothic'; */
	font-family: 'Gmarket Sans';
	font-size: 46px; color: #111; letter-spacing: -2.5px; line-height: 130%;
	}
.comm-frame .title.white h3, .comm-frame .title.white2 h3 {color: #fff;}
.comm-frame .title h3.big {font-size: 3.2em;}
.comm-frame .title strong {display: inline-block; margin: 0 0 0 2px; font-weight: 700;}
.comm-frame .title h3 .big {
	display: inline-block;
	margin: 0 0 0 0;
	font-size: 130%;
	}
.comm-frame .title h3 .dot {display: inline-block; margin: 0 0 4px 4px; font-size: 150%; color: #FD7652; vertical-align: text-bottom;}
.comm-frame .title.white2 h3 .dot {color: #FD7652;}
.comm-frame .title h3 .eng {display: inline-block; margin: 0 0 2px 0; font-size: 120%; letter-spacing: -3px; vertical-align: text-bottom;}

.comm-frame .title.sign h3::before {
	content: "[";
	position: absolute; top: 2px; left: -30px;
	font-size: 130%; color: #e94e1b; font-weight: 700;
	}
.comm-frame .title.sign h3::after {
	content: "]";
	position: absolute; top: 2px; right: -30px;
	font-size: 130%; color: #e94e1b; font-weight: 700;
	}

.comm-frame .title h4 {
	display: block;
	margin: 0 0 0 0; padding: 0 0 10px 0;
	font-family: 'Noto Sans KR', 'Noto Sans', '¸¼Àº °íµñ', 'Malgun Gothic' sans-serif;
	font-size: 16px; color: #888; letter-spacing: 0px; line-height: 140%; font-weight: 100;
	}
.comm-frame .title.white h4 {color: rgba(255,255,255, 0.7);}

/*----- sub title -----*/
.comm-frame .sub-title {
	clear: both;
	position: relative;
	margin: 0 0 14px 0;
	font-family: 'Noto Sans KR', 'Noto Sans', '¸¼Àº °íµñ', 'Malgun Gothic';
	font-size: 28px; color: #333; letter-spacing: -0.5px; line-height: 120%; font-weight: 700;
	overflow: hidden;
	}
.comm-frame .sub-title .more {
	clear: both;
	display: inline-block;
	position: absolute; bottom: -1px; right: 5px;
	height: 20px;
	font-size: 14px; color: #888; letter-spacing: -0.5px; line-height: 20px; font-weight: 300; text-decoration: none;
	}
.comm-frame .sub-title .more i {margin: 0 5px 2px 0; font-size: 14px; color: #999; vertical-align: bottom; transition: all 0.3s;}
.comm-frame .sub-title .more:hover i {color: #ff643c;}





/********************************************************************************************************************************
* Top banner
********************************************************************************************************************************/
.nonprofit-main-banner {
	clear: both;
	position: relative; top: 0; bottom: 0; left: 0; right: 0;
	min-width: 1300px !important; max-width: none !important;
	margin: 0; padding: 0;
	z-index: 1;
	overflow: hidden;
	}
.nonprofit-main-banner .gallery-top {height: 650px;}

.nonprofit-main-banner .gallery-top .swiper-slide {
	background-position: 50% bottom;
	background-repeat: no-repeat;
	background-size: cover;
/*	transition: filter 1s;	*/
	animation: slide-ani 20s infinite;
	}
.nonprofit-main-banner .gallery-top .swiper-slide::after {
	content: "";
	display: block;
	position: absolute; top: 0; bottom: 0; left: 0; right: 0;
	background: rgba(0,0,0, 0.6) url('../../images/main_visual_dot2.png') repeat;
	z-index: 2;
	}

@keyframes slide-ani {
    0%		{background-size: 100% auto;}
    50%		{background-size: 110% auto;}
    100%	{background-size: 100% auto;}
	}

.nonprofit-main-banner .gallery-top .swiper-slide img {
	display: block;
	min-width: 100%; min-height: 100%;
	width: auto; height: auto;
	}

.nonprofit-main-banner .gallery-top .swiper-pagination {padding-bottom: 0px;}
.nonprofit-main-banner .gallery-top .swiper-pagination .swiper-pagination-bullet {background-color: rgba(255,255,255, 0.7);}

.nonprofit-main-banner .swiper-slide-active .animated-item-1 {animation: fadeInLeftShort 0.3s linear 0.3s both;}
.nonprofit-main-banner .swiper-slide-active .animated-item-2 {animation: fadeInRightShort 0.3s linear 0.6s both;}
.nonprofit-main-banner .swiper-slide-active .animated-item-3 {animation: fadeInUpShort 0.3s linear 0.9s both;}
.nonprofit-main-banner .swiper-slide-active .animated-item-4 {animation: fadeInUpShort 0.3s linear 1.2s both;}

.nonprofit-main-banner .swiper-pagination-bullet-active {background-color: #ff5529 !important;}

/*----- Header Text & Qucik Button -----*/
.nonprofit-main-banner .Navi {
	position: absolute; top: 160px; left: 50%;
	width: 1200px;
	margin: 0 0 0 -600px;
	text-align: center;
	z-index: 10;
	}

.nonprofit-main-banner .Navi h1 {
	display: block;
	margin: 0 0 30px 0;
	font-family: 'Noto Sans KR', 'Noto Sans', '¸¼Àº °íµñ', 'Malgun Gothic' sans-serif;
	font-size: 70px; color: #fff; letter-spacing: -5px; line-height: 120%; font-weight: 900;
	text-shadow: 0 3px 6px rgba(0,0,0, 0.4);
	visibility: hidden;
	}
.nonprofit-main-banner .Navi h1 .color {color: #b08ef6;}

.nonprofit-main-banner .Navi h2 {
	display: block;
	margin: 0 auto 70px auto;
	font-family: 'Noto Sans KR', 'Noto Sans', '¸¼Àº °íµñ', 'Malgun Gothic' sans-serif;
	font-size: 16px; color: #eee; line-height: 160%; font-weight: 300;
	text-shadow: 0 1px 0 rgba(0,0,0, 0.3);
	visibility: hidden;
	}
.nonprofit-main-banner .Navi h2 strong {display: block; margin: 0 0 10px 0; font-size: 25px; letter-spacing: -0.6px; font-weight: 500;}

.nonprofit-main-banner .Navi ul {display: inline-block;}
.nonprofit-main-banner .Navi li {
	float: left;
	margin: 0 20px 0 0;
	visibility: hidden;
	}
.nonprofit-main-banner .Navi li:last-child {margin-right: 0;}
.nonprofit-main-banner .Navi li a.item {
	display: block;
	position: relative; bottom: 0;
	width: 260px; height: 110px;
	padding: 0 2px 0 0;
	font-family: 'Noto Sans KR', 'Noto Sans', '¸¼Àº °íµñ', 'Malgun Gothic' sans-serif;
	font-size: 23px; color: #fff; letter-spacing: -1px; line-height: 150px; font-weight: 500; text-decoration: none !important; text-align: center;
	border: 1px solid rgba(255,255,255, 0.6);
	border-radius: 15px;
	transform: translate3d(0,0,0);
	box-shadow: 0 0 0 0 rgba(78, 159, 61, 0.4);
    transition: 0.2s all, box-shadow 0.4s ease-in-out;
	}
.nonprofit-main-banner .Navi li a.item::after {
	content: '';
	position: absolute; top: 20px; left: 23px;
	width: 31px; height: 12px;
	background: url('../../images/navi_icon2.png') no-repeat 0 0;
	}

.nonprofit-main-banner .Navi li a.item:hover {
	bottom: -5px;
	line-height: 110px;
	text-shadow: 0 3px 1px rgba(0,0,0, 0.1);
	border-color: transparent;
	background-color: rgba(78, 159, 61, 1);
	box-shadow: 0 0 0 25px transparent;
	}
.nonprofit-main-banner .Navi li a.item:hover::before {border-color: rgba(255,255,255, 0.3);}

.nonprofit-main-banner .Navi li a.item:hover::after {animation: ic_Ani 0.6s infinite;}
@keyframes ic_Ani {50% {top: 26px;}}

.nonprofit-main-banner .Navi li.map a.item {font-weight: 500;}
.nonprofit-main-banner .Navi li.map a.item span {
	display: inline-block;
	position: absolute; top: 43px; left: 50%;
	width: 90px; height: 18px; 
	margin: 0 0 0 -45px; padding: 0 0px 0 0;
	font-size: 13px; color: #fff; line-height: 18px; font-weight: 300; text-align: center;
	background: #0066cc;
	transition: 0.2s top;
	}
.nonprofit-main-banner .Navi li.map a.item:hover span {top: 25px;}

.nonprofit-main-banner .Navi li a.item .icon {
	display: block;
	position: absolute; top: -30px; right: -10px;
	width: 56px; height: 56px;
	padding: 11px 1px 0 0;
	font-size: 15px; color: #fff; line-height: 110%; font-weight: 300; text-align: center;
	border-radius: 100%;
	background: #e05555;
	box-shadow: 4px 4px 4px 0 rgba(0,0,0, 0.5);
	animation: icon_repeat_ani 0.8s infinite;
	}
@keyframes icon_repeat_ani {
	50% {top: -35px;}
	}

/*----- mouse Icon -----*/
.icon-scroll {
    position: absolute; bottom: -130px; left: 50%;
    width: 1em; height: 3.125em;
	margin: 0 0 0 3px;
    transform: translateX(-50%) scale(1.5);
	transition: opacity 0.3s;
    z-index: 11;
	visibility: hidden;
	}

.icon-arrows::after, .icon-arrows::before {content: '';}

.icon-arrows span, .icon-arrows::after, .icon-arrows::before {
    display: block;
	width: 0.315em; height: 0.315em;
	margin: 0 0 0.009em 0.315em;
    border-right: 1px solid rgba(255,255,255, 0.7);
    border-bottom: 1px solid rgba(255,255,255, 0.7);    
    transform: rotate(45deg);
    animation: mouse-scroll 1s infinite;
    animation-direction: alternate;
	}

.icon-arrows::before {margin-top: 0.315em; animation-delay: 0.1s;}
.icon-arrows::after  {animation-delay: 0.3s;}

.icon-scroll span {animation-delay: 0.2s;}

.icon-scroll .mouse {
    width: .875em; height: 1.375em;    
    border: 1px solid rgba(255,255,255, 0.7);
    border-radius: 2em;
	}

.icon-scroll .wheel {
    position: relative;
    display: block;
    width: 0.1875em; height: 0.1875em;
    margin: 0.1875em auto 0;
	border-radius: 50%;
    background: rgba(255,255,255, 0.9);
    animation: mouse-wheel 1.2s ease infinite;
	}

@keyframes mouse-wheel {
    0% {
        opacity: 1;
        transform: translateY(0);
		}
    100% {
        opacity: 0;
        transform: translateY(.375em);
		}
	}

@keyframes mouse-scroll {
    0%		{opacity: 0;}
    50%		{opacity: 0.5;}
    100%	{opacity: 1;}
	}

/* 2023-11-20 Ãß°¡ */
.nonprofit-Banner-wp {
	position: relative; 
	min-width: 1200px !important; max-width: none !important;
	height: 850px; 
	margin: 0 0 0px 0; 
	text-align: center; 
	background: #fff;
	overflow: hidden;
	z-index: 1;
	}

	.nonprofit-Banner-wp h1 {position: relative; margin: 160px 0 0 0; z-index: 3;}

	/*----- Navi -----*/
	.nonprofit-Banner-wp .navi {position: absolute; bottom: 90px; left: 50%; width: 1140px; margin: 0 auto 0 -570px; z-index: 10;}
		.nonprofit-Banner-wp .navi ul {float: left; width: 100%;}
		.nonprofit-Banner-wp .navi li {float: left; padding: 0 10px 20px 10px;}
			.nonprofit-Banner-wp .navi li a {
				display: block;
				position: relative; bottom: 0;
				height: 80px;
				padding: 25px 0 0 0px;
				font-family: 'Noto Sans KR', 'Noto Sans', sans-serif;
				font-size: 25px; color: #fff; letter-spacing: -1px; line-height: 110%; font-weight: 500; text-decoration: none !important; text-align: center;
				border: 1px solid rgba(255,255,255, 0.8); border-radius: 12px;
				/*background: #fff url('../../images/navi_ic.png') no-repeat 230px center;*/
				box-shadow: 0 0 0 0 rgba(255,255,255, 0.4);
				transition: 0.2s all, box-shadow 0.3s ease-in-out;
				z-index: 11;
				}
				.nonprofit-Banner-wp .navi li a:hover {
					bottom: 2px; 
					color: #090a7a; font-weight: 700; 
					background: #fff;					
					background-color: #fff;
					box-shadow: 0 0 0 20px transparent;
					}
				.nonprofit-Banner-wp .navi li a.two {padding-top: 15px;}
				.nonprofit-Banner-wp .navi li:nth-child(5) a { letter-spacing: -1.6px;}

				.nonprofit-Banner-wp .navi li a::after {
					content: "";
					position: absolute; bottom: -13px; left: 50%;
					width: 0; height: 0;
					margin: 0 0 0 -13px;
					border: 13px solid;
					border-color: #fff transparent transparent transparent;
					transition: 0.1s ease-in-out all;
					opacity: 0;
					z-index: 10;
					}
					.nonprofit-Banner-wp .navi li a:hover::after {bottom: -25px; transition: 0.2s ease-in-out 0.1s all; opacity: 1;}

				.nonprofit-Banner-wp .navi li a span.num {
					display: block;
					position: absolute; top: -10px; left: -10px;
					width: 30px; height: 30px;
					padding: 0 1px 0 0;
					font-size: 13px; color: #fff; letter-spacing: -0.5px; line-height: 29px; font-weight: 500; text-align: center;
					border-radius: 100%;
					background: #e420d4;
					transition: 0.2s all;
					}
					.nonprofit-Banner-wp .navi li a:hover span.num {color: #090a7a; background: #00d7ff;}
	
	/* video */
	.nonprofit-Banner-wp video {
		position : absolute; bottom: -50px; left: 0; right: 0;
		width : 100%; height : auto;
		z-index : 1;
		}
	.nonprofit-Banner-wp .dot {display: block; position: absolute; top: 0; bottom: 0; left: 0; right: 0; width: 100%; height: 100%; background: rgba(0,0,0, 0.5) url('../../images//main_visual_dot3.png') repeat; z-index: 2;}
	
	@media screen and (max-width: 1280px) {
		.nonprofit-Banner-wp video {width : auto; height : 100%; bottom: 0;}
		}

/* 2023-11-22 */
.nonprofit-Banner-2023 {
	display: flex;
	position: relative;
	min-width: 1200px; height: 1050px;
	justify-content: center;
	background: #161853 url('../../images/main_visual_bg.png') repeat-x 50% 0;
	overflow: hidden;
	}
	.nonprofit-Banner-2023 img {display: block; margin: 0 auto; object-fit: cover;}




/********************************************************************************************************************************
* ºñ¿µ¸®¹ýÀÎÀÇ È¸°è
********************************************************************************************************************************/
.comm-frame.acc {background: #f1f1f1 url('../../images/fr2_banner.jpg') no-repeat 50% bottom; background-size: 100% auto;}

.comm-frame.acc .flow {
	position: relative;
	margin: -20px -20px 0 -20px;
	overflow: hidden;
	}

.comm-frame.acc .flow .line-txt {
	display: block;
	position: relative;
	width: 600px; height: 70px;
	margin: 0 auto 0 auto;
	font-family: 'Noto Sans KR', 'Noto Sans', '¸¼Àº °íµñ', 'Malgun Gothic';
	font-size: 23px; line-height: 70px; font-weight: 500; text-aligN: center;
	}
.comm-frame.acc .flow .line-txt::before, .comm-frame.acc .flow .line-txt::after {
	content: "";
	display: block;
	position: absolute; top: 50%; 
	width: 200px; height: 2px;
	background: #666;
	}
.comm-frame.acc .flow .line-txt::before {left: -10px;}
.comm-frame.acc .flow .line-txt::after	{right: -10px;}
.comm-frame.acc .flow .line-txt.line-None::before, .comm-frame.acc .flow .line-txt.line-None::after {display: none;}

.comm-frame.acc .flow .column {display: block; float: left; width: 50%; margin: 0 0 20px 0; padding: 0 20px;}
.comm-frame.acc .flow .column a {
	display: block;
	position: relative; bottom: 0;
	height: 70px;
	border-radius: 8px;
	/* font-family: 'Noto Sans KR', 'Noto Sans', '¸¼Àº °íµñ', 'Malgun Gothic'; */
	font-family: 'Gmarket Sans';
	font-size: 26px; color: #fff; letter-spacing: -1px; line-height: 76px; font-weight: 500; text-decoration: none; text-align: center;
	background: #f1c40f url('../../images/acc_flow_icon(w).png') no-repeat 50% 50%;
	box-shadow: 0 3px 1px 0 rgba(0,0,0, 0.1);
	}
.comm-frame.acc .flow .column a:hover {bottom: -2px; background: #1d236f url('../../images/acc_flow_icon(hover)1.png') no-repeat 50% 50%;}
.comm-frame.acc .flow .column a::before {
	content: "";
	display: block;
	position: absolute; top: -35px; left: 50%;
	width: 2px; height: 35px;
	background: #666;
	}

.comm-frame.acc .flow .column.ct {float: none; width: 580px; margin: 0 auto 40px auto; padding: 0;}
.comm-frame.acc .flow .column.ct a::before {top: -15px; height: 15px;}

/*----- Table -----*/
.comm-frame.acc .tbl {
	width: 950px;
	margin: 0 auto 40px auto;
	border: 2px solid #f1c40f;
	border-radius: 8px;
	overflow: hidden;
	}
.comm-frame.acc .tbl table {width: 100%; table-layout: fixed;}
.comm-frame.acc .tbl th {
	padding: 10px 0 10px 0;
	font-size: 14px; color: #450e21; line-height: 120%; font-weight: bold; text-align: center; vertical-align: middle;
	border-right: 1px solid rgba(241, 196, 15, 0.4); border-bottom: 1px solid rgba(241, 196, 15, 0.7);
	background: #FBEDB7;
	}
.comm-frame.acc .tbl td {
	padding: 10px 0 10px 0;
	font-size: 15px; line-height: 160%; text-align: center; vertical-align: middle;
	border-right: 1px solid #f1c40f; border-bottom: 1px solid #f1c40f;
	background: #fff;
	}
.comm-frame.acc .tbl td.Left {padding-left: 12px; padding-right: 12px; text-align: left;}
.comm-frame.acc .tbl td a {display: inline-block; text-decoration: none;}

.comm-frame.acc .tbl tr:last-child td {border-bottom: none;}



/********************************************************************************************************************************
* ºñ¿µ¸®¹ýÀÎÀÇ ¼¼¹«
********************************************************************************************************************************/
.comm-frame.tax {padding-bottom: 70px; background: url('../../images/fr1_bg_bottom.png') no-repeat 0 bottom, url('../../images/fr1_bg_top.png') no-repeat right 0;}

/*----- ºñ¿µ¸®¹ýÀÎ ¹ýÀμ¼ ½Å°í¾È³» -----------------------------------------*/
.comm-frame.tax .singo-column {margin: 0 -15px 40px -15px; overflow: hidden;}
.comm-frame.tax .singo-column ul {float: left;}
.comm-frame.tax .singo-column li {float: left; width: 50%; margin: 0 0 25px 0; padding: 0 15px;}

.comm-frame.tax .singo-column li a {
	display: block;
	position: relative; bottom: 0;
	height: 70px;
	padding: 0 0 0 58px;
	border-top-right-radius: 8px; border-bottom-right-radius: 8px;
	/* font-family: 'Noto Sans KR', 'Noto Sans', '¸¼Àº °íµñ', 'Malgun Gothic'; */
	font-family: 'Gmarket Sans';
	font-size: 22px; color: #fff; letter-spacing: -0.3px; line-height: 76px; font-weight: 400; text-decoration: none;
	background: #3b418d;
	}
.comm-frame.tax .singo-column li a:hover {bottom: -2px; background: #1d236f;}
.comm-frame.tax .singo-column li a i {
	display: block;
	position: absolute; top: 0; bottom: 0; left: 0;
	width: 35px;
	font-size: 20px; color: rgba(255,255,255, 0.5); line-height: 70px; text-align: center;
	background: #1d236f;
	transition: all 0.2s;
	}
.comm-frame.tax .singo-column li a i::before {content: "\f105";}
.comm-frame.tax .singo-column li a:hover i {padding: 0 0 0 10px; background: #11132e;}


/*----- ±â°üº° ¼¼¹«½Ç¹« ¹× ȸ°è -----------------------------------------*/
.comm-frame.tax .agency-column {margin: 0 -10px; overflow: hidden;}
.comm-frame.tax .agency-column .cols {float: left; width: 20%; padding: 0 10px; text-align: center;}

.comm-frame.tax .agency-column .cols a {display: block; margin: 0 auto 40px auto; text-decoration: none; text-align: left !important; overflow: hidden;}
.comm-frame.tax .agency-column .cols a img			{width: 100%; height: auto; filter: grayscale(60%); transition: 0.2s ease-in-out;}
.comm-frame.tax .agency-column .cols a:hover img	{filter: grayscale(0%); transform: scale(1.05);}

.comm-frame.tax .agency-column .cols a .stit {
	display: inline-block;
	position: relative;
	margin: 20px 0 8px 0; padding: 0 0px;
	/* font-family: 'Noto Sans KR', 'Noto Sans', '¸¼Àº °íµñ', 'Malgun Gothic'; */
	font-family: 'Gmarket Sans';
	font-size: 24px; color: #292f7e; letter-spacing: -0.3px; line-height: 130%; font-weight: 600;
	}
.comm-frame.tax .agency-column .cols a .stit::after {
	content: "";
	display: inline-block;
	position: absolute; bottom: -2px; left: 0;
	width: 0%; height: 2px;
	background: #292f7e;
	transition: all 0.3s;
	z-index: 5;
	}
.comm-frame.tax .agency-column .cols a:hover .stit::after {width: 100%;}
.comm-frame.tax .agency-column .cols a .txt {
	display: block;
	display: -webkit-box;
	font-size: 13px; color: #555; letter-spacing: -0.5px; line-height: 140%;
	word-wrap: break-word; text-overflow: ellipsis;
	-webkit-line-clamp: 3;
	-webkit-box-orient: vertical;
	overflow: hidden;
	}



/********************************************************************************************************************************
* °ü·Ã Çؼ³
********************************************************************************************************************************/
.comm-frame.Haesul {padding-bottom: 60px; border-top: 1px solid #e5e5e5; background: url('../../images/bg_pattern.gif');}



/********************************************************************************************************************************
* °ü·Ã µµ¼­ ¾È³»
********************************************************************************************************************************/
.comm-frame.Book {padding-bottom: 120px; background: url('../../images/book_bg.jpg') no-repeat center 0; background-size: cover; z-index: 1;}
.comm-frame.Book .container-n {width: 1400px;}

.comm-frame.Book .book {
	position: relative;
	margin: 5px 0 0 0; padding: 40px 130px 40px 50px;
	background: #f7f7f7;	/* f2f0f7 */
	overflow: hidden;
	}
.comm-frame.Book .book .photo {
	float: left;
	display: inline-block;
	margin: 0 50px 0 0; padding: 15px 0;
	border: 1px solid #eee;
	background: #fff;
	}
.comm-frame.Book .book .photo img {width: 400px; height: auto;}

.comm-frame.Book .book .info {float: left; font-size: 15px; line-height: 120%;}
.comm-frame.Book .book .info span.subj {
	display: block;
	margin: 25px 0 25px 0;
	font-family: 'Noto Sans KR', 'Noto Sans', '¸¼Àº °íµñ', 'Malgun Gothic';
	font-size: 38px; letter-spacing: -1.8px; font-weight: 700;
	}
.comm-frame.Book .book .info span.subj .writer {font-size: 17px; letter-spacing: -0.5px; font-weight: 400;}

.comm-frame.Book .book .info span.price {
	display: block;
	width: 580px;
	margin: 18px 0 0 0; padding: 10px 0 13px 30px;
	font-size: 17px; letter-spacing: 0; line-height: 150%;
	border-top: 1px solid rgba(167,155,203, 0.5); border-bottom: 1px solid rgba(167,155,203, 0.5);
	background: rgba(167,155,203, 0.08);
	}
.comm-frame.Book .book .info span.price strong {color: #ff3710;}

.comm-frame.Book .book .info span.etc {
	display: block;
	width: 580px;
	padding: 9px 0 12px 30px;
	font-size: 17px; letter-spacing: 0; line-height: 150%;
	border-bottom: 1px solid rgba(167,155,203, 0.3);
	}
.comm-frame.Book .book .info .detail {
	display: block;
	margin: 15px 0 0 0;
	font-size: 13.5px; color: #777; letter-spacing: -0.4px; line-height: 180%;
	}

.comm-frame.Book .book .Btns {position: absolute; top: 140px; right: 80px;}

.comm-frame.Book .book .Btns .Btn {
	display: block;	
	position: relative; bottom: 0;
	width: 180px; height: 90px;
	margin: 0 0 20px 0;
	font-size: 18.5px; color: #fff; letter-spacing: -0.5px; line-height: 90px; text-decoration: none; text-align: center; font-weight: bold;
    border-radius: 6px;
    border-bottom: 3px solid transparent;
	background: #1d236f;
	border-bottom-color: #0c0f31;
	transition: all 0.2s;
	}
.comm-frame.Book .book .Btns .Btn:hover {bottom: -2px; background: #1d236f;}
.comm-frame.Book .book .Btns .Btn.preview {background: #f1c40f ; border-bottom-color: #ffd417;}


/********************************************************************************************************************************
* °Ô½ÃÆÇ
********************************************************************************************************************************/
.comm-frame.Boards.Bg {background: #f2f2f6 url('../../images/board_bg.jpg') no-repeat 50% bottom;
	background-size: cover;
	}

.comm-frame.Boards .column {margin: 0 -20px;}
.comm-frame.Boards .board-wp {float: left; width: 50%; padding: 0 20px;}

/*----- Board Style -----*/
.comm-frame .board-wp .tbl {position: relative; border-top: 1px solid #666; border-bottom: 1px solid #ccc;}
.comm-frame .board-wp .tbl.bg .list li {background-color: rgba(255,255,255, 0.7);}
.comm-frame .board-wp .tbl.ticker {height: 260px;}
.comm-frame .board-wp .tbl.ticker .list {height: 260px; overflow: hidden;}

.comm-frame .board-wp .tbl .list li {
	position: relative;
	height: 52px;
	border-bottom: 1px solid #e3e3e3;
	}
.comm-frame .board-wp .tbl .list li:last-child {border-bottom: none;}

.comm-frame .board-wp .tbl .list li a.subj {
	display: inline-block;
	max-width: 100%;
	padding: 0 0 0 5px;
	font-family: 'Noto Sans KR', 'Noto Sans', '¸¼Àº °íµñ', 'Malgun Gothic';
	font-size: 16.5px; letter-spacing: -0px; line-height: 50px; font-weight: 400; text-decoration: none;
	white-space: nowrap; text-overflow: ellipsis;
	overflow: hidden;
	}
.comm-frame .board-wp .tbl .list li a.subj.type1 {max-width: 490px;}
.comm-frame .board-wp .tbl .list li a.subj.type2 {max-width: 420px;}
.comm-frame .board-wp .tbl .list li a.subj.type3 {max-width: 330px;}
.comm-frame .board-wp .tbl .list li a.subj.type4 {max-width: 550px;}

.comm-frame.Haesul .board-wp .tbl .list li a.subj {padding-left: 34px; background: url('/pds/images/sub/acc/acc_subm_icon.png') no-repeat 0 15px;}

.comm-frame .board-wp .tbl .list li a.speech-bubble-icon {
	padding-left: 32px;
	background: url('../../images/speech_bubble.png') no-repeat 0 14px;
	}

.comm-frame .board-wp .tbl .list li span.date {
	display: inline-block;
	position: absolute; top: 50%; right: 5px;
	height: 30px;
	margin: -15px 0 0 0;
	font-size: 12px; color: #999; line-height: 29px;
	transition: all 0.3s;
	}
.comm-frame .board-wp .tbl .list li span.name {
	display: inline-block;
	position: absolute; top: 50%; right: 70px;
	width: 75px; max-width: 100%; height: 30px;
	margin: -15px 0 0 0;
	font-size: 13px; color: #777; line-height: 29px; text-align: center;
	white-space: nowrap; text-overflow: ellipsis;
	overflow: hidden;
	transition: all 0.3s;
	}
.comm-frame .board-wp .tbl .list li:hover span.date, .comm-frame .board-wp .tbl .list li:hover span.name {color: #000;}

.comm-frame .board-wp .tbl .list li span.file {
	display: inline-block;
	position: absolute; top: 50%; right: 5px;
	min-width: 22px; height: 22px;
	margin: -11px 0 0 0;
	text-align: center;
	}
.comm-frame .board-wp .tbl .list li span.file a {display: table-cell; padding-left: 3px;}
.comm-frame .board-wp .tbl .list li span.file img {display: inline-block; width: auto; height: 22px;}
.comm-frame .board-wp .tbl .list li span.file .data-None {margin-top: 4px; text-align: center;}

/* Æ÷½ºÆ® & ½Ç¹«Çؼ³ */
.comm-frame .board-wp2 ul {float: left; width: 100%;}
.comm-frame .board-wp2 li {
		float: left;
		position: relative;
		width: 25%;
		margin: 0 0 50px 0; padding: 0 15px 0 0;
		}
.comm-frame .board-wp2 li:last-child {margin-bottom: 0 !important; padding-right: 0 !important;}
	.comm-frame .board-wp2 li:last-child .kind-Icon {right: 10px;}

.comm-frame .board-wp2 li .cnt-field{border: 1px solid #d3d3d3; overflow: hidden; background: #fff;}
	.comm-frame .board-wp2 .photo {
			display: flex;
			height: 193px;
			justify-content: left; align-items: center;
			}
		
			.comm-frame .board-wp2 .photo img {width: 100%; height: auto; max-height: 100%; margin: 0 auto;}
		
.comm-frame .board-wp2 .subj {
		display: block;
		display: -webkit-box;
		position: relative;
		height: 90px;
		padding: 0 20px 0 20px;
		font-size: 120%; letter-spacing: -0.5px; line-height: 1.3em; font-weight: normal; text-align: left;
		word-wrap: break-word; text-overflow: ellipsis;
		-webkit-line-clamp: 3;
		-webkit-box-orient: vertical;
		overflow: hidden;
	}

.comm-frame .board-wp2 .cnt-field .etc {
		display: block;
		position: relative;
		padding: 20px 20px 14px 20px;
		font-size: 14px; color: #999; line-height: 1.2em; text-align: left;
		z-index: 10;
		}
.comm-frame .board-wp2 .name {
		position: absolute; top: 210px; right: 30px;
		font-size: 100%;
		z-index: 10;
		}
		.comm-frame .board-wp2 li:last-child .name {right: 15px;}

	/* box hover */
.comm-frame .board-wp2 a:hover {text-decoration:none !important;}
	.comm-frame .board-wp2 .cnt-field .photo::before {opacity: 0;}
	.comm-frame .board-wp2 .cnt-field .photo::after {transform: scale(1.05);}
	.comm-frame .board-wp2 .cnt-field .photo img {
		width: auto; height: 100%;
		}
	.comm-frame .board-wp2 .cnt-field:hover {
		border-color: #111;
		box-shadow: 4px 4px 1px 0 rgba(0,0,0, 0.15);
		}

	/* Icon */
.comm-frame .board-wp2 .kind-Icon {
	display: block;
	position: absolute; top: 10px; right: 25px;
	width: 56px; height: 56px;
	padding: 15px 0 0 0;
	font-size: 11px; color: rgba(255,255,255, 0.9); letter-spacing: -0.2px; line-height: 1.25em; text-align: center;
	border-radius: 100%;
	box-shadow: 0 2px 1px 0 rgba(0,0,0, 0.15);
	z-index: 5;
	}
.comm-frame .board-wp2 .kind-Icon::before {
	content: "";
	display: block;
	position: absolute; top: 3px; left: 3px;
	width: 50px; height: 50px;
	border: 1px solid rgba(255,255,255, 0.1);
	border-radius: 100%;
	}
.kind-Icon.special		{letter-spacing: -1px !important; background-color: #111;}
.kind-Icon.silmu		{background-color: #111;}
.kind-Icon.cnt			{padding-top: 22px !important; background-color: #111;}
.kind-Icon.vod			{padding-top: 22px !important; background-color: #111;}
.kind-Icon.gpt			{padding-top: 14px !important; letter-spacing: -1px !important; background-color: #111;}	/* background-color: #0d9d82;*/
.kind-Icon.premium {
	right: 75px !important;
	padding-top: 22px !important;
	font-size: 11px !important; color: yellow !important; letter-spacing: -1px !important;	
	background: #d50100;
	box-shadow: 0 2px 1px 0 rgba(0,0,0, 0.15), 0 18px 1px 0 rgba(255,255,255, 0.1) inset !important;
	}


/* º¸µµÀÚ·á */
.comm-frame .board-wp .data .tbl .list li span.name {right: 165px;}
.comm-frame .board-wp .data .tbl .list li span.date {right: 90px;}

/* »ó´ã */
.comm-frame .board-wp .tbl .list li span.bIcon {position: absolute; top: 50%; right: 5px; margin: -12px 0 0 0;}
.comm-frame .board-wp .consult .tbl .list li span.name {right: 50px;}

/* °øÁö»çÇ× */
.comm-frame .board-wp .notice .tbl .list li span.date {right: 50px;}
.comm-frame .board-wp .notice .tbl .list li span.file {right: 10px;}

.comm-frame .board-wp .tbl .list li .kind-ic {
	display: inline-block;
	height: 18px;
	margin: -39px 0px 0 0; padding: 0 5px 0 5px;
	font-size: 11px; color: #fff; letter-spacing: -0.5px; line-height: 17px; text-align: center; vertical-align: middle;
	border-radius: 3px;
	background-color: #e05555;
	}




/*----- 樨毢(Media) -----*/
.comm-frame.Boards .media {
	column-count: 3; column-gap: 30px;
	margin: 0px 0 80px 0;
	}
.comm-frame.Boards .media a {display: block; position: relative; overflow: hidden;}
.comm-frame.Boards .media a::after {
	content: "";
	display: block;
	position: absolute; top: 50%; left: 50%;
	width: 60px; height: 60px;
	margin: -30px 0 0 -30px;
	background: url('../../images/media_playBtn.png') no-repeat 0 0;
	background-size: 60px auto;
	transform: scale(1);
	transition: all 0.2s;
	z-index: 3;
	}
.comm-frame.Boards .media a:hover::after {transform: scale(1.2);}

.comm-frame.Boards .media a img {display: block; width: 100%; height: 215px; transition: all 0.3s; transform: scale(1);}
.comm-frame.Boards .media a:hover img {transform: scale(1.05);}

.comm-frame.Boards .media .Lec-tabIcon {
	display: block;
	position: absolute; top: 10px; left: 10px;
	width: 48px; height: 48px;
	padding: 14px 0 0 0;
	font-size: 10px; letter-spacing: -1.5px; color: rgba(255,255,255, 0.9); line-height: 110%; text-align: center;
	border-radius: 100%;
	background: #896fc2;
	box-shadow: 0 2px 1px 0 rgba(0,0,0, 0.15);
	z-index: 5;
	}



/********************************************************************************************************************************
* ±âŸ
********************************************************************************************************************************/
.jarallax {
    position: relative;
    background-repeat: no-repeat;
    background-position: center center;
	background-size: cover;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	}
/*
@media screen and (max-width: 991px){
*/
@media (hover: none) and (pointer: coarse) {
	.jarallax {
		background: #222 !important;
		background-size: cover !important;
		background-attachment: fixed !important;
		}
	}


/*----- modal ------------------------------*/
/* ºñ¿µ¸®¹ýÀÎÀÇ È¸°è¿Í ¼¼¹« ¿Â¶óÀÎ °úÁ¤ */
.pop-div.modal-media .pop-wrap	{width: 1050px !important; height: 790px !important; margin: -395px 0 0 -525px !important;}
.pop-div.modal-media .pop-wrap .video-wp {width: 1000px; margin: 25px auto 0 auto; border-radius: 0; box-shadow: none;}
.pop-div.modal-media .pop-wrap .video-summary {
	position: relative;
	width: 1000px;
	margin: 25px auto 0 auto; padding: 20px 20px 20px 20px;
	font-size: 13px; line-height: 140%;
	border: 1px solid #ddd;
	background: #f3f3f3;
	}
.pop-div.modal-media .pop-wrap .video-summary strong {display: block; margin: 0 0 5px 0;}
.pop-div.modal-media .pop-wrap .video-summary a {position: absolute; top: 50%; right: 20px; margin: -22.5px 0 0 0;}


/*----- modal(Çؼ³¿ë)  ------------------------------*/
/* Çؼ³ Reset */
.haesul-view-wp.nonprofit {width: 1180px; margin: 0; padding: 55px 50px 0 50px; border: none;}

.pop-div.nonprofit .pop-wrap {top: 0; width: 1200px; height: 100vh; margin: 0 0 0 -600px;}
.pop-div.nonprofit .pop-wrap iframe {width: 100%; height: 100%;}

.haesul-view-wp.nonprofit .top .etc .print-Btn {
	display: inline-block;
	position: absolute; top: 10px; right: 0;
	height: 28px;
	padding: 0 10px;
	font-size: 13px; color: #fff; line-height: 28px; text-decoration: none; text-align: center;
	border-radius: 3px;
	background: #333;
	}