@charset "utf-8";
/**
 * @File Name : all.css
 * @Description : Base Adjust + Layout[main+sub] Mobile First!
 * @Modification Information
 * <pre>
 * 수정일 | 수정자 | 수정내용
 * 2025.07.01 | 김효진 | 최초 등록
 * </pre>
 * @author 디자인팀 김효진
 * @since 2025.07.01
 *
 * @Copyright (C) IACTS.CO.KR All rights reserved.
 */

/* 스크롤바 전체 폭 설정 */
::-webkit-scrollbar {
    width:5px;  /* 세로 스크롤바 폭 */
    height:5px; /* 가로 스크롤바 높이 */
}

/* 스크롤바 막대 (움직이는 부분) 스타일 */
::-webkit-scrollbar-thumb {
    background-color:rgba(0,0,0,.5); /* 막대 색상 */
    border-radius:9999px;    /* 막대 둥글게 */
}

/* 스크롤바 뒷배경 (트랙) 스타일 */
::-webkit-scrollbar-track {
    background-color: #ededed; /* 배경 색상 */
}

/* 막대에 마우스를 올렸을 때 */
::-webkit-scrollbar-thumb:hover {
    background: #555;
}


/* base.css )) Overwrite. 20200117 ◆◆◆ */
body{
	background:transparent;
	color:#000; /* ☆#555 */
	font-weight:400;
	font-size:17px; /* (((16px */
	line-height:1.75; /* ☆ */
	letter-spacing:-.025em; /* (-.25px/16px) */
	height:100%;
	overflow:hidden;
}

[lang|='ko'],
[lang|='ko']>*{
	font-family:
		'Paperlogy',
		'돋움',Dotum,
		Helvetica,'Helvetica Neue',
		Arial,sans-serif;
}

h1, h2, h3, h4, h5, h6 {letter-spacing:-.05em}

/* ◇◆ 공용 ◇◆ */
/* ◇◆ Layout[main+sub] ◇◆◇◆◇◆◇◆◇◆ */
html,
body,
#container, #wrap, #body {min-height:100%;}
.container {position:relative;
	min-width:280px; /* ☆ */
	margin:auto; /* ☆ */
	max-width:1500px;
}
#container {position:static;height:calc(100vh - 350px);overflow-y:auto;margin-top:85px;}
	#head {position:absolute;top:0;left:0;clear:both;width:100%;height:95px;}
	#wrap {
		clear:both;
		min-height:50px; /* ☆ 펼친 콘텐츠 높이 고려. */
		z-index:2;overflow-x:hidden;
	}
		#wrap>.container{position:static;} /* ))) sub.css, main.css */
			#body {max-width:960px;height:100%;margin:auto;}
	#foot {clear:both;position:relative;	}
 

/* 배치.유틸 20191220 */
.width1expand1 {margin-left:-20px;margin-right:-20px;}
@media screen and (max-width:999px){
	#body {margin-left:16px;margin-right:16px}
}
@media screen and (max-width:872px){
	.close #body {margin-left:16px;margin-right:16px;width:calc(100% - 32px)}
}
@media screen and (max-width:768px){
	#container {margin-top:75px;height:calc(100vh - 260px);}
	#head {height:75px;}
	#body {margin:auto}
}
@media screen and (max-width:599px){
	#container {height:calc(100vh - 250px);}
}

/* 사파리 브라우저 */
body.safari-only #container {margin-top:85px;height:calc(100vh - 290px)}

/* html 배경 라이트모드 */
html {background:#f0faf4;transition:background .4s ease;scroll-behavior:smooth;overflow:hidden;}
/* 다크모드 */
html.dark-mode {background-image:url(../../img/inc/dark_bg.gif);}

/* head 라이트모드 / 기본 */
h1#logo {position:fixed;top:37px;left:384px;margin:0;z-index:2;transition:left .4s ease 0s}
h1#logo a {display:inline-block;vertical-align:top;height:44px}
h1#logo a img {height:100%;}
#gn1 {position:fixed;top:30px;right:60px;border:1px solid #1d1d1f;border-radius:9999px;background:#1d1d1f;z-index:3;transition:right .4s ease 0s;}
#gn1 li {display:inline-block;vertical-align:top;}
#gn1 li button {border:0;background:transparent;border-radius:9999px;font-size:15px;font-weight:700;color:#fff;height:40px;padding-left:13px;padding-right:15px;box-sizing:border-box;}
#gn1 li button[aria-checked=true] {background:#fff;color:#1a2344;width:90px;}
#gn1 li button:before {content:"";display:inline-block;vertical-align:middle;width:16px;height:16px;background:url(../../img/inc/layout_sprite.png) no-repeat;background-size:1000px auto;margin:-4px 5px 0 0}
#gn1 li button.light:before{background-position:-333px -18px;}
#gn1 li button.dark:before{background-position:-351px 0;}
#gn1 li button.light[aria-checked=true]:before{background-position:-333px 0;}
#gn1 li button.dark[aria-checked=false]:before{background-position:-351px -18px;}
#gn1 li button {background-position:-333px -52px;}
.close h1#logo {left:51px;transition-delay:.05s}
/* 다크모드 */
.dark-mode h1#logo a:before {position:absolute;top:0;left:0;content:"";display:block;width:100%;height:44px;background:url(../../img/inc/logo@2x.dark.png) no-repeat 0 0 / cover}
.dark-mode h1#logo a img {opacity:0}
.dark-mode #gn1 {border-color:#4f5574;background-color:#000}
@media screen and (max-width:1368px){
	.close h1#logo {left:24px}
}
@media screen and (max-width:1259px){
	h1#logo {top:27px;left:355px;}
	h1#logo a {height:39px}	
	#gn1 {right:16px}
	.dark-mode h1#logo a:before {height:39px}
	.close h1#logo {left:16px}
}
@media screen and (max-width:999px){
	#gn1 {top:27px}
}
@media screen and (max-width:768px){
	h1#logo {left:16px}
	h1#logo a {height:39px}
	#gn1 {right:16px;z-index:1}
	#gn1 li button {font-size:14px;padding-left:13px;padding-right:13px;height:36px;}
	#gn1 li button:before {margin-right:4px;}
	#gn1 li button[aria-checked=true] {width:auto;}
	.dark-mode h1#logo a:before {height:39px}
}
@media screen and (max-width:599px){
	h1#logo {top:25px}
}
@media screen and (max-width:399px){
	h1#logo a {height:36px}
	#gn1 li button {padding-left:10px;padding-right:10px;height:32px;}
	#gn1 li button:before {margin-right:2px;}	
	.dark-mode h1#logo a:before {height:36px}
}

/* wrap */
#wrap {max-width:1320px;padding-left:350px;margin:0;margin-left:calc(50% - 660px);padding-top:10px;padding-right:10px;box-sizing:border-box;transition:padding .4s ease 0s;}
.close #wrap {padding-left:0;transition-delay:.05s}
@media screen and (max-width:1368px){
	.close #wrap {margin-left:auto;margin-right:auto;}
}
@media screen and (max-width:1259px){
	#wrap {margin-left:16px;margin-right:6px;}
}
@media screen and (max-width:768px){
	#wrap {padding-left:0;}
}

/* container */
#container #mCSB_1_container {padding-top:10px;}
#container .mCS-dark-3.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {background-color:#2d2f36;}
#container .mCS-dark-3.mCSB_scrollTools .mCSB_draggerRail {background-color:#ebedee;}
/* 다크모드 */
.dark-mode #container .mCS-dark-3.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {background-color:#ebedee}
.dark-mode #container .mCS-dark-3.mCSB_scrollTools .mCSB_draggerRail {background-color:#444;}

/* sidebar */
#sidebar {position:fixed;top:0;left:0;width:360px;height:100%;transition:left .4s ease .05s;z-index:1000;background:linear-gradient(120deg,rgba(6, 174, 78, 1) 33%, rgba(3, 181, 159, 1) 63%);}
#sidebar .wrap1 {position:relative;width:100%;height:100%;z-index:1;/* background:#fff; */border-bottom-left-radius:60px;padding:31px 30px 50px ;box-sizing:border-box;}
#sidebar .wrap1 .hg1 {margin-bottom:20px}
#sidebar .wrap1 .hg1 .slogo {display:block;width:287px;height:101px;background:url(../../img/inc/layout_sprite.png) no-repeat 0 0 / 1000px auto;text-indent:-9999px;margin:0 0 25px -3px;}
#sidebar .wrap1 .hg1 form {position:relative;}
#sidebar .wrap1 .hg1 form * {margin:0}
#sidebar .wrap1 .hg1 form input[type="text"].text {width:100%;height:50px;border:1px solid #fff;border-radius:8px;box-sizing:border-box;color:#fff;font-size:15px;font-weight:400;padding-left:18px;background:transparent;}
#sidebar .wrap1 .hg1 form input[type="text"].text:focus {outline:2px dotted #1d51d3}
#sidebar .wrap1 .hg1 form input.text::-webkit-input-placeholder {color:#fff;} /* WebKit browsers */
#sidebar .wrap1 .hg1 form input.text:-moz-placeholder {color:#fff;} /* Mozilla Firefox 4 to 18 */
#sidebar .wrap1 .hg1 form input.text::-moz-placeholder {color:#fff;} /* Mozilla Firefox 19+ */
#sidebar .wrap1 .hg1 form input.text:-ms-input-placeholder {color:#fff;} /* Internet Explorer 10+ */
#sidebar .wrap1 .hg1 form .b1 {position:absolute;right:15px;top:50%;width:24px;height:24px;border:0;background:url(../../img/inc/layout_sprite.png) no-repeat -289px -22px;margin-top:-13px;padding:0;text-indent:-9999px;}
#sidebar .wrap1 .hg1 form .b1:before {display:none;}
#sidebar .wrap1 .hg1 .b1 {display:block;font-size:16px;border-radius:6px;padding-left:20px;}
#sidebar .wrap1 .hg1 .b1:before, #sidebar .wrap1 .hg1 .b1.newchat:after {content:"";display:inline-block;vertical-align:middle;background:url(../../img/inc/layout_sprite.png);background-repeat:no-repeat;background-size:1000px auto;margin-right:8px}
#sidebar .wrap1 .hg1 .b1.newchat {position:relative;background:#044074;color:#fff;font-weight:700;line-height:50px;margin-bottom:7px;}
#sidebar .wrap1 .hg1 .b1.newchat:before {width:20px;height:20px;background-position:-289px 0;margin-top:-5px;}
#sidebar .wrap1 .hg1 .b1.guide {background:#273c4f;line-height:50px;font-weight:700;color:#fff;margin-top:10px;margin-bottom:9px;}
#sidebar .wrap1 .hg1 .b1.guide:before {width:20px;height:20px;background-position:-311px 0;margin-top:-5px;}
#sidebar .wrap1 .hlist {height:calc(100% - 275px);}
#sidebar .wrap1 .hlist .h1 {position:relative;border-radius:8px;line-height:50px;font-size:17px;font-weight:700;color:#fff;background:#0b633e;margin-bottom:9px;padding:0 20px;}
#sidebar .wrap1 .hlist .h1:after {position:absolute;top:50%;right:23px;content:"";display:block;width:14px;height:8px;background:url(../../img/inc/layout_sprite.png) no-repeat -301px -48px / 1000px auto;margin-top:-4px;}
#sidebar .wrap1 .hlist .hlist1wrap {height:calc(100% - 70px);overflow-y:auto;}
#sidebar .wrap1 .hlist ul li {margin:2px 0;border-bottom:1px solid rgba(255,255,255,0.3);}
#sidebar .wrap1 .hlist ul li a {position:relative;display:block;font-size:15px;font-weight:400;color:#fff;white-space:nowrap;text-overflow:ellipsis;overflow:hidden;padding:0 20px;line-height:47px;}
#sidebar .wrap1 .hlist ul li a:before {position:absolute;left:10px;top:50%;content:"";display:block;width:5px;height:5px;background:#fff;border-radius:50%;margin-top:-3px;}
#sidebar .wrap1 .hlist1wrap .mCS-dark-3.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {background-color:#2d2f36;margin-right:0;}
#sidebar .wrap1 .hlist1wrap .mCS-dark-3.mCSB_scrollTools .mCSB_draggerRail {background-color:#ebedee;margin-right:0;}
#sidebar .b2 {position:absolute;top:50%;right:-50px;width:50px;height:165px;background:url(../../img/inc/layout_sprite.png) no-repeat 0 -109px / 1000px auto;border:0;text-indent:-9999px;margin-top:-50px}
#sidebar .b2:before {content:"";display:block;width:10px;height:19px;background:url(../../img/inc/layout_sprite.png) no-repeat -289px -48px / 1000px auto;margin:-14px auto 0;}
#sidebar .b2 .t1 {display:block;}
.close #sidebar {left:-360px;transition-delay:0s}
.close #sidebar .b2:before{transform:rotate(180deg)}
/* 다크모드 */
.dark-mode #sidebar{background:#292929}
.dark-mode #sidebar .wrap1 .hg1 form input[type=text].text {border-color:#4f545c;background-color:#000;color:#fff;}
.dark-mode #sidebar .wrap1 .hg1 form input.text::-webkit-input-placeholder {color:#fff;} /* WebKit browsers */
.dark-mode #sidebar .wrap1 .hg1 form input.text:-moz-placeholder {color:#fff;} /* Mozilla Firefox 4 to 18 */
.dark-mode #sidebar .wrap1 .hg1 form input.text::-moz-placeholder {color:#fff;} /* Mozilla Firefox 19+ */
.dark-mode #sidebar .wrap1 .hg1 form input.text:-ms-input-placeholder {color:#fff;} /* Internet Explorer 10+ */
.dark-mode #sidebar .wrap1 .hg1 .b1.guide {background-color:#444;color:#fff}
.dark-mode #sidebar .wrap1 .hlist .h1 {border-color:#686868;color:#fff}
.dark-mode #sidebar .wrap1 .hlist ul li a {color:#fff}
.dark-mode #sidebar .wrap1 .hlist .mCS-dark-3.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {background-color:#ebedee}
.dark-mode #sidebar .wrap1 .hlist .mCS-dark-3.mCSB_scrollTools .mCSB_draggerRail {background-color:#444;}
@media screen and (min-width:1260px){
	#sidebar .wrap1 .hg1 .b1.newchat:hover:after {right:15px;}
	#sidebar .wrap1 .hg1 .b1.guide:hover, #sidebar .wrap1 .hg1 .b1.guide:focus {border-color:#444;}
}
@media screen and (max-width:1259px){
	#sidebar {width:324px;}
	#sidebar .wrap1 {padding:36px 24px 40px;border-bottom-left-radius:54px}
	.close #sidebar {left:-324px}
	#sidebar .b2 {top:35%}
}
@media screen and (max-width:999px){
	#sidebar .b2 {top:30%}	
}
@media screen and (max-width:768px){
	#sidebar {left:-324px}
	#sidebar .wrap1 {padding:32px 22px 30px;border-bottom-left-radius:40px;}
	#sidebar .wrap1 .hg1 {margin-bottom:10px}
	#sidebar .wrap1 .hg1 .slogo {width:259px;height:92px;background-size:900px auto;margin-bottom:20px}/* 90%축소 */
	#sidebar .wrap1 .hg1 form input[type="text"].text {height:45px;}
	#sidebar .wrap1 .hg1 .b1 {font-size:15px;padding-left:15px}
	#sidebar .wrap1 .hg1 .b1.newchat {margin:10px 0;line-height:45px;}
	#sidebar .wrap1 .hg1 .b1.guide {line-height:43px}
	#sidebar .wrap1 .hlist {height:calc(100% - 250px)}
	#sidebar .wrap1 .hlist .h1 {line-height:46px;font-size:16px;padding:0 15px}
	#sidebar .wrap1 .hlist ul {height:calc(100% - 65px)}
	#sidebar .wrap1 .hlist ul li a {font-size:15px;line-height:46px;padding:0 15px;}
	#sidebar .b2 {top:7%;right:-40px;width:40px;height:132px;background-size:800px auto;background-position:0 -87px;margin-top:0;}/* 80%축소 */
	#sidebar .b2:before {margin:-8px auto 0;transform:rotate(180deg)}
	.close #sidebar {left:0;}
	.close #sidebar .b2:before {transform:rotate(0)}
}
@media screen and (max-width:599px){
	#sidebar {width:300px;left:-300px}
	#sidebar .wrap1 {padding:30px 18px 25px}
	#sidebar .wrap1 .hg1 {margin-bottom:15px;}
	#sidebar .wrap1 .hg1 .slogo {width:230px;height:81px;background-size:800px auto;margin-bottom:15px}/* 80%축소 */
	#sidebar .wrap1 .hg1 .b1.newchat {margin:7px 0}
	#sidebar .wrap1 .hg1 .b1 {font-size:14px;}
	#sidebar .wrap1 .hlist {height:calc(100% - 218px)}
	#sidebar .wrap1 .hlist .h1 {line-height:43px;font-size:15px;}
	#sidebar .wrap1 .hlist ul {height:calc(100% - 95px);}
	#sidebar .wrap1 .hlist ul li a {font-size:14px;line-height:41px;padding-top:2px;box-sizing:border-box;}
}
@media screen and (max-width:399px){
	#sidebar {width:280px;left:-280px}
	#sidebar .wrap1 {padding-left:15px;padding-right:15px;}
	#sidebar .wrap1 .hg1 .slogo {width:202px;height:71px;background-size:700px auto;}/* 70%축소 */
	#sidebar .b2 {right:-35px;width:35px;height:116px;background-size:700px auto;background-position:0 -88px;}/* 70%축소 */
	#sidebar .b2:before{margin:-29px auto 0;}
	.close #sidebar {left:0}
}

/* 검색폼 라이트모드 */
.search1form {text-align:center;padding-top:18vh;max-width:960px;margin:auto}
.search1form .t1 {font-size:32px;font-weight:300;color:#000;margin:0 0 30px;line-height:1.3}
.search1form .t1 strong {display:block;font-weight:400;font-size:40px;}
.search1form .t1 strong em {font-weight:600;color:inherit;}
.search1form fieldset {margin:0}
.search1form .msg1box {position:relative;border:1px solid #d5d5d5;height:160px;border-radius:16px;padding:5px;background:#fff;box-shadow:3px 3px 7px rgba(0,0,0,.16);box-sizing:border-box;}
.search1form .msg1box textarea {border:0;background:#f4f7f8;margin:0;border-radius:10px;height:100%;}
.search1form .msg1box .b1 {position:absolute;bottom:19px;width:50px;height:50px;background:url(../../img/inc/layout_sprite.png) no-repeat;background-size:1000px auto;border:0;margin:0}
.search1form .msg1box .b1.voicesearch {right:79px;background-position:-313px 0;}
.search1form .msg1box .b1.submit {right:19px;background-position:-261px 0;}
.info {position:absolute;bottom:100px;left:50px;font-size:16px;color:#666;line-height:19px;font-weight:300;margin:0;z-index:4}
.info strong {display:block;font-weight:300}
/* 다크모드 */
.dark-mode .search1form .t1 {color:#fff;}
.dark-mode .search1form .msg1box textarea {background-color:#2c2c2c;border:4px solid #000;box-sizing:border-box;color:#fff}
.dark-mode .search1form .msg1box .b1.voicesearch {background-position:-313px -52px}
.dark-mode .info {color:#a1a1a1}
@media screen and (max-width:1259px){
	.info {left:16px;width:calc(100% - 32px)}
}
@media screen and (max-width:999px){
	.search1form .t1 {font-size:29px;margin-bottom:27px}
	.search1form .t1 strong {font-size:36px}
	.info {font-size:15px}
}
@media screen and (max-width:768px){
	.search1form .t1 {font-size:24px}
	.search1form .t1 strong {font-size:32px}
	.search1form .msg1box {padding:3px;}
	.search1form .msg1box .b1 {bottom:15px;width:45px;height:45px;background-size:900px auto}
	.search1form .msg1box .b1.voicesearch {right:65px;background-position:-282px 0;}
	.search1form .msg1box .b1.submit {right:15px;background-position:-235px 0;}
	.dark-mode .search1form .msg1box .b1.voicesearch {background-position:-282px -47px}
}
@media screen and (max-width:599px){
	.search1form {padding-top:15vh}
	.search1form .t1 {font-size:21px;margin-bottom:21px}
	.search1form .t1 strong {font-size:28px}
	.search1form .msg1box {height:140px;}
	.search1form .msg1box .b1 {bottom:10px;width:40px;height:40px;background-size:800px auto}
	.search1form .msg1box .b1.voicesearch {right:55px;background-position:-250px 0;}
	.search1form .msg1box .b1.submit {right:10px;background-position:-209px 0;}
	.dark-mode .search1form .msg1box .b1.voicesearch {background-position:-250px -42px}	
	.info {position:relative;bottom:auto;left:auto;font-size:14px;margin-top:50px;}	
}
@media screen and (max-width:449px){
	.info {margin-top:35px}
}
@media screen and (max-width:399px){
	.search1form .t1 {font-size:18px;}
	.search1form .t1 strong {font-size:24px}
}