@charset "utf-8";
/* ************************ 레이아웃 설정 ************************ */

html body { font-family:var(--f_base1), sans-serif; font-size:var(--fs16); font-weight:400; line-height:1.6; color:#232323; word-break:keep-all; overflow-x:hidden; } 
html body * {box-sizing:border-box;}

a,img,i,button { transition:all .3s ease; -webkit-transition:all .3s ease; -moz-transition:all .3s ease; } 

.preWrap {padding:20px; background-color: #F7F7F7; border-radius:5px; border:1px solid var(--border1);}
.preWrap pre {
	height:60px; overflow-y:auto; padding:0; border:0;
	display: block; margin:0; font-family:var(--f_Pretendard), sans-serif;
	font-size:var(--fs16); font-weight: 400; line-height: 1.6;
	letter-spacing: -0.48px; color: #666;word-break: break-all;
	word-wrap: break-word;
	white-space: pre-wrap; /* CSS3*/
	white-space: -moz-pre-wrap; /* Mozilla, since 1999 */
	white-space: -pre-wrap; /* Opera 4-6 */
	white-space: -o-pre-wrap; /* Opera 7 */
	word-wrap: break-all; /* Internet Explorer 5.5+ */ 
}

/* lnb 배경 */
.sub-visual {position:relative; width:100%; height:300px; /*background:#fff  center /cover no-repeat;*/ background: linear-gradient(180deg, #ffeff8 0%, #fff 100%);} 
/* .sub-visual .cover { width: 100%; height: 100%; position: absolute; left: 0; top: 0; background: rgba(255, 255, 255, 0.10); backdrop-filter: blur(2.5px); }  */
/*.sub-visual {background-image:url(/images/common/bg_intro.png); }
.sub-visual.intro {background-image:url(/images/common/bg_intro.png); }
.sub-visual.business {background-image:url(/images/common/bg_business.png); }
.sub-visual.recruit {background-image:url(/images/common/bg_recruit.png); }
.sub-visual.online {background-image:url(/images/common/bg_online.png); }
.sub-visual.customer {background-image:url(/images/common/bg_customer.png); }
.sub-visual.member {background-image:url(/images/common/bg_member.png); }*/


/* ************************ 데스크탑 (1249~) ************************ */
@media screen and (min-width: 1200px), print {
	#gotop.only-mobile {display:none !important;}

	.mobile {display:none !important;}

	

	@keyframes wide {
	  from {transform:scaleX(0);}
	  to {transform:scaleX(1);}
	}


	/* lnb */
	.sub-visual {margin-top:100px;}
	.sub-visual-wrap {position:relative; height:100%; display: flex; justify-content: center; align-items: center; flex-direction: column; gap:35px;}
	
	.vector-wrap {}
	.vector-wrap .vector-star {position:absolute; left:24%; bottom:25%; width:55px;}
	.vector-wrap .vector-circle {position:absolute; right:25%; top:25%; width:55px;}
	
	
	.sub-visual-txt {}
	.sub-visual-txt h2 { font-family:OneStoreMobileGothicBody; text-align: center; color: #000;font-size:var(--fs40);line-height: normal;letter-spacing: -1.2px;}
	.sub-visual-txt p {padding:10px 0 0; color: #000; opacity: 0.5; font-size:var(--fs16); line-height: normal;}
	.sub-visual-nav {display:flex; gap:10px; align-items:center; opacity: .3;}
	.sub-visual-nav p {color: #000;font-size:var(--fs14); line-height: normal;}
	.sub-visual-nav p.dot {width: 3px; height: 3px; background:#000; border-radius:50%; }
	
	.lnbH {height:70px;}
	.lnb {position:absolute; top:400px; left:0; width:100%; height:70px;/*background:#fff;   border-bottom:1px solid var(--border1);*/} 
	.lnb.fixOn {position:fixed; top:0;z-index:1000;/*box-shadow: rgba(0, 0, 0, 0.05) 0px 10px 20px -3px, rgba(0, 0, 0, 0.05) 0px 4px 8px -2px;*/}
	
	.lnb-wrap {display:flex; height:65px; align-items:center; justify-content: center; position:relative; border:2px solid #101828; border-radius:25px; background:#fff; box-shadow: 4px 4px 0 #000;}
	.lnb-wrap h2 {
		padding-right:100px; color:var(--c_base2); background:url(/images/common/icon_lnb_tit.svg)calc(100% - 50px) 0 no-repeat;
		color: var(--c_base2);font-size:var(--fs18);font-weight: 600; line-height:70px; 
	}
	.lnb-menu {height:100%;}
	.lnb-menu ul {display:flex; gap:30px;height:100%; align-items:center;}
	.lnb-menu ul li {height:100%; display:flex; align-items:center; border-bottom:3px solid transparent;}
	.lnb-menu ul li a {color: #000;font-size:var(--fs18);font-weight: 600;line-height: 100%;}
	.lnb-menu ul li.bar {width: 1px; height: 19px; background:var(--border1);}
	/* .lnb-menu ul li.on {border-color:var(--c_base1);} */
	.lnb-menu ul li.on a {color:var(--c_base1);}
	/* .lnb-gotop {} */
	.lnb .gotop {
		padding:10px 0 0; width:60px; height:66px; line-height:66px; opacity:1 !important;
		position:absolute; right:0; top:0; text-align:center;
		background:url(/images/common/icon_gotop.svg)50% calc(50% - 10px) no-repeat;
		font-size:var(--fs12); font-weight:600; color:#000; 
	}
	
	
	
	

	/*컨텐츠*/
	.contentsWrap {position:relative; border-radius:0 0 50px 50px;     margin-bottom: -50px; z-index: 1; background: #fff;}
	.contents {max-width:1400px; margin:0 auto; padding:70px 0 100px;}
	.contents img {max-width:100%; /*width:100%;*/}
	.img img {width:100%;}
	
	/*footer*/	
	footer {width:100%; background:#fff; position:relative;}

		.mainBody footer {padding-top:0;}
		.mainBody footer:before {display:none;}
	
	footer div[class*="part-"] {display:table; width:100%; border-top:1px solid #f1f1f1;}
	footer div[class*="part-"]>* {display:table-cell; vertical-align:top;}

	footer .part-1 {padding:80px 4vw;background:#9b8eff;}
    /* footer .part-1:before {position: absolute; content: ""; width: 100%; height: 48px; top: 0; left: 0; background: #FAF5FE; border-radius: 0 0 50px 50px;} */
	footer .part-1 .morelink {width:calc(100% - 400px); padding-top:10px; line-height:1;}
	footer .part-1 .morelink a {display:inline-block; margin-right:40px; font-weight:400; font-size:14px; letter-spacing:-.05vw; line-height:1; color:#fff;}
	footer .part-1 aside {text-align:right; line-height:1 !important; font-size:0; width:400px;}
	footer .part-1 aside li {display:inline-block;}
	footer .part-1 aside li a {display:block; padding:10px 30px; margin-left:10px; font-size:12px; font-weight:400; line-height:1; background:#fff; border-radius:50px; border:1px solid #e5e5e5;}
	footer .part-1 aside li a:hover {color:#fff; background:#c4bdff; border:1px solid #c4bdff;}
	footer .part-1 aside li a.i-admin {padding-left:50px; background:#fff url(../images/common/i-admin.png)no-repeat 20px center;}
	footer .part-1 aside li a.i-admin:hover {background-color:#c4bdff; background-image:url(../images/common/i-admin-on.png);}
	
	footer .part-2 {display:flex !important; gap:35px; padding:40px 4vw; border-radius:50px 50px 0 0; margin-top:-50px; background:#fff;}
	footer .part-2 .logo {font-size:24px; font-weight:400; color:#000; width:150px; line-height:1.2;}
	footer .part-2 .info {width:calc(100% - 150px);}
	footer .part-2 .info address p {font-style: normal; font-size:14px; color:#666; font-weight:300;}
	footer .part-2 .info address p span {margin-right:10px; }
}


/* ************************ 데스크탑 (1249~) ************************ */
@media screen and (max-width: 1249px), print {
	
	
	/* lnb */
	.sub-visual {margin-top:80px; height:200px;}
	.sub-visual-wrap {position:relative; height:100%; display: flex; justify-content: center; align-items: center; flex-direction: column; gap:35px;}
	
	.vector-wrap {display:none;}
	.vector-wrap .vector-star {position:absolute; left:24%; bottom:25%; width:55px;}
	.vector-wrap .vector-circle {position:absolute; right:25%; top:25%; width:55px;}
	
	
	.sub-visual-txt {}
	.sub-visual-txt h2 { font-family:OneStoreMobileGothicBody; text-align: center; color: #000;font-size:var(--fs40);line-height: normal;letter-spacing: -1.2px;}
	.sub-visual-txt p {padding:10px 0 0; color: #000; opacity: 0.5; font-size:var(--fs16); line-height: normal; text-align: center;}
	.sub-visual-nav {display:flex; gap:10px; align-items:center; opacity: .3;}
	.sub-visual-nav p {color: #000;font-size:var(--fs14); line-height: normal;}
	.sub-visual-nav p.dot {width: 3px; height: 3px; background:#000; border-radius:50%; }

	
	
	
}


/* ************************ 모바일 (~991) ************************ */
@media screen and (max-width: 991px) {

	
	html,body {font-size:15px; overflow-x:hidden;}	
	.pc {display:none !important;}
	#gotop {display:none !important;}

	/*서브메뉴*/
	.lnb {display:none;}	
	

	/* 상단배경 */
	.topBg {position:relative; max-width:100%; height:80px; background:url(../images/common/topBg.jpg) no-repeat center top; background-size:cover;}
	.topBg:before {content:""; position:absolute; left:0; top:0; width:100%; height:100%; background-color:rgba(0,228,255,.3);} 
	.topBg .txt {display:none;}
	
	
	/*컨텐츠*/
	.contents {max-width:1400px; margin:0 auto; padding:30px 20px;}
	.contents img {max-width:100%;}
		
	
	/*footer*/
	footer {overflow:hidden; width:100%; background:#fff; position:relative; padding:30px 20px !important;}
	/* footer:before {position:absolute; top:0; left:0; display:block; content:""; height:10px; width:100%; background:#eee; box-shadow:3px 3px 3px #ddd inset;} */
	
		.mainBody footer {padding-top:0;}
		.mainBody footer:before {display:none;}
	
	footer div[class*="part-"] {width:100%;}
	
	footer .part-1 .morelink {line-height:1; text-align:center;}
	footer .part-1 .morelink a {display:inline-block; padding:5px; font-weight:400; font-size:14px; letter-spacing:-.05vw; line-height:1;}
	footer .part-1 .morelink a.acc {color:#3366cc;}
	footer .part-1 aside {text-align:center; line-height:1 !important; font-size:0; width:300px; margin:10px auto 0;}
	footer .part-1 aside li {display:inline-block;}
	footer .part-1 aside li+li a {margin-left:10px;}
	footer .part-1 aside li a {display:block; padding:10px 30px; font-size:12px; font-weight:400; line-height:1; background:#fff; border-radius:50px; border:1px solid #e5e5e5;}
	footer .part-1 aside li a:hover {color:#fff; background:#3366cc; border:1px solid #3366cc;}
	footer .part-1 aside li a.i-admin {padding-left:50px; background:#fff url(../images/common/i-admin.png)no-repeat 20px center;}
	footer .part-1 aside li a.i-admin:hover {background-color:#3366cc; background-image:url(../images/common/i-admin-on.png);}
	
	footer .part-2 {text-align:center; margin-top:20px; padding-top:20px; border-top:1px solid #efefef;}
	footer .part-2 .logo {font-size:18px; font-weight:400; color:#000; line-height:1.2;}
	footer .part-2 .logo img {height:30px;}
	footer .part-2 .info address p {font-size:14px; color:#666; margin-top:10px;}
	footer .part-2 .info address p span {padding:0 5px;}
	footer .part-2 .info address p span:nth-child(1) {display:block;}
}