@charset "UTF-8";


@keyframes more-arrow {
	0% {transform: translateY(0px);}
	100% {transform: translateY(8px);}
}


/* ============================
	animation css start
============================ */
@keyframes spin {
	from {
		-webkit-transform: rotate(0deg);
		-moz-transform: rotate(0deg);
		-ms-transform: rotate(0deg);
		-o-transform: rotate(0deg);
		transform: rotate(0deg);
		opacity: 0.2;
	}

	to {
		-webkit-transform: rotate(360deg);
		-moz-transform: rotate(360deg);
		-ms-transform: rotate(360deg);
		-o-transform: rotate(360deg);
		transform: rotate(360deg);
		opacity: 1;
	}
}

@keyframes scroll {
	0% {
		opacity: .8;
		-webkit-transform: translateY(0px);
		-moz-transform: translateY(0px);
		-ms-transform: translateY(0px);
		-o-transform: translateY(0px);
		transform: translateY(0px);
	}

	50% {
		opacity: 1;
		-webkit-transform: translateY(20px);
		-moz-transform: translateY(20px);
		-ms-transform: translateY(20px);
		-o-transform: translateY(20px);
		transform: translateY(20px);
	}

	100% {
		opacity: .8;
		-webkit-transform: translateY(0px);
		-moz-transform: translateY(0px);
		-ms-transform: translateY(0px);
		-o-transform: translateY(0px);
		transform: translateY(0px);
	}
}

.slideLeft {
    animation-name: slideLeft;
    -webkit-animation-name: slideLeft;
    animation-duration: 5s;
    -webkit-animation-duration: 5s;
    animation-timing-function: ease-in-out;
    -webkit-animation-timing-function: ease-in-out;
    visibility: visible !important;
    animation-count: 1;
    animation-delay: 3s;
  }
  
  @keyframes slideLeft {
    0% {
      transform: translateX(150%);
    }
    50% {
      transform: translateX(-8%);
    }
    100% {
      transform: translateX(0%);
    }
  }
  
  @-webkit-keyframes slideLeft {
    0% {
      -webkit-transform: translateX(150%);
    }
    50% {
      -webkit-transform: translateX(-8%);
    }
    100% {
      -webkit-transform: translateX(0%);
    }
  }

  .slideRight {
    animation-name: slideRight;
    -webkit-animation-name: slideRight;
    animation-duration: 5s;
    -webkit-animation-duration: 5s;
    animation-timing-function: ease-in-out;
    -webkit-animation-timing-function: ease-in-out;
    visibility: visible !important;
    animation-count: 1;
    animation-delay: 3s;
  }
  
  @keyframes slideRight {
    0% {
      transform: translateX(-150%);
    }
    50% {
      transform: translateX(8%);
    }
    100% {
      transform: translateX(0%);
    }
  }
  
  @-webkit-keyframes slideRight {
    0% {
      -webkit-transform: translateX(-150%);
    }
    50% {
      -webkit-transform: translateX(8%);
    }
    100% {
      -webkit-transform: translateX(0%);
    }
  }

[data-scroll] {
    opacity: 0;
    will-change: transform, scale, opacity;
    transform: translateY(8rem) scale(1);
    transition: all 1s cubic-bezier(0.165, 0.84, 0.44, 1);
}

[data-scroll='in'] {
    opacity: 1;
    transform: translateY(0) scale(1);
}

[data-scroll='out'] {
    opacity: 0;
}

@keyframes typing {
    from {
        width: 0;
    }
}

@keyframes blink {
    from {
        border-color: transparent;
    }
}

.ani-fade {
	opacity: .8;
	-webkit-transform: scale(0.9);
	transform: scale(0.9);
	-webkit-transition: all .6s;
	transition: all .6s;
}

.ani-up-slide {
	opacity: 0;
	position: relative;
	bottom: -100px;
	-webkit-transition: all .6s;
	transition: all .6s;
}

.ani-down-slide {
	opacity: 0;
	position: relative;
	top: -100px;
	-webkit-transition: all .6s;
	transition: all .6s;
}

.ani-left-slide {
	opacity: 0;
	position: relative;
	left: -100px;
	-webkit-transition: all .6s;
	transition: all .6s;
}

.ani-right-slide {
	opacity: 0;
	position: relative;
	right: -100px;
	-webkit-transition: all .6s;
	transition: all .6s;
}

.fade-in {
	opacity: 1;
	-webkit-transform: scale(1);
	transform: scale(1);
}

.slide-up {
	opacity: 1;
	bottom: 0;
}

.slide-down {
	opacity: 1;
	top: 0;
}

.slide-left {
	opacity: 1;
	left: 0;
}

.slide-right {
	opacity: 1;
	right: 0;
}


/*
	공통요소
*/
body {
	min-width: 1330px;
	max-width: 1920px;
	margin: 0 auto !important;
}
.none {
	display: none !important;
}
.font-nexon {
	font-family: 'NEXON Lv2 Gothic';
}
.mb-show {
	display: none !important;
}

.mb-hide {
	display: initial !important;
}

.mb-flex {
	display: none !important;
}

.mb-table {
    display: none !important;
}

.pc-table {
    display: inline-table !important;
}

.pc-flex {
    display: flex !important;
}

.fw-500 {
    font-weight: 500 !important;
}

.inner {
	width: 100%;
	max-width: 1360px;
	padding:0 30px;
	margin:0 auto;
	box-sizing: border-box;
}
.img-box {
	text-align: center;
}

.img-box img {
	max-width: 100%;
}
.contents {
	padding:140px 0;
}
.contents.no-top-pad {
	padding-top: 0;
}

.contents.half-top-pad {
	padding-top: 60px;
}

.contents.no-bottom-pad {
	padding-bottom: 0;
}

.contents.half-bottom-pad {
	padding-bottom: 60px;
}
.half-cont {
	display: flex;
}
.half-cont.middle {
	align-items: center;
}
.half-cont > div {
	width: 50%;
}
.half-cont > div .fz21 {
	font-size: 21px;
}
.half-cont > div .line-H-2 {
	line-height: 2;
}

.form-control {
	display: block;
	width: 100%;
	height: 35px;
	/* margin-bottom: 8px; */
	padding: 5px 15px;
	font-size: 14px;
	/* line-height: 45px; */
	text-align: left;
	color: #444;
	background-image: none;
	border: 1px solid #ccc;
	outline: none;
	box-sizing: border-box;
	box-shadow: none;
	-webkit-transition: border-color ease-in-out 0.15s, -webkit-box-shadow ease-in-out 0.15s;
	-o-transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
	transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
	vertical-align: middle;
}


.square-list {
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
}

.square-list li {
	position: relative;
	/* display: flex; */
	padding:50px 0;
	font-size: 20px;
	line-height: 1.5;
	text-align: center;
	letter-spacing: -1.6px;
	border: 14px solid #ececec;
	box-sizing: border-box;
	background-color: #fff;
}
.square-list.n4 {
	width: calc(100% + 14px);
	margin-left: -7px;
}
.square-list.n4 li {
	width: calc(25% - 14px);
	/* padding: 65px 0; */
	margin: 7px 7px;
	text-align: center;
}
.square-list.n4 li p {
	margin-bottom: 34px;
	font-size: 24px;
	font-weight: 500;
	line-height: 1.42;
	letter-spacing: -1.8px;
}
.square-list.n4 li span {
	display: block;
	font-size: 16px;
	line-height: 1.55;
	letter-spacing: -1.2px;
}

.square-list2 {
	display: flex;
	/* align-items: center; */
	/* justify-content: center; */
	flex-wrap: wrap;
}

.square-list2 li {
	position: relative;
	display: flex;
	padding:80px 0;
	font-size: 20px;
	line-height: 1.5;
	text-align: center;
	letter-spacing: -1.6px;
	box-sizing: border-box;
	background-color: #fff;
}
.square-list2 li.bg-gray {
	background-color: #f6f6f6;
}

.square-list2.n4 {
	width: calc(100% + 12px);
	margin-left: -6px;
}

.square-list2.n4 li {
	flex-flow: column;
	width: calc(25% - 12px);
	padding: 65px 0;
	margin: 15px 6px;
	text-align: center;
}

.square-list2.n4 li img {
	margin-bottom: 20px;
}

.square-list2.n4 li p {
	margin-bottom: 15px;
	font-size: 22px;
	font-weight: 500;
	line-height: 1.27;
	letter-spacing: -1.65px;
}

.square-list2.n4 li span {
	display: inline-block;
	font-size: 18px;
	font-weight: 300;
	line-height: 1.5;
	letter-spacing: -1.35px;
}

.square-list2.n3 {
	width: calc(100% + 58px);
	margin-left: -29px;
}

.square-list2.n3 li {
	flex-flow: column;
	width: calc(33.33% - 58px);
	margin: 15px 29px;
	text-align: center;
	border: none;
}

.square-list2.n3 li .img {
	margin-bottom: 28px;
}

.square-list2.n3 li p {
	font-size: 20px;
	font-weight: bold;
	line-height: 1;
}

.square-list2.n3 li span {
	margin-top: 67px;
	font-size: 18px;
	line-height: 2.06;
	letter-spacing: -1.35px;
}


/*
	Ham botton
*/
.menu-button {
	position: relative;
	padding: 15px;
	margin-left: auto;
	cursor: pointer;
	-webkit-transition: .3s;
	transition: .3s;
	z-index: 10001;
}

.menu-button .bar {
	position: relative;
	display: block;
	width: 34px;
	height: 3px;
	margin: 5px auto;
	background-color: #fff;
	-webkit-transition: .3s;
	transition: .3s;
}

.menu-button .bar:nth-of-type(1) {
	margin-top: 0px;
}
.menu-button .bar:nth-of-type(2) {
	opacity: 0;
}
.menu-button .bar:nth-of-type(3) {
	margin-bottom: 0px;
}

.menu-button.cross .bar:nth-of-type(1) {
	-webkit-transform: translateY(8px) rotate(-45deg);
	-ms-transform: translateY(8px) rotate(-45deg);
	transform: translateY(8px) rotate(-45deg);
}

.menu-button.cross .bar:nth-of-type(2) {
	opacity: 0;
}

.menu-button.cross .bar:nth-of-type(3) {
	-webkit-transform: translateY(-8px) rotate(45deg);
	-ms-transform: translateY(-8px) rotate(45deg);
	transform: translateY(-8px) rotate(45deg);
}

.menu-button.cross .bar {
	background-color: #333;
}


#top {
	display: block;
	position: fixed;
	right: 30px;
	bottom: 30px;
	width: 52px;
	height: 52px;
	padding:6px 0;
	line-height: 1;
	text-align: center;
	border:2px solid #333;
	box-sizing: border-box;
	background-color: #fff;
	z-index: 9990;
}
#top span {
	display: inline-block;
	padding:0 3px;
	font-family: 'NEXON Lv2 Gothic';
	font-size: 15px;
	font-weight: bold;
	line-height: 1;
	text-align: center;
	color: #333333;
	transition: all 0.5s;
}
#top:hover {
	display: flex !important;
	align-items: center;
	justify-content: center;
}
#top:hover span {
	padding: 0;
	transition: all 0.5s;
}
#top:hover br {
	display: none;
}

/* 
	Quick
*/
#quick {
	display: flex;
	align-items: flex-end;
	flex-flow: column;
	position: fixed;
	right: 30px;
	bottom: 80px;
	min-width: 52px;
	max-width: 160px;
	/* transform: translateY(-50%); */
	z-index: 8000;
}
#quick a {
	overflow: hidden;
	display: block;
	width: 52px;
	height: 52px;
	margin-top: -2px;
	/* border: 1px solid #ddd; */
	box-sizing: border-box;
	background-color: #fff;
	transition: width 0.4s;
}
#quick a i {
	display: inline-block;
	height: 100%;
	padding-left: 52px;
	background-repeat: no-repeat;
	background-position: center;
	box-sizing: border-box;
	vertical-align: middle;
}
#quick a span {
	overflow: hidden;
	display: none;
	margin-top: -2px;
	color: #333;
	font-size: 16px;
	font-weight: 400;
	font-family: 'Noto Sans kr';
	white-space: nowrap;
	vertical-align: middle;
}
#quick a.icon1 i {
	background-image: url("/resource/images/quick-01.png");
}
#quick a.icon2 i {
	background-image: url("/resource/images/quick-02.png");
}
#quick a:hover {
	width: 160px;
	background-color: #333;
}
#quick a.icon1:hover i {
	background-image: url("/resource/images/quick-01_on.png");
}
#quick a.icon2:hover i {
	background-image: url("/resource/images/quick-02_on.png");
}
#quick a:hover span {
	display: inline-block;
	padding-left: 10px;
	color:#fff;
	line-height: 50px;
}


header {
	display: flex;
	justify-content: space-between;
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	padding:45px 70px;
	box-sizing: border-box;
	z-index: 9999;
	align-items: center;
}
header .logo .fixed {
	display: none;
}
header .h-phone {
	position: absolute;
	top:50%;
	right:160px;
	color:#fff;
	font-size: 20px;
	transform: translateY(-50%);
}

header .h-go-maintain {
	position: absolute;
	top: 50%;
	right: 396px;
	color: #fff;
	font-size: 20px;
	transform: translateY(-50%);
}

header nav {
	display: none;
	position: fixed;
	top: 0;
	bottom: 0;
	right: 0;
	left: 0;
	background-color: #fff;
}
header #gnb {
	display: flex;
	align-items: center;
	width: 100%;
	height: 100%;
	max-width: 1000px;
	margin:0 auto;
}
header #gnb > div {
	display: flex;
	flex-flow: column;
	justify-content: center;
	width: 100%;
}
header #gnb .menu {
	width: 260px;
	background-color: #fff;
}
header #gnb .menu > li {
	overflow: hidden;
	position: relative;
	margin:28px 0;
}
header #gnb .menu > li > a {
	display: block;
	font-size: 50px;
	font-weight: bold;
	line-height: 1.2;
	color: #333333;
}
header #gnb .menu > li:hover {
	overflow: visible;
}
header #gnb .menu > li:hover > a {
	color:#fff;
	text-shadow: -1px 0 #333, 0 1px #333, 1px 0 #333, 0 -1px #333;
}
header #gnb .menu > li:hover .sub-menu {
	width: 200px;
	height: auto;
	left:99%;
	opacity: 1;
}
header #gnb .sub-menu {
	overflow: hidden;
	position: absolute;
	left: 200px;
	top: 20px;
	width: 0;
	height: 0;
	opacity: 0;
	transition: all 0.4s;
}
header #gnb .sub-menu li {
	margin-bottom: 10px;
}
header #gnb .sub-menu li a {
	font-family: 'NEXON Lv2 Gothic';
	font-size: 25px;
	font-weight: bold;
	line-height: 1.2;
	color: #c0c0c0;
	word-break: keep-all;
	white-space: nowrap;
}
header #gnb .sub-menu li:hover a {
	color:#333;
}
header #gnb .channel {
	display: flex;
	justify-content: space-between;
	align-items: flex-end;
	margin-top: 149px;
}
header #gnb .channel .sns .tit {
	margin-bottom: 30px;
	font-size: 18px;
	font-weight: bold;
	color: #a8a8a8;
}
header #gnb .channel .sns ul {
	display: flex;
}
header #gnb .channel .sns ul li {
	margin-right: 40px;
	line-height: 1;
}
header #gnb .channel .sns ul li a {
	font-size: 25px;
	font-weight: bold;
	line-height: 1;
	color: #333333;
}

header.active {
	padding:15px 70px;
	border-bottom: 1px solid #ddd;
	background-color: #fff;
}
header.active .h-phone {
	color:#333;
}
header.active .h-go-maintain {
	color: #333;
}
header.active .logo .static {
	display: none;
}
header.active .logo .fixed {
	display: inline-block;
}
header.active .menu-button .bar {
	background-color: #333;
}


footer {
	margin-top: 120px;
	padding:44px 0;
	font-family: 'NEXON Lv2 Gothic';
	font-size: 13px;
	line-height: 2;
	text-align: center;
	border-top: 1px solid #ddd;
}


#container {
	overflow: hidden;
}

#main-bnnr {
	overflow: hidden;
	position: relative;
	max-height: 715px;
}
#main-bnnr > img {
	position: relative;
	top: 0;
	left: 50%;
	margin-left: -960px;
	transform: scale(1.2);
	transition: all 2s;
}
#main-bnnr.on > img {
	transform: scale(1);
	transition: all 3s;
}
#main-bnnr.on .inner p {
	transform: translateY(0);
	opacity: 1;
}
#main-bnnr.on .inner h2 {
	transform: translateY(0);
	opacity: 1;
}
#main-bnnr.on .inner ul {
	transform: translateY(0);
	opacity: 1;
}
#main-bnnr .side-menu {
	position: absolute;
	top: 50%;
	left: 70px;
	transform: rotate(-90deg) translateX(-50%);
	transform-origin: left;
	z-index: 100;
}
#main-bnnr .side-menu li {
	display: inline-block;
	margin:0 10px;
}
#main-bnnr .inner {
	position: absolute;
	top: 50%;
	left: 50%;
	max-width: 1300px;
	width: 100%;
	text-align: center;
	transform: translate(-50%,-50%);
}
#main-bnnr .inner p {
	margin-bottom: 30px;
	color:#fff;
	font-family: 'NEXON Lv2 Gothic';
	font-size: 30px;
	font-weight: 400;
	letter-spacing: 5px; 
	transform: translateY(50%);
	transition: all 1s;
	opacity: 0;
}
#main-bnnr .inner h2 {
	color:#fff;
	font-size: 50px;
	font-weight: 500;
	transform: translateY(50%);
	transition: all 1s;
	opacity: 0;
}
#main-bnnr .inner h2 span {
	display: block;
	color:rgba(0,0,0,0);
	-webkit-text-stroke: 1px #ffffff;
}
#main-bnnr .inner ul {
	margin-top: 89px;
	transform: translateY(50%);
	transition: all 1s;
	transition-delay: 0.5s;
	opacity: 0;
}
#main-bnnr .inner ul li {
	position: relative;
	display: inline-block;
	padding:0 25px;
}
#main-bnnr .inner ul li:after {
	position: absolute;
	top: 50%;
	left: 100%;
	width: 1px;
	height: 80%;
	transform: translateY(-50%);
	background-color: #fff;
	content:'';
}
#main-bnnr .inner ul li:last-of-type:after {
	display: none;
}
#main-bnnr .inner ul li a {
	display: inline-block;
	font-family: 'NEXON Lv2 Gothic';
	font-size: 11px;
	font-weight: bold;
	line-height: 1.55;
	letter-spacing: 3.74px;
	text-align: center;
	vertical-align: middle;
}

.main-section01 {
    position: relative;
    display: flex;
    justify-content: center;
    height: 1130px;
}

.main-section01 .txt-block01 {
    position: absolute;
    top: 200px;
    left: 200px;
}

.main-section01 .txt-block01 p {
    font-family: Montserrat;
    font-size: 100.5px;
    font-weight: 800;
    font-stretch: normal;
    font-style: normal;
    /* line-height: 3.56; */
    letter-spacing: normal;
    text-align: left;
    color: #333;
}

.main-section01 .txt-block01 span {
    font-family: 'Noto Sans KR';
    font-size: 30px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.9;
    letter-spacing: -1.5px;
    text-align: left;
    color: #333;
}

.animation-typing {
    width: 620px;
    animation: typing 1.5s steps(22), blink .7s infinite;
    white-space: nowrap;
    overflow: hidden;
    border-right: 3px solid;
    font-family: monospace;
}

.main-section01 .txt-block02 {
    position: absolute;
    top: 400px;
    right: 200px;
    text-align: right;
}

.main-section01 .txt-block02 p {
    font-family: 'Noto Sans KR';
    font-size: 69.5px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.59;
    letter-spacing: -3.48px;
    /* text-align: right; */
    color: #333;
}

.main-section01 .txt-block02 span {
    font-family: 'Noto Sans KR';
    font-size: 25px;
    font-weight: 300;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.68;
    letter-spacing: -1.25px;
    /* text-align: right; */
    color: #333;
}

.main-section01 .inner {
    width: 25%;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    padding-top: 600px;
    border-right: 1px solid #dfdfdf;
}

.main-section01 .inner img {
    display: block;
}

.main-section01 .inner span {
    display: block;
    font-family: 'Noto Sans KR';
    font-size: 22px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.55;
    letter-spacing: -1.1px;
    text-align: center;
    color: #333;
    margin-top: 26px;
}

.main-section02 {
    background: url('/resource/images/img-main-06.png');
    position: relative;
    height: 1534px;
}

.main-section02 .txt-block01 {
    position: absolute;
    top: 228px;
    left: 202px;
}

.main-section02 .txt-block01 p {
    font-family: 'Noto Sans KR';
    font-size: 69.5px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.59;
    letter-spacing: -3.48px;
    text-align: left;
    color: #fff;
}

.main-section02 .txt-block01 span {
    font-family: 'Noto Sans KR';
    font-size: 25px;
    font-weight: 300;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.68;
    letter-spacing: -1.25px;
    text-align: left;
    color: #fff;
}

.main-section02 .img-block01 {
    position: relative;
    padding-top: 403px;
}

.main-section02 .img-block01 img:first-child {
    position: absolute;
    top: 500px;
    left: 80%;
    z-index: 1;
    transform: translateX(-80%);
}

.main-section02 .img-block01 img:nth-child(2) {
    position: absolute;
    left: 97%;
    transform: translateX(-95%);
}

.main-section02 .img-block02 {
    position: absolute;
    bottom: 87px;
    left: 215px;
}

.main-section03 {
    background: url('/resource/images/img-main-11.png');
    height: 1472px;
    position: relative;
    display: flex;
    justify-content: center;
}

.main-section03 .txt-block01 {
    position: absolute;
    text-align: right;
    top: 233px;
    right: 200px;
}

.main-section03 .txt-block01 p {
    font-family: 'Noto Sans KR';
    font-size: 69.5px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.59;
    letter-spacing: -3.48px;
    text-align: right;
    color: #fff;
}

.main-section03 .txt-block01 span {
    font-family: 'Noto Sans KR';
    font-size: 25px;
    font-weight: 300;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.68;
    letter-spacing: -1.25px;
    text-align: right;
    color: #fff;
}

.main-section03 .inner {
    width: 25%;
    display: flex;
    justify-content: flex-start;
    align-items: flex-end;
    flex-direction: column;
    padding-top: 600px;
    border-right: 1px solid #5d5b59;
    padding-right: 0;
    text-align: right;
}

.main-section03 .inner div:nth-child(odd) {
    height: 360px;
}

.main-section03 .inner div:nth-child(even) {
    height: 330px;
}

.main-section03 .inner div p {
    font-family: 'Lato';
    font-size: 30px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.13;
    letter-spacing: normal;
    text-align: right;
    color: #fefefe;
    margin-bottom: 58px;;
}

.main-section03 .inner div ul li {
    font-family: 'Lato';
    font-size: 18px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.89;
    letter-spacing: normal;
    text-align: right;
    color: rgba(254, 254, 254, 0.23);
}

.main-section04 {
    height: 421px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
    flex-direction: column;
}

.main-section04 p {
    font-family: 'Noto Sans KR';
    font-size: 70px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    letter-spacing: -3.5px;
    text-align: left;
    color: #333;
    margin-bottom: 52px;
}

.main-section04 span {
    font-family: 'Noto Sans KR';
    font-size: 25px;
    font-weight: 300;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.68;
    letter-spacing: -1.25px;
    text-align: left;
    color: #333;
}

.main-section05 {
    background: url('/resource/images/img-service-01.png');
    display: flex;
    height: 983px;
    background-color: #333333;
    transition: background-image 1s ease; /* 트랜지션 효과 추가 */
}

.main-section05 .inner {
    width: 25%;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    padding-top: 250px;
    border-right: 1px solid #5d5b59;
    padding-right: 0;
    text-align: center;
}

.main-section05 .inner div:first-child p {
    font-family: 'Noto Sans KR';
    font-size: 30px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.13;
    letter-spacing: -1.5px;
    text-align: center;
    color: #fefefe;
    margin-bottom: 27px;;
}

.main-section05 .inner div:first-child span {
    font-family: 'Lato';
    font-size: 20px;
    font-weight: 600;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.7;
    letter-spacing: normal;
    text-align: center;
    color: rgba(254, 254, 254, 0.36);
}

.main-section05 .go-detail {
    width: 214px;
    height: 60px;
    margin: 138px auto;
    padding: 13px 60px 13px 60px;
    border-radius: 30px;
    box-shadow: 0 0 0 0 #33333325, inset 0 0 0 0 #33333325, inset 0 0 0 1px #ffffff25;
    background-color: #33333325;
}

.main-section05 .go-detail:hover {
    background-color: #fff;
}

.main-section05 .go-detail span {
    font-family: 'Noto Sans KR';
    font-size: 16px;
    font-weight: 500;
    font-stretch: normal;
    font-style: normal;
    line-height: 2.13;
    letter-spacing: -0.8px;
    text-align: center;
    color: #fefefe;
}

.main-section05 .go-detail:hover span {
    color: #333;
}

.txt-ceo {
    font-family: 'Lato';
    font-size: 20px;
    font-weight: 200;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.7;
    letter-spacing: normal;
    text-align: left;
    color: #fefefe;
}

#portfolio {
	position: relative;
	padding:75px 0;
	width: 100%;
	max-width: 1520px;
	margin:0 auto;
}
#portfolio .bg-text {
	position: absolute;
	top: 0;
	right: 0;
	-webkit-text-stroke: 1px #cecece;
	font-family: 'NEXON Lv2 Gothic';
	font-size: 180px;
	font-weight: bold;
	line-height: 1;
	color: rgba(0,0,0,0);
	transform: rotate(-90deg) translate(-180px, 30%);
	transform-origin: right bottom;
	z-index: 100;
}
#portfolio h2 {
	margin-bottom: 61px;
	font-family: 'NEXON Lv2 Gothic';
	font-size: 18px;
	font-weight: bold;
	line-height: 1.39;
	text-align: center;
}
#portfolio ul {
	display: flex;
	flex-wrap: wrap;
}
#portfolio ul li {
	overflow: hidden;
	width: 25%;
}
#portfolio ul li > div {
	position: relative;
}
#portfolio ul li > div img {
	max-width: 100%;
}
#portfolio ul li > div .text {
	display: flex;
	align-items: flex-end;
	position: absolute;
	top: 0;
	bottom: 0;
	left: -150%;
	width: 100%;
	padding:40px;
	box-sizing: border-box;
	background-color: rgba(0, 0, 0, 0.7);
	transition: all 0.7s;
	opacity: 0;
}
#portfolio ul li > div .text > a {
	display: block;
}
#portfolio ul li > div .text p {
	margin-bottom: 30px;
	font-family: 'NEXON Lv2 Gothic';
	font-size: 20px;
	font-weight: bold;
	color: #ffffff;
	word-break: keep-all;
	transform: translateY(100%);
	transition: all 0.7s;
	transition-delay: 0.7s;
	opacity: 0;
}
#portfolio ul li > div .text h3 {
	display: block;
	font-size: 40px;
	font-weight: 500;
	line-height: 1.2;
	letter-spacing: -3.75px;
	color: #ffffff;
	/* word-break: keep-all; */
	transform: translateY(100%);
	transition: all 0.85s;
	transition-delay: 0.7s; 
	opacity: 0;
}
#portfolio ul li > div .text span {
	display: block;
	margin-top: 50px;
	font-family: 'NEXON Lv2 Gothic';
	font-size: 15px;
	font-weight: 300;;
	line-height: 1.13;
	color: #ffffff;
	word-break: keep-all;
	transform: translateY(100%);
	transition: all 1s;
	transition-delay: 1s;
	opacity: 0;
}
#portfolio ul li > div:hover .text {
	left: 0;
	opacity: 1;
}
#portfolio ul li > div:hover .text p {
	transform: translateY(0%);
	opacity: 1;
}
#portfolio ul li > div:hover .text h3 {
	transform: translateY(0%);
	/* transition-delay:0.2s; */
	opacity: 1;
}
#portfolio ul li > div:hover .text span {
	transform: translateY(0%);
	/* transition-delay:0.5s; */
	opacity: 1;
}
#portfolio .btn-box {
	margin-top: 40px;
	text-align: center;
}
#portfolio .more {
	display: inline-block;
	color:#333;
	font-family: 'NEXON Lv2 Gothic';
	font-size: 14px;
	font-weight: bold;
}
#portfolio .more img {
	margin-bottom: 10px;
	transition: all 0.2s;
}
#portfolio .more:hover img {
	animation-name: more-arrow;
	animation-duration: 1s;
	animation-iteration-count: infinite;
	animation-direction: alternate;
}


/*
	SUB
*/
#container.sub {
	background-image: url(/resource/images/sub-text-bg.png);
	background-repeat: no-repeat;
	background-position: calc(100% - 137px) 855px;
}
#sub-bnnr {
	overflow: hidden;
	position: relative;
	max-height: 715px;
}

#sub-bnnr>img {
	position: relative;
	top: 0;
	left: 50%;
	margin-left: -960px;
	transform: scale(1.2);
	transition: all 2s;
}
#sub-bnnr .inner {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%,-50%);
}
#sub-bnnr .inner h2 {
	color:#fff;
	font-size: 50px;
	font-weight: 500;
	line-height: 1.4;
    font-family: Montserrat;
	text-align: center;
	transform: translateY(100%);
	transition: all 3s;
	opacity: 0;
}
#sub-bnnr .inner h2 span {
	color:rgba(0,0,0,0);
	-webkit-text-stroke: 1px #ffffff;
}
#sub-bnnr.on>img {
	transform: scale(1);
	transition: all 3s;
}

#sub-bnnr.on .inner h2 {
	transform: translateY(0);
	opacity: 1;
}


.intro-tit {
	font-size: 50px;
	font-weight: 500;
	line-height: 1.66;
	letter-spacing: -3.75px;
}
.intro-tit.stroke {
	color:#fff;
	text-shadow: -1px 0 #333, 0 1px #333, 1px 0 #333, 0 -1px #333;
}
.intro-tit + .cont-tit {
	margin-top: 90px;
}
.intro-tit + .help-tit {
	margin-top: 50px;
}

.sub-tit {
	margin-bottom: 40px;
	font-size: 50px;
	font-weight: bold;
	line-height: 1.2;
	letter-spacing: -3.75px;
	text-align: center;
	color: #333333;
}

.sub-tit small {
	font-family: 'Pretendard';
    font-size: 18px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: 3.61;
    letter-spacing: 3.6px;
    text-align: center;
    color: #b9b9b9;
    display: block;
}

.sub-tit span {
	display: block;
	font-size: 26px;
	font-weight: 300;
	letter-spacing: -1.75px;
}

.sub-tit.border {
	position: relative;
	padding-bottom: 30px;
}

.sub-tit.border:after {
	position: absolute;
	top: 100%;
	left: 50%;
	width: 46px;
	height: 1px;
	margin-left: -23px;
	background-color: #333;
	content: '';
}

.sub-tit.text-left,
.sub-tit.text-left * {
	text-align: left;
}

.cont-tit {
	margin-bottom: 40px;
	font-size: 30px;
	font-weight: 500;
	line-height: 1.07;
	letter-spacing: -2.25px;
}

.bar-tit {
	position: relative;
	width: 100%;
	margin-bottom: 60px;
}
.bar-tit:before {
	position: absolute;
	top: 50%;
	left: 0;
	width: 100%;
	height: 3px;
	margin-top: -1px;
	background-color: #e6e6e6;
	z-index: -1;
	content:'';
}
.bar-tit h4 {
	display: inline-block;
	padding-right: 30px;
	font-size: 50px;
	font-weight: 500;
	line-height: 1.66;
	letter-spacing: -3.75px;
	background-color: #fff;
}
.bar-tit h4 span {
	color:rgba(0, 0, 0, 0);
	-webkit-text-stroke: 1px #333;
}

.help-tit {
	font-size: 18px;
	line-height: 1.78;
	letter-spacing: -1.35px;
}

.sub-tab {
	display: flex;
	justify-content: center;
}
.sub-tab li {
	position: relative;
	padding:0 15px;
} 
.sub-tab li:after {
	position: absolute;
	top: 50%;
	left: 100%;
	width: 1px;
	height: 10px;
	margin-top: -5px;
	background-color: #ccc;
	content:'';
}
.sub-tab li:last-of-type:after {
	display: none;
}
.sub-tab li a {
	color:#c7c7c7;
	font-size: 18px;
	font-weight: bold;
}
.sub-tab li.on a,
.sub-tab li:hover a {
	color: #000;
}


/* 비전 */
.vision-list {
	display: flex;
	justify-content: space-between;
}
.vision-list li {
	width: 380px;
}
.vision-list li:nth-of-type(2) {
	margin-top: -50px;
}
.vision-list li:nth-of-type(3) {
	margin-top: 50px;
}
.vision-list li .text {
	padding:120px 0;
	text-align: center;
}
.vision-list li .text p {
	margin-bottom: 30px;
	font-family: 'NEXON Lv2 Gothic';
	font-size: 50px;
	font-weight: bold;
	line-height: 1.2;
}
.vision-list li .text span {
	font-size: 18px;
	line-height: 1.2;
	letter-spacing: -1.35px;
}

/* 연혁 */

.company-history-wrap .company-history-inner {
	position: relative;
	padding: 80px 0 90px;
}

.company-history-wrap .company-history-inner:after {
	content: "";
	position: absolute;
	top: 0;
	left: 50%;
	margin-left: -0.5px;
	display: block;
	width: 1px;
	height: 100%;
	background-color: #ddd;
	z-index: -1;
}

.company-history-wrap table {
	width: 100%;
	table-layout: fixed;
}

.company-history-wrap table thead th {
	padding-bottom: 115px;
}

.company-history-wrap table thead th img {
	width: 100%;
}

.company-history-wrap table tr:nth-child(even) td {
	text-align: right;
}

.company-history-wrap table tr:nth-child(even) td:after {
	right: -6.5px;
	border: solid 1px #000000;
	box-sizing: border-box;
	background-color: #ffffff;
}

.company-history-wrap table tr:nth-child(even) td .year {
	color:#fff;
	text-shadow: -1px 0 #333, 0 1px #333, 1px 0 #333, 0 -1px #333;
}

.company-history-wrap table tr:nth-child(odd) td {
	text-align: left;
}

.company-history-wrap table tr:nth-child(odd) td:after {
	left: -6.5px;
}

.company-history-wrap table td {
	position: relative;
	padding: 0 52px 62px;
	color: #000;
}

.company-history-wrap table tr:last-child td {
	padding-bottom: 100px;
}

.company-history-wrap table td:after {
	content: "";
	position: absolute;
	top: 110px;
	display: block;
	width: 13px;
	height: 13px;
	border-radius: 13px;
	background-color: #000;
}

.company-history-wrap table td.empty { 
	font-size: 0;
}

.company-history-wrap table td.empty:after {
	display: none;
}

.company-history-wrap table td .year {
	margin-bottom: 40px;
	font-size: 149.5px;
	font-weight: bold;
}

.company-history-wrap table td .info {
	font-size: 22px;
}

.company-history-wrap table td .info span {
	display: block;
	font-size: 18px;
	line-height: 1.78;
	letter-spacing: -1.35px;
}

.company-history-wrap table td .info span:last-child {
	margin-bottom: 0;
}


/* 디지털 컨첸츠 제작 */
#thumb {
	position: relative;
	padding:75px 30px;
	width: 100%;
	max-width: 1360px;
	margin:0 auto;
	box-sizing: border-box;
}
#thumb .bg-text {
	position: absolute;
	top: -290px;
	right: -90px;
	-webkit-text-stroke: 1px #cecece;
	font-family: 'NEXON Lv2 Gothic';
	font-size: 180px;
	font-weight: bold;
	line-height: 1;
	color: rgba(0,0,0,0);
	transform: rotate(-90deg) translate(-180px, 30%);
	transform-origin: right bottom;
	z-index: 100;
}
#thumb ul {
	display: flex;
	flex-wrap: wrap;
	width: calc(100% + 50px);
	margin-left: -25px;
}
#thumb ul li {
	width: calc(33.33% - 50px);
	margin:0 25px 60px;
}
#thumb ul li .img {
	overflow: hidden;
	position: relative;
}
#thumb ul li .img:after {
	display: block;
	padding-top: 60%;
	content:'';
}
#thumb ul li .img img {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
}

#thumb ul li span {
	color: #999;
	font-size: 16px;
	letter-spacing: -0.9px;
}
#thumb ul li p {
	color: #333;
	font-size: 18px;
	font-weight: 500;
	letter-spacing: -0.9px;
}
#thumb ul li [class*="img"]+span {
	display: block;
	margin-top: 20px;
}
#thumb ul li [class*="img"]+p {
	margin-top: 20px;
}

#thumb ul li [class*="img"]{
	overflow: hidden;
	position: relative;
}

#thumb ul li [class*="img"]:after {
	display: block;
	padding-top: 60%;
	content:'';
}

#thumb ul li [class*="img"] img {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
}

/* 유지보수 */
.maintain-section01 {
    padding-top: 0 !important;
    padding-bottom: 139px !important;
}

.maintain-section01 .bg-text {
    top: -333px !important;
}

.maintain-section01 .txt-block01 {
    display: flex;
    /* flex-direction: column; */
    justify-content: center;
    margin-bottom: 90px;
    flex-wrap: wrap;
}

.maintain-section01 .txt-block01 span:first-child {
    font-family: 'Noto Sans KR';
    font-size: 22px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    letter-spacing: normal;
    text-align: center;
    color: #333;
    display: block;
    margin-bottom: 20px;
    position: relative;
}

.maintain-section01 .txt-block01 span:first-child::before {
    position: absolute;
    top: 50%;
    left: -55px;
    width: 1px;
    height: 12px;
    margin-top: -5px;
    background-color: #ccc;
    content: '';
}

.maintain-section01 .txt-block01 span:first-child::after {
    position: absolute;
    top: 50%;
    right: -55px;
    width: 1px;
    height: 12px;
    margin-top: -5px;
    background-color: #ccc;
    content: '';
}

.maintain-section01 .txt-block01 span:nth-child(2) {
    font-family: 'Lato';
    font-size: 22px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    letter-spacing: normal;
    text-align: center;
    color: #d1d1d1;
    display: block;
    width: 100%;
}

.maintain-section01 .txt-block02 {
    font-family: 'Noto Sans KR';
    font-size: 30px;
    font-weight: 400;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.4;
    letter-spacing: -1.5px;
    text-align: center;
    color: #333;
    margin-bottom: 112px;
}

.maintain-section01 .img-block01 {
    display: flex;
}

.maintain-section01 .img-block01 .item {
    width: 389px;
    height: 480px;
    position: relative;
    border: 1px solid #d7d7d7;
}

.maintain-section01 .img-block01 .item:not(:last-child) {
    margin-right: 67px;
}

.maintain-section01 .img-block01 .item:last-child {
    margin-right: 19px;
}

.maintain-section01 .img-block01 .item img {
    position: absolute;
    right: 40px;
    top: 40px;
}

.maintain-section01 .img-block01 .item div {
    position: absolute;
    left: 47px;
    top: 270px;
}

.maintain-section01 .img-block01 .item div span:first-child {
    font-family: 'Noto Sans KR';
    font-size: 24px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.33;
    letter-spacing: -1.2px;
    text-align: left;
    color: #333;
    display: block;
    margin-bottom: 22px;
}

.maintain-section01 .img-block01 .item div span:nth-child(2) {
    font-family: 'Noto Sans KR';
    font-size: 18px;
    font-weight: 400;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.67;
    letter-spacing: -0.9px;
    text-align: left;
    color: #333;
    display: block;
}

.maintain-section02 {
    width: 100%;
    height: 765px;
    background: linear-gradient(to right, #3b95e1, #7b4fc3);
    position: relative;
}

.maintain-section02 img {
    position: absolute;
    top: 144px;
    left: 52%;
    transform: translateX(-52%); 
}

.maintain-section03 {
    background: #eaeaea;
    height: 862px;
}

.maintain-section03 .inner {
    max-width: 1360px;
    display: flex;
    padding-top: 330px;
    justify-content: center;
}

.maintain-section03 .inner .txt-block01 span:first-child {
    font-family: 'Noto Sans KR';
    font-size: 40px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.3;
    letter-spacing: -2px;
    text-align: left;
    color: #333;
    display: block;
    margin-right: 200px;
}

.maintain-section03 .inner .txt-block01 span:nth-child(2) {
    font-family: 'Noto Sans KR';
    font-size: 18px;
    font-weight: 400;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.67;
    letter-spacing: -0.9px;
    text-align: left;
    color: #333;
    display: block;
    margin-top: 29px;
}

.maintain-section04 {
    background-color: #f8f3f1;
    padding: 114px 0 105px;
}

.maintain-section04 .inner {
    max-width: 1360px;
    display: flex;
    flex-direction: column;
    padding-top: 104px;
    padding-bottom: 50px;
    justify-content: center;
    align-items: center;
    background: #fff;
}

.maintain-section04 .txt-block01 {
    font-size: 30px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.4;
    letter-spacing: -1.5px;
    text-align: center;
    color: #333;
    display: block;
    margin-bottom: 50px;
}

.maintain-section04 .txt-block01 .point-color { 
    color: #4d81d8;
}

.tb-maintain {
    width: 935px;
    margin-bottom: 45px;
    font-family: 'Noto Sans KR';
    font-size: 18px;
    font-weight: 500;
    font-stretch: normal;
    font-style: normal;
    letter-spacing: -0.9px;
    color: #333;
}

.tb-maintain tr:first-child {
    border-top: 1px solid #333;
    background-color: #f4eeea;
    text-align: center;
}

.tb-maintain tr {
    border: 1px solid #cdcdcd;
    border-right: 0;
    border-left: 0;
}

.tb-maintain tr td:first-child {
    text-align: center;
    background-color: #f4eeea;
}

.tb-maintain tr td:nth-child(2) {
    text-align: left;
    font-weight: 300;
}

.tb-maintain tr td {
    padding: 24px 37px;
}

.maintain-section04 .img-block01 {
    margin-bottom: 50px;
}

.maintain-swiper {
    width: 100%;
    text-align: center;
    position: relative;
}

.maintain-swiper .swiper-pagination {
    width: 100%;
    position: relative;
    display: flex;
    justify-content: center;
    margin-top: 26px;
    height: 30px;
}

.maintain-swiper .swiper-pagination-bullet {
    width: 15px;
    height: 15px;
    background-color: #d5cecb;
    opacity: 1;
    margin-bottom: 0;
}

.maintain-swiper .swiper-pagination-bullet-active {
    width: 8px;
    height: 8px;
    border: solid 4px #4887db;
    background-color: #fff;
    opacity: 1;
    margin-bottom: 0;
}

.maintain-swiper .swiper-pagination-bullet:not(:last-child) {
    margin-right: 10px;
    margin-bottom: 0;
}

.swiper-slide {
    display: flex;
    justify-content: center;
}

.maintain-swiper .swiper-slide img {
    margin-bottom: 20px;
    margin-top: 45px;
}

.maintain-swiper .navigation-box {
    display: flex;
    width: 100%;
    justify-content: space-between;
    margin: 0 auto;
    align-items: start;
    position: absolute;
    top: 250px;
    z-index: 100;
    padding: 0 40px;
    box-sizing: border-box;
}

.maintain-swiper .button-next {
    background: url('/resource/images/slide-next-active.png') no-repeat;
    height: 86px;
    width: 86px;
    background-position-x: right;
    cursor: pointer;
}

.maintain-swiper .button-prev {
    background: url('/resource/images/slide-pre-active.png') no-repeat;
    height: 86px;
    width: 86px;
    cursor: pointer;
}

.maintain-swiper .button-next.swiper-button-disabled {
    background: url('/resource/images/slide-next-last.png') no-repeat;
    cursor: default;
}

.maintain-swiper .button-prev.swiper-button-disabled {
    background: url('/resource/images/slide-pre-last.png') no-repeat;
    cursor: default;
}

.maintain-swiper .button-box {
    margin-bottom: 50px;
}

/* 홈페이지 제작 */
.homepage-section01 .txt-block01 {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
}

.homepage-section01 .txt-block01 span:first-child {
	font-family: 'Noto Sans KR';
	font-size: 22px;
	font-weight: bold;
	font-stretch: normal;
	font-style: normal;
	letter-spacing: normal;
	text-align: center;
	color: #333;
	position: relative;
	display: block;
}

.homepage-section01 .txt-block01 span:first-child::before {
	position: absolute;
	top: 50%;
	left: -45px;
	width: 1px;
	height: 12px;
	margin-top: -5px;
	background-color: #ccc;
	content: '';
}

.homepage-section01 .txt-block01 span:first-child::after {
	position: absolute;
	top: 50%;
	right: -45px;
	width: 1px;
	height: 12px;
	margin-top: -5px;
	background-color: #ccc;
	content: '';
}

.homepage-section01 .txt-block01 span:nth-child(2) {
	font-family: 'Lato';
	font-size: 22px;
	font-weight: bold;
	font-stretch: normal;
	font-style: normal;
	letter-spacing: normal;
	text-align: center;
	color: #d1d1d1;
	margin-bottom: 63px;
	display: block;
	width: 100%;
	margin-top: 20px;
}

.homepage-section01 {
	padding-top: 0 !important;
	position: relative;
	padding: 75px 30px;
	width: 100%;
	max-width: 1360px;
	margin: 0 auto;
	box-sizing: border-box;
}

.homepage-section01 .txt-block02 p {
	font-family: 'Noto Sans KR';
	font-size: 40px;
	font-weight: 300;
	font-stretch: normal;
	font-style: normal;
	line-height: 1.33;
	letter-spacing: -2px;
	text-align: center;
	color: #333;
}

.homepage-section01 .txt-block03 {
	display: flex;
	justify-content: center;
	margin-top: 179px;
}

.homepage-section01 .txt-block03 .circle {
	width: 23px;
	height: 23px;
	background-color: #3886c8;
	border-radius: 50%;
	margin-top: 28px;
	margin-left: 84px;
	margin-right: 84px;
}

.homepage-section01 .txt-block03 div p {
	font-family: 'Lato';
	font-size: 58.5px;
	font-weight: 900;
	font-stretch: normal;
	font-style: normal;
	line-height: 1.14;
	letter-spacing: normal;
	text-align: left;
	color: #333;
	margin-bottom: 27px;
}

.homepage-section01 .txt-block03 div span {
	font-family: 'Noto Sans KR';
	font-size: 20px;
	font-weight: 500;
	font-stretch: normal;
	font-style: normal;
	line-height: 1.25;
	letter-spacing: -1px;
	text-align: center;
	color: #333;
	display: block;
}

.homepage-section01 .txt-block04 span {
	font-family: 'Noto Sans KR';
	font-size: 30px;
	font-weight: bold;
	font-stretch: normal;
	font-style: normal;
	line-height: 0.83;
	letter-spacing: -1.5px;
	text-align: center;
	color: #333;
	display: block;
	margin-top: 157px;
}

.homepage-section01 img {
	margin-top: 97px;
}

.homepage-section02 {
	height: 1182px;
	background: linear-gradient(to right, #3b95e1, #7b4fc3);
	padding-top: 125px !important;
	padding-bottom: 157px !important;
	padding-left: 68px !important;
	padding-right: 68px !important;
	box-sizing: border-box;
}

.homepage-section02 .inner {
	max-width: 1300px;
	margin: 0 auto;
	box-sizing: border-box;
	width: 100%;
	padding: 0;
	position: relative;
}

.homepage-section02 .txt-block01 {
	font-family: 'Noto Sans KR';
	font-size: 30px;
	font-weight: bold;
	font-stretch: normal;
	font-style: normal;
	line-height: 0.83;
	letter-spacing: -1.5px;
	text-align: center;
	color: #fff;
}

.box-homepage-team {
	display: flex;
	flex-direction: column;
	width: 390px;
	position: absolute;
    box-shadow: 25px 30px 15px 0px #00000069;
}

.box-homepage-team .txt-block01 {
	background: #fff;
	padding: 53px 0 0 42px;
	height: 248px;
	box-sizing: border-box;
}

.box-homepage-team .txt-block01 p {
	font-family: 'Noto Sans KR';
	font-size: 18px;
	font-weight: bold;
	font-stretch: normal;
	font-style: normal;
	line-height: 1.67;
	letter-spacing: -0.9px;
	text-align: left;
	color: #333;
}

.box-homepage-team .txt-block01 span {
	font-family: 'Noto Sans KR';
	font-size: 18px;
	font-weight: 300;
	font-stretch: normal;
	font-style: normal;
	line-height: 1.67;
	letter-spacing: -0.9px;
	text-align: left;
	color: #333;
	display: block;
	margin-top: 10px;
}

.box-homepage-team.item_1 {
	left: 0;
	top: 90px;
}

.box-homepage-team.item_2 {
	left: 455px;
	top: 260px;
}

.box-homepage-team.item_3 {
	left: 910px;
	top: 120px;
}

.homepage-section03 {
    width: 100%;
    max-width: 1360px;
    margin: 0 auto;
    box-sizing: border-box;
    padding-top: 105px !important;
    padding-bottom: 154px !important;
}

.homepage-section03 .txt-block01 {
    text-align: center;
    margin-bottom: 60px;
}

.homepage-section03 .txt-block01 span {
    font-family: 'Noto Sans KR';
    font-size: 30px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: 0.83;
    letter-spacing: -1.5px;
    text-align: center;
    color: #333;
}

.homepage-section03 .img-block01 {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
}

.homepage-section03 .img-block01 .item {
    margin-right: 68px;
    margin-bottom: 68px;
    width: 388px;
    margin-bottom: 27px;
    height: 388px;
    position: relative;
    border: 1px solid #d7d7d7;
}

.homepage-section03 .img-block01 .item:nth-child(3n) {
    margin-right: 0;
}

.homepage-section03 .img-block01 .item img {
    position: absolute;
    right: 30px;
    top: 30px;
}

.homepage-section03 .img-block01 .item div {
    position: absolute;
    left: 55px;
    top: 213px;
}

.homepage-section03 .img-block01 .item div p {
    font-family: 'Noto Sans KR';
    font-size: 18px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.67;
    letter-spacing: -0.9px;
    text-align: left;
    color: #333;
}

.homepage-section03 .img-block01 .item div span {
    font-family: 'Noto Sans KR';
    font-size: 18px;
    font-weight: 400;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.67;
    letter-spacing: -0.9px;
    text-align: left;
    color: #333;
    display: block;
    margin-top: 18px;
}


/* 컨설팅 & 마케팅 */
.marketing-section01 .txt-block01 {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
}

.marketing-section01 .txt-block01 span:first-child {
    font-family: 'Noto Sans KR';
    font-size: 22px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    letter-spacing: normal;
    text-align: center;
    color: #333;
    position: relative;
    display: block;
}

.marketing-section01 .txt-block01 span:first-child::before {
    position: absolute;
    top: 50%;
    left: -45px;
    width: 1px;
    height: 12px;
    margin-top: -5px;
    background-color: #ccc;
    content: '';
}

.marketing-section01 .txt-block01 span:first-child::after {
    position: absolute;
    top: 50%;
    right: -45px;
    width: 1px;
    height: 12px;
    margin-top: -5px;
    background-color: #ccc;
    content: '';
}

.marketing-section01 .txt-block01 span:nth-child(2) {
    font-family: 'Lato';
    font-size: 22px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    letter-spacing: normal;
    text-align: center;
    color: #d1d1d1;
    margin-bottom: 63px;
    display: block;
    width: 100%;
    margin-top:20px;
}

.marketing-section01 {
    padding-top: 0 !important;
    position: relative;
    padding: 75px 30px;
    width: 100%;
    max-width: 1360px;
    margin: 0 auto;
    box-sizing: border-box;
}

.marketing-section01 .txt-block02 {
    display: flex;
    flex-direction: column;
}

.marketing-section01 .txt-block03 {
    font-family: 'Noto Sans KR';
    font-size: 30px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.4;
    letter-spacing: -1.5px;
    text-align: center;
    color: #333;
}

.marketing-section01 img {
    margin-top: 97px;
}

.marketing-step-box {
    display: flex;
    flex-direction: column;
}

.marketing-step-top {
    background-image: url("/resource/images/m-marketing-03.png");
    margin-bottom: 10px;
    height: 111px;
    display: flex;
    justify-content: center;
    align-items: center;
}

.marketing-step-top span {
    font-family: 'Lato';
    font-size: 30px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    letter-spacing: -1.5px;
    color: #fff;
}

.marketing-step-bottom {
    width: 100%;
    min-height: 239px;
    display: flex;
    background-color: #f3efea;
    box-sizing: border-box;
    justify-content: center;
    align-items: center;
    margin-bottom: 10px;
    padding: 83px 0 83px 0;
}

.marketing-step-bottom.mb {
    margin-bottom: 30px;
}

.marketing-step-bottom span {
    font-family: 'Noto Sans KR';
    font-size: 30px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.5;
    letter-spacing: -1.5px;
    text-align: center;
    color: #333;
}

.marketing-section02 {
    width: 100%;
    max-width: 1360px;
    margin: 0 auto;
    box-sizing: border-box;
}

.marketing-section02 .txt-block03 {
    font-family: 'Noto Sans KR';
    font-size: 30px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.67;
    letter-spacing: -1.5px;
    text-align: center;
    color: #333;
    margin-top: 133px;
}

.marketing-section03 {
    width: 100%;
    max-width: 1360px;
    margin: 0 auto;
    box-sizing: border-box;
    padding-top: 105px !important;
    padding-bottom: 154px !important;
}

.marketing-section03 .img-block01 {
    display: flex;
}

.marketing-section03 .img-block01 .item {
    margin-right: 68px;
    width: 388px;
    margin-bottom: 27px;
    height: 388px;
    position: relative;
    border: 1px solid #d7d7d7;
}

.marketing-section03 .img-block01 .item:last-child {
    margin-right: 0;
}

.marketing-section03 .img-block01 .item img {
    position: absolute;
    right: 43px;
    top: 43px;
}

.marketing-section03 .img-block01 .item div {
    position: absolute;
    left: 65px;
    top: 273px;
}

.marketing-section03 .img-block01 .item div span {
    font-family: 'Noto Sans KR';
    font-size: 24px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.33;
    letter-spacing: -1.2px;
    text-align: left;
    color: #333;
}

.marketing-section04 {
    height: 1767px;
    background-image: url("/resource/images/marketing-07.png");
    padding-top: 125px !important;
    padding-bottom: 157px !important;
    padding-left: 68px !important;
    padding-right: 68px !important;
    box-sizing: border-box;
}

.marketing-section04 .inner {
    max-width: 1030px;
    margin: 0 auto;
    box-sizing: border-box;
    width: 100%;
    padding: 0;
}

.marketing-section04 .txt-block01 {
    font-family: 'Lato';
    font-size: 47.5px;
    font-weight: 900;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.2;
    letter-spacing: -0.48px;
    text-align: center;
    color: #fff;
}

.marketing-section04 .txt-block02 {
    font-family: 'Noto Sans KR';
    font-size: 25px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1;
    letter-spacing: -1.25px;
    text-align: center;
    color: #fff;
    display: block;
    margin-top: 26px;
}

.box-marketing-package {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    margin-top: 68px;
}

.marketing-package {
    width: 310px;
    margin-bottom: 40px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.box-marketing-package .marketing-package:nth-child(odd) {
    margin-right: 0px;
}

.marketing-package span {
    font-family: 'Noto Sans KR';
    font-size: 22px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.64;
    letter-spacing: -1.1px;
    text-align: center;
    color: #fff;
    margin-top: 17px;
    display: block;
}

.marketing-section04 .txt-block03 {
    border-top: 1px solid #ffffff50;
    margin-top: 54px;
    padding-top: 40px;
}

.marketing-section04 .txt-block03 span {
    font-family: 'Noto Sans KR';
    font-size: 18px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 2;
    letter-spacing: -0.9px;
    text-align: left;
    color: #fff;
}

.marketing-section04 .txt-block03 .ul-marker-- li::before {
    left: 1px;
    top: 3px;
    color: #fff;
    font-size: 18px;
}

/* 모달 */
[id*="modal"] {
	display: none;
	position: fixed;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	z-index: 10000;
}
[id*="modal"] .modal-bg {
	width: 100%;
	height: 100%;
	background-color: rgba(0,0,0,0.9);
}
[id*="modal"] .modal-wrap {
	position: absolute;
	top: 50%;
	left: 50%;
	width: 100%;
	max-width: 1300px;
	padding:50px;
	box-sizing: border-box;
	transform: translate(-50%, -50%);
}
[id*="modal"] .modal-wrap .video {
	position: relative;
	width: 100%;
}
[id*="modal"] .modal-wrap .video:after {
	display: block;
	padding-top: 56%;
	content:'';
}
[id*="modal"] .modal-wrap .video iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}
[id*="modal"] .modal-wrap [class*="close"] {
	position: absolute;
	top: 0;
	right: 0;
	font-size: 40px;
}


/* 파트너 */
#partner {
	position: relative;
}
#partner  h3 {
	position: absolute;
	top: 300px;
	left: 30px;
	font-size: 50px;
	font-weight: 600;
	line-height: 1;
	letter-spacing: -2px;
	transform: rotate(-90deg);
	transform-origin: left top;
}
#partner .box {
	display: block;
	width: 843px;
	margin-left: auto;
}
#partner .box p {
	margin-bottom: 70px;
	font-size: 18px;
	font-weight: normal;
	font-stretch: normal;
	font-style: normal;
	line-height: 1.2;
	letter-spacing: -1.35px;
}
#partner .box ul {
	display: flex;
	flex-wrap: wrap;
}
#partner .box ul li {
	width: 33.33%;
}


/* 오시는길 */
#map-box {
	position: relative;
}
#map-box h3 {
	position: absolute;
	top: 180px;
	left: 30px;
	font-size: 50px;
	font-weight: 600;
	line-height: 1;
	letter-spacing: -2px;
	transform: rotate(-90deg);
	transform-origin: left top;
}
#map {
	width: 1070px;
	margin-left: auto;
}
#map .root_daum_roughmap {
	width: 100%;
}
#map .address {
	margin-top: 60px;
}

#map .address h4 {
	margin-bottom: 25px;
	font-size: 25px;
	font-weight: bold;
	line-height: 1.28;
}
#map .address h4 span {
	color:#fff;
	text-shadow: -1px 0 #333, 0 1px #333, 1px 0 #333, 0 -1px #333;;
}
#map .address .box {
	display: flex;
}
#map .address .box p {
	width: 50%;
	font-size: 18px;
	line-height: 1.78;
	letter-spacing: -1.35px;
}
#map .address .box table {
	width: 50%;
}
#map .address .box th {
	width: 150px;
	color:#8b8b8b;
	font-size: 18px;
	font-weight: 500;
	line-height: 1.78;
	letter-spacing: -1.35px;
	text-align: left;
}
#map .address .box td {
	font-size: 18px;
	line-height: 1.78;
	letter-spacing: -1.35px;
}
#map .contact {
	margin-top: 120px;
}
#map .contact h4 {
	margin-bottom: 35px;
	font-size: 40px;
	font-weight: 500;
	line-height: 1.2;
	letter-spacing: -3px;
}
#map .contact .box {
	display: flex;
}
#map .contact .box p {
	width: 50%;
	font-size: 18px;
	line-height: 1.78;
	letter-spacing: -1.35px;
}
#map .contact .box p span {
	display: block;
	color:#8b8b8b;
	font-weight: 500;
}
#map .contact .box p .bar {
	display: inline-block;
	width: 1px;
	height: 10px;
	margin:-2px 10px 0;
	background-color: #8b8b8b;
	vertical-align: middle;
}



/* 채용 */
.hire-info {
	padding:20px 60px;
	border-top:3px solid #e6e6e6;
	border-bottom:3px solid #e6e6e6;
}
.hire-info li {
	display: table;
}
.hire-info li p {
	display: table-cell;
	padding:15px;
	font-size: 20px;
	font-weight: 500;
	line-height: 1.7;
	letter-spacing: -1.5px;
	color: #8b8b8b;
}
.hire-info li span {
	display: table-cell;
	padding:15px;
	font-size: 20px;
	font-weight: 500;
	line-height: 1.7;
	letter-spacing: -1.5px;
	color: #333;
}

/* 유지보수 portfolio */
.maintain-tab {
    width: 100%;
    margin-bottom: 62px;
}

.maintain-tab ul {
    width: 100%;
    display: flex;
    background: #f5f5f5;
}

.maintain-tab ul li {
    width: 20%;
    text-align: center;
    border: 1px solid #cccccc;
    border-right: 0;
    cursor: pointer;
}

.maintain-tab ul li.on {
    background-color: #333;
}

.maintain-tab ul li:last-child {
    border-right: 1px solid #cccccc;
}

.maintain-tab ul li a {
    font-family: 'Pretendard';
    font-size: 18px;
    font-weight: 600;
    font-stretch: normal;
    font-style: normal;
    letter-spacing: normal;
    text-align: center;
    color: #333;
    width: 100%;
    display: block;
    height: 100%;
    padding: 23px 0;
    box-sizing: border-box;
}

.maintain-tab ul li.on a {
    color: #fff; 
}

/* 견적문의 */
.privacy_box {
	margin-bottom: 60px;
	padding:30px;
	border:3px solid #eee;
	box-sizing: border-box;
}
.privacy_box .help-tit {
	margin-bottom: 10px;
}
.label-radio {
	display: inline-block;
	width: 19.5%;
	margin:10px 0;
	font-size: 14px;
}

.ul-marker-- {
    list-style-type: none;
}

.ul-marker-- li {
    padding-left: 15px;
    position: relative;
    word-break: keep-all;
}

.ul-marker-- li::before {
    content: '-';
    position: absolute;
    left: 0px;
    top: 0px;
    color: #333;
}

@media screen and (max-width:1600px) {
    .main-section02 .img-block01 img:first-child {
        position: absolute;
        top: 590px;
        /* width: 600px; */
        z-index: 10;
    }

    .main-section02 .img-block01 img:nth-child(2) {
        position: absolute;
        top: 590px;
        /* width: 600px; */
        z-index: 10;
        width: 100%;
    }
}

@media screen and (max-width:720px) {
	body {
		min-width: 1px;
		max-width: 100%;
	}

	.mb-show {
		display: initial !important;
	}

	.mb-hide {
		display: none !important;
	}

	.mb-flex {
		display: flex !important;
	}

    .mb-table {
        display: inline-table !important;
    }

    .pc-table {
        display: none !important;
    }

    .pc-flex {
        display: none !important;
    }

	.form-control {
		height: 65px;
		font-size: 26px;
		line-height: 55px;
	}

	.half-cont {
		flex-flow: column;
	}
	.half-cont>div {
		width: 100%;
	}
	.half-cont>div.img-box {
		text-align: left;
	}
	.half-cont>div.text {
		margin-top: 40px;
	}
	.square-list.n4 {
		width: 100%;
		margin-left: 0;
	}
	.square-list.n4 li {
		width: 100%;
		margin:10px 0;
	}
	.square-list.n4 li p {
		font-size: 32px;
	}
	.square-list.n4 li span {
		font-size: 28px;
	}

	.square-list2 {
		max-width: 500px;
		margin:0 auto !important;
	}
	.square-list2.n3 {
		width: 100%;
		margin-left: 0;
	}
	.square-list2.n3 li {
		width: 100%;
		margin:15px 0;
	}
	.square-list2.n3 li .img {
		margin-bottom: 40px;
	}
	.square-list2.n3 li p {
		font-size: 30px;
	}
	.square-list2.n3 li span {
		font-size: 25px;
	}

	#top, #quick {
		transform: scale(1.3);
	}
	#quick {
		bottom:100px;
	}

	header {
		align-items: center;
		padding:15px 10px 15px 30px;
	}
	header .h-phone {
		right: 103px;
		font-size: 26px;
	}
	header #gnb .menu {
		width: 100%;
	}
	header #gnb .menu>li {
		margin:28px 0;
	}
	header #gnb .menu>li,
	header #gnb .menu>li.on,
	header #gnb .menu>li:hover {
		overflow: auto;
	}
	header #gnb .menu>li>a {
		margin-bottom: 20px;
		text-align: center;
	}
	header #gnb .menu>li.on>a,
	header #gnb .menu>li:hover>a {
		font-family: "Noto Sans KR";
		color: #333;
		text-shadow: none;
	}
	header #gnb .menu>li:hover .sub-menu {
		height: 0;
	}
	header #gnb .menu>li.on .sub-menu {
		width: 100%;
		opacity: 1;
	}
	header #gnb .menu>li:nth-of-type(1).on .sub-menu {height: 356px;}
	header #gnb .menu>li:nth-of-type(2).on .sub-menu {height: 250px;}
	header #gnb .menu>li:nth-of-type(3).on .sub-menu {height: 188px;}
	header #gnb .menu>li:nth-of-type(4).on .sub-menu {height: 188px;}
	header #gnb .sub-menu {
		position: static;
		left: auto;
		top: auto;
		width: 100%;
		background-color: #f7f7f7;
		opacity: 1;
		transition: height 0.3s;
	}
	header #gnb .sub-menu li {
		margin-bottom: 25px;
		text-align: center;
	}
	header #gnb .sub-menu li:first-of-type {
		padding-top: 20px;
	}
	/* header #gnb .sub-menu li:last-of-type {
		padding-bottom: 20px;
	} */
	header #gnb .sub-menu li a {
		color:#333;
		font-family: "Noto Sans KR";
		font-weight: 300;
		font-size: 26px;
	}
	header #gnb .channel {
		display: block;
	}
	header #gnb .channel .sns .tit {
		font-size: 30px;
		text-align: center;
	}
	header #gnb .channel .sns ul {
		justify-content: center;
	}
	header #gnb .channel .sns ul li:last-of-type {
		margin-right: 0;
	}
	header #gnb .channel > p {
		display: none;
		font-size: 24px;
		text-align: center;
	}
	header.active {
		padding: 15px 10px 15px 30px;
	}

	header .h-go-maintain {
		position: absolute;
		top: 50%;
		right: 300px;
		color: #fff;
		font-size: 26px;
		transform: translateY(-50%);
	}

	header.active .h-go-maintain {
		color: #333;
	}

	footer {
		font-size: 18px;
	}

	#container.sub {
		background-position: calc(100% + 43px) 855px;
	}

	#main-bnnr {
		max-height: 1546px;
	}
	#main-bnnr>img {
		margin-left: -360px;
	}
	#main-bnnr .side-menu {
		display: none;
	}
	#main-bnnr .inner {
		top: 35%;
		padding:0 116px;
		text-align: left;
	}
	#main-bnnr .inner h2 {
		font-size: 47px;
	}
	#main-bnnr .inner ul {
		margin-left: -15px;
	}
	#main-bnnr .inner ul li a {
		font-size: 22px;
	}
	#main-bnnr .inner ul li:after {
		height: 26px;
	}

	#portfolio .bg-text {
		display: none;
	}
	#portfolio h2 {
		font-size: 26px;
	}
	#portfolio ul li {
		width: 100%;
	}
	#portfolio ul li>div .text {
		padding:30px;
	}
	#portfolio ul li>div:hover .text {
		left: -150%;
		opacity: 0;
	}

	#portfolio ul li>div:hover .text p {
		transform: translateY(100%);
		opacity: 0;
	}

	#portfolio ul li>div:hover .text h3 {
		transform: translateY(100%);
		opacity: 0;
	}

	#portfolio ul li>div:hover .text span {
		transform: translateY(100%);
		opacity: 0;
	}
	#portfolio ul li>div.on .text {
		left: 0;
		opacity: 1;
	}

	#portfolio ul li>div.on .text p {
		transform: translateY(0%);
		opacity: 1;
	}

	#portfolio ul li>div.on .text h3 {
		transform: translateY(0%);
		/* transition-delay:0.2s; */
		opacity: 1;
	}

	#portfolio ul li>div.on .text span {
		transform: translateY(0%);
		/* transition-delay:0.5s; */
		opacity: 1;
	}
	#portfolio .more {
		font-size: 24px;
	}
	#portfolio .more img {
		animation-name: more-arrow;
		animation-duration: 1s;
		animation-iteration-count: infinite;
		animation-direction: alternate;
	}



	.intro-tit {
		word-break: keep-all;
	}
	.cont-tit {
		font-size: 40px;
		text-align: center;
	}
	.help-tit {
		font-size: 28px;
		letter-spacing: -1.85px;
	}

	.sub-tab li {
		padding:0 20px;
	}
	.sub-tab li:after {
		height: 15px;
	}
	.sub-tab li a {
		font-size: 27px;
	}


	.vision-list {
		flex-flow: column;
		/* flex-wrap: wrap; */
		/* justify-content: center; */
	}
	.vision-list li {
		width: 100%;
		/* margin-left: 0.5%; */
		/* margin-right: 0.5%; */
		margin-bottom: 80px;
	}

	.vision-list li:nth-of-type(2) {
		display: flex;
		flex-flow: column-reverse;
		margin-top: 0;
	}
	.vision-list li:nth-of-type(3) {
		margin-top: 0;
	}
	.vision-list li .text {
		padding:80px 0;
	}
	.vision-list li .text span {
		font-size: 26px;
		word-break: keep-all;
		line-height: 1.4;
	}

	.company-history-wrap table td {
		padding: 0 40px 62px;
	}
	.company-history-wrap table td .year {
		font-size: 70px;
	}
	.company-history-wrap table tr:nth-child(even) td {
		text-align: left;
	}

	#thumb .bg-text {
		display: none;
	}
	#thumb ul {
		width: calc(100% + 30px);
		margin-left: -15px;
	}
	#thumb ul li {
		width: calc(50% - 30px);
		margin: 0 15px 50px;
	}
	#thumb ul li span {
		font-size: 22px;
	}
	#thumb ul li p {
		font-size: 24px;
	}

    #sub-bnnr.new {
        overflow: hidden;
        position: relative;
        max-height: initial;
    }
    
    #sub-bnnr.new>img {
        position: relative;
        top: 0;
        left: 0;
        margin-left: 0px;
        transform: scale(1.2);
        transition: all 2s;
    }
    #sub-bnnr.new .inner {
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%,-50%);
    }
    #sub-bnnr.new .inner h2 {
        color:#fff;
        font-family: Montserrat;
        font-size: 78.5px;
        font-weight: 500;
        line-height: 1.4;
        letter-spacing: -3.75px;
        text-align: center;
        transform: translateY(100%);
        transition: all 3s;
        opacity: 0;
    }
    #sub-bnnr.new .inner h2 span {
        color:rgba(0,0,0,0);
        -webkit-text-stroke: 2px #ffffff;
    }

    #sub-bnnr.new.on>img {
        transform: scale(1);
        transition: all 3s;
    }
    
    #sub-bnnr.new.on .inner h2 {
        transform: translateY(0);
        opacity: 1;
    }

    /* 메인 */
	.main-section01 {
		position: relative;
		display: flex;
		flex-wrap: wrap;
		height: auto;
	}

    .main-section01 .txt-block01 {
        position: absolute;
        top: 101px;
        left: 67px;
    }

	.main-section01 .txt-block01 p {
		font-family: Montserrat;
		font-size: 100.5px;
		font-weight: 800;
		font-stretch: normal;
		font-style: normal;
		line-height: 1;
		letter-spacing: normal;
		text-align: left;
		color: #333;
		margin-bottom: 29px;
	}

	.main-section01 .txt-block02 {
		position: absolute;
		top: 737px;
		right: initial;
		text-align: left;
		left: 125px;
	}

    .main-section01 .txt-block02 p {
        font-family: 'Noto Sans KR';
        font-size: 50.5px;
        font-weight: bold;
        font-stretch: normal;
        font-style: normal;
        line-height: initial;
        letter-spacing: -2.53px;
        text-align: left;
        color: #333;
    }

    .main-section01 .txt-block02 span {
        font-family: 'Noto Sans KR';
        font-size: 30px;
        font-weight: 400;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.67;
        letter-spacing: -1.5px;
        text-align: left;
        color: #333;
        display: block;
        margin-top: 49px;
    }

	.main-section01 .img-block01 {
		padding-top: 1135px;
		width: 100%;
		flex-direction: column;
		justify-content: center;
		align-items: center;
		margin-top: 110px;
	}

	.main-section01 .img-block01 div {
		border-top: 1px solid #d8d8d8;
		height: 414px;
		display: flex;
		justify-content: center;
		align-items: center;
		width: 100%;
		flex-direction: column;
	}

	.main-section01 .img-block01 div img {
		margin-bottom: 29px;
	}

	.main-section01 .img-block01 div span {
		font-family: 'Noto Sans KR';
		font-size: 30px;
		font-weight: normal;
		font-stretch: normal;
		font-style: normal;
		line-height: 1.47;
		letter-spacing: -1.5px;
		text-align: center;
		color: #333;
	}

	.main-section02 {
		background: url('/resource/images/m-main-08.png');
		position: relative;
		height: 1596px;
	}

	.main-section02 .txt-block01 {
		position: absolute;
		top: 207px;
		left: 67px;
	}

	.main-section02 .txt-block01 p {
		font-family: 'Noto Sans KR';
		font-size: 60px;
		font-weight: bold;
		font-stretch: normal;
		font-style: normal;
		letter-spacing: -3px;
		text-align: left;
		color: #fff;
		margin-bottom: 31px;
	}

	.main-section02 .txt-block01 span {
		font-family: 'Noto Sans KR';
		font-size: 30px;
		font-weight: 400;
		font-stretch: normal;
		font-style: normal;
		line-height: 1.67;
		letter-spacing: -1.5px;
		text-align: left;
		color: #fff;
		display: block;
	}

	.main-section02 .img-block02 {
		position: absolute;
		bottom: initial;
		left: initial;
		right: -30px;
		top: 76px;
	}

	.main-section02 .img-block01 img:nth-child(3) {
		position: absolute;
		top: 560px;
		left: -34px;
		z-index: 2;
	}

	.main-section02 .img-block01 img:nth-child(4) {
		position: absolute;
		top: 715px;
		left: 29px;
		z-index: 1;
	}

	.main-section03 {
		background: url('/resource/images/m-main-09.png');
		height: 1817px;
		position: relative;
		display: flex;
		justify-content: center;
		flex-wrap: wrap;
	}

	.main-section03 .txt-block01 {
		position: absolute;
		text-align: right;
		top: 181px;
		right: 68px;
	}

	.main-section03 .txt-block01 p {
		font-family: 'Noto Sans KR';
		font-size: 60px;
		font-weight: bold;
		font-stretch: normal;
		font-style: normal;
		margin-bottom: 40px;
		letter-spacing: -3px;
		text-align: right;
		color: #fff;
	}

	.main-section03 .txt-block01 span {
		font-family: 'Noto Sans KR';
		font-size: 30px;
		font-weight: 300;
		font-stretch: normal;
		font-style: normal;
		line-height: 1.5;
		letter-spacing: -1.5px;
		text-align: right;
		color: #fff;
	}

	.main-section03 .team {
		flex-wrap: wrap;
		padding-top: 622px;
		padding-right: 69px;
	}
	
	.main-section03 .team div {
		width: 50%;
		display: flex;
		justify-content: flex-start;
		align-items: flex-end;
		flex-direction: column;
		padding-right: 0;
		text-align: right;
        margin-bottom: -135px;
	}

	.main-section03 .team div p {
		font-family: 'Lato';
		font-size: 30px;
		font-weight: bold;
		font-stretch: normal;
		font-style: normal;
		margin-bottom: 42px;
		letter-spacing: normal;
		text-align: right;
		color: #fefefe;
	}

	.main-section03 .team div ul li { 
		font-family: 'Lato';
		font-size: 26px;
		font-weight: normal;
		font-stretch: normal;
		font-style: normal;
		line-height: 1.31;
		letter-spacing: normal;
		text-align: right;
		color: rgba(254, 254, 254, 0.23);
	}

    .txt-ceo {
        font-family: 'Lato';
        font-size: 24px;
        font-weight: 200;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.42;
        letter-spacing: normal;
        text-align: right;
        color: #fefefe;
    }

	.main-section04 {
		height: 463px;
		display: flex;
		justify-content: center;
		align-items: center;
		flex-wrap: wrap;
		flex-direction: column;
	}

	.main-section04 p {
		font-family: 'Noto Sans KR';
		font-size: 60px;
		font-weight: bold;
		font-stretch: normal;
		font-style: normal;
		letter-spacing: -3px;
		text-align: left;
		color: #333;
		margin-bottom: 48px;
	}

	.main-section04 span {
		font-family: 'Noto Sans KR';
		font-size: 30px;
		font-weight: 400;
		font-stretch: normal;
		font-style: normal;
		line-height: 1.5;
		letter-spacing: -1.5px;
		text-align: center;
		color: #333;
	}

	.main-section05 {
		background: url(/resource/images/m-img-service-01.png);
		display: flex;
		height: 1538px;
		background-color: #333333;
		transition: background-image 1s ease;
		flex-direction: column;
	}

	.main-section05 .inner {
		width: 100%;
		display: flex;
		justify-content: flex-start;
		align-items: center;
		flex-direction: column;
		padding-top: 141px;
		padding-right: 0;
		text-align: center;
		border-right: none;
		border-bottom: 1px solid #ffffff43;
		height: 385px;
		padding-left: 0;
	}

	.main-section05 .inner div:first-child p {
		font-family: 'Noto Sans KR';
		font-size: 50px;
		font-weight: bold;
		font-stretch: normal;
		font-style: normal;
		line-height: 0.68;
		letter-spacing: -2.5px;
		text-align: center;
		color: #fefefe;
		margin-bottom: 46px;
	}

	.main-section05 .inner div:first-child span {
		font-family: 'Lato';
		font-size: 30px;
		font-weight: 500;
		font-stretch: normal;
		font-style: normal;
		line-height: 1.13;
		letter-spacing: normal;
		text-align: center;
		color: rgba(254, 254, 254, 0.36);
	}

    /* 홈페이지 제작 */
    .homepage-section01 {
        padding: 75px 67px !important;
    }

    .homepage-section01 .txt-block01 span:first-child {
        font-family: 'Noto Sans KR';
        font-size: 28px;
        font-weight: bold;
        font-stretch: normal;
        font-style: normal;
        letter-spacing: normal;
        text-align: center;
        color: #333;
        display: block;
        margin-bottom: 20px;
        position: relative;
    }

    .homepage-section01 .txt-block01 span:first-child::before {
        position: absolute;
        top: 27%;
        left: -45px;
        width: 1px;
        height: 27px;
        margin-top: -5px;
        background-color: #ccc;
        content: '';
    }
    
    .homepage-section01 .txt-block01 span:first-child::after {
        position: absolute;
        top: 27%;
        right: -45px;
        width: 1px;
        height: 27px;
        margin-top: -5px;
        background-color: #ccc;
        content: '';
    }
    
    .homepage-section01 .txt-block01 span:nth-child(2) {
        font-family: 'Lato';
        font-size: 28px;
        font-weight: bold;
        font-stretch: normal;
        font-style: normal;
        letter-spacing: normal;
        text-align: center;
        color: #d1d1d1;
    }

    .homepage-section01 .txt-block03 {
        display: flex;
        justify-content: center;
        margin-top: 113px;
        flex-direction: column;
        align-items: center;
    }

    .homepage-section01 .txt-block03 div p {
        text-align: center;
    }

    .homepage-section01 .txt-block03 div span {
        font-family: 'Noto Sans KR';
        font-size: 30px;
        font-weight: 500;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.5;
        letter-spacing: -1.5px;
        text-align: center;
        color: #333;
        display: block;
    }

    .homepage-section01 .txt-block03 .circle {
        width: 23px;
        height: 23px;
        background-color: #3886c8;
        border-radius: 50%;
        margin-top: 58px;
        margin-left: 84px;
        margin-right: 84px;
        margin-bottom: 40px;
    }

    .homepage-section01 .txt-block04 span {
        font-family: 'Noto Sans KR';
        font-size: 40px;
        font-weight: bold;
        font-stretch: normal;
        font-style: normal;
        line-height: 0.63;
        letter-spacing: -2px;
        text-align: center;
        color: #333;
        display: block;
        margin-top: 153px;
        margin-bottom: 55px;
    }

    .homepage-step-box {
        display: flex;
        flex-direction: column;
    }

    .homepage-step-top {
        background-image: url("/resource/images/m-marketing-03.png");
        margin-bottom: 10px;
        height: 111px;
        display: flex;
        justify-content: center;
        align-items: center;
    }

    .homepage-step-top-black {
        height: 111px;
        display: flex;
        justify-content: center;
        align-items: center;
        background-color: #333;
    }

    .homepage-step-top-black span {
        font-family: 'Noto Sans KR';
        font-size: 30px;
        font-weight: normal;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.5;
        letter-spacing: -1.5px;
        text-align: center;
        color: #fff;
    }

    .homepage-step-top span:first-child {
        font-family: 'Lato';
        font-size: 29.5px;
        font-weight: bold;
        font-stretch: normal;
        font-style: normal;
        line-height: 0.83;
        letter-spacing: -1.48px;
        text-align: center;
        color: rgba(255, 255, 255, 0.35);
        margin-right: 24px;
    }

    .homepage-step-top span:nth-child(2) {
        font-family: 'Noto Sans KR';
        font-size: 29.5px;
        font-weight: bold;
        font-stretch: normal;
        font-style: normal;
        line-height: 0.83;
        letter-spacing: -1.48px;
        text-align: center;
        color: #fff;
    }

    .homepage-step-bottom {
        width: 100%;
        min-height: 239px;
        display: flex;
        background-color: #f3efea;
        box-sizing: border-box;
        justify-content: center;
        align-items: center;
        padding: 63px 46px 63px 46px;
    }

    .homepage-step-bottom.mb {
        margin-bottom: 30px;
    }

    .homepage-step-bottom span {
        font-family: 'Noto Sans KR';
        font-size: 30px;
        font-weight: normal;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.5;
        letter-spacing: -2px;
        text-align: left;
        color: #333;
    }

    .homepage-section02 {
        height: 3236px;
        background: linear-gradient(to bottom, #3b95e1, #7b4fc3);
        padding-top: 123px !important;
        padding-bottom: 200px !important;
        padding-left: 68px !important;
        padding-right: 68px !important;
        box-sizing: border-box;
    }

    .homepage-section02 .inner {
        max-width: 1300px;
        margin: 0 auto;
        box-sizing: border-box;
        width: 100%;
        padding: 0;
        position: relative;
        display: flex;
        flex-direction: column;
        align-items: center;
    }

    .homepage-section02 .txt-block01 {
        font-family: 'Noto Sans KR';
        font-size: 40px;
        font-weight: bold;
        font-stretch: normal;
        font-style: normal;
        line-height: 0.63;
        letter-spacing: -2px;
        text-align: center;
        color: #fff;
        display: block;
        margin-bottom: 67px;
    }
    
    .box-homepage-team {
        display: flex;
        flex-direction: column;
        width: 497px;
        position: initial;
        box-shadow: 25px 30px 15px 0px #00000069;
    }

    .box-homepage-team .txt-block01 {
        background: #fff;
        padding: 69px 0 0 50px;
        height: 350px;
        box-sizing: border-box;
        margin-bottom: 0;
    }

    .box-homepage-team .txt-block01 p {
        font-family: 'Noto Sans KR';
        font-size: 30px;
        font-weight: bold;
        font-stretch: normal;
        font-style: normal;
        line-height: 1;
        letter-spacing: -1.5px;
        text-align: left;
        color: #333;
        margin-bottom: 26px;
    }

    .box-homepage-team .txt-block01 span {
        font-family: 'Noto Sans KR';
        font-size: 26px;
        font-weight: 400;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.54;
        letter-spacing: -1.3px;
        text-align: left;
        color: #333;
    }

    .box-homepage-team.item_2, .box-homepage-team.item_3 {
        margin-top: 100px;
    }

    .homepage-section03 .txt-block01 span {
        font-family: 'Noto Sans KR';
        font-size: 40px;
        font-weight: bold;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.3;
        letter-spacing: -2px;
        text-align: center;
        color: #333;
    }

    .homepage-section03 .img-block01 {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        padding: 0 67px;
    }

    .homepage-section03 .img-block01 .item {
        margin-right: 0;
        margin-bottom: 68px;
        width: 100%;
        margin-bottom: 30px;
        height: 275px;
        position: relative;
        border: 1px solid #d7d7d7;
        display: flex;
        justify-content: center;
        align-items: center;
    }

    .homepage-section03 .img-block01 .item img {
        position: relative;
        right: initial;
        top: initial;
        margin-right: 30px;
    }

    .homepage-section03 .img-block01 .item div {
        position: relative;
        left: initial;
        top: initial;
        width: calc(100% - 196px);
    }

    .homepage-section03 .img-block01 .item div p {
        font-family: 'Noto Sans KR';
        font-size: 30px;
        font-weight: bold;
        font-stretch: normal;
        font-style: normal;
        line-height: 1;
        letter-spacing: -1.5px;
        text-align: left;
        color: #333;
    }

    .homepage-section03 .img-block01 .item div span {
        font-family: 'Noto Sans KR';
        font-size: 26px;
        font-weight: 400;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.54;
        letter-spacing: -1.3px;
        text-align: left;
        color: #333;
    }

	/* 유지보수 */


    .maintain-section01 .txt-block01 span:first-child {
        font-family: 'Noto Sans KR';
        font-size: 28px;
        font-weight: bold;
        font-stretch: normal;
        font-style: normal;
        letter-spacing: normal;
        text-align: center;
        color: #333;
        display: block;
        margin-bottom: 20px;
        position: relative;
    }

    .maintain-section01 .txt-block01 span:first-child::before {
        position: absolute;
        top: 27%;
        left: -45px;
        width: 1px;
        height: 27px;
        margin-top: -5px;
        background-color: #ccc;
        content: '';
    }
    
    .maintain-section01 .txt-block01 span:first-child::after {
        position: absolute;
        top: 27%;
        right: -45px;
        width: 1px;
        height: 27px;
        margin-top: -5px;
        background-color: #ccc;
        content: '';
    }
    
    .maintain-section01 .txt-block01 span:nth-child(2) {
        font-family: 'Lato';
        font-size: 28px;
        font-weight: bold;
        font-stretch: normal;
        font-style: normal;
        letter-spacing: normal;
        text-align: center;
        color: #d1d1d1;
    }

    .maintain-section01 .txt-block02 {
        font-size: 35px;
        font-weight: 400;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.43;
        letter-spacing: -2.25px;
        text-align: center;
        color: #333;
    }

    .maintain-section01 {
        padding-top: 0 !important;
        padding-bottom: 139px !important;
        padding-left: 67px !important;
        padding-right: 67px !important;
    }

    .maintain-section01 .img-block01 {
        display: flex;
        flex-direction: column;
    }

    .maintain-section01 .img-block01 .item {
        margin-right: 0px;
        width: 100%;
        margin-bottom: 39px;
        height: 452px;
    }

    .maintain-section01 .img-block01 .item:last-child {
        height: 496px;
    }

    .maintain-section01 .img-block01 .item div {
        position: absolute;
        left: 58px;
        top: 207px;
    }

    .maintain-section01 .img-block01 .item div span:first-child {
        font-size: 30px;
        margin-bottom: 30px;
    }

    .maintain-section01 .img-block01 .item div span:nth-child(2) {
        font-size: 28px;
        line-height: 1.57;
    }

    .maintain-section02 {
        width: 100%;
        height: 484px;
        background: linear-gradient(to bottom, #3b95e1, #7b4fc3);
        position: relative;
    }

    .maintain-section02 img {
        position: absolute;
        top: 131px;
        left: 70%;
        transform: translateX(-70%);
    }

    .maintain-section03 {
        background: #eaeaea;
        height: 1537px;
    }
    
    .maintain-section03 .inner {
        max-width: initial;
        display: flex;
        padding-top: 209px;
        justify-content: center;
        flex-direction: column;
        padding-left: 67px;
        padding-right: 67px;
        align-items: center;
    }
    
    .maintain-section03 .inner .txt-block01 span:first-child {
        font-family: 'Noto Sans KR';
        font-size: 40px;
        font-weight: normal;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.33;
        letter-spacing: -2.25px;
        text-align: left;
        color: #333;
        display: block;
        margin-right: initial;
        margin-bottom: 66px;
    }
    
    .maintain-section03 .inner .txt-block01 span:nth-child(2) {
        font-family: 'Noto Sans KR';
        font-size: 27px;
        font-weight: 400;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.47;
        letter-spacing: -1.5px;
        text-align: left;
        color: #333;
        display: block;
        margin-bottom: 114px;
    }

    .maintain-swiper {
        width: 620px;
    }

    .maintain-section04 {
        background-color: #f8f3f1;
        padding: 114px 35px 105px;
    }

    .maintain-section04 .txt-block01 {
        font-family: 'Noto Sans KR';
        font-size: 45px;
        font-weight: bold;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.31;
        letter-spacing: -2.25px;
        text-align: center;
        color: #333;
    }

    .m-tb-maintain {
        width: 620px;
        font-family: 'Noto Sans KR';
        font-size: 30px;
        font-weight: 400;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.47;
        letter-spacing: -1.5px;
        text-align: center;
        color: #333;
        margin-bottom: 73px;
    }

    .m-tb-maintain tr:first-child {
        border-top: 1px solid #333;
    }

    .m-tb-maintain tr:first-child, .m-tb-maintain tr:nth-child(2), .m-tb-maintain tr:nth-child(4) {
        background-color: #f4eeea;
        text-align: center;
        font-weight: 500;;
    }
    
    .m-tb-maintain tr {
        border: 1px solid #cdcdcd;
        border-right: 0;
        border-left: 0;
    }
    
    .m-tb-maintain tr td {
        padding: 34px 0px;
    }

    /* 컨설팅 & 마케팅 */
    .marketing-section01 .txt-block01 {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
    }

    .marketing-section01 .txt-block01 span:first-child {
        font-family: 'Noto Sans KR';
        font-size: 28px;
        font-weight: bold;
        font-stretch: normal;
        font-style: normal;
        letter-spacing: normal;
        text-align: center;
        color: #333;
        display: block;
        margin-bottom: 20px;
        position: relative;
    }

    .marketing-section01 .txt-block01 span:first-child::before {
        position: absolute;
        top: 27%;
        left: -45px;
        width: 1px;
        height: 27px;
        margin-top: -5px;
        background-color: #ccc;
        content: '';
    }
    
    .marketing-section01 .txt-block01 span:first-child::after {
        position: absolute;
        top: 27%;
        right: -45px;
        width: 1px;
        height: 27px;
        margin-top: -5px;
        background-color: #ccc;
        content: '';
    }
    
    .marketing-section01 .txt-block01 span:nth-child(2) {
        font-family: 'Lato';
        font-size: 28px;
        font-weight: bold;
        font-stretch: normal;
        font-style: normal;
        letter-spacing: normal;
        text-align: center;
        color: #d1d1d1;
        display: block;
        width: 100%;
        margin-bottom: 95px;
    }

    .marketing-section01 {
        padding-top: 0 !important;
        padding-bottom: 83px !important;
        padding-left: 67px !important;
        padding-right: 67px !important;
    }

    .marketing-section01 .txt-block02 {
        display: flex;
        flex-direction: column;
    }

    .marketing-section01 .txt-block02 .item-block {
        border-radius: 30px;
        border: 5px solid transparent;
        background-image: linear-gradient(#fff, #fff), 
        linear-gradient(to right, #68aae2 0%,  #7a50c3 100%);
        background-origin: border-box;
        background-clip: content-box, border-box;
        display: flex;
        justify-content: center;
        align-items: center;
        height: 82px;
        margin-bottom: 25px;
    }

    .marketing-section01 .txt-block02 .item-block:last-child {
        margin-bottom: 146px;
    }

    .marketing-section01 .txt-block02 .item-block span {
        font-family: 'Noto Sans KR';
        font-size: 25px;
        font-weight: 600;
        font-stretch: normal;
        font-style: normal;
        line-height: 1;
        letter-spacing: -1.25px;
        text-align: center;
        color: #333;
    }

    .marketing-section01 .txt-block03 {
        font-family: 'Noto Sans KR';
        font-size: 34px;
        font-weight: normal;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.43;
        letter-spacing: -1.75px;
        text-align: center;
        color: #333;
    }

    .marketing-section02 {
        padding-top: 0 !important;
        padding-bottom: 139px !important;
        padding-left: 67px !important;
        padding-right: 67px !important;
    }

    .marketing-step-box {
        display: flex;
        flex-direction: column;
    }

    .marketing-step-top {
        background-image: url("/resource/images/m-marketing-03.png");
        margin-bottom: 10px;
        height: 111px;
        display: flex;
        justify-content: center;
        align-items: center;
    }

    .marketing-step-top span {
        font-family: 'Lato';
        font-size: 30px;
        font-weight: bold;
        font-stretch: normal;
        font-style: normal;
        letter-spacing: -1.5px;
        color: #fff;
    }

    .marketing-step-bottom {
        width: 100%;
        min-height: 239px;
        display: flex;
        background-color: #f3efea;
        box-sizing: border-box;
        justify-content: center;
        align-items: center;
        margin-bottom: 10px;
        padding: 83px 0 83px 0;
    }

    .marketing-step-bottom.mb {
        margin-bottom: 30px;
    }

    .marketing-step-bottom span {
        font-family: 'Noto Sans KR';
        font-size: 30px;
        font-weight: normal;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.5;
        letter-spacing: -1.5px;
        text-align: center;
        color: #333;
    }

    .marketing-section02 .txt-block03 {
        font-family: 'Noto Sans KR';
        font-size: 30px;
        font-weight: normal;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.67;
        letter-spacing: -1.5px;
        text-align: center;
        color: #333;
        margin-top: 100px;
    }

    .marketing-section03 {
        padding-top: 0 !important;
        padding-bottom: 157px !important;
        padding-left: 110px !important;
        padding-right: 110px !important;
    }

    .marketing-section03 .img-block01 {
        display: flex;
        flex-direction: column;
    }

    .marketing-section03 .img-block01 .item {
        margin-right: 0px;
        width: 100%;
        margin-bottom: 27px;
        height: 340px;
        position: relative;
        border: 1px solid #b6b6b6;
    }

    .marketing-section03 .img-block01 .item img {
        position: absolute;
        right: 41px;
        top: 43px;
    }

    .marketing-section03 .img-block01 .item div {
        position: absolute;
        left: 62px;
        top: 217px;
    }

    .marketing-section03 .img-block01 .item div span {
        font-family: 'Noto Sans KR';
        font-size: 30px;
        font-weight: bold;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.4;
        letter-spacing: -1.5px;
        text-align: left;
        color: #333;
    }
    
    .marketing-section04 {
        height: 3100px;
        /*background-image: url("/resource/images/m-marketing-11.png");*/
        padding-top: 160px !important;
        padding-bottom: 157px !important;
        padding-left: 68px !important;
        padding-right: 68px !important;
        box-sizing: border-box;
        background: linear-gradient(to bottom, #3b95e1, #7b4fc3);
    }

    .marketing-section04 .txt-block01 {
        font-family: 'Lato';
        font-size: 49px;
        font-weight: 900;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.16;
        letter-spacing: -0.49px;
        text-align: center;
        color: #fff;
    }

    .marketing-section04 .txt-block02 {
        font-family: 'Noto Sans KR';
        font-size: 30px;
        font-weight: normal;
        font-stretch: normal;
        font-style: normal;
        line-height: 0.83;
        letter-spacing: -1.5px;
        text-align: center;
        color: #fff;
        display: block;
        margin-top: 37px;
        margin-bottom: 85px;
    }

    .box-marketing-package {
        display: flex;
        flex-wrap: wrap;
    }

    .marketing-package {
        width: 282px;
        margin-bottom: 49px;
        display: flex;
        flex-direction: column;
        justify-content: flex-start;
        align-items: center;
        height: 379px;
    }

    .marketing-package img {
        width: 100%;
    }

    .box-marketing-package .marketing-package:nth-child(odd) {
        margin-right: 20px;
    }

    .marketing-package span {
        font-family: 'Noto Sans KR';
        font-size: 30px;
        font-weight: normal;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.1;
        letter-spacing: -1.5px;
        text-align: center;
        color: #fff;
        display: block;
        margin-top: 31px;
    }

    .marketing-section04 .txt-block03 {
        border-top: 1px solid #ffffff50;
        padding-top: 73px;
    }

    .marketing-section04 .txt-block03 span {
        font-family: 'Noto Sans KR';
        font-size: 28px;
        font-weight: normal;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.57;
        letter-spacing: -1.9px;
        text-align: left;
        color: #fff;
    }

    .marketing-section04 .txt-block03 .ul-marker-- li::before {
        left: 1px;
        top: 3px;
        color: #fff;
        font-size: 28px;
    }

	[id*="modal"] .modal-bg {
		background-color: rgba(0,0,0,0.8);
	}
	[id*="modal"] .modal-wrap {
		padding:0 30px;
	}
	[id*="modal"] .modal-wrap [class*="close"] {
		top: -80px;
		right: 20px;
		font-size: 60px;
	}


	#partner h3 {
		position: static;
		margin-bottom: 30px;
		transform: rotate(0);
	}
	#partner .box {
		width: 100%;
		margin:0 auto;
	}
	#partner .box p {
		font-size: 25px;
	}
	#partner .box ul {
		width: 88%;
	}
	#partner .box ul li {
		width: 50%;
	}
	#partner .box ul li img {
		width: 100%;
		max-width: 100%;
	}

	#map {
		width: 100%;
	}
	#map .address h4 {
		font-size: 42px;
	}
	#map .address .box {
		flex-flow: column;
	}
	#map .address .box p {
		width: 100%;
		font-size: 25px;
	}
	#map .address .box table {
		width: 100%;
		margin-top: 20px;
	}
	#map .address .box th {
		width: 230px;
		font-size: 25px;
	}
	#map .address .box td {
		font-size: 25px;
	}
	#map .contact .box {
		flex-flow: column;
	}
	#map .contact .box p {
		width: 100%;
		margin-bottom: 20px;
		font-size: 25px;
	}

	.hire-info {
		padding:20px 30px;
	}
	.hire-info li p {
		padding: 15px 20px;
		font-size: 28px;
	}

	.hire-info li span {
		padding: 15px 20px;
		font-size: 28px;
	}

	.privacy_box {
		padding:0;
		border:0;
		font-size: 26px;
	}
	.privacy_box textarea.form-control {
		font-size: 22px;
		line-height: 1.5;
	}

	.label-radio {
		width: 45%;
		padding:0 2.25%;
		font-size: 26px;
	}
	.label-radio input {
		width: 20px;
		height: 20px;
	}
}