@charset "utf-8";


/* 전체 */
#wrapper { overflow:hidden; position:relative; }

@media screen and (max-width:1040px) {
	#wrapper { padding-top:38px }
	.layer_ppopp { top:0 !important; left:0 !important; width:50% !important; }
	.layer_ppopp img { max-width:100% !important; width:100% !important; height:auto !important }
	.layer_ppopp:nth-child(2n) { left:auto !important; right:0 !important }
}

@media screen and (max-width:480px) {
	.layer_ppopp { width:100% !important; }
}

/* 페이징로딩 */
#page_loading {position:fixed; top:0; left:0; width:100%; height:100%; background:#fff; z-index:9999999}
#page_loading > .inner {display:table; width:100%; height:100%}
.load {display:table-cell; margin:auto; width:100px; text-align:center; font-size:0; vertical-align:middle;}
.load > div {display:inline-block; width:100px; height:56px; background:url('../images/main/loading.png') no-repeat; -webkit-animation:loadingAni 1.2s infinite ease-in-out; animation:loadingAni 1.2s infinite ease-in-out;}
@-webkit-keyframes loadingAni {
  0% { -webkit-transform: perspective(120px) }
  50% { -webkit-transform: perspective(120px) rotateY(180deg) }
  100% { -webkit-transform: perspective(120px) rotateY(180deg)  rotateX(180deg) }
}
@keyframes loadingAni {
  0% { 
    transform: perspective(120px) rotateX(0deg) rotateY(0deg);
    -webkit-transform: perspective(120px) rotateX(0deg) rotateY(0deg) 
  } 50% { 
    transform: perspective(120px) rotateX(0deg) rotateY(-180.1deg);
    -webkit-transform: perspective(120px) rotateX(0deg) rotateY(-180.1deg) 
  } 100% { 
    transform: perspective(120px) rotateX(-180deg) rotateY(-179.9deg);
    -webkit-transform: perspective(120px) rotateX(-180deg) rotateY(-179.9deg);
  }
}
@keyframes ldio-3tdaxp6oxhk {
  0% { transform: translate(-50%,-50%) rotate(0deg); -webkit-transform: translate(-50%,-50%) rotate(0deg);}
  100% { transform: translate(-50%,-50%) rotate(360deg); -webkit-transform: translate(-50%,-50%) rotate(360deg);}
}
.ldio-3tdaxp6oxhk div {
  position: absolute;
  width:50px;
  height:50px;
  border:10px solid #166adc;
  border-top-color: transparent;
  border-radius:50%;
}
.ldio-3tdaxp6oxhk div {
  animation: ldio-3tdaxp6oxhk 1s linear infinite;
  -webkit-animation: ldio-3tdaxp6oxhk 1s linear infinite;
  top: 100px;
  left: 100px
}
.loadingio-spinner-rolling-t79bvdgxqce {
  width:200px;
  height:200px;
  position:absolute;
  top:50%;
  left:50%;
  transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
  display: inline-block;
  overflow: hidden;
  background:#ffffff;
}
.ldio-3tdaxp6oxhk {
  width: 100%;
  height: 100%;
  position: relative;
  transform: translateZ(0) scale(1);
  -webkit-transform: translateZ(0) scale(1);
  backface-visibility: hidden;
  transform-origin: 0 0; /* see note above */
  -webkit-transform-origin: 0 0;
}
.ldio-3tdaxp6oxhk div { box-sizing: content-box; -webkit-box-sizing: content-box;}
/* generated by https://loading.io/ */

/* ===================================================================== */

/* 메인 비주얼 텍스트 */
#main_slider_benner {
	width:100%;
	height:100vh;
	margin:0 auto;
	position:relative;
	overflow:hidden;
}
#main_slider_benner {
	width:100%;
}
#main_slider_benner li {
	position:relative;
}
#main_slider_benner .main_visualImg {
	width:100%;
	height:100vh;
}


/* 텍스트 박스 */
.main_visualText {
	width:100%;
	max-width:var(--max-width);
	margin:0 auto;
	font-family: 'GmarketSansBold';
	position:absolute;
	left:50%;
	top:300px;
	transform: translate(-50%, 0);
}
.main_visualText.center {
	text-align:center;
}
.main_visualText.right {
	text-align:right;
}
.main_visualText h2 {
	line-height:1;
	color:#fff;
	font-size:73px;
	font-family: 'GmarketSansLight';
	word-break:keep-all;
	letter-spacing:-1px;
	padding-bottom:15px;
}
.main_visualText h3 {
	line-height:1;
	color:#fff;
	font-size:73px;
	word-break:keep-all;
	letter-spacing:-1px;
	padding-bottom:15px;
}
.main_visualText p {
	line-height:1.4;
	font-size:18px;
	color:rgba(255,255,255,0.7);
	word-break:keep-all;
}
.main_visualText.center {
	font-family: 'GmarketSansLight';
}
.main_visualText.center h2 {
	font-family: 'GmarketSansBold';
}
.main_visualText.right {
	font-family: 'GmarketSansLight';
}
.main_visualText.right h2 {
	font-family: 'GmarketSansBold';
}


.slick-dots {
  width: 100%;
  text-align: center;
  position: absolute;
  bottom:100px;
  padding: 0;
}

.slick-dots li {
  position: relative;
  display: inline-block;
  width: 65px;
  height: 8px;
  /*margin: 1px;*/
  padding: 0;
  cursor: pointer;
}

.slick-dots li button {
  font-size: 0;
  line-height: 0;
  display: block;
  width: 60px;
  height: 8px;
  padding: 0;
  cursor: pointer;
  border: 0;
  outline: 0;
  background:rgba(255,255,255,0.5);
}

.slick-dots li.slick-active button {
  width: 60px;
  height: 8px;
  background:rgba(255,255,255,1);
}

@media (max-width:1279px) {
	#main_slider_benner {
		height:70vh;
	}
	#main_slider_benner .main_visualImg {
		height:70vh;
	}
	.main_visualText {
		max-width:var(--max-width-l);
		top:180px;
	}
	
	.slick-dots {
	  position: absolute;
	  bottom:40px;
	}

}
@media screen and (max-width:1139px) {
	#main_slider_benner {
		height:540px;
	}
	#main_slider_benner .main_visualImg {
		height:540px;
	}
	.main_visualText {
		max-width:var(--max-width-m);
		top:160px;
	}
	.main_visualText h2 {
		font-size:56px;
		padding-bottom:10px;
	}
	.main_visualText h3 {
		font-size:56px;
		padding-bottom:10px;
	}
	.main_visualText p {
		line-height:1.4;
		font-size:15px;
	}
}
@media screen and (max-width:1023px) {
	#main_slider_benner {
		height:450px;
	}
	#main_slider_benner .main_visualImg {
		height:450px;
	}
	.main_visualText {
		max-width:var(--max-width-s);
		top:140px;
	}
	.main_visualText h2 {
		font-size:34px;
	}
	.main_visualText h3 {
		font-size:34px;
	}
}
@media screen and (max-width:480px) {
	#main_slider_benner {
		height:280px;
	}
	#main_slider_benner .main_visualImg {
		height:280px;
	}
	#main_slider_benner img {
		width:auto;
		height:280px;
	}
	.main_visualText {
		max-width:var(--max-width-xs);
		top:100px;
	}	
	.main_visualText h2 {
		font-size:20px;
	}
	.main_visualText h3 {
		font-size:20px;
	}
	.main_visualText p {
		line-height:1.4;
		font-size:13px;
	}
	
	.slick-dots {
	  position: absolute;
	  bottom:30px;
	}
	.slick-dots li {
	  width: 45px;
	  height: 5px;
	}
	.slick-dots li button {
	  width: 40px;
	  height: 5px;
	}
	.slick-dots li.slick-active button {
	  width: 40px;
	  height: 5px;
	}
}


/* ===================================================================== */

.mainTitle {
	width:100%;
	text-align:center;
	margin-bottom:80px;
	color:#000;
}
.mainTitle.left {
	text-align:left;
}
.mainTitle h2 {
	line-height:1.5;
	font-size:36px;
}
.mainTitle p {
    font-family: 'GmarketSansLight';
	font-size:16px;
	color:#a0a0a0;
}

@media (max-width:1370px) {
}
@media (max-width:1279px) {
}
@media screen and (max-width:1139px) {
}
@media screen and (max-width:1023px) {
	.mainTitle {
		margin-bottom:50px;
	}
}
@media screen and (max-width:480px) {
	.mainTitle {
		margin-bottom:30px;
	}
	.mainTitle h2 {
		font-size:24px;
	}
	.mainTitle p {
		font-size:13px;
	}
}



/* rnd */
.mRnd {
	width:var(--max-width);
	margin:120px auto;
	overflow:hidden;
}
.mRnd ul {
	width:100%;
	display:flex;
	flex-wrap:wrap;
}
.mRnd li {
	width:20%;
	text-align:center;
}
.mRnd li a {
	display:block;
}
.mRnd li p {
	position:relative;
}
.mRnd li p > img {
	margin-bottom:40px;
}
.mRnd li p > span {
	width:60px;
	height:60px;
	line-height:60px;
	text-align:center;
	background-color:#f5f5f5;
	position:absolute;
	right:0;
	bottom:0;
	overflow:hidden;
	display:block;
}
.mRnd li p > span em {
	color:#fff;
	padding-left:10px;
	font-style:normal;
	display:none;
}
.mRnd li p > span i {
	width:60px;
	height:60px;
	line-height:60px;
	color:#575757;
	display:inline-block;
	float:right;
}
.mRnd li p:hover > span {
	width:160px;
	background-color:#2d5497;
}
.mRnd li p:hover > span em {
	display:inline-block;
}
.mRnd li p:hover > span i {
	color:#fff;
}
.mRnd li h3 {
	line-height:1.5;
	color:#1e1e1e;
	font-size:22px;
	padding-bottom:10px;
	word-break:keep-all;
	font-family:"GmarketSansBold";
}
.mRnd li h4 {
	color:#b7b7b7;
	font-size:14px;
	word-break:keep-all;
}

@media (max-width:1370px) {
}
@media (max-width:1279px) {
	.mRnd {
		max-width:var(--max-width-l);
	}
}
@media screen and (max-width:1139px) {
	.mRnd {
		max-width:var(--max-width-m);
	}
}
@media screen and (max-width:1023px) {
	.mRnd {
		max-width:var(--max-width-s);
		margin:80px auto;
	}
	.mRnd li {
		width:50%;
		margin-bottom:50px;
	}
	.mRnd li:nth-child(3) {
	}
	.mRnd li:nth-child(4) {
	}
	.mRnd li p > img {
		width:40%;
		min-width:130px;
		margin-bottom:20px;
	}
	.mRnd li h3 {
		font-size:17px;
		padding-bottom:6px;
		font-family:"GmarketSansMedium";
	}
	.mRnd li h4 {
		line-height:1.3;
		font-size:12px;
	}
}
@media screen and (max-width:480px) {
	.mRnd {
		max-width:var(--max-width-xs);
		margin:40px auto 10px;
	}	
	.mRnd li p > img {
		width:70%;
	}
	.mRnd li h3 {
		font-size:15px;
	}
}



/* service */
.local_creator {
	width:100%;
    margin:120px auto;
	padding:120px 0;
	background:#e6fbff;
	overflow:hidden;
}
.local_creator .mBusiness {
	width:var(--max-width);
	margin:30px auto 0;
}
.businessWrap {
	height:500px;
	display:flex;
	gap:50px;
	margin-bottom:80px;
	overflow:hidden;
}
.businessWrap:last-child {
	margin-bottom:0px;
}
.businessWrap .mBusinessImg {
	width:50%;
	height:500px;
	background-size:cover;
}
.businessWrap .mBusinessTxt {
	width:50%;
	padding:90px 0;
}
.businessWrap .mBusinessTxt p {
	color:#606060;
	font-size:17px;
	padding-bottom:50px;
}
.businessWrap .mBusinessTxt p span {
	color:#092d74;
	font-family:"GmarketSansBold";
}
.businessWrap .mBusinessTxt h3 {
	color:#00aad0;
	font-size:28px;
	font-family:"GmarketSansBold";
	padding-bottom:30px;
}
.businessWrap .mBusinessTxt h4 {
	color:#b7b7b7;
	font-size:18px;
	padding-bottom:60px;
}
.businessWrap .mBusinessTxt a {
	line-height:50px;
	padding:0 20px;
	color:#1d1d1d;
	font-size:15px;
	background-color:#fff;
	border:3px solid #000;
	display:inline-block;
}
.businessWrap .mBusinessTxt a i {
	padding-left:40px;
}
.businessWrap .mBusinessTxt a:hover {
	background-color:#224087;
	border:3px solid #17347b;
	color:#fff;
}
.businessWrap .mBusinessTxt a:active {
	background-color:#fff;
	border:3px solid #000;	
	color:#1d1d1d;
}


@media (max-width:1370px) {
}
@media (max-width:1279px) {
	.mBusiness {
		max-width:var(--max-width-l);
	}
}
@media screen and (max-width:1139px) {
	.local_creator {
		margin:80px auto;
	}
	.mBusiness {
		max-width:var(--max-width-m);
	}
}
@media screen and (max-width:1023px) {
	.local_creator {
		margin:80px auto;
		padding:80px 0;
	}
	.mBusiness {
		max-width:var(--max-width-s);
	}
	.businessWrap {
		height:auto;
		margin-bottom:100px;
		display:block;
	}
	.businessWrap .mBusinessImg {
		width:100%;
		height:500px;
		margin-bottom:50px;
	}
	.businessWrap .mBusinessTxt {
		width:100%;
		padding:0px;
		margin-bottom:50px;
	}
}
@media screen and (max-width:480px) {
	.local_creator {
		margin:40px auto;
		padding:40px 0;
	}
	.mBusiness {
		max-width:var(--max-width-xs);
	}	
	.businessWrap {
		margin-bottom:40px;
	}
	.businessWrap:last-child {
		margin-bottom:0px;
	}
	.businessWrap .mBusinessImg {
		height:260px;
		margin-bottom:30px;
	}
	.businessWrap .mBusinessTxt p {
		font-size:14px;
		padding-bottom:20px;
	}
	.businessWrap .mBusinessTxt h3 {
		line-height:1.3;
		font-size:20px;
		font-family:"GmarketSansMedium";
		padding-bottom:20px;
	}
	.businessWrap .mBusinessTxt h4 {
		font-size:14px;
		padding-bottom:30px;
	}
	.businessWrap .mBusinessTxt a {
		line-height:40px;
		padding:0 20px;
		font-size:14px;
	}
}




/* ===================================================================== */

/* 버튼 스타일 */
.bg-light { background:#f2f2f2; }
.culture_btn {
	line-height:60px;
	text-align:center;
	color:#fff!important;
	display:block;
	position:absolute;
	left:30px;
	right:30px;
	bottom:30px;
}
.btn_style01 {
	background:#d7006e;
}
.btn_style02 {
	background:#01bab3;
}
.btn_style03 {
	background:#fea30c;
}


/* 공지사항 & 언론보도 */
.noticePress {
	width:var(--max-width);
	margin:120px auto;
	overflow:hidden;
}
.mNotice {
	width:calc(50% - 25px);
	overflow:hidden;
	float:left;
}
.mNoticeTit {
	width:100%;
	padding-bottom:10px;
	display:flex;
	overflow:hidden;
}
.mNoticeTit h3 {
	width:70%;
	line-height:25px;
	font-size:23px;
	color:#000;
}
.mNoticeTit a {
	width:30%;
	line-height:25px;
	font-size:14px;
	text-decoration:underline;
	text-align:right;
	display:inline-block;
}
.mNotice .mNoticeBox {
	width:100%;
	min-height:280px;
}
.mNoticeBox {
	width:600px;
	float:right;
}
.mNoticeBox ul {
	border:1px solid #e1e1e1;
	padding:0;
}
.mNoticeBox ul li {
	line-height:70px;
	border-bottom:1px solid #e1e1e1;
	overflow:hidden;
}
.mNoticeBox ul li:last-child {
	border-bottom:0;
}
.mNoticeBox ul li.noneData {
	line-height:280px;
	background:#fff;
	text-align:center;
	font-size:16px;
}
.mNoticeBox ul li a {
	height:70px;
	line-height:70px;
	padding:0 25px;
	display:block;
}
.mNoticeBox ul li a em {
	width:calc(100% - 100px);
	color:#4b4b4b;
	font-size:16px;
	font-style:normal;
	text-overflow: ellipsis; 
	white-space: nowrap;
	overflow: hidden;	
	display:block;
	float:left;
}
.mNoticeBox ul li a span {
	width:100px;
	color:#a2a2a2;
	font-size:15px;
	text-align:right;
    font-family: 'GmarketSansLight';
	display:block;
	float:right;
}
.mNoticeBox ul li a:hover {
	background-color:#273e84;
}
.mNoticeBox ul li a:hover em {
	color:#fff;
}
.mNoticeBox ul li a:hover span {
	color:#fff;
}



.mPress {
	width:calc(50% - 25px);
	overflow:hidden;
	float:right;
}
.mPressTit {
	width:100%;
	padding-bottom:10px;
	display:flex;
	overflow:hidden;
}
.mPressTit h3 {
	width:70%;
	line-height:25px;
	font-size:23px;
	color:#000;
}
.mPressTit a {
	width:30%;
	line-height:25px;
	font-size:14px;
	text-decoration:underline;
	text-align:right;
	display:inline-block;
}
.mPress .mPressBox {
	width:100%;
	min-height:280px;
}
.mPressBox {
	width:600px;
	float:right;
}
.mPressBox ul {
	border:1px solid #e1e1e1;
	padding:0;
}
.mPressBox ul li {
	border-bottom:1px solid #e1e1e1;
	overflow:hidden;
}
.mPressBox ul li:last-child {
	border-bottom:0;
}
.mPressBox ul li.noneData {
	line-height:280px;
	background:#fff;
	text-align:center;
	font-size:16px;
}
.mPressBox ul li a {
	height:70px;
	line-height:70px;
	padding:0 25px;
	display:block;
}
.mPressBox ul li a em {
	width:calc(100% - 100px);
	color:#4b4b4b;
	font-size:16px;
	font-style:normal;
	text-overflow: ellipsis; 
	white-space: nowrap;
	overflow: hidden;	
	display:block;
	float:left;
}
.mPressBox ul li a span {
	width:100px;
	color:#a2a2a2;
	font-size:15px;
	text-align:right;
    font-family: 'GmarketSansLight';
	display:block;
	float:right;
}
.mPressBox ul li:hover a {
	background-color:#22943a;
}
.mPressBox ul li:hover a em {
	color:#fff;
}
.mPressBox ul li:hover a span {
	color:#fff;
}



@media (max-width:1370px) {
}
@media (max-width:1279px) {
	.noticePress {
		max-width:var(--max-width-l);
	}
}
@media screen and (max-width:1139px) {
	.noticePress {
		max-width:var(--max-width-m);
	}
}
@media screen and (max-width:1023px) {
	.noticePress {
		max-width:var(--max-width-s);
		margin:80px auto;
	}
}
@media screen and (max-width:480px) {
	.noticePress {
		max-width:var(--max-width-xs);
		margin:40px auto;
	}	
	.mNotice {
		width:100%;
		float:none;
	}
	.mNoticeTit h3 {
		width:50%;
		font-size:18px;
	}
	.mNoticeTit a {
		width:50%;
		font-size:13px;
	}
	.mNotice .mNoticeBox {
		min-height:200px;
	}
	.mNoticeBox ul li a {
		height:50px;
		line-height:50px;
		padding:0 15px;
	}
	.mNoticeBox ul li.noneData {
		line-height:200px;
		font-size:15px;
	}
	.mPress {
		width:100%;
		float:none;	
		margin-top:40px;
	}
	.mPressTit h3 {
		width:50%;
		font-size:18px;
	}
	.mPressTit a {
		width:50%;
		font-size:13px;
	}
	.mPress .mPressBox {
		min-height:200px;
	}
	.mPressBox ul li a {
		height:50px;
		line-height:50px;
		padding:0 15px;
	}
	.mPressBox ul li.noneData {
		line-height:200px;
		font-size:15px;
	}
}