.header-part.hp {position:fixed; top:0; left:0; width:100%; padding:10px 30px; background:none; border-bottom:none;}
.header-part.hp .header-content {max-width:100%; padding:44px 30px; border-radius:20px;}
.header-part.hp.active .header-content {background:rgba(0, 0, 0, 0.3); backdrop-filter: blur(6px);}

.header-part.hp .navbar-part {width: auto; margin-left:auto; background:none;}
.header-part.hp .navbar-content {gap:40px;}
.header-part.hp .navbar-item > .navbar-link {color:#fff;}

/*==============================
	풋터
==============================*/
.hpdemo .footer-part {padding-top:0; padding-right:0; padding-left:0;}
.footer-part .ft_top {padding:20px var(--gutter-x); background:#253268; border:none;}
.footer-part .ft_top .container {justify-content: center;}
.hpdemo .footer-part .ft_menu a{color:#fff; font-size:1rem;}
.ft_bottom {padding:30px 20px 30px;}
.hpdemo .footer-part .container {align-items:flex-start; flex-wrap:wrap;}

/*==============================
	메인페이지
==============================*/
.main .inner-section {margin-bottom:0; padding:120px 0; text-align:center;}

/*메인이미지*/
.main_visual {position:relative; height:790px; margin-bottom:0; background:#ddd; color:#fff; text-align:center;}
.main_visual:before {position:absolute; top:0; left:0; z-index:2; display:block; content:""; width:100%; height:160px; background: linear-gradient(0deg, rgba(0, 0, 0, 0.0), rgba(0, 0, 0, 0.3));}
.main_visual .swiper {height:100%;}
.main_visual .swiper-slide {display:flex; align-items:center; justify-content:center; overflow:hidden;}
.main_visual .bg_img {position:absolute; bottom:0; left:50%; transform: translateX(-50%); z-index:-1;}
.swiper-button-next:after,
.swiper-button-prev:after {content:url(/themes/greenpos/pro/resources/images/arrow_wh.webp)!important;}{content:url(/themes/greenpos/pro/resources/images/arrow_wh.webp)!important;}
.swiper-button-prev:after {transform:rotate(180deg);}
.main_visual .text_wrap {width:100%; font-size:24px; font-weight:500;}
.main_visual h1 {margin-bottom:10px; font-size:68px; font-weight:700; letter-spacing:-1px; line-height: 1.35;}
.main_visual h1 strong {display:block; font-weight:700; color:#32E5F9;}
.main_visual .btn_wrap {display:flex; gap:10px; justify-content:center; margin-top:122px;}
.main_visual a {display:flex; align-items:center; justify-content:center; width:190px; height:62px; background:rgba(0, 0, 0, 0.2);  border:1px solid #fff;  border-radius:50px; color:#fff;  backdrop-filter: blur(4px);}
.main_visual a:hover {border:1px solid #fff; background:rgba(255, 255, 255, 0.1);}

/*메인 컨텐츠*/
.m_tit {margin-bottom:60px;}
.m_tit h2 span {display:block; margin-bottom:4px; color:#325CE6; font-size:var(--fsize20); font-weight:700;}
.m_tit > * {font-size:50px; color:var(--black)!important; font-weight:700;}
.m_tit > * > strong {color:#2C68FF; font-weight:inherit;}

.m_sec1 .conts_wrap {max-width:100%; padding-left:0; padding-right:0;}
.m_sec1 .m_tit {margin-bottom:90px;}
.m_sec1 .m_tit h2 span {margin-bottom:16px; color:#BCBCBC; font-size:38px;}
.m_sec1 .list_wrap {background:url('/themes/greenpos/pro/resources/images/msec1_bg.webp') no-repeat; background-position:center left calc(50% + 150px);  border:none;}
.m_sec1 .list_wrap ul {display:flex; justify-content:space-between; width:100%; max-width:1200px; margin:0 auto;}
.m_sec1 .list_wrap li {display:flex; align-items:center; justify-content:center; width:380px; aspect-ratio:1; color:#fff; font-size:30px; font-weight:700; border-radius:100%; line-height:1.3;}
.m_sec1 .list_wrap li:first-child {background:url('/themes/greenpos/pro/resources/images/msec1_img1.webp') no-repeat}
.m_sec1 .list_wrap li:nth-child(2) {background:url('/themes/greenpos/pro/resources/images/msec1_img2.webp') no-repeat}
.m_sec1 .list_wrap li:last-child {background:url('/themes/greenpos/pro/resources/images/msec1_img3.webp') no-repeat}

.m_sec2 {background:#f6f6f6;}
.m_sec2 ul {display:flex; gap:30px;}
.m_sec2 li {width:33.33%; padding:50px 30px; border-radius:40px; color:#fff;}
.m_sec2 li:first-child {background:#00C59D;}
.m_sec2 li:nth-child(2) {background:#283D88;}
.m_sec2 li:last-child {background:#0C7FC7;}
.m_sec2 li dl {margin-top:60px; text-align:left;}
.m_sec2 li dt {margin-bottom:6px; font-size:var(--fsize26); font-weight:700;}
.m_sec2 li dd {font-weight:500;}

.m_sec3 .outer {display:flex; gap:5%;}
.m_sec3 .txt_wrap {width:50%;}
.m_sec3 .img_wrap {position:relative; width:50%; border-radius:20px;  overflow:hidden;}
.m_sec3 .img_wrap a {position:absolute; bottom:50px; left:50px; color:#fff; font-weight:700; font-size:30px;}
.m_sec3 .img_box {position:relative; width:100%; height:100%; text-align:center;}
.m_sec3 .img_box img{height:100%;}
.m_sec3 .img_box img.active{ opacity:1; z-index:1; }
.m_sec3 .txt_wrap .swiper-wrapper {flex-wrap:wrap!important; align-content: flex-start!important; gap:10px!important; width:100%;}
.m_sec3 .txt_wrap .swiper-slide {display:flex; align-items:center; justify-content: center; width:fit-content!important; min-width:150px; height:54px; padding:12px 30px; border:1px solid #84A9FF; border-radius:50px; color:var(--black); font-weight:600; cursor:pointer;}
.m_sec3 .txt_wrap .swiper-slide-thumb-active {background:#3366FF; border:1px solid #3366FF; color:#fff;}
.m_sec3 .swiper-button-next,
.m_sec3 .swiper-button-prev {display:none;}

.m_sec4 {background:#f6f6f6;}
.m_sec4 .conts_wrap {max-width:100%; padding-left:0; padding-right:0;}
.m_sec4 .swiper-slide {align-self: stretch; height: auto;  padding:30px; background:#fff; border-radius:30px; text-align:left;}
.m_sec4 .swiper_btm {position:relative; display:flex; align-items:center; gap:20px;width:100%; max-width:var(--container-w); margin:0 auto; margin-top:60px;}
.m_sec4 .swiper-pagination {position:relative; height: 6px; border-radius: 50px; overflow: hidden;}
.m_sec4 .swiper_btm a {display:flex; align-items:center; justify-content:center; width:120px; height:42px; border-radius:50px; border:1px solid #ddd; color:var(--black);}
.m_sec4 .swiper-horizontal>.swiper-scrollbar, 
.m_sec4 .swiper-scrollbar.swiper-scrollbar-horizontal {position: relative; left: auto; bottom: auto; top: auto; z-index: 50; height:8px; width: 100%;}
.swiper-scrollbar-drag {position: relative; background-color:#3366FF!important; cursor:pointer;}
.m_sec4 .tag {margin-bottom:60px; color:#254EDB; font-weight:700;}
.m_sec4 dt a {margin-bottom:10px; font-size:var(--fsize22); color:var(--black); font-weight:600; overflow: hidden; white-space: normal; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; word-break: keep-all;}
.m_sec4 dd a {color:var(--text); overflow: hidden; white-space: normal; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; word-break: keep-all;}

.m_sec5 .accordion {border-bottom:1px solid #ddd;}
.m_sec5 .accordion-item {padding:30px 10px; border-top:1px solid #ddd; text-align:left;}
.m_sec5 .accordion-button {display:flex; align-items:flex-start; gap:10px; font-size:var(--fsize20); color:var(--black); font-weight:600;}
.m_sec5 .accordion-button span {color:#798BFF;}
.m_sec5 .accordion-body {color:var(--text);}
.m_sec5 .btn_wrap {display:flex; justify-content:center;  gap:10px; margin-top:60px;}
.m_sec5 .btn_wrap a {display:flex; align-items:center; justify-content:center; height:56px; padding:10px 40px; background:#E9E9E9; border-radius:50px; color:var(--black); font-weight:500;}
.m_sec5 .btn_wrap a:last-child {background:#283AFD; color:#fff;}

/*==============================
	서브
==============================*/
.single-banner {display:flex; align-items:center; justify-content:center; height:460px; margin-bottom:120px; padding:0 var(--gutter-x); background:url('/themes/greenpos/pro/resources/images/sub_visual.webp') no-repeat; color:#fff;}
.notice .single-banner,
.faq .single-banner {background:url('/themes/greenpos/pro/resources/images/sub_visual.webp') no-repeat;}

.single-banner h1, 
.single-banner h2 {color:#fff; font-size:54px;}
.breadcrumb {margin-top:20px;}
.breadcrumb-item {font-size:1rem;}
.breadcrumb-item a {color:#f6f6f6;}
.breadcrumb .active {color:#fff;}
.breadcrumb-item:first-child:before {content:"\f0fd"; font: var(--fa-font-solid); margin-right:10px;}

@media (max-width: 1200px) {
	.header-part.hp {padding: 10px 10px;}
	.header-part.hp .header-content {padding: 44px 20px;}
	.header-part.hp .navbar-content {gap: 20px;}

	/**/
	.m_sec1 .conts_wrap > * {padding-left:var(--gutter-x); padding-right:var(--gutter-x);}
	.m_sec1 .list_wrap ul {justify-content:center; gap:10px;}
	.m_sec1 .list_wrap li {width:300px; word-break:keep-all;}
	.m_sec2 ul {gap:10px; word-break:keep-all;}

	.m_sec4 .swiper_btm {padding-left:var(--gutter-x); padding-right:var(--gutter-x);}
	

}

@media (max-width:992px) {
	:root {
		--fsize-tit : 28px;
		--fsize-s : 12px;
		--fsize-txt3 : 18px;	
		--ftit-d2 : 20px;
		--fsize26: 20px;
		--fsize24: 18px;
		--fsize22 : 20px;
		--fsize20: 18px;
		--fsize18:16px;
		--fsize14 : 12px;
	}

	html, 
	body {font-size:14px;}
	.header-part.hp .header-user i, 
	.header-part.hp .header-src i {color:#fff;}
	
	.nav-header a img {height:36px;}

	.ft_logo {height:38px;}
	 .hpdemo .backtop {bottom: 100px;}

	/**/
	.main_visual {height:680px;}
	.main_visual .text_wrap {font-size:18px;}
	.main_visual h1 {font-size:42px;}
	.main_visual .btn_wrap {margin-top:60px;}

	.inner-section {padding:60px 0;}
	.m_tit {margin-bottom:40px;}
	.m_tit > * {font-size:32px;}
	.m_sec1 .m_tit {margin-bottom:40px;}
	.m_sec1 .m_tit h2 span {font-size:24px;}
	.m_sec1 .list_wrap li {font-size:18px;}

	.m_sec2 img {height:70px;}
	.m_sec2 li {padding: 30px 20px;}
	.m_sec2 li dl {margin-top: 20px;}

	.m_sec3 .outer {gap:10px;}
	.m_sec3 .txt_wrap .swiper-slide {min-width:auto; padding:20px; height:48px;}
	.m_sec3 .img_wrap {height:320px;}
	.m_sec3 .img_wrap a {bottom: 20px; left: 20px; font-size: 22px;}
	

	

}

@media (max-width:576px) {
	.header-part.hp .header-content {padding:20px 0px;}

	/**/
	.main_visual {height: 640px;}
	.main_visual .bg_img {height:100%;}
	.main_visual img {height:100%;}

	.m_sec1 .m_tit strong {display:block;}
	.m_sec1 .list_wrap ul {flex-direction:column; align-items:center;}
    .m_sec1 .list_wrap li {width:230px;}

	.m_sec2 ul {flex-direction:column;}
	.m_sec2 li {width:100%; border-radius: 30px;}
	.m_sec2 li dl { text-align:center;}

	.m_sec3 .outer {flex-direction:column;}
	.m_sec3 .txt_wrap,
	.m_sec3 .img_wrap {width:100%;}
	.m_sec3 .txt_wrap .swiper-wrapper {gap:4px!important;}
	.m_sec3 .txt_wrap .swiper-slide {height:38px; padding: 10px;}
	.m_sec3 .img_wrap {height:306px;}
	.m_sec3 .img_wrap a {bottom: auto; top: 20px;}

	.m_sec5 .accordion-item {padding:20px 10px;}
	.m_sec5 .btn_wrap {margin-top:20px;}
	.m_sec5 .btn_wrap a {height:48px; padding:10px 20px;}
	
}